npm - @tradalab/lyra - Versions diffs - 3.7.0 → 3.8.1 - Mend

@tradalab/lyra 3.7.0 → 3.8.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (5) hide show

package/README.md +166 -131
package/dist/data-table/index.d.ts +135 -2
package/dist/data-table/index.js +140 -8
package/dist/data-table/index.js.map +1 -1
package/package.json +2 -2

package/README.md CHANGED Viewed

@@ -1,131 +1,166 @@
-# @tradalab/lyra
-> Tradalab's UI kit — shadcn (`radix-lyra` style) primitives, composed
-> components, and an app shell for **React 19 / Next 16 / Tailwind v4**.
-ESM-only. Extracted from Tradalab's foundation kit so every company app shares
-the same component surface.
-## Install
-```bash
-pnpm add @tradalab/lyra
-# peers: react ^19, react-dom ^19  (next ^16 only if you use /shell)
-```
-The stylesheet pulls in Tailwind v4, so your app needs `@tailwindcss/postcss`.
-```css
-/* app/globals.css */
-@import "@tradalab/lyra/styles.css";
-```
-## Subpaths
-| Subpath | Exports | Boundary |
-|---|---|---|
-| `@tradalab/lyra/utils` | `cn` | server-safe |
-| `@tradalab/lyra/hooks` | `useMobile` | client |
-| `@tradalab/lyra/ui` | 60 shadcn primitives + `AccountMenu`, `ActionButton`, `Container`, `EmptyState`, `StatusBadge` | client |
-| `@tradalab/lyra/blocks` | `Form`/`FormField` + RHF glue, `Panel`, `Confirm`/`useConfirm`, `Tree`, `TzPicker`, `OptionPicker`, `McpSettings`, `LlmSettings`, `PlatePicker`, `usePlate`, `useCompact`, `PreferenceScript` | client |
-| `@tradalab/lyra/shell` | `AppShell`, `PageShell`, `PageHeader`, `NavItem`, `NavGroup`, `Breadcrumbs`, `useActiveRoute` | client |
-| `@tradalab/lyra/styles.css` | Tailwind v4 base + `radix-lyra` tokens (light/dark) | CSS |
-Client subpaths carry a build-injected `"use client"`; import them inside a
-client tree or pass via `children` — don't import them into a Server Component's
-own module.
-```tsx
-import { Button, Card, CardHeader } from "@tradalab/lyra/ui"
-import { AppShell, NavItem } from "@tradalab/lyra/shell"
-```
-## Toast
-`2.0.0` replaced the sonner-based toast with shadcn's Base UI Toast. `sonner` is
-gone — it is no longer a peer dependency, and apps should drop it.
-`toast` is a **manager object, not a callable**:
-```tsx
-import { Toaster, toast } from "@tradalab/lyra/ui"
-toast.add({ title: "Saved" })
-toast.add({ title: "Upload failed", description: err.message, type: "error" })
-const id = toast.add({ title: "Uploading…", type: "loading", timeout: 0 })
-toast.close(id)
-```
-`type` is `"success" | "error" | "info" | "warning" | "loading"` — there is no
-`toast.success("x")`. `timeout: 0` never auto-dismisses (sonner's `duration:
-Infinity`). Position belongs to the viewport this package styles, so sonner's
-`position` and `richColors` props have no equivalent. Mount `<Toaster/>` once —
-apps on `@tradalab/nekit` already get it from `NekitProvider`.
-## Plate and density
-`3.4.0` added a palette the reader picks. The colours live in `styles.css` behind
-`[data-plate="<name>"]`, so an app only wires the choice:
-```tsx
-import { PlatePicker, PreferenceScript, useCompact, usePlate } from "@tradalab/lyra/blocks"
-// In the root layout, as early in the tree as possible.
-<PreferenceScript />
-// On a settings screen.
-const [plate, setPlate] = usePlate()
-<PlatePicker value={plate} onChange={setPlate} label="Accent colour" resetLabel="Default" />
-```
-`usePlate` and `useCompact` remember the choice per DEVICE, in `localStorage`
-under `lyra.plate` and `lyra.compact`, which is the same granularity as the
-theme. Absence means the default, so turning one off removes its key rather than
-storing "off".
-Keep `suppressHydrationWarning` on `<html>`. The script writes attributes the
-server did not render, which is the same reason `next-themes` needs it; every
-tradalab layout and `template-web` already carry it.
-Leaving out `<PreferenceScript />` is neither a compile error nor a runtime one.
-The attributes then arrive from an effect, so the first paint is always the
-neutral default and every reader who chose a colour watches it flip. It has to be
-a raw inline script to beat that paint, which is why lyra renders it instead of
-leaving it to each app.
-## Develop
-```bash
-make install            # pnpm install
-make build              # tsup + inject-use-client + verify-build-output
-make verify             # typecheck + lint + test
-make ui-add <name>      # scaffold a shadcn primitive, adapt, rebuild barrel
-make ui-update <name>   # overwrite a primitive with the latest upstream version
-make ui-sync            # re-adapt every primitive + rebuild barrel
-make ui-diff            # report which primitives changed upstream (exit 1 if any)
-```
-**Staying current with shadcn** — `make ui-diff` compares every primitive
-against the live `radix-lyra` registry and exits non-zero when one has moved.
-It normalises away everything the CLI would rewrite anyway (icon-library
-placeholders, `cn-*` template classes, import aliases, prettier line-wrapping),
-so what it prints is real change. Prefer it over `shadcn add --diff`, which
-caps its output at five files per run.
-A primitive lyra deliberately diverges from carries a `customised` note in
-`primitives.lock.json`; `ui-diff` lists those separately instead of failing on
-them forever. Document the divergence in a JSDoc block in the file too —
-`make ui-update` will overwrite it, and that note is what tells the next person
-to put it back.
-**Layout** — `src/<layer>/` with a barrel `index.ts`; one tsup entry per
-subpath; ESM-only to `dist/`. **Layers** (enforced by `eslint-plugin-boundaries`):
-`utils`/`hooks` (foundation) → `ui` → `shell`. No upward imports.
-**`"use client"` is not in source** — it is injected onto the client entry
-artifacts post-build by `scripts/inject-use-client.mjs`, then asserted by
-`scripts/verify-build-output.mjs`. `scripts/sync-ui.mjs` adapts shadcn-CLI
-output to repo conventions.
-**Release** — `pnpm publish --no-git-checks` (the `prepublishOnly` hook builds
-first). Published to the npm public registry.
+# @tradalab/lyra
+> Tradalab's UI kit — shadcn (`radix-lyra` style) primitives, composed
+> components, and an app shell for **React 19 / Next 16 / Tailwind v4**.
+ESM-only. Extracted from Tradalab's foundation kit so every company app shares
+the same component surface.
+## Install
+```bash
+pnpm add @tradalab/lyra
+# peers: react ^19, react-dom ^19  (next ^16 only if you use /shell)
+```
+The stylesheet pulls in Tailwind v4, so your app needs `@tailwindcss/postcss`.
+```css
+/* app/globals.css */
+@import "@tradalab/lyra/styles.css";
+```
+## Subpaths
+| Subpath | Exports | Boundary |
+|---|---|---|
+| `@tradalab/lyra/utils` | `cn` | server-safe |
+| `@tradalab/lyra/hooks` | `useMobile` | client |
+| `@tradalab/lyra/ui` | 60 shadcn primitives + `AccountMenu`, `ActionButton`, `Container`, `EmptyState`, `StatusBadge` | client |
+| `@tradalab/lyra/blocks` | `Form`/`FormField` + RHF glue, `Panel`, `Confirm`/`useConfirm`, `Tree`, `TzPicker`, `OptionPicker`, `McpSettings`, `LlmSettings`, `PlatePicker`, `usePlate`, `useCompact`, `PreferenceScript` | client |
+| `@tradalab/lyra/data-table` | `DataTable` + `usePager`, `TableFilterBar`, `TableSearch`, `TableReload`, `filterRows`, `pageWindow` | client |
+| `@tradalab/lyra/shell` | `AppShell`, `PageShell`, `PageHeader`, `NavItem`, `NavGroup`, `Breadcrumbs`, `useActiveRoute` | client |
+| `@tradalab/lyra/styles.css` | Tailwind v4 base + `radix-lyra` tokens (light/dark) | CSS |
+Client subpaths carry a build-injected `"use client"`; import them inside a
+client tree or pass via `children` — don't import them into a Server Component's
+own module.
+```tsx
+import { Button, Card, CardHeader } from "@tradalab/lyra/ui"
+import { AppShell, NavItem } from "@tradalab/lyra/shell"
+```
+## Tables: four modes, and the list decides which
+`DataTable` owns the controls; `usePager` (3.8.0) owns the wiring that every console used to
+write out by hand. Pick the mode from what is behind the list, not from habit.
+| Mode | Pass | For |
+|---|---|---|
+| numbered | `{...pager.bind(total)}` | the server pages it and returns a `total` - a list somebody **audits** |
+| cursor | `onLoadMore` + `hasMore` + `loadingMore` | the store only gives a continuation token and no count |
+| client-paged | `{...pager.slice(rows).props}` | the fetch IS the whole answer: a list derived from two endpoints, one operation's result |
+| unpaged | `unpaged` | the row count does not grow with tenants or with time - a declared inventory, a fixed catalogue |
+```tsx
+const pager = usePager({ pageSize: 25, labels })   // labels come from the app's i18n
+const { data } = useThings({ page: pager.page, pageSize: pager.size })
+<TableFilterBar actions={<TableReload onClick={refetch} loading={isFetching} />}>
+  <TableSearch onChange={pager.onFilter(setQuery)} placeholder="Name or code" />
+</TableFilterBar>
+<DataTable columns={columns} data={data?.things ?? []} {...pager.bind(data?.total ?? 0)} />
+```
+Two rules the components enforce rather than document:
+- **`TableFilterBar` replaces `DataTable`'s own bar** (`searchable`/`toolbar`/`onReload`). Two
+  bars on one table is how a screen ends up with two search boxes that search different things.
+- **`searchable` stays off on anything the server pages.** It filters the rows already in the
+  browser, so it answers "no results" about a row on page three. Send the query instead;
+  `filterRows` is for the unpaged case, where local filtering is the truth.
+lyra ships **no copy and no number formatting**: `usePager` takes `labels`, including
+`range: ({from, to, total}) => string`. That keeps `next-intl` out of the library, which matters
+because `data-table` must stay loadable by a consumer that is not a Next app.
+## Toast
+`2.0.0` replaced the sonner-based toast with shadcn's Base UI Toast. `sonner` is
+gone — it is no longer a peer dependency, and apps should drop it.
+`toast` is a **manager object, not a callable**:
+```tsx
+import { Toaster, toast } from "@tradalab/lyra/ui"
+toast.add({ title: "Saved" })
+toast.add({ title: "Upload failed", description: err.message, type: "error" })
+const id = toast.add({ title: "Uploading…", type: "loading", timeout: 0 })
+toast.close(id)
+```
+`type` is `"success" | "error" | "info" | "warning" | "loading"` — there is no
+`toast.success("x")`. `timeout: 0` never auto-dismisses (sonner's `duration:
+Infinity`). Position belongs to the viewport this package styles, so sonner's
+`position` and `richColors` props have no equivalent. Mount `<Toaster/>` once —
+apps on `@tradalab/nekit` already get it from `NekitProvider`.
+## Plate and density
+`3.4.0` added a palette the reader picks. The colours live in `styles.css` behind
+`[data-plate="<name>"]`, so an app only wires the choice:
+```tsx
+import { PlatePicker, PreferenceScript, useCompact, usePlate } from "@tradalab/lyra/blocks"
+// In the root layout, as early in the tree as possible.
+<PreferenceScript />
+// On a settings screen.
+const [plate, setPlate] = usePlate()
+<PlatePicker value={plate} onChange={setPlate} label="Accent colour" resetLabel="Default" />
+```
+`usePlate` and `useCompact` remember the choice per DEVICE, in `localStorage`
+under `lyra.plate` and `lyra.compact`, which is the same granularity as the
+theme. Absence means the default, so turning one off removes its key rather than
+storing "off".
+Keep `suppressHydrationWarning` on `<html>`. The script writes attributes the
+server did not render, which is the same reason `next-themes` needs it; every
+tradalab layout and `template-web` already carry it.
+Leaving out `<PreferenceScript />` is neither a compile error nor a runtime one.
+The attributes then arrive from an effect, so the first paint is always the
+neutral default and every reader who chose a colour watches it flip. It has to be
+a raw inline script to beat that paint, which is why lyra renders it instead of
+leaving it to each app.
+## Develop
+```bash
+make install            # pnpm install
+make build              # tsup + inject-use-client + verify-build-output
+make verify             # typecheck + lint + test
+make ui-add <name>      # scaffold a shadcn primitive, adapt, rebuild barrel
+make ui-update <name>   # overwrite a primitive with the latest upstream version
+make ui-sync            # re-adapt every primitive + rebuild barrel
+make ui-diff            # report which primitives changed upstream (exit 1 if any)
+```
+**Staying current with shadcn** — `make ui-diff` compares every primitive
+against the live `radix-lyra` registry and exits non-zero when one has moved.
+It normalises away everything the CLI would rewrite anyway (icon-library
+placeholders, `cn-*` template classes, import aliases, prettier line-wrapping),
+so what it prints is real change. Prefer it over `shadcn add --diff`, which
+caps its output at five files per run.
+A primitive lyra deliberately diverges from carries a `customised` note in
+`primitives.lock.json`; `ui-diff` lists those separately instead of failing on
+them forever. Document the divergence in a JSDoc block in the file too —
+`make ui-update` will overwrite it, and that note is what tells the next person
+to put it back.
+**Layout** — `src/<layer>/` with a barrel `index.ts`; one tsup entry per
+subpath; ESM-only to `dist/`. **Layers** (enforced by `eslint-plugin-boundaries`):
+`utils`/`hooks` (foundation) → `ui` → `shell`. No upward imports.
+**`"use client"` is not in source** — it is injected onto the client entry
+artifacts post-build by `scripts/inject-use-client.mjs`, then asserted by
+`scripts/verify-build-output.mjs`. `scripts/sync-ui.mjs` adapts shadcn-CLI
+output to repo conventions.
+**Release** — `pnpm publish --no-git-checks` (the `prepublishOnly` hook builds
+first). Published to the npm public registry.

package/dist/data-table/index.d.ts CHANGED Viewed

@@ -3,6 +3,129 @@ import { ReactNode, HTMLAttributes } from 'react';
 import { ColumnDef, Row, Cell, Column, Table, Header, HeaderGroup } from '@tanstack/react-table';
 export { ColumnDef } from '@tanstack/react-table';
+/**
+ * Case-insensitive search over chosen fields, for a list the server does NOT page.
+ *
+ * Honest only there: when the fetch is the whole answer, filtering here searches everything
+ * the reader could have seen. On a server-paged list the same code searches one page and then
+ * reports "no results" about rows it never had - which is why those lists send the query to
+ * the server instead.
+ *
+ * Takes a field selector rather than key names so a derived value (a joined label, a formatted
+ * code) is searchable too - on the tables this exists for, the derived column is usually the
+ * one people type into the box.
+ */
+declare function filterRows<T>(rows: T[], q: string, fields: (r: T) => (string | undefined | null)[]): T[];
+/**
+ * The row above a table: narrowing on the left, actions on the right.
+ *
+ * This REPLACES `DataTable`'s own bar (`searchable` + `toolbar` + `onReload`) rather than
+ * sitting beside it. Two bars on one table is how a screen ends up with two search boxes that
+ * search different things, and `searchable` in particular must stay off on a server-paged
+ * table: it filters the rows already in the browser, so it answers "no results" about a row
+ * that is on page three.
+ */
+declare function TableFilterBar({ children, actions, className, }: {
+    children?: ReactNode;
+    actions?: ReactNode;
+    className?: string;
+}): React.JSX.Element;
+/**
+ * A search box that reports the settled value, debounced here so no call site has to remember.
+ *
+ * 300ms, because on a server-paged list every keystroke is both a round trip and a new query
+ * key - and a new query key throws away the page already loaded.
+ */
+declare function TableSearch({ onChange, placeholder, className, icon, }: {
+    /** Called with the trimmed value once typing settles. */
+    onChange: (q: string) => void;
+    placeholder?: string;
+    className?: string;
+    /** Set false where the surrounding bar already says what the box is for. */
+    icon?: boolean;
+}): React.JSX.Element;
+/** Refetch, spinning while it does. Belongs in the filter bar, not in DataTable's own bar. */
+declare function TableReload({ onClick, loading, label, }: {
+    onClick: () => void;
+    loading?: boolean;
+    label?: string;
+}): React.JSX.Element;
+/**
+ * The state behind `DataTable`'s numbered pager, so a screen configures paging instead of
+ * owning it.
+ *
+ * Every console that grew a numbered table had written the same twelve lines - page state,
+ * size state, the 0-based/1-based conversion, the range string, the back-to-page-1 wrapper -
+ * and the copies had already drifted into pagers that behaved slightly differently on screens
+ * next to each other. `DataTable` owned the controls; nothing owned the wiring.
+ *
+ * Two shapes, because the lists behind these tables are not all the same:
+ *
+ *   `bind(total)`  the SERVER paged it. Feed `page`/`size` into the request and hand back the
+ *                  `total` it answered with.
+ *   `slice(rows)`  the fetch IS the whole answer - a list derived from two endpoints, the
+ *                  result of one operation, a parsed file - so the page is cut here.
+ *
+ * `slice` is honest only in that second case. Over a list the server truncated it reports a
+ * page count that does not exist, which tells the reader they have seen everything.
+ */
+/** Sizes offered in the rows-per-page selector. */
+declare const PAGE_SIZE_OPTIONS: number[];
+/** Rows per page before anyone chooses. Smaller than a screenful is churn; larger buries the pager. */
+declare const DEFAULT_PAGE_SIZE = 25;
+/**
+ * Copy for the pager. lyra ships none of it: `range` also decides number formatting, which is
+ * a locale decision the app's i18n already makes.
+ */
+type PagerLabels = {
+    first?: string;
+    previous?: string;
+    next?: string;
+    last?: string;
+    size?: string;
+    range?: (r: {
+        from: number;
+        to: number;
+        total: number;
+    }) => string;
+};
+/** The `DataTable` props that make up the numbered pager. Spread them; never spell them out. */
+type PagerProps = {
+    pageIndex: number;
+    pageCount: number;
+    onPageChange: (index: number) => void;
+    pageSize: number;
+    pageSizeOptions: number[];
+    onPageSizeChange: (size: number) => void;
+    rangeLabel: string;
+    pageLabels: {
+        first?: string;
+        previous?: string;
+        next?: string;
+        last?: string;
+        size?: string;
+    };
+};
+type UsePagerOptions = {
+    pageSize?: number;
+    pageSizeOptions?: number[];
+    labels?: PagerLabels;
+};
+declare function usePager(options?: UsePagerOptions): {
+    page: number;
+    size: number;
+    setPage: React.Dispatch<React.SetStateAction<number>>;
+    onFilter: <T>(apply: (v: T) => void) => (v: T) => void;
+    bind: (total: number) => PagerProps;
+    /** Cut the current page out of a complete list. */
+    slice<T>(rows: T[]): {
+        rows: T[];
+        props: PagerProps;
+    };
+};
 declare const TableContext: React.Context<{
     data: unknown[];
     columns: ColumnDef<unknown, unknown>[];
@@ -83,6 +206,16 @@ interface DataTableProps<TData, TValue> {
     nextLabel?: string;
     /** Rows per page (default 10). Pagination controls appear only when needed. */
     pageSize?: number;
+    /**
+     * Render every row and no pager at all.
+     *
+     * For the list whose row count does not grow with tenants or with time - a declared
+     * inventory, a fixed catalogue, the handful of providers somebody configured by hand. There
+     * the fetch is the whole answer, so a pager is a control nobody needs and a page count is a
+     * number nobody asked for. Opt-in rather than the default, because the default (slice by
+     * `pageSize`, Prev/Next) is what eleven existing call sites already rely on.
+     */
+    unpaged?: boolean;
     /** Extra classes on the bordered table wrapper. */
     className?: string;
     /** Show a search box that globally filters rows across all accessor columns. */
@@ -134,6 +267,6 @@ interface DataTableProps<TData, TValue> {
  * reader opened it with.
  */
 declare function pageWindow(index: number, count: number, radius?: number): (number | null)[];
-declare function DataTable<TData, TValue>({ columns, data, loading, emptyText, empty, loadingText, previousLabel, nextLabel, pageSize, className, searchable, searchPlaceholder, onReload, reloadLabel, toolbar, onLoadMore, hasMore, loadingMore, loadingMoreText, pageIndex, pageCount, onPageChange, pageSizeOptions, onPageSizeChange, rangeLabel, pageLabels, }: DataTableProps<TData, TValue>): React.JSX.Element;
+declare function DataTable<TData, TValue>({ columns, data, loading, emptyText, empty, loadingText, previousLabel, nextLabel, pageSize, unpaged, className, searchable, searchPlaceholder, onReload, reloadLabel, toolbar, onLoadMore, hasMore, loadingMore, loadingMoreText, pageIndex, pageCount, onPageChange, pageSizeOptions, onPageSizeChange, rangeLabel, pageLabels, }: DataTableProps<TData, TValue>): React.JSX.Element;
-export { DataTable, type DataTableProps, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableColumnHeader, type TableColumnHeaderProps, TableContext, TableHead, type TableHeadProps, TableHeader, TableHeaderGroup, type TableHeaderGroupProps, type TableHeaderProps, TableProvider, type TableProviderProps, TableRow, type TableRowProps, pageWindow };
+export { DEFAULT_PAGE_SIZE, DataTable, type DataTableProps, PAGE_SIZE_OPTIONS, type PagerLabels, type PagerProps, TableBody, type TableBodyProps, TableCell, type TableCellProps, TableColumnHeader, type TableColumnHeaderProps, TableContext, TableFilterBar, TableHead, type TableHeadProps, TableHeader, TableHeaderGroup, type TableHeaderGroupProps, type TableHeaderProps, TableProvider, type TableProviderProps, TableReload, TableRow, type TableRowProps, TableSearch, type UsePagerOptions, filterRows, pageWindow, usePager };

package/dist/data-table/index.js CHANGED Viewed

@@ -1,13 +1,142 @@
 "use client";
 import { TableHead, Table, TableRow, TableHeader, TableCell, TableBody, NativeSelect, NativeSelectOption } from '../chunk-AM6UJ666.js';
 import { DropdownMenu, DropdownMenuTrigger, DropdownMenuContent, DropdownMenuItem } from '../chunk-VEWKPOMS.js';
-import { Button, Input } from '../chunk-VGOGWZCF.js';
+import { Input, Button } from '../chunk-VGOGWZCF.js';
 import { cn } from '../chunk-XH55BHUU.js';
 import { flexRender, useReactTable, getSortedRowModel, getCoreRowModel, getPaginationRowModel, getFilteredRowModel } from '@tanstack/react-table';
-import { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon, SearchIcon, RefreshCwIcon, Loader2Icon } from 'lucide-react';
-import { createContext, memo, useState, useContext, useCallback, useRef, useEffect } from 'react';
+import { SearchIcon, RefreshCwIcon, ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon, Loader2Icon } from 'lucide-react';
+import { createContext, memo, useState, useRef, useEffect, useCallback, useContext } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
+// src/data-table/filter-rows.ts
+function filterRows(rows, q, fields) {
+  const needle = q.trim().toLowerCase();
+  if (!needle) return rows;
+  return rows.filter((r) => fields(r).some((v) => v?.toLowerCase().includes(needle)));
+}
+function TableFilterBar({
+  children,
+  actions,
+  className
+}) {
+  return /* @__PURE__ */ jsxs("div", { className: cn("flex flex-wrap items-center gap-2", className), children: [
+    children,
+    actions ? /* @__PURE__ */ jsx("div", { className: "ml-auto flex items-center gap-2", children: actions }) : null
+  ] });
+}
+function TableSearch({
+  onChange,
+  placeholder = "Search\u2026",
+  className,
+  icon = true
+}) {
+  const [text, setText] = useState("");
+  const sink = useRef(onChange);
+  useEffect(() => {
+    sink.current = onChange;
+  }, [onChange]);
+  useEffect(() => {
+    const id = setTimeout(() => sink.current(text.trim()), 300);
+    return () => clearTimeout(id);
+  }, [text]);
+  return /* @__PURE__ */ jsxs("div", { className: cn("relative w-full max-w-xs", className), children: [
+    icon ? /* @__PURE__ */ jsx(SearchIcon, { className: "text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2" }) : null,
+    /* @__PURE__ */ jsx(
+      Input,
+      {
+        value: text,
+        onChange: (e) => setText(e.target.value),
+        placeholder,
+        className: icon ? "pl-8" : void 0
+      }
+    )
+  ] });
+}
+function TableReload({
+  onClick,
+  loading,
+  label = "Reload"
+}) {
+  return /* @__PURE__ */ jsx(
+    Button,
+    {
+      type: "button",
+      variant: "outline",
+      size: "icon-sm",
+      onClick,
+      disabled: loading,
+      "aria-label": label,
+      title: label,
+      children: /* @__PURE__ */ jsx(RefreshCwIcon, { className: cn("size-4", loading && "animate-spin") })
+    }
+  );
+}
+var PAGE_SIZE_OPTIONS = [25, 50, 100, 200];
+var DEFAULT_PAGE_SIZE = 25;
+function usePager(options = {}) {
+  const {
+    pageSize: initialSize = DEFAULT_PAGE_SIZE,
+    pageSizeOptions = PAGE_SIZE_OPTIONS,
+    labels
+  } = options;
+  const [page, setPage] = useState(1);
+  const [size, setSize] = useState(initialSize);
+  const props = useCallback(
+    (total) => {
+      const pageCount = Math.max(1, Math.ceil(total / size));
+      const at = total > 0 ? Math.min(page, pageCount) : page;
+      return {
+        pageIndex: at - 1,
+        pageCount,
+        onPageChange: (i) => setPage(i + 1),
+        pageSize: size,
+        pageSizeOptions,
+        // A different size means a different page 1; staying on page 7 of the old size lands
+        // past the end of the new one.
+        onPageSizeChange: (n) => {
+          setSize(n);
+          setPage(1);
+        },
+        rangeLabel: total > 0 ? labels?.range?.({
+          from: (at - 1) * size + 1,
+          to: Math.min(at * size, total),
+          total
+        }) ?? "" : "",
+        pageLabels: {
+          first: labels?.first,
+          previous: labels?.previous,
+          next: labels?.next,
+          last: labels?.last,
+          size: labels?.size
+        }
+      };
+    },
+    [page, size, pageSizeOptions, labels]
+  );
+  const onFilter = useCallback(
+    (apply) => (v) => {
+      apply(v);
+      setPage(1);
+    },
+    []
+  );
+  return {
+    page,
+    size,
+    setPage,
+    onFilter,
+    bind: props,
+    /** Cut the current page out of a complete list. */
+    slice(rows) {
+      const last = Math.max(1, Math.ceil(rows.length / size));
+      const at = Math.min(page, last);
+      return {
+        rows: rows.slice((at - 1) * size, at * size),
+        props: { ...props(rows.length), pageIndex: at - 1 }
+      };
+    }
+  };
+}
 var TableContext = createContext({
   data: [],
   columns: [],
@@ -107,6 +236,7 @@ function DataTable({
   previousLabel = "Previous",
   nextLabel = "Next",
   pageSize = 10,
+  unpaged,
   className,
   searchable,
   searchPlaceholder = "Search\u2026",
@@ -128,6 +258,7 @@ function DataTable({
   const [globalFilter, setGlobalFilter] = useState("");
   const infinite = Boolean(onLoadMore);
   const served = !infinite && Boolean(onPageChange);
+  const sliced = !infinite && !served && !unpaged;
   const table = useReactTable({
     data,
     columns,
@@ -135,9 +266,10 @@ function DataTable({
     onGlobalFilterChange: setGlobalFilter,
     getCoreRowModel: getCoreRowModel(),
     getFilteredRowModel: getFilteredRowModel(),
-    // Infinite mode renders every accumulated row; pagination is only wired for
-    // the default finite table.
-    ...infinite || served ? {} : { getPaginationRowModel: getPaginationRowModel(), initialState: { pagination: { pageSize } } }
+    // Only the default finite table slices rows itself. The other three modes each hand the
+    // table exactly what to render: infinite every accumulated row, served the one page the
+    // server answered with, unpaged the whole list.
+    ...sliced ? { getPaginationRowModel: getPaginationRowModel(), initialState: { pagination: { pageSize } } } : {}
   });
   const rows = table.getRowModel().rows;
   const showBar = Boolean(searchable || onReload || toolbar);
@@ -303,13 +435,13 @@ function DataTable({
         )
       ] })
     ] }) : null,
-    !infinite && !served && table.getPageCount() > 1 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2 py-4", children: [
+    sliced && table.getPageCount() > 1 ? /* @__PURE__ */ jsxs("div", { className: "flex items-center justify-end gap-2 py-4", children: [
       /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: () => table.previousPage(), disabled: !table.getCanPreviousPage(), children: previousLabel }),
       /* @__PURE__ */ jsx(Button, { variant: "outline", size: "sm", onClick: () => table.nextPage(), disabled: !table.getCanNextPage(), children: nextLabel })
     ] }) : null
   ] });
 }
-export { DataTable, TableBody2 as TableBody, TableCell2 as TableCell, TableColumnHeader, TableContext, TableHead2 as TableHead, TableHeader2 as TableHeader, TableHeaderGroup, TableProvider, TableRow2 as TableRow, pageWindow };
+export { DEFAULT_PAGE_SIZE, DataTable, PAGE_SIZE_OPTIONS, TableBody2 as TableBody, TableCell2 as TableCell, TableColumnHeader, TableContext, TableFilterBar, TableHead2 as TableHead, TableHeader2 as TableHeader, TableHeaderGroup, TableProvider, TableReload, TableRow2 as TableRow, TableSearch, filterRows, pageWindow, usePager };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/data-table/index.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/data-table/index.tsx"],"names":["TableHead","TableHeader","TableCell","TableRow","TableBody"],"mappings":"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","file":"index.js","sourcesContent":["import type { Cell, Column, ColumnDef, Header, HeaderGroup, Row, SortingState, Table } from \"@tanstack/react-table\"\nimport { flexRender, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from \"@tanstack/react-table\"\nimport { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon, Loader2Icon, RefreshCwIcon, SearchIcon } from \"lucide-react\"\nimport type { HTMLAttributes, ReactNode } from \"react\"\nimport { createContext, memo, useCallback, useContext, useEffect, useRef, useState } from \"react\"\nimport { Button } from \"~/ui/primitives/button.js\"\nimport { Input } from \"~/ui/primitives/input.js\"\nimport { NativeSelect, NativeSelectOption } from \"~/ui/primitives/native-select.js\"\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from \"~/ui/primitives/dropdown-menu.js\"\nimport {\n TableBody as TableBodyRaw,\n TableCell as TableCellRaw,\n TableHeader as TableHeaderRaw,\n TableHead as TableHeadRaw,\n Table as TableRaw,\n TableRow as TableRowRaw,\n} from \"~/ui/primitives/table.js\"\nimport { cn } from \"~/utils/cn.js\"\n\nexport type { ColumnDef } from \"@tanstack/react-table\"\n\n\nexport const TableContext = createContext<{\n data: unknown[]\n columns: ColumnDef<unknown, unknown>[]\n table: Table<unknown> \| null\n}>({\n data: [],\n columns: [],\n table: null,\n})\n\nexport type TableProviderProps<TData, TValue> = {\n columns: ColumnDef<TData, TValue>[]\n data: TData[]\n children: ReactNode\n className?: string\n}\n\nexport function TableProvider<TData, TValue>({ columns, data, children, className }: TableProviderProps<TData, TValue>) {\n const [sorting, setSorting] = useState<SortingState>([])\n const table = useReactTable({\n data,\n columns,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n // useState's setter is itself a valid TanStack OnChangeFn (it accepts a\n // value or an updater fn), so it can be wired directly — type-safe, no cast.\n onSortingChange: setSorting,\n state: {\n sorting,\n },\n })\n\n return (\n <TableContext.Provider\n value={{\n data,\n columns: columns as never,\n table: table as never,\n }}\n >\n <TableRaw className={className}>{children}</TableRaw>\n </TableContext.Provider>\n )\n}\n\nexport type TableHeadProps = {\n header: Header<unknown, unknown>\n className?: string\n}\n\nexport const TableHead = memo(({ header, className }: TableHeadProps) => (\n <TableHeadRaw className={className} key={header.id}>\n {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHeadRaw>\n))\n\nTableHead.displayName = \"TableHead\"\n\nexport type TableHeaderGroupProps = {\n headerGroup: HeaderGroup<unknown>\n children: (props: { header: Header<unknown, unknown> }) => ReactNode\n}\n\nexport const TableHeaderGroup = ({ headerGroup, children }: TableHeaderGroupProps) => (\n <TableRowRaw key={headerGroup.id}>{headerGroup.headers.map(header => children({ header }))}</TableRowRaw>\n)\n\nexport type TableHeaderProps = {\n className?: string\n children: (props: { headerGroup: HeaderGroup<unknown> }) => ReactNode\n}\n\nexport const TableHeader = ({ className, children }: TableHeaderProps) => {\n const { table } = useContext(TableContext)\n\n return <TableHeaderRaw className={className}>{table?.getHeaderGroups().map(headerGroup => children({ headerGroup }))}</TableHeaderRaw>\n}\n\nexport interface TableColumnHeaderProps<TData, TValue> extends HTMLAttributes<HTMLDivElement> {\n column: Column<TData, TValue>\n title: string\n}\n\nexport function TableColumnHeader<TData, TValue>({ column, title, className }: TableColumnHeaderProps<TData, TValue>) {\n // Extract inline event handlers to prevent unnecessary re-renders\n const handleSortAsc = useCallback(() => {\n column.toggleSorting(false)\n }, [column])\n\n const handleSortDesc = useCallback(() => {\n column.toggleSorting(true)\n }, [column])\n\n if (!column.getCanSort()) {\n return <div className={cn(className)}>{title}</div>\n }\n\n return (\n <div className={cn(\"flex items-center space-x-2\", className)}>\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button className=\"-ml-3 h-8 data-[state=open]:bg-accent\" size=\"sm\" variant=\"ghost\">\n <span>{title}</span>\n {column.getIsSorted() === \"desc\" ? (\n <ArrowDownIcon className=\"ml-2 h-4 w-4\" />\n ) : column.getIsSorted() === \"asc\" ? (\n <ArrowUpIcon className=\"ml-2 h-4 w-4\" />\n ) : (\n <ChevronsUpDownIcon className=\"ml-2 h-4 w-4\" />\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\">\n <DropdownMenuItem onClick={handleSortAsc}>\n <ArrowUpIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n Asc\n </DropdownMenuItem>\n <DropdownMenuItem onClick={handleSortDesc}>\n <ArrowDownIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n Desc\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n )\n}\n\nexport type TableCellProps = {\n cell: Cell<unknown, unknown>\n className?: string\n}\n\nexport const TableCell = ({ cell, className }: TableCellProps) => (\n <TableCellRaw className={className}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCellRaw>\n)\n\nexport type TableRowProps = {\n row: Row<unknown>\n children: (props: { cell: Cell<unknown, unknown> }) => ReactNode\n className?: string\n}\n\nexport const TableRow = ({ row, children, className }: TableRowProps) => (\n <TableRowRaw className={className} data-state={row.getIsSelected() && \"selected\"} key={row.id}>\n {row.getVisibleCells().map(cell => children({ cell }))}\n </TableRowRaw>\n)\n\nexport type TableBodyProps = {\n children: (props: { row: Row<unknown> }) => ReactNode\n className?: string\n}\n\nexport const TableBody = ({ children, className }: TableBodyProps) => {\n const { columns, table } = useContext(TableContext)\n const rows = table?.getRowModel().rows\n\n return (\n <TableBodyRaw className={className}>\n {rows?.length ? (\n rows.map(row => children({ row }))\n ) : (\n <TableRowRaw>\n <TableCellRaw className=\"h-24 text-center\" colSpan={columns.length}>\n No results.\n </TableCellRaw>\n </TableRowRaw>\n )}\n </TableBodyRaw>\n )\n}\n\n// ---------------------------------------------------------------------------\n// DataTable — a batteries-included, self-contained paginated table. Unlike the\n// composition primitives above (TableProvider + render-prop parts), this is a\n// drop-in: pass `columns` + `data` and get header, body, empty/loading states\n// and Prev/Next pagination. All user-facing labels are props (English\n// defaults) so apps can feed i18n strings; the component itself ships no copy.\n// ---------------------------------------------------------------------------\n\nexport interface DataTableProps<TData, TValue> {\n columns: ColumnDef<TData, TValue>[]\n data: TData[]\n /** Show a single-row loading state instead of the body. /\n loading?: boolean\n /* Row shown when there are no results. /\n emptyText?: string\n /\n What fills the body when there are no results, in place of `emptyText`.\n \n A centred grey line reads the same as a request that failed, and on a table it is the only\n * thing a reader has to tell \"nobody matched your filter\" from \"this screen is broken\". Takes\n * `EmptyState` from `@tradalab/lyra/ui`, or anything else. `emptyText` stays because most tables\n * want one sentence and nothing more.\n /\n empty?: ReactNode\n /* Row shown while `loading`. /\n loadingText?: string\n /* Previous-page button label. /\n previousLabel?: string\n /* Next-page button label. /\n nextLabel?: string\n /* Rows per page (default 10). Pagination controls appear only when needed. /\n pageSize?: number\n /* Extra classes on the bordered table wrapper. /\n className?: string\n // --- control bar (all optional; the bar renders only when one is set) ---\n /* Show a search box that globally filters rows across all accessor columns. /\n searchable?: boolean\n /* Placeholder for the search box. /\n searchPlaceholder?: string\n /* Show a reload button; called on click. Its icon spins while `loading`. /\n onReload?: () => void\n /* Accessible label / tooltip for the reload button. /\n reloadLabel?: string\n /* Custom controls rendered on the right of the bar (e.g. a \"New\" button). /\n toolbar?: ReactNode\n // --- infinite scroll (opt-in; providing `onLoadMore` switches the table from\n // Prev/Next pagination to rendering every accumulated row and requesting more\n // as a bottom sentinel scrolls into view). Data fetching stays with the caller\n // (e.g. react-query useInfiniteQuery); the table only owns the sentinel. ---\n /* Called when the bottom sentinel becomes visible and more rows can load. /\n onLoadMore?: () => void\n /* Whether another page is available; the sentinel is ignored once false. /\n hasMore?: boolean\n /* True while the next page is loading — shows a spinner row and de-dupes calls. /\n loadingMore?: boolean\n /* Label beside the bottom spinner. /\n loadingMoreText?: string\n // --- server-driven pages (opt-in; providing `onPageChange` switches the table from\n // slicing rows itself to showing exactly the page it was handed, plus a numbered pager).\n //\n // For the screens that get AUDITED rather than skimmed: a timesheet, a punch log at year\n // end. Infinite scroll cannot say \"page 3 of 47\", cannot be sent to a colleague, and cannot\n // reach the end of a long list without dragging through all of it.\n //\n // `onLoadMore` wins if both are given - a table with two pagers is a bug that ships. ---\n /* Zero-based index of the page being shown. /\n pageIndex?: number\n /* How many pages exist. The table cannot work this out: only the server knows the total. /\n pageCount?: number\n /* Called with a zero-based page index. /\n onPageChange?: (index: number) => void\n /* Sizes offered in the selector. Omit to leave the size fixed and hide the control. /\n pageSizeOptions?: number[]\n /* Called with the chosen size. The caller is expected to return to page 1. /\n onPageSizeChange?: (size: number) => void\n /* Free text beside the pager, e.g. \"1-50 of 4,231\". lyra ships no copy and no number\n * formatting, so the caller builds it. /\n rangeLabel?: ReactNode\n /* Accessible labels for the pager buttons. /\n pageLabels?: { first?: string; previous?: string; next?: string; last?: string; size?: string }\n}\n\n/\n Which page numbers to show: always the first, the last, and a couple either side of the\n * current one, with `null` where a gap is elided.\n \n A pager that renders every page is unusable at forty pages and absurd at four hundred, and\n * one that renders only prev/next hides how long the list is - which is the question the\n * reader opened it with.\n */\nexport function pageWindow(index: number, count: number, radius = 1): (number \| null)[] {\n if (count <= 0) return []\n const want = new Set<number>([0, count - 1])\n for (let p = index - radius; p <= index + radius; p++) {\n if (p >= 0 && p < count) want.add(p)\n }\n const sorted = [...want].sort((a, b) => a - b)\n const out: (number \| null)[] = []\n let prev = -1\n for (const p of sorted) {\n // A single skipped page is rendered rather than elided: \"1 … 3\" is longer than \"1 2 3\"\n // and tells the reader less.\n if (prev >= 0 && p - prev === 2) out.push(p - 1)\n else if (prev >= 0 && p - prev > 2) out.push(null)\n out.push(p)\n prev = p\n }\n return out\n}\n\nexport function DataTable<TData, TValue>({\n columns,\n data,\n loading,\n emptyText = \"No results.\",\n empty,\n loadingText = \"Loading…\",\n previousLabel = \"Previous\",\n nextLabel = \"Next\",\n pageSize = 10,\n className,\n searchable,\n searchPlaceholder = \"Search…\",\n onReload,\n reloadLabel = \"Reload\",\n toolbar,\n onLoadMore,\n hasMore,\n loadingMore,\n loadingMoreText = \"Loading more…\",\n pageIndex = 0,\n pageCount = 0,\n onPageChange,\n pageSizeOptions,\n onPageSizeChange,\n rangeLabel,\n pageLabels,\n}: DataTableProps<TData, TValue>) {\n const [globalFilter, setGlobalFilter] = useState(\"\")\n const infinite = Boolean(onLoadMore)\n // Server pages: the rows handed in ARE the page, so the table must not slice them again.\n const served = !infinite && Boolean(onPageChange)\n const table = useReactTable({\n data,\n columns,\n state: { globalFilter },\n onGlobalFilterChange: setGlobalFilter,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n // Infinite mode renders every accumulated row; pagination is only wired for\n // the default finite table.\n ...(infinite \|\| served\n ? {}\n : { getPaginationRowModel: getPaginationRowModel(), initialState: { pagination: { pageSize } } }),\n })\n\n const rows = table.getRowModel().rows\n const showBar = Boolean(searchable \|\| onReload \|\| toolbar)\n\n // --- infinite scroll: observe a bottom sentinel and ask the caller for more.\n // Latest callback/flags are kept in refs so the observer subscribes once. ---\n const sentinelRef = useRef<HTMLDivElement \| null>(null)\n const onLoadMoreRef = useRef(onLoadMore)\n onLoadMoreRef.current = onLoadMore\n const flags = useRef({ hasMore, loadingMore })\n flags.current = { hasMore, loadingMore }\n const intersecting = useRef(false)\n\n const maybeLoadMore = useCallback(() => {\n if (intersecting.current && flags.current.hasMore && !flags.current.loadingMore) {\n onLoadMoreRef.current?.()\n }\n }, [])\n\n useEffect(() => {\n if (!infinite) return\n const el = sentinelRef.current\n if (!el) return\n const io = new IntersectionObserver(\n entries => {\n intersecting.current = entries[0]?.isIntersecting ?? false\n maybeLoadMore()\n },\n { rootMargin: \"200px\" },\n )\n io.observe(el)\n return () => {\n io.disconnect()\n }\n }, [infinite, maybeLoadMore])\n\n // A freshly loaded page can leave the sentinel still on-screen; the observer\n // won't re-fire on its own, so re-check whenever the rows or flags change.\n useEffect(() => {\n if (infinite) maybeLoadMore()\n }, [infinite, rows.length, loadingMore, hasMore, maybeLoadMore])\n\n return (\n <div>\n {showBar ? (\n <div className=\"flex items-center gap-2 pb-4\">\n {searchable ? (\n <div className=\"relative w-full max-w-xs\">\n <SearchIcon className=\"text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2\" />\n <Input\n value={globalFilter}\n onChange={e => table.setGlobalFilter(e.target.value)}\n placeholder={searchPlaceholder}\n className=\"pl-8\"\n />\n </div>\n ) : null}\n {onReload \|\| toolbar ? (\n <div className=\"ml-auto flex items-center gap-2\">\n {toolbar}\n {onReload ? (\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"icon-sm\"\n onClick={onReload}\n disabled={loading}\n aria-label={reloadLabel}\n title={reloadLabel}\n >\n <RefreshCwIcon className={cn(\"size-4\", loading && \"animate-spin\")} />\n </Button>\n ) : null}\n </div>\n ) : null}\n </div>\n ) : null}\n <div className={cn(\"overflow-hidden border\", className)}>\n <TableRaw>\n <TableHeaderRaw>\n {table.getHeaderGroups().map(hg => (\n <TableRowRaw key={hg.id}>\n {hg.headers.map(header => (\n <TableHeadRaw key={header.id}>\n {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHeadRaw>\n ))}\n </TableRowRaw>\n ))}\n </TableHeaderRaw>\n <TableBodyRaw>\n {loading && rows.length === 0 ? (\n // Only replace the body with a loading row on the FIRST load; on a\n // refetch keep the (stale) rows visible while the reload icon spins.\n <TableRowRaw>\n <TableCellRaw className=\"h-24 text-center\" colSpan={columns.length}>\n {loadingText}\n </TableCellRaw>\n </TableRowRaw>\n ) : rows.length ? (\n rows.map(row => (\n <TableRowRaw key={row.id} data-state={row.getIsSelected() && \"selected\"}>\n {row.getVisibleCells().map(cell => (\n <TableCellRaw key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCellRaw>\n ))}\n </TableRowRaw>\n ))\n ) : (\n // An empty state is not a record, so the row drops the `hover:bg-muted/50` every\n // other row carries: lighting up under the pointer offers an interaction that is not\n // there, and it gets louder the taller the cell grows.\n <TableRowRaw className=\"hover:bg-transparent\">\n <TableCellRaw\n className={empty ? \"p-0\" : \"text-muted-foreground h-24 text-center\"}\n colSpan={columns.length}\n >\n {empty ?? emptyText}\n </TableCellRaw>\n </TableRowRaw>\n )}\n </TableBodyRaw>\n </TableRaw>\n {infinite && loadingMore ? (\n <div className=\"text-muted-foreground flex items-center justify-center gap-2 py-3 text-sm\">\n <Loader2Icon className=\"size-4 animate-spin\" />\n {loadingMoreText}\n </div>\n ) : null}\n {infinite ? <div ref={sentinelRef} aria-hidden className=\"h-px w-full\" /> : null}\n </div>\n {served ? (\n <div className=\"flex flex-wrap items-center justify-between gap-3 py-4\">\n <div className=\"text-muted-foreground flex items-center gap-3 text-sm\">\n {rangeLabel}\n {pageSizeOptions && pageSizeOptions.length > 0 ? (\n <NativeSelect\n aria-label={pageLabels?.size ?? \"Rows per page\"}\n className=\"h-8 w-auto\"\n value={String(pageSize)}\n onChange={e => onPageSizeChange?.(Number(e.target.value))}\n >\n {pageSizeOptions.map(n => (\n <NativeSelectOption key={n} value={String(n)}>\n {n}\n </NativeSelectOption>\n ))}\n </NativeSelect>\n ) : null}\n </div>\n <div className=\"flex items-center gap-1\">\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.first ?? \"First page\"}\n onClick={() => onPageChange?.(0)}\n disabled={pageIndex <= 0}\n >\n «\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.previous ?? previousLabel}\n onClick={() => onPageChange?.(pageIndex - 1)}\n disabled={pageIndex <= 0}\n >\n ‹\n </Button>\n {pageWindow(pageIndex, pageCount).map((p, i) =>\n p === null ? (\n <span key={`gap${i}`} className=\"text-muted-foreground px-1 text-sm\">\n …\n </span>\n ) : (\n <Button\n key={p}\n variant={p === pageIndex ? \"default\" : \"outline\"}\n size=\"sm\"\n aria-current={p === pageIndex ? \"page\" : undefined}\n onClick={() => onPageChange?.(p)}\n >\n {p + 1}\n </Button>\n ),\n )}\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.next ?? nextLabel}\n onClick={() => onPageChange?.(pageIndex + 1)}\n disabled={pageIndex >= pageCount - 1}\n >\n ›\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.last ?? \"Last page\"}\n onClick={() => onPageChange?.(pageCount - 1)}\n disabled={pageIndex >= pageCount - 1}\n >\n »\n </Button>\n </div>\n </div>\n ) : null}\n {!infinite && !served && table.getPageCount() > 1 ? (\n <div className=\"flex items-center justify-end gap-2 py-4\">\n <Button variant=\"outline\" size=\"sm\" onClick={() => table.previousPage()} disabled={!table.getCanPreviousPage()}>\n {previousLabel}\n </Button>\n <Button variant=\"outline\" size=\"sm\" onClick={() => table.nextPage()} disabled={!table.getCanNextPage()}>\n {nextLabel}\n </Button>\n </div>\n ) : null}\n </div>\n )\n}\n"]}
1	+ {"version":3,"sources":["../../src/data-table/filter-rows.ts","../../src/data-table/filter-bar.tsx","../../src/data-table/use-pager.ts","../../src/data-table/index.tsx"],"names":["useState","jsx","TableHead","TableHeader","useCallback","jsxs","TableCell","TableRow","TableBody","useRef","useEffect","SearchIcon","RefreshCwIcon"],"mappings":"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","file":"index.js","sourcesContent":["/*\n Case-insensitive search over chosen fields, for a list the server does NOT page.\n \n Honest only there: when the fetch is the whole answer, filtering here searches everything\n * the reader could have seen. On a server-paged list the same code searches one page and then\n * reports \"no results\" about rows it never had - which is why those lists send the query to\n * the server instead.\n \n Takes a field selector rather than key names so a derived value (a joined label, a formatted\n * code) is searchable too - on the tables this exists for, the derived column is usually the\n * one people type into the box.\n /\nexport function filterRows<T>(\n rows: T[],\n q: string,\n fields: (r: T) => (string \| undefined \| null)[],\n): T[] {\n const needle = q.trim().toLowerCase()\n if (!needle) return rows\n return rows.filter(r => fields(r).some(v => v?.toLowerCase().includes(needle)))\n}\n","\"use client\"\n\nimport { RefreshCwIcon, SearchIcon } from \"lucide-react\"\nimport type { ReactNode } from \"react\"\nimport { useEffect, useRef, useState } from \"react\"\nimport { Button } from \"~/ui/primitives/button.js\"\nimport { Input } from \"~/ui/primitives/input.js\"\nimport { cn } from \"~/utils/cn.js\"\n\n/\n The row above a table: narrowing on the left, actions on the right.\n \n This REPLACES `DataTable`'s own bar (`searchable` + `toolbar` + `onReload`) rather than\n * sitting beside it. Two bars on one table is how a screen ends up with two search boxes that\n * search different things, and `searchable` in particular must stay off on a server-paged\n * table: it filters the rows already in the browser, so it answers \"no results\" about a row\n * that is on page three.\n /\nexport function TableFilterBar({\n children,\n actions,\n className,\n}: {\n children?: ReactNode\n actions?: ReactNode\n className?: string\n}) {\n return (\n <div className={cn(\"flex flex-wrap items-center gap-2\", className)}>\n {children}\n {actions ? <div className=\"ml-auto flex items-center gap-2\">{actions}</div> : null}\n </div>\n )\n}\n\n/\n A search box that reports the settled value, debounced here so no call site has to remember.\n \n 300ms, because on a server-paged list every keystroke is both a round trip and a new query\n * key - and a new query key throws away the page already loaded.\n /\nexport function TableSearch({\n onChange,\n placeholder = \"Search…\",\n className,\n icon = true,\n}: {\n /* Called with the trimmed value once typing settles. /\n onChange: (q: string) => void\n placeholder?: string\n className?: string\n /* Set false where the surrounding bar already says what the box is for. /\n icon?: boolean\n}) {\n const [text, setText] = useState(\"\")\n // Held in a ref, written from an effect: a caller passing an inline arrow would otherwise\n // restart the timer on every render, so the request would only fire once the user stopped\n // typing AND the parent stopped re-rendering.\n const sink = useRef(onChange)\n useEffect(() => {\n sink.current = onChange\n }, [onChange])\n useEffect(() => {\n const id = setTimeout(() => sink.current(text.trim()), 300)\n return () => clearTimeout(id)\n }, [text])\n\n return (\n <div className={cn(\"relative w-full max-w-xs\", className)}>\n {icon ? (\n <SearchIcon className=\"text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2\" />\n ) : null}\n <Input\n value={text}\n onChange={e => setText(e.target.value)}\n placeholder={placeholder}\n className={icon ? \"pl-8\" : undefined}\n />\n </div>\n )\n}\n\n/* Refetch, spinning while it does. Belongs in the filter bar, not in DataTable's own bar. /\nexport function TableReload({\n onClick,\n loading,\n label = \"Reload\",\n}: {\n onClick: () => void\n loading?: boolean\n label?: string\n}) {\n return (\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"icon-sm\"\n onClick={onClick}\n disabled={loading}\n aria-label={label}\n title={label}\n >\n <RefreshCwIcon className={cn(\"size-4\", loading && \"animate-spin\")} />\n </Button>\n )\n}\n","\"use client\";\n\nimport { useCallback, useState } from \"react\";\n\n/\n The state behind `DataTable`'s numbered pager, so a screen configures paging instead of\n * owning it.\n \n Every console that grew a numbered table had written the same twelve lines - page state,\n * size state, the 0-based/1-based conversion, the range string, the back-to-page-1 wrapper -\n * and the copies had already drifted into pagers that behaved slightly differently on screens\n * next to each other. `DataTable` owned the controls; nothing owned the wiring.\n \n Two shapes, because the lists behind these tables are not all the same:\n \n `bind(total)` the SERVER paged it. Feed `page`/`size` into the request and hand back the\n * `total` it answered with.\n * `slice(rows)` the fetch IS the whole answer - a list derived from two endpoints, the\n * result of one operation, a parsed file - so the page is cut here.\n \n `slice` is honest only in that second case. Over a list the server truncated it reports a\n * page count that does not exist, which tells the reader they have seen everything.\n /\n\n/* Sizes offered in the rows-per-page selector. /\nexport const PAGE_SIZE_OPTIONS = [25, 50, 100, 200];\n\n/* Rows per page before anyone chooses. Smaller than a screenful is churn; larger buries the pager. /\nexport const DEFAULT_PAGE_SIZE = 25;\n\n/\n Copy for the pager. lyra ships none of it: `range` also decides number formatting, which is\n * a locale decision the app's i18n already makes.\n /\nexport type PagerLabels = {\n first?: string;\n previous?: string;\n next?: string;\n last?: string;\n size?: string;\n range?: (r: { from: number; to: number; total: number }) => string;\n};\n\n/* The `DataTable` props that make up the numbered pager. Spread them; never spell them out. /\nexport type PagerProps = {\n pageIndex: number;\n pageCount: number;\n onPageChange: (index: number) => void;\n pageSize: number;\n pageSizeOptions: number[];\n onPageSizeChange: (size: number) => void;\n rangeLabel: string;\n pageLabels: {\n first?: string;\n previous?: string;\n next?: string;\n last?: string;\n size?: string;\n };\n};\n\nexport type UsePagerOptions = {\n pageSize?: number;\n pageSizeOptions?: number[];\n labels?: PagerLabels;\n};\n\nexport function usePager(options: UsePagerOptions = {}) {\n const {\n pageSize: initialSize = DEFAULT_PAGE_SIZE,\n pageSizeOptions = PAGE_SIZE_OPTIONS,\n labels,\n } = options;\n const [page, setPage] = useState(1);\n const [size, setSize] = useState(initialSize);\n\n const props = useCallback(\n (total: number): PagerProps => {\n // The REPORTED page is clamped, exactly as `slice` clamps the rows it cuts. A set that\n // shrank under the current page - somebody deleted the last row on page 3, or another\n // operator did - otherwise leaves `pageIndex` past `pageCount`, and then `pageWindow`\n // highlights nothing at all: next and last are disabled, no button is marked current,\n // and the reader has to work out from an empty table that they are off the end.\n //\n // Only when `total > 0`, because a caller whose query has not answered yet passes 0, and\n // clamping then would snap page 3 back to page 1 on every single page change. Pass\n // react-query's `placeholderData: keepPreviousData` and the total stays real across a\n // page change, which is what makes this engage when it should.\n //\n // ⚠️ It clamps what the pager SHOWS, not what the caller requested - the rows for that\n // render are still the (empty) answer for the old page. The reader sees \"page 2 of 2\"\n // and recovers in one click instead of facing a pager that looks broken. Moving the\n // request too needs `total` to reach the hook rather than `bind`, which is an API change\n // and not this fix.\n const pageCount = Math.max(1, Math.ceil(total / size));\n const at = total > 0 ? Math.min(page, pageCount) : page;\n return {\n pageIndex: at - 1,\n pageCount,\n onPageChange: (i) => setPage(i + 1),\n pageSize: size,\n pageSizeOptions,\n // A different size means a different page 1; staying on page 7 of the old size lands\n // past the end of the new one.\n onPageSizeChange: (n) => {\n setSize(n);\n setPage(1);\n },\n rangeLabel:\n total > 0\n ? (labels?.range?.({\n from: (at - 1) size + 1,\n to: Math.min(at * size, total),\n total,\n }) ?? \"\")\n : \"\",\n pageLabels: {\n first: labels?.first,\n previous: labels?.previous,\n next: labels?.next,\n last: labels?.last,\n size: labels?.size,\n },\n };\n },\n [page, size, pageSizeOptions, labels],\n );\n\n /*\n Wrap a filter setter so changing it returns to page 1.\n \n In the HANDLER, not in an effect watching the filter: an effect renders the stale page\n * once and fires a request for it, so narrowing to a department with two people flashes\n * \"no results\" on every keystroke before correcting itself.\n /\n const onFilter = useCallback(\n <T>(apply: (v: T) => void) =>\n (v: T) => {\n apply(v);\n setPage(1);\n },\n [],\n );\n\n return {\n page,\n size,\n setPage,\n onFilter,\n bind: props,\n /* Cut the current page out of a complete list. /\n slice<T>(rows: T[]): { rows: T[]; props: PagerProps } {\n // A list that shrank under a filter can leave `page` past the end, which renders an\n // empty table that reads as \"nothing matched\". The SLICE is clamped, not the state:\n // writing state while rendering is the loop this replaced.\n const last = Math.max(1, Math.ceil(rows.length / size));\n const at = Math.min(page, last);\n return {\n rows: rows.slice((at - 1) size, at * size),\n props: { ...props(rows.length), pageIndex: at - 1 },\n };\n },\n };\n}\n","import type { Cell, Column, ColumnDef, Header, HeaderGroup, Row, SortingState, Table } from \"@tanstack/react-table\"\nimport { flexRender, getCoreRowModel, getFilteredRowModel, getPaginationRowModel, getSortedRowModel, useReactTable } from \"@tanstack/react-table\"\nimport { ArrowDownIcon, ArrowUpIcon, ChevronsUpDownIcon, Loader2Icon, RefreshCwIcon, SearchIcon } from \"lucide-react\"\nimport type { HTMLAttributes, ReactNode } from \"react\"\nimport { createContext, memo, useCallback, useContext, useEffect, useRef, useState } from \"react\"\nimport { Button } from \"~/ui/primitives/button.js\"\nimport { Input } from \"~/ui/primitives/input.js\"\nimport { NativeSelect, NativeSelectOption } from \"~/ui/primitives/native-select.js\"\nimport { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from \"~/ui/primitives/dropdown-menu.js\"\nimport {\n TableBody as TableBodyRaw,\n TableCell as TableCellRaw,\n TableHeader as TableHeaderRaw,\n TableHead as TableHeadRaw,\n Table as TableRaw,\n TableRow as TableRowRaw,\n} from \"~/ui/primitives/table.js\"\nimport { cn } from \"~/utils/cn.js\"\n\nexport type { ColumnDef } from \"@tanstack/react-table\"\n\nexport { filterRows } from \"./filter-rows.js\"\nexport { TableFilterBar, TableReload, TableSearch } from \"./filter-bar.js\"\nexport {\n DEFAULT_PAGE_SIZE,\n PAGE_SIZE_OPTIONS,\n usePager,\n type PagerLabels,\n type PagerProps,\n type UsePagerOptions,\n} from \"./use-pager.js\"\n\n\nexport const TableContext = createContext<{\n data: unknown[]\n columns: ColumnDef<unknown, unknown>[]\n table: Table<unknown> \| null\n}>({\n data: [],\n columns: [],\n table: null,\n})\n\nexport type TableProviderProps<TData, TValue> = {\n columns: ColumnDef<TData, TValue>[]\n data: TData[]\n children: ReactNode\n className?: string\n}\n\nexport function TableProvider<TData, TValue>({ columns, data, children, className }: TableProviderProps<TData, TValue>) {\n const [sorting, setSorting] = useState<SortingState>([])\n const table = useReactTable({\n data,\n columns,\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n // useState's setter is itself a valid TanStack OnChangeFn (it accepts a\n // value or an updater fn), so it can be wired directly — type-safe, no cast.\n onSortingChange: setSorting,\n state: {\n sorting,\n },\n })\n\n return (\n <TableContext.Provider\n value={{\n data,\n columns: columns as never,\n table: table as never,\n }}\n >\n <TableRaw className={className}>{children}</TableRaw>\n </TableContext.Provider>\n )\n}\n\nexport type TableHeadProps = {\n header: Header<unknown, unknown>\n className?: string\n}\n\nexport const TableHead = memo(({ header, className }: TableHeadProps) => (\n <TableHeadRaw className={className} key={header.id}>\n {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHeadRaw>\n))\n\nTableHead.displayName = \"TableHead\"\n\nexport type TableHeaderGroupProps = {\n headerGroup: HeaderGroup<unknown>\n children: (props: { header: Header<unknown, unknown> }) => ReactNode\n}\n\nexport const TableHeaderGroup = ({ headerGroup, children }: TableHeaderGroupProps) => (\n <TableRowRaw key={headerGroup.id}>{headerGroup.headers.map(header => children({ header }))}</TableRowRaw>\n)\n\nexport type TableHeaderProps = {\n className?: string\n children: (props: { headerGroup: HeaderGroup<unknown> }) => ReactNode\n}\n\nexport const TableHeader = ({ className, children }: TableHeaderProps) => {\n const { table } = useContext(TableContext)\n\n return <TableHeaderRaw className={className}>{table?.getHeaderGroups().map(headerGroup => children({ headerGroup }))}</TableHeaderRaw>\n}\n\nexport interface TableColumnHeaderProps<TData, TValue> extends HTMLAttributes<HTMLDivElement> {\n column: Column<TData, TValue>\n title: string\n}\n\nexport function TableColumnHeader<TData, TValue>({ column, title, className }: TableColumnHeaderProps<TData, TValue>) {\n // Extract inline event handlers to prevent unnecessary re-renders\n const handleSortAsc = useCallback(() => {\n column.toggleSorting(false)\n }, [column])\n\n const handleSortDesc = useCallback(() => {\n column.toggleSorting(true)\n }, [column])\n\n if (!column.getCanSort()) {\n return <div className={cn(className)}>{title}</div>\n }\n\n return (\n <div className={cn(\"flex items-center space-x-2\", className)}>\n <DropdownMenu>\n <DropdownMenuTrigger asChild>\n <Button className=\"-ml-3 h-8 data-[state=open]:bg-accent\" size=\"sm\" variant=\"ghost\">\n <span>{title}</span>\n {column.getIsSorted() === \"desc\" ? (\n <ArrowDownIcon className=\"ml-2 h-4 w-4\" />\n ) : column.getIsSorted() === \"asc\" ? (\n <ArrowUpIcon className=\"ml-2 h-4 w-4\" />\n ) : (\n <ChevronsUpDownIcon className=\"ml-2 h-4 w-4\" />\n )}\n </Button>\n </DropdownMenuTrigger>\n <DropdownMenuContent align=\"start\">\n <DropdownMenuItem onClick={handleSortAsc}>\n <ArrowUpIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n Asc\n </DropdownMenuItem>\n <DropdownMenuItem onClick={handleSortDesc}>\n <ArrowDownIcon className=\"mr-2 h-3.5 w-3.5 text-muted-foreground/70\" />\n Desc\n </DropdownMenuItem>\n </DropdownMenuContent>\n </DropdownMenu>\n </div>\n )\n}\n\nexport type TableCellProps = {\n cell: Cell<unknown, unknown>\n className?: string\n}\n\nexport const TableCell = ({ cell, className }: TableCellProps) => (\n <TableCellRaw className={className}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCellRaw>\n)\n\nexport type TableRowProps = {\n row: Row<unknown>\n children: (props: { cell: Cell<unknown, unknown> }) => ReactNode\n className?: string\n}\n\nexport const TableRow = ({ row, children, className }: TableRowProps) => (\n <TableRowRaw className={className} data-state={row.getIsSelected() && \"selected\"} key={row.id}>\n {row.getVisibleCells().map(cell => children({ cell }))}\n </TableRowRaw>\n)\n\nexport type TableBodyProps = {\n children: (props: { row: Row<unknown> }) => ReactNode\n className?: string\n}\n\nexport const TableBody = ({ children, className }: TableBodyProps) => {\n const { columns, table } = useContext(TableContext)\n const rows = table?.getRowModel().rows\n\n return (\n <TableBodyRaw className={className}>\n {rows?.length ? (\n rows.map(row => children({ row }))\n ) : (\n <TableRowRaw>\n <TableCellRaw className=\"h-24 text-center\" colSpan={columns.length}>\n No results.\n </TableCellRaw>\n </TableRowRaw>\n )}\n </TableBodyRaw>\n )\n}\n\n// ---------------------------------------------------------------------------\n// DataTable — a batteries-included, self-contained paginated table. Unlike the\n// composition primitives above (TableProvider + render-prop parts), this is a\n// drop-in: pass `columns` + `data` and get header, body, empty/loading states\n// and Prev/Next pagination. All user-facing labels are props (English\n// defaults) so apps can feed i18n strings; the component itself ships no copy.\n// ---------------------------------------------------------------------------\n\nexport interface DataTableProps<TData, TValue> {\n columns: ColumnDef<TData, TValue>[]\n data: TData[]\n /** Show a single-row loading state instead of the body. /\n loading?: boolean\n /* Row shown when there are no results. /\n emptyText?: string\n /\n What fills the body when there are no results, in place of `emptyText`.\n \n A centred grey line reads the same as a request that failed, and on a table it is the only\n * thing a reader has to tell \"nobody matched your filter\" from \"this screen is broken\". Takes\n * `EmptyState` from `@tradalab/lyra/ui`, or anything else. `emptyText` stays because most tables\n * want one sentence and nothing more.\n /\n empty?: ReactNode\n /* Row shown while `loading`. /\n loadingText?: string\n /* Previous-page button label. /\n previousLabel?: string\n /* Next-page button label. /\n nextLabel?: string\n /* Rows per page (default 10). Pagination controls appear only when needed. /\n pageSize?: number\n /\n Render every row and no pager at all.\n \n For the list whose row count does not grow with tenants or with time - a declared\n * inventory, a fixed catalogue, the handful of providers somebody configured by hand. There\n * the fetch is the whole answer, so a pager is a control nobody needs and a page count is a\n * number nobody asked for. Opt-in rather than the default, because the default (slice by\n * `pageSize`, Prev/Next) is what eleven existing call sites already rely on.\n /\n unpaged?: boolean\n /* Extra classes on the bordered table wrapper. /\n className?: string\n // --- control bar (all optional; the bar renders only when one is set) ---\n /* Show a search box that globally filters rows across all accessor columns. /\n searchable?: boolean\n /* Placeholder for the search box. /\n searchPlaceholder?: string\n /* Show a reload button; called on click. Its icon spins while `loading`. /\n onReload?: () => void\n /* Accessible label / tooltip for the reload button. /\n reloadLabel?: string\n /* Custom controls rendered on the right of the bar (e.g. a \"New\" button). /\n toolbar?: ReactNode\n // --- infinite scroll (opt-in; providing `onLoadMore` switches the table from\n // Prev/Next pagination to rendering every accumulated row and requesting more\n // as a bottom sentinel scrolls into view). Data fetching stays with the caller\n // (e.g. react-query useInfiniteQuery); the table only owns the sentinel. ---\n /* Called when the bottom sentinel becomes visible and more rows can load. /\n onLoadMore?: () => void\n /* Whether another page is available; the sentinel is ignored once false. /\n hasMore?: boolean\n /* True while the next page is loading — shows a spinner row and de-dupes calls. /\n loadingMore?: boolean\n /* Label beside the bottom spinner. /\n loadingMoreText?: string\n // --- server-driven pages (opt-in; providing `onPageChange` switches the table from\n // slicing rows itself to showing exactly the page it was handed, plus a numbered pager).\n //\n // For the screens that get AUDITED rather than skimmed: a timesheet, a punch log at year\n // end. Infinite scroll cannot say \"page 3 of 47\", cannot be sent to a colleague, and cannot\n // reach the end of a long list without dragging through all of it.\n //\n // `onLoadMore` wins if both are given - a table with two pagers is a bug that ships. ---\n /* Zero-based index of the page being shown. /\n pageIndex?: number\n /* How many pages exist. The table cannot work this out: only the server knows the total. /\n pageCount?: number\n /* Called with a zero-based page index. /\n onPageChange?: (index: number) => void\n /* Sizes offered in the selector. Omit to leave the size fixed and hide the control. /\n pageSizeOptions?: number[]\n /* Called with the chosen size. The caller is expected to return to page 1. /\n onPageSizeChange?: (size: number) => void\n /* Free text beside the pager, e.g. \"1-50 of 4,231\". lyra ships no copy and no number\n * formatting, so the caller builds it. /\n rangeLabel?: ReactNode\n /* Accessible labels for the pager buttons. /\n pageLabels?: { first?: string; previous?: string; next?: string; last?: string; size?: string }\n}\n\n/\n Which page numbers to show: always the first, the last, and a couple either side of the\n * current one, with `null` where a gap is elided.\n \n A pager that renders every page is unusable at forty pages and absurd at four hundred, and\n * one that renders only prev/next hides how long the list is - which is the question the\n * reader opened it with.\n */\nexport function pageWindow(index: number, count: number, radius = 1): (number \| null)[] {\n if (count <= 0) return []\n const want = new Set<number>([0, count - 1])\n for (let p = index - radius; p <= index + radius; p++) {\n if (p >= 0 && p < count) want.add(p)\n }\n const sorted = [...want].sort((a, b) => a - b)\n const out: (number \| null)[] = []\n let prev = -1\n for (const p of sorted) {\n // A single skipped page is rendered rather than elided: \"1 … 3\" is longer than \"1 2 3\"\n // and tells the reader less.\n if (prev >= 0 && p - prev === 2) out.push(p - 1)\n else if (prev >= 0 && p - prev > 2) out.push(null)\n out.push(p)\n prev = p\n }\n return out\n}\n\nexport function DataTable<TData, TValue>({\n columns,\n data,\n loading,\n emptyText = \"No results.\",\n empty,\n loadingText = \"Loading…\",\n previousLabel = \"Previous\",\n nextLabel = \"Next\",\n pageSize = 10,\n unpaged,\n className,\n searchable,\n searchPlaceholder = \"Search…\",\n onReload,\n reloadLabel = \"Reload\",\n toolbar,\n onLoadMore,\n hasMore,\n loadingMore,\n loadingMoreText = \"Loading more…\",\n pageIndex = 0,\n pageCount = 0,\n onPageChange,\n pageSizeOptions,\n onPageSizeChange,\n rangeLabel,\n pageLabels,\n}: DataTableProps<TData, TValue>) {\n const [globalFilter, setGlobalFilter] = useState(\"\")\n const infinite = Boolean(onLoadMore)\n // Server pages: the rows handed in ARE the page, so the table must not slice them again.\n const served = !infinite && Boolean(onPageChange)\n // Same for `unpaged`, for the opposite reason: there is only ever one page.\n const sliced = !infinite && !served && !unpaged\n const table = useReactTable({\n data,\n columns,\n state: { globalFilter },\n onGlobalFilterChange: setGlobalFilter,\n getCoreRowModel: getCoreRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n // Only the default finite table slices rows itself. The other three modes each hand the\n // table exactly what to render: infinite every accumulated row, served the one page the\n // server answered with, unpaged the whole list.\n ...(sliced\n ? { getPaginationRowModel: getPaginationRowModel(), initialState: { pagination: { pageSize } } }\n : {}),\n })\n\n const rows = table.getRowModel().rows\n const showBar = Boolean(searchable \|\| onReload \|\| toolbar)\n\n // --- infinite scroll: observe a bottom sentinel and ask the caller for more.\n // Latest callback/flags are kept in refs so the observer subscribes once. ---\n const sentinelRef = useRef<HTMLDivElement \| null>(null)\n const onLoadMoreRef = useRef(onLoadMore)\n onLoadMoreRef.current = onLoadMore\n const flags = useRef({ hasMore, loadingMore })\n flags.current = { hasMore, loadingMore }\n const intersecting = useRef(false)\n\n const maybeLoadMore = useCallback(() => {\n if (intersecting.current && flags.current.hasMore && !flags.current.loadingMore) {\n onLoadMoreRef.current?.()\n }\n }, [])\n\n useEffect(() => {\n if (!infinite) return\n const el = sentinelRef.current\n if (!el) return\n const io = new IntersectionObserver(\n entries => {\n intersecting.current = entries[0]?.isIntersecting ?? false\n maybeLoadMore()\n },\n { rootMargin: \"200px\" },\n )\n io.observe(el)\n return () => {\n io.disconnect()\n }\n }, [infinite, maybeLoadMore])\n\n // A freshly loaded page can leave the sentinel still on-screen; the observer\n // won't re-fire on its own, so re-check whenever the rows or flags change.\n useEffect(() => {\n if (infinite) maybeLoadMore()\n }, [infinite, rows.length, loadingMore, hasMore, maybeLoadMore])\n\n return (\n <div>\n {showBar ? (\n <div className=\"flex items-center gap-2 pb-4\">\n {searchable ? (\n <div className=\"relative w-full max-w-xs\">\n <SearchIcon className=\"text-muted-foreground pointer-events-none absolute top-1/2 left-2.5 size-4 -translate-y-1/2\" />\n <Input\n value={globalFilter}\n onChange={e => table.setGlobalFilter(e.target.value)}\n placeholder={searchPlaceholder}\n className=\"pl-8\"\n />\n </div>\n ) : null}\n {onReload \|\| toolbar ? (\n <div className=\"ml-auto flex items-center gap-2\">\n {toolbar}\n {onReload ? (\n <Button\n type=\"button\"\n variant=\"outline\"\n size=\"icon-sm\"\n onClick={onReload}\n disabled={loading}\n aria-label={reloadLabel}\n title={reloadLabel}\n >\n <RefreshCwIcon className={cn(\"size-4\", loading && \"animate-spin\")} />\n </Button>\n ) : null}\n </div>\n ) : null}\n </div>\n ) : null}\n <div className={cn(\"overflow-hidden border\", className)}>\n <TableRaw>\n <TableHeaderRaw>\n {table.getHeaderGroups().map(hg => (\n <TableRowRaw key={hg.id}>\n {hg.headers.map(header => (\n <TableHeadRaw key={header.id}>\n {header.isPlaceholder ? null : flexRender(header.column.columnDef.header, header.getContext())}\n </TableHeadRaw>\n ))}\n </TableRowRaw>\n ))}\n </TableHeaderRaw>\n <TableBodyRaw>\n {loading && rows.length === 0 ? (\n // Only replace the body with a loading row on the FIRST load; on a\n // refetch keep the (stale) rows visible while the reload icon spins.\n <TableRowRaw>\n <TableCellRaw className=\"h-24 text-center\" colSpan={columns.length}>\n {loadingText}\n </TableCellRaw>\n </TableRowRaw>\n ) : rows.length ? (\n rows.map(row => (\n <TableRowRaw key={row.id} data-state={row.getIsSelected() && \"selected\"}>\n {row.getVisibleCells().map(cell => (\n <TableCellRaw key={cell.id}>{flexRender(cell.column.columnDef.cell, cell.getContext())}</TableCellRaw>\n ))}\n </TableRowRaw>\n ))\n ) : (\n // An empty state is not a record, so the row drops the `hover:bg-muted/50` every\n // other row carries: lighting up under the pointer offers an interaction that is not\n // there, and it gets louder the taller the cell grows.\n <TableRowRaw className=\"hover:bg-transparent\">\n <TableCellRaw\n className={empty ? \"p-0\" : \"text-muted-foreground h-24 text-center\"}\n colSpan={columns.length}\n >\n {empty ?? emptyText}\n </TableCellRaw>\n </TableRowRaw>\n )}\n </TableBodyRaw>\n </TableRaw>\n {infinite && loadingMore ? (\n <div className=\"text-muted-foreground flex items-center justify-center gap-2 py-3 text-sm\">\n <Loader2Icon className=\"size-4 animate-spin\" />\n {loadingMoreText}\n </div>\n ) : null}\n {infinite ? <div ref={sentinelRef} aria-hidden className=\"h-px w-full\" /> : null}\n </div>\n {served ? (\n <div className=\"flex flex-wrap items-center justify-between gap-3 py-4\">\n <div className=\"text-muted-foreground flex items-center gap-3 text-sm\">\n {rangeLabel}\n {pageSizeOptions && pageSizeOptions.length > 0 ? (\n <NativeSelect\n aria-label={pageLabels?.size ?? \"Rows per page\"}\n className=\"h-8 w-auto\"\n value={String(pageSize)}\n onChange={e => onPageSizeChange?.(Number(e.target.value))}\n >\n {pageSizeOptions.map(n => (\n <NativeSelectOption key={n} value={String(n)}>\n {n}\n </NativeSelectOption>\n ))}\n </NativeSelect>\n ) : null}\n </div>\n <div className=\"flex items-center gap-1\">\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.first ?? \"First page\"}\n onClick={() => onPageChange?.(0)}\n disabled={pageIndex <= 0}\n >\n «\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.previous ?? previousLabel}\n onClick={() => onPageChange?.(pageIndex - 1)}\n disabled={pageIndex <= 0}\n >\n ‹\n </Button>\n {pageWindow(pageIndex, pageCount).map((p, i) =>\n p === null ? (\n <span key={`gap${i}`} className=\"text-muted-foreground px-1 text-sm\">\n …\n </span>\n ) : (\n <Button\n key={p}\n variant={p === pageIndex ? \"default\" : \"outline\"}\n size=\"sm\"\n aria-current={p === pageIndex ? \"page\" : undefined}\n onClick={() => onPageChange?.(p)}\n >\n {p + 1}\n </Button>\n ),\n )}\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.next ?? nextLabel}\n onClick={() => onPageChange?.(pageIndex + 1)}\n disabled={pageIndex >= pageCount - 1}\n >\n ›\n </Button>\n <Button\n variant=\"outline\"\n size=\"sm\"\n aria-label={pageLabels?.last ?? \"Last page\"}\n onClick={() => onPageChange?.(pageCount - 1)}\n disabled={pageIndex >= pageCount - 1}\n >\n »\n </Button>\n </div>\n </div>\n ) : null}\n {sliced && table.getPageCount() > 1 ? (\n <div className=\"flex items-center justify-end gap-2 py-4\">\n <Button variant=\"outline\" size=\"sm\" onClick={() => table.previousPage()} disabled={!table.getCanPreviousPage()}>\n {previousLabel}\n </Button>\n <Button variant=\"outline\" size=\"sm\" onClick={() => table.nextPage()} disabled={!table.getCanNextPage()}>\n {nextLabel}\n </Button>\n </div>\n ) : null}\n </div>\n )\n}\n"]}

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@tradalab/lyra",
-  "version": "3.7.0",
-  "description": "Tradalab UI kit — shadcn (radix-lyra) primitives, composed components, and app shell for React 19 / Next 16 / Tailwind v4.",
+  "version": "3.8.1",
+  "description": "Tradalab UI kit - shadcn (radix-lyra) primitives, composed components, and app shell for React 19 / Next 16 / Tailwind v4.",
   "license": "UNLICENSED",
   "private": false,
   "type": "module",