@nextlyhq/ui 0.0.2-alpha.33 → 0.0.2-alpha.35

package/dist/index.d.cts

@@ -133,7 +133,7 @@ declare const FormLabelWithTooltip: react.ForwardRefExoticComponent<FormLabelWit
  * - success: Light green background
  * - warning: Light amber background
  * - destructive: Light red background
- * - outline: Transparent background with  border border-primary/5
+ * - outline: Transparent background with  border border-border
  */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "primary" | "destructive" | "outline" | "success" | "warning" | null | undefined;
@@ -152,11 +152,11 @@ declare function Badge({ className, variant, ...props }: BadgeProps): react_jsx_
  * - Border radius: 0px (rounded-none)
  * - Padding: 24px (p-6) for header/content, 16px 24px for footer
  * - Shadow: sm (default), md (hover/elevated)
- * - Border: 1px solid  border border-primary/5 color
+ * - Border: 1px solid  border border-border color
  *
  * Variants:
  * - default: Standard card with subtle shadow
- * - interactive: Hover effects for clickable cards  (border border-primary/5 highlight, shadow increase)
+ * - interactive: Hover effects for clickable cards  (border border-border highlight, shadow increase)
  *   ⚠️ IMPORTANT: When using the interactive variant, you MUST add appropriate
  *   accessibility attributes:
  *   - Add role="button" or use an actual <button> wrapper
@@ -201,8 +201,8 @@ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElemen
 } & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
 interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
     /**
-     * Whether to hide the bottom  border border-primary/5 separator between header and content.
-     * Default: false  (border border-primary/5 is shown per design spec)
+     * Whether to hide the bottom  border border-border separator between header and content.
+     * Default: false  (border border-border is shown per design spec)
      */
     noBorder?: boolean;
 }
@@ -442,7 +442,7 @@ type ProgressProps = {
      * Visual variant for different states
      *
      * - `default`: Primary blue (bg-primary-500)
-     * - `success`: Green (bg-green-500)
+     * - `success`: Green (bg-success-500)
      * - `error`: Red (bg-destructive)
      *
      * @default "default"
@@ -509,7 +509,7 @@ declare const Progress: react.ForwardRefExoticComponent<{
      * Visual variant for different states
      *
      * - `default`: Primary blue (bg-primary-500)
-     * - `success`: Green (bg-green-500)
+     * - `success`: Green (bg-success-500)
      * - `error`: Red (bg-destructive)
      *
      * @default "default"
@@ -557,9 +557,9 @@ declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.C
  *
  * Implementation Notes:
  * - Uses Radix UI primitives for robust accessibility
- * - Visual "checked" state achieved via  border border-primary/5 expansion (border-[5px])
- * - No inner indicator needed -  border border-primary/5 expansion provides clear visual feedback
- * - Hover state changes  border border-primary/5 color for better interactivity
+ * - Visual "checked" state achieved via  border border-border expansion (border-[5px])
+ * - No inner indicator needed -  border border-border expansion provides clear visual feedback
+ * - Hover state changes  border border-border color for better interactivity
  */
 declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
@@ -595,7 +595,7 @@ type AccordionContentProps = ComponentPropsWithoutRef<typeof Content>;
  * Built on Radix UI primitives with WAI-ARIA compliance.
  *
  * Design Specs:
- * - AccordionItem border: 1px bottom  border border-primary/5 (border-b)
+ * - AccordionItem border: 1px bottom  border border-border (border-b)
  * - AccordionTrigger padding: 16px vertical (py-4)
  * - AccordionTrigger font: font-medium (500 weight)
  * - AccordionContent padding: 16px bottom, 0 top (pb-4 pt-0)
@@ -686,7 +686,7 @@ declare const Accordion: react.ForwardRefExoticComponent<(AccordionPrimitive.Acc
  * AccordionItem - Container for trigger and content
  *
  * Design Specs:
- * - Border: 1px bottom  border border-primary/5 (border-b) for visual separation
+ * - Border: 1px bottom  border border-border (border-b) for visual separation
  * - Each item represents a collapsible section
  *
  * Accessibility:
@@ -1021,8 +1021,8 @@ declare const TabsList: react.ForwardRefExoticComponent<Omit<_radix_ui_react_tab
  * - Padding: 6px 16px (px-4 py-2)
  * - Font: text-sm (14px), font-medium (500)
  * - Transition: 150ms (design system standard)
- * - Active state: blue text with blue bottom  border border-primary/5 (2px)
- * - Hover: blue text with blue bottom  border border-primary/5
+ * - Active state: blue text with blue bottom  border border-border (2px)
+ * - Hover: blue text with blue bottom  border border-border
  * - Gmail-inspired clean underline style
  *
  * Accessibility:
@@ -1780,7 +1780,7 @@ declare const CommandGroup: react.ForwardRefExoticComponent<Omit<{
 type CommandSeparatorProps = ComponentPropsWithoutRef<typeof Command$1.Separator>;
 /**
  * CommandSeparator - Visual divider between command groups.
- * 1px line with  border border-primary/5 color, 8px margin top/bottom.
+ * 1px line with  border border-border color, 8px margin top/bottom.
  */
 declare const CommandSeparator: react.ForwardRefExoticComponent<Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
@@ -1945,9 +1945,9 @@ declare const Spinner: react.ForwardRefExoticComponent<Omit<SpinnerProps, "ref">
  *
  * Customization:
  * All styling uses CSS variables from the design system:
- * - --normal-bg: Background color (uses --popover with fallback)
- * - --normal-text: Text color (uses --popover-foreground with fallback)
- * - --normal-border: Border color (uses --border with fallback)
+ * - --normal-bg: Background color (uses --nx-popover with fallback)
+ * - --normal-text: Text color (uses --nx-popover-foreground with fallback)
+ * - --normal-border: Border color (uses --nx-border with fallback)
  * - --border-radius: Border radius (uses --radius with fallback)
  *
  * Security:
@@ -2047,6 +2047,22 @@ interface TableEmptyProps {
  */
 declare function TableEmpty({ message }: TableEmptyProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * TableSkeleton Component
+ *
+ * Generic loading skeleton for data tables.
+ * Renders header, body, and footer skeleton bars inside a card.
+ * Unified with EntryTable skeleton pattern for consistency across all tables.
+ */
+
+interface TableSkeletonProps {
+    columns?: number;
+    rowCount?: number;
+    hideWrapper?: boolean;
+    hideFooter?: boolean;
+}
+declare const TableSkeleton: react.FC<TableSkeletonProps>;
+
 interface PaginationMeta {
     total: number;
     page: number;
@@ -2088,129 +2104,6 @@ interface ActionCallbacks<TData = unknown> {
 }
 type DataFetcher<TData> = (params: TableParams) => Promise<ListResponse<TData>>;
 
-/**
- * Props for TablePagination component
- */
-interface TablePaginationProps {
-    /** Pagination metadata from server */
-    meta: PaginationMeta;
-    /** Callback when page changes */
-    onPageChange: (page: number) => void;
-    /** Callback when page size changes */
-    onPageSizeChange: (pageSize: number) => void;
-    /** Pagination configuration */
-    config?: Required<PaginationConfig>;
-    /** Whether data is currently loading */
-    isLoading?: boolean;
-}
-/**
- * Pagination controls for tables
- */
-declare function TablePagination({ meta, onPageChange, onPageSizeChange, config, isLoading, }: TablePaginationProps): react_jsx_runtime.JSX.Element;
-
-/**
- * TableSkeleton Component
- *
- * Generic loading skeleton for data tables.
- * Renders header, body, and footer skeleton bars inside a card.
- * Unified with EntryTable skeleton pattern for consistency across all tables.
- */
-
-interface TableSkeletonProps {
-    columns?: number;
-    rowCount?: number;
-    hideWrapper?: boolean;
-    hideFooter?: boolean;
-}
-declare const TableSkeleton: react.FC<TableSkeletonProps>;
-
-/**
- * Column definition for ResponsiveTable
- *
- * Provides type-safe column definitions with proper type narrowing for render functions.
- *
- * @template T - The data type of items in the table
- * @template K - The specific key from T (defaults to any key of T)
- *
- * @example
- * ```tsx
- * interface User {
- *   id: string;
- *   name: string;
- *   age: number;
- * }
- *
- * // Type-safe column definition with proper inference
- * const columns: Column<User>[] = [
- *   {
- *     key: "name",
- *     label: "Name",
- *     // value is inferred as string, not string | number
- *     render: (value, user) => <strong>{value}</strong>
- *   },
- *   {
- *     key: "age",
- *     label: "Age",
- *     // value is inferred as number, not string | number
- *     render: (value) => `${value} years old`
- *   }
- * ];
- * ```
- */
-type Column<T, K extends keyof T = keyof T> = {
-    /** Unique key for the column (must match a property in T) */
-    key: K;
-    /** Display label for the column header */
-    label: react.ReactNode;
-    /** Optional custom renderer for cell content with type-safe value */
-    render?: (value: T[K], item: T) => react.ReactNode;
-    /** Hide column on mobile card view (optional, default: false) */
-    hideOnMobile?: boolean;
-    /** Hide the label on mobile card view (optional, default: false) */
-    hideLabelOnMobile?: boolean;
-    /** Optional custom className for the table header cell */
-    headerClassName?: string;
-    /** Optional custom className for the table body cell */
-    cellClassName?: string;
-};
-/**
- * Props for ResponsiveTable component
- *
- * @template T - The data type of items in the table, must have an 'id' property
- */
-type ResponsiveTableProps<T extends {
-    id: string;
-}> = {
-    /** Array of data items to display */
-    data: T[];
-    /** Array of column definitions */
-    columns: Column<T>[];
-    /** Optional callback when a row/card is clicked */
-    onRowClick?: (item: T) => void;
-    /** Optional custom renderer for mobile card view */
-    renderMobileCard?: (item: T, columns: Column<T>[]) => react.ReactNode;
-    /** Optional custom className for the container */
-    className?: string;
-    /** Optional empty state message */
-    emptyMessage?: string;
-    /** Optional ARIA label for the table (improves screen reader experience) */
-    ariaLabel?: string;
-    /** Optional custom className for the internal desktop table wrapper */
-    tableWrapperClassName?: string;
-    /** Optional footer content rendered inside the table card (e.g. Pagination) */
-    footer?: react.ReactNode;
-};
-/**
- * Ref type for ResponsiveTable component
- */
-type ResponsiveTableRef = HTMLDivElement;
-
-declare const ResponsiveTable: <T extends {
-    id: string;
-}>(props: ResponsiveTableProps<T> & {
-    ref?: react.ForwardedRef<HTMLDivElement>;
-}) => react.ReactElement;
-
 interface PortalProviderProps {
     /** The DOM element to portal overlay content into. Defaults to document.body (Radix default). */
     container: HTMLElement | null;
@@ -2228,7 +2121,7 @@ declare function usePortalContainer(): HTMLElement | undefined;
  * @example
  * ```typescript
  * cn('px-2 py-1', 'px-4') // => 'py-1 px-4'
- * cn('text-red-500', condition && 'text-blue-500')
+ * cn('text-muted-foreground', condition && 'text-foreground')
  * ```
  */
 declare function cn(...inputs: ClassValue[]): string;
@@ -2325,4 +2218,4 @@ declare const uiPreset: {
     };
 };
 
-export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type ActionCallbacks, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type Column, Command, CommandDialog, type CommandDialogProps, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, type CommandShortcutProps, type DataFetcher, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, DialogTitle, type DialogTitleProps, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type FilterInfo, FormLabelWithTooltip, type FormLabelWithTooltipProps, Input, type InputProps, Label, type ListResponse, type PaginationConfig, type PaginationMeta, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalProvider, Progress, type ProgressProps, RadioGroup, RadioGroupItem, ResponsiveTable, type ResponsiveTableProps, type ResponsiveTableRef, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, type SheetCloseProps, SheetContent, type SheetContentProps, type SheetContentRef, SheetDescription, type SheetDescriptionProps, type SheetDescriptionRef, SheetFooter, type SheetFooterProps, SheetHeader, type SheetHeaderProps, SheetOverlay, type SheetOverlayProps, type SheetOverlayRef, SheetPortal, type SheetProps, SheetTitle, type SheetTitleProps, type SheetTitleRef, SheetTrigger, type SheetTriggerProps, Skeleton, type SkeletonProps, type SortInfo, Spinner, type SpinnerProps, Switch, Table, TableBody, TableCaption, TableCell, TableEmpty, type TableEmptyProps, TableError, type TableErrorProps, TableFooter, TableHead, TableHeader, TableLoading, TablePagination, type TablePaginationProps, type TableParams, TableRow, TableSearch, type TableSearchProps, TableSkeleton, type TableSkeletonProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, cn, dialogContentVariants, inputVariants, progressVariants, selectTriggerVariants, sheetVariants, spinnerVariants, uiPreset, usePortalContainer };
+export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type ActionCallbacks, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, type CommandDialogProps, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, type CommandShortcutProps, type DataFetcher, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, DialogTitle, type DialogTitleProps, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type FilterInfo, FormLabelWithTooltip, type FormLabelWithTooltipProps, Input, type InputProps, Label, type ListResponse, type PaginationConfig, type PaginationMeta, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalProvider, Progress, type ProgressProps, RadioGroup, RadioGroupItem, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, type SheetCloseProps, SheetContent, type SheetContentProps, type SheetContentRef, SheetDescription, type SheetDescriptionProps, type SheetDescriptionRef, SheetFooter, type SheetFooterProps, SheetHeader, type SheetHeaderProps, SheetOverlay, type SheetOverlayProps, type SheetOverlayRef, SheetPortal, type SheetProps, SheetTitle, type SheetTitleProps, type SheetTitleRef, SheetTrigger, type SheetTriggerProps, Skeleton, type SkeletonProps, type SortInfo, Spinner, type SpinnerProps, Switch, Table, TableBody, TableCaption, TableCell, TableEmpty, type TableEmptyProps, TableError, type TableErrorProps, TableFooter, TableHead, TableHeader, TableLoading, type TableParams, TableRow, TableSearch, type TableSearchProps, TableSkeleton, type TableSkeletonProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, cn, dialogContentVariants, inputVariants, progressVariants, selectTriggerVariants, sheetVariants, spinnerVariants, uiPreset, usePortalContainer };

package/dist/index.d.ts

@@ -133,7 +133,7 @@ declare const FormLabelWithTooltip: react.ForwardRefExoticComponent<FormLabelWit
  * - success: Light green background
  * - warning: Light amber background
  * - destructive: Light red background
- * - outline: Transparent background with  border border-primary/5
+ * - outline: Transparent background with  border border-border
  */
 declare const badgeVariants: (props?: ({
     variant?: "default" | "primary" | "destructive" | "outline" | "success" | "warning" | null | undefined;
@@ -152,11 +152,11 @@ declare function Badge({ className, variant, ...props }: BadgeProps): react_jsx_
  * - Border radius: 0px (rounded-none)
  * - Padding: 24px (p-6) for header/content, 16px 24px for footer
  * - Shadow: sm (default), md (hover/elevated)
- * - Border: 1px solid  border border-primary/5 color
+ * - Border: 1px solid  border border-border color
  *
  * Variants:
  * - default: Standard card with subtle shadow
- * - interactive: Hover effects for clickable cards  (border border-primary/5 highlight, shadow increase)
+ * - interactive: Hover effects for clickable cards  (border border-border highlight, shadow increase)
  *   ⚠️ IMPORTANT: When using the interactive variant, you MUST add appropriate
  *   accessibility attributes:
  *   - Add role="button" or use an actual <button> wrapper
@@ -201,8 +201,8 @@ declare const Card: react.ForwardRefExoticComponent<HTMLAttributes<HTMLDivElemen
 } & class_variance_authority_types.ClassProp) | undefined) => string> & react.RefAttributes<HTMLDivElement>>;
 interface CardHeaderProps extends HTMLAttributes<HTMLDivElement> {
     /**
-     * Whether to hide the bottom  border border-primary/5 separator between header and content.
-     * Default: false  (border border-primary/5 is shown per design spec)
+     * Whether to hide the bottom  border border-border separator between header and content.
+     * Default: false  (border border-border is shown per design spec)
      */
     noBorder?: boolean;
 }
@@ -442,7 +442,7 @@ type ProgressProps = {
      * Visual variant for different states
      *
      * - `default`: Primary blue (bg-primary-500)
-     * - `success`: Green (bg-green-500)
+     * - `success`: Green (bg-success-500)
      * - `error`: Red (bg-destructive)
      *
      * @default "default"
@@ -509,7 +509,7 @@ declare const Progress: react.ForwardRefExoticComponent<{
      * Visual variant for different states
      *
      * - `default`: Primary blue (bg-primary-500)
-     * - `success`: Green (bg-green-500)
+     * - `success`: Green (bg-success-500)
      * - `error`: Red (bg-destructive)
      *
      * @default "default"
@@ -557,9 +557,9 @@ declare const Checkbox: react.ForwardRefExoticComponent<Omit<CheckboxPrimitive.C
  *
  * Implementation Notes:
  * - Uses Radix UI primitives for robust accessibility
- * - Visual "checked" state achieved via  border border-primary/5 expansion (border-[5px])
- * - No inner indicator needed -  border border-primary/5 expansion provides clear visual feedback
- * - Hover state changes  border border-primary/5 color for better interactivity
+ * - Visual "checked" state achieved via  border border-border expansion (border-[5px])
+ * - No inner indicator needed -  border border-border expansion provides clear visual feedback
+ * - Hover state changes  border border-border color for better interactivity
  */
 declare const RadioGroup: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupProps & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
 declare const RadioGroupItem: react.ForwardRefExoticComponent<Omit<RadioGroupPrimitive.RadioGroupItemProps & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
@@ -595,7 +595,7 @@ type AccordionContentProps = ComponentPropsWithoutRef<typeof Content>;
  * Built on Radix UI primitives with WAI-ARIA compliance.
  *
  * Design Specs:
- * - AccordionItem border: 1px bottom  border border-primary/5 (border-b)
+ * - AccordionItem border: 1px bottom  border border-border (border-b)
  * - AccordionTrigger padding: 16px vertical (py-4)
  * - AccordionTrigger font: font-medium (500 weight)
  * - AccordionContent padding: 16px bottom, 0 top (pb-4 pt-0)
@@ -686,7 +686,7 @@ declare const Accordion: react.ForwardRefExoticComponent<(AccordionPrimitive.Acc
  * AccordionItem - Container for trigger and content
  *
  * Design Specs:
- * - Border: 1px bottom  border border-primary/5 (border-b) for visual separation
+ * - Border: 1px bottom  border border-border (border-b) for visual separation
  * - Each item represents a collapsible section
  *
  * Accessibility:
@@ -1021,8 +1021,8 @@ declare const TabsList: react.ForwardRefExoticComponent<Omit<_radix_ui_react_tab
  * - Padding: 6px 16px (px-4 py-2)
  * - Font: text-sm (14px), font-medium (500)
  * - Transition: 150ms (design system standard)
- * - Active state: blue text with blue bottom  border border-primary/5 (2px)
- * - Hover: blue text with blue bottom  border border-primary/5
+ * - Active state: blue text with blue bottom  border border-border (2px)
+ * - Hover: blue text with blue bottom  border border-border
  * - Gmail-inspired clean underline style
  *
  * Accessibility:
@@ -1780,7 +1780,7 @@ declare const CommandGroup: react.ForwardRefExoticComponent<Omit<{
 type CommandSeparatorProps = ComponentPropsWithoutRef<typeof Command$1.Separator>;
 /**
  * CommandSeparator - Visual divider between command groups.
- * 1px line with  border border-primary/5 color, 8px margin top/bottom.
+ * 1px line with  border border-border color, 8px margin top/bottom.
  */
 declare const CommandSeparator: react.ForwardRefExoticComponent<Omit<Pick<Pick<react.DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "key" | keyof HTMLAttributes<HTMLDivElement>> & {
     ref?: React.Ref<HTMLDivElement>;
@@ -1945,9 +1945,9 @@ declare const Spinner: react.ForwardRefExoticComponent<Omit<SpinnerProps, "ref">
  *
  * Customization:
  * All styling uses CSS variables from the design system:
- * - --normal-bg: Background color (uses --popover with fallback)
- * - --normal-text: Text color (uses --popover-foreground with fallback)
- * - --normal-border: Border color (uses --border with fallback)
+ * - --normal-bg: Background color (uses --nx-popover with fallback)
+ * - --normal-text: Text color (uses --nx-popover-foreground with fallback)
+ * - --normal-border: Border color (uses --nx-border with fallback)
  * - --border-radius: Border radius (uses --radius with fallback)
  *
  * Security:
@@ -2047,6 +2047,22 @@ interface TableEmptyProps {
  */
 declare function TableEmpty({ message }: TableEmptyProps): react_jsx_runtime.JSX.Element;
 
+/**
+ * TableSkeleton Component
+ *
+ * Generic loading skeleton for data tables.
+ * Renders header, body, and footer skeleton bars inside a card.
+ * Unified with EntryTable skeleton pattern for consistency across all tables.
+ */
+
+interface TableSkeletonProps {
+    columns?: number;
+    rowCount?: number;
+    hideWrapper?: boolean;
+    hideFooter?: boolean;
+}
+declare const TableSkeleton: react.FC<TableSkeletonProps>;
+
 interface PaginationMeta {
     total: number;
     page: number;
@@ -2088,129 +2104,6 @@ interface ActionCallbacks<TData = unknown> {
 }
 type DataFetcher<TData> = (params: TableParams) => Promise<ListResponse<TData>>;
 
-/**
- * Props for TablePagination component
- */
-interface TablePaginationProps {
-    /** Pagination metadata from server */
-    meta: PaginationMeta;
-    /** Callback when page changes */
-    onPageChange: (page: number) => void;
-    /** Callback when page size changes */
-    onPageSizeChange: (pageSize: number) => void;
-    /** Pagination configuration */
-    config?: Required<PaginationConfig>;
-    /** Whether data is currently loading */
-    isLoading?: boolean;
-}
-/**
- * Pagination controls for tables
- */
-declare function TablePagination({ meta, onPageChange, onPageSizeChange, config, isLoading, }: TablePaginationProps): react_jsx_runtime.JSX.Element;
-
-/**
- * TableSkeleton Component
- *
- * Generic loading skeleton for data tables.
- * Renders header, body, and footer skeleton bars inside a card.
- * Unified with EntryTable skeleton pattern for consistency across all tables.
- */
-
-interface TableSkeletonProps {
-    columns?: number;
-    rowCount?: number;
-    hideWrapper?: boolean;
-    hideFooter?: boolean;
-}
-declare const TableSkeleton: react.FC<TableSkeletonProps>;
-
-/**
- * Column definition for ResponsiveTable
- *
- * Provides type-safe column definitions with proper type narrowing for render functions.
- *
- * @template T - The data type of items in the table
- * @template K - The specific key from T (defaults to any key of T)
- *
- * @example
- * ```tsx
- * interface User {
- *   id: string;
- *   name: string;
- *   age: number;
- * }
- *
- * // Type-safe column definition with proper inference
- * const columns: Column<User>[] = [
- *   {
- *     key: "name",
- *     label: "Name",
- *     // value is inferred as string, not string | number
- *     render: (value, user) => <strong>{value}</strong>
- *   },
- *   {
- *     key: "age",
- *     label: "Age",
- *     // value is inferred as number, not string | number
- *     render: (value) => `${value} years old`
- *   }
- * ];
- * ```
- */
-type Column<T, K extends keyof T = keyof T> = {
-    /** Unique key for the column (must match a property in T) */
-    key: K;
-    /** Display label for the column header */
-    label: react.ReactNode;
-    /** Optional custom renderer for cell content with type-safe value */
-    render?: (value: T[K], item: T) => react.ReactNode;
-    /** Hide column on mobile card view (optional, default: false) */
-    hideOnMobile?: boolean;
-    /** Hide the label on mobile card view (optional, default: false) */
-    hideLabelOnMobile?: boolean;
-    /** Optional custom className for the table header cell */
-    headerClassName?: string;
-    /** Optional custom className for the table body cell */
-    cellClassName?: string;
-};
-/**
- * Props for ResponsiveTable component
- *
- * @template T - The data type of items in the table, must have an 'id' property
- */
-type ResponsiveTableProps<T extends {
-    id: string;
-}> = {
-    /** Array of data items to display */
-    data: T[];
-    /** Array of column definitions */
-    columns: Column<T>[];
-    /** Optional callback when a row/card is clicked */
-    onRowClick?: (item: T) => void;
-    /** Optional custom renderer for mobile card view */
-    renderMobileCard?: (item: T, columns: Column<T>[]) => react.ReactNode;
-    /** Optional custom className for the container */
-    className?: string;
-    /** Optional empty state message */
-    emptyMessage?: string;
-    /** Optional ARIA label for the table (improves screen reader experience) */
-    ariaLabel?: string;
-    /** Optional custom className for the internal desktop table wrapper */
-    tableWrapperClassName?: string;
-    /** Optional footer content rendered inside the table card (e.g. Pagination) */
-    footer?: react.ReactNode;
-};
-/**
- * Ref type for ResponsiveTable component
- */
-type ResponsiveTableRef = HTMLDivElement;
-
-declare const ResponsiveTable: <T extends {
-    id: string;
-}>(props: ResponsiveTableProps<T> & {
-    ref?: react.ForwardedRef<HTMLDivElement>;
-}) => react.ReactElement;
-
 interface PortalProviderProps {
     /** The DOM element to portal overlay content into. Defaults to document.body (Radix default). */
     container: HTMLElement | null;
@@ -2228,7 +2121,7 @@ declare function usePortalContainer(): HTMLElement | undefined;
  * @example
  * ```typescript
  * cn('px-2 py-1', 'px-4') // => 'py-1 px-4'
- * cn('text-red-500', condition && 'text-blue-500')
+ * cn('text-muted-foreground', condition && 'text-foreground')
  * ```
  */
 declare function cn(...inputs: ClassValue[]): string;
@@ -2325,4 +2218,4 @@ declare const uiPreset: {
     };
 };
 
-export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type ActionCallbacks, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, type Column, Command, CommandDialog, type CommandDialogProps, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, type CommandShortcutProps, type DataFetcher, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, DialogTitle, type DialogTitleProps, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type FilterInfo, FormLabelWithTooltip, type FormLabelWithTooltipProps, Input, type InputProps, Label, type ListResponse, type PaginationConfig, type PaginationMeta, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalProvider, Progress, type ProgressProps, RadioGroup, RadioGroupItem, ResponsiveTable, type ResponsiveTableProps, type ResponsiveTableRef, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, type SheetCloseProps, SheetContent, type SheetContentProps, type SheetContentRef, SheetDescription, type SheetDescriptionProps, type SheetDescriptionRef, SheetFooter, type SheetFooterProps, SheetHeader, type SheetHeaderProps, SheetOverlay, type SheetOverlayProps, type SheetOverlayRef, SheetPortal, type SheetProps, SheetTitle, type SheetTitleProps, type SheetTitleRef, SheetTrigger, type SheetTriggerProps, Skeleton, type SkeletonProps, type SortInfo, Spinner, type SpinnerProps, Switch, Table, TableBody, TableCaption, TableCell, TableEmpty, type TableEmptyProps, TableError, type TableErrorProps, TableFooter, TableHead, TableHeader, TableLoading, TablePagination, type TablePaginationProps, type TableParams, TableRow, TableSearch, type TableSearchProps, TableSkeleton, type TableSkeletonProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, cn, dialogContentVariants, inputVariants, progressVariants, selectTriggerVariants, sheetVariants, spinnerVariants, uiPreset, usePortalContainer };
+export { Accordion, AccordionContent, type AccordionContentProps, AccordionItem, type AccordionItemProps, type AccordionProps, AccordionTrigger, type AccordionTriggerProps, type ActionCallbacks, Alert, AlertDescription, type AlertDescriptionProps, AlertDialog, AlertDialogAction, type AlertDialogActionProps, AlertDialogCancel, type AlertDialogCancelProps, AlertDialogContent, type AlertDialogContentProps, AlertDialogDescription, type AlertDialogDescriptionProps, AlertDialogFooter, type AlertDialogFooterProps, AlertDialogHeader, type AlertDialogHeaderProps, AlertDialogOverlay, type AlertDialogOverlayProps, AlertDialogPortal, AlertDialogTitle, type AlertDialogTitleProps, AlertDialogTrigger, type AlertProps, AlertTitle, type AlertTitleProps, Avatar, AvatarFallback, type AvatarFallbackProps, AvatarImage, type AvatarImageProps, type AvatarProps, Badge, type BadgeProps, Button, type ButtonProps, Card, CardAction, type CardActionProps, CardContent, type CardContentProps, CardDescription, type CardDescriptionProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardProps, CardTitle, type CardTitleProps, Checkbox, Collapsible, CollapsibleContent, CollapsibleTrigger, Command, CommandDialog, type CommandDialogProps, CommandEmpty, type CommandEmptyProps, CommandGroup, type CommandGroupProps, CommandInput, type CommandInputProps, CommandItem, type CommandItemProps, CommandList, type CommandListProps, type CommandProps, CommandSeparator, type CommandSeparatorProps, CommandShortcut, type CommandShortcutProps, type DataFetcher, Dialog, DialogClose, DialogContent, type DialogContentProps, DialogDescription, type DialogDescriptionProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogOverlay, type DialogOverlayProps, DialogPortal, DialogTitle, type DialogTitleProps, DialogTrigger, DropdownMenu, DropdownMenuCheckboxItem, type DropdownMenuCheckboxItemProps, DropdownMenuContent, type DropdownMenuContentProps, DropdownMenuGroup, DropdownMenuItem, type DropdownMenuItemProps, DropdownMenuLabel, type DropdownMenuLabelProps, DropdownMenuPortal, DropdownMenuRadioGroup, DropdownMenuRadioItem, type DropdownMenuRadioItemProps, DropdownMenuSeparator, type DropdownMenuSeparatorProps, DropdownMenuShortcut, type DropdownMenuShortcutProps, DropdownMenuSub, DropdownMenuSubContent, type DropdownMenuSubContentProps, DropdownMenuSubTrigger, type DropdownMenuSubTriggerProps, DropdownMenuTrigger, type FilterInfo, FormLabelWithTooltip, type FormLabelWithTooltipProps, Input, type InputProps, Label, type ListResponse, type PaginationConfig, type PaginationMeta, Popover, PopoverAnchor, PopoverContent, PopoverTrigger, PortalProvider, Progress, type ProgressProps, RadioGroup, RadioGroupItem, Select, SelectContent, SelectGroup, SelectItem, SelectLabel, SelectScrollDownButton, SelectScrollUpButton, SelectSeparator, SelectTrigger, type SelectTriggerProps, SelectValue, Separator, Sheet, SheetClose, type SheetCloseProps, SheetContent, type SheetContentProps, type SheetContentRef, SheetDescription, type SheetDescriptionProps, type SheetDescriptionRef, SheetFooter, type SheetFooterProps, SheetHeader, type SheetHeaderProps, SheetOverlay, type SheetOverlayProps, type SheetOverlayRef, SheetPortal, type SheetProps, SheetTitle, type SheetTitleProps, type SheetTitleRef, SheetTrigger, type SheetTriggerProps, Skeleton, type SkeletonProps, type SortInfo, Spinner, type SpinnerProps, Switch, Table, TableBody, TableCaption, TableCell, TableEmpty, type TableEmptyProps, TableError, type TableErrorProps, TableFooter, TableHead, TableHeader, TableLoading, type TableParams, TableRow, TableSearch, type TableSearchProps, TableSkeleton, type TableSkeletonProps, Tabs, TabsContent, type TabsContentProps, TabsList, type TabsListProps, type TabsProps, TabsTrigger, type TabsTriggerProps, Textarea, Toaster, Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, alertVariants, avatarVariants, badgeVariants, buttonVariants, cardVariants, cn, dialogContentVariants, inputVariants, progressVariants, selectTriggerVariants, sheetVariants, spinnerVariants, uiPreset, usePortalContainer };