@zanichelli/albe-web-components 19.3.0-RC3 → 19.3.0-RC5

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

@@ -18,20 +18,41 @@ import { AccordionVariant, ControlSize } from "../../beans";
  */
 export class ZAccordion {
     constructor() {
-        this.label = undefined;
-        this.icon = undefined;
+        /**
+         * Size of the component.
+         */
         this.size = ControlSize.BIG;
+        /**
+         * Disabled state of the accordion.
+         */
         this.isDisabled = false;
+        /**
+         * The open state of the accordion.
+         */
         this.open = false;
+        /**
+         * Enable highlight band on the `summary`'s left edge.
+         */
         this.highlight = false;
+        /**
+         * Accordion variant.
+         */
         this.variant = AccordionVariant.DEFAULT;
+        /**
+         * Enable box-shadow on the accordion. Only applies when `variant` is `BACKGROUND`.
+         */
         this.shadow = true;
+        this.hasSlottedTags = false;
     }
     onDisabledChange() {
         if (this.isDisabled) {
             this.open = false;
         }
     }
+    /** Check if there is any content in the "tag" slot. */
+    checkSlottedTags() {
+        this.hasSlottedTags = !!this.host.querySelector('[slot="tag"]');
+    }
     /**
      * Handle `details` element toggle.
      * If currently disabled, prevent toggling by forcing the `open` state to `false`.
@@ -46,8 +67,11 @@ export class ZAccordion {
         this.open = this.detailsElm.open;
         this.toggled.emit(this.open);
     }
+    componentWillLoad() {
+        this.checkSlottedTags();
+    }
     render() {
-        return (h("details", { key: 'f200b59fb522e1f4210c76166302bcf6ac45595f', ref: (elm) => (this.detailsElm = elm), onToggle: this.onDetailsToggle.bind(this), open: this.open }, h("summary", { key: 'a79f3922eaba8a7bdebe1bf32d628e8dd107d628', tabIndex: this.isDisabled ? -1 : null, part: "summary" }, this.icon && (h("z-icon", { key: '0679fd5cac2fdf4ea28a004a5981cc1140f33ed0', class: "z-accordion-label-icon", name: this.icon })), h("span", { key: '09e815bb1327ccc96a0e5fda7eae128ecff8754e', class: "z-accordion-label" }, this.label), h("span", { key: '27ed45123f223f3704d2fe6b28516c2091eed597', class: "z-accordion-tags" }, h("slot", { key: '45ff9568cd256dce70ea503e65f98681547e388e', name: "tag" })), h("z-icon", { key: 'c3c24df225af9c7b8f4462f1711342ebc659758a', class: "z-accordion-chevron", name: this.open ? "chevron-up" : "chevron-down" })), !this.isDisabled && (h("div", { key: '454c954054e741d7aaac1c0fa43fd0f6e807947b', class: "z-accordion-content", part: "content" }, h("slot", { key: '935f1db0be6b8e35feab63df7235c1a70ee9a5fd' })))));
+        return (h("details", { key: '172a7daef5025f190bec2ac50755edd73930b002', ref: (elm) => (this.detailsElm = elm), onToggle: this.onDetailsToggle.bind(this), open: this.open }, h("summary", { key: 'afef8986b1c567de4d979f4352b060841e2d9915', tabIndex: this.isDisabled ? -1 : null, part: "summary" }, this.icon && (h("z-icon", { key: '4d96182e2f30cc0d8a4920854775a5daa2f551c5', class: "z-accordion-label-icon", name: this.icon })), h("span", { key: '339defc76d0ce353bff86e3c53067ceda6fa0350', class: "z-accordion-label" }, this.label), this.hasSlottedTags && (h("span", { key: '9e25512f093b7770894aff7590d2a829ed48943b', class: "z-accordion-tags" }, h("slot", { key: 'f24b026310c4d00632a131502960dfdade72cf85', name: "tag", onSlotchange: () => this.checkSlottedTags() }))), h("z-icon", { key: 'd930ae94ebc17c279626bcb4a94e5bcfbe490c3a', class: "z-accordion-chevron", name: this.open ? "chevron-up" : "chevron-down" })), !this.isDisabled && (h("div", { key: '8d33c1ead662fa11c01acaae2a3ee2ee72278bbb', class: "z-accordion-content", part: "content" }, h("slot", { key: 'fba6c3dd4ae6905f7e5d179a7b6af2de7bb4f8ca' })))));
     }
     static get is() { return "z-accordion"; }
     static get encapsulation() { return "shadow"; }
@@ -77,8 +101,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Text label."
                 },
-                "attribute": "label",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "label"
             },
             "icon": {
                 "type": "string",
@@ -94,8 +120,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Name of the z-icon to display before the label's text."
                 },
-                "attribute": "icon",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "icon"
             },
             "size": {
                 "type": "string",
@@ -107,7 +135,8 @@ export class ZAccordion {
                         "ControlSize": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::ControlSize"
+                            "id": "src/beans/index.tsx::ControlSize",
+                            "referenceLocation": "ControlSize"
                         }
                     }
                 },
@@ -117,8 +146,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Size of the component."
                 },
-                "attribute": "size",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "size",
                 "defaultValue": "ControlSize.BIG"
             },
             "isDisabled": {
@@ -135,8 +166,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Disabled state of the accordion."
                 },
-                "attribute": "is-disabled",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "is-disabled",
                 "defaultValue": "false"
             },
             "open": {
@@ -153,8 +186,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "The open state of the accordion."
                 },
-                "attribute": "open",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "open",
                 "defaultValue": "false"
             },
             "highlight": {
@@ -171,8 +206,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Enable highlight band on the `summary`'s left edge."
                 },
-                "attribute": "highlight",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "highlight",
                 "defaultValue": "false"
             },
             "variant": {
@@ -185,7 +222,8 @@ export class ZAccordion {
                         "AccordionVariant": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::AccordionVariant"
+                            "id": "src/beans/index.tsx::AccordionVariant",
+                            "referenceLocation": "AccordionVariant"
                         }
                     }
                 },
@@ -195,8 +233,10 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Accordion variant."
                 },
-                "attribute": "variant",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "variant",
                 "defaultValue": "AccordionVariant.DEFAULT"
             },
             "shadow": {
@@ -213,12 +253,19 @@ export class ZAccordion {
                     "tags": [],
                     "text": "Enable box-shadow on the accordion. Only applies when `variant` is `BACKGROUND`."
                 },
-                "attribute": "shadow",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "shadow",
                 "defaultValue": "true"
             }
         };
     }
+    static get states() {
+        return {
+            "hasSlottedTags": {}
+        };
+    }
     static get events() {
         return [{
                 "method": "toggled",
@@ -237,6 +284,7 @@ export class ZAccordion {
                 }
             }];
     }
+    static get elementRef() { return "host"; }
     static get watchers() {
         return [{
                 "propName": "isDisabled",
@@ -244,4 +292,3 @@ export class ZAccordion {
             }];
     }
 }
-//# sourceMappingURL=index.js.map

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

@@ -57,7 +57,7 @@ const StoryMeta = {
         "--z-accordion-content-bg": null,
         "--z-accordion-content-fg": null,
         "--z-accordion-hover-color": null,
-        "--z-accordion-highlight-color": null,
+        "--z-accordion-highlight-color": "var(--color-primary01)",
         "--z-accordion-right-padding": "var(--space-unit)",
         "--z-accordion-left-padding": "calc(var(--space-unit) * 2)",
         "--z-accordion-label-font-weight": "var(--font-sb)",
@@ -111,9 +111,9 @@ export const Stack = {
         "--z-accordion-highlight-color4": cssPropsArgs["--z-accordion-highlight-color"],
     },
     args: {
-        "--z-accordion-highlight-color2": null,
-        "--z-accordion-highlight-color3": null,
-        "--z-accordion-highlight-color4": null,
+        "--z-accordion-highlight-color2": "var(--color-primary01)",
+        "--z-accordion-highlight-color3": "var(--color-primary01)",
+        "--z-accordion-highlight-color4": "var(--color-primary01)",
     },
     parameters: {
         controls: {
@@ -162,4 +162,3 @@ export const WithTags = {
     </z-accordion>
   `,
 };
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-accordion/styles.css

@@ -177,6 +177,8 @@ summary z-icon.z-accordion-chevron {
 
 :host([variant="background"]) .z-accordion-content {
   padding-right: calc(var(--space-unit) * 2);
+  border-bottom-left-radius: calc(var(--border-radius) - var(--border-size-small));
+  border-bottom-right-radius: calc(var(--border-radius) - var(--border-size-small));
 }
 
 :host([is-disabled]) .z-accordion-label {
@@ -224,37 +226,3 @@ summary z-icon.z-accordion-chevron {
     --z-icon-height: 18px;
   }
 }
-
-/* Style for sibling accordions in a stack context */
-
-z-accordion + z-accordion {
-  border-top: none;
-}
-
-z-accordion[variant="background"] + z-accordion[variant="background"] {
-  border-radius: 0;
-}
-
-z-accordion[variant="background"]:first-of-type:not(:last-of-type) {
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-}
-
-z-accordion[variant="background"] + z-accordion[variant="background"]:last-of-type {
-  border-bottom-left-radius: var(--border-radius);
-  border-bottom-right-radius: var(--border-radius);
-}
-
-z-accordion[variant="background"]:first-of-type:not(:last-of-type)::part(summary) {
-  border-bottom-left-radius: 0;
-  border-bottom-right-radius: 0;
-}
-
-z-accordion[variant="background"] + z-accordion[variant="background"]::part(summary) {
-  border-radius: 0;
-}
-
-z-accordion[variant="background"] + z-accordion[variant="background"]:last-of-type:not([open])::part(summary) {
-  border-bottom-left-radius: calc(var(--border-radius) - var(--border-size-small));
-  border-bottom-right-radius: calc(var(--border-radius) - var(--border-size-small));
-}

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

@@ -17,10 +17,30 @@ import { ButtonVariant, ControlSize } from "../../beans";
  */
 export class ZAnchorNavigation {
     constructor() {
+        /**
+         * If enabled, the text of each anchor will be hidden unless
+         * for the current one or the one the user is hovering.
+         */
         this.hideUnselected = false;
+        /**
+         * Enables automatic inference of the current item, listening for hash change
+         * and checking the `href` of the slotted anchors.
+         * When disabled, the highlight of current item must be handled manually by setting the `data-current`
+         * attribute to the correct slotted items and the `aria-current` attribute to the anchors.
+         */
         this.autoCurrent = true;
+        /**
+         * Sets the label of the button displayed on mobile viewport when the anchor navigation is collapsed
+         */
         this.collapsedLabel = "salta a";
+        /**
+         * Explicitly collapse anchor navigation.
+         * If false will collapse automatically only on mobile.
+         */
         this.isCollapsed = false;
+        /**
+         * Whether the mobile list is collapsed.
+         */
         this.collapsed = false;
     }
     /**
@@ -51,7 +71,7 @@ export class ZAnchorNavigation {
         window.removeEventListener("hashchange", this.setCurrent);
     }
     render() {
-        return (h(Host, { key: '3d9a8c823dae6090990a8f0a1b7498589824e629', collapsed: this.collapsed, class: "z-scrollbar" }, h("z-button", { key: 'bf5858d8dcba5601c94b36ae087c44ace5a047a9', class: "toggle", size: ControlSize.SMALL, variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, this.collapsedLabel), h("nav", { key: '78812ef819a063dd7e8f0bcd55ceab6bbb419219', ref: (el) => (this.nav = el) }, h("slot", { key: '1c2aa06b4837962e032379844fc2fb642bbf8d10' }))));
+        return (h(Host, { key: '39d74e83a12d8fa3284190da2becd9fbe2f88211', collapsed: this.collapsed, class: "z-scrollbar" }, h("z-button", { key: 'b7a98b737dfd5d2499c9626a4e4ee626d92896da', class: "toggle", size: ControlSize.SMALL, variant: ButtonVariant.SECONDARY, icon: this.collapsed ? "chevron-up" : "chevron-down", onClick: this.toggleCollapsed.bind(this) }, this.collapsedLabel), h("nav", { key: 'b28787b604e8e2ef9ae6a6f6d2e9b6e162ce37f3', ref: (el) => (this.nav = el) }, h("slot", { key: 'aaaa4ab016f1916fd6b4ee6723882862884538b0' }))));
     }
     static get is() { return "z-anchor-navigation"; }
     static get originalStyleUrls() {
@@ -80,8 +100,10 @@ export class ZAnchorNavigation {
                     "tags": [],
                     "text": "If enabled, the text of each anchor will be hidden unless\nfor the current one or the one the user is hovering."
                 },
-                "attribute": "hide-unselected",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "hide-unselected",
                 "defaultValue": "false"
             },
             "autoCurrent": {
@@ -98,8 +120,10 @@ export class ZAnchorNavigation {
                     "tags": [],
                     "text": "Enables automatic inference of the current item, listening for hash change\nand checking the `href` of the slotted anchors.\nWhen disabled, the highlight of current item must be handled manually by setting the `data-current`\nattribute to the correct slotted items and the `aria-current` attribute to the anchors."
                 },
-                "attribute": "auto-current",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "auto-current",
                 "defaultValue": "true"
             },
             "collapsedLabel": {
@@ -116,8 +140,10 @@ export class ZAnchorNavigation {
                     "tags": [],
                     "text": "Sets the label of the button displayed on mobile viewport when the anchor navigation is collapsed"
                 },
-                "attribute": "collapsed-label",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "collapsed-label",
                 "defaultValue": "\"salta a\""
             },
             "isCollapsed": {
@@ -134,8 +160,10 @@ export class ZAnchorNavigation {
                     "tags": [],
                     "text": "Explicitly collapse anchor navigation.\nIf false will collapse automatically only on mobile."
                 },
-                "attribute": "is-collapsed",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "is-collapsed",
                 "defaultValue": "false"
             }
         };
@@ -147,4 +175,3 @@ export class ZAnchorNavigation {
     }
     static get elementRef() { return "host"; }
 }
-//# sourceMappingURL=index.js.map

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

@@ -348,4 +348,3 @@ export const AutoCurrentDisabling = {
     </div>
   `,
 };
-//# sourceMappingURL=index.stories.js.map

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

@@ -1,4 +1,4 @@
-import { Fragment, Host, h } from "@stencil/core";
+import { Fragment, Host, h, } from "@stencil/core";
 import { ButtonVariant, ControlSize, KeyboardCode, OffCanvasVariant, TransitionDirection } from "../../beans";
 import { Breakpoints } from "../../constants/breakpoints";
 import { containsElement } from "../../utils/utils";
@@ -214,24 +214,47 @@ export class ZAppHeader {
         return (h("div", { class: "heading-stuck" }, h("div", { class: "heading-stuck-content" }, this.renderMenuButton(), h("div", { class: "heading-title" }, this.renderProductLogos(), h("div", { class: "stucked-title" }, h("slot", { name: "stucked-title" }, this.title))), this.enableSearch && this.renderSeachbar())));
     }
     constructor() {
-        this.menuElements = [];
-        this.stuckIntersecObserver = SUPPORT_INTERSECTION_OBSERVER
-            ? new IntersectionObserver(([entry]) => {
-                this._stuck = !entry.isIntersecting;
-            }, { threshold: 0.5 })
-            : undefined;
+        /**
+         * Stuck mode for the header.
+         * You can programmatically set it using an IntersectionObserver.
+         */
         this.stuck = false;
+        /**
+         * When enabled, the menu bar is not displayed and a burger icon appears to open the offcanvas menu. Automatically enabled on mobile and when the menu items overflow the container.
+         */
         this.enableOffcanvas = false;
+        /**
+         * Enable the search bar.
+         */
         this.enableSearch = false;
+        /**
+         * Placeholder text for the search bar.
+         */
         this.searchPlaceholder = "Cerca";
+        /**
+         * Search string for the search bar.
+         */
         this.searchString = "";
-        this.searchPageUrl = undefined;
+        /**
+         * Enable laZ logo.
+         */
         this.enableZLogo = true;
+        /**
+         * The opening state of the drawer.
+         */
         this.drawerOpen = false;
+        /**
+         * The stuck state of the bar.
+         */
         this._stuck = false;
-        this.menuLength = undefined;
         this.isMobile = true;
         this.isTablet = false;
+        this.menuElements = [];
+        this.stuckIntersecObserver = SUPPORT_INTERSECTION_OBSERVER
+            ? new IntersectionObserver(([entry]) => {
+                this._stuck = !entry.isIntersecting;
+            }, { threshold: 0.5 })
+            : undefined;
         this.openDrawer = this.openDrawer.bind(this);
         this.closeDrawer = this.closeDrawer.bind(this);
         this.collectMenuElements = this.collectMenuElements.bind(this);
@@ -257,7 +280,7 @@ export class ZAppHeader {
     }
     render() {
         const hasTopSubtitle = this.hasSlot("top-subtitle");
-        return (h(Host, { key: 'cabccb026186feb602cd31cc410ac12bb374326d', "menu-length": this.menuLength }, h("div", { key: 'c684735c076498f245c528f48cf306bf21cbb8ba', class: { "heading-panel": true, "has-menubar": this.menuLength > 0 && !this.enableOffcanvas }, ref: (el) => (this.container = el) }, h("div", { key: '30beac4e17122b912943f83cd9f57498200cc5d5', class: { "heading-container": true, "has-top-subtitle": hasTopSubtitle } }, ((!this.enableSearch && this.isMobile) || !this.isMobile) && (h("div", { key: 'cd5ceee248c0ef5283df7d846be121256933e75e', class: { "top-subtitle": true, "has-product-logo": hasTopSubtitle && this.hasSlot("product-logo") } }, h("slot", { key: '96d7891d2fef52dd8b601d31a4a36e3635428775', name: "top-subtitle" }))), h("div", { key: '552c146d1edc5ecad7ed354859787c9ae811bbe1', class: "heading-title" }, h("slot", { key: 'a03a2cb293b596de013ccf6279a75d11b719f054', name: "menu-button" }, this.renderMenuButton()), !this._stuck && this.renderProductLogos(), h("slot", { key: '47899e75dea4f44b50ef4f981037e7a8d7652403', name: "title" }), this.enableSearch && !this.isMobile && this.renderSeachbar()), this.enableSearch && this.isMobile && this.renderSeachbar()), h("nav", { key: '46d0be7f5ac779ed93ff061332dbf8289d041b6d', class: "menu-container", "aria-label": this.title || undefined }, this.canShowMenu && (h("div", { key: 'a552a43cbf8b3bab46285bc2b5846c4925341eaa', role: "menubar", "aria-label": this.title || undefined }, h("slot", { key: '7f93c00e6183af3a08b87513f2a41a0ec16c0b1d', name: "menu", onSlotchange: this.collectMenuElements }))))), this.renderOffcanvas(), this._stuck && this.renderStuck()));
+        return (h(Host, { key: 'dc030db81c271ed36850fb287d29ace79851d4a1', "menu-length": this.menuLength }, h("div", { key: '49d34b66c216a92c80eb9216fa52e48add4cee0a', class: { "heading-panel": true, "has-menubar": this.menuLength > 0 && !this.enableOffcanvas }, ref: (el) => (this.container = el) }, h("div", { key: '29639ab6d0620491c69651139ddf8311e2177122', class: { "heading-container": true, "has-top-subtitle": hasTopSubtitle } }, ((!this.enableSearch && this.isMobile) || !this.isMobile) && (h("div", { key: 'bc685fb828a89777bec6dcc5bc754534f83361cd', class: { "top-subtitle": true, "has-product-logo": hasTopSubtitle && this.hasSlot("product-logo") } }, h("slot", { key: 'cb2b1468f4b34d11dbf444f2cde0c7cce86cbd1e', name: "top-subtitle" }))), h("div", { key: '80036c45fcbd3d490b85f653efb35010b1639b6f', class: "heading-title" }, h("slot", { key: 'bc4a0397893534c0dac99e081ef0ba5d6db2ecd3', name: "menu-button" }, this.renderMenuButton()), !this._stuck && this.renderProductLogos(), h("slot", { key: 'a72c2c657ae430e0cc6b134e843fec1c983e7777', name: "title" }), this.enableSearch && !this.isMobile && this.renderSeachbar()), this.enableSearch && this.isMobile && this.renderSeachbar()), h("nav", { key: 'b620b02b62b99b13e6b4c0c1be0997d3af448aeb', class: "menu-container", "aria-label": this.title || undefined }, this.canShowMenu && (h("div", { key: '6c1887c703734a0e1ab4b77b821dad2e9bc0c3df', role: "menubar", "aria-label": this.title || undefined }, h("slot", { key: '2daaf3501852cab84cf2b3a85a770553dc70a101', name: "menu", onSlotchange: this.collectMenuElements }))))), this.renderOffcanvas(), this._stuck && this.renderStuck()));
     }
     static get is() { return "z-app-header"; }
     static get encapsulation() { return "shadow"; }
@@ -287,8 +310,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Stuck mode for the header.\nYou can programmatically set it using an IntersectionObserver."
                 },
-                "attribute": "stuck",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "stuck",
                 "defaultValue": "false"
             },
             "enableOffcanvas": {
@@ -305,8 +330,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "When enabled, the menu bar is not displayed and a burger icon appears to open the offcanvas menu. Automatically enabled on mobile and when the menu items overflow the container."
                 },
-                "attribute": "enable-offcanvas",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "enable-offcanvas",
                 "defaultValue": "false"
             },
             "enableSearch": {
@@ -323,8 +350,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Enable the search bar."
                 },
-                "attribute": "enable-search",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "enable-search",
                 "defaultValue": "false"
             },
             "searchPlaceholder": {
@@ -341,8 +370,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Placeholder text for the search bar."
                 },
-                "attribute": "search-placeholder",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "search-placeholder",
                 "defaultValue": "\"Cerca\""
             },
             "searchString": {
@@ -359,8 +390,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Search string for the search bar."
                 },
-                "attribute": "search-string",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "search-string",
                 "defaultValue": "\"\""
             },
             "searchPageUrl": {
@@ -377,8 +410,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Url to the search page.\nSet this prop and `enableSearch` to show a link-button on mobile and tablet viewports, instead of the normal searchbar.\nThe link will also appear on the sticky header."
                 },
-                "attribute": "search-page-url",
-                "reflect": false
+                "getter": false,
+                "setter": false,
+                "reflect": false,
+                "attribute": "search-page-url"
             },
             "enableZLogo": {
                 "type": "boolean",
@@ -394,8 +429,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "Enable laZ logo."
                 },
-                "attribute": "enable-z-logo",
+                "getter": false,
+                "setter": false,
                 "reflect": true,
+                "attribute": "enable-z-logo",
                 "defaultValue": "true"
             },
             "drawerOpen": {
@@ -412,8 +449,10 @@ export class ZAppHeader {
                     "tags": [],
                     "text": "The opening state of the drawer."
                 },
-                "attribute": "drawer-open",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "drawer-open",
                 "defaultValue": "false"
             }
         };
@@ -479,4 +518,3 @@ export class ZAppHeader {
             }];
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-app-header/index.stories.js

@@ -300,4 +300,3 @@ export const SearchPageButton = {
       ${menuTemplate()}
     </z-app-header>`,
 };
-//# sourceMappingURL=index.stories.js.map

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

@@ -2,10 +2,11 @@ import { Host, h } from "@stencil/core";
 import { ZAriaAlertMode } from "../../beans";
 export class ZAriaAlert {
     constructor() {
+        /** Aria live mode */
         this.mode = ZAriaAlertMode.POLITE;
     }
     render() {
-        return (h(Host, { key: '14f0e24e89aba53c3ef6147cc371f3123f5ff688', "aria-live": this.mode, "aria-atomic": "true", "aria-relevant": "additions" }, h("slot", { key: '1e1f8ef102be9d3f3302059f74e170c43158855b' })));
+        return (h(Host, { key: '13857c631b48af312fa399d224dd299d24ad7026', "aria-live": this.mode, "aria-atomic": "true", "aria-relevant": "additions" }, h("slot", { key: 'b5f4501e8230e2d669eb24d431a39e58232eab20' })));
     }
     static get is() { return "z-aria-alert"; }
     static get properties() {
@@ -20,7 +21,8 @@ export class ZAriaAlert {
                         "ZAriaAlertMode": {
                             "location": "import",
                             "path": "../../beans",
-                            "id": "src/beans/index.tsx::ZAriaAlertMode"
+                            "id": "src/beans/index.tsx::ZAriaAlertMode",
+                            "referenceLocation": "ZAriaAlertMode"
                         }
                     }
                 },
@@ -30,11 +32,12 @@ export class ZAriaAlert {
                     "tags": [],
                     "text": "Aria live mode"
                 },
-                "attribute": "mode",
+                "getter": false,
+                "setter": false,
                 "reflect": false,
+                "attribute": "mode",
                 "defaultValue": "ZAriaAlertMode.POLITE"
             }
         };
     }
 }
-//# sourceMappingURL=index.js.map

package/dist/collection/components/z-aria-alert/index.stories.js

@@ -73,4 +73,3 @@ export const VisuallyHidden = {
         </z-visually-hidden>
       </div>`,
 };
-//# sourceMappingURL=index.stories.js.map