@lynx-js/react 0.111.0 → 0.111.2

package/runtime/src/hydrate.ts

@@ -1,368 +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 { componentAtIndexFactory, enqueueComponentFactory } from './list.js';
-import { __pendingListUpdates } from './pendingListUpdates.js';
-import { DynamicPartType } from './snapshot/dynamicPartType.js';
-import { unref } from './snapshot/ref.js';
-import type { SnapshotInstance } from './snapshot.js';
-import { isEmptyObject } from './utils.js';
-
-export interface DiffResult<K> {
-  $$diff: true;
-  // insert No.j to new
-  i: Record<number, K>;
-  // remove No.i from old
-  r: number[];
-  // move No.i from old to No.j of new
-  m: Record<number, number>;
-}
-
-export interface Typed {
-  type: string;
-}
-
-export function isEmptyDiffResult<K>(diffResult: DiffResult<K>): boolean {
-  const hasChanged = !isEmptyObject(diffResult.i)
-    || !isEmptyObject(diffResult.m) || diffResult.r.length > 0;
-  return !hasChanged;
-}
-
-export function diffArrayLepus<A extends Typed, B extends Typed>(
-  before: A[],
-  after: B[],
-  isSameType: (a: A, b: B) => boolean,
-  onDiffChildren: (a: A, b: B, oldIndex: number, newIndex: number) => void,
-): DiffResult<B> {
-  let lastPlacedIndex = 0;
-  const result: DiffResult<B> = {
-    $$diff: true,
-    i: {},
-    r: [],
-    m: {},
-  };
-  const beforeMap: Record<string, Set<[A, number]>> = {};
-
-  for (let i = 0; i < before.length; i++) {
-    const node = before[i]!;
-    (beforeMap[node.type] ??= new Set()).add([node, i]);
-  }
-
-  for (let i = 0; i < after.length; i++) {
-    const afterNode = after[i]!;
-    const beforeNodes = beforeMap[afterNode.type];
-    let beforeNode: [A, number];
-
-    if (
-      beforeNodes
-      && beforeNodes.size > 0
-      // @ts-expect-error TS does not know about iterator :)
-      && (([beforeNode] = beforeNodes), beforeNode)
-      && isSameType(beforeNode[0], afterNode)
-    ) {
-      // Reuse old node
-      beforeNodes.delete(beforeNode);
-
-      const oldIndex = beforeNode[1];
-      onDiffChildren(beforeNode[0], afterNode, oldIndex, i);
-      if (oldIndex < lastPlacedIndex) {
-        result.m[oldIndex] = i;
-        continue;
-      } else {
-        lastPlacedIndex = oldIndex;
-      }
-    } else {
-      // Create new node
-      result.i[i] = afterNode;
-    }
-  }
-  // Delete
-  for (const k in beforeMap) {
-    for (const [, i] of beforeMap[k]!) {
-      result.r.push(i);
-    }
-  }
-
-  return result;
-}
-
-// export function diffIterableLepus<A extends Typed, B extends Typed>(
-//   before: A[],
-//   after: Iterable<B>,
-//   isSameType: (a: A, b: B) => boolean,
-//   onDiffChildren: (a: A, b: B) => void
-// ): DiffResult<B> {
-//   let returnResult = EMPTY_DIFF_RESULT as DiffResult<B>;
-//   let lastPlacedIndex = 0;
-//   const result: DiffResult<B> = {
-//     $$diff: true,
-//     i: {},
-//     r: [],
-//     m: {},
-//   };
-//   const beforeMap: Record<string, Set<[A, number]>> = {};
-
-//   for (let i = 0; i < before.length; i++) {
-//     let node = before[i];
-//     (beforeMap[node.type] ??= new Set()).add([node, i]);
-//   }
-
-//   let i = 0;
-//   for (const afterNode of after) {
-//     const beforeNodes = beforeMap[afterNode.type];
-//     let beforeNode: [A, number];
-
-//     if (beforeNodes && (([beforeNode] = beforeNodes), beforeNode) && isSameType(beforeNode[0], afterNode)) {
-//       // Reuse old node
-//       beforeNodes.delete(beforeNode);
-
-//       const oldIndex = beforeNode[1];
-//       onDiffChildren(beforeNode[0], afterNode);
-//       if (oldIndex < lastPlacedIndex) {
-//         result.m[oldIndex] = i;
-//         returnResult = result;
-//         i++;
-//         continue;
-//       } else {
-//         lastPlacedIndex = oldIndex;
-//       }
-//     } else {
-//       // Create new node
-//       result.i[i] = afterNode;
-//       returnResult = result;
-//     }
-//     i++;
-//   }
-//   // delete
-//   for (const k in beforeMap) {
-//     for (const [, i] of beforeMap[k]) {
-//       result.r.push(i);
-//       returnResult = result;
-//     }
-//   }
-
-//   return result;
-// }
-
-export function diffArrayAction<T, K>(
-  before: T[],
-  diffResult: DiffResult<K>,
-  onInsert: (node: K, target: T | undefined) => T,
-  onRemove: (node: T) => void,
-  onMove: (node: T, target: T | undefined) => void,
-): T[] {
-  if (isEmptyDiffResult(diffResult)) {
-    return before;
-  }
-  const deleteSet = new Set(diffResult.r);
-  const { i: insertMap, m: placementMap } = diffResult;
-  const moveTempMap = new Map<number, T>();
-  let old: T | undefined;
-  let k = 0;
-  old = before[k];
-  // let current: T | null | undefined = null;
-  const result: T[] = [];
-  let i = 0; // index of the old list
-  let j = 0; // index of the new list
-  let remain = Object.keys(insertMap).length;
-  while (old || remain > 0) {
-    let keep = false;
-    if (old && deleteSet.has(j)) {
-      // delete
-      onRemove(old);
-    } else if (old && placementMap[j] !== undefined) {
-      // save node to re-use
-      moveTempMap.set(placementMap[j]!, old);
-      remain++;
-    } else {
-      // insert node
-      let newNode = old;
-      if (moveTempMap.has(i)) {
-        // insert re-used node
-        newNode = moveTempMap.get(i)!;
-        keep = true;
-        onMove(newNode, old);
-        remain--;
-      } else if (insertMap[i] !== undefined) {
-        // insert new node
-        newNode = onInsert(insertMap[i]!, old);
-        keep = true;
-        remain--;
-      }
-
-      result.push(newNode!);
-      i++;
-    }
-    if (old && !keep) {
-      old = before[++k];
-      j++;
-    }
-  }
-
-  return result;
-}
-
-export interface HydrationOptions {
-  skipUnRef?: boolean;
-  swap?: Record<number, number>;
-}
-
-export function hydrate(before: SnapshotInstance, after: SnapshotInstance, options?: HydrationOptions): void {
-  after.__elements = before.__elements;
-  after.__element_root = before.__element_root;
-
-  if (!(options?.skipUnRef)) {
-    unref(before, false);
-  }
-
-  let swap;
-  if ((swap = options?.swap)) {
-    swap[before.__id] = after.__id;
-  }
-
-  after.__values?.forEach((value, index) => {
-    const old = before.__values![index];
-    if (value !== old) {
-      after.__values![index] = old;
-      after.setAttribute(index, value);
-    }
-  });
-
-  const { slot } = after.__snapshot_def;
-
-  if (!slot) {
-    return;
-  }
-
-  const beforeChildNodes = before.childNodes;
-  const afterChildNodes = after.childNodes;
-
-  slot.forEach(([type, elementIndex], index) => {
-    switch (type) {
-      case DynamicPartType.Slot:
-      case DynamicPartType.MultiChildren: {
-        // TODO: the following null assertions are not 100% safe
-        const v1 = beforeChildNodes[index]!;
-        const v2 = afterChildNodes[index]!;
-        hydrate(v1, v2, options);
-        break;
-      }
-      case DynamicPartType.Children: {
-        const diffResult = diffArrayLepus(
-          beforeChildNodes,
-          afterChildNodes,
-          (a, b) => a.type === b.type,
-          (a, b) => {
-            hydrate(a, b, options);
-          },
-        );
-        diffArrayAction(
-          beforeChildNodes,
-          diffResult,
-          (node, target) => {
-            node.ensureElements();
-            __InsertElementBefore(
-              before.__elements![elementIndex]!,
-              node.__element_root!,
-              target?.__element_root,
-            );
-            return node;
-          },
-          node => {
-            __RemoveElement(
-              before.__elements![elementIndex]!,
-              node.__element_root!,
-            );
-          },
-          (node, target) => {
-            __RemoveElement(
-              before.__elements![elementIndex]!,
-              node.__element_root!,
-            );
-            __InsertElementBefore(
-              before.__elements![elementIndex]!,
-              node.__element_root!,
-              target?.__element_root,
-            );
-          },
-        );
-        break;
-      }
-      case DynamicPartType.ListChildren: {
-        const removals: number[] = [];
-        const insertions: number[] = [];
-        const updateAction: any[] = [];
-
-        const diffResult = diffArrayLepus(
-          beforeChildNodes,
-          afterChildNodes,
-          (a, b) => a.type === b.type,
-          (a, b, oldIndex, newIndex) => {
-            if (
-              JSON.stringify(a.__listItemPlatformInfo)
-                !== JSON.stringify(b.__listItemPlatformInfo)
-            ) {
-              updateAction.push({
-                ...b.__listItemPlatformInfo,
-                from: newIndex,
-                to: newIndex,
-                // no flush
-                flush: false,
-              });
-            }
-
-            // Mark list-item which is rendered (has `__elements`) as DELETE
-            // so list platform will call `enqueueComponent` on it
-            // and will call `componentAtIndex` on the inserted one
-            // In this way:
-            //  1. we make sure `<list/>` for hydrate is like a leaf node
-            //  2. we avoid hydrate so modifying recycleMap can be avoid
-            //  3. the delete list-item is recycled for later use, so no waste
-            if (a.__elements) {
-              removals.push(oldIndex);
-              insertions.push(newIndex);
-            }
-          },
-        );
-
-        for (const i of diffResult.r) {
-          removals.push(i);
-        }
-        for (const i in diffResult.i) {
-          insertions.push(Number(i));
-        }
-        for (const i in diffResult.m) {
-          removals.push(Number(i));
-          insertions.push(diffResult.m[i]!);
-        }
-        insertions.sort((a, b) => a - b);
-        removals.sort((a, b) => a - b);
-
-        const info = {
-          insertAction: insertions.map((it) => ({
-            position: it,
-            type: afterChildNodes[it]!.type,
-            ...afterChildNodes[it]!.__listItemPlatformInfo,
-          })),
-          removeAction: removals,
-          updateAction,
-        };
-
-        const listElement = before.__elements![elementIndex]!;
-        __SetAttribute(listElement, 'update-list-info', info);
-        const [componentAtIndex, componentAtIndexes] = componentAtIndexFactory(afterChildNodes, hydrate);
-        __UpdateListCallbacks(
-          listElement,
-          componentAtIndex,
-          enqueueComponentFactory(),
-          componentAtIndexes,
-        );
-
-        // The `before` & `after` target to the same list element, so we need to
-        // avoid the newly created list's (behind snapshot instance `after`) "update-list-info" being recorded.
-        delete __pendingListUpdates.values[after.__id];
-      }
-    }
-  });
-}

package/runtime/src/index.ts

@@ -1,94 +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 './lynx.js';
-import './lynx/component.js';
-import {
-  Children,
-  Component,
-  Fragment,
-  PureComponent,
-  Suspense,
-  lazy as backgroundLazy,
-  cloneElement,
-  createContext,
-  createElement,
-  createRef,
-  forwardRef,
-  isValidElement,
-  memo,
-  useSyncExternalStore,
-} from 'preact/compat';
-
-import {
-  useCallback,
-  useContext,
-  useDebugValue,
-  useEffect,
-  useImperativeHandle,
-  useLayoutEffect,
-  useMemo,
-  useReducer,
-  useRef,
-  useState,
-} from './hooks/react.js';
-import { loadLazyBundle, mainThreadLazy } from './lynx/lazy-bundle.js';
-
-export { Component, createContext } from 'preact';
-export { PureComponent } from 'preact/compat';
-export * from './hooks/react.js';
-
-const lazy: typeof import('preact/compat').lazy = /*#__PURE__*/ (() => {
-  lynx.loadLazyBundle = loadLazyBundle;
-  return __LEPUS__
-    ? mainThreadLazy
-    : backgroundLazy;
-})();
-
-/**
- * @internal
- */
-export default {
-  // hooks
-  useState,
-  useReducer,
-  useEffect,
-  useLayoutEffect,
-  useRef,
-  useImperativeHandle,
-  useMemo,
-  useCallback,
-  useContext,
-  useDebugValue,
-  useSyncExternalStore,
-
-  createContext,
-  createRef,
-  Fragment,
-  isValidElement,
-  Children,
-  Component,
-  PureComponent,
-  memo,
-  forwardRef,
-  Suspense,
-  lazy,
-  createElement,
-};
-
-export {
-  Children,
-  createRef,
-  Fragment,
-  isValidElement,
-  memo,
-  forwardRef,
-  Suspense,
-  lazy,
-  createElement,
-  cloneElement,
-  useSyncExternalStore,
-};
-
-export * from './lynx-api.js';

package/runtime/src/internal.ts

@@ -1,63 +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 { Suspense, createElement, lazy } from 'preact/compat';
-import type { FC } from 'react';
-
-import './lynx.js';
-
-import { factory as factory2 } from './compat/componentIs.js';
-import { useMemo } from './hooks/react.js';
-import { loadLazyBundle } from './lynx/lazy-bundle.js';
-import { __root } from './root.js';
-import { DynamicPartType } from './snapshot/dynamicPartType.js';
-import { snapshotCreateList } from './snapshot/list.js';
-import { SnapshotInstance, __page, __pageId, createSnapshot, snapshotManager } from './snapshot.js';
-
-export { __page, __pageId, __root };
-
-export { SnapshotInstance, snapshotCreateList, createSnapshot, snapshotManager };
-
-export const __DynamicPartSlot: DynamicPartType = DynamicPartType.Slot;
-export const __DynamicPartMultiChildren: DynamicPartType = DynamicPartType.MultiChildren;
-export const __DynamicPartChildren: DynamicPartType = DynamicPartType.Children;
-export const __DynamicPartListChildren: DynamicPartType = DynamicPartType.ListChildren;
-export const __DynamicPartChildren_0: [DynamicPartType, number][] = [[DynamicPartType.Children, 0]];
-
-export { updateSpread } from './snapshot/spread.js';
-export { updateEvent } from './snapshot/event.js';
-export { updateRef, transformRef } from './snapshot/ref.js';
-export { updateWorkletEvent } from './snapshot/workletEvent.js';
-export { updateWorkletRef } from './snapshot/workletRef.js';
-export { updateGesture } from './snapshot/gesture.js';
-export { updateListItemPlatformInfo } from './snapshot/platformInfo.js';
-
-export {
-  options,
-  // Component is not an internal API, but refresh needs it from 'react/internal'
-  Component,
-} from 'preact';
-export type { Options } from 'preact';
-
-export { loadDynamicJS, __dynamicImport } from './lynx/dynamic-js.js';
-
-export { withInitDataInState } from './compat/initData.js';
-
-export { wrapWithLynxComponent } from './compat/lynxComponent.js';
-
-/**
- * @internal a polyfill for <component is=? />
- */
-export const __ComponentIsPolyfill: FC<{ is: string }> = /* @__PURE__ */ factory2(
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-  { Suspense, lazy, createElement, useMemo } as any,
-  loadLazyBundle,
-);
-
-export { loadLazyBundle } from './lynx/lazy-bundle.js';
-
-export { transformToWorklet } from './worklet/transformToWorklet.js';
-export { registerWorkletOnBackground } from './worklet/hmr.js';
-
-export { loadWorkletRuntime } from '@lynx-js/react/worklet-runtime/bindings';

package/runtime/src/legacy-react-runtime/index.ts

@@ -1,42 +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 { createContext, createRef } from 'preact';
-import { lazy } from 'preact/compat';
-
-import {
-  ComponentFromReactRuntime as Component,
-  ComponentFromReactRuntime as PureComponent,
-} from '../compat/lynxComponent.js';
-import { useCallback, useEffect, useMemo, useReducer, useRef, useState } from '../hooks/react.js';
-
-/* v8 ignore next 3 */
-function __runInJS<T>(value: T): T | undefined | null {
-  return value;
-}
-
-// should mirror @lynx-js/react-runtime's exports
-export { ComponentFromReactRuntime as Component } from '../compat/lynxComponent.js';
-export { ComponentFromReactRuntime as PureComponent } from '../compat/lynxComponent.js';
-export { createContext } from 'preact';
-export { lazy } from 'preact/compat';
-export { useState, useReducer, useEffect, useMemo, useCallback /*, useInstance */ } from '../hooks/react.js';
-export { __runInJS };
-
-/**
- * @internal
- */
-export default {
-  Component,
-  PureComponent,
-  createContext,
-  createRef,
-  lazy,
-  useState,
-  useReducer,
-  useRef,
-  useEffect,
-  useMemo,
-  useCallback,
-  __runInJS,
-};

package/runtime/src/lifecycle/destroy.ts

@@ -1,34 +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 { render } from 'preact';
-
-import { __root } from '../root.js';
-import { delayedEvents } from './event/delayEvents.js';
-import { delayedLifecycleEvents } from './event/delayLifecycleEvents.js';
-import { globalCommitTaskMap } from './patch/commit.js';
-
-function destroyBackground(): void {
-  if (__PROFILE__) {
-    console.profile('destroyBackground');
-  }
-
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
-  render(null, __root as any);
-
-  globalCommitTaskMap.forEach(task => {
-    task();
-  });
-  globalCommitTaskMap.clear();
-  // Clear delayed events which should not be executed after destroyed.
-  // This is important when the page is performing a reload.
-  delayedLifecycleEvents.length = 0;
-  if (delayedEvents) {
-    delayedEvents.length = 0;
-  }
-  if (__PROFILE__) {
-    console.profileEnd();
-  }
-}
-
-export { destroyBackground };

package/runtime/src/lifecycle/event/delayEvents.ts

@@ -1,11 +0,0 @@
-// Copyright 2025 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.
-let delayedEvents: [handlerName: string, data: unknown][] | undefined;
-
-function delayedPublishEvent(handlerName: string, data: unknown): void {
-  delayedEvents ??= [];
-  delayedEvents.push([handlerName, data]);
-}
-
-export { delayedPublishEvent, delayedEvents };

package/runtime/src/lifecycle/event/delayLifecycleEvents.ts

@@ -1,15 +0,0 @@
-// Copyright 2025 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 type { LifecycleConstant } from '../../lifecycleConstant.js';
-
-const delayedLifecycleEvents: [type: LifecycleConstant, data: unknown][] = [];
-
-function delayLifecycleEvent(type: LifecycleConstant, data: unknown): void {
-  delayedLifecycleEvents.push([type, data]);
-}
-
-/**
- * @internal
- */
-export { delayLifecycleEvent, delayedLifecycleEvents };

package/runtime/src/lifecycle/event/jsReady.ts

@@ -1,34 +0,0 @@
-// Copyright 2025 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 { LifecycleConstant } from '../../lifecycleConstant.js';
-import { __root } from '../../root.js';
-
-let isJSReady: boolean;
-let jsReadyEventIdSwap: Record<string | number, number>;
-
-function jsReady(): void {
-  isJSReady = true;
-  __OnLifecycleEvent([
-    LifecycleConstant.firstScreen, /* FIRST_SCREEN */
-    {
-      root: JSON.stringify(__root),
-      jsReadyEventIdSwap,
-    },
-  ]);
-  jsReadyEventIdSwap = {};
-}
-
-function clearJSReadyEventIdSwap(): void {
-  jsReadyEventIdSwap = {};
-}
-
-function resetJSReady(): void {
-  isJSReady = false;
-  jsReadyEventIdSwap = {};
-}
-
-/**
- * @internal
- */
-export { jsReady, isJSReady, jsReadyEventIdSwap, clearJSReadyEventIdSwap, resetJSReady };

package/runtime/src/lifecycle/pass.ts

@@ -1,14 +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.
-let reloadVersion = 0;
-
-function getReloadVersion(): number {
-  return reloadVersion;
-}
-
-function increaseReloadVersion(): number {
-  return ++reloadVersion;
-}
-
-export { getReloadVersion, increaseReloadVersion };