@dooboostore/simple-web-component 1.0.33 → 1.0.35

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (150) hide show
  1. package/README.md +23 -30
  2. package/dist/cjs/decorators/addEventListener.js.map +1 -1
  3. package/dist/cjs/decorators/applyAttribute.js +67 -57
  4. package/dist/cjs/decorators/applyAttribute.js.map +2 -2
  5. package/dist/cjs/decorators/applyClass.js +80 -70
  6. package/dist/cjs/decorators/applyClass.js.map +2 -2
  7. package/dist/cjs/decorators/applyNode.js +5 -8
  8. package/dist/cjs/decorators/applyNode.js.map +2 -2
  9. package/dist/cjs/decorators/applyStyle.js +66 -56
  10. package/dist/cjs/decorators/applyStyle.js.map +2 -2
  11. package/dist/cjs/decorators/attribute.js +35 -29
  12. package/dist/cjs/decorators/attribute.js.map +2 -2
  13. package/dist/cjs/decorators/changedAttributeHost.js +32 -12
  14. package/dist/cjs/decorators/changedAttributeHost.js.map +2 -2
  15. package/dist/cjs/decorators/elementDefine.js +238 -180
  16. package/dist/cjs/decorators/elementDefine.js.map +2 -2
  17. package/dist/cjs/decorators/emitCustomEvent.js +67 -48
  18. package/dist/cjs/decorators/emitCustomEvent.js.map +2 -2
  19. package/dist/cjs/decorators/lifecycles.js +15 -17
  20. package/dist/cjs/decorators/lifecycles.js.map +2 -2
  21. package/dist/cjs/decorators/setProperty.js +50 -39
  22. package/dist/cjs/decorators/setProperty.js.map +2 -2
  23. package/dist/cjs/decorators/subscribeSwcAppMessageWhileConnected.js.map +1 -1
  24. package/dist/cjs/decorators/subscribeSwcAppRouteChangeWhileConnected.js +2 -2
  25. package/dist/cjs/decorators/subscribeSwcAppRouteChangeWhileConnected.js.map +2 -2
  26. package/dist/cjs/elements/SwcAppEngine.js +14 -8
  27. package/dist/cjs/elements/SwcAppEngine.js.map +3 -3
  28. package/dist/cjs/elements/SwcAppMixin.js +154 -81
  29. package/dist/cjs/elements/SwcAppMixin.js.map +2 -2
  30. package/dist/cjs/elements/SwcAsync.js +28 -18
  31. package/dist/cjs/elements/SwcAsync.js.map +2 -2
  32. package/dist/cjs/elements/SwcChoose.js +68 -45
  33. package/dist/cjs/elements/SwcChoose.js.map +2 -2
  34. package/dist/cjs/elements/SwcIf.js +52 -30
  35. package/dist/cjs/elements/SwcIf.js.map +2 -2
  36. package/dist/cjs/elements/SwcLoop.js +109 -35
  37. package/dist/cjs/elements/SwcLoop.js.map +2 -2
  38. package/dist/cjs/elements/register.js +263 -131
  39. package/dist/cjs/elements/register.js.map +2 -2
  40. package/dist/cjs/router/ElementRouter.js +4 -2
  41. package/dist/cjs/router/ElementRouter.js.map +1 -1
  42. package/dist/cjs/types.js.map +1 -1
  43. package/dist/cjs/utils/Utils.js +25 -7
  44. package/dist/cjs/utils/Utils.js.map +2 -2
  45. package/dist/esm/decorators/addEventListener.js.map +1 -1
  46. package/dist/esm/decorators/applyAttribute.js +67 -57
  47. package/dist/esm/decorators/applyAttribute.js.map +2 -2
  48. package/dist/esm/decorators/applyClass.js +80 -70
  49. package/dist/esm/decorators/applyClass.js.map +2 -2
  50. package/dist/esm/decorators/applyNode.js +5 -8
  51. package/dist/esm/decorators/applyNode.js.map +2 -2
  52. package/dist/esm/decorators/applyStyle.js +66 -56
  53. package/dist/esm/decorators/applyStyle.js.map +2 -2
  54. package/dist/esm/decorators/attribute.js +35 -29
  55. package/dist/esm/decorators/attribute.js.map +2 -2
  56. package/dist/esm/decorators/changedAttributeHost.js +32 -12
  57. package/dist/esm/decorators/changedAttributeHost.js.map +2 -2
  58. package/dist/esm/decorators/elementDefine.js +240 -182
  59. package/dist/esm/decorators/elementDefine.js.map +2 -2
  60. package/dist/esm/decorators/emitCustomEvent.js +67 -48
  61. package/dist/esm/decorators/emitCustomEvent.js.map +2 -2
  62. package/dist/esm/decorators/lifecycles.js +15 -17
  63. package/dist/esm/decorators/lifecycles.js.map +2 -2
  64. package/dist/esm/decorators/setProperty.js +50 -39
  65. package/dist/esm/decorators/setProperty.js.map +2 -2
  66. package/dist/esm/decorators/subscribeSwcAppMessageWhileConnected.js.map +1 -1
  67. package/dist/esm/decorators/subscribeSwcAppRouteChangeWhileConnected.js +2 -2
  68. package/dist/esm/decorators/subscribeSwcAppRouteChangeWhileConnected.js.map +2 -2
  69. package/dist/esm/elements/SwcAppEngine.js +14 -7
  70. package/dist/esm/elements/SwcAppEngine.js.map +2 -2
  71. package/dist/esm/elements/SwcAppMixin.js +156 -82
  72. package/dist/esm/elements/SwcAppMixin.js.map +2 -2
  73. package/dist/esm/elements/SwcAsync.js +28 -18
  74. package/dist/esm/elements/SwcAsync.js.map +2 -2
  75. package/dist/esm/elements/SwcChoose.js +69 -46
  76. package/dist/esm/elements/SwcChoose.js.map +2 -2
  77. package/dist/esm/elements/SwcIf.js +53 -31
  78. package/dist/esm/elements/SwcIf.js.map +2 -2
  79. package/dist/esm/elements/SwcLoop.js +110 -36
  80. package/dist/esm/elements/SwcLoop.js.map +2 -2
  81. package/dist/esm/elements/register.js +264 -132
  82. package/dist/esm/elements/register.js.map +2 -2
  83. package/dist/esm/router/ElementRouter.js +5 -2
  84. package/dist/esm/router/ElementRouter.js.map +1 -1
  85. package/dist/esm/types.js.map +1 -1
  86. package/dist/esm/utils/Utils.js +25 -7
  87. package/dist/esm/utils/Utils.js.map +2 -2
  88. package/dist/esm-bundle/dooboostore-simple-web-component.esm.js +728 -595
  89. package/dist/esm-bundle/dooboostore-simple-web-component.esm.js.map +4 -4
  90. package/dist/types/decorators/addEventListener.d.ts +4 -1
  91. package/dist/types/decorators/addEventListener.d.ts.map +1 -1
  92. package/dist/types/decorators/applyAttribute.d.ts +5 -1
  93. package/dist/types/decorators/applyAttribute.d.ts.map +1 -1
  94. package/dist/types/decorators/applyClass.d.ts +4 -0
  95. package/dist/types/decorators/applyClass.d.ts.map +1 -1
  96. package/dist/types/decorators/applyNode.d.ts +5 -1
  97. package/dist/types/decorators/applyNode.d.ts.map +1 -1
  98. package/dist/types/decorators/applyStyle.d.ts +5 -1
  99. package/dist/types/decorators/applyStyle.d.ts.map +1 -1
  100. package/dist/types/decorators/attribute.d.ts +5 -0
  101. package/dist/types/decorators/attribute.d.ts.map +1 -1
  102. package/dist/types/decorators/changedAttributeHost.d.ts +14 -3
  103. package/dist/types/decorators/changedAttributeHost.d.ts.map +1 -1
  104. package/dist/types/decorators/elementDefine.d.ts +1 -1
  105. package/dist/types/decorators/elementDefine.d.ts.map +1 -1
  106. package/dist/types/decorators/emitCustomEvent.d.ts +15 -7
  107. package/dist/types/decorators/emitCustomEvent.d.ts.map +1 -1
  108. package/dist/types/decorators/lifecycles.d.ts +10 -7
  109. package/dist/types/decorators/lifecycles.d.ts.map +1 -1
  110. package/dist/types/decorators/setProperty.d.ts +5 -1
  111. package/dist/types/decorators/setProperty.d.ts.map +1 -1
  112. package/dist/types/decorators/subscribeSwcAppMessageWhileConnected.d.ts +2 -2
  113. package/dist/types/decorators/subscribeSwcAppMessageWhileConnected.d.ts.map +1 -1
  114. package/dist/types/decorators/subscribeSwcAppRouteChangeWhileConnected.d.ts +5 -6
  115. package/dist/types/decorators/subscribeSwcAppRouteChangeWhileConnected.d.ts.map +1 -1
  116. package/dist/types/elements/SwcAppEngine.d.ts +9 -3
  117. package/dist/types/elements/SwcAppEngine.d.ts.map +1 -1
  118. package/dist/types/elements/SwcAppMixin.d.ts +12 -7
  119. package/dist/types/elements/SwcAppMixin.d.ts.map +1 -1
  120. package/dist/types/elements/register.d.ts.map +1 -1
  121. package/dist/types/types.d.ts +1 -0
  122. package/dist/types/types.d.ts.map +1 -1
  123. package/dist/types/utils/Utils.d.ts +4 -1
  124. package/dist/types/utils/Utils.d.ts.map +1 -1
  125. package/dist/umd-bundle/dooboostore-simple-web-component.umd.js +728 -595
  126. package/dist/umd-bundle/dooboostore-simple-web-component.umd.js.map +4 -4
  127. package/package.json +5 -5
  128. package/src/decorators/addEventListener.ts +1 -1
  129. package/src/decorators/applyAttribute.ts +74 -61
  130. package/src/decorators/applyClass.ts +91 -77
  131. package/src/decorators/applyNode.ts +16 -13
  132. package/src/decorators/applyStyle.ts +75 -61
  133. package/src/decorators/attribute.ts +55 -43
  134. package/src/decorators/changedAttributeHost.ts +49 -15
  135. package/src/decorators/elementDefine.ts +401 -340
  136. package/src/decorators/emitCustomEvent.ts +92 -62
  137. package/src/decorators/lifecycles.ts +11 -10
  138. package/src/decorators/setProperty.ts +58 -44
  139. package/src/decorators/subscribeSwcAppMessageWhileConnected.ts +2 -2
  140. package/src/decorators/subscribeSwcAppRouteChangeWhileConnected.ts +11 -11
  141. package/src/elements/SwcAppEngine.ts +19 -13
  142. package/src/elements/SwcAppMixin.ts +214 -102
  143. package/src/elements/SwcAsync.ts +28 -17
  144. package/src/elements/SwcChoose.ts +94 -36
  145. package/src/elements/SwcIf.ts +59 -22
  146. package/src/elements/SwcLoop.ts +140 -27
  147. package/src/elements/register.ts +319 -100
  148. package/src/types.ts +1 -0
  149. package/src/utils/Utils.ts +38 -10
  150. package/tsconfig.json +2 -2
@@ -133,22 +133,38 @@ const registerAllElements = (w) => {
133
133
  (0, import_decorators.elementDefine)("swc-app", { window: w })
134
134
  ], SwcApp);
135
135
  let SwcIf = class SwcIf extends HTMLTemplateElement {
136
- constructor() {
137
- super(...arguments);
138
- this._nodes = [];
139
- }
140
136
  get value() {
141
137
  return this._value;
142
138
  }
143
139
  set value(nv) {
144
140
  this.refresh(nv);
145
141
  }
142
+ constructor() {
143
+ super();
144
+ this._nodes = [];
145
+ }
146
+ setValue(value, o, n) {
147
+ this._value = value;
148
+ this.refresh(this._value);
149
+ }
150
+ // @changedAttributeHost('replace-wrap')
151
+ // private setReplaceWrap(replaceWrapAttr?: string | null) {
152
+ // this.refresh();
153
+ // }
146
154
  replaceExpressions(html, groupArgs, context, wrap) {
147
- const config = wrap ? { wrapExpression: wrap } : void 0;
155
+ let config = void 0;
156
+ if (wrap) {
157
+ config = {
158
+ expression: {
159
+ replace: { start: `${wrap.start}`, end: `${wrap.end}` },
160
+ callReturn: { start: `${wrap.start}=`, end: `${wrap.end}` },
161
+ call: { start: `${wrap.start}@`, end: `${wrap.end}` }
162
+ }
163
+ };
164
+ }
148
165
  const ae = new import_core.ActionExpression(html, config);
149
- const filterOptions = wrap ? { type: "replace", wrap } : "replace";
150
166
  const win = this.ownerDocument?.defaultView || window;
151
- for (const expr of ae.getExpressions(filterOptions)) {
167
+ for (const expr of ae.getExpressions("replace")) {
152
168
  try {
153
169
  const value = import_core.FunctionUtils.executeReturn({
154
170
  script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
@@ -162,30 +178,38 @@ const registerAllElements = (w) => {
162
178
  }
163
179
  return ae.getUnprocessedTemplate();
164
180
  }
165
- setValue(valueAttr) {
166
- this.refresh();
167
- }
168
- setReplaceWrap(replaceWrapAttr) {
169
- this.refresh();
170
- }
171
- refresh(value = this._value) {
181
+ refresh(value) {
182
+ const targetValue = value !== void 0 ? value : (0, import_decorators.getAttributeValue)(this, "value") ?? this._value;
183
+ if (this.hasAttribute("skip-if-same") && this._value === targetValue && this._nodes.length > 0) {
184
+ return;
185
+ }
172
186
  this.cleanup();
187
+ this._value = targetValue;
173
188
  const portal = this.parentElement;
174
- if (!portal || !value)
189
+ if (!portal || !this._value)
175
190
  return;
176
191
  const win = this.ownerDocument?.defaultView || window;
177
192
  const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
178
193
  let htmlString = this.innerHTML;
179
- const groupArgs = { ...helperSet, $value: value };
180
- htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
194
+ const groupArgs = { ...helperSet, $value: this._value, $templateHost: this };
195
+ htmlString = this.replaceExpressions(htmlString, groupArgs, this, { start: this._replaceWrapStart ?? "{#{", end: this._replaceWrapEnd ?? "}#}" });
181
196
  const result = this.ownerDocument?.createElement("template") || document.createElement("template");
182
197
  result.innerHTML = htmlString;
183
198
  const processedFragment = result.content;
184
199
  this._nodes = Array.from(processedFragment.childNodes);
200
+ this._nodes.forEach((node) => {
201
+ if (node instanceof HTMLElement)
202
+ node.__swc_template_host = this;
203
+ });
185
204
  portal.insertBefore(processedFragment, this.nextSibling);
186
205
  }
187
206
  cleanup() {
188
- this._nodes.forEach((n) => n.parentElement?.removeChild(n));
207
+ this._nodes.forEach((n) => {
208
+ const realNode = n.__upgraded_instance || n;
209
+ if (realNode.parentElement) {
210
+ realNode.parentElement.removeChild(realNode);
211
+ }
212
+ });
189
213
  this._nodes = [];
190
214
  }
191
215
  disconnectedCallback() {
@@ -193,54 +217,68 @@ const registerAllElements = (w) => {
193
217
  }
194
218
  };
195
219
  __decorate([
196
- (0, import_decorators.attributeHost)("value"),
197
- __metadata("design:type", Object)
198
- ], SwcIf.prototype, "_value", void 0);
220
+ (0, import_decorators.attributeHost)("replace-wrap-start"),
221
+ __metadata("design:type", String)
222
+ ], SwcIf.prototype, "_replaceWrapStart", void 0);
199
223
  __decorate([
200
- (0, import_decorators.attributeHost)("replace-wrap"),
224
+ (0, import_decorators.attributeHost)("replace-wrap-end"),
201
225
  __metadata("design:type", String)
202
- ], SwcIf.prototype, "_replaceWrap", void 0);
226
+ ], SwcIf.prototype, "_replaceWrapEnd", void 0);
227
+ __decorate([
228
+ (0, import_decorators.attributeHost)("skip-if-same"),
229
+ __metadata("design:type", String)
230
+ ], SwcIf.prototype, "_skipIfSame", void 0);
203
231
  __decorate([
204
232
  (0, import_decorators.changedAttributeHost)("value"),
205
233
  __metadata("design:type", Function),
206
- __metadata("design:paramtypes", [String]),
234
+ __metadata("design:paramtypes", [Object, String, String]),
207
235
  __metadata("design:returntype", void 0)
208
236
  ], SwcIf.prototype, "setValue", null);
209
- __decorate([
210
- (0, import_decorators.changedAttributeHost)("replace-wrap"),
211
- __metadata("design:type", Function),
212
- __metadata("design:paramtypes", [String]),
213
- __metadata("design:returntype", void 0)
214
- ], SwcIf.prototype, "setReplaceWrap", null);
215
237
  SwcIf = __decorate([
216
- (0, import_decorators.elementDefine)("swc-if", { extends: "template", window: w })
238
+ (0, import_decorators.elementDefine)("swc-if", { extends: "template", window: w }),
239
+ __metadata("design:paramtypes", [])
217
240
  ], SwcIf);
218
241
  let SwcLoop = class SwcLoop extends HTMLTemplateElement {
219
- constructor() {
220
- super(...arguments);
221
- this._nodeGroups = [];
222
- }
223
242
  get value() {
224
243
  return this._value;
225
244
  }
226
245
  set value(nv) {
246
+ this._value = nv;
227
247
  this.refresh(nv);
228
248
  }
229
- setValue() {
230
- this.refresh();
249
+ getValue(index) {
250
+ return this._value?.[index];
251
+ }
252
+ constructor() {
253
+ super();
254
+ this._value = [];
255
+ this._nodeGroups = [];
231
256
  }
232
- setReplaceWrap() {
233
- this.refresh();
257
+ setValue(value, o, n) {
258
+ this._value = value;
259
+ this.refresh(this._value);
234
260
  }
261
+ // @changedAttributeHost('replace-wrap')
262
+ // private setReplaceWrap(replaceWrapAttr?: string | null) {
263
+ // this.refresh();
264
+ // }
235
265
  replaceExpressions(html, groupArgs, context, wrap) {
236
- const config = wrap ? { wrapExpression: wrap } : void 0;
266
+ let config = void 0;
267
+ config = {
268
+ expression: {
269
+ replace: { start: `${wrap.start}`, end: `${wrap.end}` },
270
+ callReturn: { start: `${wrap.start}=`, end: `${wrap.end}` },
271
+ call: { start: `${wrap.start}@`, end: `${wrap.end}` }
272
+ }
273
+ };
237
274
  const ae = new import_core.ActionExpression(html, config);
238
- const filterOptions = wrap ? { type: "replace", wrap } : "replace";
239
275
  const win = this.ownerDocument?.defaultView || window;
240
- for (const expr of ae.getExpressions(filterOptions)) {
276
+ const expressions = ae.getExpressions("replace");
277
+ for (const expr of expressions) {
278
+ const script = import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document);
241
279
  try {
242
280
  const value = import_core.FunctionUtils.executeReturn({
243
- script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
281
+ script,
244
282
  context,
245
283
  args: groupArgs
246
284
  });
@@ -251,30 +289,95 @@ const registerAllElements = (w) => {
251
289
  }
252
290
  return ae.getUnprocessedTemplate();
253
291
  }
254
- refresh(value = this._value) {
255
- this.cleanup();
256
- if (value?.length <= 0)
257
- return;
258
- const portal = this.parentElement;
259
- if (!portal)
260
- return;
292
+ createFragmentAndNodes(items, helperSet, startIndex = 0) {
261
293
  const win = this.ownerDocument?.defaultView || window;
262
- const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
263
294
  const fragment = win.document.createDocumentFragment();
264
- value.forEach((item, index) => {
295
+ const newNodesGroup = [];
296
+ items.forEach((item, i) => {
297
+ const index = startIndex + i;
265
298
  let htmlString = this.innerHTML;
266
299
  const groupArgs = { ...helperSet, $item: item, $index: index, $value: this._value };
267
- htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
300
+ htmlString = this.replaceExpressions(htmlString, groupArgs, this, { start: this._replaceWrapStart ?? "{#{", end: this._replaceWrapEnd ?? "}#}" });
268
301
  const temp = this.ownerDocument?.createElement("template") || document.createElement("template");
269
302
  temp.innerHTML = htmlString;
270
303
  const content = temp.content;
271
304
  const nodes = Array.from(content.childNodes);
272
- this._nodeGroups.push(nodes);
305
+ const setTemplateHost = (element) => {
306
+ element.__swc_template_host = this;
307
+ Array.from(element.children).forEach((child) => {
308
+ if (child instanceof HTMLElement) {
309
+ setTemplateHost(child);
310
+ }
311
+ });
312
+ };
313
+ nodes.forEach((node) => {
314
+ if (node instanceof HTMLElement) {
315
+ setTemplateHost(node);
316
+ }
317
+ });
318
+ newNodesGroup.push(nodes);
273
319
  fragment.appendChild(content);
274
320
  });
321
+ return { fragment, newNodesGroup };
322
+ }
323
+ appendItem(...items) {
324
+ if (!items || items.length <= 0)
325
+ return;
326
+ const portal = import_Utils.SwcUtils.getParentContainer(this);
327
+ if (!portal)
328
+ return;
329
+ const win = this.ownerDocument?.defaultView || window;
330
+ const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
331
+ const startIndex = this._value ? this._value.length : 0;
332
+ if (this._value !== items) {
333
+ this._value = [...this._value || [], ...items];
334
+ }
335
+ const { fragment, newNodesGroup } = this.createFragmentAndNodes(items, helperSet, startIndex);
336
+ this._nodeGroups.push(...newNodesGroup);
337
+ console.log("\uBB50\uC57C \uC528\uBC1C");
338
+ let insertReference = this.nextSibling;
339
+ if (this._nodeGroups.length > items.length) {
340
+ const lastExistingGroup = this._nodeGroups[this._nodeGroups.length - items.length - 1];
341
+ if (lastExistingGroup && lastExistingGroup.length > 0) {
342
+ const lastNode = lastExistingGroup[lastExistingGroup.length - 1];
343
+ insertReference = lastNode.nextSibling;
344
+ }
345
+ }
346
+ portal.insertBefore(fragment, insertReference);
347
+ }
348
+ async prependItem(...items) {
349
+ if (!items || items.length <= 0)
350
+ return;
351
+ const portal = import_Utils.SwcUtils.getParentContainer(this);
352
+ if (!portal)
353
+ return;
354
+ const win = this.ownerDocument?.defaultView || window;
355
+ const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
356
+ if (this._value !== items) {
357
+ this._value = [...items, ...this._value || []];
358
+ }
359
+ const { fragment, newNodesGroup } = this.createFragmentAndNodes(items, helperSet, 0);
360
+ this._nodeGroups = [...newNodesGroup, ...this._nodeGroups];
275
361
  portal.insertBefore(fragment, this.nextSibling);
276
362
  }
363
+ refresh(value) {
364
+ const targetValue = value !== void 0 ? value : (0, import_decorators.getAttributeValue)(this, "value") ?? this._value ?? [];
365
+ this.cleanup();
366
+ this._value = targetValue;
367
+ if (!this._value || this._value.length <= 0)
368
+ return;
369
+ const win = this.ownerDocument?.defaultView || window;
370
+ const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
371
+ helperSet.$templateHost = this;
372
+ const { fragment, newNodesGroup } = this.createFragmentAndNodes(this._value, helperSet, 0);
373
+ this._nodeGroups = newNodesGroup;
374
+ const portal = import_Utils.SwcUtils.getParentContainer(this);
375
+ if (portal) {
376
+ portal.insertBefore(fragment, this.nextSibling);
377
+ }
378
+ }
277
379
  cleanup() {
380
+ console.log("\uB204\uAC00 cleanup");
278
381
  this._nodeGroups.forEach((nodes) => nodes.forEach((n) => n.parentElement?.removeChild(n)));
279
382
  this._nodeGroups = [];
280
383
  }
@@ -283,52 +386,64 @@ const registerAllElements = (w) => {
283
386
  }
284
387
  };
285
388
  __decorate([
286
- (0, import_decorators.attributeHost)("value"),
287
- __metadata("design:type", Array)
288
- ], SwcLoop.prototype, "_value", void 0);
389
+ (0, import_decorators.attributeHost)("replace-wrap-start"),
390
+ __metadata("design:type", String)
391
+ ], SwcLoop.prototype, "_replaceWrapStart", void 0);
289
392
  __decorate([
290
- (0, import_decorators.attributeHost)("replace-wrap"),
393
+ (0, import_decorators.attributeHost)("replace-wrap-end"),
291
394
  __metadata("design:type", String)
292
- ], SwcLoop.prototype, "_replaceWrap", void 0);
395
+ ], SwcLoop.prototype, "_replaceWrapEnd", void 0);
293
396
  __decorate([
294
397
  (0, import_decorators.changedAttributeHost)("value"),
295
398
  __metadata("design:type", Function),
296
- __metadata("design:paramtypes", []),
399
+ __metadata("design:paramtypes", [Object, String, String]),
297
400
  __metadata("design:returntype", void 0)
298
401
  ], SwcLoop.prototype, "setValue", null);
299
- __decorate([
300
- (0, import_decorators.changedAttributeHost)("replace-wrap"),
301
- __metadata("design:type", Function),
302
- __metadata("design:paramtypes", []),
303
- __metadata("design:returntype", void 0)
304
- ], SwcLoop.prototype, "setReplaceWrap", null);
305
402
  SwcLoop = __decorate([
306
- (0, import_decorators.elementDefine)("swc-loop", { extends: "template", window: w })
403
+ (0, import_decorators.elementDefine)("swc-loop", { extends: "template", window: w }),
404
+ __metadata("design:paramtypes", [])
307
405
  ], SwcLoop);
308
406
  let SwcChoose = class SwcChoose extends HTMLTemplateElement {
309
- constructor() {
310
- super(...arguments);
311
- this._nodes = [];
312
- this._previousTemplate = null;
313
- }
314
407
  get value() {
315
408
  return this._value;
316
409
  }
317
410
  set value(nv) {
318
- this.refresh(nv);
411
+ this._value = nv;
412
+ this.refresh(this._value);
319
413
  }
320
- setValue() {
321
- this.refresh();
414
+ constructor() {
415
+ super();
416
+ this._nodes = [];
417
+ this._previousTemplate = null;
322
418
  }
323
- setReplaceWrap(replaceWrapAttr) {
324
- this.refresh();
419
+ // static get observedAttributes() {
420
+ // return ['value'];
421
+ // }
422
+ attributeChangedCallback(na, o, n) {
325
423
  }
424
+ setValue(value, o, n) {
425
+ console.log("chooooooose value", value);
426
+ this._value = value;
427
+ this.refresh(this._value);
428
+ }
429
+ // @changedAttributeHost('replace-wrap')
430
+ // private setReplaceWrap(replaceWrapAttr?: string | null) {
431
+ // this.refresh();
432
+ // }
326
433
  replaceExpressions(html, groupArgs, context, wrap) {
327
- const config = wrap ? { wrapExpression: wrap } : void 0;
434
+ let config = void 0;
435
+ if (wrap) {
436
+ config = {
437
+ expression: {
438
+ replace: { start: `${wrap.start}`, end: `${wrap.end}` },
439
+ callReturn: { start: `${wrap.start}=`, end: `${wrap.end}` },
440
+ call: { start: `${wrap.start}@`, end: `${wrap.end}` }
441
+ }
442
+ };
443
+ }
328
444
  const ae = new import_core.ActionExpression(html, config);
329
- const filterOptions = wrap ? { type: "replace", wrap } : "replace";
330
445
  const win = this.ownerDocument?.defaultView || window;
331
- for (const expr of ae.getExpressions(filterOptions)) {
446
+ for (const expr of ae.getExpressions("replace")) {
332
447
  try {
333
448
  const value = import_core.FunctionUtils.executeReturn({
334
449
  script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
@@ -342,32 +457,29 @@ const registerAllElements = (w) => {
342
457
  }
343
458
  return ae.getUnprocessedTemplate();
344
459
  }
345
- refresh(value = this._value) {
346
- const portal = this.parentElement;
347
- if (!portal)
460
+ refresh(value) {
461
+ value = (0, import_decorators.getAttributeValue)(this, "value") ?? this._value;
462
+ console.log("[DEBUG] SwcChoose.refresh called, value:", value);
463
+ const portal = import_Utils.SwcUtils.getParentContainer(this);
464
+ if (!portal) {
465
+ console.log("[DEBUG] SwcChoose portal is null!");
348
466
  return;
349
- const win = this.ownerDocument?.defaultView || window;
467
+ }
468
+ const win = ((0, import_decorators.getElementConfig)(this).window ?? this.ownerDocument?.defaultView) || window;
350
469
  const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
351
- const groupArgs = { ...helperSet, $value: value };
470
+ const groupArgs = { ...helperSet, $value: value, $templateHost: this };
352
471
  const templates = Array.from(this.content.querySelectorAll("template"));
353
472
  let selected = null;
354
473
  for (const t of templates) {
355
474
  if (t.getAttribute("is") === "swc-when") {
356
- const attrVal = t.getAttribute("value") || "";
475
+ const attrVal = t.getAttribute("test") || "";
357
476
  let matches = false;
358
- const ae = new import_core.ActionExpression(attrVal);
359
- const expr = ae.getFirstExpression("replace");
360
- if (expr) {
361
- const decodedScript = import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document);
362
- const result = import_core.FunctionUtils.executeReturn({
363
- script: decodedScript,
364
- context: t,
365
- args: groupArgs
366
- });
367
- matches = !!result;
368
- } else {
369
- matches = String(attrVal) === String(value);
370
- }
477
+ const result = import_core.FunctionUtils.executeReturn({
478
+ script: attrVal,
479
+ context: t,
480
+ args: groupArgs
481
+ });
482
+ matches = !!result;
371
483
  if (matches) {
372
484
  selected = t;
373
485
  break;
@@ -386,12 +498,27 @@ const registerAllElements = (w) => {
386
498
  this._previousTemplate = target;
387
499
  if (target) {
388
500
  let htmlString = target.innerHTML;
389
- htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
501
+ htmlString = this.replaceExpressions(htmlString, groupArgs, this, { start: this._replaceWrapStart ?? "{#{", end: this._replaceWrapEnd ?? "}#}" });
390
502
  const result = this.ownerDocument?.createElement("template") || document.createElement("template");
391
503
  result.innerHTML = htmlString;
392
504
  const processedFragment = result.content;
393
505
  this._nodes = Array.from(processedFragment.childNodes);
506
+ const setTemplateHost = (element) => {
507
+ element.__swc_template_host = this;
508
+ Array.from(element.children).forEach((child) => {
509
+ if (child instanceof HTMLElement) {
510
+ setTemplateHost(child);
511
+ }
512
+ });
513
+ };
514
+ this._nodes.forEach((node) => {
515
+ if (node instanceof HTMLElement) {
516
+ setTemplateHost(node);
517
+ }
518
+ });
519
+ console.log(`[DEBUG] SwcChoose before insertBefore, portal: ${portal?.tagName}, isConnected: ${portal?.isConnected}`);
394
520
  portal.insertBefore(processedFragment, this.nextSibling);
521
+ console.log("[DEBUG] SwcChoose after insertBefore");
395
522
  }
396
523
  }
397
524
  cleanup() {
@@ -403,27 +530,22 @@ const registerAllElements = (w) => {
403
530
  }
404
531
  };
405
532
  __decorate([
406
- (0, import_decorators.attributeHost)("value"),
407
- __metadata("design:type", Object)
408
- ], SwcChoose.prototype, "_value", void 0);
533
+ (0, import_decorators.attributeHost)("replace-wrap-start"),
534
+ __metadata("design:type", String)
535
+ ], SwcChoose.prototype, "_replaceWrapStart", void 0);
409
536
  __decorate([
410
- (0, import_decorators.attributeHost)("replace-wrap"),
537
+ (0, import_decorators.attributeHost)("replace-wrap-end"),
411
538
  __metadata("design:type", String)
412
- ], SwcChoose.prototype, "_replaceWrap", void 0);
539
+ ], SwcChoose.prototype, "_replaceWrapEnd", void 0);
413
540
  __decorate([
414
541
  (0, import_decorators.changedAttributeHost)("value"),
415
542
  __metadata("design:type", Function),
416
- __metadata("design:paramtypes", []),
543
+ __metadata("design:paramtypes", [Object, String, String]),
417
544
  __metadata("design:returntype", void 0)
418
545
  ], SwcChoose.prototype, "setValue", null);
419
- __decorate([
420
- (0, import_decorators.changedAttributeHost)("replace-wrap"),
421
- __metadata("design:type", Function),
422
- __metadata("design:paramtypes", [String]),
423
- __metadata("design:returntype", void 0)
424
- ], SwcChoose.prototype, "setReplaceWrap", null);
425
546
  SwcChoose = __decorate([
426
- (0, import_decorators.elementDefine)("swc-choose", { extends: "template", window: w })
547
+ (0, import_decorators.elementDefine)("swc-choose", { extends: "template", window: w }),
548
+ __metadata("design:paramtypes", [])
427
549
  ], SwcChoose);
428
550
  let SwcAsync = class SwcAsync extends HTMLTemplateElement {
429
551
  constructor() {
@@ -439,9 +561,10 @@ const registerAllElements = (w) => {
439
561
  setValue(valueAttr) {
440
562
  this.executeAsync(this._value);
441
563
  }
442
- setReplaceWrap() {
443
- this.executeAsync(this._value);
444
- }
564
+ // @changedAttributeHost('replace-wrap')
565
+ // private setReplaceWrap() {
566
+ // this.executeAsync(this._value);
567
+ // }
445
568
  executeAsync(result = this._value) {
446
569
  if (result === void 0 || result === null) {
447
570
  this.refresh("default");
@@ -463,11 +586,19 @@ const registerAllElements = (w) => {
463
586
  }
464
587
  }
465
588
  replaceExpressions(html, groupArgs, context, wrap) {
466
- const config = wrap ? { wrapExpression: wrap } : void 0;
589
+ let config = void 0;
590
+ if (wrap) {
591
+ config = {
592
+ expression: {
593
+ replace: { start: `${wrap.start}`, end: `${wrap.end}` },
594
+ callReturn: { start: `${wrap.start}=`, end: `${wrap.end}` },
595
+ call: { start: `${wrap.start}@`, end: `${wrap.end}` }
596
+ }
597
+ };
598
+ }
467
599
  const ae = new import_core.ActionExpression(html, config);
468
- const filterOptions = wrap ? { type: "replace", wrap } : "replace";
469
600
  const win = this.ownerDocument?.defaultView || window;
470
- for (const expr of ae.getExpressions(filterOptions)) {
601
+ for (const expr of ae.getExpressions("replace")) {
471
602
  try {
472
603
  const value = import_core.FunctionUtils.executeReturn({
473
604
  script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
@@ -482,9 +613,8 @@ const registerAllElements = (w) => {
482
613
  return ae.getUnprocessedTemplate();
483
614
  }
484
615
  refresh(state = "default") {
485
- console.log("rrrrrrrrrrrrrrrrr", state);
486
616
  this.cleanup();
487
- const portal = this.parentElement;
617
+ const portal = import_Utils.SwcUtils.getParentContainer(this);
488
618
  if (!portal)
489
619
  return;
490
620
  const win = this.ownerDocument?.defaultView || window;
@@ -492,12 +622,16 @@ const registerAllElements = (w) => {
492
622
  const t = this.content.querySelector(`template[is="swc-${state}"]`);
493
623
  if (t) {
494
624
  let htmlString = t.innerHTML;
495
- const groupArgs = { ...helperSet, $value: this._value, $state: state };
496
- htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
625
+ const groupArgs = { ...helperSet, $value: this._value, $state: state, $templateHost: this };
626
+ htmlString = this.replaceExpressions(htmlString, groupArgs, this, { start: this._replaceWrapStart ?? "{#{", end: this._replaceWrapEnd ?? "}#}" });
497
627
  const temp = this.ownerDocument?.createElement("template") || document.createElement("template");
498
628
  temp.innerHTML = htmlString;
499
629
  const content = temp.content;
500
630
  this._nodes = Array.from(content.childNodes);
631
+ this._nodes.forEach((node) => {
632
+ if (node instanceof HTMLElement)
633
+ node.__template_swc_host = this;
634
+ });
501
635
  portal.insertBefore(content, this.nextSibling);
502
636
  }
503
637
  }
@@ -514,21 +648,19 @@ const registerAllElements = (w) => {
514
648
  __metadata("design:type", Object)
515
649
  ], SwcAsync.prototype, "_value", void 0);
516
650
  __decorate([
517
- (0, import_decorators.attributeHost)("replace-wrap"),
651
+ (0, import_decorators.attributeHost)("replace-wrap-start"),
652
+ __metadata("design:type", String)
653
+ ], SwcAsync.prototype, "_replaceWrapStart", void 0);
654
+ __decorate([
655
+ (0, import_decorators.attributeHost)("replace-wrap-end"),
518
656
  __metadata("design:type", String)
519
- ], SwcAsync.prototype, "_replaceWrap", void 0);
657
+ ], SwcAsync.prototype, "_replaceWrapEnd", void 0);
520
658
  __decorate([
521
659
  (0, import_decorators.changedAttributeHost)("value"),
522
660
  __metadata("design:type", Function),
523
661
  __metadata("design:paramtypes", [String]),
524
662
  __metadata("design:returntype", void 0)
525
663
  ], SwcAsync.prototype, "setValue", null);
526
- __decorate([
527
- (0, import_decorators.changedAttributeHost)("replace-wrap"),
528
- __metadata("design:type", Function),
529
- __metadata("design:paramtypes", []),
530
- __metadata("design:returntype", void 0)
531
- ], SwcAsync.prototype, "setReplaceWrap", null);
532
664
  SwcAsync = __decorate([
533
665
  (0, import_decorators.elementDefine)("swc-async", { extends: "template", window: w })
534
666
  ], SwcAsync);