@zanichelli/albe-web-components 19.2.1 → 19.2.3-RC1

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

@@ -1,8 +1,7 @@
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-c8ceadeb.js';
-import { g as KeyboardCode } from './index-106473a8.js';
+import { r as registerInstance, c as createEvent, h, H as Host, d as getElement } from './index-ByN2sYu6.js';
+import { g as KeyboardCode } from './index-BKCj6NR2.js';
 
-const stylesCss = ":host{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0;font-family:var(--font-family-sans)}:host,::slotted(*),*{box-sizing:border-box}::slotted(a){text-decoration:none}::slotted(*){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}.label{display:flex;width:100%;align-items:center;padding:var(--space-unit) 0;border:0;border-bottom:var(--border-size-small) solid var(--color-surface03);margin:0;background:transparent;border-radius:0;cursor:pointer;text-align:left}:host(:last-child:not([open])) .label{border-bottom:none}:host(:is([active],[open])) .label,.label:focus:focus-visible,.label:hover{border-color:var(--color-primary01)}.label:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:is([active],[open])) .label ::slotted(*),.label:focus:focus-visible ::slotted(*),.label:hover ::slotted(*){font-weight:var(--font-bd)}::slotted([data-text]){display:inline-flex;flex-direction:column}::slotted([data-text])::after{overflow:hidden;height:0;content:attr(data-text);content:attr(data-text) / \"\";font-weight:var(--font-bd);pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text])::after{display:none}}.label ::slotted(*){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.5}.label z-icon{margin-left:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.items{display:flex;width:100%;flex-direction:column;padding:calc(var(--space-unit) / 2);padding-bottom:calc(var(--space-unit) * 1.5)}.items[hidden]{display:none}::slotted([slot=\"section\"]){display:inline-flex;padding:calc(var(--space-unit) / 2);margin:0;font-size:var(--font-size-1);line-height:1.333;outline:none}::slotted([slot=\"section\"]:last-of-type){border:none}::slotted([slot=\"section\"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);color:var(--color-primary01)}::slotted([slot=\"section\"]:hover),::slotted([slot=\"section\"]:focus:focus-visible),::slotted([slot=\"section\"]:active),::slotted([slot=\"section\"][active]),::slotted([slot=\"section\"][data-active]){color:var(--color-primary01);font-weight:var(--font-bd)}";
-const ZMenuSectionStyle0 = stylesCss;
+const stylesCss = () => `:host{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:0;font-family:var(--font-family-sans)}:host,::slotted(*),*{box-sizing:border-box}::slotted(a){text-decoration:none}::slotted(*){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}.label{display:flex;width:100%;align-items:center;padding:var(--space-unit) 0;border:0;border-bottom:var(--border-size-small) solid var(--color-surface03);margin:0;background:transparent;border-radius:0;cursor:pointer;text-align:left}:host(:last-child:not([open])) .label{border-bottom:none}:host(:is([active],[open])) .label,.label:focus:focus-visible,.label:hover{border-color:var(--color-primary01)}.label:focus:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(:is([active],[open])) .label ::slotted(*),.label:focus:focus-visible ::slotted(*),.label:hover ::slotted(*){font-weight:var(--font-bd)}::slotted([data-text]){display:inline-flex;flex-direction:column}::slotted([data-text])::after{overflow:hidden;height:0;content:attr(data-text);content:attr(data-text) / "";font-weight:var(--font-bd);pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text])::after{display:none}}.label ::slotted(*){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.5}.label z-icon{margin-left:calc(var(--space-unit) * 4);fill:var(--color-default-icon)}.items{display:flex;width:100%;flex-direction:column;padding:calc(var(--space-unit) / 2);padding-bottom:calc(var(--space-unit) * 1.5)}.items[hidden]{display:none}::slotted([slot="section"]){display:inline-flex;padding:calc(var(--space-unit) / 2);margin:0;font-size:var(--font-size-1);line-height:1.333;outline:none}::slotted([slot="section"]:last-of-type){border:none}::slotted([slot="section"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary);color:var(--color-primary01)}::slotted([slot="section"]:hover),::slotted([slot="section"]:focus:focus-visible),::slotted([slot="section"]:active),::slotted([slot="section"][active]),::slotted([slot="section"][data-active]){color:var(--color-primary01);font-weight:var(--font-bd)}`;
 
 const ZMenuSection = class {
     get focusableItem() {
@@ -160,11 +159,11 @@ const ZMenuSection = class {
         registerInstance(this, hostRef);
         this.opened = createEvent(this, "opened", 7);
         this.closed = createEvent(this, "closed", 7);
-        this.active = undefined;
+        /**
+         * Tabindex value to set on the label button.
+         * Useful to manage keyboard navigation focus with roving tabindex handled by this component's parent (usually ZMenu).
+         */
         this.htmlTabindex = -1;
-        this.open = undefined;
-        this.hasItems = undefined;
-        this.items = undefined;
         this.toggle = this.toggle.bind(this);
         this.onItemsChange = this.onItemsChange.bind(this);
         this.onLabelSlotChange = this.onLabelSlotChange.bind(this);
@@ -176,16 +175,18 @@ const ZMenuSection = class {
         this.onItemsChange();
     }
     render() {
-        return (h(Host, { key: '4dce34f277ab3c8c41171a15a02fd174c45742cd', open: this.open }, h("button", { key: 'b6c535e87dbb5af8808d7a19556ad116cbcca72b', 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: 'fbbba483ca5fe6d45440c01a89f061565ce641aa', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: 'b4c67b7cada94580b4f5853aaa8cbb9818bece74', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '711c085b5d74affb2c23ebd1acdd774b5903e7e5', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: 'a2fe12f235f6b23a96f2bd3a8a18f3a095fcff2d', name: "section", onSlotchange: this.onItemsChange }))));
+        return (h(Host, { key: '4e6388d5919ca9010c78ef35df6b1c0b807d2dd6', open: this.open }, h("button", { key: '4093e9a7ce5cb5cf63ca7012bb44c7b49b638e90', 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: '0c88383d5be4c81aee5a78f89e4706a6b167dccb', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: 'd32c9dc28048a6d7441075da41cb2f255e5bdc73', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '0c24a7122314391262e640b440f87dce632eb2f3', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: 'fe79aa30aaa7d3a92621c6725e4d0ddca604726e', name: "section", onSlotchange: this.onItemsChange }))));
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "open": ["onOpenChange"],
-        "htmlTabindex": ["onTabindexChange"]
+        "open": [{
+                "onOpenChange": 0
+            }],
+        "htmlTabindex": [{
+                "onTabindexChange": 0
+            }]
     }; }
 };
-ZMenuSection.style = ZMenuSectionStyle0;
+ZMenuSection.style = stylesCss();
 
 export { ZMenuSection as z_menu_section };
-
-//# sourceMappingURL=z-menu-section.entry.js.map

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

@@ -1,10 +1,9 @@
-import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-c8ceadeb.js';
-import { g as KeyboardCode } from './index-106473a8.js';
-import { a as containsElement } from './utils-1b64bcd9.js';
-import './breakpoints-d148bfde.js';
+import { r as registerInstance, c as createEvent, h, H as Host, d as getElement } from './index-ByN2sYu6.js';
+import { g as KeyboardCode } from './index-BKCj6NR2.js';
+import { a as containsElement } from './utils-0PByxJyN.js';
+import './breakpoints-Q-tWjk7P.js';
 
-const stylesCss = ":host,::slotted(*),*{box-sizing:border-box;outline:none}:host{position:relative;display:inline-flex;height:fit-content;flex-direction:column}::slotted(a){text-decoration:none}::slotted(*){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}.menu-label{position:relative;display:flex;width:100%;align-items:center;padding:0;border:0;border-bottom:var(--border-size-large) solid transparent;margin:0;background:transparent;border-radius:0;color:inherit;text-align:left}button.menu-label{cursor:pointer}.menu-label:focus-visible,div.menu-label:focus-within{box-shadow:var(--shadow-focus-primary)}:host(:is([active],[open])) .menu-label ::slotted(*),.menu-label:focus-visible ::slotted(*),div.menu-label:focus-within ::slotted(*){color:var(--color-primary01);font-weight:var(--font-bd)}:host([vertical-context]) .menu-label{padding:var(--space-unit) 0;border-width:var(--border-size-small);border-color:var(--color-surface03)}:host(:is([active],[open])) .menu-label,.menu-label:hover,.menu-label:focus-visible,div.menu-label:focus-within{border-color:var(--color-primary01)}:host([vertical-context]:is([active],[open])) .menu-label::after,:host([vertical-context]) .menu-label:hover::after,:host([vertical-context]) .menu-label:focus-visible::after,:host([vertical-context]) div.menu-label:focus-within::after{position:absolute;bottom:calc(var(--border-size-small) * -1);left:0;width:100%;height:var(--border-size-large);background-color:var(--color-primary01);content:\"\"}:host([vertical-context]) .menu-label ::slotted(*){padding:0}.menu-label ::slotted(*){display:inline-flex;width:100%;min-width:fit-content;padding-bottom:2px;margin:0;appearance:none;color:var(--z-menu-label-color, var(--color-default-text));font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:inherit;line-height:1.5;white-space:nowrap}.menu-label z-icon{margin-left:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon)}::slotted([data-text]:not([slot]))::after{height:0;content:attr(data-text);content:attr(data-text) / \"\";font-weight:var(--font-bd);letter-spacing:normal;pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text]:not([slot]))::after{display:none}}::slotted([data-text]:not([slot])){display:inline-flex;flex-direction:column}.content{background:var(--color-surface01)}:host(:not([open])) .content{display:none}:host([floating]:not([vertical-context])) .content{position:absolute;top:100%;left:0;width:375px;min-width:100%;max-width:100vw;padding:0 calc(var(--space-unit) * 2);box-shadow:var(--shadow-2)}:host(:not([floating])) .content{width:100%}.header{display:flex;align-items:center;padding:var(--space-unit) 0 calc(var(--space-unit) * 2)}.header ::slotted(img[slot=\"header\"]){width:calc(var(--space-unit) * 11.25);height:auto;object-fit:contain}.header ::slotted([slot=\"header\"]:not(:first-child)){margin:auto 0;margin-left:calc(var(--space-unit) * 2.5);font-size:var(--font-size-3);font-weight:var(--font-sb);line-height:1.5}.items{display:flex;flex-direction:column;align-items:flex-start;background:inherit}.items>::slotted([slot=\"item\"]){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.5}.items>::slotted([slot=\"item\"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}.items>::slotted([slot=\"item\"]:not(z-menu-section)){padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface03)}:host(:not([vertical-context])) .items>::slotted([slot=\"item\"]:last-child){border-bottom:0}.items>::slotted([slot=\"item\"]:hover),.items>::slotted([slot=\"item\"]:focus:focus-visible),.items>::slotted([slot=\"item\"]:active),.items>::slotted([slot=\"item\"][active]),.items>::slotted([slot=\"item\"][data-active]){border-color:var(--color-primary01);font-weight:var(--font-bd)}";
-const ZMenuStyle0 = stylesCss;
+const stylesCss = () => `:host,::slotted(*),*{box-sizing:border-box;outline:none}:host{position:relative;display:inline-flex;height:fit-content;flex-direction:column}::slotted(a){text-decoration:none}::slotted(*){color:var(--color-default-text);font-family:var(--font-family-sans);font-weight:var(--font-rg)}.menu-label{position:relative;display:flex;width:100%;align-items:center;padding:0;border:0;border-bottom:var(--border-size-large) solid transparent;margin:0;background:transparent;border-radius:0;color:inherit;text-align:left}button.menu-label{cursor:pointer}.menu-label:focus-visible,div.menu-label:focus-within{box-shadow:var(--shadow-focus-primary)}:host(:is([active],[open])) .menu-label ::slotted(*),.menu-label:focus-visible ::slotted(*),div.menu-label:focus-within ::slotted(*){color:var(--color-primary01);font-weight:var(--font-bd)}:host([vertical-context]) .menu-label{padding:var(--space-unit) 0;border-width:var(--border-size-small);border-color:var(--color-surface03)}:host(:is([active],[open])) .menu-label,.menu-label:hover,.menu-label:focus-visible,div.menu-label:focus-within{border-color:var(--color-primary01)}:host([vertical-context]:is([active],[open])) .menu-label::after,:host([vertical-context]) .menu-label:hover::after,:host([vertical-context]) .menu-label:focus-visible::after,:host([vertical-context]) div.menu-label:focus-within::after{position:absolute;bottom:calc(var(--border-size-small) * -1);left:0;width:100%;height:var(--border-size-large);background-color:var(--color-primary01);content:""}:host([vertical-context]) .menu-label ::slotted(*){padding:0}.menu-label ::slotted(*){display:inline-flex;width:100%;min-width:fit-content;padding-bottom:2px;margin:0;appearance:none;color:var(--z-menu-label-color, var(--color-default-text));font-family:var(--font-family-sans);font-size:var(--font-size-3);font-weight:inherit;line-height:1.5;white-space:nowrap}.menu-label z-icon{margin-left:calc(var(--space-unit) * 1.5);fill:var(--color-default-icon)}::slotted([data-text]:not([slot]))::after{height:0;content:attr(data-text);content:attr(data-text) / "";font-weight:var(--font-bd);letter-spacing:normal;pointer-events:none;user-select:none;visibility:hidden}@media speech{::slotted([data-text]:not([slot]))::after{display:none}}::slotted([data-text]:not([slot])){display:inline-flex;flex-direction:column}.content{background:var(--color-surface01)}:host(:not([open])) .content{display:none}:host([floating]:not([vertical-context])) .content{position:absolute;top:100%;left:0;width:375px;min-width:100%;max-width:100vw;padding:0 calc(var(--space-unit) * 2);box-shadow:var(--shadow-2)}:host(:not([floating])) .content{width:100%}.header{display:flex;align-items:center;padding:var(--space-unit) 0 calc(var(--space-unit) * 2)}.header ::slotted(img[slot="header"]){width:calc(var(--space-unit) * 11.25);height:auto;object-fit:contain}.header ::slotted([slot="header"]:not(:first-child)){margin:auto 0;margin-left:calc(var(--space-unit) * 2.5);font-size:var(--font-size-3);font-weight:var(--font-sb);line-height:1.5}.items{display:flex;flex-direction:column;align-items:flex-start;background:inherit}.items>::slotted([slot="item"]){width:100%;margin:0;font-size:var(--font-size-3);line-height:1.5}.items>::slotted([slot="item"]:focus:focus-visible){box-shadow:var(--shadow-focus-primary)}.items>::slotted([slot="item"]:not(z-menu-section)){padding:var(--space-unit) 0;border-bottom:var(--border-size-small) solid var(--color-surface03)}:host(:not([vertical-context])) .items>::slotted([slot="item"]:last-child){border-bottom:0}.items>::slotted([slot="item"]:hover),.items>::slotted([slot="item"]:focus:focus-visible),.items>::slotted([slot="item"]:active),.items>::slotted([slot="item"][active]),.items>::slotted([slot="item"][data-active]){border-color:var(--color-primary01);font-weight:var(--font-bd)}`;
 
 const isZMenuSection = (el) => (el === null || el === void 0 ? void 0 : el.tagName) === "Z-MENU-SECTION";
 const ZMenu = class {
@@ -279,14 +278,25 @@ const ZMenu = class {
         registerInstance(this, hostRef);
         this.opened = createEvent(this, "opened", 7);
         this.closed = createEvent(this, "closed", 7);
-        this.items = [];
-        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.
+         */
         this.floating = true;
+        /** The opening state of the menu. */
         this.open = false;
+        /**
+         * Tells the component that it's placed in a vertical context with other `ZMenu`s (usually in the ZAppHeader's offcanvas).
+         * A small border is placed under it as a separator from other elements.
+         */
         this.verticalContext = false;
+        /**
+         * Tabindex value to set on the menu label.
+         * Useful to manage keyboard navigation focus with roving tabindex handled by this component's parent (usually ZAppHeader).
+         */
         this.htmlTabindex = -1;
-        this.hasHeader = undefined;
-        this.hasContent = undefined;
+        this.items = [];
         this.toggle = this.toggle.bind(this);
         this.checkContent = this.checkContent.bind(this);
         this.onLabelSlotChange = this.onLabelSlotChange.bind(this);
@@ -306,12 +316,14 @@ const ZMenu = class {
     }
     get host() { return getElement(this); }
     static get watchers() { return {
-        "open": ["onOpenChanged"],
-        "htmlTabindex": ["setLabelA11yAttrs"]
+        "open": [{
+                "onOpenChanged": 0
+            }],
+        "htmlTabindex": [{
+                "setLabelA11yAttrs": 0
+            }]
     }; }
 };
-ZMenu.style = ZMenuStyle0;
+ZMenu.style = stylesCss();
 
 export { ZMenu as z_menu };
-
-//# sourceMappingURL=z-menu.entry.js.map

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

@@ -1,17 +1,12 @@
-import { r as registerInstance, c as createEvent, h } from './index-c8ceadeb.js';
-import { o as AlertType } from './index-106473a8.js';
+import { r as registerInstance, c as createEvent, h } from './index-ByN2sYu6.js';
+import { o as AlertType } from './index-BKCj6NR2.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-background);border-top:none}:host div.add-alert{background:var(--color-inverse-success)}:host div.remove-alert{background:var(--color-inverse-warning)}: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}";
-const ZMyzCardAlertStyle0 = stylesCss;
+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-background);border-top:none}:host div.add-alert{background:var(--color-inverse-success)}:host div.remove-alert{background:var(--color-inverse-warning)}: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}`;
 
 const ZMyzCardAlert = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.undoAction = createEvent(this, "undoAction", 7);
-        this.iconname = undefined;
-        this.contenttext = undefined;
-        this.actiontext = undefined;
-        this.type = undefined;
     }
     emitUndoAction() {
         this.undoAction.emit({ actionType: this.type });
@@ -52,15 +47,13 @@ const ZMyzCardAlert = class {
         }
     }
     render() {
-        return (h("div", { key: 'cfc5ba625b1f657d2717a2ac5aae0ad070ad4177', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: 'c74a674717764ac11f4e71dcaa034ba950c0a1f8', type: this.getAlertType() }, h("div", { key: 'e289a588eee12751d10964bd9244251d0fef88b4', class: "relative-container" }, h("z-icon", { key: 'afe5a16bd61de53fdb2ac55e722c3d64ecf22bdf', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: 'e7b11a13ba83bcd214b11e0e8bb89ef7976b356c', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: 'cb5e55bbfb7afdbd2a19b7b612b2412b1a35fa80', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
+        return (h("div", { key: '82e172d48b0ba69182d6a52a845d0e416904e572', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: '29082fe82598f41a1907d28ccbbf10df441f8cb1', type: this.getAlertType() }, h("div", { key: '4164795668632ce3d8b63354109a4724b93d9e1a', class: "relative-container" }, h("z-icon", { key: '8fe40b4f9c68e2e1a4e8acc26a95cb0641c917f4', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: '92dbd73988db48a5d4219d45953889787863d9ad', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '32882b967d8dc5971d39d000ffa007c7e6b27f6e', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
                 this.handleActionButtonClick(e);
             }, onKeyPress: (e) => {
                 this.handleSpaceKeyPress(e);
             } }, this.actiontext))))));
     }
 };
-ZMyzCardAlert.style = ZMyzCardAlertStyle0;
+ZMyzCardAlert.style = stylesCss();
 
 export { ZMyzCardAlert as z_myz_card_alert };
-
-//# sourceMappingURL=z-myz-card-alert.entry.js.map

package/dist/esm/z-myz-card-dictionary.entry.js

@@ -1,18 +1,19 @@
-import { r as registerInstance, c as createEvent, h } from './index-c8ceadeb.js';
-import { B as ButtonVariant, d as ButtonSize } from './index-106473a8.js';
+import { r as registerInstance, c as createEvent, h } from './index-ByN2sYu6.js';
+import { d as ButtonSize, B as ButtonVariant } from './index-BKCj6NR2.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;
+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,     -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,     -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 ZMyzCardDictionary = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.cardFlipped = createEvent(this, "cardFlipped", 7);
-        this.name = undefined;
-        this.cover = undefined;
+        /** card is disabled */
         this.disabled = false;
+        /** card is flipped */
         this.flipped = false;
+        /** flip button label */
         this.flipbuttonlabel = "INFO";
+        /** hide info button */
         this.hideinfobtn = false;
     }
     handleFlipCard(e) {
@@ -23,11 +24,9 @@ const ZMyzCardDictionary = class {
         this.cardFlipped.emit(showBack);
     }
     render() {
-        return (h("div", { key: 'e6ec0b5054975547584bbee8759d987b72134d29' }, h("z-myz-card", { key: 'b074508d5e487ab311aab750a9595c65d0bb182f' }, h("z-myz-card-header", { key: 'eace632cf520eac6a109790acb47d08f03f7f88c', titolo: this.name }), h("div", { key: '9fc66378a96351d6251e0d700c3f93046343cb64', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '9a90a3b496bdb8dbbe53820536f41f91aca5fe8f', class: "front" }, h("z-myz-card-body", { key: 'b1a8aee7f1b172fb8070e06b5d929c9c726c870e' }, h("z-myz-card-cover", { key: '8e51755d66e3d0b1081f34cfbbcff860b325ac52', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: '9ebd9fcb0bf970b3ae9250048809a5427d7f7586', 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: '03cc1ad4636d1cf4d36ef062f9f66d07a2960d38', class: "back" }, h("slot", { key: '2b766a05250d41a648cb07e072707a16fa45c484', name: "info" }))), h("slot", { key: '288e7018302b221aa6244b01fc5f4b8140297078' }))));
+        return (h("div", { key: '60de4d7147f69c030e9da4d23888db5c7113a326' }, h("z-myz-card", { key: 'e570e992fe0b53c5eb29eb93656641221774c088' }, h("z-myz-card-header", { key: '96b775f5d46d83937b9c1dec8e4713f480267f06', titolo: this.name }), h("div", { key: 'a312bb379f5a6cbeba6450dd2ad766789f9e8d52', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '76d42b6ff3f61fe9a8fe66bddb99c05c5e490b56', class: "front" }, h("z-myz-card-body", { key: '7009b12a765d3b1fa0080de90d6b4c060721c164' }, h("z-myz-card-cover", { key: '6eee93ed02af8745eaa55392e6dc6846c53bd1fa', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: 'a2af4a8800763389c129df827274ce8449406a6a', 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: 'b2ba007a530273d1bb04fa952af6d61e32b0e3f3', class: "back" }, h("slot", { key: '72287c64ce43c9980ee6a1d0ad139e998e90a51a', name: "info" }))), h("slot", { key: 'ab88bd78b8c88f9fdad8d86df861d2c44eedcb0c' }))));
     }
 };
-ZMyzCardDictionary.style = ZMyzCardDictionaryStyle0;
+ZMyzCardDictionary.style = stylesCss();
 
 export { ZMyzCardDictionary as z_myz_card_dictionary };
-
-//# sourceMappingURL=z-myz-card-dictionary.entry.js.map

package/dist/esm/z-myz-card-footer-sections.entry.js

@@ -1,18 +1,15 @@
-import { r as registerInstance, h } from './index-c8ceadeb.js';
+import { r as registerInstance, h } from './index-ByN2sYu6.js';
 
-const stylesCss = ":host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div>footer{height:128px;box-sizing:border-box;padding:var(--space-unit) calc(var(--space-unit) * 2) 0;border-top:var(--border-size-medium) solid var(--color-surface03);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-size:16px;line-height:24px}:host>div>footer>div.top,:host>div>footer>div.bottom{height:60px}";
-const ZMyzCardFooterSectionsStyle0 = stylesCss;
+const stylesCss = () => `:host{font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div>footer{height:128px;box-sizing:border-box;padding:var(--space-unit) calc(var(--space-unit) * 2) 0;border-top:var(--border-size-medium) solid var(--color-surface03);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-size:16px;line-height:24px}:host>div>footer>div.top,:host>div>footer>div.bottom{height:60px}`;
 
 const ZMyzCardFooterSections = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: '77fe7b02b4f0d995fffd93907c4e1f6fcab7cf42' }, h("footer", { key: 'cdd0a1cb8a5484ae646233d0122604b29f1a6ca4' }, h("div", { key: '91c4312af89e212ab4c74bdc1580b21ae2ef946c', class: "top" }, h("slot", { key: '6a8ac121b135b904892e87c1b2cfa2021e1d0b96', name: "top" })), h("div", { key: '09544cbf8904f0ebfdfeeaf805d203d8a4025d76', class: "bottom" }, h("slot", { key: '7357332d8b3992a67c466aa9f65b5f9a18d5e69a', name: "bottom" })))));
+        return (h("div", { key: '3ba3d9d8cba948577e74b684c439ff9f3add0bba' }, h("footer", { key: 'b05a13bb2b23eea2b1fdf95c8df4ef55b6a60770' }, h("div", { key: '63f78f7fafad29234d9ea2815165148463353c03', class: "top" }, h("slot", { key: 'ab28d17795b7e907cef9377c11e97b38eb6e9fab', name: "top" })), h("div", { key: '233079e440ce253119029d60be436ebd629b06c9', class: "bottom" }, h("slot", { key: 'b0cab09c2fe2bff708996080e9119c79d6f6ebb9', name: "bottom" })))));
     }
 };
-ZMyzCardFooterSections.style = ZMyzCardFooterSectionsStyle0;
+ZMyzCardFooterSections.style = stylesCss();
 
 export { ZMyzCardFooterSections as z_myz_card_footer_sections };
-
-//# sourceMappingURL=z-myz-card-footer-sections.entry.js.map

package/dist/esm/z-myz-card-footer.entry.js

@@ -1,18 +1,14 @@
-import { r as registerInstance, h, g as getElement } from './index-c8ceadeb.js';
-import { L as LicenseType } from './index-106473a8.js';
+import { r as registerInstance, h, d as getElement } from './index-ByN2sYu6.js';
+import { L as LicenseType } from './index-BKCj6NR2.js';
 
-const stylesCss = "footer{position:relative;z-index:5;top:0;width:auto;height:calc(var(--space-unit) * 6);padding:0;border-top:var(--border-size-medium) solid var(--color-surface03);margin:0;background-color:var(--color-surface01);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-family:var(--font-family-sans);font-weight:var(--font-rg);transition:height 500ms ease-in-out,\n    top 500ms ease-in-out}footer.real,footer.trial,footer.temp{border-top:var(--border-size-medium) solid var(--blue100)}footer .bold{font-family:var(--font-family-sans);font-weight:var(--font-sb)}footer>p{overflow:hidden;height:40px;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);margin:0;background-color:var(--color-surface01);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);line-height:22px;transition:all 200ms linear}footer.isopen>p{background-color:var(--gray200);font-size:14px;font-weight:var(--font-sb);transition:all 200ms linear}footer.isopen.real>p,footer.isopen.trial>p,footer.isopen.temp>p{background-color:var(--blue100)}footer .visible{display:block}footer .hidden{display:none}footer>div.content{overflow:hidden;height:60px}footer>div.content>div:not(.slot-handler){padding:var(--space-unit) calc(var(--space-unit) * 2)}footer>div.content>div>p{overflow:hidden;height:20px;padding:0;margin:0;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}footer>div.content>div>p.year-isbn{display:flex;flex-direction:row;justify-content:space-between;padding-top:var(--space-unit)}footer>div.content>div>p.year-isbn>span.isbn{overflow:hidden;text-overflow:ellipsis}footer.isopen>div.content>div:not(.slot-handler){height:68px}footer.isopen>div.content>div>p.authors{height:40px;text-overflow:initial;white-space:initial}footer.isopen>div.content>div>p.year-isbn{height:50px;flex-direction:column;padding-left:0}footer.isopen>div.content>div>p.year-isbn>span.isbn{display:inline-grid;padding-left:0}footer.isopen{top:-212px;height:295px;transition:height 500ms ease-in-out,\n    top 500ms ease-in-out}footer.isopen.custom-content{top:-292px}footer.isopen>div.content{height:280px;transition:height 500ms ease-in-out,\n    top 500ms ease-in-out}footer.isopen.custom-content>div.content{height:230px}.toggle{position:absolute;z-index:10;top:-24px;left:16px}.faded{opacity:0.3;pointer-events:none}footer>p.custom-content,footer .content.custom-content{display:none}footer.isopen>p.custom-content,footer.isopen .content.custom-content{display:block}div.wrapper{position:relative;height:100%}div.wrapper ::slotted([slot=\"content\"]){position:absolute;z-index:10;top:calc(var(--space-unit) * 2);display:block;width:100%;height:112px;box-sizing:border-box;padding:0 calc(var(--space-unit) * 2);border-top:var(--border-size-medium) solid transparent;background:var(--color-white)}div.wrapper.isopen ::slotted([slot=\"content\"]){top:0;bottom:0;height:128px;padding:calc(var(--space-unit) * 2);border-color:var(--blue100)}";
-const ZMyzCardFooterStyle0 = stylesCss;
+const stylesCss = () => `footer{position:relative;z-index:5;top:0;width:auto;height:calc(var(--space-unit) * 6);padding:0;border-top:var(--border-size-medium) solid var(--color-surface03);margin:0;background-color:var(--color-surface01);border-radius:0 0 var(--border-radius) var(--border-radius);color:var(--color-surface05);font-family:var(--font-family-sans);font-weight:var(--font-rg);transition:height 500ms ease-in-out,     top 500ms ease-in-out}footer.real,footer.trial,footer.temp{border-top:var(--border-size-medium) solid var(--blue100)}footer .bold{font-family:var(--font-family-sans);font-weight:var(--font-sb)}footer>p{overflow:hidden;height:40px;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 2) var(--space-unit) calc(var(--space-unit) * 2);margin:0;background-color:var(--color-surface01);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);line-height:22px;transition:all 200ms linear}footer.isopen>p{background-color:var(--gray200);font-size:14px;font-weight:var(--font-sb);transition:all 200ms linear}footer.isopen.real>p,footer.isopen.trial>p,footer.isopen.temp>p{background-color:var(--blue100)}footer .visible{display:block}footer .hidden{display:none}footer>div.content{overflow:hidden;height:60px}footer>div.content>div:not(.slot-handler){padding:var(--space-unit) calc(var(--space-unit) * 2)}footer>div.content>div>p{overflow:hidden;height:20px;padding:0;margin:0;font-size:14px;line-height:20px;text-overflow:ellipsis;white-space:nowrap}footer>div.content>div>p.year-isbn{display:flex;flex-direction:row;justify-content:space-between;padding-top:var(--space-unit)}footer>div.content>div>p.year-isbn>span.isbn{overflow:hidden;text-overflow:ellipsis}footer.isopen>div.content>div:not(.slot-handler){height:68px}footer.isopen>div.content>div>p.authors{height:40px;text-overflow:initial;white-space:initial}footer.isopen>div.content>div>p.year-isbn{height:50px;flex-direction:column;padding-left:0}footer.isopen>div.content>div>p.year-isbn>span.isbn{display:inline-grid;padding-left:0}footer.isopen{top:-212px;height:295px;transition:height 500ms ease-in-out,     top 500ms ease-in-out}footer.isopen.custom-content{top:-292px}footer.isopen>div.content{height:280px;transition:height 500ms ease-in-out,     top 500ms ease-in-out}footer.isopen.custom-content>div.content{height:230px}.toggle{position:absolute;z-index:10;top:-24px;left:16px}.faded{opacity:0.3;pointer-events:none}footer>p.custom-content,footer .content.custom-content{display:none}footer.isopen>p.custom-content,footer.isopen .content.custom-content{display:block}div.wrapper{position:relative;height:100%}div.wrapper ::slotted([slot="content"]){position:absolute;z-index:10;top:calc(var(--space-unit) * 2);display:block;width:100%;height:112px;box-sizing:border-box;padding:0 calc(var(--space-unit) * 2);border-top:var(--border-size-medium) solid transparent;background:var(--color-white)}div.wrapper.isopen ::slotted([slot="content"]){top:0;bottom:0;height:128px;padding:calc(var(--space-unit) * 2);border-color:var(--blue100)}`;
 
 const ZMyzCardFooter = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.titolo = undefined;
-        this.autori = undefined;
-        this.isbn = undefined;
-        this.faded = undefined;
-        this.cardtype = undefined;
+        /** footer opened by default (optional) */
         this.opened = false;
+        /** display footer custom slotted content */
         this.customContent = false;
         this.isOpen = false;
         this.allowTooltipAuthors = false;
@@ -60,12 +56,10 @@ const ZMyzCardFooter = class {
         return this.host.querySelector("[slot=list] > li a");
     }
     render() {
-        return (h("div", { key: '6e5881056e1db48d540e8ef21116bee2c196b8c4', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: '243b4a819cba9325d9425d63a23fcee9f9876b3d', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: 'cfc887864e6bf0c7fc8d08be05f0005a38aa869d', class: "toggle" }, h("slot", { key: 'a9e65157596b4a26eb19d5eee5a7b1a57d1feea4', name: "toggle" })), this.titolo && h("p", { key: '15b6bd8c19394d7bef24eb4e09720c0bb0a1685c', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: 'ebc158163ecd3b334daec7edb050b7e7b9f7df47', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '60590d4b3f2bcb949c21cde6a6d6a8a837a089a3' }, h("p", { key: '9b2f3b97f5de7f0760d623fc3761920aa3b1c845', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '807a82ffe180cec55e8d32124be8ca46eb572270', title: this.getTitleAuthors() }, h("span", { key: 'c9c790fcd14571bd4d15d991496b49392097990f', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'ca97678f9bc18bea8777c1a2ae994a954cab4cf3', class: "year-isbn" }, h("span", { key: '232aab4aaf39be78ace0ece41ea4060a4e355f9a', class: "isbn" }, h("span", { key: '301da712b177444f57a889ed25112a3837a65d2a' }, h("span", { key: 'e825aa9877d17cc64db355a0ddefc0d36195eab9', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '91db300900421801d17073597173773e6df7f56d', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: '88c704a8e47124becd3659dc9b2e23be2165cee3', name: "list" })))), this.customContent && h("slot", { key: '2f73c782577a5b7394a24af188229c6c6a750612', name: "content" })));
+        return (h("div", { key: 'e8e0fa454aaf446f0128c66e33432b8a2ec664dd', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: 'c0c503890a26ae0a8708e55c098b5f3d6dac9877', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: 'a478f1d0dd2ce746401c1e74317bfe8bebf02c76', class: "toggle" }, h("slot", { key: 'da8aa9d68ccc2b492cf78a7ffedcb52ff02a6d39', name: "toggle" })), this.titolo && h("p", { key: '12bf208eea85a0b7957cff26abdfd481dc96b307', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '82a6539f1b74d306ebd5cffa25bf9971254fe59a', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '4d133db1d613f3540a9a4bf9fda08b8c607e78d9' }, h("p", { key: '9abcce1c8ab5b7acc18ae7e8501eec7a6f7045a2', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '5949016c2d0ee207f3127ebc21f8ab7af8ef6eda', title: this.getTitleAuthors() }, h("span", { key: 'e8fea21b88f34c80725bd9785cd6d8e3bff69f66', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: '95667b4bc9381b1c244f763419c552a0939b230a', class: "year-isbn" }, h("span", { key: 'c3a7bc333bf465ba558d83785909ab415b312581', class: "isbn" }, h("span", { key: 'e207fb93fa448fb76bb83437bbcd0476e03149c5' }, h("span", { key: '14f82e7b58f8844065882f4cfe2de710bdcb1410', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '524a25a8d5153ee54de233eab15b1e520e4a68c2', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: 'b2d153c3573ee20468b619745dab677a9bc4df69', name: "list" })))), this.customContent && h("slot", { key: 'ae06cde6d964520381124896788fbf0f96f4083a', name: "content" })));
     }
     get host() { return getElement(this); }
 };
-ZMyzCardFooter.style = ZMyzCardFooterStyle0;
+ZMyzCardFooter.style = stylesCss();
 
 export { ZMyzCardFooter as z_myz_card_footer };
-
-//# sourceMappingURL=z-myz-card-footer.entry.js.map

package/dist/esm/z-myz-card-icon.entry.js

@@ -1,21 +1,19 @@
-import { r as registerInstance, h } from './index-c8ceadeb.js';
+import { r as registerInstance, h } from './index-ByN2sYu6.js';
 
-const stylesCss = "button{display:flex;width:42px;width:calc(var(--space-unit) * 6);height:calc(var(--space-unit) * 5);height:calc(var(--space-unit) * 6);align-items:center;justify-content:center;padding:0;border:none;border-left:var(--border-size-medium) solid var(--color-surface03);margin:0;background:none;border-radius:0 var(--border-radius) 0 0;color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);outline:none}button:active,button:focus{color:var(--blue700);fill:var(--blue700)}button>span{display:flex;width:28px;height:28px;align-items:center;justify-content:center;border:0;border-radius:var(--border-radius)}button:hover>span{background:var(--color-primary03)}button:focus>span{background:var(--color-surface01);border-radius:var(--border-radius);box-shadow:var(--shadow-focus-primary)}button:active>span{background:var(--color-surface01);border-radius:var(--border-radius);box-shadow:var(--shadow-2)}button:disabled{cursor:not-allowed}button:disabled>span{background:none;box-shadow:var(--shadow-0);pointer-events:none}button:disabled>span>z-icon{fill:var(--color-surface03)}button::-moz-focus-inner{border:0}";
-const ZMyzCardIconStyle0 = stylesCss;
+const stylesCss = () => `button{display:flex;width:42px;width:calc(var(--space-unit) * 6);height:calc(var(--space-unit) * 5);height:calc(var(--space-unit) * 6);align-items:center;justify-content:center;padding:0;border:none;border-left:var(--border-size-medium) solid var(--color-surface03);margin:0;background:none;border-radius:0 var(--border-radius) 0 0;color:var(--color-primary01);cursor:pointer;fill:var(--color-primary01);outline:none}button:active,button:focus{color:var(--blue700);fill:var(--blue700)}button>span{display:flex;width:28px;height:28px;align-items:center;justify-content:center;border:0;border-radius:var(--border-radius)}button:hover>span{background:var(--color-primary03)}button:focus>span{background:var(--color-surface01);border-radius:var(--border-radius);box-shadow:var(--shadow-focus-primary)}button:active>span{background:var(--color-surface01);border-radius:var(--border-radius);box-shadow:var(--shadow-2)}button:disabled{cursor:not-allowed}button:disabled>span{background:none;box-shadow:var(--shadow-0);pointer-events:none}button:disabled>span>z-icon{fill:var(--color-surface03)}button::-moz-focus-inner{border:0}`;
 
 const ZMyzCardIcon = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.icon = undefined;
+        /** disabled status flag */
         this.isdisabled = false;
+        /** description of the icon*/
         this.ariaLabel = "";
     }
     render() {
-        return (h("button", { key: '6eeee51373c90e15a165b2511675c1df63974289', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: '197d99ffec190c40dd72ab22176ac502cf410951' }, h("z-icon", { key: '9b5f1fae74c6cd7ee9a8d7f66e90bee09e5fa7e9', name: this.icon, width: 16, height: 16 }))));
+        return (h("button", { key: '8a82157a9baa9383b9617bb5f2579ecbfab25d7a', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: '4b6df20cba84e9d9a0aab92d49cff430fd498980' }, h("z-icon", { key: '07fe7425dc9a9d95a6b87bc79bcb1d0c927ca859', name: this.icon, width: 16, height: 16 }))));
     }
 };
-ZMyzCardIcon.style = ZMyzCardIconStyle0;
+ZMyzCardIcon.style = stylesCss();
 
 export { ZMyzCardIcon as z_myz_card_icon };
-
-//# sourceMappingURL=z-myz-card-icon.entry.js.map

package/dist/esm/z-myz-card-info.entry.js

@@ -1,10 +1,9 @@
-import { r as registerInstance, c as createEvent, h } from './index-c8ceadeb.js';
-import { P as PopoverPosition } from './index-106473a8.js';
-import { d as handleKeyboardSubmit } from './utils-1b64bcd9.js';
-import './breakpoints-d148bfde.js';
+import { r as registerInstance, c as createEvent, h } from './index-ByN2sYu6.js';
+import { P as PopoverPosition } from './index-BKCj6NR2.js';
+import { h as handleKeyboardSubmit } from './utils-0PByxJyN.js';
+import './breakpoints-Q-tWjk7P.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-primary01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-hover-warning);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;
+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-primary01);font-size:12px;font-weight:600}:host>div>div.content-wrapper>section>span.license-heading>span.expiring{color:var(--color-hover-warning);font-size:12px;font-weight:600}:host>div>div.content-wrapper>z-popover{position:absolute;top:0;left:calc(var(--space-unit) * 4)}`;
 
 const ZMyzCardInfo = class {
     emitFlipCard(showBack = false) {
@@ -13,7 +12,7 @@ const ZMyzCardInfo = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
         this.flipCard = createEvent(this, "flipCard", 7);
-        this.data = undefined;
+        /** tabindex link attribute (optional) */
         this.htmltabindex = 0;
         this.hiddenContent = false;
         this.tooltip = false;
@@ -118,11 +117,9 @@ const ZMyzCardInfo = class {
         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: 'e6ef5ad3c71c2b049d77bf7b58b4eed49aff7f07' }, this.renderCloseIcon(), h("div", { key: '3709fc8d09e49fa1e56c89a9fd3453c677b0837b', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '06f65296b31493f7e948f7af4de260443bf45c4a', class: "cta-wrapper" }, h("slot", { key: '1cd54dc4feef61416039fbf9d43c6f9a6ed0be25' }))));
+        return (h("div", { key: '91c9865eabec4c2dfc4f0bdb3883517944b5dc07' }, this.renderCloseIcon(), h("div", { key: 'd6b6744fd8a9b26344fe1e502bd774bafca7de5c', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '45453dc08188aa77542934ffc12d74f64efd10b4', class: "cta-wrapper" }, h("slot", { key: '978e72fdf752608e8ac8b0bf4895d66a9eb208c1' }))));
     }
 };
-ZMyzCardInfo.style = ZMyzCardInfoStyle0;
+ZMyzCardInfo.style = stylesCss();
 
 export { ZMyzCardInfo as z_myz_card_info };
-
-//# sourceMappingURL=z-myz-card-info.entry.js.map

package/dist/esm/z-myz-card-list.entry.js

@@ -1,12 +1,10 @@
-import { r as registerInstance, h } from './index-c8ceadeb.js';
+import { r as registerInstance, h } from './index-ByN2sYu6.js';
 
-const stylesCss = "*:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:\"•\"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}";
-const ZMyzCardListStyle0 = stylesCss;
+const stylesCss = () => `*:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:"•"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}`;
 
 const ZMyzCardList = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.listdata = undefined;
         this.renderList = this.renderList.bind(this);
     }
     handleSpaceKeyPress(e, url) {
@@ -28,11 +26,9 @@ const ZMyzCardList = class {
         });
     }
     render() {
-        return h("ul", { key: '608a46eb635be05ab1bb225bb28354f0a5e4ca44' }, this.renderList(JSON.parse(this.listdata)));
+        return h("ul", { key: '50f8aa7d25f8d601135324dac7b57a2ea0c33ab2' }, this.renderList(JSON.parse(this.listdata)));
     }
 };
-ZMyzCardList.style = ZMyzCardListStyle0;
+ZMyzCardList.style = stylesCss();
 
 export { ZMyzCardList as z_myz_card_list };
-
-//# sourceMappingURL=z-myz-card-list.entry.js.map

package/dist/esm/z-myz-card_4.entry.js

@@ -1,15 +1,14 @@
-import { r as registerInstance, h } from './index-c8ceadeb.js';
-import { L as LicenseType } from './index-106473a8.js';
+import { r as registerInstance, h } from './index-ByN2sYu6.js';
+import { L as LicenseType } from './index-BKCj6NR2.js';
 
-const stylesCss$3 = ":host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--blue100)}div.faded{border:var(--border-size-medium) solid var(--color-background)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";
-const ZMyzCardStyle0 = stylesCss$3;
+const stylesCss$3 = () => `:host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--blue100)}div.faded{border:var(--border-size-medium) solid var(--color-background)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}`;
 
 const ZMyzCardComponent = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.faded = undefined;
-        this.cardtype = undefined;
+        /** pressed status */
         this.ispressed = false;
+        /** highlighted status */
         this.ishighlighted = false;
     }
     retrieveClass() {
@@ -35,53 +34,43 @@ const ZMyzCardComponent = class {
         return elemClasses;
     }
     render() {
-        return (h("div", { key: 'fe9682514ff12467eff3a0f844690aaad51ac1e5', class: this.retrieveClass(), tabindex: "0" }, h("slot", { key: 'b38b157360d99c9f0fd6009343547877c51fd59a' })));
+        return (h("div", { key: '11ac2aca15e484cda4eee931bbaefa81eec16fbb', class: this.retrieveClass(), tabindex: "0" }, h("slot", { key: '14461bb8ccc78eae10ab81c755085d6cb8d484f6' })));
     }
 };
-ZMyzCardComponent.style = ZMyzCardStyle0;
+ZMyzCardComponent.style = stylesCss$3();
 
-const stylesCss$2 = ":host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}";
-const ZMyzCardBodyStyle0 = stylesCss$2;
+const stylesCss$2 = () => `:host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}`;
 
 const ZMyzCardBody = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
     }
     render() {
-        return (h("div", { key: 'ce8e2f29bbbe43340a86049182f38586e14b8e47' }, h("slot", { key: '2b3c1274ab1df4995039e7dfc82a06e10ac66be9', name: "alert" }), h("slot", { key: 'c92240268966ca58f7844e6a43693582152b59f5', name: "cover" })));
+        return (h("div", { key: '3bfa929950fa7d4acb0a7a7f8857cf1d94a02cbc' }, h("slot", { key: '871cdb03423b9d52131023290648378e2ad6b439', name: "alert" }), h("slot", { key: 'c48ec3615b98643b44b6d592143412d9fd2c4304', name: "cover" })));
     }
 };
-ZMyzCardBody.style = ZMyzCardBodyStyle0;
+ZMyzCardBody.style = stylesCss$2();
 
-const stylesCss$1 = "img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}";
-const ZMyzCardCoverStyle0 = stylesCss$1;
+const stylesCss$1 = () => `img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}`;
 
 const ZMyzCardCover = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.img = undefined;
-        this.titolo = undefined;
-        this.faded = undefined;
-        this.defaultimg = undefined;
     }
     hadleOnImageError() {
         this.img = this.defaultimg;
     }
     render() {
-        return (h("img", { key: '9474ee5c6352f5f253b4d976ff88a4a9079ad176', class: this.faded && "faded", onError: this.hadleOnImageError.bind(this), alt: this.titolo, src: this.img }));
+        return (h("img", { key: '5d148d2ef8ab0f6075a368593da59a860ce575be', class: this.faded && "faded", onError: this.hadleOnImageError.bind(this), alt: this.titolo, src: this.img }));
     }
 };
-ZMyzCardCover.style = ZMyzCardCoverStyle0;
+ZMyzCardCover.style = stylesCss$1();
 
-const stylesCss = "header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name=\"aria-heading\"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--blue100);background-color:var(--color-primary03)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-background)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--blue100);border-right:var(--border-size-medium) solid var(--blue100);border-left:var(--border-size-medium) solid var(--blue100)}";
-const ZMyzCardHeaderStyle0 = stylesCss;
+const stylesCss = () => `header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--blue100);background-color:var(--color-primary03)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-background)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--blue100);border-right:var(--border-size-medium) solid var(--blue100);border-left:var(--border-size-medium) solid var(--blue100)}`;
 
 const ZMyzCardHeader = class {
     constructor(hostRef) {
         registerInstance(this, hostRef);
-        this.titolo = undefined;
-        this.faded = undefined;
-        this.cardtype = undefined;
         this.allowTooltip = false;
     }
     getTitle() {
@@ -104,11 +93,9 @@ const ZMyzCardHeader = class {
         };
     }
     render() {
-        return (h("header", { key: 'f57af285c3ded847594f226cd57e29f47e96db29', class: this.retrieveClass() }, h("slot", { key: 'd4404802765f567dd4be757becef12bde5a0762c', name: "aria-heading" }), h("span", { key: '5906cbdb67aea281d0ccabe43711c7d2e34c0667', class: "card-title", ref: (el) => (this.ellipsis = el), title: this.getTitle() }, this.titolo), h("slot", { key: '7f4dd40eb421872623556751133a9138a4381a98', name: "icon" })));
+        return (h("header", { key: '8e8ab719ee2980ea4de54b3fcb217aacfd578c20', class: this.retrieveClass() }, h("slot", { key: '9c504020c8d7535a8ef719b2e9b64a1c9cd6b8bd', name: "aria-heading" }), h("span", { key: 'bf58a2840947b828a8a3cc73b5164c0f05fb9b57', class: "card-title", ref: (el) => (this.ellipsis = el), title: this.getTitle() }, this.titolo), h("slot", { key: '7ba079e3389b6b5908e2296a397a28980b901e28', name: "icon" })));
     }
 };
-ZMyzCardHeader.style = ZMyzCardHeaderStyle0;
+ZMyzCardHeader.style = stylesCss();
 
 export { ZMyzCardComponent as z_myz_card, ZMyzCardBody as z_myz_card_body, ZMyzCardCover as z_myz_card_cover, ZMyzCardHeader as z_myz_card_header };
-
-//# sourceMappingURL=z-myz-card_4.entry.js.map

package/dist/esm/z-myz-list-item.entry.js

@@ -1,10 +1,9 @@
-import { r as registerInstance, c as createEvent, h } from './index-c8ceadeb.js';
-import { d as handleKeyboardSubmit } from './utils-1b64bcd9.js';
-import './index-106473a8.js';
-import './breakpoints-d148bfde.js';
+import { r as registerInstance, c as createEvent, h } from './index-ByN2sYu6.js';
+import { h as handleKeyboardSubmit } from './utils-0PByxJyN.js';
+import './index-BKCj6NR2.js';
+import './breakpoints-Q-tWjk7P.js';
 
-const stylesCss = ":host li{all:unset;all:reset;width:100%;line-height:14px;list-style-type:none}:host li>span{display:flex;padding:calc(var(--space-unit) * 2) 0;color:var(--color-default-text);fill:var(--color-default-icon);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host(.small) li>span{padding:calc(var(--space-unit) * 1.5) 0;font-size:var(--font-size-2)}:host(.x-small) li>span{padding:var(--space-unit) 0;font-size:var(--font-size-2)}:host(.small) li>span>z-icon,:host(.x-small) li>span>z-icon{--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:calc(var(--space-unit) * 0.5);padding:0}:host li>span.border{border-bottom:2px solid var(--color-surface03)}:host li span:hover,a:hover{color:var(--color-primary01);fill:var(--color-primary01)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-repeat:no-repeat;background-size:contain;color:var(--color-primary01);fill:var(--color-primary01)}";
-const ZMyzListItemStyle0 = stylesCss;
+const stylesCss = () => `:host li{all:unset;all:reset;width:100%;line-height:14px;list-style-type:none}:host li>span{display:flex;padding:calc(var(--space-unit) * 2) 0;color:var(--color-default-text);fill:var(--color-default-icon);font-family:var(--font-family-sans);font-size:16px;font-weight:var(--font-rg);letter-spacing:0.23px;line-height:14px}:host(.small) li>span{padding:calc(var(--space-unit) * 1.5) 0;font-size:var(--font-size-2)}:host(.x-small) li>span{padding:var(--space-unit) 0;font-size:var(--font-size-2)}:host(.small) li>span>z-icon,:host(.x-small) li>span>z-icon{--z-icon-width:16px;--z-icon-height:16px;--z-icon-right-margin:calc(var(--space-unit) * 0.5);padding:0}:host li>span.border{border-bottom:2px solid var(--color-surface03)}:host li span:hover,a:hover{color:var(--color-primary01);fill:var(--color-primary01)}a,a:visited,a:active{color:inherit;fill:inherit;text-decoration:none}:host li span z-icon{width:calc(var(--space-unit) * 2);height:calc(var(--space-unit) * 2);padding:0 calc(var(--space-unit) * 1.5) 0 0;background-repeat:no-repeat;background-size:contain;color:var(--color-primary01);fill:var(--color-primary01)}`;
 
 const ZMyzListItem = class {
     emitZListItemLinkClick(e, linkId) {
@@ -17,23 +16,18 @@ const ZMyzListItem = class {
         registerInstance(this, hostRef);
         this.zListItemLinkClick = createEvent(this, "zListItemLinkClick", 7);
         this.zListItemClick = createEvent(this, "zListItemClick", 7);
-        this.text = undefined;
-        this.link = undefined;
+        /** link target (optional) */
         this.linktarget = "_self";
-        this.icon = undefined;
-        this.listitemid = undefined;
-        this.action = undefined;
+        /** underlined style flag */
         this.underlined = true;
         this.emitZListItemLinkClick = this.emitZListItemLinkClick.bind(this);
         this.emitZListItemClick = this.emitZListItemClick.bind(this);
     }
     render() {
         const linkId = this.listitemid ? `link_${this.listitemid}` : "";
-        return (h("li", { key: 'b26b8dbeaf1a8f5beb9ce7c799bafc5dacc6d471', role: "button", id: this.listitemid, "data-action": this.action, onClick: (e) => this.emitZListItemClick(e, this.listitemid), onKeyPress: (ev) => handleKeyboardSubmit(ev, this.emitZListItemClick, this.listitemid) }, h("span", { key: 'bd0de19c4f484bd249358e39df3ca4296e9eb360', class: this.underlined && "border" }, this.icon && h("z-icon", { key: '47edd1a371c2c4cbb34d07fb7120d6f96e51669e', name: this.icon }), this.link ? (h("a", { href: this.link ? this.link : null, target: this.linktarget, id: linkId, onClick: (e) => this.emitZListItemLinkClick(e, linkId), onKeyPress: (ev) => handleKeyboardSubmit(ev, this.emitZListItemLinkClick, linkId), role: this.link ? "link" : "button", tabindex: "0" }, this.text)) : (h("span", { innerHTML: this.text })), h("slot", { key: '93a47ea9cf8cf341d9cacedbd13b34d8877d60fe' }))));
+        return (h("li", { key: 'b6ba862acc48ceb87ae354709401d3a3f1edded0', role: "button", id: this.listitemid, "data-action": this.action, onClick: (e) => this.emitZListItemClick(e, this.listitemid), onKeyPress: (ev) => handleKeyboardSubmit(ev, this.emitZListItemClick, this.listitemid) }, h("span", { key: 'e9d3ae7e318e02f241e3fcbdd512ee16df29732e', class: this.underlined && "border" }, this.icon && h("z-icon", { key: 'cd4898bfd2cec5d9455c16b3f7b2fb0d972475a4', name: this.icon }), this.link ? (h("a", { href: this.link ? this.link : null, target: this.linktarget, id: linkId, onClick: (e) => this.emitZListItemLinkClick(e, linkId), onKeyPress: (ev) => handleKeyboardSubmit(ev, this.emitZListItemLinkClick, linkId), role: this.link ? "link" : "button", tabindex: "0" }, this.text)) : (h("span", { innerHTML: this.text })), h("slot", { key: '48bb5cc539f8eda84f21219103e17acd0d226c99' }))));
     }
 };
-ZMyzListItem.style = ZMyzListItemStyle0;
+ZMyzListItem.style = stylesCss();
 
 export { ZMyzListItem as z_myz_list_item };
-
-//# sourceMappingURL=z-myz-list-item.entry.js.map