npm - @zanichelli/albe-web-components - Versions diffs - 16.3.0 → 16.3.1 - Mend

@zanichelli/albe-web-components 16.3.0 → 16.3.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (1042) hide show

package/dist/components/z-menu.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"z-menu.js","mappings":"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","names":["ZMenu"],"sources":["src/components/z-menu/styles.css?tag=z-menu&encapsulation=shadow","src/components/z-menu/index.tsx"],"sourcesContent":[":host,\n::slotted(),\n {\n box-sizing: border-box;\n outline: none;\n}\n\n:host {\n position: relative;\n display: inline-flex;\n flex-direction: column;\n flex-shrink: 0;\n\n --z-menu-label-color: var(--color-default-text);\n}\n\n::slotted(a) {\n text-decoration: none;\n}\n\n::slotted() {\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n.menu-label {\n width: 100%;\n padding: 0;\n border: 0;\n margin: 0;\n background: transparent;\n border-radius: 0;\n color: inherit;\n outline: none;\n text-align: left;\n}\n\n.menu-wrapper {\n display: flex;\n align-items: center;\n}\n\n.menu-wrapper:focus-visible,\n.menu-label-content:focus-visible,\nbutton:focus-visible {\n outline: none;\n}\n\nbutton.menu-label {\n cursor: pointer;\n}\n\n.menu-label:focus-within {\n z-index: 1;\n box-shadow: var(--shadow-focus-primary);\n}\n\n.menu-label .menu-label-content {\n position: relative;\n display: flex;\n height: 30px;\n align-items: center;\n}\n\n:host(:is([active], [open])) .menu-label-content,\n.menu-label:focus-within .menu-label-content {\n color: var(--color-primary01);\n font-weight: var(--font-bd);\n}\n\n:host(:is([active], [open])) .menu-label-content ::slotted(),\n.menu-label:focus-within .menu-label-content ::slotted(),\n.menu-label:focus-within .menu-label-content z-icon {\n color: var(--color-primary01);\n letter-spacing: normal;\n}\n\n:host .menu-label .menu-label-content ::slotted(:not([slot]):focus:focus-visible) {\n box-shadow: none !important;\n}\n\n/* border /\n:host(:is([active], [open], [vertical-context])) .menu-label .menu-label-content::after,\n.menu-label .menu-label-content:hover::after,\n.menu-label:focus-within .menu-label-content::after {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n content: \"\";\n pointer-events: none;\n}\n\n:host([vertical-context]) .menu-label-content::after {\n height: var(--border-size-small);\n background-color: var(--color-surface03);\n}\n\n:host(:is([active], [open])) .menu-label .menu-label-content::after,\n.menu-label .menu-label-content:hover::after,\n.menu-label:focus-within .menu-label-content::after {\n height: var(--border-size-large);\n background-color: var(--color-secondary01);\n}\n\n/ Prevents layout shifts on font-weight changes.\nThe trick is to put an hidden copy of the text already set to bold,\nso the needed space is correctly calculated before any hover/active state changes the\nfont-weight of the real text.\nThe hidden text has an height of 0px so it can expand the width without changing the height\nwhen placed below the real text using `flex-direction: column`. /\n::slotted([data-text])::after {\n height: 0;\n content: attr(data-text);\n content: attr(data-text) / \"\";\n font-weight: var(--font-bd);\n letter-spacing: normal;\n pointer-events: none;\n user-select: none;\n visibility: hidden;\n}\n\n@media speech {\n ::slotted([data-text])::after {\n display: none;\n }\n}\n\n::slotted([data-text]) {\n display: inline-flex;\n flex-direction: column;\n}\n\n.menu-label .menu-label-content ::slotted() {\n display: inline-flex;\n width: 100%;\n min-width: fit-content;\n margin: 0;\n appearance: none;\n color: var(--z-menu-label-color);\n font-family: var(--font-family-sans);\n font-size: var(--font-size-3);\n font-weight: inherit;\n outline: none;\n}\n\n.menu-label .menu-label-content ::slotted(),\n.menu-label .menu-label-content z-icon {\n padding: var(--space-unit) 0;\n}\n\n.menu-label .menu-label-content z-icon {\n margin-left: calc(var(--space-unit) 1.5);\n fill: currentcolor;\n}\n\n.content {\n background: var(--color-surface01);\n}\n\n:host(:not([open])) .content {\n display: none;\n}\n\n:host([floating]) .content {\n position: absolute;\n top: 100%;\n left: 0;\n width: 375px;\n min-width: 100%;\n max-width: 100vw;\n padding: var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2);\n box-shadow: var(--shadow-2);\n}\n\n:host(:not([floating])) .content {\n width: 100%;\n}\n\n.header {\n display: flex;\n align-items: center;\n padding: var(--space-unit) 0 calc(var(--space-unit) * 2);\n}\n\n.header ::slotted(img[slot=\"header\"]) {\n width: calc(var(--space-unit) * 11.25);\n height: auto;\n object-fit: contain;\n}\n\n.header ::slotted([slot=\"header\"]:not(:first-child)) {\n margin: auto 0;\n margin-left: calc(var(--space-unit) * 2.5);\n font-size: var(--font-size-3);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n.items {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n background: inherit;\n}\n\n.items > ::slotted([slot=\"item\"]) {\n width: 100%;\n margin: 0;\n font-size: var(--font-size-3);\n line-height: 1.25;\n outline: none;\n}\n\n.items > ::slotted([slot=\"item\"]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n.items > ::slotted([slot=\"item\"]:not(z-menu-section)) {\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 0.5);\n border-bottom: var(--border-size-small) solid var(--color-surface05);\n}\n\n.items > ::slotted([slot=\"item\"]:hover),\n.items > ::slotted([slot=\"item\"]:focus:focus-visible),\n.items > ::slotted([slot=\"item\"]:active) {\n border-color: var(--color-secondary01);\n font-weight: var(--font-bd);\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode} from \"../../beans\";\n\n/*\n @slot - Menu label\n * @slot header - Header to display as the first entry of the open menu.\n * @slot item - Single entry of the section. Can be slotted multiple times to insert items onto the menu. Use `z-menu-section` for submenus.\n * @cssprop --z-menu-label-color - Color of the label's text.\n /\n@Component({\n tag: \"z-menu\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMenu {\n @Element() hostElement: HTMLZMenuElement;\n\n /* Flag to set the active status of the menu. /\n @Prop({reflect: true})\n active?: boolean;\n\n /\n Flag to set the display mode of the list.\n * If true, the list will be absolutely positioned under the menu label,\n * stacked beneath it otherwise.\n /\n @Prop({reflect: true})\n floating? = true;\n\n /* The opening state of the menu. /\n @Prop({mutable: true, reflect: true})\n open = false;\n\n /\n Tells the component that it's placed in a vertical context with other `ZMenu`s (e.g. in the ZAppHeader's offcanvas).\n * A small border is placed under it as a separator from other elements.\n /\n @Prop({reflect: true})\n verticalContext = false;\n\n @State()\n hasHeader: boolean;\n\n @State()\n hasContent: boolean;\n\n private content: HTMLElement;\n\n /* Animation frame request id. /\n private raf: number;\n\n /* The menu has been opened. /\n @Event()\n opened: EventEmitter;\n\n /* The menu has been closed. /\n @Event()\n closed: EventEmitter;\n\n private currentIndex = -1;\n\n private currentCanvasOpenStatus = false;\n\n private firstElMenu: HTMLMenuElement;\n\n private lastElMenu: HTMLMenuElement;\n\n private toggle(): void {\n if (!this.hasContent) {\n return;\n }\n\n this.open = !this.open;\n this.open ? this.opened.emit() : this.closed.emit();\n }\n\n /* Close the floating list when a click is performed outside of this Element. /\n @Listen(\"click\", {target: \"document\"})\n handleClick(ev: MouseEvent): void {\n if (!this.floating \|\| !this.open \|\| this.hostElement.contains(ev.target as Element)) {\n return;\n }\n\n this.reflow();\n this.open = false;\n this.closed.emit();\n }\n\n @Listen(\"canvasOpenStatusChanged\", {target: \"document\"})\n canvasOpenStatusChanged(e: CustomEvent): void {\n this.currentCanvasOpenStatus = e.detail;\n }\n\n @Listen(\"keydown\")\n handleKeyDown(e: KeyboardEvent): void {\n if (e.code === KeyboardCode.ENTER) {\n return;\n }\n\n if (this.open && !this.currentCanvasOpenStatus) {\n this.handleNavigationSideArrow(e);\n }\n\n this.handleArrowsNav(e);\n }\n\n private handleNavigationSideArrow(e: KeyboardEvent): void {\n if (e.code !== KeyboardCode.ARROW_RIGHT && e.code !== KeyboardCode.ARROW_LEFT) {\n return;\n }\n\n if (e.code === KeyboardCode.ARROW_RIGHT) {\n const nextElement = this.hostElement.nextElementSibling;\n\n if (!nextElement) {\n const firstMenuItem = this.firstElMenu.shadowRoot.querySelector(\".menu-label\") as HTMLElement;\n firstMenuItem.focus();\n this.open = false;\n }\n\n if (nextElement && nextElement.tagName === \"Z-MENU\") {\n const menuButton = nextElement.shadowRoot.querySelector(\".menu-label\") as HTMLElement;\n menuButton.focus();\n\n if (nextElement.children.length > 1) {\n nextElement.setAttribute(\"open\", \"true\");\n }\n this.open = false;\n }\n } else if (e.code === KeyboardCode.ARROW_LEFT) {\n const prevElement = this.hostElement.previousElementSibling;\n if (prevElement.tagName !== \"Z-MENU\") {\n const lastElMenuItem = this.lastElMenu.shadowRoot.querySelector(\".menu-label\") as HTMLElement;\n lastElMenuItem.focus();\n this.open = false;\n }\n if (prevElement && prevElement.tagName === \"Z-MENU\") {\n const menuButton = prevElement.shadowRoot.querySelector(\".menu-label\") as HTMLElement;\n menuButton.focus();\n if (prevElement.children.length > 1) {\n prevElement.setAttribute(\"open\", \"true\");\n }\n this.open = false;\n }\n }\n }\n\n private handleArrowsNav(e: KeyboardEvent): void {\n const menuItems = Array.from(this.hostElement.querySelectorAll(\"[slot='item']\")) as HTMLElement[];\n const newMenuItems = menuItems.map((el) => {\n if (el.tagName === \"Z-MENU-SECTION\") {\n return el.shadowRoot.querySelector(\"button\");\n }\n\n return el;\n });\n\n if (this.open) {\n e.preventDefault();\n e.stopPropagation();\n\n if (e.code === KeyboardCode.ARROW_DOWN \|\| e.code === KeyboardCode.ARROW_UP) {\n let nextFocusableItem: HTMLElement;\n // INFO: reset focus on all menu items\n newMenuItems.forEach((item: HTMLElement) => item.setAttribute(\"tabindex\", \"-1\"));\n\n if (e.code === KeyboardCode.ARROW_DOWN) {\n nextFocusableItem = this.getNextItem(newMenuItems, 1);\n } else if (e.code === KeyboardCode.ARROW_UP) {\n nextFocusableItem = this.getNextItem(newMenuItems, -1);\n }\n\n if (nextFocusableItem) {\n nextFocusableItem.setAttribute(\"tabindex\", \"0\");\n nextFocusableItem.focus();\n }\n } else if (e.code === KeyboardCode.ESC) {\n this.focusToParentAndCloseMenu();\n } else if (e.shiftKey && e.code === KeyboardCode.TAB) {\n this.focusToParentAndCloseMenu();\n }\n }\n }\n\n private getNextItem(menuItems: HTMLElement[], direction: number): HTMLElement {\n if (this.currentIndex === -1) {\n this.currentIndex = direction === 1 ? 0 : menuItems.length - 1;\n\n return menuItems[this.currentIndex];\n }\n\n this.currentIndex = (this.currentIndex + direction + menuItems.length) % menuItems.length;\n\n return menuItems[this.currentIndex];\n }\n\n private focusToParentAndCloseMenu(): void {\n const menuButton = this.hostElement.shadowRoot.querySelector(\".menu-label\") as HTMLElement;\n menuButton.focus();\n this.currentIndex = -1;\n this.open = false;\n }\n\n @Watch(\"open\")\n onOpenChanged(): void {\n if (this.open) {\n this.reflow(true);\n } else {\n cancelAnimationFrame(this.raf);\n }\n }\n\n constructor() {\n this.toggle = this.toggle.bind(this);\n this.checkContent = this.checkContent.bind(this);\n this.onLabelSlotChange = this.onLabelSlotChange.bind(this);\n this.onItemsChange = this.onItemsChange.bind(this);\n }\n\n componentWillLoad(): void {\n const menuItems = Array.from(this.hostElement.parentElement.querySelectorAll('[slot=\"menu\"]'));\n this.firstElMenu = menuItems[0] as HTMLMenuElement;\n this.lastElMenu = menuItems[menuItems.length - 1] as HTMLMenuElement;\n\n this.checkContent();\n }\n\n /\n Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.\n * @param ev Slotchange event\n /\n private onLabelSlotChange(ev: Event): void {\n const labelElement = (ev.target as HTMLSlotElement).assignedElements()[0] as HTMLElement;\n labelElement.dataset.text = labelElement?.textContent;\n }\n\n /\n Correctly set position of the floating menu in order to prevent overflow.\n * @param live Should run the method on every refresh frame.\n /\n private reflow(live = false): void {\n if (this.content) {\n const {style} = this.content;\n const {left} = this.hostElement.getBoundingClientRect();\n const widthPx = getComputedStyle(this.content).width;\n const width = widthPx ? parseFloat(widthPx.replace(\"px\", \"\")) : 375;\n const safeScrollbarSpace = 30;\n style.left = `${Math.min(window.innerWidth - left - width - safeScrollbarSpace, 0)}px`;\n }\n if (live) {\n this.raf = requestAnimationFrame(this.reflow.bind(this, live));\n }\n }\n\n /\n Check if some content slot is set.\n /\n private checkContent(): void {\n this.hasHeader = !!this.hostElement.querySelectorAll(\"[slot=header]\").length;\n this.hasContent = !!this.hostElement.querySelectorAll(\"[slot=item]\").length \|\| this.hasHeader;\n }\n\n /\n Set `menuitem` role to all menu items.\n * Set the item's inner text to the `data-text` attribute (this is for using bold text avoiding layout shifts).\n */\n private onItemsChange(): void {\n this.checkContent();\n const items = this.hostElement.querySelectorAll<HTMLElement>(\"[slot=item]\");\n items.forEach((item) => {\n item.setAttribute(\"role\", \"menuitem\");\n item.setAttribute(\"tabindex\", \"-1\");\n item.dataset.text = item.textContent;\n });\n }\n\n private focusFirstItemOnKeyUp(): void {\n const firstElement = this.hostElement.querySelectorAll(\"[slot='item']\")[0] as HTMLElement;\n if (firstElement) {\n firstElement.focus();\n this.currentIndex = 0;\n }\n }\n\n private renderMenuLabel(): HTMLButtonElement \| HTMLDivElement {\n if (this.hasContent) {\n return (\n <div class=\"menu-wrapper\">\n <button\n class=\"menu-label\"\n aria-expanded={this.open ? \"true\" : \"false\"}\n aria-label={this.open ? \"Chiudi menù\" : \"Apri menù\"}\n onClick={this.toggle}\n onKeyUp={this.focusFirstItemOnKeyUp.bind(this)}\n >\n <div class=\"menu-label-content\">\n <slot onSlotchange={this.onLabelSlotChange}></slot>\n <z-icon name={this.open ? \"chevron-up\" : \"chevron-down\"} />\n </div>\n </button>\n </div>\n );\n }\n\n return (\n <div class=\"menu-wrapper\">\n <div class=\"menu-label\">\n <div class=\"menu-label-content\">\n <slot onSlotchange={this.onLabelSlotChange}></slot>\n </div>\n </div>\n </div>\n );\n }\n\n render(): HTMLZMenuElement {\n return (\n <Host>\n {this.renderMenuLabel()}\n\n {this.hasContent && (\n <div\n class=\"content\"\n ref={(el) => (this.content = el)}\n >\n {this.hasHeader && (\n <header class=\"header\">\n <slot\n name=\"header\"\n onSlotchange={this.checkContent}\n ></slot>\n </header>\n )}\n\n <div\n class=\"items\"\n role=\"menu\"\n >\n <slot\n name=\"item\"\n onSlotchange={this.onItemsChange}\n ></slot>\n </div>\n </div>\n )}\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"z-menu.js","mappings":"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","names":["ZMenu"],"sources":["src/components/z-menu/styles.css?tag=z-menu&encapsulation=shadow","src/components/z-menu/index.tsx"],"sourcesContent":[":host,\n::slotted(),\n {\n box-sizing: border-box;\n outline: none;\n}\n\n:host {\n --z-menu-label-color: ;\n\n position: relative;\n display: inline-flex;\n height: fit-content;\n flex-direction: column;\n}\n\n::slotted(a) {\n text-decoration: none;\n}\n\n::slotted() {\n color: var(--color-default-text);\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n.menu-label {\n position: relative;\n width: 100%;\n padding: 0;\n border: 0;\n margin: 0;\n background: transparent;\n border-radius: 0;\n color: inherit;\n text-align: left;\n}\n\n.menu-wrapper {\n display: flex;\n align-items: center;\n}\n\nbutton.menu-label {\n cursor: pointer;\n}\n\n.menu-label:focus-within {\n box-shadow: var(--shadow-focus-primary);\n}\n\n.menu-label .menu-label-content {\n position: relative;\n display: flex;\n align-items: center;\n border-bottom: var(--border-size-large) solid transparent;\n}\n\n:host(:is([active], [open])) .menu-label-content,\n.menu-label:focus-within .menu-label-content {\n color: var(--color-primary01);\n font-weight: var(--font-bd);\n}\n\n:host(:is([active], [open])) .menu-label-content ::slotted(),\n.menu-label:focus-within .menu-label-content ::slotted(),\n.menu-label:focus-within .menu-label-content z-icon {\n color: var(--color-primary01);\n letter-spacing: normal;\n}\n\n:host([vertical-context]) .menu-label-content {\n padding: var(--space-unit) 0;\n border-width: var(--border-size-small);\n border-color: var(--color-surface03);\n}\n\n:host([vertical-context]) .menu-label-content ::slotted() {\n padding: 0;\n}\n\n:host(:is([active], [open])) .menu-label .menu-label-content,\n.menu-label .menu-label-content:hover,\n.menu-label:focus-within .menu-label-content {\n border-color: var(--color-secondary01);\n}\n\n:host([vertical-context]:is([active], [open])) .menu-label .menu-label-content::after,\n:host([vertical-context]) .menu-label:hover::after,\n:host([vertical-context]) .menu-label:focus-within .menu-label-content::after {\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--border-size-large);\n background-color: var(--color-secondary01);\n content: \"\";\n}\n\n/* Prevents layout shifts on font-weight changes.\nThe trick is to put an hidden copy of the text already set to bold,\nso the needed space is correctly calculated before any hover/active state changes the\nfont-weight of the real text.\nThe hidden text has an height of 0px so it can expand the width without changing the height\nwhen placed below the real text using `flex-direction: column`. /\n::slotted([data-text]:not([slot]))::after {\n height: 0;\n content: attr(data-text);\n content: attr(data-text) / \"\";\n font-weight: var(--font-bd);\n letter-spacing: normal;\n pointer-events: none;\n user-select: none;\n visibility: hidden;\n}\n\n@media speech {\n ::slotted([data-text]:not([slot]))::after {\n display: none;\n }\n}\n\n::slotted([data-text]:not([slot])) {\n display: inline-flex;\n flex-direction: column;\n}\n\n.menu-label .menu-label-content ::slotted() {\n display: inline-flex;\n width: 100%;\n min-width: fit-content;\n padding-bottom: 2px;\n margin: 0;\n appearance: none;\n color: var(--z-menu-label-color, var(--color-default-text));\n font-family: var(--font-family-sans);\n font-size: var(--font-size-3);\n font-weight: inherit;\n line-height: 1.5;\n}\n\n.menu-label .menu-label-content z-icon {\n margin-left: calc(var(--space-unit) * 1.5);\n fill: currentcolor;\n}\n\n.content {\n background: var(--color-surface01);\n}\n\n:host(:not([open])) .content {\n display: none;\n}\n\n:host([floating]:not([vertical-context])) .content {\n position: absolute;\n top: 100%;\n left: 0;\n width: 375px;\n min-width: 100%;\n max-width: 100vw;\n padding: 0 calc(var(--space-unit) * 2);\n box-shadow: var(--shadow-2);\n}\n\n:host(:not([floating])) .content {\n width: 100%;\n}\n\n.header {\n display: flex;\n align-items: center;\n padding: var(--space-unit) 0 calc(var(--space-unit) * 2);\n}\n\n.header ::slotted(img[slot=\"header\"]) {\n width: calc(var(--space-unit) * 11.25);\n height: auto;\n object-fit: contain;\n}\n\n.header ::slotted([slot=\"header\"]:not(:first-child)) {\n margin: auto 0;\n margin-left: calc(var(--space-unit) * 2.5);\n font-size: var(--font-size-3);\n font-weight: var(--font-sb);\n line-height: 1.5;\n}\n\n.items {\n display: flex;\n flex-direction: column;\n align-items: flex-start;\n background: inherit;\n}\n\n.items > ::slotted([slot=\"item\"]) {\n width: 100%;\n margin: 0;\n font-size: var(--font-size-3);\n line-height: 1.5;\n}\n\n.items > ::slotted([slot=\"item\"]:focus:focus-visible) {\n box-shadow: var(--shadow-focus-primary);\n}\n\n.items > ::slotted([slot=\"item\"]:not(z-menu-section)) {\n padding: var(--space-unit) 0;\n border-bottom: var(--border-size-small) solid var(--color-surface03);\n}\n\n:host(:not([vertical-context])) .items > ::slotted([slot=\"item\"]:not(z-menu-section):last-of-type) {\n border-bottom: 0;\n}\n\n.items > ::slotted([slot=\"item\"]:hover),\n.items > ::slotted([slot=\"item\"]:focus:focus-visible),\n.items > ::slotted([slot=\"item\"]:active) {\n border-color: var(--color-secondary01);\n font-weight: var(--font-bd);\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode} from \"../../beans\";\n\nconst isZMenuSection = (el: HTMLElement \| HTMLZMenuSectionElement): el is HTMLZMenuSectionElement =>\n el?.tagName === \"Z-MENU-SECTION\";\n\n/*\n @slot - Menu label\n * @slot header - Header to display as the first entry of the open menu.\n * @slot item - Single entry of the section. Can be slotted multiple times to insert items onto the menu. Set the `active` HTML attribute on the element to highlight it. Use `z-menu-section` for submenus.\n * @cssprop --z-menu-label-color - Color of the label's text.\n /\n@Component({\n tag: \"z-menu\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMenu {\n @Element() host: HTMLZMenuElement;\n\n /* Flag to set the active status of the menu. /\n @Prop({reflect: true})\n active?: boolean;\n\n /\n Flag to set the display mode of the list.\n * If true, the list will be absolutely positioned under the menu label,\n * stacked beneath it otherwise.\n /\n @Prop({reflect: true})\n floating? = true;\n\n /* The opening state of the menu. /\n @Prop({mutable: true, reflect: true})\n open = false;\n\n /\n Tells the component that it's placed in a vertical context with other `ZMenu`s (usually in the ZAppHeader's offcanvas).\n * A small border is placed under it as a separator from other elements.\n /\n @Prop({reflect: true})\n verticalContext = false;\n\n /\n Tabindex value to set on the menu label.\n * Useful to manage keyboard navigation focus with roving tabindex handled by this component's parent (usually ZAppHeader).\n /\n @Prop()\n htmlTabindex = -1;\n\n @State()\n hasHeader: boolean;\n\n @State()\n hasContent: boolean;\n\n /* The menu has been opened. /\n @Event()\n opened: EventEmitter;\n\n /* The menu has been closed. /\n @Event()\n closed: EventEmitter;\n\n private labelButton: HTMLButtonElement;\n\n private content: HTMLElement;\n\n private items: (HTMLElement \| HTMLZMenuSectionElement)[];\n\n /* Animation frame request id. /\n private raf: number;\n\n private get focusableItem(): HTMLZMenuSectionElement \| HTMLElement \| null {\n return this.items.find((item) => (isZMenuSection(item) ? item.htmlTabindex === 0 : item.tabIndex === 0));\n }\n\n private toggle(): void {\n if (!this.hasContent) {\n return;\n }\n\n this.open = !this.open;\n }\n\n /\n Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.\n * @param ev Slotchange event\n /\n private onLabelSlotChange(ev: Event): void {\n const labelElement = (ev.target as HTMLSlotElement).assignedElements()[0] as HTMLElement;\n labelElement.dataset.text = labelElement?.textContent;\n this.setLabelA11yAttrs();\n }\n\n /\n Correctly set position of the floating menu in order to prevent overflow.\n * @param live Should run the method on every refresh frame.\n /\n private reflow(live = false): void {\n if (this.content && this.hasContent) {\n const {style} = this.content;\n const {left} = this.host.getBoundingClientRect();\n const widthPx = getComputedStyle(this.content).width;\n const width = widthPx ? parseFloat(widthPx.replace(\"px\", \"\")) : 375;\n const safeScrollbarSpace = 30;\n style.left = `${Math.min(window.innerWidth - left - width - safeScrollbarSpace, 0)}px`;\n }\n if (live) {\n this.raf = requestAnimationFrame(this.reflow.bind(this, live));\n }\n }\n\n /\n Check if some content slot is set.\n /\n private checkContent(): void {\n this.hasHeader = !!this.host.querySelectorAll(\"[slot=header]\").length;\n this.hasContent = !!this.host.querySelectorAll(\"[slot=item]\").length \|\| this.hasHeader;\n }\n\n /\n Set `menuitem` role to all menu items (ZMenuSection items already have it).\n * Set -1 to the tabindex of the items and 0 to the first one.\n /\n private setItemsA11yAttrs(): void {\n this.items.forEach((item, index) => {\n const tabindex = index === 0 ? 0 : -1;\n if (isZMenuSection(item)) {\n item.htmlTabindex = tabindex;\n } else {\n item.setAttribute(\"role\", \"menuitem\");\n item.tabIndex = tabindex;\n }\n });\n }\n\n private onItemsChange(): void {\n this.checkContent();\n this.items = Array.from(this.host.children).filter(({slot}) => slot === \"item\") as HTMLElement[];\n this.setItemsA11yAttrs();\n this.items.forEach((item) => {\n if (!isZMenuSection(item)) {\n item.dataset.text = item.textContent;\n }\n });\n }\n\n /\n Move focus and adjust the tabindex value of `receiver` and `current` elements,\n * setting -1 to the `current` and 0 to the `receiver`, then focus the `receiver` element.\n * If the receiver is a ZMenuSection and it's open, focus its first focusable item.\n /\n private moveFocus(\n receiver: HTMLElement \| HTMLZMenuSectionElement,\n current?: HTMLElement \| HTMLZMenuSectionElement\n ): void {\n if (isZMenuSection(receiver)) {\n receiver.setFocus();\n } else {\n receiver.tabIndex = 0;\n setTimeout(() => {\n receiver.focus();\n }, 100);\n }\n if (!current) {\n return;\n }\n\n if (isZMenuSection(current)) {\n current.htmlTabindex = -1;\n } else {\n current.tabIndex = -1;\n }\n }\n\n private onLabelKeydown(ev: KeyboardEvent): void {\n if (ev.key === KeyboardCode.ENTER \|\| ev.key === KeyboardCode.SPACE) {\n ev.preventDefault();\n ev.stopPropagation();\n this.toggle();\n }\n\n if (!this.verticalContext) {\n return;\n }\n\n if (ev.key === KeyboardCode.ARROW_RIGHT && !this.open) {\n ev.preventDefault();\n ev.stopPropagation();\n this.open = true;\n\n return;\n }\n\n if (ev.key === KeyboardCode.ARROW_LEFT && this.open) {\n ev.preventDefault();\n ev.stopPropagation();\n this.open = false;\n }\n }\n\n /* Set tabindex of the label to 0, then focus it. /\n @Method()\n async setFocus(): Promise<void> {\n this.htmlTabindex = 0;\n const label = this.hasContent ? this.labelButton : (this.host.firstElementChild as HTMLElement);\n label.focus();\n }\n\n /* Focus the last item. */\n @Method()\n async focusLastItem(): Promise<void> {\n this.htmlTabindex = 0;\n this.moveFocus(this.items[this.items.length - 1]);\n }\n\n @Watch(\"open\")\n onOpenChanged(): void {\n this.setItemsA11yAttrs();\n if (!this.open) {\n cancelAnimationFrame(this.raf);\n this.closed.emit();\n this.items.forEach((item) => {\n if (isZMenuSection(item) && item.open) {\n item.open = false;\n }\n });\n\n return;\n }\n\n this.opened.emit();\n if (this.floating) {\n this.reflow(true);\n }\n }\n\n @Watch(\"htmlTabindex\")\n setLabelA11yAttrs(): void {\n if (this.hasContent && !this.labelButton) {\n return;\n }\n\n if (this.hasContent) {\n this.labelButton.tabIndex = this.htmlTabindex;\n\n return;\n }\n\n const slottedLabel = this.host.firstElementChild as HTMLElement;\n slottedLabel.role = \"menuitem\";\n slottedLabel.tabIndex = this.htmlTabindex;\n }\n\n @Listen(\"keydown\")\n onKeyDown(ev: KeyboardEvent): void {\n if (!this.hasContent) {\n return;\n }\n\n switch (ev.key) {\n case KeyboardCode.ESC:\n ev.stopPropagation();\n ev.preventDefault();\n this.open = false;\n this.setFocus();\n break;\n case KeyboardCode.ARROW_DOWN: {\n if (this.verticalContext && document.activeElement === this.host && !this.open) {\n break;\n }\n\n if (document.activeElement === this.host) {\n if (!this.open) {\n this.open = true;\n }\n ev.stopPropagation();\n ev.preventDefault();\n this.moveFocus(this.items[0]);\n break;\n }\n\n const currentIndex = this.items.indexOf(this.focusableItem);\n const receiver = this.items[currentIndex + 1];\n if (this.verticalContext && !receiver) {\n break;\n }\n\n ev.stopPropagation();\n ev.preventDefault();\n // if the last item is already focused, navigate to the first one\n this.moveFocus(receiver ?? this.items[0], this.focusableItem);\n break;\n }\n case KeyboardCode.ARROW_UP: {\n if (this.verticalContext && document.activeElement === this.host) {\n break;\n }\n\n if (document.activeElement === this.host) {\n // open the menu and focus the last item\n if (!this.open) {\n this.open = true;\n }\n ev.stopPropagation();\n ev.preventDefault();\n this.moveFocus(this.items[this.items.length - 1], this.focusableItem);\n break;\n }\n\n ev.stopPropagation();\n ev.preventDefault();\n const currentIndex = this.items.indexOf(this.focusableItem);\n const receiver = this.items[currentIndex - 1];\n if (!receiver && this.verticalContext) {\n this.setFocus();\n break;\n }\n\n if (isZMenuSection(receiver) && receiver.open) {\n isZMenuSection(this.focusableItem)\n ? (this.focusableItem.htmlTabindex = -1)\n : (this.focusableItem.tabIndex = -1);\n receiver.focusLastItem();\n break;\n }\n\n // if the first item is already focused, navigate to the last one\n this.moveFocus(receiver ?? this.items[this.items.length - 1], this.focusableItem);\n break;\n }\n }\n }\n\n constructor() {\n this.toggle = this.toggle.bind(this);\n this.checkContent = this.checkContent.bind(this);\n this.onLabelSlotChange = this.onLabelSlotChange.bind(this);\n this.onItemsChange = this.onItemsChange.bind(this);\n this.onLabelKeydown = this.onLabelKeydown.bind(this);\n }\n\n connectedCallback(): void {\n this.onItemsChange();\n this.setLabelA11yAttrs();\n }\n\n render(): HTMLDivElement \| HTMLZMenuElement {\n if (!this.hasContent) {\n return (\n <div class=\"menu-wrapper\">\n <div class=\"menu-label\">\n <div class=\"menu-label-content\">\n <slot onSlotchange={this.onLabelSlotChange} />\n </div>\n </div>\n </div>\n );\n }\n\n return (\n <Host>\n <div class=\"menu-wrapper\">\n <button\n ref={(el) => (this.labelButton = el)}\n class=\"menu-label\"\n aria-expanded={`${!!this.open}`}\n aria-haspopup={`${this.hasContent}`}\n aria-label={this.open ? \"Chiudi menù\" : \"Apri menù\"}\n role=\"menuitem\"\n tabindex={this.htmlTabindex}\n onClick={this.toggle}\n onKeyDown={this.onLabelKeydown}\n >\n <div class=\"menu-label-content\">\n <slot onSlotchange={this.onLabelSlotChange} />\n <z-icon name={this.open ? \"chevron-up\" : \"chevron-down\"} />\n </div>\n </button>\n </div>\n\n <div\n class=\"content\"\n ref={(el) => (this.content = el)}\n >\n {this.hasHeader && (\n <header class=\"header\">\n <slot\n name=\"header\"\n onSlotchange={this.checkContent}\n />\n </header>\n )}\n\n <div\n class=\"items\"\n role=\"menu\"\n >\n <slot\n name=\"item\"\n onSlotchange={this.onItemsChange}\n />\n </div>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

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

@@ -56,7 +56,7 @@ const ZMyzCardAlert$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardAlert ext
         }
     }
     render() {
-        return (h("div", { key: 'e488b304fcdd145b3ce0ba375d36a997a646eec9', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: '256f5d68375a9c8c187785cfdbd6272b8cc449f9', type: this.getAlertType() }, h("div", { key: '9f3d7e43b28f3fc92bf1e627475af9a9f0464799', class: "relative-container" }, h("z-icon", { key: '6c9e26abc686e0d6020d7c6398a8575e6e8ac543', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: 'b4b997286c4e5250c5b856f0d375ad49162c92df', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '18020fe9e8180577a168a25c0ba17464cedf70c0', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
+        return (h("div", { key: 'fdf3b3e5397d3dd7efc7d97473a4cc62f9a02d44', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: 'ffa276128f4f85801b8c6595edafa793e62c09bf', type: this.getAlertType() }, h("div", { key: 'f1f95d118588729d146322f9c223f53b4a0804e9', class: "relative-container" }, h("z-icon", { key: 'd9169d7b7f5542ec967993850503a2834d18cb37', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: 'd9fe4a9a0c925e5cf2dce5cc50974c02d63c497b', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '4e537fe8adb30714f0cb27a96ad99a6cf49f2acc', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
                 this.handleActionButtonClick(e);
             }, onKeyPress: (e) => {
                 this.handleSpaceKeyPress(e);

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

@@ -31,7 +31,7 @@ const ZMyzCardDictionary$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardDict
         this.cardFlipped.emit(showBack);
     }
     render() {
-        return (h("div", { key: 'd86e3c2140c9100c3bac377380a4fff77d089153' }, h("z-myz-card", { key: '34a3f2a9bfe747865ad3a4dca7f0ec106b1fe567' }, h("z-myz-card-header", { key: 'dc172fabf38338d7fd89af67a80da6918a1c0918', titolo: this.name }), h("div", { key: '8d0b945f35287a60658cf37b15440f8b66c98b65', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '7b205650b760c3fb8f7d538bbfe5d2a73e237992', class: "front" }, h("z-myz-card-body", { key: 'c8fe772333350bc8ef4643f04e0585b80fea7e83' }, h("z-myz-card-cover", { key: 'a1b65f443fdf541dee8b21fb3709362ed6eaff4f', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: 'e5b8bb0a7543a5f1e3954564f4cd28c11963b0aa', 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: 'ce3cfb76aac872409b162b80c6659799c17ea6ed', class: "back" }, h("slot", { key: 'eafdc479751d3326775dd01f1ced2ac9a9df189f', name: "info" }))), h("slot", { key: '4e4d018a5ca6c9282985d7fb978abb738675fa52' }))));
+        return (h("div", { key: '5f4b35325a1b33b49f10e1c0009ba0aef368bda3' }, h("z-myz-card", { key: '25c1f34f2ebe744132822f8637a54feaeff0fa7a' }, h("z-myz-card-header", { key: '0b0b1144271c7f5b75bc05bd7fd6e80d9f20244e', titolo: this.name }), h("div", { key: '508459cbf9949b90b7266be3b2d42a3474a05882', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '4416070294cbee0ecb0751afa54943a58fdb2816', class: "front" }, h("z-myz-card-body", { key: 'cef16ad669fcc00368191d71aae674210ec96781' }, h("z-myz-card-cover", { key: '559ae7ae9c8473b70793e086731e95bd93017989', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: '31808feee0e2aaa301f654d710eeb02bebc31c55', 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: 'e4086e4ac6cc3d81505174eb274a4057aee9e462', class: "back" }, h("slot", { key: '670b96387b02d5a9b2d4c23512cb57a0301e4bc6', name: "info" }))), h("slot", { key: 'e1fc9e4977bfb1668fbb51ad54e49d5e0f26749c' }))));
     }
     static get style() { return ZMyzCardDictionaryStyle0; }
 }, [1, "z-myz-card-dictionary", {

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

@@ -10,7 +10,7 @@ const ZMyzCardFooterSections$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCard
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '460ccb7066c598d7712f468b8b77850190fd6088' }, h("footer", { key: '14789b182cd02636149dd501d8963e23bf9893ff' }, h("div", { key: 'f618c2e4c24c9488aa6090c6629d846c72b9868c', class: "top" }, h("slot", { key: '9fdbc5aeb537308c6a0a1197de2490749d8710a8', name: "top" })), h("div", { key: '900ff46313ca3d71e7e501f6c7d9e531ec41cdfb', class: "bottom" }, h("slot", { key: 'abac3671bea6c55bb0e18d6c05899e4ae9be3895', name: "bottom" })))));
+        return (h("div", { key: '0344c4e070449ed8a08e4dded7a71e6ac4911928' }, h("footer", { key: '96a2a91d1471369f14930a65a30cd7e2a1cefe89' }, h("div", { key: 'e5a888a9b4b7f7304180d312180f1f9b21b8c815', class: "top" }, h("slot", { key: 'e58c11948649ca7810f507bbddf84dd37bb631df', name: "top" })), h("div", { key: '2167d5af09430d8c3dbf018aabd8d610274e9615', class: "bottom" }, h("slot", { key: 'd3e0867c0d92f240d83954e127a5c2342139d8d0', name: "bottom" })))));
     }
     static get style() { return ZMyzCardFooterSectionsStyle0; }
 }, [1, "z-myz-card-footer-sections"]);

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

@@ -62,7 +62,7 @@ const ZMyzCardFooter$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardFooter e
         return this.host.querySelector("[slot=list] > li a");
     }
     render() {
-        return (h("div", { key: '5e52bb4e61efb15a9e45cfc35635edf162c1348b', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: 'e58bbf1f64147496f82422ea45e0c7769145f5d2', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: '7733adaf9bd6739ce95b53c963c5fef169fe5617', class: "toggle" }, h("slot", { key: '43c3727d4206f3538f82298da583634338df147f', name: "toggle" })), this.titolo && h("p", { key: '8d895c1628c00fdf053cd413c93a71bd2ed7fe2e', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '8bc2964e1e62e7dc2b9c4198fc3d19572702fc04', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '75c1a00ee5b83cc1202ff7ea8ae96fab7d24e09a' }, h("p", { key: 'b2a545232bba45aac1aa7615dead6354327dcbff', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '4869f5bb8a75bc51b3fddde7fe46a23811d061f9', title: this.getTitleAuthors() }, h("span", { key: '43f8c9ff3eb8a794f9be628b8d0a1d8853bc1510', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: '15ed7ba2687e6aafdf7704da66dcbcee7ec25445', class: "year-isbn" }, h("span", { key: 'a05d17196f49c90c025ef545586dc162444efd03', class: "isbn" }, h("span", { key: '6481dac818d211c724aaddf1e17cf71637099376' }, h("span", { key: '6d27dc2a43d5e6e3367ad77e05c76b6d096f08a1', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '6df905d3cedea3ed63029851103a4a4f919e8b20', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: 'b71e8974d82d8b45f1bd53d8d73b893924a8a84d', name: "list" })))), this.customContent && h("slot", { key: 'a2269175a16d7f2f2cdc48035969e6fab3d64052', name: "content" })));
+        return (h("div", { key: 'f73773764a1386454f6178fc5509c5b21f8bfd18', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: '2a1b0b0a7f79b1ce3df317f9bae029ab906f8b65', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: 'f2d5ca8af14e8e9867636ef600b3227ef8c8da5d', class: "toggle" }, h("slot", { key: 'bb21f81c068753465ef813b69f1746ed0ffe5f27', name: "toggle" })), this.titolo && h("p", { key: '21985736b6a2ded998967a7f26404a78bae5588f', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '1da4887c06761a20e1530dcdff33667ec2b675f6', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '4eb92e5a2dc0fd6e2bf644170055cfcd086451cb' }, h("p", { key: 'ffe43ce26641fe2fb1d8a4fc5f5651cd9b22a9cf', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '3c4bca4611ad4d5442c4ead8ce21c7f837f788a9', title: this.getTitleAuthors() }, h("span", { key: '8d3cd889fdc5cf445cdf3c781f09b5104728fab6', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'e344133a7710094e474f125d1cd41a1a4de6787a', class: "year-isbn" }, h("span", { key: 'f122a9be8bde9df100e872be3533c85a66e0671f', class: "isbn" }, h("span", { key: '7b50957552fa95f6831c1004fc239ed28665eebd' }, h("span", { key: '0034102e13771426f3ae4feba28ff4b726055e22', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: 'd31dbee5a60238c90b450619e0102d68c510bf47', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: '6a757acf102ecb223c7bd1f9f8320fb8436fa8cd', name: "list" })))), this.customContent && h("slot", { key: '41c1bf974a47b8037d571e67cb1aa422c63d444c', name: "content" })));
     }
     get host() { return this; }
     static get style() { return ZMyzCardFooterStyle0; }

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

@@ -14,7 +14,7 @@ const ZMyzCardIcon$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardIcon exten
         this.ariaLabel = "";
     }
     render() {
-        return (h("button", { key: '204f6d7ba43b9300ce8f4fbbd7d27849e7db1c8a', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: '660c3c2bd313decba37ea630f83ce74c0b2f4153' }, h("z-icon", { key: '22fdf366571f73909d2411a0b745184a6d39b098', name: this.icon, width: 16, height: 16 }))));
+        return (h("button", { key: '8bb6a4fe4b3923048ab90bfaa78852777692b33c', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: '37723cd27adeda77455a24f9c5dd6a688737106d' }, h("z-icon", { key: '972caeff592a906837ffb190c8139424e0c2a2ca', name: this.icon, width: 16, height: 16 }))));
     }
     static get style() { return ZMyzCardIconStyle0; }
 }, [1, "z-myz-card-icon", {

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

@@ -121,7 +121,7 @@ const ZMyzCardInfo$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardInfo exten
         return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", h("b", null, this.cardData.offlineLicense.expiration), h("br", null), "Installazioni disponibili: ", h("b", null, this.cardData.offlineLicense.installations)));
     }
     render() {
-        return (h("div", { key: '1f42c0e5dee2d7dad7f4cfe4f57546091566e6a0' }, this.renderCloseIcon(), h("div", { key: '15bde9788efb9a4b9140ba75d0619aed9d9debfa', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '813495ab63d355830e85557f10ae18ee3900c517', class: "cta-wrapper" }, h("slot", { key: '760ca67e6143c5d96bf31121b786e03f7606b4f3' }))));
+        return (h("div", { key: '2a05ddeb716ce41cc96f39719f485fcf717f52e6' }, this.renderCloseIcon(), h("div", { key: 'd657573cb16fc4f79a7803a78f24ab5bd398d4c9', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '30c4c278f935dee8e281a357ac292962cdaa71c3', class: "cta-wrapper" }, h("slot", { key: 'af3c4fd43855806fe5a018eb02beec2493f9743f' }))));
     }
     static get style() { return ZMyzCardInfoStyle0; }
 }, [1, "z-myz-card-info", {

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

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

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

@@ -26,7 +26,7 @@ const ZMyzList$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzList extends HTMLE
     }
     render() {
         const lastElem = this.list ? this.list.length - 1 : -1;
-        return (h("ul", { key: 'b49ccd7184049e42611185d36fcf9cc1f74fd13b' }, this.list &&
+        return (h("ul", { key: 'f9ab893ced59fa7364b54575686431e0ee26398e' }, this.list &&
             this.list.map((bean, i) => (h("z-myz-list-item", { listitemid: bean.listitemid, text: bean.text, link: bean.link, linktarget: bean.linktarget, icon: bean.icon, underlined: lastElem != i })))));
     }
     static get watchers() { return {

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

@@ -205,10 +205,10 @@ const ZNavigationTabs$1 = /*@__PURE__*/ proxyCustomElement(class ZNavigationTabs
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '16294d384c48cb2380178445630240fcc6f085cc', class: {
+        return (h(Host, { key: 'ddfa52ab8c585f3502004479d43b9cd0768284df', class: {
                 "interactive-2": this.size === NavigationTabsSize.SMALL,
                 "interactive-1": this.size !== NavigationTabsSize.SMALL,
-            }, scrollable: this.canNavigate }, h("button", { key: '98eae832700569a7f2539aa51cee7c07ac2f3815', class: "navigation-button", onClick: this.navigateBackwards.bind(this), tabIndex: -1, disabled: !this.canNavigatePrev, "aria-label": "Mostra elementi precedenti", hidden: !this.canNavigate }, h("z-icon", { key: '21ddd942ac5c9a7cfdf53e1c31788268b7932f03', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'd2582f956ec466d672bdf43494f96d1b2ee73485', role: "tablist", "aria-label": this.ariaLabel, ref: (el) => (this.nav = el !== null && el !== void 0 ? el : this.nav), onScroll: this.checkScrollEnabled.bind(this), "aria-orientation": this.orientation }, h("slot", { key: '3cfbaf5ef02b8964b1b497deef2b8e95b6ef94e0' })), h("button", { key: '6cc204b98252d19cdd79bdf2f9f1824c2f69d559', class: "navigation-button", onClick: this.navigateForward.bind(this), tabIndex: -1, disabled: !this.canNavigateNext, "aria-label": "Mostra elementi successivi", hidden: !this.canNavigate }, h("z-icon", { key: '7bc36b5cdb865c759e0bb37362a820557e079be4', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
+            }, scrollable: this.canNavigate }, h("button", { key: '15c0e811c33f4479e1889a510c3ec63bd36e1bc6', class: "navigation-button", onClick: this.navigateBackwards.bind(this), tabIndex: -1, disabled: !this.canNavigatePrev, "aria-label": "Mostra elementi precedenti", hidden: !this.canNavigate }, h("z-icon", { key: 'b960014b0fb670473bd159aaab7bfbf772e7bd15', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: '032fd5f8b6ef9a507af18dc2e886f13e8d25bb5f', role: "tablist", "aria-label": this.ariaLabel, ref: (el) => (this.nav = el !== null && el !== void 0 ? el : this.nav), onScroll: this.checkScrollEnabled.bind(this), "aria-orientation": this.orientation }, h("slot", { key: 'e29f63dd956a46981607b7c7d771d97803a7cc8e' })), h("button", { key: '66a60588ccd80220b7ec5f063c4ccb664185e5d8', class: "navigation-button", onClick: this.navigateForward.bind(this), tabIndex: -1, disabled: !this.canNavigateNext, "aria-label": "Mostra elementi successivi", hidden: !this.canNavigate }, h("z-icon", { key: '90f9cd71eb2bdf8dec8d18e41113b00b3e647c4d', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-notification.js CHANGED Viewed

@@ -30,7 +30,7 @@ const ZNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZNotification ext
     }
     render() {
         var _a;
-        return (h(Host, { key: 'bf9ead754226002371eb0669770d24c0230bcf92' }, this.contenticonname && (h("z-icon", { key: '322709ad12acd8a885214809012178649b172bd8', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: 'd68ea8f5984fee4d906a05f93f9cf3ef4dae932c', class: "content-container" }, h("div", { key: 'd67f12dcbcf7075cbc0e111db260dce207e3411a', class: "content-text" }, h("slot", { key: '6e23a5b287e328657e1848dc1944b3a1ddc065be' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '68da7a70a5dec9113c021c915594c2e8424c21be', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '342853024b8a9bfce814282471d8d8e9e9f6b522', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'ce20a4b279bc3cb3d4b0dd7bf4c61fe9b3837556', name: "multiply-circle", width: 16, height: 16 })))));
+        return (h(Host, { key: '9049f1eb5307b4371dfaf51b897b759446b77dcb' }, this.contenticonname && (h("z-icon", { key: '856de47150e83f5bb71b23fdcb0663e0552241b9', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '303136903e30c9186f2ada431ebf3edab07e29d3', class: "content-container" }, h("div", { key: 'a1a6baf6fb38c4f1c747a263d6fed54e5bfd4105', class: "content-text" }, h("slot", { key: '1d57dcb7b9d78291e35dcbb493ef40d98b2cf53b' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '40a864ef7bc4692fd55bee3c7a1e9408c3e6de6c', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: 'e4c7f9d2314d79efb318432005be578d0eec5748', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'b3cfd176d32e36e5c4dd2bd2788950cc80295d83', name: "multiply-circle", width: 16, height: 16 })))));
     }
     static get style() { return ZNotificationStyle0; }
 }, [1, "z-notification", {

package/dist/components/z-otp.js CHANGED Viewed

@@ -24,7 +24,7 @@ const ZOtp$1 = /*@__PURE__*/ proxyCustomElement(class ZOtp extends HTMLElement {
         this.otpRef = [...Array(this.inputNum)];
     }
     render() {
-        return (h("div", { key: '501979362aafae33a4266f38a5785e0e328dba1b', class: "otp-container" }, h("div", { key: 'ca4b4646af395228586dd55ba5cb335b6492347b', class: "digits-container" }, this.otp.map((_val, i) => (h("input", { class: this.status == InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
+        return (h("div", { key: '9e28959418f6f1b382f16836935e12b3acddfa8f', class: "otp-container" }, h("div", { key: '9348bd6807e797441789a465ebdae3a03d1a7534', class: "digits-container" }, this.otp.map((_val, i) => (h("input", { class: this.status == InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
                 if (e.keyCode > 47) {
                     this.otpRef[i].value = "";
                 }
@@ -35,7 +35,7 @@ const ZOtp$1 = /*@__PURE__*/ proxyCustomElement(class ZOtp extends HTMLElement {
             }, onInput: (e) => {
                 this.otp[i] = e.target.value;
                 this.emitInputChange(this.otp.join(""));
-            }, type: "text", minlength: "1", maxlength: "1", autoComplete: "off", ref: (el) => (this.otpRef[i] = el) })))), h("z-input-message", { key: 'ce018353101dac73e4dc0ec9d78918f614a85247', message: this.message, status: this.status })));
+            }, type: "text", minlength: "1", maxlength: "1", autoComplete: "off", ref: (el) => (this.otpRef[i] = el) })))), h("z-input-message", { key: '87ee18c72daec6c0c903aa91e5a717c4d5a729b5', message: this.message, status: this.status })));
     }
     static get style() { return ZOtpStyle0; }
 }, [1, "z-otp", {

package/dist/components/z-panel-elem.js CHANGED Viewed

@@ -20,11 +20,11 @@ const ZPanelElem$1 = /*@__PURE__*/ proxyCustomElement(class ZPanelElem extends H
     }
     render() {
         const elemId = this.elemid ? this.elemid : "";
-        return (h("div", { key: '7364ce8b1efc2b30e792693a93f41834a65dd7c6', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '815580b59284ea71764fd9f18b98be4ab69ff1e5', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: 'a736866758f35a8284310a5bc81d08f166aec78c', src: this.imgurl, alt: this.imgalt }))), h("div", { key: '1d154781e2bf59a9a6b1c8ddff324e035095c5ec', class: "panel-elem-link" }, h("a", { key: '3531d557c2145fa3fb96f13c2952d4c2c6e366b8', class: {
+        return (h("div", { key: '76588e2a830b45962d16c31a7d03cf62fa3737f8', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '18ea22907d43ba3073dd939ca88297e98f34a1f6', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: 'cb2b3247131d30fb5894db2f540aa105a0464f39', src: this.imgurl, alt: this.imgalt }))), h("div", { key: 'cfe10a2ef94ea5286e44a8087599ed4ffe233a6d', class: "panel-elem-link" }, h("a", { key: '83a3f79fa79bea82fd63b7cf853107bd2717a434', class: {
                 "z-link": true,
                 "z-link-disabled": this.isdisabled,
                 "z-link-icon": true,
-            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: 'dd6a4750589fe913eeb211025beebb3da7cfc8fd', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: 'b2cbea114008c9f5c6a560c0e52f60ff9e6f7722', class: "panel-elem-desc" }, h("slot", { key: '73a350ea0ca8bc51e56a5a2879651883669a79b4', name: this.descrSlotName })))));
+            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: '69245c241eedd5740d0a45c88eed167ba45b63d0', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '028e4d9403ffa710f753088475e57f6e64702460', class: "panel-elem-desc" }, h("slot", { key: '1ad3080fb3f1db0cbd7f5dc41dca3d8a7ec41567', name: this.descrSlotName })))));
     }
     static get style() { return ZPanelElemStyle0; }
 }, [6, "z-panel-elem", {

package/dist/components/z-section-title.js CHANGED Viewed

@@ -17,7 +17,7 @@ const ZSectionTitle$1 = /*@__PURE__*/ proxyCustomElement(class ZSectionTitle ext
         this.hasSecondaryTitle = !!this.host.querySelector("[slot=secondary-title]");
     }
     render() {
-        return (h(Host, { key: '5718215a4b4b42735d8045c3de73998189f38bf7' }, h("slot", { key: '99e51ba27a27a3100ae7fc88df7537624f8682bb', name: "secondary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (h("z-divider", { key: 'd62ca69ea2ecdbb75ef8c034ca6beffc6041ede0', size: DividerSize.LARGE, color: "z-section-title--divider-color" })), h("slot", { key: 'cb8a5a51554a90e8749d664f3d6d19af67e5afeb', name: "primary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (h("z-divider", { key: 'bdf9d80c19154f8f89947d277f6a7234986b605e', size: DividerSize.LARGE, color: "z-section-title--divider-color" }))));
+        return (h(Host, { key: 'a3ad7d776af201e9d246373daf4ef244655e6b2a' }, h("slot", { key: '532382f5c39858d6a9b8bbf446e98f76b10eab45', name: "secondary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (h("z-divider", { key: 'cc3c82110d14153a78638af917d00f7a531de971', size: DividerSize.LARGE, color: "z-section-title--divider-color" })), h("slot", { key: 'cac165e1d7ec6f11ed8ea01694166ba2b8426b13', name: "primary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (h("z-divider", { key: 'df953e580195f6174c431cd464918de781266fef', size: DividerSize.LARGE, color: "z-section-title--divider-color" }))));
     }
     get host() { return this; }
     static get style() { return ZSectionTitleStyle0; }

package/dist/components/z-select.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h } from '@stencil/core/internal/client';
 import { e as ControlSize, g as KeyboardCode, l as ListDividerType, i as ListSize } from './index2.js';
-import { r as randomId, b as boolean, a as getElementTree, h as handleKeyboardSubmit, d as getClickedElement } from './utils.js';
+import { r as randomId, b as boolean, d as getElementTree, h as handleKeyboardSubmit, e as getClickedElement } from './utils.js';
 import { d as defineCustomElement$9 } from './index6.js';
 import { d as defineCustomElement$8 } from './index9.js';
 import { d as defineCustomElement$7 } from './index10.js';
@@ -330,7 +330,7 @@ const ZSelect$1 = /*@__PURE__*/ proxyCustomElement(class ZSelect extends HTMLEle
         return (h("z-input-message", { message: boolean(this.message) === true ? undefined : this.message, status: this.status, class: this.size }));
     }
     render() {
-        return (h("div", { key: '16a8b264460cb21cd19258694e04f7c58ca5bc26', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
+        return (h("div", { key: 'e7576038ebd3f6bde4a58c7165c075ac3b52dd45', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
     }
     get element() { return this; }
     static get watchers() { return {

package/dist/components/z-skip-to-content.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import { T as ThemeVariant } from './index2.js';
-import { a as getElementTree, h as handleKeyboardSubmit } from './utils.js';
+import { d as getElementTree, h as handleKeyboardSubmit } from './utils.js';
 const stylesCss = ".sc-z-skip-to-content-h{position:absolute;left:-100%;height:60px;box-sizing:border-box;padding:calc(var(--space-unit) * 1.25) calc(var(--space-unit) * 3);background-color:#24f4ff;font-family:var(--font-family-sans);font-weight:var(--font-rg);text-align:center}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{display:inline-flex;height:100%;align-items:center}.skip-to-content-visible.sc-z-skip-to-content-h,.sc-z-skip-to-content-h:focus{position:static;display:block}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:hidden;width:0;height:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-visible.sc-z-skip-to-content{width:initial;height:initial}.dark.sc-z-skip-to-content-h{background-color:var(--color-surface05);color:var(--color-surface01)}.light.sc-z-skip-to-content-h{border:var(--border-size-medium) solid var(--color-surface05);background-color:var(--color-surface01);color:var(--color-default-text)}@media (min-width: 768px){.sc-z-skip-to-content-h{text-align:start}}@media (min-width: 1152px){.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{padding:0 calc(var(--space-unit) * 3);border-right:var(--border-size-small) solid var(--color-surface05)}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content>a.z-link.link-invisible.sc-z-skip-to-content{overflow:initial;width:initial;height:initial}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:first-child{padding-left:0}.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child,.light.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content:last-child{padding-right:0;border-right:none}.dark.sc-z-skip-to-content-h>.link-container.sc-z-skip-to-content{border-right:var(--border-size-small) solid var(--color-surface01)}}";
 const ZSkipToContentStyle0 = stylesCss;
@@ -48,7 +48,7 @@ const ZSkipToContent$1 = /*@__PURE__*/ proxyCustomElement(class ZSkipToContent e
         this.visible = false;
     }
     render() {
-        return (h(Host, { key: '06ee6c9f26ddc014c08c34bb81ddd990aa7c0282', class: {
+        return (h(Host, { key: '505fa82af892c5881ffaedae4550fda73d97c608', class: {
                 [this.variant]: true,
                 "skip-to-content-visible": this.visible,
             } }, this.links.map((link, i) => {

package/dist/components/z-slideshow.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, h } from '@stencil/core/internal/client';
 import { p as Device } from './index2.js';
-import { e as convertJson, g as getDevice, h as handleKeyboardSubmit } from './utils.js';
+import { f as convertJson, g as getDevice, h as handleKeyboardSubmit } from './utils.js';
 import { d as defineCustomElement$2 } from './index9.js';
 const stylesCss = ":host{display:block;width:inherit;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host>div{display:flex;width:inherit;flex-direction:column}main{position:relative;overflow:hidden;width:100%}main z-icon.scroll{position:absolute;z-index:10;top:50%;width:auto;margin:0 var(--space-unit);cursor:pointer;fill:var(--color-primary01);transition:0.6s ease}main .scroll.disabled{opacity:0.5;pointer-events:none}main .scroll.right{right:0}#slides{display:flex;flex-wrap:wrap;line-height:0px;overflow-y:hidden;transition:all 300ms}footer{display:grid;width:100%;height:56px;align-items:center;border-top:var(--border-size-medium) solid var(--color-surface02);grid-template:2 / 2;grid-template-areas:\"center center\" \"left right\"}footer>div{width:100%;align-items:center}footer .footer-center{grid-area:center}footer .footer-left{grid-area:left}footer .footer-right{grid-area:right}footer .bullet-container{display:flex;min-height:60px;align-items:center;justify-content:center;margin:0 auto}footer .bullet-container .bullet{width:8px;height:8px;margin:var(--space-unit) 2px;background-color:var(--gray200);border-radius:50%;pointer-events:none}footer .bullet-container .bullet.selected{background-color:var(--gray400)}main z-icon:focus,footer .bullet-container .bullet:focus{border-radius:50%;box-shadow:var(--shadow-focus-primary);outline:none !important}@media only screen and (min-width: 768px){footer{height:76px;border-top:var(--border-size-medium) solid var(--color-surface02);grid-template:1 / 1fr 2fr 1fr;grid-template-areas:\"left center right\"}footer .bullet-container .bullet{width:10px;height:10px;margin:var(--space-unit) 3px}}@media only screen and (min-width: 1025px){main z-icon.scroll{margin:0 10px}footer .bullet-container .bullet{width:16px;height:16px;margin:var(--space-unit) calc(var(--space-unit) * 0.5);cursor:pointer;pointer-events:auto}}";

package/dist/components/z-stepper-item.js CHANGED Viewed

@@ -23,7 +23,7 @@ const ZStepperItem$1 = /*@__PURE__*/ proxyCustomElement(class ZStepperItem exten
         return Object.assign(Object.assign(Object.assign(Object.assign({}, href), role), current), tabindex);
     }
     render() {
-        return (h(Host, { key: '0994d3d3a8e89f1a93f17cb71baff1c1581bf7e4', role: "listitem" }, h("button", Object.assign({ key: '14becf7e97de2bd909f61cc3aa09b64b45f7ab30', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: '69f3cd00d2eeaafa65037d939218b2665d34b62b', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: '8d2ed47daa09ae26562bac42d262ba7c4c5320a4' }, h("slot", { key: '48004d92935fa78bd48df08a9eb3db11662a171b' })))));
+        return (h(Host, { key: '0f16f6202016c556147b474a73be14606a6d57dc', role: "listitem" }, h("button", Object.assign({ key: 'f894b125b31310c602a24e6a9298c0a7ffaf43ee', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: '05641bfa3b70fcc1552eb41dd01a0d9435f04971', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: '0259c6a2428d932c0f73b00304d75e92ec8de7bd' }, h("slot", { key: '37cdf19c7d05c87b6469f91bd427c2d7926eaeb9' })))));
     }
     static get style() { return ZStepperItemStyle0; }
 }, [1, "z-stepper-item", {

package/dist/components/z-stepper.js CHANGED Viewed

@@ -10,7 +10,7 @@ const ZStepper$1 = /*@__PURE__*/ proxyCustomElement(class ZStepper extends HTMLE
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: '5fbfa9cc1b0e6f672f054427828d56560059c160', role: "list" }, h("slot", { key: 'd2c5abd53c5c9e8569696aafb6101b7878e1a10c' })));
+        return (h(Host, { key: '799563bb322faa59b5f3c6b39a4996de7db89a8c', role: "list" }, h("slot", { key: 'c50aea0f183429aacddac1e9382c4413b3e1885f' })));
     }
     static get style() { return ZStepperStyle0; }
 }, [1, "z-stepper"]);

package/dist/components/z-table.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
 import './index2.js';
+import './breakpoints.js';
 import './iconset.js';
 const stylesCss = ":host{--z-table--cells-padding:calc(var(--space-unit) * 2);position:relative;display:block;overflow:auto;max-width:100%;box-sizing:border-box;background-color:var(--color-surface01)}:host([expandable]){--z-table--expand-button-size:40px}:host([bordered]){--z-table--cell-left-border:1px solid var(--color-surface03)}.table{min-width:max-content}";

package/dist/components/z-table.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"z-table.js","mappings":"~~;;;;~~AAAA,MAAM,SAAS,GAAG,2VAA2V,CAAC;AAC9W,qBAAe,SAAS;;MCeXA,QAAM;;;;;wBAON,KAAK;0BAMH,KAAK;;IAEV,gBAAgB;QACtB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;KAC7E;;;;IAOD,iBAAiB;QACf,IAAI,CAAC,0BAA0B,GAAG,IAAI,gBAAgB,CAAC;YACrD,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB,CAAC,CAAC;QACH,IAAI,CAAC,0BAA0B,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;YACjD,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,YAAY,CAAC;YAC/B,iBAAiB,EAAE,KAAK;SACzB,CAAC,CAAC;KACJ;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,0BAA0B,0CAAE,UAAU,EAAE,CAAC;KAC/C;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,UAAU,EAAE,IAAI,CAAC,UAAU,IAC/B,4DACE,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,OAAO,IAEZ,8DAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTable"],"sources":["src/components/table/z-table/styles.css?tag=z-table&encapsulation=shadow","src/components/table/z-table/index.tsx"],"sourcesContent":[":host {\n --z-table--cells-padding: calc(var(--space-unit) * 2);\n\n position: relative;\n display: block;\n overflow: auto;\n max-width: 100%;\n box-sizing: border-box;\n background-color: var(--color-surface01);\n}\n\n:host([expandable]) {\n --z-table--expand-button-size: 40px;\n}\n\n:host([bordered]) {\n --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\n.table {\n min-width: max-content;\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport \"../z-tbody/index\";\nimport \"../z-tfoot/index\";\nimport \"../z-thead/index\";\nimport \"../z-tr/index\";\n\n/*\n ZTable component.\n * @slot - Table content (`z-thead`, `z-tbody`, `z-tfoot`, `z-tr`).\n * @cssprop --z-table--cells-padding - Padding of the cells.\n /\n@Component({\n tag: \"z-table\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZTable {\n @Element() host: HTMLZTableElement;\n\n /\n Whether the table cells should show a border between them.\n /\n @Prop({reflect: true})\n bordered = false;\n\n /\n Whether the table contains some expandable rows.\n /\n @State()\n expandable = false;\n\n private updateExpandable(): void {\n this.expandable = this.host.querySelectorAll(\"z-tr[expandable]\").length > 0;\n }\n\n private expandableMutationObserver: MutationObserver;\n\n /\n Setup the table creating a mutation observer for the expandable attribute.\n */\n componentWillLoad(): void {\n this.expandableMutationObserver = new MutationObserver(() => {\n this.updateExpandable();\n });\n this.expandableMutationObserver.observe(this.host, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: [\"expandable\"],\n attributeOldValue: false,\n });\n }\n\n disconnectedCallback(): void {\n this.expandableMutationObserver?.disconnect();\n }\n\n render(): HTMLZTableElement {\n return (\n <Host expandable={this.expandable}>\n <div\n class=\"table\"\n role=\"table\"\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"z-table.js","mappings":";;;;;AAAA,MAAM,SAAS,GAAG,2VAA2V,CAAC;AAC9W,qBAAe,SAAS;;MCeXA,QAAM;;;;;wBAON,KAAK;0BAMH,KAAK;;IAEV,gBAAgB;QACtB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,IAAI,CAAC,gBAAgB,CAAC,kBAAkB,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;KAC7E;;;;IAOD,iBAAiB;QACf,IAAI,CAAC,0BAA0B,GAAG,IAAI,gBAAgB,CAAC;YACrD,IAAI,CAAC,gBAAgB,EAAE,CAAC;SACzB,CAAC,CAAC;QACH,IAAI,CAAC,0BAA0B,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,EAAE;YACjD,SAAS,EAAE,IAAI;YACf,OAAO,EAAE,IAAI;YACb,UAAU,EAAE,IAAI;YAChB,eAAe,EAAE,CAAC,YAAY,CAAC;YAC/B,iBAAiB,EAAE,KAAK;SACzB,CAAC,CAAC;KACJ;IAED,oBAAoB;;QAClB,MAAA,IAAI,CAAC,0BAA0B,0CAAE,UAAU,EAAE,CAAC;KAC/C;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,UAAU,EAAE,IAAI,CAAC,UAAU,IAC/B,4DACE,KAAK,EAAC,OAAO,EACb,IAAI,EAAC,OAAO,IAEZ,8DAAa,CACT,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTable"],"sources":["src/components/table/z-table/styles.css?tag=z-table&encapsulation=shadow","src/components/table/z-table/index.tsx"],"sourcesContent":[":host {\n --z-table--cells-padding: calc(var(--space-unit) * 2);\n\n position: relative;\n display: block;\n overflow: auto;\n max-width: 100%;\n box-sizing: border-box;\n background-color: var(--color-surface01);\n}\n\n:host([expandable]) {\n --z-table--expand-button-size: 40px;\n}\n\n:host([bordered]) {\n --z-table--cell-left-border: 1px solid var(--color-surface03);\n}\n\n.table {\n min-width: max-content;\n}\n","import {Component, Element, Host, Prop, State, h} from \"@stencil/core\";\nimport \"../z-tbody/index\";\nimport \"../z-tfoot/index\";\nimport \"../z-thead/index\";\nimport \"../z-tr/index\";\n\n/*\n ZTable component.\n * @slot - Table content (`z-thead`, `z-tbody`, `z-tfoot`, `z-tr`).\n * @cssprop --z-table--cells-padding - Padding of the cells.\n /\n@Component({\n tag: \"z-table\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZTable {\n @Element() host: HTMLZTableElement;\n\n /\n Whether the table cells should show a border between them.\n /\n @Prop({reflect: true})\n bordered = false;\n\n /\n Whether the table contains some expandable rows.\n /\n @State()\n expandable = false;\n\n private updateExpandable(): void {\n this.expandable = this.host.querySelectorAll(\"z-tr[expandable]\").length > 0;\n }\n\n private expandableMutationObserver: MutationObserver;\n\n /\n Setup the table creating a mutation observer for the expandable attribute.\n */\n componentWillLoad(): void {\n this.expandableMutationObserver = new MutationObserver(() => {\n this.updateExpandable();\n });\n this.expandableMutationObserver.observe(this.host, {\n childList: true,\n subtree: true,\n attributes: true,\n attributeFilter: [\"expandable\"],\n attributeOldValue: false,\n });\n }\n\n disconnectedCallback(): void {\n this.expandableMutationObserver?.disconnect();\n }\n\n render(): HTMLZTableElement {\n return (\n <Host expandable={this.expandable}>\n <div\n class=\"table\"\n role=\"table\"\n >\n <slot></slot>\n </div>\n </Host>\n );\n }\n}\n"],"version":3}

package/dist/components/z-toast-notification-list.js CHANGED Viewed

@@ -43,7 +43,7 @@ const ZToastNotificationList$1 = /*@__PURE__*/ proxyCustomElement(class ZToastNo
         }
     }
     render() {
-        return h("slot", { key: 'c358a615637656bb5b4cd475af919c495a278da5', name: "toasts" });
+        return h("slot", { key: '8b2a410e823aa6223e009a4def88f9f1c8dbf488', name: "toasts" });
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/z-toast-notification.js CHANGED Viewed

@@ -1,6 +1,6 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
 import { r as ToastNotificationTransition } from './index2.js';
-import { m as mobileBreakpoint } from './breakpoints.js';
+import { B as Breakpoints } from './breakpoints.js';
 import { d as defineCustomElement$2 } from './index9.js';
 var hammer = {exports: {}};
@@ -2703,7 +2703,7 @@ const ZToastNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZToastNotifi
         this.toastClose.emit();
     }
     componentWillLoad() {
-        this.isMobile = window.innerWidth <= mobileBreakpoint;
+        this.isMobile = window.innerWidth <= Breakpoints.MOBILE;
         this.validateAutoclose();
         this.percentage = 0;
     }
@@ -2829,7 +2829,7 @@ const ZToastNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZToastNotifi
             } }, h("div", { id: "flex-container", ref: (el) => (this.container = el) }, this.renderText(), this.renderButton()), this.renderCloseIcon()));
     }
     render() {
-        return (h(Host, { key: '3553c94f59787f1fdbb0ea349578c61ebbda1c21', style: {
+        return (h(Host, { key: 'b79165640d2b2537dd8003db29e1c18845f1976c', style: {
                 "--percentuale": `${this.percentage}%`,
             }, class: this.transition ? this.transition : ToastNotificationTransition.SLIDE_IN_DOWN, onAnimationEnd: (e) => {
                 if (this.autoclose && e.animationName.includes("slidein")) {