@stratusjs/angular 0.8.0 → 0.8.1

package/dist/angular.bundle.js

@@ -123781,13 +123781,14 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.expandDelay = 1000;
                     this.dropData = null;
                     this.cdkDropListSortingDisabled = true;
-                    this.dropDebug = false;
                     this.treeControl = new NestedTreeControl((node) => node.children || []);
+                    this.isBorder = false;
+                    this.isDebug = false;
                 }
                 ngOnInit() {
                     this.uid = _.uniqueId(`sa_${_.snakeCase(moduleName$3)}_component_`);
                     Stratus.Instances[this.uid] = this;
-                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "isInitialized", "isDestroyed", "isStyled", "target", "targetSuffix", "id", "manifest", "decouple", "direct", "api", "urlRoot", "type", "property", "_", "Stratus", "registry", "fetched", "data", "collection", "model", "dataSub", "onChange", "subscriber", "unsettled", "svgIcons", "isSingleClick", "dblClickWait", "dropLists", "dropListIdMap", "dropListMap", "expandedNodeSet", "dragging", "expandTimeout", "expandDelay", "dropData", "cdkDropListSortingDisabled", "dropDebug", "tree", "treeMap", "metaMap", "dataSource", "treeControl", "iconRegistry", "sanitizer", "backend", "ref", "elementRef", "document", "ngOnInit", "ngOnDestroy", "refresh", "remove", "removeNode", "nodeIsEqual", "fetchData", "dataDefer", "dataRef", "trackDropLists", "setExpanded", "setExpandedClick", "setExpandedDblClick", "onDragDrop", "onDragMove", "showDragData", "clearDragData", "buildNodePatch", "getSvg", "addSvgIcon", "hydrate", "disableRefresh", "stagger", "reloading"]);
+                    this.hydrate(this.elementRef, this.sanitizer, ["title", "uid", "isInitialized", "isDestroyed", "isStyled", "target", "targetSuffix", "id", "manifest", "decouple", "direct", "api", "urlRoot", "type", "property", "_", "Stratus", "registry", "fetched", "data", "collection", "model", "dataSub", "onChange", "subscriber", "unsettled", "svgIcons", "isSingleClick", "dblClickWait", "dropLists", "dropListIdMap", "dropListMap", "expandedNodeSet", "dragging", "expandTimeout", "expandDelay", "dropData", "cdkDropListSortingDisabled", "tree", "treeMap", "metaMap", "dataSource", "treeControl", "isBorder", "isDebug", "iconRegistry", "sanitizer", "backend", "ref", "elementRef", "document", "ngOnInit", "ngOnDestroy", "refresh", "remove", "removeNode", "nodeIsEqual", "fetchData", "dataDefer", "dataRef", "trackDropLists", "setExpanded", "setExpandedClick", "setExpandedDblClick", "onDragDrop", "onDragMove", "showDragData", "clearDragData", "buildNodePatch", "getSvg", "addSvgIcon", "hydrate", "disableRefresh", "stagger", "reloading"]);
                     Stratus.Internals.CssLoader(`${localDir$7}/${moduleName$3}/${moduleName$3}.component${min$6}.css`)
                         .then(() => {
                         this.isStyled = true;
@@ -123849,6 +123850,14 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.dataSub = new Observable((subscriber) => this.dataDefer(subscriber));
                     this.dropListIdMap[`${this.uid}_parent_drop_list`] = true;
                     this.trackDropLists();
+                    const isBorder = cookie('tree-node-border');
+                    if (isBorder && isJSON(isBorder)) {
+                        this.isBorder = JSON.parse(isBorder);
+                    }
+                    const isDebug = cookie('tree-debug');
+                    if (isDebug && isJSON(isDebug)) {
+                        this.isDebug = JSON.parse(isDebug);
+                    }
                     this.isInitialized = true;
                     this.refresh();
                 }
@@ -124000,115 +124009,118 @@ System.register(['@stratusjs/runtime/stratus', 'lodash', '@stratusjs/core/enviro
                     this.setExpanded(expanded);
                 }
                 onDragDrop(event) {
-                    if (!event.isPointerOverContainer) {
-                        return;
-                    }
-                    const targetNode = event.item.data;
-                    if (!targetNode) {
-                        return;
-                    }
-                    let parentNode = event.container.data;
-                    const pastParentNode = event.previousContainer.data;
-                    const tree = parentNode ? parentNode.children : this.dataRef();
-                    if (!tree) {
-                        return;
-                    }
-                    this.unsettled = true;
-                    const targetDropNode = (this.dropData.targetId && this.dropData.targetId in this.treeMap) ?
-                        this.treeMap[_.toNumber(this.dropData.targetId)] : null;
-                    if (cookie('env') && this.dropDebug) {
-                        console.group('onDragDrop()');
-                        _.forEach([
-                            `model drop: ${targetNode.model.get('name')}`,
-                            `list shift: ${event.container.element.nativeElement.id} -> ${event.previousContainer.element.nativeElement.id}`,
-                            `index change (event): ${event.previousIndex} -> ${event.currentIndex}`,
-                            `current priority: ${targetNode.model.get('priority')}`,
-                            `target drop action: ${this.dropData.action}`,
-                        ], (message) => console.log(message));
-                    }
-                    if (targetDropNode && !this.nodeIsEqual(parentNode, targetDropNode)) {
-                        if (cookie('env') && this.dropDebug) {
-                            console.log(`target drop node differs: ${targetDropNode.id} -> ${targetDropNode.model.get('name')}`);
-                            console.log('target drop node is the same as target node:', targetNode.id === targetDropNode.id);
-                        }
-                        if (targetNode.id !== targetDropNode.id) {
-                            switch (this.dropData.action) {
-                                case 'before':
-                                case 'after':
-                                    const nestParentId = targetDropNode.model.get('nestParent.id');
-                                    const nestParent = (nestParentId && nestParentId in this.treeMap) ? this.treeMap[nestParentId] : null;
-                                    parentNode = nestParent;
-                                    break;
-                                case 'inside':
-                                    parentNode = targetDropNode;
-                                    break;
+                    return __awaiter$8(this, void 0, void 0, function* () {
+                        if (!event.isPointerOverContainer) {
+                            return;
+                        }
+                        const targetNode = event.item.data;
+                        if (!targetNode) {
+                            return;
+                        }
+                        let parentNode = event.container.data;
+                        const pastParentNode = event.previousContainer.data;
+                        const tree = parentNode ? parentNode.children : this.dataRef();
+                        if (!tree) {
+                            return;
+                        }
+                        this.unsettled = true;
+                        const targetDropNode = (this.dropData.targetId && this.dropData.targetId in this.treeMap) ?
+                            this.treeMap[_.toNumber(this.dropData.targetId)] : null;
+                        if (cookie('env') && this.isDebug) {
+                            console.group('onDragDrop()');
+                            _.forEach([
+                                `model drop: ${targetNode.model.get('name')}`,
+                                `list shift: ${event.container.element.nativeElement.id} -> ${event.previousContainer.element.nativeElement.id}`,
+                                `index change (event): ${event.previousIndex} -> ${event.currentIndex}`,
+                                `current priority: ${targetNode.model.get('priority')}`,
+                                `target drop action: ${this.dropData.action}`,
+                            ], (message) => console.log(message));
+                        }
+                        if (targetDropNode && !this.nodeIsEqual(parentNode, targetDropNode)) {
+                            if (cookie('env') && this.isDebug) {
+                                console.log(`target drop node differs: ${targetDropNode.id} -> ${targetDropNode.model.get('name')}`);
+                                console.log('target drop node is the same as target node:', targetNode.id === targetDropNode.id);
+                            }
+                            if (targetNode.id !== targetDropNode.id) {
+                                switch (this.dropData.action) {
+                                    case 'before':
+                                    case 'after':
+                                        const nestParentId = targetDropNode.model.get('nestParent.id');
+                                        const nestParent = (nestParentId && nestParentId in this.treeMap) ? this.treeMap[nestParentId] : null;
+                                        parentNode = nestParent;
+                                        break;
+                                    case 'inside':
+                                        parentNode = targetDropNode;
+                                        break;
+                                }
+                            }
+                            if (cookie('env') && this.isDebug) {
+                                console.log('target drop node selected:', parentNode ? `${parentNode.id} -> ${parentNode.model.get('name')}` : 'none');
                             }
                         }
-                        if (cookie('env') && this.dropDebug) {
-                            console.log('target drop node selected:', parentNode ? `${parentNode.id} -> ${parentNode.model.get('name')}` : 'none');
+                        if (!this.nodeIsEqual(parentNode, pastParentNode)) {
+                            if (parentNode) {
+                                switch (this.dropData.action) {
+                                    case 'before':
+                                    case 'after':
+                                        let targetIndex = parentNode.children.findIndex((n) => n.id === targetNode.id);
+                                        if (this.dropData.action === 'after') {
+                                            targetIndex++;
+                                        }
+                                        parentNode.children.splice(targetIndex, 0, targetNode);
+                                        break;
+                                    case 'inside':
+                                        parentNode.children.push(targetNode);
+                                        break;
+                                }
+                                parentNode.meta.expanded = true;
+                            }
+                            if (pastParentNode) {
+                                this.removeNode(pastParentNode.children, targetNode);
+                            }
+                            targetNode.model.set('nestParent', this.buildNodePatch(parentNode));
+                            if (cookie('env') && this.isDebug) {
+                                console.log(`new parent: ${targetNode.model.get('nestParent.name') || null}`);
+                            }
                         }
-                    }
-                    if (!this.nodeIsEqual(parentNode, pastParentNode)) {
-                        if (parentNode) {
+                        const branch = parentNode ? parentNode.children : tree;
+                        let targetDropIndex = event.currentIndex;
+                        if (this.cdkDropListSortingDisabled) {
+                            targetDropIndex = null;
                             switch (this.dropData.action) {
                                 case 'before':
                                 case 'after':
-                                    let targetIndex = parentNode.children.findIndex((n) => n.id === targetNode.id);
+                                    targetDropIndex = branch.findIndex((n) => n.id === targetDropNode.id);
                                     if (this.dropData.action === 'after') {
-                                        targetIndex++;
+                                        targetDropIndex++;
+                                    }
+                                    if (cookie('env') && this.isDebug) {
+                                        console.log('index change (drop node):', `${event.previousIndex} -> ${targetDropIndex}`);
                                     }
-                                    parentNode.children.splice(targetIndex, 0, targetNode);
-                                    break;
-                                case 'inside':
-                                    parentNode.children.push(targetNode);
                                     break;
                             }
-                            parentNode.meta.expanded = true;
-                        }
-                        if (pastParentNode) {
-                            this.removeNode(pastParentNode.children, targetNode);
-                        }
-                        targetNode.model.set('nestParent', this.buildNodePatch(parentNode));
-                        if (cookie('env') && this.dropDebug) {
-                            console.log(`new parent: ${targetNode.model.get('nestParent.name') || null}`);
                         }
-                    }
-                    const branch = parentNode ? parentNode.children : tree;
-                    let targetDropIndex = event.currentIndex;
-                    if (this.cdkDropListSortingDisabled) {
-                        targetDropIndex = null;
-                        switch (this.dropData.action) {
-                            case 'before':
-                            case 'after':
-                                targetDropIndex = branch.findIndex((n) => n.id === targetDropNode.id);
-                                if (this.dropData.action === 'after') {
-                                    targetDropIndex++;
-                                }
-                                if (cookie('env') && this.dropDebug) {
-                                    console.log('index change (drop node):', `${event.previousIndex} -> ${targetDropIndex}`);
+                        if (_.isNumber(targetDropIndex)) {
+                            moveItemInArray(branch, event.previousIndex, targetDropIndex);
+                            let priority = 0;
+                            _.forEach(branch, (node) => {
+                                if (!node.model || !node.model.set) {
+                                    return;
                                 }
-                                break;
-                        }
-                    }
-                    if (_.isNumber(targetDropIndex)) {
-                        moveItemInArray(branch, event.previousIndex, targetDropIndex);
-                        let priority = 0;
-                        _.forEach(branch, (node) => {
-                            if (!node.model || !node.model.set) {
-                                return;
+                                node.model.set('priority', priority++);
+                            });
+                            if (cookie('env') && this.isDebug) {
+                                console.log('new priority:', targetNode.model.get('priority'));
                             }
-                            node.model.set('priority', priority++);
-                        });
-                        if (cookie('env') && this.dropDebug) {
-                            console.log('new priority:', targetNode.model.get('priority'));
                         }
-                    }
-                    if (cookie('env') && this.dropDebug) {
-                        console.log(`new parent: ${targetNode.model.get('nestParent.name') || null}`);
-                        console.groupEnd();
-                    }
-                    targetNode.model.save();
-                    this.unsettled = false;
+                        if (cookie('env') && this.isDebug) {
+                            console.groupEnd();
+                        }
+                        yield targetNode.model.save();
+                        this.unsettled = false;
+                        this.subscriber.next(this.dataRef());
+                        this.ref.detectChanges();
+                    });
                 }
                 onDragMove(event) {
                     const e = this.document.elementFromPoint(event.pointerPosition.x, event.pointerPosition.y);