From 6532bd7dc1c1e18cdb69ba2661e4f0fc637a6d6e Mon Sep 17 00:00:00 2001 From: garrettmills Date: Mon, 12 Oct 2020 12:24:08 -0500 Subject: [PATCH] Update tree listing component to latest version --- package-lock.json | 44 ++++++++++++++++++++++++++-------------- package.json | 2 +- src/app/app.component.ts | 8 +++++--- src/app/app.module.ts | 4 ++-- src/global.scss | 2 +- 5 files changed, 38 insertions(+), 22 deletions(-) diff --git a/package-lock.json b/package-lock.json index b10a27d..ef4d533 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1825,6 +1825,28 @@ "to-fast-properties": "^2.0.0" } }, + "@circlon/angular-tree-component": { + "version": "10.0.0", + "resolved": "https://registry.npmjs.org/@circlon/angular-tree-component/-/angular-tree-component-10.0.0.tgz", + "integrity": "sha512-3dRWLbOdMfIuvZjX6AMHmvzPtqhNFECMWMpNVXrZfZtTAa0n+Y4lxbuLST85q5QiedBZuC720p/7kkZ78PJ+iw==", + "requires": { + "lodash-es": "^4.17.15", + "mobx": "~4.14.1", + "tslib": "^2.0.0" + }, + "dependencies": { + "mobx": { + "version": "4.14.1", + "resolved": "https://registry.npmjs.org/mobx/-/mobx-4.14.1.tgz", + "integrity": "sha512-Oyg7Sr7r78b+QPYLufJyUmxTWcqeQ96S1nmtyur3QL8SeI6e0TqcKKcxbG+sVJLWANhHQkBW/mDmgG5DDC4fdw==" + }, + "tslib": { + "version": "2.0.3", + "resolved": "https://registry.npmjs.org/tslib/-/tslib-2.0.3.tgz", + "integrity": "sha512-uZtkfKblCEQtZKBF6EBXVZeQNl82yqtDQdv+eck8u7tdPxjLu2/lp5/uPW+um2tpuxINHWy3GhiccY7QgEaVHQ==" + } + } + }, "@ionic-native/core": { "version": "5.28.0", "resolved": "https://registry.npmjs.org/@ionic-native/core/-/core-5.28.0.tgz", @@ -2485,15 +2507,6 @@ "integrity": "sha1-l6ERlkmyEa0zaR2fn0hqjsn74KM=", "dev": true }, - "angular-tree-component": { - "version": "8.5.6", - "resolved": "https://registry.npmjs.org/angular-tree-component/-/angular-tree-component-8.5.6.tgz", - "integrity": "sha512-cxNem6872diZz9kIGqrjSJbKt0P3WSq9wTqZIeVJ8zsddI4Y6ShAVZlZNXUMRyJq246c9pJ6JJEAOzKVLk9xgA==", - "requires": { - "lodash": "^4.17.11", - "mobx": "^4.15.1" - } - }, "ansi-colors": { "version": "3.2.4", "resolved": "https://registry.npmjs.org/ansi-colors/-/ansi-colors-3.2.4.tgz", @@ -7943,7 +7956,13 @@ "lodash": { "version": "4.17.20", "resolved": "https://registry.npmjs.org/lodash/-/lodash-4.17.20.tgz", - "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==" + "integrity": "sha512-PlhdFcillOINfeV7Ni6oF1TAEayyZBoZ8bcshTHqOYJYlrqzRK5hagpagky5o4HfCzzd1TRkXPMFq6cKk9rGmA==", + "dev": true + }, + "lodash-es": { + "version": "4.17.15", + "resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.15.tgz", + "integrity": "sha512-rlrc3yU3+JNOpZ9zj5pQtxnx2THmvRykwL4Xlxoa8I9lHBlVbbyPhgyPMioxVZ4NqyxaVVtaJnzsyOidQIhyyQ==" }, "lodash.clonedeep": { "version": "4.5.0", @@ -8522,11 +8541,6 @@ "minimist": "^1.2.5" } }, - "mobx": { - "version": "4.15.7", - "resolved": "https://registry.npmjs.org/mobx/-/mobx-4.15.7.tgz", - "integrity": "sha512-X4uQvuf2zYKHVO5kRT5Utmr+J9fDnRgxWWnSqJ4oiccPTQU38YG+/O3nPmOhUy4jeHexl7XJJpWDBgEnEfp+8w==" - }, "moment": { "version": "2.29.1", "resolved": "https://registry.npmjs.org/moment/-/moment-2.29.1.tgz", diff --git a/package.json b/package.json index 9cd08f6..f15acce 100644 --- a/package.json +++ b/package.json @@ -19,13 +19,13 @@ "@angular/platform-browser": "~10.1.5", "@angular/platform-browser-dynamic": "~10.1.5", "@angular/router": "~10.1.5", + "@circlon/angular-tree-component": "^10.0.0", "@ionic-native/core": "^5.0.0", "@ionic-native/splash-screen": "^5.0.0", "@ionic-native/status-bar": "^5.0.0", "@ionic/angular": "^5.3.5", "ag-grid-angular": "^22.1.1", "ag-grid-community": "^22.1.1", - "angular-tree-component": "^8.5.2", "core-js": "^2.5.4", "moment": "^2.24.0", "ngx-monaco-editor": "^8.1.1", diff --git a/src/app/app.component.ts b/src/app/app.component.ts index 4c2798f..118185c 100644 --- a/src/app/app.component.ts +++ b/src/app/app.component.ts @@ -5,7 +5,7 @@ import { SplashScreen } from '@ionic-native/splash-screen/ngx'; import { StatusBar } from '@ionic-native/status-bar/ngx'; import { ApiService } from './service/api.service'; import { Router } from '@angular/router'; -import {TREE_ACTIONS, TreeComponent} from 'angular-tree-component'; +import {TREE_ACTIONS, TreeComponent} from '@circlon/angular-tree-component'; import { Observable } from 'rxjs'; import {OptionPickerComponent} from './components/option-picker/option-picker.component'; import {OptionMenuComponent} from './components/option-menu/option-menu.component'; @@ -93,8 +93,10 @@ export class AppComponent implements OnInit { } onFilterChange($event) { - const value = $event.detail.value; - this.menuTree.treeModel.filterNodes(value, true); + const value = $event.detail.value.toLowerCase(); + this.menuTree.treeModel.filterNodes(node => { + return node.data.name.toLowerCase().includes(value); + }); } async onNodeMenuClick($event) { diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 16dd4f5..0cb284f 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -10,7 +10,7 @@ import { AppComponent } from './app.component'; import { AppRoutingModule } from './app-routing.module'; import { HttpClientModule } from '@angular/common/http'; import { ComponentsModule } from './components/components.module'; -import { TreeModule } from 'angular-tree-component'; +import { TreeModule } from '@circlon/angular-tree-component'; import {AgGridModule} from 'ag-grid-angular'; import {MonacoEditorModule} from 'ngx-monaco-editor'; import { APP_BASE_HREF, PlatformLocation } from '@angular/common'; @@ -39,7 +39,7 @@ export function getBaseHref(platformLocation: PlatformLocation): string { AppRoutingModule, HttpClientModule, ComponentsModule, - TreeModule.forRoot(), + TreeModule, AgGridModule.withComponents([]), MonacoEditorModule.forRoot(), ], diff --git a/src/global.scss b/src/global.scss index 1002d62..d3222e1 100644 --- a/src/global.scss +++ b/src/global.scss @@ -25,7 +25,7 @@ @import "~@ionic/angular/css/text-transformation.css"; @import "~@ionic/angular/css/flex-utils.css"; -@import "~angular-tree-component/dist/angular-tree-component.css"; +@import '~@circlon/angular-tree-component/css/angular-tree-component.css'; @import "~ag-grid-community/dist/styles/ag-grid.css"; @import "~ag-grid-community/dist/styles/ag-theme-balham.css";