@zanichelli/albe-web-components 16.0.0-rc2 → 16.0.0

package/dist/collection/components/deprecated/z-menu-section-deprecated/index.spec.js

@@ -0,0 +1,50 @@
+import { newSpecPage } from "@stencil/core/testing";
+import { ZMenuSectionDeprecated } from "./index";
+describe("Suite test ZMenuSection", () => {
+    it("Test render ZMenu with items", async () => {
+        const page = await newSpecPage({
+            components: [ZMenuSectionDeprecated],
+            html: `<z-menu-section-deprecated>
+        <h3>Menu section label</h3>
+        <a href="#" slot="item">Item 1</a>
+        <a href="#" slot="item">Item 2</a>
+        <a href="#" slot="item">Item 3</a>
+      </z-menu-section-deprecated>`,
+        });
+        expect(page.root).toEqualHtml(`
+      <z-menu-section-deprecated role="menu">
+        <mock:shadow-root>
+          <button aria-pressed="false" class="label">
+            <slot></slot>
+            <z-icon name="chevron-down"></z-icon>
+          </button>
+        </mock:shadow-root>
+        <h3>Menu section label</h3>
+        <a href="#" slot="item">Item 1</a>
+        <a href="#" slot="item">Item 2</a>
+        <a href="#" slot="item">Item 3</a>
+    </z-menu-section-deprecated>`);
+    });
+    it("Test ZMenuSection toggle events", async () => {
+        const page = await newSpecPage({
+            components: [ZMenuSectionDeprecated],
+            html: `<z-menu-section-deprecated>
+        <div slot="item">item</div>
+      </z-menu-section-deprecated>`,
+        });
+        const menu = page.rootInstance;
+        const openedCallback = jest.fn();
+        page.doc.addEventListener("opened", openedCallback);
+        await page.waitForChanges();
+        // call `toggle` to open the menu
+        menu.toggle();
+        expect(openedCallback).toHaveBeenCalled();
+        const closedCallback = jest.fn();
+        page.doc.addEventListener("closed", closedCallback);
+        await page.waitForChanges();
+        // the menu is already open, this call will close it
+        menu.toggle();
+        expect(closedCallback).toHaveBeenCalled();
+    });
+});
+//# sourceMappingURL=index.spec.js.map

package/dist/collection/components/deprecated/z-menu-section-deprecated/index.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.spec.js","sourceRoot":"","sources":["../../../../../src/components/deprecated/z-menu-section-deprecated/index.spec.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,WAAW,EAAC,MAAM,uBAAuB,CAAC;AAElD,OAAO,EAAC,sBAAsB,EAAC,MAAM,SAAS,CAAC;AAE/C,QAAQ,CAAC,yBAAyB,EAAE,GAAG,EAAE;IACvC,EAAE,CAAC,8BAA8B,EAAE,KAAK,IAAI,EAAE;QAC5C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,sBAAsB,CAAC;YACpC,IAAI,EAAE;;;;;mCAKuB;SAC9B,CAAC,CAAC;QAEH,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,WAAW,CAAC;;;;;;;;;;;;iCAYD,CAAC,CAAC;IACjC,CAAC,CAAC,CAAC;IAEH,EAAE,CAAC,iCAAiC,EAAE,KAAK,IAAI,EAAE;QAC/C,MAAM,IAAI,GAAG,MAAM,WAAW,CAAC;YAC7B,UAAU,EAAE,CAAC,sBAAsB,CAAC;YACpC,IAAI,EAAE;;mCAEuB;SAC9B,CAAC,CAAC;QACH,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC;QAE/B,MAAM,cAAc,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACjC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;QACpD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,iCAAiC;QACjC,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,MAAM,CAAC,cAAc,CAAC,CAAC,gBAAgB,EAAE,CAAC;QAE1C,MAAM,cAAc,GAAG,IAAI,CAAC,EAAE,EAAE,CAAC;QACjC,IAAI,CAAC,GAAG,CAAC,gBAAgB,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAC;QACpD,MAAM,IAAI,CAAC,cAAc,EAAE,CAAC;QAC5B,oDAAoD;QACpD,IAAI,CAAC,MAAM,EAAE,CAAC;QACd,MAAM,CAAC,cAAc,CAAC,CAAC,gBAAgB,EAAE,CAAC;IAC5C,CAAC,CAAC,CAAC;AACL,CAAC,CAAC,CAAC","sourcesContent":["import {newSpecPage} from \"@stencil/core/testing\";\n\nimport {ZMenuSectionDeprecated} from \"./index\";\n\ndescribe(\"Suite test ZMenuSection\", () => {\n  it(\"Test render ZMenu with items\", async () => {\n    const page = await newSpecPage({\n      components: [ZMenuSectionDeprecated],\n      html: `<z-menu-section-deprecated>\n        <h3>Menu section label</h3>\n        <a href=\"#\" slot=\"item\">Item 1</a>\n        <a href=\"#\" slot=\"item\">Item 2</a>\n        <a href=\"#\" slot=\"item\">Item 3</a>\n      </z-menu-section-deprecated>`,\n    });\n\n    expect(page.root).toEqualHtml(`\n      <z-menu-section-deprecated role=\"menu\">\n        <mock:shadow-root>\n          <button aria-pressed=\"false\" class=\"label\">\n            <slot></slot>\n            <z-icon name=\"chevron-down\"></z-icon>\n          </button>\n        </mock:shadow-root>\n        <h3>Menu section label</h3>\n        <a href=\"#\" slot=\"item\">Item 1</a>\n        <a href=\"#\" slot=\"item\">Item 2</a>\n        <a href=\"#\" slot=\"item\">Item 3</a>\n    </z-menu-section-deprecated>`);\n  });\n\n  it(\"Test ZMenuSection toggle events\", async () => {\n    const page = await newSpecPage({\n      components: [ZMenuSectionDeprecated],\n      html: `<z-menu-section-deprecated>\n        <div slot=\"item\">item</div>\n      </z-menu-section-deprecated>`,\n    });\n    const menu = page.rootInstance;\n\n    const openedCallback = jest.fn();\n    page.doc.addEventListener(\"opened\", openedCallback);\n    await page.waitForChanges();\n    // call `toggle` to open the menu\n    menu.toggle();\n    expect(openedCallback).toHaveBeenCalled();\n\n    const closedCallback = jest.fn();\n    page.doc.addEventListener(\"closed\", closedCallback);\n    await page.waitForChanges();\n    // the menu is already open, this call will close it\n    menu.toggle();\n    expect(closedCallback).toHaveBeenCalled();\n  });\n});\n"]}

package/dist/collection/components/deprecated/z-menu-section-deprecated/index.stories.js

@@ -0,0 +1,41 @@
+import { html } from "lit";
+import "./index";
+const StoryMeta = {
+    title: "Deprecated/ZMenuSection",
+    component: "z-menu-section-deprecated",
+    args: {
+        active: false,
+    },
+};
+export default StoryMeta;
+export const WithItems = {
+    render: (args) => html `
+    <z-menu-section-deprecated .active=${args.active}>
+      <h3>Label</h3>
+      <a
+        href=""
+        slot="item"
+        >Item 1</a
+      >
+      <a
+        href=""
+        slot="item"
+        >Item 2</a
+      >
+      <a
+        href=""
+        slot="item"
+        active
+        >Item 3 - active</a
+      >
+    </z-menu-section-deprecated>
+  `,
+};
+export const WithoutItems = {
+    render: (args) => html `
+    <z-menu-section-deprecated .active=${args.active}>
+      <h3>Label</h3>
+    </z-menu-section-deprecated>
+  `,
+};
+//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/deprecated/z-menu-section-deprecated/index.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../../src/components/deprecated/z-menu-section-deprecated/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,yBAAyB;IAChC,SAAS,EAAE,2BAA2B;IACtC,IAAI,EAAE;QACJ,MAAM,EAAE,KAAK;KACd;CACqC,CAAC;AAEzC,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,SAAS,GAAG;IACvB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;yCACiB,IAAI,CAAC,MAAM;;;;;;;;;;;;;;;;;;;GAmBjD;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,YAAY,GAAG;IAC1B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;yCACiB,IAAI,CAAC,MAAM;;;GAGjD;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZMenuSectionDeprecated} from \".\";\nimport \"./index\";\n\nconst StoryMeta = {\n  title: \"Deprecated/ZMenuSection\",\n  component: \"z-menu-section-deprecated\",\n  args: {\n    active: false,\n  },\n} satisfies Meta<ZMenuSectionDeprecated>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZMenuSectionDeprecated>;\n\nexport const WithItems = {\n  render: (args) => html`\n    <z-menu-section-deprecated .active=${args.active}>\n      <h3>Label</h3>\n      <a\n        href=\"\"\n        slot=\"item\"\n        >Item 1</a\n      >\n      <a\n        href=\"\"\n        slot=\"item\"\n        >Item 2</a\n      >\n      <a\n        href=\"\"\n        slot=\"item\"\n        active\n        >Item 3 - active</a\n      >\n    </z-menu-section-deprecated>\n  `,\n} satisfies Story;\n\nexport const WithoutItems = {\n  render: (args) => html`\n    <z-menu-section-deprecated .active=${args.active}>\n      <h3>Label</h3>\n    </z-menu-section-deprecated>\n  `,\n} satisfies Story;\n"]}

package/dist/collection/components/deprecated/z-menu-section-deprecated/styles.css

@@ -0,0 +1,123 @@
+:host {
+  display: inline-flex;
+  flex-direction: column;
+  align-items: flex-start;
+  justify-content: center;
+  padding: 0;
+  font-family: var(--font-family-sans);
+}
+
+:host,
+::slotted(*),
+* {
+  box-sizing: border-box;
+}
+
+::slotted(a) {
+  text-decoration: none;
+}
+
+::slotted(*) {
+  color: var(--color-default-text);
+  font-family: var(--font-family-sans);
+  font-weight: var(--font-rg);
+}
+
+:host(:is([active], [open])) .label,
+.label:hover {
+  border-color: var(--color-secondary01);
+}
+
+:host(:is([active], [open])) .label ::slotted(*),
+.label:focus:focus-visible ::slotted(*),
+.label:hover ::slotted(*) {
+  font-weight: var(--font-bd);
+}
+
+.label {
+  display: flex;
+  width: 100%;
+  align-items: center;
+  padding: calc(var(--space-unit) * 2) calc(var(--space-unit) / 2);
+  border: 0;
+  border-bottom: var(--border-size-small) solid var(--color-surface05);
+  margin: 0;
+  background: transparent;
+  border-radius: 0;
+  cursor: pointer;
+  text-align: left;
+}
+
+::slotted([data-text]) {
+  display: inline-flex;
+  flex-direction: column;
+}
+
+/* Trick to prevent layout shifts on font-weight changes.
+The trick is to put an hidden copy of the text already set to bold,
+so the needed space is correctly calculated before any hover/active state changes the
+font-weight of the real text.
+The hidden text has an height of 0px so it can expand the width without changing the height
+when placed below the real text using `flex-direction: column`. */
+::slotted([data-text])::after {
+  overflow: hidden;
+  height: 0;
+  content: attr(data-text);
+  content: attr(data-text) / "";
+  font-weight: var(--font-bd);
+  pointer-events: none;
+  user-select: none;
+  visibility: hidden;
+}
+
+@media speech {
+  ::slotted([data-text])::after {
+    display: none;
+  }
+}
+
+.label ::slotted(*) {
+  width: 100%;
+  margin: 0;
+  font-size: var(--font-size-3);
+  line-height: 1.25;
+}
+
+.label:focus:focus-visible {
+  box-shadow: var(--shadow-focus-primary);
+  outline: none;
+}
+
+.label z-icon {
+  margin-left: calc(var(--space-unit) * 4);
+  fill: var(--color-default-icon);
+}
+
+.items {
+  display: flex;
+  width: 100%;
+  flex-direction: column;
+  padding: calc(var(--space-unit) / 2);
+  padding-bottom: calc(var(--space-unit) * 1.5);
+}
+
+.items > ::slotted([slot="item"]) {
+  display: inline-flex;
+  padding: calc(var(--space-unit) / 2);
+  margin: 0;
+  font-size: var(--font-size-2);
+  line-height: 1.4;
+  outline: none;
+}
+
+.items > ::slotted([slot="item"]:focus:focus-visible) {
+  box-shadow: var(--shadow-focus-primary);
+  color: var(--color-secondary01);
+}
+
+.items > ::slotted([slot="item"]:hover),
+.items > ::slotted([slot="item"]:focus:focus-visible),
+.items > ::slotted([slot="item"][active]) {
+  color: var(--color-secondary01);
+  font-weight: var(--font-bd);
+}

package/dist/collection/components/file-upload/z-dragdrop-area/index.js

@@ -10,7 +10,7 @@ export class ZDragdropArea {
         return (h("div", { class: "dragover-container" }, h("div", { class: "dragover-message" }, h("span", { class: "body-2-sb" }, this.dragAndDropLabel))));
     }
     render() {
-        return (h("div", { key: '41334ac77bca3fb0d30518480b702c815d95b125', tabIndex: 0, ref: (val) => (this.dragDropContainer = val), class: "dragdrop", onDragOver: (e) => {
+        return (h("div", { key: '1b7b83c36eaed52bc0a7c1bd935aeb457199bd68', tabIndex: 0, ref: (val) => (this.dragDropContainer = val), class: "dragdrop", onDragOver: (e) => {
                 e.preventDefault();
                 this.dragDropContainer.classList.add("dragover");
             }, onDragLeave: () => {
@@ -21,7 +21,7 @@ export class ZDragdropArea {
                     this.dragDropContainer.classList.remove("dragover");
                     this.fileDroppedHandler(e.dataTransfer.files);
                 }
-            } }, this.renderOnDragOverMessage(), h("slot", { key: '83344ee14fcec799690b644fe0a56cc86e1b4476' })));
+            } }, this.renderOnDragOverMessage(), h("slot", { key: '45848602ab9f4c3318f506386d174cf8ec2fc84b' })));
     }
     static get is() { return "z-dragdrop-area"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/file-upload/z-file/index.js

@@ -32,7 +32,7 @@ export class ZFile {
         return this.ellipsis.offsetWidth < this.ellipsis.scrollWidth;
     }
     render() {
-        return (h(Host, { key: '03c2efd6f2abf7ba920eb9ac47f268ade6ec1404' }, this.allowPopover && (h("z-popover", { key: 'f916e0f4aed0a9c7d2a8ff59ee0a073baff02ad5', open: this.popoverVisible, position: PopoverPosition.AUTO, bindTo: this.chip }, h("span", { key: '1f364c21b8bd45ff52c23a40df45ee1684271122', class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { key: '0c69ec654a4fb7f251bdd904ffec476c911e545a', ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { key: 'b71ea54ee7156bfb324f7d5f2fa71d9b50c167bf', ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
+        return (h(Host, { key: 'fd8490c60c3266c39e2b4fa7b3cc4097da8222cf' }, this.allowPopover && (h("z-popover", { key: 'af7c9370bdaa644ecfb50e1ae69fd425b1347b36', open: this.popoverVisible, position: PopoverPosition.AUTO, bindTo: this.chip }, h("span", { key: 'faa8e08ffbae25222396effe24db44e53ccfb892', class: "body-5 tooltip-content" }, this.ellipsis.innerText))), h("z-chip", { key: 'ed790fdb2b1639e4f44cde4da98daa101a44abb0', ref: (el) => (this.chip = el), id: `chip-${this.fileNumber}`, interactiveIcon: "multiply-circled", type: ZChipType.DEFAULT }, h("span", { key: '0bae3bda90db4e3793a22629b30439017e3543a3', ref: (el) => (this.ellipsis = el), tabIndex: -1 }, this.fileName))));
     }
     static get is() { return "z-file"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/file-upload/z-file-upload/index.js

@@ -193,7 +193,7 @@ export class ZFileUpload {
         }))))));
     }
     render() {
-        return (h(Host, { key: '30d78f7ce88aa6e994de1355cf4bb8bbc79e6f85' }, h("div", { key: 'b95129c709a9161cb1c08bc39a308196fc26644d', class: `container ${this.getType()}` }, this.mainTitle && this.renderTitle(), this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()), !!this.invalidFiles.size && (h("z-modal", { key: '2e0db26fa301fa0141ac14fe92f2a222f2a5f2c8', modalid: `file-upload-${this.type}-error-modal`, tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: this.errorModalTitle, onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent()))));
+        return (h(Host, { key: '7520b5da6e58534cb4c732d0745424b9b6de6991' }, h("div", { key: 'fbdd488d4cfe2cc3a01f0d2e4abfea6df3b6c8c8', class: `container ${this.getType()}` }, this.mainTitle && this.renderTitle(), this.getType() == ZFileUploadType.DEFAULT ? this.renderDefaultMode() : this.renderDragDropMode()), !!this.invalidFiles.size && (h("z-modal", { key: '26e02bd9c532f2c4b38ab94854875d8b8aba9058', modalid: `file-upload-${this.type}-error-modal`, tabIndex: 0, ref: (val) => (this.errorModal = val), modaltitle: this.errorModalTitle, onModalClose: () => (this.invalidFiles = new Map()), onModalBackgroundClick: () => (this.invalidFiles = new Map()) }, this.handleErrorModalContent()))));
     }
     static get is() { return "z-file-upload"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/list/z-list/index.js

@@ -18,7 +18,7 @@ export class ZList {
         this.setChildrenSizeType();
     }
     render() {
-        return (h(Host, { key: 'a5269da1127742a7a9e58e8b0e46174c4c990a39' }, h("slot", { key: 'ced862d8fb2e6e4d86212e9dd22ca1c12a184fe3' })));
+        return (h(Host, { key: '633a5d569f1cf8bb85c40da691e254fb9f78f6bd' }, h("slot", { key: 'bd1315c66e0dca81cfe6607f4a82245b94c84e6b' })));
     }
     static get is() { return "z-list"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/list/z-list-element/index.js

@@ -115,7 +115,7 @@ export class ZListElement {
         }
     }
     render() {
-        return (h(Host, { key: 'b62c211ee47f6a05a2404a5f27d44aea4c4d3067', "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onFocus: () => this.ariaDescendantFocus.emit(this.listElementId), onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: this.htmlTabindex }, h("div", { key: '33ba57474a0a13545a14e9b94b7bda1f762a11b0', class: "container", style: { color: `var(--${this.color})` }, tabindex: "-1", id: `z-list-element-id-${this.listElementId}`, part: "list-item-container" }, h("div", { key: '1cfcd978c233414902faf1d4b624aa93cf3bcc11', class: "z-list-element-container" }, this.renderExpandableButton(), this.renderContent()), this.renderExpandedContent()), this.dividerType === ListDividerType.ELEMENT && (h("z-divider", { key: 'dbe033f9d3a796cb344b640d6a02b4e923bebd2b', color: this.dividerColor, size: this.dividerSize }))));
+        return (h(Host, { key: '8b3fcd0834960a5549178f3f26d48b8236f27449', "aria-expanded": this.expandable ? this.showInnerContent : null, onClick: this.handleClick, onFocus: () => this.ariaDescendantFocus.emit(this.listElementId), onKeyDown: this.handleKeyDown, clickable: this.clickable && !this.disabled, tabIndex: this.htmlTabindex }, h("div", { key: '6cd5ef8d54e9bb0780737cbd300a3809464c9901', class: "container", style: { color: `var(--${this.color})` }, tabindex: "-1", id: `z-list-element-id-${this.listElementId}`, part: "list-item-container" }, h("div", { key: '4ba2505a4483ec70134f6b39ce18351b679db379', class: "z-list-element-container" }, this.renderExpandableButton(), this.renderContent()), this.renderExpandedContent()), this.dividerType === ListDividerType.ELEMENT && (h("z-divider", { key: 'ac96ea3379df56b2a3b67164d52a0633764aab23', color: this.dividerColor, size: this.dividerSize }))));
     }
     static get is() { return "z-list-element"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/list/z-list-group/index.js

@@ -25,10 +25,10 @@ export class ZListGroup {
         this.hasHeader = !!this.host.querySelector('[slot="header-title"]');
     }
     render() {
-        return (h(Host, { key: '5732fd0502a40361f81b8896d35b5ecb50f3d405', role: "group" }, h("div", { key: 'd70da2717bc7ba681b0e4a01c9c83404d51ceba9', class: {
+        return (h(Host, { key: 'a2bd11f2847f5bc4e955b1db58e73f8caa65ad63', role: "group" }, h("div", { key: '073b18d2d7fe3c04dea626217dbf0c964853bbc1', class: {
                 "z-list-group-header-container": true,
                 "has-header": this.hasHeader,
-            } }, h("slot", { key: '77ed9d0a8baffb09574d5e9a183dbf8fbf3f4a96', name: "header-title" }), this.dividerType === ListDividerType.HEADER && (h("z-divider", { key: '35051ec5919d79249f1bb35a29587b53a1b1da89', color: this.dividerColor, size: this.dividerSize }))), h("slot", { key: '6920f9d885ec1e4a250164a4dc1d5c266246af4c' })));
+            } }, h("slot", { key: '4683cdfdd16d2dba19b4580ff7819edbe42953cd', name: "header-title" }), this.dividerType === ListDividerType.HEADER && (h("z-divider", { key: '3fa3dd94bcdde1f2bd4f7d17ed48cec4916719f4', color: this.dividerColor, size: this.dividerSize }))), h("slot", { key: 'ce8e83727c6a050df7df95e4c2321619f5d5da33' })));
     }
     static get is() { return "z-list-group"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/cells/z-td/index.js

@@ -1,5 +1,5 @@
 import { Host, h } from "@stencil/core";
-import { ButtonVariant, ControlSize, PopoverPosition } from "../../../../beans";
+import { ButtonVariant, ControlSize } from "../../../../beans";
 /**
  * ZTd component.
  * @slot - ZTd content.
@@ -9,7 +9,6 @@ export class ZTd {
         this.colspan = undefined;
         this.sticky = false;
         this.showMenu = null;
-        this.defaultPopoverPosition = PopoverPosition.AUTO;
         this.isMenuOpen = false;
     }
     updateColspan() {
@@ -29,7 +28,7 @@ export class ZTd {
         this.updateColspan();
     }
     render() {
-        return (h(Host, { key: '11dd26beba05505c83837d94ebeb26d248bbb62c', role: "cell", "menu-open": this.isMenuOpen }, h("slot", { key: '906a0382bcc8934d8289f4b2170b6e535f04f34e' }), this.showMenu && (h("div", { key: 'b42a8f99ec4c0601e2b37325493809a3e2cbe690', class: "cell--menu-container prevent-expand" }, h("z-button", { key: '5e5f54d928b6e73a0906cda2b34be82de9a015b2', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: '09631e74d2db0ee9626ce603630f1b0ce2330ff7', class: "cell-popover", ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.defaultPopoverPosition }, h("slot", { key: 'daf2cf250daabcc062c8f05f5caf650ea0e24f4b', name: "contextual-menu" }))))));
+        return (h(Host, { key: '1fea1ea7d31da2e0042696d5c3036493ab0b173d', role: "cell", "menu-open": this.isMenuOpen }, h("slot", { key: 'a836a18a19decbe4b7fed5a6f038332c5c14cdd2' }), this.showMenu && (h("div", { key: '7d06355b81a0bac85f5e8248737881436a44e3d7', class: "cell--menu-container prevent-expand" }, h("z-button", { key: '4d039e48c2e30cfb522fda920ae3aaadaa3ef8ae', variant: ButtonVariant.TERTIARY, icon: "contextual-menu", size: ControlSize.X_SMALL, ref: (el) => (this.menuTrigger = el), onClick: this.onMenuButtonClick.bind(this) }), h("z-popover", { key: 'efa44a812bb9f7c9e18ab884fcf53685d90de52e', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open) }, h("slot", { key: '010336ffd3977a84af2c616d300afc7001e225a4', name: "contextual-menu" }))))));
     }
     static get is() { return "z-td"; }
     static get encapsulation() { return "shadow"; }
@@ -103,30 +102,6 @@ export class ZTd {
                 "attribute": "show-menu",
                 "reflect": true,
                 "defaultValue": "null"
-            },
-            "defaultPopoverPosition": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "PopoverPosition",
-                    "resolved": "PopoverPosition.AUTO | PopoverPosition.BOTTOM | PopoverPosition.BOTTOM_LEFT | PopoverPosition.BOTTOM_RIGHT | PopoverPosition.LEFT | PopoverPosition.LEFT_BOTTOM | PopoverPosition.LEFT_TOP | PopoverPosition.RIGHT | PopoverPosition.RIGHT_BOTTOM | PopoverPosition.RIGHT_TOP | PopoverPosition.TOP | PopoverPosition.TOP_LEFT | PopoverPosition.TOP_RIGHT",
-                    "references": {
-                        "PopoverPosition": {
-                            "location": "import",
-                            "path": "../../../../beans",
-                            "id": "src/beans/index.tsx::PopoverPosition"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Set a the popover default position."
-                },
-                "attribute": "default-popover-position",
-                "reflect": false,
-                "defaultValue": "PopoverPosition.AUTO"
             }
         };
     }

package/dist/collection/components/table/cells/z-td/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/table/cells/z-td/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACnG,OAAO,EAAC,aAAa,EAAE,WAAW,EAAE,eAAe,EAAE,mBAAmB,EAAC,MAAM,mBAAmB,CAAC;AAEnG;;;GAGG;AAMH,MAAM,OAAO,GAAG;;;sBAaL,KAAK;wBAQkB,IAAI;sCAMO,eAAe,CAAC,IAAI;0BAMlD,KAAK;;IAgBR,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;QACtD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;QAChD,CAAC;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;IAC7C,CAAC;IAEO,iBAAiB,CAAC,EAAc;QACtC,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;IAC7C,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,IAAI,EAAC,MAAM,eACA,IAAI,CAAC,UAAU;YAE1B,8DAAa;YACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,4DAAK,KAAK,EAAC,qCAAqC;gBAC9C,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,GAC1C;gBACF,kEACE,KAAK,EAAC,cAAc,EACpB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,EAC9D,QAAQ,EAAE,IAAI,CAAC,sBAAsB;oBAErC,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["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 a the popover default position.\n   */\n  @Prop()\n  defaultPopoverPosition?: 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        <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.defaultPopoverPosition}\n            >\n              <slot name=\"contextual-menu\"></slot>\n            </z-popover>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../../../src/components/table/cells/z-td/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAgB,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACnG,OAAO,EAAC,aAAa,EAAE,WAAW,EAAE,mBAAmB,EAAC,MAAM,mBAAmB,CAAC;AAElF;;;GAGG;AAMH,MAAM,OAAO,GAAG;;;sBAaL,KAAK;wBAQkB,IAAI;0BAMvB,KAAK;;IAgBR,aAAa;QACrB,IAAI,IAAI,CAAC,OAAO,EAAE,CAAC;YACjB,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,UAAU,GAAG,QAAQ,IAAI,CAAC,OAAO,EAAE,CAAC;QACtD,CAAC;aAAM,CAAC;YACN,IAAI,CAAC,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,aAAa,CAAC,CAAC;QAChD,CAAC;QAED,IAAI,CAAC,aAAa,CAAC,IAAI,CAAC,IAAI,CAAC,OAAO,IAAI,CAAC,CAAC,CAAC;IAC7C,CAAC;IAEO,iBAAiB,CAAC,EAAc;QACtC,EAAE,CAAC,eAAe,EAAE,CAAC;QACrB,IAAI,CAAC,SAAS,CAAC,IAAI,GAAG,CAAC,IAAI,CAAC,SAAS,CAAC,IAAI,CAAC;IAC7C,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,aAAa,EAAE,CAAC;IACvB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,IAAI,EAAC,MAAM,eACA,IAAI,CAAC,UAAU;YAE1B,8DAAa;YACZ,IAAI,CAAC,QAAQ,IAAI,CAChB,4DAAK,KAAK,EAAC,qCAAqC;gBAC9C,iEACE,OAAO,EAAE,aAAa,CAAC,QAAQ,EAC/B,IAAI,EAAC,iBAAiB,EACtB,IAAI,EAAE,WAAW,CAAC,OAAO,EACzB,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,WAAW,GAAG,EAAwB,CAAC,EAC1D,OAAO,EAAE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,IAAI,CAAC,GAC1C;gBACF,kEACE,GAAG,EAAE,CAAC,EAAE,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,SAAS,GAAG,EAAyB,CAAC,EACzD,MAAM,EAAE,IAAI,CAAC,WAA0B,EACvC,YAAY,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC;oBAE9D,6DAAM,IAAI,EAAC,iBAAiB,GAAQ,CAC1B,CACR,CACP,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {ButtonVariant, ControlSize, 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   * 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        <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              ref={(el) => (this.popoverEl = el as HTMLZPopoverElement)}\n              bindTo={this.menuTrigger as HTMLElement}\n              onOpenChange={(event) => (this.isMenuOpen = event.detail.open)}\n            >\n              <slot name=\"contextual-menu\"></slot>\n            </z-popover>\n          </div>\n        )}\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/table/cells/z-td/styles.css

@@ -45,10 +45,6 @@
   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;

package/dist/collection/components/table/cells/z-th/index.js

@@ -48,7 +48,7 @@ export class ZTh {
         this.updateColspan();
     }
     render() {
-        return (h(Host, { key: '6d7379e559b77ea796584c9cdc49be8dabb3cd67', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection }, h("slot", { key: 'e21bf2439c1061cf7acaeddb6a3afe8818112493' }), this.sortDirection && (h("button", { key: 'e65ed301cea08cb0cdaf3ce2b13cb06dc61705ea', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, h("z-icon", { key: '1768ea275af78502035d66fb2a4f80fff68bc6e0', name: this.sortDirection === SortDirection.ASC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (h("div", { key: 'b516e407bc90fa95fa1ae914a344cdcd89f38336', class: "cell--menu-container" }, h("z-button", { key: '4f76bb047c904a88d2e78117811932b9cc9b409d', 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: '08fcadf9b57a3184f8fceef2925c19ef3d9f659e', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: '4f2ad7d81457d1132d3b156368bd96813994fc3c', name: "contextual-menu" }))))));
+        return (h(Host, { key: '222509e3075cd7a6668301f8b54cebd3af7bd843', role: "columnheader", "menu-open": this.isMenuOpen, "aria-sort": this.ariaSortDirection }, h("slot", { key: '728dffd6851b3b9f6647a136c0d84d0da10c894b' }), this.sortDirection && (h("button", { key: 'a75b468b0057f404fdfcafd77cf63f10999f274a', class: "z-th--sort-button", type: "button", onClick: this.handleSort.bind(this) }, h("z-icon", { key: '9d4ac199ba40228afd8b4ac087effde4ae37f55b', name: this.sortDirection === SortDirection.ASC ? "arrow-simple-up" : "arrow-simple-down", width: 14, height: 14 }))), this.showMenu && (h("div", { key: '4769a6dfa1e6222448b1d409746dbe1f6420cc5d', class: "cell--menu-container" }, h("z-button", { key: '90951859a7fdcaddec8769e95d8a65de5c7e5ff7', 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: '3066d766feab4b810d41b78a5f3801cbffa5688d', ref: (el) => (this.popoverEl = el), bindTo: this.menuTrigger, onOpenChange: (event) => (this.isMenuOpen = event.detail.open), position: this.popoverPosition }, h("slot", { key: '9bf90081ba6d5c82cdd9c69f0dd536bda756b8af', name: "contextual-menu" }))))));
     }
     static get is() { return "z-th"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/cells/z-th/styles.css

@@ -45,10 +45,6 @@
   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;

package/dist/collection/components/table/z-table/index.js

@@ -36,7 +36,7 @@ export class ZTable {
         (_a = this.expandableMutationObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
     }
     render() {
-        return (h(Host, { key: '5f7370afd7912583561ac67baf5b70921c49eea2', expandable: this.expandable }, h("div", { key: '8cbf774ffe599cf49ed9377c2ff3c1e0e8d14e85', class: "table", role: "table" }, h("slot", { key: '318eceb0c4e486a49faab1fe7027acfa76456352' }))));
+        return (h(Host, { key: '2d8e50a74ff7ccf3c6dc4f5324a512177ad52f45', expandable: this.expandable }, h("div", { key: '5e1d9d44dc90ac06683bf5306f7eecadffe807fe', class: "table", role: "table" }, h("slot", { key: '12a615e336a4ad50390a2ab0b12b2d20b3503f06' }))));
     }
     static get is() { return "z-table"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/z-tbody/index.js

@@ -5,7 +5,7 @@ import { Host, h } from "@stencil/core";
  */
 export class ZTbody {
     render() {
-        return (h(Host, { key: '82690ddf3bdd8b742cadcf45a75778892d15c5bf', role: "rowgroup" }, h("slot", { key: '6b1a45b35318f6df0966ee67aa60f33aa32c5751' })));
+        return (h(Host, { key: 'f3e13d724ae83c0117eafa2bd141a1b9319f0331', role: "rowgroup" }, h("slot", { key: 'f84d2b79230cb6b8305c0b01f4a48f8811634421' })));
     }
     static get is() { return "z-tbody"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/z-tfoot/index.js

@@ -8,7 +8,7 @@ export class ZTfoot {
         this.sticky = false;
     }
     render() {
-        return (h(Host, { key: 'c56c6c8f9f3eda99f7eaed147ef2df8c99d43cda', role: "rowgroup" }, h("slot", { key: '03eeb74397f395723a8a649bb7213ac9fdbcf4f0' })));
+        return (h(Host, { key: 'b872f68fd9e643528d02adb7bd76f8377a59fcdc', role: "rowgroup" }, h("slot", { key: '6ebdc491ee2459d415a53fb96e5f27405704a99f' })));
     }
     static get is() { return "z-tfoot"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/z-thead/index.js

@@ -8,7 +8,7 @@ export class ZThead {
         this.sticky = false;
     }
     render() {
-        return (h(Host, { key: 'e1e45a7e6e5325a7c0b82cf490d7896f233b35fa', role: "rowgroup" }, h("slot", { key: '8e2f327fc3e2721b1a7755024b9eb43ab87ac2d3' })));
+        return (h(Host, { key: '44bbf57a110328328c65171e6463a5128d0be2e7', role: "rowgroup" }, h("slot", { key: '1953f6a0c9d96f3cbf66ed0e856391d19e985e20' })));
     }
     static get is() { return "z-thead"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/table/z-tr/index.js

@@ -43,7 +43,7 @@ export class ZTr {
         this.updateColumns();
     }
     render() {
-        return (h(Host, { key: 'a7834f72abcf18e74ff16ff9dbbcb4e987f673df', role: "row", onClick: this.onRowClick.bind(this), expanded: this.expanded }, h("div", { key: 'badaec159c7abf449da9c7015fb2fa240ce14377', class: "z-tr--expand-button-container" }, this.expandable && (h("button", { key: '6e312e5e8f907d05968b636f6368cda6397214eb', "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, h("z-icon", { key: 'e054cb205c4a81e1e88509300976133c21f27d0f', name: this.expanded ? "minus-circled" : "plus-circled" })))), h("slot", { key: '95b75f93a1c27d6245e8993dcdfeef3f614c1843', onSlotchange: this.updateColumns.bind(this) })));
+        return (h(Host, { key: '1048c6109f085ef7d6a2c80ee1f821378f1419eb', role: "row", onClick: this.onRowClick.bind(this), expanded: this.expanded }, h("div", { key: 'b4333edd3915db24134ec862e61e42af75544544', class: "z-tr--expand-button-container" }, this.expandable && (h("button", { key: 'f5d0233257d0ffd2d1221b850f9d33565b882bfe', "aria-expanded": this.expanded ? "true" : "false", "aria-label": this.expanded ? "Comprimi riga" : "Espandi riga", "aria-controls": this.expandableContentId, type: "button" }, h("z-icon", { key: '0c0e51bac7a95bab954450447b2bce3dfa0079b6', name: this.expanded ? "minus-circled" : "plus-circled" })))), h("slot", { key: 'f7af8227af6ec842ead9b12ad13a6d1df448c9a6', onSlotchange: this.updateColumns.bind(this) })));
     }
     static get is() { return "z-tr"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/z-accordion/index.js

@@ -47,7 +47,7 @@ export class ZAccordion {
         this.toggled.emit(this.open);
     }
     render() {
-        return (h("details", { key: '38787e09f78228eedda870ebd2380feae9f221ef', ref: (elm) => (this.detailsElm = elm), onToggle: this.onDetailsToggle.bind(this), open: this.open }, h("summary", { key: '5eebc1fe756b6ef603bd0170fd53aa9548e02dec', tabIndex: this.isDisabled ? -1 : null, part: "summary" }, this.icon && (h("z-icon", { key: '741eab4038e866bc34259348e66d0115a55ad333', class: "z-accordion-label-icon", name: this.icon })), h("span", { key: 'e82c28a47084aba4a031ce947ac22e73d9c0c26d', class: "z-accordion-label" }, this.label), h("span", { key: '20279a9c0935c533a909a124a1f87f266d5783a3', class: "z-accordion-tags" }, h("slot", { key: '697e5e1cfb5764da59ded7eec41a3e7a2edd56b4', name: "tag" })), h("z-icon", { key: '079968872230475ee1783077819387e205ebdf72', class: "z-accordion-chevron", name: this.open ? "chevron-up" : "chevron-down" })), !this.isDisabled && (h("div", { key: '4377a46e29de0d5e079f1e8011b3e6e10bf1a876', class: "z-accordion-content", part: "content" }, h("slot", { key: 'e998671e6f42b524ab26d2ef71931acf5ed680b7' })))));
+        return (h("details", { key: '56a50ae163d1cb527d90732d637d0a657641cff7', ref: (elm) => (this.detailsElm = elm), onToggle: this.onDetailsToggle.bind(this), open: this.open }, h("summary", { key: '22095c950d00c43d6ddfc3eaea13c804e24fbb37', tabIndex: this.isDisabled ? -1 : null, part: "summary" }, this.icon && (h("z-icon", { key: '40f7b6d5dec14284aba76ca8884740b81f4d43a0', class: "z-accordion-label-icon", name: this.icon })), h("span", { key: '781a5720488ab4972e685d3ac4efafaf25cb1a20', class: "z-accordion-label" }, this.label), h("span", { key: '83fbad7e915391654344591231db512b13ccd1bb', class: "z-accordion-tags" }, h("slot", { key: 'd02d6e89bf46e606fdf229906036fbf3ebdbff05', name: "tag" })), h("z-icon", { key: 'd239c54b1187939517baf24809cab9c5168afa2a', class: "z-accordion-chevron", name: this.open ? "chevron-up" : "chevron-down" })), !this.isDisabled && (h("div", { key: '750de9f238fad34d4d380f585cc948067f229f8a', class: "z-accordion-content", part: "content" }, h("slot", { key: '41568aa9d4e561b1f7f43fbf2bf9cb7ab0c1a713' })))));
     }
     static get is() { return "z-accordion"; }
     static get encapsulation() { return "shadow"; }

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

@@ -49,7 +49,7 @@ export class ZAnchorNavigation {
         window.removeEventListener("hashchange", this.setCurrent);
     }
     render() {
-        return (h(Host, { key: '6869675f35b8ca58e36058d10ed89301d2b49034', collapsed: this.collapsed }, h("z-button", { key: 'd6bacaf89ac6731dacb2250793c7ffba4a43a989', class: "toggle", variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, "salta a"), h("nav", { key: '0c308debc3e444015e1c8733af628d0b7a5d8b6e', ref: (el) => (this.nav = el) }, h("slot", { key: '02b49c5a23db78d839ba6320f1cbbd770cfa6d3f' }))));
+        return (h(Host, { key: 'b4e85ef373611b9543bab61b0045437916d9cd09', collapsed: this.collapsed }, h("z-button", { key: '97dfa2f7f35db72615f5a263dd13d4c3db94c0b4', class: "toggle", variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, "salta a"), h("nav", { key: '8e51117f3e341260b9a1794ff2432811dfba0683', ref: (el) => (this.nav = el) }, h("slot", { key: '2d1c7cece920f74947f5e07565498b162680d87b' }))));
     }
     static get is() { return "z-anchor-navigation"; }
     static get originalStyleUrls() {