mainbase-ui 1.2.4

package/dist/index.d.cts

@@ -0,0 +1,789 @@
+import * as react from 'react';
+import { ReactNode, CSSProperties, HTMLAttributes, ButtonHTMLAttributes, InputHTMLAttributes, PropsWithChildren, ImgHTMLAttributes, ReactElement, MouseEvent, KeyboardEvent, Ref, RefObject, TextareaHTMLAttributes, ElementType } from 'react';
+
+type MainbaseColorScheme = "light" | "dark";
+type MainbaseRadius = number | string;
+interface MainbaseColors {
+    primary: string;
+    primaryHover: string;
+    primaryActive: string;
+    text: string;
+    textSecondary: string;
+    textMuted: string;
+    background: string;
+    backgroundSecondary: string;
+    backgroundTertiary: string;
+    border: string;
+    borderHover: string;
+    success: string;
+    warning: string;
+    danger: string;
+    info: string;
+    overlay: string;
+}
+interface MainbaseRadii {
+    sm: MainbaseRadius;
+    md: MainbaseRadius;
+    lg: MainbaseRadius;
+    xl: MainbaseRadius;
+    full: MainbaseRadius;
+}
+interface MainbaseShadows {
+    xs: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+}
+interface MainbaseSpacing {
+    xs: MainbaseRadius;
+    sm: MainbaseRadius;
+    md: MainbaseRadius;
+    lg: MainbaseRadius;
+    xl: MainbaseRadius;
+}
+interface MainbaseTypography {
+    fontFamily: string;
+    fontFamilyMonospace: string;
+    fontSizeXs: MainbaseRadius;
+    fontSizeSm: MainbaseRadius;
+    fontSizeMd: MainbaseRadius;
+    fontSizeLg: MainbaseRadius;
+    fontSizeXl: MainbaseRadius;
+    lineHeight: number | string;
+}
+interface MainbaseTransitions {
+    fast: string;
+    normal: string;
+    slow: string;
+}
+interface MainbaseZIndex {
+    dropdown: number;
+    sticky: number;
+    modal: number;
+    toast: number;
+    tooltip: number;
+}
+interface MainbaseComponentDefaults {
+    Button?: {
+        variant?: "primary" | "secondary" | "outline" | "ghost";
+        size?: "sm" | "md" | "lg";
+    };
+    IconButton?: {
+        variant?: "primary" | "secondary" | "outline" | "ghost";
+        size?: "sm" | "md" | "lg";
+    };
+    Input?: {
+        size?: "sm" | "md" | "lg";
+    };
+    Select?: {
+        size?: "sm" | "md" | "lg";
+    };
+    Text?: {
+        size?: "xs" | "sm" | "md" | "lg";
+        weight?: "regular" | "medium" | "semibold" | "bold";
+        color?: "default" | "muted" | "primary";
+    };
+    Title?: {
+        order?: 1 | 2 | 3 | 4 | 5 | 6;
+        weight?: "medium" | "semibold" | "bold";
+    };
+    Card?: {
+        padding?: "sm" | "md" | "lg";
+        radius?: "sm" | "md" | "lg";
+        shadow?: "none" | "sm" | "md";
+    };
+    Badge?: {
+        variant?: "default" | "primary" | "success" | "warning" | "danger";
+        size?: "sm" | "md" | "lg";
+    };
+    Modal?: {
+        size?: "sm" | "md" | "lg";
+        closeOnEscape?: boolean;
+        closeOnOverlayClick?: boolean;
+        withCloseButton?: boolean;
+    };
+    Toast?: {
+        position?: "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+        duration?: number;
+        maxToasts?: number;
+    };
+    Tabs?: {
+        variant?: "underline" | "pill";
+        size?: "sm" | "md" | "lg";
+    };
+    Accordion?: {
+        variant?: "default" | "separated";
+        size?: "sm" | "md" | "lg";
+    };
+    Drawer?: {
+        position?: "left" | "right" | "top" | "bottom";
+        size?: "sm" | "md" | "lg" | "full";
+        closeOnEscape?: boolean;
+        closeOnOverlayClick?: boolean;
+        withCloseButton?: boolean;
+    };
+    Divider?: {
+        orientation?: "horizontal" | "vertical";
+        variant?: "solid" | "dashed" | "dotted";
+        labelPosition?: "left" | "center" | "right";
+    };
+    PasswordInput?: {
+        size?: "sm" | "md" | "lg";
+        visibilityToggle?: boolean;
+    };
+    PinInput?: {
+        size?: "sm" | "md" | "lg";
+        length?: number;
+        type?: "number" | "alphanumeric";
+        mask?: boolean;
+    };
+    FileInput?: {
+        size?: "sm" | "md" | "lg";
+        multiple?: boolean;
+        maxSize?: number;
+    };
+    Pagination?: {
+        size?: "sm" | "md" | "lg";
+        variant?: "default" | "filled";
+        siblings?: number;
+        boundaries?: number;
+        withEdges?: boolean;
+        withControls?: boolean;
+    };
+    DatePicker?: {
+        size?: "sm" | "md" | "lg";
+        firstDayOfWeek?: 0 | 1;
+        clearable?: boolean;
+    };
+}
+interface MainbaseTheme {
+    colorScheme: MainbaseColorScheme;
+    colors: MainbaseColors;
+    radii: MainbaseRadii;
+    shadows: MainbaseShadows;
+    spacing: MainbaseSpacing;
+    typography: MainbaseTypography;
+    transitions: MainbaseTransitions;
+    zIndex: MainbaseZIndex;
+    focusRingWidth: MainbaseRadius;
+    components: MainbaseComponentDefaults;
+}
+type MainbaseThemeOverride = {
+    colorScheme?: MainbaseColorScheme;
+    colors?: Partial<MainbaseColors>;
+    radii?: Partial<MainbaseRadii>;
+    shadows?: Partial<MainbaseShadows>;
+    spacing?: Partial<MainbaseSpacing>;
+    typography?: Partial<MainbaseTypography>;
+    transitions?: Partial<MainbaseTransitions>;
+    zIndex?: Partial<MainbaseZIndex>;
+    focusRingWidth?: MainbaseRadius;
+    components?: MainbaseComponentDefaults;
+};
+interface MainbaseProviderProps {
+    children: ReactNode;
+    theme?: MainbaseThemeOverride;
+    className?: string;
+    style?: CSSProperties;
+    asChild?: boolean;
+}
+
+declare function MainbaseProvider({ children, theme, className, style, }: MainbaseProviderProps): react.JSX.Element;
+
+declare function useMainbaseTheme(): MainbaseTheme;
+
+declare function useComponentDefaults<T extends keyof MainbaseComponentDefaults>(component: T): NonNullable<MainbaseComponentDefaults[T]>;
+
+declare const defaultMainbaseTheme: MainbaseTheme;
+
+declare const MainbasePortalContext: react.Context<HTMLElement | null>;
+
+interface AlertProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    variant?: "info" | "success" | "warning" | "danger";
+    title?: ReactNode;
+    leftSection?: ReactNode;
+    action?: ReactNode;
+}
+declare function Alert({ variant, title, leftSection, action, className, children, ...props }: AlertProps): react.JSX.Element;
+
+interface BadgeProps extends HTMLAttributes<HTMLSpanElement> {
+    variant?: "default" | "primary" | "success" | "warning" | "danger";
+    size?: "sm" | "md" | "lg";
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+}
+declare function Badge({ variant, size, leftSection, rightSection, className, children, ...props }: BadgeProps): react.JSX.Element;
+
+interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    variant?: "primary" | "secondary" | "outline" | "ghost";
+    size?: "sm" | "md" | "lg";
+    loading?: boolean;
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface CheckboxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    label?: ReactNode;
+    description?: ReactNode;
+}
+declare function Checkbox({ label, description, className, disabled, ...props }: CheckboxProps): react.JSX.Element;
+
+interface GroupProps extends HTMLAttributes<HTMLDivElement> {
+    gap?: number;
+    align?: "start" | "center" | "end" | "stretch";
+    justify?: "start" | "center" | "end" | "between";
+    wrap?: boolean;
+}
+declare function Group({ gap, align, justify, wrap, className, style, children, ...props }: GroupProps): react.JSX.Element;
+
+interface IconProps extends HTMLAttributes<HTMLSpanElement> {
+    children: ReactNode;
+    size?: number;
+    color?: string;
+    decorative?: boolean;
+}
+declare function Icon({ children, size, color, decorative, className, style, ...props }: IconProps): react.JSX.Element;
+
+interface ModalProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    opened: boolean;
+    onClose: () => void;
+    title?: ReactNode;
+    description?: ReactNode;
+    children?: ReactNode;
+    footer?: ReactNode;
+    size?: "sm" | "md" | "lg";
+    closeOnEscape?: boolean;
+    closeOnOverlayClick?: boolean;
+    withCloseButton?: boolean;
+}
+declare function Modal({ opened, onClose, title, description, children, footer, size, closeOnEscape, closeOnOverlayClick, withCloseButton, className, ...props }: ModalProps): react.JSX.Element | null;
+
+interface PortalProps {
+    children: ReactNode;
+    target?: HTMLElement | null;
+}
+declare function Portal({ children, target, }: PortalProps): react.ReactPortal | null;
+
+interface RadioProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    label?: ReactNode;
+    description?: ReactNode;
+}
+declare function Radio({ label, description, className, disabled, ...props }: RadioProps): react.JSX.Element;
+
+interface RadioGroupProps extends HTMLAttributes<HTMLDivElement> {
+    label?: ReactNode;
+    description?: ReactNode;
+    orientation?: "vertical" | "horizontal";
+}
+declare function RadioGroup({ label, description, orientation, className, children, ...props }: RadioGroupProps): react.JSX.Element;
+
+interface SelectOption {
+    value: string;
+    label: ReactNode;
+    disabled?: boolean;
+    leftSection?: ReactNode;
+}
+interface SelectProps {
+    options: SelectOption[];
+    value?: string;
+    defaultValue?: string;
+    placeholder?: string;
+    size?: "sm" | "md" | "lg";
+    leftSection?: ReactNode;
+    disabled?: boolean;
+    error?: boolean;
+    className?: string;
+    name?: string;
+    onChange?: (value: string, option: SelectOption) => void;
+}
+declare function Select({ options, value, defaultValue, placeholder, size, leftSection, disabled, error, className, name, onChange, }: SelectProps): react.JSX.Element;
+
+interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {
+    size?: number;
+    thickness?: number;
+    color?: string;
+    trackColor?: string;
+    label?: string;
+}
+declare function Spinner({ size, thickness, color, trackColor, label, className, style, ...props }: SpinnerProps): react.JSX.Element;
+
+interface StackProps extends HTMLAttributes<HTMLDivElement> {
+    gap?: number;
+    align?: "stretch" | "start" | "center" | "end";
+    justify?: "start" | "center" | "end" | "between";
+}
+declare function Stack({ gap, align, justify, className, style, children, ...props }: StackProps): react.JSX.Element;
+
+interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "type"> {
+    label?: ReactNode;
+    description?: ReactNode;
+}
+declare function Switch({ label, description, className, disabled, ...props }: SwitchProps): react.JSX.Element;
+
+type ToastVariant = "info" | "success" | "warning" | "danger";
+type ToastPosition = "top-left" | "top-center" | "top-right" | "bottom-left" | "bottom-center" | "bottom-right";
+interface ToastOptions {
+    id?: string;
+    title?: ReactNode;
+    message: ReactNode;
+    variant?: ToastVariant;
+    duration?: number;
+    closable?: boolean;
+    icon?: ReactNode;
+}
+interface ToastItem extends Omit<ToastOptions, "id"> {
+    id: string;
+    variant: ToastVariant;
+    duration: number;
+    closable: boolean;
+}
+type ToastShortcutInput = string | Omit<ToastOptions, "variant">;
+interface ToastApi {
+    show: (options: ToastOptions | string) => string;
+    info: (input: ToastShortcutInput) => string;
+    success: (input: ToastShortcutInput) => string;
+    warning: (input: ToastShortcutInput) => string;
+    danger: (input: ToastShortcutInput) => string;
+    remove: (id: string) => void;
+    clear: () => void;
+}
+
+interface ToastProviderProps extends PropsWithChildren {
+    position?: ToastPosition;
+    defaultDuration?: number;
+    maxToasts?: number;
+}
+declare function ToastProvider({ children, position, defaultDuration, maxToasts, }: ToastProviderProps): react.JSX.Element;
+
+declare function useToast(): ToastApi;
+
+interface AvatarProps extends Omit<HTMLAttributes<HTMLDivElement>, "color"> {
+    src?: string;
+    alt?: string;
+    children?: ReactNode;
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    radius?: "sm" | "md" | "lg" | "full";
+    color?: string;
+    background?: string;
+    status?: "online" | "offline" | "busy" | "away";
+    imageProps?: Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "alt">;
+}
+declare function Avatar({ src, alt, children, size, radius, color, background, status, imageProps, className, style, ...props }: AvatarProps): react.JSX.Element;
+
+interface AvatarGroupProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    max?: number;
+    spacing?: "sm" | "md" | "lg";
+    size?: AvatarProps["size"];
+    radius?: AvatarProps["radius"];
+    total?: number;
+    renderOverflow?: (hiddenCount: number) => ReactNode;
+}
+declare function AvatarGroup({ children, max, spacing, size, radius, total, renderOverflow, className, ...props }: AvatarGroupProps): react.JSX.Element;
+
+interface ProgressProps extends Omit<HTMLAttributes<HTMLDivElement>, "color"> {
+    value?: number;
+    size?: "sm" | "md" | "lg";
+    variant?: "primary" | "success" | "warning" | "danger";
+    label?: ReactNode;
+    showValue?: boolean;
+    indeterminate?: boolean;
+}
+declare function Progress({ value, size, variant, label, showValue, indeterminate, className, style, ...props }: ProgressProps): react.JSX.Element;
+
+interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+    width?: number | string;
+    height?: number | string;
+    circle?: boolean;
+    radius?: "sm" | "md" | "lg";
+    visible?: boolean;
+    animate?: boolean;
+}
+declare function Skeleton({ width, height, circle, radius, visible, animate, className, style, ...props }: SkeletonProps): react.JSX.Element | null;
+
+type TabsOrientation = "horizontal" | "vertical";
+type TabsVariant = "underline" | "pill";
+type TabsSize = "sm" | "md" | "lg";
+interface TabsProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    value?: string | null;
+    defaultValue?: string | null;
+    onChange?: (value: string) => void;
+    orientation?: TabsOrientation;
+    variant?: TabsVariant;
+    size?: TabsSize;
+}
+declare function Tabs({ value, defaultValue, onChange, orientation, variant, size, className, children, ...props }: TabsProps): react.JSX.Element;
+declare namespace Tabs {
+    var List: typeof TabsList;
+    var Tab: typeof TabsTab;
+    var Panel: typeof TabsPanel;
+}
+interface TabsListProps extends HTMLAttributes<HTMLDivElement> {
+    grow?: boolean;
+}
+declare function TabsList({ grow, className, children, onKeyDown, ...props }: TabsListProps): react.JSX.Element;
+interface TabsTabProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    value: string;
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+}
+declare function TabsTab({ value, leftSection, rightSection, disabled, className, children, onClick, ...props }: TabsTabProps): react.JSX.Element;
+interface TabsPanelProps extends HTMLAttributes<HTMLDivElement> {
+    value: string;
+    keepMounted?: boolean;
+}
+declare function TabsPanel({ value, keepMounted, className, children, ...props }: TabsPanelProps): react.JSX.Element | null;
+
+type TooltipPosition = "top" | "right" | "bottom" | "left";
+interface TooltipProps {
+    children: ReactElement;
+    label: ReactNode;
+    position?: TooltipPosition;
+    offset?: number;
+    openDelay?: number;
+    closeDelay?: number;
+    disabled?: boolean;
+    withArrow?: boolean;
+    className?: string;
+}
+declare function Tooltip({ children, label, position, offset, openDelay, closeDelay, disabled, withArrow, className, }: TooltipProps): react.JSX.Element | null;
+
+type AccordionType = "single" | "multiple";
+type AccordionVariant = "default" | "separated";
+type AccordionSize = "sm" | "md" | "lg";
+type AccordionChevronPosition = "left" | "right";
+type AccordionValue = string | string[] | null;
+interface AccordionProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    type?: AccordionType;
+    value?: AccordionValue;
+    defaultValue?: AccordionValue;
+    onChange?: (value: AccordionValue) => void;
+    variant?: AccordionVariant;
+    size?: AccordionSize;
+    chevronPosition?: AccordionChevronPosition;
+    allowCollapse?: boolean;
+}
+declare function AccordionRoot({ type, value, defaultValue, onChange, variant, size, chevronPosition, allowCollapse, className, children, ...props }: AccordionProps): react.JSX.Element;
+interface AccordionItemProps extends HTMLAttributes<HTMLDivElement> {
+    value: string;
+    disabled?: boolean;
+}
+declare function AccordionItem({ value, disabled, className, children, ...props }: AccordionItemProps): react.JSX.Element;
+interface AccordionControlProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+    chevron?: ReactNode;
+}
+declare function AccordionControl({ leftSection, rightSection, chevron, className, children, onClick, onKeyDown, ...props }: AccordionControlProps): react.JSX.Element;
+interface AccordionPanelProps extends HTMLAttributes<HTMLDivElement> {
+    keepMounted?: boolean;
+}
+declare function AccordionPanel({ keepMounted, className, children, ...props }: AccordionPanelProps): react.JSX.Element | null;
+declare const Accordion: typeof AccordionRoot & {
+    Item: typeof AccordionItem;
+    Control: typeof AccordionControl;
+    Panel: typeof AccordionPanel;
+};
+
+type DrawerPosition = "left" | "right" | "top" | "bottom";
+type DrawerSize = "sm" | "md" | "lg" | "full";
+interface DrawerProps extends Omit<HTMLAttributes<HTMLDivElement>, "title"> {
+    opened: boolean;
+    onClose: () => void;
+    title?: ReactNode;
+    description?: ReactNode;
+    children?: ReactNode;
+    footer?: ReactNode;
+    position?: DrawerPosition;
+    size?: DrawerSize;
+    closeOnEscape?: boolean;
+    closeOnOverlayClick?: boolean;
+    withCloseButton?: boolean;
+}
+declare function Drawer({ opened, onClose, title, description, children, footer, position, size, closeOnEscape, closeOnOverlayClick, withCloseButton, className, ...props }: DrawerProps): react.JSX.Element | null;
+
+type MenuPosition = "bottom-start" | "bottom-end" | "top-start" | "top-end";
+type MenuWidth = number | string;
+interface MenuProps {
+    children: ReactNode;
+    position?: MenuPosition;
+    offset?: number;
+    width?: MenuWidth;
+    disabled?: boolean;
+    closeOnItemClick?: boolean;
+}
+declare function MenuRoot({ children, position, offset, width, disabled, closeOnItemClick, }: MenuProps): react.JSX.Element;
+interface MenuTargetProps {
+    children: ReactElement;
+}
+declare function MenuTarget({ children, }: MenuTargetProps): ReactElement<{
+    ref?: React.Ref<HTMLElement>;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+    onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
+    "aria-haspopup"?: string;
+    "aria-expanded"?: boolean;
+    "aria-controls"?: string;
+}, string | react.JSXElementConstructor<any>> | null;
+interface MenuDropdownProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+}
+declare function MenuDropdown({ children, className, style, ...props }: MenuDropdownProps): react.JSX.Element | null;
+interface MenuItemProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+    color?: "default" | "danger";
+    closeMenuOnClick?: boolean;
+}
+declare function MenuItem({ leftSection, rightSection, color, closeMenuOnClick, disabled, className, children, onClick, ...props }: MenuItemProps): react.JSX.Element;
+interface MenuLabelProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function MenuLabel({ className, children, ...props }: MenuLabelProps): react.JSX.Element;
+interface MenuDividerProps extends HTMLAttributes<HTMLDivElement> {
+}
+declare function MenuDivider({ className, ...props }: MenuDividerProps): react.JSX.Element;
+declare const Menu: typeof MenuRoot & {
+    Target: typeof MenuTarget;
+    Dropdown: typeof MenuDropdown;
+    Item: typeof MenuItem;
+    Label: typeof MenuLabel;
+    Divider: typeof MenuDivider;
+};
+
+type PopoverPosition = "bottom-start" | "bottom-end" | "top-start" | "top-end";
+interface PopoverProps {
+    children: ReactNode;
+    opened?: boolean;
+    defaultOpened?: boolean;
+    onChange?: (opened: boolean) => void;
+    position?: PopoverPosition;
+    offset?: number;
+    width?: number | string;
+    withArrow?: boolean;
+    closeOnClickOutside?: boolean;
+    closeOnEscape?: boolean;
+}
+declare function PopoverRoot({ children, opened, defaultOpened, onChange, position, offset, width, withArrow, closeOnClickOutside, closeOnEscape, }: PopoverProps): react.JSX.Element;
+interface PopoverTargetProps {
+    children: ReactElement;
+}
+declare function PopoverTarget({ children, }: PopoverTargetProps): ReactElement<{
+    ref?: Ref<HTMLElement>;
+    onClick?: (event: MouseEvent<HTMLElement>) => void;
+    onKeyDown?: (event: KeyboardEvent<HTMLElement>) => void;
+    "aria-haspopup"?: string;
+    "aria-expanded"?: boolean;
+    "aria-controls"?: string;
+}, string | react.JSXElementConstructor<any>> | null;
+interface PopoverDropdownProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+}
+declare function PopoverDropdown({ children, className, style, ...props }: PopoverDropdownProps): react.JSX.Element | null;
+declare const Popover: typeof PopoverRoot & {
+    Target: typeof PopoverTarget;
+    Dropdown: typeof PopoverDropdown;
+};
+
+type DividerOrientation = "horizontal" | "vertical";
+type DividerLabelPosition = "left" | "center" | "right";
+type DividerVariant = "solid" | "dashed" | "dotted";
+interface DividerProps extends HTMLAttributes<HTMLDivElement> {
+    orientation?: DividerOrientation;
+    label?: ReactNode;
+    labelPosition?: DividerLabelPosition;
+    variant?: DividerVariant;
+    size?: number | string;
+    color?: string;
+}
+declare function Divider({ orientation, label, labelPosition, variant, size, color, className, style, ...props }: DividerProps): react.JSX.Element;
+
+type PasswordInputSize = "sm" | "md" | "lg";
+interface PasswordInputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size" | "type"> {
+    size?: PasswordInputSize;
+    leftSection?: ReactNode;
+    visible?: boolean;
+    defaultVisible?: boolean;
+    onVisibilityChange?: (visible: boolean) => void;
+    visibilityToggle?: boolean;
+    visibleIcon?: ReactNode;
+    hiddenIcon?: ReactNode;
+    visibleLabel?: string;
+    hiddenLabel?: string;
+    error?: boolean;
+}
+declare const PasswordInput: react.ForwardRefExoticComponent<PasswordInputProps & react.RefAttributes<HTMLInputElement>>;
+
+type PinInputSize = "sm" | "md" | "lg";
+type PinInputType = "number" | "alphanumeric";
+interface PinInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    length?: number;
+    value?: string;
+    defaultValue?: string;
+    onChange?: (value: string) => void;
+    onComplete?: (value: string) => void;
+    size?: PinInputSize;
+    type?: PinInputType;
+    mask?: boolean;
+    oneTimeCode?: boolean;
+    disabled?: boolean;
+    error?: boolean;
+    autoFocus?: boolean;
+    name?: string;
+    placeholder?: string;
+    "aria-label"?: string;
+}
+declare const PinInput: react.ForwardRefExoticComponent<PinInputProps & react.RefAttributes<HTMLInputElement>>;
+
+type FileInputSize = "sm" | "md" | "lg";
+interface FileInputProps extends Omit<HTMLAttributes<HTMLDivElement>, "onChange" | "title"> {
+    name?: string;
+    accept?: string;
+    multiple?: boolean;
+    maxSize?: number;
+    disabled?: boolean;
+    error?: boolean;
+    size?: FileInputSize;
+    title?: ReactNode;
+    description?: ReactNode;
+    acceptLabel?: ReactNode;
+    maxSizeLabel?: ReactNode;
+    icon?: ReactNode;
+    showFileList?: boolean;
+    onFilesChange?: (files: File[]) => void;
+    onRejected?: (files: File[], reason: "type" | "size") => void;
+}
+declare const FileInput: react.ForwardRefExoticComponent<FileInputProps & react.RefAttributes<HTMLInputElement>>;
+
+type PaginationSize = "sm" | "md" | "lg";
+type PaginationVariant = "default" | "filled";
+interface PaginationProps extends Omit<HTMLAttributes<HTMLElement>, "onChange"> {
+    total: number;
+    value?: number;
+    defaultValue?: number;
+    onChange?: (page: number) => void;
+    siblings?: number;
+    boundaries?: number;
+    size?: PaginationSize;
+    variant?: PaginationVariant;
+    disabled?: boolean;
+    withEdges?: boolean;
+    withControls?: boolean;
+    previousLabel?: string;
+    nextLabel?: string;
+    firstLabel?: string;
+    lastLabel?: string;
+    previousIcon?: ReactNode;
+    nextIcon?: ReactNode;
+    firstIcon?: ReactNode;
+    lastIcon?: ReactNode;
+}
+declare const Pagination: react.ForwardRefExoticComponent<PaginationProps & react.RefAttributes<HTMLElement>>;
+
+type DatePickerSize = "sm" | "md" | "lg";
+type DatePickerType = "single" | "range";
+type DateRangeValue = [
+    Date | null,
+    Date | null
+];
+type DatePickerValue = Date | null | DateRangeValue;
+interface DatePickerProps extends Omit<HTMLAttributes<HTMLDivElement>, "defaultValue" | "onChange"> {
+    type?: DatePickerType;
+    value?: DatePickerValue;
+    defaultValue?: DatePickerValue;
+    onChange?: (value: DatePickerValue) => void;
+    size?: DatePickerSize;
+    placeholder?: string;
+    rangeSeparator?: string;
+    locale?: string;
+    firstDayOfWeek?: 0 | 1;
+    minDate?: Date;
+    maxDate?: Date;
+    disabled?: boolean;
+    error?: boolean;
+    clearable?: boolean;
+    name?: string;
+    dateFormat?: Intl.DateTimeFormatOptions;
+}
+declare function DatePicker({ type, value, defaultValue, onChange, size, placeholder, rangeSeparator, locale, firstDayOfWeek, minDate, maxDate, disabled, error, clearable, name, dateFormat, className, ...props }: DatePickerProps): react.JSX.Element;
+
+type ClickOutsideEvent = "mousedown" | "touchstart" | "pointerdown";
+interface UseClickOutsideOptions {
+    enabled?: boolean;
+    events?: ClickOutsideEvent[];
+}
+declare function useClickOutside<T extends HTMLElement>(handler: (event: Event) => void, options?: UseClickOutsideOptions): RefObject<T | null>;
+
+interface UseControllableStateOptions<T> {
+    value?: T;
+    defaultValue: T;
+    onChange?: (value: T) => void;
+}
+declare function useControllableState<T>({ value, defaultValue, onChange, }: UseControllableStateOptions<T>): readonly [T, (nextValue: T | ((current: T) => T)) => void];
+
+interface UseDisclosureHandlers {
+    open: () => void;
+    close: () => void;
+    toggle: () => void;
+}
+type UseDisclosureReturn = [
+    boolean,
+    UseDisclosureHandlers
+];
+declare function useDisclosure(initialValue?: boolean): UseDisclosureReturn;
+
+declare function useLockScroll(locked?: boolean): void;
+
+type ClassValue = string | number | bigint | false | null | undefined;
+declare function cx(...classes: ClassValue[]): string;
+
+interface CardProps extends HTMLAttributes<HTMLDivElement> {
+    padding?: "sm" | "md" | "lg";
+    radius?: "sm" | "md" | "lg";
+    shadow?: "none" | "sm" | "md";
+    header?: ReactNode;
+    footer?: ReactNode;
+}
+declare function Card({ padding, radius, shadow, header, footer, className, children, ...props }: CardProps): react.JSX.Element;
+
+interface IconButtonProps extends ButtonHTMLAttributes<HTMLButtonElement> {
+    icon: ReactNode;
+    label: string;
+    variant?: "primary" | "secondary" | "outline" | "ghost";
+    size?: "sm" | "md" | "lg";
+    loading?: boolean;
+}
+declare const IconButton: react.ForwardRefExoticComponent<IconButtonProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface InputProps extends InputHTMLAttributes<HTMLInputElement> {
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+    error?: boolean;
+}
+declare function Input({ leftSection, rightSection, error, className, disabled, ...props }: InputProps): react.JSX.Element;
+
+interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+}
+declare function Textarea({ className, ...props }: TextareaProps): react.JSX.Element;
+
+interface TextProps extends HTMLAttributes<HTMLElement> {
+    as?: ElementType;
+    size?: "xs" | "sm" | "md" | "lg";
+    weight?: "regular" | "medium" | "semibold" | "bold";
+    color?: "default" | "muted" | "primary";
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+}
+declare function Text({ as: Component, size, weight, color, leftSection, rightSection, className, children, ...props }: TextProps): react.JSX.Element;
+
+interface TitleProps extends HTMLAttributes<HTMLHeadingElement> {
+    order?: 1 | 2 | 3 | 4 | 5 | 6;
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    weight?: "medium" | "semibold" | "bold";
+    color?: "default" | "muted" | "primary";
+    leftSection?: ReactNode;
+    rightSection?: ReactNode;
+}
+declare function Title({ order, size, weight, color, leftSection, rightSection, className, children, ...props }: TitleProps): react.JSX.Element;
+
+export { Accordion, type AccordionChevronPosition, type AccordionControlProps, type AccordionItemProps, type AccordionPanelProps, type AccordionProps, type AccordionSize, type AccordionType, type AccordionValue, type AccordionVariant, Alert, type AlertProps, Avatar, AvatarGroup, type AvatarGroupProps, type AvatarProps, Badge, type BadgeProps, Button, Card, type CardProps, Checkbox, type CheckboxProps, type ClassValue, DatePicker, type DatePickerProps, type DatePickerSize, type DatePickerType, type DatePickerValue, type DateRangeValue, Divider, type DividerProps, Drawer, type DrawerPosition, type DrawerProps, type DrawerSize, FileInput, type FileInputProps, type FileInputSize, Group, type GroupProps, Icon, IconButton, type IconButtonProps, type IconProps, Input, type InputProps, type MainbaseColorScheme, type MainbaseColors, type MainbaseComponentDefaults, MainbasePortalContext, MainbaseProvider, type MainbaseProviderProps, type MainbaseRadii, type MainbaseShadows, type MainbaseSpacing, type MainbaseTheme, type MainbaseThemeOverride, type MainbaseTransitions, type MainbaseTypography, type MainbaseZIndex, Menu, type MenuDividerProps, type MenuDropdownProps, type MenuItemProps, type MenuLabelProps, type MenuPosition, type MenuProps, type MenuTargetProps, type MenuWidth, Modal, type ModalProps, Pagination, type PaginationProps, type PaginationSize, type PaginationVariant, PasswordInput, type PasswordInputProps, type PasswordInputSize, PinInput, type PinInputProps, type PinInputSize, type PinInputType, Popover, type PopoverDropdownProps, type PopoverPosition, type PopoverProps, type PopoverTargetProps, Portal, type PortalProps, Progress, type ProgressProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Select, type SelectOption, type SelectProps, Skeleton, type SkeletonProps, Spinner, type SpinnerProps, Stack, type StackProps, Switch, type SwitchProps, Tabs, TabsList, type TabsListProps, type TabsOrientation, TabsPanel, type TabsPanelProps, type TabsProps, type TabsSize, TabsTab, type TabsTabProps, type TabsVariant, Text, type TextProps, Textarea, type TextareaProps, Title, type TitleProps, type ToastApi, type ToastItem, type ToastOptions, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastShortcutInput, type ToastVariant, Tooltip, type TooltipPosition, type TooltipProps, type UseClickOutsideOptions, type UseControllableStateOptions, type UseDisclosureHandlers, type UseDisclosureReturn, cx, defaultMainbaseTheme, useClickOutside, useComponentDefaults, useControllableState, useDisclosure, useLockScroll, useMainbaseTheme, useToast };