@symbiote-native/svelte 0.3.0 → 2.0.0

package/README.md

@@ -59,22 +59,20 @@ import { name as appName } from './app.json';
 createApp(App).mount(appName);
 ```
 
-The app is ordinary Svelte 5 — it just imports primitives from `@symbiote-native/svelte` instead of
-`react-native`. A tap→increment counter, using runes:
+The app is ordinary Svelte 5 — the native primitives are plain intrinsic tags, no import needed.
+A tap→increment counter, using runes:
 
 ```svelte
 <script lang="ts">
-  import { View, Text, Pressable } from '@symbiote-native/svelte';
-
   let count = $state(0);
 </script>
 
-<View style={{ padding: 24 }}>
-  <Text>Taps: {count}</Text>
-  <Pressable onPress={() => count++}>
-    <Text>Tap me</Text>
-  </Pressable>
-</View>
+<view style={{ padding: 24 }}>
+  <text>Taps: {count}</text>
+  <pressable onPress={() => count++}>
+    <text>Tap me</text>
+  </pressable>
+</view>
 ```
 
 The full canary is [`examples/svelte`](../../examples/svelte) — a stock RN 0.86 app whose

package/build/components/{activity-indicator/activity-indicator-props.d.ts → activity-indicator-props.d.ts}

@@ -1,5 +1,5 @@
 import type { IActivityIndicatorProps as IActivityIndicatorBaseProps } from '@symbiote-native/components';
-import type { ISvelteClassValue } from '../../class-value';
+import type { ISvelteClassValue } from '../class-value';
 export type IActivityIndicatorProps = IActivityIndicatorBaseProps & {
     class?: ISvelteClassValue;
 };

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

@@ -173,17 +173,17 @@
   index: number;
   separators: ISeparators;
 })}
-  <symbiote-view p={{ style: rowStyle }}>
+  <view p={{ style: rowStyle }}>
     {#each row.items as rowItem, column (props.keyExtractor ? props.keyExtractor(rowItem, row.startIndex + column) : String(row.startIndex + column))}
-      <symbiote-view p={{ style: { flex: 1 } }}>
+      <view p={{ style: { flex: 1 } }}>
         {@render props.item({
           item: rowItem,
           index: row.startIndex + column,
           separators,
         })}
-      </symbiote-view>
+      </view>
     {/each}
-  </symbiote-view>
+  </view>
 {/snippet}
 
 {#snippet rowSeparator(entryProps: ISeparatorProps<IRow<ItemT>>)}

package/build/components/{image-background/image-background-props.d.ts → image-background-props.d.ts}

@@ -1,7 +1,7 @@
 import type { Snippet } from 'svelte';
 import type { IStyleProp, IViewStyle } from '@symbiote-native/engine';
 import type { IImageProps } from '@symbiote-native/components';
-import type { ISvelteClassValue } from '../../class-value';
+import type { ISvelteClassValue } from '../class-value';
 export interface IImageBackgroundProps extends Omit<IImageProps, 'style'> {
     style?: IStyleProp<IViewStyle>;
     imageStyle?: IStyleProp<IViewStyle> | string;

package/build/components/index.d.ts

@@ -1,45 +1,27 @@
-export { default as View } from './View.svelte';
-export { default as Text } from './Text.svelte';
 export type { IViewProps } from './view-props';
 export type { ITextProps } from './text-props';
-export { default as ActivityIndicator } from './activity-indicator/index.svelte';
-export type { IActivityIndicatorProps } from './activity-indicator/activity-indicator-props';
-export { Image } from './image';
-export type { IImageProps, IImageStatics } from './image';
-export { default as ImageBackground } from './image-background/index.svelte';
-export type { IImageBackgroundProps } from './image-background/image-background-props';
-export { default as InputAccessoryView } from './input-accessory-view/index.svelte';
+export type { IActivityIndicatorProps } from './activity-indicator-props';
+export type { IImageProps } from './image/image-props';
+export type { IImageBackgroundProps } from './image-background-props';
 export type { IInputAccessoryViewProps } from './input-accessory-view/input-accessory-view-props';
 export { default as KeyboardAvoidingView } from './keyboard-avoiding-view/index.svelte';
 export type { IKeyboardAvoidingViewProps, IKeyboardAvoidingBehavior, } from './keyboard-avoiding-view/keyboard-avoiding-view-props';
-export { default as Switch } from './switch/index.svelte';
 export type { ISwitchProps } from './switch/switch-props';
-export { default as TextInput } from './text-input/index.svelte';
+export type { ISwitchChangeEvent } from '@symbiote-native/components';
 export type { ITextInputProps } from './text-input/text-input-props';
-export type { ITextInputHandle } from '@symbiote-native/components';
+export type { ITextInputHandle, ITextInputChangeEvent, } from '@symbiote-native/components';
 export { default as Modal } from './modal/index.svelte';
 export type { IModalProps } from './modal/modal-props';
-export { default as SafeAreaView } from './SafeAreaView.svelte';
 export type { ISafeAreaViewProps } from './safe-area-view-props';
-export { default as RefreshControl } from './RefreshControl.svelte';
 export type { IRefreshControlProps } from './refresh-control-props';
-export { default as Pressable } from './pressable/index.svelte';
 export type { IPressableProps } from './pressable/pressable-props';
-export { default as TouchableOpacity } from './touchable-opacity/index.svelte';
 export type { ITouchableOpacityProps } from './touchable-opacity/touchable-opacity-props';
-export { default as TouchableHighlight } from './touchable-highlight/index.svelte';
 export type { ITouchableHighlightProps } from './touchable-highlight/touchable-highlight-props';
-export { default as TouchableWithoutFeedback } from './touchable-without-feedback/index.svelte';
 export type { ITouchableWithoutFeedbackProps } from './touchable-without-feedback/touchable-without-feedback-props';
-export { TouchableNativeFeedback } from './touchable-native-feedback';
-export type { ITouchableNativeFeedbackProps } from './touchable-native-feedback';
-export { default as Button } from './button.svelte';
+export type { ITouchableNativeFeedbackProps } from './touchable-native-feedback/touchable-native-feedback-props';
 export type { IButtonProps } from './button-props';
-export { default as ScrollView } from './scroll-view/index.svelte';
 export type { IScrollViewProps } from './scroll-view/scroll-view-props';
 export type { IScrollViewHandle } from '@symbiote-native/components';
-export { default as ScrollViewStickyHeader } from './scroll-view/sticky-header.svelte';
-export type { IStickyHeaderComponentProps } from './scroll-view/sticky-header-props';
 export { default as VirtualizedList } from './virtualized-list/index.svelte';
 export type { IVirtualizedListProps, IVirtualizedListHandle, } from './virtualized-list/virtualized-list-props';
 export { default as FlatList } from './flat-list/index.svelte';

package/build/components/index.js

@@ -1,23 +1,5 @@
-export { default as View } from './View.svelte';
-export { default as Text } from './Text.svelte';
-export { default as ActivityIndicator } from './activity-indicator/index.svelte';
-export { Image } from './image/index.js';
-export { default as ImageBackground } from './image-background/index.svelte';
-export { default as InputAccessoryView } from './input-accessory-view/index.svelte';
 export { default as KeyboardAvoidingView } from './keyboard-avoiding-view/index.svelte';
-export { default as Switch } from './switch/index.svelte';
-export { default as TextInput } from './text-input/index.svelte';
 export { default as Modal } from './modal/index.svelte';
-export { default as SafeAreaView } from './SafeAreaView.svelte';
-export { default as RefreshControl } from './RefreshControl.svelte';
-export { default as Pressable } from './pressable/index.svelte';
-export { default as TouchableOpacity } from './touchable-opacity/index.svelte';
-export { default as TouchableHighlight } from './touchable-highlight/index.svelte';
-export { default as TouchableWithoutFeedback } from './touchable-without-feedback/index.svelte';
-export { TouchableNativeFeedback } from './touchable-native-feedback/index.js';
-export { default as Button } from './button.svelte';
-export { default as ScrollView } from './scroll-view/index.svelte';
-export { default as ScrollViewStickyHeader } from './scroll-view/sticky-header.svelte';
 export { default as VirtualizedList } from './virtualized-list/index.svelte';
 export { default as FlatList } from './flat-list/index.svelte';
 export { default as VirtualizedSectionList } from './virtualized-section-list/index.svelte';

package/build/components/keyboard-avoiding-view/index.svelte

@@ -146,13 +146,13 @@
 </script>
 
 {#if layout.kind === 'nested'}
-  <symbiote-view p={wrapperBag} bind:this={hostShim}>
-    <symbiote-view p={innerBag}>
+  <view p={wrapperBag} bind:this={hostShim}>
+    <view p={innerBag}>
       {@render children?.()}
-    </symbiote-view>
-  </symbiote-view>
+    </view>
+  </view>
 {:else}
-  <symbiote-view p={wrapperBag} bind:this={hostShim}>
+  <view p={wrapperBag} bind:this={hostShim}>
     {@render children?.()}
-  </symbiote-view>
+  </view>
 {/if}

package/build/components/modal/index.svelte

@@ -10,7 +10,7 @@
   //     after the DOM update, the same "one keep-alive frame survives" timing as React's
   //     useEffect / Vue's flush:'post' watch)
   //   - the descriptor bridge: renderModal() always paints the SAME fixed shape (one
-  //     symbiote-modal host wrapping one symbiote-view container — only prop VALUES vary,
+  //     modal host wrapping one view container — only prop VALUES vary,
   //     never structure, per svelte-adapter-dom-shim skill §15), so rather than building a
   //     generic Descriptor->Svelte walker (there is none, and none is needed) this hand-authors
   //     the two literal host tags and reads renderModal()'s computed props off the fixed
@@ -63,7 +63,7 @@
     if (!shouldRender) dlog('Modal hidden -> no node committed');
   });
 
-  // Owns its host element (symbiote-modal), so it folds aria/role via `resolved` above; the
+  // Owns its host element (modal), so it folds aria/role via `resolved` above; the
   // resolved fields ride the host node via `...passthrough` — includes onShow/onDismiss/
   // onRequestClose/onOrientationChange (real ViewConfig DirectEvents) and every accessibility*
   // field, untouched, exactly like React's `...passthrough`.
@@ -100,7 +100,7 @@
       passthrough,
     });
 
-    // root = symbiote-modal > [container]; the children snippet nests UNDER the container View,
+    // root = modal > [container]; the children snippet nests UNDER the container View,
     // never as a direct sibling of the host (RN's modal content layout) — see render-modal.ts.
     const [container] = descriptor.children;
     const containerProps = typeof container === 'string' ? {} : container.props;
@@ -121,9 +121,9 @@
 </script>
 
 {#if shouldRender}
-  <symbiote-modal p={root.hostBag} bind:this={hostShim}>
-    <symbiote-view p={root.containerBag}>
+  <modal p={root.hostBag} bind:this={hostShim}>
+    <view p={root.containerBag}>
       {@render rawProps.children?.()}
-    </symbiote-view>
-  </symbiote-modal>
+    </view>
+  </modal>
 {/if}

package/build/components/pressable/pressable-props.d.ts

@@ -11,6 +11,7 @@ export interface IPressableProps extends IAccessibilityProps, IAriaProps {
     onLongPress?: IPressHandler;
     delayLongPress?: number;
     disabled?: boolean;
+    focusable?: boolean;
     cancelable?: boolean;
     hitSlop?: IRectOffset;
     pressRetentionOffset?: IRectOffset;

package/build/components/refresh-control-props.d.ts

@@ -4,6 +4,7 @@ import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/component
 import type { ISvelteClassValue } from '../class-value';
 export interface IRefreshControlProps extends IAccessibilityProps, IAriaProps {
     refreshing: boolean;
+    id?: string;
     onRefresh?: () => void | Promise<void>;
     tintColor?: string;
     title?: string;

package/build/components/safe-area-view-props.d.ts

@@ -4,6 +4,7 @@ import type { IAccessibilityProps, IAriaProps } from '@symbiote-native/component
 import type { ISvelteClassValue } from '../class-value';
 export interface ISafeAreaViewProps extends IAccessibilityProps, IAriaProps {
     style?: IStyleProp<IViewStyle>;
+    id?: string;
     class?: ISvelteClassValue;
     onLayout?: (event: ISymbioteEvent) => void;
     children?: Snippet;

package/build/components/text-props.d.ts

@@ -14,6 +14,7 @@ export interface ITextProps extends IAccessibilityProps, IAriaProps {
     numberOfLines?: number;
     ellipsizeMode?: 'head' | 'middle' | 'tail' | 'clip';
     selectable?: boolean;
+    disabled?: boolean;
     adjustsFontSizeToFit?: boolean;
     minimumFontScale?: number;
     allowFontScaling?: boolean;