@dooboostore/simple-web-component 1.0.36 → 1.0.37

package/README.md

@@ -49,26 +49,63 @@ render() {
 }
 ```
 
-#### @applyInnerHtmlNodeThis
+#### @applyNodeThisInnerHtml
 Apply HTML to specific host element.
 
 ```typescript
-@applyInnerHtmlNodeThis({ root: 'light' })
+@applyNodeThisInnerHtml({ root: 'light' })
 updateContent() {
   return `<p>Updated content</p>`;
 }
 ```
 
-#### @applyReplaceChildrenNodeThis
+#### @applyNodeThisReplaceChildren
 Replace child nodes with new content.
 
 ```typescript
-@applyReplaceChildrenNodeThis({ root: 'light' })
+@applyNodeThisReplaceChildren({ root: 'light' })
 replaceChildren(node: Node) {
   return node;
 }
 ```
 
+### slot
+```typescript
+ @applySlot('zzz')
+nodeSlot!: NodeSlot;
+
+@addEventListener('.test-btn', 'click' )
+@applySlotReplaceChildren('zzz')
+ttt() {
+  return '<div>zzzzzzzzzz</div>'
+}
+
+@addEventListener('.test-clear-btn', 'click' )
+// @applySlot('zzz', {position: 'clear'})
+@applySlotClear('zzz')
+ttct() {
+  return true;
+}
+
+@onConnectedAfter
+ttttt() {
+  console.log('vvvvvvvvvvvvvvv??', this.nodeSlot)
+  this.nodeSlot.appendText('zzz22zzz'+new Date().toISOString())
+}
+@onConnectedInnerHtml
+render()
+{
+
+  return `
+        [[ zzz ]]
+        <button class="test-btn">test222222222222222</button>
+        <button class="test-clear-btn">clear</button>
+        [[ zzz ]]
+  `
+}
+```
+
+
 ### 4. **Event Handling**
 
 #### @addEventListener

package/dist/cjs/{elements/SwcAppEngine.js → SwcAppEngine.js}

@@ -22,10 +22,10 @@ __export(SwcAppEngine_exports, {
   SwcAppEngine: () => SwcAppEngine
 });
 module.exports = __toCommonJS(SwcAppEngine_exports);
-var import_SimpleApplication = require("@dooboostore/simple-boot/SimpleApplication");
+var import_simple_boot = require("@dooboostore/simple-boot");
 var import_core_web = require("@dooboostore/core-web");
-var import_ElementRouter = require("../router/ElementRouter");
-var import_SimOption = require("@dooboostore/simple-boot/SimOption");
+var import_ElementRouter = require("./router/ElementRouter");
+var import_simple_boot2 = require("@dooboostore/simple-boot");
 class SwcAppEngine {
   constructor(host) {
     this.host = host;
@@ -47,8 +47,8 @@ class SwcAppEngine {
       } else if (this._config.routeType === "element") {
         this.router = new import_ElementRouter.ElementRouter({ window: this._config.window, firstUrl: this._config.path });
       }
-      this.simpleApplication = new import_SimpleApplication.SimpleApplication(
-        new import_SimOption.SimOption({
+      this.simpleApplication = new import_simple_boot.SimpleApplication(
+        new import_simple_boot2.SimOption({
           excludeProxys: [this._config.window.Node],
           container: this._config.container
         })
@@ -60,7 +60,7 @@ class SwcAppEngine {
       if (this.router) otherInstanceSim.set(import_core_web.Router, this.router);
       this.simpleApplication.run(otherInstanceSim);
       if (this._config.onEngineStarted) {
-        this._config.onEngineStarted(this.simpleApplication, this.host);
+        await this._config.onEngineStarted(this.simpleApplication, this.host);
       }
     } catch (e) {
       console.error("[SWC-APP-ENGINE] Init failed:", e, this._config);

package/dist/cjs/SwcAppEngine.js.map

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../src/SwcAppEngine.ts"],
+  "sourcesContent": ["import { SimpleApplication } from '@dooboostore/simple-boot';\nimport { HashRouter, PathRouter, Router, RouterEventType } from '@dooboostore/core-web';\nimport { ElementRouter } from './router/ElementRouter';\nimport { SimOption } from '@dooboostore/simple-boot';\nimport { ConstructorType, OptionalType, Subscription } from '@dooboostore/core';\n\nimport { SwcAppInterface } from './types';\nimport { SimConfig } from '@dooboostore/simple-boot';\n\nexport type SwcConfigType = {\n  routeType: 'path' | 'hash' | 'element';\n  connectMode?: 'direct' | 'swap' | 'clear-swap' | 'hydrate'; // hydrate \uC544\uC9C1 \uAC1C\uBC1C\uC911\n  container?: symbol;\n  otherInstanceSim?: Map<ConstructorType<any> | Function | SimConfig | symbol, any>;\n  path?: string;\n  window: Window;\n  onEngineStarted?: (sp: SimpleApplication, app: SwcAppInterface) => Promise<void> | void;\n  onConnectedChildAfter?: (swcEl: HTMLElement) => void;\n  onConnectedChildBefore?: (swcEl: HTMLElement) => void;\n  onDisconnectedChildAfter?: (swcEl: HTMLElement) => void;\n  onDisconnectedChildBefore?: (swcEl: HTMLElement) => void;\n  onConnected?: (app: SwcAppInterface) => void;\n  onDisconnected?: (app: SwcAppInterface) => void;\n  ssr?: boolean;\n\n  onChildrenConnectedDone?: (app: SwcAppInterface) => void;\n  // onChildrenSwcAppStartedDone?: (app: SwcAppInterface) => void;\n  // childrenSwcAppStartedDoneCheckIntervalTime?: number;\n  onChildrenRouteChanged?: (event: RouterEventType, app: SwcAppInterface) => void;\n  childrenRouteChangedCheckIntervalTime?: number; // \uC790\uC2DD \uC5F0\uACB0 \uC644\uB8CC \uC774\uBCA4\uD2B8 \uB514\uBC14\uC6B4\uC2A4 \uD0C0\uC784 (ms)\n  childrenConnectedDoneCheckIntervalTime?: number;\n};\n\nexport type SwcAttributeConfigType = OptionalType<SwcConfigType, 'routeType' | 'window'>;\n\nexport class SwcAppEngine {\n  public simpleApplication?: SimpleApplication;\n  public router?: Router;\n  private routerSubscription?: Subscription;\n  private _config?: SwcConfigType;\n\n  constructor(private host: HTMLElement) {}\n\n  get config() {\n    return this._config;\n  }\n\n  async connect(config: SwcConfigType) {\n    try {\n      this._config = config;\n\n      // Router Selection\n      if (this._config.routeType === 'path') {\n        this.router = new PathRouter({ window: this._config.window, firstUrl: this._config.path });\n      } else if (this._config.routeType === 'hash') {\n        this.router = new HashRouter({ window: this._config.window, firstUrl: this._config.path });\n      } else if (this._config.routeType === 'element') {\n        this.router = new ElementRouter({ window: this._config.window, firstUrl: this._config.path });\n      }\n\n      // console.log('vvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvvv', this.router)\n\n      // App start\n      this.simpleApplication = new SimpleApplication(\n        new SimOption({\n          excludeProxys: [(this._config.window as any).Node],\n          container: this._config.container\n        })\n      );\n\n      const otherInstanceSim = new Map<any, any>();\n      this.config?.otherInstanceSim?.forEach((v, k) => {\n        otherInstanceSim.set(k, v);\n      });\n      if (this.router) otherInstanceSim.set(Router, this.router);\n      this.simpleApplication.run(otherInstanceSim);\n\n      if (this._config.onEngineStarted) {\n        await this._config.onEngineStarted(this.simpleApplication, this.host as unknown as SwcAppInterface);\n      }\n    } catch (e) {\n      console.error('[SWC-APP-ENGINE] Init failed:', e, this._config);\n    }\n  }\n\n  disconnect() {\n    this.routerSubscription?.unsubscribe();\n  }\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,yBAAkC;AAClC,sBAAgE;AAChE,2BAA8B;AAC9B,IAAAA,sBAA0B;AAgCnB,MAAM,aAAa;AAAA,EAMxB,YAAoB,MAAmB;AAAnB;AALpB,wBAAO;AACP,wBAAO;AACP,wBAAQ;AACR,wBAAQ;AAAA,EAEgC;AAAA,EAExC,IAAI,SAAS;AACX,WAAO,KAAK;AAAA,EACd;AAAA,EAEA,MAAM,QAAQ,QAAuB;AACnC,QAAI;AACF,WAAK,UAAU;AAGf,UAAI,KAAK,QAAQ,cAAc,QAAQ;AACrC,aAAK,SAAS,IAAI,2BAAW,EAAE,QAAQ,KAAK,QAAQ,QAAQ,UAAU,KAAK,QAAQ,KAAK,CAAC;AAAA,MAC3F,WAAW,KAAK,QAAQ,cAAc,QAAQ;AAC5C,aAAK,SAAS,IAAI,2BAAW,EAAE,QAAQ,KAAK,QAAQ,QAAQ,UAAU,KAAK,QAAQ,KAAK,CAAC;AAAA,MAC3F,WAAW,KAAK,QAAQ,cAAc,WAAW;AAC/C,aAAK,SAAS,IAAI,mCAAc,EAAE,QAAQ,KAAK,QAAQ,QAAQ,UAAU,KAAK,QAAQ,KAAK,CAAC;AAAA,MAC9F;AAKA,WAAK,oBAAoB,IAAI;AAAA,QAC3B,IAAI,8BAAU;AAAA,UACZ,eAAe,CAAE,KAAK,QAAQ,OAAe,IAAI;AAAA,UACjD,WAAW,KAAK,QAAQ;AAAA,QAC1B,CAAC;AAAA,MACH;AAEA,YAAM,mBAAmB,oBAAI,IAAc;AAC3C,WAAK,QAAQ,kBAAkB,QAAQ,CAAC,GAAG,MAAM;AAC/C,yBAAiB,IAAI,GAAG,CAAC;AAAA,MAC3B,CAAC;AACD,UAAI,KAAK,OAAQ,kBAAiB,IAAI,wBAAQ,KAAK,MAAM;AACzD,WAAK,kBAAkB,IAAI,gBAAgB;AAE3C,UAAI,KAAK,QAAQ,iBAAiB;AAChC,cAAM,KAAK,QAAQ,gBAAgB,KAAK,mBAAmB,KAAK,IAAkC;AAAA,MACpG;AAAA,IACF,SAAS,GAAG;AACV,cAAQ,MAAM,iCAAiC,GAAG,KAAK,OAAO;AAAA,IAChE;AAAA,EACF;AAAA,EAEA,aAAa;AACX,SAAK,oBAAoB,YAAY;AAAA,EACvC;AACF;",
+  "names": ["import_simple_boot"]
+}

package/dist/cjs/decorators/applyNode.js

@@ -18,13 +18,13 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var applyNode_exports = {};
 __export(applyNode_exports, {
   APPLY_NODE_METADATA_KEY: () => APPLY_NODE_METADATA_KEY,
-  applyInnerHtmlNode: () => applyInnerHtmlNode,
-  applyInnerHtmlNodeThis: () => applyInnerHtmlNodeThis,
-  applyInnerTextNode: () => applyInnerTextNode,
   applyNode: () => applyNode,
+  applyNodeInnerHtml: () => applyNodeInnerHtml,
+  applyNodeInnerText: () => applyNodeInnerText,
+  applyNodeReplaceChildren: () => applyNodeReplaceChildren,
   applyNodeThis: () => applyNodeThis,
-  applyReplaceChildrenNode: () => applyReplaceChildrenNode,
-  applyReplaceChildrenNodeThis: () => applyReplaceChildrenNodeThis,
+  applyNodeThisReplaceChildren: () => applyNodeThisReplaceChildren,
+  applyThisInnerHtmlNode: () => applyThisInnerHtmlNode,
   findAllApplyNodeMetadata: () => findAllApplyNodeMetadata
 });
 module.exports = __toCommonJS(applyNode_exports);
@@ -39,8 +39,9 @@ const normalizeNodes = (res, doc) => {
     return doc.createTextNode(it !== void 0 && it !== null ? String(it) : "");
   });
 };
-const applyToDom = (targetEl, res, pos, doc) => {
+const applyToDom = (targetEl, res, pos, win) => {
   if (!targetEl) return;
+  const doc = win.document;
   if (pos === "innerHtml") {
     targetEl.innerHTML = res !== void 0 && res !== null ? String(res) : "";
     return;
@@ -51,7 +52,7 @@ const applyToDom = (targetEl, res, pos, doc) => {
     }
     return;
   }
-  const isShadowRoot = targetEl instanceof ShadowRoot;
+  const isShadowRoot = targetEl instanceof win.ShadowRoot;
   const nodes = normalizeNodes(res, doc);
   if (pos === "replace") {
     if (!isShadowRoot) targetEl.replaceWith(...nodes);
@@ -104,7 +105,7 @@ function applyNode(selector, options = { position: "beforeEnd" }) {
       const runApply = (target, val) => {
         const pos = options.position || "beforeEnd";
         if (!options.filter || options.filter(target, val, { currentThis: this, helper: hostSet })) {
-          applyToDom(target, val, pos, currentDoc);
+          applyToDom(target, val, pos, currentWin);
         }
       };
       if (res instanceof Promise) {
@@ -138,23 +139,23 @@ function applyNodeThis(targetOrOptions, propertyKey, descriptor) {
   const opt = targetOrOptions || {};
   return applyNode("$this", { position: "beforeEnd", ...opt });
 }
-function applyReplaceChildrenNodeThis(targetOrOptions, propertyKey, descriptor) {
+function applyNodeThisReplaceChildren(targetOrOptions, propertyKey, descriptor) {
   if (propertyKey !== void 0) return applyNode("$this", { position: "replaceChildren" })(targetOrOptions, propertyKey, descriptor);
   const opt = targetOrOptions || {};
   return applyNode("$this", { position: "replaceChildren", ...opt });
 }
-function applyInnerHtmlNodeThis(targetOrOptions, propertyKey, descriptor) {
+function applyThisInnerHtmlNode(targetOrOptions, propertyKey, descriptor) {
   if (propertyKey !== void 0) return applyNode("$this", { position: "innerHtml" })(targetOrOptions, propertyKey, descriptor);
   const opt = targetOrOptions || {};
   return applyNode("$this", { position: "innerHtml", ...opt });
 }
-function applyReplaceChildrenNode(selector, options = {}) {
+function applyNodeReplaceChildren(selector, options = {}) {
   return applyNode(selector, { ...options, position: "replaceChildren" });
 }
-function applyInnerHtmlNode(selector, options = {}) {
+function applyNodeInnerHtml(selector, options = {}) {
   return applyNode(selector, { ...options, position: "innerHtml" });
 }
-function applyInnerTextNode(selector, options = {}) {
+function applyNodeInnerText(selector, options = {}) {
   return applyNode(selector, { ...options, position: "innerText" });
 }
 //# sourceMappingURL=applyNode.js.map

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

@@ -1,7 +1,7 @@
 {
   "version": 3,
   "sources": ["../../../src/decorators/applyNode.ts"],
-  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { HelperHostSet, SwcRootType } from '../types';\nimport { SwcUtils } from \"../utils/Utils\";\n/*\n<!-- beforebegin -->\n<p>\n  <!-- afterbegin -->\n  foo\n  <!-- beforeend -->\n</p>\n<!-- afterend -->\n */\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText' | 'remove';\n\nexport interface ApplyNodeOptions {\n  position?: ApplyNodePosition;\n  root?: SwcRootType;\n  /**\n   * Filter function to determine whether to perform DOM operation.\n   * If it returns false, the operation is skipped.\n   */\n  filter?: (target: HTMLElement | ShadowRoot, newValue: any, meta:{currentThis: any,helper: HelperHostSet}) => boolean;\n  /**\n   * Optional loading content to display while an async method is executing.\n   */\n  loading?: (helper: HelperHostSet) => any;\n}\n\nexport interface ApplyNodeMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol.for('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n  const items = Array.isArray(res) ? res : [res];\n  return items.map(it => {\n    if (it instanceof Node) return it;\n    return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n  });\n};\n\nconst applyToDom = (targetEl: any, res: any, pos: ApplyNodePosition, doc: Document) => {\n    if (!targetEl) return;\n    \n    if (pos === 'innerHtml') {\n        targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n        return;\n    }\n    \n    if (pos === 'innerText') {\n        if (targetEl.innerText !== undefined) {\n            targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n        }\n        return;\n    }\n\n    const isShadowRoot = targetEl instanceof ShadowRoot;\n    const nodes = normalizeNodes(res, doc);\n    if (pos === 'replace') {\n      if (!isShadowRoot) targetEl.replaceWith(...nodes);\n    } else if (pos === 'replaceChildren') {\n      targetEl.replaceChildren(...nodes);\n    } else {\n      if (pos === 'beforeEnd') targetEl.append(...nodes);\n      else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n      else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n      else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n    }\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n    const constructor = targetObj.constructor;\n    let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n    if (!metaList) {\n      metaList = new Map<string | symbol, ApplyNodeMetadata>();\n      ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n    }\n    metaList.set(propertyKey, { propertyKey, selector, options });\n\n    const original = descriptor.value;\n    descriptor.value = function (...args: any[]) {\n      ensureInit(this);\n      \n      const conf = getElementConfig(this);\n      const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n      const currentDoc = currentWin.document;\n      const hostSet = SwcUtils.getHelperAndHostSet(currentWin, this);\n      \n      const getTarget = () => {\n        const r = options.root || 'auto';\n        const applyRoot = (t: any) => {\n          if (!t) return t;\n          if (r === 'auto') return t.shadowRoot || t;\n          if (r === 'shadow') return t.shadowRoot;\n          if (r === 'light') return t;\n          if (r === 'all') return t.shadowRoot || t;\n          return t;\n        };\n\n        if (selector === '$this') return applyRoot(this);\n        if (selector === '$host') return applyRoot(hostSet.$host);\n        if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);\n        if (selector === '$appHost') return applyRoot(hostSet.$appHost);\n        if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);\n        if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);\n        \n        const targetRoot = applyRoot(this);\n        return targetRoot ? targetRoot.querySelector(selector) : null;\n      };\n\n      const targetEl = getTarget();\n      const res = original.apply(this, args);\n\n      const runApply = (target: any, val: any) => {\n        const pos = options.position || 'beforeEnd';\n        \n        // \uC0AC\uC6A9\uC790\uAC00 filter\uB97C \uBA85\uC2DC\uD558\uBA74 \uADF8 \uC870\uAC74\uC73C\uB85C, \uC544\uB2C8\uBA74 \uD56D\uC0C1 \uC801\uC6A9\n        if (!options.filter || options.filter(target, val, {currentThis: this, helper: hostSet})) {\n            applyToDom(target, val, pos, currentDoc);\n        }\n      };\n\n      if (res instanceof Promise) {\n          // \uBE44\uB3D9\uAE30\uC77C \uB54C\uB9CC \uB85C\uB529 \uD45C\uC2DC\n          if (targetEl && options.loading) {\n              const loadingRes = options.loading.call(this, hostSet);\n              applyToDom(targetEl, loadingRes, options.position || 'beforeEnd', currentDoc);\n          }\n\n          return res.then(finalRes => {\n              if (finalRes !== undefined && targetEl) runApply(targetEl, finalRes);\n              return finalRes;\n          });\n      } else {\n          if (res !== undefined && targetEl) runApply(targetEl, res);\n          return res;\n      }\n    };\n  };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n  const result = new Map<string | symbol, ApplyNodeMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_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\nexport function applyNodeThis(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeThis(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeThis(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'beforeEnd' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'beforeEnd', ...opt });\n}\n\nexport function applyReplaceChildrenNodeThis(options: ApplyNodeOptions): MethodDecorator;\nexport function applyReplaceChildrenNodeThis(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyReplaceChildrenNodeThis(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'replaceChildren' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'replaceChildren', ...opt });\n}\n\nexport function applyInnerHtmlNodeThis(options: ApplyNodeOptions): MethodDecorator;\nexport function applyInnerHtmlNodeThis(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyInnerHtmlNodeThis(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'innerHtml' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'innerHtml', ...opt });\n}\n\nexport function applyReplaceChildrenNode(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'replaceChildren' });\n}\n\nexport function applyInnerHtmlNode(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'innerHtml' });\n}\n\nexport function applyInnerTextNode(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'innerText' });\n}\n"],
-  "mappings": "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",
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { HelperHostSet, SwcRootType } from '../types';\nimport { SwcUtils } from \"../utils/Utils\";\n/*\n<!-- beforebegin -->\n<p> <-- it's me\n  <!-- afterbegin -->\n  foo\n  <!-- beforeend -->\n</p>\n<!-- afterend -->\n */\nexport type ApplyNodePosition = 'beforeBegin' | 'afterBegin' | 'beforeEnd' | 'afterEnd' | 'replace' | 'replaceChildren' | 'innerHtml' | 'innerText' | 'remove';\n\nexport interface ApplyNodeOptions {\n  position?: ApplyNodePosition;\n  root?: SwcRootType;\n  /**\n   * Filter function to determine whether to perform DOM operation.\n   * If it returns false, the operation is skipped.\n   */\n  filter?: (target: HTMLElement | ShadowRoot, newValue: any, meta:{currentThis: any,helper: HelperHostSet}) => boolean;\n  /**\n   * Optional loading content to display while an async method is executing.\n   */\n  loading?: (helper: HelperHostSet) => any;\n}\n\nexport interface ApplyNodeMetadata {\n  propertyKey: string | symbol;\n  selector: string;\n  options: ApplyNodeOptions;\n}\n\nexport const APPLY_NODE_METADATA_KEY = Symbol.for('simple-web-component:apply-node');\n\nconst normalizeNodes = (res: any, doc: Document): Node[] => {\n  const items = Array.isArray(res) ? res : [res];\n  return items.map(it => {\n    if (it instanceof Node) return it;\n    return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n  });\n};\n\nconst applyToDom = (targetEl: any, res: any, pos: ApplyNodePosition, win: Window) => {\n    if (!targetEl) return;\n\n    const doc = win.document;\n    \n    if (pos === 'innerHtml') {\n        targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n        return;\n    }\n    \n    if (pos === 'innerText') {\n        if (targetEl.innerText !== undefined) {\n            targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n        }\n        return;\n    }\n\n    const isShadowRoot = targetEl instanceof win.ShadowRoot;\n    const nodes = normalizeNodes(res, doc);\n    if (pos === 'replace') {\n      if (!isShadowRoot) targetEl.replaceWith(...nodes);\n    } else if (pos === 'replaceChildren') {\n      targetEl.replaceChildren(...nodes);\n    } else {\n      if (pos === 'beforeEnd') targetEl.append(...nodes);\n      else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n      else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n      else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n    }\n};\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n */\nexport function applyNode(selector: string, options: ApplyNodeOptions = { position: 'beforeEnd' }): MethodDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor) => {\n    const constructor = targetObj.constructor;\n    let metaList = ReflectUtils.getOwnMetadata(APPLY_NODE_METADATA_KEY, constructor) as Map<string | symbol, ApplyNodeMetadata>;\n    if (!metaList) {\n      metaList = new Map<string | symbol, ApplyNodeMetadata>();\n      ReflectUtils.defineMetadata(APPLY_NODE_METADATA_KEY, metaList, constructor);\n    }\n    metaList.set(propertyKey, { propertyKey, selector, options });\n\n    const original = descriptor.value;\n    descriptor.value = function (...args: any[]) {\n      ensureInit(this);\n      \n      const conf = getElementConfig(this);\n      const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n      const currentDoc = currentWin.document;\n      const hostSet = SwcUtils.getHelperAndHostSet(currentWin, this);\n      \n      const getTarget = () => {\n        const r = options.root || 'auto';\n        const applyRoot = (t: any) => {\n          if (!t) return t;\n          if (r === 'auto') return t.shadowRoot || t;\n          if (r === 'shadow') return t.shadowRoot;\n          if (r === 'light') return t;\n          if (r === 'all') return t.shadowRoot || t;\n          return t;\n        };\n\n        if (selector === '$this') return applyRoot(this);\n        if (selector === '$host') return applyRoot(hostSet.$host);\n        if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);\n        if (selector === '$appHost') return applyRoot(hostSet.$appHost);\n        if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);\n        if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);\n        \n        const targetRoot = applyRoot(this);\n        return targetRoot ? targetRoot.querySelector(selector) : null;\n      };\n\n      const targetEl = getTarget();\n      const res = original.apply(this, args);\n\n      const runApply = (target: any, val: any) => {\n        const pos = options.position || 'beforeEnd';\n        \n        // \uC0AC\uC6A9\uC790\uAC00 filter\uB97C \uBA85\uC2DC\uD558\uBA74 \uADF8 \uC870\uAC74\uC73C\uB85C, \uC544\uB2C8\uBA74 \uD56D\uC0C1 \uC801\uC6A9\n        if (!options.filter || options.filter(target, val, {currentThis: this, helper: hostSet})) {\n            applyToDom(target, val, pos, currentWin);\n        }\n      };\n\n      if (res instanceof Promise) {\n          // \uBE44\uB3D9\uAE30\uC77C \uB54C\uB9CC \uB85C\uB529 \uD45C\uC2DC\n          if (targetEl && options.loading) {\n              const loadingRes = options.loading.call(this, hostSet);\n              applyToDom(targetEl, loadingRes, options.position || 'beforeEnd', currentDoc);\n          }\n\n          return res.then(finalRes => {\n              if (finalRes !== undefined && targetEl) runApply(targetEl, finalRes);\n              return finalRes;\n          });\n      } else {\n          if (res !== undefined && targetEl) runApply(targetEl, res);\n          return res;\n      }\n    };\n  };\n}\n\nexport const findAllApplyNodeMetadata = (target: any): Map<string | symbol, ApplyNodeMetadata> => {\n  const result = new Map<string | symbol, ApplyNodeMetadata>();\n  const maps = ReflectUtils.findAllMetadata<Map<string | symbol, ApplyNodeMetadata>>(APPLY_NODE_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\nexport function applyNodeThis(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeThis(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeThis(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'beforeEnd' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'beforeEnd', ...opt });\n}\n\nexport function applyNodeThisReplaceChildren(options: ApplyNodeOptions): MethodDecorator;\nexport function applyNodeThisReplaceChildren(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyNodeThisReplaceChildren(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'replaceChildren' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'replaceChildren', ...opt });\n}\n\nexport function applyThisInnerHtmlNode(options: ApplyNodeOptions): MethodDecorator;\nexport function applyThisInnerHtmlNode(target: Object, propertyKey: string | symbol, descriptor: PropertyDescriptor): void;\nexport function applyThisInnerHtmlNode(targetOrOptions?: any, propertyKey?: string | symbol, descriptor?: PropertyDescriptor): any {\n  if (propertyKey !== undefined) return applyNode('$this', { position: 'innerHtml' })(targetOrOptions, propertyKey, descriptor);\n  const opt = targetOrOptions || {};\n  return applyNode('$this', { position: 'innerHtml', ...opt });\n}\n\nexport function applyNodeReplaceChildren(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'replaceChildren' });\n}\n\nexport function applyNodeInnerHtml(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'innerHtml' });\n}\n\nexport function applyNodeInnerText(selector: string, options: ApplyNodeOptions = {}): MethodDecorator {\n    return applyNode(selector, { ...options, position: 'innerText' });\n}\n"],
+  "mappings": "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",
   "names": []
 }

package/dist/cjs/decorators/applySlot.js

@@ -0,0 +1,122 @@
+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 applySlot_exports = {};
+__export(applySlot_exports, {
+  APPLY_SLOT_METADATA_KEY: () => APPLY_SLOT_METADATA_KEY,
+  applySlot: () => applySlot,
+  applySlotAppend: () => applySlotAppend,
+  applySlotAppendHtml: () => applySlotAppendHtml,
+  applySlotAppendText: () => applySlotAppendText,
+  applySlotClear: () => applySlotClear,
+  applySlotPrepend: () => applySlotPrepend,
+  applySlotPrependHtml: () => applySlotPrependHtml,
+  applySlotPrependText: () => applySlotPrependText,
+  applySlotReplaceChildren: () => applySlotReplaceChildren,
+  applySlotReplaceChildrenHtml: () => applySlotReplaceChildrenHtml,
+  applySlotReplaceChildrenText: () => applySlotReplaceChildrenText,
+  findAllApplySlotMetadata: () => findAllApplySlotMetadata
+});
+module.exports = __toCommonJS(applySlot_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 APPLY_SLOT_METADATA_KEY = Symbol.for("simple-web-component:apply-slot");
+function applySlot(id, options = { position: "replaceChildrenHtml" }) {
+  return (targetObj, propertyKey, descriptor) => {
+    const type = descriptor === void 0 ? "property" : "method";
+    if (type === "property") {
+      Object.defineProperty(targetObj, propertyKey, {
+        get() {
+          const nodeSlot = new import_core_web.NodeSlot(this, `${this._swcId}-${id}`);
+          return nodeSlot;
+        },
+        configurable: true,
+        enumerable: true
+      });
+    }
+    const constructor = targetObj.constructor;
+    let metaList = import_core.ReflectUtils.getOwnMetadata(APPLY_SLOT_METADATA_KEY, constructor);
+    if (!metaList) {
+      metaList = [];
+      import_core.ReflectUtils.defineMetadata(APPLY_SLOT_METADATA_KEY, metaList, constructor);
+    }
+    metaList.push({ propertyKey, id, type, options });
+    if (type === "method") {
+      const original = descriptor.value;
+      descriptor.value = function(...args) {
+        (0, import_elementDefine.ensureInit)(this);
+        const conf = (0, import_elementDefine.getElementConfig)(this);
+        const currentWin = this._resolveWindow?.(conf) || (typeof window !== "undefined" ? window : void 0);
+        const currentDoc = currentWin.document;
+        const hostSet = import_Utils.SwcUtils.getHelperAndHostSet(currentWin, this);
+        const res = original.apply(this, args);
+        if (res) {
+          const nodeSlot = new import_core_web.NodeSlot(this, `${this._swcId}-${id}`);
+          const pos = options.position || "replaceChildrenHtml";
+          const doc = currentWin.document;
+          if (pos === "replaceChildrenHtml") {
+            nodeSlot.replaceChildrenHtml(res);
+          } else if (pos === "replaceChildrenText") {
+            nodeSlot.replaceChildrenText(res);
+          } else if (pos === "appendHtml") {
+            nodeSlot.appendHtml(res);
+          } else if (pos === "appendText") {
+            nodeSlot.appendText(res);
+          } else if (pos === "prependHtml") {
+            nodeSlot.prependHtml(res);
+          } else if (pos === "prependText") {
+            nodeSlot.prependText(res);
+          } else if (pos === "clear") {
+            nodeSlot.clear();
+          }
+        }
+        return res;
+      };
+    }
+  };
+}
+const findAllApplySlotMetadata = (target) => {
+  const constructor = target instanceof Function ? target : target.constructor;
+  return import_core.ReflectUtils.getMetadata(APPLY_SLOT_METADATA_KEY, constructor);
+};
+function applySlotClear(id) {
+  return applySlot(id, { position: "clear" });
+}
+function applySlotPrependHtml(id) {
+  return applySlot(id, { position: "prependHtml" });
+}
+const applySlotPrepend = applySlotPrependHtml;
+function applySlotPrependText(id) {
+  return applySlot(id, { position: "prependText" });
+}
+function applySlotAppendHtml(id) {
+  return applySlot(id, { position: "appendHtml" });
+}
+function applySlotAppendText(id) {
+  return applySlot(id, { position: "appendText" });
+}
+const applySlotAppend = applySlotAppendHtml;
+function applySlotReplaceChildrenHtml(id) {
+  return applySlot(id, { position: "replaceChildrenHtml" });
+}
+const applySlotReplaceChildren = applySlotReplaceChildrenHtml;
+function applySlotReplaceChildrenText(id) {
+  return applySlot(id, { position: "replaceChildrenText" });
+}
+//# sourceMappingURL=applySlot.js.map

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

@@ -0,0 +1,7 @@
+{
+  "version": 3,
+  "sources": ["../../../src/decorators/applySlot.ts"],
+  "sourcesContent": ["import { ReflectUtils } from '@dooboostore/core';\nimport { ensureInit, getElementConfig } from './elementDefine';\nimport { HelperHostSet, SwcRootType } from '../types';\nimport { SwcUtils } from \"../utils/Utils\";\nimport {NodeSlot} from \"@dooboostore/core-web\";\n/*\n<!-- beforebegin -->\n<p> <-- it's me\n  <!-- afterbegin -->\n  foo\n  <!-- beforeend -->\n</p>\n<!-- afterend -->\n */\nexport type ApplySlotPosition = 'prependHtml' | 'prependText' | 'appendHtml' | 'appendText' | 'replaceChildrenHtml' | 'replaceChildrenText' | 'clear';\n\nexport interface ApplySlotOptions {\n  position?: ApplySlotPosition;\n  // root?: SwcRootType;\n  /**\n   * Filter function to determine whether to perform DOM operation.\n   * If it returns false, the operation is skipped.\n   */\n  // filter?: (target: HTMLElement | ShadowRoot, newValue: any, meta:{currentThis: any,helper: HelperHostSet}) => boolean;\n  /**\n   * Optional loading content to display while an async method is executing.\n   */\n  // loading?: (helper: HelperHostSet) => any;\n}\n\nexport interface ApplySlotMetadata {\n  propertyKey: string | symbol;\n  id: string;\n  type: 'method' | 'property';\n  options: ApplySlotOptions;\n}\n\nexport const APPLY_SLOT_METADATA_KEY = Symbol.for('simple-web-component:apply-slot');\n\n// const normalizeNodes = (res: any, doc: Document): Node[] => {\n//   const items = Array.isArray(res) ? res : [res];\n//   return items.map(it => {\n//     if (it instanceof Node) return it;\n//     return doc.createTextNode(it !== undefined && it !== null ? String(it) : '');\n//   });\n// };\n\n// const applyToDom = (targetEl: any, res: any, pos: ApplyNodePosition, win: Window) => {\n//     if (!targetEl) return;\n//\n//     const doc = win.document;\n//\n//     if (pos === 'innerHtml') {\n//         targetEl.innerHTML = res !== undefined && res !== null ? String(res) : '';\n//         return;\n//     }\n//\n//     if (pos === 'innerText') {\n//         if (targetEl.innerText !== undefined) {\n//             targetEl.innerText = res !== undefined && res !== null ? String(res) : '';\n//         }\n//         return;\n//     }\n//\n//     const isShadowRoot = targetEl instanceof win.ShadowRoot;\n//     const nodes = normalizeNodes(res, doc);\n//     if (pos === 'replace') {\n//       if (!isShadowRoot) targetEl.replaceWith(...nodes);\n//     } else if (pos === 'replaceChildren') {\n//       targetEl.replaceChildren(...nodes);\n//     } else {\n//       if (pos === 'beforeEnd') targetEl.append(...nodes);\n//       else if (pos === 'afterBegin') targetEl.prepend(...nodes);\n//       else if (pos === 'beforeBegin' && !isShadowRoot) targetEl.before(...nodes);\n//       else if (pos === 'afterEnd' && !isShadowRoot) targetEl.after(...nodes);\n//     }\n// };\n\n/**\n * @applyNode decorator to surgically add/replace nodes to a target element.\n */\nexport function applySlot(id: string, options: ApplySlotOptions = { position: 'replaceChildrenHtml' }): MethodDecorator & PropertyDecorator {\n  return (targetObj: Object, propertyKey: string | symbol, descriptor?: PropertyDescriptor) => {\n    const type = descriptor === undefined ? 'property' : 'method';\n\n    if (type === 'property') {\n            Object.defineProperty(targetObj, propertyKey, {\n              get(this: any) {\n                const nodeSlot = new NodeSlot(this, `${this._swcId}-${id}`);\n                return nodeSlot;\n              },\n              configurable: true,\n              enumerable: true,\n            })\n     // return nodeSlot;\n     //  return;\n    }\n\n    const constructor = targetObj.constructor;\n    let metaList = ReflectUtils.getOwnMetadata(APPLY_SLOT_METADATA_KEY, constructor) as ApplySlotMetadata[];\n    if (!metaList) {\n      metaList = []\n      ReflectUtils.defineMetadata(APPLY_SLOT_METADATA_KEY, metaList, constructor);\n    }\n    metaList.push({ propertyKey, id, type, options });\n\n\n\n    if (type === 'method') {\n      const original = descriptor.value;\n      descriptor.value = function (...args: any[]) {\n        ensureInit(this);\n\n        const conf = getElementConfig(this);\n        const currentWin = (this as any)._resolveWindow?.(conf) || ((typeof window !== 'undefined' ? window : undefined) as Window);\n        const currentDoc = currentWin.document;\n        const hostSet = SwcUtils.getHelperAndHostSet(currentWin, this);\n\n\n        // const getTarget = () => {\n        //   const r = options.root || 'auto';\n        //   const applyRoot = (t: any) => {\n        //     if (!t) return t;\n        //     if (r === 'auto') return t.shadowRoot || t;\n        //     if (r === 'shadow') return t.shadowRoot;\n        //     if (r === 'light') return t;\n        //     if (r === 'all') return t.shadowRoot || t;\n        //     return t;\n        //   };\n        //\n        //   if (selector === '$this') return applyRoot(this);\n        //   if (selector === '$host') return applyRoot(hostSet.$host);\n        //   if (selector === '$parentHost') return applyRoot(hostSet.$parentHost);\n        //   if (selector === '$appHost') return applyRoot(hostSet.$appHost);\n        //   if (selector === '$firstHost') return applyRoot(hostSet.$firstHost);\n        //   if (selector === '$lastHost') return applyRoot(hostSet.$lastHost);\n        //\n        //   const targetRoot = applyRoot(this);\n        //   return targetRoot ? targetRoot.querySelector(selector) : null;\n        // };\n\n        // const targetEl = getTarget();\n        const res = original.apply(this, args);\n\n        // const runApply = (target: any, val: any) => {\n        //   const pos = options.position || 'beforeEnd';\n        //\n        //   // \uC0AC\uC6A9\uC790\uAC00 filter\uB97C \uBA85\uC2DC\uD558\uBA74 \uADF8 \uC870\uAC74\uC73C\uB85C, \uC544\uB2C8\uBA74 \uD56D\uC0C1 \uC801\uC6A9\n        //   if (!options.filter || options.filter(target, val, {currentThis: this, helper: hostSet})) {\n        //       applyToDom(target, val, pos, currentWin);\n        //   }\n        // };\n\n        // if (res instanceof Promise) {\n        //     // \uBE44\uB3D9\uAE30\uC77C \uB54C\uB9CC \uB85C\uB529 \uD45C\uC2DC\n        //     if (targetEl && options.loading) {\n        //         const loadingRes = options.loading.call(this, hostSet);\n        //         applyToDom(targetEl, loadingRes, options.position || 'beforeEnd', currentDoc);\n        //     }\n        //\n        //     return res.then(finalRes => {\n        //         if (finalRes !== undefined && targetEl) runApply(targetEl, finalRes);\n        //         return finalRes;\n        //     });\n        // } else {\n        //     if (res !== undefined && targetEl) runApply(targetEl, res);\n        //     return res;\n        // }\n        if (res) {\n          const nodeSlot = new NodeSlot(this, `${this._swcId}-${id}`);\n          const pos = options.position || 'replaceChildrenHtml';\n          const doc = currentWin.document;\n\n\n          // const isShadowRoot = targetEl instanceof win.ShadowRoot;\n          // const nodes = normalizeNodes(res, doc);\n          if (pos === 'replaceChildrenHtml') {\n            nodeSlot.replaceChildrenHtml(res);\n          } else if (pos === 'replaceChildrenText') {\n            nodeSlot.replaceChildrenText(res);\n          } else if (pos === 'appendHtml') {\n            nodeSlot.appendHtml(res);\n          } else if (pos === 'appendText') {\n            nodeSlot.appendText(res);\n          } else if (pos === 'prependHtml') {\n            nodeSlot.prependHtml(res);\n          } else if (pos === 'prependText') {\n            nodeSlot.prependText(res);\n          } else if (pos === 'clear') {\n            nodeSlot.clear();\n          }\n        }\n        return res;\n      };\n    }\n  };\n}\n\n// export const findAllApplySlotMetadata = (target: any): Map<string | symbol, ApplySlotMetadata> => {\nexport const findAllApplySlotMetadata = (target: any): ApplySlotMetadata[] => {\n  const constructor = target instanceof Function ? target : target.constructor;\n  return ReflectUtils.getMetadata(APPLY_SLOT_METADATA_KEY, constructor);\n};\n\nexport function applySlotClear(id: string): MethodDecorator {\n  return applySlot(id, { position: 'clear' });\n}\nexport function applySlotPrependHtml(id: string): MethodDecorator {\n  return applySlot(id, { position: 'prependHtml' });\n}\nexport const applySlotPrepend = applySlotPrependHtml;\nexport function applySlotPrependText(id: string): MethodDecorator {\n  return applySlot(id, { position: 'prependText' });\n}\nexport function applySlotAppendHtml(id: string): MethodDecorator {\n  return applySlot(id, { position: 'appendHtml' });\n}\nexport function applySlotAppendText(id: string): MethodDecorator {\n  return applySlot(id, { position: 'appendText' });\n}\nexport const applySlotAppend = applySlotAppendHtml;\nexport function applySlotReplaceChildrenHtml(id: string): MethodDecorator {\n  return applySlot(id, { position: 'replaceChildrenHtml' });\n}\nexport const applySlotReplaceChildren = applySlotReplaceChildrenHtml;\nexport function applySlotReplaceChildrenText(id: string): MethodDecorator {\n  return applySlot(id, { position: 'replaceChildrenText' });\n}\n"],
+  "mappings": ";;;;;;;;;;;;;;;;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,kBAA6B;AAC7B,2BAA6C;AAE7C,mBAAyB;AACzB,sBAAuB;AAiChB,MAAM,0BAA0B,OAAO,IAAI,iCAAiC;AA4C5E,SAAS,UAAU,IAAY,UAA4B,EAAE,UAAU,sBAAsB,GAAwC;AAC1I,SAAO,CAAC,WAAmB,aAA8B,eAAoC;AAC3F,UAAM,OAAO,eAAe,SAAY,aAAa;AAErD,QAAI,SAAS,YAAY;AACjB,aAAO,eAAe,WAAW,aAAa;AAAA,QAC5C,MAAe;AACb,gBAAM,WAAW,IAAI,yBAAS,MAAM,GAAG,KAAK,MAAM,IAAI,EAAE,EAAE;AAC1D,iBAAO;AAAA,QACT;AAAA,QACA,cAAc;AAAA,QACd,YAAY;AAAA,MACd,CAAC;AAAA,IAGT;AAEA,UAAM,cAAc,UAAU;AAC9B,QAAI,WAAW,yBAAa,eAAe,yBAAyB,WAAW;AAC/E,QAAI,CAAC,UAAU;AACb,iBAAW,CAAC;AACZ,+BAAa,eAAe,yBAAyB,UAAU,WAAW;AAAA,IAC5E;AACA,aAAS,KAAK,EAAE,aAAa,IAAI,MAAM,QAAQ,CAAC;AAIhD,QAAI,SAAS,UAAU;AACrB,YAAM,WAAW,WAAW;AAC5B,iBAAW,QAAQ,YAAa,MAAa;AAC3C,6CAAW,IAAI;AAEf,cAAM,WAAO,uCAAiB,IAAI;AAClC,cAAM,aAAc,KAAa,iBAAiB,IAAI,MAAO,OAAO,WAAW,cAAc,SAAS;AACtG,cAAM,aAAa,WAAW;AAC9B,cAAM,UAAU,sBAAS,oBAAoB,YAAY,IAAI;AA0B7D,cAAM,MAAM,SAAS,MAAM,MAAM,IAAI;AA0BrC,YAAI,KAAK;AACP,gBAAM,WAAW,IAAI,yBAAS,MAAM,GAAG,KAAK,MAAM,IAAI,EAAE,EAAE;AAC1D,gBAAM,MAAM,QAAQ,YAAY;AAChC,gBAAM,MAAM,WAAW;AAKvB,cAAI,QAAQ,uBAAuB;AACjC,qBAAS,oBAAoB,GAAG;AAAA,UAClC,WAAW,QAAQ,uBAAuB;AACxC,qBAAS,oBAAoB,GAAG;AAAA,UAClC,WAAW,QAAQ,cAAc;AAC/B,qBAAS,WAAW,GAAG;AAAA,UACzB,WAAW,QAAQ,cAAc;AAC/B,qBAAS,WAAW,GAAG;AAAA,UACzB,WAAW,QAAQ,eAAe;AAChC,qBAAS,YAAY,GAAG;AAAA,UAC1B,WAAW,QAAQ,eAAe;AAChC,qBAAS,YAAY,GAAG;AAAA,UAC1B,WAAW,QAAQ,SAAS;AAC1B,qBAAS,MAAM;AAAA,UACjB;AAAA,QACF;AACA,eAAO;AAAA,MACT;AAAA,IACF;AAAA,EACF;AACF;AAGO,MAAM,2BAA2B,CAAC,WAAqC;AAC5E,QAAM,cAAc,kBAAkB,WAAW,SAAS,OAAO;AACjE,SAAO,yBAAa,YAAY,yBAAyB,WAAW;AACtE;AAEO,SAAS,eAAe,IAA6B;AAC1D,SAAO,UAAU,IAAI,EAAE,UAAU,QAAQ,CAAC;AAC5C;AACO,SAAS,qBAAqB,IAA6B;AAChE,SAAO,UAAU,IAAI,EAAE,UAAU,cAAc,CAAC;AAClD;AACO,MAAM,mBAAmB;AACzB,SAAS,qBAAqB,IAA6B;AAChE,SAAO,UAAU,IAAI,EAAE,UAAU,cAAc,CAAC;AAClD;AACO,SAAS,oBAAoB,IAA6B;AAC/D,SAAO,UAAU,IAAI,EAAE,UAAU,aAAa,CAAC;AACjD;AACO,SAAS,oBAAoB,IAA6B;AAC/D,SAAO,UAAU,IAAI,EAAE,UAAU,aAAa,CAAC;AACjD;AACO,MAAM,kBAAkB;AACxB,SAAS,6BAA6B,IAA6B;AACxE,SAAO,UAAU,IAAI,EAAE,UAAU,sBAAsB,CAAC;AAC1D;AACO,MAAM,2BAA2B;AACjC,SAAS,6BAA6B,IAA6B;AACxE,SAAO,UAAU,IAAI,EAAE,UAAU,sBAAsB,CAAC;AAC1D;",
+  "names": []
+}

package/dist/cjs/decorators/elementDefine.js

@@ -37,6 +37,8 @@ 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");
+var import_SwcApp = require("../elements/SwcApp");
+var import_applySlot = require("./applySlot");
 const ELEMENT_CONFIG_KEY = Symbol.for("simple-web-component:element-config");
 const getElementConfig = (target) => {
   const constructor = target instanceof Function ? target : target.constructor;
@@ -44,7 +46,7 @@ const getElementConfig = (target) => {
 };
 const ensureInit = (inst) => {
   if (!inst.__swc_initialized) {
-    inst._swcId = Math.random().toString(36).substring(2, 11);
+    inst._swcId = inst?.getAttribute?.("swc-use-ssr") ?? Math.random().toString(36).substring(2, 11);
     inst._emitHandlers = /* @__PURE__ */ new Map();
     inst._boundListeners = [];
     inst.__swc_initialized = true;
@@ -65,6 +67,12 @@ const ensureInit = (inst) => {
         delete inst[meta.propertyKey];
       });
     }
+    const slotAllList = (0, import_applySlot.findAllApplySlotMetadata)(target);
+    if (slotAllList) {
+      slotAllList.filter((it) => it.type === "property").forEach((meta) => {
+        delete inst[meta.propertyKey];
+      });
+    }
     const hostSet = import_Utils.SwcUtils.getHostSet(inst);
     const appHosts = import_Utils.SwcUtils.findAllAppHostsIncludingSelfDirect(inst);
     inst._executeSwcScript?.("swc-on-constructor", hostSet);
@@ -107,7 +115,7 @@ const getHandlers = (inst) => {
   if (!inst.__swc_attributeEventHandlers) inst.__swc_attributeEventHandlers = /* @__PURE__ */ new Map();
   return inst.__swc_attributeEventHandlers;
 };
-const setupPrototype = (proto) => {
+const setupPrototype = (proto, win) => {
   if (proto.__swc_proto_setup) return;
   proto.__swc_proto_setup = true;
   proto._executeSwcScript = function(attrName, hostSet, extraArgs = {}) {
@@ -138,7 +146,7 @@ const setupPrototype = (proto) => {
   proto._invokeLifecycleMethod = function(methodName, hostSet, extraArgs = []) {
     ensureInit(this);
     if (typeof this[methodName] !== "function") return;
-    const useHostSet = hostSet ?? import_Utils.SwcUtils.getHostSet(this);
+    const useHostSet = hostSet ?? import_Utils.SwcUtils.getHelperAndHostSet(win, this);
     const app = useHostSet?.$appHost?.simpleApplication;
     if (app) {
       const otherStorage = /* @__PURE__ */ new Map();
@@ -243,61 +251,57 @@ const elementDefine = (name, config = {}) => (constructor) => {
   const hostAttributes = attributeList.filter((it) => it.selector === "$this").map((it) => it.options.name || String(it.propertyKey));
   const originalStaticObservedAttributes = constructor.observedAttributes ?? [];
   const mergedObservedAttributes = [.../* @__PURE__ */ new Set([...metadata.observedAttributes ?? [], ...originalStaticObservedAttributes, ...attrChangeMap.keys(), ...attributeApplyNames, ...hostAttributes, ...emitHostCustomEventList.map((it) => it.options.attributeName).filter(Boolean), ...swcLifecycleAttributes, ...swcOnEvents])];
-  const connectedInnerHtmlList = (0, import_lifecycles.getOnConnectedInnerHtmlMetadata)(constructor) || [];
   const proto = constructor.prototype;
-  setupPrototype(proto);
+  setupPrototype(proto, win);
   let helperHostSet = null;
   const originalConnected = proto.connectedCallback;
   proto.connectedCallback = async function() {
     ensureInit(this);
     helperHostSet = import_Utils.SwcUtils.getHelperAndHostSet(win, this);
     const appHost = helperHostSet.$appHost;
+    const useSsr = (0, import_SwcApp.isSSR)(this);
     try {
       if (appHost && typeof appHost._connected === "function") {
         await appHost._connected(this);
       } else if (appHost && typeof appHost) {
-        appHost._connected_safari ?? (appHost._connected_safari = []);
-        appHost._connected_safari.push(this);
+        appHost._connected_safari_and_standby ?? (appHost._connected_safari_and_standby = []);
+        appHost._connected_safari_and_standby.push(this);
       }
       const conf = getElementConfig(this);
       const currentWin = this._resolveWindow(conf);
-      const shadowMode = conf?.useShadow || connectedInnerHtmlList.find((it) => it.options.useShadow)?.options.useShadow;
+      const bMethods = (0, import_lifecycles.getOnConnectedBeforeMetadata)(this).filter((it) => useSsr ? !it.options.ssrFirst : true);
+      if (bMethods) {
+        for (const m of bMethods) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
+      }
+      this._executeSwcScript("swc-on-before-connected", helperHostSet);
+      const targetConnectedInnerHtmlList = (0, import_lifecycles.getOnConnectedInnerHtmlMetadata)(constructor).filter((it) => useSsr ? !it.options.ssrFirst : true);
+      const shadowMode = conf?.useShadow || targetConnectedInnerHtmlList.find((it) => it.options.useShadow)?.options.useShadow;
       if (shadowMode && !this.shadowRoot) {
         const mode = shadowMode === true ? "open" : shadowMode;
         this.attachShadow({ mode });
       }
-      const bMethods = (0, import_lifecycles.findAllLifecycleMetadata)(this, import_lifecycles.ON_BEFORE_CONNECTED_METADATA_KEY);
-      if (bMethods) {
-        for (const m of bMethods) await this._invokeLifecycleMethod(m, helperHostSet);
-      }
-      this._executeSwcScript("swc-on-before-connected", helperHostSet);
-      if (connectedInnerHtmlList.length > 0) {
+      if (targetConnectedInnerHtmlList.length > 0) {
         let sContent = "", lContent = "";
-        for (const meta of connectedInnerHtmlList) {
+        for (const meta of targetConnectedInnerHtmlList) {
           let res = await this._invokeLifecycleMethod(meta.propertyKey, helperHostSet);
           const actionExpression = new import_core.ActionExpression(res, {
             expression: {
               replace: {
-                start: meta.options.replaceWrap?.start || "{%{",
-                end: meta.options.replaceWrap?.end || "}%}"
+                start: meta.options.replaceWrap?.start || "[[",
+                end: meta.options.replaceWrap?.end || "]]"
               },
               callReturn: {
-                start: meta.options.replaceWrap?.start || "{%{=",
-                end: meta.options.replaceWrap?.end || "}%}"
+                start: meta.options.replaceWrap?.start || "[[=",
+                end: meta.options.replaceWrap?.end || "]]"
               },
               call: {
-                start: meta.options.replaceWrap?.start || "{%{@",
-                end: meta.options.replaceWrap?.end || "}%}"
+                start: meta.options.replaceWrap?.start || "[[@",
+                end: meta.options.replaceWrap?.end || "]]"
               }
             }
           });
           actionExpression.getExpressions().filter((it) => it.type === "replace").forEach((it) => {
-            try {
-              const sr = import_core.FunctionUtils.executeReturn({ script: it.script, context: this, args: helperHostSet });
-              actionExpression.replace(it, sr);
-            } catch (e) {
-              console.error(`[SWC] Failed to execute connectedInnerHTML:`, e);
-            }
+            actionExpression.replace(it, import_core_web.NodeSlot.slot(`${this._swcId}-${it.script}`));
           });
           res = actionExpression.getUnprocessedTemplate();
           if (res !== void 0) {
@@ -445,9 +449,11 @@ const elementDefine = (name, config = {}) => (constructor) => {
         });
       });
       if (originalConnected) await originalConnected.apply(this);
-      const aMethods = (0, import_lifecycles.findAllLifecycleMetadata)(this, import_lifecycles.ON_AFTER_CONNECTED_METADATA_KEY);
+      const aMethods = (0, import_lifecycles.getOnConnectedAfterMetadata)(this).filter((it) => {
+        return useSsr ? !it.options.ssrFirst : true;
+      });
       if (aMethods) {
-        for (const m of aMethods) await this._invokeLifecycleMethod(m, helperHostSet);
+        for (const m of aMethods) await this._invokeLifecycleMethod(m.propertyKey, helperHostSet);
       }
       this._executeSwcScript("swc-on-connected", helperHostSet);
       this._executeSwcScript("swc-on-after-connected", helperHostSet);
@@ -463,6 +469,9 @@ const elementDefine = (name, config = {}) => (constructor) => {
         }
       }
     } finally {
+      for (let mPropertyKey of (0, import_lifecycles.findAllLifecycleMetadata)(this, import_lifecycles.ON_CONNECTED_COMPLETED_METADATA_KEY)) {
+        await this._invokeLifecycleMethod(mPropertyKey, helperHostSet);
+      }
       if (appHost && typeof appHost._connectedDone === "function") {
         await appHost._connectedDone(this);
       }
@@ -470,7 +479,6 @@ const elementDefine = (name, config = {}) => (constructor) => {
   };
   const originalDisconnected = proto.disconnectedCallback;
   proto.disconnectedCallback = function() {
-    console.log("disconnnnnnnnnnnnnnnnnnn", helperHostSet, this);
     const appHost = helperHostSet.$appHost;
     if (appHost && typeof appHost._disconnected === "function") {
       appHost._disconnected(this);