@deriv-ds/design-intelligence-layer 0.2.0 → 0.3.0

package/dist/index.d.ts

@@ -1,6 +1,6 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as React$1 from 'react';
-import { Accordion as Accordion$1, AlertDialog as AlertDialog$1, AspectRatio as AspectRatio$1, Avatar as Avatar$1, Checkbox as Checkbox$1, Collapsible as Collapsible$1, Dialog as Dialog$1, ContextMenu as ContextMenu$1, Direction, DropdownMenu as DropdownMenu$1, Label as Label$1, Slot, HoverCard as HoverCard$1, Separator as Separator$1, Menubar as Menubar$1, NavigationMenu as NavigationMenu$1, Popover as Popover$1, Progress as Progress$1, RadioGroup as RadioGroup$1, ScrollArea as ScrollArea$1, Select as Select$1, Tooltip as Tooltip$1, Slider as Slider$1, Switch as Switch$1, Tabs as Tabs$1, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1 } from 'radix-ui';
+import { Accordion as Accordion$1, AlertDialog as AlertDialog$1, AspectRatio as AspectRatio$1, Avatar as Avatar$1, Checkbox as Checkbox$1, Collapsible as Collapsible$1, Dialog as Dialog$1, ContextMenu as ContextMenu$1, Direction, DropdownMenu as DropdownMenu$1, Label as Label$1, Slot, HoverCard as HoverCard$1, Separator as Separator$1, Popover as Popover$1, Progress as Progress$1, RadioGroup as RadioGroup$1, ScrollArea as ScrollArea$1, Select as Select$1, Tooltip as Tooltip$1, Slider as Slider$1, Switch as Switch$1, Tabs, Toggle as Toggle$1, ToggleGroup as ToggleGroup$1 } from 'radix-ui';
 import * as class_variance_authority_types from 'class-variance-authority/types';
 import { VariantProps } from 'class-variance-authority';
 import { DayPicker, DayButton } from 'react-day-picker';
@@ -21,16 +21,57 @@ declare function AccordionItem({ className, ...props }: React$1.ComponentProps<t
 declare function AccordionTrigger({ className, children, ...props }: React$1.ComponentProps<typeof Accordion$1.Trigger>): react_jsx_runtime.JSX.Element;
 declare function AccordionContent({ className, children, ...props }: React$1.ComponentProps<typeof Accordion$1.Content>): react_jsx_runtime.JSX.Element;
 
-declare const alertVariants: (props?: ({
-    variant?: "info" | "error" | null | undefined;
+declare function Badge({ count, className, ...props }: React$1.ComponentProps<"span"> & {
+    count: number;
+}): react_jsx_runtime.JSX.Element;
+declare const dotColorMap: {
+    readonly red: "bg-badge-status-red";
+    readonly yellow: "bg-badge-status-yellow";
+    readonly green: "bg-badge-status-green";
+    readonly blue: "bg-badge-status-blue";
+};
+declare function BadgeDot({ size, color, className, ...props }: React$1.ComponentProps<"span"> & {
+    size?: "sm" | "md";
+    color?: keyof typeof dotColorMap;
+}): react_jsx_runtime.JSX.Element;
+
+type NotificationVariant = "information" | "success" | "warning" | "danger";
+interface NotificationBannerProps {
+    title: string;
+    description?: string;
+    onClose?: () => void;
+    className?: string;
+}
+declare function NotificationBanner({ title, description, onClose, className, }: NotificationBannerProps): react_jsx_runtime.JSX.Element;
+interface NotificationItemProps {
+    variant?: NotificationVariant;
+    title: string;
+    description?: string;
+    dateTime?: string;
+    isRead: boolean;
+    /** desktop=true → hover reveals icon-only actions (no swipe). default false = mobile swipe mode. */
+    desktop?: boolean;
+    onRead?: () => void;
+    onUnread?: () => void;
+    onDelete?: () => void;
+    className?: string;
+}
+declare function NotificationItem({ desktop, ...props }: NotificationItemProps): react_jsx_runtime.JSX.Element;
+declare function NotificationDivider({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+
+declare const sectionMessageVariants: (props?: ({
+    variant?: "information" | "success" | "warning" | "danger" | "default" | "error" | "info" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Alert({ className, variant, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof alertVariants>): react_jsx_runtime.JSX.Element;
-declare function AlertTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function AlertDescription({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function SectionMessage({ className, variant, size, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof sectionMessageVariants>): react_jsx_runtime.JSX.Element;
+declare function SectionMessageTitle({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare function SectionMessageDescription({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 
 declare const buttonVariants: (props?: ({
-    variant?: "primary" | "secondary" | "tertiary" | null | undefined;
-    size?: "lg" | "md" | "sm" | "xs" | "icon" | "icon-lg" | "icon-md" | "icon-sm" | "icon-xs" | null | undefined;
+    variant?: "primary" | "secondary" | "tertiary" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | "icon" | "icon-lg" | "icon-md" | "icon-sm" | "icon-xs" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Button({ className, variant, size, asChild, loading, ...props }: React$1.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
     asChild?: boolean;
@@ -63,11 +104,11 @@ declare function AvatarBadge({ className, ...props }: React$1.ComponentProps<"sp
 declare function AvatarGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function AvatarGroupCount({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 
-declare const badgeVariants: (props?: ({
-    variant?: "fill" | "default" | "default-success" | "default-fail" | "default-warning" | "fill-success" | "fill-fail" | "fill-warning" | "ghost" | "ghost-success" | "ghost-fail" | "ghost-warning" | null | undefined;
-    size?: "lg" | "md" | "sm" | null | undefined;
+declare const tagVariants: (props?: ({
+    variant?: "fill-neutral" | "fill-red" | "fill-yellow" | "fill-green" | "fill-blue" | "outline-neutral" | "outline-red" | "outline-yellow" | "outline-green" | "outline-blue" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Badge({ className, variant, size, asChild, ...props }: React$1.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+declare function Tag({ className, variant, size, asChild, ...props }: React$1.ComponentProps<"span"> & VariantProps<typeof tagVariants> & {
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
@@ -81,6 +122,13 @@ declare function BreadcrumbPage({ className, ...props }: React$1.ComponentProps<
 declare function BreadcrumbSeparator({ children, className, ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
 declare function BreadcrumbEllipsis({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
 
+declare const chipVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Chip({ className, size, selected, ...props }: React$1.ComponentProps<"button"> & VariantProps<typeof chipVariants> & {
+    selected?: boolean;
+}): react_jsx_runtime.JSX.Element;
+
 declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React$1.ComponentProps<typeof DayPicker> & {
     buttonVariant?: React$1.ComponentProps<typeof Button>["variant"];
 }): react_jsx_runtime.JSX.Element;
@@ -270,7 +318,7 @@ declare function DropdownMenuSubContent({ className, ...props }: React$1.Compone
 declare function Empty({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function EmptyHeader({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const emptyMediaVariants: (props?: ({
-    variant?: "icon" | "default" | null | undefined;
+    variant?: "default" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function EmptyMedia({ className, variant, ...props }: React.ComponentProps<"div"> & VariantProps<typeof emptyMediaVariants>): react_jsx_runtime.JSX.Element;
 declare function EmptyTitle({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
@@ -325,7 +373,22 @@ declare function HoverCard({ ...props }: React$1.ComponentProps<typeof HoverCard
 declare function HoverCardTrigger({ ...props }: React$1.ComponentProps<typeof HoverCard$1.Trigger>): react_jsx_runtime.JSX.Element;
 declare function HoverCardContent({ className, align, sideOffset, ...props }: React$1.ComponentProps<typeof HoverCard$1.Content>): react_jsx_runtime.JSX.Element;
 
-declare function Input({ className, type, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
+declare const inputWrapperVariants: (props?: ({
+    variant?: "fill" | "outline" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+    status?: "success" | "default" | "error" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface InputProps extends Omit<React$1.ComponentProps<"input">, "size">, VariantProps<typeof inputWrapperVariants> {
+    label?: string;
+    helperText?: string;
+    iconLeft?: React$1.ReactNode;
+    iconRight?: React$1.ReactNode;
+    /** When false, renders the labelless variant: label and input cross-fade at the same size. */
+    labeled?: boolean;
+    /** Horizontal text alignment for both label and input. Default is "left". */
+    align?: "left" | "center";
+}
+declare const Input: React$1.ForwardRefExoticComponent<Omit<InputProps, "ref"> & React$1.RefAttributes<HTMLInputElement>>;
 
 declare function InputGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare const inputGroupAddonVariants: (props?: ({
@@ -340,28 +403,58 @@ declare function InputGroupText({ className, ...props }: React$1.ComponentProps<
 declare function InputGroupInput({ className, ...props }: React$1.ComponentProps<"input">): react_jsx_runtime.JSX.Element;
 declare function InputGroupTextarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
 
+declare const searchFieldVariants: (props?: ({
+    variant?: "fill" | "outline" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SearchFieldProps = Omit<React$1.ComponentProps<"div">, "children"> & VariantProps<typeof searchFieldVariants> & {
+    placeholder?: string;
+    disabled?: boolean;
+    value?: string;
+    defaultValue?: string;
+    onChange?: React$1.ChangeEventHandler<HTMLInputElement>;
+};
+declare function SearchField({ variant, size, className, placeholder, disabled, value, defaultValue, onChange, ...props }: SearchFieldProps): react_jsx_runtime.JSX.Element;
+
 declare function InputOTP({ className, containerClassName, ...props }: React$1.ComponentProps<typeof OTPInput> & {
     containerClassName?: string;
 }): react_jsx_runtime.JSX.Element;
 declare function InputOTPGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
-declare function InputOTPSlot({ index, className, ...props }: React$1.ComponentProps<"div"> & {
+declare const inputOTPSlotVariants: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+    status?: "success" | "default" | "error" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function InputOTPSlot({ index, className, size, status, ...props }: React$1.ComponentProps<"div"> & {
     index: number;
-}): react_jsx_runtime.JSX.Element;
+} & VariantProps<typeof inputOTPSlotVariants>): react_jsx_runtime.JSX.Element;
 declare function InputOTPSeparator({ ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 
+declare function CodeInput({ className, containerClassName, ...props }: React$1.ComponentProps<typeof OTPInput> & {
+    containerClassName?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function CodeInputGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+declare const codeInputSlotVariants: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+    status?: "success" | "default" | "error" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function CodeInputSlot({ index, className, size, status, ...props }: React$1.ComponentProps<"div"> & {
+    index: number;
+} & VariantProps<typeof codeInputSlotVariants>): react_jsx_runtime.JSX.Element;
+declare function CodeInputSeparator({ ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
 declare function Separator({ className, orientation, decorative, ...props }: React$1.ComponentProps<typeof Separator$1.Root>): react_jsx_runtime.JSX.Element;
 
 declare function ItemGroup({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 declare function ItemSeparator({ className, ...props }: React$1.ComponentProps<typeof Separator>): react_jsx_runtime.JSX.Element;
 declare const itemVariants: (props?: ({
-    variant?: "default" | "outline" | "muted" | null | undefined;
-    size?: "sm" | "default" | null | undefined;
+    variant?: "disabled" | "selected" | "default" | "outline" | "muted" | null | undefined;
+    size?: "sm" | "md" | "default" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Item({ className, variant, size, asChild, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof itemVariants> & {
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
 declare const itemMediaVariants: (props?: ({
-    variant?: "image" | "icon" | "default" | null | undefined;
+    variant?: "image" | "default" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function ItemMedia({ className, variant, ...props }: React$1.ComponentProps<"div"> & VariantProps<typeof itemMediaVariants>): react_jsx_runtime.JSX.Element;
 declare function ItemContent({ className, ...props }: React$1.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
@@ -375,54 +468,19 @@ declare function Kbd({ className, ...props }: React.ComponentProps<"kbd">): reac
 declare function KbdGroup({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 
 declare const linkVariants: (props?: ({
-    size?: "lg" | "md" | "sm" | null | undefined;
+    variant?: "primary" | "secondary-normal" | "secondary-inverse" | "secondary-static-light" | "secondary-static-dark" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function Link({ className, size, asChild, ...props }: React$1.ComponentProps<"a"> & VariantProps<typeof linkVariants> & {
+declare function Link({ className, variant, size, asChild, ...props }: React$1.ComponentProps<"a"> & VariantProps<typeof linkVariants> & {
     asChild?: boolean;
 }): react_jsx_runtime.JSX.Element;
 
-declare function Menubar({ className, ...props }: React$1.ComponentProps<typeof Menubar$1.Root>): react_jsx_runtime.JSX.Element;
-declare function MenubarMenu({ ...props }: React$1.ComponentProps<typeof Menubar$1.Menu>): react_jsx_runtime.JSX.Element;
-declare function MenubarGroup({ ...props }: React$1.ComponentProps<typeof Menubar$1.Group>): react_jsx_runtime.JSX.Element;
-declare function MenubarPortal({ ...props }: React$1.ComponentProps<typeof Menubar$1.Portal>): react_jsx_runtime.JSX.Element;
-declare function MenubarRadioGroup({ ...props }: React$1.ComponentProps<typeof Menubar$1.RadioGroup>): react_jsx_runtime.JSX.Element;
-declare function MenubarTrigger({ className, ...props }: React$1.ComponentProps<typeof Menubar$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function MenubarContent({ className, align, alignOffset, sideOffset, ...props }: React$1.ComponentProps<typeof Menubar$1.Content>): react_jsx_runtime.JSX.Element;
-declare function MenubarItem({ className, inset, variant, ...props }: React$1.ComponentProps<typeof Menubar$1.Item> & {
-    inset?: boolean;
-    variant?: "default" | "destructive";
-}): react_jsx_runtime.JSX.Element;
-declare function MenubarCheckboxItem({ className, children, checked, ...props }: React$1.ComponentProps<typeof Menubar$1.CheckboxItem>): react_jsx_runtime.JSX.Element;
-declare function MenubarRadioItem({ className, children, ...props }: React$1.ComponentProps<typeof Menubar$1.RadioItem>): react_jsx_runtime.JSX.Element;
-declare function MenubarLabel({ className, inset, ...props }: React$1.ComponentProps<typeof Menubar$1.Label> & {
-    inset?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function MenubarSeparator({ className, ...props }: React$1.ComponentProps<typeof Menubar$1.Separator>): react_jsx_runtime.JSX.Element;
-declare function MenubarShortcut({ className, ...props }: React$1.ComponentProps<"span">): react_jsx_runtime.JSX.Element;
-declare function MenubarSub({ ...props }: React$1.ComponentProps<typeof Menubar$1.Sub>): react_jsx_runtime.JSX.Element;
-declare function MenubarSubTrigger({ className, inset, children, ...props }: React$1.ComponentProps<typeof Menubar$1.SubTrigger> & {
-    inset?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function MenubarSubContent({ className, ...props }: React$1.ComponentProps<typeof Menubar$1.SubContent>): react_jsx_runtime.JSX.Element;
-
 declare function NativeSelect({ className, size, ...props }: Omit<React$1.ComponentProps<"select">, "size"> & {
     size?: "sm" | "default";
 }): react_jsx_runtime.JSX.Element;
 declare function NativeSelectOption({ ...props }: React$1.ComponentProps<"option">): react_jsx_runtime.JSX.Element;
 declare function NativeSelectOptGroup({ className, ...props }: React$1.ComponentProps<"optgroup">): react_jsx_runtime.JSX.Element;
 
-declare function NavigationMenu({ className, children, viewport, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Root> & {
-    viewport?: boolean;
-}): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuList({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.List>): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuItem({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Item>): react_jsx_runtime.JSX.Element;
-declare const navigationMenuTriggerStyle: (props?: class_variance_authority_types.ClassProp | undefined) => string;
-declare function NavigationMenuTrigger({ className, children, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuContent({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Content>): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuViewport({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Viewport>): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuLink({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Link>): react_jsx_runtime.JSX.Element;
-declare function NavigationMenuIndicator({ className, ...props }: React$1.ComponentProps<typeof NavigationMenu$1.Indicator>): react_jsx_runtime.JSX.Element;
-
 declare function Pagination({ className, ...props }: React$1.ComponentProps<"nav">): react_jsx_runtime.JSX.Element;
 declare function PaginationContent({ className, ...props }: React$1.ComponentProps<"ul">): react_jsx_runtime.JSX.Element;
 declare function PaginationItem({ ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
@@ -442,7 +500,12 @@ declare function PopoverHeader({ className, ...props }: React$1.ComponentProps<"
 declare function PopoverTitle({ className, ...props }: React$1.ComponentProps<"h2">): react_jsx_runtime.JSX.Element;
 declare function PopoverDescription({ className, ...props }: React$1.ComponentProps<"p">): react_jsx_runtime.JSX.Element;
 
-declare function Progress({ className, value, ...props }: React$1.ComponentProps<typeof Progress$1.Root>): react_jsx_runtime.JSX.Element;
+declare const progressVariants: (props?: ({
+    size?: "sm" | "md" | null | undefined;
+    variant?: "normal" | "inverse" | null | undefined;
+    color?: "red" | "yellow" | "green" | "blue" | "default" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Progress({ className, value, size, variant, color, ...props }: React$1.ComponentProps<typeof Progress$1.Root> & VariantProps<typeof progressVariants>): react_jsx_runtime.JSX.Element;
 
 declare function RadioGroup({ className, ...props }: React$1.ComponentProps<typeof RadioGroup$1.Root>): react_jsx_runtime.JSX.Element;
 declare function RadioGroupItem({ className, ...props }: React$1.ComponentProps<typeof RadioGroup$1.Item>): react_jsx_runtime.JSX.Element;
@@ -485,7 +548,9 @@ declare function SheetDescription({ className, ...props }: React$1.ComponentProp
 declare function TooltipProvider({ delayDuration, ...props }: React$1.ComponentProps<typeof Tooltip$1.Provider>): react_jsx_runtime.JSX.Element;
 declare function Tooltip({ ...props }: React$1.ComponentProps<typeof Tooltip$1.Root>): react_jsx_runtime.JSX.Element;
 declare function TooltipTrigger({ ...props }: React$1.ComponentProps<typeof Tooltip$1.Trigger>): react_jsx_runtime.JSX.Element;
-declare function TooltipContent({ className, sideOffset, children, ...props }: React$1.ComponentProps<typeof Tooltip$1.Content>): react_jsx_runtime.JSX.Element;
+declare function TooltipContent({ className, sideOffset, variant, children, ...props }: React$1.ComponentProps<typeof Tooltip$1.Content> & {
+    variant?: "default" | "error";
+}): react_jsx_runtime.JSX.Element;
 
 type SidebarContextProps = {
     state: "expanded" | "collapsed";
@@ -527,7 +592,7 @@ declare function SidebarMenu({ className, ...props }: React$1.ComponentProps<"ul
 declare function SidebarMenuItem({ className, ...props }: React$1.ComponentProps<"li">): react_jsx_runtime.JSX.Element;
 declare const sidebarMenuButtonVariants: (props?: ({
     variant?: "default" | "outline" | null | undefined;
-    size?: "lg" | "sm" | "default" | null | undefined;
+    size?: "sm" | "default" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function SidebarMenuButton({ asChild, isActive, variant, size, tooltip, className, ...props }: React$1.ComponentProps<"button"> & {
     asChild?: boolean;
@@ -554,7 +619,7 @@ declare function Skeleton({ className, ...props }: React.ComponentProps<"div">):
 
 declare function Slider({ className, defaultValue, value, min, max, ...props }: React$1.ComponentProps<typeof Slider$1.Root>): react_jsx_runtime.JSX.Element;
 
-declare const Toaster: ({ ...props }: ToasterProps) => react_jsx_runtime.JSX.Element;
+declare const Snackbar: ({ ...props }: ToasterProps) => react_jsx_runtime.JSX.Element;
 
 interface StepperProps {
     value?: number;
@@ -574,6 +639,8 @@ declare function Stepper({ value: controlledValue, defaultValue, onValueChange,
 
 declare function Spinner({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
 
+declare function LoadingSpinner({ className, ...props }: React.ComponentProps<"div">): react_jsx_runtime.JSX.Element;
+
 declare function Switch({ className, size, ...props }: React$1.ComponentProps<typeof Switch$1.Root> & {
     size?: "sm" | "default";
 }): react_jsx_runtime.JSX.Element;
@@ -587,18 +654,47 @@ declare function TableHead({ className, ...props }: React$1.ComponentProps<"th">
 declare function TableCell({ className, ...props }: React$1.ComponentProps<"td">): react_jsx_runtime.JSX.Element;
 declare function TableCaption({ className, ...props }: React$1.ComponentProps<"caption">): react_jsx_runtime.JSX.Element;
 
-declare function Tabs({ className, orientation, ...props }: React$1.ComponentProps<typeof Tabs$1.Root>): react_jsx_runtime.JSX.Element;
-declare const tabsListVariants: (props?: ({
-    variant?: "line" | "default" | null | undefined;
-    size?: "lg" | "md" | "sm" | null | undefined;
+declare const segmentedControlListVariants: (props?: ({
+    size?: "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-declare function TabsList({ className, variant, size, ...props }: React$1.ComponentProps<typeof Tabs$1.List> & VariantProps<typeof tabsListVariants>): react_jsx_runtime.JSX.Element;
-declare function TabsTrigger({ className, iconPosition, ...props }: React$1.ComponentProps<typeof Tabs$1.Trigger> & {
-    iconPosition?: "inline" | "top";
-}): react_jsx_runtime.JSX.Element;
-declare function TabsContent({ className, ...props }: React$1.ComponentProps<typeof Tabs$1.Content>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControl({ className, ...props }: React$1.ComponentProps<typeof Tabs.Root>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControlList({ className, size, ...props }: React$1.ComponentProps<typeof Tabs.List> & VariantProps<typeof segmentedControlListVariants>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControlTrigger({ className, ...props }: React$1.ComponentProps<typeof Tabs.Trigger>): react_jsx_runtime.JSX.Element;
+declare function SegmentedControlContent({ className, ...props }: React$1.ComponentProps<typeof Tabs.Content>): react_jsx_runtime.JSX.Element;
 
-declare function Textarea({ className, ...props }: React$1.ComponentProps<"textarea">): react_jsx_runtime.JSX.Element;
+declare const tabListVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare function Tab({ className, ...props }: React$1.ComponentProps<typeof Tabs.Root>): react_jsx_runtime.JSX.Element;
+declare function TabList({ className, size, ...props }: React$1.ComponentProps<typeof Tabs.List> & VariantProps<typeof tabListVariants>): react_jsx_runtime.JSX.Element;
+declare function TabTrigger({ className, ...props }: React$1.ComponentProps<typeof Tabs.Trigger>): react_jsx_runtime.JSX.Element;
+declare function TabContent({ className, ...props }: React$1.ComponentProps<typeof Tabs.Content>): react_jsx_runtime.JSX.Element;
+
+declare const textareaWrapperVariants: (props?: ({
+    variant?: "fill" | "outline" | null | undefined;
+    status?: "success" | "default" | "error" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface TextareaProps extends Omit<React$1.ComponentProps<"textarea">, "size">, VariantProps<typeof textareaWrapperVariants> {
+    label?: string;
+    helperText?: string;
+    iconLeft?: React$1.ReactNode;
+    iconRight?: React$1.ReactNode;
+    /**
+     * When `true` (default), renders a floating label above the text area.
+     * When `false`, renders the labelless variant where the label acts as a
+     * placeholder that cross-fades with the typed text.
+     */
+    labeled?: boolean;
+    /**
+     * Controls the minimum height for the **labelless** variant only.
+     * - `"md"` (default) → 128 px
+     * - `"sm"` → 104 px
+     *
+     * Ignored when `labeled={true}`, which always uses the 128 px height.
+     */
+    size?: "sm" | "md";
+}
+declare const Textarea: React$1.ForwardRefExoticComponent<Omit<TextareaProps, "ref"> & React$1.RefAttributes<HTMLTextAreaElement>>;
 
 interface TicketCardProps {
     icon?: React$1.ReactNode;
@@ -614,7 +710,7 @@ declare function TicketCard({ icon, label, value, stubIcon, stubLabel, onStubCli
 
 declare const toggleVariants: (props?: ({
     variant?: "default" | "outline" | null | undefined;
-    size?: "lg" | "sm" | "default" | null | undefined;
+    size?: "sm" | "default" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 declare function Toggle({ className, variant, size, ...props }: React$1.ComponentProps<typeof Toggle$1.Root> & VariantProps<typeof toggleVariants>): react_jsx_runtime.JSX.Element;
 
@@ -627,4 +723,4 @@ declare function cn(...inputs: ClassValue[]): string;
 
 declare function useIsMobile(): boolean;
 
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, Alert, AlertDescription, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AlertTitle, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DirectionProvider, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Link, Menubar, MenubarCheckboxItem, MenubarContent, MenubarGroup, MenubarItem, MenubarLabel, MenubarMenu, MenubarPortal, MenubarRadioGroup, MenubarRadioItem, MenubarSeparator, MenubarShortcut, MenubarSub, MenubarSubContent, MenubarSubTrigger, MenubarTrigger, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NavigationMenu, NavigationMenuContent, NavigationMenuIndicator, NavigationMenuItem, NavigationMenuLink, NavigationMenuList, NavigationMenuTrigger, NavigationMenuViewport, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Spinner, Stepper, type StepperProps, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TabsContent, TabsList, TabsTrigger, Textarea, TicketCard, type TicketCardProps, Toaster, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, badgeVariants, buttonVariants, cn, linkVariants, navigationMenuTriggerStyle, tabsListVariants, toggleVariants, useComboboxAnchor, useDirection, useFormField, useIsMobile, useSidebar };
+export { Accordion, AccordionContent, AccordionItem, AccordionTrigger, AlertDialog, AlertDialogAction, AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogMedia, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger, AspectRatio, Avatar, AvatarBadge, AvatarFallback, AvatarGroup, AvatarGroupCount, AvatarImage, Badge, BadgeDot, Breadcrumb, BreadcrumbEllipsis, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, Button, Calendar, CalendarDayButton, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Carousel, type CarouselApi, CarouselContent, CarouselItem, CarouselNext, CarouselPrevious, type ChartConfig, ChartContainer, ChartLegend, ChartLegendContent, ChartStyle, ChartTooltip, ChartTooltipContent, Checkbox, Chip, CodeInput, CodeInputGroup, CodeInputSeparator, CodeInputSlot, Collapsible, CollapsibleContent, CollapsibleTrigger, Combobox, ComboboxChip, ComboboxChips, ComboboxChipsInput, ComboboxCollection, ComboboxContent, ComboboxEmpty, ComboboxGroup, ComboboxInput, ComboboxItem, ComboboxLabel, ComboboxList, ComboboxSeparator, ComboboxTrigger, ComboboxValue, Command, CommandDialog, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, CommandShortcut, ContextMenu, ContextMenuCheckboxItem, ContextMenuContent, ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuPortal, ContextMenuRadioGroup, ContextMenuRadioItem, ContextMenuSeparator, ContextMenuShortcut, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger, ContextMenuTrigger, Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogTitle, DialogTrigger, DirectionProvider, Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, DrawerHeader, DrawerOverlay, DrawerPortal, DrawerTitle, DrawerTrigger, DropdownMenu, DropdownMenuCheckboxItem, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, DropdownMenuSeparator, DropdownMenuShortcut, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTitle, Field, FieldContent, FieldDescription, FieldError, FieldGroup, FieldLabel, FieldLegend, FieldSeparator, FieldSet, FieldTitle, Form, FormControl, FormDescription, FormField, FormItem, FormLabel, FormMessage, HoverCard, HoverCardContent, HoverCardTrigger, Input, InputGroup, InputGroupAddon, InputGroupButton, InputGroupInput, InputGroupText, InputGroupTextarea, InputOTP, InputOTPGroup, InputOTPSeparator, InputOTPSlot, Item, ItemActions, ItemContent, ItemDescription, ItemFooter, ItemGroup, ItemHeader, ItemMedia, ItemSeparator, ItemTitle, Kbd, KbdGroup, Label, Link, LoadingSpinner, NativeSelect, NativeSelectOptGroup, NativeSelectOption, NotificationBanner, type NotificationBannerProps, NotificationDivider, NotificationItem, type NotificationItemProps, type NotificationVariant, Pagination, PaginationContent, PaginationEllipsis, PaginationItem, PaginationLink, PaginationNext, PaginationPrevious, Popover, PopoverAnchor, PopoverContent, PopoverDescription, PopoverHeader, PopoverTitle, PopoverTrigger, Progress, RadioGroup, RadioGroupItem, ResizableHandle, ResizablePanel, ResizablePanelGroup, ScrollArea, ScrollBar, SearchField, SectionMessage, SectionMessageDescription, SectionMessageTitle, SegmentedControl, SegmentedControlContent, SegmentedControlList, SegmentedControlTrigger, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, SelectValue, Separator, Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger, Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupAction, SidebarGroupContent, SidebarGroupLabel, SidebarHeader, SidebarInput, SidebarInset, SidebarMenu, SidebarMenuAction, SidebarMenuBadge, SidebarMenuButton, SidebarMenuItem, SidebarMenuSkeleton, SidebarMenuSub, SidebarMenuSubButton, SidebarMenuSubItem, SidebarProvider, SidebarRail, SidebarSeparator, SidebarTrigger, Skeleton, Slider, Snackbar, Spinner, Stepper, type StepperProps, Switch, Tab, TabContent, TabList, TabTrigger, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tag, Textarea, TicketCard, type TicketCardProps, Toggle, ToggleGroup, ToggleGroupItem, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, buttonVariants, chipVariants, cn, codeInputSlotVariants, inputOTPSlotVariants, inputWrapperVariants as inputVariants, linkVariants, progressVariants, searchFieldVariants, segmentedControlListVariants, tabListVariants, tagVariants, textareaWrapperVariants as textareaVariants, toggleVariants, useComboboxAnchor, useDirection, useFormField, useIsMobile, useSidebar };