linkedunion-design-kit 1.11.6 → 1.11.8

package/dist/src/components/ui/{calendar.js → calendar.jsx}

@@ -25,7 +25,6 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
 import { ChevronLeftIcon, ChevronRightIcon } from "lucide-react";
 import { DayPicker, getDefaultClassNames, } from "react-day-picker";
 import { cn } from "../../lib/utils";
@@ -78,40 +77,48 @@ function Calendar(_a) {
     };
     // Show custom pickers when not in days view
     if (pickerView === "months") {
-        return (_jsx(MonthPicker, { displayMonth: displayMonth, setDisplayMonth: handleMonthChange, setPickerView: setPickerView, calendarSize: calendarSize }));
+        return (<MonthPicker displayMonth={displayMonth} setDisplayMonth={handleMonthChange} setPickerView={setPickerView} calendarSize={calendarSize}/>);
     }
     if (pickerView === "years") {
-        return (_jsx(YearPicker, { displayMonth: displayMonth, setDisplayMonth: handleMonthChange, setPickerView: setPickerView, calendarSize: calendarSize }));
+        return (<YearPicker displayMonth={displayMonth} setDisplayMonth={handleMonthChange} setPickerView={setPickerView} calendarSize={calendarSize}/>);
     }
-    return (_jsx(DayPicker, __assign({ month: displayMonth, onMonthChange: handleMonthChange, showOutsideDays: showOutsideDays, className: cn("bg-background group/calendar [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent p-1 sm:p-2 w-full max-w-fit", calendarStyles.cellSize[calendarSize], String.raw(templateObject_1 || (templateObject_1 = __makeTemplateObject(["rtl:**:[.rdp-button_next>svg]:rotate-180"], ["rtl:**:[.rdp-button\\_next>svg]:rotate-180"]))), String.raw(templateObject_2 || (templateObject_2 = __makeTemplateObject(["rtl:**:[.rdp-button_previous>svg]:rotate-180"], ["rtl:**:[.rdp-button\\_previous>svg]:rotate-180"]))), className), captionLayout: "label", classNames: __assign({ root: cn("w-fit", defaultClassNames.root), months: cn("flex flex-col md:flex-row relative gap-2", defaultClassNames.months), month: cn("flex flex-col w-full gap-2", defaultClassNames.month), nav: cn("hidden", defaultClassNames.nav), month_caption: cn("flex items-center justify-center h-(--cell-size) w-full px-1 sm:px-(--cell-size) relative", defaultClassNames.month_caption), caption_label: cn("select-none font-medium text-xs sm:text-sm cursor-pointer hover:text-blue-600 transition-colors", defaultClassNames.caption_label), table: "w-full border-collapse", weekdays: cn("flex bg-gray-50 items-center", defaultClassNames.weekdays, calendarStyles.weekdays[calendarSize]), weekday: cn("text-gray-950 rounded-sm flex-1 select-none font-normal text-xs sm:text-sm", defaultClassNames.weekday), week: cn("flex w-full", defaultClassNames.week), day: cn("relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-sm group/day select-none", props.showWeekNumber
+    return (<DayPicker month={displayMonth} onMonthChange={handleMonthChange} showOutsideDays={showOutsideDays} className={cn("bg-background group/calendar [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent p-1 sm:p-2 w-full max-w-fit", calendarStyles.cellSize[calendarSize], String.raw(templateObject_1 || (templateObject_1 = __makeTemplateObject(["rtl:**:[.rdp-button_next>svg]:rotate-180"], ["rtl:**:[.rdp-button\\_next>svg]:rotate-180"]))), String.raw(templateObject_2 || (templateObject_2 = __makeTemplateObject(["rtl:**:[.rdp-button_previous>svg]:rotate-180"], ["rtl:**:[.rdp-button\\_previous>svg]:rotate-180"]))), className)} captionLayout="label" classNames={__assign({ root: cn("w-fit", defaultClassNames.root), months: cn("flex flex-col md:flex-row relative gap-2", defaultClassNames.months), month: cn("flex flex-col w-full gap-2", defaultClassNames.month), nav: cn("hidden", defaultClassNames.nav), month_caption: cn("flex items-center justify-center h-(--cell-size) w-full px-1 sm:px-(--cell-size) relative", defaultClassNames.month_caption), caption_label: cn("select-none font-medium text-xs sm:text-sm cursor-pointer hover:text-blue-600 transition-colors", defaultClassNames.caption_label), table: "w-full border-collapse", weekdays: cn("flex bg-gray-50 items-center", defaultClassNames.weekdays, calendarStyles.weekdays[calendarSize]), weekday: cn("text-gray-950 rounded-sm flex-1 select-none font-normal text-xs sm:text-sm", defaultClassNames.weekday), week: cn("flex w-full", defaultClassNames.week), day: cn("relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-sm group/day select-none", props.showWeekNumber
                 ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-sm"
-                : "[&:first-child[data-selected=true]_button]:rounded-l-sm", defaultClassNames.day), range_start: cn("rounded-l-sm bg-accent", defaultClassNames.range_start), range_middle: cn("rounded-none", defaultClassNames.range_middle), range_end: cn("rounded-r-sm bg-accent", defaultClassNames.range_end), today: cn("rounded-sm bg-accent", defaultClassNames.today), outside: cn("text-gray-400 aria-selected:text-gray-400", defaultClassNames.outside), disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled), hidden: cn("invisible", defaultClassNames.hidden) }, classNames), components: {
+                : "[&:first-child[data-selected=true]_button]:rounded-l-sm", defaultClassNames.day), range_start: cn("rounded-l-sm bg-accent", defaultClassNames.range_start), range_middle: cn("rounded-none", defaultClassNames.range_middle), range_end: cn("rounded-r-sm bg-accent", defaultClassNames.range_end), today: cn("rounded-sm bg-accent", defaultClassNames.today), outside: cn("text-gray-400 aria-selected:text-gray-400", defaultClassNames.outside), disabled: cn("text-muted-foreground opacity-50", defaultClassNames.disabled), hidden: cn("invisible", defaultClassNames.hidden) }, classNames)} components={{
             Root: function (_a) {
                 var className = _a.className, rootRef = _a.rootRef, props = __rest(_a, ["className", "rootRef"]);
-                return (_jsx("div", __assign({ "data-slot": "calendar", ref: rootRef, className: cn(className) }, props)));
+                return (<div data-slot="calendar" ref={rootRef} className={cn(className)} {...props}/>);
             },
             Chevron: function (_a) {
                 var className = _a.className, orientation = _a.orientation;
                 if (orientation === "left") {
-                    return _jsx(ChevronLeftIcon, { className: cn("size-4", className) });
+                    return <ChevronLeftIcon className={cn("size-4", className)}/>;
                 }
                 if (orientation === "right") {
-                    return _jsx(ChevronRightIcon, { className: cn("size-4", className) });
+                    return <ChevronRightIcon className={cn("size-4", className)}/>;
                 }
-                return _jsx(_Fragment, {});
+                return <></>;
             },
             MonthCaption: function (_a) {
                 var calendarMonth = _a.calendarMonth;
-                return (_jsx(DaysCaption, { calendarMonth: calendarMonth.date, setPickerView: setPickerView, displayMonth: displayMonth, setDisplayMonth: handleMonthChange, calendarSize: calendarSize }));
+                return (<DaysCaption calendarMonth={calendarMonth.date} setPickerView={setPickerView} displayMonth={displayMonth} setDisplayMonth={handleMonthChange} calendarSize={calendarSize}/>);
             },
-            DayButton: function (dayButtonProps) { return (_jsx(CalendarDayButton, __assign({}, dayButtonProps, { calendarSize: calendarSize }))); },
-            Weekdays: function (weekdaysProps) { return (_jsx("thead", { "data-slot": Reset_BS, children: _jsx("tr", __assign({ "data-slot": Reset_BS }, weekdaysProps)) })); },
-            Weekday: function (weekdayProps) { return (_jsx("th", __assign({ "data-slot": Reset_BS }, weekdayProps))); },
-        } }, props)));
+            DayButton: function (dayButtonProps) { return (<CalendarDayButton {...dayButtonProps} calendarSize={calendarSize}/>); },
+            Weekdays: function (weekdaysProps) { return (<thead data-slot={Reset_BS}>
+            <tr data-slot={Reset_BS} {...weekdaysProps}/>
+          </thead>); },
+            Weekday: function (weekdayProps) { return (<th data-slot={Reset_BS} {...weekdayProps}/>); },
+        }} {...props}/>);
 }
 function CustomCaption(_a) {
     var caption = _a.caption, onPrevClick = _a.onPrevClick, onCaptionClick = _a.onCaptionClick, onNextClick = _a.onNextClick, calendarSize = _a.calendarSize;
-    return (_jsxs("div", { className: "flex items-center justify-between gap-1 sm:gap-2", children: [_jsx(IconButton, { variant: "ghost", color: "gray", onClick: onPrevClick, className: cn(calendarStyles.navButton[calendarSize]), icon: "angle-left", size: calendarSize }), _jsx(Button, { variant: "ghost", color: "gray", size: calendarSize, onClick: onCaptionClick, className: "flex-1 min-w-0 text-xs sm:text-sm", children: caption }), _jsx(IconButton, { variant: "ghost", color: "gray", onClick: onNextClick, className: cn(calendarStyles.navButton[calendarSize]), icon: "angle-right", size: calendarSize })] }));
+    return (<div className="flex items-center justify-between gap-1 sm:gap-2">
+      <IconButton variant="ghost" color="gray" onClick={onPrevClick} className={cn(calendarStyles.navButton[calendarSize])} icon="angle-left" size={calendarSize}/>
+      <Button variant="ghost" color="gray" size={calendarSize} onClick={onCaptionClick} className="flex-1 min-w-0 text-xs sm:text-sm">
+        {caption}
+      </Button>
+      <IconButton variant="ghost" color="gray" onClick={onNextClick} className={cn(calendarStyles.navButton[calendarSize])} icon="angle-right" size={calendarSize}/>
+    </div>);
 }
 function DaysCaption(_a) {
     var calendarMonth = _a.calendarMonth, setPickerView = _a.setPickerView, displayMonth = _a.displayMonth, setDisplayMonth = _a.setDisplayMonth, calendarSize = _a.calendarSize;
@@ -128,14 +135,21 @@ function DaysCaption(_a) {
         newDate.setMonth(newDate.getMonth() + 1);
         setDisplayMonth(newDate);
     };
-    return (_jsx(CustomCaption, { calendarSize: calendarSize, caption: calendarMonth.toLocaleString("default", {
+    return (<CustomCaption calendarSize={calendarSize} caption={calendarMonth.toLocaleString("default", {
             month: "long",
             year: "numeric",
-        }), onPrevClick: handlePrevMonth, onCaptionClick: handleCaptionClick, onNextClick: handleNextMonth }));
+        })} onPrevClick={handlePrevMonth} onCaptionClick={handleCaptionClick} onNextClick={handleNextMonth}/>);
 }
 function CustomPicker(_a) {
     var caption = _a.caption, calendarSize = _a.calendarSize, onPrevClick = _a.onPrevClick, onCaptionClick = _a.onCaptionClick, onNextClick = _a.onNextClick, data = _a.data, onClick = _a.onClick, activeIndex = _a.activeIndex, activeItem = _a.activeItem;
-    return (_jsxs("div", { className: "bg-white rounded-sm p-1 sm:p-2 w-xs sm:w-lg", children: [_jsx(CustomCaption, { caption: caption, onPrevClick: onPrevClick, onCaptionClick: onCaptionClick, onNextClick: onNextClick, calendarSize: calendarSize }), _jsx("div", { className: "grid grid-cols-3 sm:grid-cols-4 gap-1 sm:gap-2", children: data.map(function (item, index) { return (_jsx(Button, { onClick: function () { return onClick(item, index); }, variant: activeIndex === index || activeItem === item ? "fill" : "ghost", color: activeIndex === index || activeItem === item ? "blue" : "gray", size: calendarSize, className: cn("w-full text-xs sm:text-sm aspect-square", calendarStyles.customPickerNavButton[calendarSize]), children: item }, item)); }) })] }));
+    return (<div className="bg-white rounded-sm p-1 sm:p-2 w-xs sm:w-lg">
+      <CustomCaption caption={caption} onPrevClick={onPrevClick} onCaptionClick={onCaptionClick} onNextClick={onNextClick} calendarSize={calendarSize}/>
+      <div className="grid grid-cols-3 sm:grid-cols-4 gap-1 sm:gap-2">
+        {data.map(function (item, index) { return (<Button key={item} onClick={function () { return onClick(item, index); }} variant={activeIndex === index || activeItem === item ? "fill" : "ghost"} color={activeIndex === index || activeItem === item ? "blue" : "gray"} size={calendarSize} className={cn("w-full text-xs sm:text-sm aspect-square", calendarStyles.customPickerNavButton[calendarSize])}>
+            {item}
+          </Button>); })}
+      </div>
+    </div>);
 }
 function MonthPicker(_a) {
     var displayMonth = _a.displayMonth, setDisplayMonth = _a.setDisplayMonth, setPickerView = _a.setPickerView, calendarSize = _a.calendarSize;
@@ -172,7 +186,7 @@ function MonthPicker(_a) {
         newDate.setFullYear(newDate.getFullYear() + 1);
         setDisplayMonth(newDate);
     };
-    return (_jsx(CustomPicker, { caption: displayMonth.getFullYear(), calendarSize: calendarSize, onPrevClick: handlePrevYear, onCaptionClick: handleYearClick, onNextClick: handleNextYear, data: months, onClick: handleMonthSelect, activeIndex: displayMonth.getMonth() }));
+    return (<CustomPicker caption={displayMonth.getFullYear()} calendarSize={calendarSize} onPrevClick={handlePrevYear} onCaptionClick={handleYearClick} onNextClick={handleNextYear} data={months} onClick={handleMonthSelect} activeIndex={displayMonth.getMonth()}/>);
 }
 function YearPicker(_a) {
     var displayMonth = _a.displayMonth, setDisplayMonth = _a.setDisplayMonth, setPickerView = _a.setPickerView, calendarSize = _a.calendarSize;
@@ -195,7 +209,7 @@ function YearPicker(_a) {
         newDate.setFullYear(newDate.getFullYear() + 12);
         setDisplayMonth(newDate);
     };
-    return (_jsx(CustomPicker, { caption: displayMonth.getFullYear(), onPrevClick: handlePrevYears, onNextClick: handleNextYears, calendarSize: calendarSize, activeItem: displayMonth.getFullYear(), data: years, onClick: handleYearSelect }));
+    return (<CustomPicker caption={displayMonth.getFullYear()} onPrevClick={handlePrevYears} onNextClick={handleNextYears} calendarSize={calendarSize} activeItem={displayMonth.getFullYear()} data={years} onClick={handleYearSelect}/>);
 }
 function CalendarDayButton(_a) {
     var className = _a.className, day = _a.day, modifiers = _a.modifiers, calendarSize = _a.calendarSize, props = __rest(_a, ["className", "day", "modifiers", "calendarSize"]);
@@ -213,10 +227,10 @@ function CalendarDayButton(_a) {
     var rangeStartClasses = "data-[range-start=true]:bg-black data-[range-start=true]:text-white data-[range-start=true]:hover:bg-black data-[range-start=true]:rounded-sm data-[range-start=true]:rounded-l-sm";
     var rangeEndClasses = "data-[range-end=true]:bg-black data-[range-end=true]:text-white data-[range-end=true]:hover:bg-black data-[range-end=true]:rounded-sm data-[range-end=true]:rounded-r-sm";
     var outsideClasses = "data-[outside=true]:text-gray-400 data-[outside=true]:hover:text-gray-400";
-    return (_jsx(Button, __assign({ ref: ref, variant: "ghost", "data-day": day.date.toLocaleDateString(), "data-selected-single": modifiers.selected &&
+    return (<Button ref={ref} variant="ghost" data-day={day.date.toLocaleDateString()} data-selected-single={modifiers.selected &&
             !modifiers.range_start &&
             !modifiers.range_end &&
-            !modifiers.range_middle, "data-range-start": modifiers.range_start, "data-range-end": modifiers.range_end, "data-range-middle": modifiers.range_middle, "data-outside": isOutside, className: cn(defaultClasses, selectedSingleClasses, rangeMiddleClasses, rangeStartClasses, rangeEndClasses, outsideClasses, "group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10", "[&>span]:text-xs [&>span]:opacity-70", "text-xs sm:text-sm", calendarStyles.cellButton[calendarSize], defaultClassNames.day, className) }, props)));
+            !modifiers.range_middle} data-range-start={modifiers.range_start} data-range-end={modifiers.range_end} data-range-middle={modifiers.range_middle} data-outside={isOutside} className={cn(defaultClasses, selectedSingleClasses, rangeMiddleClasses, rangeStartClasses, rangeEndClasses, outsideClasses, "group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10", "[&>span]:text-xs [&>span]:opacity-70", "text-xs sm:text-sm", calendarStyles.cellButton[calendarSize], defaultClassNames.day, className)} {...props}/>);
 }
 export { Calendar, CalendarDayButton };
 var templateObject_1, templateObject_2;

package/dist/src/components/ui/command.d.ts

@@ -1,22 +1,22 @@
 import * as React from "react";
 import { Command as CommandPrimitive } from "cmdk";
 import { Dialog } from "../../components/Dropdown/Combobox/dialog";
-declare function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>): import("react/jsx-runtime").JSX.Element;
+declare function Command({ className, ...props }: React.ComponentProps<typeof CommandPrimitive>): React.JSX.Element;
 declare function CommandDialog({ title, description, children, className, showCloseButton, ...props }: React.ComponentProps<typeof Dialog> & {
     title?: string;
     description?: string;
     className?: string;
     showCloseButton?: boolean;
-}): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;
 declare function CommandInput({ className, size, ...props }: Omit<React.ComponentProps<typeof CommandPrimitive.Input>, "size"> & {
     size?: "sm" | "md" | "lg";
-}): import("react/jsx-runtime").JSX.Element;
-declare function CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>): import("react/jsx-runtime").JSX.Element;
-declare function CommandEmpty({ ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>): import("react/jsx-runtime").JSX.Element;
-declare function CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>): import("react/jsx-runtime").JSX.Element;
-declare function CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;
+declare function CommandList({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.List>): React.JSX.Element;
+declare function CommandEmpty({ ...props }: React.ComponentProps<typeof CommandPrimitive.Empty>): React.JSX.Element;
+declare function CommandGroup({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Group>): React.JSX.Element;
+declare function CommandSeparator({ className, ...props }: React.ComponentProps<typeof CommandPrimitive.Separator>): React.JSX.Element;
 declare function CommandItem({ className, size, ...props }: React.ComponentProps<typeof CommandPrimitive.Item> & {
     size?: "sm" | "md" | "lg";
-}): import("react/jsx-runtime").JSX.Element;
-declare function CommandShortcut({ className, ...props }: React.ComponentProps<"span">): import("react/jsx-runtime").JSX.Element;
+}): React.JSX.Element;
+declare function CommandShortcut({ className, ...props }: React.ComponentProps<"span">): React.JSX.Element;
 export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/src/components/ui/command.jsx

@@ -0,0 +1,67 @@
+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;
+};
+import * as React from "react";
+import { Command as CommandPrimitive } from "cmdk";
+import { cn } from "../../lib/utils";
+import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle, } from "../../components/Dropdown/Combobox/dialog";
+import LUIcon from "../Icons/LUIcon";
+import { comboboxSizes, searchIconSizeMap } from "../Dropdown/Combobox";
+function Command(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<CommandPrimitive data-slot="command" className={cn("bg-white text-gray-900 !p-2 flex flex-col gap-2 overflow-hidden rounded-sm shadow-lg", className)} {...props}/>);
+}
+function CommandDialog(_a) {
+    var _b = _a.title, title = _b === void 0 ? "Command Palette" : _b, _c = _a.description, description = _c === void 0 ? "Search for a command to run..." : _c, children = _a.children, className = _a.className, _d = _a.showCloseButton, showCloseButton = _d === void 0 ? true : _d, props = __rest(_a, ["title", "description", "children", "className", "showCloseButton"]);
+    return (<Dialog {...props}>
+      <DialogHeader className="sr-only">
+        <DialogTitle>{title}</DialogTitle>
+        <DialogDescription>{description}</DialogDescription>
+      </DialogHeader>
+      <DialogContent className={cn("overflow-hidden p-0", className)} showCloseButton={showCloseButton}>
+        <Command className="[&_[cmdk-group-heading]]:text-muted-foreground [&_[data-slot=command-input-wrapper]]:h-12 [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group]]:px-2 [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-3 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5">
+          {children}
+        </Command>
+      </DialogContent>
+    </Dialog>);
+}
+function CommandInput(_a) {
+    var className = _a.className, _b = _a.size, size = _b === void 0 ? "md" : _b, props = __rest(_a, ["className", "size"]);
+    return (<div data-slot="command-input-wrapper" className={cn("flex items-center gap-2 border border-gray-200 rounded-sm font-normal !leading-normal !px-4 !py-3 ".concat(comboboxSizes[size]), className)}>
+      <LUIcon icon="magnifying-glass" size={searchIconSizeMap[size]}/>
+      <CommandPrimitive.Input data-slot="command-input" className={cn("placeholder:text-gray-400 flex outline-hidden disabled:cursor-not-allowed disabled:opacity-50")} {...props}/>
+    </div>);
+}
+function CommandList(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<CommandPrimitive.List data-slot="command-list" className={cn("scroll-py-1 overflow-x-hidden overflow-y-auto scrollbar-width-none [&::-webkit-scrollbar]:hidden max-h-[200px] sm:max-h-[320px]", className)} {...props}/>);
+}
+function CommandEmpty(_a) {
+    var props = __rest(_a, []);
+    return (<CommandPrimitive.Empty data-slot="command-empty" className="py-6 text-center text-sm" {...props}/>);
+}
+function CommandGroup(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<CommandPrimitive.Group data-slot="command-group" className={cn("text-foreground [&_[cmdk-group-heading]]:text-muted-foreground overflow-hidden [&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:py-1.5 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium", className)} {...props}/>);
+}
+function CommandSeparator(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<CommandPrimitive.Separator data-slot="command-separator" className={cn("bg-border -mx-1 h-px", className)} {...props}/>);
+}
+function CommandItem(_a) {
+    var className = _a.className, _b = _a.size, size = _b === void 0 ? "md" : _b, props = __rest(_a, ["className", "size"]);
+    return (<CommandPrimitive.Item data-slot="command-item" className={cn("hover:bg-blue-50 hover:text-gray-900 relative flex cursor-default items-center gap-2 !px-4 !py-3 outline-hidden select-none data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 font-normal !leading-normal ".concat(comboboxSizes[size]), className)} {...props}/>);
+}
+function CommandShortcut(_a) {
+    var className = _a.className, props = __rest(_a, ["className"]);
+    return (<span data-slot="command-shortcut" className={cn("text-muted-foreground ml-auto text-xs tracking-widest", className)} {...props}/>);
+}
+export { Command, CommandDialog, CommandInput, CommandList, CommandEmpty, CommandGroup, CommandItem, CommandShortcut, CommandSeparator, };

package/dist/src/components/ui/popover.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import * as PopoverPrimitive from "@radix-ui/react-popover";
-declare function Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
-declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
-declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): import("react/jsx-runtime").JSX.Element;
+declare function Popover({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Root>): React.JSX.Element;
+declare function PopoverTrigger({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Trigger>): React.JSX.Element;
+declare function PopoverContent({ className, align, sideOffset, ...props }: React.ComponentProps<typeof PopoverPrimitive.Content>): React.JSX.Element;
+declare function PopoverAnchor({ ...props }: React.ComponentProps<typeof PopoverPrimitive.Anchor>): React.JSX.Element;
 export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };

package/dist/src/components/ui/popover.jsx

@@ -0,0 +1,33 @@
+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;
+};
+import * as React from "react";
+import * as PopoverPrimitive from "@radix-ui/react-popover";
+import { cn } from "../../lib/utils";
+function Popover(_a) {
+    var props = __rest(_a, []);
+    return <PopoverPrimitive.Root data-slot="popover" {...props}/>;
+}
+function PopoverTrigger(_a) {
+    var props = __rest(_a, []);
+    return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props}/>;
+}
+function PopoverContent(_a) {
+    var className = _a.className, _b = _a.align, align = _b === void 0 ? "center" : _b, _c = _a.sideOffset, sideOffset = _c === void 0 ? 4 : _c, props = __rest(_a, ["className", "align", "sideOffset"]);
+    return (<PopoverPrimitive.Portal>
+      <PopoverPrimitive.Content data-slot="popover-content" align={align} sideOffset={sideOffset} className={cn("data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 origin-(--radix-popover-content-transform-origin) outline-hidden", className)} {...props}/>
+    </PopoverPrimitive.Portal>);
+}
+function PopoverAnchor(_a) {
+    var props = __rest(_a, []);
+    return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props}/>;
+}
+export { Popover, PopoverTrigger, PopoverContent, PopoverAnchor };

package/dist/src/components/ui/tooltip.d.ts

@@ -1,7 +1,7 @@
 import * as React from "react";
 import * as TooltipPrimitive from "@radix-ui/react-tooltip";
-declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): import("react/jsx-runtime").JSX.Element;
-declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): import("react/jsx-runtime").JSX.Element;
-declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): import("react/jsx-runtime").JSX.Element;
-declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): import("react/jsx-runtime").JSX.Element;
+declare function TooltipProvider({ delayDuration, ...props }: React.ComponentProps<typeof TooltipPrimitive.Provider>): React.JSX.Element;
+declare function Tooltip({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Root>): React.JSX.Element;
+declare function TooltipTrigger({ ...props }: React.ComponentProps<typeof TooltipPrimitive.Trigger>): React.JSX.Element;
+declare function TooltipContent({ className, sideOffset, children, ...props }: React.ComponentProps<typeof TooltipPrimitive.Content>): React.JSX.Element;
 export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/dist/src/components/ui/tooltip.jsx

@@ -0,0 +1,38 @@
+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;
+};
+import * as React from "react";
+import * as TooltipPrimitive from "@radix-ui/react-tooltip";
+import { cn } from "../../lib/utils";
+function TooltipProvider(_a) {
+    var _b = _a.delayDuration, delayDuration = _b === void 0 ? 0 : _b, props = __rest(_a, ["delayDuration"]);
+    return (<TooltipPrimitive.Provider data-slot="tooltip-provider" delayDuration={delayDuration} {...props}/>);
+}
+function Tooltip(_a) {
+    var props = __rest(_a, []);
+    return (<TooltipProvider>
+      <TooltipPrimitive.Root data-slot="tooltip" {...props}/>
+    </TooltipProvider>);
+}
+function TooltipTrigger(_a) {
+    var props = __rest(_a, []);
+    return <TooltipPrimitive.Trigger data-slot="tooltip-trigger" {...props}/>;
+}
+function TooltipContent(_a) {
+    var className = _a.className, _b = _a.sideOffset, sideOffset = _b === void 0 ? 0 : _b, children = _a.children, props = __rest(_a, ["className", "sideOffset", "children"]);
+    return (<TooltipPrimitive.Portal>
+      <TooltipPrimitive.Content data-slot="tooltip-content" sideOffset={sideOffset} className={cn("!bg-primary !text-primary-foreground animate-in fade-in-0 !zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 !w-fit origin-(--radix-tooltip-content-transform-origin) !rounded-md !px-3 !py-1.5 !text-xs !text-balance", className)} {...props}>
+        {children}
+        <TooltipPrimitive.Arrow className="!bg-primary !fill-primary z-50 !size-3 translate-y-[calc(-50%_-_2px)] rotate-45 !rounded-[2px]"/>
+      </TooltipPrimitive.Content>
+    </TooltipPrimitive.Portal>);
+}
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/dist/src/components/ui/typography.d.ts

@@ -22,5 +22,5 @@ declare const typographyVariants: (props?: ({
 type TypographyProps = React.HTMLProps<HTMLElement> & VariantProps<typeof typographyVariants> & {
     variant?: keyof typeof variant;
 };
-declare function Typography({ className, variant, children, ...props }: TypographyProps): import("react/jsx-runtime").JSX.Element;
+declare function Typography({ className, variant, children, ...props }: TypographyProps): React.JSX.Element;
 export { Typography, typographyVariants };

package/dist/src/components/ui/{typography.js → typography.jsx}

@@ -1,14 +1,3 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
 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)
@@ -20,7 +9,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import { jsx as _jsx } from "react/jsx-runtime";
+import * as React from "react";
 import { cva } from "class-variance-authority";
 import { cn } from "../../lib/utils";
 export var variant = {
@@ -60,6 +49,8 @@ function Typography(_a) {
     else if (variant === null || variant === void 0 ? void 0 : variant.startsWith("b")) {
         Tag = "p";
     }
-    return (_jsx(Tag, __assign({ className: cn(typographyVariants({ variant: variant, className: className })) }, props, { children: children })));
+    return (<Tag className={cn(typographyVariants({ variant: variant, className: className }))} {...props}>
+      {children}
+    </Tag>);
 }
 export { Typography, typographyVariants };

package/dist/styles/global.css

@@ -247,6 +247,12 @@
   .inset-0 {
     inset: calc(var(--spacing) * 0);
   }
+  .inset-x-0 {
+    inset-inline: calc(var(--spacing) * 0);
+  }
+  .inset-y-0 {
+    inset-block: calc(var(--spacing) * 0);
+  }
   .top-0 {
     top: calc(var(--spacing) * 0);
   }
@@ -379,9 +385,15 @@
   .mx-2 {
     margin-inline: calc(var(--spacing) * 2);
   }
+  .mx-4 {
+    margin-inline: calc(var(--spacing) * 4);
+  }
   .mx-auto {
     margin-inline: auto;
   }
+  .\!my-1 {
+    margin-block: calc(var(--spacing) * 1) !important;
+  }
   .my-1 {
     margin-block: calc(var(--spacing) * 1);
   }
@@ -476,6 +488,9 @@
   .block {
     display: block;
   }
+  .contents {
+    display: contents;
+  }
   .flex {
     display: flex;
   }
@@ -883,6 +898,9 @@
   .w-full {
     width: 100%;
   }
+  .w-px {
+    width: 1px;
+  }
   .w-xs {
     width: var(--container-xs);
   }
@@ -1359,6 +1377,10 @@
     border-bottom-style: var(--tw-border-style);
     border-bottom-width: 0px;
   }
+  .border-l {
+    border-left-style: var(--tw-border-style);
+    border-left-width: 1px;
+  }
   .border-l-4 {
     border-left-style: var(--tw-border-style);
     border-left-width: 4px;
@@ -1864,9 +1886,6 @@
   .py-3 {
     padding-block: calc(var(--spacing) * 3);
   }
-  .py-4 {
-    padding-block: calc(var(--spacing) * 4);
-  }
   .py-6 {
     padding-block: calc(var(--spacing) * 6);
   }
@@ -1888,8 +1907,8 @@
   .\!pt-4 {
     padding-top: calc(var(--spacing) * 4) !important;
   }
-  .pr-2 {
-    padding-right: calc(var(--spacing) * 2);
+  .\!pr-2 {
+    padding-right: calc(var(--spacing) * 2) !important;
   }
   .pr-2\.5 {
     padding-right: calc(var(--spacing) * 2.5);
@@ -2070,6 +2089,10 @@
     --tw-font-weight: var(--font-weight-normal);
     font-weight: var(--font-weight-normal);
   }
+  .font-normal\! {
+    --tw-font-weight: var(--font-weight-normal) !important;
+    font-weight: var(--font-weight-normal) !important;
+  }
   .font-semibold {
     --tw-font-weight: var(--font-weight-semibold);
     font-weight: var(--font-weight-semibold);
@@ -2512,6 +2535,9 @@
   .\[--cell-size\:--spacing\(6\)\] {
     --cell-size: calc(var(--spacing) * 6);
   }
+  .lu-border {
+    border: 1px solid currentColor;
+  }
   .running {
     animation-play-state: running;
   }
@@ -4512,6 +4538,12 @@
       opacity: 0%;
     }
   }
+  .data-\[state\=closed\]\:duration-300 {
+    &[data-state="closed"] {
+      --tw-duration: 300ms;
+      transition-duration: 300ms;
+    }
+  }
   .data-\[state\=closed\]\:fade-out-0 {
     &[data-state="closed"] {
       --tw-exit-opacity: calc(0/100);
@@ -4524,6 +4556,26 @@
       --tw-exit-scale: .95;
     }
   }
+  .data-\[state\=closed\]\:slide-out-to-bottom {
+    &[data-state="closed"] {
+      --tw-exit-translate-y: 100%;
+    }
+  }
+  .data-\[state\=closed\]\:slide-out-to-left {
+    &[data-state="closed"] {
+      --tw-exit-translate-x: -100%;
+    }
+  }
+  .data-\[state\=closed\]\:slide-out-to-right {
+    &[data-state="closed"] {
+      --tw-exit-translate-x: 100%;
+    }
+  }
+  .data-\[state\=closed\]\:slide-out-to-top {
+    &[data-state="closed"] {
+      --tw-exit-translate-y: -100%;
+    }
+  }
   .data-\[state\=inactive\]\:bg-blue-100 {
     &[data-state="inactive"] {
       background-color: #e2edf9;
@@ -4557,6 +4609,11 @@
       background-color: var(--accent);
     }
   }
+  .data-\[state\=open\]\:bg-secondary {
+    &[data-state="open"] {
+      background-color: var(--secondary);
+    }
+  }
   .data-\[state\=open\]\:text-muted-foreground {
     &[data-state="open"] {
       color: var(--muted-foreground);
@@ -4567,6 +4624,12 @@
       opacity: 100%;
     }
   }
+  .data-\[state\=open\]\:duration-500 {
+    &[data-state="open"] {
+      --tw-duration: 500ms;
+      transition-duration: 500ms;
+    }
+  }
   .data-\[state\=open\]\:fade-in-0 {
     &[data-state="open"] {
       --tw-enter-opacity: calc(0/100);
@@ -4579,6 +4642,26 @@
       --tw-enter-scale: .95;
     }
   }
+  .data-\[state\=open\]\:slide-in-from-bottom {
+    &[data-state="open"] {
+      --tw-enter-translate-y: 100%;
+    }
+  }
+  .data-\[state\=open\]\:slide-in-from-left {
+    &[data-state="open"] {
+      --tw-enter-translate-x: -100%;
+    }
+  }
+  .data-\[state\=open\]\:slide-in-from-right {
+    &[data-state="open"] {
+      --tw-enter-translate-x: 100%;
+    }
+  }
+  .data-\[state\=open\]\:slide-in-from-top {
+    &[data-state="open"] {
+      --tw-enter-translate-y: -100%;
+    }
+  }
   .data-\[state\=selected\]\:bg-gray-50 {
     &[data-state="selected"] {
       background-color: #fafafa;
@@ -4666,6 +4749,11 @@
       max-width: var(--container-lg);
     }
   }
+  .sm\:max-w-sm {
+    @media (width >= 40rem) {
+      max-width: var(--container-sm);
+    }
+  }
   .sm\:grid-cols-2 {
     @media (width >= 40rem) {
       grid-template-columns: repeat(2, minmax(0, 1fr));
@@ -4701,6 +4789,15 @@
       gap: calc(var(--spacing) * 2);
     }
   }
+  .sm\:space-x-2 {
+    @media (width >= 40rem) {
+      :where(& > :not(:last-child)) {
+        --tw-space-x-reverse: 0;
+        margin-inline-start: calc(calc(var(--spacing) * 2) * var(--tw-space-x-reverse));
+        margin-inline-end: calc(calc(var(--spacing) * 2) * calc(1 - var(--tw-space-x-reverse)));
+      }
+    }
+  }
   .sm\:p-2 {
     @media (width >= 40rem) {
       padding: calc(var(--spacing) * 2);
@@ -4780,6 +4877,11 @@
       gap: calc(var(--spacing) * 4);
     }
   }
+  .md\:pl-2 {
+    @media (width >= 48rem) {
+      padding-left: calc(var(--spacing) * 2);
+    }
+  }
   .md\:\!text-sm {
     @media (width >= 48rem) {
       font-size: var(--text-sm) !important;