@uipath/apollo-vertex 1.2.0 → 1.4.0

package/dist/lib/i18n.d.ts

@@ -6,6 +6,7 @@ declare const localeLoaders: {
             access_denied: string;
             access_denied_description: string;
             actions: string;
+            active: string;
             actual_input: string;
             actual_output: string;
             add_attachment: string;
@@ -27,6 +28,7 @@ declare const localeLoaders: {
             analytics: string;
             apollo_vertex: string;
             apollo_vertex_description: string;
+            archive: string;
             are_you_sure: string;
             asc: string;
             ask_ai: string;
@@ -189,6 +191,8 @@ declare const localeLoaders: {
             more_pages: string;
             multi_line_too_few_metrics: string;
             my_template: string;
+            nav_collapse: string;
+            nav_expand: string;
             need_help: string;
             new_conversation: string;
             new_conversation_confirm_description: string;
@@ -277,6 +281,7 @@ declare const localeLoaders: {
             scroll_to_bottom: string;
             search: string;
             search_frameworks: string;
+            search_input: string;
             secondary: string;
             select_a_framework: string;
             select_all: string;
@@ -372,6 +377,7 @@ declare const localeLoaders: {
         access_denied: string;
         access_denied_description: string;
         actions: string;
+        active: string;
         actual_input: string;
         actual_output: string;
         add_attachment: string;
@@ -393,6 +399,7 @@ declare const localeLoaders: {
         analytics: string;
         apollo_vertex: string;
         apollo_vertex_description: string;
+        archive: string;
         are_you_sure: string;
         asc: string;
         ask_ai: string;
@@ -555,6 +562,8 @@ declare const localeLoaders: {
         more_pages: string;
         multi_line_too_few_metrics: string;
         my_template: string;
+        nav_collapse: string;
+        nav_expand: string;
         need_help: string;
         new_conversation: string;
         new_conversation_confirm_description: string;
@@ -643,6 +652,7 @@ declare const localeLoaders: {
         scroll_to_bottom: string;
         search: string;
         search_frameworks: string;
+        search_input: string;
         secondary: string;
         select_a_framework: string;
         select_all: string;

package/dist/lib/table-features.d.ts

@@ -0,0 +1,38 @@
+import { type Column, type ColumnDef, type FilterFn, type ReactTable, type Row, type RowData } from "@tanstack/react-table";
+export type { RowData };
+export declare const dataTableFeatures: {
+    rowSortingFeature: import("@tanstack/react-table").TableFeature;
+    columnFilteringFeature: import("@tanstack/react-table").TableFeature;
+    globalFilteringFeature: import("@tanstack/react-table").TableFeature;
+    rowPaginationFeature: import("@tanstack/react-table").TableFeature;
+    rowSelectionFeature: import("@tanstack/react-table").TableFeature;
+    rowExpandingFeature: import("@tanstack/react-table").TableFeature;
+    columnVisibilityFeature: import("@tanstack/react-table").TableFeature;
+    columnOrderingFeature: import("@tanstack/react-table").TableFeature;
+    columnSizingFeature: import("@tanstack/react-table").TableFeature;
+    columnResizingFeature: import("@tanstack/react-table").TableFeature;
+    sortedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    filteredRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    paginatedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    expandedRowModel: (table: import("@tanstack/react-table").Table<any, any>) => () => import("@tanstack/react-table").RowModel<any, any>;
+    sortFns: {
+        alphanumeric: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        text: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        datetime: import("@tanstack/react-table").CreatedSortFn<any, any>;
+        basic: import("@tanstack/react-table").CreatedSortFn<any, any>;
+    };
+    filterFns: {
+        includesString: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+        inNumberRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+        equals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+        arrIncludes: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+        inDateRange: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+        weakEquals: import("@tanstack/react-table").CreatedFilterFn<any, any>;
+    };
+};
+export type DataTableFeatures = typeof dataTableFeatures;
+export type DataTableColumnDef<TData extends RowData, TValue = unknown> = ColumnDef<DataTableFeatures, TData, TValue>;
+export type DataTableRow<TData extends RowData> = Row<DataTableFeatures, TData>;
+export type DataTableColumn<TData extends RowData, TValue = unknown> = Column<DataTableFeatures, TData, TValue>;
+export type DataTableInstance<TData extends RowData> = ReactTable<DataTableFeatures, TData>;
+export type DataTableFilterFn<TData extends RowData> = FilterFn<DataTableFeatures, TData>;

package/dist/lib/table-features.js

@@ -0,0 +1,32 @@
+import { columnFilteringFeature, columnOrderingFeature, columnResizingFeature, columnSizingFeature, columnVisibilityFeature, createExpandedRowModel, createFilteredRowModel, createPaginatedRowModel, createSortedRowModel, filterFn_arrIncludes, filterFn_equals, filterFn_inDateRange, filterFn_inNumberRange, filterFn_includesString, filterFn_weakEquals, globalFilteringFeature, rowExpandingFeature, rowPaginationFeature, rowSelectionFeature, rowSortingFeature, sortFn_alphanumeric, sortFn_basic, sortFn_datetime, sortFn_text, tableFeatures } from "@tanstack/react-table";
+const dataTableFeatures = tableFeatures({
+    rowSortingFeature: rowSortingFeature,
+    columnFilteringFeature: columnFilteringFeature,
+    globalFilteringFeature: globalFilteringFeature,
+    rowPaginationFeature: rowPaginationFeature,
+    rowSelectionFeature: rowSelectionFeature,
+    rowExpandingFeature: rowExpandingFeature,
+    columnVisibilityFeature: columnVisibilityFeature,
+    columnOrderingFeature: columnOrderingFeature,
+    columnSizingFeature: columnSizingFeature,
+    columnResizingFeature: columnResizingFeature,
+    sortedRowModel: createSortedRowModel(),
+    filteredRowModel: createFilteredRowModel(),
+    paginatedRowModel: createPaginatedRowModel(),
+    expandedRowModel: createExpandedRowModel(),
+    sortFns: {
+        alphanumeric: sortFn_alphanumeric,
+        text: sortFn_text,
+        datetime: sortFn_datetime,
+        basic: sortFn_basic
+    },
+    filterFns: {
+        includesString: filterFn_includesString,
+        inNumberRange: filterFn_inNumberRange,
+        equals: filterFn_equals,
+        arrIncludes: filterFn_arrIncludes,
+        inDateRange: filterFn_inDateRange,
+        weakEquals: filterFn_weakEquals
+    }
+});
+export { dataTableFeatures };

package/dist/locales/en.json

@@ -3,6 +3,7 @@
   "access_denied": "Access Denied",
   "access_denied_description": "You don't have access to this application. Ask your administrator to add you to the users group.",
   "actions": "Actions",
+  "active": "Active",
   "actual_input": "Actual input",
   "actual_output": "Actual output",
   "add_attachment": "Add attachment",
@@ -24,6 +25,7 @@
   "analytics": "Analytics",
   "apollo_vertex": "Apollo Vertex",
   "apollo_vertex_description": "- UiPath Apollo Vertex",
+  "archive": "Archive",
   "are_you_sure": "Are you sure?",
   "asc": "Asc",
   "ask_ai": "Ask AI",
@@ -186,6 +188,8 @@
   "more_pages": "More pages",
   "multi_line_too_few_metrics": "Multi-line needs two distinct metrics, but the request resolved to fewer than two.",
   "my_template": "My Template",
+  "nav_collapse": "Collapse {{label}}",
+  "nav_expand": "Expand {{label}}",
   "need_help": "Need help? Contact your administrator",
   "new_conversation": "New conversation",
   "new_conversation_confirm_description": "This will clear all messages and cannot be undone.",
@@ -274,6 +278,7 @@
   "scroll_to_bottom": "Scroll to bottom",
   "search": "Search...",
   "search_frameworks": "Search frameworks",
+  "search_input": "Search",
   "secondary": "Secondary",
   "select_a_framework": "Select a framework",
   "select_all": "Select all",

package/dist/registry/calendar/calendar.js

@@ -34,10 +34,10 @@ function Calendar({ className, classNames, showOutsideDays = true, captionLayout
             dropdown: cn("absolute bg-popover inset-0 opacity-0", defaultClassNames.dropdown),
             caption_label: cn("select-none font-medium", "label" === captionLayout ? "text-sm" : "rounded-md pl-2 pr-1 flex items-center gap-1 text-sm h-8 [&>svg]:text-muted-foreground [&>svg]:size-3.5", defaultClassNames.caption_label),
             weekdays: cn("flex", defaultClassNames.weekdays),
-            weekday: cn("text-muted-foreground rounded-md flex-1 font-normal text-[0.8rem] select-none", defaultClassNames.weekday),
+            weekday: cn("text-muted-foreground rounded-md flex-1 font-normal text-xs select-none", defaultClassNames.weekday),
             week: cn("flex w-full mt-2", defaultClassNames.week),
             week_number_header: cn("select-none w-(--cell-size)", defaultClassNames.week_number_header),
-            week_number: cn("text-[0.8rem] select-none text-muted-foreground", defaultClassNames.week_number),
+            week_number: cn("text-xs select-none text-muted-foreground", defaultClassNames.week_number),
             day: cn("relative w-full h-full p-0 text-center [&:last-child[data-selected=true]_button]:rounded-r-md group/day aspect-square select-none", props.showWeekNumber ? "[&:nth-child(2)[data-selected=true]_button]:rounded-l-md" : "[&:first-child[data-selected=true]_button]:rounded-l-md", defaultClassNames.day),
             range_start: cn("rounded-l-md bg-accent", defaultClassNames.range_start),
             range_middle: cn("rounded-none", defaultClassNames.range_middle),

package/dist/registry/command/command.js

@@ -5,6 +5,7 @@ import { SearchIcon } from "lucide-react";
 import "react";
 import { Dialog, DialogContent, DialogDescription, DialogHeader, DialogTitle } from "../dialog/dialog.js";
 import { cn } from "../../lib/utils.js";
+import { useVertexTranslation } from "../../lib/vertex-translation.js";
 function command_Command({ className, ...props }) {
     return /*#__PURE__*/ jsx(Command, {
         "data-slot": "command",
@@ -39,6 +40,7 @@ function CommandDialog({ title = "Command Palette", description = "Search for a
     });
 }
 function CommandInput({ className, ...props }) {
+    const { t } = useVertexTranslation();
     return /*#__PURE__*/ jsxs("div", {
         "data-slot": "command-input-wrapper",
         className: "flex h-9 items-center gap-2 border-b px-3",
@@ -48,6 +50,7 @@ function CommandInput({ className, ...props }) {
             }),
             /*#__PURE__*/ jsx(Command.Input, {
                 "data-slot": "command-input",
+                "aria-label": t("search_input"),
                 className: cn("placeholder:text-muted-foreground flex h-10 w-full rounded-md bg-transparent py-3 text-sm outline-hidden disabled:cursor-not-allowed disabled:opacity-50", className),
                 ...props
             })

package/dist/registry/confidence-signal/confidence-signal-chip.js

@@ -5,7 +5,7 @@ import { SignalBars } from "./confidence-signal-bars.js";
 import { LEVEL_CONFIG } from "./confidence-signal-levels.js";
 function ConfidenceSignalChip({ level, label, accessibleLabel, animateIn = false, interactive = false, className, ...props }) {
     return /*#__PURE__*/ jsxs("button", {
-        className: cn("inline-flex items-center gap-1.5 text-xs font-semibold focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50", LEVEL_CONFIG[level].textClass, interactive && "cursor-pointer", className),
+        className: cn("relative inline-flex items-center gap-1.5 text-xs font-semibold focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-ring/50", "after:absolute after:top-1/2 after:left-1/2 after:size-full after:min-h-6 after:min-w-6 after:-translate-x-1/2 after:-translate-y-1/2", LEVEL_CONFIG[level].textClass, interactive && "cursor-pointer", className),
         "aria-label": accessibleLabel,
         ...props,
         type: "button",

package/dist/registry/data-table/data-table-column-header.d.ts

@@ -1,8 +1,9 @@
-import type { Column } from "@tanstack/react-table";
+import { type RowData } from "@tanstack/react-table";
 import * as React from "react";
-interface DataTableColumnHeaderProps<TData, TValue> extends React.HTMLAttributes<HTMLDivElement> {
-    column: Column<TData, TValue>;
+import type { DataTableColumn } from "../../lib/table-features";
+interface DataTableColumnHeaderProps<TData extends RowData, TValue> extends React.HTMLAttributes<HTMLDivElement> {
+    column: DataTableColumn<TData, TValue>;
     title: string;
 }
-declare function DataTableColumnHeader<TData, TValue>({ column, title, className, }: DataTableColumnHeaderProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableColumnHeader<TData extends RowData, TValue>({ column, title, className, }: DataTableColumnHeaderProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
 export { DataTableColumnHeader };

package/dist/registry/data-table/data-table-column-header.js

@@ -1,5 +1,6 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
+import { Subscribe } from "@tanstack/react-table";
 import { ArrowDownIcon, ArrowUpIcon } from "lucide-react";
 import "react";
 import { Button } from "../button/button.js";
@@ -16,29 +17,31 @@ function SortIcon({ sortDirection }) {
     });
 }
 function DataTableColumnHeader({ column, title, className }) {
-    "use no memo";
     if (!column.getCanSort()) return /*#__PURE__*/ jsx("div", {
         className: cn(className),
         children: title
     });
-    return /*#__PURE__*/ jsx("div", {
-        "data-slot": "data-table-column-header",
-        className: cn("flex items-center gap-2", className),
-        children: /*#__PURE__*/ jsxs(Button, {
-            variant: "ghost",
-            size: "sm",
-            onClick: ()=>column.toggleSorting("asc" === column.getIsSorted()),
-            className: "group/sort gap-1.5 -mx-2.5 -my-1 px-2.5 text-xs font-semibold text-muted-foreground",
-            children: [
-                /*#__PURE__*/ jsx("span", {
-                    className: "truncate",
-                    children: title
-                }),
-                /*#__PURE__*/ jsx(SortIcon, {
-                    sortDirection: column.getIsSorted()
+    return /*#__PURE__*/ jsx(Subscribe, {
+        source: column.table.atoms.sorting,
+        children: ()=>/*#__PURE__*/ jsx("div", {
+                "data-slot": "data-table-column-header",
+                className: cn("flex items-center gap-2", className),
+                children: /*#__PURE__*/ jsxs(Button, {
+                    variant: "ghost",
+                    size: "sm",
+                    onClick: ()=>column.toggleSorting("asc" === column.getIsSorted()),
+                    className: "group/sort gap-1.5 -mx-2.5 -my-1 px-2.5 text-xs font-semibold text-muted-foreground",
+                    children: [
+                        /*#__PURE__*/ jsx("span", {
+                            className: "truncate",
+                            children: title
+                        }),
+                        /*#__PURE__*/ jsx(SortIcon, {
+                            sortDirection: column.getIsSorted()
+                        })
+                    ]
                 })
-            ]
-        })
+            })
     });
 }
 export { DataTableColumnHeader };

package/dist/registry/data-table/data-table-expand-toggle.d.ts

@@ -1,12 +1,13 @@
-import type { Table as TanstackTable } from "@tanstack/react-table";
-interface DataTableExpandAllToggleProps<TData> {
-    table: TanstackTable<TData>;
+import type { RowData } from "@tanstack/react-table";
+import type { DataTableInstance } from "../../lib/table-features";
+interface DataTableExpandAllToggleProps<TData extends RowData> {
+    table: DataTableInstance<TData>;
 }
 /**
  * Expand/collapse-all toggle for a data table's expand-column header. Reflects
  * and toggles the table's all-rows-expanded state, with distinct double-chevron
  * icons to set it apart from the per-row single-chevron expand controls.
  */
-declare function DataTableExpandAllToggle<TData>({ table, }: DataTableExpandAllToggleProps<TData>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableExpandAllToggle<TData extends RowData>({ table, }: DataTableExpandAllToggleProps<TData>): import("react/jsx-runtime").JSX.Element;
 export { DataTableExpandAllToggle };
 export type { DataTableExpandAllToggleProps };

package/dist/registry/data-table/data-table-expand-toggle.js

@@ -1,8 +1,8 @@
 "use client";
 import { jsx } from "react/jsx-runtime";
 import { ChevronsDownUp, ChevronsUpDown } from "lucide-react";
-import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { Button } from "../button/button.js";
+import { useVertexTranslation } from "../../lib/vertex-translation.js";
 function DataTableExpandAllToggle({ table }) {
     const { t } = useVertexTranslation();
     const allExpanded = table.getIsAllRowsExpanded();

package/dist/registry/data-table/data-table-filters.d.ts

@@ -1,3 +1,4 @@
-import type { Row, RowData } from "@tanstack/react-table";
-export declare const dataTableGlobalFilterFn: (row: Row<RowData>, _columnId: string, filterValue: string) => boolean;
-export declare const dataTableFacetedFilterFn: (row: Row<RowData>, columnId: string, filterValue: unknown) => boolean;
+import type { RowData } from "@tanstack/react-table";
+import type { DataTableRow } from "../../lib/table-features";
+export declare function dataTableGlobalFilterFn<TData extends RowData>(row: DataTableRow<TData>, _columnId: string, filterValue: string): boolean;
+export declare function dataTableFacetedFilterFn<TData extends RowData>(row: DataTableRow<TData>, columnId: string, filterValue: unknown): boolean;

package/dist/registry/data-table/data-table-filters.js

@@ -1,4 +1,4 @@
-const dataTableGlobalFilterFn = (row, _columnId, filterValue)=>{
+function dataTableGlobalFilterFn(row, _columnId, filterValue) {
     if (!filterValue) return true;
     const searchStr = filterValue.toLowerCase();
     return row.getVisibleCells().some((cell)=>{
@@ -7,10 +7,10 @@ const dataTableGlobalFilterFn = (row, _columnId, filterValue)=>{
         const displayValue = meta?.getFilterValue ? meta.getFilterValue(value, row) : "string" == typeof value ? value : "number" == typeof value || "boolean" == typeof value ? String(value) : "";
         return displayValue.toLowerCase().includes(searchStr);
     });
-};
-const dataTableFacetedFilterFn = (row, columnId, filterValue)=>{
+}
+function dataTableFacetedFilterFn(row, columnId, filterValue) {
     if (!filterValue || !Array.isArray(filterValue) || 0 === filterValue.length) return true;
     const cellValue = String(row.getValue(columnId) ?? "");
     return filterValue.includes(cellValue);
-};
+}
 export { dataTableFacetedFilterFn, dataTableGlobalFilterFn };

package/dist/registry/data-table/data-table-pagination.d.ts

@@ -1,8 +1,9 @@
-import type { Table as TanstackTable } from "@tanstack/react-table";
-interface DataTablePaginationProps<TData> {
-    table: TanstackTable<TData>;
+import type { RowData } from "@tanstack/react-table";
+import type { DataTableInstance } from "../../lib/table-features";
+interface DataTablePaginationProps<TData extends RowData> {
+    table: DataTableInstance<TData>;
     paginationSizes?: number[];
     className?: string;
 }
-declare function DataTablePagination<TData>({ table, paginationSizes, className, }: DataTablePaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
+declare function DataTablePagination<TData extends RowData>({ table, paginationSizes, className, }: DataTablePaginationProps<TData>): import("react/jsx-runtime").JSX.Element;
 export { DataTablePagination };

package/dist/registry/data-table/data-table-pagination.js

@@ -1,19 +1,18 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { ChevronLeftIcon, ChevronRightIcon, ChevronsLeftIcon, ChevronsRightIcon } from "lucide-react";
-import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { Button } from "../button/button.js";
 import { Select, SelectContent, SelectItem, SelectTrigger, SelectValue } from "../select/select.js";
 import { cn } from "../../lib/utils.js";
+import { useVertexTranslation } from "../../lib/vertex-translation.js";
 function DataTablePagination({ table, paginationSizes = [
     10,
     25,
     50,
     100
 ], className }) {
-    "use no memo";
     const { t } = useVertexTranslation();
-    const { pageIndex, pageSize } = table.getState().pagination;
+    const { pageIndex, pageSize } = table.state.pagination;
     const totalRows = table.getFilteredRowModel().rows.length;
     const pageCount = table.getPageCount();
     const canPreviousPage = pageIndex > 0;

package/dist/registry/data-table/data-table-search.d.ts

@@ -1,8 +1,9 @@
-import type { Table as TanstackTable } from "@tanstack/react-table";
-interface DataTableSearchProps<TData> {
-    table: TanstackTable<TData>;
+import type { RowData } from "@tanstack/react-table";
+import type { DataTableInstance } from "../../lib/table-features";
+interface DataTableSearchProps<TData extends RowData> {
+    table: DataTableInstance<TData>;
     placeholder?: string;
     className?: string;
 }
-declare function DataTableSearch<TData>({ table, placeholder, className, }: DataTableSearchProps<TData>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableSearch<TData extends RowData>({ table, placeholder, className, }: DataTableSearchProps<TData>): import("react/jsx-runtime").JSX.Element;
 export { DataTableSearch };

package/dist/registry/data-table/data-table-search.js

@@ -1,9 +1,9 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { SearchIcon } from "lucide-react";
-import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { Input } from "../input/input.js";
 import { cn } from "../../lib/utils.js";
+import { useVertexTranslation } from "../../lib/vertex-translation.js";
 function DataTableSearch({ table, placeholder, className }) {
     const { t } = useVertexTranslation();
     return /*#__PURE__*/ jsxs("div", {
@@ -17,7 +17,7 @@ function DataTableSearch({ table, placeholder, className }) {
                 placeholder: placeholder ?? t("search", {
                     defaultValue: "Search..."
                 }),
-                value: String(table.getState().globalFilter ?? ""),
+                value: String(table.state.globalFilter ?? ""),
                 onChange: (e)=>table.setGlobalFilter(e.target.value),
                 className: "w-full sm:w-80 md:w-96 pl-9 border-0"
             })

package/dist/registry/data-table/data-table-toolbar.d.ts

@@ -1,11 +1,12 @@
-import type { Table } from "@tanstack/react-table";
+import type { RowData } from "@tanstack/react-table";
 import type * as React from "react";
-interface DataTableToolbarProps<TData> {
-    table: Table<TData>;
+import type { DataTableInstance } from "../../lib/table-features";
+interface DataTableToolbarProps<TData extends RowData> {
+    table: DataTableInstance<TData>;
     className?: string;
     enableSearch?: boolean;
     enableViewOptions?: boolean;
     customContent?: React.ReactNode;
 }
-declare function DataTableToolbar<TData>({ table, className, enableSearch, enableViewOptions, customContent, }: DataTableToolbarProps<TData>): import("react/jsx-runtime").JSX.Element | null;
+declare function DataTableToolbar<TData extends RowData>({ table, className, enableSearch, enableViewOptions, customContent, }: DataTableToolbarProps<TData>): import("react/jsx-runtime").JSX.Element | null;
 export { DataTableToolbar };

package/dist/registry/data-table/data-table-view-options.d.ts

@@ -1,7 +1,8 @@
-import type { Table as TanstackTable } from "@tanstack/react-table";
-interface DataTableViewOptionsProps<TData> {
-    table: TanstackTable<TData>;
+import type { RowData } from "@tanstack/react-table";
+import type { DataTableInstance } from "../../lib/table-features";
+interface DataTableViewOptionsProps<TData extends RowData> {
+    table: DataTableInstance<TData>;
     className?: string;
 }
-declare function DataTableViewOptions<TData>({ table, className, }: DataTableViewOptionsProps<TData>): import("react/jsx-runtime").JSX.Element;
+declare function DataTableViewOptions<TData extends RowData>({ table, className, }: DataTableViewOptionsProps<TData>): import("react/jsx-runtime").JSX.Element;
 export { DataTableViewOptions };

package/dist/registry/data-table/data-table-view-options.js

@@ -1,15 +1,15 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { Columns3Icon } from "lucide-react";
-import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { Button } from "../button/button.js";
 import { DropdownMenu, DropdownMenuContent, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger } from "../dropdown-menu/dropdown-menu.js";
 import { Tooltip, TooltipContent, TooltipTrigger } from "../tooltip/tooltip.js";
+import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { SortableColumnList } from "./sortable-column-list.js";
 function DataTableViewOptions({ table, className }) {
     const { t } = useVertexTranslation();
     const allReorderableColumns = table.getAllColumns().filter((column)=>null != column.accessorFn && column.getCanHide());
-    const currentOrder = table.getState().columnOrder;
+    const currentOrder = table.state.columnOrder;
     const orderedColumns = ()=>{
         if (!currentOrder || 0 === currentOrder.length) return allReorderableColumns;
         const orderMap = new Map(currentOrder.map((id, index)=>[

package/dist/registry/data-table/data-table.d.ts

@@ -1,14 +1,15 @@
-import { type ColumnDef, type ColumnFiltersState, type ExpandedState, type FilterFn, type OnChangeFn, type PaginationState, type Row, type RowData, type RowSelectionState, type SortingState, type Table as TanstackTable, type VisibilityState } from "@tanstack/react-table";
+import { type ColumnFiltersState, type ColumnVisibilityState, type ExpandedState, type OnChangeFn, type PaginationState, type RowData, type RowSelectionState, type SortingState } from "@tanstack/react-table";
 import * as React from "react";
+import { type DataTableColumnDef, type DataTableFilterFn, type DataTableInstance, type DataTableRow } from "../../lib/table-features";
 declare module "@tanstack/react-table" {
-    interface ColumnMeta<TData extends RowData, TValue> {
+    interface ColumnMeta<TFeatures, TData extends RowData, TValue> {
         displayName?: string;
-        getFilterValue?: (value: unknown, row: Row<TData>) => string;
+        getFilterValue?: (value: unknown, row: DataTableRow<TData>) => string;
         overflowVisible?: boolean;
     }
 }
-interface DataTableProps<TData, TValue> {
-    columns: ColumnDef<TData, TValue>[];
+interface DataTableProps<TData extends RowData, TValue = unknown> {
+    columns: DataTableColumnDef<TData, TValue>[];
     data: TData[];
     className?: string;
     isLoading?: boolean;
@@ -17,8 +18,8 @@ interface DataTableProps<TData, TValue> {
     onSortingChange: OnChangeFn<SortingState>;
     columnFilters: ColumnFiltersState;
     onColumnFiltersChange: OnChangeFn<ColumnFiltersState>;
-    columnVisibility: VisibilityState;
-    onColumnVisibilityChange: OnChangeFn<VisibilityState>;
+    columnVisibility: ColumnVisibilityState;
+    onColumnVisibilityChange: OnChangeFn<ColumnVisibilityState>;
     columnOrder: string[];
     onColumnOrderChange: OnChangeFn<string[]>;
     rowSelection?: RowSelectionState;
@@ -27,22 +28,22 @@ interface DataTableProps<TData, TValue> {
     onGlobalFilterChange: OnChangeFn<string>;
     pagination?: PaginationState;
     onPaginationChange?: OnChangeFn<PaginationState>;
-    getRowId?: (originalRow: TData, index: number, parent?: Row<TData>) => string;
-    globalFilterFn?: FilterFn<TData>;
+    getRowId?: (originalRow: TData, index: number, parent?: DataTableRow<TData>) => string;
+    globalFilterFn?: DataTableFilterFn<TData>;
     enableSearch?: boolean;
     enableViewOptions?: boolean;
     enableColumnResizing?: boolean;
-    toolbarContent?: (table: TanstackTable<TData>) => React.ReactNode;
+    toolbarContent?: (table: DataTableInstance<TData>) => React.ReactNode;
     noResultsMessage?: React.ReactNode;
     stickyHeader?: boolean;
     expanded?: ExpandedState;
     onExpandedChange?: OnChangeFn<ExpandedState>;
-    renderExpandedRow?: (row: Row<TData>) => React.ReactNode;
+    renderExpandedRow?: (row: DataTableRow<TData>) => React.ReactNode;
     getRowClassName?: (row: TData) => string;
     skeletonColumnWidths?: string[];
     plain?: boolean;
 }
-declare function DataTable<TData, TValue>({ columns, data, className, isLoading, onRowClick, sorting, onSortingChange, columnFilters, onColumnFiltersChange, columnVisibility, onColumnVisibilityChange, columnOrder, onColumnOrderChange, rowSelection, onRowSelectionChange, globalFilter, onGlobalFilterChange, pagination, onPaginationChange, getRowId, globalFilterFn, enableSearch, enableViewOptions, enableColumnResizing, toolbarContent, noResultsMessage, stickyHeader, expanded, onExpandedChange, renderExpandedRow, getRowClassName, skeletonColumnWidths, plain, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
+declare function DataTable<TData extends RowData, TValue = unknown>({ columns, data, className, isLoading, onRowClick, sorting, onSortingChange, columnFilters, onColumnFiltersChange, columnVisibility, onColumnVisibilityChange, columnOrder, onColumnOrderChange, rowSelection, onRowSelectionChange, globalFilter, onGlobalFilterChange, pagination, onPaginationChange, getRowId, globalFilterFn, enableSearch, enableViewOptions, enableColumnResizing, toolbarContent, noResultsMessage, stickyHeader, expanded, onExpandedChange, renderExpandedRow, getRowClassName, skeletonColumnWidths, plain, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
 export { DataTable };
 export type { DataTableProps };
 /** @public */

package/dist/registry/data-table/data-table.js

@@ -1,10 +1,10 @@
 "use client";
 import { jsx, jsxs } from "react/jsx-runtime";
-import { flexRender, getCoreRowModel, getExpandedRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel } from "@tanstack/react-table";
+import { flexRender, useTable } from "@tanstack/react-table";
 import { Fragment } from "react";
+import { dataTableFeatures } from "../../lib/table-features.js";
 import { useVertexTranslation } from "../../lib/vertex-translation.js";
 import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from "../table/table.js";
-import { useReactTableCompat } from "../use-data-table/useReactTableCompat.js";
 import { cn } from "../../lib/utils.js";
 import { DataTableExpandAllToggle } from "./data-table-expand-toggle.js";
 import { DataTablePagination } from "./data-table-pagination.js";
@@ -24,9 +24,10 @@ function DataTable({ columns, data, className, isLoading = false, onRowClick, so
                 pageIndex: 0
             });
     };
-    const table = useReactTableCompat({
+    const table = useTable({
+        features: dataTableFeatures,
         data,
-        columns,
+        columns: columns,
         onSortingChange,
         onColumnFiltersChange: (updater)=>{
             onColumnFiltersChange(updater);
@@ -42,8 +43,10 @@ function DataTable({ columns, data, className, isLoading = false, onRowClick, so
             resetPageIndex();
         },
         ...isPaginationEnabled && {
-            onPaginationChange,
-            getPaginationRowModel: getPaginationRowModel()
+            onPaginationChange
+        },
+        ...!isPaginationEnabled && {
+            manualPagination: true
         },
         ...onExpandedChange ? {
             onExpandedChange
@@ -51,12 +54,6 @@ function DataTable({ columns, data, className, isLoading = false, onRowClick, so
         ...getRowId ? {
             getRowId
         } : {},
-        getCoreRowModel: getCoreRowModel(),
-        getSortedRowModel: getSortedRowModel(),
-        getFilteredRowModel: getFilteredRowModel(),
-        ...renderExpandedRow ? {
-            getExpandedRowModel: getExpandedRowModel()
-        } : {},
         ...globalFilterFn ? {
             globalFilterFn
         } : {},

package/dist/registry/data-table/index.d.ts

@@ -1,8 +1,9 @@
-export type { ColumnDef, ColumnFiltersState, ExpandedState, OnChangeFn, PaginationState, Row, RowSelectionState, SortingState, Table as TanstackTable, VisibilityState, } from "@tanstack/react-table";
+export type { ColumnFiltersState, ColumnVisibilityState, ColumnVisibilityState as VisibilityState, ExpandedState, OnChangeFn, PaginationState, RowSelectionState, SortingState, } from "@tanstack/react-table";
+export { FilterDropdown, type FilterDropdownOption, type FilterDropdownProps, } from "../filter-dropdown/index";
+export type { DataTableColumnDef as ColumnDef, DataTableInstance as TanstackTable, DataTableRow as Row, } from "../../lib/table-features";
 export type { DataTableProps } from "./data-table";
 export { DataTable } from "./data-table";
 export { DataTableColumnHeader } from "./data-table-column-header";
-export { FilterDropdown, type FilterDropdownOption, type FilterDropdownProps, } from "../filter-dropdown/index";
 export { dataTableFacetedFilterFn, dataTableGlobalFilterFn, } from "./data-table-filters";
 export { DataTablePagination } from "./data-table-pagination";
 export { DataTableCell, DataTableRow } from "./data-table-row";

package/dist/registry/data-table/index.js

@@ -1,6 +1,6 @@
+import { FilterDropdown } from "../filter-dropdown/index.js";
 import { DataTable } from "./data-table.js";
 import { DataTableColumnHeader } from "./data-table-column-header.js";
-import { FilterDropdown } from "../filter-dropdown/index.js";
 import { dataTableFacetedFilterFn, dataTableGlobalFilterFn } from "./data-table-filters.js";
 import { DataTablePagination } from "./data-table-pagination.js";
 import { DataTableCell, DataTableRow } from "./data-table-row.js";