dom-render 1.0.88 → 1.0.91

package/dist/bundle.js

@@ -947,7 +947,6 @@ var EventManager = /** @class */ (function () {
     EventManager.ownerVariablePathAttrName = 'dr-owner-variable-path';
     EventManager.attrPrefix = 'dr-';
     EventManager.onInitAttrName = EventManager.attrPrefix + 'on-init';
-    // public static readonly onComponentInitAttrName = EventManager.attrPrefix + 'on-component-init';
     EventManager.valueAttrName = EventManager.attrPrefix + 'value';
     EventManager.valueLinkAttrName = EventManager.attrPrefix + 'value-link';
     EventManager.attrAttrName = EventManager.attrPrefix + 'attr';
@@ -980,106 +979,155 @@ exports.ExecuteState = void 0;
     ExecuteState[ExecuteState["NO_EXECUTE"] = 1] = "NO_EXECUTE";
     ExecuteState[ExecuteState["STOP"] = 2] = "STOP";
 })(exports.ExecuteState || (exports.ExecuteState = {}));
-var OperatorRender = /** @class */ (function () {
-    function OperatorRender(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+var OperatorExecuter = /** @class */ (function () {
+    function OperatorExecuter(rawSet, render, returnContainer, elementSource, source, afterCallBack, startingExecute) {
+        if (startingExecute === void 0) { startingExecute = true; }
         this.rawSet = rawSet;
         this.render = render;
         this.returnContainer = returnContainer;
         this.elementSource = elementSource;
         this.source = source;
         this.afterCallBack = afterCallBack;
+        this.startingExecute = startingExecute;
     }
-    return OperatorRender;
+    OperatorExecuter.prototype.start = function () {
+        var _a, _b, _c, _d, _e, _f;
+        var attrValue = this.elementSource.attr;
+        if ((_a = this.source.operatorAround) === null || _a === void 0 ? void 0 : _a.beforeAttr) {
+            attrValue = (_b = this.source.operatorAround.beforeAttr(attrValue, this)) !== null && _b !== void 0 ? _b : '';
+        }
+        var r = attrValue;
+        if (r && this.startingExecute) {
+            r = ScriptUtils.eval(" ".concat(this.render.bindScript, "; return ").concat(attrValue), Object.assign(this.source.obj, { __render: this.render }));
+        }
+        if ((_c = this.source.operatorAround) === null || _c === void 0 ? void 0 : _c.before) {
+            r = (_d = this.source.operatorAround) === null || _d === void 0 ? void 0 : _d.before(r, this);
+        }
+        var state = this.execute(r);
+        (_f = (_e = this.source.operatorAround) === null || _e === void 0 ? void 0 : _e.after) === null || _f === void 0 ? void 0 : _f.call(_e, r, this);
+        return state;
+    };
+    return OperatorExecuter;
 }());
 
 var DrPre = /** @class */ (function (_super) {
     __extends(DrPre, _super);
-    function DrPre() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrPre(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack) || this;
+        return _this;
     }
-    DrPre.prototype.execRender = function () {
-        return (this.elementSource.attrs.drPre != null) ? exports.ExecuteState.EXECUTE : exports.ExecuteState.NO_EXECUTE;
+    DrPre.prototype.execute = function (value) {
+        return (value != null) ? exports.ExecuteState.EXECUTE : exports.ExecuteState.NO_EXECUTE;
     };
     return DrPre;
-}(OperatorRender));
+}(OperatorExecuter));
+
+// export type OperatorAround = {
+//     beforeAttr?: (value: string, obj: any) => string,
+//     before?: (data: any, obj: any) => any,
+//     after?: (data: any, obj: any) => void,
+// }
+//
+// export enum ExecuteState {
+//     EXECUTE,
+//     NO_EXECUTE,
+//     STOP
+// }
+//
+// export type AfterCallBack = {
+//     onAttrInitCallBacks: AttrInitCallBack[],
+//     onElementInitCallBacks: ElementInitCallBack[],
+//     onThisComponentSetCallBacks: ComponentSet[]
+// }
+var OperatorExecuterAttrRequire = /** @class */ (function (_super) {
+    __extends(OperatorExecuterAttrRequire, _super);
+    function OperatorExecuterAttrRequire(rawSet, render, returnContainer, elementSource, source, afterCallBack, startingExecute) {
+        if (startingExecute === void 0) { startingExecute = true; }
+        return _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, startingExecute) || this;
+    }
+    // executes(): ExecuteState {
+    //      return ExecuteState.EXECUTE;
+    //  }
+    OperatorExecuterAttrRequire.prototype.execute = function (data) {
+        if (!this.elementSource.attr) {
+            return exports.ExecuteState.NO_EXECUTE;
+        }
+        return this.executeAttrRequire(data);
+    };
+    return OperatorExecuterAttrRequire;
+}(OperatorExecuter));
 
 var Dr = /** @class */ (function (_super) {
     __extends(Dr, _super);
-    function Dr() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function Dr(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        return _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack) || this;
     }
-    Dr.prototype.execRender = function () {
+    Dr.prototype.executeAttrRequire = function (data) {
         var _a;
         var _b, _c;
-        if (this.elementSource.attrs.dr !== null && this.elementSource.attrs.dr.length >= 0) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                        ".concat(this.render.bindScript, "\n                        const n = $element.cloneNode(true);\n                        var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                        if (destIt !== undefined) {\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt)))\n                            // console.log('----', n.innerHTML);\n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt);\n                            // console.log('----', n.innerHTML);\n                        }\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }"), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
-            }));
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_c = this.elementSource.element.parentNode) === null || _c === void 0 ? void 0 : _c.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    const n = $element.cloneNode(true);\n                    var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                    if (destIt !== undefined) {\n                        n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt)))\n                        // console.log('----', n.innerHTML);\n                        n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt);\n                        // console.log('----', n.innerHTML);\n                    }\n                    if (this.__render.drStripOption === 'true') {\n                        Array.from(n.childNodes).forEach(it => this.__fag.append(it));\n                    } else {\n                        this.__render.fag.append(n);\n                    }"), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
+        }));
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_c = this.elementSource.element.parentNode) === null || _c === void 0 ? void 0 : _c.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return Dr;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrIf = /** @class */ (function (_super) {
     __extends(DrIf, _super);
-    function DrIf() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrIf(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrIf.prototype.execRender = function () {
+    DrIf.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e;
-        if (this.elementSource.attrs.drIf) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var 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에도 적용을 할지말지 생각해야됨  엘리먼트 존재유무에 따라서 적용을 할지말지 결정해야됨
-            var keepgoing = ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    if ($rawset.data === (").concat(this.elementSource.attrs.drIf, ")) {\n                        return false;\n                    }\n                    $rawset.data = ").concat(this.elementSource.attrs.drIf, "\n                    if($rawset.data) {\n                        const n = $element.cloneNode(true);\n                        Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drIf' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                        var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                        if (destIt !== undefined) {\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt)))\n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt);\n                        }\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', ";\n                    return true;\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ fag: newTemp, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
-            }));
-            // console.log('keepgoing', keepgoing);
-            if (keepgoing === false) {
-                return exports.ExecuteState.STOP;
-            }
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            // const bypass = (newTemp.innerHTML ?? '').trim().length <= 0;
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            // console.log(tempalte.innerHTML)
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            // if (bypass) {
-            //     continue;
-            // }
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var 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에도 적용을 할지말지 생각해야됨  엘리먼트 존재유무에 따라서 적용을 할지말지 결정해야됨
+        var keepgoing = ScriptUtils.eval("\n                ".concat(this.render.bindScript, "\n                ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                if ($rawset.data === (").concat(attr, ")) {\n                    return false;\n                }\n                $rawset.data = ").concat(attr, ";\n                if($rawset.data) {\n                    const n = $element.cloneNode(true);\n                    Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drIf' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                    var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                    if (destIt !== undefined) {\n                        n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt)))\n                        n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt);\n                    }\n                    if (this.__render.drStripOption === 'true') {\n                        Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                    } else {\n                        this.__render.fag.append(n);\n                    }\n                }\n                ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', ";\n                return true;\n                "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ fag: newTemp, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
+        }));
+        // TODO: 뭐지?? 지워야되는거 아닌가?
+        if (keepgoing === false) {
+            return exports.ExecuteState.STOP;
+        }
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        // const bypass = (newTemp.innerHTML ?? '').trim().length <= 0;
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrIf;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var ComponentSet = /** @class */ (function () {
-    function ComponentSet(obj, template, styles, styleLocale) {
-        if (styleLocale === void 0) { styleLocale = false; }
+    function ComponentSet(obj, template, styles, config) {
         this.obj = obj;
         this.template = template;
         this.styles = styles;
-        this.styleLocale = styleLocale;
+        this.config = Object.assign({ objPath: 'obj' }, config);
     }
     return ComponentSet;
 }());
@@ -1089,40 +1137,34 @@ var DrThis = /** @class */ (function (_super) {
     function DrThis() {
         return _super !== null && _super.apply(this, arguments) || this;
     }
-    DrThis.prototype.execRender = function () {
+    DrThis.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e, _f;
-        if (this.elementSource.attrs.drThis) {
-            var r = ScriptUtils.evalReturn(this.elementSource.attrs.drThis, this.source.obj);
-            // const isStrip = ScriptUtils.eval(`if (${this.elementSource.attrs.drStripOption ?? 'false'}) { return true; } else { return false; }`, this.source.obj);
-            // console.log('isStrip', isStrip)
-            if (r) {
-                if (r instanceof ComponentSet) {
-                    if (this.rawSet.data) {
-                        var destroyOptions = (_c = (_b = this.elementSource.attrs.drDestroyOption) === null || _b === void 0 ? void 0 : _b.split(',')) !== null && _c !== void 0 ? _c : [];
-                        RawSet.destroy(this.rawSet.data.obj, [], this.source.config, destroyOptions);
-                    }
-                    this.rawSet.data = r;
-                    var componentBody = RawSet.drThisCreate(this.rawSet, this.elementSource.element, "".concat(this.elementSource.attrs.drThis, ".obj"), (_d = this.elementSource.attrs.drVarOption) !== null && _d !== void 0 ? _d : '', this.elementSource.attrs.drStripOption, this.source.obj, this.source.config, r);
-                    this.returnContainer.fag.append(componentBody);
-                    this.afterCallBack.onThisComponentSetCallBacks.push(r);
-                }
-                else {
-                    this.returnContainer.fag.append(RawSet.drThisCreate(this.rawSet, this.elementSource.element, this.elementSource.attrs.drThis, (_e = this.elementSource.attrs.drVarOption) !== null && _e !== void 0 ? _e : '', this.elementSource.attrs.drStripOption, this.source.obj, this.source.config));
+        if (attr && this.elementSource.attrs.drThis) {
+            if (attr instanceof ComponentSet) {
+                if (this.rawSet.data) {
+                    var destroyOptions = (_c = (_b = this.elementSource.attrs.drDestroyOption) === null || _b === void 0 ? void 0 : _b.split(',')) !== null && _c !== void 0 ? _c : [];
+                    RawSet.destroy(this.rawSet.data.obj, [], this.source.config, destroyOptions);
                 }
-                var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-                (_f = this.elementSource.element.parentNode) === null || _f === void 0 ? void 0 : _f.replaceChild(this.returnContainer.fag, this.elementSource.element);
-                (_a = this.returnContainer.raws).push.apply(_a, rr);
+                this.rawSet.data = attr;
+                var componentBody = RawSet.drThisCreate(this.rawSet, this.elementSource.element, "".concat(this.elementSource.attrs.drThis).concat(attr.config.objPath ? ('.' + attr.config.objPath) : ''), (_d = this.elementSource.attrs.drVarOption) !== null && _d !== void 0 ? _d : '', this.elementSource.attrs.drStripOption, this.source.obj, this.source.config, attr);
+                this.returnContainer.fag.append(componentBody);
+                this.afterCallBack.onThisComponentSetCallBacks.push(attr);
             }
             else {
-                this.elementSource.element.remove();
+                this.returnContainer.fag.append(RawSet.drThisCreate(this.rawSet, this.elementSource.element, this.elementSource.attrs.drThis, (_e = this.elementSource.attrs.drVarOption) !== null && _e !== void 0 ? _e : '', this.elementSource.attrs.drStripOption, this.source.obj, this.source.config));
             }
-            return exports.ExecuteState.EXECUTE;
+            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+            (_f = this.elementSource.element.parentNode) === null || _f === void 0 ? void 0 : _f.replaceChild(this.returnContainer.fag, this.elementSource.element);
+            (_a = this.returnContainer.raws).push.apply(_a, rr);
         }
-        return exports.ExecuteState.NO_EXECUTE;
+        else {
+            this.elementSource.element.remove();
+        }
+        return exports.ExecuteState.EXECUTE;
     };
     return DrThis;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 // export interface Valid<T = any, E = Element> {
 //     valid(value?: T, target?: E, event?: Event): boolean;
@@ -1454,255 +1496,249 @@ var ValidatorArray = /** @class */ (function (_super) {
 
 var DrForm = /** @class */ (function (_super) {
     __extends(DrForm, _super);
-    function DrForm() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrForm(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        return _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
     }
-    DrForm.prototype.execRender = function () {
+    DrForm.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _this = this;
         var _b;
-        if (this.elementSource.attrs.drForm) {
-            RawSet.drFormOtherMoveAttr(this.elementSource.element, 'name', 'temp-name', this.source.config);
-            var data = ScriptUtils.evalReturn("".concat(this.elementSource.attrs.drForm), this.source.obj);
-            var childs = Array.from(this.elementSource.element.querySelectorAll('[name]'));
-            var fromName = ScriptUtils.evalReturn((_b = this.elementSource.element.getAttribute('dr-form:name')) !== null && _b !== void 0 ? _b : '', this.source.obj);
-            var thisName = fromName !== null && fromName !== void 0 ? fromName : this.elementSource.element.getAttribute('name');
-            // console.log('dr-form:name', thisName, element.getAttribute('dr-form:name'), obj, element);
-            // // 자기자신이 Input 대상일때
-            if (childs.length <= 0 && thisName) {
-                childs.push(this.elementSource.element);
+        RawSet.drFormOtherMoveAttr(this.elementSource.element, 'name', 'temp-name', this.source.config);
+        var data = ScriptUtils.evalReturn("".concat(attr), this.source.obj);
+        var childs = Array.from(this.elementSource.element.querySelectorAll('[name]'));
+        var fromName = ScriptUtils.evalReturn((_b = this.elementSource.element.getAttribute("".concat(RawSet.DR_FORM_NAME, ":name"))) !== null && _b !== void 0 ? _b : '', this.source.obj);
+        var thisName = fromName !== null && fromName !== void 0 ? fromName : this.elementSource.element.getAttribute('name');
+        // // 자기자신이 Input 대상일때
+        if (childs.length <= 0 && thisName) {
+            childs.push(this.elementSource.element);
+        }
+        else {
+            if (data instanceof Validator) {
+                data.setTarget(this.elementSource.element);
             }
-            else {
-                if (data instanceof Validator) {
-                    data.setTarget(this.elementSource.element);
+        }
+        childs.forEach(function (it) {
+            var _a, _b, _c, _d, _e;
+            var eventName = (_a = it.getAttribute("".concat(RawSet.DR_FORM_NAME, ":event"))) !== null && _a !== void 0 ? _a : 'change';
+            var validatorName = it.getAttribute("".concat(RawSet.DR_FORM_NAME, ":validator"));
+            var attrEventName = EventManager.attrPrefix + 'event-' + eventName;
+            var varpath = (_c = ScriptUtils.evalReturn((_b = _this.elementSource.element.getAttribute("".concat(RawSet.DR_FORM_NAME, ":name"))) !== null && _b !== void 0 ? _b : '', _this.source.obj)) !== null && _c !== void 0 ? _c : it.getAttribute('name');
+            if (varpath != null) {
+                if (validatorName) {
+                    ScriptUtils.eval("\n                                ".concat(_this.render.bindScript, "\n                                const validator = typeof ").concat(validatorName, " ==='function' ?  new  ").concat(validatorName, "() : ").concat(validatorName, ";\n                                ").concat(attr, "['").concat(varpath, "'] = validator;\n                            "), Object.assign(_this.source.obj, {
+                        __render: Object.freeze(__assign({ drStripOption: _this.elementSource.attrs.drStripOption }, _this.render))
+                    }));
                 }
-            }
-            childs.forEach(function (it) {
-                var _a, _b, _c, _d, _e;
-                var eventName = (_a = it.getAttribute('dr-form:event')) !== null && _a !== void 0 ? _a : 'change';
-                var validatorName = it.getAttribute('dr-form:validator');
-                var attrEventName = EventManager.attrPrefix + 'event-' + eventName;
-                var varpath = (_c = ScriptUtils.evalReturn((_b = _this.elementSource.element.getAttribute('dr-form:name')) !== null && _b !== void 0 ? _b : '', _this.source.obj)) !== null && _c !== void 0 ? _c : it.getAttribute('name');
-                if (varpath != null) {
-                    if (validatorName) {
-                        ScriptUtils.eval("\n                                    ".concat(_this.render.bindScript, "\n                                    const validator = typeof ").concat(validatorName, " ==='function' ?  new  ").concat(validatorName, "() : ").concat(validatorName, ";\n                                    ").concat(_this.elementSource.attrs.drForm, "['").concat(varpath, "'] = validator;\n                                "), Object.assign(_this.source.obj, {
-                            __render: Object.freeze(__assign({ drStripOption: _this.elementSource.attrs.drStripOption }, _this.render))
-                        }));
-                    }
-                    varpath = "".concat(_this.elementSource.attrs.drForm, "['").concat(varpath, "']");
-                    var data_1 = ScriptUtils.evalReturn("".concat(varpath), _this.source.obj);
-                    if (data_1 instanceof ValidatorArray) {
-                        it.setAttribute(attrEventName, "".concat(varpath, ".setArrayValue($target, $target.value, $event); ").concat((_d = it.getAttribute(attrEventName)) !== null && _d !== void 0 ? _d : '', ";"));
-                        data_1.addValidator(it.value, it);
-                    }
-                    else if (data_1 instanceof Validator) {
-                        // varpath += (varpath ? '.value' : 'value');
-                        // varpath = drAttr.drForm + '.' + varpath;
-                        // it.setAttribute(attrEventName, `${varpath} = $target.value; ${target}=$target; ${event}=$event;`);
-                        it.setAttribute(attrEventName, "".concat(varpath, ".set($target.value, $target, $event); ").concat((_e = it.getAttribute(attrEventName)) !== null && _e !== void 0 ? _e : '', ";"));
-                        data_1.setTarget(it);
-                        data_1.value = it.value;
-                    }
-                    else {
-                        it.setAttribute(attrEventName, "".concat(varpath, " = $target.value;"));
-                    }
+                varpath = "".concat(attr, "['").concat(varpath, "']");
+                var data_1 = ScriptUtils.evalReturn("".concat(varpath), _this.source.obj);
+                if (data_1 instanceof ValidatorArray) {
+                    it.setAttribute(attrEventName, "".concat(varpath, ".setArrayValue($target, $target.value, $event); ").concat((_d = it.getAttribute(attrEventName)) !== null && _d !== void 0 ? _d : '', ";"));
+                    data_1.addValidator(it.value, it);
                 }
-            });
-            RawSet.drFormOtherMoveAttr(this.elementSource.element, 'temp-name', 'name', this.source.config);
-            (_a = this.returnContainer.raws).push.apply(_a, RawSet.checkPointCreates(this.elementSource.element, this.source.obj, this.source.config));
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+                else if (data_1 instanceof Validator) {
+                    // varpath += (varpath ? '.value' : 'value');
+                    // varpath = drAttr.drForm + '.' + varpath;
+                    // it.setAttribute(attrEventName, `${varpath} = $target.value; ${target}=$target; ${event}=$event;`);
+                    it.setAttribute(attrEventName, "".concat(varpath, ".set($target.value, $target, $event); ").concat((_e = it.getAttribute(attrEventName)) !== null && _e !== void 0 ? _e : '', ";"));
+                    data_1.setTarget(it);
+                    data_1.value = it.value;
+                }
+                else {
+                    it.setAttribute(attrEventName, "".concat(varpath, " = $target.value;"));
+                }
+            }
+        });
+        RawSet.drFormOtherMoveAttr(this.elementSource.element, 'temp-name', 'name', this.source.config);
+        (_a = this.returnContainer.raws).push.apply(_a, RawSet.checkPointCreates(this.elementSource.element, this.source.obj, this.source.config));
+        return exports.ExecuteState.EXECUTE;
     };
     return DrForm;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrInnerText = /** @class */ (function (_super) {
     __extends(DrInnerText, _super);
-    function DrInnerText() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrInnerText(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        return _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
     }
-    DrInnerText.prototype.execRender = function () {
+    DrInnerText.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d;
-        if (this.elementSource.attrs.drInnerText) {
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval(" \n                        ".concat(this.render.bindScript, "\n                        const n = $element.cloneNode(true);  \n                        ").concat((_b = this.elementSource.attrs.drBeforeOption) !== null && _b !== void 0 ? _b : '', "\n                        n.innerText = ").concat(this.elementSource.attrs.drInnerText, ";\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        ").concat((_c = this.elementSource.attrs.drAfterOption) !== null && _c !== void 0 ? _c : '', "\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, fag: newTemp }, this.render))
-            }));
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_d = this.elementSource.element.parentNode) === null || _d === void 0 ? void 0 : _d.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval(" \n                        ".concat(this.render.bindScript, "\n                        const n = $element.cloneNode(true);  \n                        ").concat((_b = this.elementSource.attrs.drBeforeOption) !== null && _b !== void 0 ? _b : '', "\n                        n.innerText = ").concat(attr, ";\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        ").concat((_c = this.elementSource.attrs.drAfterOption) !== null && _c !== void 0 ? _c : '', "\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, fag: newTemp }, this.render))
+        }));
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_d = this.elementSource.element.parentNode) === null || _d === void 0 ? void 0 : _d.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrInnerText;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrInnerHTML = /** @class */ (function (_super) {
     __extends(DrInnerHTML, _super);
-    function DrInnerHTML() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrInnerHTML(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        return _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
     }
-    DrInnerHTML.prototype.execRender = function () {
+    DrInnerHTML.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d;
-        if (this.elementSource.attrs.drInnerHTML) {
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                        ".concat(this.render.bindScript, "\n                        const n = $element.cloneNode(true);\n                        ").concat((_b = this.elementSource.attrs.drBeforeOption) !== null && _b !== void 0 ? _b : '', "\n                        n.innerHTML = ").concat(this.elementSource.attrs.drInnerHTML, ";\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        ").concat((_c = this.elementSource.attrs.drAfterOption) !== null && _c !== void 0 ? _c : '', "\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, fag: newTemp }, this.render
-                // eslint-disable-next-line no-use-before-define
-                ))
-            }));
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_d = this.elementSource.element.parentNode) === null || _d === void 0 ? void 0 : _d.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                        ".concat(this.render.bindScript, "\n                        const n = $element.cloneNode(true);\n                        ").concat((_b = this.elementSource.attrs.drBeforeOption) !== null && _b !== void 0 ? _b : '', "\n                        n.innerHTML = ").concat(attr, ";\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        ").concat((_c = this.elementSource.attrs.drAfterOption) !== null && _c !== void 0 ? _c : '', "\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, fag: newTemp }, this.render
+            // eslint-disable-next-line no-use-before-define
+            ))
+        }));
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_d = this.elementSource.element.parentNode) === null || _d === void 0 ? void 0 : _d.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrInnerHTML;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrFor = /** @class */ (function (_super) {
     __extends(DrFor, _super);
-    function DrFor() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrFor(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrFor.prototype.execRender = function () {
+    DrFor.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e;
-        if (this.elementSource.attrs.drFor) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    for(").concat(this.elementSource.attrs.drFor, ") {\n                        const n = this.__render.element.cloneNode(true);\n                        var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                        if (destIt !== undefined) {\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearForIt\\#/g, destIt).replace(/\\#nearForIndex\\#/g, destIt))) \n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, destIt);\n                        }\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
-            }));
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    for(").concat(attr, ") {\n                        const n = this.__render.element.cloneNode(true);\n                        var destIt = ").concat(this.elementSource.attrs.drItOption, ";\n                        if (destIt !== undefined) {\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearForIt\\#/g, destIt).replace(/\\#nearForIndex\\#/g, destIt))) \n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, destIt);\n                        }\n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
+        }));
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrFor;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrForOf = /** @class */ (function (_super) {
     __extends(DrForOf, _super);
-    function DrForOf() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrForOf(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrForOf.prototype.execRender = function () {
+    DrForOf.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e;
-        if (this.elementSource.attrs.drForOf) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    var i = 0; \n                    const forOf = ").concat(this.elementSource.attrs.drForOf, ";\n                    const forOfStr = `").concat(this.elementSource.attrs.drForOf, "`.trim();\n                    if (forOf) {\n                        for(const it of forOf) {\n                            var destIt = it;\n                            if (/\\[(.*,?)\\],/g.test(forOfStr)) {\n                                if (typeof it === 'string') {\n                                    destIt = it;\n                                } else {\n                                    destIt = forOfStr.substring(1, forOfStr.length-1).split(',')[i];\n                                }\n                            } else if (forOf.isRange) {\n                                    destIt = it;\n                            }  else {\n                                destIt = forOfStr + '[' + i +']'\n                            }\n                            const n = this.__render.element.cloneNode(true);\n                            Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drForOf' && k !== 'drNextOption' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIt\\#/g, destIt).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIndex\\#/g, i)))\n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, i);\n                            if (this.__render.drStripOption === 'true') {\n                                Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                            } else {\n                                this.__render.fag.append(n);\n                            }\n                            i++;\n                        }\n                        \n                        if('").concat(this.elementSource.attrs.drNextOption, "' !== 'null') {\n                            const n = this.__render.element.cloneNode(true);\n                            Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drForOf' && k !== 'drNextOption' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                            const [name, idx] = '").concat(this.elementSource.attrs.drNextOption, "'.split(',');\n                            n.setAttribute('dr-for-of', name + '[' + idx + ']');\n                            n.setAttribute('dr-next', name + ',' +  (Number(idx) + 1));\n                            this.__render.fag.append(n);\n                        }\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, fag: newTemp }, this.render
-                // eslint-disable-next-line no-use-before-define
-                ))
-            }));
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            // const rrr = rr.flatMap(it => it.render(obj, config));// .flat();
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    var i = 0; \n                    const forOf = ").concat(attr, ";\n                    const forOfStr = `").concat(attr, "`.trim();\n                    if (forOf) {\n                        for(const it of forOf) {\n                            var destIt = it;\n                            if (/\\[(.*,?)\\],/g.test(forOfStr)) {\n                                if (typeof it === 'string') {\n                                    destIt = it;\n                                } else {\n                                    destIt = forOfStr.substring(1, forOfStr.length-1).split(',')[i];\n                                }\n                            } else if (forOf.isRange) {\n                                    destIt = it;\n                            }  else {\n                                destIt = forOfStr + '[' + i +']'\n                            }\n                            const n = this.__render.element.cloneNode(true);\n                            Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drForOf' && k !== 'drNextOption' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                            n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIt\\#/g, destIt).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIndex\\#/g, i)))\n                            n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, i);\n                            if (this.__render.drStripOption === 'true') {\n                                Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                            } else {\n                                this.__render.fag.append(n);\n                            }\n                            i++;\n                        }\n                        \n                        if('").concat(this.elementSource.attrs.drNextOption, "' !== 'null') {\n                            const n = this.__render.element.cloneNode(true);\n                            Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drForOf' && k !== 'drNextOption' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                            const [name, idx] = '").concat(this.elementSource.attrs.drNextOption, "'.split(',');\n                            n.setAttribute('dr-for-of', name + '[' + idx + ']');\n                            n.setAttribute('dr-next', name + ',' +  (Number(idx) + 1));\n                            this.__render.fag.append(n);\n                        }\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, fag: newTemp }, this.render
+            // eslint-disable-next-line no-use-before-define
+            ))
+        }));
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        // const rrr = rr.flatMap(it => it.render(obj, config));// .flat();
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrForOf;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrAppender = /** @class */ (function (_super) {
     __extends(DrAppender, _super);
-    function DrAppender() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrAppender(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrAppender.prototype.execRender = function () {
+    DrAppender.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e;
-        if (this.elementSource.attrs.drAppender) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                    try{\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                        const ifWrap = document.createElement('div');\n                        ifWrap.setAttribute('dr-strip', 'true');\n                        ifWrap.setAttribute('dr-if', '").concat(this.elementSource.attrs.drAppender, " && ").concat(this.elementSource.attrs.drAppender, ".length > 0');\n                        const n = this.__render.element.cloneNode(true);\n                        Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drAppender' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                        n.setAttribute('dr-for-of', '").concat(this.elementSource.attrs.drAppender, "[' + (").concat(this.elementSource.attrs.drAppender, ".length-1) + ']');\n                        n.setAttribute('dr-next', '").concat(this.elementSource.attrs.drAppender, ",' + ").concat(this.elementSource.attrs.drAppender, ".length);\n                        ifWrap.append(n);\n                        \n                        // n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIt\\#/g, destIt).replace(/\\#it\\#/g, destIt).replace(/\\#nearForOfIndex\\#/g, i)))\n                        // n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, i);\n                        // if (this.__render.drStripOption === 'true') {\n                        // Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        // } else {\n                        // this.__render.fag.append(n);\n                        // }\n                        this.__render.fag.append(ifWrap);\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    }catch(e){}\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, fag: newTemp }, this.render
-                // eslint-disable-next-line no-use-before-define
-                ))
-            }));
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            // const rrr = rr.flatMap(it => it.render(obj, config));// .flat();
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        console.log('appender-->', attr);
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                    try{\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                        const ifWrap = document.createElement('div');\n                        ifWrap.setAttribute('dr-strip', 'true');\n                        ifWrap.setAttribute('dr-if', '").concat(this.elementSource.attrs.drAppender, " && ").concat(this.elementSource.attrs.drAppender, ".length > 0');\n                        const n = this.__render.element.cloneNode(true);\n                        Object.entries(this.__render.drAttr).filter(([k,v]) => k !== 'drAppender' && v).forEach(([k, v]) => n.setAttribute(this.__render.drAttrsOriginName[k], v));\n                        n.setAttribute('dr-for-of', '").concat(this.elementSource.attrs.drAppender, "[' + (").concat(this.elementSource.attrs.drAppender, ".length-1) + ']');\n                        n.setAttribute('dr-next', '").concat(this.elementSource.attrs.drAppender, ",' + ").concat(this.elementSource.attrs.drAppender, ".length);\n                        ifWrap.append(n);\n                        this.__render.fag.append(ifWrap);\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    }catch(e){}\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ drStripOption: this.elementSource.attrs.drStripOption, drAttr: this.elementSource.attrs, drAttrsOriginName: RawSet.drAttrsOriginName, fag: newTemp }, this.render
+            // eslint-disable-next-line no-use-before-define
+            ))
+        }));
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        // const rrr = rr.flatMap(it => it.render(obj, config));// .flat();
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrAppender;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrRepeat = /** @class */ (function (_super) {
     __extends(DrRepeat, _super);
-    function DrRepeat() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrRepeat(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrRepeat.prototype.execRender = function () {
+    DrRepeat.prototype.executeAttrRequire = function (attr) {
         var _a;
         var _b, _c, _d, _e;
-        if (this.elementSource.attrs.drRepeat) {
-            var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
-            var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
-            var newTemp = this.source.config.window.document.createElement('temp');
-            ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    var i = 0; \n                    const repeat = ").concat(this.elementSource.attrs.drRepeat, ";\n                    const repeatStr = `").concat(this.elementSource.attrs.drRepeat, "`;\n                    let range = repeat;\n                    if (typeof repeat === 'number') {\n                        range = ").concat(EventManager.RANGE_VARNAME, "(repeat);\n                    } \n                    for(const it of range) {\n                        var destIt = it;\n                        if (range.isRange) {\n                            destIt = it;\n                        }  else {\n                            destIt = repeatStr + '[' + i +']'\n                        }\n                        const n = this.__render.element.cloneNode(true);\n                        n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearRangeIt\\#/g, destIt).replace(/\\#nearRangeIndex\\#/g, destIt)))\n                        n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, destIt);\n                        \n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        i++;\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
-                __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
-            }));
-            RawSet.drVarDecoding(newTemp, vars);
-            RawSet.drItOtherDecoding(newTemp, itRandom);
-            var tempalte = this.source.config.window.document.createElement('template');
-            tempalte.innerHTML = newTemp.innerHTML;
-            this.returnContainer.fag.append(tempalte.content);
-            var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
-            (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
-            (_a = this.returnContainer.raws).push.apply(_a, rr);
-            return exports.ExecuteState.EXECUTE;
-        }
-        return exports.ExecuteState.NO_EXECUTE;
+        var itRandom = RawSet.drItOtherEncoding(this.elementSource.element);
+        var vars = RawSet.drVarEncoding(this.elementSource.element, (_b = this.elementSource.attrs.drVarOption) !== null && _b !== void 0 ? _b : '');
+        var newTemp = this.source.config.window.document.createElement('temp');
+        ScriptUtils.eval("\n                    ".concat(this.render.bindScript, "\n                    ").concat((_c = this.elementSource.attrs.drBeforeOption) !== null && _c !== void 0 ? _c : '', "\n                    var i = 0; \n                    const repeat = ").concat(attr, ";\n                    const repeatStr = `").concat(attr, "`;\n                    let range = repeat;\n                    if (typeof repeat === 'number') {\n                        range = ").concat(EventManager.RANGE_VARNAME, "(repeat);\n                    } \n                    for(const it of range) {\n                        var destIt = it;\n                        if (range.isRange) {\n                            destIt = it;\n                        }  else {\n                            destIt = repeatStr + '[' + i +']'\n                        }\n                        const n = this.__render.element.cloneNode(true);\n                        n.getAttributeNames().forEach(it => n.setAttribute(it, n.getAttribute(it).replace(/\\#it\\#/g, destIt).replace(/\\#nearRangeIt\\#/g, destIt).replace(/\\#nearRangeIndex\\#/g, destIt)))\n                        n.innerHTML = n.innerHTML.replace(/\\#it\\#/g, destIt).replace(/\\#index\\#/g, destIt);\n                        \n                        if (this.__render.drStripOption === 'true') {\n                            Array.from(n.childNodes).forEach(it => this.__render.fag.append(it));\n                        } else {\n                            this.__render.fag.append(n);\n                        }\n                        i++;\n                    }\n                    ").concat((_d = this.elementSource.attrs.drAfterOption) !== null && _d !== void 0 ? _d : '', "\n                    "), Object.assign(this.source.obj, {
+            __render: Object.freeze(__assign({ fag: newTemp, drStripOption: this.elementSource.attrs.drStripOption }, this.render))
+        }));
+        RawSet.drVarDecoding(newTemp, vars);
+        RawSet.drItOtherDecoding(newTemp, itRandom);
+        var tempalte = this.source.config.window.document.createElement('template');
+        tempalte.innerHTML = newTemp.innerHTML;
+        this.returnContainer.fag.append(tempalte.content);
+        var rr = RawSet.checkPointCreates(this.returnContainer.fag, this.source.obj, this.source.config);
+        (_e = this.elementSource.element.parentNode) === null || _e === void 0 ? void 0 : _e.replaceChild(this.returnContainer.fag, this.elementSource.element);
+        (_a = this.returnContainer.raws).push.apply(_a, rr);
+        return exports.ExecuteState.EXECUTE;
     };
     return DrRepeat;
-}(OperatorRender));
+}(OperatorExecuterAttrRequire));
 
 var DrTargetElement = /** @class */ (function (_super) {
     __extends(DrTargetElement, _super);
-    function DrTargetElement() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrTargetElement(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrTargetElement.prototype.execRender = function () {
+    DrTargetElement.prototype.execute = function () {
         var _a;
         var _this = this;
         var _b, _c, _d, _e;
@@ -1710,34 +1746,10 @@ var DrTargetElement = /** @class */ (function (_super) {
         if (targetElement) {
             var documentFragment = targetElement.callBack(this.elementSource.element, this.source.obj, this.rawSet, this.elementSource.attrs, this.source.config);
             if (documentFragment) {
-                // const targetAttrMap = this.elementSource.element.getAttribute(EventManager.normalAttrMapAttrName);
                 var detectAction_1 = this.elementSource.element.getAttribute(RawSet.DR_DETECT_NAME);
                 var render_1 = documentFragment.render;
-                // console.log('-------drTargetElement->', render, targetAttrMap);
                 this.rawSet.fragment = documentFragment;
                 this.rawSet.data = render_1.component;
-                // const targetAttrs = this.elementSource.element.getAttributeNames()
-                //     .filter(it => RawSet.isExporesion(this.elementSource.element.getAttribute(it)))
-                //     .map(it => ({name: it, expresion: RawSet.exporesionGrouops(this.elementSource.element.getAttribute(it))[0][1]}))
-                //     .filter(it => it.name.length > 0 && it.expresion.length > 0)
-                //     .map(it => {
-                //         return `n.setAttribute('${it.name}', ${it.expresion})`;
-                //     });
-                // if (targetAttrMap) {
-                //     ScriptUtils.eval(`
-                //                 ${this.render.bindScript}
-                //                 //const n = $element.cloneNode(true);
-                //                 const n = $element;
-                //                 ${targetAttrMap.join(';')};
-                //                 // this.__render.fag.append(n);
-                //             `, Object.assign(this.source.obj, {
-                //         __render: Object.freeze({
-                //             fag: newTemp,
-                //             targetAttrs: targetAttrMap,
-                //             ...this.render
-                //         } as Render)
-                //     }));
-                // }
                 if (detectAction_1 && render_1) {
                     this.rawSet.detect = {
                         action: function () {
@@ -1758,7 +1770,6 @@ var DrTargetElement = /** @class */ (function (_super) {
                     targetElement: targetElement,
                     creatorMetaData: targetElement.__creatorMetaData
                 });
-                // console.log(document.body.innerHTML);
                 (_e = targetElement === null || targetElement === void 0 ? void 0 : targetElement.complete) === null || _e === void 0 ? void 0 : _e.call(targetElement, this.elementSource.element, this.source.obj, this.rawSet);
             }
             return exports.ExecuteState.EXECUTE;
@@ -1766,18 +1777,20 @@ var DrTargetElement = /** @class */ (function (_super) {
         return exports.ExecuteState.NO_EXECUTE;
     };
     return DrTargetElement;
-}(OperatorRender));
+}(OperatorExecuter));
 
 var DrTargetAttr = /** @class */ (function (_super) {
     __extends(DrTargetAttr, _super);
-    function DrTargetAttr() {
-        return _super !== null && _super.apply(this, arguments) || this;
+    function DrTargetAttr(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
+        var _this = this;
+        source.operatorAround = undefined;
+        _this = _super.call(this, rawSet, render, returnContainer, elementSource, source, afterCallBack, false) || this;
+        return _this;
     }
-    DrTargetAttr.prototype.execRender = function () {
+    DrTargetAttr.prototype.execute = function () {
         var _a;
         var _b, _c, _d, _e;
         var attributeNames = this.elementSource.element.getAttributeNames();
-        // const targetAttr = config?.targetAttrs?.find(it => (!drAttr.drForOf && !drAttr.drFor && !drAttr.drRepeat) && attributeNames.includes(it.name));
         var targetAttr = (_c = (_b = this.source.config) === null || _b === void 0 ? void 0 : _b.targetAttrs) === null || _c === void 0 ? void 0 : _c.find(function (it) { return attributeNames.includes(it.name); });
         if (targetAttr) {
             var attrName = targetAttr.name;
@@ -1801,7 +1814,7 @@ var DrTargetAttr = /** @class */ (function (_super) {
         return exports.ExecuteState.NO_EXECUTE;
     };
     return DrTargetAttr;
-}(OperatorRender));
+}(OperatorExecuter));
 
 exports.DestroyOptionType = void 0;
 (function (DestroyOptionType) {
@@ -1851,7 +1864,6 @@ var RawSet = /** @class */ (function () {
                 var targetScripts_1 = targetAttrNames.map(function (it) { return element_1.getAttribute(it); }).filter(function (it) { return it; });
                 var targetAttrMap = element_1.getAttribute(EventManager.normalAttrMapAttrName);
                 if (targetAttrMap) {
-                    // console.log('----->', targetAttr);
                     new Map(JSON.parse(targetAttrMap)).forEach(function (v, k) {
                         targetScripts_1.push(v);
                     });
@@ -1885,15 +1897,15 @@ var RawSet = /** @class */ (function () {
     // 중요 render 처리 부분
     RawSet.prototype.render = function (obj, config) {
         var _this = this;
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l;
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u, _v, _w, _x;
         var genNode = config.window.document.importNode(this.fragment, true);
         var raws = [];
         var onAttrInitCallBacks = [];
         var onElementInitCallBacks = [];
         var onThisComponentSetCallBacks = [];
         var drAttrs = [];
-        for (var _i = 0, _m = Array.from(genNode.childNodes.values()); _i < _m.length; _i++) {
-            var cNode = _m[_i];
+        for (var _i = 0, _y = Array.from(genNode.childNodes.values()); _i < _y.length; _i++) {
+            var cNode = _y[_i];
             var attribute = {};
             if (cNode.nodeType === Node.ELEMENT_NODE) {
                 attribute = DomUtils.getAttributeToObject(cNode);
@@ -1959,23 +1971,23 @@ var RawSet = /** @class */ (function () {
                 };
                 drAttrs.push(drAttr);
                 var operators = [
-                    new DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new Dr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drPre, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_b = config.operatorAround) === null || _b === void 0 ? void 0 : _b.drPre }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new Dr(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.dr, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_c = config.operatorAround) === null || _c === void 0 ? void 0 : _c.dr }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drIf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_d = config.operatorAround) === null || _d === void 0 ? void 0 : _d.drIf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drThis, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_e = config.operatorAround) === null || _e === void 0 ? void 0 : _e.drThis }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drForm, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_f = config.operatorAround) === null || _f === void 0 ? void 0 : _f.drForm }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drInnerText, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_g = config.operatorAround) === null || _g === void 0 ? void 0 : _g.drInnerText }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drInnerHTML, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_h = config.operatorAround) === null || _h === void 0 ? void 0 : _h.drInnerHTML }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drFor, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_j = config.operatorAround) === null || _j === void 0 ? void 0 : _j.drFor }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drForOf, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_k = config.operatorAround) === null || _k === void 0 ? void 0 : _k.drForOf }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drAppender, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_l = config.operatorAround) === null || _l === void 0 ? void 0 : _l.drAppender }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attr: drAttr.drRepeat, attrs: drAttr }, { config: config, obj: obj, operatorAround: (_m = config.operatorAround) === null || _m === void 0 ? void 0 : _m.drRepeat }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
                     new DrTargetElement(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
                     new DrTargetAttr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks })
                 ];
-                for (var _o = 0, operators_1 = operators; _o < operators_1.length; _o++) {
-                    var operator = operators_1[_o];
-                    var state = operator.execRender();
+                for (var _z = 0, operators_1 = operators; _z < operators_1.length; _z++) {
+                    var operator = operators_1[_z];
+                    var state = operator.start();
                     if (state === exports.ExecuteState.EXECUTE) {
                         break;
                     }
@@ -2000,20 +2012,32 @@ var RawSet = /** @class */ (function () {
         });
         // 중요 style isolation 나중에 :scope로 대체 가능할듯.
         RawSet.generateStyleSheetsLocal();
-        // console.log('-22222-')
-        // alert(1);
-        for (var _p = 0, onThisComponentSetCallBacks_1 = onThisComponentSetCallBacks; _p < onThisComponentSetCallBacks_1.length; _p++) {
-            var it_1 = onThisComponentSetCallBacks_1[_p];
-            (_c = (_b = it_1.obj).onInitRender) === null || _c === void 0 ? void 0 : _c.call(_b);
-        }
-        for (var _q = 0, onElementInitCallBacks_1 = onElementInitCallBacks; _q < onElementInitCallBacks_1.length; _q++) {
-            var it_2 = onElementInitCallBacks_1[_q];
-            (_g = (_f = (_e = (_d = it_2.targetElement) === null || _d === void 0 ? void 0 : _d.__render) === null || _e === void 0 ? void 0 : _e.component) === null || _f === void 0 ? void 0 : _f.onInitRender) === null || _g === void 0 ? void 0 : _g.call(_f, Object.freeze({ render: (_h = it_2.targetElement) === null || _h === void 0 ? void 0 : _h.__render, creatorMetaData: (_j = it_2.targetElement) === null || _j === void 0 ? void 0 : _j.__creatorMetaData }));
-            (_k = config === null || config === void 0 ? void 0 : config.onElementInit) === null || _k === void 0 ? void 0 : _k.call(config, it_2.name, obj, this, it_2.targetElement);
+        for (var _0 = 0, onThisComponentSetCallBacks_1 = onThisComponentSetCallBacks; _0 < onThisComponentSetCallBacks_1.length; _0++) {
+            var it_1 = onThisComponentSetCallBacks_1[_0];
+            (_p = (_o = it_1.obj) === null || _o === void 0 ? void 0 : _o.onInitRender) === null || _p === void 0 ? void 0 : _p.call(_o);
+        }
+        for (var _1 = 0, onElementInitCallBacks_1 = onElementInitCallBacks; _1 < onElementInitCallBacks_1.length; _1++) {
+            var it_2 = onElementInitCallBacks_1[_1];
+            if (((_r = (_q = it_2.targetElement) === null || _q === void 0 ? void 0 : _q.__render) === null || _r === void 0 ? void 0 : _r.element) && ((_t = (_s = it_2.targetElement) === null || _s === void 0 ? void 0 : _s.__render) === null || _t === void 0 ? void 0 : _t.component)) {
+                var oninit = it_2.targetElement.__render.element.getAttribute(RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME); // dr-on-component-init
+                var param = [];
+                if (oninit) {
+                    var script = "".concat(it_2.targetElement.__render.renderScript, " return ").concat(oninit, " ");
+                    param = ScriptUtils.eval(script, Object.assign(obj, {
+                        __render: it_2.targetElement.__render
+                    }));
+                    if (!Array.isArray(param)) {
+                        param = [param];
+                    }
+                }
+                (_v = (_u = it_2.targetElement.__render.component).onInitRender) === null || _v === void 0 ? void 0 : _v.call.apply(_v, __spreadArray([_u], param, false));
+            }
+            (_w = config === null || config === void 0 ? void 0 : config.onElementInit) === null || _w === void 0 ? void 0 : _w.call(config, it_2.name, obj, this, it_2.targetElement);
         }
-        for (var _r = 0, onAttrInitCallBacks_1 = onAttrInitCallBacks; _r < onAttrInitCallBacks_1.length; _r++) {
-            var it_3 = onAttrInitCallBacks_1[_r];
-            (_l = config === null || config === void 0 ? void 0 : config.onAttrInit) === null || _l === void 0 ? void 0 : _l.call(config, it_3.attrName, it_3.attrValue, obj, this);
+        // TODO: 이부분도 위에 targetElement 처럼 해야될까?
+        for (var _2 = 0, onAttrInitCallBacks_1 = onAttrInitCallBacks; _2 < onAttrInitCallBacks_1.length; _2++) {
+            var it_3 = onAttrInitCallBacks_1[_2];
+            (_x = config === null || config === void 0 ? void 0 : config.onAttrInit) === null || _x === void 0 ? void 0 : _x.call(config, it_3.attrName, it_3.attrValue, obj, this);
         }
         // component destroy
         if (obj.__domrender_components) {
@@ -2408,7 +2432,7 @@ var RawSet = /** @class */ (function () {
             // const metaEnd = RawSet.metaEnd(id);
             // n.innerHTML = metaStart + style + (set.template ?? '') + metaEnd;
             // dr-on-create onCreateRender
-            var onCreate = element.getAttribute("".concat(EventManager.attrPrefix, "on-create"));
+            var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
             var renderScript = '';
             var createParam = [];
             if (onCreate) {
@@ -2420,7 +2444,8 @@ var RawSet = /** @class */ (function () {
             }
             (_d = (_c = set.obj) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([_c], createParam, false));
             // dr-on-component-init
-            var oninit = element.getAttribute("".concat(EventManager.attrPrefix, "on-component-init")); // dr-on-component-init
+            // const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
+            var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
             if (oninit) {
                 var script = "".concat(renderScript, "  ").concat(oninit, " ");
                 ScriptUtils.eval(script, obj);
@@ -2494,7 +2519,7 @@ var RawSet = /** @class */ (function () {
                     scripts: EventManager.setBindProperty((_a = config.scripts) !== null && _a !== void 0 ? _a : {}, obj)
                     // eslint-disable-next-line no-use-before-define
                 });
-                var constructor = element.getAttribute("".concat(EventManager.attrPrefix, "constructor"));
+                var constructor = element.getAttribute(RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME);
                 var constructorParam = [];
                 // dr-constructor
                 if (constructor) {
@@ -2533,9 +2558,9 @@ var RawSet = /** @class */ (function () {
                     });
                 }
                 // dr-on-create onCreateRender
-                var onCreate = element.getAttribute("".concat(EventManager.attrPrefix, "on-create"));
+                var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
                 this.__render = render;
-                var createParam = [i];
+                var createParam = [];
                 if (onCreate) {
                     var script = "".concat(renderScript, " return ").concat(onCreate, " ");
                     createParam = ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
@@ -2546,8 +2571,8 @@ var RawSet = /** @class */ (function () {
                 (_d = instance === null || instance === void 0 ? void 0 : instance.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([instance], createParam, false));
                 var applayTemplate = element.innerHTML;
                 var innerHTMLThisRandom;
-                var componentName = (_e = element.getAttribute("".concat(EventManager.attrPrefix, "component-name"))) !== null && _e !== void 0 ? _e : 'component';
-                var innerHTMLName = (_f = element.getAttribute("".concat(EventManager.attrPrefix, "component-inner-html-name"))) !== null && _f !== void 0 ? _f : 'innerHTML';
+                var componentName = (_e = element.getAttribute(RawSet.DR_COMPONENT_NAME_OPTIONNAME)) !== null && _e !== void 0 ? _e : 'component';
+                var innerHTMLName = (_f = element.getAttribute(RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME)) !== null && _f !== void 0 ? _f : 'innerHTML';
                 if (applayTemplate) {
                     // if (rawSet.point.thisVariableName) {
                     // 넘어온 innerHTML에 this가 있으면 해당안되게 우선 치환.
@@ -2558,7 +2583,8 @@ var RawSet = /** @class */ (function () {
                 }
                 applayTemplate = template.replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
                 // dr-on-component-init
-                var oninit = element.getAttribute("".concat(EventManager.attrPrefix, "on-component-init")); // dr-on-component-init
+                // const oninit = element.getAttribute(`${EventManager.attrPrefix}on-component-init`); // dr-on-component-init
+                var oninit = element.getAttribute(RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME); // dr-on-component-init
                 if (oninit) {
                     var script = "".concat(renderScript, "  ").concat(oninit, " ");
                     ScriptUtils.eval(script, Object.assign(obj, {
@@ -2628,7 +2654,6 @@ var RawSet = /** @class */ (function () {
     RawSet.DR_INNERHTML_NAME = 'dr-inner-html';
     RawSet.DR_INNERTEXT_NAME = 'dr-inner-text';
     RawSet.DR_DETECT_NAME = 'dr-detect';
-    // public static readonly DR_DETECT_ACTION_NAME = 'dr-detect-action';
     RawSet.DR_IT_OPTIONNAME = 'dr-it';
     RawSet.DR_VAR_OPTIONNAME = 'dr-var';
     RawSet.DR_AFTER_OPTIONNAME = 'dr-after';
@@ -2637,6 +2662,12 @@ var RawSet = /** @class */ (function () {
     RawSet.DR_COMPLETE_OPTIONNAME = 'dr-complete';
     RawSet.DR_STRIP_OPTIONNAME = 'dr-strip';
     RawSet.DR_DESTROY_OPTIONNAME = 'dr-destroy';
+    RawSet.DR_COMPONENT_NAME_OPTIONNAME = 'dr-component-name';
+    RawSet.DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME = 'dr-component-inner-html-name';
+    RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME = 'dr-on-create:arguments';
+    RawSet.DR_ON_CREATED_CALLBACK_OPTIONNAME = 'dr-on-create:callback';
+    RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME = 'dr-on-init:arguments';
+    RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME = 'dr-on-constructor:arguments';
     RawSet.drAttrsOriginName = {
         dr: RawSet.DR,
         drIf: RawSet.DR_IF_NAME,
@@ -2713,14 +2744,16 @@ var DomRenderProxy = /** @class */ (function () {
     };
     DomRenderProxy.prototype.initRender = function (target) {
         var _this = this;
-        var _a, _b, _c, _d, _e, _f, _g;
-        var onCreate = (_b = (_a = target).getAttribute) === null || _b === void 0 ? void 0 : _b.call(_a, "".concat(EventManager.attrPrefix, "on-create"));
-        var createParam;
+        var _a, _b, _c, _d, _f, _g, _h, _j;
+        var onCreate = (_b = (_a = target).getAttribute) === null || _b === void 0 ? void 0 : _b.call(_a, RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
+        var createParam = [];
         if (onCreate) {
             createParam = ScriptUtils.evalReturn(onCreate, this._domRender_proxy);
+            if (!Array.isArray(createParam)) {
+                createParam = [createParam];
+            }
         }
-        (_d = (_c = this._domRender_proxy) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call(_c, createParam);
-        var innerHTML = (_e = target.innerHTML) !== null && _e !== void 0 ? _e : '';
+        (_d = (_c = this._domRender_proxy) === null || _c === void 0 ? void 0 : _c.onCreateRender) === null || _d === void 0 ? void 0 : _d.call.apply(_d, __spreadArray([_c], createParam, false));
         this._targets.add(target);
         var rawSets = RawSet.checkPointCreates(target, this._domRender_proxy, this.config);
         // console.log('initRender -------rawSet', rawSets)
@@ -2738,13 +2771,21 @@ var DomRenderProxy = /** @class */ (function () {
             }
         });
         this.render(this.getRawSets());
-        var render = { target: target };
-        var creatorMetaData = {
-            creator: this._domRender_proxy,
-            rootCreator: this._domRender_proxy,
-            innerHTML: innerHTML
-        };
-        (_g = (_f = this._domRender_proxy) === null || _f === void 0 ? void 0 : _f.onInitRender) === null || _g === void 0 ? void 0 : _g.call(_f, { render: render, creatorMetaData: creatorMetaData });
+        // const render = {target} as Render;
+        // const creatorMetaData = {
+        //     creator: this._domRender_proxy,
+        //     rootCreator: this._domRender_proxy,
+        //     innerHTML
+        // } as CreatorMetaData;
+        (_g = (_f = target).getAttribute) === null || _g === void 0 ? void 0 : _g.call(_f, RawSet.DR_ON_INIT_ARGUMENTS_OPTIONNAME);
+        var initParam = [];
+        if (onCreate) {
+            initParam = ScriptUtils.evalReturn(onCreate, this._domRender_proxy);
+            if (!Array.isArray(initParam)) {
+                initParam = [initParam];
+            }
+        }
+        (_j = (_h = this._domRender_proxy) === null || _h === void 0 ? void 0 : _h.onInitRender) === null || _j === void 0 ? void 0 : _j.call.apply(_j, __spreadArray([_h], initParam, false));
     };
     DomRenderProxy.prototype.getRawSets = function () {
         var set = new Set();
@@ -3185,7 +3226,13 @@ var LocationUtils = /** @class */ (function () {
     };
     LocationUtils.hashQueryParamsObject = function (window) {
         var _a;
-        return this.queryStringToObject((_a = window.location.hash.split('?').pop()) !== null && _a !== void 0 ? _a : '');
+        var s = (_a = window.location.hash.split('?').pop()) !== null && _a !== void 0 ? _a : '';
+        if (s.startsWith('#')) {
+            return {};
+        }
+        else {
+            return this.queryStringToObject(s);
+        }
     };
     LocationUtils.pathQueryParams = function (window) {
         return this.queryStringToMap(window.location.search.substring(1));
@@ -3566,60 +3613,32 @@ var Appender = /** @class */ (function () {
     return Appender;
 }());
 
-var CheckedValidator = /** @class */ (function (_super) {
-    __extends(CheckedValidator, _super);
-    function CheckedValidator(value, target, event, autoValid) {
+var AllUnCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(AllUnCheckedValidatorArray, _super);
+    function AllUnCheckedValidatorArray(value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         return _super.call(this, value, target, event, autoValid) || this;
     }
-    CheckedValidator.prototype.valid = function () {
-        var _a, _b;
-        return (_b = (_a = this.getTarget()) === null || _a === void 0 ? void 0 : _a.checked) !== null && _b !== void 0 ? _b : false;
-    };
-    return CheckedValidator;
-}(Validator));
-
-var CountEqualsUnCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountEqualsUnCheckedValidatorArray, _super);
-    function CountEqualsUnCheckedValidatorArray(count, value, target, event, autoValid) {
-        if (autoValid === void 0) { autoValid = true; }
-        var _this = _super.call(this, value, target, event, autoValid) || this;
-        _this.count = count;
-        return _this;
-    }
-    CountEqualsUnCheckedValidatorArray.prototype.valid = function () {
+    AllUnCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return !it.checked; }).length === this.count;
+        return !(((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length > 0);
     };
-    return CountEqualsUnCheckedValidatorArray;
+    return AllUnCheckedValidatorArray;
 }(ValidatorArray));
 
-var CountGreaterThanCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountGreaterThanCheckedValidatorArray, _super);
-    function CountGreaterThanCheckedValidatorArray(count, value, target, event, autoValid) {
+var CountEqualsCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountEqualsCheckedValidatorArray, _super);
+    function CountEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
         _this.count = count;
         return _this;
     }
-    CountGreaterThanCheckedValidatorArray.prototype.valid = function () {
-        var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length > this.count;
-    };
-    return CountGreaterThanCheckedValidatorArray;
-}(ValidatorArray));
-
-var AllUnCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(AllUnCheckedValidatorArray, _super);
-    function AllUnCheckedValidatorArray(value, target, event, autoValid) {
-        if (autoValid === void 0) { autoValid = true; }
-        return _super.call(this, value, target, event, autoValid) || this;
-    }
-    AllUnCheckedValidatorArray.prototype.valid = function () {
+    CountEqualsCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return !(((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length > 0);
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length === this.count;
     };
-    return AllUnCheckedValidatorArray;
+    return CountEqualsCheckedValidatorArray;
 }(ValidatorArray));
 
 var AllCheckedValidatorArray = /** @class */ (function (_super) {
@@ -3635,34 +3654,19 @@ var AllCheckedValidatorArray = /** @class */ (function (_super) {
     return AllCheckedValidatorArray;
 }(ValidatorArray));
 
-var CountEqualsCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountEqualsCheckedValidatorArray, _super);
-    function CountEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
-        if (autoValid === void 0) { autoValid = true; }
-        var _this = _super.call(this, value, target, event, autoValid) || this;
-        _this.count = count;
-        return _this;
-    }
-    CountEqualsCheckedValidatorArray.prototype.valid = function () {
-        var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length === this.count;
-    };
-    return CountEqualsCheckedValidatorArray;
-}(ValidatorArray));
-
-var CountGreaterThanEqualsCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountGreaterThanEqualsCheckedValidatorArray, _super);
-    function CountGreaterThanEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
+var CountEqualsUnCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountEqualsUnCheckedValidatorArray, _super);
+    function CountEqualsUnCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
         _this.count = count;
         return _this;
     }
-    CountGreaterThanEqualsCheckedValidatorArray.prototype.valid = function () {
+    CountEqualsUnCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length >= this.count;
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return !it.checked; }).length === this.count;
     };
-    return CountGreaterThanEqualsCheckedValidatorArray;
+    return CountEqualsUnCheckedValidatorArray;
 }(ValidatorArray));
 
 var CountGreaterThanEqualsUnCheckedValidatorArray = /** @class */ (function (_super) {
@@ -3680,6 +3684,19 @@ var CountGreaterThanEqualsUnCheckedValidatorArray = /** @class */ (function (_su
     return CountGreaterThanEqualsUnCheckedValidatorArray;
 }(ValidatorArray));
 
+var CheckedValidator = /** @class */ (function (_super) {
+    __extends(CheckedValidator, _super);
+    function CheckedValidator(value, target, event, autoValid) {
+        if (autoValid === void 0) { autoValid = true; }
+        return _super.call(this, value, target, event, autoValid) || this;
+    }
+    CheckedValidator.prototype.valid = function () {
+        var _a, _b;
+        return (_b = (_a = this.getTarget()) === null || _a === void 0 ? void 0 : _a.checked) !== null && _b !== void 0 ? _b : false;
+    };
+    return CheckedValidator;
+}(Validator));
+
 var CountGreaterThanUnCheckedValidatorArray = /** @class */ (function (_super) {
     __extends(CountGreaterThanUnCheckedValidatorArray, _super);
     function CountGreaterThanUnCheckedValidatorArray(count, value, target, event, autoValid) {
@@ -3695,34 +3712,34 @@ var CountGreaterThanUnCheckedValidatorArray = /** @class */ (function (_super) {
     return CountGreaterThanUnCheckedValidatorArray;
 }(ValidatorArray));
 
-var CountLessThanEqualsCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountLessThanEqualsCheckedValidatorArray, _super);
-    function CountLessThanEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
+var CountGreaterThanCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountGreaterThanCheckedValidatorArray, _super);
+    function CountGreaterThanCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
         _this.count = count;
         return _this;
     }
-    CountLessThanEqualsCheckedValidatorArray.prototype.valid = function () {
+    CountGreaterThanCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length <= this.count;
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length > this.count;
     };
-    return CountLessThanEqualsCheckedValidatorArray;
+    return CountGreaterThanCheckedValidatorArray;
 }(ValidatorArray));
 
-var CountLessThanCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountLessThanCheckedValidatorArray, _super);
-    function CountLessThanCheckedValidatorArray(count, value, target, event, autoValid) {
+var CountGreaterThanEqualsCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountGreaterThanEqualsCheckedValidatorArray, _super);
+    function CountGreaterThanEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
         _this.count = count;
         return _this;
     }
-    CountLessThanCheckedValidatorArray.prototype.valid = function () {
+    CountGreaterThanEqualsCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length < this.count;
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length >= this.count;
     };
-    return CountLessThanCheckedValidatorArray;
+    return CountGreaterThanEqualsCheckedValidatorArray;
 }(ValidatorArray));
 
 var CountLessThanEqualsUnCheckedValidatorArray = /** @class */ (function (_super) {
@@ -3740,33 +3757,34 @@ var CountLessThanEqualsUnCheckedValidatorArray = /** @class */ (function (_super
     return CountLessThanEqualsUnCheckedValidatorArray;
 }(ValidatorArray));
 
-var EmptyValidator = /** @class */ (function (_super) {
-    __extends(EmptyValidator, _super);
-    function EmptyValidator(value, target, event, autoValid) {
+var CountLessThanEqualsCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountLessThanEqualsCheckedValidatorArray, _super);
+    function CountLessThanEqualsCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
-        return _super.call(this, value, target, event, autoValid) || this;
+        var _this = _super.call(this, value, target, event, autoValid) || this;
+        _this.count = count;
+        return _this;
     }
-    EmptyValidator.prototype.valid = function () {
-        var _a, _b;
-        var value = this.value;
-        return value === undefined || value === null || ((_b = (_a = value) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) <= 0;
+    CountLessThanEqualsCheckedValidatorArray.prototype.valid = function () {
+        var _a;
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length <= this.count;
     };
-    return EmptyValidator;
-}(Validator));
+    return CountLessThanEqualsCheckedValidatorArray;
+}(ValidatorArray));
 
-var CountUnCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(CountUnCheckedValidatorArray, _super);
-    function CountUnCheckedValidatorArray(count, value, target, event, autoValid) {
+var CountLessThanCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountLessThanCheckedValidatorArray, _super);
+    function CountLessThanCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
         _this.count = count;
         return _this;
     }
-    CountUnCheckedValidatorArray.prototype.valid = function () {
+    CountLessThanCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return !it.checked; }).length >= this.count;
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return it.checked; }).length < this.count;
     };
-    return CountUnCheckedValidatorArray;
+    return CountLessThanCheckedValidatorArray;
 }(ValidatorArray));
 
 var CountLessThanUnCheckedValidatorArray = /** @class */ (function (_super) {
@@ -3784,46 +3802,35 @@ var CountLessThanUnCheckedValidatorArray = /** @class */ (function (_super) {
     return CountLessThanUnCheckedValidatorArray;
 }(ValidatorArray));
 
-var FormValidator = /** @class */ (function (_super) {
-    __extends(FormValidator, _super);
-    function FormValidator(target, event, autoValid) {
-        if (autoValid === void 0) { autoValid = true; }
-        return _super.call(this, undefined, target, event, autoValid) || this;
-    }
-    FormValidator.prototype.validAction = function () {
-        return _super.prototype.childValidAction.call(this);
-    };
-    FormValidator.prototype.valid = function () {
-        return this.childValid();
-    };
-    FormValidator.prototype.reset = function () {
-        this.targetReset();
-    };
-    return FormValidator;
-}(Validator));
-
-var IncludeCheckedValidatorArray = /** @class */ (function (_super) {
-    __extends(IncludeCheckedValidatorArray, _super);
-    function IncludeCheckedValidatorArray(include, allRequired, value, target, event, autoValid) {
-        if (allRequired === void 0) { allRequired = false; }
+var CountUnCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(CountUnCheckedValidatorArray, _super);
+    function CountUnCheckedValidatorArray(count, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
-        _this.include = include;
-        _this.allRequired = allRequired;
+        _this.count = count;
         return _this;
     }
-    IncludeCheckedValidatorArray.prototype.valid = function () {
-        var _this = this;
+    CountUnCheckedValidatorArray.prototype.valid = function () {
         var _a;
-        var valus = (_a = this.value) !== null && _a !== void 0 ? _a : [];
-        var checkedValue = valus.filter(function (it) { return it.checked; }).map(function (it) { return it.value; });
-        return checkedValue.length > 0 &&
-            (!(checkedValue.filter(function (it) { return !_this.include.includes(it); }).length > 0)) &&
-            (this.allRequired ? checkedValue.filter(function (it) { return _this.include.includes(it); }).length === this.include.length : true);
+        return ((_a = this.value) !== null && _a !== void 0 ? _a : []).filter(function (it) { return !it.checked; }).length >= this.count;
     };
-    return IncludeCheckedValidatorArray;
+    return CountUnCheckedValidatorArray;
 }(ValidatorArray));
 
+var EmptyValidator = /** @class */ (function (_super) {
+    __extends(EmptyValidator, _super);
+    function EmptyValidator(value, target, event, autoValid) {
+        if (autoValid === void 0) { autoValid = true; }
+        return _super.call(this, value, target, event, autoValid) || this;
+    }
+    EmptyValidator.prototype.valid = function () {
+        var _a, _b;
+        var value = this.value;
+        return value === undefined || value === null || ((_b = (_a = value) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) <= 0;
+    };
+    return EmptyValidator;
+}(Validator));
+
 var MultipleValidator = /** @class */ (function (_super) {
     __extends(MultipleValidator, _super);
     function MultipleValidator(validators, value, target, event, autoValid) {
@@ -3875,19 +3882,66 @@ var ExcludeCheckedValidatorArray = /** @class */ (function (_super) {
     return ExcludeCheckedValidatorArray;
 }(ValidatorArray));
 
-var NotEmptyValidator = /** @class */ (function (_super) {
-    __extends(NotEmptyValidator, _super);
-    function NotEmptyValidator(value, target, event, autoValid) {
+var IncludeCheckedValidatorArray = /** @class */ (function (_super) {
+    __extends(IncludeCheckedValidatorArray, _super);
+    function IncludeCheckedValidatorArray(include, allRequired, value, target, event, autoValid) {
+        if (allRequired === void 0) { allRequired = false; }
         if (autoValid === void 0) { autoValid = true; }
-        return _super.call(this, value, target, event, autoValid) || this;
+        var _this = _super.call(this, value, target, event, autoValid) || this;
+        _this.include = include;
+        _this.allRequired = allRequired;
+        return _this;
     }
-    NotEmptyValidator.prototype.valid = function () {
-        var _a, _b;
+    IncludeCheckedValidatorArray.prototype.valid = function () {
+        var _this = this;
+        var _a;
+        var valus = (_a = this.value) !== null && _a !== void 0 ? _a : [];
+        var checkedValue = valus.filter(function (it) { return it.checked; }).map(function (it) { return it.value; });
+        return checkedValue.length > 0 &&
+            (!(checkedValue.filter(function (it) { return !_this.include.includes(it); }).length > 0)) &&
+            (this.allRequired ? checkedValue.filter(function (it) { return _this.include.includes(it); }).length === this.include.length : true);
+    };
+    return IncludeCheckedValidatorArray;
+}(ValidatorArray));
+
+var FormValidator = /** @class */ (function (_super) {
+    __extends(FormValidator, _super);
+    function FormValidator(target, event, autoValid) {
+        if (autoValid === void 0) { autoValid = true; }
+        return _super.call(this, undefined, target, event, autoValid) || this;
+    }
+    FormValidator.prototype.validAction = function () {
+        return _super.prototype.childValidAction.call(this);
+    };
+    FormValidator.prototype.valid = function () {
+        return this.childValid();
+    };
+    FormValidator.prototype.reset = function () {
+        this.targetReset();
+    };
+    return FormValidator;
+}(Validator));
+
+var NotRegExpTestValidator = /** @class */ (function (_super) {
+    __extends(NotRegExpTestValidator, _super);
+    function NotRegExpTestValidator(regexp, value, target, event, autoValid) {
+        if (autoValid === void 0) { autoValid = true; }
+        var _this = _super.call(this, value, target, event, autoValid) || this;
+        _this.regexp = DomRenderProxy.final(regexp);
+        return _this;
+    }
+    NotRegExpTestValidator.prototype.valid = function () {
+        var _a;
         var value = this.value;
-        // console.log('NotEmptyValidator', value, value !== undefined && value !== null && ((value as any)?.length ?? 0) > 0)
-        return value !== undefined && value !== null && ((_b = (_a = value) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0;
+        var regExp = (_a = this.regexp._DomRender_origin) !== null && _a !== void 0 ? _a : this.regexp;
+        if (value) {
+            return !regExp.test(value);
+        }
+        else {
+            return true;
+        }
     };
-    return NotEmptyValidator;
+    return NotRegExpTestValidator;
 }(Validator));
 
 var PassValidator = /** @class */ (function (_super) {
@@ -3925,21 +3979,6 @@ var RegExpTestValidator = /** @class */ (function (_super) {
     return RegExpTestValidator;
 }(Validator));
 
-var ValidMultipleValidator = /** @class */ (function (_super) {
-    __extends(ValidMultipleValidator, _super);
-    function ValidMultipleValidator(validMultipleCallback, validators, value, target, event, autoValid) {
-        if (autoValid === void 0) { autoValid = true; }
-        var _this = _super.call(this, validators, value, target, event, autoValid) || this;
-        _this.validMultipleCallback = validMultipleCallback;
-        _this.validators = validators;
-        return _this;
-    }
-    ValidMultipleValidator.prototype.valid = function () {
-        return this.validMultipleCallback(this.validators, this.value, this.getTarget(), this.getEvent());
-    };
-    return ValidMultipleValidator;
-}(MultipleValidator));
-
 var RequiredValidator = /** @class */ (function (_super) {
     __extends(RequiredValidator, _super);
     function RequiredValidator(value, target, event, autoValid) {
@@ -3967,19 +4006,35 @@ var UnCheckedValidator = /** @class */ (function (_super) {
     return UnCheckedValidator;
 }(Validator));
 
-var ValidValidatorArray = /** @class */ (function (_super) {
-    __extends(ValidValidatorArray, _super);
-    function ValidValidatorArray(validCallBack, value, target, event, autoValid) {
+var NotEmptyValidator = /** @class */ (function (_super) {
+    __extends(NotEmptyValidator, _super);
+    function NotEmptyValidator(value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
-        var _this = _super.call(this, value, target, event, autoValid) || this;
-        _this.validCallBack = validCallBack;
+        return _super.call(this, value, target, event, autoValid) || this;
+    }
+    NotEmptyValidator.prototype.valid = function () {
+        var _a, _b;
+        var value = this.value;
+        // console.log('NotEmptyValidator', value, value !== undefined && value !== null && ((value as any)?.length ?? 0) > 0)
+        return value !== undefined && value !== null && ((_b = (_a = value) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) > 0;
+    };
+    return NotEmptyValidator;
+}(Validator));
+
+var ValidMultipleValidator = /** @class */ (function (_super) {
+    __extends(ValidMultipleValidator, _super);
+    function ValidMultipleValidator(validMultipleCallback, validators, value, target, event, autoValid) {
+        if (autoValid === void 0) { autoValid = true; }
+        var _this = _super.call(this, validators, value, target, event, autoValid) || this;
+        _this.validMultipleCallback = validMultipleCallback;
+        _this.validators = validators;
         return _this;
     }
-    ValidValidatorArray.prototype.valid = function () {
-        return this.validCallBack(this.value, this.getTarget(), this.getEvent());
+    ValidMultipleValidator.prototype.valid = function () {
+        return this.validMultipleCallback(this.validators, this.value, this.getTarget(), this.getEvent());
     };
-    return ValidValidatorArray;
-}(ValidatorArray));
+    return ValidMultipleValidator;
+}(MultipleValidator));
 
 var ValidValidator = /** @class */ (function (_super) {
     __extends(ValidValidator, _super);
@@ -3995,27 +4050,19 @@ var ValidValidator = /** @class */ (function (_super) {
     return ValidValidator;
 }(Validator));
 
-var NotRegExpTestValidator = /** @class */ (function (_super) {
-    __extends(NotRegExpTestValidator, _super);
-    function NotRegExpTestValidator(regexp, value, target, event, autoValid) {
+var ValidValidatorArray = /** @class */ (function (_super) {
+    __extends(ValidValidatorArray, _super);
+    function ValidValidatorArray(validCallBack, value, target, event, autoValid) {
         if (autoValid === void 0) { autoValid = true; }
         var _this = _super.call(this, value, target, event, autoValid) || this;
-        _this.regexp = DomRenderProxy.final(regexp);
+        _this.validCallBack = validCallBack;
         return _this;
     }
-    NotRegExpTestValidator.prototype.valid = function () {
-        var _a;
-        var value = this.value;
-        var regExp = (_a = this.regexp._DomRender_origin) !== null && _a !== void 0 ? _a : this.regexp;
-        if (value) {
-            return !regExp.test(value);
-        }
-        else {
-            return true;
-        }
+    ValidValidatorArray.prototype.valid = function () {
+        return this.validCallBack(this.value, this.getTarget(), this.getEvent());
     };
-    return NotRegExpTestValidator;
-}(Validator));
+    return ValidValidatorArray;
+}(ValidatorArray));
 
 var ValueEqualsValidator = /** @class */ (function (_super) {
     __extends(ValueEqualsValidator, _super);
@@ -4187,7 +4234,8 @@ exports.NodeUtils = NodeUtils;
 exports.NonPassValidator = NonPassValidator;
 exports.NotEmptyValidator = NotEmptyValidator;
 exports.NotRegExpTestValidator = NotRegExpTestValidator;
-exports.OperatorRender = OperatorRender;
+exports.OperatorExecuter = OperatorExecuter;
+exports.OperatorExecuterAttrRequire = OperatorExecuterAttrRequire;
 exports.PassValidator = PassValidator;
 exports.PathRouter = PathRouter;
 exports.RandomUtils = RandomUtils;