npm - @zanichelli/albe-web-components - Versions diffs - 17.0.0 → 17.0.2 - Mend

@zanichelli/albe-web-components 17.0.0 → 17.0.2

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 (695) hide show

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

	@@ -1 +1 @@
1	- {"file":"z-myz-card-info.js","mappings":"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","names":["ZMyzCardInfo"],"sources":["src/snowflakes/myz/card/z-myz-card-info/styles.css?tag=z-myz-card-info&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-info/index.tsx"],"sourcesContent":[":host {\n width: 100%;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > div {\n position: relative;\n display: grid;\n width: calc(100% + calc(var(--space-unit) * 2));\n height: 402px;\n box-sizing: border-box;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);\n border: var(--border-size-small) solid var(--color-primary01);\n margin-left: calc(-1 * var(--space-unit));\n background: var(--color-surface01);\n border-radius: 0;\n box-shadow: 0 2px 4px 0 rgb(66 69 72 / 35%);\n}\n\n:host > div > z-icon {\n position: absolute;\n top: var(--space-unit);\n right: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01);\n}\n\n:host > div > div.cta-wrapper {\n display: flex;\n flex-flow: column nowrap;\n align-self: end;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper {\n position: relative;\n overflow: hidden;\n align-self: stretch;\n}\n\n:host > div > div.content-wrapper > section {\n box-sizing: border-box;\n padding: var(--space-unit) 0;\n border-bottom: var(--border-size-small) solid var(--color-surface04);\n color: var(--color-surface05);\n font-size: 14px;\n line-height: 20px;\n}\n\n:host > div > div.content-wrapper > section:last-child {\n border-bottom: none;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper {\n position: relative;\n overflow: hidden;\n box-sizing: border-box;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper.hidden::after {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background: linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);\n content: \"\";\n pointer-events: none;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading {\n display: flex;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expired {\n color: var(--color-secondary01);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expiring {\n color: var(--color-warning01);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > z-popover {\n position: absolute;\n top: 0;\n left: calc(var(--space-unit) * 4);\n}\n","import {Component, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {DictionaryData, PopoverPosition} from \"../../../../beans\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n/*\n @slot - content\n /\n@Component({\n tag: \"z-myz-card-info\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardInfo {\n /* dictionary info /\n @Prop()\n data: string \| DictionaryData;\n\n /* tabindex link attribute (optional) /\n @Prop()\n htmltabindex?: number = 0;\n\n @State()\n hiddenContent = false;\n\n @State()\n tooltip = false;\n\n private cardData: DictionaryData;\n\n private contentWrapper: HTMLElement;\n\n private infoWrapper: HTMLElement;\n\n private onlineLicenseWrapper: HTMLElement;\n\n private offlineLicenseWrapper: HTMLElement;\n\n /* flip card to front */\n @Event()\n flipCard: EventEmitter;\n\n private emitFlipCard(showBack = false): void {\n this.flipCard.emit(showBack);\n }\n\n constructor() {\n this.emitFlipCard = this.emitFlipCard.bind(this);\n }\n\n componentWillLoad(): void {\n this.setStringOrArray();\n }\n\n componentWillUpdate(): void {\n this.setStringOrArray();\n }\n\n componentDidRender(): void {\n this.handleContentHeight();\n }\n\n private handleContentHeight(): void {\n if (!this.contentWrapper && !this.infoWrapper) {\n this.hiddenContent = false;\n\n return;\n }\n\n if (\n this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight \|\|\n this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight\n ) {\n const height =\n this.contentWrapper.offsetHeight -\n this.onlineLicenseWrapper.offsetHeight -\n this.offlineLicenseWrapper.offsetHeight;\n this.infoWrapper.style.height = `${height}px`;\n this.hiddenContent = true;\n\n return;\n }\n\n this.hiddenContent = false;\n }\n\n private setStringOrArray(): void {\n if (typeof this.data === \"string\") {\n this.cardData = JSON.parse(this.data);\n } else {\n this.cardData = this.data;\n }\n }\n\n private renderCloseIcon(): HTMLZIconElement {\n return (\n <z-icon\n name=\"multiply-circled-filled\"\n height={18}\n width={18}\n onClick={() => this.emitFlipCard(false)}\n tabindex={this.htmltabindex}\n onKeyUp={(e: KeyboardEvent) => {\n handleKeyboardSubmit(e, this.emitFlipCard, false);\n }}\n />\n );\n }\n\n private renderGeneralSection(): HTMLElement {\n const title = this?.cardData?.title;\n const description = this?.cardData?.description;\n\n return (\n <section\n class={`info-wrapper ${this.hiddenContent ? \"hidden\" : \"\"}`}\n onClick={() => {\n if (this.hiddenContent) {\n this.tooltip = !this.tooltip;\n }\n }}\n ref={(el) => (this.infoWrapper = el)}\n >\n {this.renderAuthor()}\n {this.renderYear()}\n {title}\n <br />\n {description}\n </section>\n );\n }\n\n private renderAuthor(): HTMLSpanElement {\n const author = this?.cardData?.author;\n if (!author) {\n return null;\n }\n\n return (\n <span>\n Autore: <b>{author}</b>\n <br />\n </span>\n );\n }\n\n private renderYear(): HTMLSpanElement {\n const year = this?.cardData?.year;\n if (!year) {\n return null;\n }\n\n return (\n <span>\n Anno: <b>{year}</b>\n <br />\n </span>\n );\n }\n\n private renderTooltip(): HTMLZPopoverElement {\n if (!this.tooltip) {\n return;\n }\n\n if (!this.cardData) {\n return;\n }\n const {title, year, author, description} = this.cardData;\n\n return (\n <z-popover\n position={PopoverPosition.RIGHT}\n onClick={() => (this.tooltip = false)}\n >\n {`${title} ${year} ${author} ${description}`}\n </z-popover>\n );\n }\n\n private setExpirationLicenseMessage(type: string): HTMLSpanElement {\n if (\n (type === \"online\" && this.cardData.onlineLicense.expired) \|\|\n (type === \"offline\" && this.cardData.offlineLicense.expired)\n ) {\n return <span class=\"expired\">SCADUTA</span>;\n }\n\n if (\n (type === \"online\" && this.cardData.onlineLicense.expiring) \|\|\n (type === \"offline\" && this.cardData.offlineLicense.expiring)\n ) {\n return <span class=\"expiring\">IN SCADENZA</span>;\n }\n }\n\n private renderOnlineLicenseSection(): HTMLElement {\n if (!this?.cardData?.onlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.onlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza online</span>\n {this.setExpirationLicenseMessage(\"online\")}\n </span>\n Scadenza il <b>{this.cardData.onlineLicense.expiration}</b>\n <br />\n </section>\n );\n }\n\n private renderOfflineLicenseSection(): HTMLElement {\n if (!this?.cardData?.offlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.offlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza offline</span>\n {this.setExpirationLicenseMessage(\"offline\")}\n </span>\n Scadenza il <b>{this.cardData.offlineLicense.expiration}</b>\n <br />\n Installazioni disponibili: <b>{this.cardData.offlineLicense.installations}</b>\n </section>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div>\n {this.renderCloseIcon()}\n <div\n class=\"content-wrapper\"\n ref={(el) => (this.contentWrapper = el)}\n >\n {this.renderGeneralSection()}\n {this.renderTooltip()}\n {this.renderOnlineLicenseSection()}\n {this.renderOfflineLicenseSection()}\n </div>\n <div class=\"cta-wrapper\">\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"version":3}
1	+ {"file":"z-myz-card-info.js","mappings":"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","names":["ZMyzCardInfo"],"sources":["src/snowflakes/myz/card/z-myz-card-info/styles.css?tag=z-myz-card-info&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-info/index.tsx"],"sourcesContent":[":host {\n width: 100%;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\n:host > div {\n position: relative;\n display: grid;\n width: calc(100% + calc(var(--space-unit) * 2));\n height: 402px;\n box-sizing: border-box;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 3);\n border: var(--border-size-small) solid var(--color-primary01);\n margin-left: calc(-1 * var(--space-unit));\n background: var(--color-surface01);\n border-radius: 0;\n box-shadow: 0 2px 4px 0 rgb(66 69 72 / 35%);\n}\n\n:host > div > z-icon {\n position: absolute;\n top: var(--space-unit);\n right: var(--space-unit);\n cursor: pointer;\n fill: var(--color-primary01);\n}\n\n:host > div > div.cta-wrapper {\n display: flex;\n flex-flow: column nowrap;\n align-self: end;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper {\n position: relative;\n overflow: hidden;\n align-self: stretch;\n}\n\n:host > div > div.content-wrapper > section {\n box-sizing: border-box;\n padding: var(--space-unit) 0;\n border-bottom: var(--border-size-small) solid var(--color-surface04);\n color: var(--color-surface05);\n font-size: 14px;\n line-height: 20px;\n}\n\n:host > div > div.content-wrapper > section:last-child {\n border-bottom: none;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper {\n position: relative;\n overflow: hidden;\n box-sizing: border-box;\n}\n\n:host > div > div.content-wrapper > section.info-wrapper.hidden::after {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n background: linear-gradient(180deg, rgb(255 0 0 / 0%), rgb(255 0 0 / 0%) 60%, white);\n content: \"\";\n pointer-events: none;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading {\n display: flex;\n justify-content: space-between;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expired {\n color: var(--color-primary01);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > section > span.license-heading > span.expiring {\n color: var(--color-warning01);\n font-size: 12px;\n font-weight: 600;\n}\n\n:host > div > div.content-wrapper > z-popover {\n position: absolute;\n top: 0;\n left: calc(var(--space-unit) * 4);\n}\n","import {Component, Event, EventEmitter, Prop, State, h} from \"@stencil/core\";\nimport {DictionaryData, PopoverPosition} from \"../../../../beans\";\nimport {handleKeyboardSubmit} from \"../../../../utils/utils\";\n\n/*\n @slot - content\n /\n@Component({\n tag: \"z-myz-card-info\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZMyzCardInfo {\n /* dictionary info /\n @Prop()\n data: string \| DictionaryData;\n\n /* tabindex link attribute (optional) /\n @Prop()\n htmltabindex?: number = 0;\n\n @State()\n hiddenContent = false;\n\n @State()\n tooltip = false;\n\n private cardData: DictionaryData;\n\n private contentWrapper: HTMLElement;\n\n private infoWrapper: HTMLElement;\n\n private onlineLicenseWrapper: HTMLElement;\n\n private offlineLicenseWrapper: HTMLElement;\n\n /* flip card to front */\n @Event()\n flipCard: EventEmitter;\n\n private emitFlipCard(showBack = false): void {\n this.flipCard.emit(showBack);\n }\n\n constructor() {\n this.emitFlipCard = this.emitFlipCard.bind(this);\n }\n\n componentWillLoad(): void {\n this.setStringOrArray();\n }\n\n componentWillUpdate(): void {\n this.setStringOrArray();\n }\n\n componentDidRender(): void {\n this.handleContentHeight();\n }\n\n private handleContentHeight(): void {\n if (!this.contentWrapper && !this.infoWrapper) {\n this.hiddenContent = false;\n\n return;\n }\n\n if (\n this.contentWrapper.scrollHeight > this.contentWrapper.offsetHeight \|\|\n this.infoWrapper.scrollHeight > this.infoWrapper.offsetHeight\n ) {\n const height =\n this.contentWrapper.offsetHeight -\n this.onlineLicenseWrapper.offsetHeight -\n this.offlineLicenseWrapper.offsetHeight;\n this.infoWrapper.style.height = `${height}px`;\n this.hiddenContent = true;\n\n return;\n }\n\n this.hiddenContent = false;\n }\n\n private setStringOrArray(): void {\n if (typeof this.data === \"string\") {\n this.cardData = JSON.parse(this.data);\n } else {\n this.cardData = this.data;\n }\n }\n\n private renderCloseIcon(): HTMLZIconElement {\n return (\n <z-icon\n name=\"multiply-circled-filled\"\n height={18}\n width={18}\n onClick={() => this.emitFlipCard(false)}\n tabindex={this.htmltabindex}\n onKeyUp={(e: KeyboardEvent) => {\n handleKeyboardSubmit(e, this.emitFlipCard, false);\n }}\n />\n );\n }\n\n private renderGeneralSection(): HTMLElement {\n const title = this?.cardData?.title;\n const description = this?.cardData?.description;\n\n return (\n <section\n class={`info-wrapper ${this.hiddenContent ? \"hidden\" : \"\"}`}\n onClick={() => {\n if (this.hiddenContent) {\n this.tooltip = !this.tooltip;\n }\n }}\n ref={(el) => (this.infoWrapper = el)}\n >\n {this.renderAuthor()}\n {this.renderYear()}\n {title}\n <br />\n {description}\n </section>\n );\n }\n\n private renderAuthor(): HTMLSpanElement {\n const author = this?.cardData?.author;\n if (!author) {\n return null;\n }\n\n return (\n <span>\n Autore: <b>{author}</b>\n <br />\n </span>\n );\n }\n\n private renderYear(): HTMLSpanElement {\n const year = this?.cardData?.year;\n if (!year) {\n return null;\n }\n\n return (\n <span>\n Anno: <b>{year}</b>\n <br />\n </span>\n );\n }\n\n private renderTooltip(): HTMLZPopoverElement {\n if (!this.tooltip) {\n return;\n }\n\n if (!this.cardData) {\n return;\n }\n const {title, year, author, description} = this.cardData;\n\n return (\n <z-popover\n position={PopoverPosition.RIGHT}\n onClick={() => (this.tooltip = false)}\n >\n {`${title} ${year} ${author} ${description}`}\n </z-popover>\n );\n }\n\n private setExpirationLicenseMessage(type: string): HTMLSpanElement {\n if (\n (type === \"online\" && this.cardData.onlineLicense.expired) \|\|\n (type === \"offline\" && this.cardData.offlineLicense.expired)\n ) {\n return <span class=\"expired\">SCADUTA</span>;\n }\n\n if (\n (type === \"online\" && this.cardData.onlineLicense.expiring) \|\|\n (type === \"offline\" && this.cardData.offlineLicense.expiring)\n ) {\n return <span class=\"expiring\">IN SCADENZA</span>;\n }\n }\n\n private renderOnlineLicenseSection(): HTMLElement {\n if (!this?.cardData?.onlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.onlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza online</span>\n {this.setExpirationLicenseMessage(\"online\")}\n </span>\n Scadenza il <b>{this.cardData.onlineLicense.expiration}</b>\n <br />\n </section>\n );\n }\n\n private renderOfflineLicenseSection(): HTMLElement {\n if (!this?.cardData?.offlineLicense) {\n return;\n }\n\n return (\n <section ref={(el) => (this.offlineLicenseWrapper = el)}>\n <span class=\"license-heading\">\n <span>Licenza offline</span>\n {this.setExpirationLicenseMessage(\"offline\")}\n </span>\n Scadenza il <b>{this.cardData.offlineLicense.expiration}</b>\n <br />\n Installazioni disponibili: <b>{this.cardData.offlineLicense.installations}</b>\n </section>\n );\n }\n\n render(): HTMLDivElement {\n return (\n <div>\n {this.renderCloseIcon()}\n <div\n class=\"content-wrapper\"\n ref={(el) => (this.contentWrapper = el)}\n >\n {this.renderGeneralSection()}\n {this.renderTooltip()}\n {this.renderOnlineLicenseSection()}\n {this.renderOfflineLicenseSection()}\n </div>\n <div class=\"cta-wrapper\">\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"version":3}

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: '33ab84ece48f2f9a980d82aa0a6905583004f3bb' }, this.renderList(JSON.parse(this.listdata)));
+        return h("ul", { key: '01d6967e96c5ab8f9acebbd0c107fb0168ee5c57' }, 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: '8e0eb3ea1d015394f1feb69bbca818408402a6e1' }, this.list &&
+        return (h("ul", { key: 'c7777e913e0359afc93a18a2152cd977fcbcb813' }, 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

@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { N as NavigationTabsOrientation, a as NavigationTabsSize, b as NavigationTabsKeyboardEvents } from './index2.js';
 import { d as defineCustomElement$2 } from './index9.js';
-const stylesCss = "z-navigation-tabs{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}z-navigation-tabs,z-navigation-tabs *{box-sizing:border-box}z-navigation-tabs>nav::-webkit-scrollbar{display:none}z-navigation-tabs .navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background-color:var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px var(--shadow-color-base);cursor:pointer;fill:var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));outline:none}z-navigation-tabs .navigation-button:disabled{display:none}z-navigation-tabs>nav{z-index:0;display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}z-navigation-tabs[orientation=\"horizontal\"]>nav{width:100%}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child{left:0}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child{right:0}z-navigation-tabs[orientation=\"vertical\"]{width:fit-content;flex-direction:column}z-navigation-tabs[orientation=\"vertical\"]>nav{height:100%;flex-direction:column;align-items:stretch}z-navigation-tabs[orientation=\"vertical\"] .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}z-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child{top:0}z-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child{bottom:0}z-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button{height:calc(var(--space-unit) * 4)}z-navigation-tabs>nav>*{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;gap:var(--space-unit);letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tabs>nav>a{text-decoration:none}z-navigation-tabs>nav>*:focus:focus-visible{z-index:1;box-shadow:inset 0 0 4px 3px var(--blue800)}z-navigation-tabs>nav>:not([disabled]):hover{background-color:var(--color-background)}z-navigation-tabs>nav>button[disabled]{color:var(--color-disabled03);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tabs>nav>:not([disabled]):hover,nav>[aria-selected=\"true\"]{color:var(--color-hover-secondary);fill:currentcolor}z-navigation-tabs>nav>:not([disabled]):hover::after,nav>[aria-selected=\"true\"]::after{position:absolute;background-color:var(--color-hover-secondary);content:\"\"}z-navigation-tabs[orientation=\"horizontal\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation=\"horizontal\"]>nav>[aria-selected=\"true\"]::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tabs>nav>* z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>[aria-selected=\"true\"]::after{height:var(--border-size-medium)}z-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"])>nav>* z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tabs[orientation=\"vertical\"]>nav>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tabs[orientation=\"vertical\"]>nav>*>:not(z-icon){display:none}z-navigation-tabs[orientation=\"vertical\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation=\"vertical\"]>nav>[aria-selected=\"true\"]::after{top:0;right:0;width:var(--border-size-large);height:100%}";
+const stylesCss = "z-navigation-tabs{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}z-navigation-tabs,z-navigation-tabs *{box-sizing:border-box}z-navigation-tabs>nav::-webkit-scrollbar{display:none}z-navigation-tabs .navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background-color:var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px var(--shadow-color-base);cursor:pointer;fill:var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));outline:none}z-navigation-tabs .navigation-button:disabled{display:none}z-navigation-tabs>nav{z-index:0;display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}z-navigation-tabs[orientation=\"horizontal\"]>nav{width:100%}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child{left:0}z-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child{right:0}z-navigation-tabs[orientation=\"vertical\"]{width:fit-content;flex-direction:column}z-navigation-tabs[orientation=\"vertical\"]>nav{height:100%;flex-direction:column;align-items:stretch}z-navigation-tabs[orientation=\"vertical\"] .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}z-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child{top:0}z-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child{bottom:0}z-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button{height:calc(var(--space-unit) * 4)}z-navigation-tabs>nav>*{position:relative;z-index:0;display:inline-flex;width:auto;align-items:center;justify-content:center;padding:calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);border:none;margin:0;background-color:unset;border-radius:var(--border-no-radius);color:var(--color-primary01);cursor:pointer;fill:currentcolor;font-family:var(--font-family-sans);font-size:inherit;gap:var(--space-unit);letter-spacing:inherit;line-height:inherit;outline:none;text-align:center;white-space:nowrap}z-navigation-tabs>nav>a{text-decoration:none}z-navigation-tabs>nav>*:focus:focus-visible{z-index:1;box-shadow:inset 0 0 4px 3px var(--blue800)}z-navigation-tabs>nav>:not([disabled]):hover{background-color:var(--color-background)}z-navigation-tabs>nav>button[disabled]{color:var(--color-disabled03);cursor:not-allowed;fill:currentcolor;pointer-events:all}z-navigation-tabs>nav>:not([disabled]):hover,nav>[aria-selected=\"true\"]{color:var(--color-hover-primary);fill:currentcolor}z-navigation-tabs>nav>:not([disabled]):hover::after,nav>[aria-selected=\"true\"]::after{position:absolute;background-color:var(--color-hover-primary);content:\"\"}z-navigation-tabs[orientation=\"horizontal\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation=\"horizontal\"]>nav>[aria-selected=\"true\"]::after{bottom:0;left:0;width:100%;height:var(--border-size-large)}z-navigation-tabs>nav>* z-icon{--z-icon-width:calc(var(--space-unit) * 2);--z-icon-height:calc(var(--space-unit) * 2);display:flex;margin:0}z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>*{padding:var(--space-unit) calc(var(--space-unit) * 2)}z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[size=\"small\"][orientation=\"horizontal\"]>nav>[aria-selected=\"true\"]::after{height:var(--border-size-medium)}z-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"])>nav>* z-icon{--z-icon-width:14px;--z-icon-height:14px}z-navigation-tabs[orientation=\"vertical\"]>nav>*{padding:calc(var(--space-unit) * 3) calc(var(--space-unit) * 2)}z-navigation-tabs[orientation=\"vertical\"]>nav>*>:not(z-icon){display:none}z-navigation-tabs[orientation=\"vertical\"]>nav>:not([disabled]):hover::after,z-navigation-tabs[orientation=\"vertical\"]>nav>[aria-selected=\"true\"]::after{top:0;right:0;width:var(--border-size-large);height:100%}";
 const ZNavigationTabsStyle0 = stylesCss;
 const ZNavigationTabs$1 = /*@__PURE__*/ proxyCustomElement(class ZNavigationTabs extends HTMLElement {
@@ -209,10 +209,10 @@ const ZNavigationTabs$1 = /*@__PURE__*/ proxyCustomElement(class ZNavigationTabs
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '5be0d9887946f1fe38edf5ae657c9bf2fabc8d1f', class: {
+        return (h(Host, { key: '8f134ce69da30cd0a053700a95c39a4ec9d588ed', class: {
                 "interactive-2": this.size === NavigationTabsSize.SMALL,
                 "interactive-1": this.size !== NavigationTabsSize.SMALL,
-            }, scrollable: this.canNavigate }, h("button", { key: '626765b099eb840c62ecf28a8281e0354ff63f3a', 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: 'c59992ffc3e62a55c49b7d1c312d125a97b2fec8', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'de67749daf40000757fff0148be2248127092c68', 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: '9ddc7ad7766c525f9c2226a858c5cd1e6a2bbc6a' })), h("button", { key: '4af266b3752e99fd23720a3ba38376b564d461a9', 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: '6cd04b56841f88ac636a43a043196d96dacb6c88', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
+            }, scrollable: this.canNavigate }, h("button", { key: '231f97991908054d424dbcc83fd7e65e6651e767', 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: '145b4e6220e14acfbe6c13d1da095128096064c1', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: '111d66f763a80c52fdd21a906028cb7aa4817ee7', 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: 'ea3edcae8daaa4b5ad1124957d47d05f899f3bc2' })), h("button", { key: 'b5329374d042f246c785b868a87bcf5a39d2c712', 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: '373978c44182a33ca9d844eb3fa6c6991511d63f', 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-navigation-tabs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"z-navigation-tabs.js","mappings":"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","names":["ZNavigationTabs"],"sources":["src/components/z-navigation-tabs/styles.css?tag=z-navigation-tabs","src/components/z-navigation-tabs/index.tsx"],"sourcesContent":["z-navigation-tabs {\n --z-navigation-tabs-nav-buttons-bg: ;\n --z-navigation-tabs-nav-buttons-fg: ;\n\n position: relative;\n z-index: 0;\n display: flex;\n overflow: hidden;\n flex-direction: row;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\nz-navigation-tabs,\nz-navigation-tabs * {\n box-sizing: border-box;\n}\n\nz-navigation-tabs > nav::-webkit-scrollbar {\n display: none;\n}\n\nz-navigation-tabs .navigation-button {\n position: absolute;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: none;\n margin: 0;\n background-color: var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));\n border-radius: var(--border-no-radius);\n box-shadow: 0 0 4px 1px var(--shadow-color-base);\n cursor: pointer;\n fill: var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));\n outline: none;\n}\n\nz-navigation-tabs .navigation-button:disabled {\n display: none;\n}\n\nz-navigation-tabs > nav {\n z-index: 0;\n display: flex;\n overflow: auto;\n align-items: center;\n justify-content: flex-start;\n scroll-behavior: smooth;\n\n /* hide scrollbar in Firefox /\n scrollbar-width: none;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav {\n width: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button {\n top: 0;\n width: calc(var(--space-unit) 4);\n height: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child {\n left: 0;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child {\n right: 0;\n}\n\n/* Orientation vertical /\nz-navigation-tabs[orientation=\"vertical\"] {\n width: fit-content;\n flex-direction: column;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav {\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button {\n left: 0;\n width: 100%;\n height: calc(var(--space-unit) 4);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child {\n top: 0;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child {\n bottom: 0;\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button {\n height: calc(var(--space-unit) * 4);\n}\n\n/* Style for the tabs /\n\nz-navigation-tabs > nav > {\n position: relative;\n z-index: 0;\n display: inline-flex;\n width: auto;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);\n border: none;\n margin: 0;\n background-color: unset;\n border-radius: var(--border-no-radius);\n color: var(--color-primary01);\n cursor: pointer;\n fill: currentcolor;\n font-family: var(--font-family-sans);\n font-size: inherit;\n gap: var(--space-unit);\n letter-spacing: inherit;\n line-height: inherit;\n outline: none;\n text-align: center;\n white-space: nowrap;\n}\n\nz-navigation-tabs > nav > a {\n text-decoration: none;\n}\n\nz-navigation-tabs > nav > :focus:focus-visible {\n z-index: 1;\n box-shadow: inset 0 0 4px 3px var(--blue800);\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover {\n background-color: var(--color-background);\n}\n\nz-navigation-tabs > nav > button[disabled] {\n color: var(--color-disabled03);\n cursor: not-allowed;\n fill: currentcolor;\n pointer-events: all;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover,\nnav > [aria-selected=\"true\"] {\n color: var(--color-hover-secondary);\n fill: currentcolor;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover::after,\nnav > [aria-selected=\"true\"]::after {\n position: absolute;\n background-color: var(--color-hover-secondary);\n content: \"\";\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--border-size-large);\n}\n\nz-navigation-tabs > nav > z-icon {\n --z-icon-width: calc(var(--space-unit) * 2);\n --z-icon-height: calc(var(--space-unit) * 2);\n\n display: flex;\n margin: 0;\n}\n\n/* `small` size (only available for horizontal orientation) /\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > {\n padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n height: var(--border-size-medium);\n}\n\nz-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"]) > nav > * z-icon {\n --z-icon-width: 14px;\n --z-icon-height: 14px;\n}\n\n/* Orientation Vertical /\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > {\n padding: calc(var(--space-unit) * 3) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * > :not(z-icon) {\n display: none;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"vertical\"] > nav > [aria-selected=\"true\"]::after {\n top: 0;\n right: 0;\n width: var(--border-size-large);\n height: 100%;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {NavigationTabsKeyboardEvents, NavigationTabsOrientation, NavigationTabsSize} from \"../../beans\";\n\n/*\n Navigation tabs component.\n * To select a specific tab programmatically, set the `aria-selected` attribute to `true` on the desired tab.\n * @slot - Main slot. Use `<button>` or `<a>` tags as children.\n * @cssprop --z-navigation-tabs-nav-buttons-bg - Navigation buttons background color.\n * @cssprop --z-navigation-tabs-nav-buttons-fg - Navigation buttons foreground color.\n /\n@Component({\n tag: \"z-navigation-tabs\",\n styleUrl: \"styles.css\",\n})\nexport class ZNavigationTabs {\n /\n Set `aria-label` attribute to the internal `<nav>` element with `tablist` role.\n /\n @Prop()\n ariaLabel = \"\";\n\n /\n Navigation tabs orientation.\n /\n @Prop({reflect: true})\n orientation? = NavigationTabsOrientation.HORIZONTAL;\n\n /\n Navigation tabs size.\n /\n @Prop({reflect: true})\n size? = NavigationTabsSize.BIG;\n\n /\n Index of the selected tab.\n * Useful to programmatically select a tab.\n * The tab can also be selected by setting the `aria-selected` attribute to `true` on the desired tab.\n /\n @Prop({mutable: true})\n selectedTab: number = undefined;\n\n /\n Emitted when the selected tab changes.\n * Contains the index of the new selected tab in the `detail` of the event.\n /\n @Event()\n selected: EventEmitter<number>;\n\n /\n Whether to show navigation buttons.\n /\n @State()\n canNavigate: boolean;\n\n /\n Whether backwards navigation is allowed.\n /\n @State()\n canNavigatePrev: boolean;\n\n /\n Whether forward navigation is allowed.\n /\n @State()\n canNavigateNext: boolean;\n\n @Element() host: HTMLZNavigationTabsElement;\n\n /\n Index of the last tab that held focus.\n /\n private focusedTab = undefined;\n\n /\n Reference to the `<nav>` element\n /\n private nav: HTMLElement;\n\n /\n Getter for the direction to check based on current orientation.\n /\n get direction(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Left\" : \"Top\";\n }\n\n /\n Getter for the dimension to check based on current orientation.\n /\n get dimension(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Width\" : \"Height\";\n }\n\n get tabs(): HTMLElement[] {\n return Array.from(this.nav.children) as HTMLElement[];\n }\n\n private resizeObserver: ResizeObserver;\n\n /\n Scroll into view to center the tab.\n /\n private scrollToTab(tabElement: HTMLElement): void {\n const scrollOptions = (\n this.orientation === NavigationTabsOrientation.HORIZONTAL\n ? {block: \"nearest\", inline: \"center\"}\n : {block: \"center\", inline: \"nearest\"}\n ) as ScrollIntoViewOptions;\n\n tabElement.scrollIntoView({\n behavior: \"smooth\",\n ...scrollOptions,\n });\n }\n\n /\n Scroll the navigation bar half of its size backward.\n /\n private navigateBackwards(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: 0 - this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Scroll the navigation bar half of its size forward.\n /\n private navigateForward(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Check if a keyboard event was triggered by an arrow key.\n /\n private isArrowNavigation(e: KeyboardEvent): boolean {\n return Object.values(NavigationTabsKeyboardEvents).includes(e.key as NavigationTabsKeyboardEvents);\n }\n\n /\n Check if the navigation buttons are needed.\n /\n private checkScrollVisible(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigate = this.nav[`scroll${this.dimension}`] > this.nav[`client${this.dimension}`];\n }\n\n /\n Check if navigation buttons can be enabled for each direction.\n /\n @Watch(\"canNavigate\")\n checkScrollEnabled(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigateNext =\n this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] < this.nav[`scroll${this.dimension}`];\n this.canNavigatePrev = this.nav[`scroll${this.direction}`] > 0;\n }\n\n /\n When the selected tab changes, update the `aria-selected` attribute on each tab and scroll to the selected tab.\n /\n @Watch(\"selectedTab\")\n onTabSelected(): void {\n this.tabs.forEach((tab, i) => {\n const zicon = tab.querySelector(\"z-icon\");\n const strokeIcon = zicon?.name.replace(\"-filled\", \"\");\n if (i !== this.selectedTab) {\n tab.setAttribute(\"aria-selected\", \"false\");\n tab.tabIndex = -1;\n if (zicon) {\n zicon.name = strokeIcon;\n }\n\n return;\n }\n\n if (zicon) {\n zicon.name = `${strokeIcon}-filled`;\n }\n tab.setAttribute(\"aria-selected\", \"true\");\n });\n this.selected.emit(this.selectedTab);\n if (this.selectedTab !== undefined) {\n this.scrollToTab(this.tabs[this.selectedTab]);\n }\n }\n\n /\n Handle click on the tabs.\n * @param event `click` event triggered by a child tab\n /\n @Listen(\"click\")\n handleTabClick(event: MouseEvent): void {\n const clickedTab = (event.target as HTMLElement).closest<HTMLElement>(\"[role='tab']\");\n if (!this.tabs.some((child) => child.contains(clickedTab))) {\n return;\n }\n\n this.selectedTab = this.tabs.indexOf(clickedTab);\n }\n\n /\n When a tab is focused, temporarily set to -1 the `tabindex` of the selected tab (if any) and set the `focusedTab` to the index of the focused tab.\n /\n @Listen(\"focusin\")\n onTabFocusIn(event: FocusEvent): void {\n const focused = this.tabs.findIndex((tab) => tab.contains(event.target as HTMLElement));\n if (focused === -1) {\n return;\n }\n\n if (this.selectedTab !== undefined) {\n this.tabs[this.selectedTab].tabIndex = -1;\n }\n this.focusedTab = focused;\n this.tabs[this.focusedTab].tabIndex = -1;\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /\n Handle keyboard navigation through tabs with arrow keys.\n /\n @Listen(\"keydown\")\n navigateThroughTabs(event: KeyboardEvent): void \| boolean {\n if (!this.tabs.some((tab) => tab.contains(event.target as HTMLElement)) \|\| !this.isArrowNavigation(event)) {\n return true;\n }\n\n event.preventDefault();\n if (\n (event.key === NavigationTabsKeyboardEvents.RIGHT && this.orientation == NavigationTabsOrientation.HORIZONTAL) \|\|\n (event.key === NavigationTabsKeyboardEvents.DOWN && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move forward\n this.focusedTab++;\n if (this.focusedTab >= this.tabs.length) {\n this.focusedTab = 0;\n }\n } else if (\n (event.key === NavigationTabsKeyboardEvents.LEFT && this.orientation == NavigationTabsOrientation.HORIZONTAL) \|\|\n (event.key === NavigationTabsKeyboardEvents.UP && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move backward\n this.focusedTab--;\n if (this.focusedTab < 0) {\n this.focusedTab = this.tabs.length - 1;\n }\n }\n // Ignore disabled tabs\n if (\n this.tabs[this.focusedTab].hasAttribute(\"disabled\") &&\n this.tabs[this.focusedTab].getAttribute(\"disabled\") !== \"false\"\n ) {\n return this.navigateThroughTabs(event);\n }\n\n this.tabs[this.focusedTab].focus();\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /\n If the focus is not going on a tab (`relatedTarget` is the new focused element), set to 0 the `tabindex` of the selected tab or the one of the first tab, then unset the `focusedTab`.\n */\n @Listen(\"focusout\")\n onTabFocusOut(event: FocusEvent): void {\n if (!this.tabs.some((tab) => tab.contains(event.relatedTarget as HTMLElement))) {\n this.tabs[this.selectedTab ?? 0].tabIndex = 0;\n this.focusedTab = undefined;\n }\n }\n\n connectedCallback(): void {\n this.resizeObserver = new ResizeObserver(() => this.checkScrollVisible());\n }\n\n componentDidLoad(): void {\n // Set role and tabindex to each slotted tab\n this.tabs.forEach((tab) => {\n tab.setAttribute(\"role\", \"tab\");\n tab.tabIndex = -1;\n });\n\n const preselectedTab = this.selectedTab ?? this.tabs.findIndex((tab) => tab.ariaSelected === \"true\");\n if (preselectedTab !== -1) {\n this.selectedTab = preselectedTab;\n this.tabs[preselectedTab].tabIndex = 0;\n this.onTabSelected();\n } else {\n this.tabs[0].tabIndex = 0;\n }\n\n this.resizeObserver.observe(this.nav);\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n render(): HTMLZNavigationTabsElement {\n return (\n <Host\n class={{\n \"interactive-2\": this.size === NavigationTabsSize.SMALL,\n \"interactive-1\": this.size !== NavigationTabsSize.SMALL,\n }}\n scrollable={this.canNavigate}\n >\n <button\n class=\"navigation-button\"\n onClick={this.navigateBackwards.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigatePrev}\n aria-label=\"Mostra elementi precedenti\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-left\" : \"chevron-up\"}\n width={16}\n height={16}\n />\n </button>\n\n <nav\n role=\"tablist\"\n aria-label={this.ariaLabel}\n ref={(el) => (this.nav = el ?? this.nav)}\n onScroll={this.checkScrollEnabled.bind(this)}\n aria-orientation={this.orientation}\n >\n <slot></slot>\n </nav>\n\n <button\n class=\"navigation-button\"\n onClick={this.navigateForward.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigateNext}\n aria-label=\"Mostra elementi successivi\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-right\" : \"chevron-down\"}\n width={16}\n height={16}\n />\n </button>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"z-navigation-tabs.js","mappings":"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","names":["ZNavigationTabs"],"sources":["src/components/z-navigation-tabs/styles.css?tag=z-navigation-tabs","src/components/z-navigation-tabs/index.tsx"],"sourcesContent":["z-navigation-tabs {\n --z-navigation-tabs-nav-buttons-bg: ;\n --z-navigation-tabs-nav-buttons-fg: ;\n\n position: relative;\n z-index: 0;\n display: flex;\n overflow: hidden;\n flex-direction: row;\n font-family: var(--font-family-sans);\n font-weight: var(--font-rg);\n}\n\nz-navigation-tabs,\nz-navigation-tabs * {\n box-sizing: border-box;\n}\n\nz-navigation-tabs > nav::-webkit-scrollbar {\n display: none;\n}\n\nz-navigation-tabs .navigation-button {\n position: absolute;\n z-index: 1;\n display: flex;\n align-items: center;\n justify-content: center;\n padding: 0;\n border: none;\n margin: 0;\n background-color: var(--z-navigation-tabs-nav-buttons-bg, var(--color-surface01));\n border-radius: var(--border-no-radius);\n box-shadow: 0 0 4px 1px var(--shadow-color-base);\n cursor: pointer;\n fill: var(--z-navigation-tabs-nav-buttons-fg, var(--color-primary01));\n outline: none;\n}\n\nz-navigation-tabs .navigation-button:disabled {\n display: none;\n}\n\nz-navigation-tabs > nav {\n z-index: 0;\n display: flex;\n overflow: auto;\n align-items: center;\n justify-content: flex-start;\n scroll-behavior: smooth;\n\n /* hide scrollbar in Firefox /\n scrollbar-width: none;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav {\n width: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button {\n top: 0;\n width: calc(var(--space-unit) 4);\n height: 100%;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:first-child {\n left: 0;\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] .navigation-button:last-child {\n right: 0;\n}\n\n/* Orientation vertical /\nz-navigation-tabs[orientation=\"vertical\"] {\n width: fit-content;\n flex-direction: column;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav {\n height: 100%;\n flex-direction: column;\n align-items: stretch;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button {\n left: 0;\n width: 100%;\n height: calc(var(--space-unit) 4);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:first-child {\n top: 0;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] .navigation-button:last-child {\n bottom: 0;\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"vertical\"] .navigation-button {\n height: calc(var(--space-unit) * 4);\n}\n\n/* Style for the tabs /\n\nz-navigation-tabs > nav > {\n position: relative;\n z-index: 0;\n display: inline-flex;\n width: auto;\n align-items: center;\n justify-content: center;\n padding: calc(var(--space-unit) * 2) calc(var(--space-unit) * 5);\n border: none;\n margin: 0;\n background-color: unset;\n border-radius: var(--border-no-radius);\n color: var(--color-primary01);\n cursor: pointer;\n fill: currentcolor;\n font-family: var(--font-family-sans);\n font-size: inherit;\n gap: var(--space-unit);\n letter-spacing: inherit;\n line-height: inherit;\n outline: none;\n text-align: center;\n white-space: nowrap;\n}\n\nz-navigation-tabs > nav > a {\n text-decoration: none;\n}\n\nz-navigation-tabs > nav > :focus:focus-visible {\n z-index: 1;\n box-shadow: inset 0 0 4px 3px var(--blue800);\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover {\n background-color: var(--color-background);\n}\n\nz-navigation-tabs > nav > button[disabled] {\n color: var(--color-disabled03);\n cursor: not-allowed;\n fill: currentcolor;\n pointer-events: all;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover,\nnav > [aria-selected=\"true\"] {\n color: var(--color-hover-primary);\n fill: currentcolor;\n}\n\nz-navigation-tabs > nav > :not([disabled]):hover::after,\nnav > [aria-selected=\"true\"]::after {\n position: absolute;\n background-color: var(--color-hover-primary);\n content: \"\";\n}\n\nz-navigation-tabs[orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n bottom: 0;\n left: 0;\n width: 100%;\n height: var(--border-size-large);\n}\n\nz-navigation-tabs > nav > z-icon {\n --z-icon-width: calc(var(--space-unit) * 2);\n --z-icon-height: calc(var(--space-unit) * 2);\n\n display: flex;\n margin: 0;\n}\n\n/* `small` size (only available for horizontal orientation) /\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > {\n padding: var(--space-unit) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[size=\"small\"][orientation=\"horizontal\"] > nav > [aria-selected=\"true\"]::after {\n height: var(--border-size-medium);\n}\n\nz-navigation-tabs[size=\"small\"]:not([orientation=\"vertical\"]) > nav > * z-icon {\n --z-icon-width: 14px;\n --z-icon-height: 14px;\n}\n\n/* Orientation Vertical /\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > {\n padding: calc(var(--space-unit) * 3) calc(var(--space-unit) * 2);\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > * > :not(z-icon) {\n display: none;\n}\n\nz-navigation-tabs[orientation=\"vertical\"] > nav > :not([disabled]):hover::after,\nz-navigation-tabs[orientation=\"vertical\"] > nav > [aria-selected=\"true\"]::after {\n top: 0;\n right: 0;\n width: var(--border-size-large);\n height: 100%;\n}\n","import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {NavigationTabsKeyboardEvents, NavigationTabsOrientation, NavigationTabsSize} from \"../../beans\";\n\n/*\n Navigation tabs component.\n * To select a specific tab programmatically, set the `aria-selected` attribute to `true` on the desired tab.\n * @slot - Main slot. Use `<button>` or `<a>` tags as children.\n * @cssprop --z-navigation-tabs-nav-buttons-bg - Navigation buttons background color.\n * @cssprop --z-navigation-tabs-nav-buttons-fg - Navigation buttons foreground color.\n /\n@Component({\n tag: \"z-navigation-tabs\",\n styleUrl: \"styles.css\",\n})\nexport class ZNavigationTabs {\n /\n Set `aria-label` attribute to the internal `<nav>` element with `tablist` role.\n /\n @Prop()\n ariaLabel = \"\";\n\n /\n Navigation tabs orientation.\n /\n @Prop({reflect: true})\n orientation? = NavigationTabsOrientation.HORIZONTAL;\n\n /\n Navigation tabs size.\n /\n @Prop({reflect: true})\n size? = NavigationTabsSize.BIG;\n\n /\n Index of the selected tab.\n * Useful to programmatically select a tab.\n * The tab can also be selected by setting the `aria-selected` attribute to `true` on the desired tab.\n /\n @Prop({mutable: true})\n selectedTab: number = undefined;\n\n /\n Emitted when the selected tab changes.\n * Contains the index of the new selected tab in the `detail` of the event.\n /\n @Event()\n selected: EventEmitter<number>;\n\n /\n Whether to show navigation buttons.\n /\n @State()\n canNavigate: boolean;\n\n /\n Whether backwards navigation is allowed.\n /\n @State()\n canNavigatePrev: boolean;\n\n /\n Whether forward navigation is allowed.\n /\n @State()\n canNavigateNext: boolean;\n\n @Element() host: HTMLZNavigationTabsElement;\n\n /\n Index of the last tab that held focus.\n /\n private focusedTab = undefined;\n\n /\n Reference to the `<nav>` element\n /\n private nav: HTMLElement;\n\n /\n Getter for the direction to check based on current orientation.\n /\n get direction(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Left\" : \"Top\";\n }\n\n /\n Getter for the dimension to check based on current orientation.\n /\n get dimension(): string {\n return this.orientation == NavigationTabsOrientation.HORIZONTAL ? \"Width\" : \"Height\";\n }\n\n get tabs(): HTMLElement[] {\n return Array.from(this.nav.children) as HTMLElement[];\n }\n\n private resizeObserver: ResizeObserver;\n\n /\n Scroll into view to center the tab.\n /\n private scrollToTab(tabElement: HTMLElement): void {\n const scrollOptions = (\n this.orientation === NavigationTabsOrientation.HORIZONTAL\n ? {block: \"nearest\", inline: \"center\"}\n : {block: \"center\", inline: \"nearest\"}\n ) as ScrollIntoViewOptions;\n\n tabElement.scrollIntoView({\n behavior: \"smooth\",\n ...scrollOptions,\n });\n }\n\n /\n Scroll the navigation bar half of its size backward.\n /\n private navigateBackwards(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: 0 - this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Scroll the navigation bar half of its size forward.\n /\n private navigateForward(): void {\n this.nav.scrollBy({\n [this.direction.toLowerCase()]: this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] / 2,\n behavior: \"smooth\",\n });\n }\n\n /\n Check if a keyboard event was triggered by an arrow key.\n /\n private isArrowNavigation(e: KeyboardEvent): boolean {\n return Object.values(NavigationTabsKeyboardEvents).includes(e.key as NavigationTabsKeyboardEvents);\n }\n\n /\n Check if the navigation buttons are needed.\n /\n private checkScrollVisible(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigate = this.nav[`scroll${this.dimension}`] > this.nav[`client${this.dimension}`];\n }\n\n /\n Check if navigation buttons can be enabled for each direction.\n /\n @Watch(\"canNavigate\")\n checkScrollEnabled(): void {\n if (!this.nav) {\n return;\n }\n\n this.canNavigateNext =\n this.nav[`scroll${this.direction}`] + this.nav[`client${this.dimension}`] < this.nav[`scroll${this.dimension}`];\n this.canNavigatePrev = this.nav[`scroll${this.direction}`] > 0;\n }\n\n /\n When the selected tab changes, update the `aria-selected` attribute on each tab and scroll to the selected tab.\n /\n @Watch(\"selectedTab\")\n onTabSelected(): void {\n this.tabs.forEach((tab, i) => {\n const zicon = tab.querySelector(\"z-icon\");\n const strokeIcon = zicon?.name.replace(\"-filled\", \"\");\n if (i !== this.selectedTab) {\n tab.setAttribute(\"aria-selected\", \"false\");\n tab.tabIndex = -1;\n if (zicon) {\n zicon.name = strokeIcon;\n }\n\n return;\n }\n\n if (zicon) {\n zicon.name = `${strokeIcon}-filled`;\n }\n tab.setAttribute(\"aria-selected\", \"true\");\n });\n this.selected.emit(this.selectedTab);\n if (this.selectedTab !== undefined) {\n this.scrollToTab(this.tabs[this.selectedTab]);\n }\n }\n\n /\n Handle click on the tabs.\n * @param event `click` event triggered by a child tab\n /\n @Listen(\"click\")\n handleTabClick(event: MouseEvent): void {\n const clickedTab = (event.target as HTMLElement).closest<HTMLElement>(\"[role='tab']\");\n if (!this.tabs.some((child) => child.contains(clickedTab))) {\n return;\n }\n\n this.selectedTab = this.tabs.indexOf(clickedTab);\n }\n\n /\n When a tab is focused, temporarily set to -1 the `tabindex` of the selected tab (if any) and set the `focusedTab` to the index of the focused tab.\n /\n @Listen(\"focusin\")\n onTabFocusIn(event: FocusEvent): void {\n const focused = this.tabs.findIndex((tab) => tab.contains(event.target as HTMLElement));\n if (focused === -1) {\n return;\n }\n\n if (this.selectedTab !== undefined) {\n this.tabs[this.selectedTab].tabIndex = -1;\n }\n this.focusedTab = focused;\n this.tabs[this.focusedTab].tabIndex = -1;\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /\n Handle keyboard navigation through tabs with arrow keys.\n /\n @Listen(\"keydown\")\n navigateThroughTabs(event: KeyboardEvent): void \| boolean {\n if (!this.tabs.some((tab) => tab.contains(event.target as HTMLElement)) \|\| !this.isArrowNavigation(event)) {\n return true;\n }\n\n event.preventDefault();\n if (\n (event.key === NavigationTabsKeyboardEvents.RIGHT && this.orientation == NavigationTabsOrientation.HORIZONTAL) \|\|\n (event.key === NavigationTabsKeyboardEvents.DOWN && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move forward\n this.focusedTab++;\n if (this.focusedTab >= this.tabs.length) {\n this.focusedTab = 0;\n }\n } else if (\n (event.key === NavigationTabsKeyboardEvents.LEFT && this.orientation == NavigationTabsOrientation.HORIZONTAL) \|\|\n (event.key === NavigationTabsKeyboardEvents.UP && this.orientation == NavigationTabsOrientation.VERTICAL)\n ) {\n // Move backward\n this.focusedTab--;\n if (this.focusedTab < 0) {\n this.focusedTab = this.tabs.length - 1;\n }\n }\n // Ignore disabled tabs\n if (\n this.tabs[this.focusedTab].hasAttribute(\"disabled\") &&\n this.tabs[this.focusedTab].getAttribute(\"disabled\") !== \"false\"\n ) {\n return this.navigateThroughTabs(event);\n }\n\n this.tabs[this.focusedTab].focus();\n this.scrollToTab(this.tabs[this.focusedTab]);\n }\n\n /\n If the focus is not going on a tab (`relatedTarget` is the new focused element), set to 0 the `tabindex` of the selected tab or the one of the first tab, then unset the `focusedTab`.\n */\n @Listen(\"focusout\")\n onTabFocusOut(event: FocusEvent): void {\n if (!this.tabs.some((tab) => tab.contains(event.relatedTarget as HTMLElement))) {\n this.tabs[this.selectedTab ?? 0].tabIndex = 0;\n this.focusedTab = undefined;\n }\n }\n\n connectedCallback(): void {\n this.resizeObserver = new ResizeObserver(() => this.checkScrollVisible());\n }\n\n componentDidLoad(): void {\n // Set role and tabindex to each slotted tab\n this.tabs.forEach((tab) => {\n tab.setAttribute(\"role\", \"tab\");\n tab.tabIndex = -1;\n });\n\n const preselectedTab = this.selectedTab ?? this.tabs.findIndex((tab) => tab.ariaSelected === \"true\");\n if (preselectedTab !== -1) {\n this.selectedTab = preselectedTab;\n this.tabs[preselectedTab].tabIndex = 0;\n this.onTabSelected();\n } else {\n this.tabs[0].tabIndex = 0;\n }\n\n this.resizeObserver.observe(this.nav);\n }\n\n disconnectedCallback(): void {\n this.resizeObserver?.disconnect();\n }\n\n render(): HTMLZNavigationTabsElement {\n return (\n <Host\n class={{\n \"interactive-2\": this.size === NavigationTabsSize.SMALL,\n \"interactive-1\": this.size !== NavigationTabsSize.SMALL,\n }}\n scrollable={this.canNavigate}\n >\n <button\n class=\"navigation-button\"\n onClick={this.navigateBackwards.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigatePrev}\n aria-label=\"Mostra elementi precedenti\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-left\" : \"chevron-up\"}\n width={16}\n height={16}\n />\n </button>\n\n <nav\n role=\"tablist\"\n aria-label={this.ariaLabel}\n ref={(el) => (this.nav = el ?? this.nav)}\n onScroll={this.checkScrollEnabled.bind(this)}\n aria-orientation={this.orientation}\n >\n <slot></slot>\n </nav>\n\n <button\n class=\"navigation-button\"\n onClick={this.navigateForward.bind(this)}\n tabIndex={-1}\n disabled={!this.canNavigateNext}\n aria-label=\"Mostra elementi successivi\"\n hidden={!this.canNavigate}\n >\n <z-icon\n name={this.orientation === NavigationTabsOrientation.HORIZONTAL ? \"chevron-right\" : \"chevron-down\"}\n width={16}\n height={16}\n />\n </button>\n </Host>\n );\n }\n}\n"],"version":3}

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: '5bc1e8046c14e46f02f9667939709a267cb1265a' }, this.contenticonname && (h("z-icon", { key: '7a944afae100f5fea48ca8499b6a0a035a6d289e', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '038391eb846f043bc83c236e6e18998797bcb7a3', class: "content-container" }, h("div", { key: '330233ee7524fb271ffa5231a86b6cd906b2994d', class: "content-text" }, h("slot", { key: '290343fa633f1969d4f1059047797b16c3da9860' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '096b5cfdb55bac40adc9b2f56b9a4dc739ad4cc1', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '80d985cbcd6501f9640dc2e16ac978de731a0d24', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'd7fe5573c93ac7ab36ccbecc01972b8d3cccc8bd', name: "multiply-circle", width: 16, height: 16 })))));
+        return (h(Host, { key: 'a9024960c6f2dc0ece7aa520041ca72c8b57a480' }, this.contenticonname && (h("z-icon", { key: '8e03da23ac3ea16294466b45cf571003299e12ff', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '65872d76a4f4be94181a60eede48ba8729be6fe4', class: "content-container" }, h("div", { key: '6f1abfbd2e8f86f4cfdf63f3ffaa87fb7d0abcd7', class: "content-text" }, h("slot", { key: '8537004a8679d3e1fb5eed9ca4fc36611b7355a3' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '8fff1a74d49404718d7b9e160a26fb659ded1855', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '1969d8f6609b65444366b5b757729a7930d91630', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: 'ebfb4631d790f2406c7475b8adc123872db7e145', 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: 'ef073bc38e7b79bde2973898d73007aa4adfe103', class: "otp-container" }, h("div", { key: 'cfe112903058316aa1388a409887a36b8851b8e2', class: "digits-container" }, this.otp.map((_val, i) => (h("input", { class: this.status == InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
+        return (h("div", { key: '94853e28f7436d7d36a714903652859b8946d815', class: "otp-container" }, h("div", { key: '064503a5920f0b6db493b0a0514019674647ce65', 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: '421d350536cc5a6b7de7ba47868bcd98c204c166', 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: '915a9e80bb6c9e775e029fa6c2680f9fe4720f4b', message: this.message, status: this.status })));
     }
     static get style() { return ZOtpStyle0; }
 }, [1, "z-otp", {

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

@@ -20,12 +20,12 @@ const ZPanelElem$1 = /*@__PURE__*/ proxyCustomElement(class ZPanelElem extends H
     }
     render() {
         const elemId = this.elemid ? this.elemid : "";
-        return (h("div", { key: '28f5d98850bf13270b4ddf9585722c39f87ee12e', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '065c198cfef6d982df79871d084454f425e0d57d', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '5b42b99982e78dea89cf144a717e619b65904ab9', src: this.imgurl, alt: this.imgalt }))), h("div", { key: 'd15c0e008ca2f5172228217b5418d263a59af932', class: "panel-elem-link" }, h("a", { key: 'ca5a726f71b2dd8de6ddf1f32864bc2cdd823730', class: {
+        return (h("div", { key: 'f7a46055c7c9c6b8c55f7eab312975c2469d92f3', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: '7371ab7dcd59e19ddc29e92cdcd7d53791736b2a', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '84b88cb9a9fe9fa95052cbfc200fa82b157fff19', src: this.imgurl, alt: this.imgalt }))), h("div", { key: 'f0e28a73c56a4d348c8b2b9c05fc6fa205136bac', class: "panel-elem-link" }, h("a", { key: 'cc34e31fa64a26eaf94941840d19af34623da9dd', class: {
                 "z-link": true,
                 "z-link-disabled": this.isdisabled,
                 "z-link-icon": true,
                 "z-link-blue": true,
-            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: 'b8f07a80e9260bb0a142037d3f6a64a64acebafb', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '8d6524f5e8b70798cd846d4c99a2631161ae265d', class: "panel-elem-desc" }, h("slot", { key: 'b122e24bbb3ee418a393b348157f54fad3a6f1a9', name: this.descrSlotName })))));
+            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: '438e5e90d9754effc32825029f2198a3ea0d4be3', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '8ba6727d7d11fe869a3e973a1a065b70b42dfe43', class: "panel-elem-desc" }, h("slot", { key: '887ea4cfc7950c97226fe8566e3ef49b0ecbf87b', name: this.descrSlotName })))));
     }
     static get style() { return ZPanelElemStyle0; }
 }, [6, "z-panel-elem", {

package/dist/components/z-range-picker.js CHANGED Viewed

@@ -338,14 +338,14 @@ const ZRangePicker$1 = /*@__PURE__*/ proxyCustomElement(class ZRangePicker exten
             onStopTyping: this.onStopTyping.bind(this),
             value: "",
         };
-        return (h("div", { key: '218859a883b75a370836a60ee42a611cee89829a', class: {
+        return (h("div", { key: 'a53d148ab03744a1f3db628f7b246c24c5974c64', class: {
                 ["range-pickers-container"]: true,
                 [this.mode]: true,
                 [this.activeInput]: true,
                 [this.flatpickrPosition]: true,
-            } }, h("div", { key: '6367639ca9b53bb5052a4313e0232466dd64750a', class: `${this.rangePickerId}-1-wrapper` }, h("div", { key: '31bb99a98433f3c2a6c454dae3dfa93886e05d66', class: `${this.rangePickerId}-1-container` }, h("z-input", Object.assign({ key: 'b5d3566e21429694e585169d32876c1b2767d03b' }, zInputProps, { placeholder: this.firstPickerPlaceholder, readonly: this.firstPickerReadOnly, "data-input": "data-input", class: `start-input ${this.rangePickerId}-1`, ariaLabel: this.firstAriaLabel, label: this.firstLabel, status: this.firstInputError && InputStatus.ERROR, onStartTyping: () => {
+            } }, h("div", { key: 'b48ad8c0946dbf4d293ab727d48434377754bcd2', class: `${this.rangePickerId}-1-wrapper` }, h("div", { key: 'fdf59e2f5910fa066ab81ad9e43af5e88f26ec17', class: `${this.rangePickerId}-1-container` }, h("z-input", Object.assign({ key: 'd850efc6a9d2d1405b201fc200cd1b624e0fd3db' }, zInputProps, { placeholder: this.firstPickerPlaceholder, readonly: this.firstPickerReadOnly, "data-input": "data-input", class: `start-input ${this.rangePickerId}-1`, ariaLabel: this.firstAriaLabel, label: this.firstLabel, status: this.firstInputError && InputStatus.ERROR, onStartTyping: () => {
                 this.firstInputError = false;
-            } })))), h("div", { key: 'daa8bcca99e4647b3baf28ab509f7dceb4de6819', class: `${this.rangePickerId}-2-wrapper` }, h("div", { key: 'fb9c4f6d22da2f354f6b96cf2e7171f797a49904', class: `${this.rangePickerId}-2-container` }, h("z-input", Object.assign({ key: '616fb784c3d748b76249c503ffea58883ec84c6e' }, zInputProps, { placeholder: this.lastPickerPlaceholder, readonly: this.lastPickerReadOnly, "data-input": "data-input", class: `end-input ${this.rangePickerId}-2`, ariaLabel: this.secondAriaLabel, label: this.secondLabel, status: this.lastInputError && InputStatus.ERROR, onStartTyping: () => {
+            } })))), h("div", { key: '5d033db058bb143ac0cca9020605f6ab9153cc0d', class: `${this.rangePickerId}-2-wrapper` }, h("div", { key: 'eabdc4b1a5703a349c8b3d978970b77278352a53', class: `${this.rangePickerId}-2-container` }, h("z-input", Object.assign({ key: 'bfd97975a2dd54710ce8da89c8debb68b7fc3af3' }, zInputProps, { placeholder: this.lastPickerPlaceholder, readonly: this.lastPickerReadOnly, "data-input": "data-input", class: `end-input ${this.rangePickerId}-2`, ariaLabel: this.secondAriaLabel, label: this.secondLabel, status: this.lastInputError && InputStatus.ERROR, onStartTyping: () => {
                 this.lastInputError = false;
             } }))))));
     }

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: '210ee0186531e1ec5e3fce429377bd623a5a5e7e' }, h("slot", { key: '6762e419de9b01f89a196fdbba849de55a395c0f', name: "secondary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (h("z-divider", { key: '46292b4fe512a726fa41b35b48329f2e419377b8', size: DividerSize.LARGE, color: "z-section-title--divider-color" })), h("slot", { key: '5f1ea29a3a742d12c41b58a6e7b6004c5819bac8', name: "primary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (h("z-divider", { key: '43f9b568633850a8fb94457ecf091b37d16e6b49', size: DividerSize.LARGE, color: "z-section-title--divider-color" }))));
+        return (h(Host, { key: 'cc1204e8c23b71671a14fbaedd761f748f277cfa' }, h("slot", { key: '8272a7661bda0190963225a5ffaa192e22601363', name: "secondary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.BEFORE && (h("z-divider", { key: '7eae53ac6122253f61d985c79549ff65b85e10ff', size: DividerSize.LARGE, color: "z-section-title--divider-color" })), h("slot", { key: '9b86031ca0776ac5faae2393e62ad8104d5e804e', name: "primary-title" }), !this.hasSecondaryTitle && this.dividerPosition === ZSectionTitleDividerPosition.AFTER && (h("z-divider", { key: '6d3de14737fc2187f8a32d5e27aeae12ab9e83c5', 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

@@ -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: '325c38217b549ab622be127a8a901dff1fad2958', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
+        return (h("div", { key: '1ad24c71d6838f434592d96047388b0fb3886127', 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

@@ -48,7 +48,7 @@ const ZSkipToContent$1 = /*@__PURE__*/ proxyCustomElement(class ZSkipToContent e
         this.visible = false;
     }
     render() {
-        return (h(Host, { key: '650e3f4b6003f0acbe974f84772c0ec12bea6688', class: {
+        return (h(Host, { key: '3887a0d40964e8bb4dd860e49dccca7863f2a902', class: {
                 [this.variant]: true,
                 "skip-to-content-visible": this.visible,
             } }, this.links.map((link, i) => {

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: 'f8a0f271d547b905319ca2e80996c108014d38a0', role: "listitem" }, h("button", Object.assign({ key: '6dba08cfde906db5a15cb0832f144a7e3df58252', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: 'ac991a5b351766e7ced9af2e4126e26aebf4f672', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: 'e844c4090022591132232e5c900228da281db3f3' }, h("slot", { key: '67928b105765cbe691e51c221ebefda23d7351c2' })))));
+        return (h(Host, { key: '2e45354c628f043ce2a9246a0ffb8e94235ae669', role: "listitem" }, h("button", Object.assign({ key: '854de9a3ea272425e75c81e0d116bd04fcda2c2d', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: '06754f85e70407535e1ae0e80dcf8015d33a8112', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: '9bfeda701f57ba6c263be0a986abe03c76009acd' }, h("slot", { key: 'c3abd1dae057323d41ee7a14bf5398e2e2a71ccf' })))));
     }
     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: 'ae157efced49b287a294c00090b5a104a4317401', role: "list" }, h("slot", { key: 'a1509aa8285d3166f3fe18c51205a829053fad33' })));
+        return (h(Host, { key: '1dd60e057dc5910e320df088512d2bd3dd5b1e4a', role: "list" }, h("slot", { key: '721b83774cdf84979db9c204986c84174d56fc0a' })));
     }
     static get style() { return ZStepperStyle0; }
 }, [1, "z-stepper"]);

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

@@ -37,7 +37,7 @@ const ZTable$1 = /*@__PURE__*/ proxyCustomElement(class ZTable extends HTMLEleme
         (_a = this.expandableMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '7602276238afd3af11a9c726342c74bbbfac85d0', expandable: this.expandable }, h("div", { key: '4e3828976db3f5544e5e7cd06e7b202cea4d057b', class: "table", role: "table" }, h("slot", { key: '3ef322ee93aad5a10b0124c37cf0ec705887de78' }))));
+        return (h(Host, { key: '8cc330079f36a6c9112ef15dd5bb66f7c0e07db5', expandable: this.expandable }, h("div", { key: '5b9783130bb30d5e0dc3e62c132b043900cb746f', class: "table", role: "table" }, h("slot", { key: 'e339c4892e8c433fb79e054ac47e45c8a6ac40e5' }))));
     }
     get host() { return this; }
     static get style() { return ZTableStyle0; }

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

@@ -10,7 +10,7 @@ const ZTbody$1 = /*@__PURE__*/ proxyCustomElement(class ZTbody extends HTMLEleme
         this.__attachShadow();
     }
     render() {
-        return (h(Host, { key: 'a7208d0d031f76bfa40ffe4de23ea9041c6ea831', role: "rowgroup" }, h("slot", { key: '4b1a52cb57149602312c46ccf556105dd05dd6e5' })));
+        return (h(Host, { key: 'b704110bd5823c470d18953bc24db09da7c66e8a', role: "rowgroup" }, h("slot", { key: 'd71e881ccc992ac2a8e97efa8617d33c63ae1003' })));
     }
     static get style() { return ZTbodyStyle0; }
 }, [1, "z-tbody"]);

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

@@ -36,7 +36,7 @@ const ZTd$1 = /*@__PURE__*/ proxyCustomElement(class ZTd extends HTMLElement {
         this.updateColspan();
     }
     render() {
-        return (h(Host, { key: 'c96cf294eb95aced8d590b86aab1ca5480f557b4', role: "cell", "menu-open": this.isMenuOpen }, h("div", { key: 'a11209b080873ab385f1dbd0d1e82c328483d4da', class: "cell--content" }, h("slot", { key: '15c2db2d84a1d164e849a4e4b0ab4074b465be2b' }), this.showMenu && (h("div", { key: 'e7b55b57dea2f10c0a00a1bfa1af205db14ca392', class: "cell--menu-container prevent-expand" }, h("z-button", { key: 'f22b017419929e9d3589a405f389715ccc549150', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: '03511331c070e5ccc6875e5483112c5a09a5b60f', class: "cell-popover", ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: '64e8b88b6c327df0a836028c16bd3249f8c906cb', name: "contextual-menu" })))))));
+        return (h(Host, { key: 'f7de551489427a62939270e957e45f4dbfd2e276', role: "cell", "menu-open": this.isMenuOpen }, h("div", { key: 'c3bab70a1017dcf030e0a57d36da2a46472b6d94', class: "cell--content" }, h("slot", { key: 'bab52a837654d4d72d34a04a6fac360f46d00485' }), this.showMenu && (h("div", { key: '657f551215f6b9c6cdcc0a5c3727dc1270fa5fe5', class: "cell--menu-container prevent-expand" }, h("z-button", { key: '42b96474d307462bf80defd4014e94dc479fde65', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: '02c317216820acbc543100ca4368a2f441eaae9f', class: "cell-popover", ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: 'b765e4b58ed69fe10a8337e929b0dc156cfce650', name: "contextual-menu" })))))));
     }
     get host() { return this; }
     static get watchers() { return {

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

@@ -11,7 +11,7 @@ const ZTfoot$1 = /*@__PURE__*/ proxyCustomElement(class ZTfoot extends HTMLEleme
         this.sticky = false;
     }
     render() {
-        return (h(Host, { key: '5fa9603626d56fd5d7fc85ab116f4951c0ab01a9', role: "rowgroup" }, h("slot", { key: 'd47ca57a00753b01cbfecbd1d562bb0c1b6e0124' })));
+        return (h(Host, { key: '86efe92f23250e482ef7e9c0b646d28f294214c6', role: "rowgroup" }, h("slot", { key: '07ff4d3ad791419325d865160a229b228d9f0626' })));
     }
     static get style() { return ZTfootStyle0; }
 }, [1, "z-tfoot", {

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

@@ -56,7 +56,7 @@ const ZTh$1 = /*@__PURE__*/ proxyCustomElement(class ZTh extends HTMLElement {
         this.updateColspan();
     }
     render() {
-        return (h(Host, { key: '5ea086aa83da4bdc245d82f50ec7a186fcce54a7', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection, sortable: this.showSorting }, h("div", { key: 'a08e8debed6426e8eafc004f1814138e380c5643', class: "cell--content" }, h("slot", { key: '11df8e88b9e461f4dc9f88c24f523f547a68915c' }), this.showSorting && (h("button", { key: '7f3d8359643bab1c059a91c560ad78da5ffb2ec4', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, h("z-icon", { key: '0c64ba36dec7525af81baa06b86edf877e20d747', name: this.sortDirection === SortDirection.DESC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (h("div", { key: '88256cc6195d18f59b9b2bfb7272d1f95647c780', class: "cell--menu-container" }, h("z-button", { key: '9f69efcfabbc7e0324ae57d13b8c5efc33a61161', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: () => (this.popoverEl.open = !this.popoverEl.open) }), h("z-popover", { key: 'de589ec650b5c43f21722f010cdc2dc4ac2ac5b7', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: 'f840e0e36d3ea8f751c3c598e62ab4783422b51b', name: "contextual-menu" })))))));
+        return (h(Host, { key: '29d00b9cca980ef969f1e5437497fb8d3813fcc0', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection, sortable: this.showSorting }, h("div", { key: 'e1aa40618413575fedcc7e627280669e064054f8', class: "cell--content" }, h("slot", { key: '842da5d5c6c500e8706203ed07a0dd243d26b42c' }), this.showSorting && (h("button", { key: 'ef2473dc91e989eb398a667c8a73bb7579082258', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, h("z-icon", { key: '17c11e9ada49d94c13173380fafeaff4deae1ec9', name: this.sortDirection === SortDirection.DESC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (h("div", { key: 'db09ba4db62162a09966b0554d80bcc4f1e254a8', class: "cell--menu-container" }, h("z-button", { key: 'fb3027cdca8658a2616a5612b02641f8a5dafeb0', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: () => (this.popoverEl.open = !this.popoverEl.open) }), h("z-popover", { key: '25c3d7bd294a9384e606220930073e530db7c0ae', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: '95be7b90aee8feb2904a982fe59355e461df9c46', name: "contextual-menu" })))))));
     }
     get host() { return this; }
     static get watchers() { return {

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

@@ -11,7 +11,7 @@ const ZThead$1 = /*@__PURE__*/ proxyCustomElement(class ZThead extends HTMLEleme
         this.sticky = false;
     }
     render() {
-        return (h(Host, { key: '3d8fc0d5ebe1a7459f3af8773b6fed710521ddbb', role: "rowgroup" }, h("slot", { key: '7ac6ee2f4bd099f45f805a79471bf10f900665bb' })));
+        return (h(Host, { key: 'ef0a3c17f7163b6bdb0d43d21cb1ac6607f53e7c', role: "rowgroup" }, h("slot", { key: '80b4a406f26e0c637972e663d99707431d39e9a4' })));
     }
     static get style() { return ZTheadStyle0; }
 }, [1, "z-thead", {

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: 'cd4b2b969f72e982a2af778217d5db44a53a241d', name: "toasts" });
+        return h("slot", { key: 'fcca8c71a9eca7ada8de9d23d4930ec6796b2925', name: "toasts" });
     }
     get hostElement() { return this; }
     static get watchers() { return {

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

@@ -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: '6996fc6d26f43d53ce4a84af8ce88f2f7b0881d6', style: {
+        return (h(Host, { key: 'c8254b294f52c92c404a2e610e95247597be5e69', style: {
                 "--percentuale": `${this.percentage}%`,
             }, class: this.transition ? this.transition : ToastNotificationTransition.SLIDE_IN_DOWN, onAnimationEnd: (e) => {
                 if (this.autoclose && e.animationName.includes("slidein")) {

package/dist/components/z-toggle-button.js CHANGED Viewed

@@ -24,10 +24,10 @@ const ZToggleButton$1 = /*@__PURE__*/ proxyCustomElement(class ZToggleButton ext
         this.toggleClick.emit(this.opened);
     }
     render() {
-        return (h("button", { key: '618ba6196aca932ec95f09ac4257490a7b44307e', tabindex: this.avoidclick ? "-1" : "0", class: {
+        return (h("button", { key: '6df0aee8dfd4785cd9787b2940c12cc3d680ef0c', tabindex: this.avoidclick ? "-1" : "0", class: {
                 "isopen": this.opened,
                 "avoid-clicks": this.avoidclick,
-            }, disabled: this.isdisabled, "aria-expanded": this.opened ? "true" : "false", "aria-label": this.ariaLabel, onClick: () => this.emitToggleClick() }, h("z-icon", { key: '9f61896b532d6b2ff5871b819c696e5841c1a846', name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
+            }, disabled: this.isdisabled, "aria-expanded": this.opened ? "true" : "false", "aria-label": this.ariaLabel, onClick: () => this.emitToggleClick() }, h("z-icon", { key: 'ab52cd6023b492b5bba8086fd189112e5329c3ad', name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
     }
     static get style() { return ZToggleButtonStyle0; }
 }, [1, "z-toggle-button", {

package/dist/components/z-toggle-switch.js CHANGED Viewed

@@ -30,14 +30,14 @@ const ZToggleSwitch$1 = /*@__PURE__*/ proxyCustomElement(class ZToggleSwitch ext
         this.emitToggleClick();
     }
     render() {
-        return (h(Host, { key: '0c2885fb82345e947645a79c3e5def0a3b737662' }, h("input", { key: 'c0efd12ba3be01dd9a1690ae986307610f89bf82', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), h("label", { key: '650981ed46a574db5080cf8e80d80d8dd061abeb', htmlFor: this.htmlid, class: {
+        return (h(Host, { key: 'b572a91e4ed2f91cbe0b7a393371425a5b9b896a' }, h("input", { key: 'acff3447044eba6dd7622feb954a03d5503111f1', id: this.htmlid, type: "checkbox", checked: this.checked, disabled: this.disabled, onChange: this.handleClick.bind(this) }), h("label", { key: '58b70932d34e39bb1c078947eea614d6384b9660', htmlFor: this.htmlid, class: {
                 [this.labelPosition]: true,
                 disabled: this.disabled,
-            } }, h("span", { key: '08db77612f5a9ccc4063b0f52ccbb7344d9425e3' }, h("slot", { key: 'f0b2dafb9cca88f76cd35d745bbcc303d6d70eb2' })), h("span", { key: 'dd04ef3a424de42010ba1045d408864c3717bc13', class: {
+            } }, h("span", { key: '824e029aeb434813b35f72891d991f19a90daded' }, h("slot", { key: '37e8bad4378c65f4a3411fee47a960b9220af5d3' })), h("span", { key: '55eaf2b824ce8e91b77b5f8f2677724b2834fad6', class: {
                 container: true,
                 disabled: this.disabled,
                 checked: this.checked,
-            } }, h("span", { key: '4972f1e42c31aac73c38154c8a876dc724051e1d', class: "circle" }, this.checked && (h("z-icon", { key: '8fe5b87e25cf8bd654c3d5724b6be55bcdbe0526', width: 12, height: 12, name: "checkmark" })))))));
+            } }, h("span", { key: '41b7660f89b5ba9829782d3e6b041323357fdefa', class: "circle" }, this.checked && (h("z-icon", { key: 'ae68c35e2765c6eece7dcee8f7ad570a6fc0aa34', width: 12, height: 12, name: "checkmark" })))))));
     }
     static get style() { return ZToggleSwitchStyle0; }
 }, [6, "z-toggle-switch", {

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

@@ -20,7 +20,7 @@ const ZTooltip$1 = /*@__PURE__*/ proxyCustomElement(class ZTooltip extends HTMLE
         this.open = this.popoverEl.open;
     }
     render() {
-        return (h("z-popover", { key: '831b57e3c75c0bc9429a5e887b8cc30cc8eec4f9', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true }, h("slot", { key: 'b578489e880d9aad1e4a116444d2594025db32e6' })));
+        return (h("z-popover", { key: 'fdca98f95640bac81d7cf60e1fc0f8c4536f7021', ref: (el) => (this.popoverEl = el), bindTo: this.bindTo, open: this.open, position: this.position, closable: this.closable, center: true, showArrow: true }, h("slot", { key: 'd2143919460695e98cf114c4cb07ae75108c9f1d' })));
     }
     static get style() { return ZTooltipStyle0; }
 }, [1, "z-tooltip", {

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

@@ -45,7 +45,7 @@ const ZTr$1 = /*@__PURE__*/ proxyCustomElement(class ZTr extends HTMLElement {
         this.updateColumns();
     }
     render() {
-        return (h(Host, { key: '05feb412d364f3867c154b3f128edf3ccb4dbd90', role: "row", onClick: this.onRowClick.bind(this), expanded: this.expanded }, h("div", { key: '48d1b43a7dcd498c19d6f810c3544a23a7015c83', class: "z-tr--expand-button-container" }, this.expandable && (h("button", { key: '2e5a9face06dfea67620ef006b1334fba6de1da3', "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, h("z-icon", { key: '2ba713fd43eda1b30443e32832694e4514b617d3', name: this.expanded ? "minus-circled" : "plus-circled" })))), h("slot", { key: 'c4d343123c734c1b65a96306d8b82079f264d43e', onSlotchange: this.updateColumns.bind(this) })));
+        return (h(Host, { key: '467c0a01f3c28851b85d47bd178e6555cbb3f57f', role: "row", onClick: this.onRowClick.bind(this), expanded: this.expanded }, h("div", { key: 'ff2c7ecbc7775ee60951a3df3e7ecf67a6d77362', class: "z-tr--expand-button-container" }, this.expandable && (h("button", { key: 'fe1297aafa51d66acd09794bf47333079bc90604', "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, h("z-icon", { key: '517ffd66223d3ca7dc093aaa730455a02e6a61fd', name: this.expanded ? "minus-circled" : "plus-circled" })))), h("slot", { key: 'cead9ff3b1da3cf20982bdc87413414925264c40', onSlotchange: this.updateColumns.bind(this) })));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-visually-hidden.js CHANGED Viewed

@@ -10,7 +10,7 @@ const ZVisuallyHidden$1 = /*@__PURE__*/ proxyCustomElement(class ZVisuallyHidden
         this.__attachShadow();
     }
     render() {
-        return h("slot", { key: 'f34bff11c258d464016d3963268b24ea73e2e6ac' });
+        return h("slot", { key: '7c7caddb01b7e2278f956face2065ac1c843ddc5' });
     }
     static get style() { return ZVisuallyHiddenStyle0; }
 }, [1, "z-visually-hidden"]);

package/dist/esm/{index-daf6dc52.js → index-04335eea.js} RENAMED Viewed

@@ -9,11 +9,11 @@ const ZTfoot = class {
         this.sticky = false;
     }
     render() {
-        return (h(Host, { key: '5fa9603626d56fd5d7fc85ab116f4951c0ab01a9', role: "rowgroup" }, h("slot", { key: 'd47ca57a00753b01cbfecbd1d562bb0c1b6e0124' })));
+        return (h(Host, { key: '86efe92f23250e482ef7e9c0b646d28f294214c6', role: "rowgroup" }, h("slot", { key: '07ff4d3ad791419325d865160a229b228d9f0626' })));
     }
 };
 ZTfoot.style = ZTfootStyle0;
 export { ZTfoot as Z };
-//# sourceMappingURL=index-daf6dc52.js.map
+//# sourceMappingURL=index-04335eea.js.map

package/dist/esm/{index-daf6dc52.js.map → index-04335eea.js.map} RENAMED Viewed

	@@ -1 +1 @@
1	- {"file":"index-~~daf6dc52~~.js","mappings":";;AAAA,MAAM,SAAS,GAAG,kOAAkO,CAAC;AACrP,qBAAe,SAAS;;MCUX,MAAM;;;sBAKR,KAAK;;IAEd,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,IACnB,8DAAa,CACR,EACP;KACH;;;;;;","names":[],"sources":["src/components/table/z-tfoot/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/table/z-tfoot/index.tsx"],"sourcesContent":[":host {\n display: block;\n box-sizing: border-box;\n border-top: 1px solid var(--color-surface03);\n border-bottom: 1px solid var(--color-surface03);\n}\n\n:host([sticky]) {\n position: sticky;\n z-index: 1;\n bottom: 0;\n background-color: var(--color-surface01);\n}\n","import {Component, Host, Prop, h} from \"@stencil/core\";\n\n/*\n ZTFoot component.\n * @slot - ZTFoot content (`z-tr`).\n /\n@Component({\n tag: \"z-tfoot\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZTfoot {\n /\n If true, the footer will be stuck to the bottom of the table.\n */\n @Prop({reflect: true})\n sticky = false;\n\n render(): void {\n return (\n <Host role=\"rowgroup\">\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}
1	+ {"file":"index-04335eea.js","mappings":";;AAAA,MAAM,SAAS,GAAG,kOAAkO,CAAC;AACrP,qBAAe,SAAS;;MCUX,MAAM;;;sBAKR,KAAK;;IAEd,MAAM;QACJ,QACE,EAAC,IAAI,qDAAC,IAAI,EAAC,UAAU,IACnB,8DAAa,CACR,EACP;KACH;;;;;;","names":[],"sources":["src/components/table/z-tfoot/styles.css?tag=z-tfoot&encapsulation=shadow","src/components/table/z-tfoot/index.tsx"],"sourcesContent":[":host {\n display: block;\n box-sizing: border-box;\n border-top: 1px solid var(--color-surface03);\n border-bottom: 1px solid var(--color-surface03);\n}\n\n:host([sticky]) {\n position: sticky;\n z-index: 1;\n bottom: 0;\n background-color: var(--color-surface01);\n}\n","import {Component, Host, Prop, h} from \"@stencil/core\";\n\n/*\n ZTFoot component.\n * @slot - ZTFoot content (`z-tr`).\n /\n@Component({\n tag: \"z-tfoot\",\n styleUrl: \"styles.css\",\n shadow: true,\n})\nexport class ZTfoot {\n /\n If true, the footer will be stuck to the bottom of the table.\n */\n @Prop({reflect: true})\n sticky = false;\n\n render(): void {\n return (\n <Host role=\"rowgroup\">\n <slot></slot>\n </Host>\n );\n }\n}\n"],"version":3}