@lynx-js/react-canary 0.114.4-canary-20251106-5eb6d949 → 0.114.4

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/CHANGELOG.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @lynx-js/react
2
2
 
3
- ## 0.114.4-canary-20251106114651-5eb6d9491672d27febb47566085f21ce10defb9e
3
+ ## 0.114.4
4
4
 
5
5
  ### Patch Changes
6
6
 
@@ -33,11 +33,11 @@
33
33
  - Support testing React Compiler in testing library. Enable React Compiler by setting the `experimental_enableReactCompiler` option of `createVitestConfig` to `true`. ([#1269](https://github.com/lynx-family/lynx-stack/pull/1269))
34
34
 
35
35
  ```js
36
- import { defineConfig, mergeConfig } from "vitest/config";
37
- import { createVitestConfig } from "@lynx-js/react/testing-library/vitest-config";
36
+ import { defineConfig, mergeConfig } from 'vitest/config';
37
+ import { createVitestConfig } from '@lynx-js/react/testing-library/vitest-config';
38
38
 
39
39
  const defaultConfig = await createVitestConfig({
40
- runtimePkgName: "@lynx-js/react",
40
+ runtimePkgName: '@lynx-js/react',
41
41
  experimental_enableReactCompiler: true,
42
42
  });
43
43
 
@@ -67,7 +67,7 @@
67
67
  ```tsx
68
68
  function App() {
69
69
  function handleInnerTap(event: MainThread.TouchEvent) {
70
- "main thread";
70
+ 'main thread';
71
71
  event.stopPropagation();
72
72
  // Or stop immediate propagation with
73
73
  // event.stopImmediatePropagation();
@@ -165,10 +165,10 @@
165
165
  - Add `animate` API in Main Thread Script(MTS), so you can now control a CSS animation imperatively ([#1534](https://github.com/lynx-family/lynx-stack/pull/1534))
166
166
 
167
167
  ```ts
168
- import type { MainThread } from "@lynx-js/types";
168
+ import type { MainThread } from '@lynx-js/types';
169
169
 
170
170
  function startAnimation(ele: MainThread.Element) {
171
- "main thread";
171
+ 'main thread';
172
172
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
173
173
  duration: 3000,
174
174
  });
@@ -197,7 +197,7 @@
197
197
  - Supports `recyclable` attribute in `<list-item>` to control whether the list item is recyclable. The `recyclable` attribute depends on Lynx Engine 3.4 or later. ([#1388](https://github.com/lynx-family/lynx-stack/pull/1388))
198
198
 
199
199
  ```jsx
200
- <list-item recyclable={false} />
200
+ <list-item recyclable={false} />;
201
201
  ```
202
202
 
203
203
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -218,7 +218,7 @@
218
218
 
219
219
  ```ts
220
220
  function handleTap() {
221
- "main thread";
221
+ 'main thread';
222
222
  // The following check always returned false before this fix
223
223
  if (myHandleTap) {
224
224
  runOnBackground(myHandleTap)();
@@ -279,10 +279,10 @@
279
279
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
280
280
 
281
281
  ```js
282
- import "@lynx-js/react/debug";
283
- import { root } from "@lynx-js/react";
282
+ import '@lynx-js/react/debug';
283
+ import { root } from '@lynx-js/react';
284
284
 
285
- import { App } from "./App.jsx";
285
+ import { App } from './App.jsx';
286
286
 
287
287
  root.render(<App />);
288
288
  ```
@@ -292,9 +292,9 @@
292
292
  For example, you can use it like this:
293
293
 
294
294
  ```jsx
295
- <list-item defer={{ unmountRecycled: true }} item-key="1">
295
+ <list-item defer={{ unmountRecycled: true }} item-key='1'>
296
296
  <WillBeUnmountIfRecycled />
297
- </list-item>
297
+ </list-item>;
298
298
  ```
299
299
 
300
300
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -302,7 +302,7 @@
302
302
  - Avoid some unexpected `__SetAttribute` in hydrate when `undefined` is passed as an attribute value to intrinsic elements, for example: ([#1318](https://github.com/lynx-family/lynx-stack/pull/1318))
303
303
 
304
304
  ```jsx
305
- <image async-mode={undefined} />
305
+ <image async-mode={undefined} />;
306
306
  ```
307
307
 
308
308
  ## 0.111.1
@@ -348,7 +348,7 @@
348
348
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
349
349
 
350
350
  ```js
351
- import { act } from "@lynx-js/react/testing-library";
351
+ import { act } from '@lynx-js/react/testing-library';
352
352
 
353
353
  act(() => {
354
354
  // ...
@@ -454,7 +454,8 @@
454
454
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
455
455
  */
456
456
  experimental-batch-render-strategy={3}
457
- ></list>
457
+ >
458
+ </list>;
458
459
  ```
459
460
 
460
461
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -572,7 +573,7 @@
572
573
  You can now use `useErrorBoundary` it in TypeScript like this:
573
574
 
574
575
  ```tsx
575
- import { useErrorBoundary } from "@lynx-js/react";
576
+ import { useErrorBoundary } from '@lynx-js/react';
576
577
  ```
577
578
 
578
579
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -624,13 +625,13 @@
624
625
  Now you can get the return value from `runOnBackground()` and `runOnMainThread()`, which enables more flexible data flow between the main thread and the background thread.
625
626
 
626
627
  ```js
627
- import { runOnBackground } from "@lynx-js/react";
628
+ import { runOnBackground } from '@lynx-js/react';
628
629
 
629
630
  const onTap = async () => {
630
- "main thread";
631
+ 'main thread';
631
632
  const text = await runOnBackground(() => {
632
- "background only";
633
- return "Hello, world!";
633
+ 'background only';
634
+ return 'Hello, world!';
634
635
  })();
635
636
  console.log(text);
636
637
  };
@@ -665,9 +666,9 @@
665
666
 
666
667
  ```ts
667
668
  // These imports will be removed from the final bundle
668
- import type { Foo } from "xyz";
669
- import { type Bar } from "xyz";
670
- import { xyz } from "xyz"; // When xyz is not used
669
+ import type { Foo } from 'xyz';
670
+ import { type Bar } from 'xyz';
671
+ import { xyz } from 'xyz'; // When xyz is not used
671
672
  ```
672
673
 
673
674
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -707,7 +708,7 @@
707
708
  const f = undefined;
708
709
 
709
710
  function mts() {
710
- "main thread";
711
+ 'main thread';
711
712
  // throws in background rendering
712
713
  f && runOnBackground(f)();
713
714
  }
@@ -741,14 +742,14 @@
741
742
  - a30c83d: Add `compat.removeComponentAttrRegex`.
742
743
 
743
744
  ```js
744
- import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
745
- import { defineConfig } from "@lynx-js/rspeedy";
745
+ import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
746
+ import { defineConfig } from '@lynx-js/rspeedy';
746
747
 
747
748
  export default defineConfig({
748
749
  plugins: [
749
750
  pluginReactLynx({
750
751
  compat: {
751
- removeComponentAttrRegex: "YOUR REGEX",
752
+ removeComponentAttrRegex: 'YOUR REGEX',
752
753
  },
753
754
  }),
754
755
  ],
@@ -834,22 +835,22 @@
834
835
  Gesture Handler is a set of gesture handling capabilities built on top of the Main Thread Script. It currently supports drag, inertial scrolling, long press, and tap gestures for `<view>`, `<scroll-view>`, `<list>`, and `<text>`. In the future, it will also support multi-finger zoom, multi-finger rotation, and other gesture capabilities.
835
836
 
836
837
  ```tsx
837
- import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
838
+ import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
838
839
 
839
840
  function App() {
840
841
  const pan = useGesture(PanGesture);
841
842
 
842
843
  pan
843
844
  .onBegin((event, stateManager) => {
844
- "main thread";
845
+ 'main thread';
845
846
  // some logic
846
847
  })
847
848
  .onUpdate((event, stateManager) => {
848
- "main thread";
849
+ 'main thread';
849
850
  // some logic
850
851
  })
851
852
  .onEnd((event, stateManager) => {
852
- "main thread";
853
+ 'main thread';
853
854
  // some logic
854
855
  });
855
856
 
@@ -869,7 +870,7 @@
869
870
  return;
870
871
  }
871
872
 
872
- console.log("not __LEPUS__"); // This can be removed now
873
+ console.log('not __LEPUS__'); // This can be removed now
873
874
  }
874
875
  ```
875
876
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.114.4-canary-20251106-5eb6d949",
3
+ "version": "0.114.4",
4
4
  "description": "ReactLynx is a framework for developing Lynx applications with familiar React.",
5
5
  "repository": {
6
6
  "type": "git",
@@ -5,7 +5,7 @@
5
5
  Rslib v0.15.0
6
6
 
7
7
  info build started...
8
- ready built in 0.10 s
8
+ ready built in 0.15 s
9
9
 
10
10
  File (esm) Size 
11
11
  dist/index.js 10.1 kB