[AlexSamBY]

What changes

The last seven class components in src become function components:

component	where	was
ToggleField	modules/form/inputs	PureComponent
Upload	modules/upload/views	PureComponent, contextType, state, a Dropzone ref
LocalDraftTableRow	engine/components	PureComponent with state
Data	engine	Component, render only
PopupContent (template factory)	engine/components/PopupContent.js	a PureComponent class per call
PopupContent (static popups)	engine/mapper.js	a PureComponent class per popup node
Examples	demo/pages	Component with state

The one class component left in src is Render.js's error boundary. React offers no hook for componentDidCatch, so it stays a class.

Every PureComponent became memo (a shallow props compare, as before). Every defaultProps became a default parameter, which React 19 requires of a function component. Hooks only: TypeScript for the same seven is the next PR, as §9.2 asks (one moving part per PR).

Four semantics the obvious conversion would have changed

1. The default translate of LocalDraftTableRow and Upload. Both defaulted it to Active.translate as read when the module loaded: defaultProps is evaluated once. The engine reassigns Active.translate in every document's constructor (rules.js), so a render-time read would take the translator of whichever document was built last. The default is a module constant.

2. Data's default data and meta. They were two shared objects. The nested document compares data by reference, so the defaults are module constants, not a new {} per render.

3. When Upload tells the host about a drag. The class called onFocus/onBlur from setState's callback, which runs:

   • after the commit;
   • with that commit's props;
   • even when the state was unchanged and PureComponent skipped the render.

   A hook skips the commit in that last case. So the callbacks queue, a layout effect flushes them after every commit (reading the committed props), and a counter forces the commit that runs them. The React 16 persist() handling is unchanged.

4. What ToggleField hands Field. The class gave Field this.input, one function per instance, so Field's component type never changed. That function read the latest this.props: all of them, including onChange and instance, which Field is deliberately not given, and value, which overrides the field's own. A module-level component keeps the type stable, and a context gives it the props without passing instance or onChange through Field. The existing leak test still holds.

PopupContent keeps its fresh type per popup, which rules.popup-content.test.js pins, because the memoized function is still created per call.

Measured

Through the published entry, over the 38 examples, before → after:

	before	after
commits at mount	107	107
translate calls at mount	1013	1013
commits on an edit	27	27
translate calls on an edit	64	64
examples whose DOM differs, after mount / after an edit	—	0 / 0

dist/index.js is 328,053 → 327,402 bytes.

Tests

• Two tests reached into the classes and now go through the rendered component:
  • "updates the form input before invoking the external callback" called new ToggleField(...).input(...). It now clicks the rendered toggle and records what the form holds when the callback runs. It was mutation-checked: with the two calls swapped, it fails.
  • "handleKeyPress opens dropzone on Enter" passed an unused ref to Upload through a wrapper class; on a function component that ref would warn. The wrapper and the ref are gone; the assertion is unchanged.
• Checked in the running demo:
  • both toggles in inputToggle flip;
  • a draft row in nestedDataKind holds its input, "Add line" appends DES-003 | Prototype | 2 | 300, and the draft clears;
  • "Open Popup 1" opens with its content;
  • a drag toggles the upload's active class;
  • a title click expands its example and moves the hash;
  • no console error or React warning at any step.

Gates

All exited 0:

• lint:js, lint:css, typecheck;
• docs:props:check, docs:views:check, css:fixture:check;
• test:env-flags, test:coverage (thresholds included), build;
• test:pack, test:pack:peers, test:types;
• test:react17 and test:react19, 2907 tests each;
• test:e2e, 41 tests;
• the manifest contract.

test:react16 lost a worker to SIGSEGV on its first two runs: StandaloneTabs.test.js, then fields.test.js, 12 tests each, hence 2895. That is the Node 24 V8 crash (nodejs/node#62393). The third run passed 2907/2907.

🤖 Generated with Claude Code