@juv/codego-react-ui 3.0.1 → 3.0.2

package/dist/index.d.cts

@@ -59,7 +59,7 @@ interface BreadcrumbProps {
 declare function Breadcrumb({ items, separator, maxItems, className, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
 
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success";
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success" | "destructive";
     size?: "xs" | "sm" | "md" | "lg" | "xl";
     fullWidth?: boolean;
     width?: number | string;
@@ -336,6 +336,145 @@ interface MetricRowProps {
 }
 declare function MetricRow({ items, divided, className }: MetricRowProps): react_jsx_runtime.JSX.Element;
 
+interface ServerPaginationLink {
+    page: number;
+    url: string;
+    active: boolean;
+}
+interface ServerPagination {
+    first_page_url: string;
+    last_page_url: string;
+    next_page_url: string | null;
+    prev_page_url: string | null;
+    per_page: number;
+    total: number;
+    links: ServerPaginationLink[];
+}
+interface ServerTableResponse<T> {
+    current_page: number;
+    data: T[];
+    pagination: ServerPagination;
+}
+interface UseServerTableOptions {
+    /** Base URL — page param appended automatically: `url?page=N` */
+    url: string;
+    /** Extra query params merged on every request */
+    params?: Record<string, string | number>;
+}
+interface UseServerTableReturn<T> {
+    data: T[];
+    columns: Column<T>[];
+    currentPage: number;
+    pagination: ServerPagination | null;
+    serverPagination: ServerPaginationProp | null;
+    loading: boolean;
+    error: string | null;
+    goToPage: (page: number) => void;
+    reload: () => void;
+}
+interface ServerPaginationProp {
+    pagination: ServerPagination;
+    currentPage: number;
+    goToPage: (page: number) => void;
+}
+declare function useServerTable<T extends Record<string, any>>({ url, params }: UseServerTableOptions): UseServerTableReturn<T>;
+type ActionFieldType = "input" | "password" | "textarea" | "checkbox" | "toggle" | "select" | "radio" | "slider" | "tag-input" | "otp" | "combobox" | "color-picker" | "date-range" | "rich-text" | "file-upload" | "repeater";
+interface ActionField {
+    key: string;
+    label: string;
+    type?: ActionFieldType;
+    /** HTML input type for type="input" (e.g. "email", "number", "password") */
+    inputType?: string;
+    /** Options for type="select", "radio", "combobox" — string[] or { label, value }[] */
+    options?: string[] | {
+        label: string;
+        value: string;
+    }[];
+    placeholder?: string;
+    required?: boolean;
+    /** Min value for type="slider" */
+    min?: number;
+    /** Max value for type="slider" */
+    max?: number;
+    /** Step for type="slider" */
+    step?: number;
+    /** Number of OTP digits for type="otp" */
+    digits?: number;
+    /** Custom render — overrides built-in field renderer */
+    render?: (value: any, onChange: (v: any) => void) => React.ReactNode;
+}
+interface DefaultActionsConfig<T> {
+    /**
+     * Base URL used to build PUT and DELETE requests.
+     * PUT  → `{baseUrl}/{id}/update`
+     * DELETE → `{baseUrl}/{id}/delete`
+     */
+    baseUrl: string;
+    /** Row key used as the URL id segment. Defaults to "id". */
+    idKey?: keyof T;
+    /** Fields rendered in the Edit modal form. Auto-derived from row keys when omitted. */
+    editForm?: ActionField[];
+    /** Fields rendered in the View modal. Auto-derived from row keys when omitted. */
+    viewForm?: ActionField[];
+    /** Called after a successful edit or delete so the parent can refresh data. */
+    onSuccess?: (action: "edit" | "delete", item: T) => void;
+}
+interface Column<T> {
+    key: keyof T | string;
+    title: string;
+    type?: "text" | "image" | "badge" | "icon" | "stack" | "select" | "toggle" | "color" | "checkbox";
+    stackProps?: {
+        limit?: number;
+        stacked?: boolean;
+        shape?: "circle" | "square";
+        size?: number;
+    };
+    /** Options for type="select" */
+    selectOptions?: string[];
+    render?: (item: T) => React.ReactNode;
+    sortable?: boolean;
+    /** Called when a cell value changes (select, toggle, color, checkbox) */
+    onChange?: (item: T, value: any) => void;
+}
+interface TableProps<T> {
+    data: T[];
+    columns: Column<T>[];
+    searchable?: boolean;
+    searchPlaceholder?: string;
+    pagination?: boolean;
+    itemsPerPage?: number;
+    selectable?: boolean;
+    onBulkDelete?: (selectedIds: string[]) => void;
+    idKey?: keyof T;
+    /** When provided, appends an Actions column with View / Edit / Delete buttons */
+    defaultActions?: DefaultActionsConfig<T>;
+    /** Pass the serverPagination object from useServerTable to enable server-side pagination */
+    serverPagination?: ServerPaginationProp;
+    className?: string;
+}
+declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, defaultActions, serverPagination, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;
+
+interface ServerDataGridProp {
+    pagination: ServerPagination;
+    currentPage: number;
+    goToPage: (page: number) => void;
+}
+interface UseServerDataGridOptions {
+    url: string;
+    params?: Record<string, string | number>;
+}
+interface UseServerDataGridReturn<T> {
+    data: T[];
+    columns: DataGridColumn<T>[];
+    currentPage: number;
+    pagination: ServerPagination | null;
+    serverPagination: ServerDataGridProp | null;
+    loading: boolean;
+    error: string | null;
+    goToPage: (page: number) => void;
+    reload: () => void;
+}
+declare function useServerDataGrid<T extends Record<string, any>>({ url, params }: UseServerDataGridOptions): UseServerDataGridReturn<T>;
 type SortDir = "asc" | "desc" | null;
 interface DataGridColumn<T> {
     key: keyof T | string;
@@ -360,8 +499,12 @@ interface DataGridProps<T> {
     emptyMessage?: string;
     className?: string;
     onRowClick?: (row: T) => void;
+    /** Appends View / Edit / Delete action buttons per row */
+    defaultActions?: DefaultActionsConfig<T>;
+    /** Pass the serverPagination object from useServerDataGrid to enable server-driven pagination */
+    serverPagination?: ServerDataGridProp;
 }
-declare function DataGrid<T extends Record<string, unknown>>({ columns, data, rowKey, selectable, selected: controlledSelected, onSelectChange, pageSize, showPagination, showColumnToggle, loading, emptyMessage, className, onRowClick, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
+declare function DataGrid<T extends Record<string, unknown>>({ columns, data, rowKey, selectable, selected: controlledSelected, onSelectChange, pageSize, showPagination, showColumnToggle, loading, emptyMessage, className, onRowClick, defaultActions, serverPagination, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
 
 interface DatePickerProps {
     mode: "date" | "dateTime" | "time";
@@ -760,24 +903,38 @@ interface ModalConfirmationProps {
  * A two-button confirmation modal with danger / warning / success / info variants.
  */
 declare function ModalConfirmation({ isOpen, onClose, onConfirm, variant, title, description, confirmLabel, cancelLabel, loading, className, }: ModalConfirmationProps): react_jsx_runtime.JSX.Element;
+type FormFieldType = "text" | "email" | "password" | "number" | "textarea" | "checkbox" | "toggle" | "select" | "radio" | "slider" | "tag-input" | "otp" | "combobox" | "color-picker" | "date-range" | "rich-text" | "file-upload" | "repeater" | "button";
 interface FormField {
     /** Unique key */
     name: string;
     label: string;
-    type: "text" | "email" | "password" | "textarea" | "select";
+    type: FormFieldType;
     placeholder?: string;
     required?: boolean;
-    /** Options for type="select" */
-    options?: {
+    /** Options for select / radio / combobox — string[] or { label, value }[] */
+    options?: string[] | {
         label: string;
         value: string;
     }[];
+    /** Custom renderer — overrides built-in field */
+    render?: (value: any, onChange: (v: any) => void) => React.ReactNode;
+    /** Button label (type="button") */
+    buttonLabel?: string;
+    /** Button variant */
+    buttonVariant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success" | "destructive";
+    /** onClick for type="button" */
+    onClick?: () => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** OTP digit length */
+    digits?: number;
 }
 interface ModalWithFormsProps {
     isOpen: boolean;
     onClose: () => void;
     /** Called with the form values on submit */
-    onSubmit: (values: Record<string, string>) => void;
+    onSubmit: (values: Record<string, any>) => void;
     title?: React.ReactNode;
     description?: React.ReactNode;
     fields: FormField[];
@@ -1299,37 +1456,6 @@ interface StepperProps {
 }
 declare function Stepper({ steps, current: controlled, defaultCurrent, onChange, orientation, clickable, className, }: StepperProps): react_jsx_runtime.JSX.Element;
 
-interface Column<T> {
-    key: keyof T | string;
-    title: string;
-    type?: "text" | "image" | "badge" | "icon" | "stack" | "select" | "toggle" | "color" | "checkbox";
-    stackProps?: {
-        limit?: number;
-        stacked?: boolean;
-        shape?: "circle" | "square";
-        size?: number;
-    };
-    /** Options for type="select" */
-    selectOptions?: string[];
-    render?: (item: T) => React.ReactNode;
-    sortable?: boolean;
-    /** Called when a cell value changes (select, toggle, color, checkbox) */
-    onChange?: (item: T, value: any) => void;
-}
-interface TableProps<T> {
-    data: T[];
-    columns: Column<T>[];
-    searchable?: boolean;
-    searchPlaceholder?: string;
-    pagination?: boolean;
-    itemsPerPage?: number;
-    selectable?: boolean;
-    onBulkDelete?: (selectedIds: string[]) => void;
-    idKey?: keyof T;
-    className?: string;
-}
-declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;
-
 type TabVariant = "line" | "pill" | "boxed" | "lifted";
 type TabSize = "sm" | "md" | "lg";
 interface TabItem {
@@ -1377,6 +1503,33 @@ interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
 }
 declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
 
+interface TocItem {
+    id: string;
+    label: string;
+}
+declare function TocProvider({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function useToc(): {
+    items: TocItem[];
+    setItems: (items: TocItem[]) => void;
+};
+declare function TableOfContents({ items }: {
+    items: TocItem[];
+}): react_jsx_runtime.JSX.Element;
+/**
+ * Wraps a docs page. Registers TOC items into context (consumed by Layout's
+ * right sidebar) and renders children full-width.
+ */
+declare function DocsLayout({ children, toc, }: {
+    children: React.ReactNode;
+    toc: TocItem[];
+}): react_jsx_runtime.JSX.Element;
+declare function Section({ id, children, }: {
+    id: string;
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
 type TimelineVariant = "default" | "success" | "error" | "warning" | "info";
 interface TimelineItem {
     id?: string;
@@ -1548,4 +1701,4 @@ interface WizardProps {
 }
 declare function Wizard({ steps, step: controlledStep, defaultStep, onStepChange, onFinish, onClose, layout, variant, size, isOpen, showClose, unchange, title, description, hideHeader, footer, renderActions, backLabel, nextLabel, finishLabel, cancelLabel, showCancel, showBackOnFirst, loading, clickableSteps, className, contentClassName, }: WizardProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, type AccordionItem, type AccordionProps, type AccordionVariant, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, COLOR_PALETTE, Calendar, CalendarDateRangePicker, type CalendarDateRangePickerProps, type CalendarDateRangeVariant, type CalendarEvent, type CalendarProps, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, type ClusterVariant, ColorPicker, type ColorPickerProps, type Column, Combobox, type ComboboxOption, type ComboboxProps, type CommandItem, CommandPalette, type CommandPaletteProps, ComposableWidget, type ComposableWidgetProps, type ConfirmVariant, ContextMenu, type ContextMenuItem, type ContextMenuProps, DataGrid, type DataGridColumn, type DataGridProps, DatePickerPopup, type DateRange, DateRangePicker, type DateRangePickerProps, Drawer, type DrawerProps, type DrawerSide, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, EVENT_COLORS, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, type FlyToOptions, type FormField, type GridAlign, type GridCols, type GridGap, GridItem, type GridItemProps, GridLayout, type GridLayoutProps, GroupNavigation, type GroupNavigationProps, type ImageEditorMode, type ImageEditorOptions, Input, type InputProps, KanbanBoard, type KanbanBoardProps, type KanbanCard, type KanbanColumn, Label, LeafletMap, type LeafletMapProps, LeftSidebar, type LeftSidebarProps, type MapLibreClusterVariant, MapLibreMap, type MapLibreMarker, type MapLibreProps, type MapLibreRoute, type MapLibreRouteType, type MapLibreStyle, type MapMarker, type MapRoute, type MarkerColor, type MetricItem, MetricRow, type MetricRowProps, Modal, ModalConfirmation, type ModalConfirmationProps, type ModalProps, ModalUnchange, type ModalUnchangeProps, ModalWithForms, type ModalWithFormsProps, type NavGroup, type NavItem, Navigation, type NavigationProps, NotificationBanner, type NotificationBannerProps, type NotificationItem, NotificationPanel, type NotificationPanelProps, type NotificationVariant, OtpInput, type OtpInputProps, Pagination, type PaginationProps, Panel, type PanelProps, PanelSettings, type PanelSettingsProps, type PanelSettingsTab, PanelSidebarGroup, PanelSidebarItem, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressProps, type ProgressSize, type ProgressVariant, type PropRow, PropsTable, RadioGroup, type RadioGroupProps, type RadioOption, type RadioSize, type RadioVariant, RangeSlider, type RangeSliderProps, Repeater, type RepeaterProps, ResizablePanels, type ResizablePanelsProps, RichTextEditor, type RichTextEditorProps, RightSidebar, type RightSidebarProps, type RouteType, ScrollArea, type ScrollAreaProps, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, Skeleton, Slider, type SliderProps, type SortDir, StatCard, type StatCardProps, type StatTrend, StatsWidget, type StatsWidgetProps, type Step, type StepStatus, Stepper, type StepperProps, type TabItem, type TabSize, type TabVariant, Table, type TableProps, TableWidget, type TableWidgetProps, Tabs, type TabsProps, TagInput, type TagInputProps, Textarea, type TextareaProps, type ThemeColors, ThemeProvider, type ThemeSettings, Timeline, type TimelineItem, type TimelineProps, type TimelineVariant, type ToastItem, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, type TreeNode, TreeView, type TreeViewProps, type TrendDir, Widget, type WidgetProps, Wizard, type WizardActionProps, type WizardLayout, type WizardProps, type WizardSize, type WizardStep, type WizardVariant, useTheme, useToast };
+export { Accordion, type AccordionItem, type AccordionProps, type AccordionVariant, type ActionField, type ActionFieldType, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, COLOR_PALETTE, Calendar, CalendarDateRangePicker, type CalendarDateRangePickerProps, type CalendarDateRangeVariant, type CalendarEvent, type CalendarProps, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, type ClusterVariant, ColorPicker, type ColorPickerProps, type Column, Combobox, type ComboboxOption, type ComboboxProps, type CommandItem, CommandPalette, type CommandPaletteProps, ComposableWidget, type ComposableWidgetProps, type ConfirmVariant, ContextMenu, type ContextMenuItem, type ContextMenuProps, DataGrid, type DataGridColumn, type DataGridProps, DatePickerPopup, type DateRange, DateRangePicker, type DateRangePickerProps, type DefaultActionsConfig, DocsLayout, Drawer, type DrawerProps, type DrawerSide, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, EVENT_COLORS, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, type FlyToOptions, type FormField, type FormFieldType, type GridAlign, type GridCols, type GridGap, GridItem, type GridItemProps, GridLayout, type GridLayoutProps, GroupNavigation, type GroupNavigationProps, type ImageEditorMode, type ImageEditorOptions, Input, type InputProps, KanbanBoard, type KanbanBoardProps, type KanbanCard, type KanbanColumn, Label, LeafletMap, type LeafletMapProps, LeftSidebar, type LeftSidebarProps, type MapLibreClusterVariant, MapLibreMap, type MapLibreMarker, type MapLibreProps, type MapLibreRoute, type MapLibreRouteType, type MapLibreStyle, type MapMarker, type MapRoute, type MarkerColor, type MetricItem, MetricRow, type MetricRowProps, Modal, ModalConfirmation, type ModalConfirmationProps, type ModalProps, ModalUnchange, type ModalUnchangeProps, ModalWithForms, type ModalWithFormsProps, type NavGroup, type NavItem, Navigation, type NavigationProps, NotificationBanner, type NotificationBannerProps, type NotificationItem, NotificationPanel, type NotificationPanelProps, type NotificationVariant, OtpInput, type OtpInputProps, Pagination, type PaginationProps, Panel, type PanelProps, PanelSettings, type PanelSettingsProps, type PanelSettingsTab, PanelSidebarGroup, PanelSidebarItem, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressProps, type ProgressSize, type ProgressVariant, type PropRow, PropsTable, RadioGroup, type RadioGroupProps, type RadioOption, type RadioSize, type RadioVariant, RangeSlider, type RangeSliderProps, Repeater, type RepeaterProps, ResizablePanels, type ResizablePanelsProps, RichTextEditor, type RichTextEditorProps, RightSidebar, type RightSidebarProps, type RouteType, ScrollArea, type ScrollAreaProps, Section, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, type ServerDataGridProp, type ServerPagination, type ServerPaginationLink, type ServerPaginationProp, type ServerTableResponse, Skeleton, Slider, type SliderProps, type SortDir, StatCard, type StatCardProps, type StatTrend, StatsWidget, type StatsWidgetProps, type Step, type StepStatus, Stepper, type StepperProps, type TabItem, type TabSize, type TabVariant, Table, TableOfContents, type TableProps, TableWidget, type TableWidgetProps, Tabs, type TabsProps, TagInput, type TagInputProps, Textarea, type TextareaProps, type ThemeColors, ThemeProvider, type ThemeSettings, Timeline, type TimelineItem, type TimelineProps, type TimelineVariant, type ToastItem, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, type TocItem, TocProvider, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, type TreeNode, TreeView, type TreeViewProps, type TrendDir, type UseServerDataGridOptions, type UseServerDataGridReturn, type UseServerTableOptions, type UseServerTableReturn, Widget, type WidgetProps, Wizard, type WizardActionProps, type WizardLayout, type WizardProps, type WizardSize, type WizardStep, type WizardVariant, useServerDataGrid, useServerTable, useTheme, useToast, useToc };

package/dist/index.d.ts

@@ -59,7 +59,7 @@ interface BreadcrumbProps {
 declare function Breadcrumb({ items, separator, maxItems, className, }: BreadcrumbProps): react_jsx_runtime.JSX.Element;
 
 interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
-    variant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success";
+    variant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success" | "destructive";
     size?: "xs" | "sm" | "md" | "lg" | "xl";
     fullWidth?: boolean;
     width?: number | string;
@@ -336,6 +336,145 @@ interface MetricRowProps {
 }
 declare function MetricRow({ items, divided, className }: MetricRowProps): react_jsx_runtime.JSX.Element;
 
+interface ServerPaginationLink {
+    page: number;
+    url: string;
+    active: boolean;
+}
+interface ServerPagination {
+    first_page_url: string;
+    last_page_url: string;
+    next_page_url: string | null;
+    prev_page_url: string | null;
+    per_page: number;
+    total: number;
+    links: ServerPaginationLink[];
+}
+interface ServerTableResponse<T> {
+    current_page: number;
+    data: T[];
+    pagination: ServerPagination;
+}
+interface UseServerTableOptions {
+    /** Base URL — page param appended automatically: `url?page=N` */
+    url: string;
+    /** Extra query params merged on every request */
+    params?: Record<string, string | number>;
+}
+interface UseServerTableReturn<T> {
+    data: T[];
+    columns: Column<T>[];
+    currentPage: number;
+    pagination: ServerPagination | null;
+    serverPagination: ServerPaginationProp | null;
+    loading: boolean;
+    error: string | null;
+    goToPage: (page: number) => void;
+    reload: () => void;
+}
+interface ServerPaginationProp {
+    pagination: ServerPagination;
+    currentPage: number;
+    goToPage: (page: number) => void;
+}
+declare function useServerTable<T extends Record<string, any>>({ url, params }: UseServerTableOptions): UseServerTableReturn<T>;
+type ActionFieldType = "input" | "password" | "textarea" | "checkbox" | "toggle" | "select" | "radio" | "slider" | "tag-input" | "otp" | "combobox" | "color-picker" | "date-range" | "rich-text" | "file-upload" | "repeater";
+interface ActionField {
+    key: string;
+    label: string;
+    type?: ActionFieldType;
+    /** HTML input type for type="input" (e.g. "email", "number", "password") */
+    inputType?: string;
+    /** Options for type="select", "radio", "combobox" — string[] or { label, value }[] */
+    options?: string[] | {
+        label: string;
+        value: string;
+    }[];
+    placeholder?: string;
+    required?: boolean;
+    /** Min value for type="slider" */
+    min?: number;
+    /** Max value for type="slider" */
+    max?: number;
+    /** Step for type="slider" */
+    step?: number;
+    /** Number of OTP digits for type="otp" */
+    digits?: number;
+    /** Custom render — overrides built-in field renderer */
+    render?: (value: any, onChange: (v: any) => void) => React.ReactNode;
+}
+interface DefaultActionsConfig<T> {
+    /**
+     * Base URL used to build PUT and DELETE requests.
+     * PUT  → `{baseUrl}/{id}/update`
+     * DELETE → `{baseUrl}/{id}/delete`
+     */
+    baseUrl: string;
+    /** Row key used as the URL id segment. Defaults to "id". */
+    idKey?: keyof T;
+    /** Fields rendered in the Edit modal form. Auto-derived from row keys when omitted. */
+    editForm?: ActionField[];
+    /** Fields rendered in the View modal. Auto-derived from row keys when omitted. */
+    viewForm?: ActionField[];
+    /** Called after a successful edit or delete so the parent can refresh data. */
+    onSuccess?: (action: "edit" | "delete", item: T) => void;
+}
+interface Column<T> {
+    key: keyof T | string;
+    title: string;
+    type?: "text" | "image" | "badge" | "icon" | "stack" | "select" | "toggle" | "color" | "checkbox";
+    stackProps?: {
+        limit?: number;
+        stacked?: boolean;
+        shape?: "circle" | "square";
+        size?: number;
+    };
+    /** Options for type="select" */
+    selectOptions?: string[];
+    render?: (item: T) => React.ReactNode;
+    sortable?: boolean;
+    /** Called when a cell value changes (select, toggle, color, checkbox) */
+    onChange?: (item: T, value: any) => void;
+}
+interface TableProps<T> {
+    data: T[];
+    columns: Column<T>[];
+    searchable?: boolean;
+    searchPlaceholder?: string;
+    pagination?: boolean;
+    itemsPerPage?: number;
+    selectable?: boolean;
+    onBulkDelete?: (selectedIds: string[]) => void;
+    idKey?: keyof T;
+    /** When provided, appends an Actions column with View / Edit / Delete buttons */
+    defaultActions?: DefaultActionsConfig<T>;
+    /** Pass the serverPagination object from useServerTable to enable server-side pagination */
+    serverPagination?: ServerPaginationProp;
+    className?: string;
+}
+declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, defaultActions, serverPagination, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;
+
+interface ServerDataGridProp {
+    pagination: ServerPagination;
+    currentPage: number;
+    goToPage: (page: number) => void;
+}
+interface UseServerDataGridOptions {
+    url: string;
+    params?: Record<string, string | number>;
+}
+interface UseServerDataGridReturn<T> {
+    data: T[];
+    columns: DataGridColumn<T>[];
+    currentPage: number;
+    pagination: ServerPagination | null;
+    serverPagination: ServerDataGridProp | null;
+    loading: boolean;
+    error: string | null;
+    goToPage: (page: number) => void;
+    reload: () => void;
+}
+declare function useServerDataGrid<T extends Record<string, any>>({ url, params }: UseServerDataGridOptions): UseServerDataGridReturn<T>;
 type SortDir = "asc" | "desc" | null;
 interface DataGridColumn<T> {
     key: keyof T | string;
@@ -360,8 +499,12 @@ interface DataGridProps<T> {
     emptyMessage?: string;
     className?: string;
     onRowClick?: (row: T) => void;
+    /** Appends View / Edit / Delete action buttons per row */
+    defaultActions?: DefaultActionsConfig<T>;
+    /** Pass the serverPagination object from useServerDataGrid to enable server-driven pagination */
+    serverPagination?: ServerDataGridProp;
 }
-declare function DataGrid<T extends Record<string, unknown>>({ columns, data, rowKey, selectable, selected: controlledSelected, onSelectChange, pageSize, showPagination, showColumnToggle, loading, emptyMessage, className, onRowClick, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
+declare function DataGrid<T extends Record<string, unknown>>({ columns, data, rowKey, selectable, selected: controlledSelected, onSelectChange, pageSize, showPagination, showColumnToggle, loading, emptyMessage, className, onRowClick, defaultActions, serverPagination, }: DataGridProps<T>): react_jsx_runtime.JSX.Element;
 
 interface DatePickerProps {
     mode: "date" | "dateTime" | "time";
@@ -760,24 +903,38 @@ interface ModalConfirmationProps {
  * A two-button confirmation modal with danger / warning / success / info variants.
  */
 declare function ModalConfirmation({ isOpen, onClose, onConfirm, variant, title, description, confirmLabel, cancelLabel, loading, className, }: ModalConfirmationProps): react_jsx_runtime.JSX.Element;
+type FormFieldType = "text" | "email" | "password" | "number" | "textarea" | "checkbox" | "toggle" | "select" | "radio" | "slider" | "tag-input" | "otp" | "combobox" | "color-picker" | "date-range" | "rich-text" | "file-upload" | "repeater" | "button";
 interface FormField {
     /** Unique key */
     name: string;
     label: string;
-    type: "text" | "email" | "password" | "textarea" | "select";
+    type: FormFieldType;
     placeholder?: string;
     required?: boolean;
-    /** Options for type="select" */
-    options?: {
+    /** Options for select / radio / combobox — string[] or { label, value }[] */
+    options?: string[] | {
         label: string;
         value: string;
     }[];
+    /** Custom renderer — overrides built-in field */
+    render?: (value: any, onChange: (v: any) => void) => React.ReactNode;
+    /** Button label (type="button") */
+    buttonLabel?: string;
+    /** Button variant */
+    buttonVariant?: "primary" | "secondary" | "outline" | "ghost" | "link" | "danger" | "success" | "destructive";
+    /** onClick for type="button" */
+    onClick?: () => void;
+    min?: number;
+    max?: number;
+    step?: number;
+    /** OTP digit length */
+    digits?: number;
 }
 interface ModalWithFormsProps {
     isOpen: boolean;
     onClose: () => void;
     /** Called with the form values on submit */
-    onSubmit: (values: Record<string, string>) => void;
+    onSubmit: (values: Record<string, any>) => void;
     title?: React.ReactNode;
     description?: React.ReactNode;
     fields: FormField[];
@@ -1299,37 +1456,6 @@ interface StepperProps {
 }
 declare function Stepper({ steps, current: controlled, defaultCurrent, onChange, orientation, clickable, className, }: StepperProps): react_jsx_runtime.JSX.Element;
 
-interface Column<T> {
-    key: keyof T | string;
-    title: string;
-    type?: "text" | "image" | "badge" | "icon" | "stack" | "select" | "toggle" | "color" | "checkbox";
-    stackProps?: {
-        limit?: number;
-        stacked?: boolean;
-        shape?: "circle" | "square";
-        size?: number;
-    };
-    /** Options for type="select" */
-    selectOptions?: string[];
-    render?: (item: T) => React.ReactNode;
-    sortable?: boolean;
-    /** Called when a cell value changes (select, toggle, color, checkbox) */
-    onChange?: (item: T, value: any) => void;
-}
-interface TableProps<T> {
-    data: T[];
-    columns: Column<T>[];
-    searchable?: boolean;
-    searchPlaceholder?: string;
-    pagination?: boolean;
-    itemsPerPage?: number;
-    selectable?: boolean;
-    onBulkDelete?: (selectedIds: string[]) => void;
-    idKey?: keyof T;
-    className?: string;
-}
-declare function Table<T extends Record<string, any>>({ data, columns, searchable, searchPlaceholder, pagination, itemsPerPage, selectable, onBulkDelete, idKey, className, }: TableProps<T>): react_jsx_runtime.JSX.Element;
-
 type TabVariant = "line" | "pill" | "boxed" | "lifted";
 type TabSize = "sm" | "md" | "lg";
 interface TabItem {
@@ -1377,6 +1503,33 @@ interface TextareaProps extends Omit<React.TextareaHTMLAttributes<HTMLTextAreaEl
 }
 declare const Textarea: React.ForwardRefExoticComponent<TextareaProps & React.RefAttributes<HTMLTextAreaElement>>;
 
+interface TocItem {
+    id: string;
+    label: string;
+}
+declare function TocProvider({ children }: {
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+declare function useToc(): {
+    items: TocItem[];
+    setItems: (items: TocItem[]) => void;
+};
+declare function TableOfContents({ items }: {
+    items: TocItem[];
+}): react_jsx_runtime.JSX.Element;
+/**
+ * Wraps a docs page. Registers TOC items into context (consumed by Layout's
+ * right sidebar) and renders children full-width.
+ */
+declare function DocsLayout({ children, toc, }: {
+    children: React.ReactNode;
+    toc: TocItem[];
+}): react_jsx_runtime.JSX.Element;
+declare function Section({ id, children, }: {
+    id: string;
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
 type TimelineVariant = "default" | "success" | "error" | "warning" | "info";
 interface TimelineItem {
     id?: string;
@@ -1548,4 +1701,4 @@ interface WizardProps {
 }
 declare function Wizard({ steps, step: controlledStep, defaultStep, onStepChange, onFinish, onClose, layout, variant, size, isOpen, showClose, unchange, title, description, hideHeader, footer, renderActions, backLabel, nextLabel, finishLabel, cancelLabel, showCancel, showBackOnFirst, loading, clickableSteps, className, contentClassName, }: WizardProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, type AccordionItem, type AccordionProps, type AccordionVariant, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, COLOR_PALETTE, Calendar, CalendarDateRangePicker, type CalendarDateRangePickerProps, type CalendarDateRangeVariant, type CalendarEvent, type CalendarProps, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, type ClusterVariant, ColorPicker, type ColorPickerProps, type Column, Combobox, type ComboboxOption, type ComboboxProps, type CommandItem, CommandPalette, type CommandPaletteProps, ComposableWidget, type ComposableWidgetProps, type ConfirmVariant, ContextMenu, type ContextMenuItem, type ContextMenuProps, DataGrid, type DataGridColumn, type DataGridProps, DatePickerPopup, type DateRange, DateRangePicker, type DateRangePickerProps, Drawer, type DrawerProps, type DrawerSide, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, EVENT_COLORS, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, type FlyToOptions, type FormField, type GridAlign, type GridCols, type GridGap, GridItem, type GridItemProps, GridLayout, type GridLayoutProps, GroupNavigation, type GroupNavigationProps, type ImageEditorMode, type ImageEditorOptions, Input, type InputProps, KanbanBoard, type KanbanBoardProps, type KanbanCard, type KanbanColumn, Label, LeafletMap, type LeafletMapProps, LeftSidebar, type LeftSidebarProps, type MapLibreClusterVariant, MapLibreMap, type MapLibreMarker, type MapLibreProps, type MapLibreRoute, type MapLibreRouteType, type MapLibreStyle, type MapMarker, type MapRoute, type MarkerColor, type MetricItem, MetricRow, type MetricRowProps, Modal, ModalConfirmation, type ModalConfirmationProps, type ModalProps, ModalUnchange, type ModalUnchangeProps, ModalWithForms, type ModalWithFormsProps, type NavGroup, type NavItem, Navigation, type NavigationProps, NotificationBanner, type NotificationBannerProps, type NotificationItem, NotificationPanel, type NotificationPanelProps, type NotificationVariant, OtpInput, type OtpInputProps, Pagination, type PaginationProps, Panel, type PanelProps, PanelSettings, type PanelSettingsProps, type PanelSettingsTab, PanelSidebarGroup, PanelSidebarItem, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressProps, type ProgressSize, type ProgressVariant, type PropRow, PropsTable, RadioGroup, type RadioGroupProps, type RadioOption, type RadioSize, type RadioVariant, RangeSlider, type RangeSliderProps, Repeater, type RepeaterProps, ResizablePanels, type ResizablePanelsProps, RichTextEditor, type RichTextEditorProps, RightSidebar, type RightSidebarProps, type RouteType, ScrollArea, type ScrollAreaProps, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, Skeleton, Slider, type SliderProps, type SortDir, StatCard, type StatCardProps, type StatTrend, StatsWidget, type StatsWidgetProps, type Step, type StepStatus, Stepper, type StepperProps, type TabItem, type TabSize, type TabVariant, Table, type TableProps, TableWidget, type TableWidgetProps, Tabs, type TabsProps, TagInput, type TagInputProps, Textarea, type TextareaProps, type ThemeColors, ThemeProvider, type ThemeSettings, Timeline, type TimelineItem, type TimelineProps, type TimelineVariant, type ToastItem, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, type TreeNode, TreeView, type TreeViewProps, type TrendDir, Widget, type WidgetProps, Wizard, type WizardActionProps, type WizardLayout, type WizardProps, type WizardSize, type WizardStep, type WizardVariant, useTheme, useToast };
+export { Accordion, type AccordionItem, type AccordionProps, type AccordionVariant, type ActionField, type ActionFieldType, AvatarStack, type AvatarStackProps, Badge, type BadgeProps, type BadgeSize, type BadgeVariant, Breadcrumb, type BreadcrumbItem, type BreadcrumbProps, Button, type ButtonProps, COLOR_PALETTE, Calendar, CalendarDateRangePicker, type CalendarDateRangePickerProps, type CalendarDateRangeVariant, type CalendarEvent, type CalendarProps, type CalendarView, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, type ClusterVariant, ColorPicker, type ColorPickerProps, type Column, Combobox, type ComboboxOption, type ComboboxProps, type CommandItem, CommandPalette, type CommandPaletteProps, ComposableWidget, type ComposableWidgetProps, type ConfirmVariant, ContextMenu, type ContextMenuItem, type ContextMenuProps, DataGrid, type DataGridColumn, type DataGridProps, DatePickerPopup, type DateRange, DateRangePicker, type DateRangePickerProps, type DefaultActionsConfig, DocsLayout, Drawer, type DrawerProps, type DrawerSide, Dropdown, DropdownItem, DropdownLabel, type DropdownProps, DropdownSeparator, EVENT_COLORS, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, type FlyToOptions, type FormField, type FormFieldType, type GridAlign, type GridCols, type GridGap, GridItem, type GridItemProps, GridLayout, type GridLayoutProps, GroupNavigation, type GroupNavigationProps, type ImageEditorMode, type ImageEditorOptions, Input, type InputProps, KanbanBoard, type KanbanBoardProps, type KanbanCard, type KanbanColumn, Label, LeafletMap, type LeafletMapProps, LeftSidebar, type LeftSidebarProps, type MapLibreClusterVariant, MapLibreMap, type MapLibreMarker, type MapLibreProps, type MapLibreRoute, type MapLibreRouteType, type MapLibreStyle, type MapMarker, type MapRoute, type MarkerColor, type MetricItem, MetricRow, type MetricRowProps, Modal, ModalConfirmation, type ModalConfirmationProps, type ModalProps, ModalUnchange, type ModalUnchangeProps, ModalWithForms, type ModalWithFormsProps, type NavGroup, type NavItem, Navigation, type NavigationProps, NotificationBanner, type NotificationBannerProps, type NotificationItem, NotificationPanel, type NotificationPanelProps, type NotificationVariant, OtpInput, type OtpInputProps, Pagination, type PaginationProps, Panel, type PanelProps, PanelSettings, type PanelSettingsProps, type PanelSettingsTab, PanelSidebarGroup, PanelSidebarItem, Popover, type PopoverPlacement, type PopoverProps, Progress, type ProgressProps, type ProgressSize, type ProgressVariant, type PropRow, PropsTable, RadioGroup, type RadioGroupProps, type RadioOption, type RadioSize, type RadioVariant, RangeSlider, type RangeSliderProps, Repeater, type RepeaterProps, ResizablePanels, type ResizablePanelsProps, RichTextEditor, type RichTextEditorProps, RightSidebar, type RightSidebarProps, type RouteType, ScrollArea, type ScrollAreaProps, Section, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, type ServerDataGridProp, type ServerPagination, type ServerPaginationLink, type ServerPaginationProp, type ServerTableResponse, Skeleton, Slider, type SliderProps, type SortDir, StatCard, type StatCardProps, type StatTrend, StatsWidget, type StatsWidgetProps, type Step, type StepStatus, Stepper, type StepperProps, type TabItem, type TabSize, type TabVariant, Table, TableOfContents, type TableProps, TableWidget, type TableWidgetProps, Tabs, type TabsProps, TagInput, type TagInputProps, Textarea, type TextareaProps, type ThemeColors, ThemeProvider, type ThemeSettings, Timeline, type TimelineItem, type TimelineProps, type TimelineVariant, type ToastItem, type ToastPosition, ToastProvider, type ToastProviderProps, type ToastVariant, type TocItem, TocProvider, ToggleSwitch, type ToggleSwitchProps, Tooltip, type TooltipProps, Topbar, type TopbarProps, type TreeNode, TreeView, type TreeViewProps, type TrendDir, type UseServerDataGridOptions, type UseServerDataGridReturn, type UseServerTableOptions, type UseServerTableReturn, Widget, type WidgetProps, Wizard, type WizardActionProps, type WizardLayout, type WizardProps, type WizardSize, type WizardStep, type WizardVariant, useServerDataGrid, useServerTable, useTheme, useToast, useToc };