@dooboostore/simple-web-component 1.0.46 → 1.0.48

package/dist/cjs/decorators/query.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/query.ts"],
-  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { getElementConfig, ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport interface QueryOptions extends SwcQueryOptions {\n  /**\n   * Filter function to determine whether to include the element.\n   * If it returns false, the element is skipped.\n   */\n  filter?: (target: HTMLElement, meta: { currentThis: any, helper: HelperHostSet }) => boolean;\n}\n\nexport interface QueryMetadata {\n  propertyKey: string | symbol;\n  selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null);\n  options: QueryOptions ;\n}\n\nexport const QUERY_METADATA_KEY = Symbol.for('simple-web-component:query');\n\nexport function query(target: Object, propertyKey: string | symbol, descriptor?: PropertyDescriptor): PropertyDescriptor | void;\nexport function query(selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null), options?: QueryOptions): PropertyDecorator;\nexport function query(options?: QueryOptions): PropertyDecorator;\n/**\n * @query decorator to inject a single element into a class property.\n * \n * Supports both string selectors and function-based selectors:\n * - String selector: @query('#my-element')\n * - Function selector: @query((currentThis, helper) => currentThis.shadowRoot?.querySelector('.item'))\n * \n * Supports filtering:\n * - @query('#my-element', { filter: (target, meta) => target.hasAttribute('active') })\n */\nexport function query(selectorOrTarget?: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null) | Object, optionsOrPropertyKey?: QueryOptions | string | symbol, descriptor?: PropertyDescriptor): any {\n  // Bare decorator: @query\n  if (descriptor !== undefined && (typeof optionsOrPropertyKey === 'string' || typeof optionsOrPropertyKey === 'symbol')) {\n    throw new Error(`@query decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);\n  }\n  // With selector\n  if (typeof selectorOrTarget === 'string' || typeof selectorOrTarget === 'function') {\n    return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {\n      if (descriptor !== undefined) {\n        throw new Error(`@query decorator cannot be used on methods. (Method: ${String(propertyKey)})`);\n      }\n\n      const constructor = targetObj.constructor;\n      let queries = ReflectUtils.getMetadata<QueryMetadata[]>(QUERY_METADATA_KEY, constructor);\n      if (!queries) {\n        queries = [];\n        ReflectUtils.defineMetadata(QUERY_METADATA_KEY, queries, constructor);\n      }\n      queries.push({ propertyKey, selector: selectorOrTarget as any, options: optionsOrPropertyKey as QueryOptions || {} });\n\n      Object.defineProperty(targetObj, propertyKey, {\n        get(this: HTMLElement) {\n          ensureInit(this);\n          const config = getElementConfig(this);\n          const win = config?.window || window;\n          const hostSet = SwcUtils.getHelperAndHostSet(win, this);\n          \n          // Resolve selector - can be string or function\n          let resolvedSelector: string;\n          let resolvedElement: HTMLElement | null = null;\n          \n          if (typeof selectorOrTarget === 'function') {\n            const result = (selectorOrTarget as any)(this, hostSet);\n            // If function returns a Node/Element, return it directly\n            if (result instanceof win.Node || result instanceof win.Element) {\n              resolvedElement = result instanceof win.HTMLElement ? (result as HTMLElement) : null;\n            }\n            // If function returns NodeList or Element[], return first element\n            else if (result instanceof win.NodeList || Array.isArray(result)) {\n              resolvedElement = result.length > 0 && result[0] instanceof win.HTMLElement ? (result[0] as HTMLElement) : null;\n            }\n          } else {\n            resolvedSelector = selectorOrTarget;\n\n            const r = (optionsOrPropertyKey as QueryOptions)?.root || 'auto';\n            const applyRoot = (t: any) => {\n              if (!t || !(t instanceof HTMLElement)) return t;\n              if (r === 'auto') return t.shadowRoot || t;\n              if (r === 'shadow') return t.shadowRoot;\n              if (r === 'light') return t;\n              if (r === 'all') return t.shadowRoot || t; \n              return t;\n            };\n\n            // --- Special Selectors: HostSet ---\n            if (resolvedSelector === '$this') resolvedElement = applyRoot(this);\n            else if (resolvedSelector === '$host') resolvedElement = applyRoot(hostSet.$host);\n            else if (resolvedSelector === '$parentHost') resolvedElement = applyRoot(hostSet.$parentHost);\n            else if (resolvedSelector === '$appHost') resolvedElement = applyRoot(hostSet.$appHost);\n            else if (resolvedSelector === '$firstHost') resolvedElement = applyRoot(hostSet.$firstHost);\n            else if (resolvedSelector === '$lastHost') resolvedElement = applyRoot(hostSet.$lastHost);\n            else if (resolvedSelector === '$firstAppHost') resolvedElement = applyRoot(hostSet.$firstAppHost);\n            else if (resolvedSelector === '$lastAppHost') resolvedElement = applyRoot(hostSet.$lastAppHost);\n            // --- Special Selectors: Env ---\n            else if (resolvedSelector === '$window') return win;\n            else if (resolvedSelector === '$document') return win.document;\n            // --- Standard Selectors ---\n            else {\n              if (r === 'shadow') resolvedElement = this.shadowRoot ? (this.shadowRoot.querySelector(resolvedSelector) as HTMLElement | null) : null;\n              else if (r === 'light') resolvedElement = this.querySelector(resolvedSelector) as HTMLElement | null;\n              else if (r === 'all') {\n                const shadowMatch = this.shadowRoot ? (this.shadowRoot.querySelector(resolvedSelector) as HTMLElement | null) : null;\n                resolvedElement = shadowMatch || (this.querySelector(resolvedSelector) as HTMLElement | null);\n              }\n              else resolvedElement = ((this.shadowRoot || this).querySelector(resolvedSelector) as HTMLElement | null);\n            }\n          }\n\n          // Apply filter if provided\n          if (resolvedElement instanceof win.HTMLElement && (optionsOrPropertyKey as QueryOptions)?.filter) {\n            const shouldInclude = (optionsOrPropertyKey as QueryOptions).filter!(resolvedElement, { currentThis: this, helper: hostSet });\n            if (!shouldInclude) {\n              return null;\n            }\n          }\n\n          return resolvedElement;\n        },\n        set(this: HTMLElement, nv: any) {\n          ensureInit(this);\n          if (nv === null || nv === undefined) {\n            const config = getElementConfig(this);\n            const win = config?.window || window;\n            const hostSet = SwcUtils.getHelperAndHostSet(win, this);\n            \n            // Resolve selector - can be string or function\n            if (typeof selectorOrTarget === 'function') {\n              // Get the element from function and remove it\n              const result = (selectorOrTarget as any)(this, hostSet);\n              if (result instanceof win.Element) {\n                (result as Element).remove();\n              } else if (result instanceof win.NodeList || Array.isArray(result)) {\n                const el = result.length > 0 ? result[0] : null;\n                if (el instanceof win.Element) {\n                  (el as Element).remove();\n                }\n              }\n              return;\n            }\n            \n            const resolvedSelector = selectorOrTarget;\n            \n            if (resolvedSelector.startsWith('$') && resolvedSelector !== '$this') return;\n\n            const r = (optionsOrPropertyKey as QueryOptions)?.root || 'auto';\n            const targets: Element[] = [];\n\n            if (r === 'shadow') {\n              if (this.shadowRoot?.querySelector(resolvedSelector)) targets.push(this.shadowRoot.querySelector(resolvedSelector)!);\n            } else if (r === 'light') {\n              if (this.querySelector(resolvedSelector)) targets.push(this.querySelector(resolvedSelector)!);\n            } else if (r === 'all') {\n              if (this.shadowRoot?.querySelector(resolvedSelector)) targets.push(this.shadowRoot.querySelector(resolvedSelector)!);\n              if (this.querySelector(resolvedSelector)) targets.push(this.querySelector(resolvedSelector)!);\n            } else {\n              const el = (this.shadowRoot || this).querySelector(resolvedSelector);\n              if (el) targets.push(el);\n            }\n\n            targets.forEach(t => t.remove());\n          }\n        },\n        enumerable: true,\n        configurable: true\n      });\n    };\n  }\n  // Without selector (defaults to $this)\n  return query('$this', selectorOrTarget as SwcQueryOptions);\n}\n\nexport const getQueryMetadata = (target: any): QueryMetadata[]  => {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(QUERY_METADATA_KEY, constructor) ?? [];\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { getElementConfig, ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport interface QueryOptions extends SwcQueryOptions {\n  /**\n   * Filter function to determine whether to include the element.\n   * If it returns false, the element is skipped.\n   */\n  filter?: (target: HTMLElement, meta: { currentThis: any, helper: HelperHostSet }) => boolean;\n}\n\nexport interface QueryMetadata {\n  propertyKey: string | symbol;\n  selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null);\n  options: QueryOptions ;\n}\n\nexport const QUERY_METADATA_KEY = Symbol.for('simple-web-component:query');\n\nexport function query(target: Object, propertyKey: string | symbol, descriptor?: PropertyDescriptor): PropertyDescriptor | void;\nexport function query(selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null), options?: QueryOptions): PropertyDecorator;\nexport function query(options?: QueryOptions): PropertyDecorator;\n/**\n * @query decorator to inject a single element into a class property.\n * \n * Supports both string selectors and function-based selectors:\n * - String selector: @query('#my-element')\n * - Function selector: @query((currentThis, helper) => currentThis.shadowRoot?.querySelector('.item'))\n * \n * Supports filtering:\n * - @query('#my-element', { filter: (target, meta) => target.hasAttribute('active') })\n */\nexport function query(selectorOrTarget?: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null) | Object, optionsOrPropertyKey?: QueryOptions | string | symbol, descriptor?: PropertyDescriptor): any {\n  // Bare decorator: @query\n  if (descriptor !== undefined && (typeof optionsOrPropertyKey === 'string' || typeof optionsOrPropertyKey === 'symbol')) {\n    throw new Error(`@query decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);\n  }\n  // With selector\n  if (typeof selectorOrTarget === 'string' || typeof selectorOrTarget === 'function') {\n    return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {\n      if (descriptor !== undefined) {\n        throw new Error(`@query decorator cannot be used on methods. (Method: ${String(propertyKey)})`);\n      }\n\n      const constructor = targetObj.constructor;\n      let queries = ReflectUtils.getMetadata<QueryMetadata[]>(QUERY_METADATA_KEY, constructor);\n      if (!queries) {\n        queries = [];\n        ReflectUtils.defineMetadata(QUERY_METADATA_KEY, queries, constructor);\n      }\n      queries.push({ propertyKey, selector: selectorOrTarget as any, options: optionsOrPropertyKey as QueryOptions || {} });\n\n      Object.defineProperty(targetObj, propertyKey, {\n        get(this: HTMLElement) {\n          ensureInit(this);\n          const config = getElementConfig(this);\n          const win = config?.window || window;\n          const hostSet = SwcUtils.getHelperAndHostSet(win, this);\n          \n          // Resolve selector - can be string or function\n          let resolvedSelector: string;\n          let resolvedElement: HTMLElement | null = null;\n          \n          if (typeof selectorOrTarget === 'function') {\n            const result = (selectorOrTarget as any)(this, hostSet);\n            // If function returns a Node/Element, return it directly\n            if (result instanceof win.Node || result instanceof win.Element) {\n              resolvedElement = result instanceof win.HTMLElement ? (result as HTMLElement) : null;\n            }\n            // If function returns NodeList or Element[], return first element\n            else if (result instanceof win.NodeList || Array.isArray(result)) {\n              resolvedElement = result.length > 0 && result[0] instanceof win.HTMLElement ? (result[0] as HTMLElement) : null;\n            }\n          } else {\n            resolvedSelector = selectorOrTarget;\n\n            const r = (optionsOrPropertyKey as QueryOptions)?.root || 'auto';\n            const applyRoot = (t: any) => {\n              if (!t || !(t instanceof HTMLElement)) return t;\n              if (r === 'auto') return t.shadowRoot || t;\n              if (r === 'shadow') return t.shadowRoot;\n              if (r === 'light') return t;\n              if (r === 'all') return t.shadowRoot || t; \n              return t;\n            };\n\n            // --- Special Selectors: HostSet ---\n            if (resolvedSelector === '$this') resolvedElement = applyRoot(this);\n            else if (resolvedSelector === '$host') resolvedElement = applyRoot(hostSet.$host);\n            else if (resolvedSelector === '$parentHost') resolvedElement = applyRoot(hostSet.$parentHost);\n            else if (resolvedSelector === '$appHost') resolvedElement = applyRoot(hostSet.$appHost);\n            else if (resolvedSelector === '$firstHost') resolvedElement = applyRoot(hostSet.$firstHost);\n            else if (resolvedSelector === '$lastHost') resolvedElement = applyRoot(hostSet.$lastHost);\n            else if (resolvedSelector === '$firstAppHost') resolvedElement = applyRoot(hostSet.$firstAppHost);\n            else if (resolvedSelector === '$lastAppHost') resolvedElement = applyRoot(hostSet.$lastAppHost);\n            // --- Special Selectors: Env ---\n            else if (resolvedSelector === '$window') return win;\n            else if (resolvedSelector === '$document') return win.document;\n            // --- Standard Selectors ---\n            else {\n              if (r === 'shadow') resolvedElement = this.shadowRoot ? (this.shadowRoot.querySelector(resolvedSelector) as HTMLElement | null) : null;\n              else if (r === 'light') resolvedElement = this.querySelector(resolvedSelector) as HTMLElement | null;\n              else if (r === 'all') {\n                const shadowMatch = this.shadowRoot ? (this.shadowRoot.querySelector(resolvedSelector) as HTMLElement | null) : null;\n                resolvedElement = shadowMatch || (this.querySelector(resolvedSelector) as HTMLElement | null);\n              }\n              else resolvedElement = ((this.shadowRoot || this).querySelector(resolvedSelector) as HTMLElement | null);\n            }\n          }\n\n          // Apply filter if provided\n          if (resolvedElement instanceof win.HTMLElement && (optionsOrPropertyKey as QueryOptions)?.filter) {\n            const shouldInclude = (optionsOrPropertyKey as QueryOptions).filter!(resolvedElement, { currentThis: this, helper: hostSet });\n            if (!shouldInclude) {\n              return null;\n            }\n          }\n\n          return resolvedElement;\n        },\n        set(this: HTMLElement, nv: any) {\n          ensureInit(this);\n          if (nv === null || nv === undefined) {\n            const config = getElementConfig(this);\n            const win = config?.window || window;\n            const hostSet = SwcUtils.getHelperAndHostSet(win, this);\n            \n            // Resolve selector - can be string or function\n            if (typeof selectorOrTarget === 'function') {\n              // Get the element from function and remove it\n              const result = (selectorOrTarget as any)(this, hostSet);\n              if (result instanceof win.Element) {\n                (result as Element).remove();\n              } else if (result instanceof win.NodeList || Array.isArray(result)) {\n                const el = result.length > 0 ? result[0] : null;\n                if (el instanceof win.Element) {\n                  (el as Element).remove();\n                }\n              }\n              return;\n            }\n            \n            const resolvedSelector = selectorOrTarget;\n            \n            if (resolvedSelector.startsWith('$') && resolvedSelector !== '$this') return;\n\n            const r = (optionsOrPropertyKey as QueryOptions)?.root || 'auto';\n            const targets: Element[] = [];\n\n            if (r === 'shadow') {\n              if (this.shadowRoot?.querySelector(resolvedSelector)) targets.push(this.shadowRoot.querySelector(resolvedSelector)!);\n            } else if (r === 'light') {\n              if (this.querySelector(resolvedSelector)) targets.push(this.querySelector(resolvedSelector)!);\n            } else if (r === 'all') {\n              if (this.shadowRoot?.querySelector(resolvedSelector)) targets.push(this.shadowRoot.querySelector(resolvedSelector)!);\n              if (this.querySelector(resolvedSelector)) targets.push(this.querySelector(resolvedSelector)!);\n            } else {\n              const el = (this.shadowRoot || this).querySelector(resolvedSelector);\n              if (el) targets.push(el);\n            }\n\n            targets.forEach(t => t.remove());\n          }\n        },\n        enumerable: true,\n        configurable: true\n      });\n    };\n  }\n  // Without selector (defaults to $this)\n  return query('$this', selectorOrTarget as SwcQueryOptions);\n}\n\nexport const getQueryMetadata = (target: any): QueryMetadata[]  => {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(QUERY_METADATA_KEY, constructor) ?? [];\n};\n\n// ─── root별 편의 데코레이터 ───\n\n/**\n * @queryShadow(selector, options?) — shadow DOM에서 단일 요소를 쿼리\n */\nexport function queryShadow(selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null), options?: Omit<QueryOptions, 'root'>): PropertyDecorator {\n  return query(selector, {...options ?? {}, root: 'shadow'});\n}\n\n/**\n * @queryLight(selector, options?) — light DOM에서 단일 요소를 쿼리\n */\nexport function queryLight(selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null), options?: Omit<QueryOptions, 'root'>): PropertyDecorator {\n  return query(selector, {...options ?? {}, root: 'light'});\n}\n\n/**\n * @queryAll(selector, options?) — shadow+light 모두에서 요소를 쿼리\n */\nexport function queryAllRoots(selector: string | ((currentThis: any, helper: HelperHostSet) => Node | NodeList | Element | Element[] | null), options?: Omit<QueryOptions, 'root'>): PropertyDecorator {\n  return query(selector, {...options ?? {}, root: 'all'});\n}\n"],
+  "mappings": "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",
   "names": ["descriptor"]
 }

package/dist/cjs/decorators/resizeObserver.js

@@ -0,0 +1,104 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var resizeObserver_exports = {};
+__export(resizeObserver_exports, {
+  RESIZE_OBSERVER_METADATA_KEY: () => RESIZE_OBSERVER_METADATA_KEY,
+  getResizeObserverMetadata: () => getResizeObserverMetadata,
+  resizeObserver: () => resizeObserver,
+  resizeObserverAll: () => resizeObserverAll,
+  resizeObserverDelegate: () => resizeObserverDelegate,
+  resizeObserverDelegateAll: () => resizeObserverDelegateAll,
+  resizeObserverDelegateLight: () => resizeObserverDelegateLight,
+  resizeObserverDelegateShadow: () => resizeObserverDelegateShadow,
+  resizeObserverLight: () => resizeObserverLight,
+  resizeObserverShadow: () => resizeObserverShadow,
+  resizeObserverThis: () => resizeObserverThis
+});
+module.exports = __toCommonJS(resizeObserver_exports);
+var import_core = require("@dooboostore/core");
+const 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 = import_core.ReflectUtils.getMetadata(RESIZE_OBSERVER_METADATA_KEY, constructor);
+    if (!observers) {
+      observers = [];
+      import_core.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 import_core.ReflectUtils.getMetadata(RESIZE_OBSERVER_METADATA_KEY, constructor);
+}
+//# sourceMappingURL=resizeObserver.js.map

package/dist/cjs/decorators/resizeObserver.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/decorators/resizeObserver.ts"],
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { SpecialSelector, SwcQueryOptions, HelperHostSet } from '../types';\nimport { EventListenerSelector } from './addEventListener';\n\nexport interface ResizeObserverOptions extends SwcQueryOptions {\n  // \uAD00\uCC30 \uB300\uC0C1 \uC140\uB809\uD130. \uAE30\uBCF8\uAC12 $this (\uCEF4\uD3EC\uB10C\uD2B8 \uC790\uC2E0)\n  // delegate: true \uC778 \uACBD\uC6B0 \uB8E8\uD2B8\uC5D0\uC11C \uB9E4\uCE6D \uC694\uC18C\uB4E4\uC758 \uD06C\uAE30 \uBCC0\uD654\uB97C \uAC10\uC9C0 (\uB3D9\uC801 \uC694\uC18C \uD3EC\uD568)\n  delegate?: boolean;\n  // ResizeObserver box \uC635\uC158\n  box?: 'content-box' | 'border-box' | 'device-pixel-content-box';\n  filter?: (matchedEls: HTMLElement[], meta: { currentThis: any, helper: HelperHostSet }) => boolean;\n  // observer \uD574\uC81C(disconnected) \uC2DC \uD638\uCD9C\uB418\uB294 \uCF5C\uBC31. \uCCAB \uBC88\uC9F8 \uC778\uC790\uB294 observe\uB41C target element, \uB450 \uBC88\uC9F8\uB294 \uC0AC\uC6A9\uC790 \uC635\uC158 \uAC1D\uCCB4.\n  removeObserver?: (target: Element, optionValue: ResizeObserverOptions) => void;\n}\n\nexport interface ResizeObserverMetadata {\n  propertyKey: string | symbol;\n  selector: EventListenerSelector;\n  options: ResizeObserverOptions;\n}\n\nexport const RESIZE_OBSERVER_METADATA_KEY = Symbol.for('simple-web-component:resize-observer');\n\nexport function resizeObserver(target: SpecialSelector, options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserver(selector: EventListenerSelector, options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserver(options?: ResizeObserverOptions): MethodDecorator;\n/**\n * @resizeObserver decorator to observe element size changes.\n */\nexport function resizeObserver(selectorOrOptions?: EventListenerSelector | ResizeObserverOptions, maybeOptions?: ResizeObserverOptions): MethodDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n    let selector: EventListenerSelector = '$this';\n    let options: ResizeObserverOptions = {};\n\n    if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n      selector = selectorOrOptions;\n      options = maybeOptions ?? {};\n    } else {\n      selector = '$this';\n      options = selectorOrOptions ?? {};\n    }\n\n    const constructor = targetObj.constructor;\n\n    let observers = ReflectUtils.getMetadata<ResizeObserverMetadata[]>(RESIZE_OBSERVER_METADATA_KEY, constructor);\n    if (!observers) {\n      observers = [];\n      ReflectUtils.defineMetadata(RESIZE_OBSERVER_METADATA_KEY, observers, constructor);\n    }\n\n    observers.push({ propertyKey, selector, options });\n  };\n}\n\nexport function resizeObserverThis(options?: ResizeObserverOptions): MethodDecorator {\n  return resizeObserver('$this', options);\n}\n\n// \u2500\u2500\u2500 root\uBCC4 delegate \uD5EC\uD37C \u2500\u2500\u2500\n\nexport function resizeObserverDelegateLight(selector: EventListenerSelector, options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateLight(options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateLight(selectorOrOptions?: EventListenerSelector | Omit<ResizeObserverOptions, 'delegate'>, maybeOptions?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'light', delegate: true});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'light', delegate: true});\n}\n\nexport function resizeObserverDelegateShadow(selector: EventListenerSelector, options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateShadow(options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateShadow(selectorOrOptions?: EventListenerSelector | Omit<ResizeObserverOptions, 'delegate'>, maybeOptions?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'shadow', delegate: true});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'shadow', delegate: true});\n}\n\nexport function resizeObserverDelegateAll(selector: EventListenerSelector, options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateAll(options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegateAll(selectorOrOptions?: EventListenerSelector | Omit<ResizeObserverOptions, 'delegate'>, maybeOptions?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'all', delegate: true});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'all', delegate: true});\n}\n\nexport function resizeObserverDelegate(selector: EventListenerSelector, options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegate(options?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator;\nexport function resizeObserverDelegate(selectorOrOptions?: EventListenerSelector | Omit<ResizeObserverOptions, 'delegate'>, maybeOptions?: Omit<ResizeObserverOptions, 'delegate'>): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'auto', delegate: true});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'auto', delegate: true});\n}\n\n// \u2500\u2500\u2500 root\uBCC4 \uC77C\uBC18 \uD5EC\uD37C (delegate \uC5C6\uC774, \uC140\uB809\uD130 \uC0DD\uB7B5 \uC2DC $this) \u2500\u2500\u2500\n\nexport function resizeObserverLight(selector: EventListenerSelector, options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverLight(options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverLight(selectorOrOptions?: EventListenerSelector | ResizeObserverOptions, maybeOptions?: ResizeObserverOptions): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'light'});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'light'});\n}\n\nexport function resizeObserverShadow(selector: EventListenerSelector, options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverShadow(options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverShadow(selectorOrOptions?: EventListenerSelector | ResizeObserverOptions, maybeOptions?: ResizeObserverOptions): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'shadow'});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'shadow'});\n}\n\nexport function resizeObserverAll(selector: EventListenerSelector, options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverAll(options?: ResizeObserverOptions): MethodDecorator;\nexport function resizeObserverAll(selectorOrOptions?: EventListenerSelector | ResizeObserverOptions, maybeOptions?: ResizeObserverOptions): MethodDecorator {\n  if (typeof selectorOrOptions === 'string' || typeof selectorOrOptions === 'function') {\n    return resizeObserver(selectorOrOptions, {...maybeOptions ?? {}, root: 'all'});\n  }\n  return resizeObserver({...selectorOrOptions ?? {}, root: 'all'});\n}\n\nexport function getResizeObserverMetadata(target: any): ResizeObserverMetadata[] | undefined {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(RESIZE_OBSERVER_METADATA_KEY, constructor);\n}"],
+  "mappings": "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",
+  "names": []
+}

package/dist/cjs/examples/RxJSOperatorsExample.js

@@ -0,0 +1,285 @@
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var RxJSOperatorsExample_exports = {};
+__export(RxJSOperatorsExample_exports, {
+  AutoSaveEditor: () => AutoSaveEditor,
+  FormInput: () => FormInput,
+  InfiniteScroll: () => InfiniteScroll,
+  KeyboardHandler: () => KeyboardHandler,
+  LengthTracker: () => LengthTracker,
+  MouseTracker: () => MouseTracker,
+  ResponsiveLayout: () => ResponsiveLayout,
+  SearchComponent: () => SearchComponent
+});
+module.exports = __toCommonJS(RxJSOperatorsExample_exports);
+var import_decorators = require("../decorators");
+var __decorate = function(decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+var __metadata = function(k, v) {
+  if (typeof Reflect === "object" && typeof Reflect.metadata === "function") return Reflect.metadata(k, v);
+};
+var _a, _b, _c, _d, _e, _f, _g, _h;
+let SearchComponent = class SearchComponent2 extends HTMLElement {
+  constructor() {
+    super(...arguments);
+    this.results = [];
+  }
+  async onSearchInput(event) {
+    const input = event.target;
+    const query = input.value.trim();
+    if (query.length > 2) {
+      try {
+        const response = await fetch(`/api/search?q=${encodeURIComponent(query)}`);
+        this.results = await response.json();
+        this.renderResults();
+      } catch (error) {
+        console.error("Search failed:", error);
+      }
+    } else {
+      this.results = [];
+      this.renderResults();
+    }
+  }
+  renderResults() {
+    console.log("Rendering results:", this.results);
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$this", "input", { debounceTime: 1e3 }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_a = typeof Event !== "undefined" && Event) === "function" ? _a : Object]),
+  __metadata("design:returntype", Promise)
+], SearchComponent.prototype, "onSearchInput", null);
+SearchComponent = __decorate([
+  (0, import_decorators.elementDefine)("search-component")
+], SearchComponent);
+let ResponsiveLayout = class ResponsiveLayout2 extends HTMLElement {
+  onWindowResize(event) {
+    const width = window.innerWidth;
+    const height = window.innerHeight;
+    console.log(`Window resized to: ${width}x${height}`);
+    this.updateLayout(width, height);
+  }
+  updateLayout(width, height) {
+    if (width < 768) {
+      this.classList.add("mobile");
+      this.classList.remove("desktop");
+    } else {
+      this.classList.add("desktop");
+      this.classList.remove("mobile");
+    }
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$window", "resize", { throttleTime: 250 }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_b = typeof Event !== "undefined" && Event) === "function" ? _b : Object]),
+  __metadata("design:returntype", void 0)
+], ResponsiveLayout.prototype, "onWindowResize", null);
+ResponsiveLayout = __decorate([
+  (0, import_decorators.elementDefine)("responsive-layout")
+], ResponsiveLayout);
+let FormInput = class FormInput2 extends HTMLElement {
+  onFormInput(event) {
+    const input = event.target;
+    const fieldName = input.name;
+    const value = input.value;
+    console.log(`Validating ${fieldName}: ${value}`);
+    this.validateField(fieldName, value);
+  }
+  validateField(name, value) {
+    const isValid = value.length > 0;
+    console.log(`Field ${name} is ${isValid ? "valid" : "invalid"}`);
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$this", "input", {
+    debounceTime: 300,
+    distinctUntilChanged: true
+  }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_c = typeof Event !== "undefined" && Event) === "function" ? _c : Object]),
+  __metadata("design:returntype", void 0)
+], FormInput.prototype, "onFormInput", null);
+FormInput = __decorate([
+  (0, import_decorators.elementDefine)("form-input")
+], FormInput);
+let InfiniteScroll = class InfiniteScroll2 extends HTMLElement {
+  constructor() {
+    super(...arguments);
+    this.isLoading = false;
+  }
+  onScroll(event) {
+    if (this.isLoading)
+      return;
+    if (this.isNearBottom()) {
+      console.log("Near bottom, loading more content...");
+      this.loadMoreContent();
+    }
+  }
+  isNearBottom() {
+    const scrollTop = window.scrollY;
+    const windowHeight = window.innerHeight;
+    const documentHeight = document.documentElement.scrollHeight;
+    return scrollTop + windowHeight >= documentHeight - 500;
+  }
+  async loadMoreContent() {
+    this.isLoading = true;
+    try {
+      await new Promise((resolve) => setTimeout(resolve, 1e3));
+      console.log("Content loaded");
+    } finally {
+      this.isLoading = false;
+    }
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$window", "scroll", { throttleTime: 100 }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_d = typeof Event !== "undefined" && Event) === "function" ? _d : Object]),
+  __metadata("design:returntype", void 0)
+], InfiniteScroll.prototype, "onScroll", null);
+InfiniteScroll = __decorate([
+  (0, import_decorators.elementDefine)("infinite-scroll")
+], InfiniteScroll);
+let LengthTracker = class LengthTracker2 extends HTMLElement {
+  onInputChange(event) {
+    const input = event.target;
+    const length = input.value.length;
+    console.log(`Input length changed to: ${length}`);
+    this.updateLengthDisplay(length);
+  }
+  updateLengthDisplay(length) {
+    const display = this.querySelector(".length-display");
+    if (display) {
+      display.textContent = `${length} characters`;
+    }
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$this", "input", {
+    distinctUntilChanged: (prev, curr) => {
+      return prev?.length === curr?.length;
+    }
+  }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_e = typeof Event !== "undefined" && Event) === "function" ? _e : Object]),
+  __metadata("design:returntype", void 0)
+], LengthTracker.prototype, "onInputChange", null);
+LengthTracker = __decorate([
+  (0, import_decorators.elementDefine)("length-tracker")
+], LengthTracker);
+let AutoSaveEditor = class AutoSaveEditor2 extends HTMLElement {
+  constructor() {
+    super(...arguments);
+    this.lastSavedContent = "";
+  }
+  async onContentChange(event) {
+    const textarea = event.target;
+    const content = textarea.value;
+    if (content !== this.lastSavedContent) {
+      console.log("Auto-saving content...");
+      await this.saveContent(content);
+      this.lastSavedContent = content;
+    }
+  }
+  async saveContent(content) {
+    try {
+      const response = await fetch("/api/save", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({ content })
+      });
+      if (response.ok) {
+        console.log("Content saved successfully");
+        this.showSaveIndicator();
+      }
+    } catch (error) {
+      console.error("Save failed:", error);
+    }
+  }
+  showSaveIndicator() {
+    const indicator = this.querySelector(".save-indicator");
+    if (indicator) {
+      indicator.classList.add("show");
+      setTimeout(() => indicator.classList.remove("show"), 2e3);
+    }
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$this", "input", {
+    debounceTime: 2e3,
+    distinctUntilChanged: (prev, curr) => {
+      return prev === curr;
+    }
+  }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_f = typeof Event !== "undefined" && Event) === "function" ? _f : Object]),
+  __metadata("design:returntype", Promise)
+], AutoSaveEditor.prototype, "onContentChange", null);
+AutoSaveEditor = __decorate([
+  (0, import_decorators.elementDefine)("auto-save-editor")
+], AutoSaveEditor);
+let KeyboardHandler = class KeyboardHandler2 extends HTMLElement {
+  onSaveShortcut(event) {
+    event.preventDefault();
+    console.log("Save shortcut triggered");
+    this.handleSave();
+  }
+  handleSave() {
+    console.log("Saving...");
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$document", "keydown", {
+    throttleTime: 500,
+    filter: (event) => {
+      return (event.ctrlKey || event.metaKey) && event.key === "s";
+    }
+  }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_g = typeof KeyboardEvent !== "undefined" && KeyboardEvent) === "function" ? _g : Object]),
+  __metadata("design:returntype", void 0)
+], KeyboardHandler.prototype, "onSaveShortcut", null);
+KeyboardHandler = __decorate([
+  (0, import_decorators.elementDefine)("keyboard-handler")
+], KeyboardHandler);
+let MouseTracker = class MouseTracker2 extends HTMLElement {
+  onMouseMove(event) {
+    const x = event.clientX;
+    const y = event.clientY;
+    this.updateCursorPosition(x, y);
+  }
+  updateCursorPosition(x, y) {
+    console.log(`Cursor at: ${x}, ${y}`);
+  }
+};
+__decorate([
+  (0, import_decorators.addEventListener)("$document", "mousemove", { throttleTime: 100 }),
+  __metadata("design:type", Function),
+  __metadata("design:paramtypes", [typeof (_h = typeof MouseEvent !== "undefined" && MouseEvent) === "function" ? _h : Object]),
+  __metadata("design:returntype", void 0)
+], MouseTracker.prototype, "onMouseMove", null);
+MouseTracker = __decorate([
+  (0, import_decorators.elementDefine)("mouse-tracker")
+], MouseTracker);
+//# sourceMappingURL=RxJSOperatorsExample.js.map

package/dist/cjs/examples/RxJSOperatorsExample.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/examples/RxJSOperatorsExample.ts"],
+  "sourcesContent": ["/**\n * Example: Using RxJS-like Operators with @addEventListener\n * \n * This example demonstrates how to use debounceTime, throttleTime, and distinctUntilChanged\n * operators with the @addEventListener decorator.\n */\n\nimport { elementDefine, addEventListener } from '../decorators';\n\n/**\n * Example 1: Search Component with Debounce\n * \n * Waits 1 second after user stops typing before performing search.\n * Prevents excessive API calls during typing.\n */\n@elementDefine('search-component')\nexport class SearchComponent extends HTMLElement {\n  private results: any[] = [];\n\n  @addEventListener('$this', 'input', { debounceTime: 1000 })\n  async onSearchInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    const query = input.value.trim();\n\n    if (query.length > 2) {\n      try {\n        // Simulate API call\n        const response = await fetch(`/api/search?q=${encodeURIComponent(query)}`);\n        this.results = await response.json();\n        this.renderResults();\n      } catch (error) {\n        console.error('Search failed:', error);\n      }\n    } else {\n      this.results = [];\n      this.renderResults();\n    }\n  }\n\n  private renderResults() {\n    // Render search results\n    console.log('Rendering results:', this.results);\n  }\n}\n\n/**\n * Example 2: Window Resize Handler with Throttle\n * \n * Recalculates layout at most 4 times per second (every 250ms).\n * Prevents performance issues from excessive resize calculations.\n */\n@elementDefine('responsive-layout')\nexport class ResponsiveLayout extends HTMLElement {\n  @addEventListener('$window', 'resize', { throttleTime: 250 })\n  onWindowResize(event: Event) {\n    const width = window.innerWidth;\n    const height = window.innerHeight;\n\n    console.log(`Window resized to: ${width}x${height}`);\n    this.updateLayout(width, height);\n  }\n\n  private updateLayout(width: number, height: number) {\n    // Update layout based on new dimensions\n    if (width < 768) {\n      this.classList.add('mobile');\n      this.classList.remove('desktop');\n    } else {\n      this.classList.add('desktop');\n      this.classList.remove('mobile');\n    }\n  }\n}\n\n/**\n * Example 3: Form Input with Debounce + Distinct\n * \n * Validates field only when:\n * 1. User stops typing (debounce 300ms)\n * 2. AND the value actually changed (distinct)\n */\n@elementDefine('form-input')\nexport class FormInput extends HTMLElement {\n  @addEventListener('$this', 'input', {\n    debounceTime: 300,\n    distinctUntilChanged: true\n  })\n  onFormInput(event: Event) {\n    const input = event.target as HTMLInputElement;\n    const fieldName = input.name;\n    const value = input.value;\n\n    console.log(`Validating ${fieldName}: ${value}`);\n    this.validateField(fieldName, value);\n  }\n\n  private validateField(name: string, value: string) {\n    // Perform validation\n    const isValid = value.length > 0;\n    console.log(`Field ${name} is ${isValid ? 'valid' : 'invalid'}`);\n  }\n}\n\n/**\n * Example 4: Scroll Event with Throttle\n * \n * Checks if user scrolled to bottom at most 10 times per second.\n * Prevents excessive \"load more\" API calls.\n */\n@elementDefine('infinite-scroll')\nexport class InfiniteScroll extends HTMLElement {\n  private isLoading = false;\n\n  @addEventListener('$window', 'scroll', { throttleTime: 100 })\n  onScroll(event: Event) {\n    if (this.isLoading) return;\n\n    if (this.isNearBottom()) {\n      console.log('Near bottom, loading more content...');\n      this.loadMoreContent();\n    }\n  }\n\n  private isNearBottom(): boolean {\n    const scrollTop = window.scrollY;\n    const windowHeight = window.innerHeight;\n    const documentHeight = document.documentElement.scrollHeight;\n\n    return scrollTop + windowHeight >= documentHeight - 500;\n  }\n\n  private async loadMoreContent() {\n    this.isLoading = true;\n    try {\n      // Simulate API call\n      await new Promise(resolve => setTimeout(resolve, 1000));\n      console.log('Content loaded');\n    } finally {\n      this.isLoading = false;\n    }\n  }\n}\n\n/**\n * Example 5: Custom Comparison with Distinct\n * \n * Only fires when the input value length changes.\n * Ignores changes that don't affect the length.\n */\n@elementDefine('length-tracker')\nexport class LengthTracker extends HTMLElement {\n  @addEventListener('$this', 'input', {\n    distinctUntilChanged: (prev: any, curr: any) => {\n      // Only consider it changed if the length differs\n      return prev?.length === curr?.length;\n    }\n  })\n  onInputChange(event: Event) {\n    const input = event.target as HTMLInputElement;\n    const length = input.value.length;\n\n    console.log(`Input length changed to: ${length}`);\n    this.updateLengthDisplay(length);\n  }\n\n  private updateLengthDisplay(length: number) {\n    // Update UI with new length\n    const display = this.querySelector('.length-display');\n    if (display) {\n      display.textContent = `${length} characters`;\n    }\n  }\n}\n\n/**\n * Example 6: Complex Scenario - Auto-save with Multiple Operators\n * \n * Combines debounce and distinct for intelligent auto-save:\n * - Waits 2 seconds after user stops typing\n * - Only saves if content actually changed\n * - Prevents unnecessary save operations\n */\n@elementDefine('auto-save-editor')\nexport class AutoSaveEditor extends HTMLElement {\n  private lastSavedContent = '';\n\n  @addEventListener('$this', 'input', {\n    debounceTime: 2000,\n    distinctUntilChanged: (prev: any, curr: any) => {\n      // Consider changed if the content is different\n      return prev === curr;\n    }\n  })\n  async onContentChange(event: Event) {\n    const textarea = event.target as HTMLTextAreaElement;\n    const content = textarea.value;\n\n    if (content !== this.lastSavedContent) {\n      console.log('Auto-saving content...');\n      await this.saveContent(content);\n      this.lastSavedContent = content;\n    }\n  }\n\n  private async saveContent(content: string) {\n    try {\n      // Simulate API call\n      const response = await fetch('/api/save', {\n        method: 'POST',\n        headers: { 'Content-Type': 'application/json' },\n        body: JSON.stringify({ content })\n      });\n\n      if (response.ok) {\n        console.log('Content saved successfully');\n        this.showSaveIndicator();\n      }\n    } catch (error) {\n      console.error('Save failed:', error);\n    }\n  }\n\n  private showSaveIndicator() {\n    const indicator = this.querySelector('.save-indicator');\n    if (indicator) {\n      indicator.classList.add('show');\n      setTimeout(() => indicator.classList.remove('show'), 2000);\n    }\n  }\n}\n\n/**\n * Example 7: Keyboard Shortcut Handler with Throttle\n * \n * Prevents rapid repeated execution of keyboard shortcuts.\n */\n@elementDefine('keyboard-handler')\nexport class KeyboardHandler extends HTMLElement {\n  @addEventListener('$document', 'keydown', {\n    throttleTime: 500,\n    filter: (event: KeyboardEvent) => {\n      // Only handle Ctrl+S or Cmd+S\n      return (event.ctrlKey || event.metaKey) && event.key === 's';\n    }\n  })\n  onSaveShortcut(event: KeyboardEvent) {\n    event.preventDefault();\n    console.log('Save shortcut triggered');\n    this.handleSave();\n  }\n\n  private handleSave() {\n    // Handle save operation\n    console.log('Saving...');\n  }\n}\n\n/**\n * Example 8: Mouse Move Tracking with Throttle\n * \n * Tracks mouse position at most 10 times per second.\n * Useful for analytics or interactive features.\n */\n@elementDefine('mouse-tracker')\nexport class MouseTracker extends HTMLElement {\n  @addEventListener('$document', 'mousemove', { throttleTime: 100 })\n  onMouseMove(event: MouseEvent) {\n    const x = event.clientX;\n    const y = event.clientY;\n\n    // Update cursor position indicator\n    this.updateCursorPosition(x, y);\n  }\n\n  private updateCursorPosition(x: number, y: number) {\n    // Update UI with cursor position\n    console.log(`Cursor at: ${x}, ${y}`);\n  }\n}\n"],
+  "mappings": "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",
+  "names": ["SearchComponent", "ResponsiveLayout", "FormInput", "InfiniteScroll", "LengthTracker", "AutoSaveEditor", "KeyboardHandler", "MouseTracker"]
+}

package/dist/esm/bundle-entry.js

@@ -1,3 +1,11 @@
 import "reflect-metadata";
 export * from "./index.js";
+import * as Core from "@dooboostore/core";
+import * as CoreWeb from "@dooboostore/core-web";
+import * as SimpleBoot from "@dooboostore/simple-boot";
+export {
+  Core,
+  CoreWeb,
+  SimpleBoot
+};
 //# sourceMappingURL=bundle-entry.js.map

package/dist/esm/bundle-entry.js.map

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../src/bundle-entry.ts"],
-  "sourcesContent": ["import 'reflect-metadata';\nexport * from './index';\n"],
-  "mappings": "AAAA,OAAO;AACP,cAAc;",
+  "sourcesContent": ["import 'reflect-metadata';\n\n// simple-web-component itself\nexport * from './index';\n\n// Re-export peer dependencies so bundle consumers can access them\n// without separately importing each package\nexport * as Core from '@dooboostore/core';\nexport * as CoreWeb from '@dooboostore/core-web';\nexport * as SimpleBoot from '@dooboostore/simple-boot';\n"],
+  "mappings": "AAAA,OAAO;AAGP,cAAc;AAId,YAAY,UAAU;AACtB,YAAY,aAAa;AACzB,YAAY,gBAAgB;",
   "names": []
 }

package/dist/esm/decorators/addEventListener.js

@@ -1,14 +1,26 @@
 import { ReflectUtils } from "@dooboostore/core";
 const ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:add-event-listener");
-function addEventListener(selectorOrTarget, type, options = {}) {
+function addEventListener(selectorOrType, typeOrOptions, maybeOptions) {
   return (targetObj, propertyKey, descriptor) => {
+    let selector;
+    let type;
+    let opts = {};
+    if (typeof typeOrOptions === "string") {
+      selector = selectorOrType;
+      type = typeOrOptions;
+      opts = maybeOptions ?? {};
+    } else {
+      selector = "$this";
+      type = 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);
     }
-    listeners.push({ propertyKey, selector: selectorOrTarget, type, options });
+    listeners.push({ propertyKey, selector, type, options: opts });
   };
 }
 function addEventListenerDelegateLightDom(selector, type, options) {
@@ -23,11 +35,15 @@ function addEventListenerDelegateAllDom(selector, type, options) {
 function addEventListenerDelegate(selector, type, options) {
   return addEventListener(selector, type, { ...options ?? {}, root: "auto", delegate: true });
 }
-const event = addEventListener;
-const eventDelegateLightDom = addEventListenerDelegateLightDom;
-const eventDelegateShadowDom = addEventListenerDelegateShadowDom;
-const eventDelegateAllDom = addEventListenerDelegateAllDom;
-const eventDelegate = addEventListenerDelegate;
+function addEventListenerLightDom(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "light" });
+}
+function addEventListenerShadowDom(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "shadow" });
+}
+function addEventListenerAllDom(selector, type, options) {
+  return addEventListener(selector, type, { ...options ?? {}, root: "all" });
+}
 function addEventListenerThis(type, options) {
   return addEventListener("$this", type, options);
 }
@@ -40,6 +56,18 @@ function addEventListenerWindow(type, options) {
 function addEventListenerDocument(type, options) {
   return addEventListener("$document", type, options);
 }
+const event = addEventListener;
+const eventDelegateLightDom = addEventListenerDelegateLightDom;
+const eventDelegateShadowDom = addEventListenerDelegateShadowDom;
+const eventDelegateAllDom = addEventListenerDelegateAllDom;
+const eventDelegate = addEventListenerDelegate;
+const eventLightDom = addEventListenerLightDom;
+const eventShadowDom = addEventListenerShadowDom;
+const eventAllDom = addEventListenerAllDom;
+const eventAppHost = addEventListenerAppHost;
+const eventWindow = addEventListenerWindow;
+const eventDocument = addEventListenerDocument;
+const eventThis = addEventListenerThis;
 const getAddEventListenerMetadata = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
   return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
@@ -47,19 +75,29 @@ const getAddEventListenerMetadata = (target) => {
 export {
   ADD_EVENT_LISTENER_METADATA_KEY,
   addEventListener,
+  addEventListenerAllDom,
   addEventListenerAppHost,
   addEventListenerDelegate,
   addEventListenerDelegateAllDom,
   addEventListenerDelegateLightDom,
   addEventListenerDelegateShadowDom,
   addEventListenerDocument,
+  addEventListenerLightDom,
+  addEventListenerShadowDom,
   addEventListenerThis,
   addEventListenerWindow,
   event,
+  eventAllDom,
+  eventAppHost,
   eventDelegate,
   eventDelegateAllDom,
   eventDelegateLightDom,
   eventDelegateShadowDom,
+  eventDocument,
+  eventLightDom,
+  eventShadowDom,
+  eventThis,
+  eventWindow,
   getAddEventListenerMetadata
 };
 //# sourceMappingURL=addEventListener.js.map