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

package/dist/types/components/z-modal/index.d.ts

@@ -1,9 +1,10 @@
-import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
+import { EventEmitter } from "../../stencil-public-runtime";
+import { ReactiveControllerHost } from "../../utils/reactive-controller";
 /**
  * @slot modalCloseButton - slot for custom close button
  * @slot modalContent - slot for the content of the modal
  */
-export declare class ZModal implements ComponentInterface {
+export declare class ZModal extends ReactiveControllerHost {
     /** unique id */
     modalid: string;
     /** title text (optional) */
@@ -21,6 +22,7 @@ export declare class ZModal implements ComponentInterface {
     /** if true, the page scroll is locked when the modal is open (optional, default is true) */
     lockPageScroll?: boolean;
     private dialog;
+    private focusTrapController;
     host: HTMLZModalElement;
     /** emitted on close button click, returns modalid */
     modalClose: EventEmitter;
@@ -38,14 +40,6 @@ export declare class ZModal implements ComponentInterface {
     open(): Promise<void>;
     /** close modal */
     close(): Promise<void>;
-    /**
-     * Get a list of focusable elements in the dialog.
-     * Remove elements with `display: none` from the list, because they're not focusable.
-     *
-     * N.B. The list is built on the assumption that elements inside shadow root are placed ALL before the `modalContent` slot.
-     * Adding focusable elements after the `modalContent` slot would break the order of elements in the list.
-     */
-    private get focusableElements();
     handleKeyDown(e: KeyboardEvent): void;
     private closeButtonSlot;
     private handleEscape;

package/dist/types/components/z-offcanvas/index.d.ts

@@ -1,9 +1,11 @@
-import { ComponentInterface, EventEmitter } from "../../stencil-public-runtime";
+import { EventEmitter } from "../../stencil-public-runtime";
 import { OffCanvasVariant, TransitionDirection } from "../../beans";
+import { ReactiveControllerHost } from "../../utils/reactive-controller";
 /**
  * @slot canvasContent - Slot for the offcanvas content.
  */
-export declare class ZOffcanvas implements ComponentInterface {
+export declare class ZOffcanvas extends ReactiveControllerHost {
+    host: HTMLZOffcanvasElement;
     /**
      * Offcanvas variant.
      * - `overlay`: The offcanvas covers the page content putting an overlay.
@@ -22,53 +24,29 @@ export declare class ZOffcanvas implements ComponentInterface {
     /**
      * Skip the opening transition when the offcanvas is already open at the first render.
      * @deprecated This prop is not needed anymore, the component will automatically skip the transition
-     *  when it starts with `open` set to `true`. Only exists for Typescript backward compatibility.
+     * when it starts with `open` set to `true`. Only exists for Typescript backward compatibility.
      */
     skipLoadAnimation: boolean;
-    /** Whether to show the backdrop when the offcanvas is open. Default: true */
+    /** Whether to show the backdrop when the offcanvas is open and variant is not `pushcontent`. Default: `true` */
     showBackdrop: boolean;
     /** emitted when `open` prop changes */
-    canvasOpenStatusChanged: EventEmitter;
+    canvasOpenStatusChanged: EventEmitter<boolean>;
     /** Used to skip the opening transition when the offcanvas is already open at the first render. */
     private skipAnimation;
-    private canvasContainer;
     private canvasContent;
-    private allFocusableElements;
-    private previouslyFocusedElement;
+    private focusTrapController;
     /**
-     * Returns all focusable elements inside the offcanvas content.
-     * Elements are considered focusable if:
-     * - They are not disabled
-     * - They are visible in the layout
-     * - They have a non-negative tabIndex or an explicit tabindex="0"
-     */
-    private getFocusableElements;
-    /**
-     * Keeps keyboard navigation trapped inside the offcanvas when it is open.
-     * Implements circular tab navigation:
-     * - If Shift + Tab is pressed on the first focusable element, move focus to the last.
-     * - If Tab is pressed on the last focusable element, move focus to the first.
-     */
-    private trapFocus;
-    /**
-     * Handles keyboard interactions when the offcanvas is open.
-     * - Closes the offcanvas when the Escape key is pressed.
-     * - Traps focus inside the component when the Tab key is used.
+     * Handles Escape and wrap-around Tab navigation at the focus boundaries.
      */
     handleKeyDown(event: KeyboardEvent): void;
     /**
-     * Stop the event default behavior and propagation when the offcanvas is closed.
+     * Lock the page scroll when the offcanvas is open and unlock it when the offcanvas is closed.
      */
-    stopEvent(event: Event): void;
-    /**
-     * Hide the body overflow when the offcanvas is open.
-     */
-    private handlePageOverflow;
+    private handlePageScroll;
     onOpenChanged(): void;
     componentWillLoad(): void;
-    componentDidLoad(): void;
     componentDidRender(): void;
-    connectedCallback(): void;
+    componentDidLoad(): void;
     disconnectedCallback(): void;
     render(): HTMLZOffcanvasElement;
 }

package/dist/types/components.d.ts

@@ -5,12 +5,12 @@
  * It contains typing information for all components that exist in this project.
  */
 import { HTMLStencilElement, JSXBase } from "./stencil-public-runtime";
-import { AccordionVariant, AvatarSize, BookCardDeprecatedVariant, BookCardVariant, BreadcrumbHomepageVariant, BreadcrumbPath, BreadcrumbPathStyle, ButtonSize, ButtonType, ButtonVariant, CardVariant, CarouselArrowsPosition, CarouselProgressMode, ColorPickerPalette, ComboItem, ControlSize, CoverHeroContentPosition, CoverHeroVariant, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, IconPosition, InfoRevealPosition, InputStatus, InputType, LabelPosition, ListDividerType, ListSize, ListType, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariant, PopoverPosition, SearchbarItem, SelectItem, SkipToContentLink, SortDirection, ThemeVariant, ToastNotification, ToastNotificationPosition, ToastNotificationTransition, TransitionDirection, TreeListItem, VisibilityCondition, ZAriaAlertMode, ZChipType, ZDatePickerMode, ZFileUploadType, ZRangePickerMode, ZSectionTitleDividerPosition } from "./beans";
+import { AccordionVariant, AvatarSize, BookCardDeprecatedVariant, BookCardVariant, BreadcrumbHomepageVariant, BreadcrumbPath, BreadcrumbPathStyle, ButtonSize, ButtonType, ButtonVariant, CardVariant, CarouselArrowsPosition, CarouselProgressMode, ColorPickerPalette, ComboItem, ControlSize, CoverHeroContentPosition, CoverHeroVariant, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, IconPosition, InfoRevealPosition, InputStatus, InputType, LabelPosition, ListDividerType, ListSize, ListType, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariant, Orientation, PopoverPosition, SearchbarItem, SelectItem, SkipToContentLink, SortDirection, ThemeVariant, ToastNotification, ToastNotificationPosition, ToastNotificationTransition, TransitionDirection, TreeListItem, VisibilityCondition, ZAriaAlertMode, ZChipType, ZDatePickerMode, ZFileUploadType, ZRangePickerMode, ZSectionTitleDividerPosition } from "./beans";
 import { AlertType, LicenseType } from "./beans/index";
 import { ZFileUploadError } from "./components/file-upload/z-file-upload/index";
 import { ListItem } from "./beans/index.js";
 import { IconName } from "./constants/iconset";
-export { AccordionVariant, AvatarSize, BookCardDeprecatedVariant, BookCardVariant, BreadcrumbHomepageVariant, BreadcrumbPath, BreadcrumbPathStyle, ButtonSize, ButtonType, ButtonVariant, CardVariant, CarouselArrowsPosition, CarouselProgressMode, ColorPickerPalette, ComboItem, ControlSize, CoverHeroContentPosition, CoverHeroVariant, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, IconPosition, InfoRevealPosition, InputStatus, InputType, LabelPosition, ListDividerType, ListSize, ListType, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariant, PopoverPosition, SearchbarItem, SelectItem, SkipToContentLink, SortDirection, ThemeVariant, ToastNotification, ToastNotificationPosition, ToastNotificationTransition, TransitionDirection, TreeListItem, VisibilityCondition, ZAriaAlertMode, ZChipType, ZDatePickerMode, ZFileUploadType, ZRangePickerMode, ZSectionTitleDividerPosition } from "./beans";
+export { AccordionVariant, AvatarSize, BookCardDeprecatedVariant, BookCardVariant, BreadcrumbHomepageVariant, BreadcrumbPath, BreadcrumbPathStyle, ButtonSize, ButtonType, ButtonVariant, CardVariant, CarouselArrowsPosition, CarouselProgressMode, ColorPickerPalette, ComboItem, ControlSize, CoverHeroContentPosition, CoverHeroVariant, DictionaryData, DividerOrientation, DividerSize, ExpandableListButtonAlign, ExpandableListStyle, IconPosition, InfoRevealPosition, InputStatus, InputType, LabelPosition, ListDividerType, ListSize, ListType, NavigationTabsOrientation, NavigationTabsSize, NotificationType, OffCanvasVariant, Orientation, PopoverPosition, SearchbarItem, SelectItem, SkipToContentLink, SortDirection, ThemeVariant, ToastNotification, ToastNotificationPosition, ToastNotificationTransition, TransitionDirection, TreeListItem, VisibilityCondition, ZAriaAlertMode, ZChipType, ZDatePickerMode, ZFileUploadType, ZRangePickerMode, ZSectionTitleDividerPosition } from "./beans";
 export { AlertType, LicenseType } from "./beans/index";
 export { ZFileUploadError } from "./components/file-upload/z-file-upload/index";
 export { ListItem } from "./beans/index.js";
@@ -1140,6 +1140,66 @@ export namespace Components {
          */
         "status"?: InputStatus;
     }
+    /**
+     * Input range component.
+     */
+    interface ZInputRange {
+        /**
+          * Whether the input range is disabled.
+          * @default false
+         */
+        "disabled": boolean;
+        /**
+          * The aria label of the input range. for accessibility. Not necessary if the `label` prop is set.
+         */
+        "htmlAriaLabel": string;
+        /**
+          * ID of the input range.
+          * @default `z-input-range-${randomId()}`
+         */
+        "htmlId": string;
+        /**
+          * The label of the input range. When `orientation` is set to `vertical`, the label is not visible but used as `aria-label`, unless `htmlAriaLabel` is provided.
+         */
+        "label": string;
+        /**
+          * The greatest value in the range of permitted values.
+          * @default 100
+         */
+        "max": number;
+        /**
+          * The lowest value in the range of permitted values.
+          * @default 0
+         */
+        "min": number;
+        /**
+          * The orientation of the input range.
+         */
+        "orientation": Orientation;
+        /**
+          * Whether to show `min` and `max` values of the input range. Only visible with the `horizontal` orientation.
+          * @default false
+         */
+        "showEdges": boolean;
+        /**
+          * The size of the input range. Default: `ControlSize.BIG`
+         */
+        "size": ControlSize.BIG;
+        /**
+          * The step value for the input range.
+          * @default 1
+         */
+        "step": number;
+        /**
+          * The value of the input range.
+          * @default 0
+         */
+        "value": number;
+        /**
+          * The position of the tooltip displaying the current value. Defaults to `top` for horizontal orientation and `left` for vertical orientation. May be necessary to adjust this prop when the input range is close to the edges of the screen, to prevent the tooltip from showing out of the screen or in an unintended position due to auto adjustment. For example, for a horizontal input range close to the top of the screen, you may want to set this prop to `bottom`.
+         */
+        "valuePosition": PopoverPosition.TOP | PopoverPosition.BOTTOM | PopoverPosition.LEFT | PopoverPosition.RIGHT;
+    }
     interface ZList {
         /**
           * [optional] type of the list marker for each element
@@ -1718,7 +1778,7 @@ export namespace Components {
          */
         "open": boolean;
         /**
-          * Whether to show the backdrop when the offcanvas is open. Default: true
+          * Whether to show the backdrop when the offcanvas is open and variant is not `pushcontent`. Default: `true`
           * @default true
          */
         "showBackdrop": boolean;
@@ -2611,6 +2671,10 @@ export interface ZInputCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLZInputElement;
 }
+export interface ZInputRangeCustomEvent<T> extends CustomEvent<T> {
+    detail: T;
+    target: HTMLZInputRangeElement;
+}
 export interface ZListElementCustomEvent<T> extends CustomEvent<T> {
     detail: T;
     target: HTMLZListElementElement;
@@ -3163,6 +3227,27 @@ declare global {
         prototype: HTMLZInputMessageElement;
         new (): HTMLZInputMessageElement;
     };
+    interface HTMLZInputRangeElementEventMap {
+        "rangeInput": number;
+        "rangeChange": number;
+    }
+    /**
+     * Input range component.
+     */
+    interface HTMLZInputRangeElement extends Components.ZInputRange, HTMLStencilElement {
+        addEventListener<K extends keyof HTMLZInputRangeElementEventMap>(type: K, listener: (this: HTMLZInputRangeElement, ev: ZInputRangeCustomEvent<HTMLZInputRangeElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLZInputRangeElementEventMap>(type: K, listener: (this: HTMLZInputRangeElement, ev: ZInputRangeCustomEvent<HTMLZInputRangeElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
+    }
+    var HTMLZInputRangeElement: {
+        prototype: HTMLZInputRangeElement;
+        new (): HTMLZInputRangeElement;
+    };
     interface HTMLZListElement extends Components.ZList, HTMLStencilElement {
     }
     var HTMLZListElement: {
@@ -3463,7 +3548,7 @@ declare global {
         new (): HTMLZNotificationElement;
     };
     interface HTMLZOffcanvasElementEventMap {
-        "canvasOpenStatusChanged": any;
+        "canvasOpenStatusChanged": boolean;
     }
     interface HTMLZOffcanvasElement extends Components.ZOffcanvas, HTMLStencilElement {
         addEventListener<K extends keyof HTMLZOffcanvasElementEventMap>(type: K, listener: (this: HTMLZOffcanvasElement, ev: ZOffcanvasCustomEvent<HTMLZOffcanvasElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
@@ -3920,6 +4005,7 @@ declare global {
         "z-info-reveal": HTMLZInfoRevealElement;
         "z-input": HTMLZInputElement;
         "z-input-message": HTMLZInputMessageElement;
+        "z-input-range": HTMLZInputRangeElement;
         "z-list": HTMLZListElement;
         "z-list-element": HTMLZListElementElement;
         "z-list-group": HTMLZListGroupElement;
@@ -5192,6 +5278,82 @@ declare namespace LocalJSX {
          */
         "status"?: InputStatus;
     }
+    /**
+     * Input range component.
+     */
+    interface ZInputRange {
+        /**
+          * Whether the input range is disabled.
+          * @default false
+         */
+        "disabled"?: boolean;
+        /**
+          * The `id` of a `<form>` element to associate this element with.
+         */
+        "form"?: string;
+        /**
+          * The aria label of the input range. for accessibility. Not necessary if the `label` prop is set.
+         */
+        "htmlAriaLabel"?: string;
+        /**
+          * ID of the input range.
+          * @default `z-input-range-${randomId()}`
+         */
+        "htmlId"?: string;
+        /**
+          * The label of the input range. When `orientation` is set to `vertical`, the label is not visible but used as `aria-label`, unless `htmlAriaLabel` is provided.
+         */
+        "label"?: string;
+        /**
+          * The greatest value in the range of permitted values.
+          * @default 100
+         */
+        "max"?: number;
+        /**
+          * The lowest value in the range of permitted values.
+          * @default 0
+         */
+        "min"?: number;
+        /**
+          * The name of the element, used when submitting an HTML form.
+         */
+        "name"?: string;
+        /**
+          * Emitted when the value of the input range has changed (`change` native event).
+         */
+        "onRangeChange"?: (event: ZInputRangeCustomEvent<number>) => void;
+        /**
+          * Emitted when the value of the input range is being changed (`input` native event).
+         */
+        "onRangeInput"?: (event: ZInputRangeCustomEvent<number>) => void;
+        /**
+          * The orientation of the input range.
+         */
+        "orientation"?: Orientation;
+        /**
+          * Whether to show `min` and `max` values of the input range. Only visible with the `horizontal` orientation.
+          * @default false
+         */
+        "showEdges"?: boolean;
+        /**
+          * The size of the input range. Default: `ControlSize.BIG`
+         */
+        "size"?: ControlSize.BIG;
+        /**
+          * The step value for the input range.
+          * @default 1
+         */
+        "step"?: number;
+        /**
+          * The value of the input range.
+          * @default 0
+         */
+        "value"?: number;
+        /**
+          * The position of the tooltip displaying the current value. Defaults to `top` for horizontal orientation and `left` for vertical orientation. May be necessary to adjust this prop when the input range is close to the edges of the screen, to prevent the tooltip from showing out of the screen or in an unintended position due to auto adjustment. For example, for a horizontal input range close to the top of the screen, you may want to set this prop to `bottom`.
+         */
+        "valuePosition"?: PopoverPosition.TOP | PopoverPosition.BOTTOM | PopoverPosition.LEFT | PopoverPosition.RIGHT;
+    }
     interface ZList {
         /**
           * [optional] type of the list marker for each element
@@ -5831,14 +5993,14 @@ declare namespace LocalJSX {
         /**
           * emitted when `open` prop changes
          */
-        "onCanvasOpenStatusChanged"?: (event: ZOffcanvasCustomEvent<any>) => void;
+        "onCanvasOpenStatusChanged"?: (event: ZOffcanvasCustomEvent<boolean>) => void;
         /**
           * Whether the offcanvas is open. Default: false
           * @default false
          */
         "open"?: boolean;
         /**
-          * Whether to show the backdrop when the offcanvas is open. Default: true
+          * Whether to show the backdrop when the offcanvas is open and variant is not `pushcontent`. Default: `true`
           * @default true
          */
         "showBackdrop"?: boolean;
@@ -6996,6 +7158,20 @@ declare namespace LocalJSX {
         "status": InputStatus;
         "disabled": boolean;
     }
+    interface ZInputRangeAttributes {
+        "disabled": boolean;
+        "htmlAriaLabel": string;
+        "htmlId": string;
+        "label": string;
+        "max": number;
+        "min": number;
+        "orientation": Orientation;
+        "showEdges": boolean;
+        "size": ControlSize.BIG;
+        "step": number;
+        "value": number;
+        "valuePosition": PopoverPosition.TOP | PopoverPosition.BOTTOM | PopoverPosition.LEFT | PopoverPosition.RIGHT;
+    }
     interface ZListAttributes {
         "size": ListSize;
         "listType": ListType;
@@ -7387,6 +7563,7 @@ declare namespace LocalJSX {
         "z-info-reveal": Omit<ZInfoReveal, keyof ZInfoRevealAttributes> & { [K in keyof ZInfoReveal & keyof ZInfoRevealAttributes]?: ZInfoReveal[K] } & { [K in keyof ZInfoReveal & keyof ZInfoRevealAttributes as `attr:${K}`]?: ZInfoRevealAttributes[K] } & { [K in keyof ZInfoReveal & keyof ZInfoRevealAttributes as `prop:${K}`]?: ZInfoReveal[K] };
         "z-input": Omit<ZInput, keyof ZInputAttributes> & { [K in keyof ZInput & keyof ZInputAttributes]?: ZInput[K] } & { [K in keyof ZInput & keyof ZInputAttributes as `attr:${K}`]?: ZInputAttributes[K] } & { [K in keyof ZInput & keyof ZInputAttributes as `prop:${K}`]?: ZInput[K] };
         "z-input-message": Omit<ZInputMessage, keyof ZInputMessageAttributes> & { [K in keyof ZInputMessage & keyof ZInputMessageAttributes]?: ZInputMessage[K] } & { [K in keyof ZInputMessage & keyof ZInputMessageAttributes as `attr:${K}`]?: ZInputMessageAttributes[K] } & { [K in keyof ZInputMessage & keyof ZInputMessageAttributes as `prop:${K}`]?: ZInputMessage[K] };
+        "z-input-range": Omit<ZInputRange, keyof ZInputRangeAttributes> & { [K in keyof ZInputRange & keyof ZInputRangeAttributes]?: ZInputRange[K] } & { [K in keyof ZInputRange & keyof ZInputRangeAttributes as `attr:${K}`]?: ZInputRangeAttributes[K] } & { [K in keyof ZInputRange & keyof ZInputRangeAttributes as `prop:${K}`]?: ZInputRange[K] };
         "z-list": Omit<ZList, keyof ZListAttributes> & { [K in keyof ZList & keyof ZListAttributes]?: ZList[K] } & { [K in keyof ZList & keyof ZListAttributes as `attr:${K}`]?: ZListAttributes[K] } & { [K in keyof ZList & keyof ZListAttributes as `prop:${K}`]?: ZList[K] };
         "z-list-element": Omit<ZListElement, keyof ZListElementAttributes> & { [K in keyof ZListElement & keyof ZListElementAttributes]?: ZListElement[K] } & { [K in keyof ZListElement & keyof ZListElementAttributes as `attr:${K}`]?: ZListElementAttributes[K] } & { [K in keyof ZListElement & keyof ZListElementAttributes as `prop:${K}`]?: ZListElement[K] };
         "z-list-group": Omit<ZListGroup, keyof ZListGroupAttributes> & { [K in keyof ZListGroup & keyof ZListGroupAttributes]?: ZListGroup[K] } & { [K in keyof ZListGroup & keyof ZListGroupAttributes as `attr:${K}`]?: ZListGroupAttributes[K] } & { [K in keyof ZListGroup & keyof ZListGroupAttributes as `prop:${K}`]?: ZListGroup[K] };
@@ -7526,6 +7703,10 @@ declare module "@stencil/core" {
             "z-info-reveal": LocalJSX.IntrinsicElements["z-info-reveal"] & JSXBase.HTMLAttributes<HTMLZInfoRevealElement>;
             "z-input": LocalJSX.IntrinsicElements["z-input"] & JSXBase.HTMLAttributes<HTMLZInputElement>;
             "z-input-message": LocalJSX.IntrinsicElements["z-input-message"] & JSXBase.HTMLAttributes<HTMLZInputMessageElement>;
+            /**
+             * Input range component.
+             */
+            "z-input-range": LocalJSX.IntrinsicElements["z-input-range"] & JSXBase.HTMLAttributes<HTMLZInputRangeElement>;
             "z-list": LocalJSX.IntrinsicElements["z-list"] & JSXBase.HTMLAttributes<HTMLZListElement>;
             "z-list-element": LocalJSX.IntrinsicElements["z-list-element"] & JSXBase.HTMLAttributes<HTMLZListElementElement>;
             "z-list-group": LocalJSX.IntrinsicElements["z-list-group"] & JSXBase.HTMLAttributes<HTMLZListGroupElement>;

package/dist/types/utils/focus-trap-controller.d.ts

@@ -0,0 +1,53 @@
+import { createFocusTrap, type Options as FocusTrapOptions } from "focus-trap";
+import { ReactiveController, ReactiveControllerHost } from "./reactive-controller";
+/**
+ * Focus trap controller configuration plus the options for `focus-trap` library.
+ * @see https://github.com/focus-trap/focus-trap#trap-configuration-options
+ */
+type FocusTrapControllerConfig = {
+    /** Root element of the trap. Defaults to the host element if not provided. */
+    getTrapRoot?: () => HTMLElement;
+    /** List of tabbable elements or custom function to override the default retrieval. */
+    tabbableElements?: HTMLElement[] | (() => HTMLElement[]);
+    /** Function to determine if the trap is active. */
+    isActive: () => boolean;
+} & FocusTrapOptions;
+/**
+ * Reactive controller for focus trapping.
+ *
+ * It creates and syncs a `focus-trap` instance based on host state,
+ * manages wrap-around Tab navigation, and cleans up on disconnect.
+ */
+export declare class FocusTrapController implements ReactiveController {
+    private readonly config;
+    /** Instance of the component using the controller. */
+    private host;
+    /** Root element of the component using the controller (the same provided by `@Element` decorator). */
+    private hostElement;
+    /** Instance of the focus trap. */
+    focusTrap: ReturnType<typeof createFocusTrap> | undefined;
+    constructor(host: ReactiveControllerHost, config: FocusTrapControllerConfig);
+    private get trapRoot();
+    private getTabbableElements;
+    private focusFirstTrapElement;
+    private focusLastTrapElement;
+    /** Create focus trap and activate/deactivate it according to `isActive()`. */
+    sync(): void;
+    /**
+     * Handle manual wrap-around on TAB key when focus is on the first/last tabbable element.
+     * This complements the trap to support nested shadow DOM tabbables reliably.
+     *
+     * @example Manual wrap-around handling in a component:
+     * ```ts
+     * @Listen("keydown", {target: "document"})
+     * handleKeyDown(event: KeyboardEvent): void {
+     *   this.focusTrapController.handleWrapTab(event);
+     * }
+     * ```
+     */
+    handleWrapTab(event: KeyboardEvent): void;
+    /** Deactivate trap and restore focus management state. */
+    deactivate(): void;
+    hostDisconnected(): void;
+}
+export {};

package/dist/types/utils/reactive-controller.d.ts

@@ -0,0 +1,39 @@
+import { ComponentInterface } from "../stencil-public-runtime";
+/**
+ * Contract implemented by composable controllers.
+ * Each method mirrors a host lifecycle hook.
+ * @see Stencil doc on composition pattern https://stenciljs.com/docs/extends#composition
+ */
+export interface ReactiveController {
+    hostConnected?(): any;
+    hostDisconnected?(): any;
+    hostWillLoad?(): Promise<void> | void;
+    hostDidLoad?(): any;
+    hostWillRender?(): Promise<void> | void;
+    hostDidRender?(): any;
+    hostWillUpdate?(): Promise<void> | void;
+    hostDidUpdate?(): any;
+}
+/**
+ * Minimal host implementation to register and invoke controllers across Stencil lifecycle hooks.
+ *
+ * Usage:
+ * - extend this class in a component
+ * - register controllers in the constructor via `addController(...)`
+ * - call `super.*` when overriding lifecycle hooks used by controllers
+ */
+export declare class ReactiveControllerHost implements ComponentInterface {
+    private readonly controllers;
+    /** Register a controller instance for lifecycle delegation. */
+    addController(controller: ReactiveController): void;
+    /** Unregister a controller instance from lifecycle delegation. */
+    removeController(controller: ReactiveController): void;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    componentWillLoad(): void;
+    componentDidLoad(): void;
+    componentWillRender(): void;
+    componentDidRender(): void;
+    componentWillUpdate(): void;
+    componentDidUpdate(): void;
+}

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

@@ -36,6 +36,11 @@ export declare function isSelectorValid(selector: string): boolean;
  * @param descendant Descendant element
  */
 export declare function containsElement(ancestor: HTMLElement, descendant: Node): boolean;
+/**
+ * Get the currently active element, descending into open shadow roots.
+ * @param root Document or ShadowRoot to start from.
+ */
+export declare function getDeepActiveElement(root?: Document | ShadowRoot): Element | null;
 /** Get the parent of passed element, accounting for shadow DOM.
  * @param element The element whose parent is to be found.
  */
@@ -46,6 +51,11 @@ export declare function getParentElement(element: Element): Element | null;
  * @param container The container to check against, which must be the nearest scrollable ancestor.
  */
 export declare function isElementVisibleInContainer(element: HTMLElement, container: HTMLElement): boolean;
+/**
+ * Get tabbable elements in the passed root element, including descendants inside shadow roots.
+ * Returned list is sorted by light DOM order first and by shadow DOM order inside each host.
+ */
+export declare function getTabbableElements(root: HTMLElement): HTMLElement[];
 /**
  * Find the nearest containing block ancestor of an element.
  * The containing block is determined based on the element's `position` value:

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

@@ -1 +1,2 @@
-import{c as aa}from"./p-B0bOjMSb.js";export{_ as AccordionVariant,o as AlertType,A as AvatarSize,Y as BookCardDeprecatedVariant,X as BookCardVariant,V as BreadcrumbHomepageVariant,U as BreadcrumbPathStyle,d as ButtonSize,c as ButtonType,B as ButtonVariant,C as CardVariant,Q as CarouselArrowsPosition,R as CarouselProgressMode,a0 as ColorPickerPalette,e as ControlSize,M as CoverHeroContentPosition,J as CoverHeroVariant,p as Device,h as DividerOrientation,D as DividerSize,j as ExpandableListButtonAlign,E as ExpandableListStyle,$ as IconPosition,H 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,P as PopoverPosition,S as SortDirection,T as ThemeVariant,q as ToastNotification,s as ToastNotificationPosition,r as ToastNotificationTransition,u as TransitionDirection,W as VisibilityCondition,t as ZAriaAlertMode,w as ZChipType,y as ZDatePickerMode,z as ZDatePickerModeValue,F as ZDatePickerPosition,v as ZFileUploadType,G as ZRangePickerMode,x as ZSectionTitleDividerPosition,Z as ZTableRowExpandedType}from"./p-BKCj6NR2.js";export{I as ICONS}from"./p-AwzX9V8L.js";import"./p-Q-tWjk7P.js";const ia={colorFromId:aa};export{ia as Utils}
+import{c as aa}from"./p-C8pbzcmM.js";export{$ as AccordionVariant,o as AlertType,A as AvatarSize,_ as BookCardDeprecatedVariant,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,a1 as ColorPickerPalette,e as ControlSize,Q as CoverHeroContentPosition,M as CoverHeroVariant,p as Device,h as DividerOrientation,D as DividerSize,j as ExpandableListButtonAlign,E as ExpandableListStyle,a0 as IconPosition,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,v as OffCanvasVariant,O as Orientation,P as PopoverPosition,S as SortDirection,T as ThemeVariant,q as ToastNotification,s as ToastNotificationPosition,r as ToastNotificationTransition,u as TransitionDirection,X as VisibilityCondition,t 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-B3nR3-Jw.js";export{I as ICONS}from"./p-AwzX9V8L.js";import"./p-Q-tWjk7P.js";const ia={colorFromId:aa};export{ia as Utils};
+//# sourceMappingURL=index.esm.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.esm.js","sources":["src/index.ts"],"sourcesContent":["import {colorFromId} from \"./utils/utils\";\n\nconst UTILS = {\n  colorFromId,\n};\n\nexport * from \"./beans\";\nexport * from \"./components\";\nexport {ICONS, IconName} from \"./constants/iconset\";\nexport {UTILS as Utils};\n"],"names":[],"mappings":";;;;;AAEA,MAAM,KAAK,GAAG;IACZ,WAAW;;;;;"}

package/dist/web-components-library/p-0a10c7d7.entry.js

@@ -0,0 +1,2 @@
+import{r as t,h as n}from"./p-BEHxru6n.js";const a=()=>`*:focus{box-shadow:var(--shadow-focus-primary);outline:none !important}ul{overflow:hidden;width:auto;height:auto;padding:0;margin:0 calc(var(--space-unit) * 2);color:var(--color-primary01);font-family:var(--font-family-sans);list-style:none}ul>li{padding-left:10px;text-indent:-10px}ul>li>a{display:block;padding-top:calc(var(--space-unit) * 0.5);color:var(--color-primary01);font-size:14px;font-weight:var(--font-sb);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}ul>li>a::before{padding-right:5px;content:"•"}ul>li>span{padding:0 calc(var(--space-unit) * 2);color:var(--color-surface04);font-size:14px;font-weight:var(--font-rg);letter-spacing:0.16px;line-height:calc(var(--space-unit) * 2.5);text-decoration:none}`;const r=class{constructor(n){t(this,n);this.renderList=this.renderList.bind(this)}handleSpaceKeyPress(t,n){if(t.keyCode==32||t.keyCode==13){t.preventDefault();window.open(n,"_blank")}}formatListContent(t){const{value:a,isLink:r,url:i}=t;if(!r){return n("span",null,a)}return n("a",{role:"button",onKeyPress:t=>this.handleSpaceKeyPress(t,i),href:i,target:"_blank"},a)}renderList(t){return t.map((t=>n("li",null,this.formatListContent(t))))}render(){return n("ul",{key:"a300da3bf2b9c83f59a6464b82fb2448f97555f9"},this.renderList(JSON.parse(this.listdata)))}};r.style=a();export{r as z_myz_card_list};
+//# sourceMappingURL=p-0a10c7d7.entry.js.map

package/dist/web-components-library/p-0a10c7d7.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZMyzCardList","constructor","hostRef","this","renderList","bind","handleSpaceKeyPress","e","url","keyCode","preventDefault","window","open","formatListContent","data","value","isLink","h","role","onKeyPress","href","target","dataArray","map","render","key","JSON","parse","listdata"],"sources":["src/snowflakes/myz/card/z-myz-card-list/styles.css?tag=z-myz-card-list&encapsulation=shadow","src/snowflakes/myz/card/z-myz-card-list/index.tsx"],"sourcesContent":["*:focus {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none !important;\n}\n\nul {\n  overflow: hidden;\n  width: auto;\n  height: auto;\n  padding: 0;\n  margin: 0 calc(var(--space-unit) * 2);\n  color: var(--color-primary01);\n  font-family: var(--font-family-sans);\n  list-style: none;\n}\n\nul > li {\n  padding-left: 10px;\n  text-indent: -10px;\n}\n\nul > li > a {\n  display: block;\n  padding-top: calc(var(--space-unit) * 0.5);\n  color: var(--color-primary01);\n  font-size: 14px;\n  font-weight: var(--font-sb);\n  letter-spacing: 0.16px;\n  line-height: calc(var(--space-unit) * 2.5);\n  text-decoration: none;\n}\n\nul > li > a::before {\n  padding-right: 5px;\n  content: \"•\";\n}\n\nul > li > span {\n  padding: 0 calc(var(--space-unit) * 2);\n  color: var(--color-surface04);\n  font-size: 14px;\n  font-weight: var(--font-rg);\n  letter-spacing: 0.16px;\n  line-height: calc(var(--space-unit) * 2.5);\n  text-decoration: none;\n}\n","import {Component, ComponentInterface, Prop, h} from \"@stencil/core\";\nimport {Action} from \"../../../../beans\";\n\n@Component({\n  tag: \"z-myz-card-list\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZMyzCardList implements ComponentInterface {\n  /** list data stringified array */\n  @Prop()\n  listdata: string;\n\n  constructor() {\n    this.renderList = this.renderList.bind(this);\n  }\n\n  private handleSpaceKeyPress(e: KeyboardEvent, url: string): void {\n    if (e.keyCode == 32 || e.keyCode == 13) {\n      e.preventDefault();\n      window.open(url, \"_blank\");\n    }\n  }\n\n  private formatListContent(data: Action): HTMLAnchorElement {\n    const {value, isLink, url} = data;\n    if (!isLink) {\n      return <span>{value}</span>;\n    }\n\n    return (\n      <a\n        role=\"button\"\n        onKeyPress={(e: KeyboardEvent) => this.handleSpaceKeyPress(e, url)}\n        href={url}\n        target=\"_blank\"\n      >\n        {value}\n      </a>\n    );\n  }\n\n  private renderList(dataArray: Action[]): HTMLLIElement[] {\n    return dataArray.map((data: Action) => {\n      return <li>{this.formatListContent(data)}</li>;\n    });\n  }\n\n  render(): HTMLUListElement {\n    return <ul>{this.renderList(JSON.parse(this.listdata))}</ul>;\n  }\n}\n"],"mappings":"2CAAA,MAAMA,EAAY,IAAM,qvB,MCQXC,EAAY,MAKvB,WAAAC,CAAAC,G,UACEC,KAAKC,WAAaD,KAAKC,WAAWC,KAAKF,KACxC,CAEO,mBAAAG,CAAoBC,EAAkBC,GAC5C,GAAID,EAAEE,SAAW,IAAMF,EAAEE,SAAW,GAAI,CACtCF,EAAEG,iBACFC,OAAOC,KAAKJ,EAAK,S,EAIb,iBAAAK,CAAkBC,GACxB,MAAMC,MAACA,EAAKC,OAAEA,EAAMR,IAAEA,GAAOM,EAC7B,IAAKE,EAAQ,CACX,OAAOC,EAAA,YAAOF,E,CAGhB,OACEE,EAAA,KACEC,KAAK,SACLC,WAAaZ,GAAqBJ,KAAKG,oBAAoBC,EAAGC,GAC9DY,KAAMZ,EACNa,OAAO,UAENN,E,CAKC,UAAAX,CAAWkB,GACjB,OAAOA,EAAUC,KAAKT,GACbG,EAAA,UAAKd,KAAKU,kBAAkBC,K,CAIvC,MAAAU,GACE,OAAOP,EAAA,MAAAQ,IAAA,4CAAKtB,KAAKC,WAAWsB,KAAKC,MAAMxB,KAAKyB,W","ignoreList":[]}

package/dist/web-components-library/p-0de3e2fa.entry.js

@@ -0,0 +1,2 @@
+import{r as a,h as e,H as t}from"./p-BEHxru6n.js";const i=()=>`:host{position:relative;display:flex;width:100%;max-width:100%;box-sizing:border-box;flex-direction:row;padding:0;margin:0;font-family:var(--font-family-sans);font-weight:var(--font-rg);list-style:none}@media (min-width: 768px){:host{padding:0 calc(var(--space-unit) * 2)}}`;const o=class{constructor(e){a(this,e)}render(){return e(t,{key:"8a2d0549f14aae5e0ff1cf1d0bb019a86bc1b8e1",role:"navigation"},e("slot",{key:"1ae9a9e7fec88737934d443d07b20eb354cfd4ae"}))}};o.style=i();export{o as z_stepper};
+//# sourceMappingURL=p-0de3e2fa.entry.js.map

package/dist/web-components-library/p-0de3e2fa.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZStepper","render","h","Host","key","role"],"sources":["src/components/z-stepper/styles.css?tag=z-stepper&encapsulation=shadow","src/components/z-stepper/index.tsx"],"sourcesContent":[":host {\n  position: relative;\n  display: flex;\n  width: 100%;\n  max-width: 100%;\n  box-sizing: border-box;\n  flex-direction: row;\n  padding: 0;\n  margin: 0;\n  font-family: var(--font-family-sans);\n  font-weight: var(--font-rg);\n  list-style: none;\n}\n\n@media (min-width: 768px) {\n  :host {\n    padding: 0 calc(var(--space-unit) * 2);\n  }\n}\n","import {Component, ComponentInterface, Host, h} from \"@stencil/core\";\n\n/**\n * @slot - slot for `z-stepper-item`\n */\n@Component({\n  tag: \"z-stepper\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZStepper implements ComponentInterface {\n  render(): HTMLSlotElement {\n    return (\n      <Host role=\"navigation\">\n        <slot />\n      </Host>\n    );\n  }\n}\n"],"mappings":"kDAAA,MAAMA,EAAY,IAAM,oR,MCUXC,EAAQ,M,yBACnB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2CAACC,KAAK,cACTH,EAAA,QAAAE,IAAA,6C","ignoreList":[]}

package/dist/web-components-library/p-0eb833b6.entry.js

@@ -0,0 +1,2 @@
+import{r as e,h as t,H as o,d as r}from"./p-BEHxru6n.js";import{M as a,Q as i}from"./p-B3nR3-Jw.js";const n=()=>`:host{--cover-hero-overlay:linear-gradient(270deg, #0000 0%, #000000e6 100%);--cover-hero-text-color:var(--color-text-inverse);display:block;overflow:hidden}:host,*{box-sizing:border-box}:host .main-container{position:relative;width:100%;align-items:baseline}:host .content-container{color:var(--cover-hero-text-color);fill:var(--cover-hero-text-color)}:host .main-container .cover-container{position:relative;width:100%;padding-top:calc(100% / (var(--cover-hero-aspect-ratio, var(--image-aspect-ratio, 16/9))));background-color:var(--gray600)}::slotted([slot="cover"]){position:absolute;display:block;width:100%;height:100%;inset:0;object-fit:cover;object-position:top center}::slotted(z-info-reveal){position:absolute;z-index:1;right:var(--grid-margin);bottom:var(--grid-margin)}:host([variant="overlay"]:not([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container{height:100%}:host([variant="overlay"]:not([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container .cover-container{position:absolute;z-index:-1;height:100%;padding:0}:host([variant="overlay"]) .main-container .cover-container::after{position:absolute;top:0;left:0;width:100%;height:100%;background:var(--cover-hero-overlay);content:""}:host([variant="overlay"]:is([preserve-aspect-ratio=""],[preserve-aspect-ratio="true"])) .main-container .content-container{position:absolute;inset:0}:host([variant="overlay"]) .main-container .content-container{height:100%;padding:var(--grid-margin)}:host([variant="stacked"]){--cover-hero-text-color:var(--color-default-text)}:host([variant="stacked"]) .content-container ::slotted(*){padding:var(--grid-margin) 0}`;const s=class{constructor(t){e(this,t);this.variant=a.OVERLAY;this.contentPosition=i.TOP;this.preserveAspectRatio=true}onImgLoad({target:e}){if(e instanceof Image&&e.closest("[slot=cover]")){const t=e.naturalWidth/e.naturalHeight;this.host.style.setProperty("--image-aspect-ratio",t.toString())}}renderContent(){return t("div",{class:"content-container"},t("slot",{name:"content"}))}render(){return t(o,{key:"bb147f3b614268218fba165360012031572ec76b"},this.variant===a.STACKED&&this.contentPosition===i.TOP&&this.renderContent(),t("div",{key:"94c697c41b4d98ea9f5be00634a3de1fd214ea72",class:"main-container"},t("div",{key:"e1a181735381dbc2472085c7e1d7082e1564185a",class:"cover-container"},t("slot",{key:"1692cfa7f6a9ee926a262e04e8912a72f5a95cca",name:"cover"})),t("slot",{key:"c13a059c162d85e46d3f116a8b1fd9e3a6e363f7",name:"info-reveal"}),this.variant===a.OVERLAY&&this.renderContent()),this.variant===a.STACKED&&this.contentPosition===i.BOTTOM&&this.renderContent())}get host(){return r(this)}};s.style=n();export{s as z_cover_hero};
+//# sourceMappingURL=p-0eb833b6.entry.js.map

package/dist/web-components-library/p-0eb833b6.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZCoverHero","constructor","hostRef","this","variant","CoverHeroVariant","OVERLAY","contentPosition","CoverHeroContentPosition","TOP","preserveAspectRatio","onImgLoad","target","Image","closest","ratio","naturalWidth","naturalHeight","host","style","setProperty","toString","renderContent","h","class","name","render","Host","key","STACKED","BOTTOM"],"sources":["src/components/z-cover-hero/styles.css?tag=z-cover-hero&encapsulation=shadow","src/components/z-cover-hero/index.tsx"],"sourcesContent":[":host {\n  /**\n   * @prop --cover-hero-overlay: overlay color of the cover hero (CSS `background` property). **Default**: `linear-gradient(270deg, #0000 0%, #000000e6 100%)`.\n   * @prop --cover-hero-text-color: color of the text.\n   * @prop --cover-hero-aspect-ratio: aspect ratio to use for the image. You can pass a fraction or a number representing the ratio. **Default**: the intrinsic aspect ratio of the slotted image or `16/9`.\n   */\n  --cover-hero-overlay: linear-gradient(270deg, #0000 0%, #000000e6 100%);\n  --cover-hero-text-color: var(--color-text-inverse);\n  --cover-hero-aspect-ratio: ;\n\n  display: block;\n  overflow: hidden;\n}\n\n:host,\n* {\n  box-sizing: border-box;\n}\n\n:host .main-container {\n  position: relative;\n  width: 100%;\n  align-items: baseline;\n}\n\n:host .content-container {\n  color: var(--cover-hero-text-color);\n  fill: var(--cover-hero-text-color);\n}\n\n:host .main-container .cover-container {\n  position: relative;\n  width: 100%;\n  padding-top: calc(100% / (var(--cover-hero-aspect-ratio, var(--image-aspect-ratio, 16/9))));\n  background-color: var(--gray600);\n}\n\n::slotted([slot=\"cover\"]) {\n  position: absolute;\n  display: block;\n  width: 100%;\n  height: 100%;\n  inset: 0;\n  object-fit: cover;\n  object-position: top center;\n}\n\n::slotted(z-info-reveal) {\n  position: absolute;\n  z-index: 1;\n  right: var(--grid-margin);\n  bottom: var(--grid-margin);\n}\n\n/* Variant overlay */\n:host([variant=\"overlay\"]:not([preserve-aspect-ratio=\"\"], [preserve-aspect-ratio=\"true\"])) .main-container {\n  height: 100%;\n}\n\n:host([variant=\"overlay\"]:not([preserve-aspect-ratio=\"\"], [preserve-aspect-ratio=\"true\"]))\n  .main-container\n  .cover-container {\n  position: absolute;\n  z-index: -1;\n  height: 100%;\n  padding: 0;\n}\n\n:host([variant=\"overlay\"]) .main-container .cover-container::after {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  background: var(--cover-hero-overlay);\n  content: \"\";\n}\n\n:host([variant=\"overlay\"]:is([preserve-aspect-ratio=\"\"], [preserve-aspect-ratio=\"true\"]))\n  .main-container\n  .content-container {\n  position: absolute;\n  inset: 0;\n}\n\n:host([variant=\"overlay\"]) .main-container .content-container {\n  height: 100%;\n  padding: var(--grid-margin);\n}\n\n/* Variant stacked */\n:host([variant=\"stacked\"]) {\n  --cover-hero-text-color: var(--color-default-text);\n}\n\n:host([variant=\"stacked\"]) .content-container ::slotted(*) {\n  padding: var(--grid-margin) 0;\n}\n","import {Component, ComponentInterface, Element, Host, Listen, Prop, h} from \"@stencil/core\";\nimport {CoverHeroContentPosition, CoverHeroVariant} from \"../../beans\";\n\n/**\n * Cover hero component.\n * Component to display a hero image with content.\n *\n * @slot cover - slot for the cover image.\n * @slot content - slot for the content.\n * @slot info-reveal - slot for the info reveal.\n */\n@Component({\n  tag: \"z-cover-hero\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZCoverHero implements ComponentInterface {\n  @Element() host: HTMLZCoverHeroElement;\n\n  /**\n   * Cover hero variant. Can be `OVERLAY` or `STACKED`.\n   */\n  @Prop({reflect: true})\n  variant: CoverHeroVariant = CoverHeroVariant.OVERLAY;\n\n  /**\n   * Vertical content position (for `STACKED` variant).\n   */\n  @Prop({reflect: true})\n  contentPosition: CoverHeroContentPosition = CoverHeroContentPosition.TOP;\n\n  /**\n   * Whether to keep the image aspect ratio.\n   * If set to `false`, the cssprop `--cover-hero-aspect-ratio` will not affect the component's size;\n   * instead, the height of the component follows the content's one.\n   * Note: it may be necessary to set a min and/or max height to the component.\n   */\n  @Prop({reflect: true})\n  preserveAspectRatio = true;\n\n  /**\n   * Store the intrinsic aspect ratio of the slotted image when loaded,\n   * to have a default when `--cover-hero-aspect-ratio` is not set.\n   * @param target The event target\n   */\n  @Listen(\"load\", {capture: true})\n  protected onImgLoad({target}: Event): void {\n    if (target instanceof Image && target.closest(\"[slot=cover]\")) {\n      const ratio = target.naturalWidth / target.naturalHeight;\n      this.host.style.setProperty(\"--image-aspect-ratio\", ratio.toString());\n    }\n  }\n\n  /**\n   * Template for the content.\n   */\n  private renderContent(): HTMLDivElement {\n    return (\n      <div class=\"content-container\">\n        <slot name=\"content\"></slot>\n      </div>\n    );\n  }\n\n  render(): HTMLZCoverHeroElement {\n    return (\n      <Host>\n        {this.variant === CoverHeroVariant.STACKED &&\n          this.contentPosition === CoverHeroContentPosition.TOP &&\n          this.renderContent()}\n        <div class=\"main-container\">\n          <div class=\"cover-container\">\n            <slot name=\"cover\"></slot>\n          </div>\n          <slot name=\"info-reveal\"></slot>\n          {this.variant === CoverHeroVariant.OVERLAY && this.renderContent()}\n        </div>\n        {this.variant === CoverHeroVariant.STACKED &&\n          this.contentPosition === CoverHeroContentPosition.BOTTOM &&\n          this.renderContent()}\n      </Host>\n    );\n  }\n}\n"],"mappings":"oGAAA,MAAMA,EAAY,IAAM,6nD,MCgBXC,EAAU,MALvB,WAAAC,CAAAC,G,UAYEC,KAAAC,QAA4BC,EAAiBC,QAM7CH,KAAAI,gBAA4CC,EAAyBC,IASrEN,KAAAO,oBAAsB,IA6CvB,CArCW,SAAAC,EAAUC,OAACA,IACnB,GAAIA,aAAkBC,OAASD,EAAOE,QAAQ,gBAAiB,CAC7D,MAAMC,EAAQH,EAAOI,aAAeJ,EAAOK,cAC3Cd,KAAKe,KAAKC,MAAMC,YAAY,uBAAwBL,EAAMM,W,EAOtD,aAAAC,GACN,OACEC,EAAA,OAAKC,MAAM,qBACTD,EAAA,QAAME,KAAK,Y,CAKjB,MAAAC,GACE,OACEH,EAACI,EAAI,CAAAC,IAAA,4CACFzB,KAAKC,UAAYC,EAAiBwB,SACjC1B,KAAKI,kBAAoBC,EAAyBC,KAClDN,KAAKmB,gBACPC,EAAA,OAAAK,IAAA,2CAAKJ,MAAM,kBACTD,EAAA,OAAAK,IAAA,2CAAKJ,MAAM,mBACTD,EAAA,QAAAK,IAAA,2CAAMH,KAAK,WAEbF,EAAA,QAAAK,IAAA,2CAAMH,KAAK,gBACVtB,KAAKC,UAAYC,EAAiBC,SAAWH,KAAKmB,iBAEpDnB,KAAKC,UAAYC,EAAiBwB,SACjC1B,KAAKI,kBAAoBC,EAAyBsB,QAClD3B,KAAKmB,gB","ignoreList":[]}

package/dist/web-components-library/p-17a9c2b3.entry.js

@@ -0,0 +1,2 @@
+import{r as L,h as i,H as o}from"./p-BEHxru6n.js";const t=()=>`:host{display:inline-block;width:255px;height:64px;vertical-align:top}img{display:block;width:100%;height:100%;margin:auto;content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='255px' height='64px' viewBox='0 0 255 64'%3E%3Cg id='Logo/Zanichelli/Centered-(reworked)' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Group'%3E%3Cpolygon id='Background' fill='%23E2001A' points='1.70530257e-13 64 254.39 64 254.39 0 1.70530257e-13 0'%3E%3C/polygon%3E%3Cpath d='M233.36,51.3553859 L242.390252,51.3553859 L242.390252,12.6427292 L233.36,12.6427292 L233.36,51.3553859 Z M211.120346,51.3553859 L230.477617,51.3553859 L230.477617,44.5040053 L220.685891,44.5040053 L220.685891,12.6427292 L211.120346,12.6427292 L211.120346,51.3553859 Z M188.880124,51.3553859 L208.23551,51.3553859 L208.23551,44.5040053 L198.445669,44.5040053 L198.445669,12.6427292 L188.880124,12.6427292 L188.880124,51.3553859 Z M165.354444,12.6427292 L165.354444,51.3553859 L185.999058,51.3553859 L185.999058,44.5021204 L175.027425,44.5021204 L175.027425,35.1778343 L185.377062,35.1778343 L185.377062,28.2699086 L175.027425,28.2699086 L175.027425,19.4978796 L185.999058,19.4978796 L185.999058,12.6427292 L165.354444,12.6427292 Z M136.666196,51.3553859 L146.239281,51.3553859 L146.239281,35.1778343 L152.902178,35.1778343 L152.902178,51.3553859 L162.473377,51.3553859 L162.473377,12.6427292 L152.902178,12.6427292 L152.902178,28.2717934 L146.239281,28.2717934 L146.239281,12.6427292 L136.666196,12.6427292 L136.666196,51.3553859 Z M96.064744,51.3553859 L105.098765,51.3553859 L105.098765,12.6427292 L96.064744,12.6427292 L96.064744,51.3553859 Z M53.2364527,36.5160682 L50.6824993,19.7429083 L48.0757704,36.5160682 L53.2364527,36.5160682 Z M65.4935444,51.3553859 L56.2710395,51.3553859 L54.9441146,42.5286966 L47.7101121,42.5286966 L46.3304118,51.3553859 L37.1060221,51.3553859 L45.0053718,12.6427292 L57.5960795,12.6427292 L65.4935444,51.3553859 Z M85.0468382,37.7581755 L76.7969089,12.6427292 L67.3764961,12.6427292 L67.3764961,51.3553859 L75.4040147,51.3553859 L75.4040147,26.132504 L83.5955141,51.3553859 L93.1855622,51.3553859 L93.1855622,12.6427292 L85.0468382,12.6427292 L85.0468382,37.7581755 Z M107.977948,32 C107.977948,34.5200264 107.977948,36.7893695 108.187165,39.1246819 C108.396382,41.4713034 108.818585,43.6878711 109.678071,45.6009801 C111.423429,49.487513 114.932995,52 121.708982,52 C129.508435,52 133.787014,48.4753558 133.787014,38.0220526 L133.787014,37.5640373 L124.937707,37.5640373 L124.922628,38.0050891 C124.894356,38.7571388 124.884931,39.6185091 124.826501,40.4855339 C124.769956,41.3431345 124.66629,42.1875412 124.460843,42.9301668 C124.048064,44.3965696 123.279051,45.3559514 121.708982,45.3559514 C117.743286,45.3559514 117.057205,42.0574875 117.057205,32 C117.057205,21.9425125 117.743286,18.6440486 121.708982,18.6440486 C123.605127,18.6440486 124.547546,20.0030157 124.547546,25.1806616 L124.547546,25.6424465 L133.344077,25.6424465 L133.361041,25.1995099 C133.689003,16.7855998 130.235982,12 121.708982,12 C114.934879,12 111.427199,14.4823297 109.678071,18.3594383 C108.818585,20.265008 108.396382,22.4778061 108.187165,24.830082 C107.977948,27.1710489 107.977948,29.4554707 107.977948,32 L107.977948,32 Z M34.9007634,12.6446141 L34.9007634,20.3196683 L21.6051268,44.5040053 L35.2268401,44.5040053 L35.2268401,51.3553859 L12,51.3553859 L12,43.7915371 L25.2975214,19.4997644 L13.683159,19.4997644 L13.683159,12.6446141 L34.9007634,12.6446141 Z' id='Logotipo-(reworked)' fill='%23FFFFFF'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}a{display:block;width:100%;height:100%}a:focus-visible{box-shadow:var(--shadow-focus-primary);outline:none}:host(.mobile){width:31px;height:40px}:host(.mobile) img{content:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31px' height='40px' viewBox='0 0 31 40'%3E%3Cg id='Symbols' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Topbar/Mobile/Logged' transform='translate(-16.000000, -4.000000)'%3E%3Cg id='Group' transform='translate(16.000000, 4.000000)'%3E%3Cpolygon id='Fill-1' fill='%23E2001A' points='0 40 30.625 40 30.625 0 0 0'%3E%3C/polygon%3E%3Cpolygon id='Fill-2' fill='%23FEFEFE' points='8.17111587 6.20689655 23.4311708 6.20689655 23.4311708 11.671267 13.8691261 28.9163861 23.6647727 28.9163861 23.6647727 33.7931034 6.96022727 33.7931034 6.96022727 28.408218 16.522272 11.0831673 8.17111587 11.0831673'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E")}`;const l=class{constructor(i){L(this,i)}render(){const L={};if(this.width){L["width"]=L["max-width"]=`${this.width}px`}if(this.height){L["height"]=L["max-height"]=`${this.height}px`}return i(o,{key:"35e05af6b6f866d00ee18e9f88c56665a70ffaf1",style:L,class:{mobile:!!this.mobileLogo}},this.link?i("a",{href:this.link,target:this.targetBlank?"_blank":"_self"},i("img",{alt:this.imageAlt})):i("img",{alt:this.imageAlt}))}};l.style=t();export{l as z_logo};
+//# sourceMappingURL=p-17a9c2b3.entry.js.map

package/dist/web-components-library/p-17a9c2b3.entry.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["stylesCss","ZLogo","render","style","this","width","height","h","Host","key","class","mobile","mobileLogo","link","href","target","targetBlank","alt","imageAlt"],"sources":["src/components/z-logo/styles.css?tag=z-logo&encapsulation=shadow","src/components/z-logo/index.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  width: 255px;\n  height: 64px;\n  vertical-align: top;\n}\n\nimg {\n  display: block;\n  width: 100%;\n  height: 100%;\n  margin: auto;\n  content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='255px' height='64px' viewBox='0 0 255 64'%3E%3Cg id='Logo/Zanichelli/Centered-(reworked)' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Group'%3E%3Cpolygon id='Background' fill='%23E2001A' points='1.70530257e-13 64 254.39 64 254.39 0 1.70530257e-13 0'%3E%3C/polygon%3E%3Cpath d='M233.36,51.3553859 L242.390252,51.3553859 L242.390252,12.6427292 L233.36,12.6427292 L233.36,51.3553859 Z M211.120346,51.3553859 L230.477617,51.3553859 L230.477617,44.5040053 L220.685891,44.5040053 L220.685891,12.6427292 L211.120346,12.6427292 L211.120346,51.3553859 Z M188.880124,51.3553859 L208.23551,51.3553859 L208.23551,44.5040053 L198.445669,44.5040053 L198.445669,12.6427292 L188.880124,12.6427292 L188.880124,51.3553859 Z M165.354444,12.6427292 L165.354444,51.3553859 L185.999058,51.3553859 L185.999058,44.5021204 L175.027425,44.5021204 L175.027425,35.1778343 L185.377062,35.1778343 L185.377062,28.2699086 L175.027425,28.2699086 L175.027425,19.4978796 L185.999058,19.4978796 L185.999058,12.6427292 L165.354444,12.6427292 Z M136.666196,51.3553859 L146.239281,51.3553859 L146.239281,35.1778343 L152.902178,35.1778343 L152.902178,51.3553859 L162.473377,51.3553859 L162.473377,12.6427292 L152.902178,12.6427292 L152.902178,28.2717934 L146.239281,28.2717934 L146.239281,12.6427292 L136.666196,12.6427292 L136.666196,51.3553859 Z M96.064744,51.3553859 L105.098765,51.3553859 L105.098765,12.6427292 L96.064744,12.6427292 L96.064744,51.3553859 Z M53.2364527,36.5160682 L50.6824993,19.7429083 L48.0757704,36.5160682 L53.2364527,36.5160682 Z M65.4935444,51.3553859 L56.2710395,51.3553859 L54.9441146,42.5286966 L47.7101121,42.5286966 L46.3304118,51.3553859 L37.1060221,51.3553859 L45.0053718,12.6427292 L57.5960795,12.6427292 L65.4935444,51.3553859 Z M85.0468382,37.7581755 L76.7969089,12.6427292 L67.3764961,12.6427292 L67.3764961,51.3553859 L75.4040147,51.3553859 L75.4040147,26.132504 L83.5955141,51.3553859 L93.1855622,51.3553859 L93.1855622,12.6427292 L85.0468382,12.6427292 L85.0468382,37.7581755 Z M107.977948,32 C107.977948,34.5200264 107.977948,36.7893695 108.187165,39.1246819 C108.396382,41.4713034 108.818585,43.6878711 109.678071,45.6009801 C111.423429,49.487513 114.932995,52 121.708982,52 C129.508435,52 133.787014,48.4753558 133.787014,38.0220526 L133.787014,37.5640373 L124.937707,37.5640373 L124.922628,38.0050891 C124.894356,38.7571388 124.884931,39.6185091 124.826501,40.4855339 C124.769956,41.3431345 124.66629,42.1875412 124.460843,42.9301668 C124.048064,44.3965696 123.279051,45.3559514 121.708982,45.3559514 C117.743286,45.3559514 117.057205,42.0574875 117.057205,32 C117.057205,21.9425125 117.743286,18.6440486 121.708982,18.6440486 C123.605127,18.6440486 124.547546,20.0030157 124.547546,25.1806616 L124.547546,25.6424465 L133.344077,25.6424465 L133.361041,25.1995099 C133.689003,16.7855998 130.235982,12 121.708982,12 C114.934879,12 111.427199,14.4823297 109.678071,18.3594383 C108.818585,20.265008 108.396382,22.4778061 108.187165,24.830082 C107.977948,27.1710489 107.977948,29.4554707 107.977948,32 L107.977948,32 Z M34.9007634,12.6446141 L34.9007634,20.3196683 L21.6051268,44.5040053 L35.2268401,44.5040053 L35.2268401,51.3553859 L12,51.3553859 L12,43.7915371 L25.2975214,19.4997644 L13.683159,19.4997644 L13.683159,12.6446141 L34.9007634,12.6446141 Z' id='Logotipo-(reworked)' fill='%23FFFFFF'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/svg%3E\");\n}\n\na {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n\na:focus-visible {\n  box-shadow: var(--shadow-focus-primary);\n  outline: none;\n}\n\n:host(.mobile) {\n  width: 31px;\n  height: 40px;\n}\n\n:host(.mobile) img {\n  content: url(\"data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='31px' height='40px' viewBox='0 0 31 40'%3E%3Cg id='Symbols' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Topbar/Mobile/Logged' transform='translate(-16.000000, -4.000000)'%3E%3Cg id='Group' transform='translate(16.000000, 4.000000)'%3E%3Cpolygon id='Fill-1' fill='%23E2001A' points='0 40 30.625 40 30.625 0 0 0'%3E%3C/polygon%3E%3Cpolygon id='Fill-2' fill='%23FEFEFE' points='8.17111587 6.20689655 23.4311708 6.20689655 23.4311708 11.671267 13.8691261 28.9163861 23.6647727 28.9163861 23.6647727 33.7931034 6.96022727 33.7931034 6.96022727 28.408218 16.522272 11.0831673 8.17111587 11.0831673'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E\");\n}\n","import {Component, ComponentInterface, Host, Prop, h} from \"@stencil/core\";\n\n@Component({\n  tag: \"z-logo\",\n  styleUrl: \"styles.css\",\n  shadow: true,\n})\nexport class ZLogo implements ComponentInterface {\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"],"mappings":"kDAAA,MAAMA,EAAY,IAAM,m5I,MCOXC,EAAK,M,yBAyBhB,MAAAC,GACE,MAAMC,EAAQ,GAEd,GAAIC,KAAKC,MAAO,CACdF,EAAM,SAAWA,EAAM,aAAe,GAAGC,KAAKC,S,CAGhD,GAAID,KAAKE,OAAQ,CACfH,EAAM,UAAYA,EAAM,cAAgB,GAAGC,KAAKE,U,CAGlD,OACEC,EAACC,EAAI,CAAAC,IAAA,2CACHN,MAAOA,EACPO,MAAO,CAACC,SAAUP,KAAKQ,aAEtBR,KAAKS,KACJN,EAAA,KACEO,KAAMV,KAAKS,KACXE,OAAQX,KAAKY,YAAc,SAAW,SAEtCT,EAAA,OAAKU,IAAKb,KAAKc,YAGjBX,EAAA,OAAKU,IAAKb,KAAKc,W","ignoreList":[]}