@lynx-js/react-canary 0.113.0-canary-20250915-59a0d600 → 0.113.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.
Files changed (2) hide show
  1. package/CHANGELOG.md +31 -30
  2. package/package.json +1 -1
package/CHANGELOG.md CHANGED
@@ -1,6 +1,6 @@
1
1
  # @lynx-js/react
2
2
 
3
- ## 0.113.0-canary-20250915090032-59a0d600e111d2ae5136f5ee7cd768bc38de018b
3
+ ## 0.113.0
4
4
 
5
5
  ### Minor Changes
6
6
 
@@ -53,10 +53,10 @@
53
53
  - 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))
54
54
 
55
55
  ```ts
56
- import type { MainThread } from "@lynx-js/types";
56
+ import type { MainThread } from '@lynx-js/types';
57
57
 
58
58
  function startAnimation(ele: MainThread.Element) {
59
- "main thread";
59
+ 'main thread';
60
60
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
61
61
  duration: 3000,
62
62
  });
@@ -85,7 +85,7 @@
85
85
  - 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))
86
86
 
87
87
  ```jsx
88
- <list-item recyclable={false} />
88
+ <list-item recyclable={false} />;
89
89
  ```
90
90
 
91
91
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -106,7 +106,7 @@
106
106
 
107
107
  ```ts
108
108
  function handleTap() {
109
- "main thread";
109
+ 'main thread';
110
110
  // The following check always returned false before this fix
111
111
  if (myHandleTap) {
112
112
  runOnBackground(myHandleTap)();
@@ -167,10 +167,10 @@
167
167
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
168
168
 
169
169
  ```js
170
- import "@lynx-js/react/debug";
171
- import { root } from "@lynx-js/react";
170
+ import '@lynx-js/react/debug';
171
+ import { root } from '@lynx-js/react';
172
172
 
173
- import { App } from "./App.jsx";
173
+ import { App } from './App.jsx';
174
174
 
175
175
  root.render(<App />);
176
176
  ```
@@ -180,9 +180,9 @@
180
180
  For example, you can use it like this:
181
181
 
182
182
  ```jsx
183
- <list-item defer={{ unmountRecycled: true }} item-key="1">
183
+ <list-item defer={{ unmountRecycled: true }} item-key='1'>
184
184
  <WillBeUnmountIfRecycled />
185
- </list-item>
185
+ </list-item>;
186
186
  ```
187
187
 
188
188
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -190,7 +190,7 @@
190
190
  - 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))
191
191
 
192
192
  ```jsx
193
- <image async-mode={undefined} />
193
+ <image async-mode={undefined} />;
194
194
  ```
195
195
 
196
196
  ## 0.111.1
@@ -236,7 +236,7 @@
236
236
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
237
237
 
238
238
  ```js
239
- import { act } from "@lynx-js/react/testing-library";
239
+ import { act } from '@lynx-js/react/testing-library';
240
240
 
241
241
  act(() => {
242
242
  // ...
@@ -342,7 +342,8 @@
342
342
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
343
343
  */
344
344
  experimental-batch-render-strategy={3}
345
- ></list>
345
+ >
346
+ </list>;
346
347
  ```
347
348
 
348
349
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -460,7 +461,7 @@
460
461
  You can now use `useErrorBoundary` it in TypeScript like this:
461
462
 
462
463
  ```tsx
463
- import { useErrorBoundary } from "@lynx-js/react";
464
+ import { useErrorBoundary } from '@lynx-js/react';
464
465
  ```
465
466
 
466
467
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -512,13 +513,13 @@
512
513
  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.
513
514
 
514
515
  ```js
515
- import { runOnBackground } from "@lynx-js/react";
516
+ import { runOnBackground } from '@lynx-js/react';
516
517
 
517
518
  const onTap = async () => {
518
- "main thread";
519
+ 'main thread';
519
520
  const text = await runOnBackground(() => {
520
- "background only";
521
- return "Hello, world!";
521
+ 'background only';
522
+ return 'Hello, world!';
522
523
  })();
523
524
  console.log(text);
524
525
  };
@@ -553,9 +554,9 @@
553
554
 
554
555
  ```ts
555
556
  // These imports will be removed from the final bundle
556
- import type { Foo } from "xyz";
557
- import { type Bar } from "xyz";
558
- import { xyz } from "xyz"; // When xyz is not used
557
+ import type { Foo } from 'xyz';
558
+ import { type Bar } from 'xyz';
559
+ import { xyz } from 'xyz'; // When xyz is not used
559
560
  ```
560
561
 
561
562
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -595,7 +596,7 @@
595
596
  const f = undefined;
596
597
 
597
598
  function mts() {
598
- "main thread";
599
+ 'main thread';
599
600
  // throws in background rendering
600
601
  f && runOnBackground(f)();
601
602
  }
@@ -629,14 +630,14 @@
629
630
  - a30c83d: Add `compat.removeComponentAttrRegex`.
630
631
 
631
632
  ```js
632
- import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
633
- import { defineConfig } from "@lynx-js/rspeedy";
633
+ import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
634
+ import { defineConfig } from '@lynx-js/rspeedy';
634
635
 
635
636
  export default defineConfig({
636
637
  plugins: [
637
638
  pluginReactLynx({
638
639
  compat: {
639
- removeComponentAttrRegex: "YOUR REGEX",
640
+ removeComponentAttrRegex: 'YOUR REGEX',
640
641
  },
641
642
  }),
642
643
  ],
@@ -722,22 +723,22 @@
722
723
  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.
723
724
 
724
725
  ```tsx
725
- import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
726
+ import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
726
727
 
727
728
  function App() {
728
729
  const pan = useGesture(PanGesture);
729
730
 
730
731
  pan
731
732
  .onBegin((event, stateManager) => {
732
- "main thread";
733
+ 'main thread';
733
734
  // some logic
734
735
  })
735
736
  .onUpdate((event, stateManager) => {
736
- "main thread";
737
+ 'main thread';
737
738
  // some logic
738
739
  })
739
740
  .onEnd((event, stateManager) => {
740
- "main thread";
741
+ 'main thread';
741
742
  // some logic
742
743
  });
743
744
 
@@ -757,7 +758,7 @@
757
758
  return;
758
759
  }
759
760
 
760
- console.log("not __LEPUS__"); // This can be removed now
761
+ console.log('not __LEPUS__'); // This can be removed now
761
762
  }
762
763
  ```
763
764
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.113.0-canary-20250915-59a0d600",
3
+ "version": "0.113.0",
4
4
  "description": "ReactLynx is a framework for developing Lynx applications with familiar React.",
5
5
  "repository": {
6
6
  "type": "git",