@dooboostore/simple-web-component 1.0.34 → 1.0.35
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/README.md +23 -30
- package/dist/cjs/decorators/applyNode.js +4 -0
- package/dist/cjs/decorators/applyNode.js.map +2 -2
- package/dist/cjs/decorators/attribute.js +1 -1
- package/dist/cjs/decorators/attribute.js.map +2 -2
- package/dist/cjs/decorators/changedAttributeHost.js.map +2 -2
- package/dist/cjs/decorators/elementDefine.js +225 -180
- package/dist/cjs/decorators/elementDefine.js.map +2 -2
- package/dist/cjs/decorators/emitCustomEvent.js +10 -4
- package/dist/cjs/decorators/emitCustomEvent.js.map +2 -2
- package/dist/cjs/decorators/lifecycles.js +15 -17
- package/dist/cjs/decorators/lifecycles.js.map +2 -2
- package/dist/cjs/decorators/subscribeSwcAppRouteChangeWhileConnected.js +2 -2
- package/dist/cjs/decorators/subscribeSwcAppRouteChangeWhileConnected.js.map +2 -2
- package/dist/cjs/elements/SwcAppEngine.js +8 -2
- package/dist/cjs/elements/SwcAppEngine.js.map +2 -2
- package/dist/cjs/elements/SwcAppMixin.js +120 -65
- package/dist/cjs/elements/SwcAppMixin.js.map +2 -2
- package/dist/cjs/elements/SwcAsync.js +28 -18
- package/dist/cjs/elements/SwcAsync.js.map +2 -2
- package/dist/cjs/elements/SwcChoose.js +51 -32
- package/dist/cjs/elements/SwcChoose.js.map +2 -2
- package/dist/cjs/elements/SwcIf.js +52 -30
- package/dist/cjs/elements/SwcIf.js.map +2 -2
- package/dist/cjs/elements/SwcLoop.js +109 -35
- package/dist/cjs/elements/SwcLoop.js.map +2 -2
- package/dist/cjs/elements/register.js +244 -117
- package/dist/cjs/elements/register.js.map +2 -2
- package/dist/cjs/router/ElementRouter.js +4 -2
- package/dist/cjs/router/ElementRouter.js.map +1 -1
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/utils/Utils.js +18 -4
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/decorators/applyNode.js +4 -0
- package/dist/esm/decorators/applyNode.js.map +2 -2
- package/dist/esm/decorators/attribute.js +1 -1
- package/dist/esm/decorators/attribute.js.map +2 -2
- package/dist/esm/decorators/changedAttributeHost.js.map +2 -2
- package/dist/esm/decorators/elementDefine.js +226 -181
- package/dist/esm/decorators/elementDefine.js.map +2 -2
- package/dist/esm/decorators/emitCustomEvent.js +10 -4
- package/dist/esm/decorators/emitCustomEvent.js.map +2 -2
- package/dist/esm/decorators/lifecycles.js +15 -17
- package/dist/esm/decorators/lifecycles.js.map +2 -2
- package/dist/esm/decorators/subscribeSwcAppRouteChangeWhileConnected.js +2 -2
- package/dist/esm/decorators/subscribeSwcAppRouteChangeWhileConnected.js.map +2 -2
- package/dist/esm/elements/SwcAppEngine.js +9 -2
- package/dist/esm/elements/SwcAppEngine.js.map +2 -2
- package/dist/esm/elements/SwcAppMixin.js +122 -66
- package/dist/esm/elements/SwcAppMixin.js.map +2 -2
- package/dist/esm/elements/SwcAsync.js +28 -18
- package/dist/esm/elements/SwcAsync.js.map +2 -2
- package/dist/esm/elements/SwcChoose.js +51 -32
- package/dist/esm/elements/SwcChoose.js.map +2 -2
- package/dist/esm/elements/SwcIf.js +53 -31
- package/dist/esm/elements/SwcIf.js.map +2 -2
- package/dist/esm/elements/SwcLoop.js +110 -36
- package/dist/esm/elements/SwcLoop.js.map +2 -2
- package/dist/esm/elements/register.js +244 -117
- package/dist/esm/elements/register.js.map +2 -2
- package/dist/esm/router/ElementRouter.js +5 -2
- package/dist/esm/router/ElementRouter.js.map +1 -1
- package/dist/esm/types.js.map +1 -1
- package/dist/esm/utils/Utils.js +18 -4
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +319 -276
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
- package/dist/types/decorators/applyNode.d.ts +1 -0
- package/dist/types/decorators/applyNode.d.ts.map +1 -1
- package/dist/types/decorators/changedAttributeHost.d.ts +1 -0
- package/dist/types/decorators/changedAttributeHost.d.ts.map +1 -1
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- package/dist/types/decorators/emitCustomEvent.d.ts +10 -6
- package/dist/types/decorators/emitCustomEvent.d.ts.map +1 -1
- package/dist/types/decorators/lifecycles.d.ts +10 -7
- package/dist/types/decorators/lifecycles.d.ts.map +1 -1
- package/dist/types/decorators/subscribeSwcAppRouteChangeWhileConnected.d.ts +4 -5
- package/dist/types/decorators/subscribeSwcAppRouteChangeWhileConnected.d.ts.map +1 -1
- package/dist/types/elements/SwcAppEngine.d.ts +4 -1
- package/dist/types/elements/SwcAppEngine.d.ts.map +1 -1
- package/dist/types/elements/SwcAppMixin.d.ts +11 -8
- package/dist/types/elements/SwcAppMixin.d.ts.map +1 -1
- package/dist/types/elements/register.d.ts.map +1 -1
- package/dist/types/types.d.ts +1 -0
- package/dist/types/types.d.ts.map +1 -1
- package/dist/types/utils/Utils.d.ts +4 -1
- package/dist/types/utils/Utils.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +319 -276
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
- package/package.json +4 -4
- package/src/decorators/applyNode.ts +13 -1
- package/src/decorators/attribute.ts +1 -1
- package/src/decorators/changedAttributeHost.ts +3 -2
- package/src/decorators/elementDefine.ts +397 -354
- package/src/decorators/emitCustomEvent.ts +29 -15
- package/src/decorators/lifecycles.ts +11 -10
- package/src/decorators/subscribeSwcAppRouteChangeWhileConnected.ts +10 -10
- package/src/elements/SwcAppEngine.ts +10 -3
- package/src/elements/SwcAppMixin.ts +177 -97
- package/src/elements/SwcAsync.ts +28 -17
- package/src/elements/SwcChoose.ts +71 -34
- package/src/elements/SwcIf.ts +59 -22
- package/src/elements/SwcLoop.ts +140 -27
- package/src/elements/register.ts +296 -98
- package/src/types.ts +1 -0
- package/src/utils/Utils.ts +23 -5
- package/tsconfig.json +2 -2
|
@@ -4,7 +4,7 @@ import { ON_INITIALIZE_METADATA_KEY, ON_BEFORE_CONNECTED_METADATA_KEY, ON_AFTER_
|
|
|
4
4
|
import { getEmitCustomEventMetadataList } from "./emitCustomEvent.js";
|
|
5
5
|
import { findAllAttributeChangedMetadata, convertAttributeValue } from "./changedAttributeHost.js";
|
|
6
6
|
import { findAllAttributeApplyMetadata } from "./applyAttribute.js";
|
|
7
|
-
import { findAllAttributeMetadata } from "./attribute.js";
|
|
7
|
+
import { findAllAttributeMetadata, getAttributeValue } from "./attribute.js";
|
|
8
8
|
import { getQueryMetadata } from "./query.js";
|
|
9
9
|
import { getQueryAllMetadata } from "./queryAll.js";
|
|
10
10
|
import { SwcUtils } from "../utils/Utils.js";
|
|
@@ -117,7 +117,13 @@ const setupPrototype = (proto) => {
|
|
|
117
117
|
const app = useHostSet?.$appHost?.simpleApplication;
|
|
118
118
|
if (app) {
|
|
119
119
|
const otherStorage = /* @__PURE__ */ new Map();
|
|
120
|
-
const situations = new SituationTypeContainers([new SituationTypeContainer({ situationType: InjectSituationType.HOST_SET, data: useHostSet }), new SituationTypeContainer({ situationType: InjectSituationType.APP_HOST, data: useHostSet.$appHost }), new SituationTypeContainer({ situationType: InjectSituationType.APP_HOSTS, data: useHostSet.$appHosts }), new SituationTypeContainer({
|
|
120
|
+
const situations = new SituationTypeContainers([new SituationTypeContainer({ situationType: InjectSituationType.HOST_SET, data: useHostSet }), new SituationTypeContainer({ situationType: InjectSituationType.APP_HOST, data: useHostSet.$appHost }), new SituationTypeContainer({ situationType: InjectSituationType.APP_HOSTS, data: useHostSet.$appHosts }), new SituationTypeContainer({
|
|
121
|
+
situationType: InjectSituationType.HOST,
|
|
122
|
+
data: useHostSet.$host
|
|
123
|
+
}), new SituationTypeContainer({ situationType: InjectSituationType.HOSTS, data: useHostSet.$hosts }), new SituationTypeContainer({ situationType: InjectSituationType.FIRST_HOST, data: useHostSet.$firstHost }), new SituationTypeContainer({ situationType: InjectSituationType.LAST_HOST, data: useHostSet.$lastHost }), new SituationTypeContainer({
|
|
124
|
+
situationType: InjectSituationType.FIRST_APP_HOST,
|
|
125
|
+
data: useHostSet.$firstAppHost
|
|
126
|
+
}), new SituationTypeContainer({ situationType: InjectSituationType.LAST_APP_HOST, data: useHostSet.$lastAppHost })]);
|
|
121
127
|
otherStorage.set(SituationTypeContainers, situations);
|
|
122
128
|
return app.simstanceManager.executeBindParameterSim(
|
|
123
129
|
{
|
|
@@ -210,203 +216,243 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
210
216
|
const swcOnEvents = DOM_EVENT_NAMES.map((e) => `swc-on-${e}`);
|
|
211
217
|
const attributeApplyNames = Array.from(applyAttributeMap.values()).map((it) => it.options.name).filter(Boolean);
|
|
212
218
|
const hostAttributes = attributeList.filter((it) => it.selector === ":host").map((it) => it.options.name || String(it.propertyKey));
|
|
213
|
-
const proto = constructor.prototype;
|
|
214
219
|
const originalStaticObservedAttributes = constructor.observedAttributes ?? [];
|
|
215
|
-
const mergedObservedAttributes = [.../* @__PURE__ */ new Set([
|
|
216
|
-
...metadata.observedAttributes ?? [],
|
|
217
|
-
...originalStaticObservedAttributes,
|
|
218
|
-
...attrChangeMap.keys(),
|
|
219
|
-
...attributeApplyNames,
|
|
220
|
-
...hostAttributes,
|
|
221
|
-
...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean),
|
|
222
|
-
...swcLifecycleAttributes,
|
|
223
|
-
...swcOnEvents
|
|
224
|
-
])];
|
|
220
|
+
const mergedObservedAttributes = [.../* @__PURE__ */ new Set([...metadata.observedAttributes ?? [], ...originalStaticObservedAttributes, ...attrChangeMap.keys(), ...attributeApplyNames, ...hostAttributes, ...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean), ...swcLifecycleAttributes, ...swcOnEvents])];
|
|
225
221
|
const connectedInnerHtmlList = getOnConnectedInnerHtmlMetadata(constructor) || [];
|
|
222
|
+
const proto = constructor.prototype;
|
|
226
223
|
setupPrototype(proto);
|
|
224
|
+
let helperHostSet = null;
|
|
227
225
|
const originalConnected = proto.connectedCallback;
|
|
228
|
-
proto.connectedCallback = function() {
|
|
226
|
+
proto.connectedCallback = async function() {
|
|
229
227
|
ensureInit(this);
|
|
230
|
-
|
|
231
|
-
const appHost =
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
}
|
|
239
|
-
this._executeSwcScript("swc-on-before-connected", hostSet);
|
|
240
|
-
const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_CONNECTED_METADATA_KEY);
|
|
241
|
-
if (bMethods) {
|
|
242
|
-
for (const m of bMethods) this._invokeLifecycleMethod(m, hostSet);
|
|
243
|
-
}
|
|
244
|
-
if (connectedInnerHtmlList.length > 0) {
|
|
245
|
-
let sContent = "", lContent = "";
|
|
246
|
-
for (const meta of connectedInnerHtmlList) {
|
|
247
|
-
const res = this._invokeLifecycleMethod(meta.propertyKey, hostSet);
|
|
248
|
-
if (res !== void 0) {
|
|
249
|
-
if (meta.options.useShadow || conf?.useShadow) sContent += res;
|
|
250
|
-
else lContent += res;
|
|
251
|
-
}
|
|
228
|
+
helperHostSet = SwcUtils.getHelperAndHostSet(win, this);
|
|
229
|
+
const appHost = helperHostSet.$appHost;
|
|
230
|
+
try {
|
|
231
|
+
if (appHost && typeof appHost._connected === "function") {
|
|
232
|
+
await appHost._connected(this);
|
|
233
|
+
} else if (appHost && typeof appHost) {
|
|
234
|
+
appHost._connected_safari ?? (appHost._connected_safari = []);
|
|
235
|
+
appHost._connected_safari.push(this);
|
|
252
236
|
}
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
}
|
|
260
|
-
const root = this.getRootNode();
|
|
261
|
-
if (!globalDelegatedRoots.has(root)) {
|
|
262
|
-
DOM_EVENT_NAMES.forEach((type) => {
|
|
263
|
-
root.addEventListener(type, handleGlobalSwcEvent);
|
|
264
|
-
});
|
|
265
|
-
globalDelegatedRoots.add(root);
|
|
266
|
-
}
|
|
267
|
-
const delegateListeners = [];
|
|
268
|
-
const nonDelegateListeners = [];
|
|
269
|
-
addEventListenerList.forEach((meta) => {
|
|
270
|
-
if (meta.options.delegate && meta.selector !== ":window" && meta.selector !== ":document" && meta.selector !== ":parentHost" && meta.selector !== ":appHost" && meta.selector !== ":firstHost" && meta.selector !== ":lastHost" && meta.selector !== ":firstAppHost" && meta.selector !== ":lastAppHost" && meta.selector !== ":hosts" && meta.selector !== ":appHosts" && meta.selector !== ":host" && meta.selector !== "") {
|
|
271
|
-
delegateListeners.push(meta);
|
|
272
|
-
} else {
|
|
273
|
-
nonDelegateListeners.push(meta);
|
|
237
|
+
const conf = getElementConfig(this);
|
|
238
|
+
const currentWin = this._resolveWindow(conf);
|
|
239
|
+
const shadowMode = conf?.useShadow || connectedInnerHtmlList.find((it) => it.options.useShadow)?.options.useShadow;
|
|
240
|
+
if (shadowMode && !this.shadowRoot) {
|
|
241
|
+
const mode = shadowMode === true ? "open" : shadowMode;
|
|
242
|
+
this.attachShadow({ mode });
|
|
274
243
|
}
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
const r = meta.options.root || "auto";
|
|
279
|
-
const rootKey = `${meta.type}:${r}`;
|
|
280
|
-
if (!delegatesByTypeAndRoot.has(rootKey)) {
|
|
281
|
-
delegatesByTypeAndRoot.set(rootKey, []);
|
|
244
|
+
const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_CONNECTED_METADATA_KEY);
|
|
245
|
+
if (bMethods) {
|
|
246
|
+
for (const m of bMethods) await this._invokeLifecycleMethod(m, helperHostSet);
|
|
282
247
|
}
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
248
|
+
this._executeSwcScript("swc-on-before-connected", helperHostSet);
|
|
249
|
+
if (connectedInnerHtmlList.length > 0) {
|
|
250
|
+
let sContent = "", lContent = "";
|
|
251
|
+
for (const meta of connectedInnerHtmlList) {
|
|
252
|
+
let res = await this._invokeLifecycleMethod(meta.propertyKey, helperHostSet);
|
|
253
|
+
const actionExpression = new ActionExpression(res, {
|
|
254
|
+
expression: {
|
|
255
|
+
replace: {
|
|
256
|
+
start: meta.options.replaceWrap?.start || "{%{",
|
|
257
|
+
end: meta.options.replaceWrap?.end || "}%}"
|
|
258
|
+
},
|
|
259
|
+
callReturn: {
|
|
260
|
+
start: meta.options.replaceWrap?.start || "{%{=",
|
|
261
|
+
end: meta.options.replaceWrap?.end || "}%}"
|
|
262
|
+
},
|
|
263
|
+
call: {
|
|
264
|
+
start: meta.options.replaceWrap?.start || "{%{@",
|
|
265
|
+
end: meta.options.replaceWrap?.end || "}%}"
|
|
266
|
+
}
|
|
267
|
+
}
|
|
268
|
+
});
|
|
269
|
+
actionExpression.getExpressions().filter((it) => it.type === "replace").forEach((it) => {
|
|
270
|
+
try {
|
|
271
|
+
const sr = FunctionUtils.executeReturn({ script: it.script, context: this, args: helperHostSet });
|
|
272
|
+
actionExpression.replace(it, sr);
|
|
273
|
+
} catch (e) {
|
|
274
|
+
console.error(`[SWC] Failed to execute connectedInnerHTML:`, e);
|
|
275
|
+
}
|
|
276
|
+
});
|
|
277
|
+
res = actionExpression.getUnprocessedTemplate();
|
|
278
|
+
if (res !== void 0) {
|
|
279
|
+
if (meta.options.useShadow || conf?.useShadow) sContent += res;
|
|
280
|
+
else lContent += res;
|
|
281
|
+
}
|
|
282
|
+
}
|
|
283
|
+
try {
|
|
284
|
+
if (this.shadowRoot) {
|
|
285
|
+
this.shadowRoot.innerHTML = sContent;
|
|
286
|
+
}
|
|
287
|
+
if (lContent) {
|
|
288
|
+
this.innerHTML = lContent;
|
|
289
|
+
}
|
|
290
|
+
} catch (e) {
|
|
291
|
+
console.error("[ElementDefine] innerHTML setting error:", e);
|
|
292
|
+
}
|
|
296
293
|
}
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
return bStop - aStop;
|
|
294
|
+
const root = this.getRootNode();
|
|
295
|
+
if (!globalDelegatedRoots.has(root)) {
|
|
296
|
+
DOM_EVENT_NAMES.forEach((type) => {
|
|
297
|
+
root.addEventListener(type, handleGlobalSwcEvent);
|
|
302
298
|
});
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
299
|
+
globalDelegatedRoots.add(root);
|
|
300
|
+
}
|
|
301
|
+
const delegateListeners = [];
|
|
302
|
+
const nonDelegateListeners = [];
|
|
303
|
+
addEventListenerList.forEach((meta) => {
|
|
304
|
+
if (meta.options.delegate && meta.selector !== ":window" && meta.selector !== ":document" && meta.selector !== ":parentHost" && meta.selector !== ":appHost" && meta.selector !== ":firstHost" && meta.selector !== ":lastHost" && meta.selector !== ":firstAppHost" && meta.selector !== ":lastAppHost" && meta.selector !== ":hosts" && meta.selector !== ":appHosts" && meta.selector !== ":host" && meta.selector !== "") {
|
|
305
|
+
delegateListeners.push(meta);
|
|
306
|
+
} else {
|
|
307
|
+
nonDelegateListeners.push(meta);
|
|
308
|
+
}
|
|
309
|
+
});
|
|
310
|
+
const delegatesByTypeAndRoot = /* @__PURE__ */ new Map();
|
|
311
|
+
delegateListeners.forEach((meta) => {
|
|
312
|
+
const r = meta.options.root || "auto";
|
|
313
|
+
const rootKey = `${meta.type}:${r}`;
|
|
314
|
+
if (!delegatesByTypeAndRoot.has(rootKey)) {
|
|
315
|
+
delegatesByTypeAndRoot.set(rootKey, []);
|
|
316
|
+
}
|
|
317
|
+
delegatesByTypeAndRoot.get(rootKey).push(meta);
|
|
318
|
+
});
|
|
319
|
+
delegatesByTypeAndRoot.forEach((metaList, typeRootKey) => {
|
|
320
|
+
const [type, rStr] = typeRootKey.split(":");
|
|
321
|
+
const r = rStr === "auto" ? "auto" : rStr;
|
|
322
|
+
const opts = { capture: metaList[0].options.capture, once: metaList[0].options.once, passive: metaList[0].options.passive };
|
|
323
|
+
const bindRoots = [];
|
|
324
|
+
if (r === "auto") bindRoots.push(this.shadowRoot || this);
|
|
325
|
+
else if (r === "light") bindRoots.push(this);
|
|
326
|
+
else if (r === "shadow" && this.shadowRoot) bindRoots.push(this.shadowRoot);
|
|
327
|
+
else if (r === "all") {
|
|
328
|
+
bindRoots.push(this);
|
|
329
|
+
if (this.shadowRoot) bindRoots.push(this.shadowRoot);
|
|
330
|
+
}
|
|
331
|
+
bindRoots.forEach((br) => {
|
|
332
|
+
const sortedMetaList = [...metaList].sort((a, b) => {
|
|
333
|
+
const aStop = a.options.stopPropagation ? 1 : 0;
|
|
334
|
+
const bStop = b.options.stopPropagation ? 1 : 0;
|
|
335
|
+
return bStop - aStop;
|
|
336
|
+
});
|
|
337
|
+
const unifiedHandler = async (event) => {
|
|
338
|
+
for (const meta of sortedMetaList) {
|
|
339
|
+
const { selector, options } = meta;
|
|
340
|
+
const matchedEl = event.target.closest(selector);
|
|
341
|
+
if (matchedEl && br.contains(matchedEl)) {
|
|
342
|
+
if (options.filter) {
|
|
343
|
+
const helper = SwcUtils.getHelperAndHostSet(currentWin, matchedEl);
|
|
344
|
+
if (!options.filter(event, helper)) {
|
|
345
|
+
continue;
|
|
346
|
+
}
|
|
312
347
|
}
|
|
348
|
+
if (options.stopPropagation) event.stopPropagation();
|
|
349
|
+
if (options.stopImmediatePropagation) event.stopImmediatePropagation();
|
|
350
|
+
if (options.preventDefault) event.preventDefault();
|
|
351
|
+
const currentHostSet = SwcUtils.getHostSet(this);
|
|
352
|
+
const args = { event, ...currentHostSet, $el: matchedEl, $root: br };
|
|
353
|
+
await this[meta.propertyKey](event, { ...currentHostSet, $matchedElement: matchedEl }, args);
|
|
354
|
+
if (event.cancelBubble) break;
|
|
313
355
|
}
|
|
314
|
-
if (options.stopPropagation) event.stopPropagation();
|
|
315
|
-
if (options.stopImmediatePropagation) event.stopImmediatePropagation();
|
|
316
|
-
if (options.preventDefault) event.preventDefault();
|
|
317
|
-
const currentHostSet = SwcUtils.getHostSet(this);
|
|
318
|
-
const args = { event, ...currentHostSet, $el: matchedEl, $root: br };
|
|
319
|
-
await this[meta.propertyKey](event, currentHostSet, matchedEl, args);
|
|
320
|
-
if (event.cancelBubble) break;
|
|
321
356
|
}
|
|
357
|
+
};
|
|
358
|
+
br.addEventListener(type, unifiedHandler, opts);
|
|
359
|
+
this._boundListeners.push({ target: br, type, handler: unifiedHandler, options: opts });
|
|
360
|
+
});
|
|
361
|
+
});
|
|
362
|
+
nonDelegateListeners.forEach((meta) => {
|
|
363
|
+
const { selector, type, options } = meta;
|
|
364
|
+
const opts = { capture: options.capture, once: options.once, passive: options.passive };
|
|
365
|
+
const bindTargets = [];
|
|
366
|
+
const r = options.root || "auto";
|
|
367
|
+
const applyRootOption = (target) => {
|
|
368
|
+
if (!target) return;
|
|
369
|
+
if (r === "auto") {
|
|
370
|
+
bindTargets.push(target.shadowRoot || target);
|
|
371
|
+
} else {
|
|
372
|
+
if (r === "light" || r === "all") bindTargets.push(target);
|
|
373
|
+
if ((r === "shadow" || r === "all") && target.shadowRoot) bindTargets.push(target.shadowRoot);
|
|
322
374
|
}
|
|
323
375
|
};
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
if (!
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
if (r === "light"
|
|
339
|
-
if (
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
else if (selector === ":lastHost") applyRootOption(hostSet.$lastHost);
|
|
348
|
-
else if (selector === ":firstAppHost") applyRootOption(hostSet.$firstAppHost);
|
|
349
|
-
else if (selector === ":lastAppHost") applyRootOption(hostSet.$lastAppHost);
|
|
350
|
-
else if (selector === ":hosts") hostSet.$hosts.forEach(applyRootOption);
|
|
351
|
-
else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRootOption);
|
|
352
|
-
else if (selector === ":host" || !selector) applyRootOption(this);
|
|
353
|
-
else {
|
|
354
|
-
const searchRoots = [];
|
|
355
|
-
if (r === "auto") searchRoots.push(this.shadowRoot || this);
|
|
356
|
-
else if (r === "light") searchRoots.push(this);
|
|
357
|
-
else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
|
|
358
|
-
else if (r === "all") {
|
|
359
|
-
searchRoots.push(this);
|
|
360
|
-
if (this.shadowRoot) searchRoots.push(this.shadowRoot);
|
|
376
|
+
if (selector === ":window") bindTargets.push(currentWin);
|
|
377
|
+
else if (selector === ":document") bindTargets.push(currentWin.document);
|
|
378
|
+
else if (selector === ":parentHost") applyRootOption(helperHostSet.$parentHost);
|
|
379
|
+
else if (selector === ":appHost") applyRootOption(helperHostSet.$appHost);
|
|
380
|
+
else if (selector === ":firstHost") applyRootOption(helperHostSet.$firstHost);
|
|
381
|
+
else if (selector === ":lastHost") applyRootOption(helperHostSet.$lastHost);
|
|
382
|
+
else if (selector === ":firstAppHost") applyRootOption(helperHostSet.$firstAppHost);
|
|
383
|
+
else if (selector === ":lastAppHost") applyRootOption(helperHostSet.$lastAppHost);
|
|
384
|
+
else if (selector === ":hosts") helperHostSet.$hosts.forEach(applyRootOption);
|
|
385
|
+
else if (selector === ":appHosts") helperHostSet.$appHosts.forEach(applyRootOption);
|
|
386
|
+
else if (selector === ":host" || !selector) applyRootOption(this);
|
|
387
|
+
else {
|
|
388
|
+
const searchRoots = [];
|
|
389
|
+
if (r === "auto") searchRoots.push(this.shadowRoot || this);
|
|
390
|
+
else if (r === "light") searchRoots.push(this);
|
|
391
|
+
else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
|
|
392
|
+
else if (r === "all") {
|
|
393
|
+
searchRoots.push(this);
|
|
394
|
+
if (this.shadowRoot) searchRoots.push(this.shadowRoot);
|
|
395
|
+
}
|
|
396
|
+
searchRoots.forEach((sr) => {
|
|
397
|
+
sr.querySelectorAll(selector).forEach((el) => bindTargets.push(el));
|
|
398
|
+
});
|
|
361
399
|
}
|
|
362
|
-
|
|
363
|
-
|
|
400
|
+
bindTargets.forEach((t) => {
|
|
401
|
+
const handler = async (event) => {
|
|
402
|
+
if (options.filter) {
|
|
403
|
+
const helper = SwcUtils.getHelperAndHostSet(currentWin, t);
|
|
404
|
+
if (!options.filter(event, { currentThis: this, helper })) {
|
|
405
|
+
return;
|
|
406
|
+
}
|
|
407
|
+
}
|
|
408
|
+
if (options.stopPropagation) event.stopPropagation();
|
|
409
|
+
if (options.stopImmediatePropagation) event.stopImmediatePropagation();
|
|
410
|
+
if (options.preventDefault) event.preventDefault();
|
|
411
|
+
const currentHostSet = SwcUtils.getHostSet(this);
|
|
412
|
+
const args = { event, ...currentHostSet, $el: t, $root: t };
|
|
413
|
+
await this[meta.propertyKey](event, { currentHostSet, $$matchedElement: event.currentTarget }, args);
|
|
414
|
+
};
|
|
415
|
+
t.addEventListener(type, handler, opts);
|
|
416
|
+
if (options.removeOnDisconnected === true || t === currentWin || t === currentWin.document) {
|
|
417
|
+
this._boundListeners.push({ target: t, type, handler, options: opts });
|
|
418
|
+
}
|
|
364
419
|
});
|
|
420
|
+
});
|
|
421
|
+
if (originalConnected) await originalConnected.apply(this);
|
|
422
|
+
const aMethods = findAllLifecycleMetadata(this, ON_AFTER_CONNECTED_METADATA_KEY);
|
|
423
|
+
if (aMethods) {
|
|
424
|
+
for (const m of aMethods) await this._invokeLifecycleMethod(m, helperHostSet);
|
|
365
425
|
}
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
426
|
+
this._executeSwcScript("swc-on-connected", helperHostSet);
|
|
427
|
+
this._executeSwcScript("swc-on-after-connected", helperHostSet);
|
|
428
|
+
this.__swc_connected = true;
|
|
429
|
+
for (let [name2, metaList] of Array.from(attrChangeMap)) {
|
|
430
|
+
for (const meta of metaList) {
|
|
431
|
+
if (meta.options.while === "connected") {
|
|
432
|
+
const val = getAttributeValue(this, name2, { type: meta.options.type });
|
|
433
|
+
if (val !== null) {
|
|
434
|
+
await this[meta.propertyKey](val, null, name2, helperHostSet);
|
|
372
435
|
}
|
|
373
436
|
}
|
|
374
|
-
if (options.stopPropagation) event.stopPropagation();
|
|
375
|
-
if (options.stopImmediatePropagation) event.stopImmediatePropagation();
|
|
376
|
-
if (options.preventDefault) event.preventDefault();
|
|
377
|
-
const currentHostSet = SwcUtils.getHostSet(this);
|
|
378
|
-
const args = { event, ...currentHostSet, $el: t, $root: t };
|
|
379
|
-
await this[meta.propertyKey](event, currentHostSet, args);
|
|
380
|
-
};
|
|
381
|
-
t.addEventListener(type, handler, opts);
|
|
382
|
-
if (options.removeOnDisconnected === true || t === currentWin || t === currentWin.document) {
|
|
383
|
-
this._boundListeners.push({ target: t, type, handler, options: opts });
|
|
384
437
|
}
|
|
385
|
-
}
|
|
386
|
-
}
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
for (const m of aMethods) this._invokeLifecycleMethod(m, hostSet);
|
|
391
|
-
}
|
|
392
|
-
this._executeSwcScript("swc-on-connected", hostSet);
|
|
393
|
-
this._executeSwcScript("swc-on-after-connected", hostSet);
|
|
394
|
-
this.__swc_connected = true;
|
|
395
|
-
const appHostss = SwcUtils.findAllParentAppHostsDirect(this);
|
|
396
|
-
if (appHost && typeof appHost._connected === "function") {
|
|
397
|
-
appHost._connected(this);
|
|
398
|
-
} else if (appHost && typeof appHost) {
|
|
399
|
-
appHost._connected_safari ?? (appHost._connected_safari = []);
|
|
400
|
-
appHost._connected_safari.push(this);
|
|
438
|
+
}
|
|
439
|
+
} finally {
|
|
440
|
+
if (appHost && typeof appHost._connectedDone === "function") {
|
|
441
|
+
await appHost._connectedDone(this);
|
|
442
|
+
}
|
|
401
443
|
}
|
|
402
444
|
};
|
|
403
445
|
const originalDisconnected = proto.disconnectedCallback;
|
|
404
446
|
proto.disconnectedCallback = function() {
|
|
405
|
-
|
|
406
|
-
|
|
447
|
+
console.log("disconnnnnnnnnnnnnnnnnnn", helperHostSet, this);
|
|
448
|
+
const appHost = helperHostSet.$appHost;
|
|
449
|
+
if (appHost && typeof appHost._disconnected === "function") {
|
|
450
|
+
appHost._disconnected(this);
|
|
451
|
+
}
|
|
452
|
+
this._executeSwcScript("swc-on-before-disconnected", helperHostSet);
|
|
407
453
|
const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_DISCONNECTED_METADATA_KEY);
|
|
408
454
|
if (bMethods) {
|
|
409
|
-
for (const m of bMethods) this._invokeLifecycleMethod(m,
|
|
455
|
+
for (const m of bMethods) this._invokeLifecycleMethod(m, helperHostSet);
|
|
410
456
|
}
|
|
411
457
|
if (this._boundListeners) {
|
|
412
458
|
this._boundListeners.forEach((l) => l.target.removeEventListener(l.type, l.handler, l.options));
|
|
@@ -415,15 +461,11 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
415
461
|
if (originalDisconnected) originalDisconnected.apply(this);
|
|
416
462
|
const aMethods = findAllLifecycleMetadata(this, ON_AFTER_DISCONNECTED_METADATA_KEY);
|
|
417
463
|
if (aMethods) {
|
|
418
|
-
for (const m of aMethods) this._invokeLifecycleMethod(m,
|
|
464
|
+
for (const m of aMethods) this._invokeLifecycleMethod(m, helperHostSet);
|
|
419
465
|
}
|
|
420
|
-
this._executeSwcScript("swc-on-disconnected",
|
|
421
|
-
this._executeSwcScript("swc-on-after-disconnected",
|
|
466
|
+
this._executeSwcScript("swc-on-disconnected", helperHostSet);
|
|
467
|
+
this._executeSwcScript("swc-on-after-disconnected", helperHostSet);
|
|
422
468
|
this.__swc_connected = false;
|
|
423
|
-
const appHost = hostSet.$appHost;
|
|
424
|
-
if (appHost && typeof appHost._disconnected === "function") {
|
|
425
|
-
appHost._disconnected(this);
|
|
426
|
-
}
|
|
427
469
|
};
|
|
428
470
|
const originalAdopted = proto.adoptedCallback;
|
|
429
471
|
proto.adoptedCallback = function() {
|
|
@@ -448,12 +490,12 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
448
490
|
let processedVal = newVal;
|
|
449
491
|
if (newVal !== null) {
|
|
450
492
|
const ae = new ActionExpression(newVal);
|
|
451
|
-
const expr = ae.getFirstExpression("
|
|
493
|
+
const expr = ae.getFirstExpression("callReturn");
|
|
452
494
|
if (expr) {
|
|
453
495
|
const win2 = this._resolveWindow?.() || (typeof window !== "undefined" ? window : void 0);
|
|
454
496
|
const helperAndHostSet = SwcUtils.getHelperAndHostSet(win2, this);
|
|
497
|
+
const script = ConvertUtils.decodeHtmlEntity(expr.script, win2.document);
|
|
455
498
|
try {
|
|
456
|
-
const script = ConvertUtils.decodeHtmlEntity(expr.script, win2.document);
|
|
457
499
|
const result = FunctionUtils.executeReturn({
|
|
458
500
|
script,
|
|
459
501
|
context: this,
|
|
@@ -479,6 +521,9 @@ const elementDefine = (name, config = {}) => (constructor) => {
|
|
|
479
521
|
const metaList = attrChangeMap.get(name2);
|
|
480
522
|
if (metaList && Array.isArray(metaList)) {
|
|
481
523
|
for (const meta of metaList) {
|
|
524
|
+
if (meta.options.while === "connected" && !this.__swc_connected) {
|
|
525
|
+
continue;
|
|
526
|
+
}
|
|
482
527
|
const convertedVal = convertAttributeValue(processedVal, meta.options.type);
|
|
483
528
|
this[meta.propertyKey](convertedVal, old, name2, hSet);
|
|
484
529
|
}
|