npm - @zanichelli/albe-web-components - Versions diffs - 14.5.1 → 14.5.2-rc-anchor-navigation - Mend

@zanichelli/albe-web-components 14.5.1 → 14.5.2-rc-anchor-navigation

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1744) hide show

package/dist/collection/components/z-panel-elem/index.js ADDED Viewed

@@ -0,0 +1,197 @@
+import { h } from "@stencil/core";
+/**
+ * @slot `descrSlotName` - description content
+ */
+export class ZPanelElem {
+    constructor() {
+        this.elemid = undefined;
+        this.imgurl = undefined;
+        this.imgalt = undefined;
+        this.linkicon = undefined;
+        this.linklabel = undefined;
+        this.url = undefined;
+        this.target = "_blank";
+        this.isdisabled = false;
+        this.descrSlotName = undefined;
+    }
+    render() {
+        const elemId = this.elemid ? this.elemid : "";
+        return (h("div", { key: 'bbae0bd29656529b2019a66668d6dfbf66b9b0a1', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '620411ca326a5975d3cc21549cfc51a7d7eea519', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '79a77af32280e5f1e58f794f07c1365da1fa30a7', src: this.imgurl, alt: this.imgalt }))), h("div", { key: '67ad3e575caab6d93bf8d0a17de138ae59fffb35', class: "panel-elem-link" }, h("a", { key: 'f79f44642cbceefd484bbe63e4af6ea03d197fec', class: {
+                "z-link": true,
+                "z-link-disabled": this.isdisabled,
+                "z-link-icon": true,
+            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: '0f112223c94273b9baa33da513c60a51dba33e7b', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '4ae5da7e8a2a92be4c801790a90b6907e7ffe6b3', class: "panel-elem-desc" }, h("slot", { key: '4c4e6872a2fe1cb443002a004b5aa1ce18a8f96f', name: this.descrSlotName })))));
+    }
+    static get is() { return "z-panel-elem"; }
+    static get encapsulation() { return "scoped"; }
+    static get originalStyleUrls() {
+        return {
+            "$": ["styles.css"]
+        };
+    }
+    static get styleUrls() {
+        return {
+            "$": ["styles.css"]
+        };
+    }
+    static get properties() {
+        return {
+            "elemid": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "html element id (optional)"
+                },
+                "attribute": "elemid",
+                "reflect": false
+            },
+            "imgurl": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "image url source (optional)"
+                },
+                "attribute": "imgurl",
+                "reflect": false
+            },
+            "imgalt": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "alternative image text (optional)"
+                },
+                "attribute": "imgalt",
+                "reflect": false
+            },
+            "linkicon": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "icon link name (optional)"
+                },
+                "attribute": "linkicon",
+                "reflect": false
+            },
+            "linklabel": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "link label text"
+                },
+                "attribute": "linklabel",
+                "reflect": false
+            },
+            "url": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [],
+                    "text": "link url"
+                },
+                "attribute": "url",
+                "reflect": false
+            },
+            "target": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "link target (optional)"
+                },
+                "attribute": "target",
+                "reflect": false,
+                "defaultValue": "\"_blank\""
+            },
+            "isdisabled": {
+                "type": "boolean",
+                "mutable": false,
+                "complexType": {
+                    "original": "boolean",
+                    "resolved": "boolean",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "disabled status flag (optional)"
+                },
+                "attribute": "isdisabled",
+                "reflect": false,
+                "defaultValue": "false"
+            },
+            "descrSlotName": {
+                "type": "string",
+                "mutable": false,
+                "complexType": {
+                    "original": "string",
+                    "resolved": "string",
+                    "references": {}
+                },
+                "required": false,
+                "optional": true,
+                "docs": {
+                    "tags": [],
+                    "text": "name of slot container (optional)"
+                },
+                "attribute": "descr-slot-name",
+                "reflect": false
+            }
+        };
+    }
+}
+//# sourceMappingURL=index.js.map

package/dist/collection/components/z-panel-elem/index.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-panel-elem/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAEjD;;GAEG;AAOH,MAAM,OAAO,UAAU;;;;;;;;sBA2BH,QAAQ;0BAIH,KAAK;;;IAM5B,MAAM;QACJ,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC;QAE9C,OAAO,CACL,4DAAK,KAAK,EAAC,sBAAsB;YAC9B,CAAC,IAAI,CAAC,MAAM,IAAI,IAAI,CAAC,MAAM,CAAC,IAAI,CAC/B,2EACc,MAAM,EAClB,KAAK,EAAC,iBAAiB;gBAEvB,4DACE,GAAG,EAAE,IAAI,CAAC,MAAM,EAChB,GAAG,EAAE,IAAI,CAAC,MAAM,GAChB,CACE,CACP;YACD,4DAAK,KAAK,EAAC,iBAAiB;gBAC1B,0DACE,KAAK,EAAE;wBACL,QAAQ,EAAE,IAAI;wBACd,iBAAiB,EAAE,IAAI,CAAC,UAAU;wBAClC,aAAa,EAAE,IAAI;qBACpB,EACD,EAAE,EAAE,MAAM,GAAG,SAAS,EACtB,IAAI,EAAE,IAAI,CAAC,GAAG,EACd,MAAM,EAAE,IAAI,CAAC,MAAM;oBAEnB,+DACE,MAAM,EAAE,EAAE,EACV,KAAK,EAAE,EAAE,EACT,IAAI,EAAE,IAAI,CAAC,QAAQ,GACX;oBACT,IAAI,CAAC,SAAS,CACb,CACA;YACL,IAAI,CAAC,aAAa,IAAI,CACrB,4DAAK,KAAK,EAAC,iBAAiB;gBAC1B,6DAAM,IAAI,EAAE,IAAI,CAAC,aAAa,GAAI,CAC9B,CACP,CACG,CACP,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Prop, h} from \"@stencil/core\";\n\n/**\n * @slot `descrSlotName` - description content\n */\n@Component({\n tag: \"z-panel-elem\",\n styleUrl: \"styles.css\",\n shadow: false,\n scoped: true,\n})\nexport class ZPanelElem {\n /** html element id (optional) */\n @Prop()\n elemid?: string;\n\n /** image url source (optional) */\n @Prop()\n imgurl?: string;\n\n /** alternative image text (optional) */\n @Prop()\n imgalt?: string;\n\n /** icon link name (optional) */\n @Prop()\n linkicon?: string;\n\n /** link label text*/\n @Prop()\n linklabel: string;\n\n /** link url */\n @Prop()\n url: string;\n\n /** link target (optional) */\n @Prop()\n target?: string = \"_blank\";\n\n /** disabled status flag (optional) */\n @Prop()\n isdisabled?: boolean = false;\n\n /** name of slot container (optional) */\n @Prop()\n descrSlotName?: string;\n\n render(): HTMLDivElement {\n const elemId = this.elemid ? this.elemid : \"\";\n\n return (\n <div class=\"panel-elem-container\">\n {(this.imgurl || this.imgalt) && (\n <div\n aria-hidden=\"true\"\n class=\"panel-elem-icon\"\n >\n <img\n src={this.imgurl}\n alt={this.imgalt}\n />\n </div>\n )}\n <div class=\"panel-elem-link\">\n <a\n class={{\n \"z-link\": true,\n \"z-link-disabled\": this.isdisabled,\n \"z-link-icon\": true,\n }}\n id={elemId + \"link_id\"}\n href={this.url}\n target={this.target}\n >\n <z-icon\n height={14}\n width={14}\n name={this.linkicon}\n ></z-icon>\n {this.linklabel}\n </a>\n </div>\n {this.descrSlotName && (\n <div class=\"panel-elem-desc\">\n <slot name={this.descrSlotName} />\n </div>\n )}\n </div>\n );\n }\n}\n"]}

package/dist/collection/components/z-panel-elem/index.spec.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../src/components/z-panel-elem/index.spec.ts"],"names":[],"mappings":"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","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZPanelElem} from \"./index\";\n\ndescribe(\"Suite test ZPanelElem\", () => {\n it(\"Test render ZPanelElem vuoto\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem>\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" id=\"link_id\" target=\"_blank\">\n <z-icon height=\"14\" width=\"14\"></z-icon>\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with only mandatory params\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"link_id\" target=\"_blank\">\n <z-icon height=\"14\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with elemid\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" id=\"examplelink_id\" href=\"http://www.google.it\" id=\"link_id\" target=\"_blank\">\n <z-icon height=\"14\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with elemid and isdisabled\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem isdisabled elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem isdisabled elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-disabled z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_blank\">\n <z-icon height=\"14\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with target=_self\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem target=\"_self\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem target=\"_self\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with linkicon\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_blank\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgurl\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem imgurl=\"exampleImgUrl\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem imgurl=\"exampleImgUrl\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img src=\"exampleImgUrl\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_blank\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgurl and target=_self\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem imgurl=\"exampleImgUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem imgurl=\"exampleImgUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img src=\"exampleImgUrl\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgalt\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem imgalt=\"exampleDesc\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem imgalt=\"exampleDesc\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img alt=\"exampleDesc\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_blank\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgalt and target=_self\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem imgalt=\"exampleDesc\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem imgalt=\"exampleDesc\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img alt=\"exampleDesc\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with icon and slot name\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem descr-slot-name=\"slotname\" imgurl=\"exampleUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\"></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem descr-slot-name=\"slotname\" imgurl=\"exampleUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img src=\"exampleUrl\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n <div class=\"panel-elem-desc\">\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with icon and complete slot data\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem descrSlotName=\"slotname\" imgurl=\"exampleUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ><div class=\"panel-elem-desc\"> <span slot=\"slotname\">Full application description</span> </div></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem descrslotname=\"slotname\" imgurl=\"exampleUrl\" target=\"_self\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-desc\">\n <span slot=\"slotname\">Full application description</span>\n </div>\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img src=\"exampleUrl\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgurl and isdisabled\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem isdisabled imgurl=\"exampleImgUrl\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" ></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem isdisabled imgurl=\"exampleImgUrl\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img src=\"exampleImgUrl\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon z-link-disabled\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_blank\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n\n it(\"Test render ZPanelElem with imgalt and isdisabled\", async () => {\n const page = await newSpecPage({\n components: [ZPanelElem],\n html: `<z-panel-elem isdisabled imgalt=\"exampleAlt\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" target=\"_self\"></z-panel-elem>`,\n });\n\n expect(page.root).toEqualHtml(`\n <z-panel-elem isdisabled imgalt=\"exampleAlt\" linkicon=\"example\" elemid=\"example\" linklabel=\"label\" url=\"http://www.google.it\" target=\"_self\">\n <div class=\"panel-elem-container\">\n <div aria-hidden=\"true\" class=\"panel-elem-icon\">\n <img alt=\"exampleAlt\" />\n </div>\n <div class=\"panel-elem-link\">\n <a class=\"z-link z-link-icon z-link-disabled\" href=\"http://www.google.it\" id=\"examplelink_id\" target=\"_self\">\n <z-icon height=\"14\" name=\"example\" width=\"14\"></z-icon>\n label\n </a>\n </div>\n </div>\n </z-panel-elem>\n `);\n });\n});\n"]}

package/dist/collection/components/z-panel-elem/index.stories.js ADDED Viewed

@@ -0,0 +1,26 @@
+import { html } from "lit";
+import "./index";
+const StoryMeta = {
+    title: "ZPanelElem",
+    component: "z-panel-elem",
+    args: {
+        imgurl: "https://staticdemomy.zanichelli.it/download/biblioteca.png",
+        linkicon: "arrow-quad-down",
+        linklabel: "Biblioteca",
+        url: "https://biblioteca.scuola.zanichelli.it/",
+        elemid: "elem_id",
+        isdisabled: false,
+    },
+};
+export default StoryMeta;
+export const Default = {
+    render: (args) => html `<z-panel-elem
+      imgurl="${args.imgurl}"
+      linkicon="${args.linkicon}"
+      linklabel="${args.linklabel}"
+      url="${args.url}"
+      elemid="${args.elemid}"
+      isdisabled="${args.isdisabled}"
+    ></z-panel-elem>`,
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-panel-elem/index.stories.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-panel-elem/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,cAAc;IACzB,IAAI,EAAE;QACJ,MAAM,EAAE,4DAA4D;QACpE,QAAQ,EAAE,iBAAiB;QAC3B,SAAS,EAAE,YAAY;QACvB,GAAG,EAAE,0CAA0C;QAC/C,MAAM,EAAE,SAAS;QACjB,UAAU,EAAE,KAAK;KAClB;CACyB,CAAC;AAC7B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;gBACQ,IAAI,CAAC,MAAM;kBACT,IAAI,CAAC,QAAQ;mBACZ,IAAI,CAAC,SAAS;aACpB,IAAI,CAAC,GAAG;gBACL,IAAI,CAAC,MAAM;oBACP,IAAI,CAAC,UAAU;qBACd;CACW,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZPanelElem} from \".\";\nimport \"./index\";\n\nconst StoryMeta = {\n title: \"ZPanelElem\",\n component: \"z-panel-elem\",\n args: {\n imgurl: \"https://staticdemomy.zanichelli.it/download/biblioteca.png\",\n linkicon: \"arrow-quad-down\",\n linklabel: \"Biblioteca\",\n url: \"https://biblioteca.scuola.zanichelli.it/\",\n elemid: \"elem_id\",\n isdisabled: false,\n },\n} satisfies Meta<ZPanelElem>;\nexport default StoryMeta;\n\nexport const Default = {\n render: (args) =>\n html`<z-panel-elem\n imgurl=\"${args.imgurl}\"\n linkicon=\"${args.linkicon}\"\n linklabel=\"${args.linklabel}\"\n url=\"${args.url}\"\n elemid=\"${args.elemid}\"\n isdisabled=\"${args.isdisabled}\"\n ></z-panel-elem>`,\n} satisfies StoryObj<ZPanelElem>;\n"]}

package/dist/collection/components/z-popover/index.js CHANGED Viewed

@@ -1,5 +1,5 @@
 import { h } from "@stencil/core";
-import { PopoverPosition, KeyboardCode } from "../../beans";
+import { KeyboardCode, PopoverPosition } from "../../beans";
 const DOCUMENT_ELEMENT = document.documentElement;
 function getParentElement(element) {
     if (element.parentNode.host) {
@@ -301,7 +301,7 @@ export class ZPopover {
         this.onOpen();
     }
     render() {
-        return h("slot", { key: 'fc1d26a6af4fb99ea37da14628dfe730f4a5fd94' });
+        return h("slot", { key: 'a7a3830d93abc15bc7138815f9820bc8cda7ab35' });
     }
     static get is() { return "z-popover"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-popover/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/z-popover/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Prop, h, Watch, Listen, Element, State, Event, EventEmitter} from \"@stencil/core\";\nimport {PopoverPosition, KeyboardCode} from \"../../beans\";\n\nconst DOCUMENT_ELEMENT = document.documentElement;\n\nfunction getParentElement(element: Element): ShadowRoot[\"host\"] {\n if ((element.parentNode as ShadowRoot).host) {\n return (element.parentNode as ShadowRoot).host;\n }\n\n return element.parentNode as Element;\n}\n\n/*\n Find the closest scrollable parent of a node.\n \n @param {Element} element The node\n /\nfunction findScrollableParent(element: Element): Element {\n let parent = getParentElement(element);\n\n while (parent && parent !== DOCUMENT_ELEMENT) {\n const {overflow, overflowX, overflowY} = window.getComputedStyle(parent);\n if (overflow === \"hidden\" \|\| overflowY === \"hidden\" \|\| overflowX === \"hidden\") {\n return parent;\n }\n\n if (\n (parent.scrollHeight > parent.clientHeight && overflow !== \"visible\" && overflowY !== \"visible\") \|\|\n (parent.scrollWidth > parent.clientWidth && overflow !== \"visible\" && overflowX !== \"visible\")\n ) {\n return parent;\n }\n\n parent = getParentElement(parent);\n }\n\n return DOCUMENT_ELEMENT;\n}\n\n/\n Calculate computed offset.\n * It includes matrix transformations.\n * @param element The target element.\n * @param targetParentOffset The relative offset parent.\n * @return A client rect object.\n /\nfunction computeOffset(element: HTMLElement, targetParentOffset?: HTMLElement): Record<string, number> {\n const rect = element.getBoundingClientRect();\n const width = rect.width;\n const height = rect.height;\n\n let top = 0;\n let left = 0;\n let offsetParent = element;\n while (offsetParent && offsetParent != targetParentOffset) {\n left += offsetParent.offsetLeft;\n\n // document.body sometimes has offsetTop == 0 but still has an\n // offset because of children margins!\n if (offsetParent === document.body) {\n top += offsetParent.getBoundingClientRect().top + window.scrollY;\n } else {\n top += offsetParent.offsetTop;\n }\n\n if (window.DOMMatrix) {\n const style = window.getComputedStyle(offsetParent);\n const transform = style.transform \|\| style.webkitTransform;\n const domMatrix = new DOMMatrix(transform);\n if (domMatrix) {\n left += domMatrix.m41;\n if (offsetParent !== document.body) {\n top += domMatrix.m42;\n }\n }\n }\n\n if (!offsetParent.offsetParent) {\n break;\n }\n\n offsetParent = offsetParent.offsetParent as HTMLElement;\n }\n\n let parentWidth: number;\n let parentHeight: number;\n if (offsetParent === document.body) {\n parentWidth = window.innerWidth;\n parentHeight = window.innerHeight;\n } else {\n parentWidth = offsetParent.offsetWidth;\n parentHeight = offsetParent.offsetHeight;\n }\n\n const right = parentWidth - left - rect.width;\n const bottom = parentHeight - top - rect.height;\n\n return {top, right, bottom, left, width, height};\n}\n\n/\n Popover component.\n \n @cssprop --z-popover-theme--surface - background color of the popover.\n * @cssprop --z-popover-theme--text - foreground color of the popover.\n * @cssprop --z-popover-padding - padding of the popover.\n * @cssprop --z-popover-shadow-filter - drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n /\n@Component({\n tag: \"z-popover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZPopover {\n /* Popover position. /\n @Prop({reflect: true})\n position: PopoverPosition = PopoverPosition.AUTO;\n\n /\n The open state of the popover.\n /\n @Prop({reflect: true, mutable: true})\n open = false;\n\n /\n The selector or the element bound with the popover.\n * If string css selector is provided make sure to use a valid selector.\n /\n @Prop()\n bindTo?: string \| HTMLElement;\n\n /\n Whether to show popover's arrow.\n /\n @Prop({reflect: true})\n showArrow = false;\n\n /\n Whether to center the popup on the main side (according to \"position\").\n /\n @Prop({reflect: true})\n center = false;\n\n /\n If true, the popover can be closed by clicking outside of it or pressing the escape key.\n * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n /\n @Prop()\n closable = true;\n\n /\n The current position of the popover.\n /\n @State()\n currentPosition?: PopoverPosition;\n\n /\n Position change event.\n /\n @Event()\n positionChange: EventEmitter;\n\n /\n Open change event.\n /\n @Event()\n openChange: EventEmitter;\n\n @Element() host: HTMLZPopoverElement;\n\n private animationFrameRequestId?: number;\n\n @Listen(\"keyup\", {target: \"window\"})\n closePopoverWithKeyboard(e: KeyboardEvent): void {\n if (this.closable && e.key === KeyboardCode.ESC) {\n this.open = false;\n }\n }\n\n /\n Close the popover when clicking outside of its content.\n * Stop event propagation if the click was fired by popover's trigger element,\n * to prevent close and reopen glitches.\n * @param {MouseEvent} e\n /\n @Listen(\"click\", {target: \"body\", capture: true})\n handleOutsideClick(e: MouseEvent): void {\n if (!this.closable \|\| !this.open) {\n return;\n }\n\n if (!e.composedPath().includes(this.host)) {\n const target = e.target as HTMLElement;\n const triggerElemClicked =\n this.bindTo instanceof HTMLElement ? this.bindTo.contains(target) : target.closest(this.bindTo);\n if (triggerElemClicked) {\n e.stopPropagation();\n }\n\n this.open = false;\n this.positionChange.emit({position: this.currentPosition});\n }\n }\n\n @Watch(\"position\")\n validatePosition(newValue: PopoverPosition): void {\n if (newValue && !Object.values(PopoverPosition).includes(newValue as PopoverPosition)) {\n this.position = PopoverPosition.AUTO;\n }\n\n this.currentPosition = this.position;\n this.positionChange.emit({position: this.currentPosition});\n }\n\n /\n Setup popover behaviors on opening.\n /\n @Watch(\"open\")\n onOpen(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n if (this.open) {\n const setPosition = (): void => {\n if (this.open) {\n this.setPosition();\n this.animationFrameRequestId = requestAnimationFrame(setPosition);\n }\n };\n\n setPosition();\n } else if (this.host.hasAttribute(\"current-position\")) {\n this.host.removeAttribute(\"current-position\");\n this.currentPosition = undefined;\n }\n\n this.openChange.emit({open: this.open});\n }\n\n disconnectedCallback(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n }\n\n /\n Set the position of the popover.\n /\n private setPosition(): void {\n let element: HTMLElement;\n if (typeof this.bindTo === \"string\") {\n element = this.host.ownerDocument.querySelector(this.bindTo) as HTMLElement;\n } else if (this.bindTo) {\n element = this.bindTo;\n } else {\n element = this.host.parentElement as HTMLElement;\n }\n\n if (!element) {\n return;\n }\n\n const scrollContainer = findScrollableParent(element) as HTMLElement;\n const scrollingBoundingRect = scrollContainer.getBoundingClientRect();\n const offsetContainer = this.host.offsetParent as HTMLElement;\n\n const relativeBoundingRect = offsetContainer\n ? computeOffset(offsetContainer, scrollContainer)\n : {top: 0, right: 0, bottom: 0, left: 0};\n const boundingRect = computeOffset(element, scrollContainer);\n\n const top = boundingRect.top - scrollContainer.scrollTop;\n const bottom = scrollingBoundingRect.height - (boundingRect.top + boundingRect.height) + scrollContainer.scrollTop;\n const left = boundingRect.left - scrollContainer.scrollLeft;\n const right = scrollingBoundingRect.width - (boundingRect.left + boundingRect.width) + scrollContainer.scrollLeft;\n\n const overflowBottom = Math.max(0, scrollingBoundingRect.top + scrollingBoundingRect.height - window.innerHeight);\n const overflowRight = Math.max(0, scrollingBoundingRect.left + scrollingBoundingRect.width - window.innerWidth);\n\n const availableTop = Math.min(top, top + scrollingBoundingRect.top);\n const availableBottom = Math.min(bottom, bottom - overflowBottom);\n const availableLeft = Math.min(left, left + scrollingBoundingRect.left);\n const availableRight = Math.min(right, right - overflowRight);\n\n const availableHeight = availableTop + availableBottom + boundingRect.height;\n const availableWidth = availableLeft + availableRight + boundingRect.width;\n\n let position = this.currentPosition;\n const positions: PopoverPosition[] = [];\n if (this.position === PopoverPosition.AUTO) {\n /\n The `AUTO` position tries to place the popover in the 'safest' area,\n * where there's more space available.\n /\n if (availableLeft / availableWidth > 0.6) {\n positions.push(PopoverPosition.LEFT);\n } else if (availableLeft / availableWidth < 0.4) {\n positions.push(PopoverPosition.RIGHT);\n }\n\n if (availableTop / availableHeight > 0.9) {\n positions.unshift(PopoverPosition.TOP);\n } else if (availableTop / availableHeight > 0.6) {\n positions.push(PopoverPosition.TOP);\n } else if (availableTop / availableHeight < 0.1) {\n positions.unshift(PopoverPosition.BOTTOM);\n } else {\n positions.push(PopoverPosition.BOTTOM);\n }\n\n position = positions.join(\"_\") as PopoverPosition;\n }\n\n const style = this.host.style;\n style.position = \"absolute\";\n\n const offsetTop = boundingRect.top - relativeBoundingRect.top;\n const offsetRight = boundingRect.right - relativeBoundingRect.right;\n const offsetBottom = boundingRect.bottom - relativeBoundingRect.bottom;\n const offsetLeft = boundingRect.left - relativeBoundingRect.left;\n const offsetModifier = this.center ? 0.5 : 0;\n const sizeModifier = this.center ? 0.5 : 0;\n\n if (position === PopoverPosition.TOP \|\| position === PopoverPosition.TOP_RIGHT) {\n style.top = \"auto\";\n style.right = \"auto\";\n style.bottom = `${offsetBottom + boundingRect.height}px`;\n\n style.left = `${offsetLeft + boundingRect.width offsetModifier}px`;\n style.maxHeight = `${availableTop}px`;\n if (position === PopoverPosition.TOP_RIGHT) {\n style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n }\n } else if (position === PopoverPosition.TOP_LEFT) {\n style.top = \"auto\";\n style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n style.bottom = `${offsetBottom + boundingRect.height}px`;\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableTop}px`;\n } else if (position === PopoverPosition.BOTTOM \|\| position === PopoverPosition.BOTTOM_RIGHT) {\n style.top = `${offsetTop + boundingRect.height}px`;\n style.right = \"auto\";\n style.bottom = \"auto\";\n style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;\n style.maxHeight = `${availableBottom}px`;\n if (position === PopoverPosition.BOTTOM_RIGHT) {\n style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n }\n } else if (position === PopoverPosition.BOTTOM_LEFT) {\n style.top = `${offsetTop + boundingRect.height}px`;\n style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n style.bottom = \"auto\";\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableBottom}px`;\n } else if (position === PopoverPosition.RIGHT \|\| position === PopoverPosition.RIGHT_BOTTOM) {\n style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n style.right = \"auto\";\n style.bottom = \"auto\";\n style.left = `${offsetLeft + boundingRect.width}px`;\n style.maxWidth = `${availableRight}px`;\n style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.RIGHT_TOP) {\n style.top = \"auto\";\n style.right = \"auto\";\n style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n style.left = `${offsetLeft + boundingRect.width}px`;\n style.maxWidth = `${availableRight}px`;\n style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.LEFT \|\| position === PopoverPosition.LEFT_BOTTOM) {\n style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n style.right = `${offsetRight + boundingRect.width}px`;\n style.bottom = \"auto\";\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.LEFT_TOP) {\n style.top = \"auto\";\n style.right = `${offsetRight + boundingRect.width}px`;\n style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n }\n\n this.currentPosition = position \|\| this.position;\n this.host.setAttribute(\"current-position\", this.currentPosition);\n }\n\n componentWillLoad(): void {\n this.validatePosition(this.position);\n this.onOpen();\n }\n\n render(): HTMLSlotElement {\n return <slot></slot>;\n }\n}\n"]}
1	+ {"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-popover/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode, PopoverPosition} from \"../../beans\";\n\nconst DOCUMENT_ELEMENT = document.documentElement;\n\nfunction getParentElement(element: Element): ShadowRoot[\"host\"] {\n if ((element.parentNode as ShadowRoot).host) {\n return (element.parentNode as ShadowRoot).host;\n }\n\n return element.parentNode as Element;\n}\n\n/*\n Find the closest scrollable parent of a node.\n \n @param {Element} element The node\n /\nfunction findScrollableParent(element: Element): Element {\n let parent = getParentElement(element);\n\n while (parent && parent !== DOCUMENT_ELEMENT) {\n const {overflow, overflowX, overflowY} = window.getComputedStyle(parent);\n if (overflow === \"hidden\" \|\| overflowY === \"hidden\" \|\| overflowX === \"hidden\") {\n return parent;\n }\n\n if (\n (parent.scrollHeight > parent.clientHeight && overflow !== \"visible\" && overflowY !== \"visible\") \|\|\n (parent.scrollWidth > parent.clientWidth && overflow !== \"visible\" && overflowX !== \"visible\")\n ) {\n return parent;\n }\n\n parent = getParentElement(parent);\n }\n\n return DOCUMENT_ELEMENT;\n}\n\n/\n Calculate computed offset.\n * It includes matrix transformations.\n * @param element The target element.\n * @param targetParentOffset The relative offset parent.\n * @return A client rect object.\n /\nfunction computeOffset(element: HTMLElement, targetParentOffset?: HTMLElement): Record<string, number> {\n const rect = element.getBoundingClientRect();\n const width = rect.width;\n const height = rect.height;\n\n let top = 0;\n let left = 0;\n let offsetParent = element;\n while (offsetParent && offsetParent != targetParentOffset) {\n left += offsetParent.offsetLeft;\n\n // document.body sometimes has offsetTop == 0 but still has an\n // offset because of children margins!\n if (offsetParent === document.body) {\n top += offsetParent.getBoundingClientRect().top + window.scrollY;\n } else {\n top += offsetParent.offsetTop;\n }\n\n if (window.DOMMatrix) {\n const style = window.getComputedStyle(offsetParent);\n const transform = style.transform \|\| style.webkitTransform;\n const domMatrix = new DOMMatrix(transform);\n if (domMatrix) {\n left += domMatrix.m41;\n if (offsetParent !== document.body) {\n top += domMatrix.m42;\n }\n }\n }\n\n if (!offsetParent.offsetParent) {\n break;\n }\n\n offsetParent = offsetParent.offsetParent as HTMLElement;\n }\n\n let parentWidth: number;\n let parentHeight: number;\n if (offsetParent === document.body) {\n parentWidth = window.innerWidth;\n parentHeight = window.innerHeight;\n } else {\n parentWidth = offsetParent.offsetWidth;\n parentHeight = offsetParent.offsetHeight;\n }\n\n const right = parentWidth - left - rect.width;\n const bottom = parentHeight - top - rect.height;\n\n return {top, right, bottom, left, width, height};\n}\n\n/\n Popover component.\n \n @cssprop --z-popover-theme--surface - background color of the popover.\n * @cssprop --z-popover-theme--text - foreground color of the popover.\n * @cssprop --z-popover-padding - padding of the popover.\n * @cssprop --z-popover-shadow-filter - drop-shadow filter of the popover. Defaults to `drop-shadow(0 1px 2px var(--shadow-color-base))`.\n /\n@Component({\n tag: \"z-popover\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZPopover {\n /* Popover position. /\n @Prop({reflect: true})\n position: PopoverPosition = PopoverPosition.AUTO;\n\n /\n The open state of the popover.\n /\n @Prop({reflect: true, mutable: true})\n open = false;\n\n /\n The selector or the element bound with the popover.\n * If string css selector is provided make sure to use a valid selector.\n /\n @Prop()\n bindTo?: string \| HTMLElement;\n\n /\n Whether to show popover's arrow.\n /\n @Prop({reflect: true})\n showArrow = false;\n\n /\n Whether to center the popup on the main side (according to \"position\").\n /\n @Prop({reflect: true})\n center = false;\n\n /\n If true, the popover can be closed by clicking outside of it or pressing the escape key.\n * Otherwise, it will be closed only programmatically (by setting `open` to `false`).\n /\n @Prop()\n closable = true;\n\n /\n The current position of the popover.\n /\n @State()\n currentPosition?: PopoverPosition;\n\n /\n Position change event.\n /\n @Event()\n positionChange: EventEmitter;\n\n /\n Open change event.\n /\n @Event()\n openChange: EventEmitter;\n\n @Element() host: HTMLZPopoverElement;\n\n private animationFrameRequestId?: number;\n\n @Listen(\"keyup\", {target: \"window\"})\n closePopoverWithKeyboard(e: KeyboardEvent): void {\n if (this.closable && e.key === KeyboardCode.ESC) {\n this.open = false;\n }\n }\n\n /\n Close the popover when clicking outside of its content.\n * Stop event propagation if the click was fired by popover's trigger element,\n * to prevent close and reopen glitches.\n * @param {MouseEvent} e\n /\n @Listen(\"click\", {target: \"body\", capture: true})\n handleOutsideClick(e: MouseEvent): void {\n if (!this.closable \|\| !this.open) {\n return;\n }\n\n if (!e.composedPath().includes(this.host)) {\n const target = e.target as HTMLElement;\n const triggerElemClicked =\n this.bindTo instanceof HTMLElement ? this.bindTo.contains(target) : target.closest(this.bindTo);\n if (triggerElemClicked) {\n e.stopPropagation();\n }\n\n this.open = false;\n this.positionChange.emit({position: this.currentPosition});\n }\n }\n\n @Watch(\"position\")\n validatePosition(newValue: PopoverPosition): void {\n if (newValue && !Object.values(PopoverPosition).includes(newValue as PopoverPosition)) {\n this.position = PopoverPosition.AUTO;\n }\n\n this.currentPosition = this.position;\n this.positionChange.emit({position: this.currentPosition});\n }\n\n /\n Setup popover behaviors on opening.\n /\n @Watch(\"open\")\n onOpen(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n if (this.open) {\n const setPosition = (): void => {\n if (this.open) {\n this.setPosition();\n this.animationFrameRequestId = requestAnimationFrame(setPosition);\n }\n };\n\n setPosition();\n } else if (this.host.hasAttribute(\"current-position\")) {\n this.host.removeAttribute(\"current-position\");\n this.currentPosition = undefined;\n }\n\n this.openChange.emit({open: this.open});\n }\n\n disconnectedCallback(): void {\n cancelAnimationFrame(this.animationFrameRequestId);\n }\n\n /\n Set the position of the popover.\n /\n private setPosition(): void {\n let element: HTMLElement;\n if (typeof this.bindTo === \"string\") {\n element = this.host.ownerDocument.querySelector(this.bindTo) as HTMLElement;\n } else if (this.bindTo) {\n element = this.bindTo;\n } else {\n element = this.host.parentElement as HTMLElement;\n }\n\n if (!element) {\n return;\n }\n\n const scrollContainer = findScrollableParent(element) as HTMLElement;\n const scrollingBoundingRect = scrollContainer.getBoundingClientRect();\n const offsetContainer = this.host.offsetParent as HTMLElement;\n\n const relativeBoundingRect = offsetContainer\n ? computeOffset(offsetContainer, scrollContainer)\n : {top: 0, right: 0, bottom: 0, left: 0};\n const boundingRect = computeOffset(element, scrollContainer);\n\n const top = boundingRect.top - scrollContainer.scrollTop;\n const bottom = scrollingBoundingRect.height - (boundingRect.top + boundingRect.height) + scrollContainer.scrollTop;\n const left = boundingRect.left - scrollContainer.scrollLeft;\n const right = scrollingBoundingRect.width - (boundingRect.left + boundingRect.width) + scrollContainer.scrollLeft;\n\n const overflowBottom = Math.max(0, scrollingBoundingRect.top + scrollingBoundingRect.height - window.innerHeight);\n const overflowRight = Math.max(0, scrollingBoundingRect.left + scrollingBoundingRect.width - window.innerWidth);\n\n const availableTop = Math.min(top, top + scrollingBoundingRect.top);\n const availableBottom = Math.min(bottom, bottom - overflowBottom);\n const availableLeft = Math.min(left, left + scrollingBoundingRect.left);\n const availableRight = Math.min(right, right - overflowRight);\n\n const availableHeight = availableTop + availableBottom + boundingRect.height;\n const availableWidth = availableLeft + availableRight + boundingRect.width;\n\n let position = this.currentPosition;\n const positions: PopoverPosition[] = [];\n if (this.position === PopoverPosition.AUTO) {\n /\n The `AUTO` position tries to place the popover in the 'safest' area,\n * where there's more space available.\n /\n if (availableLeft / availableWidth > 0.6) {\n positions.push(PopoverPosition.LEFT);\n } else if (availableLeft / availableWidth < 0.4) {\n positions.push(PopoverPosition.RIGHT);\n }\n\n if (availableTop / availableHeight > 0.9) {\n positions.unshift(PopoverPosition.TOP);\n } else if (availableTop / availableHeight > 0.6) {\n positions.push(PopoverPosition.TOP);\n } else if (availableTop / availableHeight < 0.1) {\n positions.unshift(PopoverPosition.BOTTOM);\n } else {\n positions.push(PopoverPosition.BOTTOM);\n }\n\n position = positions.join(\"_\") as PopoverPosition;\n }\n\n const style = this.host.style;\n style.position = \"absolute\";\n\n const offsetTop = boundingRect.top - relativeBoundingRect.top;\n const offsetRight = boundingRect.right - relativeBoundingRect.right;\n const offsetBottom = boundingRect.bottom - relativeBoundingRect.bottom;\n const offsetLeft = boundingRect.left - relativeBoundingRect.left;\n const offsetModifier = this.center ? 0.5 : 0;\n const sizeModifier = this.center ? 0.5 : 0;\n\n if (position === PopoverPosition.TOP \|\| position === PopoverPosition.TOP_RIGHT) {\n style.top = \"auto\";\n style.right = \"auto\";\n style.bottom = `${offsetBottom + boundingRect.height}px`;\n\n style.left = `${offsetLeft + boundingRect.width offsetModifier}px`;\n style.maxHeight = `${availableTop}px`;\n if (position === PopoverPosition.TOP_RIGHT) {\n style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n }\n } else if (position === PopoverPosition.TOP_LEFT) {\n style.top = \"auto\";\n style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n style.bottom = `${offsetBottom + boundingRect.height}px`;\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableTop}px`;\n } else if (position === PopoverPosition.BOTTOM \|\| position === PopoverPosition.BOTTOM_RIGHT) {\n style.top = `${offsetTop + boundingRect.height}px`;\n style.right = \"auto\";\n style.bottom = \"auto\";\n style.left = `${offsetLeft + boundingRect.width * offsetModifier}px`;\n style.maxHeight = `${availableBottom}px`;\n if (position === PopoverPosition.BOTTOM_RIGHT) {\n style.maxWidth = `${availableRight + boundingRect.width * sizeModifier}px`;\n }\n } else if (position === PopoverPosition.BOTTOM_LEFT) {\n style.top = `${offsetTop + boundingRect.height}px`;\n style.right = `${offsetRight + boundingRect.width * offsetModifier}px`;\n style.bottom = \"auto\";\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableBottom}px`;\n } else if (position === PopoverPosition.RIGHT \|\| position === PopoverPosition.RIGHT_BOTTOM) {\n style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n style.right = \"auto\";\n style.bottom = \"auto\";\n style.left = `${offsetLeft + boundingRect.width}px`;\n style.maxWidth = `${availableRight}px`;\n style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.RIGHT_TOP) {\n style.top = \"auto\";\n style.right = \"auto\";\n style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n style.left = `${offsetLeft + boundingRect.width}px`;\n style.maxWidth = `${availableRight}px`;\n style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.LEFT \|\| position === PopoverPosition.LEFT_BOTTOM) {\n style.top = `${offsetTop + boundingRect.height * offsetModifier}px`;\n style.right = `${offsetRight + boundingRect.width}px`;\n style.bottom = \"auto\";\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableBottom + boundingRect.height * sizeModifier}px`;\n } else if (position === PopoverPosition.LEFT_TOP) {\n style.top = \"auto\";\n style.right = `${offsetRight + boundingRect.width}px`;\n style.bottom = `${offsetBottom + boundingRect.height * offsetModifier}px`;\n style.left = \"auto\";\n style.maxWidth = `${availableLeft}px`;\n style.maxHeight = `${availableTop + boundingRect.height * sizeModifier}px`;\n }\n\n this.currentPosition = position \|\| this.position;\n this.host.setAttribute(\"current-position\", this.currentPosition);\n }\n\n componentWillLoad(): void {\n this.validatePosition(this.position);\n this.onOpen();\n }\n\n render(): HTMLSlotElement {\n return <slot></slot>;\n }\n}\n"]}

package/dist/collection/components/z-popover/index.stories.js ADDED Viewed

@@ -0,0 +1,103 @@
+import { html } from "lit";
+import { styleMap } from "lit/directives/style-map.js";
+import { PopoverPosition } from "../../beans";
+import { getColorTokenArgConfig } from "../../utils/storybook-utils";
+import "../z-button/index";
+import "../z-icon/index";
+import "./index";
+import "./index.stories.css";
+/**
+ * To be sure the AUTO algorithm finds the right container when calculating the position, set its container's position to `position: relative;`
+ */
+const StoryMeta = {
+    title: "ZPopover",
+    component: "z-popover",
+    argTypes: {
+        "position": {
+            options: Object.values(PopoverPosition),
+            control: {
+                type: "select",
+            },
+        },
+        "--z-popover-theme--surface": getColorTokenArgConfig(),
+        "--z-popover-theme--text": getColorTokenArgConfig(),
+    },
+    args: {
+        "--z-popover-theme--surface": "var(--color-surface01)",
+        "--z-popover-theme--text": "var(--color-default-text)",
+    },
+};
+export default StoryMeta;
+export const ContextualMenuLike = {
+    args: {
+        position: PopoverPosition.RIGHT_BOTTOM,
+    },
+    render: (args) => html `
+    <div class="popover-container">
+      <z-popover
+        style=${styleMap({
+        "--z-popover-theme--surface": args["--z-popover-theme--surface"],
+        "--z-popover-theme--text": args["--z-popover-theme--text"],
+    })}
+        .position=${args.position}
+        bind-to="#trigger"
+      >
+        <div class="container">
+          <z-button icon="gear">Impostazioni</z-button>
+        </div>
+      </z-popover>
+      <z-icon
+        id="trigger"
+        name="plus-square-filled"
+      ></z-icon>
+    </div>
+    <script>
+      var iconTrigger = document.querySelector("#trigger");
+      var popover = document.querySelector("z-popover");
+      iconTrigger.addEventListener("click", () => {
+        if (popover.open) {
+          popover.open = false;
+        } else {
+          popover.open = true;
+        }
+      });
+    </script>
+  `,
+};
+export const TooltipLike = {
+    args: {
+        position: PopoverPosition.RIGHT,
+    },
+    render: (args) => html `
+    <div class="popover-container popover-container-tooltip">
+      <z-popover
+        style=${styleMap({
+        "--z-popover-theme--surface": args["--z-popover-theme--surface"],
+        "--z-popover-theme--text": args["--z-popover-theme--text"],
+    })}
+        .position=${args.position}
+        center="true"
+        show-arrow="true"
+        bind-to="#trigger"
+      >
+        <div class="container">
+          <z-button icon="gear">Impostazioni</z-button>
+        </div>
+      </z-popover>
+      <z-icon
+        id="trigger"
+        name="plus-square-filled"
+      ></z-icon>
+    </div>
+    <script>
+      document.querySelector("#trigger").addEventListener("click", () => {
+        if (document.querySelector("z-popover").open) {
+          document.querySelector("z-popover").open = false;
+        } else {
+          document.querySelector("z-popover").open = true;
+        }
+      });
+    </script>
+  `,
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-popover/index.stories.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-popover/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAErD,OAAO,EAAC,eAAe,EAAC,MAAM,aAAa,CAAC;AAC5C,OAAO,EAAmB,sBAAsB,EAAC,MAAM,6BAA6B,CAAC;AACrF,OAAO,mBAAmB,CAAC;AAC3B,OAAO,iBAAiB,CAAC;AACzB,OAAO,SAAS,CAAC;AACjB,OAAO,qBAAqB,CAAC;AAE7B;;GAEG;AACH,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,UAAU;IACjB,SAAS,EAAE,WAAW;IACtB,QAAQ,EAAE;QACR,UAAU,EAAE;YACV,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,eAAe,CAAC;YACvC,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,4BAA4B,EAAE,sBAAsB,EAAE;QACtD,yBAAyB,EAAE,sBAAsB,EAAE;KACpD;IACD,IAAI,EAAE;QACJ,4BAA4B,EAAE,wBAAwB;QACtD,yBAAyB,EAAE,2BAA2B;KACvD;CACoG,CAAC;AAExG,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC,IAAI,EAAE;QACJ,QAAQ,EAAE,eAAe,CAAC,YAAY;KACvC;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;;gBAGR,QAAQ,CAAC;QACf,4BAA4B,EAAE,IAAI,CAAC,4BAA4B,CAAC;QAChE,yBAAyB,EAAE,IAAI,CAAC,yBAAyB,CAAC;KAC3D,CAAC;oBACU,IAAI,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;GAuB9B;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,WAAW,GAAG;IACzB,IAAI,EAAE;QACJ,QAAQ,EAAE,eAAe,CAAC,KAAK;KAChC;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;;gBAGR,QAAQ,CAAC;QACf,4BAA4B,EAAE,IAAI,CAAC,4BAA4B,CAAC;QAChE,yBAAyB,EAAE,IAAI,CAAC,yBAAyB,CAAC;KAC3D,CAAC;oBACU,IAAI,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;GAuB9B;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {styleMap} from \"lit/directives/style-map.js\";\nimport {type ZPopover} from \".\";\nimport {PopoverPosition} from \"../../beans\";\nimport {CSSVarsArguments, getColorTokenArgConfig} from \"../../utils/storybook-utils\";\nimport \"../z-button/index\";\nimport \"../z-icon/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\n/**\n * To be sure the AUTO algorithm finds the right container when calculating the position, set its container's position to `position: relative;`\n */\nconst StoryMeta = {\n title: \"ZPopover\",\n component: \"z-popover\",\n argTypes: {\n \"position\": {\n options: Object.values(PopoverPosition),\n control: {\n type: \"select\",\n },\n },\n \"--z-popover-theme--surface\": getColorTokenArgConfig(),\n \"--z-popover-theme--text\": getColorTokenArgConfig(),\n },\n args: {\n \"--z-popover-theme--surface\": \"var(--color-surface01)\",\n \"--z-popover-theme--text\": \"var(--color-default-text)\",\n },\n} satisfies Meta<ZPopover & CSSVarsArguments<\"--z-popover-theme--surface\" | \"--z-popover-theme--text\">>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZPopover>;\n\nexport const ContextualMenuLike = {\n args: {\n position: PopoverPosition.RIGHT_BOTTOM,\n },\n render: (args) => html`\n <div class=\"popover-container\">\n <z-popover\n style=${styleMap({\n \"--z-popover-theme--surface\": args[\"--z-popover-theme--surface\"],\n \"--z-popover-theme--text\": args[\"--z-popover-theme--text\"],\n })}\n .position=${args.position}\n bind-to=\"#trigger\"\n >\n <div class=\"container\">\n <z-button icon=\"gear\">Impostazioni</z-button>\n </div>\n </z-popover>\n <z-icon\n id=\"trigger\"\n name=\"plus-square-filled\"\n ></z-icon>\n </div>\n <script>\n var iconTrigger = document.querySelector(\"#trigger\");\n var popover = document.querySelector(\"z-popover\");\n iconTrigger.addEventListener(\"click\", () => {\n if (popover.open) {\n popover.open = false;\n } else {\n popover.open = true;\n }\n });\n </script>\n `,\n} satisfies Story;\n\nexport const TooltipLike = {\n args: {\n position: PopoverPosition.RIGHT,\n },\n render: (args) => html`\n <div class=\"popover-container popover-container-tooltip\">\n <z-popover\n style=${styleMap({\n \"--z-popover-theme--surface\": args[\"--z-popover-theme--surface\"],\n \"--z-popover-theme--text\": args[\"--z-popover-theme--text\"],\n })}\n .position=${args.position}\n center=\"true\"\n show-arrow=\"true\"\n bind-to=\"#trigger\"\n >\n <div class=\"container\">\n <z-button icon=\"gear\">Impostazioni</z-button>\n </div>\n </z-popover>\n <z-icon\n id=\"trigger\"\n name=\"plus-square-filled\"\n ></z-icon>\n </div>\n <script>\n document.querySelector(\"#trigger\").addEventListener(\"click\", () => {\n if (document.querySelector(\"z-popover\").open) {\n document.querySelector(\"z-popover\").open = false;\n } else {\n document.querySelector(\"z-popover\").open = true;\n }\n });\n </script>\n `,\n} satisfies Story;\n"]}