@zanichelli/albe-web-components 9.1.2 → 9.2.0

package/dist/types/snowflakes/myz/list/z-myz-list-item/index.d.ts

@@ -1,25 +1,25 @@
-import { EventEmitter } from "../../../../stencil-public-runtime";
-export declare class ZMyzListItem {
-  /** content text */
-  text: string;
-  /** link url (optional) */
-  link?: string;
-  /** link target (optional) */
-  linktarget?: string;
-  /** icon name (optional) */
-  icon?: string;
-  /** id (optional) */
-  listitemid?: string;
-  /** data-action attribute (optional) */
-  action?: string;
-  /** underlined style flag */
-  underlined: boolean;
-  /** emitted on list item link click, returns linkId */
-  zListItemLinkClick: EventEmitter;
-  private emitZListItemLinkClick;
-  /** emitted on list item click, returns listitemid */
-  zListItemClick: EventEmitter;
-  private emitZListItemClick;
-  constructor();
-  render(): HTMLLIElement;
-}
+import { EventEmitter } from "../../../../stencil-public-runtime";
+export declare class ZMyzListItem {
+  /** content text */
+  text: string;
+  /** link url (optional) */
+  link?: string;
+  /** link target (optional) */
+  linktarget?: string;
+  /** icon name (optional) */
+  icon?: string;
+  /** id (optional) */
+  listitemid?: string;
+  /** data-action attribute (optional) */
+  action?: string;
+  /** underlined style flag */
+  underlined: boolean;
+  /** emitted on list item link click, returns linkId */
+  zListItemLinkClick: EventEmitter;
+  private emitZListItemLinkClick;
+  /** emitted on list item click, returns listitemid */
+  zListItemClick: EventEmitter;
+  private emitZListItemClick;
+  constructor();
+  render(): HTMLLIElement;
+}

package/dist/types/snowflakes/myz/pocket/z-messages-pocket/index.d.ts

@@ -1,16 +1,16 @@
-import { PocketStatus } from "../../../../beans";
-/**
- * @slot  - pocket body content
- */
-export declare class ZMessagesPocket {
-  /** pocket id */
-  pocketid: string;
-  /** number of messages */
-  messages: number;
-  /** pocket status */
-  status: PocketStatus;
-  handlePocketToggle(e: CustomEvent): void;
-  private renderHeader;
-  private renderBody;
-  render(): HTMLZPocketElement;
-}
+import { PocketStatus } from "../../../../beans";
+/**
+ * @slot  - pocket body content
+ */
+export declare class ZMessagesPocket {
+  /** pocket id */
+  pocketid: string;
+  /** number of messages */
+  messages: number;
+  /** pocket status */
+  status: PocketStatus;
+  handlePocketToggle(e: CustomEvent): void;
+  private renderHeader;
+  private renderBody;
+  render(): HTMLZPocketElement;
+}

package/dist/types/snowflakes/myz/pocket/z-pocket/index.d.ts

@@ -1,25 +1,25 @@
-import { EventEmitter } from "../../../../stencil-public-runtime";
-import { PocketStatus } from "../../../../beans";
-/**
- * @slot - pocket content
- */
-export declare class ZPocket {
-  hostElement: HTMLZPocketElement;
-  /** pocket id */
-  pocketid: string;
-  /** pocket status */
-  status: PocketStatus;
-  /** open z-pocket */
-  open(): Promise<void>;
-  /** close z-pocket */
-  close(): Promise<void>;
-  /** Emitted on pocket toggle, returns pocket id and status */
-  pocketToggle: EventEmitter;
-  private emitPocketToggle;
-  handlePocketHeaderClick(e: CustomEvent): void;
-  handlePocketHeaderPan(e: CustomEvent): void;
-  watchStatusHandler(newVal: PocketStatus): void;
-  componentWillLoad(): void;
-  private handleBackgroundClick;
-  render(): HTMLDivElement;
-}
+import { EventEmitter } from "../../../../stencil-public-runtime";
+import { PocketStatus } from "../../../../beans";
+/**
+ * @slot - pocket content
+ */
+export declare class ZPocket {
+  hostElement: HTMLZPocketElement;
+  /** pocket id */
+  pocketid: string;
+  /** pocket status */
+  status: PocketStatus;
+  /** open z-pocket */
+  open(): Promise<void>;
+  /** close z-pocket */
+  close(): Promise<void>;
+  /** Emitted on pocket toggle, returns pocket id and status */
+  pocketToggle: EventEmitter;
+  private emitPocketToggle;
+  handlePocketHeaderClick(e: CustomEvent): void;
+  handlePocketHeaderPan(e: CustomEvent): void;
+  watchStatusHandler(newVal: PocketStatus): void;
+  componentWillLoad(): void;
+  private handleBackgroundClick;
+  render(): HTMLDivElement;
+}

package/dist/types/snowflakes/myz/pocket/z-pocket-body/index.d.ts

@@ -1,12 +1,12 @@
-import { PocketStatus } from "../../../../beans";
-/**
- * @slot  - pocket body content
- */
-export declare class ZPocketBody {
-  /** pocket id */
-  pocketid: string;
-  /** pocket status */
-  status: PocketStatus;
-  handlePocketToggle(e: CustomEvent): void;
-  render(): HTMLElement;
-}
+import { PocketStatus } from "../../../../beans";
+/**
+ * @slot  - pocket body content
+ */
+export declare class ZPocketBody {
+  /** pocket id */
+  pocketid: string;
+  /** pocket status */
+  status: PocketStatus;
+  handlePocketToggle(e: CustomEvent): void;
+  render(): HTMLElement;
+}

package/dist/types/snowflakes/myz/pocket/z-pocket-header/index.d.ts

@@ -1,18 +1,18 @@
-import { EventEmitter } from "../../../../stencil-public-runtime";
-/**
- * @slot  - pocket header content
- */
-export declare class ZPocketHeader {
-  /** pocket id */
-  pocketid: string;
-  private swipeWrap;
-  /** Emitted on pocket header click */
-  pocketHeaderClick: EventEmitter;
-  private emitPocketHeaderClick;
-  /** Emitted on pocket header pan */
-  pocketHeaderPan: EventEmitter;
-  private emitPocketHeaderPan;
-  constructor();
-  componentDidLoad(): void;
-  render(): HTMLElement;
-}
+import { EventEmitter } from "../../../../stencil-public-runtime";
+/**
+ * @slot  - pocket header content
+ */
+export declare class ZPocketHeader {
+  /** pocket id */
+  pocketid: string;
+  private swipeWrap;
+  /** Emitted on pocket header click */
+  pocketHeaderClick: EventEmitter;
+  private emitPocketHeaderClick;
+  /** Emitted on pocket header pan */
+  pocketHeaderPan: EventEmitter;
+  private emitPocketHeaderPan;
+  constructor();
+  componentDidLoad(): void;
+  render(): HTMLElement;
+}

package/dist/types/snowflakes/myz/pocket/z-pocket-message/index.d.ts

@@ -1,7 +1,7 @@
-/**
- * @slot  - message body
- * @slot cta - message CTAs
- */
-export declare class ZPocketMessage {
-  render(): HTMLDivElement;
-}
+/**
+ * @slot  - message body
+ * @slot cta - message CTAs
+ */
+export declare class ZPocketMessage {
+  render(): HTMLDivElement;
+}

package/dist/types/snowflakes/myz/z-alert/index.d.ts

@@ -1,9 +1,9 @@
-import { AlertType } from "../../../beans/index";
-/**
- * @slot - alert content
- */
-export declare class ZAlert {
-  /** alert variant type */
-  type: AlertType;
-  render(): HTMLDivElement;
-}
+import { AlertType } from "../../../beans/index";
+/**
+ * @slot - alert content
+ */
+export declare class ZAlert {
+  /** alert variant type */
+  type: AlertType;
+  render(): HTMLDivElement;
+}

package/dist/types/snowflakes/myz/z-otp/index.d.ts

@@ -1,17 +1,17 @@
-import { EventEmitter } from "../../../stencil-public-runtime";
-import { InputStatus } from "../../../beans";
-export declare class ZOtp {
-  /** Input number */
-  inputNum?: number;
-  /** Input status */
-  status?: InputStatus;
-  /** Input message */
-  message?: string;
-  private otp;
-  private otpRef;
-  /** Otp change event */
-  otpChange: EventEmitter;
-  private emitInputChange;
-  componentWillLoad(): void;
-  render(): HTMLDivElement;
-}
+import { EventEmitter } from "../../../stencil-public-runtime";
+import { InputStatus } from "../../../beans";
+export declare class ZOtp {
+  /** Input number */
+  inputNum?: number;
+  /** Input status */
+  status?: InputStatus;
+  /** Input message */
+  message?: string;
+  private otp;
+  private otpRef;
+  /** Otp change event */
+  otpChange: EventEmitter;
+  private emitInputChange;
+  componentWillLoad(): void;
+  render(): HTMLDivElement;
+}

package/dist/types/snowflakes/myz/z-slideshow/index.d.ts

@@ -1,30 +1,30 @@
-import { Device } from "../../../beans";
-/**
- * @slot footer-right - right content slot in footer
- * @slot footer-left - left content slot in footer
- */
-export declare class ZSlideshow {
-  el: HTMLZSlideshowElement;
-  /** slideshow id */
-  slideshowid: string;
-  /** array or JSON stringified images urls */
-  data: string[] | string;
-  device: Device;
-  currentSlide: number;
-  private links;
-  watchData(): void;
-  componentWillLoad(): void;
-  componentDidRender(): void;
-  private handleResize;
-  private parseLinks;
-  private setStyle;
-  private setDevice;
-  private setCurrentSlide;
-  private getBulletDimension;
-  private renderSlides;
-  private renderScroll;
-  private renderSlideshowMain;
-  private renderBullet;
-  private renderSlideshowFooter;
-  render(): HTMLElement;
-}
+import { Device } from "../../../beans";
+/**
+ * @slot footer-right - right content slot in footer
+ * @slot footer-left - left content slot in footer
+ */
+export declare class ZSlideshow {
+  el: HTMLZSlideshowElement;
+  /** slideshow id */
+  slideshowid: string;
+  /** array or JSON stringified images urls */
+  data: string[] | string;
+  device: Device;
+  currentSlide: number;
+  private links;
+  watchData(): void;
+  componentWillLoad(): void;
+  componentDidRender(): void;
+  private handleResize;
+  private parseLinks;
+  private setStyle;
+  private setDevice;
+  private setCurrentSlide;
+  private getBulletDimension;
+  private renderSlides;
+  private renderScroll;
+  private renderSlideshowMain;
+  private renderBullet;
+  private renderSlideshowFooter;
+  render(): HTMLElement;
+}

package/dist/types/utils/storybook-utils.d.ts

@@ -0,0 +1,50 @@
+/**
+ * Get Design System color tokens.
+ * Can be used in components stories controls as follows:
+ * @example ```
+ * argTypes={{
+ *  "--z-component--background-color": {
+ *    control: {type: "select"},
+ *    options: getColorTokens(),
+ *  }
+ * }}```
+ *
+ * and then in the component tag
+ *
+ * ```<z-component .style="--z-component--background-color: var(${args["--z-component--background-color"]})" />```
+ */
+export declare function getColorTokens(): string[];
+/**
+ * Get Design System color tokens as CSS variable rule (something like `var(--color-token)`).
+ * @example ```
+ * argTypes={{
+ *  "--z-component--background-color": {
+ *    control: {type: "select"},
+ *    options: getColorTokens(),
+ *  }
+ * }}```
+ *
+ * and then in the component tag
+ *
+ * ```<z-component .style="--z-component--background-color: ${args["--z-component--background-color"]}" />```
+ */
+export declare function getColorVars(): string[];
+/**
+ * Get Design System color tokens as readable labels for control configuration.
+ * It assumes you set the options using the `getColorVars()` function, so expected options are something like `var(--color-token)`.
+ * @example ```
+ * argTypes={{
+ *  "--z-component--background-color": {
+ *    options: getColorTokens(),
+ *    control: {
+ *      type: "select",
+ *      labels: getColorVarsLabels(),
+ *    },
+ *  }
+ * }}```
+ */
+export declare function getColorVarsLabels(): Record<string, string>;
+/**
+ * Get Design System themes tokens.
+ */
+export declare function getThemesColorTokens(): string[];

package/dist/types/utils/utils.d.ts

@@ -1,24 +1,24 @@
-import { ChildNode } from "../stencil-public-runtime";
-import { Device } from "../beans/index";
-export declare function format(first: string, middle: string, last: string): string;
-/**
- * Return boolean value for passed value if a boolean corresponding value is found
- * Return passed value otherwise
- */
-export declare function boolean(value: string | number | boolean): boolean | string | number;
-export declare function retrieveAsset(assetName: string): string;
-export declare function randomId(): string;
-export declare function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args: any[]) => void, ...args: any[]): void;
-export declare function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args: any[]) => void, ...args: any[]): void;
-export declare function getClickedElement(elem?: null | Element): null | Element;
-export declare function getElementTree(elem: Element, tree?: Element[]): null | Element[];
-export declare function getSiblings(elem: HTMLElement): ChildNode[];
-export declare function getDevice(): Device;
-declare type JSONValue = string | number | boolean | JSONObject | JSONArray;
-interface JSONObject {
-  [x: string]: JSONValue;
-}
-declare type JSONArray = JSONValue[];
-export declare function convertJson(data: string): JSONValue;
-export declare function colorFromId(id: number): string;
-export {};
+import { ChildNode } from "../stencil-public-runtime";
+import { Device } from "../beans/index";
+export declare function format(first: string, middle: string, last: string): string;
+/**
+ * Return boolean value for passed value if a boolean corresponding value is found
+ * Return passed value otherwise
+ */
+export declare function boolean(value: string | number | boolean): boolean | string | number;
+export declare function retrieveAsset(assetName: string): string;
+export declare function randomId(): string;
+export declare function handleKeyboardSubmit(ev: KeyboardEvent, callback: (...args: any[]) => void, ...args: any[]): void;
+export declare function handleEnterKeydSubmit(ev: KeyboardEvent, callback: (...args: any[]) => void, ...args: any[]): void;
+export declare function getClickedElement(elem?: null | Element): null | Element;
+export declare function getElementTree(elem: Element, tree?: Element[]): null | Element[];
+export declare function getSiblings(elem: HTMLElement): ChildNode[];
+export declare function getDevice(): Device;
+declare type JSONValue = string | number | boolean | JSONObject | JSONArray;
+interface JSONObject {
+  [x: string]: JSONValue;
+}
+declare type JSONArray = JSONValue[];
+export declare function convertJson(data: string): JSONValue;
+export declare function colorFromId(id: number): string;
+export {};

package/dist/web-components-library/index.esm.js

@@ -1 +1 @@
-import{c as $}from"./p-aa5e3e61.js";export{o as AlertType,A as AvatarSize,Y as BookCardVariant,W as BreadcrumbHomepageVariant,V as BreadcrumbPathStyle,d as ButtonSize,c as ButtonType,B as ButtonVariant,C as CardVariant,R as CarouselArrowsPosition,U as CarouselProgressMode,e as ControlSize,Q as CoverHeroContentPosition,M as CoverHeroVariant,p as Device,h as DividerOrientation,D as DividerSize,j as ExpandableListButtonAlign,E as ExpandableListStyle,J as InfoRevealPosition,f as InputStatus,I as InputType,g as KeyboardCode,K as KeyboardKeyCode,k as LabelPosition,L as LicenseType,l as ListDividerType,i as ListSize,m as ListType,b as NavigationTabsKeyboardEvents,N as NavigationTabsOrientation,a as NavigationTabsSize,n as NotificationType,O as OffCanvasVariant,q as PocketStatus,P as PopoverPosition,S as SortDirection,T as ThemeVariant,r as ToastNotification,t as ToastNotificationPosition,s as ToastNotificationTransition,v as TransitionDirection,X as VisibilityCondition,u as ZAriaAlertMode,x as ZChipType,z as ZDatePickerMode,F as ZDatePickerModeValue,G as ZDatePickerPosition,w as ZFileUploadType,H as ZRangePickerMode,y as ZSectionTitleDividerPosition,Z as ZTableRowExpandedType}from"./p-e1d9785e.js";import"./p-b497e33e.js";const _={colorFromId:$};export{_ as Utils}
+import{c as $}from"./p-766d9faa.js";export{_ as AccordionVariant,o as AlertType,A as AvatarSize,Y as BookCardVariant,W as BreadcrumbHomepageVariant,V as BreadcrumbPathStyle,d as ButtonSize,c as ButtonType,B as ButtonVariant,C as CardVariant,R as CarouselArrowsPosition,U as CarouselProgressMode,e as ControlSize,Q as CoverHeroContentPosition,M as CoverHeroVariant,p as Device,h as DividerOrientation,D as DividerSize,j as ExpandableListButtonAlign,E as ExpandableListStyle,J as InfoRevealPosition,f as InputStatus,I as InputType,g as KeyboardCode,K as KeyboardKeyCode,k as LabelPosition,L as LicenseType,l as ListDividerType,i as ListSize,m as ListType,b as NavigationTabsKeyboardEvents,N as NavigationTabsOrientation,a as NavigationTabsSize,n as NotificationType,O as OffCanvasVariant,q as PocketStatus,P as PopoverPosition,S as SortDirection,T as ThemeVariant,r as ToastNotification,t as ToastNotificationPosition,s as ToastNotificationTransition,v as TransitionDirection,X as VisibilityCondition,u as ZAriaAlertMode,x as ZChipType,z as ZDatePickerMode,F as ZDatePickerModeValue,G as ZDatePickerPosition,w as ZFileUploadType,H as ZRangePickerMode,y as ZSectionTitleDividerPosition,Z as ZTableRowExpandedType}from"./p-74a062db.js";import"./p-37037d9d.js";const aa={colorFromId:$};export{aa as Utils}

package/dist/web-components-library/{p-4d1bfd27.entry.js → p-0441c402.entry.js}

@@ -1 +1 @@
-import{r as t,c as s,h as i,H as e,g as o}from"./p-d17ebc2f.js";import{R as r,U as n,d as a,B as l}from"./p-e1d9785e.js";const c=class{constructor(i){t(this,i),this.indexChange=s(this,"indexChange",7),this.single=!1,this.ghostLoadingHeight=100,this.current=0,this.scrollingTo=null}onIndexChange(){this.indexChange.emit({currentItem:this.current})}onSingleModeChange(){this.single&&!this.intersectionObserver&&this.setIntersectionObserver()}setIntersectionObserver(){this.intersectionObserver=new window.IntersectionObserver((t=>{const s=t.find((t=>t.isIntersecting));if(!s)return;const i=this.items.findIndex((t=>t===s.target));this.highlightedIndicator=i,null!==this.scrollingTo&&i!==this.scrollingTo||(this.scrollingTo=null,this.current=i)}),{root:this.itemsContainer,threshold:.5}),this.items.forEach((t=>this.intersectionObserver.observe(t)))}onPrev(){if(this.single)return void this.goTo(Math.max(0,this.current-1));const t=this.itemsContainer;t&&t.scrollBy({left:-t.clientWidth/2,behavior:"smooth"})}onNext(){if(this.single)return void this.goTo(Math.min(this.current+1,this.items.length-1));const t=this.itemsContainer;t&&t.scrollBy({left:t.clientWidth/2,behavior:"smooth"})}checkNavigationValidity(){this.single&&(this.canNavigatePrev=this.current>1,this.canNavigateNext=this.current<this.items.length-1),this.canNavigatePrev=this.itemsContainer.scrollLeft>0,this.canNavigateNext=this.itemsContainer.scrollLeft<this.itemsContainer.scrollWidth-this.itemsContainer.clientWidth}canShowFooter(){return this.arrowsPosition===r.BOTTOM||this.progressMode===n.DOTS||this.progressMode===n.NUMBERS}goTo(t){this.current!==t&&(this.scrollingTo=t,this.itemsContainer.scroll({left:this.items[t].offsetLeft,behavior:"smooth"}))}componentDidLoad(){this.itemsContainer=this.hostElement.querySelector(".z-carousel-items-container"),this.itemsContainer&&(this.items=Array.from(this.itemsContainer.querySelectorAll(":scope > li")),this.single&&this.setIntersectionObserver(),this.itemsContainer.addEventListener("scroll",this.checkNavigationValidity.bind(this),{passive:!0}),this.checkNavigationValidity())}render(){return this.isLoading?i(e,null,this.label&&i("div",{class:"heading-4 z-carousel-title"},this.label),i("div",{style:{height:`${this.ghostLoadingHeight}px`}},i("z-ghost-loading",null),i("div",{class:"loading-items-container"},i("slot",null)))):i(e,null,i("div",{class:"z-carousel-container"},this.label&&i("div",{class:"heading-4 z-carousel-title"},this.label),i("div",{class:"z-carousel-wrapper"},this.arrowsPosition===r.OVER&&i("z-button",{size:a.SMALL,"data-direction":"prev",icon:"chevron-left",onClick:this.onPrev.bind(this),disabled:!this.canNavigatePrev}),i("ul",{class:"z-carousel-items-container"},i("slot",null)),this.arrowsPosition===r.OVER&&i("z-button",{size:a.SMALL,"data-direction":"next",icon:"chevron-right",onClick:this.onNext.bind(this),disabled:!this.canNavigateNext}))),this.canShowFooter()&&i("div",{class:"z-carousel-footer"},this.arrowsPosition===r.BOTTOM&&i("z-button",{size:a.SMALL,variant:l.TERTIARY,icon:"arrow-simple-left-filled",onClick:this.onPrev.bind(this),disabled:!this.canNavigatePrev}),this.progressMode===n.DOTS&&this.single&&this.items&&i("div",{class:"dots-progress"},this.items.map(((t,s)=>i("button",{type:"button",class:{current:this.highlightedIndicator===s},onClick:()=>this.goTo(s)},i("z-icon",{name:this.highlightedIndicator===s?"white-circle-filled":"black-circle-filled"}))))),this.progressMode===n.NUMBERS&&this.single&&this.items&&i("div",{class:"numbers-progress interactive-3"},i("span",{class:"current"},this.current+1),i("span",null,"di"),i("span",null,this.items.length)),this.arrowsPosition===r.BOTTOM&&i("z-button",{size:a.SMALL,variant:l.TERTIARY,icon:"arrow-simple-right-filled",onClick:this.onNext.bind(this),disabled:!this.canNavigateNext})))}get hostElement(){return o(this)}static get watchers(){return{current:["onIndexChange"],single:["onSingleModeChange"]}}};c.style='z-carousel{font-family:var(--font-family-sans);font-weight:var(--font-rg);--z-carousel-gutter:0}z-carousel[single],z-carousel[single="true"]{display:flex;flex-direction:column;align-items:center;justify-content:center}z-carousel[single="true"] .z-carousel-container,z-carousel[single] .z-carousel-container{width:fit-content;max-width:100%}z-carousel .loading-items-container{display:none}z-carousel .z-carousel-container{display:flex;flex-direction:column}z-carousel .z-carousel-wrapper{position:relative}z-carousel .z-carousel-title{margin-bottom:var(--space-unit);color:var(--gray800)}z-carousel .z-carousel-items-container{display:flex;max-width:100%;flex-direction:row;margin:0;list-style:none;-ms-overflow-style:none;overflow-x:scroll;padding-inline-start:0;scroll-snap-type:x mandatory;scrollbar-width:none;}z-carousel .z-carousel-items-container::-webkit-scrollbar{display:none}z-carousel .z-carousel-items-container>*:not(:last-child){margin-right:var(--z-carousel-gutter)}z-carousel[single="true"] .z-carousel-items-container>*:not(:last-child),z-carousel[single] .z-carousel-items-container>*:not(:last-child){margin-right:0}z-carousel .z-carousel-items-container>li{scroll-snap-align:center}z-button[data-direction]{--z-icon-width:32px;--z-icon-height:32px;position:absolute;bottom:50%;transform:translateY(50%)}z-button[data-direction="next"]{right:0}z-carousel .z-carousel-footer{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:var(--space-unit)}z-carousel .z-carousel-footer .numbers-progress,z-carousel .z-carousel-footer .dots-progress{display:flex;align-items:center;justify-content:center}z-carousel .z-carousel-footer .dots-progress button{display:flex;align-items:center;padding:0;border:none;margin:0;background-color:transparent}z-carousel .z-carousel-footer .dots-progress button:not(.current){cursor:pointer}z-carousel .z-carousel-footer .numbers-progress{margin:0 calc(var(--space-unit) / 2);column-gap:calc(var(--space-unit) / 2)}z-carousel .z-carousel-footer .numbers-progress .current{font-weight:var(--font-sb)}z-carousel .z-carousel-footer .dots-progress button.current z-icon{fill:var(--gray800)}z-carousel .z-carousel-footer .dots-progress button:not(.current) z-icon{fill:var(--gray200)}';export{c as z_carousel}
+import{r as t,c as s,h as i,H as e,g as o}from"./p-d17ebc2f.js";import{R as r,U as n,d as a,B as l}from"./p-74a062db.js";const c=class{constructor(i){t(this,i),this.indexChange=s(this,"indexChange",7),this.single=!1,this.ghostLoadingHeight=100,this.current=0,this.scrollingTo=null}onIndexChange(){this.indexChange.emit({currentItem:this.current})}onSingleModeChange(){this.single&&!this.intersectionObserver&&this.setIntersectionObserver()}setIntersectionObserver(){this.intersectionObserver=new window.IntersectionObserver((t=>{const s=t.find((t=>t.isIntersecting));if(!s)return;const i=this.items.findIndex((t=>t===s.target));this.highlightedIndicator=i,null!==this.scrollingTo&&i!==this.scrollingTo||(this.scrollingTo=null,this.current=i)}),{root:this.itemsContainer,threshold:.5}),this.items.forEach((t=>this.intersectionObserver.observe(t)))}onPrev(){if(this.single)return void this.goTo(Math.max(0,this.current-1));const t=this.itemsContainer;t&&t.scrollBy({left:-t.clientWidth/2,behavior:"smooth"})}onNext(){if(this.single)return void this.goTo(Math.min(this.current+1,this.items.length-1));const t=this.itemsContainer;t&&t.scrollBy({left:t.clientWidth/2,behavior:"smooth"})}checkNavigationValidity(){this.single&&(this.canNavigatePrev=this.current>1,this.canNavigateNext=this.current<this.items.length-1),this.canNavigatePrev=this.itemsContainer.scrollLeft>0,this.canNavigateNext=this.itemsContainer.scrollLeft<this.itemsContainer.scrollWidth-this.itemsContainer.clientWidth}canShowFooter(){return this.arrowsPosition===r.BOTTOM||this.progressMode===n.DOTS||this.progressMode===n.NUMBERS}goTo(t){this.current!==t&&(this.scrollingTo=t,this.itemsContainer.scroll({left:this.items[t].offsetLeft,behavior:"smooth"}))}componentDidLoad(){this.itemsContainer=this.hostElement.querySelector(".z-carousel-items-container"),this.itemsContainer&&(this.items=Array.from(this.itemsContainer.querySelectorAll(":scope > li")),this.single&&this.setIntersectionObserver(),this.itemsContainer.addEventListener("scroll",this.checkNavigationValidity.bind(this),{passive:!0}),this.checkNavigationValidity())}render(){return this.isLoading?i(e,null,this.label&&i("div",{class:"heading-4 z-carousel-title"},this.label),i("div",{style:{height:`${this.ghostLoadingHeight}px`}},i("z-ghost-loading",null),i("div",{class:"loading-items-container"},i("slot",null)))):i(e,null,i("div",{class:"z-carousel-container"},this.label&&i("div",{class:"heading-4 z-carousel-title"},this.label),i("div",{class:"z-carousel-wrapper"},this.arrowsPosition===r.OVER&&i("z-button",{size:a.SMALL,"data-direction":"prev",icon:"chevron-left",onClick:this.onPrev.bind(this),disabled:!this.canNavigatePrev}),i("ul",{class:"z-carousel-items-container"},i("slot",null)),this.arrowsPosition===r.OVER&&i("z-button",{size:a.SMALL,"data-direction":"next",icon:"chevron-right",onClick:this.onNext.bind(this),disabled:!this.canNavigateNext}))),this.canShowFooter()&&i("div",{class:"z-carousel-footer"},this.arrowsPosition===r.BOTTOM&&i("z-button",{size:a.SMALL,variant:l.TERTIARY,icon:"arrow-simple-left-filled",onClick:this.onPrev.bind(this),disabled:!this.canNavigatePrev}),this.progressMode===n.DOTS&&this.single&&this.items&&i("div",{class:"dots-progress"},this.items.map(((t,s)=>i("button",{type:"button",class:{current:this.highlightedIndicator===s},onClick:()=>this.goTo(s)},i("z-icon",{name:this.highlightedIndicator===s?"white-circle-filled":"black-circle-filled"}))))),this.progressMode===n.NUMBERS&&this.single&&this.items&&i("div",{class:"numbers-progress interactive-3"},i("span",{class:"current"},this.current+1),i("span",null,"di"),i("span",null,this.items.length)),this.arrowsPosition===r.BOTTOM&&i("z-button",{size:a.SMALL,variant:l.TERTIARY,icon:"arrow-simple-right-filled",onClick:this.onNext.bind(this),disabled:!this.canNavigateNext})))}get hostElement(){return o(this)}static get watchers(){return{current:["onIndexChange"],single:["onSingleModeChange"]}}};c.style='z-carousel{font-family:var(--font-family-sans);font-weight:var(--font-rg);--z-carousel-gutter:0}z-carousel[single],z-carousel[single="true"]{display:flex;flex-direction:column;align-items:center;justify-content:center}z-carousel[single="true"] .z-carousel-container,z-carousel[single] .z-carousel-container{width:fit-content;max-width:100%}z-carousel .loading-items-container{display:none}z-carousel .z-carousel-container{display:flex;flex-direction:column}z-carousel .z-carousel-wrapper{position:relative}z-carousel .z-carousel-title{margin-bottom:var(--space-unit);color:var(--gray800)}z-carousel .z-carousel-items-container{display:flex;max-width:100%;flex-direction:row;margin:0;list-style:none;-ms-overflow-style:none;overflow-x:scroll;padding-inline-start:0;scroll-snap-type:x mandatory;scrollbar-width:none;}z-carousel .z-carousel-items-container::-webkit-scrollbar{display:none}z-carousel .z-carousel-items-container>*:not(:last-child){margin-right:var(--z-carousel-gutter)}z-carousel[single="true"] .z-carousel-items-container>*:not(:last-child),z-carousel[single] .z-carousel-items-container>*:not(:last-child){margin-right:0}z-carousel .z-carousel-items-container>li{scroll-snap-align:center}z-button[data-direction]{--z-icon-width:32px;--z-icon-height:32px;position:absolute;bottom:50%;transform:translateY(50%)}z-button[data-direction="next"]{right:0}z-carousel .z-carousel-footer{display:flex;flex-direction:row;align-items:center;justify-content:center;margin-top:var(--space-unit)}z-carousel .z-carousel-footer .numbers-progress,z-carousel .z-carousel-footer .dots-progress{display:flex;align-items:center;justify-content:center}z-carousel .z-carousel-footer .dots-progress button{display:flex;align-items:center;padding:0;border:none;margin:0;background-color:transparent}z-carousel .z-carousel-footer .dots-progress button:not(.current){cursor:pointer}z-carousel .z-carousel-footer .numbers-progress{margin:0 calc(var(--space-unit) / 2);column-gap:calc(var(--space-unit) / 2)}z-carousel .z-carousel-footer .numbers-progress .current{font-weight:var(--font-sb)}z-carousel .z-carousel-footer .dots-progress button.current z-icon{fill:var(--gray800)}z-carousel .z-carousel-footer .dots-progress button:not(.current) z-icon{fill:var(--gray200)}';export{c as z_carousel}

package/dist/web-components-library/{p-2048f7fd.js → p-0b942ef3.js}

@@ -1 +1 @@
-import{r as e,c as t,h as n,H as o,g as s}from"./p-d17ebc2f.js";import{B as i,e as a}from"./p-e1d9785e.js";const r=class{constructor(n){e(this,n),this.colspanChange=t(this,"colspanChange",6),this.sticky=!1,this.showMenu=null,this.isMenuOpen=!1}updateColspan(){this.colspan?this.host.style.gridColumn=`span ${this.colspan}`:this.host.style.removeProperty("grid-column"),this.colspanChange.emit(this.colspan||1)}componentWillLoad(){this.updateColspan()}render(){return n(o,{role:"cell","menu-open":this.isMenuOpen},n("slot",null),this.showMenu&&n("div",{class:"cell--menu-container prevent-expand"},n("z-button",{variant:i.TERTIARY,icon:"contextual-menu",size:a.X_SMALL,ref:e=>this.menuTrigger=e,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),n("z-popover",{ref:e=>this.popoverEl=e,bindTo:this.menuTrigger,onOpenChange:e=>this.isMenuOpen=e.detail.open},n("slot",{name:"contextual-menu"}))))}get host(){return s(this)}static get watchers(){return{colspan:["updateColspan"]}}};r.style=':host{position:relative;display:flex;min-width:128px;box-sizing:border-box;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([show-menu])::after{display:inline-block;height:100%;margin-right:calc(var(--space-unit) * 4);background:transparent;content:"";user-select:none}.cell--menu-container{position:absolute;z-index:1;top:var(--space-unit);right:var(--space-unit)}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{opacity:1;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{opacity:1;pointer-events:all}}';export{r as Z}
+import{r as e,c as t,h as n,H as o,g as s}from"./p-d17ebc2f.js";import{B as i,e as a}from"./p-74a062db.js";const r=class{constructor(n){e(this,n),this.colspanChange=t(this,"colspanChange",6),this.sticky=!1,this.showMenu=null,this.isMenuOpen=!1}updateColspan(){this.colspan?this.host.style.gridColumn=`span ${this.colspan}`:this.host.style.removeProperty("grid-column"),this.colspanChange.emit(this.colspan||1)}componentWillLoad(){this.updateColspan()}render(){return n(o,{role:"cell","menu-open":this.isMenuOpen},n("slot",null),this.showMenu&&n("div",{class:"cell--menu-container prevent-expand"},n("z-button",{variant:i.TERTIARY,icon:"contextual-menu",size:a.X_SMALL,ref:e=>this.menuTrigger=e,onClick:()=>this.popoverEl.open=!this.popoverEl.open}),n("z-popover",{ref:e=>this.popoverEl=e,bindTo:this.menuTrigger,onOpenChange:e=>this.isMenuOpen=e.detail.open},n("slot",{name:"contextual-menu"}))))}get host(){return s(this)}static get watchers(){return{colspan:["updateColspan"]}}};r.style=':host{position:relative;display:flex;min-width:128px;box-sizing:border-box;align-items:center;padding:var(--z-table--cells-padding, calc(var(--space-unit) * 2));background-color:var(--color-surface01);gap:calc(var(--space-unit) * 2) var(--space-unit)}:host([sticky]){position:sticky;z-index:1;top:0;left:0;box-shadow:8px 0 16px -8px var(--shadow-color-base)}:host([show-menu])::after{display:inline-block;height:100%;margin-right:calc(var(--space-unit) * 4);background:transparent;content:"";user-select:none}.cell--menu-container{position:absolute;z-index:1;top:var(--space-unit);right:var(--space-unit)}:host(:not([show-menu])) .cell--menu-container{opacity:0;pointer-events:none}:host(:is([show-menu],[menu-open])) .cell--menu-container,:host([show-menu]) .cell--menu-container:focus-within{opacity:1;pointer-events:all}@media (min-width: 768px) and (hover: hover){:host([show-menu="hover"]) .cell--menu-container{opacity:0;pointer-events:none}:host([show-menu="hover"]:hover) .cell--menu-container{opacity:1;pointer-events:all}}';export{r as Z}

package/dist/web-components-library/{p-5e44e5d6.js → p-0f21c603.js}

@@ -1 +1 @@
-import{r as e,c as t,h as a,H as l}from"./p-d17ebc2f.js";import{Z as d}from"./p-e1d9785e.js";const r=class{constructor(a){e(this,a),this.expand=t(this,"expand",7),this.expandedType=d.NONE,this.expanded=!1}emitOnExpand(){this.expand.emit({expanded:this.expanded})}handleExpand(){this.expanded=!this.expanded,this.emitOnExpand()}renderExpandButton(){return a("z-table-cell",{style:{borderRight:"none"}},this.expandedType==d.EXPANDABLE?a("z-icon",{name:this.expanded?"minus-circled":"plus-circled"}):a("div",{class:"z-icon-placeholder"}))}render(){return a(l,{role:"row",expanded:this.expanded,onClick:e=>{const t=e.target.classList.contains("prevent-expand");this.expandedType===d.EXPANDABLE&&!t&&this.handleExpand()}},this.expandedType!==d.NONE&&this.renderExpandButton(),a("slot",null))}};r.style='z-table-row{display:table-row;font-family:var(--font-family-sans)}z-table-row[expanded-type="expandable"]:hover{cursor:pointer}z-table-row[expanded-type="expandable"]>z-table-cell:first-child,z-table-row[expanded-type="padding"]>z-table-cell:first-child{--z-icon-width:16px;--z-icon-height:16px;width:24px;box-sizing:border-box;padding-right:0;padding-left:16px;fill:var(--gray800);text-align:center;user-select:none}.z-icon-placeholder{width:24px;padding-right:0}z-table-row[expanded-type="expandable"]>z-table-cell:nth-child(2),z-table-row[expanded-type="padding"]>z-table-cell:nth-child(2){padding-left:8px}z-table-row[expanded-type]:hover>z-table-cell:first-child{fill:var(--myz-blue-dark)}z-table-row[expanded]>z-table-cell{border-bottom:none;background-color:var(--gray50)}z-table-row[expanded]+z-table-expanded-row{display:table-row}';export{r as Z}
+import{r as e,c as t,h as a,H as l}from"./p-d17ebc2f.js";import{Z as d}from"./p-74a062db.js";const r=class{constructor(a){e(this,a),this.expand=t(this,"expand",7),this.expandedType=d.NONE,this.expanded=!1}emitOnExpand(){this.expand.emit({expanded:this.expanded})}handleExpand(){this.expanded=!this.expanded,this.emitOnExpand()}renderExpandButton(){return a("z-table-cell",{style:{borderRight:"none"}},this.expandedType==d.EXPANDABLE?a("z-icon",{name:this.expanded?"minus-circled":"plus-circled"}):a("div",{class:"z-icon-placeholder"}))}render(){return a(l,{role:"row",expanded:this.expanded,onClick:e=>{const t=e.target.classList.contains("prevent-expand");this.expandedType===d.EXPANDABLE&&!t&&this.handleExpand()}},this.expandedType!==d.NONE&&this.renderExpandButton(),a("slot",null))}};r.style='z-table-row{display:table-row;font-family:var(--font-family-sans)}z-table-row[expanded-type="expandable"]:hover{cursor:pointer}z-table-row[expanded-type="expandable"]>z-table-cell:first-child,z-table-row[expanded-type="padding"]>z-table-cell:first-child{--z-icon-width:16px;--z-icon-height:16px;width:24px;box-sizing:border-box;padding-right:0;padding-left:16px;fill:var(--gray800);text-align:center;user-select:none}.z-icon-placeholder{width:24px;padding-right:0}z-table-row[expanded-type="expandable"]>z-table-cell:nth-child(2),z-table-row[expanded-type="padding"]>z-table-cell:nth-child(2){padding-left:8px}z-table-row[expanded-type]:hover>z-table-cell:first-child{fill:var(--myz-blue-dark)}z-table-row[expanded]>z-table-cell{border-bottom:none;background-color:var(--gray50)}z-table-row[expanded]+z-table-expanded-row{display:table-row}';export{r as Z}

package/{www/build/p-56b6bdee.entry.js → dist/web-components-library/p-0fdfb35a.entry.js}

@@ -1 +1 @@
-import{r,h as e}from"./p-d17ebc2f.js";import{L as t}from"./p-e1d9785e.js";const i=class{constructor(e){r(this,e),this.ispressed=!1,this.ishighlighted=!1}retrieveClass(){let r="";return this.cardtype===t.REAL?r+="real":this.cardtype===t.TRIAL?r+="trial":this.cardtype===t.TEMP&&(r+="temp"),this.faded?r+=" faded":this.ispressed?r+=" pressed":this.ishighlighted&&(r+=" highlighted"),r}render(){return e("div",{class:this.retrieveClass(),tabindex:"0"},e("slot",null))}};i.style=":host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--accent)}div.faded{border:var(--border-size-medium) solid var(--color-surface02)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";const a=class{constructor(e){r(this,e)}render(){return e("div",null,e("slot",{name:"alert"}),e("slot",{name:"cover"}))}};a.style=":host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}";const o=class{constructor(e){r(this,e)}hadleOnImageError(){this.img=this.defaultimg}render(){return e("img",{class:this.faded&&"faded",onError:this.hadleOnImageError.bind(this),alt:this.titolo,src:this.img})}};o.style="img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}";const s=class{constructor(e){r(this,e),this.allowTooltip=!1}getTitle(){return this.allowTooltip?this.titolo:""}componentDidLoad(){this.elementHasEllipsis()&&(this.allowTooltip=!0)}elementHasEllipsis(){return this.ellipsis.offsetWidth<this.ellipsis.scrollWidth}retrieveClass(){return{real:this.cardtype===t.REAL,trial:this.cardtype===t.TRIAL,temp:this.cardtype===t.TEMP,faded:this.faded}}render(){return e("header",{class:this.retrieveClass()},e("slot",{name:"aria-heading"}),e("span",{class:"card-title",ref:r=>this.ellipsis=r,title:this.getTitle()},this.titolo),e("slot",{name:"icon"}))}};s.style='header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--accent);background-color:var(--accent-lighter)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-surface02)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--accent);border-right:var(--border-size-medium) solid var(--accent);border-left:var(--border-size-medium) solid var(--accent)}';export{i as z_myz_card,a as z_myz_card_body,o as z_myz_card_cover,s as z_myz_card_header}
+import{r,h as e}from"./p-d17ebc2f.js";import{L as t}from"./p-74a062db.js";const a=class{constructor(e){r(this,e),this.ispressed=!1,this.ishighlighted=!1}retrieveClass(){let r="";return this.cardtype===t.REAL?r+="real":this.cardtype===t.TRIAL?r+="trial":this.cardtype===t.TEMP&&(r+="temp"),this.faded?r+=" faded":this.ispressed?r+=" pressed":this.ishighlighted&&(r+=" highlighted"),r}render(){return e("div",{class:this.retrieveClass(),tabindex:"0"},e("slot",null))}};a.style=":host{--card-overflow:hidden}div{display:flex;overflow:var(--card-overflow);width:auto;width:256px;height:522px;box-sizing:border-box;flex-direction:column;border:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius)}div.real,div.trial,div.temp{border-color:var(--accent)}div.faded{border:var(--border-size-medium) solid var(--color-surface02)}div.highlighted{box-shadow:var(--shadow-4);outline:none}div.pressed{box-shadow:var(--shadow-8);outline:none}div:focus{box-shadow:var(--shadow-focus-primary);outline:none}";const i=class{constructor(e){r(this,e)}render(){return e("div",null,e("slot",{name:"alert"}),e("slot",{name:"cover"}))}};i.style=":host{width:auto;height:340px}:host>div{position:relative;display:flex;width:auto;height:340px;align-items:center;justify-content:center}";const o=class{constructor(e){r(this,e)}hadleOnImageError(){this.img=this.defaultimg}render(){return e("img",{class:this.faded&&"faded",onError:this.hadleOnImageError.bind(this),alt:this.titolo,src:this.img})}};o.style="img{display:block;max-width:100%;height:340px;margin:auto;object-fit:cover}img.faded{opacity:0.3}";const s=class{constructor(e){r(this,e),this.allowTooltip=!1}getTitle(){return this.allowTooltip?this.titolo:""}componentDidLoad(){this.elementHasEllipsis()&&(this.allowTooltip=!0)}elementHasEllipsis(){return this.ellipsis.offsetWidth<this.ellipsis.scrollWidth}retrieveClass(){return{real:this.cardtype===t.REAL,trial:this.cardtype===t.TRIAL,temp:this.cardtype===t.TEMP,faded:this.faded}}render(){return e("header",{class:this.retrieveClass()},e("slot",{name:"aria-heading"}),e("span",{class:"card-title",ref:r=>this.ellipsis=r,title:this.getTitle()},this.titolo),e("slot",{name:"icon"}))}};s.style='header{position:relative;display:flex;width:auto;height:calc(var(--space-unit) * 6);flex-direction:row;align-items:flex-start;justify-content:space-between;border-bottom:var(--border-size-medium) solid var(--color-surface03);background-color:var(--color-surface01);border-radius:var(--border-radius) var(--border-radius) var(--border-no-radius) var(--border-no-radius)}slot[name="aria-heading"]::slotted(*){position:absolute;overflow:hidden !important;width:1px !important;height:1px !important;padding:0 !important;border:0 none !important;margin:-1px !important;clip:rect(0, 0, 0, 0) !important;white-space:nowrap !important}header.real,header.trial,header.temp{border-bottom:var(--border-size-medium) solid var(--accent);background-color:var(--accent-lighter)}.card-title{overflow:hidden;height:calc(var(--space-unit) * 2);padding:calc(var(--space-unit) * 2);margin:0;color:var(--color-surface05);font-family:var(--font-family-sans);font-size:12px;font-weight:var(--font-sb);letter-spacing:0.22px;line-height:calc(var(--space-unit) * 2);text-overflow:ellipsis;text-transform:uppercase;white-space:nowrap}.faded{border-bottom:var(--border-size-medium) solid var(--color-surface02)}.faded.real,.faded.trial,.faded.temp{border-top:var(--border-size-medium) solid var(--accent);border-right:var(--border-size-medium) solid var(--accent);border-left:var(--border-size-medium) solid var(--accent)}';export{a as z_myz_card,i as z_myz_card_body,o as z_myz_card_cover,s as z_myz_card_header}

package/dist/web-components-library/p-1286f8d5.entry.js

@@ -0,0 +1 @@
+export{Z as z_table_header}from"./p-a9b6ecb4.js";import"./p-d17ebc2f.js";import"./p-74a062db.js";import"./p-766d9faa.js";import"./p-37037d9d.js";

package/{www/build/p-6471c0c0.entry.js → dist/web-components-library/p-12a80f86.entry.js}

@@ -1 +1 @@
-import{r as t,h as i,H as o,g as s}from"./p-d17ebc2f.js";import{N as n,a as e,g as a,b as r}from"./p-e1d9785e.js";const h=class{constructor(i){t(this,i),this.orientation=n.HORIZONTAL,this.size=e.BIG}get direction(){return this.orientation==n.HORIZONTAL?"Left":"Top"}get dimension(){return this.orientation==n.HORIZONTAL?"Width":"Height"}setChildrenSize(){Array.from(this.host.children).forEach((t=>{t.setAttribute("size",this.size)}))}setChildrenOrientation(){Array.from(this.host.children).forEach((t=>{t.setAttribute("orientation",this.orientation)}))}checkScrollVisible(){this.tabsNav&&(this.canNavigate=this.tabsNav[`scroll${this.dimension}`]>this.tabsNav[`client${this.dimension}`])}checkScrollEnabled(){this.tabsNav&&(this.canNavigateNext=this.tabsNav[`scroll${this.direction}`]+this.tabsNav[`client${this.dimension}`]<this.tabsNav[`scroll${this.dimension}`],this.canNavigatePrev=this.tabsNav[`scroll${this.direction}`]>0)}onTabSelected(t){const i=t.target;Array.from(this.host.children).forEach(((t,o)=>{t!==i?t.removeAttribute("selected"):this.tabFocus=o}))}navigateBackwards(){this.tabsNav.scrollBy({[this.direction.toLowerCase()]:0-this.tabsNav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateForward(){this.tabsNav.scrollBy({[this.direction.toLowerCase()]:this.tabsNav[`scroll${this.direction}`]+this.tabsNav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateThroughTabs(t){const i=Array.from(this.host.children);if(t.key!==a.TAB){if(!this.isArrowNavigation(t))return!0;t.preventDefault(),i[this.tabFocus].querySelector('[role="tab"]').setAttribute("tabindex","-1"),t.key===r.RIGHT&&this.orientation==n.HORIZONTAL||t.key===r.DOWN&&this.orientation==n.VERTICAL?(this.tabFocus++,this.tabFocus>=i.length&&(this.tabFocus=0)):(t.key===r.LEFT&&this.orientation==n.HORIZONTAL||t.key===r.UP&&this.orientation==n.VERTICAL)&&(this.tabFocus--,this.tabFocus<0&&(this.tabFocus=i.length-1)),i[this.tabFocus].querySelector('[role="tab"]').hasAttribute("disabled")?this.navigateThroughTabs(t):(i[this.tabFocus].querySelector('[role="tab"]').setAttribute("tabindex","0"),i[this.tabFocus].querySelector('[role="tab"]').focus())}else i.forEach(((i,o)=>{var s,n;i.hasAttribute("selected")&&"Z-NAVIGATION-TABS"===(null===(n=null===(s=t.target)||void 0===s?void 0:s.offsetParent)||void 0===n?void 0:n.nodeName)&&(this.tabFocus=o)}))}isArrowNavigation(t){return!!Object.keys(r).find((i=>r[i]===t.key))}setTabindex(){var t;const i=Array.from(this.host.children);i.length>0&&(i.forEach(((t,i)=>{var o;t.hasAttribute("aria-selected")&&(this.tabFocus=i),null===(o=t.querySelector('[role="tab"]'))||void 0===o||o.setAttribute("tabindex","-1")})),null===(t=i[this.tabFocus].querySelector('[role="tab"]'))||void 0===t||t.setAttribute("tabindex","0"))}componentWillLoad(){this.tabFocus=0}componentDidRender(){this.setChildrenSize(),this.setChildrenOrientation(),this.checkScrollVisible(),this.setTabindex()}render(){return i(o,{class:{"interactive-2":this.size===e.SMALL,"interactive-1":this.size!==e.SMALL},scrollable:this.canNavigate},this.canNavigate&&i("button",{class:"navigation-button",onClick:this.navigateBackwards.bind(this),tabindex:"-1",disabled:!this.canNavigatePrev},i("z-icon",{name:this.orientation===n.HORIZONTAL?"chevron-left":"chevron-up",width:16,height:16})),i("nav",{role:"tablist","aria-label":this.ariaLabel,ref:t=>this.tabsNav=null!=t?t:this.tabsNav,onScroll:this.checkScrollEnabled.bind(this)},i("slot",null)),this.canNavigate&&i("button",{class:"navigation-button",onClick:this.navigateForward.bind(this),onKeyDown:t=>{this.navigateThroughTabs(t)},tabindex:"-1",disabled:!this.canNavigateNext},i("z-icon",{name:this.orientation===n.HORIZONTAL?"chevron-right":"chevron-down",width:16,height:16})))}get host(){return s(this)}static get watchers(){return{size:["setChildrenSize"],orientation:["setChildrenOrientation"],canNavigate:["checkScrollEnabled"]}}};h.style=':host{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,:host *,::slotted(*){box-sizing:border-box}::-webkit-scrollbar{display:none}.navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background:var(--color-white);border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px rgb(66 69 72 / 40%);cursor:pointer;fill:var(--color-primary01);outline:none}.navigation-button:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary);fill:var(--color-primary01)}.navigation-button:disabled{display:none}nav{display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}:host([orientation="horizontal"]) nav{width:100%}:host([orientation="horizontal"]) .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}:host([orientation="horizontal"]) .navigation-button:first-child{left:0}:host([orientation="horizontal"]) .navigation-button:last-child{right:0}:host([orientation="vertical"]){width:fit-content;flex-direction:column}:host([orientation="vertical"]) nav{height:100%;flex-direction:column;align-items:stretch}:host([orientation="vertical"]) .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}:host([orientation="vertical"]) .navigation-button:first-child{top:0}:host([orientation="vertical"]) .navigation-button:last-child{bottom:0}:host([size="small"][orientation="vertical"]) .navigation-button{height:calc(var(--space-unit) * 4)}';export{h as z_navigation_tabs}
+import{r as t,h as i,H as o,g as s}from"./p-d17ebc2f.js";import{N as n,a as e,g as a,b as r}from"./p-74a062db.js";const h=class{constructor(i){t(this,i),this.orientation=n.HORIZONTAL,this.size=e.BIG}get direction(){return this.orientation==n.HORIZONTAL?"Left":"Top"}get dimension(){return this.orientation==n.HORIZONTAL?"Width":"Height"}setChildrenSize(){Array.from(this.host.children).forEach((t=>{t.setAttribute("size",this.size)}))}setChildrenOrientation(){Array.from(this.host.children).forEach((t=>{t.setAttribute("orientation",this.orientation)}))}checkScrollVisible(){this.tabsNav&&(this.canNavigate=this.tabsNav[`scroll${this.dimension}`]>this.tabsNav[`client${this.dimension}`])}checkScrollEnabled(){this.tabsNav&&(this.canNavigateNext=this.tabsNav[`scroll${this.direction}`]+this.tabsNav[`client${this.dimension}`]<this.tabsNav[`scroll${this.dimension}`],this.canNavigatePrev=this.tabsNav[`scroll${this.direction}`]>0)}onTabSelected(t){const i=t.target;Array.from(this.host.children).forEach(((t,o)=>{t!==i?t.removeAttribute("selected"):this.tabFocus=o}))}navigateBackwards(){this.tabsNav.scrollBy({[this.direction.toLowerCase()]:0-this.tabsNav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateForward(){this.tabsNav.scrollBy({[this.direction.toLowerCase()]:this.tabsNav[`scroll${this.direction}`]+this.tabsNav[`client${this.dimension}`]/2,behavior:"smooth"})}navigateThroughTabs(t){const i=Array.from(this.host.children);if(t.key!==a.TAB){if(!this.isArrowNavigation(t))return!0;t.preventDefault(),i[this.tabFocus].querySelector('[role="tab"]').setAttribute("tabindex","-1"),t.key===r.RIGHT&&this.orientation==n.HORIZONTAL||t.key===r.DOWN&&this.orientation==n.VERTICAL?(this.tabFocus++,this.tabFocus>=i.length&&(this.tabFocus=0)):(t.key===r.LEFT&&this.orientation==n.HORIZONTAL||t.key===r.UP&&this.orientation==n.VERTICAL)&&(this.tabFocus--,this.tabFocus<0&&(this.tabFocus=i.length-1)),i[this.tabFocus].querySelector('[role="tab"]').hasAttribute("disabled")?this.navigateThroughTabs(t):(i[this.tabFocus].querySelector('[role="tab"]').setAttribute("tabindex","0"),i[this.tabFocus].querySelector('[role="tab"]').focus())}else i.forEach(((i,o)=>{var s,n;i.hasAttribute("selected")&&"Z-NAVIGATION-TABS"===(null===(n=null===(s=t.target)||void 0===s?void 0:s.offsetParent)||void 0===n?void 0:n.nodeName)&&(this.tabFocus=o)}))}isArrowNavigation(t){return!!Object.keys(r).find((i=>r[i]===t.key))}setTabindex(){var t;const i=Array.from(this.host.children);i.length>0&&(i.forEach(((t,i)=>{var o;t.hasAttribute("aria-selected")&&(this.tabFocus=i),null===(o=t.querySelector('[role="tab"]'))||void 0===o||o.setAttribute("tabindex","-1")})),null===(t=i[this.tabFocus].querySelector('[role="tab"]'))||void 0===t||t.setAttribute("tabindex","0"))}componentWillLoad(){this.tabFocus=0}componentDidRender(){this.setChildrenSize(),this.setChildrenOrientation(),this.checkScrollVisible(),this.setTabindex()}render(){return i(o,{class:{"interactive-2":this.size===e.SMALL,"interactive-1":this.size!==e.SMALL},scrollable:this.canNavigate},this.canNavigate&&i("button",{class:"navigation-button",onClick:this.navigateBackwards.bind(this),tabindex:"-1",disabled:!this.canNavigatePrev},i("z-icon",{name:this.orientation===n.HORIZONTAL?"chevron-left":"chevron-up",width:16,height:16})),i("nav",{role:"tablist","aria-label":this.ariaLabel,ref:t=>this.tabsNav=null!=t?t:this.tabsNav,onScroll:this.checkScrollEnabled.bind(this)},i("slot",null)),this.canNavigate&&i("button",{class:"navigation-button",onClick:this.navigateForward.bind(this),onKeyDown:t=>{this.navigateThroughTabs(t)},tabindex:"-1",disabled:!this.canNavigateNext},i("z-icon",{name:this.orientation===n.HORIZONTAL?"chevron-right":"chevron-down",width:16,height:16})))}get host(){return s(this)}static get watchers(){return{size:["setChildrenSize"],orientation:["setChildrenOrientation"],canNavigate:["checkScrollEnabled"]}}};h.style=':host{position:relative;z-index:0;display:flex;overflow:hidden;flex-direction:row;font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host,:host *,::slotted(*){box-sizing:border-box}::-webkit-scrollbar{display:none}.navigation-button{position:absolute;z-index:1;display:flex;align-items:center;justify-content:center;padding:0;border:none;margin:0;background:var(--color-white);border-radius:var(--border-no-radius);box-shadow:0 0 4px 1px rgb(66 69 72 / 40%);cursor:pointer;fill:var(--color-primary01);outline:none}.navigation-button:focus:focus-visible{box-shadow:inset var(--shadow-focus-primary);fill:var(--color-primary01)}.navigation-button:disabled{display:none}nav{display:flex;overflow:auto;align-items:center;justify-content:flex-start;scroll-behavior:smooth;scrollbar-width:none}:host([orientation="horizontal"]) nav{width:100%}:host([orientation="horizontal"]) .navigation-button{top:0;width:calc(var(--space-unit) * 4);height:100%}:host([orientation="horizontal"]) .navigation-button:first-child{left:0}:host([orientation="horizontal"]) .navigation-button:last-child{right:0}:host([orientation="vertical"]){width:fit-content;flex-direction:column}:host([orientation="vertical"]) nav{height:100%;flex-direction:column;align-items:stretch}:host([orientation="vertical"]) .navigation-button{left:0;width:100%;height:calc(var(--space-unit) * 4)}:host([orientation="vertical"]) .navigation-button:first-child{top:0}:host([orientation="vertical"]) .navigation-button:last-child{bottom:0}:host([size="small"][orientation="vertical"]) .navigation-button{height:calc(var(--space-unit) * 4)}';export{h as z_navigation_tabs}

package/dist/web-components-library/p-14f41eb8.entry.js

@@ -0,0 +1 @@
+import{r as a,c as o,h as r}from"./p-d17ebc2f.js";import{e as i,_ as t}from"./p-74a062db.js";const s=class{constructor(r){a(this,r),this.toggled=o(this,"toggled",7),this.size=i.BIG,this.isDisabled=!1,this.open=!1,this.highlight=!1,this.variant=t.DEFAULT,this.shadow=!0}onDisabledChange(){this.isDisabled&&(this.open=!1)}onDetailsToggle(){if(this.isDisabled)return this.open=!1,void(this.detailsElm.open=!1);this.open=this.detailsElm.open,this.toggled.emit(this.open)}render(){return r("details",{ref:a=>this.detailsElm=a,onToggle:this.onDetailsToggle.bind(this),open:this.open},r("summary",{tabIndex:this.isDisabled?-1:null,part:"summary"},this.icon&&r("z-icon",{class:"z-accordion-label-icon",name:this.icon}),r("span",{class:"z-accordion-label"},this.label),r("span",{class:"z-accordion-tags"},r("slot",{name:"tag"})),r("z-icon",{class:"z-accordion-chevron",name:this.open?"chevron-up":"chevron-down"})),!this.isDisabled&&r("div",{class:"z-accordion-content"},r("slot",null)))}static get watchers(){return{isDisabled:["onDisabledChange"]}}};s.style=':host,:host *,:host ::slotted(*){box-sizing:border-box}:host{--z-accordion-highlight-color:transparent;--z-accordion-bg:var(--color-surface01);display:block;border-top:var(--border-size-small) solid var(--color-surface03);border-bottom:var(--border-size-small) solid var(--color-surface03);background-color:var(--z-accordion-bg);font-family:var(--font-family-sans);font-weight:var(--font-rg)}:host([variant="background"]){border:var(--border-size-small) solid var(--color-surface03);border-radius:var(--border-radius)}:host([variant="background"][shadow]){box-shadow:var(--shadow-2)}details{background-color:transparent}summary{--summary-x-small-height:32px;--summary-small-height:36px;--summary-big-height:44px;--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit);position:relative;display:flex;height:var(--summary-height);align-items:center;padding:var(--summary-y-padding) var(--space-unit) var(--summary-y-padding) calc(var(--space-unit) * 2);column-gap:var(--space-unit);cursor:pointer;list-style:none}:host([size="x-small"]) summary{--summary-height:var(--summary-x-small-height)}:host([size="small"]) summary{--summary-height:var(--summary-small-height)}:host(:is([size="x-small"],[size="small"])) summary{--summary-y-padding:calc(var(--space-unit) / 2)}:host([variant="background"]) summary{padding-right:calc(var(--space-unit) * 2);border-radius:calc(var(--border-radius) - var(--border-size-small))}:host([is-disabled]) summary{cursor:default}summary:focus:focus-visible{background-color:var(--color-surface03);box-shadow:var(--shadow-focus-primary);outline:none}summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{position:absolute;top:0;left:0;display:block;width:var(--space-unit);height:100%;content:""}:host([highlight]) summary::before,:host([highlight][variant="background"]) .z-accordion-content::before{background-color:var(--z-accordion-highlight-color, transparent)}:host([is-disabled][highlight]) summary::before,:host([is-disabled][highlight][variant="background"]) .z-accordion-content::before{background-color:var(--color-text03)}summary>z-icon{fill:var(--color-text01)}:host([is-disabled]) summary>z-icon{fill:var(--color-text03)}.z-accordion-label{color:var(--color-text01);font-size:var(--font-size-3);font-weight:var(--font-sb)}:host([size="x-small"]) .z-accordion-label{font-size:var(--font-size-2)}:host([size="x-small"]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:16px;--z-icon-height:16px}.z-accordion-tags{display:flex;align-items:center;column-gap:calc(var(--space-unit) / 2)}summary z-icon.z-accordion-chevron{margin-left:auto}.z-accordion-content{position:relative;padding:var(--space-unit) var(--space-unit) calc(var(--space-unit) * 2) calc(var(--space-unit) * 2);font-size:var(--font-size-2);}:host(:is([size="x-small"],[size="small"])) .z-accordion-content{padding-bottom:var(--space-unit)}:host([size="x-small"]) .z-accordion-content{font-size:var(--font-size-1)}:host([variant="background"]) .z-accordion-content{padding-right:calc(var(--space-unit) * 2)}:host([is-disabled]) .z-accordion-label{color:var(--color-text03)}:host([is-disabled]) .z-accordion-tags ::slotted(z-tag[slot="tag"]){--z-tag-bg:var(--color-text03) !important;--z-tag-text-color:var(--color-text-inverse) !important}@media (hover: hover){summary:focus:focus-visible{position:relative;z-index:1}:host(:not([is-disabled])) summary:hover{background-color:var(--color-surface03)}:host(:not([is-disabled])) summary:hover .z-accordion-label{text-decoration:underline}}@media (hover: none){:host([size]) summary{--summary-height:var(--summary-big-height);--summary-y-padding:var(--space-unit)}:host([size]) .z-accordion-label{font-size:var(--font-size-3)}:host([size]) .z-accordion-content{font-size:var(--font-size-2)}:host([size]) :is(.z-accordion-label-icon,.z-accordion-chevron){--z-icon-width:18px;--z-icon-height:18px}}z-accordion+z-accordion{border-top:none}z-accordion[variant="background"]+z-accordion[variant="background"]{border-radius:0}z-accordion[variant="background"]:first-of-type:not(:last-of-type){border-bottom-left-radius:0;border-bottom-right-radius:0}z-accordion[variant="background"]+z-accordion[variant="background"]:last-of-type{border-bottom-left-radius:var(--border-radius);border-bottom-right-radius:var(--border-radius)}z-accordion[variant="background"]:first-of-type:not(:last-of-type)::part(summary){border-bottom-left-radius:0;border-bottom-right-radius:0}z-accordion[variant="background"]+z-accordion[variant="background"]::part(summary){border-radius:0}z-accordion[variant="background"]+z-accordion[variant="background"]:last-of-type:not([open])::part(summary){border-bottom-left-radius:calc(var(--border-radius) - var(--border-size-small));border-bottom-right-radius:calc(var(--border-radius) - var(--border-size-small))}';export{s as z_accordion}

package/{www/build/p-bf2b7873.entry.js → dist/web-components-library/p-18b15bde.entry.js}

@@ -1 +1 @@
-import{r as t,c as e,h as i,H as a,g as s}from"./p-d17ebc2f.js";import{s as n}from"./p-e1d9785e.js";import{m as r}from"./p-b497e33e.js";import{h as o}from"./p-e43e61ac.js";import"./p-112455b1.js";const l=class{constructor(i){t(this,i),this.toastClose=e(this,"toastClose",7),this.pauseonfocusloss=!0,this.isdraggable=!0,this.draggablepercentage=80,this.isCloseEventCalled=!1}watchPropIsdraggable(t){t?this.sliderManager.get("pan").set({enable:!0}):this.sliderManager.get("pan").set({enable:!1})}watchPropAutoclose(t){clearTimeout(this.timeoutHandle),this.startClosingTimeout(t)}watchPropPauseonfocusloss(t){this.autoclose&&(t?document.addEventListener("visibilitychange",this.visibilityChangeEventHandler):document.removeEventListener("visibilitychange",this.visibilityChangeEventHandler))}emitToastClose(t){this.timeoutHandle=null,this.elapsedTime=null,this.hostElement.classList.add(t),this.toastClose.emit()}componentWillLoad(){this.isMobile=window.innerWidth<=r,this.validateAutoclose(),this.percentage=0}componentDidLoad(){this.isTextLong=this.detectWrap()||this.toastText.offsetHeight>20,this.startTime=Date.now(),this.autoclose&&this.pauseonfocusloss&&document.addEventListener("visibilitychange",this.visibilityChangeEventHandler),this.isdraggable&&this.handleSlideOutDragAnimation()}visibilityChangeEventHandler(){"hidden"===document.visibilityState?this.timeoutHandle&&this.onBlur():this.elapsedTime&&this.onFocus()}validateAutoclose(){this.autoclose||this.closebutton||console.error("At least one between autoclose and closebutton must be present")}mapSlideOutClass(){switch(this.transition){case n.SLIDE_IN_DOWN:return n.SLIDE_OUT_UP;case n.SLIDE_IN_UP:return n.SLIDE_OUT_DOWN;case n.SLIDE_IN_LEFT:return n.SLIDE_OUT_RIGHT;case n.SLIDE_IN_RIGHT:return n.SLIDE_OUT_LEFT}}calculateDraggedPercentage(t){const e=this.hostElement.getBoundingClientRect();return Math.round(100*t.deltaX/e.width)}handleSlideOutDragAnimation(){this.sliderManager=new o(this.hostElement),this.sliderManager.get("pan").set({direction:o.DIRECTION_HORIZONTAL}),this.sliderManager.on("pan",(t=>{this.percentage=this.calculateDraggedPercentage(t),this.hostElement.style.transition="none",this.hostElement.classList.remove(this.transition);const e={translate:`translateX(${this.percentage}%)`,translateBack:"translateX(0)"};this.hostElement.style.opacity=100-Math.abs(this.percentage)+"%",t.eventType!==o.DIRECTION_LEFT&&t.eventType!==o.DIRECTION_RIGHT||(this.hostElement.style.transform=e.translate,Math.abs(this.percentage)>this.draggablepercentage&&!this.isCloseEventCalled&&(this.isCloseEventCalled=!0,this.emitToastClose(t.direction===o.DIRECTION_LEFT?"slide-out-left":"slide-out-right"))),t.isFinal&&Math.abs(this.percentage)<this.draggablepercentage&&(this.hostElement.style.transform=e.translateBack,this.hostElement.style.transition="all 1s",this.hostElement.style.opacity="100%",this.percentage=0)}))}onFocus(){let t=this.autoclose;this.elapsedTime&&(t=this.autoclose-this.elapsedTime),t>0&&this.startClosingTimeout(t)}onBlur(){this.elapsedTime=Date.now()-this.startTime,clearTimeout(this.timeoutHandle)}startClosingTimeout(t){this.timeoutHandle=window.setTimeout((()=>this.emitToastClose(this.mapSlideOutClass())),t)}detectWrap(){const t=this.container.offsetWidth,e=this.container.children;let i=0;for(let t=0;t<e.length;t++)i+=e[t].offsetWidth;return i>t}renderText(){return i("div",{id:"text",ref:t=>this.toastText=t},i("span",{class:"title"},this.heading),i("span",{class:"message"},this.message))}renderButton(){return i("div",{id:"button"},i("slot",{name:"button"}))}renderCloseIcon(){if(this.closebutton)return i("div",{id:"icon"},i("z-icon",{tabIndex:0,name:"multiply-circled",width:15,height:15,onClick:()=>this.emitToastClose(this.mapSlideOutClass()),onKeyPress:t=>{32!=t.keyCode&&13!=t.keyCode||(t.preventDefault(),this.emitToastClose(this.mapSlideOutClass()))}}))}renderContainer(){return i("div",{tabIndex:0,id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong},ref:t=>this.container=t},this.renderText(),this.renderButton(),this.renderCloseIcon())}renderMobileContainer(){return i("div",{id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong,"mobile-wrapped":this.isTextLong}},i("div",{id:"flex-container",ref:t=>this.container=t},this.renderText(),this.renderButton()),this.renderCloseIcon())}render(){return i(a,{style:{"--percentuale":`${this.percentage}%`},class:this.transition?this.transition:n.SLIDE_IN_DOWN,onAnimationEnd:t=>{this.autoclose&&t.animationName.includes("slidein")&&this.startClosingTimeout(this.autoclose),t.animationName.includes("slideout")&&this.hostElement.parentNode.removeChild(this.hostElement)}},this.isMobile?this.renderMobileContainer():this.renderContainer())}get hostElement(){return s(this)}static get watchers(){return{isdraggable:["watchPropIsdraggable"],autoclose:["watchPropAutoclose"],pauseonfocusloss:["watchPropPauseonfocusloss"]}}};l.style=":host{display:inline-block;width:100vw;min-width:200px;--percentuale:0}:host(.slide-in-left){animation:slideinleft 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-right){animation:slideinright 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-down){animation:slideindown 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-up){animation:slideinup 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-left){animation:slideoutleft 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-right){animation:slideoutright 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-down){animation:slideoutdown 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-up){animation:slideoutup 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}@keyframes slideinleft{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes slideinright{0%{transform:translateX(-100%)}100%{transform:translateX(0)}}@keyframes slideinup{0%{opacity:0;transform:translateY(100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideindown{0%{opacity:0;transform:translateY(-100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideoutleft{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(-100%)}}@keyframes slideoutright{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(100%)}}@keyframes slideoutup{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(-100%)}}@keyframes slideoutdown{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(100%)}}:host>#external-container{display:flex;min-height:52px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);border-radius:4px;box-shadow:var(--shadow-3);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px}:host>#external-container.mobile-wrapped>#icon{align-self:flex-start}:host>#external-container.several-lines-padding{padding:calc(var(--space-unit) * 2)}:host>#external-container>#flex-container{display:flex;width:100%;flex-wrap:wrap;align-items:center;justify-content:space-between}:host>#external-container #text{margin-right:calc(var(--space-unit) * 2);color:var(--color-white);letter-spacing:0.16px;line-height:20px;text-align:left}:host>#external-container #text>.title{margin-right:4px;font-weight:600}:host>#external-container.mobile-wrapped #button ::slotted(z-button){margin-top:calc(var(--space-unit) * 2)}:host>#external-container #icon{margin-left:calc(var(--space-unit) * 2);cursor:pointer;fill:var(--color-white)}:host>#external-container.dark{background:var(--gray800)}:host>#external-container.light{background:var(--color-background)}:host>#external-container.light #icon,:host>#external-container.warning #text,:host>#external-container.warning #icon{fill:var(--color-icon01)}:host>#external-container.light #text,:host>#external-container.warning #text{color:var(--gray800)}:host>#external-container.accent{background:var(--color-primary01)}:host>#external-container.error{background:var(--color-error-default)}:host>#external-container.success{background:var(--color-success-default)}:host>#external-container.warning{background:var(--color-warning-default)}@media only screen and (min-width: 768px){:host{width:unset;max-width:50vw}:host>#external-container>#flex-container{flex-wrap:nowrap}:host>#external-container #text{width:100%}}@media only screen and (min-width: 1366px){:host{width:unset;max-width:33vw}}";export{l as z_toast_notification}
+import{r as t,c as i,h as e,H as a,g as s}from"./p-d17ebc2f.js";import{s as n}from"./p-74a062db.js";import{m as r}from"./p-37037d9d.js";import{h as o}from"./p-e43e61ac.js";import"./p-112455b1.js";const l=class{constructor(e){t(this,e),this.toastClose=i(this,"toastClose",7),this.pauseonfocusloss=!0,this.isdraggable=!0,this.draggablepercentage=80,this.isCloseEventCalled=!1}watchPropIsdraggable(t){t?this.sliderManager.get("pan").set({enable:!0}):this.sliderManager.get("pan").set({enable:!1})}watchPropAutoclose(t){clearTimeout(this.timeoutHandle),this.startClosingTimeout(t)}watchPropPauseonfocusloss(t){this.autoclose&&(t?document.addEventListener("visibilitychange",this.visibilityChangeEventHandler):document.removeEventListener("visibilitychange",this.visibilityChangeEventHandler))}emitToastClose(t){this.timeoutHandle=null,this.elapsedTime=null,this.hostElement.classList.add(t),this.toastClose.emit()}componentWillLoad(){this.isMobile=window.innerWidth<=r,this.validateAutoclose(),this.percentage=0}componentDidLoad(){this.isTextLong=this.detectWrap()||this.toastText.offsetHeight>20,this.startTime=Date.now(),this.autoclose&&this.pauseonfocusloss&&document.addEventListener("visibilitychange",this.visibilityChangeEventHandler),this.isdraggable&&this.handleSlideOutDragAnimation()}visibilityChangeEventHandler(){"hidden"===document.visibilityState?this.timeoutHandle&&this.onBlur():this.elapsedTime&&this.onFocus()}validateAutoclose(){this.autoclose||this.closebutton||console.error("At least one between autoclose and closebutton must be present")}mapSlideOutClass(){switch(this.transition){case n.SLIDE_IN_DOWN:return n.SLIDE_OUT_UP;case n.SLIDE_IN_UP:return n.SLIDE_OUT_DOWN;case n.SLIDE_IN_LEFT:return n.SLIDE_OUT_RIGHT;case n.SLIDE_IN_RIGHT:return n.SLIDE_OUT_LEFT}}calculateDraggedPercentage(t){const i=this.hostElement.getBoundingClientRect();return Math.round(100*t.deltaX/i.width)}handleSlideOutDragAnimation(){this.sliderManager=new o(this.hostElement),this.sliderManager.get("pan").set({direction:o.DIRECTION_HORIZONTAL}),this.sliderManager.on("pan",(t=>{this.percentage=this.calculateDraggedPercentage(t),this.hostElement.style.transition="none",this.hostElement.classList.remove(this.transition);const i={translate:`translateX(${this.percentage}%)`,translateBack:"translateX(0)"};this.hostElement.style.opacity=100-Math.abs(this.percentage)+"%",t.eventType!==o.DIRECTION_LEFT&&t.eventType!==o.DIRECTION_RIGHT||(this.hostElement.style.transform=i.translate,Math.abs(this.percentage)>this.draggablepercentage&&!this.isCloseEventCalled&&(this.isCloseEventCalled=!0,this.emitToastClose(t.direction===o.DIRECTION_LEFT?"slide-out-left":"slide-out-right"))),t.isFinal&&Math.abs(this.percentage)<this.draggablepercentage&&(this.hostElement.style.transform=i.translateBack,this.hostElement.style.transition="all 1s",this.hostElement.style.opacity="100%",this.percentage=0)}))}onFocus(){let t=this.autoclose;this.elapsedTime&&(t=this.autoclose-this.elapsedTime),t>0&&this.startClosingTimeout(t)}onBlur(){this.elapsedTime=Date.now()-this.startTime,clearTimeout(this.timeoutHandle)}startClosingTimeout(t){this.timeoutHandle=window.setTimeout((()=>this.emitToastClose(this.mapSlideOutClass())),t)}detectWrap(){const t=this.container.offsetWidth,i=this.container.children;let e=0;for(let t=0;t<i.length;t++)e+=i[t].offsetWidth;return e>t}renderText(){return e("div",{id:"text",ref:t=>this.toastText=t},e("span",{class:"title"},this.heading),e("span",{class:"message"},this.message))}renderButton(){return e("div",{id:"button"},e("slot",{name:"button"}))}renderCloseIcon(){if(this.closebutton)return e("div",{id:"icon"},e("z-icon",{tabIndex:0,name:"multiply-circled",width:15,height:15,onClick:()=>this.emitToastClose(this.mapSlideOutClass()),onKeyPress:t=>{32!=t.keyCode&&13!=t.keyCode||(t.preventDefault(),this.emitToastClose(this.mapSlideOutClass()))}}))}renderContainer(){return e("div",{tabIndex:0,id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong},ref:t=>this.container=t},this.renderText(),this.renderButton(),this.renderCloseIcon())}renderMobileContainer(){return e("div",{id:"external-container",class:{[this.type]:!!this.type,"several-lines-padding":this.isTextLong,"mobile-wrapped":this.isTextLong}},e("div",{id:"flex-container",ref:t=>this.container=t},this.renderText(),this.renderButton()),this.renderCloseIcon())}render(){return e(a,{style:{"--percentuale":`${this.percentage}%`},class:this.transition?this.transition:n.SLIDE_IN_DOWN,onAnimationEnd:t=>{this.autoclose&&t.animationName.includes("slidein")&&this.startClosingTimeout(this.autoclose),t.animationName.includes("slideout")&&this.hostElement.parentNode.removeChild(this.hostElement)}},this.isMobile?this.renderMobileContainer():this.renderContainer())}get hostElement(){return s(this)}static get watchers(){return{isdraggable:["watchPropIsdraggable"],autoclose:["watchPropAutoclose"],pauseonfocusloss:["watchPropPauseonfocusloss"]}}};l.style=":host{display:inline-block;width:100vw;min-width:200px;--percentuale:0}:host(.slide-in-left){animation:slideinleft 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-right){animation:slideinright 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-down){animation:slideindown 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-in-up){animation:slideinup 1s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-left){animation:slideoutleft 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-right){animation:slideoutright 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-down){animation:slideoutdown 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}:host(.slide-out-up){animation:slideoutup 0.5s cubic-bezier(0.25, 0.1, 0.25, 0.1);animation-fill-mode:forwards}@keyframes slideinleft{0%{transform:translateX(100%)}100%{transform:translateX(0)}}@keyframes slideinright{0%{transform:translateX(-100%)}100%{transform:translateX(0)}}@keyframes slideinup{0%{opacity:0;transform:translateY(100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideindown{0%{opacity:0;transform:translateY(-100%)}100%{opacity:1;transform:translateY(0)}}@keyframes slideoutleft{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(-100%)}}@keyframes slideoutright{0%{opacity:calc(100% - var(--percentuale));transform:translateX(var(--percentuale))}100%{opacity:0;transform:translateX(100%)}}@keyframes slideoutup{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(-100%)}}@keyframes slideoutdown{0%{opacity:1;transform:translateY(var(--percentuale))}100%{opacity:0;transform:translateY(100%)}}:host>#external-container{display:flex;min-height:52px;box-sizing:border-box;align-items:center;justify-content:space-between;padding:calc(var(--space-unit) * 1) calc(var(--space-unit) * 2);border-radius:4px;box-shadow:var(--shadow-3);font-family:var(--font-family-sans);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px}:host>#external-container.mobile-wrapped>#icon{align-self:flex-start}:host>#external-container.several-lines-padding{padding:calc(var(--space-unit) * 2)}:host>#external-container>#flex-container{display:flex;width:100%;flex-wrap:wrap;align-items:center;justify-content:space-between}:host>#external-container #text{margin-right:calc(var(--space-unit) * 2);color:var(--color-white);letter-spacing:0.16px;line-height:20px;text-align:left}:host>#external-container #text>.title{margin-right:4px;font-weight:600}:host>#external-container.mobile-wrapped #button ::slotted(z-button){margin-top:calc(var(--space-unit) * 2)}:host>#external-container #icon{margin-left:calc(var(--space-unit) * 2);cursor:pointer;fill:var(--color-white)}:host>#external-container.dark{background:var(--gray800)}:host>#external-container.light{background:var(--color-background)}:host>#external-container.light #icon,:host>#external-container.warning #text,:host>#external-container.warning #icon{fill:var(--color-icon01)}:host>#external-container.light #text,:host>#external-container.warning #text{color:var(--gray800)}:host>#external-container.accent{background:var(--color-primary01)}:host>#external-container.error{background:var(--color-error-default)}:host>#external-container.success{background:var(--color-success-default)}:host>#external-container.warning{background:var(--color-warning-default)}@media only screen and (min-width: 768px){:host{width:unset;max-width:50vw}:host>#external-container>#flex-container{flex-wrap:nowrap}:host>#external-container #text{width:100%}}@media only screen and (min-width: 1366px){:host{width:unset;max-width:33vw}}";export{l as z_toast_notification}