dom-render 1.0.88 → 1.0.91

package/operators/OperatorExecuter.d.ts

@@ -0,0 +1,48 @@
+import { AttrInitCallBack } from '../rawsets/AttrInitCallBack';
+import { ElementInitCallBack } from '../rawsets/ElementInitCallBack';
+import { ComponentSet } from '../components/ComponentSet';
+import { RawSet } from '../rawsets/RawSet';
+import { Render } from '../rawsets/Render';
+import { Attrs } from '../rawsets/Attrs';
+import { Config } from '../configs/Config';
+export declare type OperatorAround = {
+    beforeAttr?: (value: string | null | undefined, opratorExecutor: OperatorExecuter) => string | null | undefined;
+    before?: (data: any, opratorExecutor: OperatorExecuter) => any;
+    after?: (data: any, opratorExecutor: OperatorExecuter) => void;
+};
+export declare enum ExecuteState {
+    EXECUTE = 0,
+    NO_EXECUTE = 1,
+    STOP = 2
+}
+export declare type AfterCallBack = {
+    onAttrInitCallBacks: AttrInitCallBack[];
+    onElementInitCallBacks: ElementInitCallBack[];
+    onThisComponentSetCallBacks: ComponentSet[];
+};
+export declare type ReturnContainer = {
+    raws: RawSet[];
+    fag: DocumentFragment;
+};
+export declare type ElementSource = {
+    element: Element;
+    attrs: Attrs;
+    attr?: string | null;
+};
+export declare type Source = {
+    config: Config;
+    operatorAround?: OperatorAround;
+    obj: any;
+};
+export declare abstract class OperatorExecuter<T = any> {
+    rawSet: RawSet;
+    render: Render;
+    returnContainer: ReturnContainer;
+    elementSource: ElementSource;
+    source: Source;
+    afterCallBack: AfterCallBack;
+    startingExecute: boolean;
+    constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack, startingExecute?: boolean);
+    start(): ExecuteState;
+    abstract execute(value: T): ExecuteState;
+}

package/operators/OperatorExecuter.js

@@ -0,0 +1,43 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OperatorExecuter = exports.ExecuteState = void 0;
+var ScriptUtils_1 = require("../utils/script/ScriptUtils");
+var ExecuteState;
+(function (ExecuteState) {
+    ExecuteState[ExecuteState["EXECUTE"] = 0] = "EXECUTE";
+    ExecuteState[ExecuteState["NO_EXECUTE"] = 1] = "NO_EXECUTE";
+    ExecuteState[ExecuteState["STOP"] = 2] = "STOP";
+})(ExecuteState = exports.ExecuteState || (exports.ExecuteState = {}));
+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;
+    }
+    ;
+    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_1.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;
+}());
+exports.OperatorExecuter = OperatorExecuter;

package/operators/OperatorExecuterAttrRequire.d.ts

@@ -0,0 +1,8 @@
+import { RawSet } from '../rawsets/RawSet';
+import { Render } from '../rawsets/Render';
+import { AfterCallBack, ElementSource, ExecuteState, OperatorExecuter, ReturnContainer, Source } from './OperatorExecuter';
+export declare abstract class OperatorExecuterAttrRequire<T> extends OperatorExecuter<T> {
+    constructor(rawSet: RawSet, render: Render, returnContainer: ReturnContainer, elementSource: ElementSource, source: Source, afterCallBack: AfterCallBack, startingExecute?: boolean);
+    execute(data: T): ExecuteState;
+    protected abstract executeAttrRequire(attr: T): ExecuteState;
+}

package/operators/OperatorExecuterAttrRequire.js

@@ -0,0 +1,55 @@
+"use strict";
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.OperatorExecuterAttrRequire = void 0;
+var OperatorExecuter_1 = require("./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 OperatorExecuter_1.ExecuteState.NO_EXECUTE;
+        }
+        return this.executeAttrRequire(data);
+    };
+    return OperatorExecuterAttrRequire;
+}(OperatorExecuter_1.OperatorExecuter));
+exports.OperatorExecuterAttrRequire = OperatorExecuterAttrRequire;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dom-render",
-  "version": "1.0.88",
+  "version": "1.0.91",
   "main": "DomRender.js",
   "license": "MIT",
   "description": "html view template engine",

package/rawsets/RawSet.d.ts

@@ -40,9 +40,15 @@ export declare class RawSet {
     static readonly DR_COMPLETE_OPTIONNAME = "dr-complete";
     static readonly DR_STRIP_OPTIONNAME = "dr-strip";
     static readonly DR_DESTROY_OPTIONNAME = "dr-destroy";
+    static readonly DR_COMPONENT_NAME_OPTIONNAME = "dr-component-name";
+    static readonly DR_COMPONENT_INNER_HTML_NAME_OPTIONNAME = "dr-component-inner-html-name";
+    static readonly DR_ON_CREATE_ARGUMENTS_OPTIONNAME = "dr-on-create:arguments";
+    static readonly DR_ON_CREATED_CALLBACK_OPTIONNAME = "dr-on-create:callback";
+    static readonly DR_ON_INIT_ARGUMENTS_OPTIONNAME = "dr-on-init:arguments";
+    static readonly DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME = "dr-on-constructor:arguments";
     static readonly drAttrsOriginName: Attrs;
     static readonly DR_TAGS: never[];
-    static readonly DR_ATTRIBUTES: string[];
+    static readonly DR_ATTRIBUTES: readonly ["dr", "dr-appender", "dr-if", "dr-for-of", "dr-for", "dr-this", "dr-form", "dr-pre", "dr-inner-html", "dr-inner-text", "dr-repeat", "dr-detect"];
     constructor(uuid: string, type: RawSetType, point: {
         start: Comment | Text | HTMLMetaElement;
         node: Node;

package/rawsets/RawSet.js

@@ -31,7 +31,7 @@ var DomUtils_1 = require("../utils/dom/DomUtils");
 var DrPre_1 = require("../operators/DrPre");
 var Dr_1 = require("../operators/Dr");
 var DrIf_1 = require("../operators/DrIf");
-var OperatorRender_1 = require("../operators/OperatorRender");
+var OperatorExecuter_1 = require("../operators/OperatorExecuter");
 var DrThis_1 = require("../operators/DrThis");
 var DrForm_1 = require("../operators/DrForm");
 var DrInnerText_1 = require("../operators/DrInnerText");
@@ -77,7 +77,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_1.EventManager.normalAttrMapAttrName);
                 if (targetAttrMap) {
-                    // console.log('----->', targetAttr);
                     new Map(JSON.parse(targetAttrMap)).forEach(function (v, k) {
                         targetScripts_1.push(v);
                     });
@@ -111,15 +110,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_1.DomUtils.getAttributeToObject(cNode);
@@ -185,27 +184,27 @@ var RawSet = /** @class */ (function () {
                 };
                 drAttrs.push(drAttr);
                 var operators = [
-                    new DrPre_1.DrPre(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new Dr_1.Dr(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrIf_1.DrIf(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrThis_1.DrThis(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrForm_1.DrForm(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrInnerText_1.DrInnerText(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrInnerHTML_1.DrInnerHTML(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrFor_1.DrFor(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrForOf_1.DrForOf(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrAppender_1.DrAppender(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
-                    new DrRepeat_1.DrRepeat(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
+                    new DrPre_1.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_1.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_1.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_1.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_1.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_1.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_1.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_1.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_1.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_1.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_1.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_1.DrTargetElement(this, __render, { raws: raws, fag: fag }, { element: element, attrs: drAttr }, { config: config, obj: obj }, { onAttrInitCallBacks: onAttrInitCallBacks, onElementInitCallBacks: onElementInitCallBacks, onThisComponentSetCallBacks: onThisComponentSetCallBacks }),
                     new DrTargetAttr_1.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();
-                    if (state === OperatorRender_1.ExecuteState.EXECUTE) {
+                for (var _z = 0, operators_1 = operators; _z < operators_1.length; _z++) {
+                    var operator = operators_1[_z];
+                    var state = operator.start();
+                    if (state === OperatorExecuter_1.ExecuteState.EXECUTE) {
                         break;
                     }
-                    else if (state === OperatorRender_1.ExecuteState.STOP) {
+                    else if (state === OperatorExecuter_1.ExecuteState.STOP) {
                         return raws;
                     }
                 }
@@ -226,20 +225,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 _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 _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 _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_1.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) {
@@ -634,7 +645,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_1.EventManager.attrPrefix, "on-create"));
+            var onCreate = element.getAttribute(RawSet.DR_ON_CREATE_ARGUMENTS_OPTIONNAME);
             var renderScript = '';
             var createParam = [];
             if (onCreate) {
@@ -646,7 +657,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_1.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_1.ScriptUtils.eval(script, obj);
@@ -720,7 +732,7 @@ var RawSet = /** @class */ (function () {
                     scripts: EventManager_1.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_1.EventManager.attrPrefix, "constructor"));
+                var constructor = element.getAttribute(RawSet.DR_ON_CONSTRUCTOR_ARGUMENTS_OPTIONNAME);
                 var constructorParam = [];
                 // dr-constructor
                 if (constructor) {
@@ -759,9 +771,9 @@ var RawSet = /** @class */ (function () {
                     });
                 }
                 // dr-on-create onCreateRender
-                var onCreate = element.getAttribute("".concat(EventManager_1.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_1.ScriptUtils.eval(script, Object.assign(obj, { __render: render }));
@@ -772,8 +784,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_1.EventManager.attrPrefix, "component-name"))) !== null && _e !== void 0 ? _e : 'component';
-                var innerHTMLName = (_f = element.getAttribute("".concat(EventManager_1.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가 있으면 해당안되게 우선 치환.
@@ -784,7 +796,8 @@ var RawSet = /** @class */ (function () {
                 }
                 applayTemplate = template.replace(RegExp("#".concat(innerHTMLName, "#"), 'g'), applayTemplate);
                 // dr-on-component-init
-                var oninit = element.getAttribute("".concat(EventManager_1.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_1.ScriptUtils.eval(script, Object.assign(obj, {
@@ -854,7 +867,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';
@@ -863,6 +875,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,

package/utils/location/LocationUtils.js

@@ -25,7 +25,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));

package/operators/OperatorRender.d.ts

@@ -1,45 +0,0 @@
-import { RawSet } from '../rawsets/RawSet';
-import { ComponentSet } from '../components/ComponentSet';
-import { Config } from '../configs/Config';
-import { Attrs } from '../rawsets/Attrs';
-import { AttrInitCallBack } from '../rawsets/AttrInitCallBack';
-import { ElementInitCallBack } from '../rawsets/ElementInitCallBack';
-import { Render } from '../rawsets/Render';
-export declare enum ExecuteState {
-    EXECUTE = 0,
-    NO_EXECUTE = 1,
-    STOP = 2
-}
-export declare type AfterCallBack = {
-    onAttrInitCallBacks: AttrInitCallBack[];
-    onElementInitCallBacks: ElementInitCallBack[];
-    onThisComponentSetCallBacks: ComponentSet[];
-};
-export declare abstract class OperatorRender {
-    rawSet: RawSet;
-    render: Render;
-    returnContainer: {
-        raws: RawSet[];
-        fag: DocumentFragment;
-    };
-    elementSource: {
-        element: Element;
-        attrs: Attrs;
-    };
-    source: {
-        config: Config;
-        obj: any;
-    };
-    afterCallBack: AfterCallBack;
-    constructor(rawSet: RawSet, render: Render, returnContainer: {
-        raws: RawSet[];
-        fag: DocumentFragment;
-    }, elementSource: {
-        element: Element;
-        attrs: Attrs;
-    }, source: {
-        config: Config;
-        obj: any;
-    }, afterCallBack: AfterCallBack);
-    abstract execRender(): ExecuteState;
-}

package/operators/OperatorRender.js

@@ -1,21 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.OperatorRender = exports.ExecuteState = void 0;
-var ExecuteState;
-(function (ExecuteState) {
-    ExecuteState[ExecuteState["EXECUTE"] = 0] = "EXECUTE";
-    ExecuteState[ExecuteState["NO_EXECUTE"] = 1] = "NO_EXECUTE";
-    ExecuteState[ExecuteState["STOP"] = 2] = "STOP";
-})(ExecuteState = exports.ExecuteState || (exports.ExecuteState = {}));
-var OperatorRender = /** @class */ (function () {
-    function OperatorRender(rawSet, render, returnContainer, elementSource, source, afterCallBack) {
-        this.rawSet = rawSet;
-        this.render = render;
-        this.returnContainer = returnContainer;
-        this.elementSource = elementSource;
-        this.source = source;
-        this.afterCallBack = afterCallBack;
-    }
-    return OperatorRender;
-}());
-exports.OperatorRender = OperatorRender;