@lynx-js/web-mainthread-apis 0.11.0 → 0.12.0

package/CHANGELOG.md

@@ -1,5 +1,28 @@
 # @lynx-js/web-mainthread-apis
 
+## 0.12.0
+
+### Patch Changes
+
+- feat: fully support MTS ([#569](https://github.com/lynx-family/lynx-stack/pull/569))
+
+  Now use support the following usage
+
+  - mainthread event
+  - mainthread ref
+  - runOnMainThread/runOnBackground
+  - ref.current.xx
+
+- feat: support mts event with target methods ([#564](https://github.com/lynx-family/lynx-stack/pull/564))
+
+  After this commit, developers are allowed to invoke `event.target.setStyleProperty` in mts handler
+
+- fix: crash on removing a id attribute ([#582](https://github.com/lynx-family/lynx-stack/pull/582))
+
+- Updated dependencies [[`f1ca29b`](https://github.com/lynx-family/lynx-stack/commit/f1ca29bd766377dd46583f15e1e75bca447699cd), [`7edf478`](https://github.com/lynx-family/lynx-stack/commit/7edf478410cb57eeedc18aac6f5d3950b16c7fa8)]:
+  - @lynx-js/web-constants@0.12.0
+  - @lynx-js/web-style-transformer@0.3.0
+
 ## 0.11.0
 
 ### Patch Changes

package/dist/MainThreadLynx.d.ts

@@ -1,6 +1,6 @@
 import { type MainThreadConfig, MainThreadRuntime } from './MainThreadRuntime.js';
 export declare function createMainThreadLynx(config: MainThreadConfig, lepusRuntime: MainThreadRuntime): {
-    getJSContext(): EventTarget;
+    getJSContext(): import("@lynx-js/web-constants").LynxContextEventTarget;
     requestAnimationFrame(cb: FrameRequestCallback): number;
     cancelAnimationFrame(handler: number): void;
     __globalProps: unknown;

package/dist/MainThreadLynx.js

@@ -2,8 +2,7 @@ import { MainThreadRuntime, } from './MainThreadRuntime.js';
 export function createMainThreadLynx(config, lepusRuntime) {
     return {
         getJSContext() {
-            // TODO: implement this
-            return new EventTarget();
+            return config.jsContext;
         },
         requestAnimationFrame(cb) {
             return requestAnimationFrame(cb);

package/dist/MainThreadRuntime.d.ts

@@ -1,4 +1,4 @@
-import { type LynxTemplate, type PageConfig, type ProcessDataCallback, type StyleInfo, type FlushElementTreeOptions, type Cloneable, type BrowserConfig, type publishEventEndpoint, type publicComponentEventEndpoint, type reportErrorEndpoint, type RpcCallType, type postExposureEndpoint } from '@lynx-js/web-constants';
+import { type LynxTemplate, type PageConfig, type ProcessDataCallback, type StyleInfo, type FlushElementTreeOptions, type Cloneable, type BrowserConfig, type publishEventEndpoint, type publicComponentEventEndpoint, type reportErrorEndpoint, type RpcCallType, type postExposureEndpoint, type LynxContextEventTarget } from '@lynx-js/web-constants';
 import { type MainThreadLynx } from './MainThreadLynx.js';
 import type { LynxRuntimeInfo } from './elementAPI/ElementThreadElement.js';
 export interface MainThreadRuntimeCallbacks {
@@ -21,6 +21,7 @@ export interface MainThreadConfig {
     browserConfig: BrowserConfig;
     tagMap: Record<string, string>;
     docu: Pick<Document, 'append' | 'createElement' | 'addEventListener'>;
+    jsContext: LynxContextEventTarget;
 }
 export declare const elementToRuntimeInfoMap: unique symbol;
 export declare const getElementByUniqueId: unique symbol;

package/dist/elementAPI/attributeAndProperty/attributeAndPropertyFunctions.d.ts

@@ -21,7 +21,7 @@ export declare function createAttributeAndPropertyFunctions(runtime: MainThreadR
     __GetTag: (element: HTMLElement) => string;
     __SetConfig: (element: HTMLElement, config: Record<string, any>) => void;
     __SetDataset: (element: HTMLElement, dataset: Record<string, any>) => void;
-    __SetID: (element: HTMLElement, id: string) => void;
+    __SetID: (element: HTMLElement, id: string | null) => void;
     __UpdateComponentID: (element: HTMLElement, componentID: string) => void;
     __UpdateListCallbacks: (element: HTMLElement, componentAtIndex: ComponentAtIndexCallback, enqueueComponent: EnqueueComponentCallback) => void;
     __GetConfig: (element: HTMLElement) => Record<string, import("@lynx-js/web-constants").Cloneable>;

package/dist/elementAPI/attributeAndProperty/attributeAndPropertyFunctions.js

@@ -57,7 +57,12 @@ export function createAttributeAndPropertyFunctions(runtime) {
         }
     }
     function __SetID(element, id) {
-        element.id = id;
+        if (typeof id === 'string') {
+            element.id = id;
+        }
+        else {
+            element.removeAttribute('id');
+        }
     }
     function __UpdateComponentID(element, componentID) {
         element.setAttribute(componentIdAttribute, componentID);

package/dist/elementAPI/event/eventFunctions.js

@@ -18,8 +18,8 @@ export function createEventFunctions(runtime) {
                 ?.handler
             : runtimeInfo.eventHandlerMap[lynxEventName]?.bind
                 ?.handler;
+        const crossThreadEvent = createCrossThreadEvent(runtime, event, lynxEventName);
         if (typeof hname === 'string') {
-            const crossThreadEvent = createCrossThreadEvent(runtime, event, lynxEventName);
             const parentComponentUniqueId = runtimeInfo.parentComponentUniqueId;
             const parentComponent = runtime[getElementByUniqueId](Number(parentComponentUniqueId));
             const componentId = parentComponent?.getAttribute(lynxTagAttribute) !== 'page'
@@ -34,7 +34,13 @@ export function createEventFunctions(runtime) {
             return true;
         }
         else if (hname) {
-            runtime.runWorklet?.(hname.value, []);
+            crossThreadEvent.target.elementRefptr =
+                event.target;
+            if (crossThreadEvent.currentTarget) {
+                crossThreadEvent.currentTarget
+                    .elementRefptr = event.currentTarget;
+            }
+            runtime.runWorklet?.(hname.value, [crossThreadEvent]);
         }
         return false;
     };

package/dist/elementAPI/style/styleFunctions.js

@@ -30,14 +30,20 @@ export function createStyleFunctions(runtime, cssInJsInfo) {
         return (element.className ?? '').split(' ').filter(e => e);
     }
     function __AddInlineStyle(element, key, value) {
-        const lynxStyleInfo = queryCSSProperty(Number(key));
+        let dashName;
+        if (typeof key === 'number') {
+            dashName = queryCSSProperty(key).dashName;
+        }
+        else {
+            dashName = key;
+        }
         const valueStr = typeof value === 'number' ? value.toString() : value;
         if (!valueStr) { // null or undefined
-            element.style.removeProperty(lynxStyleInfo.dashName);
+            element.style.removeProperty(dashName);
         }
         else {
             const { transformedStyle } = transfromParsedStyles([[
-                    lynxStyleInfo.dashName,
+                    dashName,
                     valueStr,
                 ]]);
             for (const [property, value] of transformedStyle) {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-mainthread-apis",
-  "version": "0.11.0",
+  "version": "0.12.0",
   "private": false,
   "description": "",
   "keywords": [],
@@ -25,7 +25,7 @@
   "dependencies": {
     "css-tree": "^3.1.0",
     "hyphenate-style-name": "^1.1.0",
-    "@lynx-js/web-constants": "0.11.0",
-    "@lynx-js/web-style-transformer": "0.2.3"
+    "@lynx-js/web-constants": "0.12.0",
+    "@lynx-js/web-style-transformer": "0.3.0"
   }
 }