@lynx-js/web-mainthread-apis 0.13.4 → 0.13.5
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 +31 -0
- package/dist/createMainThreadGlobalThis.d.ts +24 -0
- package/dist/createMainThreadGlobalThis.js +450 -0
- package/dist/createMainThreadLynx.d.ts +3 -0
- package/dist/{MainThreadLynx.js → createMainThreadLynx.js} +2 -5
- package/dist/crossThreadHandlers/registerCallLepusMethodHandler.d.ts +2 -3
- package/dist/crossThreadHandlers/registerCallLepusMethodHandler.js +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -1
- package/dist/prepareMainThreadAPIs.d.ts +2 -3
- package/dist/prepareMainThreadAPIs.js +17 -14
- package/dist/pureElementPAPIs.d.ts +32 -0
- package/dist/pureElementPAPIs.js +140 -0
- package/dist/utils/createCrossThreadEvent.d.ts +2 -3
- package/dist/utils/createCrossThreadEvent.js +23 -12
- package/dist/utils/createExposureService.d.ts +2 -2
- package/dist/utils/createExposureService.js +4 -5
- package/package.json +2 -2
- package/dist/MainThreadLynx.d.ts +0 -10
- package/dist/MainThreadRuntime.d.ts +0 -92
- package/dist/MainThreadRuntime.js +0 -186
- package/dist/elementAPI/ElementThreadElement.d.ts +0 -27
- package/dist/elementAPI/ElementThreadElement.js +0 -2
- package/dist/elementAPI/attributeAndProperty/attributeAndPropertyFunctions.d.ts +0 -30
- package/dist/elementAPI/attributeAndProperty/attributeAndPropertyFunctions.js +0 -127
- package/dist/elementAPI/domTree/domTreeFunctions.d.ts +0 -11
- package/dist/elementAPI/domTree/domTreeFunctions.js +0 -49
- package/dist/elementAPI/elementCreating/elementCreatingFunctions.d.ts +0 -15
- package/dist/elementAPI/elementCreating/elementCreatingFunctions.js +0 -123
- package/dist/elementAPI/event/eventFunctions.d.ts +0 -25
- package/dist/elementAPI/event/eventFunctions.js +0 -142
- package/dist/elementAPI/style/styleFunctions.d.ts +0 -10
- package/dist/elementAPI/style/styleFunctions.js +0 -89
- /package/dist/{elementAPI/style → style}/cssPropertyMap.d.ts +0 -0
- /package/dist/{elementAPI/style → style}/cssPropertyMap.js +0 -0
- /package/dist/{elementAPI/style → style}/transformInlineStyle.d.ts +0 -0
- /package/dist/{elementAPI/style → style}/transformInlineStyle.js +0 -0
|
@@ -0,0 +1,32 @@
|
|
|
1
|
+
import { type AddClassPAPI, type AddConfigPAPI, type AddDatasetPAPI, type AddInlineStylePAPI, type AppendElementPAPI, type ElementIsEqualPAPI, type FirstElementPAPI, type GetAttributesPAPI, type GetChildrenPAPI, type GetClassesPAPI, type GetComponentIdPAPI, type GetDataByKeyPAPI, type GetDatasetPAPI, type GetElementConfigPAPI, type GetElementUniqueIDPAPI, type GetIDPAPI, type GetParentPAPI, type GetTagPAPI, type InsertElementBeforePAPI, type LastElementPAPI, type NextElementPAPI, type RemoveElementPAPI, type ReplaceElementPAPI, type ReplaceElementsPAPI, type SetClassesPAPI, type SetConfigPAPI, type SetCSSIdPAPI, type SetDatasetPAPI, type SetIDPAPI, type SetInlineStylesPAPI, type UpdateComponentIDPAPI } from '@lynx-js/web-constants';
|
|
2
|
+
export declare const __AppendElement: AppendElementPAPI;
|
|
3
|
+
export declare const __ElementIsEqual: ElementIsEqualPAPI;
|
|
4
|
+
export declare const __FirstElement: FirstElementPAPI;
|
|
5
|
+
export declare const __GetChildren: GetChildrenPAPI;
|
|
6
|
+
export declare const __GetParent: GetParentPAPI;
|
|
7
|
+
export declare const __InsertElementBefore: InsertElementBeforePAPI;
|
|
8
|
+
export declare const __LastElement: LastElementPAPI;
|
|
9
|
+
export declare const __NextElement: NextElementPAPI;
|
|
10
|
+
export declare const __RemoveElement: RemoveElementPAPI;
|
|
11
|
+
export declare const __ReplaceElement: ReplaceElementPAPI;
|
|
12
|
+
export declare const __ReplaceElements: ReplaceElementsPAPI;
|
|
13
|
+
export declare const __AddConfig: AddConfigPAPI;
|
|
14
|
+
export declare const __AddDataset: AddDatasetPAPI;
|
|
15
|
+
export declare const __GetDataset: GetDatasetPAPI;
|
|
16
|
+
export declare const __GetDataByKey: GetDataByKeyPAPI;
|
|
17
|
+
export declare const __GetAttributes: GetAttributesPAPI;
|
|
18
|
+
export declare const __GetComponentID: GetComponentIdPAPI;
|
|
19
|
+
export declare const __GetElementConfig: GetElementConfigPAPI;
|
|
20
|
+
export declare const __GetElementUniqueID: GetElementUniqueIDPAPI;
|
|
21
|
+
export declare const __GetID: GetIDPAPI;
|
|
22
|
+
export declare const __SetID: SetIDPAPI;
|
|
23
|
+
export declare const __GetTag: GetTagPAPI;
|
|
24
|
+
export declare const __SetConfig: SetConfigPAPI;
|
|
25
|
+
export declare const __SetDataset: SetDatasetPAPI;
|
|
26
|
+
export declare const __UpdateComponentID: UpdateComponentIDPAPI;
|
|
27
|
+
export declare const __GetClasses: GetClassesPAPI;
|
|
28
|
+
export declare const __SetCSSId: SetCSSIdPAPI;
|
|
29
|
+
export declare const __SetClasses: SetClassesPAPI;
|
|
30
|
+
export declare const __AddInlineStyle: AddInlineStylePAPI;
|
|
31
|
+
export declare const __AddClass: AddClassPAPI;
|
|
32
|
+
export declare const __SetInlineStyles: SetInlineStylesPAPI;
|
|
@@ -0,0 +1,140 @@
|
|
|
1
|
+
// Copyright 2023 The Lynx Authors. All rights reserved.
|
|
2
|
+
// Licensed under the Apache License Version 2.0 that can be found in the
|
|
3
|
+
// LICENSE file in the root directory of this source tree.
|
|
4
|
+
import { componentIdAttribute, cssIdAttribute, lynxComponentConfigAttribute, lynxDatasetAttribute, lynxTagAttribute, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
|
|
5
|
+
import { queryCSSProperty } from './style/cssPropertyMap.js';
|
|
6
|
+
import { transformInlineStyleString, transformParsedStyles, } from './style/transformInlineStyle.js';
|
|
7
|
+
import hyphenateStyleName from 'hyphenate-style-name';
|
|
8
|
+
export const __AppendElement = /*#__PURE__*/ (parent, child) => parent.appendChild(child);
|
|
9
|
+
export const __ElementIsEqual = /*#__PURE__*/ (left, right) => left === right;
|
|
10
|
+
export const __FirstElement = /*#__PURE__*/ (element) => element.firstElementChild;
|
|
11
|
+
export const __GetChildren = /*#__PURE__*/ (element) => element.children;
|
|
12
|
+
export const __GetParent = /*#__PURE__*/ (element) => element.parentElement;
|
|
13
|
+
export const __InsertElementBefore = /*#__PURE__*/ (parent, child, ref) => parent.insertBefore(child, ref);
|
|
14
|
+
export const __LastElement = /*#__PURE__*/ (element) => element.lastElementChild;
|
|
15
|
+
export const __NextElement = /*#__PURE__*/ (element) => element.nextElementSibling;
|
|
16
|
+
export const __RemoveElement = /*#__PURE__*/ (parent, child) => parent.removeChild(child);
|
|
17
|
+
export const __ReplaceElement = /*#__PURE__*/ (newElement, oldElement) => oldElement.replaceWith(newElement);
|
|
18
|
+
export const __ReplaceElements = /*#__PURE__*/ (parent, newChildren, oldChildren) => {
|
|
19
|
+
newChildren = Array.isArray(newChildren) ? newChildren : [newChildren];
|
|
20
|
+
if (!oldChildren || (Array.isArray(oldChildren) && oldChildren?.length === 0)) {
|
|
21
|
+
parent.append(...newChildren);
|
|
22
|
+
}
|
|
23
|
+
else {
|
|
24
|
+
oldChildren = Array.isArray(oldChildren) ? oldChildren : [oldChildren];
|
|
25
|
+
for (let ii = 1; ii < oldChildren.length; ii++) {
|
|
26
|
+
__RemoveElement(parent, oldChildren[ii]);
|
|
27
|
+
}
|
|
28
|
+
const firstOldChildren = oldChildren[0];
|
|
29
|
+
firstOldChildren.replaceWith(...newChildren);
|
|
30
|
+
}
|
|
31
|
+
};
|
|
32
|
+
export const __AddConfig = /*#__PURE__*/ (element, type, value) => {
|
|
33
|
+
const currentComponentConfigString = element.getAttribute(lynxComponentConfigAttribute);
|
|
34
|
+
let currentComponentConfig = currentComponentConfigString
|
|
35
|
+
? JSON.parse(decodeURIComponent(currentComponentConfigString))
|
|
36
|
+
: {};
|
|
37
|
+
currentComponentConfig[type] = value;
|
|
38
|
+
element.setAttribute(lynxComponentConfigAttribute, encodeURIComponent(JSON.stringify(currentComponentConfig)));
|
|
39
|
+
};
|
|
40
|
+
export const __AddDataset = /*#__PURE__*/ (element, key, value) => {
|
|
41
|
+
const currentDataset = __GetDataset(element);
|
|
42
|
+
currentDataset[key] = value;
|
|
43
|
+
element.setAttribute(lynxDatasetAttribute, encodeURIComponent(JSON.stringify(currentDataset)));
|
|
44
|
+
value
|
|
45
|
+
? element.setAttribute('data-' + key, value.toString())
|
|
46
|
+
: element.removeAttribute('data-' + key);
|
|
47
|
+
};
|
|
48
|
+
export const __GetDataset = /*#__PURE__*/ (element) => {
|
|
49
|
+
const datasetString = element.getAttribute(lynxDatasetAttribute);
|
|
50
|
+
const currentDataset = datasetString
|
|
51
|
+
? JSON.parse(decodeURIComponent(datasetString))
|
|
52
|
+
: {};
|
|
53
|
+
return currentDataset;
|
|
54
|
+
};
|
|
55
|
+
export const __GetDataByKey = /*#__PURE__*/ (element, key) => {
|
|
56
|
+
const dataset = __GetDataset(element);
|
|
57
|
+
return dataset[key];
|
|
58
|
+
};
|
|
59
|
+
export const __GetAttributes = /*#__PURE__*/ (element) => {
|
|
60
|
+
return Object.fromEntries(element.getAttributeNames().map((attributeName) => [attributeName, element.getAttribute(attributeName)])
|
|
61
|
+
.filter(([, value]) => value));
|
|
62
|
+
};
|
|
63
|
+
export const __GetComponentID = /*#__PURE__*/ (element) => element.getAttribute(componentIdAttribute);
|
|
64
|
+
export const __GetElementConfig = /*#__PURE__*/ (element) => {
|
|
65
|
+
const currentComponentConfigString = element.getAttribute(lynxComponentConfigAttribute);
|
|
66
|
+
return currentComponentConfigString
|
|
67
|
+
? JSON.parse(decodeURIComponent(currentComponentConfigString))
|
|
68
|
+
: {};
|
|
69
|
+
};
|
|
70
|
+
export const __GetElementUniqueID = /*#__PURE__*/ (element) => (element && element.getAttribute
|
|
71
|
+
? Number(element.getAttribute(lynxUniqueIdAttribute))
|
|
72
|
+
: -1);
|
|
73
|
+
export const __GetID = /*#__PURE__*/ (element) => element.getAttribute('id');
|
|
74
|
+
export const __SetID = /*#__PURE__*/ (element, id) => id ? element.setAttribute('id', id) : element.removeAttribute('id');
|
|
75
|
+
export const __GetTag = /*#__PURE__*/ (element) => element.getAttribute(lynxTagAttribute);
|
|
76
|
+
export const __SetConfig = /*#__PURE__*/ (element, config) => {
|
|
77
|
+
element.setAttribute(lynxComponentConfigAttribute, encodeURIComponent(JSON.stringify(config)));
|
|
78
|
+
};
|
|
79
|
+
export const __SetDataset = /*#__PURE__*/ (element, dataset) => {
|
|
80
|
+
element.setAttribute(lynxDatasetAttribute, encodeURIComponent(JSON.stringify(dataset)));
|
|
81
|
+
for (const [key, value] of Object.entries(dataset)) {
|
|
82
|
+
element.setAttribute('data-' + key, value.toString());
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
export const __UpdateComponentID = /*#__PURE__*/ (element, componentID) => element.setAttribute(componentIdAttribute, componentID);
|
|
86
|
+
export const __GetClasses = /*#__PURE__*/ (element) => ((element.getAttribute('class') ?? '').split(' ').filter(e => e));
|
|
87
|
+
export const __SetCSSId = /*#__PURE__*/ (elements, cssId) => {
|
|
88
|
+
for (const element of elements) {
|
|
89
|
+
element.setAttribute(cssIdAttribute, cssId + '');
|
|
90
|
+
}
|
|
91
|
+
};
|
|
92
|
+
export const __SetClasses = /*#__PURE__*/ (element, classname) => {
|
|
93
|
+
classname
|
|
94
|
+
? element.setAttribute('class', classname)
|
|
95
|
+
: element.removeAttribute('class');
|
|
96
|
+
};
|
|
97
|
+
export const __AddInlineStyle = /*#__PURE__*/ (element, key, value) => {
|
|
98
|
+
let dashName;
|
|
99
|
+
if (typeof key === 'number') {
|
|
100
|
+
const queryResult = queryCSSProperty(key);
|
|
101
|
+
dashName = queryResult.dashName;
|
|
102
|
+
if (queryResult.isX) {
|
|
103
|
+
console.error(`[lynx-web] css property: ${dashName} is not supported.`);
|
|
104
|
+
}
|
|
105
|
+
}
|
|
106
|
+
else {
|
|
107
|
+
dashName = key;
|
|
108
|
+
}
|
|
109
|
+
const valueStr = typeof value === 'number' ? value.toString() : value;
|
|
110
|
+
if (!valueStr) { // null or undefined
|
|
111
|
+
element.style.removeProperty(dashName);
|
|
112
|
+
}
|
|
113
|
+
else {
|
|
114
|
+
const { transformedStyle } = transformParsedStyles([[
|
|
115
|
+
dashName,
|
|
116
|
+
valueStr,
|
|
117
|
+
]]);
|
|
118
|
+
for (const [property, value] of transformedStyle) {
|
|
119
|
+
element.style.setProperty(property, value);
|
|
120
|
+
}
|
|
121
|
+
}
|
|
122
|
+
};
|
|
123
|
+
export const __AddClass = /*#__PURE__*/ (element, className) => {
|
|
124
|
+
const newClassName = ((element.getAttribute('class') ?? '') + ' ' + className)
|
|
125
|
+
.trim();
|
|
126
|
+
element.setAttribute('class', newClassName);
|
|
127
|
+
};
|
|
128
|
+
export const __SetInlineStyles = /*#__PURE__*/ (element, value) => {
|
|
129
|
+
if (!value)
|
|
130
|
+
return;
|
|
131
|
+
const { transformedStyle } = typeof value === 'string'
|
|
132
|
+
? transformInlineStyleString(value)
|
|
133
|
+
: transformParsedStyles(Object.entries(value).map(([k, value]) => [
|
|
134
|
+
hyphenateStyleName(k),
|
|
135
|
+
value,
|
|
136
|
+
]));
|
|
137
|
+
const transformedStyleStr = transformedStyle.map(([property, value]) => `${property}:${value};`).join('');
|
|
138
|
+
element.setAttribute('style', transformedStyleStr);
|
|
139
|
+
};
|
|
140
|
+
//# sourceMappingURL=pureElementPAPIs.js.map
|
|
@@ -1,3 +1,2 @@
|
|
|
1
|
-
import type
|
|
2
|
-
|
|
3
|
-
export declare function createCrossThreadEvent(runtime: MainThreadRuntime, domEvent: Event, eventName: string): LynxCrossThreadEvent;
|
|
1
|
+
import { type LynxCrossThreadEvent, type MinimalRawEventObject } from '@lynx-js/web-constants';
|
|
2
|
+
export declare function createCrossThreadEvent(domEvent: MinimalRawEventObject, eventName: string): LynxCrossThreadEvent;
|
|
@@ -1,4 +1,7 @@
|
|
|
1
|
-
|
|
1
|
+
// Copyright 2023 The Lynx Authors. All rights reserved.
|
|
2
|
+
// Licensed under the Apache License Version 2.0 that can be found in the
|
|
3
|
+
// LICENSE file in the root directory of this source tree.
|
|
4
|
+
import { lynxDatasetAttribute, lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
|
|
2
5
|
function toCloneableObject(obj) {
|
|
3
6
|
const cloneableObj = {};
|
|
4
7
|
for (const key in obj) {
|
|
@@ -10,10 +13,12 @@ function toCloneableObject(obj) {
|
|
|
10
13
|
}
|
|
11
14
|
return cloneableObj;
|
|
12
15
|
}
|
|
13
|
-
export function createCrossThreadEvent(
|
|
16
|
+
export function createCrossThreadEvent(domEvent, eventName) {
|
|
14
17
|
const targetElement = domEvent.target;
|
|
15
18
|
const currentTargetElement = domEvent
|
|
16
|
-
.currentTarget
|
|
19
|
+
.currentTarget.getAttribute
|
|
20
|
+
? domEvent.currentTarget
|
|
21
|
+
: undefined;
|
|
17
22
|
const type = domEvent.type;
|
|
18
23
|
const params = {};
|
|
19
24
|
const isTrusted = domEvent.isTrusted;
|
|
@@ -47,21 +52,27 @@ export function createCrossThreadEvent(runtime, domEvent, eventName) {
|
|
|
47
52
|
: changedTouches,
|
|
48
53
|
});
|
|
49
54
|
}
|
|
50
|
-
const
|
|
51
|
-
const
|
|
55
|
+
const currentTargetDatasetString = currentTargetElement?.getAttribute(lynxDatasetAttribute);
|
|
56
|
+
const currentTargetDataset = currentTargetDatasetString
|
|
57
|
+
? JSON.parse(decodeURIComponent(currentTargetDatasetString))
|
|
58
|
+
: {};
|
|
59
|
+
const targetDatasetString = targetElement.getAttribute(lynxDatasetAttribute);
|
|
60
|
+
const targetDataset = targetDatasetString
|
|
61
|
+
? JSON.parse(decodeURIComponent(targetDatasetString))
|
|
62
|
+
: {};
|
|
52
63
|
return {
|
|
53
64
|
type: eventName,
|
|
54
65
|
timestamp: domEvent.timeStamp,
|
|
55
66
|
target: {
|
|
56
|
-
id: targetElement.id,
|
|
57
|
-
dataset:
|
|
58
|
-
uniqueId:
|
|
67
|
+
id: targetElement.getAttribute('id'),
|
|
68
|
+
dataset: targetDataset,
|
|
69
|
+
uniqueId: Number(targetElement.getAttribute(lynxUniqueIdAttribute)),
|
|
59
70
|
},
|
|
60
|
-
currentTarget:
|
|
71
|
+
currentTarget: currentTargetElement
|
|
61
72
|
? {
|
|
62
|
-
id: currentTargetElement.id,
|
|
63
|
-
dataset:
|
|
64
|
-
uniqueId:
|
|
73
|
+
id: currentTargetElement.getAttribute('id'),
|
|
74
|
+
dataset: currentTargetDataset,
|
|
75
|
+
uniqueId: Number(currentTargetElement.getAttribute(lynxUniqueIdAttribute)),
|
|
65
76
|
}
|
|
66
77
|
: null,
|
|
67
78
|
// @ts-expect-error
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import type
|
|
2
|
-
export declare function createExposureService(
|
|
1
|
+
import { type postExposureEndpoint, type RpcCallType } from '@lynx-js/web-constants';
|
|
2
|
+
export declare function createExposureService(rootDom: Pick<EventTarget, 'addEventListener'>, postExposure: RpcCallType<typeof postExposureEndpoint>): {
|
|
3
3
|
switchExposureService: (enable: boolean, sendEvent: boolean) => void;
|
|
4
4
|
};
|
|
@@ -3,14 +3,13 @@
|
|
|
3
3
|
// LICENSE file in the root directory of this source tree.
|
|
4
4
|
import { lynxUniqueIdAttribute, } from '@lynx-js/web-constants';
|
|
5
5
|
import { createCrossThreadEvent } from './createCrossThreadEvent.js';
|
|
6
|
-
export function createExposureService(
|
|
7
|
-
const postExposure = runtime.config.callbacks.postExposure;
|
|
6
|
+
export function createExposureService(rootDom, postExposure) {
|
|
8
7
|
let working = true;
|
|
9
8
|
let exposureCache = [];
|
|
10
9
|
let disexposureCache = [];
|
|
11
10
|
const onScreen = new Map();
|
|
12
11
|
function exposureEventHandler(ev) {
|
|
13
|
-
const exposureEvent = createCrossThreadEvent(
|
|
12
|
+
const exposureEvent = createCrossThreadEvent(ev, ev.type);
|
|
14
13
|
exposureEvent.detail['unique-id'] = parseFloat(ev.target.getAttribute(lynxUniqueIdAttribute));
|
|
15
14
|
const exposureID = exposureEvent.detail.exposureID;
|
|
16
15
|
if (ev.type === 'exposure') {
|
|
@@ -34,10 +33,10 @@ export function createExposureService(runtime) {
|
|
|
34
33
|
});
|
|
35
34
|
}
|
|
36
35
|
}, 1000 / 20);
|
|
37
|
-
|
|
36
|
+
rootDom.addEventListener('exposure', exposureEventHandler, {
|
|
38
37
|
passive: true,
|
|
39
38
|
});
|
|
40
|
-
|
|
39
|
+
rootDom.addEventListener('disexposure', exposureEventHandler, {
|
|
41
40
|
passive: true,
|
|
42
41
|
});
|
|
43
42
|
function switchExposureService(enable, sendEvent) {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@lynx-js/web-mainthread-apis",
|
|
3
|
-
"version": "0.13.
|
|
3
|
+
"version": "0.13.5",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "",
|
|
6
6
|
"keywords": [],
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"dependencies": {
|
|
26
26
|
"css-tree": "^3.1.0",
|
|
27
27
|
"hyphenate-style-name": "^1.1.0",
|
|
28
|
-
"@lynx-js/web-constants": "0.13.
|
|
28
|
+
"@lynx-js/web-constants": "0.13.5",
|
|
29
29
|
"@lynx-js/web-style-transformer": "0.3.0"
|
|
30
30
|
}
|
|
31
31
|
}
|
package/dist/MainThreadLynx.d.ts
DELETED
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import { type MainThreadRuntimeConfig } from './MainThreadRuntime.js';
|
|
2
|
-
export declare function createMainThreadLynx(config: MainThreadRuntimeConfig): {
|
|
3
|
-
getJSContext(): import("@lynx-js/web-constants").LynxContextEventTarget;
|
|
4
|
-
requestAnimationFrame(cb: FrameRequestCallback): number;
|
|
5
|
-
cancelAnimationFrame(handler: number): void;
|
|
6
|
-
__globalProps: unknown;
|
|
7
|
-
getCustomSectionSync(key: string): import("@lynx-js/web-constants").Cloneable;
|
|
8
|
-
markPipelineTiming: (pipelineId: string, timingKey: string) => void;
|
|
9
|
-
};
|
|
10
|
-
export type MainThreadLynx = ReturnType<typeof createMainThreadLynx>;
|
|
@@ -1,92 +0,0 @@
|
|
|
1
|
-
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, type LynxJSModule, systemInfo } from '@lynx-js/web-constants';
|
|
2
|
-
import { type MainThreadLynx } from './MainThreadLynx.js';
|
|
3
|
-
import type { LynxRuntimeInfo } from './elementAPI/ElementThreadElement.js';
|
|
4
|
-
export interface MainThreadRuntimeCallbacks {
|
|
5
|
-
mainChunkReady: () => void;
|
|
6
|
-
flushElementTree: (options: FlushElementTreeOptions, timingFlags: string[]) => void;
|
|
7
|
-
_ReportError: RpcCallType<typeof reportErrorEndpoint>;
|
|
8
|
-
__OnLifecycleEvent: (lifeCycleEvent: Cloneable) => void;
|
|
9
|
-
markTiming: (pipelineId: string, timingKey: string) => void;
|
|
10
|
-
publishEvent: RpcCallType<typeof publishEventEndpoint>;
|
|
11
|
-
publicComponentEvent: RpcCallType<typeof publicComponentEventEndpoint>;
|
|
12
|
-
postExposure: RpcCallType<typeof postExposureEndpoint>;
|
|
13
|
-
}
|
|
14
|
-
export interface MainThreadRuntimeConfig {
|
|
15
|
-
pageConfig: PageConfig;
|
|
16
|
-
globalProps: unknown;
|
|
17
|
-
callbacks: MainThreadRuntimeCallbacks;
|
|
18
|
-
styleInfo: StyleInfo;
|
|
19
|
-
customSections: LynxTemplate['customSections'];
|
|
20
|
-
lepusCode: Record<string, LynxJSModule>;
|
|
21
|
-
browserConfig: BrowserConfig;
|
|
22
|
-
tagMap: Record<string, string>;
|
|
23
|
-
createElement: Document['createElement'];
|
|
24
|
-
rootDom: Pick<Element, 'append' | 'addEventListener'>;
|
|
25
|
-
jsContext: LynxContextEventTarget;
|
|
26
|
-
}
|
|
27
|
-
export declare const elementToRuntimeInfoMap: unique symbol;
|
|
28
|
-
export declare const getElementByUniqueId: unique symbol;
|
|
29
|
-
export declare const updateCSSInJsStyle: unique symbol;
|
|
30
|
-
export declare const lynxUniqueIdToElement: unique symbol;
|
|
31
|
-
export declare const switchExposureService: unique symbol;
|
|
32
|
-
export declare class MainThreadRuntime {
|
|
33
|
-
#private;
|
|
34
|
-
config: MainThreadRuntimeConfig;
|
|
35
|
-
/**
|
|
36
|
-
* @private
|
|
37
|
-
*/
|
|
38
|
-
[lynxUniqueIdToElement]: WeakRef<HTMLElement>[];
|
|
39
|
-
/**
|
|
40
|
-
* @private
|
|
41
|
-
*/
|
|
42
|
-
[switchExposureService]: (enable: boolean, sendEvent: boolean) => void;
|
|
43
|
-
/**
|
|
44
|
-
* @private
|
|
45
|
-
*/
|
|
46
|
-
private _lynxUniqueIdToStyleSheet;
|
|
47
|
-
/**
|
|
48
|
-
* @private
|
|
49
|
-
*/
|
|
50
|
-
_page?: HTMLElement;
|
|
51
|
-
/**
|
|
52
|
-
* @private the CreatePage will append it to this
|
|
53
|
-
*/
|
|
54
|
-
_rootDom: Pick<Element, 'append' | 'addEventListener'>;
|
|
55
|
-
_createElement: Document['createElement'];
|
|
56
|
-
/**
|
|
57
|
-
* @private
|
|
58
|
-
*/
|
|
59
|
-
_timingFlags: string[];
|
|
60
|
-
/**
|
|
61
|
-
* @private
|
|
62
|
-
*/
|
|
63
|
-
[elementToRuntimeInfoMap]: WeakMap<HTMLElement, LynxRuntimeInfo>;
|
|
64
|
-
constructor(config: MainThreadRuntimeConfig);
|
|
65
|
-
/**
|
|
66
|
-
* @private
|
|
67
|
-
*/
|
|
68
|
-
[getElementByUniqueId](uniqueId: number): HTMLElement | undefined;
|
|
69
|
-
[updateCSSInJsStyle](uniqueId: number, newStyles: string): void;
|
|
70
|
-
/**
|
|
71
|
-
* @private
|
|
72
|
-
*/
|
|
73
|
-
__lynxGlobalBindingValues: Record<string, any>;
|
|
74
|
-
globalThis: this;
|
|
75
|
-
SystemInfo: typeof systemInfo;
|
|
76
|
-
lynx: MainThreadLynx;
|
|
77
|
-
__globalProps: unknown;
|
|
78
|
-
processData?: ProcessDataCallback;
|
|
79
|
-
ssrEncode?: () => string;
|
|
80
|
-
ssrHydrate?: (encodeData?: string) => void;
|
|
81
|
-
renderPage: (data: unknown) => void;
|
|
82
|
-
__GetTemplateParts?: () => Record<string, Element> | undefined;
|
|
83
|
-
__GetPageElement: () => HTMLElement | undefined;
|
|
84
|
-
_ReportError: RpcCallType<typeof reportErrorEndpoint>;
|
|
85
|
-
__OnLifecycleEvent: (lifeCycleEvent: Cloneable) => void;
|
|
86
|
-
__LoadLepusChunk: (path: string) => boolean;
|
|
87
|
-
__FlushElementTree: (_subTree: unknown, options: FlushElementTreeOptions) => void;
|
|
88
|
-
updatePage?: (data: Cloneable, options?: Record<string, string>) => void;
|
|
89
|
-
runWorklet?: (obj: unknown, event: unknown) => void;
|
|
90
|
-
private __varsUpdateHandlers;
|
|
91
|
-
set _updateVars(handler: () => void);
|
|
92
|
-
}
|
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
// Copyright 2023 The Lynx Authors. All rights reserved.
|
|
2
|
-
// Licensed under the Apache License Version 2.0 that can be found in the
|
|
3
|
-
// LICENSE file in the root directory of this source tree.
|
|
4
|
-
import { lynxUniqueIdAttribute, systemInfo, } from '@lynx-js/web-constants';
|
|
5
|
-
import { globalMuteableVars } from '@lynx-js/web-constants';
|
|
6
|
-
import { createMainThreadLynx } from './MainThreadLynx.js';
|
|
7
|
-
import { initializeElementCreatingFunction } from './elementAPI/elementCreating/elementCreatingFunctions.js';
|
|
8
|
-
import { createAttributeAndPropertyFunctions } from './elementAPI/attributeAndProperty/attributeAndPropertyFunctions.js';
|
|
9
|
-
import * as domTreeApis from './elementAPI/domTree/domTreeFunctions.js';
|
|
10
|
-
import { createEventFunctions } from './elementAPI/event/eventFunctions.js';
|
|
11
|
-
import { createStyleFunctions } from './elementAPI/style/styleFunctions.js';
|
|
12
|
-
import { flattenStyleInfo, genCssContent, genCssInJsInfo, transformToWebCss, } from './utils/processStyleInfo.js';
|
|
13
|
-
import { createExposureService } from './utils/createExposureService.js';
|
|
14
|
-
export const elementToRuntimeInfoMap = Symbol('elementToRuntimeInfoMap');
|
|
15
|
-
export const getElementByUniqueId = Symbol('getElementByUniqueId');
|
|
16
|
-
export const updateCSSInJsStyle = Symbol('updateCSSInJsStyle');
|
|
17
|
-
export const lynxUniqueIdToElement = Symbol('lynxUniqueIdToElement');
|
|
18
|
-
export const switchExposureService = Symbol('switchExposureService');
|
|
19
|
-
export class MainThreadRuntime {
|
|
20
|
-
config;
|
|
21
|
-
/**
|
|
22
|
-
* @private
|
|
23
|
-
*/
|
|
24
|
-
[lynxUniqueIdToElement] = [];
|
|
25
|
-
/**
|
|
26
|
-
* @private
|
|
27
|
-
*/
|
|
28
|
-
[switchExposureService];
|
|
29
|
-
/**
|
|
30
|
-
* @private
|
|
31
|
-
*/
|
|
32
|
-
_lynxUniqueIdToStyleSheet = [];
|
|
33
|
-
/**
|
|
34
|
-
* @private
|
|
35
|
-
*/
|
|
36
|
-
_page;
|
|
37
|
-
/**
|
|
38
|
-
* @private the CreatePage will append it to this
|
|
39
|
-
*/
|
|
40
|
-
_rootDom;
|
|
41
|
-
_createElement;
|
|
42
|
-
/**
|
|
43
|
-
* @private
|
|
44
|
-
*/
|
|
45
|
-
_timingFlags = [];
|
|
46
|
-
/**
|
|
47
|
-
* @private
|
|
48
|
-
*/
|
|
49
|
-
[elementToRuntimeInfoMap] = new WeakMap();
|
|
50
|
-
constructor(config) {
|
|
51
|
-
this.config = config;
|
|
52
|
-
this.__globalProps = config.globalProps;
|
|
53
|
-
this.lynx = createMainThreadLynx(config);
|
|
54
|
-
this._rootDom = config.rootDom;
|
|
55
|
-
this._createElement = config.createElement;
|
|
56
|
-
/**
|
|
57
|
-
* now create the style content
|
|
58
|
-
* 1. flatten the styleInfo
|
|
59
|
-
* 2. transform the styleInfo to web css
|
|
60
|
-
* 3. generate the css in js info
|
|
61
|
-
* 4. create the style element
|
|
62
|
-
* 5. append the style element to the root dom
|
|
63
|
-
*/
|
|
64
|
-
flattenStyleInfo(this.config.styleInfo, this.config.pageConfig.enableCSSSelector);
|
|
65
|
-
transformToWebCss(this.config.styleInfo);
|
|
66
|
-
const cssInJsInfo = this.config.pageConfig.enableCSSSelector
|
|
67
|
-
? {}
|
|
68
|
-
: genCssInJsInfo(this.config.styleInfo);
|
|
69
|
-
const cardStyleElement = this._createElement('style');
|
|
70
|
-
cardStyleElement.innerHTML = genCssContent(this.config.styleInfo, this.config.pageConfig);
|
|
71
|
-
this._rootDom.append(cardStyleElement);
|
|
72
|
-
/**
|
|
73
|
-
* now create Element PAPIs
|
|
74
|
-
*/
|
|
75
|
-
Object.assign(this, createAttributeAndPropertyFunctions(this), domTreeApis, createEventFunctions(this), createStyleFunctions(this, cssInJsInfo), initializeElementCreatingFunction(this));
|
|
76
|
-
this._ReportError = this.config.callbacks._ReportError;
|
|
77
|
-
this.__OnLifecycleEvent = this.config.callbacks.__OnLifecycleEvent;
|
|
78
|
-
this.SystemInfo = {
|
|
79
|
-
...systemInfo,
|
|
80
|
-
...config.browserConfig,
|
|
81
|
-
};
|
|
82
|
-
/**
|
|
83
|
-
* Start the exposure service
|
|
84
|
-
*/
|
|
85
|
-
this[switchExposureService] =
|
|
86
|
-
createExposureService(this).switchExposureService;
|
|
87
|
-
/**
|
|
88
|
-
* to know when the main thread is ready
|
|
89
|
-
*/
|
|
90
|
-
Object.defineProperty(this, 'renderPage', {
|
|
91
|
-
get: () => {
|
|
92
|
-
return this.#renderPage;
|
|
93
|
-
},
|
|
94
|
-
set: (val) => {
|
|
95
|
-
this.#renderPage = val;
|
|
96
|
-
queueMicrotask(this.config.callbacks.mainChunkReady);
|
|
97
|
-
},
|
|
98
|
-
});
|
|
99
|
-
for (const nm of globalMuteableVars) {
|
|
100
|
-
Object.defineProperty(this, nm, {
|
|
101
|
-
get: () => {
|
|
102
|
-
return this.__lynxGlobalBindingValues[nm];
|
|
103
|
-
},
|
|
104
|
-
set: (v) => {
|
|
105
|
-
this.__lynxGlobalBindingValues[nm] = v;
|
|
106
|
-
for (const handler of this.__varsUpdateHandlers) {
|
|
107
|
-
handler();
|
|
108
|
-
}
|
|
109
|
-
},
|
|
110
|
-
});
|
|
111
|
-
}
|
|
112
|
-
}
|
|
113
|
-
/**
|
|
114
|
-
* @private
|
|
115
|
-
*/
|
|
116
|
-
[getElementByUniqueId](uniqueId) {
|
|
117
|
-
return this[lynxUniqueIdToElement][uniqueId]?.deref();
|
|
118
|
-
}
|
|
119
|
-
[updateCSSInJsStyle](uniqueId, newStyles) {
|
|
120
|
-
let currentElement = this._lynxUniqueIdToStyleSheet[uniqueId]?.deref();
|
|
121
|
-
if (!currentElement) {
|
|
122
|
-
currentElement = this._createElement('style');
|
|
123
|
-
this._lynxUniqueIdToStyleSheet[uniqueId] = new WeakRef(currentElement);
|
|
124
|
-
this._rootDom.append(currentElement);
|
|
125
|
-
}
|
|
126
|
-
currentElement.innerHTML =
|
|
127
|
-
`[${lynxUniqueIdAttribute}="${uniqueId}"]{${newStyles}}`;
|
|
128
|
-
}
|
|
129
|
-
/**
|
|
130
|
-
* @private
|
|
131
|
-
*/
|
|
132
|
-
__lynxGlobalBindingValues = {};
|
|
133
|
-
globalThis = new Proxy(this, {
|
|
134
|
-
get: (target, prop) => {
|
|
135
|
-
// @ts-expect-error
|
|
136
|
-
return target[prop] ?? globalThis[prop];
|
|
137
|
-
},
|
|
138
|
-
set: (target, prop, value) => {
|
|
139
|
-
// @ts-expect-error
|
|
140
|
-
target[prop] = value;
|
|
141
|
-
return true;
|
|
142
|
-
},
|
|
143
|
-
ownKeys(target) {
|
|
144
|
-
return Reflect.ownKeys(target).filter((key) => key !== 'globalThis');
|
|
145
|
-
},
|
|
146
|
-
});
|
|
147
|
-
SystemInfo;
|
|
148
|
-
lynx;
|
|
149
|
-
__globalProps;
|
|
150
|
-
processData;
|
|
151
|
-
ssrEncode;
|
|
152
|
-
ssrHydrate;
|
|
153
|
-
#renderPage;
|
|
154
|
-
__GetTemplateParts;
|
|
155
|
-
__GetPageElement = () => {
|
|
156
|
-
return this._page;
|
|
157
|
-
};
|
|
158
|
-
_ReportError;
|
|
159
|
-
__OnLifecycleEvent;
|
|
160
|
-
__LoadLepusChunk = (path) => {
|
|
161
|
-
const lepusModule = this.config.lepusCode[`${path}`];
|
|
162
|
-
if (lepusModule) {
|
|
163
|
-
const entry = lepusModule.exports;
|
|
164
|
-
entry?.(this);
|
|
165
|
-
return true;
|
|
166
|
-
}
|
|
167
|
-
else {
|
|
168
|
-
return false;
|
|
169
|
-
}
|
|
170
|
-
};
|
|
171
|
-
__FlushElementTree = (_subTree, options) => {
|
|
172
|
-
const timingFlags = this._timingFlags;
|
|
173
|
-
this._timingFlags = [];
|
|
174
|
-
if (this._page && !this._page.parentNode) {
|
|
175
|
-
this._rootDom.append(this._page);
|
|
176
|
-
}
|
|
177
|
-
this.config.callbacks.flushElementTree(options, timingFlags);
|
|
178
|
-
};
|
|
179
|
-
updatePage;
|
|
180
|
-
runWorklet;
|
|
181
|
-
__varsUpdateHandlers = [];
|
|
182
|
-
set _updateVars(handler) {
|
|
183
|
-
this.__varsUpdateHandlers.push(handler);
|
|
184
|
-
}
|
|
185
|
-
}
|
|
186
|
-
//# sourceMappingURL=MainThreadRuntime.js.map
|
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
import type { LynxEventType, Cloneable } from '@lynx-js/web-constants';
|
|
2
|
-
export interface LynxRuntimeInfo {
|
|
3
|
-
uniqueId: number;
|
|
4
|
-
parentComponentUniqueId: number;
|
|
5
|
-
componentConfig: Record<string, Cloneable>;
|
|
6
|
-
lynxDataset: Record<string, Cloneable>;
|
|
7
|
-
eventHandlerMap: Record<string, {
|
|
8
|
-
capture: {
|
|
9
|
-
type: LynxEventType;
|
|
10
|
-
handler: string | {
|
|
11
|
-
type: 'worklet';
|
|
12
|
-
value: unknown;
|
|
13
|
-
};
|
|
14
|
-
} | undefined;
|
|
15
|
-
bind: {
|
|
16
|
-
type: LynxEventType;
|
|
17
|
-
handler: string | {
|
|
18
|
-
type: 'worklet';
|
|
19
|
-
value: unknown;
|
|
20
|
-
};
|
|
21
|
-
} | undefined;
|
|
22
|
-
}>;
|
|
23
|
-
componentAtIndex?: ComponentAtIndexCallback;
|
|
24
|
-
enqueueComponent?: EnqueueComponentCallback;
|
|
25
|
-
}
|
|
26
|
-
export type ComponentAtIndexCallback = (list: HTMLElement, listID: number, cellIndex: number, operationID: number, enableReuseNotification: boolean) => void;
|
|
27
|
-
export type EnqueueComponentCallback = (list: HTMLElement, listID: number, sign: number) => void;
|
|
@@ -1,30 +0,0 @@
|
|
|
1
|
-
import { type ComponentAtIndexCallback, type EnqueueComponentCallback } from '../ElementThreadElement.js';
|
|
2
|
-
import { type MainThreadRuntime } from '../../MainThreadRuntime.js';
|
|
3
|
-
type UpdateListInfoAttributeValue = {
|
|
4
|
-
insertAction: {
|
|
5
|
-
position: number;
|
|
6
|
-
}[];
|
|
7
|
-
removeAction: {
|
|
8
|
-
position: number;
|
|
9
|
-
}[];
|
|
10
|
-
};
|
|
11
|
-
export declare function createAttributeAndPropertyFunctions(runtime: MainThreadRuntime): {
|
|
12
|
-
__AddConfig: (element: HTMLElement, type: string, value: any) => void;
|
|
13
|
-
__AddDataset: (element: HTMLElement, key: string, value: string | number | Record<string, any>) => void;
|
|
14
|
-
__GetAttributes: (element: HTMLElement) => Record<string, string | null>;
|
|
15
|
-
__GetComponentID: (element: HTMLElement) => string | null;
|
|
16
|
-
__GetDataByKey: (element: HTMLElement, key: string) => import("@lynx-js/web-constants").Cloneable;
|
|
17
|
-
__GetDataset: (element: HTMLElement) => Record<string, any>;
|
|
18
|
-
__GetElementConfig: (element: HTMLElement) => Record<string, import("@lynx-js/web-constants").Cloneable>;
|
|
19
|
-
__GetElementUniqueID: (element: HTMLElement) => number;
|
|
20
|
-
__GetID: (element: HTMLElement) => string;
|
|
21
|
-
__GetTag: (element: HTMLElement) => string;
|
|
22
|
-
__SetConfig: (element: HTMLElement, config: Record<string, any>) => void;
|
|
23
|
-
__SetDataset: (element: HTMLElement, dataset: Record<string, any>) => void;
|
|
24
|
-
__SetID: (element: HTMLElement, id: string | null) => void;
|
|
25
|
-
__UpdateComponentID: (element: HTMLElement, componentID: string) => void;
|
|
26
|
-
__UpdateListCallbacks: (element: HTMLElement, componentAtIndex: ComponentAtIndexCallback, enqueueComponent: EnqueueComponentCallback) => void;
|
|
27
|
-
__GetConfig: (element: HTMLElement) => Record<string, import("@lynx-js/web-constants").Cloneable>;
|
|
28
|
-
__SetAttribute: (element: HTMLElement, key: string, value: string | null | undefined | UpdateListInfoAttributeValue) => void;
|
|
29
|
-
};
|
|
30
|
-
export {};
|