@zanichelli/zanichelli-it-frontend-kit 0.0.1-rc.8 → 0.1.1

package/dist/esm/z-info-reveal.entry.js

@@ -1,61 +0,0 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-Cam6wBSi.js';
-import { z as InfoRevealPosition, C as ControlSize } from './index-B2-dCTD2.js';
-
-const stylesCss = ":host{--z-info-reveal-panel-width:384px;--trigger-size:44px;position:relative}:host *{box-sizing:border-box}button{--trigger-icon-size:calc(var(--trigger-size) / 2);display:flex;align-items:center;justify-content:center;padding:0;border:none;background-color:transparent;cursor:pointer;font-family:inherit;letter-spacing:inherit}button:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}.z-info-reveal-trigger{min-width:var(--trigger-size);height:var(--trigger-size);padding:calc((var(--trigger-size) - var(--trigger-icon-size)) / 2);background-color:var(--color-surface05);border-radius:var(--border-radius);color:var(--color-text-inverse);column-gap:var(--space-unit);font-weight:var(--font-sb);line-height:1rem}:host([size=\"big\"]) .z-info-reveal-trigger{font-size:var(--font-size-2)}:host([size=\"small\"]) .z-info-reveal-trigger{--trigger-size:36px;font-size:var(--font-size-2)}:host([size=\"x-small\"]) .z-info-reveal-trigger{--trigger-size:32px;padding:var(--space-unit);font-size:var(--font-size-1)}:host>.z-info-reveal-trigger z-icon{--z-icon-width:var(--trigger-icon-size);--z-icon-height:var(--trigger-icon-size);display:flex;fill:var(--color-inverse-icon)}:host([size=\"small\"])>.z-info-reveal-trigger z-icon{--trigger-icon-size:var(--trigger-icon-size-small, 18px)}:host([size=\"x-small\"])>.z-info-reveal-trigger z-icon{--trigger-icon-size:var(--trigger-icon-size-x-small, 16px)}.z-info-reveal-panel{position:absolute;z-index:19;display:flex;width:var(--z-info-reveal-panel-width);height:fit-content;align-items:flex-start;padding:calc(var(--space-unit) * 1.5);background-color:var(--color-surface05);border-radius:var(--border-radius);box-shadow:var(--shadow-4);color:var(--color-text-inverse);column-gap:var(--space-unit)}.z-info-reveal-panel[hidden]{display:none}:host([position=\"top_left\"]) .z-info-reveal-panel,:host([position=\"top_right\"]) .z-info-reveal-panel{top:0}:host([position=\"bottom_left\"]) .z-info-reveal-panel,:host([position=\"bottom_right\"]) .z-info-reveal-panel{bottom:0}:host([position=\"top_right\"]) .z-info-reveal-panel,:host([position=\"bottom_right\"]) .z-info-reveal-panel{right:0}:host([position=\"top_left\"]) .z-info-reveal-panel,:host([position=\"bottom_left\"]) .z-info-reveal-panel{left:0}.z-info-reveal-panel .z-info-reveal-close{margin-left:auto}.z-info-reveal-panel z-icon{fill:var(--color-inverse-icon)}@media (max-width: 767px){.z-info-reveal-panel{top:auto !important;bottom:auto !important;width:calc(var(--z-info-reveal-panel-width) - (var(--grid-margin) * 4)) !important;margin-top:calc(var(--trigger-size) * -1)}}";
-
-const ZInfoReveal = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.icon = "informationsource";
-        this.position = InfoRevealPosition.BOTTOM_RIGHT;
-        this.label = undefined;
-        this.ariaLabel = "Apri pannello informazioni";
-        this.size = ControlSize.BIG;
-        this.open = false;
-    }
-    /**
-     * Adjust the position of the info panel to prevent exiting the viewport.
-     */
-    adjustPanelPosition() {
-        if (!this.open || !this.panel) {
-            return;
-        }
-        const rect = this.host.getBoundingClientRect();
-        const gridMargin = parseInt(getComputedStyle(document.documentElement).getPropertyValue("--grid-margin"), 10);
-        const pageWidth = document.documentElement.offsetWidth;
-        // Available space for the info panel to grow towards the edge of the page, based on the `position` prop.
-        const availableSpace = Math.round((this.position.includes("left") ? pageWidth - rect.left : rect.right) - gridMargin);
-        this.panel.style.maxWidth = `${availableSpace}px`;
-    }
-    /**
-     * Toggle the open state of the info panel.
-     */
-    togglePanel() {
-        this.open = !this.open;
-    }
-    /**
-     * Close the info panel.
-     */
-    closePanel() {
-        this.open = false;
-    }
-    handleEscapeKey(event) {
-        if (event.key === "Escape" && this.open) {
-            this.closePanel();
-        }
-    }
-    render() {
-        return (h(Host, { key: 'a19485beada104ab116a2eb280d976aa608260aa', open: this.open }, h("button", { key: '504213f62284cc74ed74b651a3a54dcd9715a1f1', class: "z-info-reveal-trigger", type: "button", onClick: this.togglePanel.bind(this), "aria-label": !this.label ? this.ariaLabel : undefined, "aria-expanded": this.open ? "true" : "false", "aria-controls": "z-info-reveal-panel" }, this.icon && h("z-icon", { key: '4fd422856292ae26d66a04188abfb74c5e809141', name: this.icon }), this.label && h("span", { key: '4753636fcf7c98c077a93ac783b22b1057492bb5', class: "z-info-reveal-label" }, this.label)), h("div", { key: 'bdff08efa35c74951b48d909e83d7ccf32079460', class: "z-info-reveal-panel", id: "z-info-reveal-panel", ref: (el) => (this.panel = el), hidden: !this.open }, h("slot", { key: '441569ddd80537294c1d66a1555423c460f7f8c9' }), h("button", { key: '690e9a97f7e77a6de567030062d159184106b725', class: "z-info-reveal-close", type: "button", onClick: this.closePanel.bind(this), "aria-label": "Chiudi pannello informazioni" }, h("z-icon", { key: '1e110ca5a85731ec582d4696f72e4b010593d9eb', name: "multiply" })))));
-    }
-    get host() { return getElement(this); }
-    static get watchers() { return {
-        "position": ["adjustPanelPosition"],
-        "open": ["adjustPanelPosition"]
-    }; }
-};
-ZInfoReveal.style = stylesCss;
-
-export { ZInfoReveal as z_info_reveal };
-//# sourceMappingURL=z-info-reveal.entry.js.map
-
-//# sourceMappingURL=z-info-reveal.entry.js.map

package/dist/esm/z-info-reveal.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"z-info-reveal.entry.js","sources":["node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-info-reveal/styles.css?tag=z-info-reveal&encapsulation=shadow","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-info-reveal/index.js"],"sourcesContent":[":host {\n  --z-info-reveal-panel-width: 384px; /* defaults half the size of the mobile breakpoint */\n  --trigger-size: 44px;\n\n  position: relative;\n}\n\n:host * {\n  box-sizing: border-box;\n}\n\nbutton {\n  --trigger-icon-size: calc(var(--trigger-size) / 2);\n\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  font-family: inherit;\n  letter-spacing: inherit;\n}\n\nbutton:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n.z-info-reveal-trigger {\n  min-width: var(--trigger-size);\n  height: var(--trigger-size);\n  padding: calc((var(--trigger-size) - var(--trigger-icon-size)) / 2);\n  background-color: var(--color-surface05);\n  border-radius: var(--border-radius);\n  color: var(--color-text-inverse);\n  column-gap: var(--space-unit);\n  font-weight: var(--font-sb);\n  line-height: 1rem;\n}\n\n:host([size=\"big\"]) .z-info-reveal-trigger {\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"small\"]) .z-info-reveal-trigger {\n  --trigger-size: 36px;\n\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) .z-info-reveal-trigger {\n  --trigger-size: 32px;\n\n  padding: var(--space-unit);\n  font-size: var(--font-size-1);\n}\n\n:host > .z-info-reveal-trigger z-icon {\n  --z-icon-width: var(--trigger-icon-size);\n  --z-icon-height: var(--trigger-icon-size);\n\n  display: flex;\n  fill: var(--color-inverse-icon);\n}\n\n:host([size=\"small\"]) > .z-info-reveal-trigger z-icon {\n  --trigger-icon-size: var(--trigger-icon-size-small, 18px);\n}\n\n:host([size=\"x-small\"]) > .z-info-reveal-trigger z-icon {\n  --trigger-icon-size: var(--trigger-icon-size-x-small, 16px);\n}\n\n.z-info-reveal-panel {\n  position: absolute;\n  z-index: 19;\n  display: flex;\n  width: var(--z-info-reveal-panel-width);\n  height: fit-content;\n  align-items: flex-start;\n  padding: calc(var(--space-unit) * 1.5);\n  background-color: var(--color-surface05);\n  border-radius: var(--border-radius);\n  box-shadow: var(--shadow-4);\n  color: var(--color-text-inverse);\n  column-gap: var(--space-unit);\n}\n\n.z-info-reveal-panel[hidden] {\n  display: none;\n}\n\n:host([position=\"top_left\"]) .z-info-reveal-panel,\n:host([position=\"top_right\"]) .z-info-reveal-panel {\n  top: 0;\n}\n\n:host([position=\"bottom_left\"]) .z-info-reveal-panel,\n:host([position=\"bottom_right\"]) .z-info-reveal-panel {\n  bottom: 0;\n}\n\n:host([position=\"top_right\"]) .z-info-reveal-panel,\n:host([position=\"bottom_right\"]) .z-info-reveal-panel {\n  right: 0;\n}\n\n:host([position=\"top_left\"]) .z-info-reveal-panel,\n:host([position=\"bottom_left\"]) .z-info-reveal-panel {\n  left: 0;\n}\n\n.z-info-reveal-panel .z-info-reveal-close {\n  margin-left: auto;\n}\n\n.z-info-reveal-panel z-icon {\n  fill: var(--color-inverse-icon);\n}\n\n@media (max-width: 767px) {\n  .z-info-reveal-panel {\n    top: auto !important;\n    bottom: auto !important;\n    width: calc(var(--z-info-reveal-panel-width) - (var(--grid-margin) * 4)) !important;\n    margin-top: calc(var(--trigger-size) * -1);\n  }\n}\n","import { Host, h } from \"@stencil/core\";\nimport { ControlSize, InfoRevealPosition } from \"../../beans\";\n/**\n * Info reveal component.\n *\n * @slot - content of the info panel.\n * @cssprop --z-info-reveal-panel-width - Width of the info panel.\n * @cssprop --trigger-icon-size - Size of the trigger icon for big size.\n * @cssprop --trigger-icon-size-small - Size of the trigger icon for small size.\n * @cssprop --trigger-icon-size-x-small - Size of the trigger icon for x-small size.\n */\nexport class ZInfoReveal {\n    constructor() {\n        this.icon = \"informationsource\";\n        this.position = InfoRevealPosition.BOTTOM_RIGHT;\n        this.label = undefined;\n        this.ariaLabel = \"Apri pannello informazioni\";\n        this.size = ControlSize.BIG;\n        this.open = false;\n    }\n    /**\n     * Adjust the position of the info panel to prevent exiting the viewport.\n     */\n    adjustPanelPosition() {\n        if (!this.open || !this.panel) {\n            return;\n        }\n        const rect = this.host.getBoundingClientRect();\n        const gridMargin = parseInt(getComputedStyle(document.documentElement).getPropertyValue(\"--grid-margin\"), 10);\n        const pageWidth = document.documentElement.offsetWidth;\n        // Available space for the info panel to grow towards the edge of the page, based on the `position` prop.\n        const availableSpace = Math.round((this.position.includes(\"left\") ? pageWidth - rect.left : rect.right) - gridMargin);\n        this.panel.style.maxWidth = `${availableSpace}px`;\n    }\n    /**\n     * Toggle the open state of the info panel.\n     */\n    togglePanel() {\n        this.open = !this.open;\n    }\n    /**\n     * Close the info panel.\n     */\n    closePanel() {\n        this.open = false;\n    }\n    handleEscapeKey(event) {\n        if (event.key === \"Escape\" && this.open) {\n            this.closePanel();\n        }\n    }\n    render() {\n        return (h(Host, { key: 'a19485beada104ab116a2eb280d976aa608260aa', open: this.open }, h(\"button\", { key: '504213f62284cc74ed74b651a3a54dcd9715a1f1', class: \"z-info-reveal-trigger\", type: \"button\", onClick: this.togglePanel.bind(this), \"aria-label\": !this.label ? this.ariaLabel : undefined, \"aria-expanded\": this.open ? \"true\" : \"false\", \"aria-controls\": \"z-info-reveal-panel\" }, this.icon && h(\"z-icon\", { key: '4fd422856292ae26d66a04188abfb74c5e809141', name: this.icon }), this.label && h(\"span\", { key: '4753636fcf7c98c077a93ac783b22b1057492bb5', class: \"z-info-reveal-label\" }, this.label)), h(\"div\", { key: 'bdff08efa35c74951b48d909e83d7ccf32079460', class: \"z-info-reveal-panel\", id: \"z-info-reveal-panel\", ref: (el) => (this.panel = el), hidden: !this.open }, h(\"slot\", { key: '441569ddd80537294c1d66a1555423c460f7f8c9' }), h(\"button\", { key: '690e9a97f7e77a6de567030062d159184106b725', class: \"z-info-reveal-close\", type: \"button\", onClick: this.closePanel.bind(this), \"aria-label\": \"Chiudi pannello informazioni\" }, h(\"z-icon\", { key: '1e110ca5a85731ec582d4696f72e4b010593d9eb', name: \"multiply\" })))));\n    }\n    static get is() { return \"z-info-reveal\"; }\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            \"icon\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Name of the icon for the trigger button\"\n                },\n                \"attribute\": \"icon\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"informationsource\\\"\"\n            },\n            \"position\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"InfoRevealPosition\",\n                    \"resolved\": \"InfoRevealPosition.BOTTOM_LEFT | InfoRevealPosition.BOTTOM_RIGHT | InfoRevealPosition.TOP_LEFT | InfoRevealPosition.TOP_RIGHT\",\n                    \"references\": {\n                        \"InfoRevealPosition\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::InfoRevealPosition\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"The position of the z-info-reveal in the page. This helps to correctly place the info panel.\\nThe panel will grow in the opposite direction of the position.\\nFor example, with the default position `BOTTOM_RIGHT`, the panel will grow vertically upwards and horizontally to the left.\"\n                },\n                \"attribute\": \"position\",\n                \"reflect\": true,\n                \"defaultValue\": \"InfoRevealPosition.BOTTOM_RIGHT\"\n            },\n            \"label\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Label of the trigger button.\"\n                },\n                \"attribute\": \"label\",\n                \"reflect\": false\n            },\n            \"ariaLabel\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Aria label of the trigger button. It will be only used when `label` prop is empty.\"\n                },\n                \"attribute\": \"aria-label\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"Apri pannello informazioni\\\"\"\n            },\n            \"size\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"ControlSize\",\n                    \"resolved\": \"ControlSize.BIG | ControlSize.SMALL | ControlSize.X_SMALL\",\n                    \"references\": {\n                        \"ControlSize\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::ControlSize\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Size of the trigger button\"\n                },\n                \"attribute\": \"size\",\n                \"reflect\": true,\n                \"defaultValue\": \"ControlSize.BIG\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"open\": {}\n        };\n    }\n    static get elementRef() { return \"host\"; }\n    static get watchers() {\n        return [{\n                \"propName\": \"position\",\n                \"methodName\": \"adjustPanelPosition\"\n            }, {\n                \"propName\": \"open\",\n                \"methodName\": \"adjustPanelPosition\"\n            }];\n    }\n    static get listeners() {\n        return [{\n                \"name\": \"resize\",\n                \"method\": \"adjustPanelPosition\",\n                \"target\": \"window\",\n                \"capture\": false,\n                \"passive\": true\n            }, {\n                \"name\": \"keydown\",\n                \"method\": \"handleEscapeKey\",\n                \"target\": \"window\",\n                \"capture\": true,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=index.js.map\n"],"names":[],"mappings":";;;AAAA,MAAM,SAAS,GAAG,yiFAAyiF;;MCW9iF,WAAW,GAAA,MAAA;AACpB,IAAA,WAAA,CAAA,OAAA,EAAA;;AACI,QAAA,IAAI,CAAC,IAAI,GAAG,mBAAmB;AAC/B,QAAA,IAAI,CAAC,QAAQ,GAAG,kBAAkB,CAAC,YAAY;AAC/C,QAAA,IAAI,CAAC,KAAK,GAAG,SAAS;AACtB,QAAA,IAAI,CAAC,SAAS,GAAG,4BAA4B;AAC7C,QAAA,IAAI,CAAC,IAAI,GAAG,WAAW,CAAC,GAAG;AAC3B,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;AACpB;AACD;;AAEG;IACH,mBAAmB,GAAA;QACf,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YAC3B;;QAEJ,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE;AAC9C,QAAA,MAAM,UAAU,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,eAAe,CAAC,EAAE,EAAE,CAAC;AAC7G,QAAA,MAAM,SAAS,GAAG,QAAQ,CAAC,eAAe,CAAC,WAAW;;AAEtD,QAAA,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,UAAU,CAAC;QACrH,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,CAAA,EAAG,cAAc,CAAA,EAAA,CAAI;;AAErD;;AAEG;IACH,WAAW,GAAA;AACP,QAAA,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI;;AAE1B;;AAEG;IACH,UAAU,GAAA;AACN,QAAA,IAAI,CAAC,IAAI,GAAG,KAAK;;AAErB,IAAA,eAAe,CAAC,KAAK,EAAA;QACjB,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;YACrC,IAAI,CAAC,UAAU,EAAE;;;IAGzB,MAAM,GAAA;QACF,QAAQ,CAAC,CAAC,IAAI,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,uBAAuB,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,YAAY,EAAE,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,GAAG,SAAS,EAAE,eAAe,EAAE,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO,EAAE,eAAe,EAAE,qBAAqB,EAAE,EAAE,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,CAAC,EAAE,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,qBAAqB,EAAE,EAAE,EAAE,qBAAqB,EAAE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,EAAE,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,MAAM,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,KAAK,EAAE,qBAAqB,EAAE,IAAI,EAAE,QAAQ,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,YAAY,EAAE,8BAA8B,EAAE,EAAE,CAAC,CAAC,QAAQ,EAAE,EAAE,GAAG,EAAE,0CAA0C,EAAE,IAAI,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,CAAC;;;;;;;;;;;;","x_google_ignoreList":[0,1]}

package/dist/esm/z-input.z-input-message.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"z-input.z-input-message.entry.js","sources":["node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-input/styles.css?tag=z-input&encapsulation=scoped","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-input/index.js","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-input-message/styles.css?tag=z-input-message&encapsulation=shadow","node_modules/.pnpm/@zanichelli+albe-web-components@18.3.2/node_modules/@zanichelli/albe-web-components/dist/collection/components/z-input-message/index.js"],"sourcesContent":[":host {\n  display: inline-block;\n  width: inherit;\n}\n\n:host * {\n  box-sizing: border-box;\n}\n\ninput::-ms-clear,\ninput::-ms-reveal {\n  display: none;\n}\n\n/* GENERAL */\n:host input::-ms-clear,\n:host input::-ms-reveal {\n  display: none;\n}\n\ninput,\ntextarea {\n  background: var(--color-form-background);\n  fill: var(--color-form-default-icon);\n  font-family: var(--font-family-sans);\n  font-size: var(--font-size-3);\n  font-weight: var(--font-rg);\n  outline: none;\n}\n\ninput,\n.textarea-wrapper {\n  border: var(--border-size-small) solid var(--color-form-surface04);\n  border-radius: var(--border-radius-small);\n  color: var(--color-form-default-text);\n}\n\n:host([size=\"small\"]) input,\n:host([size=\"small\"]) textarea,\n:host([size=\"x-small\"]) input,\n:host([size=\"x-small\"]) textarea {\n  font-size: var(--font-size-2);\n}\n\n:host.cursor-select input {\n  cursor: pointer;\n}\n\n/* HOVER */\ninput:not([readonly]):hover,\n.textarea-wrapper:not(.readonly):hover {\n  outline: var(--border-size-medium) solid var(--color-surface04);\n  outline-offset: -2px;\n}\n\n/* FOCUS */\n:host:not(.active-select) input:focus:focus-visible,\n:host:not([readonly=\"true\"]) .textarea-wrapper:focus-within {\n  border-color: var(--color-form-active-primary);\n  box-shadow: var(--shadow-focus-primary);\n  color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible:hover,\n.textarea-wrapper:not(.readonly):focus-within:hover {\n  outline-color: var(--color-form-active-primary);\n}\n\n:host input:focus:focus-visible + .icons-wrapper {\n  fill: var(--color-form-active-primary);\n}\n\n:host.active-select input {\n  border: var(--border-size-small) solid var(--color-form-active-primary);\n}\n\n:host.cursor-select input:focus:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n:host input[readonly]:focus:focus-visible {\n  border-color: var(--color-form-surface03);\n  box-shadow: none;\n}\n\n/* STATUSES (success, warning, error) */\n.input-success {\n  border-color: var(--color-form-success01);\n  background: var(--color-form-inverse-success);\n}\n\n.input-success:focus:focus-visible + .icons-wrapper,\n.input-success + .icons-wrapper {\n  fill: var(--color-form-success01);\n}\n\n.input-error {\n  border-color: var(--color-form-hover-error);\n  background: var(--color-form-inverse-error);\n}\n\n.input-error:focus:focus-visible + .icons-wrapper,\n.input-error + .icons-wrapper {\n  fill: var(--color-form-hover-error);\n}\n\n.input-warning {\n  border-color: var(--color-form-hover-warning);\n  background: var(--color-form-inverse-warning);\n}\n\n.input-warning:focus:focus-visible + .icons-wrapper,\n.input-warning + .icons-wrapper {\n  fill: var(--color-form-hover-warning);\n}\n\n:is(.input-success, .input-error, .input-warning):focus:focus-visible {\n  color: var(--color-form-default-text);\n}\n\n/* READONLY */\n:host:not(.active-select) input[readonly],\n.textarea-wrapper.readonly {\n  border-color: var(--color-form-surface03);\n  fill: var(--color-form-disabled01-icon);\n  pointer-events: none;\n}\n\n/* DISABLED */\n:host([disabled]:not([disabled=\"false\"])) input,\n:host([disabled]:not([disabled=\"false\"])) .textarea-wrapper,\n:host([disabled]:not([disabled=\"false\"])) z-icon {\n  border-color: var(--color-form-disabled03);\n  box-shadow: none;\n  color: var(--color-form-disabled-text);\n  fill: var(--color-form-disabled01-icon);\n  pointer-events: none;\n}\n\n:host([disabled]:not([disabled=\"false\"])) input:hover {\n  border-width: var(--border-size-small);\n}\n\n/* PLACEHOLDER */\ninput::placeholder,\ntextarea::placeholder {\n  color: var(--color-form-placeholder-text);\n}\n\n::-webkit-textarea-placeholder {\n  color: var(--color-form-placeholder-text);\n}\n\n:-ms-textarea-placeholder {\n  color: var(--color-form-placeholder-text);\n}\n\n::placeholder {\n  color: var(--color-form-placeholder-text);\n}\n\n/* LABEL */\nlabel.input-label {\n  display: block;\n  padding-bottom: var(--space-unit);\n  color: var(--color-default-text);\n  font-family: var(--font-family-sans);\n  font-size: var(--font-size-1);\n  font-weight: var(--font-sb);\n  text-align: left;\n  text-transform: uppercase;\n}\n\n:host([disabled]:not([disabled=\"false\"])) label.input-label {\n  color: var(--color-disabled03);\n}\n\n.text-wrapper > div {\n  position: relative;\n  z-index: 1;\n  fill: var(--color-form-default-icon);\n}\n\n.text-wrapper > div > input {\n  width: 100%;\n  height: calc(var(--space-unit) * 5.5);\n  box-sizing: border-box;\n  padding: 0 calc(var(--space-unit) * 1.5);\n  margin: 0;\n}\n\n:host([size=\"small\"]) .text-wrapper > div > input {\n  height: calc(var(--space-unit) * 4.5);\n}\n\n:host([size=\"x-small\"]) .text-wrapper > div > input {\n  height: calc(var(--space-unit) * 4);\n}\n\n.text-wrapper > div > input.has-icon,\n.text-wrapper > div > input.has-clear-icon {\n  padding-right: calc(var(--space-unit) * 5.25);\n}\n\n.text-wrapper > div > input.has-icon.has-clear-icon {\n  padding-right: calc(var(--space-unit) * 8);\n}\n\n.text-wrapper .icons-wrapper {\n  position: absolute;\n  z-index: 2;\n  top: 50%;\n  right: calc(var(--space-unit) * 1.5);\n  display: flex;\n  pointer-events: none;\n  transform: translateY(-50%);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon {\n  display: flex;\n  padding: 0;\n  border: 0;\n  background: none;\n  color: inherit;\n  font: inherit;\n  pointer-events: initial;\n}\n\n.text-wrapper .icons-wrapper > .input-icon + .input-icon {\n  margin-left: calc(var(--space-unit) * 0.5);\n}\n\n.text-wrapper .icons-wrapper > button.input-icon.hidden {\n  display: none;\n}\n\n.text-wrapper .icons-wrapper > button.reset-icon,\n.text-wrapper .icons-wrapper > button.toggle-password-icon {\n  cursor: pointer;\n}\n\n.text-wrapper .icons-wrapper > .input-icon {\n  --z-icon-width: 18px;\n  --z-icon-height: 18px;\n\n  display: block;\n}\n\n.text-wrapper .icons-wrapper > .input-icon.small,\n.text-wrapper .icons-wrapper > .input-icon.x-small {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n.text-wrapper .icons-wrapper > button.input-icon:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\n/* stylelint-disable property-no-vendor-prefix */\n.text-wrapper > div > input:-webkit-autofill {\n  -webkit-box-shadow: 0 0 0 1000px #fff inset;\n  -webkit-text-fill-color: currentcolor;\n}\n\n.textarea-wrapper {\n  width: 100%;\n  height: 100%;\n  padding: calc(var(--space-unit) * 1.5);\n}\n\n.textarea-wrapper:not(.input-error, .input-success, .input-warning) {\n  background-color: var(--color-form-background);\n}\n\ntextarea {\n  width: 100%;\n  min-height: 132px;\n  padding: 0;\n  border: none;\n  margin: 0;\n  color: currentcolor;\n  resize: none;\n}\n\n.radio-wrapper,\n.checkbox-wrapper {\n  position: relative;\n  display: inline-flex;\n  flex-direction: row;\n  align-items: center;\n  color: var(--color-default-text);\n  fill: var(--color-primary01);\n  font-family: var(--font-family-sans);\n}\n\n.radio-wrapper:hover,\n.checkbox-wrapper:hover {\n  color: var(--color-hover-primary);\n  fill: var(--color-hover-primary-icon);\n}\n\n.radio-wrapper > input,\n.checkbox-wrapper > input {\n  position: absolute;\n  z-index: -1;\n  opacity: 0;\n  pointer-events: none;\n}\n\n.radio-wrapper .radio-label,\n.checkbox-wrapper .checkbox-label {\n  display: inline-flex;\n  align-items: center;\n  margin: 0;\n  color: inherit;\n  font-family: inherit;\n  font-size: inherit;\n  font-weight: inherit;\n  line-height: 1;\n  text-transform: inherit;\n}\n\n.radio-wrapper input:not(:disabled) + .radio-label,\n.checkbox-wrapper input:not(:disabled) + .checkbox-label {\n  cursor: pointer;\n}\n\n.radio-wrapper .radio-label z-icon,\n.checkbox-wrapper .checkbox-label z-icon {\n  cursor: pointer;\n  fill: inherit;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label z-icon {\n  --z-icon-width: 16px;\n  --z-icon-height: 16px;\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label {\n  font-size: var(--font-size-2);\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label z-icon,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label z-icon {\n  --z-icon-width: 14px;\n  --z-icon-height: 14px;\n}\n\n:host([size=\"x-small\"]) .radio-wrapper .radio-label,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label {\n  font-size: var(--font-size-1);\n}\n\n.radio-wrapper .radio-label.after,\n.checkbox-wrapper .checkbox-label.after {\n  flex-direction: row;\n}\n\n.radio-wrapper .radio-label.before,\n.checkbox-wrapper .checkbox-label.before {\n  flex-direction: row-reverse;\n}\n\n.radio-wrapper .radio-label.after > span,\n.checkbox-wrapper .checkbox-label.after > span {\n  margin-left: var(--space-unit);\n}\n\n.radio-wrapper .radio-label.before > span,\n.checkbox-wrapper .checkbox-label.before > span {\n  margin-right: var(--space-unit);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.after > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.after > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.after > span {\n  margin-left: calc(var(--space-unit) * 0.5);\n}\n\n:host([size=\"small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"small\"]) .checkbox-wrapper .checkbox-label.before > span,\n:host([size=\"x-small\"]) .radio-wrapper .radio-label.before > span,\n:host([size=\"x-small\"]) .checkbox-wrapper .checkbox-label.before > span {\n  margin-right: calc(var(--space-unit) * 0.5);\n}\n\n/* focus */\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon {\n  border-radius: 50%;\n}\n\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n  border-radius: var(--border-radius-small);\n}\n\n.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,\n.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {\n  box-shadow: var(--shadow-focus-primary);\n}\n\n/* disabled */\n.radio-wrapper > input:disabled + .radio-label,\n.checkbox-wrapper > input:disabled + .checkbox-label {\n  color: var(--color-disabled03);\n}\n\n.radio-wrapper > input:disabled + .radio-label > z-icon,\n.checkbox-wrapper > input:disabled + .checkbox-label > z-icon {\n  cursor: default;\n  fill: var(--color-disabled01);\n}\n\n","import { h } from \"@stencil/core\";\nimport { Fragment, Host } from \"@stencil/core/internal\";\nimport { ControlSize, InputType, LabelPosition } from \"../../beans\";\nimport { boolean, randomId } from \"../../utils/utils\";\nexport class ZInput {\n    constructor() {\n        this.typingtimeout = 300;\n        this.htmlid = `id-${randomId()}`;\n        this.type = undefined;\n        this.name = undefined;\n        this.label = undefined;\n        this.ariaLabel = \"\";\n        this.ariaExpanded = \"\";\n        this.ariaControls = undefined;\n        this.ariaAutocomplete = undefined;\n        this.ariaActivedescendant = undefined;\n        this.value = undefined;\n        this.disabled = false;\n        this.readonly = false;\n        this.required = false;\n        this.checked = false;\n        this.placeholder = undefined;\n        this.htmltitle = undefined;\n        this.status = undefined;\n        this.message = true;\n        this.labelPosition = LabelPosition.RIGHT;\n        this.autocomplete = undefined;\n        this.role = \"\";\n        this.hasclearicon = true;\n        this.icon = undefined;\n        this.min = undefined;\n        this.minlength = undefined;\n        this.max = undefined;\n        this.maxlength = undefined;\n        this.step = undefined;\n        this.pattern = undefined;\n        this.size = ControlSize.BIG;\n        this.isTyping = false;\n        this.passwordHidden = true;\n    }\n    inputCheckListener(e) {\n        const data = e.detail;\n        switch (this.type) {\n            case InputType.RADIO:\n                if (data.type === InputType.RADIO && data.name === this.name && data.id !== this.htmlid) {\n                    this.checked = false;\n                }\n                break;\n        }\n    }\n    /** get checked status */\n    async isChecked() {\n        switch (this.type) {\n            case InputType.CHECKBOX:\n            case InputType.RADIO:\n                return this.checked;\n            default:\n                console.warn(\"`isChecked` method is only available for type `checkbox` and `radio`\");\n                return false;\n        }\n    }\n    emitInputChange(value) {\n        if (!this.isTyping) {\n            this.emitStartTyping();\n        }\n        let validity;\n        if (this.type === InputType.TEXTAREA) {\n            validity = this.getValidity(\"textarea\");\n        }\n        else {\n            validity = this.getValidity(\"input\");\n        }\n        this.value = value;\n        this.inputChange.emit({ value, validity });\n        clearTimeout(this.timer);\n        this.timer = setTimeout(() => {\n            this.emitStopTyping(this.value, validity);\n        }, this.typingtimeout);\n    }\n    emitStartTyping() {\n        this.isTyping = true;\n        this.startTyping.emit();\n    }\n    emitStopTyping(value, validity) {\n        this.isTyping = false;\n        this.stopTyping.emit({\n            value: value,\n            validity: validity,\n        });\n    }\n    emitInputCheck(checked) {\n        this.inputCheck.emit({\n            id: this.htmlid,\n            checked: checked,\n            type: this.type,\n            name: this.name,\n            value: this.value,\n            validity: this.getValidity(\"input\"),\n        });\n    }\n    emitInputFocus() {\n        this.inputFocus.emit({ id: this.htmlid });\n    }\n    emitInputBlur() {\n        this.inputBlur.emit({ id: this.htmlid });\n    }\n    getValidity(type) {\n        const input = this.hostElement.querySelector(type);\n        return input.validity;\n    }\n    /* START text/password/email/number */\n    getTextAttributes() {\n        return {\n            id: this.htmlid,\n            name: this.name,\n            placeholder: this.placeholder,\n            value: this.value,\n            disabled: this.disabled,\n            readonly: this.readonly,\n            required: this.required,\n            title: this.htmltitle,\n            minlength: this.minlength,\n            maxlength: this.maxlength,\n            class: {\n                [`input-${this.status}`]: !!this.status,\n            },\n            autocomplete: this.autocomplete,\n            onInput: (e) => this.emitInputChange(e.target.value),\n        };\n    }\n    getNumberAttributes(type) {\n        if (type != InputType.NUMBER) {\n            return;\n        }\n        return {\n            min: this.min,\n            max: this.max,\n            step: this.step,\n        };\n    }\n    getPatternAttribute(type) {\n        if (type != InputType.PASSWORD &&\n            type != InputType.TEXT &&\n            type != InputType.TEL &&\n            type != InputType.SEARCH &&\n            type != InputType.URL &&\n            type != InputType.EMAIL) {\n            return;\n        }\n        return {\n            pattern: this.pattern,\n        };\n    }\n    getRoleAttribute() {\n        return this.role ? { role: this.role } : {};\n    }\n    getAriaAttrubutes() {\n        const expanded = this.ariaExpanded ? { \"aria-expanded\": this.ariaExpanded } : {};\n        const controls = this.ariaControls ? { \"aria-controls\": this.ariaControls } : {};\n        const autocomplete = this.ariaAutocomplete ? { \"aria-autocomplete\": this.ariaAutocomplete } : {};\n        const activedescendant = this.ariaActivedescendant ? { \"aria-activedescendant\": this.ariaActivedescendant } : {};\n        return Object.assign(Object.assign(Object.assign(Object.assign({}, expanded), controls), autocomplete), activedescendant);\n    }\n    getFocusBlurAttributes() {\n        return {\n            onFocus: () => this.emitInputFocus(),\n            onBlur: () => this.emitInputBlur(),\n        };\n    }\n    renderInputText(type = InputType.TEXT) {\n        const ariaLabel = this.ariaLabel ? { \"aria-label\": this.ariaLabel } : {};\n        const attr = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, this.getTextAttributes()), this.getNumberAttributes(type)), this.getPatternAttribute(type)), ariaLabel), this.getRoleAttribute()), this.getAriaAttrubutes()), this.getFocusBlurAttributes());\n        if (this.icon || type === InputType.PASSWORD) {\n            Object.assign(attr.class, { \"has-icon\": true });\n        }\n        if (this.hasclearicon && type != InputType.NUMBER) {\n            Object.assign(attr.class, { \"has-clear-icon\": true });\n        }\n        return (h(\"div\", { class: \"text-wrapper\" }, this.renderLabel(), h(\"div\", null, h(\"input\", Object.assign({ type: type === InputType.PASSWORD && !this.passwordHidden ? InputType.TEXT : type }, attr, { ref: (el) => (this.inputRef = el) })), this.renderIcons()), this.renderMessage()));\n    }\n    renderLabel() {\n        if (!this.label) {\n            return;\n        }\n        return (h(\"label\", { class: \"input-label body-5-sb\", id: `${this.htmlid}_label`, htmlFor: this.htmlid }, this.label));\n    }\n    renderIcons() {\n        return (h(\"span\", { class: \"icons-wrapper\" }, this.renderResetIcon(), this.renderIcon()));\n    }\n    renderIcon() {\n        if (this.type === InputType.PASSWORD) {\n            return this.renderShowHidePassword();\n        }\n        if (!this.icon) {\n            return;\n        }\n        return (h(\"z-icon\", { name: this.icon, class: { [this.size]: true, \"input-icon\": true } }));\n    }\n    renderResetIcon() {\n        let hidden = false;\n        if (!this.hasclearicon || !this.value || this.disabled || this.readonly || this.type == InputType.NUMBER) {\n            hidden = true;\n        }\n        return (h(\"button\", { type: \"button\", class: { \"reset-icon\": true, \"input-icon\": true, hidden }, \"aria-label\": \"cancella il contenuto dell'input\", onClick: () => {\n                this.inputRef.value = \"\";\n                this.emitInputChange(\"\");\n            } }, h(\"z-icon\", { name: \"multiply\", class: this.size })));\n    }\n    renderShowHidePassword() {\n        return (h(\"button\", { type: \"button\", class: \"input-icon toggle-password-icon\", disabled: this.disabled, \"aria-label\": this.passwordHidden ? \"mostra password\" : \"nascondi password\", onClick: () => (this.passwordHidden = !this.passwordHidden) }, h(\"z-icon\", { name: this.passwordHidden ? \"view-filled\" : \"view-off-filled\", class: this.size })));\n    }\n    renderMessage() {\n        if (boolean(this.message) === false) {\n            return;\n        }\n        return (h(\"z-input-message\", { message: boolean(this.message) === true ? undefined : this.message, status: this.status, class: this.size, disabled: this.disabled }));\n    }\n    /* END text/password/email/number */\n    /* START textarea */\n    renderTextarea() {\n        const attributes = this.getTextAttributes();\n        return (h(Fragment, null, this.renderLabel(), h(\"div\", { class: Object.assign(Object.assign({}, attributes.class), { \"textarea-wrapper\": true, \"readonly\": !!attributes.readonly }) }, h(\"textarea\", Object.assign({}, attributes, { class: Object.assign(Object.assign({}, attributes.class), { \"z-scrollbar\": true }), \"aria-label\": this.ariaLabel || undefined }, this.getRoleAttribute()))), this.renderMessage()));\n    }\n    /* END textarea */\n    handleCheck(ev) {\n        this.checked = ev.target.checked;\n        this.emitInputCheck(this.checked);\n    }\n    /* START checkbox */\n    renderCheckbox() {\n        return (h(\"div\", { class: \"checkbox-wrapper\" }, h(\"input\", Object.assign({ id: this.htmlid, type: \"checkbox\", name: this.name, checked: this.checked, disabled: this.disabled, readonly: this.readonly, required: this.required, onChange: this.handleCheck.bind(this), value: this.value }, this.getRoleAttribute(), this.getFocusBlurAttributes())), h(\"label\", { htmlFor: this.htmlid, class: {\n                \"checkbox-label\": true,\n                \"after\": this.labelPosition === LabelPosition.RIGHT,\n                \"before\": this.labelPosition === LabelPosition.LEFT,\n            } }, h(\"z-icon\", { name: this.checked ? \"checkbox-checked\" : \"checkbox\", class: this.size }), this.label && h(\"span\", { innerHTML: this.label }))));\n    }\n    /* END checkbox */\n    /* START radio */\n    renderRadio() {\n        return (h(\"div\", { class: \"radio-wrapper\" }, h(\"input\", Object.assign({ id: this.htmlid, type: \"radio\", name: this.name, checked: this.checked, disabled: this.disabled, readonly: this.readonly, onChange: this.handleCheck.bind(this), value: this.value }, this.getRoleAttribute(), this.getFocusBlurAttributes())), h(\"label\", { htmlFor: this.htmlid, class: {\n                \"radio-label\": true,\n                \"after\": this.labelPosition === LabelPosition.RIGHT,\n                \"before\": this.labelPosition === LabelPosition.LEFT,\n            } }, h(\"z-icon\", { name: this.checked ? \"radio-button-checked\" : \"radio-button\", class: this.size }), this.label && h(\"span\", { innerHTML: this.label }))));\n    }\n    /* END radio */\n    render() {\n        let input;\n        switch (this.type) {\n            case InputType.TEXTAREA:\n                input = this.renderTextarea();\n                break;\n            case InputType.CHECKBOX:\n                input = this.renderCheckbox();\n                break;\n            case InputType.RADIO:\n                input = this.renderRadio();\n                break;\n            default:\n                input = this.renderInputText(this.type);\n        }\n        return h(Host, { key: '716ee8b89dbfeffedfdbfa8785c3994a94c44f44' }, input);\n    }\n    static get is() { return \"z-input\"; }\n    static get encapsulation() { return \"scoped\"; }\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            \"htmlid\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the id of the input element\"\n                },\n                \"attribute\": \"htmlid\",\n                \"reflect\": false,\n                \"defaultValue\": \"`id-${randomId()}`\"\n            },\n            \"type\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"InputType\",\n                    \"resolved\": \"InputType.CHECKBOX | InputType.EMAIL | InputType.NUMBER | InputType.PASSWORD | InputType.RADIO | InputType.SEARCH | InputType.TEL | InputType.TEXT | InputType.TEXTAREA | InputType.URL\",\n                    \"references\": {\n                        \"InputType\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::InputType\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"input types\"\n                },\n                \"attribute\": \"type\",\n                \"reflect\": false\n            },\n            \"name\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input name\"\n                },\n                \"attribute\": \"name\",\n                \"reflect\": false\n            },\n            \"label\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input label\"\n                },\n                \"attribute\": \"label\",\n                \"reflect\": false\n            },\n            \"ariaLabel\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input aria-label\"\n                },\n                \"attribute\": \"aria-label\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"\\\"\"\n            },\n            \"ariaExpanded\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input aria-expaded: available for text, password, number, email\"\n                },\n                \"attribute\": \"aria-expanded\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"\\\"\"\n            },\n            \"ariaControls\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input aria-controls (optional): available for text, password, number, email\"\n                },\n                \"attribute\": \"aria-controls\",\n                \"reflect\": false\n            },\n            \"ariaAutocomplete\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input aria-autocomplete (optional): available for text, password, number, email\"\n                },\n                \"attribute\": \"aria-autocomplete\",\n                \"reflect\": false\n            },\n            \"ariaActivedescendant\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input aria-activedescendant (optional): available for text, password, number, email\"\n                },\n                \"attribute\": \"aria-activedescendant\",\n                \"reflect\": false\n            },\n            \"value\": {\n                \"type\": \"string\",\n                \"mutable\": true,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input value\"\n                },\n                \"attribute\": \"value\",\n                \"reflect\": false\n            },\n            \"disabled\": {\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\": \"the input is disabled\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": true,\n                \"defaultValue\": \"false\"\n            },\n            \"readonly\": {\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\": \"the input is readonly\"\n                },\n                \"attribute\": \"readonly\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"required\": {\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\": \"the input is required (optional): available for text, password, number, email, textarea, checkbox\"\n                },\n                \"attribute\": \"required\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"checked\": {\n                \"type\": \"boolean\",\n                \"mutable\": true,\n                \"complexType\": {\n                    \"original\": \"boolean\",\n                    \"resolved\": \"boolean\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"checked: available for checkbox, radio\"\n                },\n                \"attribute\": \"checked\",\n                \"reflect\": false,\n                \"defaultValue\": \"false\"\n            },\n            \"placeholder\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input placeholder (optional)\"\n                },\n                \"attribute\": \"placeholder\",\n                \"reflect\": false\n            },\n            \"htmltitle\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input html title (optional)\"\n                },\n                \"attribute\": \"htmltitle\",\n                \"reflect\": false\n            },\n            \"status\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"InputStatus\",\n                    \"resolved\": \"InputStatus.ERROR | InputStatus.SUCCESS | InputStatus.WARNING\",\n                    \"references\": {\n                        \"InputStatus\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::InputStatus\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input status (optional): available for text, password, number, email, textarea\"\n                },\n                \"attribute\": \"status\",\n                \"reflect\": false\n            },\n            \"message\": {\n                \"type\": \"any\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string | boolean\",\n                    \"resolved\": \"boolean | string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"input helper message (optional): available for text, password, number, email, textarea - if set to `false` message won't be displayed\"\n                },\n                \"attribute\": \"message\",\n                \"reflect\": false,\n                \"defaultValue\": \"true\"\n            },\n            \"labelPosition\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"LabelPosition\",\n                    \"resolved\": \"LabelPosition.LEFT | LabelPosition.RIGHT\",\n                    \"references\": {\n                        \"LabelPosition\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::LabelPosition\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input label position: available for checkbox, radio\"\n                },\n                \"attribute\": \"label-position\",\n                \"reflect\": false,\n                \"defaultValue\": \"LabelPosition.RIGHT\"\n            },\n            \"autocomplete\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input has autocomplete option (optional): available for text, password, number, email\"\n                },\n                \"attribute\": \"autocomplete\",\n                \"reflect\": false\n            },\n            \"role\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"the input role\"\n                },\n                \"attribute\": \"role\",\n                \"reflect\": false,\n                \"defaultValue\": \"\\\"\\\"\"\n            },\n            \"hasclearicon\": {\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\": \"render clear icon when typing (optional): available for text\"\n                },\n                \"attribute\": \"hasclearicon\",\n                \"reflect\": false,\n                \"defaultValue\": \"true\"\n            },\n            \"icon\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"render icon (optional): available for text\"\n                },\n                \"attribute\": \"icon\",\n                \"reflect\": false\n            },\n            \"min\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"min number value (optional): available for number\"\n                },\n                \"attribute\": \"min\",\n                \"reflect\": false\n            },\n            \"minlength\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Min length value (optional): available for text\"\n                },\n                \"attribute\": \"minlength\",\n                \"reflect\": false\n            },\n            \"max\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"max number value (optional): available for number\"\n                },\n                \"attribute\": \"max\",\n                \"reflect\": false\n            },\n            \"maxlength\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Max length value (optional): available for text\"\n                },\n                \"attribute\": \"maxlength\",\n                \"reflect\": false\n            },\n            \"step\": {\n                \"type\": \"number\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"number\",\n                    \"resolved\": \"number\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"step number value (optional): available for number\"\n                },\n                \"attribute\": \"step\",\n                \"reflect\": false\n            },\n            \"pattern\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"pattern value (optional): available for tel, text, search, url, email, password\"\n                },\n                \"attribute\": \"pattern\",\n                \"reflect\": false\n            },\n            \"size\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"ControlSize\",\n                    \"resolved\": \"ControlSize.BIG | ControlSize.SMALL | ControlSize.X_SMALL\",\n                    \"references\": {\n                        \"ControlSize\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::ControlSize\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Available sizes: `big`, `small` and `x-small`. Defaults to `big`.\"\n                },\n                \"attribute\": \"size\",\n                \"reflect\": true,\n                \"defaultValue\": \"ControlSize.BIG\"\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"isTyping\": {},\n            \"passwordHidden\": {}\n        };\n    }\n    static get events() {\n        return [{\n                \"method\": \"inputChange\",\n                \"name\": \"inputChange\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted on input value change, returns value, validity\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"startTyping\",\n                \"name\": \"startTyping\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted when user starts typing\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"stopTyping\",\n                \"name\": \"stopTyping\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted when user stops typing, returns value, validity\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"inputCheck\",\n                \"name\": \"inputCheck\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted on checkbox check/uncheck, returns id, checked, type, name, value, validity\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"inputFocus\",\n                \"name\": \"inputFocus\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted on input focus\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }, {\n                \"method\": \"inputBlur\",\n                \"name\": \"inputBlur\",\n                \"bubbles\": true,\n                \"cancelable\": true,\n                \"composed\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"Emitted on input blur\"\n                },\n                \"complexType\": {\n                    \"original\": \"any\",\n                    \"resolved\": \"any\",\n                    \"references\": {}\n                }\n            }];\n    }\n    static get methods() {\n        return {\n            \"isChecked\": {\n                \"complexType\": {\n                    \"signature\": \"() => Promise<boolean>\",\n                    \"parameters\": [],\n                    \"references\": {\n                        \"Promise\": {\n                            \"location\": \"global\",\n                            \"id\": \"global::Promise\"\n                        }\n                    },\n                    \"return\": \"Promise<boolean>\"\n                },\n                \"docs\": {\n                    \"text\": \"get checked status\",\n                    \"tags\": []\n                }\n            }\n        };\n    }\n    static get elementRef() { return \"hostElement\"; }\n    static get listeners() {\n        return [{\n                \"name\": \"inputCheck\",\n                \"method\": \"inputCheckListener\",\n                \"target\": \"document\",\n                \"capture\": false,\n                \"passive\": false\n            }];\n    }\n}\n//# sourceMappingURL=index.js.map\n",":host {\n  display: flex;\n  min-height: calc(var(--space-unit) * 2.5);\n  align-items: start;\n  margin-top: var(--space-unit);\n  color: var(--color-default-text);\n  fill: currentcolor;\n  font-family: var(--font-family-sans);\n  font-size: var(--font-size-2);\n  letter-spacing: 0.16px;\n}\n\n:host(.small),\n:host(.x-small) {\n  margin-top: calc(var(--space-unit) * 0.5);\n  font-size: var(--font-size-1);\n}\n\n:host([status=\"success\"]) {\n  color: var(--color-hover-success);\n}\n\n:host([status=\"error\"]) {\n  color: var(--color-hover-error);\n}\n\n:host([status=\"warning\"]) {\n  color: var(--color-hover-warning);\n}\n\n:host(:focus) {\n  outline: none;\n}\n\n:host > z-icon {\n  --z-icon-width: calc(var(--space-unit) * 2);\n  --z-icon-height: calc(var(--space-unit) * 2);\n  --z-icon-right-margin: var(--space-unit);\n\n  margin-top: calc(var(--space-unit) * 0.25);\n}\n\n:host(.small) > z-icon,\n:host(.x-small) > z-icon {\n  --z-icon-width: 14px;\n  --z-icon-height: 14px;\n  --z-icon-right-margin: calc(var(--space-unit) * 0.5);\n}\n\n:host([disabled]) {\n  color: var(--color-disabled03);\n  fill: var(--color-disabled03);\n}\n","import { Host, h } from \"@stencil/core\";\nexport class ZInputMessage {\n    constructor() {\n        this.statusIcons = {\n            success: \"checkmark-circle\",\n            error: \"multiply-circled\",\n            warning: \"exclamation-circle\",\n        };\n        this.message = undefined;\n        this.status = undefined;\n        this.disabled = undefined;\n        this.statusRole = {};\n    }\n    onMessageChange() {\n        this.statusRole = this.message && this.status ? { role: \"alert\" } : {};\n    }\n    componentWillLoad() {\n        this.onMessageChange();\n    }\n    render() {\n        return (h(Host, Object.assign({ key: 'ef26c50e4e8f21bed23b6b530f34866bb9d746af' }, this.statusRole, { \"aria-label\": this.message }), this.statusIcons[this.status] && this.message && h(\"z-icon\", { key: '1c701e5f10e96e549fc3e799cbc16099f2032956', name: this.statusIcons[this.status] }), h(\"span\", { key: '9a12b124d65a4b4ebcb9856ce6e9fa275d96ac64', innerHTML: this.message })));\n    }\n    static get is() { return \"z-input-message\"; }\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            \"message\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"string\",\n                    \"resolved\": \"string\",\n                    \"references\": {}\n                },\n                \"required\": false,\n                \"optional\": false,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"input helper message\"\n                },\n                \"attribute\": \"message\",\n                \"reflect\": false\n            },\n            \"status\": {\n                \"type\": \"string\",\n                \"mutable\": false,\n                \"complexType\": {\n                    \"original\": \"InputStatus\",\n                    \"resolved\": \"InputStatus.ERROR | InputStatus.SUCCESS | InputStatus.WARNING\",\n                    \"references\": {\n                        \"InputStatus\": {\n                            \"location\": \"import\",\n                            \"path\": \"../../beans\",\n                            \"id\": \"src/beans/index.tsx::InputStatus\"\n                        }\n                    }\n                },\n                \"required\": false,\n                \"optional\": true,\n                \"docs\": {\n                    \"tags\": [],\n                    \"text\": \"input status (optional)\"\n                },\n                \"attribute\": \"status\",\n                \"reflect\": true\n            },\n            \"disabled\": {\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\": \"input disabled status (optional)\"\n                },\n                \"attribute\": \"disabled\",\n                \"reflect\": true\n            }\n        };\n    }\n    static get states() {\n        return {\n            \"statusRole\": {}\n        };\n    }\n    static get watchers() {\n        return [{\n                \"propName\": \"message\",\n                \"methodName\": \"onMessageChange\"\n            }, {\n                \"propName\": \"status\",\n                \"methodName\": \"onMessageChange\"\n            }];\n    }\n}\n//# sourceMappingURL=index.js.map\n"],"names":["stylesCss"],"mappings":"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","x_google_ignoreList":[0,1,2,3]}

package/dist/esm/z-input_2.entry.js

@@ -1,312 +0,0 @@
-import { r as registerInstance, c as createEvent, h, F as Fragment, H as Host, g as getElement } from './index-Cam6wBSi.js';
-import { y as LabelPosition, C as ControlSize, I as InputType } from './index-B2-dCTD2.js';
-import { r as randomId, b as boolean } from './utils-GdAsGfFX.js';
-import './breakpoints-Q-tWjk7P.js';
-
-const stylesCss$1 = ".sc-z-input-h{display:inline-block;width:inherit}.sc-z-input-h *.sc-z-input{box-sizing:border-box}input.sc-z-input::-ms-clear,input.sc-z-input::-ms-reveal{display:none}.sc-z-input-h input.sc-z-input::-ms-clear,.sc-z-input-h input.sc-z-input::-ms-reveal{display:none}input.sc-z-input,textarea.sc-z-input{background:var(--color-form-background);fill:var(--color-form-default-icon);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}input.sc-z-input,.textarea-wrapper.sc-z-input{border:var(--border-size-small) solid var(--color-form-surface04);border-radius:var(--border-radius-small);color:var(--color-form-default-text)}[size=\"small\"].sc-z-input-h input.sc-z-input,[size=\"small\"].sc-z-input-h textarea.sc-z-input,[size=\"x-small\"].sc-z-input-h input.sc-z-input,[size=\"x-small\"].sc-z-input-h textarea.sc-z-input{font-size:var(--font-size-2)}.cursor-select.sc-z-input-h input.sc-z-input{cursor:pointer}input.sc-z-input:not([readonly]):hover,.textarea-wrapper.sc-z-input:not(.readonly):hover{outline:var(--border-size-medium) solid var(--color-surface04);outline-offset:-2px}.sc-z-input-h:not(.active-select) input.sc-z-input:focus:focus-visible,.sc-z-input-h:not([readonly=\"true\"]) .textarea-wrapper.sc-z-input:focus-within{border-color:var(--color-form-active-primary);box-shadow:var(--shadow-focus-primary);color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible:hover,.textarea-wrapper.sc-z-input:not(.readonly):focus-within:hover{outline-color:var(--color-form-active-primary)}.sc-z-input-h input.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input{fill:var(--color-form-active-primary)}.active-select.sc-z-input-h input.sc-z-input{border:var(--border-size-small) solid var(--color-form-active-primary)}.cursor-select.sc-z-input-h input.sc-z-input:focus:focus-visible{box-shadow:var(--shadow-focus-primary)}.sc-z-input-h input[readonly].sc-z-input:focus:focus-visible{border-color:var(--color-form-surface03);box-shadow:none}.input-success.sc-z-input{border-color:var(--color-form-success01);background:var(--color-form-inverse-success)}.input-success.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-success.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-success01)}.input-error.sc-z-input{border-color:var(--color-form-hover-error);background:var(--color-form-inverse-error)}.input-error.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-error.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-error)}.input-warning.sc-z-input{border-color:var(--color-form-hover-warning);background:var(--color-form-inverse-warning)}.input-warning.sc-z-input:focus:focus-visible+.icons-wrapper.sc-z-input,.input-warning.sc-z-input+.icons-wrapper.sc-z-input{fill:var(--color-form-hover-warning)}.sc-z-input:is(.input-success,.input-error.sc-z-input,.input-warning).sc-z-input:focus:focus-visible{color:var(--color-form-default-text)}.sc-z-input-h:not(.active-select) input[readonly].sc-z-input,.textarea-wrapper.readonly.sc-z-input{border-color:var(--color-form-surface03);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled=\"false\"]) input.sc-z-input,[disabled].sc-z-input-h:not([disabled=\"false\"]) .textarea-wrapper.sc-z-input,[disabled].sc-z-input-h:not([disabled=\"false\"]) z-icon.sc-z-input{border-color:var(--color-form-disabled03);box-shadow:none;color:var(--color-form-disabled-text);fill:var(--color-form-disabled01-icon);pointer-events:none}[disabled].sc-z-input-h:not([disabled=\"false\"]) input.sc-z-input:hover{border-width:var(--border-size-small)}input.sc-z-input::placeholder,textarea.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::-webkit-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input:-ms-textarea-placeholder{color:var(--color-form-placeholder-text)}.sc-z-input::placeholder{color:var(--color-form-placeholder-text)}label.input-label.sc-z-input{display:block;padding-bottom:var(--space-unit);color:var(--color-default-text);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);text-align:left;text-transform:uppercase}[disabled].sc-z-input-h:not([disabled=\"false\"]) label.input-label.sc-z-input{color:var(--color-disabled03)}.text-wrapper.sc-z-input>div.sc-z-input{position:relative;z-index:1;fill:var(--color-form-default-icon)}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{width:100%;height:calc(var(--space-unit) * 5.5);box-sizing:border-box;padding:0 calc(var(--space-unit) * 1.5);margin:0}[size=\"small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4.5)}[size=\"x-small\"].sc-z-input-h .text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input{height:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.sc-z-input,.text-wrapper.sc-z-input>div.sc-z-input>input.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 5.25)}.text-wrapper.sc-z-input>div.sc-z-input>input.has-icon.has-clear-icon.sc-z-input{padding-right:calc(var(--space-unit) * 8)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input{position:absolute;z-index:2;top:50%;right:calc(var(--space-unit) * 1.5);display:flex;pointer-events:none;transform:translateY(-50%)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input{display:flex;padding:0;border:0;background:none;color:inherit;font:inherit;pointer-events:initial}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input+.input-icon.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.hidden.sc-z-input{display:none}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.reset-icon.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.toggle-password-icon.sc-z-input{cursor:pointer}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.sc-z-input{--z-icon-width:18px;--z-icon-height:18px;display:block}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.small.sc-z-input,.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>.input-icon.x-small.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}.text-wrapper.sc-z-input .icons-wrapper.sc-z-input>button.input-icon.sc-z-input:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}.text-wrapper.sc-z-input>div.sc-z-input>input.sc-z-input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:currentcolor}.textarea-wrapper.sc-z-input{width:100%;height:100%;padding:calc(var(--space-unit) * 1.5)}.textarea-wrapper.sc-z-input:not(.input-error,.input-success.sc-z-input,.input-warning).sc-z-input{background-color:var(--color-form-background)}textarea.sc-z-input{width:100%;min-height:132px;padding:0;border:none;margin:0;color:currentcolor;resize:none}.radio-wrapper.sc-z-input,.checkbox-wrapper.sc-z-input{position:relative;display:inline-flex;flex-direction:row;align-items:center;color:var(--color-default-text);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input:hover,.checkbox-wrapper.sc-z-input:hover{color:var(--color-hover-primary);fill:var(--color-hover-primary-icon)}.radio-wrapper.sc-z-input>input.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input .radio-label.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{display:inline-flex;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input input.sc-z-input:not(:disabled)+.checkbox-label.sc-z-input{cursor:pointer}.radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{cursor:pointer;fill:inherit}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:16px;--z-icon-height:16px}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-2)}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input z-icon.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input z-icon.sc-z-input{--z-icon-width:14px;--z-icon-height:14px}[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.sc-z-input{font-size:var(--font-size-1)}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input{flex-direction:row}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input{flex-direction:row-reverse}.radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,.checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:var(--space-unit)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.after.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.after.sc-z-input>span.sc-z-input{margin-left:calc(var(--space-unit) * 0.5)}[size=\"small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .radio-wrapper.sc-z-input .radio-label.before.sc-z-input>span.sc-z-input,[size=\"x-small\"].sc-z-input-h .checkbox-wrapper.sc-z-input .checkbox-label.before.sc-z-input>span.sc-z-input{margin-right:calc(var(--space-unit) * 0.5)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input{border-radius:50%}.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{border-radius:var(--border-radius-small)}.radio-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:focus:focus-visible+.checkbox-label.sc-z-input>z-icon.sc-z-input{box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input{color:var(--color-disabled03)}.radio-wrapper.sc-z-input>input.sc-z-input:disabled+.radio-label.sc-z-input>z-icon.sc-z-input,.checkbox-wrapper.sc-z-input>input.sc-z-input:disabled+.checkbox-label.sc-z-input>z-icon.sc-z-input{cursor:default;fill:var(--color-disabled01)}";
-
-const ZInput = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.inputChange = createEvent(this, "inputChange", 7);
-        this.startTyping = createEvent(this, "startTyping", 7);
-        this.stopTyping = createEvent(this, "stopTyping", 7);
-        this.inputCheck = createEvent(this, "inputCheck", 7);
-        this.inputFocus = createEvent(this, "inputFocus", 7);
-        this.inputBlur = createEvent(this, "inputBlur", 7);
-        this.typingtimeout = 300;
-        this.htmlid = `id-${randomId()}`;
-        this.type = undefined;
-        this.name = undefined;
-        this.label = undefined;
-        this.ariaLabel = "";
-        this.ariaExpanded = "";
-        this.ariaControls = undefined;
-        this.ariaAutocomplete = undefined;
-        this.ariaActivedescendant = undefined;
-        this.value = undefined;
-        this.disabled = false;
-        this.readonly = false;
-        this.required = false;
-        this.checked = false;
-        this.placeholder = undefined;
-        this.htmltitle = undefined;
-        this.status = undefined;
-        this.message = true;
-        this.labelPosition = LabelPosition.RIGHT;
-        this.autocomplete = undefined;
-        this.role = "";
-        this.hasclearicon = true;
-        this.icon = undefined;
-        this.min = undefined;
-        this.minlength = undefined;
-        this.max = undefined;
-        this.maxlength = undefined;
-        this.step = undefined;
-        this.pattern = undefined;
-        this.size = ControlSize.BIG;
-        this.isTyping = false;
-        this.passwordHidden = true;
-    }
-    inputCheckListener(e) {
-        const data = e.detail;
-        switch (this.type) {
-            case InputType.RADIO:
-                if (data.type === InputType.RADIO && data.name === this.name && data.id !== this.htmlid) {
-                    this.checked = false;
-                }
-                break;
-        }
-    }
-    /** get checked status */
-    async isChecked() {
-        switch (this.type) {
-            case InputType.CHECKBOX:
-            case InputType.RADIO:
-                return this.checked;
-            default:
-                console.warn("`isChecked` method is only available for type `checkbox` and `radio`");
-                return false;
-        }
-    }
-    emitInputChange(value) {
-        if (!this.isTyping) {
-            this.emitStartTyping();
-        }
-        let validity;
-        if (this.type === InputType.TEXTAREA) {
-            validity = this.getValidity("textarea");
-        }
-        else {
-            validity = this.getValidity("input");
-        }
-        this.value = value;
-        this.inputChange.emit({ value, validity });
-        clearTimeout(this.timer);
-        this.timer = setTimeout(() => {
-            this.emitStopTyping(this.value, validity);
-        }, this.typingtimeout);
-    }
-    emitStartTyping() {
-        this.isTyping = true;
-        this.startTyping.emit();
-    }
-    emitStopTyping(value, validity) {
-        this.isTyping = false;
-        this.stopTyping.emit({
-            value: value,
-            validity: validity,
-        });
-    }
-    emitInputCheck(checked) {
-        this.inputCheck.emit({
-            id: this.htmlid,
-            checked: checked,
-            type: this.type,
-            name: this.name,
-            value: this.value,
-            validity: this.getValidity("input"),
-        });
-    }
-    emitInputFocus() {
-        this.inputFocus.emit({ id: this.htmlid });
-    }
-    emitInputBlur() {
-        this.inputBlur.emit({ id: this.htmlid });
-    }
-    getValidity(type) {
-        const input = this.hostElement.querySelector(type);
-        return input.validity;
-    }
-    /* START text/password/email/number */
-    getTextAttributes() {
-        return {
-            id: this.htmlid,
-            name: this.name,
-            placeholder: this.placeholder,
-            value: this.value,
-            disabled: this.disabled,
-            readonly: this.readonly,
-            required: this.required,
-            title: this.htmltitle,
-            minlength: this.minlength,
-            maxlength: this.maxlength,
-            class: {
-                [`input-${this.status}`]: !!this.status,
-            },
-            autocomplete: this.autocomplete,
-            onInput: (e) => this.emitInputChange(e.target.value),
-        };
-    }
-    getNumberAttributes(type) {
-        if (type != InputType.NUMBER) {
-            return;
-        }
-        return {
-            min: this.min,
-            max: this.max,
-            step: this.step,
-        };
-    }
-    getPatternAttribute(type) {
-        if (type != InputType.PASSWORD &&
-            type != InputType.TEXT &&
-            type != InputType.TEL &&
-            type != InputType.SEARCH &&
-            type != InputType.URL &&
-            type != InputType.EMAIL) {
-            return;
-        }
-        return {
-            pattern: this.pattern,
-        };
-    }
-    getRoleAttribute() {
-        return this.role ? { role: this.role } : {};
-    }
-    getAriaAttrubutes() {
-        const expanded = this.ariaExpanded ? { "aria-expanded": this.ariaExpanded } : {};
-        const controls = this.ariaControls ? { "aria-controls": this.ariaControls } : {};
-        const autocomplete = this.ariaAutocomplete ? { "aria-autocomplete": this.ariaAutocomplete } : {};
-        const activedescendant = this.ariaActivedescendant ? { "aria-activedescendant": this.ariaActivedescendant } : {};
-        return Object.assign(Object.assign(Object.assign(Object.assign({}, expanded), controls), autocomplete), activedescendant);
-    }
-    getFocusBlurAttributes() {
-        return {
-            onFocus: () => this.emitInputFocus(),
-            onBlur: () => this.emitInputBlur(),
-        };
-    }
-    renderInputText(type = InputType.TEXT) {
-        const ariaLabel = this.ariaLabel ? { "aria-label": this.ariaLabel } : {};
-        const attr = Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, this.getTextAttributes()), this.getNumberAttributes(type)), this.getPatternAttribute(type)), ariaLabel), this.getRoleAttribute()), this.getAriaAttrubutes()), this.getFocusBlurAttributes());
-        if (this.icon || type === InputType.PASSWORD) {
-            Object.assign(attr.class, { "has-icon": true });
-        }
-        if (this.hasclearicon && type != InputType.NUMBER) {
-            Object.assign(attr.class, { "has-clear-icon": true });
-        }
-        return (h("div", { class: "text-wrapper" }, this.renderLabel(), h("div", null, h("input", Object.assign({ type: type === InputType.PASSWORD && !this.passwordHidden ? InputType.TEXT : type }, attr, { ref: (el) => (this.inputRef = el) })), this.renderIcons()), this.renderMessage()));
-    }
-    renderLabel() {
-        if (!this.label) {
-            return;
-        }
-        return (h("label", { class: "input-label body-5-sb", id: `${this.htmlid}_label`, htmlFor: this.htmlid }, this.label));
-    }
-    renderIcons() {
-        return (h("span", { class: "icons-wrapper" }, this.renderResetIcon(), this.renderIcon()));
-    }
-    renderIcon() {
-        if (this.type === InputType.PASSWORD) {
-            return this.renderShowHidePassword();
-        }
-        if (!this.icon) {
-            return;
-        }
-        return (h("z-icon", { name: this.icon, class: { [this.size]: true, "input-icon": true } }));
-    }
-    renderResetIcon() {
-        let hidden = false;
-        if (!this.hasclearicon || !this.value || this.disabled || this.readonly || this.type == InputType.NUMBER) {
-            hidden = true;
-        }
-        return (h("button", { type: "button", class: { "reset-icon": true, "input-icon": true, hidden }, "aria-label": "cancella il contenuto dell'input", onClick: () => {
-                this.inputRef.value = "";
-                this.emitInputChange("");
-            } }, h("z-icon", { name: "multiply", class: this.size })));
-    }
-    renderShowHidePassword() {
-        return (h("button", { type: "button", class: "input-icon toggle-password-icon", disabled: this.disabled, "aria-label": this.passwordHidden ? "mostra password" : "nascondi password", onClick: () => (this.passwordHidden = !this.passwordHidden) }, h("z-icon", { name: this.passwordHidden ? "view-filled" : "view-off-filled", class: this.size })));
-    }
-    renderMessage() {
-        if (boolean(this.message) === false) {
-            return;
-        }
-        return (h("z-input-message", { message: boolean(this.message) === true ? undefined : this.message, status: this.status, class: this.size, disabled: this.disabled }));
-    }
-    /* END text/password/email/number */
-    /* START textarea */
-    renderTextarea() {
-        const attributes = this.getTextAttributes();
-        return (h(Fragment, null, this.renderLabel(), h("div", { class: Object.assign(Object.assign({}, attributes.class), { "textarea-wrapper": true, "readonly": !!attributes.readonly }) }, h("textarea", Object.assign({}, attributes, { class: Object.assign(Object.assign({}, attributes.class), { "z-scrollbar": true }), "aria-label": this.ariaLabel || undefined }, this.getRoleAttribute()))), this.renderMessage()));
-    }
-    /* END textarea */
-    handleCheck(ev) {
-        this.checked = ev.target.checked;
-        this.emitInputCheck(this.checked);
-    }
-    /* START checkbox */
-    renderCheckbox() {
-        return (h("div", { class: "checkbox-wrapper" }, h("input", Object.assign({ id: this.htmlid, type: "checkbox", name: this.name, checked: this.checked, disabled: this.disabled, readonly: this.readonly, required: this.required, onChange: this.handleCheck.bind(this), value: this.value }, this.getRoleAttribute(), this.getFocusBlurAttributes())), h("label", { htmlFor: this.htmlid, class: {
-                "checkbox-label": true,
-                "after": this.labelPosition === LabelPosition.RIGHT,
-                "before": this.labelPosition === LabelPosition.LEFT,
-            } }, h("z-icon", { name: this.checked ? "checkbox-checked" : "checkbox", class: this.size }), this.label && h("span", { innerHTML: this.label }))));
-    }
-    /* END checkbox */
-    /* START radio */
-    renderRadio() {
-        return (h("div", { class: "radio-wrapper" }, h("input", Object.assign({ id: this.htmlid, type: "radio", name: this.name, checked: this.checked, disabled: this.disabled, readonly: this.readonly, onChange: this.handleCheck.bind(this), value: this.value }, this.getRoleAttribute(), this.getFocusBlurAttributes())), h("label", { htmlFor: this.htmlid, class: {
-                "radio-label": true,
-                "after": this.labelPosition === LabelPosition.RIGHT,
-                "before": this.labelPosition === LabelPosition.LEFT,
-            } }, h("z-icon", { name: this.checked ? "radio-button-checked" : "radio-button", class: this.size }), this.label && h("span", { innerHTML: this.label }))));
-    }
-    /* END radio */
-    render() {
-        let input;
-        switch (this.type) {
-            case InputType.TEXTAREA:
-                input = this.renderTextarea();
-                break;
-            case InputType.CHECKBOX:
-                input = this.renderCheckbox();
-                break;
-            case InputType.RADIO:
-                input = this.renderRadio();
-                break;
-            default:
-                input = this.renderInputText(this.type);
-        }
-        return h(Host, { key: '716ee8b89dbfeffedfdbfa8785c3994a94c44f44' }, input);
-    }
-    get hostElement() { return getElement(this); }
-};
-ZInput.style = stylesCss$1;
-
-const stylesCss = ":host{display:flex;min-height:calc(var(--space-unit) * 2.5);align-items:start;margin-top:var(--space-unit);color:var(--color-default-text);fill:currentcolor;font-family:var(--font-family-sans);font-size:var(--font-size-2);letter-spacing:0.16px}:host(.small),:host(.x-small){margin-top:calc(var(--space-unit) * 0.5);font-size:var(--font-size-1)}:host([status=\"success\"]){color:var(--color-hover-success)}:host([status=\"error\"]){color:var(--color-hover-error)}:host([status=\"warning\"]){color:var(--color-hover-warning)}:host(:focus){outline:none}:host>z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);--z-icon-right-margin:var(--space-unit);margin-top:calc(var(--space-unit) * 0.25)}:host(.small)>z-icon,:host(.x-small)>z-icon{--z-icon-width:14px;--z-icon-height:14px;--z-icon-right-margin:calc(var(--space-unit) * 0.5)}:host([disabled]){color:var(--color-disabled03);fill:var(--color-disabled03)}";
-
-const ZInputMessage = class {
-    constructor(hostRef) {
-        registerInstance(this, hostRef);
-        this.statusIcons = {
-            success: "checkmark-circle",
-            error: "multiply-circled",
-            warning: "exclamation-circle",
-        };
-        this.message = undefined;
-        this.status = undefined;
-        this.disabled = undefined;
-        this.statusRole = {};
-    }
-    onMessageChange() {
-        this.statusRole = this.message && this.status ? { role: "alert" } : {};
-    }
-    componentWillLoad() {
-        this.onMessageChange();
-    }
-    render() {
-        return (h(Host, Object.assign({ key: 'ef26c50e4e8f21bed23b6b530f34866bb9d746af' }, this.statusRole, { "aria-label": this.message }), this.statusIcons[this.status] && this.message && h("z-icon", { key: '1c701e5f10e96e549fc3e799cbc16099f2032956', name: this.statusIcons[this.status] }), h("span", { key: '9a12b124d65a4b4ebcb9856ce6e9fa275d96ac64', innerHTML: this.message })));
-    }
-    static get watchers() { return {
-        "message": ["onMessageChange"],
-        "status": ["onMessageChange"]
-    }; }
-};
-ZInputMessage.style = stylesCss;
-
-export { ZInput as z_input, ZInputMessage as z_input_message };
-//# sourceMappingURL=z-input.z-input-message.entry.js.map
-
-//# sourceMappingURL=z-input_2.entry.js.map