@zanichelli/albe-web-components 19.3.0-RC4 → 19.3.0-RC6

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

@@ -1,303 +0,0 @@
-import { html } from "lit";
-import "../z-menu-section/index";
-import "../z-menu/index";
-import "./index";
-import "./index.stories.css";
-const StoryMeta = {
-    title: "ZAppHeader",
-    component: "z-app-header",
-    parameters: {
-        layout: "fullscreen",
-    },
-    subcomponents: {
-        ZMenu: "z-menu",
-        ZMenuSection: "z-menu-section",
-    },
-    args: {
-        "--app-header-content-max-width": "100%",
-        "enableSearch": false,
-        "searchPageUrl": "",
-        "enableZLogo": false,
-        "enableOffcanvas": false,
-    },
-};
-export default StoryMeta;
-const menuItemsTemplate = () => {
-    return html `<a
-      href=""
-      slot="item"
-      >Item 1</a
-    >
-    <z-menu-section slot="item">
-      <h3>Item 2</h3>
-      <a
-        href=""
-        slot="section"
-        >Item 2.1</a
-      >
-      <a
-        href=""
-        slot="section"
-        >Item 2.2</a
-      >
-    </z-menu-section>
-    <z-menu-section slot="item">
-      <h3>Item 3</h3>
-      <a
-        href=""
-        slot="section"
-        >Item 3.1</a
-      >
-      <a
-        href=""
-        slot="section"
-        >Item 3.2</a
-      >
-    </z-menu-section>
-    <a
-      href=""
-      slot="item"
-      >Item 4</a
-    >
-    <z-menu-section slot="item">
-      <h3>Item 5</h3>
-      <a
-        href=""
-        slot="section"
-        >Item 5.1</a
-      >
-      <a
-        href=""
-        slot="section"
-        >Item 5.2</a
-      >
-    </z-menu-section>`;
-};
-const menuTemplate = () => {
-    return html `
-    <z-menu slot="menu">
-      <h3>Menu label 1</h3>
-      ${menuItemsTemplate()}
-    </z-menu>
-
-    <z-menu slot="menu">
-      <a href>Menu label 2</a>
-    </z-menu>
-
-    <z-menu slot="menu">
-      <h3>Menu label 3</h3>
-      ${menuItemsTemplate()}
-    </z-menu>
-
-    <z-menu slot="menu">
-      <h3>Menu label 4</h3>
-      ${menuItemsTemplate()}
-    </z-menu>
-  `;
-};
-export const Title = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${args.enableZLogo}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <a href="zanichelli.it" slot="title">Applicazione</h1>
-    </z-app-header>`,
-};
-export const ProductLogo = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${args.enableZLogo}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h1 slot="title">Applicazione</h1>
-      <div
-        class="story-product-logo"
-        slot="product-logo"
-      ></div>
-    </z-app-header>`,
-};
-export const TopTitle = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas", "enableZLogo"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h2 slot="top-subtitle">Payoff dell'applicazione</h2>
-      <h1 slot="title">Applicazione</h1>
-    </z-app-header>`,
-};
-export const TopTitleWithProductLogo = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas", "enableZLogo"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${false}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h2 slot="top-subtitle">Payoff dell'applicazione</h2>
-      <h1 slot="title">Applicazione</h1>
-      <div
-        class="story-product-logo"
-        slot="product-logo"
-      ></div>
-    </z-app-header>`,
-};
-export const CustomMenuButton = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${args.enableZLogo}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <button slot="menu-button"><z-icon name="gear" /></button>
-      <a href="zanichelli.it" slot="title">Applicazione</h1>
-    </z-app-header>`,
-};
-export const MenuWithTopTitle = {
-    parameters: {
-        controls: {
-            exclude: ["enableZLogo"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableOffcanvas=${args.enableOffcanvas}
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h2 slot="top-subtitle">Payoff dell'applicazione</h2>
-      <h1 slot="title">Applicazione</h1>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-export const MenuWithTopTitleAndProductLogo = {
-    parameters: {
-        controls: {
-            exclude: ["enableZLogo"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      .enableOffcanvas=${args.enableOffcanvas}
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${false}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h2 slot="top-subtitle">Payoff dell'applicazione</h2>
-      <h1 slot="title">Applicazione</h1>
-      <div
-        class="story-product-logo"
-        slot="product-logo"
-      ></div>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-export const LongTitle = {
-    parameters: {
-        controls: {
-            exclude: ["enableOffcanvas", "enableZLogo", "enableSearch", "searchPageUrl"],
-        },
-    },
-    render: (args) => html `<z-app-header style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}">
-      <h1 slot="title">Fondamenti di fisica 8e - Meccanica, Onde, Termodinamica, Elettromagnetismo, Ottica</h1>
-      <h2 slot="top-subtitle">Jearl Walker, David Halliday, Robert Resnick</h2>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-export const OffcanvasMenu = {
-    args: {
-        enableOffcanvas: true,
-    },
-    render: (args) => html `<z-app-header
-      .enableOffcanvas=${args.enableOffcanvas}
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      .enableZLogo=${args.enableZLogo}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h1 slot="title">Applicazione</h1>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-export const Stuck = {
-    decorators: [
-        (Story) => html `
-      <div style="padding: 16px var(--grid-margin)">Scroll to see <code>stuck</code> prop in action.</div>
-      <div style="height: 200vh">${Story()}</div>
-    `,
-    ],
-    parameters: {
-        docs: {
-            story: {
-                inline: false,
-                iframeHeight: "400px",
-            },
-        },
-        controls: {
-            exclude: ["enableOffcanvas"],
-        },
-    },
-    render: (args) => html `<z-app-header
-      stuck
-      .enableZLogo=${args.enableZLogo}
-      .enableSearch=${args.enableSearch}
-      .searchPageUrl=${args.searchPageUrl}
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}; --app-header-top-offset: 0"
-    >
-      <h1 slot="title">Fondamenti di fisica 8e - Meccanica, Onde, Termodinamica, Elettromagnetismo, Ottica</h1>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-export const SearchPageButton = {
-    parameters: {
-        controls: {
-            exclude: ["searchPageUrl", "enableSearch", "enableOffcanvas"],
-        },
-    },
-    decorators: [
-        (Story) => html `
-      <div style="padding: 16px var(--grid-margin)">
-        The prop <code>searchPageUrl</code> only affects the component in tablet and mobile viewports.
-      </div>
-      ${Story()}
-    `,
-    ],
-    render: (args) => html `<z-app-header
-      enable-search
-      .enableZLogo=${args.enableZLogo}
-      search-page-url="https://www.zanichelli.it"
-      style="--app-header-content-max-width: ${args["--app-header-content-max-width"]}"
-    >
-      <h1 slot="title">Applicazione</h1>
-      <h2 slot="subtitle">Payoff dell'applicazione</h2>
-      ${menuTemplate()}
-    </z-app-header>`,
-};
-//# sourceMappingURL=index.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-app-header/index.stories.ts"],"names":[],"mappings":"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","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {TemplateResult, html} from \"lit\";\nimport {ZAppHeader} from \".\";\nimport {CSSVarsArguments} from \"../../utils/storybook-utils\";\nimport \"../z-menu-section/index\";\nimport \"../z-menu/index\";\nimport \"./index\";\nimport \"./index.stories.css\";\n\ntype ZAppHeaderStoriesArgs = ZAppHeader & CSSVarsArguments<\"app-header-content-max-width\">;\n\nconst StoryMeta = {\n  title: \"ZAppHeader\",\n  component: \"z-app-header\",\n  parameters: {\n    layout: \"fullscreen\",\n  },\n  subcomponents: {\n    ZMenu: \"z-menu\",\n    ZMenuSection: \"z-menu-section\",\n  },\n  args: {\n    \"--app-header-content-max-width\": \"100%\",\n    \"enableSearch\": false,\n    \"searchPageUrl\": \"\",\n    \"enableZLogo\": false,\n    \"enableOffcanvas\": false,\n  },\n} satisfies Meta<ZAppHeaderStoriesArgs>;\n\nexport default StoryMeta;\n\nconst menuItemsTemplate = (): TemplateResult => {\n  return html`<a\n      href=\"\"\n      slot=\"item\"\n      >Item 1</a\n    >\n    <z-menu-section slot=\"item\">\n      <h3>Item 2</h3>\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 2.1</a\n      >\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 2.2</a\n      >\n    </z-menu-section>\n    <z-menu-section slot=\"item\">\n      <h3>Item 3</h3>\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 3.1</a\n      >\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 3.2</a\n      >\n    </z-menu-section>\n    <a\n      href=\"\"\n      slot=\"item\"\n      >Item 4</a\n    >\n    <z-menu-section slot=\"item\">\n      <h3>Item 5</h3>\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 5.1</a\n      >\n      <a\n        href=\"\"\n        slot=\"section\"\n        >Item 5.2</a\n      >\n    </z-menu-section>`;\n};\n\nconst menuTemplate = (): TemplateResult => {\n  return html`\n    <z-menu slot=\"menu\">\n      <h3>Menu label 1</h3>\n      ${menuItemsTemplate()}\n    </z-menu>\n\n    <z-menu slot=\"menu\">\n      <a href>Menu label 2</a>\n    </z-menu>\n\n    <z-menu slot=\"menu\">\n      <h3>Menu label 3</h3>\n      ${menuItemsTemplate()}\n    </z-menu>\n\n    <z-menu slot=\"menu\">\n      <h3>Menu label 4</h3>\n      ${menuItemsTemplate()}\n    </z-menu>\n  `;\n};\n\ntype Story = Meta<ZAppHeaderStoriesArgs>;\n\nexport const Title = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${args.enableZLogo}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <a href=\"zanichelli.it\" slot=\"title\">Applicazione</h1>\n    </z-app-header>`,\n} satisfies Story;\n\nexport const ProductLogo = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${args.enableZLogo}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h1 slot=\"title\">Applicazione</h1>\n      <div\n        class=\"story-product-logo\"\n        slot=\"product-logo\"\n      ></div>\n    </z-app-header>`,\n} satisfies Story;\n\nexport const TopTitle = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\", \"enableZLogo\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h2 slot=\"top-subtitle\">Payoff dell'applicazione</h2>\n      <h1 slot=\"title\">Applicazione</h1>\n    </z-app-header>`,\n} satisfies Story;\n\nexport const TopTitleWithProductLogo = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\", \"enableZLogo\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${false}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h2 slot=\"top-subtitle\">Payoff dell'applicazione</h2>\n      <h1 slot=\"title\">Applicazione</h1>\n      <div\n        class=\"story-product-logo\"\n        slot=\"product-logo\"\n      ></div>\n    </z-app-header>`,\n} satisfies Story;\n\nexport const CustomMenuButton = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${args.enableZLogo}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <button slot=\"menu-button\"><z-icon name=\"gear\" /></button>\n      <a href=\"zanichelli.it\" slot=\"title\">Applicazione</h1>\n    </z-app-header>`,\n} satisfies Story;\n\nexport const MenuWithTopTitle = {\n  parameters: {\n    controls: {\n      exclude: [\"enableZLogo\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableOffcanvas=${args.enableOffcanvas}\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h2 slot=\"top-subtitle\">Payoff dell'applicazione</h2>\n      <h1 slot=\"title\">Applicazione</h1>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n\nexport const MenuWithTopTitleAndProductLogo = {\n  parameters: {\n    controls: {\n      exclude: [\"enableZLogo\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableOffcanvas=${args.enableOffcanvas}\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${false}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h2 slot=\"top-subtitle\">Payoff dell'applicazione</h2>\n      <h1 slot=\"title\">Applicazione</h1>\n      <div\n        class=\"story-product-logo\"\n        slot=\"product-logo\"\n      ></div>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n\nexport const LongTitle = {\n  parameters: {\n    controls: {\n      exclude: [\"enableOffcanvas\", \"enableZLogo\", \"enableSearch\", \"searchPageUrl\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\">\n      <h1 slot=\"title\">Fondamenti di fisica 8e - Meccanica, Onde, Termodinamica, Elettromagnetismo, Ottica</h1>\n      <h2 slot=\"top-subtitle\">Jearl Walker, David Halliday, Robert Resnick</h2>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n\nexport const OffcanvasMenu = {\n  args: {\n    enableOffcanvas: true,\n  },\n  render: (args) =>\n    html`<z-app-header\n      .enableOffcanvas=${args.enableOffcanvas}\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      .enableZLogo=${args.enableZLogo}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h1 slot=\"title\">Applicazione</h1>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n\nexport const Stuck = {\n  decorators: [\n    (Story) => html`\n      <div style=\"padding: 16px var(--grid-margin)\">Scroll to see <code>stuck</code> prop in action.</div>\n      <div style=\"height: 200vh\">${Story()}</div>\n    `,\n  ],\n  parameters: {\n    docs: {\n      story: {\n        inline: false,\n        iframeHeight: \"400px\",\n      },\n    },\n    controls: {\n      exclude: [\"enableOffcanvas\"],\n    },\n  },\n  render: (args) =>\n    html`<z-app-header\n      stuck\n      .enableZLogo=${args.enableZLogo}\n      .enableSearch=${args.enableSearch}\n      .searchPageUrl=${args.searchPageUrl}\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}; --app-header-top-offset: 0\"\n    >\n      <h1 slot=\"title\">Fondamenti di fisica 8e - Meccanica, Onde, Termodinamica, Elettromagnetismo, Ottica</h1>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n\nexport const SearchPageButton = {\n  parameters: {\n    controls: {\n      exclude: [\"searchPageUrl\", \"enableSearch\", \"enableOffcanvas\"],\n    },\n  },\n  decorators: [\n    (Story) => html`\n      <div style=\"padding: 16px var(--grid-margin)\">\n        The prop <code>searchPageUrl</code> only affects the component in tablet and mobile viewports.\n      </div>\n      ${Story()}\n    `,\n  ],\n  render: (args) =>\n    html`<z-app-header\n      enable-search\n      .enableZLogo=${args.enableZLogo}\n      search-page-url=\"https://www.zanichelli.it\"\n      style=\"--app-header-content-max-width: ${args[\"--app-header-content-max-width\"]}\"\n    >\n      <h1 slot=\"title\">Applicazione</h1>\n      <h2 slot=\"subtitle\">Payoff dell'applicazione</h2>\n      ${menuTemplate()}\n    </z-app-header>`,\n} satisfies Story;\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-aria-alert/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAM3C,MAAM,OAAO,UAAU;;oBAGE,cAAc,CAAC,MAAM;;IAE5C,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,kEACQ,IAAI,CAAC,IAAI,iBACR,MAAM,mBACJ,WAAW;YAEzB,8DAAa,CACR,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {ZAriaAlertMode} from \"../../beans\";\n\n@Component({\n  tag: \"z-aria-alert\",\n  shadow: false,\n})\nexport class ZAriaAlert {\n  /** Aria live mode */\n  @Prop()\n  mode: ZAriaAlertMode = ZAriaAlertMode.POLITE;\n\n  render(): HTMLZAriaAlertElement {\n    return (\n      <Host\n        aria-live={this.mode}\n        aria-atomic=\"true\"\n        aria-relevant=\"additions\"\n      >\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,76 +0,0 @@
-import { html } from "lit";
-import { ZAriaAlertMode } from "../../beans";
-import "../z-button/index";
-import "../z-visually-hidden/index";
-import "./index";
-const StoryMeta = {
-    title: "ZAriaAlert",
-    component: "z-aria-alert",
-    argTypes: {
-        mode: {
-            control: {
-                type: "select",
-            },
-            options: Object.values(ZAriaAlertMode),
-        },
-    },
-    args: {
-        mode: ZAriaAlertMode.POLITE,
-    },
-};
-export default StoryMeta;
-export const Default = {
-    render: (args) => html `<script>
-        function myFunction() {
-          const myTimeout = setTimeout(myDelayedFunction, 3000);
-        }
-        function myDelayedFunction() {
-          var myalert = document.getElementById("idAlert");
-          myalert.innerHTML = "Ecco un numero a caso: " + Math.random();
-        }
-      </script>
-      <div>
-        <h2 class="heading-2">ZAriaAlert deafult</h2>
-        <span>
-          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message
-        </span>
-        <z-button onclick="myFunction()">Click to say something</z-button>
-        <z-aria-alert
-          id="idAlert"
-          mode="${args.mode}"
-        >
-          Testo NON nascosto
-        </z-aria-alert>
-      </div>`,
-};
-export const VisuallyHidden = {
-    render: (args) => html `<script>
-        function myFunction2() {
-          const myTimeout = setTimeout(myDelayedFunction2, 3000);
-        }
-        function myDelayedFunction2() {
-          var myalert = document.getElementById("idAlert2");
-          myalert.innerHTML = "Ecco un numero a caso: " + Math.random();
-        }
-      </script>
-      <div>
-        <h2 class="heading-2">ZAriaAlert with VisuallyHidden</h2>
-        <span>
-          You can also wrap your <code>z-aria-alert</code> with a <code>z-visually-hidden</code> tag in order to
-          visually hide the text.
-        </span>
-        <span>
-          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message
-        </span>
-        <z-button onclick="myFunction2()">Click to say something but visually hidden</z-button>
-        <z-visually-hidden>
-          <z-aria-alert
-            id="idAlert2"
-            mode="${args.mode}"
-          >
-            Testo qua
-          </z-aria-alert>
-        </z-visually-hidden>
-      </div>`,
-};
-//# sourceMappingURL=index.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-aria-alert/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAC;AAC3C,OAAO,mBAAmB,CAAC;AAC3B,OAAO,4BAA4B,CAAC;AACpC,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,cAAc;IACzB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,cAAc,CAAC;SACvC;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,cAAc,CAAC,MAAM;KAC5B;CACyB,CAAC;AAC7B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;;;;;;;;;;;;;;;;kBAiBU,IAAI,CAAC,IAAI;;;;aAId;CACZ,CAAC;AAEF,MAAM,CAAC,MAAM,cAAc,GAAG;IAC5B,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;;;;;;;;;;;;;;;;;;;;;;oBAsBY,IAAI,CAAC,IAAI;;;;;aAKhB;CACZ,CAAC","sourcesContent":["import {Meta} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZAriaAlert} from \".\";\nimport {ZAriaAlertMode} from \"../../beans\";\nimport \"../z-button/index\";\nimport \"../z-visually-hidden/index\";\nimport \"./index\";\n\nconst StoryMeta = {\n  title: \"ZAriaAlert\",\n  component: \"z-aria-alert\",\n  argTypes: {\n    mode: {\n      control: {\n        type: \"select\",\n      },\n      options: Object.values(ZAriaAlertMode),\n    },\n  },\n  args: {\n    mode: ZAriaAlertMode.POLITE,\n  },\n} satisfies Meta<ZAriaAlert>;\nexport default StoryMeta;\n\nexport const Default = {\n  render: (args) =>\n    html`<script>\n        function myFunction() {\n          const myTimeout = setTimeout(myDelayedFunction, 3000);\n        }\n        function myDelayedFunction() {\n          var myalert = document.getElementById(\"idAlert\");\n          myalert.innerHTML = \"Ecco un numero a caso: \" + Math.random();\n        }\n      </script>\n      <div>\n        <h2 class=\"heading-2\">ZAriaAlert deafult</h2>\n        <span>\n          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message\n        </span>\n        <z-button onclick=\"myFunction()\">Click to say something</z-button>\n        <z-aria-alert\n          id=\"idAlert\"\n          mode=\"${args.mode}\"\n        >\n          Testo NON nascosto\n        </z-aria-alert>\n      </div>`,\n};\n\nexport const VisuallyHidden = {\n  render: (args) =>\n    html`<script>\n        function myFunction2() {\n          const myTimeout = setTimeout(myDelayedFunction2, 3000);\n        }\n        function myDelayedFunction2() {\n          var myalert = document.getElementById(\"idAlert2\");\n          myalert.innerHTML = \"Ecco un numero a caso: \" + Math.random();\n        }\n      </script>\n      <div>\n        <h2 class=\"heading-2\">ZAriaAlert with VisuallyHidden</h2>\n        <span>\n          You can also wrap your <code>z-aria-alert</code> with a <code>z-visually-hidden</code> tag in order to\n          visually hide the text.\n        </span>\n        <span>\n          Open your ScreenReader, Click on the button and wait 3 seconds, the screenreader will read a message\n        </span>\n        <z-button onclick=\"myFunction2()\">Click to say something but visually hidden</z-button>\n        <z-visually-hidden>\n          <z-aria-alert\n            id=\"idAlert2\"\n            mode=\"${args.mode}\"\n          >\n            Testo qua\n          </z-aria-alert>\n        </z-visually-hidden>\n      </div>`,\n};\n"]}

package/dist/collection/components/z-avatar/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-avatar/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACvD,OAAO,EAAC,UAAU,EAAC,MAAM,aAAa,CAAC;AAOvC,MAAM,OAAO,OAAO;IAqBlB;;oBAlBoB,UAAU,CAAC,MAAM;;yBAQhB,aAAa;+BAIP,SAAS;;QAOlC,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,MAAK,CAAC,IAAI,CAAA,MAAA,IAAI,CAAC,KAAK,0CAAE,MAAM,MAAK,CAAC,EAAE,CAAC;YACxD,OAAO,CAAC,IAAI,CAAC,gEAAgE,CAAC,CAAC;QACjF,CAAC;KACF;IAEO,WAAW;QACjB,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YACnC,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,MAAM,EAAE,CAAC;YAC3C,OAAO,GAAG,CAAC;QACb,CAAC;aAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,CAAC,KAAK,EAAE,CAAC;YAC1C,OAAO,GAAG,CAAC;QACb,CAAC;IACH,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,EAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,IAAI,EAAE,CAAC,QAAQ,IAAI,CAAC,WAAW,EAAE,KAAK,CAAC,EAAE,IAAI,EAAC,EACnE,KAAK,EAAE;gBACL,KAAK,EAAE,SAAS,IAAI,CAAC,SAAS,GAAG;gBACjC,eAAe,EAAE,SAAS,IAAI,CAAC,eAAe,GAAG;aAClD;YAEA,IAAI,CAAC,IAAI,IAAI,CAAC,IAAI,CAAC,KAAK,IAAI,+DAAO,IAAI,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,EAAE,CAAC,CAAC,CAAQ;YACpE,IAAI,CAAC,KAAK,IAAI,CACb,4DACE,GAAG,EAAE,IAAI,CAAC,KAAK,EACf,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,EAAE,CAAC,GAChC,CACH,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\nimport {AvatarSize} from \"../../beans\";\n\n@Component({\n  tag: \"z-avatar\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZAvatar {\n  /** [optional] Avatar size */\n  @Prop()\n  size?: AvatarSize = AvatarSize.MEDIUM;\n\n  /** [optional] Avatar text */\n  @Prop()\n  text?: string;\n\n  /** [optional] Avatar text color */\n  @Prop()\n  textColor?: string = \"color-white\";\n\n  /** [optional] Avatar background color */\n  @Prop()\n  backgroundColor?: string = \"gray700\";\n\n  /** [optional] Avatar image */\n  @Prop({mutable: true})\n  image?: string;\n\n  constructor() {\n    if (this.text?.length === 0 && this.image?.length === 0) {\n      console.warn(\"z-avatar must contain at least one prop between text and image\");\n    }\n  }\n\n  private getTextSize(): string {\n    if (this.size === AvatarSize.SMALL) {\n      return \"5\";\n    } else if (this.size === AvatarSize.MEDIUM) {\n      return \"4\";\n    } else if (this.size === AvatarSize.LARGE) {\n      return \"2\";\n    }\n  }\n\n  render(): HTMLZAvatarElement {\n    return (\n      <Host\n        class={{[this.size]: true, [`body-${this.getTextSize()}-sb`]: true}}\n        style={{\n          color: `var(--${this.textColor})`,\n          backgroundColor: `var(--${this.backgroundColor})`,\n        }}\n      >\n        {this.text && !this.image && <span>{this.text.substring(0, 2)}</span>}\n        {this.image && (\n          <img\n            src={this.image}\n            onError={() => (this.image = \"\")}\n          />\n        )}\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,51 +0,0 @@
-import { html } from "lit";
-import { AvatarSize } from "../../beans";
-import { getColorTokens } from "../../utils/storybook-utils";
-import "./index";
-const colorTokens = getColorTokens().map((token) => token.replace("--", ""));
-/**
- * Pass at least one prop between `text` and `image`.
- * If prop `image` contains a broken URL, the component will show `text` prop, if given.
- */
-const StoryMeta = {
-    title: "ZAvatar",
-    component: "z-avatar",
-    argTypes: {
-        size: {
-            options: Object.values(AvatarSize),
-            control: {
-                type: "inline-radio",
-            },
-        },
-        textColor: {
-            options: colorTokens,
-            control: {
-                type: "select",
-            },
-        },
-        backgroundColor: {
-            options: colorTokens,
-            control: {
-                type: "select",
-            },
-        },
-    },
-    args: {
-        size: AvatarSize.MEDIUM,
-        text: "Avatar",
-        textColor: "color-white",
-        backgroundColor: "gray700",
-        image: "https://www.cinematographe.it/wp-content/uploads/2019/04/Avatar.jpg",
-    },
-};
-export default StoryMeta;
-export const Default = {
-    render: (args) => html `<z-avatar
-      size="${args.size}"
-      text="${args.text}"
-      text-color="${args.textColor}"
-      background-color="${args.backgroundColor}"
-      image="${args.image}"
-    ></z-avatar>`,
-};
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-avatar/index.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-avatar/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,UAAU,EAAC,MAAM,aAAa,CAAC;AACvC,OAAO,EAAC,cAAc,EAAC,MAAM,6BAA6B,CAAC;AAC3D,OAAO,SAAS,CAAC;AAEjB,MAAM,WAAW,GAAG,cAAc,EAAE,CAAC,GAAG,CAAC,CAAC,KAAK,EAAE,EAAE,CAAC,KAAK,CAAC,OAAO,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,CAAC;AAE7E;;;GAGG;AACH,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,SAAS;IAChB,SAAS,EAAE,UAAU;IACrB,QAAQ,EAAE;QACR,IAAI,EAAE;YACJ,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,UAAU,CAAC;YAClC,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;SACF;QACD,SAAS,EAAE;YACT,OAAO,EAAE,WAAW;YACpB,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;QACD,eAAe,EAAE;YACf,OAAO,EAAE,WAAW;YACpB,OAAO,EAAE;gBACP,IAAI,EAAE,QAAQ;aACf;SACF;KACF;IACD,IAAI,EAAE;QACJ,IAAI,EAAE,UAAU,CAAC,MAAM;QACvB,IAAI,EAAE,QAAQ;QACd,SAAS,EAAE,aAAa;QACxB,eAAe,EAAE,SAAS;QAC1B,KAAK,EAAE,qEAAqE;KAC7E;CACsB,CAAC;AAE1B,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,IAAI;cACT,IAAI,CAAC,IAAI;oBACH,IAAI,CAAC,SAAS;0BACR,IAAI,CAAC,eAAe;eAC/B,IAAI,CAAC,KAAK;iBACR;CACY,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZAvatar} from \".\";\nimport {AvatarSize} from \"../../beans\";\nimport {getColorTokens} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\nconst colorTokens = getColorTokens().map((token) => token.replace(\"--\", \"\"));\n\n/**\n * Pass at least one prop between `text` and `image`.\n * If prop `image` contains a broken URL, the component will show `text` prop, if given.\n */\nconst StoryMeta = {\n  title: \"ZAvatar\",\n  component: \"z-avatar\",\n  argTypes: {\n    size: {\n      options: Object.values(AvatarSize),\n      control: {\n        type: \"inline-radio\",\n      },\n    },\n    textColor: {\n      options: colorTokens,\n      control: {\n        type: \"select\",\n      },\n    },\n    backgroundColor: {\n      options: colorTokens,\n      control: {\n        type: \"select\",\n      },\n    },\n  },\n  args: {\n    size: AvatarSize.MEDIUM,\n    text: \"Avatar\",\n    textColor: \"color-white\",\n    backgroundColor: \"gray700\",\n    image: \"https://www.cinematographe.it/wp-content/uploads/2019/04/Avatar.jpg\",\n  },\n} satisfies Meta<ZAvatar>;\n\nexport default StoryMeta;\n\nexport const Default = {\n  render: (args) =>\n    html`<z-avatar\n      size=\"${args.size}\"\n      text=\"${args.text}\"\n      text-color=\"${args.textColor}\"\n      background-color=\"${args.backgroundColor}\"\n      image=\"${args.image}\"\n    ></z-avatar>`,\n} satisfies StoryObj<ZAvatar>;\n"]}

package/dist/collection/components/z-book-cover/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-book-cover/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,QAAQ,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACjE,OAAO,oBAAoB,MAAM,+CAA+C,CAAC;AAEjF;;;;;;;;;;;GAWG;AAMH,MAAM,OAAO,UAAU;;;;wBAWV,KAAK;wBAIL,KAAK;;IAEhB,MAAM;;QACJ,OAAO,CACL,EAAC,IAAI;YACF,IAAI,CAAC,QAAQ,IAAI,CAChB,EAAC,QAAQ;gBACP,4DAAK,KAAK,EAAC,mCAAmC,GAAO;gBACrD,4DAAK,KAAK,EAAC,mCAAmC,GAAO,CAC5C,CACZ;YACD,4DAAK,KAAK,EAAC,iBAAiB;gBAC1B,4DACE,GAAG,EAAE,MAAA,IAAI,CAAC,KAAK,mCAAI,oBAAoB,iBAC3B,MAAM,EAClB,GAAG,EAAC,EAAE,EACN,OAAO,EAAE,GAAG,EAAE,CAAC,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,aAAa,IAAI,oBAAoB,CAAC,GACxE;gBACF,6DAAM,IAAI,EAAC,cAAc,GAAQ,CAC7B,CACD,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Fragment, Host, Prop, h} from \"@stencil/core\";\nimport defaultFallbackCover from \"../../assets/images/png/placeholder-cover.png\";\n\n/**\n * This component displays a book cover image,\n * with options for borders and a representation of multiple books with a stack of fake covers behind the original one.\n * The aspect ratio of the cover image is preserved.\n * Alignment of the image inside the container can be customized via CSS properties.\n *\n * @slot coverOverlay - Content to be displayed over the cover image (e.g. a label). The overlay is positioned at the bottom of the cover. Has some default styling (such as the colored background) that can be customized via CSS.\n * @cssprop --z-book-cover-height - height of the book cover (default: `378px`). The width is calculated automatically to maintain an aspect ratio of 1.33.\n * @cssprop --z-book-cover-border-radius - border radius of the book cover (default: `var(--border-radius)`)\n * @cssprop --z-book-cover-stack-shift-x - the horizontal shift of each stacked cover when `multiple` is `true` (default: `8px`)\n * @cssprop --z-book-cover-stack-shift-y - the vertical shift of each stacked cover when `multiple` is `true` (default: `12px`)\n */\n@Component({\n  tag: \"z-book-cover\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZBookCover {\n  /** URL of the cover image. */\n  @Prop()\n  cover: string;\n\n  /** URL of the fallback cover image. */\n  @Prop()\n  fallbackCover: string;\n\n  /** Whether to show a stack of covers to represent multiple books. */\n  @Prop({reflect: true})\n  multiple = false;\n\n  /** Whether to apply a border around the cover image (always applied when `multiple` is enabled). */\n  @Prop({reflect: true})\n  bordered = false;\n\n  render(): HTMLZBookCoverElement {\n    return (\n      <Host>\n        {this.multiple && (\n          <Fragment>\n            <div class=\"shifted-stack-cover stack-cover-2\"></div>\n            <div class=\"shifted-stack-cover stack-cover-1\"></div>\n          </Fragment>\n        )}\n        <div class=\"cover-container\">\n          <img\n            src={this.cover ?? defaultFallbackCover}\n            aria-hidden=\"true\"\n            alt=\"\"\n            onError={() => (this.cover = this.fallbackCover || defaultFallbackCover)}\n          />\n          <slot name=\"coverOverlay\"></slot>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/z-book-cover/index.stories.js

@@ -1,31 +0,0 @@
-import { html } from "lit";
-import { styleMap } from "lit/directives/style-map.js";
-import "./index";
-const StoryMeta = {
-    title: "ZBookCover",
-    component: "z-book-cover",
-    args: {
-        "cover": "https://staticmy.zanichelli.it/copertine/dashboard/m40002.9788808999825.jpg",
-        "bordered": false,
-        "multiple": false,
-        "--z-book-cover-height": "378px",
-        "--z-book-cover-border-radius": "var(--border-radius)",
-        "--z-book-cover-stack-shift-x": "8px",
-        "--z-book-cover-stack-shift-y": "12px",
-    },
-};
-export default StoryMeta;
-export const Default = {
-    render: (args) => html `<z-book-cover
-      cover=${args.cover}
-      .bordered=${args.bordered}
-      .multiple=${args.multiple}
-      style=${styleMap({
-        "--z-book-cover-height": args["--z-book-cover-height"],
-        "--z-book-cover-border-radius": args["--z-book-cover-border-radius"],
-        "--z-book-cover-stack-shift-x": args["--z-book-cover-stack-shift-x"],
-        "--z-book-cover-stack-shift-y": args["--z-book-cover-stack-shift-y"],
-    })}
-    ></z-book-cover>`,
-};
-//# sourceMappingURL=index.stories.js.map

package/dist/collection/components/z-book-cover/index.stories.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-book-cover/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AACzB,OAAO,EAAC,QAAQ,EAAC,MAAM,6BAA6B,CAAC;AAGrD,OAAO,SAAS,CAAC;AAUjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,YAAY;IACnB,SAAS,EAAE,cAAc;IACzB,IAAI,EAAE;QACJ,OAAO,EAAE,6EAA6E;QACtF,UAAU,EAAE,KAAK;QACjB,UAAU,EAAE,KAAK;QACjB,uBAAuB,EAAE,OAAO;QAChC,8BAA8B,EAAE,sBAAsB;QACtD,8BAA8B,EAAE,KAAK;QACrC,8BAA8B,EAAE,MAAM;KACvC;CACoC,CAAC;AAExC,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;cACM,IAAI,CAAC,KAAK;kBACN,IAAI,CAAC,QAAQ;kBACb,IAAI,CAAC,QAAQ;cACjB,QAAQ,CAAC;QACf,uBAAuB,EAAE,IAAI,CAAC,uBAAuB,CAAC;QACtD,8BAA8B,EAAE,IAAI,CAAC,8BAA8B,CAAC;QACpE,8BAA8B,EAAE,IAAI,CAAC,8BAA8B,CAAC;QACpE,8BAA8B,EAAE,IAAI,CAAC,8BAA8B,CAAC;KACrE,CAAC;qBACa;CACJ,CAAC","sourcesContent":["import type {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {styleMap} from \"lit/directives/style-map.js\";\nimport {type ZBookCover} from \".\";\nimport {CSSVarsArguments} from \"../../utils/storybook-utils\";\nimport \"./index\";\n\ntype ZBookCoverStoriesArgs = ZBookCover &\n  CSSVarsArguments<\n    | \"--z-book-cover-height\"\n    | \"--z-book-cover-border-radius\"\n    | \"--z-book-cover-stack-shift-x\"\n    | \"--z-book-cover-stack-shift-y\"\n  >;\n\nconst StoryMeta = {\n  title: \"ZBookCover\",\n  component: \"z-book-cover\",\n  args: {\n    \"cover\": \"https://staticmy.zanichelli.it/copertine/dashboard/m40002.9788808999825.jpg\",\n    \"bordered\": false,\n    \"multiple\": false,\n    \"--z-book-cover-height\": \"378px\",\n    \"--z-book-cover-border-radius\": \"var(--border-radius)\",\n    \"--z-book-cover-stack-shift-x\": \"8px\",\n    \"--z-book-cover-stack-shift-y\": \"12px\",\n  },\n} satisfies Meta<ZBookCoverStoriesArgs>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZBookCoverStoriesArgs>;\n\nexport const Default = {\n  render: (args) =>\n    html`<z-book-cover\n      cover=${args.cover}\n      .bordered=${args.bordered}\n      .multiple=${args.multiple}\n      style=${styleMap({\n        \"--z-book-cover-height\": args[\"--z-book-cover-height\"],\n        \"--z-book-cover-border-radius\": args[\"--z-book-cover-border-radius\"],\n        \"--z-book-cover-stack-shift-x\": args[\"--z-book-cover-stack-shift-x\"],\n        \"--z-book-cover-stack-shift-y\": args[\"--z-book-cover-stack-shift-y\"],\n      })}\n    ></z-book-cover>`,\n} satisfies Story;\n"]}

package/dist/collection/components/z-breadcrumb/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-breadcrumb/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Listen, Prop, State, Watch, h} from \"@stencil/core\";\nimport {\n  BreadcrumbHomepageVariant,\n  BreadcrumbPath,\n  BreadcrumbPathStyle,\n  Device,\n  KeyboardCode,\n  ListSize,\n  PopoverPosition,\n} from \"../../beans\";\nimport {getDevice, handleKeyboardSubmit} from \"../../utils/utils\";\n\n@Component({\n  tag: \"z-breadcrumb\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZBreadcrumb {\n  /* Accessibility references */\n  /* Overflow-menu: https://www.w3.org/WAI/ARIA/apg/patterns/menu-button/ */\n  /* Breadcrumb: https://www.w3.org/WAI/ARIA/apg/patterns/breadcrumb/ */\n  /* Focus on multiline link: https://www.w3.org/WAI/WCAG22/Understanding/focus-appearance.html */\n\n  @Element() hostElement: HTMLZBreadcrumbElement;\n\n  /** [optional] Sets the path style */\n  @Prop({reflect: true})\n  pathStyle?: BreadcrumbPathStyle = BreadcrumbPathStyle.UNDERLINED;\n\n  /** [optional] Variant of first node */\n  @Prop()\n  homepageVariant?: BreadcrumbHomepageVariant = BreadcrumbHomepageVariant.ICON;\n\n  /** [optional] Sets max number of element to show */\n  @Prop()\n  maxNodesToShow? = 5;\n\n  /** [optional] Controls the behaviour on <a> tag click/enter */\n  @Prop()\n  preventFollowUrl? = false;\n\n  /** [optional] Sets max number of row for each path inside the popover. Zero equals unlimited */\n  @Prop()\n  overflowMenuItemRows? = 0;\n\n  /** [optional] Sets the maximun number of chars per single node */\n  @Prop()\n  truncateChar? = 30;\n\n  /** Handle mobile */\n  @State()\n  viewPortWidth: Device;\n\n  /** Detect whether the length of the nodes shown exceeds the container length */\n  @State()\n  hasOverflow = false;\n\n  @State()\n  popoverEllipsisOpen = false;\n\n  /** Emitted when preventFollowUrl=true to handle custom page transition */\n  @Event()\n  clickOnNode: EventEmitter<BreadcrumbPath[\"path\"]>;\n\n  private pathsList: BreadcrumbPath[];\n\n  private pathListCopy: BreadcrumbPath[];\n\n  private collapsedElements: BreadcrumbPath[] = [];\n\n  private collapsedElementsRef: HTMLZPopoverElement;\n\n  private triggerButton: HTMLButtonElement;\n\n  private wrapElement: HTMLElement;\n\n  private currentIndex = 0;\n\n  private homepageNode: BreadcrumbPath;\n\n  private anchorElements;\n\n  private currentEllipsisText: string;\n\n  private truncatePosition = null;\n\n  @Listen(\"resize\", {target: \"window\"})\n  handleResize(): void {\n    this.viewPortWidth = getDevice();\n    if (\n      this.viewPortWidth !== Device.MOBILE &&\n      this.wrapElement &&\n      this.wrapElement.scrollWidth > this.wrapElement.clientWidth\n    ) {\n      this.hasOverflow = true;\n    }\n  }\n  // eslint-disable-next-line lines-between-class-members\n  @Watch(\"maxNodesToShow\")\n  handlePropChange(): void {\n    this.initializeBreadcrumb();\n  }\n\n  @Watch(\"viewPortWidth\")\n  handleResizeUp(newValue: Device, oldValue: Device): void {\n    if (\n      newValue === Device.MOBILE ||\n      (oldValue === Device.MOBILE && newValue === Device.TABLET) ||\n      (oldValue === Device.MOBILE && newValue === Device.DESKTOP) ||\n      (oldValue === Device.MOBILE && newValue === Device.DESKTOP_WIDE) ||\n      (oldValue === Device.TABLET && newValue === Device.DESKTOP) ||\n      (oldValue === Device.TABLET && newValue === Device.DESKTOP_WIDE) ||\n      (oldValue === Device.DESKTOP && newValue === Device.DESKTOP_WIDE)\n    ) {\n      this.initializeBreadcrumb();\n    }\n  }\n\n  componentWillLoad(): void {\n    this.viewPortWidth = getDevice();\n    this.initializeBreadcrumb();\n  }\n\n  componentWillRender(): void {\n    if (this.viewPortWidth !== Device.MOBILE && this.hasOverflow) {\n      this.checkEllipsisOrOverflowMenu();\n      this.hasOverflow = false;\n    }\n  }\n\n  componentDidRender(): void {\n    if (this.collapsedElementsRef) {\n      this.anchorElements = Array.from(this.hostElement.shadowRoot.querySelectorAll(\"z-list-group a\"));\n    }\n\n    if (this.viewPortWidth !== Device.MOBILE) {\n      requestAnimationFrame(() => {\n        if (this.wrapElement.scrollWidth > this.wrapElement.clientWidth) {\n          if (!this.hasOverflow) {\n            this.hasOverflow = true;\n          }\n        }\n      });\n    }\n  }\n\n  private initializeBreadcrumb(): void {\n    if (this.viewPortWidth === Device.MOBILE) {\n      this.pathsList = this.getPathsItemsList().filter((item) => !!item.path);\n    } else {\n      this.pathsList = this.getPathsItemsList();\n    }\n    this.homepageNode = this.pathsList.shift();\n    this.pathListCopy = [...this.pathsList];\n    this.collapsedElements = [];\n    if (this.pathsList.length > this.maxNodesToShow) {\n      this.collapsedElements = this.pathsList.splice(0, this.pathsList.length - 2);\n    }\n  }\n\n  private checkEllipsisOrOverflowMenu(): void {\n    for (let i = 0; i < this.pathsList.length; i++) {\n      if (this.pathsList[i].text.length <= this.truncateChar) {\n        continue;\n      }\n\n      if (this.truncatePosition > 0) {\n        this.collapsedElements.push(...this.pathListCopy.splice(0, this.truncatePosition));\n        this.pathsList.splice(0, this.truncatePosition);\n        this.truncatePosition = 0;\n\n        return;\n      } else if (this.truncatePosition === 0) {\n        this.collapsedElements.push(...this.pathListCopy.splice(0, this.truncatePosition + 1));\n        this.pathsList.splice(0, this.truncatePosition + 1);\n        this.truncatePosition = null;\n\n        return;\n      }\n\n      if (i !== this.pathsList.length - 1) {\n        const truncatedString = this.truncateWithEllipsis(this.pathsList[i].text, this.truncateChar);\n        this.currentEllipsisText = this.pathsList[i].text;\n        this.pathsList[i].text = truncatedString;\n        this.pathsList[i].hasTooltip = true;\n        this.truncatePosition = i;\n\n        return;\n      }\n    }\n  }\n\n  private truncateWithEllipsis(str: string, maxLength: number): string {\n    if (str.length <= maxLength) {\n      return str;\n    }\n\n    return str.substring(0, maxLength - 1) + \"&mldr;\";\n  }\n\n  private getPathsItemsList(): BreadcrumbPath[] {\n    return Array.from(this.hostElement.children).map((item: HTMLAnchorElement) => {\n      return {\n        text: item.textContent,\n        path: item.href,\n        hasTooltip: false,\n      };\n    });\n  }\n\n  private renderHomepageNode(): HTMLLIElement {\n    return (\n      <li>\n        <a\n          class={{\n            \"homepage-text\": this.homepageVariant === BreadcrumbHomepageVariant.TEXT,\n          }}\n          href={this.homepageNode.path}\n          onClick={(e) => this.handlePreventFollowUrl(e, this.homepageNode)}\n          innerHTML={\n            this.homepageVariant === BreadcrumbHomepageVariant.ICON\n              ? `<z-icon name=\"home\" />`\n              : this.homepageNode.text || \"Home\"\n          }\n        />\n        {this.pathsList.length > 0 && (\n          <z-icon\n            class=\"separator\"\n            name=\"chevron-right\"\n          />\n        )}\n      </li>\n    );\n  }\n\n  private togglePopover(): void {\n    if (!this.collapsedElementsRef.open) {\n      this.collapsedElementsRef.open = true;\n    }\n  }\n\n  private handlePreventFollowUrl(e: MouseEvent, item): void {\n    if (this.preventFollowUrl) {\n      e.preventDefault();\n      this.clickOnNode.emit(item.path);\n    }\n  }\n\n  private handleOverflowMenuAccessibility(e: KeyboardEvent): void {\n    const anchorElementsLenght = this.anchorElements.length;\n    if (e.key === KeyboardCode.TAB) {\n      e.preventDefault();\n\n      return;\n    }\n    e.stopPropagation();\n    const arrows = [KeyboardCode.ARROW_DOWN, KeyboardCode.ARROW_UP];\n    if (arrows.includes(e.key as KeyboardCode)) {\n      e.preventDefault();\n\n      if (e.key === KeyboardCode.ARROW_DOWN) {\n        this.currentIndex = anchorElementsLenght === this.currentIndex + 1 ? 0 : this.currentIndex + 1;\n      }\n      if (e.key === KeyboardCode.ARROW_UP) {\n        this.currentIndex = this.currentIndex <= 0 ? anchorElementsLenght - 1 : this.currentIndex - 1;\n      }\n\n      this.anchorElements[this.currentIndex].focus();\n    }\n\n    if (e.key === KeyboardCode.ESC) {\n      this.triggerButton.focus();\n    }\n  }\n\n  private renderOverflowMenu(): HTMLLIElement {\n    return (\n      <li>\n        <z-popover\n          class=\"hidden-paths-popover\"\n          ref={(val) => (this.collapsedElementsRef = val as HTMLZPopoverElement)}\n          bindTo={this.triggerButton}\n          position={PopoverPosition.BOTTOM_RIGHT}\n          closable\n          showArrow\n        >\n          <div class=\"popover-content\">\n            <z-list>\n              <z-list-group size={ListSize.SMALL}>\n                {this.collapsedElements.map((item, index, array) => {\n                  return (\n                    <div>\n                      <z-list-element clickable>\n                        <a\n                          class=\"text-ellipsis\"\n                          href={item.path}\n                          onClick={(e) => this.handlePreventFollowUrl(e, item)}\n                          onKeyDown={(e) => this.handleOverflowMenuAccessibility(e)}\n                          innerHTML={item.text}\n                        />\n                      </z-list-element>\n                      {index < array.length - 1 && <z-divider color=\"color-surface03\"></z-divider>}\n                    </div>\n                  );\n                })}\n              </z-list-group>\n            </z-list>\n          </div>\n        </z-popover>\n        <button\n          class=\"dots\"\n          ref={(el) => (this.triggerButton = el)}\n          aria-label=\"Mostra più breadcrumb\"\n          aria-haspopup=\"true\"\n          onClick={() => {\n            this.togglePopover();\n          }}\n          onKeyDown={(e) => {\n            handleKeyboardSubmit(e, this.togglePopover.bind(this));\n            setTimeout(() => {\n              this.anchorElements[0].focus();\n            }, 100);\n          }}\n          innerHTML=\"&mldr;\"\n        ></button>\n        {this.pathsList.length > 0 && (\n          <z-icon\n            class=\"separator\"\n            name=\"chevron-right\"\n          />\n        )}\n      </li>\n    );\n  }\n\n  private renderMobileItems(): HTMLLIElement {\n    // show only the second to last element\n    const secondToLastPath = this.pathsList[this.pathsList.length - 1];\n\n    if (!secondToLastPath) {\n      return;\n    }\n\n    return (\n      <li>\n        <a\n          aria-current={secondToLastPath.path ? undefined : \"page\"}\n          href={secondToLastPath.path}\n          onClick={(e) => this.handlePreventFollowUrl(e, secondToLastPath)}\n        >\n          <z-icon name=\"chevron-left\" />\n          <span\n            class={{\n              \"missing-path\": !secondToLastPath.path,\n              \"text-ellipsis\": true,\n            }}\n          >\n            {secondToLastPath.text}\n          </span>\n        </a>\n      </li>\n    );\n  }\n\n  private renderItems(): HTMLElement[] {\n    let trigger;\n\n    return [\n      this.renderHomepageNode(),\n      this.collapsedElements.length > 0 && this.renderOverflowMenu(),\n      ...this.pathsList.map((item, index) => (\n        <li>\n          {item.hasTooltip && (\n            <z-popover\n              class=\"full-path-tooltip\"\n              bindTo={trigger}\n              open={this.popoverEllipsisOpen}\n              position={PopoverPosition.BOTTOM_RIGHT}\n              closable={false}\n              showArrow\n            >\n              <span class=\"tooltip-content\">{this.currentEllipsisText}</span>\n            </z-popover>\n          )}\n          <a\n            class={{\"missing-path\": !item.path}}\n            ref={(val) => (trigger = val)}\n            aria-current={item.path ? undefined : \"page\"}\n            href={item.path}\n            onClick={(e) => this.handlePreventFollowUrl(e, item)}\n            onMouseOver={() => {\n              if (item.hasTooltip) {\n                this.popoverEllipsisOpen = true;\n              }\n            }}\n            onMouseLeave={() => {\n              if (item.hasTooltip) {\n                this.popoverEllipsisOpen = false;\n              }\n            }}\n            innerHTML={item.text}\n          />\n          {index !== this.pathsList.length - 1 && (\n            <z-icon\n              class=\"separator\"\n              name=\"chevron-right\"\n            />\n          )}\n        </li>\n      )),\n    ];\n  }\n\n  render(): HTMLZBreadcrumbElement {\n    return (\n      <Host style={{\"--line-clamp-popover\": `${this.overflowMenuItemRows}`}}>\n        <nav\n          ref={(val) => (this.wrapElement = val)}\n          aria-label=\"Breadcrumb\"\n          class={{\n            semibold: this.pathStyle === BreadcrumbPathStyle.SEMIBOLD,\n            underlined: this.pathStyle === BreadcrumbPathStyle.UNDERLINED,\n          }}\n        >\n          <ol>{this.viewPortWidth === Device.MOBILE ? this.renderMobileItems() : this.renderItems()}</ol>\n        </nav>\n      </Host>\n    );\n  }\n}\n"]}