@dooboostore/simple-web-component 1.0.16 → 1.0.18

package/dist/esm/elements/SwcAsync.js

@@ -0,0 +1,169 @@
+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);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = function(k, v) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { elementDefine } from "../decorators/elementDefine.js";
+import { changedAttribute } from "../decorators/changedAttribute.js";
+import { SwcUtils } from "../utils/Utils.js";
+import { FunctionUtils } from "@dooboostore/core/function/FunctionUtils";
+let SwcAsync = class SwcAsync2 extends HTMLTemplateElement {
+  constructor() {
+    super(...arguments);
+    this._nodes = [];
+    this._currentPromise = null;
+    this._value = null;
+  }
+  get value() {
+    return this._value;
+  }
+  set value(nv) {
+    if (nv instanceof Promise) {
+      this.handlePromise(nv);
+    } else {
+      this._value = nv;
+      this.render(nv === null ? "default" : "success", nv);
+    }
+  }
+  refresh(newValue) {
+    const script = newValue !== void 0 ? newValue : this.getAttribute("on-get-value");
+    if (!script) {
+      this.value = null;
+      return;
+    }
+    if (!this.parentElement)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      const result = FunctionUtils.executeReturn({
+        script,
+        context: this,
+        args: helperHostSet
+      });
+      if (result instanceof Promise) {
+        this.handlePromise(result);
+      } else {
+        this.value = result;
+      }
+    } catch (e) {
+      this.render("error", e);
+    }
+  }
+  async handlePromise(promise) {
+    this._currentPromise = promise;
+    this.render("loading");
+    try {
+      const result = await promise;
+      if (this._currentPromise !== promise)
+        return;
+      this._value = result;
+      this.render("success", result);
+    } catch (e) {
+      if (this._currentPromise !== promise)
+        return;
+      this.render("error", e);
+    }
+  }
+  render(state, data) {
+    this.cleanup();
+    if (!this.parentElement)
+      return;
+    let fragment;
+    const ctx = {
+      $nodes: [],
+      $elements: [],
+      $state: state,
+      $value: null,
+      $error: null
+    };
+    if (state === "default") {
+      const t = this.content.querySelector('template[is="swc-default"]');
+      fragment = t ? t.content.cloneNode(true) : document.createDocumentFragment();
+    } else if (state === "loading") {
+      const t = this.content.querySelector('template[is="swc-loading"]');
+      fragment = t ? t.content.cloneNode(true) : document.createDocumentFragment();
+    } else if (state === "error") {
+      const t = this.content.querySelector('template[is="swc-error"]');
+      ctx.$error = data;
+      fragment = t ? t.content.cloneNode(true) : document.createDocumentFragment();
+    } else {
+      const t = this.content.querySelector('template[is="swc-success"]');
+      ctx.$value = data;
+      if (t) {
+        fragment = t.content.cloneNode(true);
+      } else {
+        const clone = this.content.cloneNode(true);
+        Array.from(clone.querySelectorAll('template[is="swc-loading"], template[is="swc-error"], template[is="swc-success"], template[is="swc-default"]')).forEach((tmp) => tmp.remove());
+        fragment = clone;
+      }
+    }
+    this.mount(fragment, ctx);
+  }
+  mount(fragment, ctx) {
+    const nodes = Array.from(fragment.childNodes);
+    const elements = nodes.filter((n) => n.nodeType === 1);
+    Object.assign(ctx, {
+      $nodes: nodes,
+      $elements: elements,
+      $firstNode: nodes[0],
+      $lastNode: nodes[nodes.length - 1],
+      $firstElement: elements[0],
+      $lastElement: elements[elements.length - 1]
+    });
+    this._executeCallback("on-clone-nodes", ctx);
+    nodes.forEach((node, nodeIndex) => {
+      if (node instanceof HTMLElement) {
+        node.__swc_host = this;
+      }
+      this._executeCallback("on-clone-node", {
+        ...ctx,
+        $node: node,
+        $nodeIndex: nodeIndex,
+        $isElement: node.nodeType === 1
+      });
+    });
+    this._nodes = nodes;
+    this.parentElement?.insertBefore(fragment, this.nextSibling);
+  }
+  _executeCallback(attrName, extraArgs) {
+    const script = this.getAttribute(attrName);
+    if (!script)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });
+    } catch (e) {
+      console.error(`[SwcAsync] Error in ${attrName}:`, e);
+    }
+  }
+  cleanup() {
+    this._nodes.forEach((n) => {
+      if (n.parentElement)
+        n.parentElement.removeChild(n);
+    });
+    this._nodes = [];
+  }
+  connectedCallback() {
+    this.refresh();
+  }
+  disconnectedCallback() {
+    this.cleanup();
+  }
+};
+__decorate([
+  changedAttribute("on-get-value"),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [String]),
+  __metadata("design:returntype", void 0)
+], SwcAsync.prototype, "refresh", null);
+SwcAsync = __decorate([
+  elementDefine({ name: "swc-async", extends: "template" })
+], SwcAsync);
+export {
+  SwcAsync
+};
+//# sourceMappingURL=SwcAsync.js.map

package/dist/esm/elements/SwcAsync.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/elements/SwcAsync.ts"],
+  "sourcesContent": ["import { elementDefine } from '../decorators/elementDefine';\nimport { changedAttribute } from '../decorators/changedAttribute';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core/function/FunctionUtils';\nimport { SwcLoading, SwcError, SwcSuccess, SwcDefault } from './SwcSubTemplates';\n\n@elementDefine({ name: 'swc-async', extends: 'template' })\nexport class SwcAsync extends HTMLTemplateElement {\n  private _nodes: Node[] = [];\n  private _currentPromise: Promise<any> | null = null;\n  private _value: any = null;\n\n  get value(): any {\n    return this._value;\n  }\n\n  set value(nv: any) {\n    if (nv instanceof Promise) {\n      this.handlePromise(nv);\n    } else {\n      this._value = nv;\n      this.render(nv === null ? 'default' : 'success', nv);\n    }\n  }\n\n  @changedAttribute('on-get-value')\n  private refresh(newValue?: string | null) {\n    const script = newValue !== undefined ? newValue : this.getAttribute('on-get-value');\n    if (!script) {\n      this.value = null; // Triggers default render\n      return;\n    }\n    if (!this.parentElement) return;\n\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      const result = FunctionUtils.executeReturn({\n        script,\n        context: this,\n        args: helperHostSet\n      });\n\n      if (result instanceof Promise) {\n        this.handlePromise(result);\n      } else {\n        this.value = result;\n      }\n    } catch (e) {\n      this.render('error', e);\n    }\n  }\n\n  private async handlePromise(promise: Promise<any>) {\n    this._currentPromise = promise;\n    this.render('loading');\n\n    try {\n      const result = await promise;\n      if (this._currentPromise !== promise) return;\n      this._value = result;\n      this.render('success', result);\n    } catch (e) {\n      if (this._currentPromise !== promise) return;\n      this.render('error', e);\n    }\n  }\n\n  private render(state: 'loading' | 'error' | 'success' | 'default', data?: any) {\n    this.cleanup();\n    if (!this.parentElement) return;\n\n    let fragment: DocumentFragment;\n    const ctx: any = {\n      $nodes: [],\n      $elements: [],\n      $state: state,\n      $value: null,\n      $error: null\n    };\n\n    if (state === 'default') {\n      const t = this.content.querySelector('template[is=\"swc-default\"]') as HTMLTemplateElement;\n      fragment = t ? (t.content.cloneNode(true) as DocumentFragment) : document.createDocumentFragment();\n    } else if (state === 'loading') {\n      const t = this.content.querySelector('template[is=\"swc-loading\"]') as HTMLTemplateElement;\n      fragment = t ? (t.content.cloneNode(true) as DocumentFragment) : document.createDocumentFragment();\n    } else if (state === 'error') {\n      const t = this.content.querySelector('template[is=\"swc-error\"]') as HTMLTemplateElement;\n      ctx.$error = data;\n      fragment = t ? (t.content.cloneNode(true) as DocumentFragment) : document.createDocumentFragment();\n    } else {\n      // Success\n      const t = this.content.querySelector('template[is=\"swc-success\"]') as HTMLTemplateElement;\n      ctx.$value = data;\n      if (t) {\n        fragment = t.content.cloneNode(true) as DocumentFragment;\n      } else {\n        const clone = this.content.cloneNode(true) as DocumentFragment;\n        Array.from(clone.querySelectorAll('template[is=\"swc-loading\"], template[is=\"swc-error\"], template[is=\"swc-success\"], template[is=\"swc-default\"]')).forEach(tmp => tmp.remove());\n        fragment = clone;\n      }\n    }\n\n    this.mount(fragment, ctx);\n  }\n\n  private mount(fragment: DocumentFragment, ctx: any) {\n    const nodes = Array.from(fragment.childNodes);\n    const elements = nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n\n    Object.assign(ctx, {\n      $nodes: nodes,\n      $elements: elements,\n      $firstNode: nodes[0],\n      $lastNode: nodes[nodes.length - 1],\n      $firstElement: elements[0],\n      $lastElement: elements[elements.length - 1]\n    });\n\n    // Execution Callbacks\n    this._executeCallback('on-clone-nodes', ctx);\n    nodes.forEach((node, nodeIndex) => {\n      if (node instanceof HTMLElement) {\n        (node as any).__swc_host = this;\n      }\n      this._executeCallback('on-clone-node', {\n        ...ctx,\n        $node: node,\n        $nodeIndex: nodeIndex,\n        $isElement: node.nodeType === 1\n      });\n    });\n\n    this._nodes = nodes;\n    this.parentElement?.insertBefore(fragment, this.nextSibling);\n  }\n\n  private _executeCallback(attrName: string, extraArgs: Record<string, any>) {\n    const script = this.getAttribute(attrName);\n    if (!script) return;\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });\n    } catch (e) {\n      console.error(`[SwcAsync] Error in ${attrName}:`, e);\n    }\n  }\n\n  private cleanup() {\n    this._nodes.forEach(n => {\n      if (n.parentElement) n.parentElement.removeChild(n);\n    });\n    this._nodes = [];\n  }\n\n  connectedCallback() {\n    this.refresh();\n  }\n\n  disconnectedCallback() {\n    this.cleanup();\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["SwcAsync"]
+}

package/dist/esm/elements/SwcChoose.js

@@ -0,0 +1,136 @@
+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);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = function(k, v) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { elementDefine } from "../decorators/elementDefine.js";
+import { changedAttribute } from "../decorators/changedAttribute.js";
+import { SwcUtils } from "../utils/Utils.js";
+import { FunctionUtils } from "@dooboostore/core/function/FunctionUtils";
+let SwcChoose = class SwcChoose2 extends HTMLTemplateElement {
+  constructor() {
+    super(...arguments);
+    this._nodes = [];
+    this._value = null;
+  }
+  get value() {
+    return this._value;
+  }
+  set value(nv) {
+    this._value = nv;
+    this.render();
+  }
+  _executeCallback(attrName, extraArgs) {
+    const script = this.getAttribute(attrName);
+    if (!script)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });
+    } catch (e) {
+      console.error(`[SwcChoose] Error in ${attrName}:`, e);
+    }
+  }
+  refresh(newValue) {
+    const script = newValue !== void 0 ? newValue : this.getAttribute("on-get-value");
+    if (!script) {
+      this.value = null;
+      return;
+    }
+    if (!this.parentElement)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      const result = FunctionUtils.executeReturn({
+        script,
+        context: this,
+        args: helperHostSet
+      });
+      this.value = result;
+    } catch (e) {
+      console.error("[SwcChoose] Error in on-get-value:", e);
+    }
+  }
+  render() {
+    this.cleanup();
+    if (!this.parentElement)
+      return;
+    const templates = Array.from(this.content.querySelectorAll("template"));
+    let selected = null;
+    let otherwise = null;
+    let defaultTmp = null;
+    for (const t of templates) {
+      const is = t.getAttribute("is");
+      if (is === "swc-when") {
+        const whenVal = t.getAttribute("value");
+        if (String(whenVal) === String(this._value)) {
+          selected = t;
+          break;
+        }
+      } else if (is === "swc-otherwise") {
+        otherwise = t;
+      } else if (is === "swc-default") {
+        defaultTmp = t;
+      }
+    }
+    const targetTemplate = (this._value == null ? defaultTmp : selected) || otherwise || defaultTmp;
+    if (targetTemplate) {
+      const clone = targetTemplate.content.cloneNode(true);
+      const nodes = Array.from(clone.childNodes);
+      const elements = nodes.filter((n) => n.nodeType === 1);
+      const ctx = {
+        $value: this._value,
+        $nodes: nodes,
+        $elements: elements,
+        $firstNode: nodes[0],
+        $lastNode: nodes[nodes.length - 1],
+        $firstElement: elements[0],
+        $lastElement: elements[elements.length - 1]
+      };
+      this._executeCallback("on-clone-nodes", ctx);
+      nodes.forEach((node, nodeIndex) => {
+        if (node instanceof HTMLElement) {
+          node.__swc_host = this;
+        }
+        this._executeCallback("on-clone-node", {
+          ...ctx,
+          $node: node,
+          $nodeIndex: nodeIndex,
+          $isElement: node.nodeType === 1
+        });
+      });
+      this._nodes = nodes;
+      this.parentElement.insertBefore(clone, this.nextSibling);
+    }
+  }
+  cleanup() {
+    this._nodes.forEach((n) => {
+      if (n.parentElement)
+        n.parentElement.removeChild(n);
+    });
+    this._nodes = [];
+  }
+  connectedCallback() {
+    this.refresh();
+  }
+  disconnectedCallback() {
+    this.cleanup();
+  }
+};
+__decorate([
+  changedAttribute("on-get-value"),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [String]),
+  __metadata("design:returntype", void 0)
+], SwcChoose.prototype, "refresh", null);
+SwcChoose = __decorate([
+  elementDefine({ name: "swc-choose", extends: "template" })
+], SwcChoose);
+export {
+  SwcChoose
+};
+//# sourceMappingURL=SwcChoose.js.map

package/dist/esm/elements/SwcChoose.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/elements/SwcChoose.ts"],
+  "sourcesContent": ["import { elementDefine } from '../decorators/elementDefine';\nimport { changedAttribute } from '../decorators/changedAttribute';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core/function/FunctionUtils';\nimport { SwcWhen, SwcOtherwise } from './SwcSubTemplates';\n\n@elementDefine({ name: 'swc-choose', extends: 'template' })\nexport class SwcChoose extends HTMLTemplateElement {\n  private _nodes: Node[] = [];\n  private _value: any = null;\n\n  get value(): any {\n    return this._value;\n  }\n\n  set value(nv: any) {\n    this._value = nv;\n    this.render();\n  }\n\n  private _executeCallback(attrName: string, extraArgs: Record<string, any>) {\n    const script = this.getAttribute(attrName);\n    if (!script) return;\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });\n    } catch (e) {\n      console.error(`[SwcChoose] Error in ${attrName}:`, e);\n    }\n  }\n\n  @changedAttribute('on-get-value')\n  private refresh(newValue?: string | null) {\n    const script = newValue !== undefined ? newValue : this.getAttribute('on-get-value');\n    if (!script) {\n      this.value = null;\n      return;\n    }\n    if (!this.parentElement) return;\n\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      const result = FunctionUtils.executeReturn({\n        script,\n        context: this,\n        args: helperHostSet\n      });\n      this.value = result;\n    } catch (e) {\n      console.error('[SwcChoose] Error in on-get-value:', e);\n    }\n  }\n\n  private render() {\n    this.cleanup();\n    if (!this.parentElement) return;\n\n    const templates = Array.from(this.content.querySelectorAll('template'));\n    let selected: HTMLTemplateElement | null = null;\n    let otherwise: HTMLTemplateElement | null = null;\n    let defaultTmp: HTMLTemplateElement | null = null;\n\n    for (const t of templates) {\n      const is = t.getAttribute('is');\n      if (is === 'swc-when') {\n        const whenVal = t.getAttribute('value');\n        if (String(whenVal) === String(this._value)) {\n          selected = t;\n          break;\n        }\n      } else if (is === 'swc-otherwise') {\n        otherwise = t;\n      } else if (is === 'swc-default') {\n        defaultTmp = t;\n      }\n    }\n\n    const targetTemplate = (this._value == null ? defaultTmp : selected) || otherwise || defaultTmp;\n    if (targetTemplate) {\n      const clone = targetTemplate.content.cloneNode(true) as DocumentFragment;\n      const nodes = Array.from(clone.childNodes);\n      const elements = nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n\n      const ctx = {\n        $value: this._value,\n        $nodes: nodes,\n        $elements: elements,\n        $firstNode: nodes[0],\n        $lastNode: nodes[nodes.length - 1],\n        $firstElement: elements[0],\n        $lastElement: elements[elements.length - 1]\n      };\n\n      // Execution Callbacks\n      this._executeCallback('on-clone-nodes', ctx);\n      nodes.forEach((node, nodeIndex) => {\n        if (node instanceof HTMLElement) {\n          (node as any).__swc_host = this;\n        }\n        this._executeCallback('on-clone-node', {\n          ...ctx,\n          $node: node,\n          $nodeIndex: nodeIndex,\n          $isElement: node.nodeType === 1\n        });\n      });\n\n      this._nodes = nodes;\n      this.parentElement.insertBefore(clone, this.nextSibling);\n    }\n  }\n\n  private cleanup() {\n    this._nodes.forEach(n => {\n      if (n.parentElement) n.parentElement.removeChild(n);\n    });\n    this._nodes = [];\n  }\n\n  connectedCallback() {\n    this.refresh();\n  }\n\n  disconnectedCallback() {\n    this.cleanup();\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["SwcChoose"]
+}

package/dist/esm/elements/SwcIf.js

@@ -0,0 +1,148 @@
+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);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = function(k, v) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+import { elementDefine } from "../decorators/elementDefine.js";
+import { changedAttribute } from "../decorators/changedAttribute.js";
+import { SwcUtils } from "../utils/Utils.js";
+import { FunctionUtils } from "@dooboostore/core/function/FunctionUtils";
+let SwcIf = class SwcIf2 extends HTMLTemplateElement {
+  constructor() {
+    super(...arguments);
+    this._nodes = [];
+    this._value = null;
+  }
+  get value() {
+    return this._value;
+  }
+  set value(nv) {
+    this._value = nv;
+    this.render();
+  }
+  _getTarget() {
+    const script = this.getAttribute("on-get-portal");
+    if (!script)
+      return null;
+    try {
+      const res = FunctionUtils.executeReturn({
+        script,
+        context: this,
+        args: SwcUtils.getHelperAndHostSet(window, this)
+      });
+      if (typeof res === "string")
+        return document.querySelector(res);
+      if (res instanceof Node)
+        return res;
+    } catch (e) {
+      console.error("[SwcIf] Portal target error:", e);
+    }
+    return null;
+  }
+  _executeCallback(attrName, extraArgs) {
+    const script = this.getAttribute(attrName);
+    if (!script)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });
+    } catch (e) {
+      console.error(`[SwcIf] Error in ${attrName}:`, e);
+    }
+  }
+  refresh(newValue) {
+    const script = newValue !== void 0 ? newValue : this.getAttribute("on-get-value");
+    if (!script) {
+      this.value = null;
+      return;
+    }
+    if (!this.parentElement)
+      return;
+    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);
+    try {
+      const result = FunctionUtils.executeReturn({
+        script,
+        context: this,
+        args: helperHostSet
+      });
+      this.value = result;
+    } catch (e) {
+      console.error("[SwcIf] Error in on-get-value:", e);
+      this.value = null;
+    }
+  }
+  render() {
+    this.cleanup();
+    if (!this.parentElement)
+      return;
+    let fragment = null;
+    const ctx = { $value: this._value, $nodes: [], $elements: [] };
+    if (this._value) {
+      const clone = this.content.cloneNode(true);
+      Array.from(clone.querySelectorAll('template[is="swc-default"]')).forEach((t) => t.remove());
+      fragment = clone;
+    } else {
+      const t = this.content.querySelector('template[is="swc-default"]');
+      if (t)
+        fragment = t.content.cloneNode(true);
+    }
+    if (fragment) {
+      this.mount(fragment, ctx);
+    }
+  }
+  mount(fragment, ctx) {
+    const nodes = Array.from(fragment.childNodes);
+    const elements = nodes.filter((n) => n.nodeType === 1);
+    Object.assign(ctx, {
+      $nodes: nodes,
+      $elements: elements,
+      $firstNode: nodes[0],
+      $lastNode: nodes[nodes.length - 1],
+      $firstElement: elements[0],
+      $lastElement: elements[elements.length - 1]
+    });
+    this._executeCallback("on-clone-nodes", ctx);
+    nodes.forEach((node, nodeIndex) => {
+      if (node instanceof HTMLElement)
+        node.__swc_host = this;
+      this._executeCallback("on-clone-node", { ...ctx, $node: node, $nodeIndex: nodeIndex, $isElement: node.nodeType === 1 });
+    });
+    this._nodes = nodes;
+    const target = this._getTarget();
+    if (target) {
+      target.appendChild(fragment);
+    } else {
+      this.parentElement?.insertBefore(fragment, this.nextSibling);
+    }
+  }
+  cleanup() {
+    this._nodes.forEach((n) => {
+      if (n.parentElement)
+        n.parentElement.removeChild(n);
+    });
+    this._nodes = [];
+  }
+  connectedCallback() {
+    this.refresh();
+  }
+  disconnectedCallback() {
+    this.cleanup();
+  }
+};
+__decorate([
+  changedAttribute("on-get-value"),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [String]),
+  __metadata("design:returntype", void 0)
+], SwcIf.prototype, "refresh", null);
+SwcIf = __decorate([
+  elementDefine({ name: "swc-if", extends: "template" })
+], SwcIf);
+export {
+  SwcIf
+};
+//# sourceMappingURL=SwcIf.js.map

package/dist/esm/elements/SwcIf.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/elements/SwcIf.ts"],
+  "sourcesContent": ["import { elementDefine } from '../decorators/elementDefine';\nimport { changedAttribute } from '../decorators/changedAttribute';\nimport { SwcUtils } from '../utils/Utils';\nimport { FunctionUtils } from '@dooboostore/core/function/FunctionUtils';\n\n@elementDefine({ name: 'swc-if', extends: 'template' })\nexport class SwcIf extends HTMLTemplateElement {\n  private _nodes: Node[] = [];\n  private _value: any = null;\n\n  get value(): any {\n    return this._value;\n  }\n\n  set value(nv: any) {\n    this._value = nv;\n    this.render();\n  }\n\n  private _getTarget(): Element | DocumentFragment | null {\n    const script = this.getAttribute('on-get-portal');\n    if (!script) return null;\n    try {\n      const res = FunctionUtils.executeReturn({\n        script,\n        context: this,\n        args: SwcUtils.getHelperAndHostSet(window, this)\n      });\n      if (typeof res === 'string') return document.querySelector(res);\n      if (res instanceof Node) return res as any;\n    } catch (e) {\n      console.error('[SwcIf] Portal target error:', e);\n    }\n    return null;\n  }\n\n  private _executeCallback(attrName: string, extraArgs: Record<string, any>) {\n    const script = this.getAttribute(attrName);\n    if (!script) return;\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      FunctionUtils.execute({ script, context: this, args: { ...helperHostSet, ...extraArgs } });\n    } catch (e) {\n      console.error(`[SwcIf] Error in ${attrName}:`, e);\n    }\n  }\n\n  @changedAttribute('on-get-value')\n  private refresh(newValue?: string | null) {\n    const script = newValue !== undefined ? newValue : this.getAttribute('on-get-value');\n    if (!script) {\n      this.value = null;\n      return;\n    }\n    if (!this.parentElement) return;\n\n    const helperHostSet = SwcUtils.getHelperAndHostSet(window, this);\n    try {\n      const result = FunctionUtils.executeReturn({\n        script,\n        context: this,\n        args: helperHostSet\n      });\n      this.value = result;\n    } catch (e) {\n      console.error('[SwcIf] Error in on-get-value:', e);\n      this.value = null;\n    }\n  }\n\n  private render() {\n    this.cleanup();\n    if (!this.parentElement) return;\n\n    let fragment: DocumentFragment | null = null;\n    const ctx: any = { $value: this._value, $nodes: [], $elements: [] };\n\n    if (this._value) {\n      const clone = this.content.cloneNode(true) as DocumentFragment;\n      Array.from(clone.querySelectorAll('template[is=\"swc-default\"]')).forEach(t => t.remove());\n      fragment = clone;\n    } else {\n      const t = this.content.querySelector('template[is=\"swc-default\"]') as HTMLTemplateElement;\n      if (t) fragment = t.content.cloneNode(true) as DocumentFragment;\n    }\n\n    if (fragment) {\n      this.mount(fragment, ctx);\n    }\n  }\n\n  private mount(fragment: DocumentFragment, ctx: any) {\n    const nodes = Array.from(fragment.childNodes);\n    const elements = nodes.filter(n => n.nodeType === 1) as HTMLElement[];\n\n    Object.assign(ctx, {\n      $nodes: nodes,\n      $elements: elements,\n      $firstNode: nodes[0],\n      $lastNode: nodes[nodes.length - 1],\n      $firstElement: elements[0],\n      $lastElement: elements[elements.length - 1]\n    });\n\n    this._executeCallback('on-clone-nodes', ctx);\n    nodes.forEach((node, nodeIndex) => {\n      if (node instanceof HTMLElement) (node as any).__swc_host = this;\n      this._executeCallback('on-clone-node', { ...ctx, $node: node, $nodeIndex: nodeIndex, $isElement: node.nodeType === 1 });\n    });\n\n    this._nodes = nodes;\n    const target = this._getTarget();\n    if (target) {\n      target.appendChild(fragment);\n    } else {\n      this.parentElement?.insertBefore(fragment, this.nextSibling);\n    }\n  }\n\n  private cleanup() {\n    this._nodes.forEach(n => {\n      if (n.parentElement) n.parentElement.removeChild(n);\n    });\n    this._nodes = [];\n  }\n\n  connectedCallback() {\n    this.refresh();\n  }\n\n  disconnectedCallback() {\n    this.cleanup();\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["SwcIf"]
+}