Skip to content

feat(joint-react): cell focus/blur events, reactive grid, collection setters - #3427

Merged
kumilingus merged 2 commits into
clientIO:devfrom
samuelgja:fix/react-improvements
Jul 27, 2026
Merged

feat(joint-react): cell focus/blur events, reactive grid, collection setters#3427
kumilingus merged 2 commits into
clientIO:devfrom
samuelgja:fix/react-improvements

Conversation

@samuelgja

@samuelgja samuelgja commented Jul 15, 2026

Copy link
Copy Markdown
Contributor

Description

Several @joint/react <Paper> / graph-API fixes and additions reported

  • onCellFocus / onCellBlur events<Paper> now emits cell:focus / cell:blur when a focusable node (e.g. a tabindex element) inside a cell gains/loses focus. Available both as <Paper> props and via useOnPaperEvents. Implemented by delegating the bubbling focusin / focusout DOM events to .joint-cell (plain focus / blur do not bubble — the same reason React's own onFocus / onBlur use focusin / focusout).

    <Paper onCellFocus={({ id }) => selectCell([id])} />
  • Reactive visual grid — changing drawGridSize (and grid options set via the options escape hatch) now redraws the grid. Previously only drawGrid / gridSize triggered a redraw, so drawGridSize updated snapping but left the rendered grid stale.

  • removeCells() / resetCells() accept a collection — a JointJS cell collection (e.g. a selection's collection) can be passed directly, without .toArray(). Adds CellCollection / CellRefList types.

    const { removeCells } = useGraph();
    const { collection } = useSelection();
    removeCells(collection); // previously required collection.toArray()
  • <Paper> style vs className — verified inline style correctly wins over className, same as a plain HTML div. It already behaved correctly; added a regression test to lock it in.

Motivation and Context

Fixes:

All checks pass locally: typecheck, lint, knip, and Jest (React 19 — 1032 tests, React 18 — 1028 tests). New/updated unit tests cover each change.

@samuelgja
samuelgja requested a review from kumilingus July 15, 2026 12:34
@samuelgja
samuelgja changed the base branch from master to dev July 27, 2026 05:46
@kumilingus
kumilingus merged commit 6e16aab into clientIO:dev Jul 27, 2026
3 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants