@zanichelli/albe-web-components 16.4.0 → 17.0.0-RC1

package/dist/components/z-combobox.js

@@ -3,11 +3,11 @@ import { I as InputType, e as ControlSize, i as ListSize, g as KeyboardCode, l a
 import { r as randomId, h as handleKeyboardSubmit } from './utils.js';
 import { d as defineCustomElement$8 } from './index6.js';
 import { d as defineCustomElement$7 } from './index9.js';
-import { d as defineCustomElement$6 } from './index10.js';
-import { d as defineCustomElement$5 } from './index11.js';
-import { d as defineCustomElement$4 } from './index13.js';
-import { d as defineCustomElement$3 } from './index14.js';
-import { d as defineCustomElement$2 } from './index20.js';
+import { d as defineCustomElement$6 } from './index11.js';
+import { d as defineCustomElement$5 } from './index12.js';
+import { d as defineCustomElement$4 } from './index14.js';
+import { d as defineCustomElement$3 } from './index15.js';
+import { d as defineCustomElement$2 } from './index21.js';
 
 const stylesCss = ":host{display:block;font-family:var(--font-family-sans)}:host>div.fixed{position:relative}:host>div>.header{position:relative;z-index:10;display:flex;min-height:42px;align-items:center;justify-content:space-between;padding:0 calc(var(--space-unit) * 1.5);border:var(--border-size-small) solid var(--color-surface04);margin:0;background-color:var(--color-input-field01);border-radius:var(--border-radius-small);cursor:pointer}:host([size=\"small\"])>div>.header{min-height:34px;font-size:var(--font-size-2)}:host([size=\"x-small\"])>div>.header{min-height:30px;font-size:var(--font-size-2)}:host([size=\"x-small\"])>div>.header p.body-3{padding:calc(var(--space-unit) * 0.5) 0}:host>div>.header:hover{outline:var(--border-size-medium) solid var(--color-surface04);outline-offset:-2px}:host>div>div.header:focus:focus-visible{z-index:16;box-shadow:var(--shadow-focus-primary);outline:none}:host>div>.header>p.body-3{padding:var(--space-unit) 0;margin:0;color:var(--color-default-text)}:host>div>.header>p.body-3>span{font-weight:var(--font-sb)}:host>div>.header>z-icon{fill:var(--color-default-icon);transform:rotate(360deg);transition:all 200ms linear}:host>div>.header>z-icon.small,:host>div>.header>z-icon.x-small{--z-icon-width:16px;--z-icon-height:16px}:host>div.open>.header{border:var(--border-size-small) solid var(--color-primary01);border-radius:var(--border-radius-small) var(--border-radius-small) 0 0}:host>div.disabled{pointer-events:none}:host>div.disabled .header{border-color:var(--color-disabled01);fill:var(--color-disabled01)}:host>div.disabled .header>p.body-3{color:var(--color-disabled03)}:host>div.disabled .header>z-icon:last-child{fill:var(--color-disabled01)}:host>div.open>.header>z-icon{fill:var(--color-default-icon);transform:rotate(180deg);transition:all 200ms linear}:host>div.open>div.open-combo-data{position:relative;z-index:12;padding:var(--space-unit) calc(var(--space-unit) * 2);border:var(--border-size-small) solid var(--gray200);border-top:0;background-color:var(--color-input-field01);border-radius:0}:host>div.open>div.open-combo-data>div>div{overflow:auto;max-height:235px;padding:0;scrollbar-color:var(--color-primary01) transparent}:host>div.open>div.open-combo-data>z-input{width:100%;margin-bottom:calc(var(--space-unit) * 2)}:host>div.open>div.open-combo-data>div>div>ul{max-height:235px;padding:0 3px;margin:0}::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01)}:host>div.open>z-input{position:relative;z-index:1;width:238px;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01)}:host>div.open>div.open-combo-data>div>div.search{overflow:hidden;max-height:auto;margin-top:0;box-shadow:1px 1px 4px 2px rgb(217 222 227 / 50%)}:host>div.open>div.open-combo-data>div>div.search>ul{overflow:auto;max-height:180px;padding:var(--space-unit) calc(var(--space-unit) * 2);scrollbar-color:var(--color-primary01) transparent}:host>div.open>div.open-combo-data>div>div.search>div{display:flex;justify-content:center}:host>div.open>div.open-combo-data>div>div.search>div>a{display:inline-block;height:44px;color:var(--color-primary01);cursor:pointer;font-size:14px;font-weight:var(--font-sb);line-height:44px;text-align:center;text-transform:uppercase}:host>div.open>div.open-combo-data>div>div.search>div>a:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5);border-bottom:var(--border-size-small) solid var(--gray800);margin-bottom:var(--space-unit);text-align:left}:host([size=\"small\"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:calc(var(--space-unit) * 1.5) calc(var(--space-unit) * 0.5)}:host([size=\"x-small\"])>div.open>div.open-combo-data>div>div.check-all-wrapper{padding:var(--space-unit) calc(var(--space-unit) * 0.5)}";
 const ZComboboxStyle0 = stylesCss;
@@ -266,7 +266,7 @@ const ZCombobox$1 = /*@__PURE__*/ proxyCustomElement(class ZCombobox extends HTM
         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: '303335d1978e653877985ff2435f836bca278400', "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: '7c86e932e576074306566fbdb4946fc5cc6a5015', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
     }
     get element() { return this; }
     static get watchers() { return {

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

@@ -31,9 +31,9 @@ const ZCoverHero$1 = /*@__PURE__*/ proxyCustomElement(class ZCoverHero extends H
         return (h("div", { class: "content-container" }, h("slot", { name: "content" })));
     }
     render() {
-        return (h(Host, { key: '1a87367d3abb5790f0ea6cacf7d3e75eacbff59d' }, this.variant === CoverHeroVariant.STACKED &&
+        return (h(Host, { key: 'b0851f69b3ca2ef898886381f01b547b59a7f76b' }, this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.TOP &&
-            this.renderContent(), h("div", { key: 'b84e940db5381001045b9ebe7dfec5069ab27694', class: "main-container" }, h("div", { key: 'f46b165bd73a5eca477cd43164999ad5517b821c', class: "cover-container" }, h("slot", { key: 'cf61e486fd79bbbf38aa788f33dbd857dba86109', name: "cover" })), h("slot", { key: 'd0a748e763dde074c1c25c9aacf84d7357c17f14', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
+            this.renderContent(), h("div", { key: '9045149da53fd0efb3c0e3f67a3ba15f7d9ee5a4', class: "main-container" }, h("div", { key: '76ecd3d33c52a01c5e4287487691617ffe5384bf', class: "cover-container" }, h("slot", { key: 'a779df5cdc886d42bf6ba7844b28ba950d31db4e', name: "cover" })), h("slot", { key: 'eb64e17b43080632764f0fb29d16cd0fb9295f7f', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.BOTTOM &&
             this.renderContent()));
     }

package/dist/components/z-date-picker.js

@@ -2,8 +2,8 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { c as commonjsGlobal, f as flatpickr, i as it, s as setAriaOptions, a as setFlatpickrPosition, v as validateDate } from './utils2.js';
 import { y as ZDatePickerMode, F as ZDatePickerPosition, I as InputType } from './index2.js';
 import { d as defineCustomElement$4 } from './index9.js';
-import { d as defineCustomElement$3 } from './index10.js';
-import { d as defineCustomElement$2 } from './index11.js';
+import { d as defineCustomElement$3 } from './index11.js';
+import { d as defineCustomElement$2 } from './index12.js';
 
 var monthSelect = {exports: {}};
 
@@ -465,7 +465,7 @@ const ZDatePicker$1 = /*@__PURE__*/ proxyCustomElement(class ZDatePicker extends
             } })));
     }
     render() {
-        return (h("div", { key: 'e36383db1da5908e5c61fcc543ff6006a0b5d27a', class: {
+        return (h("div", { key: '5a5982459b75bea224c88517b3e54e987cc899ca', class: {
                 "flatpickr-toggle-container": true,
                 [this.flatpickrPosition]: true,
                 [this.mode]: true,

package/dist/components/z-file-upload.js

@@ -5,7 +5,7 @@ import { d as defineCustomElement$6 } from './index4.js';
 import { d as defineCustomElement$5 } from './index6.js';
 import { d as defineCustomElement$4 } from './index7.js';
 import { d as defineCustomElement$3 } from './index9.js';
-import { d as defineCustomElement$2 } from './index15.js';
+import { d as defineCustomElement$2 } from './index16.js';
 
 const stylesCss = ":host{color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.container{display:flex;flex-direction:column}:host .modal-wrapper{display:flex;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2)}:host .modal-wrapper>.files-wrapper{display:flex;flex-direction:column;margin:calc(var(--space-unit) * 4);gap:var(--space-unit)}:host .text-container{display:flex;flex-direction:column;margin:auto}:host .text-container .body-1{text-align:center}:host .text-container .upload-link{color:var(--color-link-primary);cursor:pointer}:host .text-container .upload-link:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none !important}:host .text-container .upload-link-text{margin-bottom:var(--space-unit)}input#file-elem{display:none}#title{display:inline-block;margin:calc(var(--space-unit) * 2.5) 0 calc(var(--space-unit) * 4);font-size:calc(var(--space-unit) * 3);font-weight:var(--font-sb)}:host>.container>z-button{display:inline-block;margin-top:calc(var(--space-unit) * 3)}:host>.container>.files-container.hidden{display:none}:host>.container>.files-container>.heading-4-sb{display:inline-block;margin:calc(var(--space-unit) * 3) 0;font-size:calc(var(--space-unit) * 2);font-weight:var(--font-sb)}:host([type=\"dragdrop\"])>.container>.files-container>.heading-4-sb{margin-top:0;margin-bottom:calc(var(--space-unit) * 3)}:host>.container>.files-container>.files-wrapper{display:flex;flex-wrap:wrap;column-gap:calc(var(--space-unit) * 2);row-gap:calc(var(--space-unit) * 2)}:host>.container>.files-container>z-divider{margin-top:calc(var(--space-unit) * 3);margin-bottom:0}:host([type=\"dragdrop\"])>.container>.files-container>z-divider{margin:calc(var(--space-unit) * 3) 0}:host .error-message{font-size:14px;font-weight:400;letter-spacing:0.16%;line-height:20px;text-align:left}:host .error-message>.file-name{font-weight:600}@media only screen and (min-width: 768px){:host>.container>z-button{align-self:flex-start}:host .modal-wrapper{padding:calc(var(--space-unit) * 3)}}@media only screen and (min-width: 1152px){:host .modal-wrapper{padding:calc(var(--space-unit) * 4)}}";
 const ZFileUploadStyle0 = stylesCss;
@@ -206,7 +206,7 @@ const ZFileUpload$1 = /*@__PURE__*/ proxyCustomElement(class ZFileUpload extends
         }))))));
     }
     render() {
-        return (h(Host, { key: '7520b5da6e58534cb4c732d0745424b9b6de6991' }, h("div", { key: 'fbdd488d4cfe2cc3a01f0d2e4abfea6df3b6c8c8', class: `container ${this.getType()}` }, this.mainTitle && this.renderTitle(), this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()), !!this.invalidFiles.size && (h("z-modal", { key: '26e02bd9c532f2c4b38ab94854875d8b8aba9058', modalid: `file-upload-${this.type}-error-modal`, tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: this.errorModalTitle, onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent()))));
+        return (h(Host, { key: 'c099b84c3e81f4381f87fa6d2f7085b616ba933b' }, h("div", { key: '56eef095273ccb4724539e007c2fce9a0f0dd160', class: `container ${this.getType()}` }, this.mainTitle && this.renderTitle(), this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()), !!this.invalidFiles.size && (h("z-modal", { key: 'e5f9e076f5369b0dcff3aaaa6b5706d5209eefc1', modalid: `file-upload-${this.type}-error-modal`, tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: this.errorModalTitle, onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent()))));
     }
     get el() { return this; }
     static get style() { return ZFileUploadStyle0; }

package/dist/components/z-file.js

@@ -3,7 +3,7 @@ import { P as PopoverPosition, w as ZChipType } from './index2.js';
 import { B as Breakpoints } from './breakpoints.js';
 import { d as defineCustomElement$4 } from './index5.js';
 import { d as defineCustomElement$3 } from './index9.js';
-import { d as defineCustomElement$2 } from './index22.js';
+import { d as defineCustomElement$2 } from './index23.js';
 
 const stylesCss = ".sc-z-file-h{position:relative;font-family:var(--font-family-sans);font-weight:var(--font-rg)}.sc-z-file-h>z-popover.sc-z-file{z-index:10}.sc-z-file-h>z-popover.sc-z-file>.tooltip-content.sc-z-file{white-space:nowrap}.sc-z-file-h>z-chip.sc-z-file span.sc-z-file{display:block;overflow:hidden;max-width:250px;letter-spacing:0.32px;line-height:1.33;text-overflow:ellipsis;white-space:nowrap}";
 const ZFileStyle0 = stylesCss;
@@ -42,7 +42,7 @@ const ZFile$1 = /*@__PURE__*/ proxyCustomElement(class ZFile extends HTMLElement
         return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
     }
     render() {
-        return (h(Host, { key: '0d6f3522b4d6be820d8b96a3cd96fc4abb38d41c' }, this.allowPopover && (h("z-popover", { key: 'da950fcf5b1be6fc291895aeb0e2223275cab8fa', open: this.popoverVisible, position: PopoverPosition.AUTO, bindTo: this.chip }, h("span", { key: '54363fac4eb3b6a723c7841bb29415b0bd763e9a', class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { key: '2842d206ffa531c93838e885ba545176554dd7e3', ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { key: 'e6d0322525bf9ae3d2d09d4110a5414c25ab211b', ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
+        return (h(Host, { key: '58141a38cf9d43571dde4197bb54e247a3925968' }, this.allowPopover && (h("z-popover", { key: '58982b31d11c6d72df3259246c3947e7b6aeb65f', open: this.popoverVisible, position: PopoverPosition.AUTO, bindTo: this.chip }, h("span", { key: '300fd63d8d20f290772a60ac35a700743f1df4e0', class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { key: 'cd9a2b638b278c57799afb5048e45d18e3976ed6', ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { key: 'bd97f91a19c5c309bebeb5c0ebbc52a06dd53f41', ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
     }
     get el() { return this; }
     static get style() { return ZFileStyle0; }

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

@@ -17,7 +17,7 @@ const ZInfoBox$1 = /*@__PURE__*/ proxyCustomElement(class ZInfoBox extends HTMLE
         this.infoBoxClose.emit({ boxid: this.boxid });
     }
     render() {
-        return (h("div", { key: '4e08c5c0d3c070db1944b3ab5745d192fd4e8013', id: this.boxid }, h("slot", { key: 'f94d50c3fd311445d4abb7e3f12c387c3be4724d', name: "content" }), this.isclosable && (h("z-icon", { key: '165b638f14604a45a798210ea2de1c9f59bb3612', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
+        return (h("div", { key: '4d08d8aaaf8a140bfcf64259275d6aa33f6ab633', id: this.boxid }, h("slot", { key: '543a5a5a49ac3cb952627b2efe27ba3f18a394cb', name: "content" }), this.isclosable && (h("z-icon", { key: '79265e7a1a97a5d398e225db66a5bb28b0ee8edd', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
     }
     static get style() { return ZInfoBoxStyle0; }
 }, [1, "z-info-box", {

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

@@ -1,91 +1,4 @@
-import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
-import { H as InfoRevealPosition, e as ControlSize } from './index2.js';
-import { d as defineCustomElement$2 } from './index9.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:18px}:host([size=\"x-small\"])>.z-info-reveal-trigger z-icon{--trigger-icon-size:16px}.z-info-reveal-panel{position:absolute;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{position:fixed;top:auto !important;bottom:auto !important;left:var(--grid-margin) !important;width:calc(100% - (var(--grid-margin) * 2)) !important;max-width:none !important;margin-top:calc(var(--trigger-size) * -1)}}";
-const ZInfoRevealStyle0 = stylesCss;
-
-const ZInfoReveal$1 = /*@__PURE__*/ proxyCustomElement(class ZInfoReveal extends HTMLElement {
-    constructor() {
-        super();
-        this.__registerHost();
-        this.__attachShadow();
-        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: '0cd6457cdde5047f859f7e11feee92fb9dd0eb31', open: this.open }, h("button", { key: '63fd527be4c6d7de36aa8546dc47874ad571de01', 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: '0297eed1694a18d08b9290568a503afb441127ea', name: this.icon }), this.label && h("span", { key: '0fa5ff78efe186486b6991fec0edbcd560a2f302', class: "z-info-reveal-label" }, this.label)), h("div", { key: '6d1125e73e361aee556994e3e311196dfa288dee', class: "z-info-reveal-panel", id: "z-info-reveal-panel", ref: (el) => (this.panel = el), hidden: !this.open }, h("slot", { key: 'fe7b4a62cb6306418f935254139cfc4b0048a821' }), h("button", { key: '789d137466ede751579c4c64eddd04269eda3c12', class: "z-info-reveal-close", type: "button", onClick: this.closePanel.bind(this), "aria-label": "Chiudi pannello informazioni" }, h("z-icon", { key: '267e312def7799ab52a9fac1923d33538c8e9218', name: "multiply" })))));
-    }
-    get host() { return this; }
-    static get watchers() { return {
-        "position": ["adjustPanelPosition"],
-        "open": ["adjustPanelPosition"]
-    }; }
-    static get style() { return ZInfoRevealStyle0; }
-}, [1, "z-info-reveal", {
-        "icon": [1],
-        "position": [513],
-        "label": [1],
-        "ariaLabel": [1, "aria-label"],
-        "size": [513],
-        "open": [32]
-    }, [[9, "resize", "adjustPanelPosition"], [10, "keydown", "handleEscapeKey"]], {
-        "position": ["adjustPanelPosition"],
-        "open": ["adjustPanelPosition"]
-    }]);
-function defineCustomElement$1() {
-    if (typeof customElements === "undefined") {
-        return;
-    }
-    const components = ["z-info-reveal", "z-icon"];
-    components.forEach(tagName => { switch (tagName) {
-        case "z-info-reveal":
-            if (!customElements.get(tagName)) {
-                customElements.define(tagName, ZInfoReveal$1);
-            }
-            break;
-        case "z-icon":
-            if (!customElements.get(tagName)) {
-                defineCustomElement$2();
-            }
-            break;
-    } });
-}
+import { Z as ZInfoReveal$1, d as defineCustomElement$1 } from './index10.js';
 
 const ZInfoReveal = ZInfoReveal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-info-reveal.js.map

@@ -1 +1 @@
-{"file":"z-info-reveal.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,4gFAA4gF,CAAC;AAC/hF,0BAAe,SAAS;;MCaXA,aAAW;;;;;oBAGd,mBAAmB;wBAQK,kBAAkB,CAAC,YAAY;;yBAQnD,4BAA4B;oBAInB,WAAW,CAAC,GAAG;oBAI7B,KAAK;;;;;IAYZ,mBAAmB;QACjB,IAAI,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,EAAE;YAC7B,OAAO;SACR;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,qBAAqB,EAAE,CAAC;QAC/C,MAAM,UAAU,GAAG,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,CAAC,eAAe,CAAC,CAAC,gBAAgB,CAAC,eAAe,CAAC,EAAE,EAAE,CAAC,CAAC;QAC9G,MAAM,SAAS,GAAG,QAAQ,CAAC,eAAe,CAAC,WAAW,CAAC;;QAEvD,MAAM,cAAc,GAAG,IAAI,CAAC,KAAK,CAC/B,CAAC,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,MAAM,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,KAAK,IAAI,UAAU,CACnF,CAAC;QACF,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,QAAQ,GAAG,GAAG,cAAc,IAAI,CAAC;KACnD;;;;IAKO,WAAW;QACjB,IAAI,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,IAAI,CAAC;KACxB;;;;IAKO,UAAU;QAChB,IAAI,CAAC,IAAI,GAAG,KAAK,CAAC;KACnB;IAGD,eAAe,CAAC,KAAoB;QAClC,IAAI,KAAK,CAAC,GAAG,KAAK,QAAQ,IAAI,IAAI,CAAC,IAAI,EAAE;YACvC,IAAI,CAAC,UAAU,EAAE,CAAC;SACnB;KACF;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAE,IAAI,CAAC,IAAI,IACnB,+DACE,KAAK,EAAC,uBAAuB,EAC7B,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,IAAI,CAAC,gBACxB,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,SAAS,GAAG,SAAS,mBACrC,IAAI,CAAC,IAAI,GAAG,MAAM,GAAG,OAAO,mBAC7B,qBAAqB,IAElC,IAAI,CAAC,IAAI,IAAI,+DAAQ,IAAI,EAAE,IAAI,CAAC,IAAI,GAAI,EACxC,IAAI,CAAC,KAAK,IAAI,6DAAM,KAAK,EAAC,qBAAqB,IAAE,IAAI,CAAC,KAAK,CAAQ,CAC7D,EACT,4DACE,KAAK,EAAC,qBAAqB,EAC3B,EAAE,EAAC,qBAAqB,EACxB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,EAC9B,MAAM,EAAE,CAAC,IAAI,CAAC,IAAI,IAElB,8DAAa,EACb,+DACE,KAAK,EAAC,qBAAqB,EAC3B,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,gBACxB,8BAA8B,IAEzC,+DAAQ,IAAI,EAAC,UAAU,GAAG,CACnB,CACL,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZInfoReveal"],"sources":["src/components/z-info-reveal/styles.css?tag=z-info-reveal&encapsulation=shadow","src/components/z-info-reveal/index.tsx"],"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: 18px;\n}\n\n:host([size=\"x-small\"]) > .z-info-reveal-trigger z-icon {\n  --trigger-icon-size: 16px;\n}\n\n.z-info-reveal-panel {\n  position: absolute;\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    position: fixed;\n    top: auto !important;\n    bottom: auto !important;\n    left: var(--grid-margin) !important;\n    width: calc(100% - (var(--grid-margin) * 2)) !important;\n    max-width: none !important;\n    margin-top: calc(var(--trigger-size) * -1);\n  }\n}\n","import {Component, Element, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ControlSize, InfoRevealPosition} from \"../../beans\";\n\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 */\n@Component({\n  tag: \"z-info-reveal\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZInfoReveal {\n  /** Name of the icon for the trigger button */\n  @Prop()\n  icon? = \"informationsource\";\n\n  /**\n   * The position of the z-info-reveal in the page. This helps to correctly place the info panel.\n   * The panel will grow in the opposite direction of the position.\n   * For example, with the default position `BOTTOM_RIGHT`, the panel will grow vertically upwards and horizontally to the left.\n   */\n  @Prop({reflect: true})\n  position?: InfoRevealPosition = InfoRevealPosition.BOTTOM_RIGHT;\n\n  /** Label of the trigger button. */\n  @Prop()\n  label?: string;\n\n  /** Aria label of the trigger button. It will be only used when `label` prop is empty. */\n  @Prop()\n  ariaLabel = \"Apri pannello informazioni\";\n\n  /** Size of the trigger button */\n  @Prop({reflect: true})\n  size?: ControlSize = ControlSize.BIG;\n\n  /** Whether the info panel is open. */\n  @State()\n  open = false;\n\n  @Element() host: HTMLZInfoRevealElement;\n\n  private panel: HTMLDivElement;\n\n  /**\n   * Adjust the position of the info panel to prevent exiting the viewport.\n   */\n  @Watch(\"position\")\n  @Watch(\"open\")\n  @Listen(\"resize\", {target: \"window\", passive: true})\n  adjustPanelPosition(): void {\n    if (!this.open || !this.panel) {\n      return;\n    }\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(\n      (this.position.includes(\"left\") ? pageWidth - rect.left : rect.right) - gridMargin\n    );\n    this.panel.style.maxWidth = `${availableSpace}px`;\n  }\n\n  /**\n   * Toggle the open state of the info panel.\n   */\n  private togglePanel(): void {\n    this.open = !this.open;\n  }\n\n  /**\n   * Close the info panel.\n   */\n  private closePanel(): void {\n    this.open = false;\n  }\n\n  @Listen(\"keydown\", {target: \"window\", capture: true})\n  handleEscapeKey(event: KeyboardEvent): void {\n    if (event.key === \"Escape\" && this.open) {\n      this.closePanel();\n    }\n  }\n\n  render(): HTMLZInfoRevealElement {\n    return (\n      <Host open={this.open}>\n        <button\n          class=\"z-info-reveal-trigger\"\n          type=\"button\"\n          onClick={this.togglePanel.bind(this)}\n          aria-label={!this.label ? this.ariaLabel : undefined}\n          aria-expanded={this.open ? \"true\" : \"false\"}\n          aria-controls=\"z-info-reveal-panel\"\n        >\n          {this.icon && <z-icon name={this.icon} />}\n          {this.label && <span class=\"z-info-reveal-label\">{this.label}</span>}\n        </button>\n        <div\n          class=\"z-info-reveal-panel\"\n          id=\"z-info-reveal-panel\"\n          ref={(el) => (this.panel = el)}\n          hidden={!this.open}\n        >\n          <slot></slot>\n          <button\n            class=\"z-info-reveal-close\"\n            type=\"button\"\n            onClick={this.closePanel.bind(this)}\n            aria-label=\"Chiudi pannello informazioni\"\n          >\n            <z-icon name=\"multiply\" />\n          </button>\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-info-reveal.js","mappings":";;;;;;;","names":[],"sources":[],"sourcesContent":[],"version":3}

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

@@ -1,4 +1,4 @@
-import { Z as ZInputMessage$1, d as defineCustomElement$1 } from './index11.js';
+import { Z as ZInputMessage$1, d as defineCustomElement$1 } from './index12.js';
 
 const ZInputMessage = ZInputMessage$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-input.js

@@ -1,4 +1,4 @@
-import { Z as ZInput$1, d as defineCustomElement$1 } from './index10.js';
+import { Z as ZInput$1, d as defineCustomElement$1 } from './index11.js';
 
 const ZInput = ZInput$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-list-element.js

@@ -1,4 +1,4 @@
-import { Z as ZListElement$1, d as defineCustomElement$1 } from './index13.js';
+import { Z as ZListElement$1, d as defineCustomElement$1 } from './index14.js';
 
 const ZListElement = ZListElement$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-list-group.js

@@ -1,4 +1,4 @@
-import { Z as ZListGroup$1, d as defineCustomElement$1 } from './index14.js';
+import { Z as ZListGroup$1, d as defineCustomElement$1 } from './index15.js';
 
 const ZListGroup = ZListGroup$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-list.js

@@ -1,4 +1,4 @@
-import { Z as ZList$1, d as defineCustomElement$1 } from './index12.js';
+import { Z as ZList$1, d as defineCustomElement$1 } from './index13.js';
 
 const ZList = ZList$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-logo.js

@@ -23,7 +23,7 @@ const ZLogo$1 = /*@__PURE__*/ proxyCustomElement(class ZLogo extends HTMLElement
         if (this.height) {
             style["height"] = style["max-height"] = `${this.height}px`;
         }
-        return (h(Host, { key: 'b7aef0e1a12aefa4609fc698ac287245d93144f0', 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: '983b67652dbce086db80dd62d2eff3cb7e8c5cc3', 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 style() { return ZLogoStyle0; }
 }, [1, "z-logo", {

package/dist/components/z-menu-deprecated.js

@@ -100,7 +100,7 @@ const ZMenuDeprecated$1 = /*@__PURE__*/ proxyCustomElement(class ZMenuDeprecated
         return (h("div", { class: "menu-label" }, h("div", { class: "menu-label-content" }, h("slot", { onSlotchange: this.onLabelSlotChange }))));
     }
     render() {
-        return (h(Host, { key: '3db9cc8073a46a7160e9cdd10ca8e56017fa17e3' }, this.renderMenuLabel(), this.hasContent && (h("div", { key: '1ba60c68bbb101a557bab3609640b6f0729b0791', class: "content", ref: (el) => (this.content = el) }, this.hasHeader && (h("header", { key: '08a6e9093b5f38d61ad5dc7c52749df71de26218', class: "header" }, h("slot", { key: '3c0cc8a49f9d83ca592f144d2e63e3bbb82f44a8', name: "header", onSlotchange: this.checkContent }))), h("div", { key: '2f8d351c4fd22ff30d6f6d1899e5c3f5875b2cc5', class: "items", role: "menu" }, h("slot", { key: '4f411874aea00060bc7a1333bfed808c92d96bdd', name: "item", onSlotchange: this.onItemsChange }))))));
+        return (h(Host, { key: '5184325a76d1b8de3aa1a9d5b1b6f390345f9a57' }, this.renderMenuLabel(), this.hasContent && (h("div", { key: 'ba98a3dd24a7dd06c6a4cf517afaff98a9fd3f04', class: "content", ref: (el) => (this.content = el) }, this.hasHeader && (h("header", { key: '80c04af37987395ed3dcd0dda843b16731836b4d', class: "header" }, h("slot", { key: '1e77c59ff6382111a599bec3ce4c8a4a176b914c', name: "header", onSlotchange: this.checkContent }))), h("div", { key: '6b9a68b12183b713b7b25ab39352b9f2000ac467', class: "items", role: "menu" }, h("slot", { key: '7638540cf9ccb7d5d2b169cbd514a4b7e1428e5b', name: "item", onSlotchange: this.onItemsChange }))))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/z-menu-section-deprecated.js

@@ -48,7 +48,7 @@ const ZMenuSectionDeprecated$1 = /*@__PURE__*/ proxyCustomElement(class ZMenuSec
         this.checkContent();
     }
     render() {
-        return (h(Host, { key: '9f5e6272fec856fc30b8f00632105cf2d41f53cc', role: "menu", open: this.open }, h("button", { key: '31fbf5069fe344a43e5835f14459300dcf3359ac', class: "label", "aria-pressed": this.open ? "true" : "false", onClick: this.toggle.bind(this) }, h("slot", { key: '789bf049b23b099e4fb07f12a3fa5a80a221f833', onSlotchange: this.onLabelSlotChange.bind(this) }), this.hasContent && h("z-icon", { key: 'ffc7213860bca2db3fc12d575aaf26a0c598caaa', name: this.open ? "chevron-up" : "chevron-down" })), this.open && (h("div", { key: '14cc6b2bb5f80030df79598464af61c4e375293b', class: "items" }, h("slot", { key: '830b84cf4ce1028c7cfed3ec5051f206f742e66f', name: "item", onSlotchange: this.checkContent.bind(this) })))));
+        return (h(Host, { key: 'c7d2a29ae2e56daa03be387dbf1f5f9e48185962', role: "menu", open: this.open }, h("button", { key: 'ec6cb222a29976ce929101a30f3cdefd12bf78bb', class: "label", "aria-pressed": this.open ? "true" : "false", onClick: this.toggle.bind(this) }, h("slot", { key: '91fc9b115c4b6a161efe7f043e59cb326e3b01e3', onSlotchange: this.onLabelSlotChange.bind(this) }), this.hasContent && h("z-icon", { key: '0b186924f29ddb7da4848cfb6de49a6289050d14', name: this.open ? "chevron-up" : "chevron-down" })), this.open && (h("div", { key: '6b366b818ffaeb799d5892d5e640ca42f0ffd3fe', class: "items" }, h("slot", { key: '57fe732de25b22342d8be5bb83084429e398838a', name: "item", onSlotchange: this.checkContent.bind(this) })))));
     }
     get hostElement() { return this; }
     static get style() { return ZMenuSectionDeprecatedStyle0; }

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

@@ -176,7 +176,7 @@ const ZMenuSection$1 = /*@__PURE__*/ proxyCustomElement(class ZMenuSection exten
         this.onItemsChange();
     }
     render() {
-        return (h(Host, { key: '8055d8257a832f25940c0a754bd58497fa4bd0a0', open: this.open }, h("button", { key: '311bb43cd08cb379973701c416744ee27e3747f8', 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: 'd6a00928ca6a80ccdec98164979ccb2681c130c5', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: '976be6f35df99772aa82d82a60c86f3c09ca585a', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: 'd963f28d3d70563f01b9995194c941de9197cc1f', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: 'b42437ebb6c0c0373e4773f1930e527ed3a4697e', name: "section", onSlotchange: this.onItemsChange }))));
+        return (h(Host, { key: '3414a4946d0a2d96ce03c8e95d76a1d6162caf9f', open: this.open }, h("button", { key: 'e24e50fb417480d60b61cc6b90364cf99e9430f3', 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: 'fb0d0e06e5069ca713b47cfbb014268d52ccfeb2', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: '3556ad182adf9b4c9111e3568091850ced8ae498', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: 'c5c5aaca5aa108ef52c5af22deeeca77d773eb93', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: '4ff2f603482147dc49c8dcb0a72d27d5292e156d', name: "section", onSlotchange: this.onItemsChange }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-modal.js

@@ -1,4 +1,4 @@
-import { Z as ZModal$1, d as defineCustomElement$1 } from './index15.js';
+import { Z as ZModal$1, d as defineCustomElement$1 } from './index16.js';
 
 const ZModal = ZModal$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-card-alert.js

@@ -56,7 +56,7 @@ const ZMyzCardAlert$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardAlert ext
         }
     }
     render() {
-        return (h("div", { key: '4887349f74dcbeb07e6c8785481f717a4892238c', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: '64b1aab8757cbeb05ca5e52ca000058d5341770a', type: this.getAlertType() }, h("div", { key: 'a8004837dc3f11c1b156736171dd2b738ea4cede', class: "relative-container" }, h("z-icon", { key: '5784ab77dd50bbc1c38d65fd7f6109846a83a06c', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: '089042e66c5388d887d7d428ffbd49124a31c6dd', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '1ffc68e30d2038b49ce31f35b8b08778f16841da', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
+        return (h("div", { key: 'f6e33e9e7ecaf031e93a9b966c1b0717655de8b3', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: '88910bdba7f5ae811313d75f0177667e70a15ddc', type: this.getAlertType() }, h("div", { key: '54cb752cc3b33d03e184fe37905f5d229ea920aa', class: "relative-container" }, h("z-icon", { key: '98edd90273c7ecaf42077cf78d01d9d208d9b7b5', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: 'bb25089334e1658ffb1abcfa08c9890ef65cb3c9', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '792dd0b125267ce55f2d7512ecbca82b1ab121cb', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
                 this.handleActionButtonClick(e);
             }, onKeyPress: (e) => {
                 this.handleSpaceKeyPress(e);

package/dist/components/z-myz-card-body.js

@@ -1,4 +1,4 @@
-import { Z as ZMyzCardBody$1, d as defineCustomElement$1 } from './index17.js';
+import { Z as ZMyzCardBody$1, d as defineCustomElement$1 } from './index18.js';
 
 const ZMyzCardBody = ZMyzCardBody$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-card-cover.js

@@ -1,4 +1,4 @@
-import { Z as ZMyzCardCover$1, d as defineCustomElement$1 } from './index18.js';
+import { Z as ZMyzCardCover$1, d as defineCustomElement$1 } from './index19.js';
 
 const ZMyzCardCover = ZMyzCardCover$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-card-dictionary.js

@@ -2,10 +2,10 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { B as ButtonVariant, d as ButtonSize } from './index2.js';
 import { d as defineCustomElement$7 } from './index4.js';
 import { d as defineCustomElement$6 } from './index9.js';
-import { d as defineCustomElement$5 } from './index16.js';
-import { d as defineCustomElement$4 } from './index17.js';
-import { d as defineCustomElement$3 } from './index18.js';
-import { d as defineCustomElement$2 } from './index19.js';
+import { d as defineCustomElement$5 } from './index17.js';
+import { d as defineCustomElement$4 } from './index18.js';
+import { d as defineCustomElement$3 } from './index19.js';
+import { d as defineCustomElement$2 } from './index20.js';
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host z-myz-card{--card-overflow:visible}:host>div{position:relative;width:100%;height:522px;transition:-webkit-transform 0.5s ease-out;transition:transform 0.5s ease-out;transition:transform 0.5s ease-out,\n    -webkit-transform 0.5s ease-out}:host>div .content{position:relative;z-index:2;width:100%;height:522px;transform-style:preserve-3d;transition:-webkit-transform 0.5s ease-out;transition:transform 0.5s ease-out;transition:transform 0.5s ease-out,\n    -webkit-transform 0.5s ease-out}:host>div .content.flipped{margin-top:-2px;transform:rotateY(180deg)}:host>div .front,:host>div .back{position:absolute;top:0;left:0;width:100%;height:100%;backface-visibility:hidden}:host>div .front{z-index:2;top:0;left:0;transform:rotateY(0deg)}:host>div .front z-button{position:absolute;z-index:3;top:calc(var(--space-unit) * 0.5);left:calc(-1 * var(--space-unit))}:host>div .back{z-index:1;top:0;left:0;display:flex;justify-content:center;padding:0 var(--space-unit);margin-left:calc(-1 * var(--space-unit));transform:rotateY(180deg)}.hide-info{display:none}";
 const ZMyzCardDictionaryStyle0 = stylesCss;
@@ -31,7 +31,7 @@ const ZMyzCardDictionary$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardDict
         this.cardFlipped.emit(showBack);
     }
     render() {
-        return (h("div", { key: 'f7c5b89a84036db946702fc8990564d3fcbf7cfb' }, h("z-myz-card", { key: 'd7972b3c72daff0a4167ef83e20a47593092ac10' }, h("z-myz-card-header", { key: '355e3a181cfccbcfda8eaeb57fbb1a345121f21a', titolo: this.name }), h("div", { key: '250d86cfd9f076fc6a361d7be559d9d63dd7d908', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: 'ff6975119b9bf212ee499d2bef026c4d9b87a5ce', class: "front" }, h("z-myz-card-body", { key: '40a8fea2e369b69f8e71d26d3e6a36e96981c0c4' }, h("z-myz-card-cover", { key: '2d99c3bc655c8b40177401f6ff4a8502a23c30dc', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: 'd49203bc96cd283cabe29e0e5c37c8a0928dea4e', class: { "hide-info": this.hideinfobtn }, variant: ButtonVariant.SECONDARY, icon: "informationsource", size: ButtonSize.X_SMALL, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { key: '0c547edaf0d97c2d983350446fe5a5fab8c764d5', class: "back" }, h("slot", { key: 'af3acf86431069cff1e7aff7b7011e903b5d10a2', name: "info" }))), h("slot", { key: '660c2827003495015ca697cfae2b0b185436f9a9' }))));
+        return (h("div", { key: '80f085f8a488b84784ca90670bf19dfecf163698' }, h("z-myz-card", { key: 'eb3d8b334fd752b024820cb42cd04648c661a0d7' }, h("z-myz-card-header", { key: '18154077cbb1b76841b3d6786bf32931fbe9e292', titolo: this.name }), h("div", { key: 'c009afb3da0e95471d7332a1e886374ee32f92f8', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '50eedb29d0938ac147bc9cd6dc80c4e699b03386', class: "front" }, h("z-myz-card-body", { key: 'd733c773c270d0ce3476382ea0518f025bcf79d7' }, h("z-myz-card-cover", { key: '49366225c143651b20b6eb5ebc66a8da5c67c3fc', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: '854a0617d85d2c3cfa0cd8122a81b1d6e9b80070', class: { "hide-info": this.hideinfobtn }, variant: ButtonVariant.SECONDARY, icon: "informationsource", size: ButtonSize.X_SMALL, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { key: '6618b9fb1c96b19fb668814535642e6703aad073', class: "back" }, h("slot", { key: '6b9bcb4a1c24ebb831ed1bebb90a4162fa3b7570', name: "info" }))), h("slot", { key: 'c0edfdef188d1964b0b7fe247053f55b9cf69cc4' }))));
     }
     static get style() { return ZMyzCardDictionaryStyle0; }
 }, [1, "z-myz-card-dictionary", {

package/dist/components/z-myz-card-footer-sections.js

@@ -10,7 +10,7 @@ const ZMyzCardFooterSections$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCard
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '360208c758c0173bd270a796f5537c12ca3a6025' }, h("footer", { key: '2cc4273bc39b575eb1c2adbb8c32f261efbc6eaa' }, h("div", { key: 'd8f3dccf2e3db8245281ba76b8643f147b0fe6e0', class: "top" }, h("slot", { key: '8552908078ded7a827b7c6c3fa53c73ae3a2f64d', name: "top" })), h("div", { key: 'd416449033db5c2b5d1e5d5db24067a71e10d9bc', class: "bottom" }, h("slot", { key: 'a3404835e90df89465f0e6317d4f71f879a6cff0', name: "bottom" })))));
+        return (h("div", { key: 'd494ac2ca0df92a46e695a4448ed0d7b616173fb' }, h("footer", { key: 'dae276f8c2e7577929d5717fd6daa9f6f0fdc352' }, h("div", { key: '47daa2013db272dcebbb9d02d24c238349bb2497', class: "top" }, h("slot", { key: '545586800b9e2be2a9871bf302e884cd3e99ed50', name: "top" })), h("div", { key: 'fb4287b5c6f625ed0fd69a969d0ce867bbbf4b50', class: "bottom" }, h("slot", { key: '18e7b72d760e6968c31a5060607dcb379f78ce95', name: "bottom" })))));
     }
     static get style() { return ZMyzCardFooterSectionsStyle0; }
 }, [1, "z-myz-card-footer-sections"]);

package/dist/components/z-myz-card-footer.js

@@ -62,7 +62,7 @@ const ZMyzCardFooter$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardFooter e
         return this.host.querySelector("[slot=list] > li a");
     }
     render() {
-        return (h("div", { key: '95471e9b224ae123dbee86149a8ad1bb2d8cbaaf', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: 'b9df9be334a121be3c84f40ac31dc00359e42b85', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: '48f1b9befd8700ce2b1fd503e146e0f4890b642e', class: "toggle" }, h("slot", { key: '780b4ebc07c7571dc1e5a29bfd42fe913b16e1c4', name: "toggle" })), this.titolo && h("p", { key: '8b7491fc25b5242d5227de74e49b2bfa4ed1b94d', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '3d2ffb755ab4bc961f690dce39e69a64bbd1b386', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: 'e19edaab5eccfba65a5f7cf43a1955200a33e590' }, h("p", { key: '134507d968cf847976e1a3fa57c0a2ad5d8c448a', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '0def6b25daa09188958accdfa2e4f96cd52e6ab0', title: this.getTitleAuthors() }, h("span", { key: '32c27603fd64494fe660d7b4cb31687bb8efc974', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'd4f81349f5e4cb36711fca0ebb42aafe8843efca', class: "year-isbn" }, h("span", { key: 'd6a1ff032454ece5bb485bcf3462d24a3005396e', class: "isbn" }, h("span", { key: '860b6c3c876d1e02015f86b93fd9cad1eac7f0ba' }, h("span", { key: '3f3656a7b6bba750d1e7522bad1f2a875aff9b52', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '4af2ea2d2684984f328bea6cf50d13524036772c', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: '89d9b0d155e93a03c557ebdccc77d256145a4558', name: "list" })))), this.customContent && h("slot", { key: '9a1aa30dd1df23d4ab8c6d5138d731f17cdf2ff6', name: "content" })));
+        return (h("div", { key: '1d7bc1b22ed65ea0954aa2b27eea2b64cacbd0e6', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: 'af298974fb3d1f9c57cbae6237e2ce4a4b5f3e61', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: '3f4a15b1190170462ad46b168293b13d4d91a99a', class: "toggle" }, h("slot", { key: 'ee56857e4fd19b0dde454cc4a72af5e973286c50', name: "toggle" })), this.titolo && h("p", { key: 'db4dd912c90a9216a4a6eb483f254658c9731c3f', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '8f6fdb198489be254ce95b139ba58241cbd915f2', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '6cbb942cb7c70f1031eacff748957fba552c650a' }, h("p", { key: '97905884c25a0f864e707c917aef708ac8223500', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '0ef15f6d22fe84f78dfd0d9d4e0fd3c414916803', title: this.getTitleAuthors() }, h("span", { key: 'f1047f41e894feafdbc4d8456160af0a1504a04a', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'cd209c332790f1abd97e8449508ac7fb047e0478', class: "year-isbn" }, h("span", { key: '9824eb716d8450f34504fa69f5178c7c2f53b3af', class: "isbn" }, h("span", { key: 'a8ddc1a95bd199bd9a418f6386dabef7a2c6d56d' }, h("span", { key: '49a91338e5270a4d8fd91249a2cecc12eba9d5d1', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '71f1d46ded554e8e33e690db893b809317fe814e', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: '357f8187d3bad12bbf7dd85a976e72f99a022285', name: "list" })))), this.customContent && h("slot", { key: '3abd8d36d255329e2050ee27eab176ea4d460a1d', name: "content" })));
     }
     get host() { return this; }
     static get style() { return ZMyzCardFooterStyle0; }

package/dist/components/z-myz-card-header.js

@@ -1,4 +1,4 @@
-import { Z as ZMyzCardHeader$1, d as defineCustomElement$1 } from './index19.js';
+import { Z as ZMyzCardHeader$1, d as defineCustomElement$1 } from './index20.js';
 
 const ZMyzCardHeader = ZMyzCardHeader$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-card-icon.js

@@ -14,7 +14,7 @@ const ZMyzCardIcon$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardIcon exten
         this.ariaLabel = "";
     }
     render() {
-        return (h("button", { key: 'dce263721e9c0483d2715776decad8392c9d083f', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: 'cd20d6f9c83b394cd651bcf8b92626daa04e9c16' }, h("z-icon", { key: 'ecdad1d4dc3b39826f0a4cb51e3cb0b97fe5f3f0', name: this.icon, width: 16, height: 16 }))));
+        return (h("button", { key: '9f89d59fcb167a70373de6ca75789fced656dfd3', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: 'c2e0ca27de2b97e220e30bb215e5ad165954b1e6' }, h("z-icon", { key: 'a5f84f9073060fdb28bc40e7a9007e5d03953d5a', name: this.icon, width: 16, height: 16 }))));
     }
     static get style() { return ZMyzCardIconStyle0; }
 }, [1, "z-myz-card-icon", {

package/dist/components/z-myz-card-info.js

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/i
 import { P as PopoverPosition } from './index2.js';
 import { h as handleKeyboardSubmit } from './utils.js';
 import { d as defineCustomElement$3 } from './index9.js';
-import { d as defineCustomElement$2 } from './index22.js';
+import { d as defineCustomElement$2 } from './index23.js';
 
 const stylesCss = ":host{width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{position:relative;display:grid;width:calc(100% + calc(var(--space-unit) * 2));height:402px;box-sizing:border-box;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);border:var(--border-size-small) solid var(--color-primary01);margin-left:calc(-1 * var(--space-unit));background:var(--color-surface01);border-radius:0;box-shadow:0 2px 4px 0 rgb(66 69 72 / 35%)}:host>div>z-icon{position:absolute;top:var(--space-unit);right:var(--space-unit);cursor:pointer;fill:var(--color-primary01)}:host>div>div.cta-wrapper{display:flex;flex-flow:column nowrap;align-self:end;justify-content:space-between}:host>div>div.content-wrapper{position:relative;overflow:hidden;align-self:stretch}:host>div>div.content-wrapper>section{box-sizing:border-box;padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface04);color:var(--color-surface05);font-size:14px;line-height:20px}:host>div>div.content-wrapper>section:last-child{border-bottom:none}:host>div>div.content-wrapper>section.info-wrapper{position:relative;overflow:hidden;box-sizing:border-box}:host>div>div.content-wrapper>section.info-wrapper.hidden::after{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);content:\"\";pointer-events:none}:host>div>div.content-wrapper>section>span.license-heading{display:flex;justify-content:space-between}:host>div>div.content-wrapper>section>span.license-heading>span.expired{color:var(--color-secondary02);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-warning01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0;left:calc(var(--space-unit) * 4)}";
 const ZMyzCardInfoStyle0 = stylesCss;
@@ -121,7 +121,7 @@ const ZMyzCardInfo$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardInfo exten
         return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", h("b", null, this.cardData.offlineLicense.expiration), h("br", null), "Installazioni disponibili: ", h("b", null, this.cardData.offlineLicense.installations)));
     }
     render() {
-        return (h("div", { key: 'caf12cdfa9cea6d882b85dfb809e55036449bf19' }, this.renderCloseIcon(), h("div", { key: '7b01593abc3b658a08faad90c18f040284006ecd', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: 'def1beafdcd5c7a42fea42fa70976a7eeca1dbad', class: "cta-wrapper" }, h("slot", { key: '514e3cab754ccffe63c867b1fa2b41e0de27b3ea' }))));
+        return (h("div", { key: '0195d1dcba173412831d92f99dfdf5e15fc0f36b' }, this.renderCloseIcon(), h("div", { key: 'f93e2f48644020b42ff05b2be0695f0992aa0547', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '6698c06e4178f80c1afef71932a60765eae03af7', class: "cta-wrapper" }, h("slot", { key: '6c5b345b4ee8b3faa58d9ae534d3c9c2e84d21ce' }))));
     }
     static get style() { return ZMyzCardInfoStyle0; }
 }, [1, "z-myz-card-info", {

package/dist/components/z-myz-card-list.js

@@ -30,7 +30,7 @@ const ZMyzCardList$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardList exten
         });
     }
     render() {
-        return h("ul", { key: '4b0208d11f8bf0bce26d4f2613546485c603c4df' }, this.renderList(JSON.parse(this.listdata)));
+        return h("ul", { key: '8ae64199f1b72aaadb6c4d5fdb5ad49ad63dc904' }, this.renderList(JSON.parse(this.listdata)));
     }
     static get style() { return ZMyzCardListStyle0; }
 }, [1, "z-myz-card-list", {

package/dist/components/z-myz-card.js

@@ -1,4 +1,4 @@
-import { Z as ZMyzCardComponent, d as defineCustomElement$1 } from './index16.js';
+import { Z as ZMyzCardComponent, d as defineCustomElement$1 } from './index17.js';
 
 const ZMyzCard = ZMyzCardComponent;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-list-item.js

@@ -1,4 +1,4 @@
-import { Z as ZMyzListItem$1, d as defineCustomElement$1 } from './index20.js';
+import { Z as ZMyzListItem$1, d as defineCustomElement$1 } from './index21.js';
 
 const ZMyzListItem = ZMyzListItem$1;
 const defineCustomElement = defineCustomElement$1;

package/dist/components/z-myz-list.js

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { d as defineCustomElement$3 } from './index9.js';
-import { d as defineCustomElement$2 } from './index20.js';
+import { d as defineCustomElement$2 } from './index21.js';
 
 const stylesCss = "ul{padding:0;margin:0}";
 const ZMyzListStyle0 = stylesCss;
@@ -26,7 +26,7 @@ const ZMyzList$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzList extends HTMLE
     }
     render() {
         const lastElem = this.list ? this.list.length - 1 : -1;
-        return (h("ul", { key: '5cb2ef9c27694d786b4163e2ee6a006b3cbc8f72' }, this.list &&
+        return (h("ul", { key: '5298a19cf071fc05a1391e46aa2c0afd4c262bd4' }, this.list &&
             this.list.map((bean, i) => (h("z-myz-list-item", { listitemid: bean.listitemid, text: bean.text, link: bean.link, linktarget: bean.linktarget, icon: bean.icon, underlined: lastElem != i })))));
     }
     static get watchers() { return {

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

@@ -209,10 +209,10 @@ const ZNavigationTabs$1 = /*@__PURE__*/ proxyCustomElement(class ZNavigationTabs
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '0b12b029411faa03fde8c7cab690c655a9222d96', class: {
+        return (h(Host, { key: 'd192d751519659abe6a7276077871c62b0c09132', class: {
                 "interactive-2": this.size === NavigationTabsSize.SMALL,
                 "interactive-1": this.size !== NavigationTabsSize.SMALL,
-            }, scrollable: this.canNavigate }, h("button", { key: '5022271cf8f6d8a48de6186af7cb54d75bb92427', 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: '8262403c712f134208a3bdbec48e71d3d446758c', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'f6ac7d4ac917af513600e6eed2c545000d6508ec', 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: '3de431022c169350f1a2dd342d8e6170d2b64210' })), h("button", { key: '2a5b18aa8280e94d610ffc2a1b30e527d65df8a6', 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: '3733f645a9c05166413740c7f5854d121c5f7cdd', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
+            }, scrollable: this.canNavigate }, h("button", { key: '9306e51dafe13daf47d02f2bc2c1165bbca852bf', 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: '12c02634275c9465042b782f797876c892afb88f', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: '87fcc53d787cc5889ab3098f5815190baad83f60', 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: '8b4b0be5170b59d9d3acebbb510e64630a92f024' })), h("button", { key: '3c50cddedd525a8e392ae199da12edbdfcfa3f0f', 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: '0224c950d506b47926392395953a4e2a0bb76aa5', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-notification.js

@@ -30,7 +30,7 @@ const ZNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZNotification ext
     }
     render() {
         var _a;
-        return (h(Host, { key: '275c4d98f56fb388d1bb3373664f5ba52b22a613' }, this.contenticonname && (h("z-icon", { key: '6f947ada02ec82736df5c099285e8ad84bbd07ed', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '71fcf67cb01c84e0bef856dab960e4a04b472d7a', class: "content-container" }, h("div", { key: 'c590fccba3708952d3c71c8f274f7b5305f85583', class: "content-text" }, h("slot", { key: '104ae4ef5a77cb371f0b4d928a4804b71c33e23a' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: 'e43f9e7499e027131e76839cc21c9cc5ec332355', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: 'afc2acfa687d499bff6720423fa86afd335560ef', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'f03fafa58bdc583c34552e9f5d4114608ad82de1', name: "multiply-circle", width: 16, height: 16 })))));
+        return (h(Host, { key: 'e8416850a84b427fef7b6ba0d9c8b9166e4799ab' }, this.contenticonname && (h("z-icon", { key: '12598bed47c61eb4f526eb5e274b3d22986bc4b8', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '84c2a22d8b0061b9fea55945b2a3007ea1e9b63a', class: "content-container" }, h("div", { key: '947f63eb8cc4b3711ee97e5a8fdc34e22d2bed9f', class: "content-text" }, h("slot", { key: '0cc909e320c921f2d0d2b2ee884e62e970bc6d3a' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '3a185d65b4fc48e62c134543ae5725659ffa9a7c', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: 'b5fee566524a4e6c9be009a77a7679a7d1c68b78', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'c3658a322c699ee57b706cc58a7c5f53877a6620', name: "multiply-circle", width: 16, height: 16 })))));
     }
     static get style() { return ZNotificationStyle0; }
 }, [1, "z-notification", {

package/dist/components/z-offcanvas.js

@@ -1,4 +1,4 @@
-import { Z as ZOffcanvas$1, d as defineCustomElement$1 } from './index21.js';
+import { Z as ZOffcanvas$1, d as defineCustomElement$1 } from './index22.js';
 
 const ZOffcanvas = ZOffcanvas$1;
 const defineCustomElement = defineCustomElement$1;