@dooboostore/simple-web-component 1.0.47 → 1.0.49

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

@@ -30,9 +30,9 @@ var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__ge
 ));
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 
-// ../../node_modules/.pnpm/reflect-metadata@0.2.2/node_modules/reflect-metadata/Reflect.js
+// ../../../node_modules/.pnpm/reflect-metadata@0.2.2/node_modules/reflect-metadata/Reflect.js
 var require_Reflect = __commonJS({
-  "../../node_modules/.pnpm/reflect-metadata@0.2.2/node_modules/reflect-metadata/Reflect.js"() {
+  "../../../node_modules/.pnpm/reflect-metadata@0.2.2/node_modules/reflect-metadata/Reflect.js"() {
     var Reflect2;
     (function(Reflect3) {
       (function(factory) {
@@ -1159,6 +1159,7 @@ __export(esm_exports, {
   Fetcher: () => Fetcher,
   FormValidator: () => FormValidator,
   FunctionUtils: () => FunctionUtils,
+  HashUtils: () => HashUtils,
   HttpFetcher: () => HttpFetcher,
   HttpJsonFetcher: () => HttpJsonFetcher,
   HttpResponseError: () => HttpResponseError,
@@ -1239,6 +1240,7 @@ __export(esm_exports, {
   isCssCommentItem: () => isCssCommentItem,
   isCssDeclarationItem: () => isCssDeclarationItem,
   isCssRuleItem: () => isCssRuleItem,
+  isDefined: () => isDefined,
   isHttpResponseError: () => isHttpResponseError,
   isPoint2DType: () => isPoint2DType,
   isPoint3DType: () => isPoint3DType,
@@ -1935,8 +1937,8 @@ var ObjectPathParser = class _ObjectPathParser {
           const funcCall = this.parseFunctionCall(true);
           memberExpr.addChild(funcCall);
         } else {
-          const prop = this.parsePropertyAccess(true);
-          memberExpr.addChild(prop);
+          const prop2 = this.parsePropertyAccess(true);
+          memberExpr.addChild(prop2);
         }
       } else if (char === ".") {
         this.advance();
@@ -1944,8 +1946,8 @@ var ObjectPathParser = class _ObjectPathParser {
           const paren = this.parseParenthesizedAccess(false);
           memberExpr.addChild(paren);
         } else {
-          const prop = this.parsePropertyAccess(false);
-          memberExpr.addChild(prop);
+          const prop2 = this.parsePropertyAccess(false);
+          memberExpr.addChild(prop2);
         }
       } else if (char === "[") {
         const bracket = this.parseBracketAccess(false);
@@ -1999,13 +2001,13 @@ var ObjectPathParser = class _ObjectPathParser {
   }
   parsePropertyAccess(isOptional) {
     const start = this.pos;
-    const prop = new Token("property_access", "", start, start);
-    prop.isOptional = isOptional;
+    const prop2 = new Token("property_access", "", start, start);
+    prop2.isOptional = isOptional;
     const identifier = this.parseIdentifier();
-    prop.addChild(identifier);
-    prop.end = this.pos;
-    prop.value = this.input.substring(start, this.pos);
-    return prop;
+    prop2.addChild(identifier);
+    prop2.end = this.pos;
+    prop2.value = this.input.substring(start, this.pos);
+    return prop2;
   }
   parseBracketAccess(isOptional) {
     const start = this.pos;
@@ -2101,8 +2103,8 @@ var ObjectPathParser = class _ObjectPathParser {
             const funcCall = this.parseFunctionCall(true);
             memberExpr.addChild(funcCall);
           } else {
-            const prop = this.parsePropertyAccess(true);
-            memberExpr.addChild(prop);
+            const prop2 = this.parsePropertyAccess(true);
+            memberExpr.addChild(prop2);
           }
         } else if (char === ".") {
           this.advance();
@@ -2110,8 +2112,8 @@ var ObjectPathParser = class _ObjectPathParser {
             const parenAccess = this.parseParenthesizedAccess(false);
             memberExpr.addChild(parenAccess);
           } else {
-            const prop = this.parsePropertyAccess(false);
-            memberExpr.addChild(prop);
+            const prop2 = this.parsePropertyAccess(false);
+            memberExpr.addChild(prop2);
           }
         } else if (char === "[") {
           const bracket = this.parseBracketAccess(false);
@@ -2815,17 +2817,17 @@ var ObjectUtils;
           };
           const handler = new GetDetectProxy(prefix);
           return new Proxy(dummyFunction, {
-            get: (target, prop, receiver) => {
-              if (prop === Symbol.toPrimitive) {
+            get: (target, prop2, receiver) => {
+              if (prop2 === Symbol.toPrimitive) {
                 return () => "";
               }
-              if (prop === "valueOf") {
+              if (prop2 === "valueOf") {
                 return () => handler.createSafeProxy(prefix);
               }
-              if (prop === "toString") {
+              if (prop2 === "toString") {
                 return () => "";
               }
-              return handler.get(target, prop, receiver);
+              return handler.get(target, prop2, receiver);
             },
             set: handler.set.bind(handler),
             apply: handler.apply.bind(handler)
@@ -3198,6 +3200,12 @@ var Vector = class _Vector {
       this.z = z ?? 0;
     }
   }
+  /**
+   * 성분 대입 (파괴적). 벡터 전달 시 그 성분을 복사.
+   * @example
+   * v.set(1, 2, 3);          // v = (1, 2, 3)
+   * v.set(otherVector);      // v = other와 동일 성분
+   */
   set(v, y = 0, z = 0) {
     if (v instanceof _Vector || v instanceof Point3D) {
       this.set(v.x || 0, v.y || 0, v.z || 0);
@@ -3208,16 +3216,45 @@ var Vector = class _Vector {
     }
     return this;
   }
+  /**
+   * 복사본 반환 (비파괴). 파괴적 메서드와 조합해 원본 보존용.
+   * @example
+   * const s = a.get(); s.add(b); // s = a+b, a는 그대로
+   */
   get() {
     return new _Vector(this.x, this.y, this.z);
   }
-  // 피타고라스의 정리는 a의 제곱 더하기 b 의 제곱은 c 의 제곱과 같다는 것을 정의합니다.
-  mag() {
+  /**
+   * 노름(norm). 평평한 공간(유클리드 공간)에서의 직선 거리.
+   * - 수식: ‖v‖ = √(x² + y² + z²)
+   * - 2D에서는 피타고라스 정리 그 자체. 3D는 두 번 적용한 것과 같음.
+   *   (바닥 대각선 √(x²+y²) → 공간 대각선 √((바닥)²+z²))
+   * - "유클리드"는 평평한 공간의 기하학을 말함 (좌표계는 데카르트의 것, 유클리드는 좌표 없이 기하학을 세움).
+   *   휘어진 공간(구면·쌍곡)에서는 이 공식이 성립하지 않음.
+   * @example
+   * new Vector(3, 4, 0).norm(); // 5
+   * new Vector(6, 8, 0).norm(); // 10
+   */
+  norm() {
     const x = this.x;
     const y = this.y;
     const z = this.z;
     return Math.sqrt(x * x + y * y + z * z);
   }
+  /**
+   * norm()의 별칭 (p5.js 호환).
+   * @example
+   * new Vector(3, 4, 0).mag(); // 5
+   */
+  mag() {
+    return this.norm();
+  }
+  /**
+   * 덧셈 (파괴적). 성분별 합. 기하학적으로 평행사변형의 대각선.
+   * - 수식: a + b = (ax+bx, ay+by, az+bz)
+   * @example
+   * const a = new Vector(4, 2); a.add(new Vector(-2, 3)); // a = (2, 5)
+   */
   add(v, y = 0, z = 0) {
     if (v instanceof _Vector || v instanceof Point3D) {
       this.x += v.x;
@@ -3229,12 +3266,24 @@ var Vector = class _Vector {
       this.z += z;
     }
   }
+  /**
+   * 덧셈 결과의 새 벡터 반환 (비파괴).
+   * - 수식: a + b = (ax+bx, ay+by, az+bz)
+   * @example
+   * const s = a.toAdd(a, b); // s = a+b, a·b는 그대로
+   */
   toAdd(v1, v2) {
     return new _Vector(v1.x + v2.x, v1.y + v2.y, v1.x + v2.y);
   }
   // public static add(v1: Vector, v2: Vector): Vector {
   //   return new Vector(v1.x + v2.x, v1.y + v2.y, v1.x + v2.y);
   // }
+  /**
+   * 뺄셈 (파괴적). a - b는 "a에서 b를 되돌리는" 벡터.
+   * - 수식: a - b = (ax-bx, ay-by, az-bz)
+   * @example
+   * const a = new Vector(4, 2); a.sub(new Vector(1, 1)); // a = (3, 1)
+   */
   sub(v, y = 0, z = 0) {
     if (v instanceof _Vector || v instanceof Point3D) {
       this.x -= v.x;
@@ -3246,6 +3295,12 @@ var Vector = class _Vector {
       this.z -= z;
     }
   }
+  /**
+   * 뺄셈 결과의 새 벡터 반환 (비파괴).
+   * - 수식: a - b = (ax-bx, ay-by, az-bz)
+   * @example
+   * const d = a.toSub(b); // d = a-b, a·b는 그대로
+   */
   toSub(v2) {
     const v1 = this;
     return new _Vector(v1.x - v2.x, v1.y - v2.y, v1.z - v2.z);
@@ -3254,6 +3309,12 @@ var Vector = class _Vector {
   // public static sub(v1: Vector, v2: Vector): Vector {
   //     return new Vector(v1.x - v2.x, v1.y - v2.y, v1.z - v2.z);
   // }
+  /**
+   * 스칼라배 또는 성분별 곱 (파괴적). 스칼라 k>1이면 늘어나고, 0<k<1이면 줄어듦. k<0이면 반대 방향.
+   * - 수식(스칼라): k·v = (k·x, k·y, k·z)
+   * @example
+   * const v = new Vector(1, 2); v.mult(3); // v = (3, 6)
+   */
   mult(v) {
     if (v instanceof _Vector || v instanceof Point3D) {
       this.x *= v.x;
@@ -3266,6 +3327,12 @@ var Vector = class _Vector {
     }
     return this;
   }
+  /**
+   * 성분별 곱 결과의 새 벡터 반환 (비파괴).
+   * - 수식: (ax·bx, ay·by, az·bz)
+   * @example
+   * const m = a.toMult(b); // m = 성분별 곱, a·b는 그대로
+   */
   toMult(v2) {
     const v1 = this;
     return new _Vector(v1.x *= v2.x, v1.y *= v2.y, v1.z *= v2.z);
@@ -3273,6 +3340,12 @@ var Vector = class _Vector {
   // public static mult(v1: Vector, v2: Vector) {
   //   return new Vector(v1.x *= v2.x, v1.y *= v2.y, v1.z *= v2.z);
   // }
+  /**
+   * 스칼라 나눗셈 또는 성분별 나눗셈 (파괴적). 정규화의 핵심 연산.
+   * - 수식(스칼라): v/k = (x/k, y/k, z/k)
+   * @example
+   * const v = new Vector(6, 8); v.div(2); // v = (3, 4)
+   */
   div(v) {
     if (v instanceof _Vector || v instanceof Point3D) {
       this.x /= v.x;
@@ -3285,6 +3358,12 @@ var Vector = class _Vector {
     }
     return this;
   }
+  /**
+   * 스칼라 나눗셈 결과의 새 벡터 반환 (비파괴).
+   * - 수식: v/k = (x/k, y/k, z/k)
+   * @example
+   * const h = v.toDiv(2); // h = v/2, v는 그대로
+   */
   toDiv(d) {
     const v = this;
     const rv = v.get();
@@ -3300,10 +3379,22 @@ var Vector = class _Vector {
   //   rv.z /= d;
   //   return rv;
   // }
+  /**
+   * 두 점(벡터) 사이 거리. 차 벡터의 크기.
+   * - 수식: d = √((dx)² + (dy)² + (dz)²)
+   * @example
+   * new Vector(0, 0).dist(new Vector(3, 4)); // 5
+   */
   dist(v) {
     const dx = this.x - v.x, dy = this.y - v.y, dz = this.z - v.z;
     return Math.sqrt(dx * dx + dy * dy + dz * dz);
   }
+  /**
+   * 두 점(벡터) 사이 거리 (toDist는 dist와 동일, 비파괴).
+   * - 수식: d = √((dx)² + (dy)² + (dz)²)
+   * @example
+   * a.toDist(b); // a와 b 사이 거리
+   */
   toDist(v2) {
     const v1 = this;
     const dx = v1.x - v2.x, dy = v1.y - v2.y, dz = v1.z - v2.z;
@@ -3315,36 +3406,90 @@ var Vector = class _Vector {
   //     dz = v1.z - v2.z;
   //   return Math.sqrt(dx * dx + dy * dy + dz * dz);
   // }
-  dot(v, y, z) {
+  /**
+   * 내적(dot product). 두 벡터가 같은 방향을 향하는 정도.
+   * - 수식: a·b = ax·bx + ay·by + az·bz = |a||b|cosθ
+   * - θ=90°면 0(직교), 0°면 최대(같은 방향).
+   * - 벡터 전달 시 y·z 생략 가능, 스칼라(x) 전달 시 y·z와 함께 사용.
+   * @example
+   * new Vector(5, 12).dot(new Vector(-5, 12)); // -25+144 = 119
+   * new Vector(1, 0).dot(new Vector(0, 1));    // 0 (직각)
+   * new Vector(1, 2).dot(3, 4);                // 1*3+2*4 = 11
+   */
+  dot(v, y = 0, z = 0) {
     if (v instanceof _Vector || v instanceof Point3D) {
       return this.x * v.x + this.y * v.y + this.z * v.z;
     }
     ;
     return this.x * v + this.y * y + this.z * z;
   }
+  /**
+   * 외적(cross product). 두 벡터에 수직인 벡터. 오른손 법칙 방향.
+   * - 수식: a×b = (ay·bz − az·by, az·bx − ax·bz, ax·by − ay·bx)
+   * - 2D에서는 z값 = ax·by − ay·bx (부호 있는 면적, 회전 방향 판정용).
+   * @example
+   * new Vector(1, 0, 0).cross(new Vector(0, 1, 0)); // (0, 0, 1)
+   */
   cross(v) {
     const x = this.x, y = this.y, z = this.z;
     return new _Vector(y * v.z - v.y * z, z * v.x - v.z * x, x * v.y - v.x * y);
   }
+  /**
+   * 정규화 (파괴적). 방향은 그대로, 크기를 1로. 단위벡터 v̂ 생성.
+   * - 수식: v̂ = v / |v|
+   * - 영벡터(|v|=0)는 0으로 나누지 않고 그대로 둠.
+   * @example
+   * const v = new Vector(6, 8); v.normalize(); // v = (0.6, 0.8), |v| = 1
+   */
   normalize() {
-    const m = this.mag();
+    const m = this.norm();
     if (m > 0) this.div(m);
   }
+  /**
+   * 크기 상한 (파괴적). 속도가 high를 넘으면 방향 유지한 채 high로 자름. 물리 시뮬레이션 최고속도용.
+   * - 수식: |v| > high → v = v̂ · high
+   * @example
+   * const v = new Vector(6, 8); v.limit(5); // |v|=10 → 5, v = (3, 4)
+   */
   limit(high) {
-    if (this.mag() > high) {
+    if (this.norm() > high) {
       this.normalize();
       this.mult(high);
     }
   }
+  /**
+   * 2D 방향각. +x축 기준 반시계 방향 라디안 (-π ~ π).
+   * - 수식: θ = atan2(y, x)
+   * @example
+   * new Vector(1, 1).heading2D();  // π/4 (45°)
+   * new Vector(-1, 0).heading2D(); // π (180°)
+   */
   heading2D() {
     return -Math.atan2(-this.y, this.x);
   }
+  /**
+   * 무작위 방향 단위벡터 반환 (새 Vector, 자신은 변경 안 함).
+   * @example
+   * const r = new Vector().random2D(); // |r| = 1, 방향 랜덤
+   */
   random2D() {
     return this.fromAngle(Math.random() * (2 * Math.PI));
   }
+  /**
+   * 각도→벡터. 각도 θ, 길이 L인 2D 벡터 반환 (새 Vector).
+   * - 수식: (L·cosθ, L·sinθ, 0)
+   * @example
+   * new Vector().fromAngle(Math.PI / 3, 2); // (1, 1.73, 0)
+   */
   fromAngle(angle, length = 1) {
     return new _Vector(length * Math.cos(angle), length * Math.sin(angle), 0);
   }
+  /**
+   * 구면좌표→3D 벡터 (새 Vector 반환, p5.js 컨벤션).
+   * - 수식: (L·sinθ·sinφ, −L·cosθ, L·sinθ·cosφ)
+   * @example
+   * new Vector().fromAngles(Math.PI / 2, Math.PI / 2, 1); // (1, 0, 0)
+   */
   fromAngles(theta, phi, length = 1) {
     const cosPhi = Math.cos(phi);
     const sinPhi = Math.sin(phi);
@@ -3356,18 +3501,43 @@ var Vector = class _Vector {
       length * sinTheta * cosPhi
     );
   }
+  /**
+   * 성분 배열 반환. [x, y, z] 순서.
+   * @example
+   * new Vector(1, 2, 3).array(); // [1, 2, 3]
+   */
   array() {
     return [this.x, this.y, this.z];
   }
+  /**
+   * Point3D로 변환 (위치 의미로 바꿀 때).
+   * @example
+   * new Vector(1, 2, 3).toPoint3D(); // Point3D(1, 2, 3)
+   */
   toPoint3D() {
     return new Point3D(this.x, this.y, this.z);
   }
+  /**
+   * Point2D로 변환 (z 버림).
+   * @example
+   * new Vector(1, 2, 3).toPoint2D(); // Point2D(1, 2)
+   */
   toPoint2D() {
     return new Point2D(this.x, this.y);
   }
+  /**
+   * 복사본 반환 (get()과 동일, 비파괴).
+   * @example
+   * const c = v.copy(); // v와 같은 성분의 새 벡터
+   */
   copy() {
     return new _Vector(this.x, this.y, this.z);
   }
+  /**
+   * 문자열 표현. "[x, y, z]" 형식.
+   * @example
+   * new Vector(1, 2).toString(); // "[1, 2, 0]"
+   */
   toString() {
     return "[" + this.x + ", " + this.y + ", " + this.z + "]";
   }
@@ -8213,7 +8383,7 @@ var StoreLoader = class {
 
 // ../core/dist/esm/url/UrlUtils.js
 var UrlUtils;
-((UrlUtils2) => {
+(function(UrlUtils2) {
   UrlUtils2.origin = (fullurl) => {
     return new URL(fullurl).origin;
   };
@@ -8251,15 +8421,28 @@ var UrlUtils;
     });
     return searchParams;
   };
+  UrlUtils2.toAbsoluteUrl = (relative, base) => {
+    return new URL(relative, base);
+  };
+  function toAbsoluteRequest(input, base) {
+    if (input instanceof URL) {
+      return UrlUtils2.toAbsoluteUrl(input.href, base);
+    }
+    if (typeof input === "string") {
+      return UrlUtils2.toAbsoluteUrl(input, base).href;
+    }
+    return new Request(UrlUtils2.toAbsoluteUrl(input.url, base).href, input);
+  }
+  UrlUtils2.toAbsoluteRequest = toAbsoluteRequest;
   UrlUtils2.manipulateSearchParams = (searchParams, options) => {
     if (options?.delete) {
-      (0, UrlUtils2.deleteSearchParam)(searchParams, options.delete);
+      UrlUtils2.deleteSearchParam(searchParams, options.delete);
     }
     if (options?.append) {
-      (0, UrlUtils2.appendSearchParam)(searchParams, options.append);
+      UrlUtils2.appendSearchParam(searchParams, options.append);
     }
     if (options?.upsert) {
-      (0, UrlUtils2.upsertSearchParam)(searchParams, options.upsert);
+      UrlUtils2.upsertSearchParam(searchParams, options.upsert);
     }
     return searchParams;
   };
@@ -8981,10 +9164,10 @@ var CssParser = class _CssParser extends CssNode {
         if (remaining && remaining.includes(":")) {
           const parts = remaining.split(":");
           if (parts.length >= 2) {
-            const prop = parts[0].trim();
+            const prop2 = parts[0].trim();
             const val = parts.slice(1).join(":").trim();
-            if (prop && val) {
-              content.push({ type: "declaration", property: prop, value: val });
+            if (prop2 && val) {
+              content.push({ type: "declaration", property: prop2, value: val });
             }
           }
         }
@@ -9025,10 +9208,10 @@ var CssParser = class _CssParser extends CssNode {
           } else if (statement.includes(":")) {
             const parts = statement.split(":");
             if (parts.length >= 2) {
-              const prop = parts[0].trim();
+              const prop2 = parts[0].trim();
               const val = parts.slice(1).join(":").trim();
-              if (prop && val) {
-                content.push({ type: "declaration", property: prop, value: val });
+              if (prop2 && val) {
+                content.push({ type: "declaration", property: prop2, value: val });
               }
             }
           }
@@ -9127,7 +9310,7 @@ var CssParser = class _CssParser extends CssNode {
   }
   static _declarationsToCSS(declarations, indent) {
     const indentStr = "  ".repeat(indent);
-    return Object.entries(declarations).map(([prop, value]) => `${indentStr}${_CssParser._camelToKebab(prop)}: ${value};`).join("\n");
+    return Object.entries(declarations).map(([prop2, value]) => `${indentStr}${_CssParser._camelToKebab(prop2)}: ${value};`).join("\n");
   }
   static _camelToKebab(camelCase) {
     return camelCase.replace(/([a-z0-9]|(?=[A-Z]))([A-Z])/g, "$1-$2").toLowerCase();
@@ -10653,59 +10836,29 @@ function getExpression(value, config) {
   };
 }
 
+// ../core/dist/esm/hash/HashUtils.js
+var HashUtils;
+((HashUtils2) => {
+  const core53 = (str, seed) => {
+    let h1 = 3735928559 ^ seed, h2 = 1103547991 ^ seed;
+    for (let i = 0; i < str.length; i++) {
+      const ch = str.charCodeAt(i);
+      h1 = Math.imul(h1 ^ ch, 2654435761);
+      h2 = Math.imul(h2 ^ ch, 1597334677);
+    }
+    h1 = Math.imul(h1 ^ h1 >>> 16, 2246822507) ^ Math.imul(h2 ^ h2 >>> 13, 3266489909);
+    h2 = Math.imul(h2 ^ h2 >>> 16, 2246822507) ^ Math.imul(h1 ^ h1 >>> 13, 3266489909);
+    return (4294967296 * (2097151 & h2) + (h1 >>> 0)).toString(16).padStart(14, "0");
+  };
+  HashUtils2.hash53 = (str, seed = 0, xyz = 16) => `${core53(str, seed)}${core53(str, seed + 1)}`.slice(0, Math.max(1, xyz));
+})(HashUtils || (HashUtils = {}));
+
 // ../core/dist/esm/index.js
 var src_default = {
   // Core utilities are exported as named exports above
   // Use: import { Observable, Subject, Promises, ... } from '@dooboostore/core'
 };
 
-// src/decorators/addEventListener.ts
-var ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:add-event-listener");
-function addEventListener(selectorOrTarget, type, options = {}) {
-  return (targetObj, propertyKey, descriptor) => {
-    const constructor = targetObj.constructor;
-    let listeners = ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
-    if (!listeners) {
-      listeners = [];
-      ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);
-    }
-    listeners.push({ propertyKey, selector: selectorOrTarget, type, options });
-  };
-}
-function addEventListenerDelegateLightDom(selector, type, options) {
-  return addEventListener(selector, type, { ...options ?? {}, root: "light", delegate: true });
-}
-function addEventListenerDelegateShadowDom(selector, type, options) {
-  return addEventListener(selector, type, { ...options ?? {}, root: "shadow", delegate: true });
-}
-function addEventListenerDelegateAllDom(selector, type, options) {
-  return addEventListener(selector, type, { ...options ?? {}, root: "all", delegate: true });
-}
-function addEventListenerDelegate(selector, type, options) {
-  return addEventListener(selector, type, { ...options ?? {}, root: "auto", delegate: true });
-}
-var event = addEventListener;
-var eventDelegateLightDom = addEventListenerDelegateLightDom;
-var eventDelegateShadowDom = addEventListenerDelegateShadowDom;
-var eventDelegateAllDom = addEventListenerDelegateAllDom;
-var eventDelegate = addEventListenerDelegate;
-function addEventListenerThis(type, options) {
-  return addEventListener("$this", type, options);
-}
-function addEventListenerAppHost(type, options) {
-  return addEventListener("$appHost", type, options);
-}
-function addEventListenerWindow(type, options) {
-  return addEventListener("$window", type, options);
-}
-function addEventListenerDocument(type, options) {
-  return addEventListener("$document", type, options);
-}
-var getAddEventListenerMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
-};
-
 // ../core/dist/esm/message/operators/debounceTime.js
 function debounceTime(duration, config) {
   return (source) => {
@@ -10855,157 +11008,6 @@ function throttleTime2(duration, config) {
   };
 }
 
-// src/decorators/lifecycles.ts
-var ON_INITIALIZE_METADATA_KEY = Symbol.for("simple-web-component:on-constructor");
-var ON_BEFORE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-connected");
-var ON_AFTER_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-connected");
-var ON_BEFORE_DISCONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-disconnected");
-var ON_AFTER_DISCONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-disconnected");
-var ON_BEFORE_ADOPTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-adopted");
-var ON_AFTER_ADOPTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-adopted");
-var ON_ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:on-add-event-listener");
-var ON_CONNECTED_BODY_METADATA_KEY = Symbol.for("simple-web-component:on-connected-body");
-var ON_CONNECTED_SWC_APP_METADATA_KEY = Symbol.for("simple-web-component:on-connected-swc-app");
-var ON_CONNECTED_COMPLETED_METADATA_KEY = Symbol.for("simple-web-component:on-completed");
-var ATTRIBUTE_CHANGED_WILDCARD = "*";
-function onConnectedBefore(arg1, arg2, arg3) {
-  const decorator2 = (options, target, propertyKey) => {
-    const constructor = target.constructor;
-    let list = ReflectUtils.getMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, constructor);
-    if (!list) {
-      list = [];
-      ReflectUtils.defineMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, list, constructor);
-    }
-    list.push({ propertyKey, options });
-  };
-  if (arg2) {
-    return decorator2({}, arg1, arg2);
-  }
-  return (target, propertyKey) => {
-    decorator2(arg1 || {}, target, propertyKey);
-  };
-}
-function onConnectedAfter(arg1, arg2, arg3) {
-  const decorator2 = (options, target, propertyKey) => {
-    const constructor = target.constructor;
-    let list = ReflectUtils.getMetadata(ON_AFTER_CONNECTED_METADATA_KEY, constructor);
-    if (!list) {
-      list = [];
-      ReflectUtils.defineMetadata(ON_AFTER_CONNECTED_METADATA_KEY, list, constructor);
-    }
-    list.push({ propertyKey, options });
-  };
-  if (arg2) {
-    return decorator2({}, arg1, arg2);
-  }
-  return (target, propertyKey) => {
-    decorator2(arg1 || {}, target, propertyKey);
-  };
-}
-function createLifecycleDecoratorWithOptions(metadataKey) {
-  return function(optionOrTarget, propertyKey) {
-    if (propertyKey) {
-      const constructor = optionOrTarget.constructor;
-      let list = ReflectUtils.getOwnMetadata(metadataKey, constructor);
-      if (!list) {
-        list = [];
-        ReflectUtils.defineMetadata(metadataKey, list, constructor);
-      }
-      list.push({ propertyKey, order: 0 });
-      return;
-    }
-    return (target, propertyKey2) => {
-      const constructor = target.constructor;
-      let list = ReflectUtils.getOwnMetadata(metadataKey, constructor);
-      if (!list) {
-        list = [];
-        ReflectUtils.defineMetadata(metadataKey, list, constructor);
-      }
-      list.push({ propertyKey: propertyKey2, order: optionOrTarget?.order ?? 0 });
-    };
-  };
-}
-function onInitialize(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_INITIALIZE_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-function onDisconnectedBefore(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_BEFORE_DISCONNECTED_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-function onDisconnectedAfter(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_AFTER_DISCONNECTED_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-var onDisconnected = onDisconnectedAfter;
-function onAdoptedBefore(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_BEFORE_ADOPTED_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-function onAdoptedAfter(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_AFTER_ADOPTED_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-var onAdopted = onAdoptedAfter;
-function onConnectedSwcApp(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_CONNECTED_SWC_APP_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-function onConnectedCompleted(optionOrTarget, propertyKey) {
-  return createLifecycleDecoratorWithOptions(ON_CONNECTED_COMPLETED_METADATA_KEY)(optionOrTarget, propertyKey);
-}
-var decorator = (options, target, propertyKey) => {
-  const constructor = target.constructor;
-  let list = ReflectUtils.getMetadata(ON_CONNECTED_BODY_METADATA_KEY, constructor);
-  if (!list) {
-    list = [];
-    ReflectUtils.defineMetadata(ON_CONNECTED_BODY_METADATA_KEY, list, constructor);
-  }
-  list.push({ propertyKey, options });
-};
-function onConnectedBodyShadow(optionOrTarget, propertyKey, arg3) {
-  if (propertyKey) {
-    return decorator({ useShadow: true }, optionOrTarget, propertyKey);
-  }
-  return (target, propertyKey2) => {
-    decorator({ ...optionOrTarget ?? {}, useShadow: true }, target, propertyKey2);
-  };
-}
-function onConnectedBodyLight(optionOrTarget, propertyKey, arg3) {
-  if (propertyKey) {
-    return decorator({ useShadow: false }, optionOrTarget, propertyKey);
-  }
-  return (target, propertyKey2) => {
-    decorator({ ...optionOrTarget ?? {}, useShadow: false }, target, propertyKey2);
-  };
-}
-function onConnectedBody(optionOrTarget, propertyKey, arg3) {
-  if (propertyKey) {
-    return decorator({}, optionOrTarget, propertyKey);
-  }
-  return (target, propertyKey2) => {
-    decorator(optionOrTarget || {}, target, propertyKey2);
-  };
-}
-var findAllLifecycleMetadata = (target, metadataKey) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  const results = ReflectUtils.getOwnMetadata(metadataKey, constructor) ?? [];
-  return [...results].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
-};
-var findAllOnConnectedMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  const results = ReflectUtils.getMetadata(ON_CONNECTED_BODY_METADATA_KEY, constructor) ?? [];
-  return [...results].sort((a, b) => {
-    const orderA = a.options?.order ?? 0;
-    const orderB = b.options?.order ?? 0;
-    return orderA - orderB;
-  });
-};
-var findAllOnConnectedBeforeMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  const results = ReflectUtils.getMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, constructor) ?? [];
-  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
-};
-var findAllOnConnectedAfterMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  const results = ReflectUtils.getMetadata(ON_AFTER_CONNECTED_METADATA_KEY, constructor) ?? [];
-  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
-};
-
 // ../core-web/dist/esm/index.js
 var esm_exports2 = {};
 __export(esm_exports2, {
@@ -11163,7 +11165,7 @@ var ElementUtils;
     return Array.from(documentFragment.childNodes);
   };
   ElementUtils2.cloneNodeList = (documentFragment) => {
-    return Array.from(documentFragment.childNodes).map((node) => node.cloneNode(true));
+    return Array.from(documentFragment.childNodes).map((node2) => node2.cloneNode(true));
   };
   ElementUtils2.querySelector = (e, selector) => {
     const elements = ElementUtils2.querySelectorAll(e, selector);
@@ -11226,12 +11228,12 @@ var ElementUtils;
     return attribute2;
   };
   ElementUtils2.getStyleToObject = (input) => {
-    const style = {};
+    const style2 = {};
     for (let i = 0; i < input.style.length; i++) {
       const key = input.style[i];
-      style[key] = input.style[key];
+      style2[key] = input.style[key];
     }
-    return style;
+    return style2;
   };
 })(ElementUtils || (ElementUtils = {}));
 
@@ -11265,26 +11267,26 @@ var ElementApply = class _ElementApply {
     }
     return variables;
   }
-  getTarget(node, id) {
-    if (node.nodeType === this.window.Node.COMMENT_NODE || node.data?.trim?.()?.startsWith(`ea:${this.id}:start:html`) || node.data?.trim?.()?.startsWith(`ea:${this.id}:start:text`)) {
-      const fullStr = node.data?.trim?.();
+  getTarget(node2, id) {
+    if (node2.nodeType === this.window.Node.COMMENT_NODE || node2.data?.trim?.()?.startsWith(`ea:${this.id}:start:html`) || node2.data?.trim?.()?.startsWith(`ea:${this.id}:start:text`)) {
+      const fullStr = node2.data?.trim?.();
       let [prefix, ...rest] = fullStr?.split(" ") ?? [];
       prefix = prefix.trim?.();
       const script = rest.join(" ");
       const [eaPrefix, eaId, startEnd, type] = prefix?.split(":") ?? [];
       const endPrefix = `${eaPrefix}:${eaId}:end:${type}`;
-      let next = node.nextSibling;
+      let next = node2.nextSibling;
       while (next) {
         if (next.nodeType === Node.COMMENT_NODE && next.data?.trim?.()?.startsWith(endPrefix)) {
-          return { nodeType: "comment", type, start: node, end: next, script: script ?? "", variables: this.findVariables(script) };
+          return { nodeType: "comment", type, start: node2, end: next, script: script ?? "", variables: this.findVariables(script) };
         }
         next = next.nextSibling;
       }
-    } else if (node.nodeType === Node.ELEMENT_NODE) {
-      const aa = node.getAttributeNames().filter((name) => {
+    } else if (node2.nodeType === Node.ELEMENT_NODE) {
+      const aa = node2.getAttributeNames().filter((name) => {
         return name.startsWith(`ea:${id}:attribute:`) || name.startsWith(`ea:${id}:event:`) || name.startsWith(`ea:${id}:property:`);
       });
-      const element = node;
+      const element = node2;
       const types = aa.map((attrName) => {
         const [eaPrefix, eaId, type, name] = attrName?.split(":") ?? [];
         if (eaPrefix === "ea" && eaId === id && (type === "attribute" || type === "event" || type === "property") && name) {
@@ -11316,8 +11318,8 @@ var ElementApply = class _ElementApply {
     const targets = [];
     targetRoots.forEach((el) => {
       const walker = this.document.createTreeWalker(el, this.window.NodeFilter.SHOW_ELEMENT | this.window.NodeFilter.SHOW_COMMENT, {
-        acceptNode: (node) => {
-          const target = this.getTarget(node, this.id);
+        acceptNode: (node2) => {
+          const target = this.getTarget(node2, this.id);
           if (target) {
             targets.push(target);
             return this.window.NodeFilter.FILTER_ACCEPT;
@@ -11480,18 +11482,18 @@ var NodeUtils;
     FindNodesFilterResult2["NO_MATCH_AND_CONTINUE"] = "NO_MATCH_AND_CONTINUE";
     FindNodesFilterResult2["NO_MATCH_AND_SKIP_CHILDREN"] = "NO_MATCH_AND_SKIP_CHILDREN";
   })(FindNodesFilterResult = NodeUtils2.FindNodesFilterResult || (NodeUtils2.FindNodesFilterResult = {}));
-  NodeUtils2.removeAllChildNode = (node) => {
-    while (node?.firstChild) {
-      node.firstChild.remove();
+  NodeUtils2.removeAllChildNode = (node2) => {
+    while (node2?.firstChild) {
+      node2.firstChild.remove();
     }
   };
-  NodeUtils2.removeAllChildNodeAndAppend = (node, newNode) => {
-    (0, NodeUtils2.removeAllChildNode)(node);
+  NodeUtils2.removeAllChildNodeAndAppend = (node2, newNode) => {
+    (0, NodeUtils2.removeAllChildNode)(node2);
     if (Array.isArray(newNode)) {
-      newNode.forEach((it) => node.appendChild(it));
+      newNode.forEach((it) => node2.appendChild(it));
       return;
     }
-    node.appendChild(newNode);
+    node2.appendChild(newNode);
   };
   NodeUtils2.appendChild = (parentNode, childNode) => {
     return parentNode.appendChild(childNode);
@@ -11507,11 +11509,11 @@ var NodeUtils;
   };
   NodeUtils2.findNodes = (rootNode, filter) => {
     const foundNodes = [];
-    function traverse(node) {
-      if (!node) {
+    function traverse(node2) {
+      if (!node2) {
         return;
       }
-      node.childNodes.forEach((child) => {
+      node2.childNodes.forEach((child) => {
         const result = filter(child);
         if (result === "MATCH_AND_CONTINUE" || result === "MATCH_AND_SKIP_CHILDREN") {
           foundNodes.push(child);
@@ -11754,26 +11756,26 @@ var NodeSlot = class _NodeSlot {
     if (!doc || !win) return result;
     const find = (target) => {
       const walker = doc.createTreeWalker(target, win.NodeFilter.SHOW_COMMENT, null, false);
-      let node = walker.nextNode();
+      let node2 = walker.nextNode();
       const markerData = targetId ? _NodeSlot.startEndMarkerData(this.id, targetId) : { start: this.startMarkerData, end: this.endMarkerData };
       const startPrefix = markerData.start + ":";
-      while (node) {
-        const data = node.data;
+      while (node2) {
+        const data = node2.data;
         if (data && data.indexOf(startPrefix) === 0) {
           const uid = data.substring(startPrefix.length);
           const expectedEnd = `${markerData.end}:${uid}`;
-          let sibling = node.nextSibling;
+          let sibling = node2.nextSibling;
           let foundEnd = null;
           while (sibling) {
-            if (sibling.nodeType === win.Node.COMMENT_NODE && sibling.data === expectedEnd && sibling.parentNode === node.parentNode) {
+            if (sibling.nodeType === win.Node.COMMENT_NODE && sibling.data === expectedEnd && sibling.parentNode === node2.parentNode) {
               foundEnd = sibling;
               break;
             }
             sibling = sibling.nextSibling;
           }
-          result.push(new Slot(node, foundEnd));
+          result.push(new Slot(node2, foundEnd));
         }
-        node = walker.nextNode();
+        node2 = walker.nextNode();
       }
     };
     if (this.host.shadowRoot) {
@@ -13094,7 +13096,7 @@ var StyleCssUtils;
         try {
           Array.from(sheet.cssRules).forEach((rule) => {
             if ("style" in rule && rule.style instanceof CSSStyleDeclaration) {
-              Array.from(rule.style).filter((prop) => prop.startsWith("--")).forEach((prop) => variables.add(prop));
+              Array.from(rule.style).filter((prop2) => prop2.startsWith("--")).forEach((prop2) => variables.add(prop2));
             }
           });
         } catch (e) {
@@ -13103,7 +13105,7 @@ var StyleCssUtils;
       });
     }
     const computedStyles = config.window.getComputedStyle(targetElement);
-    Array.from(computedStyles).filter((prop) => prop.startsWith("--")).forEach((it) => {
+    Array.from(computedStyles).filter((prop2) => prop2.startsWith("--")).forEach((it) => {
       variables.add(it);
     });
     return Array.from(variables).map((it) => [it, computedStyles.getPropertyValue(it)]);
@@ -13466,9 +13468,9 @@ var SwcUtils;
     } else if (htmlOrNode) {
       const nodes = Array.isArray(htmlOrNode) ? htmlOrNode : [htmlOrNode];
       const window2 = document2.defaultView;
-      nodes.forEach((node) => {
-        node.normalize();
-        const nodes2 = document2.createTreeWalker(node, window2.NodeFilter.SHOW_ELEMENT | window2.NodeFilter.SHOW_COMMENT);
+      nodes.forEach((node2) => {
+        node2.normalize();
+        const nodes2 = document2.createTreeWalker(node2, window2.NodeFilter.SHOW_ELEMENT | window2.NodeFilter.SHOW_COMMENT);
         const getSlotData = (s) => {
           return s.match(/^\[\[([\s\S]+)\]\]$/)?.[1]?.trim();
         };
@@ -13644,10 +13646,1116 @@ var SwcUtils;
   };
 })(SwcUtils || (SwcUtils = {}));
 
-// src/decorators/emitCustomEvent.ts
-var EMIT_CUSTOM_EVENT_METADATA_KEY = Symbol.for("simple-web-component:emit-custom-event");
-function emitCustomEvent(selectorOrTarget, typeOrPropertyKey, optionsOrDescriptor) {
-  if (typeof selectorOrTarget === "object" && typeof typeOrPropertyKey === "string" && typeof optionsOrDescriptor === "object" && "value" in optionsOrDescriptor) {
+// src/decorators/addEventListener.ts
+var ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:add-event-listener");
+function addEventListener(selectorOrType, typeOrOptions, maybeOptions) {
+  return (targetObj, propertyKey, descriptor) => {
+    let selector;
+    let types;
+    let opts = {};
+    if (typeof typeOrOptions === "string" || Array.isArray(typeOrOptions)) {
+      selector = selectorOrType;
+      types = Array.isArray(typeOrOptions) ? typeOrOptions : [typeOrOptions];
+      opts = maybeOptions ?? {};
+    } else {
+      selector = "$this";
+      if (Array.isArray(selectorOrType)) types = selectorOrType;
+      else types = [selectorOrType];
+      opts = typeOrOptions ?? {};
+    }
+    const constructor = targetObj.constructor;
+    let listeners = ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
+    if (!listeners) {
+      listeners = [];
+      ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);
+    }
+    for (const type of types) listeners.push({ propertyKey, selector, type, options: opts });
+  };
+}
+function addEventListenerDelegateLight(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "light", delegate: true });
+}
+function addEventListenerDelegateShadow(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "shadow", delegate: true });
+}
+function addEventListenerDelegateAll(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "all", delegate: true });
+}
+function addEventListenerDelegate(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "auto", delegate: true });
+}
+function addEventListenerMutationLight(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "light", delegate: "mutation" });
+}
+function addEventListenerMutationShadow(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "shadow", delegate: "mutation" });
+}
+function addEventListenerMutationAll(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "all", delegate: "mutation" });
+}
+function addEventListenerMutation(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "auto", delegate: "mutation" });
+}
+function addEventListenerLight(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "light" });
+}
+function addEventListenerShadow(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "shadow" });
+}
+function addEventListenerAll(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "all" });
+}
+function addEventListenerThis(type, options) {
+  return addEventListener("$this", type, options);
+}
+function addEventListenerAppHost(type, options) {
+  return addEventListener("$appHost", type, options);
+}
+function addEventListenerWindow(type, options) {
+  return addEventListener("$window", type, options);
+}
+function addEventListenerDocument(type, options) {
+  return addEventListener("$document", type, options);
+}
+var event = addEventListener;
+var eventDelegateLight = addEventListenerDelegateLight;
+var eventDelegateShadow = addEventListenerDelegateShadow;
+var eventDelegateAll = addEventListenerDelegateAll;
+var eventDelegate = addEventListenerDelegate;
+var eventMutationLight = addEventListenerMutationLight;
+var eventMutationShadow = addEventListenerMutationShadow;
+var eventMutationAll = addEventListenerMutationAll;
+var eventMutation = addEventListenerMutation;
+var eventLight = addEventListenerLight;
+var eventShadow = addEventListenerShadow;
+var eventAll = addEventListenerAll;
+var eventAppHost = addEventListenerAppHost;
+var eventWindow = addEventListenerWindow;
+var eventDocument = addEventListenerDocument;
+var eventThis = addEventListenerThis;
+var getAddEventListenerMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
+};
+var EventListenerLifeCycler = class {
+  constructor() {
+    /** 인스턴스별 boundListeners 상태 (시클러는 elementDefine 시 1회 생성되어 공유되므로) */
+    __publicField(this, "boundListenersMap", /* @__PURE__ */ new WeakMap());
+    /** 인스턴스별 delegate:'mutation' 바인딩 추적 WeakSet — MutationObserverLifeCycler 에서 참조 */
+    __publicField(this, "eventBoundSetsMap", /* @__PURE__ */ new WeakMap());
+  }
+  // ── 외부(MutationObserverLifeCycler)에서 직접 사용하는 공개 헬퍼 ──
+  /** 인스턴스별 boundListeners 를 반환한다 (없으면 생성). */
+  getBoundListeners(inst) {
+    let list = this.boundListenersMap.get(inst);
+    if (!list) {
+      list = [];
+      this.boundListenersMap.set(inst, list);
+    }
+    return list;
+  }
+  /** 인스턴스별 eventBoundSets 를 반환한다 (없으면 생성). */
+  getEventBoundSets(inst) {
+    let map = this.eventBoundSetsMap.get(inst);
+    if (!map) {
+      map = /* @__PURE__ */ new Map();
+      this.eventBoundSetsMap.set(inst, map);
+    }
+    return map;
+  }
+  /**
+   * target 에 meta 이벤트를 직접 바인딩한다.
+   * delegate:'mutation' 초기/동적 바인딩에서 호출된다.
+   */
+  bindDirect(helperHostSet, target, meta) {
+    const inst = helperHostSet.$this;
+    const currentWin = helperHostSet.$w;
+    const { type, options } = meta;
+    const opts = { capture: options.capture, once: options.once, passive: options.passive };
+    const handler = async (event2) => {
+      if (options.filter) {
+        const helper = SwcUtils.getHelperAndHostSet(currentWin, target);
+        if (!options.filter(event2, { currentThis: inst, helper })) return;
+      }
+      if (options.stopPropagation) event2.stopPropagation();
+      if (options.stopImmediatePropagation) event2.stopImmediatePropagation();
+      if (options.preventDefault) event2.preventDefault();
+      const currentHostSet = SwcUtils.getHostSet(inst);
+      await inst[meta.propertyKey](event2, { currentHostSet, $matchedElement: event2.currentTarget }, { event: event2, ...currentHostSet, $el: target, $root: target });
+    };
+    const eventSubject = new Subject();
+    let eventStream = eventSubject;
+    if (options.debounceTime && options.debounceTime > 0)
+      eventStream = eventStream.pipe(debounceTime(options.debounceTime));
+    if (options.throttleTime && options.throttleTime > 0)
+      eventStream = eventStream.pipe(throttleTime2(options.throttleTime));
+    if (options.distinctUntilChanged !== void 0 && options.distinctUntilChanged !== false) {
+      eventStream = typeof options.distinctUntilChanged === "function" ? eventStream.pipe(distinctUntilChanged(options.distinctUntilChanged)) : eventStream.pipe(distinctUntilChanged());
+    }
+    const subscription = eventStream.subscribe({
+      next: (e) => handler(e).catch((err) => console.error("Event handler error:", err)),
+      error: (err) => console.error("Event stream error:", err)
+    });
+    const wrappedHandler = (event2) => eventSubject.next(event2);
+    target.addEventListener(type, wrappedHandler, opts);
+    const onRemoves = options.removeListener ? [{ fn: options.removeListener, opts: options }] : [];
+    this.getBoundListeners(inst).push({ target, type, handler: wrappedHandler, options: opts, subscription, onRemoves, meta });
+  }
+  /** target + meta 조합 리스너를 제거한다. MutationObserver 추적 요소 제거 시 호출. */
+  unbindDirect(helperHostSet, target, meta) {
+    const inst = helperHostSet.$this;
+    const list = this.getBoundListeners(inst);
+    for (let i = list.length - 1; i >= 0; i--) {
+      const l = list[i];
+      if (l.target === target && l.type === meta.type && l.meta === meta) {
+        try {
+          l.target.removeEventListener(l.type, l.handler, l.options);
+          l.subscription?.unsubscribe?.();
+        } catch (e) {
+          console.error("[SWC] unbindDirect error:", e);
+        }
+        for (const r of l.onRemoves ?? []) {
+          try {
+            r.fn(l.target, r.opts);
+          } catch (e) {
+            console.error("[SWC] unbindDirect removeListener error:", e);
+          }
+        }
+        list.splice(i, 1);
+      }
+    }
+  }
+  /**
+   * 메타데이터 목록을 delegate / mutationDelegate / nonDelegate 로 분류한다.
+   * MutationObserverLifeCycler 에서 mutationDelegate 목록을 꺼낼 때 사용한다.
+   */
+  classifyListeners(metaList) {
+    const isSpecial = (sel) => [
+      "$window",
+      "$document",
+      "$host",
+      "$appHost",
+      "$firstHost",
+      "$lastHost",
+      "$firstAppHost",
+      "$lastAppHost",
+      "$hosts",
+      "$appHosts",
+      "$this",
+      ""
+    ].includes(sel);
+    const delegateListeners = [];
+    const mutationDelegateListeners = [];
+    const nonDelegateListeners = [];
+    for (const meta of metaList) {
+      const isStr = typeof meta.selector === "string";
+      const mode = meta.options.delegate;
+      if (mode && isStr && !isSpecial(meta.selector)) {
+        mode === "mutation" ? mutationDelegateListeners.push(meta) : delegateListeners.push(meta);
+      } else {
+        nonDelegateListeners.push(meta);
+      }
+    }
+    return { delegateListeners, mutationDelegateListeners, nonDelegateListeners };
+  }
+  // ── ElementDefineLifeCycler 구현 ──
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const currentWin = helperHostSet.$w;
+    this.boundListenersMap.delete(inst);
+    this.eventBoundSetsMap.delete(inst);
+    const allMeta = getAddEventListenerMetadata(inst) ?? [];
+    const { delegateListeners, nonDelegateListeners, mutationDelegateListeners } = this.classifyListeners(allMeta);
+    const groups = /* @__PURE__ */ new Map();
+    for (const meta of delegateListeners) {
+      const key = `${meta.type}:${meta.options.root || "auto"}`;
+      if (!groups.has(key)) groups.set(key, []);
+      groups.get(key).push(meta);
+    }
+    groups.forEach((metaList, key) => {
+      const ci = key.indexOf(":");
+      const type = key.slice(0, ci);
+      const r = key.slice(ci + 1);
+      const opts = { capture: metaList[0].options.capture, once: metaList[0].options.once, passive: metaList[0].options.passive };
+      const roots = [];
+      if (r === "auto") roots.push(inst.shadowRoot || inst);
+      else if (r === "light") roots.push(inst);
+      else if (r === "shadow" && inst.shadowRoot) roots.push(inst.shadowRoot);
+      else if (r === "all") {
+        roots.push(inst);
+        if (inst.shadowRoot) roots.push(inst.shadowRoot);
+      }
+      for (const br of roots) {
+        const sorted = [...metaList].sort((a, b) => (b.options.stopPropagation ? 1 : 0) - (a.options.stopPropagation ? 1 : 0));
+        const handler = async (event2) => {
+          for (const m of sorted) {
+            const matchedEl = event2.target?.closest(m.selector);
+            console.log("[DBG][delegate] type=", event2.type, "| evtTarget=", event2.target?.tagName, "| sel=", m.selector, "| matchedEl=", matchedEl?.className || matchedEl?.tagName, "| brContains=", br.contains?.(matchedEl), "| brTag=", br.tagName || br.constructor?.name);
+            if (matchedEl && br.contains(matchedEl)) {
+              if (m.options.filter) {
+                const helper = SwcUtils.getHelperAndHostSet(currentWin, matchedEl);
+                if (!m.options.filter(event2, { currentThis: inst, helper })) continue;
+              }
+              if (m.options.stopPropagation) event2.stopPropagation();
+              if (m.options.stopImmediatePropagation) event2.stopImmediatePropagation();
+              if (m.options.preventDefault) event2.preventDefault();
+              const hs = SwcUtils.getHostSet(inst);
+              await inst[m.propertyKey](event2, { ...hs, $matchedElement: matchedEl }, { event: event2, ...hs, $el: matchedEl, $root: br });
+              if (event2.cancelBubble) break;
+            }
+          }
+        };
+        br.addEventListener(type, handler, opts);
+        if (type === "click") {
+          console.log("[DBG][eventCycler] bound click on br=", br.tagName || br.constructor?.name, "| inst=", inst.tagName || inst.constructor?.name, "| isSame=", br === inst);
+        }
+        const onRemoves = sorted.filter((m) => m.options.removeListener).map((m) => ({ fn: m.options.removeListener, opts: m.options }));
+        this.getBoundListeners(inst).push({ target: br, type, handler, options: opts, onRemoves });
+      }
+    });
+    for (const meta of nonDelegateListeners) {
+      const { selector, options } = meta;
+      const r = options.root || "auto";
+      const bindTargets = [];
+      let resolvedSel = null;
+      if (typeof selector === "function") {
+        const result = selector(inst, helperHostSet);
+        if (typeof result === "string") resolvedSel = result;
+        else if (result instanceof currentWin.Element) bindTargets.push(result);
+        else if (result instanceof currentWin.NodeList) bindTargets.push(...Array.from(result));
+        else if (Array.isArray(result)) bindTargets.push(...result);
+      } else {
+        resolvedSel = selector;
+      }
+      const applyRoot = (t) => {
+        if (!t) return;
+        if (r === "auto") bindTargets.push(t.shadowRoot || t);
+        else {
+          if (r === "light" || r === "all") bindTargets.push(t);
+          if ((r === "shadow" || r === "all") && t.shadowRoot) bindTargets.push(t.shadowRoot);
+        }
+      };
+      if (resolvedSel) {
+        if (resolvedSel === "$window") bindTargets.push(currentWin);
+        else if (resolvedSel === "$document") bindTargets.push(currentWin.document);
+        else if (resolvedSel === "$host") applyRoot(helperHostSet.$host);
+        else if (resolvedSel === "$parentHost") applyRoot(helperHostSet.$parentHost);
+        else if (resolvedSel === "$appHost") applyRoot(helperHostSet.$appHost);
+        else if (resolvedSel === "$firstHost") applyRoot(helperHostSet.$firstHost);
+        else if (resolvedSel === "$lastHost") applyRoot(helperHostSet.$lastHost);
+        else if (resolvedSel === "$firstAppHost") applyRoot(helperHostSet.$firstAppHost);
+        else if (resolvedSel === "$lastAppHost") applyRoot(helperHostSet.$lastAppHost);
+        else if (resolvedSel === "$hosts") helperHostSet.$hosts.forEach(applyRoot);
+        else if (resolvedSel === "$appHosts") helperHostSet.$appHosts.forEach(applyRoot);
+        else if (resolvedSel === "$this" || !resolvedSel) applyRoot(inst);
+        else {
+          const searchRoots = [];
+          if (r === "auto") searchRoots.push(inst.shadowRoot || inst);
+          else if (r === "light") searchRoots.push(inst);
+          else if (r === "shadow" && inst.shadowRoot) searchRoots.push(inst.shadowRoot);
+          else if (r === "all") {
+            searchRoots.push(inst);
+            if (inst.shadowRoot) searchRoots.push(inst.shadowRoot);
+          }
+          for (const sr of searchRoots) sr.querySelectorAll(resolvedSel).forEach((el) => bindTargets.push(el));
+        }
+      }
+      for (const t of bindTargets) this.bindDirect(helperHostSet, t, meta);
+    }
+    if (mutationDelegateListeners.length > 0) {
+      const shadowEventDelegates = mutationDelegateListeners.filter((m) => {
+        const r = m.options.root || "auto";
+        return inst.shadowRoot && (r === "shadow" || r === "all" || r === "auto");
+      });
+      const lightEventDelegates = mutationDelegateListeners.filter((m) => {
+        const r = m.options.root || "auto";
+        return r === "light" || r === "all" || !inst.shadowRoot && r === "auto";
+      });
+      const buildMutationEntry = (root, eventDelegates) => {
+        if (eventDelegates.length === 0) return null;
+        const boundSets = this.getEventBoundSets(inst);
+        const callback = (mutations, obs) => {
+          for (const m of eventDelegates) {
+            let boundSet = boundSets.get(m);
+            if (!boundSet) {
+              boundSet = /* @__PURE__ */ new WeakSet();
+              boundSets.set(m, boundSet);
+            }
+            const isThis = m.selector === "$this" || m.selector === "";
+            const matchesSel = (n) => {
+              if (!n || n.nodeType !== 1) return false;
+              if (isThis) return true;
+              return typeof m.selector === "string" && n.matches?.(m.selector);
+            };
+            const bindEl = (el) => {
+              if (!boundSet.has(el)) {
+                this.bindDirect(helperHostSet, el, m);
+                boundSet.add(el);
+              }
+            };
+            const unbindEl = (el) => {
+              if (boundSet.has(el)) {
+                this.unbindDirect(helperHostSet, el, m);
+                boundSet.delete(el);
+              }
+            };
+            for (const mut of mutations) {
+              Array.from(mut.addedNodes || []).forEach((n) => {
+                if (n.nodeType !== 1) return;
+                if (matchesSel(n)) bindEl(n);
+                else if (!isThis && typeof m.selector === "string") n.querySelectorAll?.(m.selector).forEach(bindEl);
+              });
+              Array.from(mut.removedNodes || []).forEach((n) => {
+                if (n.nodeType !== 1) return;
+                const el = n;
+                if (matchesSel(el)) unbindEl(el);
+                else if (!isThis && typeof m.selector === "string") el.querySelectorAll?.(m.selector).forEach(unbindEl);
+              });
+            }
+          }
+        };
+        for (const m of eventDelegates) {
+          let boundSet = boundSets.get(m);
+          if (!boundSet) {
+            boundSet = /* @__PURE__ */ new WeakSet();
+            boundSets.set(m, boundSet);
+          }
+          if (typeof m.selector !== "string") continue;
+          if (m.selector === "$this" || m.selector === "") {
+            this.bindDirect(helperHostSet, root, m);
+            boundSet.add(root);
+          } else {
+            root.querySelectorAll(m.selector).forEach((el) => {
+              if (!boundSet.has(el)) {
+                this.bindDirect(helperHostSet, el, m);
+                boundSet.add(el);
+              }
+            });
+          }
+        }
+        return { target: root, options: { childList: true, subtree: true }, callback };
+      };
+      const shadowEntry = inst.shadowRoot ? buildMutationEntry(inst.shadowRoot, shadowEventDelegates) : null;
+      const lightEntry = buildMutationEntry(inst, lightEventDelegates);
+      const mutationObserverSet = [shadowEntry, lightEntry].filter(Boolean);
+      if (mutationObserverSet.length > 0) return { mutationObserverSet };
+    }
+    return void 0;
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const list = this.boundListenersMap.get(inst) ?? [];
+    for (const l of list) {
+      try {
+        l.target.removeEventListener(l.type, l.handler, l.options);
+        l.subscription?.unsubscribe?.();
+      } catch (e) {
+        console.error("[SWC] EventListenerLifeCycler cleanup error:", e);
+      }
+      for (const r of l.onRemoves ?? []) {
+        try {
+          r.fn(l.target, r.opts);
+        } catch (e) {
+          console.error("[SWC] removeListener error:", e);
+        }
+      }
+    }
+    this.boundListenersMap.delete(inst);
+    this.eventBoundSetsMap.delete(inst);
+  }
+};
+
+// src/decorators/mutationObserver.ts
+var MUTATION_OBSERVER_METADATA_KEY = Symbol.for("simple-web-component:mutation-observer");
+function mutationObserver(selectorOrOptions, maybeOptions) {
+  return (targetObj, propertyKey, descriptor) => {
+    let selector = "$this";
+    let options = {};
+    if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+      selector = selectorOrOptions;
+      options = maybeOptions ?? {};
+    } else {
+      selector = "$this";
+      options = selectorOrOptions ?? {};
+    }
+    const constructor = targetObj.constructor;
+    let observers = ReflectUtils.getMetadata(MUTATION_OBSERVER_METADATA_KEY, constructor);
+    if (!observers) {
+      observers = [];
+      ReflectUtils.defineMetadata(MUTATION_OBSERVER_METADATA_KEY, observers, constructor);
+    }
+    observers.push({ propertyKey, selector, options });
+  };
+}
+function mutationObserverThis(options) {
+  return mutationObserver("$this", options);
+}
+function mutationObserverDelegateLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light", delegate: true });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "light", delegate: true });
+}
+function mutationObserverDelegateShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow", delegate: true });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "shadow", delegate: true });
+}
+function mutationObserverDelegateAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all", delegate: true });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "all", delegate: true });
+}
+function mutationObserverDelegate(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "auto", delegate: true });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "auto", delegate: true });
+}
+function mutationObserverLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light" });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "light" });
+}
+function mutationObserverShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow" });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "shadow" });
+}
+function mutationObserverAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return mutationObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all" });
+  }
+  return mutationObserver({ ...selectorOrOptions ?? {}, root: "all" });
+}
+function getMutationObserverMetadata(target) {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.getMetadata(MUTATION_OBSERVER_METADATA_KEY, constructor);
+}
+var MutationObserverLifeCycler = class {
+  constructor() {
+    __publicField(this, "removeObserverCallbacksMap", /* @__PURE__ */ new WeakMap());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const currentWin = helperHostSet.$w;
+    const removeObserverCallbacks = [];
+    this.removeObserverCallbacksMap.set(inst, removeObserverCallbacks);
+    const allMeta = getMutationObserverMetadata(inst) ?? [];
+    if (allMeta.length === 0) return;
+    const shadowMetas = allMeta.filter((m) => {
+      const r = m.options.root || "auto";
+      return inst.shadowRoot && (r === "shadow" || r === "all" || r === "auto");
+    });
+    const lightMetas = allMeta.filter((m) => {
+      const r = m.options.root || "auto";
+      return r === "light" || r === "all" || !inst.shadowRoot && r === "auto";
+    });
+    const buildSet = (root, metas) => {
+      if (metas.length === 0) return null;
+      const initFrom = (o) => {
+        const init = {
+          childList: o.childList,
+          attributes: o.attributes,
+          characterData: o.characterData,
+          subtree: o.subtree,
+          attributeFilter: o.attributeFilter,
+          attributeOldValue: o.attributeOldValue,
+          characterDataOldValue: o.characterDataOldValue
+        };
+        if (!init.childList && !init.attributes && !init.characterData) init.childList = true;
+        return init;
+      };
+      const fnObservedSets = /* @__PURE__ */ new Map();
+      const callback = (mutations, obs) => {
+        for (const meta of metas) {
+          const { selector, options } = meta;
+          let matchedEls = [];
+          const typeMatches = (m) => {
+            const has = !!(options.childList || options.attributes || options.characterData);
+            if (m.type === "childList") return has ? !!options.childList : true;
+            if (m.type === "attributes") return !!options.attributes;
+            if (m.type === "characterData") return !!options.characterData;
+            return true;
+          };
+          const collect = (matchesSel) => mutations.flatMap((m) => {
+            if (!typeMatches(m)) return [];
+            const els = [];
+            if (matchesSel(m.target)) els.push(m.target);
+            Array.from(m.addedNodes || []).filter(matchesSel).forEach((n) => els.push(n));
+            Array.from(m.removedNodes || []).filter(matchesSel).forEach((n) => els.push(n));
+            return els;
+          });
+          if (options.delegate && typeof selector === "string") {
+            const isThis = selector === "$this" || selector === "";
+            matchedEls = collect((n) => {
+              if (!n || n.nodeType !== 1) return false;
+              if (isThis) return true;
+              const el = n;
+              return el.matches?.(selector) || !!el.closest?.(selector);
+            });
+          } else if (typeof selector === "string") {
+            const isThis = selector === "$this" || selector === "";
+            matchedEls = collect((n) => {
+              if (!n || n.nodeType !== 1) return false;
+              if (isThis) return true;
+              return n.matches?.(selector);
+            });
+          } else if (typeof selector === "function") {
+            const set = fnObservedSets.get(meta);
+            matchedEls = mutations.filter((m) => typeMatches(m)).map((m) => m.target).filter((t) => t && t.nodeType === 1 && (set ? set.has(t) : false));
+          } else {
+            matchedEls = mutations.filter((m) => typeMatches(m)).map((m) => m.target).filter((t) => t && t.nodeType === 1);
+          }
+          if (matchedEls.length === 0) continue;
+          if (options.filter) {
+            if (!options.filter(matchedEls, { currentThis: inst, helper: helperHostSet })) continue;
+          }
+          const hostSet = SwcUtils.getHostSet(inst);
+          inst[meta.propertyKey](matchedEls, mutations, obs, { ...hostSet, $root: root });
+        }
+      };
+      const observeTargets = [];
+      if (metas.some((m) => m.options.delegate)) {
+        observeTargets.push({ target: root, options: { childList: true, subtree: true } });
+      }
+      for (const m of metas.filter((m2) => !m2.options.delegate)) {
+        const { selector, options } = m;
+        const mInit = initFrom(options);
+        if (typeof selector === "string") {
+          if (selector === "$this" || selector === "") {
+            observeTargets.push({ target: root, options: mInit });
+          } else {
+            root.querySelectorAll(selector).forEach((el) => observeTargets.push({ target: el, options: mInit }));
+          }
+        } else if (typeof selector === "function") {
+          const res = selector(inst, helperHostSet);
+          let targets = [];
+          if (res instanceof currentWin.HTMLElement) targets = [res];
+          else if (res instanceof currentWin.NodeList) targets = Array.from(res).filter((e) => e instanceof currentWin.HTMLElement);
+          else if (Array.isArray(res)) targets = res.filter((e) => e instanceof currentWin.HTMLElement);
+          const set = /* @__PURE__ */ new WeakSet();
+          for (const el of targets) {
+            set.add(el);
+            observeTargets.push({ target: el, options: mInit });
+          }
+          fnObservedSets.set(m, set);
+        }
+      }
+      for (const m of metas) {
+        if (m.options.removeObserver) removeObserverCallbacks.push({ fn: m.options.removeObserver, target: root, opts: m.options });
+      }
+      return { callback, observeTargets };
+    };
+    const shadowSet = inst.shadowRoot ? buildSet(inst.shadowRoot, shadowMetas) : null;
+    const lightSet = buildSet(inst, lightMetas);
+    const mutationObserverSet = [
+      ...(shadowSet?.observeTargets ?? []).map((t) => ({ ...t, callback: shadowSet.callback })),
+      ...(lightSet?.observeTargets ?? []).map((t) => ({ ...t, callback: lightSet.callback }))
+    ];
+    if (mutationObserverSet.length === 0) return;
+    return { mutationObserverSet };
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const cb of this.removeObserverCallbacksMap.get(inst) ?? []) {
+      try {
+        cb.fn(cb.target, cb.opts);
+      } catch (e) {
+        console.error("[SWC] removeObserver error:", e);
+      }
+    }
+    this.removeObserverCallbacksMap.delete(inst);
+  }
+};
+
+// src/decorators/resizeObserver.ts
+var RESIZE_OBSERVER_METADATA_KEY = Symbol.for("simple-web-component:resize-observer");
+function resizeObserver(selectorOrOptions, maybeOptions) {
+  return (targetObj, propertyKey, descriptor) => {
+    let selector = "$this";
+    let options = {};
+    if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+      selector = selectorOrOptions;
+      options = maybeOptions ?? {};
+    } else {
+      selector = "$this";
+      options = selectorOrOptions ?? {};
+    }
+    const constructor = targetObj.constructor;
+    let observers = ReflectUtils.getMetadata(RESIZE_OBSERVER_METADATA_KEY, constructor);
+    if (!observers) {
+      observers = [];
+      ReflectUtils.defineMetadata(RESIZE_OBSERVER_METADATA_KEY, observers, constructor);
+    }
+    observers.push({ propertyKey, selector, options });
+  };
+}
+function resizeObserverThis(options) {
+  return resizeObserver("$this", options);
+}
+function resizeObserverDelegateLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light", delegate: true });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "light", delegate: true });
+}
+function resizeObserverDelegateShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow", delegate: true });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "shadow", delegate: true });
+}
+function resizeObserverDelegateAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all", delegate: true });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "all", delegate: true });
+}
+function resizeObserverDelegate(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "auto", delegate: true });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "auto", delegate: true });
+}
+function resizeObserverLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light" });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "light" });
+}
+function resizeObserverShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow" });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "shadow" });
+}
+function resizeObserverAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return resizeObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all" });
+  }
+  return resizeObserver({ ...selectorOrOptions ?? {}, root: "all" });
+}
+function getResizeObserverMetadata(target) {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.getMetadata(RESIZE_OBSERVER_METADATA_KEY, constructor);
+}
+var ResizeObserverLifeCycler = class {
+  constructor() {
+    __publicField(this, "removeObserverCallbacksMap", /* @__PURE__ */ new WeakMap());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const currentWin = helperHostSet.$w;
+    const removeObserverCallbacks = [];
+    this.removeObserverCallbacksMap.set(inst, removeObserverCallbacks);
+    const allMeta = getResizeObserverMetadata(inst) ?? [];
+    if (allMeta.length === 0) return;
+    const root = inst.shadowRoot || inst;
+    for (const m of allMeta) {
+      if (m.options.removeObserver) removeObserverCallbacks.push({ fn: m.options.removeObserver, target: root, opts: m.options });
+    }
+    const callback = (entries, obs) => {
+      for (const m of allMeta) {
+        let matchedEls;
+        if (m.options.delegate && typeof m.selector === "string") {
+          const isThis = m.selector === "$this" || m.selector === "";
+          matchedEls = entries.map((e) => e.target).filter((el) => {
+            if (!el || el.nodeType !== 1) return false;
+            if (isThis) return true;
+            return el.matches?.(m.selector) || !!el.closest?.(m.selector);
+          });
+        } else {
+          matchedEls = entries.map((e) => e.target).filter((t) => t && t.nodeType === 1);
+        }
+        if (matchedEls.length === 0) continue;
+        if (m.options.filter) {
+          if (!m.options.filter(matchedEls, { currentThis: inst, helper: helperHostSet })) continue;
+        }
+        const hostSet = SwcUtils.getHostSet(inst);
+        inst[m.propertyKey](matchedEls, entries, obs, { ...hostSet, $root: root });
+      }
+    };
+    const resizeObserverSet = [];
+    for (const m of allMeta) {
+      if (m.options.delegate && typeof m.selector === "string") {
+        resizeObserverSet.push({ target: m.selector, delegate: true, delegateRoot: m.options.root, options: m.options.box ? { box: m.options.box } : void 0, callback });
+        continue;
+      }
+      let targets = [];
+      if (typeof m.selector === "function") {
+        const res = m.selector(inst, helperHostSet);
+        if (res instanceof currentWin.HTMLElement) targets = [res];
+        else if (res instanceof currentWin.NodeList) targets = Array.from(res).filter((e) => e instanceof currentWin.HTMLElement);
+        else if (Array.isArray(res)) targets = res.filter((e) => e instanceof currentWin.HTMLElement);
+      } else if (typeof m.selector === "string") {
+        if (m.selector === "$this" || m.selector === "") {
+          targets = [inst];
+        } else {
+          const r = m.options.root || "auto";
+          const scopes = [];
+          if (r === "auto") scopes.push(inst.shadowRoot || inst);
+          else if (r === "light") scopes.push(inst);
+          else if (r === "shadow" && inst.shadowRoot) scopes.push(inst.shadowRoot);
+          else if (r === "all") {
+            scopes.push(inst);
+            if (inst.shadowRoot) scopes.push(inst.shadowRoot);
+          }
+          for (const s of scopes) {
+            const found = s?.querySelectorAll?.(m.selector);
+            if (found?.length) targets.push(...Array.from(found));
+          }
+        }
+      }
+      for (const el of targets) resizeObserverSet.push({ target: el, options: m.options.box ? { box: m.options.box } : void 0, callback });
+    }
+    return { resizeObserverSet };
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const cb of this.removeObserverCallbacksMap.get(inst) ?? []) {
+      try {
+        cb.fn(cb.target, cb.opts);
+      } catch (e) {
+        console.error("[SWC] removeObserver error:", e);
+      }
+    }
+    this.removeObserverCallbacksMap.delete(inst);
+  }
+};
+
+// src/decorators/intersectionObserver.ts
+var INTERSECTION_OBSERVER_METADATA_KEY = Symbol.for("simple-web-component:intersection-observer");
+function intersectionObserver(selectorOrOptions, maybeOptions) {
+  return (targetObj, propertyKey, descriptor) => {
+    let selector = "$this";
+    let options = {};
+    if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+      selector = selectorOrOptions;
+      options = maybeOptions ?? {};
+    } else {
+      selector = "$this";
+      options = selectorOrOptions ?? {};
+    }
+    const constructor = targetObj.constructor;
+    let observers = ReflectUtils.getMetadata(INTERSECTION_OBSERVER_METADATA_KEY, constructor);
+    if (!observers) {
+      observers = [];
+      ReflectUtils.defineMetadata(INTERSECTION_OBSERVER_METADATA_KEY, observers, constructor);
+    }
+    observers.push({ propertyKey, selector, options });
+  };
+}
+function intersectionObserverThis(options) {
+  return intersectionObserver("$this", options);
+}
+function intersectionObserverDelegateLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light", delegate: true });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "light", delegate: true });
+}
+function intersectionObserverDelegateShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow", delegate: true });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "shadow", delegate: true });
+}
+function intersectionObserverDelegateAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all", delegate: true });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "all", delegate: true });
+}
+function intersectionObserverDelegate(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "auto", delegate: true });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "auto", delegate: true });
+}
+function intersectionObserverLight(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "light" });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "light" });
+}
+function intersectionObserverShadow(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "shadow" });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "shadow" });
+}
+function intersectionObserverAll(selectorOrOptions, maybeOptions) {
+  if (typeof selectorOrOptions === "string" || typeof selectorOrOptions === "function") {
+    return intersectionObserver(selectorOrOptions, { ...maybeOptions ?? {}, root: "all" });
+  }
+  return intersectionObserver({ ...selectorOrOptions ?? {}, root: "all" });
+}
+function getIntersectionObserverMetadata(target) {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.getMetadata(INTERSECTION_OBSERVER_METADATA_KEY, constructor);
+}
+var IntersectionObserverLifeCycler = class {
+  constructor() {
+    __publicField(this, "removeObserverCallbacksMap", /* @__PURE__ */ new WeakMap());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const currentWin = helperHostSet.$w;
+    const removeObserverCallbacks = [];
+    this.removeObserverCallbacksMap.set(inst, removeObserverCallbacks);
+    const allMeta = getIntersectionObserverMetadata(inst) ?? [];
+    if (allMeta.length === 0) return;
+    const root = inst.shadowRoot || inst;
+    for (const m of allMeta) {
+      if (m.options.removeObserver) removeObserverCallbacks.push({ fn: m.options.removeObserver, target: root, opts: m.options });
+    }
+    const buildCallback = (metas) => {
+      return (entries, obs) => {
+        for (const m of metas) {
+          let matchedEls;
+          if (m.options.delegate && typeof m.selector === "string") {
+            const isThis = m.selector === "$this" || m.selector === "";
+            matchedEls = entries.map((e) => e.target).filter((el) => {
+              if (!el || el.nodeType !== 1) return false;
+              if (isThis) return true;
+              return el.matches?.(m.selector) || !!el.closest?.(m.selector);
+            });
+          } else {
+            matchedEls = entries.map((e) => e.target).filter((t) => t && t.nodeType === 1);
+          }
+          if (matchedEls.length === 0) continue;
+          if (m.options.filter) {
+            if (!m.options.filter(matchedEls, { currentThis: inst, helper: helperHostSet })) continue;
+          }
+          const hostSet = SwcUtils.getHostSet(inst);
+          inst[m.propertyKey](matchedEls, entries, obs, { ...hostSet, $root: root });
+        }
+      };
+    };
+    const groups = /* @__PURE__ */ new Map();
+    for (const m of allMeta) {
+      const obsOptions = {
+        root: m.options.intersectionRoot ?? null,
+        rootMargin: m.options.rootMargin,
+        threshold: m.options.threshold
+      };
+      const key = JSON.stringify([obsOptions.root, obsOptions.rootMargin, obsOptions.threshold]);
+      if (!groups.has(key)) groups.set(key, { options: obsOptions, metas: [] });
+      groups.get(key).metas.push(m);
+    }
+    const intersectionObserverSet = [];
+    for (const [, group] of groups) {
+      const callback = buildCallback(group.metas);
+      const observeTargets = [];
+      for (const m of group.metas) {
+        if (m.options.delegate && typeof m.selector === "string") {
+          observeTargets.push({ target: m.selector, delegate: true, delegateRoot: m.options.root, callback });
+          continue;
+        }
+        let targets = [];
+        if (typeof m.selector === "function") {
+          const res = m.selector(inst, helperHostSet);
+          if (res instanceof currentWin.HTMLElement) targets = [res];
+          else if (res instanceof currentWin.NodeList) targets = Array.from(res).filter((e) => e instanceof currentWin.HTMLElement);
+          else if (Array.isArray(res)) targets = res.filter((e) => e instanceof currentWin.HTMLElement);
+        } else if (typeof m.selector === "string") {
+          if (m.selector === "$this" || m.selector === "") {
+            targets = [inst];
+          } else {
+            const r = m.options.root || "auto";
+            const scopes = [];
+            if (r === "auto") scopes.push(inst.shadowRoot || inst);
+            else if (r === "light") scopes.push(inst);
+            else if (r === "shadow" && inst.shadowRoot) scopes.push(inst.shadowRoot);
+            else if (r === "all") {
+              scopes.push(inst);
+              if (inst.shadowRoot) scopes.push(inst.shadowRoot);
+            }
+            for (const s of scopes) {
+              const found = s?.querySelectorAll?.(m.selector);
+              if (found?.length) targets.push(...Array.from(found));
+            }
+          }
+        }
+        for (const el of targets) observeTargets.push({ target: el, callback });
+      }
+      intersectionObserverSet.push({ options: group.options, observeTargets });
+    }
+    return { intersectionObserverSet };
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const cb of this.removeObserverCallbacksMap.get(inst) ?? []) {
+      try {
+        cb.fn(cb.target, cb.opts);
+      } catch (e) {
+        console.error("[SWC] removeObserver error:", e);
+      }
+    }
+    this.removeObserverCallbacksMap.delete(inst);
+  }
+};
+
+// src/decorators/lifecycles.ts
+var ON_INITIALIZE_METADATA_KEY = Symbol.for("simple-web-component:on-constructor");
+var ON_BEFORE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-connected");
+var ON_AFTER_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-connected");
+var ON_BEFORE_DISCONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-disconnected");
+var ON_AFTER_DISCONNECTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-disconnected");
+var ON_BEFORE_ADOPTED_METADATA_KEY = Symbol.for("simple-web-component:on-before-adopted");
+var ON_AFTER_ADOPTED_METADATA_KEY = Symbol.for("simple-web-component:on-after-adopted");
+var ON_ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:on-add-event-listener");
+var ON_CONNECTED_BODY_METADATA_KEY = Symbol.for("simple-web-component:on-connected-body");
+var ON_CONNECTED_SWC_APP_METADATA_KEY = Symbol.for("simple-web-component:on-connected-swc-app");
+var ON_CONNECTED_COMPLETED_METADATA_KEY = Symbol.for("simple-web-component:on-completed");
+var ATTRIBUTE_CHANGED_WILDCARD = "*";
+function onConnectedBefore(arg1, arg2, arg3) {
+  const decorator2 = (options, target, propertyKey) => {
+    const constructor = target.constructor;
+    let list = ReflectUtils.getMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, constructor);
+    if (!list) {
+      list = [];
+      ReflectUtils.defineMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, list, constructor);
+    }
+    list.push({ propertyKey, options });
+  };
+  if (arg2) {
+    return decorator2({}, arg1, arg2);
+  }
+  return (target, propertyKey) => {
+    decorator2(arg1 || {}, target, propertyKey);
+  };
+}
+function onConnectedAfter(arg1, arg2, arg3) {
+  const decorator2 = (options, target, propertyKey) => {
+    const constructor = target.constructor;
+    let list = ReflectUtils.getMetadata(ON_AFTER_CONNECTED_METADATA_KEY, constructor);
+    if (!list) {
+      list = [];
+      ReflectUtils.defineMetadata(ON_AFTER_CONNECTED_METADATA_KEY, list, constructor);
+    }
+    list.push({ propertyKey, options });
+  };
+  if (arg2) {
+    return decorator2({}, arg1, arg2);
+  }
+  return (target, propertyKey) => {
+    decorator2(arg1 || {}, target, propertyKey);
+  };
+}
+function createLifecycleDecoratorWithOptions(metadataKey) {
+  return function(optionOrTarget, propertyKey) {
+    if (propertyKey) {
+      const constructor = optionOrTarget.constructor;
+      let list = ReflectUtils.getOwnMetadata(metadataKey, constructor);
+      if (!list) {
+        list = [];
+        ReflectUtils.defineMetadata(metadataKey, list, constructor);
+      }
+      list.push({ propertyKey, order: 0 });
+      return;
+    }
+    return (target, propertyKey2) => {
+      const constructor = target.constructor;
+      let list = ReflectUtils.getOwnMetadata(metadataKey, constructor);
+      if (!list) {
+        list = [];
+        ReflectUtils.defineMetadata(metadataKey, list, constructor);
+      }
+      list.push({ propertyKey: propertyKey2, order: optionOrTarget?.order ?? 0 });
+    };
+  };
+}
+function onInitialize(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_INITIALIZE_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+function onDisconnectedBefore(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_BEFORE_DISCONNECTED_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+function onDisconnectedAfter(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_AFTER_DISCONNECTED_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+var onDisconnected = onDisconnectedAfter;
+function onAdoptedBefore(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_BEFORE_ADOPTED_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+function onAdoptedAfter(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_AFTER_ADOPTED_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+var onAdopted = onAdoptedAfter;
+function onConnectedSwcApp(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_CONNECTED_SWC_APP_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+function onConnectedCompleted(optionOrTarget, propertyKey) {
+  return createLifecycleDecoratorWithOptions(ON_CONNECTED_COMPLETED_METADATA_KEY)(optionOrTarget, propertyKey);
+}
+var decorator = (options, target, propertyKey) => {
+  const constructor = target.constructor;
+  let list = ReflectUtils.getMetadata(ON_CONNECTED_BODY_METADATA_KEY, constructor);
+  if (!list) {
+    list = [];
+    ReflectUtils.defineMetadata(ON_CONNECTED_BODY_METADATA_KEY, list, constructor);
+  }
+  list.push({ propertyKey, options });
+};
+function onConnectedBodyShadow(optionOrTarget, propertyKey, arg3) {
+  if (propertyKey) {
+    return decorator({ useShadow: true }, optionOrTarget, propertyKey);
+  }
+  return (target, propertyKey2) => {
+    decorator({ ...optionOrTarget ?? {}, useShadow: true }, target, propertyKey2);
+  };
+}
+function onConnectedBodyLight(optionOrTarget, propertyKey, arg3) {
+  if (propertyKey) {
+    return decorator({ useShadow: false }, optionOrTarget, propertyKey);
+  }
+  return (target, propertyKey2) => {
+    decorator({ ...optionOrTarget ?? {}, useShadow: false }, target, propertyKey2);
+  };
+}
+function onConnectedBody(optionOrTarget, propertyKey, arg3) {
+  if (propertyKey) {
+    return decorator({}, optionOrTarget, propertyKey);
+  }
+  return (target, propertyKey2) => {
+    decorator(optionOrTarget || {}, target, propertyKey2);
+  };
+}
+var findAllLifecycleMetadata = (target, metadataKey) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  const results = ReflectUtils.getOwnMetadata(metadataKey, constructor) ?? [];
+  return [...results].sort((a, b) => (a.order ?? 0) - (b.order ?? 0));
+};
+var findAllOnConnectedMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  const results = ReflectUtils.getMetadata(ON_CONNECTED_BODY_METADATA_KEY, constructor) ?? [];
+  return [...results].sort((a, b) => {
+    const orderA = a.options?.order ?? 0;
+    const orderB = b.options?.order ?? 0;
+    return orderA - orderB;
+  });
+};
+var findAllOnConnectedBeforeMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  const results = ReflectUtils.getMetadata(ON_BEFORE_CONNECTED_METADATA_KEY, constructor) ?? [];
+  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
+};
+var findAllOnConnectedAfterMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  const results = ReflectUtils.getMetadata(ON_AFTER_CONNECTED_METADATA_KEY, constructor) ?? [];
+  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
+};
+
+// src/decorators/emitCustomEvent.ts
+var EMIT_CUSTOM_EVENT_METADATA_KEY = Symbol.for("simple-web-component:emit-custom-event");
+function emitCustomEvent(selectorOrTarget, typeOrPropertyKey, optionsOrDescriptor) {
+  if (typeof selectorOrTarget === "object" && typeof typeOrPropertyKey === "string" && typeof optionsOrDescriptor === "object" && "value" in optionsOrDescriptor) {
     throw new Error(`@emitCustomEvent decorator cannot be used on properties. (Property: ${String(typeOrPropertyKey)})`);
   }
   if ((typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") && typeof typeOrPropertyKey === "string") {
@@ -13771,6 +14879,53 @@ var getEmitCustomEventMetadataList = (target) => {
   return ReflectUtils.getMetadata(EMIT_CUSTOM_EVENT_METADATA_KEY, constructor);
 };
 var emit = emitCustomEvent;
+function emitThis(type, options) {
+  return emitCustomEvent("$this", type, options);
+}
+function emitAppHost(type, options) {
+  return emitCustomEvent("$appHost", type, options);
+}
+function emitWindow(type, options) {
+  return emitCustomEvent("$window", type, options);
+}
+function emitDocument(type, options) {
+  return emitCustomEvent("$document", type, options);
+}
+function emitLight(selector, type, options) {
+  return emitCustomEvent(selector, type, { ...options ?? {}, root: "light" });
+}
+function emitShadow(selector, type, options) {
+  return emitCustomEvent(selector, type, { ...options ?? {}, root: "shadow" });
+}
+function emitAll(selector, type, options) {
+  return emitCustomEvent(selector, type, { ...options ?? {}, root: "all" });
+}
+var EmitCustomEventLifeCycler = class {
+  constructor() {
+    this.hostEmitMeta = null;
+  }
+  getHostEmitMeta(inst) {
+    if (!this.hostEmitMeta) {
+      const all = getEmitCustomEventMetadataList(inst) ?? [];
+      this.hostEmitMeta = all.filter((m) => m.selector === "$this" || m.selector === "");
+    }
+    return this.hostEmitMeta;
+  }
+  /** observedAttributes 에 포함할 attributeName 목록 */
+  getObservedAttributeNames(inst) {
+    return this.getHostEmitMeta(inst).map((m) => m.options.attributeName).filter(Boolean);
+  }
+  onConnected(_helperHostSet) {
+  }
+  /** attributeChangedCallback 에서 elementDefine 이 직접 호출 */
+  onAttributeChanged(helperHostSet, name, _old, newVal) {
+    const inst = helperHostSet.$this;
+    const matched = this.getHostEmitMeta(inst).find((m) => m.options.attributeName === name);
+    if (matched && newVal !== null) {
+      inst._bindAttributeEvent?.(inst, name, newVal, matched.type);
+    }
+  }
+};
 
 // src/decorators/changedAttribute.ts
 var ON_ATTRIBUTE_CHANGED_METADATA_KEY = Symbol.for("simple-web-component:on-attribute-changed");
@@ -13817,9 +14972,115 @@ var findAllAttributeChangedMetadata = (target) => {
 var convertAttributeValue = (val, type) => {
   return convertValue(val, type);
 };
+var ChangedAttributeLifeCycler = class {
+  constructor() {
+    __publicField(this, "attrChangeMap", null);
+  }
+  /** 클래스 메타데이터 기반 attrChangeMap 을 lazy 로드한다 (공유 시클러 캐시). */
+  getAttrChangeMap(inst) {
+    if (!this.attrChangeMap) this.attrChangeMap = findAllAttributeChangedMetadata(inst);
+    return this.attrChangeMap;
+  }
+  /** observedAttributes 에 포함할 attribute 이름 목록 */
+  getObservedAttributeNames(inst) {
+    return Array.from(this.getAttrChangeMap(inst).keys());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const [name, metaList] of this.getAttrChangeMap(inst)) {
+      for (const meta of metaList) {
+        if (meta.options.while === "connected") {
+          const val = getAttributeValue(inst, name, { type: meta.options.type });
+          if (val !== null) inst[meta.propertyKey](val, null, name, helperHostSet);
+        }
+      }
+    }
+  }
+  /** attributeChangedCallback 에서 elementDefine 이 직접 호출 */
+  onAttributeChanged(helperHostSet, name, old, newVal) {
+    const inst = helperHostSet.$this;
+    const metaList = this.getAttrChangeMap(inst).get(name);
+    if (!metaList) return;
+    for (const meta of metaList) {
+      if (meta.options.while === "connected" && !inst.__swc_connected) continue;
+      inst[meta.propertyKey](convertAttributeValue(newVal, meta.options.type), old, name, helperHostSet);
+    }
+  }
+};
 
 // src/decorators/query.ts
 var QUERY_METADATA_KEY = Symbol.for("simple-web-component:query");
+var resolveQueryElements = (inst, selector, options, win) => {
+  const hostSet = SwcUtils.getHelperAndHostSet(win, inst);
+  let all = [];
+  if (typeof selector === "function") {
+    const result = selector(inst, hostSet);
+    if (result instanceof win.NodeList)
+      all = Array.from(result).filter((e) => e instanceof win.HTMLElement);
+    else if (Array.isArray(result))
+      all = result.filter((e) => e instanceof win.HTMLElement);
+    else if (result instanceof win.HTMLElement)
+      all = [result];
+  } else if (typeof selector === "string") {
+    const r = options?.root || "auto";
+    if (selector === "$this")
+      all = [inst];
+    else if (selector === "$host")
+      all = hostSet.$host ? [hostSet.$host] : [];
+    else if (selector === "$parentHost")
+      all = hostSet.$parentHost ? [hostSet.$parentHost] : [];
+    else if (selector === "$appHost")
+      all = hostSet.$appHost ? [hostSet.$appHost] : [];
+    else if (selector === "$firstHost")
+      all = hostSet.$firstHost ? [hostSet.$firstHost] : [];
+    else if (selector === "$lastHost")
+      all = hostSet.$lastHost ? [hostSet.$lastHost] : [];
+    else if (selector === "$firstAppHost")
+      all = hostSet.$firstAppHost ? [hostSet.$firstAppHost] : [];
+    else if (selector === "$lastAppHost")
+      all = hostSet.$lastAppHost ? [hostSet.$lastAppHost] : [];
+    else if (selector === "$hosts")
+      all = hostSet.$hosts.filter(Boolean);
+    else if (selector === "$appHosts")
+      all = hostSet.$appHosts.filter(Boolean);
+    else {
+      const scopes = [];
+      if (r === "auto")
+        scopes.push(inst.shadowRoot || inst);
+      else if (r === "light")
+        scopes.push(inst);
+      else if (r === "shadow" && inst.shadowRoot)
+        scopes.push(inst.shadowRoot);
+      else if (r === "all") {
+        scopes.push(inst);
+        if (inst.shadowRoot)
+          scopes.push(inst.shadowRoot);
+      }
+      for (const scope of scopes) {
+        const found = scope?.querySelectorAll?.(selector);
+        if (found?.length)
+          all.push(...Array.from(found).filter((e) => e instanceof win.HTMLElement));
+      }
+    }
+  }
+  if (options?.filter) {
+    all = all.filter((el) => options.filter(el, { currentThis: inst, helper: hostSet }));
+  }
+  return all;
+};
+var pickElements = (all, pick) => {
+  if (pick === "all")
+    return all;
+  if (pick === "even")
+    return all.filter((_, i) => i % 2 === 0);
+  if (pick === "odd")
+    return all.filter((_, i) => i % 2 === 1);
+  if (typeof pick === "number")
+    return all[pick] ?? null;
+  if (pick === "last")
+    return all.length ? all[all.length - 1] : null;
+  return all.length ? all[0] : null;
+};
 function query(selectorOrTarget, optionsOrPropertyKey, descriptor) {
   if (descriptor !== void 0 && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol")) {
     throw new Error(`@query decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);
@@ -13841,112 +15102,26 @@ function query(selectorOrTarget, optionsOrPropertyKey, descriptor) {
           ensureInit(this);
           const config = getElementConfig(this);
           const win = config?.window || window;
-          const hostSet = SwcUtils.getHelperAndHostSet(win, this);
-          let resolvedSelector;
-          let resolvedElement = null;
-          if (typeof selectorOrTarget === "function") {
-            const result = selectorOrTarget(this, hostSet);
-            if (result instanceof win.Node || result instanceof win.Element) {
-              resolvedElement = result instanceof win.HTMLElement ? result : null;
-            } else if (result instanceof win.NodeList || Array.isArray(result)) {
-              resolvedElement = result.length > 0 && result[0] instanceof win.HTMLElement ? result[0] : null;
-            }
-          } else {
-            resolvedSelector = selectorOrTarget;
-            const r = optionsOrPropertyKey?.root || "auto";
-            const applyRoot = (t) => {
-              if (!t || !(t instanceof HTMLElement))
-                return t;
-              if (r === "auto")
-                return t.shadowRoot || t;
-              if (r === "shadow")
-                return t.shadowRoot;
-              if (r === "light")
-                return t;
-              if (r === "all")
-                return t.shadowRoot || t;
-              return t;
-            };
-            if (resolvedSelector === "$this")
-              resolvedElement = applyRoot(this);
-            else if (resolvedSelector === "$host")
-              resolvedElement = applyRoot(hostSet.$host);
-            else if (resolvedSelector === "$parentHost")
-              resolvedElement = applyRoot(hostSet.$parentHost);
-            else if (resolvedSelector === "$appHost")
-              resolvedElement = applyRoot(hostSet.$appHost);
-            else if (resolvedSelector === "$firstHost")
-              resolvedElement = applyRoot(hostSet.$firstHost);
-            else if (resolvedSelector === "$lastHost")
-              resolvedElement = applyRoot(hostSet.$lastHost);
-            else if (resolvedSelector === "$firstAppHost")
-              resolvedElement = applyRoot(hostSet.$firstAppHost);
-            else if (resolvedSelector === "$lastAppHost")
-              resolvedElement = applyRoot(hostSet.$lastAppHost);
-            else if (resolvedSelector === "$window")
-              return win;
-            else if (resolvedSelector === "$document")
-              return win.document;
-            else {
-              if (r === "shadow")
-                resolvedElement = this.shadowRoot ? this.shadowRoot.querySelector(resolvedSelector) : null;
-              else if (r === "light")
-                resolvedElement = this.querySelector(resolvedSelector);
-              else if (r === "all") {
-                const shadowMatch = this.shadowRoot ? this.shadowRoot.querySelector(resolvedSelector) : null;
-                resolvedElement = shadowMatch || this.querySelector(resolvedSelector);
-              } else
-                resolvedElement = (this.shadowRoot || this).querySelector(resolvedSelector);
-            }
-          }
-          if (resolvedElement instanceof win.HTMLElement && optionsOrPropertyKey?.filter) {
-            const shouldInclude = optionsOrPropertyKey.filter(resolvedElement, { currentThis: this, helper: hostSet });
-            if (!shouldInclude) {
-              return null;
-            }
-          }
-          return resolvedElement;
+          const options = optionsOrPropertyKey || {};
+          if (typeof selectorOrTarget === "string" && selectorOrTarget === "$window")
+            return win;
+          if (typeof selectorOrTarget === "string" && selectorOrTarget === "$document")
+            return win.document;
+          const all = resolveQueryElements(this, selectorOrTarget, options, win);
+          return pickElements(all, options.pick ?? "first");
         },
         set(nv) {
           ensureInit(this);
-          if (nv === null || nv === void 0) {
+          if (nv === null || nv === void 0 || Array.isArray(nv) && nv.length === 0) {
             const config = getElementConfig(this);
             const win = config?.window || window;
-            const hostSet = SwcUtils.getHelperAndHostSet(win, this);
-            if (typeof selectorOrTarget === "function") {
-              const result = selectorOrTarget(this, hostSet);
-              if (result instanceof win.Element) {
-                result.remove();
-              } else if (result instanceof win.NodeList || Array.isArray(result)) {
-                const el = result.length > 0 ? result[0] : null;
-                if (el instanceof win.Element) {
-                  el.remove();
-                }
-              }
-              return;
-            }
-            const resolvedSelector = selectorOrTarget;
-            if (resolvedSelector.startsWith("$") && resolvedSelector !== "$this")
-              return;
-            const r = optionsOrPropertyKey?.root || "auto";
-            const targets = [];
-            if (r === "shadow") {
-              if (this.shadowRoot?.querySelector(resolvedSelector))
-                targets.push(this.shadowRoot.querySelector(resolvedSelector));
-            } else if (r === "light") {
-              if (this.querySelector(resolvedSelector))
-                targets.push(this.querySelector(resolvedSelector));
-            } else if (r === "all") {
-              if (this.shadowRoot?.querySelector(resolvedSelector))
-                targets.push(this.shadowRoot.querySelector(resolvedSelector));
-              if (this.querySelector(resolvedSelector))
-                targets.push(this.querySelector(resolvedSelector));
-            } else {
-              const el = (this.shadowRoot || this).querySelector(resolvedSelector);
-              if (el)
-                targets.push(el);
-            }
-            targets.forEach((t) => t.remove());
+            const options = optionsOrPropertyKey || {};
+            const all = resolveQueryElements(this, selectorOrTarget, options, win);
+            const picked = pickElements(all, options.pick ?? "first");
+            if (Array.isArray(picked))
+              picked.forEach((t) => t.remove());
+            else if (picked)
+              picked.remove();
           }
         },
         enumerable: true,
@@ -13960,161 +15135,36 @@ var getQueryMetadata = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
   return ReflectUtils.getMetadata(QUERY_METADATA_KEY, constructor) ?? [];
 };
-
-// src/decorators/queryAll.ts
-var QUERY_ALL_METADATA_KEY = Symbol.for("simple-web-component:query-all");
+var QUERY_ALL_METADATA_KEY = QUERY_METADATA_KEY;
 function queryAll(selectorOrTarget, optionsOrPropertyKey, descriptor) {
   if (descriptor !== void 0 && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol")) {
-    throw new Error(`@queryAll decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);
+    return query(selectorOrTarget, optionsOrPropertyKey, descriptor);
   }
   if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
-    return (targetObj, propertyKey, descriptor2) => {
-      if (descriptor2 !== void 0) {
-        throw new Error(`@queryAll decorator cannot be used on methods. (Method: ${String(propertyKey)})`);
-      }
-      const constructor = targetObj.constructor;
-      let queries = ReflectUtils.getMetadata(QUERY_ALL_METADATA_KEY, constructor);
-      if (!queries) {
-        queries = [];
-        ReflectUtils.defineMetadata(QUERY_ALL_METADATA_KEY, queries, constructor);
-      }
-      queries.push({ propertyKey, selector: selectorOrTarget, options: optionsOrPropertyKey || {} });
-      Object.defineProperty(targetObj, propertyKey, {
-        get() {
-          ensureInit(this);
-          const config = getElementConfig(this);
-          const win = config?.window || window;
-          const hostSet = SwcUtils.getHelperAndHostSet(win, this);
-          let resolvedSelector;
-          let resolvedElements = [];
-          if (typeof selectorOrTarget === "function") {
-            const result = selectorOrTarget(this, hostSet);
-            if (result instanceof win.NodeList) {
-              resolvedElements = Array.from(result).filter((el) => el instanceof win.HTMLElement);
-            } else if (Array.isArray(result)) {
-              resolvedElements = result.filter((el) => el instanceof win.HTMLElement);
-            }
-          } else {
-            resolvedSelector = selectorOrTarget;
-            const r = optionsOrPropertyKey?.root || "auto";
-            const applyRoot = (t) => {
-              if (!t)
-                return [];
-              const items = Array.isArray(t) ? t : [t];
-              const results = [];
-              items.forEach((it) => {
-                if (!(it instanceof HTMLElement)) {
-                  results.push(it);
-                  return;
-                }
-                if (r === "auto")
-                  results.push(it.shadowRoot || it);
-                else {
-                  if (r === "light" || r === "all")
-                    results.push(it);
-                  if ((r === "shadow" || r === "all") && it.shadowRoot)
-                    results.push(it.shadowRoot);
-                }
-              });
-              return results;
-            };
-            if (resolvedSelector === "$hosts")
-              resolvedElements = applyRoot(hostSet.$hosts).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$appHosts")
-              resolvedElements = applyRoot(hostSet.$appHosts).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$host")
-              resolvedElements = applyRoot(hostSet.$host).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$parentHost")
-              resolvedElements = applyRoot(hostSet.$parentHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$appHost")
-              resolvedElements = applyRoot(hostSet.$appHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$firstHost")
-              resolvedElements = applyRoot(hostSet.$firstHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$lastHost")
-              resolvedElements = applyRoot(hostSet.$lastHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$firstAppHost")
-              resolvedElements = applyRoot(hostSet.$firstAppHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$lastAppHost")
-              resolvedElements = applyRoot(hostSet.$lastAppHost).filter((el) => el instanceof HTMLElement);
-            else if (resolvedSelector === "$window")
-              return [win];
-            else if (resolvedSelector === "$document")
-              return [win.document];
-            else if (resolvedSelector === "$this")
-              resolvedElements = applyRoot(this).filter((el) => el instanceof HTMLElement);
-            else {
-              if (r === "shadow")
-                resolvedElements = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(resolvedSelector)) : [];
-              else if (r === "light")
-                resolvedElements = Array.from(this.querySelectorAll(resolvedSelector));
-              else if (r === "all") {
-                const sNodes = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(resolvedSelector)) : [];
-                const lNodes = Array.from(this.querySelectorAll(resolvedSelector));
-                resolvedElements = [...sNodes, ...lNodes];
-              } else
-                resolvedElements = Array.from((this.shadowRoot || this).querySelectorAll(resolvedSelector));
-            }
-          }
-          if (optionsOrPropertyKey?.filter) {
-            resolvedElements = resolvedElements.filter((el) => {
-              if (!(el instanceof win.HTMLElement))
-                return true;
-              return optionsOrPropertyKey.filter(el, { currentThis: this, helper: hostSet });
-            });
-          }
-          return resolvedElements;
-        },
-        set(nv) {
-          ensureInit(this);
-          if (nv === null || nv === void 0 || Array.isArray(nv) && nv.length === 0) {
-            const config = getElementConfig(this);
-            const win = config?.window || window;
-            const hostSet = SwcUtils.getHelperAndHostSet(win, this);
-            if (typeof selectorOrTarget === "function") {
-              const result = selectorOrTarget(this, hostSet);
-              if (result instanceof win.NodeList) {
-                Array.from(result).forEach((el) => {
-                  if (el instanceof win.Element)
-                    el.remove();
-                });
-              } else if (Array.isArray(result)) {
-                result.forEach((el) => {
-                  if (el instanceof win.Element)
-                    el.remove();
-                });
-              }
-              return;
-            }
-            const resolvedSelector = selectorOrTarget;
-            if (resolvedSelector.startsWith("$") && resolvedSelector !== "$this")
-              return;
-            const r = optionsOrPropertyKey?.root || "auto";
-            let targets = [];
-            if (r === "shadow")
-              targets = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(resolvedSelector)) : [];
-            else if (r === "light")
-              targets = Array.from(this.querySelectorAll(resolvedSelector));
-            else if (r === "all") {
-              const sNodes = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(resolvedSelector)) : [];
-              const lNodes = Array.from(this.querySelectorAll(resolvedSelector));
-              targets = [...sNodes, ...lNodes];
-            } else {
-              targets = Array.from((this.shadowRoot || this).querySelectorAll(resolvedSelector));
-            }
-            targets.forEach((t) => t.remove());
-          }
-        },
-        enumerable: true,
-        configurable: true
-      });
-    };
+    return query(selectorOrTarget, { ...optionsOrPropertyKey ?? {}, pick: "all" });
   }
-  return queryAll("$this", selectorOrTarget);
+  return query({ ...selectorOrTarget ?? {}, pick: "all" });
 }
-var getQueryAllMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  return ReflectUtils.getMetadata(QUERY_ALL_METADATA_KEY, constructor);
-};
+var getQueryAllMetadata = getQueryMetadata;
+function queryShadow(selector, options) {
+  return query(selector, { ...options ?? {}, root: "shadow" });
+}
+function queryLight(selector, options) {
+  return query(selector, { ...options ?? {}, root: "light" });
+}
+function queryAllRoots(selector, options) {
+  return query(selector, { ...options ?? {}, root: "all" });
+}
+function queryAllShadow(selector, options) {
+  return query(selector, { ...options ?? {}, root: "shadow", pick: "all" });
+}
+function queryAllLight(selector, options) {
+  return query(selector, { ...options ?? {}, root: "light", pick: "all" });
+}
+function queryAllAll(selector, options) {
+  return query(selector, { ...options ?? {}, root: "all", pick: "all" });
+}
+var queryIn = (root, pick) => (selector, options) => query(selector, { ...options ?? {}, root, ...pick !== void 0 ? { pick } : {} });
 
 // src/config/config.ts
 var HTML_TAG_ENTRIES = [
@@ -14176,7 +15226,7 @@ var HTML_TAG_ENTRIES = [
   ["HTMLHeadingElement", "h1"],
   ["HTMLBodyElement", "body"]
 ];
-var DOM_EVENT_NAMES = ["click", "dblclick", "mousedown", "mouseenter", "mouseleave", "mousemove", "mouseout", "mouseover", "mouseup", "contextmenu", "keydown", "keypress", "keyup", "blur", "change", "focus", "focusin", "focusout", "input", "invalid", "reset", "search", "select", "submit", "drag", "dragend", "dragenter", "dragleave", "dragover", "dragstart", "drop", "copy", "cut", "paste", "abort", "canplay", "canplaythrough", "durationchange", "emptied", "ended", "error", "loadeddata", "loadedmetadata", "loadstart", "pause", "play", "playing", "progress", "ratechange", "seeked", "seeking", "stalled", "suspend", "timeupdate", "volumechange", "waiting", "scroll", "resize", "load", "unload", "hashchange", "connected"];
+var DOM_EVENT_NAMES = ["click", "dblclick", "mousedown", "mouseenter", "mouseleave", "mousemove", "mouseout", "mouseover", "mouseup", "contextmenu", "keydown", "keypress", "keyup", "blur", "change", "focus", "focusin", "focusout", "input", "invalid", "reset", "search", "select", "submit", "drag", "dragend", "dragenter", "dragleave", "dragover", "dragstart", "drop", "copy", "cut", "paste", "abort", "canplay", "canplaythrough", "durationchange", "emptied", "ended", "error", "loadeddata", "loadedmetadata", "loadstart", "pause", "play", "playing", "progress", "ratechange", "seeked", "seeking", "stalled", "suspend", "timeupdate", "volumechange", "waiting", "scroll", "resize", "load", "hashchange", "connected"];
 var BROWSER_GLOBALS = ["window", "document", "Node", "Element", "HTMLElement", "DocumentFragment", "CustomEvent", "customElements", "NodeFilter", ...HTML_TAG_ENTRIES.map(([className]) => className)];
 
 // ../simple-boot/dist/esm/decorators/inject/Inject.js
@@ -14444,6 +15494,12 @@ function applyProperty(selector, targetPropertyKeyOrOptions, options) {
           return;
         }
         const resolvedRes = typeof resolvedValue === "function" ? resolvedValue(targetEl, hostSet) : resolvedValue;
+        if (finalOptions.setType === "call") {
+          if (typeof targetEl[targetPropertyKey] !== "function") return;
+          if (Array.isArray(resolvedRes)) targetEl[targetPropertyKey].apply(targetEl, resolvedRes);
+          else targetEl[targetPropertyKey].call(targetEl, resolvedRes);
+          return;
+        }
         targetEl[targetPropertyKey] = resolvedRes;
       });
       return resolvedValue;
@@ -14488,7 +15544,11 @@ function applyProperty(selector, targetPropertyKeyOrOptions, options) {
           }
           return true;
         });
-        const values = filtered.map((el) => el[targetPropertyKey]);
+        const values = filtered.map((el) => {
+          const raw = el[targetPropertyKey];
+          if (finalOptions.getType === "call" && typeof raw === "function") return raw.call(el);
+          return raw;
+        });
         return values.length === 1 ? values[0] : values;
       },
       set(value) {
@@ -14499,30 +15559,309 @@ function applyProperty(selector, targetPropertyKeyOrOptions, options) {
   };
 }
 function property(selectorOrTarget, targetPropertyKeyOrOptions, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof targetPropertyKeyOrOptions === "string" || typeof targetPropertyKeyOrOptions === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof targetPropertyKeyOrOptions === "string" || typeof targetPropertyKeyOrOptions === "symbol")) {
     return applyProperty("$this", void 0, {})(selectorOrTarget, targetPropertyKeyOrOptions, optionsOrDescriptor);
   }
   if (typeof selectorOrTarget === "string") {
     return applyProperty(selectorOrTarget, targetPropertyKeyOrOptions, optionsOrDescriptor);
   }
+  if (typeof selectorOrTarget === "function") {
+    return applyProperty(selectorOrTarget, targetPropertyKeyOrOptions, optionsOrDescriptor);
+  }
   return applyProperty("$this", void 0, selectorOrTarget);
 }
 function setProperty(selectorOrOptions, targetPropertyKeyOrOptions, optionsOrUndefined) {
   if (typeof selectorOrOptions === "string") {
     return applyProperty(selectorOrOptions, targetPropertyKeyOrOptions, optionsOrUndefined);
   }
-  return applyProperty("$this", void 0, selectorOrOptions);
-}
-var findAllPropertyMetadata = (target) => {
-  const actualTarget = target instanceof Function ? target : target.constructor;
-  return ReflectUtils.findAllMetadata(PROPERTY_METADATA_KEY, actualTarget).flat();
-};
-var findAllPropertyApplyMetadata = (target) => {
-  const result = /* @__PURE__ */ new Map();
-  findAllPropertyMetadata(target).forEach((meta) => {
-    result.set(meta.propertyKey, meta);
-  });
-  return result;
+  if (typeof selectorOrOptions === "function") {
+    return applyProperty(selectorOrOptions, targetPropertyKeyOrOptions, optionsOrUndefined);
+  }
+  return applyProperty("$this", void 0, selectorOrOptions);
+}
+function callProperty(selectorOrTarget, targetMethodKeyOrOptions, optionsOrUndefined) {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
+    if (typeof targetMethodKeyOrOptions === "string" || typeof targetMethodKeyOrOptions === "symbol") {
+      return applyProperty(selectorOrTarget, targetMethodKeyOrOptions, { ...optionsOrUndefined ?? {}, setType: "call" });
+    }
+    return applyProperty(selectorOrTarget, { ...optionsOrUndefined ?? targetMethodKeyOrOptions ?? {}, setType: "call" });
+  }
+  return applyProperty("$this", void 0, { ...selectorOrTarget ?? {}, setType: "call" });
+}
+function callPropertyLight(selector, targetMethodKeyOrOptions, options) {
+  if (targetMethodKeyOrOptions != null && typeof targetMethodKeyOrOptions !== "string" && typeof targetMethodKeyOrOptions !== "symbol") {
+    return callProperty(selector, void 0, { ...targetMethodKeyOrOptions ?? {}, root: "light" });
+  }
+  return callProperty(selector, targetMethodKeyOrOptions, { ...options ?? {}, root: "light" });
+}
+function callPropertyShadow(selector, targetMethodKeyOrOptions, options) {
+  if (targetMethodKeyOrOptions != null && typeof targetMethodKeyOrOptions !== "string" && typeof targetMethodKeyOrOptions !== "symbol") {
+    return callProperty(selector, void 0, { ...targetMethodKeyOrOptions ?? {}, root: "shadow" });
+  }
+  return callProperty(selector, targetMethodKeyOrOptions, { ...options ?? {}, root: "shadow" });
+}
+function callPropertyAll(selector, targetMethodKey, options) {
+  return callProperty(selector, targetMethodKey, { ...options ?? {}, root: "all" });
+}
+var findAllPropertyMetadata = (target) => {
+  const actualTarget = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.findAllMetadata(PROPERTY_METADATA_KEY, actualTarget).flat();
+};
+var findAllPropertyApplyMetadata = (target) => {
+  const result = /* @__PURE__ */ new Map();
+  findAllPropertyMetadata(target).forEach((meta) => {
+    result.set(meta.propertyKey, meta);
+  });
+  return result;
+};
+var prop = applyProperty;
+function propThis(targetPropertyKey, options) {
+  return applyProperty("$this", targetPropertyKey, options);
+}
+function propAppHost(targetPropertyKey, options) {
+  return applyProperty("$appHost", targetPropertyKey, options);
+}
+function propWindow(targetPropertyKey, options) {
+  return applyProperty("$window", targetPropertyKey, options);
+}
+function propDocument(targetPropertyKey, options) {
+  return applyProperty("$document", targetPropertyKey, options);
+}
+function propLight(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "light" });
+}
+function propShadow(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "shadow" });
+}
+function propAll(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "all" });
+}
+function setPropertyLight(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "light" });
+}
+function setPropertyShadow(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "shadow" });
+}
+function setPropertyAll(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "all" });
+}
+function propertyLight(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "light" });
+}
+function propertyShadow(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "shadow" });
+}
+function propertyAll(selector, targetPropertyKey, options) {
+  return applyProperty(selector, targetPropertyKey, { ...options ?? {}, root: "all" });
+}
+
+// src/decorators/subscribeSwcAppMessageWhileConnected.ts
+var SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:subscribe-swc-app-message-while-connected");
+function createSubscribeSwcAppMessageWhileConnected(options, messageType) {
+  return (target, propertyKey, descriptor) => {
+    const filter = options?.filter;
+    const constructor = target.constructor;
+    let list = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, constructor);
+    if (!list) {
+      list = [];
+      ReflectUtils.defineMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, list, constructor);
+    }
+    list.push({ propertyKey, messageType, filter });
+    return descriptor;
+  };
+}
+function subscribeSwcAppMessageWhileConnected(targetOrMessageTypeOrOptions, optionsOrPropertyKey, descriptor) {
+  if (targetOrMessageTypeOrOptions && typeof targetOrMessageTypeOrOptions === "object" && optionsOrPropertyKey && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol") && descriptor) {
+    const target = targetOrMessageTypeOrOptions;
+    const propertyKey = optionsOrPropertyKey;
+    return createSubscribeSwcAppMessageWhileConnected({})(target, propertyKey, descriptor);
+  }
+  let messageType;
+  let options = {};
+  if (typeof targetOrMessageTypeOrOptions === "string") {
+    messageType = targetOrMessageTypeOrOptions;
+    if (optionsOrPropertyKey && typeof optionsOrPropertyKey === "object") {
+      options = optionsOrPropertyKey;
+    }
+  } else if (targetOrMessageTypeOrOptions && typeof targetOrMessageTypeOrOptions === "object") {
+    options = targetOrMessageTypeOrOptions;
+  }
+  return createSubscribeSwcAppMessageWhileConnected(options, messageType);
+}
+var receiveMessage = subscribeSwcAppMessageWhileConnected;
+var getSubscribeSwcAppMessageWhileConnectedMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, constructor);
+};
+var MessageSubscribeLifeCycler = class {
+  onConnected(_helperHostSet) {
+  }
+  /** SwcAppMixin 이 구독 대상 메타를 꺼낼 때 사용 */
+  getMetadata(helperHostSet) {
+    return getSubscribeSwcAppMessageWhileConnectedMetadata(helperHostSet.$this);
+  }
+};
+
+// src/decorators/subscribeSwcAppRouteChangeWhileConnected.ts
+var SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:subscribe-swc-app-route-change-while-connected");
+function createSubscribeSwcAppRouteChangeWhileConnected(options) {
+  return (target, propertyKey, descriptor) => {
+    const pathPattern = options?.path;
+    const filter = options?.filter;
+    const constructor = target.constructor;
+    let list = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, constructor);
+    if (!list) {
+      list = [];
+      ReflectUtils.defineMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, list, constructor);
+    }
+    list.push({ propertyKey, options });
+    return descriptor;
+  };
+}
+function subscribeSwcAppRouteChangeWhileConnected(targetOrOptions, propertyKeyOrConfig, descriptor) {
+  if (propertyKeyOrConfig && (typeof propertyKeyOrConfig === "string" || typeof propertyKeyOrConfig === "symbol")) {
+    return createSubscribeSwcAppRouteChangeWhileConnected({})(targetOrOptions, propertyKeyOrConfig, descriptor);
+  }
+  let options = {};
+  if (Array.isArray(targetOrOptions)) {
+    options.path = targetOrOptions;
+    if (propertyKeyOrConfig && typeof propertyKeyOrConfig === "object") {
+      options = { ...options, ...propertyKeyOrConfig };
+    }
+  } else if (typeof targetOrOptions === "string" || typeof targetOrOptions === "function") {
+    options.path = targetOrOptions;
+    if (propertyKeyOrConfig && typeof propertyKeyOrConfig === "object") {
+      options = { ...options, ...propertyKeyOrConfig };
+    }
+  } else if (targetOrOptions && typeof targetOrOptions === "object") {
+    options = targetOrOptions;
+  }
+  return createSubscribeSwcAppRouteChangeWhileConnected(options);
+}
+var changedRoute = subscribeSwcAppRouteChangeWhileConnected;
+var getSubscribeSwcAppRouteChangeWhileConnectedMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  const results = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, constructor);
+  if (!results) return [];
+  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
+};
+var RouteSubscribeLifeCycler = class {
+  onConnected(_helperHostSet) {
+  }
+  /** SwcAppMixin 이 구독 대상 메타를 꺼낼 때 사용 */
+  getMetadata(helperHostSet) {
+    return getSubscribeSwcAppRouteChangeWhileConnectedMetadata(helperHostSet.$this);
+  }
+};
+
+// src/decorators/setInterval.ts
+var SET_INTERVAL_METADATA_KEY = Symbol.for("simple-web-component:set-interval");
+function setInterval2(interval2, options = {}) {
+  return (target, propertyKey) => {
+    const constructor = target.constructor;
+    let metaList = ReflectUtils.getOwnMetadata(SET_INTERVAL_METADATA_KEY, constructor);
+    if (!metaList) {
+      metaList = [];
+      ReflectUtils.defineMetadata(SET_INTERVAL_METADATA_KEY, metaList, constructor);
+    }
+    metaList.push({ propertyKey, interval: interval2, options });
+  };
+}
+var findAllSetIntervalMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return (ReflectUtils.findAllMetadata(SET_INTERVAL_METADATA_KEY, constructor) || []).flat();
+};
+var SetIntervalLifeCycler = class {
+  constructor() {
+    __publicField(this, "activeMap", /* @__PURE__ */ new WeakMap());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const ids = [];
+    for (const meta of findAllSetIntervalMetadata(inst)) {
+      const id = helperHostSet.$w.setInterval(() => {
+        const args = meta.options.parameter?.(helperHostSet) ?? [];
+        try {
+          const res = inst[meta.propertyKey](...args);
+          const vk = meta.options.valueKey;
+          if (vk && res && typeof res === "object" && typeof res[vk] === "function") {
+            res[vk](id);
+          }
+        } catch (e) {
+          console.error("[SWC] setInterval tick error:", e);
+        }
+      }, meta.interval);
+      meta.options.created?.(helperHostSet, id);
+      ids.push(id);
+    }
+    this.activeMap.set(inst, ids);
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const id of this.activeMap.get(inst) ?? []) {
+      try {
+        helperHostSet.$w.clearInterval(id);
+      } catch (e) {
+        console.error("[SWC] clearInterval error:", e);
+      }
+    }
+    this.activeMap.delete(inst);
+  }
+};
+
+// src/decorators/setTimeout.ts
+var SET_TIMEOUT_METADATA_KEY = Symbol.for("simple-web-component:set-timeout");
+function setTimeout2(delay, options = {}) {
+  return (target, propertyKey) => {
+    const constructor = target.constructor;
+    let metaList = ReflectUtils.getOwnMetadata(SET_TIMEOUT_METADATA_KEY, constructor);
+    if (!metaList) {
+      metaList = [];
+      ReflectUtils.defineMetadata(SET_TIMEOUT_METADATA_KEY, metaList, constructor);
+    }
+    metaList.push({ propertyKey, delay, options });
+  };
+}
+var findAllSetTimeoutMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return (ReflectUtils.findAllMetadata(SET_TIMEOUT_METADATA_KEY, constructor) || []).flat();
+};
+var SetTimeoutLifeCycler = class {
+  constructor() {
+    __publicField(this, "activeMap", /* @__PURE__ */ new WeakMap());
+  }
+  onConnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    const ids = [];
+    for (const meta of findAllSetTimeoutMetadata(inst)) {
+      const id = helperHostSet.$w.setTimeout(() => {
+        const args = meta.options.parameter?.(helperHostSet) ?? [];
+        try {
+          const res = inst[meta.propertyKey](...args);
+          const vk = meta.options.valueKey;
+          if (vk && res && typeof res === "object" && typeof res[vk] === "function") {
+            res[vk](id);
+          }
+        } catch (e) {
+          console.error("[SWC] setTimeout fire error:", e);
+        }
+      }, meta.delay);
+      meta.options.created?.(helperHostSet, id);
+      ids.push(id);
+    }
+    this.activeMap.set(inst, ids);
+  }
+  onDisconnected(helperHostSet) {
+    const inst = helperHostSet.$this;
+    for (const id of this.activeMap.get(inst) ?? []) {
+      try {
+        helperHostSet.$w.clearTimeout(id);
+      } catch (e) {
+        console.error("[SWC] clearTimeout error:", e);
+      }
+    }
+    this.activeMap.delete(inst);
+  }
 };
 
 // src/decorators/elementDefine.ts
@@ -14535,7 +15874,6 @@ var ensureInit = (inst) => {
   if (!inst.__swc_initialized) {
     inst._swcId = inst?.getAttribute?.("swc-use-ssr") ?? "s" + Math.random().toString(36).substring(2, 11).toLowerCase();
     inst._emitHandlers = /* @__PURE__ */ new Map();
-    inst._boundListeners = [];
     inst.__swc_initialized = true;
     const target = inst instanceof Function ? inst : inst.constructor;
     const attributeAllList = findAllAttributeMetadata(target).filter((it) => it.type === "property");
@@ -14583,13 +15921,13 @@ var handleGlobalSwcEvent = async (event2) => {
   const path = event2.composedPath();
   const type = event2.type;
   const attrName = `swc-on-${type}`;
-  for (const node of path) {
-    if (!(node instanceof HTMLElement)) continue;
-    const script = node.getAttribute?.(attrName);
-    if (script && !getElementConfig(node)) {
-      const host = SwcUtils.findNearestSwcHostIncludingSelf(node);
+  for (const node2 of path) {
+    if (!(node2 instanceof HTMLElement)) continue;
+    const script = node2.getAttribute?.(attrName);
+    if (script && !getElementConfig(node2)) {
+      const host = SwcUtils.findNearestSwcHostIncludingSelf(node2);
       if (host && host.isConnected && typeof host.__swc_executeAttributeEvent === "function") {
-        await host.__swc_executeAttributeEvent(node, attrName, script, event2);
+        await host.__swc_executeAttributeEvent(node2, attrName, script, event2);
         event2.__swc_handled = true;
         break;
       }
@@ -14600,8 +15938,8 @@ function buildEnv(configWindow) {
   const win = configWindow;
   const doc = win?.document;
   const builtInTagMap = /* @__PURE__ */ new Map();
-  for (const [cls, tag] of HTML_TAG_ENTRIES) {
-    if (win?.[cls]) builtInTagMap.set(win[cls], tag);
+  for (const [cls2, tag] of HTML_TAG_ENTRIES) {
+    if (win?.[cls2]) builtInTagMap.set(win[cls2], tag);
   }
   const domHelpers = SwcUtils.getHelperSet(win);
   return { win, doc, builtInTagMap, domHelpers };
@@ -14734,10 +16072,6 @@ var elementDefine = (name, config = {}) => (constructor) => {
     }
     metadata.extends = extendsTagName;
   }
-  const emitCustomEventList = getEmitCustomEventMetadataList(constructor) || [];
-  const emitHostCustomEventList = emitCustomEventList.filter((meta) => meta.selector === "$this" || meta.selector === "");
-  const addEventListenerList = getAddEventListenerMetadata(constructor) || [];
-  const attrChangeMap = findAllAttributeChangedMetadata(constructor);
   const attributeList = findAllAttributeMetadata(constructor);
   const applyAttributeMap = findAllAttributeApplyMetadata(constructor);
   const swcLifecycleAttributes = ["swc-on-constructor", "swc-on-connected", "swc-on-disconnected", "swc-on-before-connected", "swc-on-after-connected", "swc-on-before-disconnected", "swc-on-after-disconnected", "swc-on-before-adopted", "swc-on-after-adopted", "swc-on-attribute-changed"];
@@ -14745,10 +16079,222 @@ var elementDefine = (name, config = {}) => (constructor) => {
   const attributeApplyNames = Array.from(applyAttributeMap.values()).map((it) => it.targetAttributeName).filter(Boolean);
   const hostAttributes = attributeList.filter((it) => it.selector === "$this").map((it) => it.propertyKey || String(it.propertyKey));
   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 proto = constructor.prototype;
   setupPrototype(proto, win);
   let helperHostSet = null;
+  const eventCycler = new EventListenerLifeCycler();
+  const cyclers = [
+    eventCycler,
+    new ChangedAttributeLifeCycler(),
+    new EmitCustomEventLifeCycler(),
+    new ResizeObserverLifeCycler(),
+    new IntersectionObserverLifeCycler(),
+    new MutationObserverLifeCycler(),
+    new MessageSubscribeLifeCycler(),
+    new RouteSubscribeLifeCycler(),
+    new SetIntervalLifeCycler(),
+    new SetTimeoutLifeCycler()
+  ];
+  const cyclerObservedAttributes = cyclers.flatMap((c) => c.getObservedAttributeNames?.(constructor) ?? []);
+  const mergedObservedAttributes = [.../* @__PURE__ */ new Set([...metadata.observedAttributes ?? [], ...originalStaticObservedAttributes, ...cyclerObservedAttributes, ...attributeApplyNames, ...hostAttributes, ...swcLifecycleAttributes, ...swcOnEvents])];
+  const buildObservers = async (helperHostSet2) => {
+    const inst = helperHostSet2.$this;
+    const observers = [];
+    let resizeObserverSet = [];
+    let mutationObserverSet = [];
+    let intersectionObserverSet = [];
+    const resolveDelegateRoots = (delegateRoot) => {
+      const r = delegateRoot || "auto";
+      const roots = [];
+      if (r === "auto") roots.push(inst.shadowRoot || inst);
+      else if (r === "light") roots.push(inst);
+      else if (r === "shadow" && inst.shadowRoot) roots.push(inst.shadowRoot);
+      else if (r === "all") {
+        roots.push(inst);
+        if (inst.shadowRoot) roots.push(inst.shadowRoot);
+      }
+      return roots;
+    };
+    for (const c of cyclers) {
+      const result = await c.onConnected?.(helperHostSet2, resizeObserverSet);
+      if (!result) continue;
+      if (result.resizeObserverSet?.length) resizeObserverSet = [...resizeObserverSet, ...result.resizeObserverSet];
+      if (result.mutationObserverSet?.length) mutationObserverSet = [...mutationObserverSet, ...result.mutationObserverSet];
+      if (result.intersectionObserverSet?.length) intersectionObserverSet = [...intersectionObserverSet, ...result.intersectionObserverSet];
+    }
+    const resizeDelegates = (resizeObserverSet ?? []).filter((t) => t.delegate && typeof t.target === "string");
+    let resizeObserve;
+    let resizeUnobserve;
+    const resizeObserved = /* @__PURE__ */ new WeakSet();
+    if (resizeObserverSet?.length) {
+      const roCallbacks = [...new Set(resizeObserverSet.map((e) => e.callback))];
+      const ro = new win.ResizeObserver((entries, obs) => {
+        for (const cb of roCallbacks) cb(entries, obs);
+      });
+      for (const e of resizeObserverSet) {
+        if (e.delegate) continue;
+        if (typeof e.target === "string") {
+          const scope = resolveDelegateRoots(e.delegateRoot);
+          for (const sr of scope) {
+            sr.querySelectorAll(e.target).forEach((el) => {
+              if (!resizeObserved.has(el)) {
+                ro.observe(el, e.options);
+                resizeObserved.add(el);
+              }
+            });
+          }
+          continue;
+        }
+        ro.observe(e.target, e.options);
+        if (e.target instanceof Element) resizeObserved.add(e.target);
+      }
+      resizeObserve = (el, opts) => {
+        if (resizeObserved.has(el)) return;
+        ro.observe(el, opts);
+        resizeObserved.add(el);
+      };
+      resizeUnobserve = (el) => {
+        if (!resizeObserved.has(el)) return;
+        ro.unobserve(el);
+        resizeObserved.delete(el);
+      };
+      observers.push(ro);
+    }
+    const intersectionDelegates = [];
+    for (const group of intersectionObserverSet) {
+      const ioCallbacks = [...new Set(group.observeTargets.map((e) => e.callback))];
+      const io = new win.IntersectionObserver((entries, obs) => {
+        for (const cb of ioCallbacks) cb(entries, obs);
+      }, group.options);
+      const ioObserved = /* @__PURE__ */ new WeakSet();
+      for (const e of group.observeTargets) {
+        if (e.delegate) {
+          const target = e.target;
+          const observe = (el) => {
+            if (ioObserved.has(el)) return;
+            io.observe(el);
+            ioObserved.add(el);
+          };
+          const unobserve = (el) => {
+            if (!ioObserved.has(el)) return;
+            io.unobserve(el);
+            ioObserved.delete(el);
+          };
+          intersectionDelegates.push({ target, delegateRoot: e.delegateRoot, observe, unobserve });
+          continue;
+        }
+        if (typeof e.target === "string") {
+          const scope = resolveDelegateRoots(e.delegateRoot);
+          for (const sr of scope) {
+            sr.querySelectorAll(e.target).forEach((el) => {
+              if (!ioObserved.has(el)) {
+                io.observe(el);
+                ioObserved.add(el);
+              }
+            });
+          }
+          continue;
+        }
+        io.observe(e.target);
+        if (e.target instanceof Element) ioObserved.add(e.target);
+      }
+      observers.push(io);
+    }
+    const handleResizeDelegate = (n, observe) => {
+      if (!resizeObserve || !resizeUnobserve || n.nodeType !== 1) return;
+      const el = n;
+      for (const d of resizeDelegates) {
+        const isThis = d.target === "$this" || d.target === "";
+        const matchesSel = (node2) => {
+          if (!node2 || node2.nodeType !== 1) return false;
+          if (isThis) return true;
+          return node2.matches?.(d.target) || !!node2.closest?.(d.target);
+        };
+        if (matchesSel(el)) {
+          observe ? resizeObserve(el, d.options) : resizeUnobserve(el);
+        } else if (!isThis) {
+          el.querySelectorAll(d.target).forEach((sub) => {
+            observe ? resizeObserve(sub, d.options) : resizeUnobserve(sub);
+          });
+        }
+      }
+    };
+    const handleIntersectionDelegate = (n, observe) => {
+      if (n.nodeType !== 1) return;
+      const el = n;
+      for (const d of intersectionDelegates) {
+        const isThis = d.target === "$this" || d.target === "";
+        const matchesSel = (node2) => {
+          if (!node2 || node2.nodeType !== 1) return false;
+          if (isThis) return true;
+          return node2.matches?.(d.target) || !!node2.closest?.(d.target);
+        };
+        if (matchesSel(el)) {
+          observe ? d.observe(el) : d.unobserve(el);
+        } else if (!isThis) {
+          el.querySelectorAll(d.target).forEach((sub) => {
+            observe ? d.observe(sub) : d.unobserve(sub);
+          });
+        }
+      }
+    };
+    if (mutationObserverSet?.length || resizeDelegates.length > 0 || intersectionDelegates.length > 0) {
+      const callbacks = [...new Set((mutationObserverSet ?? []).map((e) => e.callback))];
+      const mo = new win.MutationObserver((mutations, obs) => {
+        for (const mut of mutations) {
+          Array.from(mut.addedNodes || []).forEach((n) => {
+            handleResizeDelegate(n, true);
+            handleIntersectionDelegate(n, true);
+          });
+          Array.from(mut.removedNodes || []).forEach((n) => {
+            handleResizeDelegate(n, false);
+            handleIntersectionDelegate(n, false);
+          });
+        }
+        for (const cb of callbacks) cb(mutations, obs);
+      });
+      const moObserveTargets = /* @__PURE__ */ new Map();
+      const mergeMutationInit = (existing, next) => {
+        if (!existing) return next;
+        const mergedFilter = existing.attributeFilter || next.attributeFilter ? [.../* @__PURE__ */ new Set([...existing.attributeFilter ?? [], ...next.attributeFilter ?? []])] : void 0;
+        return {
+          childList: existing.childList || next.childList,
+          attributes: existing.attributes || next.attributes,
+          characterData: existing.characterData || next.characterData,
+          subtree: existing.subtree || next.subtree,
+          attributeOldValue: existing.attributeOldValue || next.attributeOldValue,
+          characterDataOldValue: existing.characterDataOldValue || next.characterDataOldValue,
+          attributeFilter: mergedFilter
+        };
+      };
+      const addObserveTarget = (target, options) => {
+        moObserveTargets.set(target, mergeMutationInit(moObserveTargets.get(target), options));
+      };
+      for (const e of mutationObserverSet ?? []) {
+        if (e.delegate) continue;
+        const init = e.options ?? { childList: true };
+        if (typeof e.target === "string") {
+          const scope = resolveDelegateRoots(e.delegateRoot);
+          for (const sr of scope) {
+            sr.querySelectorAll(e.target).forEach((el) => addObserveTarget(el, init));
+          }
+          continue;
+        }
+        addObserveTarget(e.target, init);
+      }
+      for (const d of resizeDelegates) {
+        for (const r of resolveDelegateRoots(d.delegateRoot)) addObserveTarget(r, { childList: true, subtree: true });
+      }
+      for (const d of intersectionDelegates) {
+        for (const r of resolveDelegateRoots(d.delegateRoot)) addObserveTarget(r, { childList: true, subtree: true });
+      }
+      for (const [target, options] of moObserveTargets) {
+        mo.observe(target, options);
+      }
+      observers.push(mo);
+    }
+    inst.__swc_observers = observers;
+  };
   const originalConnected = proto.connectedCallback;
   proto.connectedCallback = async function() {
     ensureInit(this);
@@ -14764,14 +16310,12 @@ var elementDefine = (name, config = {}) => (constructor) => {
       }
       const conf = getElementConfig(this);
       const currentWin = this._resolveWindow(conf);
-      const bMethods = findAllOnConnectedBeforeMetadata(this);
-      for (const m of bMethods) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
+      for (const m of findAllOnConnectedBeforeMetadata(this)) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
       this._executeSwcScript("swc-on-before-connected", helperHostSet);
       const targetConnectedList = useSsr ? [] : findAllOnConnectedMetadata(constructor);
       const shadowMode = conf?.useShadow || targetConnectedList.find((it) => it.options.useShadow)?.options.useShadow;
       if (shadowMode && !this.shadowRoot) {
         const mode = shadowMode === true ? "open" : shadowMode;
-        console.log("tagName=", this.tagName, "mode", mode, this.shadowRoot);
         this.attachShadow({ mode });
       }
       const stateContext = { ...helperHostSet };
@@ -14780,7 +16324,6 @@ var elementDefine = (name, config = {}) => (constructor) => {
       });
       const shadowChildren = [];
       const lightChildren = [];
-      console.log("targetConnectList", this.tagName, targetConnectedList.length);
       if (targetConnectedList.length > 0) {
         for (const meta of targetConnectedList) {
           let res = await this._invokeLifecycleMethod(meta.propertyKey, helperHostSet);
@@ -14821,188 +16364,14 @@ var elementDefine = (name, config = {}) => (constructor) => {
         });
         globalDelegatedRoots.add(root);
       }
-      const delegateListeners = [];
-      const nonDelegateListeners = [];
-      addEventListenerList.forEach((meta) => {
-        const isStringSelector = typeof meta.selector === "string";
-        if (meta.options.delegate && isStringSelector && meta.selector !== "$window" && meta.selector !== "$document" && meta.selector !== "$host" && meta.selector !== "$appHost" && meta.selector !== "$firstHost" && meta.selector !== "$lastHost" && meta.selector !== "$firstAppHost" && meta.selector !== "$lastAppHost" && meta.selector !== "$hosts" && meta.selector !== "$appHosts" && meta.selector !== "$this" && 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 (event2) => {
-            for (const meta of sortedMetaList) {
-              const { selector, options } = meta;
-              const matchedEl = event2.target?.closest(selector);
-              if (matchedEl && br.contains(matchedEl)) {
-                if (options.filter) {
-                  const helper = SwcUtils.getHelperAndHostSet(currentWin, matchedEl);
-                  if (!options.filter(event2, helper)) {
-                    continue;
-                  }
-                }
-                if (options.stopPropagation) event2.stopPropagation();
-                if (options.stopImmediatePropagation) event2.stopImmediatePropagation();
-                if (options.preventDefault) event2.preventDefault();
-                const currentHostSet = SwcUtils.getHostSet(this);
-                const args = { event: event2, ...currentHostSet, $el: matchedEl, $root: br };
-                await this[meta.propertyKey](event2, { ...currentHostSet, $matchedElement: matchedEl }, args);
-                if (event2.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";
-        let resolvedSelector = null;
-        if (typeof selector === "function") {
-          const hostSet = SwcUtils.getHelperAndHostSet(currentWin, this);
-          const result = selector(this, hostSet);
-          if (typeof result === "string") {
-            resolvedSelector = result;
-          } else if (result instanceof currentWin.Element) {
-            bindTargets.push(result);
-          } else if (result instanceof currentWin.NodeList) {
-            bindTargets.push(...Array.from(result));
-          } else if (Array.isArray(result)) {
-            bindTargets.push(...result);
-          }
-        } else {
-          resolvedSelector = selector;
-        }
-        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 (resolvedSelector) {
-          if (resolvedSelector === "$window") bindTargets.push(currentWin);
-          else if (resolvedSelector === "$document") bindTargets.push(currentWin.document);
-          else if (resolvedSelector === "$host") applyRootOption(helperHostSet.$host);
-          else if (resolvedSelector === "$parentHost") applyRootOption(helperHostSet.$parentHost);
-          else if (resolvedSelector === "$appHost") applyRootOption(helperHostSet.$appHost);
-          else if (resolvedSelector === "$firstHost") applyRootOption(helperHostSet.$firstHost);
-          else if (resolvedSelector === "$lastHost") applyRootOption(helperHostSet.$lastHost);
-          else if (resolvedSelector === "$firstAppHost") applyRootOption(helperHostSet.$firstAppHost);
-          else if (resolvedSelector === "$lastAppHost") applyRootOption(helperHostSet.$lastAppHost);
-          else if (resolvedSelector === "$hosts") helperHostSet.$hosts.forEach(applyRootOption);
-          else if (resolvedSelector === "$appHosts") helperHostSet.$appHosts.forEach(applyRootOption);
-          else if (resolvedSelector === "$this" || !resolvedSelector) 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(resolvedSelector).forEach((el) => bindTargets.push(el));
-            });
-          }
-        }
-        bindTargets.forEach((t) => {
-          const handler = async (event2) => {
-            if (options.filter) {
-              const helper = SwcUtils.getHelperAndHostSet(currentWin, t);
-              if (!options.filter(event2, { currentThis: this, helper })) {
-                return;
-              }
-            }
-            if (options.stopPropagation) event2.stopPropagation();
-            if (options.stopImmediatePropagation) event2.stopImmediatePropagation();
-            if (options.preventDefault) event2.preventDefault();
-            const currentHostSet = SwcUtils.getHostSet(this);
-            const args = { event: event2, ...currentHostSet, $el: t, $root: t };
-            await this[meta.propertyKey](event2, { currentHostSet, $matchedElement: event2.currentTarget }, args);
-          };
-          const eventSubject = new Subject();
-          let eventStream = eventSubject;
-          if (options.debounceTime !== void 0 && options.debounceTime > 0) {
-            eventStream = eventStream.pipe(debounceTime(options.debounceTime));
-          }
-          if (options.throttleTime !== void 0 && options.throttleTime > 0) {
-            eventStream = eventStream.pipe(throttleTime2(options.throttleTime));
-          }
-          if (options.distinctUntilChanged !== void 0 && options.distinctUntilChanged !== false) {
-            if (typeof options.distinctUntilChanged === "function") {
-              eventStream = eventStream.pipe(distinctUntilChanged(options.distinctUntilChanged));
-            } else {
-              eventStream = eventStream.pipe(distinctUntilChanged());
-            }
-          }
-          const subscription = eventStream.subscribe({
-            next: (event2) => {
-              handler(event2).catch((err) => console.error("Event handler error:", err));
-            },
-            error: (err) => console.error("Event stream error:", err)
-          });
-          const wrappedHandler = (event2) => {
-            eventSubject.next(event2);
-          };
-          t.addEventListener(type, wrappedHandler, opts);
-          this._boundListeners.push({ target: t, type, handler: wrappedHandler, options: opts, subscription });
-        });
-      });
+      await buildObservers(SwcUtils.getHelperAndHostSet(win, this));
       if (originalConnected) await originalConnected.apply(this);
-      const aMethods = findAllOnConnectedAfterMetadata(this);
-      for (const m of aMethods) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
+      for (const m of findAllOnConnectedAfterMetadata(this)) await this._invokeLifecycleMethod(m.propertyKey, 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 {
-      for (let m of findAllLifecycleMetadata(this, ON_CONNECTED_COMPLETED_METADATA_KEY)) {
-        await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
-      }
+      for (const m of findAllLifecycleMetadata(this, ON_CONNECTED_COMPLETED_METADATA_KEY)) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
       if (appHost && typeof appHost._connectedDone === "function") {
         await appHost._connectedDone(this);
       }
@@ -15010,26 +16379,24 @@ var elementDefine = (name, config = {}) => (constructor) => {
   };
   const originalDisconnected = proto.disconnectedCallback;
   proto.disconnectedCallback = function() {
-    const appHost = helperHostSet.$appHost;
+    const appHost = helperHostSet?.$appHost;
     if (appHost && typeof appHost._disconnected === "function") {
       appHost._disconnected(this);
     }
     this._executeSwcScript("swc-on-before-disconnected", helperHostSet);
-    const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_DISCONNECTED_METADATA_KEY);
-    for (const m of bMethods) this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
-    if (this._boundListeners) {
-      this._boundListeners.forEach((l) => {
-        l.target.removeEventListener(l.type, l.handler, l.options);
-        if (l.subscription && typeof l.subscription.unsubscribe === "function") {
-          l.subscription.unsubscribe();
-        }
-      });
-      this._boundListeners = [];
+    for (const m of findAllLifecycleMetadata(this, ON_BEFORE_DISCONNECTED_METADATA_KEY)) this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
+    for (const c of cyclers) c.onDisconnected?.(helperHostSet);
+    for (const o of this.__swc_observers ?? []) {
+      try {
+        o?.disconnect?.();
+      } catch (e) {
+        console.error("[SWC] observer disconnect error:", e);
+      }
     }
+    this.__swc_observers = [];
     new ElementApply(this, { id: this._swcId }).removeAllEventListener();
     if (originalDisconnected) originalDisconnected.apply(this);
-    const aMethods = findAllLifecycleMetadata(this, ON_AFTER_DISCONNECTED_METADATA_KEY);
-    for (const m of aMethods) this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
+    for (const m of findAllLifecycleMetadata(this, ON_AFTER_DISCONNECTED_METADATA_KEY)) this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
     this._executeSwcScript("swc-on-disconnected", helperHostSet);
     this._executeSwcScript("swc-on-after-disconnected", helperHostSet);
     this.__swc_connected = false;
@@ -15038,35 +16405,34 @@ var elementDefine = (name, config = {}) => (constructor) => {
   proto.adoptedCallback = function() {
     const hostSet = SwcUtils.getHostSet(this);
     this._executeSwcScript("swc-on-before-adopted", hostSet);
-    const bMethods = findAllLifecycleMetadata(this, ON_BEFORE_ADOPTED_METADATA_KEY);
-    for (const m of bMethods) this._invokeLifecycleMethod(m.propertyKey, hostSet);
+    for (const m of findAllLifecycleMetadata(this, ON_BEFORE_ADOPTED_METADATA_KEY)) this._invokeLifecycleMethod(m.propertyKey, hostSet);
+    for (const c of cyclers) c.onAdopted?.(helperHostSet);
     if (originalAdopted) originalAdopted.apply(this);
-    const aMethods = findAllLifecycleMetadata(this, ON_AFTER_ADOPTED_METADATA_KEY);
-    for (const m of aMethods) this._invokeLifecycleMethod(m.propertyKey, hostSet);
+    for (const m of findAllLifecycleMetadata(this, ON_AFTER_ADOPTED_METADATA_KEY)) this._invokeLifecycleMethod(m.propertyKey, hostSet);
     this._executeSwcScript("swc-on-adopted", hostSet);
     this._executeSwcScript("swc-on-after-adopted", hostSet);
   };
   const originalAttributeChanged = proto.attributeChangedCallback;
   proto.attributeChangedCallback = function(name2, old, newVal) {
     if (originalAttributeChanged) originalAttributeChanged.apply(this, [name2, old, newVal]);
-    const hSet = SwcUtils.getHostSet(this);
+    const helperAndHostSet = SwcUtils.getHelperAndHostSet(win, this);
     let processedVal = newVal;
     if (newVal !== null) {
       const ae = new ActionExpression(newVal);
       const expr = ae.getFirstExpression("callReturn");
       if (expr) {
         const win2 = this._resolveWindow?.() || (typeof window !== "undefined" ? window : void 0);
-        const helperAndHostSet = SwcUtils.getHelperAndHostSet(win2, this);
+        const exprHelperAndHostSet = SwcUtils.getHelperAndHostSet(win2, this);
         const script = ConvertUtils2.decodeHtmlEntity(expr.script, win2.document);
         try {
           const result = FunctionUtils.executeReturn({
             script,
             context: this,
-            args: helperAndHostSet
+            args: exprHelperAndHostSet
           });
           processedVal = result;
         } catch (e) {
-          console.error(`[SWC] Failed to execute directive {{= ${expr.script} }} on attribute ${name2}: ${helperAndHostSet}`, e);
+          console.error(`[SWC] Failed to execute directive {{= ${expr.script} }} on attribute ${name2}: ${exprHelperAndHostSet}`, e);
           processedVal = newVal;
         }
       }
@@ -15077,20 +16443,7 @@ var elementDefine = (name, config = {}) => (constructor) => {
         this._bindAttributeEvent(this, name2, newVal, eventName);
       }
     }
-    const hostCustomEventMeta = emitHostCustomEventList.find((it) => it.options.attributeName === name2);
-    if (hostCustomEventMeta && newVal !== null) {
-      this._bindAttributeEvent(this, name2, newVal, hostCustomEventMeta.type);
-    }
-    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);
-      }
-    }
+    for (const c of cyclers) c.onAttributeChanged?.(helperAndHostSet, name2, old, processedVal);
   };
   Object.defineProperty(constructor, "observedAttributes", {
     get: () => mergedObservedAttributes,
@@ -15320,6 +16673,9 @@ function attribute(selectorOrAttributeOrTarget, attributeNameOrOptions, optionsO
   return applyAttribute("$this", void 0, selectorOrAttributeOrTarget);
 }
 function setAttribute(selectorOrAttributeOrOptions, attributeNameOrOptions, optionsOrUndefined) {
+  if (typeof selectorOrAttributeOrOptions === "function") {
+    return applyAttribute(selectorOrAttributeOrOptions, attributeNameOrOptions, optionsOrUndefined);
+  }
   if (typeof selectorOrAttributeOrOptions === "string") {
     const isSelector = isCssSelector(selectorOrAttributeOrOptions);
     if (isSelector) {
@@ -15342,6 +16698,22 @@ var findAllAttributeApplyMetadata = (target) => {
   });
   return result;
 };
+var attr = applyAttribute;
+function attrThis(targetAttributeName, options) {
+  return applyAttribute("$this", targetAttributeName, options);
+}
+function attrAppHost(targetAttributeName, options) {
+  return applyAttribute("$appHost", targetAttributeName, options);
+}
+function attrLight(selector, targetAttributeName, options) {
+  return applyAttribute(selector, targetAttributeName, { ...options ?? {}, root: "light" });
+}
+function attrShadow(selector, targetAttributeName, options) {
+  return applyAttribute(selector, targetAttributeName, { ...options ?? {}, root: "shadow" });
+}
+function attrAll(selector, targetAttributeName, options) {
+  return applyAttribute(selector, targetAttributeName, { ...options ?? {}, root: "all" });
+}
 
 // src/decorators/applyNode.ts
 var APPLY_NODE_METADATA_KEY = Symbol.for("simple-web-component:apply-node");
@@ -15632,6 +17004,23 @@ function clearChildrenLight(selectorOrOptions, maybeOptions, descriptor) {
   }
   return applyNode({ ...selectorOrOptions, position: "clearChildren", root: "light" });
 }
+var apply = applyNode;
+var node = applyNode;
+function applyThis(options) {
+  return applyNode("$this", options);
+}
+function applyAppHost(options) {
+  return applyNode("$appHost", options);
+}
+function applyLight(selector, options) {
+  return applyNode(selector, { ...options ?? {}, root: "light" });
+}
+function applyShadow(selector, options) {
+  return applyNode(selector, { ...options ?? {}, root: "shadow" });
+}
+function applyAll(selector, options) {
+  return applyNode(selector, { ...options ?? {}, root: "all" });
+}
 var findAllApplyNodeMetadata = (target) => {
   const result = /* @__PURE__ */ new Map();
   const maps = ReflectUtils.findAllMetadata(APPLY_NODE_METADATA_KEY, target);
@@ -15642,6 +17031,44 @@ var findAllApplyNodeMetadata = (target) => {
   });
   return result;
 };
+var filterScopeOf = (target) => {
+  if (target && typeof target.querySelector === "function") {
+    return target;
+  }
+  const host = target?.host;
+  return host && typeof host.querySelector === "function" ? host : null;
+};
+var tagNameOf = (node2) => {
+  const tag = node2?.tagName;
+  return typeof tag === "string" ? tag.toLowerCase() : null;
+};
+var skipIfSameTagPresent = (target, newValue) => {
+  const nodes = (Array.isArray(newValue) ? newValue : [newValue]).filter((n) => tagNameOf(n) !== null);
+  if (nodes.length === 0) return true;
+  const scope = filterScopeOf(target);
+  if (!scope) return true;
+  return !nodes.some((n) => scope.querySelector(tagNameOf(n)));
+};
+var skipIfExists = (selector) => (target) => {
+  const scope = filterScopeOf(target);
+  if (!scope) return true;
+  return !scope.querySelector(selector);
+};
+var skipIfEmpty = (_target, newValue) => {
+  if (newValue === null || newValue === void 0 || newValue === false) return false;
+  if (typeof newValue === "string") return newValue.trim().length > 0;
+  if (Array.isArray(newValue)) return newValue.length > 0;
+  return true;
+};
+var applyIfChanged = (target, newValue) => {
+  const textOf = (v) => {
+    if (typeof v === "string") return v;
+    if (Array.isArray(v)) return v.map(textOf).join("");
+    return typeof v?.textContent === "string" ? v.textContent : "";
+  };
+  const current = typeof target?.textContent === "string" ? target.textContent : "";
+  return current !== textOf(newValue);
+};
 
 // src/decorators/applyClass.ts
 var CLASS_METADATA_KEY = Symbol.for("simple-web-component:class");
@@ -15661,6 +17088,9 @@ var resolveSelector2 = (selector, inst, win) => {
     if (result === null) {
       return [];
     }
+    if (result instanceof win.Node) {
+      return [];
+    }
     return result;
   }
   return selector;
@@ -15742,7 +17172,7 @@ function createClassDecorator(action) {
                 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(" ");
+                  classes = Object.entries(resolvedRes).filter(([_, force]) => typeof force === "function" ? force(targetEl, hostSet) : !!force).map(([cls2]) => cls2).join(" ");
                 } else {
                   classes = Array.isArray(resolvedRes) ? resolvedRes.join(" ") : String(resolvedRes);
                 }
@@ -15751,9 +17181,9 @@ function createClassDecorator(action) {
                 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]) => {
+                  Object.entries(resolvedRes).forEach(([cls2, force]) => {
                     const isActive = typeof force === "function" ? force(targetEl, hostSet) : !!force;
-                    targetEl.classList.toggle(cls, isActive);
+                    targetEl.classList.toggle(cls2, isActive);
                   });
                 } else {
                   const classes = Array.isArray(resolvedRes) ? resolvedRes.map(String) : [String(resolvedRes)];
@@ -15765,11 +17195,11 @@ function createClassDecorator(action) {
                   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]) => {
+                  Object.entries(resolvedRes).forEach(([cls2, force]) => {
                     const shouldExecute = typeof force === "function" ? force(targetEl, hostSet) : !!force;
                     if (shouldExecute) {
-                      if (action === "add") targetEl.classList.add(cls);
-                      else targetEl.classList.remove(cls);
+                      if (action === "add") targetEl.classList.add(cls2);
+                      else targetEl.classList.remove(cls2);
                     }
                   });
                 } else {
@@ -15793,10 +17223,10 @@ function createClassDecorator(action) {
   };
 }
 function applyClass(selectorOrTarget, actionOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof actionOrPropertyKey === "string" || typeof actionOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof actionOrPropertyKey === "string" || typeof actionOrPropertyKey === "symbol")) {
     return createClassDecorator("update")("$this", {})(selectorOrTarget, actionOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     const action2 = typeof actionOrPropertyKey === "string" ? actionOrPropertyKey : "update";
     const options2 = typeof actionOrPropertyKey === "object" ? actionOrPropertyKey : optionsOrDescriptor;
     return createClassDecorator(action2)(selectorOrTarget, options2);
@@ -15806,50 +17236,72 @@ function applyClass(selectorOrTarget, actionOrPropertyKey, optionsOrDescriptor)
   return createClassDecorator(action)("$this", options);
 }
 function setClass(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
     return createClassDecorator("set")("$this", {})(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createClassDecorator("set")(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
   return createClassDecorator("set")("$this", selectorOrTarget);
 }
 function updateClass(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
     return createClassDecorator("update")("$this", {})(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createClassDecorator("update")(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
   return createClassDecorator("update")("$this", selectorOrTarget);
 }
 function addClass(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
     return createClassDecorator("add")("$this", {})(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createClassDecorator("add")(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
   return createClassDecorator("add")("$this", selectorOrTarget);
 }
 function removeClass(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
     return createClassDecorator("remove")("$this", {})(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createClassDecorator("remove")(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
   return createClassDecorator("remove")("$this", selectorOrTarget);
 }
 function toggleClass(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof classMapOrOptionsOrPropertyKey === "string" || typeof classMapOrOptionsOrPropertyKey === "symbol")) {
     return createClassDecorator("toggle")("$this", {})(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createClassDecorator("toggle")(selectorOrTarget, classMapOrOptionsOrPropertyKey, optionsOrDescriptor);
   }
   return createClassDecorator("toggle")("$this", selectorOrTarget);
 }
+var cls = applyClass;
+function clsThis(action, options) {
+  return applyClass("$this", action, options);
+}
+function clsAppHost(action, options) {
+  return applyClass("$appHost", action, options);
+}
+function clsLight(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyClass(selector, action, { ...opts ?? {}, root: "light" });
+}
+function clsShadow(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyClass(selector, action, { ...opts ?? {}, root: "shadow" });
+}
+function clsAll(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyClass(selector, action, { ...opts ?? {}, root: "all" });
+}
 var findAllClassMetadata = (target) => {
   const result = /* @__PURE__ */ new Map();
   const maps = ReflectUtils.findAllMetadata(CLASS_METADATA_KEY, target);
@@ -15879,6 +17331,9 @@ var resolveSelector3 = (selector, inst, win) => {
     if (result === null) {
       return [];
     }
+    if (result instanceof win.Node) {
+      return [];
+    }
     return result;
   }
   return selector;
@@ -15951,12 +17406,12 @@ function createStyleDecorator(action) {
               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]) => {
+                  Object.entries(resolvedRes).forEach(([prop2, val]) => {
                     const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
                     if (finalVal === null || finalVal === void 0) {
-                      targetEl.style.removeProperty(prop);
+                      targetEl.style.removeProperty(prop2);
                     } else {
-                      targetEl.style[prop] = String(finalVal);
+                      targetEl.style[prop2] = String(finalVal);
                     }
                   });
                 } else if (typeof resolvedRes === "string") {
@@ -15964,10 +17419,10 @@ function createStyleDecorator(action) {
                 }
               } else if (action === "remove") {
                 if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
-                  Object.entries(resolvedRes).forEach(([prop, val]) => {
+                  Object.entries(resolvedRes).forEach(([prop2, val]) => {
                     const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
                     if (shouldRemove) {
-                      targetEl.style.removeProperty(prop);
+                      targetEl.style.removeProperty(prop2);
                     }
                   });
                 } else {
@@ -15990,10 +17445,10 @@ function createStyleDecorator(action) {
   };
 }
 function applyStyle(selectorOrTarget, actionOrPropertyKey, optionsOrDescriptor) {
-  if (optionsOrDescriptor !== void 0 && (typeof actionOrPropertyKey === "string" || typeof actionOrPropertyKey === "symbol")) {
+  if (optionsOrDescriptor !== void 0 && typeof selectorOrTarget !== "string" && typeof selectorOrTarget !== "function" && (typeof actionOrPropertyKey === "string" || typeof actionOrPropertyKey === "symbol")) {
     return createStyleDecorator("update")("$this", {})(selectorOrTarget, actionOrPropertyKey, optionsOrDescriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     const action2 = typeof actionOrPropertyKey === "string" ? actionOrPropertyKey : "update";
     const options2 = typeof actionOrPropertyKey === "object" ? actionOrPropertyKey : optionsOrDescriptor;
     return createStyleDecorator(action2)(selectorOrTarget, options2);
@@ -16006,7 +17461,7 @@ function setStyle(selectorOrTarget, optionsOrPropertyKey, descriptor) {
   if (descriptor !== void 0 && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol")) {
     return createStyleDecorator("set")("$this", {})(selectorOrTarget, optionsOrPropertyKey, descriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createStyleDecorator("set")(selectorOrTarget, optionsOrPropertyKey);
   }
   return createStyleDecorator("set")("$this", selectorOrTarget);
@@ -16015,7 +17470,7 @@ function updateStyle(selectorOrTarget, optionsOrPropertyKey, descriptor) {
   if (descriptor !== void 0 && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol")) {
     return createStyleDecorator("update")("$this", {})(selectorOrTarget, optionsOrPropertyKey, descriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createStyleDecorator("update")(selectorOrTarget, optionsOrPropertyKey);
   }
   return createStyleDecorator("update")("$this", selectorOrTarget);
@@ -16024,11 +17479,33 @@ function removeStyle(selectorOrTarget, optionsOrPropertyKey, descriptor) {
   if (descriptor !== void 0 && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol")) {
     return createStyleDecorator("remove")("$this", {})(selectorOrTarget, optionsOrPropertyKey, descriptor);
   }
-  if (typeof selectorOrTarget === "string") {
+  if (typeof selectorOrTarget === "string" || typeof selectorOrTarget === "function") {
     return createStyleDecorator("remove")(selectorOrTarget, optionsOrPropertyKey);
   }
   return createStyleDecorator("remove")("$this", selectorOrTarget);
 }
+var style = applyStyle;
+function styleThis(action, options) {
+  return applyStyle("$this", action, options);
+}
+function styleAppHost(action, options) {
+  return applyStyle("$appHost", action, options);
+}
+function styleLight(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyStyle(selector, action, { ...opts ?? {}, root: "light" });
+}
+function styleShadow(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyStyle(selector, action, { ...opts ?? {}, root: "shadow" });
+}
+function styleAll(selector, actionOrOptions, options) {
+  const action = typeof actionOrOptions === "string" ? actionOrOptions : void 0;
+  const opts = typeof actionOrOptions === "object" ? actionOrOptions : options;
+  return applyStyle(selector, action, { ...opts ?? {}, root: "all" });
+}
 var findAllStyleMetadata = (target) => {
   const result = /* @__PURE__ */ new Map();
   const maps = ReflectUtils.findAllMetadata(STYLE_METADATA_KEY, target);
@@ -16040,89 +17517,6 @@ var findAllStyleMetadata = (target) => {
   return result;
 };
 
-// src/decorators/subscribeSwcAppRouteChangeWhileConnected.ts
-var SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:subscribe-swc-app-route-change-while-connected");
-function createSubscribeSwcAppRouteChangeWhileConnected(options) {
-  return (target, propertyKey, descriptor) => {
-    const pathPattern = options?.path;
-    const filter = options?.filter;
-    const constructor = target.constructor;
-    let list = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, constructor);
-    if (!list) {
-      list = [];
-      ReflectUtils.defineMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, list, constructor);
-    }
-    list.push({ propertyKey, options });
-    return descriptor;
-  };
-}
-function subscribeSwcAppRouteChangeWhileConnected(targetOrOptions, propertyKeyOrConfig, descriptor) {
-  if (propertyKeyOrConfig && (typeof propertyKeyOrConfig === "string" || typeof propertyKeyOrConfig === "symbol")) {
-    return createSubscribeSwcAppRouteChangeWhileConnected({})(targetOrOptions, propertyKeyOrConfig, descriptor);
-  }
-  let options = {};
-  if (Array.isArray(targetOrOptions)) {
-    options.path = targetOrOptions;
-    if (propertyKeyOrConfig && typeof propertyKeyOrConfig === "object") {
-      options = { ...options, ...propertyKeyOrConfig };
-    }
-  } else if (typeof targetOrOptions === "string" || typeof targetOrOptions === "function") {
-    options.path = targetOrOptions;
-    if (propertyKeyOrConfig && typeof propertyKeyOrConfig === "object") {
-      options = { ...options, ...propertyKeyOrConfig };
-    }
-  } else if (targetOrOptions && typeof targetOrOptions === "object") {
-    options = targetOrOptions;
-  }
-  return createSubscribeSwcAppRouteChangeWhileConnected(options);
-}
-var changedRoute = subscribeSwcAppRouteChangeWhileConnected;
-var getSubscribeSwcAppRouteChangeWhileConnectedMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  const results = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY, constructor);
-  if (!results) return [];
-  return [...results].sort((a, b) => (a.options?.order ?? 0) - (b.options?.order ?? 0));
-};
-
-// src/decorators/subscribeSwcAppMessageWhileConnected.ts
-var SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY = Symbol.for("simple-web-component:subscribe-swc-app-message-while-connected");
-function createSubscribeSwcAppMessageWhileConnected(options, messageType) {
-  return (target, propertyKey, descriptor) => {
-    const filter = options?.filter;
-    const constructor = target.constructor;
-    let list = ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, constructor);
-    if (!list) {
-      list = [];
-      ReflectUtils.defineMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, list, constructor);
-    }
-    list.push({ propertyKey, messageType, filter });
-    return descriptor;
-  };
-}
-function subscribeSwcAppMessageWhileConnected(targetOrMessageTypeOrOptions, optionsOrPropertyKey, descriptor) {
-  if (targetOrMessageTypeOrOptions && typeof targetOrMessageTypeOrOptions === "object" && optionsOrPropertyKey && (typeof optionsOrPropertyKey === "string" || typeof optionsOrPropertyKey === "symbol") && descriptor) {
-    const target = targetOrMessageTypeOrOptions;
-    const propertyKey = optionsOrPropertyKey;
-    return createSubscribeSwcAppMessageWhileConnected({})(target, propertyKey, descriptor);
-  }
-  let messageType;
-  let options = {};
-  if (typeof targetOrMessageTypeOrOptions === "string") {
-    messageType = targetOrMessageTypeOrOptions;
-    if (optionsOrPropertyKey && typeof optionsOrPropertyKey === "object") {
-      options = optionsOrPropertyKey;
-    }
-  } else if (targetOrMessageTypeOrOptions && typeof targetOrMessageTypeOrOptions === "object") {
-    options = targetOrMessageTypeOrOptions;
-  }
-  return createSubscribeSwcAppMessageWhileConnected(options, messageType);
-}
-var receiveMessage = subscribeSwcAppMessageWhileConnected;
-var getSubscribeSwcAppMessageWhileConnectedMetadata = (target) => {
-  const constructor = target instanceof Function ? target : target.constructor;
-  return ReflectUtils.getOwnMetadata(SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY, constructor);
-};
-
 // src/decorators/publishSwcAppMessage.ts
 var PUBLISH_SWC_APP_MESSAGE_METADATA_KEY = Symbol.for("simple-web-component:publish-swc-app-message");
 function createPublishSwcAppMessage(messageType, options) {
@@ -16747,9 +18141,9 @@ var SimProxyHandler = class {
       return target[name];
     }
   }
-  set(obj, prop, value, receiver) {
+  set(obj, prop2, value, receiver) {
     value = this.simstanceManager?.proxy(value);
-    obj[prop] = value;
+    obj[prop2] = value;
     return true;
   }
   apply(target, thisArg, argumentsList) {
@@ -19511,13 +20905,21 @@ export {
   ATTRIBUTE_METADATA_KEY,
   BROWSER_GLOBALS,
   CLASS_METADATA_KEY,
+  ChangedAttributeLifeCycler,
   esm_exports as Core,
   esm_exports2 as CoreWeb,
   DOM_EVENT_NAMES,
   ELEMENT_CONFIG_KEY,
   EMIT_CUSTOM_EVENT_METADATA_KEY,
+  EmitCustomEventLifeCycler,
+  EventListenerLifeCycler,
   HTML_TAG_ENTRIES,
+  INTERSECTION_OBSERVER_METADATA_KEY,
   InjectSituationType2 as InjectSituationType,
+  IntersectionObserverLifeCycler,
+  MUTATION_OBSERVER_METADATA_KEY,
+  MessageSubscribeLifeCycler,
+  MutationObserverLifeCycler,
   ON_ADD_EVENT_LISTENER_METADATA_KEY,
   ON_AFTER_ADOPTED_METADATA_KEY,
   ON_AFTER_CONNECTED_METADATA_KEY,
@@ -19534,11 +20936,18 @@ export {
   PUBLISH_SWC_APP_MESSAGE_METADATA_KEY,
   QUERY_ALL_METADATA_KEY,
   QUERY_METADATA_KEY,
+  RESIZE_OBSERVER_METADATA_KEY,
+  ResizeObserverLifeCycler,
+  RouteSubscribeLifeCycler,
+  SET_INTERVAL_METADATA_KEY,
+  SET_TIMEOUT_METADATA_KEY,
   STATE_METADATA_KEY,
   STYLE_METADATA_KEY,
   SUBSCRIBE_SWC_APP_MESSAGE_WHILE_CONNECTED_METADATA_KEY,
   SUBSCRIBE_SWC_APP_ROUTE_CHANGE_WHILE_CONNECTED_METADATA_KEY,
   SWC_NOT_FOUND,
+  SetIntervalLifeCycler,
+  SetTimeoutLifeCycler,
   esm_exports3 as SimpleBoot,
   SwcApp,
   SwcAppArticle,
@@ -19555,30 +20964,60 @@ export {
   SwcUtils,
   addClass,
   addEventListener,
+  addEventListenerAll,
   addEventListenerAppHost,
   addEventListenerDelegate,
-  addEventListenerDelegateAllDom,
-  addEventListenerDelegateLightDom,
-  addEventListenerDelegateShadowDom,
+  addEventListenerDelegateAll,
+  addEventListenerDelegateLight,
+  addEventListenerDelegateShadow,
   addEventListenerDocument,
+  addEventListenerLight,
+  addEventListenerMutation,
+  addEventListenerMutationAll,
+  addEventListenerMutationLight,
+  addEventListenerMutationShadow,
+  addEventListenerShadow,
   addEventListenerThis,
   addEventListenerWindow,
   appendHtmlSlot,
   appendSlot,
   appendTextSlot,
+  apply,
+  applyAll,
+  applyAppHost,
   applyAttribute,
   applyClass,
+  applyIfChanged,
+  applyLight,
   applyNode,
   applyProperty,
+  applyShadow,
   applySlot,
   applyStyle,
+  applyThis,
+  attr,
+  attrAll,
+  attrAppHost,
+  attrLight,
+  attrShadow,
+  attrThis,
   attribute,
+  callProperty,
+  callPropertyAll,
+  callPropertyLight,
+  callPropertyShadow,
   changedAttribute,
   changedRoute,
   clearChildrenLight,
   clearChildrenNode,
   clearNode,
   clearSlot,
+  cls,
+  clsAll,
+  clsAppHost,
+  clsLight,
+  clsShadow,
+  clsThis,
   commentNode,
   convertAttributeValue,
   convertValue2 as convertValue,
@@ -19596,13 +21035,31 @@ export {
   defineSwcAppSection,
   elementDefine,
   emit,
+  emitAll,
+  emitAppHost,
   emitCustomEvent,
+  emitDocument,
+  emitLight,
+  emitShadow,
+  emitThis,
+  emitWindow,
   ensureInit,
   event,
+  eventAll,
+  eventAppHost,
   eventDelegate,
-  eventDelegateAllDom,
-  eventDelegateLightDom,
-  eventDelegateShadowDom,
+  eventDelegateAll,
+  eventDelegateLight,
+  eventDelegateShadow,
+  eventDocument,
+  eventLight,
+  eventMutation,
+  eventMutationAll,
+  eventMutationLight,
+  eventMutationShadow,
+  eventShadow,
+  eventThis,
+  eventWindow,
   findAllApplyNodeMetadata,
   findAllApplySlotMetadata,
   findAllAttributeApplyMetadata,
@@ -19615,6 +21072,8 @@ export {
   findAllOnConnectedMetadata,
   findAllPropertyApplyMetadata,
   findAllPropertyMetadata,
+  findAllSetIntervalMetadata,
+  findAllSetTimeoutMetadata,
   findAllStateMetadata,
   findAllStyleMetadata,
   getAddEventListenerMetadata,
@@ -19622,9 +21081,12 @@ export {
   getChangedAttributeMetadata,
   getElementConfig,
   getEmitCustomEventMetadataList,
+  getIntersectionObserverMetadata,
+  getMutationObserverMetadata,
   getPublishSwcAppMessageMetadata,
   getQueryAllMetadata,
   getQueryMetadata,
+  getResizeObserverMetadata,
   getSubscribeSwcAppMessageWhileConnectedMetadata,
   getSubscribeSwcAppRouteChangeWhileConnectedMetadata,
   html,
@@ -19650,7 +21112,26 @@ export {
   insertBeforeEnd,
   insertBeforeEndLight,
   insertBeforeEndShadow,
+  intersectionObserver,
+  intersectionObserverAll,
+  intersectionObserverDelegate,
+  intersectionObserverDelegateAll,
+  intersectionObserverDelegateLight,
+  intersectionObserverDelegateShadow,
+  intersectionObserverLight,
+  intersectionObserverShadow,
+  intersectionObserverThis,
   isSSR,
+  mutationObserver,
+  mutationObserverAll,
+  mutationObserverDelegate,
+  mutationObserverDelegateAll,
+  mutationObserverDelegateLight,
+  mutationObserverDelegateShadow,
+  mutationObserverLight,
+  mutationObserverShadow,
+  mutationObserverThis,
+  node,
   onAdopted,
   onAdoptedAfter,
   onAdoptedBefore,
@@ -19665,14 +21146,33 @@ export {
   onDisconnectedAfter,
   onDisconnectedBefore,
   onInitialize,
+  pickElements,
   prependHtmlSlot,
   prependSlot,
   prependTextSlot,
+  prop,
+  propAll,
+  propAppHost,
+  propDocument,
+  propLight,
+  propShadow,
+  propThis,
+  propWindow,
   property,
+  propertyAll,
+  propertyLight,
+  propertyShadow,
   publishMessage,
   publishSwcAppMessage,
   query,
   queryAll,
+  queryAllAll,
+  queryAllLight,
+  queryAllRoots,
+  queryAllShadow,
+  queryIn,
+  queryLight,
+  queryShadow,
   receiveMessage,
   removeClass,
   removeSSRAttribute,
@@ -19682,14 +21182,38 @@ export {
   replaceChildrenLight,
   replaceChildrenSlot,
   replaceChildrenTextSlot,
+  resizeObserver,
+  resizeObserverAll,
+  resizeObserverDelegate,
+  resizeObserverDelegateAll,
+  resizeObserverDelegateLight,
+  resizeObserverDelegateShadow,
+  resizeObserverLight,
+  resizeObserverShadow,
+  resizeObserverThis,
   resolveAttributeTargets,
   resolvePropertyTargets,
+  resolveQueryElements,
   setAttribute,
   setClass,
+  setInterval2 as setInterval,
   setProperty,
+  setPropertyAll,
+  setPropertyLight,
+  setPropertyShadow,
   setSSRAttribute,
   setStyle,
+  setTimeout2 as setTimeout,
+  skipIfEmpty,
+  skipIfExists,
+  skipIfSameTagPresent,
   state,
+  style,
+  styleAll,
+  styleAppHost,
+  styleLight,
+  styleShadow,
+  styleThis,
   subscribeSwcAppMessageWhileConnected,
   subscribeSwcAppRouteChangeWhileConnected,
   swcAppArticleTagName,