@ciridae/ui 0.17.0 → 1.0.1

package/dist/components/ui/data-table-facet-filter.js

@@ -1,65 +0,0 @@
-import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
-import { CheckIcon, PlusCircleIcon } from "lucide-react";
-import { cn } from "../../lib/utils.js";
-import { useDataTable } from "./data-table-context.js";
-import { Badge } from "./badge.js";
-import { Button } from "./button.js";
-import { Command, CommandEmpty, CommandGroup, CommandInput, CommandItem, CommandList, CommandSeparator, } from "./command.js";
-import { Popover, PopoverContent, PopoverTrigger } from "./popover.js";
-import { Separator } from "./separator.js";
-/**
- * The facet-filter popover, controlled: one button per facet that wears the
- * current selection, checkable values inside. The caller owns the selection --
- * URL search state, column filters, anything -- and receives the whole next
- * selection on every toggle, so the popover can never disagree with the list
- * it narrows and there is nothing to apply or discard on close.
- */
-function FacetFilter({ counts, onSelectionChange, options, selected, title, }) {
-    const selectedSet = new Set(selected);
-    const toggle = (value) => {
-        const next = new Set(selectedSet);
-        if (next.has(value))
-            next.delete(value);
-        else
-            next.add(value);
-        onSelectionChange([...next]);
-    };
-    return (_jsxs(Popover, { children: [_jsx(PopoverTrigger, { asChild: true, children: _jsxs(Button, { size: "sm", type: "button", variant: "outline", children: [_jsx(PlusCircleIcon, {}), title, selectedSet.size > 0 ? (_jsxs(_Fragment, { children: [_jsx(Separator, { className: "mx-0.5 data-[orientation=vertical]:h-4", orientation: "vertical" }), _jsx(FacetSelectionSummary, { labels: options.filter((option) => selectedSet.has(option.value)) })] })) : null] }) }), _jsx(PopoverContent, { align: "start", className: "w-52 p-0", children: _jsxs(Command, { children: [_jsx(CommandInput, { placeholder: title }), _jsxs(CommandList, { children: [_jsx(CommandEmpty, { children: "No matches." }), _jsx(CommandGroup, { children: options.map((option) => (_jsx(FacetOptionItem, { count: counts?.get(option.value), onSelect: () => {
-                                            toggle(option.value);
-                                        }, option: option, selected: selectedSet.has(option.value) }, option.value))) }), selectedSet.size > 0 ? (_jsxs(_Fragment, { children: [_jsx(CommandSeparator, {}), _jsx(CommandGroup, { children: _jsx(CommandItem, { className: "justify-center", onSelect: () => {
-                                                    onSelectionChange([]);
-                                                }, children: "Clear" }) })] })) : null] })] }) })] }));
-}
-/**
- * The column-bound binding: narrow a column to a set of its own values.
- *
- * Selection lives in the column's filter value, and counts come from the
- * table's faceted row model, which `TanStackDataTable` already builds -- so an
- * option can say how many rows it would leave without the caller counting
- * anything itself. Pair with the `arrIncludesSome` filter function, which is
- * what a multi-select selection means.
- */
-function DataTableFacetFilter({ columnId, options, title, }) {
-    const column = useDataTable().getColumn(columnId);
-    return (_jsx(FacetFilter, { counts: column?.getFacetedUniqueValues(), onSelectionChange: (values) => {
-            // An empty selection is no filter at all, not a filter matching nothing.
-            column?.setFilterValue(values.length ? values : undefined);
-        }, options: options, selected: readSelection(column?.getFilterValue()), title: title }));
-}
-/** Names the choices while they still fit, then counts them. */
-function FacetSelectionSummary({ labels }) {
-    if (labels.length > 2)
-        return _jsxs(Badge, { variant: "secondary", children: [labels.length, " selected"] });
-    return (_jsx(_Fragment, { children: labels.map((option) => (_jsx(Badge, { variant: "secondary", children: option.label }, option.value))) }));
-}
-function FacetOptionItem({ count, onSelect, option, selected, }) {
-    const Icon = option.icon;
-    return (_jsxs(CommandItem, { onSelect: onSelect, children: [_jsx("span", { "aria-hidden": true, className: cn("grid size-4 place-content-center rounded-[4px] border border-input", selected ? "border-primary bg-primary text-primary-foreground" : "opacity-50"), children: selected ? _jsx(CheckIcon, { className: "size-3.5" }) : null }), Icon ? _jsx(Icon, { className: "size-4 text-muted-foreground" }) : null, _jsx("span", { className: "truncate", children: option.label }), count === undefined ? null : (_jsx("span", { className: "ml-auto font-mono text-xs tabular-nums text-muted-foreground", children: count }))] }));
-}
-/** A column filter value is `unknown`; only an array of strings is a selection. */
-function readSelection(value) {
-    if (!Array.isArray(value))
-        return [];
-    return value.filter((entry) => typeof entry === "string");
-}
-export { DataTableFacetFilter, FacetFilter };

package/dist/components/ui/data-table-grid.d.ts

@@ -1,10 +0,0 @@
-import * as React from "react";
-import { type Row, type Table as TanStackTable } from "@tanstack/react-table";
-declare function DataTableGrid<TData>({ empty, getRowClassName, onRowClick, rows, table, }: {
-    empty: React.ReactNode;
-    getRowClassName?: (row: Row<TData>) => string | undefined;
-    onRowClick?: (row: Row<TData>) => void;
-    rows: Row<TData>[];
-    table: TanStackTable<TData>;
-}): React.JSX.Element;
-export { DataTableGrid };

package/dist/components/ui/data-table-grid.js

@@ -1,34 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon } from "lucide-react";
-import { flexRender, } from "@tanstack/react-table";
-import { cn } from "../../lib/utils.js";
-import { Button } from "./button.js";
-import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "./table.js";
-/** Font taken from the enclosing `TableHead`; see `DataTableHeaderCell`. */
-const inheritType = { fontSize: "inherit", fontWeight: "inherit", lineHeight: "inherit" };
-function DataTableGrid({ empty, getRowClassName, onRowClick, rows, table, }) {
-    // One scroller, owned by `data-table-content` outside this: nesting an
-    // `overflow-x-auto` inside it would give the sticky header a scrollport that
-    // only ever scrolls sideways, so the header would ride away with the rows.
-    return (_jsxs(Table, { scrollable: false, children: [_jsx(TableHeader, { className: "sticky top-0 z-10 bg-background", children: table.getHeaderGroups().map((group) => (_jsx(TableRow, { children: group.headers.map((header) => (_jsx(TableHead, { style: { width: header.getSize() }, children: header.isPlaceholder ? null : _jsx(DataTableHeaderCell, { header: header }) }, header.id))) }, group.id))) }), _jsx(TableBody, { children: rows.length ? (rows.map((row) => (_jsx(DataTableDataRow, { getRowClassName: getRowClassName, onRowClick: onRowClick, row: row }, row.id)))) : (_jsx(TableRow, { children: _jsx(TableCell, { className: "h-32 text-center text-sm text-muted-foreground", colSpan: table.getVisibleLeafColumns().length, children: empty }) })) })] }));
-}
-function DataTableDataRow({ getRowClassName, onRowClick, row, }) {
-    return (_jsx(TableRow, { className: cn(onRowClick && "cursor-pointer", getRowClassName?.(row)), "data-state": row.getIsSelected() ? "selected" : undefined, onClick: onRowClick ? () => onRowClick(row) : undefined, children: row.getVisibleCells().map((cell) => (_jsx(TableCell, { children: flexRender(cell.column.columnDef.cell, cell.getContext()) }, cell.id))) }));
-}
-function DataTableHeaderCell({ header }) {
-    const sorted = header.column.getIsSorted();
-    // Paired chevrons while unsorted, a single arrow once sorted: the pair reads
-    // as "this can go either way", the arrow as "it went this way".
-    const Icon = sorted === "asc" ? ArrowUpIcon : sorted === "desc" ? ArrowDownIcon : ChevronsUpDownIcon;
-    if (!header.column.getCanSort())
-        return flexRender(header.column.columnDef.header, header.getContext());
-    return (_jsxs(Button, { "aria-pressed": Boolean(sorted), className: "-ml-2 h-auto px-2 py-0 text-muted-foreground hover:bg-transparent hover:text-foreground", 
-        // Type taken from the `<th>` this sits in, whatever that turns out to be,
-        // so a caller restyling its headers moves the sortable ones with them.
-        // Inline because Tailwind has no font-size or font-weight `inherit`
-        // utility, and an arbitrary-value one would be a second utility in the
-        // same group as the Button recipe's own -- decided by stylesheet order
-        // rather than by this file.
-        style: inheritType, onClick: header.column.getToggleSortingHandler(), size: "sm", type: "button", variant: "ghost", children: [_jsx("span", { children: flexRender(header.column.columnDef.header, header.getContext()) }), _jsx(Icon, {})] }));
-}
-export { DataTableGrid };

package/dist/components/ui/data-table-pagination.d.ts

@@ -1,17 +0,0 @@
-import type { Table as TanStackTable } from "@tanstack/react-table";
-import type { DataTablePaginationVariant, ResolvedDataTableLabels } from "./data-table-tanstack.js";
-declare function DataTablePagination<TData>({ footerControls, labels, pageSizeOptions, selectedRows, table, totalRows, variant, }: {
-    /**
-     * Controls that belong beside the row count rather than above the table --
-     * column settings, an export. Whatever governs the whole result set reads
-     * better next to the number saying how big it is.
-     */
-    footerControls?: React.ReactNode;
-    labels: ResolvedDataTableLabels;
-    pageSizeOptions: number[];
-    selectedRows: number;
-    table: TanStackTable<TData>;
-    totalRows: number;
-    variant?: DataTablePaginationVariant;
-}): import("@types/react").JSX.Element;
-export { DataTablePagination };

package/dist/components/ui/data-table-pagination.js

@@ -1,89 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { ChevronLeftIcon, ChevronRightIcon, ChevronsLeftIcon, ChevronsRightIcon, } from "lucide-react";
-import { Button } from "./button.js";
-import { NativeSelect, NativeSelectOption } from "./native-select.js";
-import { Pagination, PaginationContent, PaginationEllipsis, PaginationItem } from "./pagination.js";
-function DataTablePagination({ footerControls, labels, pageSizeOptions, selectedRows, table, totalRows, variant = "compact", }) {
-    const pagination = table.getState().pagination;
-    // `-1` is TanStack's "unknown", which a server-driven table reports until it
-    // is told a total. Clamping is right for the labels -- a reader is on page 1
-    // of at least 1 -- but a control that jumps to the end needs the difference.
-    const totalPages = table.getPageCount();
-    const pageCount = Math.max(totalPages, 1);
-    const page = Math.min(pagination.pageIndex + 1, pageCount);
-    const rowsShown = table.getRowModel().rows.length;
-    return (_jsxs("div", { "data-slot": "data-table-pagination", className: "flex flex-col gap-2 text-sm text-muted-foreground sm:flex-row sm:items-center sm:justify-between", children: [_jsxs("div", { className: "flex min-w-0 items-center gap-2", children: [_jsx("span", { className: "min-w-0 truncate", children: selectedRows > 0
-                            ? (labels.rowsSelected?.(selectedRows, totalRows) ??
-                                `${selectedRows} of ${totalRows} row(s) selected.`)
-                            : (labels.rowsShown?.(rowsShown, totalRows) ??
-                                `${rowsShown} of ${totalRows} row(s) shown.`) }), footerControls] }), _jsxs("div", { className: "flex shrink-0 items-center gap-2", children: [_jsx("span", { className: "shrink-0", children: labels.rowsPerPage }), _jsx(NativeSelect, { "aria-label": labels.rowsPerPageName, className: "min-w-20 shrink-0", onChange: (event) => table.setPageSize(Number(event.target.value)), size: "sm", value: pagination.pageSize, children: pageSizeOptions.map((pageSize) => (_jsx(NativeSelectOption, { value: pageSize, children: pageSize }, pageSize))) }), variant === "numbered" ? (_jsx(DataTablePager, { labels: labels, page: page, pageCount: pageCount, pageCountKnown: totalPages >= 0, table: table })) : (_jsxs(_Fragment, { children: [_jsx("div", { className: "min-w-20 text-center tabular-nums", children: labels.page?.(page, pageCount) ?? `Page ${page} of ${pageCount}` }), _jsx(DataTablePaginationButtons, { labels: labels, pageCountKnown: totalPages >= 0, table: table })] }))] })] }));
-}
-/**
- * Pages as a numbered row rather than a step counter.
- *
- * Worth the extra width when a reader has a page in mind -- page 7 of a member
- * directory is one click, not six. `pageCount` is the clamped count the label
- * uses, so an out-of-range index highlights nothing rather than inventing a
- * page that is not there.
- */
-function DataTablePager({ labels, page, pageCount, pageCountKnown, table, }) {
-    const back = !table.getCanPreviousPage();
-    const forward = !table.getCanNextPage();
-    return (_jsx(Pagination, { className: "mx-0 w-auto justify-end", children: _jsxs(PaginationContent, { children: [_jsx(PagerStepButton, { disabled: back, icon: ChevronsLeftIcon, label: labels.firstPage, onClick: () => {
-                        table.firstPage();
-                    } }), _jsx(PagerStepButton, { disabled: back, icon: ChevronLeftIcon, label: labels.previousPage, onClick: () => {
-                        table.previousPage();
-                    } }), _jsx(PagerNumbers, { page: page, pageCount: pageCount, table: table }), _jsx(PagerStepButton, { disabled: forward, icon: ChevronRightIcon, label: labels.nextPage, onClick: () => {
-                        table.nextPage();
-                    } }), pageCountKnown ? (_jsx(PagerStepButton, { disabled: forward, icon: ChevronsRightIcon, label: labels.lastPage, onClick: () => {
-                        table.lastPage();
-                    } })) : null] }) }));
-}
-/** The numbers themselves, with an ellipsis wherever the row elides a run. */
-function PagerNumbers({ page, pageCount, table, }) {
-    return (_jsx(_Fragment, { children: getPagerSteps(page, pageCount).map((step, index) => (_jsx(PaginationItem, { children: step === "gap" ? (_jsx(PaginationEllipsis, { className: "size-8" })) : (_jsx(Button, { "aria-current": step === page ? "page" : undefined, "aria-label": `Page ${String(step)}`, className: "tabular-nums", onClick: () => {
-                    table.setPageIndex(step - 1);
-                }, size: "icon-sm", type: "button", variant: step === page ? "outline" : "ghost", children: step })) }, step === "gap" ? `gap-${String(index)}` : step))) }));
-}
-/**
- * One of the four steps either side of the numbers, which differ only in these.
- *
- * Ghost rather than outlined: a row of six bordered boxes reads as six equal
- * things, and the only one worth pointing at is the page you are on.
- */
-function PagerStepButton({ disabled, icon: Icon, label, onClick, }) {
-    return (_jsx(PaginationItem, { children: _jsx(Button, { "aria-label": label, disabled: disabled, onClick: onClick, size: "icon-sm", type: "button", variant: "ghost", children: _jsx(Icon, {}) }) }));
-}
-/**
- * The page numbers to draw: always the first and last, always the current and
- * its neighbours, and a gap wherever that skips more than one page.
- *
- * The row is always seven slots wide or fewer, however many pages there are.
- */
-function getPagerSteps(page, pageCount) {
-    if (pageCount <= 7)
-        return countUp(1, pageCount);
-    let from = Math.min(Math.max(page - 1, 2), pageCount - 4);
-    let to = Math.max(Math.min(page + 1, pageCount - 1), 5);
-    // A gap hiding a single page is wider than the page it hides, so widen the
-    // window over it instead. Only one side can be one short of the end at a
-    // time above seven pages, so this cannot push the row past seven slots.
-    if (from === 3)
-        from = 2;
-    if (to === pageCount - 2)
-        to = pageCount - 1;
-    return [
-        1,
-        ...(from > 2 ? ["gap"] : []),
-        ...countUp(from, to),
-        ...(to < pageCount - 1 ? ["gap"] : []),
-        pageCount,
-    ];
-}
-function countUp(from, to) {
-    return Array.from({ length: to - from + 1 }, (_, index) => from + index);
-}
-function DataTablePaginationButtons({ labels, pageCountKnown, table, }) {
-    return (_jsxs("div", { className: "flex items-center gap-1", children: [_jsx(Button, { "aria-label": labels.firstPage, disabled: !table.getCanPreviousPage(), onClick: () => table.firstPage(), size: "icon-sm", type: "button", variant: "outline", children: _jsx(ChevronsLeftIcon, {}) }), _jsx(Button, { "aria-label": labels.previousPage, disabled: !table.getCanPreviousPage(), onClick: () => table.previousPage(), size: "icon-sm", type: "button", variant: "outline", children: _jsx(ChevronLeftIcon, {}) }), _jsx(Button, { "aria-label": labels.nextPage, disabled: !table.getCanNextPage(), onClick: () => table.nextPage(), size: "icon-sm", type: "button", variant: "outline", children: _jsx(ChevronRightIcon, {}) }), pageCountKnown ? (_jsx(Button, { "aria-label": labels.lastPage, disabled: !table.getCanNextPage(), onClick: () => table.lastPage(), size: "icon-sm", type: "button", variant: "outline", children: _jsx(ChevronsRightIcon, {}) })) : null] }));
-}
-export { DataTablePagination };

package/dist/components/ui/data-table-search-input.d.ts

@@ -1,14 +0,0 @@
-type DataTableSearchInputProps = {
-    ariaLabel: string;
-    onChange: (value: string) => void;
-    placeholder: string;
-    value: string;
-};
-/**
- * Shows what is being typed. Any debounce that turns the value into an address
- * belongs in the caller's table state, next to everything else that decides
- * what the table is looking at -- so a Clear that cancels a search cancels the
- * write still in flight along with it.
- */
-declare function DataTableSearchInput({ ariaLabel, onChange, placeholder, value, }: DataTableSearchInputProps): import("@types/react").JSX.Element;
-export { DataTableSearchInput, type DataTableSearchInputProps };

package/dist/components/ui/data-table-search-input.js

@@ -1,15 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { SearchIcon } from "lucide-react";
-import { Input } from "./input.js";
-/**
- * Shows what is being typed. Any debounce that turns the value into an address
- * belongs in the caller's table state, next to everything else that decides
- * what the table is looking at -- so a Clear that cancels a search cancels the
- * write still in flight along with it.
- */
-function DataTableSearchInput({ ariaLabel, onChange, placeholder, value, }) {
-    return (_jsxs("div", { className: "relative w-full sm:max-w-64", children: [_jsx(SearchIcon, { className: "pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2 text-muted-foreground" }), _jsx(Input, { "aria-label": ariaLabel, className: "pl-8", onChange: (event) => {
-                    onChange(event.target.value);
-                }, placeholder: placeholder, type: "search", value: value })] }));
-}
-export { DataTableSearchInput };

package/dist/components/ui/data-table-state.d.ts

@@ -1,19 +0,0 @@
-/**
- * The vocabulary a controlled `TanStackDataTable` is driven in.
- *
- * `TanStackDataTableProps` already exposes these types publicly -- a consumer
- * cannot write `onSortingChange` or a `ColumnDef` without naming them. Without
- * this module the only way to name them is to depend on `@tanstack/react-table`
- * directly, which makes every consumer responsible for keeping a version in
- * step with this package's. Re-exporting them keeps the table library an
- * implementation detail on this side of the boundary.
- */
-export type { Cell, Column, ColumnDef, ColumnFiltersState, ColumnOrderState, Header, OnChangeFn, PaginationState, Row, RowSelectionState, SortingState, Table, TableOptions, Updater, VisibilityState, } from "@tanstack/react-table";
-/**
- * Resolve an `Updater` to the value it stands for.
- *
- * Every controlled handler receives either the next state or a function
- * producing it from the current one, so a consumer that stores state elsewhere
- * -- a URL, a store -- has to collapse that fork before it can write anywhere.
- */
-export { functionalUpdate } from "@tanstack/react-table";

package/dist/components/ui/data-table-state.js

@@ -1,8 +0,0 @@
-/**
- * Resolve an `Updater` to the value it stands for.
- *
- * Every controlled handler receives either the next state or a function
- * producing it from the current one, so a consumer that stores state elsewhere
- * -- a URL, a store -- has to collapse that fork before it can write anywhere.
- */
-export { functionalUpdate } from "@tanstack/react-table";

package/dist/components/ui/data-table-tanstack.d.ts

@@ -1,99 +0,0 @@
-import * as React from "react";
-import { type ColumnDef, type ColumnFiltersState, type ColumnOrderState, type OnChangeFn, type PaginationState, type Row, type RowSelectionState, type SortingState, type TableOptions, type VisibilityState } from "@tanstack/react-table";
-type DataTableState = {
-    columnFilters?: ColumnFiltersState;
-    columnOrder?: ColumnOrderState;
-    columnVisibility?: VisibilityState;
-    globalFilter?: string;
-    pagination?: PaginationState;
-    rowSelection?: RowSelectionState;
-    sorting?: SortingState;
-};
-type DataTableLabels = {
-    columns?: string;
-    empty?: React.ReactNode;
-    filterPlaceholder?: string;
-    firstPage?: string;
-    lastPage?: string;
-    nextPage?: string;
-    page?: (page: number, pageCount: number) => string;
-    previousPage?: string;
-    /** Sits before the page-size control, which reads "Show 25" rather than "25 rows". */
-    rowsPerPage?: string;
-    /**
-     * The page-size control's accessible name. Separate from `rowsPerPage`
-     * because that one is terse by design: "Show" beside a number says enough
-     * with the footer in view and nothing at all read out on its own.
-     */
-    rowsPerPageName?: string;
-    rowsSelected?: (selected: number, total: number) => string;
-    rowsShown?: (shown: number, total: number) => string;
-};
-type DataTableFilterMode = "global" | "column" | false;
-type DataTablePaginationVariant = "compact" | "numbered";
-type TanStackDataTableProps<TData, TValue = unknown> = Omit<React.ComponentProps<"div">, "children"> & {
-    actions?: React.ReactNode;
-    clampPageIndex?: boolean;
-    columns: ColumnDef<TData, TValue>[];
-    data: TData[];
-    defaultColumnOrder?: ColumnOrderState;
-    defaultColumnVisibility?: VisibilityState;
-    defaultPageSize?: number;
-    empty?: React.ReactNode;
-    enableColumnFilters?: boolean;
-    enableColumnVisibility?: boolean;
-    enableGlobalFilter?: boolean;
-    /**
-     * Whether columns may be hidden at all, separately from whether the built-in
-     * columns menu is offered. They were the same switch while the menu was the
-     * only way to hide a column; a caller supplying its own control needs to turn
-     * the menu off without also making every column permanent.
-     */
-    enableHiding?: boolean;
-    enablePagination?: boolean;
-    enableRowSelection?: TableOptions<TData>["enableRowSelection"];
-    enableSorting?: boolean;
-    filterMode?: DataTableFilterMode;
-    filterPlaceholder?: string;
-    /**
-     * Controls for the footer, beside the row count. Whatever governs the whole
-     * result set -- column settings, an export -- reads better next to the number
-     * saying how big it is than stacked above the table with the filters.
-     *
-     * The footer is the pagination row, so `enablePagination={false}` removes
-     * these along with it; put them in `actions` for a table that does not page.
-     */
-    footerControls?: React.ReactNode;
-    getRowClassName?: (row: Row<TData>) => string | undefined;
-    getRowId?: TableOptions<TData>["getRowId"];
-    labels?: DataTableLabels;
-    loading?: boolean;
-    manualFiltering?: boolean;
-    manualPagination?: boolean;
-    manualSorting?: boolean;
-    onColumnFiltersChange?: OnChangeFn<ColumnFiltersState>;
-    onColumnOrderChange?: OnChangeFn<ColumnOrderState>;
-    onColumnVisibilityChange?: OnChangeFn<VisibilityState>;
-    onGlobalFilterChange?: OnChangeFn<string>;
-    /**
-     * Called instead of `onPaginationChange` when `clampPageIndex` moves a page
-     * index that pointed past the end, so a caller storing the page can replace
-     * the address that was wrong rather than pushing the correction on top of it.
-     */
-    onPageIndexCorrected?: (pageIndex: number) => void;
-    onPaginationChange?: OnChangeFn<PaginationState>;
-    onRowClick?: (row: Row<TData>) => void;
-    onRowSelectionChange?: OnChangeFn<RowSelectionState>;
-    onSortingChange?: OnChangeFn<SortingState>;
-    pageCount?: number;
-    pageSizeOptions?: number[];
-    paginationVariant?: DataTablePaginationVariant;
-    rowCount?: number;
-    state?: DataTableState;
-    tableOptions?: Partial<TableOptions<TData>>;
-    toolbar?: React.ReactNode;
-};
-type ResolvedDataTableLabels = Required<Pick<DataTableLabels, "columns" | "filterPlaceholder" | "firstPage" | "lastPage" | "nextPage" | "previousPage" | "rowsPerPage" | "rowsPerPageName">> & DataTableLabels;
-declare function TanStackDataTable<TData, TValue = unknown>(props: TanStackDataTableProps<TData, TValue>): React.JSX.Element;
-export { TanStackDataTable };
-export type { DataTableFilterMode, DataTableLabels, DataTablePaginationVariant, DataTableState, ResolvedDataTableLabels, TanStackDataTableProps, };

package/dist/components/ui/data-table-tanstack.js

@@ -1,128 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import * as React from "react";
-import { getCoreRowModel, getFacetedRowModel, getFacetedUniqueValues, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable, } from "@tanstack/react-table";
-import { cn } from "../../lib/utils.js";
-import { TableSkeleton } from "./loading-state.js";
-import { DataTableTools } from "./data-table-controls.js";
-import { DataTableProvider } from "./data-table-context.js";
-import { DataTableGrid } from "./data-table-grid.js";
-import { DataTablePagination } from "./data-table-pagination.js";
-const defaultLabels = {
-    columns: "Columns",
-    empty: "No results.",
-    filterPlaceholder: "Filter rows...",
-    firstPage: "First page",
-    lastPage: "Last page",
-    nextPage: "Next page",
-    previousPage: "Previous page",
-    rowsPerPage: "Show",
-    rowsPerPageName: "Rows per page",
-};
-function TanStackDataTable(props) {
-    const table = useDataTableInstance(props);
-    useClampedPageIndex(table, props.clampPageIndex, props.loading, props.onPageIndexCorrected);
-    const labels = { ...defaultLabels, ...props.labels };
-    const rows = table.getRowModel().rows;
-    const pagination = table.getState().pagination;
-    const totalRows = props.rowCount ?? table.getFilteredRowModel().rows.length;
-    const hasToolbar = Boolean(props.toolbar ||
-        props.actions ||
-        props.filterMode !== false ||
-        props.enableColumnVisibility !== false);
-    return (_jsx(DataTableProvider, { table: table, children: _jsxs("div", { "data-slot": "data-table", className: cn("flex flex-col gap-(--panel-gap)", props.className), children: [hasToolbar ? _jsx(DataTableTools, { labels: labels, props: props, table: table }) : null, _jsx("div", { "data-slot": "data-table-content", className: "min-h-0 flex-1 overflow-auto border-t border-border", children: props.loading ? (_jsx(TableSkeleton, { className: "rounded-none border-x-0 border-b-0", columns: table.getVisibleLeafColumns().length, rows: pagination.pageSize })) : (_jsx(DataTableGrid, { empty: props.empty ?? labels.empty, getRowClassName: props.getRowClassName, onRowClick: props.onRowClick, rows: rows, table: table })) }), props.enablePagination !== false ? (_jsx(DataTablePagination, { footerControls: props.footerControls, labels: labels, pageSizeOptions: props.pageSizeOptions ?? [10, 25, 50, 100], selectedRows: table.getFilteredSelectedRowModel().rows.length, table: table, totalRows: totalRows, variant: props.paginationVariant })) : null] }) }));
-}
-/**
- * Move a page index that points past the last page back onto a page that
- * exists, reporting the correction through `onPaginationChange`.
- *
- * A caller that keeps the page in the URL can be handed any number at all --
- * `?page=99` in a bookmark, or a page that was valid until a filter narrowed
- * the rows under it. Without this the grid renders an empty body while the
- * footer still counts rows the reader cannot reach, and nothing puts the
- * address right. Correcting through the caller's own handler rather than
- * quietly inside the table keeps the URL and the table saying one thing.
- *
- * Off by default, and skipped while `loading`: it reaches out through the
- * caller's handler, which for a caller that navigates on pagination is a
- * navigation -- not something to start doing to an existing table uninvited,
- * or to do at all while an empty result still means "not yet".
- *
- * `onPageIndexCorrected` exists so that handler can tell a correction from a
- * page turn. A caller writing the page into the URL wants a turn to be a place
- * to come back to and a correction to replace the address that was wrong --
- * and without this they arrive as the same call.
- */
-function useClampedPageIndex(table, enabled, loading, onCorrected) {
-    const { pageIndex } = table.getState().pagination;
-    const lastPageIndex = Math.max(table.getPageCount() - 1, 0);
-    const outOfRange = enabled === true && loading !== true && pageIndex > lastPageIndex;
-    const correctedRef = React.useRef(onCorrected);
-    React.useEffect(() => {
-        correctedRef.current = onCorrected;
-    }, [onCorrected]);
-    React.useEffect(() => {
-        if (!outOfRange)
-            return;
-        const corrected = correctedRef.current;
-        if (corrected)
-            corrected(lastPageIndex);
-        else
-            table.setPageIndex(lastPageIndex);
-    }, [lastPageIndex, outOfRange, table]);
-}
-function useDataTableInstance(props) {
-    const [sorting, setSorting] = React.useState(props.state?.sorting ?? []);
-    const [columnFilters, setColumnFilters] = React.useState(props.state?.columnFilters ?? []);
-    const [columnOrder, setColumnOrder] = React.useState(props.state?.columnOrder ?? props.defaultColumnOrder ?? []);
-    const [columnVisibility, setColumnVisibility] = React.useState(props.state?.columnVisibility ?? props.defaultColumnVisibility ?? {});
-    const [rowSelection, setRowSelection] = React.useState(props.state?.rowSelection ?? {});
-    const [globalFilter, setGlobalFilter] = React.useState(props.state?.globalFilter ?? "");
-    const [pagination, setPagination] = React.useState(props.state?.pagination ?? { pageIndex: 0, pageSize: props.defaultPageSize ?? 10 });
-    return useReactTable({
-        data: props.data,
-        columns: props.columns,
-        // What `table.resetColumnOrder()` and `resetColumnVisibility()` restore.
-        // Seeding the hooks above is not enough: reset reads `initialState`, so
-        // without this a Reset control would clear a caller's defaults rather
-        // than return to them.
-        initialState: {
-            columnOrder: props.defaultColumnOrder ?? [],
-            columnVisibility: props.defaultColumnVisibility ?? {},
-        },
-        getRowId: props.getRowId,
-        pageCount: props.pageCount,
-        rowCount: props.rowCount,
-        enableColumnFilters: props.enableColumnFilters ?? true,
-        enableGlobalFilter: props.enableGlobalFilter ?? true,
-        enableHiding: props.enableHiding ?? props.enableColumnVisibility ?? true,
-        enableRowSelection: props.enableRowSelection ?? false,
-        enableSorting: props.enableSorting ?? true,
-        manualFiltering: props.manualFiltering ?? false,
-        manualPagination: props.manualPagination ?? false,
-        manualSorting: props.manualSorting ?? false,
-        state: {
-            columnFilters: props.state?.columnFilters ?? columnFilters,
-            columnOrder: props.state?.columnOrder ?? columnOrder,
-            columnVisibility: props.state?.columnVisibility ?? columnVisibility,
-            globalFilter: props.state?.globalFilter ?? globalFilter,
-            pagination: props.state?.pagination ?? pagination,
-            rowSelection: props.state?.rowSelection ?? rowSelection,
-            sorting: props.state?.sorting ?? sorting,
-        },
-        onColumnFiltersChange: props.onColumnFiltersChange ?? setColumnFilters,
-        onColumnOrderChange: props.onColumnOrderChange ?? setColumnOrder,
-        onColumnVisibilityChange: props.onColumnVisibilityChange ?? setColumnVisibility,
-        onGlobalFilterChange: props.onGlobalFilterChange ?? setGlobalFilter,
-        onPaginationChange: props.onPaginationChange ?? setPagination,
-        onRowSelectionChange: props.onRowSelectionChange ?? setRowSelection,
-        onSortingChange: props.onSortingChange ?? setSorting,
-        getCoreRowModel: getCoreRowModel(),
-        getFacetedRowModel: getFacetedRowModel(),
-        getFacetedUniqueValues: getFacetedUniqueValues(),
-        getFilteredRowModel: getFilteredRowModel(),
-        getPaginationRowModel: props.enablePagination === false ? undefined : getPaginationRowModel(),
-        getSortedRowModel: getSortedRowModel(),
-        ...props.tableOptions,
-    });
-}
-export { TanStackDataTable };

package/dist/components/ui/data-table.d.ts

@@ -1,19 +0,0 @@
-import * as React from "react";
-import { TableHead } from "./table.js";
-import { type TableSkeletonProps } from "./loading-state.js";
-import { TanStackDataTable } from "./data-table-tanstack.js";
-import type { DataTableLabels, TanStackDataTableProps } from "./data-table-tanstack.js";
-type SortDirection = "asc" | "desc";
-declare function DataTable({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-declare function DataTableToolbar({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-declare function DataTableContent({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-declare function DataTableEmpty({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-declare function DataTableSkeleton({ className, ...props }: TableSkeletonProps): React.JSX.Element;
-declare function SortableTableHead({ active, children, className, direction, onSort, align, ...props }: React.ComponentProps<typeof TableHead> & {
-    active?: boolean;
-    align?: "left" | "right";
-    direction?: SortDirection;
-    onSort: () => void;
-}): React.JSX.Element;
-export { DataTable, DataTableToolbar, DataTableContent, DataTableEmpty, DataTableSkeleton, TanStackDataTable, SortableTableHead, };
-export type { DataTableLabels, SortDirection, TanStackDataTableProps };

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

@@ -1,35 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { ArrowDownIcon, ArrowUpDownIcon, ArrowUpIcon } from "lucide-react";
-import { cn } from "../../lib/utils.js";
-import { Button } from "./button.js";
-import { TableHead } from "./table.js";
-import { TableSkeleton } from "./loading-state.js";
-import { TanStackDataTable } from "./data-table-tanstack.js";
-function DataTable({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "data-table", className: cn("grid gap-(--panel-gap)", className), ...props }));
-}
-function DataTableToolbar({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "data-table-toolbar", className: cn("flex flex-col gap-2 sm:flex-row sm:items-center sm:justify-between", className), ...props }));
-}
-function DataTableContent({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "data-table-content", className: cn("overflow-hidden border-t border-border", className), ...props }));
-}
-function DataTableEmpty({ className, ...props }) {
-    return (_jsx("div", { "data-slot": "data-table-empty", className: cn("flex min-h-32 items-center justify-center border-b border-border px-(--panel-padding) py-8 text-sm text-muted-foreground", className), ...props }));
-}
-function DataTableSkeleton({ className, ...props }) {
-    return (_jsx(DataTableContent, { className: "border-t-0", children: _jsx(TableSkeleton, { className: cn("rounded-none border-x-0 border-b-0", className), ...props }) }));
-}
-/** Font taken from the enclosing `TableHead`; see `SortableTableHead`. */
-const inheritType = { fontSize: "inherit", fontWeight: "inherit", lineHeight: "inherit" };
-function SortableTableHead({ active = false, children, className, direction = "asc", onSort, align = "left", ...props }) {
-    const Icon = active ? (direction === "asc" ? ArrowUpIcon : ArrowDownIcon) : ArrowUpDownIcon;
-    return (_jsx(TableHead, { "aria-sort": active ? (direction === "asc" ? "ascending" : "descending") : "none", className: cn(align === "right" && "text-right", className), ...props, children: _jsxs(Button, { "aria-pressed": active, className: cn("h-auto px-0 py-0 text-muted-foreground hover:bg-transparent hover:text-foreground", align === "right" ? "ml-auto justify-end" : "justify-start"), onClick: onSort, size: "sm", 
-            // Type taken from the `<th>`, including a `className` the caller put
-            // there, so a restyled header row stays one typeface. Inline rather
-            // than a utility: Tailwind has no font-size or font-weight `inherit`,
-            // and an arbitrary-value one would compete with the Button recipe's
-            // own on stylesheet order.
-            style: inheritType, type: "button", variant: "ghost", children: [_jsx("span", { children: children }), _jsx(Icon, {})] }) }));
-}
-export { DataTable, DataTableToolbar, DataTableContent, DataTableEmpty, DataTableSkeleton, TanStackDataTable, SortableTableHead, };

package/dist/components/ui/dialog.d.ts

@@ -1,23 +0,0 @@
-import * as React from "react";
-import { Dialog as DialogPrimitive } from "radix-ui";
-declare function DialogPortalContainerProvider({ children, container, disableModalBehavior, }: {
-    children: React.ReactNode;
-    container: HTMLElement | null;
-    disableModalBehavior?: boolean;
-}): React.JSX.Element;
-declare function Dialog({ modal, ...props }: React.ComponentProps<typeof DialogPrimitive.Root>): React.JSX.Element;
-declare function DialogTrigger({ ...props }: React.ComponentProps<typeof DialogPrimitive.Trigger>): React.JSX.Element;
-declare function DialogPortal({ container, ...props }: React.ComponentProps<typeof DialogPrimitive.Portal>): React.JSX.Element;
-declare function DialogClose({ ...props }: React.ComponentProps<typeof DialogPrimitive.Close>): React.JSX.Element;
-declare function DialogOverlay({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Overlay>): React.JSX.Element;
-declare function DialogContent({ className, children, overlayClassName, showCloseButton, ...props }: React.ComponentProps<typeof DialogPrimitive.Content> & {
-    overlayClassName?: string;
-    showCloseButton?: boolean;
-}): React.JSX.Element;
-declare function DialogHeader({ className, ...props }: React.ComponentProps<"div">): React.JSX.Element;
-declare function DialogFooter({ className, showCloseButton, children, ...props }: React.ComponentProps<"div"> & {
-    showCloseButton?: boolean;
-}): React.JSX.Element;
-declare function DialogTitle({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Title>): React.JSX.Element;
-declare function DialogDescription({ className, ...props }: React.ComponentProps<typeof DialogPrimitive.Description>): React.JSX.Element;
-export { Dialog, DialogClose, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogOverlay, DialogPortal, DialogPortalContainerProvider, DialogTitle, DialogTrigger, };