banhaten-ui 0.0.12 → 0.0.14

package/dist/index.d.ts

@@ -1,4 +1,5 @@
 import { ButtonHTMLAttributes } from 'react';
+import { ClassValue } from 'clsx';
 import { default as default_2 } from 'react';
 import { ForwardRefExoticComponent } from 'react';
 import { HTMLAttributes } from 'react';
@@ -59,7 +60,7 @@ export declare interface AccordionProps extends Omit<HTMLAttributes<HTMLDivEleme
     rtlDescription?: string;
 }
 
-export declare type AccordionState = "Default" | "Hover";
+export declare type AccordionState = "Default" | "Hover" | "NoHover";
 
 export declare type AccordionStyle = "Default" | "Boxed";
 
@@ -100,6 +101,91 @@ export declare interface AlertProps extends Omit<default_2.HTMLAttributes<HTMLDi
     rtlSecondaryAction?: string;
 }
 
+export declare const Avatar: ForwardRefExoticComponent<AvatarProps & RefAttributes<HTMLDivElement>>;
+
+export declare const AvatarCallToAction: ForwardRefExoticComponent<AvatarCallToActionProps & RefAttributes<HTMLButtonElement>>;
+
+export declare interface AvatarCallToActionProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+    /** Size of the avatar */
+    size?: AvatarSize;
+    /** Shape of the avatar */
+    shape?: AvatarShape;
+    /** RTL mode */
+    rtl?: boolean;
+}
+
+export declare const AvatarGroup: ForwardRefExoticComponent<AvatarGroupProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface AvatarGroupProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Size of avatars */
+    size?: AvatarSize;
+    /** Shape of avatars */
+    shape?: AvatarShape;
+    /** Maximum number of avatars to show */
+    max?: number;
+    /** Array of avatar sources or initials */
+    avatars: Array<{
+        src?: string;
+        alt?: string;
+        initials?: string;
+        showIcon?: boolean;
+    }>;
+    /** RTL mode */
+    rtl?: boolean;
+}
+
+export declare const AvatarProfile: ForwardRefExoticComponent<AvatarProfileProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface AvatarProfileProps extends React.HTMLAttributes<HTMLDivElement> {
+    /** Size of avatar */
+    size?: AvatarSize;
+    /** Shape of avatar */
+    shape?: AvatarShape;
+    /** Avatar image source */
+    src?: string;
+    /** Alt text for image */
+    alt?: string;
+    /** Initials to display (if no image) */
+    initials?: string;
+    /** Show icon if no image or initials */
+    showIcon?: boolean;
+    /** Status indicator */
+    status?: AvatarStatus;
+    /** Primary text (name) */
+    name: string;
+    /** Secondary text (description/subtitle) */
+    description?: string;
+    /** RTL mode */
+    rtl?: boolean;
+}
+
+export declare interface AvatarProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'children'> {
+    /** Size of the avatar */
+    size?: AvatarSize;
+    /** Avatar image source */
+    src?: string;
+    /** Alt text for image */
+    alt?: string;
+    /** Initials to display (if no image) */
+    initials?: string;
+    /** Show icon if no image or initials */
+    showIcon?: boolean;
+    /** Status indicator */
+    status?: AvatarStatus;
+    /** Shape of the avatar */
+    shape?: AvatarShape;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Show border */
+    showBorder?: boolean;
+}
+
+export declare type AvatarShape = 'circle' | 'square';
+
+export declare type AvatarSize = '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl' | '3xl' | '4xl';
+
+export declare type AvatarStatus = 'online' | 'offline' | 'away' | 'busy' | 'blocked' | 'none';
+
 /**
  * Badge component for displaying labels, statuses, and notifications.
  * Supports multiple types, styles, sizes, and colors with RTL support.
@@ -131,12 +217,16 @@ export declare interface BadgeProps extends Omit<HTMLAttributes<HTMLDivElement>,
     number?: number;
     /** The badge text content */
     children?: ReactNode;
-    /** Icon to display on the left (for LeadingIcon type) */
-    leadingIcon?: ReactNode;
-    /** Icon to display on the right (for TrailingIcon type) */
-    trailingIcon?: ReactNode;
+    /** Icon or image to display on the left (for LeadingIcon type) - accepts icon component or image URL */
+    leadingIcon?: ReactNode | string;
+    /** Icon or image to display on the right (for TrailingIcon type) - accepts icon component or image URL */
+    trailingIcon?: ReactNode | string;
     /** Flag icon (for Flag type) */
     flagIcon?: ReactNode;
+    /** Image source URL (deprecated, use leadingIcon or trailingIcon instead) */
+    imgSrc?: string;
+    /** Image alt text */
+    imgAlt?: string;
     /** Enable RTL (Right-to-Left) mode */
     rtl?: boolean;
 }
@@ -145,7 +235,47 @@ export declare type BadgeSize = "sm" | "lg";
 
 export declare type BadgeStyle = "Light" | "Outline" | "Solid";
 
-export declare type BadgeType = "Default" | "LeadingIcon" | "TrailingIcon" | "Dot" | "Flag";
+export declare type BadgeType = "Default" | "LeadingIcon" | "TrailingIcon" | "Dot" | "Flag" | "LeadingImg";
+
+export declare interface BreadcrumbItem {
+    /** Label for the breadcrumb item */
+    label: string;
+    /** Optional href for navigation */
+    href?: string;
+    /** Optional icon */
+    icon?: ReactNode;
+    /** Whether this is the current page (last item) */
+    isCurrent?: boolean;
+    /** Click handler */
+    onClick?: () => void;
+}
+
+export declare const Breadcrumbs: ForwardRefExoticComponent<BreadcrumbsProps & RefAttributes<HTMLElement>>;
+
+export declare type BreadcrumbSeparator = 'chevron' | 'slash' | 'dot';
+
+export declare type BreadcrumbSize = 'sm' | 'md' | 'lg';
+
+export declare interface BreadcrumbsProps extends Omit<React.HTMLAttributes<HTMLElement>, 'children'> {
+    /** Array of breadcrumb items */
+    items: BreadcrumbItem[];
+    /** Size variant */
+    size?: BreadcrumbSize;
+    /** Visual variant */
+    variant?: BreadcrumbVariant;
+    /** Separator style */
+    separator?: BreadcrumbSeparator;
+    /** Show home icon for first item */
+    showHomeIcon?: boolean;
+    /** Maximum items to show before collapsing */
+    maxItems?: number;
+    /** Show border around breadcrumbs */
+    bordered?: boolean;
+    /** RTL mode */
+    rtl?: boolean;
+}
+
+export declare type BreadcrumbVariant = 'default' | 'boxed';
 
 /**
  * Primary UI component for user interaction.
@@ -167,11 +297,11 @@ export declare const Button: ForwardRefExoticComponent<ButtonProps & RefAttribut
 
 export declare const ButtonGroup: default_2.ForwardRefExoticComponent<ButtonGroupProps & default_2.RefAttributes<HTMLDivElement>>;
 
-declare interface ButtonGroupItem {
+export declare interface ButtonGroupItem {
     /** Button text label */
     label?: string;
-    /** Icon component from lucide-react */
-    icon?: LucideIcon;
+    /** Icon component (ReactNode) */
+    icon?: ReactNode;
     /** Click handler for this button */
     onClick?: () => void;
     /** Whether this button is disabled */
@@ -183,21 +313,31 @@ declare interface ButtonGroupItem {
 export declare interface ButtonGroupProps extends Omit<default_2.HTMLAttributes<HTMLDivElement>, 'style'> {
     /** Array of button items */
     items: ButtonGroupItem[];
+    /** Button group variant/style */
+    variant?: ButtonGroupVariant;
     /** Button group size */
-    size?: 'xs' | 'sm' | 'md';
-    /** Button group type */
-    type?: 'Default' | 'IconOnly';
+    size?: ButtonGroupSize;
+    /** Button group shape */
+    shape?: ButtonGroupShape;
+    /** Icon-only mode (no labels) */
+    iconOnly?: boolean;
     /** RTL mode */
     rtl?: boolean;
-    /** RTL button labels (array matching items) */
-    rtlLabels?: string[];
 }
 
+export declare type ButtonGroupShape = 'rounded' | 'pill' | 'square';
+
+export declare type ButtonGroupSize = 'xs' | 'sm' | 'md' | 'lg';
+
+export declare type ButtonGroupVariant = 'primary' | 'soft' | 'outline' | 'ghost';
+
 export declare interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, "children"> {
     /** The visual style variant of the button */
     variant?: ButtonVariant;
     /** The size of the button */
     size?: ButtonSize;
+    /** The shape/border-radius of the button */
+    shape?: ButtonShape;
     /** Whether the button is in a loading state */
     loading?: boolean;
     /** Whether the button is disabled */
@@ -214,18 +354,41 @@ export declare interface ButtonProps extends Omit<ButtonHTMLAttributes<HTMLButto
     endIcon?: ReactNode;
     /** Icon for icon-only buttons */
     icon?: ReactNode;
+    /** Show chevron icon for link buttons */
+    showChevron?: boolean;
+    /** Underline the link button text */
+    underline?: boolean;
     /** Enable RTL (Right-to-Left) mode for Arabic, Hebrew, and other RTL languages */
     rtl?: boolean;
     /** Button content */
     children?: ReactNode;
 }
 
+export declare type ButtonShape = "rounded" | "pill" | "square" | "circle";
+
 export declare type ButtonSize = "xs" | "sm" | "md" | "lg";
 
-export declare type ButtonVariant = "primary" | "soft" | "secondary" | "dashed" | "white" | "outline" | "ghost" | "ghost-primary" | "danger" | "soft-danger";
+export declare type ButtonVariant = "primary" | "soft" | "secondary" | "dashed" | "white" | "outline" | "ghost" | "ghost-primary" | "danger" | "soft-danger" | "link" | "link-danger" | "link-neutral";
 
 export declare const Checkbox: ForwardRefExoticComponent<CheckboxProps & RefAttributes<HTMLInputElement>>;
 
+export declare const CheckboxCard: ForwardRefExoticComponent<CheckboxCardProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface CheckboxCardProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Card label/title */
+    label?: string;
+    /** Card description */
+    description?: string;
+    /** Optional icon or image */
+    icon?: ReactNode;
+    /** Indeterminate state */
+    indeterminate?: boolean;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Checkbox position */
+    checkboxPosition?: 'left' | 'right';
+}
+
 export declare interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
     /** Checkbox label */
     label?: string;
@@ -272,7 +435,7 @@ export declare interface CheckmarkCardProps extends Omit<HTMLAttributes<HTMLElem
     onChange?: (selected: boolean) => void;
 }
 
-export declare function cn(...inputs: (string | undefined | null | false)[]): string;
+export declare function cn(...inputs: ClassValue[]): string;
 
 export declare const CodeBlock: ({ code, language, className }: CodeBlockProps) => JSX_2.Element;
 
@@ -295,66 +458,314 @@ export declare interface DividerProps extends HTMLAttributes<HTMLDivElement> {
     spacing?: 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
 }
 
-export declare const Menu: ForwardRefExoticComponent<MenuProps & RefAttributes<HTMLDivElement>>;
+export declare const Input: ForwardRefExoticComponent<InputProps & RefAttributes<HTMLInputElement>>;
 
-declare interface MenuItemProps extends Omit<HTMLAttributes<HTMLDivElement>, 'type'> {
-    /** Type of menu item */
-    type?: 'default' | 'multiline' | 'cta' | 'progress' | 'button' | 'divider' | 'label' | 'caption';
-    /** Item state */
-    state?: 'default' | 'hover' | 'disabled';
-    /** Main label text */
+export declare interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    /** Input label */
     label?: string;
-    /** Supporting text (for multiline items) */
-    supportText?: string;
+    /** RTL label */
+    rtlLabel?: string;
+    /** Hint text below input */
+    hintText?: string;
+    /** RTL hint text */
+    rtlHintText?: string;
+    /** Error message */
+    error?: string;
+    /** RTL error message */
+    rtlError?: string;
+    /** Success message */
+    success?: string;
+    /** RTL success message */
+    rtlSuccess?: string;
+    /** Leading icon or element */
+    leadingIcon?: ReactNode;
+    /** Trailing icon or element */
+    trailingIcon?: ReactNode;
+    /** Prefix text (e.g., "https://") */
+    prefix?: string;
+    /** Suffix text (e.g., ".com") */
+    suffix?: string;
+    /** Action button text (e.g., "Send") */
+    actionButton?: string;
+    /** Action button click handler */
+    onActionClick?: () => void;
+    /** Shortcut text (e.g., "⌘K") */
+    shortcut?: string;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Optional indicator */
+    optional?: boolean;
+    /** Required indicator */
+    required?: boolean;
+    /** Allow clearing the input */
+    clearable?: boolean;
+    /** Clear handler */
+    onClear?: () => void;
+    /** Input size */
+    inputSize?: 'sm' | 'md' | 'lg';
+    /** Full width */
+    fullWidth?: boolean;
+    /** Custom class for container */
+    containerClassName?: string;
+}
+
+export declare const Menu: ForwardRefExoticComponent<MenuProps & RefAttributes<HTMLDivElement>>;
+
+export declare const MenuItem: ForwardRefExoticComponent<MenuItemProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface MenuItemProps {
+    /** Main label */
+    label: string;
+    /** RTL label */
+    rtlLabel?: string;
+    /** Supporting text */
+    supportingText?: string;
+    /** RTL supporting text */
+    rtlSupportingText?: string;
     /** Leading icon */
-    leadingIcon?: LucideIcon;
-    /** Trailing icon */
-    trailingIcon?: LucideIcon;
-    /** Avatar image URL */
-    avatarSrc?: string;
-    /** Avatar initials */
-    avatarInitials?: string;
-    /** Badge text */
-    badgeText?: string;
-    /** Badge variant */
-    badgeVariant?: 'neutral' | 'green' | 'blue' | 'red' | 'yellow';
-    /** Right-aligned text */
-    rightText?: string;
-    /** Show toggle switch */
-    hasSwitch?: boolean;
-    /** Toggle switch active state */
-    switchActive?: boolean;
-    /** Switch change handler */
-    onSwitchChange?: (active: boolean) => void;
-    /** Button text (for CTA items) */
-    buttonText?: string;
-    /** Button click handler */
-    onButtonClick?: () => void;
-    /** Progress percentage (for progress items) */
-    progress?: number;
-    /** Progress label */
-    progressLabel?: string;
-    /** Progress optional text */
-    progressOptional?: string;
-    /** Caption text (for label/caption items) */
-    caption?: string;
+    leadingIcon?: ReactNode;
+    /** Avatar component or image URL */
+    avatar?: ReactNode | string;
+    /** Avatar size */
+    avatarSize?: 'sm' | 'md' | 'lg';
+    /** Badge component */
+    badge?: ReactNode;
+    /** Toggle switch */
+    toggle?: ReactNode;
+    /** Trailing icon (chevron or custom) */
+    trailingIcon?: 'chevron' | 'none' | ReactNode;
+    /** Show trailing text */
+    trailingText?: string;
+    /** RTL trailing text */
+    rtlTrailingText?: string;
+    /** Show add button */
+    showAddButton?: boolean;
     /** RTL mode */
     rtl?: boolean;
+    /** Disabled state */
+    disabled?: boolean;
     /** Click handler */
     onClick?: () => void;
+    /** Custom class */
+    className?: string;
 }
 
-export declare const MenuItemType: ForwardRefExoticComponent<MenuItemProps & RefAttributes<HTMLDivElement>>;
-
-export declare interface MenuProps extends HTMLAttributes<HTMLDivElement> {
+export declare interface MenuProps {
     /** Menu items */
-    children?: ReactNode;
-    /** Menu width */
-    width?: number | string;
+    children: ReactNode;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Custom class */
+    className?: string;
+}
+
+export declare const NumberInput: ForwardRefExoticComponent<NumberInputProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface NumberInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type' | 'onChange'> {
+    /** Input label */
+    label?: string;
+    /** RTL label */
+    rtlLabel?: string;
+    /** Hint text below input */
+    hintText?: string;
+    /** RTL hint text */
+    rtlHintText?: string;
+    /** Error message */
+    error?: string;
+    /** RTL error message */
+    rtlError?: string;
+    /** Value */
+    value?: number;
+    /** Change handler */
+    onChange?: (value: number) => void;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step */
+    step?: number;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Show spinner buttons */
+    showSpinner?: boolean;
+    /** Full width */
+    fullWidth?: boolean;
+    /** Custom class for container */
+    containerClassName?: string;
+}
+
+/**
+ * Pagination component for navigating through pages of content.
+ * Supports multiple sizes, RTL mode, and configurable display options.
+ *
+ * Features:
+ * - Page number buttons with intelligent ellipsis
+ * - Previous/Next navigation
+ * - First/Last page buttons (optional)
+ * - Simple variant (text-based)
+ * - RTL support
+ * - Accessible keyboard navigation
+ */
+export declare const Pagination: ForwardRefExoticComponent<PaginationProps & RefAttributes<HTMLDivElement>>;
+
+export declare interface PaginationProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange"> {
+    /** Current active page (1-indexed) */
+    currentPage: number;
+    /** Total number of pages */
+    totalPages: number;
+    /** Callback when page changes */
+    onPageChange?: (page: number) => void;
+    /** Size variant */
+    size?: PaginationSize;
+    /** Visual variant */
+    variant?: PaginationVariant;
+    /** Show first/last page buttons */
+    showFirstLast?: boolean;
+    /** Show previous/next buttons */
+    showPrevNext?: boolean;
+    /** Number of page buttons to show on each side of current page */
+    siblingCount?: number;
+    /** Enable RTL (Right-to-Left) mode */
+    rtl?: boolean;
+    /** Disable all pagination controls */
+    disabled?: boolean;
+}
+
+export declare type PaginationSize = "sm" | "md" | "lg";
+
+export declare type PaginationVariant = "default" | "simple";
+
+/**
+ * ProgressBar component for displaying progress visually.
+ * Supports multiple sizes, colors, labels, helper text, and inline indicators.
+ * Includes RTL (Right-to-Left) support for Arabic, Hebrew, and other RTL languages.
+ *
+ * Size Specifications:
+ * - sm: 4px height
+ * - lg: 8px height
+ */
+export declare const ProgressBar: ForwardRefExoticComponent<ProgressBarProps & RefAttributes<HTMLDivElement>>;
+
+export declare type ProgressBarColor = "default" | "green" | "golden" | "amber" | "red" | "purple" | "sky" | "neutral";
+
+export declare type ProgressBarLabelType = "top" | "bottom" | "none";
+
+export declare interface ProgressBarProps extends Omit<HTMLAttributes<HTMLDivElement>, "color"> {
+    /** Progress value from 0 to 100 */
+    value?: number;
+    /** The size of the progress bar */
+    size?: ProgressBarSize;
+    /** The color of the progress bar fill */
+    color?: ProgressBarColor;
+    /** Label text */
+    label?: string;
+    /** Label position (top, bottom, or none) */
+    labelType?: ProgressBarLabelType;
+    /** Helper text below the progress bar */
+    helperText?: string;
+    /** Whether helper text indicates danger/error */
+    helperDanger?: boolean;
+    /** Show inline progress indicator */
+    showInlineIndicator?: boolean;
+    /** Type of progress indicator */
+    indicatorType?: ProgressIndicatorType;
+    /** Custom icon for indicator */
+    customIcon?: ReactNode;
+    /** Enable RTL (Right-to-Left) mode */
+    rtl?: boolean;
+    /** RTL label text */
+    rtlLabel?: string;
+    /** RTL helper text */
+    rtlHelperText?: string;
+}
+
+export declare type ProgressBarSize = "sm" | "lg";
+
+export declare type ProgressIndicatorType = "loading" | "completed" | "error" | "custom" | "none";
+
+export declare const Radio: ForwardRefExoticComponent<RadioProps & RefAttributes<HTMLInputElement>>;
+
+export declare const RadioCard: ForwardRefExoticComponent<RadioCardProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface RadioCardProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+    /** Card label/title */
+    label: string;
+    /** Description text below label */
+    description?: string;
+    /** RTL label (Arabic) */
+    rtlLabel?: string;
+    /** RTL description (Arabic) */
+    rtlDescription?: string;
+    /** Icon or image to display */
+    leadingIcon?: ReactNode;
+    /** Support text on the right side */
+    supportText?: string;
+    /** RTL support text */
+    rtlSupportText?: string;
+    /** Radio position */
+    radioLocation?: 'leading' | 'trailing';
+    /** RTL mode */
+    rtl?: boolean;
+    /** Error state */
+    error?: boolean;
+}
+
+export declare interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+    /** Radio label */
+    label?: string;
+    /** Support text below label */
+    supportText?: string;
+    /** RTL label (Arabic) */
+    rtlLabel?: string;
+    /** RTL support text (Arabic) */
+    rtlSupportText?: string;
+    /** Radio position relative to label */
+    radioLocation?: 'leading' | 'trailing';
     /** RTL mode */
     rtl?: boolean;
+    /** Error state */
+    error?: boolean;
 }
 
+export declare const Slider: ForwardRefExoticComponent<SliderProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface SliderProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+    /** Slider size */
+    size?: SliderSize;
+    /** Minimum value */
+    min?: number;
+    /** Maximum value */
+    max?: number;
+    /** Step increment */
+    step?: number;
+    /** Current value */
+    value?: number;
+    /** Default value */
+    defaultValue?: number;
+    /** Show value label above thumb */
+    showValue?: boolean;
+    /** Show min/max labels */
+    showMinMax?: boolean;
+    /** Label text */
+    label?: string;
+    /** RTL label (Arabic) */
+    rtlLabel?: string;
+    /** Helper text below slider */
+    helperText?: string;
+    /** RTL helper text */
+    rtlHelperText?: string;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Error state */
+    error?: boolean;
+    /** Custom value formatter */
+    formatValue?: (value: number) => string;
+    /** Callback when value changes */
+    onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void;
+}
+
+export declare type SliderSize = 'sm' | 'md' | 'lg';
+
 /**
  * SocialButton component for social media authentication buttons.
  * Supports multiple platforms (Facebook, LinkedIn, Apple, WhatsApp, Google, X),
@@ -414,4 +825,100 @@ export declare interface SwitcherProps extends Omit<InputHTMLAttributes<HTMLInpu
 
 export declare type SwitcherSize = 'sm' | 'md' | 'lg';
 
+export declare const Tab: {
+    ({ value, children, disabled, icon, badge, className, onClick, ...props }: TabProps): JSX_2.Element;
+    displayName: string;
+};
+
+export declare interface TabProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'value'> {
+    /** Tab value (must be unique) */
+    value: string;
+    /** Tab label */
+    children: ReactNode;
+    /** Disabled state */
+    disabled?: boolean;
+    /** Optional icon */
+    icon?: ReactNode;
+    /** Badge/count to display */
+    badge?: number | string;
+}
+
+export declare const Tabs: {
+    ({ defaultValue, value: controlledValue, onChange, variant, size, fullWidth, children, className, ...props }: TabsProps): JSX_2.Element;
+    displayName: string;
+};
+
+export declare const TabsContent: {
+    ({ value, children, className, ...props }: TabsContentProps): JSX_2.Element | null;
+    displayName: string;
+};
+
+export declare interface TabsContentProps extends HTMLAttributes<HTMLDivElement> {
+    /** Value matching the tab */
+    value: string;
+    /** Content to display */
+    children: ReactNode;
+}
+
+export declare const TabsList: {
+    ({ children, className, ...props }: TabsListProps): JSX_2.Element;
+    displayName: string;
+};
+
+export declare interface TabsListProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+}
+
+export declare interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, 'onChange'> {
+    /** Default active tab value */
+    defaultValue?: string;
+    /** Controlled active tab value */
+    value?: string;
+    /** Callback when tab changes */
+    onChange?: (value: string) => void;
+    /** Tabs variant */
+    variant?: TabsVariant;
+    /** Tabs size */
+    size?: TabsSize;
+    /** Make tabs full width */
+    fullWidth?: boolean;
+    /** Children (TabsList and TabsContent) */
+    children: ReactNode;
+}
+
+export declare type TabsSize = 'sm' | 'md' | 'lg';
+
+export declare type TabsVariant = 'line' | 'contained' | 'pills';
+
+export declare const Toggle: ForwardRefExoticComponent<ToggleProps & RefAttributes<HTMLInputElement>>;
+
+export declare interface ToggleProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size' | 'type'> {
+    /** Toggle size */
+    size?: ToggleSize;
+    /** Label text */
+    label?: string;
+    /** RTL label (Arabic) */
+    rtlLabel?: string;
+    /** Support text below label */
+    supportText?: string;
+    /** RTL support text */
+    rtlSupportText?: string;
+    /** Label position relative to toggle */
+    labelPosition?: 'leading' | 'trailing';
+    /** Show icon inside toggle when checked */
+    showIcon?: boolean;
+    /** Custom icon to show when toggle is ON (checked) */
+    iconOn?: ReactNode;
+    /** Custom icon to show when toggle is OFF (unchecked) */
+    iconOff?: ReactNode;
+    /** RTL mode */
+    rtl?: boolean;
+    /** Error state */
+    error?: boolean;
+    /** Callback when toggle changes */
+    onCheckedChange?: (checked: boolean) => void;
+}
+
+export declare type ToggleSize = 'sm' | 'md' | 'lg';
+
 export { }