@dooboostore/simple-web-component 1.0.25 → 1.0.27

package/README.md

@@ -3,112 +3,328 @@
 [![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 follows a **Pure Architecture** that adheres strictly to browser standards, avoiding heavy Proxy traps or Virtual DOM overhead.
+**SWC** is a lightweight, production-ready Web Components framework for building fast, modular, and maintainable SPAs without Virtual DOM overhead.
 
 ---
 
-## 🚀 Why SWC?
+## 🎯 Core Features
 
-- **Zero Magic**: No hidden reactivity traps. Predictive and standard-compliant.
-- **Native Inheritance**: Inherit directly from `HTMLElement` or built-in elements (`is` attribute).
-- **Extreme Performance**: Optimized for high-load UIs with minimal memory footprint.
-- **Micro-Frontend Ready**: Independent routing and DI containers for every component scope.
-- **Modern CSS**: First-class support for Container Queries and Shadow DOM.
+### 1. **@elementDefine** - Component Registration
+Register Web Components with automatic lifecycle management and DI support.
 
----
+```typescript
+@elementDefine('my-component')
+class MyComponent extends HTMLElement {
+  @onInitialize
+  constructor(private service: MyService) {
+    super();
+  }
+}
+```
 
-## 💡 Complete Decorator Reference
+### 2. **Dependency Injection (@onInitialize)**
+Inject services into Web Components using the `@onInitialize` decorator.
 
-### 1. Attribute Management (`@attr`, `@applyAttribute`)
+```typescript
+@elementDefine('dashboard')
+class Dashboard extends HTMLElement {
+  @onInitialize
+  constructor(
+    @Inject({ symbol: UserService.SYMBOL }) userService: UserService
+  ) {
+    super();
+    this.userService = userService;
+  }
+}
+```
 
-Sync properties with DOM attributes or manage multiple attributes via methods.
+### 3. **Declarative DOM Updates**
 
-- **Field Decorators**:
-  - `@attr(selector, options?)`: Syncs a field with an element's attribute.
-- **Method Decorators**:
-  - `@applyAttribute(selector, action?)`: Universal attribute controller.
-  - `@setAttribute(selector, name?)`: Sets a specific attribute based on return value.
-  - `@updateAttribute(selector)`: Merges/updates multiple attributes.
-  - `@removeAttribute(selector)`: Removes attributes.
+#### @onConnectedInnerHtml
+Render HTML automatically when component connects to DOM.
 
 ```typescript
-class UserProfile extends HTMLElement {
-  @attr(':host') name = 'Guest';
+@onConnectedInnerHtml({ useShadow: true })
+render() {
+  return `<div>Hello, <span>${this.name}</span>!</div>`;
+}
+```
 
-  @updateAttribute('.avatar')
-  syncStatus(active: boolean) {
-    return {
-      'data-active': active,
-      'aria-hidden': (el) => !active
-    };
-  }
+#### @applyInnerHtmlNodeHost
+Apply HTML to specific host element.
+
+```typescript
+@applyInnerHtmlNodeHost({ root: 'light' })
+updateContent() {
+  return `<p>Updated content</p>`;
+}
+```
+
+#### @applyReplaceChildrenNodeHost
+Replace child nodes with new content.
+
+```typescript
+@applyReplaceChildrenNodeHost({ root: 'light' })
+replaceChildren(node: Node) {
+  return node;
+}
+```
+
+### 4. **Event Handling**
+
+#### @addEventListener
+Attach event listeners to elements.
+
+```typescript
+@addEventListener('#submit-btn', 'click')
+onSubmit(event: Event) {
+  console.log('Submitted');
+}
+```
+
+#### @emitCustomEvent
+Emit custom events with data.
+
+```typescript
+@emitCustomEvent(':appHost', 'user-login')
+async onLogin() {
+  const user = await this.authService.login();
+  return { user };  // Sent as event detail
+}
+```
+
+#### @emitCustomEventHost
+Emit events from a method with custom event name mapping.
+
+```typescript
+@emitCustomEventHost('navigate', { attributeName: 'on-navigate' })
+onNavClick(e: any) {
+  return { path: e.target.dataset.path };
+}
+```
+
+### 5. **DOM Querying**
+
+#### @query
+Query single element (Light DOM by default).
+
+```typescript
+@query('#form-input')
+formInput?: HTMLInputElement;
+
+@query('.card', { root: 'shadow' })
+shadowCard?: HTMLElement;
+```
+
+#### @queryAll
+Query multiple elements.
+
+```typescript
+@queryAll('input[type="text"]')
+textInputs?: HTMLInputElement[];
+
+@queryAll('li', { root: 'shadow' })
+listItems?: HTMLLIElement[];
+```
+
+#### @queryHost
+Query the component element itself.
+
+```typescript
+@queryHost
+self?: HTMLElement;
+
+printTag() {
+  console.log(this.self?.tagName);  // CUSTOM-CARD
 }
 ```
 
-### 2. Class Manipulation (`@applyClass`)
+#### @queryAllHost
+Query all direct children of the component.
+
+```typescript
+@queryAllHost
+children?: HTMLElement[];
+
+getChildCount() {
+  return this.children?.length ?? 0;
+}
+```
 
-Declaratively manage CSS classes. Supports complex logic via filter functions.
+### 6. **Attribute Binding**
 
-- **Convenience Methods**:
-  - `@setClass(selector)`: Replaces all classes (Replace Strategy).
-  - `@updateClass(selector)`: Updates specific classes (Merge Strategy).
-  - `@toggleClass(selector)`: Toggles classes.
+#### @attribute
+Bind HTML attributes to properties (automatic sync).
 
 ```typescript
-@updateClass('.nav-item')
-updateActive(path: string) {
-  return {
-    // el: Target element, $set: HelperSet including $this
-    active: (el, $set) => path.startsWith(el.dataset.path!)
-  };
+@attribute
+width: string = '100px';
+
+@attribute('data-id')
+resourceId: string = '';
+```
+
+#### @attributeHost
+Bind attributes on host element itself.
+
+```typescript
+@attributeHost('product-id')
+productId: string = '';
+
+@onInitialize
+constructor() {
+  super();
+  if (this.productId) {
+    this.loadProduct(this.productId);
+  }
 }
 ```
 
-### 3. Style Manipulation (`@applyStyle`)
+### 7. **Lifecycle Hooks**
+
+```typescript
+@onConnected
+onConnected() {
+  // Called when element enters DOM
+}
+
+@onDisconnected
+onDisconnected() {
+  // Called when element leaves DOM
+}
 
-Surgically update element styles with dynamic value support.
+@onAttributeChanged
+onAttributeChanged(name: string, oldValue: string, newValue: string) {
+  // Called when attribute changes
+}
+```
 
-- **Convenience Methods**:
-  - `@setStyle(selector)`: Replaces existing inline styles.
-  - `@updateStyle(selector)`: Merges with existing styles.
-  - `@removeStyle(selector)`: Removes specific properties.
+### 8. **Routing with @subscribeSwcAppRouteChange**
+Declarative route pattern matching with path parameters.
 
 ```typescript
-@updateStyle('.box')
-adjustStyle(highlight: boolean) {
-  return {
-    'background-color': highlight ? 'yellow' : null, // null/undefined removes property
-    'font-weight': (el) => highlight ? 'bold' : 'normal'
-  };
+@elementDefine('root-router')
+class RootRouter extends HTMLElement {
+  @subscribeSwcAppRouteChange('/')
+  @applyInnerHtmlNodeHost({ root: 'light' })
+  homeRoute(router: RouterEventType) {
+    return `<home-page/>`;
+  }
+
+  @subscribeSwcAppRouteChange('/product/{id}')
+  @applyInnerHtmlNodeHost({ root: 'light' })
+  productRoute(router: RouterEventType, pathData: any) {
+    return `<product-page product-id="${pathData.id}"/>`;
+  }
 }
 ```
 
-### 4. Surgical DOM Manipulation (`@applyNode`)
+### 9. **Accommodation Pattern**
+Factory-based component registration with explicit DI.
 
-Update specific DOM nodes without full re-renders.
+```typescript
+// Component factory
+export default (w: Window) => {
+  const tagName = 'my-component';
+  const existing = w.customElements.get(tagName);
+  if (existing) return tagName;
 
-- `@applyInnerHtmlNode(selector)`: Sets `innerHTML`.
-- `@applyInnerTextNode(selector)`: Sets `innerText`.
-- `@applyReplaceChildrenNode(selector)`: Replaces all children.
-- `@applyAppendChildNode(selector)`: Appends nodes.
+  @elementDefine(tagName, { window: w })
+  class MyComponent extends w.HTMLElement {
+    @onInitialize
+    constructor(service: MyService) {
+      super();
+      this.service = service;
+    }
+  }
+  
+  return tagName;
+};
 
-### 5. Host Shorthands
+// Boot factory
+export default (w: Window, container: symbol) => {
+  serviceFactories.forEach(s => s(container));
+  register(w, [...pageFactories, ...componentFactories]);
+};
 
-All decorators have `:host` equivalents for convenience:
-`@updateClassHost()`, `@updateStyleHost()`, `@applyAttributeHost()`, etc.
+// Entry point
+const container = Symbol('app');
+bootFactory(w, container);
+appElement.connect({
+  container,
+  window: w,
+  onEngineStarted: () => {
+    appElement.innerHTML = '<root-router></root-router>';
+  }
+});
+```
 
 ---
 
-## 📦 Installation & Setup
+## ⚠️ Critical Rules
+
+### DO NOT Use @Sim on Web Components
+`@Sim` is for **Services only**. Web Components should use `@elementDefine`.
+
+```typescript
+// ✅ CORRECT
+@Sim()
+export class UserService { }
+
+@elementDefine(tagName, { window: w })
+class UserWidget extends w.HTMLElement { }
 
-```bash
-npm install @dooboostore/simple-web-component reflect-metadata
+// ❌ WRONG
+@Sim()
+@elementDefine(tagName, { window: w })
+class UserWidget extends w.HTMLElement { }
 ```
 
-### Browser Support
-For **Safari** support of the `is` attribute, add this to your `<head>`:
-```html
-<script src="https://unpkg.com/@ungap/custom-elements"></script>
+### Factory Always Returns tagName (String)
+```typescript
+export default (w: Window) => {
+  const tagName = 'my-element';
+  const existing = w.customElements.get(tagName);
+  if (existing) return tagName;  // ← Return string!
+
+  @elementDefine(tagName, { window: w })
+  class MyElement extends w.HTMLElement { }
+  
+  return tagName;  // ← Always return tagName, never class
+};
 ```
+
+### @onInitialize for DI (Not Constructor Parameters)
+```typescript
+// ✅ CORRECT
+@onInitialize
+constructor(@Inject({ symbol: Service.SYMBOL }) service: Service) {
+  super();
+  this.service = service;
+}
+
+// ❌ WRONG
+constructor(private service: Service) { super(); }  // Web Components can't have constructor parameters!
+```
+
+---
+
+## 📚 Examples
+
+- **[Commerce (E-Commerce SPA)](./examples/commerce)** - Full shopping cart example
+- **[Stock (Market Dashboard)](./examples/stock)** - Real-time data with routing
+- **[Accommodation (Reference Pattern)](./examples/accommodation)** - Standard setup pattern
+
+---
+
+## 🔗 Related Packages
+
+- **[@dooboostore/simple-boot](../simple-boot)** - DI & AOP Container
+- **[@dooboostore/core-web](../core-web)** - Web Utilities & Router
+- **[@dooboostore/dom-parser](../dom-parser)** - HTML Parsing & AST
+
+---
+
+## 📄 License
+MIT © 2024 dooboostore-develop

package/dist/cjs/decorators/attribute.js

@@ -104,49 +104,37 @@ function attribute(selector, options = {}) {
         }
       });
     };
-    Object.defineProperty(target, propertyKey, {
-      get() {
-        const attrName = options.name || String(propertyKey);
-        const conf = (0, import_elementDefine.getElementConfig)(this);
-        const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
-        const targetType = options.type || designType;
-        if (this.__swc_syncing_init || options.connectedInitialize && !this.__swc_connected) {
-          return convertValue(this[privateKey], targetType);
-        }
-        const targets = resolveTargetEls(this, selector, options, currentWin);
-        const primaryTarget = targets[0];
-        if (primaryTarget && typeof primaryTarget.hasAttribute === "function") {
-          if (primaryTarget.hasAttribute(attrName)) {
-            const domVal = primaryTarget.getAttribute(attrName);
-            return convertValue(domVal, targetType);
-          }
-          return null;
-        }
-        return convertValue(this[privateKey], targetType);
-      },
-      set(nv) {
-        const attrName = options.name || String(propertyKey);
-        const conf = (0, import_elementDefine.getElementConfig)(this);
-        const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
-        if (this.__swc_syncing_init) {
-          if (options.connectedInitialize === true) {
-            const targets2 = resolveTargetEls(this, selector, options, currentWin);
-            applySetAttribute(this, targets2, attrName, nv);
-          } else {
-            this[privateKey] = nv;
+    try {
+      Object.defineProperty(target, propertyKey, {
+        get() {
+          const attrName = options.name || String(propertyKey);
+          const conf = (0, import_elementDefine.getElementConfig)(this);
+          const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
+          const targetType = options.type || designType;
+          const targets = resolveTargetEls(this, selector, options, currentWin);
+          const primaryTarget = targets[0];
+          if (primaryTarget && typeof primaryTarget.hasAttribute === "function") {
+            if (primaryTarget.hasAttribute(attrName)) {
+              const domVal = primaryTarget.getAttribute(attrName);
+              return convertValue(domVal, targetType);
+            }
+            return null;
           }
-          return;
-        }
-        if (!this.__swc_connected) {
-          this[privateKey] = nv;
-          return;
-        }
-        const targets = resolveTargetEls(this, selector, options, currentWin);
-        applySetAttribute(this, targets, attrName, nv);
-      },
-      enumerable: true,
-      configurable: true
-    });
+          return convertValue(this[privateKey], targetType);
+        },
+        set(nv) {
+          const attrName = options.name || String(propertyKey);
+          const conf = (0, import_elementDefine.getElementConfig)(this);
+          const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
+          const targets = resolveTargetEls(this, selector, options, currentWin);
+          applySetAttribute(this, targets, attrName, nv);
+        },
+        enumerable: true,
+        configurable: true
+      });
+    } catch (err) {
+      console.error("[SWC] defineProperty error:", err);
+    }
   };
 }
 function attributeHost(targetOrAttrOrOptions, propertyKeyOrOptions) {
@@ -169,6 +157,7 @@ function attributeHost(targetOrAttrOrOptions, propertyKeyOrOptions) {
   }
 }
 const findAllAttributeMetadata = (target) => {
-  return import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_FIELD_METADATA_KEY, target).flat();
+  const actualTarget = target instanceof Function ? target : target.constructor;
+  return import_core.ReflectUtils.findAllMetadata(ATTRIBUTE_FIELD_METADATA_KEY, actualTarget).flat();
 };
 //# sourceMappingURL=attribute.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/attribute.ts"],
-  "sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\n\nexport interface AttributeFieldOptions extends SwcQueryOptions {\n  name?: string;\n  connectedInitialize?: boolean;\n  type?: typeof Number | typeof Boolean | typeof String;\n}\n\nexport interface AttributeFieldMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  options: AttributeFieldOptions;\n  privateKey: symbol;\n}\n\nexport const ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for('simple-web-component:attribute-field');\n\nconst convertValue = (val: string | null, type: any): any => {\n  if (val === null || val === undefined) return val;\n  if (type === Number) return Number(val);\n  if (type === Boolean) return val === 'false' || val === '0' ? false : true;\n  return val;\n};\n\nexport const resolveTargetEls = (inst: any, selector: string, options: AttributeFieldOptions, currentWin: any): HTMLElement[] => {\n  const r = options.root || 'auto';\n  const results: HTMLElement[] = [];\n\n  const applyRoot = (target: any) => {\n    if (!target) return;\n    if (r === 'auto') {\n      results.push(target);\n    } else {\n      if (r === 'light' || r === 'all') results.push(target);\n      if ((r === 'shadow' || r === 'all') && target.shadowRoot) results.push(target.shadowRoot);\n    }\n  };\n\n  if (selector === ':host' || !selector) {\n    applyRoot(inst);\n  } else if (selector === ':window') {\n    results.push(currentWin);\n  } else if (selector === ':document') {\n    results.push(currentWin.document);\n  } else {\n    const hostSet = SwcUtils.getHostSet(inst);\n    if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n    else if (selector === ':appHost') applyRoot(hostSet.$appHost as any);\n    else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n    else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n    else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost as any);\n    else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost as any);\n    else {\n      if (r === 'shadow') {\n        const found = inst.shadowRoot?.querySelectorAll(selector);\n        if (found) results.push(...found);\n      } else if (r === 'light') {\n        const found = inst.querySelectorAll(selector);\n        if (found) results.push(...found);\n      } else if (r === 'all') {\n        const sMatch = inst.shadowRoot?.querySelectorAll(selector);\n        const lMatch = inst.querySelectorAll(selector);\n        if (sMatch) results.push(...sMatch);\n        if (lMatch) results.push(...lMatch);\n      } else {\n        const found = (inst.shadowRoot || inst).querySelectorAll(selector);\n        if (found) results.push(...found);\n      }\n    }\n  }\n  return results;\n};\n\n/**\n * @attribute decorator to sync a field value with an element's attribute.\n */\nexport function attribute(selector: string, options: AttributeFieldOptions = {}): PropertyDecorator {\n  return (target: Object, propertyKey: string | symbol) => {\n    const constructor = target.constructor;\n    const privateKey = Symbol(String(propertyKey));\n\n    const designType = (Reflect as any).getMetadata('design:type', target, propertyKey);\n\n    let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_FIELD_METADATA_KEY, constructor) as AttributeFieldMetadata[];\n    if (!metaList) {\n      metaList = [];\n      ReflectUtils.defineMetadata(ATTRIBUTE_FIELD_METADATA_KEY, metaList, constructor);\n    }\n    metaList.push({propertyKey, selector, options, privateKey});\n\n    const applySetAttribute = (inst: any, targets: HTMLElement[], attrName: string, nv: any) => {\n      targets.forEach(it => {\n        if (it && typeof (it as any).setAttribute === 'function') {\n          if (nv === null) {\n            (it as any).removeAttribute(attrName);\n          } else {\n            (it as any).setAttribute(attrName, String(nv));\n          }\n        } else {\n          inst[privateKey] = nv;\n        }\n      });\n    };\n\n    Object.defineProperty(target, propertyKey, {\n      get(this: any) {\n        const attrName = options.name || String(propertyKey);\n        const conf = getElementConfig(this);\n        const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n        const targetType = options.type || designType;\n\n        if (this.__swc_syncing_init || (options.connectedInitialize && !this.__swc_connected)) {\n          return convertValue(this[privateKey], targetType);\n        }\n\n        const targets = resolveTargetEls(this, selector, options, currentWin);\n        const primaryTarget = targets[0];\n\n        if (primaryTarget && typeof (primaryTarget as any).hasAttribute === 'function') {\n          if ((primaryTarget as any).hasAttribute(attrName)) {\n            const domVal = (primaryTarget as any).getAttribute(attrName);\n            return convertValue(domVal, targetType);\n          }\n          return null;\n        }\n\n        return convertValue(this[privateKey], targetType);\n      },\n      set(this: any, nv: any) {\n        const attrName = options.name || String(propertyKey);\n        const conf = getElementConfig(this);\n        const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n\n        if (this.__swc_syncing_init) {\n          if (options.connectedInitialize === true) {\n            const targets = resolveTargetEls(this, selector, options, currentWin);\n            applySetAttribute(this, targets, attrName, nv);\n          } else {\n            this[privateKey] = nv;\n          }\n          return;\n        }\n\n        if (!this.__swc_connected) {\n          this[privateKey] = nv;\n          return;\n        }\n\n        const targets = resolveTargetEls(this, selector, options, currentWin);\n        applySetAttribute(this, targets, attrName, nv);\n      },\n      enumerable: true,\n      configurable: true\n    });\n  };\n}\n\n/**\n * @attributeHost decorator to sync a field value with the :host element's attribute.\n */\nexport function attributeHost(target: Object, propertyKey: string | symbol): void;\nexport function attributeHost(options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(attrName: string): PropertyDecorator;\nexport function attributeHost(attrName: string, options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(targetOrAttrOrOptions?: any, propertyKeyOrOptions?: any): any {\n  if (propertyKeyOrOptions !== undefined && (typeof propertyKeyOrOptions === 'string' || typeof propertyKeyOrOptions === 'symbol')) {\n    return attribute(':host', { name: String(propertyKeyOrOptions) })(targetOrAttrOrOptions, propertyKeyOrOptions);\n  }\n\n  if (typeof targetOrAttrOrOptions === 'string') {\n    const attrName = targetOrAttrOrOptions;\n    const options = (typeof propertyKeyOrOptions === 'object' ? propertyKeyOrOptions : {}) as AttributeFieldOptions;\n    return attribute(':host', { ...options, name: attrName });\n  } else if (typeof targetOrAttrOrOptions === 'object') {\n    const options = targetOrAttrOrOptions as AttributeFieldOptions;\n    return (target: Object, propertyKey: string | symbol) => {\n      return attribute(':host', { ...options, name: String(propertyKey) })(target, propertyKey);\n    };\n  } else {\n    return (target: Object, propertyKey: string | symbol) => {\n      return attribute(':host', { name: String(propertyKey) })(target, propertyKey);\n    };\n  }\n}\n\nexport const findAllAttributeMetadata = (target: any): AttributeFieldMetadata[] => {\n  return ReflectUtils.findAllMetadata<AttributeFieldMetadata[]>(ATTRIBUTE_FIELD_METADATA_KEY, target).flat();\n};\n"],
-  "mappings": "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",
-  "names": ["targets"]
+  "sourcesContent": ["import {ReflectUtils} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\nexport interface AttributeFieldOptions extends SwcQueryOptions {\n  name?: string;\n  // connectedInitialize?: boolean;\n  type?: typeof Number | typeof Boolean | typeof String;\n}\n\nexport interface AttributeFieldMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  options: AttributeFieldOptions;\n  privateKey: symbol;\n}\n\nexport const ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for('simple-web-component:attribute-field');\n\nconst convertValue = (val: string | null, type: any): any => {\n  if (val === null || val === undefined) return val;\n  if (type === Number) return Number(val);\n  if (type === Boolean) return val === 'false' || val === '0' ? false : true;\n  return val;\n};\n\nexport const resolveTargetEls = (inst: any, selector: string, options: AttributeFieldOptions, currentWin: any): HTMLElement[] => {\n  const r = options.root || 'auto';\n  const results: HTMLElement[] = [];\n\n  const applyRoot = (target: any) => {\n    if (!target) return;\n    if (r === 'auto') {\n      results.push(target);\n    } else {\n      if (r === 'light' || r === 'all') results.push(target);\n      if ((r === 'shadow' || r === 'all') && target.shadowRoot) results.push(target.shadowRoot);\n    }\n  };\n\n  if (selector === ':host' || !selector) {\n    applyRoot(inst);\n  } else if (selector === ':window') {\n    results.push(currentWin);\n  } else if (selector === ':document') {\n    results.push(currentWin.document);\n  } else {\n    const hostSet = SwcUtils.getHostSet(inst);\n    if (selector === ':parentHost') applyRoot(hostSet.$parentHost);\n    else if (selector === ':appHost') applyRoot(hostSet.$appHost as any);\n    else if (selector === ':firstHost') applyRoot(hostSet.$firstHost);\n    else if (selector === ':lastHost') applyRoot(hostSet.$lastHost);\n    else if (selector === ':firstAppHost') applyRoot(hostSet.$firstAppHost as any);\n    else if (selector === ':lastAppHost') applyRoot(hostSet.$lastAppHost as any);\n    else {\n      if (r === 'shadow') {\n        const found = inst.shadowRoot?.querySelectorAll(selector);\n        if (found) results.push(...found);\n      } else if (r === 'light') {\n        const found = inst.querySelectorAll(selector);\n        if (found) results.push(...found);\n      } else if (r === 'all') {\n        const sMatch = inst.shadowRoot?.querySelectorAll(selector);\n        const lMatch = inst.querySelectorAll(selector);\n        if (sMatch) results.push(...sMatch);\n        if (lMatch) results.push(...lMatch);\n      } else {\n        const found = (inst.shadowRoot || inst).querySelectorAll(selector);\n        if (found) results.push(...found);\n      }\n    }\n  }\n  return results;\n};\n\n/**\n * @attribute decorator to sync a field value with an element's attribute.\n */\nexport function attribute(selector: string, options: AttributeFieldOptions = {}): PropertyDecorator {\n  return (target: Object, propertyKey: string | symbol) => {\n    const constructor = target.constructor;\n    const privateKey = Symbol(String(propertyKey));\n    //\n    const designType = (Reflect as any).getMetadata('design:type', target, propertyKey);\n    //\n    let metaList = ReflectUtils.getOwnMetadata(ATTRIBUTE_FIELD_METADATA_KEY, constructor) as AttributeFieldMetadata[];\n    if (!metaList) {\n      metaList = [];\n      ReflectUtils.defineMetadata(ATTRIBUTE_FIELD_METADATA_KEY, metaList, constructor);\n    }\n    metaList.push({propertyKey, selector, options, privateKey});\n\n    const applySetAttribute = (inst: any, targets: HTMLElement[], attrName: string, nv: any) => {\n      targets.forEach(it => {\n        if (it && typeof (it as any).setAttribute === 'function') {\n          if (nv === null) {\n            (it as any).removeAttribute(attrName);\n          } else {\n            (it as any).setAttribute(attrName, String(nv));\n          }\n        } else {\n          inst[privateKey] = nv;\n        }\n      });\n    };\n\n    try {\n      // Own property\uB97C \uC0AD\uC81C\uD558\uC5EC getter\uAC00 \uC791\uB3D9\uD558\uB3C4\uB85D \uD568\n      // delete target[propertyKey];\n\n      // const defineTarget = target instanceof Function ? target : (target as any).constructor;\n      \n      Object.defineProperty(target, propertyKey, {\n        get(this: any) {\n          // try {\n            const attrName = options.name || String(propertyKey);\n            const conf = getElementConfig(this);\n            const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n            const targetType = options.type || designType;\n          //\n            // connectedInitialize: true\uC774\uBA74 privateKey \uAC12\uB9CC \uBC18\uD658 (DOM \uBB34\uC2DC)\n            // if (options.connectedInitialize === true && (this as any).__swc_syncing_init) {\n            //   console.log('cccccccc2');\n            //   return this[privateKey];\n            //   // return convertValue(this[privateKey], targetType);\n            // }\n\n            const targets = resolveTargetEls(this, selector, options, currentWin);\n            const primaryTarget = targets[0];\n\n            if (primaryTarget && typeof (primaryTarget as any).hasAttribute === 'function') {\n              if ((primaryTarget as any).hasAttribute(attrName)) {\n                const domVal = (primaryTarget as any).getAttribute(attrName);\n                return convertValue(domVal, targetType);\n              }\n              return null;\n            }\n\n            return convertValue(this[privateKey], targetType);\n          // } catch (err) {\n          //   console.error('Error in getter:', err);\n          //   throw err;\n          // }\n        },\n        set(this: any, nv: any) {\n          // this[propertyKey] = nv;\n          const attrName = options.name || String(propertyKey);\n          const conf = getElementConfig(this);\n          const currentWin = this._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as any);\n\n\n          // if (!this.__swc_connected) {\n          //   this[privateKey] = nv;\n          //   return;\n          // }\n\n          const targets = resolveTargetEls(this, selector, options, currentWin);\n          applySetAttribute(this, targets, attrName, nv);\n        },\n        enumerable: true,\n        configurable: true\n      });\n  } catch (err) {\n    console.error('[SWC] defineProperty error:', err);\n  }\n  };\n}\n\n/**\n * @attributeHost decorator to sync a field value with the :host element's attribute.\n */\nexport function attributeHost(target: Object, propertyKey: string | symbol): void;\nexport function attributeHost(options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(attrName: string): PropertyDecorator;\nexport function attributeHost(attrName: string, options: AttributeFieldOptions): PropertyDecorator;\nexport function attributeHost(targetOrAttrOrOptions?: any, propertyKeyOrOptions?: any): any {\n  if (propertyKeyOrOptions !== undefined && (typeof propertyKeyOrOptions === 'string' || typeof propertyKeyOrOptions === 'symbol')) {\n    return attribute(':host', { name: String(propertyKeyOrOptions) })(targetOrAttrOrOptions, propertyKeyOrOptions);\n  }\n\n  if (typeof targetOrAttrOrOptions === 'string') {\n    const attrName = targetOrAttrOrOptions;\n    const options = (typeof propertyKeyOrOptions === 'object' ? propertyKeyOrOptions : {}) as AttributeFieldOptions;\n    return attribute(':host', { ...options, name: attrName });\n  } else if (typeof targetOrAttrOrOptions === 'object') {\n    const options = targetOrAttrOrOptions as AttributeFieldOptions;\n    return (target: Object, propertyKey: string | symbol) => {\n      return attribute(':host', { ...options, name: String(propertyKey) })(target, propertyKey);\n    };\n  } else {\n    return (target: Object, propertyKey: string | symbol) => {\n      return attribute(':host', { name: String(propertyKey) })(target, propertyKey);\n    };\n  }\n}\n\nexport const findAllAttributeMetadata = (target: any): AttributeFieldMetadata[] => {\n  const actualTarget = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.findAllMetadata<AttributeFieldMetadata[]>(ATTRIBUTE_FIELD_METADATA_KEY, actualTarget).flat();\n};\n"],
+  "mappings": "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",
+  "names": []
 }

package/dist/cjs/decorators/elementDefine.js

@@ -31,6 +31,8 @@ var import_emitCustomEvent = require("./emitCustomEvent");
 var import_changedAttributeHost = require("./changedAttributeHost");
 var import_applyAttribute = require("./applyAttribute");
 var import_attribute = require("./attribute");
+var import_query = require("./query");
+var import_queryAll = require("./queryAll");
 var import_Utils = require("../utils/Utils");
 var import_config = require("../config/config");
 var import_Inject = require("@dooboostore/simple-boot/decorators/inject/Inject");
@@ -46,9 +48,26 @@ const ensureInit = (inst) => {
     inst._emitHandlers = /* @__PURE__ */ new Map();
     inst._boundListeners = [];
     inst.__swc_initialized = true;
+    const target = inst instanceof Function ? inst : inst.constructor;
+    const attributeList = (0, import_attribute.findAllAttributeMetadata)(target);
+    attributeList.forEach((meta) => {
+      delete inst[meta.propertyKey];
+    });
+    const queryList = (0, import_query.getQueryMetadata)(target);
+    if (queryList) {
+      queryList.forEach((meta) => {
+        delete inst[meta.propertyKey];
+      });
+    }
+    const queryAllList = (0, import_queryAll.getQueryAllMetadata)(target);
+    if (queryAllList) {
+      queryAllList.forEach((meta) => {
+        delete inst[meta.propertyKey];
+      });
+    }
     const hostSet = import_Utils.SwcUtils.getHostSet(inst);
     inst._executeSwcScript?.("swc-on-constructor", hostSet);
-    const cMethods = (0, import_lifecycles.findAllLifecycleMetadata)(inst, import_lifecycles.ON_CONSTRUCTOR_METADATA_KEY);
+    const cMethods = (0, import_lifecycles.findAllLifecycleMetadata)(inst, import_lifecycles.ON_INITIALIZE_METADATA_KEY);
     if (cMethods) {
       for (const m of cMethods) inst._invokeLifecycleMethod(m, hostSet);
     }
@@ -215,12 +234,12 @@ const elementDefine = (name, config = {}) => (constructor) => {
   const swcLifecycleAttributes = ["swc-on-constructor", "swc-on-connected", "swc-on-disconnected", "swc-on-before-connected", "swc-on-after-connected", "swc-on-before-disconnected", "swc-on-after-disconnected", "swc-on-before-adopted", "swc-on-after-adopted", "swc-on-attribute-changed"];
   const swcOnEvents = import_config.DOM_EVENT_NAMES.map((e) => `swc-on-${e}`);
   const attributeApplyNames = Array.from(applyAttributeMap.values()).map((it) => it.options.name).filter(Boolean);
-  const attributeListNames = attributeList.map((it) => it.options.name || String(it.propertyKey));
+  const hostAttributes = attributeList.filter((it) => it.selector === ":host").map((it) => it.options.name || String(it.propertyKey));
   const mergedObservedAttributes = [.../* @__PURE__ */ new Set([
     ...metadata.observedAttributes ?? [],
     ...attrChangeMap.keys(),
     ...attributeApplyNames,
-    ...attributeListNames,
+    ...hostAttributes,
     ...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean),
     ...swcLifecycleAttributes,
     ...swcOnEvents
@@ -231,30 +250,18 @@ const elementDefine = (name, config = {}) => (constructor) => {
   const originalConnected = proto.connectedCallback;
   proto.connectedCallback = function() {
     ensureInit(this);
+    const hostSet = import_Utils.SwcUtils.getHostSet(this);
+    const appHost = hostSet.$appHost;
+    const conf = getElementConfig(this);
+    const currentWin = this._resolveWindow(conf);
     if (connectedInnerHtmlList.some((it) => it.options.useShadow === true) && !this.shadowRoot) {
       this.attachShadow({ mode: "open" });
     }
-    const conf = getElementConfig(this);
-    const currentWin = this._resolveWindow(conf);
-    const hostSet = import_Utils.SwcUtils.getHostSet(this);
     this._executeSwcScript("swc-on-before-connected", hostSet);
     const bMethods = (0, import_lifecycles.findAllLifecycleMetadata)(this, import_lifecycles.ON_BEFORE_CONNECTED_METADATA_KEY);
     if (bMethods) {
       for (const m of bMethods) this._invokeLifecycleMethod(m, hostSet);
     }
-    attributeList.forEach((meta) => {
-      if (meta.options.connectedInitialize === true) {
-        this.__swc_syncing_init = true;
-        try {
-          const memoryVal = this[meta.privateKey];
-          if (memoryVal !== void 0) {
-            this[meta.propertyKey] = memoryVal;
-          }
-        } finally {
-          this.__swc_syncing_init = false;
-        }
-      }
-    });
     if (connectedInnerHtmlList.length > 0) {
       let sContent = "", lContent = "";
       for (const meta of connectedInnerHtmlList) {
@@ -390,6 +397,9 @@ const elementDefine = (name, config = {}) => (constructor) => {
     this._executeSwcScript("swc-on-connected", hostSet);
     this._executeSwcScript("swc-on-after-connected", hostSet);
     this.__swc_connected = true;
+    if (appHost && typeof appHost._connected === "function") {
+      appHost._connected(this);
+    }
   };
   const originalDisconnected = proto.disconnectedCallback;
   proto.disconnectedCallback = function() {
@@ -411,6 +421,10 @@ const elementDefine = (name, config = {}) => (constructor) => {
     this._executeSwcScript("swc-on-disconnected", hostSet);
     this._executeSwcScript("swc-on-after-disconnected", hostSet);
     this.__swc_connected = false;
+    const appHost = hostSet.$appHost;
+    if (appHost && typeof appHost._disconnected === "function") {
+      appHost._disconnected(this);
+    }
   };
   const originalAdopted = proto.adoptedCallback;
   proto.adoptedCallback = function() {