dom-render 1.0.87 → 1.0.90

package/{RawSet.js → rawsets/RawSet.js}

@@ -20,41 +20,30 @@ var __spreadArray = (this && this.__spreadArray) || function (to, from, pack) {
     return to.concat(ar || Array.prototype.slice.call(from));
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.RawSet = exports.RawSetType = exports.DestroyOptionType = void 0;
-var RandomUtils_1 = require("./utils/random/RandomUtils");
-var StringUtils_1 = require("./utils/string/StringUtils");
-var ScriptUtils_1 = require("./utils/script/ScriptUtils");
-var EventManager_1 = require("./events/EventManager");
-var Range_1 = require("./iterators/Range");
-var Types_1 = require("./types/Types");
-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 DrThis_1 = require("./operators/DrThis");
-var DrForm_1 = require("./operators/DrForm");
-var DrInnerText_1 = require("./operators/DrInnerText");
-var DrInnerHTML_1 = require("./operators/DrInnerHTML");
-var DrFor_1 = require("./operators/DrFor");
-var DrForOf_1 = require("./operators/DrForOf");
-var DrAppender_1 = require("./operators/DrAppender");
-var DrRepeat_1 = require("./operators/DrRepeat");
-var DrTargetElement_1 = require("./operators/DrTargetElement");
-var DrTargetAttr_1 = require("./operators/DrTargetAttr");
-var DestroyOptionType;
-(function (DestroyOptionType) {
-    DestroyOptionType["NO_DESTROY"] = "NO_DESTROY";
-    DestroyOptionType["NO_MESSENGER_DESTROY"] = "NO_MESSENGER_DESTROY";
-})(DestroyOptionType = exports.DestroyOptionType || (exports.DestroyOptionType = {}));
-var RawSetType;
-(function (RawSetType) {
-    RawSetType["TEXT"] = "TEXT";
-    RawSetType["STYLE_TEXT"] = "STYLE_TEXT";
-    RawSetType["TARGET_ELEMENT"] = "TARGET_ELEMENT";
-    RawSetType["TARGET_ATTR"] = "TARGET_ATTR";
-    RawSetType["UNKOWN"] = "UNKOWN";
-})(RawSetType = exports.RawSetType || (exports.RawSetType = {}));
+exports.RawSet = void 0;
+var RandomUtils_1 = require("../utils/random/RandomUtils");
+var StringUtils_1 = require("../utils/string/StringUtils");
+var ScriptUtils_1 = require("../utils/script/ScriptUtils");
+var EventManager_1 = require("../events/EventManager");
+var Range_1 = require("../iterators/Range");
+var Types_1 = require("../types/Types");
+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 DrThis_1 = require("../operators/DrThis");
+var DrForm_1 = require("../operators/DrForm");
+var DrInnerText_1 = require("../operators/DrInnerText");
+var DrInnerHTML_1 = require("../operators/DrInnerHTML");
+var DrFor_1 = require("../operators/DrFor");
+var DrForOf_1 = require("../operators/DrForOf");
+var DrAppender_1 = require("../operators/DrAppender");
+var DrRepeat_1 = require("../operators/DrRepeat");
+var DrTargetElement_1 = require("../operators/DrTargetElement");
+var DrTargetAttr_1 = require("../operators/DrTargetAttr");
+var DestroyOptionType_1 = require("./DestroyOptionType");
+var RawSetType_1 = require("./RawSetType");
 var RawSet = /** @class */ (function () {
     function RawSet(uuid, type, point, fragment, detect, data) {
         this.uuid = uuid;
@@ -88,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);
                     });
@@ -166,7 +154,7 @@ var RawSet = /** @class */ (function () {
                 (_a = cNode.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(newNode, cNode);
                 // console.log('-------', this.point.start.parentNode.nodeName)
                 // 중요 style value change 됐을때 다시 처리해야되기떄문에: 마지막에 completed 없는 attr 가지고 판단 하니깐
-                if (this.type === RawSetType.STYLE_TEXT && this.point.parent) {
+                if (this.type === RawSetType_1.RawSetType.STYLE_TEXT && this.point.parent) {
                     this.point.parent.removeAttribute('completed');
                 }
             }
@@ -227,28 +215,39 @@ var RawSet = /** @class */ (function () {
         drAttrs.forEach(function (it) {
             if (it.drCompleteOption) {
                 // genNode.childNodes
-                ScriptUtils_1.ScriptUtils.eval("\n                const ".concat(EventManager_1.EventManager.FAG_VARNAME, " = this.__render.fag;\n                const ").concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n                const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n                ").concat(it.drCompleteOption, "\n                "), Object.assign(obj, {
-                    __render: Object.freeze({
-                        rawset: _this,
-                        fag: genNode,
-                        scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj)
-                    })
-                }));
+                var render = Object.freeze({
+                    rawset: _this,
+                    fag: genNode,
+                    scripts: EventManager_1.EventManager.setBindProperty(config === null || config === void 0 ? void 0 : config.scripts, obj)
+                });
+                ScriptUtils_1.ScriptUtils.eval("\n                const ".concat(EventManager_1.EventManager.FAG_VARNAME, " = this.__render.fag;\n                const ").concat(EventManager_1.EventManager.SCRIPTS_VARNAME, " = this.__render.scripts;\n                const ").concat(EventManager_1.EventManager.RAWSET_VARNAME, " = this.__render.rawset;\n                ").concat(it.drCompleteOption), Object.assign(obj, { __render: render }));
             }
         });
         // 중요 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);
+            (_c = (_b = it_1.obj) === null || _b === void 0 ? void 0 : _b.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 }));
+            if (((_e = (_d = it_2.targetElement) === null || _d === void 0 ? void 0 : _d.__render) === null || _e === void 0 ? void 0 : _e.element) && ((_g = (_f = it_2.targetElement) === null || _f === void 0 ? void 0 : _f.__render) === null || _g === void 0 ? void 0 : _g.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];
+                    }
+                }
+                (_j = (_h = it_2.targetElement.__render.component).onInitRender) === null || _j === void 0 ? void 0 : _j.call.apply(_j, __spreadArray([_h], param, false));
+            }
             (_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);
         }
+        // TODO: 이부분도 위에 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);
@@ -441,10 +440,10 @@ var RawSet = /** @class */ (function () {
                     // end.setAttribute('id', `${it.uuid}-end`);
                     var type = void 0;
                     if (currentNode.parentNode && currentNode.parentNode.nodeName.toUpperCase() === 'STYLE') {
-                        type = RawSetType.STYLE_TEXT;
+                        type = RawSetType_1.RawSetType.STYLE_TEXT;
                     }
                     else {
-                        type = RawSetType.TEXT;
+                        type = RawSetType_1.RawSetType.TEXT;
                     }
                     var startEndPoint = RawSet.createStartEndPoint(it_4.uuid, type, config);
                     // layout setting
@@ -470,7 +469,7 @@ var RawSet = /** @class */ (function () {
                 var uuid = RandomUtils_1.RandomUtils.getRandomString(40);
                 var element_3 = currentNode;
                 var fragment = config.window.document.createDocumentFragment();
-                var type = RawSetType.TARGET_ELEMENT;
+                var type = RawSetType_1.RawSetType.TARGET_ELEMENT;
                 var startEndPoint = RawSet.createStartEndPoint(uuid, type, config);
                 var isElement = ((_d = (_c = config.targetElements) === null || _c === void 0 ? void 0 : _c.map(function (it) { return it.name.toLowerCase(); })) !== null && _d !== void 0 ? _d : []).includes(element_3.tagName.toLowerCase());
                 var targetAttrNames_2 = ((_f = (_e = config.targetAttrs) === null || _e === void 0 ? void 0 : _e.map(function (it) { return it.name; })) !== null && _f !== void 0 ? _f : []).concat(RawSet.DR_ATTRIBUTES);
@@ -478,7 +477,7 @@ var RawSet = /** @class */ (function () {
                 (_g = currentNode === null || currentNode === void 0 ? void 0 : currentNode.parentNode) === null || _g === void 0 ? void 0 : _g.insertBefore(startEndPoint.start, currentNode);
                 (_h = currentNode === null || currentNode === void 0 ? void 0 : currentNode.parentNode) === null || _h === void 0 ? void 0 : _h.insertBefore(startEndPoint.end, currentNode.nextSibling);
                 fragment.append(currentNode);
-                pars.push(new RawSet(uuid, isElement ? type : (isAttr ? RawSetType.TARGET_ATTR : RawSetType.UNKOWN), {
+                pars.push(new RawSet(uuid, isElement ? type : (isAttr ? RawSetType_1.RawSetType.TARGET_ATTR : RawSetType_1.RawSetType.UNKOWN), {
                     start: startEndPoint.start,
                     node: currentNode,
                     end: startEndPoint.end,
@@ -495,17 +494,17 @@ var RawSet = /** @class */ (function () {
         return pars;
     };
     RawSet.createStartEndPoint = function (id, type, config) {
-        if (type === RawSetType.TARGET_ELEMENT) {
+        if (type === RawSetType_1.RawSetType.TARGET_ELEMENT) {
             var start = config.window.document.createElement('meta');
             var end = config.window.document.createElement('meta');
             start.setAttribute('id', "".concat(id, "-start"));
             end.setAttribute('id', "".concat(id, "-end"));
             return {
                 start: start,
-                end: end,
+                end: end
             };
         }
-        else if (type === RawSetType.STYLE_TEXT) {
+        else if (type === RawSetType_1.RawSetType.STYLE_TEXT) {
             return {
                 start: config.window.document.createTextNode("/*start text ".concat(id, "*/")),
                 end: config.window.document.createTextNode("/*end text ".concat(id, "*/"))
@@ -646,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) {
@@ -658,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);
@@ -732,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) {
@@ -752,6 +752,8 @@ var RawSet = /** @class */ (function () {
                 i.componentKey = componentKey;
                 i.rawSet = rawSet;
                 i.attribute = attribute;
+                i.router = config.router;
+                i.scripts = render.scripts;
                 i.drAttrs = attrs;
                 i.innerHTML = element.innerHTML;
                 i.rootCreator = new Proxy(obj, new Types_1.DomRenderFinalProxy());
@@ -769,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 }));
@@ -782,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가 있으면 해당안되게 우선 치환.
@@ -794,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, {
@@ -841,8 +844,8 @@ var RawSet = /** @class */ (function () {
     RawSet.destroy = function (obj, parameter, config, destroyOptions) {
         var _a;
         if (destroyOptions === void 0) { destroyOptions = []; }
-        if (!destroyOptions.some(function (it) { return it === DestroyOptionType.NO_DESTROY; })) {
-            if (!destroyOptions.some(function (it) { return it === DestroyOptionType.NO_MESSENGER_DESTROY; })) {
+        if (!destroyOptions.some(function (it) { return it === DestroyOptionType_1.DestroyOptionType.NO_DESTROY; })) {
+            if (!destroyOptions.some(function (it) { return it === DestroyOptionType_1.DestroyOptionType.NO_MESSENGER_DESTROY; })) {
                 if (config.messenger && obj) {
                     config.messenger.deleteChannelFromObj(obj);
                 }
@@ -864,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';
@@ -873,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/rawsets/RawSetType.d.ts

@@ -0,0 +1,7 @@
+export declare enum RawSetType {
+    TEXT = "TEXT",
+    STYLE_TEXT = "STYLE_TEXT",
+    TARGET_ELEMENT = "TARGET_ELEMENT",
+    TARGET_ATTR = "TARGET_ATTR",
+    UNKOWN = "UNKOWN"
+}

package/rawsets/RawSetType.js

@@ -0,0 +1,11 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.RawSetType = void 0;
+var RawSetType;
+(function (RawSetType) {
+    RawSetType["TEXT"] = "TEXT";
+    RawSetType["STYLE_TEXT"] = "STYLE_TEXT";
+    RawSetType["TARGET_ELEMENT"] = "TARGET_ELEMENT";
+    RawSetType["TARGET_ATTR"] = "TARGET_ATTR";
+    RawSetType["UNKOWN"] = "UNKOWN";
+})(RawSetType = exports.RawSetType || (exports.RawSetType = {}));

package/rawsets/Render.d.ts

@@ -0,0 +1,17 @@
+import { CreatorMetaData } from './CreatorMetaData';
+import { Router } from '../routers/Router';
+import { RawSet } from './RawSet';
+export declare type Render = {
+    rawset?: RawSet;
+    scripts?: {
+        [n: string]: any;
+    };
+    bindScript?: string;
+    element?: any;
+    attribute?: any;
+    creatorMetaData?: CreatorMetaData;
+    router?: Router;
+    range?: any;
+    value?: any;
+    [n: string]: any;
+};

package/rawsets/Render.js

@@ -0,0 +1,2 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

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));