@dooboostore/simple-web-component 1.0.30 → 1.0.32

package/README.md

@@ -247,7 +247,226 @@ onAppReady(router: Router) {
 }
 ```
 
-### 8. **Declarative Routing with swc-choose**
+### 8. **Structural Directives**
+
+Structural Directives allow declarative conditional rendering, list iteration, async handling, and routing with automatic attribute substitution and dynamic expressions.
+
+#### 8.1 **SwcChoose - Multi-Condition Rendering**
+
+Switch-case style conditional rendering with `swc-when` and `swc-otherwise` sub-templates.
+
+```typescript
+// Component with conditional rendering logic
+@elementDefine('status-display')
+class StatusDisplay extends HTMLElement {
+  @attributeHost('status')
+  status: string = 'pending';
+
+  @setProperty('#status-template', 'value')
+  getStatus() {
+    return this.status;
+  }
+
+  @onConnectedInnerHtml
+  render() {
+    return `
+      <template id="status-template" is="swc-choose">
+        <!-- Pending State -->
+        <template is="swc-when" value="{{ $value === 'pending' }}">
+          <div style="color: orange;">⏳ Processing...</div>
+        </template>
+        
+        <!-- Success State -->
+        <template is="swc-when" value="{{ $value === 'success' }}">
+          <div style="color: green;">✓ Completed</div>
+        </template>
+        
+        <!-- Error State -->
+        <template is="swc-when" value="{{ $value === 'error' }}">
+          <div style="color: red;">✗ Failed</div>
+        </template>
+        
+        <!-- Fallback -->
+        <template is="swc-otherwise">
+          <div style="color: gray;">Unknown status</div>
+        </template>
+      </template>
+    `;
+  }
+}
+```
+
+**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: `attribute-name="{{ expression }}"` automatically evaluated
+
+---
+
+#### 8.2 **SwcIf - Binary Conditional**
+
+If-then-else rendering with optional `swc-default` fallback.
+
+```typescript
+@elementDefine('user-profile')
+class UserProfile extends HTMLElement {
+  private isLoggedIn = false;
+
+  @setProperty('#content', 'value')
+  checkAuth() {
+    return this.isLoggedIn;
+  }
+
+  @onConnectedInnerHtml
+  render() {
+    return `
+      <!-- True condition: renders main template -->
+      <template id="content" is="swc-if" value="{{ $host.isLoggedIn }}">
+        <div>
+          <h2>Welcome, {{ $host.userName }}</h2>
+          <button on-click="logout">Logout</button>
+        </div>
+        
+        <!-- Fallback template: renders if condition is false -->
+        <template is="swc-default">
+          <div>
+            <p>Please log in</p>
+            <button on-click="login">Login</button>
+          </div>
+        </template>
+      </template>
+    `;
+  }
+}
+```
+
+**Features:**
+- Binary true/false logic
+- Main template renders when `value` is truthy
+- `swc-default` sub-template renders when value is falsy
+- Dynamic attribute substitution supported
+- Access `$host`, `$value`, and other context variables
+
+---
+
+#### 8.3 **SwcAsync - Promise/Loading State**
+
+Automatically handle async operations with loading, success, and error states.
+
+```typescript
+@elementDefine('data-loader')
+class DataLoader extends HTMLElement {
+  private data: any = null;
+
+  async fetchData() {
+    return new Promise((resolve, reject) => {
+      setTimeout(() => {
+        resolve({ id: 1, name: 'Sample Data' });
+      }, 2000);
+    });
+  }
+
+  @setProperty('#async-content', 'value')
+  loadData() {
+    return this.fetchData();
+  }
+
+  @onConnectedInnerHtml
+  render() {
+    return `
+      <template id="async-content" is="swc-async" value="{{ $host.fetchData() }}">
+        <!-- Loading State: Shows while Promise is pending -->
+        <template is="swc-loading">
+          <div>🔄 Loading data...</div>
+        </template>
+        
+        <!-- Success State: Shows when Promise resolves -->
+        <template is="swc-success">
+          <div>
+            <p>Data ID: {{ $value.id }}</p>
+            <p>Data Name: {{ $value.name }}</p>
+          </div>
+        </template>
+        
+        <!-- Error State: Shows if Promise rejects -->
+        <template is="swc-error">
+          <div style="color: red;">❌ Failed to load data</div>
+        </template>
+      </template>
+    `;
+  }
+}
+```
+
+**Features:**
+- Automatically manages Promise lifecycle
+- `swc-loading` - displays during pending state
+- `swc-success` - displays on successful resolution, `$value` contains result
+- `swc-error` - displays on Promise rejection
+- Dynamic attribute substitution in all states
+- `on-clone-node` and `on-clone-nodes` callbacks for DOM manipulation
+
+---
+
+#### 8.4 **SwcLoop - List Rendering**
+
+Iterate over arrays and render templates for each item.
+
+```typescript
+@elementDefine('product-list')
+class ProductList extends HTMLElement {
+  private products = [
+    { id: 1, name: 'Laptop', price: 1200 },
+    { id: 2, name: 'Phone', price: 800 },
+    { id: 3, name: 'Tablet', price: 500 }
+  ];
+
+  @setProperty('#products-list', 'value')
+  getProducts() {
+    return this.products;
+  }
+
+  @onConnectedInnerHtml
+  render() {
+    return `
+      <template id="products-list" is="swc-loop" value="{{ $host.products }}">
+        <div style="margin: 10px; padding: 10px; border: 1px solid #ddd;">
+          <h3>{{ $item.name }}</h3>
+          <p>Price: ${{ $item.price }}</p>
+          <p>ID: {{ $item.id }} (Index: {{ $index }})</p>
+          <button data-id="{{ $item.id }}">Add to Cart</button>
+        </div>
+        
+        <!-- Empty fallback: renders when array is empty -->
+        <template is="swc-default">
+          <p>No products available</p>
+        </template>
+      </template>
+    `;
+  }
+}
+```
+
+**Context variables:**
+- `$item` - current item in iteration
+- `$index` - zero-based index
+- `$value` - entire array
+- `$nodes` - cloned DOM nodes
+- `$elements` - cloned HTML elements
+- `$firstElement` - first element in cloned nodes
+
+**Features:**
+- Efficient DOM cloning for each item
+- `swc-default` fallback renders when array is empty
+- All cloned attributes support `{{ }}` substitution
+- `on-clone-node` callback fires for each cloned node
+- `on-clone-nodes` callback fires after all nodes cloned
+
+---
+
+#### 8.5 **Declarative Routing with swc-choose**
+
 Combine `@subscribeSwcAppRouteChange` with `swc-choose` for clean, declarative routing without boilerplate.
 
 ```typescript

package/dist/cjs/decorators/applyStyle.js

@@ -50,7 +50,7 @@ function createStyleDecorator(action) {
         if (res !== void 0) {
           const win = this.ownerDocument?.defaultView || window;
           const host = this;
-          const hostSet = { ...import_Utils.SwcUtils.getHelperAndHostSet(win, host), $this: this };
+          const hostSet = import_Utils.SwcUtils.getHelperAndHostSet(win, host);
           const r = options.root || "auto";
           const targetEls = [];
           const applyRoot = (t) => {

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/applyStyle.ts"],
-  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit } from './elementDefine';\nimport { SwcUtils } from '../utils/Utils';\nimport { SwcQueryOptions, HelperHostSet } from '../types';\n\nexport type StyleAction = 'set' | 'update' | 'remove';\n\nexport interface StyleApplyOptions extends SwcQueryOptions {}\n\nexport interface StyleApplyMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  action: StyleAction;\n  options: StyleApplyOptions;\n}\n\nexport const STYLE_METADATA_KEY = Symbol.for('simple-web-component:style');\n\nfunction createStyleDecorator(action: StyleAction) {\n  return (selector: string, options: StyleApplyOptions = {}): MethodDecorator => {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n      const constructor = target.constructor;\n      let metaList = ReflectUtils.getOwnMetadata(STYLE_METADATA_KEY, constructor) as Map<string | symbol, StyleApplyMetadata>;\n      if (!metaList) {\n        metaList = new Map<string | symbol, StyleApplyMetadata>();\n        ReflectUtils.defineMetadata(STYLE_METADATA_KEY, metaList, constructor);\n      }\n      metaList.set(propertyKey, { propertyKey, selector, action, options });\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 = options.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 (action === 'set') targetEl.style.cssText = '';\n              \n              if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n                  const finalVal = typeof val === 'function' ? val(targetEl, hostSet) : val;\n                  if (finalVal === null || finalVal === undefined) {\n                    targetEl.style.removeProperty(prop);\n                  } else {\n                    targetEl.style[prop as any] = String(finalVal);\n                  }\n                });\n              } else if (typeof resolvedRes === 'string') {\n                targetEl.style.cssText = resolvedRes;\n              }\n            } else if (action === 'remove') {\n              if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n                  const shouldRemove = typeof val === 'function' ? val(targetEl, hostSet) : !!val;\n                  if (shouldRemove) {\n                    targetEl.style.removeProperty(prop);\n                  }\n                });\n              } else {\n                const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];\n                props.forEach(p => targetEl.style.removeProperty(String(p)));\n              }\n            }\n          });\n        }\n        return res;\n      };\n      return descriptor;\n    };\n  };\n}\n\nexport function applyStyle(selector: string, action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n  return createStyleDecorator(action)(selector, options);\n}\n\nexport const setStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('set')(selector, options);\nexport const updateStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('update')(selector, options);\nexport const removeStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('remove')(selector, options);\n\n// Host versions\nexport function applyStyleHost(action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n  return createStyleDecorator(action)(':host', options);\n}\nexport const setStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('set')(':host', options);\nexport const updateStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('update')(':host', options);\nexport const removeStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('remove')(':host', options);\n\nexport const findAllStyleMetadata = (target: any): Map<string | symbol, StyleApplyMetadata> => {\n  const result = new Map<string | symbol, StyleApplyMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, StyleApplyMetadata>>(STYLE_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 StyleAction = 'set' | 'update' | 'remove';\n\nexport interface StyleApplyOptions extends SwcQueryOptions {}\n\nexport interface StyleApplyMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  action: StyleAction;\n  options: StyleApplyOptions;\n}\n\nexport const STYLE_METADATA_KEY = Symbol.for('simple-web-component:style');\n\nfunction createStyleDecorator(action: StyleAction) {\n  return (selector: string, options: StyleApplyOptions = {}): MethodDecorator => {\n    return (target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n      const constructor = target.constructor;\n      let metaList = ReflectUtils.getOwnMetadata(STYLE_METADATA_KEY, constructor) as Map<string | symbol, StyleApplyMetadata>;\n      if (!metaList) {\n        metaList = new Map<string | symbol, StyleApplyMetadata>();\n        ReflectUtils.defineMetadata(STYLE_METADATA_KEY, metaList, constructor);\n      }\n      metaList.set(propertyKey, { propertyKey, selector, action, options });\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);\n          const r = options.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 (action === 'set') targetEl.style.cssText = '';\n              \n              if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n                  const finalVal = typeof val === 'function' ? val(targetEl, hostSet) : val;\n                  if (finalVal === null || finalVal === undefined) {\n                    targetEl.style.removeProperty(prop);\n                  } else {\n                    targetEl.style[prop as any] = String(finalVal);\n                  }\n                });\n              } else if (typeof resolvedRes === 'string') {\n                targetEl.style.cssText = resolvedRes;\n              }\n            } else if (action === 'remove') {\n              if (typeof resolvedRes === 'object' && resolvedRes !== null && !Array.isArray(resolvedRes)) {\n                Object.entries(resolvedRes as any).forEach(([prop, val]) => {\n                  const shouldRemove = typeof val === 'function' ? val(targetEl, hostSet) : !!val;\n                  if (shouldRemove) {\n                    targetEl.style.removeProperty(prop);\n                  }\n                });\n              } else {\n                const props = Array.isArray(resolvedRes) ? resolvedRes : [resolvedRes];\n                props.forEach(p => targetEl.style.removeProperty(String(p)));\n              }\n            }\n          });\n        }\n        return res;\n      };\n      return descriptor;\n    };\n  };\n}\n\nexport function applyStyle(selector: string, action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n  return createStyleDecorator(action)(selector, options);\n}\n\nexport const setStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('set')(selector, options);\nexport const updateStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('update')(selector, options);\nexport const removeStyle = (selector: string, options: StyleApplyOptions = {}) => createStyleDecorator('remove')(selector, options);\n\n// Host versions\nexport function applyStyleHost(action: StyleAction = 'update', options: StyleApplyOptions = {}): MethodDecorator {\n  return createStyleDecorator(action)(':host', options);\n}\nexport const setStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('set')(':host', options);\nexport const updateStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('update')(':host', options);\nexport const removeStyleHost = (options: StyleApplyOptions = {}) => createStyleDecorator('remove')(':host', options);\n\nexport const findAllStyleMetadata = (target: any): Map<string | symbol, StyleApplyMetadata> => {\n  const result = new Map<string | symbol, StyleApplyMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, StyleApplyMetadata>>(STYLE_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/attribute.js

@@ -27,6 +27,7 @@ module.exports = __toCommonJS(attribute_exports);
 var import_core = require("@dooboostore/core");
 var import_elementDefine = require("./elementDefine");
 var import_Utils = require("../utils/Utils");
+var import_core_web = require("@dooboostore/core-web");
 const ATTRIBUTE_FIELD_METADATA_KEY = Symbol.for("simple-web-component:attribute-field");
 const convertValue = (val, type) => {
   if (val === null || val === void 0) return val;
@@ -115,7 +116,22 @@ function attribute(selector, options = {}) {
           const primaryTarget = targets[0];
           if (primaryTarget && typeof primaryTarget.hasAttribute === "function") {
             if (primaryTarget.hasAttribute(attrName)) {
-              const domVal = primaryTarget.getAttribute(attrName);
+              let domVal = primaryTarget.getAttribute(attrName);
+              const ae = new import_core.ActionExpression(domVal);
+              const expr = ae.getFirstExpression("call-return");
+              if (expr) {
+                try {
+                  const result = import_core.FunctionUtils.executeReturn({
+                    script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, currentWin.document),
+                    context: this,
+                    args: import_Utils.SwcUtils.getHelperAndHostSet(currentWin, this)
+                  });
+                  return convertValue(result, targetType);
+                } catch (e) {
+                  console.error(`[SWC] Failed to execute directive {{= ${expr.script} }}:`, e);
+                  return convertValue(domVal, targetType);
+                }
+              }
               return convertValue(domVal, targetType);
             }
             return null;

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';\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        // console.log('sssssssssssss', it, attrName, nv);\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          // console.log('------>??gettttt', this,  propertyKey);\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            const data =  convertValue(this[privateKey], targetType);\n          // console.log('get rrr', data);\n            return data;\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          // console.log('------>??settttt', this, nv, propertyKey);\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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",
+  "sourcesContent": ["import {ReflectUtils, FunctionUtils, ActionExpression} from '@dooboostore/core';\nimport {ensureInit, getElementConfig} from './elementDefine';\nimport {SwcUtils} from '../utils/Utils';\nimport {SpecialSelector, SwcQueryOptions} from '../types';\nimport { ConvertUtils } from '@dooboostore/core-web';\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        // console.log('sssssssssssss', it, attrName, nv);\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          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          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              let domVal = (primaryTarget as any).getAttribute(attrName);\n              \n              // \uD45C\uD604\uC2DD \uCCB4\uD06C\n              const ae = new ActionExpression(domVal);\n              const expr = ae.getFirstExpression('call-return');\n              if (expr) {\n                try {\n                  const result = FunctionUtils.executeReturn({\n                    script: ConvertUtils.decodeHtmlEntity(expr.script, currentWin.document),\n                    context: this,\n                    args: SwcUtils.getHelperAndHostSet(currentWin, this)\n                  });\n                  return convertValue(result, targetType);\n                } catch (e) {\n                  console.error(`[SWC] Failed to execute directive {{= ${expr.script} }}:`, e);\n                  return convertValue(domVal, targetType);\n                }\n              }\n              \n              return convertValue(domVal, targetType);\n            }\n            return null;\n          }\n\n          const data = convertValue(this[privateKey], targetType);\n          return data;\n        },\n        set(this: any, nv: any) {\n          // this[propertyKey] = nv;\n          // console.log('------>??settttt', this, nv, propertyKey);\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

@@ -24,7 +24,6 @@ __export(elementDefine_exports, {
 });
 module.exports = __toCommonJS(elementDefine_exports);
 var import_core = require("@dooboostore/core");
-var import_core2 = require("@dooboostore/core");
 var import_addEventListener = require("./addEventListener");
 var import_lifecycles = require("./lifecycles");
 var import_emitCustomEvent = require("./emitCustomEvent");
@@ -37,6 +36,7 @@ var import_Utils = require("../utils/Utils");
 var import_config = require("../config/config");
 var import_Inject = require("@dooboostore/simple-boot/decorators/inject/Inject");
 var import_types = require("../types");
+var import_core_web = require("@dooboostore/core-web");
 const ELEMENT_CONFIG_KEY = Symbol.for("simple-web-component:element-config");
 const getElementConfig = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
@@ -119,7 +119,7 @@ const setupPrototype = (proto) => {
         const currentWin = this._resolveWindow(conf);
         const helpers = import_Utils.SwcUtils.getHelperSet(currentWin);
         const args = { ...hostSet, ...helpers, ...extraArgs, $el: this, $root: this.getRootNode() };
-        import_core2.FunctionUtils.execute({ script, context: this, args });
+        import_core.FunctionUtils.execute({ script, context: this, args });
       } catch (e) {
         console.error(`[SWC] Failed to execute ${attrName}:`, e);
       }
@@ -139,12 +139,12 @@ const setupPrototype = (proto) => {
     ensureInit(this);
     if (typeof this[methodName] !== "function") return;
     const useHostSet = hostSet ?? import_Utils.SwcUtils.getHostSet(this);
-    const app = useHostSet?.$appHost.simpleApplication;
+    const app = useHostSet?.$appHost?.simpleApplication;
     if (app) {
       const otherStorage = /* @__PURE__ */ new Map();
       const situations = new import_Inject.SituationTypeContainers([new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.HOST_SET, data: useHostSet }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.APP_HOST, data: useHostSet.$appHost }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.APP_HOSTS, data: useHostSet.$appHosts }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.HOST, data: useHostSet.$host }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.HOSTS, data: useHostSet.$hosts }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.FIRST_HOST, data: useHostSet.$firstHost }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.LAST_HOST, data: useHostSet.$lastHost }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.FIRST_APP_HOST, data: useHostSet.$firstAppHost }), new import_Inject.SituationTypeContainer({ situationType: import_types.InjectSituationType.LAST_APP_HOST, data: useHostSet.$lastAppHost })]);
       otherStorage.set(import_Inject.SituationTypeContainers, situations);
-      return app.simstanceManager.executeBindParameterSimPromise(
+      return app.simstanceManager.executeBindParameterSim(
         {
           target: this,
           targetKey: methodName,
@@ -171,8 +171,7 @@ const setupPrototype = (proto) => {
     const oldHandler = handlers.get(attrName);
     if (oldHandler) el.removeEventListener(eventName, oldHandler);
     const handler = async (event) => {
-      const parent = import_Utils.SwcUtils.findNearestSwcHost(el);
-      const hostSet = import_Utils.SwcUtils.getHostSet(parent || el);
+      const hostSet = import_Utils.SwcUtils.getHostSet(el);
       const conf = getElementConfig(this);
       const currentWin = this._resolveWindow(conf);
       const helpers = import_Utils.SwcUtils.getHelperSet(currentWin);
@@ -184,15 +183,14 @@ const setupPrototype = (proto) => {
         $el: el,
         $root: this.getRootNode()
       };
-      await import_core2.FunctionUtils.execute({ script, context: el, args });
+      await import_core.FunctionUtils.execute({ script, context: el, args });
     };
     el.addEventListener(eventName, handler);
     handlers.set(attrName, handler);
   };
   proto.__swc_executeAttributeEvent = async function(el, attrName, script, event) {
     ensureInit(this);
-    const parent = import_Utils.SwcUtils.findNearestSwcHost(el);
-    const hostSet = import_Utils.SwcUtils.getHostSet(parent || el);
+    const hostSet = import_Utils.SwcUtils.getHostSet(el);
     const conf = getElementConfig(this);
     const currentWin = this._resolveWindow(conf);
     const currentHelpers = import_Utils.SwcUtils.getHelperSet(currentWin);
@@ -207,7 +205,7 @@ const setupPrototype = (proto) => {
       $el: el,
       $root: this.getRootNode()
     };
-    await import_core2.FunctionUtils.execute({ script, context: el, args });
+    await import_core.FunctionUtils.execute({ script, context: el, args });
   };
 };
 const elementDefine = (name, config = {}) => (constructor) => {
@@ -267,7 +265,7 @@ const elementDefine = (name, config = {}) => (constructor) => {
     if (connectedInnerHtmlList.length > 0) {
       let sContent = "", lContent = "";
       for (const meta of connectedInnerHtmlList) {
-        const res = this[meta.propertyKey]();
+        const res = this._invokeLifecycleMethod(meta.propertyKey, hostSet);
         if (res !== void 0) {
           if (meta.options.useShadow) sContent += res;
           else lContent += res;
@@ -464,6 +462,25 @@ const elementDefine = (name, config = {}) => (constructor) => {
   proto.attributeChangedCallback = function(name2, old, newVal) {
     if (originalAttributeChanged) originalAttributeChanged.apply(this, [name2, old, newVal]);
     const hSet = import_Utils.SwcUtils.getHostSet(this);
+    let processedVal = newVal;
+    if (newVal !== null) {
+      const ae = new import_core.ActionExpression(newVal);
+      const expr = ae.getFirstExpression("call-return");
+      if (expr) {
+        const win2 = this._resolveWindow?.() || (typeof window !== "undefined" ? window : void 0);
+        try {
+          const result = import_core.FunctionUtils.executeReturn({
+            script: import_core_web.ConvertUtils.decodeHtmlEntity(expr.script, win2.document),
+            context: this,
+            args: import_Utils.SwcUtils.getHelperAndHostSet(win2, this)
+          });
+          processedVal = String(result);
+        } catch (e) {
+          console.error(`[SWC] Failed to execute directive {{= ${expr.script} }} on attribute ${name2}:`, e);
+          processedVal = newVal;
+        }
+      }
+    }
     if (name2.startsWith("swc-on-") && !swcLifecycleAttributes.includes(name2)) {
       if (newVal !== null) {
         const eventName = name2.substring(7);
@@ -476,7 +493,7 @@ const elementDefine = (name, config = {}) => (constructor) => {
     }
     const mKeys = attrChangeMap.get(name2);
     if (mKeys && Array.isArray(mKeys)) {
-      for (const key of mKeys) this[key](newVal, old, name2, hSet);
+      for (const key of mKeys) this[key](processedVal, old, name2, hSet);
     }
   };
   Object.defineProperty(constructor, "observedAttributes", {