@lynx-js/react 0.111.0 → 0.111.2

package/runtime/src/snapshot/spread.ts

@@ -1,330 +0,0 @@
-// Copyright 2024 The Lynx Authors. All rights reserved.
-// Licensed under the Apache License Version 2.0 that can be found in the
-// LICENSE file in the root directory of this source tree.
-
-/**
- * Handles JSX spread operator in the snapshot system.
- *
- * Spread operators in JSX (e.g., <div {...props}>) are transformed into
- * optimized attribute updates at compile time, avoiding runtime object spreads.
- */
-
-import type { Element, Worklet, WorkletRefImpl } from '@lynx-js/react/worklet-runtime/bindings';
-
-import type { BackgroundSnapshotInstance } from '../backgroundSnapshot.js';
-import { ListUpdateInfoRecording } from '../listUpdateInfo.js';
-import { __pendingListUpdates } from '../pendingListUpdates.js';
-import { SnapshotInstance } from '../snapshot.js';
-import { isDirectOrDeepEqual, isEmptyObject, pick } from '../utils.js';
-import { updateEvent } from './event.js';
-import { updateGesture } from './gesture.js';
-import { platformInfoAttributes, updateListItemPlatformInfo } from './platformInfo.js';
-import { transformRef, updateRef } from './ref.js';
-import { updateWorkletEvent } from './workletEvent.js';
-import { updateWorkletRef } from './workletRef.js';
-
-// eslint-disable-next-line regexp/no-unused-capturing-group
-const eventRegExp = /^(([A-Za-z-]*):)?(bind|catch|capture-bind|capture-catch|global-bind)([A-Za-z]+)$/;
-const eventTypeMap: Record<string, string> = {
-  bind: 'bindEvent',
-  catch: 'catchEvent',
-  'capture-bind': 'capture-bind',
-  'capture-catch': 'capture-catch',
-  'global-bind': 'global-bindEvent',
-};
-const noFlattenAttributes = /* @__PURE__ */ new Set<string>([
-  'name',
-  'clip-radius',
-  'overlap',
-  'exposure-scene',
-  'exposure-id',
-]);
-
-function updateSpread(
-  snapshot: SnapshotInstance,
-  index: number,
-  oldValue: Record<string, unknown> | undefined | null,
-  elementIndex: number,
-): void {
-  oldValue ??= {};
-  let newValue: Record<string, unknown> = snapshot.__values![index] as Record<string, unknown>; // compiler guarantee this must be an object;
-
-  const list = snapshot.parentNode;
-  if (list?.__snapshot_def.isListHolder) {
-    const oldPlatformInfo = pick(oldValue, platformInfoAttributes);
-    const platformInfo = pick(newValue, platformInfoAttributes);
-    if (!isDirectOrDeepEqual(oldPlatformInfo, platformInfo)) {
-      (__pendingListUpdates.values[list.__id] ??= new ListUpdateInfoRecording(list)).onSetAttribute(
-        snapshot,
-        platformInfo,
-        oldPlatformInfo,
-      );
-      snapshot.__listItemPlatformInfo = platformInfo;
-
-      // The fakeSnapshot is missing `__parent`, so no `ListUpdateInfoRecording#onSetAttribute` will be called
-      const fakeSnapshot = {
-        __values: {
-          get [index]() {
-            return platformInfo;
-          },
-        },
-        __id: snapshot.__id,
-        __elements: snapshot.__elements,
-      } as SnapshotInstance;
-      updateListItemPlatformInfo(fakeSnapshot, index, oldPlatformInfo, elementIndex);
-    }
-  }
-
-  if (!snapshot.__elements) {
-    return;
-  }
-
-  if ('__spread' in newValue) {
-    // first screen
-    newValue = transformSpread(snapshot, index, newValue);
-    snapshot.__values![index] = newValue;
-  }
-
-  const dataset: Record<string, unknown> = {};
-  let match: RegExpMatchArray | null = null;
-  for (const key in newValue) {
-    const v = newValue[key];
-    if (v !== oldValue[key]) {
-      if (key === 'className') {
-        __SetClasses(snapshot.__elements[elementIndex]!, v as string);
-      } else if (key === 'style') {
-        __SetInlineStyles(snapshot.__elements[elementIndex]!, v as string);
-      } else if (key === 'id') {
-        __SetID(snapshot.__elements[elementIndex]!, v as string);
-      } else if (key.startsWith('data-')) {
-        // collected below
-      } else if (key === 'ref') {
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return v;
-            },
-            set [index](value: unknown) {
-              // Modifications to the ref value should be reflected in the corresponding position of the spread.
-              newValue[key] = value;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        updateRef(fakeSnapshot, index, oldValue[key] as string | null, elementIndex);
-      } else if (key.endsWith(':ref')) {
-        snapshot.__worklet_ref_set ??= new Set();
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return v;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-          __worklet_ref_set: snapshot.__worklet_ref_set,
-        } as SnapshotInstance;
-        updateWorkletRef(
-          fakeSnapshot,
-          index,
-          oldValue[key] as WorkletRefImpl<Element> | Worklet | null | undefined,
-          elementIndex,
-          key.slice(0, -4),
-        );
-      } else if (key.endsWith(':gesture')) {
-        const workletType = key.slice(0, -8);
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return v;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        updateGesture(fakeSnapshot, index, oldValue[key], elementIndex, workletType);
-      } else if ((match = eventRegExp.exec(key))) {
-        const workletType = match[2];
-        const eventType = eventTypeMap[match[3]!]!;
-        const eventName = match[4]!;
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return v;
-            },
-            set [index](value: unknown) {
-              // Modifications to the event value should be reflected in the corresponding position of the spread.
-              newValue[key] = value;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        if (workletType) {
-          updateWorkletEvent(
-            fakeSnapshot,
-            index,
-            oldValue[key] as Worklet,
-            elementIndex,
-            workletType,
-            eventType,
-            eventName,
-          );
-        } else {
-          updateEvent(fakeSnapshot, index, oldValue[key], elementIndex, eventType, eventName, key);
-        }
-      } else if (platformInfoAttributes.has(key)) {
-        // ignore
-      } else {
-        __SetAttribute(snapshot.__elements[elementIndex]!, key, v);
-      }
-    }
-
-    // collect data regardless of whether it has changed
-    if (key.startsWith('data-')) {
-      dataset[key.slice(5)] = v;
-    }
-  }
-
-  let hasOldDataset = false;
-  for (const key in oldValue) {
-    if (!(key in newValue)) {
-      if (key === 'className') {
-        __SetClasses(snapshot.__elements[elementIndex]!, '');
-      } else if (key === 'style') {
-        __SetInlineStyles(snapshot.__elements[elementIndex]!, '');
-      } else if (key === 'id') {
-        __SetID(snapshot.__elements[elementIndex]!, null);
-      } else if (key.startsWith('data-')) {
-        // collected below
-      } else if (key === 'ref') {
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return undefined;
-            },
-            set [index](value: unknown) {
-              // Modifications to the ref value should be reflected in the corresponding position of the spread.
-              newValue[key] = value;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        updateRef(fakeSnapshot, index, oldValue[key] as string | null, elementIndex);
-      } else if (key.endsWith(':ref')) {
-        snapshot.__worklet_ref_set ??= new Set();
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return undefined;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-          __worklet_ref_set: snapshot.__worklet_ref_set,
-        } as SnapshotInstance;
-        updateWorkletRef(
-          fakeSnapshot,
-          index,
-          oldValue[key] as WorkletRefImpl<Element> | Worklet | null | undefined,
-          elementIndex,
-          key.slice(0, -4),
-        );
-      } else if (key.endsWith(':gesture')) {
-        const workletType = key.slice(0, -8);
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return undefined;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        updateGesture(fakeSnapshot, index, oldValue[key], elementIndex, workletType);
-      } else if ((match = eventRegExp.exec(key))) {
-        const workletType = match[2];
-        const eventType = eventTypeMap[match[3]!]!;
-        const eventName = match[4]!;
-        const fakeSnapshot = {
-          __values: {
-            get [index]() {
-              return undefined;
-            },
-            set [index](value: unknown) {
-              newValue[key] = value;
-            },
-          },
-          __id: snapshot.__id,
-          __elements: snapshot.__elements,
-        } as SnapshotInstance;
-        if (workletType) {
-          updateWorkletEvent(
-            fakeSnapshot,
-            index,
-            oldValue[key] as Worklet,
-            elementIndex,
-            workletType,
-            eventType,
-            eventName,
-          );
-        } else {
-          updateEvent(fakeSnapshot, index, oldValue[key], elementIndex, eventType, eventName, key);
-        }
-      } else if (platformInfoAttributes.has(key)) {
-        // ignore
-      } else {
-        __SetAttribute(snapshot.__elements[elementIndex]!, key, null);
-      }
-    }
-
-    // collect data regardless of whether it has changed
-    if (key.startsWith('data-')) {
-      hasOldDataset = true;
-    }
-  }
-
-  // TODO: compare dataset before commit it to native?
-  if (hasOldDataset || !isEmptyObject(dataset)) {
-    __SetDataset(snapshot.__elements[elementIndex]!, dataset);
-  }
-}
-
-function transformSpread(
-  snapshot: BackgroundSnapshotInstance | SnapshotInstance,
-  index: number,
-  spread: Record<string, unknown>,
-): Record<string, unknown> {
-  const result: Record<string, unknown> = {};
-  let hasNoFlattenAttributes = false;
-  for (const key in spread) {
-    let value = spread[key];
-    if (key === '__spread') {}
-    else if (key === 'class' || key === 'className') {
-      value ??= '';
-      result['className'] = value;
-    } else if (key === 'ref') {
-      if (__LEPUS__) {
-        result[key] = value ? 1 : undefined;
-      } else {
-        result[key] = transformRef(value)?.__ref;
-      }
-    } else if (typeof value === 'function') {
-      result[key] = `${snapshot.__id}:${index}:${key}`;
-    } else {
-      if (!hasNoFlattenAttributes && noFlattenAttributes.has(key)) {
-        hasNoFlattenAttributes = true;
-      }
-      result[key] = value;
-    }
-  }
-
-  if (hasNoFlattenAttributes) {
-    result['flatten'] = false;
-  }
-  return result;
-}
-
-export { transformSpread, updateSpread };

package/runtime/src/snapshot/workletEvent.ts

@@ -1,35 +0,0 @@
-// Copyright 2024 The Lynx Authors. All rights reserved.
-// Licensed under the Apache License Version 2.0 that can be found in the
-// LICENSE file in the root directory of this source tree.
-import { onWorkletCtxUpdate } from '@lynx-js/react/worklet-runtime/bindings';
-import type { Worklet } from '@lynx-js/react/worklet-runtime/bindings';
-
-import { isMainThreadHydrationFinished } from '../lifecycle/patch/isMainThreadHydrationFinished.js';
-import { SnapshotInstance } from '../snapshot.js';
-
-function updateWorkletEvent(
-  snapshot: SnapshotInstance,
-  expIndex: number,
-  oldValue: Worklet,
-  elementIndex: number,
-  workletType: string,
-  eventType: string,
-  eventName: string,
-): void {
-  if (!snapshot.__elements) {
-    return;
-  }
-  const value = (snapshot.__values![expIndex] as Worklet || undefined) ?? {};
-  value._workletType = workletType;
-
-  if (workletType === 'main-thread') {
-    onWorkletCtxUpdate(value, oldValue, !isMainThreadHydrationFinished, snapshot.__elements[elementIndex]!);
-    const event = {
-      type: 'worklet',
-      value,
-    };
-    __AddEvent(snapshot.__elements[elementIndex]!, eventType, eventName, event);
-  }
-}
-
-export { updateWorkletEvent };

package/runtime/src/snapshot/workletRef.ts

@@ -1,88 +0,0 @@
-// Copyright 2024 The Lynx Authors. All rights reserved.
-// Licensed under the Apache License Version 2.0 that can be found in the
-// LICENSE file in the root directory of this source tree.
-
-import { onWorkletCtxUpdate, runWorkletCtx, updateWorkletRef as update } from '@lynx-js/react/worklet-runtime/bindings';
-import type { Element, Worklet, WorkletRefImpl } from '@lynx-js/react/worklet-runtime/bindings';
-
-import { isMainThreadHydrationFinished } from '../lifecycle/patch/isMainThreadHydrationFinished.js';
-import type { SnapshotInstance } from '../snapshot.js';
-
-let mtRefQueue: (WorkletRefImpl<Element> | Worklet | Element)[] = [];
-
-export function applyRefQueue(): void {
-  const queue = mtRefQueue;
-  mtRefQueue = [];
-  for (let i = 0; i < queue.length; i += 2) {
-    const worklet = queue[i] as Worklet | WorkletRefImpl<Element>;
-    const element = queue[i + 1] as Element;
-    if ('_wvid' in worklet) {
-      update(worklet as WorkletRefImpl<Element>, element);
-    } else if ('_wkltId' in worklet) {
-      worklet._unmount = runWorkletCtx(worklet, [{ elementRefptr: element }]) as () => void;
-    }
-  }
-}
-
-function addToRefQueue(worklet: Worklet | WorkletRefImpl<Element>, element: Element): void {
-  mtRefQueue.push(worklet, element);
-}
-
-export function workletUnRef(value: Worklet | WorkletRefImpl<Element>): void {
-  if ('_wvid' in value) {
-    update(value as WorkletRefImpl<Element>, null);
-  } else if ('_wkltId' in value) {
-    if (typeof value._unmount == 'function') {
-      (value._unmount as () => void)();
-    } else {
-      runWorkletCtx(value, [null]);
-    }
-  }
-}
-
-export function updateWorkletRef(
-  snapshot: SnapshotInstance,
-  expIndex: number,
-  oldValue: WorkletRefImpl<Element> | Worklet | null | undefined,
-  elementIndex: number,
-  _workletType: string,
-): void {
-  if (!snapshot.__elements) {
-    return;
-  }
-
-  if (oldValue && snapshot.__worklet_ref_set?.has(oldValue)) {
-    workletUnRef(oldValue);
-    snapshot.__worklet_ref_set?.delete(oldValue);
-  }
-
-  const value = snapshot.__values![expIndex] as (WorkletRefImpl<Element> | Worklet | undefined);
-  if (value === null || value === undefined) {
-    // do nothing
-  } else if (value._wvid) {
-    const element = snapshot.__elements[elementIndex]! as Element;
-    addToRefQueue(value as Worklet, element);
-  } else if ((value as Worklet)._wkltId) {
-    const element = snapshot.__elements[elementIndex]! as Element;
-    onWorkletCtxUpdate(
-      value as Worklet,
-      oldValue as Worklet | undefined,
-      !isMainThreadHydrationFinished,
-      element,
-    );
-    addToRefQueue(value as Worklet, element);
-    /* v8 ignore next 3 */
-  } else if (value._type === '__LEPUS__' || (value as Worklet)._lepusWorkletHash) {
-    // for pre-0.99 compatibility
-    // During the initial render, we will not update the WorkletRef because the background thread is not ready yet.
-  } else {
-    throw new Error('MainThreadRef: main-thread:ref must be of type MainThreadRef or main-thread function.');
-  }
-
-  if (value) {
-    snapshot.__worklet_ref_set ??= new Set();
-    snapshot.__worklet_ref_set.add(value);
-  }
-  // Add an arbitrary attribute to avoid this element being layout-only
-  __SetAttribute(snapshot.__elements[elementIndex]!, 'has-react-ref', true);
-}