@symbiote-native/solid 3.1.0 → 3.3.0

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

@@ -0,0 +1,53 @@
+// The public prop contract of the Solid VirtualizedList
+// Consumed by the lifecycle itself, everything LEFT OVER is the accessibility surface that rides
+// down onto the scroll host
+export const HANDLED_PROPS = [
+    'data',
+    'getItem',
+    'getItemCount',
+    'renderItem',
+    'ListItemComponent',
+    'getItemLayout',
+    'initialNumToRender',
+    'windowSize',
+    'disableVirtualization',
+    'ListHeaderComponent',
+    'ListFooterComponent',
+    'ListEmptyComponent',
+    'ItemSeparatorComponent',
+    'CellRendererComponent',
+    'ref',
+    'onEndReached',
+    'onEndReachedThreshold',
+    'onStartReached',
+    'onStartReachedThreshold',
+    'keyExtractor',
+    'onViewableItemsChanged',
+    'viewabilityConfig',
+    'viewabilityConfigCallbackPairs',
+    'onScroll',
+    'onScrollBeginDrag',
+    'onScrollEndDrag',
+    'onMomentumScrollBegin',
+    'onMomentumScrollEnd',
+    'scrollEventThrottle',
+    'keyboardShouldPersistTaps',
+    'keyboardDismissMode',
+    'horizontal',
+    'inverted',
+    'style',
+    'contentContainerStyle',
+    'ListHeaderComponentStyle',
+    'ListFooterComponentStyle',
+    'class',
+    'onScrollToIndexFailed',
+    'onRefresh',
+    'refreshing',
+    'progressViewOffset',
+    'stickyHeaderIndices',
+    'maintainVisibleContentPosition',
+    'initialScrollIndex',
+    'maxToRenderPerBatch',
+    'updateCellsBatchingPeriod',
+    'extraData',
+];

package/build/components/virtualized-section-list/index.d.ts

@@ -1,30 +1,37 @@
 import { type Accessor, type Ref } from 'solid-js';
 import type { JSX } from '../../jsx-runtime';
-import { type ISection, type IAccessibilityProps, type IAriaProps, type ISeparatorProps, type ISeparators, type IVirtualizedSectionListHandle } from '@symbiote-native/components';
+import { type ISection as ICoreSection, type IAccessibilityProps, type IAriaProps, type IInnerViewRef, type ISeparatorProps, type ISeparators, type IVirtualizedSectionListHandle } from '@symbiote-native/components';
 import { type IClassNameValue, type IStyleProp, type ISymbioteEvent, type IViewStyle } from '@symbiote-native/engine';
-export type { ISection, IVirtualizedSectionListHandle };
-export interface ISectionHeaderInfo<ItemT> {
+import { type ICellRendererComponent } from '../virtualized-list';
+export type { IVirtualizedSectionListHandle };
+export type ISection<ItemT> = ICoreSection<ItemT> & {
+    renderItem?: (info: Accessor<ISectionCellInfo<ItemT>>) => JSX.Element;
+    ItemSeparatorComponent?: (props: ISeparatorProps<ItemT>) => JSX.Element;
+};
+export type ISectionHeaderInfo<ItemT> = {
     section: ISection<ItemT>;
-}
-export interface ISectionCellInfo<ItemT> {
+};
+export type ISectionCellInfo<ItemT> = {
     item: ItemT;
     index: number;
     section: ISection<ItemT>;
     separators: ISeparators;
-}
-export interface IVirtualizedSectionListProps<ItemT> extends IAccessibilityProps, IAriaProps {
+};
+export type IVirtualizedSectionListProps<ItemT> = IAccessibilityProps & IAriaProps & {
     sections: ReadonlyArray<ISection<ItemT>>;
     renderItem: (info: Accessor<ISectionCellInfo<ItemT>>) => JSX.Element;
     renderSectionHeader?: (info: Accessor<ISectionHeaderInfo<ItemT>>) => JSX.Element;
     renderSectionFooter?: (info: Accessor<ISectionHeaderInfo<ItemT>>) => JSX.Element;
     stickySectionHeadersEnabled?: boolean;
-    SectionSeparatorComponent?: () => JSX.Element;
+    SectionSeparatorComponent?: (props: ISeparatorProps<ItemT>) => JSX.Element;
     keyExtractor?: (item: ItemT, index: number) => string;
     ItemSeparatorComponent?: (props: ISeparatorProps<ItemT>) => JSX.Element;
     ref?: Ref<IVirtualizedSectionListHandle>;
     ListHeaderComponent?: JSX.Element;
     ListFooterComponent?: JSX.Element;
     ListEmptyComponent?: JSX.Element;
+    ListHeaderComponentStyle?: IStyleProp<IViewStyle>;
+    ListFooterComponentStyle?: IStyleProp<IViewStyle>;
     extraData?: unknown;
     onEndReached?: (info: {
         distanceFromEnd: number;
@@ -42,7 +49,10 @@ export interface IVirtualizedSectionListProps<ItemT> extends IAccessibilityProps
     maxToRenderPerBatch?: number;
     updateCellsBatchingPeriod?: number;
     windowSize?: number;
+    disableVirtualization?: boolean;
+    CellRendererComponent?: ICellRendererComponent<unknown>;
     inverted?: boolean;
+    horizontal?: boolean;
     maintainVisibleContentPosition?: {
         minIndexForVisible: number;
         autoscrollToTopThreshold?: number;
@@ -52,13 +62,16 @@ export interface IVirtualizedSectionListProps<ItemT> extends IAccessibilityProps
     onScrollEndDrag?: (event: ISymbioteEvent) => void;
     onMomentumScrollBegin?: (event: ISymbioteEvent) => void;
     onMomentumScrollEnd?: (event: ISymbioteEvent) => void;
+    onContentSizeChange?: (width: number, height: number) => void;
     scrollEventThrottle?: number;
     keyboardShouldPersistTaps?: boolean | 'always' | 'never' | 'handled';
     keyboardDismissMode?: 'none' | 'on-drag' | 'interactive';
     removeClippedSubviews?: boolean;
     nestedScrollEnabled?: boolean;
+    stickyHeaderHiddenOnScroll?: boolean;
+    innerViewRef?: IInnerViewRef;
     style?: IStyleProp<IViewStyle>;
     contentContainerStyle?: IStyleProp<IViewStyle> | string;
     class?: IClassNameValue;
-}
+};
 export declare function VirtualizedSectionList<ItemT>(props: IVirtualizedSectionListProps<ItemT>): JSX.Element;

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

@@ -1,12 +1,10 @@
-// VirtualizedSectionList: sections flattened into one virtualized stream. Each section contributes
-// a header row, its item rows, then a footer row; the flattened tagged sequence feeds
-// VirtualizedList as a single list, so headers, items and footers are windowed by the same
-// machinery. The flattening, entry keying, separator-item unwrap and scrollToLocation mapping are
-// shared verbatim from @symbiote-native/components; this file wires only Solid's lifecycle.
+// Sections flattened into one virtualized stream: header, items and footer per section
+// Flattening, keying and `scrollToLocation` are shared, this file wires Solid's lifecycle
 import { createMemo, splitProps } from 'solid-js';
-import { flattenSections, resolveStickySectionHeaders, scrollLocationToFlatIndex, sectionEntryKey, unwrapEntryItem, } from '@symbiote-native/components';
+import { cellGapsFor, createSeparatorBoard, flattenSections, renderSectionEntry, resolveScrollLocation, resolveStickySectionHeaders, routeScrollHandle, SECTION_ENTRY_KIND, SEPARATOR_GAP_KIND, sectionEntryKey, } from '@symbiote-native/components';
 import { Platform, dlog, } from '@symbiote-native/engine';
 import { VirtualizedList, } from '../virtualized-list';
+import { SectionItemCell } from './section-item-cell.jsx';
 // Consumed by this layer; everything LEFT OVER is VirtualizedList's own surface (the scroll host,
 // the list chrome, the windowing knobs, the accessibility props) and rides down untouched, exactly
 // as React's VirtualizedSectionList spreads its `...rest` onto the inner list.
@@ -21,125 +19,99 @@ const HANDLED_PROPS = [
     'stickySectionHeadersEnabled',
     'ref',
 ];
-export function VirtualizedSectionList(props) {
-    const [, listRest] = splitProps(props, HANDLED_PROPS);
-    const flattened = createMemo(() => flattenSections(props.sections, props.SectionSeparatorComponent !== undefined));
-    const entries = () => flattened().entries;
-    // RN sticks section headers by default only on iOS; Android does not unless asked. The
-    // headerIndices are the flat positions of every section header, which the inner list wraps.
-    const stickyHeaderIndices = () => resolveStickySectionHeaders(props.stickySectionHeadersEnabled, flattened().headerIndices, Platform.OS);
-    // The entry under a row keeps its KIND for as long as the row lives — sectionEntryKey namespaces
-    // header/footer/separator keys away from item keys, so <For> never hands a row an entry of a
-    // different kind. `previous` covers only the tick where new sections have landed but the row has
-    // not been disposed yet, during which the row's index can point at a neighbouring entry.
-    function sectionInfo(info, initial) {
-        return createMemo((previous) => {
-            const entry = info().item;
-            return entry.kind === 'section-separator'
-                ? previous
-                : { section: entry.section };
-        }, { section: initial });
-    }
-    function cellInfo(info, initial) {
-        return createMemo((previous) => {
-            const entry = info().item;
-            if (entry.kind !== 'item')
-                return previous;
-            return {
-                item: entry.item,
-                index: entry.itemIndex,
-                section: entry.section,
-                separators: info().separators,
-            };
-        }, initial);
-    }
-    // The inner list, held by identity in a plain variable: everything this handle adds over
-    // VirtualizedList's own is the (section, item) -> flat index resolution, and the rest routes
-    // straight through — the shared IScrollRoutingHandle tail both list handles extend.
-    let inner;
-    const handle = {
+// Every entry kind carries its section, so a row whose index briefly points at a neighbour
+// still reads a valid one
+function sectionInfoOf(info) {
+    return createMemo(() => ({ section: info().item.section }));
+}
+function cellInfoOf(info, initial) {
+    return createMemo((previous) => {
+        const entry = info().item;
+        if (entry.kind !== SECTION_ENTRY_KIND.item)
+            return previous;
+        return {
+            item: entry.item,
+            index: entry.itemIndex,
+            section: entry.section,
+            separators: initial.separators,
+        };
+    }, initial);
+}
+// The separator for a gap: the section one, or the item one where a section's own beats the list's
+function separatorRenderFor(gap, props) {
+    if (gap.props === undefined)
+        return undefined;
+    const gapProps = gap.props;
+    const Separator = gap.kind === SEPARATOR_GAP_KIND.section
+        ? props.SectionSeparatorComponent
+        : (gapProps.section.ItemSeparatorComponent ??
+            props.ItemSeparatorComponent);
+    if (Separator === undefined)
+        return undefined;
+    return ({ isHighlighted, override }) => (<Separator highlighted={isHighlighted} {...gapProps} {...override}/>);
+}
+// An item entry becomes a cell that paints its own separators around the row
+function itemCellFor(rendering, info, entry) {
+    const { props, entries, keyOf } = rendering;
+    const gaps = createMemo(() => cellGapsFor(entries(), info().index));
+    const renderItem = entry.section.renderItem ?? props.renderItem;
+    return (<SectionItemCell board={rendering.board} cellKey={createMemo(() => keyOf(info().item))} prevCellKey={createMemo(() => {
+            const previous = entries()[info().index - 1];
+            return previous === undefined ? undefined : keyOf(previous);
+        })} renderItem={separators => renderItem(cellInfoOf(info, {
+            item: entry.item,
+            index: entry.itemIndex,
+            section: entry.section,
+            separators,
+        }))} leadingSeparator={createMemo(() => separatorRenderFor(gaps().leading, props))} trailingSeparator={createMemo(() => separatorRenderFor(gaps().trailing, props))} isInverted={props.inverted === true}/>);
+}
+// Called once per cell, `buildCell` of `VirtualizedList` already untracks it
+function entryRendererFor(rendering) {
+    const { props } = rendering;
+    return info => renderSectionEntry({
+        header: () => props.renderSectionHeader?.(sectionInfoOf(info)),
+        footer: () => props.renderSectionFooter?.(sectionInfoOf(info)),
+        item: entry => itemCellFor(rendering, info, entry),
+    }, info().item);
+}
+// This handle adds the (section, item) to flat index resolution over the list's own handle
+// The rest routes straight through the shared `IScrollRoutingHandle` tail
+function buildSectionHandle(getInner, locate) {
+    return {
         scrollToLocation: (params) => {
-            const flatIndex = scrollLocationToFlatIndex(flattened().headerIndices, params.sectionIndex, params.itemIndex);
-            if (flatIndex === undefined) {
+            const target = locate(params);
+            if (target === undefined) {
                 dlog(`VirtualizedSectionList scrollToLocation: section ${params.sectionIndex} out of range`);
                 return;
             }
             dlog(`VirtualizedSectionList scrollToLocation section=${params.sectionIndex} ` +
-                `item=${params.itemIndex} -> flat ${flatIndex}`);
-            inner?.scrollToIndex({
-                index: flatIndex,
-                viewOffset: params.viewOffset,
-                viewPosition: params.viewPosition,
-                animated: params.animated,
-            });
-        },
-        flashScrollIndicators: () => {
-            inner?.flashScrollIndicators();
-        },
-        getNativeScrollRef: () => inner?.getNativeScrollRef() ?? null,
-        getScrollableNode: () => inner?.getScrollableNode() ?? null,
-        getScrollResponder: () => inner?.getScrollResponder() ?? null,
-        getScrollNode: () => inner?.getScrollNode() ?? null,
-        recordInteraction: () => {
-            inner?.recordInteraction();
+                `item=${params.itemIndex} -> flat ${target.index}`);
+            getInner()?.scrollToIndex(target);
         },
+        ...routeScrollHandle(getInner),
     };
+}
+export function VirtualizedSectionList(props) {
+    const [, listRest] = splitProps(props, HANDLED_PROPS);
+    const flattened = createMemo(() => flattenSections(props.sections));
+    const entries = () => flattened().entries;
+    // RN sticks section headers by default only on iOS; Android does not unless asked. The
+    // headerIndices are the flat positions of every section header, which the inner list wraps.
+    const stickyHeaderIndices = () => resolveStickySectionHeaders(props.stickySectionHeadersEnabled, flattened().headerIndices, Platform.OS);
+    // The inner list, held by identity in a plain variable
+    let inner;
+    const handle = buildSectionHandle(() => inner, params => resolveScrollLocation(flattened().headerIndices, stickyHeaderIndices(), params));
     if (typeof props.ref === 'function')
         props.ref(handle);
-    // Section chrome keys off its section (and never reaches the user's extractor, which is typed on
-    // ItemT); an item keys off the user's extractor with its index INSIDE its section.
-    function entryKeyExtractor(entry, index) {
-        return sectionEntryKey(entry, index, props.keyExtractor);
-    }
-    function entrySeparatorProps(entryProps) {
-        return {
-            ...entryProps,
-            leadingItem: unwrapEntryItem(entryProps.leadingItem),
-            trailingItem: unwrapEntryItem(entryProps.trailingItem),
-        };
-    }
-    // The user's separator is typed on ItemT while the inner stream carries the entry wrapper, so
-    // each side is unwrapped back to its item — undefined for a gap next to section chrome, which has
-    // no item on that side.
-    const entrySeparatorComponent = createMemo(() => {
-        const ItemSeparator = props.ItemSeparatorComponent;
-        if (ItemSeparator === undefined)
-            return undefined;
-        // ONE bag, not a spread plus two overriding attributes: Solid's mergeProps resolves a key by
-        // scanning its sources back to front and taking the first NON-undefined value, so an override
-        // that unwraps to `undefined` (every gap next to section chrome) falls back to the raw entry
-        // instead of clearing it, and the user's `leadingItem` reads as the wrapper object. Building the
-        // whole bag in one function keeps a single source — and, being a spread of a CALL, it compiles
-        // to mergeProps(() => …) so the separator's props stay live.
-        return (entryProps) => (<ItemSeparator {...entrySeparatorProps(entryProps)}/>);
+    // Section chrome keys off its section and never reaches the user's extractor, typed on ItemT
+    const entryKeyExtractor = (entry) => sectionEntryKey(entry, props.keyExtractor);
+    const renderEntry = entryRendererFor({
+        props,
+        entries,
+        board: createSeparatorBoard(),
+        keyOf: entryKeyExtractor,
     });
-    // Called ONCE per cell and already untracked by VirtualizedList's buildCell.
-    function renderEntry(info) {
-        const entry = info().item;
-        if (entry.kind === 'header') {
-            const header = props.renderSectionHeader;
-            return header === undefined
-                ? undefined
-                : header(sectionInfo(info, entry.section));
-        }
-        if (entry.kind === 'footer') {
-            const footer = props.renderSectionFooter;
-            return footer === undefined
-                ? undefined
-                : footer(sectionInfo(info, entry.section));
-        }
-        if (entry.kind === 'section-separator') {
-            const SectionSeparator = props.SectionSeparatorComponent;
-            return SectionSeparator === undefined ? undefined : <SectionSeparator />;
-        }
-        return props.renderItem(cellInfo(info, {
-            item: entry.item,
-            index: entry.itemIndex,
-            section: entry.section,
-            separators: info().separators,
-        }));
-    }
-    return (<VirtualizedList {...listRest} data={entries()} getItem={(_source, index) => entries()[index]} getItemCount={() => entries().length} renderItem={renderEntry} stickyHeaderIndices={stickyHeaderIndices()} keyExtractor={entryKeyExtractor} ItemSeparatorComponent={entrySeparatorComponent()} ref={list => {
+    return (<VirtualizedList {...listRest} data={entries()} getItem={(_source, index) => entries()[index]} getItemCount={() => entries().length} renderItem={renderEntry} stickyHeaderIndices={stickyHeaderIndices()} keyExtractor={entryKeyExtractor} ref={list => {
             inner = list;
         }}/>);
 }

package/build/components/virtualized-section-list/section-item-cell.d.ts

@@ -0,0 +1,18 @@
+import { type Accessor } from 'solid-js';
+import type { JSX } from '../../jsx-runtime';
+import { type ISeparatorBoard, type ISeparators } from '@symbiote-native/components';
+export type ISeparatorState = {
+    isHighlighted: boolean;
+    override: Record<string, unknown> | undefined;
+};
+export type ISeparatorRender = (state: ISeparatorState) => JSX.Element;
+export type ISectionItemCellProps = {
+    board: ISeparatorBoard<Record<string, unknown>>;
+    cellKey: Accessor<string>;
+    prevCellKey: Accessor<string | undefined>;
+    renderItem: (separators: ISeparators) => JSX.Element;
+    leadingSeparator: Accessor<ISeparatorRender | undefined>;
+    trailingSeparator: Accessor<ISeparatorRender | undefined>;
+    isInverted: boolean;
+};
+export declare function SectionItemCell(props: ISectionItemCellProps): JSX.Element;

package/build/components/virtualized-section-list/section-item-cell.jsx

@@ -0,0 +1,37 @@
+// Item cell with its separators around it, as in RN's `ItemWithSeparator`
+// Their state sits in a shared board, т.к. `highlight()` also lights the previous cell's one
+import { createEffect, createSignal, onCleanup, untrack, } from 'solid-js';
+import { createCellSeparators, } from '@symbiote-native/components';
+export function SectionItemCell(props) {
+    const { board } = props;
+    const [state, setState] = createSignal(untrack(() => board.read(props.cellKey())));
+    createEffect(() => {
+        const cellKey = props.cellKey();
+        setState(board.read(cellKey));
+        const unsubscribe = board.subscribe(cellKey, () => setState(board.read(cellKey)));
+        onCleanup(() => {
+            unsubscribe();
+            board.release(cellKey);
+        });
+    });
+    const separators = createCellSeparators(board, () => ({
+        cellKey: props.cellKey(),
+        prevCellKey: props.prevCellKey(),
+        has: {
+            leading: props.leadingSeparator() !== undefined,
+            trailing: props.trailingSeparator() !== undefined,
+        },
+    }));
+    const content = untrack(() => props.renderItem(separators));
+    const leading = () => props.leadingSeparator()?.({
+        isHighlighted: state().leadingHighlighted,
+        override: state().leadingOverride,
+    });
+    const trailing = () => props.trailingSeparator()?.({
+        isHighlighted: state().trailingHighlighted,
+        override: state().trailingOverride,
+    });
+    return props.isInverted
+        ? [trailing, content, leading]
+        : [leading, content, trailing];
+}

package/build/components.d.ts

@@ -1,6 +1,8 @@
 export type { IViewProps } from './components/view-props';
 export type { ITextProps } from './components/text-props';
 export type { ISafeAreaViewProps } from './components/safe-area-view-props';
+export type { ILayoutConformanceProps } from './components/layout-conformance-props';
+export type { ILayoutConformanceMode } from '@symbiote-native/components';
 export type { IImageProps } from './components/image-props';
 export type { IPressableProps } from './components/pressable-props';
 export type { IActivityIndicatorProps } from './components/activity-indicator-props';
@@ -16,7 +18,9 @@ export type { IRefreshControlProps } from './components/refresh-control-props';
 export type { IScrollViewProps } from './components/scroll-view-props';
 export type { IScrollViewHandle } from '@symbiote-native/components';
 export { VirtualizedList } from './components/virtualized-list';
-export type { IVirtualizedListProps, IVirtualizedListHandle, IVirtualizedListCellInfo, IVirtualizedListRenderItem, ICellLayout, ISeparators, ISeparatorProps, IViewToken, IViewableItemsChangedInfo, IViewabilityConfig, IViewabilityConfigCallbackPair, } from './components/virtualized-list';
+export { useVirtualizedListScope } from './components/virtualized-list/nested-scope';
+export type { IListScope } from '@symbiote-native/components';
+export type { IVirtualizedListProps, IVirtualizedListHandle, ICellRendererComponent, ICellRendererProps, IVirtualizedListCellInfo, IVirtualizedListRenderItem, ICellLayout, ISeparators, ISeparatorProps, IViewToken, IViewableItemsChangedInfo, IViewabilityConfig, IViewabilityConfigCallbackPair, } from './components/virtualized-list';
 export { FlatList } from './components/flat-list';
 export type { IFlatListProps, IFlatListHandle } from './components/flat-list';
 export { VirtualizedSectionList } from './components/virtualized-section-list';
@@ -29,5 +33,6 @@ export { TouchableNativeFeedback } from '@symbiote-native/components';
 export type { INativeFeedbackBackground, IThemeAttrBackground, IRippleBackground, } from '@symbiote-native/components';
 export type { ITouchableNativeFeedbackProps } from './components/touchable-native-feedback/touchable-native-feedback-props';
 export type { IButtonProps } from './components/button-props';
+export type { ICheckboxProps } from './components/checkbox-props';
 export type { IImageBackgroundProps } from './components/image-background-props';
 export type { IInputAccessoryViewProps } from './components/input-accessory-view-props';

package/build/components.js

@@ -8,6 +8,7 @@ export { KeyboardAvoidingView } from './components/keyboard-avoiding-view.jsx';
 // for the same import as the component. `IVirtualizedListComponent` stays internal — it is the
 // platform factory's return type, not API.
 export { VirtualizedList } from './components/virtualized-list';
+export { useVirtualizedListScope } from './components/virtualized-list/nested-scope.js';
 // FlatList carries no platform split of its own — the iOS/Android divergence is
 // VirtualizedList's refreshControlMode, inherited by importing that folder, so Metro picks the
 // right variant with nothing here to switch on. IFlatListProps is an Omit over

package/build/define-descriptor-component.d.ts

@@ -0,0 +1,6 @@
+import type { JSX } from 'solid-js';
+import type { IDescriptor } from '@symbiote-native/components';
+import type { ISymbioteNode } from '@symbiote-native/engine';
+export declare function defineDescriptorComponent<P extends {
+    children?: JSX.Element;
+}>(render: (props: object) => IDescriptor): (props: P) => ISymbioteNode;

package/build/define-descriptor-component.js

@@ -0,0 +1,10 @@
+import { splitProps } from 'solid-js';
+import { descriptorToSolid } from './descriptor-to-solid.js';
+// A component whose host is one shared render function: children are the caller's own and go
+// inside the host, every other prop reaches the render function
+export function defineDescriptorComponent(render) {
+    return props => {
+        const [, rest] = splitProps(props, ['children']);
+        return descriptorToSolid(() => render({ ...rest }), () => props.children);
+    };
+}

package/build/define-optional-descriptor-component.d.ts

@@ -0,0 +1,3 @@
+import type { IDescriptor } from '@symbiote-native/components';
+import type { ISymbioteNode } from '@symbiote-native/engine';
+export declare function defineOptionalDescriptorComponent<P extends object>(render: (props: object) => IDescriptor | null): (props: P) => ISymbioteNode | null;

package/build/define-optional-descriptor-component.js

@@ -0,0 +1,12 @@
+import { descriptorToSolid } from './descriptor-to-solid.js';
+// A childless component whose render function may answer `null`, for a native view that exists
+// on one platform only. The answer is decided once at mount: the bridge builds the node once
+// and then only diffs prop values, so the descriptor's shape must not change afterwards
+export function defineOptionalDescriptorComponent(render) {
+    return props => {
+        const initial = render({ ...props });
+        if (!initial)
+            return null;
+        return descriptorToSolid(() => render({ ...props }) ?? initial);
+    };
+}

package/build/descriptor-to-solid.d.ts

@@ -1,3 +1,4 @@
+import { type JSX } from 'solid-js';
 import { type ISymbioteNode } from '@symbiote-native/engine';
 import type { IDescriptor } from '@symbiote-native/components';
-export declare function descriptorToSolid(descriptor: () => IDescriptor): ISymbioteNode;
+export declare function descriptorToSolid(descriptor: () => IDescriptor, children?: () => JSX.Element): ISymbioteNode;

package/build/descriptor-to-solid.js

@@ -23,7 +23,7 @@
 import { createMemo, createRenderEffect } from 'solid-js';
 import { isSymbioteNode } from '@symbiote-native/engine';
 import { createDescriptorShapeGuard } from '@symbiote-native/components';
-import { createElement, createTextNode, insertNode, replaceText, spread, } from './renderer.js';
+import { createElement, createTextNode, insert, insertNode, replaceText, spread, } from './renderer.js';
 // The vanished-key widening the render effect below stands on. Shared with the host primitives
 // (components/view, components/text), which fold their props through the same two-branch
 // resolveAccessibilityProps — see that module's header.
@@ -86,6 +86,10 @@ function mountChildren(parent, children) {
 }
 // The memo is what keeps the render fn running ONCE per change no matter how many accessors read
 // it — the root's props, every child's props, every text child all derive from the same call.
-export function descriptorToSolid(descriptor) {
-    return buildNode(createMemo(descriptor));
+// `children` is a component's own slot, inserted after the descriptor's children
+export function descriptorToSolid(descriptor, children) {
+    const root = buildNode(createMemo(descriptor));
+    if (children)
+        insert(root, children);
+    return root;
 }

package/build/index.d.ts

@@ -6,8 +6,10 @@ export * from './components';
 export type { IAccessibilityProps, IAriaProps, IAccessibilityRole, IRole, IAccessibilityStateValue, IAccessibilityValue, IAccessibilityActionInfo, IResponderProps, IImageSource, IImageSourceProp, IResizeMode, IImageSize, IImageCacheStatus, IEnterKeyHint, IInputMode, ISubmitBehavior, } from '@symbiote-native/components';
 export { setImageSourceResolver } from '@symbiote-native/components';
 export { descriptorToSolid } from './descriptor-to-solid';
-export { AppRegistry, setHostRegistrar } from './modules/app-registry';
-export type { IComponentProvider, IWrapperComponentProvider, IAppParameters, IRunnable, IHostRegistrar, IRegistry, IHeadlessTask, ITaskProvider, ITaskCanceller, ITaskCancelProvider, } from './modules/app-registry';
+export { defineDescriptorComponent } from './define-descriptor-component';
+export { defineOptionalDescriptorComponent } from './define-optional-descriptor-component';
+export { AppRegistry, HeadlessJsTaskError, setHostRegistrar, } from './modules/app-registry';
+export type { IComponentProvider, IWrapperComponentProvider, IAppConfig, IAppParameters, IRunnable, IHostRegistrar, IRegistry, IHeadlessTask, ITaskProvider, ITaskCanceller, ITaskCancelProvider, } from './modules/app-registry';
 export { StatusBar } from './modules/status-bar';
 export type { IStatusBarProps, IStatusBarStyle } from './modules/status-bar';
 export { Image } from './modules/image';
@@ -17,19 +19,26 @@ export { createTunnel } from './create-tunnel';
 export type { ITunnel, ITunnelInProps } from './create-tunnel';
 export { createColorScheme } from './primitives/create-color-scheme';
 export { createWindowDimensions } from './primitives/create-window-dimensions';
+export { createAnimatedColor, createAnimatedValue, createAnimatedValueXY, } from '@symbiote-native/engine';
 export { createPermissionHook } from './primitives/create-permission-hook';
 export { createResourceHook } from './primitives/create-resource-hook';
+export { defineNativeViewComponent } from './primitives/define-native-view-component';
 export { createEventValueHook } from './primitives/create-event-value-hook';
+export { useEvent, useEventListener } from './primitives/use-event';
 export { Animated, createAnimatedComponent } from './modules/animated';
 export type { IAnimatedComponentProps } from './modules/animated';
 export { Platform, StyleSheet, PixelRatio, PlatformColor, DynamicColorIOS, processColor, } from '@symbiote-native/engine';
-export { setNativeViewConfigSource, setColorProcessor, setDeviceEventSource, } from '@symbiote-native/engine';
+export { setNativeViewConfigSource, setColorProcessor, } from '@symbiote-native/engine';
 export { dlog, isDebug } from '@symbiote-native/engine';
 export type { IViewStyle, ITextStyle, IFlexAlign, IFlexJustify, ISymbioteEvent, ISymbioteNode, IRootTag, INativeViewConfig, INativeViewConfigSource, IColorValue, IOpaqueColorValue, IDynamicColorIOSTuple, IPixelRatioStatic, IPlatformStatic, IPlatformOSType, IPlatformConstantsIOS, IPlatformConstantsAndroid, IPlatformSelectSpec, } from '@symbiote-native/engine';
-export { Alert, Share, ActionSheetIOS, Linking, Vibration, ToastAndroid, Settings, I18nManager, Dimensions, Appearance, AppState, Keyboard, KEYBOARD_EVENT, BackHandler, PermissionsAndroid, PERMISSIONS, RESULTS, LayoutAnimation, InteractionManager, } from '@symbiote-native/engine';
+export { Alert, Share, ActionSheetIOS, Linking, Vibration, ToastAndroid, Settings, I18nManager, Dimensions, Appearance, AppState, Keyboard, KEYBOARD_EVENT, TextInputState, BackHandler, PermissionsAndroid, PERMISSIONS, RESULTS, LayoutAnimation, InteractionManager, } from '@symbiote-native/engine';
 export type { IAlertType, IAlertButtonStyle, IAlertButton, IAlertButtons, IAlertOptions, IShareContent, IShareOptions, IShareAction, IActionSheetIOSOptions, IShareActionSheetIOSOptions, IShareActionSheetError, IUrlEvent, II18nManagerConstants, IDisplayMetrics, IDisplayMetricsAndroid, IDimensionsPayload, IDimensionsSet, IDimensionsKey, IDimensionsChangeListener, IDimensionsStatic, IColorSchemeName, IColorSchemePreference, IAppStateStatus, IAppStateEvent, IKeyboardEventName, IKeyboardEvent, IKeyboardMetrics, IBackPressEventName, IBackPressHandler, IPermission, IPermissionStatus, IRationale, ILayoutAnimationType, ILayoutAnimationProperty, ILayoutAnimationConfig, ILayoutAnimationAnim, IInteractionEvent, ISimpleTask, IPromiseTask, ITask, IHandle, } from '@symbiote-native/engine';
 export { PanResponder } from '@symbiote-native/engine';
 export type { IPanResponderGestureState, IPanResponderCallbacks, IGestureResponderHandlers, IPanResponderInstance, } from '@symbiote-native/engine';
 export { AccessibilityInfo } from '@symbiote-native/engine';
 export type { IAccessibilityChangeEvent, IAccessibilityChangeEventName, IAccessibilityChangeEventHandler, IAccessibilityAnnouncementFinishedEvent, IAnnounceForAccessibilityOptions, IAccessibilityEventType, } from '@symbiote-native/engine';
 export { For, Index, Show, ErrorBoundary, Suspense, SuspenseList, } from 'solid-js';
+export { DeviceEventEmitter, Easing, EventEmitter, NativeAppEventEmitter, NativeEventEmitter, } from '@symbiote-native/engine';
+export type { IEasing, IEasingFunction, IEmitterSubscription, IEventEmitter, IEventEmitterModule, IEventSubscription, INativeEventListener, } from '@symbiote-native/engine';
+export { codegenNativeCommands, codegenNativeComponent, DevMenu, DevSettings, LogBox, NativeComponentRegistry, NativeModules, Networking, PushNotificationIOS, ReactNativeVersion, registerCallableModule, requireNativeComponent, Systrace, Touchable, TurboModuleRegistry, UIManager, UTFSequence, } from '@symbiote-native/engine';
+export type { IDevSettings } from '@symbiote-native/engine';