@zanichelli/albe-web-components 6.1.0-a1 → 6.1.0

package/dist/cjs/z-input-deprecated.cjs.entry.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
-const utils = require('./utils-7c92be74.js');
+const index$1 = require('./index-199cd650.js');
+const utils = require('./utils-ce225fb3.js');
 require('./breakpoints-88c4fd6c.js');
 
 const stylesCss = ".sc-z-input-deprecated-h{display:inline-block;width:inherit}input.sc-z-input-deprecated::-ms-clear,input.sc-z-input-deprecated::-ms-reveal{display:none}.sc-z-input-deprecated-h input.sc-z-input-deprecated::-ms-clear,.sc-z-input-deprecated-h input.sc-z-input-deprecated::-ms-reveal{display:none}input.sc-z-input-deprecated,textarea.sc-z-input-deprecated,.textarea-wrapper.sc-z-input-deprecated,ul[role=\"listbox\"].sc-z-input-deprecated{box-sizing:border-box;border:var(--border-size-small) solid var(--color-surface04);background:var(--color-input-field01);border-radius:var(--border-radius-small);color:var(--color-text02);fill:var(--color-icon02);font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:var(--font-rg);outline:none}input.sc-z-input-deprecated:focus:focus-visible,li[role=\"option\"].sc-z-input-deprecated:focus:focus-visible,.focus.sc-z-input-deprecated{box-shadow:var(--shadow-focus-primary)}.filled.sc-z-input-deprecated{border-color:var(--color-surface05)}.input-success.sc-z-input-deprecated,.input-success.sc-z-input-deprecated:hover,.input-success.hover.sc-z-input-deprecated{border-color:var(--color-success01);background:var(--color-success-inverse);fill:var(--color-success01)}.input-error.sc-z-input-deprecated,.input-error.sc-z-input-deprecated:hover,.input-error.hover.sc-z-input-deprecated{border-color:var(--color-error01);background:var(--color-error-inverse);fill:var(--color-error01)}.input-warning.sc-z-input-deprecated,.input-warning.sc-z-input-deprecated:hover,.input-warning.hover.sc-z-input-deprecated{border-color:var(--color-warning01);background:var(--color-warning-inverse);fill:var(--color-warning01)}input[readonly].sc-z-input-deprecated,.readonly.sc-z-input-deprecated{border-color:var(--color-disabled01);fill:var(--color-disabled01);pointer-events:none}input.sc-z-input-deprecated:disabled,.disabled.sc-z-input-deprecated,.filled.sc-z-input-deprecated:disabled{border-color:var(--color-disabled01);box-shadow:none;color:var(--color-disabled02);fill:var(--color-disabled01);pointer-events:none}input.sc-z-input-deprecated::placeholder,textarea.sc-z-input-deprecated::placeholder{color:var(--color-text05)}.sc-z-input-deprecated::-webkit-textarea-placeholder{color:var(--color-text05)}.sc-z-input-deprecated:-ms-textarea-placeholder{color:var(--color-text05)}.sc-z-input-deprecated::placeholder{color:var(--color-text05)}.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated{position:relative;z-index:1;fill:var(--color-icon02)}.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.sc-z-input-deprecated{width:100%;height:calc(var(--space-unit) * 5.5);box-sizing:border-box;padding:0 calc(var(--space-unit) * 4.5) 0 calc(var(--space-unit) * 1.5);margin:0}.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.has-icon.sc-z-input-deprecated,.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.has-clear-icon.sc-z-input-deprecated{padding-right:calc(var(--space-unit) * 4)}.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.has-icon.has-clear-icon.sc-z-input-deprecated{padding-right:calc(var(--space-unit) * 7)}.text-wrapper.sc-z-input-deprecated .icons-wrapper.sc-z-input-deprecated{position:absolute;z-index:2;right:calc(var(--space-unit) * 1.5);bottom:calc(var(--space-unit) * 1.5);display:flex}.text-wrapper.sc-z-input-deprecated .icons-wrapper.sc-z-input-deprecated>z-icon.sc-z-input-deprecated{--z-icon-width:18px;--z-icon-height:18px;display:block;margin-left:calc(var(--space-unit) * 0.5)}.text-wrapper.sc-z-input-deprecated .icons-wrapper.sc-z-input-deprecated>z-icon.reset-icon.sc-z-input-deprecated,.text-wrapper.sc-z-input-deprecated .icons-wrapper.sc-z-input-deprecated>z-icon.toggle-password-icon.sc-z-input-deprecated{cursor:pointer}.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.sc-z-input-deprecated:-webkit-autofill,.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.sc-z-input-deprecated:-webkit-autofill:hover,.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.sc-z-input-deprecated:-webkit-autofill:focus,.text-wrapper.sc-z-input-deprecated>div.sc-z-input-deprecated>input.sc-z-input-deprecated:-webkit-autofill:active{background-clip:text !important}.textarea-wrapper.sc-z-input-deprecated{padding:calc(var(--space-unit) * 1.5);scrollbar-color:var(--color-primary01) transparent}textarea.sc-z-input-deprecated::-webkit-scrollbar{width:10px;background:linear-gradient(to right, transparent 0 3px, var(--gray200) 3px 7px, transparent 7px 10px);border-radius:var(--border-radius)}textarea.sc-z-input-deprecated::-webkit-scrollbar-track{background-color:transparent}textarea.sc-z-input-deprecated::-webkit-scrollbar-thumb{width:10px;background-color:var(--color-primary01);border-radius:var(--border-radius)}textarea.sc-z-input-deprecated::-webkit-scrollbar-thumb:hover{background-color:var(--color-hover-primary)}textarea.sc-z-input-deprecated{width:100%;min-height:132px;padding:0;border:none;margin:0;resize:none}.radio-wrapper.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated{position:relative;display:inline-flex;flex-direction:row;align-items:center;color:var(--color-text01);fill:var(--color-primary01);font-family:var(--font-family-sans)}.radio-wrapper.sc-z-input-deprecated:hover,.checkbox-wrapper.sc-z-input-deprecated:hover{color:var(--color-hover-primary);fill:currentcolor}.radio-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated{position:absolute;z-index:-1;opacity:0;pointer-events:none}.radio-wrapper.sc-z-input-deprecated .radio-label.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.sc-z-input-deprecated{display:inline-flex;align-items:center;margin:0;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;line-height:1;text-transform:inherit}.radio-wrapper.sc-z-input-deprecated input.sc-z-input-deprecated:not(:disabled)+.radio-label.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated input.sc-z-input-deprecated:not(:disabled)+.checkbox-label.sc-z-input-deprecated{cursor:pointer}.radio-wrapper.sc-z-input-deprecated .radio-label.sc-z-input-deprecated z-icon.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.sc-z-input-deprecated z-icon.sc-z-input-deprecated{cursor:pointer;fill:inherit}.radio-wrapper.sc-z-input-deprecated .radio-label.after.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.after.sc-z-input-deprecated{flex-direction:row}.radio-wrapper.sc-z-input-deprecated .radio-label.before.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.before.sc-z-input-deprecated{flex-direction:row-reverse}.radio-wrapper.sc-z-input-deprecated .radio-label.after.sc-z-input-deprecated>span.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.after.sc-z-input-deprecated>span.sc-z-input-deprecated{margin-left:var(--space-unit)}.radio-wrapper.sc-z-input-deprecated .radio-label.before.sc-z-input-deprecated>span.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated .checkbox-label.before.sc-z-input-deprecated>span.sc-z-input-deprecated{margin-right:var(--space-unit)}.radio-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:focus:focus-visible+.radio-label.sc-z-input-deprecated>z-icon.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:focus:focus-visible+.checkbox-label.sc-z-input-deprecated>z-icon.sc-z-input-deprecated{border-radius:var(--border-radius-small);box-shadow:var(--shadow-focus-primary)}.radio-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:disabled+.radio-label.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:disabled+.checkbox-label.sc-z-input-deprecated{color:var(--color-disabled02)}.radio-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:disabled+.radio-label.sc-z-input-deprecated>z-icon.sc-z-input-deprecated,.checkbox-wrapper.sc-z-input-deprecated>input.sc-z-input-deprecated:disabled+.checkbox-label.sc-z-input-deprecated>z-icon.sc-z-input-deprecated{cursor:default;fill:var(--color-disabled01)}";
@@ -16,28 +17,28 @@ const ZInputDeprecated = class {
     this.stopTyping = index.createEvent(this, "stopTyping", 7);
     this.inputCheck = index.createEvent(this, "inputCheck", 7);
     this.optionSelect = index.createEvent(this, "optionSelect", 7);
+    /** the id of the input element */
     this.htmlid = `id-${utils.randomId()}`;
-    this.type = undefined;
-    this.name = undefined;
-    this.label = undefined;
+    /** the input aria-label */
     this.ariaLabel = "";
-    this.value = undefined;
+    /** the input is disabled */
     this.disabled = false;
+    /** the input is readonly */
     this.readonly = false;
+    /** the input is required (optional): available for text, password, number, email, textarea, checkbox */
     this.required = false;
+    /** checked: available for checkbox, radio */
     this.checked = false;
-    this.placeholder = undefined;
-    this.htmltitle = undefined;
-    this.status = undefined;
+    /** show input helper message (optional): available for text, password, number, email, textarea, select */
     this.hasmessage = true;
-    this.message = undefined;
+    /** the input label position: available for checkbox, radio */
     this.labelafter = true;
+    /** timeout setting before trigger `inputChange` event (optional): available for text, textarea */
     this.typingtimeout = 300;
-    this.items = undefined;
-    this.autocomplete = undefined;
+    /** multiple options can be selected (optional): available for select */
     this.multiple = false;
+    /** render clear icon when typing (optional): available for text */
     this.hasclearicon = true;
-    this.icon = undefined;
     this.isTyping = false;
     this.textareaWrapperHover = "";
     this.textareaWrapperFocus = "";
@@ -46,8 +47,8 @@ const ZInputDeprecated = class {
   inputCheckListener(e) {
     const data = e.detail;
     switch (this.type) {
-      case "radio" /* InputType.RADIO */:
-        if (data.type === "radio" /* InputType.RADIO */ && data.name === this.name && data.id !== this.htmlid) {
+      case index$1.InputType.RADIO:
+        if (data.type === index$1.InputType.RADIO && data.name === this.name && data.id !== this.htmlid) {
           this.checked = false;
         }
         break;
@@ -80,8 +81,8 @@ const ZInputDeprecated = class {
   /** get checked status */
   async isChecked() {
     switch (this.type) {
-      case "checkbox" /* InputType.CHECKBOX */:
-      case "radio" /* InputType.RADIO */:
+      case index$1.InputType.CHECKBOX:
+      case index$1.InputType.RADIO:
         return this.checked;
       default:
         return false;
@@ -92,7 +93,7 @@ const ZInputDeprecated = class {
       this.emitStartTyping();
     }
     let validity;
-    if (this.type === "textarea" /* InputType.TEXTAREA */) {
+    if (this.type === index$1.InputType.TEXTAREA) {
       validity = this.getValidity("textarea");
     }
     else {
@@ -153,15 +154,15 @@ const ZInputDeprecated = class {
     }
     return attr;
   }
-  renderInputText(type = "text" /* InputType.TEXT */) {
+  renderInputText(type = index$1.InputType.TEXT) {
     const attr = this.getTextAttributes();
-    if (this.icon || type === "password" /* InputType.PASSWORD */) {
+    if (this.icon || type === index$1.InputType.PASSWORD) {
       Object.assign(attr.class, { "has-icon": true });
     }
     if (this.hasclearicon) {
       Object.assign(attr.class, { "has-clear-icon": true });
     }
-    return (index.h("div", { class: "text-wrapper" }, this.renderLabel(), index.h("div", null, index.h("input", Object.assign({ type: type === "password" /* InputType.PASSWORD */ && !this.passwordHidden ? "text" /* InputType.TEXT */ : type }, attr, { "aria-label": this.ariaLabel || this.label })), this.renderIcons()), this.renderMessage()));
+    return (index.h("div", { class: "text-wrapper" }, this.renderLabel(), index.h("div", null, index.h("input", Object.assign({ type: type === index$1.InputType.PASSWORD && !this.passwordHidden ? index$1.InputType.TEXT : type }, attr, { "aria-label": this.ariaLabel || this.label })), this.renderIcons()), this.renderMessage()));
   }
   renderLabel() {
     if (!this.label) {
@@ -176,7 +177,7 @@ const ZInputDeprecated = class {
       } }, this.renderResetIcon(), this.renderIcon()));
   }
   renderIcon() {
-    if (this.type === "password" /* InputType.PASSWORD */) {
+    if (this.type === index$1.InputType.PASSWORD) {
       return this.renderShowHidePassword();
     }
     if (!this.icon) {
@@ -235,16 +236,16 @@ const ZInputDeprecated = class {
   /* END select */
   render() {
     switch (this.type) {
-      case "text" /* InputType.TEXT */:
-      case "password" /* InputType.PASSWORD */:
-      case "number" /* InputType.NUMBER */:
-      case "email" /* InputType.EMAIL */:
+      case index$1.InputType.TEXT:
+      case index$1.InputType.PASSWORD:
+      case index$1.InputType.NUMBER:
+      case index$1.InputType.EMAIL:
         return this.renderInputText(this.type);
-      case "textarea" /* InputType.TEXTAREA */:
+      case index$1.InputType.TEXTAREA:
         return this.renderTextarea();
-      case "checkbox" /* InputType.CHECKBOX */:
+      case index$1.InputType.CHECKBOX:
         return this.renderCheckbox();
-      case "radio" /* InputType.RADIO */:
+      case index$1.InputType.RADIO:
         return this.renderRadio();
       // @ts-ignore
       case "select":

package/dist/cjs/z-input-label_2.cjs.entry.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
-const utils = require('./utils-7c92be74.js');
+const index$1 = require('./index-199cd650.js');
+const utils = require('./utils-ce225fb3.js');
 require('./breakpoints-88c4fd6c.js');
 
 const stylesCss$1 = "label{display:block;margin:var(--space-unit) 0;color:var(--color-text02);font-family:var(--font-family-sans);font-size:var(--font-size-1);font-weight:var(--font-sb);letter-spacing:0.32px;line-height:1.33;text-align:left;text-transform:uppercase}label.disabled{color:var(--color-disabled02)}";
@@ -11,9 +12,8 @@ const stylesCss$1 = "label{display:block;margin:var(--space-unit) 0;color:var(--
 const ZInputLabel = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.value = undefined;
+    /** the label is disabled */
     this.disabled = false;
-    this.htmlfor = undefined;
   }
   render() {
     return (index.h("label", { htmlFor: this.htmlfor, class: { disabled: this.disabled } }, this.value));
@@ -27,23 +27,23 @@ const ZSelect = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.optionSelect = index.createEvent(this, "optionSelect", 7);
-    this.itemsList = [];
+    /** the id of the input element */
     this.htmlid = `id-${utils.randomId()}`;
-    this.items = undefined;
-    this.name = undefined;
-    this.label = undefined;
+    /** the input aria-label */
     this.ariaLabel = "";
+    /** the input is disabled */
     this.disabled = false;
+    /** the input is readonly */
     this.readonly = false;
-    this.placeholder = undefined;
-    this.htmltitle = undefined;
-    this.status = undefined;
+    /** input helper message (optional) - if set to `false` message won't be displayed */
     this.message = true;
+    /** the input has autocomplete option */
     this.autocomplete = false;
+    /** no result text message */
     this.noresultslabel = "Nessun risultato";
     this.isOpen = false;
     this.selectedItem = null;
-    this.searchString = undefined;
+    this.itemsList = [];
     this.toggleSelectUl = this.toggleSelectUl.bind(this);
     this.selectItem = this.selectItem.bind(this);
     this.handleSelectFocus = this.handleSelectFocus.bind(this);
@@ -147,7 +147,7 @@ const ZSelect = class {
     }
   }
   arrowsSelectNav(e, key) {
-    const arrows = ["ArrowDown" /* KeyboardCode.ARROW_DOWN */, "ArrowUp" /* KeyboardCode.ARROW_UP */];
+    const arrows = [index$1.KeyboardCode.ARROW_DOWN, index$1.KeyboardCode.ARROW_UP];
     if (!arrows.includes(e.key)) {
       return;
     }
@@ -157,10 +157,10 @@ const ZSelect = class {
       this.toggleSelectUl();
     }
     let index;
-    if (e.key === "ArrowDown" /* KeyboardCode.ARROW_DOWN */) {
+    if (e.key === index$1.KeyboardCode.ARROW_DOWN) {
       index = key + 1 === this.itemsList.length ? 0 : key + 1;
     }
-    else if (e.key === "ArrowUp" /* KeyboardCode.ARROW_UP */) {
+    else if (e.key === index$1.KeyboardCode.ARROW_UP) {
       index = key <= 0 ? this.itemsList.length - 1 : key - 1;
     }
     this.focusSelectItem(index);
@@ -198,11 +198,11 @@ const ZSelect = class {
     this.toggleSelectUl();
   }
   handleSelectFocus(e) {
-    if (e instanceof KeyboardEvent && e.key === "Escape" /* KeyboardCode.ESC */) {
+    if (e instanceof KeyboardEvent && e.key === index$1.KeyboardCode.ESC) {
       e.stopPropagation();
       return this.toggleSelectUl(true);
     }
-    if (e instanceof KeyboardEvent && e.key !== "Tab" /* KeyboardCode.TAB */ && e.key !== "Enter" /* KeyboardCode.ENTER */) {
+    if (e instanceof KeyboardEvent && e.key !== index$1.KeyboardCode.TAB && e.key !== index$1.KeyboardCode.ENTER) {
       return;
     }
     const tree = utils.getElementTree(utils.getClickedElement());
@@ -252,7 +252,7 @@ const ZSelect = class {
       return this.renderNoSearchResults();
     }
     return this.itemsList.map((item, key) => {
-      return (index.h("z-list-element", { clickable: !item.disabled, disabled: item.disabled, dividerType: "element" /* ListDividerType.ELEMENT */, role: "option", tabindex: item.disabled || !this.isOpen ? -1 : 0, "aria-selected": !!item.selected, id: `${this.htmlid}_${key}`, onClickItem: () => this.selectItem(item, true), onKeyDown: (e) => this.arrowsSelectNav(e, key) }, index.h("span", { class: { selected: !!item.selected }, innerHTML: item.name })));
+      return (index.h("z-list-element", { clickable: !item.disabled, disabled: item.disabled, dividerType: index$1.ListDividerType.ELEMENT, role: "option", tabindex: item.disabled || !this.isOpen ? -1 : 0, "aria-selected": !!item.selected, id: `${this.htmlid}_${key}`, onClickItem: () => this.selectItem(item, true), onKeyDown: (e) => this.arrowsSelectNav(e, key) }, index.h("span", { class: { selected: !!item.selected }, innerHTML: item.name })));
     });
   }
   renderNoSearchResults() {

package/dist/cjs/z-list-group.cjs.entry.js

@@ -3,15 +3,28 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
+const index$1 = require('./index-199cd650.js');
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>.z-list-group-header-container{color:var(--gray700);font-size:var(--font-size-2);font-weight:var(--font-sb) !important;letter-spacing:0.16px;line-height:1.4}:host>.z-list-group-header-container.has-header{padding-top:var(--space-unit);padding-bottom:var(--space-unit)}:host>.z-list-group-header-container.has-header>z-divider{margin-top:var(--space-unit)}";
 
 const ZListGroup = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.size = "medium" /* ListSize.MEDIUM */;
-    this.dividerType = "none" /* ListDividerType.NONE */;
-    this.dividerSize = "small" /* DividerSize.SMALL */;
+    /**
+     * [optional] Sets size of inside elements.
+     */
+    this.size = index$1.ListSize.MEDIUM;
+    /**
+     * [optional] Sets the position where to insert the divider.
+     */
+    this.dividerType = index$1.ListDividerType.NONE;
+    /**
+     * [optional] Sets the divider size.
+     */
+    this.dividerSize = index$1.DividerSize.SMALL;
+    /**
+     * [optional] Sets the divider color.
+     */
     this.dividerColor = "gray200";
   }
   componentDidLoad() {
@@ -32,7 +45,7 @@ const ZListGroup = class {
     return (index.h(index.Host, { role: "group" }, index.h("div", { class: {
         "z-list-group-header-container": true,
         "has-header": this.hasHeader,
-      } }, index.h("slot", { name: "header-title" }), this.dividerType === "header" /* ListDividerType.HEADER */ && (index.h("z-divider", { color: this.dividerColor, size: this.dividerSize }))), index.h("slot", null)));
+      } }, index.h("slot", { name: "header-title" }), this.dividerType === index$1.ListDividerType.HEADER && (index.h("z-divider", { color: this.dividerColor, size: this.dividerSize }))), index.h("slot", null)));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/z-list_2.cjs.entry.js

@@ -3,13 +3,17 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
+const index$1 = require('./index-199cd650.js');
 
 const stylesCss$1 = ":host{display:flex;flex-direction:column;font-family:var(--font-family-sans);font-weight:var(--font-rg)}";
 
 const ZList = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.size = "medium" /* ListSize.MEDIUM */;
+    /**
+     * [optional] Sets size of inside elements.
+     */
+    this.size = index$1.ListSize.MEDIUM;
   }
   setChildrenSizeType() {
     const children = this.host.children;
@@ -37,6 +41,51 @@ const ZListElement = class {
     index.registerInstance(this, hostRef);
     this.accessibleFocus = index.createEvent(this, "accessibleFocus", 7);
     this.clickItem = index.createEvent(this, "clickItem", 7);
+    /**
+     * [optional] Align expandable button left or right.
+     */
+    this.alignButton = index$1.ExpandableListButtonAlign.LEFT;
+    /**
+     * [optional] Sets element clickable.
+     */
+    this.clickable = false;
+    /**
+     * [optional] Sets the divider color.
+     */
+    this.dividerColor = "color-surface03";
+    /**
+     * [optional] Sets the position where to insert the divider.
+     */
+    this.dividerType = index$1.ListDividerType.NONE;
+    /**
+     * [optional] Sets the divider size.
+     */
+    this.dividerSize = index$1.DividerSize.SMALL;
+    /**
+     * [optional] Sets element as expandable.
+     */
+    this.expandable = false;
+    /**
+     * [optional] Sets expandable style to element.
+     */
+    this.expandableStyle = index$1.ExpandableListStyle.ACCORDION;
+    /**
+     * [optional] Sets size of inside elements.
+     */
+    this.size = index$1.ListSize.MEDIUM;
+    /**
+     * [optional] Sets text color of the element.
+     */
+    this.color = "none";
+    /**
+     * [optional] Sets disabled style of the element.
+     */
+    this.disabled = false;
+    /**
+     * [optional] If is used in ZContextualMenu component
+     */
+    this.isContextualMenu = false;
+    this.showInnerContent = false;
     this.openElementConfig = {
       accordion: {
         open: "minus-circled",
@@ -47,19 +96,6 @@ const ZListElement = class {
         close: "chevron-down",
       },
     };
-    this.alignButton = "left" /* ExpandableListButtonAlign.LEFT */;
-    this.clickable = false;
-    this.dividerColor = "color-surface03";
-    this.dividerType = "none" /* ListDividerType.NONE */;
-    this.dividerSize = "small" /* DividerSize.SMALL */;
-    this.expandable = false;
-    this.expandableStyle = "accordion" /* ExpandableListStyle.ACCORDION */;
-    this.listElementId = undefined;
-    this.size = "medium" /* ListSize.MEDIUM */;
-    this.color = "none";
-    this.disabled = false;
-    this.isContextualMenu = false;
-    this.showInnerContent = false;
     this.handleClick = this.handleClick.bind(this);
     this.handleKeyDown = this.handleKeyDown.bind(this);
   }
@@ -87,17 +123,17 @@ const ZListElement = class {
     return "container";
   }
   handleKeyDown(event) {
-    const expandByKey = event.code === "Enter" /* KeyboardCode.ENTER */;
+    const expandByKey = event.code === index$1.KeyboardCode.ENTER;
     switch (event.code) {
-      case "ArrowDown" /* KeyboardCode.ARROW_DOWN */:
+      case index$1.KeyboardCode.ARROW_DOWN:
         event.preventDefault();
         this.accessibleFocus.emit(this.listElementId + 1);
         break;
-      case "ArrowUp" /* KeyboardCode.ARROW_UP */:
+      case index$1.KeyboardCode.ARROW_UP:
         event.preventDefault();
         this.accessibleFocus.emit(this.listElementId - 1);
         break;
-      case "Enter" /* KeyboardCode.ENTER */:
+      case index$1.KeyboardCode.ENTER:
         event.preventDefault();
         this.clickItem.emit(this.listElementId);
         break;
@@ -133,7 +169,7 @@ const ZListElement = class {
       } }, index.h("slot", { name: "inner-content" })));
   }
   render() {
-    return (index.h(index.Host, { role: "listitem", "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: !this.isContextualMenu ? "0" : null }, index.h("div", { class: `${this.calculateClass()}`, style: { color: `var(--${this.color})` }, tabindex: this.isContextualMenu ? "0" : "-1", id: `z-list-element-id-${this.listElementId}` }, index.h("div", { class: "z-list-element-container" }, this.renderExpandableButton(), index.h("slot", null)), this.renderExpandedContent()), this.dividerType === "element" /* ListDividerType.ELEMENT */ && (index.h("z-divider", { color: this.dividerColor, size: this.dividerSize }))));
+    return (index.h(index.Host, { role: "listitem", "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: !this.isContextualMenu ? "0" : null }, index.h("div", { class: `${this.calculateClass()}`, style: { color: `var(--${this.color})` }, tabindex: this.isContextualMenu ? "0" : "-1", id: `z-list-element-id-${this.listElementId}` }, index.h("div", { class: "z-list-element-container" }, this.renderExpandableButton(), index.h("slot", null)), this.renderExpandedContent()), this.dividerType === index$1.ListDividerType.ELEMENT && (index.h("z-divider", { color: this.dividerColor, size: this.dividerSize }))));
   }
   get host() { return index.getElement(this); }
 };

package/dist/cjs/z-menu-dropdown_2.cjs.entry.js

@@ -3,7 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
-const utils = require('./utils-7c92be74.js');
+const index$1 = require('./index-199cd650.js');
+const utils = require('./utils-ce225fb3.js');
 require('./breakpoints-88c4fd6c.js');
 
 const stylesCss$1 = ":host{width:inherit;height:32px;font-family:var(--dashboard-font);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.17px}a,a:visited,a:active{color:inherit;text-decoration:none}:host>a{display:block;border:var(--border-size-small) solid transparent;background:var(--bg-grey-050);border-radius:var(--border-radius);color:var(--text-grey-800);outline:none}:host>a::-moz-focus-inner{border:0}:host>a:hover,:host>a.menu-opened:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}:host>a:focus{border:var(--border-size-small) solid var(--myz-blue);box-shadow:0 0 2px 2px var(--myz-blue-light);color:var(--myz-blue);fill:var(--myz-blue)}:host>a:active{border:var(--border-size-small) solid var(--myz-blue-light);box-shadow:0 2px 4px 0 rgb(0 0 0 / 40%);color:var(--myz-blue-light);fill:var(--myz-blue-light)}div.container{position:relative;display:flex;height:32px;align-items:center;justify-content:space-between;padding:0 var(--basex1)}div.container>span.user-wrapper{display:flex}div.container>span.user-wrapper>span.user{overflow:hidden;width:30px;padding:0 var(--basex1);cursor:pointer;text-overflow:ellipsis;white-space:nowrap}div.container>span.arrow{display:flex;align-items:center;justify-content:center}div.container>span.arrow>z-icon{transform:rotate(360deg);transition:all 200ms linear}ul{padding:0 calc(var(--space-unit) * 2);margin:0;list-style:none}li{display:flex;width:max-content;height:var(--basex3);align-items:center;padding:calc(var(--space-unit) / 4) 0}.menu-opened{position:inherit;width:auto !important;min-width:147px;padding-bottom:calc(var(--space-unit) * 2)}.menu-opened a,.menu-opened a:active,.menu-opened a:visited{color:var(--myz-blue);fill:var(--myz-blue)}.menu-opened a:hover{color:var(--myz-blue-dark);fill:var(--myz-blue-dark)}.menu-opened>div.container{margin-bottom:var(--basex1)}.menu-opened>div.container>span.user-wrapper>span.user{width:auto}.menu-opened>div.container>span.arrow>z-icon{transform:rotate(180deg);transition:all 200ms linear}@media only screen and (min-width: 1152px){:host>a{width:147px;padding:0 calc(var(--space-unit) / 4)}:host>a.menu-opened{width:147px;padding-bottom:calc(var(--space-unit) * 2)}div.container>span.user-wrapper>span.user{width:80px}}";
@@ -11,9 +12,6 @@ const stylesCss$1 = ":host{width:inherit;height:32px;font-family:var(--dashboard
 const ZMenuDropdown = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.nomeutente = undefined;
-    this.menucontent = undefined;
-    this.buttonid = undefined;
     this.ismenuopen = false;
     this.handleToggle = this.handleToggle.bind(this);
     this.handleFocus = this.handleFocus.bind(this);
@@ -38,7 +36,7 @@ const ZMenuDropdown = class {
     this.ismenuopen = !this.ismenuopen;
   }
   handleFocus(e) {
-    if (e instanceof KeyboardEvent && e.keyCode !== 9 /* KeyboardKeyCode.TAB */) {
+    if (e instanceof KeyboardEvent && e.keyCode !== index$1.KeyboardKeyCode.TAB) {
       return;
     }
     const tree = utils.getElementTree(utils.getClickedElement());
@@ -63,8 +61,6 @@ const stylesCss = "ul{padding:0;margin:0}";
 const ZMyzList = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.inputrawdata = undefined;
-    this.list = undefined;
   }
   componentWillLoad() {
     if (this.inputrawdata) {

package/dist/cjs/z-menu-section.cjs.entry.js

@@ -11,9 +11,6 @@ const ZMenuSection = class {
     index.registerInstance(this, hostRef);
     this.opened = index.createEvent(this, "opened", 7);
     this.closed = index.createEvent(this, "closed", 7);
-    this.active = undefined;
-    this.open = undefined;
-    this.hasContent = undefined;
   }
   toggle() {
     if (!this.hasContent) {

package/dist/cjs/z-menu.cjs.entry.js

@@ -11,11 +11,18 @@ const ZMenu = class {
     index.registerInstance(this, hostRef);
     this.opened = index.createEvent(this, "opened", 7);
     this.closed = index.createEvent(this, "closed", 7);
-    this.active = undefined;
+    /**
+     * Flag to set the display mode of the list.
+     * If true, the list will be absolutely positioned under the menu label,
+     * stacked beneath it otherwise.
+     * @default false
+     */
     this.floating = false;
+    /**
+     * The opening state of the menu.
+     * @default false
+     */
     this.open = false;
-    this.hasHeader = undefined;
-    this.hasContent = undefined;
     this.toggle = this.toggle.bind(this);
     this.checkContent = this.checkContent.bind(this);
     this.onItemsChange = this.onItemsChange.bind(this);

package/dist/cjs/z-messages-pocket.cjs.entry.js

@@ -3,15 +3,15 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
+const index$1 = require('./index-199cd650.js');
 
 const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>z-pocket{width:100%}:host>z-pocket.closed{width:158px}:host>z-pocket>z-pocket-header{color:var(--color-primary01);fill:var(--color-primary01);font-size:12px;font-weight:var(--font-sb)}:host>z-pocket>z-pocket-header span.badge{display:inline-block;padding:0 calc(var(--space-unit) * 0.5);margin-left:var(--space-unit);background:var(--color-secondary02);border-radius:50%;color:var(--color-surface01)}:host>z-pocket>z-pocket-header>z-icon{margin-left:var(--space-unit)}:host>z-pocket>z-pocket-body>div.body{overflow:hidden;padding:var(--space-unit);margin:0 var(--space-unit)}:host>z-pocket.preview>z-pocket-body{position:relative}:host>z-pocket.preview>z-pocket-body>div.gradient{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgb(255 0 0 / 0%), white)}:host>z-pocket.open>z-pocket-body>div.body{overflow:auto;max-height:calc(100vh - 166px);scrollbar-width:none}:host ::-webkit-scrollbar{width:0}@media only screen and (min-width: 768px){:host>z-pocket{width:768px;margin:0 calc((100% - 768px) / 2)}:host>z-pocket.closed{margin:0 calc((100% - 158px) / 2)}:host>z-pocket.open>z-pocket-body>div.body{max-height:326px}}@media only screen and (min-width: 1152px){:host>z-pocket.open>z-pocket-body>div.body{scrollbar-color:var(--color-primary01) var(--color-surface03);scrollbar-width:thin}:host ::-webkit-scrollbar{width:10px;background:linear-gradient(\n      90deg,\n      var(--color-surface01) 2px,\n      var(--color-surface03) 4px,\n      var(--color-surface01) 8px\n    );border-radius:var(--radius-base)}:host ::-webkit-scrollbar-thumb{width:var(--space-unit);background-color:var(--color-primary01);border-radius:var(--radius-base)}}";
 
 const ZMessagesPocket = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
-    this.pocketid = undefined;
-    this.messages = undefined;
-    this.status = "preview" /* PocketStatus.PREVIEW */;
+    /** pocket status */
+    this.status = index$1.PocketStatus.PREVIEW;
   }
   handlePocketToggle(e) {
     if (e.detail.id === this.pocketid) {
@@ -22,12 +22,12 @@ const ZMessagesPocket = class {
     let message;
     let icon;
     switch (this.status) {
-      case "preview" /* PocketStatus.PREVIEW */:
-      case "closed" /* PocketStatus.CLOSED */:
+      case index$1.PocketStatus.PREVIEW:
+      case index$1.PocketStatus.CLOSED:
         message = (index.h("span", null, "Messaggi ", index.h("span", { class: "badge" }, this.messages)));
         icon = "chevron-up";
         break;
-      case "open" /* PocketStatus.OPEN */:
+      case index$1.PocketStatus.OPEN:
         message = index.h("span", null, "Riduci");
         icon = "chevron-down";
         break;

package/dist/cjs/z-modal-login.cjs.entry.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
+const index$1 = require('./index-199cd650.js');
 
 const stylesCss = ".sc-z-modal-login-h{font-family:var(--dashboard-font);font-weight:var(--font-rg)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login{display:flex;box-sizing:border-box;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start;padding:calc(var(--space-unit) * 4) calc(var(--space-unit) * 2) calc(var(--space-unit) * 3)\n    calc(var(--space-unit) * 2);color:var(--text-grey-800)}z-button.sc-z-modal-login,z-input.sc-z-modal-login,.sc-z-modal-login-s>z-button,.sc-z-modal-login-s>z-input{display:inline-block;width:100%}z-link.sc-z-modal-login,.sc-z-modal-login-s>z-link{font-size:12px}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login{display:flex;flex-flow:column nowrap;align-items:stretch;justify-content:flex-start}div.wrapper>form>div.username.sc-z-modal-login-s>z-input,div.wrapper>form>div.password.sc-z-modal-login-s>z-input,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.username.sc-z-modal-login z-input.sc-z-modal-login,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.password.sc-z-modal-login z-input.sc-z-modal-login{margin-bottom:var(--space-unit)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>z-link.forget.sc-z-modal-login{align-self:flex-end;font-size:12px}div.wrapper>form>div.login.sc-z-modal-login-s>z-button,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>form.sc-z-modal-login>div.login.sc-z-modal-login z-button.sc-z-modal-login{align-self:flex-start;margin:calc(var(--space-unit) * 3) 0}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>hr.sc-z-modal-login{width:100%;border:none;border-top:var(--border-size-medium) solid var(--bg-grey-200);margin-bottom:calc(var(--space-unit) * 3);margin-block-start:unset}div.wrapper>div.signup.sc-z-modal-login-s>z-button,.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.signup.sc-z-modal-login z-button.sc-z-modal-login{display:inline-block;margin:calc(var(--space-unit) * 2) 0}.sc-z-modal-login-h div.providers.sc-z-modal-login{display:grid;gap:calc(var(--space-unit) * 2) 0;grid-auto-rows:auto;grid-template-columns:1fr}slot-fb[name=\"provider\"].sc-z-modal-login{display:grid;gap:calc(var(--space-unit) * 2) 0;grid-auto-rows:auto;grid-template-columns:1fr}.sc-z-modal-login-h div.providers.sc-z-modal-login>z-body.sc-z-modal-login{padding-top:calc(var(--space-unit) * 2)}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.providers.sc-z-modal-login .zd.sc-z-modal-login{display:flex;flex-flow:row nowrap;align-content:center;align-items:center;justify-content:center}.sc-z-modal-login-h div.wrapper.sc-z-modal-login>div.providers.sc-z-modal-login .zd.sc-z-modal-login>svg.sc-z-modal-login{margin-right:var(--space-unit)}@media only screen and (min-width: 768px){z-button.sc-z-modal-login,.sc-z-modal-login-s>z-button{width:initial}.sc-z-modal-login-h div.wrapper.sc-z-modal-login{width:396px;padding:calc(var(--space-unit) * 3)}.sc-z-modal-login-h div.providers.sc-z-modal-login{display:grid;align-items:center;justify-content:center;gap:var(--space-unit);grid-auto-rows:auto;grid-template-columns:1fr 1fr}.sc-z-modal-login-h div.providers.sc-z-modal-login>z-body.sc-z-modal-login{padding-bottom:var(--space-unit);grid-column:1 / 3}.sc-z-modal-login-s>[slot=\"provider\"]{width:100%}slot-fb[name=\"provider\"].sc-z-modal-login{display:grid;align-items:center;justify-content:center;gap:var(--space-unit);grid-auto-rows:auto;grid-column:1 / 3;grid-template-columns:1fr 1fr}slot-fb[name=\"provider\"].sc-z-modal-login>*.sc-z-modal-login{width:100%}}@media only screen and (min-width: 1366px){.sc-z-modal-login-h div.wrapper.sc-z-modal-login{width:477px;padding:calc(var(--space-unit) * 4)}}";
 
@@ -13,11 +14,8 @@ const ZModalLogin = class {
     this.statusUpdate = index.createEvent(this, "statusUpdate", 7);
     this.signupClick = index.createEvent(this, "signupClick", 7);
     this.zainoDigitaleClick = index.createEvent(this, "zainoDigitaleClick", 7);
-    this.forgotPasswordUrl = undefined;
+    /** Login modal title */
     this.heading = "Entra in MyZanichelli";
-    this.status = undefined;
-    this.message = undefined;
-    this.pwdmessage = undefined;
     this.externalProviderCheck = false;
   }
   componentDidLoad() {
@@ -33,7 +31,7 @@ const ZModalLogin = class {
     let username = usernameInput.value;
     const password = passwordInput.value;
     if (!username || !password) {
-      this.status = "error" /* InputStatus.ERROR */;
+      this.status = index$1.InputStatus.ERROR;
       return;
     }
     username = this.cleanUsername(username);
@@ -74,10 +72,10 @@ const ZModalLogin = class {
     return username;
   }
   renderZainoDigitaleButton() {
-    return (index.h("z-button", { variant: "secondary" /* ButtonVariant.SECONDARY */, onClick: () => this.emitZainoDigitaleClick(), class: "zainoDigitale" }, index.h("div", { class: "zd" }, index.h("svg", { width: "18px", height: "24px", viewBox: "0 0 18 24" }, index.h("g", { stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" }, index.h("g", { transform: "translate(-313.000000, -329.000000)", fill: "#E2001A", "fill-rule": "nonzero" }, index.h("g", { transform: "translate(25.000000, 191.000000)" }, index.h("g", null, index.h("g", { transform: "translate(0.000000, 100.000000)" }, index.h("g", null, index.h("g", { transform: "translate(276.000000, 28.000000)" }, index.h("path", { d: "M29.8953704,30.5632326 C29.9143039,30.3327754 29.5356326,30.0447041 29.1380277,29.8142469 C29.2516291,28.7963947 29.4409647,26.9719425 29.2705626,26.3189807 C29.0433598,25.416357 28.3428178,24.8018047 28.380685,23.822362 C28.4185521,22.8429193 28.1913493,16.5437582 27.0364017,15.1802202 C26.1654576,14.162368 25.4649156,12.8372396 23.4390239,12.2418921 C23.4390239,12.0498445 23.4390239,11.8770016 23.4200903,11.7425683 C23.3822232,10.9167637 21.9622056,10.090959 21.6214014,10.0525495 C21.2805972,10.01414 20.371786,9.95652568 20.0309818,10.0525495 C19.6901775,10.1293685 19.0464362,11.128016 18.7434992,11.4352922 C18.5920306,11.5889302 18.5541635,11.9538207 18.5730971,12.3187111 C17.437083,12.6836015 16.1306669,13.4325871 15.4490584,14.9497631 C14.2941108,17.676839 13.4799674,18.9251483 13.6693031,24.1680477 C13.5935688,25.1090809 13.2906318,25.6084046 13.1012961,25.6852237 C12.9119604,25.7620427 12.798359,25.9156808 12.7604919,26.1077284 C12.7226247,26.2805712 12.5522226,28.37389 12.7415583,29.8718612 C12.3818205,30.1023183 12.0788834,30.3519802 12.097817,30.5632326 C12.1546177,31.0625563 11.8516806,31.7731324 12.097817,32.0612038 C12.230352,32.2148419 12.7226247,32.5413228 13.3284989,32.8293942 C13.6125024,33.4631512 14.199443,33.9240655 15.467992,33.9816797 C18.1565586,34.0584988 26.2601254,33.8664512 26.5630625,33.9048607 C26.847066,33.9432702 28.4374857,34.0008845 28.683622,32.8293942 C29.2894962,32.5413228 29.781769,32.2148419 29.9143039,32.0612038 C30.1415067,31.7731324 29.8385697,31.0625563 29.8953704,30.5632326 Z M12.0319858,31.2 C12.1173988,31.1230769 12.3736379,31.0461538 12.743761,31 C12.857645,31.3230769 12.914587,31.6615385 13,32 C12.4021089,31.8153846 11.8611598,31.5692308 12.0319858,31.2 Z M21.1618497,12.8394441 C21.1618497,12.8394441 20.6763006,12.8165075 20,13 L20,12.9770634 C20,12.5642053 20.3121387,11.3256309 20.3988439,11.1192018 C20.4855491,10.9127728 21.265896,11.0274556 21.8554913,11.0733287 C22.6358382,11.0503922 22.4624277,11.2568212 22.8092486,11.9907912 C22.9306358,12.2889666 22.982659,12.6559516 23,13 C22.4797688,12.8623806 21.8728324,12.8165075 21.1618497,12.8394441 Z M28.3324094,30 C28.6648189,30.0833333 28.9085858,30.2222222 28.9750677,30.3888889 C29.1301921,31.1666667 28.5318551,31.6388889 28,32 C28.0221606,31.5 28.0664819,31.1111111 28.0664819,31.1111111 L28.2437669,30.6111111 L28.3324094,30 Z M21.8571429,23 L21.8571429,23.8 L22.7142857,23.8 L22.7142857,24.6 L23.5714286,24.6 L23.5714286,25.4 L24.4285714,25.4 L24.4285714,26.2 L25.2857143,26.2 L25.2857143,27 L26.1428571,27 L26.1428571,27.8 L27,27.8 L27,28.6 L24.4285714,28.6 L24.4285714,29.4 L25.2857143,29.4 L25.2857143,31 L24.4285714,31 L24.4285714,30.2 L23.5714286,30.2 L23.5714286,29.4 L22.7142857,29.4 L22.7142857,30.2 L21.8571429,30.2 L21.8571429,31 L21,31 L21,23 L21.8571429,23 Z" }))))))))), index.h("span", null, "ZAINO DIGITALE"))));
+    return (index.h("z-button", { variant: index$1.ButtonVariant.SECONDARY, onClick: () => this.emitZainoDigitaleClick(), class: "zainoDigitale" }, index.h("div", { class: "zd" }, index.h("svg", { width: "18px", height: "24px", viewBox: "0 0 18 24" }, index.h("g", { stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" }, index.h("g", { transform: "translate(-313.000000, -329.000000)", fill: "#E2001A", "fill-rule": "nonzero" }, index.h("g", { transform: "translate(25.000000, 191.000000)" }, index.h("g", null, index.h("g", { transform: "translate(0.000000, 100.000000)" }, index.h("g", null, index.h("g", { transform: "translate(276.000000, 28.000000)" }, index.h("path", { d: "M29.8953704,30.5632326 C29.9143039,30.3327754 29.5356326,30.0447041 29.1380277,29.8142469 C29.2516291,28.7963947 29.4409647,26.9719425 29.2705626,26.3189807 C29.0433598,25.416357 28.3428178,24.8018047 28.380685,23.822362 C28.4185521,22.8429193 28.1913493,16.5437582 27.0364017,15.1802202 C26.1654576,14.162368 25.4649156,12.8372396 23.4390239,12.2418921 C23.4390239,12.0498445 23.4390239,11.8770016 23.4200903,11.7425683 C23.3822232,10.9167637 21.9622056,10.090959 21.6214014,10.0525495 C21.2805972,10.01414 20.371786,9.95652568 20.0309818,10.0525495 C19.6901775,10.1293685 19.0464362,11.128016 18.7434992,11.4352922 C18.5920306,11.5889302 18.5541635,11.9538207 18.5730971,12.3187111 C17.437083,12.6836015 16.1306669,13.4325871 15.4490584,14.9497631 C14.2941108,17.676839 13.4799674,18.9251483 13.6693031,24.1680477 C13.5935688,25.1090809 13.2906318,25.6084046 13.1012961,25.6852237 C12.9119604,25.7620427 12.798359,25.9156808 12.7604919,26.1077284 C12.7226247,26.2805712 12.5522226,28.37389 12.7415583,29.8718612 C12.3818205,30.1023183 12.0788834,30.3519802 12.097817,30.5632326 C12.1546177,31.0625563 11.8516806,31.7731324 12.097817,32.0612038 C12.230352,32.2148419 12.7226247,32.5413228 13.3284989,32.8293942 C13.6125024,33.4631512 14.199443,33.9240655 15.467992,33.9816797 C18.1565586,34.0584988 26.2601254,33.8664512 26.5630625,33.9048607 C26.847066,33.9432702 28.4374857,34.0008845 28.683622,32.8293942 C29.2894962,32.5413228 29.781769,32.2148419 29.9143039,32.0612038 C30.1415067,31.7731324 29.8385697,31.0625563 29.8953704,30.5632326 Z M12.0319858,31.2 C12.1173988,31.1230769 12.3736379,31.0461538 12.743761,31 C12.857645,31.3230769 12.914587,31.6615385 13,32 C12.4021089,31.8153846 11.8611598,31.5692308 12.0319858,31.2 Z M21.1618497,12.8394441 C21.1618497,12.8394441 20.6763006,12.8165075 20,13 L20,12.9770634 C20,12.5642053 20.3121387,11.3256309 20.3988439,11.1192018 C20.4855491,10.9127728 21.265896,11.0274556 21.8554913,11.0733287 C22.6358382,11.0503922 22.4624277,11.2568212 22.8092486,11.9907912 C22.9306358,12.2889666 22.982659,12.6559516 23,13 C22.4797688,12.8623806 21.8728324,12.8165075 21.1618497,12.8394441 Z M28.3324094,30 C28.6648189,30.0833333 28.9085858,30.2222222 28.9750677,30.3888889 C29.1301921,31.1666667 28.5318551,31.6388889 28,32 C28.0221606,31.5 28.0664819,31.1111111 28.0664819,31.1111111 L28.2437669,30.6111111 L28.3324094,30 Z M21.8571429,23 L21.8571429,23.8 L22.7142857,23.8 L22.7142857,24.6 L23.5714286,24.6 L23.5714286,25.4 L24.4285714,25.4 L24.4285714,26.2 L25.2857143,26.2 L25.2857143,27 L26.1428571,27 L26.1428571,27.8 L27,27.8 L27,28.6 L24.4285714,28.6 L24.4285714,29.4 L25.2857143,29.4 L25.2857143,31 L24.4285714,31 L24.4285714,30.2 L23.5714286,30.2 L23.5714286,29.4 L22.7142857,29.4 L22.7142857,30.2 L21.8571429,30.2 L21.8571429,31 L21,31 L21,23 L21.8571429,23 Z" }))))))))), index.h("span", null, "ZAINO DIGITALE"))));
   }
   render() {
-    return (index.h("z-modal", { modaltitle: this.heading }, index.h("div", { class: "wrapper", slot: "modalContent" }, index.h("form", { method: "post" }, index.h("div", { class: "username" }, index.h("slot", { name: "username" }, index.h("z-input", { id: "username", label: "email o numero di cellulare", placeholder: "Inserisci l'email o il cellulare", autocomplete: "username", name: "username", status: this.status, message: this.message, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), index.h("div", { class: "password" }, index.h("slot", { name: "password" }, index.h("z-input", { id: "password", label: "password", placeholder: "Inserisci la tua password", type: "password" /* InputType.PASSWORD */, name: "password", autocomplete: "current-password", status: this.status, message: this.pwdmessage, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), index.h("z-link", { class: "forget", href: this.forgotPasswordUrl }, "Password dimenticata?"), index.h("div", { class: "login" }, index.h("slot", { name: "login" }, index.h("z-button", { variant: "primary" /* ButtonVariant.PRIMARY */, onClick: () => this.emitLoginSubmit() }, "Accedi")))), index.h("hr", null), index.h("z-body", { class: "signup", level: 4, variant: "semibold" }, "Non hai ancora un account?"), index.h("div", { class: "signup" }, index.h("slot", { name: "signup" }, index.h("z-button", { variant: "secondary" /* ButtonVariant.SECONDARY */, onClick: () => this.emitSignupClick() }, "Registrati"))), !this.externalProviderCheck && (index.h("div", { class: "providers" }, index.h("z-body", { class: "provider", level: 5, variant: "regular" }, "OPPURE ACCEDI CON:"), index.h("slot", { name: "provider" }, this.renderZainoDigitaleButton(), index.h("z-link", { icon: "informationsource", href: "https://www.zainodigitale.it/#/landing" }, "Cos'\u00E8 Zaino Digitale?")))))));
+    return (index.h("z-modal", { modaltitle: this.heading }, index.h("div", { class: "wrapper", slot: "modalContent" }, index.h("form", { method: "post" }, index.h("div", { class: "username" }, index.h("slot", { name: "username" }, index.h("z-input", { id: "username", label: "email o numero di cellulare", placeholder: "Inserisci l'email o il cellulare", autocomplete: "username", name: "username", status: this.status, message: this.message, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), index.h("div", { class: "password" }, index.h("slot", { name: "password" }, index.h("z-input", { id: "password", label: "password", placeholder: "Inserisci la tua password", type: index$1.InputType.PASSWORD, name: "password", autocomplete: "current-password", status: this.status, message: this.pwdmessage, onKeyUp: (e) => this.handleInputKeyUp(e), onInputChange: () => this.handleInputChange() }))), index.h("z-link", { class: "forget", href: this.forgotPasswordUrl }, "Password dimenticata?"), index.h("div", { class: "login" }, index.h("slot", { name: "login" }, index.h("z-button", { variant: index$1.ButtonVariant.PRIMARY, onClick: () => this.emitLoginSubmit() }, "Accedi")))), index.h("hr", null), index.h("z-body", { class: "signup", level: 4, variant: "semibold" }, "Non hai ancora un account?"), index.h("div", { class: "signup" }, index.h("slot", { name: "signup" }, index.h("z-button", { variant: index$1.ButtonVariant.SECONDARY, onClick: () => this.emitSignupClick() }, "Registrati"))), !this.externalProviderCheck && (index.h("div", { class: "providers" }, index.h("z-body", { class: "provider", level: 5, variant: "regular" }, "OPPURE ACCEDI CON:"), index.h("slot", { name: "provider" }, this.renderZainoDigitaleButton(), index.h("z-link", { icon: "informationsource", href: "https://www.zainodigitale.it/#/landing" }, "Cos'\u00E8 Zaino Digitale?")))))));
   }
   get hostElement() { return index.getElement(this); }
 };

package/dist/cjs/z-modal.cjs.entry.js

@@ -12,9 +12,7 @@ const ZModal = class {
     this.modalClose = index.createEvent(this, "modalClose", 7);
     this.modalHeaderActive = index.createEvent(this, "modalHeaderActive", 7);
     this.modalBackgroundClick = index.createEvent(this, "modalBackgroundClick", 7);
-    this.modalid = undefined;
-    this.modaltitle = undefined;
-    this.modalsubtitle = undefined;
+    /** aria-label for close button (optional) */
     this.closeButtonLabel = "close modal";
   }
   emitModalClose() {

package/dist/cjs/z-myz-card-alert.cjs.entry.js

@@ -3,6 +3,7 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-e3299e0a.js');
+const index$1 = require('./index-199cd650.js');
 
 const stylesCss = ":host{position:absolute;z-index:2;top:0;left:0;width:100%;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>z-alert{height:calc(var(--space-unit) * 6)}.relative-container{position:relative;display:grid;align-items:center;padding:0;grid-column-gap:var(--space-unit);grid-template-columns:18px auto 46px;grid-template-rows:1fr;outline:none}.relative-container::-moz-focus-inner{border:0}.alert-external-wrapper.remove-alert{border:var(--border-size-medium) solid var(--color-surface02);border-top:none}:host div.add-alert{background:var(--color-success-inverse)}:host div.remove-alert{background:var(--color-warning-inverse)}:host div>.content-text{color:var(--color-surface05);font-size:14px;letter-spacing:0.16px;line-height:20px}:host div>.content-action{height:20px;color:var(--color-primary01);cursor:pointer;font-size:12px;font-weight:var(--font-sb);letter-spacing:0.32px;line-height:20px}:host div>z-icon{justify-self:center}";
 
@@ -10,10 +11,6 @@ const ZMyzCardAlert = class {
   constructor(hostRef) {
     index.registerInstance(this, hostRef);
     this.undoAction = index.createEvent(this, "undoAction", 7);
-    this.iconname = undefined;
-    this.contenttext = undefined;
-    this.actiontext = undefined;
-    this.type = undefined;
   }
   emitUndoAction() {
     this.undoAction.emit({ actionType: this.type });
@@ -46,9 +43,9 @@ const ZMyzCardAlert = class {
   getAlertType() {
     switch (this.type) {
       case "add":
-        return "success" /* AlertType.SUCCESS */;
+        return index$1.AlertType.SUCCESS;
       case "remove":
-        return "warning" /* AlertType.WARNING */;
+        return index$1.AlertType.WARNING;
       default:
         return null;
     }