@lynx-js/react-canary 0.115.0-canary-20251205-6400f87b → 0.115.0

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.115.0-canary-20251205074811-6400f87b9b0370e5fe53ce37711d45932fede695
3
+ ## 0.115.0
4
4
 
5
5
  ### Minor Changes
6
6
 
@@ -68,11 +68,11 @@
68
68
  - 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))
69
69
 
70
70
  ```js
71
- import { defineConfig, mergeConfig } from "vitest/config";
72
- import { createVitestConfig } from "@lynx-js/react/testing-library/vitest-config";
71
+ import { defineConfig, mergeConfig } from 'vitest/config';
72
+ import { createVitestConfig } from '@lynx-js/react/testing-library/vitest-config';
73
73
 
74
74
  const defaultConfig = await createVitestConfig({
75
- runtimePkgName: "@lynx-js/react",
75
+ runtimePkgName: '@lynx-js/react',
76
76
  experimental_enableReactCompiler: true,
77
77
  });
78
78
 
@@ -102,7 +102,7 @@
102
102
  ```tsx
103
103
  function App() {
104
104
  function handleInnerTap(event: MainThread.TouchEvent) {
105
- "main thread";
105
+ 'main thread';
106
106
  event.stopPropagation();
107
107
  // Or stop immediate propagation with
108
108
  // event.stopImmediatePropagation();
@@ -200,10 +200,10 @@
200
200
  - 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))
201
201
 
202
202
  ```ts
203
- import type { MainThread } from "@lynx-js/types";
203
+ import type { MainThread } from '@lynx-js/types';
204
204
 
205
205
  function startAnimation(ele: MainThread.Element) {
206
- "main thread";
206
+ 'main thread';
207
207
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
208
208
  duration: 3000,
209
209
  });
@@ -232,7 +232,7 @@
232
232
  - 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))
233
233
 
234
234
  ```jsx
235
- <list-item recyclable={false} />
235
+ <list-item recyclable={false} />;
236
236
  ```
237
237
 
238
238
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -253,7 +253,7 @@
253
253
 
254
254
  ```ts
255
255
  function handleTap() {
256
- "main thread";
256
+ 'main thread';
257
257
  // The following check always returned false before this fix
258
258
  if (myHandleTap) {
259
259
  runOnBackground(myHandleTap)();
@@ -314,10 +314,10 @@
314
314
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
315
315
 
316
316
  ```js
317
- import "@lynx-js/react/debug";
318
- import { root } from "@lynx-js/react";
317
+ import '@lynx-js/react/debug';
318
+ import { root } from '@lynx-js/react';
319
319
 
320
- import { App } from "./App.jsx";
320
+ import { App } from './App.jsx';
321
321
 
322
322
  root.render(<App />);
323
323
  ```
@@ -327,9 +327,9 @@
327
327
  For example, you can use it like this:
328
328
 
329
329
  ```jsx
330
- <list-item defer={{ unmountRecycled: true }} item-key="1">
330
+ <list-item defer={{ unmountRecycled: true }} item-key='1'>
331
331
  <WillBeUnmountIfRecycled />
332
- </list-item>
332
+ </list-item>;
333
333
  ```
334
334
 
335
335
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -337,7 +337,7 @@
337
337
  - 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))
338
338
 
339
339
  ```jsx
340
- <image async-mode={undefined} />
340
+ <image async-mode={undefined} />;
341
341
  ```
342
342
 
343
343
  ## 0.111.1
@@ -383,7 +383,7 @@
383
383
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
384
384
 
385
385
  ```js
386
- import { act } from "@lynx-js/react/testing-library";
386
+ import { act } from '@lynx-js/react/testing-library';
387
387
 
388
388
  act(() => {
389
389
  // ...
@@ -489,7 +489,8 @@
489
489
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
490
490
  */
491
491
  experimental-batch-render-strategy={3}
492
- ></list>
492
+ >
493
+ </list>;
493
494
  ```
494
495
 
495
496
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -607,7 +608,7 @@
607
608
  You can now use `useErrorBoundary` it in TypeScript like this:
608
609
 
609
610
  ```tsx
610
- import { useErrorBoundary } from "@lynx-js/react";
611
+ import { useErrorBoundary } from '@lynx-js/react';
611
612
  ```
612
613
 
613
614
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -659,13 +660,13 @@
659
660
  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.
660
661
 
661
662
  ```js
662
- import { runOnBackground } from "@lynx-js/react";
663
+ import { runOnBackground } from '@lynx-js/react';
663
664
 
664
665
  const onTap = async () => {
665
- "main thread";
666
+ 'main thread';
666
667
  const text = await runOnBackground(() => {
667
- "background only";
668
- return "Hello, world!";
668
+ 'background only';
669
+ return 'Hello, world!';
669
670
  })();
670
671
  console.log(text);
671
672
  };
@@ -700,9 +701,9 @@
700
701
 
701
702
  ```ts
702
703
  // These imports will be removed from the final bundle
703
- import type { Foo } from "xyz";
704
- import { type Bar } from "xyz";
705
- import { xyz } from "xyz"; // When xyz is not used
704
+ import type { Foo } from 'xyz';
705
+ import { type Bar } from 'xyz';
706
+ import { xyz } from 'xyz'; // When xyz is not used
706
707
  ```
707
708
 
708
709
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -742,7 +743,7 @@
742
743
  const f = undefined;
743
744
 
744
745
  function mts() {
745
- "main thread";
746
+ 'main thread';
746
747
  // throws in background rendering
747
748
  f && runOnBackground(f)();
748
749
  }
@@ -776,14 +777,14 @@
776
777
  - a30c83d: Add `compat.removeComponentAttrRegex`.
777
778
 
778
779
  ```js
779
- import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
780
- import { defineConfig } from "@lynx-js/rspeedy";
780
+ import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
781
+ import { defineConfig } from '@lynx-js/rspeedy';
781
782
 
782
783
  export default defineConfig({
783
784
  plugins: [
784
785
  pluginReactLynx({
785
786
  compat: {
786
- removeComponentAttrRegex: "YOUR REGEX",
787
+ removeComponentAttrRegex: 'YOUR REGEX',
787
788
  },
788
789
  }),
789
790
  ],
@@ -869,22 +870,22 @@
869
870
  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.
870
871
 
871
872
  ```tsx
872
- import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
873
+ import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
873
874
 
874
875
  function App() {
875
876
  const pan = useGesture(PanGesture);
876
877
 
877
878
  pan
878
879
  .onBegin((event, stateManager) => {
879
- "main thread";
880
+ 'main thread';
880
881
  // some logic
881
882
  })
882
883
  .onUpdate((event, stateManager) => {
883
- "main thread";
884
+ 'main thread';
884
885
  // some logic
885
886
  })
886
887
  .onEnd((event, stateManager) => {
887
- "main thread";
888
+ 'main thread';
888
889
  // some logic
889
890
  });
890
891
 
@@ -904,7 +905,7 @@
904
905
  return;
905
906
  }
906
907
 
907
- console.log("not __LEPUS__"); // This can be removed now
908
+ console.log('not __LEPUS__'); // This can be removed now
908
909
  }
909
910
  ```
910
911
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.115.0-canary-20251205-6400f87b",
3
+ "version": "0.115.0",
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.17 s
9
9
 
10
10
  File (esm) Size 
11
11
  dist/index.js 10.1 kB