@zanichelli/albe-web-components 18.2.0 → 18.2.1

package/dist/collection/components/z-chip/index.js

@@ -9,11 +9,11 @@ export class ZChip {
         this.ariaLabel = "";
     }
     render() {
-        return (h("div", { key: 'f298fec6fee651bf99d7eb287f758021afb8b3b7', class: {
+        return (h("div", { key: '0c1d69ed8078ff340f797d27d2b74798471c001b', class: {
                 "z-chip-container": true,
                 "z-chip-interactive": !!this.interactiveIcon,
                 [this.type]: true,
-            }, "aria-disabled": this.disabled }, this.icon && h("z-icon", { key: '2ee1ad57ac26ca309542f87b209cb071c8edd174', name: this.icon }), h("slot", { key: '8c37d2157e77e82a5a3a833e000592e9d1980a80' }), this.interactiveIcon && (h("button", { key: 'df795b0413c1f6cd8a97efd1ef57fb4127083cb0', type: "button", onClick: () => this.interactiveIconClick.emit(), "aria-label": this.ariaLabel, disabled: this.disabled }, h("z-icon", { key: 'fbfaf3b3df75f783b248de61486b07e4d117335c', class: "interactive-icon", name: this.interactiveIcon })))));
+            }, "aria-disabled": this.disabled }, this.icon && h("z-icon", { key: 'baa00891b0130541f3a820a08678d2f1eef894b7', name: this.icon }), h("slot", { key: 'd49c8dc5643a7f42f62ab086f9ae97da18aa2561' }), this.interactiveIcon && (h("button", { key: '970f2ccfd3cf3718627e8aec7bfe06d957694030', type: "button", onClick: () => this.interactiveIconClick.emit(), "aria-label": this.ariaLabel, disabled: this.disabled }, h("z-icon", { key: '68c899a4e14a204eaac9fc7d2be37dfd5af1b087', class: "interactive-icon", name: this.interactiveIcon })))));
     }
     static get is() { return "z-chip"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/z-combobox/index.js

@@ -251,7 +251,7 @@ export class ZCombobox {
         return (h("div", { class: "check-all-wrapper" }, h("z-input", { type: InputType.CHECKBOX, checked: allChecked, htmlid: checkAllId, class: this.getCheckboxClass(), label: allChecked ? this.uncheckalltext : this.checkalltext, disabled: this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size, role: "option", "aria-selected": allChecked ? "true" : "false", onKeyDown: (e) => this.handleSelectArrowsNavigation(e, checkAllId), onInputCheck: (e) => this.checkAll(e.detail.checked), onInputFocus: (e) => this.handleCheckboxFocus(e.detail.id) })));
     }
     render() {
-        return (h("div", { key: 'f9e2fc533ccbebfaa72bc7eed6bd57fd6552a4fb', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
+        return (h("div", { key: '5f5a261815a1e041fe8958fdd5444b7b0a49845b', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
     }
     static get is() { return "z-combobox"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-cover-hero/index.js

@@ -35,9 +35,9 @@ export class ZCoverHero {
         return (h("div", { class: "content-container" }, h("slot", { name: "content" })));
     }
     render() {
-        return (h(Host, { key: '778bbf291108b26191769f57408abd96e28bf95d' }, this.variant === CoverHeroVariant.STACKED &&
+        return (h(Host, { key: '9d19bccd90d41d823dedfd22d4735806513e02b4' }, this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.TOP &&
-            this.renderContent(), h("div", { key: '648e41fe0943939797b73323a3f746ff884b8f54', class: "main-container" }, h("div", { key: '2b9f9f1f996cd56cb85669875c08379f0bfa2c20', class: "cover-container" }, h("slot", { key: 'c0586ce06659006ef1929095e43f8708d324eaec', name: "cover" })), h("slot", { key: '7a67416d291fcf85905d10bafbf37ce651917fda', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
+            this.renderContent(), h("div", { key: 'c700a2f18c53e2ee3f0893bb5e06c591847cbf3d', class: "main-container" }, h("div", { key: '32d74cad8e5c8ca8e6bf14a98dda4f490eca8983', class: "cover-container" }, h("slot", { key: '3b54102807692fa0bd3c13ec02ca577dd817f12c', name: "cover" })), h("slot", { key: '330c4c5cb791cb34d6ae5c797f5af17b55e6173b', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.BOTTOM &&
             this.renderContent()));
     }

package/dist/collection/components/z-divider/index.js

@@ -7,7 +7,7 @@ export class ZDivider {
         this.orientation = DividerOrientation.HORIZONTAL;
     }
     render() {
-        return (h(Host, { key: '65ff62cb6eb5e7c452bd78ca0818f84d2cbe7a06', class: `divider-${this.size} divider-${this.orientation}`, style: { backgroundColor: `var(--${this.color})` } }));
+        return (h(Host, { key: '04573f93294d9e35e7901c677476414b9d1eb74f', class: `divider-${this.size} divider-${this.orientation}`, style: { backgroundColor: `var(--${this.color})` } }));
     }
     static get is() { return "z-divider"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/z-ghost-loading/index.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class ZGhostLoading {
     render() {
-        return h(Host, { key: 'bf81f9a8a42163a8ec5ddec0e97dda8dee2bb15b' });
+        return h(Host, { key: '06569bdb14202a00a873fc4d8336448b20115378' });
     }
     static get is() { return "z-ghost-loading"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-icon/index.js

@@ -15,7 +15,7 @@ export class ZIcon {
         return h("polygon", { points: ICONS[this.name] });
     }
     render() {
-        return (h(Host, { key: 'fdf876a0af1632805ab24af1c593ef5bff78271a', "aria-hidden": "true" }, h("svg", { key: 'fc339ba7c96345b920c370f8476be850332c3eed', viewBox: "0 0 1000 1000", width: this.width, height: this.height, id: this.iconid, fill: this.fill ? `var(--${this.fill})` : "" }, this.selectPathOrPolygon(ICONS[this.name]))));
+        return (h(Host, { key: '427cac0797fc718938ee45da5999b8a2bf70e570', "aria-hidden": "true" }, h("svg", { key: '23275947c49b69095acbec1df2ecec0f04da3525', viewBox: "0 0 1000 1000", width: this.width, height: this.height, id: this.iconid, fill: this.fill ? `var(--${this.fill})` : "" }, this.selectPathOrPolygon(ICONS[this.name]))));
     }
     static get is() { return "z-icon"; }
     static get encapsulation() { return "shadow"; }
@@ -49,11 +49,11 @@ export class ZIcon {
                 "reflect": false
             },
             "height": {
-                "type": "number",
+                "type": "any",
                 "mutable": false,
                 "complexType": {
-                    "original": "number",
-                    "resolved": "number",
+                    "original": "number | string",
+                    "resolved": "number | string",
                     "references": {}
                 },
                 "required": false,
@@ -66,11 +66,11 @@ export class ZIcon {
                 "reflect": false
             },
             "width": {
-                "type": "number",
+                "type": "any",
                 "mutable": false,
                 "complexType": {
-                    "original": "number",
-                    "resolved": "number",
+                    "original": "number | string",
+                    "resolved": "number | string",
                     "references": {}
                 },
                 "required": false,

package/dist/collection/components/z-icon/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAO9C,MAAM,OAAO,KAAK;;;;;;;;IAqBR,mBAAmB,CAAC,SAAiB;QAC3C,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/B,OAAO,YAAM,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAS,CAAC;QAC5C,CAAC;QAED,OAAO,eAAS,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAY,CAAC;IACvD,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,oEAAa,MAAM;YACtB,4DACE,OAAO,EAAC,eAAe,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,EAAE,EAAE,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,IAE3C,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CACvC,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ICONS} from \"../../constants/iconset\";\n\n@Component({\n  tag: \"z-icon\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZIcon {\n  /** icon name */\n  @Prop()\n  name: string;\n\n  /** icon height (optional) */\n  @Prop()\n  height?: number;\n\n  /** icon width (optional) */\n  @Prop()\n  width?: number;\n\n  /** icon id (optional) */\n  @Prop()\n  iconid?: string;\n\n  /** icon fill (optional) */\n  @Prop()\n  fill?: string;\n\n  private selectPathOrPolygon(iconValue: string): SVGPathElement | SVGPolygonElement {\n    if (iconValue?.startsWith(\"M\")) {\n      return <path d={ICONS[this.name]}></path>;\n    }\n\n    return <polygon points={ICONS[this.name]}></polygon>;\n  }\n\n  render(): SVGElement {\n    return (\n      <Host aria-hidden=\"true\">\n        <svg\n          viewBox=\"0 0 1000 1000\"\n          width={this.width}\n          height={this.height}\n          id={this.iconid}\n          fill={this.fill ? `var(--${this.fill})` : \"\"}\n        >\n          {this.selectPathOrPolygon(ICONS[this.name])}\n        </svg>\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,KAAK,EAAC,MAAM,yBAAyB,CAAC;AAO9C,MAAM,OAAO,KAAK;;;;;;;;IAqBR,mBAAmB,CAAC,SAAiB;QAC3C,IAAI,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,UAAU,CAAC,GAAG,CAAC,EAAE,CAAC;YAC/B,OAAO,YAAM,CAAC,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAS,CAAC;QAC5C,CAAC;QAED,OAAO,eAAS,MAAM,EAAE,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,GAAY,CAAC;IACvD,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,oEAAa,MAAM;YACtB,4DACE,OAAO,EAAC,eAAe,EACvB,KAAK,EAAE,IAAI,CAAC,KAAK,EACjB,MAAM,EAAE,IAAI,CAAC,MAAM,EACnB,EAAE,EAAE,IAAI,CAAC,MAAM,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,SAAS,IAAI,CAAC,IAAI,GAAG,CAAC,CAAC,CAAC,EAAE,IAE3C,IAAI,CAAC,mBAAmB,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CACvC,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ICONS} from \"../../constants/iconset\";\n\n@Component({\n  tag: \"z-icon\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZIcon {\n  /** icon name */\n  @Prop()\n  name: string;\n\n  /** icon height (optional) */\n  @Prop()\n  height?: number | string;\n\n  /** icon width (optional) */\n  @Prop()\n  width?: number | string;\n\n  /** icon id (optional) */\n  @Prop()\n  iconid?: string;\n\n  /** icon fill (optional) */\n  @Prop()\n  fill?: string;\n\n  private selectPathOrPolygon(iconValue: string): SVGPathElement | SVGPolygonElement {\n    if (iconValue?.startsWith(\"M\")) {\n      return <path d={ICONS[this.name]}></path>;\n    }\n\n    return <polygon points={ICONS[this.name]}></polygon>;\n  }\n\n  render(): SVGElement {\n    return (\n      <Host aria-hidden=\"true\">\n        <svg\n          viewBox=\"0 0 1000 1000\"\n          width={this.width}\n          height={this.height}\n          id={this.iconid}\n          fill={this.fill ? `var(--${this.fill})` : \"\"}\n        >\n          {this.selectPathOrPolygon(ICONS[this.name])}\n        </svg>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/z-icon/index.stories.js

@@ -1,10 +1,20 @@
 import { html } from "lit";
 import { getColorTokens } from "../../utils/storybook-utils";
 import "./index";
-export default {
+const StoryMeta = {
     title: "ZIcon",
     component: "z-icon",
     argTypes: {
+        width: {
+            control: {
+                type: "text",
+            },
+        },
+        height: {
+            control: {
+                type: "text",
+            },
+        },
         fill: {
             options: getColorTokens().map((token) => token.replace("--", "")),
             control: {
@@ -19,6 +29,7 @@ export default {
         fill: "color-primary01",
     },
 };
+export default StoryMeta;
 export const Default = {
     render: (args) => html `<z-icon
       name="${args.name}"
@@ -27,4 +38,18 @@ export const Default = {
       fill="${args.fill}"
     ></z-icon>`,
 };
+export const ZIconRem = {
+    args: {
+        name: "download",
+        height: "1.125rem",
+        width: "1.125rem",
+        fill: "color-primary01",
+    },
+    render: (args) => html `<z-icon
+      name="${args.name}"
+      height="${args.height}"
+      width="${args.width}"
+      fill="${args.fill}"
+    ></z-icon>`,
+};
 //# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-icon/index.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,eAAe;IACb,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YACjE,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,iBAAiB;KACxB;CACoB,CAAC;AAExB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;gBACP,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;eACR;CACd,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZIcon} from \".\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nexport default {\n  title: \"ZIcon\",\n  component: \"z-icon\",\n  argTypes: {\n    fill: {\n      options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n      control: {\n        type: \"select\",\n      },\n    },\n  },\n  args: {\n    name: \"download\",\n    height: 24,\n    width: 24,\n    fill: \"color-primary01\",\n  },\n} satisfies Meta<ZIcon>;\n\nexport const Default = {\n  render: (args) =>\n    html`<z-icon\n      name=\"${args.name}\"\n      height=\"${args.height}\"\n      width=\"${args.width}\"\n      fill=\"${args.fill}\"\n    ></z-icon>`,\n};\n"]}
+{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-icon/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,QAAQ;IACnB,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,MAAM,EAAE;YACN,OAAO,EAAE;gBACP,IAAI,EAAE,MAAM;aACb;SACF;QACD,IAAI,EAAE;YACJ,OAAO,EAAE,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;YACjE,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,EAAE;QACT,IAAI,EAAE,iBAAiB;KACxB;CACoB,CAAC;AAExB,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;gBACP,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;eACR;CACE,CAAC;AAElB,MAAM,CAAC,MAAM,QAAQ,GAAG;IACtB,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU;QAChB,MAAM,EAAE,UAAU;QAClB,KAAK,EAAE,UAAU;QACjB,IAAI,EAAE,iBAAiB;KACxB;IACD,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;gBACP,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;eACR;CACE,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZIcon} from \".\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nconst StoryMeta = {\n  title: \"ZIcon\",\n  component: \"z-icon\",\n  argTypes: {\n    width: {\n      control: {\n        type: \"text\",\n      },\n    },\n    height: {\n      control: {\n        type: \"text\",\n      },\n    },\n    fill: {\n      options: getColorTokens().map((token) => token.replace(\"--\", \"\")),\n      control: {\n        type: \"select\",\n      },\n    },\n  },\n  args: {\n    name: \"download\",\n    height: 24,\n    width: 24,\n    fill: \"color-primary01\",\n  },\n} satisfies Meta<ZIcon>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZIcon>;\n\nexport const Default = {\n  render: (args) =>\n    html`<z-icon\n      name=\"${args.name}\"\n      height=\"${args.height}\"\n      width=\"${args.width}\"\n      fill=\"${args.fill}\"\n    ></z-icon>`,\n} satisfies Story;\n\nexport const ZIconRem = {\n  args: {\n    name: \"download\",\n    height: \"1.125rem\",\n    width: \"1.125rem\",\n    fill: \"color-primary01\",\n  },\n  render: (args) =>\n    html`<z-icon\n      name=\"${args.name}\"\n      height=\"${args.height}\"\n      width=\"${args.width}\"\n      fill=\"${args.fill}\"\n    ></z-icon>`,\n} satisfies Story;\n"]}

package/dist/collection/components/z-icon/styles.css

@@ -6,9 +6,9 @@
 }
 
 :host svg:not([width]) {
-  width: var(--z-icon-width, 18px);
+  width: var(--z-icon-width, 1.125rem);
 }
 
 :host svg:not([height]) {
-  height: var(--z-icon-height, 18px);
+  height: var(--z-icon-height, 1.125rem);
 }

package/dist/collection/components/z-info-box/index.js

@@ -11,7 +11,7 @@ export class ZInfoBox {
         this.infoBoxClose.emit({ boxid: this.boxid });
     }
     render() {
-        return (h("div", { key: 'f8042fc7ac5f86f6023c2ed1c9a883aef87e1064', id: this.boxid }, h("slot", { key: 'b518c1864d89232be174880a07f871f382c255b6', name: "content" }), this.isclosable && (h("z-icon", { key: '58b3730cbacf445bfa6097c47ab6f4fc558ef404', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
+        return (h("div", { key: '97f595bcb0456f5a5178d713253f44798e97aa64', id: this.boxid }, h("slot", { key: 'dad87fab0f68993bfd0c255b10d7949e8df64ce4', name: "content" }), this.isclosable && (h("z-icon", { key: '405f33531ac9fb80f1677837c4e873fc609b289f', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
     }
     static get is() { return "z-info-box"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-info-reveal/index.js

@@ -50,7 +50,7 @@ export class ZInfoReveal {
         }
     }
     render() {
-        return (h(Host, { key: 'db7f27575bc8af8b9e3b3b1e49f24e25f9c4bc81', open: this.open }, h("button", { key: 'e73aac3a73abd56bdde77a324afce36c935af94a', 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: '1dc7e3e5a2259dcf6199387f2601d33200262290', name: this.icon }), this.label && h("span", { key: '738d19a9cd45bcb7bdd7954af2f6d8b3ab3db607', class: "z-info-reveal-label" }, this.label)), h("div", { key: '3e3d2967bae86e8d771a97410af7a60071ae53d3', class: "z-info-reveal-panel", id: "z-info-reveal-panel", ref: (el) => (this.panel = el), hidden: !this.open }, h("slot", { key: 'f8d97c7f92f87e981eca6d8c3be184c16adbc079' }), h("button", { key: 'db6a7e6bad33bb3e669e6b1dad1c2e4308882000', class: "z-info-reveal-close", type: "button", onClick: this.closePanel.bind(this), "aria-label": "Chiudi pannello informazioni" }, h("z-icon", { key: 'a031272c3558f918556bbc45af47566c7edd6dce', name: "multiply" })))));
+        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" })))));
     }
     static get is() { return "z-info-reveal"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-input/index.js

@@ -259,7 +259,7 @@ export class ZInput {
             default:
                 input = this.renderInputText(this.type);
         }
-        return h(Host, { key: 'e6da498fffe9f65443c3adf2a30995209582c9bc' }, input);
+        return h(Host, { key: '716ee8b89dbfeffedfdbfa8785c3994a94c44f44' }, input);
     }
     static get is() { return "z-input"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/z-input-message/index.js

@@ -18,7 +18,7 @@ export class ZInputMessage {
         this.onMessageChange();
     }
     render() {
-        return (h(Host, Object.assign({ key: '919a2529c38124f49831f98be6500d63209ff06c' }, this.statusRole, { "aria-label": this.message }), this.statusIcons[this.status] && this.message && h("z-icon", { key: 'e1bfac5cf309cdc16850fe59beda60f2a3c03822', name: this.statusIcons[this.status] }), h("span", { key: '2790e625b47cd9efe8f2e71f7e741ff237ccf645', innerHTML: this.message })));
+        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 is() { return "z-input-message"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-logo/index.js

@@ -16,7 +16,7 @@ export class ZLogo {
         if (this.height) {
             style["height"] = style["max-height"] = `${this.height}px`;
         }
-        return (h(Host, { key: '06126b5c946902a25659b899bb8a24bf5cefd7eb', style: style, class: { mobile: !!this.mobileLogo } }, this.link ? (h("a", { href: this.link, target: this.targetBlank ? "_blank" : "_self" }, h("img", { alt: this.imageAlt }))) : (h("img", { alt: this.imageAlt }))));
+        return (h(Host, { key: 'df9ab886a8af4c38414cb06e6ecc044154338e67', style: style, class: { mobile: !!this.mobileLogo } }, this.link ? (h("a", { href: this.link, target: this.targetBlank ? "_blank" : "_self" }, h("img", { alt: this.imageAlt }))) : (h("img", { alt: this.imageAlt }))));
     }
     static get is() { return "z-logo"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-menu-section/index.js

@@ -174,7 +174,7 @@ export class ZMenuSection {
         this.onItemsChange();
     }
     render() {
-        return (h(Host, { key: '90fcce7d61b4b588841d06905eaa81b49fe64ce6', open: this.open }, h("button", { key: '477f0cfd742e2e5a01a3ab9207da8ff4cca5acd0', ref: (el) => (this.label = el), class: "label", "aria-haspopup": `${!!this.hasItems}`, "aria-expanded": `${!!this.open}`, role: "menuitem", tabindex: this.htmlTabindex, onClick: this.onLabelClick, onKeyDown: this.onLabelKeydown }, h("slot", { key: '75b03026e1296a5c9611d46d6891e5911eeeedb1', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: 'eb056e5b49a728cc93637af36aa88b51337a2e28', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '392e0837741e43ab71667cbdfbfbb2049391f973', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: '711e8c269ad328c8b34b1a5f28f90dc266510c31', name: "section", onSlotchange: this.onItemsChange }))));
+        return (h(Host, { key: 'b308fce3890a3094dca7d5de4f5837b47d6f2796', open: this.open }, h("button", { key: 'dd6eaa241e2f26c79b7fa0e6f7e14049c20b3ed6', ref: (el) => (this.label = el), class: "label", "aria-haspopup": `${!!this.hasItems}`, "aria-expanded": `${!!this.open}`, role: "menuitem", tabindex: this.htmlTabindex, onClick: this.onLabelClick, onKeyDown: this.onLabelKeydown }, h("slot", { key: '74f5c61fcf32df69b0b5d17ff0f06b5b62f940fa', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: '8338d8b57893c110475fe980320310236abb3446', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '4df11f5eaa5226c24930527caba7f0bfa048946a', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: '8393b22b945ec02e32e78248090505a012529253', name: "section", onSlotchange: this.onItemsChange }))));
     }
     static get is() { return "z-menu-section"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-modal/index.js

@@ -123,16 +123,16 @@ export class ZModal {
         e.preventDefault();
     }
     render() {
-        return (h("dialog", { key: '9fa977b576b3828480a694565022622f717d3991', class: {
+        return (h("dialog", { key: '8b921668da4604e386536b7aad9f29aa79f8c070', class: {
                 "modal-dialog": !this.scrollInside,
-            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: '168c660fcf3dab742a4bd250c371383eec907aa4', class: {
+            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: 'ff7c0a54c27501f0de55fa051f4181dbb67b45f8', class: {
                 "modal-container": true,
                 "modal-container-scroll-inside": this.scrollInside,
                 "modal-container-scroll-outside": !this.scrollInside,
-            }, id: this.modalid }, h("header", { key: 'f1830279516fdab9257c14f1708492b6d96cbe70', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: '3065f8affee38460cf293d47e7f29ce9161f5f78' }, this.modaltitle && h("h1", { key: 'c6e32d9cc56cfc8034dc3211485eb95fe9e05606', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: 'a717648146cb312e40bb09dc7b046f8280b52b17', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: '3e2456ff5f803f1e090061ae3f5ea67d8aab000e', class: {
+            }, id: this.modalid }, h("header", { key: 'bc3fb5a42fc5b9b7a4a0772edc128b3b2cdb4145', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: '0dbf87678b992d60df083e61f301ac43df103dbb' }, this.modaltitle && h("h1", { key: '7e61c3c9efc52d5b8d9a457907af76f9e10365a7', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: '594aedcd430c5f132973c59dfdba288b657243ba', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: 'ac5d89b074eb7ab21acd3a5ae0846f96f2a9df66', class: {
                 "modal-content-scroll-inside": this.scrollInside,
                 "modal-content-scroll-outside": !this.scrollInside,
-            }, id: "modal-content" }, h("slot", { key: '74fa8cad5ddcb0d75eb9dd9feef348f2dc1b35ee', name: "modalContent" }))), h("div", { key: '8c6d0427520febeade44d8ed06b2dfe930a16d59', class: {
+            }, id: "modal-content" }, h("slot", { key: 'f6810e73b2dc2fc698bebed654698d267b113f11', name: "modalContent" }))), h("div", { key: '65bd11b7941467700592d45edd0ec078cde6f145', class: {
                 "modal-background": true,
                 "modal-background-scroll-outside": !this.scrollInside,
             }, "data-action": "modalBackground", "data-modal": this.modalid, onClick: () => {

package/dist/collection/components/z-navigation-tabs/index.js

@@ -208,10 +208,10 @@ export class ZNavigationTabs {
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '4202639d48d44e713a85ec34eb123f1ca3b7df02', class: {
+        return (h(Host, { key: 'a9ef822fd6963ee4726b2ca21e744bd4f05e1ad0', class: {
                 "interactive-2": this.size === NavigationTabsSize.SMALL,
                 "interactive-1": this.size !== NavigationTabsSize.SMALL,
-            }, scrollable: this.canNavigate }, h("button", { key: '15ffe092d153db3e707da88864da59090408885d', class: "navigation-button", onClick: this.navigateBackwards.bind(this), tabIndex: -1, disabled: !this.canNavigatePrev, "aria-label": "Mostra elementi precedenti", hidden: !this.canNavigate }, h("z-icon", { key: '8fc6b30874893bcb4bc0809bc3912105dac533f8', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'ea45e4d47677c2006ba272696b8d0fe3e9a55af1', role: "tablist", "aria-label": this.ariaLabel, ref: (el) => (this.nav = el !== null && el !== void 0 ? el : this.nav), onScroll: this.checkScrollEnabled.bind(this), "aria-orientation": this.orientation }, h("slot", { key: 'be42086314346446c5266fb3f28d792b05e5509e' })), h("button", { key: '545755b0358654f43f279f5ea723a2be19ec62a7', class: "navigation-button", onClick: this.navigateForward.bind(this), tabIndex: -1, disabled: !this.canNavigateNext, "aria-label": "Mostra elementi successivi", hidden: !this.canNavigate }, h("z-icon", { key: '959ad0a93c1a82e12cb818fd43f864388b1b67bb', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
+            }, scrollable: this.canNavigate }, h("button", { key: 'caa08658d0c5c4883999919094d45b228cd55869', class: "navigation-button", onClick: this.navigateBackwards.bind(this), tabIndex: -1, disabled: !this.canNavigatePrev, "aria-label": "Mostra elementi precedenti", hidden: !this.canNavigate }, h("z-icon", { key: 'fedbe3077c767d0fd72b48c9bcab3fec8db43b39', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'b35b18ced0fe4dbd2533c68f8441a2d356175726', role: "tablist", "aria-label": this.ariaLabel, ref: (el) => (this.nav = el !== null && el !== void 0 ? el : this.nav), onScroll: this.checkScrollEnabled.bind(this), "aria-orientation": this.orientation }, h("slot", { key: '48d80980576b4cd06ad7450430529558aa7ba1eb' })), h("button", { key: 'b36285b9d650e1388082250ea03f82da939af58f', class: "navigation-button", onClick: this.navigateForward.bind(this), tabIndex: -1, disabled: !this.canNavigateNext, "aria-label": "Mostra elementi successivi", hidden: !this.canNavigate }, h("z-icon", { key: '3f42c48291a15584299869c3064c165647ca7499', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
     }
     static get is() { return "z-navigation-tabs"; }
     static get originalStyleUrls() {

package/dist/collection/components/z-notification/index.js

@@ -25,7 +25,7 @@ export class ZNotification {
     }
     render() {
         var _a;
-        return (h(Host, { key: '20cc99ee217b1e452cdf9499f5b110a65ed316e8' }, this.contenticonname && (h("z-icon", { key: 'b28e2d1c2f2e701ed3a1821db38e4d512688bb6a', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '7241c3cdc688271e74d059497bb20acb40baa280', class: "content-container" }, h("div", { key: 'a88472e43e6069e418c3a6666935968d49fd0f97', class: "content-text" }, h("slot", { key: '9f5bb799c4e0234e5bb132c2fc164fd073cf65d3' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: 'b1f68ca6cb0235981a6346541f38ea12d292587f', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '956699cf5b3abef8ffedcc3f136f4c1b84a209ce', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'af7fe83cc6686a364b5e0165fcf684716cf67c13', name: "multiply-circle", width: 16, height: 16 })))));
+        return (h(Host, { key: '3681c9216f7ab0ce532c8b1ed013d7af611151de' }, this.contenticonname && (h("z-icon", { key: 'e7c538a5583873ed4ad95885f1199050b89f6732', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '93855c8906e6a65fa2d762fc447d14ee7a456b53', class: "content-container" }, h("div", { key: '526f760b7739c28154195e7a01ce66b185ccb068', class: "content-text" }, h("slot", { key: '56313ec91ad750e57af3035455aa89db3880ae4e' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: 'fc2de2fa3ff7cdf5e522f009efa41af06f8a6cca', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '3ba0d198a3617d1a05fb33eb8f3ceb9b0d685503', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: '0bba4473674bee1c8c4abbc5792c9cab84c06088', name: "multiply-circle", width: 16, height: 16 })))));
     }
     static get is() { return "z-notification"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-offcanvas/index.js

@@ -66,7 +66,7 @@ export class ZOffcanvas {
         this.open = false;
     }
     render() {
-        return (h(Host, { key: '9a9c6e3c3f980f8004b398ae8b0c55bc10f5449f', "skip-animation": this.skipAnimation, "aria-hidden": !this.open ? "true" : null }, h("div", { key: 'e6d7d7c21cbf000b312292032f5866a9d565ea86', class: "canvas-container", role: "presentation", ref: (el) => (this.canvasContainer = el) }, h("div", { key: 'b4e9935c0b0bc5d3aca14013448068ffb48f29bb', class: "canvas-content z-scrollbar", role: "presentation" }, h("slot", { key: '884558175709f4d62aa7540d8b31802d53017126', name: "canvasContent" }))), (this.variant == OffCanvasVariant.OVERLAY || this.transitiondirection === TransitionDirection.UP) && (h("div", { key: 'd6f83f4bf0a3b5a8295226d81fa687a40aececda', class: "canvas-background", onClick: () => (this.open = false) }))));
+        return (h(Host, { key: '299c69d8788f7cf2e12b6f6eb151c3b7c5e4e271', "skip-animation": this.skipAnimation, "aria-hidden": !this.open ? "true" : null }, h("div", { key: '2620f2f0ef0741cbe6e5d63f7ed38299fb253852', class: "canvas-container", role: "presentation", ref: (el) => (this.canvasContainer = el) }, h("div", { key: '1df851d5c4d1fddb24a62c5e3d92a7181bd36d05', class: "canvas-content z-scrollbar", role: "presentation" }, h("slot", { key: '89303666352d55c9a92a0b4cecc9bea8d42125f7', name: "canvasContent" }))), (this.variant == OffCanvasVariant.OVERLAY || this.transitiondirection === TransitionDirection.UP) && (h("div", { key: '197e3eb34f5981c52a553875157a3a02993f7684', class: "canvas-background", onClick: () => (this.open = false) }))));
     }
     static get is() { return "z-offcanvas"; }
     static get encapsulation() { return "scoped"; }

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

@@ -16,12 +16,12 @@ export class ZPanelElem {
     }
     render() {
         const elemId = this.elemid ? this.elemid : "";
-        return (h("div", { key: 'a969f8ebeb2bf77ba045a87b55f7570d023ffeb6', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '67692b24bb6198e926956f90ab5812056a839dcf', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '26e77e2d8a11a91bd72afad5e8ba4d3c6d56d632', src: this.imgurl, alt: this.imgalt }))), h("div", { key: '985d91a02e9b0db88c20fc6c5d880cf7d79881cc', class: "panel-elem-link" }, h("a", { key: 'd121b217babdab2bd0c30108922b7ccbc4690221', class: {
+        return (h("div", { key: '0812aa28734e176eaa553ba98011e4e9c7e9522c', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: 'ad62ef2a70a88716ef12b177117e820267e62762', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '8891d636ff439e25801a60a14e65e4dcad6d6038', src: this.imgurl, alt: this.imgalt }))), h("div", { key: 'aa1275fe9fa4f33cf9c7151bb192e9acce2d3070', class: "panel-elem-link" }, h("a", { key: '6500ac1c11088d22b12de3c63fd8e065c0cf100d', class: {
                 "z-link": true,
                 "z-link-disabled": this.isdisabled,
                 "z-link-icon": true,
                 "z-link-blue": true,
-            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: '3b2a5bf811493521611ae4b95799a62e3e23ecd4', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '866b699f492288307fb1f01356bf53654670888e', class: "panel-elem-desc" }, h("slot", { key: '0c2a3fecf4d4d9b2fda23a3ace0b88bbd01966cc', name: this.descrSlotName })))));
+            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: '143e204c1d1bd20178a46a9d77110b9219464c99', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '9215d44929526bc6e9b8034debbec3f23b00d5ef', class: "panel-elem-desc" }, h("slot", { key: '036bc705038c03e6c021807f5d2217208ec46c9c', name: this.descrSlotName })))));
     }
     static get is() { return "z-panel-elem"; }
     static get encapsulation() { return "scoped"; }

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

@@ -301,7 +301,7 @@ export class ZPopover {
         this.onOpen();
     }
     render() {
-        return h("slot", { key: '520839c57687a59a45f7ef356de1b34787d1acd4' });
+        return h("slot", { key: 'f7f6f81dc2698b5d560503a984dcd47e377de0bc' });
     }
     static get is() { return "z-popover"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-searchbar/index.js

@@ -286,7 +286,7 @@ export class ZSearchbar {
         return (h("z-list-element", { role: "option", tabindex: 0, clickable: true, id: `list-item-${this.htmlid}-show-all`, onClickItem: () => (this.currResultsCount = 0), color: "color-primary01" }, h("div", { class: "item-show-all" }, "Vedi tutti i risultati")));
     }
     render() {
-        return (h(Host, { key: 'cc39817de805447fe7f47210216366df394f862b', onFocus: () => (this.showResults = true), onClick: (e) => this.handleOutsideClick(e), class: { "has-submit": this.showSearchButton, "has-results": this.autocomplete } }, h("div", { key: 'f91887f06e4fcf0525c30acc4331579ae84fcd3c', class: "input-container" }, this.renderInput(), this.renderResults()), this.renderButton()));
+        return (h(Host, { key: '700c1b24aa29998ad1f51ddeff187bb462c87d39', onFocus: () => (this.showResults = true), onClick: (e) => this.handleOutsideClick(e), class: { "has-submit": this.showSearchButton, "has-results": this.autocomplete } }, h("div", { key: 'fb8c855749a9d3e901cd350d4d0246c2f2b3d183', class: "input-container" }, this.renderInput(), this.renderResults()), this.renderButton()));
     }
     static get is() { return "z-searchbar"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-select/index.js

@@ -466,7 +466,7 @@ export class ZSelect {
         return (h("z-input-message", { message: boolean(this.message) === true ? undefined : this.message, status: this.status, class: this.size, disabled: this.disabled }));
     }
     render() {
-        return (h("div", { key: '3d387c6835c33fd7fe875223800a342d3fc50762', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
+        return (h("div", { key: '50d85283f13af94f07e960f17e2f8126c7f2469e', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
     }
     static get is() { return "z-select"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/z-visually-hidden/index.js

@@ -1,7 +1,7 @@
 import { h } from "@stencil/core";
 export class ZVisuallyHidden {
     render() {
-        return h("slot", { key: '9ce7d87881fa96e717bc1556d5242cbfe68d0739' });
+        return h("slot", { key: '3d75845d1ec7fa620b82b32f68fe73368d800e61' });
     }
     static get is() { return "z-visually-hidden"; }
     static get encapsulation() { return "shadow"; }

package/dist/components/index.d.ts

@@ -119,7 +119,7 @@ export { ZRangePicker as ZRangePicker } from '../types/components/date-picker/z-
 export { defineCustomElement as defineCustomElementZRangePicker } from './z-range-picker';
 export { ZSearchbar as ZSearchbar } from '../types/components/z-searchbar/index';
 export { defineCustomElement as defineCustomElementZSearchbar } from './z-searchbar';
-export { ZSectionTitle as ZSectionTitle } from '../types/components/z-section-title/index';
+export { ZSectionTitle as ZSectionTitle } from '../types/components/deprecated/z-section-title/index';
 export { defineCustomElement as defineCustomElementZSectionTitle } from './z-section-title';
 export { ZSelect as ZSelect } from '../types/components/z-select/index';
 export { defineCustomElement as defineCustomElementZSelect } from './z-select';

package/dist/components/index10.js

@@ -49,7 +49,7 @@ const ZInfoReveal = /*@__PURE__*/ proxyCustomElement(class ZInfoReveal extends H
         }
     }
     render() {
-        return (h(Host, { key: 'db7f27575bc8af8b9e3b3b1e49f24e25f9c4bc81', open: this.open }, h("button", { key: 'e73aac3a73abd56bdde77a324afce36c935af94a', 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: '1dc7e3e5a2259dcf6199387f2601d33200262290', name: this.icon }), this.label && h("span", { key: '738d19a9cd45bcb7bdd7954af2f6d8b3ab3db607', class: "z-info-reveal-label" }, this.label)), h("div", { key: '3e3d2967bae86e8d771a97410af7a60071ae53d3', class: "z-info-reveal-panel", id: "z-info-reveal-panel", ref: (el) => (this.panel = el), hidden: !this.open }, h("slot", { key: 'f8d97c7f92f87e981eca6d8c3be184c16adbc079' }), h("button", { key: 'db6a7e6bad33bb3e669e6b1dad1c2e4308882000', class: "z-info-reveal-close", type: "button", onClick: this.closePanel.bind(this), "aria-label": "Chiudi pannello informazioni" }, h("z-icon", { key: 'a031272c3558f918556bbc45af47566c7edd6dce', name: "multiply" })))));
+        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 this; }
     static get watchers() { return {

package/dist/components/index11.js

@@ -272,7 +272,7 @@ const ZInput = /*@__PURE__*/ proxyCustomElement(class ZInput extends HTMLElement
             default:
                 input = this.renderInputText(this.type);
         }
-        return h(Host, { key: 'e6da498fffe9f65443c3adf2a30995209582c9bc' }, input);
+        return h(Host, { key: '716ee8b89dbfeffedfdbfa8785c3994a94c44f44' }, input);
     }
     get hostElement() { return this; }
     static get style() { return ZInputStyle0; }

package/dist/components/index12.js

@@ -26,7 +26,7 @@ const ZInputMessage = /*@__PURE__*/ proxyCustomElement(class ZInputMessage exten
         this.onMessageChange();
     }
     render() {
-        return (h(Host, Object.assign({ key: '919a2529c38124f49831f98be6500d63209ff06c' }, this.statusRole, { "aria-label": this.message }), this.statusIcons[this.status] && this.message && h("z-icon", { key: 'e1bfac5cf309cdc16850fe59beda60f2a3c03822', name: this.statusIcons[this.status] }), h("span", { key: '2790e625b47cd9efe8f2e71f7e741ff237ccf645', innerHTML: this.message })));
+        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"],

package/dist/components/index13.js

@@ -25,7 +25,7 @@ const ZList = /*@__PURE__*/ proxyCustomElement(class ZList extends HTMLElement {
         this.setChildrenSizeType();
     }
     render() {
-        return (h(Host, { key: 'b8c56afd8f7e7bc741811796373511d8bea0e134' }, h("slot", { key: 'd38c7d0cda75c379d2b7f3b1a30f6b02cb6cec5f' })));
+        return (h(Host, { key: 'f178d7e0463f0e0495aa3029dd8a14b3947770ad' }, h("slot", { key: '9f177d9529829d8eb48329cfc969c739c24c5a52' })));
     }
     get host() { return this; }
     static get style() { return ZListStyle0; }

package/dist/components/index14.js

@@ -126,7 +126,7 @@ const ZListElement = /*@__PURE__*/ proxyCustomElement(class ZListElement extends
         }
     }
     render() {
-        return (h(Host, { key: '7275a62d92ddfa15c3ab65be4509029e0c696757', "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onFocus: () => this.ariaDescendantFocus.emit(this.listElementId), onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: this.hasTreeItems ? undefined : this.htmlTabindex, role: this.hasTreeItems ? "none" : this.role }, h("div", { key: '422279708849ca0c34ec54eab90a3159107b4e70', class: this.hasTreeItems ? "tree-element-container" : "container", style: { color: `var(--${this.color})` }, tabindex: "-1", id: `z-list-element-id-${this.listElementId}`, part: "list-item-container" }, h("div", { key: 'dde7317eab7945dbe785b03727c4210f5e88c377', class: "z-list-element-container" }, this.renderExpandableButton(), this.renderContent()), this.renderExpandedContent()), this.dividerType === ListDividerType.ELEMENT && (h("z-divider", { key: 'c91885e38afd87b9f0b68e9e5bc3b4913274eec7', class: { "z-tree-list-divider": this.hasTreeItems }, color: this.dividerColor, size: this.dividerSize }))));
+        return (h(Host, { key: 'e85405b1ec7beb005da77e536f26ddbc336b8e85', "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onFocus: () => this.ariaDescendantFocus.emit(this.listElementId), onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: this.hasTreeItems ? undefined : this.htmlTabindex, role: this.hasTreeItems ? "none" : this.role }, h("div", { key: '00aa30024263577a239edd5ab76fe655f42ffa5c', class: this.hasTreeItems ? "tree-element-container" : "container", style: { color: `var(--${this.color})` }, tabindex: "-1", id: `z-list-element-id-${this.listElementId}`, part: "list-item-container" }, h("div", { key: '03e62ff1c159abab3d96086e54fb975a37cc06fc', class: "z-list-element-container" }, this.renderExpandableButton(), this.renderContent()), this.renderExpandedContent()), this.dividerType === ListDividerType.ELEMENT && (h("z-divider", { key: '64675717abe6bb63de0b3ec39c638fc445639ce3', class: { "z-tree-list-divider": this.hasTreeItems }, color: this.dividerColor, size: this.dividerSize }))));
     }
     get host() { return this; }
     static get style() { return ZListElementStyle0; }

package/dist/components/index15.js

@@ -34,11 +34,11 @@ const ZListGroup = /*@__PURE__*/ proxyCustomElement(class ZListGroup extends HTM
         this.hasHeader = !!this.host.querySelector('[slot="header-title"]');
     }
     render() {
-        return (h(Host, { key: 'e1e930b456d48f33cee98df8b0cff95a1e4ef284', role: "group" }, h("div", { key: '9774b849c0a10d22a9dfee59e02fe06e2f2574d9', class: {
+        return (h(Host, { key: '1e3229205e55482b92dc8d0a972d9f9e1805ba56', role: "group" }, h("div", { key: 'ede88ef3d1845e0c432b7a00b8f9dc959ce258e6', class: {
                 "z-list-group-header-container": true,
                 "has-header": this.hasHeader && !this.hasTreeItems,
                 "grouped-tree-list-header": this.hasTreeItems,
-            } }, h("slot", { key: '754ee43ea298bb22452859671d509480d311918b', name: "header-title" }), this.dividerType === ListDividerType.HEADER && (h("z-divider", { key: '5033e52bedd67862875cb05a5ebc3a4d3f4765fa', color: this.dividerColor, size: this.dividerSize }))), h("slot", { key: '469a386f1d102b371aad8e9bfcd1ea7a3d5e8ee9' })));
+            } }, h("slot", { key: 'd6c2cef7568424ebab1ae5d3dc572d4bc2aba61c', name: "header-title" }), this.dividerType === ListDividerType.HEADER && (h("z-divider", { key: '5e45b81c54db4f623d366e62817f2a60ede8fa19', color: this.dividerColor, size: this.dividerSize }))), h("slot", { key: '2a1a7ad0e3f8b56dd4880b8215ab79bd27981804' })));
     }
     get host() { return this; }
     static get style() { return ZListGroupStyle0; }

package/dist/components/index16.js

@@ -985,16 +985,16 @@ const ZModal = /*@__PURE__*/ proxyCustomElement(class ZModal extends HTMLElement
         e.preventDefault();
     }
     render() {
-        return (h("dialog", { key: '9fa977b576b3828480a694565022622f717d3991', class: {
+        return (h("dialog", { key: '8b921668da4604e386536b7aad9f29aa79f8c070', class: {
                 "modal-dialog": !this.scrollInside,
-            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: '168c660fcf3dab742a4bd250c371383eec907aa4', class: {
+            }, "aria-labelledby": "modal-title", "aria-describedby": "modal-content", role: this.alertdialog ? "alertdialog" : undefined, ref: (el) => (this.dialog = el), onClose: () => this.emitModalClose(), onCancel: (e) => this.handleEscape(e) }, h("div", { key: 'ff7c0a54c27501f0de55fa051f4181dbb67b45f8', class: {
                 "modal-container": true,
                 "modal-container-scroll-inside": this.scrollInside,
                 "modal-container-scroll-outside": !this.scrollInside,
-            }, id: this.modalid }, h("header", { key: 'f1830279516fdab9257c14f1708492b6d96cbe70', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: '3065f8affee38460cf293d47e7f29ce9161f5f78' }, this.modaltitle && h("h1", { key: 'c6e32d9cc56cfc8034dc3211485eb95fe9e05606', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: 'a717648146cb312e40bb09dc7b046f8280b52b17', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: '3e2456ff5f803f1e090061ae3f5ea67d8aab000e', class: {
+            }, id: this.modalid }, h("header", { key: 'bc3fb5a42fc5b9b7a4a0772edc128b3b2cdb4145', onClick: this.emitModalHeaderActive.bind(this) }, h("div", { key: '0dbf87678b992d60df083e61f301ac43df103dbb' }, this.modaltitle && h("h1", { key: '7e61c3c9efc52d5b8d9a457907af76f9e10365a7', id: "modal-title" }, this.modaltitle), this.closeButtonSlot()), this.modalsubtitle && (h("div", { key: '594aedcd430c5f132973c59dfdba288b657243ba', class: "subtitle", id: "modal-subtitle" }, this.modalsubtitle))), h("div", { key: 'ac5d89b074eb7ab21acd3a5ae0846f96f2a9df66', class: {
                 "modal-content-scroll-inside": this.scrollInside,
                 "modal-content-scroll-outside": !this.scrollInside,
-            }, id: "modal-content" }, h("slot", { key: '74fa8cad5ddcb0d75eb9dd9feef348f2dc1b35ee', name: "modalContent" }))), h("div", { key: '8c6d0427520febeade44d8ed06b2dfe930a16d59', class: {
+            }, id: "modal-content" }, h("slot", { key: 'f6810e73b2dc2fc698bebed654698d267b113f11', name: "modalContent" }))), h("div", { key: '65bd11b7941467700592d45edd0ec078cde6f145', class: {
                 "modal-background": true,
                 "modal-background-scroll-outside": !this.scrollInside,
             }, "data-action": "modalBackground", "data-modal": this.modalid, onClick: () => {

package/dist/components/index22.js

@@ -67,7 +67,7 @@ const ZOffcanvas = /*@__PURE__*/ proxyCustomElement(class ZOffcanvas extends HTM
         this.open = false;
     }
     render() {
-        return (h(Host, { key: '9a9c6e3c3f980f8004b398ae8b0c55bc10f5449f', "skip-animation": this.skipAnimation, "aria-hidden": !this.open ? "true" : null }, h("div", { key: 'e6d7d7c21cbf000b312292032f5866a9d565ea86', class: "canvas-container", role: "presentation", ref: (el) => (this.canvasContainer = el) }, h("div", { key: 'b4e9935c0b0bc5d3aca14013448068ffb48f29bb', class: "canvas-content z-scrollbar", role: "presentation" }, h("slot", { key: '884558175709f4d62aa7540d8b31802d53017126', name: "canvasContent" }))), (this.variant == OffCanvasVariant.OVERLAY || this.transitiondirection === TransitionDirection.UP) && (h("div", { key: 'd6f83f4bf0a3b5a8295226d81fa687a40aececda', class: "canvas-background", onClick: () => (this.open = false) }))));
+        return (h(Host, { key: '299c69d8788f7cf2e12b6f6eb151c3b7c5e4e271', "skip-animation": this.skipAnimation, "aria-hidden": !this.open ? "true" : null }, h("div", { key: '2620f2f0ef0741cbe6e5d63f7ed38299fb253852', class: "canvas-container", role: "presentation", ref: (el) => (this.canvasContainer = el) }, h("div", { key: '1df851d5c4d1fddb24a62c5e3d92a7181bd36d05', class: "canvas-content z-scrollbar", role: "presentation" }, h("slot", { key: '89303666352d55c9a92a0b4cecc9bea8d42125f7', name: "canvasContent" }))), (this.variant == OffCanvasVariant.OVERLAY || this.transitiondirection === TransitionDirection.UP) && (h("div", { key: '197e3eb34f5981c52a553875157a3a02993f7684', class: "canvas-background", onClick: () => (this.open = false) }))));
     }
     static get watchers() { return {
         "variant": ["handlePageOverflow"],

package/dist/components/index23.js

@@ -302,7 +302,7 @@ const ZPopover = /*@__PURE__*/ proxyCustomElement(class ZPopover extends HTMLEle
         this.onOpen();
     }
     render() {
-        return h("slot", { key: '520839c57687a59a45f7ef356de1b34787d1acd4' });
+        return h("slot", { key: 'f7f6f81dc2698b5d560503a984dcd47e377de0bc' });
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/index24.js

@@ -300,7 +300,7 @@ const ZSearchbar = /*@__PURE__*/ proxyCustomElement(class ZSearchbar extends HTM
         return (h("z-list-element", { role: "option", tabindex: 0, clickable: true, id: `list-item-${this.htmlid}-show-all`, onClickItem: () => (this.currResultsCount = 0), color: "color-primary01" }, h("div", { class: "item-show-all" }, "Vedi tutti i risultati")));
     }
     render() {
-        return (h(Host, { key: 'cc39817de805447fe7f47210216366df394f862b', onFocus: () => (this.showResults = true), onClick: (e) => this.handleOutsideClick(e), class: { "has-submit": this.showSearchButton, "has-results": this.autocomplete } }, h("div", { key: 'f91887f06e4fcf0525c30acc4331579ae84fcd3c', class: "input-container" }, this.renderInput(), this.renderResults()), this.renderButton()));
+        return (h(Host, { key: '700c1b24aa29998ad1f51ddeff187bb462c87d39', onFocus: () => (this.showResults = true), onClick: (e) => this.handleOutsideClick(e), class: { "has-submit": this.showSearchButton, "has-results": this.autocomplete } }, h("div", { key: 'fb8c855749a9d3e901cd350d4d0246c2f2b3d183', class: "input-container" }, this.renderInput(), this.renderResults()), this.renderButton()));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/index5.js

@@ -17,11 +17,11 @@ const ZChip = /*@__PURE__*/ proxyCustomElement(class ZChip extends HTMLElement {
         this.ariaLabel = "";
     }
     render() {
-        return (h("div", { key: 'f298fec6fee651bf99d7eb287f758021afb8b3b7', class: {
+        return (h("div", { key: '0c1d69ed8078ff340f797d27d2b74798471c001b', class: {
                 "z-chip-container": true,
                 "z-chip-interactive": !!this.interactiveIcon,
                 [this.type]: true,
-            }, "aria-disabled": this.disabled }, this.icon && h("z-icon", { key: '2ee1ad57ac26ca309542f87b209cb071c8edd174', name: this.icon }), h("slot", { key: '8c37d2157e77e82a5a3a833e000592e9d1980a80' }), this.interactiveIcon && (h("button", { key: 'df795b0413c1f6cd8a97efd1ef57fb4127083cb0', type: "button", onClick: () => this.interactiveIconClick.emit(), "aria-label": this.ariaLabel, disabled: this.disabled }, h("z-icon", { key: 'fbfaf3b3df75f783b248de61486b07e4d117335c', class: "interactive-icon", name: this.interactiveIcon })))));
+            }, "aria-disabled": this.disabled }, this.icon && h("z-icon", { key: 'baa00891b0130541f3a820a08678d2f1eef894b7', name: this.icon }), h("slot", { key: 'd49c8dc5643a7f42f62ab086f9ae97da18aa2561' }), this.interactiveIcon && (h("button", { key: '970f2ccfd3cf3718627e8aec7bfe06d957694030', type: "button", onClick: () => this.interactiveIconClick.emit(), "aria-label": this.ariaLabel, disabled: this.disabled }, h("z-icon", { key: '68c899a4e14a204eaac9fc7d2be37dfd5af1b087', class: "interactive-icon", name: this.interactiveIcon })))));
     }
     get el() { return this; }
     static get style() { return ZChipStyle0; }

package/dist/components/index6.js

@@ -13,7 +13,7 @@ const ZDivider = /*@__PURE__*/ proxyCustomElement(class ZDivider extends HTMLEle
         this.orientation = DividerOrientation.HORIZONTAL;
     }
     render() {
-        return (h(Host, { key: '65ff62cb6eb5e7c452bd78ca0818f84d2cbe7a06', class: `divider-${this.size} divider-${this.orientation}`, style: { backgroundColor: `var(--${this.color})` } }));
+        return (h(Host, { key: '04573f93294d9e35e7901c677476414b9d1eb74f', class: `divider-${this.size} divider-${this.orientation}`, style: { backgroundColor: `var(--${this.color})` } }));
     }
     static get style() { return ZDividerStyle0; }
 }, [2, "z-divider", {