@underverse-ui/underverse 0.1.1

package/dist/index.d.cts

@@ -0,0 +1,885 @@
+import * as React$1 from 'react';
+import React__default, { InputHTMLAttributes, TextareaHTMLAttributes, ReactNode, HTMLAttributes } from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+import { VariantProps } from 'class-variance-authority';
+import { ClassValue } from 'clsx';
+
+declare const VARIANT_STYLES_BTN: {
+    default: string;
+    outline: string;
+    primary: string;
+    secondary: string;
+    success: string;
+    danger: string;
+    destructive: string;
+    warning: string;
+    info: string;
+    ghost: string;
+    link: string;
+    gradient: string;
+};
+declare const SIZE_STYLES_BTN: {
+    sm: string;
+    md: string;
+    lg: string;
+    smx: string;
+    icon: string;
+};
+
+interface ButtonProps extends React__default.ButtonHTMLAttributes<HTMLButtonElement> {
+    onClick?: (event: React__default.MouseEvent<HTMLButtonElement>) => void;
+    children?: React__default.ReactNode;
+    type?: "button" | "submit" | "reset";
+    icon?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    iconRight?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    variant?: keyof typeof VARIANT_STYLES_BTN;
+    size?: keyof typeof SIZE_STYLES_BTN;
+    className?: string;
+    iConClassName?: string;
+    disabled?: boolean;
+    loading?: boolean;
+    fullWidth?: boolean;
+    title?: string;
+    spinner?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    loadingText?: React__default.ReactNode;
+    preserveChildrenOnLoading?: boolean;
+    preventDoubleClick?: boolean;
+    lockMs?: number;
+    asContainer?: boolean;
+}
+declare const Button: React__default.ForwardRefExoticComponent<ButtonProps & React__default.RefAttributes<HTMLButtonElement>>;
+
+interface BadgeProps {
+    children?: React$1.ReactNode;
+    variant?: "default" | "primary" | "secondary" | "success" | "warning" | "danger" | "destructive" | "info" | "outline" | "ghost" | "transparent" | "gradient";
+    size?: "xs" | "sm" | "md" | "lg" | "xl";
+    className?: string;
+    dot?: boolean;
+    count?: number;
+    maxCount?: number;
+    showZero?: boolean;
+    pulse?: boolean;
+    removable?: boolean;
+    onRemove?: () => void;
+    icon?: React$1.ComponentType<{
+        className?: string;
+    }>;
+    clickable?: boolean;
+    onClick?: () => void;
+}
+declare const Badge: React$1.FC<BadgeProps>;
+interface NotificationBadgeProps {
+    children: React$1.ReactNode;
+    count?: number;
+    maxCount?: number;
+    showZero?: boolean;
+    dot?: boolean;
+    variant?: BadgeProps["variant"];
+    size?: BadgeProps["size"];
+    className?: string;
+    badgeClassName?: string;
+    position?: "top-right" | "top-left" | "bottom-right" | "bottom-left";
+    pulse?: boolean;
+}
+declare const NotificationBadge: React$1.FC<NotificationBadgeProps>;
+interface StatusBadgeProps extends Omit<BadgeProps, "variant"> {
+    status?: "online" | "offline" | "busy" | "away" | "idle";
+}
+declare const StatusBadge: React$1.FC<StatusBadgeProps>;
+interface TagBadgeProps extends Omit<BadgeProps, "removable"> {
+    tags?: string[];
+    onTagRemove?: (tag: string) => void;
+    maxTags?: number;
+}
+declare const TagBadge: React$1.FC<TagBadgeProps>;
+interface InteractiveBadgeProps extends BadgeProps {
+    active?: boolean;
+    disabled?: boolean;
+}
+declare const InteractiveBadge: React$1.FC<InteractiveBadgeProps>;
+interface GradientBadgeProps extends Omit<BadgeProps, "variant"> {
+    from?: string;
+    to?: string;
+}
+declare const GradientBadge: React$1.FC<GradientBadgeProps>;
+interface PulseBadgeProps extends BadgeProps {
+    speed?: "slow" | "normal" | "fast";
+}
+declare const PulseBadge: React$1.FC<PulseBadgeProps>;
+
+interface CardProps extends React__default.HTMLAttributes<HTMLDivElement> {
+    title?: string;
+    description?: string;
+    footer?: React__default.ReactNode;
+    className?: string;
+    children?: React__default.ReactNode;
+    hoverable?: boolean;
+    clickable?: boolean;
+    innerClassName?: string;
+    contentClassName?: string;
+    noPadding?: boolean;
+}
+declare const Card: ({ title, description, children, footer, className, hoverable, clickable, innerClassName, contentClassName, noPadding, onClick, ...rest }: CardProps) => React__default.JSX.Element;
+
+interface CheckboxProps extends React$1.InputHTMLAttributes<HTMLInputElement> {
+    label?: React$1.ReactNode;
+    labelClassName?: string;
+    containerClassName?: string;
+}
+declare const Checkbox: React$1.ForwardRefExoticComponent<CheckboxProps & React$1.RefAttributes<HTMLInputElement>>;
+
+interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    label?: string;
+    error?: string;
+    description?: string;
+    variant?: "default" | "filled" | "outlined" | "minimal";
+    size?: "sm" | "md" | "lg";
+    leftIcon?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    rightIcon?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    clearable?: boolean;
+    loading?: boolean;
+    success?: boolean;
+    onClear?: () => void;
+    hint?: string;
+    counter?: boolean;
+    maxLength?: number;
+}
+declare const Input: React__default.ForwardRefExoticComponent<InputProps & React__default.RefAttributes<HTMLInputElement>>;
+
+interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    label?: string;
+    error?: string;
+    description?: string;
+    variant?: "default" | "filled" | "outlined";
+    size?: "sm" | "md" | "lg";
+}
+declare const Textarea: React$1.ForwardRefExoticComponent<TextareaProps & React$1.RefAttributes<HTMLTextAreaElement>>;
+
+interface SwitchProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, 'size'> {
+    checked: boolean;
+    onCheckedChange: (checked: boolean) => void;
+    label?: string;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "success" | "warning" | "danger";
+    disabled?: boolean;
+}
+declare const Switch: React$1.FC<SwitchProps>;
+
+declare const Label: React$1.ForwardRefExoticComponent<React$1.LabelHTMLAttributes<HTMLLabelElement> & VariantProps<(props?: class_variance_authority_types.ClassProp | undefined) => string> & React$1.RefAttributes<HTMLLabelElement>>;
+
+interface AvatarProps extends React$1.HTMLAttributes<HTMLDivElement> {
+    src?: string;
+    alt?: string;
+    fallback?: string;
+    size?: "sm" | "md" | "lg";
+    onClick?: () => void;
+}
+declare const Avatar: ({ src, alt, fallback, size, className, onClick, ...props }: AvatarProps) => React$1.JSX.Element;
+
+interface SkeletonProps {
+    className?: string;
+    width?: string | number;
+    height?: string | number;
+    variant?: "rectangular" | "circular" | "rounded" | "text";
+    animation?: "pulse" | "wave" | "none";
+    lines?: number;
+}
+declare const Skeleton: React__default.FC<SkeletonProps>;
+
+interface ProgressProps {
+    value: number;
+    max?: number;
+    className?: string;
+    variant?: "default" | "primary" | "success" | "warning" | "danger" | "info";
+    size?: "sm" | "md" | "lg" | "xl";
+    showValue?: boolean;
+    label?: string;
+    animated?: boolean;
+    striped?: boolean;
+    indeterminate?: boolean;
+    description?: string;
+    status?: "normal" | "error" | "complete";
+}
+declare const Progress: React__default.FC<ProgressProps>;
+
+interface ModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    children: React$1.ReactNode;
+    title?: string;
+    description?: string;
+    className?: string;
+    overlayClassName?: string;
+    showCloseButton?: boolean;
+    closeOnOverlayClick?: boolean;
+    closeOnEsc?: boolean;
+    size?: "sm" | "md" | "lg" | "xl" | "full";
+}
+declare const Modal: React$1.FC<ModalProps>;
+
+type ToastType = "success" | "error" | "warning" | "info";
+type ToastPosition = "top-right" | "top-left" | "bottom-right" | "bottom-left" | "top-center" | "bottom-center";
+interface Toast {
+    id: string;
+    type: ToastType;
+    title?: string;
+    message: string;
+    duration?: number;
+    action?: {
+        label: string;
+        onClick: () => void;
+    };
+    dismissible?: boolean;
+}
+interface ToastContextType {
+    addToast: (toast: Omit<Toast, "id">) => void;
+    removeToast: (id: string) => void;
+    toasts: Toast[];
+}
+declare const useToast: () => ToastContextType;
+interface ToastProviderProps {
+    children: React__default.ReactNode;
+    position?: ToastPosition;
+    maxToasts?: number;
+}
+declare const ToastProvider: React__default.FC<ToastProviderProps>;
+
+interface TooltipProps {
+    children: React$1.ReactElement;
+    content: React$1.ReactNode;
+    placement?: "top" | "right" | "bottom" | "left";
+    delay?: number | {
+        open?: number;
+        close?: number;
+    };
+    className?: string;
+    disabled?: boolean;
+    variant?: "default" | "info" | "warning" | "error" | "success";
+}
+declare const Tooltip: React$1.FC<TooltipProps>;
+
+interface PopoverProps {
+    trigger: React$1.ReactElement;
+    children: React$1.ReactNode;
+    className?: string;
+    contentClassName?: string;
+    placement?: "top" | "bottom" | "left" | "right" | "top-start" | "bottom-start" | "top-end" | "bottom-end";
+    modal?: boolean;
+    disabled?: boolean;
+    open?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    matchTriggerWidth?: boolean;
+    contentWidth?: number;
+}
+declare const Popover: React$1.FC<PopoverProps>;
+
+interface SheetProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    side?: "left" | "right" | "top" | "bottom";
+    size?: "sm" | "md" | "lg" | "xl" | "full";
+    variant?: "default" | "overlay" | "push";
+    children: React$1.ReactNode;
+    title?: React$1.ReactNode;
+    description?: React$1.ReactNode;
+    className?: string;
+    showClose?: boolean;
+    closeOnOutsideClick?: boolean;
+    closeOnEscape?: boolean;
+    header?: React$1.ReactNode;
+    footer?: React$1.ReactNode;
+}
+declare const Sheet: React$1.FC<SheetProps>;
+interface DrawerProps extends Omit<SheetProps, "side"> {
+    placement?: "left" | "right";
+}
+declare const Drawer: React$1.FC<DrawerProps>;
+interface SlideOverProps extends Omit<SheetProps, "side" | "variant"> {
+}
+declare const SlideOver: React$1.FC<SlideOverProps>;
+interface BottomSheetProps extends Omit<SheetProps, "side"> {
+    snapPoints?: string[];
+    defaultSnap?: number;
+}
+declare const BottomSheet: React$1.FC<BottomSheetProps>;
+interface SidebarSheetProps extends Omit<SheetProps, "side" | "variant"> {
+    navigation?: React$1.ReactNode;
+}
+declare const SidebarSheet: React$1.FC<SidebarSheetProps>;
+
+type AlertVariant = "default" | "info" | "success" | "warning" | "error";
+interface AlertProps {
+    title?: string;
+    description?: ReactNode;
+    variant?: AlertVariant;
+    className?: string;
+    icon?: ReactNode;
+    dismissible?: boolean;
+    onClose?: () => void;
+    actions?: ReactNode;
+}
+declare const Alert: ({ title, description, variant, className, icon, dismissible, onClose, actions }: AlertProps) => React$1.JSX.Element | null;
+
+interface GlobalLoadingProps {
+    className?: string;
+    backdrop?: boolean;
+    position?: 'fixed' | 'absolute';
+    size?: 'sm' | 'md' | 'lg';
+}
+/**
+ * Component GlobalLoading - tự động lắng nghe singleton loading state
+ * Chỉ cần gắn 1 lần ở root của app
+ */
+declare const GlobalLoading: React__default.FC<GlobalLoadingProps>;
+interface PageLoadingProps {
+    message?: string;
+    className?: string;
+}
+declare const PageLoading: React__default.FC<PageLoadingProps>;
+interface InlineLoadingProps {
+    isLoading: boolean;
+    text?: string;
+    className?: string;
+    size?: 'sm' | 'md' | 'lg';
+}
+declare const InlineLoading: React__default.FC<InlineLoadingProps>;
+interface ButtonLoadingProps {
+    isLoading: boolean;
+    children: React__default.ReactNode;
+    className?: string;
+    disabled?: boolean;
+    loadingText?: string;
+}
+declare const ButtonLoading: React__default.FC<ButtonLoadingProps>;
+
+interface BreadcrumbItem {
+    label: string;
+    href?: string;
+    icon?: React$1.ComponentType<{
+        className?: string;
+    }>;
+    disabled?: boolean;
+}
+interface BreadcrumbProps {
+    items: BreadcrumbItem[];
+    className?: string;
+    separator?: React$1.ComponentType<{
+        className?: string;
+    }> | string;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "simple" | "slash" | "arrow" | "pill";
+    maxItems?: number;
+    showHome?: boolean;
+    homeHref?: string;
+    collapsible?: boolean;
+}
+declare const Breadcrumb: React$1.FC<BreadcrumbProps>;
+
+interface Tab {
+    label: string;
+    value: string;
+    content: React$1.ReactNode;
+    icon?: React$1.ComponentType<{
+        className?: string;
+    }>;
+    disabled?: boolean;
+}
+interface TabsProps {
+    tabs: Tab[];
+    defaultValue?: string;
+    className?: string;
+    variant?: "default" | "pills" | "underline" | "card" | "underline-card";
+    size?: "sm" | "md" | "lg";
+    orientation?: "horizontal" | "vertical";
+    onTabChange?: (value: string) => void;
+    stretch?: boolean;
+}
+declare const Tabs: React$1.FC<TabsProps>;
+interface SimpleTabsProps {
+    tabs: Array<{
+        label: string;
+        value: string;
+        content: React$1.ReactNode;
+    }>;
+    defaultValue?: string;
+    className?: string;
+}
+declare const SimpleTabs: React$1.FC<SimpleTabsProps>;
+interface PillTabsProps extends TabsProps {
+    contained?: boolean;
+}
+declare const PillTabs: React$1.FC<PillTabsProps>;
+interface VerticalTabsProps extends TabsProps {
+    sidebarWidth?: string;
+}
+declare const VerticalTabs: React$1.FC<VerticalTabsProps>;
+
+interface DropdownMenuProps {
+    trigger: React__default.ReactElement;
+    children?: React__default.ReactNode;
+    className?: string;
+    contentClassName?: string;
+    placement?: "top" | "bottom" | "left" | "right" | "top-start" | "bottom-start" | "top-end" | "bottom-end";
+    closeOnSelect?: boolean;
+    disabled?: boolean;
+    isOpen?: boolean;
+    onOpenChange?: (open: boolean) => void;
+    items?: Array<{
+        label: string;
+        icon?: React__default.ComponentType<any>;
+        onClick: () => void;
+        disabled?: boolean;
+        destructive?: boolean;
+    }>;
+}
+declare const DropdownMenu: React__default.FC<DropdownMenuProps>;
+
+interface PaginationProps {
+    page: number;
+    totalPages: number;
+    onChange: (page: number) => void;
+    className?: string;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "outline" | "ghost";
+    showFirstLast?: boolean;
+    showPrevNext?: boolean;
+    showPageNumbers?: boolean;
+    showInfo?: boolean;
+    disabled?: boolean;
+    pageSize?: number;
+    pageSizeOptions?: number[];
+    onPageSizeChange?: (size: number) => void;
+    totalItems?: number;
+}
+declare const Pagination: React$1.FC<PaginationProps>;
+
+interface SectionProps extends React__default.HTMLAttributes<HTMLElement> {
+    children: React__default.ReactNode;
+    className?: string;
+    variant?: "default" | "muted" | "primary" | "accent";
+    spacing?: "sm" | "md" | "lg" | "xl";
+    fullWidth?: boolean;
+}
+declare const Section: React__default.ForwardRefExoticComponent<SectionProps & React__default.RefAttributes<HTMLElement>>;
+
+interface ScrollAreaProps extends HTMLAttributes<HTMLDivElement> {
+    className?: string;
+}
+declare const ScrollArea: React$1.ForwardRefExoticComponent<ScrollAreaProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface DatePickerProps {
+    id?: string;
+    value?: Date;
+    onChange: (date: Date) => void;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    size?: "sm" | "md";
+    label?: string;
+    required?: boolean;
+}
+declare const DatePicker: React$1.FC<DatePickerProps>;
+
+type ComboboxOption = string | {
+    label: string;
+    value: any;
+};
+interface ComboboxProps {
+    id?: string;
+    options: ComboboxOption[];
+    value?: any;
+    onChange: (value: any) => void;
+    placeholder?: string;
+    className?: string;
+    disabled?: boolean;
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "outline" | "ghost";
+    allowClear?: boolean;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    usePortal?: boolean;
+    label?: string;
+    required?: boolean;
+    fontBold?: boolean;
+}
+declare const Combobox: React$1.FC<ComboboxProps>;
+
+interface MultiComboboxProps {
+    id?: string;
+    options: string[];
+    value: string[];
+    onChange: (value: string[]) => void;
+    placeholder?: string;
+    maxSelected?: number;
+    disabledOptions?: string[];
+    showTags?: boolean;
+    showClear?: boolean;
+    className?: string;
+    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
+    label?: string;
+    required?: boolean;
+}
+declare const MultiCombobox: React$1.FC<MultiComboboxProps>;
+
+interface RadioGroupProps {
+    value?: string;
+    defaultValue?: string;
+    onValueChange?: (value: string) => void;
+    name?: string;
+    disabled?: boolean;
+    orientation?: "horizontal" | "vertical";
+    size?: "sm" | "md" | "lg";
+    variant?: "default" | "card" | "button";
+    className?: string;
+    children: React$1.ReactNode;
+    required?: boolean;
+    error?: boolean;
+    errorMessage?: string;
+}
+declare const RadioGroup: React$1.ForwardRefExoticComponent<RadioGroupProps & React$1.RefAttributes<HTMLDivElement>>;
+
+interface SliderProps extends Omit<React$1.InputHTMLAttributes<HTMLInputElement>, 'onChange' | 'size'> {
+    value?: number;
+    defaultValue?: number;
+    min?: number;
+    max?: number;
+    step?: number;
+    onChange?: (value: number) => void;
+    onValueChange?: (value: number) => void;
+    label?: React$1.ReactNode;
+    labelClassName?: string;
+    containerClassName?: string;
+    trackClassName?: string;
+    thumbClassName?: string;
+    showValue?: boolean;
+    valueClassName?: string;
+    formatValue?: (value: number) => string;
+    size?: "sm" | "md" | "lg";
+    disabled?: boolean;
+    orientation?: "horizontal" | "vertical";
+}
+declare const Slider: React$1.ForwardRefExoticComponent<SliderProps & React$1.RefAttributes<HTMLInputElement>>;
+
+interface Category {
+    id: number;
+    name: string;
+    parent_id?: number | null;
+}
+interface CategoryTreeSelectProps {
+    categories: Category[];
+    value: number[];
+    onChange: (selectedIds: number[]) => void;
+    placeholder?: string;
+    disabled?: boolean;
+}
+declare function CategoryTreeSelect({ categories, value, onChange, placeholder, disabled }: CategoryTreeSelectProps): React__default.JSX.Element;
+
+type Fit = "cover" | "contain";
+interface SmartImageProps {
+    src: string | undefined | null;
+    alt: string;
+    className?: string;
+    /**
+     * Aspect ratio utility class, e.g. `aspect-square`, `aspect-[4/3]`.
+     * If provided with `fill`, the wrapper enforces the ratio.
+     */
+    ratioClass?: string;
+    /**
+     * Rounded corners; defaults to `rounded-lg` to match project style.
+     */
+    roundedClass?: string;
+    /**
+     * When true, uses fill layout; otherwise width/height if provided.
+     */
+    fill?: boolean;
+    width?: number;
+    height?: number;
+    sizes?: string;
+    priority?: boolean;
+    quality?: number;
+    fit?: Fit;
+    /** Optional fallback src if original fails. */
+    fallbackSrc?: string;
+}
+declare function SmartImage({ src, alt, className, ratioClass, roundedClass, fill, width, height, sizes, priority, quality, fit, fallbackSrc, }: SmartImageProps): React__default.JSX.Element;
+
+interface UploadedImage {
+    id: number;
+    path: string;
+    url: string;
+    originalName: string;
+    size: number;
+    mimeType: string;
+    width?: number;
+    height?: number;
+    formattedSize?: string;
+}
+interface ImageUploadProps {
+    onUpload?: (image: UploadedImage) => void;
+    onRemove?: (imageId: string) => void;
+    maxSize?: number;
+    accept?: string;
+    multiple?: boolean;
+    disabled?: boolean;
+    className?: string;
+    showPreview?: boolean;
+    previewSize?: 'sm' | 'md' | 'lg';
+    dragDropText?: string;
+    browseText?: string;
+    supportedFormatsText?: string;
+}
+declare function ImageUpload({ onUpload, onRemove, maxSize, // Convert bytes to MB
+accept, multiple, disabled, className, showPreview, previewSize, dragDropText, browseText, supportedFormatsText }: ImageUploadProps): React$1.JSX.Element;
+
+interface ProductImageUploadProps {
+    value?: string;
+    onChange: (url: string) => void;
+    disabled?: boolean;
+    className?: string;
+}
+declare const ProductImageUpload: React__default.FC<ProductImageUploadProps>;
+
+interface CarouselProps {
+    children: React$1.ReactNode[];
+    autoScroll?: boolean;
+    autoScrollInterval?: number;
+}
+declare function Carousel({ children, autoScroll, autoScrollInterval }: CarouselProps): React$1.JSX.Element;
+
+interface ClientOnlyProps {
+    children: React.ReactNode;
+    fallback?: React.ReactNode;
+}
+declare function ClientOnly({ children, fallback }: ClientOnlyProps): React$1.JSX.Element;
+
+interface LoadingSpinnerProps {
+    size?: 'sm' | 'md' | 'lg';
+    className?: string;
+    color?: 'primary' | 'foreground' | 'muted';
+}
+declare const LoadingSpinner: React__default.FC<LoadingSpinnerProps>;
+interface LoadingDotsProps {
+    className?: string;
+    color?: 'primary' | 'foreground' | 'muted';
+}
+declare const LoadingDots: React__default.FC<LoadingDotsProps>;
+interface LoadingBarProps {
+    progress?: number;
+    className?: string;
+    animated?: boolean;
+    label?: string;
+}
+declare const LoadingBar: React__default.FC<LoadingBarProps>;
+
+type FilterType = "text" | "select" | "date";
+type DataTableColumn<T> = {
+    key: string;
+    title: React__default.ReactNode;
+    dataIndex?: keyof T | string;
+    width?: number | string;
+    align?: "left" | "center" | "right";
+    sortable?: boolean;
+    filter?: {
+        type: FilterType;
+        options?: string[];
+        placeholder?: string;
+    };
+    render?: (value: any, record: T, index: number) => React__default.ReactNode;
+    visible?: boolean;
+};
+type Sorter = {
+    key: string;
+    order: "asc" | "desc";
+} | null;
+interface DataTableQuery {
+    filters: Record<string, any>;
+    sort?: Sorter;
+    page: number;
+    pageSize: number;
+}
+interface DataTableProps<T> {
+    columns: DataTableColumn<T>[];
+    data: T[];
+    rowKey?: ((row: T) => string | number) | keyof T;
+    loading?: boolean;
+    total?: number;
+    page?: number;
+    pageSize?: number;
+    onQueryChange?: (q: DataTableQuery) => void;
+    caption?: React__default.ReactNode;
+    toolbar?: React__default.ReactNode;
+    enableColumnVisibilityToggle?: boolean;
+    enableDensityToggle?: boolean;
+    striped?: boolean;
+    className?: string;
+}
+declare function DataTable<T extends Record<string, any>>({ columns, data, rowKey, loading, total, page, pageSize, onQueryChange, caption, toolbar, enableColumnVisibilityToggle, enableDensityToggle, striped, // Mặc định bật màu nền sẽn kẽ cho các dòng
+className, }: DataTableProps<T>): React__default.JSX.Element;
+
+interface TableProps extends React__default.HTMLAttributes<HTMLTableElement> {
+    containerClassName?: string;
+}
+declare const Table: React__default.ForwardRefExoticComponent<TableProps & React__default.RefAttributes<HTMLTableElement>>;
+interface TableHeaderProps extends React__default.HTMLAttributes<HTMLTableSectionElement> {
+    filterRow?: React__default.ReactNode;
+}
+declare const TableHeader: React__default.ForwardRefExoticComponent<TableHeaderProps & React__default.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & React__default.RefAttributes<HTMLTableSectionElement>>;
+declare const TableFooter: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableSectionElement> & React__default.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableRowElement> & React__default.RefAttributes<HTMLTableRowElement>>;
+declare const TableHead: React__default.ForwardRefExoticComponent<React__default.ThHTMLAttributes<HTMLTableCellElement> & React__default.RefAttributes<HTMLTableCellElement>>;
+declare const TableCell: React__default.ForwardRefExoticComponent<React__default.TdHTMLAttributes<HTMLTableCellElement> & React__default.RefAttributes<HTMLTableCellElement>>;
+declare const TableCaption: React__default.ForwardRefExoticComponent<React__default.HTMLAttributes<HTMLTableCaptionElement> & React__default.RefAttributes<HTMLTableCaptionElement>>;
+
+interface NotificationItem {
+    id: number;
+    title?: string;
+    body?: string;
+    type?: string;
+    is_read: boolean;
+    created_at: string;
+    metadata?: any;
+}
+interface NotificationModalProps {
+    isOpen: boolean;
+    onClose: () => void;
+    notification: NotificationItem | null;
+}
+declare function NotificationModal({ isOpen, onClose, notification }: NotificationModalProps): React$1.JSX.Element | null;
+
+interface FloatingContactsProps {
+    className?: string;
+}
+declare function FloatingContacts({ className }: FloatingContactsProps): React$1.JSX.Element | null;
+
+type Variant = "destructive" | "warning" | "info";
+interface AccessDeniedProps {
+    title?: string;
+    description?: string;
+    variant?: Variant;
+    icon?: React__default.ComponentType<{
+        className?: string;
+    }>;
+    className?: string;
+    children?: React__default.ReactNode;
+}
+declare function AccessDenied({ title, description, variant, icon: Icon, className, children, }: AccessDeniedProps): React__default.JSX.Element;
+
+declare function cn(...inputs: ClassValue[]): string;
+
+/**
+ * Date formatting utilities for Vietnamese locale
+ * Provides consistent date/time formatting across the application
+ */
+/**
+ * Format date to Vietnamese readable format
+ * Example: "25 tháng 12, 2024"
+ */
+declare function formatDate(date: string | Date | null | undefined): string;
+/**
+ * Format date to short format
+ * Example: "25/12/2024"
+ */
+declare function formatDateShort(date: string | Date | null | undefined): string;
+/**
+ * Format time only
+ * Example: "14:30"
+ */
+declare function formatTime(date: string | Date | null | undefined): string;
+/**
+ * Format date and time
+ * Example: "25/12/2024 14:30"
+ */
+declare function formatDateTime(date: string | Date | null | undefined): string;
+/**
+ * Format date with time - more readable
+ * Example: "25 tháng 12, 2024 lúc 14:30"
+ */
+declare function formatDateTimeLong(date: string | Date | null | undefined): string;
+/**
+ * Format relative time (time ago)
+ * Example: "2 giờ trước", "3 ngày trước", "1 tuần trước"
+ */
+declare function formatTimeAgo(date: string | Date | null | undefined): string;
+/**
+ * Format date range
+ * Example: "25/12/2024 - 31/12/2024"
+ */
+declare function formatDateRange(startDate: string | Date | null | undefined, endDate: string | Date | null | undefined): string;
+/**
+ * Check if date is today
+ */
+declare function isToday(date: string | Date | null | undefined): boolean;
+/**
+ * Check if date is yesterday
+ */
+declare function isYesterday(date: string | Date | null | undefined): boolean;
+/**
+ * Smart date formatting - shows relative time for recent dates, full date for older ones
+ * Example:
+ * - "Vừa xong" (< 1 min)
+ * - "5 phút trước" (< 1 hour)
+ * - "Hôm nay lúc 14:30" (today)
+ * - "Hôm qua lúc 14:30" (yesterday)
+ * - "25/12/2024 14:30" (older)
+ */
+declare function formatDateSmart(date: string | Date | null | undefined): string;
+/**
+ * Format date for input[type="date"]
+ * Example: "2024-12-25"
+ */
+declare function formatDateForInput(date: string | Date | null | undefined): string;
+/**
+ * Format date for input[type="datetime-local"]
+ * Example: "2024-12-25T14:30"
+ */
+declare function formatDateTimeForInput(date: string | Date | null | undefined): string;
+/**
+ * Get day of week in Vietnamese
+ * Example: "Thứ Hai", "Thứ Ba", ...
+ */
+declare function getDayOfWeek(date: string | Date | null | undefined): string;
+/**
+ * Format with day of week
+ * Example: "Thứ Hai, 25/12/2024"
+ */
+declare function formatDateWithDay(date: string | Date | null | undefined): string;
+
+declare const date_formatDate: typeof formatDate;
+declare const date_formatDateForInput: typeof formatDateForInput;
+declare const date_formatDateRange: typeof formatDateRange;
+declare const date_formatDateShort: typeof formatDateShort;
+declare const date_formatDateSmart: typeof formatDateSmart;
+declare const date_formatDateTime: typeof formatDateTime;
+declare const date_formatDateTimeForInput: typeof formatDateTimeForInput;
+declare const date_formatDateTimeLong: typeof formatDateTimeLong;
+declare const date_formatDateWithDay: typeof formatDateWithDay;
+declare const date_formatTime: typeof formatTime;
+declare const date_formatTimeAgo: typeof formatTimeAgo;
+declare const date_getDayOfWeek: typeof getDayOfWeek;
+declare const date_isToday: typeof isToday;
+declare const date_isYesterday: typeof isYesterday;
+declare namespace date {
+  export { date_formatDate as formatDate, date_formatDateForInput as formatDateForInput, date_formatDateRange as formatDateRange, date_formatDateShort as formatDateShort, date_formatDateSmart as formatDateSmart, date_formatDateTime as formatDateTime, date_formatDateTimeForInput as formatDateTimeForInput, date_formatDateTimeLong as formatDateTimeLong, date_formatDateWithDay as formatDateWithDay, date_formatTime as formatTime, date_formatTimeAgo as formatTimeAgo, date_getDayOfWeek as getDayOfWeek, date_isToday as isToday, date_isYesterday as isYesterday };
+}
+
+declare const VARIANT_STYLES_ALERT: {
+    default: string;
+    info: string;
+    success: string;
+    warning: string;
+    error: string;
+};
+
+export { AccessDenied, Alert, Avatar, Badge, Badge as BadgeBase, BottomSheet, Breadcrumb, Button, ButtonLoading, Card, Carousel, CategoryTreeSelect, Checkbox, ClientOnly, Combobox, DataTable, DatePicker, date as DateUtils, Drawer, DropdownMenu, FloatingContacts, GlobalLoading, GradientBadge, ImageUpload, InlineLoading, Input, InteractiveBadge, Label, LoadingBar, LoadingDots, LoadingSpinner, Modal, MultiCombobox, NotificationBadge, NotificationModal, PageLoading, Pagination, PillTabs, Popover, ProductImageUpload, Progress, PulseBadge, RadioGroup, SIZE_STYLES_BTN, ScrollArea, Section, Sheet, SidebarSheet, SimpleTabs, Skeleton, SlideOver, Slider, SmartImage, StatusBadge, Switch, Table, TableBody, TableCaption, TableCell, TableFooter, TableHead, TableHeader, TableRow, Tabs, TagBadge, Textarea, ToastProvider, Tooltip, VARIANT_STYLES_ALERT, VARIANT_STYLES_BTN, VerticalTabs, cn, useToast };