@dooboostore/simple-web-component 1.0.24 → 1.0.26

package/README.md

@@ -1,8 +1,11 @@
 # @dooboostore/simple-web-component (SWC)
+[![NPM version](https://img.shields.io/npm/v/@dooboostore/simple-web-component.svg?color=cb3837&style=flat-square)](https://www.npmjs.com/package/@dooboostore/simple-web-component)
+[![Build and Test](https://github.com/dooboostore-develop/packages/actions/workflows/main.yaml/badge.svg?branch=main)](https://github.com/dooboostore-develop/packages/actions/workflows/main.yaml)
+[![License: MIT](https://img.shields.io/badge/License-MIT-yellow.svg?style=flat-square)](https://opensource.org/licenses/MIT)
 
 > **"Pure, Standards-Compliant, and Blazing Fast Web Components Framework."**
 
-`simple-web-component` (SWC) is a minimalist library designed for building high-performance Web Components and Single Page Applications (SPA). It strips away heavy "magic" features like Proxy-based reactivity and continuous `MutationObserver` scans in favor of a **Pure Architecture** that adheres strictly to browser standards.
+`simple-web-component` (SWC) is a minimalist library designed for building high-performance Web Components and Single Page Applications (SPA). It follows a **Pure Architecture** that adheres strictly to browser standards, avoiding heavy Proxy traps or Virtual DOM overhead.
 
 ---
 
@@ -265,7 +268,7 @@ Bidirectional attribute binding with automatic type conversion on `:host` elemen
 
 All usage patterns support automatic field-name-to-attribute-name conversion:
 - Without parentheses: `@attributeHost` - uses field name as attribute name
-- Empty parentheses: `@attributeHost()` - uses field name as attribute name  
+- Empty parentheses: `@attributeHost()` - uses field name as attribute name
 - Options only: `@attributeHost({ connectedInitialize: true })` - uses field name as attribute name
 - Custom name: `@attributeHost('custom-name')` - explicit attribute name
 - Custom name + options: `@attributeHost('custom-name', { type: Boolean })` - both specified
@@ -319,7 +322,48 @@ class ReactiveInput extends HTMLElement {
 }
 ```
 
-#### 12. `@setAttribute(selector, name, options?)`
+#### 12. `@applyAttribute(selector, action?, options?)` - Universal Attribute Manipulation
+
+Universal decorator for handling attributes with flexible strategies.
+
+```typescript
+@elementDefine('attribute-demo')
+class AttributeDemo extends HTMLElement {
+  private status = 'active';
+  private priority = 1;
+
+  // Set attribute (replace all)
+  @applyAttribute('.status', 'set')
+  setStatus() {
+    return { 'data-status': this.status, 'aria-busy': 'false' };
+  }
+
+  // Update attribute (merge)
+  @applyAttribute('.priority', 'update')
+  updatePriority() {
+    return { 'data-priority': this.priority.toString() };
+  }
+
+  // Remove attribute
+  @applyAttribute('.temp', 'remove')
+  removeTemp() {
+    return ['data-temp'];
+  }
+
+  @onConnectedInnerHtml
+  render() {
+    return `
+      <div class="status">Status: ${this.status}</div>
+      <div class="priority">Priority: ${this.priority}</div>
+      <div class="temp">Temporary</div>
+    `;
+  }
+}
+```
+
+**Convenience Methods** (specific actions):
+
+#### 12a. `@setAttribute(selector, name, options?)` - Set Single Attribute
 Reflect method's return value to a target element's DOM attribute. One-way binding (class → DOM).
 
 ```typescript
@@ -370,13 +414,35 @@ class StatusBadge extends HTMLElement {
 - `@setAttribute(selector, attributeName, options?)`
 - Returns method's value → reflects to target's attribute
 
+#### 12c. `@updateAttribute(selector, name, options?)` - Update Attribute
+
+Merge return value with existing attributes instead of replacing.
+
+```typescript
+@updateAttribute(':host', 'data-modified')
+updateModifiedTime() {
+  return new Date().toISOString();
+}
+```
+
+#### 12d. `@removeAttribute(selector, name, options?)` - Remove Attribute
+
+Remove specific attributes from target elements.
+
+```typescript
+@removeAttribute('.disabled-item', 'data-active')
+removeActive() {
+  return true;  // Remove if truthy
+}
+```
+
 **Selectors:**
 - `':host'` - The component itself
 - `'#element-id'` - Element by ID
 - `'.class-name'` - Element by class
 - `selector` - Any CSS selector
 
-#### 12b. `@setAttributeHost(name, options?)` - Shorthand for `:host`
+#### 12e. `@setAttributeHost(name, options?)` - Shorthand for `:host`
 Simplified version of `@setAttribute` that always targets `:host`.
 
 ```typescript
@@ -939,7 +1005,7 @@ class MyComponent extends HTMLElement {
 ```
 
 **Return Types by Position:**
-- `beforeBegin`, `afterBegin`, `beforeEnd`, `afterEnd`: **Node | Node[]** 
+- `beforeBegin`, `afterBegin`, `beforeEnd`, `afterEnd`: **Node | Node[]**
 - `replace`: **Node**
 - `replaceChildren`: **Node | Node[]**
 - `innerHtml`: **string**
@@ -964,7 +1030,44 @@ class MyComponent extends HTMLElement {
 
 **All functions accept optional `doc` parameter for SSR support.**
 
-#### 20. `@setStyle(selector, options?)` / `@updateStyle(selector, options?)` / `@removeStyle(selector, options?)`
+#### 20. `@applyStyle(selector, action?, options?)` - Universal Style Manipulation
+
+Universal decorator for style operations with flexible strategies.
+
+```typescript
+@elementDefine('style-demo')
+class StyleDemo extends HTMLElement {
+  private isDark = false;
+
+  // Set styles (replace all inline styles)
+  @applyStyle('.panel', 'set')
+  setDarkMode() {
+    return this.isDark ? {
+      backgroundColor: '#222',
+      color: '#fff'
+    } : {
+      backgroundColor: '#fff',
+      color: '#000'
+    };
+  }
+
+  // Update styles (merge with existing)
+  @applyStyle('.btn', 'update')
+  addBtnStyle() {
+    return { padding: '10px', cursor: 'pointer' };
+  }
+
+  // Remove styles (delete properties)
+  @applyStyle('.temp', 'remove')
+  clearTempStyle() {
+    return ['transition', 'transform'];
+  }
+}
+```
+
+**Convenience Methods** (specific actions):
+
+#### 20a. `@setStyle(selector, options?)` / `@updateStyle(selector, options?)` / `@removeStyle(selector, options?)`
 
 Manipulate CSS styles on elements with full Shadow DOM support.
 
@@ -1044,16 +1147,45 @@ clearHostStyle() {
 
 ---
 
-#### 21. `@setClassList(selector, options?)` / `@addClassList(selector, options?)` / `@removeClassList(selector, options?)` / `@toggleClassList(selector, options?)` / `@updateClassList(selector, options?)`
+#### 21. `@applyClass(selector, action?, options?)` - Universal Class Manipulation
+
+Universal decorator for class operations with flexible strategies.
+
+```typescript
+@elementDefine('class-demo')
+class ClassDemo extends HTMLElement {
+  private isActive = false;
+  private isLoading = false;
+
+  @applyClass('.item', 'set')
+  setClasses() {
+    return this.isActive ? ['active', 'highlight'] : ['inactive'];
+  }
+
+  @applyClass('.spinner', 'update')
+  updateSpinner() {
+    return this.isLoading ? ['spinning', 'visible'] : ['hidden'];
+  }
+
+  @applyClass('.temp', 'remove')
+  removeTempClasses() {
+    return ['temporary', 'debug'];
+  }
+}
+```
+
+**Convenience Methods** (specific actions):
+
+#### 21a. `@setClass(selector, options?)` / `@addClass(selector, options?)` / `@removeClass(selector, options?)` / `@toggleClass(selector, options?)` / `@updateClass(selector, options?)`
 
 Manipulate CSS classes on elements declaratively with Shadow DOM support.
 
 **Core Features:**
-- `@addClassList` - Add classes
-- `@removeClassList` - Remove classes
-- `@toggleClassList` - Toggle classes (returns boolean or bool array)
-- `@setClassList` - Replace all classes
-- `@updateClassList` - Merge with existing classes
+- `@addClass` - Add classes
+- `@removeClass` - Remove classes
+- `@toggleClass` - Toggle classes (returns boolean or bool array)
+- `@setClass` - Replace all classes
+- `@updateClass` - Merge with existing classes
 - `root` option for DOM layer targeting
 - Support for multiple elements
 
@@ -1062,22 +1194,22 @@ Manipulate CSS classes on elements declaratively with Shadow DOM support.
 class TabComponent extends HTMLElement {
   activeTab = 'home';
 
-  @addClassList('.tab', { root: 'shadow' })
+  @addClass('.tab', { root: 'shadow' })
   addTabClasses() {
     return ['interactive', 'focusable'];
   }
 
-  @toggleClassList('.tab', { root: 'shadow' })
+  @toggleClass('.tab', { root: 'shadow' })
   toggleActiveTab() {
     return this.activeTab === 'home';  // Returns boolean for all matched elements
   }
 
-  @removeClassList('.tab-inactive', { root: 'shadow' })
+  @removeClass('.tab-inactive', { root: 'shadow' })
   removeInactiveClass() {
     return ['disabled'];
   }
 
-  @setClassList('.tab-pane', { root: 'shadow' })
+  @setClass('.tab-pane', { root: 'shadow' })
   updateTabPane() {
     return [`pane-${this.activeTab}`, 'content'];
   }
@@ -1104,32 +1236,32 @@ class TabComponent extends HTMLElement {
 Note: `:host` selector targets the component itself (boundary), so `root` option is ignored.
 
 All Host variants support three usage patterns:
-- Without parentheses: `@setClassListHost` setHostClasses() { ... }
-- With empty parentheses: `@setClassListHost()` setHostClasses() { ... }
-- With options: `@setClassListHost({ ... })` setHostClasses() { ... }
+- Without parentheses: `@setClassHost` setHostClasses() { ... }
+- With empty parentheses: `@setClassHost()` setHostClasses() { ... }
+- With options: `@setClassHost({ ... })` setHostClasses() { ... }
 
 ```typescript
-@addClassListHost
+@addClassHost
 addHostClasses() {
   return ['component', 'interactive'];
 }
 
-@removeClassListHost()
+@removeClassHost()
 removeHostClasses() {
   return ['loading'];
 }
 
-@toggleClassListHost()
+@toggleClassHost()
 toggleHostClass() {
   return this.isOpen;  // Apply 'open' class if true
 }
 
-@setClassListHost
+@setClassHost
 setHostClasses() {
   return this.isOpen ? ['open', 'expanded'] : ['closed'];
 }
 
-@updateClassListHost()
+@updateClassHost()
 updateHostClasses() {
   return ['visible'];
 }
@@ -1145,14 +1277,14 @@ Marks a class as a **Singleton** in the `<swc-app>` DI container for **construct
 **Two DI Mechanisms:**
 
 1. **Lifecycle DI** (`@onBeforeConnected`, etc.) - ❌ NO `@Sim` needed
-   - Works on any `@elementDefine` component
-   - Services injected via method parameters
-   - Can be used outside `<swc-app>`
+  - Works on any `@elementDefine` component
+  - Services injected via method parameters
+  - Can be used outside `<swc-app>`
 
 2. **Constructor DI** - ✅ `@Sim` REQUIRED
-   - Only works inside `<swc-app>` boundary
-   - Both provider AND consumer need `@Sim`
-   - Singleton pattern within the app
+  - Only works inside `<swc-app>` boundary
+  - Both provider AND consumer need `@Sim`
+  - Singleton pattern within the app
 
 **Example: Both Approaches**
 
@@ -2169,9 +2301,6 @@ class UserListPage extends HTMLElement {
     }
   }
 
-  @classList('active')
-  isActive = false;
-
   @onConnectedInnerHtml
   render() {
     return `

package/dist/cjs/decorators/addEventListener.js

@@ -24,7 +24,7 @@ __export(addEventListener_exports, {
 });
 module.exports = __toCommonJS(addEventListener_exports);
 var import_core = require("@dooboostore/core");
-const ADD_EVENT_LISTENER_METADATA_KEY = Symbol("simple-web-component:add-event-listener");
+const ADD_EVENT_LISTENER_METADATA_KEY = Symbol.for("simple-web-component:add-event-listener");
 function addEventListener(selectorOrTarget, type, options = {}) {
   return (targetObj, propertyKey, descriptor) => {
     const constructor = targetObj.constructor;

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 } 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}\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('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"],
-  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAqBtB,MAAM,kCAAkC,OAAO,yCAAyC;AAOxF,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;",
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { SpecialSelector, SwcQueryOptions } 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}\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"],
+  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAqBtB,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;",
   "names": []
 }

package/dist/cjs/decorators/applyAttribute.js

@@ -0,0 +1,148 @@
+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 applyAttribute_exports = {};
+__export(applyAttribute_exports, {
+  ATTRIBUTE_APPLY_METADATA_KEY: () => ATTRIBUTE_APPLY_METADATA_KEY,
+  applyAttribute: () => applyAttribute,
+  applyAttributeHost: () => applyAttributeHost,
+  findAllAttributeApplyMetadata: () => findAllAttributeApplyMetadata,
+  removeAttribute: () => removeAttribute,
+  removeAttributeHost: () => removeAttributeHost,
+  setAttribute: () => setAttribute,
+  setAttributeHost: () => setAttributeHost,
+  updateAttribute: () => updateAttribute,
+  updateAttributeHost: () => updateAttributeHost
+});
+module.exports = __toCommonJS(applyAttribute_exports);
+var import_core = require("@dooboostore/core");
+var import_elementDefine = require("./elementDefine");
+var import_Utils = require("../utils/Utils");
+const ATTRIBUTE_APPLY_METADATA_KEY = Symbol.for("simple-web-component:attribute-apply");
+function createAttributeDecorator(action) {
+  return (selector, nameOrOptions, options = {}) => {
+    return (target, propertyKey, descriptor) => {
+      const constructor = target.constructor;
+      let metaList = import_core.ReflectUtils.getOwnMetadata(ATTRIBUTE_APPLY_METADATA_KEY, constructor);
+      if (!metaList) {
+        metaList = /* @__PURE__ */ new Map();
+        import_core.ReflectUtils.defineMetadata(ATTRIBUTE_APPLY_METADATA_KEY, metaList, constructor);
+      }
+      let attributeName = typeof nameOrOptions === "string" ? nameOrOptions : void 0;
+      let finalOptions = options;
+      if (typeof nameOrOptions === "object" && nameOrOptions !== null) {
+        finalOptions = nameOrOptions;
+      }
+      metaList.set(propertyKey, {
+        propertyKey,
+        selector,
+        action,
+        options: { ...finalOptions, name: attributeName }
+      });
+      const original = descriptor.value;
+      descriptor.value = async function(...args) {
+        (0, import_elementDefine.ensureInit)(this);
+        const res = await original.apply(this, args);
+        if (res !== void 0) {
+          const win = this.ownerDocument?.defaultView || window;
+          const host = this;
+          const hostSet = { ...import_Utils.SwcUtils.getHelperAndHostSet(win, host), $this: this };
+          const r = finalOptions.root || "auto";
+          const targetEls = [];
+          const applyRoot = (t) => {
+            if (!t || !(t instanceof win.HTMLElement)) return;
+            targetEls.push(t);
+          };
+          if (selector === ":parentHost") applyRoot(hostSet.$parentHost);
+          else if (selector === ":appHost") applyRoot(hostSet.$appHost);
+          else if (selector === ":firstHost") applyRoot(hostSet.$firstHost);
+          else if (selector === ":lastHost") applyRoot(hostSet.$lastHost);
+          else if (selector === ":firstAppHost") applyRoot(hostSet.$firstAppHost);
+          else if (selector === ":lastAppHost") applyRoot(hostSet.$lastAppHost);
+          else if (selector === ":hosts") hostSet.$hosts.forEach(applyRoot);
+          else if (selector === ":appHosts") hostSet.$appHosts.forEach(applyRoot);
+          else if (selector === ":host" || !selector) applyRoot(host);
+          else {
+            const targetRoot = r === "auto" ? host.shadowRoot || host : r === "shadow" ? host.shadowRoot : host;
+            if (targetRoot) {
+              const found = targetRoot.querySelectorAll(selector);
+              if (found) targetEls.push(...Array.from(found));
+            }
+          }
+          targetEls.forEach((targetEl) => {
+            const resolvedRes = typeof res === "function" ? res(targetEl, hostSet) : res;
+            if (action === "set" || action === "update") {
+              if (attributeName) {
+                if (resolvedRes === null || resolvedRes === void 0 || resolvedRes === false) {
+                  targetEl.removeAttribute(attributeName);
+                } else {
+                  targetEl.setAttribute(attributeName, resolvedRes === true ? "" : String(resolvedRes));
+                }
+              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                Object.entries(resolvedRes).forEach(([attr, val]) => {
+                  const finalVal = typeof val === "function" ? val(targetEl, hostSet) : val;
+                  if (finalVal === null || finalVal === void 0 || finalVal === false) {
+                    targetEl.removeAttribute(attr);
+                  } else {
+                    targetEl.setAttribute(attr, finalVal === true ? "" : String(finalVal));
+                  }
+                });
+              }
+            } else if (action === "remove") {
+              if (attributeName) {
+                targetEl.removeAttribute(attributeName);
+              } else if (typeof resolvedRes === "object" && resolvedRes !== null && !Array.isArray(resolvedRes)) {
+                Object.entries(resolvedRes).forEach(([attr, val]) => {
+                  const shouldRemove = typeof val === "function" ? val(targetEl, hostSet) : !!val;
+                  if (shouldRemove) targetEl.removeAttribute(attr);
+                });
+              } else {
+                const attrs = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];
+                attrs.forEach((a) => targetEl.removeAttribute(String(a)));
+              }
+            }
+          });
+        }
+        return res;
+      };
+      return descriptor;
+    };
+  };
+}
+function applyAttribute(selector, action = "update", options = {}) {
+  return createAttributeDecorator(action)(selector, 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);
+}
+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 findAllAttributeApplyMetadata = (target) => {
+  const result = /* @__PURE__ */ new Map();
+  const maps = import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_APPLY_METADATA_KEY, target);
+  maps.forEach((map) => {
+    if (map instanceof Map) {
+      map.forEach((v, k) => result.set(k, v));
+    }
+  });
+  return result;
+};
+//# sourceMappingURL=applyAttribute.js.map

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

@@ -0,0 +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}\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 = async function (...args: any[]) {\n        ensureInit(this);\n        const res = await (original as any).apply(this, args);\n        if (res !== 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            const resolvedRes = typeof res === 'function' ? (res as any)(targetEl, hostSet) : res;\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 res;\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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",
+  "names": []
+}