@cryptlex/web-components 6.6.6-alpha50 → 6.6.6-alpha53

package/dist/components/data-table.js.map

@@ -1 +1 @@
-{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport {\n    closestCenter,\n    DndContext,\n    DragOverlay,\n    KeyboardSensor,\n    PointerSensor,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport {\n    arrayMove,\n    SortableContext,\n    sortableKeyboardCoordinates,\n    useSortable,\n    verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { keepPreviousData, useQuery } from '@tanstack/react-query';\n\nimport {\n    type Column,\n    type ColumnDef,\n    type ColumnHelper,\n    type ColumnOrderState,\n    createColumnHelper,\n    flexRender,\n    getCoreRowModel,\n    type Header,\n    type PaginationState,\n    type RowData,\n    type RowSelectionState,\n    type SortingState,\n    type Updater,\n    useReactTable,\n    type VisibilityState,\n} from '@tanstack/react-table';\nimport { useLocalStorage } from '@uidotdev/usehooks';\nimport { merge } from 'lodash-es';\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react';\nimport { Badge } from '../components/badge';\n\nimport { Button } from '../components/button';\nimport { DataTableFilter, type FiltersConfig, type TableFilter } from '../components/data-table-filter';\nimport { DialogMenu, type DialogMenuAction } from '../components/dialog-menu';\nimport { Loader } from '../components/loader';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport { SearchField } from '../components/searchfield';\nimport { TableBody, TableCell, Table as TableComponent, TableHead, TableHeader, TableRow } from '../components/table';\nimport { CountryName } from '../utilities/countries';\nimport { formatDate } from '../utilities/date';\nimport { formatDays, formatFilesize, formatNumber } from '../utilities/numbers';\nimport type { CtxResourceName } from '../utilities/resources';\nimport { useResourceFormatter } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { Checkbox } from './checkbox';\nimport {\n    IcColumns,\n    IcFirst,\n    IcGrip,\n    IcInfo,\n    IcLast,\n    IcLeft,\n    IcMoreVertical,\n    IcRefresh,\n    IcRight,\n    IcSortAsc,\n    IcSortDesc,\n    IcSortNone,\n} from './icons';\nimport { type TableAction, TableActions } from './table-actions';\n\nimport '@tanstack/react-table';\n\nimport type { Cell } from '@tanstack/react-table';\nexport type DisplayType = 'string' | 'boolean' | 'date' | 'number' | 'enum' | 'badge' | 'country' | 'fileSize' | 'days';\n\ndeclare module '@tanstack/react-table' {\n    interface ColumnMeta<TData extends RowData, TValue> {\n        displayType: DisplayType;\n    }\n}\n\n/** Reserved name for actions column */\n// export const ACTIONS_COLUMN_ID = 'tableActions';\n\nexport type TableFetchFn<in out TData extends object> = (\n    p: PaginationState,\n    s: SortingState,\n    q: string,\n    f: Record<string, any>\n) => Promise<{\n    total: number;\n    data: TData[] | undefined;\n}>;\nexport function getTableCallback<T extends object>(\n    getter: (\n        q: Record<string, any>\n    ) => Promise<{ data?: T[]; error?: { code?: string | null; message: string }; response: Response }>\n): { callback: TableFetchFn<T>; columnHelper: ColumnHelper<T> } {\n    const callback: TableFetchFn<T> = async (pagination, sorting, searching, filters) => {\n        const query = {\n            ...filters,\n            page: pagination.pageIndex + 1,\n            limit: pagination.pageSize,\n            sort: generateSortParam(sorting[0]),\n            search: searching,\n        };\n\n        const _f = await getter(query);\n\n        return {\n            total: Number.parseInt(_f.response.headers.get('Pagination-Count') || '0'),\n            data: _f.data,\n        };\n    };\n\n    const columnHelper = createColumnHelper<T>();\n\n    return { callback, columnHelper };\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n    if (sort) {\n        if (sort.desc) {\n            return `-${sort.id}`;\n        } else {\n            return `+${sort.id}`;\n        }\n    } else {\n        return '-createdAt';\n    }\n}\n\nconst cH = createColumnHelper<any>();\nconst TABLE_CHECK_BOX_COLUMN = [\n    cH.accessor('checkbox', {\n        header: ({ table }) => (\n            <Checkbox\n                isIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n                isSelected={table.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()}\n                onChange={() => table.toggleAllPageRowsSelected()}\n                aria-label=\"Select all\"\n            />\n        ),\n\n        cell: ({ row }) => (\n            <Checkbox isSelected={row.getIsSelected()} onChange={() => row.toggleSelected()} aria-label=\"Select row\" />\n        ),\n        enableSorting: false,\n        enableHiding: false,\n    }),\n];\n\nconst TABLE_ID_COLUMN = [\n    cH.accessor('id', {\n        header: 'ID',\n        meta: {\n            displayType: 'string',\n        },\n    }),\n];\nconst TABLE_DEFAULT_DATE_COLUMNS = [\n    cH.accessor('createdAt', {\n        header: 'Creation Date',\n        meta: {\n            displayType: 'date',\n        },\n        enableHiding: false,\n    }),\n    cH.accessor('updatedAt', {\n        header: 'Last Updated',\n        meta: {\n            displayType: 'date',\n        },\n        enableHiding: false,\n    }),\n];\n\nconst ACTIONS_COLUMN_ID = 'TableActions';\nconst getActionColumn = (rowActions: DialogMenuAction<any>[]) => {\n    if (rowActions.length === 0) return [];\n\n    return [\n        cH.accessor(ACTIONS_COLUMN_ID, {\n            header: 'Actions',\n            id: ACTIONS_COLUMN_ID,\n            enableHiding: false,\n            cell: ({ row }) => <DialogMenu label={<IcMoreVertical />} data={row.original} items={rowActions} />,\n            enableSorting: false,\n        }),\n    ];\n};\n\ntype DataTableFactory<T extends object, TOperation extends keyof operations> = {\n    resourceName: CtxResourceName;\n    callback: TableFetchFn<T>;\n    columns: ColumnDef<T, any>[];\n    tableActions: TableAction<T>[];\n    columnsToHideByDefault?: Partial<Record<keyof T, boolean>>; // Columns that are hidden by default\n    allowSelection?: boolean;\n    filterConfig: FiltersConfig<TOperation>;\n    initialFilters: TableFilter[];\n    rowActions?: DialogMenuAction<T>[];\n};\n\ntype DataTableState = {\n    sorting: SortingState;\n    pagination: PaginationState;\n};\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<T extends object, TOperation extends keyof operations>({\n    resourceName,\n    columns,\n    callback,\n    filterConfig,\n    columnsToHideByDefault = {},\n    allowSelection = false,\n    initialFilters = [],\n    tableActions,\n    rowActions,\n}: DataTableFactory<T, TOperation>) {\n    const [tableState, _setTableState] = useState<DataTableState>({\n        /** Reflect in URL in host application  */\n        pagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n        sorting: [], // Sorting state\n    });\n    //\n    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n\n    /** Reflect in URL in host application  */\n    const [searchQuery, setSearchQuery] = useState('');\n\n    const [columnOrder, setColumnOrder] = useLocalStorage<ColumnOrderState>(\n        `${resourceName}_ctx_column_order_preference`,\n        []\n    );\n    const [columnVisibility, setColumnVisibility] = useLocalStorage<VisibilityState>(\n        `${resourceName}_ctx_column_visibility_preference`,\n        {\n            id: false,\n            ...columnsToHideByDefault,\n        }\n    );\n\n    const [filters, setFilters] = useState(initialFilters);\n\n    const mergedFilters = useMemo(() => {\n        // TODO, generic transform fn\n        return filters\n            .map(tf => {\n                if (Array.isArray(tf.value)) {\n                    return {\n                        [tf.property]: {\n                            [tf.operator]: tf.value.join(','),\n                        },\n                    };\n                }\n                return {\n                    [tf.property]: {\n                        [tf.operator]: tf.value,\n                    },\n                };\n            })\n            .reduce((acc, current) => {\n                return merge(acc, current);\n            }, {});\n    }, [filters]);\n\n    // Update table state with new values\n    const updateTableState = (updates: Partial<DataTableState>) => {\n        _setTableState(prev => ({ ...prev, ...updates }));\n    };\n\n    const { sorting, pagination } = tableState;\n\n    const query = useQuery({\n        queryKey: [resourceName, pagination, sorting, searchQuery, mergedFilters],\n        queryFn: () => callback(pagination, sorting, searchQuery, mergedFilters),\n        placeholderData: keepPreviousData, // Keep previous data while loading new data\n        retry: 0,\n        refetchOnWindowFocus: false,\n    });\n\n    /**\n     * ID,createdAt and updatedAt will be added by default for all tables\n     * If selection is allowed, checkbox will be added\n     * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n     * If there are actions for the table, they will be placed fixed at the right side of table.\n     */\n    const cols: ColumnDef<any, any>[] = [\n        ...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n        ...TABLE_ID_COLUMN,\n        ...columns,\n        ...TABLE_DEFAULT_DATE_COLUMNS,\n        ...getActionColumn(rowActions ?? []),\n    ];\n\n    // Type-guard for updater\n    function isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n        return typeof updater === 'function';\n    }\n    // Utility function to resolve updater\n    function resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n        if (isUpdaterFunction(updater)) {\n            return updater(currentValue);\n        }\n        return updater;\n    }\n\n    // Use react-table's hook to create the table instance\n    const tanTable = useReactTable({\n        data: query.data?.data ?? [],\n        columns: cols,\n        getCoreRowModel: getCoreRowModel(),\n        rowCount: query.data?.total,\n        manualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n        onPaginationChange: updater => {\n            updateTableState({ pagination: resolveUpdater(updater, pagination) });\n        },\n        manualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n        onSortingChange: updater => {\n            setRowSelection({});\n            updateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n        },\n        manualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n        onColumnVisibilityChange: updater => {\n            setColumnVisibility(resolveUpdater(updater, columnVisibility));\n        },\n        onRowSelectionChange: updater => {\n            setRowSelection(resolveUpdater(updater, rowSelection));\n        },\n        onColumnOrderChange: updater => {\n            setColumnOrder(resolveUpdater(updater, columnOrder));\n        },\n        state: {\n            sorting: sorting,\n            columnVisibility: columnVisibility,\n            pagination: pagination,\n            rowSelection: rowSelection,\n            columnOrder: columnOrder,\n        },\n        meta: {\n            refetch: query.refetch,\n        },\n    });\n\n    // By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n    // This populates the columnIds in the columnOrder state\n    useEffect(() => {\n        setColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n    }, []);\n\n    return {\n        tableState,\n        updateTableState,\n        query,\n        setSearchQuery,\n        searchQuery,\n        tanTable,\n        mergedFilters,\n        filters,\n        setFilters,\n        filterConfig,\n        tableActions,\n    } as const;\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n// TODO, don't export this\nexport function useDataTable() {\n    const ctx = useContext(DataTableContext);\n    if (!ctx) {\n        throw Error('DataTable should be used within DataTableProvider.');\n    }\n    return ctx;\n}\n\nexport function DataTableProvider<T extends object, TOperation extends keyof operations>({\n    children,\n    ...props\n}: { children: React.ReactNode } & ReturnType<typeof useDataTableState<T, TOperation>>) {\n    // @ts-expect-error, propogating the generic type further will be more complex. Since this is a tightly coupled type, it should be okay but reviewed whenever useDataTableState changes.\n    return <DataTableContext.Provider value={props}>{children}</DataTableContext.Provider>;\n}\n\nexport type DataTableProps = React.ComponentProps<'section'>;\nexport function DataTable({ className, ...props }: DataTableProps) {\n    const { query, tanTable } = useDataTable();\n\n    return (\n        <>\n            {/* Table Actions Section */}\n            <section {...props} className={classNames('flex flex-col bg-elevation-1', className)}>\n                <Actions />\n                {/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n                <div className=\"w-full overflow-auto border-x h-table relative\" tabIndex={0}>\n                    {/* Table overlay with loader */}\n                    {query.isLoading && (\n                        <TableOverlay className=\"cursor-wait\">\n                            <Loader />\n                        </TableOverlay>\n                    )}\n                    {/* Table overlay for empty table */}\n                    {!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n                        // Empty table\n                        <TableOverlay className=\"cursor-not-allowed\">\n                            {!query.isFetching &&\n                                (query.isError ? (\n                                    <span className=\"flex gap-3 justify-center items-center\">\n                                        {/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n                                        {/* <span>{query.error}</span> */}\n                                        <IcInfo />\n                                        <span>{query.error.message}</span>\n                                    </span>\n                                ) : query.data?.data?.length === 0 ? (\n                                    <>No results found.</>\n                                ) : (\n                                    <>Unknown error. Please contact customer support.</>\n                                ))}\n                        </TableOverlay>\n                    )}\n                    {!query.isLoading && tanTable.getRowModel().rows.length !== 0 && (\n                        <TableContent className=\"w-full\" />\n                    )}\n                </div>\n\n                {/* Table Footer Section with Pagination and Column Picker */}\n                <div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n                    <div className=\"flex gap-icon\">\n                        <ColumnPicker />\n                        <PageSize />\n                    </div>\n                    <Paginator />\n                </div>\n            </section>\n        </>\n    );\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({ children, className }: { children: React.ReactNode; className?: string }) {\n    return (\n        <>\n            <span\n                className={classNames(\n                    className,\n                    'absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center'\n                )}\n            >\n                {children}\n            </span>\n            {/* Keep something in document flow with the correct height */}\n            <span className=\"relative h-full w-0 block\" />\n        </>\n    );\n}\n\n// TODO, ?include query param on Licenses, Activations and other future resources that need this\nfunction ColumnPicker() {\n    const { tanTable } = useDataTable();\n    const [activeId, setActiveId] = useState<string | null>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const sensors = useSensors(\n        useSensor(PointerSensor),\n        useSensor(KeyboardSensor, {\n            coordinateGetter: sortableKeyboardCoordinates,\n        })\n    );\n    return (\n        <DndContext\n            sensors={sensors}\n            collisionDetection={closestCenter}\n            onDragStart={event => {\n                const { active } = event;\n                setActiveId(active.id.toString());\n            }}\n            onDragEnd={event => {\n                const { active, over } = event;\n\n                if (over && active.id !== over.id) {\n                    const columnOrder = tanTable.getState().columnOrder;\n                    const oldIndex = columnOrder.indexOf(active.id.toString());\n                    const newIndex = columnOrder.indexOf(over.id.toString());\n                    tanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n                }\n\n                setActiveId(null);\n            }}\n        >\n            <SortableContext items={tanTable.getState().columnOrder} strategy={verticalListSortingStrategy}>\n                <EasyMenu\n                    label={\n                        <>\n                            <IcColumns className=\"inline align-bottom me-1\" />\n                            Columns\n                        </>\n                    }\n                    selectionMode=\"multiple\"\n                    items={tanTable.getAllFlatColumns()}\n                    // Using selectedKeys = 'all' does not mark MenuItems with isDisabled=true as selected. This is not the intended behaviour in this use-case.\n                    selectedKeys={tanTable.getVisibleFlatColumns().map(c => c.id)}\n                >\n                    <MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>\n                        (select all)\n                    </MenuItem>\n                    {tanTable.getState().columnOrder.map(colId => {\n                        const col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n                        // Don't show checkbox and actions columns in picker\n                        if (!col || col.id === 'checkbox' || col.id === ACTIONS_COLUMN_ID) return null;\n                        return <SortableItem key={col.id} column={col} />;\n                    })}\n                </EasyMenu>\n                <DragOverlay>\n                    {activeId ? (\n                        <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div>\n                    ) : null}\n                </DragOverlay>\n            </SortableContext>\n        </DndContext>\n    );\n\n    function SortableItem({ column }: { column: Column<any, unknown> }) {\n        const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: column.id });\n        const style = {\n            transform: CSS.Transform.toString(transform),\n            transition,\n            zIndex: '999',\n        };\n        return (\n            <MenuItem\n                ref={setNodeRef}\n                style={style}\n                {...attributes}\n                id={column.id}\n                onAction={() => column.toggleVisibility()}\n                isDisabled={!column.getCanHide()}\n                className=\"flex items-center\"\n            >\n                <IcGrip {...listeners} className=\"size-icon cursor-grab\" />\n                {getColumnHeaderText(column)}\n                {column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n            </MenuItem>\n        );\n    }\n}\n\nfunction Paginator() {\n    const { tanTable, query } = useDataTable();\n    const rowCount = query.data?.total ?? 0;\n    return (\n        <div className=\"flex items-center gap-2\">\n            <span className=\"whitespace-nowrap body-sm text-muted\">\n                {`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n                    (tanTable.getState().pagination.pageIndex + 1) * tanTable.getState().pagination.pageSize,\n                    rowCount\n                )} of ${rowCount?.toLocaleString()}`}\n            </span>\n\n            <Button\n                aria-label=\"First page\"\n                onPress={() => tanTable.firstPage()}\n                isDisabled={!tanTable.getCanPreviousPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcFirst />\n            </Button>\n            <Button\n                aria-label=\"Previous page\"\n                onPress={() => tanTable.previousPage()}\n                isDisabled={!tanTable.getCanPreviousPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcLeft />\n            </Button>\n            <Button\n                aria-label=\"Next page\"\n                onPress={() => tanTable.nextPage()}\n                isDisabled={!tanTable.getCanNextPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcRight />\n            </Button>\n            <Button\n                aria-label=\"Last page\"\n                onClick={() => tanTable.lastPage()}\n                isDisabled={!tanTable.getCanNextPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcLast />\n            </Button>\n        </div>\n    );\n}\n\nfunction PageSize() {\n    const { tanTable } = useDataTable();\n    const PAGE_SIZES = [10, 20, 30, 40, 50];\n\n    return (\n        <EasyMenu\n            label={tanTable.getState().pagination.pageSize.toString()}\n            selectionMode=\"single\"\n            selectedKeys={[tanTable.getState().pagination.pageSize.toString()]}\n            items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}\n        >\n            {items => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>}\n        </EasyMenu>\n    );\n}\n\nfunction Actions() {\n    const { query, tanTable, searchQuery, setSearchQuery, tableActions } = useDataTable();\n    const hasSelectedRows = tanTable.getSelectedRowModel().rows.length > 0;\n    const selectedRows = tanTable.getSelectedRowModel().rows.map(r => r.original);\n\n    const filteredActions = tableActions.filter(ta => ta.bulk === hasSelectedRows);\n\n    return (\n        <section className=\"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto\">\n            <div className=\"flex gap-icon\">\n                <Button\n                    aria-label=\"Refresh\"\n                    isPending={query.isFetching}\n                    onClick={() => query.refetch()}\n                    variant={'neutral'}\n                    size={'icon'}\n                >\n                    <IcRefresh />\n                </Button>\n\n                <TableActions items={filteredActions} rowsSelected={selectedRows} isFetching={query.isFetching} />\n            </div>\n            <div className=\"flex gap-icon\">\n                <DataTableFilter />\n                {<SearchField value={searchQuery} onChange={setSearchQuery} />}\n            </div>\n        </section>\n    );\n}\n\nfunction SortIcon({\n    direction,\n    ...props\n}: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n    if (direction === 'asc') return <IcSortAsc className=\"size-3.5\" {...props} />;\n    else if (direction === 'desc') return <IcSortDesc className=\"size-3.5\" {...props} />;\n    else return <IcSortNone className=\"size-3.5\" {...props} />;\n}\n\nfunction getColumnHeaderText(column: Column<any, unknown>): string {\n    const resourceFormatter = useResourceFormatter();\n    const headerDef = column.columnDef.header;\n    return typeof headerDef === 'string' ? headerDef : resourceFormatter(column.id);\n}\n\n/**\n * Renders a cell value based on the displayType metadata\n * @param cell - The cell to render\n * @returns The formatted value as a React node\n */\nfunction renderCellByDisplayType(cell: Cell<any, any>): React.ReactNode {\n    const displayType = cell.column.columnDef.meta?.displayType;\n    const value = cell.getValue();\n\n    if (value === null || value === undefined) {\n        return null;\n    }\n\n    switch (displayType) {\n        case 'date':\n            return formatDate(value);\n\n        case 'number':\n            return formatNumber(value);\n        case 'boolean':\n        case 'badge':\n            return <Badge className=\"uppercase w-full\">{String(value)}</Badge>;\n        case 'country':\n            return <CountryName value={value} />;\n        case 'enum':\n            return <span className=\"uppercase w-full\">{String(value)}</span>;\n        case 'fileSize':\n            return formatFilesize(value);\n        case 'days':\n            return formatDays(value);\n        default:\n            return String(value);\n    }\n}\n\nfunction HeaderText({ header }: { header: Header<any, unknown> }) {\n    const headerDef = header.column.columnDef.header;\n\n    if (typeof headerDef === 'string' || !headerDef) {\n        return getColumnHeaderText(header.column);\n    }\n\n    if (typeof headerDef === 'function') {\n        const result = headerDef(header.getContext());\n        if (typeof result === 'string') {\n            return getColumnHeaderText(header.column);\n        }\n        return flexRender(headerDef, header.getContext());\n    }\n\n    return flexRender(headerDef, header.getContext());\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n    const { tanTable } = useDataTable();\n    const tableCellStyle = (isSticky: boolean, className?: string, zIndex: string = 'z-50') =>\n        classNames(\n            'px-icon py-2 text-left body-sm font-medium whitespace-nowrap',\n            isSticky && `bg-elevation-1 sticky right-0 ${zIndex} text-center justify-center`,\n            className\n        );\n    return (\n        <TableComponent className={classNames('table-auto', className)}>\n            <TableHeader className=\"sticky top-0 z-10\">\n                {tanTable.getHeaderGroups().map(headerGroup => (\n                    <TableRow key={headerGroup.id}>\n                        {headerGroup.headers.map(header => (\n                            <TableHead\n                                scope=\"col\"\n                                key={header.id}\n                                colSpan={header.colSpan}\n                                className={tableCellStyle(header.id === ACTIONS_COLUMN_ID, 'bg-elevation-1')}\n                            >\n                                {!header.column.getCanSort() && !header.isPlaceholder && (\n                                    <div\n                                        className={classNames(\n                                            'w-full py-1 inline-flex items-center gap-1 body-sm',\n                                            header.id === ACTIONS_COLUMN_ID ? 'justify-center' : 'justify-start'\n                                        )}\n                                    >\n                                        <HeaderText header={header} />\n                                    </div>\n                                )}\n                                {header.column.getCanSort() && (\n                                    <Button\n                                        variant=\"ghost\"\n                                        className={classNames(\n                                            'w-full p-1',\n                                            header.id === ACTIONS_COLUMN_ID ? 'justify-center' : 'justify-start'\n                                        )}\n                                        onPress={header.column.getToggleSortingHandler()}\n                                    >\n                                        <span>\n                                            <HeaderText header={header} />\n                                        </span>\n                                        <SortIcon direction={header.column.getIsSorted()} />\n                                    </Button>\n                                )}\n                            </TableHead>\n                        ))}\n                    </TableRow>\n                ))}\n            </TableHeader>\n            <TableBody>\n                {tanTable.getRowModel().rows.map(row => (\n                    <TableRow\n                        className={classNames(\n                            'transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20'\n                        )}\n                        key={row.id}\n                        data-selected={row.getIsSelected()}\n                    >\n                        {row.getVisibleCells().map(cell => {\n                            const isActionsColumn = cell.column.id === ACTIONS_COLUMN_ID;\n                            const cellContent = cell.column.columnDef.meta?.displayType\n                                ? renderCellByDisplayType(cell)\n                                : flexRender(cell.column.columnDef.cell, cell.getContext());\n\n                            return (\n                                <TableCell\n                                    key={cell.id}\n                                    className={classNames(\n                                        tableCellStyle(isActionsColumn, undefined, 'z-1'),\n                                        isActionsColumn && 'flex justify-center items-center'\n                                    )}\n                                >\n                                    {cellContent}\n                                </TableCell>\n                            );\n                        })}\n                    </TableRow>\n                ))}\n            </TableBody>\n        </TableComponent>\n    );\n}\n","'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport { useRef } from 'react';\nimport { Button } from '../components/button';\nimport { useDataTable } from '../components/data-table';\nimport { TfDatePicker } from '../components/date-picker';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { MultiSelectProps } from '../components/multi-select';\nimport { Popover, PopoverTrigger } from '../components/popover';\nimport { useAppForm } from '../utilities/form-hook';\nimport { useResourceFormatter, type ApiFilters } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { IcAccount, IcCheck, IcDate, IcFile, IcFilter, IcLicense, IcMinus, IcRemove, type CtxIcon } from './icons';\nimport { TfMultipleIdSearchInput } from './id-search';\n\nexport const FILTER_COMPARISON_OPERATORS = [\n    'eq',\n    'ne',\n    'cn',\n    'nc',\n    'sw',\n    'ew',\n    'in',\n    'nin',\n    'gt',\n    'gte',\n    'lt',\n    'lte',\n] as const;\nexport type FilterComparisonOperator = (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<FilterComparisonOperator, string> = {\n    eq: 'equal to',\n    ne: 'not equal to',\n    cn: 'contains',\n    nc: 'does not contain',\n    sw: 'starts with',\n    ew: 'ends with',\n    in: 'includes',\n    nin: 'does not include',\n    gt: 'greater than',\n    gte: 'greater than or equal to',\n    lt: 'less than',\n    lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n    id: string;\n    type: T;\n    property: string;\n    operator: FilterComparisonOperator;\n    value: V | undefined;\n    displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype NumberLocalFilter = BaseLocalFilter<'number', number>;\n// DatePicker accepts a string,and converts it to a ZonedDateTime\ntype DateLocalFilter = BaseLocalFilter<'date', string>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', string[]>;\n// TODO, entitlementSets.productIds\nfunction createNewFilter(type: FilterType, property: string): TableFilter {\n    const id = `${property}-${Date.now()}`;\n    const operator = FilterOperations[type][0];\n\n    switch (type) {\n        case 'bool':\n            return { id, type, property, operator, value: true };\n        case 'string':\n            return { id, type, property, operator, value: '' };\n        case 'date':\n            return { id, type, property, operator, value: new Date().toISOString() };\n        case 'id':\n            return { id, type, property, operator, value: '' };\n        case 'id-search':\n            return { id, type, property, operator, value: [] };\n        case 'enum':\n            return { id, type, property, operator, value: new Set<string | number>() };\n        case 'number':\n            return { id, type, property, operator, value: 0 };\n    }\n}\n\nexport type TableFilter =\n    | EnumLocalFilter\n    | IdLocalFilter\n    | BoolLocalFilter\n    | StringLocalFilter\n    | DateLocalFilter\n    | IdSearchLocalFilter\n    | NumberLocalFilter;\n\nexport type FilterConfig =\n    | { type: 'enum'; options: MultiSelectProps['items'] }\n    | ({ type: 'id-search' } & Pick<React.ComponentProps<typeof TfMultipleIdSearchInput>, 'accessor' | 'resource'>)\n    | { type: 'id' }\n    | { type: 'bool' }\n    | { type: 'string' }\n    | { type: 'date' }\n    | { type: 'number' };\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n    bool: ['eq'],\n    enum: ['in', 'nin'],\n    id: ['in', 'nin'],\n    'id-search': ['in', 'nin'],\n    string: ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n    date: ['lt', 'gt'],\n    number: ['eq', 'ne', 'gt', 'gte', 'lt', 'lte'],\n};\n\n// TS workaround to get rid of filterConfig: Required<Record<never, FilterConfig>>\nexport type FiltersConfig<TOperation extends keyof operations> = [keyof ApiFilters<TOperation>] extends [never]\n    ? Record<string, FilterConfig>\n    : Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>;\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n    const { filters, query, setFilters, filterConfig } = useDataTable();\n\n    const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const DEFAULT_VALUES: { filters: TableFilter[] } = {\n        filters,\n    };\n    const form = useAppForm({\n        defaultValues: DEFAULT_VALUES,\n        onSubmit: ({ value }) => {\n            setFilters(value.filters);\n        },\n    });\n\n    // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n    const filterKeys = Object.keys(filterConfig).sort();\n\n    return (\n        <section {...props} className={classNames('flex gap-icon items-center', className)}>\n            <PopoverTrigger\n                onOpenChange={o => {\n                    // Set filters when the popover closes\n                    if (!o) {\n                        form.handleSubmit();\n                    } else {\n                        addFilterButtonRef.current?.focus();\n                    }\n                }}\n            >\n                <div className=\"relative\">\n                    {filters.length > 0 && (\n                        <div className=\"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5\"></div>\n                    )}\n                    <Button\n                        aria-label=\"Filter\"\n                        isDisabled={query.isPending || filterKeys.length === 0}\n                        type=\"button\"\n                        size={'icon'}\n                        variant={'neutral'}\n                    >\n                        <IcFilter />\n                    </Button>\n                </div>\n                {/* TODO, icon maps with dynamic imports? */}\n                {/* TODO open popover with form for property specific filter */}\n                {/* TODO, icons here??? */}\n                <Popover className=\"w-full p-icon\">\n                    <form\n                        onSubmit={e => {\n                            e.preventDefault();\n                        }}\n                        className=\"flex flex-col gap-icon max-h-table overflow-auto \"\n                    >\n                        <form.Field mode=\"array\" name={'filters'}>\n                            {field => {\n                                return (\n                                    <>\n                                        {field.state.value.map((lf, i) => {\n                                            return (\n                                                <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n                                                    <span className=\"body-sm\">{resourceFormatter(lf.property)}</span>\n                                                    <form.AppField key={lf.id} name={`filters[${i}].operator`}>\n                                                        {sf => (\n                                                            <sf.TfSingleSelect\n                                                                items={FilterOperations[lf.type].map(op => ({\n                                                                    id: op,\n                                                                    label: <>{COMPARISON_OPERATOR_LABELS[op]}</>,\n                                                                }))}\n                                                            />\n                                                        )}\n                                                    </form.AppField>\n\n                                                    {lf.type === 'bool' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfCheckbox autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'date' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {_ => <TfDatePicker autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'id' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfTextField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'string' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfTextField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'number' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfNumberField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    {lf.type === 'enum' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => {\n                                                                const config = filterConfig[lf.property];\n                                                                if (config.type !== 'enum') return null;\n                                                                return <sf.TfMultiSelect items={config.options} />;\n                                                            }}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    {lf.type === 'id-search' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {_ => {\n                                                                const config = filterConfig[lf.property];\n                                                                if (config.type !== 'id-search') return null;\n                                                                return (\n                                                                    <TfMultipleIdSearchInput\n                                                                        resource={config.resource}\n                                                                        accessor={config.accessor}\n                                                                    />\n                                                                );\n                                                            }}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    <Button\n                                                        type=\"button\"\n                                                        variant=\"neutral\"\n                                                        size=\"icon\"\n                                                        onPress={() => field.removeValue(i)}\n                                                    >\n                                                        <IcRemove />\n                                                    </Button>\n                                                </div>\n                                            );\n                                        })}\n                                        <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n                                            <EasyMenu label=\"Add filter\" autoFocus>\n                                                {filterKeys.sort().map(k => {\n                                                    const type = filterConfig[k].type;\n                                                    const Icon = FilterIcon[type];\n                                                    return (\n                                                        <MenuItem\n                                                            key={k}\n                                                            onAction={() => {\n                                                                const newFilter = createNewFilter(type, k);\n                                                                field.pushValue(newFilter);\n                                                            }}\n                                                        >\n                                                            {resourceFormatter(k)}\n                                                            <Icon />\n                                                        </MenuItem>\n                                                    );\n                                                })}\n                                            </EasyMenu>\n                                            {field.state.value.length > 0 ? (\n                                                <Button\n                                                    type=\"button\"\n                                                    variant=\"neutral\"\n                                                    onPress={() => {\n                                                        field.setValue([]);\n                                                    }}\n                                                >\n                                                    <IcRemove />\n                                                    Reset\n                                                </Button>\n                                            ) : null}\n                                        </div>\n                                    </>\n                                );\n                            }}\n                        </form.Field>\n                    </form>\n                </Popover>\n            </PopoverTrigger>\n        </section>\n    );\n}\n\nconst FilterIcon: Record<FilterConfig['type'], CtxIcon> = {\n    'id-search': IcFile,\n    bool: IcCheck,\n    date: IcDate,\n    enum: IcLicense,\n    id: IcAccount,\n    number: IcMinus,\n    string: IcCheck,\n};\n"],"names":["getTableCallback","getter","callback","pagination","sorting","searching","filters","query","generateSortParam","_f","columnHelper","createColumnHelper","sort","cH","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","TABLE_ID_COLUMN","TABLE_DEFAULT_DATE_COLUMNS","ACTIONS_COLUMN_ID","getActionColumn","rowActions","DialogMenu","IcMoreVertical","useDataTableState","resourceName","columns","filterConfig","columnsToHideByDefault","allowSelection","initialFilters","tableActions","tableState","_setTableState","useState","rowSelection","setRowSelection","searchQuery","setSearchQuery","columnOrder","setColumnOrder","useLocalStorage","columnVisibility","setColumnVisibility","setFilters","mergedFilters","useMemo","tf","acc","current","merge","updateTableState","updates","prev","useQuery","keepPreviousData","cols","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","useEffect","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","className","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","IcInfo","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","IcColumns","MenuItem","colId","col","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","IcGrip","getColumnHeaderText","SortIcon","rowCount","Button","IcFirst","IcLeft","IcRight","IcLast","PAGE_SIZES","s","items","hasSelectedRows","selectedRows","r","filteredActions","ta","IcRefresh","TableActions","DataTableFilter","SearchField","direction","IcSortAsc","IcSortDesc","IcSortNone","headerDef","renderCellByDisplayType","cell","displayType","value","formatDate","formatNumber","Badge","CountryName","formatFilesize","formatDays","HeaderText","header","flexRender","tableCellStyle","isSticky","zIndex","TableComponent","TableHeader","headerGroup","TableRow","TableHead","TableBody","isActionsColumn","cellContent","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","createNewFilter","type","property","id","operator","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","filterKeys","PopoverTrigger","o","IcFilter","Popover","e","field","lf","i","sf","op","_","TfDatePicker","config","TfMultipleIdSearchInput","IcRemove","k","Icon","FilterIcon","newFilter","IcFile","IcCheck","IcDate","IcLicense","IcAccount","IcMinus"],"mappings":"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"}
+{"version":3,"file":"data-table.js","sources":["../../lib/components/data-table.tsx","../../lib/components/data-table-filter.tsx"],"sourcesContent":["'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport {\n    closestCenter,\n    DndContext,\n    DragOverlay,\n    KeyboardSensor,\n    PointerSensor,\n    useSensor,\n    useSensors,\n} from '@dnd-kit/core';\nimport {\n    arrayMove,\n    SortableContext,\n    sortableKeyboardCoordinates,\n    useSortable,\n    verticalListSortingStrategy,\n} from '@dnd-kit/sortable';\nimport { CSS } from '@dnd-kit/utilities';\nimport { useQuery } from '@tanstack/react-query';\n\nimport {\n    type Column,\n    type ColumnDef,\n    type ColumnOrderState,\n    createColumnHelper,\n    flexRender,\n    getCoreRowModel,\n    type Header,\n    type PaginationState,\n    type RowData,\n    type RowSelectionState,\n    type SortingState,\n    type Updater,\n    useReactTable,\n    type VisibilityState,\n} from '@tanstack/react-table';\nimport { useLocalStorage } from '@uidotdev/usehooks';\nimport { merge } from 'lodash-es';\nimport { createContext, useContext, useEffect, useMemo, useState } from 'react';\nimport { Badge } from '../components/badge';\n\nimport { Button } from '../components/button';\nimport { DataTableFilter, type FiltersConfig, type TableFilter } from '../components/data-table-filter';\nimport { DialogMenu, type DialogMenuAction } from '../components/dialog-menu';\nimport { Loader } from '../components/loader';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport { SearchField } from '../components/searchfield';\nimport { TableBody, TableCell, Table as TableComponent, TableHead, TableHeader, TableRow } from '../components/table';\nimport { CountryName } from '../utilities/countries';\nimport { formatDate } from '../utilities/date';\nimport { formatDays, formatFilesize, formatNumber } from '../utilities/numbers';\nimport { type ApiResponseBody, useResourceFormatter } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { Checkbox } from './checkbox';\nimport { type TableAction, TableActions } from './data-table-actions';\nimport {\n    IcColumns,\n    IcFirst,\n    IcGrip,\n    IcInfo,\n    IcLast,\n    IcLeft,\n    IcMoreVertical,\n    IcRefresh,\n    IcRight,\n    IcSortAsc,\n    IcSortDesc,\n    IcSortNone,\n} from './icons';\n\nimport type { Cell, ColumnHelper } from '@tanstack/react-table';\nimport type { ClientPathsWithMethod } from 'openapi-fetch';\nimport { type CtxClientType, useCtxClient } from '../utilities/ctx-client';\nexport type DisplayType = 'string' | 'boolean' | 'date' | 'number' | 'enum' | 'badge' | 'country' | 'fileSize' | 'days';\n\ndeclare module '@tanstack/react-table' {\n    interface ColumnMeta<TData extends RowData, TValue> {\n        displayType: DisplayType;\n    }\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n    if (sort) {\n        if (sort.desc) {\n            return `-${sort.id}`;\n        } else {\n            return `+${sort.id}`;\n        }\n    } else {\n        return '-createdAt';\n    }\n}\n\nconst cH = createColumnHelper<any>();\nconst TABLE_CHECK_BOX_COLUMN = [\n    cH.accessor('checkbox', {\n        header: ({ table }) => (\n            <Checkbox\n                isIndeterminate={table.getIsSomeRowsSelected() && !table.getIsAllPageRowsSelected()}\n                isSelected={table.getIsAllPageRowsSelected() || table.getIsSomePageRowsSelected()}\n                onChange={() => table.toggleAllPageRowsSelected()}\n                aria-label=\"Select all\"\n            />\n        ),\n\n        cell: ({ row }) => (\n            <Checkbox isSelected={row.getIsSelected()} onChange={() => row.toggleSelected()} aria-label=\"Select row\" />\n        ),\n        enableSorting: false,\n        enableHiding: false,\n    }),\n];\n\nconst ACTIONS_COLUMN_ID = 'TableActions';\nconst getActionColumn = (rowActions: DialogMenuAction<any>[]) => {\n    if (rowActions.length === 0) return [];\n\n    return [\n        cH.accessor(ACTIONS_COLUMN_ID, {\n            header: 'Actions',\n            id: ACTIONS_COLUMN_ID,\n            enableHiding: false,\n            cell: ({ row }) => <DialogMenu label={<IcMoreVertical />} data={row.original} items={rowActions} />,\n            enableSorting: false,\n        }),\n    ];\n};\n\ntype DataTableFactory<T extends object, TOperation extends keyof operations> = {\n    path: NoInfer<ClientPathsWithMethod<CtxClientType, 'get'>>;\n    columns: ColumnDef<T, any>[];\n    tableActions: TableAction<T>[];\n    columnsToHideByDefault?: Partial<Record<keyof T, boolean>>; // Columns that are hidden by default\n    allowSelection?: boolean;\n    filterConfig: FiltersConfig<TOperation>;\n    initialFilters: TableFilter[];\n    rowActions?: DialogMenuAction<T>[];\n};\n\ntype DataTableState = {\n    sorting: SortingState;\n    pagination: PaginationState;\n};\n\nexport function getColumnHelper<O extends keyof operations>(): ColumnHelper<ApiResponseBody<O>> {\n    return createColumnHelper<ApiResponseBody<O>>();\n}\n/**\n * Hook for handling all data-table state. Used in DataTableContext\n */\nexport function useDataTableState<T extends object, TOperation extends keyof operations>({\n    path,\n    columns,\n    filterConfig,\n    columnsToHideByDefault = {},\n    allowSelection = false,\n    initialFilters = [],\n    tableActions,\n    rowActions,\n}: DataTableFactory<T, TOperation>) {\n    const [tableState, _setTableState] = useState<DataTableState>({\n        /** Reflect in URL in host application  */\n        pagination: { pageIndex: 0, pageSize: 20 }, // Pagination state\n        sorting: [], // Sorting state\n    });\n\n    const { sorting, pagination } = tableState;\n\n    const [searchQuery, setSearchQuery] = useState('');\n\n    const [rowSelection, setRowSelection] = useState<RowSelectionState>({});\n\n    /** Reflect in URL in host application  */\n    const [filters, setFilters] = useState(initialFilters);\n    const mergedFilters = useMemo(() => {\n        // TODO, generic transform fn\n        return filters\n            .map(tf => {\n                if (Array.isArray(tf.value)) {\n                    return {\n                        [tf.property]: {\n                            [tf.operator]: tf.value.join(','),\n                        },\n                    };\n                }\n                return {\n                    [tf.property]: {\n                        [tf.operator]: tf.value,\n                    },\n                };\n            })\n            .reduce((acc, current) => {\n                return merge(acc, current);\n            }, {});\n    }, [filters]);\n\n    const queryParameters = {\n        ...filters,\n        page: pagination.pageIndex + 1,\n        limit: pagination.pageSize,\n        sort: generateSortParam(sorting[0]),\n        search: searchQuery,\n    };\n\n    const client = useCtxClient();\n    // TODO, this seems incorrect, verify\n    const queryKey = ['get', path];\n\n    const [columnOrder, setColumnOrder] = useLocalStorage<ColumnOrderState>(\n        `${queryKey.join('')}_ctx_column_order_preference`,\n        []\n    );\n    const [columnVisibility, setColumnVisibility] = useLocalStorage<VisibilityState>(\n        `${queryKey.join('')}_ctx_column_visibility_preference`,\n        {\n            id: false,\n            ...columnsToHideByDefault,\n        }\n    );\n\n    // Update table state with new values\n    const updateTableState = (updates: Partial<DataTableState>) => {\n        _setTableState(prev => ({ ...prev, ...updates }));\n    };\n\n    const query = useQuery({\n        queryKey,\n        queryFn: async () => {\n            const res = await client.GET(path, { params: { query: queryParameters } });\n            return {\n                data: (res.data ?? []) as T[],\n                total: Number.parseInt(res.response.headers.get('Pagination-Count') || '0'),\n            };\n        },\n    });\n    /**\n     * ID,createdAt and updatedAt will be added by default for all tables\n     * If selection is allowed, checkbox will be added\n     * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n     * If there are actions for the table, they will be placed fixed at the right side of table.\n     */\n    const cols: ColumnDef<any, any>[] = [\n        ...(allowSelection ? TABLE_CHECK_BOX_COLUMN : []),\n        ...columns,\n        ...getActionColumn(rowActions ?? []),\n    ];\n\n    // Type-guard for updater\n    function isUpdaterFunction<T>(updater: Updater<T>): updater is (old: T) => T {\n        return typeof updater === 'function';\n    }\n    // Utility function to resolve updater\n    function resolveUpdater<T>(updater: Updater<T>, currentValue: T) {\n        if (isUpdaterFunction(updater)) {\n            return updater(currentValue);\n        }\n        return updater;\n    }\n\n    // Use react-table's hook to create the table instance\n    const tanTable = useReactTable({\n        data: query.data?.data ?? [],\n        columns: cols,\n        getCoreRowModel: getCoreRowModel(),\n        rowCount: query.data?.total ?? 0,\n        manualPagination: true, // Handle pagination manually since pagination is done server side for data tables\n        onPaginationChange: updater => {\n            updateTableState({ pagination: resolveUpdater(updater, pagination) });\n        },\n        manualSorting: true, // Handle sorting manually since sorting is done server side for data tables\n        onSortingChange: updater => {\n            setRowSelection({});\n            updateTableState({ sorting: [...resolveUpdater(updater, sorting)] }); // Reset selection when sorting.\n        },\n        manualFiltering: true, // Handle filtering manually since filtering is done server side for data tables\n        onColumnVisibilityChange: updater => {\n            setColumnVisibility(resolveUpdater(updater, columnVisibility));\n        },\n        onRowSelectionChange: updater => {\n            setRowSelection(resolveUpdater(updater, rowSelection));\n        },\n        onColumnOrderChange: updater => {\n            setColumnOrder(resolveUpdater(updater, columnOrder));\n        },\n        state: {\n            sorting: sorting,\n            columnVisibility: columnVisibility,\n            pagination: pagination,\n            rowSelection: rowSelection,\n            columnOrder: columnOrder,\n        },\n        meta: {\n            refetch: query.refetch,\n        },\n    });\n\n    // By default, ColumnDef does not give guarantees of column.id existing. Once useReactTable is called, all columns are assigned IDs.\n    // This populates the columnIds in the columnOrder state\n    useEffect(() => {\n        setColumnOrder([...tanTable.getAllLeafColumns().map(c => c.id)]);\n    }, []);\n\n    return {\n        tableState,\n        updateTableState,\n        query,\n        setSearchQuery,\n        searchQuery,\n        tanTable,\n        mergedFilters,\n        filters,\n        setFilters,\n        filterConfig,\n        tableActions,\n    } as const;\n}\n\nexport const DataTableContext = createContext<ReturnType<typeof useDataTableState> | null>(null);\n// TODO, don't export this\nexport function useDataTable() {\n    const ctx = useContext(DataTableContext);\n    if (!ctx) {\n        throw Error('DataTable should be used within DataTableProvider.');\n    }\n    return ctx;\n}\n\nexport function DataTableProvider<T extends object, TOperation extends keyof operations>({\n    children,\n    ...props\n}: { children: React.ReactNode } & ReturnType<typeof useDataTableState<T, TOperation>>) {\n    // @ts-expect-error, propogating the generic type further will be more complex. Since this is a tightly coupled type, it should be okay but reviewed whenever useDataTableState changes.\n    return <DataTableContext.Provider value={props}>{children}</DataTableContext.Provider>;\n}\n\nexport type DataTableProps = React.ComponentProps<'section'>;\nexport function DataTable({ className, ...props }: DataTableProps) {\n    const { query, tanTable } = useDataTable();\n\n    return (\n        <>\n            {/* Table Actions Section */}\n            <section {...props} className={classNames('flex flex-col bg-elevation-1', className)}>\n                <Actions />\n                {/* The div here is necessary because TableContent is internally a <table> tag and does not respect width, height CSS */}\n                <div className=\"w-full overflow-auto border-x h-table relative\" tabIndex={0}>\n                    {/* Table overlay with loader */}\n                    {query.isLoading && (\n                        <TableOverlay className=\"cursor-wait\">\n                            <Loader />\n                        </TableOverlay>\n                    )}\n                    {/* Table overlay for empty table */}\n                    {!query.isLoading && tanTable.getRowModel().rows.length === 0 && (\n                        // Empty table\n                        <TableOverlay className=\"cursor-not-allowed\">\n                            {!query.isFetching &&\n                                (query.isError ? (\n                                    <span className=\"flex gap-3 justify-center items-center\">\n                                        {/* TODO (mudasir-pandith) Check for 403 explicitly!! */}\n                                        {/* <span>{query.error}</span> */}\n                                        <IcInfo />\n                                        <span>{query.error.message}</span>\n                                    </span>\n                                ) : query.data?.data?.length === 0 ? (\n                                    <>No results found.</>\n                                ) : (\n                                    <>Unknown error. Please contact customer support.</>\n                                ))}\n                        </TableOverlay>\n                    )}\n                    {!query.isLoading && tanTable.getRowModel().rows.length !== 0 && (\n                        <TableContent className=\"w-full\" />\n                    )}\n                </div>\n\n                {/* Table Footer Section with Pagination and Column Picker */}\n                <div className=\"flex w-full justify-between border gap-icon p-icon overflow-x-auto\">\n                    <div className=\"flex gap-icon\">\n                        <ColumnPicker />\n                        <PageSize />\n                    </div>\n                    <Paginator />\n                </div>\n            </section>\n        </>\n    );\n}\n/** Table overlay to be shown for loaders or other messages */\nfunction TableOverlay({ children, className }: { children: React.ReactNode; className?: string }) {\n    return (\n        <>\n            <span\n                className={classNames(\n                    className,\n                    'absolute top-0 bg-elevation-1 text-foreground z-20 size-full body-sm flex items-center justify-center'\n                )}\n            >\n                {children}\n            </span>\n            {/* Keep something in document flow with the correct height */}\n            <span className=\"relative h-full w-0 block\" />\n        </>\n    );\n}\n\n// TODO, ?include query param on Licenses, Activations and other future resources that need this\nfunction ColumnPicker() {\n    const { tanTable } = useDataTable();\n    const [activeId, setActiveId] = useState<string | null>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const sensors = useSensors(\n        useSensor(PointerSensor),\n        useSensor(KeyboardSensor, {\n            coordinateGetter: sortableKeyboardCoordinates,\n        })\n    );\n    return (\n        <DndContext\n            sensors={sensors}\n            collisionDetection={closestCenter}\n            onDragStart={event => {\n                const { active } = event;\n                setActiveId(active.id.toString());\n            }}\n            onDragEnd={event => {\n                const { active, over } = event;\n\n                if (over && active.id !== over.id) {\n                    const columnOrder = tanTable.getState().columnOrder;\n                    const oldIndex = columnOrder.indexOf(active.id.toString());\n                    const newIndex = columnOrder.indexOf(over.id.toString());\n                    tanTable.setColumnOrder([...arrayMove(columnOrder, oldIndex, newIndex)]);\n                }\n\n                setActiveId(null);\n            }}\n        >\n            <SortableContext items={tanTable.getState().columnOrder} strategy={verticalListSortingStrategy}>\n                <EasyMenu\n                    label={\n                        <>\n                            <IcColumns className=\"inline align-bottom me-1\" />\n                            Columns\n                        </>\n                    }\n                    selectionMode=\"multiple\"\n                    items={tanTable.getAllFlatColumns()}\n                    // Using selectedKeys = 'all' does not mark MenuItems with isDisabled=true as selected. This is not the intended behaviour in this use-case.\n                    selectedKeys={tanTable.getVisibleFlatColumns().map(c => c.id)}\n                >\n                    <MenuItem onAction={() => tanTable.toggleAllColumnsVisible()} className={'italic'}>\n                        (select all)\n                    </MenuItem>\n                    {tanTable.getState().columnOrder.map(colId => {\n                        const col = tanTable.getAllFlatColumns().find(c => c.id === colId);\n                        // Don't show checkbox and actions columns in picker\n                        if (!col || col.id === 'checkbox' || col.id === ACTIONS_COLUMN_ID) return null;\n                        return <SortableItem key={col.id} column={col} />;\n                    })}\n                </EasyMenu>\n                <DragOverlay>\n                    {activeId ? (\n                        <div className=\"opacity-70 border-2 border-primary\">{resourceFormatter(activeId)}</div>\n                    ) : null}\n                </DragOverlay>\n            </SortableContext>\n        </DndContext>\n    );\n\n    function SortableItem({ column }: { column: Column<any, unknown> }) {\n        const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: column.id });\n        const style = {\n            transform: CSS.Transform.toString(transform),\n            transition,\n            zIndex: '999',\n        };\n        return (\n            <MenuItem\n                ref={setNodeRef}\n                style={style}\n                {...attributes}\n                id={column.id}\n                onAction={() => column.toggleVisibility()}\n                isDisabled={!column.getCanHide()}\n                className=\"flex items-center\"\n            >\n                <IcGrip {...listeners} className=\"size-icon cursor-grab\" />\n                {getColumnHeaderText(column)}\n                {column.getIsSorted() && <SortIcon className=\"size-icon\" direction={column.getIsSorted()} />}\n            </MenuItem>\n        );\n    }\n}\n\nfunction Paginator() {\n    const { tanTable } = useDataTable();\n    const rowCount = tanTable.getRowCount();\n    return (\n        <div className=\"flex items-center gap-2\">\n            <span className=\"whitespace-nowrap body-sm text-muted\">\n                {`${tanTable.getState().pagination.pageIndex * tanTable.getState().pagination.pageSize + 1} - ${Math.min(\n                    (tanTable.getState().pagination.pageIndex + 1) * tanTable.getState().pagination.pageSize,\n                    rowCount\n                )} of ${rowCount?.toLocaleString()}`}\n            </span>\n\n            <Button\n                aria-label=\"First page\"\n                onPress={() => tanTable.firstPage()}\n                isDisabled={!tanTable.getCanPreviousPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcFirst />\n            </Button>\n            <Button\n                aria-label=\"Previous page\"\n                onPress={() => tanTable.previousPage()}\n                isDisabled={!tanTable.getCanPreviousPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcLeft />\n            </Button>\n            <Button\n                aria-label=\"Next page\"\n                onPress={() => tanTable.nextPage()}\n                isDisabled={!tanTable.getCanNextPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcRight />\n            </Button>\n            <Button\n                aria-label=\"Last page\"\n                onClick={() => tanTable.lastPage()}\n                isDisabled={!tanTable.getCanNextPage()}\n                variant=\"neutral\"\n                size={'icon'}\n            >\n                <IcLast />\n            </Button>\n        </div>\n    );\n}\n\nfunction PageSize() {\n    const { tanTable } = useDataTable();\n    const PAGE_SIZES = [10, 20, 30, 40, 50];\n\n    return (\n        <EasyMenu\n            label={tanTable.getState().pagination.pageSize.toString()}\n            selectionMode=\"single\"\n            selectedKeys={[tanTable.getState().pagination.pageSize.toString()]}\n            items={PAGE_SIZES.map(s => ({ id: s.toString(), value: s }))}\n        >\n            {items => <MenuItem onAction={() => tanTable.setPageSize(items.value)}>{items.value}</MenuItem>}\n        </EasyMenu>\n    );\n}\n\nfunction Actions() {\n    const { query, tanTable, searchQuery, setSearchQuery, tableActions } = useDataTable();\n    const hasSelectedRows = tanTable.getSelectedRowModel().rows.length > 0;\n    const selectedRows = tanTable.getSelectedRowModel().rows.map(r => r.original);\n\n    const filteredActions = tableActions.filter(ta => ta.bulk === hasSelectedRows);\n\n    return (\n        <section className=\"flex bg-elevation-1 justify-between my-0 p-icon border gap-icon overflow-auto\">\n            <div className=\"flex gap-icon\">\n                <Button\n                    aria-label=\"Refresh\"\n                    isPending={query.isFetching}\n                    onClick={() => query.refetch()}\n                    variant={'neutral'}\n                    size={'icon'}\n                >\n                    <IcRefresh />\n                </Button>\n\n                <TableActions items={filteredActions} rowsSelected={selectedRows} isFetching={query.isFetching} />\n            </div>\n            <div className=\"flex gap-icon\">\n                <DataTableFilter />\n                {<SearchField value={searchQuery} onChange={setSearchQuery} />}\n            </div>\n        </section>\n    );\n}\n\nfunction SortIcon({\n    direction,\n    ...props\n}: { direction: 'asc' | 'desc' | false } & Omit<React.ComponentProps<'svg'>, 'direction'>) {\n    if (direction === 'asc') return <IcSortAsc className=\"size-3.5\" {...props} />;\n    else if (direction === 'desc') return <IcSortDesc className=\"size-3.5\" {...props} />;\n    else return <IcSortNone className=\"size-3.5\" {...props} />;\n}\n\nfunction getColumnHeaderText(column: Column<any, unknown>): string {\n    const resourceFormatter = useResourceFormatter();\n    const headerDef = column.columnDef.header;\n    return typeof headerDef === 'string' ? headerDef : resourceFormatter(column.id);\n}\n\n/**\n * Renders a cell value based on the displayType metadata\n * @param cell - The cell to render\n * @returns The formatted value as a React node\n */\nfunction renderCellByDisplayType(cell: Cell<any, any>): React.ReactNode {\n    const displayType = cell.column.columnDef.meta?.displayType;\n    const value = cell.getValue();\n\n    if (value === null || value === undefined) {\n        return null;\n    }\n\n    switch (displayType) {\n        case 'date':\n            return formatDate(value);\n\n        case 'number':\n            return formatNumber(value);\n        case 'boolean':\n        case 'badge':\n            return <Badge className=\"uppercase w-full\">{String(value)}</Badge>;\n        case 'country':\n            return <CountryName value={value} />;\n        case 'enum':\n            return <span className=\"uppercase w-full\">{String(value)}</span>;\n        case 'fileSize':\n            return formatFilesize(value);\n        case 'days':\n            return formatDays(value);\n        default:\n            return String(value);\n    }\n}\n\nfunction HeaderText({ header }: { header: Header<any, unknown> }) {\n    const headerDef = header.column.columnDef.header;\n\n    if (typeof headerDef === 'string' || !headerDef) {\n        return getColumnHeaderText(header.column);\n    }\n\n    if (typeof headerDef === 'function') {\n        const result = headerDef(header.getContext());\n        if (typeof result === 'string') {\n            return getColumnHeaderText(header.column);\n        }\n        return flexRender(headerDef, header.getContext());\n    }\n\n    return flexRender(headerDef, header.getContext());\n}\n\n// TODO, automate checking valid HTML\nfunction TableContent({ className }: React.ComponentProps<typeof TableComponent>) {\n    const { tanTable } = useDataTable();\n    const tableCellStyle = (isSticky: boolean, className?: string, zIndex: string = 'z-50') =>\n        classNames(\n            'px-icon py-2 text-left body-sm font-medium whitespace-nowrap',\n            isSticky && `bg-elevation-1 sticky right-0 ${zIndex} text-center justify-center`,\n            className\n        );\n    return (\n        <TableComponent className={classNames('table-auto', className)}>\n            <TableHeader className=\"sticky top-0 z-10\">\n                {tanTable.getHeaderGroups().map(headerGroup => (\n                    <TableRow key={headerGroup.id}>\n                        {headerGroup.headers.map(header => (\n                            <TableHead\n                                scope=\"col\"\n                                key={header.id}\n                                colSpan={header.colSpan}\n                                className={tableCellStyle(header.id === ACTIONS_COLUMN_ID, 'bg-elevation-1')}\n                            >\n                                {!header.column.getCanSort() && !header.isPlaceholder && (\n                                    <div\n                                        className={classNames(\n                                            'w-full py-1 inline-flex items-center gap-1 body-sm',\n                                            header.id === ACTIONS_COLUMN_ID ? 'justify-center' : 'justify-start'\n                                        )}\n                                    >\n                                        <HeaderText header={header} />\n                                    </div>\n                                )}\n                                {header.column.getCanSort() && (\n                                    <Button\n                                        variant=\"ghost\"\n                                        className={classNames(\n                                            'w-full p-1',\n                                            header.id === ACTIONS_COLUMN_ID ? 'justify-center' : 'justify-start'\n                                        )}\n                                        onPress={header.column.getToggleSortingHandler()}\n                                    >\n                                        <span>\n                                            <HeaderText header={header} />\n                                        </span>\n                                        <SortIcon direction={header.column.getIsSorted()} />\n                                    </Button>\n                                )}\n                            </TableHead>\n                        ))}\n                    </TableRow>\n                ))}\n            </TableHeader>\n            <TableBody>\n                {tanTable.getRowModel().rows.map(row => (\n                    <TableRow\n                        className={classNames(\n                            'transition-colors data-[selected=true]:bg-primary/10 hover:bg-muted-foreground/20'\n                        )}\n                        key={row.id}\n                        data-selected={row.getIsSelected()}\n                    >\n                        {row.getVisibleCells().map(cell => {\n                            const isActionsColumn = cell.column.id === ACTIONS_COLUMN_ID;\n                            const cellContent = cell.column.columnDef.meta?.displayType\n                                ? renderCellByDisplayType(cell)\n                                : flexRender(cell.column.columnDef.cell, cell.getContext());\n\n                            return (\n                                <TableCell\n                                    key={cell.id}\n                                    className={classNames(\n                                        tableCellStyle(isActionsColumn, undefined, 'z-1'),\n                                        isActionsColumn && 'flex justify-center items-center'\n                                    )}\n                                >\n                                    {cellContent}\n                                </TableCell>\n                            );\n                        })}\n                    </TableRow>\n                ))}\n            </TableBody>\n        </TableComponent>\n    );\n}\n","'use client';\nimport type { operations } from '@cryptlex/web-api-types/develop';\nimport { useRef } from 'react';\nimport { Button } from '../components/button';\nimport { useDataTable } from '../components/data-table';\nimport { TfDatePicker } from '../components/date-picker';\nimport { EasyMenu, MenuItem } from '../components/menu';\nimport type { MultiSelectProps } from '../components/multi-select';\nimport { Popover, PopoverTrigger } from '../components/popover';\nimport { useAppForm } from '../utilities/form-hook';\nimport { useResourceFormatter, type ApiFilters } from '../utilities/resources';\nimport { classNames } from '../utilities/theme';\nimport { IcAccount, IcCheck, IcDate, IcFile, IcFilter, IcLicense, IcMinus, IcRemove, type CtxIcon } from './icons';\nimport { TfMultipleIdSearchInput } from './id-search';\n\nexport const FILTER_COMPARISON_OPERATORS = [\n    'eq',\n    'ne',\n    'cn',\n    'nc',\n    'sw',\n    'ew',\n    'in',\n    'nin',\n    'gt',\n    'gte',\n    'lt',\n    'lte',\n] as const;\nexport type FilterComparisonOperator = (typeof FILTER_COMPARISON_OPERATORS)[number];\n\nexport const COMPARISON_OPERATOR_LABELS: Record<FilterComparisonOperator, string> = {\n    eq: 'equal to',\n    ne: 'not equal to',\n    cn: 'contains',\n    nc: 'does not contain',\n    sw: 'starts with',\n    ew: 'ends with',\n    in: 'includes',\n    nin: 'does not include',\n    gt: 'greater than',\n    gte: 'greater than or equal to',\n    lt: 'less than',\n    lte: 'less than or equal to',\n};\n\ntype BaseLocalFilter<T extends FilterType, V> = {\n    id: string;\n    type: T;\n    property: string;\n    operator: FilterComparisonOperator;\n    value: V | undefined;\n    displayValue?: string;\n};\ntype EnumLocalFilter = BaseLocalFilter<'enum', Set<string | number>>;\ntype IdLocalFilter = BaseLocalFilter<'id', string>;\ntype BoolLocalFilter = BaseLocalFilter<'bool', boolean>;\ntype StringLocalFilter = BaseLocalFilter<'string', string>;\ntype NumberLocalFilter = BaseLocalFilter<'number', number>;\n// DatePicker accepts a string,and converts it to a ZonedDateTime\ntype DateLocalFilter = BaseLocalFilter<'date', string>;\ntype IdSearchLocalFilter = BaseLocalFilter<'id-search', string[]>;\n// TODO, entitlementSets.productIds\nfunction createNewFilter(type: FilterType, property: string): TableFilter {\n    const id = `${property}-${Date.now()}`;\n    const operator = FilterOperations[type][0];\n\n    switch (type) {\n        case 'bool':\n            return { id, type, property, operator, value: true };\n        case 'string':\n            return { id, type, property, operator, value: '' };\n        case 'date':\n            return { id, type, property, operator, value: new Date().toISOString() };\n        case 'id':\n            return { id, type, property, operator, value: '' };\n        case 'id-search':\n            return { id, type, property, operator, value: [] };\n        case 'enum':\n            return { id, type, property, operator, value: new Set<string | number>() };\n        case 'number':\n            return { id, type, property, operator, value: 0 };\n    }\n}\n\nexport type TableFilter =\n    | EnumLocalFilter\n    | IdLocalFilter\n    | BoolLocalFilter\n    | StringLocalFilter\n    | DateLocalFilter\n    | IdSearchLocalFilter\n    | NumberLocalFilter;\n\nexport type FilterConfig =\n    | { type: 'enum'; options: MultiSelectProps['items'] }\n    | ({ type: 'id-search' } & Pick<React.ComponentProps<typeof TfMultipleIdSearchInput>, 'accessor' | 'path'>)\n    | { type: 'id' }\n    | { type: 'bool' }\n    | { type: 'string' }\n    | { type: 'date' }\n    | { type: 'number' };\n\nexport type FilterType = FilterConfig['type'];\n\nconst FilterOperations: Record<FilterType, FilterComparisonOperator[]> = {\n    bool: ['eq'],\n    enum: ['in', 'nin'],\n    id: ['in', 'nin'],\n    'id-search': ['in', 'nin'],\n    string: ['eq', 'ne', 'cn', 'nc', 'sw', 'ew', 'in', 'nin'],\n    date: ['lt', 'gt'],\n    number: ['eq', 'ne', 'gt', 'gte', 'lt', 'lte'],\n};\n\n// TS workaround to get rid of filterConfig: Required<Record<never, FilterConfig>>\nexport type FiltersConfig<TOperation extends keyof operations> = [keyof ApiFilters<TOperation>] extends [never]\n    ? Record<string, FilterConfig>\n    : Required<Record<keyof ApiFilters<TOperation>, FilterConfig>>;\n\nexport function DataTableFilter({ className, ...props }: React.ComponentProps<'section'>) {\n    const { filters, query, setFilters, filterConfig } = useDataTable();\n\n    const addFilterButtonRef = useRef<HTMLButtonElement>(null);\n\n    const resourceFormatter = useResourceFormatter();\n\n    const DEFAULT_VALUES: { filters: TableFilter[] } = {\n        filters,\n    };\n    const form = useAppForm({\n        defaultValues: DEFAULT_VALUES,\n        onSubmit: ({ value }) => {\n            setFilters(value.filters);\n        },\n    });\n\n    // More reason to hate TS https://github.com/Microsoft/TypeScript/issues/12870\n    const filterKeys = Object.keys(filterConfig).sort();\n\n    return (\n        <section {...props} className={classNames('flex gap-icon items-center', className)}>\n            <PopoverTrigger\n                onOpenChange={o => {\n                    // Set filters when the popover closes\n                    if (!o) {\n                        form.handleSubmit();\n                    } else {\n                        addFilterButtonRef.current?.focus();\n                    }\n                }}\n            >\n                <div className=\"relative\">\n                    {filters.length > 0 && (\n                        <div className=\"size-2 rounded-full absolute bg-primary/90 z-20 top-0 right-0 translate-x-0.5 -translate-y-0.5\"></div>\n                    )}\n                    <Button\n                        aria-label=\"Filter\"\n                        isDisabled={query.isPending || filterKeys.length === 0}\n                        type=\"button\"\n                        size={'icon'}\n                        variant={'neutral'}\n                    >\n                        <IcFilter />\n                    </Button>\n                </div>\n                {/* TODO, icon maps with dynamic imports? */}\n                {/* TODO open popover with form for property specific filter */}\n                {/* TODO, icons here??? */}\n                <Popover className=\"w-full p-icon\">\n                    <form\n                        onSubmit={e => {\n                            e.preventDefault();\n                        }}\n                        className=\"flex flex-col gap-icon max-h-table overflow-auto \"\n                    >\n                        <form.Field mode=\"array\" name={'filters'}>\n                            {field => {\n                                return (\n                                    <>\n                                        {field.state.value.map((lf, i) => {\n                                            return (\n                                                <div key={lf.id} className=\"flex gap-icon items-center justify-normal\">\n                                                    <span className=\"body-sm\">{resourceFormatter(lf.property)}</span>\n                                                    <form.AppField key={lf.id} name={`filters[${i}].operator`}>\n                                                        {sf => (\n                                                            <sf.TfSingleSelect\n                                                                items={FilterOperations[lf.type].map(op => ({\n                                                                    id: op,\n                                                                    label: <>{COMPARISON_OPERATOR_LABELS[op]}</>,\n                                                                }))}\n                                                            />\n                                                        )}\n                                                    </form.AppField>\n\n                                                    {lf.type === 'bool' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfCheckbox autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'date' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {_ => <TfDatePicker autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'id' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfTextField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'string' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfTextField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n                                                    {lf.type === 'number' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => <sf.TfNumberField autoFocus />}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    {lf.type === 'enum' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {sf => {\n                                                                const config = filterConfig[lf.property];\n                                                                if (config.type !== 'enum') return null;\n                                                                return <sf.TfMultiSelect items={config.options} />;\n                                                            }}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    {lf.type === 'id-search' && (\n                                                        <form.AppField name={`filters[${i}].value`}>\n                                                            {_ => {\n                                                                const config = filterConfig[lf.property];\n                                                                if (config.type !== 'id-search') return null;\n                                                                return (\n                                                                    <TfMultipleIdSearchInput\n                                                                        path={config.path}\n                                                                        accessor={config.accessor}\n                                                                    />\n                                                                );\n                                                            }}\n                                                        </form.AppField>\n                                                    )}\n\n                                                    <Button\n                                                        type=\"button\"\n                                                        variant=\"neutral\"\n                                                        size=\"icon\"\n                                                        onPress={() => field.removeValue(i)}\n                                                    >\n                                                        <IcRemove />\n                                                    </Button>\n                                                </div>\n                                            );\n                                        })}\n                                        <div className=\"flex w-full items-center justify-end gap-2 not-first:mt-icon\">\n                                            <EasyMenu label=\"Add filter\" autoFocus>\n                                                {filterKeys.sort().map(k => {\n                                                    const type = filterConfig[k].type;\n                                                    const Icon = FilterIcon[type];\n                                                    return (\n                                                        <MenuItem\n                                                            key={k}\n                                                            onAction={() => {\n                                                                const newFilter = createNewFilter(type, k);\n                                                                field.pushValue(newFilter);\n                                                            }}\n                                                        >\n                                                            {resourceFormatter(k)}\n                                                            <Icon />\n                                                        </MenuItem>\n                                                    );\n                                                })}\n                                            </EasyMenu>\n                                            {field.state.value.length > 0 ? (\n                                                <Button\n                                                    type=\"button\"\n                                                    variant=\"neutral\"\n                                                    onPress={() => {\n                                                        field.setValue([]);\n                                                    }}\n                                                >\n                                                    <IcRemove />\n                                                    Reset\n                                                </Button>\n                                            ) : null}\n                                        </div>\n                                    </>\n                                );\n                            }}\n                        </form.Field>\n                    </form>\n                </Popover>\n            </PopoverTrigger>\n        </section>\n    );\n}\n\nconst FilterIcon: Record<FilterConfig['type'], CtxIcon> = {\n    'id-search': IcFile,\n    bool: IcCheck,\n    date: IcDate,\n    enum: IcLicense,\n    id: IcAccount,\n    number: IcMinus,\n    string: IcCheck,\n};\n"],"names":["generateSortParam","sort","cH","createColumnHelper","TABLE_CHECK_BOX_COLUMN","table","jsx","Checkbox","row","ACTIONS_COLUMN_ID","getActionColumn","rowActions","DialogMenu","IcMoreVertical","getColumnHelper","useDataTableState","path","columns","filterConfig","columnsToHideByDefault","allowSelection","initialFilters","tableActions","tableState","_setTableState","useState","sorting","pagination","searchQuery","setSearchQuery","rowSelection","setRowSelection","filters","setFilters","mergedFilters","useMemo","tf","acc","current","merge","queryParameters","client","useCtxClient","queryKey","columnOrder","setColumnOrder","useLocalStorage","columnVisibility","setColumnVisibility","updateTableState","updates","prev","query","useQuery","res","cols","isUpdaterFunction","updater","resolveUpdater","currentValue","tanTable","useReactTable","getCoreRowModel","useEffect","c","DataTableContext","createContext","useDataTable","ctx","useContext","DataTableProvider","children","props","DataTable","className","Fragment","classNames","Actions","jsxs","TableOverlay","Loader","IcInfo","TableContent","ColumnPicker","PageSize","Paginator","activeId","setActiveId","resourceFormatter","useResourceFormatter","sensors","useSensors","useSensor","PointerSensor","KeyboardSensor","sortableKeyboardCoordinates","DndContext","closestCenter","event","active","over","oldIndex","newIndex","arrayMove","SortableContext","verticalListSortingStrategy","EasyMenu","IcColumns","MenuItem","colId","col","SortableItem","DragOverlay","column","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","IcGrip","getColumnHeaderText","SortIcon","rowCount","Button","IcFirst","IcLeft","IcRight","IcLast","PAGE_SIZES","s","items","hasSelectedRows","selectedRows","r","filteredActions","ta","IcRefresh","TableActions","DataTableFilter","SearchField","direction","IcSortAsc","IcSortDesc","IcSortNone","headerDef","renderCellByDisplayType","cell","displayType","value","formatDate","formatNumber","Badge","CountryName","formatFilesize","formatDays","HeaderText","header","flexRender","tableCellStyle","isSticky","zIndex","TableComponent","TableHeader","headerGroup","TableRow","TableHead","TableBody","isActionsColumn","cellContent","TableCell","FILTER_COMPARISON_OPERATORS","COMPARISON_OPERATOR_LABELS","createNewFilter","type","property","id","operator","FilterOperations","addFilterButtonRef","useRef","form","useAppForm","filterKeys","PopoverTrigger","o","IcFilter","Popover","e","field","lf","i","sf","op","_","TfDatePicker","config","TfMultipleIdSearchInput","IcRemove","k","Icon","FilterIcon","newFilter","IcFile","IcCheck","IcDate","IcLicense","IcAccount","IcMinus"],"mappings":"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"}

package/dist/components/date-picker.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as o,jsx as e}from"react/jsx-runtime";import{DatePicker as D,composeRenderProps as c,DateRangePicker as b,Popover as v,Dialog as N}from"react-aria-components";import{parseAbsolute as P,getLocalTimeZone as k}from"@internationalized/date";import{Button as u}from"./button.js";import{Calendar as C,RangeCalendar as F}from"./calendar.js";import{DateInput as m}from"./datefield.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as R}from"../utilities/form-context.js";import{classNames as l}from"../utilities/theme.js";import{FormField as f,FieldGroup as g}from"./form.js";import{IcDate as p}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"@tanstack/react-form";import"clsx";const h=({className:a,popoverClassName:r,...i})=>e(v,{className:c(r,t=>l("w-auto p-3 bg-elevation-2 border",t)),children:e(N,{className:l("flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0",a),...i})});function w({label:a,description:r,errorMessage:i,requiredIndicator:t,className:n,...s}){return o(D,{className:c(n,x=>l("group flex flex-col gap-2",x)),...s,children:[e(f,{label:a,description:r,errorMessage:i,requiredIndicator:t,children:o(g,{children:[e(m,{className:"flex-1",variant:"ghost"}),e(u,{variant:"ghost",size:"icon",className:"-me-2 ms-2",children:e(p,{"aria-hidden":!0})})]})}),e(h,{children:e(C,{})})]})}function J({...a}){const r=R({disabled:a.isDisabled});return e(w,{hideTimeZone:!0,isDisabled:a.isDisabled||r.form.state.isSubmitting,value:r.state.value?P(r.state.value,k()):null,onChange:i=>i?r.handleChange(i.toAbsoluteString()):r.handleChange(null),onBlur:r.handleBlur,isInvalid:!!d(r),errorMessage:d(r),...a})}function K({label:a,description:r,errorMessage:i,className:t,...n}){return o(b,{className:c(t,s=>l("group flex flex-col gap-2",s)),...n,children:[e(f,{label:a,errorMessage:i,description:r,children:o(g,{children:[e(m,{variant:"ghost",slot:"start"}),e("span",{"aria-hidden":!0,className:"px-2 body-sm text-muted-foreground",children:"-"}),e(m,{className:"flex-1",variant:"ghost",slot:"end"}),e(u,{variant:"ghost",size:"icon",className:"mr-1 data-[focus-visible]:ring-offset-0",children:e(p,{"aria-hidden":!0})})]})}),e(h,{children:e(F,{})})]})}export{w as DatePicker,K as DateRangePicker,J as TfDatePicker};
+"use client";import{jsxs as o,jsx as e}from"react/jsx-runtime";import{DatePicker as D,composeRenderProps as c,DateRangePicker as b,Popover as v,Dialog as N}from"react-aria-components";import{parseAbsolute as P,getLocalTimeZone as k}from"@internationalized/date";import{Button as u}from"./button.js";import{Calendar as C,RangeCalendar as R}from"./calendar.js";import{DateInput as m}from"./datefield.js";import{getFieldErrorMessage as d}from"../utilities/form.js";import{useFieldContext as F}from"../utilities/form-context.js";import{classNames as n}from"../utilities/theme.js";import{FormField as f,FieldGroup as g}from"./form.js";import{IcDate as p}from"./icons.js";import"class-variance-authority";import"./loader.js";import"react";import"@tanstack/react-form";import"clsx";const h=({className:a,popoverClassName:r,...i})=>e(v,{className:c(r,t=>n("w-auto p-3 bg-elevation-2 border",t)),children:e(N,{className:n("flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0",a),...i})});function I({label:a,description:r,errorMessage:i,requiredIndicator:t,className:l,...s}){return o(D,{className:c(l,x=>n("group flex flex-col gap-2",x)),...s,children:[e(f,{label:a,description:r,errorMessage:i,requiredIndicator:t,children:o(g,{children:[e(m,{className:"flex-1",variant:"ghost"}),e(u,{variant:"ghost",size:"icon",className:"-me-2 ms-2",children:e(p,{"aria-hidden":!0})})]})}),e(h,{children:e(C,{})})]})}function J({...a}){const r=F({disabled:a.isDisabled});return e(I,{requiredIndicator:r.isRequired,hideTimeZone:!0,isDisabled:a.isDisabled||r.form.state.isSubmitting,value:r.state.value?P(r.state.value,k()):null,onChange:i=>i?r.handleChange(i.toAbsoluteString()):r.handleChange(null),onBlur:r.handleBlur,isInvalid:!!d(r),errorMessage:d(r),...a})}function K({label:a,description:r,errorMessage:i,className:t,...l}){return o(b,{className:c(t,s=>n("group flex flex-col gap-2",s)),...l,children:[e(f,{label:a,errorMessage:i,description:r,children:o(g,{children:[e(m,{variant:"ghost",slot:"start"}),e("span",{"aria-hidden":!0,className:"px-2 body-sm text-muted-foreground",children:"-"}),e(m,{className:"flex-1",variant:"ghost",slot:"end"}),e(u,{variant:"ghost",size:"icon",className:"mr-1 data-[focus-visible]:ring-offset-0",children:e(p,{"aria-hidden":!0})})]})}),e(h,{children:e(R,{})})]})}export{I as DatePicker,K as DateRangePicker,J as TfDatePicker};
 //# sourceMappingURL=date-picker.js.map

package/dist/components/date-picker.js.map

@@ -1 +1 @@
-{"version":3,"file":"date-picker.js","sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["'use client';\nimport {\n    DatePicker as AriaDatePicker,\n    DatePickerProps as AriaDatePickerProps,\n    DateRangePicker as AriaDateRangePicker,\n    DateRangePickerProps as AriaDateRangePickerProps,\n    DateValue as AriaDateValue,\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n    Popover,\n} from 'react-aria-components';\n\nimport { getLocalTimeZone, parseAbsolute, type ZonedDateTime } from '@internationalized/date';\nimport { Button } from '../components/button';\nimport { Calendar, RangeCalendar } from '../components/calendar';\nimport { DateInput } from '../components/datefield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDate } from './icons';\n\n/**\n * Popover container for date picker content.\n *\n * @remarks\n * Provides consistent styling and positioning for the calendar popup.\n */\nconst DatePickerContent = ({\n    className,\n    popoverClassName,\n    ...props\n}: AriaDialogProps & { popoverClassName?: AriaPopoverProps['className'] }) => (\n    <Popover\n        className={composeRenderProps(popoverClassName, className =>\n            classNames('w-auto p-3 bg-elevation-2 border', className)\n        )}\n    >\n        <AriaDialog\n            className={classNames(\n                'flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0',\n                className\n            )}\n            {...props}\n        />\n    </Popover>\n);\n\ninterface DatePickerProps<T extends AriaDateValue> extends AriaDatePickerProps<T>, FormFieldProps {}\n\n/**\n * Date picker component for selecting single dates.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports date validation, min/max values, and custom date formatting.\n *\n * @example\n * ```tsx\n * <DatePicker\n *   label=\"Event Date\"\n *   isRequired\n *   minValue={today(getLocalTimeZone())}\n * />\n * ```\n */\nexport function DatePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    className,\n    ...props\n}: DatePickerProps<T>) {\n    return (\n        <AriaDatePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n                <FieldGroup>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-2 ms-2'}>\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <Calendar />\n            </DatePickerContent>\n        </AriaDatePicker>\n    );\n}\n\n/**\n * Form-integrated date picker that works with TanStack Form.\n *\n * @remarks\n * Automatically handles form state, validation, and error messages.\n * Uses the field context to connect with the form's validation system.\n */\nexport function TfDatePicker({\n    ...props\n}: Omit<DatePickerProps<ZonedDateTime>, 'value' | 'onChange' | 'onBlur' | 'isInvalid' | 'errorMessage'>) {\n    const field = useFieldContext<string | null>({ disabled: props.isDisabled });\n    return (\n        <DatePicker\n            hideTimeZone\n            isDisabled={props.isDisabled || field.form.state.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v => (v ? field.handleChange(v.toAbsoluteString()) : field.handleChange(null))}\n            onBlur={field.handleBlur}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n\ninterface DateRangePickerProps<T extends AriaDateValue> extends AriaDateRangePickerProps<T>, FormFieldProps {}\n\n/**\n * Date range picker component for selecting start and end dates.\n *\n * @remarks\n * Allows users to select a date range with start and end values.\n * Built with React Aria for accessibility and internationalization support.\n * Features separate input fields for start and end dates with range validation.\n *\n * @example\n * ```tsx\n * <DateRangePicker\n *   label=\"Booking Period\"\n *   description=\"Select your stay dates\"\n *   isRequired\n * />\n * ```\n */\nexport function DateRangePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: DateRangePickerProps<T>) {\n    return (\n        <AriaDateRangePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                <FieldGroup>\n                    <DateInput variant=\"ghost\" slot={'start'} />\n                    <span aria-hidden className=\"px-2 body-sm text-muted-foreground\">\n                        -\n                    </span>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" slot={'end'} />\n                    <Button variant=\"ghost\" size=\"icon\" className=\"mr-1 data-[focus-visible]:ring-offset-0\">\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <RangeCalendar />\n            </DatePickerContent>\n        </AriaDateRangePicker>\n    );\n}\n"],"names":["DatePickerContent","className","popoverClassName","props","jsx","Popover","composeRenderProps","classNames","AriaDialog","DatePicker","label","description","errorMessage","requiredIndicator","jsxs","AriaDatePicker","FormField","FieldGroup","DateInput","Button","IcDate","Calendar","TfDatePicker","field","useFieldContext","parseAbsolute","getLocalTimeZone","v","getFieldErrorMessage","DateRangePicker","AriaDateRangePicker","RangeCalendar"],"mappings":"uwBA8BA,MAAMA,EAAoB,CAAC,CACvB,UAAAC,EACA,iBAAAC,EACA,GAAGC,CACP,IACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAkBD,GAC5CM,EAAW,mCAAoCN,CAAS,CAAA,EAG5D,SAAAG,EAACI,EAAA,CACG,UAAWD,EACP,iFACAN,CAAA,EAEH,GAAGE,CAAA,CAAA,CACR,CACJ,EAqBG,SAASM,EAAoC,CAChD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,UAAAZ,EACA,GAAGE,CACP,EAAuB,CACnB,OACIW,EAACC,EAAA,CACG,UAAWT,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAgB,MAAAN,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAAC,EAACG,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,EAC9Cd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAACiB,EAAA,CAAA,CAAS,CAAA,CACd,CAAA,CAAA,CAAA,CAGZ,CASO,SAASC,EAAa,CACzB,GAAGnB,CACP,EAAyG,CACrG,MAAMoB,EAAQC,EAA+B,CAAE,SAAUrB,EAAM,WAAY,EAC3E,OACIC,EAACK,EAAA,CACG,aAAY,GACZ,WAAYN,EAAM,YAAcoB,EAAM,KAAK,MAAM,aACjD,MAAOA,EAAM,MAAM,MAAQE,EAAcF,EAAM,MAAM,MAAOG,EAAA,CAAkB,EAAI,KAClF,SAAUC,GAAMA,EAAIJ,EAAM,aAAaI,EAAE,kBAAkB,EAAIJ,EAAM,aAAa,IAAI,EACtF,OAAQA,EAAM,WACd,UAAW,CAAC,CAACK,EAAqBL,CAAK,EACvC,aAAcK,EAAqBL,CAAK,EACvC,GAAGpB,CAAA,CAAA,CAGhB,CAqBO,SAAS0B,EAAyC,CACrD,MAAAnB,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAA4B,CACxB,OACIW,EAACgB,EAAA,CACG,UAAWxB,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAU,MAAAN,EAAc,aAAAE,EAA4B,YAAAD,EACjD,WAACM,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,QAAQ,QAAQ,KAAM,QAAS,IACzC,OAAA,CAAK,cAAW,GAAC,UAAU,qCAAqC,SAAA,IAEjE,IACCA,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,KAAM,MAAO,EAC3Dd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAAC2B,EAAA,CAAA,CAAc,CAAA,CACnB,CAAA,CAAA,CAAA,CAGZ"}
+{"version":3,"file":"date-picker.js","sources":["../../lib/components/date-picker.tsx"],"sourcesContent":["'use client';\nimport {\n    DatePicker as AriaDatePicker,\n    DatePickerProps as AriaDatePickerProps,\n    DateRangePicker as AriaDateRangePicker,\n    DateRangePickerProps as AriaDateRangePickerProps,\n    DateValue as AriaDateValue,\n    Dialog as AriaDialog,\n    DialogProps as AriaDialogProps,\n    PopoverProps as AriaPopoverProps,\n    composeRenderProps,\n    Popover,\n} from 'react-aria-components';\n\nimport { getLocalTimeZone, parseAbsolute, type ZonedDateTime } from '@internationalized/date';\nimport { Button } from '../components/button';\nimport { Calendar, RangeCalendar } from '../components/calendar';\nimport { DateInput } from '../components/datefield';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcDate } from './icons';\n\n/**\n * Popover container for date picker content.\n *\n * @remarks\n * Provides consistent styling and positioning for the calendar popup.\n */\nconst DatePickerContent = ({\n    className,\n    popoverClassName,\n    ...props\n}: AriaDialogProps & { popoverClassName?: AriaPopoverProps['className'] }) => (\n    <Popover\n        className={composeRenderProps(popoverClassName, className =>\n            classNames('w-auto p-3 bg-elevation-2 border', className)\n        )}\n    >\n        <AriaDialog\n            className={classNames(\n                'flex w-full flex-col gap-y-2 outline-none sm:flex-row sm:gap-x-icon sm:gap-y-0',\n                className\n            )}\n            {...props}\n        />\n    </Popover>\n);\n\ninterface DatePickerProps<T extends AriaDateValue> extends AriaDatePickerProps<T>, FormFieldProps {}\n\n/**\n * Date picker component for selecting single dates.\n *\n * @remarks\n * Built with React Aria for accessibility and internationalization support.\n * Supports date validation, min/max values, and custom date formatting.\n *\n * @example\n * ```tsx\n * <DatePicker\n *   label=\"Event Date\"\n *   isRequired\n *   minValue={today(getLocalTimeZone())}\n * />\n * ```\n */\nexport function DatePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    className,\n    ...props\n}: DatePickerProps<T>) {\n    return (\n        <AriaDatePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField {...{ label, description, errorMessage, requiredIndicator }}>\n                <FieldGroup>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" />\n                    <Button variant=\"ghost\" size=\"icon\" className={'-me-2 ms-2'}>\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <Calendar />\n            </DatePickerContent>\n        </AriaDatePicker>\n    );\n}\n\n/**\n * Form-integrated date picker that works with TanStack Form.\n *\n * @remarks\n * Automatically handles form state, validation, and error messages.\n * Uses the field context to connect with the form's validation system.\n */\nexport function TfDatePicker({\n    ...props\n}: Omit<DatePickerProps<ZonedDateTime>, 'value' | 'onChange' | 'onBlur' | 'isInvalid' | 'errorMessage'>) {\n    const field = useFieldContext<string | null>({ disabled: props.isDisabled });\n    return (\n        <DatePicker\n            requiredIndicator={field.isRequired}\n            hideTimeZone\n            isDisabled={props.isDisabled || field.form.state.isSubmitting}\n            value={field.state.value ? parseAbsolute(field.state.value, getLocalTimeZone()) : null}\n            onChange={v => (v ? field.handleChange(v.toAbsoluteString()) : field.handleChange(null))}\n            onBlur={field.handleBlur}\n            isInvalid={!!getFieldErrorMessage(field)}\n            errorMessage={getFieldErrorMessage(field)}\n            {...props}\n        />\n    );\n}\n\ninterface DateRangePickerProps<T extends AriaDateValue> extends AriaDateRangePickerProps<T>, FormFieldProps {}\n\n/**\n * Date range picker component for selecting start and end dates.\n *\n * @remarks\n * Allows users to select a date range with start and end values.\n * Built with React Aria for accessibility and internationalization support.\n * Features separate input fields for start and end dates with range validation.\n *\n * @example\n * ```tsx\n * <DateRangePicker\n *   label=\"Booking Period\"\n *   description=\"Select your stay dates\"\n *   isRequired\n * />\n * ```\n */\nexport function DateRangePicker<T extends AriaDateValue>({\n    label,\n    description,\n    errorMessage,\n    className,\n    ...props\n}: DateRangePickerProps<T>) {\n    return (\n        <AriaDateRangePicker\n            className={composeRenderProps(className, className => classNames('group flex flex-col gap-2', className))}\n            {...props}\n        >\n            <FormField label={label} errorMessage={errorMessage} description={description}>\n                <FieldGroup>\n                    <DateInput variant=\"ghost\" slot={'start'} />\n                    <span aria-hidden className=\"px-2 body-sm text-muted-foreground\">\n                        -\n                    </span>\n                    <DateInput className=\"flex-1\" variant=\"ghost\" slot={'end'} />\n                    <Button variant=\"ghost\" size=\"icon\" className=\"mr-1 data-[focus-visible]:ring-offset-0\">\n                        <IcDate aria-hidden />\n                    </Button>\n                </FieldGroup>\n            </FormField>\n            <DatePickerContent>\n                <RangeCalendar />\n            </DatePickerContent>\n        </AriaDateRangePicker>\n    );\n}\n"],"names":["DatePickerContent","className","popoverClassName","props","jsx","Popover","composeRenderProps","classNames","AriaDialog","DatePicker","label","description","errorMessage","requiredIndicator","jsxs","AriaDatePicker","FormField","FieldGroup","DateInput","Button","IcDate","Calendar","TfDatePicker","field","useFieldContext","parseAbsolute","getLocalTimeZone","v","getFieldErrorMessage","DateRangePicker","AriaDateRangePicker","RangeCalendar"],"mappings":"uwBA8BA,MAAMA,EAAoB,CAAC,CACvB,UAAAC,EACA,iBAAAC,EACA,GAAGC,CACP,IACIC,EAACC,EAAA,CACG,UAAWC,EAAmBJ,EAAkBD,GAC5CM,EAAW,mCAAoCN,CAAS,CAAA,EAG5D,SAAAG,EAACI,EAAA,CACG,UAAWD,EACP,iFACAN,CAAA,EAEH,GAAGE,CAAA,CAAA,CACR,CACJ,EAqBG,SAASM,EAAoC,CAChD,MAAAC,EACA,YAAAC,EACA,aAAAC,EACA,kBAAAC,EACA,UAAAZ,EACA,GAAGE,CACP,EAAuB,CACnB,OACIW,EAACC,EAAA,CACG,UAAWT,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAgB,MAAAN,EAAO,YAAAC,EAAa,aAAAC,EAAc,kBAAAC,EAC/C,SAAAC,EAACG,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,EAC9Cd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAW,aAC3C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAACiB,EAAA,CAAA,CAAS,CAAA,CACd,CAAA,CAAA,CAAA,CAGZ,CASO,SAASC,EAAa,CACzB,GAAGnB,CACP,EAAyG,CACrG,MAAMoB,EAAQC,EAA+B,CAAE,SAAUrB,EAAM,WAAY,EAC3E,OACIC,EAACK,EAAA,CACG,kBAAmBc,EAAM,WACzB,aAAY,GACZ,WAAYpB,EAAM,YAAcoB,EAAM,KAAK,MAAM,aACjD,MAAOA,EAAM,MAAM,MAAQE,EAAcF,EAAM,MAAM,MAAOG,EAAA,CAAkB,EAAI,KAClF,SAAUC,GAAMA,EAAIJ,EAAM,aAAaI,EAAE,kBAAkB,EAAIJ,EAAM,aAAa,IAAI,EACtF,OAAQA,EAAM,WACd,UAAW,CAAC,CAACK,EAAqBL,CAAK,EACvC,aAAcK,EAAqBL,CAAK,EACvC,GAAGpB,CAAA,CAAA,CAGhB,CAqBO,SAAS0B,EAAyC,CACrD,MAAAnB,EACA,YAAAC,EACA,aAAAC,EACA,UAAAX,EACA,GAAGE,CACP,EAA4B,CACxB,OACIW,EAACgB,EAAA,CACG,UAAWxB,EAAmBL,EAAWA,GAAaM,EAAW,4BAA6BN,CAAS,CAAC,EACvG,GAAGE,EAEJ,SAAA,CAAAC,EAACY,EAAA,CAAU,MAAAN,EAAc,aAAAE,EAA4B,YAAAD,EACjD,WAACM,EAAA,CACG,SAAA,CAAAb,EAACc,EAAA,CAAU,QAAQ,QAAQ,KAAM,QAAS,IACzC,OAAA,CAAK,cAAW,GAAC,UAAU,qCAAqC,SAAA,IAEjE,IACCA,EAAA,CAAU,UAAU,SAAS,QAAQ,QAAQ,KAAM,MAAO,EAC3Dd,EAACe,EAAA,CAAO,QAAQ,QAAQ,KAAK,OAAO,UAAU,0CAC1C,SAAAf,EAACgB,EAAA,CAAO,cAAW,EAAA,CAAC,CAAA,CACxB,CAAA,CAAA,CACJ,CAAA,CACJ,EACAhB,EAACJ,EAAA,CACG,SAAAI,EAAC2B,EAAA,CAAA,CAAc,CAAA,CACnB,CAAA,CAAA,CAAA,CAGZ"}

package/dist/components/duration-field.js

@@ -1,2 +1,2 @@
-"use client";import{jsxs as N,jsx as e}from"react/jsx-runtime";import{useState as D,useMemo as M,useCallback as v}from"react";import{NumberField as z}from"react-aria-components";import{Duration as w}from"../utilities/duration.js";import{getFieldErrorMessage as B}from"../utilities/form.js";import{useFieldContext as $}from"../utilities/form-context.js";import{classNames as b}from"../utilities/theme.js";import{Button as A}from"./button.js";import{FormField as L,FieldGroup as Y}from"./form.js";import{IcLeft as _,IcRight as j}from"./icons.js";import{NumberFieldInput as k}from"./numberfield.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./loader.js";const G=z,H={years:{full:"Years",short:"yr"},months:{full:"Months",short:"mo"},weeks:{full:"Weeks",short:"wk"},days:{full:"Days",short:"d"},hours:{full:"Hours",short:"hr"},minutes:{full:"Minutes",short:"min"},seconds:{full:"Seconds",short:"sec"}},F=["years","months","days"],K=["hours","minutes","seconds"];function P({id:s,value:r,onChange:t,onBlur:f,label:m,isInvalid:d,isDisabled:h}){return N("div",{className:"flex items-center flex-1 min-w-0 relative",children:[e(G,{"aria-label":m,isInvalid:d,isDisabled:h,value:r,onChange:i=>t(i),onBlur:f,minValue:0,className:"w-full",children:e(k,{id:s,className:"w-full pr-input"})}),e("div",{className:"absolute right-1 select-none text-muted pointer-events-none",children:m})]})}function R({value:s,onChange:r,onBlur:t,label:f,description:m,errorMessage:d,requiredIndicator:h,isDisabled:i,id:S}){const[l,E]=D(!1),c=M(()=>{if(!s||s==="")return{};try{return w.parse(s)}catch{return{}}},[s]),x=v((o,a)=>{const g={...c,[o]:a>0?a:void 0};r(w.serialize(g))},[c,r]),I=()=>{E(o=>!o)},u=!!d,p=S||"duration-field",T=v(o=>{const a=o?[...F,...K]:F,g=o?"short":"full";return a.map((n,y)=>N("div",{className:"contents",children:[e(P,{id:`${p}-${n}`,value:c[n]??0,onChange:C=>x(n,C),onBlur:t||(()=>{}),label:H[n][g],isInvalid:u,isDisabled:i||!1}),y<a.length-1&&e("div",{className:"self-stretch w-px bg-input mx-2 flex-shrink-0","aria-hidden":"true"},`sep-${n}`)]},n))},[p,c,x,t,u,i,l]);return e("div",{className:b("group form-field"),"data-invalid":u?"":void 0,children:e(L,{label:f,description:m,errorMessage:d,requiredIndicator:h,htmlFor:`${p}-years`,children:N("div",{className:"flex-1 flex items-center gap-1",children:[e(Y,{"data-invalid":u?"":void 0,className:"flex flex-row items-stretch w-full overflow-hidden",children:T(l)}),e(A,{type:"button",size:"icon",onPress:I,isDisabled:i,"aria-label":l?"Hide time components":"Show time components","aria-expanded":l,className:b("flex-shrink-0"),children:l?e(_,{className:"size-icon"}):e(j,{className:"size-icon"})})]})})})}function ie({isDisabled:s,...r}){const t=$({disabled:s});return e(R,{value:t.state.value,onChange:t.handleChange,onBlur:t.handleBlur,errorMessage:B(t),isDisabled:s||t.form.state.isSubmitting,id:t.name,...r})}export{R as Iso8601DurationField,ie as TfIso8601DurationField};
+"use client";import{jsxs as N,jsx as t}from"react/jsx-runtime";import{useState as D,useMemo as M,useCallback as v}from"react";import{NumberField as z}from"react-aria-components";import{Duration as w}from"../utilities/duration.js";import{getFieldErrorMessage as B}from"../utilities/form.js";import{useFieldContext as $}from"../utilities/form-context.js";import{classNames as b}from"../utilities/theme.js";import{Button as A}from"./button.js";import{FormField as L,FieldGroup as Y}from"./form.js";import{IcLeft as _,IcRight as j}from"./icons.js";import{NumberFieldInput as k}from"./numberfield.js";import"@tanstack/react-form";import"clsx";import"class-variance-authority";import"./loader.js";const q=z,G={years:{full:"Years",short:"yr"},months:{full:"Months",short:"mo"},weeks:{full:"Weeks",short:"wk"},days:{full:"Days",short:"d"},hours:{full:"Hours",short:"hr"},minutes:{full:"Minutes",short:"min"},seconds:{full:"Seconds",short:"sec"}},F=["years","months","days"],H=["hours","minutes","seconds"];function K({id:s,value:r,onChange:e,onBlur:f,label:m,isInvalid:d,isDisabled:h}){return N("div",{className:"flex items-center flex-1 min-w-0 relative",children:[t(q,{"aria-label":m,isInvalid:d,isDisabled:h,value:r,onChange:n=>e(n),onBlur:f,minValue:0,className:"w-full",children:t(k,{id:s,className:"w-full pr-input"})}),t("div",{className:"absolute right-1 select-none text-muted pointer-events-none",children:m})]})}function P({value:s,onChange:r,onBlur:e,label:f,description:m,errorMessage:d,requiredIndicator:h,isDisabled:n,id:S}){const[l,I]=D(!1),c=M(()=>{if(!s||s==="")return{};try{return w.parse(s)}catch{return{}}},[s]),x=v((o,a)=>{const g={...c,[o]:a>0?a:void 0};r(w.serialize(g))},[c,r]),E=()=>{I(o=>!o)},u=!!d,p=S||"duration-field",T=v(o=>{const a=o?[...F,...H]:F,g=o?"short":"full";return a.map((i,y)=>N("div",{className:"contents",children:[t(K,{id:`${p}-${i}`,value:c[i]??0,onChange:C=>x(i,C),onBlur:e||(()=>{}),label:G[i][g],isInvalid:u,isDisabled:n||!1}),y<a.length-1&&t("div",{className:"self-stretch w-px bg-input mx-2 flex-shrink-0","aria-hidden":"true"},`sep-${i}`)]},i))},[p,c,x,e,u,n,l]);return t("div",{className:b("group form-field"),"data-invalid":u?"":void 0,children:t(L,{label:f,description:m,errorMessage:d,requiredIndicator:h,htmlFor:`${p}-years`,children:N("div",{className:"flex-1 flex items-center gap-1",children:[t(Y,{"data-invalid":u?"":void 0,className:"flex flex-row items-stretch w-full overflow-hidden",children:T(l)}),t(A,{type:"button",size:"icon",onPress:E,isDisabled:n,"aria-label":l?"Hide time components":"Show time components","aria-expanded":l,className:b("flex-shrink-0"),children:l?t(_,{className:"size-icon"}):t(j,{className:"size-icon"})})]})})})}function ne({isDisabled:s,...r}){const e=$({disabled:s});return t(P,{requiredIndicator:e.isRequired,value:e.state.value,onChange:e.handleChange,onBlur:e.handleBlur,errorMessage:B(e),isDisabled:s||e.form.state.isSubmitting,id:e.name,...r})}export{P as Iso8601DurationField,ne as TfIso8601DurationField};
 //# sourceMappingURL=duration-field.js.map

package/dist/components/duration-field.js.map

@@ -1 +1 @@
-{"version":3,"file":"duration-field.js","sources":["../../lib/components/duration-field.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useMemo, useState } from 'react';\nimport { NumberField as AriaNumberField, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';\nimport { Duration } from '../utilities/duration';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcLeft, IcRight } from './icons';\nimport { NumberFieldInput } from './numberfield';\n\nconst ANumberField = AriaNumberField;\n\ntype DurationPartKey = keyof Duration;\n\n/**\n * Segment configurations with both full and short labels\n * https://learn.microsoft.com/en-us/style-guide/a-z-word-list-term-collections/term-collections/date-time-terms\n * https://en.wikipedia.org/wiki/Hour\n */\nconst SEGMENT_LABELS: Record<DurationPartKey, { full: string; short: string }> = {\n    years: { full: 'Years', short: 'yr' },\n    months: { full: 'Months', short: 'mo' },\n    weeks: { full: 'Weeks', short: 'wk' },\n    days: { full: 'Days', short: 'd' },\n    hours: { full: 'Hours', short: 'hr' },\n    minutes: { full: 'Minutes', short: 'min' },\n    seconds: { full: 'Seconds', short: 'sec' },\n};\n\nconst DATE_KEYS: DurationPartKey[] = ['years', 'months', 'days'];\nconst TIME_KEYS: DurationPartKey[] = ['hours', 'minutes', 'seconds'];\n\n/**\n * Props for DurationSegment component\n */\ninterface DurationSegmentProps {\n    /** Unique identifier for the input field */\n    id: string;\n    /** Current numeric value */\n    value: number;\n    /** Callback when value changes */\n    onChange: (value: number) => void;\n    /** Callback when field loses focus */\n    onBlur: () => void;\n    /** Display label for the segment */\n    label: string;\n    /** Whether the field has validation errors */\n    isInvalid: boolean;\n    /** Whether the field is disabled */\n    isDisabled: boolean;\n}\n\nfunction DurationSegment({ id, value, onChange, onBlur, label, isInvalid, isDisabled }: DurationSegmentProps) {\n    return (\n        <div className=\"flex items-center flex-1 min-w-0 relative\">\n            <ANumberField\n                aria-label={label}\n                isInvalid={isInvalid}\n                isDisabled={isDisabled}\n                value={value}\n                onChange={newValue => onChange(newValue)}\n                onBlur={onBlur}\n                minValue={0}\n                className=\"w-full\"\n            >\n                <NumberFieldInput id={id} className=\"w-full pr-input\" />\n            </ANumberField>\n            <div className=\"absolute right-1 select-none text-muted pointer-events-none\">{label}</div>\n        </div>\n    );\n}\n\ninterface Iso8601DurationFieldBaseProps {\n    value: string;\n    onChange: (value: string) => void;\n    onBlur?: () => void;\n}\n\nexport interface Iso8601DurationFieldProps\n    extends Iso8601DurationFieldBaseProps,\n        FormFieldProps,\n        Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {\n    id?: string;\n}\n\nexport function Iso8601DurationField({\n    value,\n    onChange,\n    onBlur,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    isDisabled,\n    id,\n}: Iso8601DurationFieldProps) {\n    const [showTime, setShowTime] = useState(false);\n\n    const duration = useMemo((): Duration => {\n        if (!value || value === '') {\n            return {};\n        }\n        try {\n            return Duration.parse(value);\n        } catch {\n            return {};\n        }\n    }, [value]);\n\n    const handlePartChange = useCallback(\n        (part: DurationPartKey, partValue: number) => {\n            const updatedDuration: Duration = {\n                ...duration,\n                [part]: partValue > 0 ? partValue : undefined,\n            };\n            onChange(Duration.serialize(updatedDuration));\n        },\n        [duration, onChange]\n    );\n\n    const handleToggleTime = () => {\n        setShowTime(prev => !prev);\n    };\n\n    const isInvalid = !!errorMessage;\n    const fieldId = id || 'duration-field';\n\n    const renderSegments = useCallback(\n        (includeTime: boolean) => {\n            const keys = includeTime ? [...DATE_KEYS, ...TIME_KEYS] : DATE_KEYS;\n            const labelType = includeTime ? 'short' : 'full';\n\n            return keys.map((key, index) => (\n                <div key={key} className=\"contents\">\n                    <DurationSegment\n                        id={`${fieldId}-${key}`}\n                        value={duration[key] ?? 0}\n                        onChange={segmentValue => handlePartChange(key, segmentValue)}\n                        onBlur={onBlur || (() => {})}\n                        label={SEGMENT_LABELS[key][labelType]}\n                        isInvalid={isInvalid}\n                        isDisabled={isDisabled || false}\n                    />\n                    {index < keys.length - 1 && (\n                        <div\n                            key={`sep-${key}`}\n                            className=\"self-stretch w-px bg-input mx-2 flex-shrink-0\"\n                            aria-hidden=\"true\"\n                        />\n                    )}\n                </div>\n            ));\n        },\n        [fieldId, duration, handlePartChange, onBlur, isInvalid, isDisabled, showTime]\n    );\n\n    return (\n        <div className={classNames('group form-field')} data-invalid={isInvalid ? '' : undefined}>\n            <FormField\n                label={label}\n                description={description}\n                errorMessage={errorMessage}\n                requiredIndicator={requiredIndicator}\n                htmlFor={`${fieldId}-years`}\n            >\n                <div className=\"flex-1 flex items-center gap-1\">\n                    <FieldGroup\n                        data-invalid={isInvalid ? '' : undefined}\n                        className=\"flex flex-row items-stretch w-full overflow-hidden\"\n                    >\n                        {renderSegments(showTime)}\n                    </FieldGroup>\n                    <Button\n                        type=\"button\"\n                        size=\"icon\"\n                        onPress={handleToggleTime}\n                        isDisabled={isDisabled}\n                        aria-label={showTime ? 'Hide time components' : 'Show time components'}\n                        aria-expanded={showTime}\n                        className={classNames('flex-shrink-0')}\n                    >\n                        {showTime ? <IcLeft className=\"size-icon\" /> : <IcRight className=\"size-icon\" />}\n                    </Button>\n                </div>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {}\n\nexport function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <Iso8601DurationField\n            value={field.state.value}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            id={field.name}\n            {...props}\n        />\n    );\n}\n"],"names":["ANumberField","AriaNumberField","SEGMENT_LABELS","DATE_KEYS","TIME_KEYS","DurationSegment","id","value","onChange","onBlur","label","isInvalid","isDisabled","jsxs","jsx","newValue","NumberFieldInput","Iso8601DurationField","description","errorMessage","requiredIndicator","showTime","setShowTime","useState","duration","useMemo","Duration","handlePartChange","useCallback","part","partValue","updatedDuration","handleToggleTime","prev","fieldId","renderSegments","includeTime","keys","labelType","key","index","segmentValue","classNames","FormField","FieldGroup","Button","IcLeft","IcRight","TfIso8601DurationField","props","field","useFieldContext","getFieldErrorMessage"],"mappings":"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"}
+{"version":3,"file":"duration-field.js","sources":["../../lib/components/duration-field.tsx"],"sourcesContent":["'use client';\nimport { useCallback, useMemo, useState } from 'react';\nimport { NumberField as AriaNumberField, NumberFieldProps as AriaNumberFieldProps } from 'react-aria-components';\nimport { Duration } from '../utilities/duration';\nimport { getFieldErrorMessage } from '../utilities/form';\nimport { useFieldContext } from '../utilities/form-context';\nimport { classNames } from '../utilities/theme';\nimport { Button } from './button';\nimport { FieldGroup, FormField, type FormFieldProps } from './form';\nimport { IcLeft, IcRight } from './icons';\nimport { NumberFieldInput } from './numberfield';\n\nconst ANumberField = AriaNumberField;\n\ntype DurationPartKey = keyof Duration;\n\n/**\n * Segment configurations with both full and short labels\n * https://learn.microsoft.com/en-us/style-guide/a-z-word-list-term-collections/term-collections/date-time-terms\n * https://en.wikipedia.org/wiki/Hour\n */\nconst SEGMENT_LABELS: Record<DurationPartKey, { full: string; short: string }> = {\n    years: { full: 'Years', short: 'yr' },\n    months: { full: 'Months', short: 'mo' },\n    weeks: { full: 'Weeks', short: 'wk' },\n    days: { full: 'Days', short: 'd' },\n    hours: { full: 'Hours', short: 'hr' },\n    minutes: { full: 'Minutes', short: 'min' },\n    seconds: { full: 'Seconds', short: 'sec' },\n};\n\nconst DATE_KEYS: DurationPartKey[] = ['years', 'months', 'days'];\nconst TIME_KEYS: DurationPartKey[] = ['hours', 'minutes', 'seconds'];\n\n/**\n * Props for DurationSegment component\n */\ninterface DurationSegmentProps {\n    /** Unique identifier for the input field */\n    id: string;\n    /** Current numeric value */\n    value: number;\n    /** Callback when value changes */\n    onChange: (value: number) => void;\n    /** Callback when field loses focus */\n    onBlur: () => void;\n    /** Display label for the segment */\n    label: string;\n    /** Whether the field has validation errors */\n    isInvalid: boolean;\n    /** Whether the field is disabled */\n    isDisabled: boolean;\n}\n\nfunction DurationSegment({ id, value, onChange, onBlur, label, isInvalid, isDisabled }: DurationSegmentProps) {\n    return (\n        <div className=\"flex items-center flex-1 min-w-0 relative\">\n            <ANumberField\n                aria-label={label}\n                isInvalid={isInvalid}\n                isDisabled={isDisabled}\n                value={value}\n                onChange={newValue => onChange(newValue)}\n                onBlur={onBlur}\n                minValue={0}\n                className=\"w-full\"\n            >\n                <NumberFieldInput id={id} className=\"w-full pr-input\" />\n            </ANumberField>\n            <div className=\"absolute right-1 select-none text-muted pointer-events-none\">{label}</div>\n        </div>\n    );\n}\n\ninterface Iso8601DurationFieldBaseProps {\n    value: string;\n    onChange: (value: string) => void;\n    onBlur?: () => void;\n}\n\nexport interface Iso8601DurationFieldProps\n    extends Iso8601DurationFieldBaseProps,\n        FormFieldProps,\n        Omit<AriaNumberFieldProps, 'value' | 'onChange' | 'onBlur'> {\n    id?: string;\n}\n\nexport function Iso8601DurationField({\n    value,\n    onChange,\n    onBlur,\n    label,\n    description,\n    errorMessage,\n    requiredIndicator,\n    isDisabled,\n    id,\n}: Iso8601DurationFieldProps) {\n    const [showTime, setShowTime] = useState(false);\n\n    const duration = useMemo((): Duration => {\n        if (!value || value === '') {\n            return {};\n        }\n        try {\n            return Duration.parse(value);\n        } catch {\n            return {};\n        }\n    }, [value]);\n\n    const handlePartChange = useCallback(\n        (part: DurationPartKey, partValue: number) => {\n            const updatedDuration: Duration = {\n                ...duration,\n                [part]: partValue > 0 ? partValue : undefined,\n            };\n            onChange(Duration.serialize(updatedDuration));\n        },\n        [duration, onChange]\n    );\n\n    const handleToggleTime = () => {\n        setShowTime(prev => !prev);\n    };\n\n    const isInvalid = !!errorMessage;\n    const fieldId = id || 'duration-field';\n\n    const renderSegments = useCallback(\n        (includeTime: boolean) => {\n            const keys = includeTime ? [...DATE_KEYS, ...TIME_KEYS] : DATE_KEYS;\n            const labelType = includeTime ? 'short' : 'full';\n\n            return keys.map((key, index) => (\n                <div key={key} className=\"contents\">\n                    <DurationSegment\n                        id={`${fieldId}-${key}`}\n                        value={duration[key] ?? 0}\n                        onChange={segmentValue => handlePartChange(key, segmentValue)}\n                        onBlur={onBlur || (() => {})}\n                        label={SEGMENT_LABELS[key][labelType]}\n                        isInvalid={isInvalid}\n                        isDisabled={isDisabled || false}\n                    />\n                    {index < keys.length - 1 && (\n                        <div\n                            key={`sep-${key}`}\n                            className=\"self-stretch w-px bg-input mx-2 flex-shrink-0\"\n                            aria-hidden=\"true\"\n                        />\n                    )}\n                </div>\n            ));\n        },\n        [fieldId, duration, handlePartChange, onBlur, isInvalid, isDisabled, showTime]\n    );\n\n    return (\n        <div className={classNames('group form-field')} data-invalid={isInvalid ? '' : undefined}>\n            <FormField\n                label={label}\n                description={description}\n                errorMessage={errorMessage}\n                requiredIndicator={requiredIndicator}\n                htmlFor={`${fieldId}-years`}\n            >\n                <div className=\"flex-1 flex items-center gap-1\">\n                    <FieldGroup\n                        data-invalid={isInvalid ? '' : undefined}\n                        className=\"flex flex-row items-stretch w-full overflow-hidden\"\n                    >\n                        {renderSegments(showTime)}\n                    </FieldGroup>\n                    <Button\n                        type=\"button\"\n                        size=\"icon\"\n                        onPress={handleToggleTime}\n                        isDisabled={isDisabled}\n                        aria-label={showTime ? 'Hide time components' : 'Show time components'}\n                        aria-expanded={showTime}\n                        className={classNames('flex-shrink-0')}\n                    >\n                        {showTime ? <IcLeft className=\"size-icon\" /> : <IcRight className=\"size-icon\" />}\n                    </Button>\n                </div>\n            </FormField>\n        </div>\n    );\n}\n\nexport interface TfIso8601DurationFieldProps extends Omit<Iso8601DurationFieldProps, 'value' | 'onChange'> {}\n\nexport function TfIso8601DurationField({ isDisabled, ...props }: TfIso8601DurationFieldProps) {\n    const field = useFieldContext<string>({ disabled: isDisabled });\n\n    return (\n        <Iso8601DurationField\n            requiredIndicator={field.isRequired}\n            value={field.state.value}\n            onChange={field.handleChange}\n            onBlur={field.handleBlur}\n            errorMessage={getFieldErrorMessage(field)}\n            isDisabled={isDisabled || field.form.state.isSubmitting}\n            id={field.name}\n            {...props}\n        />\n    );\n}\n"],"names":["ANumberField","AriaNumberField","SEGMENT_LABELS","DATE_KEYS","TIME_KEYS","DurationSegment","id","value","onChange","onBlur","label","isInvalid","isDisabled","jsxs","jsx","newValue","NumberFieldInput","Iso8601DurationField","description","errorMessage","requiredIndicator","showTime","setShowTime","useState","duration","useMemo","Duration","handlePartChange","useCallback","part","partValue","updatedDuration","handleToggleTime","prev","fieldId","renderSegments","includeTime","keys","labelType","key","index","segmentValue","classNames","FormField","FieldGroup","Button","IcLeft","IcRight","TfIso8601DurationField","props","field","useFieldContext","getFieldErrorMessage"],"mappings":"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"}

package/dist/components/id-search.d.ts

@@ -1,5 +1,6 @@
+import { ClientPathsWithMethod } from 'openapi-fetch';
 import { Menu } from '../components/menu';
-import { CtxResourceName } from '../utilities/resources';
+import { CtxClientType } from '../utilities/ctx-client';
 import { FormFieldProps } from './form';
 /**
  * Minimal resource shape used by the ID search inputs.
@@ -19,7 +20,6 @@ type BaseSearchableResource = {
  * - Search (powered by react-query)
  * - Renders an accessible Autocomplete + Menu listbox
  * - Exposes a controlled `value`/`onChange` contract so callers (and wrappers) can manage state
- * - Automatically generates search function based on resource name using RESOURCE_ENDPOINT_MAP
  *
  * @template T - resource type extending `BaseSearchableResource` (must have `id` and `name`)
  * @template V - controlled value type (e.g. `string` for single-select or `string[]` for multi-select)
@@ -44,8 +44,8 @@ type BaseSearchableResource = {
  * @testing
  * - Ensure API client is provided via context; assert keyboard navigation, open/close behavior, and `onBlur` call on popover close.
  */
-declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, requiredIndicator, isDisabled, isInvalid, onBlur, resource, onChange, value, renderLabel, accessor, defaultParams, className, ...props }: FormFieldProps & {
-    resource: CtxResourceName;
+declare function BaseIdSearchInput<T extends BaseSearchableResource, V>({ label, description, errorMessage, requiredIndicator, isDisabled, isInvalid, onBlur, path, onChange, value, renderLabel, accessor, defaultParams, className, ...props }: FormFieldProps & {
+    path: ClientPathsWithMethod<CtxClientType, 'get'>;
     /** Disable interactions. */
     isDisabled?: boolean;
     /** Whether the field is invalid. */

package/dist/components/id-search.js

@@ -1,2 +1,2 @@
-"use client";import{jsx as n,jsxs as C}from"react/jsx-runtime";import{useQuery as B}from"@tanstack/react-query";import{useId as _,useState as j}from"react";import{Select as q,Autocomplete as w}from"react-aria-components";import{useCtxClient as R}from"../utilities/ctx-client.js";import{Loader as K}from"./loader.js";import{Menu as L,MenuItem as O}from"./menu.js";import{PopoverTrigger as P}from"./popover.js";import{SearchField as D}from"./searchfield.js";import{getFieldErrorMessage as a}from"../utilities/form.js";import{useFieldContext as v}from"../utilities/form-context.js";import{RESOURCE_ENDPOINT_MAP as G}from"../utilities/resources.js";import{FormField as Q}from"./form.js";import{SelectTrigger as U,SelectPopover as V}from"./select.js";import"../utilities/theme.js";import"clsx";import"./icons.js";import"./list-box.js";import"./button.js";import"class-variance-authority";import"@tanstack/react-form";import"../utilities/string.js";import"lodash-es";function k(t){return Array.isArray(t)&&t.every(r=>r&&typeof r=="object"&&"id"in r&&"name"in r)}function b({label:t,description:r,errorMessage:e,requiredIndicator:i,isDisabled:l,isInvalid:c,onBlur:N,resource:s,onChange:J,value:u,renderLabel:M,accessor:p,defaultParams:h,className:F,...f}){if(s==="profile")throw Error('Resource "profile" is not supported with IdSearch since it is not a searchable resource.');const x=_(),g=f.id||x,E=R(),[d,A]=j(""),{data:y,isError:S,isFetching:I,error:T}=B({queryKey:[s,"id",d],queryFn:async()=>{const m=(await E.GET(G[s],{params:{query:{search:d,...h?.query},path:{...h?.path}}})).data;return m&&k(m)?m:[]}});return n("div",{className:"group form-field","data-invalid":c?"":void 0,children:n(Q,{label:t,description:r,errorMessage:e,requiredIndicator:i,htmlFor:g,children:n(q,{isInvalid:c,children:C(P,{onOpenChange:o=>{o||N?.(u)},children:[n(U,{id:g,isDisabled:l,className:F??"w-full",children:M(u,y)}),n(V,{placement:"bottom start",children:C(w,{inputValue:d,onInputChange:A,children:[n(D,{className:"p-2",autoFocus:!0}),I&&n("div",{className:"p-input",children:n(K,{className:"mx-auto"})}),!I&&!S&&n(L,{...f,className:"max-h-48",items:y,renderEmptyState:()=>n("div",{className:"body-sm p-2",children:"No results found."}),children:o=>n(O,{id:o[p],children:o.name},o[p])}),S&&n("div",{className:"text-destructive p-icon body-sm",children:T.message})]})})]})})})})}function z({...t}){return n(b,{selectedKeys:[t.value],onSelectionChange:r=>t.onChange(Array.from(r).filter(e=>typeof e=="string")[0]),renderLabel:(r,e)=>e?.find(i=>i.id===r)?.name??r,selectionMode:"single",...t})}function H({...t}){return n(b,{selectedKeys:t.value,onSelectionChange:r=>t.onChange(Array.from(r).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(r,e)=>r?.map(i=>e?.find(l=>l.id===i)?.name??i).join(","),...t})}function Se({isDisabled:t,...r}){const e=v({disabled:t});return n(z,{...r,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e)})}function Ie({isDisabled:t,...r}){const e=v({disabled:t});return n(H,{...r,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e)})}export{H as MultipleIdSearchInput,z as SingleIdSearchInput,Ie as TfMultipleIdSearchInput,Se as TfSingleIdSearchInput};
+"use client";import{jsx as n,jsxs as v}from"react/jsx-runtime";import{useQuery as E}from"@tanstack/react-query";import{useId as T,useState as j}from"react";import{Select as w,Autocomplete as K}from"react-aria-components";import{Loader as L}from"./loader.js";import{Menu as R,MenuItem as _}from"./menu.js";import{PopoverTrigger as P}from"./popover.js";import{SearchField as D}from"./searchfield.js";import{useCtxClient as G}from"../utilities/ctx-client.js";import{getFieldErrorMessage as a}from"../utilities/form.js";import{useFieldContext as C}from"../utilities/form-context.js";import{FormField as O}from"./form.js";import{SelectTrigger as Q,SelectPopover as V}from"./select.js";import"../utilities/theme.js";import"clsx";import"./icons.js";import"./list-box.js";import"./button.js";import"class-variance-authority";import"@tanstack/react-form";function k(t){return Array.isArray(t)&&t.every(r=>r&&typeof r=="object"&&"id"in r&&"name"in r)}function b({label:t,description:r,errorMessage:e,requiredIndicator:i,isDisabled:s,isInvalid:c,onBlur:F,path:l,onChange:J,value:u,renderLabel:M,accessor:m,defaultParams:h,className:N,...f}){if(l==="/v3/me")throw Error('Path "/v3/me" is not supported with IdSearch since it is not a searchable resource.');const q=T(),p=f.id||q,x=G(),[g,A]=j(""),{data:y,isError:S,isFetching:I,error:B}=E({queryKey:["get",l],queryFn:async()=>{const d=(await x.GET(l,{params:{query:{search:g,...h?.query},path:{...h?.path}}})).data;return d&&k(d)?d:[]}});return n("div",{className:"group form-field","data-invalid":c?"":void 0,children:n(O,{label:t,description:r,errorMessage:e,requiredIndicator:i,htmlFor:p,children:n(w,{isInvalid:c,children:v(P,{onOpenChange:o=>{o||F?.(u)},children:[n(Q,{id:p,isDisabled:s,className:N??"w-full",children:M(u,y)}),n(V,{placement:"bottom start",children:v(K,{inputValue:g,onInputChange:A,children:[n(D,{className:"p-2",autoFocus:!0}),I&&n("div",{className:"p-input",children:n(L,{className:"mx-auto"})}),!I&&!S&&n(R,{...f,className:"max-h-48",items:y,renderEmptyState:()=>n("div",{className:"body-sm p-2",children:"No results found."}),children:o=>n(_,{id:o[m],children:o.name},o[m])}),S&&n("div",{className:"text-destructive p-icon body-sm",children:B.message})]})})]})})})})}function z({...t}){return n(b,{selectedKeys:[t.value],onSelectionChange:r=>t.onChange(Array.from(r).filter(e=>typeof e=="string")[0]),renderLabel:(r,e)=>e?.find(i=>i.id===r)?.name??r,selectionMode:"single",...t})}function H({...t}){return n(b,{selectedKeys:t.value,onSelectionChange:r=>t.onChange(Array.from(r).filter(e=>typeof e=="string")),selectionMode:"multiple",renderLabel:(r,e)=>r?.map(i=>e?.find(s=>s.id===i)?.name??i).join(","),...t})}function fe({isDisabled:t,...r}){const e=C({disabled:t});return n(z,{requiredIndicator:e.isRequired,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e),...r})}function pe({isDisabled:t,...r}){const e=C({disabled:t});return n(H,{requiredIndicator:e.isRequired,isDisabled:t||e.form.state.isSubmitting,value:e.state.value,onBlur:i=>e.handleBlur(),onChange:i=>e.handleChange(i),isInvalid:!!a(e),errorMessage:a(e),...r})}export{H as MultipleIdSearchInput,z as SingleIdSearchInput,pe as TfMultipleIdSearchInput,fe as TfSingleIdSearchInput};
 //# sourceMappingURL=id-search.js.map