@dooboostore/simple-web-component 1.0.29 → 1.0.31
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 +651 -27
- package/dist/cjs/decorators/elementDefine.js +5 -3
- package/dist/cjs/decorators/elementDefine.js.map +2 -2
- package/dist/cjs/decorators/emitCustomEvent.js.map +2 -2
- package/dist/cjs/decorators/index.js +1 -0
- package/dist/cjs/decorators/index.js.map +2 -2
- package/dist/cjs/decorators/setProperty.js +97 -0
- package/dist/cjs/decorators/setProperty.js.map +7 -0
- package/dist/cjs/elements/SwcAppEngine.js +3 -3
- package/dist/cjs/elements/SwcAppEngine.js.map +2 -2
- package/dist/cjs/elements/SwcAppMixin.js +1 -8
- package/dist/cjs/elements/SwcAppMixin.js.map +2 -2
- package/dist/cjs/elements/SwcAsync.js +37 -53
- package/dist/cjs/elements/SwcAsync.js.map +2 -2
- package/dist/cjs/elements/SwcChoose.js +55 -60
- package/dist/cjs/elements/SwcChoose.js.map +2 -2
- package/dist/cjs/elements/SwcIf.js +31 -60
- package/dist/cjs/elements/SwcIf.js.map +2 -2
- package/dist/cjs/elements/SwcLoop.js +20 -43
- package/dist/cjs/elements/SwcLoop.js.map +2 -2
- package/dist/cjs/elements/SwcSubTemplates.js +0 -27
- package/dist/cjs/elements/SwcSubTemplates.js.map +2 -2
- package/dist/cjs/elements/register.js +216 -128
- package/dist/cjs/elements/register.js.map +2 -2
- package/dist/cjs/index.js +2 -1
- package/dist/cjs/index.js.map +2 -2
- package/dist/cjs/router/ElementRouter.js +1 -8
- package/dist/cjs/router/ElementRouter.js.map +2 -2
- package/dist/cjs/types.js.map +1 -1
- package/dist/cjs/utils/Utils.js +26 -10
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/decorators/elementDefine.js +5 -3
- package/dist/esm/decorators/elementDefine.js.map +2 -2
- package/dist/esm/decorators/emitCustomEvent.js.map +2 -2
- package/dist/esm/decorators/index.js +1 -0
- package/dist/esm/decorators/index.js.map +2 -2
- package/dist/esm/decorators/setProperty.js +78 -0
- package/dist/esm/decorators/setProperty.js.map +7 -0
- package/dist/esm/elements/SwcAppEngine.js +3 -3
- package/dist/esm/elements/SwcAppEngine.js.map +2 -2
- package/dist/esm/elements/SwcAppMixin.js +1 -8
- package/dist/esm/elements/SwcAppMixin.js.map +2 -2
- package/dist/esm/elements/SwcAsync.js +37 -34
- package/dist/esm/elements/SwcAsync.js.map +2 -2
- package/dist/esm/elements/SwcChoose.js +55 -41
- package/dist/esm/elements/SwcChoose.js.map +2 -2
- package/dist/esm/elements/SwcIf.js +31 -41
- package/dist/esm/elements/SwcIf.js.map +2 -2
- package/dist/esm/elements/SwcLoop.js +20 -24
- package/dist/esm/elements/SwcLoop.js.map +2 -2
- package/dist/esm/elements/SwcSubTemplates.js +0 -8
- package/dist/esm/elements/SwcSubTemplates.js.map +2 -2
- package/dist/esm/elements/register.js +216 -128
- package/dist/esm/elements/register.js.map +2 -2
- package/dist/esm/index.js +2 -1
- package/dist/esm/index.js.map +2 -2
- package/dist/esm/router/ElementRouter.js +1 -8
- package/dist/esm/router/ElementRouter.js.map +2 -2
- package/dist/esm/types.js.map +1 -1
- package/dist/esm/utils/Utils.js +26 -10
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +105 -13
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- package/dist/types/decorators/emitCustomEvent.d.ts.map +1 -1
- package/dist/types/decorators/index.d.ts +1 -0
- package/dist/types/decorators/index.d.ts.map +1 -1
- package/dist/types/decorators/setProperty.d.ts +13 -0
- package/dist/types/decorators/setProperty.d.ts.map +1 -0
- package/dist/types/elements/SwcAppMixin.d.ts.map +1 -1
- package/dist/types/elements/SwcAsync.d.ts +1 -11
- package/dist/types/elements/SwcAsync.d.ts.map +1 -1
- package/dist/types/elements/SwcChoose.d.ts +1 -13
- package/dist/types/elements/SwcChoose.d.ts.map +1 -1
- package/dist/types/elements/SwcIf.d.ts +1 -13
- package/dist/types/elements/SwcIf.d.ts.map +1 -1
- package/dist/types/elements/SwcLoop.d.ts +1 -13
- package/dist/types/elements/SwcLoop.d.ts.map +1 -1
- package/dist/types/elements/SwcSubTemplates.d.ts +6 -6
- package/dist/types/elements/SwcSubTemplates.d.ts.map +1 -1
- package/dist/types/elements/register.d.ts +3 -1
- package/dist/types/elements/register.d.ts.map +1 -1
- package/dist/types/index.d.ts +1 -1
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types/router/ElementRouter.d.ts.map +1 -1
- package/dist/types/types.d.ts +3 -0
- package/dist/types/types.d.ts.map +1 -1
- package/dist/types/utils/Utils.d.ts +10 -0
- package/dist/types/utils/Utils.d.ts.map +1 -1
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +105 -13
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
- package/package.json +3 -3
- package/src/decorators/elementDefine.ts +10 -3
- package/src/decorators/emitCustomEvent.ts +1 -0
- package/src/decorators/index.ts +1 -0
- package/src/decorators/setProperty.ts +97 -0
- package/src/elements/SwcAppEngine.ts +3 -3
- package/src/elements/SwcAppMixin.ts +7 -28
- package/src/elements/SwcAsync.ts +46 -30
- package/src/elements/SwcChoose.ts +82 -38
- package/src/elements/SwcIf.ts +38 -38
- package/src/elements/SwcLoop.ts +24 -19
- package/src/elements/SwcSubTemplates.ts +6 -6
- package/src/elements/register.ts +261 -121
- package/src/index.ts +3 -1
- package/src/router/ElementRouter.ts +1 -12
- package/src/types.ts +3 -1
- package/src/utils/Utils.ts +40 -19
|
@@ -1,25 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __export = (target, all) => {
|
|
6
|
-
for (var name in all)
|
|
7
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
-
};
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (let key of __getOwnPropNames(from))
|
|
12
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
-
}
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
-
var SwcAsync_exports = {};
|
|
19
|
-
__export(SwcAsync_exports, {
|
|
20
|
-
SwcAsync: () => SwcAsync
|
|
21
|
-
});
|
|
22
|
-
module.exports = __toCommonJS(SwcAsync_exports);
|
|
23
1
|
var import_changedAttributeHost = require("../decorators/changedAttributeHost");
|
|
24
2
|
var import_Utils = require("../utils/Utils");
|
|
25
3
|
var import_core = require("@dooboostore/core");
|
|
@@ -38,34 +16,32 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
38
16
|
this._nodes = [];
|
|
39
17
|
this._value = null;
|
|
40
18
|
}
|
|
41
|
-
_resolvePortal() {
|
|
42
|
-
const portalScript = this.getAttribute("on-get-portal");
|
|
43
|
-
if (!portalScript)
|
|
44
|
-
return this.parentElement;
|
|
45
|
-
const win = this.ownerDocument?.defaultView || window;
|
|
46
|
-
const res = import_core.FunctionUtils.executeReturn({
|
|
47
|
-
script: portalScript,
|
|
48
|
-
context: this,
|
|
49
|
-
args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
|
|
50
|
-
});
|
|
51
|
-
if (res instanceof HTMLElement)
|
|
52
|
-
return res;
|
|
53
|
-
if (typeof res === "string")
|
|
54
|
-
return win.document.querySelector(res);
|
|
55
|
-
return this.parentElement;
|
|
56
|
-
}
|
|
57
19
|
_executeCloneCallback(attr, args) {
|
|
58
20
|
const script = this.getAttribute(attr);
|
|
59
21
|
if (!script)
|
|
60
22
|
return;
|
|
61
23
|
import_core.FunctionUtils.execute({ script, context: this, args });
|
|
62
24
|
}
|
|
63
|
-
refresh() {
|
|
64
|
-
|
|
65
|
-
if (!
|
|
25
|
+
refresh(valueAttr) {
|
|
26
|
+
valueAttr ?? (valueAttr = this.getAttribute("value"));
|
|
27
|
+
if (!valueAttr) {
|
|
28
|
+
this.render("default");
|
|
66
29
|
return;
|
|
67
|
-
|
|
68
|
-
|
|
30
|
+
}
|
|
31
|
+
if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
|
|
32
|
+
const script = valueAttr.slice(2, -2).trim();
|
|
33
|
+
const win = this.ownerDocument?.defaultView || window;
|
|
34
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
35
|
+
script,
|
|
36
|
+
context: this,
|
|
37
|
+
args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
|
|
38
|
+
});
|
|
39
|
+
this.executeAsync(result);
|
|
40
|
+
} else {
|
|
41
|
+
this.executeAsync(valueAttr);
|
|
42
|
+
}
|
|
43
|
+
}
|
|
44
|
+
executeAsync(result) {
|
|
69
45
|
if (result instanceof Promise) {
|
|
70
46
|
this.render("loading");
|
|
71
47
|
result.then((v) => {
|
|
@@ -79,7 +55,7 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
79
55
|
}
|
|
80
56
|
render(state) {
|
|
81
57
|
this.cleanup();
|
|
82
|
-
const portal = this.
|
|
58
|
+
const portal = this.parentElement;
|
|
83
59
|
if (!portal)
|
|
84
60
|
return;
|
|
85
61
|
const win = this.ownerDocument?.defaultView || window;
|
|
@@ -91,16 +67,24 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
91
67
|
const elements = this._nodes.filter((n) => n.nodeType === 1);
|
|
92
68
|
const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0], $state: state };
|
|
93
69
|
this._nodes.forEach((n, nodeIdx) => {
|
|
94
|
-
if (n instanceof HTMLElement)
|
|
95
|
-
n.__swc_host = this;
|
|
96
70
|
this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });
|
|
71
|
+
if (n instanceof HTMLElement) {
|
|
72
|
+
Array.from(n.attributes).forEach((attr) => {
|
|
73
|
+
const value = attr.value || "";
|
|
74
|
+
if (value.startsWith("{{") && value.endsWith("}}")) {
|
|
75
|
+
const script = value.slice(2, -2).trim();
|
|
76
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
77
|
+
script,
|
|
78
|
+
context: n,
|
|
79
|
+
args: groupArgs
|
|
80
|
+
});
|
|
81
|
+
n.setAttribute(attr.name, String(result));
|
|
82
|
+
}
|
|
83
|
+
});
|
|
84
|
+
}
|
|
97
85
|
});
|
|
98
86
|
this._executeCloneCallback("on-clone-nodes", groupArgs);
|
|
99
|
-
|
|
100
|
-
portal.insertBefore(clone, this.nextSibling);
|
|
101
|
-
} else {
|
|
102
|
-
portal.appendChild(clone);
|
|
103
|
-
}
|
|
87
|
+
portal.insertBefore(clone, this.nextSibling);
|
|
104
88
|
}
|
|
105
89
|
}
|
|
106
90
|
cleanup() {
|
|
@@ -115,9 +99,9 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
115
99
|
}
|
|
116
100
|
}
|
|
117
101
|
__decorate([
|
|
118
|
-
(0, import_changedAttributeHost.changedAttributeHost)("
|
|
102
|
+
(0, import_changedAttributeHost.changedAttributeHost)("value"),
|
|
119
103
|
__metadata("design:type", Function),
|
|
120
|
-
__metadata("design:paramtypes", []),
|
|
104
|
+
__metadata("design:paramtypes", [String]),
|
|
121
105
|
__metadata("design:returntype", void 0)
|
|
122
106
|
], SwcAsync.prototype, "refresh", null);
|
|
123
107
|
//# sourceMappingURL=SwcAsync.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/elements/SwcAsync.ts"],
|
|
4
|
-
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\n\
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\n\nclass SwcAsync extends HTMLTemplateElement {\n private _nodes: Node[] = [];\n private _value: any = null;\n\n private _executeCloneCallback(attr: string, args: any) {\n const script = this.getAttribute(attr);\n if (!script) return;\n FunctionUtils.execute({ script, context: this, args });\n }\n\n @changedAttributeHost('value')\n private refresh(valueAttr?: string | null) {\n valueAttr ??= this.getAttribute('value');\n if (!valueAttr) {\n this.render('default');\n return;\n }\n\n // {{ }} 브레이스로 감싸진 값은 스크립트 실행\n if (valueAttr.startsWith('{{') && valueAttr.endsWith('}}')) {\n const script = valueAttr.slice(2, -2).trim();\n const win = this.ownerDocument?.defaultView || window;\n const result = FunctionUtils.executeReturn({ \n script, \n context: this, \n args: SwcUtils.getHelperAndHostSet(win, this) \n });\n\n this.executeAsync(result);\n } else {\n // 일반 문자열 값 또는 직접 Promise 속성\n this.executeAsync(valueAttr);\n }\n }\n\n private executeAsync(result: any) {\n if (result instanceof Promise) {\n this.render('loading');\n result\n .then(v => {\n this._value = v;\n this.render('success');\n })\n .catch(e => this.render('error'));\n } else {\n this._value = result;\n this.render('success');\n }\n }\n\n private render(state: string) {\n this.cleanup();\n const portal = this.parentElement;\n if (!portal) return;\n\n const win = this.ownerDocument?.defaultView || window;\n const helperSet = SwcUtils.getHelperAndHostSet(win, this);\n\n const t = this.content.querySelector(`template[is=\"swc-${state}\"]`) as HTMLTemplateElement;\n if (t) {\n const clone = t.content.cloneNode(true) as DocumentFragment;\n this._nodes = Array.from(clone.childNodes);\n const elements = this._nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0], $state: state };\n\n // 부모 체인을 정상적으로 유지하기 위해 __swc_host 할당 제거\n this._nodes.forEach((n, nodeIdx) => {\n // if (n instanceof HTMLElement) (n as any).__swc_host = this; // 제거: 부모 체인 유지\n this._executeCloneCallback('on-clone-node', { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });\n\n // Attribute {{ }} 치환 - SwcChoose처럼 동적 치환\n if (n instanceof HTMLElement) {\n Array.from(n.attributes).forEach(attr => {\n const value = attr.value || '';\n if (value.startsWith('{{') && value.endsWith('}}')) {\n const script = value.slice(2, -2).trim();\n const result = FunctionUtils.executeReturn({\n script,\n context: n,\n args: groupArgs\n });\n n.setAttribute(attr.name, String(result));\n }\n });\n }\n });\n\n this._executeCloneCallback('on-clone-nodes', groupArgs);\n\n portal.insertBefore(clone, this.nextSibling);\n }\n }\n\n private cleanup() {\n this._nodes.forEach(n => n.parentElement?.removeChild(n));\n this._nodes = [];\n }\n\n connectedCallback() {\n this.refresh();\n }\n disconnectedCallback() {\n this.cleanup();\n }\n}\n"],
|
|
5
|
+
"mappings": "AAAA,kCAAqC;AACrC,mBAAyB;AACzB,kBAA8B;;;;;;;;;;AAE9B,MAAM,iBAAiB,oBAAmB;EAA1C,cAAA;;AACU,SAAA,SAAiB,CAAA;AACjB,SAAA,SAAc;EAsGxB;EApGU,sBAAsB,MAAc,MAAS;AACnD,UAAM,SAAS,KAAK,aAAa,IAAI;AACrC,QAAI,CAAC;AAAQ;AACb,8BAAc,QAAQ,EAAE,QAAQ,SAAS,MAAM,KAAI,CAAE;EACvD;EAGQ,QAAQ,WAAyB;AACvC,kBAAA,YAAc,KAAK,aAAa,OAAO;AACvC,QAAI,CAAC,WAAW;AACd,WAAK,OAAO,SAAS;AACrB;IACF;AAGA,QAAI,UAAU,WAAW,IAAI,KAAK,UAAU,SAAS,IAAI,GAAG;AAC1D,YAAM,SAAS,UAAU,MAAM,GAAG,EAAE,EAAE,KAAI;AAC1C,YAAM,MAAM,KAAK,eAAe,eAAe;AAC/C,YAAM,SAAS,0BAAc,cAAc;QACzC;QACA,SAAS;QACT,MAAM,sBAAS,oBAAoB,KAAK,IAAI;OAC7C;AAED,WAAK,aAAa,MAAM;IAC1B,OAAO;AAEL,WAAK,aAAa,SAAS;IAC7B;EACF;EAEQ,aAAa,QAAW;AAC9B,QAAI,kBAAkB,SAAS;AAC7B,WAAK,OAAO,SAAS;AACrB,aACG,KAAK,OAAI;AACR,aAAK,SAAS;AACd,aAAK,OAAO,SAAS;MACvB,CAAC,EACA,MAAM,OAAK,KAAK,OAAO,OAAO,CAAC;IACpC,OAAO;AACL,WAAK,SAAS;AACd,WAAK,OAAO,SAAS;IACvB;EACF;EAEQ,OAAO,OAAa;AAC1B,SAAK,QAAO;AACZ,UAAM,SAAS,KAAK;AACpB,QAAI,CAAC;AAAQ;AAEb,UAAM,MAAM,KAAK,eAAe,eAAe;AAC/C,UAAM,YAAY,sBAAS,oBAAoB,KAAK,IAAI;AAExD,UAAM,IAAI,KAAK,QAAQ,cAAc,oBAAoB,KAAK,IAAI;AAClE,QAAI,GAAG;AACL,YAAM,QAAQ,EAAE,QAAQ,UAAU,IAAI;AACtC,WAAK,SAAS,MAAM,KAAK,MAAM,UAAU;AACzC,YAAM,WAAW,KAAK,OAAO,OAAO,OAAK,EAAE,aAAa,CAAC;AACzD,YAAM,YAAY,EAAE,GAAG,WAAW,QAAQ,KAAK,QAAQ,QAAQ,KAAK,QAAQ,WAAW,UAAU,eAAe,SAAS,CAAC,GAAG,QAAQ,MAAK;AAG1I,WAAK,OAAO,QAAQ,CAAC,GAAG,YAAW;AAEjC,aAAK,sBAAsB,iBAAiB,EAAE,GAAG,WAAW,OAAO,GAAG,YAAY,SAAS,YAAY,EAAE,aAAa,EAAC,CAAE;AAGzH,YAAI,aAAa,aAAa;AAC5B,gBAAM,KAAK,EAAE,UAAU,EAAE,QAAQ,UAAO;AACtC,kBAAM,QAAQ,KAAK,SAAS;AAC5B,gBAAI,MAAM,WAAW,IAAI,KAAK,MAAM,SAAS,IAAI,GAAG;AAClD,oBAAM,SAAS,MAAM,MAAM,GAAG,EAAE,EAAE,KAAI;AACtC,oBAAM,SAAS,0BAAc,cAAc;gBACzC;gBACA,SAAS;gBACT,MAAM;eACP;AACD,gBAAE,aAAa,KAAK,MAAM,OAAO,MAAM,CAAC;YAC1C;UACF,CAAC;QACH;MACF,CAAC;AAED,WAAK,sBAAsB,kBAAkB,SAAS;AAEtD,aAAO,aAAa,OAAO,KAAK,WAAW;IAC7C;EACF;EAEQ,UAAO;AACb,SAAK,OAAO,QAAQ,OAAK,EAAE,eAAe,YAAY,CAAC,CAAC;AACxD,SAAK,SAAS,CAAA;EAChB;EAEA,oBAAiB;AACf,SAAK,QAAO;EACd;EACA,uBAAoB;AAClB,SAAK,QAAO;EACd;;AA5FQ,WAAA;MADP,kDAAqB,OAAO;;;;;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,25 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __export = (target, all) => {
|
|
6
|
-
for (var name in all)
|
|
7
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
-
};
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (let key of __getOwnPropNames(from))
|
|
12
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
-
}
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
-
var SwcChoose_exports = {};
|
|
19
|
-
__export(SwcChoose_exports, {
|
|
20
|
-
SwcChoose: () => SwcChoose
|
|
21
|
-
});
|
|
22
|
-
module.exports = __toCommonJS(SwcChoose_exports);
|
|
23
1
|
var import_changedAttributeHost = require("../decorators/changedAttributeHost");
|
|
24
2
|
var import_Utils = require("../utils/Utils");
|
|
25
3
|
var import_core = require("@dooboostore/core");
|
|
@@ -37,6 +15,7 @@ class SwcChoose extends HTMLTemplateElement {
|
|
|
37
15
|
super(...arguments);
|
|
38
16
|
this._nodes = [];
|
|
39
17
|
this._value = null;
|
|
18
|
+
this._previousTemplate = null;
|
|
40
19
|
}
|
|
41
20
|
get value() {
|
|
42
21
|
return this._value;
|
|
@@ -45,70 +24,86 @@ class SwcChoose extends HTMLTemplateElement {
|
|
|
45
24
|
this._value = nv;
|
|
46
25
|
this.render();
|
|
47
26
|
}
|
|
48
|
-
_resolvePortal() {
|
|
49
|
-
const portalScript = this.getAttribute("on-get-portal");
|
|
50
|
-
if (!portalScript)
|
|
51
|
-
return this.parentElement;
|
|
52
|
-
const win = this.ownerDocument?.defaultView || window;
|
|
53
|
-
const res = import_core.FunctionUtils.executeReturn({
|
|
54
|
-
script: portalScript,
|
|
55
|
-
context: this,
|
|
56
|
-
args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
|
|
57
|
-
});
|
|
58
|
-
if (res instanceof HTMLElement)
|
|
59
|
-
return res;
|
|
60
|
-
if (typeof res === "string")
|
|
61
|
-
return win.document.querySelector(res);
|
|
62
|
-
return this.parentElement;
|
|
63
|
-
}
|
|
64
27
|
_executeCloneCallback(attr, args) {
|
|
65
28
|
const script = this.getAttribute(attr);
|
|
66
29
|
if (!script)
|
|
67
30
|
return;
|
|
68
31
|
import_core.FunctionUtils.execute({ script, context: this, args });
|
|
69
32
|
}
|
|
70
|
-
refresh() {
|
|
71
|
-
|
|
72
|
-
if (
|
|
33
|
+
refresh(valueAttr) {
|
|
34
|
+
valueAttr ?? (valueAttr = this.getAttribute("value"));
|
|
35
|
+
if (valueAttr === null) {
|
|
73
36
|
this.value = null;
|
|
74
37
|
return;
|
|
75
38
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
39
|
+
if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
|
|
40
|
+
const script = valueAttr.slice(2, -2).trim();
|
|
41
|
+
const win = this.ownerDocument?.defaultView || window;
|
|
42
|
+
const helperAndHostSet = import_Utils.SwcUtils.getHelperAndHostSet(win, import_Utils.SwcUtils.findNearestSwcHost(this));
|
|
43
|
+
const result = import_core.FunctionUtils.executeReturn({ script, context: this, args: helperAndHostSet });
|
|
44
|
+
this.value = result;
|
|
45
|
+
} else {
|
|
46
|
+
this.value = valueAttr;
|
|
47
|
+
}
|
|
79
48
|
}
|
|
80
49
|
render() {
|
|
81
|
-
this.cleanup();
|
|
82
|
-
const portal = this._resolvePortal();
|
|
83
|
-
if (!portal)
|
|
84
|
-
return;
|
|
85
50
|
const win = this.ownerDocument?.defaultView || window;
|
|
86
51
|
const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
|
|
87
52
|
const templates = Array.from(this.content.querySelectorAll("template"));
|
|
88
53
|
let selected = null;
|
|
89
54
|
for (const t of templates) {
|
|
90
|
-
if (t.getAttribute("is") === "swc-when"
|
|
91
|
-
|
|
92
|
-
|
|
55
|
+
if (t.getAttribute("is") === "swc-when") {
|
|
56
|
+
let matches = false;
|
|
57
|
+
const value = t.getAttribute("value") || "";
|
|
58
|
+
if (value.startsWith("{{") && value.endsWith("}}")) {
|
|
59
|
+
const script = value.slice(2, -2).trim();
|
|
60
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
61
|
+
script,
|
|
62
|
+
context: t,
|
|
63
|
+
args: { ...helperSet, $value: this._value }
|
|
64
|
+
});
|
|
65
|
+
matches = result === true;
|
|
66
|
+
} else {
|
|
67
|
+
matches = String(value) === String(this._value);
|
|
68
|
+
}
|
|
69
|
+
if (matches) {
|
|
70
|
+
selected = t;
|
|
71
|
+
break;
|
|
72
|
+
}
|
|
93
73
|
}
|
|
94
74
|
}
|
|
95
75
|
const target = selected || this.content.querySelector('template[is="swc-otherwise"]');
|
|
76
|
+
const targetHasSkipIfSame = target?.hasAttribute("skip-if-same");
|
|
77
|
+
const shouldSkip = (this.hasAttribute("skip-if-same") || targetHasSkipIfSame) && this._previousTemplate === target;
|
|
78
|
+
if (shouldSkip) {
|
|
79
|
+
return;
|
|
80
|
+
}
|
|
81
|
+
this.cleanup();
|
|
82
|
+
this._previousTemplate = target;
|
|
96
83
|
if (target) {
|
|
97
84
|
const clone = target.content.cloneNode(true);
|
|
98
85
|
this._nodes = Array.from(clone.childNodes);
|
|
99
86
|
const elements = this._nodes.filter((n) => n.nodeType === 1);
|
|
100
87
|
const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };
|
|
101
88
|
this._nodes.forEach((n, nodeIdx) => {
|
|
102
|
-
if (n instanceof HTMLElement)
|
|
103
|
-
n.__swc_host = this;
|
|
104
89
|
this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });
|
|
90
|
+
if (n instanceof HTMLElement) {
|
|
91
|
+
Array.from(n.attributes).forEach((attr) => {
|
|
92
|
+
const value = attr.value || "";
|
|
93
|
+
if (value.startsWith("{{") && value.endsWith("}}")) {
|
|
94
|
+
const script = value.slice(2, -2).trim();
|
|
95
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
96
|
+
script,
|
|
97
|
+
context: n,
|
|
98
|
+
args: { ...groupArgs, $value: this._value }
|
|
99
|
+
});
|
|
100
|
+
n.setAttribute(attr.name, String(result));
|
|
101
|
+
}
|
|
102
|
+
});
|
|
103
|
+
}
|
|
105
104
|
});
|
|
106
105
|
this._executeCloneCallback("on-clone-nodes", groupArgs);
|
|
107
|
-
|
|
108
|
-
portal.insertBefore(clone, this.nextSibling);
|
|
109
|
-
} else {
|
|
110
|
-
portal.appendChild(clone);
|
|
111
|
-
}
|
|
106
|
+
this.parentElement?.insertBefore(clone, this.nextSibling);
|
|
112
107
|
}
|
|
113
108
|
}
|
|
114
109
|
cleanup() {
|
|
@@ -123,9 +118,9 @@ class SwcChoose extends HTMLTemplateElement {
|
|
|
123
118
|
}
|
|
124
119
|
}
|
|
125
120
|
__decorate([
|
|
126
|
-
(0, import_changedAttributeHost.changedAttributeHost)("
|
|
121
|
+
(0, import_changedAttributeHost.changedAttributeHost)("value"),
|
|
127
122
|
__metadata("design:type", Function),
|
|
128
|
-
__metadata("design:paramtypes", []),
|
|
123
|
+
__metadata("design:paramtypes", [String]),
|
|
129
124
|
__metadata("design:returntype", void 0)
|
|
130
125
|
], SwcChoose.prototype, "refresh", null);
|
|
131
126
|
//# sourceMappingURL=SwcChoose.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/elements/SwcChoose.ts"],
|
|
4
|
-
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\n\
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\nimport { SwcChooseInterface } from '../types';\n\nclass SwcChoose extends HTMLTemplateElement implements SwcChooseInterface {\n private _nodes: Node[] = [];\n private _value: any = null;\n private _previousTemplate: HTMLTemplateElement | null = null;\n\n get value(): any {\n return this._value;\n }\n set value(nv: any) {\n this._value = nv;\n this.render();\n }\n\n private _executeCloneCallback(attr: string, args: any) {\n const script = this.getAttribute(attr);\n if (!script) return;\n FunctionUtils.execute({ script, context: this, args });\n }\n\n @changedAttributeHost('value')\n refresh(valueAttr?: string | null) {\n valueAttr ??= this.getAttribute('value');\n if (valueAttr === null) {\n this.value = null;\n return;\n }\n\n // {{ }} 브레이스로 감싸진 값은 스크립트 실행\n if (valueAttr.startsWith('{{') && valueAttr.endsWith('}}')) {\n const script = valueAttr.slice(2, -2).trim();\n const win = this.ownerDocument?.defaultView || window;\n const helperAndHostSet = SwcUtils.getHelperAndHostSet(win, SwcUtils.findNearestSwcHost(this));\n // console.log('vvvvvvvvvvvvvvvvvv323', helperAndHostSet);\n const result = FunctionUtils.executeReturn({ script, context: this, args: helperAndHostSet });\n this.value = result;\n // console.log('----------vv', this.value);\n } else {\n // 일반 문자열 값\n this.value = valueAttr;\n }\n }\n\n private render() {\n // console.log('-------------', this.value);\n const win = this.ownerDocument?.defaultView || window;\n const helperSet = SwcUtils.getHelperAndHostSet(win, this);\n const templates = Array.from(this.content.querySelectorAll('template'));\n let selected: HTMLTemplateElement | null = null;\n\n for (const t of templates) {\n if (t.getAttribute('is') === 'swc-when') {\n let matches = false;\n const value = t.getAttribute('value') || '';\n\n // {{ }} 브레이스로 감싸진 값은 스크립트 실행\n if (value.startsWith('{{') && value.endsWith('}}')) {\n const script = value.slice(2, -2).trim();\n const result = FunctionUtils.executeReturn({\n script,\n context: t,\n args: { ...helperSet, $value: this._value }\n });\n // console.log('rrrrrrrrrrrrrr', result);\n matches = result === true;\n } else {\n // 일반 문자열 비교 (기존 방식)\n matches = String(value) === String(this._value);\n }\n\n if (matches) {\n selected = t;\n break;\n }\n }\n }\n\n const target = selected || (this.content.querySelector('template[is=\"swc-otherwise\"]') as HTMLTemplateElement);\n\n // skip-if-same attribute가 있고 이전과 같은 template이면 렌더링 스킵\n // 최상위 skip-if-same 또는 각 when/otherwise의 skip-if-same 체크\n const targetHasSkipIfSame = target?.hasAttribute('skip-if-same');\n const shouldSkip = (this.hasAttribute('skip-if-same') || targetHasSkipIfSame) && this._previousTemplate === target;\n if (shouldSkip) {\n return;\n }\n\n this.cleanup();\n this._previousTemplate = target;\n\n if (target) {\n const clone = target.content.cloneNode(true) as DocumentFragment;\n this._nodes = Array.from(clone.childNodes);\n const elements = this._nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };\n\n // 복제된 최상위 요소들은 SwcChoose의 직접 자식이 될 것이므로 __swc_host 설정 안 함\n this._nodes.forEach((n, nodeIdx) => {\n // if (n instanceof HTMLElement) (n as any).__swc_host = this; // 제거: 부모 체인 유지\n this._executeCloneCallback('on-clone-node', { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });\n\n // Attribute {{ }} 치환 - HTML string 차원에서 동적 치환\n if (n instanceof HTMLElement) {\n Array.from(n.attributes).forEach(attr => {\n const value = attr.value || '';\n if (value.startsWith('{{') && value.endsWith('}}')) {\n const script = value.slice(2, -2).trim();\n const result = FunctionUtils.executeReturn({\n script,\n context: n,\n args: { ...groupArgs, $value: this._value }\n });\n n.setAttribute(attr.name, String(result));\n }\n });\n }\n });\n\n this._executeCloneCallback('on-clone-nodes', groupArgs);\n\n this.parentElement?.insertBefore(clone, this.nextSibling);\n // if (portal === this.parentElement) {\n // portal.insertBefore(clone, this.nextSibling);\n // } else {\n // portal.appendChild(clone);\n // }\n }\n }\n\n private cleanup() {\n this._nodes.forEach(n => n.parentElement?.removeChild(n));\n this._nodes = [];\n }\n\n connectedCallback() {\n this.refresh();\n }\n disconnectedCallback() {\n this.cleanup();\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,25 +1,3 @@
|
|
|
1
|
-
var __defProp = Object.defineProperty;
|
|
2
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
3
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
|
4
|
-
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
|
5
|
-
var __export = (target, all) => {
|
|
6
|
-
for (var name in all)
|
|
7
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
|
8
|
-
};
|
|
9
|
-
var __copyProps = (to, from, except, desc) => {
|
|
10
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
|
11
|
-
for (let key of __getOwnPropNames(from))
|
|
12
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
|
13
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
|
14
|
-
}
|
|
15
|
-
return to;
|
|
16
|
-
};
|
|
17
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
|
18
|
-
var SwcIf_exports = {};
|
|
19
|
-
__export(SwcIf_exports, {
|
|
20
|
-
SwcIf: () => SwcIf
|
|
21
|
-
});
|
|
22
|
-
module.exports = __toCommonJS(SwcIf_exports);
|
|
23
1
|
var import_changedAttributeHost = require("../decorators/changedAttributeHost");
|
|
24
2
|
var import_Utils = require("../utils/Utils");
|
|
25
3
|
var import_core = require("@dooboostore/core");
|
|
@@ -45,49 +23,34 @@ class SwcIf extends HTMLTemplateElement {
|
|
|
45
23
|
this._value = Boolean(nv);
|
|
46
24
|
this.render();
|
|
47
25
|
}
|
|
48
|
-
_resolvePortal() {
|
|
49
|
-
const portalScript = this.getAttribute("on-get-portal");
|
|
50
|
-
if (!portalScript)
|
|
51
|
-
return this.parentElement;
|
|
52
|
-
const win = this.ownerDocument?.defaultView || window;
|
|
53
|
-
const res = import_core.FunctionUtils.executeReturn({
|
|
54
|
-
script: portalScript,
|
|
55
|
-
context: this,
|
|
56
|
-
args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
|
|
57
|
-
});
|
|
58
|
-
if (res instanceof HTMLElement)
|
|
59
|
-
return res;
|
|
60
|
-
if (typeof res === "string")
|
|
61
|
-
return win.document.querySelector(res);
|
|
62
|
-
return this.parentElement;
|
|
63
|
-
}
|
|
64
26
|
_executeCloneCallback(attr, args) {
|
|
65
27
|
const script = this.getAttribute(attr);
|
|
66
28
|
if (!script)
|
|
67
29
|
return;
|
|
68
30
|
import_core.FunctionUtils.execute({ script, context: this, args });
|
|
69
31
|
}
|
|
70
|
-
refreshValue() {
|
|
71
|
-
|
|
72
|
-
if (
|
|
32
|
+
refreshValue(valueAttr) {
|
|
33
|
+
valueAttr ?? (valueAttr = this.getAttribute("value"));
|
|
34
|
+
if (valueAttr === null) {
|
|
73
35
|
this.value = false;
|
|
74
36
|
return;
|
|
75
37
|
}
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
38
|
+
if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
|
|
39
|
+
const script = valueAttr.slice(2, -2).trim();
|
|
40
|
+
const win = this.ownerDocument?.defaultView || window;
|
|
41
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
42
|
+
script,
|
|
43
|
+
context: this,
|
|
44
|
+
args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
|
|
45
|
+
});
|
|
46
|
+
this.value = result;
|
|
84
47
|
} else {
|
|
85
|
-
this.value =
|
|
48
|
+
this.value = Boolean(valueAttr);
|
|
86
49
|
}
|
|
87
50
|
}
|
|
88
51
|
render() {
|
|
89
52
|
this.cleanup();
|
|
90
|
-
const portal = this.
|
|
53
|
+
const portal = this.parentElement;
|
|
91
54
|
if (!portal)
|
|
92
55
|
return;
|
|
93
56
|
const win = this.ownerDocument?.defaultView || window;
|
|
@@ -107,16 +70,24 @@ class SwcIf extends HTMLTemplateElement {
|
|
|
107
70
|
const elements = this._nodes.filter((n) => n.nodeType === 1);
|
|
108
71
|
const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };
|
|
109
72
|
this._nodes.forEach((node, nodeIdx) => {
|
|
110
|
-
if (node instanceof HTMLElement)
|
|
111
|
-
node.__swc_host = this;
|
|
112
73
|
this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: node, $nodeIndex: nodeIdx, $isElement: node.nodeType === 1 });
|
|
74
|
+
if (node instanceof HTMLElement) {
|
|
75
|
+
Array.from(node.attributes).forEach((attr) => {
|
|
76
|
+
const value = attr.value || "";
|
|
77
|
+
if (value.startsWith("{{") && value.endsWith("}}")) {
|
|
78
|
+
const script = value.slice(2, -2).trim();
|
|
79
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
80
|
+
script,
|
|
81
|
+
context: node,
|
|
82
|
+
args: { ...groupArgs, $value: this._value }
|
|
83
|
+
});
|
|
84
|
+
node.setAttribute(attr.name, String(result));
|
|
85
|
+
}
|
|
86
|
+
});
|
|
87
|
+
}
|
|
113
88
|
});
|
|
114
89
|
this._executeCloneCallback("on-clone-nodes", groupArgs);
|
|
115
|
-
|
|
116
|
-
portal.insertBefore(clone, this.nextSibling);
|
|
117
|
-
} else {
|
|
118
|
-
portal.appendChild(clone);
|
|
119
|
-
}
|
|
90
|
+
portal.insertBefore(clone, this.nextSibling);
|
|
120
91
|
}
|
|
121
92
|
}
|
|
122
93
|
cleanup() {
|
|
@@ -131,9 +102,9 @@ class SwcIf extends HTMLTemplateElement {
|
|
|
131
102
|
}
|
|
132
103
|
}
|
|
133
104
|
__decorate([
|
|
134
|
-
(0, import_changedAttributeHost.changedAttributeHost)("
|
|
105
|
+
(0, import_changedAttributeHost.changedAttributeHost)("value"),
|
|
135
106
|
__metadata("design:type", Function),
|
|
136
|
-
__metadata("design:paramtypes", []),
|
|
107
|
+
__metadata("design:paramtypes", [String]),
|
|
137
108
|
__metadata("design:returntype", void 0)
|
|
138
109
|
], SwcIf.prototype, "refreshValue", null);
|
|
139
110
|
//# sourceMappingURL=SwcIf.js.map
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/elements/SwcIf.ts"],
|
|
4
|
-
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\n\
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["import { changedAttributeHost } from '../decorators/changedAttributeHost';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core';\n\nclass SwcIf extends HTMLTemplateElement {\n private _value = false;\n private _nodes: Node[] = [];\n\n get value(): boolean {\n return this._value;\n }\n set value(nv: any) {\n this._value = Boolean(nv);\n this.render();\n }\n\n private _executeCloneCallback(attr: string, args: any) {\n const script = this.getAttribute(attr);\n if (!script) return;\n FunctionUtils.execute({ script, context: this, args });\n }\n\n @changedAttributeHost('value')\n private refreshValue(valueAttr?: string | null) {\n valueAttr ??= this.getAttribute('value');\n if (valueAttr === null) {\n this.value = false;\n return;\n }\n\n // {{ }} 브레이스로 감싸진 값은 스크립트 실행\n if (valueAttr.startsWith('{{') && valueAttr.endsWith('}}')) {\n const script = valueAttr.slice(2, -2).trim();\n const win = this.ownerDocument?.defaultView || window;\n const result = FunctionUtils.executeReturn({\n script,\n context: this,\n args: SwcUtils.getHelperAndHostSet(win, this)\n });\n this.value = result;\n } else {\n // 일반 문자열 값\n this.value = Boolean(valueAttr);\n }\n }\n\n private render() {\n this.cleanup();\n const portal = this.parentElement;\n if (!portal) return;\n\n const win = this.ownerDocument?.defaultView || window;\n const helperSet = SwcUtils.getHelperAndHostSet(win, this);\n\n let targetTpl: HTMLTemplateElement | null = null;\n if (this._value) {\n targetTpl = this;\n } else {\n targetTpl = this.content.querySelector('template[is=\"swc-default\"]') as HTMLTemplateElement;\n }\n\n if (targetTpl) {\n const clone = targetTpl.content.cloneNode(true) as DocumentFragment;\n // If it's the host template, remove sub-templates from clone\n if (targetTpl === this) {\n clone.querySelectorAll('template[is^=\"swc-\"]').forEach(t => t.remove());\n }\n\n this._nodes = Array.from(clone.childNodes);\n const elements = this._nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };\n\n // 부모 체인을 정상적으로 유지하기 위해 __swc_host 할당 제거\n this._nodes.forEach((node, nodeIdx) => {\n // if (node instanceof HTMLElement) (node as any).__swc_host = this; // 제거: 부모 체인 유지\n this._executeCloneCallback('on-clone-node', { ...groupArgs, $node: node, $nodeIndex: nodeIdx, $isElement: node.nodeType === 1 });\n\n // Attribute {{ }} 치환 - SwcChoose처럼 동적 치환\n if (node instanceof HTMLElement) {\n Array.from(node.attributes).forEach(attr => {\n const value = attr.value || '';\n if (value.startsWith('{{') && value.endsWith('}}')) {\n const script = value.slice(2, -2).trim();\n const result = FunctionUtils.executeReturn({\n script,\n context: node,\n args: { ...groupArgs, $value: this._value }\n });\n node.setAttribute(attr.name, String(result));\n }\n });\n }\n });\n\n this._executeCloneCallback('on-clone-nodes', groupArgs);\n\n portal.insertBefore(clone, this.nextSibling);\n }\n }\n\n private cleanup() {\n this._nodes.forEach(n => n.parentElement?.removeChild(n));\n this._nodes = [];\n }\n\n connectedCallback() {\n this.refreshValue();\n }\n disconnectedCallback() {\n this.cleanup();\n }\n}\n"],
|
|
5
|
+
"mappings": "AAAA,kCAAqC;AACrC,mBAAyB;AACzB,kBAA8B;;;;;;;;;;AAE9B,MAAM,cAAc,oBAAmB;EAAvC,cAAA;;AACU,SAAA,SAAS;AACT,SAAA,SAAiB,CAAA;EAyG3B;EAvGE,IAAI,QAAK;AACP,WAAO,KAAK;EACd;EACA,IAAI,MAAM,IAAO;AACf,SAAK,SAAS,QAAQ,EAAE;AACxB,SAAK,OAAM;EACb;EAEQ,sBAAsB,MAAc,MAAS;AACnD,UAAM,SAAS,KAAK,aAAa,IAAI;AACrC,QAAI,CAAC;AAAQ;AACb,8BAAc,QAAQ,EAAE,QAAQ,SAAS,MAAM,KAAI,CAAE;EACvD;EAGQ,aAAa,WAAyB;AAC5C,kBAAA,YAAc,KAAK,aAAa,OAAO;AACvC,QAAI,cAAc,MAAM;AACtB,WAAK,QAAQ;AACb;IACF;AAGA,QAAI,UAAU,WAAW,IAAI,KAAK,UAAU,SAAS,IAAI,GAAG;AAC1D,YAAM,SAAS,UAAU,MAAM,GAAG,EAAE,EAAE,KAAI;AAC1C,YAAM,MAAM,KAAK,eAAe,eAAe;AAC/C,YAAM,SAAS,0BAAc,cAAc;QACzC;QACA,SAAS;QACT,MAAM,sBAAS,oBAAoB,KAAK,IAAI;OAC7C;AACD,WAAK,QAAQ;IACf,OAAO;AAEL,WAAK,QAAQ,QAAQ,SAAS;IAChC;EACF;EAEQ,SAAM;AACZ,SAAK,QAAO;AACZ,UAAM,SAAS,KAAK;AACpB,QAAI,CAAC;AAAQ;AAEb,UAAM,MAAM,KAAK,eAAe,eAAe;AAC/C,UAAM,YAAY,sBAAS,oBAAoB,KAAK,IAAI;AAExD,QAAI,YAAwC;AAC5C,QAAI,KAAK,QAAQ;AACf,kBAAY;IACd,OAAO;AACL,kBAAY,KAAK,QAAQ,cAAc,4BAA4B;IACrE;AAEA,QAAI,WAAW;AACb,YAAM,QAAQ,UAAU,QAAQ,UAAU,IAAI;AAE9C,UAAI,cAAc,MAAM;AACtB,cAAM,iBAAiB,sBAAsB,EAAE,QAAQ,OAAK,EAAE,OAAM,CAAE;MACxE;AAEA,WAAK,SAAS,MAAM,KAAK,MAAM,UAAU;AACzC,YAAM,WAAW,KAAK,OAAO,OAAO,OAAK,EAAE,aAAa,CAAC;AACzD,YAAM,YAAY,EAAE,GAAG,WAAW,QAAQ,KAAK,QAAQ,QAAQ,KAAK,QAAQ,WAAW,UAAU,eAAe,SAAS,CAAC,EAAC;AAG3H,WAAK,OAAO,QAAQ,CAAC,MAAM,YAAW;AAEpC,aAAK,sBAAsB,iBAAiB,EAAE,GAAG,WAAW,OAAO,MAAM,YAAY,SAAS,YAAY,KAAK,aAAa,EAAC,CAAE;AAG/H,YAAI,gBAAgB,aAAa;AAC/B,gBAAM,KAAK,KAAK,UAAU,EAAE,QAAQ,UAAO;AACzC,kBAAM,QAAQ,KAAK,SAAS;AAC5B,gBAAI,MAAM,WAAW,IAAI,KAAK,MAAM,SAAS,IAAI,GAAG;AAClD,oBAAM,SAAS,MAAM,MAAM,GAAG,EAAE,EAAE,KAAI;AACtC,oBAAM,SAAS,0BAAc,cAAc;gBACzC;gBACA,SAAS;gBACT,MAAM,EAAE,GAAG,WAAW,QAAQ,KAAK,OAAM;eAC1C;AACD,mBAAK,aAAa,KAAK,MAAM,OAAO,MAAM,CAAC;YAC7C;UACF,CAAC;QACH;MACF,CAAC;AAED,WAAK,sBAAsB,kBAAkB,SAAS;AAEtD,aAAO,aAAa,OAAO,KAAK,WAAW;IAC7C;EACF;EAEQ,UAAO;AACb,SAAK,OAAO,QAAQ,OAAK,EAAE,eAAe,YAAY,CAAC,CAAC;AACxD,SAAK,SAAS,CAAA;EAChB;EAEA,oBAAiB;AACf,SAAK,aAAY;EACnB;EACA,uBAAoB;AAClB,SAAK,QAAO;EACd;;AAvFQ,WAAA;MADP,kDAAqB,OAAO;;;;;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|