@shohojdhara/atomix 0.1.26 → 0.1.28

package/dist/index.d.ts

@@ -0,0 +1,4955 @@
+import * as React$1 from 'react';
+import React__default, { ReactNode, ElementType, HTMLAttributes } from 'react';
+import * as PhosphorIcons from 'phosphor-react';
+
+type DatePickerPlacement = 'top-start' | 'top-end' | 'bottom-start' | 'bottom-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
+type DatePickerSize = 'sm' | 'md' | 'lg';
+type DatePickerSelectionMode = 'single' | 'range';
+interface DateRange {
+    startDate: Date | null;
+    endDate: Date | null;
+}
+interface DatePickerProps {
+    /**
+     * The currently selected date value
+     */
+    value?: Date | null;
+    /**
+     * Callback function when date is changed
+     */
+    onChange?: (date: Date | null) => void;
+    /**
+     * Selection mode - single date or date range
+     * @default "single"
+     */
+    selectionMode?: DatePickerSelectionMode;
+    /**
+     * The start date of the range (only used when selectionMode is "range")
+     */
+    startDate?: Date | null;
+    /**
+     * The end date of the range (only used when selectionMode is "range")
+     */
+    endDate?: Date | null;
+    /**
+     * Callback function when date range is changed
+     */
+    onRangeChange?: (range: DateRange) => void;
+    /**
+     * Format for the date display (follows Intl.DateTimeFormat patterns)
+     * @default "MM/dd/yyyy"
+     */
+    format?: string;
+    /**
+     * Minimum selectable date
+     */
+    minDate?: Date;
+    /**
+     * Maximum selectable date
+     */
+    maxDate?: Date;
+    /**
+     * Placeholder text for the input
+     * @default "Select date..."
+     */
+    placeholder?: string;
+    /**
+     * Whether the datepicker is disabled
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Whether the datepicker is read-only
+     * @default false
+     */
+    readOnly?: boolean;
+    /**
+     * Whether to show a clear button
+     * @default true
+     */
+    clearable?: boolean;
+    /**
+     * Whether to show the "Today" button
+     * @default true
+     */
+    showTodayButton?: boolean;
+    /**
+     * Whether to show week numbers
+     * @default false
+     */
+    showWeekNumbers?: boolean;
+    /**
+     * Whether to display the datepicker inline (always visible)
+     * @default false
+     */
+    inline?: boolean;
+    /**
+     * ID for the input element
+     */
+    id?: string;
+    /**
+     * Name for the input element
+     */
+    name?: string;
+    /**
+     * Additional class name for the datepicker component
+     */
+    className?: string;
+    /**
+     * Placement of the dropdown calendar
+     * @default "bottom-start"
+     */
+    placement?: DatePickerPlacement;
+    /**
+     * Additional class name for the input element
+     */
+    inputClassName?: string;
+    /**
+     * Size of the input field
+     * @default "md"
+     */
+    size?: DatePickerSize;
+}
+interface DatePickerRef {
+    /**
+     * Open the datepicker
+     */
+    open: () => void;
+    /**
+     * Close the datepicker
+     */
+    close: () => void;
+    /**
+     * Clear the selected date
+     */
+    clear: () => void;
+    /**
+     * Set focus on the input element
+     */
+    focus: () => void;
+}
+
+/**
+ * Common component size options
+ */
+type Size = 'sm' | 'md' | 'lg';
+/**
+ * Theme color variants
+ */
+type ThemeColor = 'primary' | 'secondary' | 'tertiary' | 'invert' | 'brand' | 'error' | 'success' | 'warning' | 'info' | 'light' | 'dark';
+/**
+ * Component variant including theme colors and outline variants
+ */
+type Variant = ThemeColor | `outline-${ThemeColor}` | 'link';
+/**
+ * Base component properties interface
+ */
+interface BaseComponentProps {
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Component disabled state
+     */
+    disabled?: boolean;
+}
+/**
+ * CSS class state modifiers
+ */
+type StateModifier = 'is-open' | 'is-closed' | 'is-active' | 'is-disabled' | 'is-loading' | 'is-selected' | 'is-animating' | 'is-hovered';
+/**
+ * Icon position options
+ */
+type IconPosition = 'left' | 'right';
+type listvariant = 'dash' | 'number' | 'text';
+/**;
+ * List component properties
+ */
+interface ListProps extends BaseComponentProps {
+    children?: ReactNode;
+    /**
+     * List items
+     */
+    items?: ReactNode[];
+    /**
+     * List variant
+     */
+    variant?: listvariant;
+    /**
+     * List size
+     */
+    size?: Size;
+    /**
+     * Whether the list is ordered
+     */
+    ordered?: boolean;
+    /**
+     * Whether to display list items inline
+     */
+    inline?: boolean;
+}
+/**
+ * List group component properties
+ */
+interface ListGroupProps extends BaseComponentProps {
+    /**
+     * List group children
+     */
+    children?: ReactNode;
+    /**
+     * List group variant
+     */
+    variant?: Variant;
+    /**
+     * List group size
+     */
+    size?: Size;
+}
+/**
+ * Button component properties
+ */
+interface ButtonProps extends BaseComponentProps {
+    /**
+     * Button contents
+     */
+    label: string;
+    /**
+     * Optional click handler
+     */
+    onClick?: () => void;
+    /**
+     * Button variant
+     */
+    variant?: Variant;
+    /**
+     * Button size
+     */
+    size?: Size;
+    /**
+     * Optional icon
+     */
+    icon?: ReactNode;
+    /**
+     * Icon only button
+     */
+    iconOnly?: boolean;
+    /**
+     * Make button fully rounded (pill shape)
+     */
+    rounded?: boolean;
+}
+/**
+ * Badge component properties
+ */
+interface BadgeProps extends BaseComponentProps {
+    /**
+     * Badge text content
+     */
+    label: string;
+    /**
+     * Badge color variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Badge size
+     */
+    size?: Size;
+    /**
+     * Optional icon
+     */
+    icon?: ReactNode;
+}
+/**
+ * Callout component properties
+ */
+interface CalloutProps extends BaseComponentProps {
+    /**
+     * Callout title
+     */
+    title?: ReactNode;
+    /**
+     * Callout content
+     */
+    children?: ReactNode;
+    /**
+     * Optional icon
+     */
+    icon?: ReactNode;
+    /**
+     * Callout variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Optional close handler
+     */
+    onClose?: () => void;
+    /**
+     * Optional action buttons
+     */
+    actions?: ReactNode;
+    /**
+     * Display in one line mode
+     */
+    oneLine?: boolean;
+    /**
+     * Display as toast notification
+     */
+    toast?: boolean;
+}
+/**
+ * Accordion component properties
+ */
+interface AccordionProps$1 extends BaseComponentProps {
+    /**
+     * Title of the accordion
+     */
+    title: string;
+    /**
+     * Content to be shown when accordion is expanded
+     */
+    children: ReactNode;
+    /**
+     * Whether the accordion is initially open
+     */
+    defaultOpen?: boolean;
+    /**
+     * Position of the icon (right or left)
+     */
+    iconPosition?: IconPosition;
+    /**
+     * Custom icon for the accordion
+     */
+    icon?: ReactNode;
+}
+/**
+ * Accordion state
+ */
+interface AccordionState {
+    /**
+     * Whether the accordion is open
+     */
+    isOpen: boolean;
+    /**
+     * Current panel height CSS value
+     */
+    panelHeight: string;
+}
+/**
+ * Common element ref types
+ */
+interface ElementRefs {
+    panelRef?: React.RefObject<HTMLDivElement>;
+    contentRef?: React.RefObject<HTMLDivElement>;
+    buttonRef?: React.RefObject<HTMLButtonElement>;
+}
+/**
+ * Hero alignment options
+ */
+type HeroAlignment = 'left' | 'center' | 'right';
+/**
+ * Hero component properties
+ */
+interface HeroProps extends BaseComponentProps {
+    /**
+     * Hero title
+     */
+    title: string;
+    /**
+     * Hero subtitle
+     */
+    subtitle?: string;
+    /**
+     * Hero text content
+     */
+    text?: string;
+    /**
+     * Image source for the hero
+     */
+    imageSrc?: string;
+    /**
+     * Image alt text
+     */
+    imageAlt?: string;
+    /**
+     * Content alignment
+     */
+    alignment?: HeroAlignment;
+    /**
+     * Background image source
+     */
+    backgroundImageSrc?: string;
+    /**
+     * Whether to show the background overlay
+     */
+    showOverlay?: boolean;
+    /**
+     * Whether the hero should take full viewport height
+     */
+    fullViewportHeight?: boolean;
+    /**
+     * Actions to display in the hero
+     */
+    actions?: ReactNode;
+    /**
+     * Custom grid column size for image (default is 7)
+     */
+    imageColSize?: number;
+    /**
+     * Custom grid column size for content (default is 5)
+     */
+    contentColSize?: number;
+    /**
+     * Custom width for the hero content (overrides the default CSS variable)
+     */
+    contentWidth?: string;
+    /**
+     * Enable parallax effect on background image
+     */
+    parallax?: boolean;
+    /**
+     * Parallax effect intensity (0-1)
+     */
+    parallaxIntensity?: number;
+    /**
+     * Video background URL
+     */
+    videoBackground?: string;
+    /**
+     * Video background options
+     */
+    videoOptions?: {
+        /**
+         * Whether the video should autoplay
+         */
+        autoplay?: boolean;
+        /**
+         * Whether the video should loop
+         */
+        loop?: boolean;
+        /**
+         * Whether the video should be muted
+         */
+        muted?: boolean;
+        /**
+         * Poster image URL for the video
+         */
+        posterUrl?: string;
+    };
+}
+/**
+ * Spinner component properties
+ */
+interface SpinnerProps extends BaseComponentProps {
+    /**
+     * Spinner color variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Spinner size
+     */
+    size?: Size;
+    /**
+     * Whether the spinner should be displayed fullscreen
+     */
+    fullscreen?: boolean;
+}
+/**
+ * Navbar position options
+ */
+type NavbarPosition = 'static' | 'fixed' | 'fixed-bottom';
+/**
+ * Nav item alignment options
+ */
+type NavAlignment = 'start' | 'center' | 'end';
+/**
+ * Nav variant options
+ */
+type NavVariant = 'default' | 'float-top-center' | 'float-bottom-center';
+/**
+ * Navbar component properties
+ */
+interface NavbarProps extends BaseComponentProps {
+    /**
+     * Brand/logo component or text
+     */
+    brand?: ReactNode;
+    /**
+     * Navbar navigation items
+     */
+    children?: ReactNode;
+    /**
+     * Optional variant/color scheme
+     */
+    variant?: ThemeColor;
+    /**
+     * Navbar position
+     */
+    position?: NavbarPosition;
+    /**
+     * Container max width (default is from settings)
+     */
+    containerWidth?: string;
+    /**
+     * Whether to collapse navbar on mobile
+     */
+    collapsible?: boolean;
+    /**
+     * Whether navbar is expanded (for controlled component)
+     */
+    expanded?: boolean;
+    /**
+     * Callback when expansion state changes
+     */
+    onToggle?: (expanded: boolean) => void;
+    /**
+     * Whether to show backdrop when expanded on mobile
+     */
+    backdrop?: boolean;
+    /**
+     * Whether to close navbar when clicking outside
+     */
+    closeOnOutsideClick?: boolean;
+    /**
+     * Whether to close navbar on escape key press
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Custom aria-label for the navigation
+     */
+    ariaLabel?: string;
+    /**
+     * ID for the navbar (used for accessibility)
+     */
+    id?: string;
+}
+/**
+ * Nav component properties
+ */
+interface NavProps extends BaseComponentProps {
+    /**
+     * Navigation items
+     */
+    children: ReactNode;
+    /**
+     * Alignment of nav items
+     */
+    alignment?: NavAlignment;
+    /**
+     * Nav variant (including float variants)
+     */
+    variant?: NavVariant;
+}
+/**
+ * Nav item properties
+ */
+interface NavItemProps extends BaseComponentProps {
+    /**
+     * Item content
+     */
+    children: ReactNode;
+    /**
+     * Whether this item has a dropdown
+     */
+    dropdown?: boolean;
+    /**
+     * Whether this item has a mega menu
+     */
+    megaMenu?: boolean;
+    /**
+     * Whether this item is active
+     */
+    active?: boolean;
+    /**
+     * Optional href for link items
+     */
+    href?: string;
+    /**
+     * Optional click handler
+     */
+    onClick?: () => void;
+    /**
+     * Whether dropdown/mega menu is expanded
+     */
+    'aria-expanded'?: boolean;
+    /**
+     * Optional custom link component
+     */
+    LinkComponent?: React.ElementType;
+}
+/**
+ * Nav dropdown properties
+ */
+interface NavDropdownProps extends BaseComponentProps {
+    /**
+     * Dropdown title/trigger content
+     */
+    title: ReactNode;
+    /**
+     * Dropdown menu items
+     */
+    children: ReactNode;
+    /**
+     * Dropdown alignment
+     */
+    alignment?: 'start' | 'center' | 'end';
+    /**
+     * Whether it's a mega menu (full width)
+     */
+    megaMenu?: boolean;
+}
+/**
+ * Menu component properties
+ */
+interface MenuProps extends BaseComponentProps {
+    /**
+     * Menu content
+     */
+    children: ReactNode;
+}
+/**
+ * Menu item properties
+ */
+interface MenuItemProps extends BaseComponentProps {
+    /**
+     * Item content
+     */
+    children: ReactNode;
+    /**
+     * Item href
+     */
+    href?: string;
+    /**
+     * Item icon
+     */
+    icon?: ReactNode;
+    /**
+     * Whether item is active
+     */
+    active?: boolean;
+    /**
+     * Item click handler
+     */
+    onClick?: () => void;
+}
+/**
+ * MegaMenu component properties
+ */
+interface MegaMenuProps extends BaseComponentProps {
+    /**
+     * MegaMenu content
+     */
+    children: ReactNode;
+}
+/**
+ * MegaMenu column properties
+ */
+interface MegaMenuColumnProps extends BaseComponentProps {
+    /**
+     * Column title
+     */
+    title?: ReactNode;
+    /**
+     * Column icon
+     */
+    icon?: ReactNode;
+    /**
+     * Column content
+     */
+    children: ReactNode;
+    /**
+     * Column width (auto by default)
+     */
+    width?: 'auto' | number;
+}
+/**
+ * MegaMenu link properties
+ */
+interface MegaMenuLinkProps extends BaseComponentProps {
+    /**
+     * Link href
+     */
+    href: string;
+    /**
+     * Link content
+     */
+    children: ReactNode;
+    /**
+     * Link click handler
+     */
+    onClick?: () => void;
+}
+/**
+ * SideMenu component properties
+ */
+interface SideMenuProps extends BaseComponentProps {
+    /**
+     * Menu title displayed at the top
+     */
+    title?: ReactNode;
+    /**
+     * Menu content (typically SideMenuList components)
+     */
+    children: ReactNode;
+    /**
+     * Whether the menu is open (for controlled component)
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when menu open state changes
+     */
+    onToggle?: (isOpen: boolean) => void;
+    /**
+     * Whether the menu is collapsible on mobile
+     */
+    collapsible?: boolean;
+    /**
+     * Custom toggle icon
+     */
+    toggleIcon?: ReactNode;
+    /**
+     * ID for the menu (used for accessibility)
+     */
+    id?: string;
+}
+/**
+ * SideMenuList component properties
+ */
+interface SideMenuListProps extends BaseComponentProps {
+    /**
+     * List items (typically SideMenuItem components)
+     */
+    children: ReactNode;
+}
+/**
+ * SideMenuItem component properties
+ */
+interface SideMenuItemProps extends BaseComponentProps {
+    /**
+     * Item content
+     */
+    children: ReactNode;
+    /**
+     * Item href (renders as link)
+     */
+    href?: string;
+    /**
+     * Item click handler (renders as button if no href)
+     */
+    onClick?: (event: React.MouseEvent) => void;
+    /**
+     * Whether this item is active/current
+     */
+    active?: boolean;
+    /**
+     * Optional icon for the item
+     */
+    icon?: ReactNode;
+    /**
+     * Link target attribute
+     */
+    target?: string;
+    /**
+     * Link rel attribute
+     */
+    rel?: string;
+    /**
+     * Optional custom link component
+     */
+    LinkComponent?: React.ElementType;
+}
+/**
+ * EdgePanel position options
+ */
+type EdgePanelPosition = 'start' | 'end' | 'top' | 'bottom';
+/**
+ * EdgePanel animation mode options
+ */
+type EdgePanelMode = 'slide' | 'push' | 'none';
+/**
+ * EdgePanel component properties
+ */
+interface EdgePanelProps extends BaseComponentProps {
+    /**
+     * Panel title
+     */
+    title?: ReactNode;
+    /**
+     * Panel content
+     */
+    children: ReactNode;
+    /**
+     * Panel position
+     */
+    position?: EdgePanelPosition;
+    /**
+     * Animation mode
+     */
+    mode?: EdgePanelMode;
+    /**
+     * Whether the panel is open
+     */
+    isOpen?: boolean;
+    /**
+     * Open/close callback
+     */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Show backdrop
+     */
+    backdrop?: boolean;
+    /**
+     * Close when clicking backdrop
+     */
+    closeOnBackdropClick?: boolean;
+    /**
+     * Close when pressing escape key
+     */
+    closeOnEscape?: boolean;
+}
+/**
+ * DataTable column definition
+ */
+interface DataTableColumn {
+    /**
+     * Unique identifier for the column
+     */
+    key: string;
+    /**
+     * Display title for the column
+     */
+    title: string;
+    /**
+     * Whether the column is sortable
+     */
+    sortable?: boolean;
+    /**
+     * Whether the column is filterable
+     */
+    filterable?: boolean;
+    /**
+     * Custom render function for the cell
+     */
+    render?: (value: any, row: any) => React.ReactNode;
+    /**
+     * Width of the column (CSS value)
+     */
+    width?: string;
+}
+/**
+ * Sort configuration
+ */
+interface SortConfig {
+    /**
+     * Column key to sort by
+     */
+    key: string;
+    /**
+     * Sort direction
+     */
+    direction: 'asc' | 'desc';
+}
+/**
+ * DataTable component properties
+ */
+interface DataTableProps extends BaseComponentProps {
+    /**
+     * Data array to display in the table
+     */
+    data: any[];
+    /**
+     * Column definitions
+     */
+    columns: DataTableColumn[];
+    /**
+     * Whether the table is sortable
+     */
+    sortable?: boolean;
+    /**
+     * Whether the table is filterable
+     */
+    filterable?: boolean;
+    /**
+     * Whether the table is paginated
+     */
+    paginated?: boolean;
+    /**
+     * Number of rows per page
+     */
+    pageSize?: number;
+    /**
+     * Whether to show alternating row colors
+     */
+    striped?: boolean;
+    /**
+     * Whether to show borders around cells
+     */
+    bordered?: boolean;
+    /**
+     * Whether to use compact styling
+     */
+    dense?: boolean;
+    /**
+     * Whether the table is in loading state
+     */
+    loading?: boolean;
+    /**
+     * Message to display when there is no data
+     */
+    emptyMessage?: string;
+    /**
+     * Callback when a row is clicked
+     */
+    onRowClick?: (row: any) => void;
+    /**
+     * Callback when sorting changes
+     */
+    onSort?: (sortConfig: SortConfig) => void;
+}
+/**
+ * Pagination component properties
+ */
+interface PaginationProps extends BaseComponentProps {
+    /**
+     * Current active page
+     */
+    currentPage: number;
+    /**
+     * Total number of pages
+     */
+    totalPages: number;
+    /**
+     * Callback function when page changes
+     */
+    onPageChange: (page: number) => void;
+    /**
+     * Number of page links to show before and after current page
+     */
+    siblingCount?: number;
+    /**
+     * Whether to show first/last page buttons
+     */
+    showFirstLastButtons?: boolean;
+    /**
+     * Whether to show previous/next page buttons
+     */
+    showPrevNextButtons?: boolean;
+    /**
+     * Custom class for the pagination container
+     */
+    className?: string;
+    /**
+     * Size variant for the pagination component
+     */
+    size?: Size;
+    /**
+     * Accessible label for the navigation element
+     */
+    ariaLabel?: string;
+}
+/**
+ * Todo item data structure
+ */
+interface TodoItem {
+    /**
+     * Unique identifier for the todo
+     */
+    id: string;
+    /**
+     * Todo item text
+     */
+    text: string;
+    /**
+     * Whether the todo is completed
+     */
+    completed: boolean;
+}
+/**
+ * Todo component properties
+ */
+interface TodoProps extends BaseComponentProps {
+    /**
+     * List of todo items
+     */
+    items: TodoItem[];
+    /**
+     * Callback when a todo item is added
+     */
+    onAddTodo?: (text: string) => void;
+    /**
+     * Callback when a todo item is toggled
+     */
+    onToggleTodo?: (id: string) => void;
+    /**
+     * Callback when a todo item is deleted
+     */
+    onDeleteTodo?: (id: string) => void;
+    /**
+     * Title of the todo list
+     */
+    title?: string;
+    /**
+     * Size variant for the todo component
+     */
+    size?: Size;
+    /**
+     * Placeholder text for the new todo input
+     */
+    placeholder?: string;
+    /**
+     * Whether to show the completed todos
+     */
+    showCompleted?: boolean;
+}
+/**
+ * Form component properties
+ */
+interface FormProps extends BaseComponentProps {
+    /**
+     * Form content
+     */
+    children: ReactNode;
+    /**
+     * Form submit handler
+     */
+    onSubmit?: (event: React.FormEvent<HTMLFormElement>) => void;
+    /**
+     * Form reset handler
+     */
+    onReset?: (event: React.FormEvent<HTMLFormElement>) => void;
+    /**
+     * Form ID
+     */
+    id?: string;
+    /**
+     * Form method
+     */
+    method?: 'get' | 'post';
+    /**
+     * Form encoding type
+     */
+    encType?: string;
+    /**
+     * Whether to disable HTML5 validation
+     */
+    noValidate?: boolean;
+    /**
+     * Form autocomplete setting
+     */
+    autoComplete?: string;
+}
+/**
+ * Form Group component properties
+ */
+interface FormGroupProps extends BaseComponentProps {
+    /**
+     * Form control content
+     */
+    children: ReactNode;
+    /**
+     * Label text
+     */
+    label?: string;
+    /**
+     * Helper text displayed below the input
+     */
+    helperText?: ReactNode;
+    /**
+     * ID of the form control this label is for
+     */
+    htmlFor?: string;
+    /**
+     * Whether the field is required
+     */
+    required?: boolean;
+    /**
+     * Whether the field is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the field is valid
+     */
+    valid?: boolean;
+    /**
+     * Size variant
+     */
+    size?: Size;
+}
+/**
+ * Input component properties
+ */
+interface InputProps extends BaseComponentProps {
+    /**
+     * Input type
+     */
+    type?: string;
+    /**
+     * Input value
+     */
+    value?: string | number;
+    /**
+     * Change handler
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Blur handler
+     */
+    onBlur?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /**
+     * Focus handler
+     */
+    onFocus?: (event: React.FocusEvent<HTMLInputElement>) => void;
+    /**
+     * Placeholder text
+     */
+    placeholder?: string;
+    /**
+     * Whether the input is required
+     */
+    required?: boolean;
+    /**
+     * Whether the input is read-only
+     */
+    readOnly?: boolean;
+    /**
+     * Input ID
+     */
+    id?: string;
+    /**
+     * Input name
+     */
+    name?: string;
+    /**
+     * Autocomplete attribute
+     */
+    autoComplete?: string;
+    /**
+     * Whether the input should receive focus on render
+     */
+    autoFocus?: boolean;
+    /**
+     * Size variant
+     */
+    size?: Size;
+    /**
+     * Color variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Whether the input is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the input is valid
+     */
+    valid?: boolean;
+    /**
+     * Maximum length
+     */
+    maxLength?: number;
+    /**
+     * Minimum length
+     */
+    minLength?: number;
+    /**
+     * Input pattern
+     */
+    pattern?: string;
+    /**
+     * Minimum value (for number inputs)
+     */
+    min?: number | string;
+    /**
+     * Maximum value (for number inputs)
+     */
+    max?: number | string;
+    /**
+     * Step value (for number inputs)
+     */
+    step?: number | string;
+    /**
+     * Accessible label (if no visible label)
+     */
+    ariaLabel?: string;
+    /**
+     * ID of element that describes this input
+     */
+    ariaDescribedBy?: string;
+}
+/**
+ * Select option
+ */
+interface SelectOption {
+    /**
+     * Option value
+     */
+    value: string;
+    /**
+     * Option display label
+     */
+    label: string;
+    /**
+     * Whether the option is disabled
+     */
+    disabled?: boolean;
+}
+/**
+ * Select component properties
+ */
+interface SelectProps extends BaseComponentProps {
+    /**
+     * Select options
+     */
+    options: SelectOption[];
+    /**
+     * Selected value(s)
+     */
+    value?: string | string[];
+    /**
+     * Change handler
+     */
+    onChange?: (event: React.ChangeEvent<HTMLSelectElement>) => void;
+    /**
+     * Blur handler
+     */
+    onBlur?: (event: React.FocusEvent<HTMLSelectElement>) => void;
+    /**
+     * Focus handler
+     */
+    onFocus?: (event: React.FocusEvent<HTMLSelectElement>) => void;
+    /**
+     * Placeholder text
+     */
+    placeholder?: string;
+    /**
+     * Whether the select is required
+     */
+    required?: boolean;
+    /**
+     * Select ID
+     */
+    id?: string;
+    /**
+     * Select name
+     */
+    name?: string;
+    /**
+     * Size variant
+     */
+    size?: Size;
+    /**
+     * Whether the select is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the select is valid
+     */
+    valid?: boolean;
+    /**
+     * Whether multiple options can be selected
+     */
+    multiple?: boolean;
+    /**
+     * Accessible label (if no visible label)
+     */
+    ariaLabel?: string;
+    /**
+     * ID of element that describes this select
+     */
+    ariaDescribedBy?: string;
+}
+/**
+ * Checkbox component properties
+ */
+interface CheckboxProps extends BaseComponentProps {
+    /**
+     * Checkbox label
+     */
+    label?: ReactNode;
+    /**
+     * Whether the checkbox is checked
+     */
+    checked?: boolean;
+    /**
+     * Change handler
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Whether the checkbox is required
+     */
+    required?: boolean;
+    /**
+     * Checkbox ID
+     */
+    id?: string;
+    /**
+     * Checkbox name
+     */
+    name?: string;
+    /**
+     * Checkbox value
+     */
+    value?: string;
+    /**
+     * Whether the checkbox is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the checkbox is valid
+     */
+    valid?: boolean;
+    /**
+     * Whether the checkbox is in indeterminate state
+     */
+    indeterminate?: boolean;
+    /**
+     * Accessible label (if no visible label)
+     */
+    ariaLabel?: string;
+    /**
+     * ID of element that describes this checkbox
+     */
+    ariaDescribedBy?: string;
+}
+/**
+ * Radio component properties
+ */
+interface RadioProps extends BaseComponentProps {
+    /**
+     * Radio label
+     */
+    label?: ReactNode;
+    /**
+     * Whether the radio is checked
+     */
+    checked?: boolean;
+    /**
+     * Change handler
+     */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+    /**
+     * Whether the radio is required
+     */
+    required?: boolean;
+    /**
+     * Radio ID
+     */
+    id?: string;
+    /**
+     * Radio name
+     */
+    name?: string;
+    /**
+     * Radio value
+     */
+    value?: string;
+    /**
+     * Whether the radio is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the radio is valid
+     */
+    valid?: boolean;
+    /**
+     * Accessible label (if no visible label)
+     */
+    ariaLabel?: string;
+    /**
+     * ID of element that describes this radio
+     */
+    ariaDescribedBy?: string;
+}
+/**
+ * Textarea component properties
+ */
+interface TextareaProps extends BaseComponentProps {
+    /**
+     * Textarea value
+     */
+    value?: string;
+    /**
+     * Change handler
+     */
+    onChange?: (event: React.ChangeEvent<HTMLTextAreaElement>) => void;
+    /**
+     * Blur handler
+     */
+    onBlur?: (event: React.FocusEvent<HTMLTextAreaElement>) => void;
+    /**
+     * Focus handler
+     */
+    onFocus?: (event: React.FocusEvent<HTMLTextAreaElement>) => void;
+    /**
+     * Placeholder text
+     */
+    placeholder?: string;
+    /**
+     * Whether the textarea is required
+     */
+    required?: boolean;
+    /**
+     * Whether the textarea is read-only
+     */
+    readOnly?: boolean;
+    /**
+     * Textarea ID
+     */
+    id?: string;
+    /**
+     * Textarea name
+     */
+    name?: string;
+    /**
+     * Number of rows
+     */
+    rows?: number;
+    /**
+     * Number of columns
+     */
+    cols?: number;
+    /**
+     * Maximum length
+     */
+    maxLength?: number;
+    /**
+     * Minimum length
+     */
+    minLength?: number;
+    /**
+     * Size variant
+     */
+    size?: Size;
+    /**
+     * Color variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Whether the textarea is invalid
+     */
+    invalid?: boolean;
+    /**
+     * Whether the textarea is valid
+     */
+    valid?: boolean;
+    /**
+     * Whether the textarea should receive focus on render
+     */
+    autoFocus?: boolean;
+    /**
+     * Accessible label (if no visible label)
+     */
+    ariaLabel?: string;
+    /**
+     * ID of element that describes this textarea
+     */
+    ariaDescribedBy?: string;
+}
+/**
+ * Avatar size options
+ */
+type AvatarSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+/**
+ * Avatar component properties
+ */
+interface AvatarProps extends BaseComponentProps {
+    /**
+     * Avatar image source URL
+     */
+    src?: string;
+    /**
+     * Alt text for the avatar image
+     */
+    alt?: string;
+    /**
+     * Initials to display when no image is available
+     */
+    initials?: string;
+    /**
+     * Icon to display when no image or initials are available
+     */
+    icon?: ReactNode;
+    /**
+     * Size variant for the avatar
+     */
+    size?: AvatarSize;
+    /**
+     * Whether to make the avatar circular
+     */
+    circle?: boolean;
+    /**
+     * Optional click handler
+     */
+    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+}
+/**
+ * Avatar Group component properties
+ */
+interface AvatarGroupProps extends BaseComponentProps {
+    /**
+     * Child Avatar components
+     */
+    children: ReactNode;
+    /**
+     * Maximum number of avatars to display before showing a "+X" indicator
+     */
+    max?: number;
+    /**
+     * Whether to display avatars in a stacked formation
+     */
+    stacked?: boolean;
+    /**
+     * Custom text for the "more" indicator
+     */
+    moreText?: string;
+}
+/**
+ * Modal component props
+ */
+interface ModalProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'title'> {
+    /**
+     * Whether the modal is open
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when the modal's open state changes
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Callback when the modal is opened
+     */
+    onOpen?: () => void;
+    /**
+     * Callback when the modal is closed
+     */
+    onClose?: () => void;
+    /**
+     * Modal title displayed in the header
+     */
+    title?: React.ReactNode;
+    /**
+     * Modal subtitle displayed below the title
+     */
+    subtitle?: React.ReactNode;
+    /**
+     * Modal size
+     */
+    size?: 'sm' | 'md' | 'lg' | 'xl';
+    /**
+     * Whether to close when backdrop is clicked
+     */
+    backdrop?: boolean;
+    /**
+     * Whether to close when the escape key is pressed
+     */
+    keyboard?: boolean;
+    /**
+     * Whether to show the close button
+     */
+    closeButton?: boolean;
+    /**
+     * Content for the modal footer
+     */
+    footer?: React.ReactNode;
+}
+/**
+ * Breadcrumb item interface
+ */
+interface BreadcrumbItem$2 {
+    /**
+     * Item label text
+     */
+    label: string;
+    /**
+     * Optional URL for the breadcrumb item
+     */
+    href?: string;
+    /**
+     * Whether this item is active/current
+     */
+    active?: boolean;
+    /**
+     * Icon name from Phosphor Icons
+     */
+    icon?: string;
+    /**
+     * Optional click handler
+     */
+    onClick?: (event: MouseEvent) => void;
+}
+/**
+ * Breadcrumb options interface
+ */
+interface BreadcrumbOptions$1 {
+    /**
+     * Array of breadcrumb items
+     */
+    items?: BreadcrumbItem$2[];
+    /**
+     * Divider character or string between items
+     */
+    divider?: string;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Accessible label for the breadcrumb navigation
+     */
+    ariaLabel?: string;
+}
+/**
+ * Breadcrumb instance interface
+ */
+interface BreadcrumbInstance {
+    /**
+     * Update the breadcrumb with new options
+     */
+    update: (options: Partial<BreadcrumbOptions$1>) => void;
+    /**
+     * Destroy the breadcrumb component
+     */
+    destroy: () => void;
+}
+/**
+ * Message item interface
+ */
+interface MessageItem {
+    /**
+     * Unique identifier for the message
+     */
+    id: string;
+    /**
+     * Message text content
+     */
+    text?: string;
+    /**
+     * Image URL for image messages
+     */
+    image?: string;
+    /**
+     * File information for file messages
+     */
+    file?: {
+        /**
+         * File name
+         */
+        name: string;
+        /**
+         * File size (formatted string)
+         */
+        size: string;
+    };
+    /**
+     * Message timestamp
+     */
+    time: string;
+    /**
+     * Whether the message is from the current user
+     */
+    isSelf?: boolean;
+}
+/**
+ * Messages component properties
+ */
+interface MessagesProps extends BaseComponentProps {
+    /**
+     * Array of message items to display
+     */
+    messages: MessageItem[];
+    /**
+     * Avatar image URL for the other person
+     */
+    otherAvatar?: string;
+    /**
+     * Avatar image URL for the current user
+     */
+    selfAvatar?: string;
+    /**
+     * Name of the other person
+     */
+    otherName?: string;
+    /**
+     * Custom width for the messages container
+     */
+    width?: string;
+    /**
+     * Callback when a new message is sent
+     */
+    onSendMessage?: (text: string) => void;
+    /**
+     * Placeholder text for the input field
+     */
+    placeholder?: string;
+    /**
+     * Maximum height for the messages body
+     */
+    bodyHeight?: string;
+    /**
+     * Unique identifier for the messages component
+     */
+    id?: string;
+}
+/**
+ * Popover component properties
+ */
+interface PopoverTriggerProps {
+    /**
+     * The element that will trigger the popover
+     */
+    children: ReactNode;
+    /**
+     * How the popover is triggered
+     */
+    trigger?: 'hover' | 'click';
+    /**
+     * Popover reference passed from PopoverContext
+     */
+    popoverId?: string;
+}
+interface PopoverProps {
+    /**
+     * Content to be displayed in the popover
+     */
+    content: ReactNode;
+    /**
+     * The position of the popover relative to the trigger
+     */
+    position?: 'top' | 'bottom' | 'left' | 'right' | 'auto';
+    /**
+     * How the popover is triggered
+     */
+    trigger?: 'hover' | 'click';
+    /**
+     * Additional CSS class for the popover
+     */
+    className?: string;
+    /**
+     * Delay before showing the popover (in milliseconds)
+     */
+    delay?: number;
+    /**
+     * Offset from the trigger element (in pixels)
+     */
+    offset?: number;
+    /**
+     * Whether the popover should be open initially
+     */
+    defaultOpen?: boolean;
+    /**
+     * Controlled state of the popover
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when the popover open state changes
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Whether to close the popover when clicking outside
+     */
+    closeOnClickOutside?: boolean;
+    /**
+     * Whether to close the popover when pressing escape key
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Optional ID for the popover
+     */
+    id?: string;
+    /**
+     * Children content (removed in favor of using PopoverTrigger)
+     */
+    children?: ReactNode;
+}
+/**
+ * The trigger method for the dropdown menu
+ */
+type DropdownTrigger = 'click' | 'hover';
+/**
+ * The placement of the dropdown menu
+ */
+type DropdownPlacement = 'bottom-start' | 'bottom-end' | 'top-start' | 'top-end' | 'left-start' | 'left-end' | 'right-start' | 'right-end';
+/**
+ * Dropdown component properties
+ */
+interface DropdownProps extends BaseComponentProps {
+    /**
+     * Dropdown trigger element
+     */
+    children: ReactNode;
+    /**
+     * Dropdown menu content
+     */
+    menu: ReactNode;
+    /**
+     * How the dropdown is triggered
+     */
+    trigger?: DropdownTrigger;
+    /**
+     * The placement of the dropdown menu
+     */
+    placement?: DropdownPlacement;
+    /**
+     * Whether the dropdown is initially open
+     */
+    defaultOpen?: boolean;
+    /**
+     * Controlled state of the dropdown
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when the dropdown open state changes
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Offset from the trigger element (in pixels)
+     */
+    offset?: number;
+    /**
+     * Whether the dropdown should be closed when clicking outside
+     */
+    closeOnClickOutside?: boolean;
+    /**
+     * Whether the dropdown should be closed when pressing escape key
+     */
+    closeOnEscape?: boolean;
+    /**
+     * Max height for the dropdown menu
+     */
+    maxHeight?: string;
+    /**
+     * Min width for the dropdown menu
+     */
+    minWidth?: string | number;
+    /**
+     * Color variant for the dropdown trigger
+     */
+    variant?: ThemeColor;
+    /**
+     * Optional ID for the dropdown
+     */
+    id?: string;
+}
+/**
+ * Dropdown menu item properties
+ */
+interface DropdownItemProps extends BaseComponentProps {
+    /**
+     * Item content
+     */
+    children: ReactNode;
+    /**
+     * Item href
+     */
+    href?: string;
+    /**
+     * Whether item is active
+     */
+    active?: boolean;
+    /**
+     * Whether item is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Item icon
+     */
+    icon?: ReactNode;
+    /**
+     * Item click handler
+     */
+    onClick?: (event: React.MouseEvent<HTMLButtonElement | HTMLAnchorElement>) => void;
+    /**
+     * Optional custom link component
+     */
+    LinkComponent?: React.ElementType;
+}
+/**
+ * Dropdown divider properties
+ */
+interface DropdownDividerProps {
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+}
+/**
+ * Dropdown header properties
+ */
+interface DropdownHeaderProps {
+    /**
+     * Header content
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+}
+/**
+ * Progress component properties
+ */
+interface ProgressProps extends BaseComponentProps {
+    /**
+     * Progress value (0-100)
+     */
+    value: number;
+    /**
+     * Progress bar color variant
+     */
+    variant?: ThemeColor;
+    /**
+     * Progress bar size
+     */
+    size?: Size;
+    /**
+     * Accessible label for screen readers
+     */
+    ariaLabel?: string;
+}
+/**
+ * Rating component properties
+ */
+interface RatingProps extends BaseComponentProps {
+    /**
+     * The rating value (0-5)
+     */
+    value?: number;
+    /**
+     * Default value for uncontrolled mode
+     */
+    defaultValue?: number;
+    /**
+     * Maximum possible rating value
+     */
+    maxValue?: number;
+    /**
+     * Whether to allow half-star ratings
+     */
+    allowHalf?: boolean;
+    /**
+     * Whether the rating is read-only
+     */
+    readOnly?: boolean;
+    /**
+     * Size variant
+     */
+    size?: Size;
+    /**
+     * Color theme
+     */
+    color?: ThemeColor;
+    /**
+     * Optional callback when rating changes
+     */
+    onChange?: (value: number) => void;
+    /**
+     * Optional label for the rating component (for accessibility)
+     */
+    label?: string;
+    /**
+     * ID for the rating component (for accessibility)
+     */
+    id?: string;
+    /**
+     * Whether to use the vanilla JS implementation
+     */
+    useVanillaJS?: boolean;
+}
+/**
+ * PhotoViewer component properties
+ */
+/**
+ * Interface for image objects used in PhotoViewer
+ */
+interface ImageType {
+    src: string;
+    alt?: string;
+    thumbnail?: string;
+    title?: string;
+    description?: string;
+    date?: string;
+    author?: string;
+    tags?: string[];
+}
+interface PhotoViewerProps extends BaseComponentProps {
+    /**
+     * Array of image URLs or image objects to display in the viewer
+     */
+    images: (string | ImageType)[];
+    /**
+     * Index of the image to show first
+     * @default 0
+     */
+    startIndex?: number;
+    /**
+     * Additional className for the root element
+     */
+    className?: string;
+    /**
+     * Whether the viewer is disabled
+     * @default false
+     */
+    disabled?: boolean;
+    /**
+     * Enable keyboard navigation (arrow keys, escape)
+     * @default true
+     */
+    enableKeyboardNavigation?: boolean;
+    /**
+     * Enable touch gestures for mobile devices
+     * @default true
+     */
+    enableGestures?: boolean;
+    /**
+     * Enable fullscreen mode
+     * @default true
+     */
+    enableFullscreen?: boolean;
+    /**
+     * Position of thumbnails
+     * @default 'bottom'
+     */
+    thumbnailPosition?: 'bottom' | 'top' | 'left' | 'right' | 'none';
+    /**
+     * Callback when image changes
+     */
+    onImageChange?: (index: number) => void;
+    /**
+     * Callback when viewer is closed
+     */
+    onClose?: () => void;
+}
+/**
+ * Card component props
+ */
+interface CardProps extends BaseComponentProps {
+    /**
+     * Card header content
+     */
+    header?: ReactNode;
+    /**
+     * Card image source URL
+     */
+    image?: string;
+    /**
+     * Alternative text for the image
+     */
+    imageAlt?: string;
+    /**
+     * Card title
+     */
+    title?: ReactNode;
+    /**
+     * Card text content
+     */
+    text?: ReactNode;
+    /**
+     * Card actions (buttons, links, etc.)
+     */
+    actions?: ReactNode;
+    /**
+     * Card icon
+     */
+    icon?: ReactNode;
+    /**
+     * Card footer content
+     */
+    footer?: ReactNode;
+    /**
+     * Row layout (horizontal card)
+     */
+    row?: boolean;
+    /**
+     * Flat style (no padding on image container)
+     */
+    flat?: boolean;
+    /**
+     * Active state
+     */
+    active?: boolean;
+    /**
+     * Card content (body)
+     */
+    children?: ReactNode;
+    /**
+     * Optional click handler
+     */
+    onClick?: (event: React.MouseEvent<HTMLDivElement>) => void;
+}
+/**
+ * Elevation Card component props
+ */
+interface ElevationCardProps extends CardProps {
+    /**
+     * CSS class for elevation effect
+     */
+    elevationClass?: string;
+}
+/**
+ * Card hook options
+ */
+interface UseCardOptions {
+    /**
+     * Enable elevation effect on hover
+     */
+    elevationEffect?: boolean;
+    /**
+     * CSS class for elevation effect
+     */
+    elevationClass?: string;
+    /**
+     * Enable flip effect
+     */
+    flipEffect?: boolean;
+    /**
+     * Trigger for flip effect: 'click' or 'hover'
+     */
+    flipTrigger?: 'click' | 'hover';
+    /**
+     * Make card focusable and add focus effect
+     */
+    focusEffect?: boolean;
+    /**
+     * Make card clickable
+     */
+    clickable?: boolean;
+    /**
+     * Click handler for clickable card
+     */
+    onClick?: (event: React.MouseEvent) => void;
+}
+/**
+ * Card hook return value
+ */
+interface UseCardReturn {
+    /**
+     * Reference to the card element
+     */
+    cardRef: React.RefObject<HTMLDivElement>;
+    /**
+     * Reference to the front side of a flip card
+     */
+    frontRef: React.RefObject<HTMLDivElement>;
+    /**
+     * Reference to the back side of a flip card
+     */
+    backRef: React.RefObject<HTMLDivElement>;
+    /**
+     * Whether the card is flipped
+     */
+    isFlipped: boolean;
+    /**
+     * Whether the card is elevated
+     */
+    isElevated: boolean;
+    /**
+     * Whether the card is focused
+     */
+    isFocused: boolean;
+    /**
+     * Whether the card is hovered
+     */
+    isHovered: boolean;
+    /**
+     * Click event handler
+     */
+    handleClick: (event: React.MouseEvent) => void;
+    /**
+     * Keyboard event handler
+     */
+    handleKeyDown: (event: React.KeyboardEvent) => void;
+    /**
+     * Mouse enter event handler
+     */
+    handleMouseEnter: () => void;
+    /**
+     * Mouse leave event handler
+     */
+    handleMouseLeave: () => void;
+    /**
+     * Focus event handler
+     */
+    handleFocus: () => void;
+    /**
+     * Blur event handler
+     */
+    handleBlur: () => void;
+    /**
+     * Get all card props combined
+     */
+    getCardProps: () => {
+        className: string;
+        ref: React.RefObject<HTMLDivElement>;
+        tabIndex?: number;
+        role?: string;
+        onMouseEnter: () => void;
+        onMouseLeave: () => void;
+        onFocus: () => void;
+        onBlur: () => void;
+        onClick: (event: React.MouseEvent) => void;
+        onKeyDown: (event: React.KeyboardEvent) => void;
+    };
+}
+
+type ButtonAsProp = {
+    as?: ElementType;
+    to?: string;
+    href?: string;
+    [key: string]: any;
+};
+declare const Button: React__default.ForwardRefExoticComponent<Omit<ButtonProps & ButtonAsProp, "ref"> & React__default.RefAttributes<HTMLButtonElement>>;
+
+type __lib_types_AccordionState = AccordionState;
+type __lib_types_AvatarGroupProps = AvatarGroupProps;
+type __lib_types_AvatarProps = AvatarProps;
+type __lib_types_AvatarSize = AvatarSize;
+type __lib_types_BadgeProps = BadgeProps;
+type __lib_types_BaseComponentProps = BaseComponentProps;
+type __lib_types_BreadcrumbInstance = BreadcrumbInstance;
+type __lib_types_ButtonProps = ButtonProps;
+type __lib_types_CalloutProps = CalloutProps;
+type __lib_types_CardProps = CardProps;
+type __lib_types_CheckboxProps = CheckboxProps;
+type __lib_types_DataTableColumn = DataTableColumn;
+type __lib_types_DataTableProps = DataTableProps;
+type __lib_types_DropdownDividerProps = DropdownDividerProps;
+type __lib_types_DropdownHeaderProps = DropdownHeaderProps;
+type __lib_types_DropdownItemProps = DropdownItemProps;
+type __lib_types_DropdownPlacement = DropdownPlacement;
+type __lib_types_DropdownProps = DropdownProps;
+type __lib_types_DropdownTrigger = DropdownTrigger;
+type __lib_types_EdgePanelMode = EdgePanelMode;
+type __lib_types_EdgePanelPosition = EdgePanelPosition;
+type __lib_types_EdgePanelProps = EdgePanelProps;
+type __lib_types_ElementRefs = ElementRefs;
+type __lib_types_ElevationCardProps = ElevationCardProps;
+type __lib_types_FormGroupProps = FormGroupProps;
+type __lib_types_FormProps = FormProps;
+type __lib_types_HeroAlignment = HeroAlignment;
+type __lib_types_HeroProps = HeroProps;
+type __lib_types_IconPosition = IconPosition;
+type __lib_types_ImageType = ImageType;
+type __lib_types_InputProps = InputProps;
+type __lib_types_ListGroupProps = ListGroupProps;
+type __lib_types_ListProps = ListProps;
+type __lib_types_MegaMenuColumnProps = MegaMenuColumnProps;
+type __lib_types_MegaMenuLinkProps = MegaMenuLinkProps;
+type __lib_types_MegaMenuProps = MegaMenuProps;
+type __lib_types_MenuItemProps = MenuItemProps;
+type __lib_types_MenuProps = MenuProps;
+type __lib_types_MessageItem = MessageItem;
+type __lib_types_MessagesProps = MessagesProps;
+type __lib_types_ModalProps = ModalProps;
+type __lib_types_NavAlignment = NavAlignment;
+type __lib_types_NavDropdownProps = NavDropdownProps;
+type __lib_types_NavItemProps = NavItemProps;
+type __lib_types_NavProps = NavProps;
+type __lib_types_NavVariant = NavVariant;
+type __lib_types_NavbarPosition = NavbarPosition;
+type __lib_types_NavbarProps = NavbarProps;
+type __lib_types_PaginationProps = PaginationProps;
+type __lib_types_PhotoViewerProps = PhotoViewerProps;
+type __lib_types_PopoverProps = PopoverProps;
+type __lib_types_PopoverTriggerProps = PopoverTriggerProps;
+type __lib_types_ProgressProps = ProgressProps;
+type __lib_types_RadioProps = RadioProps;
+type __lib_types_RatingProps = RatingProps;
+type __lib_types_SelectOption = SelectOption;
+type __lib_types_SelectProps = SelectProps;
+type __lib_types_SideMenuItemProps = SideMenuItemProps;
+type __lib_types_SideMenuListProps = SideMenuListProps;
+type __lib_types_SideMenuProps = SideMenuProps;
+type __lib_types_Size = Size;
+type __lib_types_SortConfig = SortConfig;
+type __lib_types_SpinnerProps = SpinnerProps;
+type __lib_types_StateModifier = StateModifier;
+type __lib_types_TextareaProps = TextareaProps;
+type __lib_types_ThemeColor = ThemeColor;
+type __lib_types_TodoItem = TodoItem;
+type __lib_types_TodoProps = TodoProps;
+type __lib_types_UseCardOptions = UseCardOptions;
+type __lib_types_UseCardReturn = UseCardReturn;
+type __lib_types_Variant = Variant;
+type __lib_types_listvariant = listvariant;
+declare namespace __lib_types {
+  export type { AccordionProps$1 as AccordionProps, __lib_types_AccordionState as AccordionState, __lib_types_AvatarGroupProps as AvatarGroupProps, __lib_types_AvatarProps as AvatarProps, __lib_types_AvatarSize as AvatarSize, __lib_types_BadgeProps as BadgeProps, __lib_types_BaseComponentProps as BaseComponentProps, __lib_types_BreadcrumbInstance as BreadcrumbInstance, BreadcrumbItem$2 as BreadcrumbItem, BreadcrumbOptions$1 as BreadcrumbOptions, __lib_types_ButtonProps as ButtonProps, __lib_types_CalloutProps as CalloutProps, __lib_types_CardProps as CardProps, __lib_types_CheckboxProps as CheckboxProps, __lib_types_DataTableColumn as DataTableColumn, __lib_types_DataTableProps as DataTableProps, __lib_types_DropdownDividerProps as DropdownDividerProps, __lib_types_DropdownHeaderProps as DropdownHeaderProps, __lib_types_DropdownItemProps as DropdownItemProps, __lib_types_DropdownPlacement as DropdownPlacement, __lib_types_DropdownProps as DropdownProps, __lib_types_DropdownTrigger as DropdownTrigger, __lib_types_EdgePanelMode as EdgePanelMode, __lib_types_EdgePanelPosition as EdgePanelPosition, __lib_types_EdgePanelProps as EdgePanelProps, __lib_types_ElementRefs as ElementRefs, __lib_types_ElevationCardProps as ElevationCardProps, __lib_types_FormGroupProps as FormGroupProps, __lib_types_FormProps as FormProps, __lib_types_HeroAlignment as HeroAlignment, __lib_types_HeroProps as HeroProps, __lib_types_IconPosition as IconPosition, __lib_types_ImageType as ImageType, __lib_types_InputProps as InputProps, __lib_types_ListGroupProps as ListGroupProps, __lib_types_ListProps as ListProps, __lib_types_MegaMenuColumnProps as MegaMenuColumnProps, __lib_types_MegaMenuLinkProps as MegaMenuLinkProps, __lib_types_MegaMenuProps as MegaMenuProps, __lib_types_MenuItemProps as MenuItemProps, __lib_types_MenuProps as MenuProps, __lib_types_MessageItem as MessageItem, __lib_types_MessagesProps as MessagesProps, __lib_types_ModalProps as ModalProps, __lib_types_NavAlignment as NavAlignment, __lib_types_NavDropdownProps as NavDropdownProps, __lib_types_NavItemProps as NavItemProps, __lib_types_NavProps as NavProps, __lib_types_NavVariant as NavVariant, __lib_types_NavbarPosition as NavbarPosition, __lib_types_NavbarProps as NavbarProps, __lib_types_PaginationProps as PaginationProps, __lib_types_PhotoViewerProps as PhotoViewerProps, __lib_types_PopoverProps as PopoverProps, __lib_types_PopoverTriggerProps as PopoverTriggerProps, __lib_types_ProgressProps as ProgressProps, __lib_types_RadioProps as RadioProps, __lib_types_RatingProps as RatingProps, __lib_types_SelectOption as SelectOption, __lib_types_SelectProps as SelectProps, __lib_types_SideMenuItemProps as SideMenuItemProps, __lib_types_SideMenuListProps as SideMenuListProps, __lib_types_SideMenuProps as SideMenuProps, __lib_types_Size as Size, __lib_types_SortConfig as SortConfig, __lib_types_SpinnerProps as SpinnerProps, __lib_types_StateModifier as StateModifier, __lib_types_TextareaProps as TextareaProps, __lib_types_ThemeColor as ThemeColor, __lib_types_TodoItem as TodoItem, __lib_types_TodoProps as TodoProps, __lib_types_UseCardOptions as UseCardOptions, __lib_types_UseCardReturn as UseCardReturn, __lib_types_Variant as Variant, __lib_types_listvariant as listvariant };
+}
+
+/**
+ * Default theme colors for components
+ */
+declare const THEME_COLORS: ThemeColor[];
+/**
+ * Default sizes for components
+ */
+declare const SIZES: Size[];
+/**
+ * CSS class prefixes
+ */
+declare const CLASS_PREFIX: {
+    COMPONENT: string;
+    UTILITY: string;
+    LAYOUT: string;
+    OBJECT: string;
+};
+/**
+ * Button-specific constants
+ */
+declare const BUTTON: {
+    BASE_CLASS: string;
+    ICON_CLASS: string;
+    VARIANT_PREFIX: string;
+};
+/**
+ * Callout-specific constants
+ */
+declare const CALLOUT: {
+    BASE_CLASS: string;
+    CONTENT_CLASS: string;
+    ICON_CLASS: string;
+    MESSAGE_CLASS: string;
+    TITLE_CLASS: string;
+    TEXT_CLASS: string;
+    ACTIONS_CLASS: string;
+    CLOSE_BTN_CLASS: string;
+    VARIANT_PREFIX: string;
+    CLASSES: {
+        ONELINE: string;
+        TOAST: string;
+        HIDE: string;
+    };
+};
+/**
+ * Accordion-specific constants
+ */
+declare const ACCORDION: {
+    SELECTORS: {
+        ACCORDION: string;
+        HEADER: string;
+        PANEL: string;
+        BODY: string;
+    };
+    CLASSES: {
+        IS_OPEN: string;
+        IS_ANIMATING: string;
+        IS_DISABLED: string;
+    };
+    ATTRIBUTES: {
+        ARIA_EXPANDED: string;
+        ARIA_CONTROLS: string;
+        ARIA_HIDDEN: string;
+        ROLE: string;
+    };
+    CSS_VARS: {
+        PANEL_HEIGHT: string;
+    };
+};
+/**
+ * Badge-specific constants
+ */
+declare const BADGE: {
+    BASE_CLASS: string;
+    ICON_CLASS: string;
+    VARIANT_PREFIX: string;
+    SIZE_PREFIX: string;
+};
+/**
+ * List-specific constants
+ */
+declare const LIST: {
+    BASE_CLASS: string;
+    ITEM_CLASS: string;
+    VARIANT_PREFIX: string;
+    SIZE_PREFIX: string;
+    CLASSES: {
+        ORDERED: string;
+        INLINE: string;
+    };
+};
+/**
+ * List Group-specific constants
+ */
+declare const LIST_GROUP: {
+    BASE_CLASS: string;
+    ITEM_CLASS: string;
+    VARIANT_PREFIX: string;
+    SIZE_PREFIX: string;
+};
+/**
+ * Breadcrumb-specific constants
+ */
+declare const BREADCRUMB: {
+    SELECTORS: {
+        BREADCRUMB: string;
+        ITEM: string;
+        LINK: string;
+    };
+    CLASSES: {
+        BASE: string;
+        ITEM: string;
+        LINK: string;
+        ACTIVE: string;
+    };
+    DEFAULTS: {
+        DIVIDER: string;
+    };
+};
+/**
+ * Countdown-specific constants
+ */
+declare const COUNTDOWN: {
+    SELECTORS: {
+        COUNTDOWN: string;
+        TIME: string;
+        TIME_COUNT: string;
+        TIME_LABEL: string;
+        SEPARATOR: string;
+    };
+    CLASSES: {
+        BASE: string;
+        FOCUSED: string;
+    };
+    DEFAULTS: {
+        SEPARATOR: string;
+        SHOW: string[];
+    };
+};
+/**
+ * Hero-specific constants
+ */
+declare const HERO: {
+    SELECTORS: {
+        HERO: string;
+        CONTAINER: string;
+        GRID: string;
+        CONTENT: string;
+        SUBTITLE: string;
+        TITLE: string;
+        TEXT: string;
+        ACTIONS: string;
+        IMAGE: string;
+        BG: string;
+        BG_IMAGE: string;
+        OVERLAY: string;
+        IMAGE_WRAPPER: string;
+    };
+    CLASSES: {
+        CENTER: string;
+        RIGHT: string;
+        LEFT: string;
+        FULL_VH: string;
+    };
+};
+/**
+ * Tooltip-specific constants
+ */
+declare const TOOLTIP: {
+    SELECTORS: {
+        TOOLTIP: string;
+        TRIGGER: string;
+        CONTENT: string;
+        ARROW: string;
+    };
+    CLASSES: {
+        IS_ACTIVE: string;
+        TOP: string;
+        BOTTOM: string;
+        LEFT: string;
+        RIGHT: string;
+        TOP_LEFT: string;
+        TOP_RIGHT: string;
+        BOTTOM_LEFT: string;
+        BOTTOM_RIGHT: string;
+    };
+    ATTRIBUTES: {
+        POSITION: string;
+        TRIGGER: string;
+        CONTENT_ID: string;
+    };
+    DEFAULTS: {
+        TRIGGER: string;
+        POSITION: string;
+        OFFSET: number;
+        DELAY: number;
+    };
+};
+/**
+ * Popover-specific constants
+ */
+declare const POPOVER: {
+    SELECTORS: {
+        POPOVER: string;
+        TRIGGER: string;
+        CONTENT: string;
+        CONTENT_INNER: string;
+        ARROW: string;
+    };
+    CLASSES: {
+        IS_OPEN: string;
+        TOP: string;
+        BOTTOM: string;
+        LEFT: string;
+        RIGHT: string;
+        AUTO: string;
+    };
+    ATTRIBUTES: {
+        POSITION: string;
+        TRIGGER: string;
+        CONTENT_ID: string;
+    };
+    DEFAULTS: {
+        TRIGGER: string;
+        POSITION: string;
+        OFFSET: number;
+        DELAY: number;
+    };
+};
+/**
+ * Toggle-specific constants
+ */
+declare const TOGGLE: {
+    SELECTORS: {
+        TOGGLE: string;
+    };
+    CLASSES: {
+        IS_ON: string;
+    };
+};
+/**
+ * Tab-specific constants
+ */
+declare const TAB: {
+    SELECTORS: {
+        TAB: string;
+        NAV_ITEMS: string;
+        NAV_BTN: string;
+        PANELS: string;
+        PANEL_BODIES: string;
+    };
+    CLASSES: {
+        ACTIVE: string;
+    };
+    DEFAULTS: {
+        ACTIVE_INDEX: number;
+    };
+};
+/**
+ * Steps-specific constants
+ */
+declare const STEPS: {
+    SELECTORS: {
+        STEPS: string;
+        ITEM: string;
+        LINE: string;
+        CONTENT: string;
+        NUMBER: string;
+        TEXT: string;
+    };
+    CLASSES: {
+        ACTIVE: string;
+        VERTICAL: string;
+        COMPLETED: string;
+    };
+};
+/**
+ * Testimonial-specific constants
+ */
+declare const TESTIMONIAL: {
+    SELECTORS: {
+        TESTIMONIAL: string;
+        QUOTE: string;
+        AUTHOR: string;
+        AUTHOR_AVATAR: string;
+        AUTHOR_INFO: string;
+        AUTHOR_NAME: string;
+        AUTHOR_ROLE: string;
+    };
+    CLASSES: {
+        SMALL: string;
+        LARGE: string;
+    };
+};
+/**
+ * Spinner-specific constants
+ */
+declare const SPINNER: {
+    SELECTORS: {
+        SPINNER: string;
+    };
+    CLASSES: {
+        PRIMARY: string;
+        SECONDARY: string;
+        SUCCESS: string;
+        INFO: string;
+        WARNING: string;
+        DANGER: string;
+        LIGHT: string;
+        DARK: string;
+        SMALL: string;
+        LARGE: string;
+    };
+    VISUALLY_HIDDEN: string;
+};
+/**
+ * SectionIntro-specific constants
+ */
+declare const SECTION_INTRO: {
+    SELECTORS: {
+        SECTION_INTRO: string;
+        LABEL: string;
+        TITLE: string;
+        TEXT: string;
+        ACTIONS: string;
+    };
+    CLASSES: {
+        CENTER: string;
+        LARGE: string;
+        SMALL: string;
+    };
+};
+/**
+ * River-specific constants
+ */
+declare const RIVER: {
+    SELECTORS: {
+        RIVER: string;
+        CONTAINER: string;
+        ROW: string;
+        CONTENT: string;
+        CONTENT_COL: string;
+        CONTENT_COL_TITLE: string;
+        CONTENT_COL_TEXT: string;
+        TITLE: string;
+        TEXT: string;
+        ACTIONS: string;
+        VISUAL: string;
+        IMAGE_WRAPPER: string;
+        IMAGE: string;
+        BG: string;
+        BG_IMAGE: string;
+        OVERLAY: string;
+    };
+    CLASSES: {
+        CENTER: string;
+        BREAKOUT: string;
+        REVERSE: string;
+    };
+    ATTRIBUTES: {
+        CONTENT_WIDTH: string;
+    };
+};
+/**
+ * Upload-specific constants
+ */
+declare const UPLOAD: {
+    SELECTORS: {
+        UPLOAD: string;
+        INNER: string;
+        ICON: string;
+        TITLE: string;
+        TEXT: string;
+        BUTTON: string;
+        HELPER_TEXT: string;
+        LOADER: string;
+        LOADER_STATUS: string;
+        LOADER_TITLE: string;
+        LOADER_PROGRESS: string;
+        LOADER_PAR: string;
+        LOADER_TIME: string;
+        LOADER_CONTROL: string;
+        LOADER_BAR: string;
+        LOADER_CLOSE: string;
+    };
+    CLASSES: {
+        DISABLED: string;
+        ERROR: string;
+        SUCCESS: string;
+        LOADING: string;
+        DRAGGING: string;
+    };
+    ATTRIBUTES: {
+        PERCENTAGE: string;
+    };
+};
+/**
+ * Navbar-specific constants
+ */
+declare const NAVBAR: {
+    SELECTORS: {
+        NAVBAR: string;
+        CONTAINER: string;
+        BRAND: string;
+        COLLAPSE: string;
+        TOGGLER: string;
+        TOGGLER_ICON: string;
+    };
+    CLASSES: {
+        BASE: string;
+        CONTAINER: string;
+        BRAND: string;
+        COLLAPSE: string;
+        TOGGLER: string;
+        TOGGLER_ICON: string;
+        FIXED: string;
+        FIXED_BOTTOM: string;
+        COLLAPSIBLE: string;
+        EXPANDED: string;
+        BACKDROP: string;
+    };
+    ATTRIBUTES: {
+        NAVBAR: string;
+        COLLAPSIBLE: string;
+        EXPANDED: string;
+        POSITION: string;
+        BACKDROP: string;
+        AUTO_CLOSE: string;
+        KEYBOARD: string;
+    };
+    DEFAULTS: {
+        POSITION: string;
+        COLLAPSIBLE: boolean;
+        EXPANDED: boolean;
+        BACKDROP: boolean;
+        AUTO_CLOSE: boolean;
+        KEYBOARD: boolean;
+        ARIA_LABEL: string;
+    };
+};
+/**
+ * Nav-specific constants
+ */
+declare const NAV: {
+    SELECTORS: {
+        NAV: string;
+        ITEM: string;
+        LINK: string;
+        DROPDOWN: string;
+        DROPDOWN_MENU: string;
+        MEGA_MENU: string;
+        ICON: string;
+    };
+    CLASSES: {
+        END: string;
+        CENTER: string;
+        ACTIVE: string;
+        DISABLED: string;
+    };
+};
+/**
+ * SideMenu-specific constants
+ */
+declare const SIDE_MENU: {
+    SELECTORS: {
+        SIDE_MENU: string;
+        WRAPPER: string;
+        INNER: string;
+        TITLE: string;
+        TOGGLER: string;
+        TOGGLER_ICON: string;
+        LIST: string;
+        ITEM: string;
+        LINK: string;
+        LINK_ICON: string;
+        LINK_TEXT: string;
+    };
+    CLASSES: {
+        BASE: string;
+        WRAPPER: string;
+        INNER: string;
+        TITLE: string;
+        TOGGLER: string;
+        TOGGLER_ICON: string;
+        LIST: string;
+        ITEM: string;
+        LINK: string;
+        LINK_ICON: string;
+        LINK_TEXT: string;
+        IS_OPEN: string;
+        ACTIVE: string;
+        DISABLED: string;
+    };
+    ATTRIBUTES: {
+        SIDE_MENU: string;
+        COLLAPSIBLE: string;
+        OPEN: string;
+        TITLE: string;
+    };
+    DEFAULTS: {
+        COLLAPSIBLE: boolean;
+        OPEN: boolean;
+        TOGGLE_ICON: string;
+    };
+};
+/**
+ * EdgePanel-specific constants
+ */
+/**
+ * Rating-specific constants
+ */
+declare const RATING: {
+    SELECTORS: {
+        RATING: string;
+        STAR: string;
+        STAR_FULL: string;
+        STAR_HALF: string;
+    };
+    CLASSES: {
+        FULL: string;
+        HALF: string;
+        SMALL: string;
+        LARGE: string;
+    };
+    ATTRIBUTES: {
+        READONLY: string;
+        VALUE: string;
+    };
+};
+declare const EDGE_PANEL: {
+    SELECTORS: {
+        PANEL: string;
+        BACKDROP: string;
+        CONTAINER: string;
+        HEADER: string;
+        BODY: string;
+        CLOSE: string;
+    };
+    CLASSES: {
+        BASE: string;
+        START: string;
+        END: string;
+        TOP: string;
+        BOTTOM: string;
+        IS_OPEN: string;
+    };
+    TRANSFORM_VALUES: {
+        start: string;
+        end: string;
+        top: string;
+        bottom: string;
+    };
+    ANIMATION_DURATION: number;
+};
+/**
+ * DataTable-specific constants
+ */
+declare const DATA_TABLE_CLASSES: {
+    base: string;
+    container: string;
+    tableWrapper: string;
+    header: string;
+    headerCell: string;
+    headerContent: string;
+    sortable: string;
+    sortIcon: string;
+    row: string;
+    cell: string;
+    loadingCell: string;
+    loadingIndicator: string;
+    emptyCell: string;
+    toolbar: string;
+    search: string;
+    searchInput: string;
+    pagination: string;
+    striped: string;
+    bordered: string;
+    dense: string;
+    loading: string;
+    open: string;
+};
+/**
+ * DataTable-specific selectors
+ */
+declare const DATA_TABLE_SELECTORS: {
+    TABLE: string;
+    HEADER: string;
+    HEADER_CELL: string;
+    ROW: string;
+    CELL: string;
+    PAGINATION: string;
+    PAGINATION_BUTTON: string;
+    SEARCH_INPUT: string;
+};
+/**
+ * Pagination-specific constants
+ */
+declare const PAGINATION_DEFAULTS: {
+    currentPage: number;
+    totalPages: number;
+    siblingCount: number;
+    showFirstLastButtons: boolean;
+    showPrevNextButtons: boolean;
+    size: Size;
+};
+/**
+ * Todo-specific constants
+ */
+declare const TODO: {
+    SELECTORS: {
+        TODO: string;
+        TITLE: string;
+        LIST: string;
+        ITEM: string;
+        ITEM_CONTENT: string;
+        ITEM_TEXT: string;
+        ITEM_ACTIONS: string;
+        CHECKBOX: string;
+        DELETE_BUTTON: string;
+        FORM: string;
+        INPUT: string;
+        ADD_BUTTON: string;
+    };
+    CLASSES: {
+        BASE: string;
+        ITEM: string;
+        COMPLETED: string;
+        SMALL: string;
+        LARGE: string;
+    };
+};
+/**
+ * Form-specific constants
+ */
+declare const FORM: {
+    SELECTORS: {
+        FORM: string;
+        GROUP: string;
+        LABEL: string;
+        HELPER: string;
+        FIELD: string;
+        REQUIRED: string;
+    };
+    CLASSES: {
+        BASE: string;
+        DISABLED: string;
+    };
+};
+/**
+ * Form Group-specific constants
+ */
+declare const FORM_GROUP: {
+    SELECTORS: {
+        GROUP: string;
+        LABEL: string;
+        FIELD: string;
+        HELPER: string;
+        REQUIRED: string;
+    };
+    CLASSES: {
+        BASE: string;
+        SMALL: string;
+        LARGE: string;
+        INVALID: string;
+        VALID: string;
+        DISABLED: string;
+    };
+};
+/**
+ * Input-specific constants
+ */
+declare const INPUT: {
+    SELECTORS: {
+        INPUT: string;
+    };
+    CLASSES: {
+        BASE: string;
+        SMALL: string;
+        LARGE: string;
+        INVALID: string;
+        VALID: string;
+        DISABLED: string;
+    };
+};
+/**
+ * Radio-specific constants
+ */
+declare const RADIO: {
+    SELECTORS: {
+        RADIO: string;
+        INPUT: string;
+        LABEL: string;
+    };
+    CLASSES: {
+        BASE: string;
+        INVALID: string;
+        VALID: string;
+        DISABLED: string;
+    };
+};
+/**
+ * Checkbox-specific constants - extend existing checkbox constants
+ */
+/**
+ * Card-specific constants
+ */
+declare const CARD: {
+    SELECTORS: {
+        CARD: string;
+        HEADER: string;
+        BODY: string;
+        IMAGE: string;
+        TITLE: string;
+        TEXT: string;
+        ACTIONS: string;
+        ICON: string;
+        FOOTER: string;
+    };
+    CLASSES: {
+        BASE: string;
+        ROW: string;
+        FLAT: string;
+        ACTIVE: string;
+        FLIPPED: string;
+        FOCUSED: string;
+        CLICKABLE: string;
+    };
+    DEFAULTS: {
+        HOVER: boolean;
+    };
+};
+/**
+ * Select-specific constants
+ */
+declare const SELECT: {
+    SELECTORS: {
+        SELECT: string;
+        SELECTED: string;
+        SELECT_BODY: string;
+        SELECT_PANEL: string;
+        SELECT_ITEMS: string;
+        SELECT_ITEM: string;
+        ITEM_LABEL: string;
+        ITEM_INPUT: string;
+        OPTION: string;
+    };
+    CLASSES: {
+        BASE: string;
+        SELECTED: string;
+        SELECT_BODY: string;
+        SELECT_PANEL: string;
+        SELECT_ITEMS: string;
+        SELECT_ITEM: string;
+        TOGGLE_ICON: string;
+        ICON_CARET: string;
+        SMALL: string;
+        LARGE: string;
+        INVALID: string;
+        VALID: string;
+        DISABLED: string;
+        IS_OPEN: string;
+    };
+};
+/**
+ * Textarea-specific constants
+ */
+declare const TEXTAREA: {
+    SELECTORS: {
+        TEXTAREA: string;
+    };
+    CLASSES: {
+        BASE: string;
+        SMALL: string;
+        LARGE: string;
+        INVALID: string;
+        VALID: string;
+        DISABLED: string;
+    };
+};
+/**
+ * Avatar-specific constants
+ */
+declare const AVATAR: {
+    SELECTORS: {
+        AVATAR: string;
+        IMAGE: string;
+        INITIALS: string;
+        ICON: string;
+    };
+    CLASSES: {
+        BASE: string;
+        XS: string;
+        SM: string;
+        MD: string;
+        LG: string;
+        XL: string;
+        CIRCLE: string;
+    };
+};
+/**
+ * Avatar Group-specific constants
+ */
+declare const AVATAR_GROUP: {
+    SELECTORS: {
+        GROUP: string;
+        MORE: string;
+    };
+    CLASSES: {
+        BASE: string;
+        STACKED: string;
+        MORE: string;
+    };
+};
+/**
+ * Modal component constants
+ */
+declare const MODAL: {
+    SELECTORS: {
+        MODAL: string;
+        OPEN_BUTTON: string;
+        CLOSE_BUTTONS: string;
+        DIALOG: string;
+        BACKDROP: string;
+    };
+    CLASSES: {
+        IS_OPEN: string;
+    };
+    DEFAULT_OPTIONS: {
+        openELm: string;
+        closeELms: string;
+        modalDialogELm: string;
+        backdropELm: string;
+        backdrop: boolean;
+        keyboard: boolean;
+    };
+};
+/**
+ * Messages-specific constants
+ */
+declare const MESSAGES: {
+    SELECTORS: {
+        MESSAGES: string;
+        BODY: string;
+        CONTENT: string;
+        AVATAR: string;
+        ITEMS: string;
+        TEXT: string;
+        FILE: string;
+        IMAGE: string;
+        FORM: string;
+        INPUT: string;
+    };
+    CLASSES: {
+        BASE: string;
+        BODY: string;
+        CONTENT: string;
+        CONTENT_SELF: string;
+        AVATAR: string;
+        ITEMS: string;
+        NAME: string;
+        TEXT: string;
+        TIME: string;
+        FILE: string;
+        FILE_ICON: string;
+        FILE_DETAILS: string;
+        FILE_NAME: string;
+        FILE_SIZE: string;
+        IMAGE: string;
+        FORM: string;
+        INPUT_GROUP: string;
+        INPUT: string;
+        OPTIONS: string;
+        OPTION: string;
+        OPTION_ICON: string;
+        SUBMIT: string;
+    };
+};
+/**
+ * Dropdown-specific constants
+ */
+declare const DROPDOWN: {
+    SELECTORS: {
+        DROPDOWN: string;
+        TOGGLE: string;
+        MENU: string;
+        MENU_WRAPPER: string;
+        MENU_INNER: string;
+        MENU_ITEM: string;
+        DIVIDER: string;
+        HEADER: string;
+    };
+    CLASSES: {
+        IS_OPEN: string;
+        IS_ACTIVE: string;
+        IS_DISABLED: string;
+    };
+    DEFAULTS: {
+        PLACEMENT: string;
+        TRIGGER: string;
+        OFFSET: number;
+        MIN_WIDTH: number;
+        ANIMATION_DURATION: string;
+        ANIMATION_TIMING: string;
+    };
+};
+/**
+ * DatePicker-specific constants
+ */
+/**
+ * Progress-specific constants
+ */
+declare const PROGRESS: {
+    SELECTORS: {
+        PROGRESS: string;
+        BAR: string;
+    };
+    CLASSES: {
+        BASE: string;
+        BAR: string;
+        SM: string;
+        MD: string;
+        LG: string;
+    };
+    ATTRIBUTES: {
+        ARIA_VALUEMIN: string;
+        ARIA_VALUEMAX: string;
+        ARIA_VALUENOW: string;
+        ARIA_LABEL: string;
+    };
+    CSS_VARS: {
+        PERCENTAGE: string;
+    };
+    DEFAULTS: {
+        ARIA_LABEL: string;
+    };
+};
+declare const DATEPICKER: {
+    SELECTORS: {
+        DATEPICKER: string;
+        INPUT: string;
+        CALENDAR: string;
+        DAY: string;
+        MONTH: string;
+        YEAR: string;
+        HEADER: string;
+        BODY: string;
+        FOOTER: string;
+        WEEKDAYS: string;
+        TODAY_BUTTON: string;
+        CLEAR_BUTTON: string;
+        CLOSE_BUTTON: string;
+        NAV_BUTTON: string;
+        VIEW_SWITCH: string;
+    };
+    CLASSES: {
+        IS_OPEN: string;
+        IS_DISABLED: string;
+        IS_SELECTED: string;
+        IS_TODAY: string;
+        INLINE: string;
+    };
+    ATTRIBUTES: {
+        FORMAT: string;
+        MIN_DATE: string;
+        MAX_DATE: string;
+        INLINE: string;
+        PLACEMENT: string;
+        CLEARABLE: string;
+        SHOW_TODAY: string;
+        SHOW_WEEK_NUMBERS: string;
+    };
+    DEFAULTS: {
+        FORMAT: string;
+        PLACEMENT: string;
+        CLEARABLE: boolean;
+        SHOW_TODAY_BUTTON: boolean;
+        SHOW_WEEK_NUMBERS: boolean;
+        INLINE: boolean;
+    };
+};
+/**
+ * PhotoViewer component constants
+ */
+declare const PHOTOVIEWER: {
+    SELECTOR: string;
+    CLASS: string;
+    DEFAULTS: {
+        startIndex: number;
+        zoomLevel: number;
+        fullscreen: boolean;
+    };
+};
+
+declare const __lib_constants_ACCORDION: typeof ACCORDION;
+declare const __lib_constants_AVATAR: typeof AVATAR;
+declare const __lib_constants_AVATAR_GROUP: typeof AVATAR_GROUP;
+declare const __lib_constants_BADGE: typeof BADGE;
+declare const __lib_constants_BREADCRUMB: typeof BREADCRUMB;
+declare const __lib_constants_BUTTON: typeof BUTTON;
+declare const __lib_constants_CALLOUT: typeof CALLOUT;
+declare const __lib_constants_CARD: typeof CARD;
+declare const __lib_constants_CLASS_PREFIX: typeof CLASS_PREFIX;
+declare const __lib_constants_COUNTDOWN: typeof COUNTDOWN;
+declare const __lib_constants_DATA_TABLE_CLASSES: typeof DATA_TABLE_CLASSES;
+declare const __lib_constants_DATA_TABLE_SELECTORS: typeof DATA_TABLE_SELECTORS;
+declare const __lib_constants_DATEPICKER: typeof DATEPICKER;
+declare const __lib_constants_DROPDOWN: typeof DROPDOWN;
+declare const __lib_constants_EDGE_PANEL: typeof EDGE_PANEL;
+declare const __lib_constants_FORM: typeof FORM;
+declare const __lib_constants_FORM_GROUP: typeof FORM_GROUP;
+declare const __lib_constants_HERO: typeof HERO;
+declare const __lib_constants_INPUT: typeof INPUT;
+declare const __lib_constants_LIST: typeof LIST;
+declare const __lib_constants_LIST_GROUP: typeof LIST_GROUP;
+declare const __lib_constants_MESSAGES: typeof MESSAGES;
+declare const __lib_constants_MODAL: typeof MODAL;
+declare const __lib_constants_NAV: typeof NAV;
+declare const __lib_constants_NAVBAR: typeof NAVBAR;
+declare const __lib_constants_PAGINATION_DEFAULTS: typeof PAGINATION_DEFAULTS;
+declare const __lib_constants_PHOTOVIEWER: typeof PHOTOVIEWER;
+declare const __lib_constants_POPOVER: typeof POPOVER;
+declare const __lib_constants_PROGRESS: typeof PROGRESS;
+declare const __lib_constants_RADIO: typeof RADIO;
+declare const __lib_constants_RATING: typeof RATING;
+declare const __lib_constants_RIVER: typeof RIVER;
+declare const __lib_constants_SECTION_INTRO: typeof SECTION_INTRO;
+declare const __lib_constants_SELECT: typeof SELECT;
+declare const __lib_constants_SIDE_MENU: typeof SIDE_MENU;
+declare const __lib_constants_SIZES: typeof SIZES;
+declare const __lib_constants_SPINNER: typeof SPINNER;
+declare const __lib_constants_STEPS: typeof STEPS;
+declare const __lib_constants_TAB: typeof TAB;
+declare const __lib_constants_TESTIMONIAL: typeof TESTIMONIAL;
+declare const __lib_constants_TEXTAREA: typeof TEXTAREA;
+declare const __lib_constants_THEME_COLORS: typeof THEME_COLORS;
+declare const __lib_constants_TODO: typeof TODO;
+declare const __lib_constants_TOGGLE: typeof TOGGLE;
+declare const __lib_constants_TOOLTIP: typeof TOOLTIP;
+declare const __lib_constants_UPLOAD: typeof UPLOAD;
+declare namespace __lib_constants {
+  export {
+    __lib_constants_ACCORDION as ACCORDION,
+    __lib_constants_AVATAR as AVATAR,
+    __lib_constants_AVATAR_GROUP as AVATAR_GROUP,
+    __lib_constants_BADGE as BADGE,
+    __lib_constants_BREADCRUMB as BREADCRUMB,
+    __lib_constants_BUTTON as BUTTON,
+    __lib_constants_CALLOUT as CALLOUT,
+    __lib_constants_CARD as CARD,
+    __lib_constants_CLASS_PREFIX as CLASS_PREFIX,
+    __lib_constants_COUNTDOWN as COUNTDOWN,
+    __lib_constants_DATA_TABLE_CLASSES as DATA_TABLE_CLASSES,
+    __lib_constants_DATA_TABLE_SELECTORS as DATA_TABLE_SELECTORS,
+    __lib_constants_DATEPICKER as DATEPICKER,
+    __lib_constants_DROPDOWN as DROPDOWN,
+    __lib_constants_EDGE_PANEL as EDGE_PANEL,
+    __lib_constants_FORM as FORM,
+    __lib_constants_FORM_GROUP as FORM_GROUP,
+    __lib_constants_HERO as HERO,
+    __lib_constants_INPUT as INPUT,
+    __lib_constants_LIST as LIST,
+    __lib_constants_LIST_GROUP as LIST_GROUP,
+    __lib_constants_MESSAGES as MESSAGES,
+    __lib_constants_MODAL as MODAL,
+    __lib_constants_NAV as NAV,
+    __lib_constants_NAVBAR as NAVBAR,
+    __lib_constants_PAGINATION_DEFAULTS as PAGINATION_DEFAULTS,
+    __lib_constants_PHOTOVIEWER as PHOTOVIEWER,
+    __lib_constants_POPOVER as POPOVER,
+    __lib_constants_PROGRESS as PROGRESS,
+    __lib_constants_RADIO as RADIO,
+    __lib_constants_RATING as RATING,
+    __lib_constants_RIVER as RIVER,
+    __lib_constants_SECTION_INTRO as SECTION_INTRO,
+    __lib_constants_SELECT as SELECT,
+    __lib_constants_SIDE_MENU as SIDE_MENU,
+    __lib_constants_SIZES as SIZES,
+    __lib_constants_SPINNER as SPINNER,
+    __lib_constants_STEPS as STEPS,
+    __lib_constants_TAB as TAB,
+    __lib_constants_TESTIMONIAL as TESTIMONIAL,
+    __lib_constants_TEXTAREA as TEXTAREA,
+    __lib_constants_THEME_COLORS as THEME_COLORS,
+    __lib_constants_TODO as TODO,
+    __lib_constants_TOGGLE as TOGGLE,
+    __lib_constants_TOOLTIP as TOOLTIP,
+    __lib_constants_UPLOAD as UPLOAD,
+  };
+}
+
+/**
+ * Check if element has a specific class
+ * @param element - DOM element to check
+ * @param className - Class name to check for
+ * @returns Whether element has the class
+ */
+declare function hasClass(element: HTMLElement, className: string): boolean;
+/**
+ * Add class to element if not already present
+ * @param element - DOM element to modify
+ * @param className - Class name to add
+ */
+declare function addClass(element: HTMLElement, className: string): void;
+/**
+ * Remove class from element if present
+ * @param element - DOM element to modify
+ * @param className - Class name to remove
+ */
+declare function removeClass(element: HTMLElement, className: string): void;
+/**
+ * Toggle class on element
+ * @param element - DOM element to modify
+ * @param className - Class name to toggle
+ * @param force - If true, adds class; if false, removes class
+ */
+declare function toggleClass(element: HTMLElement, className: string, force?: boolean): void;
+
+/**
+ * Create a Phosphor icon SVG element
+ * @param name - Icon name
+ * @param size - Icon size in pixels
+ * @returns SVG element as HTML string
+ */
+declare function createPhosphorIcon(name: string, size?: number): string;
+/**
+ * Create an icon element
+ * @param name - Icon name
+ * @param size - Icon size in pixels
+ * @param className - Additional CSS class name
+ * @returns Icon element
+ */
+declare function createIconElement(name: string, size?: number, className?: string): HTMLSpanElement;
+/**
+ * Get all available icon names
+ * @returns Array of icon names
+ */
+declare function getAvailableIcons(): string[];
+
+/**
+ * Generate a UUID v4 compatible string without relying on Node.js crypto
+ * This is a browser-compatible alternative to the uuid package
+ * @returns A UUID v4 compatible string
+ */
+declare function generateUUID(): string;
+
+declare const __lib_utils_addClass: typeof addClass;
+declare const __lib_utils_createIconElement: typeof createIconElement;
+declare const __lib_utils_createPhosphorIcon: typeof createPhosphorIcon;
+declare const __lib_utils_generateUUID: typeof generateUUID;
+declare const __lib_utils_getAvailableIcons: typeof getAvailableIcons;
+declare const __lib_utils_hasClass: typeof hasClass;
+declare const __lib_utils_removeClass: typeof removeClass;
+declare const __lib_utils_toggleClass: typeof toggleClass;
+declare namespace __lib_utils {
+  export {
+    __lib_utils_addClass as addClass,
+    __lib_utils_createIconElement as createIconElement,
+    __lib_utils_createPhosphorIcon as createPhosphorIcon,
+    __lib_utils_generateUUID as generateUUID,
+    __lib_utils_getAvailableIcons as getAvailableIcons,
+    __lib_utils_hasClass as hasClass,
+    __lib_utils_removeClass as removeClass,
+    __lib_utils_toggleClass as toggleClass,
+  };
+}
+
+/**
+ * Button state and functionality
+ * @param initialProps - Initial button properties
+ * @returns Button state and methods
+ */
+declare function useButton(initialProps?: Partial<ButtonProps>): {
+    defaultProps: Partial<ButtonProps>;
+    generateButtonClass: (props: Partial<ButtonProps>) => string;
+    handleClick: (handler?: () => void) => () => void;
+};
+
+/**
+ * Accordion functionality hook result
+ */
+interface UseAccordionResult {
+    /** Current accordion state */
+    state: AccordionState;
+    /** Toggle the accordion open/closed */
+    toggle: () => void;
+    /** Update the panel height based on content */
+    updatePanelHeight: () => void;
+    /** Reference to the panel element */
+    panelRef: React.RefObject<HTMLDivElement>;
+    /** Reference to the content element */
+    contentRef: React.RefObject<HTMLDivElement>;
+    /** Generate accordion class names based on state */
+    generateClassNames: (baseClassName?: string) => string;
+    /** Generate header class names */
+    generateHeaderClassNames: () => string;
+}
+/**
+ * Accordion functionality hook
+ * @param initialProps - Initial accordion properties
+ * @returns Accordion state and methods
+ */
+declare function useAccordion(initialProps?: Partial<AccordionProps$1> & {
+    isOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+}): UseAccordionResult;
+
+/**
+ * Badge state and functionality
+ * @param initialProps - Initial badge properties
+ * @returns Badge state and methods
+ */
+declare function useBadge(initialProps?: Partial<BadgeProps>): {
+    defaultProps: Partial<BadgeProps>;
+    generateBadgeClass: (props: Partial<BadgeProps>) => string;
+};
+
+/**
+ * Hero hook result interface
+ */
+interface UseHeroResult {
+    /**
+     * Generate hero class names based on props
+     */
+    generateHeroClassNames: (baseClassName?: string) => string;
+    /**
+     * Generate image column class based on size
+     */
+    generateImageColClass: (size?: number) => string;
+    /**
+     * Generate content column class based on size
+     */
+    generateContentColClass: (size?: number) => string;
+    /**
+     * Determine if the hero has a background image
+     */
+    hasBackgroundImage: boolean;
+    /**
+     * Determine if the hero has a foreground image
+     */
+    hasForegroundImage: boolean;
+    /**
+     * Determine if content should be displayed in a grid
+     */
+    useGridLayout: boolean;
+    /**
+     * Reference to the hero element
+     */
+    heroRef: React.RefObject<HTMLDivElement>;
+    /**
+     * Reference to the video element
+     */
+    videoRef: React.RefObject<HTMLVideoElement>;
+    /**
+     * Apply parallax effect
+     */
+    applyParallaxEffect: (element: HTMLElement, intensity: number) => void;
+    /**
+     * Remove parallax effect
+     */
+    removeParallaxEffect: (element: HTMLElement) => void;
+}
+/**
+ * Hook for Hero component functionality
+ * @param initialProps - Initial hero props
+ * @returns Hero methods
+ */
+declare function useHero(initialProps?: Partial<HeroProps>): UseHeroResult;
+
+/**
+ * River content column interface
+ */
+interface RiverContentColumn {
+    /**
+     * Column type (title or text)
+     */
+    type: 'title' | 'text';
+    /**
+     * Content for the column
+     */
+    content: ReactNode;
+}
+/**
+ * River properties interface
+ */
+interface RiverProps {
+    /**
+     * Title of the river section
+     */
+    title?: ReactNode;
+    /**
+     * Text content (can be a string or array of paragraphs)
+     */
+    text?: string | string[];
+    /**
+     * Action buttons/links
+     */
+    actions?: ReactNode;
+    /**
+     * Image source URL
+     */
+    imageSrc?: string;
+    /**
+     * Image alt text
+     */
+    imageAlt?: string;
+    /**
+     * Whether to use the center layout
+     */
+    center?: boolean;
+    /**
+     * Whether to use the breakout layout
+     */
+    breakout?: boolean;
+    /**
+     * Whether to use the reverse layout (image on right)
+     */
+    reverse?: boolean;
+    /**
+     * Use content columns instead of simple title/text structure
+     */
+    contentColumns?: RiverContentColumn[];
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+    /**
+     * Background image source
+     */
+    backgroundImageSrc?: string;
+    /**
+     * Whether to show the background overlay
+     */
+    showOverlay?: boolean;
+    /**
+     * Custom width for the river content
+     */
+    contentWidth?: string;
+}
+/**
+ * River hook result interface
+ */
+interface UseRiverResult {
+    /**
+     * Generate river class names based on props
+     */
+    generateRiverClassNames: (baseClassName?: string) => string;
+    /**
+     * Generate content class names
+     */
+    generateContentClass: () => string;
+    /**
+     * Generate visual/image class names
+     */
+    generateVisualClass: () => string;
+    /**
+     * Determine if the river has a background image
+     */
+    hasBackgroundImage: boolean;
+    /**
+     * Determine if the river has a foreground image
+     */
+    hasForegroundImage: boolean;
+    /**
+     * Convert text to array if it's a string
+     */
+    textContent: string[];
+}
+/**
+ * Hook for River component functionality
+ * @param initialProps - Initial river props
+ * @returns River methods and state
+ */
+declare function useRiver(initialProps?: Partial<RiverProps>): UseRiverResult;
+
+/**
+ * Spinner state and functionality
+ * @param initialProps - Initial spinner properties
+ * @returns Spinner state and methods
+ */
+declare function useSpinner(initialProps?: Partial<SpinnerProps>): {
+    defaultProps: Partial<SpinnerProps>;
+    generateSpinnerClass: (props: Partial<SpinnerProps>) => string;
+};
+
+/**
+ * Navbar state and functionality
+ * @param initialProps - Initial navbar properties
+ * @returns Navbar state and methods
+ */
+declare function useNavbar(initialProps?: Partial<NavbarProps>): {
+    defaultProps: Partial<NavbarProps>;
+    isExpanded: boolean;
+    setIsExpanded: React__default.Dispatch<React__default.SetStateAction<boolean>>;
+    generateNavbarClass: (props: Partial<NavbarProps>) => string;
+    generateContainerStyle: (width?: string) => {
+        maxWidth: string;
+    } | {
+        maxWidth?: undefined;
+    };
+    generateCollapseClass: (expanded: boolean) => string;
+    toggleExpanded: () => void;
+    getExpandedState: (controlled?: boolean) => boolean;
+};
+/**
+ * Nav state and functionality
+ * @param initialProps - Initial nav properties
+ * @returns Nav state and methods
+ */
+declare function useNav(initialProps?: Partial<NavProps>): {
+    defaultProps: Partial<NavProps>;
+    generateNavClass: (props: Partial<NavProps>) => string;
+};
+/**
+ * Nav item state and functionality
+ * @param initialProps - Initial nav item properties
+ * @returns Nav item state and methods
+ */
+declare function useNavItem(initialProps?: Partial<NavItemProps & {
+    megaMenu?: boolean;
+}>): {
+    defaultProps: Partial<NavItemProps & {
+        megaMenu?: boolean;
+    }>;
+    generateNavItemClass: (props: Partial<NavItemProps & {
+        megaMenu?: boolean;
+    }>) => string;
+    generateNavLinkClass: (active?: boolean, disabled?: boolean, className?: string) => string;
+    handleClick: (handler?: () => void) => (e: React__default.MouseEvent) => void;
+};
+/**
+ * Nav dropdown state and functionality
+ * @param initialProps - Initial dropdown properties
+ * @returns Dropdown state and methods
+ */
+declare function useNavDropdown(initialProps?: Partial<NavDropdownProps>): {
+    defaultProps: Partial<NavDropdownProps>;
+    generateDropdownMenuClass: (props: Partial<NavDropdownProps>) => string;
+    isInFixedBottomNavbar: () => boolean;
+    getIconClass: (isMegaMenu?: boolean) => string;
+    getIconName: (isMegaMenu?: boolean) => string;
+};
+
+/**
+ * EdgePanel state and functionality
+ * @param initialProps - Initial EdgePanel properties
+ * @returns EdgePanel state and methods
+ */
+declare function useEdgePanel(initialProps?: Partial<EdgePanelProps>): {
+    isOpen: boolean;
+    containerRef: React$1.MutableRefObject<HTMLDivElement>;
+    backdropRef: React$1.MutableRefObject<HTMLDivElement>;
+    generateEdgePanelClass: (props: Partial<EdgePanelProps>) => string;
+    openPanel: () => void;
+    closePanel: () => void;
+    handleBackdropClick: (event: React.MouseEvent<HTMLDivElement>) => void;
+};
+
+/**
+ * Todo composable hook - manages todo items state and operations
+ * @param initialProps - Initial todo properties
+ * @returns Todo state and methods
+ */
+declare function useTodo(initialProps?: Partial<TodoProps>): {
+    items: TodoItem[];
+    inputText: string;
+    setInputText: React$1.Dispatch<React$1.SetStateAction<string>>;
+    addTodo: (text: string) => TodoItem | null;
+    toggleTodo: (id: string) => TodoItem | null;
+    deleteTodo: (id: string) => boolean;
+    handleSubmit: (event: React.FormEvent, onAddTodo?: (text: string) => void) => void;
+    generateTodoClasses: (props: Partial<TodoProps>) => string;
+    generateItemClasses: (item: TodoItem) => string;
+    getFilteredItems: (showCompleted?: boolean) => TodoItem[];
+};
+
+/**
+ * Form state and functionality
+ * @param initialProps - Initial form properties
+ * @returns Form state and methods
+ */
+declare function useForm(initialProps?: Partial<FormProps>): {
+    defaultProps: Partial<FormProps>;
+    generateFormClass: (props: Partial<FormProps>) => string;
+    handleSubmit: (handler?: (event: React.FormEvent<HTMLFormElement>) => void) => (event: React.FormEvent<HTMLFormElement>) => void;
+    handleReset: (handler?: (event: React.FormEvent<HTMLFormElement>) => void) => (event: React.FormEvent<HTMLFormElement>) => void;
+};
+
+/**
+ * Form Group state and functionality
+ * @param initialProps - Initial form group properties
+ * @returns Form Group state and methods
+ */
+declare function useFormGroup(initialProps?: Partial<FormGroupProps>): {
+    defaultProps: Partial<FormGroupProps>;
+    generateFormGroupClass: (props: Partial<FormGroupProps>) => string;
+};
+
+/**
+ * Input state and functionality
+ * @param initialProps - Initial input properties
+ * @returns Input state and methods
+ */
+declare function useInput(initialProps?: Partial<InputProps>): {
+    defaultProps: Partial<InputProps>;
+    generateInputClass: (props: Partial<InputProps> & {
+        type?: string;
+    }) => string;
+};
+
+/**
+ * Select state and functionality
+ * @param initialProps - Initial select properties
+ * @returns Select state and methods
+ */
+declare function useSelect(initialProps?: Partial<SelectProps>): {
+    defaultProps: Partial<SelectProps>;
+    generateSelectClass: (props: Partial<SelectProps>) => string;
+};
+
+/**
+ * Checkbox state and functionality
+ * @param initialProps - Initial checkbox properties
+ * @returns Checkbox state and methods
+ */
+declare function useCheckbox(initialProps?: Partial<CheckboxProps>): {
+    defaultProps: Partial<CheckboxProps>;
+    generateCheckboxClass: (props: Partial<CheckboxProps>) => string;
+    checkboxRef: React$1.MutableRefObject<HTMLInputElement>;
+};
+
+/**
+ * Radio state and functionality
+ * @param initialProps - Initial radio properties
+ * @returns Radio state and methods
+ */
+declare function useRadio(initialProps?: Partial<RadioProps>): {
+    defaultProps: Partial<RadioProps>;
+    generateRadioClass: (props: Partial<RadioProps>) => string;
+};
+
+/**
+ * Textarea state and functionality
+ * @param initialProps - Initial textarea properties
+ * @returns Textarea state and methods
+ */
+declare function useTextarea(initialProps?: Partial<TextareaProps>): {
+    defaultProps: Partial<TextareaProps>;
+    generateTextareaClass: (props: Partial<TextareaProps>) => string;
+};
+
+interface UseDataTableProps {
+    /**
+     * Data array to display
+     */
+    data: any[];
+    /**
+     * Column definitions
+     */
+    columns: DataTableColumn[];
+    /**
+     * Whether the table is sortable
+     */
+    sortable?: boolean;
+    /**
+     * Whether the table is paginated
+     */
+    paginated?: boolean;
+    /**
+     * Number of rows per page
+     */
+    pageSize?: number;
+    /**
+     * Callback when sorting changes
+     */
+    onSort?: (sortConfig: SortConfig) => void;
+    /**
+     * Initial sort configuration
+     */
+    initialSortConfig?: SortConfig;
+}
+interface UseDataTableReturn {
+    /**
+     * Data to display (filtered, sorted, paginated)
+     */
+    displayData: any[];
+    /**
+     * Current sort configuration
+     */
+    sortConfig: SortConfig | null;
+    /**
+     * Current page number
+     */
+    currentPage: number;
+    /**
+     * Total number of pages
+     */
+    totalPages: number;
+    /**
+     * Handle sort column click
+     */
+    handleSort: (key: string) => void;
+    /**
+     * Handle page change
+     */
+    handlePageChange: (page: number) => void;
+    /**
+     * Handle search input
+     */
+    handleSearch: (query: string) => void;
+}
+/**
+ * Hook for managing DataTable state and behavior
+ */
+declare function useDataTable({ data, columns, sortable, paginated, pageSize, onSort, initialSortConfig, }: UseDataTableProps): UseDataTableReturn;
+
+declare const DOTS = "...";
+declare const usePagination: ({ currentPage, totalPages, siblingCount, onPageChange, }: Omit<PaginationProps, "className">) => {
+    paginationRange: (string | number)[];
+    currentPage: number;
+    totalPages: number;
+    goToPage: (page: number) => void;
+    nextPage: () => void;
+    prevPage: () => void;
+    firstPage: () => void;
+    lastPage: () => void;
+    DOTS: string;
+};
+
+interface UseModalProps {
+    /**
+     * Whether the modal is open
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when modal state changes
+     */
+    onOpenChange?: (isOpen: boolean) => void;
+    /**
+     * Callback when modal opens
+     */
+    onOpen?: () => void;
+    /**
+     * Callback when modal closes
+     */
+    onClose?: () => void;
+}
+interface UseModalReturn {
+    /**
+     * Current open state
+     */
+    isOpen: boolean;
+    /**
+     * Function to open the modal
+     */
+    open: () => void;
+    /**
+     * Function to close the modal
+     */
+    close: () => void;
+    /**
+     * Function to toggle the modal
+     */
+    toggle: () => void;
+}
+/**
+ * Hook for managing modal state
+ */
+declare function useModal({ isOpen: isOpenProp, onOpenChange, onOpen, onClose, }?: UseModalProps): UseModalReturn;
+
+/**
+ * Breadcrumb item interface
+ */
+interface BreadcrumbItem$1 {
+    /**
+     * Item label text
+     */
+    label: string;
+    /**
+     * Optional URL for the breadcrumb item
+     */
+    href?: string;
+    /**
+     * Whether this item is active/current
+     */
+    active?: boolean;
+    /**
+     * Icon name from Phosphor Icons
+     */
+    icon?: string;
+    /**
+     * Optional click handler
+     */
+    onClick?: (event: MouseEvent) => void;
+}
+/**
+ * Breadcrumb options interface
+ */
+interface BreadcrumbOptions {
+    /**
+     * Array of breadcrumb items
+     */
+    items?: BreadcrumbItem$1[];
+    /**
+     * Divider character or string between items
+     */
+    divider?: string;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Accessible label for the breadcrumb navigation
+     */
+    ariaLabel?: string;
+}
+
+/**
+ * Breadcrumb state and functionality
+ * @param initialOptions - Initial breadcrumb options
+ * @returns Breadcrumb state and methods
+ */
+declare function useBreadcrumb(initialOptions?: Partial<BreadcrumbOptions>): {
+    defaultOptions: BreadcrumbOptions;
+    generateBreadcrumbClass: (options: Partial<BreadcrumbOptions>) => string;
+    generateItemClass: (item: BreadcrumbItem$1, isLast: boolean) => string;
+    isItemLink: (item: BreadcrumbItem$1, isLast: boolean) => boolean;
+    parseItemsFromJson: (jsonString: string) => BreadcrumbItem$1[];
+};
+
+/**
+ * Hook for managing Card component state and behaviors
+ *
+ * @param options - Configuration options for the card
+ * @returns Card state and handlers
+ */
+declare const useCard: (options?: UseCardOptions) => UseCardReturn;
+
+declare const __lib_composables_DOTS: typeof DOTS;
+type __lib_composables_RiverContentColumn = RiverContentColumn;
+type __lib_composables_RiverProps = RiverProps;
+type __lib_composables_UseDataTableProps = UseDataTableProps;
+type __lib_composables_UseDataTableReturn = UseDataTableReturn;
+type __lib_composables_UseModalProps = UseModalProps;
+type __lib_composables_UseModalReturn = UseModalReturn;
+declare const __lib_composables_useAccordion: typeof useAccordion;
+declare const __lib_composables_useBadge: typeof useBadge;
+declare const __lib_composables_useBreadcrumb: typeof useBreadcrumb;
+declare const __lib_composables_useButton: typeof useButton;
+declare const __lib_composables_useCard: typeof useCard;
+declare const __lib_composables_useCheckbox: typeof useCheckbox;
+declare const __lib_composables_useDataTable: typeof useDataTable;
+declare const __lib_composables_useEdgePanel: typeof useEdgePanel;
+declare const __lib_composables_useForm: typeof useForm;
+declare const __lib_composables_useFormGroup: typeof useFormGroup;
+declare const __lib_composables_useHero: typeof useHero;
+declare const __lib_composables_useInput: typeof useInput;
+declare const __lib_composables_useModal: typeof useModal;
+declare const __lib_composables_useNav: typeof useNav;
+declare const __lib_composables_useNavDropdown: typeof useNavDropdown;
+declare const __lib_composables_useNavItem: typeof useNavItem;
+declare const __lib_composables_useNavbar: typeof useNavbar;
+declare const __lib_composables_usePagination: typeof usePagination;
+declare const __lib_composables_useRadio: typeof useRadio;
+declare const __lib_composables_useRiver: typeof useRiver;
+declare const __lib_composables_useSelect: typeof useSelect;
+declare const __lib_composables_useSpinner: typeof useSpinner;
+declare const __lib_composables_useTextarea: typeof useTextarea;
+declare const __lib_composables_useTodo: typeof useTodo;
+declare namespace __lib_composables {
+  export { __lib_composables_DOTS as DOTS, __lib_composables_useAccordion as useAccordion, __lib_composables_useBadge as useBadge, __lib_composables_useBreadcrumb as useBreadcrumb, __lib_composables_useButton as useButton, __lib_composables_useCard as useCard, __lib_composables_useCheckbox as useCheckbox, __lib_composables_useDataTable as useDataTable, __lib_composables_useEdgePanel as useEdgePanel, __lib_composables_useForm as useForm, __lib_composables_useFormGroup as useFormGroup, __lib_composables_useHero as useHero, __lib_composables_useInput as useInput, __lib_composables_useModal as useModal, __lib_composables_useNav as useNav, __lib_composables_useNavDropdown as useNavDropdown, __lib_composables_useNavItem as useNavItem, __lib_composables_useNavbar as useNavbar, __lib_composables_usePagination as usePagination, __lib_composables_useRadio as useRadio, __lib_composables_useRiver as useRiver, __lib_composables_useSelect as useSelect, __lib_composables_useSpinner as useSpinner, __lib_composables_useTextarea as useTextarea, __lib_composables_useTodo as useTodo };
+  export type { __lib_composables_RiverContentColumn as RiverContentColumn, __lib_composables_RiverProps as RiverProps, __lib_composables_UseDataTableProps as UseDataTableProps, __lib_composables_UseDataTableReturn as UseDataTableReturn, __lib_composables_UseModalProps as UseModalProps, __lib_composables_UseModalReturn as UseModalReturn };
+}
+
+/**
+ * Accordion component for showing/hiding content panels
+ */
+interface AccordionProps extends BaseComponentProps {
+    /**
+     * Title of the accordion
+     */
+    title: string;
+    /**
+     * Content to be shown when accordion is expanded
+     */
+    children: ReactNode;
+    /**
+     * Whether the accordion is initially open
+     */
+    defaultOpen?: boolean;
+    /**
+     * Position of the icon (right or left)
+     */
+    iconPosition?: IconPosition;
+    /**
+     * Custom icon for the accordion
+     */
+    icon?: ReactNode;
+    /**
+     * Controlled open state (overrides defaultOpen)
+     */
+    isOpen?: boolean;
+    /**
+     * Callback when open state changes (for controlled mode)
+     */
+    onOpenChange?: (open: boolean) => void;
+}
+declare const Accordion: React__default.FC<AccordionProps>;
+
+declare const Avatar: React__default.FC<AvatarProps>;
+
+declare const AvatarGroup: React__default.FC<AvatarGroupProps>;
+
+declare const Badge: React__default.FC<BadgeProps>;
+
+interface BreadcrumbItem {
+    /**
+     * Text to display
+     */
+    label: string;
+    /**
+     * URL for the breadcrumb item
+     */
+    href?: string;
+    /**
+     * Whether this item is active (current page)
+     */
+    active?: boolean;
+    /**
+     * Optional icon to display before the label
+     */
+    icon?: ReactNode;
+    /**
+     * Optional click handler
+     */
+    onClick?: (event: React__default.MouseEvent<HTMLAnchorElement>) => void;
+}
+interface BreadcrumbProps {
+    /**
+     * Array of breadcrumb items
+     */
+    items: BreadcrumbItem[];
+    /**
+     * Custom divider character or element
+     */
+    divider?: ReactNode;
+    /**
+     * Additional className
+     */
+    className?: string;
+    /**
+     * Aria label for the navigation
+     */
+    ariaLabel?: string;
+    /**
+     * Optional custom link component
+     */
+    LinkComponent?: React__default.ElementType;
+}
+declare const Breadcrumb: React__default.FC<BreadcrumbProps>;
+
+/**
+ * Callout component for displaying important messages, notifications, or alerts
+ */
+declare const Callout: React__default.FC<CalloutProps>;
+
+declare const Card: React__default.ForwardRefExoticComponent<CardProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Checkbox - A component for checkbox inputs
+ */
+declare const Checkbox: React__default.FC<CheckboxProps>;
+
+interface ColorModeToggleProps {
+    className?: string;
+}
+declare const ColorModeToggle: React__default.FC<ColorModeToggleProps>;
+
+interface CountdownProps {
+    /** Target date/time as a Date or ISO string */
+    target: Date | string;
+    /** Show days, hours, minutes, seconds */
+    show?: Array<'days' | 'hours' | 'minutes' | 'seconds'>;
+    /** Separator string */
+    separator?: string;
+    /** Focused style */
+    focused?: boolean;
+    /** Custom className */
+    className?: string;
+    /** Optional callback when countdown reaches zero */
+    onComplete?: () => void;
+}
+declare const Countdown: React__default.FC<CountdownProps>;
+
+/**
+ * DataTable - A flexible and accessible data table component
+ *
+ * @example
+ * ```tsx
+ * <DataTable
+ *   data={users}
+ *   columns={columns}
+ *   sortable={true}
+ *   onRowClick={handleRowClick}
+ * />
+ * ```
+ */
+declare const DataTable: React__default.FC<DataTableProps>;
+
+/**
+ * DatePicker component for selecting dates from a calendar interface.
+ * Supports various display modes, date ranges, and customization options.
+ */
+declare const DatePicker: React__default.ForwardRefExoticComponent<DatePickerProps & React__default.RefAttributes<DatePickerRef>>;
+
+/**
+ * Dropdown component for creating dropdown menus
+ */
+declare const Dropdown: React__default.FC<DropdownProps>;
+
+declare const EdgePanel: React__default.FC<EdgePanelProps>;
+
+/**
+ * Form - A component for creating form layouts
+ */
+declare const Form: React__default.FC<FormProps>;
+
+declare const Hero: React__default.FC<HeroProps>;
+
+type IconSize = 'xs' | 'sm' | 'md' | 'lg' | 'xl';
+type IconWeight = 'thin' | 'light' | 'regular' | 'bold' | 'fill' | 'duotone';
+type PhosphorIconsType = Exclude<keyof typeof PhosphorIcons, 'Icon' | 'IconContext' | 'IconBase' | 'IconProps' | 'createIcon' | 'default' | 'SSR'>;
+interface IconProps {
+    /**
+     * Icon name from Phosphor Icons
+     */
+    name: PhosphorIconsType;
+    /**
+     * Icon size
+     */
+    size?: IconSize | number;
+    /**
+     * Icon weight/style
+     */
+    weight?: IconWeight;
+    /**
+     * Icon color
+     */
+    color?: string;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Alt text for accessibility
+     */
+    alt?: string;
+}
+/**
+ * Icon component that displays a Phosphor icon
+ */
+declare const Icon: React__default.FC<IconProps>;
+
+/**
+ * Input - A component for text input fields
+ */
+declare const Input: React__default.FC<InputProps>;
+
+declare const List: React__default.FC<ListProps>;
+
+/**
+ * Messages component for displaying a chat interface with messages, images, and file attachments
+ */
+declare const Messages: React__default.FC<MessagesProps>;
+
+/**
+ * Modal component for displaying overlay content
+ */
+declare const Modal: React__default.FC<ModalProps>;
+
+/**
+ * Navbar component provides a responsive navigation header with brand, navigation items,
+ * and collapsible mobile menu functionality.
+ *
+ * @example
+ * ```tsx
+ * <Navbar brand="My App" position="fixed" collapsible>
+ *   <Nav>
+ *     <NavItem href="/">Home</NavItem>
+ *     <NavItem href="/about">About</NavItem>
+ *   </Nav>
+ * </Navbar>
+ * ```
+ */
+declare const Navbar: React__default.ForwardRefExoticComponent<NavbarProps & React__default.RefAttributes<HTMLElement>>;
+
+/**
+ * Pagination component
+ */
+declare const Pagination: React__default.FC<PaginationProps>;
+
+/**
+ * PhotoViewer component - A comprehensive image viewer with zoom, pan, navigation, and metadata display
+ *
+ * Features:
+ * - Image navigation with keyboard support
+ * - Zoom and pan functionality
+ * - Touch gestures for mobile devices
+ * - Fullscreen mode
+ * - Image rotation
+ * - Download and share capabilities
+ * - Thumbnail navigation
+ * - Image metadata display
+ * - Responsive design
+ *
+ * @param props - PhotoViewerProps
+ * @returns JSX.Element
+ */
+declare const PhotoViewer: React__default.FC<PhotoViewerProps>;
+
+/**
+ * Popover component for displaying floating content
+ */
+declare const Popover: React__default.FC<PopoverProps>;
+
+interface ProductReviewProps {
+    /**
+     * Product name
+     */
+    productName: string;
+    /**
+     * Product image URL
+     */
+    productImage?: string;
+    /**
+     * Initial rating value (0-5)
+     */
+    initialRating?: number;
+    /**
+     * Maximum possible rating value
+     */
+    maxRating?: number;
+    /**
+     * Whether to allow half-star ratings
+     */
+    allowHalf?: boolean;
+    /**
+     * Color theme for the rating stars
+     */
+    ratingColor?: ThemeColor;
+    /**
+     * Callback when review is submitted
+     */
+    onSubmit?: (rating: number, comment: string) => void;
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+}
+/**
+ * ProductReview component for collecting user ratings and feedback
+ */
+declare const ProductReview: React__default.FC<ProductReviewProps>;
+
+declare const Progress: React__default.ForwardRefExoticComponent<ProgressProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * Radio - A component for radio button inputs
+ */
+declare const Radio: React__default.FC<RadioProps>;
+
+/**
+ * Rating component for displaying and collecting star ratings
+ *
+ * @example
+ * // Basic usage
+ * <Rating value={3} onChange={handleRatingChange} />
+ *
+ * @example
+ * // Read-only with custom color
+ * <Rating value={4.5} readOnly color="warning" />
+ *
+ * @example
+ * // With half-star support
+ * <Rating value={3.5} allowHalf maxValue={5} />
+ */
+declare const Rating: React__default.ForwardRefExoticComponent<RatingProps & React__default.RefAttributes<HTMLDivElement>>;
+
+/**
+ * River component for displaying content with image sections
+ */
+declare const River: React__default.FC<RiverProps>;
+
+interface SectionIntroProps {
+    /**
+     * The section title
+     */
+    title: ReactNode;
+    /**
+     * Optional subtitle or overline text
+     */
+    /**
+     * Optional label text (equivalent to subtitle in the UI)
+     */
+    label?: ReactNode;
+    /**
+     * Optional description text
+     */
+    /**
+     * Optional text content
+     */
+    text?: ReactNode;
+    /**
+     * Optional call to action elements
+     */
+    actions?: ReactNode;
+    /**
+     * Alignment of the content
+     */
+    alignment?: 'left' | 'center' | 'right';
+    /**
+     * Optional background image URL
+     */
+    backgroundImageSrc?: string;
+    /**
+     * Whether to show an overlay on the background
+     */
+    showOverlay?: boolean;
+    /**
+     * Optional foreground image URL
+     */
+    imageSrc?: string;
+    /**
+     * Alternative text for the image
+     */
+    imageAlt?: string;
+    /**
+     * Size variant
+     */
+    size?: 'sm' | 'md' | 'lg';
+    /**
+     * Whether to show a skeleton loading state
+     */
+    skeleton?: boolean;
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+}
+/**
+ * SectionIntro component for introducing content sections with titles, descriptions, and optional imagery
+ */
+declare const SectionIntro: React__default.FC<SectionIntroProps>;
+
+/**
+ * Select - A component for dropdown selection
+ */
+declare const Select: React__default.FC<SelectProps>;
+
+declare const Spinner: React__default.FC<SpinnerProps>;
+
+interface StepItem {
+    /**
+     * The number for the step
+     */
+    number: number | string | ReactNode;
+    /**
+     * The text label for the step
+     */
+    text: string;
+    /**
+     * Optional custom content for the step
+     */
+    content?: React__default.ReactNode;
+}
+interface StepsProps {
+    /**
+     * Array of step items
+     */
+    items: StepItem[];
+    /**
+     * Current active step index (0-based)
+     */
+    activeIndex?: number;
+    /**
+     * Whether to display steps vertically
+     */
+    vertical?: boolean;
+    /**
+     * Called when active step changes
+     */
+    onStepChange?: (index: number) => void;
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+}
+/**
+ * Steps component for displaying a sequence of steps
+ */
+declare const Steps: React__default.FC<StepsProps>;
+
+interface TabItemProps {
+    /**
+     * Label for the tab
+     */
+    label: string;
+    /**
+     * Content of the tab panel
+     */
+    content: ReactNode;
+    /**
+     * Whether the tab is initially active
+     */
+    isActive?: boolean;
+    /**
+     * Additional CSS class for the tab
+     */
+    className?: string;
+}
+interface TabProps {
+    /**
+     * Array of tab items
+     */
+    items: TabItemProps[];
+    /**
+     * Initial active tab index
+     */
+    activeIndex?: number;
+    /**
+     * Callback when tab changes
+     */
+    onTabChange?: (index: number) => void;
+    /**
+     * Additional CSS class for the tab component
+     */
+    className?: string;
+}
+/**
+ * Tab component for switching between different content panels
+ */
+declare const Tab: React__default.FC<TabProps>;
+
+interface TestimonialAuthor {
+    /**
+     * The author's name
+     */
+    name: string;
+    /**
+     * The author's role or title
+     */
+    role: string;
+    /**
+     * The URL to the author's avatar image
+     */
+    avatarSrc?: string;
+    /**
+     * Alternative text for the avatar image
+     */
+    avatarAlt?: string;
+}
+interface TestimonialProps {
+    /**
+     * The testimonial quote text or content
+     */
+    quote: ReactNode;
+    /**
+     * Author information
+     */
+    author?: TestimonialAuthor;
+    /**
+     * Size variant
+     */
+    size?: 'sm' | 'lg' | '';
+    /**
+     * Whether to show a skeleton loading state
+     */
+    skeleton?: boolean;
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+}
+/**
+ * Testimonial component for displaying customer quotes and feedback
+ */
+declare const Testimonial: React__default.FC<TestimonialProps>;
+
+/**
+ * Textarea - A component for multiline text input
+ */
+declare const Textarea: React__default.FC<TextareaProps>;
+
+declare const Todo: React__default.FC<TodoProps>;
+
+interface ToggleProps {
+    /**
+     * Whether the toggle is initially on
+     */
+    initialOn?: boolean;
+    /**
+     * Callback when the toggle is turned on
+     */
+    onToggleOn?: () => void;
+    /**
+     * Callback when the toggle is turned off
+     */
+    onToggleOff?: () => void;
+    /**
+     * Whether the toggle is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Additional CSS class for the toggle
+     */
+    className?: string;
+}
+/**
+ * Toggle component for switching between two states
+ */
+declare const Toggle: React__default.FC<ToggleProps>;
+
+interface TooltipProps {
+    /**
+     * Content to be displayed in the tooltip
+     */
+    content: ReactNode;
+    /**
+     * The element that will trigger the tooltip
+     */
+    children: ReactNode;
+    /**
+     * The position of the tooltip relative to the trigger
+     */
+    position?: 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
+    /**
+     * How the tooltip is triggered
+     */
+    trigger?: 'hover' | 'click';
+    /**
+     * Additional CSS class for the tooltip
+     */
+    className?: string;
+    /**
+     * Delay before showing the tooltip (in milliseconds)
+     */
+    delay?: number;
+    /**
+     * Offset from the trigger element (in pixels)
+     */
+    offset?: number;
+}
+declare const Tooltip: React__default.FC<TooltipProps>;
+
+interface UploadProps {
+    /**
+     * Whether the upload component is disabled
+     */
+    disabled?: boolean;
+    /**
+     * Maximum file size in MB
+     */
+    maxSizeInMB?: number;
+    /**
+     * Accepted file types
+     */
+    acceptedFileTypes?: string[];
+    /**
+     * Whether multiple files can be selected
+     */
+    multiple?: boolean;
+    /**
+     * Text for the drag and drop section
+     */
+    title?: string;
+    /**
+     * Text describing supported file types
+     */
+    supportedFilesText?: string;
+    /**
+     * Text for the upload button
+     */
+    buttonText?: string;
+    /**
+     * Helper text displayed below the button
+     */
+    helperText?: string;
+    /**
+     * Icon component or class name
+     */
+    icon?: React__default.ReactNode;
+    /**
+     * Called when files are selected
+     */
+    onFileSelect?: (files: File[]) => void;
+    /**
+     * Called during file upload with progress
+     */
+    onFileUpload?: (file: File, progress: number) => void;
+    /**
+     * Called when file upload is complete
+     */
+    onFileUploadComplete?: (file: File) => void;
+    /**
+     * Called on file upload errors
+     */
+    onFileUploadError?: (file: File, error: string) => void;
+    /**
+     * Additional CSS class
+     */
+    className?: string;
+}
+/**
+ * Upload component for file uploads with drag and drop
+ */
+declare const Upload: React__default.FC<UploadProps>;
+
+declare const composables: typeof __lib_composables;
+declare const utils: typeof __lib_utils;
+declare const types: typeof __lib_types;
+declare const constants: typeof __lib_constants;
+
+interface GridProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the grid
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Control the horizontal alignment of items
+     */
+    justifyContent?: 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
+    /**
+     * Control the vertical alignment of items
+     */
+    alignItems?: 'start' | 'end' | 'center' | 'baseline' | 'stretch';
+    /**
+     * No gutters between columns
+     */
+    noGutters?: boolean;
+}
+
+interface GridColProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the column
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Number of columns to span at extra small breakpoint (default)
+     */
+    xs?: number | 'auto';
+    /**
+     * Number of columns to span at small breakpoint
+     */
+    sm?: number | 'auto';
+    /**
+     * Number of columns to span at medium breakpoint
+     */
+    md?: number | 'auto';
+    /**
+     * Number of columns to span at large breakpoint
+     */
+    lg?: number | 'auto';
+    /**
+     * Number of columns to span at extra large breakpoint
+     */
+    xl?: number | 'auto';
+    /**
+     * Number of columns to span at extra extra large breakpoint
+     */
+    xxl?: number | 'auto';
+    /**
+     * Offset at extra small breakpoint
+     */
+    offsetXs?: number;
+    /**
+     * Offset at small breakpoint
+     */
+    offsetSm?: number;
+    /**
+     * Offset at medium breakpoint
+     */
+    offsetMd?: number;
+    /**
+     * Offset at large breakpoint
+     */
+    offsetLg?: number;
+    /**
+     * Offset at extra large breakpoint
+     */
+    offsetXl?: number;
+    /**
+     * Offset at extra extra large breakpoint
+     */
+    offsetXxl?: number;
+}
+
+interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the container
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Container type:
+     * - undefined: responsive container with max-width at each breakpoint
+     * - 'fluid': full width container
+     * - 'sm', 'md', 'lg', 'xl', 'xxl': responsive container with max-width at specified breakpoint
+     */
+    type?: 'fluid' | 'sm' | 'md' | 'lg' | 'xl' | 'xxl';
+}
+
+interface RowProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the row
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Control the horizontal alignment of items
+     */
+    justifyContent?: 'start' | 'end' | 'center' | 'between' | 'around' | 'evenly';
+    /**
+     * Control the vertical alignment of items
+     */
+    alignItems?: 'start' | 'end' | 'center' | 'baseline' | 'stretch';
+    /**
+     * No gutters between columns
+     */
+    noGutters?: boolean;
+}
+
+interface MasonryGridProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the masonry grid
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+    /**
+     * Number of columns at extra small breakpoint (default)
+     */
+    xs?: number;
+    /**
+     * Number of columns at small breakpoint
+     */
+    sm?: number;
+    /**
+     * Number of columns at medium breakpoint
+     */
+    md?: number;
+    /**
+     * Number of columns at large breakpoint
+     */
+    lg?: number;
+    /**
+     * Number of columns at extra large breakpoint
+     */
+    xl?: number;
+    /**
+     * Number of columns at extra extra large breakpoint
+     */
+    xxl?: number;
+    /**
+     * Gap between items (in pixels)
+     */
+    gap?: number;
+    /**
+     * Whether to animate item transitions
+     */
+    animate?: boolean;
+    /**
+     * Whether to handle image loading to prevent layout shifts
+     * When true, items will be shown immediately and positions updated as images load
+     */
+    imagesLoaded?: boolean;
+    /**
+     * Callback fired when all images are loaded and layout is complete
+     */
+    onLayoutComplete?: () => void;
+    /**
+     * Callback fired each time an image loads and layout is updated
+     */
+    onImageLoad?: (loadedCount: number, totalCount: number) => void;
+}
+
+interface MasonryGridItemProps extends HTMLAttributes<HTMLDivElement> {
+    /**
+     * The content to be rendered within the masonry grid item
+     */
+    children: ReactNode;
+    /**
+     * Additional CSS class names
+     */
+    className?: string;
+}
+
+declare const layouts: {
+    MasonryGrid: React$1.ForwardRefExoticComponent<MasonryGridProps & React$1.RefAttributes<HTMLDivElement>>;
+    MasonryGridItem: React$1.ForwardRefExoticComponent<MasonryGridItemProps & React$1.RefAttributes<HTMLDivElement>>;
+    Grid: React$1.ForwardRefExoticComponent<GridProps & React$1.RefAttributes<HTMLDivElement>>;
+    GridCol: React$1.ForwardRefExoticComponent<GridColProps & React$1.RefAttributes<HTMLDivElement>>;
+    Container: React$1.ForwardRefExoticComponent<ContainerProps & React$1.RefAttributes<HTMLDivElement>>;
+    Row: React$1.ForwardRefExoticComponent<RowProps & React$1.RefAttributes<HTMLDivElement>>;
+};
+
+declare namespace layouts$1 {
+  export {
+    layouts as default,
+  };
+}
+
+declare const atomix: {
+    composables: typeof __lib_composables;
+    utils: typeof __lib_utils;
+    constants: typeof __lib_constants;
+    types: typeof __lib_types;
+    layouts: typeof layouts$1;
+    Accordion: React$1.FC<AccordionProps>;
+    Avatar: React$1.FC<AvatarProps>;
+    AvatarGroup: React$1.FC<AvatarGroupProps>;
+    Badge: React$1.FC<BadgeProps>;
+    Breadcrumb: React$1.FC<BreadcrumbProps>;
+    Button: React$1.ForwardRefExoticComponent<Omit<ButtonProps & ButtonAsProp, "ref"> & React$1.RefAttributes<HTMLButtonElement>>;
+    Callout: React$1.FC<CalloutProps>;
+    Card: React$1.ForwardRefExoticComponent<CardProps & React$1.RefAttributes<HTMLDivElement>>;
+    Checkbox: React$1.FC<CheckboxProps>;
+    ColorModeToggle: React$1.FC<ColorModeToggleProps>;
+    Countdown: React$1.FC<CountdownProps>;
+    DataTable: React$1.FC<DataTableProps>;
+    DatePicker: React$1.ForwardRefExoticComponent<DatePickerProps & React$1.RefAttributes<DatePickerRef>>;
+    Dropdown: React$1.FC<DropdownProps>;
+    EdgePanel: React$1.FC<EdgePanelProps>;
+    Form: React$1.FC<FormProps>;
+    Hero: React$1.FC<HeroProps>;
+    Icon: React$1.FC<IconProps>;
+    Input: React$1.FC<InputProps>;
+    List: React$1.FC<ListProps>;
+    Messages: React$1.FC<MessagesProps>;
+    Modal: React$1.FC<ModalProps>;
+    Navbar: React$1.ForwardRefExoticComponent<NavbarProps & React$1.RefAttributes<HTMLElement>>;
+    Pagination: React$1.FC<PaginationProps>;
+    PhotoViewer: React$1.FC<PhotoViewerProps>;
+    Popover: React$1.FC<PopoverProps>;
+    ProductReview: React$1.FC<ProductReviewProps>;
+    Progress: React$1.ForwardRefExoticComponent<ProgressProps & React$1.RefAttributes<HTMLDivElement>>;
+    Radio: React$1.FC<RadioProps>;
+    Rating: React$1.ForwardRefExoticComponent<RatingProps & React$1.RefAttributes<HTMLDivElement>>;
+    River: React$1.FC<RiverProps>;
+    SectionIntro: React$1.FC<SectionIntroProps>;
+    Select: React$1.FC<SelectProps>;
+    Spinner: React$1.FC<SpinnerProps>;
+    Steps: React$1.FC<StepsProps>;
+    Tab: React$1.FC<TabProps>;
+    Testimonial: React$1.FC<TestimonialProps>;
+    Textarea: React$1.FC<TextareaProps>;
+    Todo: React$1.FC<TodoProps>;
+    Toggle: React$1.FC<ToggleProps>;
+    Tooltip: React$1.FC<TooltipProps>;
+    Upload: React$1.FC<UploadProps>;
+};
+
+export { Accordion, Avatar, AvatarGroup, Badge, Breadcrumb, Button, Callout, Card, Checkbox, ColorModeToggle, Countdown, DataTable, DatePicker, Dropdown, EdgePanel, Form, Hero, Icon, Input, List, Messages, Modal, Navbar, Pagination, PhotoViewer, Popover, ProductReview, Progress, Radio, Rating, River, SectionIntro, Select, Spinner, Steps, Tab, Testimonial, Textarea, Todo, Toggle, Tooltip, Upload, composables, constants, atomix as default, types, utils };
+export type { AccordionProps, AvatarGroupProps, AvatarProps, BadgeProps, BreadcrumbProps, ButtonProps, CalloutProps, CardProps, CheckboxProps, ColorModeToggleProps, CountdownProps, DataTableProps, DatePickerProps, DropdownProps, EdgePanelProps, FormProps, HeroProps, IconProps, InputProps, ListProps, MessagesProps, ModalProps, NavbarProps, PaginationProps, PhotoViewerProps, PopoverProps, ProductReviewProps, ProgressProps, RadioProps, RatingProps, RiverProps, SectionIntroProps, SelectProps, SpinnerProps, StepsProps, TabProps, TestimonialProps, TextareaProps, TodoProps, ToggleProps, TooltipProps, UploadProps };