@marwes-ui/core 0.0.3 → 0.0.4

package/dist/index.d.ts

@@ -162,6 +162,589 @@ declare function switchMode(currentSystem: System, newMode: ThemeMode): System;
 
 type CssVars = Record<`--mw-${string}`, string>;
 
+/**
+ * IconName - Enum-like constant for all available icons
+ *
+ * @generated This file is auto-generated by scripts/generate-icon-names.ts
+ * Do not edit manually. Run `pnpm generate:icons` to regenerate.
+ *
+ * Usage:
+ * ```tsx
+ * import { IconName } from "@marwes-ui/core"
+ *
+ * <Icon name={IconName.AlertCircle} />
+ * <Button iconRight={IconName.Minus}>Delete</Button>
+ * ```
+ */
+declare const IconName: {
+    readonly Airplay: "airplay";
+    readonly AlertCircle: "alertCircle";
+    readonly AlertOctagon: "alertOctagon";
+    readonly AlertTriangle: "alertTriangle";
+    readonly AlignCenter: "alignCenter";
+    readonly AlignJustify: "alignJustify";
+    readonly AlignLeft: "alignLeft";
+    readonly AlignRight: "alignRight";
+    readonly ArrowDown: "arrowDown";
+    readonly ArrowDownCircle: "arrowDownCircle";
+    readonly ArrowDownLeft: "arrowDownLeft";
+    readonly ArrowDownRight: "arrowDownRight";
+    readonly ArrowIn: "arrowIn";
+    readonly ArrowInCircle: "arrowInCircle";
+    readonly ArrowInSquare: "arrowInSquare";
+    readonly ArrowLeft: "arrowLeft";
+    readonly ArrowLeftCircle: "arrowLeftCircle";
+    readonly ArrowOut: "arrowOut";
+    readonly ArrowOutCircle: "arrowOutCircle";
+    readonly ArrowOutSquare: "arrowOutSquare";
+    readonly ArrowRight: "arrowRight";
+    readonly ArrowRightCircle: "arrowRightCircle";
+    readonly ArrowUp: "arrowUp";
+    readonly ArrowUpCircle: "arrowUpCircle";
+    readonly ArrowUpLeft: "arrowUpLeft";
+    readonly ArrowUpRight: "arrowUpRight";
+    readonly AtSign: "atSign";
+    readonly BarChart: "barChart";
+    readonly BarChart2: "barChart2";
+    readonly BarChart3: "barChart3";
+    readonly BarChart4: "barChart4";
+    readonly Bell: "bell";
+    readonly Bluetooth: "bluetooth";
+    readonly Bold: "bold";
+    readonly Bookmark: "bookmark";
+    readonly Calendar: "calendar";
+    readonly Camera: "camera";
+    readonly Cast: "cast";
+    readonly Check: "check";
+    readonly CheckCircle: "checkCircle";
+    readonly CheckSquare: "checkSquare";
+    readonly ChevronDown: "chevronDown";
+    readonly ChevronLeft: "chevronLeft";
+    readonly ChevronRight: "chevronRight";
+    readonly ChevronUp: "chevronUp";
+    readonly ChevronsDown: "chevronsDown";
+    readonly ChevronsLeft: "chevronsLeft";
+    readonly ChevronsRight: "chevronsRight";
+    readonly ChevronsUp: "chevronsUp";
+    readonly Circle: "circle";
+    readonly Clipboard: "clipboard";
+    readonly Clock: "clock";
+    readonly Code: "code";
+    readonly Command: "command";
+    readonly Compass: "compass";
+    readonly Copy: "copy";
+    readonly CornerDownLeft: "cornerDownLeft";
+    readonly CornerDownRight: "cornerDownRight";
+    readonly CornerLeftDown: "cornerLeftDown";
+    readonly CornerLeftUp: "cornerLeftUp";
+    readonly CornerRightDown: "cornerRightDown";
+    readonly CornerRightUp: "cornerRightUp";
+    readonly CornerUpLeft: "cornerUpLeft";
+    readonly CornerUpRight: "cornerUpRight";
+    readonly Cpu: "cpu";
+    readonly CreditCard: "creditCard";
+    readonly Database: "database";
+    readonly Delete: "delete";
+    readonly Disc: "disc";
+    readonly DollarSign: "dollarSign";
+    readonly Download: "download";
+    readonly DownloadCloud: "downloadCloud";
+    readonly Edit: "edit";
+    readonly Edit2: "edit2";
+    readonly Edit3: "edit3";
+    readonly Expand: "expand";
+    readonly ExternalLink: "externalLink";
+    readonly Eye: "eye";
+    readonly EyeOff: "eyeOff";
+    readonly Facebook: "facebook";
+    readonly FastForward: "fastForward";
+    readonly File: "file";
+    readonly FileMinus: "fileMinus";
+    readonly FileMinus2: "fileMinus2";
+    readonly FilePlus: "filePlus";
+    readonly FilePlus2: "filePlus2";
+    readonly FileText: "fileText";
+    readonly FileX: "fileX";
+    readonly FileX2: "fileX2";
+    readonly Film: "film";
+    readonly Flag: "flag";
+    readonly Folder: "folder";
+    readonly FolderMinus: "folderMinus";
+    readonly FolderMinus2: "folderMinus2";
+    readonly FolderPlus: "folderPlus";
+    readonly FolderPlus2: "folderPlus2";
+    readonly FolderX: "folderX";
+    readonly FolderX2: "folderX2";
+    readonly Grid: "grid";
+    readonly HardDrive: "hardDrive";
+    readonly Hash: "hash";
+    readonly Headphones: "headphones";
+    readonly Heart: "heart";
+    readonly HelpCircle: "helpCircle";
+    readonly Hexagon: "hexagon";
+    readonly Home: "home";
+    readonly Home2: "home2";
+    readonly Image: "image";
+    readonly Inbox: "inbox";
+    readonly Info: "info";
+    readonly Italic: "italic";
+    readonly Layout: "layout";
+    readonly Layout2: "layout2";
+    readonly Layout3: "layout3";
+    readonly Layout4: "layout4";
+    readonly Layout5: "layout5";
+    readonly Layout6: "layout6";
+    readonly LineChart: "lineChart";
+    readonly LineChart2: "lineChart2";
+    readonly Link: "link";
+    readonly List: "list";
+    readonly Loader: "loader";
+    readonly Lock: "lock";
+    readonly Mail: "mail";
+    readonly MapMarker1: "mapMarker1";
+    readonly MapMarker2: "mapMarker2";
+    readonly MapMarker3: "mapMarker3";
+    readonly Maximize: "maximize";
+    readonly Maximize2: "maximize2";
+    readonly Menu: "menu";
+    readonly MessageCircle: "messageCircle";
+    readonly MessageSquare: "messageSquare";
+    readonly Mic: "mic";
+    readonly Minimize: "minimize";
+    readonly Minimize3: "minimize3";
+    readonly Minus: "minus";
+    readonly MinusCircle: "minusCircle";
+    readonly MinusSquare: "minusSquare";
+    readonly Monitor: "monitor";
+    readonly Moon: "moon";
+    readonly MoreHorizontal: "moreHorizontal";
+    readonly MoreVertical: "moreVertical";
+    readonly Move: "move";
+    readonly Music: "music";
+    readonly Octagon: "octagon";
+    readonly Paperclip: "paperclip";
+    readonly Pause: "pause";
+    readonly PauseCircle: "pauseCircle";
+    readonly Percent: "percent";
+    readonly Phone: "phone";
+    readonly PieChart: "pieChart";
+    readonly PieChart2: "pieChart2";
+    readonly PieChart3: "pieChart3";
+    readonly PieChart4: "pieChart4";
+    readonly PieChart5: "pieChart5";
+    readonly Play: "play";
+    readonly PlayCircle: "playCircle";
+    readonly Plus: "plus";
+    readonly PlusCircle: "plusCircle";
+    readonly PlusSquare: "plusSquare";
+    readonly Power: "power";
+    readonly Printer: "printer";
+    readonly Radio: "radio";
+    readonly RefreshCcw: "refreshCcw";
+    readonly RefreshCw: "refreshCw";
+    readonly Repeat: "repeat";
+    readonly Rewind: "rewind";
+    readonly RotateLeft: "rotateLeft";
+    readonly RotateRight: "rotateRight";
+    readonly Rss: "rss";
+    readonly Save: "save";
+    readonly Scissors: "scissors";
+    readonly Search: "search";
+    readonly Server: "server";
+    readonly Settings: "settings";
+    readonly Share: "share";
+    readonly ShoppingBag: "shoppingBag";
+    readonly ShoppingCart: "shoppingCart";
+    readonly Shuffle: "shuffle";
+    readonly SkipBack: "skipBack";
+    readonly SkipForward: "skipForward";
+    readonly Slash: "slash";
+    readonly Sliders: "sliders";
+    readonly Smartphone: "smartphone";
+    readonly Speaker: "speaker";
+    readonly Square: "square";
+    readonly Star: "star";
+    readonly StopCircle: "stopCircle";
+    readonly Strikethrough: "strikethrough";
+    readonly Sun: "sun";
+    readonly Table: "table";
+    readonly Table2: "table2";
+    readonly Tablet: "tablet";
+    readonly Tag: "tag";
+    readonly ThumbsDown: "thumbsDown";
+    readonly ThumbsUp: "thumbsUp";
+    readonly Trash: "trash";
+    readonly TrendingDown: "trendingDown";
+    readonly TrendingUp: "trendingUp";
+    readonly Triangle: "triangle";
+    readonly Tv: "tv";
+    readonly Twitter: "twitter";
+    readonly Type: "type";
+    readonly Underline: "underline";
+    readonly Unlock: "unlock";
+    readonly Upload: "upload";
+    readonly UploadCloud: "uploadCloud";
+    readonly User: "user";
+    readonly UserCheck: "userCheck";
+    readonly UserCircle: "userCircle";
+    readonly UserMinus: "userMinus";
+    readonly UserPlus: "userPlus";
+    readonly UserX: "userX";
+    readonly Users: "users";
+    readonly Video: "video";
+    readonly VideoOff: "videoOff";
+    readonly Volume: "volume";
+    readonly Volume1: "volume1";
+    readonly Volume2: "volume2";
+    readonly VolumeX: "volumeX";
+    readonly Watch: "watch";
+    readonly Wifi: "wifi";
+    readonly X: "x";
+    readonly XCircle: "xCircle";
+    readonly XSquare: "xSquare";
+    readonly ZoomIn: "zoomIn";
+    readonly ZoomOut: "zoomOut";
+};
+type IconName = (typeof IconName)[keyof typeof IconName];
+/**
+ * Runtime list of all icon names (useful for docs, search, etc.)
+ */
+declare const iconNamesList: ("airplay" | "alertCircle" | "alertOctagon" | "alertTriangle" | "alignCenter" | "alignJustify" | "alignLeft" | "alignRight" | "arrowDown" | "arrowDownCircle" | "arrowDownLeft" | "arrowDownRight" | "arrowIn" | "arrowInCircle" | "arrowInSquare" | "arrowLeft" | "arrowLeftCircle" | "arrowOut" | "arrowOutCircle" | "arrowOutSquare" | "arrowRight" | "arrowRightCircle" | "arrowUp" | "arrowUpCircle" | "arrowUpLeft" | "arrowUpRight" | "atSign" | "barChart" | "barChart2" | "barChart3" | "barChart4" | "bell" | "bluetooth" | "bold" | "bookmark" | "calendar" | "camera" | "cast" | "check" | "checkCircle" | "checkSquare" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "chevronsDown" | "chevronsLeft" | "chevronsRight" | "chevronsUp" | "circle" | "clipboard" | "clock" | "code" | "command" | "compass" | "copy" | "cornerDownLeft" | "cornerDownRight" | "cornerLeftDown" | "cornerLeftUp" | "cornerRightDown" | "cornerRightUp" | "cornerUpLeft" | "cornerUpRight" | "cpu" | "creditCard" | "database" | "delete" | "disc" | "dollarSign" | "download" | "downloadCloud" | "edit" | "edit2" | "edit3" | "expand" | "externalLink" | "eye" | "eyeOff" | "facebook" | "fastForward" | "file" | "fileMinus" | "fileMinus2" | "filePlus" | "filePlus2" | "fileText" | "fileX" | "fileX2" | "film" | "flag" | "folder" | "folderMinus" | "folderMinus2" | "folderPlus" | "folderPlus2" | "folderX" | "folderX2" | "grid" | "hardDrive" | "hash" | "headphones" | "heart" | "helpCircle" | "hexagon" | "home" | "home2" | "image" | "inbox" | "info" | "italic" | "layout" | "layout2" | "layout3" | "layout4" | "layout5" | "layout6" | "lineChart" | "lineChart2" | "link" | "list" | "loader" | "lock" | "mail" | "mapMarker1" | "mapMarker2" | "mapMarker3" | "maximize" | "maximize2" | "menu" | "messageCircle" | "messageSquare" | "mic" | "minimize" | "minimize3" | "minus" | "minusCircle" | "minusSquare" | "monitor" | "moon" | "moreHorizontal" | "moreVertical" | "move" | "music" | "octagon" | "paperclip" | "pause" | "pauseCircle" | "percent" | "phone" | "pieChart" | "pieChart2" | "pieChart3" | "pieChart4" | "pieChart5" | "play" | "playCircle" | "plus" | "plusCircle" | "plusSquare" | "power" | "printer" | "radio" | "refreshCcw" | "refreshCw" | "repeat" | "rewind" | "rotateLeft" | "rotateRight" | "rss" | "save" | "scissors" | "search" | "server" | "settings" | "share" | "shoppingBag" | "shoppingCart" | "shuffle" | "skipBack" | "skipForward" | "slash" | "sliders" | "smartphone" | "speaker" | "square" | "star" | "stopCircle" | "strikethrough" | "sun" | "table" | "table2" | "tablet" | "tag" | "thumbsDown" | "thumbsUp" | "trash" | "trendingDown" | "trendingUp" | "triangle" | "tv" | "twitter" | "type" | "underline" | "unlock" | "upload" | "uploadCloud" | "user" | "userCheck" | "userCircle" | "userMinus" | "userPlus" | "userX" | "users" | "video" | "videoOff" | "volume" | "volume1" | "volume2" | "volumeX" | "watch" | "wifi" | "x" | "xCircle" | "xSquare" | "zoomIn" | "zoomOut")[];
+
+type IconSize = "xs" | "sm" | "md" | "lg";
+type IconStrokeWidth = "xs" | "sm" | "md" | "lg";
+type IconColor = "currentColor" | "primary" | "secondary" | "muted";
+/**
+ * @deprecated Use `iconNamesList` instead
+ */
+declare const iconNames: ("airplay" | "alertCircle" | "alertOctagon" | "alertTriangle" | "alignCenter" | "alignJustify" | "alignLeft" | "alignRight" | "arrowDown" | "arrowDownCircle" | "arrowDownLeft" | "arrowDownRight" | "arrowIn" | "arrowInCircle" | "arrowInSquare" | "arrowLeft" | "arrowLeftCircle" | "arrowOut" | "arrowOutCircle" | "arrowOutSquare" | "arrowRight" | "arrowRightCircle" | "arrowUp" | "arrowUpCircle" | "arrowUpLeft" | "arrowUpRight" | "atSign" | "barChart" | "barChart2" | "barChart3" | "barChart4" | "bell" | "bluetooth" | "bold" | "bookmark" | "calendar" | "camera" | "cast" | "check" | "checkCircle" | "checkSquare" | "chevronDown" | "chevronLeft" | "chevronRight" | "chevronUp" | "chevronsDown" | "chevronsLeft" | "chevronsRight" | "chevronsUp" | "circle" | "clipboard" | "clock" | "code" | "command" | "compass" | "copy" | "cornerDownLeft" | "cornerDownRight" | "cornerLeftDown" | "cornerLeftUp" | "cornerRightDown" | "cornerRightUp" | "cornerUpLeft" | "cornerUpRight" | "cpu" | "creditCard" | "database" | "delete" | "disc" | "dollarSign" | "download" | "downloadCloud" | "edit" | "edit2" | "edit3" | "expand" | "externalLink" | "eye" | "eyeOff" | "facebook" | "fastForward" | "file" | "fileMinus" | "fileMinus2" | "filePlus" | "filePlus2" | "fileText" | "fileX" | "fileX2" | "film" | "flag" | "folder" | "folderMinus" | "folderMinus2" | "folderPlus" | "folderPlus2" | "folderX" | "folderX2" | "grid" | "hardDrive" | "hash" | "headphones" | "heart" | "helpCircle" | "hexagon" | "home" | "home2" | "image" | "inbox" | "info" | "italic" | "layout" | "layout2" | "layout3" | "layout4" | "layout5" | "layout6" | "lineChart" | "lineChart2" | "link" | "list" | "loader" | "lock" | "mail" | "mapMarker1" | "mapMarker2" | "mapMarker3" | "maximize" | "maximize2" | "menu" | "messageCircle" | "messageSquare" | "mic" | "minimize" | "minimize3" | "minus" | "minusCircle" | "minusSquare" | "monitor" | "moon" | "moreHorizontal" | "moreVertical" | "move" | "music" | "octagon" | "paperclip" | "pause" | "pauseCircle" | "percent" | "phone" | "pieChart" | "pieChart2" | "pieChart3" | "pieChart4" | "pieChart5" | "play" | "playCircle" | "plus" | "plusCircle" | "plusSquare" | "power" | "printer" | "radio" | "refreshCcw" | "refreshCw" | "repeat" | "rewind" | "rotateLeft" | "rotateRight" | "rss" | "save" | "scissors" | "search" | "server" | "settings" | "share" | "shoppingBag" | "shoppingCart" | "shuffle" | "skipBack" | "skipForward" | "slash" | "sliders" | "smartphone" | "speaker" | "square" | "star" | "stopCircle" | "strikethrough" | "sun" | "table" | "table2" | "tablet" | "tag" | "thumbsDown" | "thumbsUp" | "trash" | "trendingDown" | "trendingUp" | "triangle" | "tv" | "twitter" | "type" | "underline" | "unlock" | "upload" | "uploadCloud" | "user" | "userCheck" | "userCircle" | "userMinus" | "userPlus" | "userX" | "users" | "video" | "videoOff" | "volume" | "volume1" | "volume2" | "volumeX" | "watch" | "wifi" | "x" | "xCircle" | "xSquare" | "zoomIn" | "zoomOut")[];
+type IconOptions = {
+    name: IconName;
+    size?: IconSize;
+    strokeWidth?: IconStrokeWidth;
+    color?: IconColor;
+    ariaLabel?: string;
+    ariaHidden?: boolean;
+    decorative?: boolean;
+};
+type IconA11yProps = {
+    ariaLabel?: string;
+    ariaHidden?: boolean;
+    role?: "img";
+};
+/**
+ * Valid SVG element types used in icon definitions.
+ * This ensures type safety when rendering icon nodes.
+ */
+type SvgElementType = "path" | "circle" | "line" | "polygon" | "polyline" | "rect" | "ellipse";
+type SvgNode = {
+    tag: SvgElementType;
+    attrs: Record<string, string>;
+};
+type IconRenderKit = {
+    tag: "svg";
+    className: string;
+    vars: CssVars;
+    a11y: IconA11yProps;
+    svg: {
+        viewBox: string;
+        nodes: readonly SvgNode[];
+        width: number;
+        height: number;
+        type: "stroke";
+    };
+};
+
+/**
+ * Button size options.
+ * Use `ButtonSize.md` for type-safe access.
+ */
+declare const ButtonSize: {
+    readonly xs: "xs";
+    readonly sm: "sm";
+    readonly md: "md";
+    readonly lg: "lg";
+};
+type ButtonSize = (typeof ButtonSize)[keyof typeof ButtonSize];
+/**
+ * Button visual variant.
+ * Use `ButtonVariant.primary` for type-safe access.
+ *
+ * @property primary - High-emphasis buttons for primary actions (e.g., "Save", "Submit", "Create").
+ *                    Use sparingly - typically one primary action per view.
+ * @property secondary - Medium-emphasis buttons for secondary actions (e.g., "Cancel", "Back").
+ *                      Good for actions that complement the primary action.
+ * @property text - Low-emphasis buttons for tertiary actions or inline text-like buttons.
+ *                 Minimal visual weight, ideal for less important actions.
+ *
+ * @example
+ * ```tsx
+ * import { ButtonVariant } from "@marwes-ui/core"
+ *
+ * <Button variant={ButtonVariant.primary}>Save</Button>
+ * <Button variant={ButtonVariant.secondary}>Cancel</Button>
+ * ```
+ */
+declare const ButtonVariant: {
+    readonly primary: "primary";
+    readonly secondary: "secondary";
+    readonly text: "text";
+};
+type ButtonVariant = (typeof ButtonVariant)[keyof typeof ButtonVariant];
+/**
+ * Button semantic action for AI-friendly context.
+ * Prefer using semantic components (CancelButton, SubmitButton, etc.) which set this automatically.
+ * Use `ButtonAction.submit` directly only for advanced/dynamic cases.
+ *
+ * These values are used to:
+ * - Set appropriate `data-action` attributes for AI parsing
+ * - Provide semantic context for accessibility tools
+ * - Enable smart defaults in semantic button variants
+ *
+ * @property submit - Form submissions. Automatically sets `type="submit"`. Recommended icon: `IconName.Check`
+ * @property reset - Form resets. Recommended icon: `IconName.RotateLeft`
+ * @property button - Generic button action (default for `<button>` elements)
+ * @property navigate - Navigation/routing actions. Used with `<a>` elements. Recommended icon: `IconName.ArrowRight`
+ * @property delete - Destructive operations (delete, remove). Should trigger confirmation. Recommended icon: `IconName.Trash` or `IconName.Minus`
+ * @property create - Creation actions (add, new). Recommended icon: `IconName.Plus`
+ * @property edit - Edit/modify actions. Recommended icon: `IconName.Edit`
+ * @property cancel - Cancel/dismiss actions. Recommended icon: `IconName.X`
+ *
+ * @example
+ * ```tsx
+ * import { ButtonAction, IconName } from "@marwes-ui/core"
+ *
+ * // For advanced/dynamic use cases:
+ * <Button action={ButtonAction.delete} iconRight={IconName.Trash}>Delete</Button>
+ *
+ * // Prefer semantic variants when possible:
+ * <DangerButton>Delete Project</DangerButton>  // Sets action="delete" automatically
+ * ```
+ */
+declare const ButtonAction: {
+    readonly submit: "submit";
+    readonly reset: "reset";
+    readonly button: "button";
+    readonly navigate: "navigate";
+    readonly delete: "delete";
+    readonly create: "create";
+    readonly edit: "edit";
+    readonly cancel: "cancel";
+};
+type ButtonAction = (typeof ButtonAction)[keyof typeof ButtonAction];
+type ButtonOptions = {
+    as?: "button" | "a";
+    href?: string;
+    size?: ButtonSize;
+    variant?: ButtonVariant;
+    disabled?: boolean;
+    loading?: boolean;
+    error?: boolean;
+    toggle?: boolean;
+    pressed?: boolean;
+    ariaLabel?: string;
+    hasVisibleText?: boolean;
+    ariaExpanded?: boolean;
+    ariaControls?: string;
+    iconLeft?: IconName;
+    iconRight?: IconName;
+    iconOnly?: boolean;
+    action?: ButtonAction;
+    tooltip?: string;
+    confirmation?: boolean;
+    dataAttributes?: Record<string, string | boolean | undefined>;
+};
+type ButtonA11yProps = {
+    ariaLabel?: string;
+    ariaBusy?: boolean;
+    ariaDisabled?: boolean;
+    ariaPressed?: boolean;
+    ariaExpanded?: boolean;
+    ariaControls?: string;
+    title?: string | undefined;
+    disabled?: boolean;
+    type?: "button";
+    href?: string;
+    role?: "button";
+    tabIndex?: 0 | -1;
+};
+type ButtonRenderKit = {
+    tag: "button" | "a";
+    className: string;
+    vars: CssVars;
+    a11y: ButtonA11yProps;
+    blockClick: boolean;
+    dataAttributes?: Record<string, string | boolean | undefined>;
+};
+
+declare function createButtonRecipe(theme: Theme, opts: ButtonOptions): ButtonRenderKit;
+
+/**
+ * Core types for Checkbox.
+ * - Core never renders; it returns a render kit consumed by adapters (React/Vue).
+ * - `indeterminate` is a DOM property (not an HTML attribute) and must be applied by the adapter.
+ */
+
+/** Checkbox state model used by core. */
+type CheckboxState = "checked" | "unchecked" | "mixed";
+/** Public props the adapter can pass into core. */
+type CheckboxProps = {
+    /**
+     * Visual variant hooks (mapped to class modifiers in recipe).
+     * Keep minimal; presets decide styling.
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Controlled state.
+     * If omitted, adapter can use defaultChecked or uncontrolled behavior.
+     */
+    checked?: boolean;
+    /** Uncontrolled initial state. */
+    defaultChecked?: boolean;
+    /** Indeterminate / mixed state. */
+    indeterminate?: boolean;
+    disabled?: boolean;
+    required?: boolean;
+    invalid?: boolean;
+    id?: string;
+    name?: string;
+    value?: string;
+    /** Connects to external label/description elements. */
+    ariaLabel?: string;
+    ariaLabelledBy?: string;
+    ariaDescribedBy?: string;
+};
+/** Strict a11y output (no loose attr maps). */
+type CheckboxA11y = {
+    /** Always "checkbox". */
+    type: "checkbox";
+    /** Standard form attrs. */
+    id?: string;
+    name?: string;
+    value?: string;
+    disabled?: true;
+    required?: true;
+    /** ARIA wiring. */
+    ariaLabel?: string;
+    ariaLabelledBy?: string;
+    ariaDescribedBy?: string;
+    /**
+     * Only set when needed. For mixed state we set "mixed".
+     * For checked/unchecked we omit and rely on native input semantics.
+     */
+    ariaChecked?: "mixed";
+    /**
+     * Only set when invalid. Using aria-invalid is broadly supported.
+     * (Preset/adapters can also add data attrs if desired later.)
+     */
+    ariaInvalid?: true;
+};
+/** Render kit returned from core recipe. */
+type CheckboxRenderKit = {
+    tag: "input";
+    className: string;
+    vars: CssVars;
+    a11y: CheckboxA11y;
+    /**
+     * Adapter must set: el.indeterminate = true/false
+     * (No corresponding HTML attribute.)
+     */
+    indeterminate: boolean;
+    /**
+     * For adapters: if both are set, controlled should win.
+     * Core exposes both so adapters can wire either pattern.
+     */
+    checked?: boolean;
+    defaultChecked?: boolean;
+};
+
+/**
+ * Builds strict a11y output for Checkbox.
+ * - Avoid assigning `undefined` to optional fields (exactOptionalPropertyTypes).
+ */
+
+declare function buildCheckboxA11y(props: CheckboxProps): CheckboxA11y;
+
+/**
+ * Checkbox core recipe:
+ * - returns a render kit for adapters
+ * - stable classnames, modifier classes, css vars, strict a11y
+ */
+
+declare function checkboxRecipe({ theme, disabled, invalid, ...props }: CheckboxProps & {
+    theme: Theme;
+}): CheckboxRenderKit;
+
+/**
+ * Core types for Divider component.
+ * - Core returns a render kit consumed by adapters (React/Vue).
+ * - Supports 7 size variants: xxs/xs/sm/md/lg/xl/xxl (maps to 1px-80px).
+ * - Supports horizontal and vertical orientation.
+ * - Figma reference: node-id=1-932
+ */
+
+/** Size variants for divider thickness/height. */
+type DividerSize = "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
+/** Orientation of the divider. */
+type DividerOrientation = "horizontal" | "vertical";
+/** Public props the adapter can pass into core. */
+type DividerOptions = {
+    /**
+     * Size variant for the divider.
+     * - xxs: 1px
+     * - xs: 8px
+     * - sm: 16px
+     * - md: 32px (default)
+     * - lg: 48px
+     * - xl: 64px
+     * - xxl: 80px
+     */
+    size?: DividerSize;
+    /**
+     * Orientation of the divider.
+     * Default: "horizontal"
+     */
+    orientation?: DividerOrientation;
+    /**
+     * Optional ID.
+     */
+    id?: string;
+};
+/** Strict a11y output for dividers. */
+type DividerA11y = {
+    id?: string;
+    role: "separator";
+    "aria-orientation": "horizontal" | "vertical";
+};
+/** Data attributes for divider. */
+type DividerDataAttributes = {
+    "data-orientation": "horizontal" | "vertical";
+    "data-size": DividerSize;
+};
+/** Render kit output. */
+type DividerRenderKit = {
+    /** Always <hr> tag for semantic separators. */
+    tag: "hr";
+    /** CSS class names. */
+    className: string;
+    /** CSS variables for theming. */
+    vars: CssVars;
+    /** Accessibility props. */
+    a11y: DividerA11y;
+    /** Data attributes for styling hooks. */
+    dataAttributes: DividerDataAttributes;
+};
+
+/**
+ * Divider recipe: theme + options → render kit.
+ * - Supports 7 size variants: xxs/xs/sm/md/lg/xl/xxl (maps to 1px-80px).
+ * - Supports horizontal and vertical orientation.
+ * - Built-in spacing based on divider size.
+ * - Figma reference: node-id=1-932
+ */
+
+declare function createDividerRecipe(theme: Theme, opts?: DividerOptions): DividerRenderKit;
+
 declare const iconRegistry: {
     readonly airplay: {
         readonly viewBox: "0 0 24 24";
@@ -1290,6 +1873,23 @@ declare const iconRegistry: {
             };
         }];
     };
+    readonly eyeOff: {
+        readonly viewBox: "0 0 24 24";
+        readonly nodes: readonly [{
+            readonly tag: "path";
+            readonly attrs: {
+                readonly d: "M17.94 17.94A10.07 10.07 0 0 1 12 20c-7 0-11-8-11-8a18.45 18.45 0 0 1 5.06-5.94M9.9 4.24A9.12 9.12 0 0 1 12 4c7 0 11 8 11 8a18.5 18.5 0 0 1-2.16 3.19m-6.72-1.07a3 3 0 1 1-4.24-4.24";
+            };
+        }, {
+            readonly tag: "line";
+            readonly attrs: {
+                readonly x1: "1";
+                readonly y1: "1";
+                readonly x2: "23";
+                readonly y2: "23";
+            };
+        }];
+    };
     readonly facebook: {
         readonly viewBox: "0 0 24 24";
         readonly nodes: readonly [{
@@ -4005,263 +4605,6 @@ declare const iconRegistry: {
     };
 };
 
-type IconSize = "xs" | "sm" | "md" | "lg";
-type IconStrokeWidth = "xs" | "sm" | "md" | "lg";
-type IconColor = "currentColor" | "primary" | "secondary" | "muted";
-type IconName = keyof typeof iconRegistry;
-declare const iconNames: IconName[];
-type IconOptions = {
-    name: IconName;
-    size?: IconSize;
-    strokeWidth?: IconStrokeWidth;
-    color?: IconColor;
-    ariaLabel?: string;
-    ariaHidden?: boolean;
-    decorative?: boolean;
-};
-type IconA11yProps = {
-    ariaLabel?: string;
-    ariaHidden?: boolean;
-    role?: "img";
-};
-/**
- * Valid SVG element types used in icon definitions.
- * This ensures type safety when rendering icon nodes.
- */
-type SvgElementType = "path" | "circle" | "line" | "polygon" | "polyline" | "rect" | "ellipse";
-type SvgNode = {
-    tag: SvgElementType;
-    attrs: Record<string, string>;
-};
-type IconRenderKit = {
-    tag: "svg";
-    className: string;
-    vars: CssVars;
-    a11y: IconA11yProps;
-    svg: {
-        viewBox: string;
-        nodes: readonly SvgNode[];
-        width: number;
-        height: number;
-        type: "stroke";
-    };
-};
-
-type ButtonSize = "xs" | "sm" | "md" | "lg";
-type ButtonTone = "primary" | "secondary" | "text";
-type ButtonOptions = {
-    as?: "button" | "a";
-    href?: string;
-    size?: ButtonSize;
-    tone?: ButtonTone;
-    disabled?: boolean;
-    loading?: boolean;
-    error?: boolean;
-    toggle?: boolean;
-    pressed?: boolean;
-    ariaLabel?: string;
-    hasVisibleText?: boolean;
-    ariaExpanded?: boolean;
-    ariaControls?: string;
-    iconLeft?: IconName;
-    iconRight?: IconName;
-    iconOnly?: boolean;
-    action?: "submit" | "reset" | "button" | "navigate" | "delete" | "create" | "edit" | "cancel";
-    tooltip?: string;
-    confirmation?: boolean;
-    dataAttributes?: Record<string, string | boolean | undefined>;
-};
-type ButtonA11yProps = {
-    ariaLabel?: string;
-    ariaBusy?: boolean;
-    ariaDisabled?: boolean;
-    ariaPressed?: boolean;
-    ariaExpanded?: boolean;
-    ariaControls?: string;
-    title?: string | undefined;
-    disabled?: boolean;
-    type?: "button";
-    href?: string;
-    role?: "button";
-    tabIndex?: 0 | -1;
-};
-type ButtonRenderKit = {
-    tag: "button" | "a";
-    className: string;
-    vars: CssVars;
-    a11y: ButtonA11yProps;
-    blockClick: boolean;
-    dataAttributes?: Record<string, string | boolean | undefined>;
-};
-
-declare function createButtonRecipe(theme: Theme, opts: ButtonOptions): ButtonRenderKit;
-
-/**
- * Core types for Checkbox.
- * - Core never renders; it returns a render kit consumed by adapters (React/Vue).
- * - `indeterminate` is a DOM property (not an HTML attribute) and must be applied by the adapter.
- */
-
-/** Checkbox state model used by core. */
-type CheckboxState = "checked" | "unchecked" | "mixed";
-/** Public props the adapter can pass into core. */
-type CheckboxProps = {
-    /**
-     * Visual variant hooks (mapped to class modifiers in recipe).
-     * Keep minimal; presets decide styling.
-     */
-    size?: "sm" | "md" | "lg";
-    /**
-     * Controlled state.
-     * If omitted, adapter can use defaultChecked or uncontrolled behavior.
-     */
-    checked?: boolean;
-    /** Uncontrolled initial state. */
-    defaultChecked?: boolean;
-    /** Indeterminate / mixed state. */
-    indeterminate?: boolean;
-    disabled?: boolean;
-    required?: boolean;
-    invalid?: boolean;
-    id?: string;
-    name?: string;
-    value?: string;
-    /** Connects to external label/description elements. */
-    ariaLabel?: string;
-    ariaLabelledBy?: string;
-    ariaDescribedBy?: string;
-};
-/** Strict a11y output (no loose attr maps). */
-type CheckboxA11y = {
-    /** Always "checkbox". */
-    type: "checkbox";
-    /** Standard form attrs. */
-    id?: string;
-    name?: string;
-    value?: string;
-    disabled?: true;
-    required?: true;
-    /** ARIA wiring. */
-    ariaLabel?: string;
-    ariaLabelledBy?: string;
-    ariaDescribedBy?: string;
-    /**
-     * Only set when needed. For mixed state we set "mixed".
-     * For checked/unchecked we omit and rely on native input semantics.
-     */
-    ariaChecked?: "mixed";
-    /**
-     * Only set when invalid. Using aria-invalid is broadly supported.
-     * (Preset/adapters can also add data attrs if desired later.)
-     */
-    ariaInvalid?: true;
-};
-/** Render kit returned from core recipe. */
-type CheckboxRenderKit = {
-    tag: "input";
-    className: string;
-    vars: CssVars;
-    a11y: CheckboxA11y;
-    /**
-     * Adapter must set: el.indeterminate = true/false
-     * (No corresponding HTML attribute.)
-     */
-    indeterminate: boolean;
-    /**
-     * For adapters: if both are set, controlled should win.
-     * Core exposes both so adapters can wire either pattern.
-     */
-    checked?: boolean;
-    defaultChecked?: boolean;
-};
-
-/**
- * Builds strict a11y output for Checkbox.
- * - Avoid assigning `undefined` to optional fields (exactOptionalPropertyTypes).
- */
-
-declare function buildCheckboxA11y(props: CheckboxProps): CheckboxA11y;
-
-/**
- * Checkbox core recipe:
- * - returns a render kit for adapters
- * - stable classnames, modifier classes, css vars, strict a11y
- */
-
-declare function checkboxRecipe({ theme, disabled, invalid, ...props }: CheckboxProps & {
-    theme: Theme;
-}): CheckboxRenderKit;
-
-/**
- * Core types for Divider component.
- * - Core returns a render kit consumed by adapters (React/Vue).
- * - Supports 7 size variants: xxs/xs/sm/md/lg/xl/xxl (maps to 1px-80px).
- * - Supports horizontal and vertical orientation.
- * - Figma reference: node-id=1-932
- */
-
-/** Size variants for divider thickness/height. */
-type DividerSize = "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "xxl";
-/** Orientation of the divider. */
-type DividerOrientation = "horizontal" | "vertical";
-/** Public props the adapter can pass into core. */
-type DividerOptions = {
-    /**
-     * Size variant for the divider.
-     * - xxs: 1px
-     * - xs: 8px
-     * - sm: 16px
-     * - md: 32px (default)
-     * - lg: 48px
-     * - xl: 64px
-     * - xxl: 80px
-     */
-    size?: DividerSize;
-    /**
-     * Orientation of the divider.
-     * Default: "horizontal"
-     */
-    orientation?: DividerOrientation;
-    /**
-     * Optional ID.
-     */
-    id?: string;
-};
-/** Strict a11y output for dividers. */
-type DividerA11y = {
-    id?: string;
-    role: "separator";
-    "aria-orientation": "horizontal" | "vertical";
-};
-/** Data attributes for divider. */
-type DividerDataAttributes = {
-    "data-orientation": "horizontal" | "vertical";
-    "data-size": DividerSize;
-};
-/** Render kit output. */
-type DividerRenderKit = {
-    /** Always <hr> tag for semantic separators. */
-    tag: "hr";
-    /** CSS class names. */
-    className: string;
-    /** CSS variables for theming. */
-    vars: CssVars;
-    /** Accessibility props. */
-    a11y: DividerA11y;
-    /** Data attributes for styling hooks. */
-    dataAttributes: DividerDataAttributes;
-};
-
-/**
- * Divider recipe: theme + options → render kit.
- * - Supports 7 size variants: xxs/xs/sm/md/lg/xl/xxl (maps to 1px-80px).
- * - Supports horizontal and vertical orientation.
- * - Built-in spacing based on divider size.
- * - Figma reference: node-id=1-932
- */
-
-declare function createDividerRecipe(theme: Theme, opts?: DividerOptions): DividerRenderKit;
-
 declare const iconSizeScale: {
     readonly xs: 16;
     readonly sm: 24;
@@ -4432,4 +4775,4 @@ type ParagraphRenderKit = {
 
 declare function paragraphRecipe(opts: ParagraphOptions, theme: Theme): ParagraphRenderKit;
 
-export { type ButtonA11yProps, type ButtonOptions, type ButtonRenderKit, type ButtonSize, type ButtonTone, type CheckboxA11y, type CheckboxProps, type CheckboxRenderKit, type CheckboxState, type CssVars, type DividerA11y, type DividerDataAttributes, type DividerOptions, type DividerOrientation, type DividerRenderKit, type DividerSize, type HeadingA11y, type HeadingLevel, type HeadingOptions, type HeadingRenderKit, type HeadingSize, type IconA11yProps, type IconColor, type IconName, type IconOptions, type IconPreset, type IconRenderKit, type IconSize, type IconSizeKey, type IconStrokeWidth, type IconStrokeWidthKey, type InputA11yProps, type InputOptions, type InputRenderKit, type InputTone, type ParagraphA11y, type ParagraphOptions, type ParagraphRenderKit, type ParagraphSize, type Preset, type SvgElementType, type SvgNode, type System, type Theme, type ThemeMode, type ThemeOverrides, buildCheckboxA11y, buildHeadingA11y, checkboxRecipe, createButtonRecipe, createDividerRecipe, createIconRecipe, createInputRecipe, createSystem, darkThemeDefaults, defaultTheme, headingRecipe, iconNames, iconRegistry, iconSizeScale, iconStrokeWidthScale, lightThemeDefaults, mergeTheme, normalizeTheme, paragraphRecipe, resolveIconSize, resolveIconStrokeWidth, switchMode };
+export { type ButtonA11yProps, ButtonAction, type ButtonOptions, type ButtonRenderKit, ButtonSize, ButtonVariant, type CheckboxA11y, type CheckboxProps, type CheckboxRenderKit, type CheckboxState, type CssVars, type DividerA11y, type DividerDataAttributes, type DividerOptions, type DividerOrientation, type DividerRenderKit, type DividerSize, type HeadingA11y, type HeadingLevel, type HeadingOptions, type HeadingRenderKit, type HeadingSize, type IconA11yProps, type IconColor, IconName, IconName as IconNameType, type IconOptions, type IconPreset, type IconRenderKit, type IconSize, type IconSizeKey, type IconStrokeWidth, type IconStrokeWidthKey, type InputA11yProps, type InputOptions, type InputRenderKit, type InputTone, type ParagraphA11y, type ParagraphOptions, type ParagraphRenderKit, type ParagraphSize, type Preset, type SvgElementType, type SvgNode, type System, type Theme, type ThemeMode, type ThemeOverrides, buildCheckboxA11y, buildHeadingA11y, checkboxRecipe, createButtonRecipe, createDividerRecipe, createIconRecipe, createInputRecipe, createSystem, darkThemeDefaults, defaultTheme, headingRecipe, iconNames, iconNamesList, iconRegistry, iconSizeScale, iconStrokeWidthScale, lightThemeDefaults, mergeTheme, normalizeTheme, paragraphRecipe, resolveIconSize, resolveIconStrokeWidth, switchMode };