@zanichelli/zanichelli-it-frontend-kit 0.0.1-rc.0

package/dist/components/z-stepper.js.map

@@ -0,0 +1 @@
+{"file":"z-stepper.js","mappings":";;AAAA,MAAM,SAAS,GAAG,mRAAmR;;MCIxRA,UAAQ,iBAAAC,kBAAA,CAAA,MAAA,QAAA,SAAAC,CAAA,CAAA;;;;;;IACjB,MAAM,GAAA;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,MAAM,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZStepper","__stencil_proxyCustomElement","HTMLElement"],"sources":["node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-stepper/styles.css?tag=z-stepper&encapsulation=shadow","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-stepper/index.js"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n  flex-direction: row;\n  padding: 0;\n  margin: 0;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n  list-style: none;\n}\n\n@media (min-width: 768px) {\n  :host {\n    padding: 0 calc(var(--space-unit) * 2);\n  }\n}\n","import { Host, h } from \"@stencil/core\";\n/**\n * @slot - slot for `z-stepper-item`\n */\nexport class ZStepper {\n    render() {\n        return (h(Host, { key: 'b4d76cddb405ccc4db532cc4d544898424b290fa', role: \"list\" }, h(\"slot\", { key: '9b7d842263cf062b5f3b8a27b72d7a66142bc341' })));\n    }\n    static get is() { return \"z-stepper\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n}\n//# sourceMappingURL=index.js.map\n"],"version":3}

package/dist/components/z-table.js

@@ -0,0 +1,69 @@
+import { p as proxyCustomElement, H, h, d as Host } from './p-Dxu5saXC.js';
+import './p-BdZZ3nCA.js';
+import './p-M8sq6nYX.js';
+import './p-CVdIKwxq.js';
+import './p-C0jAXHRM.js';
+
+const stylesCss = ":host{--z-table--cells-padding:calc(var(--space-unit) * 2);position:relative;display:block;overflow:auto;max-width:100%;box-sizing:border-box;background-color:var(--color-surface01)}:host([expandable]){--z-table--expand-button-size:40px}:host([bordered]){--z-table--cell-left-border:1px solid var(--color-surface03)}";
+
+const ZTable$1 = /*@__PURE__*/ proxyCustomElement(class ZTable extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.bordered = false;
+        this.expandable = false;
+    }
+    updateExpandable() {
+        this.expandable = this.host.querySelectorAll("z-tr[expandable]").length > 0;
+    }
+    /**
+     * Setup the table creating a mutation observer for the expandable attribute.
+     */
+    componentWillLoad() {
+        this.expandableMutationObserver = new MutationObserver(() => {
+            this.updateExpandable();
+        });
+        this.expandableMutationObserver.observe(this.host, {
+            childList: true,
+            subtree: true,
+            attributes: true,
+            attributeFilter: ["expandable"],
+            attributeOldValue: false,
+        });
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.expandableMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+    }
+    render() {
+        return (h(Host, { key: 'a37bf2d018aedf198e11248d9952c062deddc545', expandable: this.expandable }, h("div", { key: 'a769b79ee55eb5425bb6c72059437f051967c3b3', class: "table", role: "table" }, h("slot", { key: '0ba782144cc2f139484954747d530d6f1c606a0d' }))));
+    }
+    get host() { return this; }
+    static get style() { return stylesCss; }
+}, [1, "z-table", {
+        "bordered": [516],
+        "expandable": [32]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["z-table"];
+    components.forEach(tagName => { switch (tagName) {
+        case "z-table":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ZTable$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const ZTable = ZTable$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTable, defineCustomElement };
+//# sourceMappingURL=z-table.js.map
+
+//# sourceMappingURL=z-table.js.map

package/dist/components/z-table.js.map

@@ -0,0 +1 @@
+{"file":"z-table.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,8TAA8T;;MCUnUA,QAAM,iBAAAC,kBAAA,CAAA,MAAA,MAAA,SAAAC,CAAA,CAAA;AACf,IAAA,WAAA,GAAA;;;;AACI,QAAA,IAAI,CAAC,QAAQ,GAAG,KAAK;AACrB,QAAA,IAAI,CAAC,UAAU,GAAG,KAAK;AAC1B;IACD,gBAAgB,GAAA;AACZ,QAAA,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,MAAM,GAAG,CAAC;;AAE/E;;AAEG;IACH,iBAAiB,GAAA;AACb,QAAA,IAAI,CAAC,0BAA0B,GAAG,IAAI,gBAAgB,CAAC,MAAK;YACxD,IAAI,CAAC,gBAAgB,EAAE;AAC3B,SAAC,CAAC;QACF,IAAI,CAAC,0BAA0B,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;AAC/C,YAAA,SAAS,EAAE,IAAI;AACf,YAAA,OAAO,EAAE,IAAI;AACb,YAAA,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,YAAY,CAAC;AAC/B,YAAA,iBAAiB,EAAE,KAAK;AAC3B,SAAA,CAAC;;IAEN,oBAAoB,GAAA;AAChB,QAAA,IAAI,EAAE;QACN,CAAC,EAAE,GAAG,IAAI,CAAC,0BAA0B,MAAM,IAAI,IAAI,EAAE,KAAK,MAAM,GAAG,MAAM,GAAG,EAAE,CAAC,UAAU,EAAE;;IAE/F,MAAM,GAAA;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,UAAU,EAAE,IAAI,CAAC,UAAU,EAAE,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,OAAO,EAAE,IAAI,EAAE,OAAO,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,CAAC,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTable","__stencil_proxyCustomElement","HTMLElement"],"sources":["node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/table/z-table/styles.css?tag=z-table&encapsulation=shadow","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/table/z-table/index.js"],"sourcesContent":[":host {\n  --z-table--cells-padding: calc(var(--space-unit) * 2);\n\n  position: relative;\n  display: block;\n  overflow: auto;\n  max-width: 100%;\n  box-sizing: border-box;\n  background-color: var(--color-surface01);\n}\n\n:host([expandable]) {\n  --z-table--expand-button-size: 40px;\n}\n\n:host([bordered]) {\n  --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n","import { Host, h } from \"@stencil/core\";\nimport \"../z-tbody/index\";\nimport \"../z-tfoot/index\";\nimport \"../z-thead/index\";\nimport \"../z-tr/index\";\n/**\n * ZTable component.\n * @slot - Table content (`z-thead`, `z-tbody`, `z-tfoot`, `z-tr`).\n * @cssprop --z-table--cells-padding - Padding of the cells.\n */\nexport class ZTable {\n    constructor() {\n        this.bordered = false;\n        this.expandable = false;\n    }\n    updateExpandable() {\n        this.expandable = this.host.querySelectorAll(\"z-tr[expandable]\").length > 0;\n    }\n    /**\n     * Setup the table creating a mutation observer for the expandable attribute.\n     */\n    componentWillLoad() {\n        this.expandableMutationObserver = new MutationObserver(() => {\n            this.updateExpandable();\n        });\n        this.expandableMutationObserver.observe(this.host, {\n            childList: true,\n            subtree: true,\n            attributes: true,\n            attributeFilter: [\"expandable\"],\n            attributeOldValue: false,\n        });\n    }\n    disconnectedCallback() {\n        var _a;\n        (_a = this.expandableMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();\n    }\n    render() {\n        return (h(Host, { key: 'a37bf2d018aedf198e11248d9952c062deddc545', expandable: this.expandable }, h(\"div\", { key: 'a769b79ee55eb5425bb6c72059437f051967c3b3', class: \"table\", role: \"table\" }, h(\"slot\", { key: '0ba782144cc2f139484954747d530d6f1c606a0d' }))));\n    }\n    static get is() { return \"z-table\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"bordered\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Whether the table cells should show a border between them.\"\n                },\n                \"attribute\": \"bordered\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"expandable\": {}\n        };\n    }\n    static get elementRef() { return \"host\"; }\n}\n//# sourceMappingURL=index.js.map\n"],"version":3}

package/dist/components/z-tag.js

@@ -0,0 +1,9 @@
+import { Z as ZTag$1, d as defineCustomElement$1 } from './p-CjYpA4EJ.js';
+
+const ZTag = ZTag$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTag, defineCustomElement };
+//# sourceMappingURL=z-tag.js.map
+
+//# sourceMappingURL=z-tag.js.map

package/dist/components/z-tag.js.map

@@ -0,0 +1 @@
+{"file":"z-tag.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-tbody.js

@@ -0,0 +1,9 @@
+import { Z as ZTbody$1, d as defineCustomElement$1 } from './p-BdZZ3nCA.js';
+
+const ZTbody = ZTbody$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTbody, defineCustomElement };
+//# sourceMappingURL=z-tbody.js.map
+
+//# sourceMappingURL=z-tbody.js.map

package/dist/components/z-tbody.js.map

@@ -0,0 +1 @@
+{"file":"z-tbody.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-td.js

@@ -0,0 +1,9 @@
+import { Z as ZTd$1, d as defineCustomElement$1 } from './p-Du5IymMo.js';
+
+const ZTd = ZTd$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTd, defineCustomElement };
+//# sourceMappingURL=z-td.js.map
+
+//# sourceMappingURL=z-td.js.map

package/dist/components/z-td.js.map

@@ -0,0 +1 @@
+{"file":"z-td.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-tfoot.js

@@ -0,0 +1,9 @@
+import { Z as ZTfoot$1, d as defineCustomElement$1 } from './p-M8sq6nYX.js';
+
+const ZTfoot = ZTfoot$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTfoot, defineCustomElement };
+//# sourceMappingURL=z-tfoot.js.map
+
+//# sourceMappingURL=z-tfoot.js.map

package/dist/components/z-tfoot.js.map

@@ -0,0 +1 @@
+{"file":"z-tfoot.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-th.js

@@ -0,0 +1,9 @@
+import { Z as ZTh$1, d as defineCustomElement$1 } from './p-BLSm2Iqv.js';
+
+const ZTh = ZTh$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZTh, defineCustomElement };
+//# sourceMappingURL=z-th.js.map
+
+//# sourceMappingURL=z-th.js.map

package/dist/components/z-th.js.map

@@ -0,0 +1 @@
+{"file":"z-th.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-thead.js

@@ -0,0 +1,9 @@
+import { Z as ZThead$1, d as defineCustomElement$1 } from './p-CVdIKwxq.js';
+
+const ZThead = ZThead$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZThead, defineCustomElement };
+//# sourceMappingURL=z-thead.js.map
+
+//# sourceMappingURL=z-thead.js.map

package/dist/components/z-thead.js.map

@@ -0,0 +1 @@
+{"file":"z-thead.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

package/dist/components/z-toast-notification-list.js

@@ -0,0 +1,79 @@
+import { p as proxyCustomElement, H, h } from './p-Dxu5saXC.js';
+import { U as ToastNotificationPosition } from './p-Bla2iV_L.js';
+
+const stylesCss = ":host{position:fixed;z-index:10000;display:flex;flex-flow:column nowrap;margin-top:calc(var(--space-unit) * 2);margin-bottom:calc(var(--space-unit) * 2);font-family:var(--font-family-sans);font-weight:var(--font-rg)}::slotted(z-toast-notification){width:100vw}::slotted(:not(:last-child)){margin-bottom:calc(var(--space-unit) * 1)}:host([position=\"bottom-centre\"]),:host([position=\"bottom-right\"]),:host([position=\"bottom-left\"]){bottom:0;align-items:flex-end;justify-content:flex-end}:host([position=\"top-left\"]),:host([position=\"top-right\"]),:host([position=\"top-centre\"]){top:0;align-items:flex-start;justify-content:flex-start}@media only screen and (min-width: 768px){:host{margin:calc(var(--space-unit) * 3)}:host([position=\"top-centre\"]){top:0;left:50%;align-items:center;justify-content:flex-start;transform:translateX(-50%)}:host([position=\"top-left\"]){top:0;left:0;align-items:flex-start;justify-content:flex-start}:host([position=\"top-right\"]){top:0;right:0;align-items:flex-end;justify-content:flex-start}:host([position=\"bottom-centre\"]){bottom:0;left:50%;align-items:center;justify-content:flex-end;transform:translateX(-50%)}:host([position=\"bottom-right\"]){right:0;bottom:0;align-items:flex-end;justify-content:flex-end}:host([position=\"bottom-left\"]){bottom:0;left:0;align-items:flex-start;justify-content:flex-end}::slotted(z-toast-notification){width:50vw}}@media only screen and (min-width: 1366px){:host{margin:calc(var(--space-unit) * 4)}::slotted(z-toast-notification){width:33vw}}";
+
+const ZToastNotificationList$1 = /*@__PURE__*/ proxyCustomElement(class ZToastNotificationList extends H {
+    constructor() {
+        super();
+        this.__registerHost();
+        this.__attachShadow();
+        this.position = ToastNotificationPosition.TOP_RIGHT;
+        this.newestontop = true;
+    }
+    watchPropNewestontop(newValue) {
+        this.hostElement.append(...this.notificationArray.reverse());
+        if (newValue) {
+            this.hostElement.shadowRoot.addEventListener("slotchange", this.slotChangeHandler);
+        }
+        else {
+            this.hostElement.shadowRoot.removeEventListener("slotchange", this.slotChangeHandler);
+        }
+    }
+    componentWillLoad() {
+        if (this.newestontop) {
+            this.handleNewestOnTop();
+        }
+    }
+    handleNewestOnTop() {
+        this.notificationArray = Array.from(this.hostElement.children);
+        this.hostElement.append(...this.notificationArray.reverse());
+        this.hostElement.shadowRoot.addEventListener("slotchange", this.slotChangeHandler.bind(this));
+    }
+    slotChangeHandler() {
+        const difference = Array.from(this.hostElement.children).filter((elem) => !this.notificationArray.includes(elem));
+        if (difference) {
+            difference.forEach((elem) => {
+                this.notificationArray.push(elem);
+                const newElem = elem;
+                elem.remove();
+                this.hostElement.prepend(newElem);
+            });
+        }
+    }
+    render() {
+        return h("slot", { key: 'a40d72d8809dbf05ddce6a05fc59fd4891cd92e7', name: "toasts" });
+    }
+    get hostElement() { return this; }
+    static get watchers() { return {
+        "newestontop": ["watchPropNewestontop"]
+    }; }
+    static get style() { return stylesCss; }
+}, [1, "z-toast-notification-list", {
+        "position": [513],
+        "newestontop": [4]
+    }, undefined, {
+        "newestontop": ["watchPropNewestontop"]
+    }]);
+function defineCustomElement$1() {
+    if (typeof customElements === "undefined") {
+        return;
+    }
+    const components = ["z-toast-notification-list"];
+    components.forEach(tagName => { switch (tagName) {
+        case "z-toast-notification-list":
+            if (!customElements.get(tagName)) {
+                customElements.define(tagName, ZToastNotificationList$1);
+            }
+            break;
+    } });
+}
+defineCustomElement$1();
+
+const ZToastNotificationList = ZToastNotificationList$1;
+const defineCustomElement = defineCustomElement$1;
+
+export { ZToastNotificationList, defineCustomElement };
+//# sourceMappingURL=z-toast-notification-list.js.map
+
+//# sourceMappingURL=z-toast-notification-list.js.map

package/dist/components/z-toast-notification-list.js.map

@@ -0,0 +1 @@
+{"file":"z-toast-notification-list.js","mappings":";;;AAAA,MAAM,SAAS,GAAG,0/CAA0/C;;MCE//CA,wBAAsB,iBAAAC,kBAAA,CAAA,MAAA,sBAAA,SAAAC,CAAA,CAAA;AAC/B,IAAA,WAAA,GAAA;;;;AACI,QAAA,IAAI,CAAC,QAAQ,GAAG,yBAAyB,CAAC,SAAS;AACnD,QAAA,IAAI,CAAC,WAAW,GAAG,IAAI;AAC1B;AACD,IAAA,oBAAoB,CAAC,QAAQ,EAAA;AACzB,QAAA,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,CAAC;QAC5D,IAAI,QAAQ,EAAE;AACV,YAAA,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC;;aAEjF;AACD,YAAA,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC;;;IAG7F,iBAAiB,GAAA;AACb,QAAA,IAAI,IAAI,CAAC,WAAW,EAAE;YAClB,IAAI,CAAC,iBAAiB,EAAE;;;IAGhC,iBAAiB,GAAA;AACb,QAAA,IAAI,CAAC,iBAAiB,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC;AAC9D,QAAA,IAAI,CAAC,WAAW,CAAC,MAAM,CAAC,GAAG,IAAI,CAAC,iBAAiB,CAAC,OAAO,EAAE,CAAC;AAC5D,QAAA,IAAI,CAAC,WAAW,CAAC,UAAU,CAAC,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;;IAEjG,iBAAiB,GAAA;AACb,QAAA,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,WAAW,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,IAAI,KAAK,CAAC,IAAI,CAAC,iBAAiB,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjH,IAAI,UAAU,EAAE;AACZ,YAAA,UAAU,CAAC,OAAO,CAAC,CAAC,IAAI,KAAI;AACxB,gBAAA,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC;gBACjC,MAAM,OAAO,GAAG,IAAI;gBACpB,IAAI,CAAC,MAAM,EAAE;AACb,gBAAA,IAAI,CAAC,WAAW,CAAC,OAAO,CAAC,OAAO,CAAC;AACrC,aAAC,CAAC;;;IAGV,MAAM,GAAA;AACF,QAAA,OAAO,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZToastNotificationList","__stencil_proxyCustomElement","HTMLElement"],"sources":["node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-toast-notification-list/styles.css?tag=z-toast-notification-list&encapsulation=shadow","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-toast-notification-list/index.js"],"sourcesContent":[":host {\n  position: fixed;\n  z-index: 10000;\n  display: flex;\n  flex-flow: column nowrap;\n  margin-top: calc(var(--space-unit) * 2);\n  margin-bottom: calc(var(--space-unit) * 2);\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n}\n\n::slotted(z-toast-notification) {\n  width: 100vw;\n}\n\n::slotted(:not(:last-child)) {\n  margin-bottom: calc(var(--space-unit) * 1);\n}\n\n:host([position=\"bottom-centre\"]),\n:host([position=\"bottom-right\"]),\n:host([position=\"bottom-left\"]) {\n  bottom: 0;\n  align-items: flex-end;\n  justify-content: flex-end;\n}\n\n:host([position=\"top-left\"]),\n:host([position=\"top-right\"]),\n:host([position=\"top-centre\"]) {\n  top: 0;\n  align-items: flex-start;\n  justify-content: flex-start;\n}\n\n/* Tablet breakpoint */\n@media only screen and (min-width: 768px) {\n  :host {\n    margin: calc(var(--space-unit) * 3);\n  }\n\n  :host([position=\"top-centre\"]) {\n    top: 0;\n    left: 50%;\n    align-items: center;\n    justify-content: flex-start;\n    transform: translateX(-50%);\n  }\n\n  :host([position=\"top-left\"]) {\n    top: 0;\n    left: 0;\n    align-items: flex-start;\n    justify-content: flex-start;\n  }\n\n  :host([position=\"top-right\"]) {\n    top: 0;\n    right: 0;\n    align-items: flex-end;\n    justify-content: flex-start;\n  }\n\n  :host([position=\"bottom-centre\"]) {\n    bottom: 0;\n    left: 50%;\n    align-items: center;\n    justify-content: flex-end;\n    transform: translateX(-50%);\n  }\n\n  :host([position=\"bottom-right\"]) {\n    right: 0;\n    bottom: 0;\n    align-items: flex-end;\n    justify-content: flex-end;\n  }\n\n  :host([position=\"bottom-left\"]) {\n    bottom: 0;\n    left: 0;\n    align-items: flex-start;\n    justify-content: flex-end;\n  }\n\n  ::slotted(z-toast-notification) {\n    width: 50vw;\n  }\n}\n\n/* Wide breakpoint */\n@media only screen and (min-width: 1366px) {\n  :host {\n    margin: calc(var(--space-unit) * 4);\n  }\n\n  ::slotted(z-toast-notification) {\n    width: 33vw;\n  }\n}\n","import { h } from \"@stencil/core\";\nimport { ToastNotificationPosition } from \"../../beans\";\nexport class ZToastNotificationList {\n    constructor() {\n        this.position = ToastNotificationPosition.TOP_RIGHT;\n        this.newestontop = true;\n    }\n    watchPropNewestontop(newValue) {\n        this.hostElement.append(...this.notificationArray.reverse());\n        if (newValue) {\n            this.hostElement.shadowRoot.addEventListener(\"slotchange\", this.slotChangeHandler);\n        }\n        else {\n            this.hostElement.shadowRoot.removeEventListener(\"slotchange\", this.slotChangeHandler);\n        }\n    }\n    componentWillLoad() {\n        if (this.newestontop) {\n            this.handleNewestOnTop();\n        }\n    }\n    handleNewestOnTop() {\n        this.notificationArray = Array.from(this.hostElement.children);\n        this.hostElement.append(...this.notificationArray.reverse());\n        this.hostElement.shadowRoot.addEventListener(\"slotchange\", this.slotChangeHandler.bind(this));\n    }\n    slotChangeHandler() {\n        const difference = Array.from(this.hostElement.children).filter((elem) => !this.notificationArray.includes(elem));\n        if (difference) {\n            difference.forEach((elem) => {\n                this.notificationArray.push(elem);\n                const newElem = elem;\n                elem.remove();\n                this.hostElement.prepend(newElem);\n            });\n        }\n    }\n    render() {\n        return h(\"slot\", { key: 'a40d72d8809dbf05ddce6a05fc59fd4891cd92e7', name: \"toasts\" });\n    }\n    static get is() { return \"z-toast-notification-list\"; }\n    static get encapsulation() { return \"shadow\"; }\n    static get originalStyleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n    static get styleUrls() {\n        return {\n            \"$\": [\"styles.css\"]\n        };\n    }\n    static get properties() {\n        return {\n            \"position\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"ToastNotificationPosition\",\n                    \"resolved\": \"ToastNotificationPosition.BOTTOM_CENTRE | ToastNotificationPosition.BOTTOM_LEFT | ToastNotificationPosition.BOTTOM_RIGHT | ToastNotificationPosition.TOP_CENTRE | ToastNotificationPosition.TOP_LEFT | ToastNotificationPosition.TOP_RIGHT\",\n                    \"references\": {\n                        \"ToastNotificationPosition\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::ToastNotificationPosition\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Set the position of toast notification list - top-left, top-centre, top-right, bottom-left, bottom-centre, bottom-right\"\n                },\n                \"attribute\": \"position\",\n                \"reflect\": true,\n                \"defaultValue\": \"ToastNotificationPosition.TOP_RIGHT\"\n            },\n            \"newestontop\": {\n                \"type\": \"boolean\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Set the entry position of new notification in the list\"\n                },\n                \"attribute\": \"newestontop\",\n                \"reflect\": false,\n                \"defaultValue\": \"true\"\n            }\n        };\n    }\n    static get elementRef() { return \"hostElement\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"newestontop\",\n                \"methodName\": \"watchPropNewestontop\"\n            }];\n    }\n}\n//# sourceMappingURL=index.js.map\n"],"version":3}