@symbiote-native/components 0.3.0 → 0.5.0

package/build/view/render-scroll-view.js

@@ -26,7 +26,7 @@ export function resolveDecelerationRate(rate) {
     // select() types as `number | undefined`; the always-present `default` makes the
     // `??` fallback unreachable, but it narrows the return to a plain `number` (no cast).
     if (rate === 'normal')
-        return Platform.select({ ios: 0.998, android: 0.985, default: 0.998 }) ?? 0.998;
+        return (Platform.select({ ios: 0.998, android: 0.985, default: 0.998 }) ?? 0.998);
     return Platform.select({ ios: 0.99, android: 0.9, default: 0.99 }) ?? 0.99;
 }
 // RN applies a base style to the scroll-view NODE itself, per axis (ScrollView.js
@@ -69,7 +69,12 @@ export function selectScrollIntrinsics(isHorizontal, contentContainerStyle) {
     const contentStyle = isHorizontal
         ? [contentContainerStyle, { flexDirection: 'row' }]
         : contentContainerStyle;
-    return { scrollViewIntrinsic, contentIntrinsic, scrollViewBaseStyle, contentStyle };
+    return {
+        scrollViewIntrinsic,
+        contentIntrinsic,
+        scrollViewBaseStyle,
+        contentStyle,
+    };
 }
 // When sticky headers are active the scroll offset must reach the AnimatedValue; RN raises the scroll
 // event rate for it (ScrollView.js:1798): throttle 1 on the native driver (it can afford every frame),
@@ -81,7 +86,8 @@ export function resolveScrollForwarding(inputs) {
     // maintainVisibleContentPosition (and Android snapToAlignment) anchor against MOUNTED cell views;
     // Android Fabric view-flattens layout-only cells away, so RN keeps them as real views with
     // collapsableChildren={false} on the content container (ScrollView.js preserveChildren). No-op on iOS.
-    const collapsableChildren = inputs.maintainVisibleContentPosition !== undefined || inputs.snapToAlignment !== undefined;
+    const collapsableChildren = inputs.maintainVisibleContentPosition !== undefined ||
+        inputs.snapToAlignment !== undefined;
     if (!inputs.hasStickyHeaders) {
         return {
             mode: 'plain',

package/build/view/render-switch.js

@@ -14,7 +14,10 @@ const IOS_BACKGROUND_BORDER_RADIUS = 16;
 function foldIosBackground(style, color) {
     if (color === undefined)
         return style;
-    return [style, { backgroundColor: color, borderRadius: IOS_BACKGROUND_BORDER_RADIUS }];
+    return [
+        style,
+        { backgroundColor: color, borderRadius: IOS_BACKGROUND_BORDER_RADIUS },
+    ];
 }
 export function renderSwitch(view, platform) {
     dlog(`Switch render value=${view.value} disabled=${String(view.disabled)}`);

package/build/view/render-touchable-highlight.d.ts

@@ -1,2 +1,12 @@
 import type { IViewStyle } from '@symbiote-native/engine';
-export declare function highlightPressedStyle<TStyle>(pressed: boolean, style: TStyle, underlayColor: string, activeOpacity: number): TStyle | [TStyle, IViewStyle];
+export interface ITouchableHighlightExtraStyles {
+    underlay: IViewStyle;
+    child: IViewStyle;
+}
+export interface ITouchableHighlightUnderlayView {
+    shown: boolean;
+    hasPressHandler: boolean;
+    underlayColor?: string;
+    activeOpacity?: number;
+}
+export declare function resolveHighlightExtraStyles(view: ITouchableHighlightUnderlayView): ITouchableHighlightExtraStyles | undefined;

package/build/view/render-touchable-highlight.js

@@ -1,12 +1,13 @@
 // TouchableHighlight underlay: the shared render decision (framework-agnostic). RN drives the
-// highlight with setState (not Animated) — while pressed it paints underlayColor + lowers the child
-// opacity, at rest it is the bare style (TouchableHighlight.js). This 3-line gating was triplicated
-// verbatim across adapters; it lives here once, prop-driven. Each adapter passes its own resolved
-// style base (React the raw style, Angular the anchor+style array, Vue the untyped attrs style) plus
-// the live `pressed`, so the base is generic — the overlay is layered on top when pressed.
-export function highlightPressedStyle(pressed, style, underlayColor, activeOpacity) {
-    if (!pressed)
-        return style;
-    const overlay = { backgroundColor: underlayColor, opacity: activeOpacity };
-    return [style, overlay];
+// highlight with setState, not Animated — while shown it paints underlayColor and lowers the child
+// opacity; at rest it is the bare style (TouchableHighlight.js).
+import { DEFAULT_HIGHLIGHT_CHILD_OPACITY, DEFAULT_UNDERLAY_COLOR, } from '../state/touchable.js';
+// undefined = paint nothing extra, which is RN's `extraStyles: null` state.
+export function resolveHighlightExtraStyles(view) {
+    if (!view.shown || !view.hasPressHandler)
+        return undefined;
+    return {
+        underlay: { backgroundColor: view.underlayColor ?? DEFAULT_UNDERLAY_COLOR },
+        child: { opacity: view.activeOpacity ?? DEFAULT_HIGHLIGHT_CHILD_OPACITY },
+    };
 }

package/build/view/render-touchable-native-feedback.js

@@ -14,7 +14,11 @@ export function canUseNativeForeground() {
         Platform.Version >= ANDROID_FOREGROUND_MIN_VERSION);
 }
 export function selectableBackground(rippleRadius) {
-    return { type: 'ThemeAttrAndroid', attribute: 'selectableItemBackground', rippleRadius };
+    return {
+        type: 'ThemeAttrAndroid',
+        attribute: 'selectableItemBackground',
+        rippleRadius,
+    };
 }
 export function selectableBackgroundBorderless(rippleRadius) {
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@symbiote-native/components",
-  "version": "0.3.0",
+  "version": "0.5.0",
   "description": "Framework-agnostic component logic (state machines + render functions) for SymbioteNative — written once, inherited by every adapter (React, Vue, Angular, ...).",
   "license": "MIT",
   "repository": {
@@ -39,7 +39,7 @@
   },
   "devDependencies": {
     "@types/node": "^26.0.0",
-    "@symbiote-native/engine": "0.1.7"
+    "@symbiote-native/engine": "0.3.0"
   },
   "scripts": {
     "typecheck": "tsc --build",

package/build/state/scroll-routing-handle/index.d.ts

@@ -1,10 +0,0 @@
-import type { ISymbioteNode } from '@symbiote-native/engine';
-import type { IScrollViewHandle } from '../../scroll-view-commands';
-export interface IScrollRoutingHandle {
-    flashScrollIndicators(): void;
-    getNativeScrollRef(): IScrollViewHandle | null;
-    getScrollableNode(): IScrollViewHandle | null;
-    getScrollResponder(): IScrollViewHandle | null;
-    getScrollNode(): ISymbioteNode | null;
-    recordInteraction(): void;
-}

package/build/state/scroll-routing-handle/index.js

@@ -1,6 +0,0 @@
-// The inner-scroll routing tail every windowed-list imperative handle exposes
-// (VirtualizedList, VirtualizedSectionList, and via those FlatList/SectionList). Each
-// method forwards straight to the underlying ScrollView's own handle/node; neither list
-// adds behavior of its own, so the 6 members live here once and both list handle types
-// extend this instead of hand-duplicating (and risking drift in) the signatures.
-export {};

package/build/view/layout-event/index.d.ts

@@ -1,2 +0,0 @@
-import type { ISymbioteEvent } from '@symbiote-native/engine';
-export declare function readLayoutField(event: ISymbioteEvent, key: 'width' | 'height' | 'y'): number | undefined;

package/build/view/layout-event/index.js

@@ -1,12 +0,0 @@
-// Shared across render-scroll-view's content/frame dimension read (width/height) and
-// render-scroll-sticky's header position read (y/height): both pull a single numeric field out of
-// an onLayout event's nativeEvent.layout. SymbioteEvent.nativeEvent is Record<string, unknown>, so
-// the layout box and the requested field are narrowed at runtime, no cast. A malformed event
-// yields undefined (no-op).
-export function readLayoutField(event, key) {
-    const layout = event.nativeEvent.layout;
-    if (typeof layout !== 'object' || layout === null)
-        return undefined;
-    const value = Reflect.get(layout, key);
-    return typeof value === 'number' ? value : undefined;
-}