@dooboostore/simple-web-component 1.0.30 → 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 +220 -1
- package/dist/cjs/decorators/elementDefine.js +3 -3
- package/dist/cjs/decorators/elementDefine.js.map +2 -2
- package/dist/cjs/elements/SwcAppEngine.js +3 -3
- package/dist/cjs/elements/SwcAppEngine.js.map +2 -2
- package/dist/cjs/elements/SwcAppMixin.js +0 -7
- package/dist/cjs/elements/SwcAppMixin.js.map +2 -2
- package/dist/cjs/elements/SwcAsync.js +35 -54
- package/dist/cjs/elements/SwcAsync.js.map +2 -2
- package/dist/cjs/elements/SwcChoose.js +2 -23
- 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 +88 -92
- package/dist/cjs/elements/register.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 +24 -11
- package/dist/cjs/utils/Utils.js.map +2 -2
- package/dist/esm/decorators/elementDefine.js +3 -3
- package/dist/esm/decorators/elementDefine.js.map +2 -2
- package/dist/esm/elements/SwcAppEngine.js +3 -3
- package/dist/esm/elements/SwcAppEngine.js.map +2 -2
- package/dist/esm/elements/SwcAppMixin.js +0 -7
- package/dist/esm/elements/SwcAppMixin.js.map +2 -2
- package/dist/esm/elements/SwcAsync.js +35 -35
- package/dist/esm/elements/SwcAsync.js.map +2 -2
- package/dist/esm/elements/SwcChoose.js +2 -4
- 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 +88 -92
- package/dist/esm/elements/register.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 +24 -11
- package/dist/esm/utils/Utils.js.map +2 -2
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +27 -14
- package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +2 -2
- package/dist/types/decorators/elementDefine.d.ts.map +1 -1
- 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.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 +27 -14
- package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +2 -2
- package/package.json +3 -3
- package/src/decorators/elementDefine.ts +6 -3
- package/src/elements/SwcAppEngine.ts +3 -3
- package/src/elements/SwcAppMixin.ts +5 -26
- package/src/elements/SwcAsync.ts +43 -31
- package/src/elements/SwcChoose.ts +8 -3
- 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 +107 -86
- package/src/router/ElementRouter.ts +1 -12
- package/src/types.ts +3 -1
- package/src/utils/Utils.ts +37 -20
|
@@ -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,36 +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) {
|
|
66
28
|
this.render("default");
|
|
67
29
|
return;
|
|
68
30
|
}
|
|
69
|
-
|
|
70
|
-
|
|
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) {
|
|
71
45
|
if (result instanceof Promise) {
|
|
72
46
|
this.render("loading");
|
|
73
47
|
result.then((v) => {
|
|
@@ -81,7 +55,7 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
81
55
|
}
|
|
82
56
|
render(state) {
|
|
83
57
|
this.cleanup();
|
|
84
|
-
const portal = this.
|
|
58
|
+
const portal = this.parentElement;
|
|
85
59
|
if (!portal)
|
|
86
60
|
return;
|
|
87
61
|
const win = this.ownerDocument?.defaultView || window;
|
|
@@ -93,16 +67,24 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
93
67
|
const elements = this._nodes.filter((n) => n.nodeType === 1);
|
|
94
68
|
const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0], $state: state };
|
|
95
69
|
this._nodes.forEach((n, nodeIdx) => {
|
|
96
|
-
if (n instanceof HTMLElement)
|
|
97
|
-
n.__swc_host = this;
|
|
98
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
|
+
}
|
|
99
85
|
});
|
|
100
86
|
this._executeCloneCallback("on-clone-nodes", groupArgs);
|
|
101
|
-
|
|
102
|
-
portal.insertBefore(clone, this.nextSibling);
|
|
103
|
-
} else {
|
|
104
|
-
portal.appendChild(clone);
|
|
105
|
-
}
|
|
87
|
+
portal.insertBefore(clone, this.nextSibling);
|
|
106
88
|
}
|
|
107
89
|
}
|
|
108
90
|
cleanup() {
|
|
@@ -110,7 +92,6 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
110
92
|
this._nodes = [];
|
|
111
93
|
}
|
|
112
94
|
connectedCallback() {
|
|
113
|
-
console.log("[SwcAsync] connectedCallback called");
|
|
114
95
|
this.refresh();
|
|
115
96
|
}
|
|
116
97
|
disconnectedCallback() {
|
|
@@ -118,9 +99,9 @@ class SwcAsync extends HTMLTemplateElement {
|
|
|
118
99
|
}
|
|
119
100
|
}
|
|
120
101
|
__decorate([
|
|
121
|
-
(0, import_changedAttributeHost.changedAttributeHost)("
|
|
102
|
+
(0, import_changedAttributeHost.changedAttributeHost)("value"),
|
|
122
103
|
__metadata("design:type", Function),
|
|
123
|
-
__metadata("design:paramtypes", []),
|
|
104
|
+
__metadata("design:paramtypes", [String]),
|
|
124
105
|
__metadata("design:returntype", void 0)
|
|
125
106
|
], SwcAsync.prototype, "refresh", null);
|
|
126
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");
|
|
@@ -61,7 +39,8 @@ class SwcChoose extends HTMLTemplateElement {
|
|
|
61
39
|
if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
|
|
62
40
|
const script = valueAttr.slice(2, -2).trim();
|
|
63
41
|
const win = this.ownerDocument?.defaultView || window;
|
|
64
|
-
const
|
|
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 });
|
|
65
44
|
this.value = result;
|
|
66
45
|
} else {
|
|
67
46
|
this.value = valueAttr;
|
|
@@ -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
|
}
|
|
@@ -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 SwcLoop_exports = {};
|
|
19
|
-
__export(SwcLoop_exports, {
|
|
20
|
-
SwcLoop: () => SwcLoop
|
|
21
|
-
});
|
|
22
|
-
module.exports = __toCommonJS(SwcLoop_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,22 +23,6 @@ class SwcLoop extends HTMLTemplateElement {
|
|
|
45
23
|
this._value = Array.isArray(nv) ? [...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)
|
|
@@ -72,11 +34,14 @@ class SwcLoop extends HTMLTemplateElement {
|
|
|
72
34
|
this._nodeGroups = [];
|
|
73
35
|
}
|
|
74
36
|
refreshValue() {
|
|
75
|
-
|
|
37
|
+
let script = this.getAttribute("value");
|
|
76
38
|
if (!script) {
|
|
77
39
|
this.value = [];
|
|
78
40
|
return;
|
|
79
41
|
}
|
|
42
|
+
if (script.startsWith("{{") && script.endsWith("}}")) {
|
|
43
|
+
script = script.slice(2, -2).trim();
|
|
44
|
+
}
|
|
80
45
|
const win = this.ownerDocument?.defaultView || window;
|
|
81
46
|
const res = import_core.FunctionUtils.executeReturn({
|
|
82
47
|
script,
|
|
@@ -91,7 +56,7 @@ class SwcLoop extends HTMLTemplateElement {
|
|
|
91
56
|
}
|
|
92
57
|
render() {
|
|
93
58
|
this._cleanup();
|
|
94
|
-
const portal = this.
|
|
59
|
+
const portal = this.parentElement;
|
|
95
60
|
if (!portal)
|
|
96
61
|
return;
|
|
97
62
|
const win = this.ownerDocument?.defaultView || window;
|
|
@@ -114,9 +79,21 @@ class SwcLoop extends HTMLTemplateElement {
|
|
|
114
79
|
const elements = nodes.filter((n) => n.nodeType === 1);
|
|
115
80
|
const groupArgs = { ...helperSet, $item: item, $index: index, $value: this._value, $nodes: nodes, $elements: elements, $firstElement: elements[0] };
|
|
116
81
|
nodes.forEach((node, nodeIdx) => {
|
|
117
|
-
if (node instanceof HTMLElement)
|
|
118
|
-
node.__swc_host = this;
|
|
119
82
|
this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: node, $nodeIndex: nodeIdx, $isElement: node.nodeType === 1 });
|
|
83
|
+
if (node instanceof HTMLElement) {
|
|
84
|
+
Array.from(node.attributes).forEach((attr) => {
|
|
85
|
+
const value = attr.value || "";
|
|
86
|
+
if (value.startsWith("{{") && value.endsWith("}}")) {
|
|
87
|
+
const script = value.slice(2, -2).trim();
|
|
88
|
+
const result = import_core.FunctionUtils.executeReturn({
|
|
89
|
+
script,
|
|
90
|
+
context: node,
|
|
91
|
+
args: groupArgs
|
|
92
|
+
});
|
|
93
|
+
node.setAttribute(attr.name, String(result));
|
|
94
|
+
}
|
|
95
|
+
});
|
|
96
|
+
}
|
|
120
97
|
});
|
|
121
98
|
this._executeCloneCallback("on-clone-nodes", groupArgs);
|
|
122
99
|
this._nodeGroups.push(nodes);
|
|
@@ -137,7 +114,7 @@ class SwcLoop extends HTMLTemplateElement {
|
|
|
137
114
|
}
|
|
138
115
|
}
|
|
139
116
|
__decorate([
|
|
140
|
-
(0, import_changedAttributeHost.changedAttributeHost)("
|
|
117
|
+
(0, import_changedAttributeHost.changedAttributeHost)("value"),
|
|
141
118
|
__metadata("design:type", Function),
|
|
142
119
|
__metadata("design:paramtypes", []),
|
|
143
120
|
__metadata("design:returntype", void 0)
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/elements/SwcLoop.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 SwcLoop extends HTMLTemplateElement {\n private _value: any[] = [];\n private _nodeGroups: Node[][] = [];\n\n get value(): any[] {\n return this._value;\n }\n set value(nv: any[]) {\n this._value = Array.isArray(nv) ? [...nv] : [];\n this.render();\n }\n\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 private _cleanup() {\n this._nodeGroups.forEach(nodes => nodes.forEach(n => n.parentElement?.removeChild(n)));\n this._nodeGroups = [];\n }\n\n @changedAttributeHost('value')\n private refreshValue() {\n let script = this.getAttribute('value');\n if (!script) {\n this.value = [];\n return;\n }\n // Parse {{ }} braces\n if (script.startsWith('{{') && script.endsWith('}}')) {\n script = script.slice(2, -2).trim();\n }\n const win = this.ownerDocument?.defaultView || window;\n const res = FunctionUtils.executeReturn({\n script,\n context: this,\n args: SwcUtils.getHelperAndHostSet(win, this)\n });\n\n if (res instanceof Promise) {\n res.then(v => (this.value = v)).catch(() => (this.value = []));\n } else {\n this.value = res;\n }\n }\n\n 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 const fragment = win.document.createDocumentFragment();\n\n if (this._value.length === 0) {\n const defaultTpl = this.content.querySelector('template[is=\"swc-default\"]') as HTMLTemplateElement;\n if (defaultTpl) {\n const clone = defaultTpl.content.cloneNode(true);\n const nodes = Array.from(clone.childNodes);\n this._nodeGroups.push(nodes);\n fragment.appendChild(clone);\n }\n } else {\n this._value.forEach((item, index) => {\n const clone = this.content.cloneNode(true) as DocumentFragment;\n // Filter out sub-templates\n const subTemplates = clone.querySelectorAll('template[is^=\"swc-\"]');\n subTemplates.forEach(t => t.remove());\n\n const nodes = Array.from(clone.childNodes);\n const elements = nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n\n const groupArgs = { ...helperSet, $item: item, $index: index, $value: this._value, $nodes: nodes, $elements: elements, $firstElement: elements[0] };\n\n nodes.forEach((node, nodeIdx) => {\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\n });\n node.setAttribute(attr.name, String(result));\n }\n });\n }\n });\n\n this._executeCloneCallback('on-clone-nodes', groupArgs);\n this._nodeGroups.push(nodes);\n fragment.appendChild(clone);\n });\n }\n\n if (portal === this.parentElement) {\n portal.insertBefore(fragment, this.nextSibling);\n } else {\n portal.appendChild(fragment);\n }\n }\n\n connectedCallback() {\n this.refreshValue();\n }\n disconnectedCallback() {\n this._cleanup();\n }\n}\n"],
|
|
5
|
+
"mappings": "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",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|
|
@@ -1,30 +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 SwcSubTemplates_exports = {};
|
|
19
|
-
__export(SwcSubTemplates_exports, {
|
|
20
|
-
SwcDefault: () => SwcDefault,
|
|
21
|
-
SwcError: () => SwcError,
|
|
22
|
-
SwcLoading: () => SwcLoading,
|
|
23
|
-
SwcOtherwise: () => SwcOtherwise,
|
|
24
|
-
SwcSuccess: () => SwcSuccess,
|
|
25
|
-
SwcWhen: () => SwcWhen
|
|
26
|
-
});
|
|
27
|
-
module.exports = __toCommonJS(SwcSubTemplates_exports);
|
|
28
1
|
class SwcLoading extends HTMLTemplateElement {
|
|
29
2
|
}
|
|
30
3
|
class SwcError extends HTMLTemplateElement {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"version": 3,
|
|
3
3
|
"sources": ["../../../src/elements/SwcSubTemplates.ts"],
|
|
4
|
-
"sourcesContent": ["
|
|
5
|
-
"mappings": "
|
|
4
|
+
"sourcesContent": ["class SwcLoading extends HTMLTemplateElement {}\nclass SwcError extends HTMLTemplateElement {}\nclass SwcSuccess extends HTMLTemplateElement {}\nclass SwcWhen extends HTMLTemplateElement {}\nclass SwcOtherwise extends HTMLTemplateElement {}\nclass SwcDefault extends HTMLTemplateElement {}\n"],
|
|
5
|
+
"mappings": "AAAA,MAAM,mBAAmB,oBAAoB;AAAC;AAC9C,MAAM,iBAAiB,oBAAoB;AAAC;AAC5C,MAAM,mBAAmB,oBAAoB;AAAC;AAC9C,MAAM,gBAAgB,oBAAoB;AAAC;AAC3C,MAAM,qBAAqB,oBAAoB;AAAC;AAChD,MAAM,mBAAmB,oBAAoB;AAAC;",
|
|
6
6
|
"names": []
|
|
7
7
|
}
|