doodleui-react 0.2.0 → 0.4.0

package/dist/index.d.ts

@@ -1,9 +1,9 @@
 import * as react from 'react';
-import { CSSProperties, HTMLAttributes, ReactNode, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ComponentPropsWithoutRef, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react';
+import { CSSProperties, HTMLAttributes, ReactNode, RefObject, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, ComponentPropsWithoutRef, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import { Options } from 'roughjs/bin/core';
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
-import * as Dialog from '@radix-ui/react-dialog';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
 import * as TooltipPrimitive from '@radix-ui/react-tooltip';
 import * as SelectPrimitive from '@radix-ui/react-select';
 import * as SwitchPrimitive from '@radix-ui/react-switch';
@@ -12,6 +12,12 @@ import * as ToastPrimitive from '@radix-ui/react-toast';
 import * as AccordionPrimitive from '@radix-ui/react-accordion';
 import * as AvatarPrimitive from '@radix-ui/react-avatar';
 import * as SliderPrimitive from '@radix-ui/react-slider';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import { Command as Command$1, CommandEmpty as CommandEmpty$1, CommandGroup as CommandGroup$1, CommandInput as CommandInput$1, CommandItem as CommandItem$1, CommandList as CommandList$1, CommandSeparator as CommandSeparator$1 } from 'cmdk';
 
 type FillStyle = "hachure" | "solid" | "zigzag" | "cross-hatch" | "dots" | "dashed" | "zigzag-line";
 type RoughShape = "rectangle" | "ellipse" | "line" | "line-vertical" | "path";
@@ -75,6 +81,14 @@ interface SketchBoxProps extends SketchProps, Omit<HTMLAttributes<HTMLDivElement
     contentStyle?: CSSProperties;
     inset?: number;
     path?: string;
+    /**
+     * Sketch-in the border on mount. Defaults to the DoodleUIProvider value.
+     */
+    animate?: boolean;
+    /** Override the default 400ms draw-in duration. */
+    drawInDuration?: number;
+    /** Replay draw-in when this value changes. */
+    drawInKey?: unknown;
 }
 declare const SketchBox: react.ForwardRefExoticComponent<SketchBoxProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -106,26 +120,96 @@ declare function useSketchSeed(): SketchSeedContextValue;
  */
 declare function useResolvedSeed(seed?: number): number;
 
+interface DoodleUIContextValue {
+    /** Default for components that do not set their own `animate` prop. */
+    animate: boolean;
+    /** When true, skip the prefers-reduced-motion disable. */
+    forceAnimate: boolean;
+}
+interface DoodleUIProviderProps {
+    children: ReactNode;
+    /**
+     * Default animation setting for descendant doodle-ui components.
+     * Per-component `animate` still wins when it is set.
+     */
+    animate?: boolean;
+    /**
+     * Play animations even when the user prefers reduced motion.
+     * Off by default — only set this as an explicit escape hatch.
+     */
+    forceAnimate?: boolean;
+}
+declare function DoodleUIProvider({ children, animate, forceAnimate, }: DoodleUIProviderProps): react.JSX.Element;
+declare function useDoodleUI(): DoodleUIContextValue;
+
+/**
+ * Whether the calling component should play sketch animations.
+ * Per-component `animate` overrides the provider. Reduced motion
+ * disables animation unless the provider set `forceAnimate`.
+ */
+declare function useAnimate(animate?: boolean): boolean;
+
+/** Default sketch-in duration. Ease-out over ~400ms. */
+declare const DRAW_IN_DURATION_MS = 400;
+/** Alerts often appear dynamically — keep the sketch-in snappy. */
+declare const DRAW_IN_ALERT_MS = 200;
+/** Tooltips are transient — draw in quickly. */
+declare const DRAW_IN_TOOLTIP_MS = 180;
+/** Checkmarks, radio dots, and tab underlines. */
+declare const DRAW_IN_MARK_MS = 240;
+/** Delay between table row rules. */
+declare const TABLE_STAGGER_MS = 40;
+/**
+ * Sketch-in the rough.js stroke path on the first paint, and again when
+ * `replayKey` changes (e.g. a hover seed swap).
+ *
+ * `pathRef` may point at an SVG path, an `<svg>`, or any element that
+ * contains one — the hook finds the outline path either way.
+ */
+declare function useDrawIn(pathRef: RefObject<Element | null>, duration?: number, enabled?: boolean, replayKey?: unknown, delay?: number): void;
+
 type ButtonVariant = "primary" | "secondary" | "outline" | "ghost";
 type ButtonSize = "sm" | "md" | "lg";
 interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "color">, SketchProps {
     variant?: ButtonVariant;
     size?: ButtonSize;
+    /**
+     * Play sketch animations (draw-in on mount, seed morph on hover).
+     * Defaults to the DoodleUIProvider value (true). Explicit `false`
+     * renders a static sketch. `prefers-reduced-motion: reduce` disables
+     * animation unless the provider set `forceAnimate`.
+     */
+    animate?: boolean;
 }
 declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
 interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "color" | "size">, SketchProps {
     label?: ReactNode;
+    /**
+     * Draw-in the border on mount and seed-morph on focus.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
 
 interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, "color">, SketchProps {
     label?: ReactNode;
+    /**
+     * Draw-in the border on mount and seed-morph on focus.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
 
 interface CheckboxProps extends Omit<CheckboxPrimitive.CheckboxProps, "asChild">, SketchProps {
     label?: ReactNode;
+    /**
+     * Draw-in the box on mount and the checkmark when checked.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLButtonElement>>;
 
@@ -134,6 +218,11 @@ interface RadioGroupProps extends ComponentPropsWithoutRef<typeof RadioGroupPrim
 declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
 interface RadioProps extends Omit<ComponentPropsWithoutRef<typeof RadioGroupPrimitive.Item>, "asChild">, SketchProps {
     label?: ReactNode;
+    /**
+     * Draw-in the ring on mount and scale/draw the dot on select.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLButtonElement>>;
 
@@ -142,12 +231,20 @@ interface CardProps extends Omit<HTMLAttributes<HTMLDivElement>, "color" | "titl
     fill?: string;
     title?: ReactNode;
     footer?: ReactNode;
+    /**
+     * Draw-in the border on mount. Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
 
 type BadgeVariant = "default" | "accent" | "outline";
 interface BadgeProps extends Omit<HTMLAttributes<HTMLSpanElement>, "color">, SketchProps {
     variant?: BadgeVariant;
+    /**
+     * Draw-in the border on mount. Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Badge: react.ForwardRefExoticComponent<BadgeProps & react.RefAttributes<HTMLSpanElement>>;
 
@@ -155,6 +252,10 @@ type AlertVariant = "info" | "warning" | "error" | "success";
 interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "color" | "title">, SketchProps {
     variant?: AlertVariant;
     title?: ReactNode;
+    /**
+     * Draw-in the border on mount (~200ms). Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -167,23 +268,38 @@ interface ModalProps extends SketchProps {
     description?: ReactNode;
     children?: ReactNode;
     className?: string;
-}
-declare function Modal({ open, defaultOpen, onOpenChange, trigger, title, description, children, className, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, }: ModalProps): react.JSX.Element;
-declare const ModalRoot: react.FC<Dialog.DialogProps>;
-declare const ModalTrigger: react.ForwardRefExoticComponent<Dialog.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
-declare const ModalClose: react.ForwardRefExoticComponent<Dialog.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
-declare const ModalTitle: react.ForwardRefExoticComponent<Dialog.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
-declare const ModalDescription: react.ForwardRefExoticComponent<Dialog.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+    /**
+     * Backdrop fade, panel enter/exit, and border draw-in on open.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+declare function Modal({ open, defaultOpen, onOpenChange, trigger, title, description, children, className, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, }: ModalProps): react.JSX.Element;
+declare const ModalRoot: react.FC<DialogPrimitive.DialogProps>;
+declare const ModalTrigger: react.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const ModalClose: react.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+declare const ModalTitle: react.ForwardRefExoticComponent<DialogPrimitive.DialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+declare const ModalDescription: react.ForwardRefExoticComponent<DialogPrimitive.DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
 
 type DividerOrientation = "horizontal" | "vertical";
 interface DividerProps extends Omit<HTMLAttributes<HTMLDivElement>, "color">, SketchProps {
     orientation?: DividerOrientation;
+    /**
+     * Draw-in so the line extends across its length. Defaults to the
+     * DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Divider: react.ForwardRefExoticComponent<DividerProps & react.RefAttributes<HTMLDivElement>>;
 
 interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "color">, SketchProps {
     value?: number;
     max?: number;
+    /**
+     * Draw-in the track on mount and redraw the fill as value changes.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Progress: react.ForwardRefExoticComponent<ProgressProps & react.RefAttributes<HTMLDivElement>>;
 
@@ -194,8 +310,13 @@ interface TooltipProps extends SketchProps {
     side?: ComponentPropsWithoutRef<typeof TooltipPrimitive.Content>["side"];
     delayDuration?: number;
     className?: string;
+    /**
+     * Quick draw-in when the bubble shows (~180ms). Defaults to the
+     * DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
-declare function Tooltip({ content, children, side, delayDuration, className, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, }: TooltipProps): react.JSX.Element;
+declare function Tooltip({ content, children, side, delayDuration, className, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, }: TooltipProps): react.JSX.Element;
 
 /**
  * Offset a resolved sketch seed by a stable hash of `key`.
@@ -214,8 +335,13 @@ interface SelectProps extends Omit<SelectPrimitive.SelectProps, "children">, Ske
     className?: string;
     style?: CSSProperties;
     "aria-label"?: string;
+    /**
+     * Draw-in the trigger on mount and the popover border on open.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
-declare function Select({ options, placeholder, className, style, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, value, defaultValue, onValueChange, "aria-label": ariaLabel, ...rest }: SelectProps): react.JSX.Element;
+declare function Select({ options, placeholder, className, style, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, value, defaultValue, onValueChange, animate, "aria-label": ariaLabel, ...rest }: SelectProps): react.JSX.Element;
 interface SelectTriggerProps extends Omit<SelectPrimitive.SelectTriggerProps, "asChild"> {
     placeholder?: string;
 }
@@ -236,10 +362,20 @@ declare const SelectSeparator: react.ForwardRefExoticComponent<SelectPrimitive.S
 
 interface SwitchProps extends Omit<SwitchPrimitive.SwitchProps, "asChild">, SketchProps {
     label?: ReactNode;
+    /**
+     * Slide the thumb and seed-morph the track on toggle.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLButtonElement>>;
 
 interface TabsProps extends Omit<ComponentPropsWithoutRef<typeof TabsPrimitive.Root>, "asChild">, SketchProps {
+    /**
+     * Draw-in the active underline and slide it on tab change.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Tabs: react.ForwardRefExoticComponent<TabsProps & react.RefAttributes<HTMLDivElement>>;
 interface TabListProps extends Omit<ComponentPropsWithoutRef<typeof TabsPrimitive.List>, "asChild"> {
@@ -256,6 +392,11 @@ declare const TabPanel: react.ForwardRefExoticComponent<TabPanelProps & react.Re
 interface TableProps extends Omit<TableHTMLAttributes<HTMLTableElement>, "color">, SketchProps {
     headerUnderline?: boolean;
     children?: ReactNode;
+    /**
+     * Draw-in row rules on mount, staggered slightly. Defaults to the
+     * DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
 declare const Table: react.ForwardRefExoticComponent<TableProps & react.RefAttributes<HTMLTableElement>>;
 declare const TableHead: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
@@ -288,8 +429,13 @@ interface ToastProps extends SketchProps {
     duration?: number;
     className?: string;
     style?: CSSProperties;
+    /**
+     * Slide-in with a sketchy settle wobble, reversed on exit.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
 }
-declare function Toast({ open, defaultOpen, onOpenChange, title, children, variant, duration, className, style, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, }: ToastProps): react.JSX.Element;
+declare function Toast({ open, defaultOpen, onOpenChange, title, children, variant, duration, className, style, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, }: ToastProps): react.JSX.Element;
 declare const ToastRoot: react.ForwardRefExoticComponent<ToastPrimitive.ToastProps & react.RefAttributes<HTMLLIElement>>;
 declare const ToastTitle: react.ForwardRefExoticComponent<ToastPrimitive.ToastTitleProps & react.RefAttributes<HTMLDivElement>>;
 declare const ToastDescription: react.ForwardRefExoticComponent<ToastPrimitive.ToastDescriptionProps & react.RefAttributes<HTMLDivElement>>;
@@ -380,4 +526,251 @@ interface StepperProps extends Omit<HTMLAttributes<HTMLDivElement>, "color">, Sk
 }
 declare const Stepper: react.ForwardRefExoticComponent<StepperProps & react.RefAttributes<HTMLDivElement>>;
 
-export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, Alert, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarShape, type AvatarStatus, Badge, type BadgeProps, type BadgeVariant, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, type BreadcrumbSeparator, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, Checkbox, type CheckboxProps, DEFAULT_BOWING, DEFAULT_INK, DEFAULT_ROUGHNESS, DEFAULT_STROKE_WIDTH, Divider, type DividerOrientation, type DividerProps, type FillStyle, Input, type InputProps, Modal, ModalClose, ModalDescription, type ModalProps, ModalRoot, ModalTitle, ModalTrigger, Pagination, type PaginationProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RoughShape, RoughSvg, type RoughSvgProps, SKETCH_COLORS, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Skeleton, type SkeletonProps, type SkeletonVariant, SketchBox, type SketchBoxProps, type SketchProps, type SketchSeedContextValue, SketchSeedProvider, type SketchSeedProviderProps, Slider, type SliderProps, type SliderThumbShape, Stepper, type StepperOrientation, type StepperProps, type StepperStep, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeaderCell, type TableHeaderCellProps, type TableProps, TableRow, Tabs, type TabsProps, Textarea, type TextareaProps, Toast, ToastAction, ToastClose, ToastDescription, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastRoot, ToastTitle, type ToastVariant, ToastViewport, Tooltip, type TooltipProps, TooltipProvider, deriveSeed, toRoughOptions, useResolvedSeed, useSketchSeed };
+interface LabelProps extends Omit<LabelPrimitive.LabelProps, "asChild" | "color">, SketchProps {
+    children?: ReactNode;
+    /** Adds a small hand-drawn required mark after the text. */
+    required?: boolean;
+    /**
+     * Draw-in the required mark on mount.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+/**
+ * Thin, mostly-typographic wrapper around Radix Label. Ties a caption to a
+ * form field via `htmlFor` for accessibility. The only sketch chrome is a
+ * small drawn mark next to the text when `required` is set.
+ */
+declare const Label: react.ForwardRefExoticComponent<LabelProps & react.RefAttributes<HTMLLabelElement>>;
+
+interface CollapsibleProps extends Omit<CollapsiblePrimitive.CollapsibleProps, "asChild">, SketchProps {
+    children?: ReactNode;
+}
+declare const Collapsible: react.ForwardRefExoticComponent<CollapsibleProps & react.RefAttributes<HTMLDivElement>>;
+interface CollapsibleTriggerProps extends Omit<ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Trigger>, "asChild"> {
+    children?: ReactNode;
+}
+declare const CollapsibleTrigger: react.ForwardRefExoticComponent<CollapsibleTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+interface CollapsibleContentProps extends Omit<ComponentPropsWithoutRef<typeof CollapsiblePrimitive.Content>, "asChild"> {
+}
+declare const CollapsibleContent: react.ForwardRefExoticComponent<CollapsibleContentProps & react.RefAttributes<HTMLDivElement>>;
+
+interface PopoverProps extends Omit<PopoverPrimitive.PopoverProps, "children">, SketchProps {
+    children?: ReactNode;
+    /**
+     * Draw-in the panel border when the popover opens.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+declare function Popover({ children, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, ...rest }: PopoverProps): react.JSX.Element;
+declare const PopoverTrigger: react.ForwardRefExoticComponent<PopoverPrimitive.PopoverTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const PopoverAnchor: react.ForwardRefExoticComponent<PopoverPrimitive.PopoverAnchorProps & react.RefAttributes<HTMLDivElement>>;
+declare const PopoverClose: react.ForwardRefExoticComponent<PopoverPrimitive.PopoverCloseProps & react.RefAttributes<HTMLButtonElement>>;
+interface PopoverContentProps extends Omit<PopoverPrimitive.PopoverContentProps, "asChild"> {
+    children?: ReactNode;
+}
+declare const PopoverContent: react.ForwardRefExoticComponent<PopoverContentProps & react.RefAttributes<HTMLDivElement>>;
+interface PopoverArrowProps extends ComponentPropsWithoutRef<typeof PopoverPrimitive.Arrow> {
+}
+declare const PopoverArrow: react.ForwardRefExoticComponent<PopoverArrowProps & react.RefAttributes<SVGSVGElement>>;
+
+interface DropdownMenuProps extends Omit<DropdownMenuPrimitive.DropdownMenuProps, "children">, SketchProps {
+    children?: ReactNode;
+    /**
+     * Draw-in the panel border when the menu opens.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+declare function DropdownMenu({ children, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, ...rest }: DropdownMenuProps): react.JSX.Element;
+declare const DropdownMenuTrigger: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DropdownMenuGroup: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuRadioGroup: react.ForwardRefExoticComponent<DropdownMenuPrimitive.DropdownMenuRadioGroupProps & react.RefAttributes<HTMLDivElement>>;
+declare const DropdownMenuSub: react.FC<DropdownMenuPrimitive.DropdownMenuSubProps>;
+interface DropdownMenuContentProps extends Omit<DropdownMenuPrimitive.DropdownMenuContentProps, "asChild"> {
+    children?: ReactNode;
+}
+declare const DropdownMenuContent: react.ForwardRefExoticComponent<DropdownMenuContentProps & react.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuItemProps extends Omit<DropdownMenuPrimitive.DropdownMenuItemProps, "asChild"> {
+    children?: ReactNode;
+    inset?: boolean;
+}
+declare const DropdownMenuItem: react.ForwardRefExoticComponent<DropdownMenuItemProps & react.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuCheckboxItemProps extends Omit<DropdownMenuPrimitive.DropdownMenuCheckboxItemProps, "asChild"> {
+    children?: ReactNode;
+}
+declare const DropdownMenuCheckboxItem: react.ForwardRefExoticComponent<DropdownMenuCheckboxItemProps & react.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuRadioItemProps extends Omit<DropdownMenuPrimitive.DropdownMenuRadioItemProps, "asChild"> {
+    children?: ReactNode;
+}
+declare const DropdownMenuRadioItem: react.ForwardRefExoticComponent<DropdownMenuRadioItemProps & react.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuLabelProps extends Omit<DropdownMenuPrimitive.DropdownMenuLabelProps, "asChild"> {
+    children?: ReactNode;
+}
+declare const DropdownMenuLabel: react.ForwardRefExoticComponent<DropdownMenuLabelProps & react.RefAttributes<HTMLDivElement>>;
+interface DropdownMenuSeparatorProps extends Omit<DropdownMenuPrimitive.DropdownMenuSeparatorProps, "asChild"> {
+}
+declare const DropdownMenuSeparator: react.ForwardRefExoticComponent<DropdownMenuSeparatorProps & react.RefAttributes<HTMLDivElement>>;
+
+interface DialogProps extends Omit<DialogPrimitive.DialogProps, "children">, SketchProps {
+    children?: ReactNode;
+    /**
+     * Backdrop fade, panel enter/exit, and border draw-in on open.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+/**
+ * Lighter-weight sibling to `Modal`: a composable, shadcn-style dialog built
+ * from `Dialog` / `DialogTrigger` / `DialogContent` / `DialogHeader` /
+ * `DialogFooter` / `DialogTitle` / `DialogDescription` / `DialogClose`. Unlike
+ * `Modal`, `DialogContent` has no forced width or shadow and no built-in
+ * close button — compose your own layout inside it.
+ */
+declare function Dialog({ children, open, defaultOpen, onOpenChange, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, ...rest }: DialogProps): react.JSX.Element;
+declare const DialogTrigger: react.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: react.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: react.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & react.RefAttributes<HTMLButtonElement>>;
+interface DialogOverlayProps extends Omit<DialogPrimitive.DialogOverlayProps, "asChild" | "forceMount"> {
+}
+declare const DialogOverlay: react.ForwardRefExoticComponent<DialogOverlayProps & react.RefAttributes<HTMLDivElement>>;
+interface DialogContentProps extends Omit<DialogPrimitive.DialogContentProps, "asChild" | "forceMount"> {
+    children?: ReactNode;
+    /** Panel width. Defaults to `min(420px, calc(100vw - 32px))`. */
+    contentStyle?: CSSProperties;
+}
+declare const DialogContent: react.ForwardRefExoticComponent<DialogContentProps & react.RefAttributes<HTMLDivElement>>;
+interface DialogHeaderProps {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function DialogHeader({ children, className, style }: DialogHeaderProps): react.JSX.Element;
+interface DialogFooterProps {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function DialogFooter({ children, className, style }: DialogFooterProps): react.JSX.Element;
+interface DialogTitleProps extends Omit<DialogPrimitive.DialogTitleProps, "asChild"> {
+}
+declare const DialogTitle: react.ForwardRefExoticComponent<DialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+interface DialogDescriptionProps extends Omit<DialogPrimitive.DialogDescriptionProps, "asChild"> {
+}
+declare const DialogDescription: react.ForwardRefExoticComponent<DialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+
+interface AlertDialogProps extends Omit<AlertDialogPrimitive.AlertDialogProps, "children">, SketchProps {
+    children?: ReactNode;
+    /**
+     * Backdrop fade, panel enter/exit, and border draw-in on open.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+/**
+ * Confirm / destructive-action variant of `Dialog`. Same composable shape,
+ * but Radix's alert dialog primitive requires an explicit action — there is
+ * no dismiss-on-outside-click or Escape by default, and `AlertDialogAction`
+ * / `AlertDialogCancel` give the confirm button visual emphasis.
+ */
+declare function AlertDialog({ children, open, defaultOpen, onOpenChange, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, ...rest }: AlertDialogProps): react.JSX.Element;
+declare const AlertDialogTrigger: react.ForwardRefExoticComponent<AlertDialogPrimitive.AlertDialogTriggerProps & react.RefAttributes<HTMLButtonElement>>;
+declare const AlertDialogPortal: react.FC<AlertDialogPrimitive.AlertDialogPortalProps>;
+interface AlertDialogOverlayProps extends Omit<AlertDialogPrimitive.AlertDialogOverlayProps, "asChild" | "forceMount"> {
+}
+declare const AlertDialogOverlay: react.ForwardRefExoticComponent<AlertDialogOverlayProps & react.RefAttributes<HTMLDivElement>>;
+interface AlertDialogContentProps extends Omit<AlertDialogPrimitive.AlertDialogContentProps, "asChild" | "forceMount"> {
+    children?: ReactNode;
+    contentStyle?: CSSProperties;
+}
+declare const AlertDialogContent: react.ForwardRefExoticComponent<AlertDialogContentProps & react.RefAttributes<HTMLDivElement>>;
+interface AlertDialogHeaderProps {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function AlertDialogHeader({ children, className, style, }: AlertDialogHeaderProps): react.JSX.Element;
+interface AlertDialogFooterProps {
+    children?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+}
+declare function AlertDialogFooter({ children, className, style, }: AlertDialogFooterProps): react.JSX.Element;
+interface AlertDialogTitleProps extends Omit<AlertDialogPrimitive.AlertDialogTitleProps, "asChild"> {
+}
+declare const AlertDialogTitle: react.ForwardRefExoticComponent<AlertDialogTitleProps & react.RefAttributes<HTMLHeadingElement>>;
+interface AlertDialogDescriptionProps extends Omit<AlertDialogPrimitive.AlertDialogDescriptionProps, "asChild"> {
+}
+declare const AlertDialogDescription: react.ForwardRefExoticComponent<AlertDialogDescriptionProps & react.RefAttributes<HTMLParagraphElement>>;
+interface AlertDialogActionProps extends Omit<AlertDialogPrimitive.AlertDialogActionProps, "asChild"> {
+}
+declare const AlertDialogAction: react.ForwardRefExoticComponent<AlertDialogActionProps & react.RefAttributes<HTMLButtonElement>>;
+interface AlertDialogCancelProps extends Omit<AlertDialogPrimitive.AlertDialogCancelProps, "asChild"> {
+}
+declare const AlertDialogCancel: react.ForwardRefExoticComponent<AlertDialogCancelProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface CommandProps extends Omit<ComponentPropsWithoutRef<typeof Command$1>, "asChild">, SketchProps {
+    children?: ReactNode;
+    /**
+     * Draw-in the panel border on mount.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+/**
+ * Command palette / cmd+k style searchable list, built on `cmdk` with a
+ * `SketchBox` frame. Compose with `CommandInput`, `CommandList`,
+ * `CommandEmpty`, `CommandGroup`, `CommandItem`, `CommandSeparator`.
+ */
+declare const Command: react.ForwardRefExoticComponent<CommandProps & react.RefAttributes<HTMLDivElement>>;
+interface CommandInputProps extends Omit<ComponentPropsWithoutRef<typeof CommandInput$1>, "asChild"> {
+}
+declare const CommandInput: react.ForwardRefExoticComponent<CommandInputProps & react.RefAttributes<HTMLInputElement>>;
+interface CommandListProps extends Omit<ComponentPropsWithoutRef<typeof CommandList$1>, "asChild"> {
+}
+declare const CommandList: react.ForwardRefExoticComponent<CommandListProps & react.RefAttributes<HTMLDivElement>>;
+interface CommandEmptyProps extends Omit<ComponentPropsWithoutRef<typeof CommandEmpty$1>, "asChild"> {
+}
+declare const CommandEmpty: react.ForwardRefExoticComponent<CommandEmptyProps & react.RefAttributes<HTMLDivElement>>;
+interface CommandGroupProps extends Omit<ComponentPropsWithoutRef<typeof CommandGroup$1>, "asChild"> {
+}
+declare const CommandGroup: react.ForwardRefExoticComponent<CommandGroupProps & react.RefAttributes<HTMLDivElement>>;
+interface CommandItemProps extends Omit<ComponentPropsWithoutRef<typeof CommandItem$1>, "asChild"> {
+}
+declare const CommandItem: react.ForwardRefExoticComponent<CommandItemProps & react.RefAttributes<HTMLDivElement>>;
+interface CommandSeparatorProps extends Omit<ComponentPropsWithoutRef<typeof CommandSeparator$1>, "asChild"> {
+}
+declare const CommandSeparator: react.ForwardRefExoticComponent<CommandSeparatorProps & react.RefAttributes<HTMLDivElement>>;
+declare function CommandShortcut({ children, className, style, }: {
+    children?: ReactNode;
+    className?: string;
+    style?: React.CSSProperties;
+}): react.JSX.Element;
+
+interface ComboboxProps extends SketchProps {
+    options: SelectOption[];
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyMessage?: ReactNode;
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    disabled?: boolean;
+    className?: string;
+    style?: CSSProperties;
+    "aria-label"?: string;
+    /**
+     * Draw-in the trigger on mount and the popover border on open.
+     * Defaults to the DoodleUIProvider value (true).
+     */
+    animate?: boolean;
+}
+/**
+ * Searchable select. Composes `Popover` (positioning) + `Command` (cmdk
+ * filtering/list) behind a sketchy `Input`-styled trigger button — the same
+ * recipe shadcn uses, since Radix has no dedicated Combobox primitive.
+ */
+declare function Combobox({ options, placeholder, searchPlaceholder, emptyMessage, value, defaultValue, onValueChange, disabled, className, style, roughness, seed, sketchColor, bowing, fillStyle, strokeWidth, animate, "aria-label": ariaLabel, }: ComboboxProps): react.JSX.Element;
+
+export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, Alert, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, AlertDialogPortal, type AlertDialogProps, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertProps, type AlertVariant, Avatar, type AvatarProps, type AvatarShape, type AvatarStatus, Badge, type BadgeProps, type BadgeVariant, Breadcrumb, BreadcrumbItem, type BreadcrumbItemProps, type BreadcrumbProps, type BreadcrumbSeparator, Button, type ButtonProps, type ButtonSize, type ButtonVariant, Card, type CardProps, Checkbox, type CheckboxProps, Collapsible, CollapsibleContent, type CollapsibleContentProps, type CollapsibleProps, CollapsibleTrigger, type CollapsibleTriggerProps, Combobox, type ComboboxProps, Command, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, DEFAULT_BOWING, DEFAULT_INK, DEFAULT_ROUGHNESS, DEFAULT_STROKE_WIDTH, DRAW_IN_ALERT_MS, DRAW_IN_DURATION_MS, DRAW_IN_MARK_MS, DRAW_IN_TOOLTIP_MS, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, DialogPortal, type DialogProps, DialogTitle, type DialogTitleProps, DialogTrigger, Divider, type DividerOrientation, type DividerProps, type DoodleUIContextValue, DoodleUIProvider, type DoodleUIProviderProps, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, type DropdownMenuProps, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSub, DropdownMenuTrigger, type FillStyle, Input, type InputProps, Label, type LabelProps, Modal, ModalClose, ModalDescription, type ModalProps, ModalRoot, ModalTitle, ModalTrigger, Pagination, type PaginationProps, Popover, PopoverAnchor, PopoverArrow, PopoverClose, PopoverContent, type PopoverContentProps, type PopoverProps, PopoverTrigger, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type RoughShape, RoughSvg, type RoughSvgProps, SKETCH_COLORS, Select, SelectContent, type SelectContentProps, SelectGroup, SelectItem, type SelectItemProps, SelectLabel, type SelectOption, type SelectProps, SelectRoot, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Skeleton, type SkeletonProps, type SkeletonVariant, SketchBox, type SketchBoxProps, type SketchProps, type SketchSeedContextValue, SketchSeedProvider, type SketchSeedProviderProps, Slider, type SliderProps, type SliderThumbShape, Stepper, type StepperOrientation, type StepperProps, type StepperStep, Switch, type SwitchProps, TABLE_STAGGER_MS, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, type TabProps, Table, TableBody, TableCell, type TableCellProps, TableHead, TableHeaderCell, type TableHeaderCellProps, type TableProps, TableRow, Tabs, type TabsProps, Textarea, type TextareaProps, Toast, ToastAction, ToastClose, ToastDescription, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastRoot, ToastTitle, type ToastVariant, ToastViewport, Tooltip, type TooltipProps, TooltipProvider, deriveSeed, toRoughOptions, useAnimate, useDoodleUI, useDrawIn, useResolvedSeed, useSketchSeed };