@zanichelli/albe-web-components 18.5.0 → 18.5.2-RC1

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

@@ -43,7 +43,7 @@ const ZAnchorNavigation$1 = /*@__PURE__*/ proxyCustomElement(class ZAnchorNaviga
         window.removeEventListener("hashchange", this.setCurrent);
     }
     render() {
-        return (h(Host, { key: '3a2bc3f92ecf223c95987e33c48e14bb03909fac', collapsed: this.collapsed }, h("z-button", { key: '5d88809c9fcc1a1ea1d163c3111367038da64f19', class: "toggle", variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, this.collapsedLabel), h("nav", { key: '9f9eabbc84d1fe9ef578cc44b2a73d871c658ab5', ref: (el) => (this.nav = el) }, h("slot", { key: '44a486e2caa4b56f8556494f6fd8c4da8e076e7e' }))));
+        return (h(Host, { key: '7416cbf3c13605bab5b696af6ed5a63ae5a0ff4b', collapsed: this.collapsed }, h("z-button", { key: 'f4601704ffc2de21501aa18f3c9f79d50ef873ed', class: "toggle", variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, this.collapsedLabel), h("nav", { key: '03029584b0971a53446e2db85b7bab98c9726495', ref: (el) => (this.nav = el) }, h("slot", { key: '22d203408c1172cf46fc6f3da0d128fcafb3d06b' }))));
     }
     get host() { return this; }
     static get style() { return ZAnchorNavigationStyle0; }

package/dist/components/z-app-header.js

@@ -263,7 +263,7 @@ const ZAppHeader$1 = /*@__PURE__*/ proxyCustomElement(class ZAppHeader extends H
     }
     render() {
         const hasTopSubtitle = this.hasSlot("top-subtitle");
-        return (h(Host, { key: '607b7e24e9f285a68b2b060594d7f05e1858d5cb', "menu-length": this.menuLength }, h("div", { key: 'de8f54eeebf6566e213aa26f938de37837a4eaee', class: { "heading-panel": true, "has-menubar": this.menuLength > 0 && !this.enableOffcanvas }, ref: (el) => (this.container = el) }, h("div", { key: 'f11b563767f199727353f296321d0668f8444465', class: "heading-container" }, ((!this.enableSearch && this.isMobile) || !this.isMobile) && (h("div", { key: '19345fabd859f0d6bad18ee1cdb1c03d959f888a', class: "top-subtitle" }, h("slot", { key: '47a905ab7dc9c88c99d296bc57021bb15ce5ca12', name: "top-subtitle" }))), h("div", { key: 'c2143a9324af347082cdd40584622818f631cea3', class: "heading-title" }, this.renderMenuButton(), !hasTopSubtitle && !this._stuck && this.renderProductLogos(), h("slot", { key: '90ebc7860504f24edf3b4380d716eedf4674ccab', name: "title" }), this.enableSearch && !this.isMobile && this.renderSeachbar()), this.enableSearch && this.isMobile && this.renderSeachbar()), h("nav", { key: '43fb23d049539010c329b0b4c03df3651ad0962b', class: "menu-container", "aria-label": this.title || undefined }, this.canShowMenu && (h("div", { key: 'e08c4cd11e0fb472ae66ed70c7129977175eaa1c', role: "menubar", "aria-label": this.title || undefined }, h("slot", { key: '5daa80b2f4cd1274f2cf564d29677a2c426a4359', name: "menu", onSlotchange: this.collectMenuElements }))))), this.renderOffcanvas(), this._stuck && this.renderStuck()));
+        return (h(Host, { key: '01bcf2e73c2b4da9ed2c9bcf19ceeece56bd738e', "menu-length": this.menuLength }, h("div", { key: 'adf412ee992b488c6e87b7e2f82265c7e6a13b8c', class: { "heading-panel": true, "has-menubar": this.menuLength > 0 && !this.enableOffcanvas }, ref: (el) => (this.container = el) }, h("div", { key: '015996363351b8b81ee50bffd409d8a41edc4008', class: "heading-container" }, ((!this.enableSearch && this.isMobile) || !this.isMobile) && (h("div", { key: '98e3fd2bc1a55fb77dfb00fb55708f6520461bb5', class: "top-subtitle" }, h("slot", { key: '068c16c8cb9496933955c6d68ac8aa1326640688', name: "top-subtitle" }))), h("div", { key: 'c7a806a4af8d099f0c6bc70cefd03f01467b235f', class: "heading-title" }, this.renderMenuButton(), !hasTopSubtitle && !this._stuck && this.renderProductLogos(), h("slot", { key: '45a99fbbb889355061ee3230d5825110d681e26e', name: "title" }), this.enableSearch && !this.isMobile && this.renderSeachbar()), this.enableSearch && this.isMobile && this.renderSeachbar()), h("nav", { key: 'b9ab704c754800865087d45791257a6191b847e9', class: "menu-container", "aria-label": this.title || undefined }, this.canShowMenu && (h("div", { key: '0dd28fca9d831513a3f29041a33da0b9935caa3e', role: "menubar", "aria-label": this.title || undefined }, h("slot", { key: '35e03382a70e5601c8d02c26731ba434d795de0a', name: "menu", onSlotchange: this.collectMenuElements }))))), this.renderOffcanvas(), this._stuck && this.renderStuck()));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/z-aria-alert.js

@@ -8,7 +8,7 @@ const ZAriaAlert$1 = /*@__PURE__*/ proxyCustomElement(class ZAriaAlert extends H
         this.mode = ZAriaAlertMode.POLITE;
     }
     render() {
-        return (h(Host, { key: '583949db78c250fbedcf782e8985635f23a109d8', "aria-live": this.mode, "aria-atomic": "true", "aria-relevant": "additions" }, h("slot", { key: '12d852a544ac602c33237d7f24124bd2fd47847c' })));
+        return (h(Host, { key: '507fd85bea3bc6cdfa0915afaf57866e29cc36e3', "aria-live": this.mode, "aria-atomic": "true", "aria-relevant": "additions" }, h("slot", { key: 'b28a7129f907a00beb9e5aa186f2960d7d6c4d1d' })));
     }
 }, [4, "z-aria-alert", {
         "mode": [1]

package/dist/components/z-avatar.js

@@ -31,10 +31,10 @@ const ZAvatar$1 = /*@__PURE__*/ proxyCustomElement(class ZAvatar extends HTMLEle
         }
     }
     render() {
-        return (h(Host, { key: 'bf7dc11b7c8aea57303ce02812fd487a78248d46', class: { [this.size]: true, [`body-${this.getTextSize()}-sb`]: true }, style: {
+        return (h(Host, { key: '8ce8c6ffe56b55036f9f47146041fcb91051ad36', class: { [this.size]: true, [`body-${this.getTextSize()}-sb`]: true }, style: {
                 color: `var(--${this.textColor})`,
                 backgroundColor: `var(--${this.backgroundColor})`,
-            } }, this.text && !this.image && h("span", { key: 'f5ff0b0ef02d7d69ada96f344f32dc8daccd5437' }, this.text.substring(0, 2)), this.image && (h("img", { key: '7df4cda5d4028d7397b70e1181c846bc9f84e19d', src: this.image, onError: () => (this.image = "") }))));
+            } }, this.text && !this.image && h("span", { key: 'b989378860518c05074dcf3cf445df062679f3c1' }, this.text.substring(0, 2)), this.image && (h("img", { key: '56a3a248fe3f88b2ed285f6a7c133b542ca21940', src: this.image, onError: () => (this.image = "") }))));
     }
     static get style() { return ZAvatarStyle0; }
 }, [1, "z-avatar", {

package/dist/components/z-breadcrumb.js

@@ -213,10 +213,10 @@ const ZBreadcrumb$1 = /*@__PURE__*/ proxyCustomElement(class ZBreadcrumb extends
         ];
     }
     render() {
-        return (h(Host, { key: 'a92078ad9a4aa1ac4689c66c765afa5f113d16d7', style: { "--line-clamp-popover": `${this.overflowMenuItemRows}` } }, h("nav", { key: '99259d02797aff8396f3a87af0ff40d1c97e40fd', ref: (val) => (this.wrapElement = val), "aria-label": "Breadcrumb", class: {
+        return (h(Host, { key: 'bd4614a169bb3bd236c84b4b75de459189c6ebce', style: { "--line-clamp-popover": `${this.overflowMenuItemRows}` } }, h("nav", { key: '9148dec5bf9bdc9ea5b7a1bd67b60d85cbff688c', ref: (val) => (this.wrapElement = val), "aria-label": "Breadcrumb", class: {
                 semibold: this.pathStyle === BreadcrumbPathStyle.SEMIBOLD,
                 underlined: this.pathStyle === BreadcrumbPathStyle.UNDERLINED,
-            } }, h("ol", { key: 'c232f64c88e3bff47af1250385589ecda393b4f3' }, this.viewPortWidth === Device.MOBILE ? this.renderMobileItems() : this.renderItems()))));
+            } }, h("ol", { key: '7c2d74ec32b18e22f444a9ab9ed3c6fb04983558' }, this.viewPortWidth === Device.MOBILE ? this.renderMobileItems() : this.renderItems()))));
     }
     get hostElement() { return this; }
     static get watchers() { return {

package/dist/components/z-button-sort.js

@@ -45,7 +45,7 @@ const ZButtonSort$1 = /*@__PURE__*/ proxyCustomElement(class ZButtonSort extends
         return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
     }
     render() {
-        return (h("button", { key: 'ad7184ad09e3c07eb2e2b548775155006a67cb6c', title: this.setButtonTitle(), id: this.buttonid, class: { selected: this.isselected }, onClick: () => this.emitButtonSortClick() }, h("span", { key: '84451899a4c8ccecb759144f7c2f991628e2e998', ref: (el) => (this.ellipsis = el), class: "ellipsis" }, !this.sortasc && this.desclabel ? this.desclabel : this.label), h("span", { key: '6b18ed6bdf9466de296625afd14fda3ac5180d7b', class: "counter" }, this.counter && ` (${this.counter})`), h("span", { key: 'f44bbe9cc7bb39a850acacfe9066e6458ef3d3e0', class: "sort" }, this.sortasc ? this.sortlabelasc : this.sortlabeldesc), h("z-icon", { key: '931fd0149c14840cfe0721a5af9eabb0dcfb7d24', name: "caret-up-down", width: 16, height: 16 })));
+        return (h("button", { key: '48135e022855d78da6ea11bf643bb6f3165a5ffc', title: this.setButtonTitle(), id: this.buttonid, class: { selected: this.isselected }, onClick: () => this.emitButtonSortClick() }, h("span", { key: '211cf02c4ecf6558030ca0ad16bc12a657a5ad99', ref: (el) => (this.ellipsis = el), class: "ellipsis" }, !this.sortasc && this.desclabel ? this.desclabel : this.label), h("span", { key: '93e81849c1aa11be20b258b7c6156fa006d411c9', class: "counter" }, this.counter && ` (${this.counter})`), h("span", { key: 'f3a1e05c2fb37fc36f724d1760a691c45c8397e9', class: "sort" }, this.sortasc ? this.sortlabelasc : this.sortlabeldesc), h("z-icon", { key: '34fb2d58e925c18101f17e337332faf1cf55eecb', name: "caret-up-down", width: 16, height: 16 })));
     }
     static get style() { return ZButtonSortStyle0; }
 }, [1, "z-button-sort", {

package/dist/components/z-combobox.js

@@ -265,7 +265,7 @@ const ZCombobox$1 = /*@__PURE__*/ proxyCustomElement(class ZCombobox extends HTM
         return (h("div", { class: "check-all-wrapper" }, h("z-input", { type: InputType.CHECKBOX, checked: allChecked, htmlid: checkAllId, class: this.getCheckboxClass(), label: allChecked ? this.uncheckalltext : this.checkalltext, disabled: this.maxcheckableitems && this.maxcheckableitems < this.itemsList.length, size: this.size === ControlSize.X_SMALL ? ControlSize.SMALL : this.size, role: "option", "aria-selected": allChecked ? "true" : "false", onKeyDown: (e) => this.handleSelectArrowsNavigation(e, checkAllId), onInputCheck: (e) => this.checkAll(e.detail.checked), onInputFocus: (e) => this.handleCheckboxFocus(e.detail.id) })));
     }
     render() {
-        return (h("div", { key: '5f5a261815a1e041fe8958fdd5444b7b0a49845b', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
+        return (h("div", { key: 'c746599f1d5cef116c2319d365792288d6f0f34b', "data-action": `combo-${this.inputid}`, class: { open: this.isopen, fixed: this.isfixed, disabled: this.disabled }, id: this.inputid }, this.renderHeader(), !this.disabled && this.renderContent()));
     }
     get element() { return this; }
     static get watchers() { return {

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

@@ -31,9 +31,9 @@ const ZCoverHero$1 = /*@__PURE__*/ proxyCustomElement(class ZCoverHero extends H
         return (h("div", { class: "content-container" }, h("slot", { name: "content" })));
     }
     render() {
-        return (h(Host, { key: '9d19bccd90d41d823dedfd22d4735806513e02b4' }, this.variant === CoverHeroVariant.STACKED &&
+        return (h(Host, { key: 'a95198a28808bea34edd9dc283fa9770196e1bdc' }, this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.TOP &&
-            this.renderContent(), h("div", { key: 'c700a2f18c53e2ee3f0893bb5e06c591847cbf3d', class: "main-container" }, h("div", { key: '32d74cad8e5c8ca8e6bf14a98dda4f490eca8983', class: "cover-container" }, h("slot", { key: '3b54102807692fa0bd3c13ec02ca577dd817f12c', name: "cover" })), h("slot", { key: '330c4c5cb791cb34d6ae5c797f5af17b55e6173b', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
+            this.renderContent(), h("div", { key: '2a80380b0daab0661249370372204adeb2d477a0', class: "main-container" }, h("div", { key: '69a62950d3722871c6a82d3a771b0bc0a971358e', class: "cover-container" }, h("slot", { key: '0dcecf6ab18b8a42fb21b8573729094cfdbaa83a', name: "cover" })), h("slot", { key: '6c841fc5167924badc3ceb44e51757c6056a2dd6', name: "info-reveal" }), this.variant === CoverHeroVariant.OVERLAY && this.renderContent()), this.variant === CoverHeroVariant.STACKED &&
             this.contentPosition === CoverHeroContentPosition.BOTTOM &&
             this.renderContent()));
     }

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

@@ -17,7 +17,7 @@ const ZInfoBox$1 = /*@__PURE__*/ proxyCustomElement(class ZInfoBox extends HTMLE
         this.infoBoxClose.emit({ boxid: this.boxid });
     }
     render() {
-        return (h("div", { key: '97f595bcb0456f5a5178d713253f44798e97aa64', id: this.boxid }, h("slot", { key: 'dad87fab0f68993bfd0c255b10d7949e8df64ce4', name: "content" }), this.isclosable && (h("z-icon", { key: '405f33531ac9fb80f1677837c4e873fc609b289f', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
+        return (h("div", { key: 'ddfc024530dd4382eb2f01d06e2832b9cfb32a4d', id: this.boxid }, h("slot", { key: 'e8bd8f2beaa72a8b03b20f1788afcd7fc1bd9dc0', name: "content" }), this.isclosable && (h("z-icon", { key: '403b33b87cced253f883b20640616d1b34d91f6b', name: "multiply", "data-action": "infoBoxClose", onClick: () => this.emitInfoBoxClose() }))));
     }
     static get style() { return ZInfoBoxStyle0; }
 }, [1, "z-info-box", {

package/dist/components/z-logo.js

@@ -23,7 +23,7 @@ const ZLogo$1 = /*@__PURE__*/ proxyCustomElement(class ZLogo extends HTMLElement
         if (this.height) {
             style["height"] = style["max-height"] = `${this.height}px`;
         }
-        return (h(Host, { key: 'df9ab886a8af4c38414cb06e6ecc044154338e67', style: style, class: { mobile: !!this.mobileLogo } }, this.link ? (h("a", { href: this.link, target: this.targetBlank ? "_blank" : "_self" }, h("img", { alt: this.imageAlt }))) : (h("img", { alt: this.imageAlt }))));
+        return (h(Host, { key: '107d3f66fc6233193ff9d1fd728787c3e059fbf3', style: style, class: { mobile: !!this.mobileLogo } }, this.link ? (h("a", { href: this.link, target: this.targetBlank ? "_blank" : "_self" }, h("img", { alt: this.imageAlt }))) : (h("img", { alt: this.imageAlt }))));
     }
     static get style() { return ZLogoStyle0; }
 }, [1, "z-logo", {

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

@@ -179,7 +179,7 @@ const ZMenuSection$1 = /*@__PURE__*/ proxyCustomElement(class ZMenuSection exten
         this.onItemsChange();
     }
     render() {
-        return (h(Host, { key: 'b308fce3890a3094dca7d5de4f5837b47d6f2796', open: this.open }, h("button", { key: 'dd6eaa241e2f26c79b7fa0e6f7e14049c20b3ed6', ref: (el) => (this.label = el), class: "label", "aria-haspopup": `${!!this.hasItems}`, "aria-expanded": `${!!this.open}`, role: "menuitem", tabindex: this.htmlTabindex, onClick: this.onLabelClick, onKeyDown: this.onLabelKeydown }, h("slot", { key: '74f5c61fcf32df69b0b5d17ff0f06b5b62f940fa', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: '8338d8b57893c110475fe980320310236abb3446', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '4df11f5eaa5226c24930527caba7f0bfa048946a', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: '8393b22b945ec02e32e78248090505a012529253', name: "section", onSlotchange: this.onItemsChange }))));
+        return (h(Host, { key: '4dce34f277ab3c8c41171a15a02fd174c45742cd', open: this.open }, h("button", { key: 'b6c535e87dbb5af8808d7a19556ad116cbcca72b', ref: (el) => (this.label = el), class: "label", "aria-haspopup": `${!!this.hasItems}`, "aria-expanded": `${!!this.open}`, role: "menuitem", tabindex: this.htmlTabindex, onClick: this.onLabelClick, onKeyDown: this.onLabelKeydown }, h("slot", { key: 'fbbba483ca5fe6d45440c01a89f061565ce641aa', onSlotchange: this.onLabelSlotChange }), this.hasItems && h("z-icon", { key: 'b4c67b7cada94580b4f5853aaa8cbb9818bece74', name: this.open ? "chevron-up" : "chevron-down" })), h("div", { key: '711c085b5d74affb2c23ebd1acdd774b5903e7e5', class: "items", role: "menu", hidden: !this.open }, h("slot", { key: 'a2fe12f235f6b23a96f2bd3a8a18f3a095fcff2d', name: "section", onSlotchange: this.onItemsChange }))));
     }
     get host() { return this; }
     static get watchers() { return {

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

@@ -56,7 +56,7 @@ const ZMyzCardAlert$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardAlert ext
         }
     }
     render() {
-        return (h("div", { key: 'c872dffaa351a4c1407361e2a5a15f9731b2cc26', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: 'a5e719d5a2ae8f4dc73fc62d71d09194dcdd5e8b', type: this.getAlertType() }, h("div", { key: '24bbe68591d79c6a1a352afa35907ac74c669f16', class: "relative-container" }, h("z-icon", { key: '6fb4cc62fc3f121df1cc54f2d3bdbb8b7f013473', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: 'ca8890d8af90105d3c72d4dd3910b23fd27aaf9a', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '13d1663c810b6cf2ac8a7f9ef6e8cbf1cea66b18', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
+        return (h("div", { key: '63d701e49601d639a3d6ec3f773addccf5c8d4d3', class: "alert-external-wrapper " + this.retrieveClass() }, h("z-alert", { key: 'dbcc09866b669944137bac22d0b4115bcf55671e', type: this.getAlertType() }, h("div", { key: '79bc1dca9cf1b6b3b818db44d7cd068efdca4a53', class: "relative-container" }, h("z-icon", { key: '8152513be95ed01b8eb429eb14414ceba72b27ad', name: this.iconname, width: 18, height: 18, class: this.retrieveClass() }), h("span", { key: '0b5e824a6a1ce755ace52d54d447d6494704faec', class: "content-text" }, this.contenttext), this.actiontext && !!this.actiontext.trim().length && (h("span", { key: '2cb35bb6069ac2c40de97bb250561add1f6ae4b9', role: "button", tabindex: "0", class: "content-action", onClick: (e) => {
                 this.handleActionButtonClick(e);
             }, onKeyPress: (e) => {
                 this.handleSpaceKeyPress(e);

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

@@ -31,7 +31,7 @@ const ZMyzCardDictionary$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardDict
         this.cardFlipped.emit(showBack);
     }
     render() {
-        return (h("div", { key: 'c9c9e8b19a2bea3a3a3d3e9068a861082807cca1' }, h("z-myz-card", { key: 'd896b291a04ba600f7b0d5b1e9bbfcef832ba5cd' }, h("z-myz-card-header", { key: 'f11c54362d6576667ae32e65009edd814bb0c1be', titolo: this.name }), h("div", { key: '2f3f3a315179a8c731dff427fdbbd2c24fa0b242', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: '4d07a2c08ba1231074a74582895f2bcd07809ed5', class: "front" }, h("z-myz-card-body", { key: '37deb0becefe8daf4b85857160e4cbdd66efb2f0' }, h("z-myz-card-cover", { key: '4f08439081886f3e11c684b9b036cb1cb75f6c14', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: '43b0d914a31252f6cdfaedf554754d2d15355945', class: { "hide-info": this.hideinfobtn }, variant: ButtonVariant.SECONDARY, icon: "informationsource", size: ButtonSize.X_SMALL, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { key: '527ba7fa39fcd696a9dd365c098f9a27b9cafcab', class: "back" }, h("slot", { key: '0e9b3353d957cea825fa60efb975657121e2616f', name: "info" }))), h("slot", { key: '04a8056434f039fc33b43d0b529138e8be00f4dd' }))));
+        return (h("div", { key: '53b7bd363a0bfea6c982214d0c461cd3a82b2896' }, h("z-myz-card", { key: '8bcb24ba4637e6a79df60bbe2bc5ee724c35b0a0' }, h("z-myz-card-header", { key: '0148c0d772bc6a246431d20f0a7d9b8f56c39341', titolo: this.name }), h("div", { key: '60c1c22531d17993a3aee6617db60652bcb80040', class: `content ${this.flipped ? "flipped" : ""}` }, h("div", { key: 'fe6df90f6c445a95e03f69a0c598fcfb3d6f2cef', class: "front" }, h("z-myz-card-body", { key: '9f445be3f416d75869b4f2805dfd315ebe1291c8' }, h("z-myz-card-cover", { key: '5933474297a9eefdbcfe59dae9e5f74c3e542e46', slot: "cover", titolo: this.name, img: this.cover, faded: this.disabled })), h("z-button", { key: '38a3970ced4d52c222c684517e1ea14610e2b014', class: { "hide-info": this.hideinfobtn }, variant: ButtonVariant.SECONDARY, icon: "informationsource", size: ButtonSize.X_SMALL, onClick: () => this.flipCard(true), disabled: this.flipped }, this.flipbuttonlabel)), h("div", { key: '5b297c4591619366ace5f6b92abfacf69a1f867b', class: "back" }, h("slot", { key: '1ea4506369f9dec480891286028b87cddbf2b0ea', name: "info" }))), h("slot", { key: '4a5a21e4b058895801d7f12833aad0734302167b' }))));
     }
     static get style() { return ZMyzCardDictionaryStyle0; }
 }, [1, "z-myz-card-dictionary", {

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

@@ -10,7 +10,7 @@ const ZMyzCardFooterSections$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCard
         this.__attachShadow();
     }
     render() {
-        return (h("div", { key: '9703ee2fd10280262569972803a7d3415e1822c4' }, h("footer", { key: 'd0fc23f9d726852c97b8ffe3efd9492c8c47b1e2' }, h("div", { key: '1a5489dec0b81ffb6c4b3c525a55032d1f43ca9a', class: "top" }, h("slot", { key: '2a9c1491f63d414f4721056e37e946eed9884f0d', name: "top" })), h("div", { key: '97a7b1fb466a599c5e607d2c289ddc227de2c11f', class: "bottom" }, h("slot", { key: '9fa80a29f730178fdb82e78406998faf59f8417f', name: "bottom" })))));
+        return (h("div", { key: '5144daa5d9e002a0b5a28bddffe2d1e3f73f981e' }, h("footer", { key: 'bb9c0ae02c103cbf43cd0161267333f88bd4901d' }, h("div", { key: 'e666f1688fbfb4ab5830600d95a44bd54f0e614f', class: "top" }, h("slot", { key: '3071ef2a2857071965d0c041e0717e249ce88178', name: "top" })), h("div", { key: '302e464f10c51a0ff52a5c758015f402b67bbc8b', class: "bottom" }, h("slot", { key: '5e0e9470df478296c9b91b402791983576a633af', name: "bottom" })))));
     }
     static get style() { return ZMyzCardFooterSectionsStyle0; }
 }, [1, "z-myz-card-footer-sections"]);

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

@@ -62,7 +62,7 @@ const ZMyzCardFooter$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardFooter e
         return this.host.querySelector("[slot=list] > li a");
     }
     render() {
-        return (h("div", { key: '92e64d095ee33678a13c169a496f83b53357fd27', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: '4fef05b184a2130b19b983ec83bda02ed78141eb', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: 'c7e218520f78e8388677ee77569761fcd29d3ba4', class: "toggle" }, h("slot", { key: '7dc21f890f3e0775e13891c874aa88d8f6cbc245', name: "toggle" })), this.titolo && h("p", { key: 'b1092bfb1839719d658ecda91e24be25b61d31e5', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: '6989423d6d73aaef837b133b18385d388e44ec2c', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '28a6040aa290f8c34d6ca7c84fbb52a2d37d5ec9' }, h("p", { key: '0bab0a6a1c52cfc122b43fd0e6145e9f40f74782', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: 'fc3e603d3cabd79805297192eca933da270e3218', title: this.getTitleAuthors() }, h("span", { key: 'd4b61df5fff586933ae946aaf3c806b66a043549', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'ad23d82c2290d0692c7ca735d8f33bd11f07f2f2', class: "year-isbn" }, h("span", { key: '8c7cfe3034b61c8c924ceaccca5b318119b2fa2c', class: "isbn" }, h("span", { key: '4be547d82b9c73b1818a36ffc2fa3a8867589f51' }, h("span", { key: 'a79d29d41f6b8f83a46cad921a8b20deb403c156', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: '7ae13fd266b9a57e8112520c08e4887bd7396ab0', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: '2a8aeb5da244d3fd2f594afd297f09e5e853ba58', name: "list" })))), this.customContent && h("slot", { key: '93b766f5a81d17e46cb4d945ad9bf45dbc3fc110', name: "content" })));
+        return (h("div", { key: 'c4768ef4a723411c9904a6524ec9fdf765869f1f', class: Object.assign(Object.assign({}, this.retrieveClass()), { wrapper: true }) }, h("footer", { key: 'db741ce1f1db75f70949753be3d43eb298087d6b', class: this.retrieveClass(), onTransitionEnd: (e) => this.footerTransitionHandler(e) }, h("span", { key: '62b0b2b8c762d5270e453d9510c205234079ae85', class: "toggle" }, h("slot", { key: '76b7a3bc97b370903a3914b10c82e3fa70ba8e3f', name: "toggle" })), this.titolo && h("p", { key: '90d60dccb67602360fe057f1d63607de3a5cfe86', class: { "custom-content": this.customContent } }, this.titolo), h("div", { key: 'abda4a5e96f10999c16c12e939a8919f1ce55e2e', class: { "content": true, "custom-content": this.customContent } }, h("div", { key: '054e7feeb6a26eeb0dce34cde27d10ceb4497464' }, h("p", { key: '300ca841dd5fd30263f5b9dae20cfe9603569a71', class: "authors", ref: (el) => (this.ellipsisAuthors = el) }, h("span", { key: '36fe6e72626811bd2afd043f6017e67da04c6da7', title: this.getTitleAuthors() }, h("span", { key: '7813537e2a302cf69e6040e84e715fb807f45199', "aria-description": "Autori", class: "bold" }, this.autori))), h("p", { key: 'be1018b2bdff8dcfd2b55609a1803501385c4f67', class: "year-isbn" }, h("span", { key: '87349d43c3c8c4c1793b9ce676656202d411980a', class: "isbn" }, h("span", { key: '2eb704f82d1494dd0acf48f24fcd6b2dca1ae2bf' }, h("span", { key: '519d3f408892c0809f9de05db0d2d84cd7ad8a7c', "aria-description": "ISBN edizione cartacea", class: "bold" }, this.isbn), " ", "(ed. cartacea)")))), h("div", { key: 'b5ac3cc177fe509bf142d3230627a827becc5af1', class: `slot-handler ${this.isOpen ? "visible" : "hidden"}` }, h("slot", { key: 'f8a2b434abfb242bee1f830a00345763a7503358', name: "list" })))), this.customContent && h("slot", { key: '831924dba2c695a125ed7d7cd61c9bd39ae05269', name: "content" })));
     }
     get host() { return this; }
     static get style() { return ZMyzCardFooterStyle0; }

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

@@ -14,7 +14,7 @@ const ZMyzCardIcon$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardIcon exten
         this.ariaLabel = "";
     }
     render() {
-        return (h("button", { key: '00aaa8cb869a6990df315779fcc2e07e01c35ae6', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: 'f30600812fefb0918c42879d98dd1c14a32b22f0' }, h("z-icon", { key: 'b7cfecc30647dfe11a55deea66b9a9da4780b463', name: this.icon, width: 16, height: 16 }))));
+        return (h("button", { key: 'f55508220a6e8890568fcb51e53028a815cf9d6c', disabled: this.isdisabled, "aria-label": this.ariaLabel }, h("span", { key: '35b9a8fe1dceead8ca5e8074171f3a589abe50c9' }, h("z-icon", { key: 'b8ba6455b6966949359abd52da1b092b515b1f7b', name: this.icon, width: 16, height: 16 }))));
     }
     static get style() { return ZMyzCardIconStyle0; }
 }, [1, "z-myz-card-icon", {

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

@@ -121,7 +121,7 @@ const ZMyzCardInfo$1 = /*@__PURE__*/ proxyCustomElement(class ZMyzCardInfo exten
         return (h("section", { ref: (el) => (this.offlineLicenseWrapper = el) }, h("span", { class: "license-heading" }, h("span", null, "Licenza offline"), this.setExpirationLicenseMessage("offline")), "Scadenza il ", h("b", null, this.cardData.offlineLicense.expiration), h("br", null), "Installazioni disponibili: ", h("b", null, this.cardData.offlineLicense.installations)));
     }
     render() {
-        return (h("div", { key: '2432bdbcbfdac05acee5c02ef4ed71aee899b137' }, this.renderCloseIcon(), h("div", { key: 'be66005920c03f58f0548539565d4f034f1af320', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '5dfa3d32d43ba9abf6d50e5fc3ecca9ebd6bc39f', class: "cta-wrapper" }, h("slot", { key: '2a2bbc9dc494253032a01b91247d2d706f38c76a' }))));
+        return (h("div", { key: '2da5c29057a85f238e99b34bf5afe2d3fced734f' }, this.renderCloseIcon(), h("div", { key: '7a1a52d3dd21f2a73d6af292705162dc3bb7a977', class: "content-wrapper", ref: (el) => (this.contentWrapper = el) }, this.renderGeneralSection(), this.renderTooltip(), this.renderOnlineLicenseSection(), this.renderOfflineLicenseSection()), h("div", { key: '3df54c0ab2569fa911b5ddddf38b59672fa02867', class: "cta-wrapper" }, h("slot", { key: '83e473746c24c97cb9910f25e8f25f3ea7d41cc2' }))));
     }
     static get style() { return ZMyzCardInfoStyle0; }
 }, [1, "z-myz-card-info", {

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

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

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

@@ -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: 'd0bf83fc8c6917abb5112be4d8efcf75e085e322' }, this.list &&
+        return (h("ul", { key: '6c533b3d206e3c6349647afd560ee0e71979b951' }, 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

@@ -222,10 +222,10 @@ const ZNavigationTabs$1 = /*@__PURE__*/ proxyCustomElement(class ZNavigationTabs
         (_a = this.resizeObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: 'b7bdbf2b202dead64ed98f5865e9d46e71898bf9', class: {
+        return (h(Host, { key: '5216c71c53d3263870b4d64749554c36dadfdb8c', class: {
                 "interactive-2": this.size === NavigationTabsSize.SMALL,
                 "interactive-1": this.size !== NavigationTabsSize.SMALL,
-            }, scrollable: this.canNavigate }, h("button", { key: 'aa1df34b54cf4b8848aed44cd3927ee17777a34b', 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: '2bad56e221bc2691d8ca6cea0a013c6d92d7f8c1', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: '8dd45e59019ac799f1fffdf7245d0c902455c0a6', 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: '3d243470caae97c068a2ae23b05078695c2ae367' })), h("button", { key: '080cf9e973e320a795c95acfb3bd41b4ee9eacd9', 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: '293fc3b81bee46d928c8461be0225be73efcc9bb', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
+            }, scrollable: this.canNavigate }, h("button", { key: 'b59fcef70ff51453d679678caabae7f69a3a91d9', 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: '2f2a9f0630c6f7c340132bfde3c90c2392ea3f07', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-left" : "chevron-up", width: 16, height: 16 })), h("nav", { key: 'f8e06aaadd56dfd9e1ab068a4a0d5633083b2ca9', 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: '8f1062acbb5616c395cac371d8737660f69c5326' })), h("button", { key: '28342d0ad1c43119862b148b550c57c352d6a07c', 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: 'e975d966cdc0f0f52345bca3cb842cd0672783b8', name: this.orientation === NavigationTabsOrientation.HORIZONTAL ? "chevron-right" : "chevron-down", width: 16, height: 16 }))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-notification.js

@@ -30,7 +30,7 @@ const ZNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZNotification ext
     }
     render() {
         var _a;
-        return (h(Host, { key: '3681c9216f7ab0ce532c8b1ed013d7af611151de' }, this.contenticonname && (h("z-icon", { key: 'e7c538a5583873ed4ad95885f1199050b89f6732', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '93855c8906e6a65fa2d762fc447d14ee7a456b53', class: "content-container" }, h("div", { key: '526f760b7739c28154195e7a01ce66b185ccb068', class: "content-text" }, h("slot", { key: '56313ec91ad750e57af3035455aa89db3880ae4e' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: 'fc2de2fa3ff7cdf5e522f009efa41af06f8a6cca', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: '3ba0d198a3617d1a05fb33eb8f3ceb9b0d685503', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: '0bba4473674bee1c8c4abbc5792c9cab84c06088', name: "multiply-circle", width: 16, height: 16 })))));
+        return (h(Host, { key: '1476969ad9cd71af738c1032fa1b426a31faef9f' }, this.contenticonname && (h("z-icon", { key: '449b25859ae4f501b42d4c4cd0c26cd9dcb1935e', class: "status-icon", name: this.contenticonname, width: 16, height: 16 })), h("div", { key: '5b8feced4f05c6e14e6ac7e9a06096db6fd93997', class: "content-container" }, h("div", { key: 'ec6a27aebcc0d60efdb5fd3cb29cc7fddc441331', class: "content-text" }, h("slot", { key: 'd66a3fbf761e5460f0d52c5111b07166c59fa7f4' })), !!((_a = this.actiontext) === null || _a === void 0 ? void 0 : _a.trim()) && (h("button", { key: '73f5c71a14294c230342ef7382f9ae3fa2b330ce', class: "action-button", type: "button", onClick: this.handleActionButtonClick }, this.actiontext))), this.showclose && (h("button", { key: 'a0be489166ad16faa182adac379ce08ca06317ed', class: "close-button", type: "button", onClick: this.handleCloseButtonClick }, h("z-icon", { key: '254d0f36a6ee1a356506db703658053959020070', name: "multiply-circle", width: 16, height: 16 })))));
     }
     static get style() { return ZNotificationStyle0; }
 }, [1, "z-notification", {

package/dist/components/z-otp.js

@@ -24,7 +24,7 @@ const ZOtp$1 = /*@__PURE__*/ proxyCustomElement(class ZOtp extends HTMLElement {
         this.otpRef = [...Array(this.inputNum)];
     }
     render() {
-        return (h("div", { key: 'b40a4c7095f23a0c7cbafc924172ab1a3b304854', class: "otp-container" }, h("div", { key: '85107cd10596d048e34e84caa472fa8ceb7d0994', class: "digits-container" }, this.otp.map((_val, i) => (h("input", { class: this.status == InputStatus.ERROR ? "error" : null, onKeyDown: (e) => {
+        return (h("div", { key: 'fbc28e800a7fb7fe81b836869f44d24797c09922', class: "otp-container" }, h("div", { key: '547c8f308045f1f4d5a463404f2ec494ef67421b', 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: '0c47a139f060381bca154d5b232a84c597da4da6', 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: '51eacbd4b0a7ec9e1ac0fa55a132cd43aa6b7ecf', message: this.message, status: this.status })));
     }
     static get style() { return ZOtpStyle0; }
 }, [1, "z-otp", {

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

@@ -20,12 +20,12 @@ const ZPanelElem$1 = /*@__PURE__*/ proxyCustomElement(class ZPanelElem extends H
     }
     render() {
         const elemId = this.elemid ? this.elemid : "";
-        return (h("div", { key: '0812aa28734e176eaa553ba98011e4e9c7e9522c', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: 'ad62ef2a70a88716ef12b177117e820267e62762', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '8891d636ff439e25801a60a14e65e4dcad6d6038', src: this.imgurl, alt: this.imgalt }))), h("div", { key: 'aa1275fe9fa4f33cf9c7151bb192e9acce2d3070', class: "panel-elem-link" }, h("a", { key: '6500ac1c11088d22b12de3c63fd8e065c0cf100d', class: {
+        return (h("div", { key: '90afba46bcde1bd3bd27b35c6e5db38ce9071aee', class: "panel-elem-container" }, (this.imgurl || this.imgalt) && (h("div", { key: 'd9493560e96ad743ae3ee52be6c9205b6014b8da', "aria-hidden": "true", class: "panel-elem-icon" }, h("img", { key: '5bd7c14c0083b9fed6e320a4ef4652018abf2762', src: this.imgurl, alt: this.imgalt }))), h("div", { key: '4cbebd354b6b3b56304970aedb0e94e084d49a9f', class: "panel-elem-link" }, h("a", { key: '195ec2e77eac163c65cf746faa114f39618d2abc', 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: '143e204c1d1bd20178a46a9d77110b9219464c99', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '9215d44929526bc6e9b8034debbec3f23b00d5ef', class: "panel-elem-desc" }, h("slot", { key: '036bc705038c03e6c021807f5d2217208ec46c9c', name: this.descrSlotName })))));
+            }, id: elemId + "link_id", href: this.url, target: this.target }, h("z-icon", { key: 'c11c35e5bff66d382b309fece4bec295abb1a0d4', height: 14, width: 14, name: this.linkicon }), this.linklabel)), this.descrSlotName && (h("div", { key: '319374f4955314400344ce558486c6afa36ca4f2', class: "panel-elem-desc" }, h("slot", { key: '7e7dcf38991bc7f67ab164e4bac9d20026fa29d9', name: this.descrSlotName })))));
     }
     static get style() { return ZPanelElemStyle0; }
 }, [6, "z-panel-elem", {

package/dist/components/z-select.js

@@ -487,7 +487,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, disabled: this.disabled }));
     }
     render() {
-        return (h("div", { key: '54550dd2e992dc1327d6cf45236176191cca37ea', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
+        return (h("div", { key: '175046b438342ee0b6bae38a35a0c70f47cdc0f8', class: "select-wrapper" }, this.renderInput(), this.renderSelectUl(), this.renderMessage()));
     }
     get host() { return this; }
     static get watchers() { return {

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

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

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

@@ -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: 'd7d79f56588570f42bff53bed14eec8535d58065', role: "listitem" }, h("button", Object.assign({ key: '6c45bab7ceb75658d3fa5cb630af623d3642b38b', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: '1af178d630d1b3af851398bb91ff2391b166d388', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: 'afab91fdb6ef519a51d68cec1aededbac3cdf5a0' }, h("slot", { key: 'de9cdf3354ccd0d3e1d0e0c6f5b3322c94c00202' })))));
+        return (h(Host, { key: '38abeb0e7efbdc12ffde4efc9b47b37f9fe76d28', role: "listitem" }, h("button", Object.assign({ key: '815f0fe6960a99d67a9fd7a10d5d9430e14ded57', class: "stepper-item", disabled: this.disabled }, this.getAttributes()), h("div", { key: 'd9c043fb249b9732abefb4d0eb4c762fdae288d8', class: "indicator" }, this.checked ? h("z-icon", { name: "checkmark" }) : this.index), h("span", { key: '3e81b7234bc189b749c6e304908a25131d6a2367' }, h("slot", { key: 'b3f977ba6bab3cfa1cc64ab5c80f4291fdc9a01c' })))));
     }
     static get style() { return ZStepperItemStyle0; }
 }, [1, "z-stepper-item", {

package/dist/components/z-stepper.js

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

package/dist/components/z-table.js

@@ -4,7 +4,7 @@ import './breakpoints.js';
 import './iconset.js';
 import './index23.js';
 
-const stylesCss = ":host{--z-table--cells-padding:calc(var(--space-unit) * 2);position:relative;display:block;overflow:auto;max-width:100%;box-sizing:border-box;background-color:var(--color-surface01)}:host([expandable]){--z-table--expand-button-size:40px}:host([bordered]){--z-table--cell-left-border:1px solid var(--color-surface03)}";
+const stylesCss = ":host{--z-table--cells-padding:calc(var(--space-unit) * 2);position:relative;display:block;overflow:auto;min-width:max-content;max-width:100%;box-sizing:border-box;padding:8px;background-color:var(--color-surface01)}:host([expandable]){--z-table--expand-button-size:40px}:host([bordered]){--z-table--cell-left-border:1px solid var(--color-surface03)}";
 const ZTableStyle0 = stylesCss;
 
 const ZTable$1 = /*@__PURE__*/ proxyCustomElement(class ZTable extends HTMLElement {
@@ -38,7 +38,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: 'a37bf2d018aedf198e11248d9952c062deddc545', expandable: this.expandable }, h("div", { key: 'a769b79ee55eb5425bb6c72059437f051967c3b3', class: "table", role: "table" }, h("slot", { key: '0ba782144cc2f139484954747d530d6f1c606a0d' }))));
+        return (h(Host, { key: '6749b44ab2c28b92e6b282487bf9f23c40cead58', expandable: this.expandable }, h("div", { key: '633237695b09182263ac74b5118d533a8cae33b8', class: "table", role: "table" }, h("slot", { key: 'f46d287050238e137ababadae8b8eb1ffdb96c7b' }))));
     }
     get host() { return this; }
     static get style() { return ZTableStyle0; }

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

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

package/dist/components/z-td.js

@@ -4,7 +4,7 @@ import { d as defineCustomElement$4 } from './index4.js';
 import { d as defineCustomElement$3 } from './index9.js';
 import { d as defineCustomElement$2 } from './index23.js';
 
-const stylesCss = ":host{position:relative;display:flex;max-width:100%;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}:host(:focus){z-index:20;box-shadow:var(--shadow-focus-primary);outline:none}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu=\"hover\"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu=\"hover\"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}";
+const stylesCss = ":host{position:relative;display:flex;max-width:100%;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu=\"hover\"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu=\"hover\"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}";
 const ZTdStyle0 = stylesCss;
 
 const ZTd$1 = /*@__PURE__*/ proxyCustomElement(class ZTd extends HTMLElement {
@@ -36,7 +36,7 @@ const ZTd$1 = /*@__PURE__*/ proxyCustomElement(class ZTd extends HTMLElement {
         this.updateColspan();
     }
     render() {
-        return (h(Host, { key: '8c866902e986231a18c02c447bc390d14f55aecf', role: "cell", "menu-open": this.isMenuOpen, tabIndex: 0 }, h("div", { key: '83b6e697548f7fec6705e74111253564066005d8', class: "cell--content" }, h("slot", { key: '4129469503f265975bf5a28aa1ea576fa2e3311b' }), this.showMenu && (h("div", { key: 'd70b2bb104a891270515e7428593ce9cedbd882c', class: "cell--menu-container prevent-expand" }, h("z-button", { key: 'cacd10ac34bb695883c1e0d63dc96623fa3c59e9', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: 'e6fdca5d2ba1047264c0703a222c3c5a5c30480b', class: "cell-popover", ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: 'e3e996e448fd49d4248d98d219a899ea254d7fd1', name: "contextual-menu" })))))));
+        return (h(Host, { key: 'c9c2a31f99dc72acd54744c8c1abdbb56b0a7df3', role: "cell", "menu-open": this.isMenuOpen }, h("div", { key: 'f503630802052c5c3566b725aba40ea0923d60da', class: "cell--content" }, h("slot", { key: 'e26dc22a7b21eef5475d10124312384593957bf8' }), this.showMenu && (h("div", { key: '4c7204766c53e4502ff24e51e9ea751620246278', class: "cell--menu-container prevent-expand" }, h("z-button", { key: '3d0f59414241c2b195dd45cf74f678b15e957cac', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: '68d2f577c442c9a72009dd6365cd4182e9333d5a', class: "cell-popover", ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: 'c90cf570174b2e2af659ae02e217d725a1951cb4', name: "contextual-menu" })))))));
     }
     get host() { return this; }
     static get watchers() { return {

package/dist/components/z-td.js.map

@@ -1 +1 @@
-{"file":"z-td.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,wmCAAwmC,CAAC;AAC3nC,kBAAe,SAAS;;MCWXA,KAAG;;;;;;;sBAaL,KAAK;wBAQkB,IAAI;+BAMA,eAAe,CAAC,IAAI;0BAM3C,KAAK;;IAgBR,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;SACrD;aAAM;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;SAC/C;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;KAC5C;IAEO,iBAAiB,CAAC,EAAc;QACtC,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;KAC5C;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,MAAM,eACA,IAAI,CAAC,UAAU,EAC1B,QAAQ,EAAE,CAAC,IAEX,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,EACZ,IAAI,CAAC,QAAQ,KACZ,4DAAK,KAAK,EAAC,qCAAqC,IAC9C,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,GAC1C,EACF,kEACE,KAAK,EAAC,cAAc,EACpB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,IAE9B,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTd"],"sources":["src/components/table/cells/z-td/styles.css?tag=z-td&encapsulation=shadow","src/components/table/cells/z-td/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTd component.\n * @slot - ZTd content.\n */\n@Component({\n  tag: \"z-td\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTd {\n  @Element() host: HTMLZTdElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Set the popover position, the default is \"auto\".\n   */\n  @Prop()\n  popoverPosition?: PopoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  private menuTrigger: HTMLZButtonElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Emitted when the value of the `colspan` changes.\n   */\n  @Event({\n    bubbles: true,\n    cancelable: false,\n  })\n  colspanChange: EventEmitter<number>;\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n\n    this.colspanChange.emit(this.colspan || 1);\n  }\n\n  private onMenuButtonClick(ev: MouseEvent): void {\n    ev.stopPropagation();\n    this.popoverEl.open = !this.popoverEl.open;\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZTdElement {\n    return (\n      <Host\n        role=\"cell\"\n        menu-open={this.isMenuOpen}\n        tabIndex={0}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showMenu && (\n            <div class=\"cell--menu-container prevent-expand\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLZButtonElement)}\n                onClick={this.onMenuButtonClick.bind(this)}\n              />\n              <z-popover\n                class=\"cell-popover\"\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger as HTMLElement}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-td.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,2hCAA2hC,CAAC;AAC9iC,kBAAe,SAAS;;MCWXA,KAAG;;;;;;;sBAaL,KAAK;wBAQkB,IAAI;+BAMA,eAAe,CAAC,IAAI;0BAM3C,KAAK;;IAgBR,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;SACrD;aAAM;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;SAC/C;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;KAC5C;IAEO,iBAAiB,CAAC,EAAc;QACtC,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;KAC5C;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,MAAM,eACA,IAAI,CAAC,UAAU,IAE1B,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,EACZ,IAAI,CAAC,QAAQ,KACZ,4DAAK,KAAK,EAAC,qCAAqC,IAC9C,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,GAC1C,EACF,kEACE,KAAK,EAAC,cAAc,EACpB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,IAE9B,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTd"],"sources":["src/components/table/cells/z-td/styles.css?tag=z-td&encapsulation=shadow","src/components/table/cells/z-td/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTd component.\n * @slot - ZTd content.\n */\n@Component({\n  tag: \"z-td\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTd {\n  @Element() host: HTMLZTdElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Set the popover position, the default is \"auto\".\n   */\n  @Prop()\n  popoverPosition?: PopoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  private menuTrigger: HTMLZButtonElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Emitted when the value of the `colspan` changes.\n   */\n  @Event({\n    bubbles: true,\n    cancelable: false,\n  })\n  colspanChange: EventEmitter<number>;\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n\n    this.colspanChange.emit(this.colspan || 1);\n  }\n\n  private onMenuButtonClick(ev: MouseEvent): void {\n    ev.stopPropagation();\n    this.popoverEl.open = !this.popoverEl.open;\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZTdElement {\n    return (\n      <Host\n        role=\"cell\"\n        menu-open={this.isMenuOpen}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showMenu && (\n            <div class=\"cell--menu-container prevent-expand\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLZButtonElement)}\n                onClick={this.onMenuButtonClick.bind(this)}\n              />\n              <z-popover\n                class=\"cell-popover\"\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger as HTMLElement}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/z-th.js

@@ -4,7 +4,7 @@ import { d as defineCustomElement$4 } from './index4.js';
 import { d as defineCustomElement$3 } from './index9.js';
 import { d as defineCustomElement$2 } from './index23.js';
 
-const stylesCss = ":host{position:relative;display:flex;max-width:100%;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}:host(:focus){z-index:20;box-shadow:var(--shadow-focus-primary);outline:none}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu=\"hover\"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu=\"hover\"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}.cell--content{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2))}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}@media (min-width: 768px) and (hover: hover){:host([show-sorting=\"hover\"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting=\"hover\"]:hover) .z-th--sort-button,:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting=\"always\"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting=\"always\"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:\"\"}";
+const stylesCss = ":host{position:relative;display:flex;max-width:100%;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host,*{box-sizing:border-box}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([menu-open]){z-index:2}.cell--content{display:flex;width:100%;height:100%;align-items:center}:host([show-menu]) .cell--content{column-gap:var(--space-unit)}.cell--menu-container{margin-left:auto}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{z-index:1;opacity:1;pointer-events:all}:host .cell-popover{z-index:100}@media (min-width: 768px) and (hover: hover){:host([show-menu=\"hover\"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu=\"hover\"]:hover) .cell--menu-container{z-index:1;opacity:1;pointer-events:all}}:host{z-index:1;padding:0;background-color:var(--color-background);font-weight:var(--font-sb)}.cell--content{padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2))}:host([show-sorting]) .cell--content{column-gap:var(--space-unit)}.z-th--sort-button{position:relative;padding:0;border:none;background-color:transparent;cursor:pointer;outline:none}.z-th--sort-button:focus,.z-th--sort-button:focus-visible{box-shadow:var(--shadow-focus-primary);opacity:1;outline:none;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-sorting=\"hover\"]) .z-th--sort-button{opacity:0;pointer-events:none}:host([show-sorting=\"hover\"]:hover) .z-th--sort-button,:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,:host([show-sorting=\"always\"]) .z-th--sort-button,:host([sorted]) .z-th--sort-button{opacity:1;pointer-events:all}}:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,:host([show-sorting=\"always\"]) .z-th--sort-button::after,:host([sorted]) .z-th--sort-button::after{position:absolute;top:6px;left:6px;width:calc(100% - 12px);height:calc(100% - 10px);background-color:transparent;content:\"\"}";
 const ZThStyle0 = stylesCss;
 
 const ZTh$1 = /*@__PURE__*/ proxyCustomElement(class ZTh extends HTMLElement {

package/dist/components/z-th.js.map

@@ -1 +1 @@
-{"file":"z-th.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,gqEAAgqE,CAAC;AACnrE,kBAAe,SAAS;;MCYXA,KAAG;;;;;;;wBAekB,IAAI;2BAQD,IAAI;sBAM9B,KAAK;;sBAYW,KAAK;+BAMZ,eAAe,CAAC,IAAI;0BAMzB,KAAK;;;;;IAiBlB,IAAY,iBAAiB;QAC3B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO,IAAI,CAAC;SACb;QAED,OAAO,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,GAAG,GAAG,WAAW,GAAG,YAAY,CAAC;KAC9E;;;;;IAMO,UAAU;QAChB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpB,OAAO;SACR;QAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,GAAG,GAAG,aAAa,CAAC,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC;QACvG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QAEnB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAC,aAAa,EAAE,IAAI,CAAC,aAAa,EAAC,CAAC,CAAC;KACrD;IAGS,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;SACrD;aAAM;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;SAC/C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,cAAc,eACR,IAAI,CAAC,UAAU,eACf,IAAI,CAAC,iBAAiB,EACjC,QAAQ,EAAE,IAAI,CAAC,WAAW,IAE1B,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,EACZ,IAAI,CAAC,WAAW,KACf,+DACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAEnC,+DACE,IAAI,EAAE,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,IAAI,GAAG,iBAAiB,GAAG,mBAAmB,EACzF,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,CACK,CACV,EACA,IAAI,CAAC,QAAQ,KACZ,4DAAK,KAAK,EAAC,sBAAsB,IAC/B,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,EACnD,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAC3D,EACF,kEACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,IAE9B,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTh"],"sources":["src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n\n:host {\n  z-index: 1;\n  padding: 0;\n  background-color: var(--color-background);\n  font-weight: var(--font-sb);\n}\n\n.cell--content {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n}\n\n:host([show-sorting]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  outline: none;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-sorting=\"hover\"]) .z-th--sort-button {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n  :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n  :host([show-sorting=\"always\"]) .z-th--sort-button,\n  :host([sorted]) .z-th--sort-button {\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n  position: absolute;\n  top: 6px;\n  left: 6px;\n  width: calc(100% - 12px);\n  height: calc(100% - 10px);\n  background-color: transparent;\n  content: \"\";\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTh {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Enables the sorting button.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the sort button.\n   */\n  @Prop({reflect: true})\n  showSorting: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Sorted state of the column.\n   */\n  @Prop({reflect: true, mutable: true})\n  sorted: boolean | null = false;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      this.sorted = false;\n\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sorted = true;\n\n    this.sort.emit({sortDirection: this.sortDirection});\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n        sortable={this.showSorting}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showSorting && (\n            <button\n              class=\"z-th--sort-button\"\n              type=\"button\"\n              onClick={this.handleSort.bind(this)}\n            >\n              <z-icon\n                name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n                width={14}\n                height={14}\n              />\n            </button>\n          )}\n          {this.showMenu && (\n            <div class=\"cell--menu-container\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLElement)}\n                onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n              />\n              <z-popover\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"z-th.js","mappings":";;;;;;AAAA,MAAM,SAAS,GAAG,gvEAAgvE,CAAC;AACnwE,kBAAe,SAAS;;MCYXA,KAAG;;;;;;;wBAekB,IAAI;2BAQD,IAAI;sBAM9B,KAAK;;sBAYW,KAAK;+BAMZ,eAAe,CAAC,IAAI;0BAMzB,KAAK;;;;;IAiBlB,IAAY,iBAAiB;QAC3B,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,OAAO,IAAI,CAAC;SACb;QAED,OAAO,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,GAAG,GAAG,WAAW,GAAG,YAAY,CAAC;KAC9E;;;;;IAMO,UAAU;QAChB,IAAI,CAAC,IAAI,CAAC,aAAa,EAAE;YACvB,IAAI,CAAC,MAAM,GAAG,KAAK,CAAC;YAEpB,OAAO;SACR;QAED,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,GAAG,GAAG,aAAa,CAAC,IAAI,GAAG,aAAa,CAAC,GAAG,CAAC;QACvG,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QAEnB,IAAI,CAAC,IAAI,CAAC,IAAI,CAAC,EAAC,aAAa,EAAE,IAAI,CAAC,aAAa,EAAC,CAAC,CAAC;KACrD;IAGS,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE;YAChB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;SACrD;aAAM;YACL,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;SAC/C;KACF;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;KACtB;IAED,MAAM;QACJ,QACE,EAAC,IAAI,qDACH,IAAI,EAAC,cAAc,eACR,IAAI,CAAC,UAAU,eACf,IAAI,CAAC,iBAAiB,EACjC,QAAQ,EAAE,IAAI,CAAC,WAAW,IAE1B,4DAAK,KAAK,EAAC,eAAe,IACxB,8DAAa,EACZ,IAAI,CAAC,WAAW,KACf,+DACE,KAAK,EAAC,mBAAmB,EACzB,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,IAAI,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,CAAC,IAEnC,+DACE,IAAI,EAAE,IAAI,CAAC,aAAa,KAAK,aAAa,CAAC,IAAI,GAAG,iBAAiB,GAAG,mBAAmB,EACzF,KAAK,EAAE,EAAE,EACT,MAAM,EAAE,EAAE,GACV,CACK,CACV,EACA,IAAI,CAAC,QAAQ,KACZ,4DAAK,KAAK,EAAC,sBAAsB,IAC/B,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,WAAW,GAAG,EAAiB,CAAC,EACnD,OAAO,EAAE,OAAO,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC,GAC3D,EACF,kEACE,GAAG,EAAE,CAAC,EAAE,MAAM,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAAW,EACxB,YAAY,EAAE,CAAC,KAAK,MAAM,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,eAAe,IAE9B,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACG,CACD,EACP;KACH;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["ZTh"],"sources":["src/components/table/cells/z-th/styles.css?tag=z-th&encapsulation=shadow","src/components/table/cells/z-th/index.tsx"],"sourcesContent":["@import \"../z-table-cells.css\";\n\n:host {\n  z-index: 1;\n  padding: 0;\n  background-color: var(--color-background);\n  font-weight: var(--font-sb);\n}\n\n.cell--content {\n  padding: var(--z-table--cells-padding, calc(var(--space-unit) * 2));\n}\n\n:host([show-sorting]) .cell--content {\n  column-gap: var(--space-unit);\n}\n\n.z-th--sort-button {\n  position: relative;\n  padding: 0;\n  border: none;\n  background-color: transparent;\n  cursor: pointer;\n  outline: none;\n}\n\n.z-th--sort-button:focus,\n.z-th--sort-button:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  opacity: 1;\n  outline: none;\n  pointer-events: all;\n}\n\n@media (min-width: 768px) and (hover: hover) {\n  :host([show-sorting=\"hover\"]) .z-th--sort-button {\n    opacity: 0;\n    pointer-events: none;\n  }\n\n  :host([show-sorting=\"hover\"]:hover) .z-th--sort-button,\n  :host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible,\n  :host([show-sorting=\"always\"]) .z-th--sort-button,\n  :host([sorted]) .z-th--sort-button {\n    opacity: 1;\n    pointer-events: all;\n  }\n}\n\n:host([show-sorting=\"hover\"]:hover) .z-th--sort-button::after,\n:host([show-sorting=\"hover\"]) .z-th--sort-button:focus:focus-visible::after,\n:host([show-sorting=\"always\"]) .z-th--sort-button::after,\n:host([sorted]) .z-th--sort-button::after {\n  position: absolute;\n  top: 6px;\n  left: 6px;\n  width: calc(100% - 12px);\n  height: calc(100% - 10px);\n  background-color: transparent;\n  content: \"\";\n}\n","import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, PopoverPosition, SortDirection, VisibilityCondition} from \"../../../../beans\";\n\n/**\n * ZTh component.\n * @slot - ZTh content.\n * @slot contextual-menu - Contextual menu content. Only visible when `showMenu` is true.\n */\n@Component({\n  tag: \"z-th\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZTh {\n  @Element() host: HTMLZThElement;\n\n  /**\n   * Number of columns that the cell should span.\n   */\n  @Prop()\n  colspan: number;\n\n  /**\n   * Enables the contextual menu.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the menu button.\n   */\n  @Prop({reflect: true})\n  showMenu: VisibilityCondition = null;\n\n  /**\n   * Enables the sorting button.\n   * Can be set to \"hover\" or \"always\" to show the button only on cell hover or always.\n   * Set a nullish value to hide the sort button.\n   */\n  @Prop({reflect: true})\n  showSorting: VisibilityCondition = null;\n\n  /**\n   * Whether the cell should stick.\n   */\n  @Prop({reflect: true})\n  sticky = false;\n\n  /**\n   * Current sorting direction.\n   */\n  @Prop({mutable: true})\n  sortDirection?: SortDirection;\n\n  /**\n   * Sorted state of the column.\n   */\n  @Prop({reflect: true, mutable: true})\n  sorted: boolean | null = false;\n\n  /**\n   * Set popover position.\n   */\n  @Prop()\n  popoverPosition = PopoverPosition.AUTO;\n\n  /**\n   * Store the open state of the menu.\n   */\n  @State()\n  isMenuOpen = false;\n\n  /**\n   * Sort event fired when the user clicks on the sort button.\n   * The sorting logic must be implemented by the app.\n   * You can set an `id` on the `z-th` to easly identify the column in the event listener.\n   */\n  @Event()\n  private sort: EventEmitter;\n\n  private menuTrigger: HTMLElement;\n\n  private popoverEl: HTMLZPopoverElement;\n\n  /**\n   * Get the value to set to the `aria-sort` attribute based on the current sort direction.\n   */\n  private get ariaSortDirection(): string {\n    if (!this.sortDirection) {\n      return null;\n    }\n\n    return this.sortDirection === SortDirection.ASC ? \"ascending\" : \"descending\";\n  }\n\n  /**\n   * Handle the click on the sort button.\n   * @fires sort\n   */\n  private handleSort(): void {\n    if (!this.sortDirection) {\n      this.sorted = false;\n\n      return;\n    }\n\n    this.sortDirection = this.sortDirection === SortDirection.ASC ? SortDirection.DESC : SortDirection.ASC;\n    this.sorted = true;\n\n    this.sort.emit({sortDirection: this.sortDirection});\n  }\n\n  @Watch(\"colspan\")\n  protected updateColspan(): void {\n    if (this.colspan) {\n      this.host.style.gridColumn = `span ${this.colspan}`;\n    } else {\n      this.host.style.removeProperty(\"grid-column\");\n    }\n  }\n\n  componentWillLoad(): void {\n    this.updateColspan();\n  }\n\n  render(): HTMLZThElement {\n    return (\n      <Host\n        role=\"columnheader\"\n        menu-open={this.isMenuOpen}\n        aria-sort={this.ariaSortDirection}\n        sortable={this.showSorting}\n      >\n        <div class=\"cell--content\">\n          <slot></slot>\n          {this.showSorting && (\n            <button\n              class=\"z-th--sort-button\"\n              type=\"button\"\n              onClick={this.handleSort.bind(this)}\n            >\n              <z-icon\n                name={this.sortDirection === SortDirection.DESC ? \"arrow-simple-up\" : \"arrow-simple-down\"}\n                width={14}\n                height={14}\n              />\n            </button>\n          )}\n          {this.showMenu && (\n            <div class=\"cell--menu-container\">\n              <z-button\n                variant={ButtonVariant.TERTIARY}\n                icon=\"contextual-menu\"\n                size={ControlSize.X_SMALL}\n                ref={(el) => (this.menuTrigger = el as HTMLElement)}\n                onClick={() => (this.popoverEl.open = !this.popoverEl.open)}\n              />\n              <z-popover\n                ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n                bindTo={this.menuTrigger}\n                onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n                position={this.popoverPosition}\n              >\n                <slot name=\"contextual-menu\"></slot>\n              </z-popover>\n            </div>\n          )}\n        </div>\n      </Host>\n    );\n  }\n}\n"],"version":3}

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

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

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

@@ -4171,7 +4171,7 @@ const ZToastNotification$1 = /*@__PURE__*/ proxyCustomElement(class ZToastNotifi
             } })))));
     }
     render() {
-        return (h(Host, { key: '5bb937ac057201c971f4aa0e96a08c683c7e6c95', style: { "--percentuale": `${this.percentage}%` }, class: this.transition ? this.transition : "", onAnimationEnd: (e) => {
+        return (h(Host, { key: '2be336d6b255e861e1e60fc7fab83ae29a5dfb1b', style: { "--percentuale": `${this.percentage}%` }, class: this.transition ? this.transition : "", onAnimationEnd: (e) => {
                 if (this.autoclose && e.animationName.includes("slidein")) {
                     this.startClosingTimeout(this.autoclose);
                 }

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

@@ -24,10 +24,10 @@ const ZToggleButton$1 = /*@__PURE__*/ proxyCustomElement(class ZToggleButton ext
         this.toggleClick.emit(this.opened);
     }
     render() {
-        return (h("button", { key: '603e31baab82eafe1c1c4bd9085e628bc3990d35', tabindex: this.avoidclick ? "-1" : "0", class: {
+        return (h("button", { key: '7ea71641a362b06f79fc18c44f5722f148d68bca', 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: 'b56ebc0a31dbed5a4b18a88db9b54da3eb85153d', 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: 'b6362ba86a8f2e9ae5778e70ec28712a541841cd', name: this.opened ? "chevron-down" : "chevron-up", width: 16, height: 16 }), this.label));
     }
     static get style() { return ZToggleButtonStyle0; }
 }, [1, "z-toggle-button", {