@dooboostore/dom-render 1.0.111 → 1.0.113

package/src/operators/DrForm.ts

@@ -1,11 +1,11 @@
-import {ScriptUtils} from '@dooboostore/core-web/script/ScriptUtils';
 import {RawSet} from '../rawsets/RawSet';
-import {Validator} from '../validators/Validator';
+import {Validator} from '@dooboostore/core';
 import {EventManager} from '../events/EventManager';
-import {ValidatorArray} from '../validators/ValidatorArray';
+import {ValidatorArray} from '@dooboostore/core';
 import {Render} from '../rawsets/Render';
 import {OperatorExecuterAttrRequire} from './OperatorExecuterAttrRequire';
 import {AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source} from './OperatorExecuter';
+import {ObjectUtils} from "@dooboostore/core";
 
 export class DrForm extends OperatorExecuterAttrRequire<string> {
     constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {
@@ -14,11 +14,11 @@ export class DrForm extends OperatorExecuterAttrRequire<string> {
 
     async executeAttrRequire(attr: string): Promise<ExecuteState> {
         RawSet.drFormOtherMoveAttr(this.elementSource.element, 'name', 'temp-name', this.source.config);
-        const data = ScriptUtils.evaluateReturn(`${attr}`, this.source.obj);
+        const data = ObjectUtils.Script.evaluateReturn(`${attr}`, this.source.obj);
 
         const childs = Array.from(this.elementSource.element.querySelectorAll('[name]'));
 
-        const fromName = ScriptUtils.evaluateReturn(this.elementSource.element.getAttribute(`${RawSet.DR_FORM_NAME}:name`) ?? '', this.source.obj);
+        const fromName = ObjectUtils.Script.evaluateReturn(this.elementSource.element.getAttribute(`${RawSet.DR_FORM_NAME}:name`) ?? '', this.source.obj);
         const thisName = fromName ?? this.elementSource.element.getAttribute('name');
         // // 자기자신이 Input 대상일때
         if (childs.length <= 0 && thisName) {
@@ -32,10 +32,10 @@ export class DrForm extends OperatorExecuterAttrRequire<string> {
             const eventName = it.getAttribute(`${RawSet.DR_FORM_NAME}:event`) ?? 'change'
             const validatorName = it.getAttribute(`${RawSet.DR_FORM_NAME}:validator`);
             const attrEventName = EventManager.attrPrefix + 'event-' + eventName;
-            let varpath = ScriptUtils.evaluateReturn(this.elementSource.element.getAttribute(`${RawSet.DR_FORM_NAME}:name`) ?? '', this.source.obj) ?? it.getAttribute('name');
+            let varpath = ObjectUtils.Script.evaluateReturn(this.elementSource.element.getAttribute(`${RawSet.DR_FORM_NAME}:name`) ?? '', this.source.obj) ?? it.getAttribute('name');
             if (varpath != null) {
                 if (validatorName) {
-                    ScriptUtils.evaluate(`
+                    ObjectUtils.Script.evaluate(`
                                 ${this.render.bindScript}
                                 const validator = typeof ${validatorName} ==='function' ?  new  ${validatorName}() : ${validatorName};
                                 ${attr}['${varpath}'] = validator;
@@ -49,7 +49,7 @@ export class DrForm extends OperatorExecuterAttrRequire<string> {
                     ));
                 }
                 varpath = `${attr}['${varpath}']`;
-                const data = ScriptUtils.evaluateReturn(`${varpath}`, this.source.obj);
+                const data = ObjectUtils.Script.evaluateReturn(`${varpath}`, this.source.obj);
                 if (data instanceof ValidatorArray) {
                     it.setAttribute(attrEventName, `${varpath}.setArrayValue($target, $target.value, $event); ${it.getAttribute(attrEventName) ?? ''};`);
                     data.addValidator((it as any).value, it);

package/src/operators/DrIf.ts

@@ -1,9 +1,8 @@
 import { OperatorExecuterAttrRequire } from './OperatorExecuterAttrRequire';
-import { ScriptUtils } from '@dooboostore/core-web/script/ScriptUtils';
 import { RawSet } from '../rawsets/RawSet';
 import { Render } from '../rawsets/Render';
 import { AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source } from './OperatorExecuter';
-import { ObjectUtils } from '@dooboostore/core/object/ObjectUtils';
+import { ObjectUtils } from '@dooboostore/core';
 
 export class DrIf extends OperatorExecuterAttrRequire<string> {
   constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {

package/src/operators/DrInnerHTML.ts

@@ -1,8 +1,8 @@
 import {OperatorExecuterAttrRequire} from './OperatorExecuterAttrRequire';
-import {ScriptUtils} from '@dooboostore/core-web/script/ScriptUtils';
 import {RawSet} from '../rawsets/RawSet';
 import {Render} from '../rawsets/Render';
 import {AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source} from './OperatorExecuter';
+import {ObjectUtils} from "@dooboostore/core";
 
 export class DrInnerHTML extends OperatorExecuterAttrRequire<string> {
     constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {
@@ -11,7 +11,7 @@ export class DrInnerHTML extends OperatorExecuterAttrRequire<string> {
 
     async executeAttrRequire(attr: string): Promise<ExecuteState> {
         const newTemp = this.source.config.window.document.createElement('temp');
-        ScriptUtils.evaluate(`
+      ObjectUtils.Script.evaluate(`
                         ${this.render.bindScript}
                         const n = $element.cloneNode(true);
                         ${this.elementSource.attrs.drBeforeOption ?? ''}

package/src/operators/DrInnerText.ts

@@ -1,9 +1,8 @@
 import {OperatorExecuterAttrRequire} from './OperatorExecuterAttrRequire';
-import {ScriptUtils} from '@dooboostore/core-web/script/ScriptUtils';
 import {RawSet} from '../rawsets/RawSet';
 import {Render} from '../rawsets/Render';
 import {AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source} from './OperatorExecuter';
-import {ObjectUtils} from '@dooboostore/core/object/ObjectUtils';
+import {ObjectUtils} from '@dooboostore/core';
 
 export class DrInnerText extends OperatorExecuterAttrRequire<string> {
     constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {

package/src/operators/DrRepeat.ts

@@ -1,9 +1,9 @@
 import {OperatorExecuterAttrRequire} from './OperatorExecuterAttrRequire';
-import {ScriptUtils} from '@dooboostore/core-web/script/ScriptUtils';
 import {RawSet} from '../rawsets/RawSet';
 import {EventManager} from '../events/EventManager';
 import {Render} from '../rawsets/Render';
 import {AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source} from './OperatorExecuter';
+import {ObjectUtils} from "@dooboostore/core";
 
 export class DrRepeat extends OperatorExecuterAttrRequire<string> {
     constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {
@@ -15,7 +15,7 @@ export class DrRepeat extends OperatorExecuterAttrRequire<string> {
         const itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
         const vars = RawSet.drVarEncoding(this.elementSource.element, this.elementSource.attrs.drVarOption ?? '');
         const newTemp = this.source.config.window.document.createElement('temp');
-        ScriptUtils.evaluate(`
+      ObjectUtils.Script.evaluate(`
                     ${this.render.bindScript}
                     ${this.elementSource.attrs.drBeforeOption ?? ''}
                     var i = 0; 

package/src/operators/DrStripElement.ts

@@ -1,8 +1,8 @@
 import { OperatorExecuterAttrRequire } from './OperatorExecuterAttrRequire';
-import { ScriptUtils } from '@dooboostore/core-web/script/ScriptUtils';
 import { RawSet } from '../rawsets/RawSet';
 import { Render } from '../rawsets/Render';
 import { AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source } from './OperatorExecuter';
+import {ObjectUtils} from "@dooboostore/core";
 
 export class DrStripElement extends OperatorExecuterAttrRequire<string> {
   constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {
@@ -15,7 +15,7 @@ export class DrStripElement extends OperatorExecuterAttrRequire<string> {
     // const vars = RawSet.drVarEncoding(this.elementSource.element, this.elementSource.attrs.drVarOption ?? '');
     const newTemp = this.source.config.window.document.createElement('temp');
     // Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drIf' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v)); <-- 이부분은 다른 attr에도 적용을 할지말지 생각해야됨  엘리먼트 존재유무에 따라서 적용을 할지말지 결정해야됨
-    ScriptUtils.evaluate(`
+    ObjectUtils.Script.evaluate(`
                 ${this.render.bindScript}
                 ${this.elementSource.attrs.drBeforeOption ?? ''}
                 const n = $element.cloneNode(true);

package/src/operators/DrTargetElement.ts

@@ -1,4 +1,4 @@
-import { ScriptUtils } from '@dooboostore/core-web/script/ScriptUtils';
+import { ObjectUtils } from '@dooboostore/core';
 import { RawSet } from '../rawsets/RawSet';
 import { CreatorMetaData } from '../rawsets/CreatorMetaData';
 import {
@@ -10,7 +10,8 @@ import {
   Source
 } from './OperatorExecuter';
 import { Render } from '../rawsets/Render';
-import { ElementUtils } from '@dooboostore/core-web/element/ElementUtils';
+import { TargetElement } from '../configs';
+import { DomRenderComponentMetaKey } from '../rawsets';
 
 declare global {
   interface Window {
@@ -33,16 +34,27 @@ export class DrTargetElement extends OperatorExecuter<void> {
   }
 
   async execute(): Promise<ExecuteState> {
-    const targetElement = this.source.config?.targetElements?.find(
-      it => it.name.toLowerCase() === this.elementSource.element.tagName.toLowerCase()
-    );
+    let targetElement: TargetElement | undefined = undefined;
+    let isTargetElementElement = this.elementSource.element.tagName.toLowerCase() === RawSet.DR_TARGET_ELEMENT_ELEMENTNAME.toLowerCase();
+    if (isTargetElementElement){
+      const targetElementTagName = this.elementSource.element.getAttribute(`${RawSet.DR_TARGET_ELEMENT_ELEMENTNAME}:is`)?.toLowerCase();
+      targetElement = this.source.config?.targetElements?.find(
+        it => it.name.toLowerCase() === targetElementTagName
+      );
+    } else {
+      targetElement = this.source.config?.targetElements?.find(
+        it => it.name.toLowerCase() === this.elementSource.element.tagName.toLowerCase()
+      );
+    }
+    // console.log('--------------tar', isTargetElementElement, targetElement, this.elementSource.element.tagName);
+
     if (targetElement) {
       if (
         this.rawSet.point.start instanceof this.source.config.window.HTMLMetaElement &&
         this.rawSet.point.end instanceof this.source.config.window.HTMLMetaElement
       ) {
-        this.rawSet.point.start.setAttribute('this-path', `this.__domrender_components.${this.rawSet.uuid}`);
-        this.rawSet.point.end.setAttribute('this-path', `this.__domrender_components.${this.rawSet.uuid}`);
+        this.rawSet.point.start.setAttribute('this-path', `this.${DomRenderComponentMetaKey.DOMRENDER_COMPONENTS_KEY}.${this.rawSet.uuid}`);
+        this.rawSet.point.end.setAttribute('this-path', `this.${DomRenderComponentMetaKey.DOMRENDER_COMPONENTS_KEY}.${this.rawSet.uuid}`);
       }
 
       const documentFragment = await targetElement.callBack(
@@ -71,7 +83,7 @@ export class DrTargetElement extends OperatorExecuter<void> {
           this.rawSet.detect = {
             action: () => {
               const script = `var $component = this.__render.component; var $element = this.__render.element; var $innerHTML = this.__render.innerHTML; var $attribute = this.__render.attribute;  ${detectAction} `;
-              ScriptUtils.evaluate(
+              ObjectUtils.Script.evaluate(
                 script,
                 Object.assign(this.source.obj, {
                   __render: this.rawSet.dataSet.render

package/src/operators/DrTargetElementIsElement.ts

@@ -2,7 +2,8 @@ import { RawSet } from '../rawsets/RawSet';
 import { CreatorMetaData } from '../rawsets/CreatorMetaData';
 import { AfterCallBack, ElementSource, ExecuteState, OperatorExecuter, ReturnContainer, Source } from './OperatorExecuter';
 import { Render } from '../rawsets/Render';
-import { ScriptUtils } from '@dooboostore/core-web/script/ScriptUtils';
+import { ObjectUtils } from '@dooboostore/core';
+import { DomRenderComponentMetaKey } from '../rawsets';
 
 
 // 여기서 사용자가 등록한 TargetElement가 들어간다.
@@ -20,8 +21,8 @@ export class DrTargetElementIsElement extends OperatorExecuter<string | null> {
     // console.log('--------------tar', targetElement)
     if (targetElement) {
       if (this.rawSet.point.start instanceof this.source.config.window.HTMLMetaElement && this.rawSet.point.end instanceof this.source.config.window.HTMLMetaElement) {
-        this.rawSet.point.start.setAttribute('this-path', `this.__domrender_components.${this.rawSet.uuid}`)
-        this.rawSet.point.end.setAttribute('this-path', `this.__domrender_components.${this.rawSet.uuid}`)
+        this.rawSet.point.start.setAttribute('this-path', `this.${DomRenderComponentMetaKey.DOMRENDER_COMPONENTS_KEY}.${this.rawSet.uuid}`)
+        this.rawSet.point.end.setAttribute('this-path', `this.${DomRenderComponentMetaKey.DOMRENDER_COMPONENTS_KEY}.${this.rawSet.uuid}`)
       }
 
 
@@ -34,7 +35,7 @@ export class DrTargetElementIsElement extends OperatorExecuter<string | null> {
           this.rawSet.detect = {
             action: () => {
               const script = `var $component = this.__render.component; var $element = this.__render.element; var $innerHTML = this.__render.innerHTML; var $attribute = this.__render.attribute;  ${detectAction} `;
-              ScriptUtils.evaluate(script, Object.assign(this.source.obj, {
+              ObjectUtils.Script.evaluate(script, Object.assign(this.source.obj, {
                 __render: this.rawSet.dataSet.render
               }))
             }

package/src/operators/DrThis.ts

@@ -4,7 +4,7 @@ import { ComponentSet } from '../components/ComponentSet';
 import { ExecuteState } from './OperatorExecuter';
 import { isOnDrThisUnBind } from '../lifecycle/dr-this/OnDrThisUnBind';
 import { isOnDrThisBind } from '../lifecycle/dr-this/OnDrThisBind';
-import { ScriptUtils } from '@dooboostore/core-web/script/ScriptUtils';
+import { ObjectUtils } from '@dooboostore/core';
 import { Render } from '../rawsets/Render';
 
 export class DrThis extends OperatorExecuterAttrRequire<string> {
@@ -12,7 +12,7 @@ export class DrThis extends OperatorExecuterAttrRequire<string> {
     // const e = this.elementSource;
     // console.log('drThis!!!!!!!!!!!!!', this.elementSource.attrs.drDetectIfOption, this.elementSource.attrs.drIfOption);
     const optionIf = this.elementSource.attrs.drDetectIfOption ?? this.elementSource.attrs.drIfOption;
-    const ok = ScriptUtils.evaluate(`
+    const ok = ObjectUtils.Script.evaluate(`
                 ${this.render.bindScript}
                 try {
                   const ok  = ${this.elementSource.attrs.drThis};

package/src/operators/DrThisProperty.ts

@@ -1,9 +1,10 @@
 import {OperatorExecuterAttrRequire} from './OperatorExecuterAttrRequire';
-import {ScriptUtils} from '@dooboostore/core-web/script/ScriptUtils';
+import {ScriptUtils} from '@dooboostore/core-web';
 import {RawSet} from '../rawsets/RawSet';
 import {Render} from '../rawsets/Render';
 import {AfterCallBack, ElementSource, ExecuteState, ReturnContainer, Source} from './OperatorExecuter';
 import {DomRenderConfig} from '../configs/DomRenderConfig';
+import {ObjectUtils} from "@dooboostore/core";
 
 export class DrThisProperty extends OperatorExecuterAttrRequire<string> {
     constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack) {
@@ -23,7 +24,7 @@ export class DrThisProperty extends OperatorExecuterAttrRequire<string> {
         // }
         // await new Promise(resolve => setTimeout(resolve, 1000));
         // console.log('!!!!!!!!!!!!!!', this.rawSet);
-        ScriptUtils.evaluate(`
+      ObjectUtils.Script.evaluate(`
                     ${this.render.bindScript}
                     ${this.elementSource.attrs.drBeforeOption ?? ''}
                     var i = 0; 

package/src/operators/OperatorExecuter.ts

@@ -5,7 +5,7 @@ import { RawSet } from '../rawsets/RawSet';
 import { Render } from '../rawsets/Render';
 import { Attrs } from '../rawsets/Attrs';
 import { DomRenderConfig } from '../configs/DomRenderConfig';
-import { ObjectUtils } from '@dooboostore/core/object/ObjectUtils';
+import { ObjectUtils } from '@dooboostore/core';
 
 export interface OperatorAround {
   beforeAttr?: (value: string | null | undefined, opratorExecutor: OperatorExecuter) => string | null | undefined,

package/src/rawsets/Attrs.ts

@@ -1,28 +1,33 @@
 export type Attrs = {
-    dr: string | null;
-    drIf: string | null;
-    drAppender: string | null;
-    drFor: string | null;
-    drForOf: string | null;
-    drThisProperty: string | null;
-    drRepeat: string | null;
-    drThis: string | null;
-    drStripElement: string | null;
-    drReplaceTargetElementIs: string | null;
-    drForm: string | null;
-    drPre: string | null;
-    drInnerHTML: string | null;
-    drInnerText: string | null;
-    drItOption: string | null;
-    drVarOption: string | null;
-    drAfterOption: string | null;
-    drNextOption: string | null;
-    drBeforeOption: string | null;
-    drCompleteOption: string | null;
-    drStripOption: string | null;
-    drIfOption: string | null;
-    drDetectIfOption: string | null;
-    drDestroyOption: string | null;
-    drHasKeysOption: string | null;
-    drKeyOption: string | null;
-}
+  dr: string | null;
+  drIf: string | null;
+  drAppender: string | null;
+  drFor: string | null;
+  drForOf: string | null;
+  drThisProperty: string | null;
+  drRepeat: string | null;
+  drThis: string | null;
+  drStripElement: string | null;
+  drReplaceTargetElementIs: string | null;
+  drForm: string | null;
+  drPre: string | null;
+  drInnerHTML: string | null;
+  drInnerText: string | null;
+  drItOption: string | null;
+  drVarOption: string | null;
+  drAfterOption: string | null;
+  drNextOption: string | null;
+  drBeforeOption: string | null;
+  drCompleteOption: string | null;
+  drStripOption: string | null;
+  drIfOption: string | null;
+  drDetectIfOption: string | null;
+  drDestroyOption: string | null;
+  drHasKeysOption: string | null;
+  drKeyOption: string | null;
+  drItemIndexOffsetOption: string | null;
+  drVariableNameOption: string | null;
+  drItemVariableNameOption: string | null;
+  drItemIndexVariableNameOption: string | null;
+  drItemOffsetIndexVariableNameOption: string | null;
+};

package/src/rawsets/CreatorMetaData.ts

@@ -1,4 +1,4 @@
-import {Router} from '../routers/Router';
+import {Router} from '@dooboostore/core-web';
 import {Attrs} from './Attrs';
 import {RawSet} from './RawSet';