simple-boot-front - npm Package Compare versions

Comparing version 1.0.26 to 1.0.27

module/Module.d.ts

@@ -5,3 +5,3 @@ import { Renderer } from '../render/Renderer';
 import { Navigation } from '../service/Navigation';
-import { Scope } from '../render/compile/Scope';
+import { RootScope, TargetNode } from '../render/compile/RootScope';
 export declare class Module extends SimBase implements LifeCycle {
@@ -14,3 +14,3 @@ selector: string;
     private id;
-    _scopes: Map<string, Scope>;
+    _scopes: Map<string, RootScope>;
     _option: {
@@ -46,5 +46,5 @@ template: string;
     onFinish(): void;
-    setScope(wrap?: boolean): Scope | undefined;
+    setScope(targetNode: TargetNode, strip?: boolean, uuid?: string): RootScope | undefined;
     renderToScope(varName: string): void;
-    renderWrap(selector?: string): void;
+    renderWrap(): void;
     private findModuleField;
@@ -55,5 +55,7 @@ renderd(selector: string): void;
     get templateWrapString(): string;
-    getTemplateWrapScopeString(scope: Scope): string;
+    getTemplateWrapScopeSelector(scope_uuid: string): string;
+    getWrapScopeString(scope_uuid: string): string;
+    getTemplateWrapScopeString(scope_uuid: string): string;
     get templateString(): string;
     exist(): boolean;
 }

module/Module.js

@@ -16,7 +16,2 @@ var __extends = (this && this.__extends) || (function () {
 })();
-var __spreadArray = (this && this.__spreadArray) || function (to, from) {
-    for (var i = 0, il = from.length, j = to.length; i < il; i++, j++)
-        to[j] = from[i];
-    return to;
-};
 import { Renderer } from '../render/Renderer';
@@ -194,7 +189,9 @@ import { fromEvent } from 'rxjs';
     };
-    Module.prototype.setScope = function (wrap) {
+    Module.prototype.setScope = function (targetNode, strip, uuid) {
         var _a;
-        if (wrap === void 0) { wrap = true; }
-        var scope = (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.compileScope(wrap ? this.templateWrapString : this.templateString, this);
+        if (strip === void 0) { strip = false; }
+        if (uuid === void 0) { uuid = RandomUtils.uuid(); }
+        var scope = (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.compileScope(strip ? this.templateString : this.getTemplateWrapScopeString(uuid), this, uuid);
         if (scope) {
+            scope.targetNode = targetNode;
             this._scopes.set(scope.uuid, scope);
@@ -211,9 +208,8 @@ }
     };
-    Module.prototype.renderWrap = function (selector) {
-        var _a;
-        if (selector === void 0) { selector = this.selector; }
-        if (this._scopes.size <= 0) {
-            this.setScope();
-        }
-        (_a = this._renderer) === null || _a === void 0 ? void 0 : _a.renderToByScopes.apply(_a, __spreadArray([selector], Array.from(this._scopes.values())));
+    Module.prototype.renderWrap = function () {
+        var _this = this;
+        this._scopes.forEach(function (it) {
+            var _a;
+            (_a = _this._renderer) === null || _a === void 0 ? void 0 : _a.renderToByScopes(it);
+        });
         this._onChangedRender();
@@ -256,5 +252,11 @@ this.renderd(this.selector);
     });
-    Module.prototype.getTemplateWrapScopeString = function (scope) {
-        return "<" + this._option.wrapElement + " id=\"" + this.id + "\" scope=\"" + scope.uuid + "\">" + (this._option.template || '') + "</" + this._option.wrapElement + ">";
+    Module.prototype.getTemplateWrapScopeSelector = function (scope_uuid) {
+        return this.selector + ("[scope='" + scope_uuid + "']");
     };
+    Module.prototype.getWrapScopeString = function (scope_uuid) {
+        return "<" + this._option.wrapElement + " id=\"" + this.id + "\" scope=\"" + scope_uuid + "\"></" + this._option.wrapElement + ">";
+    };
+    Module.prototype.getTemplateWrapScopeString = function (scope_uuid) {
+        return "<" + this._option.wrapElement + " id=\"" + this.id + "\" scope=\"" + scope_uuid + "\">" + (this._option.template || '') + "</" + this._option.wrapElement + ">";
+    };
     Object.defineProperty(Module.prototype, "templateString", {
@@ -261,0 +263,0 @@ get: function () {

package.json

 {
   "name": "simple-boot-front",
-  "version": "1.0.26",
+  "version": "1.0.27",
   "main": "SimpleApplication.js",
@@ -5,0 +5,0 @@ "license": "MIT",

README.MD

@@ -1,2 +0,2 @@
-simple-boot-front  [v1.0.25]
+simple-boot-front  [v1.0.27]
 ===========
@@ -146,13 +146,22 @@
  - ### Update view only for parts where the value has changed.
-```html
-<div><!--%write(this.data)%--></div>
-<div><!--%module(this.aModule)%--></div>
-<div>
-<!--%
-    for (let i of this.datas) {
-        write('<li>' + i + '</li>');
-    }
-%-->
-</div>
-```
+ - scope
+   - start: <!--% 
+   - end: %-->
+   - write: write
+   - method  
+     - module: module include  (Wrap element)
+     - stripModule: module include (no Wrap Element)
+   - ex
+      ```html
+      <div><!--%write(this.data)%--></div>
+      <div><!--%module(this.aModule)%--></div>
+      <div><!--%stripModule(this.aModule)%--></div>
+      <div>
+      <!--%
+          for (let i of this.datas) {
+              write('<li>' + i + '</li>');
+          }
+      %-->
+      </div>
+      ```
 - write: write string
@@ -159,0 +168,0 @@

render/compile/Scope.d.ts

@@ -7,2 +7,3 @@ import { ScopeObject } from './ScopeObject';
     private obj;
+    uuid: string;
     private config;
@@ -12,5 +13,4 @@ private position;
     usingVars: string[];
-    uuid: string;
     scopeResult?: ScopeResultSet;
-    constructor(raws: string, obj: any, config?: {
+    constructor(raws: string, obj: any, uuid?: string, config?: {
         start: string;
@@ -17,0 +17,0 @@ end: string;

render/compile/Scope.js

@@ -5,7 +5,9 @@ import { ScopeObject } from './ScopeObject';
 var Scope = (function () {
-    function Scope(raws, obj, config, position) {
-        if (config === void 0) { config = { start: '{%', end: '%}' }; }
+    function Scope(raws, obj, uuid, config, position) {
+        if (uuid === void 0) { uuid = RandomUtils.uuid(); }
+        if (config === void 0) { config = { start: '<!--%', end: '%-->' }; }
         if (position === void 0) { position = new ScopePosition(0, raws.length); }
         this.raws = raws;
         this.obj = obj;
+        this.uuid = uuid;
         this.config = config;
@@ -15,3 +17,2 @@ this.position = position;
         this.usingVars = [];
-        this.uuid = RandomUtils.uuid();
         this.run();
@@ -66,3 +67,3 @@ }
                 if (matchStart.length === matchEnd.length) {
-                    var scope = new Scope(sub.substring(this.config.start.length, sub.length - this.config.end.length), this.obj, this.config, new ScopePosition(startIdx, endIdx));
+                    var scope = new Scope(sub.substring(this.config.start.length, sub.length - this.config.end.length), this.obj, RandomUtils.uuid(), this.config, new ScopePosition(startIdx, endIdx));
                     this.childs.push(scope);
@@ -69,0 +70,0 @@ break;

render/compile/ScopeObject.d.ts

 import { ScopeResultSet } from './ScopeResultSet';
+import { Module } from '../../module/Module';
 export declare class ScopeObject {
@@ -10,2 +11,3 @@ uuid: string;
     private scopeEval;
+    moduleWriteAndSetScope(module: Module, strip: boolean): void;
 }

render/compile/ScopeObject.js

 import { RandomUtils } from '../../util/random/RandomUtils';
 import { ScopeResultSet } from './ScopeResultSet';
+import { TargetNode, TargetNodeMode } from './RootScope';
 var ScopeObject = (function () {
@@ -21,4 +22,16 @@ function ScopeObject(uuid) {
     ScopeObject.prototype.scopeEval = function (scope, script) {
-        return Function("\"use strict\";\n        const write = (str) => {\n            this.writes += str;\n        }\n        const module = (module) => {\n            if (module) {\n                const scope = module.setScope(false);\n                // console.log('scope Eval', module, scope);\n                this.writes += (module?.getTemplateWrapScopeString(scope) ?? '');\n            }\n        }\n        " + script + "\n        ").bind(scope)();
+        return Function("\"use strict\";\n        const write = (str) => {\n            this.writes += str;\n        }\n        const module = (module) => {\n            this.moduleWriteAndSetScope(module, false);\n        }\n        const stripModule = (module) => {\n            this.moduleWriteAndSetScope(module, true);\n        }\n        " + script + "\n        ").bind(scope)();
     };
+    ScopeObject.prototype.moduleWriteAndSetScope = function (module, strip) {
+        var _a;
+        if (module) {
+            var uuid = RandomUtils.uuid();
+            var targetSelecotr = module.getTemplateWrapScopeSelector(uuid);
+            var targetNode = new TargetNode(targetSelecotr, TargetNodeMode.replace);
+            var scope = module.setScope(targetNode, strip === true, uuid);
+            if (scope) {
+                this.writes += ((_a = module.getWrapScopeString(scope.uuid)) !== null && _a !== void 0 ? _a : '');
+            }
+        }
+    };
     return ScopeObject;
@@ -25,0 +38,0 @@ }());

render/compile/SimCompiler.d.ts

@@ -1,6 +0,7 @@
-import { Scope } from './Scope';
 import { Runnable } from '../../run/Runnable';
+import { RootScope } from './RootScope';
 export declare class SimCompiler implements Runnable {
     raws: string;
     private obj;
+    private rootUUID;
     config: {
@@ -10,4 +11,4 @@ start: string;
     };
-    root: Scope | undefined;
-    constructor(raws: string, obj: any, config?: {
+    root: RootScope | undefined;
+    constructor(raws: string, obj: any, rootUUID?: string, config?: {
         start: string;
@@ -14,0 +15,0 @@ end: string;

render/compile/SimCompiler.js

@@ -1,12 +0,15 @@
-import { Scope } from './Scope';
 import { ScopePosition } from './ScopePosition';
+import { RandomUtils } from '../../util/random/RandomUtils';
+import { RootScope } from './RootScope';
 var SimCompiler = (function () {
-    function SimCompiler(raws, obj, config) {
+    function SimCompiler(raws, obj, rootUUID, config) {
+        if (rootUUID === void 0) { rootUUID = RandomUtils.uuid(); }
         if (config === void 0) { config = { start: '<!--%', end: '%-->' }; }
         this.raws = raws;
         this.obj = obj;
+        this.rootUUID = rootUUID;
         this.config = config;
     }
     SimCompiler.prototype.run = function () {
-        this.root = new Scope(this.raws, this.obj, this.config, new ScopePosition(0, this.raws.length));
+        this.root = new RootScope(this.raws, this.obj, this.rootUUID, this.config, new ScopePosition(0, this.raws.length));
         return this;
@@ -13,0 +16,0 @@ };

render/Renderer.d.ts

 import { Module } from '../module/Module';
 import { SimOption } from '../option/SimOption';
-import { SimCompiler } from './compile/SimCompiler';
 import { Scope } from './compile/Scope';
 import { ScopeResultSet } from './compile/ScopeResultSet';
+import { RootScope } from './compile/RootScope';
 export declare class Renderer {
     private option;
     constructor(option: SimOption);
-    compileScope(template: string, obj: any, compiler?: SimCompiler): Scope | undefined;
+    compileScope(template: string, obj: any, rootUUID?: string): RootScope | undefined;
     render(module: Module | string): void;
     renderToScope(scope: Scope, module: Module, varName: string): boolean;
-    renderToByScopes(selector: string, ...scopes: Scope[]): void;
+    renderToByScopes(scope: RootScope): void;
     renderToByScopeResultSet(scopeResultSet: ScopeResultSet, selector: string): void;
@@ -14,0 +14,0 @@ renderTo(selector: string, module?: Module | string): void;

render/Renderer.js

@@ -15,2 +15,5 @@ var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
 import { DomUtils } from '../util/dom/DomUtils';
+import { RandomUtils } from '../util/random/RandomUtils';
+import { NodeUtils } from '../util/node/NodeUtils';
+import { TargetNodeMode } from './compile/RootScope';
 var Renderer = (function () {
@@ -20,4 +23,5 @@ function Renderer(option) {
     }
-    Renderer.prototype.compileScope = function (template, obj, compiler) {
-        if (compiler === void 0) { compiler = new SimCompiler(template, obj); }
+    Renderer.prototype.compileScope = function (template, obj, rootUUID) {
+        if (rootUUID === void 0) { rootUUID = RandomUtils.uuid(); }
+        var compiler = new SimCompiler(template, obj, rootUUID);
         return compiler.run().root;
@@ -51,15 +55,10 @@ };
     };
-    Renderer.prototype.renderToByScopes = function (selector) {
-        var scopes = [];
-        for (var _i = 1; _i < arguments.length; _i++) {
-            scopes[_i - 1] = arguments[_i];
+    Renderer.prototype.renderToByScopes = function (scope) {
+        if (TargetNodeMode.child === scope.targetNode.mode) {
+            NodeUtils.removeAllChildNode(scope.targetNode.node);
+            scope.targetNode.node.appendChild(scope.executeFragment());
         }
-        scopes.forEach(function (scope) {
-            var _a;
-            var targetElement = (_a = document.querySelector(selector + ("[scope='" + scope.uuid + "']"))) !== null && _a !== void 0 ? _a : document.querySelector(selector);
-            if (targetElement) {
-                targetElement.innerHTML = '';
-                targetElement.appendChild(scope.executeFragment());
-            }
-        });
+        else if (TargetNodeMode.replace === scope.targetNode.mode) {
+            NodeUtils.replaceNode(scope.targetNode.node, scope.executeFragment());
+        }
     };
@@ -66,0 +65,0 @@ Renderer.prototype.renderToByScopeResultSet = function (scopeResultSet, selector) {

router/RouterManager.d.ts

@@ -14,4 +14,4 @@ import 'reflect-metadata';
     procAttr(attrName: string, f: (h: HTMLElement, value: string | null) => void): void;
-    renderRouterModule(module: Module | undefined, targetSelector?: string | undefined): boolean;
-    render(module: Module | undefined, targetSelector: string | undefined): boolean;
+    renderRouterModule(module: Module | undefined, targetSelector: Node | null): boolean;
+    render(module: Module | undefined, targetSelector: Node | null): boolean;
 }

router/RouterManager.js

@@ -6,2 +6,3 @@ import 'reflect-metadata';
 import { RouterModule } from './RouterModule';
+import { TargetNode, TargetNodeMode } from "../render/compile/RootScope";
 var RouterManager = (function () {
@@ -33,3 +34,3 @@ function RouterManager() {
                         var _a, _b;
-                        _this.renderRouterModule(it.moduleObject, lastRouterSelector_1);
+                        _this.renderRouterModule(it.moduleObject, document.querySelector(lastRouterSelector_1));
                         var selctor = ((_a = it === null || it === void 0 ? void 0 : it.moduleObject) === null || _a === void 0 ? void 0 : _a.router_outlet_selector) || ((_b = it === null || it === void 0 ? void 0 : it.moduleObject) === null || _b === void 0 ? void 0 : _b.selector);
@@ -43,3 +44,3 @@ if (selctor) {
                     }
-                    _this.render(targetModule, lastRouterSelector_1);
+                    _this.render(targetModule, document.querySelector(lastRouterSelector_1));
                     _this.renderd();
@@ -79,7 +80,4 @@ targetModule._onInitedChild();
     RouterManager.prototype.renderRouterModule = function (module, targetSelector) {
-        var _a;
-        if (targetSelector === void 0) { targetSelector = (_a = this.option) === null || _a === void 0 ? void 0 : _a.selector; }
         if (module && !module.exist()) {
-            module._onInit();
-            module.renderWrap(targetSelector);
+            this.render(module, targetSelector);
             return true;
@@ -94,3 +92,4 @@ }
             module._onInit();
-            module.renderWrap(targetSelector);
+            module.setScope(new TargetNode(targetSelector, TargetNodeMode.child));
+            module.renderWrap();
             return true;
@@ -97,0 +96,0 @@ }

util/node/NodeUtils.d.ts

@@ -6,2 +6,4 @@ export declare type Attr = {
 export declare class NodeUtils {
+    static removeAllChildNode(node: Node): void;
+    static replaceNode(targetNode: Node, newNode: Node): void;
 }

util/node/NodeUtils.js

 var NodeUtils = (function () {
     function NodeUtils() {
     }
+    NodeUtils.removeAllChildNode = function (node) {
+        while (node === null || node === void 0 ? void 0 : node.firstChild) {
+            node.firstChild.remove();
+        }
+    };
+    NodeUtils.replaceNode = function (targetNode, newNode) {
+        var _a;
+        (_a = targetNode.parentNode) === null || _a === void 0 ? void 0 : _a.replaceChild(newNode, targetNode);
+    };
     return NodeUtils;
@@ -5,0 +14,0 @@ }());

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Uses eval

Supply chain risk

Package uses dynamic code execution (e.g., eval()), which is a dangerous practice. This can prevent the code from running in certain environments and increases the risk that the code may contain exploits or malicious behavior.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

192548

increased by3.71%

Number of package files

152

increased by2.01%

Lines of code

2718

increased by3.82%

Number of lines in readme file

319

increased by2.9%

No dependency changes