@symbiote-native/solid 0.0.1 → 1.0.0

package/README.md

@@ -3,24 +3,24 @@
 SolidJS adapter for SymbioteNative. Compiled Solid JSX drives real native iOS/Android views through
 the same `@symbiote-native/engine` every other adapter uses — React's renderer is never in the path.
 
-**Status: L4 in progress (parity phase).** The renderer seam, `mount`/`unmount`, the primitives, the
-stateful touch components, the Touchable family, Button / ImageBackground / InputAccessoryView,
-StatusBar and the list family all ship at full parity with the React reference — off
-`@symbiote-native/components`, via `descriptorToSolid` where the component has a shared render fn.
-The engine-owned runtime modules are re-exported from the barrel. Still absent: `createPortal` and
-`createTunnel`, both of which need a same-surface replacement for `solid-js/web`'s DOM-bound
-`Portal`/`Dynamic`. See `symbiote-new-adapter` §7 for what each layer means and why the adapter is
-built in that order.
+**Status: L4 done (parity phase complete).** The renderer seam, `mount`/`unmount`, the
+primitives, the stateful touch components, the Touchable family, Button / ImageBackground /
+InputAccessoryView, StatusBar and the list family all ship at full parity with the React
+reference — off `@symbiote-native/components`, via `descriptorToSolid` where the component has a
+shared render fn. The engine-owned runtime modules are re-exported from the barrel. `Portal`
+(same-surface content relocation, this adapter's twin of React's `createPortal`) and
+`createTunnel` (cross-surface) both ship, built over the universal renderer rather than
+`solid-js/web`'s DOM-bound `Portal`/`Dynamic`. `Dynamic` itself stays absent by design — nothing
+here needs it, and no other adapter ships a twin for parity to require one. See
+`symbiote-new-adapter` §7 for what each layer means.
 
 Solid's own control-flow `Switch`/`Match` are NOT re-exported from this package: `Switch` collides
 with RN's Switch component, which every adapter must export under that name. Import the control-flow
 pair from `solid-js` directly.
 
-Publishing is gated by `"private": true` in `package.json`, which is what
-`scripts/lib/publishable-packages.mjs` filters on — so `changeset publish` and the pkg.pr.new canary
-both skip this package until that flag comes off. Without it `0.0.0` (a version absent from npm) would
-be published on the next release run, shipping a reduced surface and violating the repo's
-`<adapters_reach_full_feature_parity>` invariant. Remove the flag in the commit that finishes parity.
+The adapter is a regular publishable package (`@symbiote-native/solid` on npm, alongside React,
+Vue, Svelte and Angular) — it carries no `"private"` flag, so `changeset publish` and the
+pkg.pr.new canary cover it the same as every other adapter.
 
 ## Why Solid needs no DOM shim and no Metro transformer
 
@@ -61,6 +61,17 @@ exactly what react-refresh's `isLikelyComponentType` heuristic looks for. It the
 React Fiber tree that does not exist in this path, and the update is swallowed with no error. Force a
 full reload instead: `unstable_forceFullRefreshPatterns: [/\.tsx$/]`.
 
+## Host-primitive lowering — `<View>`/`<Text>`/`<Pressable>` compile to intrinsics, not components
+
+`babel-preset-solid` (wired above) runs `babel-lower-host-primitives.cjs` before compiling: a
+`<View>`/`<Text>` with no reactive prop, and a `<Pressable>` whose `style`/children don't need a
+component instance, rewrite to the engine's intrinsic tags (`symbiote-view`, `symbiote-text`,
+`symbiote-pressable`) instead of going through `createComponent` + a props Proxy. Nothing in app
+code has to opt in — the preset does it transparently, and a call site that can't be lowered
+(a spread, a render-prop child, an unreadable attribute) falls back to the component path
+unchanged. See root `CLAUDE.md`, "Where we stand against stock React Native", for the measured
+device numbers this bought — do not hand-copy them here, they move with every engine/adapter cut.
+
 ## `./renderer` is a compiler target, not a convenience export
 
 `babel-preset-solid` with `generate: 'universal'` rewrites JSX into direct calls imported from the
@@ -123,7 +134,7 @@ reached the same single-root conclusion for its own reasons.
 
 ## Reference
 
-- The canary app: `examples/solid` (its README covers the tarball loop and what is verified).
+- The canary app: `examples/solid` (its README covers running it and the checks it carries).
 - The engine API this targets: the `symbiote-engine-core` skill, `core/engine/src/node.ts`.
 - Building/porting an adapter: the `symbiote-new-adapter` skill.
 - The nodeOps table this mirrors: `adapters/vue/src/renderer/index.ts`.

package/babel-lower-host-primitives.cjs

@@ -0,0 +1,323 @@
+// Compile-time lowering of <View>/<Text> to the intrinsic tags the renderer maps to Fabric.
+//
+// WHY. Solid charges a props PROXY per component: `<View>` compiles to `createComponent(View, …)`,
+// and the component body then runs splitProps + withStableKeys + mergeProps + spread. Measured
+// 2026-08-23 on a 4 000-row create: keys/get/getOwnPropertyDescriptor traps 16.2% of the whole
+// create, splitProps another 6.1%. Lowered, the same element compiles to `createElement(tag)` plus
+// one `setProp` per attribute — no Proxy, no bag object, no spread render effect. Headless A/B with
+// both arms compiled for real and createNode asserted equal at 36 002: -24.3% min / -30.0% median.
+//
+// The Vue twin is the nodeTransform in adapters/vue/metro-vue-transformer.cjs, and the two share
+// their central rule: lower ONLY a tag this file imported from us, never a bare name match, or an
+// app's own <View> gets rewritten.
+//
+// THE SECOND RULE IS THE ONE THAT KEEPS IT HONEST: lower only when the WHOLE attribute set is
+// visible. The wrapper components do real work besides forwarding — resolveAccessibilityProps
+// folds aria-*/role into the composite accessibilityState/accessibilityValue, and `id` is RN's
+// W3C alias for `nativeID`. Deleting the wrapper without carrying those over breaks accessibility
+// silently. `id` is a pure rename and is done below FROM THE SHARED SPEC; the aria fold is a BAG
+// operation, so an
+// element carrying aria-*/role — or a spread whose keys cannot be read — is left as a component.
+// A folded-at-compile-time aria bag is a possible follow-up (the bag exists statically, so it
+// would cost nothing at runtime); refusing is what makes shipping this safe without it.
+//
+// .cjs because Babel require()s it and this package is "type": "module".
+
+// The tag map and the per-tag folds come from the SHARED spec, not from a copy here. Four
+// transforms carried their own before it existed and they had already disagreed on `id` (see that
+// file's `aliases` comment). Data only — every line of AST work below stays this adapter's, and so
+// does the whole refusal mechanism; only the SPECIFICATION is shared.
+const {
+  HOST_PRIMITIVES,
+  REFUSAL_CATEGORIES,
+} = require('@symbiote-native/components/host-primitives');
+
+const SOURCE = '@symbiote-native/solid';
+
+// name -> a projection of the shared spec. Built once at plugin load, so the per-element path stays
+// two Map lookups.
+//
+// This is a WHITELIST, and it fails silently in one direction: a field the shared spec grows and
+// this list does not copy simply never reaches the detections, which then behave as if it were
+// absent. Cost measured 2026-08-31 — `intrinsicWhen` was implemented end to end and every
+// multiline case still lowered to the single-line tag, because the field was dropped here. Add a
+// field to the spec, add it here.
+const LOWERABLE = new Map(
+  Object.entries(HOST_PRIMITIVES).map(([name, spec]) => [
+    name,
+    {
+      intrinsic: spec.intrinsic,
+      aliases: new Map(Object.entries(spec.aliases)),
+      // Every primitive refuses on the bag fold and on anything unreadable. A primitive whose
+      // STATE the template can observe refuses on more, and only the spec knows which those are —
+      // `observesState` is set for a tag the shared spec marks that way, so a transform that has
+      // not implemented the extra detections simply never sees such a tag in its map.
+      observesState: spec.observesState === true,
+      // The two-intrinsic selector (`{ prop, intrinsic }`), absent for a primitive with one tag.
+      intrinsicWhen: spec.intrinsicWhen,
+    },
+  ]),
+);
+
+function attributeName(attribute) {
+  const { name } = attribute;
+  if (name.type === 'JSXIdentifier') return name.name;
+  // JSXNamespacedName — `aria-label` parses as an identifier, but `xml:lang` style names land here.
+  return `${name.namespace.name}:${name.name.name}`;
+}
+
+// Every local name bound to a lowerable export of @symbiote-native/solid in THIS file, honouring
+// `import { View as Box }`. A file that imports nothing from us yields an empty map and is skipped
+// whole.
+function lowerableLocalNames(programPath) {
+  const names = new Map();
+  programPath.node.body.forEach(statement => {
+    if (
+      statement.type !== 'ImportDeclaration' ||
+      statement.source.value !== SOURCE
+    )
+      return;
+    statement.specifiers.forEach(specifier => {
+      if (specifier.type !== 'ImportSpecifier') return;
+      const imported =
+        specifier.imported.type === 'Identifier'
+          ? specifier.imported.name
+          : specifier.imported.value;
+      const spec = LOWERABLE.get(imported);
+      if (spec !== undefined) names.set(specifier.local.name, spec);
+    });
+  });
+  return names;
+}
+
+// REFUSAL_CATEGORIES.renderPropChild — a child function that TAKES the state.
+//
+// ARITY, not `typeof`, and that distinction is the whole rule. A zero-argument arrow is an ordinary
+// Solid child (`JSX.Element` covers `() => Element`), exactly as `<For>`'s map fn is; only a
+// function that accepts the state argument is a render prop. Measured over `examples/solid`: 12 of
+// the 19 `<Pressable>` sites pass a function child and TEN of those are zero-arity, so refusing on
+// `typeof` alone would throw away ten lowerable sites — including `ActionButton`, whose one
+// definition is instantiated 146 times.
+function isRenderPropChild(child) {
+  if (child.type !== 'JSXExpressionContainer') return false;
+  const { expression } = child;
+  return (
+    (expression.type === 'ArrowFunctionExpression' ||
+      expression.type === 'FunctionExpression') &&
+    expression.params.length >= 1
+  );
+}
+
+// A JSX element is lowerable only if every attribute is a plain, named one we can account for —
+// plus, for a state-observing primitive, only if nothing in it reads that state.
+function canLower(element, spec, types) {
+  const { openingElement } = element;
+  // Named attributes only — a spread cannot be enumerated
+  // (REFUSAL_CATEGORIES.unreadableAttributeSet).
+  //
+  // The category's STATED reason — that a transform cannot fold `id` -> `nativeID` inside a bag — is
+  // DEAD here, measured 2026-08-31: this adapter also folds at runtime (`renderer.ts`,
+  // `foldAliasKey`), which sees every key whatever shape it arrived in, and a lowered
+  // `<symbiote-view {...bag} />` commits a payload byte-identical to the wrapper's
+  // (`src/spread-fold-parity.test.tsx`). The refusal stands on two OTHER grounds it never named,
+  // both measured by lifting it and compiling:
+  //
+  //   <TextInput {...bag} />   ->  symbiote-text-input, whatever `bag.multiline` holds. The
+  //                                single-line tag is a different NATIVE VIEW and no later prop
+  //                                write repairs it (REFUSAL_CATEGORIES.dynamicIntrinsicChoice).
+  //   <Pressable {...bag} />   ->  no `activeStyle` emitted. The same functional style written
+  //                                directly emits it; inside a bag the expansion never runs, so a
+  //                                pressed style silently stops existing.
+  //
+  // So: a refuted rationale is not a refuted verdict. Do not lift this because the alias half is
+  // covered — check what ELSE reads the attribute list first.
+  //
+  // `role` / `aria-*` used to refuse here too, on the
+  // grounds that their fold needs to see sibling keys and a per-key element path cannot reproduce
+  // it. That was true of the ELEMENT path and is no longer true of anything: the fold moved into
+  // the engine (`core/engine/src/accessibility-props.ts`, called from `fabricProps` — the one place
+  // the whole bag is visible on both commit paths), so a lowered element gets it exactly as a
+  // wrapped one does. Proven on the committed payload, both arms, in `src/aria-fold-parity.test.tsx`.
+  const attributesAreReadable = openingElement.attributes.every(
+    attribute => attribute.type === 'JSXAttribute',
+  );
+  if (!attributesAreReadable) return false;
+  if (!selectsIntrinsicStatically(openingElement, spec)) return false;
+  // BEFORE the `observesState` early-return, not after. It rode below it while the only ref-refusing
+  // primitive was Pressable, which observes state — a coincidence, and TextInput broke it: it
+  // observes nothing, so the early-return fired first and a `<TextInput ref>` lowered anyway. The
+  // two questions are independent, so the checks are ordered by what they ask, not by what happened
+  // to work.
+  if (refWouldChangeSurface(spec) && openingElement.attributes.some(isInstanceBinding))
+    return false;
+  // Everything below is about a primitive whose STATE the template can observe.
+  if (!spec.observesState) return true;
+  // A functional `style` NEVER refuses, and since 2026-09-01 it is not rewritten either: the
+  // expression rides through unchanged and `routeProp` resolves it at both values of `pressed`
+  // (`isStyleCallback`, `core/engine/src/node.ts`). The build-time split that used to live here was
+  // removed after measuring it — `src/state-style-cost.bench.test.ts` — because it emitted TWO
+  // writes per node where the callback emits one, so it cost run time rather than saving it.
+  return !element.children.some(isRenderPropChild);
+}
+
+// REFUSAL_CATEGORIES.dynamicIntrinsicChoice.
+//
+// A primitive whose `intrinsicWhen` is set picks between TWO Fabric views by a prop —
+// `symbiote-text-input` vs `symbiote-text-input-multiline`, which are different native views rather
+// than one view with a flag (`core/components/src/view/render-text-input.ts`). The transform prints
+// a STATIC tag name, so it can only make that choice when the value is a compile-time literal.
+//
+// The refusal is stricter than the neighbouring ones and the difference is worth keeping in view:
+// an unreadable ATTRIBUTE VALUE means a prop arrives wrong, and a later write can still correct it.
+// Here the wrong NATIVE VIEW is committed, and no subsequent prop write repairs that — the node
+// would have to be destroyed and recreated. So a value this cannot read statically keeps the
+// component, which resolves the choice at runtime where the value is known.
+//
+// IDENTITY, not truthiness. The render fn is `view.multiline ? MULTILINE : SINGLE`, so truthiness
+// is what the RUNTIME does, and describing the compile-time check that way makes `multiline={1}`
+// look like something this should resolve. It must not: only three shapes are accepted — a bare
+// attribute is `true`, a boolean LITERAL is itself, an absent prop is `false` — and everything else
+// refuses, a truthy non-boolean literal included. A check justified by truthiness would let `{1}`
+// through at the next edit, which is exactly the silently-wrong native view the refusal exists to
+// prevent. Recorded as identity in the shared spec for the same reason.
+function staticTruthOf(openingElement, propName) {
+  const attribute = openingElement.attributes.find(
+    candidate =>
+      candidate.type === 'JSXAttribute' &&
+      attributeName(candidate) === propName,
+  );
+  if (attribute === undefined) return false;
+  if (attribute.value === null) return true;
+  if (attribute.value.type !== 'JSXExpressionContainer') return undefined;
+  const { expression } = attribute.value;
+  return expression.type === 'BooleanLiteral' ? expression.value : undefined;
+}
+
+function selectsIntrinsicStatically(openingElement, spec) {
+  return (
+    spec.intrinsicWhen === undefined ||
+    staticTruthOf(openingElement, spec.intrinsicWhen.prop) !== undefined
+  );
+}
+
+function intrinsicFor(openingElement, spec) {
+  if (spec.intrinsicWhen === undefined) return spec.intrinsic;
+  return staticTruthOf(openingElement, spec.intrinsicWhen.prop) === true
+    ? spec.intrinsicWhen.intrinsic
+    : spec.intrinsic;
+}
+
+// REFUSAL_CATEGORIES.instanceBoundDirective. The criterion is NOT "does the component expose a
+// ref" — that was a proxy, and it held only while two primitives existed. The rule is: would
+// lowering hand the app something DIFFERENT from what the component hands it? A lowering transform
+// is an optimisation, and an optimisation that moves the observable surface in EITHER direction is
+// a bug. Three shapes, one rule, all readable from the components' own props types:
+//
+//   View, Text   ref?: Ref<IHostInstance>      lowered yields the same node    -> lower
+//   Pressable    no ref declared               lowering would ADD a handle     -> refuse
+//   TextInput    ref?: Ref<ITextInputHandle>   lowering would SWAP the handle  -> refuse
+//
+// TextInput is the case that exposed the proxy: it declares a ref, so the old criterion said
+// "lower", and a lowered `<TextInput ref>` silently dropped `clear`, `isFocused` and
+// `setSelection` — the component's handle replaced by a bare public instance. Costing an app three
+// methods is exactly as wrong as granting it one it never had.
+//
+// PER-ADAPTER by construction, which is why this is a list here and not a field on the shared
+// spec: what a ref yields is a fact about THIS adapter's props types, and a correct adapter can
+// answer differently — Vue refuses on every primitive, because a Vue template ref yields the
+// component instance rather than the host node whatever the component declares.
+//
+// Kept honest by `ref-refusal-matches-components.test.ts`, which re-derives the answer from each
+// component source: a hand-written list of adapter members is what went stale three times this
+// month.
+// INVERTED 2026-09-01, and the inversion is the point rather than the contents. This was a
+// denylist of intrinsics that refuse a `ref`, so every primitive added to the spec defaulted to
+// LOWERING one — and the newest member falls out of a hand-written list every time, which is the
+// failure mode this repo has now recorded four times. As a denylist that default is a correctness
+// bug (a lowered element hands back an object the component never did); as an allowlist the same
+// omission costs only coverage, which is the direction a default should fail in.
+//
+// A name earns its place here by the criterion in `ref-refusal-matches-components.test.ts`: the
+// component hands a `ref` the ENGINE NODE, either by declaring `ref?: Ref<IHostInstance>` or by
+// rendering through `descriptorToSolid`, whose `spread` calls a bag ref with the node it built. Any
+// other answer — a different handle, or no ref at all — means lowering would move the surface.
+const INTRINSICS_YIELDING_HOST_REF = new Set([
+  'symbiote-view',
+  'symbiote-text',
+  'symbiote-image',
+]);
+
+
+function refWouldChangeSurface(spec) {
+  return !INTRINSICS_YIELDING_HOST_REF.has(spec.intrinsic);
+}
+
+function isInstanceBinding(attribute) {
+  return (
+    attribute.type === 'JSXAttribute' && attributeName(attribute) === 'ref'
+  );
+}
+
+// Per TAG, not global: the spec gives each primitive its own alias map, and reading it per tag is
+// what keeps this honest if they ever stop agreeing.
+function renameAliasedAttributes(openingElement, aliases, types) {
+  openingElement.attributes.forEach(attribute => {
+    // A spread has no name, and the author's own spread refuses in `canLower`, so nothing this
+    // loop sees is one. It used to be reachable: the state-style pass emitted a spread for an
+    // opaque style, and that pass is gone.
+    if (attribute.type !== 'JSXAttribute') return;
+    const renamed = aliases.get(attributeName(attribute));
+    if (renamed !== undefined) attribute.name = types.jsxIdentifier(renamed);
+  });
+}
+
+module.exports = function lowerHostPrimitives({ types }) {
+  return {
+    name: 'symbiote-solid-lower-host-primitives',
+    visitor: {
+      Program(programPath) {
+        const names = lowerableLocalNames(programPath);
+        if (names.size === 0) return;
+        programPath.traverse({
+          JSXElement(elementPath) {
+            const { openingElement, closingElement } = elementPath.node;
+            const tag = openingElement.name;
+            if (tag.type !== 'JSXIdentifier') return;
+            const spec = names.get(tag.name);
+            if (spec === undefined) return;
+            // A shadowing local binding (a parameter or a `const View = …` in scope) is NOT our
+            // import, even though the name matches. Only rewrite when the binding at this use site
+            // is still the module-level import.
+            const binding = elementPath.scope.getBinding(tag.name);
+            if (binding === undefined || binding.kind !== 'module') return;
+            if (!canLower(elementPath.node, spec, types)) return;
+            // Read BEFORE the passes below rewrite attributes — `renameAliasedAttributes` could
+            // in principle rename the selector out from under the choice.
+            const intrinsic = intrinsicFor(openingElement, spec);
+            renameAliasedAttributes(openingElement, spec.aliases, types);
+            openingElement.name = types.jsxIdentifier(intrinsic);
+            if (closingElement)
+              closingElement.name = types.jsxIdentifier(intrinsic);
+          },
+        });
+      },
+    },
+  };
+};
+
+// Attached AFTER the plugin assignment on purpose: `module.exports = fn` replaces the object, so a
+// named export written above it is silently discarded. Exists only so the test below can compare
+// this list against the component sources.
+module.exports.INTRINSICS_YIELDING_HOST_REF = INTRINSICS_YIELDING_HOST_REF;
+
+// The spec fields this transform reads, named so `spec-projection-covers-fields.test.ts` can check
+// the whitelist above against what `HOST_PRIMITIVES` actually carries. `defaults` is deliberately
+// absent: prop defaults are seeded at RUNTIME by the renderer (`seedTextDefaults`), where a patch
+// that clears a prop can restore them — a compile-time copy would cover only the initial render.
+module.exports.SPEC_FIELDS_READ = [
+  'intrinsic',
+  'aliases',
+  'observesState',
+  'intrinsicWhen',
+];
+module.exports.SPEC_FIELDS_IGNORED = ['defaults'];

package/babel-preset.cjs

@@ -24,6 +24,11 @@
 // React-JSX transform gets a chance to claim the same JSX nodes.
 module.exports = function symbioteSolidBabelPreset(_api, options = {}) {
   return {
+    // Babel runs PLUGINS before PRESETS, which is exactly the order this needs: the lowering
+    // rewrites <View>/<Text> to their intrinsic tags while they are still JSX, so babel-preset-solid
+    // then compiles them as elements (createElement + setProp) instead of as components
+    // (createComponent + a props Proxy). Reversed, there would be nothing left to rewrite.
+    plugins: [require('./babel-lower-host-primitives.cjs')],
     presets: [
       [
         require('babel-preset-solid'),

package/build/bootstrap.d.ts

@@ -0,0 +1,7 @@
+import type { Component } from 'solid-js';
+import { type IBootstrapHostOptions } from '@symbiote-native/components/bootstrap';
+export type { IBootstrapHostOptions } from '@symbiote-native/components/bootstrap';
+export type ISymbioteSolidApp = {
+    mount(appName: string): void;
+};
+export declare function createApp(RootComponent: Component, options?: IBootstrapHostOptions): ISymbioteSolidApp;

package/build/bootstrap.js

@@ -0,0 +1,18 @@
+// Zero-config app entry, the Solid twin of adapters/vue/src/bootstrap.ts and
+// adapters/svelte/src/bootstrap.ts. Lives OUTSIDE the package's main barrel — react-native's own
+// source is Flow syntax Vitest's transform can't parse, so anything importing it directly must stay
+// unreachable from the tested main index.ts.
+import { AppRegistry as RNAppRegistry } from 'react-native';
+import { bootstrapHost, } from '@symbiote-native/components/bootstrap';
+import { AppRegistry, setHostRegistrar } from './modules/app-registry/index.js';
+// Mirrors the Vue/React/Svelte adapters' createApp(App).mount(appName) two-step idiom: createApp
+// stays inert, and mount(appName) is where the RN host seams and AppRegistry get wired.
+export function createApp(RootComponent, options = {}) {
+    return {
+        mount(appName) {
+            bootstrapHost(options);
+            setHostRegistrar(RNAppRegistry);
+            AppRegistry.registerComponent(appName, () => RootComponent);
+        },
+    };
+}

package/build/components/activity-indicator/index.android.d.ts

@@ -0,0 +1,2 @@
+export type { IActivityIndicatorProps, IActivityIndicatorSize } from './shared';
+export declare const ActivityIndicator: (props: import("./shared").IActivityIndicatorProps) => import("@symbiote-native/solid/jsx-runtime").JSX.Element;

package/build/components/activity-indicator/index.android.js

@@ -0,0 +1,11 @@
+// ActivityIndicator on Android: AndroidProgressBar needs `styleAttr` (it drives its setStyle();
+// without it the view throws "setStyle() not called") plus `indeterminate: true`, and its default
+// color is the theme (null), which the render fn turns into an OMITTED color prop — a literal null
+// would be rejected by Fabric's color parser. Same facts the other adapters' Android bindings
+// encode. Metro picks this on an Android host; no Platform.OS read.
+import { createActivityIndicator } from './shared.js';
+export const ActivityIndicator = createActivityIndicator({
+    // RN: `color = Platform.OS === 'ios' ? GRAY : null`; Android lets the theme color it.
+    defaultColor: null,
+    nativeExtras: { styleAttr: 'Normal', indeterminate: true },
+});

package/build/components/activity-indicator/index.d.ts

@@ -0,0 +1 @@
+export * from './index.ios';

package/build/components/activity-indicator/index.ios.d.ts

@@ -0,0 +1,2 @@
+export type { IActivityIndicatorProps, IActivityIndicatorSize } from './shared';
+export declare const ActivityIndicator: (props: import("./shared").IActivityIndicatorProps) => import("@symbiote-native/solid/jsx-runtime").JSX.Element;

package/build/components/activity-indicator/index.ios.js

@@ -0,0 +1,10 @@
+// ActivityIndicator on iOS: RCTActivityIndicatorView takes the size enum plus a GRAY default color
+// and no extra native props — the same facts adapters/react's, adapters/vue's and adapters/svelte's
+// iOS bindings encode. Metro selects this file on an iOS host, no Platform.OS read.
+import { createActivityIndicator } from './shared.js';
+// RN's iOS default spinner color (Libraries/.../ActivityIndicator.js GRAY).
+const IOS_DEFAULT_COLOR = '#999999';
+export const ActivityIndicator = createActivityIndicator({
+    defaultColor: IOS_DEFAULT_COLOR,
+    nativeExtras: {},
+});

package/build/components/activity-indicator/index.js

@@ -0,0 +1,4 @@
+// Base / default ActivityIndicator: re-exports the iOS build. Metro overrides this with
+// index.ios.ts / index.android.ts on a real host; under vitest / tsc the resolution lands here.
+// Filename is the selector, no Platform.OS read.
+export * from './index.ios.js';

package/build/components/activity-indicator/shared.d.ts

@@ -0,0 +1,8 @@
+import type { JSX } from '../../jsx-runtime';
+import { type IActivityIndicatorPlatform, type IActivityIndicatorProps as IActivityIndicatorBaseProps } from '@symbiote-native/components';
+import type { IClassNameValue } from '@symbiote-native/engine';
+export type { IActivityIndicatorPlatform, IActivityIndicatorSize, } from '@symbiote-native/components';
+export type IActivityIndicatorProps = IActivityIndicatorBaseProps & {
+    class?: IClassNameValue;
+};
+export declare function createActivityIndicator(platform: IActivityIndicatorPlatform): (props: IActivityIndicatorProps) => JSX.Element;

package/build/components/activity-indicator/shared.js

@@ -0,0 +1,51 @@
+// ActivityIndicator, the Solid lifecycle half. The render (the 'small'/'large' -> native size enum
+// translation, the fixed size boxes, the centering wrapper, the color omission) lives in
+// @symbiote-native/components/view and is shared verbatim with React, Vue and Svelte. There is no
+// state machine: the spinner animates natively, so Solid supplies only prop resolution and the
+// descriptor bridge.
+//
+// NOTHING here destructures `props`. Solid props are getters and a component body runs ONCE;
+// destructuring reads them at setup and freezes the component at its mount-time values. Every read
+// below happens inside the descriptor accessor, which descriptorToSolid re-runs as a render effect
+// on the SAME host nodes.
+//
+// The per-platform bits (iOS's GRAY default and no extras; Android's theme/null default plus
+// styleAttr + indeterminate) arrive via `platform` from index.ios.ts / index.android.ts.
+import { renderActivityIndicator, resolveAccessibilityProps, } from '@symbiote-native/components';
+import { descriptorToSolid } from '../../descriptor-to-solid.js';
+// Read by the component itself; everything else (testID, nativeID, the accessibility surface,
+// onLayout, class) forwards onto the centering wrapper View, which is where RN spreads `...props`.
+const HANDLED_PROPS = [
+    'animating',
+    'color',
+    'hidesWhenStopped',
+    'size',
+    'style',
+];
+// The wrapper is a raw symbiote-view emitted by the render fn, not the View component, so it never
+// runs resolveAccessibilityProps itself — the fold happens here, exactly like React's hook does.
+// The two branches of that fold emit DIFFERENT key sets; descriptorToSolid runs the resulting bag
+// through withStableKeys, so a vanished key still reaches routeProp as a delete
+// (.claude/rules/solid-descriptor-bridge.md §1).
+function forwardProps(props) {
+    const forwarded = {
+        ...resolveAccessibilityProps(props),
+    };
+    for (const key of HANDLED_PROPS)
+        delete forwarded[key];
+    return forwarded;
+}
+export function createActivityIndicator(platform) {
+    return function ActivityIndicator(props) {
+        // `?? 'small'` / `?? true` rather than a `!== false` coercion: props are typed here, so this is
+        // the exact semantics of React's destructuring defaults (only `undefined` falls back).
+        return descriptorToSolid(() => renderActivityIndicator({
+            animating: props.animating ?? true,
+            hidesWhenStopped: props.hidesWhenStopped ?? true,
+            size: props.size ?? 'small',
+            color: props.color,
+            style: props.style,
+            passthrough: forwardProps(props),
+        }, platform));
+    };
+}

package/build/components/button.d.ts

@@ -0,0 +1,7 @@
+import type { JSX } from '../jsx-runtime';
+import { type IButtonProps as IButtonBaseProps } from '@symbiote-native/components';
+import type { IClassNameValue } from '@symbiote-native/engine';
+export type IButtonProps = IButtonBaseProps & {
+    class?: IClassNameValue;
+};
+export declare function Button(props: IButtonProps): JSX.Element;

package/build/components/button.jsx

@@ -0,0 +1,45 @@
+// Button — the minimal cross-platform button, rendered in its iOS shape per RN's Button.js: a
+// TouchableOpacity wrapping a Text. The base text style, the role constant and the color fold
+// (a caller `color` tints the label; `disabled` greys it, disabled winning) are shared in
+// @symbiote-native/components' render-button and are called, never re-derived; Solid only composes
+// its own TouchableOpacity + Text and forwards the native-only props.
+//
+// NO descriptorToSolid here, and none in React/Vue/Svelte either: the tree is two COMPONENTS, not
+// a Descriptor. There is no renderButton() to bridge — the shared half is the style/role math.
+//
+// NOTHING here destructures `props` at setup. Solid props are getters and a component body runs
+// ONCE; splitProps keeps both halves reactive and every read sits inside an accessor or a memo.
+import { createMemo, splitProps } from 'solid-js';
+import { BUTTON_ACCESSIBILITY_ROLE, resolveButtonTextStyle, } from '@symbiote-native/components';
+import { Text } from './text.jsx';
+import { TouchableOpacity } from './touchable/index.jsx';
+export function Button(props) {
+    // Only what Button CONSUMES or re-maps is split off. Everything else — onPress, disabled,
+    // testID, the TV-focus props, the accessibility/aria surface, `class` — stays in `rest` and
+    // rides the single bag below onto the TouchableOpacity. The TV-focus props are real Fabric
+    // props the pressable forwards without typing; a JSX spread carries them through unchecked
+    // (they are inert on a phone host).
+    const [local, rest] = splitProps(props, [
+        'title',
+        'color',
+        'touchSoundDisabled',
+    ]);
+    const textStyle = createMemo(() => resolveButtonTextStyle(local.color, rest.disabled));
+    // ONE bag, not a spread followed by explicit props on the tag: Solid's mergeProps (which the
+    // compiler uses for that shape) takes the first NON-undefined value scanning back to front, so
+    // an override that can be undefined silently loses (.claude/rules/solid-descriptor-bridge.md
+    // §6). A plain object is last-wins — the React semantics this is ported from, and what pins RN's
+    // fixed role / accessible / disabled-state OVER the caller's own. touchSoundDisabled is RE-MAPPED
+    // here, not forwarded: the pressable spells it android_disableSound. Return type left INFERRED;
+    // widening to Record<string, unknown> would stop typing `onPress` too.
+    const touchableProps = () => ({
+        ...rest,
+        android_disableSound: local.touchSoundDisabled,
+        accessibilityRole: BUTTON_ACCESSIBILITY_ROLE,
+        accessible: true,
+        accessibilityState: { disabled: rest.disabled },
+    });
+    return (<TouchableOpacity {...touchableProps()}>
+      <Text style={textStyle()}>{local.title}</Text>
+    </TouchableOpacity>);
+}

package/build/components/flat-list/index.d.ts

@@ -0,0 +1,10 @@
+import type { JSX } from '../../jsx-runtime';
+import { type IStyleProp, type IViewStyle } from '@symbiote-native/engine';
+import { type IVirtualizedListHandle, type IVirtualizedListProps } from '../virtualized-list';
+export type IFlatListHandle = IVirtualizedListHandle;
+export type IFlatListProps<ItemT> = Omit<IVirtualizedListProps<ItemT>, 'data' | 'getItem' | 'getItemCount'> & {
+    data: readonly ItemT[];
+    numColumns?: number;
+    columnWrapperStyle?: IStyleProp<IViewStyle> | string;
+};
+export declare function FlatList<ItemT>(props: IFlatListProps<ItemT>): JSX.Element;