@dooboostore/simple-web-component 1.0.43 → 1.0.44

package/src/decorators/query.ts

@@ -11,173 +11,104 @@ export interface QueryMetadata {
 
 export const QUERY_METADATA_KEY = Symbol.for('simple-web-component:query');
 
-export function query(target: SpecialSelector): PropertyDecorator;
+export function query(target: Object, propertyKey: string | symbol, descriptor?: PropertyDescriptor): PropertyDescriptor | void;
 export function query(selector: string, options?: SwcQueryOptions): PropertyDecorator;
+export function query(options?: SwcQueryOptions): PropertyDecorator;
 /**
  * @query decorator to inject a single element into a class property.
  */
-export function query(selectorOrTarget: string, options: any = {}): PropertyDecorator {
-  return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {
-    if (descriptor !== undefined) {
-      throw new Error(`@query decorator cannot be used on methods. (Method: ${String(propertyKey)})`);
-    }
-
-    const constructor = targetObj.constructor;
-    let queries = ReflectUtils.getMetadata<QueryMetadata[]>(QUERY_METADATA_KEY, constructor);
-    if (!queries) {
-      queries = [];
-      ReflectUtils.defineMetadata(QUERY_METADATA_KEY, queries, constructor);
-    }
-    queries.push({ propertyKey, selector: selectorOrTarget, options });
-
-    Object.defineProperty(targetObj, propertyKey, {
-      get(this: HTMLElement) {
-        ensureInit(this);
-        const selector = selectorOrTarget;
-
-        const r = options.root || 'auto';
-        const applyRoot = (t: any) => {
-          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;
-        };
-
-        // --- Special Selectors: HostSet ---
-        const hostSet = SwcUtils.getHostSet(this);
-        if (selector === '$this') return applyRoot(this);
-        if (selector === '$host') return applyRoot(hostSet.$host);
-        if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);
-        if (selector === '$appHost') return applyRoot(hostSet.$appHost);
-        if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);
-        if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);
-        if (selector === '$firstAppHost') return applyRoot(hostSet.$firstAppHost);
-        if (selector === '$lastAppHost') return applyRoot(hostSet.$lastAppHost);
-
-        // --- Special Selectors: Env ---
-        const config = getElementConfig(this);
-        const win = config?.window || window;
-        if (selector === '$window') return win;
-        if (selector === '$document') return win.document;
-
-        // --- Standard Selectors ---
-        if (r === 'shadow') return this.shadowRoot ? this.shadowRoot.querySelector(selector) : null;
-        if (r === 'light') return this.querySelector(selector);
-        if (r === 'all') {
-          const shadowMatch = this.shadowRoot ? this.shadowRoot.querySelector(selector) : null;
-          return shadowMatch || this.querySelector(selector);
-        }
-        return (this.shadowRoot || this).querySelector(selector);
-      },
-      set(this: HTMLElement, nv: any) {
-        ensureInit(this);
-        if (nv === null || nv === undefined) {
+export function query(selectorOrTarget?: string | Object, optionsOrPropertyKey?: SwcQueryOptions | string | symbol, descriptor?: PropertyDescriptor): any {
+  // Bare decorator: @query
+  if (descriptor !== undefined && (typeof optionsOrPropertyKey === 'string' || typeof optionsOrPropertyKey === 'symbol')) {
+    throw new Error(`@query decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);
+  }
+  // With selector
+  if (typeof selectorOrTarget === 'string') {
+    return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {
+      if (descriptor !== undefined) {
+        throw new Error(`@query decorator cannot be used on methods. (Method: ${String(propertyKey)})`);
+      }
+
+      const constructor = targetObj.constructor;
+      let queries = ReflectUtils.getMetadata<QueryMetadata[]>(QUERY_METADATA_KEY, constructor);
+      if (!queries) {
+        queries = [];
+        ReflectUtils.defineMetadata(QUERY_METADATA_KEY, queries, constructor);
+      }
+      queries.push({ propertyKey, selector: selectorOrTarget, options: optionsOrPropertyKey as SwcQueryOptions || {} });
+
+      Object.defineProperty(targetObj, propertyKey, {
+        get(this: HTMLElement) {
+          ensureInit(this);
           const selector = selectorOrTarget;
-          if (selector.startsWith('$') && selector !== '$this') return;
 
-          const r = options.root || 'auto';
-          const targets: Element[] = [];
-
-          if (r === 'shadow') {
-            if (this.shadowRoot?.querySelector(selector)) targets.push(this.shadowRoot.querySelector(selector)!);
-          } else if (r === 'light') {
-            if (this.querySelector(selector)) targets.push(this.querySelector(selector)!);
-          } else if (r === 'all') {
-            if (this.shadowRoot?.querySelector(selector)) targets.push(this.shadowRoot.querySelector(selector)!);
-            if (this.querySelector(selector)) targets.push(this.querySelector(selector)!);
-          } else {
-            const el = (this.shadowRoot || this).querySelector(selector);
-            if (el) targets.push(el);
+          const r = (optionsOrPropertyKey as SwcQueryOptions)?.root || 'auto';
+          const applyRoot = (t: any) => {
+            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;
+          };
+
+          // --- Special Selectors: HostSet ---
+          const hostSet = SwcUtils.getHostSet(this);
+          if (selector === '$this') return applyRoot(this);
+          if (selector === '$host') return applyRoot(hostSet.$host);
+          if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);
+          if (selector === '$appHost') return applyRoot(hostSet.$appHost);
+          if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);
+          if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);
+          if (selector === '$firstAppHost') return applyRoot(hostSet.$firstAppHost);
+          if (selector === '$lastAppHost') return applyRoot(hostSet.$lastAppHost);
+
+          // --- Special Selectors: Env ---
+          const config = getElementConfig(this);
+          const win = config?.window || window;
+          if (selector === '$window') return win;
+          if (selector === '$document') return win.document;
+
+          // --- Standard Selectors ---
+          if (r === 'shadow') return this.shadowRoot ? this.shadowRoot.querySelector(selector) : null;
+          if (r === 'light') return this.querySelector(selector);
+          if (r === 'all') {
+            const shadowMatch = this.shadowRoot ? this.shadowRoot.querySelector(selector) : null;
+            return shadowMatch || this.querySelector(selector);
           }
-
-          targets.forEach(t => t.remove());
-        }
-      },
-      enumerable: true,
-      configurable: true
-    });
-  };
-}
-
-/**
- * @queryThis decorator - simplified version of @query for $this selector
- */
-export function queryThis(target: Object, propertyKey: string | symbol): void;
-export function queryThis(): PropertyDecorator;
-export function queryThis(options: SwcQueryOptions): PropertyDecorator;
-export function queryThis(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return query('$this', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return query('$this', targetOrOptions as SwcQueryOptions);
-  } else {
-    return query('$this', {});
-  }
-}
-
-
-export function queryWindow(target: Object, propertyKey: string | symbol): void;
-export function queryWindow(): PropertyDecorator;
-export function queryWindow(options: SwcQueryOptions): PropertyDecorator;
-export function queryWindow(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return query('$window', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return query('$window', targetOrOptions as SwcQueryOptions);
-  } else {
-    return query('$window', {});
-  }
-}
-
-export function queryDocument(target: Object, propertyKey: string | symbol): void;
-export function queryDocument(): PropertyDecorator;
-export function queryDocument(options: SwcQueryOptions): PropertyDecorator;
-export function queryDocument(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return query('$document', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return query('$document', targetOrOptions as SwcQueryOptions);
-  } else {
-    return query('$document', {});
-  }
-}
-/**
- * @host - Query $host (Direct parent SWC component)
- */
-export function queryHost(target: Object, propertyKey: string | symbol): void;
-export function queryHost(): PropertyDecorator;
-export function queryHost(options: SwcQueryOptions): PropertyDecorator;
-export function queryHost(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return query('$host', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return query('$host', targetOrOptions as SwcQueryOptions);
-  } else {
-    return query('$host', {});
-  }
-}
-
-/**
- * @appHost - Query $appHost (Nearest <swc-app>)
- */
-export function queryAppHost(target: Object, propertyKey: string | symbol): void;
-export function queryAppHost(): PropertyDecorator;
-export function queryAppHost(options: SwcQueryOptions): PropertyDecorator;
-export function queryAppHost(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return query('$appHost', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return query('$appHost', targetOrOptions as SwcQueryOptions);
-  } else {
-    return query('$appHost', {});
+          return (this.shadowRoot || this).querySelector(selector);
+        },
+        set(this: HTMLElement, nv: any) {
+          ensureInit(this);
+          if (nv === null || nv === undefined) {
+            const selector = selectorOrTarget;
+            if (selector.startsWith('$') && selector !== '$this') return;
+
+            const r = (optionsOrPropertyKey as SwcQueryOptions)?.root || 'auto';
+            const targets: Element[] = [];
+
+            if (r === 'shadow') {
+              if (this.shadowRoot?.querySelector(selector)) targets.push(this.shadowRoot.querySelector(selector)!);
+            } else if (r === 'light') {
+              if (this.querySelector(selector)) targets.push(this.querySelector(selector)!);
+            } else if (r === 'all') {
+              if (this.shadowRoot?.querySelector(selector)) targets.push(this.shadowRoot.querySelector(selector)!);
+              if (this.querySelector(selector)) targets.push(this.querySelector(selector)!);
+            } else {
+              const el = (this.shadowRoot || this).querySelector(selector);
+              if (el) targets.push(el);
+            }
+
+            targets.forEach(t => t.remove());
+          }
+        },
+        enumerable: true,
+        configurable: true
+      });
+    };
   }
+  // Without selector (defaults to $this)
+  return query('$this', selectorOrTarget as SwcQueryOptions);
 }
 
 export const getQueryMetadata = (target: any): QueryMetadata[]  => {

package/src/decorators/queryAll.ts

@@ -11,155 +11,113 @@ export interface QueryAllMetadata {
 
 export const QUERY_ALL_METADATA_KEY = Symbol.for('simple-web-component:query-all');
 
-export function queryAll(target: SpecialSelector): PropertyDecorator;
+export function queryAll(target: Object, propertyKey: string | symbol, descriptor?: PropertyDescriptor): PropertyDescriptor | void;
 export function queryAll(selector: string, options?: SwcQueryOptions): PropertyDecorator;
+export function queryAll(options?: SwcQueryOptions): PropertyDecorator;
 /**
  * @queryAll decorator to inject a list of elements into a class property.
  */
-export function queryAll(selectorOrTarget: string, options: any = {}): PropertyDecorator {
-  return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {
-    if (descriptor !== undefined) {
-      throw new Error(`@queryAll decorator cannot be used on methods. (Method: ${String(propertyKey)})`);
-    }
-
-    const constructor = targetObj.constructor;
-    let queries = ReflectUtils.getMetadata<QueryAllMetadata[]>(QUERY_ALL_METADATA_KEY, constructor);
-    if (!queries) {
-      queries = [];
-      ReflectUtils.defineMetadata(QUERY_ALL_METADATA_KEY, queries, constructor);
-    }
-    queries.push({ propertyKey, selector: selectorOrTarget, options });
+export function queryAll(selectorOrTarget?: string | Object, optionsOrPropertyKey?: SwcQueryOptions | string | symbol, descriptor?: PropertyDescriptor): any {
+  // Bare decorator: @queryAll
+  if (descriptor !== undefined && (typeof optionsOrPropertyKey === 'string' || typeof optionsOrPropertyKey === 'symbol')) {
+    throw new Error(`@queryAll decorator cannot be used on methods. (Method: ${String(optionsOrPropertyKey)})`);
+  }
+  // With selector
+  if (typeof selectorOrTarget === 'string') {
+    return (targetObj: Object, propertyKey: string | symbol, descriptor?: never): void => {
+      if (descriptor !== undefined) {
+        throw new Error(`@queryAll decorator cannot be used on methods. (Method: ${String(propertyKey)})`);
+      }
 
-    Object.defineProperty(targetObj, propertyKey, {
-      get(this: HTMLElement) {
-        ensureInit(this);
-        const selector = selectorOrTarget;
+      const constructor = targetObj.constructor;
+      let queries = ReflectUtils.getMetadata<QueryAllMetadata[]>(QUERY_ALL_METADATA_KEY, constructor);
+      if (!queries) {
+        queries = [];
+        ReflectUtils.defineMetadata(QUERY_ALL_METADATA_KEY, queries, constructor);
+      }
+      queries.push({ propertyKey, selector: selectorOrTarget, options: optionsOrPropertyKey as SwcQueryOptions || {} });
 
-        const r = options.root || 'auto';
-        const applyRoot = (t: any): any[] => {
-          if (!t) return [];
-          const items = Array.isArray(t) ? t : [t];
-          const results: any[] = [];
-          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;
-        };
+      Object.defineProperty(targetObj, propertyKey, {
+        get(this: HTMLElement) {
+          ensureInit(this);
+          const selector = selectorOrTarget;
 
-        // --- Special Selectors: HostSet ---
-        const hostSet = SwcUtils.getHostSet(this);
-        if (selector === '$hosts') return applyRoot(hostSet.$hosts);
-        if (selector === '$appHosts') return applyRoot(hostSet.$appHosts);
-        if (selector === '$host') return applyRoot(hostSet.$host);
-        if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);
-        if (selector === '$appHost') return applyRoot(hostSet.$appHost);
-        if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);
-        if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);
-        if (selector === '$firstAppHost') return applyRoot(hostSet.$firstAppHost);
-        if (selector === '$lastAppHost') return applyRoot(hostSet.$lastAppHost);
+          const r = (optionsOrPropertyKey as SwcQueryOptions)?.root || 'auto';
+          const applyRoot = (t: any): any[] => {
+            if (!t) return [];
+            const items = Array.isArray(t) ? t : [t];
+            const results: any[] = [];
+            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;
+          };
 
-        // --- Special Selectors: Env ---
-        const config = getElementConfig(this);
-        const win = config?.window || window;
-        if (selector === '$window') return [win];
-        if (selector === '$document') return [win.document];
-        if (selector === '$this') return applyRoot(this);
+          // --- Special Selectors: HostSet ---
+          const hostSet = SwcUtils.getHostSet(this);
+          if (selector === '$hosts') return applyRoot(hostSet.$hosts);
+          if (selector === '$appHosts') return applyRoot(hostSet.$appHosts);
+          if (selector === '$host') return applyRoot(hostSet.$host);
+          if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);
+          if (selector === '$appHost') return applyRoot(hostSet.$appHost);
+          if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);
+          if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);
+          if (selector === '$firstAppHost') return applyRoot(hostSet.$firstAppHost);
+          if (selector === '$lastAppHost') return applyRoot(hostSet.$lastAppHost);
 
-        // --- Standard Selectors ---
-        if (r === 'shadow') return this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
-        if (r === 'light') return Array.from(this.querySelectorAll(selector));
-        if (r === 'all') {
-          const sNodes = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
-          const lNodes = Array.from(this.querySelectorAll(selector));
-          return [...sNodes, ...lNodes];
-        }
-        const root = this.shadowRoot || this;
-        return Array.from(root.querySelectorAll(selector));
-      },
-      set(this: HTMLElement, nv: any) {
-        ensureInit(this);
-        if (nv === null || nv === undefined || (Array.isArray(nv) && nv.length === 0)) {
-          const selector = selectorOrTarget;
-          if (selector.startsWith('$') && selector !== '$this') return;
+          // --- Special Selectors: Env ---
+          const config = getElementConfig(this);
+          const win = config?.window || window;
+          if (selector === '$window') return [win];
+          if (selector === '$document') return [win.document];
+          if (selector === '$this') return applyRoot(this);
 
-          const r = options.root || 'auto';
-          let targets: (Element | Node)[] = [];
-          if (r === 'shadow') targets = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
-          else if (r === 'light') targets = Array.from(this.querySelectorAll(selector));
-          else if (r === 'all') {
+          // --- Standard Selectors ---
+          if (r === 'shadow') return this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
+          if (r === 'light') return Array.from(this.querySelectorAll(selector));
+          if (r === 'all') {
             const sNodes = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
             const lNodes = Array.from(this.querySelectorAll(selector));
-            targets = [...sNodes, ...lNodes];
-          } else {
-            targets = Array.from((this.shadowRoot || this).querySelectorAll(selector));
+            return [...sNodes, ...lNodes];
           }
-          targets.forEach(t => (t as Element).remove());
-        }
-      },
-      enumerable: true,
-      configurable: true
-    });
-  };
-}
+          const root = this.shadowRoot || this;
+          return Array.from(root.querySelectorAll(selector));
+        },
+        set(this: HTMLElement, nv: any) {
+          ensureInit(this);
+          if (nv === null || nv === undefined || (Array.isArray(nv) && nv.length === 0)) {
+            const selector = selectorOrTarget;
+            if (selector.startsWith('$') && selector !== '$this') return;
 
-/**
- * @queryAllThis decorator - simplified version of @queryAll for $this selector
- */
-export function queryAllThis(target: Object, propertyKey: string | symbol): void;
-export function queryAllThis(): PropertyDecorator;
-export function queryAllThis(options: SwcQueryOptions): PropertyDecorator;
-export function queryAllThis(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return queryAll('$this', {})(targetOrOptions, propertyKey);
-  }
-
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return queryAll('$this', targetOrOptions as SwcQueryOptions);
-  } else {
-    return queryAll('$this', {});
-  }
-}
-
-/**
- * @allParentHost - Query all parent SWC components
- */
-export function allParentHost(target: Object, propertyKey: string | symbol): void;
-export function allParentHost(): PropertyDecorator;
-export function allParentHost(options: SwcQueryOptions): PropertyDecorator;
-export function allParentHost(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return queryAll('$host', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return queryAll('$host', targetOrOptions as SwcQueryOptions);
-  } else {
-    return queryAll('$host', {});
-  }
-}
-
-/**
- * @allAppHost - Query all $appHost (All <swc-app> instances)
- */
-export function allAppHost(target: Object, propertyKey: string | symbol): void;
-export function allAppHost(): PropertyDecorator;
-export function allAppHost(options: SwcQueryOptions): PropertyDecorator;
-export function allAppHost(targetOrOptions?: any, propertyKey?: string | symbol): any {
-  if (propertyKey !== undefined && (typeof propertyKey === 'string' || typeof propertyKey === 'symbol')) {
-    return queryAll('$appHost', {})(targetOrOptions, propertyKey);
-  }
-  if (typeof targetOrOptions === 'object' && targetOrOptions !== null) {
-    return queryAll('$appHost', targetOrOptions as SwcQueryOptions);
-  } else {
-    return queryAll('$appHost', {});
+            const r = (optionsOrPropertyKey as SwcQueryOptions)?.root || 'auto';
+            let targets: (Element | Node)[] = [];
+            if (r === 'shadow') targets = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
+            else if (r === 'light') targets = Array.from(this.querySelectorAll(selector));
+            else if (r === 'all') {
+              const sNodes = this.shadowRoot ? Array.from(this.shadowRoot.querySelectorAll(selector)) : [];
+              const lNodes = Array.from(this.querySelectorAll(selector));
+              targets = [...sNodes, ...lNodes];
+            } else {
+              targets = Array.from((this.shadowRoot || this).querySelectorAll(selector));
+            }
+            targets.forEach(t => (t as Element).remove());
+          }
+        },
+        enumerable: true,
+        configurable: true
+      });
+    };
   }
+  // Without selector (defaults to $this)
+  return queryAll('$this', selectorOrTarget as SwcQueryOptions);
 }
 
 export const getQueryAllMetadata = (target: any): QueryAllMetadata[] | undefined => {

package/src/decorators/subscribeSwcAppMessageWhileConnected.ts

@@ -66,6 +66,7 @@ export function subscribeSwcAppMessageWhileConnected(targetOrMessageTypeOrOption
   return createSubscribeSwcAppMessageWhileConnected(options, messageType);
 }
 
+export const receiveMessage = subscribeSwcAppMessageWhileConnected;
 // Helper function to retrieve message subscribers metadata
 export const getSubscribeSwcAppMessageWhileConnectedMetadata = (target: any): SwcAppMessageSubscriberMetadata[] | undefined => {
   const constructor = target instanceof Function ? target : target.constructor;

package/src/decorators/subscribeSwcAppRouteChangeWhileConnected.ts

@@ -13,8 +13,9 @@ export interface SwcAppRouteChangeSubscriberMetadata {
 
 export interface SwcAppRouteChangeOptions {
   path?: RoutePathType;
-  filter?: (router: Router, meta: {currentThis: any, helper: HelperHostSet}) => boolean;
+  filter?: (router: Router, meta: { currentThis: any; helper: HelperHostSet }) => boolean;
   order?: number;
+  valueKey?: symbol | string;
 }
 
 function createSubscribeSwcAppRouteChangeWhileConnected(options?: SwcAppRouteChangeOptions): MethodDecorator {
@@ -74,6 +75,7 @@ export function subscribeSwcAppRouteChangeWhileConnected(targetOrOptions?: any,
 
   return createSubscribeSwcAppRouteChangeWhileConnected(options);
 }
+export const changedRoute = subscribeSwcAppRouteChangeWhileConnected;
 
 // Helper function to retrieve route change subscribers metadata
 export const getSubscribeSwcAppRouteChangeWhileConnectedMetadata = (target: any): SwcAppRouteChangeSubscriberMetadata[] => {