@lynx-js/types - npm Package Compare versions

Comparing version 3.2.1 to 3.3.0

CHANGELOG.md

 # CHANGELOG
 
+## 3.3.0
+
+### Major Changes
+
+- Update Types Version to 3.3.*
+- Add default properties for PipelineEntry.frameworkRenderingTiming
+- Add some missing typing of event props
+- Add type testing for objects & methods mounted in global
+- Add type testing to lynx react.JSX.IntrinsicElements
+- Add some missing types of built-in element `list`
+- Add some missing types of built-in element `image`
+- Add more events like `LayoutChangeEvent` into `MainThread` namespace
+
+In this commit, we add `AnimationEvent`, `TransitionEvent`, `LayoutChangeEvent`, `UIAppearanceEvent` into `MainThread` namespace.
+Now you can use like this:
+
+```
+function handleLayoutChange(e: MainThread.LayoutChangeEvent) {
+  // ...
+}
+
+<view
+  main-thread:bindlayoutchange={handleLayoutChange}
+/>
+```
+
 ## 3.2.1
@@ -4,0 +30,0 @@

package.json

 {
   "name": "@lynx-js/types",
-  "version": "3.2.1",
+  "version": "3.3.0",
   "description": "",
@@ -11,3 +11,3 @@ "keywords": ["lynx" , "types"],
   "scripts": {
-    "test": ""
+    "test": "vitest --typecheck --run & tsc --noEmit"
   },
@@ -57,4 +57,7 @@ "exports": {
   "devDependencies": {
-    "tsd": "0.30.4"
+    "@types/react": "18.3.5",
+    "typescript": "5.8.3",
+    "tsd": "0.30.4",
+    "vitest": "2.1.9"
   }
 }

types/background-thread/lynx-performance-entry.d.ts

@@ -10,4 +10,13 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 export interface FrameworkRenderingTiming {
+    vmExecuteStart?: number;
+    vmExecuteEnd?: number;
+    dataProcessorStart?: number;
+    dataProcessorEnd?: number;
+    setInitDataStart?: number;
+    setInitDataEnd?: number;
 }
 
+export interface FrameworkRenderingTimings {
+}
+
 export interface PipelineEntry extends PerformanceEntry {
@@ -28,3 +37,3 @@ identifier: string;
     paintEnd: number;
-    frameworkRenderingTiming: FrameworkRenderingTiming[keyof FrameworkRenderingTiming];
+    frameworkRenderingTiming: FrameworkRenderingTimings[keyof FrameworkRenderingTimings] & FrameworkRenderingTiming;
 }
@@ -31,0 +40,0 @@

types/background-thread/lynx.d.ts

@@ -92,6 +92,2 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 
-  // cancelAnimationFrame(animationId: number): void;
-
-  // requestAnimationFrame(callback: () => void): number;
-
   cancelResourcePrefetch(data: ResourcePrefetchData, callback: (res: ResourcePrefetchResult) => void): void;
@@ -98,0 +94,0 @@

types/common/csstype.d.ts

@@ -44,3 +44,5 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
     transformOrigin?: 'left' | 'right' | 'top' | 'bottom' | 'center' | (string & {});
+    linearDirection?: 'column' | 'row' | 'column-reverse' | 'row-reverse';
     linearOrientation?: 'horizontal' | 'vertical' | 'horizontal-reverse' | 'vertical-reverse';
+    linearWeight?: number;
     linearGravity?: 'none' | 'top' | 'bottom' | 'left' | 'right' | 'center-vertical' | 'center-horizontal' | 'space-between' | 'start' | 'end' | 'center';
@@ -47,0 +49,0 @@ linearLayoutGravity?:

types/common/element/element.d.ts

@@ -9,3 +9,3 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 import { FilterImageProps } from './filter-image';
-import { ImageProps } from './image';
+import { ImageProps, ImageUIMethods } from './image';
 import { ListItemProps, ListProps, ListRowProps, ListUIMethods } from './list';
@@ -20,7 +20,10 @@ import { PageProps } from './page';
   'scroll-view': ScrollViewUIMethods;
+  'image': ImageUIMethods;
 }
 
+type LynxComponentProps = ComponentProps;
+
 // add also to global.JSX.IntrinsicElements
 export interface IntrinsicElements {
-  'component': ComponentProps;
+  'component': LynxComponentProps;
   'filter-image': FilterImageProps;
@@ -45,3 +48,3 @@ 'image': ImageProps;
     interface IntrinsicElements {
-      'component': ComponentProps;
+      'component': LynxComponentProps;
       'filter-image': FilterImageProps;
@@ -48,0 +51,0 @@ 'image': ImageProps;

types/common/element/image.d.ts

@@ -5,3 +5,3 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 
-import { BaseEvent, ImageErrorEvent, ImageLoadEvent } from '../events';
+import { BaseEvent, BaseMethod, ImageErrorEvent, ImageLoadEvent } from '../events';
 import { StandardProps } from '../props';
@@ -96,2 +96,42 @@
   /**
+   * When set to true and the <image> element has no width or height,
+   * the size of the <image> will be automatically adjusted
+   * to match the image's original dimensions after the image is successfully loaded,
+   * ensuring that the aspect ratio is maintained.
+   * @defaultValue false
+   * @since 2.6
+   */
+  'auto-size'?: boolean;
+
+  /**
+   * When set to true, the <image> will only clear the previously displayed image resource after a new image has successfully loaded.
+   * The default behavior is to clear the image resource before starting a new load.
+   * This can resolve flickering issues when the image src is switched and reloaded. It is not recommended to enable this in scenarios where there is node reuse in views like lists.
+   * @defaultValue false
+   * @since 2.7
+   */
+  'defer-src-invalidation'?: boolean;
+
+  /**
+   * Specifies whether the animated image should start playing automatically once it is loaded.
+   * @defaultValue true
+   * @since 2.11
+   */
+  'autoplay'?: boolean;
+
+  /**
+   * Changes the color of all non-transparent pixels to the tint-color specified. The value is a <color>.
+   * @defaultValue ""
+   * @since 2.12
+   */
+  'tint-color'?: string;
+
+  /**
+   * Support outputting image monitoring information in bindload
+   * @defaultValue false
+   * @since 2.12
+   */
+  'extra-load-info'?: boolean;
+
+  /**
    * Disables unexpected iOS built-in animations
@@ -104,2 +144,8 @@ * @defaultValue true
   /**
+   * Add custom parameters to image
+   * @since 2.17
+   */
+  'additional-custom-info'?: { [key: string]: string };
+
+  /**
    * Image load success event
@@ -117,6 +163,18 @@ * @since 0.2
   /**
-   * Add custom parameters to image
-   * @since 2.17
+   * The animation will call back when it starts playing.
+   * @since 2.11
    */
-  'additional-custom-info'?: { [key: string]: string };
+  bindstartplay?: (e: BaseEvent) => void;
+
+  /**
+   * Call back after one loop time of the animation is played.
+   * @since 2.11
+   */
+  bindcurrentloopcomplete?: (e: BaseEvent) => void;
+
+  /**
+   * It will be called after the animation has been played for all loop-count times. If the loop-count is not set, it will not be called back.
+   * @since 2.11
+   */
+  bindfinalloopcomplete?: (e: BaseEvent) => void;
 }
@@ -126,1 +184,43 @@
 export type ErrorEvent = BaseEvent<'error', ImageErrorEvent>;
+
+/**
+ * Restart the animation playback method controlled by the front end, and the animation playback progress and loop count will be reset.
+ * @Android
+ * @iOS
+ * @deprecated Deprecated. Some scenarios may not call back the call result. It is recommended to use resumeAnimation instead.
+ */
+export interface ImageStartAnimMethod extends BaseMethod {
+  method: 'startAnimate';
+}
+
+/**
+ * Resumes the animation, without resetting the loop-count.
+ * @Android
+ * @iOS
+ * @since 2.11
+ */
+export interface ImageResumeAnimMethod extends BaseMethod {
+  method: 'resumeAnimation';
+}
+
+/**
+ * Pauses the animation, without resetting the loop-count.
+ * @Android
+ * @iOS
+ * @since 2.11
+ */
+export interface ImagePauseAnimMethod extends BaseMethod {
+  method: 'pauseAnimation';
+}
+
+/**
+ * Stops the animation, and it will reset the loop-count.
+ * @Android
+ * @iOS
+ * @since 2.11
+ */
+export interface ImageStopAnimMethod extends BaseMethod {
+  method: 'stopAnimation';
+}
+
+export type ImageUIMethods = ImageStartAnimMethod | ImageResumeAnimMethod | ImagePauseAnimMethod | ImageStopAnimMethod;

types/common/element/list.d.ts

@@ -84,2 +84,8 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
   eventSource: ListEventSource;
+  /**
+   * attached cells
+   * @iOS
+   * @Android
+   */
+  attachedCells: ListAttachedCell[];
 }
@@ -86,0 +92,0 @@

types/common/events.d.ts

@@ -149,3 +149,3 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 
-export interface AnimationEvent extends BaseAnimationEvent<Target | MainThreadElement> {}
+export interface AnimationEvent extends BaseAnimationEvent<Target> {}
 
@@ -174,5 +174,5 @@ export interface BaseTransitionEvent<T> extends BaseEventOrig<{}, T> {
 }
-export interface TransitionEvent extends BaseTransitionEvent<Target | MainThreadElement> {}
+export interface TransitionEvent extends BaseTransitionEvent<Target> {}
 
-export interface ImageLoadEvent {
+export interface BaseImageLoadEvent<T> extends BaseEventOrig<{}, T> {
   detail: {
@@ -184,4 +184,11 @@ width: number;
 
-export interface ImageErrorEvent {
+export interface ImageLoadEvent extends BaseImageLoadEvent<Target> {
   detail: {
+    width: number;
+    height: number;
+  };
+}
+
+export interface BaseImageErrorEvent<T> extends BaseEventOrig<{}, T> {
+  detail: {
     errMsg: string;
@@ -193,2 +200,10 @@ error_code: number;
 
+export interface ImageErrorEvent extends BaseImageErrorEvent<Target> {
+  detail: {
+    errMsg: string;
+    error_code: number;
+    lynx_categorized_code: number;
+  };
+}
+
 export interface TextLineInfo {
@@ -317,3 +332,3 @@ start: number;
 
-export interface LynxEvent<Target> {
+export interface LynxEvent<T> {
   /**
@@ -323,3 +338,3 @@ * Listening for background image loading success.
    */
-  BGLoad?: EventHandler<ImageLoadEvent>;
+  BGLoad?: EventHandler<BaseImageLoadEvent<T>>;
 
@@ -330,3 +345,3 @@ /**
    */
-  BGError?: EventHandler<ImageErrorEvent>;
+  BGError?: EventHandler<BaseImageErrorEvent<T>>;
 
@@ -338,78 +353,78 @@ // NodeAppear?: EventHandler<ReactLynx.AppearanceEvent>;
   /** Finger touch action begins. */
-  TouchStart?: EventHandler<BaseTouchEvent<Target>>;
+  TouchStart?: EventHandler<BaseTouchEvent<T>>;
 
   /** Moving after touching with fingers. */
-  TouchMove?: EventHandler<BaseTouchEvent<Target>>;
+  TouchMove?: EventHandler<BaseTouchEvent<T>>;
 
   /** Finger touch actions are interrupted by incoming call reminders and pop-up windows. */
-  TouchCancel?: EventHandler<BaseTouchEvent<Target>>;
+  TouchCancel?: EventHandler<BaseTouchEvent<T>>;
 
   /** Finger touch action ends. */
-  TouchEnd?: EventHandler<BaseTouchEvent<Target>>;
+  TouchEnd?: EventHandler<BaseTouchEvent<T>>;
 
   /** After touching the finger, if it leaves after more than 350ms and the event callback function is specified and triggered, the tap event will not be triggered. */
-  LongPress?: EventHandler<BaseCommonEvent<Target>>;
+  LongPress?: EventHandler<BaseCommonEvent<T>>;
 
   /** It will trigger during a transition animation start. */
-  TransitionStart?: EventHandler<BaseTransitionEvent<Target>>;
+  TransitionStart?: EventHandler<BaseTransitionEvent<T>>;
 
   /** It will trigger when a transition animation is cancelled. */
-  TransitionCancel?: EventHandler<BaseTransitionEvent<Target>>;
+  TransitionCancel?: EventHandler<BaseTransitionEvent<T>>;
 
   /** It will trigger after the transition or createAnimation animation is finished. */
-  TransitionEnd?: EventHandler<BaseTransitionEvent<Target>>;
+  TransitionEnd?: EventHandler<BaseTransitionEvent<T>>;
 
   /** It will trigger at the beginning of an animation. */
-  AnimationStart?: EventHandler<BaseAnimationEvent<Target>>;
+  AnimationStart?: EventHandler<BaseAnimationEvent<T>>;
 
   /** It will trigger during an animation iteration. */
-  AnimationIteration?: EventHandler<BaseAnimationEvent<Target>>;
+  AnimationIteration?: EventHandler<BaseAnimationEvent<T>>;
 
   /** It will trigger when an animation is cancelled. */
-  AnimationCancel?: EventHandler<BaseAnimationEvent<Target>>;
+  AnimationCancel?: EventHandler<BaseAnimationEvent<T>>;
 
   /** It will trigger upon completion of an animation. */
-  AnimationEnd?: EventHandler<BaseAnimationEvent<Target>>;
+  AnimationEnd?: EventHandler<BaseAnimationEvent<T>>;
 
   /** Mouse Clicked. */
-  MouseDown?: EventHandler<BaseMouseEvent<Target>>;
+  MouseDown?: EventHandler<BaseMouseEvent<T>>;
 
   /** Mouse released. */
-  MouseUp?: EventHandler<BaseMouseEvent<Target>>;
+  MouseUp?: EventHandler<BaseMouseEvent<T>>;
 
   /** Mouse movement. */
-  MouseMove?: EventHandler<BaseMouseEvent<Target>>;
+  MouseMove?: EventHandler<BaseMouseEvent<T>>;
 
   /** Mouse click. */
-  MouseClick?: EventHandler<BaseMouseEvent<Target>>;
+  MouseClick?: EventHandler<BaseMouseEvent<T>>;
 
   /** Double-click the mouse.  */
-  MouseDblClick?: EventHandler<BaseMouseEvent<Target>>;
+  MouseDblClick?: EventHandler<BaseMouseEvent<T>>;
 
   /** Long press on the mouse. */
-  MouseLongPress?: EventHandler<BaseMouseEvent<Target>>;
+  MouseLongPress?: EventHandler<BaseMouseEvent<T>>;
 
   /** Mouse (or touchpad) scrolling. */
-  Wheel?: EventHandler<BaseWheelEvent<Target>>;
+  Wheel?: EventHandler<BaseWheelEvent<T>>;
 
   /** Keyboard (or remote control) button pressed. */
-  KeyDown?: EventHandler<BaseKeyEvent<Target>>;
+  KeyDown?: EventHandler<BaseKeyEvent<T>>;
 
   /** Keyboard (or remote control) key released. */
-  KeyUp?: EventHandler<BaseKeyEvent<Target>>;
+  KeyUp?: EventHandler<BaseKeyEvent<T>>;
 
   /** Element gets focus. */
-  Focus?: EventHandler<BaseCommonEvent<Target>>;
+  Focus?: EventHandler<BaseCommonEvent<T>>;
 
   /** Element loses focus. */
-  Blur?: EventHandler<BaseCommonEvent<Target>>;
+  Blur?: EventHandler<BaseCommonEvent<T>>;
 
   /** layout info Change event */
-  LayoutChange?: LayoutChangeEvent;
+  LayoutChange?: EventHandler<LayoutChangeDetailEvent<T>>;
 
   /** UI appear event */
-  UIAppear?: UIAppearanceEvent;
+  UIAppear?: EventHandler<UIAppearanceDetailEvent<T>>;
 
   /** UI disappear event */
-  UIDisappear?: UIAppearanceEvent;
+  UIDisappear?: EventHandler<UIAppearanceDetailEvent<T>>;
   /**
@@ -427,24 +442,23 @@ * The text layout event is triggered when the text layout changes.
    */
-  AccessibilityAction?: EventHandler<AccessibilityActionDetailEvent<Target>>;
+  AccessibilityAction?: EventHandler<AccessibilityActionDetailEvent<T>>;
 }
 
-export type LayoutChangeEvent = EventHandler<LayoutChangeDetailEvent<Target>>;
+export interface LayoutChangeEvent extends LayoutChangeDetailEvent<Target> {}
+export interface UIAppearanceEvent extends UIAppearanceDetailEvent<Target> {}
 
-export type UIAppearanceEvent = EventHandler<UIAppearanceDetailEvent<Target>>;
-
 /**
  * This type is different with LynxEvent that they only have `bind` and `catch` event. But not `on` Event.
  */
-export interface LynxBindCatchEvent<Target = any> {
+export interface LynxBindCatchEvent<T = any> {
   /** Immediately lift your finger after touching. */
-  Tap?: EventHandler<BaseTouchEvent<Target>>;
+  Tap?: EventHandler<BaseTouchEvent<T>>;
 
   /** After touching the finger, leave after more than 350ms (it is recommended to use the longpress event instead). */
-  LongTap?: EventHandler<BaseTouchEvent<Target>>;
+  LongTap?: EventHandler<BaseTouchEvent<T>>;
 }
 
-export type LynxEventPropsBase<Target> = {
-  [K in keyof LynxEvent<Target> as Lowercase<`bind${K}` | `catch${K}` | `capture-bind${K}` | `capture-catch${K}` | `global-bind${K}`>]: LynxEvent<Target>[K];
+export type LynxEventPropsBase<T> = {
+  [K in keyof LynxEvent<T> as Lowercase<`bind${K}` | `catch${K}` | `capture-bind${K}` | `capture-catch${K}` | `global-bind${K}`>]: LynxEvent<T>[K];
 } & {
-  [K in keyof LynxBindCatchEvent<Target> as Lowercase<`bind${K}` | `catch${K}` | `capture-bind${K}` | `capture-catch${K}` | `global-bind${K}`>]: LynxBindCatchEvent<Target>[K];
+  [K in keyof LynxBindCatchEvent<T> as Lowercase<`bind${K}` | `catch${K}` | `capture-bind${K}` | `capture-catch${K}` | `global-bind${K}`>]: LynxBindCatchEvent<T>[K];
 };
@@ -451,0 +465,0 @@

types/common/props.d.ts

@@ -124,2 +124,24 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
   'ios-background-shape-layer'?: boolean;
+  'exposure-id'?: string;
+  'exposure-scene'?: string;
+  'exposure-screen-margin-top'?: string;
+  'exposure-screen-margin-right'?: string;
+  'exposure-screen-margin-bottom'?: string;
+  'exposure-screen-margin-left'?: string;
+  'exposure-ui-margin-top'?: string;
+  'exposure-ui-margin-right'?: string;
+  'exposure-ui-margin-bottom'?: string;
+  'exposure-ui-margin-left'?: string;
+  'exposure-area'?: string;
+  'enable-exposure-ui-margin'?: boolean;
+  'user-interaction-enabled'?: boolean;
+  'native-interaction-enabled'?: boolean;
+  'block-native-event'?: boolean;
+  'block-native-event-areas'?: number[][];
+  'consume-slide-event'?: number[][];
+  'event-through'?: boolean;
+  'enable-touch-pseudo-propagation'?: boolean;
+  'hit-slop'?: object | string;
+  'ignore-focus'?: boolean;
+  'ios-enable-simultaneous-touch'?: boolean;
 }
@@ -126,0 +148,0 @@

types/main-thread/events.d.ts

@@ -5,3 +5,3 @@ // Copyright 2024 The Lynx Authors. All rights reserved.
 
-import { LynxEventPropsBase, BaseTouchEvent, BaseMouseEvent, BaseWheelEvent, BaseKeyEvent } from '../common/events';
+import { LynxEventPropsBase, BaseTouchEvent, BaseMouseEvent, BaseWheelEvent, BaseKeyEvent, BaseAnimationEvent, BaseTransitionEvent, LayoutChangeDetailEvent, UIAppearanceDetailEvent  } from '../common/events';
 import { Element } from './element';
@@ -14,2 +14,9 @@
 export interface KeyEvent extends BaseKeyEvent<Element> {}
+
+export interface AnimationEvent extends BaseAnimationEvent<Element> {}
+export interface TransitionEvent extends BaseTransitionEvent<Element> {}
+
+export interface LayoutChangeEvent extends LayoutChangeDetailEvent<Element> {}
+export interface UIAppearanceEvent extends UIAppearanceDetailEvent<Element> {}
+
 type LynxWorkletEventPropsImpl = {
@@ -20,4 +27,4 @@ [K in keyof LynxEventPropsBase<Element> as Lowercase<`main-thread:${K}`>]: LynxEventPropsBase<Element>[K];
 
-declare module '../common/props.d.ts' {
+declare module '../common/props' {
   interface StandardProps extends LynxWorkletEventProps {}
-}
+}

Fixed alerts

No tests

Quality

Package does not have any tests. This is a strong signal of a poorly maintained or low quality package.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

137926

4.32%

Lines of code

3603

4.07%

Number of low quality alerts

1

-50%

Worsened metrics

Dev dependency count

4

300%

No dependency changes