@lucasvu/scope-ui 0.1.2 → 0.1.5

package/dist/index.d.ts

@@ -1,50 +1,56 @@
-import * as react from 'react';
-import { ReactNode, CSSProperties, SVGProps, ButtonHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, HTMLAttributes, FormHTMLAttributes, LabelHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, RefObject, ElementType } from 'react';
+import * as react_jsx_runtime from 'react/jsx-runtime';
 import * as class_variance_authority_types from 'class-variance-authority/types';
+import * as react from 'react';
+import { ReactNode, CSSProperties, SVGProps, HTMLAttributes, ElementType, ButtonHTMLAttributes, TableHTMLAttributes, TdHTMLAttributes, ThHTMLAttributes, InputHTMLAttributes, TextareaHTMLAttributes, FormHTMLAttributes, LabelHTMLAttributes, RefObject } from 'react';
 import { VariantProps } from 'class-variance-authority';
-import * as react_jsx_runtime from 'react/jsx-runtime';
-import * as SelectPrimitive from '@radix-ui/react-select';
 export { ColorMode, ROOT_CLIENT_THEME_ATTRIBUTE, ROOT_COLOR_MODE_ATTRIBUTE, UiAiComponentDescriptor, UiAiComponentProp, UiScreenBriefField, UiScreenKind, UiThemeLayerAsset, UiThemePreset, UiThemeToken, applyDocumentClientTheme, applyDocumentColorMode, cn, getSystemColorMode, initializeDocumentColorMode, isColorMode, subscribeToSystemColorMode, syncDocumentColorModeToSystem, uiAiManifest, uiDefaultThemePreset, uiProjectAiRules, uiScreenBlueprint, uiScreenBriefFields, uiThemeContract, uiThemeLayerAssets, uiThemePresets } from './core/index.js';
+import * as SelectPrimitive from '@radix-ui/react-select';
 
 type ComponentSize = 'sm' | 'md' | 'lg';
 interface SharedComponentProps {
+    /**
+     * Visible label rendered above the component or control.
+     */
     label?: ReactNode;
+    /**
+     * Helper content shown below the control when there is no error.
+     */
     helperText?: ReactNode;
+    /**
+     * Error content displayed below the control with higher priority.
+     */
     errorMessage?: ReactNode;
+    /**
+     * Loading state while the component is processing or waiting for data.
+     */
     loading?: boolean;
+    /**
+     * Disables user interaction with the component.
+     */
     disabled?: boolean;
+    /**
+     * Shared visual size of the component.
+     */
     size?: ComponentSize;
+    /**
+     * Extra class names for extending styles from the outside.
+     */
     className?: string;
+    /**
+     * Inline styles applied directly to the component root wrapper.
+     */
     style?: CSSProperties;
 }
 declare const spinnerSizes: Record<'xs' | 'sm' | 'md' | 'lg', string>;
 interface LoadingSpinnerProps extends SVGProps<SVGSVGElement> {
+    /**
+     * Visual size of the loading spinner icon.
+     */
     size?: keyof typeof spinnerSizes;
 }
 
-declare const alertVariants: (props?: ({
-    variant?: "default" | "info" | "success" | "warning" | "destructive" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type AlertVariant = NonNullable<VariantProps<typeof alertVariants>['variant']>;
-type AlertTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
-interface AlertProps extends SharedComponentProps {
-    description?: ReactNode;
-    icon?: ReactNode;
-    tone?: AlertTone;
-    variant?: AlertVariant;
-    title?: ReactNode;
-    children?: ReactNode;
-}
-/**
- * Status-aware alert panel with selectable variants, helper text, and optional iconography.
- * @remarks
- * Use `variant` (default/info/success/warning/destructive) and `size` (sm/md/lg) to tune the tone, show `description` or `helperText`, and decorate with a spinner via `loading`.
- */
-declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
-
 declare const badgeVariants: (props?: ({
-    variant?: "success" | "warning" | "destructive" | "solid" | "outline" | null | undefined;
+    variant?: "solid" | "outline" | "success" | "warning" | "destructive" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type BadgeVariant = VariantProps<typeof badgeVariants>['variant'];
@@ -60,95 +66,161 @@ interface BadgeProps extends SharedComponentProps {
  */
 declare function Badge({ variant, size, label, helperText, errorMessage, loading, disabled, className, style, text, children, ...props }: BadgeProps): react_jsx_runtime.JSX.Element;
 
-type BreadcrumbItem = {
-    label: ReactNode;
-    onClick?: () => void;
+type SidebarItem$1 = {
+    /**
+     * Unique identifier of the sidebar item.
+     */
+    id: string;
+    /**
+     * Title rendered directly in the menu.
+     */
+    title?: string;
+    /**
+     * i18n key when the title is translated outside this component.
+     */
+    titleKey?: string;
+    /**
+     * Item icon, either a ReactNode or a component type.
+     */
+    icon?: ReactNode | ElementType;
+    /**
+     * Navigation target when the item is clicked.
+     */
     href?: string;
-    current?: boolean;
+    /**
+     * Required permission(s) for the item to be visible.
+     */
+    permission?: string | string[];
+    /**
+     * Nested child items.
+     */
+    children?: SidebarItem$1[];
 };
-type BreadcrumbProps = {
-    items: BreadcrumbItem[];
-    className?: string;
-    separator?: ReactNode;
+type PermissionChecker = (permission: string | string[] | undefined, userPermissions?: string[]) => boolean;
+interface SidebarProps extends HTMLAttributes<HTMLElement> {
+    /**
+     * Full item tree rendered inside the sidebar.
+     */
+    items: SidebarItem$1[];
+    /**
+     * Current permission list of the active user.
+     */
+    userPermissions?: string[];
+    /**
+     * Custom permission checking function.
+     */
+    permissionChecker?: PermissionChecker;
+    /**
+     * `id` of the currently active item.
+     */
+    activeItemId?: string;
+    /**
+     * Callback fired when the user clicks an item.
+     */
+    onItemClick?: (item: SidebarItem$1) => void;
+    /**
+     * Extra class names for the top-level list.
+     */
+    listClassName?: string;
+    /**
+     * Extra class names for nested lists.
+     */
+    nestedListClassName?: string;
+    /**
+     * Extra class names applied to each item.
+     */
+    itemClassName?: string;
+    /**
+     * Indentation size for each nested level.
+     */
+    indentSize?: number;
+    /**
+     * Accessibility label for the `nav` element.
+     */
+    ariaLabel?: string;
+    /**
+     * Enables collapsing and expanding the sidebar.
+     */
+    collapsible?: boolean;
+    /**
+     * Controlled collapsed state from the parent.
+     */
+    collapsed?: boolean;
+    /**
+     * Default collapsed state in uncontrolled mode.
+     */
+    defaultCollapsed?: boolean;
+    /**
+     * Callback fired when the collapsed state changes.
+     */
+    onCollapseChange?: (collapsed: boolean) => void;
+    /**
+     * Sidebar width when collapsed.
+     */
+    collapsedWidth?: number | string;
+    /**
+     * Sidebar width when expanded.
+     */
+    expandedWidth?: number | string;
+    /**
+     * Accessibility label for the collapse/expand button.
+     */
+    collapseButtonLabel?: string;
+}
+
+type ArgonSidebarHeaderRender = (state: {
+    collapsed: boolean;
+    hoverExpanded: boolean;
+}) => React.ReactNode;
+type ArgonSidebarProps = SidebarProps & {
+    /**
+     * Callback fired when hover-expansion state changes.
+     */
+    onHoverChange?: (hovered: boolean) => void;
+    /**
+     * Header content or a render function for dynamic header content.
+     */
+    header?: React.ReactNode | ArgonSidebarHeaderRender;
 };
-declare function Breadcrumb({ items, className, separator, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
+/**
+ * Argon-style sidebar for legacy `main-fe` with collapse and permission filtering.
+ */
+declare function ArgonSidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, onHoverChange, header, ...rest }: ArgonSidebarProps): react_jsx_runtime.JSX.Element;
 
 declare const buttonVariants$1: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
+    variant?: "link" | "outline" | "destructive" | "default" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
     size?: "sm" | "md" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
 type ButtonVariant$1 = VariantProps<typeof buttonVariants$1>['variant'];
 type ButtonSize$1 = 'sm' | 'md' | 'lg' | 'icon';
 interface ButtonProps$1 extends Omit<SharedComponentProps, 'size'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'className'> {
+    /**
+     * Visual variant of the button.
+     */
     variant?: ButtonVariant$1;
+    /**
+     * Visual size of the button.
+     */
     size?: ButtonSize$1;
-    block?: boolean;
+    /**
+     * Icon rendered before the main content.
+     */
     startIcon?: ReactNode;
+    /**
+     * Icon rendered after the main content.
+     */
     endIcon?: ReactNode;
+    /**
+     * Custom button content.
+     */
     children?: ReactNode;
 }
 /**
- * Primary action button with shadcn-inspired variants, helper text, and optional loading rewards.
- * @remarks
- * Support `variant` (default/destructive/outline/secondary/ghost/link) and `size` (sm/md/lg), adorn with icons, and surface helper or error text without needing custom wrappers.
+ * Button theo visual style legacy `main-fe`.
+ * Legacy `main-fe` styled button.
  */
 declare const Button$1: react.ForwardRefExoticComponent<ButtonProps$1 & react.RefAttributes<HTMLButtonElement>>;
 
-declare const inputVariants$1: (props?: ({
-    variant?: "default" | "outline" | "ghost" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type InputVariant$1 = VariantProps<typeof inputVariants$1>['variant'];
-interface InputProps$1 extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
-    variant?: InputVariant$1;
-    prefix?: ReactNode;
-    suffix?: ReactNode;
-    inputClassName?: string;
-    onValueChange?: (value: string) => void;
-    showPasswordToggle?: boolean;
-}
-/**
- * Accessible input surface with shadcn styling, optional prefix/suffix, and helpers for feedback.
- * @remarks
- * Swap `variant` (default/ghost/outline) and `size` (sm/md/lg), keep adornments with `prefix`/`suffix`, display helper/error text, and show a spinner via `loading`.
- */
-declare const Input$1: react.ForwardRefExoticComponent<InputProps$1 & react.RefAttributes<HTMLInputElement>>;
-
-type FormatOnBlur = 'trim' | 'fixed' | 'none';
-type NumericMode = 'integer' | 'decimal';
-type DecimalSeparator = '.' | ',' | 'auto';
-
-interface NumericInputProps extends Omit<InputProps$1, 'type' | 'inputMode' | 'value' | 'defaultValue' | 'onChange' | 'onValueChange'>, Pick<InputHTMLAttributes<HTMLInputElement>, 'onBlur' | 'onFocus' | 'name'> {
-    value?: string | number;
-    defaultValue?: string | number;
-    onValueChange?: (raw: string) => void;
-    onNumberChange?: (num: number | null) => void;
-    mode?: NumericMode;
-    decimalScale?: number;
-    maxDecimalScale?: number;
-    scale?: number;
-    min?: number;
-    max?: number;
-    allowNegative?: boolean;
-    decimalSeparator?: DecimalSeparator;
-    formatOnBlur?: FormatOnBlur;
-    clampOnBlur?: boolean;
-}
-declare const NumericInput: react.ForwardRefExoticComponent<NumericInputProps & react.RefAttributes<HTMLInputElement>>;
-
-declare const textareaVariants: (props?: ({
-    variant?: "default" | "outline" | "ghost" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type TextareaVariant = VariantProps<typeof textareaVariants>['variant'];
-interface TextareaProps extends SharedComponentProps, Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className'> {
-    variant?: TextareaVariant;
-    textareaClassName?: string;
-    onValueChange?: (value: string) => void;
-    suffix?: ReactNode;
-}
-declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
-
 declare function Card$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
 declare function CardHeader$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
 declare function CardTitle$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
@@ -158,521 +230,946 @@ declare function CardContent$1({ className, ...props }: react.ComponentProps<'di
 declare function CardFooter$1({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
 
 type ComboboxOption$2 = {
+    /**
+     * Visible label shown in the input and dropdown.
+     */
     label: string;
+    /**
+     * Actual value of the option.
+     */
     value: string | number;
+    /**
+     * Secondary description for the option when the UI needs extra context.
+     */
     description?: string;
+    /**
+     * Alternate value used specifically for searching.
+     */
     searchValue?: string;
+    /**
+     * Marks the option as unavailable for selection.
+     */
     disabled?: boolean;
 };
+type ComboboxAsyncConfig = {
+    /**
+     * Remote search callback fired when the user types.
+     */
+    onSearch?: (value: string) => void;
+    /**
+     * Callback for loading more data when the dropdown reaches the end.
+     */
+    onLoadMore?: () => void;
+    /**
+     * Indicates whether more remote data is available.
+     */
+    hasMore?: boolean;
+    /**
+     * Whether to reset the search term when the field is focused again.
+     */
+    resetSearchOnFocus?: boolean;
+    /**
+     * Whether to restore the selected option on blur if nothing new is chosen.
+     */
+    restoreSelectedOnBlur?: boolean;
+};
 interface ComboboxProps$1 extends SharedComponentProps {
+    /**
+     * Option list rendered in the dropdown.
+     */
     options: ComboboxOption$2[];
+    /**
+     * Currently selected value.
+     */
     value?: string | number;
+    /**
+     * Placeholder shown when no value is selected.
+     */
     placeholder?: string;
+    /**
+     * Callback fired when the user selects an option.
+     */
     onChange?: (value: ComboboxOption$2['value']) => void;
+    /**
+     * Callback fired when the input text changes.
+     */
     onInputChange?: (value: string) => void;
+    /**
+     * Manual callback for loading more items at the end of the list.
+     */
+    onLoadMore?: () => void;
+    /**
+     * Indicates whether more data can be loaded.
+     */
+    hasMore?: boolean;
+    /**
+     * Configuration for async or remote-search behavior.
+     */
+    asyncConfig?: ComboboxAsyncConfig;
+    /**
+     * Loading state while data is being fetched.
+     */
     loading?: boolean;
+    /**
+     * Disables the entire combobox.
+     */
     disabled?: boolean;
+    /**
+     * Placeholder specifically for the search input.
+     */
     searchPlaceholder?: string;
+    /**
+     * `id` used by helper text for accessibility linkage.
+     */
     helperId?: string;
+    /**
+     * `id` used by error text for accessibility linkage.
+     */
     errorId?: string;
+    /**
+     * Enables a button for clearing the current value.
+     */
     allowClear?: boolean;
+    /**
+     * Callback fired when the current value is cleared.
+     */
     onClear?: () => void;
+    /**
+     * Renders the dropdown in a portal outside the current layout.
+     */
     portal?: boolean;
+    /**
+     * Extra class names for the dropdown menu.
+     */
+    dropdownClassName?: string;
+    /**
+     * Overrides the maximum height of the dropdown.
+     */
+    dropdownMaxHeight?: number;
+    /**
+     * Keeps error styling without rendering the error text below the field.
+     */
+    hideErrorMessage?: boolean;
 }
+/**
+ * Legacy `main-fe` combobox with remote search and load-more support.
+ */
 declare const Combobox$1: react.ForwardRefExoticComponent<ComboboxProps$1 & react.RefAttributes<HTMLInputElement>>;
 
-type ComboboxOption$1 = {
-    label: string;
-    value: string | number;
-    description?: string;
-    searchValue?: string;
-    disabled?: boolean;
+type DataTableSortDirection$1 = 'asc' | 'desc';
+type DataTableAlign$1 = 'left' | 'center' | 'right';
+type DataTableSortState$1 = {
+    /**
+     * `key` of the column currently being sorted.
+     */
+    key: string;
+    /**
+     * Current sort direction.
+     */
+    direction: DataTableSortDirection$1;
 };
-interface AsyncComboboxProps extends SharedComponentProps {
-    options: ComboboxOption$1[];
-    value?: string | number;
-    placeholder?: string;
-    onChange?: (value: ComboboxOption$1['value']) => void;
-    onInputChange?: (value: string) => void;
-    onInputFocus?: () => void;
-    onScrollEnd?: () => void;
+type DataTableColumn$1<T> = {
+    /**
+     * Unique identifier of the column.
+     */
+    key: string;
+    /**
+     * Visible header content of the column.
+     */
+    title: ReactNode;
+    /**
+     * Record field used as the default data source.
+     */
+    dataIndex?: keyof T;
+    /**
+     * Fixed or relative width of the column.
+     */
+    width?: number | string;
+    /**
+     * Custom renderer for the cell content.
+     */
+    render?: (value: T[keyof T] | undefined, record: T, index: number) => ReactNode;
+    /**
+     * Enables or disables sorting for the column.
+     */
+    sortable?: boolean;
+    /**
+     * Custom comparator used for client-side sorting.
+     */
+    sorter?: (a: T, b: T) => number;
+    /**
+     * Function that returns a dedicated value for sorting.
+     */
+    sortValue?: (record: T) => string | number | Date | null | undefined;
+    /**
+     * Per-column header alignment override.
+     */
+    headerAlign?: DataTableAlign$1;
+    /**
+     * Per-column cell alignment override.
+     */
+    cellAlign?: DataTableAlign$1;
+};
+type DataTablePagination$1 = {
+    /**
+     * Current page.
+     */
+    page: number;
+    /**
+     * Number of rows per page.
+     */
+    pageSize: number;
+    /**
+     * Total number of records.
+     */
+    total: number;
+    /**
+     * Callback fired when the page changes.
+     */
+    onChange: (page: number) => void;
+    /**
+     * Page-size options shown in the dropdown.
+     */
+    pageSizeOptions?: number[];
+    /**
+     * Callback fired when page size changes.
+     */
+    onPageSizeChange?: (pageSize: number) => void;
+};
+type RowKey$1 = string | number;
+type DataTableRowSelection$1 = {
+    /**
+     * Row keys that are currently selected.
+     */
+    selectedRowKeys: Array<RowKey$1>;
+    /**
+     * Callback fired when the selected rows change.
+     */
+    onChange: (selectedRowKeys: Array<RowKey$1>) => void;
+};
+type DataTableProps$1<T> = {
+    /**
+     * Column configuration of the table.
+     */
+    columns: Array<DataTableColumn$1<T>>;
+    /**
+     * Source data rendered by the table.
+     */
+    data: T[];
+    /**
+     * How to resolve a unique key for each row.
+     */
+    rowKey: keyof T | ((record: T) => RowKey$1);
+    /**
+     * Loading state of the table.
+     */
     loading?: boolean;
-    disabled?: boolean;
-    searchPlaceholder?: string;
-    helperId?: string;
-    errorId?: string;
-    allowClear?: boolean;
-    onClear?: () => void;
-    portal?: boolean;
-}
-declare const AsyncCombobox: react.ForwardRefExoticComponent<AsyncComboboxProps & react.RefAttributes<HTMLInputElement>>;
+    /**
+     * Content shown when the table has no data.
+     */
+    emptyText?: ReactNode;
+    /**
+     * Pagination configuration.
+     */
+    pagination?: DataTablePagination$1;
+    /**
+     * Current sort state when controlled from the parent.
+     */
+    sort?: DataTableSortState$1 | null;
+    /**
+     * Callback fired when sort state changes.
+     */
+    onSortChange?: (sort: DataTableSortState$1 | null) => void;
+    /**
+     * Sorting mode handled on the client or server.
+     */
+    sortMode?: 'client' | 'server';
+    /**
+     * Callback fired when a row is clicked.
+     */
+    onRowClick?: (record: T) => void;
+    /**
+     * Row-selection configuration.
+     */
+    rowSelection?: DataTableRowSelection$1;
+    /**
+     * Renderer for the per-row action column.
+     */
+    renderActions?: (record: T) => ReactNode;
+    /**
+     * Width of the action column.
+     */
+    actionColumnWidth?: number | string;
+    /**
+     * Extra class names for the table wrapper.
+     */
+    className?: string;
+    /**
+     * Default alignment for all headers.
+     */
+    headerAlign?: DataTableAlign$1;
+    /**
+     * Default alignment for all cells.
+     */
+    cellAlign?: DataTableAlign$1;
+    /**
+     * Sticky offset for header or fixed columns when the layout has a top bar.
+     */
+    stickyOffset?: number;
+};
+/**
+ * Legacy `main-fe` data table with sorting, selection, actions, and pagination.
+ */
+declare function DataTable$1<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, actionColumnWidth, className, headerAlign, stickyOffset, }: DataTableProps$1<T>): react_jsx_runtime.JSX.Element;
+declare const Table$1: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
+declare const TableHeader$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableBody$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
+declare const TableRow$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
+declare const TableCell$1: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & ThHTMLAttributes<HTMLTableCellElement> & {
+    as?: "td" | "th";
+} & react.RefAttributes<HTMLTableCellElement>>;
 
-type MultiSelectOption = {
-    label: string;
-    value: string | number;
-    disabled?: boolean;
-    searchValue?: string;
+type DateRangePickerValue = {
+    /**
+     * Start date in string or ISO format.
+     */
+    startDate?: string | null;
+    /**
+     * End date in string or ISO format.
+     */
+    endDate?: string | null;
 };
-interface MultiSelectProps extends SharedComponentProps {
-    options: MultiSelectOption[];
-    value?: Array<MultiSelectOption['value']>;
+interface DateRangePickerProps {
+    /**
+     * Current date range value of the component.
+     */
+    value?: DateRangePickerValue;
+    /**
+     * Callback fired when the user confirms a new date range.
+     */
+    onChange: (next: Required<DateRangePickerValue>) => void;
+    /**
+     * Label shown above the picker.
+     */
+    label?: string;
+    /**
+     * Placeholder shown before a range is selected.
+     */
     placeholder?: string;
-    onChange?: (value: Array<MultiSelectOption['value']>) => void;
-    onSearch?: (value: string) => void;
-    loading?: boolean;
-    disabled?: boolean;
-    searchable?: boolean;
-    searchPlaceholder?: string;
+    /**
+     * Extra class names for the picker wrapper.
+     */
+    className?: string;
 }
-declare const MultiSelect: react.ForwardRefExoticComponent<MultiSelectProps & react.RefAttributes<HTMLButtonElement>>;
-
 /**
- * Vertical form wrapper that keeps consistent spacing between fields.
- * @remarks
- * Extend `className` or pass native form props while maintaining consistent letter spacing for each child row.
+ * Date-range picker for legacy `main-fe` screens.
  */
-declare function Form({ className, ...props }: FormHTMLAttributes<HTMLFormElement>): react_jsx_runtime.JSX.Element;
-interface FormFieldProps extends HTMLAttributes<HTMLDivElement> {
-    children: ReactNode;
-    label?: ReactNode;
-    helperText?: ReactNode;
-    errorMessage?: ReactNode;
-    required?: boolean;
-    htmlFor?: string;
+declare function DateRangePicker({ value, onChange, label, placeholder, className, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
+
+type QuickOption = {
+    /**
+     * Visible label of the quick option.
+     */
+    label: string;
+    /**
+     * Value applied to the picker when the quick option is chosen.
+     */
+    value: string;
+};
+interface DateTimePickerProps {
+    /**
+     * Label shown above the picker.
+     */
+    label?: ReactNode;
+    /**
+     * Placeholder shown when no value is set.
+     */
+    placeholder?: string;
+    /**
+     * Current value of the picker.
+     */
+    value?: string;
+    /**
+     * Callback fired when the date-time value changes.
+     */
+    onChange: (value: string) => void;
+    /**
+     * Disables the entire picker.
+     */
+    disabled?: boolean;
+    /**
+     * Error message shown below the field.
+     */
+    errorMessage?: string;
+    /**
+     * Extra class names for the picker wrapper.
+     */
+    className?: string;
+    /**
+     * Format used to parse the incoming `value`.
+     */
+    parseFormat?: string;
+    /**
+     * Format used for outgoing values passed to `onChange`.
+     */
+    outputFormat?: string;
+    /**
+     * Display format for the text shown in the trigger.
+     */
+    displayFormat?: string;
+    /**
+     * Minimum selectable date-time.
+     */
+    minDateTime?: Date;
+    /**
+     * List of quick-select options.
+     */
+    quickOptions?: QuickOption[];
+    /**
+     * Callback fired when a quick option is selected.
+     */
+    onQuickSelect?: (value: string) => void;
+    /**
+     * Callback fired when the current value is cleared.
+     */
+    onClear?: () => void;
+    /**
+     * Title for the quick-range section.
+     */
+    quickRangesLabel?: string;
+    /**
+     * Label shown for the clear action.
+     */
+    clearLabel?: string;
+    /**
+     * Renders the picker panel in a portal outside the current layout.
+     */
+    portal?: boolean;
 }
 /**
- * Grid-aligned form field wrapper for label/control/description clusters.
+ * Legacy `main-fe` date-time picker with quick options and custom formats.
  */
-declare const FormField: react.ForwardRefExoticComponent<FormFieldProps & react.RefAttributes<HTMLDivElement>>;
+declare function DateTimePicker({ label, placeholder, value, onChange, disabled, errorMessage, className, parseFormat, outputFormat, displayFormat, minDateTime, quickOptions, onQuickSelect, onClear, quickRangesLabel, clearLabel, portal, }: DateTimePickerProps): react_jsx_runtime.JSX.Element;
+
+declare const inputVariants$1: (props?: ({
+    variant?: "outline" | "default" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type InputVariant$1 = VariantProps<typeof inputVariants$1>['variant'];
+interface InputProps$1 extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
+    /**
+     * Visual variant of the input.
+     */
+    variant?: InputVariant$1;
+    /**
+     * Content rendered on the left side of the input.
+     */
+    prefix?: ReactNode;
+    /**
+     * Content rendered on the right side of the input.
+     */
+    suffix?: ReactNode;
+    /**
+     * Class names applied directly to the `<input>` element.
+     */
+    inputClassName?: string;
+    /**
+     * Callback that returns the current string value of the input.
+     */
+    onValueChange?: (value: string) => void;
+    /**
+     * Enables or disables the password visibility toggle when `type="password"`.
+     */
+    showPasswordToggle?: boolean;
+}
 /**
- * Container for a single form item to stack label, control, and messages vertically.
+ * Legacy `main-fe` input with prefix/suffix plus helper/error support.
  */
-declare const FormItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare const Input$1: react.ForwardRefExoticComponent<InputProps$1 & react.RefAttributes<HTMLInputElement>>;
+
+type MultiTabItem = {
+    /**
+     * Visible label rendered on the tab.
+     */
+    label: ReactNode;
+    /**
+     * Identifier value of the tab.
+     */
+    value: string;
+};
+interface MultiTabsProps {
+    /**
+     * List of tabs to render.
+     */
+    items: MultiTabItem[];
+    /**
+     * Currently selected tab value.
+     */
+    value: string;
+    /**
+     * Callback fired when the user switches tabs.
+     */
+    onChange: (value: string) => void;
+    /**
+     * Extra class names for the tab group wrapper.
+     */
+    className?: string;
+    /**
+     * Inline styles for the tab group wrapper.
+     */
+    style?: CSSProperties;
+}
 /**
- * Styled label with strong typography and surface-aware coloring.
+ * Segmented tab control for legacy `main-fe` screens.
  */
-declare const FormLabel: react.ForwardRefExoticComponent<LabelHTMLAttributes<HTMLLabelElement> & react.RefAttributes<HTMLLabelElement>>;
+declare function MultiTabs({ items, value, onChange, className, style, }: MultiTabsProps): react_jsx_runtime.JSX.Element;
+
+type MainFePageTitleProps = {
+    /**
+     * Main title of the page.
+     */
+    title: string;
+    /**
+     * Short description shown below the title.
+     */
+    subtitle?: string;
+    /**
+     * Visual density of the page header.
+     */
+    size?: 'default' | 'compact';
+    /**
+     * Slot rendered above the title, commonly used for breadcrumbs or status tags.
+     */
+    topSlot?: ReactNode;
+    /**
+     * Slot rendered on the right side of the header.
+     */
+    rightSlot?: ReactNode;
+};
 /**
- * Flex container that aligns inputs and accessory controls horizontally.
+ * Legacy page header for `main-fe` screens.
  */
-declare const FormControl: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+declare function PageTitle$1({ title, subtitle, size, topSlot, rightSlot, }: MainFePageTitleProps): react_jsx_runtime.JSX.Element;
+
+type RemoteLoadingProps = {
+    /**
+     * Extra class names for the full-page loading wrapper.
+     */
+    className?: string;
+};
 /**
- * Neutral description text for a form field.
+ * Full-area loading state for remote or legacy screens.
  */
-declare const FormDescription: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+declare function RemoteLoading({ className }: RemoteLoadingProps): react_jsx_runtime.JSX.Element;
+
+type MainFeSectionTitleProps = {
+    /**
+     * Main title of the section.
+     */
+    title: string;
+    /**
+     * Short description that explains the section.
+     */
+    subtitle?: string;
+    /**
+     * Icon displayed to the left of the title.
+     */
+    icon?: ReactNode;
+    /**
+     * Custom class for the icon wrapper.
+     */
+    iconClassName?: string;
+    /**
+     * Slot rendered on the right side of the section title.
+     */
+    rightSlot?: ReactNode;
+};
 /**
- * Inline error message text for destructive validation states.
+ * Section header for legacy `main-fe` cards and panels.
  */
-declare const FormMessage: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+declare function SectionTitle$1({ title, subtitle, icon, iconClassName, rightSlot, }: MainFeSectionTitleProps): react_jsx_runtime.JSX.Element;
 
-type SelectOption = {
+type StatTone = 'emerald' | 'sky' | 'violet' | 'rose';
+type StatCardProps = {
+    /**
+     * Label describing what the metric represents.
+     */
+    label: ReactNode;
+    /**
+     * Primary value that should be emphasized.
+     */
+    value: ReactNode;
+    /**
+     * Primary visual tone of the card.
+     */
+    tone?: StatTone;
+    /**
+     * Icon displayed in the right corner of the card.
+     */
+    icon?: ReactNode;
+    /**
+     * Extra class names for the card wrapper.
+     */
+    className?: string;
+};
+/**
+ * Metric card for highlighted stats in legacy dashboards or lists.
+ */
+declare function StatCard({ label, value, tone, icon, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
+
+type StatusAction = {
     label: ReactNode;
+    color?: string;
+    href?: string;
+    onClick?: () => void;
+};
+type StatusOption = {
     value: string | number;
-    disabled?: boolean;
+    label: ReactNode;
+    color?: string;
+    action?: StatusAction;
 };
-type Option = SelectOption;
-declare const triggerVariants$1: (props?: ({
-    variant?: "default" | "outline" | "ghost" | null | undefined;
+type StatusPresentation = {
+    label: ReactNode;
+    color?: string;
+    action?: StatusAction;
+};
+declare function getStatusPresentation(status: string | number | null | undefined, options: StatusOption[]): StatusPresentation | null;
+
+interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'className' | 'onChange'> {
+    /**
+     * Extra class names for the outer switch wrapper.
+     */
+    className?: string;
+    /**
+     * Custom class for the switch track.
+     */
+    trackClassName?: string;
+    /**
+     * Custom class for the switch thumb.
+     */
+    thumbClassName?: string;
+    /**
+     * Callback that returns the next checked state.
+     */
+    onCheckedChange?: (checked: boolean) => void;
+}
+/**
+ * Legacy `main-fe` styled switch.
+ */
+declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
+
+declare const alertVariants: (props?: ({
+    variant?: "success" | "warning" | "destructive" | "default" | "info" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-type SelectVariant$1 = VariantProps<typeof triggerVariants$1>['variant'];
-interface SelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
-    options: SelectOption[];
-    value?: string | number;
-    defaultValue?: string | number;
-    placeholder?: string;
-    onChange?: (value: SelectOption['value']) => void;
-    variant?: SelectVariant$1;
+type AlertVariant = NonNullable<VariantProps<typeof alertVariants>['variant']>;
+type AlertTone = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+interface AlertProps extends SharedComponentProps {
+    description?: ReactNode;
+    icon?: ReactNode;
+    tone?: AlertTone;
+    variant?: AlertVariant;
+    title?: ReactNode;
+    children?: ReactNode;
 }
 /**
- * Select field powered by Radix primitives with customizable trigger variants and accessible helpers.
+ * Status-aware alert panel with selectable variants, helper text, and optional iconography.
  * @remarks
- * Provide `options`, manage `value`/`defaultValue`, and style via `variant` (default/outline/ghost) plus `size` (sm/md/lg); show helper/error text and `loading`.
+ * Use `variant` (default/info/success/warning/destructive) and `size` (sm/md/lg) to tune the tone, show `description` or `helperText`, and decorate with a spinner via `loading`.
  */
-declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<HTMLButtonElement>>;
+declare const Alert: react.ForwardRefExoticComponent<AlertProps & react.RefAttributes<HTMLDivElement>>;
 
-type SearchableSelectOption = {
+type BreadcrumbItem = {
+    /**
+     * Visible content of the breadcrumb item.
+     */
     label: ReactNode;
-    value: string | number;
-    disabled?: boolean;
-    searchValue?: string;
+    /**
+     * Callback fired when the item is clicked as a button.
+     */
+    onClick?: () => void;
+    /**
+     * Navigation URL when the item behaves as a link.
+     */
+    href?: string;
+    /**
+     * Marks the item as the current location.
+     */
+    current?: boolean;
 };
-declare const triggerVariants: (props?: ({
-    variant?: "default" | "outline" | "ghost" | null | undefined;
-    size?: "sm" | "md" | "lg" | null | undefined;
+type BreadcrumbProps = {
+    /**
+     * List of breadcrumb items.
+     */
+    items: BreadcrumbItem[];
+    /**
+     * Extra class names for the `nav` element.
+     */
+    className?: string;
+    /**
+     * Character or node used to separate items.
+     */
+    separator?: ReactNode;
+};
+declare function Breadcrumb({ items, className, separator, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
+
+declare const buttonVariants: (props?: ({
+    variant?: "link" | "outline" | "destructive" | "default" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
+    size?: "sm" | "md" | "lg" | "icon" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-type SelectVariant = VariantProps<typeof triggerVariants>['variant'];
-interface SearchableSelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
-    options: SearchableSelectOption[];
-    value?: string | number;
-    defaultValue?: string | number;
-    placeholder?: string;
-    onChange?: (value: SearchableSelectOption['value']) => void;
-    variant?: SelectVariant;
-    onSearch?: (query: string) => void;
-    loading?: boolean;
-    size?: 'sm' | 'md' | 'lg';
-    searchPlaceholder?: string;
+type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
+type ButtonSize = 'sm' | 'md' | 'lg' | 'icon';
+interface ButtonProps extends Omit<SharedComponentProps, 'size'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'className'> {
+    variant?: ButtonVariant;
+    size?: ButtonSize;
+    block?: boolean;
+    startIcon?: ReactNode;
+    endIcon?: ReactNode;
+    children?: ReactNode;
 }
-declare const SearchableSelect: react.ForwardRefExoticComponent<SearchableSelectProps & react.RefAttributes<HTMLButtonElement>>;
+/**
+ * Primary action button with shadcn-inspired variants, helper text, and optional loading rewards.
+ * @remarks
+ * Support `variant` (default/destructive/outline/secondary/ghost/link) and `size` (sm/md/lg), adorn with icons, and surface helper or error text without needing custom wrappers.
+ */
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
 
-type Trend = 'up' | 'down' | 'flat';
-interface StatProps extends SharedComponentProps {
-    value: ReactNode;
-    helper?: ReactNode;
-    delta?: ReactNode;
-    trend?: Trend;
+declare const inputVariants: (props?: ({
+    variant?: "outline" | "default" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type InputVariant = VariantProps<typeof inputVariants>['variant'];
+interface InputProps extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
+    variant?: InputVariant;
+    prefix?: ReactNode;
+    suffix?: ReactNode;
+    inputClassName?: string;
+    onValueChange?: (value: string) => void;
+    showPasswordToggle?: boolean;
 }
 /**
- * Metric card that exposes a primary `value`, optional `delta`, and severity-aware `trend` indicator.
+ * Accessible input surface with shadcn styling, optional prefix/suffix, and helpers for feedback.
  * @remarks
- * Accepts `size` (sm/md/lg), shows `helper` or helper text, and can render `loading`/`disabled` states while aligning helper/error messaging.
+ * Swap `variant` (default/ghost/outline) and `size` (sm/md/lg), keep adornments with `prefix`/`suffix`, display helper/error text, and show a spinner via `loading`.
  */
-declare function Stat({ label, value, helper, delta, trend, helperText, errorMessage, loading, disabled, size, className, style, }: StatProps): react_jsx_runtime.JSX.Element;
+declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
 
-type DataTableSortDirection$1 = 'asc' | 'desc';
-type DataTableAlign$1 = 'left' | 'center' | 'right';
-type DataTableSortState$1 = {
-    key: string;
-    direction: DataTableSortDirection$1;
-};
-type DataTableColumn$1<T> = {
-    key: string;
-    title: ReactNode;
-    dataIndex?: keyof T;
-    width?: number | string;
-    render?: (value: T[keyof T] | undefined, record: T, index: number) => ReactNode;
-    sortable?: boolean;
-    sorter?: (a: T, b: T) => number;
-    sortValue?: (record: T) => string | number | Date | null | undefined;
-    headerAlign?: DataTableAlign$1;
-    cellAlign?: DataTableAlign$1;
-};
-type DataTablePagination$1 = {
-    page: number;
-    pageSize: number;
-    total: number;
-    onChange: (page: number) => void;
-    pageSizeOptions?: number[];
-    onPageSizeChange?: (pageSize: number) => void;
-};
-type RowKey$1 = string | number;
-type DataTableRowSelection$1 = {
-    selectedRowKeys: Array<RowKey$1>;
-    onChange: (selectedRowKeys: Array<RowKey$1>) => void;
-};
-type DataTableProps$1<T> = {
-    columns: Array<DataTableColumn$1<T>>;
-    data: T[];
-    rowKey: keyof T | ((record: T) => RowKey$1);
-    loading?: boolean;
-    emptyText?: ReactNode;
-    pagination?: DataTablePagination$1;
-    sort?: DataTableSortState$1 | null;
-    onSortChange?: (sort: DataTableSortState$1 | null) => void;
-    sortMode?: 'client' | 'server';
-    onRowClick?: (record: T) => void;
-    rowSelection?: DataTableRowSelection$1;
-    renderActions?: (record: T) => ReactNode;
-    className?: string;
-    headerAlign?: DataTableAlign$1;
-    cellAlign?: DataTableAlign$1;
-    stickyOffset?: number;
-    /** When false, table container does not scroll (overflow-visible). Default true. */
-    scrollable?: boolean;
-};
-declare function DataTable$1<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, className, headerAlign, stickyOffset, scrollable, }: DataTableProps$1<T>): react_jsx_runtime.JSX.Element;
-declare const Table$1: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
-declare const TableHeader$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-declare const TableBody$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
-declare const TableRow$1: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
-declare const TableCell$1: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTableCellElement> & ThHTMLAttributes<HTMLTableCellElement> & {
-    as?: "td" | "th";
-} & react.RefAttributes<HTMLTableCellElement>>;
-
-type PaginationInfo = {
-    page: number;
-    pageSize: number;
-    total: number;
-    totalPages: number;
-    showingStart: number;
-    showingEnd: number;
-};
-type PaginationProps = {
-    page: number;
-    pageSize: number;
-    total: number;
-    onChange: (page: number) => void;
-    pageSizeOptions?: number[];
-    onPageSizeChange?: (pageSize: number) => void;
-    className?: string;
-    showFirstLast?: boolean;
-    label?: (info: PaginationInfo) => ReactNode;
-};
-declare const Pagination: ({ page, pageSize, total, onChange, pageSizeOptions, onPageSizeChange, className, showFirstLast, label, }: PaginationProps) => react_jsx_runtime.JSX.Element;
-
-type PageTitleProps = {
-    title: string;
-    subtitle?: string;
-    size?: 'default' | 'compact';
-    rightSlot?: React.ReactNode;
-};
-declare function PageTitle$1({ title, subtitle, size, rightSlot, }: PageTitleProps): react_jsx_runtime.JSX.Element;
-
-type SectionTitleProps$1 = {
-    title: string;
-    subtitle?: string;
-    icon?: ReactNode;
-    iconClassName?: string;
-    rightSlot?: ReactNode;
-};
-declare function SectionTitle$1({ title, subtitle, icon, iconClassName, rightSlot, }: SectionTitleProps$1): react_jsx_runtime.JSX.Element;
+type FormatOnBlur = 'trim' | 'fixed' | 'none';
+type NumericMode = 'integer' | 'decimal';
+type DecimalSeparator = '.' | ',' | 'auto';
 
-interface TabItem {
-    value: string;
-    label: ReactNode;
-    content: ReactNode;
-    badge?: ReactNode;
-}
-interface TabsProps {
-    items: TabItem[];
-    defaultValue?: string;
-    onChange?: (value: string) => void;
-    className?: string;
-    listClassName?: string;
-    contentClassName?: string;
+interface NumericInputProps extends Omit<InputProps, 'type' | 'inputMode' | 'value' | 'defaultValue' | 'onChange' | 'onValueChange'>, Pick<InputHTMLAttributes<HTMLInputElement>, 'onBlur' | 'onFocus' | 'name'> {
+    value?: string | number;
+    defaultValue?: string | number;
+    onValueChange?: (raw: string) => void;
+    onNumberChange?: (num: number | null) => void;
+    mode?: NumericMode;
+    decimalScale?: number;
+    maxDecimalScale?: number;
+    scale?: number;
+    min?: number;
+    max?: number;
+    allowNegative?: boolean;
+    decimalSeparator?: DecimalSeparator;
+    formatOnBlur?: FormatOnBlur;
+    clampOnBlur?: boolean;
 }
-declare function Tabs({ items, defaultValue, onChange, className, listClassName, contentClassName, }: TabsProps): react_jsx_runtime.JSX.Element;
+declare const NumericInput: react.ForwardRefExoticComponent<NumericInputProps & react.RefAttributes<HTMLInputElement>>;
 
-interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
-    label?: ReactNode;
-    size?: LoadingSpinnerProps['size'];
+declare const textareaVariants: (props?: ({
+    variant?: "outline" | "default" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type TextareaVariant = VariantProps<typeof textareaVariants>['variant'];
+interface TextareaProps extends SharedComponentProps, Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'className'> {
+    variant?: TextareaVariant;
+    textareaClassName?: string;
+    onValueChange?: (value: string) => void;
+    suffix?: ReactNode;
 }
-declare function Loading({ label, size, className, ...props }: LoadingProps): react_jsx_runtime.JSX.Element;
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
 
-type TooltipSide$2 = 'top' | 'right' | 'bottom' | 'left';
-type TooltipAlign$2 = 'start' | 'center' | 'end';
-type TooltipProps = {
-    content: ReactNode;
-    children: ReactNode;
-    side?: TooltipSide$2;
-    align?: TooltipAlign$2;
-    className?: string;
-    contentClassName?: string;
-    wrap?: boolean;
-    portal?: boolean;
-};
-declare function Tooltip({ content, children, side, align, className, contentClassName, wrap, portal, }: TooltipProps): react_jsx_runtime.JSX.Element;
+declare function Card({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardHeader({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardTitle({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardDescription({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardAction({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardContent({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+declare function CardFooter({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
 
-type TooltipSide$1 = 'top' | 'right' | 'bottom' | 'left';
-type TooltipAlign$1 = 'start' | 'center' | 'end';
-type OverflowTooltipProps = {
-    content: ReactNode;
-    children: ReactNode;
-    targetRef?: RefObject<HTMLElement | null>;
-    side?: TooltipSide$1;
-    align?: TooltipAlign$1;
-    className?: string;
-    contentClassName?: string;
-    wrap?: boolean;
-    portal?: boolean;
+type ComboboxOption$1 = {
+    label: string;
+    value: string | number;
+    description?: string;
+    searchValue?: string;
     disabled?: boolean;
-    watch?: ReadonlyArray<unknown>;
 };
-declare function OverflowTooltip({ content, children, targetRef, side, align, className, contentClassName, wrap, portal, disabled, watch, }: OverflowTooltipProps): react_jsx_runtime.JSX.Element;
-
-type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
-type TooltipAlign = 'start' | 'center' | 'end';
-type LineClampTooltipProps = {
-    text: string;
-    lineClamp?: number;
-    className?: string;
-    side?: TooltipSide;
-    align?: TooltipAlign;
-    wrap?: boolean;
+interface ComboboxProps extends SharedComponentProps {
+    options: ComboboxOption$1[];
+    value?: string | number;
+    placeholder?: string;
+    onChange?: (value: ComboboxOption$1['value']) => void;
+    onInputChange?: (value: string) => void;
+    loading?: boolean;
+    disabled?: boolean;
+    searchPlaceholder?: string;
+    helperId?: string;
+    errorId?: string;
+    allowClear?: boolean;
+    onClear?: () => void;
     portal?: boolean;
-};
-declare function LineClampTooltip({ text, lineClamp, className, side, align, wrap, portal, }: LineClampTooltipProps): react_jsx_runtime.JSX.Element;
-
-type TruncatedTextProps = {
-    email: string;
-};
-declare function TruncatedText({ email, }: TruncatedTextProps): react_jsx_runtime.JSX.Element;
-
-type SidebarItem$1 = {
-    id: string;
-    title?: string;
-    titleKey?: string;
-    icon?: ReactNode | ElementType;
-    href?: string;
-    permission?: string | string[];
-    children?: SidebarItem$1[];
-};
-type PermissionChecker = (permission: string | string[] | undefined, userPermissions?: string[]) => boolean;
-interface SidebarProps extends HTMLAttributes<HTMLElement> {
-    items: SidebarItem$1[];
-    userPermissions?: string[];
-    permissionChecker?: PermissionChecker;
-    activeItemId?: string;
-    onItemClick?: (item: SidebarItem$1) => void;
-    listClassName?: string;
-    nestedListClassName?: string;
-    itemClassName?: string;
-    indentSize?: number;
-    ariaLabel?: string;
-    collapsible?: boolean;
-    collapsed?: boolean;
-    defaultCollapsed?: boolean;
-    onCollapseChange?: (collapsed: boolean) => void;
-    collapsedWidth?: number | string;
-    expandedWidth?: number | string;
-    collapseButtonLabel?: string;
 }
+declare const Combobox: react.ForwardRefExoticComponent<ComboboxProps & react.RefAttributes<HTMLInputElement>>;
 
-declare function Sidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, ...rest }: SidebarProps): react_jsx_runtime.JSX.Element;
-
-type SidebarItemProps = {
-    item: SidebarItem$1;
-    depth: number;
-    activeItemId?: string;
-    onItemClick?: (item: SidebarItem$1) => void;
-    indentSize?: number;
-    nestedListClassName?: string;
-    itemClassName?: string;
-    collapsed?: boolean;
+type ComboboxOption = {
+    label: string;
+    value: string | number;
+    description?: string;
+    searchValue?: string;
+    disabled?: boolean;
 };
-declare function SidebarItem({ item, depth, activeItemId, onItemClick, indentSize, nestedListClassName, itemClassName, collapsed, }: SidebarItemProps): react_jsx_runtime.JSX.Element;
-
-declare const defaultPermissionChecker: PermissionChecker;
-declare function filterSidebarItems(items: SidebarItem$1[], userPermissions: string[] | undefined, permissionChecker?: PermissionChecker): SidebarItem$1[];
-declare function hasActiveDescendant(item: SidebarItem$1, activeItemId?: string): boolean;
+interface AsyncComboboxProps extends SharedComponentProps {
+    options: ComboboxOption[];
+    value?: string | number;
+    placeholder?: string;
+    onChange?: (value: ComboboxOption['value']) => void;
+    onInputChange?: (value: string) => void;
+    onInputFocus?: () => void;
+    onScrollEnd?: () => void;
+    loading?: boolean;
+    disabled?: boolean;
+    searchPlaceholder?: string;
+    helperId?: string;
+    errorId?: string;
+    allowClear?: boolean;
+    onClear?: () => void;
+    portal?: boolean;
+}
+declare const AsyncCombobox: react.ForwardRefExoticComponent<AsyncComboboxProps & react.RefAttributes<HTMLInputElement>>;
 
-type ArgonSidebarHeaderRender = (state: {
-    collapsed: boolean;
-    hoverExpanded: boolean;
-}) => React.ReactNode;
-type ArgonSidebarProps = SidebarProps & {
-    onHoverChange?: (hovered: boolean) => void;
-    header?: React.ReactNode | ArgonSidebarHeaderRender;
+type MultiSelectOption = {
+    label: string;
+    value: string | number;
+    disabled?: boolean;
+    searchValue?: string;
 };
-declare function ArgonSidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, onHoverChange, header, ...rest }: ArgonSidebarProps): react_jsx_runtime.JSX.Element;
-
-declare const buttonVariants: (props?: ({
-    variant?: "link" | "default" | "destructive" | "outline" | "confirm" | "secondary" | "ghost" | "create" | null | undefined;
-    size?: "sm" | "md" | "lg" | "icon" | null | undefined;
-} & class_variance_authority_types.ClassProp) | undefined) => string;
-type ButtonVariant = VariantProps<typeof buttonVariants>['variant'];
-type ButtonSize = 'sm' | 'md' | 'lg' | 'icon';
-interface ButtonProps extends Omit<SharedComponentProps, 'size'>, Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'size' | 'className'> {
-    variant?: ButtonVariant;
-    size?: ButtonSize;
-    startIcon?: ReactNode;
-    endIcon?: ReactNode;
-    children?: ReactNode;
+interface MultiSelectProps extends SharedComponentProps {
+    options: MultiSelectOption[];
+    value?: Array<MultiSelectOption['value']>;
+    placeholder?: string;
+    onChange?: (value: Array<MultiSelectOption['value']>) => void;
+    onSearch?: (value: string) => void;
+    loading?: boolean;
+    disabled?: boolean;
+    searchable?: boolean;
+    searchPlaceholder?: string;
 }
-declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
+declare const MultiSelect: react.ForwardRefExoticComponent<MultiSelectProps & react.RefAttributes<HTMLButtonElement>>;
 
-declare function Card({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardHeader({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardTitle({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardDescription({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardAction({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardContent({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
-declare function CardFooter({ className, ...props }: react.ComponentProps<'div'>): react_jsx_runtime.JSX.Element;
+/**
+ * Vertical form wrapper that keeps consistent spacing between fields.
+ * @remarks
+ * Extend `className` or pass native form props while maintaining consistent letter spacing for each child row.
+ */
+declare function Form({ className, ...props }: FormHTMLAttributes<HTMLFormElement>): react_jsx_runtime.JSX.Element;
+interface FormFieldProps extends HTMLAttributes<HTMLDivElement> {
+    children: ReactNode;
+    label?: ReactNode;
+    helperText?: ReactNode;
+    errorMessage?: ReactNode;
+    required?: boolean;
+    htmlFor?: string;
+}
+/**
+ * Grid-aligned form field wrapper for label/control/description clusters.
+ */
+declare const FormField: react.ForwardRefExoticComponent<FormFieldProps & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Container for a single form item to stack label, control, and messages vertically.
+ */
+declare const FormItem: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Styled label with strong typography and surface-aware coloring.
+ */
+declare const FormLabel: react.ForwardRefExoticComponent<LabelHTMLAttributes<HTMLLabelElement> & react.RefAttributes<HTMLLabelElement>>;
+/**
+ * Flex container that aligns inputs and accessory controls horizontally.
+ */
+declare const FormControl: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElement> & react.RefAttributes<HTMLDivElement>>;
+/**
+ * Neutral description text for a form field.
+ */
+declare const FormDescription: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
+/**
+ * Inline error message text for destructive validation states.
+ */
+declare const FormMessage: react.ForwardRefExoticComponent<HTMLAttributes<HTMLParagraphElement> & react.RefAttributes<HTMLParagraphElement>>;
 
-type SectionTitleProps = {
-    title: string;
-    subtitle?: string;
-    icon?: ReactNode;
-    iconClassName?: string;
-    rightSlot?: ReactNode;
+type SelectOption = {
+    label: ReactNode;
+    value: string | number;
+    disabled?: boolean;
 };
-declare function SectionTitle({ title, subtitle, icon, iconClassName, rightSlot, }: SectionTitleProps): react_jsx_runtime.JSX.Element;
-
-declare const inputVariants: (props?: ({
-    variant?: "default" | "outline" | "ghost" | null | undefined;
+type Option = SelectOption;
+declare const triggerVariants$1: (props?: ({
+    variant?: "outline" | "default" | "ghost" | null | undefined;
     size?: "sm" | "md" | "lg" | null | undefined;
 } & class_variance_authority_types.ClassProp) | undefined) => string;
-type InputVariant = VariantProps<typeof inputVariants>['variant'];
-interface InputProps extends SharedComponentProps, Omit<InputHTMLAttributes<HTMLInputElement>, 'className' | 'size' | 'prefix'> {
-    variant?: InputVariant;
-    prefix?: ReactNode;
-    suffix?: ReactNode;
-    inputClassName?: string;
-    onValueChange?: (value: string) => void;
-    showPasswordToggle?: boolean;
+type SelectVariant$1 = VariantProps<typeof triggerVariants$1>['variant'];
+interface SelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
+    options: SelectOption[];
+    value?: string | number;
+    defaultValue?: string | number;
+    placeholder?: string;
+    onChange?: (value: SelectOption['value']) => void;
+    variant?: SelectVariant$1;
 }
-declare const Input: react.ForwardRefExoticComponent<InputProps & react.RefAttributes<HTMLInputElement>>;
+/**
+ * Select field powered by Radix primitives with customizable trigger variants and accessible helpers.
+ * @remarks
+ * Provide `options`, manage `value`/`defaultValue`, and style via `variant` (default/outline/ghost) plus `size` (sm/md/lg); show helper/error text and `loading`.
+ */
+declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<HTMLButtonElement>>;
 
-type ComboboxOption = {
-    label: string;
+type SearchableSelectOption = {
+    label: ReactNode;
     value: string | number;
-    description?: string;
-    searchValue?: string;
     disabled?: boolean;
+    searchValue?: string;
 };
-type ComboboxAsyncConfig = {
-    onSearch?: (value: string) => void;
-    onLoadMore?: () => void;
-    hasMore?: boolean;
-    resetSearchOnFocus?: boolean;
-    restoreSelectedOnBlur?: boolean;
-};
-interface ComboboxProps extends SharedComponentProps {
-    options: ComboboxOption[];
+declare const triggerVariants: (props?: ({
+    variant?: "outline" | "default" | "ghost" | null | undefined;
+    size?: "sm" | "md" | "lg" | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+type SelectVariant = VariantProps<typeof triggerVariants>['variant'];
+interface SearchableSelectProps extends SharedComponentProps, Omit<SelectPrimitive.SelectProps, 'defaultValue' | 'value' | 'children' | 'onValueChange'> {
+    options: SearchableSelectOption[];
     value?: string | number;
+    defaultValue?: string | number;
     placeholder?: string;
-    onChange?: (value: ComboboxOption['value']) => void;
-    onInputChange?: (value: string) => void;
-    onLoadMore?: () => void;
-    hasMore?: boolean;
-    asyncConfig?: ComboboxAsyncConfig;
+    onChange?: (value: SearchableSelectOption['value']) => void;
+    variant?: SelectVariant;
+    onSearch?: (query: string) => void;
     loading?: boolean;
-    disabled?: boolean;
+    size?: 'sm' | 'md' | 'lg';
     searchPlaceholder?: string;
-    helperId?: string;
-    errorId?: string;
-    allowClear?: boolean;
-    onClear?: () => void;
-    portal?: boolean;
-    dropdownClassName?: string;
-    /** Override dropdown max height (e.g. for testing scroll with few items). */
-    dropdownMaxHeight?: number;
-    /** Keep error state styling but do not render error text below field. */
-    hideErrorMessage?: boolean;
-}
-declare const Combobox: react.ForwardRefExoticComponent<ComboboxProps & react.RefAttributes<HTMLInputElement>>;
-
-interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type' | 'size' | 'className' | 'onChange'> {
-    className?: string;
-    trackClassName?: string;
-    thumbClassName?: string;
-    onCheckedChange?: (checked: boolean) => void;
-}
-declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
-
-type MultiTabItem = {
-    label: ReactNode;
-    value: string;
-};
-interface MultiTabsProps {
-    items: MultiTabItem[];
-    value: string;
-    onChange: (value: string) => void;
-    className?: string;
-    style?: CSSProperties;
 }
-declare function MultiTabs({ items, value, onChange, className, style, }: MultiTabsProps): react_jsx_runtime.JSX.Element;
+declare const SearchableSelect: react.ForwardRefExoticComponent<SearchableSelectProps & react.RefAttributes<HTMLButtonElement>>;
 
-type StatTone = 'emerald' | 'sky' | 'violet' | 'rose';
-type StatCardProps = {
-    label: ReactNode;
+type Trend = 'up' | 'down' | 'flat';
+interface StatProps extends SharedComponentProps {
     value: ReactNode;
-    tone?: StatTone;
-    icon?: ReactNode;
-    className?: string;
-};
-declare function StatCard({ label, value, tone, icon, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
+    helper?: ReactNode;
+    delta?: ReactNode;
+    trend?: Trend;
+}
+/**
+ * Metric card that exposes a primary `value`, optional `delta`, and severity-aware `trend` indicator.
+ * @remarks
+ * Accepts `size` (sm/md/lg), shows `helper` or helper text, and can render `loading`/`disabled` states while aligning helper/error messaging.
+ */
+declare function Stat({ label, value, helper, delta, trend, helperText, errorMessage, loading, disabled, size, className, style, }: StatProps): react_jsx_runtime.JSX.Element;
 
 type DataTableSortDirection = 'asc' | 'desc';
 type DataTableAlign = 'left' | 'center' | 'right';
@@ -718,13 +1215,14 @@ type DataTableProps<T> = {
     onRowClick?: (record: T) => void;
     rowSelection?: DataTableRowSelection;
     renderActions?: (record: T) => ReactNode;
-    actionColumnWidth?: number | string;
     className?: string;
     headerAlign?: DataTableAlign;
     cellAlign?: DataTableAlign;
     stickyOffset?: number;
+    /** When false, table container does not scroll (overflow-visible). Default true. */
+    scrollable?: boolean;
 };
-declare function DataTable<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, actionColumnWidth, className, headerAlign, stickyOffset, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
+declare function DataTable<T>({ columns, data, rowKey, loading, emptyText, pagination, sort, onSortChange, sortMode, onRowClick, rowSelection, renderActions, className, headerAlign, stickyOffset, scrollable, }: DataTableProps<T>): react_jsx_runtime.JSX.Element;
 declare const Table: react.ForwardRefExoticComponent<TableHTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
 declare const TableHeader: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
 declare const TableBody: react.ForwardRefExoticComponent<HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
@@ -733,128 +1231,255 @@ declare const TableCell: react.ForwardRefExoticComponent<TdHTMLAttributes<HTMLTa
     as?: "td" | "th";
 } & react.RefAttributes<HTMLTableCellElement>>;
 
-type StatusAction = {
-    label: ReactNode;
-    color?: string;
-    href?: string;
-    onClick?: () => void;
-};
-type StatusOption = {
-    value: string | number;
-    label: ReactNode;
-    color?: string;
-    action?: StatusAction;
+type PaginationInfo = {
+    page: number;
+    pageSize: number;
+    total: number;
+    totalPages: number;
+    showingStart: number;
+    showingEnd: number;
 };
-type StatusPresentation = {
-    label: ReactNode;
-    color?: string;
-    action?: StatusAction;
+type PaginationProps = {
+    page: number;
+    pageSize: number;
+    total: number;
+    onChange: (page: number) => void;
+    pageSizeOptions?: number[];
+    onPageSizeChange?: (pageSize: number) => void;
+    className?: string;
+    showFirstLast?: boolean;
+    label?: (info: PaginationInfo) => ReactNode;
 };
-declare function getStatusPresentation(status: string | number | null | undefined, options: StatusOption[]): StatusPresentation | null;
+declare const Pagination: ({ page, pageSize, total, onChange, pageSizeOptions, onPageSizeChange, className, showFirstLast, label, }: PaginationProps) => react_jsx_runtime.JSX.Element;
 
-type RemoteLoadingProps = {
-    className?: string;
+type PageTitleProps = {
+    /**
+     * Main title of the page.
+     */
+    title: string;
+    /**
+     * Short description shown below the title.
+     */
+    subtitle?: string;
+    /**
+     * Visual density of the page header.
+     */
+    size?: 'default' | 'compact';
+    /**
+     * Slot rendered on the right side of the header.
+     */
+    rightSlot?: ReactNode;
 };
-declare function RemoteLoading({ className }: RemoteLoadingProps): react_jsx_runtime.JSX.Element;
+declare function PageTitle({ title, subtitle, size, rightSlot, }: PageTitleProps): react_jsx_runtime.JSX.Element;
 
-type DateRangePickerValue = {
-    startDate?: string | null;
-    endDate?: string | null;
+type SectionTitleProps = {
+    /**
+     * Main title of the section.
+     */
+    title: string;
+    /**
+     * Short description that explains the section.
+     */
+    subtitle?: string;
+    /**
+     * Icon displayed to the left of the title.
+     */
+    icon?: ReactNode;
+    /**
+     * Custom class for the icon wrapper.
+     */
+    iconClassName?: string;
+    /**
+     * Slot rendered on the right side of the section title.
+     */
+    rightSlot?: ReactNode;
 };
-interface DateRangePickerProps {
-    value?: DateRangePickerValue;
-    onChange: (next: Required<DateRangePickerValue>) => void;
-    label?: string;
-    placeholder?: string;
+declare function SectionTitle({ title, subtitle, icon, iconClassName, rightSlot, }: SectionTitleProps): react_jsx_runtime.JSX.Element;
+
+interface TabItem {
+    value: string;
+    label: ReactNode;
+    content: ReactNode;
+    badge?: ReactNode;
+}
+interface TabsProps {
+    items: TabItem[];
+    defaultValue?: string;
+    onChange?: (value: string) => void;
     className?: string;
+    listClassName?: string;
+    contentClassName?: string;
 }
-declare function DateRangePicker({ value, onChange, label, placeholder, className, }: DateRangePickerProps): react_jsx_runtime.JSX.Element;
+declare function Tabs({ items, defaultValue, onChange, className, listClassName, contentClassName, }: TabsProps): react_jsx_runtime.JSX.Element;
 
-type QuickOption = {
-    label: string;
-    value: string;
-};
-interface DateTimePickerProps {
+interface LoadingProps extends HTMLAttributes<HTMLDivElement> {
     label?: ReactNode;
-    placeholder?: string;
-    value?: string;
-    onChange: (value: string) => void;
+    size?: LoadingSpinnerProps['size'];
+}
+declare function Loading({ label, size, className, ...props }: LoadingProps): react_jsx_runtime.JSX.Element;
+
+type TooltipSide$2 = 'top' | 'right' | 'bottom' | 'left';
+type TooltipAlign$2 = 'start' | 'center' | 'end';
+type TooltipProps = {
+    /**
+     * Tooltip content shown on hover or focus.
+     */
+    content: ReactNode;
+    /**
+     * Trigger element for the tooltip.
+     */
+    children: ReactNode;
+    /**
+     * Tooltip side relative to the trigger.
+     */
+    side?: TooltipSide$2;
+    /**
+     * Tooltip alignment on the secondary axis.
+     */
+    align?: TooltipAlign$2;
+    /**
+     * Extra class names for the trigger wrapper.
+     */
+    className?: string;
+    /**
+     * Extra class names for the tooltip panel.
+     */
+    contentClassName?: string;
+    /**
+     * Allows tooltip content to wrap onto multiple lines.
+     */
+    wrap?: boolean;
+    /**
+     * Renders the tooltip through a portal into `document.body`.
+     */
+    portal?: boolean;
+};
+declare function Tooltip({ content, children, side, align, className, contentClassName, wrap, portal, }: TooltipProps): react_jsx_runtime.JSX.Element;
+
+type TooltipSide$1 = 'top' | 'right' | 'bottom' | 'left';
+type TooltipAlign$1 = 'start' | 'center' | 'end';
+type OverflowTooltipProps = {
+    content: ReactNode;
+    children: ReactNode;
+    targetRef?: RefObject<HTMLElement | null>;
+    side?: TooltipSide$1;
+    align?: TooltipAlign$1;
+    className?: string;
+    contentClassName?: string;
+    wrap?: boolean;
+    portal?: boolean;
     disabled?: boolean;
-    errorMessage?: string;
+    watch?: ReadonlyArray<unknown>;
+};
+declare function OverflowTooltip({ content, children, targetRef, side, align, className, contentClassName, wrap, portal, disabled, watch, }: OverflowTooltipProps): react_jsx_runtime.JSX.Element;
+
+type TooltipSide = 'top' | 'right' | 'bottom' | 'left';
+type TooltipAlign = 'start' | 'center' | 'end';
+type LineClampTooltipProps = {
+    text: string;
+    lineClamp?: number;
     className?: string;
-    parseFormat?: string;
-    outputFormat?: string;
-    displayFormat?: string;
-    minDateTime?: Date;
-    quickOptions?: QuickOption[];
-    onQuickSelect?: (value: string) => void;
-    onClear?: () => void;
-    quickRangesLabel?: string;
-    clearLabel?: string;
+    side?: TooltipSide;
+    align?: TooltipAlign;
+    wrap?: boolean;
     portal?: boolean;
-}
-declare function DateTimePicker({ label, placeholder, value, onChange, disabled, errorMessage, className, parseFormat, outputFormat, displayFormat, minDateTime, quickOptions, onQuickSelect, onClear, quickRangesLabel, clearLabel, portal, }: DateTimePickerProps): react_jsx_runtime.JSX.Element;
+};
+declare function LineClampTooltip({ text, lineClamp, className, side, align, wrap, portal, }: LineClampTooltipProps): react_jsx_runtime.JSX.Element;
 
-type MainFePageTitleProps = {
-    title: string;
-    subtitle?: string;
-    size?: 'default' | 'compact';
-    topSlot?: React.ReactNode;
-    rightSlot?: React.ReactNode;
-};
-declare function PageTitle({ title, subtitle, size, topSlot, rightSlot, }: MainFePageTitleProps): react_jsx_runtime.JSX.Element;
-
-declare const index_ArgonSidebar: typeof ArgonSidebar;
-declare const index_Badge: typeof Badge;
-type index_BadgeProps = BadgeProps;
-declare const index_Button: typeof Button;
-type index_ButtonProps = ButtonProps;
-declare const index_Card: typeof Card;
-declare const index_CardAction: typeof CardAction;
-declare const index_CardContent: typeof CardContent;
-declare const index_CardDescription: typeof CardDescription;
-declare const index_CardFooter: typeof CardFooter;
-declare const index_CardHeader: typeof CardHeader;
-declare const index_CardTitle: typeof CardTitle;
-declare const index_Combobox: typeof Combobox;
-type index_ComboboxAsyncConfig = ComboboxAsyncConfig;
-type index_ComboboxOption = ComboboxOption;
-type index_ComboboxProps = ComboboxProps;
-declare const index_DataTable: typeof DataTable;
-type index_DataTableAlign = DataTableAlign;
-type index_DataTableColumn<T> = DataTableColumn<T>;
-type index_DataTablePagination = DataTablePagination;
-type index_DataTableProps<T> = DataTableProps<T>;
-type index_DataTableRowSelection = DataTableRowSelection;
-type index_DataTableSortDirection = DataTableSortDirection;
-type index_DataTableSortState = DataTableSortState;
-declare const index_DateRangePicker: typeof DateRangePicker;
-type index_DateRangePickerProps = DateRangePickerProps;
-declare const index_DateTimePicker: typeof DateTimePicker;
-type index_DateTimePickerProps = DateTimePickerProps;
-declare const index_Input: typeof Input;
-type index_InputProps = InputProps;
-type index_MultiTabItem = MultiTabItem;
-declare const index_MultiTabs: typeof MultiTabs;
-type index_MultiTabsProps = MultiTabsProps;
-declare const index_PageTitle: typeof PageTitle;
-declare const index_RemoteLoading: typeof RemoteLoading;
-type index_RemoteLoadingProps = RemoteLoadingProps;
-declare const index_SectionTitle: typeof SectionTitle;
-declare const index_StatCard: typeof StatCard;
-type index_StatusAction = StatusAction;
-type index_StatusOption = StatusOption;
-type index_StatusPresentation = StatusPresentation;
-declare const index_Switch: typeof Switch;
-type index_SwitchProps = SwitchProps;
-declare const index_Table: typeof Table;
-declare const index_TableBody: typeof TableBody;
-declare const index_TableCell: typeof TableCell;
-declare const index_TableHeader: typeof TableHeader;
-declare const index_TableRow: typeof TableRow;
-declare const index_getStatusPresentation: typeof getStatusPresentation;
-declare namespace index {
-  export { index_ArgonSidebar as ArgonSidebar, index_Badge as Badge, type index_BadgeProps as BadgeProps, index_Button as Button, type index_ButtonProps as ButtonProps, index_Card as Card, index_CardAction as CardAction, index_CardContent as CardContent, index_CardDescription as CardDescription, index_CardFooter as CardFooter, index_CardHeader as CardHeader, index_CardTitle as CardTitle, index_Combobox as Combobox, type index_ComboboxAsyncConfig as ComboboxAsyncConfig, type index_ComboboxOption as ComboboxOption, type index_ComboboxProps as ComboboxProps, index_DataTable as DataTable, type index_DataTableAlign as DataTableAlign, type index_DataTableColumn as DataTableColumn, type index_DataTablePagination as DataTablePagination, type index_DataTableProps as DataTableProps, type index_DataTableRowSelection as DataTableRowSelection, type index_DataTableSortDirection as DataTableSortDirection, type index_DataTableSortState as DataTableSortState, index_DateRangePicker as DateRangePicker, type index_DateRangePickerProps as DateRangePickerProps, index_DateTimePicker as DateTimePicker, type index_DateTimePickerProps as DateTimePickerProps, index_Input as Input, type index_InputProps as InputProps, type index_MultiTabItem as MultiTabItem, index_MultiTabs as MultiTabs, type index_MultiTabsProps as MultiTabsProps, index_PageTitle as PageTitle, index_RemoteLoading as RemoteLoading, type index_RemoteLoadingProps as RemoteLoadingProps, index_SectionTitle as SectionTitle, index_StatCard as StatCard, type index_StatusAction as StatusAction, type index_StatusOption as StatusOption, type index_StatusPresentation as StatusPresentation, index_Switch as Switch, type index_SwitchProps as SwitchProps, index_Table as Table, index_TableBody as TableBody, index_TableCell as TableCell, index_TableHeader as TableHeader, index_TableRow as TableRow, index_getStatusPresentation as getStatusPresentation };
+type TruncatedTextProps = {
+    email: string;
+};
+declare function TruncatedText({ email, }: TruncatedTextProps): react_jsx_runtime.JSX.Element;
+
+declare function Sidebar({ items, userPermissions, permissionChecker, activeItemId, onItemClick, listClassName, nestedListClassName, itemClassName, indentSize, ariaLabel, className, collapsible, collapsed, defaultCollapsed, onCollapseChange, collapsedWidth, expandedWidth, collapseButtonLabel, style, ...rest }: SidebarProps): react_jsx_runtime.JSX.Element;
+
+type SidebarItemProps = {
+    item: SidebarItem$1;
+    depth: number;
+    activeItemId?: string;
+    onItemClick?: (item: SidebarItem$1) => void;
+    indentSize?: number;
+    nestedListClassName?: string;
+    itemClassName?: string;
+    collapsed?: boolean;
+};
+declare function SidebarItem({ item, depth, activeItemId, onItemClick, indentSize, nestedListClassName, itemClassName, collapsed, }: SidebarItemProps): react_jsx_runtime.JSX.Element;
+
+declare const defaultPermissionChecker: PermissionChecker;
+declare function filterSidebarItems(items: SidebarItem$1[], userPermissions: string[] | undefined, permissionChecker?: PermissionChecker): SidebarItem$1[];
+declare function hasActiveDescendant(item: SidebarItem$1, activeItemId?: string): boolean;
+
+interface MainFeNamespace {
+    /**
+     * Legacy page header component.
+     */
+    PageTitle: typeof PageTitle$1;
+    /**
+     * Section header for legacy `main-fe`.
+     */
+    SectionTitle: typeof SectionTitle$1;
+    /**
+     * Button theo visual style legacy `main-fe`.
+     * Legacy `main-fe` styled button.
+     */
+    Button: typeof Button$1;
+    /**
+     * Input theo visual style legacy `main-fe`.
+     * Legacy `main-fe` styled input.
+     */
+    Input: typeof Input$1;
+    /**
+     * Legacy `main-fe` combobox with search/load-more.
+     */
+    Combobox: typeof Combobox$1;
+    /**
+     * Switch theo visual style legacy `main-fe`.
+     * Legacy `main-fe` styled switch.
+     */
+    Switch: typeof Switch;
+    /**
+     * Segmented tab group.
+     */
+    MultiTabs: typeof MultiTabs;
+    /**
+     * Metric card for legacy dashboards/lists.
+     */
+    StatCard: typeof StatCard;
+    /**
+     * Legacy `main-fe` data table.
+     */
+    DataTable: typeof DataTable$1;
+    /**
+     * Full-area loading state for remote or legacy screens.
+     */
+    RemoteLoading: typeof RemoteLoading;
+    /**
+     * Date-range picker.
+     */
+    DateRangePicker: typeof DateRangePicker;
+    /**
+     * Date-time picker.
+     */
+    DateTimePicker: typeof DateTimePicker;
+    /**
+     * Argon-style sidebar for legacy `main-fe`.
+     */
+    ArgonSidebar: typeof ArgonSidebar;
+    Badge: typeof Badge;
+    Card: typeof Card$1;
+    CardHeader: typeof CardHeader$1;
+    CardFooter: typeof CardFooter$1;
+    CardTitle: typeof CardTitle$1;
+    CardAction: typeof CardAction$1;
+    CardDescription: typeof CardDescription$1;
+    CardContent: typeof CardContent$1;
+    Table: typeof Table$1;
+    TableHeader: typeof TableHeader$1;
+    TableBody: typeof TableBody$1;
+    TableRow: typeof TableRow$1;
+    TableCell: typeof TableCell$1;
+    getStatusPresentation: typeof getStatusPresentation;
 }
+declare const MainFe: MainFeNamespace;
 
-export { Alert, type AlertProps, ArgonSidebar, AsyncCombobox, type AsyncComboboxProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbItem, Button$1 as Button, type ButtonProps$1 as ButtonProps, Card$1 as Card, CardAction$1 as CardAction, CardContent$1 as CardContent, CardDescription$1 as CardDescription, CardFooter$1 as CardFooter, CardHeader$1 as CardHeader, CardTitle$1 as CardTitle, Combobox$1 as Combobox, type ComboboxOption$2 as ComboboxOption, FormControl as Control, DataTable$1 as DataTable, type DataTableAlign$1 as DataTableAlign, type DataTableColumn$1 as DataTableColumn, type DataTablePagination$1 as DataTablePagination, type DataTableProps$1 as DataTableProps, type DataTableRowSelection$1 as DataTableRowSelection, type DataTableSortDirection$1 as DataTableSortDirection, type DataTableSortState$1 as DataTableSortState, FormDescription as Description, FormField as Field, Form, FormControl, FormDescription, FormField, type FormFieldProps, FormItem, FormLabel, FormMessage, Input$1 as Input, type InputProps$1 as InputProps, FormItem as Item, FormLabel as Label, LineClampTooltip, type LineClampTooltipProps, Loading, type LoadingProps, index as MainFe, FormMessage as Message, MultiSelect, type MultiSelectOption, NumericInput, type NumericInputProps, type Option, OverflowTooltip, type OverflowTooltipProps, PageTitle$1 as PageTitle, Pagination, type PaginationInfo, type PaginationProps, type PermissionChecker, SearchableSelect, type SearchableSelectOption, type SearchableSelectProps, SectionTitle$1 as SectionTitle, Select, type SelectOption, type SelectProps, Sidebar, SidebarItem, type SidebarProps, Stat, type StatProps, type TabItem, Table$1 as Table, TableBody$1 as TableBody, TableCell$1 as TableCell, TableHeader$1 as TableHeader, TableRow$1 as TableRow, Tabs, type TabsProps, Textarea, type TextareaProps, Tooltip, type Trend, TruncatedText, type TruncatedTextProps, defaultPermissionChecker, filterSidebarItems, hasActiveDescendant };
+export { Alert, type AlertProps, ArgonSidebar, type ArgonSidebarHeaderRender, type ArgonSidebarProps, AsyncCombobox, type AsyncComboboxProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, Card, CardAction, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, Combobox, type ComboboxOption$1 as ComboboxOption, type ComboboxProps, FormControl as Control, DataTable, type DataTableAlign, type DataTableColumn, type DataTablePagination, type DataTableProps, type DataTableRowSelection, type DataTableSortDirection, type DataTableSortState, type DateRangePickerProps, type DateRangePickerValue, type DateTimePickerProps, FormDescription as Description, FormField as Field, Form, FormControl, FormDescription, FormField, type FormFieldProps, FormItem, FormLabel, FormMessage, Input, type InputProps, FormItem as Item, FormLabel as Label, LineClampTooltip, type LineClampTooltipProps, Loading, type LoadingProps, MainFe, type ButtonProps$1 as MainFeButtonProps, type ComboboxAsyncConfig as MainFeComboboxAsyncConfig, type ComboboxOption$2 as MainFeComboboxOption, type ComboboxProps$1 as MainFeComboboxProps, type DataTableAlign$1 as MainFeDataTableAlign, type DataTableColumn$1 as MainFeDataTableColumn, type DataTablePagination$1 as MainFeDataTablePagination, type DataTableProps$1 as MainFeDataTableProps, type DataTableRowSelection$1 as MainFeDataTableRowSelection, type DataTableSortDirection$1 as MainFeDataTableSortDirection, type DataTableSortState$1 as MainFeDataTableSortState, type InputProps$1 as MainFeInputProps, type MainFeNamespace, type MainFePageTitleProps, type QuickOption as MainFeQuickOption, type MainFeSectionTitleProps, type SwitchProps as MainFeSwitchProps, FormMessage as Message, MultiSelect, type MultiSelectOption, type MultiSelectProps, type MultiTabItem, type MultiTabsProps, NumericInput, type NumericInputProps, type Option, OverflowTooltip, type OverflowTooltipProps, PageTitle, type PageTitleProps, Pagination, type PaginationInfo, type PaginationProps, type PermissionChecker, type RemoteLoadingProps, SearchableSelect, type SearchableSelectOption, type SearchableSelectProps, SectionTitle, type SectionTitleProps, Select, type SelectOption, type SelectProps, Sidebar, SidebarItem, type SidebarProps, Stat, type StatCardProps, type StatProps, type StatTone, type TabItem, Table, TableBody, TableCell, TableHeader, TableRow, Tabs, type TabsProps, Textarea, type TextareaProps, Tooltip, type TooltipProps, type Trend, TruncatedText, type TruncatedTextProps, defaultPermissionChecker, filterSidebarItems, hasActiveDescendant };