@omnifyjp/ui 0.5.3 → 1.0.1

package/dist/components/checkbox.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+
+type CheckboxProps = React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>;
+/**
+ * Checkable input that allows selecting one or more options from a set.
+ * Supports checked, unchecked, and indeterminate states.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Checkbox id="terms" />
+ * <Label htmlFor="terms">Accept terms</Label>
+ *
+ * // Controlled
+ * <Checkbox checked={accepted} onCheckedChange={setAccepted} />
+ *
+ * // Indeterminate (partial selection)
+ * <Checkbox checked="indeterminate" />
+ * ```
+ */
+declare const Checkbox: React.ForwardRefExoticComponent<Omit<CheckboxPrimitive.CheckboxProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+
+export { Checkbox, type CheckboxProps };

package/dist/components/checkbox.js

@@ -0,0 +1,4 @@
+export { Checkbox } from '../chunk-WL4ZO2H3.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=checkbox.js.map
+//# sourceMappingURL=checkbox.js.map

package/dist/components/checkbox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"checkbox.js"}

package/dist/components/collapsible.d.ts

@@ -0,0 +1,28 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+
+/**
+ * Expandable/collapsible container built on Radix Collapsible.
+ *
+ * Manages open/closed state for a single content region. For multiple
+ * collapsible sections, consider using `Accordion` instead.
+ *
+ * @example
+ * ```tsx
+ * <Collapsible>
+ *   <CollapsibleTrigger asChild>
+ *     <Button variant="ghost">Toggle details</Button>
+ *   </CollapsibleTrigger>
+ *   <CollapsibleContent>
+ *     <p>Hidden content revealed on toggle.</p>
+ *   </CollapsibleContent>
+ * </Collapsible>
+ * ```
+ */
+declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): react_jsx_runtime.JSX.Element;
+/** Button or element that toggles the collapsible open/closed state. Supports `asChild` for custom trigger elements. */
+declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): react_jsx_runtime.JSX.Element;
+/** Content region that shows/hides when the collapsible is toggled. */
+declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): react_jsx_runtime.JSX.Element;
+
+export { Collapsible, CollapsibleContent, CollapsibleTrigger };

package/dist/components/collapsible.js

@@ -0,0 +1,3 @@
+export { Collapsible, CollapsibleContent, CollapsibleTrigger } from '../chunk-3EOHW4QN.js';
+//# sourceMappingURL=collapsible.js.map
+//# sourceMappingURL=collapsible.js.map

package/dist/components/collapsible.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"collapsible.js"}

package/dist/components/color-picker.d.ts

@@ -0,0 +1,35 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+interface ColorPickerProps {
+    /** Currently selected color as a hex string (e.g., `"#3B82F6"`). */
+    value?: string;
+    /** Callback fired when a color is selected. Receives a hex string. */
+    onChange?: (color: string) => void;
+    /** Additional CSS class for the trigger button. */
+    className?: string;
+    /** Whether the color picker is disabled. */
+    disabled?: boolean;
+    /** Whether to show the preset color grid. Defaults to `true`. */
+    showPresets?: boolean;
+    /** Whether to show the custom hex input with native color picker. Defaults to `true`. */
+    showInput?: boolean;
+}
+/**
+ * Color picker with a popover containing preset color swatches and an optional custom hex input.
+ * The trigger button shows the currently selected color swatch and its hex value.
+ *
+ * @example
+ * ```tsx
+ * const [color, setColor] = useState("#3B82F6");
+ *
+ * <ColorPicker
+ *   value={color}
+ *   onChange={setColor}
+ *   showPresets
+ *   showInput
+ * />
+ * ```
+ */
+declare function ColorPicker({ value, onChange, className, disabled, showPresets, showInput, }: ColorPickerProps): react_jsx_runtime.JSX.Element;
+
+export { ColorPicker };

package/dist/components/color-picker.js

@@ -0,0 +1,7 @@
+export { ColorPicker } from '../chunk-MJLFJPUG.js';
+import '../chunk-3VU56V66.js';
+import '../chunk-C34KSTWA.js';
+import '../chunk-55E7D2HR.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=color-picker.js.map
+//# sourceMappingURL=color-picker.js.map

package/dist/components/color-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"color-picker.js"}

package/dist/components/combobox.d.ts

@@ -0,0 +1,98 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+
+/** A single option in the Combobox dropdown. */
+interface ComboboxOption {
+    /** Unique value for this option. */
+    value: string;
+    /** Display label shown in the dropdown list. */
+    label: string;
+    /** Whether this option is non-selectable. */
+    disabled?: boolean;
+}
+interface ComboboxProps {
+    /** Available options to display in the dropdown. */
+    options: ComboboxOption[];
+    /** Currently selected value. */
+    value?: string;
+    /** Callback fired when the selected value changes. */
+    onChange?: (value: string) => void;
+    /** Placeholder text shown when no value is selected. */
+    placeholder?: string;
+    /** Placeholder text for the search input inside the dropdown. */
+    searchPlaceholder?: string;
+    /** Text shown when no options match the search query. */
+    emptyText?: string;
+    /** Additional CSS class for the trigger button. */
+    className?: string;
+    /** Whether the combobox is disabled. */
+    disabled?: boolean;
+    /** Whether to show a clear button when a value is selected. */
+    clearable?: boolean;
+}
+/**
+ * Searchable single-select combobox built on cmdk and Radix Popover.
+ * Combines a text search input with a selectable option list.
+ *
+ * @example
+ * ```tsx
+ * const [value, setValue] = useState("");
+ *
+ * <Combobox
+ *   options={[
+ *     { value: "react", label: "React" },
+ *     { value: "vue", label: "Vue" },
+ *     { value: "svelte", label: "Svelte" },
+ *   ]}
+ *   value={value}
+ *   onChange={setValue}
+ *   placeholder="Select framework..."
+ *   searchPlaceholder="Search..."
+ *   clearable
+ * />
+ * ```
+ */
+declare function Combobox({ options, value, onChange, placeholder, searchPlaceholder, emptyText, className, disabled, clearable, }: ComboboxProps): react_jsx_runtime.JSX.Element;
+interface MultiComboboxProps {
+    /** Available options to display in the dropdown. */
+    options: ComboboxOption[];
+    /** Array of currently selected values. */
+    value?: string[];
+    /** Callback fired when the selection changes. */
+    onChange?: (value: string[]) => void;
+    /** Placeholder text shown when no values are selected. */
+    placeholder?: string;
+    /** Placeholder text for the search input inside the dropdown. */
+    searchPlaceholder?: string;
+    /** Text shown when no options match the search query. */
+    emptyText?: string;
+    /** Additional CSS class for the trigger button. */
+    className?: string;
+    /** Whether the combobox is disabled. */
+    disabled?: boolean;
+    /** Maximum number of items that can be selected. */
+    maxSelected?: number;
+}
+/**
+ * Searchable multi-select combobox that allows selecting multiple values.
+ * Selected items are shown as a count in the trigger button.
+ *
+ * @example
+ * ```tsx
+ * const [selected, setSelected] = useState<string[]>([]);
+ *
+ * <MultiCombobox
+ *   options={[
+ *     { value: "react", label: "React" },
+ *     { value: "vue", label: "Vue" },
+ *     { value: "svelte", label: "Svelte" },
+ *   ]}
+ *   value={selected}
+ *   onChange={setSelected}
+ *   placeholder="Select frameworks..."
+ *   maxSelected={3}
+ * />
+ * ```
+ */
+declare function MultiCombobox({ options, value, onChange, placeholder, searchPlaceholder, emptyText, className, disabled, maxSelected, }: MultiComboboxProps): react_jsx_runtime.JSX.Element;
+
+export { Combobox, type ComboboxOption, MultiCombobox };

package/dist/components/combobox.js

@@ -0,0 +1,8 @@
+export { Combobox, MultiCombobox } from '../chunk-NPL2R5LD.js';
+import '../chunk-C34KSTWA.js';
+import '../chunk-6GWVQB3Q.js';
+import '../chunk-F2ZJLKDP.js';
+import '../chunk-55E7D2HR.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=combobox.js.map
+//# sourceMappingURL=combobox.js.map

package/dist/components/combobox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"combobox.js"}

package/dist/components/command.d.ts

@@ -0,0 +1,63 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import { Command as Command$1 } from 'cmdk';
+import { Dialog } from './dialog.js';
+import '@radix-ui/react-dialog';
+
+/**
+ * Command palette component built on cmdk.
+ *
+ * Provides a searchable, keyboard-navigable list of commands or options.
+ * Use `CommandDialog` for a modal command palette, or `Command` inline
+ * for embedded search/filter interfaces like comboboxes.
+ *
+ * @example
+ * ```tsx
+ * <CommandDialog open={open} onOpenChange={setOpen}>
+ *   <CommandInput placeholder="Type a command or search..." />
+ *   <CommandList>
+ *     <CommandEmpty>No results found.</CommandEmpty>
+ *     <CommandGroup heading="Suggestions">
+ *       <CommandItem>
+ *         <CalendarIcon className="size-4" />
+ *         Calendar
+ *       </CommandItem>
+ *       <CommandItem>
+ *         <SearchIcon className="size-4" />
+ *         Search
+ *         <CommandShortcut>Ctrl+K</CommandShortcut>
+ *       </CommandItem>
+ *     </CommandGroup>
+ *     <CommandSeparator />
+ *     <CommandGroup heading="Settings">
+ *       <CommandItem>
+ *         <SettingsIcon className="size-4" />
+ *         Settings
+ *       </CommandItem>
+ *     </CommandGroup>
+ *   </CommandList>
+ * </CommandDialog>
+ * ```
+ */
+declare function Command({ className, ...props }: React.ComponentProps<typeof Command$1>): react_jsx_runtime.JSX.Element;
+/** Modal wrapper that renders a Command palette inside a Dialog. Accepts optional `title` and `description` for accessibility. */
+declare function CommandDialog({ title, description, children, ...props }: React.ComponentProps<typeof Dialog> & {
+    title?: string;
+    description?: string;
+}): react_jsx_runtime.JSX.Element;
+/** Search input field with a magnifying glass icon for filtering command items. */
+declare function CommandInput({ className, ...props }: React.ComponentProps<typeof Command$1.Input>): react_jsx_runtime.JSX.Element;
+/** Scrollable container for command groups and items. */
+declare function CommandList({ className, ...props }: React.ComponentProps<typeof Command$1.List>): react_jsx_runtime.JSX.Element;
+/** Fallback content shown when no command items match the search query. */
+declare function CommandEmpty({ ...props }: React.ComponentProps<typeof Command$1.Empty>): react_jsx_runtime.JSX.Element;
+/** Groups related command items under an optional heading. */
+declare function CommandGroup({ className, ...props }: React.ComponentProps<typeof Command$1.Group>): react_jsx_runtime.JSX.Element;
+/** Visual divider between groups of command items. */
+declare function CommandSeparator({ className, ...props }: React.ComponentProps<typeof Command$1.Separator>): react_jsx_runtime.JSX.Element;
+/** Selectable command item that can be navigated with keyboard arrows and activated with Enter. */
+declare function CommandItem({ className, ...props }: React.ComponentProps<typeof Command$1.Item>): react_jsx_runtime.JSX.Element;
+/** Keyboard shortcut hint displayed at the end of a command item. */
+declare function CommandShortcut({ className, ...props }: React.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+
+export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut };

package/dist/components/command.js

@@ -0,0 +1,5 @@
+export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from '../chunk-6GWVQB3Q.js';
+import '../chunk-F2ZJLKDP.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=command.js.map
+//# sourceMappingURL=command.js.map

package/dist/components/command.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"command.js"}

package/dist/components/context-menu.d.ts

@@ -0,0 +1,70 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
+
+/**
+ * Right-click context menu built on Radix UI ContextMenu.
+ *
+ * Displays a menu of actions when the user right-clicks (or long-presses)
+ * on the trigger area. Supports items, checkbox items, radio items,
+ * sub-menus, separators, labels, and shortcuts.
+ *
+ * @example
+ * ```tsx
+ * <ContextMenu>
+ *   <ContextMenuTrigger className="flex h-40 w-64 items-center justify-center rounded-md border border-dashed">
+ *     Right click here
+ *   </ContextMenuTrigger>
+ *   <ContextMenuContent>
+ *     <ContextMenuItem>
+ *       Copy
+ *       <ContextMenuShortcut>Ctrl+C</ContextMenuShortcut>
+ *     </ContextMenuItem>
+ *     <ContextMenuItem>
+ *       Paste
+ *       <ContextMenuShortcut>Ctrl+V</ContextMenuShortcut>
+ *     </ContextMenuItem>
+ *     <ContextMenuSeparator />
+ *     <ContextMenuItem variant="destructive">Delete</ContextMenuItem>
+ *   </ContextMenuContent>
+ * </ContextMenu>
+ * ```
+ */
+declare function ContextMenu({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Root>): react_jsx_runtime.JSX.Element;
+/** Area that opens the context menu on right-click. */
+declare function ContextMenuTrigger({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+/** Groups related context menu items together for accessibility. */
+declare function ContextMenuGroup({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Group>): react_jsx_runtime.JSX.Element;
+/** Portal that renders context menu content outside the DOM hierarchy. */
+declare function ContextMenuPortal({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Portal>): react_jsx_runtime.JSX.Element;
+/** Container for a nested sub-menu within the context menu. */
+declare function ContextMenuSub({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Sub>): react_jsx_runtime.JSX.Element;
+/** Container for radio context menu items where only one can be selected at a time. */
+declare function ContextMenuRadioGroup({ ...props }: React.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>): react_jsx_runtime.JSX.Element;
+/** Menu item that opens a sub-menu on hover. Displays a chevron indicator. */
+declare function ContextMenuSubTrigger({ className, inset, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Floating container for sub-menu items. */
+declare function ContextMenuSubContent({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.SubContent>): react_jsx_runtime.JSX.Element;
+/** Floating container for context menu items, positioned at the cursor location. */
+declare function ContextMenuContent({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Content>): react_jsx_runtime.JSX.Element;
+/** Actionable menu item. Set `variant="destructive"` for dangerous actions, `inset` for left-padding alignment. */
+declare function ContextMenuItem({ className, inset, variant, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Item> & {
+    inset?: boolean;
+    variant?: "default" | "destructive";
+}): react_jsx_runtime.JSX.Element;
+/** Menu item with a checkbox indicator for toggling options. */
+declare function ContextMenuCheckboxItem({ className, children, checked, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>): react_jsx_runtime.JSX.Element;
+/** Menu item with a radio indicator for single-selection groups. */
+declare function ContextMenuRadioItem({ className, children, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.RadioItem>): react_jsx_runtime.JSX.Element;
+/** Non-interactive label used to title a group of menu items. */
+declare function ContextMenuLabel({ className, inset, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Label> & {
+    inset?: boolean;
+}): react_jsx_runtime.JSX.Element;
+/** Visual divider between groups of menu items. */
+declare function ContextMenuSeparator({ className, ...props }: React.ComponentProps<typeof ContextMenuPrimitive.Separator>): react_jsx_runtime.JSX.Element;
+/** Keyboard shortcut hint displayed at the end of a menu item. */
+declare function ContextMenuShortcut({ className, ...props }: React.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
+
+export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger };

package/dist/components/context-menu.js

@@ -0,0 +1,4 @@
+export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger } from '../chunk-USIHM7FV.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=context-menu.js.map
+//# sourceMappingURL=context-menu.js.map

package/dist/components/context-menu.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"context-menu.js"}

package/dist/components/date-picker.d.ts

@@ -0,0 +1,71 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import { Locale } from 'date-fns';
+
+interface DatePickerProps {
+    /** Currently selected date. */
+    value?: Date;
+    /** Callback fired when a date is selected or cleared. */
+    onChange?: (date: Date | undefined) => void;
+    /** Placeholder text shown when no date is selected. */
+    placeholder?: string;
+    /** Additional CSS class for the trigger button. */
+    className?: string;
+    /** Whether the date picker is disabled. */
+    disabled?: boolean;
+    /** date-fns Locale object for date formatting (e.g., `ja` for Japanese). */
+    locale?: Locale;
+}
+/**
+ * Single date picker with a calendar popover.
+ * Displays the selected date formatted with date-fns and opens a calendar on click.
+ *
+ * @example
+ * ```tsx
+ * const [date, setDate] = useState<Date>();
+ *
+ * <DatePicker
+ *   value={date}
+ *   onChange={setDate}
+ *   placeholder="Pick a date"
+ * />
+ * ```
+ */
+declare function DatePicker({ value, onChange, placeholder, className, disabled, locale, }: DatePickerProps): react_jsx_runtime.JSX.Element;
+interface DateRangePickerProps {
+    /** Currently selected date range with `from` and optional `to`. */
+    value?: {
+        from: Date | undefined;
+        to?: Date | undefined;
+    };
+    /** Callback fired when the date range changes. */
+    onChange?: (range: {
+        from: Date | undefined;
+        to?: Date | undefined;
+    } | undefined) => void;
+    /** Placeholder text shown when no range is selected. */
+    placeholder?: string;
+    /** Additional CSS class for the trigger button. */
+    className?: string;
+    /** Whether the date range picker is disabled. */
+    disabled?: boolean;
+    /** date-fns Locale object for date formatting (e.g., `ja` for Japanese). */
+    locale?: Locale;
+}
+/**
+ * Date range picker with a two-month calendar popover.
+ * Allows selecting a start and end date displayed as a range string.
+ *
+ * @example
+ * ```tsx
+ * const [range, setRange] = useState<{ from: Date | undefined; to?: Date }>();
+ *
+ * <DateRangePicker
+ *   value={range}
+ *   onChange={setRange}
+ *   placeholder="Select date range"
+ * />
+ * ```
+ */
+declare function DateRangePicker({ value, onChange, placeholder, className, disabled, locale, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
+
+export { DatePicker, DateRangePicker };

package/dist/components/date-picker.js

@@ -0,0 +1,90 @@
+import { Popover, PopoverTrigger, PopoverContent } from '../chunk-C34KSTWA.js';
+import { Calendar as Calendar$1 } from '../chunk-QB3UWRZH.js';
+import { Button } from '../chunk-55E7D2HR.js';
+import { cn } from '../chunk-DGPY4WP3.js';
+import { format } from 'date-fns';
+import { Calendar } from 'lucide-react';
+import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
+
+function DatePicker({
+  value,
+  onChange,
+  placeholder = "Select date",
+  className,
+  disabled,
+  locale
+}) {
+  return /* @__PURE__ */ jsxs(Popover, { children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "outline",
+        disabled,
+        className: cn(
+          "w-full justify-start text-left font-normal",
+          !value && "text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Calendar, { className: "mr-2 h-4 w-4" }),
+          value ? format(value, "PPP", locale ? { locale } : void 0) : /* @__PURE__ */ jsx("span", { children: placeholder })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx(
+      Calendar$1,
+      {
+        mode: "single",
+        selected: value,
+        onSelect: onChange,
+        autoFocus: true
+      }
+    ) })
+  ] });
+}
+function DateRangePicker({
+  value,
+  onChange,
+  placeholder = "Select date range",
+  className,
+  disabled,
+  locale
+}) {
+  return /* @__PURE__ */ jsxs(Popover, { children: [
+    /* @__PURE__ */ jsx(PopoverTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(
+      Button,
+      {
+        variant: "outline",
+        disabled,
+        className: cn(
+          "w-full justify-start text-left font-normal",
+          !value && "text-muted-foreground",
+          className
+        ),
+        children: [
+          /* @__PURE__ */ jsx(Calendar, { className: "mr-2 h-4 w-4" }),
+          value?.from ? value.to ? /* @__PURE__ */ jsxs(Fragment, { children: [
+            format(value.from, "PPP", locale ? { locale } : void 0),
+            " -",
+            " ",
+            format(value.to, "PPP", locale ? { locale } : void 0)
+          ] }) : format(value.from, "PPP", locale ? { locale } : void 0) : /* @__PURE__ */ jsx("span", { children: placeholder })
+        ]
+      }
+    ) }),
+    /* @__PURE__ */ jsx(PopoverContent, { className: "w-auto p-0", align: "start", children: /* @__PURE__ */ jsx(
+      Calendar$1,
+      {
+        mode: "range",
+        selected: value,
+        onSelect: onChange,
+        numberOfMonths: 2,
+        autoFocus: true
+      }
+    ) })
+  ] });
+}
+
+export { DatePicker, DateRangePicker };
+//# sourceMappingURL=date-picker.js.map
+//# sourceMappingURL=date-picker.js.map

package/dist/components/date-picker.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/components/date-picker.tsx"],"names":["CalendarIcon","Calendar"],"mappings":"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","file":"date-picker.js","sourcesContent":["import { format } from \"date-fns\";\nimport { Calendar as CalendarIcon } from \"lucide-react\";\nimport type { Locale } from \"date-fns\";\n\nimport { cn } from \"../lib/utils\";\nimport { Button } from \"./button\";\nimport { Calendar } from \"./calendar\";\nimport { Popover, PopoverContent, PopoverTrigger } from \"./popover\";\n\ninterface DatePickerProps {\n  /** Currently selected date. */\n  value?: Date;\n  /** Callback fired when a date is selected or cleared. */\n  onChange?: (date: Date | undefined) => void;\n  /** Placeholder text shown when no date is selected. */\n  placeholder?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the date picker is disabled. */\n  disabled?: boolean;\n  /** date-fns Locale object for date formatting (e.g., `ja` for Japanese). */\n  locale?: Locale;\n}\n\n/**\n * Single date picker with a calendar popover.\n * Displays the selected date formatted with date-fns and opens a calendar on click.\n *\n * @example\n * ```tsx\n * const [date, setDate] = useState<Date>();\n *\n * <DatePicker\n *   value={date}\n *   onChange={setDate}\n *   placeholder=\"Pick a date\"\n * />\n * ```\n */\nexport function DatePicker({\n  value,\n  onChange,\n  placeholder = \"Select date\",\n  className,\n  disabled,\n  locale,\n}: DatePickerProps) {\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-start text-left font-normal\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <CalendarIcon className=\"mr-2 h-4 w-4\" />\n          {value ? format(value, \"PPP\", locale ? { locale } : undefined) : <span>{placeholder}</span>}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto p-0\" align=\"start\">\n        <Calendar\n          mode=\"single\"\n          selected={value}\n          onSelect={onChange}\n          autoFocus\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n\ninterface DateRangePickerProps {\n  /** Currently selected date range with `from` and optional `to`. */\n  value?: { from: Date | undefined; to?: Date | undefined };\n  /** Callback fired when the date range changes. */\n  onChange?: (range: { from: Date | undefined; to?: Date | undefined } | undefined) => void;\n  /** Placeholder text shown when no range is selected. */\n  placeholder?: string;\n  /** Additional CSS class for the trigger button. */\n  className?: string;\n  /** Whether the date range picker is disabled. */\n  disabled?: boolean;\n  /** date-fns Locale object for date formatting (e.g., `ja` for Japanese). */\n  locale?: Locale;\n}\n\n/**\n * Date range picker with a two-month calendar popover.\n * Allows selecting a start and end date displayed as a range string.\n *\n * @example\n * ```tsx\n * const [range, setRange] = useState<{ from: Date | undefined; to?: Date }>();\n *\n * <DateRangePicker\n *   value={range}\n *   onChange={setRange}\n *   placeholder=\"Select date range\"\n * />\n * ```\n */\nexport function DateRangePicker({\n  value,\n  onChange,\n  placeholder = \"Select date range\",\n  className,\n  disabled,\n  locale,\n}: DateRangePickerProps) {\n  return (\n    <Popover>\n      <PopoverTrigger asChild>\n        <Button\n          variant=\"outline\"\n          disabled={disabled}\n          className={cn(\n            \"w-full justify-start text-left font-normal\",\n            !value && \"text-muted-foreground\",\n            className\n          )}\n        >\n          <CalendarIcon className=\"mr-2 h-4 w-4\" />\n          {value?.from ? (\n            value.to ? (\n              <>\n                {format(value.from, \"PPP\", locale ? { locale } : undefined)} -{\" \"}\n                {format(value.to, \"PPP\", locale ? { locale } : undefined)}\n              </>\n            ) : (\n              format(value.from, \"PPP\", locale ? { locale } : undefined)\n            )\n          ) : (\n            <span>{placeholder}</span>\n          )}\n        </Button>\n      </PopoverTrigger>\n      <PopoverContent className=\"w-auto p-0\" align=\"start\">\n        <Calendar\n          mode=\"range\"\n          selected={value}\n          onSelect={onChange}\n          numberOfMonths={2}\n          autoFocus\n        />\n      </PopoverContent>\n    </Popover>\n  );\n}\n"]}

package/dist/components/dialog.d.ts

@@ -0,0 +1,58 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+
+/**
+ * Modal dialog component built on Radix UI Dialog.
+ *
+ * Renders a centered overlay panel that interrupts the user with important content
+ * and expects a response. Supports controlled (`open`/`onOpenChange`) and
+ * uncontrolled usage (via `DialogTrigger`).
+ *
+ * @example
+ * ```tsx
+ * <Dialog open={open} onOpenChange={setOpen}>
+ *   <DialogTrigger asChild>
+ *     <Button>Open Dialog</Button>
+ *   </DialogTrigger>
+ *   <DialogContent>
+ *     <DialogHeader>
+ *       <DialogTitle>Edit Profile</DialogTitle>
+ *       <DialogDescription>
+ *         Make changes to your profile here.
+ *       </DialogDescription>
+ *     </DialogHeader>
+ *     <div className="space-y-4">
+ *       <Input placeholder="Name" />
+ *     </div>
+ *     <DialogFooter>
+ *       <Button variant="outline" onClick={() => setOpen(false)}>
+ *         Cancel
+ *       </Button>
+ *       <Button>Save Changes</Button>
+ *     </DialogFooter>
+ *   </DialogContent>
+ * </Dialog>
+ * ```
+ */
+declare function Dialog({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
+/** Element that opens the dialog when clicked. Use `asChild` to merge into your own button. */
+declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+/** Portal that renders dialog content outside the DOM hierarchy. */
+declare function DialogPortal({ ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): react_jsx_runtime.JSX.Element;
+/** Button that closes the dialog. Use `asChild` to merge into your own button. */
+declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): react_jsx_runtime.JSX.Element;
+/** Semi-transparent backdrop rendered behind the dialog content. */
+declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** Dialog content panel with overlay backdrop and a built-in close button. */
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+/** Container for DialogTitle and DialogDescription at the top of the dialog. */
+declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Container for action buttons at the bottom of the dialog. */
+declare function DialogFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Accessible title rendered inside DialogHeader. */
+declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
+/** Accessible description rendered inside DialogHeader below the title. */
+declare function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
+
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger };

package/dist/components/dialog.js

@@ -0,0 +1,4 @@
+export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger } from '../chunk-F2ZJLKDP.js';
+import '../chunk-DGPY4WP3.js';
+//# sourceMappingURL=dialog.js.map
+//# sourceMappingURL=dialog.js.map

package/dist/components/dialog.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"dialog.js"}