@siyahi/ui 0.0.0-stage → 0.1.0-next.4

package/dist/components/registry/niko-table/components/data-table-grouped-rows.js

@@ -0,0 +1,77 @@
+"use client";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/registry/niko-table/components/data-table-grouped-rows.tsx
+const DataTableGroupRowContext = React.createContext(null);
+/** Provider — used by the body, not by callers. */
+function DataTableGroupRowProvider({ value, children }) {
+	return /* @__PURE__ */ jsx(DataTableGroupRowContext.Provider, {
+		value,
+		children
+	});
+}
+/**
+* Read the group row a custom `<DataTableGroupedRows>` child is rendering for.
+*
+* @example
+* function RegionGroupRow() {
+*   const { groupLabel, count, isExpanded, toggle } = useDataTableGroupRow()
+*   return (
+*     <TableCell colSpan={4} onClick={toggle}>
+*       {groupLabel} — {count} in region {isExpanded ? "▾" : "▸"}
+*     </TableCell>
+*   )
+* }
+*/
+function useDataTableGroupRow() {
+	const ctx = React.useContext(DataTableGroupRowContext);
+	if (!ctx) throw new Error("useDataTableGroupRow must be used inside <DataTableGroupedRows>. Nest your group-row component as its child.");
+	return ctx;
+}
+/**
+* Declarative, composable group rows for niko-table bodies.
+*
+* Nest it inside a `DataTableBody` so grouping reads as part of the table's
+* JSX tree. It renders nothing itself — its presence is what turns grouping
+* on (feature detection maps it to `enableGrouping` + `enableExpanding`), and
+* the body renders a group row wherever TanStack's grouped row model produces
+* one.
+*
+* This is the whole opt-in. There is no `enableGrouping` config flag to set
+* and no renderer to wire up: compose the component, or don't.
+*
+* @example
+* // Built-in group row
+* <DataTableBody>
+*   <DataTableGroupedRows />
+* </DataTableBody>
+*
+* @example
+* // Your own, reading the group from context
+* <DataTableBody>
+*   <DataTableGroupedRows>
+*     <RegionGroupRow />
+*   </DataTableGroupedRows>
+* </DataTableBody>
+*/
+function DataTableGroupedRows(_props) {
+	return null;
+}
+DataTableGroupedRows.displayName = "DataTableGroupedRows";
+/**
+* Body-side: find a nested `<DataTableGroupedRows>` among `children`.
+*
+* Matches on `displayName` as well as reference, because re-exports and HMR
+* both break reference equality.
+*/
+function resolveGroupedRowsSlot(children) {
+	let found;
+	React.Children.forEach(children, (child) => {
+		if (!React.isValidElement(child)) return;
+		const type = child.type;
+		if (child.type === DataTableGroupedRows || type.displayName === "DataTableGroupedRows") found = child.props;
+	});
+	return found;
+}
+//#endregion
+export { DataTableGroupRowProvider, DataTableGroupedRows, resolveGroupedRowsSlot, useDataTableGroupRow };

package/dist/components/registry/niko-table/components/data-table-row-context-menu-slot.d.ts

@@ -0,0 +1,65 @@
+import * as React$1 from "react";
+import { RowData } from "@tanstack/react-table";
+//#region src/components/registry/niko-table/components/data-table-row-context-menu-slot.d.ts
+export interface DataTableRowContextMenuSlotProps<TData extends RowData> {
+  /**
+   * The row menu. Preferred (shadcn/composable) form is a declarative
+   * component that reads the row via `useDataTableRow()`:
+   *
+   *   <DataTableRowContextMenuSlot>
+   *     <TeamRowMenu onEdit={…} onDelete={…} />
+   *   </DataTableRowContextMenuSlot>
+   *
+   * A `(row) => menu` function is also accepted for cases that would rather
+   * close over the row explicitly.
+   */
+  children: React$1.ReactNode | ((row: TData) => React$1.ReactNode);
+  /**
+   * Optional per-row predicate — return `false` to give a specific row no
+   * menu (e.g. locked/browse-only rows). Table-level gating (e.g. "no manage
+   * permission") is better done by simply not rendering the slot at all.
+   */
+  enabledFor?: (row: TData) => boolean;
+}
+/**
+ * Declarative, composable row context menu for niko-table bodies.
+ *
+ * Nest it inside a `DataTableBody` / `DataTableVirtualizedBody` — or any of
+ * the four DnD bodies (`DataTableDndBody`, `DataTableDndColumnBody`,
+ * `DataTableVirtualizedDndBody`, `DataTableVirtualizedDndColumnBody`) — so
+ * the per-row menu reads as part of the table's JSX tree. It renders nothing
+ * itself — the body detects it among its children and renders its menu for
+ * every (enabled) row inside a `DataTableRowMenuScope`, so a declarative
+ * `<XRowMenu>` composed from `RowMenuItem` / `RowMenuSub` / … resolves the
+ * row and surface from context. The body's `renderRowContextMenu` prop still
+ * works and wins when both are present.
+ *
+ * @example
+ * <DataTableVirtualizedBody estimateSize={44}>
+ *   <DataTableRowContextMenuSlot enabledFor={(m) => !m.isLocked}>
+ *     <PoolRowMenu onOffer={…} onDirectAssign={…} />
+ *   </DataTableRowContextMenuSlot>
+ *   <DataTableVirtualizedSkeleton rows={8} />
+ * </DataTableVirtualizedBody>
+ */
+export declare function DataTableRowContextMenuSlot<TData extends RowData>(_props: DataTableRowContextMenuSlotProps<TData>): null;
+export declare namespace DataTableRowContextMenuSlot {
+  var displayName: string;
+}
+/**
+ * Resolve the effective per-row menu renderer for a body: the explicit
+ * `renderRowContextMenu` prop wins; otherwise a nested
+ * `<DataTableRowContextMenuSlot>` child (declarative node or function),
+ * honouring its optional `enabledFor` predicate.
+ */
+export declare function resolveRowContextMenuRenderer<TData extends RowData>(prop: ((row: TData) => React$1.ReactNode) | undefined, children: React$1.ReactNode): ((row: TData) => React$1.ReactNode) | undefined;
+/**
+ * Body-side hook: resolve the per-row menu renderer and return a **stable**
+ * callback identity, so memoized rows (`BodyRow`) don't re-render just because
+ * the body re-rendered. `resolveRowContextMenuRenderer` returns a fresh
+ * function each render (it closes over `children`); we keep the latest in a ref
+ * and hand out a stable wrapper that reads it. The wrapper identity only
+ * changes when the presence of a menu changes.
+ */
+export declare function useResolvedRowContextMenuRenderer<TData extends RowData>(prop: ((row: TData) => React$1.ReactNode) | undefined, children: React$1.ReactNode): ((row: TData) => React$1.ReactNode) | undefined;
+//#endregion

package/dist/components/registry/niko-table/components/data-table-row-context-menu-slot.js

@@ -0,0 +1,65 @@
+import * as React$1 from "react";
+//#region src/components/registry/niko-table/components/data-table-row-context-menu-slot.tsx
+/**
+* Declarative, composable row context menu for niko-table bodies.
+*
+* Nest it inside a `DataTableBody` / `DataTableVirtualizedBody` — or any of
+* the four DnD bodies (`DataTableDndBody`, `DataTableDndColumnBody`,
+* `DataTableVirtualizedDndBody`, `DataTableVirtualizedDndColumnBody`) — so
+* the per-row menu reads as part of the table's JSX tree. It renders nothing
+* itself — the body detects it among its children and renders its menu for
+* every (enabled) row inside a `DataTableRowMenuScope`, so a declarative
+* `<XRowMenu>` composed from `RowMenuItem` / `RowMenuSub` / … resolves the
+* row and surface from context. The body's `renderRowContextMenu` prop still
+* works and wins when both are present.
+*
+* @example
+* <DataTableVirtualizedBody estimateSize={44}>
+*   <DataTableRowContextMenuSlot enabledFor={(m) => !m.isLocked}>
+*     <PoolRowMenu onOffer={…} onDirectAssign={…} />
+*   </DataTableRowContextMenuSlot>
+*   <DataTableVirtualizedSkeleton rows={8} />
+* </DataTableVirtualizedBody>
+*/
+function DataTableRowContextMenuSlot(_props) {
+	return null;
+}
+DataTableRowContextMenuSlot.displayName = "DataTableRowContextMenuSlot";
+/**
+* Resolve the effective per-row menu renderer for a body: the explicit
+* `renderRowContextMenu` prop wins; otherwise a nested
+* `<DataTableRowContextMenuSlot>` child (declarative node or function),
+* honouring its optional `enabledFor` predicate.
+*/
+function resolveRowContextMenuRenderer(prop, children) {
+	if (prop) return prop;
+	let slotProps;
+	React$1.Children.forEach(children, (child) => {
+		if (!React$1.isValidElement(child)) return;
+		const type = child.type;
+		if (child.type === DataTableRowContextMenuSlot || type.displayName === "DataTableRowContextMenuSlot") slotProps = child.props;
+	});
+	if (!slotProps) return void 0;
+	const { children: menu, enabledFor } = slotProps;
+	return (row) => {
+		if (enabledFor && !enabledFor(row)) return null;
+		return typeof menu === "function" ? menu(row) : menu;
+	};
+}
+/**
+* Body-side hook: resolve the per-row menu renderer and return a **stable**
+* callback identity, so memoized rows (`BodyRow`) don't re-render just because
+* the body re-rendered. `resolveRowContextMenuRenderer` returns a fresh
+* function each render (it closes over `children`); we keep the latest in a ref
+* and hand out a stable wrapper that reads it. The wrapper identity only
+* changes when the presence of a menu changes.
+*/
+function useResolvedRowContextMenuRenderer(prop, children) {
+	const resolved = resolveRowContextMenuRenderer(prop, children);
+	const latestRef = React$1.useRef(resolved);
+	latestRef.current = resolved;
+	const hasMenu = !!resolved;
+	return React$1.useMemo(() => hasMenu ? (row) => latestRef.current?.(row) : void 0, [hasMenu]);
+}
+//#endregion
+export { DataTableRowContextMenuSlot, resolveRowContextMenuRenderer, useResolvedRowContextMenuRenderer };

package/dist/components/registry/niko-table/components/data-table-row-context-menu.d.ts

@@ -0,0 +1,50 @@
+import * as React$1 from "react";
+//#region src/components/registry/niko-table/components/data-table-row-context-menu.d.ts
+export interface DataTableRowContextMenuProps {
+  /**
+   * The row's `original` data. Provided to the menu children via
+   * `DataTableRowMenuScope` so a declarative `<XRowMenu>` can read it with
+   * `useDataTableRow()` and render the same items as the kebab dropdown.
+   */
+  row: unknown;
+  /**
+   * The `<TableRow>` element the menu anchors to. Radix's `asChild` merges
+   * the right-click listener onto this element (via Slot), so no wrapper
+   * node is introduced and table markup (`<tbody> > <tr>`) stays valid.
+   */
+  trigger: React$1.ReactElement;
+  /**
+   * The menu items to show on right-click — compose `ContextMenuItem`,
+   * `ContextMenuSeparator`, `ContextMenuSub`, etc. The portal + surface
+   * chrome is owned here so callers only supply the actions.
+   *
+   * Tip: reuse the same items your row's "…" actions column renders so
+   * right-click and the kebab menu stay in sync (write once).
+   */
+  children: React$1.ReactNode;
+  /** Extra className for the popup surface. */
+  className?: string;
+}
+/**
+ * Attaches a right-click context menu to a single data-table row.
+ *
+ * Low-level primitive used internally by the bodies (and directly by card
+ * views): pass the row's data as `row`, the row's `<TableRow>` element as
+ * `trigger`, and the menu as `children`. Children are wrapped in a
+ * `DataTableRowMenuScope surface="context"`, so a declarative `<XRowMenu>`
+ * built from `RowMenuItem`/… (see `data-table-row-menu`) works here — as do
+ * raw `ContextMenuItem`s. The popup is portalled and only mounts on open.
+ *
+ * @example
+ * <DataTableRowContextMenu
+ *   row={row.original}
+ *   trigger={<TableRow data-row-id={row.id}>{cells}</TableRow>}
+ * >
+ *   <PlayerRowMenu onView={view} onRemove={remove} />
+ * </DataTableRowContextMenu>
+ */
+export declare function DataTableRowContextMenu({ row, trigger, children, className }: DataTableRowContextMenuProps): React$1.JSX.Element;
+export declare namespace DataTableRowContextMenu {
+  var displayName: string;
+}
+//#endregion

package/dist/components/registry/niko-table/components/data-table-row-context-menu.js

@@ -0,0 +1,42 @@
+"use client";
+import { ContextMenu, ContextMenuContent, ContextMenuTrigger } from "../../../ui/context-menu.js";
+import { DataTableRowMenuScope } from "./data-table-row-menu.js";
+import * as React$1 from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/registry/niko-table/components/data-table-row-context-menu.tsx
+/**
+* Attaches a right-click context menu to a single data-table row.
+*
+* Low-level primitive used internally by the bodies (and directly by card
+* views): pass the row's data as `row`, the row's `<TableRow>` element as
+* `trigger`, and the menu as `children`. Children are wrapped in a
+* `DataTableRowMenuScope surface="context"`, so a declarative `<XRowMenu>`
+* built from `RowMenuItem`/… (see `data-table-row-menu`) works here — as do
+* raw `ContextMenuItem`s. The popup is portalled and only mounts on open.
+*
+* @example
+* <DataTableRowContextMenu
+*   row={row.original}
+*   trigger={<TableRow data-row-id={row.id}>{cells}</TableRow>}
+* >
+*   <PlayerRowMenu onView={view} onRemove={remove} />
+* </DataTableRowContextMenu>
+*/
+function DataTableRowContextMenu({ row, trigger, children, className }) {
+	const [open, setOpen] = React$1.useState(false);
+	const anchoredTrigger = open ? React$1.cloneElement(trigger, { "data-context-menu-open": "" }) : trigger;
+	return /* @__PURE__ */ jsxs(ContextMenu, {
+		onOpenChange: setOpen,
+		children: [/* @__PURE__ */ jsx(ContextMenuTrigger, { render: anchoredTrigger }), /* @__PURE__ */ jsx(ContextMenuContent, {
+			className,
+			children: /* @__PURE__ */ jsx(DataTableRowMenuScope, {
+				row,
+				surface: "context",
+				children
+			})
+		})]
+	});
+}
+DataTableRowContextMenu.displayName = "DataTableRowContextMenu";
+//#endregion
+export { DataTableRowContextMenu };

package/dist/components/registry/niko-table/components/data-table-row-menu.d.ts

@@ -0,0 +1,51 @@
+import { DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger } from "../../../ui/dropdown-menu.js";
+import * as React$1 from "react";
+//#region src/components/registry/niko-table/components/data-table-row-menu.d.ts
+/**
+ * Composable row menu for niko-table — the shadcn-style, write-once way to give
+ * a table's "…" dropdown and its right-click context menu the *same* actions.
+ *
+ * Define the actions ONCE as a component using the polymorphic `RowMenuItem` /
+ * `RowMenuSeparator` / `RowMenuSub` … pieces and `useDataTableRow()`:
+ *
+ * @example
+ * function TeamRowMenu({ onEdit, onDelete }: TeamRowMenuProps) {
+ *   const team = useDataTableRow<TeamRow>()
+ *   return (
+ *     <>
+ *       <RowMenuItem onClick={() => onEdit(team)}>Edit</RowMenuItem>
+ *       <RowMenuSeparator />
+ *       <RowMenuItem variant="destructive" onClick={() => onDelete(team.id)}>
+ *         Delete
+ *       </RowMenuItem>
+ *     </>
+ *   )
+ * }
+ *
+ * Then drop `<TeamRowMenu … />` into the kebab cell (inside a
+ * `DataTableRowMenuScope surface="dropdown"`) and into the body's
+ * `<DataTableRowContextMenuSlot>` — the same component renders as a dropdown
+ * menu or a context menu depending on the surface it finds in context.
+ */
+type RowMenuSurface = "dropdown" | "context";
+/**
+ * Provides the current row and the menu surface to the row-menu pieces nested
+ * inside. The context-menu body sets this up automatically; kebab cells wrap
+ * their `DropdownMenuContent` children with `surface="dropdown"`.
+ */
+export declare function DataTableRowMenuScope({ row, surface, children }: {
+  row: unknown;
+  surface: RowMenuSurface;
+  children: React$1.ReactNode;
+}): React$1.JSX.Element;
+/** Read the row a row-menu is rendering for. Throws outside a scope. */
+export declare function useDataTableRow<TData>(): TData;
+export declare function RowMenuItem(props: React$1.ComponentProps<typeof DropdownMenuItem>): React$1.JSX.Element;
+export declare function RowMenuSeparator(props: React$1.ComponentProps<typeof DropdownMenuSeparator>): React$1.JSX.Element;
+export declare function RowMenuGroup(props: React$1.ComponentProps<typeof DropdownMenuGroup>): React$1.JSX.Element;
+export declare function RowMenuLabel(props: React$1.ComponentProps<typeof DropdownMenuLabel>): React$1.JSX.Element;
+export declare function RowMenuSub(props: React$1.ComponentProps<typeof DropdownMenuSub>): React$1.JSX.Element;
+export declare function RowMenuSubTrigger(props: React$1.ComponentProps<typeof DropdownMenuSubTrigger>): React$1.JSX.Element;
+export declare function RowMenuSubContent(props: React$1.ComponentProps<typeof DropdownMenuSubContent>): React$1.JSX.Element;
+//#endregion
+export {};

package/dist/components/registry/niko-table/components/data-table-row-menu.js

@@ -0,0 +1,65 @@
+"use client";
+import { ContextMenuGroup, ContextMenuItem, ContextMenuLabel, ContextMenuSeparator, ContextMenuSub, ContextMenuSubContent, ContextMenuSubTrigger } from "../../../ui/context-menu.js";
+import { DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuSub, DropdownMenuSubContent, DropdownMenuSubTrigger } from "../../../ui/dropdown-menu.js";
+import * as React$1 from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/registry/niko-table/components/data-table-row-menu.tsx
+const RowMenuSurfaceContext = React$1.createContext(null);
+/** Sentinel so `useDataTableRow` can tell "no provider" from a row of `undefined`. */
+const NO_ROW = Symbol("niko-table.no-row");
+const DataTableRowValueContext = React$1.createContext(NO_ROW);
+/**
+* Provides the current row and the menu surface to the row-menu pieces nested
+* inside. The context-menu body sets this up automatically; kebab cells wrap
+* their `DropdownMenuContent` children with `surface="dropdown"`.
+*/
+function DataTableRowMenuScope({ row, surface, children }) {
+	return /* @__PURE__ */ jsx(RowMenuSurfaceContext.Provider, {
+		value: surface,
+		children: /* @__PURE__ */ jsx(DataTableRowValueContext.Provider, {
+			value: row,
+			children
+		})
+	});
+}
+/** Read the row a row-menu is rendering for. Throws outside a scope. */
+function useDataTableRow() {
+	const row = React$1.useContext(DataTableRowValueContext);
+	if (row === NO_ROW) throw new Error("useDataTableRow must be used inside a DataTableRowMenuScope — i.e. a table row context menu, or a kebab DropdownMenuContent wrapped with surface=\"dropdown\".");
+	return row;
+}
+function useRowMenuSurface() {
+	const surface = React$1.useContext(RowMenuSurfaceContext);
+	if (!surface) throw new Error("Row menu pieces (RowMenuItem, RowMenuSub, …) must be rendered inside a DataTableRowMenuScope — i.e. a table row context menu or a kebab DropdownMenuContent wrapped with surface=\"dropdown\".");
+	return surface;
+}
+function RowMenuItem(props) {
+	const Item = useRowMenuSurface() === "context" ? ContextMenuItem : DropdownMenuItem;
+	return /* @__PURE__ */ jsx(Item, { ...props });
+}
+function RowMenuSeparator(props) {
+	const Separator = useRowMenuSurface() === "context" ? ContextMenuSeparator : DropdownMenuSeparator;
+	return /* @__PURE__ */ jsx(Separator, { ...props });
+}
+function RowMenuGroup(props) {
+	const Group = useRowMenuSurface() === "context" ? ContextMenuGroup : DropdownMenuGroup;
+	return /* @__PURE__ */ jsx(Group, { ...props });
+}
+function RowMenuLabel(props) {
+	const Label = useRowMenuSurface() === "context" ? ContextMenuLabel : DropdownMenuLabel;
+	return /* @__PURE__ */ jsx(Label, { ...props });
+}
+function RowMenuSub(props) {
+	const Sub = useRowMenuSurface() === "context" ? ContextMenuSub : DropdownMenuSub;
+	return /* @__PURE__ */ jsx(Sub, { ...props });
+}
+function RowMenuSubTrigger(props) {
+	const SubTrigger = useRowMenuSurface() === "context" ? ContextMenuSubTrigger : DropdownMenuSubTrigger;
+	return /* @__PURE__ */ jsx(SubTrigger, { ...props });
+}
+function RowMenuSubContent(props) {
+	const SubContent = useRowMenuSurface() === "context" ? ContextMenuSubContent : DropdownMenuSubContent;
+	return /* @__PURE__ */ jsx(SubContent, { ...props });
+}
+//#endregion
+export { DataTableRowMenuScope, RowMenuGroup, RowMenuItem, RowMenuLabel, RowMenuSeparator, RowMenuSub, RowMenuSubContent, RowMenuSubTrigger, useDataTableRow };

package/dist/components/registry/niko-table/components/data-table-toolbar-section.d.ts

@@ -0,0 +1,7 @@
+import React from "react";
+//#region src/components/registry/niko-table/components/data-table-toolbar-section.d.ts
+export interface DataTableToolbarSectionProps extends React.ComponentProps<"div"> {
+  children?: React.ReactNode;
+}
+export declare const DataTableToolbarSection: React.NamedExoticComponent<Omit<DataTableToolbarSectionProps, "ref"> & React.RefAttributes<HTMLDivElement>>;
+//#endregion

package/dist/components/registry/niko-table/components/data-table-toolbar-section.js

@@ -0,0 +1,63 @@
+"use client";
+import { cn } from "../../../../lib/utils.js";
+import React from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/registry/niko-table/components/data-table-toolbar-section.tsx
+/**
+* niko-table — created by Semir N. (Semkoo, https://github.com/Semkoo) with AI assistance.
+*
+* Before reporting anything: please check the changelog first.
+*  - In-repo: ./CHANGELOG.md
+*  - Docs site: https://niko-table.com/changelog
+*
+* Found a bug or have a fix? Open an issue or PR on GitHub so other
+* users (and future LLMs reading this code) benefit:
+* https://github.com/Semkoo/niko-table-registry
+*/
+/**
+* A simple, flexible toolbar container for composing table controls.
+* Use this as a layout container and add your own search, filters, sorting, etc.
+*
+* @example - Basic toolbar with search and filters
+* <DataTableToolbarSection>
+*   <DataTableSearchInput placeholder="Search..." />
+*   <DataTableFilterButton column="status" title="Status" />
+*   <DataTableSortMenu />
+* </DataTableToolbarSection>
+*
+* @example - Custom layout with left and right sections
+* <DataTableToolbarSection className="justify-between">
+*   <div className="flex gap-2">
+*     <DataTableSearchInput />
+*     <DataTableFilterButton column="status" />
+*   </div>
+*   <div className="flex gap-2">
+*     <DataTableSortMenu />
+*     <DataTableViewMenu />
+*   </div>
+* </DataTableToolbarSection>
+*
+* @example - With custom elements
+* <DataTableToolbarSection>
+*   <DataTableSearchInput />
+*   <span className="text-sm text-muted-foreground">
+*     {table.getFilteredRowModel().rows.length} results
+*   </span>
+*   <Button variant="outline">Export</Button>
+* </DataTableToolbarSection>
+*/
+const DataTableToolbarSectionInternal = React.forwardRef(({ children, className, ...props }, ref) => {
+	return /* @__PURE__ */ jsx("div", {
+		ref,
+		role: "toolbar",
+		"aria-orientation": "horizontal",
+		className: cn("flex w-full flex-wrap items-center gap-2 p-1", className),
+		...props,
+		children
+	});
+});
+DataTableToolbarSectionInternal.displayName = "DataTableToolbarSectionInternal";
+const DataTableToolbarSection = React.memo(DataTableToolbarSectionInternal);
+DataTableToolbarSection.displayName = "DataTableToolbarSection";
+//#endregion
+export { DataTableToolbarSection };

package/dist/components/registry/niko-table/config/data-table.d.ts

@@ -0,0 +1,156 @@
+import { FilterVariant } from "../lib/constants.js";
+import { LucideIcon } from "lucide-react";
+//#region src/components/registry/niko-table/config/data-table.d.ts
+export type SortIconVariant = FilterVariant;
+interface SortIcons {
+  asc: LucideIcon;
+  desc: LucideIcon;
+  unsorted: LucideIcon;
+}
+/**
+ * A mapped type rather than an interface so it can be passed as a Select's
+ * `items` label map (interfaces carry no implicit index signature).
+ */
+type SortLabels = Record<"asc" | "desc", string>;
+export declare const SORT_ICONS: Record<SortIconVariant, SortIcons>;
+export declare const SORT_LABELS: Record<SortIconVariant, SortLabels>;
+/**
+ * @credit Adapted from React Table's default config
+ * @see https://react-table.tanstack.com/docs/overview
+ */
+export declare const dataTableConfig: {
+  readonly debounceMs: 300;
+  readonly throttleMs: 50;
+  readonly textOperators: ({
+    label: string;
+    value: "ilike";
+  } | {
+    label: string;
+    value: "not.ilike";
+  } | {
+    label: string;
+    value: "eq";
+  } | {
+    label: string;
+    value: "neq";
+  } | {
+    label: string;
+    value: "empty";
+  } | {
+    label: string;
+    value: "not.empty";
+  })[];
+  readonly numericOperators: ({
+    label: string;
+    value: "eq";
+  } | {
+    label: string;
+    value: "neq";
+  } | {
+    label: string;
+    value: "lt";
+  } | {
+    label: string;
+    value: "lte";
+  } | {
+    label: string;
+    value: "gt";
+  } | {
+    label: string;
+    value: "gte";
+  } | {
+    label: string;
+    value: "between";
+  } | {
+    label: string;
+    value: "empty";
+  } | {
+    label: string;
+    value: "not.empty";
+  })[];
+  readonly dateOperators: ({
+    label: string;
+    value: "eq";
+  } | {
+    label: string;
+    value: "neq";
+  } | {
+    label: string;
+    value: "lt";
+  } | {
+    label: string;
+    value: "gt";
+  } | {
+    label: string;
+    value: "lte";
+  } | {
+    label: string;
+    value: "gte";
+  } | {
+    label: string;
+    value: "between";
+  } | {
+    label: string;
+    value: "empty";
+  } | {
+    label: string;
+    value: "not.empty";
+  })[];
+  readonly selectOperators: ({
+    label: string;
+    value: "eq";
+  } | {
+    label: string;
+    value: "neq";
+  } | {
+    label: string;
+    value: "empty";
+  } | {
+    label: string;
+    value: "not.empty";
+  })[];
+  readonly multiSelectOperators: ({
+    label: string;
+    value: "in";
+  } | {
+    label: string;
+    value: "not.in";
+  } | {
+    label: string;
+    value: "empty";
+  } | {
+    label: string;
+    value: "not.empty";
+  })[];
+  readonly booleanOperators: ({
+    label: string;
+    value: "eq";
+  } | {
+    label: string;
+    value: "neq";
+  })[];
+  /**
+   * Choices for a boolean filter's value select. Also handed to the select as
+   * `items`, where Base UI reads the closed trigger's label from.
+   */
+  readonly booleanValues: readonly [{
+    readonly label: "True";
+    readonly value: "true";
+  }, {
+    readonly label: "False";
+    readonly value: "false";
+  }];
+  readonly sortOrders: readonly [{
+    readonly label: "Asc";
+    readonly value: "asc";
+  }, {
+    readonly label: "Desc";
+    readonly value: "desc";
+  }];
+  readonly filterVariants: ("boolean" | "date" | "dateRange" | "multiSelect" | "number" | "range" | "select" | "text")[];
+  readonly operators: ("between" | "empty" | "eq" | "gt" | "gte" | "ilike" | "in" | "lt" | "lte" | "neq" | "not.empty" | "not.ilike" | "not.in" | "relative")[];
+  readonly joinOperators: ("and" | "or")[];
+};
+export type DataTableConfig = typeof dataTableConfig;
+//#endregion
+export {};