@symbiote-native/vue 0.5.0 → 2.0.0

package/build/utils/normalize-attrs.d.ts

@@ -1 +1,2 @@
+export declare function normalizeVueAttrKey(key: string): string;
 export declare function normalizeVueAttrs(attrs: Record<string, unknown>): Record<string, unknown>;

package/build/utils/normalize-attrs.js

@@ -12,21 +12,27 @@ const KEBAB_SEGMENT = /-([a-z])/g;
 function toCamel(key) {
     return key.replace(KEBAB_SEGMENT, (_match, char) => char.toUpperCase());
 }
+// The per-KEY half, for the path that never sees a whole attrs bag: a host primitive lowered to
+// its intrinsic tag by the SFC transformer reaches the renderer one patchProp call at a time,
+// with no component in between to fold the bag. Returns the key unchanged (same string identity)
+// whenever there is nothing to convert, which is every key on the hot path.
+export function normalizeVueAttrKey(key) {
+    if (!key.includes('-'))
+        return key;
+    if (key.startsWith('aria-') || key.startsWith('data-'))
+        return key;
+    return toCamel(key);
+}
+// Always returns a PLAIN copy, never the input. An earlier version handed the input back when no
+// key needed converting - which is every SFC/TSX bag, since `@press` / `:style` already arrive
+// camel - and that gave callers Vue's attrs PROXY to read from. In production, not just dev, that
+// proxy's get trap is `track(target, "get", "")` before every value
+// (runtime-core.esm-bundler.js:8357), so each of Pressable's ~16 per-render attr reads paid two
+// map lookups it did not need. The copy loop reads every key through the trap once regardless, so
+// the only thing the early return ever saved was this one object.
 export function normalizeVueAttrs(attrs) {
-    let changed = false;
     const out = {};
-    for (const key of Object.keys(attrs)) {
-        if (key.includes('-') &&
-            !key.startsWith('aria-') &&
-            !key.startsWith('data-')) {
-            out[toCamel(key)] = attrs[key];
-            changed = true;
-        }
-        else {
-            out[key] = attrs[key];
-        }
-    }
-    // Return the original object when nothing converted (the already-camel / TSX path): avoids a
-    // per-render allocation and keeps attrs identity stable.
-    return changed ? out : attrs;
+    for (const key of Object.keys(attrs))
+        out[normalizeVueAttrKey(key)] = attrs[key];
+    return out;
 }

package/intrinsic-tags.cjs

@@ -0,0 +1,52 @@
+// Every tag both Vue compilers must treat as an ELEMENT rather than as a component to resolve.
+//
+// Vue decides element-vs-component in two unrelated places — `@vue/compiler-sfc`'s
+// `isCustomElement` and `@vue/babel-plugin-jsx`'s option of the same name — so the answer has to
+// come from one set or the two paths drift. That drift is not loud: a tag Vue takes for a component
+// compiles to `resolveComponent("text-input")` with its children as a slot the element path never
+// reads, which renders a blank subtree with no error.
+//
+// DERIVED, never enumerated. Until 2026-09-07 this was the prefix test `tag.startsWith('symbiote-')`
+// in ./babel-jsx.cjs — correct while every intrinsic carried that marker, and answering FALSE for
+// every tag since the prefix was dropped (`core/components/src/component-names/shared.ts` says why
+// it went). What hid it is the tag alphabet: `view` / `text` / `image` / `switch` are real SVG
+// element names, so both compilers resolve those four as elements with no configuration at all, and
+// only the hyphenated half degraded.
+//
+// SCOPE, stated because it is smaller than `ISymbioteIntrinsic`. That union also holds
+// `scroll-view`, `modal`, `activity-indicator` and the rest, but it is a TypeScript type and these
+// consumers are Babel/Metro plugins that run before TS exists. `HOST_PRIMITIVES` is the only
+// runtime-readable table reachable from here, so a hand-written `<scroll-view>` still resolves as a
+// component. Closing that needs a CJS intrinsic table in `core/components`.
+//
+// WHAT THAT GAP COSTS, measured 2026-09-11 rather than reasoned, because the first guess was that
+// the tag simply would not work. It works: `resolveComponent` falls back to the tag STRING, and
+// `normalizeChildren` then unwraps the `withCtx` default slot for an element shapeFlag, so
+// `<scroll-view><text>hi</text></scroll-view>` committed `RCTView > RCTScrollView > RCTText >
+// RCTRawText`. What it costs is a dev-mode `[Vue warn]: Failed to resolve component: scroll-view`
+// on every such element plus the component codegen path (a slot closure per element) instead of
+// `_createElementBlock`. That is a divergence from every other tag, so `ScrollView`,
+// `TouchableOpacity` and `TouchableHighlight` stay COMPONENTS on Vue until their
+// `HOST_PRIMITIVES` entries land — and `intrinsic-elements.ts` already types all three as valid
+// markup off `ISymbioteIntrinsic`, so vue-tsc accepts what the runtime compiler warns about.
+//
+// The tell that the three are still wrapped rather than merely unlisted: `src/register.ts` does
+// NOT call their behaviors, because a registered behavior plus a surviving wrapper is two owners
+// on one node. Those two facts move together or not at all.
+//
+// .cjs, and its own file rather than a copy in each consumer: two transforms carrying one
+// derivation is the drift the shared spec exists to prevent.
+
+const {
+  HOST_PRIMITIVES,
+} = require('@symbiote-native/components/host-primitives');
+
+// BOTH tags a spec entry can emit. A primitive with an `intrinsicWhen` selects between two native
+// views by one prop, so its second intrinsic is as hand-writable as its first.
+module.exports = new Set(
+  Object.values(HOST_PRIMITIVES).flatMap(entry =>
+    entry.intrinsicWhen === undefined
+      ? [entry.intrinsic]
+      : [entry.intrinsic, entry.intrinsicWhen.intrinsic],
+  ),
+);

package/metro-css-parser.cjs

@@ -9,4 +9,5 @@
 // directly instead, since it needs the individual parse/compile functions, not a Metro transformer
 // object. createCssMetroTransformer is a factory — babelTransformerPath needs the actual
 // {transform, getCacheKey} object it returns, not the css-parser package barrel.
-module.exports = require('@symbiote-native/css-parser').createCssMetroTransformer();
+module.exports =
+  require('@symbiote-native/css-parser').createCssMetroTransformer();

package/metro-vue-transformer.cjs

@@ -11,7 +11,12 @@
 // babelTransformerPath at it.
 
 const nodeFs = require('fs');
-const { parse, compileScript, registerTS } = require('@vue/compiler-sfc');
+const {
+  parse,
+  parseCache,
+  compileScript,
+  registerTS,
+} = require('@vue/compiler-sfc');
 const { createCompoundExpression } = require('@vue/compiler-core');
 
 // A bare-specifier type import (`import type { X } from '@symbiote-native/navigation/vue'`) needs
@@ -109,6 +114,39 @@ function createScopeClassNodeTransform(renames) {
   };
 }
 
+// The parser's own condense() collapses a text node's multi-line whitespace to a single boundary
+// space but never trims it: `<text>\n  plain\n</text>` compiles to " plain " instead of "plain" -
+// a real leading/trailing space on the rendered RN Text. Babel's JSX whitespace cleaner
+// (cleanJSXElementLiteralChild, used by every other adapter) DOES trim this; Vue's does not, so we
+// do it here, once, for every template. Matches Babel's own rule: only a text node whose SOURCE
+// crosses a line break is touched, so a genuinely single-line `<text>Score: {{ x }}</text>` keeps
+// its intentional trailing space untouched (see examples/vue-sfc's CompoundClassDemo.vue for the
+// device-measured bug this closes).
+function trimReflowedTextNodeTransform(node) {
+  if (node.type !== 1 /* NodeTypes.ELEMENT */ || node.children.length === 0)
+    return;
+  const first = node.children[0];
+  if (
+    first.type === 2 /* NodeTypes.TEXT */ &&
+    first.loc.source.includes('\n') &&
+    first.content.startsWith(' ')
+  ) {
+    first.content = first.content.slice(1);
+  }
+  const last = node.children[node.children.length - 1];
+  if (
+    last.type === 2 /* NodeTypes.TEXT */ &&
+    last.loc.source.includes('\n') &&
+    last.content.endsWith(' ')
+  ) {
+    last.content = last.content.slice(0, -1);
+  }
+}
+
+// Shared with ./babel-jsx.cjs: Vue's two compilers must give one answer to element-vs-component.
+const INTRINSIC_TAGS = require('./intrinsic-tags.cjs');
+
+
 // A short, stable id per file, used as the SFC scope id regardless of whether the file has
 // scoped styles - built on css-parser's shared hashFilePath so the algorithm isn't duplicated
 // against the standalone .module.css compiler's identical need.
@@ -177,7 +215,31 @@ async function compileStyleBlockContent(style, filename) {
 }
 
 async function compileSfc(src, filename) {
-  const { descriptor, errors } = parse(src, { filename });
+  // `parse` memoizes its descriptor on (source, filename) in a module-global LRU, and the node
+  // scope-class transform below MUTATES that descriptor's template AST in place, replacing
+  // `prop.exp`. Handing the same object to a second compile therefore walks a half-transformed
+  // tree and generation dies with `Codegen node is missing for element/if/for node`.
+  //
+  // Metro compiles each file once per build, so the cache buys this caller nothing; the only place
+  // it was ever exercised is css-parser's golden-corpus determinism check, which compiles one
+  // source twice on purpose. That is the ONLY test anywhere that can see this, which is why a
+  // transform bug surfaced as a failure in another package's corpus.
+  //
+  // `clear()` rather than deleting our one key: the key is `source + JSON.stringify(options)`
+  // (`@vue/shared`'s genCacheKey), so reproducing it here would couple this file to an internal
+  // format across every Vue bump. Clearing a pure memo is always safe — the only cost is a
+  // re-parse, which is what we need anyway.
+
+  parseCache.clear();
+  // element-vs-component is decided by the PARSER, not by the later `isCustomElement` in
+  // templateOptions — `compileScript` reuses this descriptor's already-parsed AST, where `tagType`
+  // is already fixed. So a hand-written `<pressable>` needs the answer here or it stays a component
+  // whatever templateOptions says, which is how it read until 2026-09-07:
+  // `resolveComponent("pressable")`, a blank subtree with no error.
+  const { descriptor, errors } = parse(src, {
+    filename,
+    templateParseOptions: { isCustomElement: tag => INTRINSIC_TAGS.has(tag) },
+  });
   if (errors && errors.length > 0) {
     throw new Error(
       `Vue SFC parse error in ${filename}:\n${errors.map(String).join('\n')}`,
@@ -243,16 +305,24 @@ async function compileSfc(src, filename) {
     }
   }
 
-  // Skipped entirely (not even passed to the compiler) when nothing in this file is scoped, so
-  // a .vue with only unscoped/no styles compiles with zero added runtime cost.
-  const templateOptions =
-    scopedClassNames.size > 0
-      ? {
-          compilerOptions: {
-            nodeTransforms: [createScopeClassNodeTransform(scopedClassNames)],
-          },
-        }
-      : undefined;
+  // Scoped-class rewriting is skipped entirely (not even passed to the compiler) when nothing in
+  // this file is scoped, so a .vue with only unscoped/no styles adds no runtime cost.
+  const nodeTransforms = [trimReflowedTextNodeTransform];
+  if (scopedClassNames.size > 0)
+    nodeTransforms.push(createScopeClassNodeTransform(scopedClassNames));
+  // UNCONDITIONAL, and covering EVERY intrinsic rather than the ones this file happens to import.
+  // Both narrowings were live until 2026-09-07 and both broke a hand-written tag: a file importing
+  // no wrapper got no `isCustomElement` at all, and a file importing one got an answer scoped to
+  // that import, so `<pressable>` written by hand compiled to `resolveComponent("pressable")` —
+  // a blank subtree with no error — whichever way the file was written. `<switch v-model>` failed
+  // louder: `@vue/compiler-dom`'s transformModel rejects v-model on an element that is neither
+  // input/textarea/select nor a custom element, so it was a hard compile error.
+  const templateOptions = {
+    compilerOptions: {
+      ...(nodeTransforms.length > 0 ? { nodeTransforms } : {}),
+      isCustomElement: tag => INTRINSIC_TAGS.has(tag),
+    },
+  };
 
   // inlineTemplate folds the <template> render fn into setup(): one module, one `export
   // default`. Only valid with <script setup>, which the canary uses.
@@ -303,7 +373,7 @@ async function compileSfc(src, filename) {
     preamble.push(`const ${bindingName} = ${JSON.stringify(classMap)};`);
   }
 
-  const parts = [...preamble, code];
+  const parts = [preamble.join('\n'), code];
   if (hasCssModules) {
     const bindings = [...cssModuleBindings.keys()]
       .map(name => `${JSON.stringify(name)}: ${name}`)

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/vue",
-  "version": "0.5.0",
+  "version": "2.0.0",
   "description": "SymbioteNative's Vue adapter — a @vue/runtime-core createRenderer driving real native iOS/Android views through the same engine as the React adapter.",
   "license": "MIT",
   "repository": {
@@ -13,6 +13,18 @@
     "url": "https://github.com/OneEyed1366/symbiote-native/issues"
   },
   "author": "Andrey Prokopenko <psevdoproger@gmail.com>",
+  "keywords": [
+    "react-native",
+    "symbiote-native",
+    "vue",
+    "vue3",
+    "fabric",
+    "renderer",
+    "cross-platform",
+    "mobile",
+    "ios",
+    "android"
+  ],
   "type": "module",
   "main": "./build/index.js",
   "module": "./build/index.js",
@@ -31,10 +43,21 @@
       "default": "./build/runtime-helpers/index.js"
     },
     "./metro-css-parser": "./metro-css-parser.cjs",
-    "./metro-vue-transformer": "./metro-vue-transformer.cjs"
+    "./metro-vue-transformer": "./metro-vue-transformer.cjs",
+    "./babel-jsx": "./babel-jsx.cjs",
+    "./jsx-runtime": {
+      "types": "./build/jsx-runtime.d.ts",
+      "default": "./build/jsx-runtime.js"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./build/jsx-runtime.d.ts",
+      "default": "./build/jsx-runtime.js"
+    }
   },
   "files": [
+    "babel-jsx.cjs",
     "build",
+    "intrinsic-tags.cjs",
     "metro-css-parser.cjs",
     "metro-vue-transformer.cjs"
   ],
@@ -42,21 +65,23 @@
     "access": "public"
   },
   "dependencies": {
+    "@vue/babel-plugin-jsx": "^1.5.0",
     "@vue/compiler-core": "^3.5.13",
     "@vue/compiler-sfc": "^3.5.13",
     "@vue/runtime-core": "^3.5.13",
     "typescript": "~6.0.0",
-    "@symbiote-native/components": "0.5.0",
-    "@symbiote-native/css-parser": "0.4.0"
+    "@symbiote-native/components": "2.0.0",
+    "@symbiote-native/css-parser": "0.5.0"
   },
   "peerDependencies": {
-    "@symbiote-native/engine": ">=0.1.7",
     "vue": ">=3.5.0",
-    "react-native": ">=0.86"
+    "react-native": ">=0.86",
+    "@symbiote-native/engine": "^0.5.0"
   },
   "devDependencies": {
-    "@symbiote-native/engine": "0.3.0",
-    "@symbiote-native/test-utils": "0.2.0"
+    "@babel/core": "^7.25.2",
+    "@symbiote-native/engine": "0.5.0",
+    "@symbiote-native/test-utils": "0.3.0"
   },
   "scripts": {
     "typecheck": "tsc --build",

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

@@ -1,4 +0,0 @@
-export type { IActivityIndicatorProps } from './shared';
-export declare const ActivityIndicator: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

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

@@ -1,10 +0,0 @@
-// ActivityIndicator on Android: AndroidProgressBar needs `styleAttr` (it drives the
-// ProgressBar's setStyle(); without it the view throws "setStyle() not called") and
-// `indeterminate: true`, and its default color is the theme (null). Metro picks this on an
-// Android host; no Platform.OS read. Mirrors the React adapter's Android binding.
-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

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

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

@@ -1,4 +0,0 @@
-export type { IActivityIndicatorProps } from './shared';
-export declare const ActivityIndicator: import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

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

@@ -1,10 +0,0 @@
-// ActivityIndicator on iOS: RCTActivityIndicatorView takes the size enum + a GRAY default
-// color and no extra native props. Also the base (activity-indicator.ts re-exports it) for
-// headless / web. Mirrors the React adapter's iOS binding.
-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

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

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

@@ -1,8 +0,0 @@
-import type { IActivityIndicatorPlatform, IActivityIndicatorProps as IActivityIndicatorBaseProps } from '@symbiote-native/components';
-import type { IClassNameValue } from '@symbiote-native/engine';
-export type IActivityIndicatorProps = IActivityIndicatorBaseProps & {
-    class?: IClassNameValue;
-};
-export declare function createActivityIndicator(platform: IActivityIndicatorPlatform): import("vue").DefineComponent<{}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
-    [key: string]: any;
-}>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;

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

@@ -1,48 +0,0 @@
-// ActivityIndicator, the Vue lifecycle half. The render (size translation, wrapper +
-// spinner, color omission) lives framework-agnostic in @symbiote-native/components and is shared
-// verbatim with the React adapter; here Vue only normalizes inputs, calls the render fn,
-// and bridges the Descriptor to a vnode. No reactivity of its own; this component is
-// render-only (the spinner animates natively).
-//
-// Inputs arrive as attrs, not a typed props block, the same passthrough shape as
-// components.ts. RN's per-platform bits (iOS GRAY default; Android theme/null + styleAttr +
-// indeterminate) are supplied by the .ios/.android files via `IActivityIndicatorPlatform`.
-import { defineComponent } from '@vue/runtime-core';
-import { renderActivityIndicator } from '@symbiote-native/components';
-import { descriptorToVue } from '../../descriptor-to-vue.js';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
-function normalizeSize(size) {
-    if (size === 'large')
-        return 'large';
-    if (typeof size === 'number')
-        return size;
-    return 'small';
-}
-// Narrow attrs.style to a plain ViewStyle object (assignable to the render fn's StyleProp
-// param) without a cast. Array/registered styles degrade to undefined; the engine's own
-// flatten handles those when an app passes them; the wrapper only needs the object form.
-function isViewStyleObject(value) {
-    return typeof value === 'object' && value !== null && !Array.isArray(value);
-}
-export function createActivityIndicator(platform) {
-    return defineComponent({
-        name: 'ActivityIndicator',
-        inheritAttrs: false,
-        setup(_props, { attrs: rawAttrs }) {
-            return () => {
-                // Defaults match RN (animating / hidesWhenStopped true, size 'small'); the rest of
-                // attrs (testID, accessibility, onLayout) forwards onto the wrapper via passthrough.
-                const attrs = normalizeVueAttrs(rawAttrs);
-                const { animating, color, hidesWhenStopped, size, style, ...passthrough } = attrs;
-                return descriptorToVue(renderActivityIndicator({
-                    animating: animating !== false,
-                    hidesWhenStopped: hidesWhenStopped !== false,
-                    size: normalizeSize(size),
-                    color: typeof color === 'string' ? color : undefined,
-                    style: isViewStyleObject(style) ? style : undefined,
-                    passthrough,
-                }, platform));
-            };
-        },
-    });
-}

package/build/components/button.d.ts

@@ -1,14 +0,0 @@
-import { type IButtonProps as ICoreButtonProps } from '@symbiote-native/components';
-import type { IClassNameValue, ISymbioteEvent } from '@symbiote-native/engine';
-export type IButtonProps = Omit<ICoreButtonProps, 'onPress'> & {
-    class?: IClassNameValue;
-};
-type IButtonEmits = {
-    press: (event: ISymbioteEvent) => boolean;
-};
-export declare const Button: import("vue").DefineSetupFnComponent<IButtonProps, IButtonEmits, {}, Omit<ICoreButtonProps, "onPress"> & {
-    class?: IClassNameValue;
-} & {
-    onPress?: ((event: ISymbioteEvent) => any) | undefined;
-}, import("vue").PublicProps>;
-export {};

package/build/components/button.js

@@ -1,59 +0,0 @@
-// Button for Vue. The minimal cross-platform button in RN's iOS shape (Button.js): a
-// TouchableOpacity wrapping a Text. The base text style, the role constant, and the color fold are
-// shared in @symbiote-native/components/view; here Vue only composes its TouchableOpacity + Text and
-// forwards the native-only props. The Vue twin of the React adapter's Button.
-import { defineComponent, h } from '@vue/runtime-core';
-import { BUTTON_ACCESSIBILITY_ROLE, resolveButtonTextStyle, } from '@symbiote-native/components';
-import { Text } from '../components.js';
-import { TouchableOpacity } from './touchable.js';
-import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
-// The props Button consumes / re-maps itself; everything else (accessibility, aria, TV-focus,
-// testID, nativeID) forwards to the TouchableOpacity. `title` becomes the Text child; onPress and
-// disabled re-map; touchSoundDisabled maps to the pressable's android_disableSound.
-const HANDLED = [
-    'title',
-    'color',
-    'touchSoundDisabled',
-    'accessibilityRole',
-    'accessible',
-    'accessibilityState',
-];
-function forwardAttrs(attrs) {
-    const result = {};
-    for (const key of Object.keys(attrs)) {
-        if (!HANDLED.includes(key))
-            result[key] = attrs[key];
-    }
-    return result;
-}
-export const Button = defineComponent((_props, { attrs: rawAttrs, emit }) => {
-    return () => {
-        const attrs = normalizeVueAttrs(rawAttrs);
-        const title = typeof attrs.title === 'string' ? attrs.title : '';
-        const color = typeof attrs.color === 'string' ? attrs.color : undefined;
-        const disabled = attrs.disabled === true ? true : undefined;
-        const touchSoundDisabled = attrs.touchSoundDisabled === true ? true : undefined;
-        const textStyle = resolveButtonTextStyle(color, disabled);
-        // RN's Button sets role=button, is accessible, and propagates the disabled accessibility
-        // state. The caller's props pass through, but Button's fixed role / accessible / disabled-
-        // state win, applied after the forwarded spread. touchSoundDisabled → android_disableSound.
-        const touchableProps = {
-            ...forwardAttrs(attrs),
-            disabled,
-            android_disableSound: touchSoundDisabled,
-            accessibilityRole: BUTTON_ACCESSIBILITY_ROLE,
-            accessible: true,
-            accessibilityState: { disabled },
-            onPress: (event) => emit('press', event),
-        };
-        return h(TouchableOpacity, touchableProps, {
-            default: () => [h(Text, { style: textStyle }, () => title)],
-        });
-    };
-}, {
-    name: 'Button',
-    inheritAttrs: false,
-    emits: {
-        press: (_event) => true,
-    },
-});

package/build/components/image-background.d.ts

@@ -1,9 +0,0 @@
-import { type FunctionalComponent } from '@vue/runtime-core';
-import { type IImageProps } from '@symbiote-native/components';
-import { type IClassNameValue, type IStyleProp, type IViewStyle } from '@symbiote-native/engine';
-export interface IImageBackgroundProps extends Omit<IImageProps, 'style'> {
-    style?: IStyleProp<IViewStyle>;
-    imageStyle?: IStyleProp<IViewStyle> | string;
-    class?: IClassNameValue;
-}
-export declare const ImageBackground: FunctionalComponent<{}, {}, any, {}>;

package/build/components/image-background.js

@@ -1,103 +0,0 @@
-// ImageBackground: the Vue lifecycle half. The composition (the absolute-fill Image behind the
-// children, the dimension-proxy + style-merge math) lives framework-agnostic in
-// @symbiote-native/components/renderImageBackground, shared verbatim with React; Vue narrows the
-// untyped attrs into the typed Image view, folds aria/role, bridges the Descriptor to vnodes, and
-// appends the slot children ON TOP of the inner image.
-//
-// FUNCTIONAL, not a stateful defineComponent: render-only, no state.
-import { h } from '@vue/runtime-core';
-import { renderImageBackground, resolveAccessibilityProps, } from '@symbiote-native/components';
-import { resolveClassName, } from '@symbiote-native/engine';
-import { descriptorToVue } from '../descriptor-to-vue.js';
-import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
-function asString(value) {
-    return typeof value === 'string' ? value : undefined;
-}
-function asNumber(value) {
-    return typeof value === 'number' ? value : undefined;
-}
-function asSource(value) {
-    if (typeof value === 'number')
-        return value;
-    if (typeof value === 'object' && value !== null)
-        return value;
-    return undefined;
-}
-function isResizeMode(value) {
-    return (value === 'cover' ||
-        value === 'contain' ||
-        value === 'stretch' ||
-        value === 'repeat' ||
-        value === 'center');
-}
-function asResizeMode(value) {
-    return isResizeMode(value) ? value : undefined;
-}
-function asCrossOrigin(value) {
-    return value === 'anonymous' || value === 'use-credentials'
-        ? value
-        : undefined;
-}
-function isStyleProp(value) {
-    return typeof value === 'object' && value !== null;
-}
-function toChildVNode(child) {
-    return typeof child === 'string' ? child : descriptorToVue(child);
-}
-const HANDLED_ATTRS = [
-    'style',
-    'imageStyle',
-    'class',
-    'source',
-    'defaultSource',
-    'loadingIndicatorSource',
-    'resizeMode',
-    'tintColor',
-    'src',
-    'srcSet',
-    'alt',
-    'width',
-    'height',
-    'crossOrigin',
-    'referrerPolicy',
-];
-function forwardAttrs(attrs) {
-    const result = {};
-    for (const key of Object.keys(attrs)) {
-        if (!HANDLED_ATTRS.includes(key))
-            result[key] = attrs[key];
-    }
-    return result;
-}
-const ImageBackgroundComponent = (_props, { attrs: rawAttrs, slots }) => {
-    const attrs = normalizeVueAttrs(rawAttrs);
-    const wrapper = renderImageBackground({
-        style: isStyleProp(attrs.style) ? attrs.style : undefined,
-        imageStyle: typeof attrs.imageStyle === 'string'
-            ? resolveClassName(attrs.imageStyle)
-            : isStyleProp(attrs.imageStyle)
-                ? attrs.imageStyle
-                : undefined,
-        image: {
-            source: asSource(attrs.source),
-            defaultSource: asSource(attrs.defaultSource),
-            loadingIndicatorSource: asSource(attrs.loadingIndicatorSource),
-            resizeMode: asResizeMode(attrs.resizeMode),
-            tintColor: asString(attrs.tintColor),
-            src: asString(attrs.src),
-            srcSet: asString(attrs.srcSet),
-            alt: asString(attrs.alt),
-            width: asNumber(attrs.width),
-            height: asNumber(attrs.height),
-            crossOrigin: asCrossOrigin(attrs.crossOrigin),
-            referrerPolicy: asString(attrs.referrerPolicy),
-            passthrough: resolveAccessibilityProps(forwardAttrs(attrs)),
-        },
-    });
-    // wrapper = symbiote-view > [imageDescriptor]; the slot children paint AFTER the image (on top).
-    const slotChildren = slots.default !== undefined ? slots.default() : [];
-    return h(wrapper.type, { ...wrapper.props, key: wrapper.key, class: attrs.class }, [...wrapper.children.map(toChildVNode), ...slotChildren]);
-};
-ImageBackgroundComponent.displayName = 'ImageBackground';
-ImageBackgroundComponent.inheritAttrs = false;
-export const ImageBackground = ImageBackgroundComponent;

package/build/components/image.d.ts

@@ -1,9 +0,0 @@
-import type { FunctionalComponent } from '@vue/runtime-core';
-import { type IImageProps as IImageBaseProps, type IImageStatics } from '@symbiote-native/components';
-import type { IClassNameValue } from '@symbiote-native/engine';
-export { setImageSourceResolver } from '@symbiote-native/components';
-export type { IImageSource, IImageSourceProp, IResizeMode, IImageSize, IImageCacheStatus, } from '@symbiote-native/components';
-export type IImageProps = IImageBaseProps & {
-    class?: IClassNameValue;
-};
-export declare const Image: FunctionalComponent<IImageProps> & IImageStatics;