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

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

@@ -1,404 +0,0 @@
-:host {
-  display: inline-block;
-  width: inherit;
-}
-
-:host * {
-  box-sizing: border-box;
-}
-
-input::-ms-clear,
-input::-ms-reveal {
-  display: none;
-}
-
-/* GENERAL */
-:host input::-ms-clear,
-:host input::-ms-reveal {
-  display: none;
-}
-
-input,
-textarea {
-  background: var(--color-form-background);
-  fill: var(--color-form-default-icon);
-  font-family: var(--font-family-sans);
-  font-size: var(--font-size-3);
-  font-weight: var(--font-rg);
-  outline: none;
-}
-
-input,
-.textarea-wrapper {
-  border: var(--border-size-small) solid var(--color-form-surface04);
-  border-radius: var(--border-radius-small);
-  color: var(--color-form-default-text);
-}
-
-:host([size="small"]) input,
-:host([size="small"]) textarea,
-:host([size="x-small"]) input,
-:host([size="x-small"]) textarea {
-  font-size: var(--font-size-2);
-}
-
-:host.cursor-select input {
-  cursor: pointer;
-}
-
-/* HOVER */
-input:not([readonly]):hover,
-.textarea-wrapper:not(.readonly):hover {
-  outline: var(--border-size-medium) solid var(--color-surface04);
-  outline-offset: -2px;
-}
-
-/* FOCUS */
-:host:not(.active-select) input:focus:focus-visible,
-:host:not([readonly="true"]) .textarea-wrapper:focus-within {
-  border-color: var(--color-form-active-primary);
-  box-shadow: var(--shadow-focus-primary);
-  color: var(--color-form-active-primary);
-}
-
-:host input:focus:focus-visible:hover,
-.textarea-wrapper:not(.readonly):focus-within:hover {
-  outline-color: var(--color-form-active-primary);
-}
-
-:host input:focus:focus-visible + .icons-wrapper {
-  fill: var(--color-form-active-primary);
-}
-
-:host.active-select input {
-  border: var(--border-size-small) solid var(--color-form-active-primary);
-}
-
-:host.cursor-select input:focus:focus-visible {
-  box-shadow: var(--shadow-focus-primary);
-}
-
-:host input[readonly]:focus:focus-visible {
-  border-color: var(--color-form-surface03);
-  box-shadow: none;
-}
-
-/* STATUSES (success, warning, error) */
-.input-success {
-  border-color: var(--color-form-success01);
-  background: var(--color-form-inverse-success);
-}
-
-.input-success:focus:focus-visible + .icons-wrapper,
-.input-success + .icons-wrapper {
-  fill: var(--color-form-success01);
-}
-
-.input-error {
-  border-color: var(--color-form-hover-error);
-  background: var(--color-form-inverse-error);
-}
-
-.input-error:focus:focus-visible + .icons-wrapper,
-.input-error + .icons-wrapper {
-  fill: var(--color-form-hover-error);
-}
-
-.input-warning {
-  border-color: var(--color-form-hover-warning);
-  background: var(--color-form-inverse-warning);
-}
-
-.input-warning:focus:focus-visible + .icons-wrapper,
-.input-warning + .icons-wrapper {
-  fill: var(--color-form-hover-warning);
-}
-
-:is(.input-success, .input-error, .input-warning):focus:focus-visible {
-  color: var(--color-form-default-text);
-}
-
-/* READONLY */
-:host:not(.active-select) input[readonly],
-.textarea-wrapper.readonly {
-  border-color: var(--color-form-surface03);
-  fill: var(--color-form-disabled01-icon);
-  pointer-events: none;
-}
-
-/* DISABLED */
-:host([disabled]:not([disabled="false"])) input,
-:host([disabled]:not([disabled="false"])) .textarea-wrapper,
-:host([disabled]:not([disabled="false"])) z-icon {
-  border-color: var(--color-form-disabled03);
-  box-shadow: none;
-  color: var(--color-form-disabled-text);
-  fill: var(--color-form-disabled01-icon);
-  pointer-events: none;
-}
-
-:host([disabled]:not([disabled="false"])) input:hover {
-  border-width: var(--border-size-small);
-}
-
-/* PLACEHOLDER */
-input::placeholder,
-textarea::placeholder {
-  color: var(--color-form-placeholder-text);
-}
-
-::-webkit-textarea-placeholder {
-  color: var(--color-form-placeholder-text);
-}
-
-:-ms-textarea-placeholder {
-  color: var(--color-form-placeholder-text);
-}
-
-::placeholder {
-  color: var(--color-form-placeholder-text);
-}
-
-:host([disabled]:not([disabled="false"])) label.z-label {
-  color: var(--color-disabled03);
-}
-
-.text-wrapper > div {
-  position: relative;
-  z-index: 1;
-  fill: var(--color-form-default-icon);
-}
-
-.text-wrapper > div > input {
-  width: 100%;
-  height: calc(var(--space-unit) * 5.5);
-  box-sizing: border-box;
-  padding: 0 calc(var(--space-unit) * 1.5);
-  margin: 0;
-}
-
-:host([size="small"]) .text-wrapper > div > input {
-  height: calc(var(--space-unit) * 4.5);
-}
-
-:host([size="x-small"]) .text-wrapper > div > input {
-  height: calc(var(--space-unit) * 4);
-}
-
-.text-wrapper > div > input.has-icon,
-.text-wrapper > div > input.has-clear-icon {
-  padding-right: calc(var(--space-unit) * 5.25);
-}
-
-.text-wrapper > div > input.has-icon.has-clear-icon {
-  padding-right: calc(var(--space-unit) * 8);
-}
-
-.text-wrapper .icons-wrapper {
-  position: absolute;
-  z-index: 2;
-  top: 50%;
-  right: calc(var(--space-unit) * 1.5);
-  display: flex;
-  pointer-events: none;
-  transform: translateY(-50%);
-}
-
-.text-wrapper .icons-wrapper > button.input-icon {
-  display: flex;
-  padding: 0;
-  border: 0;
-  background: none;
-  color: inherit;
-  font: inherit;
-  pointer-events: initial;
-}
-
-.text-wrapper .icons-wrapper > .input-icon + .input-icon {
-  margin-left: calc(var(--space-unit) * 0.5);
-}
-
-.text-wrapper .icons-wrapper > button.input-icon.hidden {
-  display: none;
-}
-
-.text-wrapper .icons-wrapper > button.reset-icon,
-.text-wrapper .icons-wrapper > button.toggle-password-icon {
-  cursor: pointer;
-}
-
-.text-wrapper .icons-wrapper > .input-icon {
-  --z-icon-width: 18px;
-  --z-icon-height: 18px;
-
-  display: block;
-}
-
-.text-wrapper .icons-wrapper > .input-icon.small,
-.text-wrapper .icons-wrapper > .input-icon.x-small {
-  --z-icon-width: 16px;
-  --z-icon-height: 16px;
-}
-
-.text-wrapper .icons-wrapper > button.input-icon:focus {
-  box-shadow: var(--shadow-focus-primary);
-  outline: none !important;
-}
-
-/* stylelint-disable property-no-vendor-prefix */
-.text-wrapper > div > input:-webkit-autofill {
-  -webkit-box-shadow: 0 0 0 1000px #fff inset;
-  -webkit-text-fill-color: currentcolor;
-}
-
-.textarea-wrapper {
-  width: 100%;
-  height: 100%;
-  padding: calc(var(--space-unit) * 1.5);
-}
-
-.textarea-wrapper:not(.input-error, .input-success, .input-warning) {
-  background-color: var(--color-form-background);
-}
-
-textarea {
-  width: 100%;
-  min-height: 132px;
-  padding: 0;
-  border: none;
-  margin: 0;
-  color: currentcolor;
-  resize: none;
-}
-
-.radio-wrapper,
-.checkbox-wrapper {
-  position: relative;
-  display: inline-flex;
-  flex-direction: row;
-  align-items: center;
-  color: var(--color-default-text);
-  fill: var(--color-primary01);
-  font-family: var(--font-family-sans);
-}
-
-.radio-wrapper:hover,
-.checkbox-wrapper:hover {
-  color: var(--color-hover-primary);
-  fill: var(--color-hover-primary-icon);
-}
-
-.radio-wrapper > input,
-.checkbox-wrapper > input {
-  position: absolute;
-  z-index: -1;
-  opacity: 0;
-  pointer-events: none;
-}
-
-.radio-wrapper .radio-label,
-.checkbox-wrapper .checkbox-label {
-  display: inline-flex;
-  align-items: center;
-  margin: 0;
-  color: inherit;
-  font-family: inherit;
-  font-size: inherit;
-  font-weight: inherit;
-  line-height: 1;
-  text-transform: inherit;
-}
-
-.radio-wrapper input:not(:disabled) + .radio-label,
-.checkbox-wrapper input:not(:disabled) + .checkbox-label {
-  cursor: pointer;
-}
-
-.radio-wrapper .radio-label z-icon,
-.checkbox-wrapper .checkbox-label z-icon {
-  cursor: pointer;
-  fill: inherit;
-}
-
-:host([size="small"]) .radio-wrapper .radio-label z-icon,
-:host([size="small"]) .checkbox-wrapper .checkbox-label z-icon {
-  --z-icon-width: 16px;
-  --z-icon-height: 16px;
-}
-
-:host([size="small"]) .radio-wrapper .radio-label,
-:host([size="small"]) .checkbox-wrapper .checkbox-label {
-  font-size: var(--font-size-2);
-}
-
-:host([size="x-small"]) .radio-wrapper .radio-label z-icon,
-:host([size="x-small"]) .checkbox-wrapper .checkbox-label z-icon {
-  --z-icon-width: 14px;
-  --z-icon-height: 14px;
-}
-
-:host([size="x-small"]) .radio-wrapper .radio-label,
-:host([size="x-small"]) .checkbox-wrapper .checkbox-label {
-  font-size: var(--font-size-1);
-}
-
-.radio-wrapper .radio-label.after,
-.checkbox-wrapper .checkbox-label.after {
-  flex-direction: row;
-}
-
-.radio-wrapper .radio-label.before,
-.checkbox-wrapper .checkbox-label.before {
-  flex-direction: row-reverse;
-}
-
-.radio-wrapper .radio-label.after > span,
-.checkbox-wrapper .checkbox-label.after > span {
-  margin-left: var(--space-unit);
-}
-
-.radio-wrapper .radio-label.before > span,
-.checkbox-wrapper .checkbox-label.before > span {
-  margin-right: var(--space-unit);
-}
-
-:host([size="small"]) .radio-wrapper .radio-label.after > span,
-:host([size="small"]) .checkbox-wrapper .checkbox-label.after > span,
-:host([size="x-small"]) .radio-wrapper .radio-label.after > span,
-:host([size="x-small"]) .checkbox-wrapper .checkbox-label.after > span {
-  margin-left: calc(var(--space-unit) * 0.5);
-}
-
-:host([size="small"]) .radio-wrapper .radio-label.before > span,
-:host([size="small"]) .checkbox-wrapper .checkbox-label.before > span,
-:host([size="x-small"]) .radio-wrapper .radio-label.before > span,
-:host([size="x-small"]) .checkbox-wrapper .checkbox-label.before > span {
-  margin-right: calc(var(--space-unit) * 0.5);
-}
-
-/* focus */
-.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon {
-  border-radius: 50%;
-}
-
-.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {
-  border-radius: var(--border-radius-small);
-}
-
-.radio-wrapper > input:focus:focus-visible + .radio-label > z-icon,
-.checkbox-wrapper > input:focus:focus-visible + .checkbox-label > z-icon {
-  box-shadow: var(--shadow-focus-primary);
-}
-
-/* disabled */
-.radio-wrapper > input:disabled + .radio-label,
-.checkbox-wrapper > input:disabled + .checkbox-label {
-  color: var(--color-disabled03);
-}
-
-.radio-wrapper > input:disabled + .radio-label > z-icon,
-.checkbox-wrapper > input:disabled + .checkbox-label > z-icon {
-  cursor: default;
-  fill: var(--color-disabled01);
-}
-

package/dist/collection/components/z-input-message/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-input-message/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AACrE,OAAO,EAAC,WAAW,EAAC,MAAM,aAAa,CAAC;AAOxC,MAAM,OAAO,aAAa;;QAahB,gBAAW,GAAG;YACpB,OAAO,EAAE,kBAAkB;YAC3B,KAAK,EAAE,kBAAkB;YACzB,OAAO,EAAE,oBAAoB;SAC9B,CAAC;;;;0BAGW,EAAE;;IAIf,eAAe;QACb,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAC,IAAI,EAAE,OAAO,EAAC,CAAC,CAAC,CAAC,EAAE,CAAC;IACvE,CAAC;IAED,iBAAiB;QACf,IAAI,CAAC,eAAe,EAAE,CAAC;IACzB,CAAC;IAED,MAAM;QACJ,OAAO,CACL,EAAC,IAAI,qEAAK,IAAI,CAAC,UAAU;YACtB,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,IAAI,CAAC,OAAO,IAAI,+DAAQ,IAAI,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,MAAM,CAAC,GAAW;YACxG,6DAAM,SAAS,EAAE,IAAI,CAAC,OAAO,GAAI,CAC5B,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, State, Watch, h} from \"@stencil/core\";\nimport {InputStatus} from \"../../beans\";\n\n@Component({\n  tag: \"z-input-message\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZInputMessage {\n  /** input helper message */\n  @Prop()\n  message: string;\n\n  /** input status (optional) */\n  @Prop({reflect: true})\n  status?: InputStatus;\n\n  /** input disabled status (optional) */\n  @Prop({reflect: true})\n  disabled?: boolean;\n\n  private statusIcons = {\n    success: \"checkmark-circle\",\n    error: \"multiply-circled\",\n    warning: \"exclamation-circle\",\n  };\n\n  @State()\n  statusRole = {};\n\n  @Watch(\"message\")\n  @Watch(\"status\")\n  onMessageChange(): void {\n    this.statusRole = this.message && this.status ? {role: \"alert\"} : {};\n  }\n\n  componentWillLoad(): void {\n    this.onMessageChange();\n  }\n\n  render(): HTMLZInputMessageElement {\n    return (\n      <Host {...this.statusRole}>\n        {this.statusIcons[this.status] && this.message && <z-icon name={this.statusIcons[this.status]}></z-icon>}\n        <span innerHTML={this.message} />\n      </Host>\n    );\n  }\n}\n"]}

package/dist/collection/components/z-input-message/index.stories.js

@@ -1,37 +0,0 @@
-import { html } from "lit";
-import { ControlSize, InputStatus } from "../../beans";
-import "./index";
-const StoryMeta = {
-    title: "ZInputMessage",
-    component: "z-input-message",
-    argTypes: {
-        status: {
-            control: {
-                type: "inline-radio",
-            },
-            options: ["default", ...Object.values(InputStatus)],
-        },
-        class: {
-            control: {
-                type: "inline-radio",
-            },
-            options: Object.values(ControlSize),
-        },
-    },
-    args: {
-        message: "messaggio",
-        status: InputStatus.ERROR,
-        class: ControlSize.BIG,
-    },
-};
-export default StoryMeta;
-export const Default = {
-    render: (args) => html `
-    <z-input-message
-      message=${args.message}
-      status=${args.status}
-      class=${args.class}
-    ></z-input-message>
-  `,
-};
-//# sourceMappingURL=index.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-input-message/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,EAAC,WAAW,EAAE,WAAW,EAAC,MAAM,aAAa,CAAC;AACrD,OAAO,SAAS,CAAC;AAIjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,eAAe;IACtB,SAAS,EAAE,iBAAiB;IAC5B,QAAQ,EAAE;QACR,MAAM,EAAE;YACN,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;YACD,OAAO,EAAE,CAAC,SAAS,EAAE,GAAG,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC,CAAC;SACpD;QACD,KAAK,EAAE;YACL,OAAO,EAAE;gBACP,IAAI,EAAE,cAAc;aACrB;YACD,OAAO,EAAE,MAAM,CAAC,MAAM,CAAC,WAAW,CAAC;SACpC;KACF;IACD,IAAI,EAAE;QACJ,OAAO,EAAE,WAAW;QACpB,MAAM,EAAE,WAAW,CAAC,KAAK;QACzB,KAAK,EAAE,WAAW,CAAC,GAAG;KACvB;CACuC,CAAC;AAC3C,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;gBAER,IAAI,CAAC,OAAO;eACb,IAAI,CAAC,MAAM;cACZ,IAAI,CAAC,KAAK;;GAErB;CAC2C,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZInputMessage} from \".\";\nimport {ControlSize, InputStatus} from \"../../beans\";\nimport \"./index\";\n\ntype ZInputMessageStoriesArgs = ZInputMessage & {class: ControlSize};\n\nconst StoryMeta = {\n  title: \"ZInputMessage\",\n  component: \"z-input-message\",\n  argTypes: {\n    status: {\n      control: {\n        type: \"inline-radio\",\n      },\n      options: [\"default\", ...Object.values(InputStatus)],\n    },\n    class: {\n      control: {\n        type: \"inline-radio\",\n      },\n      options: Object.values(ControlSize),\n    },\n  },\n  args: {\n    message: \"messaggio\",\n    status: InputStatus.ERROR,\n    class: ControlSize.BIG,\n  },\n} satisfies Meta<ZInputMessageStoriesArgs>;\nexport default StoryMeta;\n\nexport const Default = {\n  render: (args) => html`\n    <z-input-message\n      message=${args.message}\n      status=${args.status}\n      class=${args.class}\n    ></z-input-message>\n  `,\n} satisfies StoryObj<ZInputMessageStoriesArgs>;\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-logo/index.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC,EAAC,MAAM,eAAe,CAAC;AAOvD,MAAM,OAAO,KAAK;;;;;;;;;IAyBhB,MAAM;QACJ,MAAM,KAAK,GAAG,EAAE,CAAC;QAEjB,IAAI,IAAI,CAAC,KAAK,EAAE,CAAC;YACf,KAAK,CAAC,OAAO,CAAC,GAAG,KAAK,CAAC,WAAW,CAAC,GAAG,GAAG,IAAI,CAAC,KAAK,IAAI,CAAC;QAC1D,CAAC;QAED,IAAI,IAAI,CAAC,MAAM,EAAE,CAAC;YAChB,KAAK,CAAC,QAAQ,CAAC,GAAG,KAAK,CAAC,YAAY,CAAC,GAAG,GAAG,IAAI,CAAC,MAAM,IAAI,CAAC;QAC7D,CAAC;QAED,OAAO,CACL,EAAC,IAAI,qDACH,KAAK,EAAE,KAAK,EACZ,KAAK,EAAE,EAAC,MAAM,EAAE,CAAC,CAAC,IAAI,CAAC,UAAU,EAAC,IAEjC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC,CACX,SACE,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,OAAO;YAE7C,WAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,GAAI,CACzB,CACL,CAAC,CAAC,CAAC,CACF,WAAK,GAAG,EAAE,IAAI,CAAC,QAAQ,GAAI,CAC5B,CACI,CACR,CAAC;IACJ,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CACF","sourcesContent":["import {Component, Host, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-logo\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZLogo {\n  /** image width */\n  @Prop()\n  width?: number;\n\n  /** image height */\n  @Prop()\n  height?: number;\n\n  /** alternative image text */\n  @Prop()\n  imageAlt?: string;\n\n  /** link url (optional) */\n  @Prop()\n  link?: string;\n\n  /** link target: true means _blank, false means _self */\n  @Prop()\n  targetBlank?: boolean;\n\n  /** if true, the mobile logo is displayed, otherwise the desktop one */\n  @Prop()\n  mobileLogo?: boolean;\n\n  render(): HTMLZLogoElement {\n    const style = {};\n\n    if (this.width) {\n      style[\"width\"] = style[\"max-width\"] = `${this.width}px`;\n    }\n\n    if (this.height) {\n      style[\"height\"] = style[\"max-height\"] = `${this.height}px`;\n    }\n\n    return (\n      <Host\n        style={style}\n        class={{mobile: !!this.mobileLogo}}\n      >\n        {this.link ? (\n          <a\n            href={this.link}\n            target={this.targetBlank ? \"_blank\" : \"_self\"}\n          >\n            <img alt={this.imageAlt} />\n          </a>\n        ) : (\n          <img alt={this.imageAlt} />\n        )}\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,26 +0,0 @@
-import { html } from "lit";
-import "./index";
-const StoryMeta = {
-    title: "ZLogo",
-    component: "z-logo",
-    args: {
-        imageAlt: "logo",
-        height: 50,
-        width: 200,
-        link: "",
-        targetBlank: false,
-        mobileLogo: false,
-    },
-};
-export default StoryMeta;
-export const Default = {
-    render: (args) => html `<z-logo
-      image-alt="${args.imageAlt}"
-      height="${args.height}"
-      width="${args.width}"
-      link="${args.link}"
-      target-blank="${args.targetBlank}"
-      mobile-logo="${args.mobileLogo}"
-    ></z-logo>`,
-};
-//# sourceMappingURL=index.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-logo/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,OAAO;IACd,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE;QACJ,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,EAAE;QACV,KAAK,EAAE,GAAG;QACV,IAAI,EAAE,EAAE;QACR,WAAW,EAAE,KAAK;QAClB,UAAU,EAAE,KAAK;KAClB;CACoB,CAAC;AAExB,eAAe,SAAS,CAAC;AAEzB,MAAM,CAAC,MAAM,OAAO,GAAG;IACrB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CACf,IAAI,CAAA;mBACW,IAAI,CAAC,QAAQ;gBAChB,IAAI,CAAC,MAAM;eACZ,IAAI,CAAC,KAAK;cACX,IAAI,CAAC,IAAI;sBACD,IAAI,CAAC,WAAW;qBACjB,IAAI,CAAC,UAAU;eACrB;CACY,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {ZLogo} from \".\";\nimport \"./index\";\n\nconst StoryMeta = {\n  title: \"ZLogo\",\n  component: \"z-logo\",\n  args: {\n    imageAlt: \"logo\",\n    height: 50,\n    width: 200,\n    link: \"\",\n    targetBlank: false,\n    mobileLogo: false,\n  },\n} satisfies Meta<ZLogo>;\n\nexport default StoryMeta;\n\nexport const Default = {\n  render: (args) =>\n    html`<z-logo\n      image-alt=\"${args.imageAlt}\"\n      height=\"${args.height}\"\n      width=\"${args.width}\"\n      link=\"${args.link}\"\n      target-blank=\"${args.targetBlank}\"\n      mobile-logo=\"${args.mobileLogo}\"\n    ></z-logo>`,\n} satisfies StoryObj<ZLogo>;\n"]}

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/z-menu/index.tsx"],"names":[],"mappings":"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","sourcesContent":["import {Component, Element, Event, EventEmitter, Host, Listen, Method, Prop, State, Watch, h} from \"@stencil/core\";\nimport {KeyboardCode} from \"../../beans\";\nimport {containsElement} from \"../../utils/utils\";\n\nconst isZMenuSection = (el: HTMLElement | HTMLZMenuSectionElement): el is HTMLZMenuSectionElement =>\n  el?.tagName === \"Z-MENU-SECTION\";\n\n/**\n * @slot - Menu label\n * @slot header - Header to display as the first entry of the open menu.\n * @slot item - Single entry of the section. Can be slotted multiple times to insert items onto the menu. Set the `data-active` HTML attribute on the element to highlight it (`active` also works but `data-active` is preferable). Use `z-menu-section` for submenus.\n * @cssprop --z-menu-label-color - Color of the label's text.\n */\n@Component({\n  tag: \"z-menu\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMenu {\n  @Element() host: HTMLZMenuElement;\n\n  /** Flag to set the active status of the menu. */\n  @Prop({reflect: true})\n  active?: boolean;\n\n  /**\n   * Flag to set the display mode of the list.\n   * If true, the list will be absolutely positioned under the menu label,\n   * stacked beneath it otherwise.\n   */\n  @Prop({reflect: true})\n  floating? = true;\n\n  /** The opening state of the menu. */\n  @Prop({mutable: true, reflect: true})\n  open = false;\n\n  /**\n   * Tells the component that it's placed in a vertical context with other `ZMenu`s (usually in the ZAppHeader's offcanvas).\n   * A small border is placed under it as a separator from other elements.\n   */\n  @Prop({reflect: true})\n  verticalContext = false;\n\n  /**\n   * Tabindex value to set on the menu label.\n   * Useful to manage keyboard navigation focus with roving tabindex handled by this component's parent (usually ZAppHeader).\n   */\n  @Prop({mutable: true})\n  htmlTabindex = -1;\n\n  @State()\n  hasHeader: boolean;\n\n  @State()\n  hasContent: boolean;\n\n  /** The menu has been opened. */\n  @Event()\n  opened: EventEmitter;\n\n  /** The menu has been closed. */\n  @Event()\n  closed: EventEmitter;\n\n  private labelButton: HTMLButtonElement;\n\n  private content: HTMLElement;\n\n  private items: (HTMLElement | HTMLZMenuSectionElement)[] = [];\n\n  /** Animation frame request id. */\n  private raf: number;\n\n  private get focusableItem(): HTMLZMenuSectionElement | HTMLElement | null {\n    return this.items.find((item) => (isZMenuSection(item) ? item.htmlTabindex === 0 : item.tabIndex === 0));\n  }\n\n  private toggle(): void {\n    if (!this.hasContent) {\n      return;\n    }\n\n    this.open = !this.open;\n  }\n\n  /**\n   * Sets slotted item text as `data-text` attribute value, to let CSS use it through `attr()`.\n   * @param ev Slotchange event\n   */\n  private onLabelSlotChange(ev: Event): void {\n    const labelElement = (ev.target as HTMLSlotElement).assignedElements()[0] as HTMLElement;\n    labelElement.dataset.text = labelElement?.textContent;\n    this.setLabelA11yAttrs();\n  }\n\n  /**\n   * Correctly set position of the floating menu in order to prevent overflow.\n   * @param live Should run the method on every refresh frame.\n   */\n  private reflow(live = false): void {\n    if (!this.floating) {\n      return;\n    }\n\n    if (this.content && this.hasContent) {\n      const {style} = this.content;\n      const {left} = this.host.getBoundingClientRect();\n      const widthPx = getComputedStyle(this.content).width;\n      const width = widthPx ? parseFloat(widthPx.replace(\"px\", \"\")) : 375;\n      const safeScrollbarSpace = 30;\n      style.left = `${Math.min(window.innerWidth - left - width - safeScrollbarSpace, 0)}px`;\n    }\n    if (live) {\n      this.raf = requestAnimationFrame(this.reflow.bind(this, live));\n    }\n  }\n\n  /**\n   * Check if some content slot is set.\n   */\n  private checkContent(): void {\n    this.hasHeader = !!this.host.querySelectorAll(\"[slot=header]\").length;\n    this.hasContent = !!this.host.querySelectorAll(\"[slot=item]\").length || this.hasHeader;\n  }\n\n  private setItemTabindex(item: HTMLElement | HTMLZMenuSectionElement, tabIndex: number): void {\n    if (isZMenuSection(item)) {\n      item.htmlTabindex = tabIndex;\n    } else {\n      item.tabIndex = tabIndex;\n    }\n  }\n\n  /**\n   * Set `menuitem` role to all menu items (ZMenuSection items already have it).\n   * Set -1 to the tabindex of the items and 0 to the first one.\n   */\n  private setItemsA11yAttrs(): void {\n    this.items.forEach((item, index) => {\n      const tabindex = index === 0 ? 0 : -1;\n      this.setItemTabindex(item, tabindex);\n      if (!isZMenuSection(item)) {\n        item.setAttribute(\"role\", \"menuitem\");\n      }\n    });\n  }\n\n  private onItemsChange(): void {\n    this.checkContent();\n    this.items = Array.from(this.host.children).filter(({slot}) => slot === \"item\") as HTMLElement[];\n    this.setItemsA11yAttrs();\n    this.items.forEach((item) => {\n      if (!isZMenuSection(item)) {\n        item.dataset.text = item.textContent;\n      }\n    });\n  }\n\n  /**\n   * Move focus and adjust the tabindex value of `receiver` and `current` elements,\n   * setting -1 to the `current` and 0 to the `receiver`, then focus the `receiver` element.\n   * If the receiver is a ZMenuSection and it's open, focus its first focusable item.\n   */\n  private moveFocus(\n    receiver: HTMLElement | HTMLZMenuSectionElement,\n    current?: HTMLElement | HTMLZMenuSectionElement\n  ): void {\n    if (isZMenuSection(receiver)) {\n      receiver.setFocus();\n    } else {\n      receiver.tabIndex = 0;\n      setTimeout(() => {\n        receiver.focus();\n      }, 100);\n    }\n    if (!current) {\n      return;\n    }\n\n    this.setItemTabindex(current, -1);\n  }\n\n  private onLabelClick(): void {\n    this.toggle();\n    this.setFocus();\n  }\n\n  private onLabelKeydown(ev: KeyboardEvent): void {\n    if (ev.key === KeyboardCode.ENTER || ev.key === KeyboardCode.SPACE) {\n      ev.preventDefault();\n      ev.stopPropagation();\n      this.toggle();\n      if (this.open) {\n        this.moveFocus(this.items[0]);\n      }\n\n      return;\n    }\n\n    if (!this.verticalContext) {\n      return;\n    }\n\n    if (ev.key === KeyboardCode.ARROW_RIGHT && !this.open) {\n      ev.preventDefault();\n      ev.stopPropagation();\n      this.open = true;\n      this.moveFocus(this.items[0]);\n    }\n  }\n\n  /** Set tabindex of the label to 0, then focus it. */\n  @Method()\n  async setFocus(): Promise<void> {\n    this.htmlTabindex = 0;\n    const label = this.hasContent ? this.labelButton : (this.host.firstElementChild as HTMLElement);\n    label.focus();\n  }\n\n  /**\n   * Focus the last item.\n   */\n  @Method()\n  async focusLastItem(): Promise<void> {\n    const lastItem = this.items[this.items.length - 1];\n    if (isZMenuSection(lastItem) && lastItem.open) {\n      lastItem.focusLastItem();\n\n      return;\n    }\n\n    this.moveFocus(lastItem);\n  }\n\n  @Watch(\"open\")\n  onOpenChanged(): void {\n    if (!this.open) {\n      cancelAnimationFrame(this.raf);\n      this.closed.emit();\n      this.items.forEach((item) => {\n        if (isZMenuSection(item) && item.open) {\n          item.open = false;\n        }\n      });\n\n      return;\n    }\n\n    this.setItemsA11yAttrs();\n    this.opened.emit();\n    if (this.floating) {\n      this.reflow(true);\n    }\n  }\n\n  @Watch(\"htmlTabindex\")\n  setLabelA11yAttrs(): void {\n    if (this.hasContent && this.labelButton) {\n      this.labelButton.tabIndex = this.htmlTabindex;\n\n      return;\n    }\n\n    const slottedLabel = this.host.firstElementChild as HTMLElement;\n    slottedLabel.role = \"menuitem\";\n    slottedLabel.tabIndex = this.htmlTabindex;\n  }\n\n  /**\n   * Set tabindex to -1 to all siblings of the clicked item.\n   */\n  @Listen(\"click\", {target: \"document\"})\n  onItemClick(ev: MouseEvent): void {\n    const clickedItem = this.items.find((item) => containsElement(item, ev.target as HTMLElement));\n    if (clickedItem) {\n      this.items.forEach((item) => {\n        if (item === clickedItem) {\n          return;\n        }\n\n        if (isZMenuSection(item)) {\n          item.htmlTabindex = -1;\n        } else {\n          item.tabIndex = -1;\n        }\n      });\n    }\n  }\n\n  @Listen(\"keydown\")\n  onKeyDown(ev: KeyboardEvent): void {\n    if (!this.hasContent) {\n      return;\n    }\n\n    switch (ev.key) {\n      case KeyboardCode.ESC:\n        if (!this.open) {\n          break;\n        }\n        ev.stopPropagation();\n        ev.preventDefault();\n        this.open = false;\n        this.setFocus();\n        break;\n      case KeyboardCode.ARROW_DOWN: {\n        if (document.activeElement === this.host) {\n          if (this.verticalContext && !this.open) {\n            break;\n          }\n\n          ev.stopPropagation();\n          ev.preventDefault();\n          if (!this.open) {\n            this.open = true;\n          }\n          this.moveFocus(this.items[0]);\n          break;\n        }\n\n        const currentIndex = this.items.indexOf(this.focusableItem);\n        if (this.verticalContext && currentIndex === this.items.length - 1) {\n          // navigation is going to leave this menu. restore tabindex to the label and let the parent handle it\n          this.setItemTabindex(this.items[currentIndex], -1);\n          this.htmlTabindex = 0;\n          break;\n        }\n\n        ev.stopPropagation();\n        ev.preventDefault();\n        const receiver = this.items[currentIndex + 1];\n        // if the last item is already focused, navigate to the first one\n        this.moveFocus(receiver ?? this.items[0], this.focusableItem);\n        break;\n      }\n      case KeyboardCode.ARROW_UP: {\n        if (document.activeElement === this.host) {\n          if (this.verticalContext) {\n            break;\n          }\n\n          ev.stopPropagation();\n          ev.preventDefault();\n          // open the menu and focus the last item\n          if (!this.open) {\n            this.open = true;\n          }\n          this.moveFocus(this.items[this.items.length - 1], this.focusableItem);\n          break;\n        }\n\n        ev.stopPropagation();\n        ev.preventDefault();\n        const currentIndex = this.items.indexOf(this.focusableItem);\n        if (currentIndex === 0 && this.verticalContext) {\n          this.setItemTabindex(this.focusableItem, -1);\n          this.setFocus();\n          break;\n        }\n\n        const receiver = this.items[currentIndex - 1] ?? this.items[this.items.length - 1];\n        // if the receiver is a ZMenuSection and it's open, focus its last item\n        if (isZMenuSection(receiver) && receiver.open) {\n          this.setItemTabindex(this.focusableItem, -1);\n          receiver.focusLastItem();\n          break;\n        }\n\n        this.moveFocus(receiver, this.focusableItem);\n        break;\n      }\n      case KeyboardCode.ARROW_LEFT:\n        if (!this.open || !this.verticalContext) {\n          break;\n        }\n\n        // close the menu and focus the label\n        ev.preventDefault();\n        ev.stopPropagation();\n        this.open = false;\n        this.setFocus();\n    }\n  }\n\n  constructor() {\n    this.toggle = this.toggle.bind(this);\n    this.checkContent = this.checkContent.bind(this);\n    this.onLabelSlotChange = this.onLabelSlotChange.bind(this);\n    this.onLabelClick = this.onLabelClick.bind(this);\n    this.onItemsChange = this.onItemsChange.bind(this);\n    this.onLabelKeydown = this.onLabelKeydown.bind(this);\n  }\n\n  componentWillLoad(): void {\n    this.setLabelA11yAttrs();\n    this.onItemsChange();\n  }\n\n  render(): HTMLDivElement | HTMLZMenuElement {\n    if (!this.hasContent) {\n      return (\n        <div class=\"menu-label\">\n          <slot onSlotchange={this.onLabelSlotChange} />\n        </div>\n      );\n    }\n\n    return (\n      <Host>\n        <button\n          ref={(el) => (this.labelButton = el)}\n          class=\"menu-label\"\n          aria-expanded={`${!!this.open}`}\n          aria-haspopup={`${this.hasContent}`}\n          aria-label={this.open ? \"Chiudi menù\" : \"Apri menù\"}\n          role=\"menuitem\"\n          tabIndex={this.htmlTabindex}\n          onClick={this.onLabelClick}\n          onKeyDown={this.onLabelKeydown}\n        >\n          <slot onSlotchange={this.onLabelSlotChange} />\n          <z-icon name={this.open ? \"chevron-up\" : \"chevron-down\"} />\n        </button>\n\n        <div\n          class=\"content\"\n          ref={(el) => (this.content = el)}\n        >\n          {this.hasHeader && (\n            <header class=\"header\">\n              <slot\n                name=\"header\"\n                onSlotchange={this.checkContent}\n              />\n            </header>\n          )}\n\n          <div\n            class=\"items\"\n            role=\"menu\"\n          >\n            <slot\n              name=\"item\"\n              onSlotchange={this.onItemsChange}\n            />\n          </div>\n        </div>\n      </Host>\n    );\n  }\n}\n"]}

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

@@ -1,123 +0,0 @@
-import { html } from "lit";
-import "../z-menu-section/index";
-import "./index";
-const StoryMeta = {
-    title: "Zmenu/ZMenu",
-    component: "z-menu",
-    args: {
-        active: false,
-        floating: true,
-    },
-};
-export default StoryMeta;
-export const FloatingContentLayout = {
-    render: (args) => html `
-    <z-menu
-      .active=${args.active}
-      .floating=${args.floating}
-    >
-      <h3>Menu label</h3>
-      <a
-        href=""
-        slot="item"
-        >Item 1</a
-      >
-      <a
-        href=""
-        slot="item"
-        >Item 2</a
-      >
-      <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>
-      <z-menu-section slot="item">
-        <h3>Item 4</h3>
-        <a
-          href=""
-          slot="section"
-          >Item 4.1</a
-        >
-        <a
-          href=""
-          slot="section"
-          >Item 4.2</a
-        >
-      </z-menu-section>
-      <a
-        href=""
-        slot="item"
-        >Item 5</a
-      >
-    </z-menu>
-  `,
-};
-export const WithHeader = {
-    render: (args) => html `
-    <z-menu
-      .active=${args.active}
-      .floating=${args.floating}
-    >
-      <img
-        slot="header"
-        src="https://i.pinimg.com/originals/b9/fc/7e/b9fc7e6b2dd2ca128bcc3412e68994f0.jpg"
-      />
-      <h4 slot="header">Menu header</h4>
-      <h3>Menu label</h3>
-      <a
-        href=""
-        slot="item"
-        >Item 1</a
-      >
-      <a
-        href=""
-        slot="item"
-        >Item 2</a
-      >
-      <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>
-  `,
-};
-export const ActiveWithoutItems = {
-    parameters: {
-        controls: {
-            exclude: ["floating"],
-        },
-    },
-    render: () => html `
-    <z-menu .active=${true}>
-      <a
-        href="https://cataas.com/cat/gif"
-        target="_blank"
-        >Click me</a
-      >
-    </z-menu>
-  `,
-};
-//# sourceMappingURL=index.stories.js.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"index.stories.js","sourceRoot":"","sources":["../../../../src/components/z-menu/index.stories.ts"],"names":[],"mappings":"AACA,OAAO,EAAC,IAAI,EAAC,MAAM,KAAK,CAAC;AAEzB,OAAO,yBAAyB,CAAC;AACjC,OAAO,SAAS,CAAC;AAEjB,MAAM,SAAS,GAAG;IAChB,KAAK,EAAE,aAAa;IACpB,SAAS,EAAE,QAAQ;IACnB,IAAI,EAAE;QACJ,MAAM,EAAE,KAAK;QACb,QAAQ,EAAE,IAAI;KACf;CACoB,CAAC;AAExB,eAAe,SAAS,CAAC;AAIzB,MAAM,CAAC,MAAM,qBAAqB,GAAG;IACnC,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;gBAER,IAAI,CAAC,MAAM;kBACT,IAAI,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA6C5B;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,MAAM,EAAE,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAA;;gBAER,IAAI,CAAC,MAAM;kBACT,IAAI,CAAC,QAAQ;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAqC5B;CACc,CAAC;AAElB,MAAM,CAAC,MAAM,kBAAkB,GAAG;IAChC,UAAU,EAAE;QACV,QAAQ,EAAE;YACR,OAAO,EAAE,CAAC,UAAU,CAAC;SACtB;KACF;IACD,MAAM,EAAE,GAAG,EAAE,CAAC,IAAI,CAAA;sBACE,IAAI;;;;;;;GAOvB;CACc,CAAC","sourcesContent":["import {Meta, StoryObj} from \"@storybook/web-components\";\nimport {html} from \"lit\";\nimport {type ZMenu} from \".\";\nimport \"../z-menu-section/index\";\nimport \"./index\";\n\nconst StoryMeta = {\n  title: \"Zmenu/ZMenu\",\n  component: \"z-menu\",\n  args: {\n    active: false,\n    floating: true,\n  },\n} satisfies Meta<ZMenu>;\n\nexport default StoryMeta;\n\ntype Story = StoryObj<ZMenu>;\n\nexport const FloatingContentLayout = {\n  render: (args) => html`\n    <z-menu\n      .active=${args.active}\n      .floating=${args.floating}\n    >\n      <h3>Menu 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      <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      <z-menu-section slot=\"item\">\n        <h3>Item 4</h3>\n        <a\n          href=\"\"\n          slot=\"section\"\n          >Item 4.1</a\n        >\n        <a\n          href=\"\"\n          slot=\"section\"\n          >Item 4.2</a\n        >\n      </z-menu-section>\n      <a\n        href=\"\"\n        slot=\"item\"\n        >Item 5</a\n      >\n    </z-menu>\n  `,\n} satisfies Story;\n\nexport const WithHeader = {\n  render: (args) => html`\n    <z-menu\n      .active=${args.active}\n      .floating=${args.floating}\n    >\n      <img\n        slot=\"header\"\n        src=\"https://i.pinimg.com/originals/b9/fc/7e/b9fc7e6b2dd2ca128bcc3412e68994f0.jpg\"\n      />\n      <h4 slot=\"header\">Menu header</h4>\n      <h3>Menu 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      <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>\n  `,\n} satisfies Story;\n\nexport const ActiveWithoutItems = {\n  parameters: {\n    controls: {\n      exclude: [\"floating\"],\n    },\n  },\n  render: () => html`\n    <z-menu .active=${true}>\n      <a\n        href=\"https://cataas.com/cat/gif\"\n        target=\"_blank\"\n        >Click me</a\n      >\n    </z-menu>\n  `,\n} satisfies Story;\n"]}