@lynx-js/react-canary 0.114.5-canary-20251121-e1a9493a → 0.114.5

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.5-canary-20251121034851-e1a9493a1d565fd077d55cba818ba12fbefc30a1
3
+ ## 0.114.5
4
4
 
5
5
  ### Patch Changes
6
6
 
@@ -39,11 +39,11 @@
39
39
  - 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))
40
40
 
41
41
  ```js
42
- import { defineConfig, mergeConfig } from "vitest/config";
43
- import { createVitestConfig } from "@lynx-js/react/testing-library/vitest-config";
42
+ import { defineConfig, mergeConfig } from 'vitest/config';
43
+ import { createVitestConfig } from '@lynx-js/react/testing-library/vitest-config';
44
44
 
45
45
  const defaultConfig = await createVitestConfig({
46
- runtimePkgName: "@lynx-js/react",
46
+ runtimePkgName: '@lynx-js/react',
47
47
  experimental_enableReactCompiler: true,
48
48
  });
49
49
 
@@ -73,7 +73,7 @@
73
73
  ```tsx
74
74
  function App() {
75
75
  function handleInnerTap(event: MainThread.TouchEvent) {
76
- "main thread";
76
+ 'main thread';
77
77
  event.stopPropagation();
78
78
  // Or stop immediate propagation with
79
79
  // event.stopImmediatePropagation();
@@ -171,10 +171,10 @@
171
171
  - 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))
172
172
 
173
173
  ```ts
174
- import type { MainThread } from "@lynx-js/types";
174
+ import type { MainThread } from '@lynx-js/types';
175
175
 
176
176
  function startAnimation(ele: MainThread.Element) {
177
- "main thread";
177
+ 'main thread';
178
178
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
179
179
  duration: 3000,
180
180
  });
@@ -203,7 +203,7 @@
203
203
  - 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))
204
204
 
205
205
  ```jsx
206
- <list-item recyclable={false} />
206
+ <list-item recyclable={false} />;
207
207
  ```
208
208
 
209
209
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -224,7 +224,7 @@
224
224
 
225
225
  ```ts
226
226
  function handleTap() {
227
- "main thread";
227
+ 'main thread';
228
228
  // The following check always returned false before this fix
229
229
  if (myHandleTap) {
230
230
  runOnBackground(myHandleTap)();
@@ -285,10 +285,10 @@
285
285
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
286
286
 
287
287
  ```js
288
- import "@lynx-js/react/debug";
289
- import { root } from "@lynx-js/react";
288
+ import '@lynx-js/react/debug';
289
+ import { root } from '@lynx-js/react';
290
290
 
291
- import { App } from "./App.jsx";
291
+ import { App } from './App.jsx';
292
292
 
293
293
  root.render(<App />);
294
294
  ```
@@ -298,9 +298,9 @@
298
298
  For example, you can use it like this:
299
299
 
300
300
  ```jsx
301
- <list-item defer={{ unmountRecycled: true }} item-key="1">
301
+ <list-item defer={{ unmountRecycled: true }} item-key='1'>
302
302
  <WillBeUnmountIfRecycled />
303
- </list-item>
303
+ </list-item>;
304
304
  ```
305
305
 
306
306
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -308,7 +308,7 @@
308
308
  - 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))
309
309
 
310
310
  ```jsx
311
- <image async-mode={undefined} />
311
+ <image async-mode={undefined} />;
312
312
  ```
313
313
 
314
314
  ## 0.111.1
@@ -354,7 +354,7 @@
354
354
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
355
355
 
356
356
  ```js
357
- import { act } from "@lynx-js/react/testing-library";
357
+ import { act } from '@lynx-js/react/testing-library';
358
358
 
359
359
  act(() => {
360
360
  // ...
@@ -460,7 +460,8 @@
460
460
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
461
461
  */
462
462
  experimental-batch-render-strategy={3}
463
- ></list>
463
+ >
464
+ </list>;
464
465
  ```
465
466
 
466
467
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -578,7 +579,7 @@
578
579
  You can now use `useErrorBoundary` it in TypeScript like this:
579
580
 
580
581
  ```tsx
581
- import { useErrorBoundary } from "@lynx-js/react";
582
+ import { useErrorBoundary } from '@lynx-js/react';
582
583
  ```
583
584
 
584
585
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -630,13 +631,13 @@
630
631
  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.
631
632
 
632
633
  ```js
633
- import { runOnBackground } from "@lynx-js/react";
634
+ import { runOnBackground } from '@lynx-js/react';
634
635
 
635
636
  const onTap = async () => {
636
- "main thread";
637
+ 'main thread';
637
638
  const text = await runOnBackground(() => {
638
- "background only";
639
- return "Hello, world!";
639
+ 'background only';
640
+ return 'Hello, world!';
640
641
  })();
641
642
  console.log(text);
642
643
  };
@@ -671,9 +672,9 @@
671
672
 
672
673
  ```ts
673
674
  // These imports will be removed from the final bundle
674
- import type { Foo } from "xyz";
675
- import { type Bar } from "xyz";
676
- import { xyz } from "xyz"; // When xyz is not used
675
+ import type { Foo } from 'xyz';
676
+ import { type Bar } from 'xyz';
677
+ import { xyz } from 'xyz'; // When xyz is not used
677
678
  ```
678
679
 
679
680
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -713,7 +714,7 @@
713
714
  const f = undefined;
714
715
 
715
716
  function mts() {
716
- "main thread";
717
+ 'main thread';
717
718
  // throws in background rendering
718
719
  f && runOnBackground(f)();
719
720
  }
@@ -747,14 +748,14 @@
747
748
  - a30c83d: Add `compat.removeComponentAttrRegex`.
748
749
 
749
750
  ```js
750
- import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
751
- import { defineConfig } from "@lynx-js/rspeedy";
751
+ import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
752
+ import { defineConfig } from '@lynx-js/rspeedy';
752
753
 
753
754
  export default defineConfig({
754
755
  plugins: [
755
756
  pluginReactLynx({
756
757
  compat: {
757
- removeComponentAttrRegex: "YOUR REGEX",
758
+ removeComponentAttrRegex: 'YOUR REGEX',
758
759
  },
759
760
  }),
760
761
  ],
@@ -840,22 +841,22 @@
840
841
  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.
841
842
 
842
843
  ```tsx
843
- import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
844
+ import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
844
845
 
845
846
  function App() {
846
847
  const pan = useGesture(PanGesture);
847
848
 
848
849
  pan
849
850
  .onBegin((event, stateManager) => {
850
- "main thread";
851
+ 'main thread';
851
852
  // some logic
852
853
  })
853
854
  .onUpdate((event, stateManager) => {
854
- "main thread";
855
+ 'main thread';
855
856
  // some logic
856
857
  })
857
858
  .onEnd((event, stateManager) => {
858
- "main thread";
859
+ 'main thread';
859
860
  // some logic
860
861
  });
861
862
 
@@ -875,7 +876,7 @@
875
876
  return;
876
877
  }
877
878
 
878
- console.log("not __LEPUS__"); // This can be removed now
879
+ console.log('not __LEPUS__'); // This can be removed now
879
880
  }
880
881
  ```
881
882
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.114.5-canary-20251121-e1a9493a",
3
+ "version": "0.114.5",
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.17 s
8
+ ready built in 0.15 s
9
9
 
10
10
  File (esm) Size 
11
11
  dist/index.js 10.1 kB