{"_id":"o-ngx-tree","_rev":"4-dfa79042328f70444ded8a50f581a6aa","name":"o-ngx-tree","dist-tags":{"latest":"8.0.1"},"versions":{"4.0.0":{"name":"o-ngx-tree","version":"4.0.0","description":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree","main":"index.js","license":"MIT","author":{"name":"Imatia S.L."},"homepage":"https://github.com/OntimizeWeb/o-ngx-tree","repository":{"type":"git","url":"git+https://github.com/OntimizeWeb/o-ngx-tree.git"},"bugs":{"url":"https://github.com/OntimizeWeb/o-ngx-tree/issues"},"keywords":["tree","ng2","angular","ng2-tree","o-ngx-tree","branch","tree-view","branchy","angular2-tree-view","expand","collapse","recursive"],"scripts":{"pre:publish":"npm run clean && npm run test && npm run lint && npm run compile && mkdir -p dist && cp -R src/styles.css README.md media dist","post:publish":"npm run build:demo && gh-pages -d dist-demo","start":"ng serve --prod","build:demo":"ng build","test":"ng test --watch false","test:w":"ng test --watch","test:cov":"ng test --watch false --code-coverage","lint":"ng lint o-ngx-tree --type-check","e2e":"ng e2e","changelog":"conventional-changelog -i CHANGELOG.md -s -p angular","github-release":"conventional-github-releaser -p angular","version":"npm run changelog && git add CHANGELOG.md","postversion":"git push origin master && git push --tags && npm run github-release && node publish.js","webdriver-update":"node ./node_modules/protractor/bin/webdriver-manager update","precommit":"pretty-quick --staged","prettier":"prettier --write '{.,src,test}/**/*.ts'","clean":"rimraf coverage build dist dist-demo bundles factories .publish","compile":"ngc -p tsconfig-aot.json && node umd-bundler.js","copy":"copyfiles -f src/styles.css README.md package.json dist && copyfiles media/** dist","build":"npm run clean && npm run compile && npm run copy"},"husky":{"hooks":{"pre-commit":"npm run lint && pretty-quick --staged"}},"devDependencies":{"@angular-devkit/build-angular":"~0.6.6","@angular/cli":"6.0.3","@angular/common":"6.0.3","@angular/compiler":"6.0.3","@angular/compiler-cli":"6.0.3","@angular/core":"6.0.3","@angular/forms":"6.0.3","@angular/http":"6.0.3","@angular/language-service":"6.0.3","@angular/platform-browser":"6.0.3","@angular/platform-browser-dynamic":"6.0.3","@angular/router":"6.0.3","@types/jasmine":"2.8.2","@types/node":"8.0.53","alertifyjs":"1.10.0","codelyzer":"4.0.1","conventional-changelog":"1.1.7","conventional-changelog-cli":"1.3.5","conventional-github-releaser":"2.0.0","copyfiles":"1.2.0","core-js":"2.5.1","font-awesome":"4.7.0","gh-pages":"1.1.0","husky":"0.14.3","jasmine-core":"2.8.0","jasmine-data-provider":"2.2.0","jasmine-spec-reporter":"4.2.1","karma":"1.7.1","karma-chrome-launcher":"2.2.0","karma-cli":"1.0.1","karma-coverage-istanbul-reporter":"1.3.0","karma-jasmine":"1.1.0","karma-jasmine-html-reporter":"0.2.2","karma-phantomjs-launcher":"1.0.4","phantomjs-polyfill":"0.0.2","phantomjs-prebuilt":"2.1.16","prettier":"1.10.2","pretty-quick":"1.4.1","protractor":"5.2.0","rimraf":"2.6.2","rxjs":"6.2.0","rxjs-compat":"^6.2.0","rxjs-tslint":"^0.1.4","shelljs":"0.7.8","systemjs-builder":"0.16.12","ts-node":"3.3.0","tslint":"5.8.0","tslint-config-valorsoft":"2.1.1","typescript":">=2.7.2 <2.8","uuid":"3.1.0","webpack":"^4.10.2","zone.js":"0.8.26"},"_id":"o-ngx-tree@4.0.0","_npmVersion":"6.4.1","_nodeVersion":"10.12.0","_npmUser":{"name":"ontimize-web","email":"ontimize-web@imatia.com"},"dist":{"integrity":"sha512-+TZyzDzwmglDRW0yLoJpWn3BcMSAGHR6mpuXqYMrIxXNuO7dpZylROGu6QAwNGqy1kvTt9U8YKGDHzAz7V9zjg==","shasum":"77b37656f4dfa3c3b8346d144d732255936e72ac","tarball":"https://registry.npmjs.org/o-ngx-tree/-/o-ngx-tree-4.0.0.tgz","fileCount":131,"unpackedSize":672075,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcr1DNCRA9TVsSAnZWagAAgboQAI5sqdEJVkrAu0Cy8E05\n7/aNmUybv34qZgTQ1toWjaql8DLLBy3hpZ2ZRL+q1yhNheCzGTHCNvVulZqC\n5Lnvcktk4HXRt+FDUL64vOn6iKLWG7KUIKBvJZrC9eSiY6En+k04odR/J9aO\n4vxlAZ1a8dWDHc7lmhZJkj3oBU51WHzYfrpBny2CCFt7FgHR8awjcCupGOSw\n9MybalpWLKp20OUwc9RUqxj8LtUrkYaqjjG9NHqJWJOrycoV4f1BdI4I2YTN\nJcKQigE0lVr7il+j0z+DfdhLpPdjgDbHHDLG9+pxmy/AX525tBUS5iAZ2jm/\nEkslylYBXzf2JJPgG6jt8tC2X4rW20KZN3ni1nBrwB+IzKjt+SH3YUdQ1y/v\nd2u87bX4iuoOnqZC8fC35r/tetiuFwNu7wi5xj4ZtE6qqG+8rKFUuFq3qSep\nNV+xzoKOrQgL+ju5aHlLk4B2QEdMgcIZ9jIshOyNU//z1nkSB6p7y+9JM9hE\nv5aww9rJHI5DDt30e5vVmot6FrfBdIHL8699jDlku1sPTshYGVOes3YJGyc8\nAXKlHXluOWnu6EVbD6H1TAJV3W0mnN9w4d5GFsik3pWgSYcv0pAQ6PMjwwbc\nTpP2FvTKVuESJk6VO4Tv0LI+TVw6Sjz6Jmtopu5Z5wgsSmIgJrWvYw9O3Fkq\nrwjO\r\n=Eqws\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDU5KL9+IPbhAycuhnoccwZu2gfmgSpNEDxrfSoZId51AIhAI1foOOkdXh7Lhd3vibgrntjAtLmV5KYHhvDZPyapfFr"}]},"maintainers":[{"name":"ontimize-web","email":"ontimize-web@imatia.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/o-ngx-tree_4.0.0_1554993356264_0.5991482955931409"},"_hasShrinkwrap":false},"8.0.0-rc.0":{"name":"o-ngx-tree","version":"8.0.0-rc.0","description":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree","main":"index.js","license":"MIT","author":{"name":"Imatia S.L."},"homepage":"https://github.com/OntimizeWeb/o-ngx-tree","repository":{"type":"git","url":"git+https://github.com/OntimizeWeb/o-ngx-tree.git"},"bugs":{"url":"https://github.com/OntimizeWeb/o-ngx-tree/issues"},"keywords":["tree","ng2","angular","ng2-tree","o-ngx-tree","branch","tree-view","branchy","angular2-tree-view","expand","collapse","recursive"],"scripts":{"pre:publish":"npm run clean && npm run test && npm run lint && npm run compile && mkdir -p dist && cp -R src/styles.css README.md media dist","post:publish":"npm run build:demo && gh-pages -d dist-demo","start":"ng serve --prod","build:demo":"ng build","test":"ng test --watch false","test:w":"ng test --watch","test:cov":"ng test --watch false --code-coverage","lint":"ng lint o-ngx-tree --type-check","e2e":"ng e2e","changelog":"conventional-changelog -i CHANGELOG.md -s -p angular","github-release":"conventional-github-releaser -p angular","version":"npm run changelog && git add CHANGELOG.md","postversion":"git push origin master && git push --tags && npm run github-release && node publish.js","webdriver-update":"node ./node_modules/protractor/bin/webdriver-manager update","precommit":"pretty-quick --staged","prettier":"prettier --write '{.,src,test}/**/*.ts'","clean":"rimraf coverage build dist dist-demo bundles factories .publish","compile":"ngc -p tsconfig-aot.json && node umd-bundler.js","copy":"copyfiles -f src/styles.css README.md package.json dist && copyfiles media/** dist","build":"npm run clean && npm run compile && npm run copy"},"husky":{"hooks":{"pre-commit":"npm run lint && pretty-quick --staged"}},"devDependencies":{"@angular-devkit/build-angular":"~0.803.22","@angular/cli":"~8.3.21","@angular/common":"~8.2.14","@angular/compiler":"~8.2.14","@angular/compiler-cli":"~8.2.14","@angular/core":"~8.2.14","@angular/forms":"~8.2.14","@angular/language-service":"~8.2.14","@angular/platform-browser":"~8.2.14","@angular/platform-browser-dynamic":"~8.2.14","@angular/router":"~8.2.14","@types/jasmine":"2.8.2","@types/node":"~8.9.4","alertifyjs":"1.10.0","codelyzer":"5.2.1","conventional-changelog":"1.1.7","conventional-changelog-cli":"1.3.5","conventional-github-releaser":"2.0.0","copyfiles":"1.2.0","core-js":"^3.6.4","font-awesome":"4.7.0","gh-pages":"1.1.0","husky":"0.14.3","jasmine-core":"2.8.0","jasmine-data-provider":"2.2.0","jasmine-spec-reporter":"4.2.1","karma":"1.7.1","karma-chrome-launcher":"2.2.0","karma-cli":"1.0.1","karma-coverage-istanbul-reporter":"1.3.0","karma-jasmine":"1.1.0","karma-jasmine-html-reporter":"0.2.2","karma-phantomjs-launcher":"1.0.4","phantomjs-polyfill":"0.0.2","phantomjs-prebuilt":"2.1.16","prettier":"1.10.2","pretty-quick":"1.4.1","protractor":"5.2.0","rimraf":"2.6.2","rxjs":"~6.4.0","rxjs-compat":"^6.2.0","rxjs-tslint":"^0.1.4","shelljs":"0.7.8","systemjs-builder":"0.16.12","ts-node":"3.3.0","tslint":"5.8.0","tslint-config-valorsoft":"2.1.1","typescript":"~3.5.3","uuid":"3.1.0","webpack":"^4.10.2","zone.js":"0.9.1"},"_id":"o-ngx-tree@8.0.0-rc.0","_nodeVersion":"10.16.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-yL7dis5LRNQnSu3MZ77nUjkp1X6d4TTH7IKfwWDDUre1dGyPBeolBLK5B7vq5aqQw4VXO7l86w+sIbqmZ3Hx1w==","shasum":"edf3f7bc68cc58c3d21ff2a67e5acac84722ef1a","tarball":"https://registry.npmjs.org/o-ngx-tree/-/o-ngx-tree-8.0.0-rc.0.tgz","fileCount":131,"unpackedSize":673519,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJe/YDYCRA9TVsSAnZWagAAkLoP/jJvA+b85uiFBJY5RB+Z\notvStrT+GOsxMMojPQHdL6LrU0VgvgLIpM9ThYJYwquE7CuyA8GBI8tqwcNa\nrPlU+uToQ6rngmlDfF95UbtJvu0WRIeh+f+PAXPAJCw+GOhVGyWYKR2yEq+a\nk8C9dfxoa/GM+prYX5upn0uEWMQu8Pnh/m9DCBro5itR/i+jjlFNXBaMg1jX\nUmgjFVsyqDbLKgIRq82U/xW6p1tL560bd2jL5xOgXPgIyXdnK0ly1JpBjnD7\n8k5ownA9Uq3vLZWRpMUqtnLriJfnEFDEdH7tnE3Le0T8L3ltUPPMMH+/371r\nxHBFB4L8I0fqrHyqAeovizElAl1dELIcGdQ6f8MkUJ3eTQn9LBh6G30EGfMf\nAzhZq9I7E01z3NBIflbRK0JkkE9rSY3Z7hsn1p+m/2MtKPsVOvNNgiWkSfws\nZPBu4NFTf1V/8mtNQit+5SmgBuW1wdrT+0d9gQhd0EF4wvpUmt0daXLm1zPA\nT+8De2xls1QqnoSXAiKgE4xqbHL13v8zMMgjGtwc7QSGqa6ggPKG/mgGbcxo\nJcbT2nMX5vh6cE2CaB/LBXT8rzMdHfkXS+TrvdnjOi8DVdoluWWGda99kn31\nic31cUwxbJ024K7Lwm4vcFZkEd9Q+n1KhoubnIxnX3N2PKMhjC457uLiJOJ1\n2Hug\r\n=NMuZ\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQCcVw7sWBK7IQyzQWxmA++f3DEcJu6fN/mYpx5VkgbhtwIgC69pygsgnRrfy5IvWyvEQPBZ+YXao3YCMUe6K7248As="}]},"maintainers":[{"name":"ontimize-web","email":"ontimize-web@imatia.com"}],"_npmUser":{"name":"ontimize-web","email":"ontimize-web@imatia.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/o-ngx-tree_8.0.0-rc.0_1593671896338_0.46095088333107626"},"_hasShrinkwrap":false},"8.0.0":{"name":"o-ngx-tree","version":"8.0.0","description":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree","main":"index.js","license":"MIT","author":{"name":"Imatia S.L."},"homepage":"https://github.com/OntimizeWeb/o-ngx-tree","repository":{"type":"git","url":"git+https://github.com/OntimizeWeb/o-ngx-tree.git"},"bugs":{"url":"https://github.com/OntimizeWeb/o-ngx-tree/issues"},"keywords":["tree","ng2","angular","ng2-tree","o-ngx-tree","branch","tree-view","branchy","angular2-tree-view","expand","collapse","recursive"],"scripts":{"pre:publish":"npm run clean && npm run test && npm run lint && npm run compile && mkdir -p dist && cp -R src/styles.css README.md media dist","post:publish":"npm run build:demo && gh-pages -d dist-demo","start":"ng serve --prod","build:demo":"ng build","test":"ng test --watch false","test:w":"ng test --watch","test:cov":"ng test --watch false --code-coverage","lint":"ng lint o-ngx-tree --type-check","e2e":"ng e2e","changelog":"conventional-changelog -i CHANGELOG.md -s -p angular","github-release":"conventional-github-releaser -p angular","version":"npm run changelog && git add CHANGELOG.md","postversion":"git push origin master && git push --tags && npm run github-release && node publish.js","webdriver-update":"node ./node_modules/protractor/bin/webdriver-manager update","precommit":"pretty-quick --staged","prettier":"prettier --write '{.,src,test}/**/*.ts'","clean":"rimraf coverage build dist dist-demo bundles factories .publish","compile":"ngc -p tsconfig-aot.json && node umd-bundler.js","copy":"copyfiles -f src/styles.css README.md package.json dist && copyfiles media/** dist","build":"npm run clean && npm run compile && npm run copy"},"husky":{"hooks":{"pre-commit":"npm run lint && pretty-quick --staged"}},"devDependencies":{"@angular-devkit/build-angular":"~0.803.22","@angular/cli":"~8.3.21","@angular/common":"~8.2.14","@angular/compiler":"~8.2.14","@angular/compiler-cli":"~8.2.14","@angular/core":"~8.2.14","@angular/forms":"~8.2.14","@angular/language-service":"~8.2.14","@angular/platform-browser":"~8.2.14","@angular/platform-browser-dynamic":"~8.2.14","@angular/router":"~8.2.14","@types/jasmine":"2.8.2","@types/node":"~8.9.4","alertifyjs":"1.10.0","codelyzer":"5.2.1","conventional-changelog":"1.1.7","conventional-changelog-cli":"1.3.5","conventional-github-releaser":"2.0.0","copyfiles":"1.2.0","core-js":"^3.6.4","font-awesome":"4.7.0","gh-pages":"1.1.0","husky":"0.14.3","jasmine-core":"2.8.0","jasmine-data-provider":"2.2.0","jasmine-spec-reporter":"4.2.1","karma":"1.7.1","karma-chrome-launcher":"2.2.0","karma-cli":"1.0.1","karma-coverage-istanbul-reporter":"1.3.0","karma-jasmine":"1.1.0","karma-jasmine-html-reporter":"0.2.2","karma-phantomjs-launcher":"1.0.4","phantomjs-polyfill":"0.0.2","phantomjs-prebuilt":"2.1.16","prettier":"1.10.2","pretty-quick":"1.4.1","protractor":"5.2.0","rimraf":"2.6.2","rxjs":"~6.4.0","rxjs-compat":"^6.2.0","rxjs-tslint":"^0.1.4","shelljs":"0.7.8","systemjs-builder":"0.16.12","ts-node":"3.3.0","tslint":"5.8.0","tslint-config-valorsoft":"2.1.1","typescript":"~3.5.3","uuid":"3.1.0","webpack":"^4.10.2","zone.js":"0.9.1"},"_id":"o-ngx-tree@8.0.0","_nodeVersion":"10.16.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-j9EroDMIi2C9reTLbQd4e/RUlOqBpU9RuZoSyw5NSha7HFGz9XfDW08z6yHofl3bT24eYOcDrSM4byJowGMXFQ==","shasum":"251050e15120d063d9b9397b5adcd8df095c4545","tarball":"https://registry.npmjs.org/o-ngx-tree/-/o-ngx-tree-8.0.0.tgz","fileCount":131,"unpackedSize":673514,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfUfOTCRA9TVsSAnZWagAA4YMP/iIQKsPzmyEk1QnTEl9t\nlZj6DQuRK47rEZTb7GrH/lDbbE35b2mePj4l9HnJo1u/KFyATQy0pZvccBB+\nlEoqphuQ59xihyUdt3Oh5lS7pBhfE7wqk28oZuni8DmXj/2rdnnjZpCiwoM3\nrGH9UOxE8eF0aZe/2RNd/bayOhRGzztsj2kDpMsnucCRT0D2pXSytrU27XvL\nXHnMx9gkKuMq/zSIzss5jn7+sCVoaZdsKkoZxJGX2rZYhSX8TqH1z4r7wtau\n7p5IcuuwBEUS6+8ZqWM0fyjbPcbl8VWboAC9RfZX5U4jdgWc+oHQL4UzfLoT\nAp3RqR23/YgyxcZU80eWe/cGRy2sNhu5W3LmUdJ0hpSj1KHx3SeeDwrGS112\nLf2p3K1zaA0M7yFl1EMEo5ee1fxgELB//WfvjFubV6Ln7tIrmFYEFdxMaMEH\nKbGzzB9ylFPciz2IaO6kGsQ1Axx3JHtLGVxhQxcSH1b4V/pg75lw3gk3kAVI\nppv2FoNlOvuepwNpz8lmYnQYWF2wbgEESNZupRdoqWpE7aTdgPI1CVVtsfir\nXfkPF/6TxRyFtEV2ELpp449ud5kirvykBucH0/0hE/FpXaYuMuCp4ACxuEfo\neaukWiK8nGBN8WskjzK9morPBKYSKwHETNxV86sAEASY9pNhzwRNS0TDid7t\nTuii\r\n=8Fiv\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDyd28N27jDRrKfUjO/85hlDy/AJuJqcZd3lDdkGUquZgIhAMLXsMFWQ+XPkDH217Qp0gXt5nqKjJ7surZSTTqedYyA"}]},"maintainers":[{"name":"ontimize-web","email":"ontimize-web@imatia.com"}],"_npmUser":{"name":"ontimize-web","email":"ontimize-web@imatia.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/o-ngx-tree_8.0.0_1599206290785_0.9059385116783287"},"_hasShrinkwrap":false},"8.0.1":{"name":"o-ngx-tree","version":"8.0.1","description":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree","main":"index.js","license":"MIT","author":{"name":"Imatia S.L."},"homepage":"https://github.com/OntimizeWeb/o-ngx-tree","repository":{"type":"git","url":"git+https://github.com/OntimizeWeb/o-ngx-tree.git"},"bugs":{"url":"https://github.com/OntimizeWeb/o-ngx-tree/issues"},"keywords":["tree","ng2","angular","ng2-tree","o-ngx-tree","branch","tree-view","branchy","angular2-tree-view","expand","collapse","recursive"],"scripts":{"pre:publish":"npm run clean && npm run test && npm run lint && npm run compile && mkdir -p dist && cp -R src/styles.css README.md media dist","post:publish":"npm run build:demo && gh-pages -d dist-demo","start":"ng serve --prod","build:demo":"ng build","test":"ng test --watch false","test:w":"ng test --watch","test:cov":"ng test --watch false --code-coverage","lint":"ng lint o-ngx-tree --type-check","e2e":"ng e2e","changelog":"conventional-changelog -i CHANGELOG.md -s -p angular","github-release":"conventional-github-releaser -p angular","version":"npm run changelog && git add CHANGELOG.md","postversion":"git push origin master && git push --tags && npm run github-release && node publish.js","webdriver-update":"node ./node_modules/protractor/bin/webdriver-manager update","precommit":"pretty-quick --staged","prettier":"prettier --write '{.,src,test}/**/*.ts'","clean":"rimraf coverage build dist dist-demo bundles factories .publish","compile":"ngc -p tsconfig-aot.json && node umd-bundler.js","copy":"copyfiles -f src/styles.css README.md package.json dist && copyfiles media/** dist","build":"npm run clean && npm run compile && npm run copy"},"husky":{"hooks":{"pre-commit":"npm run lint && pretty-quick --staged"}},"devDependencies":{"@angular-devkit/build-angular":"~0.803.22","@angular/cli":"~8.3.21","@angular/common":"~8.2.14","@angular/compiler":"~8.2.14","@angular/compiler-cli":"~8.2.14","@angular/core":"~8.2.14","@angular/forms":"~8.2.14","@angular/language-service":"~8.2.14","@angular/platform-browser":"~8.2.14","@angular/platform-browser-dynamic":"~8.2.14","@angular/router":"~8.2.14","@types/jasmine":"2.8.2","@types/node":"~8.9.4","alertifyjs":"1.10.0","codelyzer":"5.2.1","conventional-changelog":"1.1.7","conventional-changelog-cli":"1.3.5","conventional-github-releaser":"2.0.0","copyfiles":"1.2.0","core-js":"^3.6.4","font-awesome":"4.7.0","gh-pages":"1.1.0","husky":"0.14.3","jasmine-core":"2.8.0","jasmine-data-provider":"2.2.0","jasmine-spec-reporter":"4.2.1","karma":"1.7.1","karma-chrome-launcher":"2.2.0","karma-cli":"1.0.1","karma-coverage-istanbul-reporter":"1.3.0","karma-jasmine":"1.1.0","karma-jasmine-html-reporter":"0.2.2","karma-phantomjs-launcher":"1.0.4","phantomjs-polyfill":"0.0.2","phantomjs-prebuilt":"2.1.16","prettier":"1.10.2","pretty-quick":"1.4.1","protractor":"5.2.0","rimraf":"2.6.2","rxjs":"~6.4.0","rxjs-compat":"^6.2.0","rxjs-tslint":"^0.1.4","shelljs":"0.7.8","systemjs-builder":"0.16.12","ts-node":"3.3.0","tslint":"5.8.0","tslint-config-valorsoft":"2.1.1","typescript":"~3.5.3","uuid":"3.1.0","webpack":"^4.10.2","zone.js":"0.9.1"},"_id":"o-ngx-tree@8.0.1","_nodeVersion":"10.16.0","_npmVersion":"6.9.0","dist":{"integrity":"sha512-dITHxQCuk3sNnjsZeqyrdOHU0J6cltjig4kp12cxOJpHEtKat5q8nAGfT8xd6PIexqxmV3NHNs6Uq5BRlVrB3Q==","shasum":"1d34385e6860c02ba87b3d971cb8141c1271f6b5","tarball":"https://registry.npmjs.org/o-ngx-tree/-/o-ngx-tree-8.0.1.tgz","fileCount":131,"unpackedSize":669452,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJfWH7ECRA9TVsSAnZWagAAIzIQAIWv9zPpTCWk9D/BeeNm\nTHSWPirOPaq+v9C3dP1KenK7/ISl+xVlcsVYE6wo/6NSjeRGdev70lqBOmB/\nKJWAJqbxuFlZjZeHw/DKVsirgQI5gN/Cbfvu6pyo3p3Grwuw4UiKDOd3/1K+\n81woCu8IonJ8Nm+eu5KfV4yFj/X+iIJha0eh+om0dTjy+VG7drKEdWi5uDbU\n/5GTp7FYJ3QrLIxPi0fu/vcsCj5bAZLxBq+tVSioRIr4Py9K+jVPqY69593y\nxiIWQkOFZDZxFCQkZEiJ5eqOgZtVmYAIIhLOGzerFLVDaA+kSNFZmJ/MLsg4\npzVhN+ddHTZMtp7H7f7aIQ3DuFIlWSf9NccMdTUtDr/QrD9gV3d4emHxkuJZ\nn652TWjJgUptZTZqKfijV62KGU34zFwrXJC2pSzUdylV5fbk3Zft3Uy0B8e3\n3Q+qFZDbdzyxQFEUjDAt8g1+VzFlJsiMdK416t/hqAOaDlBAmsPE6iqgDN77\naoD3jIWyNJz4o4R6lI/91cQ8RSppB1CbRCt1cKZo/tZX4Rlj6zwCvHJ0mrsA\nkUNkMZFhXHSTZrX5k8954kWWAB3o4l85I4oOefKz3Eh7wxAGt44YAz8jRHVs\ny/A0qyr5y+25FOXjQFiTYjUENP4plTyldMDreOZmdcvBxccBTVaPoHv4zYAO\nKNph\r\n=fZel\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIHxIatOlB/87+N16eLxjbgDPC0cfNLTZpCfi4JkjbHhPAiAKQ0eti/P8T/gceuIAmoLPqMqGt3K4394vMZ02qVLaIQ=="}]},"maintainers":[{"name":"ontimize-web","email":"ontimize-web@imatia.com"}],"_npmUser":{"name":"ontimize-web","email":"ontimize-web@imatia.com"},"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/o-ngx-tree_8.0.1_1599635139336_0.7630533032645292"},"_hasShrinkwrap":false}},"time":{"created":"2019-04-11T14:35:56.263Z","4.0.0":"2019-04-11T14:35:56.475Z","modified":"2022-05-12T00:02:41.847Z","8.0.0-rc.0":"2020-07-02T06:38:16.507Z","8.0.0":"2020-09-04T07:58:10.944Z","8.0.1":"2020-09-09T07:05:39.560Z"},"maintainers":[{"name":"ontimize-web","email":"ontimize-web@imatia.com"}],"description":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree","homepage":"https://github.com/OntimizeWeb/o-ngx-tree","keywords":["tree","ng2","angular","ng2-tree","o-ngx-tree","branch","tree-view","branchy","angular2-tree-view","expand","collapse","recursive"],"repository":{"type":"git","url":"git+https://github.com/OntimizeWeb/o-ngx-tree.git"},"author":{"name":"Imatia S.L."},"bugs":{"url":"https://github.com/OntimizeWeb/o-ngx-tree/issues"},"license":"MIT","readme":"Angular component for visualizing data that can be naturally represented as a tree. Forked from valor-software/ng2-tree\r\n\r\n# :herb: o-ngx-tree\r\n<!--\r\n[![npm](https://img.shields.io/npm/v/ng2-tree.svg?style=flat-square)](https://www.npmjs.com/package/ng2-tree)\r\n[![Travis](https://img.shields.io/travis/valor-software/ng2-tree.svg?style=flat-square)](https://travis-ci.org/valor-software/ng2-tree)\r\n[![Codecov](https://img.shields.io/codecov/c/github/valor-software/ng2-tree.svg?style=flat-square)](https://codecov.io/github/valor-software/ng2-tree)\r\n-->\r\n<!-- TOC -->\r\n\r\n* [:clapper: Usage](#clapper-usage)\r\n* [:eyes: Demo](#eyes-demo)\r\n* [:wrench: API](#wrench-api)\r\n  * [tree](#tree)\r\n  * [[tree]](#tree)\r\n    * [Load children asynchronously](#load-children-asynchronously)\r\n    * [Load children using ngrx (or any redux-like library)](#load-children-using-ngrx-or-any-redux-like-library)\r\n    * [Configure node via TreeModelSettings](#configure-node-via-treemodelsettings)\r\n  * [[settings]](#settings)\r\n  * [`Tree` class](#tree-class)\r\n  * [events (nodeMoved, nodeSelected, nodeRenamed, nodeRemoved, nodeCreated, nodeExpanded, nodeCollapsed)](#events-nodemoved-nodeselected-noderenamed-noderemoved-nodecreated-nodeexpanded-nodecollapsed)\r\n    * [NodeSelectedEvent](#nodeselectedevent)\r\n    * [NodeMovedEvent](#nodemovedevent)\r\n    * [NodeRemovedEvent](#noderemovedevent)\r\n    * [NodeCreatedEvent](#nodecreatedevent)\r\n    * [NodeRenamedEvent](#noderenamedevent)\r\n    * [NodeExpandedEvent](#nodeexpandedevent)\r\n    * [NodeCollapsedEvent](#nodecollapsedevent)\r\n    * [LoadNextLevelEvent](#loadnextlevelevent)\r\n* [:gun: Controller](#gun-controller)\r\n  * [select - selects a node](#select---selects-a-node)\r\n  * [isSelected - checks whether a node is selected](#isselected---checks-whether-a-node-is-selected)\r\n  * [collapse - collapses a node](#collapse---collapses-a-node)\r\n  * [isCollapsed - check whether a node is collapsed](#iscollapsed---check-whether-a-node-is-collapsed)\r\n  * [expand - expands a node](#expand---expands-a-node)\r\n  * [isExpanded - checks whether a node is expanded](#isexpanded---checks-whether-a-node-is-expanded)\r\n  * [toTreeModel - converts a tree to a TreeModel instance](#totreemodel---converts-a-tree-to-a-treemodel-instance)\r\n  * [rename - renames a node (changes its value underneath)](#rename---renames-a-node-changes-its-value-underneath)\r\n  * [startRenaming - changes the node template so that text input appears and lets a user type a new name](#startrenaming---changes-the-node-template-so-that-text-input-appears-and-lets-a-user-type-a-new-name)\r\n  * [remove - removes a node from the tree](#remove---removes-a-node-from-the-tree)\r\n  * [addChild - creates a new child node](#addchild---creates-a-new-child-node)\r\n  * [changeNodeId - changes node's id](#changenodeid---changes-nodes-id)\r\n  * [reloadChildren - loads async children once more](#reloadchildren---loads-async-children-once-more)\r\n  * [setChildren - changes children of a node;](#setchildren---changes-children-of-a-node)\r\n* [SystemJS](#systemjs)\r\n<!-- * [Changes that should be taken into account in order to migrate from **ng2-tree V1** to **ng2-tree V2**](#changes-that-should-be-taken-into-account-in-order-to-migrate-from-__ng2-tree-v1__-to-__ng2-tree-v2__) -->\r\n* [:bulb: Want to help?](#bulb-want-to-help)\r\n\r\n<!-- /TOC -->\r\n\r\n## :clapper: Usage\r\n\r\nOk, let's start with an installation - all you need to do is:\r\n\r\n`npm install --save o-ngx-tree`\r\n\r\nNow when you have `o-ngx-tree` installed, you are in a few steps from having tree in your application:\r\n\r\n1. Add the `TreeModule` to your application's module `imports` section:\r\n\r\n```typescript\r\nimport { NgModule } from '@angular/core';\r\nimport { AppComponent } from './app.component';\r\nimport { BrowserModule } from '@angular/platform-browser';\r\nimport { TreeModule } from 'o-ngx-tree';\r\n\r\n@NgModule({\r\n  declarations: [MyComponent],\r\n  imports: [BrowserModule, TreeModule],\r\n  bootstrap: [MyComponent]\r\n})\r\nexport class MyModule {}\r\n```\r\n\r\n2. As soon as the previous step is done we need to give o-ngx-tree a model to render - this can be accomplished by populating its `[tree]` attribute with an object that conforms to the `TreeModel` interface (see [API](#wrench-api)):\r\n\r\n```typescript\r\n// 1 - import required classes and interfaces\r\nimport { TreeModel } from 'o-ngx-tree';\r\n\r\n@Component({\r\n  selector: 'myComp',\r\n  // 2 - set [tree] attribute to tree object\r\n  template: `<tree [tree]=\"tree\"></tree>`\r\n})\r\nclass MyComponent {\r\n  // 3 - make sure that tree object conforms to the TreeModel interface\r\n  public tree: TreeModel = {\r\n    value: 'Programming languages by programming paradigm',\r\n    children: [\r\n      {\r\n        value: 'Object-oriented programming',\r\n        children: [{ value: 'Java' }, { value: 'C++' }, { value: 'C#' }]\r\n      },\r\n      {\r\n        value: 'Prototype-based programming',\r\n        children: [{ value: 'JavaScript' }, { value: 'CoffeeScript' }, { value: 'Lua' }]\r\n      }\r\n    ]\r\n  };\r\n}\r\n```\r\n\r\n3. Apart from that, in order to have usable tree in the browser, you need to add **o-ngx-tree styles** which you can find in your `node_modules/o-ngx-tree/styles.css`\r\n\r\nIn Angular 2/4 cli projects, modify **.angular-cli.json** as below:\r\n\r\n```typescript\r\n      \"styles\": [\r\n        \"styles.css\",\r\n        \"../node_modules/o-ngx-tree/styles.css\"\r\n      ],\r\n```\r\n\r\n4. And finally, I suppose, you'd want to listen to events generated by o-ngx-tree (for a full list of supported events look at the [API](#wrench-api)). No problem, this is also easy to do - for example let's add a listener for `node was selected` kind of events:\r\n\r\n```typescript\r\n// 1 - import required classes and interfaces\r\nimport { TreeModel, NodeEvent } from 'o-ngx-tree';\r\n\r\n@Component({\r\n  selector: 'myComp',\r\n  // 2 - listent for nodeSelected events and handle them\r\n  template: `<tree [tree]=\"tree\" (nodeSelected)=\"logEvent($event)\"></tree>`\r\n})\r\nclass MyComponent {\r\n  public tree: TreeModel = { ... };\r\n\r\n  // 3 - print caught event to the console\r\n  public logEvent(e: NodeEvent): void {\r\n    console.log(e);\r\n  }\r\n}\r\n```\r\n\r\nVoila! That's pretty much it - enjoy :blush:\r\n\r\n## :eyes: Demo\r\n\r\n<!-- Feel free to examine the [demo](https://valor-software.github.io/ng2-tree/index.html) and its [sources](src/demo) to find out how things are wired.\r\nAlso, there is [another demo built with Angular CLI](https://github.com/rychkog/ng2-tree-demo). -->\r\n\r\n## :wrench: API\r\n\r\nHere is the fully stuffed _tree_ tag that you can use in your templates:\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      [settings]=\"settings\"\r\n      (nodeRemoved)=\"handleRemoved($event)\"\r\n      (nodeRenamed)=\"handleRenamed($event)\"\r\n      (nodeSelected)=\"handleSelected($event)\"\r\n      (nodeMoved)=\"handleMoved($event)\"\r\n      (nodeCreated)=\"handleCreated($event)\"\r\n      (nodeExpanded)=\"handleExpanded($event)\"\r\n      (nodeCollapsed)=\"handleCollapsed($event)\"\r\n      (loadNextLevel)=\"handleNextLevel($event)\">\r\n    </tree>\r\n```\r\n\r\nLet's go through every element of this structure one by one.\r\n\r\n### tree\r\n\r\n`tree` is the selector for `TreeComponent` which is bundled into `TreeModule`:\r\n\r\n### [tree]\r\n\r\n`tree` has a `[tree]` attribute which needs to be populated with an object implementing `TreeModel` interface. You can import this interface like below:\r\n\r\n```typescript\r\nimport { TreeModel } from 'o-ngx-tree';\r\n```\r\n\r\nHere is the definition of the `TreeModel` interface:\r\n\r\n```typescript\r\ninterface TreeModel {\r\n  value: string | RenamableNode;\r\n  id: string | number;\r\n  children?: Array<TreeModel>;\r\n  loadChildren?: ChildrenLoadingFunction;\r\n  settings?: TreeModelSettings;\r\n}\r\n```\r\n\r\nAs you can see - an object that conforms to this interface has a recursive nature, an example can be seen below:\r\n\r\n```typescript\r\n{\r\n    value: 'Programming languages by programming paradigm',\r\n    children: [\r\n      {\r\n        value: 'Object-oriented programming',\r\n        children: [\r\n          {value: 'Java'},\r\n          {value: 'C++'},\r\n          {value: 'C#'}\r\n        ]\r\n      },\r\n      {\r\n        value: 'Prototype-based programming',\r\n        children: [\r\n          {value: 'JavaScript'},\r\n          {value: 'CoffeeScript'},\r\n          {value: 'Lua'}\r\n        ]\r\n      }\r\n    ]\r\n  }\r\n```\r\n\r\nProperty `value` can be of type `string` or `RenamableNode`.\r\n`RenamableNode` gives you an additional control over the way node is renamed and rendered (by rendered I mean its text representation). Here is the definition of the `RenamableNode` interface:\r\n\r\n```typescript\r\ninterface RenamableNode {\r\n  // This method will be invoked in order to apply new value to this kind of node\r\n  setName(name: string): void;\r\n\r\n  // This method will be invoked in order to get a text for rendering as a node value\r\n  toString(): string;\r\n}\r\n```\r\n\r\nHere is an example of such a node in the `TreeModel` object:\r\n\r\n```typescript\r\n{\r\n    value: 'Programming languages by programming paradigm',\r\n    children: [\r\n      {\r\n        value: 'Object-oriented programming',\r\n        children: [\r\n          {\r\n            // I am a RenamableNode. Yeah, that's me :)\r\n            value: <RenamableNode>{\r\n              name: 'Java',\r\n              setName(name: string): void {\r\n                this.name = name;\r\n              },\r\n              toString(): string {\r\n                return this.name;\r\n              }\r\n            }\r\n          },\r\n          {value: 'C++'},\r\n          {value: 'C#'}\r\n        ]\r\n      },\r\n      {\r\n        value: 'Prototype-based programming',\r\n        loadChildren: (callback) => {\r\n          setTimeout(() => {\r\n            callback([\r\n              {value: 'JavaScript'},\r\n              {value: 'CoffeeScript'},\r\n              {value: 'TypeScript'}\r\n            ]);\r\n          }, 5000);\r\n        }\r\n      }\r\n    ]\r\n  };\r\n```\r\n\r\n#### Load children asynchronously\r\n\r\nAnother worth noting thing is `loadChildren`. This function on `TreeModel` allows you to load its **children asynchronously**.\r\n\r\n```typescript\r\n{\r\n  value: 'Prototype-based programming',\r\n  loadChildren: (callback) => {\r\n    setTimeout(() => {\r\n      callback([\r\n        {value: 'JavaScript'},\r\n        {value: 'CoffeeScript'},\r\n        {value: 'TypeScript'}\r\n      ]);\r\n    }, 5000);\r\n  }\r\n}\r\n```\r\n\r\nNode that defines this function is collapsed by default. At the moment of clicking 'Expand' arrow, it starts loading its children by calling given function.\r\nIf `loadChildren` function is given to the node - `children` property is ignored. For more details - have a look at the [Demo](#eyes-demo).\r\n\r\n#### Load children using ngrx (or any redux-like library)\r\n\r\nYou can also load children by changing the tree state using ngrx.\r\nThe tree can emit an appropriate event notifying you to dispatch a new action in order to load the branch's children.\r\n\r\nTo enable this feature you should set the `TreeModel.emitLoadNextLevel` property to true:\r\n\r\n```typscript\r\nconst model: TreeModel = {\r\nemitLoadNextLevel : true\r\n}\r\n```\r\n\r\nNow on the first time the node is expanded a **LoadNextLevelEvent** will be fired (via the **loadNextLevel** EventEmitter in the tree) containing the node that requested a next level (its children) loading.\r\n\r\nIn your code make sure you change the tree state and add the children to the model.\r\n\r\nIn addition the regular **NodeExpanded** event will be fired.\r\n\r\n**NOTICE**: if both `emitLoadNextLevel` and `loadChildren` are provided, the tree will ignore the `emitLoadNextLevel` and the `LoadNextLevelEvent` won't be fired.\r\n\r\n#### Configure node via TreeModelSettings\r\n\r\nApart from that `TreeModel` interface has an optional field called `settings` of type `TreeModelSettings`.\r\n\r\nHere is an example of its usage:\r\n\r\n```typescript\r\n{\r\n  value: 'Prototype-based programming',\r\n  settings: {\r\n    'static': true,\r\n    'rightMenu': true,\r\n    'leftMenu': true,\r\n    'cssClasses': {\r\n      'expanded': 'fa fa-caret-down fa-lg',\r\n      'collapsed': 'fa fa-caret-right fa-lg',\r\n      'leaf': 'fa fa-lg',\r\n      'empty': 'fa fa-caret-right disabled'\r\n    },\r\n    'templates': {\r\n      'node': '<i class=\"fa fa-folder-o fa-lg\"></i>',\r\n      'leaf': '<i class=\"fa fa-file-o fa-lg\"></i>',\r\n      'leftMenu': '<i class=\"fa fa-navicon fa-lg\"></i>'\r\n    },\r\n    'menuItems': [\r\n        { action: NodeMenuItemAction.Custom, name: 'Foo', cssClass: 'fa fa-arrow-right' },\r\n        { action: NodeMenuItemAction.Custom, name: 'Bar', cssClass: 'fa fa-arrow-right' },\r\n        { action: NodeMenuItemAction.Custom, name: 'Baz', cssClass: 'fa fa-arrow-right'}\r\n      ]\r\n    }\r\n  },\r\n  children: [\r\n    {value: 'JavaScript'},\r\n    {value: 'CoffeeScript'},\r\n    {value: 'Lua'}\r\n  ]\r\n}\r\n```\r\n\r\n* `static` - Boolean - This option makes it impossible to drag a tree or modify it in a some way, though you still can select nodes in the static tree and appropriate events will be generated.\r\n* `isCollapsedOnInit` - Boolean - This option makes a tree to be collapsed on first load (this option cascades to its children).\r\n* `rightMenu` - Boolean - This option allows you to activate (true, by default) or deactivate (false) right menu when clicking with right button of a mouse.\r\n* `leftMenu` - Boolean - This option allows you to activate (true) or deactivate (false, by default) left menu.\r\n* `cssClasses` - Object:\r\n  * `expanded` - String - It specifies a css class (or classes) for an item which represents expanded state of a node. The item is clickable and it transitions the node to the collapsed state\r\n  * `collapsed` - String - It specifies a css class (or classes) for an item which represents collapsed state of a node. The item is clickable and it transitions the node to the expanded state\r\n  * `leaf` - String - It specifies a css class (or classes) for an item which represents a node without an option to expand or collapse - in other words: a leaf node.\r\n  * `empty` - String - Node is considered empty when it has no children. Once this condition is satisfied - appropriate css class will be applied to the node.\r\n* `templates` - Object:\r\n  * `node` - String - It specifies a html template which will be included to the left of the node's value.\r\n  * `leaf` - String - It specifies a html template which will be included to the left of the leaf's value.\r\n  * `leftMenu` - String - It specifies a html template to the right of the node's value. This template becomes clickable and shows a menu on node's click.\r\n* `menuItems` - here you can specify your custom menu items. You should feed an array of NodeMenuItem instances to this setting. Once done - setup a subscription to `MenuItemSelectedEvent`s by listening to `(menuItemSelected)=\"onMenuItemSelected($event)\"` on the tree.\r\n\r\nAll options that are defined on a `parent` are automatically applied to children. If you want you can override them by `settings` of the child node.\r\n\r\n### [settings]\r\n\r\nObject that should be passed to `[settings]` must be of type [`Ng2TreeSettings`](src/tree.types.ts). This attribute is **optional**. Right now only one setting is available in there - `rootIsVisible`. This setting allows you to make a root node of the tree _invisible_:\r\n\r\n```typescript\r\nconst treeSettings: Ng2TreeSettings = {\r\n  rootIsVisible: false\r\n};\r\n```\r\n\r\nBy default `rootIsVisible` equals to `true`\r\n\r\n### `Tree` class\r\n\r\nAlso in the next section, you'll be reading about events generated by the `o-ngx-tree`. And here [Tree](src/tree.ts) class comes in handy for us, because its instances propagated with event objects. Under the hood, `o-ngx-tree` wraps a `TreeModel` provided by the user in `Tree`. And `Tree` in turn has lots of useful methods and properties (like `parent`, `hasChild()`, `isRoot()` etc.)\r\n\r\n### events (nodeMoved, nodeSelected, nodeRenamed, nodeRemoved, nodeCreated, nodeExpanded, nodeCollapsed)\r\n\r\n`NodeEvent` is the root of the tree events' hierarchy. It defines property `node` that contains a receiver of the event action (`node` is an instance of the `Tree` class).\r\n\r\n`NodeDestructiveEvent` is the parent for all events that cause changes to the structure of the tree or to the node's value.\r\n\r\n#### NodeSelectedEvent\r\n\r\nYou can subscribe to the `NodeSelectedEvent` by attaching listener to the `(nodeSelected)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeSelected)=\"handleSelected($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeSelectedEvent` has just one property `node` which contains a `Tree` object representing selected node.\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n#### NodeMovedEvent\r\n\r\nYou can subscribe to `NodeMovedEvent` by attaching listener to `(nodeMoved)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeMoved)=\"handleMoved($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeMovedEvent` has two properties `node` and `previousParent` both of which contain `Tree` objects:\r\n\r\n* `node` contains a moved node;\r\n* `previousParent` contains a previous parent of the moved node;\r\n\r\n```typescript\r\n{node: <Tree>{...}, previousParent: <Tree>{...}}\r\n```\r\n\r\n#### NodeRemovedEvent\r\n\r\nYou can subscribe to `NodeRemovedEvent` by attaching listener to `(nodeRemoved)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeRemoved)=\"handleRemoved($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeRemovedEvent` has a `node` property, which contains removed node (of type `Tree`).\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n#### NodeCreatedEvent\r\n\r\nYou can subscribe to `NodeCreatedEvent` by attaching listener to `(nodeCreated)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeCreated)=\"handleCreated($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeCreatedEvent` has a `node` property of type `Tree`, which contains a created node and a `controller` property, which will give you access to node's controller.\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n#### NodeRenamedEvent\r\n\r\nYou can subscribe to `NodeRenamedEvent` by attaching listener to `(nodeRenamed)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeRenamed)=\"handleRenamed($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeRenamedEvent` has three properties:\r\n\r\n* `node` contains a node that was renamed ( an instance of `Tree`).\r\n* `oldValue` contains a value, that node used to have (it might be `string` or `RenamableNode`)\r\n* `newValue` contains a new value of the node (it might be `string` or `RenamableNode`)\r\n\r\n```typescript\r\n{\r\n  node: <Tree>{...},\r\n  oldValue: <string|RenamableNode>{...},\r\n  newValue: <string|RenamableNode>{...}\r\n}\r\n```\r\n\r\n#### NodeExpandedEvent\r\n\r\nYou can subscribe to `NodeExpandedEvent` by attaching listener to `(nodeExpanded)` attribute, this event wont fire on initial expansion\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeExpanded)=\"handleExpanded($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeExpandedEvent` has a `node` property of type `Tree`, which contains an expanded node.\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n#### NodeCollapsedEvent\r\n\r\nYou can subscribe to `NodeCollapsedEvent` by attaching listener to `(nodeCollapsed)` attribute\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (nodeCollapsed)=\"handleCollapsed($event)\">\r\n    </tree>\r\n```\r\n\r\n`NodeCollapsedEvent` has a `node` property of type `Tree`, which contains a collapsed node.\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n#### LoadNextLevelEvent\r\n\r\nYou can subscribe to `LoadNextLevelEvent` by attaching a listener to `(loadNextLevel)` attribute.\r\nRelevant for loading children via ngrx (or any redux-inspired library).\r\n\r\n```html\r\n    <tree\r\n      [tree]=\"tree\"\r\n      (loadNextLevel)=\"handleNextLevel($event)\">\r\n    </tree>\r\n```\r\n\r\n`LoadNextLevelEvent` has a `node` property of the type `Tree`, which contains a node for which next level (its children) should be loaded.\r\n\r\n```typescript\r\n{node: <Tree>{...}}\r\n```\r\n\r\n## :gun: Controller\r\n\r\nFirst of all you should know how to get a controller of a particular node. You can get a controller of a node only if you set an id property of a node.\r\n\r\n> TIP: Ids for nodes created via the context menu or using a TreeController instance get populated automatically unless nodes had ids before there were added to the tree\r\n\r\nFor example, your tree structure should look like:\r\n\r\n```typescript\r\npublic tree: TreeModel = {\r\n    value: 'Programming languages by programming paradigm',\r\n    id: 1,\r\n    children: [\r\n      {\r\n        value: 'Object-oriented programming',\r\n        id: 2,\r\n        children: [\r\n          {value: 'Java', id: 3},\r\n          {value: 'C++', id: 4},\r\n          {value: 'C#', id 5},\r\n        ]\r\n      },\r\n      {\r\n        value: 'Prototype-based programming',\r\n        id: 6,\r\n        children: [\r\n          {value: 'JavaScript', id: 7},\r\n          {value: 'CoffeeScript', id: 8},\r\n          {value: 'Lua', id: 9},\r\n        ]\r\n      }\r\n    ]\r\n  };\r\n```\r\n\r\nIds must be unique within a one tree, otherwise, some controllers will be overwritten and you won't be able to acquire them.\r\nIn order to get a node's controller you need to create an Angular local variable out of tree component via hash binding in the template:\r\n\r\n```typescript\r\n@Component({\r\n  template: '<tree [tree]=\"tree\" #treeComponent></tree>'\r\n})\r\nclass TheComponent implements AfterViewInit {\r\n  tree: TreeModel = {\r\n    value: 'Programming languages by programming paradigm',\r\n    id: 1,\r\n    children: [\r\n      {\r\n        value: 'Object-oriented programming',\r\n        id: 2,\r\n        children: [\r\n          {value: 'Java', id: 3},\r\n          {value: 'C++', id: 4},\r\n          {value: 'C#', id 5},\r\n        ]\r\n      },\r\n      {\r\n        value: 'Prototype-based programming',\r\n        id: 6,\r\n        children: [\r\n          {value: 'JavaScript', id: 7},\r\n          {value: 'CoffeeScript', id: 8},\r\n          {value: 'Lua', id: 9},\r\n        ]\r\n      }\r\n    ]\r\n  };\r\n\r\n  @ViewChild('treeComponent') treeComponent;\r\n\r\n  ngAfterViewInit(): void {\r\n    // ... make use of this.treeComponent ...\r\n  }\r\n}\r\n```\r\n\r\nthen by executing `this.treeComponent.getControllerByNodeId(PUT_HERE_YOUR_NODE_ID)` you'll get an instance of a TreeController (another couple steps and the world is yours =) )\r\n\r\nBelow are more detailed explanations of the TreeController and its usage. Let's go method by method:\r\n\r\n```typescript\r\nconst oopNodeController = this.treeComponent.getControllerByNodeId(2);\r\n```\r\n\r\n#### select - selects a node\r\n\r\n```typescript\r\noopNodeController.select();\r\n```\r\n\r\nThis method selects the node and unselects all the other nodes, also it fires a select event.\r\n\r\n#### isSelected - checks whether a node is selected\r\n\r\n```typescript\r\noopNodeController.isSelected();\r\n```\r\n\r\nThis method returns true if the node is selected and false if it isn't.\r\n\r\n#### collapse - collapses a node\r\n\r\n```typescript\r\noopNodeController.collapse();\r\n```\r\n\r\nThis method collapses a node if the node is collapsible (for example we cannot collapse a leaf). If the node gets collapsed successfully - a collapse event gets fired.\r\n\r\n#### isCollapsed - check whether a node is collapsed\r\n\r\n```typescript\r\noopNodeController.isCollapsed();\r\n```\r\n\r\nThis method returns true if the node is collapsed and false otherwise.\r\n\r\n#### expand - expands a node\r\n\r\n```typescript\r\noopNodeController.expand();\r\n```\r\n\r\nThis method expands the node in case it can be expanded. On successful expanding the expand event is fired.\r\n\r\n#### expandToParent - expands a node and its parents up to the root\r\n\r\n```typescript\r\noopNodeController.expandToParent();\r\n```\r\n\r\nThis method expands the node even if it is a leaf. Expand event is fired for every expanded parent up to the root.\r\n\r\n**Important:** For this to work - `keepNodesInDOM: true` should be set on the appropriate tree.\r\n\r\n#### isExpanded - checks whether a node is expanded\r\n\r\n```typescript\r\noopNodeController.isExpanded();\r\n```\r\n\r\n#### toTreeModel - converts a tree to a TreeModel instance\r\n\r\nActually controller makes and returns a clone of tree's underlying model\r\n\r\n```typescript\r\noopNodeController.toTreeModel();\r\n```\r\n\r\nThis method returns true if the node is expanded and false otherwise.\r\n\r\n#### rename - renames a node (changes its value underneath)\r\n\r\n```typescript\r\noopNodeController.rename('new value');\r\n```\r\n\r\nThis method accepts a string and sets it as a node's new value, this action also fires rename event.\r\n\r\n#### startRenaming - changes the node template so that text input appears and lets a user type a new name\r\n\r\n```typescript\r\noopNodeController.startRenaming();\r\n```\r\n\r\nAfter the user entered the new name a rename event will be fired.\r\n\r\n#### remove - removes a node from the tree\r\n\r\n```typescript\r\noopNodeController.remove();\r\n```\r\n\r\nThis method removes the node and its children and fires remove event.\r\n\r\n#### addChild - creates a new child node\r\n\r\n```typescript\r\nlet newNode: TreeModel = {\r\n  value: 'Go',\r\n  children: []\r\n};\r\noopNodeController.addChild(newNode);\r\n```\r\n\r\nThis method accepts a TreeModel and adds it as a child of the parent or as a sibling (depends on which controller this was called - branch controller or a leaf controller).\r\n\r\n### changeNodeId - changes node's id\r\n\r\n```typescript\r\noopNodeController.changeNodeId(10);\r\n```\r\n\r\nThis method can change a node's id. When the user creates a node from node's menu you will access the new node after it's created and this method will provide a way to change the node's id.\r\n\r\n### reloadChildren - loads async children once more\r\n\r\n```typescript\r\noopNodeController.reloadChildren();\r\n```\r\n\r\n### setChildren - changes children of a node;\r\n\r\n```typescript\r\nlet newChildren: Array<TreeModel> = [\r\n  { value: 'new children 1' },\r\n  { value: 'new children 2' },\r\n  { value: 'new children 3' }\r\n];\r\noopNodeController.setChildren(newChildren);\r\n```\r\n\r\nThis method replaces all existing children of the node with new ones.\r\n\r\n## SystemJS\r\n\r\nIf you are using SystemJS, then you need\r\n\r\n```javascript\r\nSystem.config({\r\n    // ...\r\n    map: {\r\n      // ...\r\n      'o-ngx-tree': 'node_modules/o-ngx-tree/bundles/o-ngx-tree.umd.min.js',\r\n      // ...\r\n    },\r\n    // ...\r\n}\r\n```\r\n\r\n## Changes that should be taken into account in order to migrate from **ng2-tree V1** to **ng2-tree V2**\r\n\r\n* Events were reworked:\r\n  * In V1 all events that were inherited from NodeDestructiveEvent used to have property `parent`. It's not the case anymore. If you need a parent you should get it from `node` in event object like `node.parent`;\r\n  * All events used to have `node` property of type `TreeModel`. Now `node` is of type [Tree](#tree-class) (as well as `node.parent`);\r\n  * `NodeMovedEvent` now has property `previousParent`, which contains tree in which moved node used to be.\r\n* CSS styles in **ng2-tree V2** are distributed as separate file which you can find in `node_modules/ng2-tree/styles.css`. That allows you to override ng2-tree styles more easily.\r\n\r\n## :bulb: Want to help?\r\n\r\nI am very appreciate for your ideas, proposals and found bugs which you can put in [github issues](https://github.com/valor-software/ng2-tree/issues). Thanks in advance!\r\n\r\n**P.S.** If you find it hard going through the documentation, please, let me know which parts of it was difficult to grasp and I will improve them.\r\n","readmeFilename":"README.md"}