@faiwer/react 0.8.4 → 19.0.1

package/README.md

@@ -2,10 +2,31 @@
 
 A naive React implementation. Why? What's wrong with the existing one? Nothing. I just wanted to implement it from scratch by myself. It can be used as a drop-in replacement for some simple React apps. May require some trivial changes, though.
 
+A few stats:
+
+- ~5.5k LoC in TypeScript
+- ~122 KiB: transpiled JS code
+- ~44 KiB: minified by `terser`
+- ~16 KiB: minified gzipped
+  - `preact` is about ~10 KiB
+
+- areFiberNodesEq
+  // what if a context's ctx was changed? switch one context to another
+  // how does it work in React?
+
+- Multiple setState work?
+  setNumber(n => n + 1);
+  setNumber(n => n + 1);
+  setNumber(n => n + 1);
+  = +3
+
 ## It supports
+https://github.com/preactjs/preact-devtools/blob/main/src/adapter/renderer.ts
+
 
 - JSX
 - Functional components
+- Class components (limited)
 - Hooks:
   - `useState`
   - `useRef`
@@ -14,21 +35,30 @@ A naive React implementation. Why? What's wrong with the existing one? Nothing.
   - `useLayoutEffect`, `useEffect` (improved versions)
   - `useId`
   - `useContext`
-- Tag-based refs
+- Refs
 - Context
 - Portals
 - Fragments
 
 ## Installation
 
-- `npm i --save @faiwer/react`
-- Update your `tsconfig.json`:
+- `npm uninstall react react-dom @types/react @types/react-dom`
+- `npm i --save react@npm:@faiwer/react`
+- `npm i --save --force react-dom@npm:@faiwer/react-dom`
+- You might need to update your `tsconfig.json` (no necessarily):
   ```json
   "compilerOptions": {
     "jsx": "react-jsx",
-    "jsxImportSource": "@faiwer/react"
   }
   ```
+  Or use `"jsx": "preserve"`
+- If you're using `eslint-plugin-react` than configure this in your .eslintrc:
+  ```json
+  "settings": {
+    "react": { "version": "19" } // not 'detect'
+  },
+  ```
+- Good luck. If your project is big enough, I'm pretty sure you got a ton of type errors. Sorry :-)
 
 ### Usage
 
@@ -41,24 +71,19 @@ createRoot(container).render(<App />);
 
 ## TODO
 
-- 1st line
-  - Events:
-    - "capture"-kind of events
-    - camelCase events
-    - custom `onChange` like in ReactDOM
-  - Error handling
-  - Direct component refs, `forwardRef`, `useImperativeHandle`
-- 2nd line
-  - prepare an NPM-package
-- 3rd line
-  - `RunComponent` is not pure. Some hooks change the state during the rendering phase. Fix it.
-  - `useReducer`
+- HMR
+- Preact Devtools?
+- JSX: Math namespace
+- Lazy
+- Make all hooks pure
+- Resolve "TODO: add a test" comments
+- leverage `isStaticChildren` in `jsx()`
 
 ## It does NOT support
 
 … and probably never will:
 
-- Class Components
+- Class Components: `getSnapshotBeforeUpdate`
 - Synthetic events
 - Portals:
   - Event bubbling from portals
@@ -85,8 +110,5 @@ createRoot(container).render(<App />);
 - It renders HTML-comment for nullable nodes and some fragments. Why? It helps a lot to keep the reconciliation algorithm simple. Took this idea from Angular.
 - No synthetic events. I don't see any reason to implement them.
 - All components are memoized by default. Why not?
-- No custom DOM-related code. This library is supposed to be simple and silly. Whereas React-DOM lib is huge.
+- Not too much custom DOM-related code. This library is supposed to be simple and silly. Whereas React-DOM lib is huge.
 - No modern fiber-driven stuff like `<Suspense>`, `cacheSignal`, or `use`. Too much work. It took React many years to cook it well :)
-
-- научить solo режим ссылаться на внутренний <!--end-->
-  это уберёт миллиард begin-end в wrapper-ах

package/dist/core/actions/applyAction.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"applyAction.d.ts","sourceRoot":"","sources":["../../../src/core/actions/applyAction.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAYzD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,0BAGvB,CAAC"}
+{"version":3,"file":"applyAction.d.ts","sourceRoot":"","sources":["../../../src/core/actions/applyAction.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,4BAA4B,CAAC;AAezD;;;;;;;GAOG;AACH,eAAO,MAAM,WAAW,0BAGvB,CAAC"}

package/dist/core/actions/applyAction.js

@@ -8,6 +8,9 @@ import { setTextAction } from './setText.action';
 import { removeAction } from './remove.action';
 import { replaceAction } from './replace.action';
 import { relayoutAction } from './relayout.action';
+import { createContainerAction } from './createContainer.action';
+import { scheduleEffectAction } from './scheduleEffect.action';
+import { catchErrorAction } from './catchError.action';
 /**
  * The commit phase of the rendering process contains two parts:
  * - Applying DOM changes
@@ -24,6 +27,7 @@ const actionHandlers = {
     CreateTag: createTagAction,
     CreateText: createTextAction,
     CreateComment: createCommentAction,
+    CreateContainer: createContainerAction,
     SetProps: setPropsAction,
     SetRef: setRefAction,
     SetAttr: setAttrAction,
@@ -31,5 +35,7 @@ const actionHandlers = {
     Remove: removeAction,
     Replace: replaceAction,
     Relayout: relayoutAction,
+    ScheduleEffect: scheduleEffectAction,
+    CatchError: catchErrorAction,
 };
 //# sourceMappingURL=applyAction.js.map

package/dist/core/actions/applyAction.js.map

@@ -1 +1 @@
-{"version":3,"file":"applyAction.js","sourceRoot":"","sources":["../../../src/core/actions/applyAction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AAEnD;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAc,EAAQ,EAAE,CAAC;IACnD,kCAAkC;IAClC,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,MAAa,CAAC,CAAC;AAAA,CAC1D,CAAC;AAEF,MAAM,cAAc,GAKhB;IACF,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,gBAAgB;IAC5B,aAAa,EAAE,mBAAmB;IAClC,QAAQ,EAAE,cAAc;IACxB,MAAM,EAAE,YAAY;IACpB,OAAO,EAAE,aAAa;IACtB,OAAO,EAAE,aAAa;IACtB,MAAM,EAAE,YAAY;IACpB,OAAO,EAAE,aAAa;IACtB,QAAQ,EAAE,cAAc;CACzB,CAAC"}
+{"version":3,"file":"applyAction.js","sourceRoot":"","sources":["../../../src/core/actions/applyAction.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,eAAe,EAAE,MAAM,oBAAoB,CAAC;AACrD,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AACvD,OAAO,EAAE,mBAAmB,EAAE,MAAM,wBAAwB,CAAC;AAC7D,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,mBAAmB,CAAC;AACnD,OAAO,EAAE,qBAAqB,EAAE,MAAM,0BAA0B,CAAC;AACjE,OAAO,EAAE,oBAAoB,EAAE,MAAM,yBAAyB,CAAC;AAC/D,OAAO,EAAE,gBAAgB,EAAE,MAAM,qBAAqB,CAAC;AAEvD;;;;;;;GAOG;AACH,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,MAAc,EAAQ,EAAE,CAAC;IACnD,kCAAkC;IAClC,cAAc,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,KAAK,EAAE,MAAa,CAAC,CAAC;AAAA,CAC1D,CAAC;AAEF,MAAM,cAAc,GAKhB;IACF,SAAS,EAAE,eAAe;IAC1B,UAAU,EAAE,gBAAgB;IAC5B,aAAa,EAAE,mBAAmB;IAClC,eAAe,EAAE,qBAAqB;IACtC,QAAQ,EAAE,cAAc;IACxB,MAAM,EAAE,YAAY;IACpB,OAAO,EAAE,aAAa;IACtB,OAAO,EAAE,aAAa;IACtB,MAAM,EAAE,YAAY;IACpB,OAAO,EAAE,aAAa;IACtB,QAAQ,EAAE,cAAc;IACxB,cAAc,EAAE,oBAAoB;IACpC,UAAU,EAAE,gBAAgB;CAC7B,CAAC"}

package/dist/core/actions/catchError.action.d.ts

@@ -0,0 +1,10 @@
+import { type FiberNode } from '../../types';
+import type { CatchErrorAction } from '../../types/actions';
+/**
+ * During the current render one of the components failed. This is the error
+ * handler for the closest error boundary component.
+ * - It removes the existing content
+ * - Runs the error handler
+ */
+export declare function catchErrorAction(fiber: FiberNode, { error }: Pick<CatchErrorAction, 'error'>): void;
+//# sourceMappingURL=catchError.action.d.ts.map

package/dist/core/actions/catchError.action.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"catchError.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/catchError.action.ts"],"names":[],"mappings":"AAAA,OAAO,EAGL,KAAK,SAAS,EACf,MAAM,oBAAoB,CAAC;AAG5B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,4BAA4B,CAAC;AAMnE;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAC9B,KAAK,EAAE,SAAS,EAChB,EAAE,KAAK,EAAE,EAAE,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC,QA4C3C"}

package/dist/core/actions/catchError.action.js

@@ -0,0 +1,51 @@
+import { removeAction } from './remove.action';
+import { scheduleEffect } from '../reconciliation/effects';
+import { tryFixContainerType } from './relayout.action';
+import { isFiberDead } from '../reconciliation/fibers';
+import { getAppByFiber } from '../reconciliation/app';
+import { ReactError } from '../reconciliation/errors/ReactError';
+/**
+ * During the current render one of the components failed. This is the error
+ * handler for the closest error boundary component.
+ * - It removes the existing content
+ * - Runs the error handler
+ */
+export function catchErrorAction(fiber, { error }) {
+    scheduleEffect(fiber, () => {
+        const compFiber = fiber;
+        // Disable this node as an error boundary for one render cycle to avoid
+        // an eternal loop if the sequential render again leads to an error.
+        compFiber.data.isErrorBoundary = false;
+        const info = {
+            componentStack: error.fullStack,
+        };
+        const handlers = compFiber.data.hooks.filter((h) => h.type === 'error');
+        for (const { fn } of handlers) {
+            fn(error, info);
+        }
+        if (!getAppByFiber(fiber).invalidatedComponents.has(compFiber)) {
+            throw new ReactError(compFiber, `ErrorBoundaries must update their state on error`);
+        }
+        // Recover `isErrorBoundary` after a sucessful rerender.
+        scheduleEffect(fiber, () => {
+            if (!isFiberDead(compFiber)) {
+                compFiber.data.isErrorBoundary = true;
+            }
+        }, 'afterActions');
+    }, 'normal');
+    if (fiber.element) {
+        killChildrenOnError(fiber);
+    }
+    // else: fiber.children === [nullNode].
+}
+const killChildrenOnError = (fiber) => {
+    // Not the 1st render. Nodes are mounted. Must be removed.
+    for (const [idx, child] of fiber.children.entries()) {
+        removeAction(child, { last: idx === fiber.children.length - 1 });
+    }
+    fiber.children = [];
+    if (fiber.parent.type === 'component') {
+        tryFixContainerType(fiber.parent);
+    }
+};
+//# sourceMappingURL=catchError.action.js.map

package/dist/core/actions/catchError.action.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"catchError.action.js","sourceRoot":"","sources":["../../../src/core/actions/catchError.action.ts"],"names":[],"mappings":"AAKA,OAAO,EAAE,YAAY,EAAE,MAAM,iBAAiB,CAAC;AAC/C,OAAO,EAAE,cAAc,EAAE,MAAM,2BAA2B,CAAC;AAE3D,OAAO,EAAE,mBAAmB,EAAE,MAAM,mBAAmB,CAAC;AACxD,OAAO,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACvD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AAEjE;;;;;GAKG;AACH,MAAM,UAAU,gBAAgB,CAC9B,KAAgB,EAChB,EAAE,KAAK,EAAmC,EAC1C;IACA,cAAc,CACZ,KAAK,EACL,GAAG,EAAE,CAAC;QACJ,MAAM,SAAS,GAAG,KAA2B,CAAC;QAC9C,uEAAuE;QACvE,oEAAoE;QACpE,SAAS,CAAC,IAAI,CAAC,eAAe,GAAG,KAAK,CAAC;QAEvC,MAAM,IAAI,GAAc;YACtB,cAAc,EAAE,KAAK,CAAC,SAAS;SAChC,CAAC;QAEF,MAAM,QAAQ,GAAG,SAAS,CAAC,IAAI,CAAC,KAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,CAAC;QACzE,KAAK,MAAM,EAAE,EAAE,EAAE,IAAI,QAAQ,EAAE,CAAC;YAC9B,EAAE,CAAC,KAAK,EAAE,IAAI,CAAC,CAAC;QAClB,CAAC;QAED,IAAI,CAAC,aAAa,CAAC,KAAK,CAAC,CAAC,qBAAqB,CAAC,GAAG,CAAC,SAAS,CAAC,EAAE,CAAC;YAC/D,MAAM,IAAI,UAAU,CAClB,SAAS,EACT,kDAAkD,CACnD,CAAC;QACJ,CAAC;QAED,wDAAwD;QACxD,cAAc,CACZ,KAAK,EACL,GAAG,EAAE,CAAC;YACJ,IAAI,CAAC,WAAW,CAAC,SAAS,CAAC,EAAE,CAAC;gBAC5B,SAAS,CAAC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC;YACxC,CAAC;QAAA,CACF,EACD,cAAc,CACf,CAAC;IAAA,CACH,EACD,QAAQ,CACT,CAAC;IAEF,IAAI,KAAK,CAAC,OAAO,EAAE,CAAC;QAClB,mBAAmB,CAAC,KAAK,CAAC,CAAC;IAC7B,CAAC;IACD,uCAAuC;AADtC,CAEF;AAED,MAAM,mBAAmB,GAAG,CAAC,KAAgB,EAAE,EAAE,CAAC;IAChD,0DAA0D;IAC1D,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,KAAK,CAAC,QAAQ,CAAC,OAAO,EAAE,EAAE,CAAC;QACpD,YAAY,CAAC,KAAK,EAAE,EAAE,IAAI,EAAE,GAAG,KAAK,KAAK,CAAC,QAAQ,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC,CAAC;IACnE,CAAC;IAED,KAAK,CAAC,QAAQ,GAAG,EAAE,CAAC;IACpB,IAAI,KAAK,CAAC,MAAM,CAAC,IAAI,KAAK,WAAW,EAAE,CAAC;QACtC,mBAAmB,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC;IACpC,CAAC;AAAA,CACF,CAAC"}

package/dist/core/actions/createComment.action.d.ts

@@ -1,7 +1,7 @@
-import type { FiberNode } from '../../types';
+import { type FiberNode } from '../../types';
 import type { CreateCommentAction } from '../../types/actions';
 /**
  * Creates a new comment DOM node (<!--r:${mode}:${fiber.id}-->).
  */
-export declare function createCommentAction(fiber: FiberNode, { mode }: CreateCommentAction): void;
+export declare function createCommentAction(fiber: FiberNode, { mode }: Pick<CreateCommentAction, 'mode'>): void;
 //# sourceMappingURL=createComment.action.d.ts.map

package/dist/core/actions/createComment.action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createComment.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createComment.action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAKtE;;GAEG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,SAAS,EAChB,EAAE,IAAI,EAAE,EAAE,mBAAmB,QAc9B"}
+{"version":3,"file":"createComment.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createComment.action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AACpD,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,4BAA4B,CAAC;AAItE;;GAEG;AACH,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,SAAS,EAChB,EAAE,IAAI,EAAE,EAAE,IAAI,CAAC,mBAAmB,EAAE,MAAM,CAAC,QAO5C"}

package/dist/core/actions/createComment.action.js

@@ -1,20 +1,13 @@
 import { getParentElement } from './helpers';
-import { tryToCompactNode } from '../compact';
 import { buildComment } from '../reconciliation/comments';
 /**
  * Creates a new comment DOM node (<!--r:${mode}:${fiber.id}-->).
  */
 export function createCommentAction(fiber, { mode }) {
     // Only two scenarios lead here:
-    // - First render of a fragment or component. The parent's element is a
-    //   comment `r:begin:{id}`
+    // - Render a component or a fragment without children
     // - Render of a portal. The parent element is the portal target node.
     fiber.element = buildComment(mode, fiber.id);
     getParentElement(fiber).appendChild(fiber.element);
-    if (mode === 'end') {
-        // All children are added. If the current fiber is the only child, we can
-        // compact the parent node: "<!--begin-->child<!--end-->" -> "child".
-        tryToCompactNode(fiber);
-    }
 }
 //# sourceMappingURL=createComment.action.js.map

package/dist/core/actions/createComment.action.js.map

@@ -1 +1 @@
-{"version":3,"file":"createComment.action.js","sourceRoot":"","sources":["../../../src/core/actions/createComment.action.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,gBAAgB,EAAE,MAAM,YAAY,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D;;GAEG;AACH,MAAM,UAAU,mBAAmB,CACjC,KAAgB,EAChB,EAAE,IAAI,EAAuB,EAC7B;IACA,gCAAgC;IAChC,uEAAuE;IACvE,2BAA2B;IAC3B,sEAAsE;IACtE,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;IAC7C,gBAAgB,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IAEnD,IAAI,IAAI,KAAK,KAAK,EAAE,CAAC;QACnB,yEAAyE;QACzE,qEAAqE;QACrE,gBAAgB,CAAC,KAAK,CAAC,CAAC;IAC1B,CAAC;AAAA,CACF"}
+{"version":3,"file":"createComment.action.js","sourceRoot":"","sources":["../../../src/core/actions/createComment.action.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D;;GAEG;AACH,MAAM,UAAU,mBAAmB,CACjC,KAAgB,EAChB,EAAE,IAAI,EAAqC,EAC3C;IACA,gCAAgC;IAChC,sDAAsD;IACtD,sEAAsE;IACtE,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC,IAAI,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;IAC7C,gBAAgB,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAAA,CACpD"}

package/dist/core/actions/createContainer.action.d.ts

@@ -0,0 +1,7 @@
+import { type FiberNode } from '../../types';
+/**
+ * Once all component- or fragment-fiber's nodes are mounted we can finalize
+ * their fragment-like container.
+ */
+export declare function createContainerAction(fiber: FiberNode): void;
+//# sourceMappingURL=createContainer.action.d.ts.map

package/dist/core/actions/createContainer.action.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createContainer.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createContainer.action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAgB,KAAK,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAIlE;;;GAGG;AACH,wBAAgB,qBAAqB,CAAC,KAAK,EAAE,SAAS,QAiBrD"}

package/dist/core/actions/createContainer.action.js

@@ -0,0 +1,28 @@
+import { containerSym } from '../../types';
+import { getParentElement } from './helpers';
+import { buildComment } from '../reconciliation/comments';
+/**
+ * Once all component- or fragment-fiber's nodes are mounted we can finalize
+ * their fragment-like container.
+ */
+export function createContainerAction(fiber) {
+    if (fiber.children.length === 0) {
+        // Case 1: We have no child nodes, so create an !--empty comment.
+        const container = getParentElement(fiber);
+        const empty = buildComment('empty', fiber.id);
+        container.appendChild(empty);
+        fiber.element = empty;
+    }
+    else if (fiber.children.length === 1) {
+        // Case 2: We have only one child. Let's refer to it. It's slightly faster
+        // than the `containerSym` approach.
+        fiber.element = fiber.children[0].element;
+    }
+    else {
+        // Case 3: We have more then one DOM children. Resort to the slow path:
+        // containerSym. In such a mode to get the fiber's domNodes we need to
+        // traverse through some of its children.
+        fiber.element = containerSym;
+    }
+}
+//# sourceMappingURL=createContainer.action.js.map

package/dist/core/actions/createContainer.action.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"createContainer.action.js","sourceRoot":"","sources":["../../../src/core/actions/createContainer.action.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,YAAY,EAAkB,MAAM,oBAAoB,CAAC;AAClE,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE1D;;;GAGG;AACH,MAAM,UAAU,qBAAqB,CAAC,KAAgB,EAAE;IACtD,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QAChC,iEAAiE;QACjE,MAAM,SAAS,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAC;QAC1C,MAAM,KAAK,GAAG,YAAY,CAAC,OAAO,EAAE,KAAK,CAAC,EAAE,CAAC,CAAC;QAC9C,SAAS,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QAC7B,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC;IACxB,CAAC;SAAM,IAAI,KAAK,CAAC,QAAQ,CAAC,MAAM,KAAK,CAAC,EAAE,CAAC;QACvC,0EAA0E;QAC1E,oCAAoC;QACpC,KAAK,CAAC,OAAO,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,OAAO,CAAC;IAC5C,CAAC;SAAM,CAAC;QACN,uEAAuE;QACvE,sEAAsE;QACtE,yCAAyC;QACzC,KAAK,CAAC,OAAO,GAAG,YAAY,CAAC;IAC/B,CAAC;AAAA,CACF"}

package/dist/core/actions/createTag.action.d.ts

@@ -1,4 +1,5 @@
 import type { FiberNode } from '../../types';
+import type { CreateTagAction } from '../../types/actions';
 /**
  * Handles two scenarios:
  * - Creates a <!--r:portal:id--> comment for portal fibers
@@ -6,5 +7,5 @@ import type { FiberNode } from '../../types';
  *
  * This doesn't create child nodes or set attributes/event handlers.
  */
-export declare function createTagAction(fiber: FiberNode): void;
+export declare function createTagAction(fiber: FiberNode, { attrs, ref }: CreateTagAction): void;
 //# sourceMappingURL=createTag.action.d.ts.map

package/dist/core/actions/createTag.action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createTag.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createTag.action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAIpD;;;;;;GAMG;AACH,wBAAgB,eAAe,CAAC,KAAK,EAAE,SAAS,GAAG,IAAI,CAkBtD"}
+{"version":3,"file":"createTag.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createTag.action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAIpD,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAIlE;;;;;;GAMG;AACH,wBAAgB,eAAe,CAC7B,KAAK,EAAE,SAAS,EAChB,EAAE,KAAK,EAAE,GAAG,EAAE,EAAE,eAAe,GAC9B,IAAI,CAsCN"}

package/dist/core/actions/createTag.action.js

@@ -1,5 +1,8 @@
 import { getParentElement } from './helpers';
-import { applyAction } from './applyAction';
+import { createCommentAction } from './createComment.action';
+import { setAttrAction } from './setAttr.action';
+import { setRefAction } from './setRef.action';
+import { ReactError } from '../reconciliation/errors/ReactError';
 /**
  * Handles two scenarios:
  * - Creates a <!--r:portal:id--> comment for portal fibers
@@ -7,15 +10,15 @@ import { applyAction } from './applyAction';
  *
  * This doesn't create child nodes or set attributes/event handlers.
  */
-export function createTagAction(fiber) {
+export function createTagAction(fiber, { attrs, ref }) {
     if (fiber.type !== 'tag') {
-        throw new Error(`createTagAction supports only tag-fiber-nodes.`);
+        throw new ReactError(fiber, `createTagAction supports only tag-fiber-nodes.`);
     }
     if (fiber.data instanceof HTMLElement) {
         // This is a portal, not a regular tag. We shouldn't create it since it
         // already exists outside the app's DOM subtree. Instead, create a
         // <!--r:portal:id--> comment node.
-        applyAction({ type: 'CreateComment', fiber, mode: 'portal' });
+        createCommentAction(fiber, { mode: 'portal' });
     }
     else if (fiber.tag !== 'root') {
         // 'root' is a special case - it's the node where the app is mounted.
@@ -24,8 +27,23 @@ export function createTagAction(fiber) {
             : document.createElement(fiber.tag);
         fiber.element = tag;
         getParentElement(fiber).appendChild(fiber.element);
+        if (fiber.element instanceof HTMLInputElement) {
+            if (attrs?.type === 'radio') {
+                attrs.checked ??= undefined;
+            }
+            if (typeof attrs?.type === 'string') {
+                fiber.element.type = attrs.type;
+            }
+        }
+        for (const [name, value] of Object.entries(attrs ?? EMPTY)) {
+            setAttrAction(fiber, { name, value, creation: true });
+        }
+        if (ref) {
+            setRefAction(fiber, { ref, dontUnsetRef: true });
+        }
     }
 }
+const EMPTY = {};
 const SVG_TAGS = new Set([
     // Core SVG Elements:
     'svg',

package/dist/core/actions/createTag.action.js.map

@@ -1 +1 @@
-{"version":3,"file":"createTag.action.js","sourceRoot":"","sources":["../../../src/core/actions/createTag.action.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAAC,KAAgB,EAAQ;IACtD,IAAI,KAAK,CAAC,IAAI,KAAK,KAAK,EAAE,CAAC;QACzB,MAAM,IAAI,KAAK,CAAC,gDAAgD,CAAC,CAAC;IACpE,CAAC;IAED,IAAI,KAAK,CAAC,IAAI,YAAY,WAAW,EAAE,CAAC;QACtC,uEAAuE;QACvE,kEAAkE;QAClE,mCAAmC;QACnC,WAAW,CAAC,EAAE,IAAI,EAAE,eAAe,EAAE,KAAK,EAAE,IAAI,EAAE,QAAQ,EAAE,CAAC,CAAC;IAChE,CAAC;SAAM,IAAI,KAAK,CAAC,GAAG,KAAK,MAAM,EAAE,CAAC;QAChC,qEAAqE;QACrE,MAAM,GAAG,GAAG,QAAQ,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC;YACjC,CAAC,CAAC,QAAQ,CAAC,eAAe,CAAC,4BAA4B,EAAE,KAAK,CAAC,GAAG,CAAC;YACnE,CAAC,CAAC,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QACtC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;QACpB,gBAAgB,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;IACrD,CAAC;AAAA,CACF;AAED,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC;IACvB,qBAAqB;IACrB,KAAK;IACL,GAAG;IACH,MAAM;IACN,QAAQ;IACR,KAAK;IACL,OAAO;IACP,QAAQ;IACR,OAAO;IACP,gBAAgB;IAChB,MAAM;IACN,QAAQ;IACR,SAAS;IACT,MAAM;IACN,UAAU;IACV,SAAS;IACT,MAAM;IACN,iBAAiB;IACjB,MAAM;IACN,OAAO;IACP,MAAM;IACN,UAAU;IACV,UAAU;IACV,UAAU;IACV,0BAA0B;IAC1B,OAAO;IACP,MAAM;IACN,UAAU;IACV,sBAAsB;IACtB,eAAe;IACf,QAAQ;IACR,SAAS;IACT,MAAM;IACN,UAAU;IACV,QAAQ;IACR,gCAAgC;IAChC,gBAAgB;IAChB,gBAAgB;IAChB,MAAM;IACN,sBAAsB;IACtB,SAAS;IACT,eAAe;IACf,kBAAkB;IAClB,KAAK;IACL,6BAA6B;IAC7B,SAAS;IACT,eAAe;IACf,qBAAqB;IACrB,aAAa;IACb,kBAAkB;IAClB,mBAAmB;IACnB,mBAAmB;IACnB,cAAc;IACd,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,SAAS;IACT,gBAAgB;IAChB,SAAS;IACT,SAAS;IACT,aAAa;IACb,cAAc;IACd,UAAU;IACV,cAAc;IACd,oBAAoB;IACpB,aAAa;IACb,QAAQ;IACR,cAAc;IACd,iBAAiB;IACjB,MAAM;IACN,OAAO;IACP,OAAO;IACP,OAAO;IACP,WAAW;IACX,eAAe;IACf,eAAe;IACf,kBAAkB;IAClB,gBAAgB;IAChB,eAAe;CAChB,CAAC,CAAC"}
+{"version":3,"file":"createTag.action.js","sourceRoot":"","sources":["../../../src/core/actions/createTag.action.ts"],"names":[],"mappings":"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"}

package/dist/core/actions/createText.action.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"createText.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createText.action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAGpD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,SAAS,QAWhD"}
+{"version":3,"file":"createText.action.d.ts","sourceRoot":"","sources":["../../../src/core/actions/createText.action.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAIpD;;GAEG;AACH,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,SAAS,QAUhD"}

package/dist/core/actions/createText.action.js

@@ -1,15 +1,12 @@
 import { getParentElement } from './helpers';
+import { ReactError } from '../reconciliation/errors/ReactError';
 /**
  * Creates a new text DOM node.
  */
 export function createTextAction(fiber) {
     if (fiber.type !== 'text') {
-        throw new Error(`Can't apply CreateText for a ${fiber.type} node`);
+        throw new ReactError(fiber, `Can't apply CreateText for a ${fiber.type} node`);
     }
-    // Only two scenarios lead here:
-    // - First render of a fragment or component. The parent's element is
-    //   a comment `r:begin:{id}`
-    // - Render of a portal. The parent element is the portal target node.
     fiber.element = new Text(fiber.props.text);
     getParentElement(fiber).appendChild(fiber.element);
 }

package/dist/core/actions/createText.action.js.map

@@ -1 +1 @@
-{"version":3,"file":"createText.action.js","sourceRoot":"","sources":["../../../src/core/actions/createText.action.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAE7C;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAgB,EAAE;IACjD,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC1B,MAAM,IAAI,KAAK,CAAC,gCAAgC,KAAK,CAAC,IAAI,OAAO,CAAC,CAAC;IACrE,CAAC;IAED,gCAAgC;IAChC,qEAAqE;IACrE,6BAA6B;IAC7B,sEAAsE;IACtE,KAAK,CAAC,OAAO,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAC3C,gBAAgB,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAAA,CACpD"}
+{"version":3,"file":"createText.action.js","sourceRoot":"","sources":["../../../src/core/actions/createText.action.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AAEjE;;GAEG;AACH,MAAM,UAAU,gBAAgB,CAAC,KAAgB,EAAE;IACjD,IAAI,KAAK,CAAC,IAAI,KAAK,MAAM,EAAE,CAAC;QAC1B,MAAM,IAAI,UAAU,CAClB,KAAK,EACL,gCAAgC,KAAK,CAAC,IAAI,OAAO,CAClD,CAAC;IACJ,CAAC;IAED,KAAK,CAAC,OAAO,GAAG,IAAI,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC,CAAC;IAC3C,gBAAgB,CAAC,KAAK,CAAC,CAAC,WAAW,CAAC,KAAK,CAAC,OAAO,CAAC,CAAC;AAAA,CACpD"}

package/dist/core/actions/dom/attributes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"attributes.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/attributes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,eAAO,MAAM,gBAAgB,mEAe5B,CAAC;AAEF,eAAO,MAAM,UAAU,aAuCrB,CAAC"}
+{"version":3,"file":"attributes.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/attributes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAEvD,eAAO,MAAM,gBAAgB,mEAoB5B,CAAC;AAEF,eAAO,MAAM,UAAU,aAsCrB,CAAC"}

package/dist/core/actions/dom/attributes.js

@@ -8,6 +8,10 @@ export const setHtmlAttribute = (element, name, value) => {
         }
         return;
     }
+    if (name === 'value') {
+        element.value = value == null ? '' : String(value);
+        return;
+    }
     element.setAttribute(name === 'className' ? 'class' : name, String(value));
 };
 export const BOOL_ATTRS = new Set([
@@ -19,7 +23,6 @@ export const BOOL_ATTRS = new Set([
     'contentEditable',
     'spellCheck',
     'draggable',
-    'value',
     'autoReverse',
     'externalResourcesRequired',
     'focusable',

package/dist/core/actions/dom/attributes.js.map

@@ -1 +1 @@
-{"version":3,"file":"attributes.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/attributes.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAC9B,OAAoB,EACpB,IAAY,EACZ,KAAmB,EACnB,EAAE,CAAC;IACH,IAAI,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;QACzB,IAAI,KAAK,EAAE,CAAC;YACV,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC;QACD,OAAO;IACT,CAAC;IAED,OAAO,CAAC,YAAY,CAAC,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,CAC5E,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC;IAChC,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;IACP,UAAU;IACV,iBAAiB;IACjB,YAAY;IACZ,WAAW;IACX,OAAO;IACP,aAAa;IACb,2BAA2B;IAC3B,WAAW;IACX,eAAe;IACf,iBAAiB;IACjB,OAAO;IACP,UAAU;IACV,UAAU;IACV,SAAS;IACT,OAAO;IACP,UAAU;IACV,yBAAyB;IACzB,uBAAuB;IACvB,gBAAgB;IAChB,QAAQ;IACR,MAAM;IACN,UAAU;IACV,YAAY;IACZ,MAAM;IACN,aAAa;IACb,UAAU;IACV,UAAU;IACV,UAAU;IACV,QAAQ;IACR,UAAU;IACV,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;CACR,CAAC,CAAC"}
+{"version":3,"file":"attributes.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/attributes.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAC9B,OAAoB,EACpB,IAAY,EACZ,KAAmB,EACnB,EAAE,CAAC;IACH,IAAI,UAAU,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC;QACzB,IAAI,KAAK,EAAE,CAAC;YACV,OAAO,CAAC,YAAY,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC;QACjC,CAAC;aAAM,CAAC;YACN,OAAO,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;QAChC,CAAC;QACD,OAAO;IACT,CAAC;IAED,IAAI,IAAI,KAAK,OAAO,EAAE,CAAC;QACpB,OAA4B,CAAC,KAAK,GAAG,KAAK,IAAI,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QACzE,OAAO;IACT,CAAC;IAED,OAAO,CAAC,YAAY,CAAC,IAAI,KAAK,WAAW,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,EAAE,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAAA,CAC5E,CAAC;AAEF,MAAM,CAAC,MAAM,UAAU,GAAG,IAAI,GAAG,CAAC;IAChC,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;IACP,UAAU;IACV,iBAAiB;IACjB,YAAY;IACZ,WAAW;IACX,aAAa;IACb,2BAA2B;IAC3B,WAAW;IACX,eAAe;IACf,iBAAiB;IACjB,OAAO;IACP,UAAU;IACV,UAAU;IACV,SAAS;IACT,OAAO;IACP,UAAU;IACV,yBAAyB;IACzB,uBAAuB;IACvB,gBAAgB;IAChB,QAAQ;IACR,MAAM;IACN,UAAU;IACV,YAAY;IACZ,MAAM;IACN,aAAa;IACb,UAAU;IACV,UAAU;IACV,UAAU;IACV,QAAQ;IACR,UAAU;IACV,WAAW;IACX,SAAS;IACT,UAAU;IACV,OAAO;CACR,CAAC,CAAC"}

package/dist/core/actions/dom/css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/css.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAa,MAAM,oBAAoB,CAAC;AAEhF;;GAEG;AACH,eAAO,MAAM,YAAY,wDA0CxB,CAAC"}
+{"version":3,"file":"css.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/css.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAa,MAAM,oBAAoB,CAAC;AAEhF;;GAEG;AACH,eAAO,MAAM,YAAY,wDA0CxB,CAAC"}

package/dist/core/actions/dom/css.js

@@ -1,3 +1,4 @@
+import { ReactError } from '../../../core/reconciliation/errors/ReactError';
 /**
  * Handles removing, toggling and adding tag styles.
  */
@@ -7,7 +8,7 @@ stylesRaw) => {
     if (typeof stylesRaw !== 'string' &&
         stylesRaw != null &&
         typeof stylesRaw !== 'object') {
-        throw new Error(`Unsupported format of styles`);
+        throw new ReactError(fiber, `Unsupported format of styles`);
     }
     const elementStyle = fiber.element.style;
     const newStyles = typeof stylesRaw === 'string' ? strToStyles(stylesRaw) : (stylesRaw ?? {});

package/dist/core/actions/dom/css.js.map

@@ -1 +1 @@
-{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/css.ts"],"names":[],"mappings":"AAEA;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,KAAmB;AACnB,gEAAgE;AAChE,SAAuB,EACjB,EAAE,CAAC;IACT,IACE,OAAO,SAAS,KAAK,QAAQ;QAC7B,SAAS,IAAI,IAAI;QACjB,OAAO,SAAS,KAAK,QAAQ,EAC7B,CAAC;QACD,MAAM,IAAI,KAAK,CAAC,8BAA8B,CAAC,CAAC;IAClD,CAAC;IAED,MAAM,YAAY,GAAI,KAAK,CAAC,OAAuB,CAAC,KAAK,CAAC;IAC1D,MAAM,SAAS,GACb,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;IAE7E,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACtC,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE,CAAC;YACvD,IAAI,CAAC,CAAC,GAAG,IAAI,SAAS,CAAC,EAAE,CAAC;gBACxB,IAAI,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;oBACtB,YAAY,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;gBACnC,CAAC;qBAAM,IAAI,GAAG,IAAI,YAAY,EAAE,CAAC;oBAC/B,8CAA8C;oBAC9C,YAAY,CAAC,GAAsB,CAAC,GAAG,EAAE,CAAC;gBAC5C,CAAC;YACH,CAAC;QACH,CAAC;QAED,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC;YACrD,IAAI,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;gBACtB,YAAY,CAAC,WAAW,CAAC,GAAG,EAAE,KAAe,CAAC,CAAC;YACjD,CAAC;iBAAM,IAAI,GAAG,IAAI,YAAY,EAAE,CAAC;gBAC/B,8CAA8C;gBAC9C,YAAY,CAAC,GAAsB,CAAC,GAAG,KAAK,CAAC;YAC/C,CAAC;QACH,CAAC;IACH,CAAC;SAAM,CAAC;QACN,KAAK,CAAC,OAAQ,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;IAC1C,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC;AAAA,CAC/B,CAAC;AAEF;;;GAGG;AACH,MAAM,WAAW,GAAG,CAAC,GAAW,EAAa,EAAE,CAAC;IAC9C,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;IAC7B,OAAO,MAAM,CAAC,WAAW,CACvB,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;QACpC,CAAC;QACD,QAAQ,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC;KACnC,CAAC,CACH,CAAC;AAAA,CACH,CAAC;AAEF,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC"}
+{"version":3,"file":"css.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/css.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,oDAAoD,CAAC;AAGhF;;GAEG;AACH,MAAM,CAAC,MAAM,YAAY,GAAG,CAC1B,KAAmB;AACnB,gEAAgE;AAChE,SAAuB,EACjB,EAAE,CAAC;IACT,IACE,OAAO,SAAS,KAAK,QAAQ;QAC7B,SAAS,IAAI,IAAI;QACjB,OAAO,SAAS,KAAK,QAAQ,EAC7B,CAAC;QACD,MAAM,IAAI,UAAU,CAAC,KAAK,EAAE,8BAA8B,CAAC,CAAC;IAC9D,CAAC;IAED,MAAM,YAAY,GAAI,KAAK,CAAC,OAAuB,CAAC,KAAK,CAAC;IAC1D,MAAM,SAAS,GACb,OAAO,SAAS,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC,SAAS,IAAI,EAAE,CAAC,CAAC;IAE7E,IAAI,MAAM,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;QACtC,KAAK,MAAM,GAAG,IAAI,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,MAAM,IAAI,EAAE,CAAC,EAAE,CAAC;YACvD,IAAI,CAAC,CAAC,GAAG,IAAI,SAAS,CAAC,EAAE,CAAC;gBACxB,IAAI,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;oBACtB,YAAY,CAAC,cAAc,CAAC,GAAG,CAAC,CAAC;gBACnC,CAAC;qBAAM,IAAI,GAAG,IAAI,YAAY,EAAE,CAAC;oBAC/B,8CAA8C;oBAC9C,YAAY,CAAC,GAAsB,CAAC,GAAG,EAAE,CAAC;gBAC5C,CAAC;YACH,CAAC;QACH,CAAC;QAED,KAAK,MAAM,CAAC,GAAG,EAAE,KAAK,CAAC,IAAI,MAAM,CAAC,OAAO,CAAC,SAAS,CAAC,EAAE,CAAC;YACrD,IAAI,GAAG,CAAC,QAAQ,CAAC,GAAG,CAAC,EAAE,CAAC;gBACtB,YAAY,CAAC,WAAW,CAAC,GAAG,EAAE,KAAe,CAAC,CAAC;YACjD,CAAC;iBAAM,IAAI,GAAG,IAAI,YAAY,EAAE,CAAC;gBAC/B,8CAA8C;gBAC9C,YAAY,CAAC,GAAsB,CAAC,GAAG,KAAK,CAAC;YAC/C,CAAC;QACH,CAAC;IACH,CAAC;SAAM,CAAC;QACN,KAAK,CAAC,OAAQ,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;IAC1C,CAAC;IAED,KAAK,CAAC,IAAI,CAAC,MAAM,GAAG,SAAS,CAAC;AAAA,CAC/B,CAAC;AAEF;;;GAGG;AACH,MAAM,WAAW,GAAG,CAAC,GAAW,EAAa,EAAE,CAAC;IAC9C,QAAQ,CAAC,KAAK,CAAC,OAAO,GAAG,GAAG,CAAC;IAC7B,OAAO,MAAM,CAAC,WAAW,CACvB,KAAK,CAAC,IAAI,CAAC,QAAQ,CAAC,KAAK,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC;QACpC,CAAC;QACD,QAAQ,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC;KACnC,CAAC,CACH,CAAC;AAAA,CACH,CAAC;AAEF,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,aAAa,CAAC,CAAC"}

package/dist/core/actions/dom/events.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/events.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAErE,eAAO,MAAM,eAAe,oFAwC3B,CAAC"}
+{"version":3,"file":"events.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/events.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAErE,eAAO,MAAM,eAAe,oFAwD3B,CAAC"}

package/dist/core/actions/dom/events.js

@@ -1,3 +1,4 @@
+import { ReactError } from '../../../core/reconciliation/errors/ReactError';
 export const setEventHandler = (fiber, element, name, value) => {
     const { events } = fiber.data;
     if (value == null || value === false) {
@@ -8,22 +9,33 @@ export const setEventHandler = (fiber, element, name, value) => {
         return;
     }
     if (typeof value !== 'function') {
-        throw new Error(`Unsupported format of event handler. It has to be "undefined" or a function`);
+        throw new ReactError(fiber, `Unsupported format of event handler. It has to be "undefined" or a function`);
     }
     // Instead of adding and removing event handlers on every render, we can add a
     // wrapper that calls `events[name]` and update only the internal
     // function when it changes.
     if (!events[name]) {
-        const eventName = name.slice(2).toLowerCase(); // onClick -> click.
+        const capture = name.endsWith('Capture');
+        let eventName = name.slice(2).toLowerCase(); // onClick -> click.
+        if (capture) {
+            eventName = eventName.slice(0, eventName.length - 7);
+        }
+        if (eventName === 'change' &&
+            (fiber.tag === 'input' ||
+                fiber.tag === 'textarea' ||
+                fiber.tag === 'select')) {
+            eventName = 'input'; // Custom behavior. @see `./value.ts`.
+        }
         events[name] = {
             name: eventName,
             handler: value,
+            capture,
             wrapper: (event) => {
                 // Original React doesn't support stopping propagation on `false` return.
                 events[name].handler?.(event);
             },
         };
-        element.addEventListener(eventName, events[name].wrapper);
+        element.addEventListener(eventName, events[name].wrapper, { capture });
     }
     else {
         // The tag is already listening to this event. Just update the internal ref.

package/dist/core/actions/dom/events.js.map

@@ -1 +1 @@
-{"version":3,"file":"events.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/events.ts"],"names":[],"mappings":"AAEA,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,KAAmB,EACnB,OAAgB,EAChB,IAAY,EACZ,KAAmB,EACb,EAAE,CAAC;IACT,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;IAE9B,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,KAAK,EAAE,CAAC;QACrC,IAAI,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;YACjB,uDAAuD;YACvD,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC;QAC9B,CAAC;QACD,OAAO;IACT,CAAC;IAED,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,KAAK,CACb,6EAA6E,CAC9E,CAAC;IACJ,CAAC;IAED,8EAA8E;IAC9E,iEAAiE;IACjE,4BAA4B;IAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;QAClB,MAAM,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,oBAAoB;QACnE,MAAM,CAAC,IAAI,CAAC,GAAG;YACb,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,KAAK;YACd,OAAO,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC;gBACzB,yEAAyE;gBACzE,MAAM,CAAC,IAAI,CAAE,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC;YAAA,CAChC;SACF,CAAC;QACF,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,CAAC,CAAC;IAC5D,CAAC;SAAM,CAAC;QACN,4EAA4E;QAC5E,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,GAAG,KAAK,CAAC;IAC/B,CAAC;AAAA,CACF,CAAC"}
+{"version":3,"file":"events.js","sourceRoot":"","sources":["../../../../src/core/actions/dom/events.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,oDAAoD,CAAC;AAGhF,MAAM,CAAC,MAAM,eAAe,GAAG,CAC7B,KAAmB,EACnB,OAAgB,EAChB,IAAY,EACZ,KAAmB,EACb,EAAE,CAAC;IACT,MAAM,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC,IAAI,CAAC;IAE9B,IAAI,KAAK,IAAI,IAAI,IAAI,KAAK,KAAK,KAAK,EAAE,CAAC;QACrC,IAAI,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;YACjB,uDAAuD;YACvD,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,GAAG,IAAI,CAAC;QAC9B,CAAC;QACD,OAAO;IACT,CAAC;IAED,IAAI,OAAO,KAAK,KAAK,UAAU,EAAE,CAAC;QAChC,MAAM,IAAI,UAAU,CAClB,KAAK,EACL,6EAA6E,CAC9E,CAAC;IACJ,CAAC;IAED,8EAA8E;IAC9E,iEAAiE;IACjE,4BAA4B;IAC5B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,EAAE,CAAC;QAClB,MAAM,OAAO,GAAG,IAAI,CAAC,QAAQ,CAAC,SAAS,CAAC,CAAC;QACzC,IAAI,SAAS,GAAG,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC,oBAAoB;QACjE,IAAI,OAAO,EAAE,CAAC;YACZ,SAAS,GAAG,SAAS,CAAC,KAAK,CAAC,CAAC,EAAE,SAAS,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QACvD,CAAC;QAED,IACE,SAAS,KAAK,QAAQ;YACtB,CAAC,KAAK,CAAC,GAAG,KAAK,OAAO;gBACpB,KAAK,CAAC,GAAG,KAAK,UAAU;gBACxB,KAAK,CAAC,GAAG,KAAK,QAAQ,CAAC,EACzB,CAAC;YACD,SAAS,GAAG,OAAO,CAAC,CAAC,sCAAsC;QAC7D,CAAC;QAED,MAAM,CAAC,IAAI,CAAC,GAAG;YACb,IAAI,EAAE,SAAS;YACf,OAAO,EAAE,KAAK;YACd,OAAO;YACP,OAAO,EAAE,CAAC,KAAY,EAAE,EAAE,CAAC;gBACzB,yEAAyE;gBACzE,MAAM,CAAC,IAAI,CAAE,CAAC,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC;YAAA,CAChC;SACF,CAAC;QACF,OAAO,CAAC,gBAAgB,CAAC,SAAS,EAAE,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,EAAE,EAAE,OAAO,EAAE,CAAC,CAAC;IACzE,CAAC;SAAM,CAAC;QACN,4EAA4E;QAC5E,MAAM,CAAC,IAAI,CAAC,CAAC,OAAO,GAAG,KAAK,CAAC;IAC/B,CAAC;AAAA,CACF,CAAC"}

package/dist/core/actions/dom/value.d.ts

@@ -0,0 +1,18 @@
+import type { FiberNode, TagAttrValue, TagFiberNode } from '../../../types';
+/**
+ * Original React has a very special behavior for the "onChange" event:
+ * - It treats "onChange" as an "onInput" event for form controls
+ * - If the "value" prop is provided and is not `null` or `undefined`, React
+ *   treats the input as "controlled" and ignores user changes by restoring the
+ *   original value after each input event
+ * - Even for controlled inputs, React still calls the "onChange" handler with
+ *   the updated event.target.value before restoring the previous value
+ * - React overrides the property descriptor of the "value" property on the DOM
+ *   element to intercept and track all value changes
+ */
+export declare const setValueAttr: (fiber: TagFiberNode, attrName: "checked" | "value", attrValue: TagAttrValue) => void;
+export declare const changeControlValue: (fiber: FiberNode, element: FormControl, attrName: "checked" | "value", valueRaw: unknown, restoreCursor?: boolean) => void;
+type FormControl = HTMLInputElement | HTMLTextAreaElement | HTMLSelectElement;
+export declare const updateValueStore: (fiber: FiberNode) => void;
+export {};
+//# sourceMappingURL=value.d.ts.map

package/dist/core/actions/dom/value.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"value.d.ts","sourceRoot":"","sources":["../../../../src/core/actions/dom/value.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAEV,SAAS,EACT,YAAY,EACZ,YAAY,EACb,MAAM,oBAAoB,CAAC;AAI5B;;;;;;;;;;GAUG;AACH,eAAO,MAAM,YAAY,uFAsCxB,CAAC;AA2BF,eAAO,MAAM,kBAAkB,6HAiC9B,CAAC;AAgLF,KAAK,WAAW,GAAG,gBAAgB,GAAG,mBAAmB,GAAG,iBAAiB,CAAC;AAE9E,eAAO,MAAM,gBAAgB,4BAK5B,CAAC"}