@sigx/lynx-runtime 0.4.0 → 0.4.1

package/dist/animated/animated-value.d.ts

@@ -12,5 +12,5 @@
  *
  * The old names continue to work via these re-exports for one minor cycle.
  */
-export { SharedValue as AnimatedValue, useSharedValue as useAnimatedValue, } from './shared-value';
-export type { SharedValueState as AnimatedValueState } from './shared-value';
+export { SharedValue as AnimatedValue, useSharedValue as useAnimatedValue, } from './shared-value.js';
+export type { SharedValueState as AnimatedValueState } from './shared-value.js';

package/dist/animated/animated-value.js

@@ -0,0 +1,15 @@
+/**
+ * @deprecated since Phase 2.8 — renamed to `SharedValue` to reflect that the
+ * primitive is a general MT-writeable, BG-observable cross-thread value, not
+ * an animation-specific construct. Animation is one customer; scroll, sensors,
+ * and gestures are equally first-class consumers.
+ *
+ * Import from `@sigx/lynx` directly:
+ *
+ *   - `useAnimatedValue` → `useSharedValue`
+ *   - `AnimatedValue`     → `SharedValue`
+ *   - `AnimatedValueState` → `SharedValueState`
+ *
+ * The old names continue to work via these re-exports for one minor cycle.
+ */
+export { SharedValue as AnimatedValue, useSharedValue as useAnimatedValue, } from './shared-value.js';

package/dist/animated/shared-value.d.ts

@@ -1,5 +1,5 @@
 import type { PrimitiveSignal } from '@sigx/reactivity';
-import { MainThreadRef } from '../main-thread-ref';
+import { MainThreadRef } from '../main-thread-ref.js';
 /**
  * Internal envelope shape stored under `MainThreadRef.current`. Wrapping the
  * value in `{ value: T }` (rather than a bare `T`) lets MT worklets mutate

package/dist/animated/shared-value.js

@@ -0,0 +1,94 @@
+import { onUnmounted } from '@sigx/runtime-core';
+import { MainThreadRef } from '../main-thread-ref.js';
+import { pushOp, scheduleFlush } from '../op-queue.js';
+import { registerBgSink, unregisterBgSink } from '../animated-bridge.js';
+import { OP } from '@sigx/lynx-runtime-internal';
+/**
+ * MT-writeable, BG-readable cross-thread value with sigx reactive tracking.
+ *
+ * **Not animation-specific.** Animation is one customer (see `@sigx/motion`),
+ * gestures is another (`<Draggable translateX={sv} />`), scroll is another
+ * (`useScrollViewOffset`). Anywhere fast-or-frequent state lives natively on
+ * MT and you want BG to observe it reactively, this is the primitive.
+ *
+ * **MT side** — inside `'main thread'` worklets, mutate via `sv.current.value
+ * = newValue`. The MainThreadRef machinery makes the mutation stick across
+ * worklet invocations on the same wvid; the bridge picks up the new value on
+ * the next `__FlushElementTree` boundary.
+ *
+ * **BG side** — read via `sv.value` to get the latest published snapshot.
+ * Sigx tracking applies, so an `effect(() => console.log(sv.value))` re-runs
+ * whenever an MT publish ingests a new value. Writes from BG are read-only;
+ * dev-mode warns to point users back at the MT path.
+ *
+ * The class extends `MainThreadRef<{value:T}>` so that BG-side serialization
+ * (`nodeOps.ts:sanitizeCaptured`) recognizes it as a worklet ref and ships
+ * `{_wvid, _initValue}` over the wire to the MT bundle.
+ *
+ * @example
+ * ```tsx
+ * const tx = useSharedValue(0);
+ *
+ * <Draggable translateX={tx} />
+ * <text>x = {tx.value}</text>   // BG-reactive, updates per drag frame
+ * ```
+ */
+export class SharedValue extends MainThreadRef {
+    /** @internal — populated by `useSharedValue`. Reads here back the BG signal. */
+    _bgSignal;
+    constructor(initial) {
+        super({ value: initial });
+    }
+    /** @internal */
+    _bind(sig) {
+        this._bgSignal = sig;
+    }
+    /**
+     * BG-side reactive read. Returns the latest snapshot published by the MT
+     * bridge (or the initial value before any publish has occurred).
+     */
+    get value() {
+        return this._bgSignal.value;
+    }
+    set value(_v) {
+        // Reach for process via globalThis so the package doesn't pull in
+        // @types/node just for a dev-mode warning. NODE_ENV defaults to a
+        // non-production string, so the warning fires unless the bundler has
+        // explicitly substituted it to 'production'.
+        const env = globalThis
+            .process?.env?.['NODE_ENV'];
+        if (env !== 'production') {
+            console.warn('[sigx] SharedValue.value is read-only on the BG thread. ' +
+                'Mutate via the MT worklet (sv.current.value = v).');
+        }
+    }
+}
+/**
+ * Allocate a `SharedValue<T>` whose MT-side mutations are observable on the
+ * BG thread via sigx reactivity. Bind it to a component prop or read its
+ * `.value` from a BG `effect`.
+ *
+ * Lifecycle:
+ *   - On allocate: pushes `INIT_MT_REF` (creates the MT-side refMap holder)
+ *     and `REGISTER_AV_BRIDGE` (tells MT to track this wvid in its diff/
+ *     publish pass). Allocates a BG-side signal mirror keyed by wvid.
+ *   - On the owning component's unmount: pushes `UNREGISTER_AV_BRIDGE` and
+ *     `RELEASE_MT_REF`, drops the BG signal.
+ */
+export function useSharedValue(initial) {
+    const sv = new SharedValue(initial);
+    // BG: register the signal mirror under the wvid allocated in super().
+    sv._bind(registerBgSink(sv._wvid, initial));
+    // MT: create the refMap entry (envelope shape) and begin tracking this
+    // wvid in the diff/publish pass.
+    pushOp(OP.INIT_MT_REF, sv._wvid, sv._initValue);
+    pushOp(OP.REGISTER_AV_BRIDGE, sv._wvid, initial);
+    scheduleFlush();
+    onUnmounted(() => {
+        pushOp(OP.UNREGISTER_AV_BRIDGE, sv._wvid);
+        pushOp(OP.RELEASE_MT_REF, sv._wvid);
+        scheduleFlush();
+        unregisterBgSink(sv._wvid);
+    });
+    return sv;
+}

package/dist/animated/use-animated-style.d.ts

@@ -1,7 +1,7 @@
-import type { MainThreadRef } from '../main-thread-ref';
-import type { MainThread } from '../jsx';
+import type { MainThreadRef } from '../main-thread-ref.js';
+import type { MainThread } from '../jsx.js';
 import type { BuiltinMapperName, MapperParams } from '@sigx/lynx-runtime-internal';
-import type { SharedValue } from './shared-value';
+import type { SharedValue } from './shared-value.js';
 export type { BuiltinMapperName, MapperParams };
 /** Reset hook for tests. */
 export declare function resetAnimatedStyleBindingIds(): void;

package/dist/animated/use-animated-style.js

@@ -0,0 +1,53 @@
+import { onUnmounted } from '@sigx/runtime-core';
+import { pushOp, scheduleFlush } from '../op-queue.js';
+import { OP } from '@sigx/lynx-runtime-internal';
+let nextBindingId = 1;
+/** Reset hook for tests. */
+export function resetAnimatedStyleBindingIds() {
+    nextBindingId = 1;
+}
+/**
+ * Returns the next binding id without incrementing — internal helper used by
+ * the `useAnimatedStyle` overloads to share allocation. Not exported.
+ */
+function allocBindingId() {
+    return nextBindingId++;
+}
+/**
+ * Bind a `MainThreadRef`'s element style to a `SharedValue` via a named
+ * mapper. The MT-side runtime applies the mapper's output via
+ * `setStyleProperties` on every flush boundary where the SharedValue's value changed.
+ *
+ * The mapper runs on the **Main Thread** with no thread crossing per frame —
+ * the only inputs are the SharedValue's value (already on MT) and the `params` shipped
+ * once in the registration op. Because mappers are looked up by *name*, the
+ * SWC worklet transform doesn't have to capture a function reference (which
+ * it can't), so this fits the existing worklet pipeline cleanly.
+ *
+ * Multiple bindings on the same element compose into a single
+ * `setStyleProperties` call per flush. `transform` outputs concatenate in
+ * registration order (e.g. `translateX(50px) translateY(20px)`); other style
+ * keys merge by last-write-wins. When ANY binding on an element is dirty,
+ * ALL of that element's bindings re-run so partial outputs don't drop the
+ * unchanged-axis contribution.
+ *
+ * @example Ghost follower at 0.5×
+ * ```tsx
+ * const tx = useSharedValue(0);
+ * const ghostRef = useMainThreadRef<MainThread.Element | null>(null);
+ *
+ * useAnimatedStyle(ghostRef, tx, 'translateX', { factor: 0.5 });
+ *
+ * <Draggable translateX={tx} />
+ * <view main-thread:ref={ghostRef} style={...} />
+ * ```
+ */
+export function useAnimatedStyle(elRef, sv, mapperName, params) {
+    const bindingId = allocBindingId();
+    pushOp(OP.REGISTER_AV_STYLE_BINDING, bindingId, elRef._wvid, sv._wvid, mapperName, params ?? null);
+    scheduleFlush();
+    onUnmounted(() => {
+        pushOp(OP.UNREGISTER_AV_STYLE_BINDING, bindingId);
+        scheduleFlush();
+    });
+}

package/dist/animated-bridge.js

@@ -0,0 +1,71 @@
+/**
+ * BG-side SharedValue bridge — receives MT-thread publishes.
+ *
+ * Maintains a `wvid → signal<T>` registry. The MT-side bridge in
+ * `@sigx/lynx-runtime-main/animated-bridge-mt.ts` dispatches batched
+ * `Lynx.Sigx.AvPublish` events with `[wvid, value]` tuples; `bg-bridge.ts`
+ * routes them through `ingestAvPublishes()` here, which writes each new
+ * value into the corresponding signal. Sigx reactivity tracking then re-runs
+ * any `effect` that read `sv.value` on BG.
+ *
+ * Producer: the `useSharedValue` hook in `@sigx/lynx` allocates the
+ * BG-side signal via `registerBgSink(wvid, initial)` and tears it down via
+ * `unregisterBgSink(wvid)` on component unmount.
+ *
+ * Naming note: the wire-format ops (`REGISTER_AV_BRIDGE`, `UNREGISTER_AV_BRIDGE`,
+ * `Lynx.Sigx.AvPublish`) keep their original `Av` prefix as infrastructure
+ * constants. The user-facing primitive renamed from `AnimatedValue` to
+ * `SharedValue` in Phase 2.8.
+ */
+import { signal } from '@sigx/reactivity';
+const bgRegistry = new Map();
+/**
+ * Allocate a BG-side signal mirror for the given wvid. Returns the signal so
+ * the caller can read it via `.value` — sigx tracking applies as usual.
+ *
+ * Idempotent on the wvid: if a signal is already registered, returns the
+ * existing one without resetting its value (avoids losing in-flight publishes
+ * during HMR-triggered re-registration).
+ */
+export function registerBgSink(wvid, initial) {
+    const existing = bgRegistry.get(wvid);
+    if (existing)
+        return existing;
+    // sigx's `signal` has Primitive vs object overloads; SharedValues hold
+    // primitives in practice (numbers, strings) and the bridge only ever
+    // writes through `.value`, so a single-overload selection via cast keeps
+    // the unconstrained T usable here without forcing SharedValue consumers
+    // to type-narrow at every call site.
+    const s = signal(initial);
+    bgRegistry.set(wvid, s);
+    return s;
+}
+/**
+ * Drop the BG-side signal for this wvid. Called on component unmount.
+ * Subsequent `ingestPublish` entries for this wvid become no-ops.
+ */
+export function unregisterBgSink(wvid) {
+    bgRegistry.delete(wvid);
+}
+/**
+ * Ingest a batch of `[wvid, value]` tuples from the MT bridge. Writes each
+ * into the corresponding signal so any `effect` that read it re-runs on the
+ * sigx scheduler's next tick. Tuples for unregistered wvids (race with
+ * unmount) are silently dropped.
+ */
+export function ingestAvPublishes(updates) {
+    for (const [wvid, value] of updates) {
+        const s = bgRegistry.get(wvid);
+        if (!s)
+            continue;
+        s.value = value;
+    }
+}
+/** Reset hook — for testing. Drops every registered sink. */
+export function resetBgAvBridge() {
+    bgRegistry.clear();
+}
+/** Test hook — number of currently registered sinks. */
+export function bgAvSinkCount() {
+    return bgRegistry.size;
+}

package/dist/bg-bridge.js

@@ -0,0 +1,63 @@
+/**
+ * BG-side listener for the MT→BG `Lynx.Sigx.PublishEvent` channel.
+ *
+ * The MT-side hybrid worklet (`lynx-runtime-main/src/hybrid-worklet.ts`) calls
+ * `lynx.getJSContext().dispatchEvent({ type: 'Lynx.Sigx.PublishEvent', data })`
+ * to fire the BG handler whose sign is captured in the hybrid ctx. We listen
+ * for that event here and route through the existing event-registry's
+ * `publishEvent` — the same dispatcher Lynx native calls when a normal
+ * `bindtap` fires on BG. The user's BG handler runs in the same call-stack
+ * shape it always has, so signal updates / `count.value++` etc. work without
+ * any awareness that the trigger came from MT.
+ *
+ * Side-effect import from `index.ts` so the listener is wired before any
+ * user code runs.
+ *
+ * CROSS-THREAD ASYMMETRY (per @lynx-js/react/runtime/lib/worklet/call/runOnBackground.js):
+ *   - MT → BG dispatch: MT calls `lynx.getJSContext().dispatchEvent(...)`,
+ *     BG listens via `lynx.getCoreContext().addEventListener(...)`.
+ *   - BG → MT dispatch: BG calls `lynx.getCoreContext().dispatchEvent(...)`,
+ *     MT listens via `lynx.getJSContext().addEventListener(...)`.
+ * Each side calls a DIFFERENT method to reach the other thread — they're not
+ * symmetric. Listening on `lynx.getJSContext()` from BG just listens on BG's
+ * own context (no cross-thread events arrive).
+ *
+ * `lynx` is closure-injected by RuntimeWrapperWebpackPlugin (declared in
+ * shims.d.ts). It is NOT available as `globalThis.lynx` — use the free
+ * identifier directly.
+ */
+import { publishEvent } from './event-registry.js';
+import { ingestAvPublishes } from './animated-bridge.js';
+const lynxObj = typeof lynx !== 'undefined'
+    ? lynx
+    : undefined;
+const ctx = lynxObj?.getCoreContext?.();
+if (ctx?.addEventListener) {
+    ctx.addEventListener('Lynx.Sigx.PublishEvent', (e) => {
+        let payload;
+        try {
+            payload = JSON.parse(e.data);
+        }
+        catch {
+            return; // malformed bridge message — drop
+        }
+        if (typeof payload.sign === 'string') {
+            publishEvent(payload.sign, payload.event);
+        }
+    });
+    // SharedValue bridge: each event payload is an array of
+    // `[wvid, value]` tuples coalesced from one MT flush window. See
+    // `animated-bridge.ts` and `@sigx/lynx-runtime-main/animated-bridge-mt.ts`.
+    ctx.addEventListener('Lynx.Sigx.AvPublish', (e) => {
+        let updates;
+        try {
+            updates = JSON.parse(e.data);
+        }
+        catch {
+            return;
+        }
+        if (Array.isArray(updates)) {
+            ingestAvPublishes(updates);
+        }
+    });
+}

package/dist/event-registry.js

@@ -0,0 +1,75 @@
+/**
+ * Sign-based event handler registry for the Background Thread.
+ *
+ * When patchProp registers an event handler, it gets a unique sign string.
+ * The Main Thread stores this sign with __AddEvent().  When Native fires an
+ * event it calls publishEvent(sign, data) on the BG Thread, which looks up
+ * the handler and executes it directly — no cross-thread round-trip.
+ *
+ * sigx uses signal closures, so event handlers are plain functions captured by the component's
+ * render closure.
+ */
+// The consumer bundle can materialise multiple event-registry module instances
+// (for example via separate entry-background/runtime graphs).  Store the state
+// on globalThis so register() and publishEvent() still see the same handlers.
+const REGISTRY_STATE_KEY = '__SIGX_LYNX_EVENT_REGISTRY__';
+function getRegistryState() {
+    const g = globalThis;
+    let state = g[REGISTRY_STATE_KEY];
+    if (!state) {
+        state = {
+            signCounter: 0,
+            handlers: new Map(),
+        };
+        Object.defineProperty(g, REGISTRY_STATE_KEY, {
+            value: state,
+            configurable: true,
+            enumerable: false,
+            writable: true,
+        });
+    }
+    return state;
+}
+/**
+ * Register a handler and return a unique sign string.
+ * The sign is passed to __AddEvent so that the MTS can route events back.
+ */
+export function register(handler) {
+    const state = getRegistryState();
+    const sign = `sigx:${state.signCounter++}`;
+    state.handlers.set(sign, handler);
+    return sign;
+}
+/**
+ * Update the handler for an existing sign without changing the sign.
+ * Used on re-renders: keeps the same sign registered on the Main Thread
+ * while pointing it to the freshest handler closure.
+ */
+export function updateHandler(sign, handler) {
+    getRegistryState().handlers.set(sign, handler);
+}
+/**
+ * Get the current handler for a sign.
+ */
+export function getHandler(sign) {
+    return getRegistryState().handlers.get(sign);
+}
+/**
+ * Unregister a handler by its sign.
+ */
+export function unregister(sign) {
+    getRegistryState().handlers.delete(sign);
+}
+/**
+ * Called by Lynx Native when an event fires on the BG Thread.
+ * Looks up the handler by sign and invokes it with the event data.
+ */
+export function publishEvent(sign, data) {
+    getRegistryState().handlers.get(sign)?.(data);
+}
+/** Reset all state — for testing only. */
+export function resetRegistry() {
+    const state = getRegistryState();
+    state.signCounter = 0;
+    state.handlers.clear();
+}

package/dist/flush.d.ts

@@ -5,4 +5,4 @@
  * directly. Instead, ops are batched in a queue and flushed to the Main Thread
  * via sigxPatchUpdate. This file exists for backwards-compatible imports.
  */
-export { scheduleFlush, flushNow, resetOpQueue as resetFlushState } from './op-queue';
+export { scheduleFlush, flushNow, resetOpQueue as resetFlushState } from './op-queue.js';

package/dist/flush.js

@@ -0,0 +1,8 @@
+/**
+ * Flush scheduler — re-exports from op-queue.ts.
+ *
+ * In the new architecture, the BG thread no longer calls __FlushElementTree
+ * directly. Instead, ops are batched in a queue and flushed to the Main Thread
+ * via sigxPatchUpdate. This file exists for backwards-compatible imports.
+ */
+export { scheduleFlush, flushNow, resetOpQueue as resetFlushState } from './op-queue.js';

package/dist/hmr.js

@@ -1,42 +1,122 @@
-//#region src/hmr.ts
-var e = /* @__PURE__ */ new Map(), t = /* @__PURE__ */ new Map(), n = null, r = null, i = !1;
-function a(t, n) {
-	i || (i = !0, n && (r = n), t({ onDefine(t, n, i) {
-		let a = s();
-		if (!a) return;
-		n.__hmrId = a;
-		let o = e.get(a);
-		o && o.size > 0 && o.forEach((e) => {
-			let n = r ? r(e.ctx) : null;
-			try {
-				let t = i(e.ctx);
-				e.ctx.renderFn = t, e.ctx.update();
-			} catch (e) {
-				let n = e?.message ?? String(e), r = e?.stack ?? "<no stack>";
-				console.error(`[sigx-hmr] Failed to update ${t || "component"}: ${n}\n${r}`);
-			} finally {
-				r && r(n);
-			}
-		});
-		let c = i;
-		n.__setup = (t) => {
-			let n = c(t), r = { ctx: t }, i = e.get(a);
-			return i || (i = /* @__PURE__ */ new Set(), e.set(a, i)), i.add(r), t.onUnmounted(() => {
-				let t = e.get(a);
-				t && t.delete(r);
-			}), n;
-		};
-	} }));
+/**
+ * HMR runtime for sigx-lynx (rspack/rsbuild).
+ *
+ * The `@sigx/lynx` meta package inlines runtime-core into a single bundle,
+ * so `@sigx/runtime-core/internals` would resolve to a *different* copy of
+ * the plugin registry than the one used by `component()`.  To work around
+ * this the HMR loader injects a call to `initHMR(registerComponentPlugin)`
+ * where `registerComponentPlugin` is imported from `@sigx/lynx` (the same
+ * bundle the app uses), ensuring a single shared plugin array.
+ *
+ * Flow:
+ *   1. Loader prepends:
+ *        import { __registerComponentPlugin } from '@sigx/lynx';
+ *        import { initHMR, registerHMRModule } from '@sigx/lynx-runtime/hmr';
+ *        initHMR(__registerComponentPlugin);
+ *        registerHMRModule('<moduleId>');
+ *   2. On first call, `initHMR` installs the onDefine plugin.
+ *   3. On HMR update the module re-executes, `registerHMRModule` resets
+ *      the per-module index, `component()` fires `onDefine`, and existing
+ *      instances are patched in-place (property-ops only — no crash).
+ */
+// Track instances by component ID (moduleId:index)
+const instancesByComponentId = new Map();
+// Track component definition order within each module
+const moduleComponentIndex = new Map();
+// Current module being registered
+let currentModuleId = null;
+// The renderer's currentInstance setter — captured from the app-side bundle
+// so push/pop targets the SAME instance stack the renderer reads from. If
+// missing (older app version that doesn't inject it), HMR patches skip the
+// push/pop and rely on the caller having no context-dependent hooks.
+let setCurrentInstance = null;
+let installed = false;
+/**
+ * Initialise the HMR plugin using the *app-side* registerComponentPlugin.
+ * Called once by the loader-injected preamble.  Idempotent.
+ *
+ * `setCurrentInstanceFn` is the renderer's instance-stack push/pop helper
+ * (re-exported from `@sigx/lynx` as `__setCurrentInstanceForHMR`). Without
+ * it, re-running a screen's setup during HMR throws on hooks that depend on
+ * provide/inject (`useNav`, etc.) because the renderer's currentInstance is
+ * `null` when called outside the normal mount path.
+ */
+export function initHMR(registerComponentPlugin, setCurrentInstanceFn) {
+    if (installed)
+        return;
+    installed = true;
+    if (setCurrentInstanceFn) {
+        setCurrentInstance = setCurrentInstanceFn;
+    }
+    registerComponentPlugin({
+        onDefine(name, factory, setup) {
+            const componentId = getNextComponentId();
+            if (!componentId)
+                return;
+            factory.__hmrId = componentId;
+            const existingInstances = instancesByComponentId.get(componentId);
+            if (existingInstances && existingInstances.size > 0) {
+                // HMR update: patch all existing instances with the new setup.
+                // The renderer pushes the active instance onto a stack before
+                // calling setup so that hooks like `useNav()` can resolve
+                // provide/inject up the parent chain. We're calling setup
+                // *outside* the renderer's mount path here, so we mirror the
+                // push/pop ourselves — otherwise context-dependent hooks
+                // throw with messages like "no <NavigationRoot> is mounted".
+                existingInstances.forEach(instance => {
+                    const prev = setCurrentInstance ? setCurrentInstance(instance.ctx) : null;
+                    try {
+                        const newRenderFn = setup(instance.ctx);
+                        instance.ctx.renderFn = newRenderFn;
+                        instance.ctx.update();
+                    }
+                    catch (e) {
+                        const msg = e?.message ?? String(e);
+                        const stack = e?.stack ?? '<no stack>';
+                        console.error(`[sigx-hmr] Failed to update ${name || 'component'}: ${msg}\n${stack}`);
+                    }
+                    finally {
+                        if (setCurrentInstance)
+                            setCurrentInstance(prev);
+                    }
+                });
+            }
+            // Wrap setup to track future instances
+            const originalSetup = setup;
+            factory.__setup = (ctx) => {
+                const renderFn = originalSetup(ctx);
+                const instance = { ctx };
+                let instances = instancesByComponentId.get(componentId);
+                if (!instances) {
+                    instances = new Set();
+                    instancesByComponentId.set(componentId, instances);
+                }
+                instances.add(instance);
+                ctx.onUnmounted(() => {
+                    const instances = instancesByComponentId.get(componentId);
+                    if (instances)
+                        instances.delete(instance);
+                });
+                return renderFn;
+            };
+        }
+    });
 }
-function o(e) {
-	n = e, t.set(e, 0);
+/**
+ * Register the current module for HMR tracking.
+ * Called at the top of each transformed module by the HMR loader.
+ */
+export function registerHMRModule(moduleId) {
+    currentModuleId = moduleId;
+    moduleComponentIndex.set(moduleId, 0);
 }
-function s() {
-	if (!n) return null;
-	let e = t.get(n) || 0;
-	return t.set(n, e + 1), `${n}:${e}`;
+/**
+ * Get the next component ID for the current module.
+ */
+function getNextComponentId() {
+    if (!currentModuleId)
+        return null;
+    const index = moduleComponentIndex.get(currentModuleId) || 0;
+    moduleComponentIndex.set(currentModuleId, index + 1);
+    return `${currentModuleId}:${index}`;
 }
-//#endregion
-export { a as initHMR, o as registerHMRModule };
-
-//# sourceMappingURL=hmr.js.map

package/dist/index.d.ts

@@ -1,24 +1,26 @@
-import './jsx';
-import './types';
-import './model-processor';
-import './bg-bridge';
-import './run-on-background';
-export { render, lynxMount } from './render';
-export { nodeOps } from './nodeOps';
-export type { LynxNode, LynxElement } from './nodeOps';
-export { ShadowElement, createPageRoot, resetShadowState } from './shadow-element';
-export { pushOp, takeOps, scheduleFlush, flushNow, resetOpQueue } from './op-queue';
+import './jsx.js';
+import './types.js';
+import './model-processor.js';
+import './bg-bridge.js';
+import './run-on-background.js';
+export { render, lynxMount } from './render.js';
+export { nodeOps } from './nodeOps.js';
+export type { LynxNode, LynxElement } from './nodeOps.js';
+export { ShadowElement, createPageRoot, resetShadowState } from './shadow-element.js';
+export { pushOp, takeOps, scheduleFlush, flushNow, resetOpQueue } from './op-queue.js';
 export { OP } from '@sigx/lynx-runtime-internal';
 export type { OpCode, MapperParams, RangeParams, BuiltinMapperName, AnimatedStyleMapper, } from '@sigx/lynx-runtime-internal';
-export { register, updateHandler, unregister, getHandler, publishEvent, resetRegistry, } from './event-registry';
-export { MainThreadRef, useMainThreadRef, resetWvidCounter, } from './main-thread-ref';
-export { registerBgSink, unregisterBgSink, ingestAvPublishes, resetBgAvBridge, bgAvSinkCount, } from './animated-bridge';
-export { useSharedValue, SharedValue, } from './animated/shared-value';
-export type { SharedValueState } from './animated/shared-value';
-export { useAnimatedStyle, resetAnimatedStyleBindingIds, } from './animated/use-animated-style';
-export { useAnimatedValue, AnimatedValue, } from './animated/animated-value';
-export type { AnimatedValueState } from './animated/animated-value';
-export { runOnMainThread, runOnBackground, resetThreading, transformToWorklet, resetRunOnBackgroundState, } from './threading';
-export { Gesture, GestureType, useGestureDetector, resetGestureIdCounter, } from './native/index';
-export type { GestureTypeValue, GestureWorklet, GestureCallback, BaseGesture, ComposedGesture, AnyGesture, } from './native/index';
-export type { LynxEventHandler, LynxCommonAttributes, ViewAttributes, TextAttributes, ImageAttributes, ScrollViewAttributes, ListAttributes, ListItemAttributes, InputAttributes, TextAreaAttributes, PageAttributes, SvgAttributes, FilterImageAttributes, MainThread, } from './jsx';
+export { register, updateHandler, unregister, getHandler, publishEvent, resetRegistry, } from './event-registry.js';
+export { MainThreadRef, useMainThreadRef, resetWvidCounter, } from './main-thread-ref.js';
+export { useElementLayout } from './use-element-layout.js';
+export type { ElementLayout, LayoutChangeEvent, UseElementLayoutResult, } from './use-element-layout.js';
+export { registerBgSink, unregisterBgSink, ingestAvPublishes, resetBgAvBridge, bgAvSinkCount, } from './animated-bridge.js';
+export { useSharedValue, SharedValue, } from './animated/shared-value.js';
+export type { SharedValueState } from './animated/shared-value.js';
+export { useAnimatedStyle, resetAnimatedStyleBindingIds, } from './animated/use-animated-style.js';
+export { useAnimatedValue, AnimatedValue, } from './animated/animated-value.js';
+export type { AnimatedValueState } from './animated/animated-value.js';
+export { runOnMainThread, runOnBackground, resetThreading, transformToWorklet, resetRunOnBackgroundState, } from './threading.js';
+export { Gesture, GestureType, useGestureDetector, resetGestureIdCounter, } from './native/index.js';
+export type { GestureTypeValue, GestureWorklet, GestureCallback, BaseGesture, ComposedGesture, AnyGesture, } from './native/index.js';
+export type { LynxEventHandler, LynxCommonAttributes, ViewAttributes, TextAttributes, ImageAttributes, ScrollViewAttributes, ListAttributes, ListItemAttributes, InputAttributes, TextAreaAttributes, PageAttributes, SvgAttributes, FilterImageAttributes, MainThread, } from './jsx.js';