@lynx-js/react-canary 0.112.5 → 0.112.6-canary-20250901-c9059ab9

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,5 +1,11 @@
1
1
  # @lynx-js/react
2
2
 
3
+ ## 0.112.6-canary-20250901015940-c9059ab965c7a07de0d377f83d317286a9089d68
4
+
5
+ ### Patch Changes
6
+
7
+ - fix `fireEvent` type error in testing library ([#1596](https://github.com/lynx-family/lynx-stack/pull/1596))
8
+
3
9
  ## 0.112.5
4
10
 
5
11
  ### Patch Changes
@@ -23,10 +29,10 @@
23
29
  - 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))
24
30
 
25
31
  ```ts
26
- import type { MainThread } from '@lynx-js/types';
32
+ import type { MainThread } from "@lynx-js/types";
27
33
 
28
34
  function startAnimation(ele: MainThread.Element) {
29
- 'main thread';
35
+ "main thread";
30
36
  const animation = ele.animate([{ opacity: 0 }, { opacity: 1 }], {
31
37
  duration: 3000,
32
38
  });
@@ -55,7 +61,7 @@
55
61
  - 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))
56
62
 
57
63
  ```jsx
58
- <list-item recyclable={false} />;
64
+ <list-item recyclable={false} />
59
65
  ```
60
66
 
61
67
  - feat: Support using a host element as direct child of Suspense ([#1455](https://github.com/lynx-family/lynx-stack/pull/1455))
@@ -76,7 +82,7 @@
76
82
 
77
83
  ```ts
78
84
  function handleTap() {
79
- 'main thread';
85
+ "main thread";
80
86
  // The following check always returned false before this fix
81
87
  if (myHandleTap) {
82
88
  runOnBackground(myHandleTap)();
@@ -137,10 +143,10 @@
137
143
  Add the import to `@lynx-js/react/debug` at the first line of the entry:
138
144
 
139
145
  ```js
140
- import '@lynx-js/react/debug';
141
- import { root } from '@lynx-js/react';
146
+ import "@lynx-js/react/debug";
147
+ import { root } from "@lynx-js/react";
142
148
 
143
- import { App } from './App.jsx';
149
+ import { App } from "./App.jsx";
144
150
 
145
151
  root.render(<App />);
146
152
  ```
@@ -150,9 +156,9 @@
150
156
  For example, you can use it like this:
151
157
 
152
158
  ```jsx
153
- <list-item defer={{ unmountRecycled: true }} item-key='1'>
159
+ <list-item defer={{ unmountRecycled: true }} item-key="1">
154
160
  <WillBeUnmountIfRecycled />
155
- </list-item>;
161
+ </list-item>
156
162
  ```
157
163
 
158
164
  Now the component will be unmounted when it is recycled, which can help with performance in certain scenarios.
@@ -160,7 +166,7 @@
160
166
  - 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))
161
167
 
162
168
  ```jsx
163
- <image async-mode={undefined} />;
169
+ <image async-mode={undefined} />
164
170
  ```
165
171
 
166
172
  ## 0.111.1
@@ -206,7 +212,7 @@
206
212
  - Supports `act` in testing library. ([#1182](https://github.com/lynx-family/lynx-stack/pull/1182))
207
213
 
208
214
  ```js
209
- import { act } from '@lynx-js/react/testing-library';
215
+ import { act } from "@lynx-js/react/testing-library";
210
216
 
211
217
  act(() => {
212
218
  // ...
@@ -312,8 +318,7 @@
312
318
  * 3: Full Resolution - Batch render with async property and element tree resolution for list item subtree
313
319
  */
314
320
  experimental-batch-render-strategy={3}
315
- >
316
- </list>;
321
+ ></list>
317
322
  ```
318
323
 
319
324
  - rename @lynx-js/test-environment to @lynx-js/testing-environment ([#704](https://github.com/lynx-family/lynx-stack/pull/704))
@@ -431,7 +436,7 @@
431
436
  You can now use `useErrorBoundary` it in TypeScript like this:
432
437
 
433
438
  ```tsx
434
- import { useErrorBoundary } from '@lynx-js/react';
439
+ import { useErrorBoundary } from "@lynx-js/react";
435
440
  ```
436
441
 
437
442
  - Modified the format of data sent from background threads to the main thread. ([#207](https://github.com/lynx-family/lynx-stack/pull/207))
@@ -483,13 +488,13 @@
483
488
  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.
484
489
 
485
490
  ```js
486
- import { runOnBackground } from '@lynx-js/react';
491
+ import { runOnBackground } from "@lynx-js/react";
487
492
 
488
493
  const onTap = async () => {
489
- 'main thread';
494
+ "main thread";
490
495
  const text = await runOnBackground(() => {
491
- 'background only';
492
- return 'Hello, world!';
496
+ "background only";
497
+ return "Hello, world!";
493
498
  })();
494
499
  console.log(text);
495
500
  };
@@ -524,9 +529,9 @@
524
529
 
525
530
  ```ts
526
531
  // These imports will be removed from the final bundle
527
- import type { Foo } from 'xyz';
528
- import { type Bar } from 'xyz';
529
- import { xyz } from 'xyz'; // When xyz is not used
532
+ import type { Foo } from "xyz";
533
+ import { type Bar } from "xyz";
534
+ import { xyz } from "xyz"; // When xyz is not used
530
535
  ```
531
536
 
532
537
  See [TypeScript - verbatimModuleSyntax](https://www.typescriptlang.org/tsconfig/#verbatimModuleSyntax) for details.
@@ -566,7 +571,7 @@
566
571
  const f = undefined;
567
572
 
568
573
  function mts() {
569
- 'main thread';
574
+ "main thread";
570
575
  // throws in background rendering
571
576
  f && runOnBackground(f)();
572
577
  }
@@ -600,14 +605,14 @@
600
605
  - a30c83d: Add `compat.removeComponentAttrRegex`.
601
606
 
602
607
  ```js
603
- import { pluginReactLynx } from '@lynx-js/react-rsbuild-plugin';
604
- import { defineConfig } from '@lynx-js/rspeedy';
608
+ import { pluginReactLynx } from "@lynx-js/react-rsbuild-plugin";
609
+ import { defineConfig } from "@lynx-js/rspeedy";
605
610
 
606
611
  export default defineConfig({
607
612
  plugins: [
608
613
  pluginReactLynx({
609
614
  compat: {
610
- removeComponentAttrRegex: 'YOUR REGEX',
615
+ removeComponentAttrRegex: "YOUR REGEX",
611
616
  },
612
617
  }),
613
618
  ],
@@ -693,22 +698,22 @@
693
698
  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.
694
699
 
695
700
  ```tsx
696
- import { useGesture, PanGesture } from '@lynx-js/gesture-runtime';
701
+ import { useGesture, PanGesture } from "@lynx-js/gesture-runtime";
697
702
 
698
703
  function App() {
699
704
  const pan = useGesture(PanGesture);
700
705
 
701
706
  pan
702
707
  .onBegin((event, stateManager) => {
703
- 'main thread';
708
+ "main thread";
704
709
  // some logic
705
710
  })
706
711
  .onUpdate((event, stateManager) => {
707
- 'main thread';
712
+ "main thread";
708
713
  // some logic
709
714
  })
710
715
  .onEnd((event, stateManager) => {
711
- 'main thread';
716
+ "main thread";
712
717
  // some logic
713
718
  });
714
719
 
@@ -728,7 +733,7 @@
728
733
  return;
729
734
  }
730
735
 
731
- console.log('not __LEPUS__'); // This can be removed now
736
+ console.log("not __LEPUS__"); // This can be removed now
732
737
  }
733
738
  ```
734
739
 
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lynx-js/react-canary",
3
- "version": "0.112.5",
3
+ "version": "0.112.6-canary-20250901-c9059ab9",
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.12.3
6
6
 
7
7
  info build started...
8
- ready built in 0.17 s
8
+ ready built in 0.13 s
9
9
 
10
10
  File (esm) Size 
11
11
  dist/index.js 11.1 kB
@@ -324,7 +324,7 @@ options?: {EventType?: string; defaultInit?: {}},
324
324
  ) => Event
325
325
 
326
326
  export declare type CreateObject = {
327
- [K in EventType]: (
327
+ [K in EventType_2]: (
328
328
  element: Document | Element | Window | Node,
329
329
  options?: {},
330
330
  ) => Event
@@ -348,6 +348,44 @@ export declare type ElementTree = ReturnType<typeof initElementTree>;
348
348
  declare type ElementTreeGlobals = PickUnderscoreKeys<ElementTree>;
349
349
 
350
350
  export declare type EventType =
351
+ | 'focus'
352
+ | 'blur'
353
+ | 'scroll'
354
+ | 'wheel'
355
+ | 'tap'
356
+ | 'longtap'
357
+ | 'bgload'
358
+ | 'bgerror'
359
+ | 'touchstart'
360
+ | 'touchmove'
361
+ | 'touchcancel'
362
+ | 'touchend'
363
+ | 'longpress'
364
+ | 'transitionstart'
365
+ | 'transitioncancel'
366
+ | 'transitionend'
367
+ | 'animationstart'
368
+ | 'animationiteration'
369
+ | 'animationcancel'
370
+ | 'animationend'
371
+ | 'mousedown'
372
+ | 'mouseup'
373
+ | 'mousemove'
374
+ | 'mouseclick'
375
+ | 'mousedblclick'
376
+ | 'mouselongpress'
377
+ | 'keydown'
378
+ | 'keyup'
379
+ | 'layoutchange'
380
+ | 'scrolltoupper'
381
+ | 'scrolltolower'
382
+ | 'scrollend'
383
+ | 'contentsizechanged'
384
+ | 'scrolltoupperedge'
385
+ | 'scrolltoloweredge'
386
+ | 'scrolltonormalstate';
387
+
388
+ declare type EventType_2 =
351
389
  | 'copy'
352
390
  | 'cut'
353
391
  | 'paste'
@@ -571,7 +609,11 @@ event: Event,
571
609
  ) => boolean
572
610
 
573
611
  export declare type FireObject = {
574
- [K in EventType]: (
612
+ [K in EventType]: FireObject_2[EventType_2];
613
+ };
614
+
615
+ declare type FireObject_2 = {
616
+ [K in EventType_2]: (
575
617
  element: Document | Element | Window | Node,
576
618
  options?: {},
577
619
  ) => boolean
@@ -10,9 +10,56 @@
10
10
  import { queries, Queries, BoundFunction } from '@testing-library/dom';
11
11
  import { LynxElement, type ElementTree, type LynxTestingEnv } from '@lynx-js/testing-environment';
12
12
  import { act } from 'preact/test-utils';
13
+ import type { EventType, FireFunction, FireObject } from '@testing-library/dom';
13
14
  export * from '@testing-library/dom';
14
15
  export { ElementTree, LynxTestingEnv, act };
15
16
 
17
+ declare type LynxEventType =
18
+ | 'focus'
19
+ | 'blur'
20
+ | 'scroll'
21
+ | 'wheel'
22
+ | 'tap'
23
+ | 'longtap'
24
+ | 'bgload'
25
+ | 'bgerror'
26
+ | 'touchstart'
27
+ | 'touchmove'
28
+ | 'touchcancel'
29
+ | 'touchend'
30
+ | 'longpress'
31
+ | 'transitionstart'
32
+ | 'transitioncancel'
33
+ | 'transitionend'
34
+ | 'animationstart'
35
+ | 'animationiteration'
36
+ | 'animationcancel'
37
+ | 'animationend'
38
+ | 'mousedown'
39
+ | 'mouseup'
40
+ | 'mousemove'
41
+ | 'mouseclick'
42
+ | 'mousedblclick'
43
+ | 'mouselongpress'
44
+ | 'keydown'
45
+ | 'keyup'
46
+ | 'layoutchange'
47
+ | 'scrolltoupper'
48
+ | 'scrolltolower'
49
+ | 'scrollend'
50
+ | 'contentsizechanged'
51
+ | 'scrolltoupperedge'
52
+ | 'scrolltoloweredge'
53
+ | 'scrolltonormalstate';
54
+
55
+ declare type LynxFireObject = {
56
+ [K in LynxEventType]: FireObject[EventType];
57
+ };
58
+
59
+ declare const fireEvent: FireFunction & LynxFireObject;
60
+
61
+ export { fireEvent, LynxEventType as EventType, LynxFireObject as FireObject };
62
+
16
63
  /**
17
64
  * The options for {@link render}.
18
65
  *