@krak-stack/registry 0.1.0

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

@@ -0,0 +1,264 @@
+import { type PaginationMessages } from "./pagination.js";
+import { type ValidateFromPath } from "@tanstack/react-router";
+import { type Column, type ColumnDef, type Header, type RowData, type Table as TanstackTable, type VisibilityState } from "@tanstack/react-table";
+declare module "@tanstack/react-table" {
+    interface ColumnMeta<TData extends RowData, TValue> {
+        truncate?: boolean;
+    }
+}
+import { type HTMLAttributes, type ReactNode } from "react";
+import { Schema } from "effect";
+export declare const TableSearchSchema: Schema.Struct<{
+    readonly page: Schema.optional<Schema.Int>;
+    readonly pageSize: Schema.optional<Schema.Int>;
+    readonly globalFilter: Schema.optional<Schema.String>;
+    readonly sort: Schema.optional<Schema.decodeTo<Schema.String, Schema.decodeTo<Schema.$Array<Schema.Struct<{
+        readonly id: Schema.NonEmptyString;
+        readonly direction: Schema.Union<readonly [Schema.Literal<"asc">, Schema.Literal<"desc">]>;
+    }>>, Schema.String, never, never>, never, never>>;
+    readonly grouping: Schema.optional<Schema.$Array<Schema.String>>;
+}>;
+export declare const TableSearchSchemaStandard: ReturnType<typeof Schema.toStandardSchemaV1>;
+export type TableParams = Schema.Schema.Type<typeof TableSearchSchema>;
+export type DataTableMessages = PaginationMessages & {
+    actions: string;
+    empty: string;
+    loading: string;
+    filter: string;
+    export: string;
+    exportCsv: string;
+    exportJson: string;
+    refresh: string;
+    view: string;
+    tableView: string;
+    galleryView: string;
+    columns: string;
+    groupBy: string;
+    sortAsc: string;
+    sortDesc: string;
+    sortHide: string;
+    sortClear: string;
+    sortBy: string;
+    reorder: string;
+    resizeColumn: (column: string) => string;
+    listOthers: (count: number) => string;
+};
+export type DataTableMessageOverrides = Partial<DataTableMessages>;
+export declare const dataTableMessages: (overrides?: DataTableMessageOverrides) => {
+    pageSize: string;
+    results: (count: number) => string;
+    selectedOf: (selected: number, total: number) => string;
+    pageOf: (page: number, total: number) => string;
+    goToFirstPage: string;
+    goToPreviousPage: string;
+    goToNextPage: string;
+    goToLastPage: string;
+    actions: string;
+    empty: string;
+    loading: string;
+    filter: string;
+    export: string;
+    exportCsv: string;
+    exportJson: string;
+    refresh: string;
+    view: string;
+    tableView: string;
+    galleryView: string;
+    columns: string;
+    groupBy: string;
+    sortAsc: string;
+    sortDesc: string;
+    sortHide: string;
+    sortClear: string;
+    sortBy: string;
+    reorder: string;
+    resizeColumn: (column: string) => string;
+    listOthers: (count: number) => string;
+} | {
+    pageSize: string;
+    results: (count: number) => string;
+    selectedOf: (selected: number, total: number) => string;
+    pageOf: (page: number, total: number) => string;
+    goToFirstPage: string;
+    goToPreviousPage: string;
+    goToNextPage: string;
+    goToLastPage: string;
+    actions: string;
+    empty: string;
+    loading: string;
+    filter: string;
+    export: string;
+    exportCsv: string;
+    exportJson: string;
+    refresh: string;
+    view: string;
+    tableView: string;
+    galleryView: string;
+    columns: string;
+    groupBy: string;
+    sortAsc: string;
+    sortDesc: string;
+    sortHide: string;
+    sortClear: string;
+    sortBy: string;
+    reorder: string;
+    resizeColumn: (column: string) => string;
+    listOthers: (count: number) => string;
+};
+export interface DataTableGroupingField<TData> {
+    id: string;
+    label: string;
+    getGroupId: (row: TData) => string;
+    getRowGroupIds?: (row: TData) => string[];
+    getGroupIds?: () => string[];
+    getGroupLabel?: (groupId: string, rows: TData[]) => ReactNode;
+    renderGroupLabel?: (groupId: string, rows: TData[]) => ReactNode;
+    renderEmptyGroup?: (groupId: string) => ReactNode;
+    onMoveToGroup?: (row: TData, groupId: string) => void;
+    actionsTitle?: string;
+    actions?: DataTableGroupAction[];
+}
+export interface DataTableGrouping<TData> {
+    fields: DataTableGroupingField<TData>[];
+    initial?: string[];
+    getRowLabel?: (row: TData) => string;
+}
+export interface DataTableRelationshipOption {
+    icon?: ReactNode;
+    label: string;
+    value: string;
+}
+export interface DataTableGalleryConfig {
+    name: string;
+    description?: string;
+    tag?: string;
+    tagIcon?: ReactNode;
+}
+export interface DataTableReordering<TData> {
+    onReorder: (rows: TData[]) => void;
+    getRowId: (row: TData) => string;
+    getRowLabel?: (row: TData) => string;
+    handleLabel?: string;
+}
+export type DataTableRowAction<TData> = {
+    id?: string;
+    name: string;
+    icon?: ReactNode;
+    variant?: "default" | "destructive" | undefined;
+    onClick: (data: TData) => void;
+    visible?: (data: TData) => boolean;
+};
+export type DataTableGroupAction = {
+    name: string;
+    icon?: ReactNode;
+    variant?: "default" | "destructive" | undefined;
+    onClick: (groupId: string) => void;
+    visible?: (groupId: string) => boolean;
+};
+export interface DataTableState {
+    loading?: boolean;
+    error?: ReactNode;
+    empty?: ReactNode;
+}
+export type DataTablePaginationFeature = false | {
+    mode: "client";
+    pageSizes?: readonly number[];
+} | {
+    mode: "server";
+    rowCount: number;
+    pageSizes?: readonly number[];
+};
+export interface DataTableExportFeature {
+    baseName: string;
+    scope?: "currentPage" | "filteredRows";
+}
+export interface DataTableRowActionsFeature<TData> {
+    label?: string;
+    items: readonly DataTableRowAction<TData>[];
+}
+export interface DataTableColumnVisibilityFeature {
+    default?: VisibilityState;
+}
+export interface DataTableFeatures<TData> {
+    pagination?: DataTablePaginationFeature;
+    search?: boolean;
+    export?: false | DataTableExportFeature;
+    columnVisibility?: boolean | DataTableColumnVisibilityFeature;
+    gallery?: false | DataTableGalleryConfig;
+    sorting?: boolean;
+    rowActions?: false | DataTableRowActionsFeature<TData>;
+}
+type LegacyDataTableRowAction<TData> = Omit<DataTableRowAction<TData>, "id"> & {
+    id?: string;
+};
+interface DataTableProps<TData, TValue> {
+    columns: ColumnDef<TData, TValue>[];
+    data: TData[];
+    state?: DataTableState;
+    search?: TableParams;
+    onSearchChange?: (search: TableParams) => void;
+    searchState?: "url" | "local";
+    emptyLabel?: ReactNode;
+    messages?: DataTableMessageOverrides;
+    exportFileName?: string;
+    isLoading?: boolean;
+    onRefresh?: () => void;
+    onRowClick?: (row: TData) => void;
+    routeFrom?: ValidateFromPath;
+    from?: ValidateFromPath;
+    grouping?: DataTableGrouping<TData>;
+    reordering?: DataTableReordering<TData>;
+    features?: DataTableFeatures<TData>;
+    gallery?: DataTableGalleryConfig;
+    rowActions?: readonly LegacyDataTableRowAction<TData>[];
+    serverPagination?: {
+        rowCount: number;
+    };
+}
+export declare const DataTableRowActions: <TData>({ actions, contentClassName, row, title, }: {
+    actions: readonly DataTableRowAction<TData>[];
+    contentClassName?: string | undefined;
+    row: TData;
+    title?: string | undefined;
+}) => import("react").JSX.Element | null;
+export declare const getHeaderNames: (headers: Header<any, unknown>[]) => string[];
+export type CsvValue = string | number | boolean | null | undefined;
+export declare const downloadCsv: (headers: CsvValue[], data: CsvValue[][], fileName?: string) => void;
+export declare const downloadJson: (data: unknown, fileName?: string) => void;
+export declare function DataTable<TData, TValue>({ columns, data, state, search: controlledSearch, onSearchChange, searchState, emptyLabel, messages, exportFileName, isLoading: legacyIsLoading, onRefresh, onRowClick, from, routeFrom, grouping, gallery, rowActions: legacyRowActions, reordering, serverPagination, features, }: DataTableProps<TData, TValue>): import("react").JSX.Element;
+interface DataTablePaginationProps<TData> {
+    messages?: DataTableMessageOverrides;
+    pageSizes?: readonly number[] | undefined;
+    rowCount?: number | undefined;
+    table: TanstackTable<TData>;
+}
+export declare function DataTablePagination<TData>({ messages, pageSizes, rowCount, table, }: DataTablePaginationProps<TData>): import("react").JSX.Element;
+export declare function DataTableRelationshipCell({ emptyLabel, manageLabel, onAdd, onRemove, options, value, }: {
+    emptyLabel: string;
+    from?: ValidateFromPath;
+    manageLabel: string;
+    onAdd?: (value: string) => void;
+    onRemove?: (value: string) => void;
+    options: readonly DataTableRelationshipOption[];
+    value: readonly DataTableRelationshipOption[];
+}): import("react").JSX.Element;
+export declare function DataTableListSummary({ emptyLabel, expandable, items, overflowLabel, totalCount, variant, visibleCount, }: {
+    emptyLabel: ReactNode;
+    expandable?: boolean | undefined;
+    items: readonly (string | {
+        icon?: ReactNode;
+        label: string;
+        value?: string;
+    })[];
+    overflowLabel?: ((remaining: number) => ReactNode) | undefined;
+    totalCount?: number | undefined;
+    variant?: "icon" | "text" | undefined;
+    visibleCount?: number | undefined;
+}): import("react").JSX.Element;
+interface DataTableColumnHeaderProps<TData, TValue> extends HTMLAttributes<HTMLDivElement> {
+    column: Column<TData, TValue>;
+    messages?: DataTableMessageOverrides;
+    title: string;
+}
+export declare function DataTableColumnHeader<TData, TValue>({ column, messages, title, className, }: DataTableColumnHeaderProps<TData, TValue>): import("react").JSX.Element;
+export {};