@dooboostore/simple-web-component 1.0.22 → 1.0.24
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 +568 -32
- package/dist/cjs/decorators/applyNode.js +195 -26
- package/dist/cjs/decorators/applyNode.js.map +2 -2
- package/dist/cjs/decorators/attribute.js +21 -3
- package/dist/cjs/decorators/attribute.js.map +2 -2
- package/dist/cjs/decorators/changedAttributeHost.js.map +2 -2
- package/dist/cjs/decorators/classList.js +82 -19
- package/dist/cjs/decorators/classList.js.map +2 -2
- package/dist/cjs/decorators/elementDefine.js +1 -2
- package/dist/cjs/decorators/elementDefine.js.map +2 -2
- package/dist/cjs/decorators/index.js +0 -1
- package/dist/cjs/decorators/index.js.map +2 -2
- package/dist/cjs/decorators/lifecycles.js +25 -0
- package/dist/cjs/decorators/lifecycles.js.map +2 -2
- package/dist/cjs/decorators/query.js +77 -2
- package/dist/cjs/decorators/query.js.map +2 -2
- package/dist/cjs/decorators/queryAll.js +77 -2
- package/dist/cjs/decorators/queryAll.js.map +2 -2
- package/dist/cjs/decorators/setAttribute.js +4 -4
- package/dist/cjs/decorators/setAttribute.js.map +2 -2
- package/dist/cjs/decorators/style.js +70 -13
- package/dist/cjs/decorators/style.js.map +2 -2
- package/dist/cjs/index.js +4 -4
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/utils/Utils.js +140 -1
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/decorators/applyNode.js +195 -26
- package/dist/esm/decorators/applyNode.js.map +2 -2
- package/dist/esm/decorators/attribute.js +21 -3
- package/dist/esm/decorators/attribute.js.map +2 -2
- package/dist/esm/decorators/changedAttributeHost.js.map +2 -2
- package/dist/esm/decorators/classList.js +82 -19
- package/dist/esm/decorators/classList.js.map +2 -2
- package/dist/esm/decorators/elementDefine.js +1 -2
- package/dist/esm/decorators/elementDefine.js.map +2 -2
- package/dist/esm/decorators/index.js +0 -1
- package/dist/esm/decorators/index.js.map +2 -2
- package/dist/esm/decorators/lifecycles.js +25 -0
- package/dist/esm/decorators/lifecycles.js.map +2 -2
- package/dist/esm/decorators/query.js +77 -2
- package/dist/esm/decorators/query.js.map +2 -2
- package/dist/esm/decorators/queryAll.js +77 -2
- package/dist/esm/decorators/queryAll.js.map +2 -2
- package/dist/esm/decorators/setAttribute.js +4 -4
- package/dist/esm/decorators/setAttribute.js.map +2 -2
- package/dist/esm/decorators/style.js +70 -13
- package/dist/esm/decorators/style.js.map +2 -2
- package/dist/esm/index.js +4 -4
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/utils/Utils.js +140 -1
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +678 -168
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
- package/dist/types/decorators/applyNode.d.ts +107 -2
- package/dist/types/decorators/applyNode.d.ts.map +1 -1
- package/dist/types/decorators/attribute.d.ts +11 -4
- package/dist/types/decorators/attribute.d.ts.map +1 -1
- package/dist/types/decorators/classList.d.ts +22 -10
- package/dist/types/decorators/classList.d.ts.map +1 -1
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- package/dist/types/decorators/index.d.ts +0 -1
- package/dist/types/decorators/index.d.ts.map +1 -1
- package/dist/types/decorators/lifecycles.d.ts +14 -0
- package/dist/types/decorators/lifecycles.d.ts.map +1 -1
- package/dist/types/decorators/query.d.ts +68 -7
- package/dist/types/decorators/query.d.ts.map +1 -1
- package/dist/types/decorators/queryAll.d.ts +70 -1
- package/dist/types/decorators/queryAll.d.ts.map +1 -1
- package/dist/types/decorators/setAttribute.d.ts.map +1 -1
- package/dist/types/decorators/style.d.ts +37 -3
- package/dist/types/decorators/style.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -2
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/utils/Utils.d.ts +49 -0
- package/dist/types/utils/Utils.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +678 -168
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
- package/package.json +2 -2
- package/src/decorators/applyNode.ts +319 -37
- package/src/decorators/attribute.ts +44 -11
- package/src/decorators/changedAttributeHost.ts +1 -1
- package/src/decorators/classList.ts +107 -22
- package/src/decorators/elementDefine.ts +1 -2
- package/src/decorators/index.ts +0 -1
- package/src/decorators/lifecycles.ts +40 -0
- package/src/decorators/query.ts +147 -7
- package/src/decorators/queryAll.ts +148 -2
- package/src/decorators/setAttribute.ts +6 -5
- package/src/decorators/style.ts +109 -13
- package/src/index.ts +6 -6
- package/src/utils/Utils.ts +144 -0
- package/dist/cjs/decorators/onConnectedInnerHtml.js +0 -48
- package/dist/cjs/decorators/onConnectedInnerHtml.js.map +0 -7
- package/dist/cjs/utils/TemplateUtils.js +0 -103
- package/dist/cjs/utils/TemplateUtils.js.map +0 -7
- package/dist/esm/decorators/onConnectedInnerHtml.js +0 -29
- package/dist/esm/decorators/onConnectedInnerHtml.js.map +0 -7
- package/dist/esm/utils/TemplateUtils.js +0 -84
- package/dist/esm/utils/TemplateUtils.js.map +0 -7
- package/dist/types/decorators/onConnectedInnerHtml.d.ts +0 -15
- package/dist/types/decorators/onConnectedInnerHtml.d.ts.map +0 -1
- package/dist/types/utils/TemplateUtils.d.ts +0 -54
- package/dist/types/utils/TemplateUtils.d.ts.map +0 -1
- package/src/decorators/onConnectedInnerHtml.ts +0 -42
- package/src/utils/TemplateUtils.ts +0 -83
|
@@ -18,13 +18,32 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
|
|
|
18
18
|
var applyNode_exports = {};
|
|
19
19
|
__export(applyNode_exports, {
|
|
20
20
|
APPLY_NODE_METADATA_KEY: () => APPLY_NODE_METADATA_KEY,
|
|
21
|
+
applyAfterBeginNode: () => applyAfterBeginNode,
|
|
22
|
+
applyAfterBeginNodeHost: () => applyAfterBeginNodeHost,
|
|
23
|
+
applyAfterEndNode: () => applyAfterEndNode,
|
|
24
|
+
applyAfterEndNodeHost: () => applyAfterEndNodeHost,
|
|
25
|
+
applyBeforeBeginNode: () => applyBeforeBeginNode,
|
|
26
|
+
applyBeforeBeginNodeHost: () => applyBeforeBeginNodeHost,
|
|
27
|
+
applyBeforeEndNode: () => applyBeforeEndNode,
|
|
28
|
+
applyBeforeEndNodeHost: () => applyBeforeEndNodeHost,
|
|
29
|
+
applyInnerHtmlNode: () => applyInnerHtmlNode,
|
|
30
|
+
applyInnerHtmlNodeHost: () => applyInnerHtmlNodeHost,
|
|
31
|
+
applyInnerTextNode: () => applyInnerTextNode,
|
|
32
|
+
applyInnerTextNodeHost: () => applyInnerTextNodeHost,
|
|
21
33
|
applyNode: () => applyNode,
|
|
22
34
|
applyNodeHost: () => applyNodeHost,
|
|
35
|
+
applyRemoveNode: () => applyRemoveNode,
|
|
36
|
+
applyRemoveNodeHost: () => applyRemoveNodeHost,
|
|
37
|
+
applyReplaceChildrenNode: () => applyReplaceChildrenNode,
|
|
38
|
+
applyReplaceChildrenNodeHost: () => applyReplaceChildrenNodeHost,
|
|
39
|
+
applyReplaceNode: () => applyReplaceNode,
|
|
40
|
+
applyReplaceNodeHost: () => applyReplaceNodeHost,
|
|
23
41
|
findAllApplyNodeMetadata: () => findAllApplyNodeMetadata
|
|
24
42
|
});
|
|
25
43
|
module.exports = __toCommonJS(applyNode_exports);
|
|
26
44
|
var import_core = require("@dooboostore/core");
|
|
27
45
|
var import_elementDefine = require("./elementDefine");
|
|
46
|
+
var import_Utils = require("../utils/Utils");
|
|
28
47
|
const APPLY_NODE_METADATA_KEY = Symbol("simple-web-component:apply-node");
|
|
29
48
|
const normalizeNodes = (res, doc) => {
|
|
30
49
|
const items = Array.isArray(res) ? res : [res];
|
|
@@ -51,32 +70,83 @@ function applyNode(selector, options = { position: "beforeEnd" }) {
|
|
|
51
70
|
const conf = (0, import_elementDefine.getElementConfig)(this);
|
|
52
71
|
const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
|
|
53
72
|
const currentDoc = currentWin.document;
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
73
|
+
const pos = options.position || "beforeEnd";
|
|
74
|
+
const r = options.root || "auto";
|
|
75
|
+
const applyRoot = (t) => {
|
|
76
|
+
if (!t || !(t instanceof HTMLElement))
|
|
77
|
+
return t;
|
|
78
|
+
if (r === "auto")
|
|
79
|
+
return t.shadowRoot || t;
|
|
80
|
+
if (r === "shadow")
|
|
81
|
+
return t.shadowRoot;
|
|
82
|
+
if (r === "light")
|
|
83
|
+
return t;
|
|
84
|
+
if (r === "all")
|
|
85
|
+
return t.shadowRoot || t;
|
|
86
|
+
return t;
|
|
87
|
+
};
|
|
88
|
+
const hostSet = import_Utils.SwcUtils.getHostSet(this);
|
|
89
|
+
if (pos === "remove") {
|
|
90
|
+
if (res) {
|
|
91
|
+
if (selector === ":host" || !selector) {
|
|
92
|
+
if (r === "shadow" && this.shadowRoot) {
|
|
93
|
+
this.shadowRoot.replaceChildren();
|
|
94
|
+
} else {
|
|
95
|
+
this.remove();
|
|
96
|
+
}
|
|
97
|
+
} else {
|
|
98
|
+
const targetRoot = applyRoot(this);
|
|
99
|
+
if (targetRoot) {
|
|
100
|
+
const targets = targetRoot.querySelectorAll(selector);
|
|
101
|
+
targets.forEach((el) => el.remove());
|
|
102
|
+
}
|
|
103
|
+
}
|
|
104
|
+
}
|
|
57
105
|
} else {
|
|
58
|
-
targetEl =
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
if (
|
|
64
|
-
targetEl
|
|
65
|
-
} else if (
|
|
66
|
-
targetEl
|
|
67
|
-
} else if (
|
|
68
|
-
targetEl
|
|
69
|
-
} else if (
|
|
70
|
-
targetEl
|
|
106
|
+
let targetEl = null;
|
|
107
|
+
if (selector === ":host") {
|
|
108
|
+
targetEl = applyRoot(this);
|
|
109
|
+
} else if (selector === ":parentHost") {
|
|
110
|
+
targetEl = applyRoot(hostSet.$parentHost);
|
|
111
|
+
} else if (selector === ":appHost") {
|
|
112
|
+
targetEl = applyRoot(hostSet.$appHost);
|
|
113
|
+
} else if (selector === ":firstHost") {
|
|
114
|
+
targetEl = applyRoot(hostSet.$firstHost);
|
|
115
|
+
} else if (selector === ":lastHost") {
|
|
116
|
+
targetEl = applyRoot(hostSet.$lastHost);
|
|
117
|
+
} else if (selector === ":firstAppHost") {
|
|
118
|
+
targetEl = applyRoot(hostSet.$firstHost);
|
|
119
|
+
} else if (selector === ":lastAppHost") {
|
|
120
|
+
targetEl = applyRoot(hostSet.$lastAppHost);
|
|
71
121
|
} else {
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
122
|
+
const targetRoot = applyRoot(this);
|
|
123
|
+
targetEl = targetRoot ? targetRoot.querySelector(selector) : null;
|
|
124
|
+
}
|
|
125
|
+
if (targetEl) {
|
|
126
|
+
const isShadowRoot = targetEl instanceof ShadowRoot;
|
|
127
|
+
const nodes = normalizeNodes(res, currentDoc);
|
|
128
|
+
if (pos === "replace") {
|
|
129
|
+
if (!isShadowRoot) {
|
|
130
|
+
targetEl.replaceWith(...nodes);
|
|
131
|
+
}
|
|
132
|
+
} else if (pos === "replaceChildren") {
|
|
133
|
+
targetEl.replaceChildren(...nodes);
|
|
134
|
+
} else if (pos === "innerHtml") {
|
|
135
|
+
targetEl.innerHTML = res !== void 0 && res !== null ? String(res) : "";
|
|
136
|
+
} else if (pos === "innerText") {
|
|
137
|
+
if (targetEl.innerText !== void 0) {
|
|
138
|
+
targetEl.innerText = res !== void 0 && res !== null ? String(res) : "";
|
|
139
|
+
}
|
|
140
|
+
} else {
|
|
141
|
+
if (pos === "beforeEnd")
|
|
142
|
+
targetEl.append(...nodes);
|
|
143
|
+
else if (pos === "afterBegin")
|
|
144
|
+
targetEl.prepend(...nodes);
|
|
145
|
+
else if (pos === "beforeBegin" && !isShadowRoot)
|
|
146
|
+
targetEl.before(...nodes);
|
|
147
|
+
else if (pos === "afterEnd" && !isShadowRoot)
|
|
148
|
+
targetEl.after(...nodes);
|
|
149
|
+
}
|
|
80
150
|
}
|
|
81
151
|
}
|
|
82
152
|
}
|
|
@@ -94,7 +164,106 @@ const findAllApplyNodeMetadata = (target) => {
|
|
|
94
164
|
});
|
|
95
165
|
return result;
|
|
96
166
|
};
|
|
97
|
-
function applyNodeHost(
|
|
98
|
-
|
|
167
|
+
function applyNodeHost(targetOrOptions, propertyKey, descriptor) {
|
|
168
|
+
console.log("vvvvv");
|
|
169
|
+
if (propertyKey !== void 0 && typeof propertyKey === "string" || typeof propertyKey === "symbol") {
|
|
170
|
+
return applyNode(":host", { position: "beforeEnd" })(targetOrOptions, propertyKey, descriptor);
|
|
171
|
+
}
|
|
172
|
+
if (typeof targetOrOptions === "object" && targetOrOptions !== null) {
|
|
173
|
+
const options = targetOrOptions;
|
|
174
|
+
return applyNode(":host", { ...options, position: options.position || "beforeEnd" });
|
|
175
|
+
} else {
|
|
176
|
+
return applyNode(":host", { position: "beforeEnd" });
|
|
177
|
+
}
|
|
178
|
+
}
|
|
179
|
+
function applyBeforeBeginNode(selector, options) {
|
|
180
|
+
return applyNode(selector, { ...options, position: "beforeBegin" });
|
|
181
|
+
}
|
|
182
|
+
function applyAfterBeginNode(selector, options) {
|
|
183
|
+
return applyNode(selector, { ...options, position: "afterBegin" });
|
|
184
|
+
}
|
|
185
|
+
function applyBeforeEndNode(selector, options) {
|
|
186
|
+
return applyNode(selector, { ...options, position: "beforeEnd" });
|
|
187
|
+
}
|
|
188
|
+
function applyAfterEndNode(selector, options) {
|
|
189
|
+
return applyNode(selector, { ...options, position: "afterEnd" });
|
|
190
|
+
}
|
|
191
|
+
function applyReplaceNode(selector, options) {
|
|
192
|
+
return applyNode(selector, { ...options, position: "replace" });
|
|
193
|
+
}
|
|
194
|
+
function applyReplaceChildrenNode(selector, options) {
|
|
195
|
+
return applyNode(selector, { ...options, position: "replaceChildren" });
|
|
196
|
+
}
|
|
197
|
+
function applyInnerHtmlNode(selector, options) {
|
|
198
|
+
return applyNode(selector, { ...options, position: "innerHtml" });
|
|
199
|
+
}
|
|
200
|
+
function applyInnerTextNode(selector, options) {
|
|
201
|
+
return applyNode(selector, { ...options, position: "innerText" });
|
|
202
|
+
}
|
|
203
|
+
function applyRemoveNode(selector, options) {
|
|
204
|
+
return applyNode(selector, { ...options, position: "remove" });
|
|
205
|
+
}
|
|
206
|
+
function applyBeforeBeginNodeHost(targetOrOptions, propertyKey, descriptor) {
|
|
207
|
+
if (propertyKey !== void 0) {
|
|
208
|
+
const decorator = applyNode(":host", { position: "beforeBegin" });
|
|
209
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
210
|
+
}
|
|
211
|
+
return applyNode(":host", { ...targetOrOptions || {}, position: "beforeBegin" });
|
|
212
|
+
}
|
|
213
|
+
function applyAfterBeginNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
214
|
+
if (propertyKey !== void 0) {
|
|
215
|
+
const decorator = applyNode(":host", { position: "afterBegin" });
|
|
216
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
217
|
+
}
|
|
218
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "afterBegin" });
|
|
219
|
+
}
|
|
220
|
+
function applyBeforeEndNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
221
|
+
if (propertyKey !== void 0) {
|
|
222
|
+
const decorator = applyNode(":host", { position: "beforeEnd" });
|
|
223
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
224
|
+
}
|
|
225
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "beforeEnd" });
|
|
226
|
+
}
|
|
227
|
+
function applyAfterEndNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
228
|
+
if (propertyKey !== void 0) {
|
|
229
|
+
const decorator = applyNode(":host", { position: "afterEnd" });
|
|
230
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
231
|
+
}
|
|
232
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "afterEnd" });
|
|
233
|
+
}
|
|
234
|
+
function applyReplaceNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
235
|
+
if (propertyKey !== void 0) {
|
|
236
|
+
const decorator = applyNode(":host", { position: "replace" });
|
|
237
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
238
|
+
}
|
|
239
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "replace" });
|
|
240
|
+
}
|
|
241
|
+
function applyReplaceChildrenNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
242
|
+
if (propertyKey !== void 0) {
|
|
243
|
+
const decorator = applyNode(":host", { position: "replaceChildren" });
|
|
244
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
245
|
+
}
|
|
246
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "replaceChildren" });
|
|
247
|
+
}
|
|
248
|
+
function applyInnerHtmlNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
249
|
+
if (propertyKey !== void 0) {
|
|
250
|
+
const decorator = applyNode(":host", { position: "innerHtml" });
|
|
251
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
252
|
+
}
|
|
253
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "innerHtml" });
|
|
254
|
+
}
|
|
255
|
+
function applyInnerTextNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
256
|
+
if (propertyKey !== void 0) {
|
|
257
|
+
const decorator = applyNode(":host", { position: "innerText" });
|
|
258
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
259
|
+
}
|
|
260
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "innerText" });
|
|
261
|
+
}
|
|
262
|
+
function applyRemoveNodeHost(optionsOrTarget, propertyKey, descriptor) {
|
|
263
|
+
if (propertyKey !== void 0) {
|
|
264
|
+
const decorator = applyNode(":host", { position: "remove" });
|
|
265
|
+
return decorator(optionsOrTarget, propertyKey, descriptor);
|
|
266
|
+
}
|
|
267
|
+
return applyNode(":host", { ...optionsOrTarget || {}, position: "remove" });
|
|
99
268
|
}
|
|
100
269
|
//# sourceMappingURL=applyNode.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/applyNode.ts"],
|
|
4
|
-
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\n\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText';\n\nexport interface ApplyNodeOptions {\n position?: ApplyNodePosition;\n}\n\nexport interface ApplyNodeMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n const items = Array.isArray(res) ? res : [res];\n return items.map(it => {\n if (it instanceof Node) return it;\n return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n });\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n * \n * Usage examples:\n * @applyNode('#list') addItem() { return '<li>New Item</li>'; } // append at end\n * @applyNode('#header', { position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; } // prepend at start\n * @applyNode('#item', { position: 'replace' }) replaceItem() { return '<div>Replaced</div>'; } // replace element\n * @applyNode('#list', { position: 'replaceChildren' }) updateList() { return [item1, item2]; } // replace all children\n * \n * Positions:\n * - 'beforeEnd' (default): Append at end of target\n * - 'afterBegin': Prepend at start of target\n * - 'beforeBegin': Insert before target\n * - 'afterEnd': Insert after target\n * - 'replace': Replace the entire target element\n * - 'replaceChildren': Replace all children of target element\n * - 'innerHtml': Set target's innerHTML\n * - 'innerText': Set target's innerText\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = target.constructor;\n let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, ApplyNodeMetadata>();\n ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, options });\n\n const original = descriptor.value;\n descriptor.value = async function (...args: any[]) {\n ensureInit(this);\n const res = await original.apply(this, args);\n if (res !== undefined) {\n const conf = getElementConfig(this);\n const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n const currentDoc = currentWin.document;\n\n let targetEl: HTMLElement | null = null;\n if (selector === ':host' || !selector) {\n targetEl = this as any;\n } else {\n targetEl = (this.shadowRoot || (this as any)).querySelector(selector);\n }\n\n if (targetEl) {\n const nodes = normalizeNodes(res, currentDoc);\n const pos = options.position || 'beforeEnd';\n\n if (pos === 'replace') {\n // Replace the entire target element with new nodes\n targetEl.replaceWith(...nodes);\n } else if (pos === 'replaceChildren') {\n // Replace all children of target element\n targetEl.replaceChildren(...nodes);\n } else if (pos === 'innerHtml') {\n // Set innerHTML\n targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n } else if (pos === 'innerText') {\n // Set innerText\n targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n } else {\n /*\n <!-- beforebegin -->\n <p>\n <!-- afterbegin -->\n foo\n <!-- beforeend -->\n </p>\n <!-- afterend -->\n */\n if (pos === 'beforeEnd') targetEl.append(...nodes);\n else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n else if (pos === 'beforeBegin') targetEl.before(...nodes);\n else if (pos === 'afterEnd') targetEl.after(...nodes);\n }\n }\n }\n return res;\n };\n };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n const result = new Map<string | symbol, ApplyNodeMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n\n/**\n * @applyNodeHost decorator - simplified version of @applyNode for :host selector\n * Usage: @applyNodeHost() addItem() { return '<li>New Item</li>'; }\n * Usage: @applyNodeHost({ position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; }\n */\nexport function applyNodeHost(options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n return applyNode(':host', options);\n}\n"],
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA
|
|
4
|
+
"sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { SwcRootType } from '../types';\nimport {SwcUtils} from \"../utils/Utils\";\n\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText' | 'remove';\n\nexport interface ApplyNodeOptions {\n position?: ApplyNodePosition;\n root?: SwcRootType;\n}\n\nexport interface ApplyNodeMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n const items = Array.isArray(res) ? res : [res];\n return items.map(it => {\n if (it instanceof Node) return it;\n return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n });\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n * \n * Usage examples:\n * @applyNode('#list') addItem() { return '<li>New Item</li>'; } // append at end\n * @applyNode('#header', { position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; } // prepend at start\n * @applyNode('#item', { position: 'replace' }) replaceItem() { return '<div>Replaced</div>'; } // replace element\n * @applyNode('#list', { position: 'replaceChildren' }) updateList() { return [item1, item2]; } // replace all children\n * @applyNode('#notification', { position: 'remove' }) dismissNotification() { return shouldDismiss; } // remove if truthy\n * @applyNode('.items', { position: 'remove', root: 'shadow' }) clearItems() { return true; } // remove shadow DOM elements\n * \n * Positions:\n * - 'beforeEnd' (default): Append at end of target\n * - 'afterBegin': Prepend at start of target\n * - 'beforeBegin': Insert before target\n * - 'afterEnd': Insert after target\n * - 'replace': Replace the entire target element\n * - 'replaceChildren': Replace all children of target element\n * - 'innerHtml': Set target's innerHTML\n * - 'innerText': Set target's innerText\n * - 'remove': Remove target element if returned value is truthy\n * \n * Root Options:\n * - 'auto' (default): Search shadow DOM first, then light DOM\n * - 'shadow': Search only in shadow DOM\n * - 'light': Search only in light DOM\n * - 'all': Use both (shadow preferred for query, both for remove)\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n const constructor = target.constructor;\n let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n if (!metaList) {\n metaList = new Map<string | symbol, ApplyNodeMetadata>();\n ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n }\n metaList.set(propertyKey, { propertyKey, selector, options });\n\n const original = descriptor.value;\n descriptor.value = async function (...args: any[]) {\n ensureInit(this);\n const res = await original.apply(this, args);\n if (res !== undefined) {\n const conf = getElementConfig(this);\n const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n const currentDoc = currentWin.document;\n\n const pos = options.position || 'beforeEnd';\n const r = options.root || 'auto';\n const applyRoot = (t: any) => {\n if (!t || !(t instanceof HTMLElement)) return t;\n if (r === 'auto') return t.shadowRoot || t;\n if (r === 'shadow') return t.shadowRoot;\n if (r === 'light') return t;\n if (r === 'all') return t.shadowRoot || t; // query only returns one, so shadow preferred\n return t;\n };\n\n const hostSet = SwcUtils.getHostSet(this);\n // const getTargetRoot = () => {\n // if (r === 'shadow') return this.shadowRoot;\n // if (r === 'light') return this as any;\n // if (r === 'all') return this.shadowRoot || (this as any);\n // return this.shadowRoot || (this as any); // auto\n // };\n\n if (pos === 'remove') {\n // Remove element(s) if returned value is truthy\n if (res) {\n if (selector === ':host' || !selector) {\n if (r === 'shadow' && this.shadowRoot) {\n // Remove all children from shadow DOM\n this.shadowRoot.replaceChildren();\n } else {\n // Remove the component itself\n (this as any).remove();\n }\n } else {\n const targetRoot = applyRoot(this);\n if (targetRoot) {\n const targets = targetRoot.querySelectorAll(selector);\n targets.forEach((el: Element) => el.remove());\n }\n }\n }\n } else {\n let targetEl: any = null;\n\n if (selector === ':host') {\n targetEl = applyRoot(this)\n } else if (selector === ':parentHost') {\n targetEl = applyRoot(hostSet.$parentHost)\n } else if (selector === ':appHost') {\n targetEl = applyRoot(hostSet.$appHost)\n } else if (selector === ':firstHost') {\n targetEl = applyRoot(hostSet.$firstHost)\n } else if (selector === ':lastHost') {\n targetEl = applyRoot(hostSet.$lastHost)\n } else if (selector === ':firstAppHost') {\n targetEl = applyRoot(hostSet.$firstHost)\n } else if (selector === ':lastAppHost') {\n targetEl = applyRoot(hostSet.$lastAppHost);\n } else {\n const targetRoot = applyRoot(this);\n targetEl = targetRoot ? targetRoot.querySelector(selector) : null;\n }\n\n if (targetEl) {\n const isShadowRoot = targetEl instanceof ShadowRoot;\n const nodes = normalizeNodes(res, currentDoc);\n\n if (pos === 'replace') {\n // ShadowRoot doesn't support replaceWith\n if (!isShadowRoot) {\n targetEl.replaceWith(...nodes);\n }\n } else if (pos === 'replaceChildren') {\n // Replace all children of target element\n targetEl.replaceChildren(...nodes);\n } else if (pos === 'innerHtml') {\n // Set innerHTML\n targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n } else if (pos === 'innerText') {\n // Set innerText\n if (targetEl.innerText !== undefined) {\n targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n }\n } else {\n /*\n <!-- beforebegin -->\n <p>\n <!-- afterbegin -->\n foo\n <!-- beforeend -->\n </p>\n <!-- afterend -->\n */\n if (pos === 'beforeEnd') targetEl.append(...nodes);\n else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n }\n }\n }\n }\n return res;\n };\n };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n const result = new Map<string | symbol, ApplyNodeMetadata>();\n const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_METADATA_KEY, target);\n maps.forEach(map => {\n if (map instanceof Map) {\n map.forEach((v, k) => result.set(k, v));\n }\n });\n return result;\n};\n\n/**\n * @applyNodeHost decorator - simplified version of @applyNode for :host selector\n * Usage: @applyNodeHost addItem() { return '<li>New Item</li>'; }\n * Usage: @applyNodeHost() addItem() { return '<li>New Item</li>'; }\n * Usage: @applyNodeHost({ position: 'afterBegin' }) prependItem() { return '<h1>Title</h1>'; }\n */\nexport function applyNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeHost(): MethodDecorator;\nexport function applyNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n // Direct decorator usage: @applyNodeHost (no parentheses)\n console.log('vvvvv')\n if (propertyKey !== undefined && typeof propertyKey === 'string' || typeof propertyKey === 'symbol') {\n return applyNode(':host', { position: 'beforeEnd' })(targetOrOptions, propertyKey, descriptor);\n }\n\n // @applyNodeHost() or @applyNodeHost(options)\n if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {\n const options = targetOrOptions as ApplyNodeOptions;\n return applyNode(':host', { ...options, position: options.position || 'beforeEnd' });\n } else {\n // @applyNodeHost() - use default position\n return applyNode(':host', { position: 'beforeEnd' });\n }\n}\n\n// Convenience decorators for specific positions\n\n/**\n * @applyBeforeBeginNode - Insert before target element\n */\nexport function applyBeforeBeginNode(selector: string): MethodDecorator;\nexport function applyBeforeBeginNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeBeginNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'beforeBegin' });\n}\n\n/**\n * @applyAfterBeginNode - Prepend to target element\n */\nexport function applyAfterBeginNode(selector: string): MethodDecorator;\nexport function applyAfterBeginNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterBeginNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'afterBegin' });\n}\n\n/**\n * @applyBeforeEndNode - Append to target element (default)\n */\nexport function applyBeforeEndNode(selector: string): MethodDecorator;\nexport function applyBeforeEndNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeEndNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'beforeEnd' });\n}\n\n/**\n * @applyAfterEndNode - Insert after target element\n */\nexport function applyAfterEndNode(selector: string): MethodDecorator;\nexport function applyAfterEndNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterEndNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'afterEnd' });\n}\n\n/**\n * @applyReplaceNode - Replace entire target element\n */\nexport function applyReplaceNode(selector: string): MethodDecorator;\nexport function applyReplaceNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'replace' });\n}\n\n/**\n * @applyReplaceChildrenNode - Replace all children of target element\n */\nexport function applyReplaceChildrenNode(selector: string): MethodDecorator;\nexport function applyReplaceChildrenNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'replaceChildren' });\n}\n\n/**\n * @applyInnerHtmlNode - Set target's innerHTML\n */\nexport function applyInnerHtmlNode(selector: string): MethodDecorator;\nexport function applyInnerHtmlNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'innerHtml' });\n}\n\n/**\n * @applyInnerTextNode - Set target's innerText\n */\nexport function applyInnerTextNode(selector: string): MethodDecorator;\nexport function applyInnerTextNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerTextNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'innerText' });\n}\n\n/**\n * @applyRemoveNode - Remove target element if truthy\n */\nexport function applyRemoveNode(selector: string): MethodDecorator;\nexport function applyRemoveNode(selector: string, options: ApplyNodeOptions): MethodDecorator;\nexport function applyRemoveNode(selector: string, options?: ApplyNodeOptions): any {\n return applyNode(selector, { ...options, position: 'remove' });\n}\n\n// Host versions\n\n/**\n * @applyBeforeBeginNodeHost - Insert before :host\n */\nexport function applyBeforeBeginNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;\nexport function applyBeforeBeginNodeHost(): MethodDecorator;\nexport function applyBeforeBeginNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeBeginNodeHost(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'beforeBegin' });\n return decorator(targetOrOptions, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(targetOrOptions as ApplyNodeOptions || {}), position: 'beforeBegin' });\n}\n\n/**\n * @applyAfterBeginNodeHost - Prepend to :host\n */export function applyAfterBeginNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyAfterBeginNodeHost(): MethodDecorator;\nexport function applyAfterBeginNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterBeginNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'afterBegin' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'afterBegin' });\n}\n\n/**\n * @applyBeforeEndNodeHost - Append to :host\n */export function applyBeforeEndNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyBeforeEndNodeHost(): MethodDecorator;\nexport function applyBeforeEndNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyBeforeEndNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'beforeEnd' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'beforeEnd' });\n}\n\n/**\n * @applyAfterEndNodeHost - Insert after :host\n */export function applyAfterEndNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyAfterEndNodeHost(): MethodDecorator;\nexport function applyAfterEndNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyAfterEndNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'afterEnd' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'afterEnd' });\n}\n\n/**\n * @applyReplaceNodeHost - Replace :host\n */export function applyReplaceNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyReplaceNodeHost(): MethodDecorator;\nexport function applyReplaceNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'replace' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'replace' });\n}\n\n/**\n * @applyReplaceChildrenNodeHost - Replace children of :host\n */export function applyReplaceChildrenNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyReplaceChildrenNodeHost(): MethodDecorator;\nexport function applyReplaceChildrenNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'replaceChildren' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'replaceChildren' });\n}\n\n/**\n * @applyInnerHtmlNodeHost - Set :host innerHTML\n */export function applyInnerHtmlNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyInnerHtmlNodeHost(): MethodDecorator;\nexport function applyInnerHtmlNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'innerHtml' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'innerHtml' });\n}\n\n/**\n * @applyInnerTextNodeHost - Set :host innerText\n */export function applyInnerTextNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyInnerTextNodeHost(): MethodDecorator;\nexport function applyInnerTextNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerTextNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'innerText' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'innerText' });\n}\n\n/**\n * @applyRemoveNodeHost - Remove :host if truthy\n */export function applyRemoveNodeHost(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): any;export function applyRemoveNodeHost(): MethodDecorator;\nexport function applyRemoveNodeHost(options: ApplyNodeOptions): MethodDecorator;\nexport function applyRemoveNodeHost(optionsOrTarget?: ApplyNodeOptions | any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n if (propertyKey !== undefined) {\n const decorator = applyNode(':host', { position: 'remove' });\n return decorator(optionsOrTarget, propertyKey, descriptor);\n }\n return applyNode(':host', { ...(optionsOrTarget as ApplyNodeOptions || {}), position: 'remove' });\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -128,7 +128,6 @@ function attribute(selector, options = {}) {
|
|
|
128
128
|
},
|
|
129
129
|
set(nv) {
|
|
130
130
|
const targetType = options.type || designType;
|
|
131
|
-
console.log("---set", propertyKey, targetType, nv, this, this.__swc_syncing_init);
|
|
132
131
|
const attrName = options.name || String(propertyKey);
|
|
133
132
|
const conf = (0, import_elementDefine.getElementConfig)(this);
|
|
134
133
|
const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
|
|
@@ -156,7 +155,26 @@ function attribute(selector, options = {}) {
|
|
|
156
155
|
const findAllAttributeMetadata = (target) => {
|
|
157
156
|
return import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_METADATA_KEY, target).flat();
|
|
158
157
|
};
|
|
159
|
-
function attributeHost(
|
|
160
|
-
|
|
158
|
+
function attributeHost(targetOrAttrOrOptions, propertyKeyOrOptions) {
|
|
159
|
+
if (propertyKeyOrOptions !== void 0 && (typeof propertyKeyOrOptions === "string" || typeof propertyKeyOrOptions === "symbol")) {
|
|
160
|
+
const fieldName = String(propertyKeyOrOptions);
|
|
161
|
+
return attribute(":host", { name: fieldName })(targetOrAttrOrOptions, propertyKeyOrOptions);
|
|
162
|
+
}
|
|
163
|
+
if (typeof targetOrAttrOrOptions === "string") {
|
|
164
|
+
const attrName = targetOrAttrOrOptions;
|
|
165
|
+
const options = typeof propertyKeyOrOptions === "object" ? propertyKeyOrOptions : {};
|
|
166
|
+
return attribute(":host", { ...options, name: attrName });
|
|
167
|
+
} else if (typeof targetOrAttrOrOptions === "object") {
|
|
168
|
+
const options = targetOrAttrOrOptions;
|
|
169
|
+
return (target, propertyKey) => {
|
|
170
|
+
const fieldName = String(propertyKey);
|
|
171
|
+
return attribute(":host", { ...options, name: fieldName })(target, propertyKey);
|
|
172
|
+
};
|
|
173
|
+
} else {
|
|
174
|
+
return (target, propertyKey) => {
|
|
175
|
+
const fieldName = String(propertyKey);
|
|
176
|
+
return attribute(":host", { name: fieldName })(target, propertyKey);
|
|
177
|
+
};
|
|
178
|
+
}
|
|
161
179
|
}
|
|
162
180
|
//# sourceMappingURL=attribute.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/attribute.ts"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\n\nexport interface AttributeOptions extends SwcQueryOptions {\n name?: string;\n connectedInitialize?: boolean;\n type?: typeof Number | typeof Boolean | typeof String;\n}\n\nexport interface AttributeMetadata {\n propertyKey: string | symbol;\n selector: string;\n options: AttributeOptions;\n privateKey: symbol; // Added to bypass getter during initialization\n}\n\nexport const ATTRIBUTE_METADATA_KEY = Symbol('simple-web-component:attribute');\n\n/**\n * Helper to perform type conversion from string to target type\n */\nconst convertValue = (val: string | null, type: any): any => {\n if (val === null || val === undefined) return val;\n if (type === Number) return Number(val);\n if (type === Boolean) return val === 'false' || val === '0' ? false : true;\n return val;\n};\n\n/**\n * Helper to resolve target elements based on selector and root options\n */\nexport const resolveTargetEls = (inst: any, selector: string, options: AttributeOptions, currentWin: any): HTMLElement[] => {\n const r = options.root || 'auto';\n const results: HTMLElement[] = [];\n\n const applyRoot = (target: any) => {\n if (!target) return;\n if (r === 'auto') {\n // Attributes belong to the ELEMENT, not the ShadowRoot.\n // So for :host and direct attribute sync, we mostly want the element itself.\n results.push(target);\n } else {\n if (r === 'light' || r === 'all') results.push(target);\n if ((r === 'shadow' || r === 'all') && target.shadowRoot) results.push(target.shadowRoot);\n }\n };\n\n if (selector === ':host' || !selector) {\n applyRoot(inst);\n } else if (selector === ':window') {\n results.push(currentWin);\n } else if (selector === ':document') {\n results.push(currentWin.document);\n } else {\n const hostSet = SwcUtils.getHostSet(inst);\n if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n else if (selector === ':appHost') applyRoot(hostSet.$appHost as any);\n else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost as any);\n else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost as any);\n else {\n if (r === 'shadow') {\n const found = inst.shadowRoot?.querySelectorAll(selector);\n if (found) results.push(...found);\n } else if (r === 'light') {\n const found = inst.querySelectorAll(selector);\n if (found) results.push(...found);\n } else if (r === 'all') {\n const sMatch = inst.shadowRoot?.querySelectorAll(selector);\n const lMatch = inst.querySelectorAll(selector);\n if (sMatch) results.push(...sMatch);\n if (lMatch) results.push(...lMatch);\n } else {\n const found = (inst.shadowRoot || inst).querySelectorAll(selector);\n if (found) results.push(...found);\n }\n }\n }\n return results;\n};\n\n/**\n * @attribute decorator to sync a field value with an element's attribute.\n */\nexport function attribute(selector: string, options: AttributeOptions = {}): PropertyDecorator {\n return (target: Object, propertyKey: string | symbol) => {\n const constructor = target.constructor;\n const privateKey = Symbol(String(propertyKey));\n\n const designType = (Reflect as any).getMetadata('design:type', target, propertyKey);\n\n let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_METADATA_KEY, constructor) as AttributeMetadata[];\n if (!metaList) {\n metaList = [];\n ReflectUtils.defineMetadata(ATTRIBUTE_METADATA_KEY, metaList, constructor);\n }\n metaList.push({propertyKey, selector, options, privateKey});\n\n // Helper function to apply setAttribute to targets\n const applySetAttribute = (inst: any, targets: HTMLElement[], attrName: string, nv: any) => {\n targets.forEach(it => {\n console.log('----->', it)\n if (it && typeof (it as any).setAttribute === 'function') {\n if (nv === null) {\n (it as any).removeAttribute(attrName);\n } else {\n (it as any).setAttribute(attrName, String(nv));\n }\n } else {\n inst[privateKey] = nv;\n }\n });\n };\n\n Object.defineProperty(target, propertyKey, {\n get(this: any) {\n const attrName = options.name || String(propertyKey);\n const conf = getElementConfig(this);\n const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n const targetType = options.type || designType;\n\n console.log('type-->', propertyKey, targetType);\n // During early init phase, if syncing memory to DOM, return memory.\n if (this.__swc_syncing_init || (options.connectedInitialize && !this.__swc_connected)) {\n return convertValue(this[privateKey], targetType);\n }\n\n const targets = resolveTargetEls(this, selector, options, currentWin);\n const primaryTarget = targets[0];\n\n if (primaryTarget && typeof (primaryTarget as any).hasAttribute === 'function') {\n if ((primaryTarget as any).hasAttribute(attrName)) {\n const domVal = (primaryTarget as any).getAttribute(attrName);\n return convertValue(domVal, targetType);\n }\n return null;\n }\n\n return convertValue(this[privateKey], targetType);\n },\n set(this: any, nv: any) {\n const targetType = options.type || designType;\n // console.log('---set', propertyKey, targetType, nv, this, this.__swc_syncing_init);\n\n const attrName = options.name || String(propertyKey);\n const conf = getElementConfig(this);\n const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n\n // During initialization/syncing phase\n if (this.__swc_syncing_init) {\n // If connectedInitialize is enabled, force setAttribute (JS -> DOM)\n if (options.connectedInitialize === true) {\n const targets = resolveTargetEls(this, selector, options, currentWin);\n applySetAttribute(this, targets, attrName, nv);\n } else {\n // Otherwise just update memory\n this[privateKey] = nv;\n }\n return;\n }\n\n // Before connected, save to memory only\n if (!this.__swc_connected) {\n this[privateKey] = nv;\n return;\n }\n\n // After connected, normal setAttribute\n const targets = resolveTargetEls(this, selector, options, currentWin);\n applySetAttribute(this, targets, attrName, nv);\n },\n enumerable: true,\n configurable: true\n });\n };\n}\n\nexport const findAllAttributeMetadata = (target: any): AttributeMetadata[] => {\n return ReflectUtils.findAllMetadata<AttributeMetadata[]>(ATTRIBUTE_METADATA_KEY, target).flat();\n};\n\n/**\n * @attributeHost decorator - simplified version of @attribute for :host selector\n * Usage: @attributeHost - uses field name as attribute name\n * Usage: @attributeHost() - uses field name as attribute name\n * Usage: @attributeHost('data-id') - uses custom attribute name\n * Usage: @attributeHost({ type: Boolean }) - uses field name with options\n * Usage: @attributeHost('data-id', { type: Boolean }) - uses custom name with options\n */\nexport function attributeHost(target: Object, propertyKey: string | symbol): void;\nexport function attributeHost(): PropertyDecorator;\nexport function attributeHost(options: AttributeOptions): PropertyDecorator;\nexport function attributeHost(attrName: string): PropertyDecorator;\nexport function attributeHost(attrName: string, options: AttributeOptions): PropertyDecorator;\nexport function attributeHost(targetOrAttrOrOptions?: any, propertyKeyOrOptions?: any): any {\n // Direct decorator usage: @attributeHost (no parentheses)\n if (propertyKeyOrOptions !== undefined && (typeof propertyKeyOrOptions === 'string' || typeof propertyKeyOrOptions === 'symbol')) {\n const fieldName = String(propertyKeyOrOptions);\n return attribute(':host', { name: fieldName })(targetOrAttrOrOptions, propertyKeyOrOptions);\n }\n\n // @attributeHost() or @attributeHost(options) or @attributeHost('name')\n if (typeof targetOrAttrOrOptions === 'string') {\n // @attributeHost('customName') or @attributeHost('customName', options)\n const attrName = targetOrAttrOrOptions;\n const options = (typeof propertyKeyOrOptions === 'object' ? propertyKeyOrOptions : {}) as AttributeOptions;\n return attribute(':host', { ...options, name: attrName });\n } else if (typeof targetOrAttrOrOptions === 'object') {\n // @attributeHost(options) - use field name as attribute name\n const options = targetOrAttrOrOptions as AttributeOptions;\n return (target: Object, propertyKey: string | symbol) => {\n const fieldName = String(propertyKey);\n return attribute(':host', { ...options, name: fieldName })(target, propertyKey);\n };\n } else {\n // @attributeHost() - use field name as attribute name\n return (target: Object, propertyKey: string | symbol) => {\n const fieldName = String(propertyKey);\n return attribute(':host', { name: fieldName })(target, propertyKey);\n };\n }\n}\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2B;AAC3B,2BAA2C;AAC3C,mBAAuB;AAgBhB,MAAM,yBAAyB,OAAO,gCAAgC;AAK7E,MAAM,eAAe,CAAC,KAAoB,SAAmB;AAC3D,MAAI,QAAQ,QAAQ,QAAQ,OAAW,QAAO;AAC9C,MAAI,SAAS,OAAQ,QAAO,OAAO,GAAG;AACtC,MAAI,SAAS,QAAS,QAAO,QAAQ,WAAW,QAAQ,MAAM,QAAQ;AACtE,SAAO;AACT;AAKO,MAAM,mBAAmB,CAAC,MAAW,UAAkB,SAA2B,eAAmC;AAC1H,QAAM,IAAI,QAAQ,QAAQ;AAC1B,QAAM,UAAyB,CAAC;AAEhC,QAAM,YAAY,CAAC,WAAgB;AACjC,QAAI,CAAC,OAAQ;AACb,QAAI,MAAM,QAAQ;AAGhB,cAAQ,KAAK,MAAM;AAAA,IACrB,OAAO;AACL,UAAI,MAAM,WAAW,MAAM,MAAO,SAAQ,KAAK,MAAM;AACrD,WAAK,MAAM,YAAY,MAAM,UAAU,OAAO,WAAY,SAAQ,KAAK,OAAO,UAAU;AAAA,IAC1F;AAAA,EACF;AAEA,MAAI,aAAa,WAAW,CAAC,UAAU;AACrC,cAAU,IAAI;AAAA,EAChB,WAAW,aAAa,WAAW;AACjC,YAAQ,KAAK,UAAU;AAAA,EACzB,WAAW,aAAa,aAAa;AACnC,YAAQ,KAAK,WAAW,QAAQ;AAAA,EAClC,OAAO;AACL,UAAM,UAAU,sBAAS,WAAW,IAAI;AACxC,QAAI,aAAa,cAAe,WAAU,QAAQ,WAAW;AAAA,aACpD,aAAa,WAAY,WAAU,QAAQ,QAAe;AAAA,aAC1D,aAAa,aAAc,WAAU,QAAQ,UAAU;AAAA,aACvD,aAAa,YAAa,WAAU,QAAQ,SAAS;AAAA,aACrD,aAAa,gBAAiB,WAAU,QAAQ,aAAoB;AAAA,aACpE,aAAa,eAAgB,WAAU,QAAQ,YAAmB;AAAA,SACtE;AACH,UAAI,MAAM,UAAU;AAClB,cAAM,QAAQ,KAAK,YAAY,iBAAiB,QAAQ;AACxD,YAAI,MAAO,SAAQ,KAAK,GAAG,KAAK;AAAA,MAClC,WAAW,MAAM,SAAS;AACxB,cAAM,QAAQ,KAAK,iBAAiB,QAAQ;AAC5C,YAAI,MAAO,SAAQ,KAAK,GAAG,KAAK;AAAA,MAClC,WAAW,MAAM,OAAO;AACtB,cAAM,SAAS,KAAK,YAAY,iBAAiB,QAAQ;AACzD,cAAM,SAAS,KAAK,iBAAiB,QAAQ;AAC7C,YAAI,OAAQ,SAAQ,KAAK,GAAG,MAAM;AAClC,YAAI,OAAQ,SAAQ,KAAK,GAAG,MAAM;AAAA,MACpC,OAAO;AACL,cAAM,SAAS,KAAK,cAAc,MAAM,iBAAiB,QAAQ;AACjE,YAAI,MAAO,SAAQ,KAAK,GAAG,KAAK;AAAA,MAClC;AAAA,IACF;AAAA,EACF;AACA,SAAO;AACT;AAKO,SAAS,UAAU,UAAkB,UAA4B,CAAC,GAAsB;AAC7F,SAAO,CAAC,QAAgB,gBAAiC;AACvD,UAAM,cAAc,OAAO;AAC3B,UAAM,aAAa,OAAO,OAAO,WAAW,CAAC;AAE7C,UAAM,aAAc,QAAgB,YAAY,eAAe,QAAQ,WAAW;AAElF,QAAI,WAAW,yBAAa,eAAe,wBAAwB,WAAW;AAC9E,QAAI,CAAC,UAAU;AACb,iBAAW,CAAC;AACZ,+BAAa,eAAe,wBAAwB,UAAU,WAAW;AAAA,IAC3E;AACA,aAAS,KAAK,EAAC,aAAa,UAAU,SAAS,WAAU,CAAC;AAG1D,UAAM,oBAAoB,CAAC,MAAW,SAAwB,UAAkB,OAAY;AAC1F,cAAQ,QAAQ,QAAM;AACpB,gBAAQ,IAAI,UAAU,EAAE;AACxB,YAAI,MAAM,OAAQ,GAAW,iBAAiB,YAAY;AACxD,cAAI,OAAO,MAAM;AACf,YAAC,GAAW,gBAAgB,QAAQ;AAAA,UACtC,OAAO;AACL,YAAC,GAAW,aAAa,UAAU,OAAO,EAAE,CAAC;AAAA,UAC/C;AAAA,QACF,OAAO;AACL,eAAK,UAAU,IAAI;AAAA,QACrB;AAAA,MACF,CAAC;AAAA,IACH;AAEA,WAAO,eAAe,QAAQ,aAAa;AAAA,MACzC,MAAe;AACb,cAAM,WAAW,QAAQ,QAAQ,OAAO,WAAW;AACnD,cAAM,WAAO,uCAAiB,IAAI;AAClC,cAAM,aAAa,KAAK,iBAAiB,IAAI,MAAO,OAAO,WAAW,cAAc,SAAS;AAC7F,cAAM,aAAa,QAAQ,QAAQ;AAEnC,gBAAQ,IAAI,WAAW,aAAa,UAAU;AAE9C,YAAI,KAAK,sBAAuB,QAAQ,uBAAuB,CAAC,KAAK,iBAAkB;AACrF,iBAAO,aAAa,KAAK,UAAU,GAAG,UAAU;AAAA,QAClD;AAEA,cAAM,UAAU,iBAAiB,MAAM,UAAU,SAAS,UAAU;AACpE,cAAM,gBAAgB,QAAQ,CAAC;AAE/B,YAAI,iBAAiB,OAAQ,cAAsB,iBAAiB,YAAY;AAC9E,cAAK,cAAsB,aAAa,QAAQ,GAAG;AACjD,kBAAM,SAAU,cAAsB,aAAa,QAAQ;AAC3D,mBAAO,aAAa,QAAQ,UAAU;AAAA,UACxC;AACA,iBAAO;AAAA,QACT;AAEA,eAAO,aAAa,KAAK,UAAU,GAAG,UAAU;AAAA,MAClD;AAAA,MACA,IAAe,IAAS;AACtB,cAAM,aAAa,QAAQ,QAAQ;AAGnC,cAAM,WAAW,QAAQ,QAAQ,OAAO,WAAW;AACnD,cAAM,WAAO,uCAAiB,IAAI;AAClC,cAAM,aAAa,KAAK,iBAAiB,IAAI,MAAO,OAAO,WAAW,cAAc,SAAS;AAG7F,YAAI,KAAK,oBAAoB;AAE3B,cAAI,QAAQ,wBAAwB,MAAM;AACxC,kBAAMA,WAAU,iBAAiB,MAAM,UAAU,SAAS,UAAU;AACpE,8BAAkB,MAAMA,UAAS,UAAU,EAAE;AAAA,UAC/C,OAAO;AAEL,iBAAK,UAAU,IAAI;AAAA,UACrB;AACA;AAAA,QACF;AAGA,YAAI,CAAC,KAAK,iBAAiB;AACzB,eAAK,UAAU,IAAI;AACnB;AAAA,QACF;AAGA,cAAM,UAAU,iBAAiB,MAAM,UAAU,SAAS,UAAU;AACpE,0BAAkB,MAAM,SAAS,UAAU,EAAE;AAAA,MAC/C;AAAA,MACA,YAAY;AAAA,MACZ,cAAc;AAAA,IAChB,CAAC;AAAA,EACH;AACF;AAEO,MAAM,2BAA2B,CAAC,WAAqC;AAC5E,SAAO,yBAAa,gBAAqC,wBAAwB,MAAM,EAAE,KAAK;AAChG;AAeO,SAAS,cAAc,uBAA6B,sBAAiC;AAE1F,MAAI,yBAAyB,WAAc,OAAO,yBAAyB,YAAY,OAAO,yBAAyB,WAAW;AAChI,UAAM,YAAY,OAAO,oBAAoB;AAC7C,WAAO,UAAU,SAAS,EAAE,MAAM,UAAU,CAAC,EAAE,uBAAuB,oBAAoB;AAAA,EAC5F;AAGA,MAAI,OAAO,0BAA0B,UAAU;AAE7C,UAAM,WAAW;AACjB,UAAM,UAAW,OAAO,yBAAyB,WAAW,uBAAuB,CAAC;AACpF,WAAO,UAAU,SAAS,EAAE,GAAG,SAAS,MAAM,SAAS,CAAC;AAAA,EAC1D,WAAW,OAAO,0BAA0B,UAAU;AAEpD,UAAM,UAAU;AAChB,WAAO,CAAC,QAAgB,gBAAiC;AACvD,YAAM,YAAY,OAAO,WAAW;AACpC,aAAO,UAAU,SAAS,EAAE,GAAG,SAAS,MAAM,UAAU,CAAC,EAAE,QAAQ,WAAW;AAAA,IAChF;AAAA,EACF,OAAO;AAEL,WAAO,CAAC,QAAgB,gBAAiC;AACvD,YAAM,YAAY,OAAO,WAAW;AACpC,aAAO,UAAU,SAAS,EAAE,MAAM,UAAU,CAAC,EAAE,QAAQ,WAAW;AAAA,IACpE;AAAA,EACF;AACF;",
|
|
6
6
|
"names": ["targets"]
|
|
7
7
|
}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/decorators/changedAttributeHost.ts"],
|
|
4
|
-
"sourcesContent": ["import {
|
|
5
|
-
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,
|
|
4
|
+
"sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\n\nexport const ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol('simple-web-component:on-attribute-changed');\n\n/**\n * @changedAttributeHost decorator - fires when any attribute on :host changes\n * Usage: @changedAttributeHost('data-product-id')\n */\nexport function changedAttributeHost(attributeName?: string): MethodDecorator {\n return (target: Object, propertyKey: string | symbol) => {\n const constructor = target.constructor;\n let meta = ReflectUtils.getOwnMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor) as Map<string, (string | symbol)[]>;\n if (!meta) {\n meta = new Map<string, (string | symbol)[]>();\n ReflectUtils.defineMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, meta, constructor);\n }\n\n const name = attributeName || String(propertyKey);\n let methods = meta.get(name);\n if (!methods) {\n methods = [];\n meta.set(name, methods);\n }\n if (!methods.includes(propertyKey)) methods.push(propertyKey);\n };\n}\n\nexport const getChangedAttributeMetadata = (target: any): Map<string, (string | symbol)[]> | undefined => {\n const constructor = target instanceof Function ? target : target.constructor;\n return ReflectUtils.getMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);\n};\n\nexport const findAllAttributeChangedMetadata = (target: any): Map<string, (string | symbol)[]> => {\n return ReflectUtils.findAllMapMetadata<string, string | symbol>(ON_ATTRIBUTE_CHANGED_METADATA_KEY, target);\n};\n"],
|
|
5
|
+
"mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA2B;AAEpB,MAAM,oCAAoC,OAAO,2CAA2C;AAM5F,SAAS,qBAAqB,eAAyC;AAC5E,SAAO,CAAC,QAAgB,gBAAiC;AACvD,UAAM,cAAc,OAAO;AAC3B,QAAI,OAAO,yBAAa,eAAe,mCAAmC,WAAW;AACrF,QAAI,CAAC,MAAM;AACT,aAAO,oBAAI,IAAiC;AAC5C,+BAAa,eAAe,mCAAmC,MAAM,WAAW;AAAA,IAClF;AAEA,UAAM,OAAO,iBAAiB,OAAO,WAAW;AAChD,QAAI,UAAU,KAAK,IAAI,IAAI;AAC3B,QAAI,CAAC,SAAS;AACZ,gBAAU,CAAC;AACX,WAAK,IAAI,MAAM,OAAO;AAAA,IACxB;AACA,QAAI,CAAC,QAAQ,SAAS,WAAW,EAAG,SAAQ,KAAK,WAAW;AAAA,EAC9D;AACF;AAEO,MAAM,8BAA8B,CAAC,WAA8D;AACxG,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,yBAAa,YAAY,mCAAmC,WAAW;AAChF;AAEO,MAAM,kCAAkC,CAAC,WAAkD;AAChG,SAAO,yBAAa,mBAA4C,mCAAmC,MAAM;AAC3G;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -36,7 +36,7 @@ var import_elementDefine = require("./elementDefine");
|
|
|
36
36
|
var import_Utils = require("../utils/Utils");
|
|
37
37
|
const CLASS_LIST_METADATA_KEY = Symbol("simple-web-component:class-list");
|
|
38
38
|
function createClassListDecorator(action) {
|
|
39
|
-
return (selector) => {
|
|
39
|
+
return (selector, options = {}) => {
|
|
40
40
|
return (target, propertyKey, descriptor) => {
|
|
41
41
|
const constructor = target.constructor;
|
|
42
42
|
let metaList = import_core.ReflectUtils.getOwnMetadata(CLASS_LIST_METADATA_KEY, constructor);
|
|
@@ -44,19 +44,52 @@ function createClassListDecorator(action) {
|
|
|
44
44
|
metaList = /* @__PURE__ */ new Map();
|
|
45
45
|
import_core.ReflectUtils.defineMetadata(CLASS_LIST_METADATA_KEY, metaList, constructor);
|
|
46
46
|
}
|
|
47
|
-
metaList.set(propertyKey, { propertyKey, selector, action });
|
|
47
|
+
metaList.set(propertyKey, { propertyKey, selector, action, options });
|
|
48
48
|
const original = descriptor.value;
|
|
49
49
|
descriptor.value = async function(...args) {
|
|
50
50
|
(0, import_elementDefine.ensureInit)(this);
|
|
51
51
|
const res = await original.apply(this, args);
|
|
52
52
|
if (res !== void 0) {
|
|
53
|
+
const r = options.root || "auto";
|
|
53
54
|
const hostSet = import_Utils.SwcUtils.getHostSet(this);
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
55
|
+
const targetEls = [];
|
|
56
|
+
const applyRoot = (t) => {
|
|
57
|
+
if (!t || !(t instanceof HTMLElement)) return;
|
|
58
|
+
if (r === "auto") {
|
|
59
|
+
targetEls.push(t);
|
|
60
|
+
} else {
|
|
61
|
+
if (r === "light" || r === "all") targetEls.push(t);
|
|
62
|
+
if ((r === "shadow" || r === "all") && t.shadowRoot) {
|
|
63
|
+
}
|
|
64
|
+
}
|
|
65
|
+
};
|
|
66
|
+
if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
|
|
67
|
+
else if (selector === ":appHost") applyRoot(hostSet.$appHost);
|
|
68
|
+
else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
|
|
69
|
+
else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
|
|
70
|
+
else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
|
|
71
|
+
else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
|
|
72
|
+
else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
|
|
73
|
+
else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
|
|
74
|
+
else if (selector === ":host" || !selector) applyRoot(this);
|
|
75
|
+
else {
|
|
76
|
+
if (r === "shadow") {
|
|
77
|
+
const found = this.shadowRoot?.querySelectorAll(selector);
|
|
78
|
+
if (found) targetEls.push(...Array.from(found));
|
|
79
|
+
} else if (r === "light") {
|
|
80
|
+
const found = this.querySelectorAll(selector);
|
|
81
|
+
if (found) targetEls.push(...Array.from(found));
|
|
82
|
+
} else if (r === "all") {
|
|
83
|
+
const sFound = this.shadowRoot?.querySelectorAll(selector);
|
|
84
|
+
const lFound = this.querySelectorAll(selector);
|
|
85
|
+
if (sFound) targetEls.push(...Array.from(sFound));
|
|
86
|
+
if (lFound) targetEls.push(...Array.from(lFound));
|
|
87
|
+
} else {
|
|
88
|
+
const found = (this.shadowRoot || this).querySelectorAll(selector);
|
|
89
|
+
if (found) targetEls.push(...Array.from(found));
|
|
90
|
+
}
|
|
91
|
+
}
|
|
92
|
+
targetEls.forEach((targetEl) => {
|
|
60
93
|
if (action === "set") {
|
|
61
94
|
let classes = "";
|
|
62
95
|
if (typeof res === "object" && res !== null && !Array.isArray(res)) {
|
|
@@ -84,23 +117,53 @@ function createClassListDecorator(action) {
|
|
|
84
117
|
const classes = Array.isArray(res) ? res.map(String) : [String(res)];
|
|
85
118
|
classes.forEach((c) => targetEl.classList.toggle(c));
|
|
86
119
|
}
|
|
87
|
-
}
|
|
120
|
+
});
|
|
88
121
|
}
|
|
89
122
|
return res;
|
|
90
123
|
};
|
|
91
124
|
};
|
|
92
125
|
};
|
|
93
126
|
}
|
|
94
|
-
const setClassList = createClassListDecorator("set");
|
|
95
|
-
const updateClassList = createClassListDecorator("update");
|
|
96
|
-
const addClassList = createClassListDecorator("add");
|
|
97
|
-
const removeClassList = createClassListDecorator("remove");
|
|
98
|
-
const toggleClassList = createClassListDecorator("toggle");
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
const
|
|
102
|
-
|
|
103
|
-
|
|
127
|
+
const setClassList = (selector, options = {}) => createClassListDecorator("set")(selector, options);
|
|
128
|
+
const updateClassList = (selector, options = {}) => createClassListDecorator("update")(selector, options);
|
|
129
|
+
const addClassList = (selector, options = {}) => createClassListDecorator("add")(selector, options);
|
|
130
|
+
const removeClassList = (selector, options = {}) => createClassListDecorator("remove")(selector, options);
|
|
131
|
+
const toggleClassList = (selector, options = {}) => createClassListDecorator("toggle")(selector, options);
|
|
132
|
+
function setClassListHost(targetOrOptions, propertyKey, descriptor) {
|
|
133
|
+
if (propertyKey !== void 0) {
|
|
134
|
+
const decorator = createClassListDecorator("set")(":host", {});
|
|
135
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
136
|
+
}
|
|
137
|
+
return createClassListDecorator("set")(":host", targetOrOptions || {});
|
|
138
|
+
}
|
|
139
|
+
function updateClassListHost(targetOrOptions, propertyKey, descriptor) {
|
|
140
|
+
if (propertyKey !== void 0) {
|
|
141
|
+
const decorator = createClassListDecorator("update")(":host", {});
|
|
142
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
143
|
+
}
|
|
144
|
+
return createClassListDecorator("update")(":host", targetOrOptions || {});
|
|
145
|
+
}
|
|
146
|
+
function addClassListHost(targetOrOptions, propertyKey, descriptor) {
|
|
147
|
+
if (propertyKey !== void 0) {
|
|
148
|
+
const decorator = createClassListDecorator("add")(":host", {});
|
|
149
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
150
|
+
}
|
|
151
|
+
return createClassListDecorator("add")(":host", targetOrOptions || {});
|
|
152
|
+
}
|
|
153
|
+
function removeClassListHost(targetOrOptions, propertyKey, descriptor) {
|
|
154
|
+
if (propertyKey !== void 0) {
|
|
155
|
+
const decorator = createClassListDecorator("remove")(":host", {});
|
|
156
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
157
|
+
}
|
|
158
|
+
return createClassListDecorator("remove")(":host", targetOrOptions || {});
|
|
159
|
+
}
|
|
160
|
+
function toggleClassListHost(targetOrOptions, propertyKey, descriptor) {
|
|
161
|
+
if (propertyKey !== void 0) {
|
|
162
|
+
const decorator = createClassListDecorator("toggle")(":host", {});
|
|
163
|
+
return decorator(targetOrOptions, propertyKey, descriptor);
|
|
164
|
+
}
|
|
165
|
+
return createClassListDecorator("toggle")(":host", targetOrOptions || {});
|
|
166
|
+
}
|
|
104
167
|
const findAllClassListMetadata = (target) => {
|
|
105
168
|
const result = /* @__PURE__ */ new Map();
|
|
106
169
|
const maps = import_core.ReflectUtils.findAllMetadata(CLASS_LIST_METADATA_KEY, target);
|