@nar-bus/lena-ui-shared 1.3.3 → 1.3.4

package/dist/index.d.ts

@@ -26,6 +26,7 @@ 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';
@@ -667,7 +668,7 @@ export declare function createEmptyFilter(field: string, operator?: FilterState[
 
 export declare function CRUDTabContent<T extends {
     id: number;
-}>({ isActive, columns, fieldConfig, defaultSortBy, getRowId, allQueryKey, useSearchHook, deleteItem, isDeleting, detailPath, searchPlaceholder, emptyTitle, emptyDescription, entityType, getEntityName, viewLabel: viewLabelProp, deleteLabel: deleteLabelProp, refreshLabel: refreshLabelProp, createLabel: createLabelProp, CreateSheetComponent, hideToolbar, externalCreateSheetOpen, onExternalCreateSheetOpenChange, }: CRUDTabContentProps<T>): JSX.Element;
+}>({ isActive, columns, fieldConfig, defaultSortBy, getRowId, allQueryKey, detailKey, listKey, fetchDetail, fetchList, useSearchHook, deleteItem, isDeleting, detailPath, searchPlaceholder, emptyTitle, emptyDescription, entityType, getEntityName, viewLabel: viewLabelProp, deleteLabel: deleteLabelProp, refreshLabel: refreshLabelProp, createLabel: createLabelProp, CreateSheetComponent, hideToolbar, externalCreateSheetOpen, onExternalCreateSheetOpenChange, }: CRUDTabContentProps<T>): JSX.Element;
 
 export declare interface CRUDTabContentProps<T extends {
     id: number;
@@ -684,6 +685,14 @@ export declare interface CRUDTabContentProps<T extends {
     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;
@@ -741,7 +750,7 @@ export declare interface DataRowProps {
     size?: 'sm' | 'md';
 }
 
-export declare function DataTable<TData>({ columns, getRowId, data, isLoading, error, pagination, onPageChange, onPageSizeChange, pageSizeOptions, sortBy, sortDirection, onSortChange, searchValue, onSearchChange, searchPlaceholder, searchDebounceMs, fieldConfig, filters, onFiltersChange, enableRowSelection, rowSelection, onRowSelectionChange, bulkActions, rowActions, toolbarStart, toolbarEnd, className, toolbarVariant, emptyIcon, emptyTitle, emptyDescription, onRowClick, rowClassName, meta, headerColor, }: DataTableComponentProps<TData>): JSX.Element;
+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, toolbarVariant, emptyIcon, emptyTitle, emptyDescription, onRowClick, onRowHover, rowClassName, meta, headerColor, }: DataTableComponentProps<TData>): JSX.Element;
 
 declare interface DataTableActions {
     setGeneralSearch: (value: string) => void;
@@ -790,6 +799,7 @@ declare interface DataTableComponentProps<TData> {
     pagination: PaginationInfo;
     onPageChange: (page: number) => void;
     onPageSizeChange: (size: number) => void;
+    onPrefetchPage?: (page: number) => void;
     pageSizeOptions?: number[];
     sortBy: string;
     sortDirection: 'ASC' | 'DESC';
@@ -815,6 +825,7 @@ declare interface DataTableComponentProps<TData> {
     emptyTitle?: string;
     emptyDescription?: string;
     onRowClick?: (row: TData) => void;
+    onRowHover?: (row: TData) => void;
     rowClassName?: (row: TData) => string;
     meta?: Record<string, unknown>;
     /** Custom header color (CSS color value). Overrides --table-header variable */
@@ -1376,6 +1387,16 @@ export declare function formatDate(timestamp: DateInput_3): string;
  */
 export declare function formatDateTime(timestamp: DateInput_3): string;
 
+/**
+ * Format a timestamp to compact date with time (e.g., "27.03.26 15:30")
+ */
+export declare function formatDateTimeCompact(timestamp: DateInput_3): string;
+
+/**
+ * Format a timestamp to compact date with time and seconds (e.g., "27.03.26 15:30:45")
+ */
+export declare function formatDateTimeCompactFull(timestamp: DateInput_3): string;
+
 /**
  * Format a timestamp to full date with seconds (e.g., "Jan 1, 2024 14:30:45")
  */
@@ -2623,7 +2644,7 @@ export declare function Table({ className, ...props }: React_2.ComponentProps<"t
 
 export declare const TABLE_CELL_CLASSES = "px-2.5 py-1.5 text-xs";
 
-export declare const TABLE_CONTAINER_CLASSES = "isolate rounded-lg border border-border/80 bg-card overflow-clip shadow-sm";
+export declare const TABLE_CONTAINER_CLASSES = "rounded-lg border border-border/80 bg-card overflow-hidden shadow-sm";
 
 export declare const TABLE_HEADER_CLASSES = "px-2 py-0.5 text-xs font-semibold uppercase tracking-wider transition-colors";
 
@@ -3152,6 +3173,47 @@ export declare function useOptimisticPageResponse<T extends {
     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.
  *