@dooboostore/simple-web-component 1.0.31 → 1.0.32

package/dist/cjs/elements/register.js

@@ -20,11 +20,11 @@ __export(register_exports, {
   registerAllElements: () => registerAllElements
 });
 module.exports = __toCommonJS(register_exports);
-var import_elementDefine = require("../decorators/elementDefine");
+var import_decorators = require("../decorators");
 var import_SwcAppMixin = require("./SwcAppMixin");
 var import_Utils = require("../utils/Utils");
 var import_core = require("@dooboostore/core");
-var import_changedAttributeHost = require("../decorators/changedAttributeHost");
+var import_core_web = require("@dooboostore/core-web");
 var __decorate = function(decorators, target, key, desc) {
   var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
   if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
@@ -100,305 +100,273 @@ const registerAllElements = (w) => {
   let SwcLoading = class SwcLoading extends HTMLTemplateElement {
   };
   SwcLoading = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-loading", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-loading", { extends: "template", window: w })
   ], SwcLoading);
   let SwcError = class SwcError extends HTMLTemplateElement {
   };
   SwcError = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-error", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-error", { extends: "template", window: w })
   ], SwcError);
   let SwcSuccess = class SwcSuccess extends HTMLTemplateElement {
   };
   SwcSuccess = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-success", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-success", { extends: "template", window: w })
   ], SwcSuccess);
   let SwcWhen = class SwcWhen extends HTMLTemplateElement {
   };
   SwcWhen = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-when", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-when", { extends: "template", window: w })
   ], SwcWhen);
   let SwcOtherwise = class SwcOtherwise extends HTMLTemplateElement {
   };
   SwcOtherwise = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-otherwise", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-otherwise", { extends: "template", window: w })
   ], SwcOtherwise);
   let SwcDefault = class SwcDefault extends HTMLTemplateElement {
   };
   SwcDefault = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-default", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-default", { extends: "template", window: w })
   ], SwcDefault);
   let SwcApp = class SwcApp extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLElement) {
   };
   SwcApp = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app", { window: w })
+    (0, import_decorators.elementDefine)("swc-app", { window: w })
   ], SwcApp);
   let SwcIf = class SwcIf extends HTMLTemplateElement {
     constructor() {
       super(...arguments);
-      this._value = false;
       this._nodes = [];
     }
     get value() {
       return this._value;
     }
     set value(nv) {
-      this._value = Boolean(nv);
-      this.render();
+      this.refresh(nv);
     }
-    _executeCloneCallback(attr, args) {
-      const script = this.getAttribute(attr);
-      if (!script)
-        return;
-      import_core.FunctionUtils.execute({ script, context: this, args });
-    }
-    refreshValue(valueAttr) {
-      valueAttr ?? (valueAttr = this.getAttribute("value"));
-      if (valueAttr === null) {
-        this.value = false;
-        return;
-      }
-      if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
-        const script = valueAttr.slice(2, -2).trim();
-        const win = this.ownerDocument?.defaultView || window;
-        const result = import_core.FunctionUtils.executeReturn({
-          script,
-          context: this,
-          args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
-        });
-        this.value = result;
-      } else {
-        this.value = Boolean(valueAttr);
+    replaceExpressions(html, groupArgs, context, wrap) {
+      const config = wrap ? { wrapExpression: wrap } : void 0;
+      const ae = new import_core.ActionExpression(html, config);
+      const filterOptions = wrap ? { type: "replace", wrap } : "replace";
+      const win = this.ownerDocument?.defaultView || window;
+      for (const expr of ae.getExpressions(filterOptions)) {
+        try {
+          const value = import_core.FunctionUtils.executeReturn({
+            script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
+            context,
+            args: groupArgs
+          });
+          ae.replace(expr, String(value));
+        } catch (e) {
+          console.error(`[SWC] Failed to execute ${expr.original}:`, e);
+        }
       }
+      return ae.getUnprocessedTemplate();
+    }
+    setValue(valueAttr) {
+      this.refresh();
     }
-    render() {
+    setReplaceWrap(replaceWrapAttr) {
+      this.refresh();
+    }
+    refresh(value = this._value) {
       this.cleanup();
       const portal = this.parentElement;
-      if (!portal)
+      if (!portal || !value)
         return;
       const win = this.ownerDocument?.defaultView || window;
       const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
-      let targetTpl = null;
-      if (this._value) {
-        targetTpl = this;
-      } else {
-        targetTpl = this.content.querySelector('template[is="swc-default"]');
-      }
-      if (targetTpl) {
-        const clone = targetTpl.content.cloneNode(true);
-        if (targetTpl === this) {
-          clone.querySelectorAll('template[is^="swc-"]').forEach((t) => t.remove());
-        }
-        this._nodes = Array.from(clone.childNodes);
-        const elements = this._nodes.filter((n) => n.nodeType === 1);
-        const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };
-        this._nodes.forEach((node, nodeIdx) => {
-          this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: node, $nodeIndex: nodeIdx, $isElement: node.nodeType === 1 });
-          if (node instanceof HTMLElement) {
-            Array.from(node.attributes).forEach((attr) => {
-              const value = attr.value || "";
-              if (value.startsWith("{{") && value.endsWith("}}")) {
-                const script = value.slice(2, -2).trim();
-                const result = import_core.FunctionUtils.executeReturn({
-                  script,
-                  context: node,
-                  args: { ...groupArgs, $value: this._value }
-                });
-                node.setAttribute(attr.name, String(result));
-              }
-            });
-          }
-        });
-        this._executeCloneCallback("on-clone-nodes", groupArgs);
-        portal.insertBefore(clone, this.nextSibling);
-      }
+      let htmlString = this.innerHTML;
+      const groupArgs = { ...helperSet, $value: value };
+      htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
+      const result = this.ownerDocument?.createElement("template") || document.createElement("template");
+      result.innerHTML = htmlString;
+      const processedFragment = result.content;
+      this._nodes = Array.from(processedFragment.childNodes);
+      portal.insertBefore(processedFragment, this.nextSibling);
     }
     cleanup() {
       this._nodes.forEach((n) => n.parentElement?.removeChild(n));
       this._nodes = [];
     }
-    connectedCallback() {
-      this.refreshValue();
-    }
     disconnectedCallback() {
       this.cleanup();
     }
   };
   __decorate([
-    (0, import_changedAttributeHost.changedAttributeHost)("value"),
+    (0, import_decorators.attributeHost)("value"),
+    __metadata("design:type", Object)
+  ], SwcIf.prototype, "_value", void 0);
+  __decorate([
+    (0, import_decorators.attributeHost)("replace-wrap"),
+    __metadata("design:type", String)
+  ], SwcIf.prototype, "_replaceWrap", void 0);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("value"),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", [String]),
+    __metadata("design:returntype", void 0)
+  ], SwcIf.prototype, "setValue", null);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("replace-wrap"),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [String]),
     __metadata("design:returntype", void 0)
-  ], SwcIf.prototype, "refreshValue", null);
+  ], SwcIf.prototype, "setReplaceWrap", null);
   SwcIf = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-if", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-if", { extends: "template", window: w })
   ], SwcIf);
   let SwcLoop = class SwcLoop extends HTMLTemplateElement {
     constructor() {
       super(...arguments);
-      this._value = [];
       this._nodeGroups = [];
     }
     get value() {
       return this._value;
     }
     set value(nv) {
-      this._value = Array.isArray(nv) ? [...nv] : [];
-      this.render();
+      this.refresh(nv);
     }
-    _executeCloneCallback(attr, args) {
-      const script = this.getAttribute(attr);
-      if (!script)
-        return;
-      import_core.FunctionUtils.execute({ script, context: this, args });
+    setValue() {
+      this.refresh();
     }
-    _cleanup() {
-      this._nodeGroups.forEach((nodes) => nodes.forEach((n) => n.parentElement?.removeChild(n)));
-      this._nodeGroups = [];
+    setReplaceWrap() {
+      this.refresh();
     }
-    refreshValue() {
-      let script = this.getAttribute("value");
-      if (!script) {
-        this.value = [];
-        return;
-      }
-      if (script.startsWith("{{") && script.endsWith("}}")) {
-        script = script.slice(2, -2).trim();
-      }
+    replaceExpressions(html, groupArgs, context, wrap) {
+      const config = wrap ? { wrapExpression: wrap } : void 0;
+      const ae = new import_core.ActionExpression(html, config);
+      const filterOptions = wrap ? { type: "replace", wrap } : "replace";
       const win = this.ownerDocument?.defaultView || window;
-      const res = import_core.FunctionUtils.executeReturn({
-        script,
-        context: this,
-        args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
-      });
-      if (res instanceof Promise) {
-        res.then((v) => this.value = v).catch(() => this.value = []);
-      } else {
-        this.value = res;
+      for (const expr of ae.getExpressions(filterOptions)) {
+        try {
+          const value = import_core.FunctionUtils.executeReturn({
+            script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
+            context,
+            args: groupArgs
+          });
+          ae.replace(expr, String(value));
+        } catch (e) {
+          console.error(`[SWC] Failed to execute ${expr.original}:`, e);
+        }
       }
+      return ae.getUnprocessedTemplate();
     }
-    render() {
-      this._cleanup();
+    refresh(value = this._value) {
+      this.cleanup();
+      if (value?.length <= 0)
+        return;
       const portal = this.parentElement;
       if (!portal)
         return;
       const win = this.ownerDocument?.defaultView || window;
       const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
       const fragment = win.document.createDocumentFragment();
-      if (this._value.length === 0) {
-        const defaultTpl = this.content.querySelector('template[is="swc-default"]');
-        if (defaultTpl) {
-          const clone = defaultTpl.content.cloneNode(true);
-          const nodes = Array.from(clone.childNodes);
-          this._nodeGroups.push(nodes);
-          fragment.appendChild(clone);
-        }
-      } else {
-        this._value.forEach((item, index) => {
-          const clone = this.content.cloneNode(true);
-          const subTemplates = clone.querySelectorAll('template[is^="swc-"]');
-          subTemplates.forEach((t) => t.remove());
-          const nodes = Array.from(clone.childNodes);
-          const elements = nodes.filter((n) => n.nodeType === 1);
-          const groupArgs = { ...helperSet, $item: item, $index: index, $value: this._value, $nodes: nodes, $elements: elements, $firstElement: elements[0] };
-          nodes.forEach((node, nodeIdx) => {
-            this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: node, $nodeIndex: nodeIdx, $isElement: node.nodeType === 1 });
-            if (node instanceof HTMLElement) {
-              Array.from(node.attributes).forEach((attr) => {
-                const value = attr.value || "";
-                if (value.startsWith("{{") && value.endsWith("}}")) {
-                  const script = value.slice(2, -2).trim();
-                  const result = import_core.FunctionUtils.executeReturn({
-                    script,
-                    context: node,
-                    args: groupArgs
-                  });
-                  node.setAttribute(attr.name, String(result));
-                }
-              });
-            }
-          });
-          this._executeCloneCallback("on-clone-nodes", groupArgs);
-          this._nodeGroups.push(nodes);
-          fragment.appendChild(clone);
-        });
-      }
-      if (portal === this.parentElement) {
-        portal.insertBefore(fragment, this.nextSibling);
-      } else {
-        portal.appendChild(fragment);
-      }
+      value.forEach((item, index) => {
+        let htmlString = this.innerHTML;
+        const groupArgs = { ...helperSet, $item: item, $index: index, $value: this._value };
+        htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
+        const temp = this.ownerDocument?.createElement("template") || document.createElement("template");
+        temp.innerHTML = htmlString;
+        const content = temp.content;
+        const nodes = Array.from(content.childNodes);
+        this._nodeGroups.push(nodes);
+        fragment.appendChild(content);
+      });
+      portal.insertBefore(fragment, this.nextSibling);
     }
-    connectedCallback() {
-      this.refreshValue();
+    cleanup() {
+      this._nodeGroups.forEach((nodes) => nodes.forEach((n) => n.parentElement?.removeChild(n)));
+      this._nodeGroups = [];
     }
     disconnectedCallback() {
-      this._cleanup();
+      this.cleanup();
     }
   };
   __decorate([
-    (0, import_changedAttributeHost.changedAttributeHost)("value"),
+    (0, import_decorators.attributeHost)("value"),
+    __metadata("design:type", Array)
+  ], SwcLoop.prototype, "_value", void 0);
+  __decorate([
+    (0, import_decorators.attributeHost)("replace-wrap"),
+    __metadata("design:type", String)
+  ], SwcLoop.prototype, "_replaceWrap", void 0);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("value"),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", []),
     __metadata("design:returntype", void 0)
-  ], SwcLoop.prototype, "refreshValue", null);
+  ], SwcLoop.prototype, "setValue", null);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("replace-wrap"),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+  ], SwcLoop.prototype, "setReplaceWrap", null);
   SwcLoop = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-loop", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-loop", { extends: "template", window: w })
   ], SwcLoop);
   let SwcChoose = class SwcChoose extends HTMLTemplateElement {
     constructor() {
       super(...arguments);
       this._nodes = [];
-      this._value = null;
       this._previousTemplate = null;
     }
     get value() {
       return this._value;
     }
     set value(nv) {
-      this._value = nv;
-      this.render();
+      this.refresh(nv);
     }
-    _executeCloneCallback(attr, args) {
-      const script = this.getAttribute(attr);
-      if (!script)
-        return;
-      import_core.FunctionUtils.execute({ script, context: this, args });
+    setValue() {
+      this.refresh();
     }
-    refresh(valueAttr) {
-      valueAttr ?? (valueAttr = this.getAttribute("value"));
-      if (valueAttr === null) {
-        this.value = null;
-        return;
-      }
-      if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
-        const script = valueAttr.slice(2, -2).trim();
-        const win = this.ownerDocument?.defaultView || window;
-        const helperAndHostSet = import_Utils.SwcUtils.getHelperAndHostSet(win, import_Utils.SwcUtils.findNearestSwcHost(this));
-        const result = import_core.FunctionUtils.executeReturn({ script, context: this, args: helperAndHostSet });
-        this.value = result;
-      } else {
-        this.value = valueAttr;
+    setReplaceWrap(replaceWrapAttr) {
+      this.refresh();
+    }
+    replaceExpressions(html, groupArgs, context, wrap) {
+      const config = wrap ? { wrapExpression: wrap } : void 0;
+      const ae = new import_core.ActionExpression(html, config);
+      const filterOptions = wrap ? { type: "replace", wrap } : "replace";
+      const win = this.ownerDocument?.defaultView || window;
+      for (const expr of ae.getExpressions(filterOptions)) {
+        try {
+          const value = import_core.FunctionUtils.executeReturn({
+            script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
+            context,
+            args: groupArgs
+          });
+          ae.replace(expr, String(value));
+        } catch (e) {
+          console.error(`[SWC] Failed to execute ${expr.original}:`, e);
+        }
       }
+      return ae.getUnprocessedTemplate();
     }
-    render() {
+    refresh(value = this._value) {
+      const portal = this.parentElement;
+      if (!portal)
+        return;
       const win = this.ownerDocument?.defaultView || window;
       const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
+      const groupArgs = { ...helperSet, $value: value };
       const templates = Array.from(this.content.querySelectorAll("template"));
       let selected = null;
       for (const t of templates) {
         if (t.getAttribute("is") === "swc-when") {
+          const attrVal = t.getAttribute("value") || "";
           let matches = false;
-          const value = t.getAttribute("value") || "";
-          if (value.startsWith("{{") && value.endsWith("}}")) {
-            const script = value.slice(2, -2).trim();
+          const ae = new import_core.ActionExpression(attrVal);
+          const expr = ae.getFirstExpression("replace");
+          if (expr) {
+            const decodedScript = import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document);
             const result = import_core.FunctionUtils.executeReturn({
-              script,
+              script: decodedScript,
               context: t,
-              args: { ...helperSet, $value: this._value }
+              args: groupArgs
             });
-            matches = result === true;
+            matches = !!result;
           } else {
-            matches = String(value) === String(this._value);
+            matches = String(attrVal) === String(value);
           }
           if (matches) {
             selected = t;
@@ -407,103 +375,114 @@ const registerAllElements = (w) => {
         }
       }
       const target = selected || this.content.querySelector('template[is="swc-otherwise"]');
-      const targetHasSkipIfSame = target?.hasAttribute("skip-if-same");
-      const shouldSkip = (this.hasAttribute("skip-if-same") || targetHasSkipIfSame) && this._previousTemplate === target;
-      if (shouldSkip) {
+      const skipValue = target?.getAttribute?.("skip-if-same");
+      const skipValue2 = this._previousTemplate?.getAttribute?.("skip-if-same");
+      const hasSkipIfSame = target?.hasAttribute?.("skip-if-same");
+      const isSame = this._previousTemplate === target;
+      if (hasSkipIfSame && isSame) {
         return;
       }
       this.cleanup();
       this._previousTemplate = target;
       if (target) {
-        const clone = target.content.cloneNode(true);
-        this._nodes = Array.from(clone.childNodes);
-        const elements = this._nodes.filter((n) => n.nodeType === 1);
-        const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0] };
-        this._nodes.forEach((n, nodeIdx) => {
-          this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });
-          if (n instanceof HTMLElement) {
-            Array.from(n.attributes).forEach((attr) => {
-              const value = attr.value || "";
-              if (value.startsWith("{{") && value.endsWith("}}")) {
-                const script = value.slice(2, -2).trim();
-                const result = import_core.FunctionUtils.executeReturn({
-                  script,
-                  context: n,
-                  args: { ...groupArgs, $value: this._value }
-                });
-                n.setAttribute(attr.name, String(result));
-              }
-            });
-          }
-        });
-        this._executeCloneCallback("on-clone-nodes", groupArgs);
-        this.parentElement?.insertBefore(clone, this.nextSibling);
+        let htmlString = target.innerHTML;
+        htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
+        const result = this.ownerDocument?.createElement("template") || document.createElement("template");
+        result.innerHTML = htmlString;
+        const processedFragment = result.content;
+        this._nodes = Array.from(processedFragment.childNodes);
+        portal.insertBefore(processedFragment, this.nextSibling);
       }
     }
     cleanup() {
       this._nodes.forEach((n) => n.parentElement?.removeChild(n));
       this._nodes = [];
     }
-    connectedCallback() {
-      this.refresh();
-    }
     disconnectedCallback() {
       this.cleanup();
     }
   };
   __decorate([
-    (0, import_changedAttributeHost.changedAttributeHost)("value"),
+    (0, import_decorators.attributeHost)("value"),
+    __metadata("design:type", Object)
+  ], SwcChoose.prototype, "_value", void 0);
+  __decorate([
+    (0, import_decorators.attributeHost)("replace-wrap"),
+    __metadata("design:type", String)
+  ], SwcChoose.prototype, "_replaceWrap", void 0);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("value"),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+  ], SwcChoose.prototype, "setValue", null);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("replace-wrap"),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [String]),
     __metadata("design:returntype", void 0)
-  ], SwcChoose.prototype, "refresh", null);
+  ], SwcChoose.prototype, "setReplaceWrap", null);
   SwcChoose = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-choose", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-choose", { extends: "template", window: w })
   ], SwcChoose);
   let SwcAsync = class SwcAsync extends HTMLTemplateElement {
     constructor() {
       super(...arguments);
       this._nodes = [];
-      this._value = null;
     }
-    _executeCloneCallback(attr, args) {
-      const script = this.getAttribute(attr);
-      if (!script)
-        return;
-      import_core.FunctionUtils.execute({ script, context: this, args });
+    get value() {
+      return this._value;
+    }
+    set value(nv) {
+      this.executeAsync(nv);
+    }
+    setValue(valueAttr) {
+      this.executeAsync(this._value);
     }
-    refresh(valueAttr) {
-      valueAttr ?? (valueAttr = this.getAttribute("value"));
-      if (!valueAttr) {
-        this.render("default");
+    setReplaceWrap() {
+      this.executeAsync(this._value);
+    }
+    executeAsync(result = this._value) {
+      if (result === void 0 || result === null) {
+        this.refresh("default");
         return;
       }
-      if (valueAttr.startsWith("{{") && valueAttr.endsWith("}}")) {
-        const script = valueAttr.slice(2, -2).trim();
-        const win = this.ownerDocument?.defaultView || window;
-        const result = import_core.FunctionUtils.executeReturn({
-          script,
-          context: this,
-          args: import_Utils.SwcUtils.getHelperAndHostSet(win, this)
+      if (result instanceof Promise) {
+        this.refresh("loading");
+        result.then((v) => {
+          this.resultValue = v;
+          this.refresh("success");
+        }).catch((e) => {
+          console.error("[SWC-ASYNC] Promise rejected:", e);
+          this.resultValue = e;
+          this.refresh("error");
         });
-        this.executeAsync(result);
       } else {
-        this.executeAsync(valueAttr);
+        this.resultValue = result;
+        this.refresh("success");
       }
     }
-    executeAsync(result) {
-      if (result instanceof Promise) {
-        this.render("loading");
-        result.then((v) => {
-          this._value = v;
-          this.render("success");
-        }).catch((e) => this.render("error"));
-      } else {
-        this._value = result;
-        this.render("success");
+    replaceExpressions(html, groupArgs, context, wrap) {
+      const config = wrap ? { wrapExpression: wrap } : void 0;
+      const ae = new import_core.ActionExpression(html, config);
+      const filterOptions = wrap ? { type: "replace", wrap } : "replace";
+      const win = this.ownerDocument?.defaultView || window;
+      for (const expr of ae.getExpressions(filterOptions)) {
+        try {
+          const value = import_core.FunctionUtils.executeReturn({
+            script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win.document),
+            context,
+            args: groupArgs
+          });
+          ae.replace(expr, String(value));
+        } catch (e) {
+          console.error(`[SWC] Failed to execute ${expr.original}:`, e);
+        }
       }
+      return ae.getUnprocessedTemplate();
     }
-    render(state) {
+    refresh(state = "default") {
+      console.log("rrrrrrrrrrrrrrrrr", state);
       this.cleanup();
       const portal = this.parentElement;
       if (!portal)
@@ -512,335 +491,331 @@ const registerAllElements = (w) => {
       const helperSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
       const t = this.content.querySelector(`template[is="swc-${state}"]`);
       if (t) {
-        const clone = t.content.cloneNode(true);
-        this._nodes = Array.from(clone.childNodes);
-        const elements = this._nodes.filter((n) => n.nodeType === 1);
-        const groupArgs = { ...helperSet, $value: this._value, $nodes: this._nodes, $elements: elements, $firstElement: elements[0], $state: state };
-        this._nodes.forEach((n, nodeIdx) => {
-          this._executeCloneCallback("on-clone-node", { ...groupArgs, $node: n, $nodeIndex: nodeIdx, $isElement: n.nodeType === 1 });
-          if (n instanceof HTMLElement) {
-            Array.from(n.attributes).forEach((attr) => {
-              const value = attr.value || "";
-              if (value.startsWith("{{") && value.endsWith("}}")) {
-                const script = value.slice(2, -2).trim();
-                const result = import_core.FunctionUtils.executeReturn({
-                  script,
-                  context: n,
-                  args: groupArgs
-                });
-                n.setAttribute(attr.name, String(result));
-              }
-            });
-          }
-        });
-        this._executeCloneCallback("on-clone-nodes", groupArgs);
-        portal.insertBefore(clone, this.nextSibling);
+        let htmlString = t.innerHTML;
+        const groupArgs = { ...helperSet, $value: this._value, $state: state };
+        htmlString = this.replaceExpressions(htmlString, groupArgs, this, this._replaceWrap);
+        const temp = this.ownerDocument?.createElement("template") || document.createElement("template");
+        temp.innerHTML = htmlString;
+        const content = temp.content;
+        this._nodes = Array.from(content.childNodes);
+        portal.insertBefore(content, this.nextSibling);
       }
     }
     cleanup() {
       this._nodes.forEach((n) => n.parentElement?.removeChild(n));
       this._nodes = [];
     }
-    connectedCallback() {
-      this.refresh();
-    }
     disconnectedCallback() {
       this.cleanup();
     }
   };
   __decorate([
-    (0, import_changedAttributeHost.changedAttributeHost)("value"),
+    (0, import_decorators.attributeHost)("value"),
+    __metadata("design:type", Object)
+  ], SwcAsync.prototype, "_value", void 0);
+  __decorate([
+    (0, import_decorators.attributeHost)("replace-wrap"),
+    __metadata("design:type", String)
+  ], SwcAsync.prototype, "_replaceWrap", void 0);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("value"),
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [String]),
     __metadata("design:returntype", void 0)
-  ], SwcAsync.prototype, "refresh", null);
+  ], SwcAsync.prototype, "setValue", null);
+  __decorate([
+    (0, import_decorators.changedAttributeHost)("replace-wrap"),
+    __metadata("design:type", Function),
+    __metadata("design:paramtypes", []),
+    __metadata("design:returntype", void 0)
+  ], SwcAsync.prototype, "setReplaceWrap", null);
   SwcAsync = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-async", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-async", { extends: "template", window: w })
   ], SwcAsync);
   let SwcAppAnchor = class SwcAppAnchor extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLAnchorElement) {
   };
   SwcAppAnchor = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-a", { extends: "a", window: w })
+    (0, import_decorators.elementDefine)("swc-app-a", { extends: "a", window: w })
   ], SwcAppAnchor);
   let SwcAppArea = class SwcAppArea extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLAreaElement) {
   };
   SwcAppArea = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-area", { extends: "area", window: w })
+    (0, import_decorators.elementDefine)("swc-app-area", { extends: "area", window: w })
   ], SwcAppArea);
   let SwcAppAudio = class SwcAppAudio extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLAudioElement) {
   };
   SwcAppAudio = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-audio", { extends: "audio", window: w })
+    (0, import_decorators.elementDefine)("swc-app-audio", { extends: "audio", window: w })
   ], SwcAppAudio);
   let SwcAppBase = class SwcAppBase extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLBaseElement) {
   };
   SwcAppBase = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-base", { extends: "base", window: w })
+    (0, import_decorators.elementDefine)("swc-app-base", { extends: "base", window: w })
   ], SwcAppBase);
   let SwcAppButton = class SwcAppButton extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLButtonElement) {
   };
   SwcAppButton = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-button", { extends: "button", window: w })
+    (0, import_decorators.elementDefine)("swc-app-button", { extends: "button", window: w })
   ], SwcAppButton);
   let SwcAppCanvas = class SwcAppCanvas extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLCanvasElement) {
   };
   SwcAppCanvas = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-canvas", { extends: "canvas", window: w })
+    (0, import_decorators.elementDefine)("swc-app-canvas", { extends: "canvas", window: w })
   ], SwcAppCanvas);
   let SwcAppData = class SwcAppData extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDataElement) {
   };
   SwcAppData = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-data", { extends: "data", window: w })
+    (0, import_decorators.elementDefine)("swc-app-data", { extends: "data", window: w })
   ], SwcAppData);
   let SwcAppDataList = class SwcAppDataList extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDataListElement) {
   };
   SwcAppDataList = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-datalist", { extends: "datalist", window: w })
+    (0, import_decorators.elementDefine)("swc-app-datalist", { extends: "datalist", window: w })
   ], SwcAppDataList);
   let SwcAppDetails = class SwcAppDetails extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDetailsElement) {
   };
   SwcAppDetails = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-details", { extends: "details", window: w })
+    (0, import_decorators.elementDefine)("swc-app-details", { extends: "details", window: w })
   ], SwcAppDetails);
   let SwcAppDialog = class SwcAppDialog extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDialogElement) {
   };
   SwcAppDialog = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-dialog", { extends: "dialog", window: w })
+    (0, import_decorators.elementDefine)("swc-app-dialog", { extends: "dialog", window: w })
   ], SwcAppDialog);
   let SwcAppDiv = class SwcAppDiv extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDivElement) {
   };
   SwcAppDiv = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-div", { extends: "div", window: w })
+    (0, import_decorators.elementDefine)("swc-app-div", { extends: "div", window: w })
   ], SwcAppDiv);
   let SwcAppDList = class SwcAppDList extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLDListElement) {
   };
   SwcAppDList = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-dl", { extends: "dl", window: w })
+    (0, import_decorators.elementDefine)("swc-app-dl", { extends: "dl", window: w })
   ], SwcAppDList);
   let SwcAppEmbed = class SwcAppEmbed extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLEmbedElement) {
   };
   SwcAppEmbed = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-embed", { extends: "embed", window: w })
+    (0, import_decorators.elementDefine)("swc-app-embed", { extends: "embed", window: w })
   ], SwcAppEmbed);
   let SwcAppFieldSet = class SwcAppFieldSet extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLFieldSetElement) {
   };
   SwcAppFieldSet = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-fieldset", { extends: "fieldset", window: w })
+    (0, import_decorators.elementDefine)("swc-app-fieldset", { extends: "fieldset", window: w })
   ], SwcAppFieldSet);
   let SwcAppForm = class SwcAppForm extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLFormElement) {
   };
   SwcAppForm = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-form", { extends: "form", window: w })
+    (0, import_decorators.elementDefine)("swc-app-form", { extends: "form", window: w })
   ], SwcAppForm);
   let SwcAppHR = class SwcAppHR extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLHRElement) {
   };
   SwcAppHR = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-hr", { extends: "hr", window: w })
+    (0, import_decorators.elementDefine)("swc-app-hr", { extends: "hr", window: w })
   ], SwcAppHR);
   let SwcAppIFrame = class SwcAppIFrame extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLIFrameElement) {
   };
   SwcAppIFrame = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-iframe", { extends: "iframe", window: w })
+    (0, import_decorators.elementDefine)("swc-app-iframe", { extends: "iframe", window: w })
   ], SwcAppIFrame);
   let SwcAppImage = class SwcAppImage extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLImageElement) {
   };
   SwcAppImage = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-img", { extends: "img", window: w })
+    (0, import_decorators.elementDefine)("swc-app-img", { extends: "img", window: w })
   ], SwcAppImage);
   let SwcAppInput = class SwcAppInput extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLInputElement) {
   };
   SwcAppInput = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-input", { extends: "input", window: w })
+    (0, import_decorators.elementDefine)("swc-app-input", { extends: "input", window: w })
   ], SwcAppInput);
   let SwcAppLabel = class SwcAppLabel extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLLabelElement) {
   };
   SwcAppLabel = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-label", { extends: "label", window: w })
+    (0, import_decorators.elementDefine)("swc-app-label", { extends: "label", window: w })
   ], SwcAppLabel);
   let SwcAppLegend = class SwcAppLegend extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLLegendElement) {
   };
   SwcAppLegend = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-legend", { extends: "legend", window: w })
+    (0, import_decorators.elementDefine)("swc-app-legend", { extends: "legend", window: w })
   ], SwcAppLegend);
   let SwcAppLI = class SwcAppLI extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLLIElement) {
   };
   SwcAppLI = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-li", { extends: "li", window: w })
+    (0, import_decorators.elementDefine)("swc-app-li", { extends: "li", window: w })
   ], SwcAppLI);
   let SwcAppLink = class SwcAppLink extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLLinkElement) {
   };
   SwcAppLink = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-link", { extends: "link", window: w })
+    (0, import_decorators.elementDefine)("swc-app-link", { extends: "link", window: w })
   ], SwcAppLink);
   let SwcAppMap = class SwcAppMap extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLMapElement) {
   };
   SwcAppMap = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-map", { extends: "map", window: w })
+    (0, import_decorators.elementDefine)("swc-app-map", { extends: "map", window: w })
   ], SwcAppMap);
   let SwcAppMeta = class SwcAppMeta extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLMetaElement) {
   };
   SwcAppMeta = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-meta", { extends: "meta", window: w })
+    (0, import_decorators.elementDefine)("swc-app-meta", { extends: "meta", window: w })
   ], SwcAppMeta);
   let SwcAppMeter = class SwcAppMeter extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLMeterElement) {
   };
   SwcAppMeter = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-meter", { extends: "meter", window: w })
+    (0, import_decorators.elementDefine)("swc-app-meter", { extends: "meter", window: w })
   ], SwcAppMeter);
   let SwcAppMod = class SwcAppMod extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLModElement) {
   };
   SwcAppMod = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-del", { extends: "del", window: w })
+    (0, import_decorators.elementDefine)("swc-app-del", { extends: "del", window: w })
   ], SwcAppMod);
   let SwcAppObject = class SwcAppObject extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLObjectElement) {
   };
   SwcAppObject = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-object", { extends: "object", window: w })
+    (0, import_decorators.elementDefine)("swc-app-object", { extends: "object", window: w })
   ], SwcAppObject);
   let SwcAppOList = class SwcAppOList extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLOListElement) {
   };
   SwcAppOList = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-ol", { extends: "ol", window: w })
+    (0, import_decorators.elementDefine)("swc-app-ol", { extends: "ol", window: w })
   ], SwcAppOList);
   let SwcAppOptGroup = class SwcAppOptGroup extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLOptGroupElement) {
   };
   SwcAppOptGroup = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-optgroup", { extends: "optgroup", window: w })
+    (0, import_decorators.elementDefine)("swc-app-optgroup", { extends: "optgroup", window: w })
   ], SwcAppOptGroup);
   let SwcAppOption = class SwcAppOption extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLOptionElement) {
   };
   SwcAppOption = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-option", { extends: "option", window: w })
+    (0, import_decorators.elementDefine)("swc-app-option", { extends: "option", window: w })
   ], SwcAppOption);
   let SwcAppOutput = class SwcAppOutput extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLOutputElement) {
   };
   SwcAppOutput = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-output", { extends: "output", window: w })
+    (0, import_decorators.elementDefine)("swc-app-output", { extends: "output", window: w })
   ], SwcAppOutput);
   let SwcAppParagraph = class SwcAppParagraph extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLParagraphElement) {
   };
   SwcAppParagraph = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-p", { extends: "p", window: w })
+    (0, import_decorators.elementDefine)("swc-app-p", { extends: "p", window: w })
   ], SwcAppParagraph);
   let SwcAppParam = class SwcAppParam extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLParamElement) {
   };
   SwcAppParam = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-param", { extends: "param", window: w })
+    (0, import_decorators.elementDefine)("swc-app-param", { extends: "param", window: w })
   ], SwcAppParam);
   let SwcAppPicture = class SwcAppPicture extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLPictureElement) {
   };
   SwcAppPicture = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-picture", { extends: "picture", window: w })
+    (0, import_decorators.elementDefine)("swc-app-picture", { extends: "picture", window: w })
   ], SwcAppPicture);
   let SwcAppPre = class SwcAppPre extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLPreElement) {
   };
   SwcAppPre = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-pre", { extends: "pre", window: w })
+    (0, import_decorators.elementDefine)("swc-app-pre", { extends: "pre", window: w })
   ], SwcAppPre);
   let SwcAppProgress = class SwcAppProgress extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLProgressElement) {
   };
   SwcAppProgress = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-progress", { extends: "progress", window: w })
+    (0, import_decorators.elementDefine)("swc-app-progress", { extends: "progress", window: w })
   ], SwcAppProgress);
   let SwcAppQuote = class SwcAppQuote extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLQuoteElement) {
   };
   SwcAppQuote = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-blockquote", { extends: "blockquote", window: w })
+    (0, import_decorators.elementDefine)("swc-app-blockquote", { extends: "blockquote", window: w })
   ], SwcAppQuote);
   let SwcAppScript = class SwcAppScript extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLScriptElement) {
   };
   SwcAppScript = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-script", { extends: "script", window: w })
+    (0, import_decorators.elementDefine)("swc-app-script", { extends: "script", window: w })
   ], SwcAppScript);
   let SwcAppSelect = class SwcAppSelect extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLSelectElement) {
   };
   SwcAppSelect = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-select", { extends: "select", window: w })
+    (0, import_decorators.elementDefine)("swc-app-select", { extends: "select", window: w })
   ], SwcAppSelect);
   let SwcAppSlot = class SwcAppSlot extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLSlotElement) {
   };
   SwcAppSlot = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-slot", { extends: "slot", window: w })
+    (0, import_decorators.elementDefine)("swc-app-slot", { extends: "slot", window: w })
   ], SwcAppSlot);
   let SwcAppSource = class SwcAppSource extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLSourceElement) {
   };
   SwcAppSource = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-source", { extends: "source", window: w })
+    (0, import_decorators.elementDefine)("swc-app-source", { extends: "source", window: w })
   ], SwcAppSource);
   let SwcAppSpan = class SwcAppSpan extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLSpanElement) {
   };
   SwcAppSpan = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-span", { extends: "span", window: w })
+    (0, import_decorators.elementDefine)("swc-app-span", { extends: "span", window: w })
   ], SwcAppSpan);
   let SwcAppStyle = class SwcAppStyle extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLStyleElement) {
   };
   SwcAppStyle = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-style", { extends: "style", window: w })
+    (0, import_decorators.elementDefine)("swc-app-style", { extends: "style", window: w })
   ], SwcAppStyle);
   let SwcAppTable = class SwcAppTable extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTableElement) {
   };
   SwcAppTable = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-table", { extends: "table", window: w })
+    (0, import_decorators.elementDefine)("swc-app-table", { extends: "table", window: w })
   ], SwcAppTable);
   let SwcAppTableSection = class SwcAppTableSection extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTableSectionElement) {
   };
   SwcAppTableSection = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-tbody", { extends: "tbody", window: w })
+    (0, import_decorators.elementDefine)("swc-app-tbody", { extends: "tbody", window: w })
   ], SwcAppTableSection);
   let SwcAppTableCell = class SwcAppTableCell extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTableCellElement) {
   };
   SwcAppTableCell = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-td", { extends: "td", window: w })
+    (0, import_decorators.elementDefine)("swc-app-td", { extends: "td", window: w })
   ], SwcAppTableCell);
   let SwcAppTemplate = class SwcAppTemplate extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTemplateElement) {
   };
   SwcAppTemplate = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-template", { extends: "template", window: w })
+    (0, import_decorators.elementDefine)("swc-app-template", { extends: "template", window: w })
   ], SwcAppTemplate);
   let SwcAppTextArea = class SwcAppTextArea extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTextAreaElement) {
   };
   SwcAppTextArea = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-textarea", { extends: "textarea", window: w })
+    (0, import_decorators.elementDefine)("swc-app-textarea", { extends: "textarea", window: w })
   ], SwcAppTextArea);
   let SwcAppTime = class SwcAppTime extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTimeElement) {
   };
   SwcAppTime = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-time", { extends: "time", window: w })
+    (0, import_decorators.elementDefine)("swc-app-time", { extends: "time", window: w })
   ], SwcAppTime);
   let SwcAppTitle = class SwcAppTitle extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTitleElement) {
   };
   SwcAppTitle = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-title", { extends: "title", window: w })
+    (0, import_decorators.elementDefine)("swc-app-title", { extends: "title", window: w })
   ], SwcAppTitle);
   let SwcAppTableRow = class SwcAppTableRow extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTableRowElement) {
   };
   SwcAppTableRow = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-tr", { extends: "tr", window: w })
+    (0, import_decorators.elementDefine)("swc-app-tr", { extends: "tr", window: w })
   ], SwcAppTableRow);
   let SwcAppTrack = class SwcAppTrack extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLTrackElement) {
   };
   SwcAppTrack = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-track", { extends: "track", window: w })
+    (0, import_decorators.elementDefine)("swc-app-track", { extends: "track", window: w })
   ], SwcAppTrack);
   let SwcAppUList = class SwcAppUList extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLUListElement) {
   };
   SwcAppUList = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-ul", { extends: "ul", window: w })
+    (0, import_decorators.elementDefine)("swc-app-ul", { extends: "ul", window: w })
   ], SwcAppUList);
   let SwcAppVideo = class SwcAppVideo extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLVideoElement) {
   };
   SwcAppVideo = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-video", { extends: "video", window: w })
+    (0, import_decorators.elementDefine)("swc-app-video", { extends: "video", window: w })
   ], SwcAppVideo);
   let SwcAppHeading = class SwcAppHeading extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLHeadingElement) {
   };
   SwcAppHeading = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-h1", { extends: "h1", window: w })
+    (0, import_decorators.elementDefine)("swc-app-h1", { extends: "h1", window: w })
   ], SwcAppHeading);
   let SwcAppBody = class SwcAppBody extends (0, import_SwcAppMixin.SwcAppMixin)(HTMLBodyElement) {
   };
   SwcAppBody = __decorate([
-    (0, import_elementDefine.elementDefine)("swc-app-body", { extends: "body", window: w })
+    (0, import_decorators.elementDefine)("swc-app-body", { extends: "body", window: w })
   ], SwcAppBody);
   return {
     // Sub Templates