@lumx/core 4.17.1-alpha.2 → 4.17.1-alpha.3

package/js/components/Menu/types.d.ts

@@ -1,40 +0,0 @@
-/** Map of menu event names to their payload types. */
-export interface MenuEventMap {
-    /** Fired when the menu open state changes. Payload: whether the menu is open. */
-    open: boolean;
-}
-/**
- * Handle returned by `setupMenu`. Used by framework wrappers to plug DOM elements
- * into the menu state machine.
- */
-export interface MenuHandle {
-    /** The trigger element, registered via `registerTrigger`. Null before registration. */
-    readonly trigger: HTMLElement | null;
-    /** Set the open state, update ARIA, fire `open` event. */
-    setOpen(open: boolean): void;
-    /**
-     * Register the trigger element. Wires click toggle, keyboard handlers (ArrowUp/Down
-     * to open with focus, trigger typeahead) and ARIA attributes. Returns a cleanup fn.
-     */
-    registerTrigger(el: HTMLElement): () => void;
-    /**
-     * Register the menu container (`<ul>`). Wires keyboard handlers (arrow nav, typeahead,
-     * Tab-edge close, Escape). Always mounted (`closeMode="hide"`), so runs once.
-     * Returns a cleanup fn.
-     */
-    registerMenu(el: HTMLElement): () => void;
-    /**
-     * Apply a focus request deferred while the menu was closed (trigger ArrowDown/Up,
-     * typeahead, or click-open). The wrapper must call this once items commit to the DOM.
-     */
-    flushPendingNavigation(): void;
-    /** Subscribe to a menu event. Returns an unsubscribe function. */
-    subscribe<E extends keyof MenuEventMap>(event: E, listener: (value: MenuEventMap[E]) => void): () => void;
-    /** Tear down — removes all event listeners and clears state. */
-    destroy(): void;
-}
-/** Options for `setupMenu`. The wrapper sets the matching `id` on the `<ul>` itself. */
-export interface SetupMenuOptions {
-    /** The id to advertise via `aria-controls` on the trigger. */
-    menuId?: string;
-}

package/js/components/Menu/utils.d.ts

@@ -1,9 +0,0 @@
-/**
- * CSS selector for menu items (inner focusable element). Includes disabled items: per
- * WAI-ARIA APG they stay focusable so AT announces them; click is no-op'd via `aria-disabled`.
- */
-export declare const MENU_ITEM_SELECTOR = "[data-menu-item]";
-/** Get an item's text label (trimmed `textContent`) for typeahead matching. */
-export declare function getItemText(item: HTMLElement): string;
-/** Get all item elements within a menu container, in DOM order (includes disabled). */
-export declare function getItems(menu: HTMLElement): HTMLElement[];

package/js/components/Message/Stories.d.ts

@@ -1,119 +0,0 @@
-import type { SetupStoriesOptions } from '@lumx/core/stories/types';
-/**
- * Setup Message stories for a specific framework (React or Vue).
- * This function creates all the stories with the appropriate decorators.
- * Framework-specific components are injected via `components`.
- */
-export declare function setup({ component: Message, decorators: { withCombinations }, overrides, }: SetupStoriesOptions<{
-    overrides: 'ClosableMessage';
-    decorators: 'withCombinations';
-}>): {
-    meta: {
-        component: any;
-        render: ({ children, ...args }: any) => import("react").JSX.Element;
-        argTypes: {
-            kind: {
-                control: {
-                    type: "select" | "inline-radio";
-                };
-                options: ("info" | "success" | "warning" | "error")[];
-                mapping: Record<string, "info" | "success" | "warning" | "error"> | undefined;
-            };
-            hasBackground: {
-                control: string;
-            };
-            icon: {
-                control: {
-                    type: string;
-                };
-                options: {
-                    undefined: undefined;
-                    mdiAbTesting: string;
-                    mdiAbjadArabic: string;
-                    mdiAccount: string;
-                    mdiAccountBox: string;
-                    mdiAlert: string;
-                    mdiAlertCircle: string;
-                    mdiArrowDown: string;
-                    mdiArrowUp: string;
-                    mdiAtom: string;
-                    mdiBee: string;
-                    mdiBell: string;
-                    mdiBullhornOutline: string;
-                    mdiCheck: string;
-                    mdiCheckCircle: string;
-                    mdiChevronDown: string;
-                    mdiChevronLeft: string;
-                    mdiChevronRight: string;
-                    mdiChevronUp: string;
-                    mdiClose: string;
-                    mdiCloseCircle: string;
-                    mdiDelete: string;
-                    mdiDotsHorizontal: string;
-                    mdiDragVertical: string;
-                    mdiEarth: string;
-                    mdiEmail: string;
-                    mdiEye: string;
-                    mdiFileEdit: string;
-                    mdiFlag: string;
-                    mdiFolder: string;
-                    mdiFolderGoogleDrive: string;
-                    mdiFoodApple: string;
-                    mdiGoogleCirclesExtended: string;
-                    mdiHeart: string;
-                    mdiHome: string;
-                    mdiImageBroken: string;
-                    mdiInformation: string;
-                    mdiLink: string;
-                    mdiMagnifyMinusOutline: string;
-                    mdiMagnifyPlusOutline: string;
-                    mdiMenuDown: string;
-                    mdiMessageTextOutline: string;
-                    mdiMinus: string;
-                    mdiOpenInNew: string;
-                    mdiPauseCircleOutline: string;
-                    mdiPencil: string;
-                    mdiPlay: string;
-                    mdiPlayCircleOutline: string;
-                    mdiPlus: string;
-                    mdiRadioboxBlank: string;
-                    mdiRadioboxMarked: string;
-                    mdiReply: string;
-                    mdiSend: string;
-                    mdiStar: string;
-                    mdiTextBox: string;
-                    mdiTextBoxPlus: string;
-                    mdiTram: string;
-                    mdiTranslate: string;
-                    mdiViewList: string;
-                };
-            };
-        };
-        args: {
-            children: string;
-        };
-    };
-    /** Default message */
-    Default: {};
-    /** All `kind` variants */
-    AllKinds: {
-        decorators: ((story: any, context: any) => any)[];
-    };
-    /** All `kind` variants with `hasBackground` */
-    AllKindsWithBackground: {
-        args: {
-            hasBackground: boolean;
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-    /** With custom icon */
-    CustomIcon: {
-        args: {
-            icon: string;
-        };
-    };
-    /** With close button (has background and kind info) */
-    ClosableMessage: {
-        args: any;
-    };
-};

package/js/components/Message/Tests.d.ts

@@ -1,14 +0,0 @@
-import { SetupOptions } from '../../../testing';
-import { MessageProps } from '.';
-type SetupProps = Partial<MessageProps>;
-/**
- * Mounts the component and returns common DOM elements / data needed in multiple tests further down.
- */
-export declare const setup: (propsOverride: SetupProps | undefined, { render, ...options }: SetupOptions<MessageProps>) => {
-    message: HTMLElement;
-    icon: HTMLElement | null;
-    closeButton: HTMLElement | null;
-    props: MessageProps;
-};
-declare const _default: (renderOptions: SetupOptions<MessageProps>) => void;
-export default _default;

package/js/components/Message/index.d.ts

@@ -1,75 +0,0 @@
-import { Kind } from '../../constants';
-import type { JSXElement, LumxClassName, HasClassName, CommonRef } from '../../types';
-/**
- * Defines the props of the component.
- */
-export interface MessageProps extends HasClassName {
-    /** Content. */
-    children?: JSXElement;
-    /** Whether the message has a background or not. */
-    hasBackground?: boolean;
-    /** Message variant. */
-    kind?: Kind;
-    /** Message custom icon SVG path. */
-    icon?: string;
-    /** Reference to the message container element. */
-    ref?: CommonRef;
-    /**
-     * Displays a close button.
-     *
-     * NB: only available if `kind === 'info' && hasBackground === true`
-     */
-    closeButtonProps?: {
-        /** The callback called when the button is clicked */
-        onClick: () => void;
-        /** The label of the close button. */
-        label: string;
-    };
-}
-/**
- * Component display name.
- */
-export declare const COMPONENT_NAME = "Message";
-/**
- * Component default class name and class prefix.
- */
-export declare const CLASSNAME: LumxClassName<typeof COMPONENT_NAME>;
-export declare const block: {
-    (additionalClasses: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-    (modifiers?: import("../../utils/classNames/bem/types").Modifier, additionalClasses?: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-}, element: {
-    (elem: string, additionalClasses: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-    (elem: string, modifiers?: import("../../utils/classNames/bem/types").Modifier, additionalClasses?: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-};
-/**
- * Associative map from message kind to color and icon.
- */
-export declare const CONFIG: {
-    error: {
-        color: "red";
-        icon: string;
-    };
-    info: {
-        color: "blue";
-        icon: string;
-    };
-    success: {
-        color: "green";
-        icon: string;
-    };
-    warning: {
-        color: "yellow";
-        icon: string;
-    };
-};
-/**
- * Message component.
- *
- * @param  props Component props.
- * @return JSX element.
- */
-export declare const Message: {
-    (props: MessageProps): import("react").JSX.Element;
-    displayName: string;
-    className: "lumx-message";
-};

package/js/components/Mosaic/Stories.d.ts

@@ -1,102 +0,0 @@
-import type { SetupStoriesOptions } from '@lumx/core/stories/types';
-/**
- * Setup Mosaic stories for a specific framework (React or Vue).
- * Framework-specific decorators are injected via `decorators`.
- * Per-story overrides (e.g. framework-specific argTypes) are injected via `overrides`.
- */
-export declare function setup({ component: Mosaic, decorators: { withWrapper }, overrides, }: SetupStoriesOptions<{
-    decorators: 'withWrapper';
-    overrides: 'OneThumbnailClickable' | 'TwoThumbnailClickable' | 'ThreeThumbnailClickable' | 'FourThumbnailClickable' | 'FiveThumbnailClickable' | 'SixThumbnailClickable';
-}>): {
-    meta: {
-        component: any;
-        render: (args: any) => import("react").JSX.Element;
-        args: Partial<import(".").MosaicProps>;
-        argTypes: {};
-        decorators: ((story: any, context: any) => any)[];
-    };
-    OneThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    OneThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    TwoThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    TwoThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    ThreeThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    ThreeThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    FourThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    FourThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    FiveThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    FiveThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    SixThumbnail: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-    SixThumbnailClickable: {
-        args: {
-            thumbnails: {
-                image: string;
-            }[];
-        };
-    };
-};

package/js/components/Mosaic/Tests.d.ts

@@ -1,13 +0,0 @@
-import { SetupOptions } from '../../../testing';
-/**
- * Mounts the component and returns common DOM elements / data needed in multiple tests further down.
- */
-export declare const setup: (propsOverride: any | undefined, { render, ...options }: SetupOptions<any>) => {
-    props: any;
-    mosaic: HTMLElement;
-    thumbnails: HTMLElement[];
-    overlay: HTMLElement | null;
-    wrapper: Partial<import("../../../testing").SetupResult>;
-};
-declare const _default: (renderOptions: SetupOptions<any>) => void;
-export default _default;

package/js/components/Mosaic/index.d.ts

@@ -1,40 +0,0 @@
-import type { CommonRef, HasClassName, LumxClassName, HasTheme } from '../../types';
-/**
- * Defines the props of the component.
- */
-export interface MosaicProps extends HasClassName, HasTheme {
-    /** Thumbnails. */
-    thumbnails: any[];
-    /** On image click callback. */
-    handleClick?(index: number): void;
-    Thumbnail: any;
-    ref?: CommonRef;
-}
-export type MosaicPropsToOverride = 'Thumbnail' | 'thumbnails';
-/**
- * Component display name.
- */
-export declare const COMPONENT_NAME = "Mosaic";
-/**
- * Component default class name and class prefix.
- */
-export declare const CLASSNAME: LumxClassName<typeof COMPONENT_NAME>;
-export declare const block: {
-    (additionalClasses: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-    (modifiers?: import("../../utils/classNames/bem/types").Modifier, additionalClasses?: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-}, element: {
-    (elem: string, additionalClasses: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-    (elem: string, modifiers?: import("../../utils/classNames/bem/types").Modifier, additionalClasses?: import("../../utils/classNames/bem/types").AdditionalClasses): string;
-};
-/**
- * Component default props.
- */
-export declare const DEFAULT_PROPS: Partial<MosaicProps>;
-/**
- * Mosaic component.
- *
- * @param  props Component props.
- * @param  ref   Component ref.
- * @return React element.
- */
-export declare const Mosaic: (props: MosaicProps) => import("react").JSX.Element;

package/js/components/Popover/Stories.d.ts

@@ -1,156 +0,0 @@
-import type { SetupStoriesOptions } from '@lumx/core/stories/types';
-import { Placement, FitAnchorWidth } from './constants';
-import { type Elevation } from './types';
-/**
- * Core stories for the Popover component.
- *
- * A default `render` function is provided per framework to handle anchor ref creation
- * and framework-specific JSX. Story variations are expressed as `args` and shared here.
- *
- * The render function receives all args, including story display args:
- * - `anchorText`: Label for the anchor button (default: 'Anchor')
- * - `anchorClassName`: CSS class for the anchor button (default: 'lumx-spacing-margin-big')
- * - `popoverClassName`: Extra CSS class for the popover (default: undefined)
- * - `textColor`: Text color prop for popover content (default: undefined)
- * - `fitAnchorWidth`: When set, popover content renders as plain text instead of wrapped in Text
- */
-export declare function setup({ component: Popover, render, decorators: { withCombinations, withChromaticForceScreenSize }, }: SetupStoriesOptions<{
-    decorators: 'withCombinations' | 'withChromaticForceScreenSize';
-}>): {
-    meta: {
-        component: any;
-        render: any;
-        args: {
-            isOpen: boolean;
-            anchorText: string;
-            anchorClassName: string;
-            anchorRef?: import("../../types").CommonRef;
-            as?: string | undefined;
-            boundaryRef?: import("../../types").CommonRef;
-            closeOnClickAway?: boolean | undefined;
-            closeOnEscape?: boolean | undefined;
-            elevation?: Elevation | undefined;
-            fitToAnchorWidth?: (FitAnchorWidth | boolean) | undefined;
-            fitWithinViewportHeight?: boolean | undefined;
-            focusElement?: import("../../types").CommonRef;
-            focusAnchorOnClose?: boolean | undefined;
-            hasArrow?: boolean | undefined;
-            offset?: import("./types").Offset | undefined;
-            parentElement?: import("../../types").CommonRef;
-            placement?: Placement | undefined;
-            usePortal?: boolean | undefined;
-            focusTrapZoneElement?: import("../../types").CommonRef;
-            zIndex?: number | undefined;
-            withFocusTrap?: boolean | undefined;
-            handleClose?: (() => void) | undefined;
-            className?: string | undefined;
-            theme?: import("../../constants").Theme | undefined;
-            closeMode?: "hide" | "unmount" | undefined;
-        };
-        argTypes: {
-            closeMode: {
-                control: {
-                    type: "select" | "inline-radio";
-                };
-                options: string[];
-                mapping: Record<string, string> | undefined;
-            };
-            isOpen: {
-                control: string;
-            };
-            hasArrow: {
-                control: string;
-            };
-            placement: {
-                control: {
-                    type: "select" | "inline-radio";
-                };
-                options: ("top" | "right" | "bottom" | "left" | "auto" | "bottom-end" | "auto-end" | "auto-start" | "top-end" | "top-start" | "right-end" | "right-start" | "bottom-start" | "left-end" | "left-start")[];
-                mapping: Record<string, "top" | "right" | "bottom" | "left" | "auto" | "bottom-end" | "auto-end" | "auto-start" | "top-end" | "top-start" | "right-end" | "right-start" | "bottom-start" | "left-end" | "left-start"> | undefined;
-            };
-            elevation: {
-                control: {
-                    type: "select" | "inline-radio";
-                };
-                options: Elevation[];
-                mapping: Record<string, Elevation> | undefined;
-            };
-            ref: {
-                control: boolean;
-            };
-            parentElement: {
-                control: boolean;
-            };
-            focusElement: {
-                control: boolean;
-            };
-            anchorRef: {
-                control: boolean;
-            };
-            boundaryRef: {
-                control: boolean;
-            };
-            children: {
-                control: boolean;
-            };
-            anchorText: {
-                control: boolean;
-            };
-            anchorClassName: {
-                control: boolean;
-            };
-            popoverClassName: {
-                control: boolean;
-            };
-            textColor: {
-                control: boolean;
-            };
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-    Simple: {};
-    DarkTheme: {
-        args: {
-            theme: string;
-            hasArrow: boolean;
-            textColor: string;
-        };
-    };
-    WithoutPortal: {
-        args: {
-            usePortal: boolean;
-        };
-    };
-    Placements: {
-        argTypes: {
-            placement: {
-                control: boolean;
-            };
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-    FitToAnchorWidth: {
-        args: {
-            anchorClassName: string;
-            popoverClassName: string;
-            placement: "bottom";
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-    Width: {
-        args: {
-            anchorClassName: string;
-            popoverClassName: string;
-            placement: "bottom";
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-    Height: {
-        args: {
-            anchorClassName: string;
-            popoverClassName: string;
-            placement: "bottom";
-        };
-        decorators: ((story: any, context: any) => any)[];
-    };
-};

package/js/components/Popover/Tests.d.ts

@@ -1,11 +0,0 @@
-import { SetupOptions } from '../../../testing';
-/**
- * Mounts the component and returns common DOM elements / data needed in multiple tests further down.
- */
-export declare const setup: (propsOverride: any | undefined, { render, ...options }: SetupOptions<any>) => {
-    props: any;
-    element: HTMLElement;
-    wrapper: Partial<import("../../../testing").SetupResult>;
-};
-declare const _default: (renderOptions: SetupOptions<any>) => void;
-export default _default;

package/js/components/Popover/constants.d.ts

@@ -1,43 +0,0 @@
-import { ValueOf } from '../../types/ValueOf';
-/**
- * Different possible placements for the popover.
- */
-export declare const Placement: {
-    readonly AUTO: "auto";
-    readonly AUTO_END: "auto-end";
-    readonly AUTO_START: "auto-start";
-    readonly TOP: "top";
-    readonly TOP_END: "top-end";
-    readonly TOP_START: "top-start";
-    readonly RIGHT: "right";
-    readonly RIGHT_END: "right-end";
-    readonly RIGHT_START: "right-start";
-    readonly BOTTOM: "bottom";
-    readonly BOTTOM_END: "bottom-end";
-    readonly BOTTOM_START: "bottom-start";
-    readonly LEFT: "left";
-    readonly LEFT_END: "left-end";
-    readonly LEFT_START: "left-start";
-};
-export type Placement = ValueOf<typeof Placement>;
-/**
- * Popover fit anchor width options.
- */
-export declare const FitAnchorWidth: {
-    readonly MAX_WIDTH: "maxWidth";
-    readonly MIN_WIDTH: "minWidth";
-    readonly WIDTH: "width";
-};
-export type FitAnchorWidth = ValueOf<typeof FitAnchorWidth>;
-/**
- * Arrow size (in pixel).
- */
-export declare const ARROW_SIZE = 14;
-/**
- * Popover default z-index
- */
-export declare const POPOVER_ZINDEX = 9999;
-/**
- * Popover height/width sizes
- */
-export declare const POPOVER_SIZES: readonly ["m", "l", "xl", "xxl"];