@dooboostore/simple-web-component 1.0.33 → 1.0.35

package/dist/esm-bundle/dooboostore-simple-web-component.esm.js

@@ -5727,6 +5727,11 @@ var Expression;
 })(Expression || (Expression = {}));
 
 // ../core/dist/esm/expression/ActionExpression.js
+var DEFAULT_EXPRESSION_CONFIG = {
+  "callReturn": { start: "{{=", end: "}}" },
+  "call": { start: "{{@", end: "}}" },
+  "replace": { start: "{{", end: "}}" }
+};
 var ActionExpression = class {
   constructor(value, config) {
     this.originalTemplate = value || "";
@@ -5740,12 +5745,19 @@ var ActionExpression = class {
     }
     this.maskingTemplate = value;
     this.currentTemplate = value;
-    if (config?.wrapExpression) {
-      this.processWrapExpressions(this.currentTemplate, config.wrapExpression);
+    const exprConfig = {
+      "callReturn": config?.expression?.["callReturn"] || DEFAULT_EXPRESSION_CONFIG["callReturn"],
+      "call": config?.expression?.call || DEFAULT_EXPRESSION_CONFIG.call,
+      "replace": config?.expression?.replace || DEFAULT_EXPRESSION_CONFIG.replace
+    };
+    const types = ["callReturn", "call", "replace"];
+    types.sort((a, b) => exprConfig[b].start.length - exprConfig[a].start.length);
+    for (const type of types) {
+      const marker = exprConfig[type];
+      if (marker) {
+        this.processExpressionType(type, marker.start, marker.end);
+      }
     }
-    this.processCallReturnExpressions(this.currentTemplate);
-    this.processCallExpressions(this.currentTemplate);
-    this.processReplaceExpressions(this.currentTemplate);
     this.sortExpressionsByPosition();
     this.maskingTemplate = this.currentTemplate;
   }
@@ -5756,45 +5768,17 @@ var ActionExpression = class {
     });
     this.expressions.sort((a, b) => (a.index ?? 0) - (b.index ?? 0));
   }
-  processWrapExpressions(value, wrapExpression) {
-    const wrapChar = wrapExpression.trim();
-    const escapedWrap = wrapChar.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-    const wrappedCallReturnRegex = new RegExp(`${escapedWrap}\\{\\{=\\s*(.+?)\\s*\\}\\}${escapedWrap}`, "g");
-    let match;
-    while ((match = wrappedCallReturnRegex.exec(value)) !== null) {
-      this.addExpression(match, "call-return", wrapChar);
-    }
-    const wrappedCallRegex = new RegExp(`${escapedWrap}\\{\\{@\\s*(.+?)\\s*\\}\\}${escapedWrap}`, "g");
-    while ((match = wrappedCallRegex.exec(value)) !== null) {
-      this.addExpression(match, "call", wrapChar);
-    }
-    const wrappedReplaceRegex = new RegExp(`${escapedWrap}\\{\\{(?![=@])\\s*(.+?)\\s*\\}\\}${escapedWrap}`, "g");
-    while ((match = wrappedReplaceRegex.exec(value)) !== null) {
-      this.addExpression(match, "replace", wrapChar);
-    }
-  }
-  processCallReturnExpressions(value) {
-    const callReturnRegex = /(?<![a-zA-Z0-9$_@#.])\{\{=\s*(.+?)\s*\}\}(?![a-zA-Z0-9$_@#.])/g;
-    let match;
-    while ((match = callReturnRegex.exec(value)) !== null) {
-      this.addExpression(match, "call-return");
-    }
-  }
-  processCallExpressions(value) {
-    const callRegex = /(?<![a-zA-Z0-9$_@#.])\{\{@\s*(.+?)\s*\}\}(?![a-zA-Z0-9$_@#.])/g;
+  processExpressionType(type, start, end) {
+    const escapedStart = start.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    const escapedEnd = end.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    const regex = new RegExp(`${escapedStart}\\s*([\\s\\S]+?)\\s*${escapedEnd}`, "g");
     let match;
-    while ((match = callRegex.exec(value)) !== null) {
-      this.addExpression(match, "call");
+    const valueToMatch = this.currentTemplate;
+    while ((match = regex.exec(valueToMatch)) !== null) {
+      this.addExpression(match, type);
     }
   }
-  processReplaceExpressions(value) {
-    const replaceRegex = /(?<![a-zA-Z0-9$_@#.])\{\{(?![=@])\s*(.+?)\s*\}\}(?![a-zA-Z0-9$_@#.])/g;
-    let match;
-    while ((match = replaceRegex.exec(value)) !== null) {
-      this.addExpression(match, "replace");
-    }
-  }
-  addExpression(match, type, wrap) {
+  addExpression(match, type) {
     const id = Math.random().toString(36).substr(2, 9);
     const original = match[0];
     const rawScript = match[1];
@@ -5809,13 +5793,9 @@ var ActionExpression = class {
       original,
       script: rawScript.trim(),
       expressionStart,
-      expressionEnd,
-      ...wrap && { wrap }
+      expressionEnd
     });
   }
-  /**
-   * 구현 메서드
-   */
   replace(idOrExpr, valueOrCallback) {
     const id = typeof idOrExpr === "string" ? idOrExpr : idOrExpr.id;
     let expr;
@@ -5831,9 +5811,6 @@ var ActionExpression = class {
     }
     return this.getUnprocessedTemplate();
   }
-  /**
-   * 구현 메서드
-   */
   getExpressions(typeOrOptions) {
     if (!typeOrOptions) {
       return this.expressions;
@@ -5844,13 +5821,9 @@ var ActionExpression = class {
     const options = typeOrOptions;
     return this.expressions.filter((expr) => {
       if (options.type && expr.type !== options.type) return false;
-      if ("wrap" in options && expr.wrap !== options.wrap) return false;
       return true;
     });
   }
-  /**
-   * 구현 메서드
-   */
   getFirstExpression(typeOrOptions) {
     if (!typeOrOptions) {
       return this.getExpressions()[0];
@@ -5860,28 +5833,15 @@ var ActionExpression = class {
     }
     return this.getExpressions(typeOrOptions)[0];
   }
-  /**
-   * 원본 템플릿을 반환합니다.
-   */
   getOriginalTemplate() {
     return this.originalTemplate;
   }
-  /**
-   * 마스킹 처리된 템플릿을 반환합니다.
-   */
   getMaskingTemplate() {
     return this.maskingTemplate;
   }
-  /**
-   * 현재 처리 상태의 템플릿을 반환합니다.
-   */
   getCurrentTemplate() {
     return this.currentTemplate;
   }
-  /**
-   * 미처리된 마커들을 원본으로 복원한 템플릿을 반환합니다.
-   * replace() 호출 후 처리되지 않은 표현식들을 원본 형태로 되돌립니다.
-   */
   getUnprocessedTemplate() {
     let result = this.currentTemplate;
     for (const expr of this.expressions) {
@@ -5944,17 +5904,16 @@ function createLifecycleDecorator(metadataKey) {
   };
 }
 var onInitialize = createLifecycleDecorator(ON_INITIALIZE_METADATA_KEY);
-var onBeforeConnected = createLifecycleDecorator(ON_BEFORE_CONNECTED_METADATA_KEY);
-var onAfterConnected = createLifecycleDecorator(ON_AFTER_CONNECTED_METADATA_KEY);
-var onConnected = onAfterConnected;
-var onBeforeDisconnected = createLifecycleDecorator(ON_BEFORE_DISCONNECTED_METADATA_KEY);
-var onAfterDisconnected = createLifecycleDecorator(ON_AFTER_DISCONNECTED_METADATA_KEY);
-var onDisconnected = onAfterDisconnected;
-var onBeforeAdopted = createLifecycleDecorator(ON_BEFORE_ADOPTED_METADATA_KEY);
-var onAfterAdopted = createLifecycleDecorator(ON_AFTER_ADOPTED_METADATA_KEY);
-var onAdopted = onAfterAdopted;
+var onConnectedBefore = createLifecycleDecorator(ON_BEFORE_CONNECTED_METADATA_KEY);
+var onConnectedAfter = createLifecycleDecorator(ON_AFTER_CONNECTED_METADATA_KEY);
+var onConnected = onConnectedAfter;
+var onDisconnectedBefore = createLifecycleDecorator(ON_BEFORE_DISCONNECTED_METADATA_KEY);
+var onDisconnectedAfter = createLifecycleDecorator(ON_AFTER_DISCONNECTED_METADATA_KEY);
+var onDisconnected = onDisconnectedAfter;
+var onAdoptedBefore = createLifecycleDecorator(ON_BEFORE_ADOPTED_METADATA_KEY);
+var onAdoptedAfter = createLifecycleDecorator(ON_AFTER_ADOPTED_METADATA_KEY);
+var onAdopted = onAdoptedAfter;
 var onAddEventListener = createLifecycleDecorator(ON_ADD_EVENT_LISTENER_METADATA_KEY);
-var onConnectedSwcApp = createLifecycleDecorator(ON_CONNECTED_SWC_APP_METADATA_KEY);
 function onConnectedInnerHtml(arg1, arg2, arg3) {
   const decorator = (options, target, propertyKey) => {
     const constructor = target.constructor;
@@ -6110,13 +6069,25 @@ var htmlArticleElement = (options) => {
 };
 var SwcUtils;
 ((SwcUtils2) => {
+  SwcUtils2.getParentContainer = (e) => {
+    return e.parentElement ?? e.getRootNode();
+  };
   SwcUtils2.parsePathPatternsSetAttributeString = (pathPattern, path) => {
     return JSON.stringify(SwcUtils2.parsePathPatternsSet(pathPattern, path)).replace(/"/g, "'");
   };
-  SwcUtils2.parsePathPatternsSet = (pathPattern, path) => {
+  SwcUtils2.parsePathPatternsSet = (pathPattern, urlAndRouter) => {
+    urlAndRouter ?? (urlAndRouter = "/");
+    const p = typeof urlAndRouter === "string" ? urlAndRouter : urlAndRouter.value.url;
+    const searchParams = new URLSearchParams();
+    const qs = p.split("?")[1];
+    qs?.split("&").forEach((it) => {
+      const [k, v] = it.split("=");
+      searchParams.set(k, v);
+    });
     return {
-      path,
-      pathData: SwcUtils2.parsePathPatterns(pathPattern, path)
+      path: p,
+      searchParams,
+      pathData: SwcUtils2.parsePathPatterns(pathPattern, p)
     };
   };
   SwcUtils2.parsePathPatterns = (pathPattern, path) => {
@@ -6157,7 +6128,8 @@ var SwcUtils;
     return current;
   };
   SwcUtils2.findNearestSwcHost = (el) => {
-    if (el.__swc_host) return el.__swc_host;
+    const el1 = el;
+    if (el1.__swc_host) return el1.__swc_host;
     let current = el.parentElement || el.getRootNode?.()?.host;
     const doc = el.ownerDocument;
     const win = doc?.defaultView || (typeof window !== "undefined" ? window : void 0);
@@ -6187,8 +6159,8 @@ var SwcUtils;
     return (0, SwcUtils2.findNearestSwcHost)(el);
   };
   SwcUtils2.getAppHosts = (el) => {
-    const hosts = (0, SwcUtils2.getHosts)(el);
-    return hosts.filter((host2) => host2.tagName.toLowerCase() === "swc-app" || host2.getAttribute("is")?.startsWith("swc-app-"));
+    const hosts = SwcUtils2.findAllParentAppHostsDirect(el);
+    return hosts;
   };
   SwcUtils2.getAppHost = (el) => {
     const appHosts = (0, SwcUtils2.getAppHosts)(el);
@@ -6201,6 +6173,10 @@ var SwcUtils;
   };
   SwcUtils2.findAllParentAppHostsDirect = (el) => {
     const appHosts = [];
+    const w = el.ownerDocument?.defaultView || (typeof window !== "undefined" ? window : void 0);
+    if (!w) {
+      return appHosts;
+    }
     let current = el;
     while (current) {
       const isAppHost = current.tagName.toLowerCase() === "swc-app" || current.getAttribute("is")?.startsWith("swc-app-");
@@ -6211,7 +6187,7 @@ var SwcUtils;
         current = current.parentElement;
       } else {
         const root = current.getRootNode();
-        if (root instanceof ShadowRoot) {
+        if (w.ShadowRoot && root instanceof w.ShadowRoot) {
           current = root.host;
         } else {
           break;
@@ -6244,6 +6220,7 @@ var SwcUtils;
       $hosts,
       $firstHost,
       $lastHost: $parentHost,
+      $templateHost: el.__swc_template_host,
       $appHost,
       $appHosts,
       $firstAppHost,
@@ -6286,54 +6263,67 @@ function emitCustomEvent(selectorOrTarget, type, options = {}) {
     }
     list.push({ propertyKey, selector: selectorOrTarget, type, options: fullOptions });
     const original = descriptor.value;
-    descriptor.value = async function(...args) {
+    descriptor.value = function(...args) {
       ensureInit(this);
-      const detail = await original.apply(this, args);
-      const event = new CustomEvent(type, {
-        detail,
-        bubbles: fullOptions.bubbles,
-        composed: fullOptions.composed,
-        cancelable: fullOptions.cancelable
-      });
-      const hostSet = SwcUtils.getHostSet(this);
-      const conf = getElementConfig(this);
-      const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
-      const eventTargets = [];
-      if (selectorOrTarget === ":window") eventTargets.push(currentWin);
-      else if (selectorOrTarget === ":document") eventTargets.push(currentWin.document);
-      else if (selectorOrTarget === ":parentHost") {
-        if (hostSet.$parentHost) eventTargets.push(hostSet.$parentHost);
-      } else if (selectorOrTarget === ":appHost") {
-        if (hostSet.$appHost) eventTargets.push(hostSet.$appHost);
-      } else if (selectorOrTarget === ":firstHost") {
-        if (hostSet.$firstHost) eventTargets.push(hostSet.$firstHost);
-      } else if (selectorOrTarget === ":lastHost") {
-        if (hostSet.$lastHost) eventTargets.push(hostSet.$lastHost);
-      } else if (selectorOrTarget === ":firstAppHost") {
-        if (hostSet.$firstAppHost) eventTargets.push(hostSet.$firstAppHost);
-      } else if (selectorOrTarget === ":lastAppHost") {
-        if (hostSet.$lastAppHost) eventTargets.push(hostSet.$lastAppHost);
-      } else if (selectorOrTarget === ":hosts") {
-        hostSet.$hosts.forEach((h) => eventTargets.push(h));
-      } else if (selectorOrTarget === ":appHosts") {
-        hostSet.$appHosts.forEach((h) => eventTargets.push(h));
-      } else if (selectorOrTarget === ":host" || !selectorOrTarget) eventTargets.push(this);
-      else {
-        const r = fullOptions.root || "auto";
-        const searchRoots = [];
-        if (r === "auto") searchRoots.push(this.shadowRoot || this);
-        else if (r === "light") searchRoots.push(this);
-        else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
-        else if (r === "all") {
-          searchRoots.push(this);
-          if (this.shadowRoot) searchRoots.push(this.shadowRoot);
+      const res = original.apply(this, args);
+      const handleResult = (detail) => {
+        const event = new CustomEvent(type, {
+          detail,
+          bubbles: fullOptions.bubbles,
+          composed: fullOptions.composed,
+          cancelable: fullOptions.cancelable
+        });
+        const hostSet = SwcUtils.getHostSet(this);
+        const conf = getElementConfig(this);
+        const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
+        const eventTargets = [];
+        if (selectorOrTarget === ":window") eventTargets.push(currentWin);
+        else if (selectorOrTarget === ":document") eventTargets.push(currentWin.document);
+        else if (selectorOrTarget === ":parentHost") {
+          if (hostSet.$parentHost) eventTargets.push(hostSet.$parentHost);
+        } else if (selectorOrTarget === ":appHost") {
+          if (hostSet.$appHost) eventTargets.push(hostSet.$appHost);
+        } else if (selectorOrTarget === ":firstHost") {
+          if (hostSet.$firstHost) eventTargets.push(hostSet.$firstHost);
+        } else if (selectorOrTarget === ":lastHost") {
+          if (hostSet.$lastHost) eventTargets.push(hostSet.$lastHost);
+        } else if (selectorOrTarget === ":firstAppHost") {
+          if (hostSet.$firstAppHost) eventTargets.push(hostSet.$firstAppHost);
+        } else if (selectorOrTarget === ":lastAppHost") {
+          if (hostSet.$lastAppHost) eventTargets.push(hostSet.$lastAppHost);
+        } else if (selectorOrTarget === ":hosts") {
+          hostSet.$hosts.forEach((h) => eventTargets.push(h));
+        } else if (selectorOrTarget === ":appHosts") {
+          hostSet.$appHosts.forEach((h) => eventTargets.push(h));
+        } else if (selectorOrTarget === ":host" || !selectorOrTarget) {
+          eventTargets.push(this);
+        } else {
+          const r = fullOptions.root || "auto";
+          const searchRoots = [];
+          if (r === "auto") searchRoots.push(this.shadowRoot || this);
+          else if (r === "light") searchRoots.push(this);
+          else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
+          else if (r === "all") {
+            searchRoots.push(this);
+            if (this.shadowRoot) searchRoots.push(this.shadowRoot);
+          }
+          searchRoots.forEach((sr) => {
+            sr.querySelectorAll(selectorOrTarget).forEach((el) => eventTargets.push(el));
+          });
         }
-        searchRoots.forEach((sr) => {
-          sr.querySelectorAll(selectorOrTarget).forEach((el) => eventTargets.push(el));
+        eventTargets.forEach((t) => {
+          if (fullOptions.filter && !fullOptions.filter(t, detail, { currentThis: this, helper: hostSet })) {
+            return;
+          }
+          t.dispatchEvent(event);
         });
+        return detail;
+      };
+      if (res instanceof Promise) {
+        return res.then(handleResult);
+      } else {
+        return handleResult(res);
       }
-      eventTargets.forEach((t) => t.dispatchEvent(event));
-      return detail;
     };
   };
 }
@@ -6341,30 +6331,41 @@ var getEmitCustomEventMetadataList = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
   return ReflectUtils.getMetadata(EMIT_CUSTOM_EVENT_METADATA_KEY, constructor);
 };
-function emitCustomEventHost(type, options = {}) {
-  if (!options.attributeName) {
-    options.attributeName = `on-emit-${type}`;
+function emitCustomEventHost(type, optionsOrAttributeaName) {
+  if (optionsOrAttributeaName && typeof optionsOrAttributeaName === "string") {
+    return emitCustomEventHost(type, { attributeName: optionsOrAttributeaName });
+  } else if (optionsOrAttributeaName && typeof optionsOrAttributeaName === "object") {
+    if (!optionsOrAttributeaName.attributeName) {
+      optionsOrAttributeaName.attributeName = `on-emit-${type}`;
+    }
+    return emitCustomEvent(":host", type, optionsOrAttributeaName);
+  } else {
+    return emitCustomEvent(":host", type, { attributeName: `on-emit-${type}` });
   }
-  return emitCustomEvent(":host", type, options);
 }
 
 // src/decorators/changedAttributeHost.ts
 var ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol.for("simple-web-component:on-attribute-changed");
-function changedAttributeHost(attributeName) {
+var convertValue = (val, type) => {
+  if (val === null || val === void 0) return val;
+  if (type === Number) return Number(val);
+  if (type === Boolean) return val === "false" || val === "0" ? false : true;
+  return val;
+};
+function changedAttributeHost(attributeName, options = {}) {
   return (target, propertyKey) => {
     const constructor = target.constructor;
-    let meta = ReflectUtils.getOwnMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);
-    if (!meta) {
-      meta = /* @__PURE__ */ new Map();
-      ReflectUtils.defineMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, meta, constructor);
+    let metaList = ReflectUtils.getOwnMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);
+    if (!metaList) {
+      metaList = [];
+      ReflectUtils.defineMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, metaList, constructor);
     }
     const name = attributeName || String(propertyKey);
-    let methods = meta.get(name);
-    if (!methods) {
-      methods = [];
-      meta.set(name, methods);
-    }
-    if (!methods.includes(propertyKey)) methods.push(propertyKey);
+    metaList.push({
+      attributeName: name,
+      propertyKey,
+      options
+    });
   };
 }
 var getChangedAttributeMetadata = (target) => {
@@ -6372,7 +6373,21 @@ var getChangedAttributeMetadata = (target) => {
   return ReflectUtils.getMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor);
 };
 var findAllAttributeChangedMetadata = (target) => {
-  return ReflectUtils.findAllMapMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, target);
+  const constructor = target instanceof Function ? target : target.constructor;
+  const metaList = ReflectUtils.findAllMetadata(ON_ATTRIBUTE_CHANGED_METADATA_KEY, constructor) || [];
+  const result = /* @__PURE__ */ new Map();
+  metaList.forEach((meta) => {
+    meta.forEach((item) => {
+      if (!result.has(item.attributeName)) {
+        result.set(item.attributeName, []);
+      }
+      result.get(item.attributeName).push(item);
+    });
+  });
+  return result;
+};
+var convertAttributeValue = (val, type) => {
+  return convertValue(val, type);
 };
 
 // src/decorators/applyAttribute.ts
@@ -6398,70 +6413,80 @@ function createAttributeDecorator(action) {
         options: { ...finalOptions, name: attributeName }
       });
       const original = descriptor.value;
-      descriptor.value = async function(...args) {
+      descriptor.value = function(...args) {
         ensureInit(this);
-        const res = await original.apply(this, args);
-        if (res !== void 0) {
-          const win = this.ownerDocument?.defaultView || window;
-          const host2 = this;
-          const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
-          const r = finalOptions.root || "auto";
-          const targetEls = [];
-          const applyRoot = (t) => {
-            if (!t || !(t instanceof win.HTMLElement)) return;
-            targetEls.push(t);
-          };
-          if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-          else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-          else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-          else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-          else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-          else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-          else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-          else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-          else if (selector === ":host" || !selector) applyRoot(host2);
-          else {
-            const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
-            if (targetRoot) {
-              const found = targetRoot.querySelectorAll(selector);
-              if (found) targetEls.push(...Array.from(found));
+        const res = original.apply(this, args);
+        const handleResult = (resolvedValue) => {
+          if (resolvedValue !== void 0) {
+            const win = this.ownerDocument?.defaultView || window;
+            const host2 = this;
+            const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
+            const r = finalOptions.root || "auto";
+            const targetEls = [];
+            const applyRoot = (t) => {
+              if (!t || !(t instanceof win.HTMLElement)) return;
+              targetEls.push(t);
+            };
+            if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
+            else if (selector === ":appHost") applyRoot(hostSet.$appHost);
+            else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
+            else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
+            else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
+            else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
+            else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
+            else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
+            else if (selector === ":host" || !selector) applyRoot(host2);
+            else {
+              const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
+              if (targetRoot) {
+                const found = targetRoot.querySelectorAll(selector);
+                if (found) targetEls.push(...Array.from(found));
+              }
             }
-          }
-          targetEls.forEach((targetEl) => {
-            const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
-            if (action === "set" || action === "update") {
-              if (attributeName) {
-                if (resolvedRes === null || resolvedRes === void 0 || resolvedRes === false) {
+            targetEls.forEach((targetEl) => {
+              if (finalOptions.filter && !finalOptions.filter(targetEl, resolvedValue, { currentThis: this, helper: hostSet })) {
+                return;
+              }
+              const resolvedRes = typeof resolvedValue === "function" ? resolvedValue(targetEl, hostSet) : resolvedValue;
+              if (action === "set" || action === "update") {
+                if (attributeName) {
+                  if (resolvedRes === null || resolvedRes === void 0 || resolvedRes === false) {
+                    targetEl.removeAttribute(attributeName);
+                  } else {
+                    targetEl.setAttribute(attributeName, resolvedRes === true ? "" : String(resolvedRes));
+                  }
+                } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([attr, val]) => {
+                    const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
+                    if (finalVal === null || finalVal === void 0 || finalVal === false) {
+                      targetEl.removeAttribute(attr);
+                    } else {
+                      targetEl.setAttribute(attr, finalVal === true ? "" : String(finalVal));
+                    }
+                  });
+                }
+              } else if (action === "remove") {
+                if (attributeName) {
                   targetEl.removeAttribute(attributeName);
+                } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([attr, val]) => {
+                    const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
+                    if (shouldRemove) targetEl.removeAttribute(attr);
+                  });
                 } else {
-                  targetEl.setAttribute(attributeName, resolvedRes === true ? "" : String(resolvedRes));
+                  const attrs = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
+                  attrs.forEach((a) => targetEl.removeAttribute(String(a)));
                 }
-              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([attr, val]) => {
-                  const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
-                  if (finalVal === null || finalVal === void 0 || finalVal === false) {
-                    targetEl.removeAttribute(attr);
-                  } else {
-                    targetEl.setAttribute(attr, finalVal === true ? "" : String(finalVal));
-                  }
-                });
               }
-            } else if (action === "remove") {
-              if (attributeName) {
-                targetEl.removeAttribute(attributeName);
-              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([attr, val]) => {
-                  const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
-                  if (shouldRemove) targetEl.removeAttribute(attr);
-                });
-              } else {
-                const attrs = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
-                attrs.forEach((a) => targetEl.removeAttribute(String(a)));
-              }
-            }
-          });
+            });
+          }
+          return resolvedValue;
+        };
+        if (res instanceof Promise) {
+          return res.then(handleResult);
+        } else {
+          return handleResult(res);
         }
-        return res;
       };
       return descriptor;
     };
@@ -7759,7 +7784,7 @@ var handleGlobalSwcEvent = async (event) => {
   }
 };
 function buildEnv(configWindow) {
-  const win = configWindow || (typeof window !== "undefined" ? window : void 0);
+  const win = configWindow;
   const doc = win?.document;
   const builtInTagMap = /* @__PURE__ */ new Map();
   for (const [cls, tag] of HTML_TAG_ENTRIES) {
@@ -7798,7 +7823,7 @@ var setupPrototype = (proto) => {
       const aConf = getElementConfig(ancestors[i]);
       if (aConf?.window) return aConf.window;
     }
-    return typeof window !== "undefined" ? window : void 0;
+    return getElementConfig(this).window ?? (typeof window !== "undefined" ? window : void 0);
   };
   proto._invokeLifecycleMethod = function(methodName, hostSet, extraArgs = []) {
     ensureInit(this);
@@ -7807,7 +7832,13 @@ var setupPrototype = (proto) => {
     const app = useHostSet?.$appHost?.simpleApplication;
     if (app) {
       const otherStorage = /* @__PURE__ */ new Map();
-      const situations = new SituationTypeContainers([new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://HOSTSET" /* HOST_SET */, data: useHostSet }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://APPHOST" /* APP_HOST */, data: useHostSet.$appHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://APPHOSTS" /* APP_HOSTS */, data: useHostSet.$appHosts }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://HOST" /* HOST */, data: useHostSet.$host }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://HOSTS" /* HOSTS */, data: useHostSet.$hosts }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://FIRSTHOST" /* FIRST_HOST */, data: useHostSet.$firstHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://LASTHOST" /* LAST_HOST */, data: useHostSet.$lastHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://FIRSTAPPHOST" /* FIRST_APP_HOST */, data: useHostSet.$firstAppHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://LASTAPPHOST" /* LAST_APP_HOST */, data: useHostSet.$lastAppHost })]);
+      const situations = new SituationTypeContainers([new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://HOSTSET" /* HOST_SET */, data: useHostSet }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://APPHOST" /* APP_HOST */, data: useHostSet.$appHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://APPHOSTS" /* APP_HOSTS */, data: useHostSet.$appHosts }), new SituationTypeContainer({
+        situationType: "SIMPLE_WEB_COMPONENT://HOST" /* HOST */,
+        data: useHostSet.$host
+      }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://HOSTS" /* HOSTS */, data: useHostSet.$hosts }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://FIRSTHOST" /* FIRST_HOST */, data: useHostSet.$firstHost }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://LASTHOST" /* LAST_HOST */, data: useHostSet.$lastHost }), new SituationTypeContainer({
+        situationType: "SIMPLE_WEB_COMPONENT://FIRSTAPPHOST" /* FIRST_APP_HOST */,
+        data: useHostSet.$firstAppHost
+      }), new SituationTypeContainer({ situationType: "SIMPLE_WEB_COMPONENT://LASTAPPHOST" /* LAST_APP_HOST */, data: useHostSet.$lastAppHost })]);
       otherStorage.set(SituationTypeContainers, situations);
       return app.simstanceManager.executeBindParameterSim(
         {
@@ -7900,195 +7931,243 @@ var elementDefine = (name, config = {}) => (constructor) => {
   const swcOnEvents = DOM_EVENT_NAMES.map((e) => `swc-on-${e}`);
   const attributeApplyNames = Array.from(applyAttributeMap.values()).map((it) => it.options.name).filter(Boolean);
   const hostAttributes = attributeList.filter((it) => it.selector === ":host").map((it) => it.options.name || String(it.propertyKey));
-  const mergedObservedAttributes = [.../* @__PURE__ */ new Set([
-    ...metadata.observedAttributes ?? [],
-    ...attrChangeMap.keys(),
-    ...attributeApplyNames,
-    ...hostAttributes,
-    ...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean),
-    ...swcLifecycleAttributes,
-    ...swcOnEvents
-  ])];
+  const originalStaticObservedAttributes = constructor.observedAttributes ?? [];
+  const mergedObservedAttributes = [.../* @__PURE__ */ new Set([...metadata.observedAttributes ?? [], ...originalStaticObservedAttributes, ...attrChangeMap.keys(), ...attributeApplyNames, ...hostAttributes, ...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean), ...swcLifecycleAttributes, ...swcOnEvents])];
   const connectedInnerHtmlList = getOnConnectedInnerHtmlMetadata(constructor) || [];
   const proto = constructor.prototype;
   setupPrototype(proto);
+  let helperHostSet = null;
   const originalConnected = proto.connectedCallback;
-  proto.connectedCallback = function() {
+  proto.connectedCallback = async function() {
     ensureInit(this);
-    const hostSet = SwcUtils.getHostSet(this);
-    const appHost2 = hostSet.$appHost;
-    const conf = getElementConfig(this);
-    const currentWin = this._resolveWindow(conf);
-    if ((connectedInnerHtmlList.some((it) => it.options.useShadow === true) || conf?.useShadow === true) && !this.shadowRoot) {
-      this.attachShadow({ mode: "open" });
-    }
-    this._executeSwcScript("swc-on-before-connected", hostSet);
-    const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_CONNECTED_METADATA_KEY);
-    if (bMethods) {
-      for (const m of bMethods) this._invokeLifecycleMethod(m, hostSet);
-    }
-    if (connectedInnerHtmlList.length > 0) {
-      let sContent = "", lContent = "";
-      for (const meta of connectedInnerHtmlList) {
-        const res = this._invokeLifecycleMethod(meta.propertyKey, hostSet);
-        if (res !== void 0) {
-          if (meta.options.useShadow) sContent += res;
-          else lContent += res;
-        }
-      }
-      if (this.shadowRoot) this.shadowRoot.innerHTML = sContent;
-      if (lContent) this.innerHTML = lContent;
-    }
-    const root = this.getRootNode();
-    if (!globalDelegatedRoots.has(root)) {
-      DOM_EVENT_NAMES.forEach((type) => {
-        root.addEventListener(type, handleGlobalSwcEvent);
-      });
-      globalDelegatedRoots.add(root);
-    }
-    const delegateListeners = [];
-    const nonDelegateListeners = [];
-    addEventListenerList.forEach((meta) => {
-      if (meta.options.delegate && meta.selector !== ":window" && meta.selector !== ":document" && meta.selector !== ":parentHost" && meta.selector !== ":appHost" && meta.selector !== ":firstHost" && meta.selector !== ":lastHost" && meta.selector !== ":firstAppHost" && meta.selector !== ":lastAppHost" && meta.selector !== ":hosts" && meta.selector !== ":appHosts" && meta.selector !== ":host" && meta.selector !== "") {
-        delegateListeners.push(meta);
-      } else {
-        nonDelegateListeners.push(meta);
+    helperHostSet = SwcUtils.getHelperAndHostSet(win, this);
+    const appHost2 = helperHostSet.$appHost;
+    try {
+      if (appHost2 && typeof appHost2._connected === "function") {
+        await appHost2._connected(this);
+      } else if (appHost2 && typeof appHost2) {
+        appHost2._connected_safari ?? (appHost2._connected_safari = []);
+        appHost2._connected_safari.push(this);
       }
-    });
-    const delegatesByTypeAndRoot = /* @__PURE__ */ new Map();
-    delegateListeners.forEach((meta) => {
-      const r = meta.options.root || "auto";
-      const rootKey = `${meta.type}:${r}`;
-      if (!delegatesByTypeAndRoot.has(rootKey)) {
-        delegatesByTypeAndRoot.set(rootKey, []);
-      }
-      delegatesByTypeAndRoot.get(rootKey).push(meta);
-    });
-    delegatesByTypeAndRoot.forEach((metaList, typeRootKey) => {
-      const [type, rStr] = typeRootKey.split(":");
-      const r = rStr === "auto" ? "auto" : rStr;
-      const opts = { capture: metaList[0].options.capture, once: metaList[0].options.once, passive: metaList[0].options.passive };
-      const bindRoots = [];
-      if (r === "auto") bindRoots.push(this.shadowRoot || this);
-      else if (r === "light") bindRoots.push(this);
-      else if (r === "shadow" && this.shadowRoot) bindRoots.push(this.shadowRoot);
-      else if (r === "all") {
-        bindRoots.push(this);
-        if (this.shadowRoot) bindRoots.push(this.shadowRoot);
-      }
-      bindRoots.forEach((br) => {
-        const sortedMetaList = [...metaList].sort((a, b) => {
-          const aStop = a.options.stopPropagation ? 1 : 0;
-          const bStop = b.options.stopPropagation ? 1 : 0;
-          return bStop - aStop;
-        });
-        const unifiedHandler = async (event) => {
-          for (const meta of sortedMetaList) {
-            const { selector, options } = meta;
-            const matchedEl = event.target.closest(selector);
-            if (matchedEl && br.contains(matchedEl)) {
-              if (options.filter) {
-                const helper = SwcUtils.getHelperAndHostSet(currentWin, matchedEl);
-                if (!options.filter(event, helper)) {
-                  continue;
-                }
+      const conf = getElementConfig(this);
+      const currentWin = this._resolveWindow(conf);
+      const shadowMode = conf?.useShadow || connectedInnerHtmlList.find((it) => it.options.useShadow)?.options.useShadow;
+      if (shadowMode && !this.shadowRoot) {
+        const mode = shadowMode === true ? "open" : shadowMode;
+        this.attachShadow({ mode });
+      }
+      const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_CONNECTED_METADATA_KEY);
+      if (bMethods) {
+        for (const m of bMethods) await this._invokeLifecycleMethod(m, helperHostSet);
+      }
+      this._executeSwcScript("swc-on-before-connected", helperHostSet);
+      if (connectedInnerHtmlList.length > 0) {
+        let sContent = "", lContent = "";
+        for (const meta of connectedInnerHtmlList) {
+          let res = await this._invokeLifecycleMethod(meta.propertyKey, helperHostSet);
+          const actionExpression = new ActionExpression(res, {
+            expression: {
+              replace: {
+                start: meta.options.replaceWrap?.start || "{%{",
+                end: meta.options.replaceWrap?.end || "}%}"
+              },
+              callReturn: {
+                start: meta.options.replaceWrap?.start || "{%{=",
+                end: meta.options.replaceWrap?.end || "}%}"
+              },
+              call: {
+                start: meta.options.replaceWrap?.start || "{%{@",
+                end: meta.options.replaceWrap?.end || "}%}"
               }
-              if (options.stopPropagation) event.stopPropagation();
-              if (options.stopImmediatePropagation) event.stopImmediatePropagation();
-              if (options.preventDefault) event.preventDefault();
-              const currentHostSet = SwcUtils.getHostSet(this);
-              const args = { event, ...currentHostSet, $el: matchedEl, $root: br };
-              await this[meta.propertyKey](event, currentHostSet, matchedEl, args);
-              if (event.cancelBubble) break;
             }
+          });
+          actionExpression.getExpressions().filter((it) => it.type === "replace").forEach((it) => {
+            try {
+              const sr = FunctionUtils.executeReturn({ script: it.script, context: this, args: helperHostSet });
+              actionExpression.replace(it, sr);
+            } catch (e) {
+              console.error(`[SWC] Failed to execute connectedInnerHTML:`, e);
+            }
+          });
+          res = actionExpression.getUnprocessedTemplate();
+          if (res !== void 0) {
+            if (meta.options.useShadow || conf?.useShadow) sContent += res;
+            else lContent += res;
           }
-        };
-        br.addEventListener(type, unifiedHandler, opts);
-        this._boundListeners.push({ target: br, type, handler: unifiedHandler, options: opts });
-      });
-    });
-    nonDelegateListeners.forEach((meta) => {
-      const { selector, type, options } = meta;
-      const opts = { capture: options.capture, once: options.once, passive: options.passive };
-      const bindTargets = [];
-      const r = options.root || "auto";
-      const applyRootOption = (target) => {
-        if (!target) return;
-        if (r === "auto") {
-          bindTargets.push(target.shadowRoot || target);
-        } else {
-          if (r === "light" || r === "all") bindTargets.push(target);
-          if ((r === "shadow" || r === "all") && target.shadowRoot) bindTargets.push(target.shadowRoot);
         }
-      };
-      if (selector === ":window") bindTargets.push(currentWin);
-      else if (selector === ":document") bindTargets.push(currentWin.document);
-      else if (selector === ":parentHost") applyRootOption(hostSet.$parentHost);
-      else if (selector === ":appHost") applyRootOption(hostSet.$appHost);
-      else if (selector === ":firstHost") applyRootOption(hostSet.$firstHost);
-      else if (selector === ":lastHost") applyRootOption(hostSet.$lastHost);
-      else if (selector === ":firstAppHost") applyRootOption(hostSet.$firstAppHost);
-      else if (selector === ":lastAppHost") applyRootOption(hostSet.$lastAppHost);
-      else if (selector === ":hosts") hostSet.$hosts.forEach(applyRootOption);
-      else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRootOption);
-      else if (selector === ":host" || !selector) applyRootOption(this);
-      else {
-        const searchRoots = [];
-        if (r === "auto") searchRoots.push(this.shadowRoot || this);
-        else if (r === "light") searchRoots.push(this);
-        else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
-        else if (r === "all") {
-          searchRoots.push(this);
-          if (this.shadowRoot) searchRoots.push(this.shadowRoot);
+        try {
+          if (this.shadowRoot) {
+            this.shadowRoot.innerHTML = sContent;
+          }
+          if (lContent) {
+            this.innerHTML = lContent;
+          }
+        } catch (e) {
+          console.error("[ElementDefine] innerHTML setting error:", e);
         }
-        searchRoots.forEach((sr) => {
-          sr.querySelectorAll(selector).forEach((el) => bindTargets.push(el));
+      }
+      const root = this.getRootNode();
+      if (!globalDelegatedRoots.has(root)) {
+        DOM_EVENT_NAMES.forEach((type) => {
+          root.addEventListener(type, handleGlobalSwcEvent);
         });
+        globalDelegatedRoots.add(root);
       }
-      bindTargets.forEach((t) => {
-        const handler = async (event) => {
-          if (options.filter) {
-            const helper = SwcUtils.getHelperAndHostSet(currentWin, t);
-            if (!options.filter(event, helper)) {
-              return;
+      const delegateListeners = [];
+      const nonDelegateListeners = [];
+      addEventListenerList.forEach((meta) => {
+        if (meta.options.delegate && meta.selector !== ":window" && meta.selector !== ":document" && meta.selector !== ":parentHost" && meta.selector !== ":appHost" && meta.selector !== ":firstHost" && meta.selector !== ":lastHost" && meta.selector !== ":firstAppHost" && meta.selector !== ":lastAppHost" && meta.selector !== ":hosts" && meta.selector !== ":appHosts" && meta.selector !== ":host" && meta.selector !== "") {
+          delegateListeners.push(meta);
+        } else {
+          nonDelegateListeners.push(meta);
+        }
+      });
+      const delegatesByTypeAndRoot = /* @__PURE__ */ new Map();
+      delegateListeners.forEach((meta) => {
+        const r = meta.options.root || "auto";
+        const rootKey = `${meta.type}:${r}`;
+        if (!delegatesByTypeAndRoot.has(rootKey)) {
+          delegatesByTypeAndRoot.set(rootKey, []);
+        }
+        delegatesByTypeAndRoot.get(rootKey).push(meta);
+      });
+      delegatesByTypeAndRoot.forEach((metaList, typeRootKey) => {
+        const [type, rStr] = typeRootKey.split(":");
+        const r = rStr === "auto" ? "auto" : rStr;
+        const opts = { capture: metaList[0].options.capture, once: metaList[0].options.once, passive: metaList[0].options.passive };
+        const bindRoots = [];
+        if (r === "auto") bindRoots.push(this.shadowRoot || this);
+        else if (r === "light") bindRoots.push(this);
+        else if (r === "shadow" && this.shadowRoot) bindRoots.push(this.shadowRoot);
+        else if (r === "all") {
+          bindRoots.push(this);
+          if (this.shadowRoot) bindRoots.push(this.shadowRoot);
+        }
+        bindRoots.forEach((br) => {
+          const sortedMetaList = [...metaList].sort((a, b) => {
+            const aStop = a.options.stopPropagation ? 1 : 0;
+            const bStop = b.options.stopPropagation ? 1 : 0;
+            return bStop - aStop;
+          });
+          const unifiedHandler = async (event) => {
+            for (const meta of sortedMetaList) {
+              const { selector, options } = meta;
+              const matchedEl = event.target.closest(selector);
+              if (matchedEl && br.contains(matchedEl)) {
+                if (options.filter) {
+                  const helper = SwcUtils.getHelperAndHostSet(currentWin, matchedEl);
+                  if (!options.filter(event, helper)) {
+                    continue;
+                  }
+                }
+                if (options.stopPropagation) event.stopPropagation();
+                if (options.stopImmediatePropagation) event.stopImmediatePropagation();
+                if (options.preventDefault) event.preventDefault();
+                const currentHostSet = SwcUtils.getHostSet(this);
+                const args = { event, ...currentHostSet, $el: matchedEl, $root: br };
+                await this[meta.propertyKey](event, { ...currentHostSet, $matchedElement: matchedEl }, args);
+                if (event.cancelBubble) break;
+              }
             }
+          };
+          br.addEventListener(type, unifiedHandler, opts);
+          this._boundListeners.push({ target: br, type, handler: unifiedHandler, options: opts });
+        });
+      });
+      nonDelegateListeners.forEach((meta) => {
+        const { selector, type, options } = meta;
+        const opts = { capture: options.capture, once: options.once, passive: options.passive };
+        const bindTargets = [];
+        const r = options.root || "auto";
+        const applyRootOption = (target) => {
+          if (!target) return;
+          if (r === "auto") {
+            bindTargets.push(target.shadowRoot || target);
+          } else {
+            if (r === "light" || r === "all") bindTargets.push(target);
+            if ((r === "shadow" || r === "all") && target.shadowRoot) bindTargets.push(target.shadowRoot);
           }
-          if (options.stopPropagation) event.stopPropagation();
-          if (options.stopImmediatePropagation) event.stopImmediatePropagation();
-          if (options.preventDefault) event.preventDefault();
-          const currentHostSet = SwcUtils.getHostSet(this);
-          const args = { event, ...currentHostSet, $el: t, $root: t };
-          await this[meta.propertyKey](event, currentHostSet, args);
         };
-        t.addEventListener(type, handler, opts);
-        if (options.removeOnDisconnected === true || t === currentWin || t === currentWin.document) {
-          this._boundListeners.push({ target: t, type, handler, options: opts });
+        if (selector === ":window") bindTargets.push(currentWin);
+        else if (selector === ":document") bindTargets.push(currentWin.document);
+        else if (selector === ":parentHost") applyRootOption(helperHostSet.$parentHost);
+        else if (selector === ":appHost") applyRootOption(helperHostSet.$appHost);
+        else if (selector === ":firstHost") applyRootOption(helperHostSet.$firstHost);
+        else if (selector === ":lastHost") applyRootOption(helperHostSet.$lastHost);
+        else if (selector === ":firstAppHost") applyRootOption(helperHostSet.$firstAppHost);
+        else if (selector === ":lastAppHost") applyRootOption(helperHostSet.$lastAppHost);
+        else if (selector === ":hosts") helperHostSet.$hosts.forEach(applyRootOption);
+        else if (selector === ":appHosts") helperHostSet.$appHosts.forEach(applyRootOption);
+        else if (selector === ":host" || !selector) applyRootOption(this);
+        else {
+          const searchRoots = [];
+          if (r === "auto") searchRoots.push(this.shadowRoot || this);
+          else if (r === "light") searchRoots.push(this);
+          else if (r === "shadow" && this.shadowRoot) searchRoots.push(this.shadowRoot);
+          else if (r === "all") {
+            searchRoots.push(this);
+            if (this.shadowRoot) searchRoots.push(this.shadowRoot);
+          }
+          searchRoots.forEach((sr) => {
+            sr.querySelectorAll(selector).forEach((el) => bindTargets.push(el));
+          });
         }
+        bindTargets.forEach((t) => {
+          const handler = async (event) => {
+            if (options.filter) {
+              const helper = SwcUtils.getHelperAndHostSet(currentWin, t);
+              if (!options.filter(event, { currentThis: this, helper })) {
+                return;
+              }
+            }
+            if (options.stopPropagation) event.stopPropagation();
+            if (options.stopImmediatePropagation) event.stopImmediatePropagation();
+            if (options.preventDefault) event.preventDefault();
+            const currentHostSet = SwcUtils.getHostSet(this);
+            const args = { event, ...currentHostSet, $el: t, $root: t };
+            await this[meta.propertyKey](event, { currentHostSet, $$matchedElement: event.currentTarget }, args);
+          };
+          t.addEventListener(type, handler, opts);
+          if (options.removeOnDisconnected === true || t === currentWin || t === currentWin.document) {
+            this._boundListeners.push({ target: t, type, handler, options: opts });
+          }
+        });
       });
-    });
-    if (originalConnected) originalConnected.apply(this);
-    const aMethods = findAllLifecycleMetadata(this, ON_AFTER_CONNECTED_METADATA_KEY);
-    if (aMethods) {
-      for (const m of aMethods) this._invokeLifecycleMethod(m, hostSet);
-    }
-    this._executeSwcScript("swc-on-connected", hostSet);
-    this._executeSwcScript("swc-on-after-connected", hostSet);
-    this.__swc_connected = true;
-    const appHostss = SwcUtils.findAllParentAppHostsDirect(this);
-    if (appHost2 && typeof appHost2._connected === "function") {
-      appHost2._connected(this);
-    } else if (appHost2 && typeof appHost2) {
-      appHost2._connected_safari ?? (appHost2._connected_safari = []);
-      appHost2._connected_safari.push(this);
+      if (originalConnected) await originalConnected.apply(this);
+      const aMethods = findAllLifecycleMetadata(this, ON_AFTER_CONNECTED_METADATA_KEY);
+      if (aMethods) {
+        for (const m of aMethods) await this._invokeLifecycleMethod(m, helperHostSet);
+      }
+      this._executeSwcScript("swc-on-connected", helperHostSet);
+      this._executeSwcScript("swc-on-after-connected", helperHostSet);
+      this.__swc_connected = true;
+      for (let [name2, metaList] of Array.from(attrChangeMap)) {
+        for (const meta of metaList) {
+          if (meta.options.while === "connected") {
+            const val = getAttributeValue(this, name2, { type: meta.options.type });
+            if (val !== null) {
+              await this[meta.propertyKey](val, null, name2, helperHostSet);
+            }
+          }
+        }
+      }
+    } finally {
+      if (appHost2 && typeof appHost2._connectedDone === "function") {
+        await appHost2._connectedDone(this);
+      }
     }
   };
   const originalDisconnected = proto.disconnectedCallback;
   proto.disconnectedCallback = function() {
-    const hostSet = SwcUtils.getHostSet(this);
-    this._executeSwcScript("swc-on-before-disconnected", hostSet);
+    console.log("disconnnnnnnnnnnnnnnnnnn", helperHostSet, this);
+    const appHost2 = helperHostSet.$appHost;
+    if (appHost2 && typeof appHost2._disconnected === "function") {
+      appHost2._disconnected(this);
+    }
+    this._executeSwcScript("swc-on-before-disconnected", helperHostSet);
     const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_DISCONNECTED_METADATA_KEY);
     if (bMethods) {
-      for (const m of bMethods) this._invokeLifecycleMethod(m, hostSet);
+      for (const m of bMethods) this._invokeLifecycleMethod(m, helperHostSet);
     }
     if (this._boundListeners) {
       this._boundListeners.forEach((l) => l.target.removeEventListener(l.type, l.handler, l.options));
@@ -8097,15 +8176,11 @@ var elementDefine = (name, config = {}) => (constructor) => {
     if (originalDisconnected) originalDisconnected.apply(this);
     const aMethods = findAllLifecycleMetadata(this, ON_AFTER_DISCONNECTED_METADATA_KEY);
     if (aMethods) {
-      for (const m of aMethods) this._invokeLifecycleMethod(m, hostSet);
+      for (const m of aMethods) this._invokeLifecycleMethod(m, helperHostSet);
     }
-    this._executeSwcScript("swc-on-disconnected", hostSet);
-    this._executeSwcScript("swc-on-after-disconnected", hostSet);
+    this._executeSwcScript("swc-on-disconnected", helperHostSet);
+    this._executeSwcScript("swc-on-after-disconnected", helperHostSet);
     this.__swc_connected = false;
-    const appHost2 = hostSet.$appHost;
-    if (appHost2 && typeof appHost2._disconnected === "function") {
-      appHost2._disconnected(this);
-    }
   };
   const originalAdopted = proto.adoptedCallback;
   proto.adoptedCallback = function() {
@@ -8130,18 +8205,20 @@ var elementDefine = (name, config = {}) => (constructor) => {
     let processedVal = newVal;
     if (newVal !== null) {
       const ae = new ActionExpression(newVal);
-      const expr = ae.getFirstExpression("call-return");
+      const expr = ae.getFirstExpression("callReturn");
       if (expr) {
         const win2 = this._resolveWindow?.() || (typeof window !== "undefined" ? window : void 0);
+        const helperAndHostSet = SwcUtils.getHelperAndHostSet(win2, this);
+        const script = ConvertUtils2.decodeHtmlEntity(expr.script, win2.document);
         try {
           const result = FunctionUtils.executeReturn({
-            script: ConvertUtils2.decodeHtmlEntity(expr.script, win2.document),
+            script,
             context: this,
-            args: SwcUtils.getHelperAndHostSet(win2, this)
+            args: helperAndHostSet
           });
-          processedVal = String(result);
+          processedVal = result;
         } catch (e) {
-          console.error(`[SWC] Failed to execute directive {{= ${expr.script} }} on attribute ${name2}:`, e);
+          console.error(`[SWC] Failed to execute directive {{= ${expr.script} }} on attribute ${name2}: ${helperAndHostSet}`, e);
           processedVal = newVal;
         }
       }
@@ -8156,9 +8233,15 @@ var elementDefine = (name, config = {}) => (constructor) => {
     if (hostCustomEventMeta && newVal !== null) {
       this._bindAttributeEvent(this, name2, newVal, hostCustomEventMeta.type);
     }
-    const mKeys = attrChangeMap.get(name2);
-    if (mKeys && Array.isArray(mKeys)) {
-      for (const key of mKeys) this[key](processedVal, old, name2, hSet);
+    const metaList = attrChangeMap.get(name2);
+    if (metaList && Array.isArray(metaList)) {
+      for (const meta of metaList) {
+        if (meta.options.while === "connected" && !this.__swc_connected) {
+          continue;
+        }
+        const convertedVal = convertAttributeValue(processedVal, meta.options.type);
+        this[meta.propertyKey](convertedVal, old, name2, hSet);
+      }
     }
   };
   Object.defineProperty(constructor, "observedAttributes", {
@@ -8175,12 +8258,38 @@ var elementDefine = (name, config = {}) => (constructor) => {
 
 // src/decorators/attribute.ts
 var ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for("simple-web-component:attribute-field");
-var convertValue = (val, type) => {
+var convertValue2 = (val, type) => {
   if (val === null || val === void 0) return val;
   if (type === Number) return Number(val);
   if (type === Boolean) return val === "false" || val === "0" ? false : true;
   return val;
 };
+var getAttributeValue = (inst, attrName, options) => {
+  const conf = getElementConfig(inst);
+  const currentWin = inst._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
+  const targets = options?.selector ? resolveTargetEls(inst, options.selector, options, currentWin) : [inst];
+  const primaryTarget = targets[0];
+  if (primaryTarget && typeof primaryTarget.hasAttribute === "function" && primaryTarget.hasAttribute(attrName)) {
+    let domVal = primaryTarget.getAttribute(attrName);
+    const ae = new ActionExpression(domVal);
+    const expr = ae.getFirstExpression("callReturn");
+    if (expr) {
+      try {
+        const result = FunctionUtils.executeReturn({
+          script: ConvertUtils2.decodeHtmlEntity(expr.script, currentWin.document),
+          context: inst,
+          args: SwcUtils.getHelperAndHostSet(currentWin, inst)
+        });
+        return convertValue2(result, options?.type);
+      } catch (e) {
+        console.error(`[SWC] Failed to execute directive {{= ${expr.script} }}:`, e);
+        return convertValue2(domVal, options?.type);
+      }
+    }
+    return convertValue2(domVal, options?.type);
+  }
+  return null;
+};
 var resolveTargetEls = (inst, selector, options, currentWin) => {
   const r = options.root || "auto";
   const results = [];
@@ -8255,35 +8364,13 @@ function attribute(selector, options = {}) {
       Object.defineProperty(target, propertyKey, {
         get() {
           const attrName = options.name || String(propertyKey);
-          const conf = getElementConfig(this);
-          const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
-          const targetType = options.type || designType;
-          const targets = resolveTargetEls(this, selector, options, currentWin);
-          const primaryTarget = targets[0];
-          if (primaryTarget && typeof primaryTarget.hasAttribute === "function") {
-            if (primaryTarget.hasAttribute(attrName)) {
-              let domVal = primaryTarget.getAttribute(attrName);
-              const ae = new ActionExpression(domVal);
-              const expr = ae.getFirstExpression("call-return");
-              if (expr) {
-                try {
-                  const result = FunctionUtils.executeReturn({
-                    script: ConvertUtils2.decodeHtmlEntity(expr.script, currentWin.document),
-                    context: this,
-                    args: SwcUtils.getHelperAndHostSet(currentWin, this)
-                  });
-                  return convertValue(result, targetType);
-                } catch (e) {
-                  console.error(`[SWC] Failed to execute directive {{= ${expr.script} }}:`, e);
-                  return convertValue(domVal, targetType);
-                }
-              }
-              return convertValue(domVal, targetType);
-            }
-            return null;
-          }
-          const data = convertValue(this[privateKey], targetType);
-          return data;
+          const mergedOptions = {
+            ...options,
+            selector,
+            type: options.type || designType
+          };
+          const result = getAttributeValue(this, attrName, mergedOptions);
+          return result !== null ? result : this[privateKey];
         },
         set(nv) {
           const attrName = options.name || String(propertyKey);
@@ -8396,14 +8483,7 @@ function applyNode(selector, options = { position: "beforeEnd" }) {
       const res = original.apply(this, args);
       const runApply = (target, val) => {
         const pos = options.position || "beforeEnd";
-        const defaultFilter = (t, v) => {
-          if (v instanceof Node) return !t.contains(v);
-          if (pos === "innerHtml" && typeof v === "string") return t.innerHTML !== v;
-          if (pos === "replaceChildren" && v instanceof Node) return !t.contains(v);
-          return true;
-        };
-        const activeFilter = options.filter || defaultFilter;
-        if (activeFilter(target, val, hostSet)) {
+        if (!options.filter || options.filter(target, val, { currentThis: this, helper: hostSet })) {
           applyToDom(target, val, pos, currentDoc);
         }
       };
@@ -8454,6 +8534,9 @@ function applyReplaceChildrenNode(selector, options = {}) {
 function applyInnerHtmlNode(selector, options = {}) {
   return applyNode(selector, { ...options, position: "innerHtml" });
 }
+function applyInnerTextNode(selector, options = {}) {
+  return applyNode(selector, { ...options, position: "innerText" });
+}
 
 // src/decorators/applyClass.ts
 var CLASS_METADATA_KEY = Symbol.for("simple-web-component:class");
@@ -8475,81 +8558,91 @@ function createClassDecorator(action) {
       }
       metaList.set(propertyKey, { propertyKey, selector, action, options: finalOptions });
       const original = descriptor.value;
-      descriptor.value = async function(...args) {
+      descriptor.value = function(...args) {
         ensureInit(this);
-        const res = await original.apply(this, args);
-        if (res !== void 0) {
-          const win = this.ownerDocument?.defaultView || window;
-          const host2 = this;
-          const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
-          const r = finalOptions.root || "auto";
-          const targetEls = [];
-          const applyRoot = (t) => {
-            if (!t || !(t instanceof win.HTMLElement)) return;
-            targetEls.push(t);
-          };
-          if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-          else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-          else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-          else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-          else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-          else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-          else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-          else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-          else if (selector === ":host" || !selector) applyRoot(host2);
-          else {
-            const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
-            if (targetRoot) {
-              const found = targetRoot.querySelectorAll(selector);
-              if (found) targetEls.push(...Array.from(found));
-            }
-          }
-          targetEls.forEach((targetEl) => {
-            const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
-            if (action === "set") {
-              let classes = "";
-              if (classMap && typeof classMap === "string") {
-                classes = resolvedRes ? classMap : "";
-              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                classes = Object.entries(resolvedRes).filter(([_, force]) => typeof force === "function" ? force(targetEl, hostSet) : !!force).map(([cls]) => cls).join(" ");
-              } else {
-                classes = Array.isArray(resolvedRes) ? resolvedRes.join(" ") : String(resolvedRes);
+        const res = original.apply(this, args);
+        const handleResult = (resolvedValue) => {
+          if (resolvedValue !== void 0) {
+            const win = this.ownerDocument?.defaultView || window;
+            const host2 = this;
+            const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
+            const r = finalOptions.root || "auto";
+            const targetEls = [];
+            const applyRoot = (t) => {
+              if (!t || !(t instanceof win.HTMLElement)) return;
+              targetEls.push(t);
+            };
+            if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
+            else if (selector === ":appHost") applyRoot(hostSet.$appHost);
+            else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
+            else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
+            else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
+            else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
+            else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
+            else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
+            else if (selector === ":host" || !selector) applyRoot(host2);
+            else {
+              const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
+              if (targetRoot) {
+                const found = targetRoot.querySelectorAll(selector);
+                if (found) targetEls.push(...Array.from(found));
               }
-              targetEl.className = classes;
-            } else if (action === "update" || action === "toggle") {
-              if (classMap && typeof classMap === "string") {
-                targetEl.classList.toggle(classMap, !!resolvedRes);
-              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([cls, force]) => {
-                  const isActive = typeof force === "function" ? force(targetEl, hostSet) : !!force;
-                  targetEl.classList.toggle(cls, isActive);
-                });
-              } else {
-                const classes = Array.isArray(resolvedRes) ? resolvedRes.map(String) : [String(resolvedRes)];
-                if (action === "update") targetEl.classList.add(...classes);
-                else classes.forEach((c) => targetEl.classList.toggle(c));
+            }
+            targetEls.forEach((targetEl) => {
+              if (finalOptions.filter && !finalOptions.filter(targetEl, resolvedValue, { currentThis: this, helper: hostSet })) {
+                return;
               }
-            } else if (action === "add" || action === "remove") {
-              if (classMap && typeof classMap === "string" && !!resolvedRes) {
-                if (action === "add") targetEl.classList.add(classMap);
-                else targetEl.classList.remove(classMap);
-              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([cls, force]) => {
-                  const shouldExecute = typeof force === "function" ? force(targetEl, hostSet) : !!force;
-                  if (shouldExecute) {
-                    if (action === "add") targetEl.classList.add(cls);
-                    else targetEl.classList.remove(cls);
-                  }
-                });
-              } else {
-                const classes = Array.isArray(resolvedRes) ? resolvedRes.map(String) : [String(resolvedRes)];
-                if (action === "add") targetEl.classList.add(...classes);
-                else targetEl.classList.remove(...classes);
+              const resolvedRes = typeof resolvedValue === "function" ? resolvedValue(targetEl, hostSet) : resolvedValue;
+              if (action === "set") {
+                let classes = "";
+                if (classMap && typeof classMap === "string") {
+                  classes = resolvedRes ? classMap : "";
+                } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  classes = Object.entries(resolvedRes).filter(([_, force]) => typeof force === "function" ? force(targetEl, hostSet) : !!force).map(([cls]) => cls).join(" ");
+                } else {
+                  classes = Array.isArray(resolvedRes) ? resolvedRes.join(" ") : String(resolvedRes);
+                }
+                targetEl.className = classes;
+              } else if (action === "update" || action === "toggle") {
+                if (classMap && typeof classMap === "string") {
+                  targetEl.classList.toggle(classMap, !!resolvedRes);
+                } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([cls, force]) => {
+                    const isActive = typeof force === "function" ? force(targetEl, hostSet) : !!force;
+                    targetEl.classList.toggle(cls, isActive);
+                  });
+                } else {
+                  const classes = Array.isArray(resolvedRes) ? resolvedRes.map(String) : [String(resolvedRes)];
+                  if (action === "update") targetEl.classList.add(...classes);
+                  else classes.forEach((c) => targetEl.classList.toggle(c));
+                }
+              } else if (action === "add" || action === "remove") {
+                if (classMap && typeof classMap === "string" && !!resolvedRes) {
+                  if (action === "add") targetEl.classList.add(classMap);
+                  else targetEl.classList.remove(classMap);
+                } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([cls, force]) => {
+                    const shouldExecute = typeof force === "function" ? force(targetEl, hostSet) : !!force;
+                    if (shouldExecute) {
+                      if (action === "add") targetEl.classList.add(cls);
+                      else targetEl.classList.remove(cls);
+                    }
+                  });
+                } else {
+                  const classes = Array.isArray(resolvedRes) ? resolvedRes.map(String) : [String(resolvedRes)];
+                  if (action === "add") targetEl.classList.add(...classes);
+                  else targetEl.classList.remove(...classes);
+                }
               }
-            }
-          });
+            });
+          }
+          return resolvedValue;
+        };
+        if (res instanceof Promise) {
+          return res.then(handleResult);
+        } else {
+          return handleResult(res);
         }
-        return res;
       };
       return descriptor;
     };
@@ -8595,67 +8688,77 @@ function createStyleDecorator(action) {
       }
       metaList.set(propertyKey, { propertyKey, selector, action, options });
       const original = descriptor.value;
-      descriptor.value = async function(...args) {
+      descriptor.value = function(...args) {
         ensureInit(this);
-        const res = await original.apply(this, args);
-        if (res !== void 0) {
-          const win = this.ownerDocument?.defaultView || window;
-          const host2 = this;
-          const hostSet = SwcUtils.getHelperAndHostSet(win, host2);
-          const r = options.root || "auto";
-          const targetEls = [];
-          const applyRoot = (t) => {
-            if (!t || !(t instanceof win.HTMLElement)) return;
-            targetEls.push(t);
-          };
-          if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-          else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-          else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-          else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-          else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-          else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-          else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-          else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-          else if (selector === ":host" || !selector) applyRoot(host2);
-          else {
-            const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
-            if (targetRoot) {
-              const found = targetRoot.querySelectorAll(selector);
-              if (found) targetEls.push(...Array.from(found));
+        const res = original.apply(this, args);
+        const handleResult = (resolvedValue) => {
+          if (resolvedValue !== void 0) {
+            const win = this.ownerDocument?.defaultView || window;
+            const host2 = this;
+            const hostSet = SwcUtils.getHelperAndHostSet(win, host2);
+            const r = options.root || "auto";
+            const targetEls = [];
+            const applyRoot = (t) => {
+              if (!t || !(t instanceof win.HTMLElement)) return;
+              targetEls.push(t);
+            };
+            if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
+            else if (selector === ":appHost") applyRoot(hostSet.$appHost);
+            else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
+            else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
+            else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
+            else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
+            else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
+            else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
+            else if (selector === ":host" || !selector) applyRoot(host2);
+            else {
+              const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
+              if (targetRoot) {
+                const found = targetRoot.querySelectorAll(selector);
+                if (found) targetEls.push(...Array.from(found));
+              }
             }
-          }
-          targetEls.forEach((targetEl) => {
-            const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
-            if (action === "set" || action === "update") {
-              if (action === "set") targetEl.style.cssText = "";
-              if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([prop, val]) => {
-                  const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
-                  if (finalVal === null || finalVal === void 0) {
-                    targetEl.style.removeProperty(prop);
-                  } else {
-                    targetEl.style[prop] = String(finalVal);
-                  }
-                });
-              } else if (typeof resolvedRes === "string") {
-                targetEl.style.cssText = resolvedRes;
+            targetEls.forEach((targetEl) => {
+              if (options.filter && !options.filter(targetEl, resolvedValue, { currentThis: this, helper: hostSet })) {
+                return;
               }
-            } else if (action === "remove") {
-              if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                Object.entries(resolvedRes).forEach(([prop, val]) => {
-                  const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
-                  if (shouldRemove) {
-                    targetEl.style.removeProperty(prop);
-                  }
-                });
-              } else {
-                const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
-                props.forEach((p) => targetEl.style.removeProperty(String(p)));
+              const resolvedRes = typeof resolvedValue === "function" ? resolvedValue(targetEl, hostSet) : resolvedValue;
+              if (action === "set" || action === "update") {
+                if (action === "set") targetEl.style.cssText = "";
+                if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([prop, val]) => {
+                    const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
+                    if (finalVal === null || finalVal === void 0) {
+                      targetEl.style.removeProperty(prop);
+                    } else {
+                      targetEl.style[prop] = String(finalVal);
+                    }
+                  });
+                } else if (typeof resolvedRes === "string") {
+                  targetEl.style.cssText = resolvedRes;
+                }
+              } else if (action === "remove") {
+                if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                  Object.entries(resolvedRes).forEach(([prop, val]) => {
+                    const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
+                    if (shouldRemove) {
+                      targetEl.style.removeProperty(prop);
+                    }
+                  });
+                } else {
+                  const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
+                  props.forEach((p) => targetEl.style.removeProperty(String(p)));
+                }
               }
-            }
-          });
+            });
+          }
+          return resolvedValue;
+        };
+        if (res instanceof Promise) {
+          return res.then(handleResult);
+        } else {
+          return handleResult(res);
         }
-        return res;
       };
       return descriptor;
     };
@@ -8705,48 +8808,59 @@ var setProperty = (selector, propertyNameOrOptions, options = {}) => {
       options: { ...finalOptions, name: propertyName }
     });
     const original = descriptor.value;
-    descriptor.value = async function(...args) {
+    descriptor.value = function(...args) {
       ensureInit(this);
-      const res = await original.apply(this, args);
-      if (res !== void 0) {
-        const win = this.ownerDocument?.defaultView || window;
-        const host2 = this;
-        const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
-        const r = finalOptions.root || "auto";
-        const targetEls = [];
-        const applyRoot = (t) => {
-          if (!t || !(t instanceof win.HTMLElement)) return;
-          targetEls.push(t);
-        };
-        if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-        else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-        else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-        else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-        else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-        else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-        else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-        else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-        else if (selector === ":host" || !selector) applyRoot(host2);
-        else {
-          const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
-          if (targetRoot) {
-            const found = targetRoot.querySelectorAll(selector);
-            if (found) targetEls.push(...Array.from(found));
+      const res = original.apply(this, args);
+      const handleResult = (resolvedValue) => {
+        if (resolvedValue !== void 0) {
+          const win = this.ownerDocument?.defaultView || window;
+          const host2 = this;
+          const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host2), $this: this };
+          const r = finalOptions.root || "auto";
+          const targetEls = [];
+          const applyRoot = (t) => {
+            if (!t || !(t instanceof win.HTMLElement)) return;
+            targetEls.push(t);
+          };
+          if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
+          else if (selector === ":appHost") applyRoot(hostSet.$appHost);
+          else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
+          else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
+          else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
+          else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
+          else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
+          else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
+          else if (selector === ":host" || !selector) applyRoot(host2);
+          else {
+            const targetRoot = r === "auto" ? host2.shadowRoot || host2 : r === "shadow" ? host2.shadowRoot : host2;
+            if (targetRoot) {
+              const found = targetRoot.querySelectorAll(selector);
+              if (found) targetEls.push(...Array.from(found));
+            }
           }
+          targetEls.forEach((targetEl) => {
+            if (finalOptions.filter && !finalOptions.filter(targetEl, resolvedValue, { currentThis: this, helper: hostSet })) {
+              return;
+            }
+            const resolvedRes = typeof resolvedValue === "function" ? resolvedValue(targetEl, hostSet) : resolvedValue;
+            if (propertyName) {
+              targetEl[propertyName] = resolvedRes;
+            } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+              Object.entries(resolvedRes).forEach(([prop, val]) => {
+                const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
+                targetEl[prop] = finalVal;
+              });
+            } else {
+              targetEl.value = resolvedRes;
+            }
+          });
         }
-        targetEls.forEach((targetEl) => {
-          const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
-          if (propertyName) {
-            targetEl[propertyName] = resolvedRes;
-          } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-            Object.entries(resolvedRes).forEach(([prop, val]) => {
-              const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
-              targetEl[prop] = finalVal;
-            });
-          } else {
-            targetEl.value = resolvedRes;
-          }
-        });
+        return resolvedValue;
+      };
+      if (res instanceof Promise) {
+        return res.then(handleResult);
+      } else {
+        return handleResult(res);
       }
     };
   };
@@ -8767,7 +8881,7 @@ function createSubscribeSwcAppRouteChangeWhileConnected(options) {
       list = [];
       ReflectUtils.defineMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, list, constructor);
     }
-    list.push({ propertyKey, pathPattern, filter });
+    list.push({ propertyKey, options });
     return descriptor;
   };
 }
@@ -8778,7 +8892,7 @@ function subscribeSwcAppRouteChangeWhileConnected(targetOrOptions, propertyKey,
   let options = {};
   if (Array.isArray(targetOrOptions)) {
     options.path = targetOrOptions;
-  } else if (typeof targetOrOptions === "string") {
+  } else if (typeof targetOrOptions === "string" || typeof targetOrOptions === "function") {
     options.path = targetOrOptions;
   } else if (targetOrOptions && typeof targetOrOptions === "object") {
     options = targetOrOptions;
@@ -8924,6 +9038,22 @@ var RouterAction;
     return typeof obj?.hasActivate === "function";
   };
 })(RouterAction || (RouterAction = {}));
+
+// ../simple-boot/dist/esm/decorators/cache/CacheDecorator.js
+var CacheMetadataKey = Symbol.for("simple-boot:cache-metadata");
+
+// ../simple-boot/dist/esm/fetch/ApiService.js
+var ApiServiceInterceptor;
+((ApiServiceInterceptor2) => {
+  ApiServiceInterceptor2.TOKEN = Symbol.for("simple-boot:api-service-interceptor-token");
+  ApiServiceInterceptor2.resolveAll = (simstanceManager) => {
+    try {
+      return (simstanceManager.findSims(ApiServiceInterceptor2.TOKEN) ?? []).map((it) => it.getValue()).filter(ValidUtils.isDefined);
+    } catch (e) {
+      return [];
+    }
+  };
+})(ApiServiceInterceptor || (ApiServiceInterceptor = {}));
 export {
   ADD_EVENT_LISTENER_METADATA_KEY,
   APPLY_NODE_METADATA_KEY,
@@ -8976,6 +9106,7 @@ export {
   applyClassHost,
   applyInnerHtmlNode,
   applyInnerHtmlNodeHost,
+  applyInnerTextNode,
   applyNode,
   applyNodeHost,
   applyReplaceChildrenNode,
@@ -8986,6 +9117,8 @@ export {
   attributeHost,
   changedAttributeHost,
   commentNode,
+  convertAttributeValue,
+  convertValue2 as convertValue,
   createElement,
   elementDefine,
   emitCustomEvent,
@@ -9001,6 +9134,7 @@ export {
   firstAppHost,
   firstHost,
   getAddEventListenerMetadata,
+  getAttributeValue,
   getChangedAttributeMetadata,
   getElementConfig,
   getEmitCustomEventMetadataList,
@@ -9026,16 +9160,15 @@ export {
   lastHost,
   onAddEventListener,
   onAdopted,
-  onAfterAdopted,
-  onAfterConnected,
-  onAfterDisconnected,
-  onBeforeAdopted,
-  onBeforeConnected,
-  onBeforeDisconnected,
+  onAdoptedAfter,
+  onAdoptedBefore,
   onConnected,
+  onConnectedAfter,
+  onConnectedBefore,
   onConnectedInnerHtml,
-  onConnectedSwcApp,
   onDisconnected,
+  onDisconnectedAfter,
+  onDisconnectedBefore,
   onInitialize,
   parentHost,
   publishSwcAppMessage,