@lynx-js/web-core 0.10.0 → 0.10.1

package/CHANGELOG.md

@@ -1,5 +1,24 @@
 # @lynx-js/web-core
 
+## 0.10.1
+
+### Patch Changes
+
+- docs: fix documents about lynx-view's properties ([#412](https://github.com/lynx-family/lynx-stack/pull/412))
+
+  Attributes should be hyphen-name: 'init-data', 'global-props'.
+
+  now all properties has corresponding attributes.
+
+- feat: onNapiModulesCall function add new param: `dispatchNapiModules`, napiModulesMap val add new param: `handleDispatch`. ([#414](https://github.com/lynx-family/lynx-stack/pull/414))
+
+  Now you can use them to actively communicate to napiModules (background thread) in onNapiModulesCall (ui thread).
+
+- Updated dependencies [[`1af3b60`](https://github.com/lynx-family/lynx-stack/commit/1af3b6052ab27f98bf0e4d1b0ec9f7d9e88e0afc)]:
+  - @lynx-js/web-constants@0.10.1
+  - @lynx-js/web-worker-runtime@0.10.1
+  - @lynx-js/web-worker-rpc@0.10.1
+
 ## 0.10.0
 
 ### Minor Changes

package/dist/apis/LynxView.d.ts

@@ -1,5 +1,5 @@
 import { type Cloneable, type NapiModulesCall, type NapiModulesMap, type NativeModulesCall, type NativeModulesMap, type UpdateDataType } from '@lynx-js/web-constants';
-export type INapiModulesCall = (name: string, data: any, moduleName: string, lynxView: LynxView) => Promise<{
+export type INapiModulesCall = (name: string, data: any, moduleName: string, lynxView: LynxView, dispatchNapiModules: (data: Cloneable) => void) => Promise<{
     data: unknown;
     transfer?: Transferable[];
 }> | {
@@ -10,17 +10,17 @@ export type INapiModulesCall = (name: string, data: any, moduleName: string, lyn
  * Based on our experiences, these elements are almost used in all lynx cards.
  */
 /**
- * @param {string} url [required] The url of the entry of your Lynx card
- * @param {Cloneable} globalProps [optional] The globalProps value of this Lynx card
- * @param {Cloneable} initData [oprional] The initial data of this Lynx card
- * @param {Record<string,string>} overrideLynxTagToHTMLTagMap [optional] use this property/attribute to override the lynx tag -> html tag map
- * @param {NativeModulesMap} nativeModulesMap [optional] use to customize NativeModules. key is module-name, value is esm url.
- * @param {NativeModulesCall} onNativeModulesCall [optional] the NativeModules value handler. Arguments will be cached before this property is assigned.
- * @param {"auto" | null} height [optional] set it to "auto" for height auto-sizing
- * @param {"auto" | null} width [optional] set it to "auto" for width auto-sizing
- * @param {NapiModulesMap} napiModulesMap [optional] the napiModule which is called in lynx-core. key is module-name, value is esm url.
- * @param {INapiModulesCall} onNapiModulesCall [optional] the NapiModule value handler.
- * @param {"false" | "true" | null} injectHeadLinks [optional] @default true set it to "false" to disable injecting the <link href="" ref="stylesheet"> styles into shadowroot
+ * @property {string} url [required] (attribute: "url") The url of the entry of your Lynx card
+ * @property {Cloneable} globalProps [optional] (attribute: "global-props") The globalProps value of this Lynx card
+ * @property {Cloneable} initData [oprional] (attribute: "init-data") The initial data of this Lynx card
+ * @property {Record<string,string>} overrideLynxTagToHTMLTagMap [optional] use this property/attribute to override the lynx tag -> html tag map
+ * @property {NativeModulesMap} nativeModulesMap [optional] use to customize NativeModules. key is module-name, value is esm url.
+ * @property {NativeModulesCall} onNativeModulesCall [optional] the NativeModules value handler. Arguments will be cached before this property is assigned.
+ * @property {"auto" | null} height [optional] (attribute: "height") set it to "auto" for height auto-sizing
+ * @property {"auto" | null} width [optional] (attribute: "width") set it to "auto" for width auto-sizing
+ * @property {NapiModulesMap} napiModulesMap [optional] the napiModule which is called in lynx-core. key is module-name, value is esm url.
+ * @property {INapiModulesCall} onNapiModulesCall [optional] the NapiModule value handler.
+ * @property {"false" | "true" | null} injectHeadLinks [optional] @default true set it to "false" to disable injecting the <link href="" ref="stylesheet"> styles into shadowroot
  *
  * @event error lynx card fired an error
  *
@@ -30,7 +30,7 @@ export type INapiModulesCall = (name: string, data: any, moduleName: string, lyn
  * Note that you should declarae the size of lynx-view
  *
  * ```html
- * <lynx-view url="https://path/to/main-thread.js" rawData="{}" globalProps="{}" style="height:300px;width:300px">
+ * <lynx-view url="https://path/to/main-thread.js" raw-data="{}" global-props="{}" style="height:300px;width:300px">
  * </lynx-view>
  * ```
  *
@@ -45,7 +45,6 @@ export declare class LynxView extends HTMLElement {
     static lynxViewCount: number;
     static tag: "lynx-view";
     private static observedAttributeAsProperties;
-    private static attributeCamelCaseMap;
     /**
      * @private
      */

package/dist/apis/LynxView.js

@@ -8,17 +8,17 @@ import { inShadowRootStyles } from './inShadowRootStyles.js';
  * Based on our experiences, these elements are almost used in all lynx cards.
  */
 /**
- * @param {string} url [required] The url of the entry of your Lynx card
- * @param {Cloneable} globalProps [optional] The globalProps value of this Lynx card
- * @param {Cloneable} initData [oprional] The initial data of this Lynx card
- * @param {Record<string,string>} overrideLynxTagToHTMLTagMap [optional] use this property/attribute to override the lynx tag -> html tag map
- * @param {NativeModulesMap} nativeModulesMap [optional] use to customize NativeModules. key is module-name, value is esm url.
- * @param {NativeModulesCall} onNativeModulesCall [optional] the NativeModules value handler. Arguments will be cached before this property is assigned.
- * @param {"auto" | null} height [optional] set it to "auto" for height auto-sizing
- * @param {"auto" | null} width [optional] set it to "auto" for width auto-sizing
- * @param {NapiModulesMap} napiModulesMap [optional] the napiModule which is called in lynx-core. key is module-name, value is esm url.
- * @param {INapiModulesCall} onNapiModulesCall [optional] the NapiModule value handler.
- * @param {"false" | "true" | null} injectHeadLinks [optional] @default true set it to "false" to disable injecting the <link href="" ref="stylesheet"> styles into shadowroot
+ * @property {string} url [required] (attribute: "url") The url of the entry of your Lynx card
+ * @property {Cloneable} globalProps [optional] (attribute: "global-props") The globalProps value of this Lynx card
+ * @property {Cloneable} initData [oprional] (attribute: "init-data") The initial data of this Lynx card
+ * @property {Record<string,string>} overrideLynxTagToHTMLTagMap [optional] use this property/attribute to override the lynx tag -> html tag map
+ * @property {NativeModulesMap} nativeModulesMap [optional] use to customize NativeModules. key is module-name, value is esm url.
+ * @property {NativeModulesCall} onNativeModulesCall [optional] the NativeModules value handler. Arguments will be cached before this property is assigned.
+ * @property {"auto" | null} height [optional] (attribute: "height") set it to "auto" for height auto-sizing
+ * @property {"auto" | null} width [optional] (attribute: "width") set it to "auto" for width auto-sizing
+ * @property {NapiModulesMap} napiModulesMap [optional] the napiModule which is called in lynx-core. key is module-name, value is esm url.
+ * @property {INapiModulesCall} onNapiModulesCall [optional] the NapiModule value handler.
+ * @property {"false" | "true" | null} injectHeadLinks [optional] @default true set it to "false" to disable injecting the <link href="" ref="stylesheet"> styles into shadowroot
  *
  * @event error lynx card fired an error
  *
@@ -28,7 +28,7 @@ import { inShadowRootStyles } from './inShadowRootStyles.js';
  * Note that you should declarae the size of lynx-view
  *
  * ```html
- * <lynx-view url="https://path/to/main-thread.js" rawData="{}" globalProps="{}" style="height:300px;width:300px">
+ * <lynx-view url="https://path/to/main-thread.js" raw-data="{}" global-props="{}" style="height:300px;width:300px">
  * </lynx-view>
  * ```
  *
@@ -43,12 +43,9 @@ export class LynxView extends HTMLElement {
     static tag = 'lynx-view';
     static observedAttributeAsProperties = [
         'url',
-        'globalProps',
-        'initData',
-        'overrideLynxTagToHTMLTagMap',
-        'nativeModulesMap',
+        'global-props',
+        'init-data',
     ];
-    static attributeCamelCaseMap = Object.fromEntries(this.observedAttributeAsProperties.map((nm) => [nm.toLocaleLowerCase(), nm]));
     /**
      * @private
      */
@@ -167,8 +164,8 @@ export class LynxView extends HTMLElement {
         return this.#onNapiModulesCall;
     }
     set onNapiModulesCall(handler) {
-        this.#onNapiModulesCall = (name, data, moduleName) => {
-            return handler(name, data, moduleName, this);
+        this.#onNapiModulesCall = (name, data, moduleName, dispatchNapiModules) => {
+            return handler(name, data, moduleName, this, dispatchNapiModules);
         };
     }
     /**
@@ -214,10 +211,16 @@ export class LynxView extends HTMLElement {
      */
     attributeChangedCallback(name, oldValue, newValue) {
         if (oldValue !== newValue) {
-            name = LynxView.attributeCamelCaseMap[name] ?? name;
-            if (name in this) {
-                // @ts-expect-error
-                this[name] = newValue;
+            switch (name) {
+                case 'url':
+                    this.#url = newValue;
+                    break;
+                case 'global-props':
+                    this.#globalProps = JSON.parse(newValue);
+                    break;
+                case 'init-data':
+                    this.#initData = JSON.parse(newValue);
+                    break;
             }
         }
     }

package/dist/uiThread/crossThreadHandlers/registerNapiModulesCallHandler.js

@@ -1,5 +1,8 @@
-import { napiModulesCallEndpoint, } from '@lynx-js/web-constants';
+import { dispatchNapiModuleEndpoint, napiModulesCallEndpoint, } from '@lynx-js/web-constants';
 export function registerNapiModulesCallHandler(rpc, napiModulesCall) {
-    rpc.registerHandler(napiModulesCallEndpoint, napiModulesCall);
+    const dispatchNapiModules = rpc.createCall(dispatchNapiModuleEndpoint);
+    rpc.registerHandler(napiModulesCallEndpoint, (name, data, moduleName) => {
+        return napiModulesCall(name, data, moduleName, dispatchNapiModules);
+    });
 }
 //# sourceMappingURL=registerNapiModulesCallHandler.js.map

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lynx-js/web-core",
-  "version": "0.10.0",
+  "version": "0.10.1",
   "private": false,
   "description": "",
   "keywords": [],
@@ -25,13 +25,13 @@
   ],
   "dependencies": {
     "@lynx-js/offscreen-document": "0.0.0",
-    "@lynx-js/web-constants": "0.10.0",
-    "@lynx-js/web-worker-rpc": "0.10.0",
-    "@lynx-js/web-worker-runtime": "0.10.0"
+    "@lynx-js/web-constants": "0.10.1",
+    "@lynx-js/web-worker-rpc": "0.10.1",
+    "@lynx-js/web-worker-runtime": "0.10.1"
   },
   "devDependencies": {
     "@lynx-js/lynx-core": "0.1.0",
-    "@lynx-js/web-elements": "0.5.2"
+    "@lynx-js/web-elements": "0.5.3"
   },
   "peerDependencies": {
     "@lynx-js/lynx-core": "0.1.0",