pixelize-design-library 2.3.1-beta.1 → 2.3.1-beta.10

package/dist/components-v2/NavigationBar/NavigationBar.js

@@ -1,148 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NavigationBar = NavigationBar;
-const React = __importStar(require("react"));
-const lucide_react_1 = require("lucide-react");
-const utils_1 = require("../../lib/utils");
-const ThemeProvider_1 = require("../../theme-v2/ThemeProvider");
-const avatar_1 = require("../ui/avatar");
-const button_1 = require("../ui/button");
-const dialog_1 = require("../ui/dialog");
-const dropdown_menu_1 = require("../ui/dropdown-menu");
-const input_1 = require("../ui/input");
-const Breadcrumbs_1 = require("../Breadcrumbs/Breadcrumbs");
-function NavigationBar({ logo, appName, onSidebarToggle, sidebarOpen, breadcrumb, pageTitle, backAction, actions, user, userMenuItems = [], onLogout, logoutLabel = "Sign out", notificationCount, notificationIcon, onNotificationClick, globalSearch, showThemeSwitcher = false, className, }) {
-    var _a, _b, _c;
-    const [searchOpen, setSearchOpen] = React.useState(false);
-    const [searchQuery, setSearchQuery] = React.useState("");
-    const submitSearch = (event) => {
-        var _a;
-        event === null || event === void 0 ? void 0 : event.preventDefault();
-        (_a = globalSearch === null || globalSearch === void 0 ? void 0 : globalSearch.onSearch) === null || _a === void 0 ? void 0 : _a.call(globalSearch, searchQuery);
-    };
-    const NotificationIcon = notificationIcon !== null && notificationIcon !== void 0 ? notificationIcon : lucide_react_1.Bell;
-    const showNotification = onNotificationClick !== undefined ||
-        typeof notificationCount === "number";
-    return (React.createElement("header", { role: "banner", className: (0, utils_1.cn)("sticky top-0 z-40 flex h-14 shrink-0 items-center gap-2 border-b border-border bg-background px-3", className) },
-        onSidebarToggle && (React.createElement("button", { type: "button", "aria-label": sidebarOpen ? "Close sidebar" : "Open sidebar", "aria-expanded": sidebarOpen, onClick: onSidebarToggle, className: "inline-flex h-9 w-9 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring md:hidden" },
-            React.createElement(lucide_react_1.Menu, { "aria-hidden": "true", className: "h-5 w-5" }))),
-        (logo || appName) && (React.createElement("div", { className: "flex items-center gap-2 md:hidden" },
-            logo ? (React.createElement("img", { src: logo, alt: "", className: "h-6 w-6 rounded-sm object-contain" })) : null,
-            appName && (React.createElement("span", { className: "text-sm font-semibold text-foreground" }, appName)))),
-        backAction && (React.createElement("button", { type: "button", onClick: backAction.onClick, "aria-label": (_a = backAction.label) !== null && _a !== void 0 ? _a : "Go back", className: "inline-flex items-center gap-1 rounded-md px-2 py-1 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" },
-            React.createElement(lucide_react_1.ChevronLeft, { "aria-hidden": "true", className: "h-4 w-4" }),
-            backAction.label && (React.createElement("span", { className: "hidden sm:inline" }, backAction.label)))),
-        React.createElement("div", { className: "min-w-0 flex-1" }, breadcrumb && breadcrumb.length > 0 ? (React.createElement(Breadcrumbs_1.Breadcrumbs, { items: breadcrumb, maxItems: 4 })) : pageTitle ? (React.createElement("h1", { className: "truncate text-sm font-semibold text-foreground" }, pageTitle)) : null),
-        React.createElement("nav", { "aria-label": "Global", className: "flex items-center gap-1" },
-            globalSearch && (React.createElement("button", { type: "button", onClick: () => setSearchOpen(true), "aria-label": "Open search", className: "hidden h-9 items-center gap-2 rounded-md border border-input bg-background px-2.5 text-sm text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:inline-flex" },
-                React.createElement(lucide_react_1.Search, { "aria-hidden": "true", className: "h-4 w-4" }),
-                React.createElement("span", { className: "hidden md:inline" }, (_b = globalSearch.placeholder) !== null && _b !== void 0 ? _b : "Search…"),
-                globalSearch.shortcut && (React.createElement("kbd", { className: "ml-1 rounded border border-border bg-muted px-1 text-[10px] font-medium text-muted-foreground" }, globalSearch.shortcut)))),
-            globalSearch && (React.createElement("button", { type: "button", onClick: () => setSearchOpen(true), "aria-label": "Open search", className: "inline-flex h-9 w-9 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:hidden" },
-                React.createElement(lucide_react_1.Search, { "aria-hidden": "true", className: "h-5 w-5" }))),
-            actions,
-            showThemeSwitcher && React.createElement(ThemeSwitcher, null),
-            showNotification && (React.createElement("button", { type: "button", onClick: onNotificationClick, "aria-label": typeof notificationCount === "number" && notificationCount > 0
-                    ? `Notifications (${notificationCount} unread)`
-                    : "Notifications", className: "relative inline-flex h-9 w-9 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" },
-                React.createElement(NotificationIcon, { "aria-hidden": "true", className: "h-5 w-5" }),
-                typeof notificationCount === "number" && notificationCount > 0 && (React.createElement("span", { "aria-hidden": "true", className: "absolute right-1 top-1 inline-flex min-w-[16px] items-center justify-center rounded-full bg-destructive px-1 text-[10px] font-semibold leading-none text-destructive-foreground" }, notificationCount > 99 ? "99+" : notificationCount)))),
-            user && (React.createElement(UserMenu, { user: user, items: userMenuItems, onLogout: onLogout, logoutLabel: logoutLabel }))),
-        globalSearch && (React.createElement(dialog_1.Dialog, { open: searchOpen, onOpenChange: setSearchOpen },
-            React.createElement(dialog_1.DialogContent, { size: "lg", className: "top-[25%] gap-3" },
-                React.createElement(dialog_1.DialogHeader, null,
-                    React.createElement(dialog_1.DialogTitle, null, "Search")),
-                React.createElement("form", { onSubmit: submitSearch, className: "flex gap-2" },
-                    React.createElement(input_1.Input, { autoFocus: true, value: searchQuery, onChange: (event) => setSearchQuery(event.target.value), placeholder: (_c = globalSearch.placeholder) !== null && _c !== void 0 ? _c : "Search…", size: "lg" }),
-                    React.createElement(button_1.Button, { type: "submit", size: "lg" }, "Go")))))));
-}
-function UserMenu({ user, items, onLogout, logoutLabel, }) {
-    var _a;
-    const initials = (_a = user.initials) !== null && _a !== void 0 ? _a : user.name
-        .split(/\s+/)
-        .map((part) => part[0])
-        .filter(Boolean)
-        .slice(0, 2)
-        .join("")
-        .toUpperCase();
-    return (React.createElement(dropdown_menu_1.DropdownMenu, null,
-        React.createElement(dropdown_menu_1.DropdownMenuTrigger, { asChild: true },
-            React.createElement("button", { type: "button", "aria-label": `Account menu for ${user.name}`, className: "ml-1 rounded-full focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background" },
-                React.createElement(avatar_1.Avatar, { size: "sm" },
-                    user.avatarUrl && (React.createElement(avatar_1.AvatarImage, { src: user.avatarUrl, alt: user.name })),
-                    React.createElement(avatar_1.AvatarFallback, null, initials || "?")))),
-        React.createElement(dropdown_menu_1.DropdownMenuContent, { align: "end", className: "w-56" },
-            React.createElement("div", { className: "px-2 py-1.5" },
-                React.createElement("p", { className: "truncate text-sm font-medium text-foreground" }, user.name),
-                user.email && (React.createElement("p", { className: "truncate text-xs text-muted-foreground" }, user.email))),
-            items.length > 0 && React.createElement(dropdown_menu_1.DropdownMenuSeparator, null),
-            items.map((item, index) => (React.createElement(React.Fragment, { key: `${item.label}-${index}` },
-                item.separator && React.createElement(dropdown_menu_1.DropdownMenuSeparator, null),
-                item.href ? (React.createElement(dropdown_menu_1.DropdownMenuItem, { asChild: true },
-                    React.createElement("a", { href: item.href, className: (0, utils_1.cn)(item.variant === "destructive" &&
-                            "text-destructive focus:text-destructive") },
-                        item.icon,
-                        item.label))) : (React.createElement(dropdown_menu_1.DropdownMenuItem, { onClick: item.onClick, className: (0, utils_1.cn)(item.variant === "destructive" &&
-                        "text-destructive focus:text-destructive") },
-                    item.icon,
-                    item.label))))),
-            onLogout && (React.createElement(React.Fragment, null,
-                React.createElement(dropdown_menu_1.DropdownMenuSeparator, null),
-                React.createElement(dropdown_menu_1.DropdownMenuItem, { onClick: onLogout, className: "text-destructive focus:text-destructive" },
-                    React.createElement(lucide_react_1.LogOut, { "aria-hidden": "true", className: "h-4 w-4" }),
-                    logoutLabel))))));
-}
-function ThemeSwitcher() {
-    const { mode, setMode } = (0, ThemeProvider_1.useTheme)();
-    const Icon = mode === "dark" ? lucide_react_1.Moon : mode === "light" ? lucide_react_1.Sun : lucide_react_1.Monitor;
-    return (React.createElement(dropdown_menu_1.DropdownMenu, null,
-        React.createElement(dropdown_menu_1.DropdownMenuTrigger, { asChild: true },
-            React.createElement("button", { type: "button", "aria-label": "Change theme", className: "inline-flex h-9 w-9 items-center justify-center rounded-md text-muted-foreground transition-colors hover:bg-accent hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" },
-                React.createElement(Icon, { "aria-hidden": "true", className: "h-5 w-5" }))),
-        React.createElement(dropdown_menu_1.DropdownMenuContent, { align: "end", className: "w-40" },
-            React.createElement(dropdown_menu_1.DropdownMenuLabel, null, "Theme"),
-            React.createElement(dropdown_menu_1.DropdownMenuSeparator, null),
-            React.createElement(dropdown_menu_1.DropdownMenuRadioGroup, { value: mode, onValueChange: (value) => setMode(value) },
-                React.createElement(dropdown_menu_1.DropdownMenuRadioItem, { value: "light" },
-                    React.createElement(lucide_react_1.Sun, { "aria-hidden": "true", className: "h-4 w-4" }),
-                    "Light"),
-                React.createElement(dropdown_menu_1.DropdownMenuRadioItem, { value: "dark" },
-                    React.createElement(lucide_react_1.Moon, { "aria-hidden": "true", className: "h-4 w-4" }),
-                    "Dark"),
-                React.createElement(dropdown_menu_1.DropdownMenuRadioItem, { value: "system" },
-                    React.createElement(lucide_react_1.Monitor, { "aria-hidden": "true", className: "h-4 w-4" }),
-                    "System")))));
-}

package/dist/components-v2/Notification/Notification.d.ts

@@ -1,22 +0,0 @@
-import * as React from "react";
-export type NotificationType = "info" | "success" | "warning" | "error";
-export interface NotificationProps extends Omit<React.HTMLAttributes<HTMLDivElement>, "title"> {
-    title: React.ReactNode;
-    description?: React.ReactNode;
-    /** Absolute timestamp, ISO string, or pre-formatted string. */
-    timestamp?: Date | string;
-    /** When false, the item is rendered with the "unread" indicator. */
-    read?: boolean;
-    onRead?: () => void;
-    onDismiss?: () => void;
-    type?: NotificationType;
-    /** Inline avatar (URL or initials). */
-    avatar?: {
-        src?: string;
-        initials?: string;
-        alt?: string;
-    };
-    /** Action row below the description. */
-    actions?: React.ReactNode;
-}
-export declare const Notification: React.ForwardRefExoticComponent<NotificationProps & React.RefAttributes<HTMLDivElement>>;

package/dist/components-v2/Notification/Notification.js

@@ -1,113 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-var __rest = (this && this.__rest) || function (s, e) {
-    var t = {};
-    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
-        t[p] = s[p];
-    if (s != null && typeof Object.getOwnPropertySymbols === "function")
-        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
-            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
-                t[p[i]] = s[p[i]];
-        }
-    return t;
-};
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.Notification = void 0;
-const React = __importStar(require("react"));
-const lucide_react_1 = require("lucide-react");
-const utils_1 = require("../../lib/utils");
-const avatar_1 = require("../ui/avatar");
-const TYPE_STYLES = {
-    info: {
-        border: "border-l-primary",
-        bg: "bg-primary/5",
-        icon: React.createElement(lucide_react_1.Info, { "aria-hidden": "true", className: "h-4 w-4 text-primary" }),
-    },
-    success: {
-        border: "border-l-success",
-        bg: "bg-success/5",
-        icon: React.createElement(lucide_react_1.CheckCircle2, { "aria-hidden": "true", className: "h-4 w-4 text-success" }),
-    },
-    warning: {
-        border: "border-l-warning",
-        bg: "bg-warning/5",
-        icon: React.createElement(lucide_react_1.AlertTriangle, { "aria-hidden": "true", className: "h-4 w-4 text-warning" }),
-    },
-    error: {
-        border: "border-l-destructive",
-        bg: "bg-destructive/5",
-        icon: React.createElement(lucide_react_1.AlertCircle, { "aria-hidden": "true", className: "h-4 w-4 text-destructive" }),
-    },
-};
-function formatTimestamp(value) {
-    const date = value instanceof Date ? value : new Date(value);
-    if (Number.isNaN(date.getTime()))
-        return String(value);
-    return date.toLocaleString(undefined, {
-        month: "short",
-        day: "numeric",
-        hour: "numeric",
-        minute: "2-digit",
-    });
-}
-exports.Notification = React.forwardRef((_a, ref) => {
-    var _b, _c;
-    var { className, title, description, timestamp, read = false, onRead, onDismiss, type = "info", avatar, actions, onClick } = _a, rest = __rest(_a, ["className", "title", "description", "timestamp", "read", "onRead", "onDismiss", "type", "avatar", "actions", "onClick"]);
-    const styles = TYPE_STYLES[type];
-    const handleClick = (event) => {
-        if (!read)
-            onRead === null || onRead === void 0 ? void 0 : onRead();
-        onClick === null || onClick === void 0 ? void 0 : onClick(event);
-    };
-    return (React.createElement("div", Object.assign({ ref: ref, role: "article", "aria-live": !read ? "polite" : undefined, onClick: handleClick, className: (0, utils_1.cn)("relative flex gap-3 border-l-2 p-3 transition-colors", "hover:bg-accent/40", read ? "border-l-transparent" : (0, utils_1.cn)(styles.border, styles.bg), onClick && "cursor-pointer", className) }, rest),
-        avatar ? (React.createElement(avatar_1.Avatar, { size: "sm" },
-            avatar.src && (React.createElement(avatar_1.AvatarImage, { src: avatar.src, alt: (_b = avatar.alt) !== null && _b !== void 0 ? _b : "" })),
-            React.createElement(avatar_1.AvatarFallback, null, (_c = avatar.initials) !== null && _c !== void 0 ? _c : "?"))) : (React.createElement("span", { className: "mt-0.5 inline-flex h-6 w-6 shrink-0 items-center justify-center rounded-full bg-card" }, styles.icon)),
-        React.createElement("div", { className: "min-w-0 flex-1" },
-            React.createElement("div", { className: "flex items-start justify-between gap-2" },
-                React.createElement("p", { className: (0, utils_1.cn)("text-sm", read
-                        ? "font-medium text-muted-foreground"
-                        : "font-semibold text-foreground") }, title),
-                timestamp && (React.createElement("time", { className: "shrink-0 text-[11px] text-muted-foreground" }, formatTimestamp(timestamp)))),
-            description && (React.createElement("p", { className: "mt-0.5 text-sm text-muted-foreground" }, description)),
-            actions && React.createElement("div", { className: "mt-2 flex gap-2" }, actions)),
-        !read && (React.createElement("span", { "aria-label": "Unread", className: "absolute right-3 top-3 h-2 w-2 rounded-full bg-primary" })),
-        onDismiss && (React.createElement("button", { type: "button", "aria-label": "Dismiss notification", onClick: (event) => {
-                event.stopPropagation();
-                onDismiss();
-            }, className: "absolute bottom-2 right-2 rounded-sm text-muted-foreground opacity-0 transition-opacity hover:text-foreground focus-visible:opacity-100 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring group-hover:opacity-100" },
-            React.createElement(lucide_react_1.X, { "aria-hidden": "true", className: "h-3.5 w-3.5" })))));
-});
-exports.Notification.displayName = "Notification";

package/dist/components-v2/NumberInput/NumberInput.d.ts

@@ -1,37 +0,0 @@
-import * as React from "react";
-export type NumberInputSize = "sm" | "md" | "lg";
-export interface NumberInputProps {
-    id?: string;
-    name?: string;
-    label?: React.ReactNode;
-    placeholder?: string;
-    value?: number | null;
-    defaultValue?: number | null;
-    onChange?: (value: number | null) => void;
-    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
-    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
-    min?: number;
-    max?: number;
-    step?: number;
-    /** Decimal places — applied on clamp/blur. */
-    precision?: number;
-    /** Custom display formatter (e.g. currency). Called when input isn't focused. */
-    format?: (value: number) => string;
-    /** Inverse of format. Receives the raw input string. Return NaN to reject. */
-    parse?: (raw: string) => number;
-    helperText?: React.ReactNode;
-    error?: boolean;
-    errorMessage?: React.ReactNode;
-    isInformation?: boolean;
-    informationMessage?: React.ReactNode;
-    isDisabled?: boolean;
-    isReadOnly?: boolean;
-    isRequired?: boolean;
-    size?: NumberInputSize;
-    width?: string;
-    className?: string;
-    autoFocus?: boolean;
-    /** Hide the +/- stepper buttons. */
-    hideSteppers?: boolean;
-}
-export declare const NumberInput: React.ForwardRefExoticComponent<NumberInputProps & React.RefAttributes<HTMLInputElement>>;

package/dist/components-v2/NumberInput/NumberInput.js

@@ -1,210 +0,0 @@
-"use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || (function () {
-    var ownKeys = function(o) {
-        ownKeys = Object.getOwnPropertyNames || function (o) {
-            var ar = [];
-            for (var k in o) if (Object.prototype.hasOwnProperty.call(o, k)) ar[ar.length] = k;
-            return ar;
-        };
-        return ownKeys(o);
-    };
-    return function (mod) {
-        if (mod && mod.__esModule) return mod;
-        var result = {};
-        if (mod != null) for (var k = ownKeys(mod), i = 0; i < k.length; i++) if (k[i] !== "default") __createBinding(result, mod, k[i]);
-        __setModuleDefault(result, mod);
-        return result;
-    };
-})();
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.NumberInput = void 0;
-const React = __importStar(require("react"));
-const lucide_react_1 = require("lucide-react");
-const utils_1 = require("../../lib/utils");
-const field_1 = require("../ui/field");
-const input_1 = require("../ui/input");
-const form_field_1 = require("../ui/form-field");
-const STEPPER_SIZE = {
-    sm: "w-5",
-    md: "w-6",
-    lg: "w-7",
-};
-const STEPPER_ICON = {
-    sm: "h-2.5 w-2.5",
-    md: "h-3 w-3",
-    lg: "h-3.5 w-3.5",
-};
-function clamp(value, min, max) {
-    if (typeof min === "number" && value < min)
-        return min;
-    if (typeof max === "number" && value > max)
-        return max;
-    return value;
-}
-function roundTo(value, precision) {
-    const factor = 10 ** precision;
-    return Math.round(value * factor) / factor;
-}
-function defaultParse(raw) {
-    if (raw.trim() === "")
-        return NaN;
-    const cleaned = raw.replace(/[^\d.\-+eE]/g, "");
-    return parseFloat(cleaned);
-}
-function defaultFormat(value, precision) {
-    if (Number.isNaN(value))
-        return "";
-    if (typeof precision === "number")
-        return value.toFixed(precision);
-    return String(value);
-}
-exports.NumberInput = React.forwardRef((props, ref) => {
-    const { id, label, placeholder, value, defaultValue, onChange, onBlur, onFocus, min, max, step = 1, precision, format, parse = defaultParse, helperText, error = false, errorMessage, isInformation, informationMessage, isDisabled, isReadOnly, isRequired, size = "md", width, className, autoFocus, hideSteppers = false, name, } = props;
-    return (React.createElement(field_1.Field, { id: id, label: label, isRequired: isRequired, isInformation: isInformation, informationMessage: informationMessage, helperText: helperText, error: error, errorMessage: errorMessage, width: width },
-        React.createElement(NumberInputControl, { ref: ref, name: name, placeholder: placeholder, value: value, defaultValue: defaultValue, onChange: onChange, onBlur: onBlur, onFocus: onFocus, min: min, max: max, step: step, precision: precision, format: format, parse: parse, isDisabled: isDisabled, isReadOnly: isReadOnly, error: error, size: size, className: className, autoFocus: autoFocus, hideSteppers: hideSteppers })));
-});
-exports.NumberInput.displayName = "NumberInput";
-const NumberInputControl = React.forwardRef(({ placeholder, value, defaultValue, onChange, onBlur, onFocus, min, max, step = 1, precision, format, parse = defaultParse, isDisabled, isReadOnly, error = false, size = "md", className, autoFocus, hideSteppers = false, name, }, ref) => {
-    const field = (0, form_field_1.useFormField)();
-    const [draft, setDraft] = React.useState(() => {
-        const initial = typeof value === "number"
-            ? value
-            : typeof defaultValue === "number"
-                ? defaultValue
-                : null;
-        return initial === null ? "" : (format
-            ? format(initial)
-            : defaultFormat(initial, precision));
-    });
-    const [focused, setFocused] = React.useState(false);
-    React.useEffect(() => {
-        if (focused)
-            return;
-        if (value === undefined)
-            return;
-        setDraft(value === null
-            ? ""
-            : format
-                ? format(value)
-                : defaultFormat(value, precision));
-    }, [value, focused, format, precision]);
-    const innerRef = React.useRef(null);
-    const setRefs = React.useCallback((node) => {
-        innerRef.current = node;
-        if (typeof ref === "function")
-            ref(node);
-        else if (ref)
-            ref.current =
-                node;
-    }, [ref]);
-    const commit = (next) => {
-        const formatted = next === null
-            ? ""
-            : format
-                ? format(next)
-                : defaultFormat(next, precision);
-        setDraft(formatted);
-        onChange === null || onChange === void 0 ? void 0 : onChange(next);
-    };
-    const adjustBy = (delta) => {
-        if (isDisabled || isReadOnly)
-            return;
-        const parsed = parse(draft);
-        const base = Number.isNaN(parsed) ? min !== null && min !== void 0 ? min : 0 : parsed;
-        let next = base + delta * step;
-        if (typeof precision === "number")
-            next = roundTo(next, precision);
-        next = clamp(next, min, max);
-        commit(next);
-    };
-    const handleChange = (event) => {
-        setDraft(event.target.value);
-        const parsed = parse(event.target.value);
-        if (Number.isNaN(parsed)) {
-            if (event.target.value === "")
-                onChange === null || onChange === void 0 ? void 0 : onChange(null);
-        }
-        else {
-            onChange === null || onChange === void 0 ? void 0 : onChange(parsed);
-        }
-    };
-    const handleBlur = (event) => {
-        setFocused(false);
-        const parsed = parse(draft);
-        if (Number.isNaN(parsed)) {
-            if (draft.trim() === "")
-                commit(null);
-            else
-                commit(value !== null && value !== void 0 ? value : null);
-        }
-        else {
-            let next = parsed;
-            if (typeof precision === "number")
-                next = roundTo(next, precision);
-            next = clamp(next, min, max);
-            commit(next);
-        }
-        onBlur === null || onBlur === void 0 ? void 0 : onBlur(event);
-    };
-    const handleFocus = (event) => {
-        setFocused(true);
-        const parsed = parse(draft);
-        if (!Number.isNaN(parsed)) {
-            setDraft(defaultFormat(parsed, precision));
-        }
-        onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);
-    };
-    const handleKeyDown = (event) => {
-        if (event.key === "ArrowUp") {
-            event.preventDefault();
-            adjustBy(event.shiftKey ? 10 : 1);
-        }
-        else if (event.key === "ArrowDown") {
-            event.preventDefault();
-            adjustBy(event.shiftKey ? -10 : -1);
-        }
-    };
-    const atMin = typeof min === "number" && parseSafe(draft) <= min;
-    const atMax = typeof max === "number" && parseSafe(draft) >= max;
-    return (React.createElement("div", { className: (0, utils_1.cn)("relative", className) },
-        React.createElement(input_1.Input, { ref: setRefs, name: name, type: "text", inputMode: "decimal", placeholder: placeholder, value: draft, onChange: handleChange, onBlur: handleBlur, onFocus: handleFocus, onKeyDown: handleKeyDown, disabled: isDisabled, readOnly: isReadOnly, autoFocus: autoFocus, size: size, "aria-invalid": error || field.hasError || undefined, role: "spinbutton", "aria-valuemin": min, "aria-valuemax": max, "aria-valuenow": typeof value === "number" ? value : undefined, className: (0, utils_1.cn)(!hideSteppers && stepperPadding(size), "tabular-nums", error &&
-                "border-destructive bg-destructive/5 focus-visible:ring-destructive") }),
-        !hideSteppers && (React.createElement("div", { className: (0, utils_1.cn)("pointer-events-none absolute inset-y-0 right-0 flex flex-col border-l border-input", STEPPER_SIZE[size]), "aria-hidden": "true" },
-            React.createElement(StepperButton, { label: "Increment", disabled: isDisabled || isReadOnly || atMax, onClick: () => adjustBy(1), size: size, position: "top" },
-                React.createElement(lucide_react_1.ChevronUp, { className: STEPPER_ICON[size] })),
-            React.createElement(StepperButton, { label: "Decrement", disabled: isDisabled || isReadOnly || atMin, onClick: () => adjustBy(-1), size: size, position: "bottom" },
-                React.createElement(lucide_react_1.ChevronDown, { className: STEPPER_ICON[size] }))))));
-});
-NumberInputControl.displayName = "NumberInputControl";
-function parseSafe(raw) {
-    const n = parseFloat(raw);
-    return Number.isNaN(n) ? -Infinity : n;
-}
-function stepperPadding(size) {
-    if (size === "sm")
-        return "pr-7";
-    if (size === "lg")
-        return "pr-9";
-    return "pr-8";
-}
-function StepperButton({ label, disabled, onClick, size, position, children, }) {
-    return (React.createElement("button", { type: "button", tabIndex: -1, "aria-label": label, disabled: disabled, onMouseDown: (event) => {
-            event.preventDefault();
-        }, onClick: onClick, className: (0, utils_1.cn)("pointer-events-auto flex flex-1 items-center justify-center text-muted-foreground transition-colors", "hover:text-foreground disabled:cursor-not-allowed disabled:opacity-50", position === "top" ? "rounded-tr-md" : "rounded-br-md", size === "sm" ? "min-h-0" : "min-h-0") }, children));
-}

package/dist/components-v2/PinInput/PinInput.d.ts

@@ -1,26 +0,0 @@
-import * as React from "react";
-export type PinInputSize = "sm" | "md" | "lg";
-export type PinInputType = "number" | "alphanumeric";
-export interface PinInputProps {
-    length?: number;
-    type?: PinInputType;
-    value?: string;
-    defaultValue?: string;
-    onChange?: (value: string) => void;
-    /** Fires when all boxes are filled. */
-    onComplete?: (value: string) => void;
-    autoFocus?: boolean;
-    /** Replace the visible character with • (e.g. for OTP secrets). */
-    mask?: boolean;
-    label?: React.ReactNode;
-    helperText?: React.ReactNode;
-    error?: boolean;
-    errorMessage?: React.ReactNode;
-    isRequired?: boolean;
-    size?: PinInputSize;
-    name?: string;
-    isDisabled?: boolean;
-    className?: string;
-    id?: string;
-}
-export declare const PinInput: React.ForwardRefExoticComponent<PinInputProps & React.RefAttributes<HTMLDivElement>>;