@omnifyjp/ui 0.1.6 → 0.2.0

package/dist/components/carousel.d.ts

@@ -4,21 +4,50 @@ import useEmblaCarousel from 'embla-carousel-react';
 import { Button } from './button.js';
 import 'class-variance-authority/types';
 import 'class-variance-authority';
+import '../types-CBVkScfB.js';
 
 type CarouselApi = ReturnType<typeof useEmblaCarousel>[1];
 type UseCarouselParameters = Parameters<typeof useEmblaCarousel>;
 type CarouselOptions = UseCarouselParameters[0];
 type CarouselPlugin = UseCarouselParameters[1];
 type CarouselProps = {
+    /** Embla Carousel options (e.g., `{ loop: true, align: "start" }`). */
     opts?: CarouselOptions;
+    /** Embla Carousel plugins (e.g., Autoplay, ClassNames). */
     plugins?: CarouselPlugin;
+    /** Scroll axis direction. Defaults to `"horizontal"`. */
     orientation?: "horizontal" | "vertical";
+    /** Callback to receive the Embla API instance for external control. */
     setApi?: (api: CarouselApi) => void;
 };
+/**
+ * Carousel/slider component powered by Embla Carousel.
+ *
+ * Provides a context for child components (`CarouselContent`, `CarouselItem`,
+ * `CarouselPrevious`, `CarouselNext`). Supports horizontal/vertical orientation,
+ * keyboard navigation (arrow keys), and plugin extensibility.
+ *
+ * @example
+ * ```tsx
+ * <Carousel opts={{ loop: true }}>
+ *   <CarouselContent>
+ *     <CarouselItem>Slide 1</CarouselItem>
+ *     <CarouselItem>Slide 2</CarouselItem>
+ *     <CarouselItem>Slide 3</CarouselItem>
+ *   </CarouselContent>
+ *   <CarouselPrevious />
+ *   <CarouselNext />
+ * </Carousel>
+ * ```
+ */
 declare function Carousel({ orientation, opts, setApi, plugins, className, children, ...props }: React.ComponentProps<"div"> & CarouselProps): react_jsx_runtime.JSX.Element;
+/** Scrollable container for `CarouselItem` elements. Manages the overflow viewport. */
 declare function CarouselContent({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Individual slide within the carousel. Defaults to full-width (`basis-full`). */
 declare function CarouselItem({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Navigation button to scroll to the previous slide. Automatically disabled when at the beginning. */
 declare function CarouselPrevious({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+/** Navigation button to scroll to the next slide. Automatically disabled when at the end. */
 declare function CarouselNext({ className, variant, size, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
 
 export { Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious };

package/dist/components/carousel.js

@@ -1,5 +1,5 @@
-export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from '../chunk-CF2MMEOS.js';
-import '../chunk-Y65FNGEE.js';
+export { Carousel, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious } from '../chunk-2TUWDXAC.js';
+import '../chunk-55E7D2HR.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=carousel.js.map
 //# sourceMappingURL=carousel.js.map

package/dist/components/chart.d.ts

@@ -6,37 +6,97 @@ declare const THEMES: {
     readonly light: "";
     readonly dark: ".dark";
 };
+/**
+ * Configuration object for chart data series. Each key maps to a data series
+ * and defines its label, optional icon, and color (either a single color or
+ * per-theme colors).
+ *
+ * @example
+ * ```tsx
+ * const config: ChartConfig = {
+ *   revenue: { label: "Revenue", color: "var(--color-blue-500)" },
+ *   expenses: { label: "Expenses", theme: { light: "#ef4444", dark: "#f87171" } },
+ * };
+ * ```
+ */
 type ChartConfig = {
     [k in string]: {
+        /** Display label for this data series. */
         label?: React.ReactNode;
+        /** Optional icon component displayed in the legend. */
         icon?: React.ComponentType;
     } & ({
         color?: string;
         theme?: never;
     } | {
-        color?: never;
+        color?: never; /** Per-theme color mapping (light/dark). */
         theme: Record<keyof typeof THEMES, string>;
     });
 };
+/**
+ * Wrapper that provides chart configuration context, injects theme-aware CSS
+ * custom properties for data series colors, and renders a Recharts
+ * `ResponsiveContainer`.
+ *
+ * @param config - Chart configuration mapping data keys to labels, icons, and colors.
+ *
+ * @example
+ * ```tsx
+ * <ChartContainer config={{ revenue: { label: "Revenue", color: "#3b82f6" } }}>
+ *   <BarChart data={data}>
+ *     <Bar dataKey="revenue" fill="var(--color-revenue)" />
+ *   </BarChart>
+ * </ChartContainer>
+ * ```
+ */
 declare function ChartContainer({ id, className, children, config, ...props }: React.ComponentProps<"div"> & {
+    /** Chart configuration mapping data keys to labels, icons, and colors. */
     config: ChartConfig;
+    /** Recharts chart element (e.g. BarChart, LineChart). */
     children: React.ComponentProps<typeof RechartsPrimitive.ResponsiveContainer>["children"];
 }): react_jsx_runtime.JSX.Element;
+/** Injects a `<style>` tag with CSS custom properties for chart colors, scoped to the chart container. */
 declare const ChartStyle: ({ id, config }: {
     id: string;
     config: ChartConfig;
 }) => react_jsx_runtime.JSX.Element | null;
+/** Re-export of Recharts Tooltip for use with ChartTooltipContent. */
 declare const ChartTooltip: typeof RechartsPrimitive.Tooltip;
+/**
+ * Styled tooltip content for use inside `<ChartTooltip content={<ChartTooltipContent />} />`.
+ * Renders data series with color indicators, labels from ChartConfig, and formatted values.
+ *
+ * @param indicator - Shape of the color indicator: `"dot"`, `"line"`, or `"dashed"`.
+ * @param hideLabel - Whether to hide the tooltip header label.
+ * @param hideIndicator - Whether to hide the color indicator.
+ * @param nameKey - Data key to resolve series name from the payload.
+ * @param labelKey - Data key to resolve the tooltip header label from config.
+ */
 declare function ChartTooltipContent({ active, payload, className, indicator, hideLabel, hideIndicator, label, labelFormatter, labelClassName, formatter, color, nameKey, labelKey, }: React.ComponentProps<typeof RechartsPrimitive.Tooltip> & React.ComponentProps<"div"> & {
+    /** Whether to hide the tooltip header label. */
     hideLabel?: boolean;
+    /** Whether to hide the color indicator next to each series. */
     hideIndicator?: boolean;
+    /** Shape of the color indicator. Defaults to `"dot"`. */
     indicator?: "line" | "dot" | "dashed";
+    /** Data key used to resolve the series name from payload. */
     nameKey?: string;
+    /** Data key used to resolve the header label from config. */
     labelKey?: string;
 }): react_jsx_runtime.JSX.Element | null;
+/** Re-export of Recharts Legend for use with ChartLegendContent. */
 declare const ChartLegend: typeof RechartsPrimitive.Legend;
+/**
+ * Styled legend content for use inside `<ChartLegend content={<ChartLegendContent />} />`.
+ * Renders a horizontal list of series labels with color indicators or custom icons from ChartConfig.
+ *
+ * @param hideIcon - Whether to hide the color dot / custom icon.
+ * @param nameKey - Data key to resolve the series name from payload.
+ */
 declare function ChartLegendContent({ className, hideIcon, payload, verticalAlign, nameKey, }: React.ComponentProps<"div"> & Pick<RechartsPrimitive.LegendProps, "payload" | "verticalAlign"> & {
+    /** Whether to hide the color indicator or custom icon. */
     hideIcon?: boolean;
+    /** Data key used to resolve the series name from payload. */
     nameKey?: string;
 }): react_jsx_runtime.JSX.Element | null;
 

package/dist/components/chart.js

@@ -1,4 +1,4 @@
-export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent } from '../chunk-NFAXCC73.js';
+export { ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent } from '../chunk-B434PORR.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=chart.js.map
 //# sourceMappingURL=chart.js.map

package/dist/components/checkbox.d.ts

@@ -1,6 +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 };
+export { Checkbox, type CheckboxProps };

package/dist/components/checkbox.js

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

package/dist/components/collapsible.d.ts

@@ -1,8 +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

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

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

@@ -1,13 +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

@@ -1,7 +1,7 @@
-export { ColorPicker } from '../chunk-YMZJ2RYW.js';
+export { ColorPicker } from '../chunk-MJLFJPUG.js';
 import '../chunk-3VU56V66.js';
-import '../chunk-AZARDPXB.js';
-import '../chunk-Y65FNGEE.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/combobox.d.ts

@@ -1,33 +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

@@ -1,8 +1,8 @@
-export { Combobox, MultiCombobox } from '../chunk-4OQTTPY4.js';
-import '../chunk-AZARDPXB.js';
-import '../chunk-7ZFYPC74.js';
-import '../chunk-4N357E44.js';
-import '../chunk-Y65FNGEE.js';
+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/command.d.ts

@@ -4,17 +4,60 @@ 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

@@ -1,5 +1,5 @@
-export { Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut } from '../chunk-7ZFYPC74.js';
-import '../chunk-4N357E44.js';
+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/context-menu.d.ts

@@ -2,27 +2,69 @@ 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

@@ -1,4 +1,4 @@
-export { ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger } from '../chunk-LW5PTU7D.js';
+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/date-picker.d.ts

@@ -2,30 +2,70 @@ 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 for formatting */
+    /** 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 for formatting */
+    /** 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

@@ -1,7 +1,7 @@
-export { DatePicker, DateRangePicker } from '../chunk-GJCHZAJO.js';
-import '../chunk-AZARDPXB.js';
-import '../chunk-EMHO6GT6.js';
-import '../chunk-Y65FNGEE.js';
+export { DatePicker, DateRangePicker } from '../chunk-YS3PMGYC.js';
+import '../chunk-C34KSTWA.js';
+import '../chunk-4MHIUUAW.js';
+import '../chunk-55E7D2HR.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=date-picker.js.map
 //# sourceMappingURL=date-picker.js.map