@openway/ui 1.0.2 → 1.0.3

package/dist/index.d.ts

@@ -1,14 +1,14 @@
 import * as react_jsx_runtime from 'react/jsx-runtime';
 import react, { ButtonHTMLAttributes, Ref, ReactNode, HTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, SVGProps, ReactElement, CSSProperties, HTMLProps, RefObject, MouseEvent, TdHTMLAttributes, ThHTMLAttributes } from 'react';
 import { TextareaAutosizeProps } from 'react-textarea-autosize';
-import { A as AlertProps, T as ToasterProps, a as ToastOptions, b as ToastPromiseOptions, E as EmptyProps, c as EmptyPresetImage, S as SelectProps, M as MultiSelectProps, d as SelectOptionItem, e as SelectSize, f as SelectVariant, g as SelectColor, h as SelectRadius, i as SelectSearchPlacement, j as SelectFilterField, k as SelectFilterLayout } from './useInfiniteScroll-D9AW6cQV.js';
-export { l as AlertColor, m as AlertRadius, n as AlertSize, o as AlertVariant, B as BaseSelectProps, p as EmptyLayout, q as EmptySize, r as SelectFilterType, s as SelectSearchMode, t as SingleSelectProps, u as ToastMessageObject, v as ToastMessageResult, w as ToastPosition, x as ToastPromiseFunction, U as UseInfiniteScrollOptions, y as UseInfiniteScrollReturn, z as useInfiniteScroll } from './useInfiniteScroll-D9AW6cQV.js';
+import { A as AlertProps, T as ToasterProps, a as ToastOptions, b as ToastPromiseOptions, E as EmptyProps, c as EmptyPresetImage, S as SelectProps, M as MultiSelectProps, d as SelectOptionItem, e as SelectSize, f as SelectVariant, g as SelectColor, h as SelectRadius, i as SelectSearchPlacement, j as SelectFilterField, k as SelectFilterLayout } from './useInfiniteScroll-C5t7bvLu.js';
+export { l as AlertColor, m as AlertRadius, n as AlertSize, o as AlertVariant, B as BaseSelectProps, p as EmptyLayout, q as EmptySize, r as SelectFilterType, s as SelectSearchMode, t as SingleSelectProps, u as ToastMessageObject, v as ToastMessageResult, w as ToastPosition, x as ToastPromiseFunction, U as UseInfiniteScrollOptions, y as UseInfiniteScrollReturn, z as useInfiniteScroll } from './useInfiniteScroll-C5t7bvLu.js';
 import { Placement, ExtendedRefs, ReferenceType, FloatingContext } from '@floating-ui/react';
 import { Accept, DropzoneRootProps } from 'react-dropzone';
 import { ImageProps } from 'next/image';
 import * as _tanstack_react_table from '@tanstack/react-table';
-import { TableFeatures, FilterFn, RowData, TableOptions, ColumnHelper, ReactTable, ColumnDef, Row, PaginationState, OnChangeFn, SortingState, RowSelectionState, ColumnVisibilityState, FilterFnOption, ColumnFiltersState, Header, Column } from '@tanstack/react-table';
-export { Column, ColumnDef, ColumnFiltersState, ColumnHelper, ColumnVisibilityState, Header, OnChangeFn, PaginationState, ReactTable, Row, RowData, RowSelectionState, SortingState } from '@tanstack/react-table';
+import { TableFeatures, FilterFn, RowData, TableOptions, ColumnHelper, ReactTable, ColumnDef, Row, PaginationState, OnChangeFn, SortingState, RowSelectionState, ColumnVisibilityState, FilterFnOption, ColumnFiltersState, ExpandedState, Header, Column } from '@tanstack/react-table';
+export { Column, ColumnDef, ColumnFiltersState, ColumnHelper, ColumnVisibilityState, ExpandedState, FilterFnOption, Header, OnChangeFn, PaginationState, ReactTable, Row, RowData, RowSelectionState, SortingState } from '@tanstack/react-table';
 import { RankingInfo } from '@tanstack/match-sorter-utils';
 export { RankingInfo } from '@tanstack/match-sorter-utils';
 import 'sonner';
@@ -239,7 +239,7 @@ interface InputConfig {
     isClearable?: boolean;
     /**
      * Mở rộng chiều rộng 100% của container chứa
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
 }
@@ -294,11 +294,6 @@ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"
      * @default 'floating'
      */
     labelPlacement?: LabelPlacement;
-    /**
-     * Đánh dấu trường bắt buộc nhập (hiển thị dấu * đỏ cạnh label)
-     * @default false
-     */
-    isRequired?: boolean;
     /**
      * Đoạn văn bản hướng dẫn/chú thích bên dưới input
      */
@@ -307,21 +302,6 @@ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"
      * Thông báo lỗi hiển thị bên dưới input (khi có errorMessage sẽ tự động kích hoạt trạng thái báo lỗi)
      */
     errorMessage?: ReactNode;
-    /**
-     * Trạng thái báo lỗi (viền đỏ, aria-invalid="true")
-     * @default false
-     */
-    isInvalid?: boolean;
-    /**
-     * Trạng thái đang tải (vô hiệu hóa tương tác)
-     * @default false
-     */
-    isLoading?: boolean;
-    /**
-     * Hiển thị biểu tượng xoay spinner khi đang ở trạng thái loading
-     * @default false
-     */
-    showSpinner?: boolean;
     /**
      * Icon hoặc phần tử hiển thị ở đầu ô input
      */
@@ -338,20 +318,10 @@ interface InputProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "size"
      * Addon / suffix cố định hiển thị ở cuối ô input (vd: '.com', 'kg')
      */
     rightAddon?: ReactNode;
-    /**
-     * Hiển thị nút xóa nhanh nội dung khi input có giá trị
-     * @default false
-     */
-    isClearable?: boolean;
     /**
      * Callback khi người dùng nhấn nút xóa nội dung
      */
     onClear?: () => void;
-    /**
-     * Mở rộng chiều rộng 100% của container chứa
-     * @default false
-     */
-    isFullWidth?: boolean;
     /**
      * Tùy biến className cho container bọc toàn bộ (bao gồm label, input wrapper, helper/error text)
      */
@@ -663,7 +633,7 @@ interface MultiInputConfig {
     isClearable?: boolean;
     /**
      * Chiếm toàn bộ chiều rộng 100% của container cha
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
 }
@@ -991,7 +961,7 @@ interface TextAreaConfig {
     showCount?: boolean;
     /**
      * Chiếm toàn bộ chiều rộng 100% của container cha
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
 }
@@ -1036,10 +1006,10 @@ interface TextAreaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>
     label?: ReactNode;
     /**
      * Vị trí của nhãn:
-     * - 'top': nằm phía trên textarea (mặc định cho textarea)
+     * - 'floating': nằm cố định chính giữa viền trên (mặc định)
+     * - 'top': nằm phía trên textarea
      * - 'left': nằm bên trái textarea
-     * - 'floating': nằm cố định chính giữa viền trên
-     * @default 'top'
+     * @default 'floating'
      */
     labelPlacement?: TextAreaLabelPlacement;
     /**
@@ -4302,7 +4272,7 @@ interface DatePickerConfig {
     isClearable?: boolean;
     /**
      * Chiếm toàn bộ 100% chiều rộng container
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
     /**
@@ -4421,7 +4391,7 @@ interface DatePickerProps {
     label?: ReactNode;
     /**
      * Vị trí hiển thị của label ('top' | 'left' | 'floating')
-     * @default 'top'
+     * @default 'floating'
      */
     labelPlacement?: LabelPlacement;
     /**
@@ -4864,7 +4834,7 @@ interface DateRangePickerConfig {
     isClearable?: boolean;
     /**
      * Mở rộng chiếm toàn bộ 100% chiều ngang container cha
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
     /**
@@ -4988,7 +4958,7 @@ interface DateRangePickerProps {
     label?: ReactNode;
     /**
      * Vị trí hiển thị của nhãn tiêu đề
-     * @default "top"
+     * @default "floating"
      */
     labelPlacement?: LabelPlacement;
     /**
@@ -5215,7 +5185,10 @@ interface TimePickerConfig {
     showSpinner?: boolean;
     /** Hiển thị nút xóa nhanh thời gian đã chọn */
     isClearable?: boolean;
-    /** Mở rộng chiều ngang 100% container cha */
+    /**
+     * Mở rộng chiều ngang 100% container cha
+     * @default true
+     */
     isFullWidth?: boolean;
     /** Tự động đóng popover sau khi người dùng chọn xong */
     closeOnSelect?: boolean;
@@ -5268,7 +5241,10 @@ interface TimePickerProps {
     radius?: TimePickerRadius;
     /** Nhãn tiêu đề hiển thị cho ô nhập */
     label?: ReactNode;
-    /** Vị trí đặt nhãn tiêu đề */
+    /**
+     * Vị trí đặt nhãn tiêu đề
+     * @default 'floating'
+     */
     labelPlacement?: LabelPlacement;
     /** Văn bản giữ chỗ khi ô input rỗng */
     placeholder?: string;
@@ -5290,8 +5266,6 @@ interface TimePickerProps {
     onClear?: () => void;
     /** Vị trí hiển thị của popover chọn giờ */
     placement?: Placement;
-    /** Render popover qua FloatingPortal vào body (mặc định true) */
-    portal?: boolean;
     /** Class CSS tùy biến cho thẻ input */
     className?: string;
     /** Class CSS tùy biến cho wrapper ngoài cùng */
@@ -5450,7 +5424,10 @@ interface TimeRangePickerConfig {
     showSpinner?: boolean;
     /** Hiển thị nút xóa nhanh khoảng thời gian đã chọn */
     isClearable?: boolean;
-    /** Mở rộng chiều ngang 100% container cha */
+    /**
+     * Mở rộng chiều ngang 100% container cha
+     * @default true
+     */
     isFullWidth?: boolean;
     /** Tự động đóng popover sau khi người dùng chọn xong cả 2 mốc */
     closeOnSelect?: boolean;
@@ -5509,7 +5486,10 @@ interface TimeRangePickerProps {
     radius?: TimeRangePickerRadius;
     /** Nhãn tiêu đề hiển thị cho ô nhập */
     label?: ReactNode;
-    /** Vị trí đặt nhãn tiêu đề */
+    /**
+     * Vị trí đặt nhãn tiêu đề
+     * @default 'floating'
+     */
     labelPlacement?: LabelPlacement;
     /** Văn bản giữ chỗ khi ô input rỗng */
     placeholder?: string;
@@ -5533,8 +5513,6 @@ interface TimeRangePickerProps {
     onClear?: () => void;
     /** Vị trí hiển thị của popover */
     placement?: Placement;
-    /** Render popover qua FloatingPortal vào body (mặc định true) */
-    portal?: boolean;
     /** Class CSS tùy biến cho thẻ input */
     className?: string;
     /** Class CSS tùy biến cho wrapper ngoài cùng */
@@ -5626,7 +5604,7 @@ interface DateTimePickerConfig {
     isClearable?: boolean;
     /**
      * Chiếm toàn bộ 100% chiều rộng container
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
     /**
@@ -5785,7 +5763,7 @@ interface DateTimePickerProps {
     label?: ReactNode;
     /**
      * Vị trí nhãn ('top' | 'left' | 'floating')
-     * @default 'top'
+     * @default 'floating'
      */
     labelPlacement?: LabelPlacement;
     /**
@@ -5904,7 +5882,7 @@ interface DateTimeRangePickerConfig {
     isClearable?: boolean;
     /**
      * Chiếm toàn bộ 100% chiều rộng container
-     * @default false
+     * @default true
      */
     isFullWidth?: boolean;
     /**
@@ -6078,7 +6056,7 @@ interface DateTimeRangePickerProps {
     label?: ReactNode;
     /**
      * Vị trí nhãn ('top' | 'left' | 'floating')
-     * @default 'top'
+     * @default 'floating'
      */
     labelPlacement?: LabelPlacement;
     /**
@@ -6149,9 +6127,9 @@ interface EmptyIllustrationProps extends SVGProps<SVGSVGElement> {
 }
 declare function EmptyIllustration({ preset, ...props }: EmptyIllustrationProps): react_jsx_runtime.JSX.Element;
 
-declare function Select<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ ref, options, value, defaultValue, onChange, size, variant, color, radius, id: idProp, label, labelPlacement, placeholder, helperText, errorMessage, isInvalid: isInvalidProp, isDisabled, readOnly, isRequired, name, searchable, searchMode, searchPlacement, searchPlaceholder, searchField, searchValue: searchValueProp, onSearchChange, menuFilters, menuFilterValues: controlledFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, menuHeader, menuFooter, listFooter, onSearch, debounceMs, filterFn, isLoading, emptyText, emptyProps, clearable, portal, placement, maxMenuHeight, animated, animationDuration, startContent, endContent, renderValue, renderOption, className, triggerClassName, menuClassName, labelClassName, ...props }: SelectProps<TData, TFilters>): react_jsx_runtime.JSX.Element;
+declare function Select<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ ref, options, value, defaultValue, onChange, size, variant, color, radius, id: idProp, label, labelPlacement, placeholder, helperText, errorMessage, isDisabled, readOnly, name, searchable, searchMode, searchPlacement, searchPlaceholder, searchField, searchValue: searchValueProp, onSearchChange, menuFilters, menuFilterValues: controlledFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, menuHeader, menuFooter, listFooter, onSearch, debounceMs, filterFn, emptyText, emptyProps, portal, portalRoot, placement, maxMenuHeight, animated, animationDuration, startContent, endContent, renderValue, renderOption, config, className, triggerClassName, menuClassName, labelClassName, helperClassName, ...props }: SelectProps<TData, TFilters>): react_jsx_runtime.JSX.Element;
 
-declare function MultiSelect<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ ref, options, value: valueProp, defaultValue, onChange, size, variant, color, radius, id: idProp, label, labelPlacement, placeholder, helperText, errorMessage, isInvalid: isInvalidProp, isDisabled, readOnly, isRequired, name, maxTagCount, searchable, searchMode, searchPlacement, searchPlaceholder, searchField, preserveSelected, searchValue: searchValueProp, onSearchChange, menuFilters, menuFilterValues: controlledFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, menuHeader, menuFooter, listFooter, onSearch, debounceMs, filterFn, isLoading, emptyText, emptyProps, clearable, portal, placement, maxMenuHeight, animated, animationDuration, startContent, endContent, renderValue, renderOption, className, triggerClassName, menuClassName, labelClassName, ...props }: MultiSelectProps<TData, TFilters>): react_jsx_runtime.JSX.Element;
+declare function MultiSelect<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ ref, options, value: valueProp, defaultValue, onChange, size, variant, color, radius, id: idProp, label, labelPlacement, placeholder, helperText, errorMessage, isDisabled, readOnly, name, maxTagCount, searchable, searchMode, searchPlacement, searchPlaceholder, searchField, preserveSelected, searchValue: searchValueProp, onSearchChange, menuFilters, menuFilterValues: controlledFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, menuHeader, menuFooter, listFooter, onSearch, debounceMs, filterFn, emptyText, emptyProps, portal, portalRoot, placement, maxMenuHeight, animated, animationDuration, startContent, endContent, renderValue, renderOption, config, className, triggerClassName, menuClassName, labelClassName, helperClassName, ...props }: MultiSelectProps<TData, TFilters>): react_jsx_runtime.JSX.Element;
 
 interface SingleSelectTriggerProps<TData = unknown> {
     id?: string;
@@ -6172,6 +6150,7 @@ interface SingleSelectTriggerProps<TData = unknown> {
     onClear?: (e: react.MouseEvent) => void;
     clearable?: boolean;
     isLoading?: boolean;
+    showSpinner?: boolean;
     startContent?: ReactNode;
     endContent?: ReactNode;
     renderValue?: (selected: SelectOptionItem<TData>) => ReactNode;
@@ -6180,7 +6159,7 @@ interface SingleSelectTriggerProps<TData = unknown> {
     onKeyDown?: (e: react.KeyboardEvent<HTMLInputElement>) => void;
     className?: string;
 }
-declare function SingleSelectTrigger<TData = unknown>({ id, selectedOption, isOpen, size, variant, color, radius, placeholder, disabled, readOnly, isInvalid, searchable, searchPlacement, searchValue, onSearchChange, onClear, clearable, isLoading, startContent, endContent, renderValue, triggerRef, getReferenceProps, onKeyDown, className, }: SingleSelectTriggerProps<TData>): react_jsx_runtime.JSX.Element;
+declare function SingleSelectTrigger<TData = unknown>({ id, selectedOption, isOpen, size, variant, color, radius, placeholder, disabled, readOnly, isInvalid, searchable, searchPlacement, searchValue, onSearchChange, onClear, clearable, isLoading, showSpinner, startContent, endContent, renderValue, triggerRef, getReferenceProps, onKeyDown, className, }: SingleSelectTriggerProps<TData>): react_jsx_runtime.JSX.Element;
 
 interface MultiSelectTriggerProps<TData = unknown> {
     id?: string;
@@ -6203,6 +6182,7 @@ interface MultiSelectTriggerProps<TData = unknown> {
     onClear?: (e: react.MouseEvent) => void;
     clearable?: boolean;
     isLoading?: boolean;
+    showSpinner?: boolean;
     startContent?: ReactNode;
     endContent?: ReactNode;
     renderValue?: (selected: SelectOptionItem<TData>[]) => ReactNode;
@@ -6211,7 +6191,7 @@ interface MultiSelectTriggerProps<TData = unknown> {
     onKeyDown?: (e: react.KeyboardEvent<HTMLInputElement>) => void;
     className?: string;
 }
-declare function MultiSelectTrigger<TData = unknown>({ id, selectedOptions, isOpen, size, variant, color, radius, placeholder, disabled, readOnly, isInvalid, maxTagCount, searchable, searchPlacement, searchValue, onSearchChange, onRemoveTag, onClear, clearable, isLoading, startContent, endContent, renderValue, triggerRef, getReferenceProps, onKeyDown, className, }: MultiSelectTriggerProps<TData>): react_jsx_runtime.JSX.Element;
+declare function MultiSelectTrigger<TData = unknown>({ id, selectedOptions, isOpen, size, variant, color, radius, placeholder, disabled, readOnly, isInvalid, maxTagCount, searchable, searchPlacement, searchValue, onSearchChange, onRemoveTag, onClear, clearable, isLoading, showSpinner, startContent, endContent, renderValue, triggerRef, getReferenceProps, onKeyDown, className, }: MultiSelectTriggerProps<TData>): react_jsx_runtime.JSX.Element;
 
 interface SelectMenuProps<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>> {
     isOpen: boolean;
@@ -6226,6 +6206,7 @@ interface SelectMenuProps<TData = unknown, TFilters extends Record<string, unkno
     radius?: SelectRadius;
     isLoading?: boolean;
     portal?: boolean;
+    portalRoot?: HTMLElement | null | react.RefObject<HTMLElement | null>;
     maxMenuHeight?: number | string;
     emptyText?: ReactNode;
     emptyProps?: Partial<EmptyProps>;
@@ -6252,7 +6233,7 @@ interface SelectMenuProps<TData = unknown, TFilters extends Record<string, unkno
     listElementsRef: react.RefObject<(HTMLElement | null)[]>;
     className?: string;
 }
-declare function SelectMenu<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ isOpen, isMounted, animated, transitionStyles, options, selectedValues, activeIndex, size, color, radius, isLoading, portal, maxMenuHeight, emptyText, emptyProps, menuHeader, menuFooter, listFooter, menuFilters, menuFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, onResetFilters, renderOption, onSelectOption, onOptionMouseEnter, floatingStyles, floatingRef, getFloatingProps, listElementsRef, className, }: SelectMenuProps<TData, TFilters>): react_jsx_runtime.JSX.Element | null;
+declare function SelectMenu<TData = unknown, TFilters extends Record<string, unknown> = Record<string, unknown>>({ isOpen, isMounted, animated, transitionStyles, options, selectedValues, activeIndex, size, color, radius, isLoading, portal, portalRoot, maxMenuHeight, emptyText, emptyProps, menuHeader, menuFooter, listFooter, menuFilters, menuFilterValues, menuFilterLayout, menuFilterGridCols, showResetFilters, resetFiltersText, onMenuFilterChange, onResetFilters, renderOption, onSelectOption, onOptionMouseEnter, floatingStyles, floatingRef, getFloatingProps, listElementsRef, className, }: SelectMenuProps<TData, TFilters>): react_jsx_runtime.JSX.Element | null;
 
 interface SelectMenuFilterProps<TFilters extends Record<string, unknown> = Record<string, unknown>> {
     filters: SelectFilterField<unknown>[];
@@ -6547,6 +6528,14 @@ interface ModalContainerProps extends HTMLAttributes<HTMLDialogElement> {
      * Class tùy biến CSS cho container bao ngoài dialog
      */
     className?: string;
+    /**
+     * Tự động nhúng Toaster bên trong Modal (Top Layer) để hiển thị thông báo toast nổi trên modal.
+     * - `true` (mặc định): Tự động hiển thị Toaster ở góc trên bên phải (top-right).
+     * - `false`: Tắt Toaster bên trong modal.
+     * - `ToasterProps`: Truyền cấu hình tùy biến cho Toaster.
+     * @default true
+     */
+    toaster?: boolean | ToasterProps;
     /**
      * Nội dung bên trong container (thường là component `<Modal>`)
      */
@@ -8334,6 +8323,14 @@ interface ConfirmContainerProps extends HTMLAttributes<HTMLDialogElement> {
      * Class tùy biến CSS cho container bao ngoài dialog
      */
     className?: string;
+    /**
+     * Tự động nhúng Toaster bên trong Confirm dialog (Top Layer) để hiển thị thông báo toast nổi trên confirm.
+     * - `true` (mặc định): Tự động hiển thị Toaster ở góc trên bên phải (top-right).
+     * - `false`: Tắt Toaster bên trong confirm dialog.
+     * - `ToasterProps`: Truyền cấu hình tùy biến cho Toaster.
+     * @default true
+     */
+    toaster?: boolean | ToasterProps;
     /**
      * Nội dung bên trong container (thường là component `<Confirm>`)
      */
@@ -8361,7 +8358,7 @@ interface ConfirmCloseProps extends HTMLAttributes<HTMLElement> {
  */
 declare function Confirm({ size, radius, className, children, ref, ...props }: ConfirmProps): react_jsx_runtime.JSX.Element;
 
-declare function ConfirmContainer({ open, size, color, isLoading, closeOnOverlayClick, closeOnEsc, lockScroll, overlayClassName, className, children, onClose, ...props }: ConfirmContainerProps): react_jsx_runtime.JSX.Element | null;
+declare function ConfirmContainer({ open, size, color, isLoading, closeOnOverlayClick, closeOnEsc, lockScroll, overlayClassName, className, toaster, children, onClose, ...props }: ConfirmContainerProps): react_jsx_runtime.JSX.Element | null;
 
 /**
  * Phần đầu của hộp thoại Confirm (Hiển thị icon badge, tiêu đề và nút đóng X)
@@ -8405,6 +8402,10 @@ interface ConfirmContextValue {
      * Chủ đề màu sắc của Confirm
      */
     color?: ConfirmColor;
+    /**
+     * Ref trỏ tới phần tử dialog HTML của ConfirmContainer
+     */
+    dialogRef?: React.RefObject<HTMLDialogElement | null>;
 }
 /**
  * Hook truy xuất context của Confirm từ bên trong `<ConfirmContainer>` hoặc `<Confirm>`
@@ -8413,7 +8414,7 @@ declare const useConfirmContext: () => ConfirmContextValue | null;
 
 declare function Modal({ size, radius, className, children, ref, ...props }: ModalProps): react_jsx_runtime.JSX.Element;
 
-declare function ModalContainer({ open, id, size, isLoading, closeOnOverlayClick, closeOnEsc, lockScroll, overlayClassName, className, children, onClose, ...props }: ModalContainerProps): react_jsx_runtime.JSX.Element | null;
+declare function ModalContainer({ open, id, size, isLoading, closeOnOverlayClick, closeOnEsc, lockScroll, overlayClassName, className, toaster, children, onClose, ...props }: ModalContainerProps): react_jsx_runtime.JSX.Element | null;
 
 declare function ModalHeader({ size, title, description, titleClassName, descriptionClassName, showCloseButton, onClose, closeButtonClassName, className, children, ...props }: ModalHeaderProps): react_jsx_runtime.JSX.Element;
 
@@ -8427,6 +8428,7 @@ interface ModalContextValue {
     onClose: () => void;
     isLoading?: boolean;
     size?: ModalSize;
+    dialogRef?: React.RefObject<HTMLDialogElement | null>;
 }
 declare const useModalContext: () => ModalContextValue | null;
 
@@ -8587,22 +8589,13 @@ interface FuzzyFilterMeta {
 type FuzzyFeatures = TableFeatures & {
     filterMeta: FuzzyFilterMeta;
 };
-/**
- * Thuật toán lọc Fuzzy (Fuzzy Filter) sử dụng `@tanstack/match-sorter-utils`.
- *
- * Tính năng:
- * - Chuẩn hóa và so khớp gần đúng (Equal, StartsWith, WordStartsWith, Contains, Acronym, Matches)
- * - Tự động loại bỏ dấu tiếng Việt / diacritics
- * - Không phân biệt chữ hoa / chữ thường (Case-insensitive)
- * - Đính kèm thông tin `RankingInfo` vào metadata qua `addMeta` để hỗ trợ sắp xếp theo độ liên quan
- */
 declare const fuzzyFilter: FilterFn<FuzzyFeatures, RowData>;
 
 /**
  * Bộ features tiêu chuẩn của @openway/ui dành cho TanStack Table v9.
  * Bao gồm: Sắp xếp (Sorting), Phân trang (Pagination), Chọn dòng (Row Selection),
  * Lọc cột & Lọc toàn bảng (Column & Global Filtering), Ẩn/hiện cột (Visibility),
- * Ghim cột (Pinning), và Sắp xếp thứ tự cột (Column Ordering).
+ * Ghim cột (Pinning), Sắp xếp thứ tự cột (Column Ordering), và Mở rộng dòng (Row Expanding).
  */
 declare const defaultTableFeatures: {
     rowSortingFeature: _tanstack_react_table.TableFeature;
@@ -8613,9 +8606,11 @@ declare const defaultTableFeatures: {
     columnVisibilityFeature: _tanstack_react_table.TableFeature;
     columnPinningFeature: _tanstack_react_table.TableFeature;
     columnOrderingFeature: _tanstack_react_table.TableFeature;
+    rowExpandingFeature: _tanstack_react_table.TableFeature;
     sortedRowModel: (table: _tanstack_react_table.Table<any, any>) => () => _tanstack_react_table.RowModel<any, any>;
     paginatedRowModel: (table: _tanstack_react_table.Table<any, any>) => () => _tanstack_react_table.RowModel<any, any>;
     filteredRowModel: (table: _tanstack_react_table.Table<any, any>) => () => _tanstack_react_table.RowModel<any, any>;
+    expandedRowModel: (table: _tanstack_react_table.Table<any, any>) => () => _tanstack_react_table.RowModel<any, any>;
     filterFns: {
         fuzzy: _tanstack_react_table.FilterFn<FuzzyFeatures, RowData>;
     };
@@ -8922,6 +8917,10 @@ interface TableFilterDef<TValue = unknown> {
      * Thuộc tính tùy biến truyền bổ sung vào component editor (DateRangePicker, DatePicker, CheckboxGroup...)
      */
     props?: Record<string, unknown>;
+    /**
+     * Thời gian trì hoãn debounce (ms) riêng cho trường lọc này ở chế độ server (tùy chọn)
+     */
+    debounceMs?: number;
     /**
      * Hàm render component tùy biến khi `type: 'custom'`
      */
@@ -9113,6 +9112,13 @@ interface DataTableProps<TData extends RowData = RowData> {
      * @default false
      */
     manualFiltering?: boolean;
+    /**
+     * Thời gian trì hoãn debounce (ms) khi thay đổi bộ lọc hoặc tìm kiếm ở chế độ server (`manualFiltering: true`).
+     * Áp dụng cho toàn bộ các trường Input, NumberInput, DatePicker, DateRangePicker, CheckboxGroup/Select, custom và tìm kiếm toàn bảng.
+     * Đặt 0 để tắt debounce (gọi ngay lập tức).
+     * @default 300
+     */
+    debounceMs?: number;
     /**
      * Tổng số trang trả về từ máy chủ (bắt buộc khi dùng `manualPagination={true}`)
      */
@@ -9186,6 +9192,84 @@ interface DataTableProps<TData extends RowData = RowData> {
      * Callback khi trạng thái bộ lọc cột thay đổi (trả về mảng ColumnFiltersState của TanStack Table)
      */
     onColumnFiltersChange?: ((filters: ColumnFiltersState) => void) | OnChangeFn<ColumnFiltersState>;
+    /**
+     * Bật tính năng mở rộng dòng (tự động bật nếu có `renderExpandedRow`, `getSubRows`, hoặc `expanded`)
+     * @default false
+     */
+    enableExpanding?: boolean;
+    /**
+     * Bật hiệu ứng mở rộng mượt mà (smooth slide down, fade in và hiệu ứng chuyển động)
+     * @default true
+     */
+    enableExpandingAnimation?: boolean;
+    /**
+     * Trạng thái dòng mở rộng điều khiển ngoài (Controlled state): `Record<rowId, boolean> | true`
+     */
+    expanded?: ExpandedState;
+    /**
+     * Callback khi trạng thái mở rộng dòng thay đổi
+     */
+    onExpandedChange?: ((expanded: ExpandedState) => void) | OnChangeFn<ExpandedState>;
+    /**
+     * Hàm trích xuất dữ liệu con cho cấu trúc cây phân cấp (Tree Data đa tầng)
+     */
+    getSubRows?: (originalRow: TData, index: number) => undefined | TData[];
+    /**
+     * Điều kiện tùy biến xác định dòng nào có thể mở rộng được
+     */
+    getRowCanExpand?: (row: Row<DefaultTableFeatures, TData>) => boolean;
+    /**
+     * Bật chế độ mở rộng thủ công từ máy chủ (Server-side expanding)
+     * @default false
+     */
+    manualExpanding?: boolean;
+    /**
+     * Tự động thu gọn các dòng đã mở rộng khi dữ liệu thay đổi hoặc phân trang
+     * @default true
+     */
+    autoResetExpanded?: boolean;
+    /**
+     * Phân trang các dòng con cùng với các dòng chính của bảng
+     * @default true
+     */
+    paginateExpandedRows?: boolean;
+    /**
+     * Hàm render giao diện tùy biến (Detail Panel gộp colSpan) bên dưới dòng cha khi mở rộng
+     */
+    renderExpandedRow?: (row: Row<DefaultTableFeatures, TData>) => ReactNode;
+    /**
+     * Tự động hiển thị nút mở rộng dòng
+     * @default true (khi tính năng expanding được kích hoạt)
+     */
+    showExpandColumn?: boolean;
+    /**
+     * Chế độ hiển thị nút mở rộng dòng:
+     * - 'integrated': Tích hợp trực tiếp nút mở rộng và thụt lề vào cột dữ liệu đầu tiên (mặc định, không tách riêng cột)
+     * - 'standalone': Tách thành một cột riêng biệt `_expand`
+     * - 'none': Không tự động render UI nút mở rộng
+     * @default 'integrated'
+     */
+    expandColumnMode?: "integrated" | "standalone" | "none";
+    /**
+     * ID cột được tích hợp nút mở rộng khi dùng chế độ `expandColumnMode='integrated'`.
+     * Mặc định tự động gắn vào cột nội dung đầu tiên (sau cột `_select`).
+     */
+    expandColumnId?: string;
+    /**
+     * Vị trí đặt cột nút mở rộng dòng khi ở chế độ `expandColumnMode='standalone'` ('start' ở đầu bảng, 'end' ở cuối bảng)
+     * @default 'start'
+     */
+    expandColumnPosition?: "start" | "end";
+    /**
+     * Mức độ thụt đầu dòng tối đa cho dữ liệu dạng cây (tránh thụt quá sâu làm vỡ layout)
+     * @default 4
+     */
+    maxIndentDepth?: number;
+    /**
+     * Khoảng cách thụt lề cho mỗi cấp độ sâu (tính bằng rem)
+     * @default 1.25
+     */
+    indentSize?: number;
     /**
      * Callback được kích hoạt khi người dùng click vào một dòng trong bảng
      */
@@ -9232,6 +9316,6 @@ declare function TablePagination<TData extends RowData = RowData>({ table, pageS
 
 declare function TableToolbar<TData extends RowData = RowData>({ table, searchPlaceholder, enableGlobalFilter, enableColumnVisibility, isRefresh, onRefresh, actions, selectedActions, filters, filterValues, onFilterChange, onFilterReset, className, }: TableToolbarProps<TData>): react_jsx_runtime.JSX.Element;
 
-declare function DataTable<TData extends RowData = RowData>({ columns, data, variant, size, isLoading, isRefresh, onRefresh, loadingRowsCount, emptyText, emptyIllustration, enableSorting, enableFiltering, enablePagination, enableRowSelection, enableColumnVisibility, enableColumnOrdering, filters, searchPlaceholder, toolbarActions, renderBulkActions, pageSizeOptions, initialPageSize, manualPagination, manualSorting, manualFiltering, pageCount, rowCount, pagination: controlledPagination, onPaginationChange, sorting: controlledSorting, onSortingChange, rowSelection: controlledRowSelection, onRowSelectionChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, columnOrder: controlledColumnOrder, onColumnOrderChange, globalFilter: controlledGlobalFilter, onGlobalFilterChange, globalFilterFn: controlledGlobalFilterFn, columnFilters: controlledColumnFilters, onColumnFiltersChange, onRowClick, className, containerClassName, }: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
+declare function DataTable<TData extends RowData = RowData>({ columns, data, variant, size, isLoading, isRefresh, onRefresh, loadingRowsCount, emptyText, emptyIllustration, enableSorting, enableFiltering, enablePagination, enableRowSelection, enableColumnVisibility, enableColumnOrdering, enableExpanding, enableExpandingAnimation, expanded: controlledExpanded, onExpandedChange, getSubRows, getRowCanExpand, manualExpanding, autoResetExpanded, paginateExpandedRows, renderExpandedRow, showExpandColumn, expandColumnMode, expandColumnId, expandColumnPosition, maxIndentDepth, indentSize, filters, searchPlaceholder, toolbarActions, renderBulkActions, pageSizeOptions, initialPageSize, manualPagination, manualSorting, manualFiltering, pageCount, rowCount, debounceMs, pagination: controlledPagination, onPaginationChange, sorting: controlledSorting, onSortingChange, rowSelection: controlledRowSelection, onRowSelectionChange, columnVisibility: controlledColumnVisibility, onColumnVisibilityChange, columnOrder: controlledColumnOrder, onColumnOrderChange, globalFilter: controlledGlobalFilter, onGlobalFilterChange, globalFilterFn: controlledGlobalFilterFn, columnFilters: controlledColumnFilters, onColumnFiltersChange, onRowClick, className, containerClassName, }: DataTableProps<TData>): react_jsx_runtime.JSX.Element;
 
 export { AUDIO_EXTENSIONS, Alert, AlertCircleIcon, AlertProps, AlertTriangleIcon, ArrowDownIcon, ArrowUpDownIcon, ArrowUpIcon, AvatarIcon, type AvatarIconProps, Badge, type BadgeColor, type BadgeProps, type BadgeRadius, type BadgeSize, type BadgeVariant, Button, type ButtonColor, type ButtonProps, type ButtonRadius, type ButtonSize, type ButtonVariant, Calendar, type CalendarDay, CalendarHeader, type CalendarHeaderProps, CalendarIcon, type CalendarProps, type CalendarView, Carousel, type CarouselArrowPosition, CarouselContent, type CarouselContentProps, type CarouselContextValue, type CarouselNavigationProps, type CarouselNavigationVariant, CarouselNext, CarouselPagination, type CarouselPaginationProps, type CarouselPaginationType, CarouselPrevious, type CarouselProps, type CarouselRadius, type CarouselSize, CarouselSlide, type CarouselSlideProps, CheckCircleIcon, CheckIcon, Checkbox, type CheckboxColor, type CheckboxConfig, CheckboxGroup, type CheckboxGroupConfig, type CheckboxGroupOrientation, type CheckboxGroupProps, type CheckboxLabelPlacement, type CheckboxOptionItem, type CheckboxProps, type CheckboxRadius, type CheckboxSearchMode, type CheckboxSize, type CheckboxVariant, ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon, ClockIcon, CloseIcon, Collapse, type CollapseActiveKey, type CollapseColor, CollapseContent, type CollapseContentProps, type CollapseContextValue$1 as CollapseContextValue, type CollapseExpandIconPosition, CollapseHeader, type CollapseHeaderProps, CollapsePanel, type CollapsePanelContextValue$1 as CollapsePanelContextValue, type CollapsePanelProps, type CollapseProps, type CollapseRadius, type CollapseSize, type CollapseVariant, Collapsible, type CollapsibleProps, type ColumnOrderState, Confirm, ConfirmBody, type ConfirmBodyProps, ConfirmClose, type ConfirmCloseProps, type ConfirmColor, ConfirmContainer, type ConfirmContainerProps, ConfirmFooter, type ConfirmFooterProps, ConfirmHeader, type ConfirmHeaderProps, type ConfirmProps, type ConfirmRadius, type ConfirmSize, CropIcon, DEFAULT_PAGE_SIZE, DEFAULT_PAGE_SIZE_OPTIONS, DEFAULT_TOAST_DURATION, DOCUMENT_EXTENSIONS, DataTable, type DataTableProps, DatePicker, type DatePickerColor, type DatePickerConfig, type DatePickerProps, type DatePickerRadius, type DatePickerSize, type DatePickerVariant, type DateRange, DateRangeCalendar, type DateRangeCalendarDay, type DateRangeCalendarProps, DateRangeDayGrid, type DateRangeDayGridProps, DateRangeHeader, type DateRangeHeaderProps, DateRangeMonthGrid, type DateRangeMonthGridProps, DateRangePicker, type DateRangePickerColor, type DateRangePickerConfig, type DateRangePickerProps, type DateRangePickerRadius, type DateRangePickerSize, type DateRangePickerVariant, type DateRangeValue, DateRangeYearGrid, type DateRangeYearGridProps, DateTimePicker, type DateTimePickerColor, type DateTimePickerConfig, type DateTimePickerLayout, type DateTimePickerProps, type DateTimePickerRadius, type DateTimePickerSize, type DateTimePickerVariant, type DateTimeRange, DateTimeRangePicker, type DateTimeRangePickerColor, type DateTimeRangePickerConfig, type DateTimeRangePickerLayout, type DateTimeRangePickerProps, type DateTimeRangePickerRadius, type DateTimeRangePickerSize, type DateTimeRangePickerVariant, type DateTimeRangeValue, type DateTimeValue, type DateValue, DayGrid, type DayGridProps, type DefaultTableFeatures, DoubleChevronLeftIcon, DoubleChevronRightIcon, DownloadIcon, type DraggableTableHeadProps, Dropdown, type DropdownColor, type DropdownContextValue, DropdownGroup, type DropdownGroupProps, DropdownHeader, type DropdownHeaderProps, DropdownItem, type DropdownItemProps, DropdownMenu, type DropdownMenuProps, type DropdownPlacement, type DropdownProps, type DropdownRadius, DropdownSeparator, type DropdownSeparatorProps, type DropdownSize, DropdownTrigger, type DropdownTriggerProps, type DropdownTriggerType, Empty, EmptyDefaultIcon, EmptyErrorIcon, EmptyFolderIcon, EmptyIllustration, EmptyPresetImage, EmptyProps, EmptySearchIcon, EmptySimpleIcon, EyeIcon, type FileCategory, FileContainer, type FileContainerProps, FileIcon, type FileIconProps, FilePreview, type FilePreviewProps, type FileType, FlipHorizontalIcon, IMAGE_EXTENSIONS, IconButton, type IconButtonProps, ImageIcon, type ImageItem, ImagePreview, type ImagePreviewProps, ImagePreviewToolbar, type ImagePreviewToolbarProps, InfoCircleIcon, Input, type InputColor, type InputConfig, type InputProps, type InputRadius, type InputSize, type InputVariant, type LabelPlacement, LoadingImage, type LoadingImageProps, type LocaleConfig, MinusIcon, Modal, ModalBody, type ModalBodyProps, ModalClose, type ModalCloseProps, ModalContainer, type ModalContainerProps, ModalFooter, type ModalFooterProps, ModalHeader, type ModalHeaderProps, type ModalProps, type ModalRadius, type ModalSize, MonthGrid, type MonthGridProps, MultiInput, type MultiInputConfig, type MultiInputProps, MultiSelect, MultiSelectProps, MultiSelectTrigger, NumberInput, type NumberInputProps, OtpInput, type OtpInputConfig, type OtpInputProps, type OtpInputRef, type OtpInputType, PDF_EXTENSIONS, PasswordInput, type PasswordInputProps, PlusIcon, Popover, PopoverBody, type PopoverBodyProps, PopoverClose, type PopoverCloseProps, type PopoverColor, PopoverContent, type PopoverContentProps, type PopoverContextValue, PopoverFooter, type PopoverFooterProps, PopoverHeader, type PopoverHeaderProps, type PopoverPlacement, type PopoverProps, type PopoverRadius, type PopoverSize, PopoverTrigger, type PopoverTriggerProps, type PopoverTriggerType, type PreviewFile, Radio, type RadioColor, type RadioConfig, RadioDotIcon, RadioGroup, type RadioGroupConfig, type RadioGroupOrientation, type RadioGroupProps, type RadioLabelPlacement, type RadioOptionItem, type RadioProps, type RadioSearchMode, type RadioSize, type RadioVariant, ResetIcon, RotateCcwIcon, RotateCwIcon, SearchIcon, Select, SelectColor, Select as SelectComponent, SelectFilterField, SelectFilterLayout, SelectMenu, SelectMenuFilter, SelectOption, SelectOptionItem, SelectProps, SelectRadius, SelectSearchPlacement, SelectSize, SingleSelectTrigger as SelectTrigger, SelectVariant, type ServerFile, SingleSelectTrigger, Skeleton, type SkeletonObjectFit, type SkeletonProps, type SkeletonRadius, type SkeletonShape, type SkeletonVariant, Slider, type SliderColor, type SliderConfig, type SliderLabelPlacement, type SliderMark, SliderMarks, type SliderOrientation, type SliderProps, type SliderRadius, type SliderSize, SliderStepDots, SliderThumb, type SliderTooltipMode, type SliderTooltipPlacement, type SliderValue, type SliderVariant, SlidersHorizontalIcon, Spinner, Tab, type TabColor, TabList, type TabListProps, type TabOrientation, TabPanel, type TabPanelProps, TabPanels, type TabPanelsProps, type TabPlacement, type TabProps, type TabRadius, type TabSize, type TabVariant, Table, type TableAlign, TableBody, type TableBodyProps, TableCaption, type TableCaptionProps, TableCell, type TableCellProps, TableColumnHeader, type TableColumnHeaderProps, type TableFilterDef, type TableFilterOption, type TableFilterType, TableFooter, type TableFooterProps, TableHead, type TableHeadProps, TableHeader, type TableHeaderProps, TablePagination, type TablePaginationProps, type TableProps, TableRow, type TableRowProps, type TableSize, TableToolbar, type TableToolbarProps, type TableVariant, Tabs, type TabsProps, type TagRenderProps, TextArea, type TextAreaColor, type TextAreaConfig, type TextAreaLabelPlacement, type TextAreaProps, type TextAreaRadius, type TextAreaResize, type TextAreaSize, type TextAreaVariant, TimeColumn, type TimeColumnItem, type TimeColumnProps, type TimeObject, type TimePeriod, TimePicker, type TimePickerColor, type TimePickerConfig, type TimePickerProps, type TimePickerRadius, type TimePickerSize, type TimePickerVariant, type TimeRange, TimeRangePicker, type TimeRangePickerColor, type TimeRangePickerConfig, type TimeRangePickerProps, type TimeRangePickerRadius, type TimeRangePickerSize, type TimeRangePickerVariant, type TimeRangeValue, type TimeValue, TimeView, type TimeViewProps, ToastOptions, ToastPromiseOptions, Toaster, ToasterProps, Toggle, type ToggleColor, type ToggleConfig, type ToggleLabelPlacement, type ToggleProps, type ToggleRadius, type ToggleSize, type ToggleVariant, type ToolbarToolsConfig, Tooltip, type TooltipColor, type TooltipPlacement, type TooltipProps, type TooltipRadius, type TooltipSize, type TooltipVariant, TrashIcon, UploadAvatar, type UploadAvatarColor, type UploadAvatarConfig, UploadAvatarCropContent, UploadAvatarCropModal, type UploadAvatarCropOptions, type UploadAvatarLabelPlacement, type UploadAvatarProps, type UploadAvatarRadius, type UploadAvatarShape, type UploadAvatarSize, type UploadAvatarVariant, UploadFile, type UploadFileColor, type UploadFileConfig, type UploadFileDragStatus, UploadFileDropzone, type UploadFileDropzoneProps, UploadFileItemRow, type UploadFileItemRowProps, UploadFileList, type UploadFileListProps, type UploadFileListType, type UploadFileProps, type UploadFileRadius, type UploadFileShape, type UploadFileSize, type UploadFileVariant, type UploadFileViewMode, UploadIcon, UploadImage, type UploadImageColor, type UploadImageDragStatus, UploadImageDropzone, type UploadImageDropzoneProps, UploadImageList, type UploadImageListProps, type UploadImageObjectFit, type UploadImageProps, type UploadImageRadius, type UploadImageShape, type UploadImageSize, type UploadImageVariant, type UploadImageViewMode, type UseDataTableOptions, type UseFloatingTransitionOptions, VIDEO_EXTENSIONS, YearGrid, type YearGridProps, ZoomInIcon, ZoomOutIcon, checkIsDisabled, clamp, combineDateTime, createDateWithTime, createTableColumnHelper, defaultTableFeatures, downloadFile, formatBytes, formatDate, formatDateTime, formatNumberString, formatTime, fuzzyFilter, generateCalendarGrid, generateRangeCalendarGrid, getDefaultDateTimeFormat, getDefaultFormat, getFileCategory, getFileExtension, getFileName, getFileType, getISOWeekNumber, getPercentage, getSafeConfig, isDateAfter, isDateBefore, isSameDay, isSameMonth, isSameTime, isTimeAfter, isTimeBefore, isTimeInRange, isValidOtpChar, normalizePreviewFile, padZero, parseDate, parseDateTime, parseNumber, parseRawNumberString, parseTimeToDate, rankAndFilterItems, resolveLocale, sanitizeOtpString, splitTagsFromText, toDate, toDateTime, toTimeObject, toast, useAnimatedError, useCarousel, useCarouselContext, useCollapseContext, useCollapsePanelContext, useConfirmContext, useDataTable, useDebounce, useDebouncedCallback, useDropdownContext, useFileContext, useFloatingTransition, useModalContext, usePopoverContext, useTableStyles, useTabsContext };