@lynx-js/react-canary 0.115.4-canary-20260111-9646114b → 0.115.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.115.4-canary-20260111163415-9646114ba965de25ef18230718c6df291f0ea479
3
+ ## 0.115.4
4
4
 
5
5
  ### Patch Changes
6
6
 
@@ -12,9 +12,9 @@
12
12
 
13
13
  ```typescript
14
14
  function getStyle(ele: MainThread.Element) {
15
- "main thread";
16
- const width = ele.getComputedStyleProperty("width"); // Returns 300px
17
- const transformMatrix = ele.getComputedStyleProperty("transform"); // Returns matrix(2, 0, 0, 2, 200, 400)
15
+ 'main thread';
16
+ const width = ele.getComputedStyleProperty('width'); // Returns 300px
17
+ const transformMatrix = ele.getComputedStyleProperty('transform'); // Returns matrix(2, 0, 0, 2, 200, 400)
18
18
  }
19
19
  ```
20
20
 
@@ -29,7 +29,7 @@
29
29
  ```ts
30
30
  const LazyComponent = lazy(async () => {
31
31
  try {
32
- const mod = await import("./lazy-bundle");
32
+ const mod = await import('./lazy-bundle');
33
33
  return mod.default;
34
34
  } catch (error) {
35
35
  console.error(`Lazy Bundle load failed message: ${error.message}`);
@@ -141,11 +141,11 @@
141
141
  - 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))
142
142
 
143
143
  ```js
144
- import { defineConfig, mergeConfig } from "vitest/config";
145
- import { createVitestConfig } from "@lynx-js/react/testing-library/vitest-config";
144
+ import { defineConfig, mergeConfig } from 'vitest/config';
145
+ import { createVitestConfig } from '@lynx-js/react/testing-library/vitest-config';
146
146
 
147
147
  const defaultConfig = await createVitestConfig({
148
- runtimePkgName: "@lynx-js/react",
148
+ runtimePkgName: '@lynx-js/react',
149
149
  experimental_enableReactCompiler: true,
150
150
  });
151
151
 
@@ -175,7 +175,7 @@
175
175
  ```tsx
176
176
  function App() {
177
177
  function handleInnerTap(event: MainThread.TouchEvent) {
178
- "main thread";
178
+ 'main thread';
179
179
  event.stopPropagation();
180
180
  // Or stop immediate propagation with
181
181
  // event.stopImmediatePropagation();
@@ -273,10 +273,10 @@
273
273
  - 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))
274
274
 
275
275
  ```ts
276
- import type { MainThread } from "@lynx-js/types";
276
+ import type { MainThread } from '@lynx-js/types';
277
277
 
278
278
  function startAnimation(ele: MainThread.Element) {
279
- "main thread";
279
+ 'main thread';
280
280
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
281
281
  duration: 3000,
282
282
  });
@@ -305,7 +305,7 @@
305
305
  - 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))
306
306
 
307
307
  ```jsx
308
- <list-item recyclable={false} />
308
+ <list-item recyclable={false} />;
309
309
  ```
310
310
 
311
311
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -326,7 +326,7 @@
326
326
 
327
327
  ```ts
328
328
  function handleTap() {
329
- "main thread";
329
+ 'main thread';
330
330
  // The following check always returned false before this fix
331
331
  if (myHandleTap) {
332
332
  runOnBackground(myHandleTap)();
@@ -387,10 +387,10 @@
387
387
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
388
388
 
389
389
  ```js
390
- import "@lynx-js/react/debug";
391
- import { root } from "@lynx-js/react";
390
+ import '@lynx-js/react/debug';
391
+ import { root } from '@lynx-js/react';
392
392
 
393
- import { App } from "./App.jsx";
393
+ import { App } from './App.jsx';
394
394
 
395
395
  root.render(<App />);
396
396
  ```
@@ -400,9 +400,9 @@
400
400
  For example, you can use it like this:
401
401
 
402
402
  ```jsx
403
- <list-item defer={{ unmountRecycled: true }} item-key="1">
403
+ <list-item defer={{ unmountRecycled: true }} item-key='1'>
404
404
  <WillBeUnmountIfRecycled />
405
- </list-item>
405
+ </list-item>;
406
406
  ```
407
407
 
408
408
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -410,7 +410,7 @@
410
410
  - 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))
411
411
 
412
412
  ```jsx
413
- <image async-mode={undefined} />
413
+ <image async-mode={undefined} />;
414
414
  ```
415
415
 
416
416
  ## 0.111.1
@@ -456,7 +456,7 @@
456
456
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
457
457
 
458
458
  ```js
459
- import { act } from "@lynx-js/react/testing-library";
459
+ import { act } from '@lynx-js/react/testing-library';
460
460
 
461
461
  act(() => {
462
462
  // ...
@@ -562,7 +562,8 @@
562
562
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
563
563
  */
564
564
  experimental-batch-render-strategy={3}
565
- ></list>
565
+ >
566
+ </list>;
566
567
  ```
567
568
 
568
569
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -680,7 +681,7 @@
680
681
  You can now use `useErrorBoundary` it in TypeScript like this:
681
682
 
682
683
  ```tsx
683
- import { useErrorBoundary } from "@lynx-js/react";
684
+ import { useErrorBoundary } from '@lynx-js/react';
684
685
  ```
685
686
 
686
687
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -732,13 +733,13 @@
732
733
  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.
733
734
 
734
735
  ```js
735
- import { runOnBackground } from "@lynx-js/react";
736
+ import { runOnBackground } from '@lynx-js/react';
736
737
 
737
738
  const onTap = async () => {
738
- "main thread";
739
+ 'main thread';
739
740
  const text = await runOnBackground(() => {
740
- "background only";
741
- return "Hello, world!";
741
+ 'background only';
742
+ return 'Hello, world!';
742
743
  })();
743
744
  console.log(text);
744
745
  };
@@ -773,9 +774,9 @@
773
774
 
774
775
  ```ts
775
776
  // These imports will be removed from the final bundle
776
- import type { Foo } from "xyz";
777
- import { type Bar } from "xyz";
778
- import { xyz } from "xyz"; // When xyz is not used
777
+ import type { Foo } from 'xyz';
778
+ import { type Bar } from 'xyz';
779
+ import { xyz } from 'xyz'; // When xyz is not used
779
780
  ```
780
781
 
781
782
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -815,7 +816,7 @@
815
816
  const f = undefined;
816
817
 
817
818
  function mts() {
818
- "main thread";
819
+ 'main thread';
819
820
  // throws in background rendering
820
821
  f && runOnBackground(f)();
821
822
  }
@@ -849,14 +850,14 @@
849
850
  - a30c83d: Add `compat.removeComponentAttrRegex`.
850
851
 
851
852
  ```js
852
- import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
853
- import { defineConfig } from "@lynx-js/rspeedy";
853
+ import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
854
+ import { defineConfig } from '@lynx-js/rspeedy';
854
855
 
855
856
  export default defineConfig({
856
857
  plugins: [
857
858
  pluginReactLynx({
858
859
  compat: {
859
- removeComponentAttrRegex: "YOUR REGEX",
860
+ removeComponentAttrRegex: 'YOUR REGEX',
860
861
  },
861
862
  }),
862
863
  ],
@@ -942,22 +943,22 @@
942
943
  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.
943
944
 
944
945
  ```tsx
945
- import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
946
+ import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
946
947
 
947
948
  function App() {
948
949
  const pan = useGesture(PanGesture);
949
950
 
950
951
  pan
951
952
  .onBegin((event, stateManager) => {
952
- "main thread";
953
+ 'main thread';
953
954
  // some logic
954
955
  })
955
956
  .onUpdate((event, stateManager) => {
956
- "main thread";
957
+ 'main thread';
957
958
  // some logic
958
959
  })
959
960
  .onEnd((event, stateManager) => {
960
- "main thread";
961
+ 'main thread';
961
962
  // some logic
962
963
  });
963
964
 
@@ -977,7 +978,7 @@
977
978
  return;
978
979
  }
979
980
 
980
- console.log("not __LEPUS__"); // This can be removed now
981
+ console.log('not __LEPUS__'); // This can be removed now
981
982
  }
982
983
  ```
983
984
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.115.4-canary-20260111-9646114b",
3
+ "version": "0.115.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.19.1
6
6
 
7
7
  info build started...
8
- ready built in 0.25 s
8
+ ready built in 0.15 s
9
9
 
10
10
  File (esm) Size 
11
11
  dist/index.js 10.1 kB