@symbiote-native/vue 0.3.0 → 0.3.1

package/build/bootstrap.js

@@ -4,7 +4,7 @@
 // header for why anything importing react-native must stay there.
 import { AppRegistry as RNAppRegistry } from 'react-native';
 import { bootstrapHost } from '@symbiote-native/components/bootstrap';
-import { AppRegistry, setHostRegistrar } from './modules/app-registry';
+import { AppRegistry, setHostRegistrar } from './modules/app-registry/index.js';
 // Mirrors real Vue's createApp(App).mount(selector) two-step idiom.
 export function createApp(App, options = {}) {
     return {

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

@@ -2,7 +2,7 @@
 // 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. See ADR 0020.
-import { createActivityIndicator } from './shared';
+import { createActivityIndicator } from './shared.js';
 export const ActivityIndicator = createActivityIndicator({
     // RN: `color = Platform.OS === 'ios' ? GRAY : null`. Android lets the theme color it.
     defaultColor: null,

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

@@ -1,7 +1,7 @@
 // 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. See ADR 0020.
-import { createActivityIndicator } from './shared';
+import { createActivityIndicator } from './shared.js';
 // RN's iOS default spinner color (Libraries/.../ActivityIndicator.js GRAY).
 const IOS_DEFAULT_COLOR = '#999999';
 export const ActivityIndicator = createActivityIndicator({

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

@@ -1,4 +1,4 @@
 // 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. See ADR 0020.
-export * from './index.ios';
+export * from './index.ios.js';

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

@@ -9,8 +9,8 @@
 // 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';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { descriptorToVue } from '../../descriptor-to-vue.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 function normalizeSize(size) {
     if (size === 'large')
         return 'large';

package/build/components/button.js

@@ -4,9 +4,9 @@
 // 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';
-import { TouchableOpacity } from './touchable';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+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.

package/build/components/flat-list/index.js

@@ -16,8 +16,8 @@
 import { defineComponent, getCurrentInstance, h, shallowRef, } from '@vue/runtime-core';
 import { SINGLE_COLUMN, chunkIntoRows, expandRowViewability, firstItemOfRow, lastItemOfRow, rowKeyExtractor, } from '@symbiote-native/components';
 import { dlog, resolveClassName, } from '@symbiote-native/engine';
-import { VirtualizedList } from '../virtualized-list';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { VirtualizedList } from '../virtualized-list/index.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 // VirtualizedList is itself a generic component (generic construct signature), which h()'s overloads
 // can't resolve. Drive it through a loose functional-component handle (generic-component h()
 // limitation — the ItemT surface is proven at the typed FlatList boundary above).

package/build/components/image-background.js

@@ -10,8 +10,8 @@
 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';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { descriptorToVue } from '../descriptor-to-vue.js';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 function asString(value) {
     return typeof value === 'string' ? value : undefined;
 }

package/build/components/image.js

@@ -13,8 +13,8 @@
 // the forward-only rest (events, blurRadius, capInsets, testID, accessibility*) is typed as the
 // a11y intersection so resolveAccessibilityProps folds aria-* into accessibility* over it.
 import { imageStatics, renderImage, resolveAccessibilityProps, } from '@symbiote-native/components';
-import { descriptorToVue } from '../descriptor-to-vue';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { descriptorToVue } from '../descriptor-to-vue.js';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 export { setImageSourceResolver } from '@symbiote-native/components';
 function asString(value) {
     return typeof value === 'string' ? value : undefined;

package/build/components/input-accessory-view.js

@@ -9,7 +9,7 @@
 // so resolveAccessibilityProps lands aria-* onto the host node.
 import { h } from '@vue/runtime-core';
 import { renderInputAccessoryView, resolveAccessibilityProps, } from '@symbiote-native/components';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 function asString(value) {
     return typeof value === 'string' ? value : undefined;
 }

package/build/components/keyboard-avoiding-view.js

@@ -12,7 +12,7 @@
 import { defineComponent, h, ref, onMounted, onUnmounted } from '@vue/runtime-core';
 import { Keyboard, KEYBOARD_EVENT, dlog, } from '@symbiote-native/engine';
 import { computeInset, readKeyboardFrame, readLayoutFrame, resolveKeyboardAvoidingLayout, resolveAccessibilityProps, DEFAULT_VERTICAL_OFFSET, } from '@symbiote-native/components';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 // A style prop is an object (a style record) or an array of them; numbers/strings/null degrade
 // to undefined (the engine flattens what it gets). A runtime guard, not a cast.
 function isStyleProp(value) {

package/build/components/modal.js

@@ -13,7 +13,7 @@
 import { defineComponent, h, ref, watch } from '@vue/runtime-core';
 import { createInitialModalState, modalReducer, renderModal, resolveAccessibilityProps, shouldRenderModal, } from '@symbiote-native/components';
 import { dlog, } from '@symbiote-native/engine';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 function asBoolean(value) {
     return typeof value === 'boolean' ? value : undefined;
 }

package/build/components/pressable.js

@@ -15,8 +15,8 @@
 import { defineComponent, h, ref, shallowRef } from '@vue/runtime-core';
 import { createPressHandlers, createPressRuntime, rippleProps, buildPressableListeners, resolveDisabledAccessibilityState, noteHoverNoop, resolveAccessibilityProps, DEFAULT_DELAY_LONG_PRESS_MS, } from '@symbiote-native/components';
 import { measure, isSymbioteNode, } from '@symbiote-native/engine';
-import { View } from '../components';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { View } from '../components.js';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 // The emits-options validator for the full press surface. Reused verbatim as the `emits` of every
 // Touchable* wrapper (they expose the same events), so the runtime list lives in exactly one place.
 export const PRESSABLE_EMITS = {

package/build/components/refresh-control.js

@@ -14,7 +14,7 @@
 import { defineComponent, h } from '@vue/runtime-core';
 import { dlog } from '@symbiote-native/engine';
 import { resolveAccessibilityProps, } from '@symbiote-native/components';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 // Copy every non-consumed attr into a bag typed as the a11y intersection (the accumulator is BUILT
 // at that type, a real narrowing, not a cast), then fold aria-*/role into the canonical
 // accessibility* props. Children cross via slots, never attrs. When the Android wrap re-invokes

package/build/components/safe-area-view.js

@@ -10,7 +10,7 @@
 import { defineComponent, h } from '@vue/runtime-core';
 import { dlog } from '@symbiote-native/engine';
 import { resolveAccessibilityProps, } from '@symbiote-native/components';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 // Copy every attr into a bag typed as the a11y intersection (the accumulator is BUILT at that
 // type, a real narrowing, not a cast), then fold aria-*/role into the canonical accessibility*
 // props before they reach the host. style / onLayout / testID forward unchanged.

package/build/components/scroll-view/index.android.js

@@ -15,7 +15,7 @@
 import { h, isVNode } from '@vue/runtime-core';
 import { dlog } from '@symbiote-native/engine';
 import { splitLayoutProps } from '@symbiote-native/components';
-import { createScrollView } from './shared';
+import { createScrollView } from './shared.js';
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }

package/build/components/scroll-view/index.ios.js

@@ -4,7 +4,7 @@
 // childless sibling. Also the base (scroll-view.ts re-exports it) for headless / web. Metro picks
 // this on an iOS host; no Platform.OS read. Mirrors the React adapter's iOS binding.
 import { h } from '@vue/runtime-core';
-import { createScrollView } from './shared';
+import { createScrollView } from './shared.js';
 export const ScrollView = createScrollView({
     assemble: input => {
         // Sibling placement: RefreshControl before content (RN iOS). The node ref stays on the scroll

package/build/components/scroll-view/index.js

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

package/build/components/scroll-view/shared.js

@@ -21,8 +21,8 @@
 import { defineComponent, h, isVNode, markRaw, onBeforeUnmount, ref, shallowRef, watch, } from '@vue/runtime-core';
 import { attachStickyScroll, buildScrollViewHandle, didContentSizeChange, forwardScrollEvent, readLayoutDimension, resolveAccessibilityProps, resolveDecelerationRate, selectScrollIntrinsics, } from '@symbiote-native/components';
 import { AnimatedValue, dlog, event as animatedEvent, isClassNameValue, isNativeAnimatedAvailable, isSymbioteNode, resolveClassName, } from '@symbiote-native/engine';
-import { wrapStickyHeaders } from './sticky-header';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { wrapStickyHeaders } from './sticky-header.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 function isHandler(value) {
     return typeof value === 'function';
 }

package/build/components/scroll-view/sticky-header.js

@@ -14,7 +14,7 @@
 import { defineComponent, h, isVNode, ref, shallowRef, watch, watchEffect, markRaw, } from '@vue/runtime-core';
 import { AnimatedValue, AnimatedInterpolation, Platform, dlog, } from '@symbiote-native/engine';
 import { computeStickyInterpolation, nextStickyHeaderY, readLayoutNumber, stickyDebounceMs, STICKY_HEADER_Z_INDEX, } from '@symbiote-native/components';
-import { Animated } from '../../modules/animated';
+import { Animated } from '../../modules/animated/index.js';
 function isHandler(value) {
     return typeof value === 'function';
 }

package/build/components/section-list/index.js

@@ -12,8 +12,8 @@
 // synthesized events (endReached/startReached/refresh) are bridged, gated on listener presence so
 // the inner list keeps its RefreshControl / edge-reached gating.
 import { defineComponent, getCurrentInstance, h, shallowRef, } from '@vue/runtime-core';
-import { VirtualizedSectionList, } from '../virtualized-section-list';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { VirtualizedSectionList, } from '../virtualized-section-list/index.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 // VirtualizedSectionList is a generic component (generic construct signature), which h()'s overloads
 // can't resolve. Drive it through a loose functional-component handle (generic-component h() limit).
 const VirtualizedSectionListHost = VirtualizedSectionList;

package/build/components/switch/index.android.js

@@ -2,7 +2,7 @@
 // trackTintColor (the color for the CURRENT value), and snaps native back via the
 // `setNativeValue` command. Metro picks this on an Android host; no Platform.OS read.
 // Mirrors the React adapter's Android binding. See ADR 0020.
-import { createSwitch } from './shared';
+import { createSwitch } from './shared.js';
 export const Switch = createSwitch({
     snapBackCommand: 'setNativeValue',
     trackColorProps: (value, trackColor) => ({

package/build/components/switch/index.ios.js

@@ -1,7 +1,7 @@
 // Switch on iOS: the native Switch takes onTintColor (ON-track) / tintColor (OFF-track) and
 // snaps native back via the `setValue` command. Also the base (switch.ts re-exports it) for
 // headless / web. Mirrors the React adapter's iOS binding. See ADR 0020.
-import { createSwitch } from './shared';
+import { createSwitch } from './shared.js';
 export const Switch = createSwitch({
     snapBackCommand: 'setValue',
     trackColorProps: (_value, trackColor) => ({

package/build/components/switch/index.js

@@ -2,4 +2,4 @@
 // switch.android.ts on a real host; under tsx / tsc / web the host resolves here. Filename is
 // the selector, no Platform.OS read. See ADR 0020. Switch is the first component to bring the
 // state half (the reducer) into the Vue adapter: render-and-state, not render-only.
-export * from './index.ios';
+export * from './index.ios.js';

package/build/components/switch/shared.js

@@ -12,9 +12,9 @@
 import { defineComponent, ref, shallowRef, watch } from '@vue/runtime-core';
 import { renderSwitch, switchReducer, createInitialSwitchState, shouldSnapBack, valueFromChange, } from '@symbiote-native/components';
 import { dispatchViewCommand, isSymbioteNode, dlog, } from '@symbiote-native/engine';
-import { descriptorToVue } from '../../descriptor-to-vue';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
-import { resolveModelValue, emitModelUpdate } from '../../utils/model-binding';
+import { descriptorToVue } from '../../descriptor-to-vue.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
+import { resolveModelValue, emitModelUpdate } from '../../utils/model-binding.js';
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }

package/build/components/text-input/index.js

@@ -15,9 +15,9 @@
 import { defineComponent, onBeforeUnmount, ref, shallowRef, watch } from '@vue/runtime-core';
 import { resolveAccessibilityProps, resolveTextInputProps, renderTextInput, foldText, textFromChange, eventCountFromChange, shouldCommandText, INITIAL_EVENT_COUNT, SELECTION_NONE, } from '@symbiote-native/components';
 import { dispatchViewCommand, isSymbioteNode, dlog, blurTextInput, setInputFocused, setInputBlurred, whenCommitted, } from '@symbiote-native/engine';
-import { descriptorToVue } from '../../descriptor-to-vue';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
-import { resolveModelValue, emitModelUpdate } from '../../utils/model-binding';
+import { descriptorToVue } from '../../descriptor-to-vue.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
+import { resolveModelValue, emitModelUpdate } from '../../utils/model-binding.js';
 function isRecord(value) {
     return typeof value === 'object' && value !== null && !Array.isArray(value);
 }

package/build/components/touchable-native-feedback.js

@@ -6,9 +6,9 @@
 import { defineComponent, h } from '@vue/runtime-core';
 import { backgroundProps, canUseNativeForeground, rippleBackground, selectableBackground, selectableBackgroundBorderless, } from '@symbiote-native/components';
 import { dlog } from '@symbiote-native/engine';
-import { View } from '../components';
-import { Pressable, emitPressableEvents, PRESSABLE_EMITS, } from './pressable';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { View } from '../components.js';
+import { Pressable, emitPressableEvents, PRESSABLE_EMITS, } from './pressable.js';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 const HANDLED = ['background', 'useForeground'];
 function forwardAttrs(attrs) {
     const result = {};

package/build/components/touchable.js

@@ -13,9 +13,9 @@
 import { defineComponent, h } from '@vue/runtime-core';
 import { computePressOutWait, DEFAULT_ACTIVE_OPACITY, DEFAULT_HIGHLIGHT_CHILD_OPACITY, DEFAULT_MIN_PRESS_DURATION_MS, DEFAULT_UNDERLAY_COLOR, OPACITY_ACTIVE_DURATION_MS, OPACITY_INACTIVE_DURATION_MS, RESTING_OPACITY, } from '@symbiote-native/components';
 import { dlog, } from '@symbiote-native/engine';
-import { Pressable, emitPressableEvents, PRESSABLE_EMITS, } from './pressable';
-import { Animated } from '../modules/animated';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { Pressable, emitPressableEvents, PRESSABLE_EMITS, } from './pressable.js';
+import { Animated } from '../modules/animated/index.js';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 function numberOr(value, fallback) {
     return typeof value === 'number' ? value : fallback;
 }

package/build/components/virtualized-list/index.js

@@ -27,10 +27,10 @@
 import { computed, defineComponent, getCurrentInstance, h, isVNode, onBeforeUnmount, ref, shallowRef, watch, } from '@vue/runtime-core';
 import { DEFAULT_END_REACHED_THRESHOLD, DEFAULT_INITIAL_NUM_TO_RENDER, DEFAULT_MAX_TO_RENDER_PER_BATCH, DEFAULT_START_REACHED_THRESHOLD, DEFAULT_UPDATE_CELLS_BATCHING_PERIOD, DEFAULT_WINDOW_SIZE, EMPTY_OFFSET, FIRST_INDEX, INVERTED_X_STYLE, INVERTED_Y_STYLE, NO_CONTENT_LENGTH_SENT, averageMeasuredLength, buildListPlan, buildOffsets, buildViewabilityPairs, computeEndReached, computeStartReached, computeViewableSet, computeWindow, diffViewable, highestMeasuredIndex, maxMinimumViewTime, offsetForIndex, readLayoutLength, readScrollOffset, throttleWindow, } from '@symbiote-native/components';
 import { dlog, } from '@symbiote-native/engine';
-import { ScrollView } from '../scroll-view';
-import { RefreshControl } from '../refresh-control';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
-import { componentFromSlot } from '../../utils/slots-to-render-props';
+import { ScrollView } from '../scroll-view/index.js';
+import { RefreshControl } from '../refresh-control.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
+import { componentFromSlot } from '../../utils/slots-to-render-props.js';
 // The typed inputs VirtualizedList reads off `props`; everything else (raw scroll, keyboard*,
 // accessibility, testID, …) falls through $attrs onto the inner ScrollView. Listed for the runtime
 // `props` declaration (keyof can't derive it: the index signature widens keyof to `string`). The

package/build/components/virtualized-section-list/index.js

@@ -18,8 +18,8 @@
 import { defineComponent, getCurrentInstance, h, shallowRef, } from '@vue/runtime-core';
 import { flattenSections, scrollLocationToFlatIndex, sectionEntryKey, unwrapEntryItem, } from '@symbiote-native/components';
 import { Platform, dlog, } from '@symbiote-native/engine';
-import { VirtualizedList } from '../virtualized-list';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { VirtualizedList } from '../virtualized-list/index.js';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 // VirtualizedList is a generic component (generic construct signature), which h()'s overloads can't
 // resolve. Drive it through a loose functional-component handle (generic-component h() limitation).
 const VirtualizedListHost = VirtualizedList;

package/build/components.js

@@ -9,7 +9,7 @@
 // stateful component's ref would resolve to a useless component proxy, which is why
 // createAnimatedComponent (which captures the host node via that ref) needs the fall-through.
 import { h } from '@vue/runtime-core';
-import { normalizeVueAttrs } from './utils/normalize-attrs';
+import { normalizeVueAttrs } from './utils/normalize-attrs.js';
 function hostComponent(intrinsic, name) {
     // A functional component's ctx is Omit<SetupContext, 'expose'> (no instance to expose); let the
     // FunctionalComponent target infer the param types rather than annotate SetupContext.

package/build/index.js

@@ -1,83 +1,83 @@
 // @symbiote-native/vue: a thin Vue 3 reconciler over @symbiote-native/engine. createRenderer maps
 // each RendererOptions call onto the engine's mutation API; all Fabric clone-on-write
 // lives in the engine, shared with every other adapter. App code names only @symbiote-native/vue.
-export { mount, unmount } from './render';
+export { mount, unmount } from './render.js';
 // createTunnel: cross-surface content sharing (Teleport stays same-surface-only by design —
 // see create-tunnel.ts and the vue-adapter-directives skill for why).
-export { createTunnel } from './create-tunnel';
-export { View, Text } from './components';
+export { createTunnel } from './create-tunnel.js';
+export { View, Text } from './components.js';
 // findNodeHandle: RN's ref -> native reactTag lookup, the Vue twin of the React adapter's
 // host-instance resolution. IHostInstance is the raw engine node (Vue host refs fall
 // through to it; imperative methods live on each component's expose() handle).
-export { findNodeHandle } from './host-instance';
+export { findNodeHandle } from './host-instance/index.js';
 // Image. Full parity with React: source/src/srcSet resolution, the width/height → style fold,
 // alt → accessibility, and the Image statics (getSize / prefetch / queryCache / …) are shared
 // verbatim from @symbiote-native/components via renderImage; Vue supplies only the functional bridge.
-export { Image, setImageSourceResolver } from './components/image';
+export { Image, setImageSourceResolver } from './components/image.js';
 // First component off the shared @symbiote-native/components layer: render-only, drives the
 // agnostic renderActivityIndicator through descriptorToVue. Proof the layer is reusable:
 // the render fn is shared verbatim with React; Vue supplies only the bridge.
-export { ActivityIndicator } from './components/activity-indicator';
+export { ActivityIndicator } from './components/activity-indicator/index.js';
 // First component to bring the state half into Vue (the lastNativeReport reducer + the
 // snap-back watch); render shared verbatim with React, Vue supplies the reactive lifecycle.
-export { Switch } from './components/switch';
+export { Switch } from './components/switch/index.js';
 // ScrollView. Full parity (ADR 0024): vertical + horizontal, every pass-through prop, the
 // synthesized onContentSizeChange, the imperative handle via expose() + shallowRef, RefreshControl
 // (iOS sibling / Android wrap, Phase 2), and sticky headers (Phase 3: the scroll AnimatedValue,
 // the headerLayoutYs cross-talk, and the per-header Animated.View wrap). The pure math (intrinsics,
 // decelerationRate, content-size dedupe, the handle, the sticky interpolation) is shared verbatim
 // with React from @symbiote-native/components.
-export { ScrollView } from './components/scroll-view';
+export { ScrollView } from './components/scroll-view/index.js';
 // Pressable family. Full parity with React (the 3-layer split): the press state machine + render
 // decisions are shared in @symbiote-native/components; Vue supplies the reactivity + descriptor bridge.
-export { Pressable } from './components/pressable';
-export { TouchableOpacity, TouchableHighlight, TouchableWithoutFeedback, } from './components/touchable';
-export { TouchableNativeFeedback } from './components/touchable-native-feedback';
-export { Button } from './components/button';
+export { Pressable } from './components/pressable.js';
+export { TouchableOpacity, TouchableHighlight, TouchableWithoutFeedback, } from './components/touchable.js';
+export { TouchableNativeFeedback } from './components/touchable-native-feedback.js';
+export { Button } from './components/button.js';
 // TextInput. Full parity with React (the 3-layer split): the value/selection folds + the
 // controlled-write predicate live in @symbiote-native/components; Vue supplies the reactivity
 // (shallowRef host node, post-flush watch) + the imperative handle via expose().
-export { TextInput } from './components/text-input';
+export { TextInput } from './components/text-input/index.js';
 // VirtualizedList family. Full parity with React: the windowing math (visible range, cell
 // keys, viewability token diffing, edge-reached, the list plan) is shared in
 // @symbiote-native/components; Vue supplies the reactive lifecycle + the per-cell element.
-export { VirtualizedList } from './components/virtualized-list';
-export { FlatList } from './components/flat-list';
-export { VirtualizedSectionList } from './components/virtualized-section-list';
-export { SectionList } from './components/section-list';
+export { VirtualizedList } from './components/virtualized-list/index.js';
+export { FlatList } from './components/flat-list/index.js';
+export { VirtualizedSectionList } from './components/virtualized-section-list/index.js';
+export { SectionList } from './components/section-list/index.js';
 // Phase 2 (ADR 0024): SafeAreaView + RefreshControl, wired into ScrollView with the iOS-sibling /
 // Android-wrap platform split. RefreshControl hosts the wrapped scroll view via its default slot.
-export { SafeAreaView } from './components/safe-area-view';
-export { RefreshControl } from './components/refresh-control';
-export { descriptorToVue } from './descriptor-to-vue';
+export { SafeAreaView } from './components/safe-area-view.js';
+export { RefreshControl } from './components/refresh-control.js';
+export { descriptorToVue } from './descriptor-to-vue.js';
 // normalizeVueAttrs: the kebab→camel attr fold every component applies at entry. Exported so an
 // external wrapper package (e.g. @symbiote-native/slider/vue over a third-party native view) can fold
 // its incoming attrs through the SAME transform rather than reimplementing it.
-export { normalizeVueAttrs } from './utils/normalize-attrs';
+export { normalizeVueAttrs } from './utils/normalize-attrs.js';
 // resolveModelValue/emitModelUpdate: the v-model (Rule 6, vue-adapter-events skill) helper every
 // controlled-value component uses. Exported for the same external-package reason as
 // normalizeVueAttrs above (e.g. @symbiote-native/slider/vue).
-export { resolveModelValue, emitModelUpdate } from './utils/model-binding';
-export { createSymbioteRenderer } from './renderer';
+export { resolveModelValue, emitModelUpdate } from './utils/model-binding.js';
+export { createSymbioteRenderer } from './renderer.js';
 // Animated (ADR 0024 Phase 3a): Animated.View/Text/Image + the lazy Animated.ScrollView over the
 // Vue primitives, with the value graph / easing / drivers spread from @symbiote-native/engine. The wrap
 // mechanism (createAnimatedComponent) is the Vue twin of React's; the pure leaves live in the
 // engine.
-export { Animated, createAnimatedComponent } from './modules/animated';
+export { Animated, createAnimatedComponent } from './modules/animated/index.js';
 // Visual components off the shared @symbiote-native/components layer (wave: simple-visual).
-export { ImageBackground } from './components/image-background';
-export { InputAccessoryView } from './components/input-accessory-view';
-export { Modal } from './components/modal';
+export { ImageBackground } from './components/image-background.js';
+export { InputAccessoryView } from './components/input-accessory-view.js';
+export { Modal } from './components/modal.js';
 // KeyboardAvoidingView: full parity via the shared inset math; Vue owns the Keyboard subscription.
-export { KeyboardAvoidingView } from './components/keyboard-avoiding-view';
+export { KeyboardAvoidingView } from './components/keyboard-avoiding-view.js';
 // StatusBar: declarative component + the shared imperative API.
-export { StatusBar } from './modules/status-bar';
+export { StatusBar } from './modules/status-bar.js';
 // AppRegistry: RN's app entry point over `mount`. setHostRegistrar wires RN's own
 // registrar so the native Fabric host finds our runnable by app key.
-export { AppRegistry, setHostRegistrar } from './modules/app-registry';
+export { AppRegistry, setHostRegistrar } from './modules/app-registry/index.js';
 // Vue composables over the core device-state modules.
-export { useColorScheme } from './composables/use-color-scheme';
-export { useWindowDimensions } from './composables/use-window-dimensions';
+export { useColorScheme } from './composables/use-color-scheme.js';
+export { useWindowDimensions } from './composables/use-window-dimensions.js';
 // Imperative runtime modules: the SAME module both adapters share, re-exported from @symbiote-native/engine.
 export { Alert, Share, ActionSheetIOS, Linking, Vibration, ToastAndroid, Settings, I18nManager, Dimensions, Appearance, AppState, Keyboard, KEYBOARD_EVENT, BackHandler, PermissionsAndroid, PERMISSIONS, RESULTS, AccessibilityInfo, LayoutAnimation, } from '@symbiote-native/engine';
 // Re-export the framework-agnostic engine surface (pure utilities + diagnostics).

package/build/modules/animated/create-animated-component.js

@@ -13,7 +13,7 @@
 // value.setValue / animation -> flushValue -> AnimatedProps.update() -> setNativeProps(node).
 import { defineComponent, h, onBeforeUnmount, onMounted, onUpdated, shallowRef, } from '@vue/runtime-core';
 import { AnimatedProps, attachNativeEventHandler, isNativeAnimatedAvailable, reduceProps, readPassthroughStyle, resolveHostNode, } from '@symbiote-native/engine';
-import { normalizeVueAttrs } from '../../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../../utils/normalize-attrs.js';
 // RN's prop carrying explicit (already-rasterized) values that override the animated prop in
 // the COMMITTED props (sticky-header passthrough). Named once here so render/reconcile agree.
 const PASSTHROUGH_PROP = 'passthroughAnimatedPropExplicitValues';

package/build/modules/animated/index.js

@@ -4,11 +4,11 @@
 // JS-driven, ADR 0016), spread in verbatim. Both halves meet here so the familiar surface,
 // `Animated.timing(new Animated.Value(0), …).start()`, works against the Vue-driven engine.
 import { AnimatedValue, AnimatedValueXY, AnimatedColor, AnimatedMock, Easing, Platform, timing, spring, decay, parallel, sequence, stagger, loop, delay, add, subtract, multiply, divide, modulo, diffClamp, event, forkEvent, unforkEvent, } from '@symbiote-native/engine';
-import { View, Text } from '../../components';
-import { Image } from '../../components/image';
-import { ScrollView } from '../../components/scroll-view';
-import { createAnimatedComponent } from './create-animated-component';
-export { createAnimatedComponent } from './create-animated-component';
+import { View, Text } from '../../components.js';
+import { Image } from '../../components/image.js';
+import { ScrollView } from '../../components/scroll-view/index.js';
+import { createAnimatedComponent } from './create-animated-component.js';
+export { createAnimatedComponent } from './create-animated-component.js';
 // View/Text are pure host primitives; Image is the functional renderImage wrapper, and all expose
 // their host node via ref fall-through, so wrap them eagerly.
 const AnimatedView = createAnimatedComponent(View);

package/build/modules/app-registry/index.js

@@ -9,7 +9,7 @@
 // React already has.
 import { h } from '@vue/runtime-core';
 import { createAppRegistry, dlog, } from '@symbiote-native/engine';
-import { mount } from '../../render';
+import { mount } from '../../render.js';
 function runnableFor(componentProvider, getWrapperComponentProvider) {
     return appParameters => {
         dlog(`AppRegistry: mounting on rootTag ${String(appParameters.rootTag)}`);

package/build/modules/status-bar.js

@@ -11,7 +11,7 @@
 // (untyped) and run through normalizeVueAttrs (kebab→camel) before each is narrowed by a guard.
 import { defineComponent, watchEffect } from '@vue/runtime-core';
 import { applyStatusBarProps, statusBarImperative, statusBarCurrentHeight, isOpaqueColorValue, } from '@symbiote-native/engine';
-import { normalizeVueAttrs } from '../utils/normalize-attrs';
+import { normalizeVueAttrs } from '../utils/normalize-attrs.js';
 function asBoolean(value) {
     return typeof value === 'boolean' ? value : undefined;
 }

package/build/render.js

@@ -2,7 +2,7 @@
 // a surface for it and let the Vue renderer drive the engine, which commits into
 // nativeFabricUIManager; RN's own renderer never in the path.
 import { createSurface, disposeRoot, dlog, } from '@symbiote-native/engine';
-import { createSymbioteRenderer } from './renderer';
+import { createSymbioteRenderer } from './renderer.js';
 // One Vue app per surface, so a surface can be torn down (unmount) or cleanly
 // re-mounted on the same rootTag: the bridgeless host stops and restarts a surface on
 // Fast Refresh and on lifecycle/focus changes, reusing the rootTag.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/vue",
-  "version": "0.3.0",
+  "version": "0.3.1",
   "description": "SymbioteNative's Vue adapter — a @vue/runtime-core createRenderer driving real native iOS/Android views through the same engine as the React adapter.",
   "repository": {
     "type": "git",
@@ -44,9 +44,9 @@
     "@vue/compiler-core": "^3.5.13",
     "@vue/compiler-sfc": "^3.5.13",
     "@vue/runtime-core": "^3.5.13",
-    "@symbiote-native/components": "0.2.0",
+    "@symbiote-native/components": "0.2.1",
     "@symbiote-native/css-parser": "0.2.0",
-    "@symbiote-native/engine": "0.1.1"
+    "@symbiote-native/engine": "0.1.2"
   },
   "peerDependencies": {
     "vue": ">=3.5.0",