@tenerife.music/ui 1.0.8 → 1.0.12

package/dist/index.d.ts

@@ -1,39 +1,3726 @@
-export * from './tokens';
-export { ICON_TOKENS, type IconColor, type IconSize, type IconStroke, } from './tokens/components/icon';
-export { Button, type ButtonProps, buttonVariants } from './components/ui/button';
-export { Text, type TextProps, type TextSize, textVariants, type TextWeight, } from './components/ui/text';
-export { Alert, type AlertProps, alertVariants } from './components/ui/alert';
-export { Body, type BodyProps, bodyVariants } from './components/ui/body';
-export { Caption, type CaptionProps, captionVariants } from './components/ui/caption';
-export { Code, type CodeProps, codeVariants } from './components/ui/code';
-export { Display, type DisplayProps, displayVariants } from './components/ui/display';
-export { Heading, type HeadingProps, headingVariants } from './components/ui/heading';
-export { Lead, type LeadProps, leadVariants } from './components/ui/lead';
-export { Checkbox, type CheckboxProps, checkboxVariants } from './components/checkbox';
-export { Input, type InputProps, inputVariants } from './components/input';
-export { Radio, RadioGroup, type RadioGroupProps, type RadioProps, radioVariants, } from './components/radio';
-export { Select, SelectListbox, type SelectListboxProps, selectListboxVariants, SelectOption, type SelectOptionProps, selectOptionVariants, SelectRoot, type SelectRootProps, type SelectSize, SelectTrigger, type SelectTriggerProps, selectTriggerVariants, type SelectVariant, } from './components/select';
-export { Textarea, type TextareaProps, textareaVariants } from './components/textarea';
-export { Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldLabelProps, type FieldProps, } from './components/ui/field';
-export { Label, type LabelProps, labelVariants } from './components/ui/label';
-export { Box, type BoxProps, Column, type ColumnProps, Container, type ContainerProps, Flex, type FlexProps, Grid, type GridProps, Row, type RowProps, Stack, type StackProps, Surface, type SurfaceProps, surfaceVariants, } from './components/layout';
-export { Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Surface as ContainerSurface, type SurfaceProps as ContainerSurfaceProps, surfaceVariants as containerSurfaceVariants, Section, type SectionProps, } from './components/containers';
-export { Backdrop, type BackdropProps, Dialog, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, DialogRoot, DialogTitle, type DialogTitleProps, Modal, ModalBody, type ModalBodyProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, type ModalProps, modalVariants, Portal, type PortalProps, Toast, type ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastViewport, type ToastViewportProps, useToast, } from './components/overlays';
-export { type GroupByFunction, NotificationCenter, NotificationCenterDismissAll, type NotificationCenterDismissAllProps, NotificationCenterGroupHeader, type NotificationCenterGroupHeaderProps, NotificationCenterItem, type NotificationCenterItemProps, NotificationCenterList, type NotificationCenterListProps, NotificationCenterPanel, type NotificationCenterPanelProps, NotificationCenterProvider, type NotificationCenterProviderProps, NotificationCenterTrigger, type NotificationCenterTriggerProps, type NotificationChannel, type NotificationContextType, type NotificationData, type NotificationOptions, type NotificationVariant, useNotificationCenter, useNotificationCenterContext, } from './components/notifications';
-export { ContextMenuContent, type ContextMenuContentProps, ContextMenuGroup, type ContextMenuGroupProps, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuRoot, type ContextMenuRootProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuTrigger, type ContextMenuTriggerProps, DropdownMenuCheckItem, type DropdownMenuCheckItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuRoot, type DropdownMenuRootProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, HoverCardContent, type HoverCardContentProps, HoverCardRoot, type HoverCardRootProps, HoverCardTrigger, type HoverCardTriggerProps, PopoverArrow, type PopoverArrowProps, PopoverContent, type PopoverContentProps, popoverContentVariants, PopoverRoot, type PopoverRootProps, PopoverTrigger, type PopoverTriggerProps, } from './components/menus';
-export { DataList, DataListItem, type DataListItemProps, DataListLabel, type DataListLabelProps, DataListRoot, type DataListRootProps, DataListValue, type DataListValueProps, EmptyState, EmptyStateAction, type EmptyStateActionProps, EmptyStateDescription, type EmptyStateDescriptionProps, EmptyStateIcon, type EmptyStateIconProps, type EmptyStateProps, EmptyStateTitle, type EmptyStateTitleProps, Skeleton, type SkeletonProps, skeletonVariants, type SortDirection, type SortState, Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, type TableColumn, type TableContextValue, TableEmpty, type TableEmptyProps, TableExpandableContent, type TableExpandableContentProps, TableHead, TableHeader, type TableHeaderProps, type TableHeadProps, TableLoadingState, type TableLoadingStateProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableSortIcon, type TableSortIconProps, useTableContext, } from './components/data';
-export { type BreadcrumbItem, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsRootProps, type BreadcrumbsSeparatorProps, Pagination, type PaginationEllipsisProps, type PaginationItemProps, type PaginationNextProps, type PaginationPrevProps, type PaginationRootProps, SegmentedControl, type SegmentedControlItemProps, segmentedControlItemVariants, type SegmentedControlRootProps, segmentedControlRootVariants, Stepper, type StepperContentProps, type StepperIndicatorProps, type StepperItemProps, type StepperLabelProps, type StepperRootProps, type StepperStep, Tabs, type TabsContentProps, type TabsListProps, tabsListVariants, type TabsRootProps, type TabsTriggerProps, tabsTriggerVariants, } from './components/navigation';
-export { Icon, type IconProps, iconVariants } from './components/icon';
-export { IconArrowRight, IconCalendar, IconCheck, IconChevronDown, IconChevronRight, IconClose, type IconProps as IconComponentProps, IconError, IconInfo, IconLocation, IconMenu, type IconName, ICONS_MAP, IconSearch, IconSuccess, IconWarning, } from './icons';
-export type { ArtistCardProps } from './components/cards/ArtistCard';
-export { ArtistCard } from './components/cards/ArtistCard';
-export type { ArtistCardSize, ArtistCardVariant, } from './components/cards/ArtistCard/ArtistCard.types';
-export type { EventCardProps } from './components/cards/EventCard';
-export { EventCard } from './components/cards/EventCard';
-export type { EventCardSize, EventCardVariant } from './components/cards/EventCard/EventCard.types';
-export type { PromoCardProps } from './components/cards/PromoCard';
-export { PromoCard } from './components/cards/PromoCard';
-export type { PromoCardSize, PromoCardVariant } from './components/cards/PromoCard/PromoCard.types';
-export type { TicketCardProps } from './components/cards/TicketCard';
-export { TicketCard } from './components/cards/TicketCard';
-export type { TicketAvailability, TicketCardSize, TicketCardVariant, } from './components/cards/TicketCard/TicketCard.types';
+export { B as BaseColorTokens, c as ChartColors, C as ColorScale, a as ColorTokens, M as Mode, b as SemanticColors, S as SurfaceColors, T as TextColors, e as accentColors, j as baseColors, h as chartColors, k as colorCSSVariables, d as cssVariableColorTokens, p as primaryColors, s as secondaryColors, g as semanticColors, f as surfaceColors, t as tailwindThemeColors, i as textColors } from './colors-DPNI96bB.js';
+import { spacing, semanticSpacing, borderRadius } from './tokens/index.js';
+export { ALERT_TOKENS, AlertVariant, Animation, BUTTON_TOKENS, BorderRadius, ButtonFontSize, ButtonHeight, ButtonPaddingHorizontal, ButtonPaddingVertical, ButtonShadow, CARD_TOKENS, CHECKBOX_TOKENS, CanonicalFontSize, CanonicalFontWeight, CanonicalLetterSpacing, CanonicalLineHeight, CanonicalTextColor, CardPadding, CardRadius, CardShadow, CardSize, CardSpacingVertical, CheckboxSize, CheckboxState, CheckboxVariant, ColoredShadow, ComponentRadius, ComponentSpacing, ContainerSpacing, DATA_TOKENS, DOMAIN_TOKENS, DROPDOWN_TOKENS, DataListLabelWidth, DataListRowPadding, DomainCardBadge, DomainCardImage, DomainCardLayout, DomainCardMetadata, DomainCardMotion, DomainCardPriceCapacity, DomainCardSkeleton, DomainCardSkeletonContentWidth, DomainCardSurface, DropdownItemSize, DropdownMenuSize, DropdownTriggerSize, DropdownVariant, Duration, Easing, ElevationShadow, EmptyStateIconSize, FocusRing, FontFamily, FontSize, FontWeight, GlowEffect, GridSpacing, ICON_TOKENS, INPUT_TOKENS, IconColor, IconSize, IconStroke, InputFontSize, InputHeight, InputPaddingHorizontal, InputPaddingVertical, InputRadius, InputSize, Keyframe, LetterSpacing, LineHeight, MENU_TOKENS, MOTION_TOKENS, MenuContentMinWidth, MenuContentPadding, MenuContentRadius, MenuContentShadow, MenuIndicatorOffset, MenuIndicatorSize, MenuItemGap, MenuItemHeight, MenuItemPadding, MenuItemRadius, MenuLabelPadding, MenuSeparatorMargin, MotionAnimation, MotionDuration, MotionEasing, MotionTransition, MotionTransitionPreset, MotionV2CombinedType, MotionV2Duration, MotionV2Easing, MotionV2SlideDirection, MotionV2Transition, NAVIGATION_TOKENS, NOTIFICATION_TOKENS, NavigationItemPadding, NavigationListGap, NavigationRadius, NavigationShadow, NavigationSize, NavigationState, NotificationPanelWidth, OVERLAY_TOKENS, OverlayBackdropVariant, OverlayModalSize, POPOVER_TOKENS, PopoverArrowOffset, PopoverArrowSize, PopoverContentPadding, PopoverContentRadius, PopoverContentShadow, PopoverContentWidth, RADIO_TOKENS, RadioSize, RadioState, RadioVariant, SECTION_TOKENS, SURFACE_TOKENS, SWITCH_TOKENS, SectionGap, SectionPadding, SectionSpacing, SemanticSpacing, SkeletonAnimation, SkeletonBackground, SkeletonVariant, Spacing, Spring, StackSpacing, SurfacePadding, SurfaceRadius, SurfaceShadow, SurfaceVariant, SwitchSize, SwitchState, SwitchVariant, TEXT_TOKENS, TOAST_TOKENS, TOOLTIP_TOKENS, TableCellPadding, TableGap, TableHeaderPadding, TableRowHeight, TableShadow, TextFontSize, TextFontWeight, TextLetterSpacing, TextLineHeight, TextStyle, ToastVariant, TooltipContentRadius, TooltipContentShadow, Transition, UI_COLORS, accentColoredShadows, allCSSVariables, allCSSVariablesCSS, animations, componentRadius, componentShadowMapping, durations, easings, elevationShadows, focusRings, fontFamily, fontSize, fontSizeWithMd, fontWeight, generateCSSVariablesCSS, glowEffects, keyframes, layoutSpacing, letterSpacing, lineHeight, motionCSSVariables, motionV2CSSVariables, motionV2Combined, motionV2Durations, motionV2Easings, motionV2Fade, motionV2Scale, motionV2Slide, motionV2TailwindConfig, motionV2Transitions, primaryColoredShadows, radiusCSSVariables, reducedMotion, shadowBase, shadowCSSVariables, shadowOpacity, spacingCSSVariables, springs, tailwindMotionConfig, tailwindRadiusConfig, tailwindShadowConfig, tailwindSpacingConfig, tailwindTypographyConfig, textStyles, tokenSystemSummary, transitions, typographyCSSVariables } from './tokens/index.js';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import * as React$1 from 'react';
+import { ReactNode } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { Placement } from '@floating-ui/react-dom';
+
+declare const buttonVariants: (props?: ({
+    variant?: "primary" | "secondary" | "accent" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "icon" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ButtonProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+    leftIcon?: React$1.ReactNode;
+    rightIcon?: React$1.ReactNode;
+}
+declare const Button: React$1.ForwardRefExoticComponent<ButtonProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+declare const textVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+    weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
+    muted?: boolean | null | undefined;
+    variant?: "primary" | "secondary" | "muted" | "accent" | "destructive" | "outline" | "ghost" | "link" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface TextProps extends React$1.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof textVariants> {
+    /**
+     * @deprecated Use muted prop or semantic text colors instead
+     */
+    variant?: "primary" | "secondary" | "accent" | "outline" | "ghost" | "link" | "destructive" | "muted";
+}
+declare const Text: React$1.ForwardRefExoticComponent<TextProps & React$1.RefAttributes<HTMLSpanElement>>;
+type TextSize = VariantProps<typeof textVariants>["size"];
+type TextWeight = VariantProps<typeof textVariants>["weight"];
+
+declare const alertVariants: (props?: ({
+    variant?: "primary" | "secondary" | "accent" | "destructive" | "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface AlertProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof alertVariants> {
+}
+declare const Alert: React$1.ForwardRefExoticComponent<AlertProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const bodyVariants: (props?: ({
+    size?: "md" | "lg" | null | undefined;
+    weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface BodyProps extends React$1.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof bodyVariants> {
+    as?: "p" | "span" | "div";
+}
+declare const Body: React$1.ForwardRefExoticComponent<BodyProps & React$1.RefAttributes<HTMLElement>>;
+
+declare const captionVariants: (props?: ({
+    weight?: "normal" | "medium" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface CaptionProps extends React$1.HTMLAttributes<HTMLSpanElement>, VariantProps<typeof captionVariants> {
+    as?: "span" | "p" | "div";
+}
+declare const Caption: React$1.ForwardRefExoticComponent<CaptionProps & React$1.RefAttributes<HTMLElement>>;
+
+declare const codeVariants: (props?: ({
+    variant?: "inline" | "block" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface CodeProps extends React$1.HTMLAttributes<HTMLElement>, VariantProps<typeof codeVariants> {
+    as?: "code" | "pre";
+}
+declare const Code: React$1.ForwardRefExoticComponent<CodeProps & React$1.RefAttributes<HTMLElement>>;
+
+declare const displayVariants: (props?: ({
+    size?: "2xl" | "3xl" | "4xl" | "xl" | null | undefined;
+    weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface DisplayProps extends React$1.HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof displayVariants> {
+    as?: "h1" | "h2" | "div";
+}
+declare const Display: React$1.ForwardRefExoticComponent<DisplayProps & React$1.RefAttributes<HTMLElement>>;
+
+declare const headingVariants: (props?: ({
+    level?: 1 | 2 | 4 | 6 | 3 | 5 | null | undefined;
+    weight?: "normal" | "medium" | "semibold" | "bold" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface HeadingProps extends React$1.HTMLAttributes<HTMLHeadingElement>, VariantProps<typeof headingVariants> {
+    as?: "h1" | "h2" | "h3" | "h4" | "h5" | "h6";
+}
+declare const Heading: React$1.ForwardRefExoticComponent<HeadingProps & React$1.RefAttributes<HTMLHeadingElement>>;
+
+declare const leadVariants: (props?: ({
+    size?: "lg" | "xl" | null | undefined;
+    muted?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface LeadProps extends React$1.HTMLAttributes<HTMLParagraphElement>, VariantProps<typeof leadVariants> {
+    as?: "p" | "span" | "div";
+}
+declare const Lead: React$1.ForwardRefExoticComponent<LeadProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * Checkbox Variants
+ *
+ * CVA-based variant system for Checkbox component.
+ * Supports variants (primary, secondary, outline, ghost, destructive),
+ * sizes (xs, sm, md, lg, xl), and states (default, checked, disabled, error, indeterminate).
+ * All styling uses token-based values with CSS variable references.
+ */
+declare const checkboxVariants: (props?: ({
+    variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+    state?: "disabled" | "default" | "error" | "checked" | "indeterminate" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+/**
+ * Checkbox Component Props
+ *
+ * Extends native button HTML attributes with variant props, checked state, and accessibility props.
+ * Uses button role="checkbox" pattern for full keyboard accessibility.
+ */
+interface CheckboxProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "onChange">, VariantProps<typeof checkboxVariants> {
+    /**
+     * Checkbox variant style
+     * @default "outline"
+     */
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
+    /**
+     * Checkbox size
+     * @default "md"
+     */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    /**
+     * Checkbox state
+     * @default "default"
+     */
+    state?: "default" | "checked" | "indeterminate" | "error" | "disabled";
+    /**
+     * Whether checkbox is checked (controlled)
+     */
+    checked?: boolean;
+    /**
+     * Whether checkbox is in indeterminate state
+     * When true, overrides checked state visually
+     */
+    indeterminate?: boolean;
+    /**
+     * Whether checkbox is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Callback fired when checked state changes
+     */
+    onCheckedChange?: (checked: boolean) => void;
+    /**
+     * Custom icon to display when checked
+     * Defaults to IconCheck from icon system
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * Custom icon to display when indeterminate
+     * Defaults to horizontal line indicator
+     */
+    indeterminateIcon?: React$1.ReactNode;
+    /**
+     * ARIA label for the checkbox
+     * Required if no visible label is present
+     */
+    "aria-label"?: string;
+    /**
+     * ARIA labelledby reference
+     * Points to the ID of the element that labels this checkbox
+     */
+    "aria-labelledby"?: string;
+    /**
+     * ARIA describedby reference
+     * Points to the ID of the element that describes this checkbox
+     */
+    "aria-describedby"?: string;
+}
+
+/**
+ * Checkbox Component
+ *
+ * A fully accessible, theme-aware checkbox component with variant support,
+ * keyboard navigation, and comprehensive state management.
+ * Uses button role="checkbox" pattern for full accessibility.
+ *
+ * @example
+ * ```tsx
+ * <Checkbox
+ *   variant="outline"
+ *   size="md"
+ *   checked={isChecked}
+ *   onCheckedChange={setIsChecked}
+ *   aria-label="Accept terms"
+ * />
+ * ```
+ */
+declare const Checkbox: React$1.ForwardRefExoticComponent<CheckboxProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * Input Variants
+ *
+ * CVA-based variant system for Input component.
+ * Supports variants (primary, secondary, outline, ghost, destructive),
+ * sizes (xs, sm, md, lg, xl), and states (default, disabled, error, success).
+ * All styling uses token-based values with CSS variable references.
+ */
+declare const inputVariants: (props?: ({
+    variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+    state?: "disabled" | "default" | "success" | "error" | null | undefined;
+    fullWidth?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+/**
+ * Input Component Props
+ *
+ * Extends native input HTML attributes with variant props, icon slots, and accessibility props.
+ */
+interface InputProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, "size">, VariantProps<typeof inputVariants> {
+    /**
+     * Input variant style
+     * @default "outline"
+     */
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
+    /**
+     * Input size
+     * @default "md"
+     */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    /**
+     * Input state
+     * @default "default"
+     */
+    state?: "default" | "disabled" | "error" | "success";
+    /**
+     * Whether input should take full width
+     * @default true
+     */
+    fullWidth?: boolean;
+    /**
+     * Icon to display on the left side of the input
+     */
+    iconLeft?: React$1.ReactNode;
+    /**
+     * Icon to display on the right side of the input
+     */
+    iconRight?: React$1.ReactNode;
+}
+
+/**
+ * Input Component
+ *
+ * A fully accessible, theme-aware input component with variant support,
+ * icon slots, and comprehensive state management.
+ *
+ * @example
+ * ```tsx
+ * <Input
+ *   variant="outline"
+ *   size="md"
+ *   placeholder="Enter text..."
+ *   iconLeft={<Icon name="search" />}
+ * />
+ * ```
+ */
+declare const Input: React$1.ForwardRefExoticComponent<InputProps & React$1.RefAttributes<HTMLInputElement>>;
+
+/**
+ * Radio Variants
+ *
+ * CVA-based variant system for Radio component.
+ * Supports variants (primary, secondary, outline, ghost, destructive),
+ * sizes (xs, sm, md, lg, xl), and states (default, checked, disabled, error).
+ * All styling uses token-based values with CSS variable references.
+ */
+declare const radioVariants: (props?: ({
+    variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+    state?: "disabled" | "default" | "error" | "checked" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+/**
+ * Radio Component Props
+ *
+ * Extends native button HTML attributes with variant props, checked state, and accessibility props.
+ * Uses button role="radio" pattern for full keyboard accessibility.
+ */
+interface RadioProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "size" | "onChange">, VariantProps<typeof radioVariants> {
+    /**
+     * Radio variant style
+     * @default "outline"
+     */
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
+    /**
+     * Radio size
+     * @default "md"
+     */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    /**
+     * Radio state
+     * @default "default"
+     */
+    state?: "default" | "checked" | "disabled" | "error";
+    /**
+     * Whether radio is checked (controlled)
+     */
+    checked?: boolean;
+    /**
+     * Whether radio is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Value of this radio button
+     * Required when used within RadioGroup
+     */
+    value?: string;
+    /**
+     * Callback fired when radio is selected
+     */
+    onCheckedChange?: (checked: boolean) => void;
+    /**
+     * Custom icon to display when checked
+     * Defaults to filled circle dot
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * ARIA label for the radio
+     * Required if no visible label is present
+     */
+    "aria-label"?: string;
+    /**
+     * ARIA labelledby reference
+     * Points to the ID of the element that labels this radio
+     */
+    "aria-labelledby"?: string;
+    /**
+     * ARIA describedby reference
+     * Points to the ID of the element that describes this radio
+     */
+    "aria-describedby"?: string;
+}
+
+/**
+ * Radio Component
+ *
+ * A fully accessible, theme-aware radio button component with variant support,
+ * keyboard navigation, and comprehensive state management.
+ * Uses button role="radio" pattern for full accessibility.
+ * Can be used standalone or within RadioGroup for group behavior.
+ *
+ * @example
+ * ```tsx
+ * <RadioGroup value={value} onValueChange={setValue}>
+ *   <Radio value="option1" aria-label="Option 1" />
+ *   <Radio value="option2" aria-label="Option 2" />
+ * </RadioGroup>
+ * ```
+ */
+
+/**
+ * Radio component
+ */
+declare const Radio: React$1.ForwardRefExoticComponent<RadioProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+/**
+ * RadioGroup Component Props
+ *
+ * Container component for Radio buttons with keyboard navigation and state management.
+ */
+interface RadioGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Controlled value
+     */
+    value?: string;
+    /**
+     * Default value for uncontrolled usage
+     */
+    defaultValue?: string;
+    /**
+     * Callback when value changes
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Name attribute for the radio group
+     */
+    name?: string;
+    /**
+     * Orientation of the radio group
+     * @default "vertical"
+     */
+    orientation?: "horizontal" | "vertical";
+    /**
+     * Size for all radios in the group
+     * Can be overridden by individual Radio components
+     */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+}
+
+/**
+ * RadioGroup Component
+ *
+ * Container component for Radio buttons with keyboard navigation and state management.
+ * Supports horizontal and vertical orientations, controlled/uncontrolled modes,
+ * and full keyboard accessibility with ArrowUp/ArrowDown navigation.
+ */
+
+/**
+ * RadioGroup - Container component that manages state and keyboard navigation
+ */
+declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Select Variants
+ *
+ * CVA-based variant system for Select component.
+ * Supports variants (primary, secondary, outline, ghost),
+ * sizes (xs, sm, md, lg), and states (open, closed, disabled).
+ * All styling uses token-based values with CSS variable references.
+ */
+/**
+ * Select Trigger Variants
+ * Button element that opens/closes the dropdown
+ */
+declare const selectTriggerVariants: (props?: ({
+    variant?: "primary" | "secondary" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    state?: "disabled" | "closed" | "open" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Select Listbox Variants
+ * Container for the dropdown options
+ */
+declare const selectListboxVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/**
+ * Select Option Variants
+ * Individual option item in the listbox
+ */
+declare const selectOptionVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+    state?: "disabled" | "default" | "selected" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+/**
+ * Select Variant Props
+ */
+type SelectVariant = VariantProps<typeof selectTriggerVariants>["variant"];
+type SelectSize = VariantProps<typeof selectTriggerVariants>["size"];
+/**
+ * Select Root Props
+ */
+interface SelectRootProps {
+    /**
+     * Current value (controlled mode)
+     */
+    value?: string;
+    /**
+     * Default value (uncontrolled mode)
+     */
+    defaultValue?: string;
+    /**
+     * Callback when value changes
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Whether the select is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether the select is open (controlled mode)
+     */
+    open?: boolean;
+    /**
+     * Callback when open state changes
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Default open state (uncontrolled mode)
+     */
+    defaultOpen?: boolean;
+    /**
+     * Variant style (applies to trigger)
+     */
+    variant?: SelectVariant;
+    /**
+     * Size (applies to trigger, listbox, and options)
+     */
+    size?: SelectSize;
+    /**
+     * Children
+     */
+    children: React.ReactNode;
+}
+/**
+ * Select Trigger Props
+ */
+interface SelectTriggerProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Variant style
+     */
+    variant?: SelectVariant;
+    /**
+     * Size
+     */
+    size?: SelectSize;
+    /**
+     * Placeholder text when no value is selected
+     */
+    placeholder?: string;
+}
+/**
+ * Select Listbox Props
+ */
+interface SelectListboxProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Size (should match trigger size)
+     */
+    size?: SelectSize;
+}
+/**
+ * Select Option Props
+ */
+interface SelectOptionProps extends React.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Option value
+     */
+    value: string;
+    /**
+     * Option label
+     */
+    label?: string;
+    /**
+     * Whether the option is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Size (should match trigger size)
+     */
+    size?: SelectSize;
+}
+
+/**
+ * Select Root Component
+ * Manages state and provides context for all Select sub-components
+ */
+declare function SelectRoot({ value: controlledValue, defaultValue, onValueChange, disabled, open: controlledOpen, onOpenChange, defaultOpen, children, variant, size, }: SelectRootProps & {
+    variant?: SelectRootProps["variant"];
+    size?: SelectRootProps["size"];
+}): react_jsx_runtime.JSX.Element;
+declare namespace SelectRoot {
+    var displayName: string;
+}
+/**
+ * Select Trigger Component
+ * Button that opens/closes the dropdown and displays the selected value
+ */
+declare const SelectTrigger: React$1.ForwardRefExoticComponent<SelectTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+/**
+ * Select Listbox Component
+ * Container for options with keyboard navigation
+ */
+declare const SelectListbox: React$1.ForwardRefExoticComponent<SelectListboxProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Select Option Component
+ * Individual option in the listbox
+ */
+declare const SelectOption: React$1.ForwardRefExoticComponent<SelectOptionProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Select Component (Compound)
+ * Main export that combines all sub-components
+ */
+declare const Select: {
+    Root: typeof SelectRoot;
+    Trigger: React$1.ForwardRefExoticComponent<SelectTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+    Listbox: React$1.ForwardRefExoticComponent<SelectListboxProps & React$1.RefAttributes<HTMLDivElement>>;
+    Option: React$1.ForwardRefExoticComponent<SelectOptionProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Textarea Variants
+ *
+ * CVA-based variant system for Textarea component.
+ * Supports variants (primary, secondary, outline, ghost, destructive),
+ * sizes (xs, sm, md, lg, xl), and states (default, disabled, error, success).
+ * All styling uses token-based values with CSS variable references.
+ */
+declare const textareaVariants: (props?: ({
+    variant?: "primary" | "secondary" | "destructive" | "outline" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | "xl" | "xs" | null | undefined;
+    state?: "disabled" | "default" | "success" | "error" | null | undefined;
+    fullWidth?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+
+/**
+ * Textarea Component Props
+ *
+ * Extends native textarea HTML attributes with variant props, character counter, and accessibility props.
+ */
+interface TextareaProps extends React$1.TextareaHTMLAttributes<HTMLTextAreaElement>, VariantProps<typeof textareaVariants> {
+    /**
+     * Textarea variant style
+     * @default "outline"
+     */
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "destructive";
+    /**
+     * Textarea size
+     * @default "md"
+     */
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    /**
+     * Textarea state
+     * @default "default"
+     */
+    state?: "default" | "disabled" | "error" | "success";
+    /**
+     * Whether textarea should take full width
+     * @default true
+     */
+    fullWidth?: boolean;
+    /**
+     * Maximum character length (for character counter)
+     */
+    maxLength?: number;
+    /**
+     * Show character counter
+     * Only displays when both showCharacterCount and maxLength are provided
+     * @default false
+     */
+    showCharacterCount?: boolean;
+}
+
+/**
+ * Textarea Component
+ *
+ * A fully accessible, theme-aware textarea component with variant support,
+ * character counter, and comprehensive state management.
+ *
+ * @example
+ * ```tsx
+ * <Textarea
+ *   variant="outline"
+ *   size="md"
+ *   placeholder="Enter text..."
+ *   showCharacterCount
+ *   maxLength={200}
+ * />
+ * ```
+ */
+declare const Textarea: React$1.ForwardRefExoticComponent<TextareaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
+
+declare const labelVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+interface LabelProps extends React$1.ComponentPropsWithoutRef<typeof LabelPrimitive.Root>, VariantProps<typeof labelVariants> {
+    /**
+     * Whether the field is required (shows asterisk)
+     */
+    required?: boolean;
+}
+declare const Label: React$1.ForwardRefExoticComponent<LabelProps & React$1.RefAttributes<HTMLLabelElement>>;
+
+/**
+ * Field Container Component
+ * Provides spacing between field elements using Stack
+ */
+interface FieldProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const Field: React$1.ForwardRefExoticComponent<FieldProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Field Label Component
+ * Wraps Label component with proper styling
+ */
+interface FieldLabelProps extends React$1.ComponentProps<typeof Label> {
+}
+declare const FieldLabel: React$1.ForwardRefExoticComponent<Omit<FieldLabelProps, "ref"> & React$1.RefAttributes<HTMLLabelElement>>;
+/**
+ * Field Control Component
+ * Wrapper for input/textarea/select controls
+ */
+interface FieldControlProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const FieldControl: React$1.ForwardRefExoticComponent<FieldControlProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Field Description Component
+ * Helper text displayed below the control
+ */
+interface FieldDescriptionProps extends React$1.ComponentProps<typeof Text> {
+}
+declare const FieldDescription: React$1.ForwardRefExoticComponent<Omit<FieldDescriptionProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
+/**
+ * Field Error Component
+ * Error message displayed below the control
+ */
+interface FieldErrorProps extends React$1.ComponentProps<typeof Text> {
+}
+declare const FieldError: React$1.ForwardRefExoticComponent<Omit<FieldErrorProps, "ref"> & React$1.RefAttributes<HTMLSpanElement>>;
+declare const FieldRoot: typeof Field & {
+    Label: typeof FieldLabel;
+    Control: typeof FieldControl;
+    Description: typeof FieldDescription;
+    Error: typeof FieldError;
+};
+
+/**
+ * Responsive value type - can be a single value or an object with breakpoint keys
+ */
+type ResponsiveValue<T> = T | {
+    base?: T;
+    sm?: T;
+    md?: T;
+    lg?: T;
+    xl?: T;
+    "2xl"?: T;
+};
+
+/**
+ * Spacing token values
+ * Supports numeric keys (0-96) and semantic keys (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+ */
+type SpacingValue = number | keyof typeof spacing | keyof typeof semanticSpacing;
+/**
+ * Border radius token values
+ */
+type RadiusValue = keyof typeof borderRadius;
+/**
+ * Color token values
+ * Supports CSS variable names (e.g., "background", "primary", "card")
+ */
+type ColorValue = "background" | "foreground" | "card" | "card-foreground" | "popover" | "popover-foreground" | "primary" | "primary-foreground" | "secondary" | "secondary-foreground" | "muted" | "muted-foreground" | "accent" | "accent-foreground" | "destructive" | "destructive-foreground" | "border" | "input" | "ring" | string;
+/**
+ * Alignment values for flexbox/grid
+ */
+type AlignmentValue = "start" | "end" | "center" | "baseline" | "stretch";
+/**
+ * Justify content values for flexbox/grid
+ */
+type JustifyValue = "start" | "end" | "center" | "between" | "around" | "evenly";
+/**
+ * Flex direction values
+ */
+type FlexDirectionValue = "row" | "column" | "row-reverse" | "column-reverse";
+/**
+ * Flex wrap values
+ */
+type FlexWrapValue = "nowrap" | "wrap" | "wrap-reverse";
+/**
+ * Grid column values
+ */
+type ColumnValue = 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+/**
+ * Grid row values
+ */
+type RowValue = 1 | 2 | 3 | 4 | 5 | 6 | "none";
+/**
+ * Grid flow values
+ */
+type FlowValue = "row" | "col" | "dense" | "row-dense" | "col-dense";
+/**
+ * Shadow token values (elevation shadows)
+ */
+type ShadowValue = "none" | "xs" | "sm" | "md" | "lg" | "xl" | "2xl";
+/**
+ * Display type values
+ */
+type DisplayValue = "block" | "inline" | "inline-block" | "flex" | "grid" | "inline-flex" | "inline-grid" | "none";
+/**
+ * Responsive spacing prop type
+ */
+type ResponsiveSpacing = ResponsiveValue<SpacingValue>;
+/**
+ * Responsive radius prop type
+ */
+type ResponsiveRadius = ResponsiveValue<RadiusValue>;
+/**
+ * Responsive color prop type
+ */
+type ResponsiveColor = ResponsiveValue<ColorValue>;
+/**
+ * Responsive alignment prop type
+ */
+type ResponsiveAlignment = ResponsiveValue<AlignmentValue>;
+/**
+ * Responsive justify prop type
+ */
+type ResponsiveJustify = ResponsiveValue<JustifyValue>;
+/**
+ * Responsive direction prop type
+ */
+type ResponsiveFlexDirection = ResponsiveValue<FlexDirectionValue>;
+/**
+ * Responsive wrap prop type
+ */
+type ResponsiveFlexWrap = ResponsiveValue<FlexWrapValue>;
+/**
+ * Responsive column prop type
+ */
+type ResponsiveColumns = ResponsiveValue<ColumnValue>;
+/**
+ * Responsive row prop type
+ */
+type ResponsiveRows = ResponsiveValue<RowValue>;
+/**
+ * Responsive flow prop type
+ */
+type ResponsiveFlow = ResponsiveValue<FlowValue>;
+/**
+ * Surface variant values
+ */
+type SurfaceVariant = "flat" | "raised" | "sunken";
+
+/**
+ * Box Primitive Component
+ *
+ * Token-driven base container component with support for padding, margin,
+ * display, flex, grid, radius, and shadow. All styling uses token-based
+ * Tailwind classes only (no raw numeric values).
+ */
+
+/**
+ * Box component props
+ */
+interface BoxProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Render as different HTML element
+     */
+    as?: keyof React$1.JSX.IntrinsicElements;
+    /**
+     * Padding (all sides) - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+     */
+    p?: ResponsiveSpacing;
+    /**
+     * Padding horizontal (left + right)
+     */
+    px?: ResponsiveSpacing;
+    /**
+     * Padding vertical (top + bottom)
+     */
+    py?: ResponsiveSpacing;
+    /**
+     * Padding top
+     */
+    pt?: ResponsiveSpacing;
+    /**
+     * Padding right
+     */
+    pr?: ResponsiveSpacing;
+    /**
+     * Padding bottom
+     */
+    pb?: ResponsiveSpacing;
+    /**
+     * Padding left
+     */
+    pl?: ResponsiveSpacing;
+    /**
+     * Margin (all sides) - token-based
+     */
+    m?: ResponsiveSpacing;
+    /**
+     * Margin horizontal (left + right)
+     */
+    mx?: ResponsiveSpacing;
+    /**
+     * Margin vertical (top + bottom)
+     */
+    my?: ResponsiveSpacing;
+    /**
+     * Margin top
+     */
+    mt?: ResponsiveSpacing;
+    /**
+     * Margin right
+     */
+    mr?: ResponsiveSpacing;
+    /**
+     * Margin bottom
+     */
+    mb?: ResponsiveSpacing;
+    /**
+     * Margin left
+     */
+    ml?: ResponsiveSpacing;
+    /**
+     * Display type
+     */
+    display?: DisplayValue;
+    /**
+     * Flex direction (when display is flex)
+     */
+    flexDirection?: FlexDirectionValue;
+    /**
+     * Border radius - token-based (none, xs, sm, md, lg, xl, 2xl, 3xl, full)
+     */
+    radius?: ResponsiveRadius;
+    /**
+     * Shadow - token-based (none, xs, sm, md, lg, xl, 2xl)
+     */
+    shadow?: ShadowValue;
+    /**
+     * Background color - token-based
+     */
+    bg?: ResponsiveColor;
+    /**
+     * Gap (for flex/grid layouts) - token-based
+     */
+    gap?: ResponsiveSpacing;
+    /**
+     * Align items (for flex/grid layouts)
+     */
+    align?: "start" | "end" | "center" | "baseline" | "stretch";
+    /**
+     * Justify content (for flex/grid layouts)
+     */
+    justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
+}
+/**
+ * Box component
+ */
+declare const Box: React$1.ForwardRefExoticComponent<BoxProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Stack Primitive Component
+ *
+ * Token-driven vertical layout component (flex column). Uses Box internally
+ * with flex display and column direction. All spacing uses token-based values.
+ */
+
+interface StackProps extends Omit<BoxProps, "display" | "flexDirection" | "gap"> {
+    /**
+     * Stack direction - vertical (column) or horizontal (row)
+     */
+    direction?: "vertical" | "horizontal";
+    /**
+     * Spacing between stack items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+     * Alias for gap prop
+     */
+    spacing?: ResponsiveSpacing;
+    /**
+     * Gap between stack items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+     * Alias for spacing prop
+     */
+    gap?: ResponsiveSpacing;
+    /**
+     * Align items
+     */
+    align?: "start" | "end" | "center" | "baseline" | "stretch";
+    /**
+     * Justify content
+     */
+    justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
+}
+/**
+ * Stack component - vertical layout using flex column by default
+ */
+declare const Stack: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Column component - alias for Stack (semantic name)
+ */
+declare const Column: React$1.ForwardRefExoticComponent<StackProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Container Layout Primitive Component
+ *
+ * Token-driven container component for constraining content width and centering.
+ * Uses CSS-layer class .tm-container with token-based padding and max-width.
+ */
+
+interface ContainerProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Maximum width of the container
+     * Supports: spacing tokens, container sizes (sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl, 6xl, 7xl, full), or CSS values
+     */
+    maxWidth?: string | ResponsiveSpacing;
+    /**
+     * Padding (horizontal) - token-based
+     * Supports: spacing tokens or container spacing tokens (container-xs, container-sm, container-md, etc.)
+     * Default: container-md (24px)
+     */
+    padding?: ResponsiveSpacing;
+    /**
+     * Center the container horizontally with auto margins
+     * Default: true
+     */
+    center?: boolean;
+}
+/**
+ * Container component - layout primitive for constraining content width
+ */
+declare const Container: React$1.ForwardRefExoticComponent<ContainerProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Flex Primitive Component
+ *
+ * Token-driven flexbox container with full control over direction, wrap,
+ * grow, shrink, basis, alignment, and spacing. Uses Box internally.
+ * All spacing values use tokens only.
+ */
+
+interface FlexProps extends Omit<BoxProps, "display" | "flexDirection" | "align" | "justify"> {
+    /**
+     * Flex direction
+     */
+    direction?: ResponsiveFlexDirection;
+    /**
+     * Flex wrap
+     */
+    wrap?: ResponsiveFlexWrap;
+    /**
+     * Flex grow (0 or 1, or use Tailwind flex-grow-*)
+     */
+    grow?: 0 | 1 | boolean;
+    /**
+     * Flex shrink (0 or 1, or use Tailwind flex-shrink-*)
+     */
+    shrink?: 0 | 1 | boolean;
+    /**
+     * Flex basis (CSS value or Tailwind class)
+     * Note: For token-based approach, use spacing tokens via className
+     */
+    basis?: string;
+    /**
+     * Align items
+     */
+    align?: ResponsiveAlignment;
+    /**
+     * Justify content
+     */
+    justify?: ResponsiveJustify;
+    /**
+     * Gap between flex items - token-based
+     */
+    gap?: ResponsiveSpacing;
+}
+/**
+ * Flex component
+ */
+declare const Flex: React$1.ForwardRefExoticComponent<FlexProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Grid Primitive Component
+ *
+ * Token-driven CSS Grid container with support for columns, rows, gap,
+ * flow, and alignment. Uses Box internally. All spacing values use tokens only.
+ */
+
+interface GridProps extends Omit<BoxProps, "display" | "align" | "justify"> {
+    /**
+     * Number of columns (1-6, 12, or none)
+     */
+    cols?: ResponsiveColumns;
+    /**
+     * Number of columns at sm breakpoint
+     */
+    sm?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+    /**
+     * Number of columns at md breakpoint
+     */
+    md?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+    /**
+     * Number of columns at lg breakpoint
+     */
+    lg?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+    /**
+     * Number of columns at xl breakpoint
+     */
+    xl?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+    /**
+     * Number of columns at 2xl breakpoint
+     */
+    "2xl"?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "none";
+    /**
+     * Number of rows (1-6 or none)
+     */
+    rows?: ResponsiveRows;
+    /**
+     * Gap between grid items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+     */
+    gap?: ResponsiveSpacing;
+    /**
+     * Grid flow direction
+     */
+    flow?: ResponsiveFlow;
+    /**
+     * Align items
+     */
+    align?: ResponsiveAlignment;
+    /**
+     * Justify content
+     */
+    justify?: ResponsiveJustify;
+}
+/**
+ * Grid component
+ */
+declare const Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Row Primitive Component
+ *
+ * Token-driven horizontal layout component (flex row). Uses Box internally
+ * with flex display and row direction. All spacing uses token-based values.
+ */
+
+interface RowProps extends Omit<BoxProps, "display" | "flexDirection"> {
+    /**
+     * Gap between row items - token-based (xs, sm, md, lg, xl, 2xl, 3xl, 4xl, 5xl)
+     */
+    gap?: ResponsiveSpacing;
+    /**
+     * Align items
+     */
+    align?: "start" | "end" | "center" | "baseline" | "stretch";
+    /**
+     * Justify content
+     */
+    justify?: "start" | "end" | "center" | "between" | "around" | "evenly";
+}
+/**
+ * Row component - horizontal layout using flex row
+ */
+declare const Row: React$1.ForwardRefExoticComponent<RowProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const surfaceVariants$1: (props?: ({
+    variant?: "flat" | "raised" | "sunken" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SurfaceProps$1 extends Omit<BoxProps, "bg" | "shadow"> {
+    /**
+     * Surface variant
+     */
+    variant?: SurfaceVariant;
+    /**
+     * Border radius - token-based
+     */
+    radius?: BoxProps["radius"];
+}
+/**
+ * Surface component - elevation variant component
+ */
+declare const Surface$1: React$1.ForwardRefExoticComponent<SurfaceProps$1 & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Card Container Component
+ *
+ * Token-driven card component with Header, Body, and Footer subcomponents.
+ * Uses SURFACE_TOKENS + CARD_TOKENS for styling.
+ * All styling uses tokens exclusively (no raw CSS values).
+ */
+
+interface CardProps extends Omit<BoxProps, "radius" | "shadow" | "p"> {
+    /**
+     * Card size - maps to CARD_TOKENS.size
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Border radius - token-based (overrides size default)
+     */
+    radius?: ResponsiveRadius;
+    /**
+     * Shadow - token-based (overrides size default)
+     */
+    shadow?: ShadowValue;
+    /**
+     * Padding - token-based (overrides size default)
+     */
+    p?: ResponsiveSpacing;
+}
+/**
+ * Card component - main container
+ */
+declare const Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * CardHeader component - uses Stack for vertical spacing
+ */
+interface CardHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Card size - determines padding from CARD_TOKENS
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Padding - token-based (overrides size default)
+     */
+    p?: ResponsiveSpacing;
+}
+declare const CardHeader: React$1.ForwardRefExoticComponent<CardHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * CardBody component - main content area
+ */
+interface CardBodyProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Card size - determines padding from CARD_TOKENS
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Padding - token-based (overrides size default)
+     */
+    p?: ResponsiveSpacing;
+}
+declare const CardBody: React$1.ForwardRefExoticComponent<CardBodyProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * CardFooter component - uses Row for horizontal layout
+ */
+interface CardFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Card size - determines padding from CARD_TOKENS
+     */
+    size?: "sm" | "md" | "lg";
+    /**
+     * Padding - token-based (overrides size default)
+     */
+    p?: ResponsiveSpacing;
+}
+declare const CardFooter: React$1.ForwardRefExoticComponent<CardFooterProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Section Container Component
+ *
+ * Token-driven section component for page/landing layout composition.
+ * Uses SECTION_TOKENS for padding and spacing.
+ * Uses Stack internally for content block composition.
+ * All styling uses tokens exclusively (no raw CSS values).
+ */
+
+interface SectionProps extends Omit<StackProps, "py" | "gap"> {
+    /**
+     * Vertical padding - token-based (sm, md, lg, xl)
+     * Maps to SECTION_TOKENS.padding
+     */
+    padding?: "sm" | "md" | "lg" | "xl";
+    /**
+     * Gap spacing for content blocks - token-based (sm, md, lg, xl)
+     * Maps to SECTION_TOKENS.spacing
+     */
+    gap?: "sm" | "md" | "lg" | "xl";
+    /**
+     * Render as different HTML element
+     */
+    as?: keyof React$1.JSX.IntrinsicElements;
+}
+/**
+ * Section component - page/landing layout container
+ */
+declare const Section: React$1.ForwardRefExoticComponent<SectionProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const surfaceVariants: (props?: ({
+    variant?: "outline" | "flat" | "raised" | "sunken" | "subtle" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SurfaceProps extends Omit<BoxProps, "bg" | "shadow" | "radius" | "p">, VariantProps<typeof surfaceVariants> {
+    /**
+     * Surface variant
+     */
+    variant?: "flat" | "raised" | "sunken" | "outline" | "subtle";
+    /**
+     * Padding - token-based (sm, md, lg, xl)
+     * Overrides default variant padding
+     */
+    p?: ResponsiveSpacing;
+    /**
+     * Border radius - token-based (sm, md, lg, xl, 2xl, 3xl, full)
+     * Overrides default variant radius
+     */
+    radius?: ResponsiveRadius;
+}
+/**
+ * Surface component - elevation variant container
+ */
+declare const Surface: React$1.ForwardRefExoticComponent<SurfaceProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Portal Component
+ *
+ * SSR-safe portal component for rendering children outside the DOM hierarchy.
+ * Mounts to document.body by default, with optional custom container support.
+ */
+
+interface PortalProps {
+    /**
+     * Children to portal
+     */
+    children: React$1.ReactNode;
+    /**
+     * Container element to portal into (defaults to document.body)
+     */
+    container?: Element | null;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+    /**
+     * Additional inline styles
+     */
+    style?: React$1.CSSProperties;
+}
+/**
+ * Portal component - SSR-safe portal rendering
+ */
+declare const Portal: React$1.ForwardRefExoticComponent<PortalProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const backdropVariants: (props?: ({
+    variant?: "default" | "transparent" | "blurred" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface BackdropProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof backdropVariants> {
+    /**
+     * Backdrop variant
+     */
+    variant?: "default" | "blurred" | "transparent";
+    /**
+     * Whether backdrop is visible (for animation)
+     */
+    isVisible?: boolean;
+    /**
+     * Click handler for backdrop dismiss
+     */
+    onClick?: (event: React$1.MouseEvent<HTMLDivElement>) => void;
+}
+/**
+ * Backdrop component - overlay background
+ */
+declare const Backdrop: React$1.ForwardRefExoticComponent<BackdropProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const modalVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "fullscreen" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ModalProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onClick" | "role" | "aria-modal" | "aria-labelledby" | "aria-describedby">, VariantProps<typeof modalVariants> {
+    /**
+     * Whether modal is open
+     */
+    open: boolean;
+    /**
+     * Callback when modal should close
+     */
+    onClose: () => void;
+    /**
+     * Modal size variant
+     */
+    size?: "sm" | "md" | "lg" | "fullscreen";
+    /**
+     * Backdrop variant
+     */
+    backdropVariant?: "default" | "blurred" | "transparent";
+    /**
+     * Whether to close on backdrop click
+     */
+    closeOnBackdropClick?: boolean;
+    /**
+     * Whether to close on escape key
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Element to return focus to when modal closes
+     */
+    returnFocusRef?: React$1.RefObject<HTMLElement>;
+}
+/**
+ * Modal Header - Header section with spacing
+ */
+interface ModalHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const ModalHeader: React$1.ForwardRefExoticComponent<ModalHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Modal Body - Main content area
+ */
+interface ModalBodyProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const ModalBody: React$1.ForwardRefExoticComponent<ModalBodyProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Modal Footer - Footer section with layout
+ */
+interface ModalFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const ModalFooter: React$1.ForwardRefExoticComponent<ModalFooterProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const Modal: React$1.ForwardRefExoticComponent<ModalProps & React$1.RefAttributes<HTMLDivElement>> & {
+    Content: React$1.ForwardRefExoticComponent<ModalProps & React$1.RefAttributes<HTMLDivElement>>;
+    Header: React$1.ForwardRefExoticComponent<ModalHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+    Body: React$1.ForwardRefExoticComponent<ModalBodyProps & React$1.RefAttributes<HTMLDivElement>>;
+    Footer: React$1.ForwardRefExoticComponent<ModalFooterProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Dialog Component
+ *
+ * Semantic modal wrapper built on Modal component.
+ * Provides Dialog.Header, Dialog.Title, Dialog.Description, Dialog.Body, Dialog.Footer subcomponents.
+ * Full A11y compliance with aria-labelledby and aria-describedby.
+ */
+
+interface DialogProps extends Omit<ModalProps, "role" | "aria-modal"> {
+    /**
+     * ID for the dialog title (for aria-labelledby)
+     */
+    titleId?: string;
+    /**
+     * ID for the dialog description (for aria-describedby)
+     */
+    descriptionId?: string;
+}
+/**
+ * Dialog Root - Main dialog wrapper
+ */
+declare const DialogRoot: React$1.ForwardRefExoticComponent<DialogProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Dialog Header - Header section with spacing
+ */
+interface DialogHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    titleId?: string;
+    descriptionId?: string;
+}
+declare const DialogHeader: React$1.ForwardRefExoticComponent<DialogHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Dialog Title - h2 with aria-labelledby
+ */
+interface DialogTitleProps extends React$1.HTMLAttributes<HTMLHeadingElement> {
+    titleId?: string;
+}
+declare const DialogTitle: React$1.ForwardRefExoticComponent<DialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
+/**
+ * Dialog Description - p with aria-describedby
+ */
+interface DialogDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+    descriptionId?: string;
+}
+declare const DialogDescription: React$1.ForwardRefExoticComponent<DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Dialog Body - Main content area
+ */
+interface DialogBodyProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const DialogBody: React$1.ForwardRefExoticComponent<DialogBodyProps & React$1.RefAttributes<HTMLDivElement>>;
+/**
+ * Dialog Footer - Footer section with Row layout
+ */
+interface DialogFooterProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+declare const DialogFooter: React$1.ForwardRefExoticComponent<DialogFooterProps & React$1.RefAttributes<HTMLDivElement>>;
+declare const Dialog: React$1.ForwardRefExoticComponent<DialogProps & React$1.RefAttributes<HTMLDivElement>> & {
+    Root: React$1.ForwardRefExoticComponent<DialogProps & React$1.RefAttributes<HTMLDivElement>>;
+    Header: React$1.ForwardRefExoticComponent<DialogHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+    Title: React$1.ForwardRefExoticComponent<DialogTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
+    Description: React$1.ForwardRefExoticComponent<DialogDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+    Body: React$1.ForwardRefExoticComponent<DialogBodyProps & React$1.RefAttributes<HTMLDivElement>>;
+    Footer: React$1.ForwardRefExoticComponent<DialogFooterProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+declare const toastVariants: (props?: ({
+    variant?: "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface ToastAction {
+    label: string;
+    onClick: () => void;
+}
+interface ToastData {
+    id: string;
+    title?: string;
+    description?: string;
+    variant?: "default" | "success" | "info" | "warning" | "danger";
+    action?: ToastAction;
+    duration?: number;
+}
+interface ToastProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof toastVariants> {
+    /**
+     * Toast data
+     */
+    toast: ToastData;
+    /**
+     * Callback when toast is dismissed
+     */
+    onDismiss: (id: string) => void;
+    /**
+     * Whether toast is visible (for animation)
+     */
+    isVisible?: boolean;
+}
+/**
+ * Toast component - notification toast
+ */
+declare const Toast: React$1.ForwardRefExoticComponent<ToastProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * ToastViewport Component
+ *
+ * Fixed positioning container for toast notifications.
+ * Supports position variants (top-right, bottom-left, etc.).
+ * Uses Portal for rendering outside DOM hierarchy.
+ */
+
+type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+interface ToastViewportProps {
+    /**
+     * Position of toast viewport
+     */
+    position?: ToastPosition;
+    /**
+     * Children to render in viewport
+     */
+    children: React$1.ReactNode;
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+}
+/**
+ * ToastViewport component - container for toast notifications
+ */
+declare const ToastViewport: React$1.ForwardRefExoticComponent<ToastViewportProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface ToastOptions {
+    title?: string;
+    description?: string;
+    variant?: "default" | "success" | "info" | "warning" | "danger";
+    action?: ToastAction;
+    duration?: number;
+}
+interface ToastContextType {
+    toast: (options: ToastOptions) => string;
+    dismiss: (id: string) => void;
+    dismissAll: () => void;
+    updateToast: (id: string, updates: Partial<ToastData>) => void;
+    getQueue: () => ToastData[];
+    getGrouped: () => Record<string, ToastData[]>;
+}
+type GroupByFunction$1 = (toast: ToastData) => string;
+interface ToastProviderProps {
+    /**
+     * Children to render
+     */
+    children: React$1.ReactNode;
+    /**
+     * Position of toast viewport
+     */
+    position?: ToastPosition;
+    /**
+     * Maximum number of toasts to show (default: 5)
+     */
+    maxToasts?: number;
+    /**
+     * Maximum number of visible toasts (default: 3)
+     * Overflow notifications are queued
+     */
+    maxVisible?: number;
+    /**
+     * Function to group toasts (by date, type, or custom)
+     */
+    groupBy?: GroupByFunction$1;
+}
+/**
+ * ToastProvider component - context provider for toast notifications
+ */
+declare function ToastProvider({ children, position, maxVisible, groupBy, }: ToastProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to use toast context
+ */
+declare function useToast(): ToastContextType;
+
+/**
+ * NotificationCenter.DismissAll Component
+ *
+ * Button component to clear all notifications.
+ * Located in Panel header.
+ */
+
+interface NotificationCenterDismissAllProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Show confirmation before clearing
+     */
+    confirm?: boolean;
+    /**
+     * Confirmation message
+     */
+    confirmMessage?: string;
+}
+/**
+ * NotificationCenter.DismissAll component - clear all notifications button
+ */
+declare const NotificationCenterDismissAll: React$1.ForwardRefExoticComponent<NotificationCenterDismissAllProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+interface NotificationCenterGroupHeaderProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Group label text
+     */
+    label: string;
+    /**
+     * Whether the group is collapsed
+     */
+    collapsed?: boolean;
+    /**
+     * Callback when collapse/expand is toggled
+     */
+    onToggleCollapse?: () => void;
+    /**
+     * Show collapse/expand button
+     */
+    collapsible?: boolean;
+}
+/**
+ * NotificationCenter.GroupHeader component - group section header
+ */
+declare const NotificationCenterGroupHeader: React$1.ForwardRefExoticComponent<NotificationCenterGroupHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Notification Center Types
+ *
+ * Type definitions for Notification Center components.
+ */
+
+/**
+ * Notification channel types
+ */
+type NotificationChannel = "success" | "error" | "info" | "warning" | "system" | "log";
+/**
+ * Notification variant (extends toast variants)
+ */
+type NotificationVariant = "default" | "success" | "info" | "warning" | "danger" | "system" | "log";
+/**
+ * Notification data structure
+ */
+interface NotificationData {
+    id: string;
+    title?: string;
+    description?: string;
+    variant?: NotificationVariant;
+    channel?: NotificationChannel;
+    action?: ToastAction;
+    duration?: number;
+    persistent?: boolean;
+    timestamp: number;
+    read?: boolean;
+}
+/**
+ * Notification options for creating notifications
+ */
+interface NotificationOptions {
+    title?: string;
+    description?: string;
+    variant?: NotificationVariant;
+    channel?: NotificationChannel;
+    action?: ToastAction;
+    duration?: number;
+    persistent?: boolean;
+}
+/**
+ * Group by function type
+ */
+type GroupByFunction = (notification: NotificationData) => string;
+/**
+ * Notification context type
+ */
+interface NotificationContextType {
+    /**
+     * Push a new notification
+     */
+    push: (notification: NotificationOptions) => string;
+    /**
+     * Remove a specific notification by ID
+     */
+    remove: (id: string) => void;
+    /**
+     * Clear all notifications
+     */
+    clearAll: () => void;
+    /**
+     * Clear notifications by channel
+     */
+    clearChannel: (channel: NotificationChannel) => void;
+    /**
+     * Group notifications by function
+     */
+    groupBy: (fn: GroupByFunction) => Record<string, NotificationData[]>;
+    /**
+     * Get persistent history
+     */
+    getHistory: () => NotificationData[];
+    /**
+     * Get notifications by channel
+     */
+    getByChannel: (channel: NotificationChannel) => NotificationData[];
+    /**
+     * Get all notifications
+     */
+    getAll: () => NotificationData[];
+    /**
+     * Mark notification as read
+     */
+    markAsRead: (id: string) => void;
+    /**
+     * Mark all as read
+     */
+    markAllAsRead: () => void;
+    /**
+     * Get unread count
+     */
+    getUnreadCount: () => number;
+}
+
+interface NotificationCenterItemProps extends Omit<React$1.HTMLAttributes<HTMLLIElement>, "onClick"> {
+    /**
+     * Notification data
+     */
+    notification: NotificationData;
+    /**
+     * Callback when notification is dismissed
+     */
+    onDismiss?: (id: string) => void;
+    /**
+     * Callback when notification is clicked
+     */
+    onClick?: (id: string) => void;
+    /**
+     * Show expandable details
+     */
+    expandable?: boolean;
+}
+/**
+ * NotificationCenter.Item component - individual notification item
+ */
+declare const NotificationCenterItem: React$1.ForwardRefExoticComponent<NotificationCenterItemProps & React$1.RefAttributes<HTMLLIElement>>;
+
+/**
+ * NotificationCenter.List Component
+ *
+ * Vertical list container for notifications.
+ * Uses Stack component with token-based spacing.
+ * Provides proper ARIA roles for accessibility.
+ */
+
+interface NotificationCenterListProps extends React$1.HTMLAttributes<HTMLUListElement> {
+    /**
+     * Children to render (notification items)
+     */
+    children: React$1.ReactNode;
+    /**
+     * ARIA label for the list
+     */
+    "aria-label"?: string;
+}
+/**
+ * NotificationCenter.List component - vertical list container
+ */
+declare const NotificationCenterList: React$1.ForwardRefExoticComponent<NotificationCenterListProps & React$1.RefAttributes<HTMLUListElement>>;
+
+interface NotificationCenterTriggerProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Callback when trigger is clicked
+     */
+    onClick?: () => void;
+    /**
+     * Show unread badge
+     */
+    showBadge?: boolean;
+}
+/**
+ * NotificationCenter.Trigger component - open panel button
+ */
+declare const NotificationCenterTrigger: React$1.ForwardRefExoticComponent<NotificationCenterTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+
+interface NotificationCenterPanelProps {
+    /**
+     * Whether panel is open
+     */
+    isOpen: boolean;
+    /**
+     * Callback when panel should close
+     */
+    onClose: () => void;
+    /**
+     * Function to group notifications (by date, type, or custom)
+     */
+    groupBy?: GroupByFunction;
+    /**
+     * Panel width variant
+     */
+    width?: "sm" | "md" | "lg";
+    /**
+     * Auto-collapse older notifications
+     */
+    autoCollapse?: boolean;
+    /**
+     * Element to return focus to when panel closes
+     */
+    returnFocusRef?: React$1.RefObject<HTMLElement>;
+}
+/**
+ * NotificationCenter.Panel component - side drawer notification panel
+ */
+declare const NotificationCenterPanel: React$1.ForwardRefExoticComponent<NotificationCenterPanelProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface NotificationCenterProviderProps {
+    /**
+     * Children to render
+     */
+    children: React$1.ReactNode;
+    /**
+     * Maximum number of notifications to keep in history
+     */
+    maxHistory?: number;
+    /**
+     * Enable persistent history (in-memory, can be extended to localStorage)
+     */
+    persistent?: boolean;
+}
+/**
+ * NotificationCenter.Provider component - global notification state management
+ */
+declare function NotificationCenterProvider({ children, maxHistory, persistent, }: NotificationCenterProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to use notification center context
+ */
+declare function useNotificationCenterContext(): NotificationContextType;
+
+interface NotificationAPI {
+    /**
+     * Show success notification
+     */
+    success: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Show error notification
+     */
+    error: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Show info notification
+     */
+    info: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Show warning notification
+     */
+    warning: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Show system notification
+     */
+    system: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Show log notification
+     */
+    log: (message: string, options?: Omit<NotificationOptions, "variant" | "channel">) => string;
+    /**
+     * Push custom notification
+     */
+    push: (options: NotificationOptions) => string;
+    /**
+     * Remove notification by ID
+     */
+    remove: (id: string) => void;
+    /**
+     * Clear all notifications
+     */
+    clearAll: () => void;
+    /**
+     * Clear notifications by channel
+     */
+    clearChannel: (channel: "success" | "error" | "info" | "warning" | "system" | "log") => void;
+}
+/**
+ * useNotificationCenter hook - multi-channel notification API
+ */
+declare function useNotificationCenter(): NotificationAPI;
+
+/**
+ * NotificationCenter compound component
+ */
+declare const NotificationCenter: {
+    Provider: typeof NotificationCenterProvider;
+    Panel: React$1.ForwardRefExoticComponent<NotificationCenterPanelProps & React$1.RefAttributes<HTMLDivElement>>;
+    Trigger: React$1.ForwardRefExoticComponent<NotificationCenterTriggerProps & React$1.RefAttributes<HTMLButtonElement>>;
+    List: React$1.ForwardRefExoticComponent<NotificationCenterListProps & React$1.RefAttributes<HTMLUListElement>>;
+    Item: React$1.ForwardRefExoticComponent<NotificationCenterItemProps & React$1.RefAttributes<HTMLLIElement>>;
+    GroupHeader: React$1.ForwardRefExoticComponent<NotificationCenterGroupHeaderProps & React$1.RefAttributes<HTMLDivElement>>;
+    DismissAll: React$1.ForwardRefExoticComponent<NotificationCenterDismissAllProps & React$1.RefAttributes<HTMLButtonElement>>;
+};
+
+/**
+ * Popover Arrow Component
+ *
+ * Arrow indicator pointing to the trigger element.
+ * Uses POPOVER_TOKENS for sizing and positioning.
+ */
+
+interface PopoverArrowProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Arrow size
+     */
+    size?: "sm" | "md";
+}
+/**
+ * Popover Arrow component
+ */
+declare const PopoverArrow: React$1.ForwardRefExoticComponent<PopoverArrowProps & React$1.RefAttributes<HTMLDivElement>>;
+
+declare const popoverContentVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xs" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface PopoverContentProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onAnimationEnd">, VariantProps<typeof popoverContentVariants> {
+    /**
+     * Placement preference
+     */
+    placement?: Placement;
+    /**
+     * Offset between trigger and content (in pixels)
+     */
+    offset?: number;
+    /**
+     * Whether to close on outside click
+     */
+    closeOnInteractOutside?: boolean;
+}
+/**
+ * Popover Content component
+ */
+declare const PopoverContent: React$1.ForwardRefExoticComponent<PopoverContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface PopoverRootProps {
+    /**
+     * Whether the popover is open (controlled mode)
+     */
+    open?: boolean;
+    /**
+     * Callback when open state changes
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Default open state (uncontrolled mode)
+     */
+    defaultOpen?: boolean;
+    /**
+     * Whether the popover is modal (blocks interaction with other elements)
+     */
+    modal?: boolean;
+    /**
+     * Children
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * Popover Root component
+ */
+declare function PopoverRoot({ open: controlledOpen, onOpenChange, defaultOpen, children, }: PopoverRootProps): react_jsx_runtime.JSX.Element;
+declare namespace PopoverRoot {
+    var displayName: string;
+}
+
+/**
+ * Popover Trigger Component
+ *
+ * Trigger element that opens/closes the popover.
+ * Supports asChild pattern for composition.
+ */
+
+interface PopoverTriggerProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Render as child element (composition pattern)
+     */
+    asChild?: boolean;
+}
+/**
+ * Popover Trigger component
+ */
+declare const PopoverTrigger: React$1.ForwardRefExoticComponent<PopoverTriggerProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * DropdownMenu Item Component
+ *
+ * Menu item with keyboard navigation support (roving tabindex).
+ * Uses MENU_TOKENS for styling.
+ */
+
+interface DropdownMenuItemProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "onSelect"> {
+    /**
+     * Whether the item is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Whether the item is selected
+     */
+    selected?: boolean;
+    /**
+     * Callback when item is selected
+     * Receives native Event (not SyntheticEvent)
+     */
+    onSelect?: (event: Event) => void;
+    /**
+     * Whether item has inset padding (for nested items)
+     */
+    inset?: boolean;
+}
+/**
+ * DropdownMenu Item component
+ */
+declare const DropdownMenuItem: React$1.ForwardRefExoticComponent<DropdownMenuItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu CheckItem Component
+ *
+ * Menu item with checkbox indicator.
+ * Uses MENU_TOKENS for styling.
+ */
+
+interface DropdownMenuCheckItemProps extends Omit<DropdownMenuItemProps, "selected"> {
+    /**
+     * Whether the item is checked
+     */
+    checked?: boolean;
+}
+/**
+ * DropdownMenu CheckItem component
+ */
+declare const DropdownMenuCheckItem: React$1.ForwardRefExoticComponent<DropdownMenuCheckItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu Content Component
+ *
+ * Content container for dropdown menu.
+ * Wraps PopoverContent with menu-specific styling and role.
+ * Handles keyboard navigation (Arrow keys, Home/End, Escape).
+ */
+
+interface DropdownMenuContentProps extends PopoverContentProps {
+}
+/**
+ * DropdownMenu Content component
+ */
+declare const DropdownMenuContent: React$1.ForwardRefExoticComponent<DropdownMenuContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu Group Component
+ *
+ * Group container for related menu items.
+ */
+
+interface DropdownMenuGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * DropdownMenu Group component
+ */
+declare const DropdownMenuGroup: React$1.ForwardRefExoticComponent<DropdownMenuGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu Label Component
+ *
+ * Label/section header for menu items.
+ * Uses MENU_TOKENS for styling.
+ */
+
+interface DropdownMenuLabelProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Whether label has inset padding (for nested items)
+     */
+    inset?: boolean;
+}
+/**
+ * DropdownMenu Label component
+ */
+declare const DropdownMenuLabel: React$1.ForwardRefExoticComponent<DropdownMenuLabelProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu RadioGroup Component
+ *
+ * Radio group container for radio menu items.
+ */
+
+interface DropdownMenuRadioGroupProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Selected value
+     */
+    value?: string;
+    /**
+     * Callback when value changes
+     */
+    onValueChange?: (value: string) => void;
+}
+/**
+ * DropdownMenu RadioGroup component
+ */
+declare const DropdownMenuRadioGroup: React$1.ForwardRefExoticComponent<DropdownMenuRadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu RadioItem Component
+ *
+ * Menu item with radio indicator.
+ * Uses MENU_TOKENS for styling.
+ */
+
+interface DropdownMenuRadioItemProps extends Omit<DropdownMenuItemProps, "selected"> {
+    /**
+     * Radio item value
+     */
+    value: string;
+}
+/**
+ * DropdownMenu RadioItem component
+ */
+declare const DropdownMenuRadioItem: React$1.ForwardRefExoticComponent<DropdownMenuRadioItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface DropdownMenuRootProps extends PopoverRootProps {
+}
+/**
+ * DropdownMenu Root component
+ */
+declare function DropdownMenuRoot(props: DropdownMenuRootProps): react_jsx_runtime.JSX.Element;
+declare namespace DropdownMenuRoot {
+    var displayName: string;
+}
+
+/**
+ * DropdownMenu Separator Component
+ *
+ * Visual separator between menu items.
+ * Uses MENU_TOKENS for styling.
+ */
+
+interface DropdownMenuSeparatorProps extends React$1.HTMLAttributes<HTMLDivElement> {
+}
+/**
+ * DropdownMenu Separator component
+ */
+declare const DropdownMenuSeparator: React$1.ForwardRefExoticComponent<DropdownMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface DropdownMenuSubProps extends PopoverRootProps {
+}
+/**
+ * DropdownMenu Sub component
+ */
+declare function DropdownMenuSub(props: DropdownMenuSubProps): react_jsx_runtime.JSX.Element;
+declare namespace DropdownMenuSub {
+    var displayName: string;
+}
+
+/**
+ * DropdownMenu SubContent Component
+ *
+ * Content container for submenu.
+ */
+
+interface DropdownMenuSubContentProps extends DropdownMenuContentProps {
+}
+/**
+ * DropdownMenu SubContent component
+ */
+declare const DropdownMenuSubContent: React$1.ForwardRefExoticComponent<DropdownMenuSubContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu SubTrigger Component
+ *
+ * Trigger for submenu items.
+ */
+
+interface DropdownMenuSubTriggerProps extends DropdownMenuItemProps {
+}
+/**
+ * DropdownMenu SubTrigger component
+ */
+declare const DropdownMenuSubTrigger: React$1.ForwardRefExoticComponent<DropdownMenuSubTriggerProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DropdownMenu Trigger Component
+ *
+ * Trigger element for dropdown menu.
+ * Wraps PopoverTrigger with menu-specific ARIA attributes.
+ */
+
+interface DropdownMenuTriggerProps extends PopoverTriggerProps {
+}
+/**
+ * DropdownMenu Trigger component
+ */
+declare const DropdownMenuTrigger: React$1.ForwardRefExoticComponent<DropdownMenuTriggerProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * HoverCard Content Component
+ *
+ * Content container for HoverCard.
+ * Wraps PopoverContent with hover-specific behavior.
+ */
+
+interface HoverCardContentProps extends PopoverContentProps {
+}
+/**
+ * HoverCard Content component
+ */
+declare const HoverCardContent: React$1.ForwardRefExoticComponent<HoverCardContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface HoverCardRootProps extends Omit<PopoverRootProps, "open" | "onOpenChange"> {
+    /**
+     * Delay before opening (in milliseconds)
+     * @default 0
+     */
+    openDelay?: number;
+    /**
+     * Delay before closing (in milliseconds)
+     * @default 300
+     */
+    closeDelay?: number;
+}
+/**
+ * HoverCard Root component
+ */
+declare function HoverCardRoot({ openDelay, closeDelay, defaultOpen, ...props }: HoverCardRootProps): react_jsx_runtime.JSX.Element;
+declare namespace HoverCardRoot {
+    var displayName: string;
+}
+
+/**
+ * HoverCard Trigger Component
+ *
+ * Trigger element that opens HoverCard on hover/focus.
+ */
+
+interface HoverCardTriggerProps extends PopoverTriggerProps {
+}
+/**
+ * HoverCard Trigger component
+ */
+declare const HoverCardTrigger: React$1.ForwardRefExoticComponent<HoverCardTriggerProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * ContextMenu Content Component
+ *
+ * Content container for context menu.
+ * Uses cursor position for initial placement.
+ */
+
+interface ContextMenuContentProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Placement preference (if position is not set)
+     */
+    placement?: Placement;
+    /**
+     * Offset between trigger and content (in pixels)
+     */
+    offset?: number;
+}
+/**
+ * ContextMenu Content component
+ */
+declare const ContextMenuContent: React$1.ForwardRefExoticComponent<ContextMenuContentProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * ContextMenu Group Component
+ *
+ * Group container for context menu.
+ * Reuses DropdownMenuGroup.
+ */
+
+interface ContextMenuGroupProps extends DropdownMenuGroupProps {
+}
+/**
+ * ContextMenu Group component
+ */
+declare const ContextMenuGroup: React$1.ForwardRefExoticComponent<ContextMenuGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * ContextMenu Item Component
+ *
+ * Menu item for context menu.
+ * Reuses DropdownMenuItem logic.
+ */
+
+interface ContextMenuItemProps extends DropdownMenuItemProps {
+}
+/**
+ * ContextMenu Item component
+ */
+declare const ContextMenuItem: React$1.ForwardRefExoticComponent<ContextMenuItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * ContextMenu Label Component
+ *
+ * Label for context menu.
+ * Reuses DropdownMenuLabel.
+ */
+
+interface ContextMenuLabelProps extends DropdownMenuLabelProps {
+}
+/**
+ * ContextMenu Label component
+ */
+declare const ContextMenuLabel: React$1.ForwardRefExoticComponent<ContextMenuLabelProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface ContextMenuRootProps extends Omit<PopoverRootProps, "open" | "onOpenChange"> {
+}
+/**
+ * ContextMenu Root component
+ */
+declare function ContextMenuRoot(props: ContextMenuRootProps): react_jsx_runtime.JSX.Element;
+declare namespace ContextMenuRoot {
+    var displayName: string;
+}
+
+/**
+ * ContextMenu Separator Component
+ *
+ * Visual separator for context menu.
+ * Reuses DropdownMenuSeparator.
+ */
+
+interface ContextMenuSeparatorProps extends DropdownMenuSeparatorProps {
+}
+/**
+ * ContextMenu Separator component
+ */
+declare const ContextMenuSeparator: React$1.ForwardRefExoticComponent<ContextMenuSeparatorProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * ContextMenu Trigger Component
+ *
+ * Trigger element that opens context menu on right-click.
+ */
+
+interface ContextMenuTriggerProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Render as child element (composition pattern)
+     */
+    asChild?: boolean;
+}
+/**
+ * ContextMenu Trigger component
+ */
+declare const ContextMenuTrigger: React$1.ForwardRefExoticComponent<ContextMenuTriggerProps & React$1.RefAttributes<HTMLElement>>;
+
+declare const skeletonVariants: (props?: ({
+    variant?: "text" | "circle" | "inline" | "block" | "card" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SkeletonProps extends React$1.HTMLAttributes<HTMLDivElement>, VariantProps<typeof skeletonVariants> {
+    /**
+     * Whether to hide from screen readers
+     * @default true
+     */
+    "aria-hidden"?: boolean;
+}
+/**
+ * Skeleton component for loading states
+ *
+ * @example
+ * ```tsx
+ * <Skeleton variant="text" />
+ * <Skeleton variant="circle" />
+ * <Skeleton variant="card" />
+ * ```
+ */
+declare const Skeleton: React$1.ForwardRefExoticComponent<SkeletonProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * EmptyState Component
+ *
+ * Token-driven empty state component for displaying empty or no-data states.
+ * Uses DATA_TOKENS for all spacing and sizing.
+ * Integrates with Surface and Stack components.
+ */
+
+interface EmptyStateProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Unique ID for accessibility (auto-generated if not provided)
+     */
+    id?: string;
+}
+/**
+ * EmptyState root component
+ *
+ * @example
+ * ```tsx
+ * <EmptyState>
+ *   <EmptyState.Icon>📭</EmptyState.Icon>
+ *   <EmptyState.Title>No items found</EmptyState.Title>
+ *   <EmptyState.Description>Try adjusting your filters</EmptyState.Description>
+ *   <EmptyState.Action>
+ *     <Button>Create Item</Button>
+ *   </EmptyState.Action>
+ * </EmptyState>
+ * ```
+ */
+declare const EmptyState: React$1.ForwardRefExoticComponent<EmptyStateProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * EmptyState Action Component
+ *
+ * Action subcomponent for EmptyState (typically contains Button).
+ */
+
+interface EmptyStateActionProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Action button or link (typically Button component)
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * EmptyState Action component
+ */
+declare const EmptyStateAction: React$1.ForwardRefExoticComponent<EmptyStateActionProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * EmptyState Description Component
+ *
+ * Description subcomponent for EmptyState.
+ */
+
+interface EmptyStateDescriptionProps extends React$1.HTMLAttributes<HTMLParagraphElement> {
+    /**
+     * Description text
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * EmptyState Description component
+ */
+declare const EmptyStateDescription: React$1.ForwardRefExoticComponent<EmptyStateDescriptionProps & React$1.RefAttributes<HTMLParagraphElement>>;
+
+/**
+ * EmptyState Icon Component
+ *
+ * Icon subcomponent for EmptyState.
+ */
+
+interface EmptyStateIconProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Icon content (any ReactNode)
+     */
+    children: React$1.ReactNode;
+    /**
+     * Icon size
+     * @default "md"
+     */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * EmptyState Icon component
+ */
+declare const EmptyStateIcon: React$1.ForwardRefExoticComponent<EmptyStateIconProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * EmptyState Title Component
+ *
+ * Title subcomponent for EmptyState.
+ */
+
+interface EmptyStateTitleProps extends React$1.HTMLAttributes<HTMLHeadingElement> {
+    /**
+     * Title text
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * EmptyState Title component
+ */
+declare const EmptyStateTitle: React$1.ForwardRefExoticComponent<EmptyStateTitleProps & React$1.RefAttributes<HTMLHeadingElement>>;
+
+/**
+ * DataList Root Component
+ *
+ * Mobile-first data list component for displaying key-value pairs.
+ * Uses Stack for vertical layout and DATA_TOKENS for spacing.
+ */
+
+interface DataListRootProps extends React$1.HTMLAttributes<HTMLDListElement> {
+    /**
+     * Label width for desktop layout
+     * @default "md"
+     */
+    labelWidth?: "sm" | "md" | "lg";
+}
+/**
+ * DataList Root component
+ *
+ * @example
+ * ```tsx
+ * <DataList.Root>
+ *   <DataList.Item>
+ *     <DataList.Label>Name</DataList.Label>
+ *     <DataList.Value>John Doe</DataList.Value>
+ *   </DataList.Item>
+ * </DataList.Root>
+ * ```
+ */
+declare const DataListRoot: React$1.ForwardRefExoticComponent<DataListRootProps & React$1.RefAttributes<HTMLDListElement>>;
+
+/**
+ * DataList Item Component
+ *
+ * Individual item in DataList (contains Label and Value).
+ */
+
+interface DataListItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Row padding
+     * @default "md"
+     */
+    padding?: "sm" | "md" | "lg";
+}
+/**
+ * DataList Item component
+ * Mobile: vertical layout (label above value)
+ * Desktop: horizontal layout (label left, value right)
+ */
+declare const DataListItem: React$1.ForwardRefExoticComponent<DataListItemProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * DataList Label Component
+ *
+ * Label subcomponent for DataList items.
+ */
+
+interface DataListLabelProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Label text
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * DataList Label component
+ * Mobile: full width
+ * Desktop: fixed width (from tokens)
+ */
+declare const DataListLabel: React$1.ForwardRefExoticComponent<DataListLabelProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * DataList Value Component
+ *
+ * Value subcomponent for DataList items.
+ */
+
+interface DataListValueProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Value content
+     */
+    children: React$1.ReactNode;
+}
+/**
+ * DataList Value component
+ * Flex-grow to fill remaining space on desktop
+ */
+declare const DataListValue: React$1.ForwardRefExoticComponent<DataListValueProps & React$1.RefAttributes<HTMLElement>>;
+
+/**
+ * Table Component Types
+ *
+ * TypeScript interfaces and types for Table component.
+ */
+
+/**
+ * Table column definition
+ */
+interface TableColumn<T = Record<string, unknown>> {
+    /**
+     * Column key (must match a key in the data object)
+     */
+    key: keyof T;
+    /**
+     * Column header title
+     */
+    title: string;
+    /**
+     * Custom render function for cell content
+     */
+    render?: (value: T[keyof T], item: T, index: number) => ReactNode;
+    /**
+     * Column alignment
+     * @default "left"
+     */
+    align?: "left" | "center" | "right";
+    /**
+     * Column width (CSS value or Tailwind class)
+     */
+    width?: string;
+    /**
+     * Whether column is sortable
+     * @default false
+     */
+    sortable?: boolean;
+    /**
+     * Cell size
+     * @default "md"
+     */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * Sort direction
+ */
+type SortDirection = "asc" | "desc" | null;
+/**
+ * Sort state
+ */
+interface SortState {
+    /**
+     * Column key being sorted
+     */
+    column: string | null;
+    /**
+     * Sort direction
+     */
+    direction: SortDirection;
+}
+/**
+ * Table context value
+ */
+interface TableContextValue {
+    /**
+     * Current sort state
+     */
+    sortState: SortState;
+    /**
+     * Set sort state
+     */
+    setSortState: (state: SortState) => void;
+    /**
+     * Expanded rows (for expandable rows)
+     */
+    expandedRows: Set<string | number>;
+    /**
+     * Toggle row expansion
+     */
+    toggleRow: (rowKey: string | number) => void;
+    /**
+     * Whether table has expandable rows
+     */
+    expandable?: boolean;
+    /**
+     * Render function for expandable content
+     */
+    renderExpandableContent?: (item: unknown, index: number) => ReactNode;
+}
+/**
+ * Table Root component props
+ */
+interface TableRootProps<T = Record<string, unknown>> extends React.HTMLAttributes<HTMLTableElement> {
+    /**
+     * Table data array
+     */
+    data: T[];
+    /**
+     * Column definitions
+     */
+    columns: TableColumn<T>[];
+    /**
+     * Key to use for row identification
+     */
+    rowKey: keyof T | ((item: T, index: number) => string | number);
+    /**
+     * Whether table supports sorting
+     * @default false
+     */
+    sortable?: boolean;
+    /**
+     * Whether table supports expandable rows
+     * @default false
+     */
+    expandable?: boolean;
+    /**
+     * Render function for expandable content
+     */
+    renderExpandableContent?: (item: T, index: number) => ReactNode;
+    /**
+     * Whether table is in loading state
+     * @default false
+     */
+    loading?: boolean;
+    /**
+     * Empty state message (shown when data is empty)
+     */
+    emptyMessage?: string;
+    /**
+     * Whether header is sticky
+     * @default false
+     */
+    stickyHeader?: boolean;
+    /**
+     * Row size
+     * @default "md"
+     */
+    rowSize?: "sm" | "md" | "lg";
+}
+/**
+ * Table Header component props
+ */
+interface TableHeaderProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+    /**
+     * Whether header is sticky
+     * @default false
+     */
+    sticky?: boolean;
+}
+/**
+ * Table Head component props
+ */
+interface TableHeadProps extends React.HTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Column alignment
+     * @default "left"
+     */
+    align?: "left" | "center" | "right";
+    /**
+     * Whether column is sortable
+     * @default false
+     */
+    sortable?: boolean;
+    /**
+     * Column key (for sorting)
+     */
+    columnKey?: string;
+    /**
+     * Cell size
+     * @default "md"
+     */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * Table Body component props
+ */
+interface TableBodyProps extends React.HTMLAttributes<HTMLTableSectionElement> {
+}
+/**
+ * Table Row component props
+ */
+interface TableRowProps extends React.HTMLAttributes<HTMLTableRowElement> {
+    /**
+     * Whether row is selected
+     * @default false
+     */
+    selected?: boolean;
+    /**
+     * Whether row is expandable
+     * @default false
+     */
+    expandable?: boolean;
+    /**
+     * Row key (for expansion tracking)
+     */
+    rowKey?: string | number;
+    /**
+     * Whether row is expanded
+     * @default false
+     */
+    expanded?: boolean;
+}
+/**
+ * Table Cell component props
+ */
+interface TableCellProps extends React.HTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Cell alignment
+     * @default "left"
+     */
+    align?: "left" | "center" | "right";
+    /**
+     * Cell size
+     * @default "md"
+     */
+    size?: "sm" | "md" | "lg";
+}
+/**
+ * Table SortIcon component props
+ */
+interface TableSortIconProps extends React.HTMLAttributes<HTMLSpanElement> {
+    /**
+     * Sort direction
+     */
+    direction: SortDirection;
+}
+/**
+ * Table Empty component props
+ */
+interface TableEmptyProps extends React.HTMLAttributes<HTMLTableRowElement> {
+    /**
+     * Number of columns to span
+     */
+    colSpan: number;
+    /**
+     * Empty message
+     */
+    message?: string;
+}
+/**
+ * Table LoadingState component props
+ */
+interface TableLoadingStateProps extends React.HTMLAttributes<HTMLTableRowElement> {
+    /**
+     * Number of columns to span
+     */
+    colSpan: number;
+    /**
+     * Number of skeleton rows to show
+     * @default 5
+     */
+    rows?: number;
+}
+/**
+ * Table ExpandableContent component props
+ */
+interface TableExpandableContentProps extends React.HTMLAttributes<HTMLTableCellElement> {
+    /**
+     * Number of columns to span
+     */
+    colSpan: number;
+    /**
+     * Whether content is expanded
+     */
+    expanded: boolean;
+    /**
+     * Content to render
+     */
+    children: ReactNode;
+}
+
+declare function useTableContext(): TableContextValue;
+/**
+ * Table Root component
+ *
+ * @example
+ * ```tsx
+ * <Table.Root
+ *   data={users}
+ *   columns={columns}
+ *   rowKey="id"
+ *   sortable
+ * >
+ *   <Table.Header>
+ *     <Table.Row>
+ *       <Table.Head>Name</Table.Head>
+ *     </Table.Row>
+ *   </Table.Header>
+ *   <Table.Body>
+ *     {users.map((user) => (
+ *       <Table.Row key={user.id}>
+ *         <Table.Cell>{user.name}</Table.Cell>
+ *       </Table.Row>
+ *     ))}
+ *   </Table.Body>
+ * </Table.Root>
+ * ```
+ */
+declare function TableRoot<T extends Record<string, unknown>>({ data: _data, columns: _columns, rowKey: _rowKey, sortable: _sortable, expandable, renderExpandableContent, loading: _loading, emptyMessage: _emptyMessage, stickyHeader: _stickyHeader, rowSize: _rowSize, className, children, ...props }: TableRootProps<T>): react_jsx_runtime.JSX.Element;
+declare namespace TableRoot {
+    var displayName: string;
+}
+
+/**
+ * Table Body Component
+ *
+ * Body section for table (tbody element).
+ */
+
+/**
+ * Table Body component
+ */
+declare const TableBody: React$1.ForwardRefExoticComponent<TableBodyProps & React$1.RefAttributes<HTMLTableSectionElement>>;
+
+/**
+ * Table Cell Component
+ *
+ * Table cell component with alignment and size support.
+ */
+
+/**
+ * Table Cell component
+ */
+declare const TableCell: React$1.ForwardRefExoticComponent<TableCellProps & React$1.RefAttributes<HTMLTableCellElement>>;
+
+/**
+ * Table Empty Component
+ *
+ * Empty state row for table (uses EmptyState component).
+ */
+
+/**
+ * Table Empty component
+ */
+declare const TableEmpty: React$1.ForwardRefExoticComponent<TableEmptyProps & React$1.RefAttributes<HTMLTableRowElement>>;
+
+/**
+ * Table ExpandableContent Component
+ *
+ * Expandable content cell with CSS height transitions.
+ */
+
+/**
+ * Table ExpandableContent component
+ * Uses CSS height transitions (no framer-motion)
+ */
+declare const TableExpandableContent: React$1.ForwardRefExoticComponent<TableExpandableContentProps & React$1.RefAttributes<HTMLTableCellElement>>;
+
+/**
+ * Table Head Component
+ *
+ * Header cell component with sorting support.
+ */
+
+/**
+ * Table Head component
+ */
+declare const TableHead: React$1.ForwardRefExoticComponent<TableHeadProps & React$1.RefAttributes<HTMLTableCellElement>>;
+
+/**
+ * Table Header Component
+ *
+ * Header section for table (thead element).
+ */
+
+/**
+ * Table Header component
+ */
+declare const TableHeader: React$1.ForwardRefExoticComponent<TableHeaderProps & React$1.RefAttributes<HTMLTableSectionElement>>;
+
+/**
+ * Table LoadingState Component
+ *
+ * Loading state row for table (uses Skeleton component).
+ */
+
+/**
+ * Table LoadingState component
+ */
+declare const TableLoadingState: React$1.ForwardRefExoticComponent<TableLoadingStateProps & React$1.RefAttributes<HTMLTableRowElement>>;
+
+/**
+ * Table Row Component
+ *
+ * Table row component with hover and selected states.
+ */
+
+/**
+ * Table Row component
+ */
+declare const TableRow: React$1.ForwardRefExoticComponent<TableRowProps & React$1.RefAttributes<HTMLTableRowElement>>;
+
+/**
+ * Table SortIcon Component
+ *
+ * Sort indicator icon with rotation animation.
+ */
+
+/**
+ * Table SortIcon component
+ * Uses CSS rotation animation (no framer-motion)
+ */
+declare const TableSortIcon: React$1.ForwardRefExoticComponent<TableSortIconProps & React$1.RefAttributes<HTMLSpanElement>>;
+
+declare const tabsListVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const tabsTriggerVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    state?: "default" | "selected" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface TabsRootProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Controlled value for the active tab
+     */
+    value?: string;
+    /**
+     * Default value for uncontrolled usage
+     */
+    defaultValue?: string;
+    /**
+     * Callback when the active tab changes
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Orientation of the tabs
+     * @default "horizontal"
+     */
+    orientation?: "horizontal" | "vertical";
+}
+interface TabsListProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "role">, VariantProps<typeof tabsListVariants> {
+    /**
+     * Gap between tab items
+     */
+    gap?: "xs" | "sm" | "md" | "lg";
+}
+interface TabsTriggerProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "role">, VariantProps<typeof tabsTriggerVariants> {
+    /**
+     * Value of this tab (must be unique)
+     */
+    value: string;
+    /**
+     * Whether this tab is disabled
+     */
+    disabled?: boolean;
+}
+interface TabsContentProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Value of the tab this content belongs to
+     */
+    value: string;
+    /**
+     * Force mount the content (useful for SSR)
+     */
+    forceMount?: boolean;
+}
+/**
+ * Tabs.List - Container for tab triggers
+ */
+interface TabsListPropsInternal extends TabsListProps {
+    onSizeChange?: (size: "sm" | "md" | "lg") => void;
+}
+/**
+ * Tabs.Trigger - Individual tab button
+ */
+interface TabsTriggerPropsInternal extends TabsTriggerProps {
+}
+declare const Tabs: React$1.ForwardRefExoticComponent<TabsRootProps & React$1.RefAttributes<HTMLDivElement>> & {
+    Root: React$1.ForwardRefExoticComponent<TabsRootProps & React$1.RefAttributes<HTMLDivElement>>;
+    List: React$1.ForwardRefExoticComponent<TabsListPropsInternal & React$1.RefAttributes<HTMLDivElement>>;
+    Trigger: React$1.ForwardRefExoticComponent<TabsTriggerPropsInternal & React$1.RefAttributes<HTMLButtonElement>>;
+    Content: React$1.ForwardRefExoticComponent<TabsContentProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+declare const segmentedControlRootVariants: (props?: ({
+    orientation?: "horizontal" | "vertical" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+declare const segmentedControlItemVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | null | undefined;
+    state?: "default" | "selected" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface SegmentedControlRootProps extends Omit<React$1.HTMLAttributes<HTMLDivElement>, "role">, VariantProps<typeof segmentedControlRootVariants> {
+    /**
+     * Controlled value
+     */
+    value?: string;
+    /**
+     * Default value for uncontrolled usage
+     */
+    defaultValue?: string;
+    /**
+     * Callback when value changes
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Name for the radio group
+     */
+    name?: string;
+}
+interface SegmentedControlItemProps extends Omit<React$1.ButtonHTMLAttributes<HTMLButtonElement>, "role">, VariantProps<typeof segmentedControlItemVariants> {
+    /**
+     * Value of this item
+     */
+    value: string;
+    /**
+     * Whether this item is disabled
+     */
+    disabled?: boolean;
+}
+declare const SegmentedControl: React$1.ForwardRefExoticComponent<SegmentedControlRootProps & React$1.RefAttributes<HTMLDivElement>> & {
+    Root: React$1.ForwardRefExoticComponent<SegmentedControlRootProps & React$1.RefAttributes<HTMLDivElement>>;
+    Item: React$1.ForwardRefExoticComponent<SegmentedControlItemProps & React$1.RefAttributes<HTMLButtonElement>>;
+};
+
+interface BreadcrumbItem {
+    /**
+     * Label text for the breadcrumb item
+     */
+    label: string;
+    /**
+     * Optional href for clickable items
+     */
+    href?: string;
+    /**
+     * Whether this item is disabled
+     */
+    disabled?: boolean;
+}
+interface BreadcrumbsRootProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Array of breadcrumb items
+     */
+    items: BreadcrumbItem[];
+    /**
+     * Custom separator component or string
+     * @default ChevronRight icon
+     */
+    separator?: React$1.ReactNode;
+    /**
+     * ARIA label for the navigation element
+     * @default "Breadcrumb"
+     */
+    ariaLabel?: string;
+}
+interface BreadcrumbsItemProps extends React$1.HTMLAttributes<HTMLLIElement> {
+    /**
+     * Whether this is the last item (current page)
+     */
+    isLast?: boolean;
+    /**
+     * Whether this item is disabled
+     */
+    disabled?: boolean;
+}
+interface BreadcrumbsSeparatorProps extends React$1.HTMLAttributes<HTMLSpanElement> {
+    /**
+     * Custom separator content
+     */
+    children?: React$1.ReactNode;
+}
+declare const Breadcrumbs: React$1.ForwardRefExoticComponent<BreadcrumbsRootProps & React$1.RefAttributes<HTMLElement>> & {
+    Root: React$1.ForwardRefExoticComponent<BreadcrumbsRootProps & React$1.RefAttributes<HTMLElement>>;
+    Item: React$1.ForwardRefExoticComponent<BreadcrumbsItemProps & React$1.RefAttributes<HTMLLIElement>>;
+    Separator: React$1.ForwardRefExoticComponent<BreadcrumbsSeparatorProps & React$1.RefAttributes<HTMLSpanElement>>;
+};
+
+interface PaginationRootProps extends React$1.HTMLAttributes<HTMLElement> {
+    /**
+     * Current active page (1-indexed)
+     */
+    currentPage: number;
+    /**
+     * Total number of pages
+     */
+    totalPages: number;
+    /**
+     * Callback when page changes
+     */
+    onPageChange: (page: number) => void;
+    /**
+     * Number of pages to show on each side of current page
+     * @default 2
+     */
+    delta?: number;
+    /**
+     * ARIA label for the navigation element
+     * @default "Pagination"
+     */
+    ariaLabel?: string;
+}
+interface PaginationItemProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Page number (or "..." for ellipsis)
+     */
+    page: number | "...";
+    /**
+     * Whether this is the current page
+     */
+    isCurrent?: boolean;
+    /**
+     * Whether this item is disabled
+     */
+    disabled?: boolean;
+}
+interface PaginationPrevProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Whether previous button is disabled
+     */
+    disabled?: boolean;
+}
+interface PaginationNextProps extends React$1.ButtonHTMLAttributes<HTMLButtonElement> {
+    /**
+     * Whether next button is disabled
+     */
+    disabled?: boolean;
+}
+interface PaginationEllipsisProps extends React$1.HTMLAttributes<HTMLSpanElement> {
+}
+declare const Pagination: React$1.ForwardRefExoticComponent<PaginationRootProps & React$1.RefAttributes<HTMLElement>> & {
+    Root: React$1.ForwardRefExoticComponent<PaginationRootProps & React$1.RefAttributes<HTMLElement>>;
+    Item: React$1.ForwardRefExoticComponent<PaginationItemProps & React$1.RefAttributes<HTMLButtonElement>>;
+    Prev: React$1.ForwardRefExoticComponent<PaginationPrevProps & React$1.RefAttributes<HTMLButtonElement>>;
+    Next: React$1.ForwardRefExoticComponent<PaginationNextProps & React$1.RefAttributes<HTMLButtonElement>>;
+    Ellipsis: React$1.ForwardRefExoticComponent<PaginationEllipsisProps & React$1.RefAttributes<HTMLSpanElement>>;
+};
+
+interface StepperStep {
+    /**
+     * Unique identifier for the step
+     */
+    id: string;
+    /**
+     * Label text for the step
+     */
+    label: string;
+    /**
+     * Optional description for the step
+     */
+    description?: string;
+    /**
+     * Optional icon for the step indicator
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * Whether this step is disabled
+     */
+    disabled?: boolean;
+}
+interface StepperRootProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Array of steps
+     */
+    steps: StepperStep[];
+    /**
+     * Current active step index (0-indexed)
+     */
+    activeStep: number;
+    /**
+     * Orientation of the stepper
+     * @default "horizontal"
+     */
+    orientation?: "horizontal" | "vertical";
+    /**
+     * Whether to show step numbers
+     * @default true
+     */
+    showNumbers?: boolean;
+}
+interface StepperItemProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Step data
+     */
+    step: StepperStep;
+    /**
+     * Step index (0-indexed)
+     */
+    index: number;
+    /**
+     * Whether this is the active step
+     */
+    isActive: boolean;
+    /**
+     * Whether this step is completed
+     */
+    isCompleted: boolean;
+    /**
+     * Whether to show step number
+     */
+    showNumber?: boolean;
+}
+interface StepperIndicatorProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Step index
+     */
+    index: number;
+    /**
+     * Whether this is the active step
+     */
+    isActive: boolean;
+    /**
+     * Whether this step is completed
+     */
+    isCompleted: boolean;
+    /**
+     * Whether this step is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Custom icon
+     */
+    icon?: React$1.ReactNode;
+    /**
+     * Whether to show step number
+     */
+    showNumber?: boolean;
+}
+interface StepperLabelProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Step label text
+     */
+    label: string;
+    /**
+     * Optional description
+     */
+    description?: string;
+    /**
+     * Whether this is the active step
+     */
+    isActive: boolean;
+}
+interface StepperContentProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /**
+     * Step index this content belongs to
+     */
+    stepIndex: number;
+    /**
+     * Whether this content should be visible
+     */
+    isActive: boolean;
+}
+/**
+ * Stepper.Item - Individual step container
+ */
+interface StepperItemPropsInternal extends StepperItemProps {
+    orientation?: "horizontal" | "vertical";
+}
+declare const Stepper: React$1.ForwardRefExoticComponent<StepperRootProps & React$1.RefAttributes<HTMLDivElement>> & {
+    Root: React$1.ForwardRefExoticComponent<StepperRootProps & React$1.RefAttributes<HTMLDivElement>>;
+    Item: React$1.ForwardRefExoticComponent<StepperItemPropsInternal & React$1.RefAttributes<HTMLDivElement>>;
+    Indicator: React$1.ForwardRefExoticComponent<StepperIndicatorProps & React$1.RefAttributes<HTMLDivElement>>;
+    Label: React$1.ForwardRefExoticComponent<StepperLabelProps & React$1.RefAttributes<HTMLDivElement>>;
+    Content: React$1.ForwardRefExoticComponent<StepperContentProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+/**
+ * Icon Props Interface
+ *
+ * Shared props interface for all icon components.
+ * Ensures consistent API across all icons in the registry.
+ */
+
+/**
+ * Base props for all icon components
+ */
+interface IconProps$1 extends React$1.SVGProps<SVGSVGElement> {
+    /**
+     * Additional CSS classes
+     */
+    className?: string;
+    /**
+     * Hide icon from screen readers
+     * @default true
+     */
+    "aria-hidden"?: boolean;
+    /**
+     * Accessible label for the icon
+     */
+    "aria-label"?: string;
+}
+
+/**
+ * Arrow right icon component
+ */
+declare const IconArrowRight: React$1.FC<IconProps$1>;
+
+/**
+ * Calendar icon component
+ */
+declare const IconCalendar: React$1.FC<IconProps$1>;
+
+/**
+ * Check icon component (checkmark)
+ */
+declare const IconCheck: React$1.FC<IconProps$1>;
+
+/**
+ * Chevron down icon component
+ */
+declare const IconChevronDown: React$1.FC<IconProps$1>;
+
+/**
+ * Chevron right icon component
+ */
+declare const IconChevronRight: React$1.FC<IconProps$1>;
+
+/**
+ * Close icon component (X)
+ */
+declare const IconClose: React$1.FC<IconProps$1>;
+
+/**
+ * Error icon component (X in circle - used as fallback)
+ */
+declare const IconError: React$1.FC<IconProps$1>;
+
+/**
+ * Info icon component (information circle)
+ */
+declare const IconInfo: React$1.FC<IconProps$1>;
+
+/**
+ * Location icon component
+ */
+declare const IconLocation: React$1.FC<IconProps$1>;
+
+/**
+ * Menu icon component (hamburger menu)
+ */
+declare const IconMenu: React$1.FC<IconProps$1>;
+
+/**
+ * Search icon component
+ */
+declare const IconSearch: React$1.FC<IconProps$1>;
+
+/**
+ * Success icon component (checkmark in circle)
+ */
+declare const IconSuccess: React$1.FC<IconProps$1>;
+
+/**
+ * Warning icon component (warning triangle)
+ */
+declare const IconWarning: React$1.FC<IconProps$1>;
+
+/**
+ * Icon Registry
+ *
+ * Central registry for all icon components.
+ * Supports tree-shaking through individual named exports.
+ */
+
+/**
+ * Icons map for registry lookup
+ * Used by Icon component to resolve icon by name
+ */
+declare const ICONS_MAP: Record<string, React$1.FC<IconProps$1>>;
+/**
+ * Icon name type - union of all available icon names
+ */
+type IconName = keyof typeof ICONS_MAP;
+
+declare const iconVariants: (props?: ({
+    size?: "sm" | "md" | "lg" | "xl" | null | undefined;
+    color?: "muted" | "default" | "success" | "warning" | "danger" | "info" | null | undefined;
+    stroke?: "normal" | "bold" | "thin" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+interface IconProps extends Omit<React$1.SVGProps<SVGSVGElement>, "color" | "stroke">, VariantProps<typeof iconVariants> {
+    /**
+     * Icon name from registry
+     */
+    name: IconName;
+    /**
+     * Render as child element (composition pattern)
+     * Uses Radix UI Slot for composition
+     */
+    asChild?: boolean;
+}
+/**
+ * Icon component
+ *
+ * Unified icon component with token-driven sizing, colors, and stroke.
+ * Supports SSR-safe rendering and tree-shakeable icon registry.
+ *
+ * @example
+ * ```tsx
+ * <Icon name="search" size="md" color="default" />
+ * ```
+ */
+declare const Icon: React$1.ForwardRefExoticComponent<Omit<IconProps, "ref"> & React$1.RefAttributes<SVGSVGElement>>;
+
+/**
+ * Tenerife Animation System Types
+ *
+ * Type definitions for TAS animation system
+ */
+
+/**
+ * Animation props for layout primitives
+ * Returns CSS class names for Motion Tokens V2 animations
+ */
+interface AnimationProps {
+    /**
+     * CSS class name for the animation
+     * Maps to tm-motion-* utility classes
+     */
+    className?: string;
+}
+/**
+ * Component animation configuration
+ * Allows components to accept animation presets as props
+ */
+interface ComponentAnimationConfig {
+    /**
+     * Animation preset for initial mount/entrance
+     * Can be a preset name string or CSS class name
+     */
+    animation?: "fadeIn" | "fadeInUp" | "fadeInDown" | "fadeInLeft" | "fadeInRight" | "slideInUp" | "slideInDown" | "slideInLeft" | "slideInRight" | "scaleIn" | string;
+    /**
+     * Animation preset for hover state
+     * Can be a preset name string or CSS class name
+     */
+    hoverAnimation?: "hoverLift" | "hoverScale" | "tapScale" | string;
+    /**
+     * Custom animation class name (overrides preset names)
+     */
+    animationProps?: AnimationProps;
+}
+
+/**
+ * ArtistCard Size Variant
+ */
+type ArtistCardSize = "default" | "compact";
+/**
+ * ArtistCard Style Variant
+ */
+type ArtistCardVariant = "default" | "featured";
+/**
+ * Props for ArtistCard component.
+ * All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
+ */
+interface ArtistCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /** Artist name (pre-localized string, required) */
+    name: string;
+    /** Artist description (pre-localized string, optional) */
+    description?: string;
+    /** Genres as comma-separated string (e.g., "Jazz, Blues, Rock", optional) */
+    genres?: string;
+    /** Follower count for popularity metric (optional) */
+    followers?: number;
+    /** Plays/listens count for popularity metric (optional) */
+    plays?: number;
+    /** Image URL (optional) */
+    imageUrl?: string;
+    /** Link URL for artist details page (optional) */
+    href?: string;
+    /** Whether this is a featured artist */
+    featured?: boolean;
+    /** Show image section */
+    showImage?: boolean;
+    /** Badge text for featured artists (optional) */
+    popularBadgeText?: string;
+    /** Label for followers count (required) */
+    followersLabel: string;
+    /** Label for plays count (required) */
+    playsLabel: string;
+    /** Size variant - controls padding and gap */
+    size?: ArtistCardSize;
+    /** Style variant - controls visual appearance */
+    variant?: ArtistCardVariant;
+    /** Animation configuration for entrance and hover animations */
+    animation?: ComponentAnimationConfig;
+}
+
+/**
+ * ArtistCard Component
+ *
+ * Domain-specific card component for displaying artist information.
+ * Uses CardBase for layout and DOMAIN_TOKENS for all styling.
+ * Supports size variants (default, compact) and style variants (default, featured).
+ *
+ * @example
+ * ```tsx
+ * <ArtistCard
+ *   name="Artist Name"
+ *   genres="Jazz, Blues"
+ *   followers={1200}
+ *   plays={50000}
+ *   followersLabel="followers"
+ *   playsLabel="plays"
+ * />
+ * ```
+ */
+declare const ArtistCard: React$1.ForwardRefExoticComponent<ArtistCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * EventCard Size Variant
+ */
+type EventCardSize = "default" | "compact";
+/**
+ * EventCard Style Variant
+ */
+type EventCardVariant = "default" | "featured";
+/**
+ * Props for EventCard component.
+ * All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
+ */
+interface EventCardProps {
+    /** Event title (pre-localized string) */
+    title: string;
+    /** Event description (pre-localized string, optional) */
+    description?: string;
+    /** Event date/time display string (pre-formatted, optional) */
+    date?: string;
+    /** Venue name (pre-localized string, optional) */
+    venueName?: string;
+    /** Price display string with currency (e.g., "€20 - €50", optional) */
+    price?: string;
+    /** Image URL (optional) */
+    imageUrl?: string;
+    /** Link URL for event details page (optional) */
+    href?: string;
+    /** External ticket purchase URL (optional) */
+    ticketUrl?: string;
+    /** Whether this is a featured event */
+    featured?: boolean;
+    /** Show image section */
+    showImage?: boolean;
+    /** Label for "Get Tickets" button (required) */
+    getTicketsLabel: string;
+    /** Badge text for featured events (optional) */
+    featuredBadgeText?: string;
+    /** Size variant - controls padding and spacing */
+    size?: EventCardSize;
+    /** Style variant - controls visual appearance */
+    variant?: EventCardVariant;
+    /** Additional CSS classes */
+    className?: string;
+    /** Animation configuration for entrance and hover animations */
+    animation?: ComponentAnimationConfig;
+}
+
+/**
+ * EventCard Component
+ *
+ * Domain-specific card component for displaying event information.
+ * Uses CardBase for layout and DOMAIN_TOKENS for all styling.
+ *
+ * @example
+ * ```tsx
+ * <EventCard
+ *   title="Concert"
+ *   date="2024-01-01"
+ *   venueName="Venue"
+ *   getTicketsLabel="Get Tickets"
+ * />
+ * ```
+ */
+declare const EventCard: React$1.ForwardRefExoticComponent<EventCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * PromoCard Size Variant
+ */
+type PromoCardSize = "default" | "compact";
+/**
+ * PromoCard Style Variant
+ */
+type PromoCardVariant = "default" | "featured";
+/**
+ * Props for PromoCard component.
+ * All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
+ */
+interface PromoCardProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    /** Promo title (pre-localized string, required) */
+    title: string;
+    /** Promo description (pre-localized string, optional) */
+    description?: string;
+    /** Image URL (optional) */
+    imageUrl?: string;
+    /** Link URL for promo details page (optional) */
+    href?: string;
+    /** CTA button URL (optional) */
+    ctaUrl?: string;
+    /** Label for CTA button (required) */
+    ctaLabel: string;
+    /** Whether this is a featured promo */
+    featured?: boolean;
+    /** Badge text for featured promos (optional) */
+    featuredBadgeText?: string;
+    /** Show image section */
+    showImage?: boolean;
+    /** Size variant - controls padding and spacing */
+    size?: PromoCardSize;
+    /** Style variant - controls visual appearance */
+    variant?: PromoCardVariant;
+    /** Additional CSS classes */
+    className?: string;
+    /** Animation configuration for entrance and hover animations */
+    animation?: ComponentAnimationConfig;
+}
+
+/**
+ * PromoCard Component
+ *
+ * Domain-specific card component for displaying promotional content.
+ * Uses CardBase for layout and DOMAIN_TOKENS for all styling.
+ * CTA button uses BUTTON_TOKENS for styling.
+ *
+ * @example
+ * ```tsx
+ * <PromoCard
+ *   title="Special Offer"
+ *   description="Get 20% off on all tickets"
+ *   ctaLabel="Learn More"
+ *   ctaUrl="/promo"
+ * />
+ * ```
+ */
+declare const PromoCard: React$1.ForwardRefExoticComponent<PromoCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+/**
+ * TicketCard Size Variant
+ */
+type TicketCardSize = "default" | "compact";
+/**
+ * TicketCard Style Variant
+ */
+type TicketCardVariant = "default" | "featured";
+/**
+ * Ticket Availability Status
+ */
+type TicketAvailability = "available" | "sold_out" | "available_soon";
+/**
+ * Props for TicketCard component.
+ * All props are flat and domain-agnostic. Consumer should provide pre-localized strings.
+ */
+interface TicketCardProps {
+    /** Ticket type/name (pre-localized string) */
+    title: string;
+    /** Ticket description (pre-localized string, optional) */
+    description?: string;
+    /** Price display string with currency (e.g., "€20", optional) */
+    price?: string;
+    /** Capacity display string (e.g., "50 tickets", optional) */
+    capacity?: string;
+    /** Availability status */
+    availability?: TicketAvailability;
+    /** Image URL (optional) */
+    imageUrl?: string;
+    /** Link URL for ticket details (optional) */
+    href?: string;
+    /** Purchase action URL (optional) */
+    purchaseUrl?: string;
+    /** Label for purchase button (required) */
+    purchaseLabel: string;
+    /** VIP badge text (optional) */
+    vipBadgeText?: string;
+    /** Discount badge text (optional) */
+    discountBadgeText?: string;
+    /** Whether this is a featured ticket */
+    featured?: boolean;
+    /** Badge text for featured tickets (optional) */
+    featuredBadgeText?: string;
+    /** Show image section */
+    showImage?: boolean;
+    /** Size variant - controls padding and spacing */
+    size?: TicketCardSize;
+    /** Style variant - controls visual appearance */
+    variant?: TicketCardVariant;
+    /** Additional CSS classes */
+    className?: string;
+    /** Animation configuration for entrance and hover animations */
+    animation?: ComponentAnimationConfig;
+}
+
+/**
+ * TicketCard Component
+ *
+ * Domain-specific card component for displaying ticket information.
+ * Uses CardBase for layout and DOMAIN_TOKENS for all styling.
+ *
+ * @example
+ * ```tsx
+ * <TicketCard
+ *   title="VIP Ticket"
+ *   price="€50"
+ *   capacity="10 tickets left"
+ *   purchaseLabel="Buy Now"
+ * />
+ * ```
+ */
+declare const TicketCard: React$1.ForwardRefExoticComponent<TicketCardProps & React$1.RefAttributes<HTMLDivElement>>;
+
+export { Alert, type AlertProps, ArtistCard, type ArtistCardProps, type ArtistCardSize, type ArtistCardVariant, Backdrop, type BackdropProps, Body, type BodyProps, Box, type BoxProps, type BreadcrumbItem, Breadcrumbs, type BreadcrumbsItemProps, type BreadcrumbsRootProps, type BreadcrumbsSeparatorProps, Button, type ButtonProps, Caption, type CaptionProps, Card, CardBody, type CardBodyProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, Code, type CodeProps, Column, type StackProps as ColumnProps, Container, type ContainerProps, Surface as ContainerSurface, type SurfaceProps as ContainerSurfaceProps, ContextMenuContent, type ContextMenuContentProps, ContextMenuGroup, type ContextMenuGroupProps, ContextMenuItem, type ContextMenuItemProps, ContextMenuLabel, type ContextMenuLabelProps, ContextMenuRoot, type ContextMenuRootProps, ContextMenuSeparator, type ContextMenuSeparatorProps, ContextMenuTrigger, type ContextMenuTriggerProps, DataListRoot as DataList, DataListItem, type DataListItemProps, DataListLabel, type DataListLabelProps, DataListRoot, type DataListRootProps, DataListValue, type DataListValueProps, Dialog, DialogBody, type DialogBodyProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, type DialogProps, DialogRoot, DialogTitle, type DialogTitleProps, Display, type DisplayProps, DropdownMenuCheckItem, type DropdownMenuCheckItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, type DropdownMenuGroupProps, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuRadioGroup, type DropdownMenuRadioGroupProps, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuRoot, type DropdownMenuRootProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, type DropdownMenuSubProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type DropdownMenuTriggerProps, EmptyState, EmptyStateAction, type EmptyStateActionProps, EmptyStateDescription, type EmptyStateDescriptionProps, EmptyStateIcon, type EmptyStateIconProps, type EmptyStateProps, EmptyStateTitle, type EmptyStateTitleProps, EventCard, type EventCardProps, type EventCardSize, type EventCardVariant, FieldRoot as Field, type FieldControlProps, type FieldDescriptionProps, type FieldErrorProps, type FieldLabelProps, type FieldProps, Flex, type FlexProps, Grid, type GridProps, type GroupByFunction, Heading, type HeadingProps, HoverCardContent, type HoverCardContentProps, HoverCardRoot, type HoverCardRootProps, HoverCardTrigger, type HoverCardTriggerProps, ICONS_MAP, Icon, IconArrowRight, IconCalendar, IconCheck, IconChevronDown, IconChevronRight, IconClose, type IconProps$1 as IconComponentProps, IconError, IconInfo, IconLocation, IconMenu, type IconName, type IconProps, IconSearch, IconSuccess, IconWarning, Input, type InputProps, Label, type LabelProps, Lead, type LeadProps, Modal, ModalBody, type ModalBodyProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, type ModalProps, NotificationCenter, NotificationCenterDismissAll, type NotificationCenterDismissAllProps, NotificationCenterGroupHeader, type NotificationCenterGroupHeaderProps, NotificationCenterItem, type NotificationCenterItemProps, NotificationCenterList, type NotificationCenterListProps, NotificationCenterPanel, type NotificationCenterPanelProps, NotificationCenterProvider, type NotificationCenterProviderProps, NotificationCenterTrigger, type NotificationCenterTriggerProps, type NotificationChannel, type NotificationContextType, type NotificationData, type NotificationOptions, type NotificationVariant, Pagination, type PaginationEllipsisProps, type PaginationItemProps, type PaginationNextProps, type PaginationPrevProps, type PaginationRootProps, PopoverArrow, type PopoverArrowProps, PopoverContent, type PopoverContentProps, PopoverRoot, type PopoverRootProps, PopoverTrigger, type PopoverTriggerProps, Portal, type PortalProps, PromoCard, type PromoCardProps, type PromoCardSize, type PromoCardVariant, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Row, type RowProps, Section, type SectionProps, SegmentedControl, type SegmentedControlItemProps, type SegmentedControlRootProps, Select, SelectListbox, type SelectListboxProps, SelectOption, type SelectOptionProps, SelectRoot, type SelectRootProps, type SelectSize, SelectTrigger, type SelectTriggerProps, type SelectVariant, Skeleton, type SkeletonProps, type SortDirection, type SortState, Stack, type StackProps, Stepper, type StepperContentProps, type StepperIndicatorProps, type StepperItemProps, type StepperLabelProps, type StepperRootProps, type StepperStep, Surface$1 as Surface, type SurfaceProps$1 as SurfaceProps, TableRoot as Table, TableBody, type TableBodyProps, TableCell, type TableCellProps, type TableColumn, type TableContextValue, TableEmpty, type TableEmptyProps, TableExpandableContent, type TableExpandableContentProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TableLoadingState, type TableLoadingStateProps, TableRoot, type TableRootProps, TableRow, type TableRowProps, TableSortIcon, type TableSortIconProps, Tabs, type TabsContentProps, type TabsListProps, type TabsRootProps, type TabsTriggerProps, Text, type TextProps, type TextSize, type TextWeight, Textarea, type TextareaProps, type TicketAvailability, TicketCard, type TicketCardProps, type TicketCardSize, type TicketCardVariant, Toast, type ToastAction, type ToastData, type ToastOptions, type ToastPosition, type ToastProps, ToastProvider, type ToastProviderProps, ToastViewport, type ToastViewportProps, alertVariants, bodyVariants, borderRadius, buttonVariants, captionVariants, checkboxVariants, codeVariants, surfaceVariants as containerSurfaceVariants, displayVariants, headingVariants, iconVariants, inputVariants, labelVariants, leadVariants, modalVariants, popoverContentVariants, radioVariants, segmentedControlItemVariants, segmentedControlRootVariants, selectListboxVariants, selectOptionVariants, selectTriggerVariants, semanticSpacing, skeletonVariants, spacing, surfaceVariants$1 as surfaceVariants, tabsListVariants, tabsTriggerVariants, textVariants, textareaVariants, useNotificationCenter, useNotificationCenterContext, useTableContext, useToast };