@symbiote-native/components 0.2.5 → 0.2.6

package/build/index.js

@@ -24,7 +24,7 @@ export { switchReducer, createInitialSwitchState, shouldSnapBack, valueFromChang
 export { resolveDecelerationRate, selectScrollIntrinsics, readLayoutDimension, didContentSizeChange, SCROLL_VIEW_BASE_HORIZONTAL, SCROLL_VIEW_BASE_VERTICAL, } from './view/render-scroll-view.js';
 export { buildScrollViewHandle, splitLayoutProps, attachStickyScroll, isSymbioteEvent, forwardScrollEvent, } from './scroll-view-commands.js';
 export { computeStickyInterpolation, nextStickyHeaderY, stickyDebounceMs, readLayoutNumber, STICKY_HEADER_Z_INDEX, } from './view/render-scroll-sticky.js';
-export { renderImage } from './view/render-image.js';
+export { renderImage } from './view/render-image/index.js';
 export { imageStatics, setImageSourceResolver } from '@symbiote-native/engine';
 // ImageBackground: render-only composition (absolute-fill image behind, children on top).
 export { renderImageBackground } from './view/render-image-background.js';

package/build/view/render-image-background.js

@@ -10,7 +10,7 @@
 // the box. `imageStyle` wins last.
 import { dlog, flattenStyle, } from '@symbiote-native/engine';
 import { el } from '../descriptor.js';
-import { renderImage } from './render-image.js';
+import { renderImage } from './render-image/index.js';
 // The inner Image's positioning: absolute-fill behind the wrapper's children.
 const IMAGE_BACKGROUND_ABSOLUTE_FILL = {
     position: 'absolute',

package/package.json

@@ -1,7 +1,8 @@
 {
   "name": "@symbiote-native/components",
-  "version": "0.2.5",
+  "version": "0.2.6",
   "description": "Framework-agnostic component logic (state machines + render functions) for SymbioteNative — written once, inherited by every adapter (React, Vue, Angular, ...).",
+  "license": "MIT",
   "repository": {
     "type": "git",
     "url": "git+https://github.com/OneEyed1366/symbiote-native.git",
@@ -33,12 +34,12 @@
     "access": "public"
   },
   "peerDependencies": {
-    "@symbiote-native/engine": ">=0.1.6",
+    "@symbiote-native/engine": ">=0.1.7",
     "react-native": ">=0.86"
   },
   "devDependencies": {
     "@types/node": "^26.0.0",
-    "@symbiote-native/engine": "0.1.6"
+    "@symbiote-native/engine": "0.1.7"
   },
   "scripts": {
     "typecheck": "tsc --build",

package/build/view/render-image.d.ts

@@ -1,56 +0,0 @@
-import { type IImageSource, type IImageSourceProp, type IStyleProp, type ISymbioteEvent, type IViewStyle } from '@symbiote-native/engine';
-import type { IAccessibilityProps, IAriaProps } from '../accessibility-props';
-import { type IDescriptor } from '../descriptor';
-export type { IImageSource, IImageSourceProp };
-type IImageEventHandler = (event: ISymbioteEvent) => void;
-export type IResizeMode = 'cover' | 'contain' | 'stretch' | 'repeat' | 'center';
-export type IImageCapInsets = {
-    top: number;
-    left: number;
-    bottom: number;
-    right: number;
-};
-export type IResizeMethod = 'auto' | 'resize' | 'scale' | 'none';
-export type IImageProps = IAccessibilityProps & IAriaProps & {
-    source?: IImageSourceProp;
-    defaultSource?: IImageSourceProp;
-    loadingIndicatorSource?: IImageSourceProp;
-    style?: IStyleProp<IViewStyle>;
-    resizeMode?: IResizeMode;
-    resizeMethod?: IResizeMethod;
-    tintColor?: string;
-    blurRadius?: number;
-    capInsets?: IImageCapInsets;
-    fadeDuration?: number;
-    progressiveRenderingEnabled?: boolean;
-    src?: string;
-    srcSet?: string;
-    alt?: string;
-    width?: number;
-    height?: number;
-    crossOrigin?: 'anonymous' | 'use-credentials';
-    referrerPolicy?: string;
-    onLoadStart?: IImageEventHandler;
-    onLoad?: IImageEventHandler;
-    onLoadEnd?: IImageEventHandler;
-    onError?: IImageEventHandler;
-    onProgress?: IImageEventHandler;
-    onPartialLoad?: IImageEventHandler;
-};
-export type IImageViewProps = {
-    source?: IImageSourceProp;
-    defaultSource?: IImageSourceProp;
-    loadingIndicatorSource?: IImageSourceProp;
-    style?: IStyleProp<IViewStyle>;
-    resizeMode?: IResizeMode;
-    tintColor?: string;
-    src?: string;
-    srcSet?: string;
-    alt?: string;
-    width?: number;
-    height?: number;
-    crossOrigin?: 'anonymous' | 'use-credentials';
-    referrerPolicy?: string;
-    passthrough: Record<string, unknown>;
-};
-export declare function renderImage(view: IImageViewProps): IDescriptor;

package/build/view/render-image.js

@@ -1,133 +0,0 @@
-import { dlog, flattenStyle, resolveImageSource, } from '@symbiote-native/engine';
-import { el } from '../descriptor.js';
-// Resolve the source, then normalize to the array shape native expects. A single
-// object/number becomes a one-element array; an already-array source passes through.
-function normalizeSource(source) {
-    const resolved = resolveImageSource(source);
-    const sources = Array.isArray(resolved) ? resolved : [resolved];
-    dlog(`Image source resolved to ${JSON.stringify(sources)}`);
-    return sources;
-}
-// The HTTP headers the W3C aliases (crossOrigin / referrerPolicy) contribute to
-// every folded source, mirroring ImageSourceUtils.js getImageSourcesFromImageProps:
-// 'use-credentials' adds the credentials header; referrerPolicy adds Referrer-Policy.
-function headersFromAliases(view) {
-    const headers = {};
-    if (view.crossOrigin === 'use-credentials') {
-        headers['Access-Control-Allow-Credentials'] = 'true';
-    }
-    if (view.referrerPolicy !== undefined) {
-        headers['Referrer-Policy'] = view.referrerPolicy;
-    }
-    return headers;
-}
-// Expand a `srcSet` descriptor list into scaled sources, falling back to `src` for
-// the 1x slot when srcSet omits it. Direct port of getImageSourcesFromImageProps'
-// srcSet branch (ImageSourceUtils.js:48). Invalid scale tokens are skipped, matching
-// RN's parse-and-warn behavior.
-function expandSrcSet(srcSet, view, headers) {
-    const sources = [];
-    let useSrcForDefaultScale = true;
-    for (const entry of srcSet.split(', ')) {
-        const [uri, xScale = '1x'] = entry.split(' ');
-        if (!xScale.endsWith('x')) {
-            dlog(`Image srcSet: unsupported scale token "${xScale}", skipping`);
-            continue;
-        }
-        const scale = parseInt(xScale.slice(0, -1), 10);
-        if (Number.isNaN(scale))
-            continue;
-        if (scale === 1)
-            useSrcForDefaultScale = false;
-        sources.push({ uri, scale, width: view.width, height: view.height, ...{ headers } });
-    }
-    if (useSrcForDefaultScale && view.src !== undefined) {
-        sources.push({
-            uri: view.src,
-            scale: 1,
-            width: view.width,
-            height: view.height,
-            ...{ headers },
-        });
-    }
-    if (sources.length === 0)
-        dlog('Image srcSet: produced no valid sources');
-    return sources;
-}
-// Resolve the native `source` array from whichever of source / src / srcSet the
-// caller provided. Mirrors ImageSourceUtils.js getImageSourcesFromImageProps:
-// srcSet wins, then src, then a header-decorated source, then the plain source.
-// Always returns the array shape native expects (the same contract normalizeSource
-// guarantees), so the component never sends a bare object.
-function resolveSourceArray(view) {
-    const headers = headersFromAliases(view);
-    if (view.srcSet !== undefined) {
-        return expandSrcSet(view.srcSet, view, headers);
-    }
-    if (view.src !== undefined) {
-        return [{ uri: view.src, width: view.width, height: view.height, ...{ headers } }];
-    }
-    if (view.source === undefined) {
-        dlog('Image: no source / src / srcSet provided');
-        return [];
-    }
-    const sources = normalizeSource(view.source);
-    // A header-decorated single object source gets the headers merged in, per RN's
-    // `source.uri && headers` branch; the array/number shapes pass through untouched.
-    if (Object.keys(headers).length > 0 && sources.length === 1) {
-        const [only] = sources;
-        if (typeof only === 'object' && only !== null && typeof Reflect.get(only, 'uri') === 'string') {
-            return [{ ...only, headers }];
-        }
-    }
-    return sources;
-}
-function readStyleString(style, key) {
-    if (style === undefined)
-        return undefined;
-    // style is a StyleProp (possibly a nested array), so flatten before reading a key.
-    const flat = flattenStyle(style);
-    const value = Object.hasOwn(flat, key) ? flat[key] : undefined;
-    return typeof value === 'string' ? value : undefined;
-}
-// Resolve an asset source and read its single uri. RN forwards the Android
-// loading indicator as a bare uri string (`loadingIndicatorSrc`), not the
-// array shape the main source uses, so we resolve and pluck the uri.
-function readSourceUri(source) {
-    const [resolved] = normalizeSource(source);
-    if (typeof resolved === 'object' && resolved !== null) {
-        const uri = Reflect.get(resolved, 'uri');
-        if (typeof uri === 'string')
-            return uri;
-    }
-    return undefined;
-}
-export function renderImage(view) {
-    // `width` / `height` aliases fold into style (ImageProps.js:195,202); explicit
-    // style keys win, matching RN's `{width, height}, ...style` ordering.
-    const foldedStyle = view.width === undefined && view.height === undefined
-        ? view.style
-        : [{ width: view.width, height: view.height }, view.style];
-    const mapped = {
-        ...view.passthrough,
-        style: foldedStyle,
-        source: resolveSourceArray(view),
-        resizeMode: view.resizeMode ?? readStyleString(view.style, 'resizeMode'),
-        tintColor: view.tintColor ?? readStyleString(view.style, 'tintColor'),
-    };
-    // `alt` is the accessibility text: it sets accessibilityLabel and marks the image
-    // accessible (Image.ios.js / Image.android.js: alt -> accessibilityLabel + accessible).
-    // An explicit accessibilityLabel (already folded into passthrough) still wins.
-    if (view.alt !== undefined) {
-        if (mapped.accessibilityLabel === undefined)
-            mapped.accessibilityLabel = view.alt;
-        mapped.accessible = true;
-    }
-    if (view.defaultSource !== undefined)
-        mapped.defaultSource = normalizeSource(view.defaultSource);
-    if (view.loadingIndicatorSource !== undefined) {
-        mapped.loadingIndicatorSrc = readSourceUri(view.loadingIndicatorSource);
-    }
-    dlog('Image -> RCTImageView');
-    return el('symbiote-image', mapped);
-}