JSVision

Appearance

@jsvision/datagrid / EditableGridRows

Class: EditableGridRows<T> ​

Documented in: Data Grid

Defined in: datagrid/src/editable-grid-rows.ts:246

The editable grid body — a GridRows with a two-axis cell cursor and a focused-cell overpaint.

Example ​

ts
import { at, Group, createEventLoop, resolveCapabilities, signal } from '@jsvision/ui';
import { EditableGridRows, column } from '@jsvision/datagrid';

interface Row { name: string; city: string; }
const rows: Row[] = [{ name: 'Ada', city: 'NYC' }, { name: 'Bo', city: 'LA' }];
const focusedCol = signal(0);
const overlay = new Group();
const body = at(
  new EditableGridRows<Row>({
    display: () => rows,
    columns: [
      { title: 'Name', accessor: (r) => r.name, width: 8 },
      { title: 'City', accessor: (r) => r.city, width: 8 },
    ],
    // The typed columns parallel the engine `columns` above — they carry the `value` accessor the
    // cursor/editing lifecycle reads (parse/set are omitted here, so both columns are read-only).
    typedColumns: [
      column({ id: 'name', title: 'Name', value: (r: Row) => r.name }),
      column({ id: 'city', title: 'City', value: (r: Row) => r.city }),
    ],
    autoWidths: () => [null, null],
    indent: signal(0),
    focused: signal(0),
    selected: signal(-1),
    zebra: false,
    focusedCol,
    overlay,
    rowKey: (r) => r.name,
    bumpVersion: () => {},
  }),
  0,
  0,
  20,
  5,
);
const root = new Group();
root.add(body);
const caps = resolveCapabilities().profile;
const loop = createEventLoop({ width: 20, height: 5 }, { caps });
loop.mount(root);
loop.focusView(body); // → moves the cell cursor with the arrow keys

Extends ​

  • GridRows<T>

Type Parameters ​

T ​

T

Constructors ​

Constructor ​

new EditableGridRows<T>(cfg): EditableGridRows<T>

Defined in: datagrid/src/editable-grid-rows.ts:325

Parameters ​

cfg ​

EditableGridRowsConfig<T>

The base grid config plus the injected cursor + editing wiring (see EditableGridRowsConfig).

Returns ​

EditableGridRows<T>

Overrides ​

GridRows<T>.constructor

Properties ​

autoWidths ​

protected readonly autoWidths: () => (number | null)[]

Defined in: ui/dist/table/grid-rows.d.ts:72

Returns ​

(number | null)[]

Inherited from ​

GridRows.autoWidths

beforeSave? ​

protected readonly optional beforeSave?: BeforeSave<T>

Defined in: datagrid/src/editable-grid-rows.ts:258

The optional per-cell gate above onCommit.

bounds ​

bounds: Rect

Defined in: ui/dist/view/view.d.ts:61

Parent-relative integer rect; written by the layout pass — read it in draw/hit-testing.

Inherited from ​

GridRows.bounds

bumpVersion ​

protected readonly bumpVersion: () => void

Defined in: datagrid/src/editable-grid-rows.ts:262

Bump-on-write repaint hook (the container owns the version signal).

Returns ​

void

castsShadow ​

castsShadow: boolean

Defined in: ui/dist/view/view.d.ts:91

When true, the renderer paints a drop shadow on the cells just below and to the right of this view, in paint order (a later sibling's shadow falls over an earlier one). Default false. The Desktop sets it per window.

Inherited from ​

GridRows.castsShadow

centered ​

centered: boolean

Defined in: ui/dist/view/view.d.ts:98

When true, the layout pass recentres this view within its parent after layout — origin = (parent - self) / 2 on both axes. Intended for absolutely-placed views (a modal dialog, a message box) whose size is fixed and whose origin would otherwise be placed by the caller. Default false; Dialog sets it when centered.

Inherited from ​

GridRows.centered

columnCount ​

readonly columnCount: number

Defined in: datagrid/src/editable-grid-rows.ts:290

This panel's own column count (the length of its column slice).

columnOffset ​

readonly columnOffset: number

Defined in: datagrid/src/editable-grid-rows.ts:288

This panel's start index in the global column order (0 for a single body).

columns ​

protected readonly columns: Column<T>[]

Defined in: ui/dist/table/grid-rows.d.ts:71

Inherited from ​

GridRows.columns

command? ​

protected readonly optional command?: string

Defined in: ui/dist/table/grid-rows.d.ts:78

Inherited from ​

GridRows.command

controller ​

protected readonly controller: EditController

Defined in: datagrid/src/editable-grid-rows.ts:320

The in-cell editing lifecycle controller.

dirty? ​

protected readonly optional dirty?: DirtyRegistry

Defined in: datagrid/src/editable-grid-rows.ts:264

The shared dirty registry (pending-commit markers), or undefined when dirty tracking is off.

display ​

protected readonly display: () => T[]

Defined in: ui/dist/table/grid-rows.d.ts:70

Returns ​

T[]

Inherited from ​

GridRows.display

errors? ​

protected readonly optional errors?: ErrorRegistry

Defined in: datagrid/src/editable-grid-rows.ts:266

The shared invalid-cell registry (the gridInvalid band), or undefined when surfacing is off.

focusable ​

focusable: boolean

Defined in: ui/dist/table/grid-rows.d.ts:69

Whether this view can receive keyboard focus. Effective focusability also requires the view to be visible and enabled with no hidden/disabled ancestor. Default false; the focus manager drives the state.focused flag.

Inherited from ​

GridRows.focusable

focused ​

protected readonly focused: Signal<number>

Defined in: ui/dist/table/grid-rows.d.ts:74

Inherited from ​

GridRows.focused

focusedCol ​

protected readonly focusedCol: Signal<number>

Defined in: datagrid/src/editable-grid-rows.ts:248

The shared column cursor index (the row axis is the base's inherited focused).

grabsFocus ​

grabsFocus: boolean

Defined in: ui/dist/view/view.d.ts:113

Whether a mouse-down that hits this view moves keyboard focus to it. Default true — the usual click-to-focus. Set false for a control that should act on a click without stealing focus from whatever is focused (e.g. a dialog Cancel button, or a toolbar/stepper button): the click still dispatches, but the previously-focused view keeps focus, so it never fires a focus-leave side effect such as a field's blur-validation. Independent of focusable — a grabsFocus: false view can still be reached by Tab and activated by Space.

Inherited from ​

GridRows.grabsFocus

hbar? ​

optional hbar?: ScrollBar

Defined in: ui/dist/table/grid-rows.d.ts:84

The owned horizontal scroll bar (its value is the shared indent); its range is re-limited each draw.

Inherited from ​

GridRows.hbar

indent ​

protected readonly indent: Signal<number>

Defined in: ui/dist/table/grid-rows.d.ts:73

Inherited from ​

GridRows.indent

keymap ​

protected readonly keymap: GridKeymap

Defined in: datagrid/src/editable-grid-rows.ts:250

The merged chord→action keymap this body resolves keys against (defaults to the default table).

layout ​

readonly layout: Readonly<LayoutProps>

Defined in: ui/dist/view/view.d.ts:83

Layout props for this view (direction, size, padding, absolute placement, …) — read-only.

Change them with setLayout, which is the only writer. The field and every prop on it are closed, so neither view.layout = {…} nor view.layout.rect = {…} compiles, and neither does editing a solved rect a field at a time (view.layout.rect.x = 5). That is deliberate: a wholesale assignment silently drops every prop it omits and never reflows, and an in-place prop write reflows only if you remember to ask.

Read it freely — this is where a view's solved intent lives, and layout.rect is how an absolutely-placed view reports where it was put.

Inherited from ​

GridRows.layout

onCommit? ​

protected readonly optional onCommit?: OnCommit<T>

Defined in: datagrid/src/editable-grid-rows.ts:256

The optional per-cell veto sink.

onSelect? ​

protected readonly optional onSelect?: (index, row) => void

Defined in: ui/dist/table/grid-rows.d.ts:77

Parameters ​

index ​

number

row ​

T

Returns ​

void

Inherited from ​

GridRows.onSelect

overlay ​

protected readonly overlay: Group

Defined in: datagrid/src/editable-grid-rows.ts:254

The absolute overlay group the editor mounts into.

postProcess ​

postProcess: boolean

Defined in: ui/dist/view/view.d.ts:117

Take part in the post-process sweep (after the focused view sees the event).

Inherited from ​

GridRows.postProcess

preProcess ​

preProcess: boolean

Defined in: ui/dist/view/view.d.ts:115

Take part in the pre-process sweep (root→down, before the focused view sees the event).

Inherited from ​

GridRows.preProcess

rowKey ​

protected readonly rowKey: (row) => string | number

Defined in: datagrid/src/editable-grid-rows.ts:260

The row-identity function.

Parameters ​

row ​

T

Returns ​

string | number

selected ​

protected readonly selected: Signal<number>

Defined in: ui/dist/table/grid-rows.d.ts:75

Inherited from ​

GridRows.selected

selectedKeys ​

protected readonly selectedKeys: Signal<ReadonlySet<Key>>

Defined in: datagrid/src/editable-grid-rows.ts:282

The datagrid selection set the body paints from (empty when the container wires no selection).

state ​

readonly state: ViewState

Defined in: ui/dist/view/view.d.ts:70

Draw-against flags. The object reference is fixed; individual fields mutate (e.g. focused).

Writing visible or disabled changes only what the next paint would draw — it does not ask for that paint. Follow such a write with invalidate (or invalidateLayout, which a visibility flip needs, since layout omits hidden views). A development build warns when a write goes unaccounted for.

Inherited from ​

GridRows.state

topItem ​

protected topItem: number

Defined in: ui/dist/table/grid-rows.d.ts:80

The display index of the first visible row.

Inherited from ​

GridRows.topItem

typedColumns ​

protected readonly typedColumns: GridColumn<T, unknown>[]

Defined in: datagrid/src/editable-grid-rows.ts:252

The typed columns (parse/set/format), parallel to the base engine columns.

vbar? ​

optional vbar?: ScrollBar

Defined in: ui/dist/table/grid-rows.d.ts:82

The owned vertical scroll bar (its value is the shared focused); its range is re-limited each draw.

Inherited from ​

GridRows.vbar

zebra ​

protected readonly zebra: boolean

Defined in: ui/dist/table/grid-rows.d.ts:76

Inherited from ​

GridRows.zebra

Methods ​

accelerators() ​

accelerators(): readonly string[]

Defined in: ui/dist/view/view.d.ts:131

The Alt+hotkey accelerator characters (lowercase) this view claims in its focus scope, for duplicate-accelerator detection. The base returns none; accelerator-bearing widgets (Button/Label/CheckGroup/RadioGroup) override it to report their ~X~ hotkey(s).

Returns ​

readonly string[]

The claimed accelerator chars, or an empty list when the view claims none.

Inherited from ​

GridRows.accelerators

activate() ​

protected activate(ev): void

Defined in: ui/dist/table/grid-rows.d.ts:121

Activate the focused row: select it, call onSelect, emit command (Enter/Space).

Parameters ​

ev ​

DispatchEvent

Returns ​

void

Inherited from ​

GridRows.activate

bind() ​

bind<T>(reader, apply?, opts?): void

Defined in: ui/dist/view/view.d.ts:277

Bind a reactive value to a redraw. Creates an effect (owned by this view's scope) that reads reader() — subscribing to whatever signals it touches — runs the optional apply(value), then requests a frame: a repaint by default, or a reflow when { relayout: true }. It re-runs automatically whenever those signals change, and is disposed when the view unmounts.

Call it from onMount, not the constructor — the view's scope only exists once mounted, so a pre-mount bind throws rather than silently dropping the binding.

Type Parameters ​

T ​

T

Parameters ​

reader ​

() => T

Reads the reactive source; the signals it reads become dependencies.

apply? ​

(v) => void

Optional: apply the read value to the widget (e.g. store it in a field).

opts? ​

Pass { relayout: true } when the change affects layout, so it reflows instead of just repainting.

relayout? ​

boolean

Returns ​

void

Example ​

ts
import { View, signal, type DrawContext } from '@jsvision/ui';

const count = signal(0);

class StatusLine extends View {
  draw(ctx: DrawContext): void {
    ctx.text(0, 0, `${count()} pending`, ctx.color('statusBar'));
  }
}

const status = new StatusLine();
// In onMount, not the constructor: bind() needs the view's scope, which only exists once mounted.
status.onMount(() => {
  status.bind(() => count()); // repaint the status line whenever `count` changes
});

Inherited from ​

GridRows.bind

clampFocusedToRange() ​

protected clampFocusedToRange(): void

Defined in: ui/dist/table/grid-rows.d.ts:96

Clamp the focused signal into the current range after the row set changes.

Returns ​

void

Inherited from ​

GridRows.clampFocusedToRange

commitEdit() ​

commitEdit(): Promise<boolean>

Defined in: datagrid/src/editable-grid-rows.ts:427

Commit an open editor without advancing the cursor or refocusing (the Tab command path has no event envelope). Resolves whether the value committed; the caller advances by cell and restores focus.

Returns ​

Promise<boolean>

derived() ​

protected derived<T>(fn): () => T

Defined in: ui/dist/view/view.d.ts:299

Create a stable derived accessor owned by this view's scope. The returned () => T keeps the same identity for the life of the view, so it is safe to build in the constructor and hand to child views before this view mounts. The backing computed is created lazily under the view's own scope, so it is always owned and disposed at unmount — unlike a bare computed() in the constructor, which would run before any scope exists, leak, and warn.

Reads behave sensibly across the lifecycle:

  • Before mount: evaluates fn() directly (correct current value, nothing persisted). Good for a pre-mount natural-size measure.
  • After mount: builds and memoizes a computed(fn) under the view's scope.
  • After an unmount→remount: the memo is keyed to the scope it was built under, so a remounted view (which gets a fresh scope) re-derives under the new scope instead of returning the previous mount's disposed, now-frozen computed — keeping a Show/For-remounted widget reactive.

Type Parameters ​

T ​

T

Parameters ​

fn ​

() => T

The derivation (pure; the signals it reads become the computed's dependencies).

Returns ​

A stable accessor; call it to read the derived value.

() => T

Inherited from ​

GridRows.derived

desiredCaret() ​

desiredCaret(): Point | null

Defined in: ui/dist/view/view.d.ts:211

Where this view wants the hardware text cursor, in view-local cells, or null for no cursor (the default — most views never show one). A focused text input overrides this to place the caret at the edit position; the event loop reads it after each frame, converts it to an absolute cell, and moves the terminal cursor there.

Returns ​

Point | null

The view-local caret point (0-based, relative to this view's origin), or null.

Inherited from ​

GridRows.desiredCaret

draw() ​

draw(ctx): void

Defined in: datagrid/src/editable-grid-rows.ts:877

Paint the visible window with per-cell resolution: each row is blanked in its resolved colour (focused > selected > zebra > normal), then every cell is drawn under the fixed precedence cursor > dirty > selected-row > cellStyle > zebra > normal — a column's cellStyle colours a cell only when no higher row state owns it, and a column's render paints custom content into a cell-local, cell-clipped context (draw-error isolated). The cursor + dirty overpaints run last, so they always win. The no-hook path paints byte-identically to the base engine.

This is a self-contained override rather than a super.draw() call because the base blanks a whole row in one colour via its string accessor, leaving no seam for per-cell colour or custom content.

Parameters ​

ctx ​

DrawContext

The clipped, view-local paint context.

Returns ​

void

Overrides ​

GridRows.draw

focusBy() ​

protected focusBy(delta): void

Defined in: ui/dist/table/grid-rows.d.ts:113

Move focus by delta rows (clamped into range by the bind).

Parameters ​

delta ​

number

Returns ​

void

Inherited from ​

GridRows.focusBy

focusSignal() ​

focusSignal(): Signal<void>

Defined in: ui/dist/view/view.d.ts:168

Subscribe to this view's focus changes. Reading the returned signal inside a bind/effect re-runs that effect whenever this view gains or loses focus — including from another view (e.g. a Label repainting when the control it labels is focused). The signal notifies on every poke even without a value change. Lazy: the backing signal is created on first call.

Returns ​

Signal<void>

A signal that ticks whenever this view gains or loses focus.

Example ​

ts
import { View, Button, type DrawContext } from '@jsvision/ui';

// A caption that highlights while the control it labels holds focus.
class Caption extends View {
  constructor(
    private readonly text: string,
    private readonly target: View,
  ) {
    super();
    // Reading the target's focus signal inside bind() ties this view's repaint to the target's
    // focus flips — a view can observe focus it does not own.
    this.onMount(() => this.bind(() => this.target.focusSignal()()));
  }

  draw(ctx: DrawContext): void {
    ctx.text(0, 0, this.text, ctx.color(this.target.state.focused ? 'labelSelected' : 'label'));
  }
}

const ok = new Button('~O~K');
const caption = new Caption('Confirm:', ok);

Inherited from ​

GridRows.focusSignal

focusTo() ​

protected focusTo(index): void

Defined in: ui/dist/table/grid-rows.d.ts:115

Focus the given display index, clamped into range (the bind updates topItem + repaints).

Parameters ​

index ​

number

Returns ​

void

Inherited from ​

GridRows.focusTo

geometry() ​

protected geometry(width): ColumnGeometry

Defined in: datagrid/src/editable-grid-rows.ts:435

The column geometry for this panel — like the base, but honouring compact density (no reserved divider cell) so the header/body/quick-filter all apportion identically.

Parameters ​

width ​

number

Returns ​

ColumnGeometry

Overrides ​

GridRows.geometry

gridActive() ​

protected gridActive(): boolean

Defined in: datagrid/src/editable-grid-rows.ts:829

Whether the grid (this view or, in frozen-panel mode, any sibling panel) currently holds focus — the focus test the row highlight, cursor cell, and dirty markers key on. A single body reports its own focus; a frozen panel defers to the container's panelActive predicate (which reactively reads every panel's focus tick) so the shared row cursor lights up as one row across the freeze boundary.

Returns ​

boolean

handleKey() ​

protected handleKey(inner, ev): boolean

Defined in: ui/dist/table/grid-rows.d.ts:111

Apply a navigation / H-scroll / activation key; returns whether it was consumed.

Parameters ​

inner ​

KeyEvent

ev ​

DispatchEvent

Returns ​

boolean

Inherited from ​

GridRows.handleKey

indentBy() ​

protected indentBy(delta): void

Defined in: ui/dist/table/grid-rows.d.ts:117

Step the horizontal indent by delta, clamped to [0, totalWidth − viewportWidth].

Parameters ​

delta ​

number

Returns ​

void

Inherited from ​

GridRows.indentBy

invalidate() ​

invalidate(): void

Defined in: ui/dist/view/view.d.ts:213

Request a repaint of this view. A no-op before the view is mounted (the first frame paints everything).

Returns ​

void

Inherited from ​

GridRows.invalidate

invalidateLayout() ​

invalidateLayout(): void

Defined in: ui/dist/view/view.d.ts:215

Request a reflow (re-run layout, then repaint). Use this when a change affects size/position, not just pixels.

Returns ​

void

Inherited from ​

GridRows.invalidateLayout

isEditing() ​

isEditing(): boolean

Defined in: datagrid/src/editable-grid-rows.ts:419

Whether an in-cell editor is currently open on this body.

Returns ​

boolean

localCol() ​

protected localCol(): number

Defined in: datagrid/src/editable-grid-rows.ts:818

This panel's local cursor index, or -1 when the global cursor is in another panel.

Returns ​

number

measure()? ​

optional measure(available): Size2D

Defined in: ui/dist/view/view.d.ts:85

Optional intrinsic-size hook for auto sizing — return the size this view wants for available.

Parameters ​

available ​

Size2D

Returns ​

Size2D

Inherited from ​

GridRows.measure

onCleanup() ​

onCleanup(fn): void

Defined in: ui/dist/view/view.d.ts:315

Register a teardown callback that runs once when this view unmounts. Requires a mounted view — so call it from within onMount. Use it to release anything the view acquired (a timer, an external subscription).

Parameters ​

fn ​

() => void

The teardown callback.

Returns ​

void

Inherited from ​

GridRows.onCleanup

onEvent() ​

onEvent(ev): void

Defined in: datagrid/src/editable-grid-rows.ts:503

Resolve a key to a GridAction against the merged keymap and route it, falling back to printable type-to-edit; handle selection clicks; let everything else reach the base (row navigation, activation, mouse, wheel).

Parameters ​

ev ​

DispatchEvent

The dispatch envelope.

Returns ​

void

Overrides ​

GridRows.onEvent

onMount() ​

onMount(fn): void

Defined in: ui/dist/view/view.d.ts:307

Register a callback to run once when the view becomes live (after its first layout gives it bounds). This is where to call bind, since the view's reactive scope exists by then. Registering after the view is already live runs the callback immediately.

Parameters ​

fn ​

() => void

Post-mount setup.

Returns ​

void

Inherited from ​

GridRows.onMount

paintCursorCell() ​

protected paintCursorCell(ctx): void

Defined in: datagrid/src/editable-grid-rows.ts:1138

Overpaint the focused cell as a filled gridCursor box with its text redrawn on top — but only while the grid has focus (this body, or any sibling panel in frozen mode; colour-only focus, matching the base) and this panel owns the global cursor column. Uses the same geometry + indent clamp as the base so the box lines up exactly with the painted cell; ctx clips anything scrolled off-screen, so no extra horizontal bounds math is needed.

Parameters ​

ctx ​

DrawContext

The clipped, view-local paint context.

Returns ​

void

paintDirtyMarkers() ​

protected paintDirtyMarkers(ctx): void

Defined in: datagrid/src/editable-grid-rows.ts:1081

Overpaint a • in the gridDirty foreground on every visible cell that has a pending commit. The marker foreground is composited over whatever background the cell already shows (the cursor cell, the focused/selected row, a zebra stripe, or a normal row), so it never punches a hole in a coloured row. • measures one cell, so it never splits a wide neighbour. An invalid cell is skipped — its solid band supersedes the pending marker (invalid > dirty).

Parameters ​

ctx ​

DrawContext

The clipped, view-local paint context.

Returns ​

void

paintInvalidCells() ​

protected paintInvalidCells(ctx): void

Defined in: datagrid/src/editable-grid-rows.ts:1037

Overpaint every visible invalid cell as a filled gridInvalid band with its text redrawn on top — a stronger signal than the pending-commit •, so a blocked edit reads as a hard error. The active cursor cell is skipped (cursor wins over invalid), and the dirty marker yields to it (invalid wins over dirty), giving the precedence cursor > gridInvalid > gridDirty. Uses the same geometry + indent clamp as the base so the band lines up with the painted cell; ctx clips anything scrolled off.

Parameters ​

ctx ​

DrawContext

The clipped, view-local paint context.

Returns ​

void

select() ​

protected select(): void

Defined in: datagrid/src/editable-grid-rows.ts:492

Selection is cursor-only on a plain click: the base moves the row cursor via focusTo, then calls select(index) to set its single-index highlight — but the datagrid paints selection from the selectedKeys set (toggled by Space/Ctrl+click/Shift/the checkbox column), so this override makes that per-click select a no-op. A plain click therefore never changes the selection (and the base's activate(), which also calls select, no longer highlights either). The base selected signal stays at its initial value — it is kept only because GridRowsConfig requires it.

Returns ​

void

Overrides ​

GridRows.select

selectByClick()? ​

optional selectByClick(): void

Defined in: ui/dist/view/view.d.ts:202

Optional "select + raise on click" hook. Left undefined on the base, so a plain view is not a select/raise target. A container that owns z-order (a Window) overrides it to select and raise itself. The hit-test invokes the first ancestor that defines this — before delivering the mouse-down — so a click always raises the window even if the interior also consumes the click.

Returns ​

void

Inherited from ​

GridRows.selectByClick

setGlobalCol() ​

protected setGlobalCol(g, ev): void

Defined in: datagrid/src/editable-grid-rows.ts:838

Set the GLOBAL column cursor (clamped to [0, totalCols)); auto-scroll this panel to reveal the column if it lands here (center panel), and — if it lands in another panel — ask the container to re-focus the panel that now owns the cursor (a leaf-focus hop). Single body: no hop, no auto-scroll.

Parameters ​

g ​

number

ev ​

DispatchEvent

Returns ​

void

setLayout() ​

setLayout(patch): void

Defined in: ui/dist/view/view.d.ts:246

Change some of this view's layout props and request a reflow — the only way to write layout. Props the patch does not name are kept, and the reflow happens for you.

The merge is shallow, deliberately: size and rect are replaced whole rather than merged field-by-field. That is what makes a variant swap correct — going from {kind:'fixed',cells:1} to {kind:'fr',weight:1} must not leave a stale cells behind. The cost is that per-side padding cannot be patched one side at a time; pass the whole padding value.

Two behaviours worth knowing:

  • An explicit undefined resets that prop to its layout default. setLayout({ size: undefined }) makes the view auto-sized again, and setLayout({ position: 'flow' }) puts an absolutely-placed view back in the flow (its now-unused rect is simply ignored).
  • Do not call it in a constructor of a class that subclasses may extend. A base constructor body runs before a subclass's override readonly layout = {…} field initializer, and that initializer installs a fresh object, so the call would be erased. Call it after construction, or from onMount.

Reflowing an unmounted view is a no-op, so calling it before mount is safe.

Parameters ​

patch ​

Partial<LayoutProps>

The layout props to change; anything omitted is preserved.

Returns ​

void

Example ​

ts
import { Group } from '@jsvision/ui';

const panel = new Group();
panel.setLayout({ direction: 'col', padding: 1 });
// Later — `direction` and `padding` survive; once `panel` is mounted this also reflows:
panel.setLayout({ size: { kind: 'fr', weight: 1 } });

Inherited from ​

GridRows.setLayout

totalCols() ​

protected totalCols(): number

Defined in: datagrid/src/editable-grid-rows.ts:813

The global visible column count (a single body's own count by default).

Returns ​

number

updateTop() ​

protected updateTop(): void

Defined in: datagrid/src/editable-grid-rows.ts:444

Keep the focused row visible, then clamp the window top into [rowFloor, rowCeil]. A pinned band (rowFloor: 0, rowCeil: 0) never scrolls off row 0; a scrolling body (rowFloor: N) never renders a pinned row — so the shared cursor is drawn by whichever panel's window contains it, never both.

Returns ​

void

Overrides ​

GridRows.updateTop

viewportRows() ​

protected viewportRows(): number

Defined in: ui/dist/table/grid-rows.d.ts:90

The number of visible rows (the renderer's laid-out height).

Returns ​

number

Inherited from ​

GridRows.viewportRows