@omnifyjp/ui 0.1.6 → 0.2.0

package/dist/components/sheet.d.ts

@@ -2,15 +2,50 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as DialogPrimitive from '@radix-ui/react-dialog';
 
+/**
+ * Slide-out panel component built on Radix UI Dialog.
+ *
+ * A sheet slides in from the edge of the screen, ideal for navigation,
+ * filters, or supplementary content. Supports `top`, `right`, `bottom`,
+ * and `left` sides via the `side` prop on `SheetContent`.
+ *
+ * @example
+ * ```tsx
+ * <Sheet open={open} onOpenChange={setOpen}>
+ *   <SheetTrigger asChild>
+ *     <Button variant="outline">Open Sheet</Button>
+ *   </SheetTrigger>
+ *   <SheetContent side="right">
+ *     <SheetHeader>
+ *       <SheetTitle>Settings</SheetTitle>
+ *       <SheetDescription>
+ *         Adjust your preferences below.
+ *       </SheetDescription>
+ *     </SheetHeader>
+ *     <div className="p-4">Content here</div>
+ *     <SheetFooter>
+ *       <Button onClick={() => setOpen(false)}>Done</Button>
+ *     </SheetFooter>
+ *   </SheetContent>
+ * </Sheet>
+ * ```
+ */
 declare function Sheet({ ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): react_jsx_runtime.JSX.Element;
+/** Element that opens the sheet when clicked. Use `asChild` to merge into your own button. */
 declare function SheetTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+/** Button that closes the sheet. Use `asChild` to merge into your own button. */
 declare function SheetClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): react_jsx_runtime.JSX.Element;
+/** Sliding content panel. Set `side` to control which edge it slides from (default: `"right"`). */
 declare function SheetContent({ className, children, side, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
     side?: "top" | "right" | "bottom" | "left";
 }): react_jsx_runtime.JSX.Element;
+/** Container for SheetTitle and SheetDescription at the top of the sheet. */
 declare function SheetHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Container for action buttons at the bottom of the sheet. Pushed to the bottom via `mt-auto`. */
 declare function SheetFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Accessible title rendered inside SheetHeader. */
 declare function SheetTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): react_jsx_runtime.JSX.Element;
+/** Accessible description rendered inside SheetHeader below the title. */
 declare function SheetDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): react_jsx_runtime.JSX.Element;
 
 export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger };

package/dist/components/sheet.js

@@ -1,4 +1,4 @@
-export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from '../chunk-KOGOYUEE.js';
+export { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from '../chunk-JLTBUACL.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=sheet.js.map
 //# sourceMappingURL=sheet.js.map

package/dist/components/sidebar.d.ts

@@ -6,69 +6,163 @@ import { Button } from './button.js';
 import { Input } from './input.js';
 import { Separator } from './separator.js';
 import { TooltipContent } from './tooltip.js';
+import '../types-CBVkScfB.js';
 import '@radix-ui/react-separator';
 import '@radix-ui/react-tooltip';
 
 type SidebarContextProps = {
+    /** Current sidebar state: "expanded" or "collapsed". */
     state: "expanded" | "collapsed";
+    /** Whether the sidebar is open (desktop). */
     open: boolean;
+    /** Set the sidebar open state (desktop). */
     setOpen: (open: boolean) => void;
+    /** Whether the sidebar is open (mobile). */
     openMobile: boolean;
+    /** Set the sidebar open state (mobile). */
     setOpenMobile: (open: boolean) => void;
+    /** Whether the current viewport is mobile-sized. */
     isMobile: boolean;
+    /** Toggle the sidebar open/closed. */
     toggleSidebar: () => void;
 };
+/**
+ * Hook to access sidebar state and controls.
+ * Must be used within a {@link SidebarProvider}.
+ *
+ * @returns The sidebar context value including `state`, `open`, `toggleSidebar`, etc.
+ * @throws If used outside of a SidebarProvider.
+ */
 declare function useSidebar(): SidebarContextProps;
+/**
+ * Context provider that manages sidebar open/collapsed state, mobile detection,
+ * keyboard shortcut (Cmd/Ctrl+B), and cookie persistence.
+ * Wrap your layout with this provider before using any Sidebar components.
+ *
+ * @param defaultOpen - Initial open state for uncontrolled mode. Defaults to `true`.
+ * @param open - Controlled open state.
+ * @param onOpenChange - Callback when open state changes (controlled mode).
+ */
 declare function SidebarProvider({ defaultOpen, open: openProp, onOpenChange: setOpenProp, className, style, children, ...props }: React.ComponentProps<"div"> & {
+    /** Initial open state for uncontrolled usage. Defaults to `true`. */
     defaultOpen?: boolean;
+    /** Controlled open state. */
     open?: boolean;
+    /** Callback fired when the sidebar open state changes. */
     onOpenChange?: (open: boolean) => void;
 }): react_jsx_runtime.JSX.Element;
+/**
+ * Application sidebar with collapsible groups, menus, and responsive behavior.
+ * Built on top of Sheet for mobile and native sidebar for desktop.
+ *
+ * @param side - Which side of the viewport the sidebar appears on. Defaults to `"left"`.
+ * @param variant - Visual variant: `"sidebar"` (default), `"floating"`, or `"inset"`.
+ * @param collapsible - Collapse behavior: `"offcanvas"` (default), `"icon"`, or `"none"`.
+ *
+ * @example
+ * ```tsx
+ * <SidebarProvider>
+ *   <Sidebar>
+ *     <SidebarHeader>Logo</SidebarHeader>
+ *     <SidebarContent>
+ *       <SidebarGroup>
+ *         <SidebarGroupLabel>Menu</SidebarGroupLabel>
+ *         <SidebarMenu>
+ *           <SidebarMenuItem>
+ *             <SidebarMenuButton>Dashboard</SidebarMenuButton>
+ *           </SidebarMenuItem>
+ *         </SidebarMenu>
+ *       </SidebarGroup>
+ *     </SidebarContent>
+ *     <SidebarFooter>Footer</SidebarFooter>
+ *   </Sidebar>
+ * </SidebarProvider>
+ * ```
+ */
 declare function Sidebar({ side, variant, collapsible, className, children, ...props }: React.ComponentProps<"div"> & {
+    /** Which side the sidebar appears on. Defaults to `"left"`. */
     side?: "left" | "right";
+    /** Visual variant. Defaults to `"sidebar"`. */
     variant?: "sidebar" | "floating" | "inset";
+    /** Collapse behavior. Defaults to `"offcanvas"`. */
     collapsible?: "offcanvas" | "icon" | "none";
 }): react_jsx_runtime.JSX.Element;
+/** Button that toggles the sidebar open/closed. Renders a `PanelLeftIcon` ghost button. */
 declare function SidebarTrigger({ className, onClick, ...props }: React.ComponentProps<typeof Button>): react_jsx_runtime.JSX.Element;
+/** Thin vertical rail on the sidebar edge that toggles the sidebar on click. */
 declare function SidebarRail({ className, ...props }: React.ComponentProps<"button">): react_jsx_runtime.JSX.Element;
+/** Main content area that sits beside the sidebar. Use with `variant="inset"`. */
 declare function SidebarInset({ className, ...props }: React.ComponentProps<"main">): react_jsx_runtime.JSX.Element;
+/** Search input styled for use inside the sidebar. */
 declare function SidebarInput({ className, ...props }: React.ComponentProps<typeof Input>): react_jsx_runtime.JSX.Element;
+/** Container for the top section of the sidebar (logo, org selector, etc.). */
 declare function SidebarHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Container for the bottom section of the sidebar (user menu, settings, etc.). */
 declare function SidebarFooter({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Horizontal separator styled with sidebar border color. */
 declare function SidebarSeparator({ className, ...props }: React.ComponentProps<typeof Separator>): react_jsx_runtime.JSX.Element;
+/** Scrollable content area between SidebarHeader and SidebarFooter. Houses SidebarGroup components. */
 declare function SidebarContent({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Logical grouping of sidebar items. Typically contains a SidebarGroupLabel and SidebarMenu. */
 declare function SidebarGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Small heading label for a SidebarGroup (e.g. "Navigation", "Projects"). */
 declare function SidebarGroupLabel({ className, asChild, ...props }: React.ComponentProps<"div"> & {
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
+/** Action button positioned at the top-right of a SidebarGroup (e.g. "Add" button). */
 declare function SidebarGroupAction({ className, asChild, ...props }: React.ComponentProps<"button"> & {
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
+/** Wrapper for content inside a SidebarGroup, below the label. */
 declare function SidebarGroupContent({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Unordered list container for SidebarMenuItem components. */
 declare function SidebarMenu({ className, ...props }: React.ComponentProps<"ul">): react_jsx_runtime.JSX.Element;
+/** List item wrapper for a single sidebar menu entry. Contains a SidebarMenuButton. */
 declare function SidebarMenuItem({ className, ...props }: React.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
     variant?: "default" | "outline" | null | undefined;
     size?: "default" | "sm" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Clickable button inside a SidebarMenuItem. Supports size/variant variants,
+ * active state highlighting, and an optional tooltip shown when collapsed to icon mode.
+ *
+ * @param isActive - Whether this item is the current active route.
+ * @param tooltip - Tooltip text or TooltipContent props shown in collapsed icon mode.
+ * @param asChild - Merge props onto the child element instead of rendering a button.
+ */
 declare function SidebarMenuButton({ asChild, isActive, variant, size, tooltip, className, ...props }: React.ComponentProps<"button"> & {
+    /** Render as child element via Radix Slot. */
     asChild?: boolean;
+    /** Whether this menu item represents the active route. */
     isActive?: boolean;
+    /** Tooltip shown when sidebar is collapsed to icon mode. */
     tooltip?: string | React.ComponentProps<typeof TooltipContent>;
 } & VariantProps<typeof sidebarMenuButtonVariants>): react_jsx_runtime.JSX.Element;
+/** Action button that appears to the right of a SidebarMenuButton (e.g. "more" or "delete"). */
 declare function SidebarMenuAction({ className, asChild, showOnHover, ...props }: React.ComponentProps<"button"> & {
     asChild?: boolean;
+    /** When true, only shows on hover/focus of the parent menu item. */
     showOnHover?: boolean;
 }): react_jsx_runtime.JSX.Element;
+/** Small count or status badge displayed to the right of a SidebarMenuButton. */
 declare function SidebarMenuBadge({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+/** Loading skeleton placeholder for a sidebar menu item. */
 declare function SidebarMenuSkeleton({ className, showIcon, ...props }: React.ComponentProps<"div"> & {
+    /** Whether to show an icon skeleton alongside the text skeleton. */
     showIcon?: boolean;
 }): react_jsx_runtime.JSX.Element;
+/** Nested sub-menu list with a left border, used for collapsible sub-navigation. */
 declare function SidebarMenuSub({ className, ...props }: React.ComponentProps<"ul">): react_jsx_runtime.JSX.Element;
+/** List item wrapper for a single sub-menu entry inside SidebarMenuSub. */
 declare function SidebarMenuSubItem({ className, ...props }: React.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
+/** Clickable link/button inside a SidebarMenuSubItem. Renders as an anchor by default. */
 declare function SidebarMenuSubButton({ asChild, size, isActive, className, ...props }: React.ComponentProps<"a"> & {
+    /** Render as child element via Radix Slot. */
     asChild?: boolean;
+    /** Text size: `"sm"` (12px) or `"md"` (14px). Defaults to `"md"`. */
     size?: "sm" | "md";
+    /** Whether this sub-menu item represents the active route. */
     isActive?: boolean;
 }): react_jsx_runtime.JSX.Element;
 

package/dist/components/sidebar.js

@@ -1,11 +1,11 @@
-export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar } from '../chunk-JJHKFW6P.js';
-import '../chunk-4CT5SCAH.js';
+export { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, useSidebar } from '../chunk-XUVLD65E.js';
+import '../chunk-C5NZAOA7.js';
 import '../chunk-WRCHR4AK.js';
-import '../chunk-VGQC333M.js';
+import '../chunk-JXGRW2MR.js';
 import '../chunk-3VU56V66.js';
-import '../chunk-KOGOYUEE.js';
-import '../chunk-ONAUEREV.js';
-import '../chunk-Y65FNGEE.js';
+import '../chunk-JLTBUACL.js';
+import '../chunk-PGWNOZDX.js';
+import '../chunk-55E7D2HR.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=sidebar.js.map
 //# sourceMappingURL=sidebar.js.map

package/dist/components/skeleton.d.ts

@@ -1,5 +1,25 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
-declare function Skeleton({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+type SkeletonProps = React.ComponentProps<"div">;
+/**
+ * Placeholder loading indicator with a pulse animation, used to represent
+ * content that is being fetched or rendered.
+ *
+ * @example
+ * ```tsx
+ * // Text placeholder
+ * <Skeleton className="h-4 w-48" />
+ *
+ * // Circular avatar placeholder
+ * <Skeleton className="size-10 rounded-full" />
+ *
+ * // Card skeleton
+ * <div className="space-y-2">
+ *   <Skeleton className="h-4 w-full" />
+ *   <Skeleton className="h-4 w-3/4" />
+ * </div>
+ * ```
+ */
+declare function Skeleton({ className, ...props }: SkeletonProps): react_jsx_runtime.JSX.Element;
 
-export { Skeleton };
+export { Skeleton, type SkeletonProps };

package/dist/components/skeleton.js

@@ -1,4 +1,4 @@
-export { Skeleton } from '../chunk-VGQC333M.js';
+export { Skeleton } from '../chunk-JXGRW2MR.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=skeleton.js.map
 //# sourceMappingURL=skeleton.js.map

package/dist/components/slider.d.ts

@@ -2,6 +2,23 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as SliderPrimitive from '@radix-ui/react-slider';
 
-declare function Slider({ className, defaultValue, value, min, max, ...props }: React.ComponentProps<typeof SliderPrimitive.Root>): react_jsx_runtime.JSX.Element;
+type SliderProps = React.ComponentProps<typeof SliderPrimitive.Root>;
+/**
+ * Draggable range input for selecting a numeric value or range within a given min/max.
+ * Supports single-thumb and multi-thumb modes, as well as vertical orientation.
+ *
+ * @example
+ * ```tsx
+ * // Single value
+ * <Slider defaultValue={[50]} max={100} step={1} />
+ *
+ * // Range (two thumbs)
+ * <Slider defaultValue={[25, 75]} max={100} step={5} />
+ *
+ * // Controlled
+ * <Slider value={[volume]} onValueChange={([v]) => setVolume(v)} />
+ * ```
+ */
+declare function Slider({ className, defaultValue, value, min, max, ...props }: SliderProps): react_jsx_runtime.JSX.Element;
 
-export { Slider };
+export { Slider, type SliderProps };

package/dist/components/slider.js

@@ -1,4 +1,4 @@
-export { Slider } from '../chunk-QMAMDYRD.js';
+export { Slider } from '../chunk-EWBCV7VA.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=slider.js.map
 //# sourceMappingURL=slider.js.map

package/dist/components/slug-input.d.ts

@@ -1,15 +1,24 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
+/** Customizable labels for the SlugInput component. */
 interface SlugInputLabels {
+    /** Label text above the slug input field. */
     slug: string;
+    /** Helper text below the slug input. */
     autoGenerated: string;
+    /** Placeholder shown inside the slug input. */
     placeholder: string;
 }
 interface SlugInputProps {
+    /** Source title string from which the slug is auto-generated. */
     title: string;
+    /** Current slug value. */
     slug: string;
+    /** Callback fired when the slug changes (auto-generated or manually edited). */
     onSlugChange: (slug: string) => void;
+    /** Whether auto-generation from title is disabled and slug is manually editable only. */
     disabled?: boolean;
+    /** Override default label strings for localization. */
     labels?: Partial<SlugInputLabels>;
 }
 /**
@@ -17,6 +26,25 @@ interface SlugInputProps {
  * Handles Vietnamese diacritics and other special characters.
  */
 declare function generateSlug(text: string): string;
+/**
+ * URL slug input that auto-generates a slug from a title string.
+ * Handles Vietnamese diacritics and special characters via `generateSlug`.
+ * The slug updates automatically when the title changes (unless `disabled` is true).
+ *
+ * @example
+ * ```tsx
+ * const [title, setTitle] = useState("My Blog Post");
+ * const [slug, setSlug] = useState("");
+ *
+ * <Input value={title} onChange={(e) => setTitle(e.target.value)} />
+ * <SlugInput
+ *   title={title}
+ *   slug={slug}
+ *   onSlugChange={setSlug}
+ * />
+ * // slug will auto-populate as "my-blog-post"
+ * ```
+ */
 declare function SlugInput({ title, slug, onSlugChange, disabled, labels: labelOverrides, }: SlugInputProps): react_jsx_runtime.JSX.Element;
 
 export { SlugInput, type SlugInputLabels, type SlugInputProps, generateSlug };

package/dist/components/slug-input.js

@@ -1,5 +1,5 @@
-export { SlugInput, generateSlug } from '../chunk-DR4GGX45.js';
-import '../chunk-KXZ7IND6.js';
+export { SlugInput, generateSlug } from '../chunk-75WZR6HF.js';
+import '../chunk-P3M5TZD2.js';
 import '../chunk-3VU56V66.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=slug-input.js.map

package/dist/components/sonner.d.ts

@@ -1,6 +1,22 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import { ToasterProps } from 'sonner';
 
+/**
+ * Toast notification container powered by the Sonner library.
+ * Renders toast messages at a configurable position on screen.
+ * Place this once at the root of your app, then use `toast()` to trigger notifications.
+ *
+ * @example
+ * ```tsx
+ * // In your root layout:
+ * <Toaster />
+ *
+ * // Anywhere in your app:
+ * import { toast } from "sonner";
+ * toast.success("Changes saved");
+ * toast.error("Something went wrong");
+ * ```
+ */
 declare const Toaster: ({ ...props }: ToasterProps) => react_jsx_runtime.JSX.Element;
 
 export { Toaster };

package/dist/components/sonner.js

@@ -1,3 +1,3 @@
-export { Toaster } from '../chunk-4Q2FLTAW.js';
+export { Toaster } from '../chunk-CUZR4JWM.js';
 //# sourceMappingURL=sonner.js.map
 //# sourceMappingURL=sonner.js.map

package/dist/components/stage-type-badge.d.ts

@@ -18,6 +18,12 @@ interface StageTypeBadgeProps {
  * - review: Eye (blue)
  * - notification: Bell (amber)
  * - conditional: GitBranch (purple)
+ *
+ * @example
+ * ```tsx
+ * <StageTypeBadge type="approval" />
+ * <StageTypeBadge type="review" label="Peer Review" />
+ * ```
  */
 declare function StageTypeBadge({ type, label, className }: StageTypeBadgeProps): react_jsx_runtime.JSX.Element;
 

package/dist/components/stage-type-badge.js

@@ -1,5 +1,5 @@
-export { StageTypeBadge } from '../chunk-YF6WRCTG.js';
-import '../chunk-3TGN2DFB.js';
+export { StageTypeBadge } from '../chunk-ZHEKDP5X.js';
+import '../chunk-A3BB5ZOC.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=stage-type-badge.js.map
 //# sourceMappingURL=stage-type-badge.js.map

package/dist/components/switch.d.ts

@@ -2,6 +2,25 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as SwitchPrimitives from '@radix-ui/react-switch';
 
-declare function Switch({ className, ...props }: React.ComponentProps<typeof SwitchPrimitives.Root>): react_jsx_runtime.JSX.Element;
+type SwitchProps = React.ComponentProps<typeof SwitchPrimitives.Root>;
+/**
+ * Toggle switch for boolean on/off states, styled as a sliding pill.
+ *
+ * @example
+ * ```tsx
+ * // Uncontrolled
+ * <Switch defaultChecked />
+ *
+ * // Controlled
+ * <Switch checked={enabled} onCheckedChange={setEnabled} />
+ *
+ * // With label
+ * <div className="flex items-center gap-2">
+ *   <Switch id="notifications" />
+ *   <Label htmlFor="notifications">Enable notifications</Label>
+ * </div>
+ * ```
+ */
+declare function Switch({ className, ...props }: SwitchProps): react_jsx_runtime.JSX.Element;
 
-export { Switch };
+export { Switch, type SwitchProps };

package/dist/components/switch.js

@@ -1,4 +1,4 @@
-export { Switch } from '../chunk-5M67ZEPM.js';
+export { Switch } from '../chunk-XOJJBNDX.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=switch.js.map
 //# sourceMappingURL=switch.js.map

package/dist/components/table.d.ts

@@ -1,13 +1,57 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 
+/**
+ * Data table component with header, body, footer, row, head, cell, and caption sub-components.
+ *
+ * Renders inside a horizontally scrollable container. Uses density tokens for
+ * consistent header height (`h-table-head`) and cell padding.
+ *
+ * @example
+ * ```tsx
+ * <Table>
+ *   <TableHeader>
+ *     <TableRow>
+ *       <TableHead>Name</TableHead>
+ *       <TableHead>Email</TableHead>
+ *       <TableHead>Role</TableHead>
+ *     </TableRow>
+ *   </TableHeader>
+ *   <TableBody>
+ *     <TableRow>
+ *       <TableCell>Alice</TableCell>
+ *       <TableCell>alice@example.com</TableCell>
+ *       <TableCell>Admin</TableCell>
+ *     </TableRow>
+ *     <TableRow>
+ *       <TableCell>Bob</TableCell>
+ *       <TableCell>bob@example.com</TableCell>
+ *       <TableCell>Member</TableCell>
+ *     </TableRow>
+ *   </TableBody>
+ *   <TableFooter>
+ *     <TableRow>
+ *       <TableCell colSpan={3}>2 users total</TableCell>
+ *     </TableRow>
+ *   </TableFooter>
+ *   <TableCaption>A list of team members.</TableCaption>
+ * </Table>
+ * ```
+ */
 declare function Table({ className, ...props }: React.ComponentProps<"table">): react_jsx_runtime.JSX.Element;
+/** Table header container. Groups `TableRow` elements for column headings. */
 declare function TableHeader({ className, ...props }: React.ComponentProps<"thead">): react_jsx_runtime.JSX.Element;
+/** Table body container. Groups `TableRow` elements for data rows. */
 declare function TableBody({ className, ...props }: React.ComponentProps<"tbody">): react_jsx_runtime.JSX.Element;
+/** Table footer container. Renders with a muted background and top border. */
 declare function TableFooter({ className, ...props }: React.ComponentProps<"tfoot">): react_jsx_runtime.JSX.Element;
+/** Table row with hover highlight and selected state support via `data-state="selected"`. */
 declare function TableRow({ className, ...props }: React.ComponentProps<"tr">): react_jsx_runtime.JSX.Element;
+/** Table head cell. Renders as a `<th>` with density-based height (`h-table-head`). */
 declare function TableHead({ className, ...props }: React.ComponentProps<"th">): react_jsx_runtime.JSX.Element;
+/** Table data cell. Renders as a `<td>` with consistent padding and alignment. */
 declare function TableCell({ className, ...props }: React.ComponentProps<"td">): react_jsx_runtime.JSX.Element;
+/** Table caption displayed below the table in muted text. */
 declare function TableCaption({ className, ...props }: React.ComponentProps<"caption">): react_jsx_runtime.JSX.Element;
 
 export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow };

package/dist/components/table.js

@@ -1,4 +1,4 @@
-export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from '../chunk-YKJZV2JK.js';
+export { Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow } from '../chunk-S6PDRGR5.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=table.js.map
 //# sourceMappingURL=table.js.map

package/dist/components/tabs.d.ts

@@ -2,9 +2,38 @@ import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React from 'react';
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 
+/**
+ * Tabbed interface component with list, trigger, and content sub-components.
+ *
+ * Built on Radix Tabs with density-aware sizing (`h-element` for the tab list).
+ * Supports keyboard navigation and focus management out of the box.
+ *
+ * @example
+ * ```tsx
+ * <Tabs defaultValue="overview">
+ *   <TabsList>
+ *     <TabsTrigger value="overview">Overview</TabsTrigger>
+ *     <TabsTrigger value="analytics">Analytics</TabsTrigger>
+ *     <TabsTrigger value="settings">Settings</TabsTrigger>
+ *   </TabsList>
+ *   <TabsContent value="overview">
+ *     <p>Overview content here.</p>
+ *   </TabsContent>
+ *   <TabsContent value="analytics">
+ *     <p>Analytics content here.</p>
+ *   </TabsContent>
+ *   <TabsContent value="settings">
+ *     <p>Settings content here.</p>
+ *   </TabsContent>
+ * </Tabs>
+ * ```
+ */
 declare function Tabs({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Root>): react_jsx_runtime.JSX.Element;
+/** Container for `TabsTrigger` elements. Renders as a rounded pill with muted background. */
 declare function TabsList({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.List>): react_jsx_runtime.JSX.Element;
+/** Individual tab button. Highlights with a card background when active. Requires a `value` prop matching a `TabsContent`. */
 declare function TabsTrigger({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Trigger>): react_jsx_runtime.JSX.Element;
+/** Content panel shown when its `value` matches the active tab. */
 declare function TabsContent({ className, ...props }: React.ComponentProps<typeof TabsPrimitive.Content>): react_jsx_runtime.JSX.Element;
 
 export { Tabs, TabsContent, TabsList, TabsTrigger };

package/dist/components/tabs.js

@@ -1,4 +1,4 @@
-export { Tabs, TabsContent, TabsList, TabsTrigger } from '../chunk-KABLXGWK.js';
+export { Tabs, TabsContent, TabsList, TabsTrigger } from '../chunk-FLWMT4DB.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=tabs.js.map
 //# sourceMappingURL=tabs.js.map

package/dist/components/tag-input.d.ts

@@ -1,15 +1,40 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
 interface TagInputProps {
+    /** Array of current tag strings. */
     value?: string[];
+    /** Callback fired when the tags array changes. */
     onChange?: (tags: string[]) => void;
+    /** Placeholder text shown when there are no tags. */
     placeholder?: string;
+    /** Additional CSS class for the outer container. */
     className?: string;
+    /** Whether the tag input is disabled. */
     disabled?: boolean;
+    /** Maximum number of tags allowed. */
     maxTags?: number;
+    /** Whether duplicate tag values are allowed. Defaults to `false`. */
     allowDuplicates?: boolean;
+    /** Character or pattern used to split pasted text into tags. Defaults to `","`. */
     delimiter?: string | RegExp;
 }
+/**
+ * Tag input that lets users add and remove string tags.
+ * Tags are added by pressing Enter or the delimiter key, and by pasting comma-separated text.
+ * Backspace removes the last tag when the input is empty.
+ *
+ * @example
+ * ```tsx
+ * const [tags, setTags] = useState<string[]>(["react", "typescript"]);
+ *
+ * <TagInput
+ *   value={tags}
+ *   onChange={setTags}
+ *   placeholder="Add a tag..."
+ *   maxTags={10}
+ * />
+ * ```
+ */
 declare function TagInput({ value, onChange, placeholder, className, disabled, maxTags, allowDuplicates, delimiter, }: TagInputProps): react_jsx_runtime.JSX.Element;
 
 export { TagInput };

package/dist/components/tag-input.js

@@ -1,5 +1,5 @@
-export { TagInput } from '../chunk-PCQSHXOQ.js';
-import '../chunk-3TGN2DFB.js';
+export { TagInput } from '../chunk-VVYSAGB3.js';
+import '../chunk-A3BB5ZOC.js';
 import '../chunk-DGPY4WP3.js';
 //# sourceMappingURL=tag-input.js.map
 //# sourceMappingURL=tag-input.js.map

package/dist/components/textarea.d.ts

@@ -1,5 +1,21 @@
 import * as React from 'react';
 
+type TextareaProps = React.ComponentProps<"textarea">;
+/**
+ * Multi-line text input with auto-sizing via `field-sizing-content`.
+ *
+ * @example
+ * ```tsx
+ * // Basic usage
+ * <Textarea placeholder="Enter a description..." />
+ *
+ * // Controlled
+ * <Textarea value={content} onChange={(e) => setContent(e.target.value)} />
+ *
+ * // With rows constraint
+ * <Textarea rows={5} placeholder="Feedback" />
+ * ```
+ */
 declare const Textarea: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
 
-export { Textarea };
+export { Textarea, type TextareaProps };