pixelize-design-library 3.0.1-beta.1 → 3.1.0

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

@@ -1,284 +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.Select = void 0;
-const React = __importStar(require("react"));
-const lucide_react_1 = require("lucide-react");
-const cmdk_1 = require("cmdk");
-const utils_1 = require("../../lib/utils");
-const badge_1 = require("../ui/badge");
-const field_1 = require("../ui/field");
-const popover_1 = require("../ui/popover");
-const select_1 = require("../ui/select");
-const skeleton_1 = require("../ui/skeleton");
-const spinner_1 = require("../ui/spinner");
-const form_field_1 = require("../ui/form-field");
-const TRIGGER_SIZE = {
-    sm: "min-h-8 text-xs px-2.5",
-    md: "min-h-9 text-sm px-3",
-    lg: "min-h-10 text-base px-3.5",
-};
-exports.Select = React.forwardRef((props, ref) => {
-    const { id, label, helperText, error, errorMessage, isInformation, informationMessage, isRequired, width, className } = props, controlProps = __rest(props, ["id", "label", "helperText", "error", "errorMessage", "isInformation", "informationMessage", "isRequired", "width", "className"]);
-    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(SelectControl, Object.assign({ ref: ref, error: error, className: className }, controlProps))));
-});
-exports.Select.displayName = "Select";
-const SelectControl = React.forwardRef((props, ref) => {
-    const { options, value, defaultValue, onChange, multiple = false, searchable = false, clearable = false, creatable = false, onCreateOption, placeholder = "Select…", isDisabled = false, isLoading = false, size = "md", maxDisplayed = 3, onSearch, emptyMessage = "No options found", loadingMessage = "Loading…", name, error, className, } = props;
-    if (!multiple && !searchable) {
-        return (React.createElement(SimpleRadixSelect, { ref: ref, options: options, value: value, defaultValue: defaultValue, onChange: (v) => onChange === null || onChange === void 0 ? void 0 : onChange(v), placeholder: placeholder, isDisabled: isDisabled || isLoading, size: size, name: name, error: error, className: className, loadingMessage: loadingMessage, isLoading: isLoading }));
-    }
-    return (React.createElement(ComboSelect, { ref: ref, options: options, value: value, defaultValue: defaultValue, onChange: onChange, multiple: multiple, clearable: clearable, creatable: creatable, onCreateOption: onCreateOption, placeholder: placeholder, isDisabled: isDisabled, isLoading: isLoading, size: size, maxDisplayed: maxDisplayed, onSearch: onSearch, emptyMessage: emptyMessage, loadingMessage: loadingMessage, error: error, className: className, name: name }));
-});
-SelectControl.displayName = "SelectControl";
-const SimpleRadixSelect = React.forwardRef(({ options, value, defaultValue, onChange, placeholder, isDisabled, size, name, error, className, loadingMessage, isLoading, }, ref) => {
-    const field = (0, form_field_1.useFormField)();
-    const grouped = useGroupedOptions(options);
-    return (React.createElement(select_1.Select, { value: value, defaultValue: defaultValue, onValueChange: onChange, disabled: isDisabled, name: name },
-        React.createElement(select_1.SelectTrigger, { ref: ref, id: field.id || undefined, size: size, "aria-invalid": error || field.hasError || undefined, className: (0, utils_1.cn)(error &&
-                "border-destructive bg-destructive/5 focus:ring-destructive", className) },
-            React.createElement(select_1.SelectValue, { placeholder: placeholder }),
-            isLoading && (React.createElement(spinner_1.Spinner, { size: "sm", className: "ml-2", label: String(loadingMessage) }))),
-        React.createElement(select_1.SelectContent, null, grouped.map((group) => {
-            var _a;
-            return (React.createElement(select_1.SelectGroup, { key: (_a = group.label) !== null && _a !== void 0 ? _a : "__root" },
-                group.label && (React.createElement(select_1.SelectLabel, null, group.label)),
-                group.options.map((option) => (React.createElement(select_1.SelectItem, { key: option.value, value: option.value, disabled: option.disabled },
-                    React.createElement("span", { className: "flex items-center gap-2" },
-                        option.icon,
-                        React.createElement("span", { className: "flex flex-col" },
-                            React.createElement("span", null, option.label),
-                            option.description && (React.createElement("span", { className: "text-xs text-muted-foreground" }, option.description)))))))));
-        }))));
-});
-SimpleRadixSelect.displayName = "SimpleRadixSelect";
-const ComboSelect = React.forwardRef(({ options, value, defaultValue, onChange, multiple, clearable, creatable, onCreateOption, placeholder, isDisabled, isLoading, size, maxDisplayed, onSearch, emptyMessage, loadingMessage, error, className, name, }, ref) => {
-    var _a;
-    const field = (0, form_field_1.useFormField)();
-    const isControlled = value !== undefined;
-    const [internalValue, setInternalValue] = React.useState(() => {
-        if (defaultValue !== undefined)
-            return defaultValue;
-        return multiple ? [] : "";
-    });
-    const currentValue = isControlled ? value : internalValue;
-    const [open, setOpen] = React.useState(false);
-    const [query, setQuery] = React.useState("");
-    const debouncedQuery = useDebouncedValue(query, 150);
-    React.useEffect(() => {
-        if (onSearch)
-            onSearch(query);
-    }, [query, onSearch]);
-    const filtered = React.useMemo(() => {
-        if (onSearch)
-            return options;
-        if (!debouncedQuery.trim())
-            return options;
-        const q = debouncedQuery.toLowerCase();
-        return options.filter((o) => {
-            var _a;
-            return o.label.toLowerCase().includes(q) ||
-                o.value.toLowerCase().includes(q) ||
-                ((_a = o.description) === null || _a === void 0 ? void 0 : _a.toLowerCase().includes(q));
-        });
-    }, [options, debouncedQuery, onSearch]);
-    const grouped = useGroupedOptions(filtered);
-    const setValue = (next) => {
-        if (!isControlled)
-            setInternalValue(next);
-        onChange === null || onChange === void 0 ? void 0 : onChange(next);
-    };
-    const selectedValues = React.useMemo(() => {
-        if (multiple)
-            return new Set(Array.isArray(currentValue) ? currentValue : []);
-        return new Set(typeof currentValue === "string" && currentValue ? [currentValue] : []);
-    }, [currentValue, multiple]);
-    const selectedOptions = React.useMemo(() => {
-        return options.filter((o) => selectedValues.has(o.value));
-    }, [options, selectedValues]);
-    const handleSelect = (optionValue) => {
-        if (multiple) {
-            const arr = Array.isArray(currentValue) ? currentValue : [];
-            const next = arr.includes(optionValue)
-                ? arr.filter((v) => v !== optionValue)
-                : [...arr, optionValue];
-            setValue(next);
-        }
-        else {
-            setValue(optionValue);
-            setOpen(false);
-        }
-        setQuery("");
-    };
-    const removeValue = (optionValue) => {
-        if (multiple) {
-            const arr = Array.isArray(currentValue) ? currentValue : [];
-            setValue(arr.filter((v) => v !== optionValue));
-        }
-        else {
-            setValue("");
-        }
-    };
-    const clearAll = (event) => {
-        event.stopPropagation();
-        setValue(multiple ? [] : "");
-    };
-    const hasValue = multiple
-        ? Array.isArray(currentValue) && currentValue.length > 0
-        : !!currentValue;
-    const showCreate = creatable &&
-        query.trim() !== "" &&
-        !filtered.some((o) => o.label.toLowerCase() === query.trim().toLowerCase());
-    return (React.createElement(React.Fragment, null,
-        React.createElement(popover_1.Popover, { open: open, onOpenChange: setOpen },
-            React.createElement(popover_1.PopoverTrigger, { asChild: true },
-                React.createElement("button", { ref: ref, type: "button", id: field.id || undefined, role: "combobox", "aria-expanded": open, "aria-haspopup": "listbox", "aria-autocomplete": "list", "aria-invalid": error || field.hasError || undefined, disabled: isDisabled || isLoading, className: (0, utils_1.cn)("group flex w-full items-center justify-between gap-2 rounded-md border border-input bg-background text-foreground shadow-sm transition-colors", "focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-1 focus:ring-offset-background", "disabled:cursor-not-allowed disabled:opacity-50", "data-[state=open]:ring-2 data-[state=open]:ring-ring", TRIGGER_SIZE[size], error &&
-                        "border-destructive bg-destructive/5 focus:ring-destructive", className) },
-                    React.createElement(SelectedChips, { multiple: multiple, selectedOptions: selectedOptions, maxDisplayed: maxDisplayed, placeholder: placeholder, removeValue: removeValue, isDisabled: isDisabled }),
-                    React.createElement("span", { className: "ml-auto flex items-center gap-1 text-muted-foreground" },
-                        isLoading && React.createElement(spinner_1.Spinner, { size: "sm" }),
-                        clearable && hasValue && !isDisabled && (React.createElement("button", { type: "button", "aria-label": "Clear selection", onClick: clearAll, className: "rounded-sm hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" },
-                            React.createElement(lucide_react_1.X, { className: "h-4 w-4" }))),
-                        React.createElement(lucide_react_1.ChevronDown, { className: "h-4 w-4 opacity-60 transition-transform group-data-[state=open]:rotate-180" })))),
-            React.createElement(popover_1.PopoverContent, { align: "start", className: "w-[var(--radix-popover-trigger-width)] p-0" },
-                React.createElement(cmdk_1.Command, { shouldFilter: false, className: "flex max-h-72 flex-col overflow-hidden" },
-                    React.createElement("div", { className: "flex shrink-0 items-center gap-2 border-b border-border px-2" },
-                        React.createElement(lucide_react_1.Search, { "aria-hidden": "true", className: "h-4 w-4 shrink-0 text-muted-foreground" }),
-                        React.createElement(cmdk_1.CommandInput, { autoFocus: true, value: query, onValueChange: setQuery, placeholder: "Search\u2026", className: "flex-1 bg-transparent py-2 text-sm outline-none placeholder:text-muted-foreground" })),
-                    React.createElement(cmdk_1.CommandList, { className: "max-h-[16rem] flex-1 overflow-y-auto py-1" }, isLoading ? (React.createElement("div", { className: "space-y-1.5 px-2 py-2" },
-                        React.createElement(skeleton_1.Skeleton, { variant: "text", className: "w-full" }),
-                        React.createElement(skeleton_1.Skeleton, { variant: "text", className: "w-3/4" }),
-                        React.createElement(skeleton_1.Skeleton, { variant: "text", className: "w-1/2" }))) : grouped.length === 0 && !showCreate ? (React.createElement(cmdk_1.CommandEmpty, { className: "px-3 py-4 text-center text-sm text-muted-foreground" }, emptyMessage)) : (React.createElement(React.Fragment, null,
-                        grouped.map((group, idx) => {
-                            var _a;
-                            return (React.createElement(React.Fragment, { key: (_a = group.label) !== null && _a !== void 0 ? _a : "__root" },
-                                idx > 0 && (React.createElement(cmdk_1.CommandSeparator, { className: "my-1 h-px bg-border" })),
-                                React.createElement(cmdk_1.CommandGroup, { heading: group.label, className: (0, utils_1.cn)("px-1 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5", "[&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-semibold [&_[cmdk-group-heading]]:text-muted-foreground") }, group.options.map((option) => (React.createElement(ComboItem, { key: option.value, option: option, selected: selectedValues.has(option.value), onSelect: () => handleSelect(option.value) }))))));
-                        }),
-                        showCreate && (React.createElement(React.Fragment, null,
-                            React.createElement(cmdk_1.CommandSeparator, { className: "my-1 h-px bg-border" }),
-                            React.createElement(cmdk_1.CommandItem, { value: `__create__${query}`, onSelect: () => {
-                                    const newValue = query.trim();
-                                    onCreateOption === null || onCreateOption === void 0 ? void 0 : onCreateOption(newValue);
-                                    handleSelect(newValue);
-                                }, className: "mx-1 flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm text-foreground aria-selected:bg-accent aria-selected:text-accent-foreground" },
-                                React.createElement("span", { className: "text-muted-foreground" }, "Create"),
-                                React.createElement("span", { className: "font-medium" },
-                                    "\u201C",
-                                    query,
-                                    "\u201D")))))))))),
-        name && (React.createElement("input", { type: "hidden", name: name, value: multiple
-                ? JSON.stringify(currentValue !== null && currentValue !== void 0 ? currentValue : [])
-                : (_a = currentValue) !== null && _a !== void 0 ? _a : "" }))));
-});
-ComboSelect.displayName = "ComboSelect";
-function ComboItem({ option, selected, onSelect }) {
-    return (React.createElement(cmdk_1.CommandItem, { value: `${option.label} ${option.value}`, disabled: option.disabled, onSelect: onSelect, className: (0, utils_1.cn)("relative flex cursor-pointer items-center gap-2 rounded-sm px-2 py-1.5 text-sm", "aria-selected:bg-accent aria-selected:text-accent-foreground", "data-[disabled]:pointer-events-none data-[disabled]:opacity-50") },
-        option.icon,
-        React.createElement("span", { className: "flex flex-col" },
-            React.createElement("span", null, option.label),
-            option.description && (React.createElement("span", { className: "text-xs text-muted-foreground" }, option.description))),
-        selected && (React.createElement(lucide_react_1.Check, { "aria-hidden": "true", className: "ml-auto h-4 w-4 shrink-0 text-primary" }))));
-}
-function SelectedChips({ multiple, selectedOptions, maxDisplayed, placeholder, removeValue, isDisabled, }) {
-    if (selectedOptions.length === 0) {
-        return (React.createElement("span", { className: "truncate text-muted-foreground" }, placeholder));
-    }
-    if (!multiple) {
-        const [first] = selectedOptions;
-        return (React.createElement("span", { className: "flex items-center gap-2 truncate text-foreground" },
-            first.icon,
-            React.createElement("span", { className: "truncate" }, first.label)));
-    }
-    const visible = selectedOptions.slice(0, maxDisplayed);
-    const overflow = selectedOptions.length - visible.length;
-    return (React.createElement("div", { className: "flex max-h-[5.5rem] flex-1 flex-wrap items-center gap-1 overflow-y-auto py-1" },
-        visible.map((option) => (React.createElement(badge_1.Badge, { key: option.value, variant: "secondary", size: "sm", className: "gap-1 pr-1" },
-            option.label,
-            !isDisabled && (React.createElement("button", { type: "button", "aria-label": `Remove ${option.label}`, onClick: (event) => {
-                    event.stopPropagation();
-                    removeValue(option.value);
-                }, className: "rounded-sm hover:bg-foreground/10 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring" },
-                React.createElement(lucide_react_1.X, { className: "h-3 w-3" })))))),
-        overflow > 0 && (React.createElement(badge_1.Badge, { variant: "outline", size: "sm" },
-            "+",
-            overflow,
-            " more"))));
-}
-function useGroupedOptions(options) {
-    return React.useMemo(() => {
-        var _a;
-        const hasGroups = options.some((o) => !!o.group);
-        if (!hasGroups)
-            return [{ label: undefined, options }];
-        const map = new Map();
-        for (const option of options) {
-            const key = option.group;
-            const list = (_a = map.get(key)) !== null && _a !== void 0 ? _a : [];
-            list.push(option);
-            map.set(key, list);
-        }
-        const groups = [];
-        const ungrouped = map.get(undefined);
-        if (ungrouped)
-            groups.push({ label: undefined, options: ungrouped });
-        for (const [key, opts] of map.entries()) {
-            if (key === undefined)
-                continue;
-            groups.push({ label: key, options: opts });
-        }
-        return groups;
-    }, [options]);
-}
-function useDebouncedValue(value, delay) {
-    const [debounced, setDebounced] = React.useState(value);
-    React.useEffect(() => {
-        const timer = setTimeout(() => setDebounced(value), delay);
-        return () => clearTimeout(timer);
-    }, [value, delay]);
-    return debounced;
-}

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

@@ -1,41 +0,0 @@
-import * as React from "react";
-import { type LucideIcon } from "lucide-react";
-type BadgeVariant = "default" | "destructive" | "success" | "warning";
-export interface SidebarMenuItem {
-    id: string | number;
-    title: string;
-    icon?: LucideIcon;
-    url?: string;
-    badge?: {
-        count?: number;
-        label?: string;
-        variant?: BadgeVariant;
-    };
-    children?: SidebarMenuItem[];
-    disabled?: boolean;
-}
-export interface SidebarOtherApp {
-    id: string | number;
-    name: string;
-    url?: string;
-    icon?: LucideIcon;
-    iconUrl?: string;
-}
-export interface SidebarProps {
-    menus: SidebarMenuItem[];
-    activeItem?: string | number;
-    onItemClick?: (item: SidebarMenuItem) => void;
-    logo?: string;
-    companyName?: string;
-    collapsed?: boolean;
-    onCollapsedChange?: (collapsed: boolean) => void;
-    defaultCollapsed?: boolean;
-    mobileOpen?: boolean;
-    onMobileOpenChange?: (open: boolean) => void;
-    otherApps?: SidebarOtherApp[];
-    footer?: React.ReactNode;
-    isLoading?: boolean;
-    className?: string;
-}
-export declare function Sidebar({ menus, activeItem, onItemClick, logo, companyName, collapsed: collapsedProp, onCollapsedChange, defaultCollapsed, mobileOpen, onMobileOpenChange, otherApps, footer, isLoading, className, }: SidebarProps): React.ReactElement;
-export {};

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

@@ -1,182 +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.Sidebar = Sidebar;
-const React = __importStar(require("react"));
-const framer_motion_1 = require("framer-motion");
-const lucide_react_1 = require("lucide-react");
-const utils_1 = require("../../lib/utils");
-const badge_1 = require("../ui/badge");
-const popover_1 = require("../ui/popover");
-const skeleton_1 = require("../ui/skeleton");
-const EXPANDED_WIDTH = 240;
-const COLLAPSED_WIDTH = 64;
-function Sidebar({ menus, activeItem, onItemClick, logo, companyName, collapsed: collapsedProp, onCollapsedChange, defaultCollapsed = false, mobileOpen = false, onMobileOpenChange, otherApps, footer, isLoading = false, className, }) {
-    const isCollapsedControlled = collapsedProp !== undefined;
-    const [internalCollapsed, setInternalCollapsed] = React.useState(defaultCollapsed);
-    const collapsed = isCollapsedControlled ? collapsedProp : internalCollapsed;
-    const toggleCollapsed = () => {
-        const next = !collapsed;
-        if (!isCollapsedControlled)
-            setInternalCollapsed(next);
-        onCollapsedChange === null || onCollapsedChange === void 0 ? void 0 : onCollapsedChange(next);
-    };
-    return (React.createElement(React.Fragment, null,
-        React.createElement(framer_motion_1.motion.aside, { "aria-label": "Main navigation", animate: { width: collapsed ? COLLAPSED_WIDTH : EXPANDED_WIDTH }, initial: false, transition: { duration: 0.2, ease: "easeInOut" }, className: (0, utils_1.cn)("sticky top-0 hidden h-screen shrink-0 flex-col border-r border-border bg-card text-card-foreground md:flex", className) },
-            React.createElement(SidebarBody, { menus: menus, activeItem: activeItem, onItemClick: onItemClick, logo: logo, companyName: companyName, collapsed: collapsed, onToggleCollapsed: toggleCollapsed, otherApps: otherApps, footer: footer, isLoading: isLoading })),
-        React.createElement(framer_motion_1.AnimatePresence, null, mobileOpen && (React.createElement(React.Fragment, null,
-            React.createElement(framer_motion_1.motion.div, { key: "sidebar-backdrop", initial: { opacity: 0 }, animate: { opacity: 1 }, exit: { opacity: 0 }, transition: { duration: 0.15 }, onClick: () => onMobileOpenChange === null || onMobileOpenChange === void 0 ? void 0 : onMobileOpenChange(false), className: "fixed inset-0 z-40 bg-foreground/40 backdrop-blur-sm md:hidden", "aria-hidden": "true" }),
-            React.createElement(framer_motion_1.motion.aside, { key: "sidebar-drawer", initial: { x: "-100%" }, animate: { x: 0 }, exit: { x: "-100%" }, transition: { duration: 0.2, ease: "easeInOut" }, className: (0, utils_1.cn)("fixed inset-y-0 left-0 z-50 flex w-60 flex-col border-r border-border bg-card text-card-foreground md:hidden", className), "aria-label": "Main navigation" },
-                React.createElement(SidebarBody, { menus: menus, activeItem: activeItem, onItemClick: (item) => {
-                        onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(item);
-                        onMobileOpenChange === null || onMobileOpenChange === void 0 ? void 0 : onMobileOpenChange(false);
-                    }, logo: logo, companyName: companyName, collapsed: false, onToggleCollapsed: () => onMobileOpenChange === null || onMobileOpenChange === void 0 ? void 0 : onMobileOpenChange(false), otherApps: otherApps, footer: footer, isLoading: isLoading, isMobileDrawer: true })))))));
-}
-function SidebarBody({ menus, activeItem, onItemClick, logo, companyName, collapsed, onToggleCollapsed, otherApps, footer, isLoading, isMobileDrawer = false, }) {
-    var _a, _b;
-    return (React.createElement("nav", { className: "flex h-full min-h-0 flex-col", "aria-label": "Sidebar" },
-        React.createElement("div", { className: (0, utils_1.cn)("flex h-14 shrink-0 items-center gap-2 border-b border-border px-3", collapsed && "justify-center px-2") },
-            logo ? (React.createElement("img", { src: logo, alt: "", className: "h-7 w-7 shrink-0 rounded-md object-contain" })) : (React.createElement("div", { className: "grid h-7 w-7 shrink-0 place-items-center rounded-md bg-primary text-xs font-semibold text-primary-foreground" }, (_b = (_a = companyName === null || companyName === void 0 ? void 0 : companyName[0]) === null || _a === void 0 ? void 0 : _a.toUpperCase()) !== null && _b !== void 0 ? _b : "P")),
-            !collapsed && companyName && (React.createElement("span", { className: "truncate text-sm font-semibold text-foreground" }, companyName))),
-        React.createElement("ul", { className: "flex-1 overflow-y-auto px-2 py-3", role: "list" }, isLoading
-            ? Array.from({ length: 5 }).map((_, index) => (React.createElement("li", { key: `skeleton-${index}`, className: "mb-1" },
-                React.createElement("div", { className: (0, utils_1.cn)("flex items-center gap-2 px-2 py-1.5", collapsed && "justify-center") },
-                    React.createElement(skeleton_1.Skeleton, { variant: "rectangle", className: "h-5 w-5 rounded" }),
-                    !collapsed && (React.createElement(skeleton_1.Skeleton, { variant: "text", className: "h-3 w-24" }))))))
-            : menus.map((item) => (React.createElement(SidebarMenuRow, { key: item.id, item: item, activeItem: activeItem, collapsed: collapsed, onItemClick: onItemClick })))),
-        otherApps && otherApps.length > 0 && (React.createElement("div", { className: "shrink-0 border-t border-border px-2 py-2" }, collapsed ? (React.createElement(popover_1.Popover, null,
-            React.createElement(popover_1.PopoverTrigger, { asChild: true },
-                React.createElement("button", { type: "button", "aria-label": "Other apps", className: "flex h-9 w-full 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(lucide_react_1.Grid3x3, { "aria-hidden": "true", className: "h-4 w-4" }))),
-            React.createElement(popover_1.PopoverContent, { side: "right", align: "end", className: "w-56 p-1" },
-                React.createElement(OtherAppsList, { apps: otherApps })))) : (React.createElement(React.Fragment, null,
-            React.createElement("p", { className: "px-2 pb-1 text-[10px] font-semibold uppercase tracking-wider text-muted-foreground" }, "Other apps"),
-            React.createElement(OtherAppsList, { apps: otherApps }))))),
-        footer && (React.createElement("div", { className: "shrink-0 border-t border-border px-2 py-2" }, footer)),
-        React.createElement("div", { className: "shrink-0 border-t border-border px-2 py-2" },
-            React.createElement("button", { type: "button", onClick: onToggleCollapsed, "aria-label": isMobileDrawer
-                    ? "Close sidebar"
-                    : collapsed
-                        ? "Expand sidebar"
-                        : "Collapse sidebar", "aria-expanded": !collapsed, className: "flex h-8 w-full 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(lucide_react_1.ChevronLeft, { "aria-hidden": "true", className: (0, utils_1.cn)("h-4 w-4 transition-transform motion-safe:duration-200", collapsed && "rotate-180") })))));
-}
-function SidebarMenuRow({ item, activeItem, collapsed, onItemClick, nested = false, }) {
-    var _a;
-    const hasChildren = !!item.children && item.children.length > 0;
-    const isActive = activeItem === item.id;
-    const childActive = hasChildren &&
-        item.children.some((child) => child.id === activeItem);
-    const [expanded, setExpanded] = React.useState(childActive);
-    React.useEffect(() => {
-        if (childActive)
-            setExpanded(true);
-    }, [childActive]);
-    const [hoverOpen, setHoverOpen] = React.useState(false);
-    const closeTimer = React.useRef(null);
-    const scheduleClose = () => {
-        if (closeTimer.current)
-            window.clearTimeout(closeTimer.current);
-        closeTimer.current = window.setTimeout(() => setHoverOpen(false), 120);
-    };
-    const cancelClose = () => {
-        if (closeTimer.current)
-            window.clearTimeout(closeTimer.current);
-        setHoverOpen(true);
-    };
-    const handleClick = (event) => {
-        if (item.disabled)
-            return;
-        event.preventDefault();
-        if (hasChildren && !collapsed) {
-            setExpanded((prev) => !prev);
-            return;
-        }
-        onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(item);
-    };
-    const IconComponent = item.icon;
-    const trigger = (React.createElement("button", { type: "button", disabled: item.disabled, "aria-current": isActive ? "page" : undefined, "aria-disabled": item.disabled || undefined, "aria-haspopup": hasChildren ? "menu" : undefined, "aria-expanded": hasChildren ? expanded || hoverOpen : undefined, "aria-label": collapsed ? item.title : undefined, onClick: handleClick, onMouseEnter: collapsed && hasChildren ? cancelClose : undefined, onMouseLeave: collapsed && hasChildren ? scheduleClose : undefined, className: (0, utils_1.cn)("group relative flex w-full items-center gap-2.5 rounded-md px-2 py-1.5 text-sm transition-colors", "text-muted-foreground hover:bg-accent hover:text-foreground", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", "disabled:cursor-not-allowed disabled:opacity-50", isActive && "bg-primary/10 text-primary hover:bg-primary/15", collapsed && "justify-center px-2", nested && "py-1 text-xs") },
-        isActive && (React.createElement("span", { "aria-hidden": "true", className: "absolute left-0 top-1/2 h-5 w-0.5 -translate-y-1/2 rounded-r bg-primary" })),
-        IconComponent ? (React.createElement(IconComponent, { "aria-hidden": "true", className: (0, utils_1.cn)("h-4 w-4 shrink-0", isActive && "text-primary") })) : (React.createElement("span", { "aria-hidden": "true", className: "h-4 w-4 shrink-0 rounded-sm bg-muted" })),
-        !collapsed && (React.createElement(React.Fragment, null,
-            React.createElement("span", { className: "flex-1 truncate text-left" }, item.title),
-            item.badge && (React.createElement(badge_1.Badge, { variant: badgeVariant(item.badge.variant), size: "sm", className: "px-1.5 py-0 text-[10px]" }, (_a = item.badge.label) !== null && _a !== void 0 ? _a : item.badge.count)),
-            hasChildren && (React.createElement(lucide_react_1.ChevronDown, { "aria-hidden": "true", className: (0, utils_1.cn)("h-3.5 w-3.5 shrink-0 text-muted-foreground transition-transform motion-safe:duration-200", expanded && "rotate-180") })))),
-        collapsed && item.badge && (React.createElement("span", { "aria-hidden": "true", className: (0, utils_1.cn)("absolute right-1 top-1 h-1.5 w-1.5 rounded-full", badgeDot(item.badge.variant)) }))));
-    if (collapsed && hasChildren) {
-        return (React.createElement("li", null,
-            React.createElement(popover_1.Popover, { open: hoverOpen, onOpenChange: setHoverOpen },
-                React.createElement(popover_1.PopoverTrigger, { asChild: true }, trigger),
-                React.createElement(popover_1.PopoverContent, { side: "right", align: "start", sideOffset: 8, onMouseEnter: cancelClose, onMouseLeave: scheduleClose, className: "w-56 p-1" },
-                    React.createElement("div", { className: "px-2 py-1 text-xs font-semibold text-muted-foreground" }, item.title),
-                    React.createElement("ul", { role: "list" }, item.children.map((child) => (React.createElement(SidebarMenuRow, { key: child.id, item: child, activeItem: activeItem, collapsed: false, onItemClick: (value) => {
-                            setHoverOpen(false);
-                            onItemClick === null || onItemClick === void 0 ? void 0 : onItemClick(value);
-                        }, nested: true }))))))));
-    }
-    return (React.createElement("li", null,
-        trigger,
-        hasChildren && !collapsed && (React.createElement(framer_motion_1.AnimatePresence, { initial: false }, expanded && (React.createElement(framer_motion_1.motion.ul, { key: "submenu", initial: { height: 0, opacity: 0 }, animate: { height: "auto", opacity: 1 }, exit: { height: 0, opacity: 0 }, transition: { duration: 0.18, ease: "easeInOut" }, className: "ml-5 mt-0.5 overflow-hidden border-l border-border pl-2", role: "list" }, item.children.map((child) => (React.createElement(SidebarMenuRow, { key: child.id, item: child, activeItem: activeItem, collapsed: false, onItemClick: onItemClick, nested: true })))))))));
-}
-function OtherAppsList({ apps }) {
-    return (React.createElement("ul", { role: "list" }, apps.map((app) => (React.createElement("li", { key: app.id },
-        React.createElement("a", { href: app.url, className: "flex items-center gap-2 rounded-md px-2 py-1.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" },
-            app.iconUrl ? (React.createElement("img", { src: app.iconUrl, alt: "", className: "h-4 w-4 rounded-sm object-contain" })) : app.icon ? (React.createElement(app.icon, { "aria-hidden": "true", className: "h-4 w-4" })) : (React.createElement(lucide_react_1.Grid3x3, { "aria-hidden": "true", className: "h-4 w-4" })),
-            React.createElement("span", { className: "truncate" }, app.name)))))));
-}
-function badgeVariant(variant) {
-    switch (variant) {
-        case "destructive":
-            return "destructive";
-        case "success":
-            return "success";
-        case "warning":
-            return "warning";
-        default:
-            return "default";
-    }
-}
-function badgeDot(variant) {
-    switch (variant) {
-        case "destructive":
-            return "bg-destructive";
-        case "success":
-            return "bg-success";
-        case "warning":
-            return "bg-warning";
-        default:
-            return "bg-primary";
-    }
-}

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

@@ -1,18 +0,0 @@
-import * as React from "react";
-import * as SliderPrimitive from "@radix-ui/react-slider";
-export interface SliderMark {
-    value: number;
-    label?: React.ReactNode;
-}
-export interface SliderProps extends Omit<React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>, "value" | "defaultValue" | "onValueChange"> {
-    /** Single value or pair for range mode. */
-    value?: number | number[];
-    defaultValue?: number | number[];
-    onValueChange?: (value: number | number[]) => void;
-    /** Show tooltip with current value on the thumb. */
-    showTooltip?: boolean;
-    /** Marks rendered along the track. */
-    marks?: SliderMark[];
-    formatValue?: (value: number) => string;
-}
-export declare const Slider: React.ForwardRefExoticComponent<SliderProps & React.RefAttributes<HTMLSpanElement>>;

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

@@ -1,101 +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.Slider = void 0;
-const React = __importStar(require("react"));
-const SliderPrimitive = __importStar(require("@radix-ui/react-slider"));
-const utils_1 = require("../../lib/utils");
-const tooltip_1 = require("../ui/tooltip");
-exports.Slider = React.forwardRef((_a, ref) => {
-    var { className, value, defaultValue, onValueChange, showTooltip = false, marks, formatValue = String, min = 0, max = 100, step = 1 } = _a, rest = __rest(_a, ["className", "value", "defaultValue", "onValueChange", "showTooltip", "marks", "formatValue", "min", "max", "step"]);
-    const isRange = Array.isArray(value)
-        ? value.length > 1
-        : Array.isArray(defaultValue)
-            ? defaultValue.length > 1
-            : false;
-    const internalValue = React.useMemo(() => {
-        var _a;
-        const source = (_a = value !== null && value !== void 0 ? value : defaultValue) !== null && _a !== void 0 ? _a : (isRange ? [min, max] : [min]);
-        return Array.isArray(source) ? source : [source];
-    }, [value, defaultValue, isRange, min, max]);
-    const [trackedValue, setTrackedValue] = React.useState(internalValue);
-    const displayValue = value !== undefined
-        ? Array.isArray(value)
-            ? value
-            : [value]
-        : trackedValue;
-    return (React.createElement("div", { className: (0, utils_1.cn)("w-full select-none", className) },
-        React.createElement(SliderPrimitive.Root, Object.assign({ ref: ref, value: displayValue, defaultValue: defaultValue !== undefined
-                ? Array.isArray(defaultValue)
-                    ? defaultValue
-                    : [defaultValue]
-                : undefined, onValueChange: (next) => {
-                setTrackedValue(next);
-                onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(isRange ? next : next[0]);
-            }, min: min, max: max, step: step, className: "relative flex h-5 w-full touch-none items-center" }, rest),
-            React.createElement(SliderPrimitive.Track, { className: "relative h-1 w-full grow overflow-hidden rounded-full bg-muted" },
-                React.createElement(SliderPrimitive.Range, { className: "absolute h-full bg-primary" })),
-            displayValue.map((thumbValue, index) => {
-                const thumb = (React.createElement(SliderPrimitive.Thumb, { key: index, "aria-label": isRange
-                        ? index === 0
-                            ? "Minimum value"
-                            : "Maximum value"
-                        : "Value", className: (0, utils_1.cn)("block h-4 w-4 rounded-full border-2 border-primary bg-background shadow-sm transition-colors", "focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background", "disabled:pointer-events-none disabled:opacity-50") }));
-                if (!showTooltip)
-                    return thumb;
-                return (React.createElement(tooltip_1.Tooltip, { key: index, open: true },
-                    React.createElement(tooltip_1.TooltipTrigger, { asChild: true }, thumb),
-                    React.createElement(tooltip_1.TooltipContent, { side: "top", sideOffset: 6 }, formatValue(thumbValue))));
-            })),
-        marks && marks.length > 0 && (React.createElement("div", { "aria-hidden": "true", className: "relative mt-1.5 h-4 text-[10px] text-muted-foreground" }, marks.map((mark) => {
-            var _a;
-            const ratio = (mark.value - min) / (max - min);
-            return (React.createElement("span", { key: mark.value, style: {
-                    left: `${Math.min(Math.max(ratio, 0), 1) * 100}%`,
-                }, className: "absolute -translate-x-1/2" }, (_a = mark.label) !== null && _a !== void 0 ? _a : mark.value));
-        })))));
-});
-exports.Slider.displayName = "Slider";

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

@@ -1,7 +0,0 @@
-import * as React from "react";
-import { type ColumnDef, type TableProps } from "./TableProps";
-export declare function Table<T>(props: TableProps<T>): React.ReactElement;
-export declare namespace Table {
-    var displayName: string;
-}
-export type { ColumnDef, TableProps };