Keep live child rows during edit for showOnEdit collection custom nodes (#384)

[CarlosNZ]

Closes #384.

What

When a collection custom node owns its editor (showOnEdit: true + a custom component), its children now stays the live child rows while editing — the same as in view — instead of being swapped for the built-in raw-JSON <textarea>. This is the new default: showOnEdit: true already means "I supply this node's editor", so handing it the library's own textarea as children was incoherent.

This lets a node compose toolbar + {children} in both states and lean entirely on the built-in EditingProvider — e.g. an Operator/Fragment-style header that keeps its children visible and interactive while the header is in edit mode.

How

src/CollectionNode.tsx: a customOwnsEdit = !!CustomComponent && showOnEdit predicate gates CollectionChildren so the live child rows render whenever the custom component owns the edit state. The existing child-rows JSX is reused verbatim; the textarea branch (and its OK/Cancel buttons) only fires for standard collection editing. The buffer/parse plumbing (editBufferValue / handleEdit) simply goes unused for these nodes — nothing removed.

No new prop. A custom editor commits collection-level changes via the setValue it already receives, and owns its commit affordance (setIsEditing / handleEdit / handleCancel). The public AutogrowTextArea remains exported for anyone who wants the built-in textarea's look.

Compatibility

Behaviour change for an existing showOnEdit: true collection custom node that rendered {children} expecting the JSON textarea — it now gets the live rows. The one genuinely removed capability is "custom chrome wrapped around the built-in JSON textarea editor"; showOnEdit: false is not an equivalent (it drops the custom component entirely during edit). The changeset and migration-guide note say this explicitly. Acceptable in v2-beta.

Example

New Playlist example page: tracks is a showOnEdit: true custom node whose header shows count + runtime and a "Reorder…" toolbar (Shuffle / Sort / Reverse, committing via setValue) that appears while the track rows stay live and editable beneath it. Editing a track inline during the header session simply displaces it (single active session).

Tests

• Regression test (rows present + textarea absent during a showOnEdit:true collection edit; fails before the fix at exactly the right line).
• showOnEdit:false guard (standard collection editing still yields the textarea).
• Full suite green (672 passing), lint clean, tsc clean for core and demo.

Not yet done

Interactive browser click-through wasn't possible in this environment — verified the dev server boots and the example module transforms without errors, but the manual "click Reorder, edit a track inline, watch the session displace" walkthrough is the remaining check.

Note: the branch name says …if-showOnEdit-is-false, but the implemented behaviour (per #384) triggers when showOnEdit is true — likely a stale name carried from #348.

🤖 Generated with Claude Code

[github-actions]

Bundle size impact

json-edit-react

Format	Base raw	PR raw	Δ raw	Base gzip	PR gzip	Δ gzip
esm	57.69 KB	57.71 KB	🔺 +17 B (+0.03%)	20.60 KB	20.61 KB	🔺 +10 B (+0.05%)
cjs	59.19 KB	59.21 KB	🔺 +17 B (+0.03%)	20.63 KB	20.64 KB	🔺 +9 B (+0.04%)

_{Measured from build/index.{cjs,esm}.js. Gzip at level 9.}