@symbiote-native/solid 3.0.2 → 3.0.4

package/README.md

@@ -18,16 +18,29 @@ Metro, no custom Babel transformer path.
 
 ## Install
 
+```bash
+npx @symbiote-native/cli new my-app --framework solid
+```
+
+One command, nothing to wire by hand: scaffolds the Babel preset, Metro config, and
+`jsxImportSource` below, plus `@symbiote-native/solid`/`react-native`/`solid-js` as your app's own
+dependencies.
+
+<details>
+<summary>Manual install (no generator — an existing app, or you want to wire it yourself)</summary>
+
 ```bash
 npm install @symbiote-native/solid react-native solid-js
 ```
 
 `react-native` and `solid-js` stay your app's own top-level dependencies — this package only
-replaces the JS renderer that drives them. `npx @symbiote-native/cli new --framework solid` wires
-the Babel preset, Metro config, and `jsxImportSource` below for a new app; wiring them into an
-existing one still follows [`examples/solid`](../../examples/solid) rather than a generator.
+replaces the JS renderer that drives them. Follow [`examples/solid`](../../examples/solid) for the
+Babel preset, Metro config, and `jsxImportSource` below; there is no wiring script for an existing
+app.
+
+</details>
 
-Targets **Solid 1.9**, deliberately not 2.0 (RC as of 2026-08) — 2.0 moves the package to
+Targets **Solid 1.9**, deliberately not 2.0 (still RC) — 2.0 moves the package to
 `@solidjs/universal`, changes `RendererOptions`, and changes the compiled-output shape. Moving to
 it is a rewrite of `src/renderer.ts`, not a range bump.
 
@@ -36,29 +49,49 @@ it is a rewrite of `src/renderer.ts`, not a range bump.
 ## Use it
 
 The app is ordinary Solid — the native primitives are plain lowercase intrinsic tags, no import
-needed:
+needed. Styling is a CSS class against a plain `.css` file — the convention every example app
+here follows:
 
 ```jsx
 import { createSignal } from 'solid-js';
+import './App.css';
 
 export default function App() {
   const [count, setCount] = createSignal(0);
   return (
-    <view style={{ padding: 24 }}>
+    <safe-area-view class="screen">
       <text>Taps: {count()}</text>
       <pressable onPress={() => setCount(c => c + 1)}>
         <text>Tap me</text>
       </pressable>
-    </view>
+    </safe-area-view>
   );
 }
 ```
 
+```css
+/* App.css */
+.screen {
+  flex: 1;
+  align-items: center;
+  justify-content: center;
+  padding: 24px;
+}
+```
+
+<details>
+<summary>Native entry point (index.js) — already scaffolded by <code>npx @symbiote-native/cli new --framework solid</code></summary>
+
 The zero-config entry wires the RN-backed host seams and registers the app in one call — this is
 what [`examples/solid`](../../examples/solid) actually uses:
 
 ```js
 // index.js
+
+// Registers host behaviors (Image, Pressable, Switch, ...) that /bootstrap alone doesn't
+// reach; deleting this breaks them silently (Metro's production inlineRequires makes a
+// side-effect-only barrel import go lazy, see register.ts).
+import '@symbiote-native/solid';
 import { createApp } from '@symbiote-native/solid/bootstrap';
 import App from './App';
 import { name as appName } from './app.json';
@@ -81,6 +114,8 @@ AppRegistry.registerRunnable(appName, ({ rootTag }) => {
 });
 ```
 
+</details>
+
 `babel.config.js` needs the adapter's preset LAST — Babel applies presets in reverse order, so
 listing it last runs it first, claiming the JSX before RN's own React-JSX transform can:
 
@@ -100,11 +135,11 @@ Nothing rewrites the source on the way there, so this adapter carries no Babel p
 ## `./renderer` is a compiler target, not a convenience export
 
 `babel-preset-solid` with `generate: 'universal'` rewrites JSX into direct calls imported from the
-`moduleName` it was given. So `src/renderer.ts` exports eleven specific names because generated code
+`moduleName` it was given. So `src/renderer.ts` exports twelve specific names because generated code
 imports them; dropping one breaks bundling with a module-not-found on an import nobody wrote. The
-list (`createElement`, `createTextNode`, `insertNode`, `insert`, `setProp`, `use`, `effect`, `memo`,
-`createComponent`, `spread`, `mergeProps`) was verified by compiling representative JSX, not read off
-the docs.
+list (`render`, `createElement`, `createTextNode`, `insertNode`, `insert`, `setProp`, `use`, `effect`,
+`memo`, `createComponent`, `spread`, `mergeProps`) was verified by compiling representative JSX, not
+read off the docs.
 
 ## Three things the universal runtime does that the seam has to answer correctly
 

package/build/components/virtualized-list/shared.jsx

@@ -14,13 +14,9 @@
 // and assembles the host elements. Lists have no Descriptor render fn — the cell content is the
 // user's own subtree (`symbiote-add-component` §0, category 2).
 //
-// SINCE 2026-09-11 THIS FILE NO LONGER BUILDS THE CONTENT NODE ITSELF. `registerScrollViewBehavior()`
-// makes the tag's own `buildStructure` do that (the same content node ScrollView's bare tag gets
-// anywhere else), and this file reads it back off `scroll.childHost` rather than constructing a
-// second one — building one here too would nest a content view inside the behavior's own
-// (`core/components/src/behaviors/scroll-view/shared.ts`'s header names this precondition). The
-// RefreshControl placement (a sibling on iOS, an inverting wrap on Android) moved the same way: it is
-// an ordinary child now, and the behavior's `claimedChildren` decides where it lands.
+// THIS FILE NO LONGER BUILDS THE CONTENT NODE ITSELF: `registerScrollViewBehavior()`'s tag-owned
+// `buildStructure` does that, read back off `scroll.childHost` rather than built a second time
+// here. RefreshControl is an ordinary child now; `claimedChildren` decides where it lands.
 //
 // WHY THIS FILE STILL HAND-AUTHORS THE SCROLL TAG VIA `createElement` INSTEAD OF PLAIN JSX
 // (`<scroll-view>{listBody}</scroll-view>`), unlike a component with no dynamic children. Solid's
@@ -496,24 +492,12 @@ export function createVirtualizedList() {
             // A spread of a CALL compiles to mergeProps(() => …), so the separator's props stay live.
             return <Separator {...separatorPropsFor(index)}/>;
         }
-        // RN renders a separator in the gap AFTER a cell, and only while there is a following rendered
-        // cell — never after the window's last one.
-        // RN renders a separator in the gap AFTER a cell, and only while there is a following rendered
-        // cell — never after the window's last one, and never after the force-mounted sticky cell, which
-        // is not adjacent to the window.
+        // RN renders a separator in the gap AFTER a cell, only while there is a following rendered
+        // cell — never after the window's last one, and never after the force-mounted sticky cell,
+        // which is not adjacent to the window.
         // RN gates the separator on the last index of the DATA, not of the WINDOW
-        // (VirtualizedList.js:793 `const end = getItemCount(data) - 1`), and now that the separator
-        // lives INSIDE the measuring wrapper that distinction is load-bearing: gating on the window
-        // would make a cell's own measured height change as the window slides past it. Device-measured
-        // 2026-08-19 as a run of cells all shifting by exactly the divider's 1px.
-        // Nothing about the WINDOW may enter this predicate. The separator lives inside the measuring
-        // wrapper, so whatever decides to render it decides the cell's own height — and a height that
-        // depends on where the window happens to sit moves the content under the user every time the
-        // window slides. Two window-dependent terms were removed after being measured on device
-        // 2026-08-19, each as a run of cells shifting by exactly the divider's 1px: gating on the
-        // window's `last` (RN gates on the data's, VirtualizedList.js:793), and excluding the
-        // force-mounted sticky cell. RN excludes neither — its sticky header keeps its separator like
-        // any other cell.
+        // (VirtualizedList.js:793): the separator lives INSIDE the measuring wrapper, so gating on the
+        // window would make a cell's own measured height change as the window slides past it.
         const hasSeparatorAfter = (index) => props.ItemSeparatorComponent !== undefined && index < metrics().count - 1;
         // Records a sticky header's measured y (RN's _headerLayoutYs) so the header AHEAD of it can
         // compute its collision point; without it every header would stick indefinitely.
@@ -554,13 +538,9 @@ export function createVirtualizedList() {
                 index: index(),
                 separators: makeSeparators(index()),
             })));
-            // The separator rides INSIDE the measuring wrapper, where RN's own cell renderer puts it
-            // (VirtualizedListCellRenderer.js:218-221). As a SIBLING it is an extra flex child, so the
-            // chrome between two cells is gap + separator + gap while a spacer collapsing that region
-            // replaces it with one gap — every cell below the leading spacer then lands short by
-            // (separator + gap), and the content jumps by that much each time the window's first index
-            // moves. Measured at exactly 17px on device 2026-08-19 (a 1px divider under a 16px container
-            // gap); see .claude/rules/list-geometry-feedback-loop.md.
+            // The separator rides INSIDE the measuring wrapper (VirtualizedListCellRenderer.js:218-221).
+            // As a SIBLING it would be an extra flex child, landing every cell below the leading spacer
+            // short by (separator + gap) — see `list-geometry-feedback-loop.md`.
             const separator = (<Show when={hasSeparatorAfter(index())}>
           <view>{separatorElement(index())}</view>
         </Show>);

package/build/components/virtualized-list/sticky-header.jsx

@@ -1,15 +1,9 @@
 // Sticky headers — the Solid lifecycle half of the JS layer RN implements in ScrollView.js /
 // ScrollViewStickyHeader.js.
 //
-// PRIVATE TO VIRTUALIZED-LIST since 2026-09-11. It used to live under `../scroll-view` and back
-// that component's `stickyHeaderIndices` too; the tag `<scroll-view>` now honors that prop through
-// the engine's own `sticky-header` intrinsic (`core/components/src/behaviors/scroll-view/sticky.ts`)
-// with no adapter code at all — see that primitive's props header. VirtualizedList still needs its
-// OWN implementation because it hand-builds its scroll host (`shared.tsx`'s own header explains
-// why) rather than emitting the tag, so it wraps a flagged CELL itself instead of leaning on the
-// engine's per-child walk. `wrapStickyHeaders`/`IStickyWrapInputs` — the generic child-array wrapper
-// ScrollView used and this file never called — were dropped with the move; `virtualized-list/
-// shared.tsx` wraps the cell it already owns directly.
+// PRIVATE TO VIRTUALIZED-LIST: `<scroll-view>` honors `stickyHeaderIndices` via the engine's own
+// `sticky-header` intrinsic with no adapter code. VirtualizedList still needs its OWN
+// implementation because it hand-builds its scroll host, so `shared.tsx` wraps the cell directly.
 //
 // RN does stickiness PURELY IN JS: ScrollView wraps each flagged child in a ScrollViewStickyHeader
 // fed by ONE scroll AnimatedValue, and the native scroll view ignores `stickyHeaderIndices`

package/build/renderer.js

@@ -60,17 +60,11 @@ export function replaceText(textNode, value) {
     setEngineText(textNode, asText(value));
     requestCommit();
 }
-// solid-js/universal hands createTextNode/replaceText the JSX child value UNCONVERTED, not a
-// stringified one: normalizeIncomingArray() pushes `createTextNode(item)` straight from the
-// children array, so `<Text>{list().length} tiles</Text>` arrives here as the NUMBER 3. On the DOM
-// that is invisible — document.createTextNode coerces — which is why upstream never had to, and why
-// React's and Vue's adapters (whose frameworks stringify first) never saw it either. Here the value
-// lands on RCTRawText's `text`, which Fabric parses as a std::string: a number fails the
-// conversion, convertRawProp logs and falls back to the DEFAULT empty string, and an empty first
-// fragment then ABORTS the app inside BaseTextShadowNode::buildAttributedString — a native SIGABRT
-// with nothing in the JS stack to point at. Diagnosed on the iOS simulator 2026-08-19. The
-// parameter is typed `string` by RendererOptions, so the guard reads as redundant; it is not, and
-// `unknown` is what makes that honest rather than a cast.
+// solid-js/universal hands createTextNode/replaceText the JSX child value UNCONVERTED —
+// `<Text>{list().length} tiles</Text>` arrives here as the NUMBER 3. RCTRawText's `text` parses
+// as a std::string: a number falls back to empty, aborting inside buildAttributedString.
+// Typed `unknown` rather than `string` (which RendererOptions declares) so the runtime guard
+// below isn't erased as dead code.
 function asText(value) {
     return typeof value === 'string' ? value : String(value);
 }
@@ -102,20 +96,11 @@ export function removeNode(parent, node) {
         removeEngineChild(parent, node);
     requestCommit();
 }
-// RN's two Text defaults left this renderer on 2026-09-18, and the per-key FOLD went with them. It
-// was the last and subtlest of the three shapes this file tried: a create-time SEED (gone a month
-// earlier, 6 000 wasted crossings per 1 000-row create), then a substitute-on-`undefined`, then a
-// fold per key — because `?? 'tail'` has to catch a null too, and substituting only on `undefined`
-// meant `<text ellipsizeMode={null}>` committed null, device-only and silent.
-//
-// All three were answering a question the layer below now answers for everyone: the rule reads the
-// AUTHORED bag at payload time (`foldTextDefaults`, `SymbioteFabricProps.cpp`), where a null, an
-// explicit `undefined` and an absent prop are all simply "not a value the author chose". The
-// null case that cost this file two revisions is `ellipsize->isNull()` there, in one place, for
-// every adapter.
-// The `id` -> `nativeID` fold and its `aliasedNodes` WeakSet left this file on 2026-09-18. The
-// memory was the right shape and the wrong LAYER: `routeProp` carries it now, so all five adapters
-// resolve the precedence identically instead of three of them doing it three ways.
+// RN's two Text defaults are answered below the adapter now: the rule reads the AUTHORED bag at
+// payload time (`foldTextDefaults`, `SymbioteFabricProps.cpp`), where a null, an explicit
+// `undefined` and an absent prop are all "not a value the author chose" — one rule, every adapter.
+// The `id` -> `nativeID` fold lives in `routeProp` now, so all five adapters resolve the
+// precedence identically instead of each doing it their own way.
 // `multiline` selects between TWO Fabric views, so the TAG decides and no prop write moves a node
 // between them. An author writing `<text-input multiline>` instead of `<text-input-multiline>` gets
 // the single-line view with a prop no ViewConfig on it declares — two silent divergences.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/solid",
-  "version": "3.0.2",
+  "version": "3.0.4",
   "description": "SymbioteNative's Solid adapter — a solid-js/universal createRenderer driving real native iOS/Android views through the same engine as every other adapter.",
   "keywords": [
     "react-native",
@@ -62,19 +62,19 @@
   "dependencies": {
     "babel-preset-solid": "^1.9.12",
     "typescript": "~6.0.0",
-    "@symbiote-native/components": "3.1.0",
-    "@symbiote-native/css-parser": "0.5.0"
+    "@symbiote-native/components": "3.1.2",
+    "@symbiote-native/css-parser": "0.5.2"
   },
   "peerDependencies": {
     "solid-js": ">=1.9.0",
     "react-native": ">=0.86",
-    "@symbiote-native/engine": "^1.3.0"
+    "@symbiote-native/engine": "^1.3.1"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
     "solid-js": "^1.9.14",
-    "@symbiote-native/engine": "1.3.0",
-    "@symbiote-native/test-utils": "0.4.2"
+    "@symbiote-native/engine": "1.3.1",
+    "@symbiote-native/test-utils": "0.4.4"
   },
   "scripts": {
     "typecheck": "tsc --build",