@dooboostore/simple-web-component 1.0.34 → 1.0.36

package/README.md

@@ -49,21 +49,21 @@ render() {
 }
 ```
 
-#### @applyInnerHtmlNodeHost
+#### @applyInnerHtmlNodeThis
 Apply HTML to specific host element.
 
 ```typescript
-@applyInnerHtmlNodeHost({ root: 'light' })
+@applyInnerHtmlNodeThis({ root: 'light' })
 updateContent() {
   return `<p>Updated content</p>`;
 }
 ```
 
-#### @applyReplaceChildrenNodeHost
+#### @applyReplaceChildrenNodeThis
 Replace child nodes with new content.
 
 ```typescript
-@applyReplaceChildrenNodeHost({ root: 'light' })
+@applyReplaceChildrenNodeThis({ root: 'light' })
 replaceChildren(node: Node) {
   return node;
 }
@@ -95,38 +95,38 @@ onCriticalClick(event: Event) {
 Emit custom events with data.
 
 ```typescript
-@emitCustomEvent(':appHost', 'user-login')
+@emitCustomEvent('$appHost', 'user-login')
 async onLogin() {
   const user = await this.authService.login();
   return { user };  // Sent as event detail
 }
 ```
 
-#### @emitCustomEventHost
+#### @emitCustomEventThis
 Emit events from a method with custom event name mapping.
 
 ```typescript
-@emitCustomEventHost('navigate', { attributeName: 'on-navigate' })
+@emitCustomEventThis('navigate', { attributeName: 'on-navigate' })
 onNavClick(e: any) {
   return { path: e.target.dataset.path };
 }
 ```
 
-#### @addEventListenerHost
-Listen to events on the component element itself (`:host` selector).
+#### @addEventListenerThis
+Listen to events on the component element itself (`@host` selector).
 
 ```typescript
-@addEventListenerHost('click')
+@addEventListenerThis('click')
 onHostClick(event: Event) {
   console.log('Host element clicked');
 }
 ```
 
 #### @addEventListenerAppHost
-Listen to events on the app root host element (`:appHost` selector). Enables selective event handling with filters.
+Listen to events on the app root host element (`$appHost` selector). Enables selective event handling with filters.
 
 ```typescript
-// Listen to all user-action events from :appHost
+// Listen to all user-action events from $appHost
 @addEventListenerAppHost('user-action')
 onUserAction(e: CustomEvent) {
   console.log('User action:', e.detail);
@@ -173,11 +173,11 @@ textInputs?: HTMLInputElement[];
 listItems?: HTMLLIElement[];
 ```
 
-#### @queryHost
+#### @queryThis
 Query the component element itself.
 
 ```typescript
-@queryHost
+@queryThis
 self?: HTMLElement;
 
 printTag() {
@@ -185,11 +185,11 @@ printTag() {
 }
 ```
 
-#### @queryAllHost
+#### @queryAllThis
 Query all direct children of the component.
 
 ```typescript
-@queryAllHost
+@queryAllThis
 children?: HTMLElement[];
 
 getChildCount() {
@@ -210,11 +210,11 @@ width: string = '100px';
 resourceId: string = '';
 ```
 
-#### @attributeHost
+#### @attributeThis
 Bind attributes on host element itself.
 
 ```typescript
-@attributeHost('product-id')
+@attributeThis('product-id')
 productId: string = '';
 
 @onInitialize
@@ -239,7 +239,7 @@ onDisconnected() {
 }
 
 
-@onConnectedSwcApp
+@onConnectedBefore
 onAppReady(router: Router) {
   // Called after SwcApp.connect() completes on all already-connected components
   // Full DI support available through hostSet
@@ -288,7 +288,7 @@ Switch-case style conditional rendering with `swc-when` and `swc-otherwise` sub-
 // Component with conditional rendering logic
 @elementDefine('status-display')
 class StatusDisplay extends HTMLElement {
-  @attributeHost('status')
+  @attributeThis('status')
   status: string = 'pending';
 
   @setProperty('#status-template', 'value')
@@ -300,18 +300,15 @@ class StatusDisplay extends HTMLElement {
   render() {
     return `
       <template id="status-template" is="swc-choose">
-        <!-- Pending State: Using {{ }} for condition -->
-        <template is="swc-when" value="{{ $value === 'pending' }}">
+        <template is="swc-when" test="$value === 'pending'">
           <div style="color: orange;">⏳ Processing...</div>
         </template>
         
-        <!-- Success State: Using {{ }} for condition -->
-        <template is="swc-when" value="{{ $value === 'success' }}">
+        <template is="swc-when" test="$value === 'success'">
           <div style="color: green;">✓ Completed</div>
         </template>
         
-        <!-- Error State: Using {{ }} for condition -->
-        <template is="swc-when" value="{{ $value === 'error' }}">
+        <template is="swc-when" test="$value === 'error'">
           <div style="color: red;">✗ Failed</div>
         </template>
         
@@ -326,7 +323,6 @@ class StatusDisplay extends HTMLElement {
 ```
 
 **Expression Features:**
-- `{{ }} braces` for dynamic condition evaluation
 - `$value` contains the value passed to `swc-choose`
 - `skip-if-same` attribute prevents re-render when same template selected
 - **Attribute substitution with `{{= }}`**: `attribute-name="{{= expression }}"` automatically evaluated
@@ -334,7 +330,7 @@ class StatusDisplay extends HTMLElement {
 **Attribute Substitution Example ({{= }} usage):**
 ```html
 <template is="swc-choose">
-  <template is="swc-when" value="{{ $value?.type === 'user' }}">
+  <template is="swc-when" test="$value?.type === 'user'">
     <user-card 
       data-username="{{= $value?.name }}" 
       data-email="{{= $value?.email }}"
@@ -342,7 +338,7 @@ class StatusDisplay extends HTMLElement {
     ></user-card>
   </template>
   
-  <template is="swc-when" value="{{ $value?.type === 'product' }}">
+  <template is="swc-when" value="$value?.type === 'product'">
     <product-card 
       data-product-name="{{= $value?.title }}"
       data-price="{{= $value?.price }}"
@@ -499,7 +495,7 @@ class ProductList extends HTMLElement {
         <div style="margin: 10px; padding: 10px; border: 1px solid #ddd;">
           <!-- Using {{ }} for template content rendering -->
           <h3>{{ $item.name }}</h3>
-          <p>Price: ${{ $item.price }}</p>
+          <p>Price: {{ $item.price }}</p>
           <p>ID: {{ $item.id }} (Index: {{ $index }})</p>
           
           <!-- Using {{= }} for dynamic attribute substitution -->
@@ -512,7 +508,7 @@ class ProductList extends HTMLElement {
           
           <!-- Computed expressions with {{= }} -->
           <button data-id="{{= $item.id }}" data-price="{{= $item.price }}">
-            Add to Cart - \${{= $item.price }}
+            Add to Cart - {{ $item.price }}
           </button>
         </div>
         
@@ -561,7 +557,7 @@ class ProductList extends HTMLElement {
 </template>
 ```
 
-**Advanced: replace-wrap for Custom Expression Syntax**
+**Advanced: replace-wrap-start replace-wrap-end  for Custom Expression Syntax**
 
 Override default `{{ }}` and `{{= }}` syntax with custom wrappers:
 
@@ -574,10 +570,10 @@ class CustomLoop extends HTMLElement {
   render() {
     return `
       <!-- Using custom wrapper syntax [(= ... )] instead of {{= ... }} -->
-      <template id="items" is="swc-loop" replace-wrap="[(= )]" value="[(= $host.items )]">
+      <template id="items" is="swc-loop" replace-wrap-start="[(" replace-wrap-end=")]" value="{{= $host.items }}">
         <div>
-          <p>Name: [(= $item.name )]</p>
-          <button data-id="[(= $item.id )]">Click me</button>
+          <p>Name: [( $item.name )]</p>
+          <button data-id="[( $item.id )]">Click me</button>
         </div>
       </template>
     `;
@@ -586,10 +582,8 @@ class CustomLoop extends HTMLElement {
 ```
 
 **replace-wrap attribute options:**
-- Change expression wrapper from default `{{= }}` to custom pattern
-- Useful when `{{ }}` conflicts with template engines like EJS or Mustache
+- Change expression wrapper from default `{#{ }#}` to custom pattern
 - Supported on: `SwcLoop`, `SwcChoose`, `SwcIf`, `SwcAsync`, `register()` directives
-- Example patterns: `[(= )]`, `{[= ]}`, `<%= %>` (after escaping)
 
 ---
 
@@ -621,23 +615,22 @@ class RootRouter extends HTMLElement {
   render() {
     return `
       <template id="router" is="swc-choose">
-        <!-- Home Page: Using {{ }} for condition -->
-        <template is="swc-when" value="{{ ['', '/'].includes($value?.path) }}">
+        <template is="swc-when" test="['', '/'].includes($value?.path)">
           <home-page/>
         </template>
         
         <!-- Users List Page -->
-        <template is="swc-when" value="{{ $value?.path === '/users' }}">
+        <template is="swc-when" test="$value?.path === '/users'">
           <users-list-page/>
         </template>
         
         <!-- User Detail Page: Using {{= }} for dynamic attributes from route params -->
-        <template is="swc-when" value="{{ $value?.path.startsWith('/users/') }}">
+        <template is="swc-when" test="$value?.path.startsWith('/users/')">
           <user-detail-page user-id="{{= $value?.pathData?.id }}"></user-detail-page>
         </template>
         
         <!-- Product Detail Page: Using {{= }} for dynamic route parameters -->
-        <template is="swc-when" value="{{ $value?.path.startsWith('/products/') }}">
+        <template is="swc-when" test="$value?.path.startsWith('/products/')">
           <product-detail-page product-id="{{= $value?.pathData?.id }}"></product-detail-page>
         </template>
         
@@ -900,17 +893,17 @@ const rootRouterFactory = (w: Window) => {
       return `
         <template id="router" is="swc-choose">
           <!-- Home Page -->
-          <template is="swc-when" value="{{ ['', '/'].includes($value?.path) }}">
+          <template is="swc-when" test="['', '/'].includes($value?.path)">
             <home-page/>
           </template>
           
           <!-- Users List -->
-          <template is="swc-when" value="{{ $value?.path === '/users' }}">
+          <template is="swc-when" test="$value?.path === '/users'">
             <users-list-page/>
           </template>
           
           <!-- User Detail -->
-          <template is="swc-when" value="{{ $value?.path.startsWith('/users/') }}">
+          <template is="swc-when" test="$value?.path.startsWith('/users/')">
             <user-detail-page user-id="{{$value?.pathData?.id}}"/>
           </template>
           
@@ -965,7 +958,7 @@ export default HomePage;
 
 ```typescript
 // pages/UsersListPage.ts
-import { elementDefine, onConnectedInnerHtml, onConnectedSwcApp } from '@dooboostore/simple-web-component';
+import { elementDefine, onConnectedInnerHtml, onConnectedBefore } from '@dooboostore/simple-web-component';
 import { Inject } from '@dooboostore/simple-boot';
 import { UserService } from '../services/UserService';
 
@@ -978,7 +971,7 @@ const UsersListPage = (w: Window) => {
   class UsersListPage extends w.HTMLElement {
     private users: any[] = [];
 
-    @onConnectedSwcApp
+    @onConnectedBefore
     onconstructor(@Inject({ symbol: UserService.SYMBOL }) userService: UserService) {
       this.users = userService.getAllUsers();
     }
@@ -1022,10 +1015,10 @@ const UserCard = (w: Window) => {
 
   @elementDefine(tagName, { window: w })
   class UserCard extends w.HTMLElement {
-    @attributeHost('data-username')
+    @attributeThis('data-username')
     username: string;
 
-    @attributeHost('data-email')
+    @attributeThis('data-email')
     email: string;
 
     @onConnectedInnerHtml({ useShadow: true })
@@ -1173,7 +1166,7 @@ src/
 6. `<root-router>` becomes active with `@subscribeSwcAppRouteChangeWhileConnected` + `swc-choose` template
 7. Route changes automatically trigger `swc-choose` re-evaluation and template re-rendering
 8. Template attributes like `user-id="{{$value?.pathData?.id}}"` are dynamically populated with route params
-9. All components have access to injected services via `@onInitialize` or `@onConnectedSwcApp`
+9. All components have access to injected services via `@onInitialize`
 
 
 ---

package/dist/cjs/decorators/addEventListener.js

@@ -20,7 +20,9 @@ __export(addEventListener_exports, {
   ADD_EVENT_LISTENER_METADATA_KEY: () => ADD_EVENT_LISTENER_METADATA_KEY,
   addEventListener: () => addEventListener,
   addEventListenerAppHost: () => addEventListenerAppHost,
-  addEventListenerHost: () => addEventListenerHost,
+  addEventListenerDocument: () => addEventListenerDocument,
+  addEventListenerThis: () => addEventListenerThis,
+  addEventListenerWindow: () => addEventListenerWindow,
   getAddEventListenerMetadata: () => getAddEventListenerMetadata
 });
 module.exports = __toCommonJS(addEventListener_exports);
@@ -41,10 +43,16 @@ const getAddEventListenerMetadata = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
   return import_core.ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);
 };
-function addEventListenerHost(type, options) {
-  return addEventListener(":host", type, options);
+function addEventListenerThis(type, options) {
+  return addEventListener("$this", type, options);
 }
 function addEventListenerAppHost(type, options) {
-  return addEventListener(":appHost", 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);
 }
 //# sourceMappingURL=addEventListener.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/addEventListener.ts"],
-  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { SpecialSelector, SwcQueryOptions, HelperHostSet } from '../types';\n\nexport interface AddEventListenerBaseOptions extends EventListenerOptions {\n  capture?: boolean;\n  once?: boolean;\n  passive?: boolean;\n  stopPropagation?: boolean;\n  stopImmediatePropagation?: boolean;\n  preventDefault?: boolean;\n  removeOnDisconnected?: boolean;\n  delegate?: boolean;\n  filter?: (target: Event | CustomEvent, meta:{currentThis: any, helper: HelperHostSet}) => boolean;\n}\n\nexport interface AddEventListenerMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  type: string;\n  options: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean };\n}\n\nexport const ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for('simple-web-component:add-event-listener');\n\nexport function addEventListener(target: SpecialSelector, type: string, options?: AddEventListenerBaseOptions): MethodDecorator;\nexport function addEventListener(selector: string, type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean }): MethodDecorator;\n/**\n * @addEventListener decorator to bind events to elements.\n */\nexport function addEventListener(selectorOrTarget: string, type: string, options: any = {}): MethodDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n    const constructor = targetObj.constructor;\n\n    let listeners = ReflectUtils.getMetadata<AddEventListenerMetadata[]>(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n    if (!listeners) {\n      listeners = [];\n      ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);\n    }\n\n    listeners.push({ propertyKey, selector: selectorOrTarget, type, options });\n  };\n}\n\nexport const getAddEventListenerMetadata = (target: any): AddEventListenerMetadata[] | undefined => {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n};\n\n/**\n * @addEventListenerHost decorator - simplified version of @addEventListener for :host selector\n * Usage: @addEventListenerHost('click')\n * Usage: @addEventListenerHost('click', { stopPropagation: true })\n */\nexport function addEventListenerHost(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener(':host', type, options);\n}\n\n/**\n * @addEventListenerAppHost decorator - simplified version of @addEventListener for :appHost selector\n * Usage: @addEventListenerAppHost('click')\n * Usage: @addEventListenerAppHost('click', { stopPropagation: true })\n */\nexport function addEventListenerAppHost(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener(':appHost', type, options);\n}\n"],
-  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAsBtB,MAAM,kCAAkC,OAAO,IAAI,yCAAyC;AAO5F,SAAS,iBAAiB,kBAA0B,MAAc,UAAe,CAAC,GAAoB;AAC3G,SAAO,CAAC,WAAmB,aAA8B,eAAmC;AAC1F,UAAM,cAAc,UAAU;AAE9B,QAAI,YAAY,yBAAa,YAAwC,iCAAiC,WAAW;AACjH,QAAI,CAAC,WAAW;AACd,kBAAY,CAAC;AACb,+BAAa,eAAe,iCAAiC,WAAW,WAAW;AAAA,IACrF;AAEA,cAAU,KAAK,EAAE,aAAa,UAAU,kBAAkB,MAAM,QAAQ,CAAC;AAAA,EAC3E;AACF;AAEO,MAAM,8BAA8B,CAAC,WAAwD;AAClG,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,yBAAa,YAAY,iCAAiC,WAAW;AAC9E;AAOO,SAAS,qBAAqB,MAAc,SAA0E;AAC3H,SAAO,iBAAiB,SAAS,MAAM,OAAO;AAChD;AAOO,SAAS,wBAAwB,MAAc,SAA0E;AAC9H,SAAO,iBAAiB,YAAY,MAAM,OAAO;AACnD;",
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { SpecialSelector, SwcQueryOptions, HelperHostSet } from '../types';\n\nexport interface AddEventListenerBaseOptions extends EventListenerOptions {\n  capture?: boolean;\n  once?: boolean;\n  passive?: boolean;\n  stopPropagation?: boolean;\n  stopImmediatePropagation?: boolean;\n  preventDefault?: boolean;\n  removeOnDisconnected?: boolean;\n  delegate?: boolean;\n  filter?: (target: Event | CustomEvent, meta:{currentThis: any, helper: HelperHostSet}) => boolean;\n}\n\nexport interface AddEventListenerMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  type: string;\n  options: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean };\n}\n\nexport const ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for('simple-web-component:add-event-listener');\n\nexport function addEventListener(target: SpecialSelector, type: string, options?: AddEventListenerBaseOptions): MethodDecorator;\nexport function addEventListener(selector: string, type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions & { delegate?: boolean }): MethodDecorator;\n/**\n * @addEventListener decorator to bind events to elements.\n */\nexport function addEventListener(selectorOrTarget: string, type: string, options: any = {}): MethodDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n    const constructor = targetObj.constructor;\n\n    let listeners = ReflectUtils.getMetadata<AddEventListenerMetadata[]>(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n    if (!listeners) {\n      listeners = [];\n      ReflectUtils.defineMetadata(ADD_EVENT_LISTENER_METADATA_KEY, listeners, constructor);\n    }\n\n    listeners.push({ propertyKey, selector: selectorOrTarget, type, options });\n  };\n}\n\nexport const getAddEventListenerMetadata = (target: any): AddEventListenerMetadata[] | undefined => {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(ADD_EVENT_LISTENER_METADATA_KEY, constructor);\n};\n\n/**\n * @addEventListenerThis decorator - simplified version of @addEventListener for $this selector\n */\nexport function addEventListenerThis(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener('$this', type, options);\n}\n\n/**\n * @addEventListenerAppHost decorator - simplified version of @addEventListener for $appHost selector\n */\nexport function addEventListenerAppHost(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener('$appHost', type, options);\n}\nexport function addEventListenerWindow(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener('$window', type, options);\n}\nexport function addEventListenerDocument(type: string, options?: AddEventListenerBaseOptions & SwcQueryOptions): MethodDecorator {\n  return addEventListener('$document', type, options);\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAsBtB,MAAM,kCAAkC,OAAO,IAAI,yCAAyC;AAO5F,SAAS,iBAAiB,kBAA0B,MAAc,UAAe,CAAC,GAAoB;AAC3G,SAAO,CAAC,WAAmB,aAA8B,eAAmC;AAC1F,UAAM,cAAc,UAAU;AAE9B,QAAI,YAAY,yBAAa,YAAwC,iCAAiC,WAAW;AACjH,QAAI,CAAC,WAAW;AACd,kBAAY,CAAC;AACb,+BAAa,eAAe,iCAAiC,WAAW,WAAW;AAAA,IACrF;AAEA,cAAU,KAAK,EAAE,aAAa,UAAU,kBAAkB,MAAM,QAAQ,CAAC;AAAA,EAC3E;AACF;AAEO,MAAM,8BAA8B,CAAC,WAAwD;AAClG,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,yBAAa,YAAY,iCAAiC,WAAW;AAC9E;AAKO,SAAS,qBAAqB,MAAc,SAA0E;AAC3H,SAAO,iBAAiB,SAAS,MAAM,OAAO;AAChD;AAKO,SAAS,wBAAwB,MAAc,SAA0E;AAC9H,SAAO,iBAAiB,YAAY,MAAM,OAAO;AACnD;AACO,SAAS,uBAAuB,MAAc,SAA0E;AAC7H,SAAO,iBAAiB,WAAW,MAAM,OAAO;AAClD;AACO,SAAS,yBAAyB,MAAc,SAA0E;AAC/H,SAAO,iBAAiB,aAAa,MAAM,OAAO;AACpD;",
   "names": []
 }

package/dist/cjs/decorators/applyAttribute.js

@@ -19,14 +19,14 @@ var applyAttribute_exports = {};
 __export(applyAttribute_exports, {
   ATTRIBUTE_APPLY_METADATA_KEY: () => ATTRIBUTE_APPLY_METADATA_KEY,
   applyAttribute: () => applyAttribute,
-  applyAttributeHost: () => applyAttributeHost,
+  applyAttributeThis: () => applyAttributeThis,
   findAllAttributeApplyMetadata: () => findAllAttributeApplyMetadata,
   removeAttribute: () => removeAttribute,
-  removeAttributeHost: () => removeAttributeHost,
+  removeAttributeThis: () => removeAttributeThis,
   setAttribute: () => setAttribute,
-  setAttributeHost: () => setAttributeHost,
+  setAttributeThis: () => setAttributeThis,
   updateAttribute: () => updateAttribute,
-  updateAttributeHost: () => updateAttributeHost
+  updateAttributeThis: () => updateAttributeThis
 });
 module.exports = __toCommonJS(applyAttribute_exports);
 var import_core = require("@dooboostore/core");
@@ -68,15 +68,16 @@ function createAttributeDecorator(action) {
               if (!t || !(t instanceof win.HTMLElement)) return;
               targetEls.push(t);
             };
-            if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-            else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-            else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-            else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-            else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-            else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-            else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-            else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-            else if (selector === ":host" || !selector) applyRoot(host);
+            if (selector === "$this" || !selector) applyRoot(host);
+            else if (selector === "$host") applyRoot(hostSet.$host);
+            else if (selector === "$parentHost") applyRoot(hostSet.$parentHost);
+            else if (selector === "$appHost") applyRoot(hostSet.$appHost);
+            else if (selector === "$firstHost") applyRoot(hostSet.$firstHost);
+            else if (selector === "$lastHost") applyRoot(hostSet.$lastHost);
+            else if (selector === "$firstAppHost") applyRoot(hostSet.$firstAppHost);
+            else if (selector === "$lastAppHost") applyRoot(hostSet.$lastAppHost);
+            else if (selector === "$hosts") hostSet.$hosts.forEach(applyRoot);
+            else if (selector === "$appHosts") hostSet.$appHosts.forEach(applyRoot);
             else {
               const targetRoot = r === "auto" ? host.shadowRoot || host : r === "shadow" ? host.shadowRoot : host;
               if (targetRoot) {
@@ -139,12 +140,12 @@ function applyAttribute(selector, action = "update", options = {}) {
 const setAttribute = (selector, nameOrOptions, options = {}) => createAttributeDecorator("set")(selector, nameOrOptions, options);
 const updateAttribute = (selector, nameOrOptions, options = {}) => createAttributeDecorator("update")(selector, nameOrOptions, options);
 const removeAttribute = (selector, nameOrOptions, options = {}) => createAttributeDecorator("remove")(selector, nameOrOptions, options);
-function applyAttributeHost(action = "update", options = {}) {
-  return createAttributeDecorator(action)(":host", options);
+function applyAttributeThis(action = "update", options = {}) {
+  return createAttributeDecorator(action)("$this", options);
 }
-const setAttributeHost = (nameOrOptions, options = {}) => createAttributeDecorator("set")(":host", nameOrOptions, options);
-const updateAttributeHost = (nameOrOptions, options = {}) => createAttributeDecorator("update")(":host", nameOrOptions, options);
-const removeAttributeHost = (nameOrOptions, options = {}) => createAttributeDecorator("remove")(":host", nameOrOptions, options);
+const setAttributeThis = (nameOrOptions, options = {}) => createAttributeDecorator("set")("$this", nameOrOptions, options);
+const updateAttributeThis = (nameOrOptions, options = {}) => createAttributeDecorator("update")("$this", nameOrOptions, options);
+const removeAttributeThis = (nameOrOptions, options = {}) => createAttributeDecorator("remove")("$this", nameOrOptions, options);
 const findAllAttributeApplyMetadata = (target) => {
   const result = /* @__PURE__ */ new Map();
   const maps = import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_APPLY_METADATA_KEY, target);

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/applyAttribute.ts"],
-  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport type AttributeAction = 'set' | 'update' | 'remove';\n\nexport interface AttributeApplyOptions extends SwcQueryOptions {\n  name?: string;\n  filter?: (target: HTMLElement, value: any, meta: {currentThis: any, helper: HelperHostSet}) => boolean;\n}\n\nexport interface AttributeApplyMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  action: AttributeAction;\n  options: AttributeApplyOptions;\n}\n\nexport const ATTRIBUTE_APPLY_METADATA_KEY = Symbol.for('simple-web-component:attribute-apply');\n\nfunction createAttributeDecorator(action: AttributeAction) {\n  return (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}): MethodDecorator => {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n      const constructor = target.constructor;\n      let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_APPLY_METADATA_KEY, constructor) as Map<string | symbol, AttributeApplyMetadata>;\n      if (!metaList) {\n        metaList = new Map<string | symbol, AttributeApplyMetadata>();\n        ReflectUtils.defineMetadata(ATTRIBUTE_APPLY_METADATA_KEY, metaList, constructor);\n      }\n\n      let attributeName = typeof nameOrOptions === 'string' ? nameOrOptions : undefined;\n      let finalOptions = options;\n      \n      if (typeof nameOrOptions === 'object' && nameOrOptions !== null) {\n          finalOptions = nameOrOptions as AttributeApplyOptions;\n      }\n\n      metaList.set(propertyKey, { \n        propertyKey, \n        selector, \n        action, \n        options: { ...finalOptions, name: attributeName } \n      });\n\n      const original = descriptor.value;\n      descriptor.value = function (...args: any[]) {\n        ensureInit(this);\n        const res = (original as any).apply(this, args);\n\n        const handleResult = (resolvedValue: any) => {\n          if (resolvedValue !== undefined) {\n            const win = (this as any).ownerDocument?.defaultView || window;\n            const host = this as unknown as HTMLElement;\n            const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host), $this: this };\n            const r = finalOptions.root || 'auto';\n            const targetEls: HTMLElement[] = [];\n\n            const applyRoot = (t: any) => {\n              if (!t || !(t instanceof win.HTMLElement)) return;\n              targetEls.push(t);\n            };\n\n            if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n            else if (selector === ':appHost') applyRoot(hostSet.$appHost);\n            else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n            else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n            else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost);\n            else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost);\n            else if (selector === ':hosts') hostSet.$hosts.forEach(applyRoot);\n            else if (selector === ':appHosts') hostSet.$appHosts.forEach(applyRoot);\n            else if (selector === ':host' || !selector) applyRoot(host);\n            else {\n              const targetRoot = r === 'auto' ? (host.shadowRoot || host) : (r === 'shadow' ? host.shadowRoot : host);\n              if (targetRoot) {\n                  const found = targetRoot.querySelectorAll(selector);\n                  if (found) targetEls.push(...(Array.from(found) as HTMLElement[]));\n              }\n            }\n\n            targetEls.forEach(targetEl => {\n              if (finalOptions.filter && !finalOptions.filter(targetEl, resolvedValue, {currentThis: this, helper: hostSet})) {\n                return;\n              }\n              const resolvedRes = typeof resolvedValue === 'function' ? (resolvedValue as any)(targetEl, hostSet) : resolvedValue;\n\n              if (action === 'set' || action === 'update') {\n                if (attributeName) {\n                  // Case: @setAttribute(selector, 'name')\n                  if (resolvedRes === null || resolvedRes === undefined || resolvedRes === false) {\n                    targetEl.removeAttribute(attributeName);\n                  } else {\n                    targetEl.setAttribute(attributeName, resolvedRes === true ? '' : String(resolvedRes));\n                  }\n                } else if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                  // Case: @applyAttribute(selector) with Object return\n                  Object.entries(resolvedRes as any).forEach(([attr, val]) => {\n                    const finalVal = typeof val === 'function' ? val(targetEl, hostSet) : val;\n                    if (finalVal === null || finalVal === undefined || finalVal === false) {\n                      targetEl.removeAttribute(attr);\n                    } else {\n                      targetEl.setAttribute(attr, finalVal === true ? '' : String(finalVal));\n                    }\n                  });\n                }\n              } else if (action === 'remove') {\n                if (attributeName) {\n                  targetEl.removeAttribute(attributeName);\n                } else if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                  Object.entries(resolvedRes as any).forEach(([attr, val]) => {\n                    const shouldRemove = typeof val === 'function' ? val(targetEl, hostSet) : !!val;\n                    if (shouldRemove) targetEl.removeAttribute(attr);\n                  });\n                } else {\n                  const attrs = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];\n                  attrs.forEach(a => targetEl.removeAttribute(String(a)));\n                }\n              }\n            });\n          }\n          return resolvedValue;\n        };\n\n        if (res instanceof Promise) {\n          return res.then(handleResult);\n        } else {\n          return handleResult(res);\n        }\n      };\n      return descriptor;\n    };\n  };\n}\n\nexport function applyAttribute(selector: string, action: AttributeAction = 'update', options: AttributeApplyOptions = {}): MethodDecorator {\n  return createAttributeDecorator(action)(selector, options);\n}\n\nexport const setAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('set')(selector, nameOrOptions, options);\nexport const updateAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('update')(selector, nameOrOptions, options);\nexport const removeAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('remove')(selector, nameOrOptions, options);\n\n// Host versions\nexport function applyAttributeHost(action: AttributeAction = 'update', options: AttributeApplyOptions = {}): MethodDecorator {\n  return createAttributeDecorator(action)(':host', options);\n}\nexport const setAttributeHost = (nameOrOptions: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('set')(':host', nameOrOptions, options);\nexport const updateAttributeHost = (nameOrOptions: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('update')(':host', nameOrOptions, options);\nexport const removeAttributeHost = (nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('remove')(':host', nameOrOptions, options);\n\nexport const findAllAttributeApplyMetadata = (target: any): Map<string | symbol, AttributeApplyMetadata> => {\n  const result = new Map<string | symbol, AttributeApplyMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, AttributeApplyMetadata>>(ATTRIBUTE_APPLY_METADATA_KEY, target);\n  maps.forEach(map => {\n    if (map instanceof Map) {\n      map.forEach((v, k) => result.set(k, v));\n    }\n  });\n  return result;\n};\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport type AttributeAction = 'set' | 'update' | 'remove';\n\nexport interface AttributeApplyOptions extends SwcQueryOptions {\n  name?: string;\n  filter?: (target: HTMLElement, value: any, meta: {currentThis: any, helper: HelperHostSet}) => boolean;\n}\n\nexport interface AttributeApplyMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  action: AttributeAction;\n  options: AttributeApplyOptions;\n}\n\nexport const ATTRIBUTE_APPLY_METADATA_KEY = Symbol.for('simple-web-component:attribute-apply');\n\nfunction createAttributeDecorator(action: AttributeAction) {\n  return (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}): MethodDecorator => {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n      const constructor = target.constructor;\n      let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_APPLY_METADATA_KEY, constructor) as Map<string | symbol, AttributeApplyMetadata>;\n      if (!metaList) {\n        metaList = new Map<string | symbol, AttributeApplyMetadata>();\n        ReflectUtils.defineMetadata(ATTRIBUTE_APPLY_METADATA_KEY, metaList, constructor);\n      }\n\n      let attributeName = typeof nameOrOptions === 'string' ? nameOrOptions : undefined;\n      let finalOptions = options;\n      \n      if (typeof nameOrOptions === 'object' && nameOrOptions !== null) {\n          finalOptions = nameOrOptions as AttributeApplyOptions;\n      }\n\n      metaList.set(propertyKey, { \n        propertyKey, \n        selector, \n        action, \n        options: { ...finalOptions, name: attributeName } \n      });\n\n      const original = descriptor.value;\n      descriptor.value = function (...args: any[]) {\n        ensureInit(this);\n        const res = (original as any).apply(this, args);\n\n        const handleResult = (resolvedValue: any) => {\n          if (resolvedValue !== undefined) {\n            const win = (this as any).ownerDocument?.defaultView || window;\n            const host = this as unknown as HTMLElement;\n            const hostSet = { ...SwcUtils.getHelperAndHostSet(win, host), $this: this };\n            const r = finalOptions.root || 'auto';\n            const targetEls: HTMLElement[] = [];\n\n            const applyRoot = (t: any) => {\n              if (!t || !(t instanceof win.HTMLElement)) return;\n              targetEls.push(t);\n            };\n\n            if (selector === '$this' || !selector) applyRoot(host);\n            else if (selector === '$host') applyRoot(hostSet.$host);\n            else if (selector === '$parentHost') applyRoot(hostSet.$parentHost);\n            else if (selector === '$appHost') applyRoot(hostSet.$appHost);\n            else if (selector === '$firstHost') applyRoot(hostSet.$firstHost);\n            else if (selector === '$lastHost') applyRoot(hostSet.$lastHost);\n            else if (selector === '$firstAppHost') applyRoot(hostSet.$firstAppHost);\n            else if (selector === '$lastAppHost') applyRoot(hostSet.$lastAppHost);\n            else if (selector === '$hosts') hostSet.$hosts.forEach(applyRoot);\n            else if (selector === '$appHosts') hostSet.$appHosts.forEach(applyRoot);\n            else {\n              const targetRoot = r === 'auto' ? (host.shadowRoot || host) : (r === 'shadow' ? host.shadowRoot : host);\n              if (targetRoot) {\n                  const found = targetRoot.querySelectorAll(selector);\n                  if (found) targetEls.push(...(Array.from(found) as HTMLElement[]));\n              }\n            }\n\n            targetEls.forEach(targetEl => {\n              if (finalOptions.filter && !finalOptions.filter(targetEl, resolvedValue, {currentThis: this, helper: hostSet})) {\n                return;\n              }\n              const resolvedRes = typeof resolvedValue === 'function' ? (resolvedValue as any)(targetEl, hostSet) : resolvedValue;\n\n              if (action === 'set' || action === 'update') {\n                if (attributeName) {\n                  // Case: @setAttribute(selector, 'name')\n                  if (resolvedRes === null || resolvedRes === undefined || resolvedRes === false) {\n                    targetEl.removeAttribute(attributeName);\n                  } else {\n                    targetEl.setAttribute(attributeName, resolvedRes === true ? '' : String(resolvedRes));\n                  }\n                } else if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                  // Case: @applyAttribute(selector) with Object return\n                  Object.entries(resolvedRes as any).forEach(([attr, val]) => {\n                    const finalVal = typeof val === 'function' ? val(targetEl, hostSet) : val;\n                    if (finalVal === null || finalVal === undefined || finalVal === false) {\n                      targetEl.removeAttribute(attr);\n                    } else {\n                      targetEl.setAttribute(attr, finalVal === true ? '' : String(finalVal));\n                    }\n                  });\n                }\n              } else if (action === 'remove') {\n                if (attributeName) {\n                  targetEl.removeAttribute(attributeName);\n                } else if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                  Object.entries(resolvedRes as any).forEach(([attr, val]) => {\n                    const shouldRemove = typeof val === 'function' ? val(targetEl, hostSet) : !!val;\n                    if (shouldRemove) targetEl.removeAttribute(attr);\n                  });\n                } else {\n                  const attrs = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];\n                  attrs.forEach(a => targetEl.removeAttribute(String(a)));\n                }\n              }\n            });\n          }\n          return resolvedValue;\n        };\n\n        if (res instanceof Promise) {\n          return res.then(handleResult);\n        } else {\n          return handleResult(res);\n        }\n      };\n      return descriptor;\n    };\n  };\n}\n\nexport function applyAttribute(selector: string, action: AttributeAction = 'update', options: AttributeApplyOptions = {}): MethodDecorator {\n  return createAttributeDecorator(action)(selector, options);\n}\n\nexport const setAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('set')(selector, nameOrOptions, options);\nexport const updateAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('update')(selector, nameOrOptions, options);\nexport const removeAttribute = (selector: string, nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('remove')(selector, nameOrOptions, options);\n\n// This versions\nexport function applyAttributeThis(action: AttributeAction = 'update', options: AttributeApplyOptions = {}): MethodDecorator {\n  return createAttributeDecorator(action)('$this', options);\n}\nexport const setAttributeThis = (nameOrOptions: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('set')('$this', nameOrOptions, options);\nexport const updateAttributeThis = (nameOrOptions: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('update')('$this', nameOrOptions, options);\nexport const removeAttributeThis = (nameOrOptions?: string | AttributeApplyOptions, options: AttributeApplyOptions = {}) => createAttributeDecorator('remove')('$this', nameOrOptions, options);\n\nexport const findAllAttributeApplyMetadata = (target: any): Map<string | symbol, AttributeApplyMetadata> => {\n  const result = new Map<string | symbol, AttributeApplyMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, AttributeApplyMetadata>>(ATTRIBUTE_APPLY_METADATA_KEY, target);\n  maps.forEach(map => {\n    if (map instanceof Map) {\n      map.forEach((v, k) => result.set(k, v));\n    }\n  });\n  return result;\n};\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/decorators/applyClass.js

@@ -19,18 +19,18 @@ var applyClass_exports = {};
 __export(applyClass_exports, {
   CLASS_METADATA_KEY: () => CLASS_METADATA_KEY,
   addClass: () => addClass,
-  addClassHost: () => addClassHost,
+  addClassThis: () => addClassThis,
   applyClass: () => applyClass,
-  applyClassHost: () => applyClassHost,
+  applyClassThis: () => applyClassThis,
   findAllClassMetadata: () => findAllClassMetadata,
   removeClass: () => removeClass,
-  removeClassHost: () => removeClassHost,
+  removeClassThis: () => removeClassThis,
   setClass: () => setClass,
-  setClassHost: () => setClassHost,
+  setClassThis: () => setClassThis,
   toggleClass: () => toggleClass,
-  toggleClassHost: () => toggleClassHost,
+  toggleClassThis: () => toggleClassThis,
   updateClass: () => updateClass,
-  updateClassHost: () => updateClassHost
+  updateClassThis: () => updateClassThis
 });
 module.exports = __toCommonJS(applyClass_exports);
 var import_core = require("@dooboostore/core");
@@ -69,15 +69,16 @@ function createClassDecorator(action) {
               if (!t || !(t instanceof win.HTMLElement)) return;
               targetEls.push(t);
             };
-            if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
-            else if (selector === ":appHost") applyRoot(hostSet.$appHost);
-            else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
-            else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
-            else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
-            else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
-            else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
-            else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
-            else if (selector === ":host" || !selector) applyRoot(host);
+            if (selector === "$this" || !selector) applyRoot(host);
+            else if (selector === "$host") applyRoot(hostSet.$host);
+            else if (selector === "$parentHost") applyRoot(hostSet.$parentHost);
+            else if (selector === "$appHost") applyRoot(hostSet.$appHost);
+            else if (selector === "$firstHost") applyRoot(hostSet.$firstHost);
+            else if (selector === "$lastHost") applyRoot(hostSet.$lastHost);
+            else if (selector === "$firstAppHost") applyRoot(hostSet.$firstAppHost);
+            else if (selector === "$lastAppHost") applyRoot(hostSet.$lastAppHost);
+            else if (selector === "$hosts") hostSet.$hosts.forEach(applyRoot);
+            else if (selector === "$appHosts") hostSet.$appHosts.forEach(applyRoot);
             else {
               const targetRoot = r === "auto" ? host.shadowRoot || host : r === "shadow" ? host.shadowRoot : host;
               if (targetRoot) {
@@ -153,14 +154,14 @@ const updateClass = (selector, classMapOrOptions, options = {}) => createClassDe
 const addClass = (selector, classMapOrOptions, options = {}) => createClassDecorator("add")(selector, classMapOrOptions, options);
 const removeClass = (selector, classMapOrOptions, options = {}) => createClassDecorator("remove")(selector, classMapOrOptions, options);
 const toggleClass = (selector, classMapOrOptions, options = {}) => createClassDecorator("toggle")(selector, classMapOrOptions, options);
-function applyClassHost(action = "update", options = {}) {
-  return createClassDecorator(action)(":host", options);
+function applyClassThis(action = "update", options = {}) {
+  return createClassDecorator(action)("$this", options);
 }
-const setClassHost = (classMapOrOptions, options = {}) => createClassDecorator("set")(":host", classMapOrOptions, options);
-const updateClassHost = (classMapOrOptions, options = {}) => createClassDecorator("update")(":host", classMapOrOptions, options);
-const addClassHost = (classMapOrOptions, options = {}) => createClassDecorator("add")(":host", classMapOrOptions, options);
-const removeClassHost = (classMapOrOptions, options = {}) => createClassDecorator("remove")(":host", classMapOrOptions, options);
-const toggleClassHost = (classMapOrOptions, options = {}) => createClassDecorator("toggle")(":host", classMapOrOptions, options);
+const setClassThis = (classMapOrOptions, options = {}) => createClassDecorator("set")("$this", classMapOrOptions, options);
+const updateClassThis = (classMapOrOptions, options = {}) => createClassDecorator("update")("$this", classMapOrOptions, options);
+const addClassThis = (classMapOrOptions, options = {}) => createClassDecorator("add")("$this", classMapOrOptions, options);
+const removeClassThis = (classMapOrOptions, options = {}) => createClassDecorator("remove")("$this", classMapOrOptions, options);
+const toggleClassThis = (classMapOrOptions, options = {}) => createClassDecorator("toggle")("$this", classMapOrOptions, options);
 const findAllClassMetadata = (target) => {
   const result = /* @__PURE__ */ new Map();
   const maps = import_core.ReflectUtils.findAllMetadata(CLASS_METADATA_KEY, target);