@juv/codego-react-ui 1.0.7 → 1.0.8

package/dist/index.d.cts

@@ -315,7 +315,21 @@ interface ComposableWidgetProps {
     className?: string;
 }
 declare function ComposableWidget({ title, description, headerLeft, headerRight, toolbar, children, footer, padding, className, }: ComposableWidgetProps): react_jsx_runtime.JSX.Element;
+interface MetricItem {
+    label: string;
+    value: string | number;
+    trend?: TrendDir;
+    trendValue?: string;
+    color?: SemanticColor;
+}
+interface MetricRowProps {
+    items: MetricItem[];
+    divided?: boolean;
+    className?: string;
+}
+declare function MetricRow({ items, divided, className }: MetricRowProps): react_jsx_runtime.JSX.Element;
 
+type SortDir = "asc" | "desc" | null;
 interface DataGridColumn<T> {
     key: keyof T | string;
     header: React.ReactNode;
@@ -396,6 +410,21 @@ interface DropdownProps {
     className?: string;
 }
 declare function Dropdown({ trigger, children, align, placement, width, disabled, closeOnSelect, onOpenChange, className, }: DropdownProps): react_jsx_runtime.JSX.Element;
+declare function DropdownItem({ children, onClick, icon, disabled, variant, className, }: {
+    children: React.ReactNode;
+    onClick?: () => void;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+    variant?: "default" | "danger";
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownSeparator({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownLabel({ children, className, }: {
+    children: React.ReactNode;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
 
 type ImageEditorMode = "crop" | "rotate" | "flip" | "brightness" | "contrast";
 interface ImageEditorOptions {
@@ -455,7 +484,17 @@ interface FlexLayoutProps {
     children: React.ReactNode;
     className?: string;
 }
+interface FlexItemProps {
+    grow?: boolean | number;
+    shrink?: boolean | number;
+    basis?: string;
+    order?: number;
+    alignSelf?: FlexAlign;
+    children: React.ReactNode;
+    className?: string;
+}
 declare function FlexLayout({ direction, wrap, gap, align, justify, inline, children, className, }: FlexLayoutProps): react_jsx_runtime.JSX.Element;
+declare function FlexItem({ grow, shrink, basis, order, alignSelf, children, className, }: FlexItemProps): react_jsx_runtime.JSX.Element;
 
 type GridCols = 1 | 2 | 3 | 4 | 5 | 6 | 12;
 type GridGap = "none" | "xs" | "sm" | "md" | "lg" | "xl";
@@ -473,7 +512,14 @@ interface GridLayoutProps {
     children: React.ReactNode;
     className?: string;
 }
+interface GridItemProps {
+    span?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "full";
+    rowSpan?: 1 | 2 | 3;
+    children: React.ReactNode;
+    className?: string;
+}
 declare function GridLayout({ cols, smCols, mdCols, lgCols, gap, rowGap, colGap, align, justify, children, className, }: GridLayoutProps): react_jsx_runtime.JSX.Element;
+declare function GridItem({ span, rowSpan, children, className }: GridItemProps): react_jsx_runtime.JSX.Element;
 
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "prefix" | "inputMode"> {
     inputType?: "email" | "numeric" | "integer" | "password" | "tel" | "url" | "color" | "date" | "dateTime" | "time";
@@ -811,6 +857,33 @@ interface PaginationProps {
 }
 declare function Pagination({ page, total, pageSize, siblingCount, showFirstLast, showPageSize, pageSizeOptions, onPageChange, onPageSizeChange, className, }: PaginationProps): react_jsx_runtime.JSX.Element;
 
+interface PanelProps {
+    sidebar?: React.ReactNode;
+    sidebarHeader?: React.ReactNode;
+    sidebarFooter?: React.ReactNode;
+    sidebarWidth?: string;
+    topbar?: React.ReactNode;
+    topbarTrailing?: React.ReactNode;
+    defaultCollapsed?: boolean;
+    collapsible?: boolean;
+    showThemeToggle?: boolean;
+    defaultPage?: string;
+    height?: string;
+    children?: React.ReactNode;
+    className?: string;
+}
+declare function Panel({ sidebar, sidebarHeader, sidebarFooter, sidebarWidth, topbar, topbarTrailing, defaultCollapsed, collapsible, showThemeToggle, defaultPage, height, children, className, }: PanelProps): react_jsx_runtime.JSX.Element;
+declare function PanelSidebarItem({ icon: Icon, label, active, onClick, }: {
+    icon?: React.ElementType;
+    label: string;
+    active?: boolean;
+    onClick?: () => void;
+}): react_jsx_runtime.JSX.Element;
+declare function PanelSidebarGroup({ title, children, }: {
+    title?: string;
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
 type PopoverPlacement = "top" | "bottom" | "left" | "right" | "top-start" | "top-end" | "bottom-start" | "bottom-end";
 interface PopoverProps {
     trigger: React.ReactNode;
@@ -851,6 +924,17 @@ interface CircularProgressProps {
 declare function Progress({ value, max, variant, size, label, showValue, animated, striped, indeterminate, className, }: ProgressProps): react_jsx_runtime.JSX.Element;
 declare function CircularProgress({ value, max, variant, size, strokeWidth, label, showValue, indeterminate, className, }: CircularProgressProps): react_jsx_runtime.JSX.Element;
 
+interface PropRow {
+    prop: string;
+    type: string;
+    default?: string;
+    description: string;
+    required?: boolean;
+}
+declare function PropsTable({ rows }: {
+    rows: PropRow[];
+}): react_jsx_runtime.JSX.Element;
+
 type RadioVariant = "default" | "card" | "button";
 type RadioSize = "sm" | "md" | "lg";
 interface RadioOption {
@@ -883,33 +967,6 @@ interface RepeaterProps<T> {
 }
 declare function Repeater<T>({ items, onAdd, onRemove, renderItem, addButtonText, className, }: RepeaterProps<T>): react_jsx_runtime.JSX.Element;
 
-interface PanelProps {
-    sidebar?: React.ReactNode;
-    sidebarHeader?: React.ReactNode;
-    sidebarFooter?: React.ReactNode;
-    sidebarWidth?: string;
-    topbar?: React.ReactNode;
-    topbarTrailing?: React.ReactNode;
-    defaultCollapsed?: boolean;
-    collapsible?: boolean;
-    showThemeToggle?: boolean;
-    defaultPage?: string;
-    height?: string;
-    children?: React.ReactNode;
-    className?: string;
-}
-declare function Panel({ sidebar, sidebarHeader, sidebarFooter, sidebarWidth, topbar, topbarTrailing, defaultCollapsed, collapsible, showThemeToggle, defaultPage, height, children, className, }: PanelProps): react_jsx_runtime.JSX.Element;
-declare function PanelSidebarItem({ icon: Icon, label, active, onClick, }: {
-    icon?: React.ElementType;
-    label: string;
-    active?: boolean;
-    onClick?: () => void;
-}): react_jsx_runtime.JSX.Element;
-declare function PanelSidebarGroup({ title, children, }: {
-    title?: string;
-    children: React.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-
 interface ResizablePanelsProps {
     children: [React.ReactNode, React.ReactNode];
     orientation?: "horizontal" | "vertical";
@@ -976,6 +1033,38 @@ interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChan
 }
 declare function Select({ options, value, onChange, placeholder, searchable, native, label, loadingMessage, noSearchResultsMessage, searchingMessage, multiple, reorderable, disabled, createOptionForm, suffixIcon, suffixIconColor, className, ...props }: SelectProps): react_jsx_runtime.JSX.Element;
 
+type ThemeColors = {
+    primary: string;
+    primaryHover: string;
+    secondary: string;
+    secondaryHover: string;
+    info: string;
+    infoHover: string;
+    warning: string;
+    warningHover: string;
+    danger: string;
+    dangerHover: string;
+};
+
+type SettingsTab = "appearance" | "colors" | "typography";
+interface SettingsProps {
+    /** Initially active tab */
+    defaultTab?: SettingsTab;
+    /** Called when theme (light/dark/system) changes */
+    onThemeChange?: (theme: "light" | "dark" | "system") => void;
+    /** Called when any color token changes */
+    onColorsChange?: (colors: Partial<ThemeColors>) => void;
+    /** Called when font size changes */
+    onFontSizeChange?: (size: string) => void;
+    /** Called when font family changes */
+    onFontFamilyChange?: (family: string) => void;
+    /** Called when the user resets all settings to defaults */
+    onReset?: () => void;
+    /** Additional CSS classes on the root element */
+    className?: string;
+}
+declare function Settings({ defaultTab, onThemeChange, onColorsChange, onFontSizeChange, onFontFamilyChange, onReset, className, }: SettingsProps): react_jsx_runtime.JSX.Element;
+
 declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
 
 interface SliderProps {
@@ -1027,6 +1116,7 @@ interface StatCardProps {
 }
 declare function StatCard({ title, value, change, changeLabel, trend, icon, sparkline, description, loading, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
 
+type StepStatus = "complete" | "current" | "upcoming" | "error";
 interface Step {
     label: React.ReactNode;
     description?: React.ReactNode;
@@ -1204,4 +1294,94 @@ interface WidgetProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare function Widget({ title, value, previousValue, description, badge, footer, trendLabel, icon, iconColor, trend, trendValue, progress, progressColor, variant, size, loading, animate, pulse, onClick, className, ...props }: WidgetProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AvatarStack, Badge, Breadcrumb, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartWidget, Checkbox, CircularProgress, ColorPicker, Combobox, CommandPalette, ComposableWidget, ContextMenu, DataGrid, DatePickerPopup, DateRangePicker, Drawer, Dropdown, FileUpload, FlexLayout, GridLayout, GroupNavigation, Input, KanbanBoard, Label, LeftSidebar, Modal, ModalConfirmation, ModalUnchange, ModalWithForms, Navigation, NotificationBanner, NotificationPanel, OtpInput, Pagination, Panel, PanelSidebarGroup, PanelSidebarItem, Popover, Progress, RadioGroup, RangeSlider, Repeater, ResizablePanels, RichTextEditor, RightSidebar, ScrollArea, SectionBlock, Select, Skeleton, Slider, StatCard, StatsWidget, Stepper, Table, TableWidget, Tabs, TagInput, Textarea, Timeline, ToastProvider, ToggleSwitch, Tooltip, Topbar, TreeView, Widget, useToast };
+type WizardVariant = "default" | "minimal" | "cards" | "sidebar" | "dots";
+type WizardLayout = "modal" | "page" | "inline";
+type WizardSize = "sm" | "md" | "lg" | "xl" | "full";
+interface WizardStep {
+    /** Step title shown in the header / sidebar */
+    title: string;
+    /** Optional subtitle / description */
+    description?: string;
+    /** Optional icon rendered in the step indicator */
+    icon?: React.ReactNode;
+    /** Step body content */
+    content: React.ReactNode;
+    /** Mark step as optional */
+    optional?: boolean;
+    /** Prevent advancing past this step until resolved */
+    validate?: () => boolean | string;
+}
+interface WizardActionProps {
+    /** Current step index (0-based) */
+    step: number;
+    /** Total number of steps */
+    total: number;
+    /** Go to previous step */
+    onBack: () => void;
+    /** Go to next step / finish */
+    onNext: () => void;
+    /** Close / cancel the wizard */
+    onClose?: () => void;
+    /** Whether the wizard is on the last step */
+    isLast: boolean;
+    /** Whether the wizard is on the first step */
+    isFirst: boolean;
+    /** Whether the next action is loading */
+    loading?: boolean;
+}
+interface WizardProps {
+    steps: WizardStep[];
+    /** Controlled current step (0-based) */
+    step?: number;
+    /** Initial step when uncontrolled */
+    defaultStep?: number;
+    /** Called when the step changes */
+    onStepChange?: (step: number) => void;
+    /** Called when the wizard finishes (last step → next) */
+    onFinish?: () => void;
+    /** Called when the wizard is closed / cancelled */
+    onClose?: () => void;
+    /** Render mode: modal overlay, full page, or inline block */
+    layout?: WizardLayout;
+    /** Visual design variant */
+    variant?: WizardVariant;
+    /** Size of the wizard panel */
+    size?: WizardSize;
+    /** Controls modal visibility (required when layout="modal") */
+    isOpen?: boolean;
+    /** Show the × close button in modal mode */
+    showClose?: boolean;
+    /** Prevent closing by clicking the backdrop */
+    unchange?: boolean;
+    /** Override the wizard title shown in the header */
+    title?: React.ReactNode;
+    /** Subtitle shown below the title */
+    description?: React.ReactNode;
+    /** Hide the step indicator header entirely */
+    hideHeader?: boolean;
+    /** Fully replace the footer with custom content */
+    footer?: React.ReactNode;
+    /** Replace only the action buttons with a render-prop */
+    renderActions?: (props: WizardActionProps) => React.ReactNode;
+    /** Label for the Back button */
+    backLabel?: React.ReactNode;
+    /** Label for the Next button */
+    nextLabel?: React.ReactNode;
+    /** Label for the Finish button (last step) */
+    finishLabel?: React.ReactNode;
+    /** Label for the Cancel button */
+    cancelLabel?: React.ReactNode;
+    /** Show a Cancel button in the footer */
+    showCancel?: boolean;
+    /** Show the Back button on the first step */
+    showBackOnFirst?: boolean;
+    /** Whether the next/finish action is in a loading state */
+    loading?: boolean;
+    /** Allow clicking step indicators to jump to any visited step */
+    clickableSteps?: boolean;
+    className?: string;
+    contentClassName?: string;
+}
+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, Calendar, type CalendarEvent, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, 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, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, 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, LeftSidebar, type LeftSidebarProps, 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, 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, ScrollArea, type ScrollAreaProps, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, Settings, type SettingsProps, type SettingsTab, 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, 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, useToast };

package/dist/index.d.ts

@@ -315,7 +315,21 @@ interface ComposableWidgetProps {
     className?: string;
 }
 declare function ComposableWidget({ title, description, headerLeft, headerRight, toolbar, children, footer, padding, className, }: ComposableWidgetProps): react_jsx_runtime.JSX.Element;
+interface MetricItem {
+    label: string;
+    value: string | number;
+    trend?: TrendDir;
+    trendValue?: string;
+    color?: SemanticColor;
+}
+interface MetricRowProps {
+    items: MetricItem[];
+    divided?: boolean;
+    className?: string;
+}
+declare function MetricRow({ items, divided, className }: MetricRowProps): react_jsx_runtime.JSX.Element;
 
+type SortDir = "asc" | "desc" | null;
 interface DataGridColumn<T> {
     key: keyof T | string;
     header: React.ReactNode;
@@ -396,6 +410,21 @@ interface DropdownProps {
     className?: string;
 }
 declare function Dropdown({ trigger, children, align, placement, width, disabled, closeOnSelect, onOpenChange, className, }: DropdownProps): react_jsx_runtime.JSX.Element;
+declare function DropdownItem({ children, onClick, icon, disabled, variant, className, }: {
+    children: React.ReactNode;
+    onClick?: () => void;
+    icon?: React.ReactNode;
+    disabled?: boolean;
+    variant?: "default" | "danger";
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownSeparator({ className }: {
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
+declare function DropdownLabel({ children, className, }: {
+    children: React.ReactNode;
+    className?: string;
+}): react_jsx_runtime.JSX.Element;
 
 type ImageEditorMode = "crop" | "rotate" | "flip" | "brightness" | "contrast";
 interface ImageEditorOptions {
@@ -455,7 +484,17 @@ interface FlexLayoutProps {
     children: React.ReactNode;
     className?: string;
 }
+interface FlexItemProps {
+    grow?: boolean | number;
+    shrink?: boolean | number;
+    basis?: string;
+    order?: number;
+    alignSelf?: FlexAlign;
+    children: React.ReactNode;
+    className?: string;
+}
 declare function FlexLayout({ direction, wrap, gap, align, justify, inline, children, className, }: FlexLayoutProps): react_jsx_runtime.JSX.Element;
+declare function FlexItem({ grow, shrink, basis, order, alignSelf, children, className, }: FlexItemProps): react_jsx_runtime.JSX.Element;
 
 type GridCols = 1 | 2 | 3 | 4 | 5 | 6 | 12;
 type GridGap = "none" | "xs" | "sm" | "md" | "lg" | "xl";
@@ -473,7 +512,14 @@ interface GridLayoutProps {
     children: React.ReactNode;
     className?: string;
 }
+interface GridItemProps {
+    span?: 1 | 2 | 3 | 4 | 5 | 6 | 12 | "full";
+    rowSpan?: 1 | 2 | 3;
+    children: React.ReactNode;
+    className?: string;
+}
 declare function GridLayout({ cols, smCols, mdCols, lgCols, gap, rowGap, colGap, align, justify, children, className, }: GridLayoutProps): react_jsx_runtime.JSX.Element;
+declare function GridItem({ span, rowSpan, children, className }: GridItemProps): react_jsx_runtime.JSX.Element;
 
 interface InputProps extends Omit<React.InputHTMLAttributes<HTMLInputElement>, "prefix" | "inputMode"> {
     inputType?: "email" | "numeric" | "integer" | "password" | "tel" | "url" | "color" | "date" | "dateTime" | "time";
@@ -811,6 +857,33 @@ interface PaginationProps {
 }
 declare function Pagination({ page, total, pageSize, siblingCount, showFirstLast, showPageSize, pageSizeOptions, onPageChange, onPageSizeChange, className, }: PaginationProps): react_jsx_runtime.JSX.Element;
 
+interface PanelProps {
+    sidebar?: React.ReactNode;
+    sidebarHeader?: React.ReactNode;
+    sidebarFooter?: React.ReactNode;
+    sidebarWidth?: string;
+    topbar?: React.ReactNode;
+    topbarTrailing?: React.ReactNode;
+    defaultCollapsed?: boolean;
+    collapsible?: boolean;
+    showThemeToggle?: boolean;
+    defaultPage?: string;
+    height?: string;
+    children?: React.ReactNode;
+    className?: string;
+}
+declare function Panel({ sidebar, sidebarHeader, sidebarFooter, sidebarWidth, topbar, topbarTrailing, defaultCollapsed, collapsible, showThemeToggle, defaultPage, height, children, className, }: PanelProps): react_jsx_runtime.JSX.Element;
+declare function PanelSidebarItem({ icon: Icon, label, active, onClick, }: {
+    icon?: React.ElementType;
+    label: string;
+    active?: boolean;
+    onClick?: () => void;
+}): react_jsx_runtime.JSX.Element;
+declare function PanelSidebarGroup({ title, children, }: {
+    title?: string;
+    children: React.ReactNode;
+}): react_jsx_runtime.JSX.Element;
+
 type PopoverPlacement = "top" | "bottom" | "left" | "right" | "top-start" | "top-end" | "bottom-start" | "bottom-end";
 interface PopoverProps {
     trigger: React.ReactNode;
@@ -851,6 +924,17 @@ interface CircularProgressProps {
 declare function Progress({ value, max, variant, size, label, showValue, animated, striped, indeterminate, className, }: ProgressProps): react_jsx_runtime.JSX.Element;
 declare function CircularProgress({ value, max, variant, size, strokeWidth, label, showValue, indeterminate, className, }: CircularProgressProps): react_jsx_runtime.JSX.Element;
 
+interface PropRow {
+    prop: string;
+    type: string;
+    default?: string;
+    description: string;
+    required?: boolean;
+}
+declare function PropsTable({ rows }: {
+    rows: PropRow[];
+}): react_jsx_runtime.JSX.Element;
+
 type RadioVariant = "default" | "card" | "button";
 type RadioSize = "sm" | "md" | "lg";
 interface RadioOption {
@@ -883,33 +967,6 @@ interface RepeaterProps<T> {
 }
 declare function Repeater<T>({ items, onAdd, onRemove, renderItem, addButtonText, className, }: RepeaterProps<T>): react_jsx_runtime.JSX.Element;
 
-interface PanelProps {
-    sidebar?: React.ReactNode;
-    sidebarHeader?: React.ReactNode;
-    sidebarFooter?: React.ReactNode;
-    sidebarWidth?: string;
-    topbar?: React.ReactNode;
-    topbarTrailing?: React.ReactNode;
-    defaultCollapsed?: boolean;
-    collapsible?: boolean;
-    showThemeToggle?: boolean;
-    defaultPage?: string;
-    height?: string;
-    children?: React.ReactNode;
-    className?: string;
-}
-declare function Panel({ sidebar, sidebarHeader, sidebarFooter, sidebarWidth, topbar, topbarTrailing, defaultCollapsed, collapsible, showThemeToggle, defaultPage, height, children, className, }: PanelProps): react_jsx_runtime.JSX.Element;
-declare function PanelSidebarItem({ icon: Icon, label, active, onClick, }: {
-    icon?: React.ElementType;
-    label: string;
-    active?: boolean;
-    onClick?: () => void;
-}): react_jsx_runtime.JSX.Element;
-declare function PanelSidebarGroup({ title, children, }: {
-    title?: string;
-    children: React.ReactNode;
-}): react_jsx_runtime.JSX.Element;
-
 interface ResizablePanelsProps {
     children: [React.ReactNode, React.ReactNode];
     orientation?: "horizontal" | "vertical";
@@ -976,6 +1033,38 @@ interface SelectProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChan
 }
 declare function Select({ options, value, onChange, placeholder, searchable, native, label, loadingMessage, noSearchResultsMessage, searchingMessage, multiple, reorderable, disabled, createOptionForm, suffixIcon, suffixIconColor, className, ...props }: SelectProps): react_jsx_runtime.JSX.Element;
 
+type ThemeColors = {
+    primary: string;
+    primaryHover: string;
+    secondary: string;
+    secondaryHover: string;
+    info: string;
+    infoHover: string;
+    warning: string;
+    warningHover: string;
+    danger: string;
+    dangerHover: string;
+};
+
+type SettingsTab = "appearance" | "colors" | "typography";
+interface SettingsProps {
+    /** Initially active tab */
+    defaultTab?: SettingsTab;
+    /** Called when theme (light/dark/system) changes */
+    onThemeChange?: (theme: "light" | "dark" | "system") => void;
+    /** Called when any color token changes */
+    onColorsChange?: (colors: Partial<ThemeColors>) => void;
+    /** Called when font size changes */
+    onFontSizeChange?: (size: string) => void;
+    /** Called when font family changes */
+    onFontFamilyChange?: (family: string) => void;
+    /** Called when the user resets all settings to defaults */
+    onReset?: () => void;
+    /** Additional CSS classes on the root element */
+    className?: string;
+}
+declare function Settings({ defaultTab, onThemeChange, onColorsChange, onFontSizeChange, onFontFamilyChange, onReset, className, }: SettingsProps): react_jsx_runtime.JSX.Element;
+
 declare function Skeleton({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): react_jsx_runtime.JSX.Element;
 
 interface SliderProps {
@@ -1027,6 +1116,7 @@ interface StatCardProps {
 }
 declare function StatCard({ title, value, change, changeLabel, trend, icon, sparkline, description, loading, className, }: StatCardProps): react_jsx_runtime.JSX.Element;
 
+type StepStatus = "complete" | "current" | "upcoming" | "error";
 interface Step {
     label: React.ReactNode;
     description?: React.ReactNode;
@@ -1204,4 +1294,94 @@ interface WidgetProps extends React.HTMLAttributes<HTMLDivElement> {
 }
 declare function Widget({ title, value, previousValue, description, badge, footer, trendLabel, icon, iconColor, trend, trendValue, progress, progressColor, variant, size, loading, animate, pulse, onClick, className, ...props }: WidgetProps): react_jsx_runtime.JSX.Element;
 
-export { Accordion, AvatarStack, Badge, Breadcrumb, Button, Calendar, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, ChartWidget, Checkbox, CircularProgress, ColorPicker, Combobox, CommandPalette, ComposableWidget, ContextMenu, DataGrid, DatePickerPopup, DateRangePicker, Drawer, Dropdown, FileUpload, FlexLayout, GridLayout, GroupNavigation, Input, KanbanBoard, Label, LeftSidebar, Modal, ModalConfirmation, ModalUnchange, ModalWithForms, Navigation, NotificationBanner, NotificationPanel, OtpInput, Pagination, Panel, PanelSidebarGroup, PanelSidebarItem, Popover, Progress, RadioGroup, RangeSlider, Repeater, ResizablePanels, RichTextEditor, RightSidebar, ScrollArea, SectionBlock, Select, Skeleton, Slider, StatCard, StatsWidget, Stepper, Table, TableWidget, Tabs, TagInput, Textarea, Timeline, ToastProvider, ToggleSwitch, Tooltip, Topbar, TreeView, Widget, useToast };
+type WizardVariant = "default" | "minimal" | "cards" | "sidebar" | "dots";
+type WizardLayout = "modal" | "page" | "inline";
+type WizardSize = "sm" | "md" | "lg" | "xl" | "full";
+interface WizardStep {
+    /** Step title shown in the header / sidebar */
+    title: string;
+    /** Optional subtitle / description */
+    description?: string;
+    /** Optional icon rendered in the step indicator */
+    icon?: React.ReactNode;
+    /** Step body content */
+    content: React.ReactNode;
+    /** Mark step as optional */
+    optional?: boolean;
+    /** Prevent advancing past this step until resolved */
+    validate?: () => boolean | string;
+}
+interface WizardActionProps {
+    /** Current step index (0-based) */
+    step: number;
+    /** Total number of steps */
+    total: number;
+    /** Go to previous step */
+    onBack: () => void;
+    /** Go to next step / finish */
+    onNext: () => void;
+    /** Close / cancel the wizard */
+    onClose?: () => void;
+    /** Whether the wizard is on the last step */
+    isLast: boolean;
+    /** Whether the wizard is on the first step */
+    isFirst: boolean;
+    /** Whether the next action is loading */
+    loading?: boolean;
+}
+interface WizardProps {
+    steps: WizardStep[];
+    /** Controlled current step (0-based) */
+    step?: number;
+    /** Initial step when uncontrolled */
+    defaultStep?: number;
+    /** Called when the step changes */
+    onStepChange?: (step: number) => void;
+    /** Called when the wizard finishes (last step → next) */
+    onFinish?: () => void;
+    /** Called when the wizard is closed / cancelled */
+    onClose?: () => void;
+    /** Render mode: modal overlay, full page, or inline block */
+    layout?: WizardLayout;
+    /** Visual design variant */
+    variant?: WizardVariant;
+    /** Size of the wizard panel */
+    size?: WizardSize;
+    /** Controls modal visibility (required when layout="modal") */
+    isOpen?: boolean;
+    /** Show the × close button in modal mode */
+    showClose?: boolean;
+    /** Prevent closing by clicking the backdrop */
+    unchange?: boolean;
+    /** Override the wizard title shown in the header */
+    title?: React.ReactNode;
+    /** Subtitle shown below the title */
+    description?: React.ReactNode;
+    /** Hide the step indicator header entirely */
+    hideHeader?: boolean;
+    /** Fully replace the footer with custom content */
+    footer?: React.ReactNode;
+    /** Replace only the action buttons with a render-prop */
+    renderActions?: (props: WizardActionProps) => React.ReactNode;
+    /** Label for the Back button */
+    backLabel?: React.ReactNode;
+    /** Label for the Next button */
+    nextLabel?: React.ReactNode;
+    /** Label for the Finish button (last step) */
+    finishLabel?: React.ReactNode;
+    /** Label for the Cancel button */
+    cancelLabel?: React.ReactNode;
+    /** Show a Cancel button in the footer */
+    showCancel?: boolean;
+    /** Show the Back button on the first step */
+    showBackOnFirst?: boolean;
+    /** Whether the next/finish action is in a loading state */
+    loading?: boolean;
+    /** Allow clicking step indicators to jump to any visited step */
+    clickableSteps?: boolean;
+    className?: string;
+    contentClassName?: string;
+}
+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, Calendar, type CalendarEvent, type CalendarProps, Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle, type ChartDataPoint, ChartWidget, type ChartWidgetProps, Checkbox, type CheckboxProps, CircularProgress, type CircularProgressProps, 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, type FileTypeValidation, FileUpload, type FileUploadProps, type FlexAlign, type FlexDirection, type FlexGap, FlexItem, type FlexItemProps, type FlexJustify, FlexLayout, type FlexLayoutProps, type FlexWrap, 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, LeftSidebar, type LeftSidebarProps, 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, 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, ScrollArea, type ScrollAreaProps, SectionBlock, type SectionProps, type SectionVariant, Select, type SelectOption, type SelectProps, type SemanticColor, Settings, type SettingsProps, type SettingsTab, 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, 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, useToast };