dom-render 1.0.66 → 1.0.70

package/Config.d.ts

@@ -1,5 +1,5 @@
 import { ConstructorType } from './types/Types';
-import { RawSet, Render } from './RawSet';
+import { CreatorMetaData, RawSet, Render } from './RawSet';
 export declare type TargetElement = {
     name: string;
     template?: string;
@@ -7,6 +7,7 @@ export declare type TargetElement = {
     callBack: (target: Element, obj: any, rawSet: RawSet) => DocumentFragment;
     complete?: (target: Element, obj: any, rawSet: RawSet) => void;
     __render?: Render;
+    __creatorMetaData?: CreatorMetaData;
 };
 export declare type TargetAttr = {
     name: string;
@@ -14,10 +15,11 @@ export declare type TargetAttr = {
     complete?: (target: Element, attrValue: string, obj: any, rawSet: RawSet) => void;
 };
 export interface Config {
+    window: Window;
     targetElements?: TargetElement[];
     targetAttrs?: TargetAttr[];
-    onElementInit?: (name: string, obj: any, rawSet: RawSet, targetElement: TargetElement) => void;
-    onAttrInit?: (name: string, attrValue: string, obj: any, rawSet: RawSet) => void;
+    onElementInit?: (name: string, obj: any, rawSet: RawSet, targetElement: TargetElement) => any;
+    onAttrInit?: (name: string, attrValue: string, obj: any, rawSet: RawSet) => any;
     proxyExcludeTyps?: ConstructorType<any>[];
     proxyExcludeOnBeforeReturnSets?: string[];
     proxyExcludeOnBeforeReturnGets?: string[];

package/Config.js

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

package/DomRender.js

@@ -1,5 +1,8 @@
-import { DomRenderProxy } from './DomRenderProxy';
-var DomRender = (function () {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomRender = void 0;
+var DomRenderProxy_1 = require("./DomRenderProxy");
+var DomRender = /** @class */ (function () {
     function DomRender() {
     }
     DomRender.run = function (obj, target, config) {
@@ -11,7 +14,10 @@ var DomRender = (function () {
             robj = obj;
             return robj;
         }
-        var domRender = new DomRenderProxy(obj, target, config);
+        if (!config) {
+            config = { window: window };
+        }
+        var domRender = new DomRenderProxy_1.DomRenderProxy(obj, target, config);
         var dest = new Proxy(obj, domRender);
         robj = dest;
         domRender.run(robj);
@@ -19,4 +25,5 @@ var DomRender = (function () {
     };
     return DomRender;
 }());
-export { DomRender };
+exports.DomRender = DomRender;
+// export default DomRender;

package/DomRenderProxy.d.ts

@@ -2,12 +2,12 @@ import { RawSet } from './RawSet';
 import { Config } from './Config';
 export declare class DomRenderProxy<T extends object> implements ProxyHandler<T> {
     _domRender_origin: T;
-    private config?;
+    private config;
     _domRender_ref: Map<object, Set<string>>;
     _rawSets: Map<string, Set<RawSet>>;
     _domRender_proxy?: T;
     _targets: Set<Node>;
-    constructor(_domRender_origin: T, target?: Node, config?: Config | undefined);
+    constructor(_domRender_origin: T, target: Node | undefined, config: Config);
     static unFinal<T = any>(obj: T): T;
     static final<T = any>(obj: T): T;
     static isFinal<T = any>(obj: T): boolean;
@@ -23,6 +23,7 @@ export declare class DomRenderProxy<T extends object> implements ProxyHandler<T>
     addRef(parent: object, path: string): void;
     addRawSetAndRender(path: string, rawSet: RawSet): void;
     addRawSet(path: string, rawSet: RawSet): void;
-    removeRawSet(raws: RawSet): void;
-    garbageRawSet(): void;
+    removeRawSet(...raws: RawSet[]): void;
+    private targetGarbageRawSet;
+    private garbageRawSet;
 }

package/DomRenderProxy.js

@@ -1,9 +1,12 @@
-import { RawSet } from './RawSet';
-import { eventManager } from './events/EventManager';
-import { ScriptUtils } from './utils/script/ScriptUtils';
-import { Shield } from './types/Types';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DomRenderProxy = void 0;
+var RawSet_1 = require("./RawSet");
+var EventManager_1 = require("./events/EventManager");
+var ScriptUtils_1 = require("./utils/script/ScriptUtils");
+var Types_1 = require("./types/Types");
 var excludeGetSetPropertys = ['onBeforeReturnGet', 'onBeforeReturnSet', '__domrender_components', '__render', '_DomRender_isFinal', '_domRender_ref', '_rawSets', '_domRender_proxy', '_targets', '_DomRender_origin', '_DomRender_ref', '_DomRender_proxy'];
-var DomRenderProxy = (function () {
+var DomRenderProxy = /** @class */ (function () {
     function DomRenderProxy(_domRender_origin, target, config) {
         this._domRender_origin = _domRender_origin;
         this.config = config;
@@ -15,15 +18,13 @@ var DomRenderProxy = (function () {
         }
     }
     DomRenderProxy.unFinal = function (obj) {
-        delete obj._DomRender_isFinal;
-        return obj;
+        return Types_1.DomRenderFinalProxy.unFinal(obj);
     };
     DomRenderProxy.final = function (obj) {
-        obj._DomRender_isFinal = true;
-        return obj;
+        return Types_1.DomRenderFinalProxy.final(obj);
     };
     DomRenderProxy.isFinal = function (obj) {
-        return '_DomRender_isFinal' in obj;
+        return Types_1.DomRenderFinalProxy.isFinal(obj);
     };
     DomRenderProxy.prototype.run = function (objProxy) {
         var _this = this;
@@ -31,10 +32,14 @@ var DomRenderProxy = (function () {
         var obj = objProxy._DomRender_origin;
         if (obj) {
             Object.keys(obj).forEach(function (it) {
-                var _a, _b, _c;
+                var _a, _b;
+                // console.log('key-------->', it)
                 var target = obj[it];
-                if (target !== undefined && target !== null && typeof target === 'object' && !DomRenderProxy.isFinal(target) && !Object.isFrozen(target) && !(obj instanceof Shield)) {
-                    var filter = (_c = (_b = (_a = _this.config) === null || _a === void 0 ? void 0 : _a.proxyExcludeTyps) === null || _b === void 0 ? void 0 : _b.filter(function (it) { return target instanceof it; })) !== null && _c !== void 0 ? _c : [];
+                if (target !== undefined && target !== null && typeof target === 'object' && !DomRenderProxy.isFinal(target) && !Object.isFrozen(target) && !(obj instanceof Types_1.Shield)) {
+                    // console.log('target-------->', it, target);
+                    // console.count('target')
+                    // console.log('target-------->')
+                    var filter = (_b = (_a = _this.config.proxyExcludeTyps) === null || _a === void 0 ? void 0 : _a.filter(function (it) { return target instanceof it; })) !== null && _b !== void 0 ? _b : [];
                     if (filter.length === 0) {
                         var proxyAfter = _this.proxy(objProxy, target, it);
                         obj[it] = proxyAfter;
@@ -48,23 +53,36 @@ var DomRenderProxy = (function () {
     };
     DomRenderProxy.prototype.initRender = function (target) {
         var _this = this;
-        var _a, _b;
+        var _a, _b, _c, _d, _e, _f, _g;
+        var onCreate = (_b = (_a = target).getAttribute) === null || _b === void 0 ? void 0 : _b.call(_a, 'dr-on-create');
+        var createParam = undefined;
+        if (onCreate) {
+            createParam = ScriptUtils_1.ScriptUtils.evalReturn(onCreate, this._domRender_proxy);
+        }
+        (_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 : '';
         this._targets.add(target);
-        var rawSets = RawSet.checkPointCreates(target, this.config);
-        eventManager.applyEvent(this._domRender_proxy, eventManager.findAttrElements(target, this.config), this.config);
+        var rawSets = RawSet_1.RawSet.checkPointCreates(target, this.config);
+        EventManager_1.eventManager.applyEvent(this._domRender_proxy, EventManager_1.eventManager.findAttrElements(target, this.config), this.config);
         rawSets.forEach(function (it) {
-            var strings = it.getUsingTriggerVariables(_this.config);
-            if (strings.size <= 0) {
+            var variables = it.getUsingTriggerVariables(_this.config);
+            if (variables.size <= 0) {
                 _this.addRawSet('', it);
             }
             else {
-                strings.forEach(function (sit) {
+                variables.forEach(function (sit) {
                     _this.addRawSet(sit, it);
                 });
             }
         });
         this.render(this.getRawSets());
-        (_b = (_a = this._domRender_proxy) === null || _a === void 0 ? void 0 : _a.onInitRender) === null || _b === void 0 ? void 0 : _b.call(_a);
+        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 });
     };
     DomRenderProxy.prototype.getRawSets = function () {
         var set = new Set();
@@ -75,20 +93,35 @@ var DomRenderProxy = (function () {
     };
     DomRenderProxy.prototype.render = function (raws) {
         var _this = this;
+        var removeRawSets = [];
         (raws !== null && raws !== void 0 ? raws : this.getRawSets()).forEach(function (it) {
+            var _a;
             it.getUsingTriggerVariables(_this.config).forEach(function (path) { return _this.addRawSet(path, it); });
-            if (it.point.start.isConnected && it.point.start.isConnected) {
-                var rawSets = it.render(_this._domRender_proxy, _this.config);
-                _this.render(rawSets);
+            // console.log('------->', it, it.isConnected)
+            if (it.isConnected) {
+                if ((_a = it.detect) === null || _a === void 0 ? void 0 : _a.action) {
+                    it.detect.action();
+                }
+                else {
+                    var rawSets = it.render(_this._domRender_proxy, _this.config);
+                    if (rawSets && rawSets.length > 0) {
+                        _this.render(rawSets);
+                    }
+                }
             }
             else {
-                _this.removeRawSet(it);
+                removeRawSets.push(it);
+                // this.removeRawSet(it)
             }
         });
+        if (removeRawSets.length > 0) {
+            this.removeRawSet.apply(this, removeRawSets);
+        }
     };
     DomRenderProxy.prototype.root = function (paths, value, lastDoneExecute) {
         var _this = this;
         if (lastDoneExecute === void 0) { lastDoneExecute = true; }
+        // console.log('root--->', paths, value, this._domRender_ref, this._domRender_origin);
         var fullPaths = [];
         if (this._domRender_ref.size > 0) {
             this._domRender_ref.forEach(function (it, key) {
@@ -103,13 +136,20 @@ var DomRenderProxy = (function () {
         }
         else {
             var strings = paths.reverse();
-            var fullPathStr_1 = strings.join('.');
+            // const fullPathStr = strings.join('.');
+            var fullPathStr_1 = strings.map(function (it) { return isNaN(Number(it)) ? '.' + it : "[".concat(it, "]"); }).join('').slice(1);
             if (lastDoneExecute) {
                 var iterable = this._rawSets.get(fullPathStr_1);
-                var front = strings.slice(0, strings.length - 1).join('.');
+                // array check
+                var front = strings.slice(0, strings.length - 1).map(function (it) { return isNaN(Number(it)) ? '.' + it : "[".concat(it, "]"); }).join('');
+                // front = front.replace(/\.\[/g, '[');
+                // const front = strings.slice(0, strings.length - 1).join('.');
+                // front = front.replace(/\.\[/g, '[');
                 var last = strings[strings.length - 1];
-                if (!isNaN(Number(last)) && Array.isArray(ScriptUtils.evalReturn('this.' + front, this._domRender_proxy))) {
-                    var aIterable = this._rawSets.get(front);
+                // console.log('root-else-->', fullPathStr, iterable, front, last)
+                // if (!isNaN(Number(last)) && Array.isArray(ScriptUtils.evalReturn('this' + front, this._domRender_proxy))) {
+                if (last === 'length' && Array.isArray(ScriptUtils_1.ScriptUtils.evalReturn('this' + front, this._domRender_proxy))) {
+                    var aIterable = this._rawSets.get(front.slice(1));
                     if (aIterable) {
                         this.render(Array.from(aIterable));
                     }
@@ -119,8 +159,8 @@ var DomRenderProxy = (function () {
                 }
                 this._targets.forEach(function (it) {
                     if (it.nodeType === Node.DOCUMENT_FRAGMENT_NODE || it.nodeType === Node.ELEMENT_NODE) {
-                        var targets = eventManager.findAttrElements(it, _this.config);
-                        eventManager.changeVar(_this._domRender_proxy, targets, "this." + fullPathStr_1);
+                        var targets = EventManager_1.eventManager.findAttrElements(it, _this.config);
+                        EventManager_1.eventManager.changeVar(_this._domRender_proxy, targets, "this.".concat(fullPathStr_1), _this.config);
                     }
                 });
             }
@@ -129,7 +169,17 @@ var DomRenderProxy = (function () {
         return fullPaths;
     };
     DomRenderProxy.prototype.set = function (target, p, value, receiver) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
+        if (typeof p === 'string' && p !== '__domrender_components' && excludeGetSetPropertys.includes(p)) {
+            target[p] = value;
+            return true;
+        }
+        // console.log('set proxy-->', target, p, value, this._rawSets, this._domRender_ref);
+        // if (typeof p === 'string' && '__render' === p) {
+        //     (target as any)[p] = value;
+        //     return true;
+        // }
+        // console.log('set--?', p, target, value);
         if (typeof p === 'string') {
             value = this.proxy(receiver, value, p);
         }
@@ -138,13 +188,15 @@ var DomRenderProxy = (function () {
         if (typeof p === 'string') {
             fullPath = this.root([p], value);
         }
-        if (('onBeforeReturnSet' in receiver) && typeof p === 'string' && !((_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.proxyExcludeOnBeforeReturnSets) !== null && _b !== void 0 ? _b : []).concat(excludeGetSetPropertys).includes(p)) {
-            (_d = (_c = receiver) === null || _c === void 0 ? void 0 : _c.onBeforeReturnSet) === null || _d === void 0 ? void 0 : _d.call(_c, p, value, fullPath);
+        // console.log('full path:', fullPath);
+        if (('onBeforeReturnSet' in receiver) && typeof p === 'string' && !((_a = this.config.proxyExcludeOnBeforeReturnSets) !== null && _a !== void 0 ? _a : []).concat(excludeGetSetPropertys).includes(p)) {
+            (_c = (_b = receiver) === null || _b === void 0 ? void 0 : _b.onBeforeReturnSet) === null || _c === void 0 ? void 0 : _c.call(_b, p, value, fullPath);
         }
         return true;
     };
     DomRenderProxy.prototype.get = function (target, p, receiver) {
-        var _a, _b, _c, _d;
+        var _a, _b, _c;
+        // console.log('get-->', target, p, receiver);
         if (p === '_DomRender_origin') {
             return this._domRender_origin;
         }
@@ -155,12 +207,26 @@ var DomRenderProxy = (function () {
             return this;
         }
         else {
+            // Date라던지 이런놈들은-_-프록시가 이상하게 동작해서
+            // console.log('--->', p, target, target.bind, 'bind' in target)
+            // if ((p in target) && ('bind' in target)) {
+            //     try{
+            //     return (target as any)[p].bind(target);
+            //     }catch (e) {
+            //         console.error(e)
+            //     }
+            // } else {
+            //     return (target as any)[p]
+            // }
+            // return (p in target) ? (target as any)[p].bind(target) : (target as any)[p]
+            // console.log('-->', p, Object.prototype.toString.call((target as any)[p]), (target as any)[p])
+            // return (target as any)[p]
             var it_1 = target[p];
             if (it_1 && typeof it_1 === 'object' && ('_DomRender_isProxy' in it_1) && Object.prototype.toString.call(it_1._DomRender_origin) === '[object Date]') {
                 it_1 = it_1._DomRender_origin;
             }
-            if (('onBeforeReturnGet' in receiver) && typeof p === 'string' && !((_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.proxyExcludeOnBeforeReturnGets) !== null && _b !== void 0 ? _b : []).concat(excludeGetSetPropertys).includes(p)) {
-                (_d = (_c = receiver) === null || _c === void 0 ? void 0 : _c.onBeforeReturnGet) === null || _d === void 0 ? void 0 : _d.call(_c, p, it_1, this.root([p], it_1, false));
+            if (('onBeforeReturnGet' in receiver) && typeof p === 'string' && !((_a = this.config.proxyExcludeOnBeforeReturnGets) !== null && _a !== void 0 ? _a : []).concat(excludeGetSetPropertys).includes(p)) {
+                (_c = (_b = receiver) === null || _b === void 0 ? void 0 : _b.onBeforeReturnGet) === null || _c === void 0 ? void 0 : _c.call(_b, p, it_1, this.root([p], it_1, false));
             }
             return it_1;
         }
@@ -169,16 +235,16 @@ var DomRenderProxy = (function () {
         return p === '_DomRender_isProxy' || p in target;
     };
     DomRenderProxy.prototype.proxy = function (parentProxy, obj, p) {
-        var _a, _b, _c;
-        var proxyTarget = ((_c = (_b = (_a = this.config) === null || _a === void 0 ? void 0 : _a.proxyExcludeTyps) === null || _b === void 0 ? void 0 : _b.filter(function (it) { return obj instanceof it; })) !== null && _c !== void 0 ? _c : []).length <= 0;
-        if (proxyTarget && obj !== undefined && obj !== null && typeof obj === 'object' && !('_DomRender_isProxy' in obj) && !DomRenderProxy.isFinal(obj) && !Object.isFrozen(obj) && !(obj instanceof Shield)) {
+        var _a, _b;
+        var proxyTarget = ((_b = (_a = this.config.proxyExcludeTyps) === null || _a === void 0 ? void 0 : _a.filter(function (it) { return obj instanceof it; })) !== null && _b !== void 0 ? _b : []).length <= 0;
+        if (proxyTarget && obj !== undefined && obj !== null && typeof obj === 'object' && !('_DomRender_isProxy' in obj) && !DomRenderProxy.isFinal(obj) && !Object.isFrozen(obj) && !(obj instanceof Types_1.Shield)) {
             var domRender = new DomRenderProxy(obj, undefined, this.config);
             domRender.addRef(parentProxy, p);
             var proxy = new Proxy(obj, domRender);
             domRender.run(proxy);
             return proxy;
         }
-        if (proxyTarget && obj !== undefined && obj !== null && typeof obj === 'object' && ('_DomRender_isProxy' in obj) && !DomRenderProxy.isFinal(obj) && !Object.isFrozen(obj) && !(obj instanceof Shield)) {
+        if (proxyTarget && obj !== undefined && obj !== null && typeof obj === 'object' && ('_DomRender_isProxy' in obj) && !DomRenderProxy.isFinal(obj) && !Object.isFrozen(obj) && !(obj instanceof Types_1.Shield)) {
             var d = obj._DomRender_proxy;
             d.addRef(this._domRender_proxy, p);
             return obj;
@@ -200,16 +266,42 @@ var DomRenderProxy = (function () {
     };
     DomRenderProxy.prototype.addRawSet = function (path, rawSet) {
         var _a;
+        // console.log('addRawSet-->', path, rawSet)
         if (!this._rawSets.get(path)) {
             this._rawSets.set(path, new Set());
         }
         (_a = this._rawSets.get(path)) === null || _a === void 0 ? void 0 : _a.add(rawSet);
     };
-    DomRenderProxy.prototype.removeRawSet = function (raws) {
+    // public removeRawSet(...raws: RawSet[]) {
+    //     this._rawSets.forEach(it => {
+    //         raws.forEach(sit => it.delete(sit));
+    //     })
+    //     this.garbageRawSet();
+    // }
+    DomRenderProxy.prototype.removeRawSet = function () {
+        var raws = [];
+        for (var _i = 0; _i < arguments.length; _i++) {
+            raws[_i] = arguments[_i];
+        }
         this._rawSets.forEach(function (it) {
-            it.delete(raws);
+            it.forEach(function (sit) {
+                if (!sit.isConnected) {
+                    it.delete(sit);
+                }
+                else if (raws.includes(sit)) {
+                    it.delete(sit);
+                }
+            });
+        });
+        this.targetGarbageRawSet();
+    };
+    DomRenderProxy.prototype.targetGarbageRawSet = function () {
+        var _this = this;
+        this._targets.forEach(function (it) {
+            if (!it.isConnected) {
+                _this._targets.delete(it);
+            }
         });
-        this.garbageRawSet();
     };
     DomRenderProxy.prototype.garbageRawSet = function () {
         var _this = this;
@@ -228,4 +320,4 @@ var DomRenderProxy = (function () {
     };
     return DomRenderProxy;
 }());
-export { DomRenderProxy };
+exports.DomRenderProxy = DomRenderProxy;