@nar-bus/lena-ui-shared 1.0.0

package/dist/index.d.ts

@@ -0,0 +1,2935 @@
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { ClassProp } from 'class-variance-authority/types';
+import { ClassValue } from 'clsx';
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
+import { Column } from '@tanstack/react-table';
+import { ColumnDef } from '@tanstack/react-table';
+import { Command as Command_2 } from 'cmdk';
+import { Component } from 'react';
+import * as ContextMenuPrimitive from '@radix-ui/react-context-menu';
+import { Control } from 'react-hook-form';
+import { DayPicker } from 'react-day-picker';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
+import { FieldPath } from 'react-hook-form';
+import { FieldValues } from 'react-hook-form';
+import { Group } from 'react-resizable-panels';
+import { JSX } from 'react/jsx-runtime';
+import * as LabelPrimitive from '@radix-ui/react-label';
+import { LucideIcon } from 'lucide-react';
+import { NamedExoticComponent } from 'react';
+import { Panel } from 'react-resizable-panels';
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as ProgressPrimitive from '@radix-ui/react-progress';
+import { QueryKey } from '@tanstack/react-query';
+import * as RadioGroupPrimitive from '@radix-ui/react-radio-group';
+import * as React_2 from 'react';
+import { ReactNode } from 'react';
+import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area';
+import * as SelectPrimitive from '@radix-ui/react-select';
+import { Separator as Separator_2 } from 'react-resizable-panels';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+import * as SliderPrimitive from '@radix-ui/react-slider';
+import { StoreApi } from 'zustand';
+import * as SwitchPrimitive from '@radix-ui/react-switch';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import { ToasterProps } from 'sonner';
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import * as TogglePrimitive from '@radix-ui/react-toggle';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+import { UseBoundStore } from 'zustand';
+import { VariantProps } from 'class-variance-authority';
+import { z } from 'zod';
+
+export declare function Accordion({ ...props }: React_2.ComponentProps<typeof AccordionPrimitive.Root>): JSX.Element;
+
+export declare function AccordionContent({ className, children, ...props }: React_2.ComponentProps<typeof AccordionPrimitive.Content>): JSX.Element;
+
+export declare function AccordionItem({ className, ...props }: React_2.ComponentProps<typeof AccordionPrimitive.Item>): JSX.Element;
+
+export declare function AccordionTrigger({ className, children, ...props }: React_2.ComponentProps<typeof AccordionPrimitive.Trigger>): JSX.Element;
+
+export declare function AdvancedJsonEditor({ value, onChange, onSave, title, icon: Icon, defaultOpen, maxViewHeight, rows, placeholder, defaultMode, allowModeSwitch, schema, editable, disabled, disabledReason, isSaving, showLineNumbers, showValidation, showStats, }: AdvancedJsonEditorProps): JSX.Element;
+
+export declare interface AdvancedJsonEditorProps {
+    value: string;
+    onChange?: (value: string) => void;
+    onSave?: (value: string) => void;
+    title?: string;
+    icon?: LucideIcon;
+    defaultOpen?: boolean;
+    maxViewHeight?: number;
+    rows?: number;
+    placeholder?: string;
+    defaultMode?: EditorMode;
+    allowModeSwitch?: boolean;
+    schema?: z.ZodType<unknown>;
+    editable?: boolean;
+    disabled?: boolean;
+    disabledReason?: string;
+    isSaving?: boolean;
+    showLineNumbers?: boolean;
+    showValidation?: boolean;
+    showStats?: boolean;
+}
+
+export declare function Alert({ className, variant, ...props }: React_2.ComponentProps<"div"> & VariantProps<typeof alertVariants>): JSX.Element;
+
+export declare function AlertDescription({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function AlertDialog({ ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Root>): JSX.Element;
+
+export declare function AlertDialogAction({ className, variant, size, ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Action> & Pick<React_2.ComponentProps<typeof Button>, "variant" | "size">): JSX.Element;
+
+export declare function AlertDialogCancel({ className, variant, size, ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Cancel> & Pick<React_2.ComponentProps<typeof Button>, "variant" | "size">): JSX.Element;
+
+export declare function AlertDialogContent({ className, size, ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Content> & {
+    size?: "default" | "sm";
+}): JSX.Element;
+
+export declare function AlertDialogDescription({ className, ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Description>): JSX.Element;
+
+export declare function AlertDialogFooter({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function AlertDialogHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function AlertDialogTitle({ className, ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Title>): JSX.Element;
+
+export declare function AlertDialogTrigger({ ...props }: React_2.ComponentProps<typeof AlertDialogPrimitive.Trigger>): JSX.Element;
+
+export declare function AlertTitle({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+declare const alertVariants: (props?: ({
+    variant?: "default" | "destructive" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+export declare interface ApiResponse<T> {
+    status: number;
+    success: boolean;
+    message: string;
+    data: T;
+    meta: MetaInfo;
+}
+
+export declare function AppHeader({ breadcrumbs, theme, onThemeChange, user, isAuthenticated, onLogout, onLogin, homeHref, className, }: AppHeaderProps): JSX.Element;
+
+export declare interface AppHeaderProps {
+    breadcrumbs: BreadcrumbItem[];
+    theme: 'light' | 'dark' | 'system';
+    onThemeChange: (theme: 'light' | 'dark' | 'system') => void;
+    user?: AppHeaderUser | null;
+    isAuthenticated?: boolean;
+    onLogout: () => void;
+    onLogin?: () => void;
+    homeHref?: string;
+    className?: string;
+}
+
+export declare interface AppHeaderUser {
+    firstName?: string;
+    lastName?: string;
+    email?: string;
+}
+
+export declare function AppSidebar({ items, collapsed, onToggleCollapse, logo, version, }: AppSidebarProps): JSX.Element;
+
+export declare interface AppSidebarProps {
+    items: SidebarNavItem[];
+    collapsed: boolean;
+    onToggleCollapse: () => void;
+    logo?: {
+        title: string;
+        subtitle?: string;
+        letter?: string;
+    };
+    version?: string;
+}
+
+/**
+ * Operators that use the `values` array instead of single `value`
+ */
+export declare const ARRAY_OPERATORS: FilterOperator[];
+
+export declare function AsyncSelectField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, searchPlaceholder, emptyText, loadingText, loadOptions, debounceMs, disabled, className, cols, }: AsyncSelectFieldProps<TFieldValues>): JSX.Element;
+
+declare interface AsyncSelectFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    loadingText?: string;
+    loadOptions: (search: string) => Promise<SelectOption[]>;
+    debounceMs?: number;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+}
+
+export declare function Avatar({ className, size, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Root> & {
+    size?: "default" | "sm" | "lg";
+}): JSX.Element;
+
+export declare function AvatarFallback({ className, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Fallback>): JSX.Element;
+
+export declare function AvatarImage({ className, ...props }: React_2.ComponentProps<typeof AvatarPrimitive.Image>): JSX.Element;
+
+export declare function Badge({ className, variant, asChild, ...props }: React_2.ComponentProps<"span"> & VariantProps<typeof badgeVariants> & {
+    asChild?: boolean;
+}): JSX.Element;
+
+/**
+ * Simple badge cell for displaying values like port numbers or version numbers.
+ * Use StatusBadge for colored enum/status values instead.
+ */
+export declare function BadgeCell({ value, variant, className, }: BadgeCellProps): JSX.Element;
+
+declare interface BadgeCellProps {
+    value: string | number | null | undefined;
+    variant?: 'default' | 'accent';
+    className?: string;
+}
+
+export declare const badgeVariants: (props?: ({
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+/**
+ * Boolean cell for displaying true/false values.
+ * Shows check/X icons with consistent styling.
+ */
+export declare function BooleanCell({ value, trueIcon, falseIcon, trueLabel, falseLabel, showLabel, className, }: BooleanCellProps): JSX.Element;
+
+declare interface BooleanCellProps {
+    value: boolean | null | undefined;
+    trueIcon?: React.ReactNode;
+    falseIcon?: React.ReactNode;
+    trueLabel?: string;
+    falseLabel?: string;
+    showLabel?: boolean;
+    className?: string;
+}
+
+export declare const booleanColors: {
+    readonly true: "bg-status-success/10 text-status-success-foreground border-status-success/30";
+    readonly false: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+};
+
+export declare function Breadcrumb({ ...props }: React_2.ComponentProps<"nav">): JSX.Element;
+
+export declare function BreadcrumbEllipsis({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare interface BreadcrumbItem {
+    label: string;
+    href?: string;
+}
+
+export declare function BreadcrumbLink({ asChild, className, ...props }: React_2.ComponentProps<"a"> & {
+    asChild?: boolean;
+}): JSX.Element;
+
+export declare function BreadcrumbList({ className, ...props }: React_2.ComponentProps<"ol">): JSX.Element;
+
+export declare function BreadcrumbPage({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare function BreadcrumbSeparator({ children, className, ...props }: React_2.ComponentProps<"li">): JSX.Element;
+
+export declare function BreadcrumbUIItem({ className, ...props }: React_2.ComponentProps<"li">): JSX.Element;
+
+export declare interface BulkAction<TData> {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    variant?: 'default' | 'primary' | 'destructive';
+    onClick: (rows: TData[]) => void | Promise<void>;
+    disabled?: boolean | ((rows: TData[]) => boolean);
+    confirm?: {
+        title: string;
+        description: string;
+        confirmLabel?: string;
+    };
+}
+
+export declare function BulkActionBar({ selectedCount, onClearSelection, actions, moreActions, itemLabel, cancelLabel, cancelHint, className, }: BulkActionBarProps): JSX.Element | null;
+
+export declare interface BulkActionBarProps {
+    selectedCount: number;
+    onClearSelection: () => void;
+    actions?: BulkActionItem[];
+    moreActions?: BulkActionItem[];
+    itemLabel?: (count: number) => string;
+    cancelLabel?: string;
+    cancelHint?: string;
+    className?: string;
+}
+
+export declare interface BulkActionItem {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    onClick: () => void;
+    variant?: 'default' | 'primary' | 'destructive';
+    separator?: boolean;
+}
+
+export declare function Button({ className, variant, size, asChild, ...props }: React_2.ComponentProps<"button"> & VariantProps<typeof buttonVariants> & {
+    asChild?: boolean;
+}): JSX.Element;
+
+declare type ButtonProps = React.ComponentProps<typeof Button> & VariantProps<typeof buttonVariants>;
+
+export declare const buttonVariants: (props?: ({
+    variant?: "link" | "default" | "destructive" | "outline" | "secondary" | "ghost" | null | undefined;
+    size?: "default" | "xs" | "sm" | "lg" | "icon" | "icon-xs" | "icon-sm" | "icon-lg" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+export declare function Calendar({ className, classNames, showOutsideDays, captionLayout, buttonVariant, formatters, components, ...props }: React_2.ComponentProps<typeof DayPicker> & {
+    buttonVariant?: React_2.ComponentProps<typeof Button>["variant"];
+}): JSX.Element;
+
+export declare function Card({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardAction({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardContent({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardDescription({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardFooter({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function CardTitle({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function Checkbox({ className, ...props }: React_2.ComponentProps<typeof CheckboxPrimitive.Root>): JSX.Element;
+
+export declare function CheckboxField<TFieldValues extends FieldValues>({ name, control, label, description, disabled, className, cols, }: CheckboxFieldProps<TFieldValues>): JSX.Element;
+
+declare interface CheckboxFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+}
+
+export declare function CircularGauge({ value, max, target, title, icon, size, strokeWidth, footerStats, formatValue, getStatus, targetLabel, onTargetLabel, belowTargetLabel, className, animationDelay, }: CircularGaugeProps): JSX.Element;
+
+export declare interface CircularGaugeProps {
+    value: number;
+    max?: number;
+    target?: number;
+    title?: string;
+    icon?: ReactNode;
+    size?: number;
+    strokeWidth?: number;
+    footerStats?: GaugeFooterStat[];
+    formatValue?: (value: number) => string;
+    getStatus?: (value: number, target?: number) => 'excellent' | 'good' | 'warning' | 'critical';
+    targetLabel?: string;
+    onTargetLabel?: string;
+    belowTargetLabel?: (diff: number) => string;
+    className?: string;
+    animationDelay?: number;
+}
+
+export declare function cn(...inputs: ClassValue[]): string;
+
+export declare function Collapsible({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.Root>): JSX.Element;
+
+export declare function CollapsibleContent({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleContent>): JSX.Element;
+
+export declare function CollapsibleSection({ title, icon: Icon, children, status, defaultOpen, itemCount, editable, isEditing, isSaving, onEdit, onSave, onCancel, }: CollapsibleSectionProps): JSX.Element;
+
+declare interface CollapsibleSectionProps {
+    title: string;
+    icon: LucideIcon;
+    children: React.ReactNode;
+    defaultOpen?: boolean;
+    itemCount?: number;
+    status?: 'online' | 'offline';
+    editable?: boolean;
+    isEditing?: boolean;
+    isSaving?: boolean;
+    onEdit?: () => void;
+    onSave?: () => void;
+    onCancel?: () => void;
+}
+
+export declare function CollapsibleTrigger({ ...props }: React.ComponentProps<typeof CollapsiblePrimitive.CollapsibleTrigger>): JSX.Element;
+
+export declare function ComboboxField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, searchPlaceholder, emptyText, options, disabled, className, cols, errorHint, }: ComboboxFieldProps<TFieldValues>): JSX.Element;
+
+declare interface ComboboxFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    options: SelectOption[];
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+}
+
+export declare function Command({ className, ...props }: React_2.ComponentProps<typeof Command_2>): JSX.Element;
+
+export declare function CommandDialog({ title, description, children, className, showCloseButton, ...props }: React_2.ComponentProps<typeof Dialog> & {
+    title?: string;
+    description?: string;
+    className?: string;
+    showCloseButton?: boolean;
+}): JSX.Element;
+
+export declare function CommandEmpty({ ...props }: React_2.ComponentProps<typeof Command_2.Empty>): JSX.Element;
+
+export declare function CommandGroup({ className, ...props }: React_2.ComponentProps<typeof Command_2.Group>): JSX.Element;
+
+export declare function CommandInput({ className, ...props }: React_2.ComponentProps<typeof Command_2.Input>): JSX.Element;
+
+export declare function CommandItem({ className, ...props }: React_2.ComponentProps<typeof Command_2.Item>): JSX.Element;
+
+export declare function CommandList({ className, ...props }: React_2.ComponentProps<typeof Command_2.List>): JSX.Element;
+
+export declare function CommandSeparator({ className, ...props }: React_2.ComponentProps<typeof Command_2.Separator>): JSX.Element;
+
+export declare function CommandShortcut({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare interface CommonLabels {
+    actions: string;
+    edit: string;
+    delete: string;
+    create: string;
+    save: string;
+    cancel: string;
+    close: string;
+    confirm: string;
+    back: string;
+    next: string;
+    loading: string;
+    noData: string;
+    refresh: string;
+    search: string;
+    yes: string;
+    no: string;
+    active: string;
+    inactive: string;
+    enabled: string;
+    disabled: string;
+}
+
+export declare function ContextMenu({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Root>): JSX.Element;
+
+export declare function ContextMenuCheckboxItem({ className, children, checked, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.CheckboxItem>): JSX.Element;
+
+export declare function ContextMenuContent({ className, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Content>): JSX.Element;
+
+export declare function ContextMenuGroup({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Group>): JSX.Element;
+
+export declare function ContextMenuItem({ className, inset, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Item> & {
+    inset?: boolean;
+}): JSX.Element;
+
+export declare function ContextMenuLabel({ className, inset, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Label> & {
+    inset?: boolean;
+}): JSX.Element;
+
+export declare function ContextMenuPortal({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Portal>): JSX.Element;
+
+export declare function ContextMenuRadioGroup({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.RadioGroup>): JSX.Element;
+
+export declare function ContextMenuRadioItem({ className, children, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.RadioItem>): JSX.Element;
+
+export declare function ContextMenuSeparator({ className, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Separator>): JSX.Element;
+
+export declare function ContextMenuShortcut({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare function ContextMenuSub({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Sub>): JSX.Element;
+
+export declare function ContextMenuSubContent({ className, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.SubContent>): JSX.Element;
+
+export declare function ContextMenuSubTrigger({ className, inset, children, ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): JSX.Element;
+
+export declare function ContextMenuTrigger({ ...props }: React_2.ComponentProps<typeof ContextMenuPrimitive.Trigger>): JSX.Element;
+
+/**
+ * Convert UI FilterState array to backend-compatible SearchCriteria array
+ * Handles the value/values field distinction based on operator
+ * @param filters - Array of filter states from UI
+ * @param fieldConfigs - Optional field configurations to determine field types
+ */
+export declare function convertFiltersToSearchCriteria(filters: FilterState[], fieldConfigs?: FieldConfig[]): SearchCriteria[];
+
+/**
+ * Copyable text cell for table columns.
+ * Shows copy button on hover and provides feedback.
+ *
+ * Ideal for: ICCID, IP addresses, serial numbers, etc.
+ */
+export declare function CopyableCell({ value, truncate, maxWidth, className, successMessage, }: CopyableCellProps): JSX.Element;
+
+declare interface CopyableCellProps {
+    value: string | null | undefined;
+    truncate?: boolean;
+    maxWidth?: string;
+    className?: string;
+    successMessage?: string;
+}
+
+export declare function CopyButton({ value }: CopyButtonProps): JSX.Element;
+
+/**
+ * Copy Button - Click to copy value to clipboard
+ */
+declare interface CopyButtonProps {
+    value: string;
+}
+
+export declare function createDataTableStore(options?: CreateDataTableStoreOptions): UseBoundStore<Omit<StoreApi<DataTableStore>, "setState"> & {
+setState(nextStateOrUpdater: DataTableStore | Partial<DataTableStore> | ((state: {
+generalSearch: string;
+filters: {
+id: string;
+field: string;
+operator: FilterOperator;
+value?: string | number | boolean | null | undefined;
+values?: (string | number | boolean)[] | undefined;
+enabled: boolean;
+}[];
+page: number;
+size: number;
+sortBy: string;
+sortDirection: "ASC" | "DESC";
+rowSelection: {
+[x: string]: boolean;
+};
+setGeneralSearch: (value: string) => void;
+addFilter: (filter: Omit<FilterState, "id" | "enabled">) => void;
+updateFilter: (id: string, updates: Partial<FilterState>) => void;
+removeFilter: (id: string) => void;
+toggleFilter: (id: string) => void;
+clearFilters: () => void;
+applyQuickFilter: (quickFilter: QuickFilter) => void;
+setFilters: (filters: FilterState[]) => void;
+setPage: (page: number) => void;
+setSize: (size: number) => void;
+setSort: (sortBy: string, sortDirection: "ASC" | "DESC") => void;
+toggleSort: (field: string) => void;
+setRowSelection: (selection: Record<string, boolean>) => void;
+toggleRowSelection: (rowId: string) => void;
+selectAll: (rowIds: string[]) => void;
+clearSelection: () => void;
+reset: () => void;
+hydrateFromUrl: (urlState: UrlState) => void;
+getSearchRequest: () => SearchRequest;
+getActiveFilterCount: () => number;
+getSelectedRowIds: () => string[];
+}) => void), shouldReplace?: false): void;
+setState(nextStateOrUpdater: DataTableStore | ((state: {
+generalSearch: string;
+filters: {
+id: string;
+field: string;
+operator: FilterOperator;
+value?: string | number | boolean | null | undefined;
+values?: (string | number | boolean)[] | undefined;
+enabled: boolean;
+}[];
+page: number;
+size: number;
+sortBy: string;
+sortDirection: "ASC" | "DESC";
+rowSelection: {
+[x: string]: boolean;
+};
+setGeneralSearch: (value: string) => void;
+addFilter: (filter: Omit<FilterState, "id" | "enabled">) => void;
+updateFilter: (id: string, updates: Partial<FilterState>) => void;
+removeFilter: (id: string) => void;
+toggleFilter: (id: string) => void;
+clearFilters: () => void;
+applyQuickFilter: (quickFilter: QuickFilter) => void;
+setFilters: (filters: FilterState[]) => void;
+setPage: (page: number) => void;
+setSize: (size: number) => void;
+setSort: (sortBy: string, sortDirection: "ASC" | "DESC") => void;
+toggleSort: (field: string) => void;
+setRowSelection: (selection: Record<string, boolean>) => void;
+toggleRowSelection: (rowId: string) => void;
+selectAll: (rowIds: string[]) => void;
+clearSelection: () => void;
+reset: () => void;
+hydrateFromUrl: (urlState: UrlState) => void;
+getSearchRequest: () => SearchRequest;
+getActiveFilterCount: () => number;
+getSelectedRowIds: () => string[];
+}) => void), shouldReplace: true): void;
+}>;
+
+export declare interface CreateDataTableStoreOptions {
+    defaultSize?: number;
+    defaultSortBy?: string;
+    defaultSortDirection?: 'ASC' | 'DESC';
+}
+
+/**
+ * Create a new empty filter with defaults
+ */
+export declare function createEmptyFilter(field: string, operator?: FilterState['operator']): Omit<FilterState, 'id'>;
+
+export declare function CRUDTabContent<T extends {
+    id: number;
+}>({ isActive, columns, fieldConfig, defaultSortBy, getRowId, allQueryKey, detailKey, listKey, fetchDetail, fetchList, useSearchHook, deleteItem, isDeleting, detailPath, searchPlaceholder, emptyTitle, emptyDescription, entityType, getEntityName, viewLabel, deleteLabel, refreshLabel, createLabel, CreateSheetComponent, hideToolbar, externalCreateSheetOpen, onExternalCreateSheetOpenChange, }: CRUDTabContentProps<T>): JSX.Element;
+
+export declare interface CRUDTabContentProps<T extends {
+    id: number;
+}> {
+    /** Whether this tab is currently active */
+    isActive: boolean;
+    /** Table column definitions */
+    columns: ColumnDef<T, unknown>[];
+    /** Field configuration for filtering */
+    fieldConfig: FieldConfig[];
+    /** Default sort field */
+    defaultSortBy: string;
+    /** Row ID accessor */
+    getRowId?: (row: T) => string;
+    /** Query key for invalidation */
+    allQueryKey: readonly string[];
+    /** Detail query key factory */
+    detailKey: (id: number) => readonly unknown[];
+    /** List query key factory */
+    listKey: (params: SearchRequest) => readonly unknown[];
+    /** Fetch detail function for prefetch */
+    fetchDetail: (id: number) => Promise<T>;
+    /** Fetch list function for prefetch */
+    fetchList: (params: SearchRequest) => Promise<PagedResponse<T>>;
+    /** Search hook factory */
+    useSearchHook: (params: SearchRequest, enabled: boolean) => {
+        data: PagedResponse<T> | undefined;
+        isLoading: boolean;
+        error: Error | null;
+        refetch: () => void;
+    };
+    /** Delete mutation handler */
+    deleteItem: (id: number, options: {
+        onSuccess: () => void;
+    }) => void;
+    /** Whether delete is in progress */
+    isDeleting: boolean;
+    /** Route path for detail page */
+    detailPath: string;
+    /** Search placeholder text */
+    searchPlaceholder: string;
+    /** Empty state title */
+    emptyTitle: string;
+    /** Empty state description */
+    emptyDescription: string;
+    /** Entity type name (for delete dialog) */
+    entityType: string;
+    /** Get display name from entity (for delete dialog) */
+    getEntityName: (item: T) => string;
+    /** View action label */
+    viewLabel?: string;
+    /** Delete action label */
+    deleteLabel?: string;
+    /** Refresh button label */
+    refreshLabel?: string;
+    /** Create button label */
+    createLabel?: string;
+    /** Create sheet component */
+    CreateSheetComponent: React.ComponentType<{
+        open: boolean;
+        onOpenChange: (open: boolean) => void;
+    }>;
+    /** Hide internal toolbar (for external toolbar control) */
+    hideToolbar?: boolean;
+    /** External create sheet open state */
+    externalCreateSheetOpen?: boolean;
+    /** External create sheet open change handler */
+    onExternalCreateSheetOpenChange?: (open: boolean) => void;
+}
+
+export declare function DataTable<TData>({ columns, getRowId, data, isLoading, error, pagination, onPageChange, onPageSizeChange, onPrefetchPage, pageSizeOptions, sortBy, sortDirection, onSortChange, searchValue, onSearchChange, searchPlaceholder, searchDebounceMs, fieldConfig, filters, onFiltersChange, enableRowSelection, rowSelection, onRowSelectionChange, bulkActions, rowActions, toolbarStart, toolbarEnd, className, emptyIcon, emptyTitle, emptyDescription, onRowClick, onRowHover, rowClassName, meta, }: DataTableComponentProps<TData>): JSX.Element;
+
+declare interface DataTableActions {
+    setGeneralSearch: (value: string) => void;
+    addFilter: (filter: Omit<FilterState, 'id' | 'enabled'>) => void;
+    updateFilter: (id: string, updates: Partial<FilterState>) => void;
+    removeFilter: (id: string) => void;
+    toggleFilter: (id: string) => void;
+    clearFilters: () => void;
+    applyQuickFilter: (quickFilter: QuickFilter) => void;
+    setFilters: (filters: FilterState[]) => void;
+    setPage: (page: number) => void;
+    setSize: (size: number) => void;
+    setSort: (sortBy: string, sortDirection: 'ASC' | 'DESC') => void;
+    toggleSort: (field: string) => void;
+    setRowSelection: (selection: Record<string, boolean>) => void;
+    toggleRowSelection: (rowId: string) => void;
+    selectAll: (rowIds: string[]) => void;
+    clearSelection: () => void;
+    reset: () => void;
+    hydrateFromUrl: (urlState: UrlState) => void;
+    getSearchRequest: () => SearchRequest;
+    getActiveFilterCount: () => number;
+    getSelectedRowIds: () => string[];
+}
+
+/** Actions props */
+export declare interface DataTableActionsProps<TData> {
+    bulkActions?: BulkAction<TData>[];
+    rowActions?: RowAction<TData>[];
+}
+
+export declare function DataTableColumnHeader<TData, TValue>({ column, title, sortable, className, }: DataTableColumnHeaderProps<TData, TValue>): JSX.Element;
+
+declare interface DataTableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {
+    column: Column<TData, TValue>;
+    title: string;
+    sortable?: boolean;
+}
+
+declare interface DataTableComponentProps<TData> {
+    columns: ColumnDef<TData, unknown>[];
+    getRowId: (row: TData) => string;
+    data: TData[];
+    isLoading?: boolean;
+    error?: Error | null;
+    pagination: PaginationInfo;
+    onPageChange: (page: number) => void;
+    onPageSizeChange: (size: number) => void;
+    onPrefetchPage?: (page: number) => void;
+    pageSizeOptions?: number[];
+    sortBy: string;
+    sortDirection: 'ASC' | 'DESC';
+    onSortChange: (sortBy: string, sortDirection: 'ASC' | 'DESC') => void;
+    searchValue?: string;
+    onSearchChange?: (value: string) => void;
+    searchPlaceholder?: string;
+    searchDebounceMs?: number;
+    fieldConfig?: FieldConfig[];
+    filters?: FilterState[];
+    onFiltersChange?: (filters: FilterState[]) => void;
+    enableRowSelection?: boolean | ((row: TData) => boolean);
+    rowSelection?: Record<string, boolean>;
+    onRowSelectionChange?: (selection: Record<string, boolean>) => void;
+    bulkActions?: BulkAction<TData>[];
+    rowActions?: RowAction<TData>[];
+    toolbarStart?: React.ReactNode;
+    toolbarEnd?: React.ReactNode;
+    className?: string;
+    emptyIcon?: React.ReactNode;
+    emptyTitle?: string;
+    emptyDescription?: string;
+    onRowClick?: (row: TData) => void;
+    onRowHover?: (row: TData) => void;
+    rowClassName?: (row: TData) => string;
+    meta?: Record<string, unknown>;
+}
+
+/** Customization props */
+export declare interface DataTableCustomizationProps<TData> {
+    className?: string;
+    emptyIcon?: ReactNode;
+    emptyTitle?: string;
+    emptyDescription?: string;
+    onRowClick?: (row: TData) => void;
+    rowClassName?: (row: TData) => string;
+}
+
+/** Data props for the table */
+export declare interface DataTableDataProps<TData> {
+    data: TData[];
+    isLoading?: boolean;
+    error?: Error | null;
+    getRowId: (row: TData) => string;
+}
+
+/** Filter props */
+export declare interface DataTableFilterProps {
+    fieldConfig: FieldConfig[];
+    filters: FilterState[];
+    onFiltersChange: (filters: FilterState[]) => void;
+    quickFilters?: QuickFilter[];
+}
+
+export declare interface DataTableLabels {
+    show: string;
+    entries: string;
+    showing: string;
+    to: string;
+    of: string;
+    results: string;
+    noResults: string;
+    page: string;
+    emptyTitle: string;
+    emptyDescription: string;
+    searchPlaceholder: string;
+    filter: string;
+    clear: string;
+    apply: string;
+    operators: Record<string, string>;
+}
+
+/** Pagination props */
+export declare interface DataTablePaginationProps {
+    pagination: PaginationInfo;
+    onPageChange: (page: number) => void;
+    onPageSizeChange: (size: number) => void;
+    pageSizeOptions?: number[];
+}
+
+export declare interface DataTableProps<TData> extends DataTableDataProps<TData>, DataTablePaginationProps, DataTableSortingProps, DataTableSearchProps, DataTableFilterProps, DataTableSelectionProps<TData>, DataTableActionsProps<TData>, DataTableToolbarProps, DataTableCustomizationProps<TData> {
+    /** Column definitions for TanStack Table */
+    columns: ColumnDef<TData, unknown>[];
+}
+
+/** Search props */
+export declare interface DataTableSearchProps {
+    searchValue: string;
+    onSearchChange: (value: string) => void;
+    searchPlaceholder?: string;
+    searchDebounceMs?: number;
+}
+
+/** Selection props */
+export declare interface DataTableSelectionProps<TData> {
+    enableRowSelection?: boolean | ((row: TData) => boolean);
+    rowSelection: Record<string, boolean>;
+    onRowSelectionChange: (selection: Record<string, boolean>) => void;
+}
+
+/** Sorting props */
+export declare interface DataTableSortingProps {
+    sortBy: string;
+    sortDirection: 'ASC' | 'DESC';
+    onSortChange: (sortBy: string, sortDirection: 'ASC' | 'DESC') => void;
+}
+
+export declare interface DataTableState {
+    generalSearch: string;
+    filters: FilterState[];
+    page: number;
+    size: number;
+    sortBy: string;
+    sortDirection: 'ASC' | 'DESC';
+    rowSelection: Record<string, boolean>;
+}
+
+export declare type DataTableStore = DataTableState & DataTableActions;
+
+export declare type DataTableStoreApi = ReturnType<typeof createDataTableStore>;
+
+/** Toolbar props */
+export declare interface DataTableToolbarProps {
+    toolbarStart?: ReactNode;
+    toolbarEnd?: ReactNode;
+}
+
+/**
+ * Date cell for table columns.
+ * Formats dates consistently across the application.
+ */
+export declare function DateCell({ value, format, className, showTooltip, }: DateCellProps): JSX.Element;
+
+declare interface DateCellProps {
+    value: DateInput;
+    format?: 'date' | 'datetime' | 'relative';
+    className?: string;
+    showTooltip?: boolean;
+}
+
+export declare function DateField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, minDate, maxDate, disabledDates, dateFormat, disabled, className, cols, clearable, errorHint, }: DateFieldProps<TFieldValues>): JSX.Element;
+
+declare interface DateFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    minDate?: Date;
+    maxDate?: Date;
+    disabledDates?: Date[];
+    dateFormat?: string;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    clearable?: boolean;
+    errorHint?: string;
+}
+
+declare type DateInput = number | string | Date | null | undefined;
+
+declare type DateInput_2 = number | string | Date | null | undefined;
+
+/**
+ * Shared date formatting utilities for detail pages and table cells
+ */
+declare type DateInput_3 = number | string | Date | null | undefined;
+
+export declare function DateRangeField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, minDate, maxDate, dateFormat, disabled, className, cols, clearable, errorHint, }: DateRangeFieldProps<TFieldValues>): JSX.Element;
+
+declare interface DateRangeFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    minDate?: Date;
+    maxDate?: Date;
+    dateFormat?: string;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    clearable?: boolean;
+    errorHint?: string;
+}
+
+/**
+ * Convert date string (YYYY-MM-DD) to Unix timestamp (milliseconds)
+ * @param dateStr - Date string in YYYY-MM-DD format
+ * @param endOfDay - If true, sets time to 23:59:59.999; otherwise 00:00:00.000
+ * @returns Unix timestamp in milliseconds
+ */
+export declare function dateStringToTimestamp(dateStr: string, endOfDay?: boolean): number;
+
+/**
+ * Default pagination options
+ */
+export declare const DEFAULT_PAGE_SIZE_OPTIONS: number[];
+
+/**
+ * Default values
+ */
+export declare const DEFAULTS: {
+    PAGE_SIZE: number;
+    PAGE: number;
+    SORT_BY: string;
+    SORT_DIRECTION: "ASC";
+    SEARCH_DEBOUNCE_MS: number;
+};
+
+export declare const defaultSearchRequest: SearchRequest;
+
+export declare interface DeleteDialogLabels {
+    title: string;
+    description: string;
+    cancel: string;
+    confirm: string;
+    deleting: string;
+}
+
+export declare function DetailPageMetadataFooter({ id, createdBy, updatedBy, rightContent, className, }: DetailPageMetadataFooterProps): JSX.Element;
+
+/**
+ * Detail Page Metadata Footer
+ * Displays entity ID and audit information (created/updated by or timestamps)
+ */
+declare interface DetailPageMetadataFooterProps {
+    /** Entity ID to display */
+    id: number | string;
+    /** User who created the entity */
+    createdBy?: string | null;
+    /** User who last updated the entity */
+    updatedBy?: string | null;
+    /** Custom right-side content (overrides createdBy/updatedBy) */
+    rightContent?: React.ReactNode;
+    /** Additional class names */
+    className?: string;
+}
+
+export declare const deviceStatusColors: {
+    readonly ACTIVE: "bg-status-success/10 text-status-success-foreground border-status-success/30";
+    readonly INACTIVE: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+    readonly MAINTENANCE: "bg-status-warning/10 text-status-warning border-status-warning/30";
+    readonly FAULTY: "bg-status-error/10 text-status-error border-status-error/30";
+    readonly ONLINE: "bg-status-success/10 text-status-success-foreground border-status-success/30";
+    readonly OFFLINE: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+    readonly PENDING: "bg-status-warning/10 text-status-warning border-status-warning/30";
+    readonly CONNECTED: "bg-status-success/10 text-status-success-foreground border-status-success/30";
+    readonly DISCONNECTED: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+};
+
+export declare function Dialog({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Root>): JSX.Element;
+
+export declare function DialogClose({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Close>): JSX.Element;
+
+export declare function DialogContent({ className, children, showCloseButton, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Content> & {
+    showCloseButton?: boolean;
+}): JSX.Element;
+
+export declare function DialogDescription({ className, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Description>): JSX.Element;
+
+export declare function DialogFooter({ className, showCloseButton, children, ...props }: React_2.ComponentProps<"div"> & {
+    showCloseButton?: boolean;
+}): JSX.Element;
+
+export declare function DialogHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function DialogTitle({ className, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Title>): JSX.Element;
+
+export declare function DialogTrigger({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Trigger>): JSX.Element;
+
+export declare function DropdownMenu({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Root>): JSX.Element;
+
+export declare function DropdownMenuCheckboxItem({ className, children, checked, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.CheckboxItem>): JSX.Element;
+
+export declare function DropdownMenuContent({ className, sideOffset, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Content>): JSX.Element;
+
+export declare function DropdownMenuGroup({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Group>): JSX.Element;
+
+export declare function DropdownMenuItem({ className, inset, variant, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Item> & {
+    inset?: boolean;
+    variant?: "default" | "destructive";
+}): JSX.Element;
+
+export declare function DropdownMenuLabel({ className, inset, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Label> & {
+    inset?: boolean;
+}): JSX.Element;
+
+export declare function DropdownMenuPortal({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Portal>): JSX.Element;
+
+export declare function DropdownMenuRadioGroup({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.RadioGroup>): JSX.Element;
+
+export declare function DropdownMenuRadioItem({ className, children, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.RadioItem>): JSX.Element;
+
+export declare function DropdownMenuSeparator({ className, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Separator>): JSX.Element;
+
+export declare function DropdownMenuShortcut({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare function DropdownMenuSub({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Sub>): JSX.Element;
+
+export declare function DropdownMenuSubContent({ className, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.SubContent>): JSX.Element;
+
+export declare function DropdownMenuSubTrigger({ className, inset, children, ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.SubTrigger> & {
+    inset?: boolean;
+}): JSX.Element;
+
+export declare function DropdownMenuTrigger({ ...props }: React_2.ComponentProps<typeof DropdownMenuPrimitive.Trigger>): JSX.Element;
+
+export declare type EditorMode = 'text' | 'tree';
+
+export declare const enLabels: LenaUILabels;
+
+export declare function EntityDeleteDialog({ open, onOpenChange, onDelete, isDeleting, entityType, entityName, description, }: EntityDeleteDialogProps): JSX.Element;
+
+/**
+ * Generic Entity Delete Confirmation Dialog
+ * Reusable component for delete confirmations across detail pages
+ */
+declare interface EntityDeleteDialogProps {
+    /** Whether the dialog is open */
+    open: boolean;
+    /** Callback when open state changes */
+    onOpenChange: (open: boolean) => void;
+    /** Callback when delete is confirmed */
+    onDelete: () => void;
+    /** Whether delete is in progress */
+    isDeleting: boolean;
+    /** Entity type name (e.g., "SIM Card", "Protocol") */
+    entityType: string;
+    /** Display name/identifier of the entity being deleted */
+    entityName: string;
+    /** Optional custom description. If not provided, uses default template */
+    description?: string;
+}
+
+/**
+ * Error Boundary Component
+ * Catches JavaScript errors in child component tree and displays fallback UI
+ *
+ * @example
+ * ```tsx
+ * <ErrorBoundary>
+ *   <MyComponent />
+ * </ErrorBoundary>
+ *
+ * // With custom fallback
+ * <ErrorBoundary fallback={<CustomErrorUI />}>
+ *   <MyComponent />
+ * </ErrorBoundary>
+ * ```
+ */
+export declare class ErrorBoundary extends Component<ErrorBoundaryProps, ErrorBoundaryState> {
+    constructor(props: ErrorBoundaryProps);
+    static getDerivedStateFromError(error: Error): Partial<ErrorBoundaryState>;
+    componentDidCatch(error: Error, errorInfo: React.ErrorInfo): void;
+    handleReset: () => void;
+    handleReload: () => void;
+    handleGoHome: () => void;
+    render(): ReactNode;
+}
+
+export declare interface ErrorBoundaryLabels {
+    title: string;
+    description: string;
+    retry: string;
+    reload: string;
+    goHome: string;
+    appError: string;
+    appErrorDescription: string;
+    reloadPage: string;
+    sectionError: string;
+}
+
+declare interface ErrorBoundaryProps {
+    children: ReactNode;
+    /** Custom fallback component */
+    fallback?: ReactNode;
+    /** Called when error is caught */
+    onError?: (error: Error, errorInfo: React.ErrorInfo) => void;
+    /** Whether to show technical details */
+    showDetails?: boolean;
+}
+
+declare interface ErrorBoundaryState {
+    hasError: boolean;
+    error: Error | null;
+    errorInfo: React.ErrorInfo | null;
+}
+
+export declare interface FieldConfig {
+    /** API field path - supports dot notation (e.g., 'gatewayModel.id') */
+    field: string;
+    /** Display label for the field */
+    label: string;
+    /** Field data type - determines available operators */
+    type: FieldType;
+    /** Options for enum fields */
+    options?: SelectOption[];
+    /** Async function to load options */
+    loadOptions?: () => Promise<SelectOption[]>;
+    /** Placeholder text for input */
+    placeholder?: string;
+    /** Default operator when adding a filter for this field */
+    defaultOperator?: FilterOperator;
+}
+
+export declare type FieldType = 'string' | 'number' | 'date' | 'boolean' | 'enum' | 'timestamp';
+
+export declare function FileField<TFieldValues extends FieldValues>({ name, control, label, description, required, accept, allowedTypes, maxSize, multiple, disabled, className, cols, errorHint, }: FileFieldProps<TFieldValues>): JSX.Element;
+
+declare interface FileFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    accept?: string;
+    allowedTypes?: string[];
+    maxSize?: number;
+    multiple?: boolean;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+}
+
+export declare type FilterOperator = 'EQUALS' | 'NOT_EQUALS' | 'CONTAINS' | 'STARTS_WITH' | 'ENDS_WITH' | 'GREATER_THAN' | 'GREATER_THAN_OR_EQUALS' | 'LESS_THAN' | 'LESS_THAN_OR_EQUALS' | 'IN' | 'NOT_IN' | 'BETWEEN' | 'IS_NULL' | 'IS_NOT_NULL';
+
+export declare interface FilterState {
+    /** Unique filter ID (UI only, for React keys) */
+    id: string;
+    /** Field path (same as SearchCriteria) */
+    field: string;
+    /** Filter operator */
+    operator: FilterOperator;
+    /** Single value for simple operators */
+    value?: string | number | boolean | null;
+    /** Array of values for IN, NOT_IN, BETWEEN */
+    values?: (string | number | boolean)[];
+    /** Whether the filter is enabled (UI only) */
+    enabled: boolean;
+}
+
+/**
+ * Format backend timestamp to short datetime (e.g., "27 Oca 00:44")
+ */
+export declare function formatBackendTimestamp(timestamp: number | string | null | undefined): string;
+
+/**
+ * Format a timestamp to a short date string (e.g., "Jan 1, 2024")
+ */
+export declare function formatDate(timestamp: DateInput_3): string;
+
+/**
+ * Format a timestamp to date with time (e.g., "Jan 1, 2024 14:30")
+ */
+export declare function formatDateTime(timestamp: DateInput_3): string;
+
+/**
+ * Format a timestamp to full date with seconds (e.g., "Jan 1, 2024 14:30:45")
+ */
+export declare function formatDateTimeFull(timestamp: DateInput_3): string;
+
+/**
+ * Format a timestamp to ISO string (e.g., "2024-01-01T14:30:00Z")
+ */
+export declare function formatISODate(timestamp: DateInput_3): string;
+
+/**
+ * Format a timestamp to relative time (e.g., "2 hours ago")
+ */
+export declare function formatRelativeTime(timestamp: DateInput_3, locale?: 'en' | 'tr'): string;
+
+/**
+ * Format a timestamp to a short time string (e.g., "14:30")
+ */
+export declare function formatTime(timestamp: DateInput_3): string;
+
+/**
+ * Format Zod errors for display
+ */
+export declare function formatZodErrors(errors: z.ZodIssue[]): string[];
+
+export declare function FormField<TFieldValues extends FieldValues>({ name, control, label, description, required, className, cols, errorHint, floatingLabel, labelClassName, isActive, children, }: FormFieldProps<TFieldValues>): JSX.Element;
+
+declare interface FormFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+    floatingLabel?: boolean;
+    labelClassName?: string;
+    /** When true, floating label stays in active/focused position (e.g. popover open) */
+    isActive?: boolean;
+    children: (field: {
+        value: unknown;
+        onChange: (value: unknown) => void;
+        onBlur: () => void;
+        name: string;
+        ref: React.Ref<unknown>;
+        disabled?: boolean;
+        error?: string;
+    }) => ReactNode;
+}
+
+export declare interface FormLabels {
+    save: string;
+    cancel: string;
+    processing: string;
+    saving: string;
+    selectPlaceholder: string;
+    searchPlaceholder: string;
+    noResults: string;
+}
+
+export declare function FormSection({ title, children, className, collapsible, defaultOpen, icon, }: FormSectionProps): JSX.Element;
+
+declare interface FormSectionProps {
+    title: string;
+    description?: string;
+    children: ReactNode;
+    className?: string;
+    collapsible?: boolean;
+    defaultOpen?: boolean;
+    icon?: ReactNode;
+}
+
+export declare function FormSheet({ open, onOpenChange, title, description, children, onSubmit, onCancel, isSubmitting, submitLabel, cancelLabel, side, className, icon, }: FormSheetProps): JSX.Element;
+
+declare interface FormSheetProps {
+    open: boolean;
+    onOpenChange: (open: boolean) => void;
+    title: string;
+    description?: string;
+    children: ReactNode;
+    onSubmit: () => void;
+    onCancel?: () => void;
+    isSubmitting?: boolean;
+    submitLabel?: string;
+    cancelLabel?: string;
+    side?: 'top' | 'bottom' | 'left' | 'right';
+    className?: string;
+    icon?: ReactNode;
+}
+
+/**
+ * Parse URLSearchParams to UrlSearchParams object
+ */
+export declare function fromURLSearchParams(searchParams: URLSearchParams): Record<string, string | undefined>;
+
+export declare interface GaugeFooterStat {
+    label: string;
+    value: string | number;
+    colorClass?: string;
+}
+
+/**
+ * Get error path for highlighting in tree view
+ */
+export declare function getErrorPaths(errors: z.ZodIssue[]): string[][];
+
+/**
+ * Get display value for a filter (for UI chips)
+ */
+export declare function getFilterDisplayValue(filter: FilterState): string;
+
+/**
+ * Get status color classes for a given value from a color map
+ */
+export declare function getStatusColor<T extends string>(value: T | null | undefined, colorMap: Record<T, string>, fallback?: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30"): string;
+
+/**
+ * getTabDirection — Calculates slide direction based on tab index positions.
+ *
+ * @returns -1 (slide from left), 0 (no direction / same tab), 1 (slide from right)
+ */
+export declare function getTabDirection(tabIds: string[], fromTab: string | null, toTab: string): -1 | 0 | 1;
+
+export declare function HistoryList({ items, className }: HistoryListProps): JSX.Element;
+
+declare interface HistoryListItem {
+    id: string | number;
+    date: string | Date | number;
+    value: string;
+    isCurrent?: boolean;
+}
+
+declare interface HistoryListProps {
+    items: HistoryListItem[];
+    className?: string;
+}
+
+export declare type IconProp = string | React.ComponentType<{
+    className?: string;
+}>;
+
+/**
+ * Cell with icon + text combination.
+ * Useful for displaying items like SIM cards, gateway assignments, etc.
+ */
+export declare function IconTextCell({ value, icon, className }: IconTextCellProps): JSX.Element;
+
+declare interface IconTextCellProps {
+    value: string | null | undefined;
+    icon: React.ReactNode;
+    className?: string;
+}
+
+export declare function InfoCard({ icon, label, value, variant, iconColor, className, }: InfoCardProps): JSX.Element;
+
+export declare function InfoCardGrid({ children, columns, className, }: InfoCardGridProps): JSX.Element;
+
+declare interface InfoCardGridProps {
+    children: React.ReactNode;
+    columns?: 2 | 3 | 4;
+    className?: string;
+}
+
+declare interface InfoCardProps {
+    icon?: React.ReactNode;
+    label: string;
+    value: React.ReactNode;
+    variant?: 'default' | 'highlighted' | 'muted';
+    iconColor?: 'primary' | 'blue' | 'green' | 'orange' | 'purple' | 'slate';
+    className?: string;
+}
+
+export declare function Input({ className, type, ...props }: React_2.ComponentProps<"input">): JSX.Element;
+
+/**
+ * Check if a filter has a valid value
+ */
+export declare function isFilterComplete(filter: FilterState): boolean;
+
+export declare function JsonBadge({ data, maxLength, className }: JsonBadgeProps): JSX.Element;
+
+declare interface JsonBadgeProps {
+    data: Record<string, unknown> | unknown[] | string | null | undefined;
+    maxLength?: number;
+    className?: string;
+}
+
+export declare interface JsonEditorLabels {
+    clickToEdit: string;
+    addValue: string;
+    delete: string;
+    lines: string;
+    copySuccess: string;
+    formatSuccess: string;
+    validJson: string;
+    invalidJson: string;
+}
+
+export declare function JsonEditorSection({ title, value, onChange, onSave, isSaving, editable, disabled, disabledReason, rows, maxViewHeight, placeholder, defaultOpen, }: JsonEditorSectionProps): JSX.Element;
+
+/**
+ * JsonEditorSection - CollapsibleSection wrapper for JSON editing
+ * Standalone component without React Hook Form dependency
+ */
+declare interface JsonEditorSectionProps {
+    title?: string;
+    value: string;
+    onChange?: (value: string) => void;
+    onSave?: (value: string) => void;
+    isSaving?: boolean;
+    editable?: boolean;
+    disabled?: boolean;
+    disabledReason?: string;
+    rows?: number;
+    maxViewHeight?: number;
+    placeholder?: string;
+    defaultOpen?: boolean;
+}
+
+export declare function JsonTextEditor({ value, onChange, rows, placeholder, showLineNumbers, isValid, disabled, }: JsonTextEditorProps): JSX.Element;
+
+export declare interface JsonTextEditorProps {
+    value: string;
+    onChange: (value: string) => void;
+    rows?: number;
+    placeholder?: string;
+    showLineNumbers?: boolean;
+    isValid?: boolean;
+    disabled?: boolean;
+}
+
+export declare function JsonToolbar({ mode, onModeChange, onFormat, onCopy, isValid, allowModeSwitch, copied, }: JsonToolbarProps): JSX.Element;
+
+export declare interface JsonToolbarProps {
+    mode: EditorMode;
+    onModeChange: (mode: EditorMode) => void;
+    onFormat: () => void;
+    onCopy: () => void;
+    isValid: boolean;
+    allowModeSwitch?: boolean;
+    copied?: boolean;
+}
+
+export declare function JsonTreeEditor({ value, onChange, maxHeight, disabled, }: JsonTreeEditorProps): JSX.Element;
+
+export declare interface JsonTreeEditorProps {
+    value: unknown;
+    onChange: (value: unknown) => void;
+    maxHeight?: number;
+    disabled?: boolean;
+}
+
+export declare function JsonTreeNode({ node, depth, isArrayItem, parentType: _parentType, onToggleExpand, onUpdateValue, onAddChild, onDeleteChild, onRenameKey, disabled, isError, }: JsonTreeNodeProps): JSX.Element;
+
+declare interface JsonTreeNodeProps {
+    node: TreeNode;
+    depth: number;
+    isArrayItem?: boolean;
+    parentType?: 'object' | 'array';
+    onToggleExpand: (path: string[]) => void;
+    onUpdateValue: (path: string[], value: unknown) => void;
+    onAddChild: (parentPath: string[], key: string, value: unknown) => void;
+    onDeleteChild: (parentPath: string[], key: string) => void;
+    onRenameKey: (parentPath: string[], oldKey: string, newKey: string) => void;
+    disabled?: boolean;
+    isError?: boolean;
+}
+
+export declare type JsonValueType = 'object' | 'array' | 'string' | 'number' | 'boolean' | 'null';
+
+export declare function JsonViewer({ data, collapsible, copyable, maxHeight, className, }: JsonViewerProps): JSX.Element;
+
+declare interface JsonViewerProps {
+    data: Record<string, unknown> | unknown[] | string | null | undefined;
+    collapsible?: boolean;
+    copyable?: boolean;
+    maxHeight?: number;
+    className?: string;
+}
+
+export declare function Label({ className, ...props }: React_2.ComponentProps<typeof LabelPrimitive.Root>): JSX.Element;
+
+export declare interface LenaUILabels {
+    dataTable: DataTableLabels;
+    form: FormLabels;
+    errorBoundary: ErrorBoundaryLabels;
+    jsonEditor: JsonEditorLabels;
+    common: CommonLabels;
+    deleteDialog: DeleteDialogLabels;
+}
+
+/**
+ * Provider for overriding default labels across all @nar-bus/lena-ui-shared components.
+ *
+ * @example
+ * ```tsx
+ * // Use Turkish defaults (zero config — backward compatible)
+ * <LenaUIProvider>
+ *   <App />
+ * </LenaUIProvider>
+ *
+ * // With locale switching
+ * import { useLocale } from '@nar-bus/lena-ui-core';
+ * const locale = useLocale();
+ * <LenaUIProvider locale={locale}>
+ *   <App />
+ * </LenaUIProvider>
+ * ```
+ */
+export declare function LenaUIProvider({ locale, labels, children }: LenaUIProviderProps): JSX.Element;
+
+export declare interface LenaUIProviderProps {
+    /** Active locale — passed from app (reads from @nar-bus/lena-ui-core) */
+    locale?: string;
+    /** Override specific labels */
+    labels?: Partial<LenaUILabels>;
+    children: ReactNode;
+}
+
+/**
+ * Link cell for navigable table values.
+ * Shows external link icon on hover and supports different hover colors.
+ */
+export declare function LinkCell({ to, params, value, showExternalIcon, hoverColor, className, }: LinkCellProps): JSX.Element;
+
+declare interface LinkCellProps {
+    to: string;
+    params?: Record<string, string>;
+    value: string | null | undefined;
+    showExternalIcon?: boolean;
+    hoverColor?: 'cyan' | 'violet';
+    className?: string;
+}
+
+export declare function LocaleToggle({ locale, onLocaleChange }: LocaleToggleProps): JSX.Element;
+
+declare interface LocaleToggleProps {
+    locale: string;
+    onLocaleChange: (locale: string) => void;
+}
+
+export declare function LocationMap({ lat, lon, height, zoom, title, linkLabel, className, }: LocationMapProps): JSX.Element;
+
+export declare interface LocationMapProps {
+    lat: number;
+    lon: number;
+    height?: number;
+    zoom?: number;
+    title?: string;
+    linkLabel?: string;
+    className?: string;
+}
+
+export declare interface MetaInfo {
+    timestamp: string;
+    version: string;
+    requestId: string;
+}
+
+export declare type MountStrategy = 'eager' | 'lazy-persist' | 'lazy-remount';
+
+export declare function MultiSelectField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, searchPlaceholder, emptyText, options, maxItems, disabled, className, cols, errorHint, }: MultiSelectFieldProps<TFieldValues>): JSX.Element;
+
+declare interface MultiSelectFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    options: SelectOption[];
+    maxItems?: number;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+}
+
+/**
+ * Operators that don't require any value
+ */
+export declare const NO_VALUE_OPERATORS: FilterOperator[];
+
+export declare function NumberField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, min, max, step, disabled, className, cols, showControls, errorHint, }: NumberFieldProps<TFieldValues>): JSX.Element;
+
+declare interface NumberFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    min?: number;
+    max?: number;
+    step?: number;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    showControls?: boolean;
+    errorHint?: string;
+}
+
+/**
+ * Human-readable labels for filter operators
+ */
+export declare const OPERATOR_LABELS: Record<FilterOperator, string>;
+
+/**
+ * Available operators grouped by field type
+ * Matches backend GenericSpecification supported operations
+ */
+export declare const OPERATORS_BY_TYPE: Record<FieldType, FilterOperator[]>;
+
+/**
+ * Action types for optimistic list operations
+ */
+export declare type OptimisticAction<T> = {
+    type: 'add';
+    item: T;
+} | {
+    type: 'update';
+    item: T;
+} | {
+    type: 'delete';
+    id: number | string;
+};
+
+export declare interface PagedResponse<T> {
+    status: number;
+    success: boolean;
+    message: string;
+    data: T[];
+    pagination: PaginationInfo;
+    meta: MetaInfo;
+}
+
+/**
+ * Page-level Error Boundary with full-page fallback
+ */
+export declare function PageErrorBoundary({ children }: {
+    children: ReactNode;
+}): JSX.Element;
+
+export declare function PageHeader({ title, description, icon: Icon, breadcrumbs, actions, className, onBreadcrumbsChange, }: PageHeaderProps): JSX.Element;
+
+export declare interface PageHeaderProps {
+    title: string;
+    description?: string;
+    icon: React.ComponentType<{
+        className?: string;
+    }>;
+    breadcrumbs: BreadcrumbItem[];
+    actions?: React.ReactNode;
+    className?: string;
+    /** Callback to sync breadcrumbs with external store (e.g. uiStore) */
+    onBreadcrumbsChange?: (breadcrumbs: BreadcrumbItem[]) => void;
+}
+
+export declare function Pagination({ className, ...props }: React_2.ComponentProps<"nav">): JSX.Element;
+
+export declare function PaginationContent({ className, ...props }: React_2.ComponentProps<"ul">): JSX.Element;
+
+export declare function PaginationEllipsis({ className, ...props }: React_2.ComponentProps<"span">): JSX.Element;
+
+export declare interface PaginationInfo {
+    page: number;
+    size: number;
+    totalElements: number;
+    totalPages: number;
+    hasNext: boolean;
+    hasPrevious: boolean;
+}
+
+export declare function PaginationItem({ ...props }: React_2.ComponentProps<"li">): JSX.Element;
+
+export declare function PaginationLink({ className, isActive, size, ...props }: PaginationLinkProps): JSX.Element;
+
+declare type PaginationLinkProps = {
+    isActive?: boolean;
+} & Pick<React_2.ComponentProps<typeof Button>, "size"> & React_2.ComponentProps<"a">;
+
+export declare function PaginationNext({ className, ...props }: React_2.ComponentProps<typeof PaginationLink>): JSX.Element;
+
+export declare function PaginationPrevious({ className, ...props }: React_2.ComponentProps<typeof PaginationLink>): JSX.Element;
+
+/**
+ * Parse backend timestamp format (YYYYMMDDHHmmssSSS) to Date
+ * Example: 20260127004431907 -> Date(2026, 0, 27, 0, 44, 31)
+ */
+export declare function parseBackendTimestamp(timestamp: number | string | null | undefined): Date | null;
+
+/**
+ * Parse URL search params into UrlState
+ */
+export declare function parseUrlState(params: Record<string, string | undefined>): UrlState;
+
+export declare function PasswordField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, disabled, className, cols, showIcon, errorHint, }: PasswordFieldProps<TFieldValues>): JSX.Element;
+
+declare interface PasswordFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    showIcon?: boolean;
+    errorHint?: string;
+}
+
+export declare function Popover({ ...props }: React_2.ComponentProps<typeof PopoverPrimitive.Root>): JSX.Element;
+
+export declare function PopoverContent({ className, align, sideOffset, ...props }: React_2.ComponentProps<typeof PopoverPrimitive.Content>): JSX.Element;
+
+export declare function PopoverTrigger({ ...props }: React_2.ComponentProps<typeof PopoverPrimitive.Trigger>): JSX.Element;
+
+export declare const priorityColors: {
+    readonly HIGH: "bg-status-error/10 text-status-error border-status-error/30";
+    readonly MEDIUM: "bg-status-warning/10 text-status-warning border-status-warning/30";
+    readonly LOW: "bg-status-info/10 text-status-info-foreground border-status-info/30";
+    readonly CRITICAL: "bg-status-error/10 text-status-error border-status-error/30";
+    readonly NORMAL: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+};
+
+export declare function Progress({ className, value, ...props }: React_2.ComponentProps<typeof ProgressPrimitive.Root>): JSX.Element;
+
+export declare function PropertyRow({ label, value, copyable, badge, badgeVariant, isEditing, fieldType, options, onChange, placeholder, disabled, }: PropertyRowProps): JSX.Element;
+
+declare interface PropertyRowProps {
+    label: string;
+    value: string | number | boolean | null | undefined;
+    copyable?: boolean;
+    badge?: boolean;
+    badgeVariant?: 'default' | 'secondary' | 'destructive' | 'outline';
+    isEditing?: boolean;
+    fieldType?: 'text' | 'number' | 'select' | 'switch' | 'password';
+    options?: SelectOption_2[];
+    onChange?: (value: string | number | boolean) => void;
+    placeholder?: string;
+    disabled?: boolean;
+}
+
+export declare const protocolTypeColors: {
+    readonly DLMS: "bg-status-info/10 text-status-info-foreground border-status-info/30";
+    readonly MODBUS: "bg-status-purple/10 text-status-purple-foreground border-status-purple/30";
+    readonly IEC_62056_21: "bg-accent-cyan/10 text-accent-cyan border-accent-cyan/30";
+    readonly ANSI_C12_18: "bg-status-warning/10 text-status-warning border-status-warning/30";
+};
+
+export declare function QuickActionTile({ title, description, icon, href, onClick, variant, badge, className, animationDelay, }: QuickActionTileProps): JSX.Element;
+
+export declare interface QuickActionTileProps {
+    title: string;
+    description: string;
+    icon: ReactNode;
+    href?: string;
+    onClick?: () => void;
+    variant?: 'default' | 'primary' | 'warning' | 'danger';
+    badge?: string | number;
+    className?: string;
+    animationDelay?: number;
+}
+
+export declare interface QuickFilter {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    filters: Omit<FilterState, 'id' | 'enabled'>[];
+}
+
+export declare function RadioGroup({ className, ...props }: React_2.ComponentProps<typeof RadioGroupPrimitive.Root>): JSX.Element;
+
+export declare function RadioGroupField<TFieldValues extends FieldValues>({ name, control, label, description, required, options, orientation, disabled, className, cols, }: RadioGroupFieldProps<TFieldValues>): JSX.Element;
+
+declare interface RadioGroupFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    options: RadioOption[];
+    orientation?: 'horizontal' | 'vertical';
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+}
+
+export declare function RadioGroupItem({ className, ...props }: React_2.ComponentProps<typeof RadioGroupPrimitive.Item>): JSX.Element;
+
+declare interface RadioOption {
+    value: string;
+    label: string;
+    description?: string;
+    icon?: React.ReactNode;
+}
+
+/**
+ * Relative time cell for displaying "time ago" values.
+ * Changes color based on how old the timestamp is.
+ *
+ * Ideal for: lastSeen, lastSync, updatedAt fields
+ */
+export declare function RelativeTimeCell({ value, className, warningThresholdMs, errorThresholdMs, }: RelativeTimeCellProps): JSX.Element;
+
+declare interface RelativeTimeCellProps {
+    value: DateInput_2;
+    className?: string;
+    warningThresholdMs?: number;
+    errorThresholdMs?: number;
+}
+
+export declare function ResizableHandle({ withHandle, className, ...props }: React.ComponentProps<typeof Separator_2> & {
+    withHandle?: boolean;
+}): JSX.Element;
+
+export declare function ResizablePanel({ ...props }: React.ComponentProps<typeof Panel>): JSX.Element;
+
+export declare function ResizablePanelGroup({ className, ...props }: React.ComponentProps<typeof Group>): JSX.Element;
+
+export declare function resolveIcon(icon: IconProp): React.ComponentType<{
+    className?: string;
+}>;
+
+/**
+ * Common route param schemas
+ */
+export declare const routeParamSchemas: {
+    /** Numeric ID parameter (e.g., /entity/$id) */
+    numericId: z.ZodObject<{
+        id: z.ZodCoercedNumber<unknown>;
+    }, z.core.$strip>;
+    /** String ID parameter */
+    stringId: z.ZodObject<{
+        id: z.ZodString;
+    }, z.core.$strip>;
+    /** UUID parameter */
+    uuid: z.ZodObject<{
+        id: z.ZodString;
+    }, z.core.$strip>;
+};
+
+export declare interface RowAction<TData> {
+    id: string;
+    label: string;
+    icon?: ReactNode;
+    variant?: 'default' | 'destructive';
+    onClick: (row: TData) => void;
+    hidden?: (row: TData) => boolean;
+    disabled?: (row: TData) => boolean;
+    separator?: boolean;
+}
+
+/**
+ * Safe param validation without throwing
+ * Returns null if validation fails
+ */
+export declare function safeValidateParams<TSchema extends z.ZodType>(params: unknown, schema: TSchema): z.infer<TSchema> | null;
+
+export declare function ScrollArea({ className, children, ...props }: React_2.ComponentProps<typeof ScrollAreaPrimitive.Root>): JSX.Element;
+
+export declare function ScrollBar({ className, orientation, ...props }: React_2.ComponentProps<typeof ScrollAreaPrimitive.ScrollAreaScrollbar>): JSX.Element;
+
+export declare function SearchBar({ value, onChange, onFilterToggle, filterActive, placeholder, recentSearches, onRecentSearchSelect, recentSearchesLabel, filterLabel, clearLabel, keyboardShortcut, className, }: SearchBarProps): JSX.Element;
+
+export declare interface SearchBarProps {
+    value: string;
+    onChange: (value: string) => void;
+    onFilterToggle?: () => void;
+    filterActive?: boolean;
+    placeholder?: string;
+    recentSearches?: string[];
+    onRecentSearchSelect?: (search: string) => void;
+    recentSearchesLabel?: string;
+    filterLabel?: string;
+    clearLabel?: string;
+    keyboardShortcut?: string;
+    className?: string;
+}
+
+export declare interface SearchCriteria {
+    field: string;
+    operator: FilterOperator;
+    value?: string | number | boolean | null;
+    values?: (string | number | boolean)[];
+}
+
+export declare interface SearchRequest {
+    page: number;
+    size: number;
+    generalSearch?: string;
+    filters: SearchCriteria[];
+    sortBy: string;
+    sortDirection: 'ASC' | 'DESC';
+}
+
+/**
+ * Section-level Error Boundary with compact fallback
+ */
+export declare function SectionErrorBoundary({ children, title, }: {
+    children: ReactNode;
+    title?: string;
+}): JSX.Element;
+
+export declare const SegmentedControl: <T extends string = string>(props: SegmentedControlProps<T>) => React.JSX.Element;
+
+export declare interface SegmentedControlItem<T extends string = string> {
+    key: T;
+    label: string;
+    icon?: ReactNode;
+    count?: number;
+}
+
+export declare interface SegmentedControlProps<T extends string = string> {
+    items: SegmentedControlItem<T>[];
+    activeKey: T;
+    onActiveChange: (key: T) => void;
+    showLabels?: boolean;
+    className?: string;
+}
+
+export declare function Select({ ...props }: React_2.ComponentProps<typeof SelectPrimitive.Root>): JSX.Element;
+
+export declare const SelectableCard: NamedExoticComponent<SelectableCardProps>;
+
+export declare interface SelectableCardProps {
+    title: string;
+    icon?: ReactNode;
+    isSelected: boolean;
+    onSelect: () => void;
+    description?: string;
+    className?: string;
+}
+
+/** Select active filter count */
+export declare const selectActiveFilterCount: (state: DataTableStore) => number;
+
+export declare function SelectContent({ className, children, position, align, ...props }: React_2.ComponentProps<typeof SelectPrimitive.Content>): JSX.Element;
+
+export declare function SelectField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, searchPlaceholder, emptyText, options, disabled, className, cols, errorHint, }: SelectFieldProps<TFieldValues>): JSX.Element;
+
+declare interface SelectFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    searchPlaceholder?: string;
+    emptyText?: string;
+    options: SelectOption[];
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+}
+
+/** Select filters array */
+export declare const selectFilters: (state: DataTableStore) => FilterState[];
+
+/** Select general search value */
+export declare const selectGeneralSearch: (state: DataTableStore) => string;
+
+export declare function SelectGroup({ ...props }: React_2.ComponentProps<typeof SelectPrimitive.Group>): JSX.Element;
+
+/** Select if there are any active filters */
+export declare const selectHasActiveFilters: (state: DataTableStore) => boolean;
+
+export declare function SelectItem({ className, children, ...props }: React_2.ComponentProps<typeof SelectPrimitive.Item>): JSX.Element;
+
+export declare function SelectLabel({ className, ...props }: React_2.ComponentProps<typeof SelectPrimitive.Label>): JSX.Element;
+
+export declare interface SelectOption {
+    value: string | number;
+    label: string;
+    color?: string;
+    icon?: ReactNode;
+    description?: string;
+}
+
+/**
+ * Property Row - Simple key-value row for property panels
+ * Supports inline editing mode
+ */
+declare interface SelectOption_2 {
+    value: string;
+    label: string;
+}
+
+/** Select page number */
+export declare const selectPage: (state: DataTableStore) => number;
+
+/** Select pagination info */
+export declare const selectPaginationState: (state: DataTableStore) => {
+    page: number;
+    size: number;
+};
+
+/** Select row selection */
+export declare const selectRowSelection: (state: DataTableStore) => Record<string, boolean>;
+
+/** Select search request - use with useShallow for object comparison */
+export declare const selectSearchRequest: (state: DataTableStore) => SearchRequest;
+
+/** Select selected row count */
+export declare const selectSelectedRowCount: (state: DataTableStore) => number;
+
+/** Select selected row IDs */
+export declare const selectSelectedRowIds: (state: DataTableStore) => string[];
+
+export declare function SelectSeparator({ className, ...props }: React_2.ComponentProps<typeof SelectPrimitive.Separator>): JSX.Element;
+
+/** Select page size */
+export declare const selectSize: (state: DataTableStore) => number;
+
+/** Select sort field */
+export declare const selectSortBy: (state: DataTableStore) => string;
+
+/** Select sort direction */
+export declare const selectSortDirection: (state: DataTableStore) => "ASC" | "DESC";
+
+/** Select sorting info */
+export declare const selectSortingState: (state: DataTableStore) => {
+    sortBy: string;
+    sortDirection: "ASC" | "DESC";
+};
+
+export declare function SelectTrigger({ className, size, children, ...props }: React_2.ComponentProps<typeof SelectPrimitive.Trigger> & {
+    size?: "sm" | "default";
+}): JSX.Element;
+
+export declare function SelectValue({ ...props }: React_2.ComponentProps<typeof SelectPrimitive.Value>): JSX.Element;
+
+export declare function Separator({ className, orientation, decorative, ...props }: React_2.ComponentProps<typeof SeparatorPrimitive.Root>): JSX.Element;
+
+export declare function serializeSearchParams(params: SearchRequest): string;
+
+/**
+ * Serialize DataTableState to URL search params
+ * Only includes non-default values to keep URLs clean
+ */
+export declare function serializeToUrl(state: DataTableState): UrlSearchParams;
+
+export declare function Sheet({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Root>): JSX.Element;
+
+export declare function SheetClose({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Close>): JSX.Element;
+
+export declare function SheetContent({ className, children, side, showCloseButton, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Content> & {
+    side?: "top" | "right" | "bottom" | "left";
+    showCloseButton?: boolean;
+}): JSX.Element;
+
+export declare function SheetDescription({ className, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Description>): JSX.Element;
+
+export declare function SheetFooter({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function SheetHeader({ className, ...props }: React_2.ComponentProps<"div">): JSX.Element;
+
+export declare function SheetTitle({ className, ...props }: React_2.ComponentProps<typeof DialogPrimitive.Title>): JSX.Element;
+
+export declare function SheetTrigger({ ...props }: React_2.ComponentProps<typeof DialogPrimitive.Trigger>): JSX.Element;
+
+export declare interface SidebarNavItem {
+    title: string;
+    href: string;
+    icon: IconProp;
+    children?: SidebarNavItem[];
+}
+
+export declare function SimpleDataTable<TData>({ columns, data, getRowId, isLoading, error, meta, enableSearch, searchPlaceholder, searchColumn, emptyIcon, emptyTitle, emptyDescription, onRowClick, rowClassName, className, loadingRows, }: SimpleDataTableProps<TData>): JSX.Element;
+
+declare interface SimpleDataTableProps<TData> {
+    /** Column definitions */
+    columns: ColumnDef<TData, unknown>[];
+    /** Table data */
+    data: TData[];
+    /** Function to get unique row ID */
+    getRowId: (row: TData) => string;
+    /** Loading state */
+    isLoading?: boolean;
+    /** Error state */
+    error?: Error | null;
+    /** Custom meta passed to column cells */
+    meta?: Record<string, unknown>;
+    /** Enable client-side search */
+    enableSearch?: boolean;
+    /** Search placeholder */
+    searchPlaceholder?: string;
+    /** Column to search (accessorKey) - defaults to global filter */
+    searchColumn?: string;
+    /** Empty state icon */
+    emptyIcon?: React.ReactNode;
+    /** Empty state title */
+    emptyTitle?: string;
+    /** Empty state description */
+    emptyDescription?: string;
+    /** Row click handler */
+    onRowClick?: (row: TData) => void;
+    /** Custom row class */
+    rowClassName?: (row: TData) => string;
+    /** Container class */
+    className?: string;
+    /** Number of skeleton rows for loading state */
+    loadingRows?: number;
+}
+
+export declare function Skeleton({ className, ...props }: React.ComponentProps<"div">): JSX.Element;
+
+export declare function Slider({ className, defaultValue, value, min, max, ...props }: React_2.ComponentProps<typeof SliderPrimitive.Root>): JSX.Element;
+
+/**
+ * Two-line stacked text cell.
+ * Useful for displaying model + brand or similar hierarchical information.
+ */
+export declare function StackedTextCell({ primary, secondary, primaryClassName, }: StackedTextCellProps): JSX.Element;
+
+declare interface StackedTextCellProps {
+    primary: string | null | undefined;
+    secondary?: string | null | undefined;
+    primaryClassName?: string;
+}
+
+export declare function StatCard({ title, value, unit, trend, trendLabel, status, icon, sparklineData, className, animationDelay, isLoading, }: StatCardProps): JSX.Element;
+
+export declare interface StatCardProps {
+    title: string;
+    value: string | number;
+    unit?: string;
+    trend?: {
+        value: number;
+        direction: 'up' | 'down' | 'neutral';
+    };
+    trendLabel?: string;
+    status?: 'online' | 'warning' | 'error' | 'neutral';
+    icon?: ReactNode;
+    sparklineData?: number[];
+    className?: string;
+    animationDelay?: number;
+    isLoading?: boolean;
+}
+
+/**
+ * Status badge for displaying enum/status values.
+ * Provides consistent styling across all tables.
+ *
+ * @example
+ * ```tsx
+ * <StatusBadge
+ *   value={row.status}
+ *   colorMap={{
+ *     ACTIVE: statusColors.success,
+ *     INACTIVE: statusColors.neutral,
+ *   }}
+ *   labelMap={{
+ *     ACTIVE: 'Active',
+ *     INACTIVE: 'Inactive',
+ *   }}
+ *   showDot
+ *   icon={<Wifi className="h-3 w-3" />}
+ * />
+ * ```
+ */
+export declare function StatusBadge<T extends string>({ value, colorMap, labelMap, icon, showDot, dotColorMap, pulse, size, showLabel, className, }: StatusBadgeProps<T>): JSX.Element;
+
+declare interface StatusBadgeProps<T extends string> {
+    value: T | null | undefined;
+    colorMap: Record<T, string>;
+    labelMap?: Record<T, string>;
+    icon?: React.ReactNode;
+    showDot?: boolean;
+    dotColorMap?: Record<T, string>;
+    pulse?: boolean | Record<T, boolean>;
+    size?: 'sm' | 'md';
+    showLabel?: boolean;
+    className?: string;
+}
+
+export declare type StatusColor = keyof typeof statusColors;
+
+/**
+ * Standardized color palette for status badges and indicators.
+ * Semantic colors with consistent light/dark mode support.
+ */
+export declare const statusColors: {
+    readonly success: "bg-status-success/10 text-status-success-foreground border-status-success/30";
+    readonly warning: "bg-status-warning/10 text-status-warning border-status-warning/30";
+    readonly error: "bg-status-error/10 text-status-error border-status-error/30";
+    readonly info: "bg-status-info/10 text-status-info-foreground border-status-info/30";
+    readonly neutral: "bg-status-neutral/10 text-status-neutral-foreground border-status-neutral/30";
+    readonly accent: "bg-accent-cyan/10 text-accent-cyan border-accent-cyan/30";
+    readonly purple: "bg-status-purple/10 text-status-purple-foreground border-status-purple/30";
+};
+
+/**
+ * Submit button that automatically shows loading state during form submission.
+ *
+ * Works with:
+ * 1. React 19 form actions (automatic via useFormStatus)
+ * 2. react-hook-form (pass isPending prop)
+ *
+ * @example
+ * ```tsx
+ * // With React 19 form actions
+ * <form action={formAction}>
+ *   <SubmitButton>Save</SubmitButton>
+ * </form>
+ *
+ * // With react-hook-form
+ * <form onSubmit={handleSubmit(onSubmit)}>
+ *   <SubmitButton isPending={isSubmitting}>Save</SubmitButton>
+ * </form>
+ * ```
+ */
+export declare function SubmitButton({ children, loadingText, isPending: isPendingProp, disabled, ...props }: SubmitButtonProps): JSX.Element;
+
+declare interface SubmitButtonProps extends Omit<ButtonProps, 'type'> {
+    /** Loading text shown when form is submitting */
+    loadingText?: string;
+    /** Override pending state (useful with react-hook-form) */
+    isPending?: boolean;
+}
+
+/**
+ * Form submit button with custom loading indicator
+ * Provides more control over the loading state UI
+ */
+export declare function SubmitButtonWithStatus({ children, loadingContent, isPending: isPendingProp, disabled, ...props }: Omit<SubmitButtonProps, 'loadingText'> & {
+    loadingContent: React.ReactNode;
+}): JSX.Element;
+
+export declare function SupportBadge({ value, label, className }: SupportBadgeProps): JSX.Element;
+
+/**
+ * Support Badge
+ * Displays a boolean support status with check/x icon and label
+ */
+declare interface SupportBadgeProps {
+    /** Whether the feature is supported */
+    value: boolean;
+    /** Label to display (e.g., "IEC", "DLMS", "Supported") */
+    label: string;
+    /** Additional class names */
+    className?: string;
+}
+
+export declare type SurfaceColor = keyof typeof surfaceColors;
+
+/** Surface colors for containers, cards, banners - more opaque than statusColors */
+export declare const surfaceColors: {
+    readonly success: "bg-surface-success text-surface-success-foreground";
+    readonly warning: "bg-surface-warning text-surface-warning-foreground";
+    readonly error: "bg-surface-error text-surface-error-foreground";
+    readonly info: "bg-surface-info text-surface-info-foreground";
+    readonly purple: "bg-surface-purple text-surface-purple-foreground";
+};
+
+/**
+ * Reusable Suspense boundary with configurable fallback
+ *
+ * @example
+ * ```tsx
+ * // With default skeleton
+ * <SuspenseWrapper>
+ *   <AsyncComponent />
+ * </SuspenseWrapper>
+ *
+ * // With custom height
+ * <SuspenseWrapper skeletonHeight="h-[600px]">
+ *   <LargeDataTable />
+ * </SuspenseWrapper>
+ *
+ * // With custom fallback
+ * <SuspenseWrapper fallback={<CustomLoader />}>
+ *   <AsyncComponent />
+ * </SuspenseWrapper>
+ * ```
+ */
+export declare function SuspenseWrapper({ children, fallback, skeletonHeight, className, }: SuspenseWrapperProps): JSX.Element;
+
+declare interface SuspenseWrapperProps {
+    children: ReactNode;
+    /** Custom fallback component */
+    fallback?: ReactNode;
+    /** Height of the skeleton fallback */
+    skeletonHeight?: string;
+    /** Additional className for the fallback container */
+    className?: string;
+}
+
+export declare function Switch({ className, size, ...props }: React_2.ComponentProps<typeof SwitchPrimitive.Root> & {
+    size?: "sm" | "default";
+}): JSX.Element;
+
+export declare function SwitchField<TFieldValues extends FieldValues>({ name, control, label, description, disabled, className, cols, }: SwitchFieldProps<TFieldValues>): JSX.Element;
+
+declare interface SwitchFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+}
+
+export declare interface TabConfig {
+    /** Unique identifier for the tab */
+    id: string;
+    /** Display label */
+    label: string;
+    /** Optional icon component */
+    icon?: React.ComponentType<{
+        className?: string;
+    }>;
+    /** Static count to display as badge */
+    count?: number;
+    /** Special badge indicator */
+    badge?: 'new' | 'beta';
+    /** Tab grouping for overflow variant: 'primary' = visible, 'overflow' = in dropdown */
+    group?: 'primary' | 'overflow';
+    /** Description shown in dropdown tooltip */
+    description?: string;
+    /** Per-tab mount strategy override (only used when lazyMount is enabled) */
+    mountStrategy?: MountStrategy;
+}
+
+export declare function Table({ className, ...props }: React_2.ComponentProps<"table">): JSX.Element;
+
+export declare function TableBody({ className, ...props }: React_2.ComponentProps<"tbody">): JSX.Element;
+
+export declare function TableCaption({ className, ...props }: React_2.ComponentProps<"caption">): JSX.Element;
+
+export declare function TableCell({ className, ...props }: React_2.ComponentProps<"td">): JSX.Element;
+
+export declare function TableFooter({ className, ...props }: React_2.ComponentProps<"tfoot">): JSX.Element;
+
+export declare function TableHead({ className, ...props }: React_2.ComponentProps<"th">): JSX.Element;
+
+export declare function TableHeader({ className, ...props }: React_2.ComponentProps<"thead">): JSX.Element;
+
+export declare function TableRow({ className, ...props }: React_2.ComponentProps<"tr">): JSX.Element;
+
+/**
+ * TabPanel — Lazy mount wrapper for tab content.
+ *
+ * - `shouldMount=false` → renders nothing (tab not yet visited)
+ * - `shouldMount=true` + `isActive=false` → hidden with `display: none`
+ * - `shouldMount=true` + `isActive=true` → visible, with optional animation
+ */
+export declare const TabPanel: NamedExoticComponent<TabPanelProps>;
+
+export declare interface TabPanelProps {
+    /** Unique tab identifier */
+    tabId: string;
+    /** Whether this tab is currently active */
+    isActive: boolean;
+    /** Whether this tab should be mounted in the DOM */
+    shouldMount: boolean;
+    /** Enable enter transition animation */
+    transition?: boolean;
+    /** Slide direction: -1 = from left, 0 = fade only, 1 = from right */
+    direction?: -1 | 0 | 1;
+    /** Tab content */
+    children: React.ReactNode;
+    /** Additional CSS classes */
+    className?: string;
+}
+
+export declare function Tabs({ className, orientation, ...props }: React_2.ComponentProps<typeof TabsPrimitive.Root>): JSX.Element;
+
+export declare function TabsContent({ className, ...props }: React_2.ComponentProps<typeof TabsPrimitive.Content>): JSX.Element;
+
+export declare function TabsList({ className, variant, ...props }: React_2.ComponentProps<typeof TabsPrimitive.List> & VariantProps<typeof tabsListVariants>): JSX.Element;
+
+export declare const tabsListVariants: (props?: ({
+    variant?: "line" | "default" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+export declare function TabsTrigger({ className, ...props }: React_2.ComponentProps<typeof TabsPrimitive.Trigger>): JSX.Element;
+
+export declare function Textarea({ className, ...props }: React_2.ComponentProps<"textarea">): JSX.Element;
+
+export declare function TextareaField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, rows, maxLength, showCount, disabled, className, cols, errorHint, }: TextareaFieldProps<TFieldValues>): JSX.Element;
+
+declare interface TextareaFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    rows?: number;
+    maxLength?: number;
+    showCount?: boolean;
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    errorHint?: string;
+}
+
+/**
+ * Standard text cell for table columns.
+ * Handles null/undefined values and provides consistent styling.
+ */
+export declare function TextCell({ value, variant, className, truncate, maxWidth, }: TextCellProps): JSX.Element;
+
+declare interface TextCellProps {
+    value: string | null | undefined;
+    variant?: 'primary' | 'secondary' | 'muted';
+    className?: string;
+    truncate?: boolean;
+    maxWidth?: string;
+}
+
+export declare function TextField<TFieldValues extends FieldValues>({ name, control, label, description, required, placeholder, type, disabled, className, cols, icon, errorHint, list, suggestions, }: TextFieldProps<TFieldValues>): JSX.Element;
+
+declare interface TextFieldProps<TFieldValues extends FieldValues> {
+    name: FieldPath<TFieldValues>;
+    control: Control<TFieldValues>;
+    label?: string;
+    description?: string;
+    required?: boolean;
+    placeholder?: string;
+    type?: 'text' | 'email' | 'password' | 'tel' | 'url' | 'number';
+    disabled?: boolean;
+    className?: string;
+    cols?: 1 | 2 | 3 | 4 | 6 | 12;
+    icon?: React.ReactNode;
+    errorHint?: string;
+    /** Datalist ID for suggestions (use with datalist element) */
+    list?: string;
+    /** Suggestions for datalist (alternative to providing list ID separately) */
+    suggestions?: string[];
+}
+
+export declare function Timeline({ items, className, relativeTime, maxItems, emptyMessage, animated, animationDelay, }: TimelineProps): JSX.Element;
+
+export declare interface TimelineItem {
+    id: string | number;
+    date: string | Date | number;
+    title: string;
+    description?: string;
+    type?: 'default' | 'success' | 'warning' | 'error' | 'info' | 'action';
+    isCurrent?: boolean;
+    icon?: ReactNode;
+    meta?: Record<string, string | number | undefined>;
+}
+
+declare interface TimelineProps {
+    items: TimelineItem[];
+    className?: string;
+    /** Show relative time (e.g. "5m ago") instead of absolute dates */
+    relativeTime?: boolean;
+    /** Max number of items to display */
+    maxItems?: number;
+    /** Empty state message */
+    emptyMessage?: string;
+    /** Enable staggered animation */
+    animated?: boolean;
+    /** Animation delay offset in ms */
+    animationDelay?: number;
+}
+
+/**
+ * Convert Unix timestamp (milliseconds) to date string (YYYY-MM-DD)
+ * @param timestamp - Unix timestamp in milliseconds
+ * @returns Date string in YYYY-MM-DD format
+ */
+export declare function timestampToDateString(timestamp: number): string;
+
+export declare const Toaster: ({ ...props }: ToasterProps) => JSX.Element;
+
+export declare function Toggle({ className, variant, size, ...props }: React_2.ComponentProps<typeof TogglePrimitive.Root> & VariantProps<typeof toggleVariants>): JSX.Element;
+
+export declare function ToggleGroup({ className, variant, size, children, ...props }: React_2.ComponentProps<typeof ToggleGroupPrimitive.Root> & VariantProps<typeof toggleVariants>): JSX.Element;
+
+export declare function ToggleGroupItem({ className, children, variant, size, ...props }: React_2.ComponentProps<typeof ToggleGroupPrimitive.Item> & VariantProps<typeof toggleVariants>): JSX.Element;
+
+export declare const toggleVariants: (props?: ({
+    variant?: "default" | "outline" | null | undefined;
+    size?: "default" | "sm" | "lg" | null | undefined;
+} & ClassProp) | undefined) => string;
+
+export declare function Tooltip({ ...props }: React_2.ComponentProps<typeof TooltipPrimitive.Root>): JSX.Element;
+
+export declare function TooltipContent({ className, sideOffset, children, ...props }: React_2.ComponentProps<typeof TooltipPrimitive.Content>): JSX.Element;
+
+export declare function TooltipProvider({ delayDuration, ...props }: React_2.ComponentProps<typeof TooltipPrimitive.Provider>): JSX.Element;
+
+export declare function TooltipTrigger({ ...props }: React_2.ComponentProps<typeof TooltipPrimitive.Trigger>): JSX.Element;
+
+/**
+ * Convert UrlSearchParams to URLSearchParams for navigation
+ */
+export declare function toURLSearchParams(params: UrlSearchParams): URLSearchParams;
+
+export declare interface TreeNode {
+    id: string;
+    key: string;
+    value: unknown;
+    type: JsonValueType;
+    children?: TreeNode[];
+    expanded: boolean;
+    path: string[];
+}
+
+declare interface TreeNodeOperation {
+    type: 'update' | 'add' | 'delete' | 'rename';
+    path: string[];
+    key?: string;
+    value?: unknown;
+    newKey?: string;
+}
+
+export declare const trLabels: LenaUILabels;
+
+/**
+ * UnifiedTabs - Single tab component for both list and detail pages
+ */
+export declare function UnifiedTabs({ tabs, activeTab, onTabChange, children, variant, getTabCount, className, transition, urlSync, lazyMount, contentCard, }: UnifiedTabsProps): JSX.Element;
+
+export declare interface UnifiedTabsProps {
+    /** Array of tab configurations */
+    tabs: TabConfig[];
+    /** Currently active tab ID */
+    activeTab: string;
+    /** Callback fired when active tab changes */
+    onTabChange: (tabId: string) => void;
+    /** Tab content - use TabsContent for overflow variant, conditional render for simple */
+    children: React.ReactNode;
+    /** Tab variant: 'simple' for list pages, 'overflow' for detail pages */
+    variant?: 'simple' | 'overflow';
+    /** Dynamic count getter - overrides static count in TabConfig */
+    getTabCount?: (tabId: string) => number | undefined;
+    /** Additional CSS classes for the container */
+    className?: string;
+    /** Tab transition animation: true/'fade' = fade, 'slide' = directional slide */
+    transition?: boolean | 'fade' | 'slide';
+    /** URL sync: true = ?tab=, string = custom param key */
+    urlSync?: boolean | string;
+    /** Lazy mount strategy: true = 'lazy-persist', or specify strategy */
+    lazyMount?: boolean | MountStrategy;
+    /** Wrap tab content in a card container (border + background + rounded) */
+    contentCard?: boolean;
+}
+
+/**
+ * URL Search params (serialized string format)
+ */
+declare interface UrlSearchParams {
+    q?: string;
+    p?: string;
+    ps?: string;
+    s?: string;
+    sd?: string;
+    f?: string;
+}
+
+export declare interface UrlState {
+    q?: string;
+    p?: number;
+    ps?: number;
+    s?: string;
+    sd?: 'ASC' | 'DESC';
+    f?: FilterState[];
+}
+
+export declare function useDataTable<TData>(options: UseDataTableOptions<TData>): UseDataTableReturn<TData>;
+
+declare interface UseDataTableOptions<TData> extends CreateDataTableStoreOptions {
+    /** Unique ID for multiple tables on same page */
+    storeId?: string;
+    /** Enable URL state synchronization */
+    syncWithUrl?: boolean;
+    /** Filter field configuration */
+    fieldConfig: FieldConfig[];
+    /** Function to get unique row ID */
+    getRowId: (row: TData) => string;
+    /** Current data (for computing selectedRows) */
+    data?: TData[];
+}
+
+declare interface UseDataTableReturn<TData> {
+    /** Search request ready for API call (100% backend compatible) */
+    searchRequest: SearchRequest;
+    /** Pagination props to spread to DataTable */
+    paginationProps: {
+        page: number;
+        size: number;
+        onPageChange: (page: number) => void;
+        onPageSizeChange: (size: number) => void;
+    };
+    /** Sorting props to spread to DataTable */
+    sortingProps: DataTableSortingProps;
+    /** Search props to spread to DataTable */
+    searchProps: {
+        searchValue: string;
+        onSearchChange: (value: string) => void;
+    };
+    /** Filter props to spread to DataTable */
+    filterProps: {
+        filters: FilterState[];
+        onFiltersChange: (filters: FilterState[]) => void;
+    };
+    /** Selection props to spread to DataTable */
+    selectionProps: {
+        rowSelection: Record<string, boolean>;
+        onRowSelectionChange: (selection: Record<string, boolean>) => void;
+    };
+    /** Currently selected rows */
+    selectedRows: TData[];
+    /** Number of selected rows */
+    selectedCount: number;
+    /** Whether there are any active filters */
+    hasActiveFilters: boolean;
+    /** Number of active filters */
+    activeFilterCount: number;
+    /** Direct store access for advanced use cases */
+    store: DataTableStoreApi;
+}
+
+/**
+ * Hook to synchronize DataTable state with URL search params
+ * - Hydrates store from URL on mount
+ * - Updates URL when store state changes (debounced)
+ */
+export declare function useDataTableUrl(store: DataTableStoreApi, options?: UseDataTableUrlOptions): void;
+
+declare interface UseDataTableUrlOptions {
+    enabled?: boolean;
+    debounceMs?: number;
+}
+
+export declare function useJsonTree({ value, onChange }: UseJsonTreeOptions): UseJsonTreeReturn;
+
+declare interface UseJsonTreeOptions {
+    value: unknown;
+    onChange: (value: unknown) => void;
+}
+
+declare interface UseJsonTreeReturn {
+    tree: TreeNode | null;
+    toggleExpand: (path: string[]) => void;
+    updateValue: (path: string[], value: unknown) => void;
+    addChild: (parentPath: string[], key: string, value: unknown) => void;
+    deleteChild: (parentPath: string[], key: string) => void;
+    renameKey: (parentPath: string[], oldKey: string, newKey: string) => void;
+    applyOp: (operation: TreeNodeOperation) => void;
+    expandAll: () => void;
+    collapseAll: () => void;
+}
+
+export declare function useJsonValidation({ value, schema }: UseJsonValidationOptions): ValidationResult;
+
+declare interface UseJsonValidationOptions {
+    value: string;
+    schema?: z.ZodType<unknown>;
+}
+
+/**
+ * useLazyTabs — Controls tab mount/unmount behavior with three strategies:
+ *
+ * - `eager`: Always mounted (current default behavior)
+ * - `lazy-persist`: Mount on first visit, keep mounted (display: none when inactive)
+ * - `lazy-remount`: Mount only when active, unmount on leave
+ */
+export declare function useLazyTabs({ activeTab, defaultStrategy, strategyOverrides, }: UseLazyTabsOptions): UseLazyTabsReturn;
+
+export declare interface UseLazyTabsOptions {
+    /** All tab IDs in order */
+    tabIds: string[];
+    /** Currently active tab ID */
+    activeTab: string;
+    /** Default strategy for all tabs (default: 'lazy-persist') */
+    defaultStrategy?: MountStrategy;
+    /** Per-tab strategy overrides */
+    strategyOverrides?: Record<string, MountStrategy>;
+}
+
+export declare interface UseLazyTabsReturn {
+    /** Whether a tab should be mounted in the DOM */
+    shouldMount: (tabId: string) => boolean;
+    /** Whether a tab is currently active */
+    isActive: (tabId: string) => boolean;
+    /** Set of tab IDs that have been visited at least once */
+    visitedTabs: ReadonlySet<string>;
+}
+
+/**
+ * Hook to get merged labels for a specific namespace.
+ * Merge order: base locale < context overrides < component overrides
+ *
+ * @example
+ * ```tsx
+ * const t = useLenaLabels('dataTable');
+ * return <span>{t.searchPlaceholder}</span>;
+ *
+ * // With component-level overrides
+ * const t = useLenaLabels('dataTable', { searchPlaceholder: 'Find...' });
+ * ```
+ */
+export declare function useLenaLabels<K extends keyof LenaUILabels>(namespace: K, overrides?: Partial<LenaUILabels[K]>): LenaUILabels[K];
+
+/**
+ * Hook specifically for numeric ID params (most common case)
+ * Returns validated numeric ID or redirects
+ *
+ * @example
+ * ```tsx
+ * function GatewayDetailPage() {
+ *   const id = useNumericIdParam({
+ *     from: '/device-management/gateway/$id',
+ *     fallbackPath: '/device-management/gateways',
+ *   });
+ *
+ *   if (id === null) return <Loading />;
+ *
+ *   const { data } = useGateway(id);
+ *   // ...
+ * }
+ * ```
+ */
+export declare function useNumericIdParam(options: {
+    from: string;
+    fallbackPath?: string;
+}): number | null;
+
+/**
+ * Generic optimistic list hook using React 19's useOptimistic
+ *
+ * Provides immediate UI feedback for list operations (add/update/delete)
+ * before the actual API call completes.
+ *
+ * @example
+ * ```tsx
+ * function SimCardList() {
+ *   const { data: simCards } = useSimCards();
+ *   const {
+ *     optimisticItems,
+ *     addItem,
+ *     updateItem,
+ *     deleteItem
+ *   } = useOptimisticList(simCards ?? []);
+ *
+ *   const handleDelete = async (id: number) => {
+ *     deleteItem(id);  // Immediate UI update
+ *     await deleteMutation.mutateAsync(id);  // API call
+ *   };
+ *
+ *   return <DataTable data={optimisticItems} />;
+ * }
+ * ```
+ */
+export declare function useOptimisticList<T extends {
+    id: number | string;
+}>(items: T[], idKey?: keyof T): {
+    /** Items with optimistic updates applied */
+    optimisticItems: T[];
+    /** Raw update function for custom operations */
+    updateOptimistic: (action: OptimisticAction<T>) => void;
+    /** Add a new item optimistically */
+    addItem: (item: T) => void;
+    /** Update an existing item optimistically */
+    updateItem: (item: T) => void;
+    /** Delete an item optimistically */
+    deleteItem: (id: number | string) => void;
+};
+
+/**
+ * Hook for optimistic page response updates (paginated data)
+ * Works with LENA HES API's PagedResponse structure
+ *
+ * @example
+ * ```tsx
+ * function SimCardList() {
+ *   const { data } = useSimCardsSearch(searchRequest);
+ *   const {
+ *     optimisticData,
+ *     deleteItem
+ *   } = useOptimisticPageResponse(data);
+ *
+ *   return <DataTable data={optimisticData?.data ?? []} />;
+ * }
+ * ```
+ */
+export declare function useOptimisticPageResponse<T extends {
+    id: number | string;
+}>(pageResponse: {
+    data: T[];
+    pagination: {
+        totalElements: number;
+        [key: string]: unknown;
+    };
+    [key: string]: unknown;
+} | undefined, idKey?: keyof T): {
+    /** Page response with optimistic updates applied */
+    optimisticData: {
+        [key: string]: unknown;
+        data: T[];
+        pagination: {
+            totalElements: number;
+            [key: string]: unknown;
+        };
+    } | undefined;
+    /** Raw update function for custom operations */
+    updateOptimistic: (action: OptimisticAction<T>) => void;
+    /** Add a new item optimistically */
+    addItem: (item: T) => void;
+    /** Update an existing item optimistically */
+    updateItem: (item: T) => void;
+    /** Delete an item optimistically */
+    deleteItem: (id: number | string) => void;
+};
+
+/**
+ * Hook for prefetching list and detail data on hover.
+ * Improves perceived performance by loading data before user navigates.
+ *
+ * @example
+ * ```tsx
+ * const { prefetchDetail, prefetchPage } = usePrefetch({
+ *   detailKey: simCardKeys.detail,
+ *   listKey: simCardKeys.list,
+ *   fetchDetail: getSimCard,
+ *   fetchList: searchSimCards,
+ *   searchParams: table.searchRequest,
+ * });
+ *
+ * <DataTable
+ *   onRowHover={(row) => prefetchDetail(row.id)}
+ *   onPrefetchPage={prefetchPage}
+ * />
+ * ```
+ */
+export declare function usePrefetch<TData>({ detailKey, listKey, fetchDetail, fetchList, searchParams, staleTime, }: UsePrefetchOptions<TData>): {
+    prefetchDetail: (id: number) => void;
+    prefetchPage: (page: number) => void;
+    clearPrefetchCache: () => void;
+};
+
+declare interface UsePrefetchOptions<TData> {
+    /** Query key factory for detail queries */
+    detailKey: (id: number) => QueryKey;
+    /** Query key factory for list queries */
+    listKey: (params: SearchRequest) => QueryKey;
+    /** Function to fetch detail data */
+    fetchDetail?: (id: number) => Promise<TData>;
+    /** Function to fetch list data */
+    fetchList?: (params: SearchRequest) => Promise<unknown>;
+    /** Current search params (for pagination prefetch) */
+    searchParams?: SearchRequest;
+    /** Stale time for prefetched data (default: 30s) */
+    staleTime?: number;
+}
+
+/**
+ * useTabUrlSync — Synchronizes active tab state with URL search params.
+ *
+ * - On mount: reads tab from URL and calls onTabChange if valid
+ * - On tab change: updates URL param (replaceState by default)
+ * - Default tab cleans the param from URL for cleaner URLs
+ * - Uses window.history directly — no router dependency
+ */
+export declare function useTabUrlSync({ validTabIds, defaultTab, activeTab, onTabChange, paramKey, replace, }: UseTabUrlSyncOptions): void;
+
+export declare interface UseTabUrlSyncOptions {
+    /** Valid tab IDs for URL validation */
+    validTabIds: string[];
+    /** Default tab (URL param removed when this is active) */
+    defaultTab: string;
+    /** Currently active tab */
+    activeTab: string;
+    /** Callback to change the active tab */
+    onTabChange: (tabId: string) => void;
+    /** URL search param key (default: 'tab') */
+    paramKey?: string;
+    /** Use replaceState instead of pushState (default: true) */
+    replace?: boolean;
+}
+
+/**
+ * Hook to get validated route params with Zod
+ * Redirects to fallback path if validation fails
+ *
+ * @example
+ * ```tsx
+ * function EntityDetailPage() {
+ *   const params = useValidatedParams({
+ *     from: '/entity/$id',
+ *     schema: z.object({ id: z.coerce.number().positive() }),
+ *     fallbackPath: '/entity',
+ *   });
+ *
+ *   if (!params) return <Loading />; // Redirecting due to invalid params
+ *
+ *   const { id } = params; // id is typed as number
+ *   // ...
+ * }
+ * ```
+ */
+export declare function useValidatedParams<TFrom extends string, TSchema extends z.ZodType>(options: {
+    /** Route path to get params from */
+    from: TFrom;
+    /** Zod schema to validate params */
+    schema: TSchema;
+    /** Path to redirect if validation fails */
+    fallbackPath?: string;
+    /** Custom error handler */
+    onError?: (error: z.ZodError) => void;
+}): z.infer<TSchema> | null;
+
+/**
+ * Simple param validation without redirect
+ * Throws error if validation fails (for use in loaders/guards)
+ */
+export declare function validateParams<TSchema extends z.ZodType>(params: unknown, schema: TSchema): z.infer<TSchema>;
+
+/**
+ * Compact validation badge for toolbar
+ */
+export declare function ValidationBadge({ isValid, className, }: {
+    isValid: boolean;
+    className?: string;
+}): JSX.Element;
+
+export declare interface ValidationResult {
+    isValid: boolean;
+    parseError: string | null;
+    schemaErrors: z.ZodIssue[];
+    parsed: unknown;
+}
+
+export declare function ValidationStatus({ validation, showDetails, }: ValidationStatusProps): JSX.Element | null;
+
+export declare interface ValidationStatusProps {
+    validation: ValidationResult;
+    showDetails?: boolean;
+}
+
+export { }
+
+
+/**
+ * Extend TanStack Table's ColumnMeta to support custom sort field mapping.
+ * Used when the display field differs from the backend sort field
+ * (e.g., nested entity fields like 'protocol.protocolName').
+ */
+declare module '@tanstack/react-table' {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        /** Backend field path for sorting (when different from accessorKey) */
+        sortField?: string;
+        /** Sticky column positioning */
+        sticky?: 'right' | 'left';
+    }
+}