dom-render 1.0.91 → 1.0.92

Sign up to get free protection for your applications and to get access to all the features.
Files changed (44) hide show
  1. package/DomRender.js +5 -1
  2. package/DomRenderProxy.d.ts +1 -1
  3. package/DomRenderProxy.js +121 -63
  4. package/README.MD +14 -2
  5. package/configs/TargetElement.d.ts +1 -1
  6. package/dist/bundle.js +1189 -835
  7. package/events/EventManager.js +1 -0
  8. package/operators/Dr.d.ts +1 -1
  9. package/operators/Dr.js +58 -17
  10. package/operators/DrAppender.d.ts +1 -1
  11. package/operators/DrAppender.js +61 -21
  12. package/operators/DrFor.d.ts +1 -1
  13. package/operators/DrFor.js +58 -17
  14. package/operators/DrForOf.d.ts +1 -1
  15. package/operators/DrForOf.js +61 -20
  16. package/operators/DrForm.d.ts +1 -1
  17. package/operators/DrForm.js +87 -46
  18. package/operators/DrIf.d.ts +1 -1
  19. package/operators/DrIf.js +62 -23
  20. package/operators/DrInnerHTML.d.ts +1 -1
  21. package/operators/DrInnerHTML.js +56 -15
  22. package/operators/DrInnerText.d.ts +1 -1
  23. package/operators/DrInnerText.js +54 -13
  24. package/operators/DrPre.d.ts +1 -1
  25. package/operators/DrPre.js +41 -1
  26. package/operators/DrRepeat.d.ts +1 -1
  27. package/operators/DrRepeat.js +58 -17
  28. package/operators/DrTargetAttr.d.ts +1 -1
  29. package/operators/DrTargetAttr.js +64 -23
  30. package/operators/DrTargetElement.d.ts +1 -1
  31. package/operators/DrTargetElement.js +78 -34
  32. package/operators/DrThis.d.ts +1 -1
  33. package/operators/DrThis.js +73 -23
  34. package/operators/OperatorExecuter.d.ts +3 -2
  35. package/operators/OperatorExecuter.js +60 -14
  36. package/operators/OperatorExecuterAttrRequire.d.ts +2 -2
  37. package/operators/OperatorExecuterAttrRequire.js +48 -24
  38. package/package.json +1 -1
  39. package/rawsets/RawSet.d.ts +3 -3
  40. package/rawsets/RawSet.js +458 -315
  41. package/routers/HashRouter.js +1 -1
  42. package/routers/PathRouter.js +1 -1
  43. package/routers/Router.d.ts +3 -0
  44. package/routers/Router.js +10 -0
package/rawsets/RawSet.js CHANGED
@@ -10,6 +10,42 @@ var __assign = (this && this.__assign) || function () {
10
10
  };
11
11
  return __assign.apply(this, arguments);
12
12
  };
13
+ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
14
+ function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
15
+ return new (P || (P = Promise))(function (resolve, reject) {
16
+ function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
17
+ function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
18
+ function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
19
+ step((generator = generator.apply(thisArg, _arguments || [])).next());
20
+ });
21
+ };
22
+ var __generator = (this && this.__generator) || function (thisArg, body) {
23
+ var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
24
+ return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
25
+ function verb(n) { return function (v) { return step([n, v]); }; }
26
+ function step(op) {
27
+ if (f) throw new TypeError("Generator is already executing.");
28
+ while (_) try {
29
+ if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
30
+ if (y = 0, t) op = [op[0] & 2, t.value];
31
+ switch (op[0]) {
32
+ case 0: case 1: t = op; break;
33
+ case 4: _.label++; return { value: op[1], done: false };
34
+ case 5: _.label++; y = op[1]; op = [0]; continue;
35
+ case 7: op = _.ops.pop(); _.trys.pop(); continue;
36
+ default:
37
+ if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
38
+ if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
39
+ if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
40
+ if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
41
+ if (t[2]) _.ops.pop();
42
+ _.trys.pop(); continue;
43
+ }
44
+ op = body.call(thisArg, _);
45
+ } catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
46
+ if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
47
+ }
48
+ };
13
49
  var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
14
50
  if (pack || arguments.length === 2) for (var i = 0, l = from.length, ar; i < l; i++) {
15
51
  if (ar || !(i in from)) {
@@ -109,167 +145,185 @@ var RawSet = /** @class */ (function () {
109
145
  };
110
146
  // 중요 render 처리 부분
111
147
  RawSet.prototype.render = function (obj, config) {
112
- var _this = this;
113
148
  var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
114
- var genNode = config.window.document.importNode(this.fragment, true);
115
- var raws = [];
116
- var onAttrInitCallBacks = [];
117
- var onElementInitCallBacks = [];
118
- var onThisComponentSetCallBacks = [];
119
- var drAttrs = [];
120
- for (var _i = 0, _y = Array.from(genNode.childNodes.values()); _i < _y.length; _i++) {
121
- var cNode = _y[_i];
122
- var attribute = {};
123
- if (cNode.nodeType === Node.ELEMENT_NODE) {
124
- attribute = DomUtils_1.DomUtils.getAttributeToObject(cNode);
125
- }
126
- var __render = Object.freeze({
127
- rawset: this,
128
- scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj),
129
- router: config === null || config === void 0 ? void 0 : config.router,
130
- range: Range_1.Range.range,
131
- element: cNode,
132
- attribute: attribute,
133
- bindScript: "\n const ".concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n const ").concat(EventManager_1.EventManager.ELEMENT_VARNAME, " = this.__render.element;\n const ").concat(EventManager_1.EventManager.ATTRIBUTE_VARNAME, " = this.__render.attribute;\n const ").concat(EventManager_1.EventManager.RANGE_VARNAME, " = this.__render.range;\n const ").concat(EventManager_1.EventManager.ROUTER_VARNAME, " = this.__render.router;\n ")
134
- // eslint-disable-next-line no-use-before-define
135
- });
136
- var fag = config.window.document.createDocumentFragment();
137
- if (cNode.nodeType === Node.TEXT_NODE && cNode.textContent) {
138
- // console.log('text-->', this, obj, config)
139
- // console.log('text-->', Array.from(this.fragment.childNodes))
140
- var textContent = cNode.textContent;
141
- var runText = RawSet.exporesionGrouops(textContent)[0][1];
142
- // console.log('--->', RawSet.exporesionGrouops(textContent), textContent,runText, runText[0][1])
143
- var newNode = void 0;
144
- if (textContent === null || textContent === void 0 ? void 0 : textContent.startsWith('#')) {
145
- var r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
146
- var template = config.window.document.createElement('template');
147
- template.innerHTML = r;
148
- newNode = template.content;
149
- }
150
- else {
151
- var r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
152
- newNode = config.window.document.createTextNode(r);
153
- }
154
- (_a = cNode.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(newNode, cNode);
155
- // console.log('-------', this.point.start.parentNode.nodeName)
156
- // 중요 style value change 됐을때 다시 처리해야되기떄문에: 마지막에 completed 없는 attr 가지고 판단 하니깐
157
- if (this.type === RawSetType_1.RawSetType.STYLE_TEXT && this.point.parent) {
158
- this.point.parent.removeAttribute('completed');
159
- }
160
- }
161
- else if (cNode.nodeType === Node.ELEMENT_NODE) {
162
- var element = cNode;
163
- // console.log('target-->', element)
164
- var drAttr = {
165
- dr: this.getAttributeAndDelete(element, RawSet.DR),
166
- drIf: this.getAttributeAndDelete(element, RawSet.DR_IF_NAME),
167
- drFor: this.getAttributeAndDelete(element, RawSet.DR_FOR_NAME),
168
- drForOf: this.getAttributeAndDelete(element, RawSet.DR_FOR_OF_NAME),
169
- drAppender: this.getAttributeAndDelete(element, RawSet.DR_APPENDER_NAME),
170
- drRepeat: this.getAttributeAndDelete(element, RawSet.DR_REPEAT_NAME),
171
- drThis: this.getAttributeAndDelete(element, RawSet.DR_THIS_NAME),
172
- drForm: this.getAttributeAndDelete(element, RawSet.DR_FORM_NAME),
173
- drPre: this.getAttributeAndDelete(element, RawSet.DR_PRE_NAME),
174
- drInnerHTML: this.getAttributeAndDelete(element, RawSet.DR_INNERHTML_NAME),
175
- drInnerText: this.getAttributeAndDelete(element, RawSet.DR_INNERTEXT_NAME),
176
- drItOption: this.getAttributeAndDelete(element, RawSet.DR_IT_OPTIONNAME),
177
- drVarOption: this.getAttributeAndDelete(element, RawSet.DR_VAR_OPTIONNAME),
178
- drNextOption: this.getAttributeAndDelete(element, RawSet.DR_NEXT_OPTIONNAME),
179
- drAfterOption: this.getAttributeAndDelete(element, RawSet.DR_AFTER_OPTIONNAME),
180
- drBeforeOption: this.getAttributeAndDelete(element, RawSet.DR_BEFORE_OPTIONNAME),
181
- drCompleteOption: this.getAttributeAndDelete(element, RawSet.DR_COMPLETE_OPTIONNAME),
182
- drStripOption: this.getAttributeAndDelete(element, RawSet.DR_STRIP_OPTIONNAME),
183
- drDestroyOption: this.getAttributeAndDelete(element, RawSet.DR_DESTROY_OPTIONNAME)
184
- };
185
- drAttrs.push(drAttr);
186
- var operators = [
187
- new DrPre_1.DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drPre, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_b = config.operatorAround) === null || _b === void 0 ? void 0 : _b.drPre }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
188
- new Dr_1.Dr(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.dr, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_c = config.operatorAround) === null || _c === void 0 ? void 0 : _c.dr }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
189
- new DrIf_1.DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drIf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_d = config.operatorAround) === null || _d === void 0 ? void 0 : _d.drIf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
190
- new DrThis_1.DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drThis, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_e = config.operatorAround) === null || _e === void 0 ? void 0 : _e.drThis }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
191
- new DrForm_1.DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drForm, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_f = config.operatorAround) === null || _f === void 0 ? void 0 : _f.drForm }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
192
- new DrInnerText_1.DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drInnerText, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_g = config.operatorAround) === null || _g === void 0 ? void 0 : _g.drInnerText }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
193
- new DrInnerHTML_1.DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drInnerHTML, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_h = config.operatorAround) === null || _h === void 0 ? void 0 : _h.drInnerHTML }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
194
- new DrFor_1.DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drFor, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_j = config.operatorAround) === null || _j === void 0 ? void 0 : _j.drFor }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
195
- new DrForOf_1.DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drForOf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_k = config.operatorAround) === null || _k === void 0 ? void 0 : _k.drForOf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
196
- new DrAppender_1.DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drAppender, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_l = config.operatorAround) === null || _l === void 0 ? void 0 : _l.drAppender }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
197
- new DrRepeat_1.DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drRepeat, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_m = config.operatorAround) === null || _m === void 0 ? void 0 : _m.drRepeat }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
198
- new DrTargetElement_1.DrTargetElement(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
199
- new DrTargetAttr_1.DrTargetAttr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks })
200
- ];
201
- for (var _z = 0, operators_1 = operators; _z < operators_1.length; _z++) {
202
- var operator = operators_1[_z];
203
- var state = operator.start();
204
- if (state === OperatorExecuter_1.ExecuteState.EXECUTE) {
205
- break;
206
- }
207
- else if (state === OperatorExecuter_1.ExecuteState.STOP) {
208
- return raws;
209
- }
210
- }
211
- }
212
- }
213
- this.applyEvent(obj, genNode, config);
214
- this.replaceBody(genNode); // 중요 여기서 마지막에 연션된 값을 그려준다.
215
- drAttrs.forEach(function (it) {
216
- if (it.drCompleteOption) {
217
- // genNode.childNodes
218
- var render = Object.freeze({
219
- rawset: _this,
220
- fag: genNode,
221
- scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj)
222
- });
223
- ScriptUtils_1.ScriptUtils.eval("\n const ".concat(EventManager_1.EventManager.FAG_VARNAME, " = this.__render.fag;\n const ").concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n ").concat(it.drCompleteOption), Object.assign(obj, { __render: render }));
224
- }
225
- });
226
- // 중요 style isolation 나중에 :scope로 대체 가능할듯.
227
- RawSet.generateStyleSheetsLocal();
228
- for (var _0 = 0, onThisComponentSetCallBacks_1 = onThisComponentSetCallBacks; _0 < onThisComponentSetCallBacks_1.length; _0++) {
229
- var it_1 = onThisComponentSetCallBacks_1[_0];
230
- (_p = (_o = it_1.obj) === null || _o === void 0 ? void 0 : _o.onInitRender) === null || _p === void 0 ? void 0 : _p.call(_o);
231
- }
232
- for (var _1 = 0, onElementInitCallBacks_1 = onElementInitCallBacks; _1 < onElementInitCallBacks_1.length; _1++) {
233
- var it_2 = onElementInitCallBacks_1[_1];
234
- if (((_r = (_q = it_2.targetElement) === null || _q === void 0 ? void 0 : _q.__render) === null || _r === void 0 ? void 0 : _r.element) && ((_t = (_s = it_2.targetElement) === null || _s === void 0 ? void 0 : _s.__render) === null || _t === void 0 ? void 0 : _t.component)) {
235
- var oninit = it_2.targetElement.__render.element.getAttribute(RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME); // dr-on-component-init
236
- var param = [];
237
- if (oninit) {
238
- var script = "".concat(it_2.targetElement.__render.renderScript, " return ").concat(oninit, " ");
239
- param = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
240
- __render: it_2.targetElement.__render
241
- }));
242
- if (!Array.isArray(param)) {
243
- param = [param];
244
- }
245
- }
246
- (_v = (_u = it_2.targetElement.__render.component).onInitRender) === null || _v === void 0 ? void 0 : _v.call.apply(_v, __spreadArray([_u], param, false));
247
- }
248
- (_w = config === null || config === void 0 ? void 0 : config.onElementInit) === null || _w === void 0 ? void 0 : _w.call(config, it_2.name, obj, this, it_2.targetElement);
249
- }
250
- // TODO: 이부분도 위에 targetElement 처럼 해야될까?
251
- for (var _2 = 0, onAttrInitCallBacks_1 = onAttrInitCallBacks; _2 < onAttrInitCallBacks_1.length; _2++) {
252
- var it_3 = onAttrInitCallBacks_1[_2];
253
- (_x = config === null || config === void 0 ? void 0 : config.onAttrInit) === null || _x === void 0 ? void 0 : _x.call(config, it_3.attrName, it_3.attrValue, obj, this);
254
- }
255
- // component destroy
256
- if (obj.__domrender_components) {
257
- Object.entries(obj.__domrender_components).forEach(function (_a) {
258
- var _b, _c;
259
- var key = _a[0], value = _a[1];
260
- var domrenderComponentNew = value.__domrender_component_new;
261
- var rawSet = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.rawSet;
262
- var drAttrs = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.drAttrs;
263
- if (rawSet && !rawSet.isConnected) {
264
- // const domrenderComponent = obj.__domrender_components[key];
265
- // console.log('component destroy--->', key, rawSet, rawSet.isConnected, domrenderComponent.name, domrenderComponent);
266
- var destroyOptions = (_c = (_b = drAttrs === null || drAttrs === void 0 ? void 0 : drAttrs.drDestroyOption) === null || _b === void 0 ? void 0 : _b.split(',')) !== null && _c !== void 0 ? _c : [];
267
- RawSet.destroy(obj.__domrender_components[key], [domrenderComponentNew], config, destroyOptions);
268
- delete obj.__domrender_components[key];
149
+ return __awaiter(this, void 0, void 0, function () {
150
+ var genNode, raws, onAttrInitCallBacks, onElementInitCallBacks, onThisComponentSetCallBacks, drAttrs, _i, _y, cNode, attribute, __render, fag, textContent, runText, newNode, r, template, r, element, drAttr, operators, _z, operators_1, operator, state, _0, onThisComponentSetCallBacks_1, it_1, _1, onElementInitCallBacks_1, it_2, oninit, param, script, _2, onAttrInitCallBacks_1, it_3;
151
+ var _this = this;
152
+ return __generator(this, function (_3) {
153
+ switch (_3.label) {
154
+ case 0:
155
+ genNode = config.window.document.importNode(this.fragment, true);
156
+ raws = [];
157
+ onAttrInitCallBacks = [];
158
+ onElementInitCallBacks = [];
159
+ onThisComponentSetCallBacks = [];
160
+ drAttrs = [];
161
+ _i = 0, _y = Array.from(genNode.childNodes.values());
162
+ _3.label = 1;
163
+ case 1:
164
+ if (!(_i < _y.length)) return [3 /*break*/, 7];
165
+ cNode = _y[_i];
166
+ attribute = {};
167
+ if (cNode.nodeType === Node.ELEMENT_NODE) {
168
+ attribute = DomUtils_1.DomUtils.getAttributeToObject(cNode);
169
+ }
170
+ __render = Object.freeze({
171
+ rawset: this,
172
+ scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj),
173
+ router: config === null || config === void 0 ? void 0 : config.router,
174
+ range: Range_1.Range.range,
175
+ element: cNode,
176
+ attribute: attribute,
177
+ bindScript: "\n const ".concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n const ").concat(EventManager_1.EventManager.ELEMENT_VARNAME, " = this.__render.element;\n const ").concat(EventManager_1.EventManager.ATTRIBUTE_VARNAME, " = this.__render.attribute;\n const ").concat(EventManager_1.EventManager.RANGE_VARNAME, " = this.__render.range;\n const ").concat(EventManager_1.EventManager.ROUTER_VARNAME, " = this.__render.router;\n ")
178
+ // eslint-disable-next-line no-use-before-define
179
+ });
180
+ fag = config.window.document.createDocumentFragment();
181
+ if (!(cNode.nodeType === Node.TEXT_NODE && cNode.textContent)) return [3 /*break*/, 2];
182
+ textContent = cNode.textContent;
183
+ runText = RawSet.exporesionGrouops(textContent)[0][1];
184
+ newNode = void 0;
185
+ if (textContent === null || textContent === void 0 ? void 0 : textContent.startsWith('#')) {
186
+ r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
187
+ template = config.window.document.createElement('template');
188
+ template.innerHTML = r;
189
+ newNode = template.content;
190
+ }
191
+ else {
192
+ r = ScriptUtils_1.ScriptUtils.eval("".concat(__render.bindScript, " return ").concat(runText), Object.assign(obj, { __render: __render }));
193
+ newNode = config.window.document.createTextNode(r);
194
+ }
195
+ (_a = cNode.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(newNode, cNode);
196
+ // console.log('-------', this.point.start.parentNode.nodeName)
197
+ // 중요 style value change 됐을때 다시 처리해야되기떄문에: 마지막에 completed 없는 attr 가지고 판단 하니깐
198
+ if (this.type === RawSetType_1.RawSetType.STYLE_TEXT && this.point.parent) {
199
+ this.point.parent.removeAttribute('completed');
200
+ }
201
+ return [3 /*break*/, 6];
202
+ case 2:
203
+ if (!(cNode.nodeType === Node.ELEMENT_NODE)) return [3 /*break*/, 6];
204
+ element = cNode;
205
+ drAttr = {
206
+ dr: this.getAttributeAndDelete(element, RawSet.DR_NAME),
207
+ drIf: this.getAttributeAndDelete(element, RawSet.DR_IF_NAME),
208
+ drFor: this.getAttributeAndDelete(element, RawSet.DR_FOR_NAME),
209
+ drForOf: this.getAttributeAndDelete(element, RawSet.DR_FOR_OF_NAME),
210
+ drAppender: this.getAttributeAndDelete(element, RawSet.DR_APPENDER_NAME),
211
+ drRepeat: this.getAttributeAndDelete(element, RawSet.DR_REPEAT_NAME),
212
+ drThis: this.getAttributeAndDelete(element, RawSet.DR_THIS_NAME),
213
+ drForm: this.getAttributeAndDelete(element, RawSet.DR_FORM_NAME),
214
+ drPre: this.getAttributeAndDelete(element, RawSet.DR_PRE_NAME),
215
+ drInnerHTML: this.getAttributeAndDelete(element, RawSet.DR_INNERHTML_NAME),
216
+ drInnerText: this.getAttributeAndDelete(element, RawSet.DR_INNERTEXT_NAME),
217
+ drItOption: this.getAttributeAndDelete(element, RawSet.DR_IT_OPTIONNAME),
218
+ drVarOption: this.getAttributeAndDelete(element, RawSet.DR_VAR_OPTIONNAME),
219
+ drNextOption: this.getAttributeAndDelete(element, RawSet.DR_NEXT_OPTIONNAME),
220
+ drAfterOption: this.getAttributeAndDelete(element, RawSet.DR_AFTER_OPTIONNAME),
221
+ drBeforeOption: this.getAttributeAndDelete(element, RawSet.DR_BEFORE_OPTIONNAME),
222
+ drCompleteOption: this.getAttributeAndDelete(element, RawSet.DR_COMPLETE_OPTIONNAME),
223
+ drStripOption: this.getAttributeAndDelete(element, RawSet.DR_STRIP_OPTIONNAME),
224
+ drDestroyOption: this.getAttributeAndDelete(element, RawSet.DR_DESTROY_OPTIONNAME)
225
+ };
226
+ drAttrs.push(drAttr);
227
+ operators = [
228
+ new DrPre_1.DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_PRE_NAME, attr: drAttr.drPre, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_b = config.operatorAround) === null || _b === void 0 ? void 0 : _b.drPre }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
229
+ new Dr_1.Dr(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_NAME, attr: drAttr.dr, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_c = config.operatorAround) === null || _c === void 0 ? void 0 : _c.dr }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
230
+ new DrIf_1.DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_IF_NAME, attr: drAttr.drIf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_d = config.operatorAround) === null || _d === void 0 ? void 0 : _d.drIf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
231
+ new DrThis_1.DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_THIS_NAME, attr: drAttr.drThis, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_e = config.operatorAround) === null || _e === void 0 ? void 0 : _e.drThis }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
232
+ new DrForm_1.DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_NAME, attr: drAttr.drForm, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_f = config.operatorAround) === null || _f === void 0 ? void 0 : _f.drForm }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
233
+ new DrInnerText_1.DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_INNERTEXT_NAME, attr: drAttr.drInnerText, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_g = config.operatorAround) === null || _g === void 0 ? void 0 : _g.drInnerText }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
234
+ new DrInnerHTML_1.DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_INNERHTML_NAME, attr: drAttr.drInnerHTML, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_h = config.operatorAround) === null || _h === void 0 ? void 0 : _h.drInnerHTML }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
235
+ new DrFor_1.DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_NAME, attr: drAttr.drFor, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_j = config.operatorAround) === null || _j === void 0 ? void 0 : _j.drFor }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
236
+ new DrForOf_1.DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_FOR_OF_NAME, attr: drAttr.drForOf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_k = config.operatorAround) === null || _k === void 0 ? void 0 : _k.drForOf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
237
+ new DrAppender_1.DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_APPENDER_NAME, attr: drAttr.drAppender, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_l = config.operatorAround) === null || _l === void 0 ? void 0 : _l.drAppender }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
238
+ new DrRepeat_1.DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attrName: RawSet.DR_REPEAT_NAME, attr: drAttr.drRepeat, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_m = config.operatorAround) === null || _m === void 0 ? void 0 : _m.drRepeat }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
239
+ new DrTargetElement_1.DrTargetElement(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
240
+ new DrTargetAttr_1.DrTargetAttr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks })
241
+ ];
242
+ _z = 0, operators_1 = operators;
243
+ _3.label = 3;
244
+ case 3:
245
+ if (!(_z < operators_1.length)) return [3 /*break*/, 6];
246
+ operator = operators_1[_z];
247
+ return [4 /*yield*/, operator.start()];
248
+ case 4:
249
+ state = _3.sent();
250
+ if (state === OperatorExecuter_1.ExecuteState.EXECUTE) {
251
+ return [3 /*break*/, 6];
252
+ }
253
+ else if (state === OperatorExecuter_1.ExecuteState.STOP) {
254
+ return [2 /*return*/, raws];
255
+ }
256
+ _3.label = 5;
257
+ case 5:
258
+ _z++;
259
+ return [3 /*break*/, 3];
260
+ case 6:
261
+ _i++;
262
+ return [3 /*break*/, 1];
263
+ case 7:
264
+ this.applyEvent(obj, genNode, config);
265
+ this.replaceBody(genNode); // 중요 여기서 마지막에 연션된 값을 그려준다.
266
+ drAttrs.forEach(function (it) {
267
+ if (it.drCompleteOption) {
268
+ // genNode.childNodes
269
+ var render = Object.freeze({
270
+ rawset: _this,
271
+ fag: genNode,
272
+ scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj)
273
+ });
274
+ ScriptUtils_1.ScriptUtils.eval("\n const ".concat(EventManager_1.EventManager.FAG_VARNAME, " = this.__render.fag;\n const ").concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n ").concat(it.drCompleteOption), Object.assign(obj, { __render: render }));
275
+ }
276
+ });
277
+ // 중요 style isolation 나중에 :scope로 대체 가능할듯.
278
+ RawSet.generateStyleSheetsLocal();
279
+ for (_0 = 0, onThisComponentSetCallBacks_1 = onThisComponentSetCallBacks; _0 < onThisComponentSetCallBacks_1.length; _0++) {
280
+ it_1 = onThisComponentSetCallBacks_1[_0];
281
+ (_p = (_o = it_1.obj) === null || _o === void 0 ? void 0 : _o.onInitRender) === null || _p === void 0 ? void 0 : _p.call(_o);
282
+ }
283
+ for (_1 = 0, onElementInitCallBacks_1 = onElementInitCallBacks; _1 < onElementInitCallBacks_1.length; _1++) {
284
+ it_2 = onElementInitCallBacks_1[_1];
285
+ if (((_r = (_q = it_2.targetElement) === null || _q === void 0 ? void 0 : _q.__render) === null || _r === void 0 ? void 0 : _r.element) && ((_t = (_s = it_2.targetElement) === null || _s === void 0 ? void 0 : _s.__render) === null || _t === void 0 ? void 0 : _t.component)) {
286
+ oninit = it_2.targetElement.__render.element.getAttribute(RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME);
287
+ param = [];
288
+ if (oninit) {
289
+ script = "".concat(it_2.targetElement.__render.renderScript, " return ").concat(oninit, " ");
290
+ param = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
291
+ __render: it_2.targetElement.__render
292
+ }));
293
+ if (!Array.isArray(param)) {
294
+ param = [param];
295
+ }
296
+ }
297
+ (_v = (_u = it_2.targetElement.__render.component).onInitRender) === null || _v === void 0 ? void 0 : _v.call.apply(_v, __spreadArray([_u], param, false));
298
+ }
299
+ (_w = config === null || config === void 0 ? void 0 : config.onElementInit) === null || _w === void 0 ? void 0 : _w.call(config, it_2.name, obj, this, it_2.targetElement);
300
+ }
301
+ // TODO: 이부분도 위에 targetElement 처럼 해야될까?
302
+ for (_2 = 0, onAttrInitCallBacks_1 = onAttrInitCallBacks; _2 < onAttrInitCallBacks_1.length; _2++) {
303
+ it_3 = onAttrInitCallBacks_1[_2];
304
+ (_x = config === null || config === void 0 ? void 0 : config.onAttrInit) === null || _x === void 0 ? void 0 : _x.call(config, it_3.attrName, it_3.attrValue, obj, this);
305
+ }
306
+ // component destroy
307
+ if (obj.__domrender_components) {
308
+ Object.entries(obj.__domrender_components).forEach(function (_a) {
309
+ var _b, _c;
310
+ var key = _a[0], value = _a[1];
311
+ var domrenderComponentNew = value.__domrender_component_new;
312
+ var rawSet = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.rawSet;
313
+ var drAttrs = domrenderComponentNew === null || domrenderComponentNew === void 0 ? void 0 : domrenderComponentNew.drAttrs;
314
+ if (rawSet && !rawSet.isConnected) {
315
+ // const domrenderComponent = obj.__domrender_components[key];
316
+ // console.log('component destroy--->', key, rawSet, rawSet.isConnected, domrenderComponent.name, domrenderComponent);
317
+ var destroyOptions = (_c = (_b = drAttrs === null || drAttrs === void 0 ? void 0 : drAttrs.drDestroyOption) === null || _b === void 0 ? void 0 : _b.split(',')) !== null && _c !== void 0 ? _c : [];
318
+ RawSet.destroy(obj.__domrender_components[key], [domrenderComponentNew], config, destroyOptions);
319
+ delete obj.__domrender_components[key];
320
+ }
321
+ });
322
+ }
323
+ return [2 /*return*/, raws];
269
324
  }
270
325
  });
271
- }
272
- return raws;
326
+ });
273
327
  };
274
328
  RawSet.generateStyleSheetsLocal = function () {
275
329
  Array.from(window.document.styleSheets).filter(function (it) { return it.ownerNode && it.ownerNode instanceof Element && it.ownerNode.hasAttribute('domstyle') && it.ownerNode.getAttribute('id') && !it.ownerNode.getAttribute('completed'); }).forEach(function (it) {
@@ -633,54 +687,95 @@ var RawSet = /** @class */ (function () {
633
687
  });
634
688
  };
635
689
  RawSet.drThisCreate = function (rawSet, element, drThis, drVarOption, drStripOption, obj, config, set) {
636
- var _a, _b, _c, _d;
637
- var fag = config.window.document.createDocumentFragment();
638
- var n = element.cloneNode(true);
639
- // console.log('--------',n, n.innerHTML)
640
- if (set) {
641
- // const id = RandomUtils.getRandomString(20);
642
- var style = RawSet.generateStyleTransform((_a = set.styles) !== null && _a !== void 0 ? _a : [], rawSet.uuid, true);
643
- n.innerHTML = style + ((_b = set.template) !== null && _b !== void 0 ? _b : '');
644
- // const metaStart = RawSet.metaStart(id);
645
- // const metaEnd = RawSet.metaEnd(id);
646
- // n.innerHTML = metaStart + style + (set.template ?? '') + metaEnd;
647
- // dr-on-create onCreateRender
648
- var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
649
- var renderScript = '';
650
- var createParam = [];
651
- if (onCreate) {
652
- var script = "".concat(renderScript, " return ").concat(onCreate, " ");
653
- createParam = ScriptUtils_1.ScriptUtils.eval(script, obj);
654
- if (!Array.isArray(createParam)) {
655
- createParam = [createParam];
690
+ var _a, _b, _c, _d, _e;
691
+ return __awaiter(this, void 0, void 0, function () {
692
+ var fag, n, stylePromises, templatePromise, _f, i, it_5, _g, _h, _j, _k, _l, style, onCreate, renderScript, createParam, script, oninit, script, thisRandom, vars;
693
+ return __generator(this, function (_m) {
694
+ switch (_m.label) {
695
+ case 0:
696
+ fag = config.window.document.createDocumentFragment();
697
+ n = element.cloneNode(true);
698
+ if (!set) return [3 /*break*/, 12];
699
+ stylePromises = [];
700
+ if (!(set.template && set.template.startsWith('lazy://'))) return [3 /*break*/, 2];
701
+ return [4 /*yield*/, fetch(set.template.substring(6))];
702
+ case 1:
703
+ _f = (_m.sent()).text();
704
+ return [3 /*break*/, 3];
705
+ case 2:
706
+ _f = Promise.resolve(set.template);
707
+ _m.label = 3;
708
+ case 3:
709
+ templatePromise = (_f);
710
+ i = 0;
711
+ _m.label = 4;
712
+ case 4:
713
+ if (!(set.styles && i < ((_a = set.styles.length) !== null && _a !== void 0 ? _a : 0))) return [3 /*break*/, 9];
714
+ it_5 = set.styles[i];
715
+ _h = (_g = stylePromises).push;
716
+ if (!it_5.startsWith('lazy://')) return [3 /*break*/, 6];
717
+ return [4 /*yield*/, fetch(it_5.substring(6))];
718
+ case 5:
719
+ _j = (_m.sent()).text();
720
+ return [3 /*break*/, 7];
721
+ case 6:
722
+ _j = Promise.resolve(it_5);
723
+ _m.label = 7;
724
+ case 7:
725
+ _h.apply(_g, [_j]);
726
+ _m.label = 8;
727
+ case 8:
728
+ i++;
729
+ return [3 /*break*/, 4];
730
+ case 9:
731
+ _k = set;
732
+ return [4 /*yield*/, templatePromise];
733
+ case 10:
734
+ _k.template = _m.sent();
735
+ _l = set;
736
+ return [4 /*yield*/, Promise.all(stylePromises)];
737
+ case 11:
738
+ _l.styles = _m.sent();
739
+ style = RawSet.generateStyleTransform((_b = set.styles) !== null && _b !== void 0 ? _b : [], rawSet.uuid, true);
740
+ n.innerHTML = style + ((_c = set.template) !== null && _c !== void 0 ? _c : '');
741
+ onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
742
+ renderScript = '';
743
+ createParam = [];
744
+ if (onCreate) {
745
+ script = "".concat(renderScript, " return ").concat(onCreate, " ");
746
+ createParam = ScriptUtils_1.ScriptUtils.eval(script, obj);
747
+ if (!Array.isArray(createParam)) {
748
+ createParam = [createParam];
749
+ }
750
+ }
751
+ (_e = (_d = set.obj) === null || _d === void 0 ? void 0 : _d.onCreateRender) === null || _e === void 0 ? void 0 : _e.call.apply(_e, __spreadArray([_d], createParam, false));
752
+ oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME);
753
+ if (oninit) {
754
+ script = "".concat(renderScript, " ").concat(oninit, " ");
755
+ ScriptUtils_1.ScriptUtils.eval(script, obj);
756
+ }
757
+ _m.label = 12;
758
+ case 12:
759
+ n.querySelectorAll(EventManager_1.eventManager.attrNames.map(function (it) { return "[".concat(it, "]"); }).join(',')).forEach(function (it) {
760
+ it.setAttribute(EventManager_1.EventManager.ownerVariablePathAttrName, 'this');
761
+ });
762
+ thisRandom = this.drThisEncoding(n, drThis);
763
+ vars = this.drVarEncoding(n, drVarOption);
764
+ this.drVarDecoding(n, vars);
765
+ this.drThisDecoding(n, thisRandom);
766
+ if (drStripOption && (drStripOption === true || drStripOption === 'true')) {
767
+ // console.log('------childNodes', Array.from(n.childNodes))
768
+ Array.from(n.childNodes).forEach(function (it) { return fag.append(it); });
769
+ }
770
+ else {
771
+ fag.append(n);
772
+ }
773
+ fag.__domrender_this_variable_name = drThis;
774
+ // console.log('set __domrender_this_variable_name', (fag as any).__domrender_this_variable_name)
775
+ return [2 /*return*/, fag];
656
776
  }
657
- }
658
- (_d = (_c = set.obj) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([_c], createParam, false));
659
- // dr-on-component-init
660
- // const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
661
- var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
662
- if (oninit) {
663
- var script = "".concat(renderScript, " ").concat(oninit, " ");
664
- ScriptUtils_1.ScriptUtils.eval(script, obj);
665
- }
666
- }
667
- n.querySelectorAll(EventManager_1.eventManager.attrNames.map(function (it) { return "[".concat(it, "]"); }).join(',')).forEach(function (it) {
668
- it.setAttribute(EventManager_1.EventManager.ownerVariablePathAttrName, 'this');
777
+ });
669
778
  });
670
- var thisRandom = this.drThisEncoding(n, drThis);
671
- var vars = this.drVarEncoding(n, drVarOption);
672
- this.drVarDecoding(n, vars);
673
- this.drThisDecoding(n, thisRandom);
674
- if (drStripOption && (drStripOption === true || drStripOption === 'true')) {
675
- // console.log('------childNodes', Array.from(n.childNodes))
676
- Array.from(n.childNodes).forEach(function (it) { return fag.append(it); });
677
- }
678
- else {
679
- fag.append(n);
680
- }
681
- fag.__domrender_this_variable_name = drThis;
682
- // console.log('set __domrender_this_variable_name', (fag as any).__domrender_this_variable_name)
683
- return fag;
684
779
  };
685
780
  RawSet.createComponentTargetAttribute = function (name, getThisObj, factory) {
686
781
  var targetAttribute = {
@@ -711,115 +806,163 @@ var RawSet = /** @class */ (function () {
711
806
  styles: styles,
712
807
  template: template,
713
808
  callBack: function (element, obj, rawSet, attrs, config) {
714
- var _a, _b, _c, _d, _e, _f;
715
- // console.log('callback------->', element)
716
- if (!obj.__domrender_components) {
717
- obj.__domrender_components = {};
718
- }
719
- var domrenderComponents = obj.__domrender_components;
720
- // const componentKey = '_' + RandomUtils.getRandomString(20);
721
- var componentKey = rawSet.uuid;
722
- var attribute = DomUtils_1.DomUtils.getAttributeToObject(element);
723
- var renderScript = 'var $component = this.__render.component; var $element = this.__render.element; var $router = this.__render.router; var $innerHTML = this.__render.innerHTML; var $attribute = this.__render.attribute; var $creatorMetaData = this.__render.creatorMetaData;';
724
- var render = Object.freeze({
725
- renderScript: renderScript,
726
- element: element,
727
- innerHTML: element.innerHTML,
728
- attribute: attribute,
729
- rawset: rawSet,
730
- router: config.router,
731
- componentKey: componentKey,
732
- scripts: EventManager_1.EventManager.setBindProperty((_a = config.scripts) !== null && _a !== void 0 ? _a : {}, obj)
733
- // eslint-disable-next-line no-use-before-define
734
- });
735
- var constructor = element.getAttribute(RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME);
736
- var constructorParam = [];
737
- // dr-constructor
738
- if (constructor) {
739
- var script = "".concat(renderScript, " return ").concat(constructor, " ");
740
- var param = (_b = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }))) !== null && _b !== void 0 ? _b : [];
741
- if (!Array.isArray(param)) {
742
- param = [param];
743
- }
744
- constructorParam = param;
745
- }
746
- // console.log('------22', attrs);
747
- domrenderComponents[componentKey] = objFactory(element, obj, rawSet, constructorParam);
748
- var instance = domrenderComponents[componentKey];
749
- var i = instance.__domrender_component_new = ((_c = instance.__domrender_component_new) !== null && _c !== void 0 ? _c : new Proxy({}, new Types_1.DomRenderFinalProxy()));
750
- i.thisVariableName = rawSet.point.thisVariableName;
751
- i.thisFullVariableName = "this.__domrender_components.".concat(componentKey);
752
- i.componentKey = componentKey;
753
- i.rawSet = rawSet;
754
- i.attribute = attribute;
755
- i.router = config.router;
756
- i.scripts = render.scripts;
757
- i.drAttrs = attrs;
758
- i.innerHTML = element.innerHTML;
759
- i.rootCreator = new Proxy(obj, new Types_1.DomRenderFinalProxy());
760
- i.creator = new Proxy(rawSet.point.thisVariableName ? ScriptUtils_1.ScriptUtils.evalReturn(rawSet.point.thisVariableName, obj) : obj, new Types_1.DomRenderFinalProxy());
761
- this.__creatorMetaData = i;
762
- render = __assign({ component: instance, creatorMetaData: i }, render);
763
- // 중요 dr-normal-attr-map
764
- var normalAttrMap = element.getAttribute(EventManager_1.EventManager.normalAttrMapAttrName);
765
- if (instance.onChangeAttrRender && normalAttrMap) {
766
- new Map(JSON.parse(normalAttrMap)).forEach(function (value, key) {
767
- var script = "".concat(renderScript, " return ").concat(value, " ");
768
- var cval = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
769
- // element.setAttribute(key, cval);
770
- instance.onChangeAttrRender(key, cval);
809
+ var _a, _b, _c, _d, _e, _f, _g;
810
+ return __awaiter(this, void 0, void 0, function () {
811
+ var stylePromises, templatePromise, _h, i_1, it_6, _j, _k, _l, _m, _o, domrenderComponents, componentKey, attribute, renderScript, render, constructor, constructorParam, script, param, instance, i, normalAttrMap, onCreate, createParam, script, applayTemplate, innerHTMLThisRandom, componentName, innerHTMLName, oninit, script, style, data, template_1;
812
+ return __generator(this, function (_p) {
813
+ switch (_p.label) {
814
+ case 0:
815
+ stylePromises = [];
816
+ if (!(this.template && this.template.startsWith('lazy://'))) return [3 /*break*/, 2];
817
+ return [4 /*yield*/, fetch(this.template.substring(6))];
818
+ case 1:
819
+ _h = (_p.sent()).text();
820
+ return [3 /*break*/, 3];
821
+ case 2:
822
+ _h = Promise.resolve(this.template);
823
+ _p.label = 3;
824
+ case 3:
825
+ templatePromise = (_h);
826
+ i_1 = 0;
827
+ _p.label = 4;
828
+ case 4:
829
+ if (!(this.styles && i_1 < this.styles.length)) return [3 /*break*/, 9];
830
+ it_6 = this.styles[i_1];
831
+ _k = (_j = stylePromises).push;
832
+ if (!it_6.startsWith('lazy://')) return [3 /*break*/, 6];
833
+ return [4 /*yield*/, fetch(it_6.substring(6))];
834
+ case 5:
835
+ _l = (_p.sent()).text();
836
+ return [3 /*break*/, 7];
837
+ case 6:
838
+ _l = Promise.resolve(it_6);
839
+ _p.label = 7;
840
+ case 7:
841
+ _k.apply(_j, [_l]);
842
+ _p.label = 8;
843
+ case 8:
844
+ i_1++;
845
+ return [3 /*break*/, 4];
846
+ case 9:
847
+ // const templateResponse = await templatePromise;
848
+ // const styleResponses = await Promise.all(stylePromises);
849
+ _m = this;
850
+ return [4 /*yield*/, templatePromise];
851
+ case 10:
852
+ // const templateResponse = await templatePromise;
853
+ // const styleResponses = await Promise.all(stylePromises);
854
+ _m.template = _p.sent();
855
+ _o = this;
856
+ return [4 /*yield*/, Promise.all(stylePromises)];
857
+ case 11:
858
+ _o.styles = _p.sent();
859
+ // console.log('targetsub-22-', this.styles)
860
+ // console.log('targetsub-222-', this.template, this.styles)
861
+ // Promise.all(promises).then([])
862
+ // console.log('callback------->', element)
863
+ if (!obj.__domrender_components) {
864
+ obj.__domrender_components = {};
865
+ }
866
+ domrenderComponents = obj.__domrender_components;
867
+ componentKey = rawSet.uuid;
868
+ attribute = DomUtils_1.DomUtils.getAttributeToObject(element);
869
+ renderScript = 'var $component = this.__render.component; var $element = this.__render.element; var $router = this.__render.router; var $innerHTML = this.__render.innerHTML; var $attribute = this.__render.attribute; var $creatorMetaData = this.__render.creatorMetaData;';
870
+ render = Object.freeze({
871
+ renderScript: renderScript,
872
+ element: element,
873
+ innerHTML: element.innerHTML,
874
+ attribute: attribute,
875
+ rawset: rawSet,
876
+ router: config.router,
877
+ componentKey: componentKey,
878
+ scripts: EventManager_1.EventManager.setBindProperty((_a = config.scripts) !== null && _a !== void 0 ? _a : {}, obj)
879
+ // eslint-disable-next-line no-use-before-define
880
+ });
881
+ constructor = element.getAttribute(RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME);
882
+ constructorParam = [];
883
+ // dr-constructor
884
+ if (constructor) {
885
+ script = "".concat(renderScript, " return ").concat(constructor, " ");
886
+ param = (_b = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }))) !== null && _b !== void 0 ? _b : [];
887
+ if (!Array.isArray(param)) {
888
+ param = [param];
889
+ }
890
+ constructorParam = param;
891
+ }
892
+ // console.log('------22', attrs);
893
+ domrenderComponents[componentKey] = objFactory(element, obj, rawSet, constructorParam);
894
+ instance = domrenderComponents[componentKey];
895
+ i = instance.__domrender_component_new = ((_c = instance.__domrender_component_new) !== null && _c !== void 0 ? _c : new Proxy({}, new Types_1.DomRenderFinalProxy()));
896
+ i.thisVariableName = rawSet.point.thisVariableName;
897
+ i.thisFullVariableName = "this.__domrender_components.".concat(componentKey);
898
+ i.componentKey = componentKey;
899
+ i.rawSet = rawSet;
900
+ i.attribute = attribute;
901
+ i.router = config.router;
902
+ i.scripts = render.scripts;
903
+ i.drAttrs = attrs;
904
+ i.innerHTML = element.innerHTML;
905
+ i.rootCreator = new Proxy(obj, new Types_1.DomRenderFinalProxy());
906
+ i.creator = new Proxy(rawSet.point.thisVariableName ? ScriptUtils_1.ScriptUtils.evalReturn(rawSet.point.thisVariableName, obj) : obj, new Types_1.DomRenderFinalProxy());
907
+ this.__creatorMetaData = i;
908
+ render = __assign({ component: instance, creatorMetaData: i }, render);
909
+ normalAttrMap = element.getAttribute(EventManager_1.EventManager.normalAttrMapAttrName);
910
+ if (instance.onChangeAttrRender && normalAttrMap) {
911
+ new Map(JSON.parse(normalAttrMap)).forEach(function (value, key) {
912
+ var script = "".concat(renderScript, " return ").concat(value, " ");
913
+ var cval = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
914
+ // element.setAttribute(key, cval);
915
+ instance.onChangeAttrRender(key, cval);
916
+ });
917
+ }
918
+ onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
919
+ this.__render = render;
920
+ createParam = [];
921
+ if (onCreate) {
922
+ script = "".concat(renderScript, " return ").concat(onCreate, " ");
923
+ createParam = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
924
+ if (!Array.isArray(createParam)) {
925
+ createParam = [createParam];
926
+ }
927
+ }
928
+ (_d = instance === null || instance === void 0 ? void 0 : instance.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([instance], createParam, false));
929
+ applayTemplate = element.innerHTML;
930
+ componentName = (_e = element.getAttribute(RawSet.DR_COMPONENT_NAME_OPTIONNAME)) !== null && _e !== void 0 ? _e : 'component';
931
+ innerHTMLName = (_f = element.getAttribute(RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME)) !== null && _f !== void 0 ? _f : 'innerHTML';
932
+ if (applayTemplate) {
933
+ // if (rawSet.point.thisVariableName) {
934
+ // 넘어온 innerHTML에 this가 있으면 해당안되게 우선 치환.
935
+ innerHTMLThisRandom = RandomUtils_1.RandomUtils.uuid();
936
+ applayTemplate = applayTemplate.replace(/this\./g, innerHTMLThisRandom);
937
+ // }
938
+ applayTemplate = applayTemplate.replace(RegExp("#".concat(componentName, "#"), 'g'), 'this');
939
+ }
940
+ // applayTemplate = template.replace(RegExp(`#${innerHTMLName}#`, 'g'), applayTemplate);
941
+ applayTemplate = ((_g = this.template) !== null && _g !== void 0 ? _g : '').replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
942
+ oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME);
943
+ if (oninit) {
944
+ script = "".concat(renderScript, " ").concat(oninit, " ");
945
+ ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
946
+ __render: render
947
+ }));
948
+ }
949
+ style = RawSet.generateStyleTransform(this.styles, componentKey, true);
950
+ element.innerHTML = style + (applayTemplate !== null && applayTemplate !== void 0 ? applayTemplate : '');
951
+ return [4 /*yield*/, RawSet.drThisCreate(rawSet, element, "this.__domrender_components.".concat(componentKey), '', true, obj, config)];
952
+ case 12:
953
+ data = _p.sent();
954
+ // 넘어온 innerHTML에 this가 있는걸 다시 복호화해서 제대로 작동하도록한다.
955
+ if (innerHTMLThisRandom) {
956
+ template_1 = config.window.document.createElement('template');
957
+ template_1.content.append(data);
958
+ template_1.innerHTML = template_1.innerHTML.replace(RegExp(innerHTMLThisRandom, 'g'), 'this.');
959
+ data = template_1.content;
960
+ }
961
+ data.render = render;
962
+ return [2 /*return*/, data];
963
+ }
771
964
  });
772
- }
773
- // dr-on-create onCreateRender
774
- var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
775
- this.__render = render;
776
- var createParam = [];
777
- if (onCreate) {
778
- var script = "".concat(renderScript, " return ").concat(onCreate, " ");
779
- createParam = ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
780
- if (!Array.isArray(createParam)) {
781
- createParam = [createParam];
782
- }
783
- }
784
- (_d = instance === null || instance === void 0 ? void 0 : instance.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([instance], createParam, false));
785
- var applayTemplate = element.innerHTML;
786
- var innerHTMLThisRandom;
787
- var componentName = (_e = element.getAttribute(RawSet.DR_COMPONENT_NAME_OPTIONNAME)) !== null && _e !== void 0 ? _e : 'component';
788
- var innerHTMLName = (_f = element.getAttribute(RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME)) !== null && _f !== void 0 ? _f : 'innerHTML';
789
- if (applayTemplate) {
790
- // if (rawSet.point.thisVariableName) {
791
- // 넘어온 innerHTML에 this가 있으면 해당안되게 우선 치환.
792
- innerHTMLThisRandom = RandomUtils_1.RandomUtils.uuid();
793
- applayTemplate = applayTemplate.replace(/this\./g, innerHTMLThisRandom);
794
- // }
795
- applayTemplate = applayTemplate.replace(RegExp("#".concat(componentName, "#"), 'g'), 'this');
796
- }
797
- applayTemplate = template.replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
798
- // dr-on-component-init
799
- // const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
800
- var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
801
- if (oninit) {
802
- var script = "".concat(renderScript, " ").concat(oninit, " ");
803
- ScriptUtils_1.ScriptUtils.eval(script, Object.assign(obj, {
804
- __render: render
805
- }));
806
- }
807
- var style = RawSet.generateStyleTransform(styles, componentKey, true);
808
- element.innerHTML = style + (applayTemplate !== null && applayTemplate !== void 0 ? applayTemplate : '');
809
- // const metaStart = RawSet.metaStart(componentKey);
810
- // const metaEnd = RawSet.metaEnd(componentKey);
811
- // element.innerHTML = metaStart + style + (applayTemplate ?? '') + metaEnd;
812
- // console.log('------>', element.innerHTML, obj)
813
- var data = RawSet.drThisCreate(rawSet, element, "this.__domrender_components.".concat(componentKey), '', true, obj, config);
814
- // 넘어온 innerHTML에 this가 있는걸 다시 복호화해서 제대로 작동하도록한다.
815
- if (innerHTMLThisRandom) {
816
- var template_1 = config.window.document.createElement('template');
817
- template_1.content.append(data);
818
- template_1.innerHTML = template_1.innerHTML.replace(RegExp(innerHTMLThisRandom, 'g'), 'this.');
819
- data = template_1.content;
820
- }
821
- data.render = render;
822
- return data;
965
+ });
823
966
  }
824
967
  // complete
825
968
  };
@@ -855,7 +998,7 @@ var RawSet = /** @class */ (function () {
855
998
  }
856
999
  }
857
1000
  };
858
- RawSet.DR = 'dr';
1001
+ RawSet.DR_NAME = 'dr';
859
1002
  RawSet.DR_IF_NAME = 'dr-if';
860
1003
  RawSet.DR_FOR_NAME = 'dr-for';
861
1004
  RawSet.DR_FOR_OF_NAME = 'dr-for-of';
@@ -882,7 +1025,7 @@ var RawSet = /** @class */ (function () {
882
1025
  RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME = 'dr-on-init:arguments';
883
1026
  RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME = 'dr-on-constructor:arguments';
884
1027
  RawSet.drAttrsOriginName = {
885
- dr: RawSet.DR,
1028
+ dr: RawSet.DR_NAME,
886
1029
  drIf: RawSet.DR_IF_NAME,
887
1030
  drFor: RawSet.DR_FOR_NAME,
888
1031
  drForOf: RawSet.DR_FOR_OF_NAME,
@@ -903,7 +1046,7 @@ var RawSet = /** @class */ (function () {
903
1046
  drDestroyOption: RawSet.DR_DESTROY_OPTIONNAME
904
1047
  };
905
1048
  RawSet.DR_TAGS = [];
906
- RawSet.DR_ATTRIBUTES = [RawSet.DR, RawSet.DR_APPENDER_NAME, RawSet.DR_IF_NAME, RawSet.DR_FOR_OF_NAME, RawSet.DR_FOR_NAME, RawSet.DR_THIS_NAME, RawSet.DR_FORM_NAME, RawSet.DR_PRE_NAME, RawSet.DR_INNERHTML_NAME, RawSet.DR_INNERTEXT_NAME, RawSet.DR_REPEAT_NAME, RawSet.DR_DETECT_NAME];
1049
+ RawSet.DR_ATTRIBUTES = [RawSet.DR_NAME, RawSet.DR_APPENDER_NAME, RawSet.DR_IF_NAME, RawSet.DR_FOR_OF_NAME, RawSet.DR_FOR_NAME, RawSet.DR_THIS_NAME, RawSet.DR_FORM_NAME, RawSet.DR_PRE_NAME, RawSet.DR_INNERHTML_NAME, RawSet.DR_INNERTEXT_NAME, RawSet.DR_REPEAT_NAME, RawSet.DR_DETECT_NAME];
907
1050
  return RawSet;
908
1051
  }());
909
1052
  exports.RawSet = RawSet;