{"_id":"@10pearls/react-d3-tree","_rev":"18-3b857a13efcc4450c82b407e75161b7c","name":"@10pearls/react-d3-tree","dist-tags":{"latest":"1.13.2"},"versions":{"1.12.0":{"name":"@10pearls/react-d3-tree","version":"1.12.0","description":"React component to create interactive D3 tree hierarchies","main":"lib/react-d3-tree.min.js","scripts":{"clean:lib":"rimraf lib/*","precommit":"lint-staged","build":"yarn clean:lib && webpack --progress --colors --env build","dev":"yarn clean:lib && webpack --progress --colors --watch --env dev","lint":"eslint src/**/*.js","test":"yarn lint && jest --coverage --verbose","test:clean":"rimraf ./coverage","test:watch":"jest --watchAll","test:cov":"jest --coverage --verbose","coveralls":"cat ./coverage/lcov.info | coveralls","show:cov":"open coverage/lcov-report/index.html","docs:react":"react-docgen src -e src/**/*.test.js$|scripts/buildDocs.sh","docs":"yarn docs:react","docs:util":"jsdoc2md src/util/index.js > docs/util/util.md","docs:clean":"rimraf docs/components/* && rimraf docs/util/*","release":"yarn test && yarn build && yarn docs && git commit -a","preanalyze":"rimraf stats.json","analyze":"webpack --config webpack.config.js --env build --profile --json > stats.json && echo '==> http://webpack.github.io/analyse/'"},"lint-staged":{"src/**/*.js":["eslint","prettier --write --single-quote --trailing-comma=all --print-width 100","git add"]},"jest":{"collectCoverageFrom":["src/**/*.{js,jsx}","!src/index.js","!src/util/*","!src/**/*.test.{js,jsx}","!playground/*"],"coverageThreshold":{"global":{"statements":94,"branches":84,"functions":90,"lines":94}},"setupTestFrameworkScriptFile":"/jest/setup.js","moduleNameMapper":{".*\\.(css|less|styl|scss|sass)$":"/jest/mocks/cssModule.js",".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"/jest/mocks/image.js"}},"greenkeeper":{"ignore":["d3","react-transition-group","webpack"]},"dependencies":{"clone":"^2.1.1","d3":"3.5.17","deep-equal":"^1.0.1","prop-types":"^15.5.10","react-transition-group":"^1.1.3","uuid":"^3.0.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0"},"devDependencies":{"babel-cli":"6.26.0","babel-core":"6.26.0","babel-eslint":"8.2.6","babel-jest":"^21.2.0","babel-loader":"7.1.2","babel-plugin-add-module-exports":"0.2.1","babel-preset-es2015":"6.24.1","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","coveralls":"^3.0.0","css-loader":"^0.28.1","enzyme":"^3.4.4","enzyme-adapter-react-16":"^1.2.0","eslint":"4.16.0","eslint-config-airbnb":"^16.1.0","eslint-config-prettier":"^2.5.0","eslint-loader":"2.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^6.0.2","eslint-plugin-react":"^7.5.1","husky":"^0.14.3","jest":"^22.1.3","jsdoc-to-markdown":"^3.0.0","lint-staged":"^6.0.0","np":"^2.20.0","postcss-loader":"^3.0.0","prettier":"^1.6.1","react":"^16.1.1","react-docgen":"^2.16.0","react-dom":"^16.1.1","react-test-renderer":"^16.1.1","regenerator-runtime":"^0.12.0","rimraf":"^2.6.1","style-loader":"^0.22.1","webpack":"^3.5.6","yargs":"12.0.1"},"repository":{"type":"git","url":"git+https://github.com/bkrem/react-d3-tree.git"},"keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"author":{"name":"Ben Kremer"},"license":"MIT","bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"homepage":"https://github.com/bkrem/react-d3-tree","gitHead":"4d89c0f966f9cdb54fca5d5f11311d3ad0eff3c1","_id":"@10pearls/react-d3-tree@1.12.0","_npmVersion":"6.1.0","_nodeVersion":"10.7.0","_npmUser":{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},"dist":{"integrity":"sha512-sznmG1cjXqUbdn26YZffy3YEHg85x+JohaBnSGS+BYLwDaDI3xoZdSd3NtQcsO6bH+j66X9OTIREGZJwEBwB7g==","shasum":"7b4dc4de7f88c3bc90f00c4fe4c9182bdee6ec04","tarball":"https://registry.npmjs.org/@10pearls/react-d3-tree/-/react-d3-tree-1.12.0.tgz","fileCount":46,"unpackedSize":683628,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbx0mZCRA9TVsSAnZWagAA+GgP/ijJ0yYLchXfe2vNDoYJ\nPazaa0P9KSGv/kvHZLmV98D/iZHsz/fEOJiapxaOFtTqwPh7zCQ0RCIFoK/E\nQyYUJzBG4ObYVvJJRJgphe3W0gfcqJK+BLVTIUc9HNw8xsNh8JvjvSqnM74K\n2XsF8HRq2/SI7Cl3qJbBCawguKvgORHTKpq6zyi2o5H6HxapMajZXPqOMwTY\nWT7mF8Lv+yPBWtusH+EGLvcdWJbBaG0lAETQvkN5coLcT3hKnkhM1DwZAnb0\nqilYFmADLmnDbZv0uY8ZUAgmVlaaD0AA4WvbfruhqlB67xcF3GUEtbBA7YGM\n9bl+2b3/HC3rvJlrVO5ezi7NKHuH8tGxUG5x1N8g4Uss9Agy4xUVdGpN2zro\nwpQ3Jstc3Z5Z6xTj5UgDwBvK54RtwoJTVmKl5olNODKiUDXXlS/ez8CHTjIq\n9GDv+h7n9uLtLVDnD+bF+uX1brhWCsK2HCODnytrEN57C5Q4qa8FkxJcDDFT\nKFczhlWFELVa04Uzp62ikpzdIEogJHKdvyw5GXNA1iWIMjpyurZv9flJ4EqJ\nb9AF4CIdU1jIyoIJ+Tpn8Kd8/HtgUUR4E5bYiYKl/MyG7shQAvIJsDESCypp\nTM/ng1rhGViTOQy+ofwis8OUsl0rYouf85pMle/+uKfHCv5NvhbwuYwqiJ/L\n5Cm8\r\n=O+l9\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIAVARyGyw9GaPGwnpny+NqgqYs4Xhj/sBd5E6J0qycXXAiEA9bwKE+LzLvn6aFCQMESNfJsrYoJeoDlTEDEbeAzC33w="}]},"maintainers":[{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},{"name":"mohuk","email":"mohammad.umair.k@gmail.com"},{"name":"shahbazshueb","email":"shahbazshueb@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-d3-tree_1.12.0_1539787160422_0.3820525013983682"},"_hasShrinkwrap":false},"1.12.1":{"name":"@10pearls/react-d3-tree","version":"1.12.1","description":"React component to create interactive D3 tree hierarchies","main":"lib/react-d3-tree.min.js","scripts":{"clean:lib":"rimraf lib/*","precommit":"lint-staged","build":"yarn clean:lib && webpack --progress --colors --env build","dev":"yarn clean:lib && webpack --progress --colors --watch --env dev","lint":"eslint src/**/*.js","test":"yarn lint && jest --coverage --verbose","test:clean":"rimraf ./coverage","test:watch":"jest --watchAll","test:cov":"jest --coverage --verbose","coveralls":"cat ./coverage/lcov.info | coveralls","show:cov":"open coverage/lcov-report/index.html","docs:react":"react-docgen src -e src/**/*.test.js$|scripts/buildDocs.sh","docs":"yarn docs:react","docs:util":"jsdoc2md src/util/index.js > docs/util/util.md","docs:clean":"rimraf docs/components/* && rimraf docs/util/*","release":"yarn test && yarn build && yarn docs && git commit -a","preanalyze":"rimraf stats.json","analyze":"webpack --config webpack.config.js --env build --profile --json > stats.json && echo '==> http://webpack.github.io/analyse/'"},"lint-staged":{"src/**/*.js":["eslint","prettier --write --single-quote --trailing-comma=all --print-width 100","git add"]},"jest":{"collectCoverageFrom":["src/**/*.{js,jsx}","!src/index.js","!src/util/*","!src/**/*.test.{js,jsx}","!playground/*"],"coverageThreshold":{"global":{"statements":94,"branches":84,"functions":90,"lines":94}},"setupTestFrameworkScriptFile":"/jest/setup.js","moduleNameMapper":{".*\\.(css|less|styl|scss|sass)$":"/jest/mocks/cssModule.js",".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"/jest/mocks/image.js"}},"greenkeeper":{"ignore":["d3","react-transition-group","webpack"]},"dependencies":{"clone":"^2.1.1","d3":"3.5.17","deep-equal":"^1.0.1","prop-types":"^15.5.10","react-transition-group":"^1.1.3","uuid":"^3.0.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0"},"devDependencies":{"babel-cli":"6.26.0","babel-core":"6.26.0","babel-eslint":"8.2.6","babel-jest":"^21.2.0","babel-loader":"7.1.2","babel-plugin-add-module-exports":"0.2.1","babel-preset-es2015":"6.24.1","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","coveralls":"^3.0.0","css-loader":"^0.28.1","enzyme":"^3.4.4","enzyme-adapter-react-16":"^1.2.0","eslint":"4.16.0","eslint-config-airbnb":"^16.1.0","eslint-config-prettier":"^2.5.0","eslint-loader":"2.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^6.0.2","eslint-plugin-react":"^7.5.1","husky":"^0.14.3","jest":"^22.1.3","jsdoc-to-markdown":"^3.0.0","lint-staged":"^6.0.0","np":"^2.20.0","postcss-loader":"^3.0.0","prettier":"^1.6.1","react":"^16.1.1","react-docgen":"^2.16.0","react-dom":"^16.1.1","react-test-renderer":"^16.1.1","regenerator-runtime":"^0.12.0","rimraf":"^2.6.1","style-loader":"^0.22.1","webpack":"^3.5.6","yargs":"12.0.1"},"repository":{"type":"git","url":"git+https://github.com/10pearls/react-d3-tree.git"},"keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"author":{"name":"Ben Kremer"},"license":"MIT","bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"homepage":"https://github.com/bkrem/react-d3-tree","gitHead":"fc8f33b52df1b8f2771432e5bdca6377abff8942","_id":"@10pearls/react-d3-tree@1.12.1","_npmVersion":"6.1.0","_nodeVersion":"10.7.0","_npmUser":{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},"dist":{"integrity":"sha512-efCu1dLFuCto4K/4CHJBcSsFv3abRwHxcwo1DoSNyuIftwKKEzr6DLLpDeGJXUD4Zfx+wzshjUUpvQg9KL5DDw==","shasum":"26db8c18c293132f6f668a8db02721e11e6622e6","tarball":"https://registry.npmjs.org/@10pearls/react-d3-tree/-/react-d3-tree-1.12.1.tgz","fileCount":46,"unpackedSize":683631,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJbx0rfCRA9TVsSAnZWagAAIwsP/iYhFTu9mrzG9YQA0DCH\nS5zIVZp8NJJy6trMOX9rMUb/m8XNkDi+Jl1S2sgNz0NkqELckVX57bmk8zqB\nw05JryIxAJi7ibP831vAFvfWsJxmsXdsLAJe7I/tgjrUPeWsAqjcCRTqRhP5\nZdf3cAzJbmGmd5Im3e6SRF30pgbQe/bT0ToWURfmxGpJl3TzZ21EnEyH9zfb\nRSJ2X7CBIPvCe7YKoRfO7sOQDtSxFGHM8Srd9vTat6VkbichRAfkXcRCf1k7\nhFay6np9RLJadBZh+vJEm63FcIuTuuGvNpCyUX32i0cWQCXp7JGgKNlzdW9p\ndQyjyiSKH2pzIvUqqteWzx8Hc8ovmg3u5P21kBaGW/FGgJOEjJAJCgpUgh0s\nsmuKIDsITL/1bLM8KJqYdCdWcLsbd/G8XETF5VDAKyZs8SuWWwrQMOWtuSLy\nQnYLv9aR0GszAVCkMFz0QfLtbrAfsq4MY0QXMlZgiky4080AGC9lgI2qkmR5\nIN/0MKEWvO5m4oVms9HtcxS1xiiaAW1BwA5XLGDYO+Db9RHgqBI3K8SKTU5C\nrITkiYRtYHPb91gS0htSMN4yblt63x3pbs6CxDc/zmZP7WyXhBS8qGgAeU4b\nc4Vncv6hmAqpnl3qdDik7+9laQJp2tetfWY9oBw4vUSOAw3Llg++RAQW4Gmv\nvuyk\r\n=kCIr\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQDBiDtOYejhcsTeA0i3PveJeLm0KPegZx+6efe8c7SZYAIgSNDjVg+DpE2kBP1lgxQSJ0SyK201h9ZhGjkqaiDuss0="}]},"maintainers":[{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},{"name":"mohuk","email":"mohammad.umair.k@gmail.com"},{"name":"shahbazshueb","email":"shahbazshueb@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-d3-tree_1.12.1_1539787486524_0.1758095313027861"},"_hasShrinkwrap":false},"1.13.0":{"name":"@10pearls/react-d3-tree","version":"1.13.0","description":"React component to create interactive D3 tree hierarchies","main":"lib/react-d3-tree.min.js","scripts":{"clean:lib":"rimraf lib/*","precommit":"lint-staged","build":"yarn clean:lib && webpack --progress --colors --env build","dev":"yarn clean:lib && webpack --progress --colors --watch --env dev","lint":"eslint src/**/*.js","test":"yarn lint && jest --coverage --verbose","test:clean":"rimraf ./coverage","test:watch":"jest --watchAll","test:cov":"jest --coverage --verbose","coveralls":"cat ./coverage/lcov.info | coveralls","show:cov":"open coverage/lcov-report/index.html","docs:react":"react-docgen src -e src/**/*.test.js$|scripts/buildDocs.sh","docs":"yarn docs:react","docs:util":"jsdoc2md src/util/index.js > docs/util/util.md","docs:clean":"rimraf docs/components/* && rimraf docs/util/*","release":"yarn test && yarn build && yarn docs && git commit -a","preanalyze":"rimraf stats.json","analyze":"webpack --config webpack.config.js --env build --profile --json > stats.json && echo '==> http://webpack.github.io/analyse/'"},"lint-staged":{"src/**/*.js":["eslint","prettier --write --single-quote --trailing-comma=all --print-width 100","git add"]},"jest":{"collectCoverageFrom":["src/**/*.{js,jsx}","!src/index.js","!src/util/*","!src/**/*.test.{js,jsx}","!playground/*"],"coverageThreshold":{"global":{"statements":94,"branches":84,"functions":90,"lines":94}},"setupTestFrameworkScriptFile":"/jest/setup.js","moduleNameMapper":{".*\\.(css|less|styl|scss|sass)$":"/jest/mocks/cssModule.js",".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"/jest/mocks/image.js"}},"greenkeeper":{"ignore":["d3","react-transition-group","webpack"]},"dependencies":{"clone":"^2.1.1","d3":"3.5.17","deep-equal":"^1.0.1","prop-types":"^15.5.10","react-transition-group":"^1.1.3","uuid":"^3.0.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0"},"devDependencies":{"babel-cli":"6.26.0","babel-core":"6.26.0","babel-eslint":"8.2.6","babel-jest":"^21.2.0","babel-loader":"7.1.2","babel-plugin-add-module-exports":"0.2.1","babel-preset-es2015":"6.24.1","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","coveralls":"^3.0.0","css-loader":"^0.28.1","enzyme":"^3.4.4","enzyme-adapter-react-16":"^1.2.0","eslint":"4.16.0","eslint-config-airbnb":"^16.1.0","eslint-config-prettier":"^2.5.0","eslint-loader":"2.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^6.0.2","eslint-plugin-react":"^7.5.1","husky":"^0.14.3","jest":"^22.1.3","jsdoc-to-markdown":"^3.0.0","lint-staged":"^6.0.0","np":"^2.20.0","postcss-loader":"^3.0.0","prettier":"^1.6.1","react":"^16.1.1","react-docgen":"^2.16.0","react-dom":"^16.1.1","react-test-renderer":"^16.1.1","regenerator-runtime":"^0.12.0","rimraf":"^2.6.1","style-loader":"^0.22.1","webpack":"^3.5.6","yargs":"12.0.1"},"repository":{"type":"git","url":"git+https://github.com/10pearls/react-d3-tree.git"},"keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"author":{"name":"Ben Kremer"},"license":"MIT","bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"homepage":"https://github.com/bkrem/react-d3-tree","gitHead":"218e49d58b7d23235be0ec9648a10d7a6b99cfc6","_id":"@10pearls/react-d3-tree@1.13.0","_npmVersion":"6.1.0","_nodeVersion":"10.7.0","_npmUser":{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},"dist":{"integrity":"sha512-tAj0FgixBjgR9XTUPtm/W8rTT1BVrc1F7bn7yX6dnFaIrvHBAiWlCmPgIMD+kls9U6Rw77Yzk53jzM5pEgxE3Q==","shasum":"c0ac2579a2771fcd4b1eca1602cb40a12d7b1800","tarball":"https://registry.npmjs.org/@10pearls/react-d3-tree/-/react-d3-tree-1.13.0.tgz","fileCount":44,"unpackedSize":493999,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb1u5GCRA9TVsSAnZWagAAjcoP/jC8sEHXTJc2UxwwzYtJ\nyRqKaVW1UKOYpa+XIHVvKaaolxVSLkPUqOxVaq2qvMbLG4vT9iROXhzXCs0y\nOtR+h+SbXM/EWQFRkZuMe0WfliP80xot5IUV8egxzYcd/R/3Zx2C91TbZOMr\nsbKgpnz792dCcStVJeireTaCD0Niv1i945H6XnOfQICj5CEOggAOWgI2FDwJ\nbMHo7M3r1tZDDlJ4+c2CMEH113/CDU1Itag3XnXLWq/p+rQFx6k3h5sabqE0\ng6it1KteTHkhgT/Gy/RhLH2ykUCp9IH/GztNE3+5EEF2kpZy/UpiSL/3ZJX6\nsJMMZ4rmwhbWJgfVukfqZ6hgWNsB6WmT3kZECsRrJhOhSYna1kvH0PnvkMs3\nI7efnhUjjO4YPMI+sxi862vESc5TQfe5exjOHDUp2baWAw7Ts4cYv4RMQ6w5\nPAaAbMTUIX9hDC4B3IP6Y/zWtvPi+LrjYkW6fJssvRvRhL+N+X+hS2mkO/GZ\njGjh0lkQ9IgB+EoFENK88i82EM9s0BjvvpRgk5PdAbt46G5YHVRic+/xCtIP\nnanLQzxn8L558KMYiFmVF9byEkHLHYbI5o+pacXKD03QjwR195wbScUI6Yvk\nM+Wom0GyI3ZxV5iI7Jc++Rc83L6VD4NM0uCrfRdyNQfaZNH/BEw4f7Eyq5+d\n4en5\r\n=MrsM\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEUCIQC3tg/eRPd6kKlfDCmPdDiYl5caQn1cm2DO8iT2s8s46wIgUazBRf8avCbDMSCyM9kv/UWgqvY6g1GgYyXjYgBzlyU="}]},"maintainers":[{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},{"name":"mohuk","email":"mohammad.umair.k@gmail.com"},{"name":"shahbazshueb","email":"shahbazshueb@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-d3-tree_1.13.0_1540812357710_0.4155284744465282"},"_hasShrinkwrap":false},"1.13.1":{"name":"@10pearls/react-d3-tree","version":"1.13.1","description":"React component to create interactive D3 tree hierarchies","main":"lib/react-d3-tree.min.js","scripts":{"clean:lib":"rimraf lib/*","precommit":"lint-staged","build":"yarn clean:lib && webpack --progress --colors --env build","dev":"yarn clean:lib && webpack --progress --colors --watch --env dev","lint":"eslint src/**/*.js","test":"yarn lint && jest --coverage --verbose","test:clean":"rimraf ./coverage","test:watch":"jest --watchAll","test:cov":"jest --coverage --verbose","coveralls":"cat ./coverage/lcov.info | coveralls","show:cov":"open coverage/lcov-report/index.html","docs:react":"react-docgen src -e src/**/*.test.js$|scripts/buildDocs.sh","docs":"yarn docs:react","docs:util":"jsdoc2md src/util/index.js > docs/util/util.md","docs:clean":"rimraf docs/components/* && rimraf docs/util/*","release":"yarn test && yarn build && yarn docs && git commit -a","preanalyze":"rimraf stats.json","analyze":"webpack --config webpack.config.js --env build --profile --json > stats.json && echo '==> http://webpack.github.io/analyse/'"},"lint-staged":{"src/**/*.js":["eslint","prettier --write --single-quote --trailing-comma=all --print-width 100","git add"]},"jest":{"collectCoverageFrom":["src/**/*.{js,jsx}","!src/index.js","!src/util/*","!src/**/*.test.{js,jsx}","!playground/*"],"coverageThreshold":{"global":{"statements":94,"branches":84,"functions":90,"lines":94}},"setupTestFrameworkScriptFile":"/jest/setup.js","moduleNameMapper":{".*\\.(css|less|styl|scss|sass)$":"/jest/mocks/cssModule.js",".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"/jest/mocks/image.js"}},"greenkeeper":{"ignore":["d3","react-transition-group","webpack"]},"dependencies":{"clone":"^2.1.1","d3":"3.5.17","deep-equal":"^1.0.1","prop-types":"^15.5.10","react-transition-group":"^1.1.3","uuid":"^3.0.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0"},"devDependencies":{"babel-cli":"6.26.0","babel-core":"6.26.0","babel-eslint":"8.2.6","babel-jest":"^21.2.0","babel-loader":"7.1.2","babel-plugin-add-module-exports":"0.2.1","babel-preset-es2015":"6.24.1","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","coveralls":"^3.0.0","css-loader":"^0.28.1","enzyme":"^3.4.4","enzyme-adapter-react-16":"^1.2.0","eslint":"4.16.0","eslint-config-airbnb":"^16.1.0","eslint-config-prettier":"^2.5.0","eslint-loader":"2.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^6.0.2","eslint-plugin-react":"^7.5.1","husky":"^0.14.3","jest":"^22.1.3","jsdoc-to-markdown":"^3.0.0","lint-staged":"^6.0.0","np":"^2.20.0","postcss-loader":"^3.0.0","prettier":"^1.6.1","react":"^16.1.1","react-docgen":"^2.16.0","react-dom":"^16.1.1","react-test-renderer":"^16.1.1","regenerator-runtime":"^0.12.0","rimraf":"^2.6.1","style-loader":"^0.22.1","webpack":"^3.5.6","yargs":"12.0.1"},"repository":{"type":"git","url":"git+https://github.com/10pearls/react-d3-tree.git"},"keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"author":{"name":"Ben Kremer"},"license":"MIT","bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"homepage":"https://github.com/bkrem/react-d3-tree","gitHead":"d453f2843465777122a91c848710b852d9d1e768","_id":"@10pearls/react-d3-tree@1.13.1","_npmVersion":"6.4.1","_nodeVersion":"10.11.0","_npmUser":{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},"dist":{"integrity":"sha512-iN8wN9Ep44WPoNWVI8prk0IhX/lZtyLzOH2lSs4Cj8wNz1A3tdue/gGaYrbPwZeq4miYHJkNDygJVb7u4WF1og==","shasum":"430bc9e1854ea95f045d2578e8f9c6ff6ec36767","tarball":"https://registry.npmjs.org/@10pearls/react-d3-tree/-/react-d3-tree-1.13.1.tgz","fileCount":44,"unpackedSize":494138,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJb5EzgCRA9TVsSAnZWagAAg4kP/3551X+cQZbX7LSJ3vrN\nyN2mCdqdPn5z6NKQKY0TpQC4RtVn8wMYdnAfxve1GMKGeXcJvzRrt1VIm464\nBJBqrFXPZ0RMZUh+W8Bn6/2ZQA2ZMj0Vx8gTioQ6zqt8hO8vIv0XrgsQ1xo/\nUud87qZUHFJKcYrfImBKbh0hvEm0w3lz58CKOUSpdYkykiUwCDx4JsVThSM4\n2TMFbinP539SDtIEuOYua3TC5hUD9q4KDm1SGgyBcLF6Cm/iyHOqX/kIwu5E\ndKluF3+Z/5GHHZjhU0jq0id9y/gyA58sfdBdZ229CKWzFnI3YEQU81B9KLc2\nfSuWq5AXCDaMZXaKq8fWLc5EsbVGNEX/DplB0daMZQMI9/zkJwTTKXqnCdq0\nbIVjehw6F2dbXKExm7G+a2GCvaOtwd/zlh9IeR4h7UHxIK+LKzgTHLNnv9PY\n4LnODZwgxH3w8OzSlLsMxG01DxXf2NJ57c0EzKvbtDX3EhPw61/pV/H+4JXI\nA3Xx6Czxm39fbgjFTI3ehErEXiLWNUdOZaO1vejmNqay5X+ml4kX/pRGXn7o\ndP1kPqrYO29W1iIUkAI/cyGsZ8RXN2VMbMZPuGQZ5x2jdKD0QjSmj9nTRlkI\nuS0nALWEV0Vr0ItbFjQBxDzyq7wXmY03VISaHRKwUDfSgn9UKhAQq7saIK+r\ns2Tf\r\n=5HVH\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEYCIQDPnxFKuv26s+tx3DH0gIQPXeXx96II6If63h5AP9Zw3QIhAOc/lmAADFnmFF2a30qPXmXqvVQc4pdhTxN3MkqiZvm1"}]},"maintainers":[{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},{"name":"mohuk","email":"mohammad.umair.k@gmail.com"},{"name":"shahbazshueb","email":"shahbazshueb@gmail.com"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-d3-tree_1.13.1_1541688543911_0.7701959691597156"},"_hasShrinkwrap":false},"1.13.2":{"name":"@10pearls/react-d3-tree","version":"1.13.2","description":"React component to create interactive D3 tree hierarchies","main":"lib/react-d3-tree.min.js","scripts":{"clean:lib":"rimraf lib/*","precommit":"lint-staged","build":"yarn clean:lib && webpack --progress --colors --env build","dev":"yarn clean:lib && webpack --progress --colors --watch --env dev","lint":"eslint src/**/*.js","test":"yarn lint && jest --coverage --verbose","test:clean":"rimraf ./coverage","test:watch":"jest --watchAll","test:cov":"jest --coverage --verbose","coveralls":"cat ./coverage/lcov.info | coveralls","show:cov":"open coverage/lcov-report/index.html","docs:react":"react-docgen src -e src/**/*.test.js$|scripts/buildDocs.sh","docs":"yarn docs:react","docs:util":"jsdoc2md src/util/index.js > docs/util/util.md","docs:clean":"rimraf docs/components/* && rimraf docs/util/*","release":"yarn test && yarn build && yarn docs && git commit -a","preanalyze":"rimraf stats.json","analyze":"webpack --config webpack.config.js --env build --profile --json > stats.json && echo '==> http://webpack.github.io/analyse/'"},"lint-staged":{"src/**/*.js":["eslint","prettier --write --single-quote --trailing-comma=all --print-width 100","git add"]},"jest":{"collectCoverageFrom":["src/**/*.{js,jsx}","!src/index.js","!src/util/*","!src/**/*.test.{js,jsx}","!playground/*"],"coverageThreshold":{"global":{"statements":94,"branches":84,"functions":90,"lines":94}},"setupTestFrameworkScriptFile":"/jest/setup.js","moduleNameMapper":{".*\\.(css|less|styl|scss|sass)$":"/jest/mocks/cssModule.js",".*\\.(jpg|jpeg|png|gif|eot|otf|webp|svg|ttf|woff|woff2|mp4|webm|wav|mp3|m4a|aac|oga)$":"/jest/mocks/image.js"}},"greenkeeper":{"ignore":["d3","react-transition-group","webpack"]},"dependencies":{"clone":"^2.1.1","d3":"3.5.17","deep-equal":"^1.0.1","prop-types":"^15.5.10","react-transition-group":"^1.1.3","uuid":"^3.0.1"},"peerDependencies":{"react":"^15.0.0 || ^16.0.0"},"devDependencies":{"babel-cli":"6.26.0","babel-core":"6.26.0","babel-eslint":"8.2.6","babel-jest":"^21.2.0","babel-loader":"7.1.2","babel-plugin-add-module-exports":"0.2.1","babel-preset-es2015":"6.24.1","babel-preset-react":"^6.5.0","babel-preset-stage-0":"^6.5.0","coveralls":"^3.0.0","css-loader":"^0.28.1","enzyme":"^3.4.4","enzyme-adapter-react-16":"^1.2.0","eslint":"4.16.0","eslint-config-airbnb":"^16.1.0","eslint-config-prettier":"^2.5.0","eslint-loader":"2.1.0","eslint-plugin-import":"^2.2.0","eslint-plugin-jsx-a11y":"^6.0.2","eslint-plugin-react":"^7.5.1","husky":"^0.14.3","jest":"^22.1.3","jsdoc-to-markdown":"^3.0.0","lint-staged":"^6.0.0","np":"^2.20.0","postcss-loader":"^3.0.0","prettier":"^1.6.1","react":"^16.1.1","react-docgen":"^2.16.0","react-dom":"^16.1.1","react-test-renderer":"^16.1.1","regenerator-runtime":"^0.12.0","rimraf":"^2.6.1","style-loader":"^0.22.1","webpack":"^3.5.6","yargs":"12.0.1"},"repository":{"type":"git","url":"git+https://github.com/10pearls/react-d3-tree.git"},"keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"author":{"name":"Ben Kremer"},"license":"MIT","bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"homepage":"https://github.com/bkrem/react-d3-tree","gitHead":"9ab84c8fc8b0cd0b1dec42f5e54479bc38b679b2","_id":"@10pearls/react-d3-tree@1.13.2","_npmVersion":"6.4.1","_nodeVersion":"10.14.0","_npmUser":{"name":"mohammedsiddiqui","email":"mohammed.siddiqui.353@gmail.com"},"dist":{"integrity":"sha512-JL9BuBwWxtUKxoYcsG6R51oAVP5bl+eislp3Ykf5Qs4Qfa6vnCBhKhYub8HMRuTgielLFqS9+ZwnqRUYHJ/OTQ==","shasum":"ac282f312742ae9446df01363b13b4aa7ce42d70","tarball":"https://registry.npmjs.org/@10pearls/react-d3-tree/-/react-d3-tree-1.13.2.tgz","fileCount":44,"unpackedSize":494282,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v3.0.4\r\nComment: https://openpgpjs.org\r\n\r\nwsFcBAEBCAAQBQJcGiyRCRA9TVsSAnZWagAAecsP+gLf8XFB+xM0W2B2t+kK\nx1F5XiCXxFMhHgg2FqbtbdKpZHr/12xxnjHGHyTOOX4/S75/XQ7b6JpbWP7z\njhd6q2QsqMvSnD6mIM+beeQKvK9KUjMwp6ILvpkpudvMr0Rhb6AdlOK3iy/2\n2VUZsXc7YjxDSiv7VLN6/4mnaFqAhQcMI1OB5R5rvvNz2DHbDXX/7wB+Bekn\nMc6TnLTR3YMP06V/wtIV+llW6seNGTVWgozPZAd2rg/VM2top3oWQqRtAmjg\n+5SXrztNtOYb0DxHRKZGfVAM813hRfa4RYMFOgt03eJ6Bbu4UHPIxda9bgNm\nxPHVLW6orAtnIMLrlzq84xncrzx7s7QdPvUWc5w92mOzwjox8+aqu70dyXUm\ny7QJIwuuaucplAL1ADQYThHKo+ZPEr557WOdRyP+zcxiJ3QnzYjtSmwESPT+\nGUU+r5NMjB7j0DPSi6fjMndEd1rs52uGEC0Kre/3yHSAV/g8wcAoDwwKCem0\n2ZDo5hA43w+TEo1Ap133rrhDNySM7ayAyT6dKPC1nXzuBDj9kgd5vWnHIqB0\naie0Tv+MZ6MdmbDbls2G1IJ4kvaa6vG/EvAxTMqXfLpDQJ9D3jrfHNjl83Zg\nd0Q8p3cwXQbmpHPdUUEZV/C34+FX9wGM8SrrshybSQbcfu1yklhUPL2k2Lkd\nhnbU\r\n=uGey\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIF9ysHmNvdd0SlGZ005cnAYqRN6U4fEvQjvuouUZZfwJAiBztBMWdE+QQX26F0AKraRInrG35SyDrb8fGLAz5y3y3g=="}]},"maintainers":[{"email":"asjadsaboor@gmail.com","name":"asjadsaboor"},{"email":"hussain94aa@gmail.com","name":"hussainaliakbar"},{"email":"mohammed.siddiqui.353@gmail.com","name":"mohammedsiddiqui"},{"email":"mohammad.umair.k@gmail.com","name":"mohuk"},{"email":"shahbazshueb@gmail.com","name":"shahbazshueb"}],"directories":{},"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/react-d3-tree_1.13.2_1545219216289_0.7995211085512739"},"_hasShrinkwrap":false}},"time":{"created":"2018-10-17T14:39:20.255Z","1.12.0":"2018-10-17T14:39:20.921Z","modified":"2022-04-04T10:30:22.839Z","1.12.1":"2018-10-17T14:44:46.724Z","1.13.0":"2018-10-29T11:25:57.905Z","1.13.1":"2018-11-08T14:49:04.076Z","1.13.2":"2018-12-19T11:33:36.559Z"},"maintainers":[{"email":"nms@10pearls.com","name":"itteam"},{"email":"asadurrehman@10pearls.com","name":"asadurrehman10p"}],"description":"React component to create interactive D3 tree hierarchies","homepage":"https://github.com/bkrem/react-d3-tree","keywords":["react","d3","tree","component","graph","svg","hierarchical-data","hierarchy","d3-visualization","chart"],"repository":{"type":"git","url":"git+https://github.com/10pearls/react-d3-tree.git"},"author":{"name":"Ben Kremer"},"bugs":{"url":"https://github.com/bkrem/react-d3-tree/issues"},"license":"MIT","readme":"# React D3 Tree\n\n[![Greenkeeper badge](https://badges.greenkeeper.io/bkrem/react-d3-tree.svg)](https://greenkeeper.io/)\n[![Build Status](https://travis-ci.org/bkrem/react-d3-tree.svg?branch=master)](https://travis-ci.org/bkrem/react-d3-tree)\n[![Coverage Status](https://coveralls.io/repos/github/bkrem/react-d3-tree/badge.svg?branch=master)](https://coveralls.io/github/bkrem/react-d3-tree?branch=master)\n[![Codacy Badge](https://api.codacy.com/project/badge/Grade/f9ed4796ee9c448dbcd80af2954cc0d1)](https://www.codacy.com/app/ben.kremer/react-d3-tree?utm_source=github.com&utm_medium=referral&utm_content=bkrem/react-d3-tree&utm_campaign=Badge_Grade)\n[![npm version](https://badge.fury.io/js/react-d3-tree.svg)](https://badge.fury.io/js/react-d3-tree)\n[![npm](https://img.shields.io/npm/dm/react-d3-tree.svg)](https://www.npmjs.com/package/react-d3-tree)\n\nReact D3 Tree is a [React](http://facebook.github.io/react/) component that lets you represent hierarchical data (e.g. ancestor trees, organisational structure, package dependencies) as an animated & interactive tree graph by leveraging [D3](https://d3js.org/)'s `tree` layout.\n\n\n## Contents\n- [Demo](#demo)\n- [Installation](#installation)\n- [Usage](#usage)\n- [Props](#props)\n- [Node shapes](#node-shapes)\n- [Styling](#styling)\n- [External data sources](#external-data-sources)\n- [Using foreignObjects](#using-foreignobjects)\n - [`nodeLabelComponent`](#nodelabelcomponent)\n- [Recipes](#recipes)\n\n\n## Demo\n- Current release: https://bkrem.github.io/react-d3-tree-demo/\n\n\n## Installation\n```bash\nyarn add react-d3-tree\n# or\nnpm i --save react-d3-tree\n```\n\n\n## Usage\n```jsx\nimport React from 'react';\nimport Tree from 'react-d3-tree';\n\nconst myTreeData = [\n {\n name: 'Top Level',\n attributes: {\n keyA: 'val A',\n keyB: 'val B',\n keyC: 'val C',\n },\n children: [\n {\n name: 'Level 2: A',\n attributes: {\n keyA: 'val A',\n keyB: 'val B',\n keyC: 'val C',\n },\n },\n {\n name: 'Level 2: B',\n },\n ],\n },\n];\n\nclass MyComponent extends React.Component {\n render() {\n return (\n      {/* will fill width/height of its container; in this case `#treeWrapper` */}\n
\n\n \n\n
\n );\n }\n}\n```\n\n\n## Props\n| Property | Type | Options | Required? | Default | Description |\n|:------------------------------|:-----------------------|:------------------------------------------------------------------------------|:----------|:--------------------------------------------------------------|:------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|\n| `data` | `array` | | required | `undefined` | Single-element array containing hierarchical object (see `myTreeData` above).
Contains (at least) `name` and `parent` keys. |\n| `nodeSvgShape` | `object` | see [Node shapes](#node-shapes) | | `{shape: 'circle', shapeProps: r: 10}` | Sets a specific SVG shape element + shapeProps to be used for each node. |\n| `nodeLabelComponent` | `object` | see [Using foreignObjects](#using-foreignobjects) | | `null` | Allows using a React component as a node label; requires `allowForeignObjects` to be set. |\n| `onClick` | `func` | | | `undefined` | Callback function to be called when a node is clicked.

Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |\n| `onMouseOver` | `func` | | | `undefined` | Callback function to be called when mouse enters the space belonging to a node.

Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |\n| `onMouseOut` | `func` | | | `undefined` | Callback function to be called when mouse leaves the space belonging to a node.

Has the function signature `(nodeData, evt)`. The clicked node's data object is passed as first parameter, event object as second. |\n| `onUpdate` | `func` | | | `undefined` | Callback function to be called when the inner D3 component updates. That is - on every zoom or translate event, or when tree branches are toggled. The node's data object, as well as zoom level and coordinates are passed to the callback. |\n| `orientation` | `string` (enum) | `horizontal` `vertical` | | `horizontal` | `horizontal` - Tree expands left-to-right.

`vertical` - Tree expands top-to-bottom. |\n| `translate` | `object` | | | `{x: 0, y: 0}` | Translates the graph along the x/y axis by the specified amount of pixels (avoids the graph being stuck in the top left canvas corner). |\n| `pathFunc` | `string (enum)`/`func` | `diagonal`
`elbow`
`straight`
`customFunc(linkData, orientation)` | | `diagonal` | `diagonal` - Smooth, curved edges between parent-child nodes.

`elbow` - Sharp edges at right angles between parent-child nodes.

`straight` - Straight lines between parent-child nodes.

`customFunc` - Custom draw function that accepts `linkData` as its first param and `orientation` as its second. |\n| `collapsible` | `bool` | | | `true` | Toggles ability to collapse/expand the tree's nodes by clicking them. |\n| `shouldCollapseNeighborNodes` | `bool` | | | `false` | If a node is currently being expanded, all other nodes at the same depth will be collapsed. |\n| `initialDepth` | `number` | `0..n` | | `undefined` | Sets the maximum node depth to which the tree is expanded on its initial render.
Tree renders to full depth if prop is omitted. |\n| `depthFactor` | `number` | `-n..0..n` | | `undefined` | Ensures the tree takes up a fixed amount of space (`node.y = node.depth * depthFactor`), regardless of tree depth.
**TIP**: Negative values invert the tree's direction. |\n| `zoomable` | `bool` | | | `true` | Toggles ability to zoom in/out on the Tree by scaling it according to `props.scaleExtent`. |\n| `zoom` | `number` | `0..n` | | `1` | A floating point number to set the initial zoom level. It is constrained by `props.scaleExtent`. `1` is the default \"non-zoomed\" level. |\n| `scaleExtent` | `object` | `{min: 0..n, max: 0..n}` | | `{min: 0.1, max: 1}` | Sets the minimum/maximum extent to which the tree can be scaled if `props.zoomable` is true. |\n| `nodeSize` | `object` | `{x: 0..n, y: 0..n}` | | `{x: 140, y: 140}` | Sets a fixed size for each node.

This does not affect node circle sizes, circle sizes are handled by the `circleRadius` prop. |\n| `separation` | `object` | `{siblings: 0..n, nonSiblings: 0..n}` | | `{siblings: 1, nonSiblings: 2}` | Sets separation between neighbouring nodes, differentiating between siblings (same parent) and non-siblings. |\n| `transitionDuration` | `number` | `0..n` | | `500` | Sets the animation duration (in ms) of each expansion/collapse of a tree node.

Set this to `0` to deactivate animations completely. |\n| `textLayout` | `object` | `{textAnchor: enum, x: -n..0..n, y: -n..0..n, transform: string}` | | `{textAnchor: \"start\", x: 10, y: -10, transform: undefined }` | Configures the positioning of each node's text (name & attributes) relative to the node itself.

`textAnchor` enums mirror the [`text-anchor` spec](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/text-anchor).

`x` & `y` accept integers denoting `px` values.

`transform` mirrors the [svg `transform` spec](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/transform). |\n| `styles` | `object` | see [Styling](#styling) | | `Node`/`Link` CSS files | Overrides and/or enhances the tree's default styling. |\n| `allowForeignObjects` | `bool` | see [Using foreignObjects](#using-foreignobjects) | | `false` | Allows use of partially supported `` elements. |\n| `circleRadius` (legacy) | `number` | `0..n` | | `undefined` | Sets the radius of each node's `` element.

**Will be deprecated in v2, please use `nodeSvgShape` instead.** |\n\n\n## Node shapes\nThe `nodeSvgShape` prop allows specifying any [SVG shape primitive](https://developer.mozilla.org/en-US/docs/Web/SVG/Tutorial/Basic_Shapes) to describe how the tree's nodes should be shaped.\n\n> Note: `nodeSvgShape` and `circleRadius` are mutually exclusive props. `nodeSvgShape` will be used unless the legacy `circleRadius` is specified.\n\nFor example, assuming we want to use squares instead of the default circles, we can do:\n```js\nconst svgSquare = {\n shape: 'rect',\n shapeProps: {\n width: 20,\n height: 20,\n x: -10,\n y: -10,\n }\n}\n\n// ...\n\n\n```\n\nTo avoid rendering any node element, simply set `nodeSvgShape` to `{ shape: 'none' }`.\n\n### Overridable `shapeProps`\n `shapeProps` is currently merged with `node.circle`/`leafNode.circle` (see [Styling](#styling)). \n\n This means any properties passed in `shapeProps` will be overridden by **properties with the same key** in the `node.circle`/`leafNode.circle` style props. \nThis is to prevent breaking the legacy usage of `circleRadius` + styling via `node/leafNode` properties until it is deprecated fully in v2. \n\n**From v1.5.x onwards, it is therefore recommended to pass all node styling properties through `shapeProps`**.\n\n\n### Individual `shapeProps`\n`shapeProps` can be passed to a node individually by adding the `nodeSvgShape` property to the relevant node's data set. This allows setting each node's style, shape and size independently of the tree's overall `shapeProps` configuration (see [Styling](#styling)).\n\nThe usage example above can be extended to include individual `shapeProps`:\n```jsx\nimport React from 'react';\nimport Tree from 'react-d3-tree';\n\nconst myTreeData = [\n {\n name: 'Parent Node',\n attributes: {\n keyA: 'val A',\n keyB: 'val B',\n keyC: 'val C',\n },\n nodeSvgShape: {\n shapeProps: {\n fill: 'blue',\n },\n },\n children: [\n {\n name: 'Inner Node',\n attributes: {\n keyA: 'val A',\n keyB: 'val B',\n keyC: 'val C',\n },\n nodeSvgShape: {\n shape: 'rect',\n shapeProps: {\n width: 20,\n height: 20,\n x: -10,\n y: -10,\n fill: 'red',\n },\n },\n },\n {\n name: 'Level 2: B',\n },\n ],\n },\n];\n\n...\n\n```\nIn the above, \"Parent Node\" will only be blue, but it will keep the default size and geometrical shape. \"Inner Node\", however, will completely change to a red rectangle with the given dimensions. Omitting `shape`, will keep node's default appearance.\n\n## Styling\nThe tree's `styles` prop may be used to override any of the tree's default styling.\nThe following object shape is expected by `styles`:\n```js\n{\n links: ,\n nodes: {\n node: {\n circle: ,\n name: ,\n attributes: ,\n },\n leafNode: {\n circle: ,\n name: ,\n attributes: ,\n },\n },\n}\n```\nwhere `` is any object containing CSS-like properties that are compatible with an `` element's `style` attribute, for example:\n```js\n{\n stroke: 'blue',\n strokeWidth: 3,\n}\n```\n\nFor more information on the SVG `style` attribute, [check this out](https://developer.mozilla.org/en-US/docs/Web/SVG/Attribute/style).\n\n\n## External data sources\nStatically hosted JSON or CSV files can be used as data sources via the additional `treeUtil` module.\n\n### Example\n\n```jsx\nimport React from 'react';\nimport { Tree, treeUtil } from 'react-d3-tree';\n\nconst csvSource = 'https://raw.githubusercontent.com/bkrem/react-d3-tree/master/docs/examples/data/csv-example.csv';\n\nconstructor() {\n super();\n\n this.state = {\n data: undefined,\n };\n}\n\ncomponentWillMount() {\n treeUtil.parseCSV(csvSource)\n .then((data) => {\n this.setState({ data })\n })\n .catch((err) => console.error(err));\n}\n\nclass MyComponent extends React.Component {\n render() {\n return (\n      {/* will fill width/height of its container; in this case `#treeWrapper` */}\n
\n\n \n\n
\n );\n }\n}\n```\n\nFor details regarding the `treeUtil` module, please check the module's [API docs](docs/util/util.md). \nFor examples of each data type that can be parsed with `treeUtil`, please check the [data source examples](docs/examples/data).\n\n\n## Using foreignObjects\n> ⚠️ Requires `allowForeignObjects` prop to be set due to limited browser support: [IE does not currently support `foreignObject` elements](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/foreignObject#Browser_compatibility).\n\nThe SVG spec's `foreignObject` element allows foreign XML content to be rendered into the SVG namespace, unlocking the ability to use regular React components for elements of the tree graph.\n\n### `nodeLabelComponent`\nThe `nodeLabelComponent` prop provides a way to use a React component for each node's label. It accepts an object with the following signature:\n```ts\n{\n render: ReactElement,\n foreignObjectWrapper?: object\n}\n```\n* `render` is the XML React-D3-Tree will use to render each node's label.\n* `foreignObjectWrapper` contains a set of attributes that should be passed to the `` that wraps `nodeLabelComponent`. For possible attributes please check the [spec](https://developer.mozilla.org/en-US/docs/Web/SVG/Element/foreignObject#Global_attributes).\n\n**Note: By default, `foreignObjectWrapper` will set its width and height attributes to `nodeSize.x - 24px` and `nodeSize.y - 24px` respectively; where a base margin of 24px is subtracted to avoid the overlapping of elements.** \nTo override this behaviour for each attribute, specify `width` and/or `height` properties for your `foreignObjectWrapper`.\n\n**Note:** The ReactElement passed to `render` is cloned with its existing props and **receives an additional `nodeData` object prop, containing information about the current node.**\n\n#### Example\nAssuming we have a React component `NodeLabel` and we want to avoid node's label overlapping with the node itself by moving its position along the Y-axis, we could implement `nodeLabelComponent` like so:\n```jsx\nclass NodeLabel extends React.PureComponent {\n render() {\n const {className, nodeData} = this.props\n return (\n
\n

{nodeData.name}

\n {nodeData._children && \n \n }\n
\n )\n }\n}\n\n/* ... */\n\nrender() {\n return (\n ,\n foreignObjectWrapper: {\n y: 24\n }\n }}\n />\n )\n}\n```\n\n\n\n## Recipes\n* [Auto-centering inside `treeContainer`](https://codesandbox.io/s/vvz51w5n63)\n","readmeFilename":"README.md"}