@sincpro/web-ui 1.4.0 → 1.6.0

package/dist/primitives/table/EditableTable.d.ts

@@ -1,5 +1,6 @@
 import { type Grouping } from "../../foundations/grouping.js";
 import { type FlagProps } from "../notice/Flag.js";
+import { type WindowedRow } from "./rowWindow.js";
 import { type ReactNode } from "react";
 /** Where a column goes when the row is drawn as a stacked card (a narrow box).
  *  `trail` sits at the top right, beside the title — a state, the row's buttons. */
@@ -46,6 +47,37 @@ export type EditBands<T> = {
      *  column does not add up. The lines are the ones under it until the next section. */
     total?: (column: EditColumn<T>, lines: readonly T[]) => ReactNode | null;
 };
+/** A warning drawn as a `Flag`: on a row (`flag`) or on one cell (`EditCellState.flag`). */
+export type EditFlag = Omit<FlagProps, "children"> & {
+    detail?: ReactNode;
+    owner?: string;
+};
+/**
+ * What ONE cell of one row is right now — said by whoever knows the record: the states the
+ * backend sends per line and field. Every key left out keeps the column as declared.
+ *
+ * Context: a column declares what it is for every row (`edit`), but an ERP line decides
+ * per row — a delivered line keeps its quantity, a service line has no lot, a discount is
+ * required only past a threshold. The table does not know why; it is told, cell by cell.
+ */
+export type EditCellState = {
+    /** Not written in on this row: the cell reads while the row is edited. */
+    readonly?: boolean;
+    /** Has to have a value: marked while the row is edited, and said to its control. */
+    required?: boolean;
+    /** Not there on this row (Odoo's per-row `invisible`): the cell is drawn empty. */
+    hidden?: boolean;
+    /** What is wrong with this value, said as what to put — under the value, with an icon,
+     *  and the control is `aria-invalid` and described by it. `null` when nothing is. */
+    error?: string | null;
+    /** A warning about THIS value — «precio bajo el costo» on the price, not on the line. */
+    flag?: EditFlag | null;
+};
+/** What a whole row is right now. A row that should not be seen is not passed at all. */
+export type EditRowState = {
+    /** Read, not written: walked with the arrows, never opened to edit. */
+    readonly?: boolean;
+};
 /** One more way to add, beside «add a line»: a section, a note. */
 export type EditAdd = {
     label: string;
@@ -97,7 +129,7 @@ export type RowKey = "ArrowDown" | "ArrowUp" | "Home" | "End";
  * of a new record in `DataTable`: one keyboard model, three shapes. Exported for that
  * family sibling only; it is not in the barrel.
  */
-export declare function EditRow({ as, rowId, rowRef, editable, editing, tabbable, className, onStart, onCommit, onCancel, onMove, onFocusRow, onTabOut, children, }: {
+export declare function EditRow({ as, rowId, rowRef, editable, editing, tabbable, className, onStart, onCommit, onCancel, onMove, onFocusRow, onTabOut, windowed, children, }: {
     as: "tr" | "li";
     rowId: string;
     rowRef: (node: HTMLElement | null) => void;
@@ -113,6 +145,9 @@ export declare function EditRow({ as, rowId, rowRef, editable, editing, tabbable
     /** `Tab` left the row by one of its edges. `true` = the table took it (opened another
      *  row, added one); `false` = the browser moves the focus as usual. */
     onTabOut: (direction: "next" | "prev") => boolean;
+    /** Past a few hundred rows the table draws only the ones in view (`rowWindow`): this row's
+     *  measure, its index, and the focus that keeps it drawn. */
+    windowed?: WindowedRow | undefined;
     children: ReactNode;
 }): import("react").JSX.Element;
 /**
@@ -135,15 +170,19 @@ totals, empty, grouping,
 /** El total de una columna DENTRO de un montón, ya formateado. Lo calcula quien
  *  compone, por el mismo motivo que `totals`: sumar significa cosas distintas
  *  según el dominio, y un porcentaje se promedia, no se suma. */
-groupTotal, height, layout, onOpen, onDiscard, bands, adds, flag, onReorder, }: {
+groupTotal, height, layout, onOpen, onDiscard, bands, adds, flag, onReorder, cellState, rowState, }: {
     rows: readonly T[];
     columns: readonly EditColumn<T>[];
+    /** The row's key on this screen, stable for as long as the row is drawn — a local key for
+     *  a row the backend has not made yet, kept after it is saved. A key that changes is a new
+     *  row to React: the row being written is unmounted and loses the focus. */
     getRowId: (row: T) => string;
     onChange?: (id: string, next: T) => void;
     onRemove?: (id: string) => void;
     /** «Add a line». Return the new row's id —or a promise of it, when the backend makes
      *  the record— and the table opens that row with the focus on its first control.
-     *  Return nothing and the row just appears, closed. */
+     *  Return nothing and the row just appears, closed. The id is the row's KEY (`getRowId`):
+     *  give a line the backend has not made a local one, and keep it after the save. */
     onAdd?: () => string | void | Promise<string | void>;
     addLabel?: string;
     totals?: readonly (ReactNode | null)[];
@@ -184,10 +223,13 @@ groupTotal, height, layout, onOpen, onDiscard, bands, adds, flag, onReorder, }:
      *  `null` for the rows with nothing to say, which should be most of them. `owner` is what
      *  the record's activity says it belongs to («Línea 3 · Impresora…»); without it, the
      *  row's first value. */
-    flag?: (row: T) => (Omit<FlagProps, "children"> & {
-        detail?: ReactNode;
-        owner?: string;
-    }) | null;
+    flag?: (row: T) => EditFlag | null;
+    /** What each cell is on each row — readonly, required, hidden, its error, its warning —
+     *  as the backend says it per line. `null` keeps the column as declared. See
+     *  `EditCellState`. */
+    cellState?: (row: T, columnId: string) => EditCellState | null;
+    /** What a whole row is: `readonly` is read, not opened. See `EditRowState`. */
+    rowState?: (row: T) => EditRowState | null;
     /** The rows have an order of their own — the lines of an order, Odoo's `sequence` — and it
      *  is changed by dragging the grip at the start of a row, or with Alt + ↑ / ↓ on it. `before`
      *  is the row it lands in front of; `null`, the end. Off while grouped (the piles decide the