[ { "path": ".babelrc", "content": "{\n \"presets\": [\n [\"latest\", {\n \"es2015\": { \"modules\": false }\n }],\n \"stage-2\"\n ],\n \"plugins\": [[\"transform-object-assign\"],[\n \"transform-runtime\",\n {\n \"helpers\": false,\n \"polyfill\": false,\n \"regenerator\": true,\n \"moduleName\": \"babel-runtime\"\n }\n ]]\n}\n" }, { "path": ".editorconfig", "content": "root = true\n\n[*]\ncharset = utf-8\nindent_style = space\nindent_size = 2\nend_of_line = lf\ninsert_final_newline = true\ntrim_trailing_whitespace = true\n" }, { "path": ".eslintignore", "content": "webpack.config.js\n/src/lib/orgchart.js\n/src/main.js\n/src/index.js\n/dist\n/examples\n/build\n/docs\n" }, { "path": ".eslintrc.js", "content": "// http://eslint.org/docs/user-guide/configuring\n\nmodule.exports = {\n root: true,\n parser: 'babel-eslint',\n parserOptions: {\n sourceType: 'module'\n },\n env: {\n browser: true,\n },\n extends: 'standard',\n plugins: [\n 'html'\n ],\n rules: {\n 'no-mixed-operators': 'off'\n }\n}\n" }, { "path": ".gitignore", "content": ".DS_Store\nnode_modules/\nnpm-debug.log\nyarn-error.log\n\n# Editor directories and files\n.idea\n*.suo\n*.ntvs*\n*.njsproj\n*.sln\n" }, { "path": ".travis.yml", "content": "sudo: false\nlanguage: node_js\nnode_js: stable\n" }, { "path": "LICENSE", "content": "The MIT License (MIT)\n\nCopyright (c) 2017-present, spiritree\n\nPermission is hereby granted, free of charge, to any person obtaining a copy\nof this software and associated documentation files (the \"Software\"), to deal\nin the Software without restriction, including without limitation the rights\nto use, copy, modify, merge, publish, distribute, sublicense, and/or sell\ncopies of the Software, and to permit persons to whom the Software is\nfurnished to do so, subject to the following conditions:\n\nThe above copyright notice and this permission notice shall be included in\nall copies or substantial portions of the Software.\n\nTHE SOFTWARE IS PROVIDED \"AS IS\", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR\nIMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,\nFITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE\nAUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER\nLIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,\nOUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN\nTHE SOFTWARE.\n" }, { "path": "README.md", "content": "

\n \n \"vue-orgchart\n \n

\n\n

\nA Vue wrapper for OrgChart.js.\n

\n\n

\n\"Travis\n\"npm\"\n\n

\n\n## Intro\n\n- First of all, thanks a lot for dabeng's great work -- [OrgChart.js](https://github.com/dabeng/OrgChart.js)\n- If you prefer the Vue.js Wrapper for Orgchart.js,you could try [my project](https://github.com/spiritree/vue-orgchart)\n\n## Links\n\n- [Documentation](https://spiritree.github.io/vue-orgchart)\n\n### Feature\n\n- Support import and export JSON\n- Supports exporting chart as a picture\n- draggable Orgchart\n- Editable Orgchart\n\n...\n## Install\n```shell\nnpm install vue-orgchart -S\n```\n## Quick Start\n\n> In `main.js`\n\n`import 'vue-orgchart/dist/style.min.css'`\n\n> In `*.vue`\n\n```javascript\n\n\n\n```\n## Development\n\n``` bash\n# install dependencies\nnpm install\n\n# serve with hot reload at localhost:8999\nnpm run dev\n\n# unit test\nnpm run test\n\n# build by rollup\nnpm run rollup\n```\n\n## License\n\nMIT\n" }, { "path": "build/rollup.config.js", "content": "const rollup = require('rollup')\nconst vue = require('rollup-plugin-vue')\nconst resolve = require('rollup-plugin-node-resolve')\nconst babel = require('rollup-plugin-babel')\nconst uglify = require('rollup-plugin-uglify')\nconst autoprefixer = require('autoprefixer')\nconst cssnano = require('cssnano')\n\nconst outputOptions = [\n {\n min: true,\n format: 'umd',\n name: 'vue-orgchart',\n file: 'dist/vue-orgchart.min.js'\n },\n {\n min: false,\n format: 'umd',\n name: 'vue-orgchart',\n file: 'dist/vue-orgchart.js'\n },\n {\n min: true,\n format: 'cjs',\n name: 'vue-orgchart',\n file: 'dist/vue-orgchart.common.min.js'\n },\n {\n min: false,\n format: 'cjs',\n name: 'vue-orgchart',\n file: 'dist/vue-orgchart.common.js'\n },\n {\n min: false,\n format: 'es',\n name: 'vue-orgchart',\n file: 'dist/vue-orgchart.esm.js'\n }\n]\n\nasync function build(item) {\n const vueSettings = item.min\n ? { css: 'dist/style.min.css', postcss: [autoprefixer, cssnano] }\n : { css: 'dist/style.css', postcss: [autoprefixer] }\n\n const inputOptions = {\n input: 'src/index.js',\n plugins: [\n vue(vueSettings),\n resolve({\n extensions: ['.js', '.vue']\n }),\n babel({\n exclude: 'node_modules/**',\n plugins: ['external-helpers']\n })\n ]\n }\n if (item.min) inputOptions.plugins.push(uglify())\n\n const bundle = await rollup.rollup(inputOptions)\n await bundle.write(item)\n}\n\noutputOptions.forEach(item => {\n build(item)\n .then(() => item.min\n ? console.log(`rollup: ${item.name}.${item.format}.min built successfully`)\n : console.log(`rollup: ${item.name}.${item.format} built successfully`))\n .catch(err => console.error(err))\n})\n" }, { "path": "build/webpack.config.js", "content": "const path = require('path')\nconst webpack = require('webpack')\nconst HtmlWebpackPlugin = require('html-webpack-plugin')\nconst opn = require('opn')\n\nopn('http://localhost:8999')\n\nfunction resolve (dir) {\n return path.join(__dirname, '..', dir)\n}\n\nmodule.exports = {\n entry: './examples/main.js',\n output: {\n path: path.resolve(__dirname, '../dist'),\n publicPath: '/',\n filename: 'build.js'\n },\n module: {\n rules: [\n {\n test: /\\.css$/,\n use: [\n 'vue-style-loader',\n 'css-loader'\n ],\n },\n {\n test: /\\.vue$/,\n loader: 'vue-loader',\n options: {\n loaders: {\n }\n // other vue-loader options go here\n }\n },\n {\n test: /\\.js$/,\n loader: 'babel-loader',\n exclude: /node_modules/\n },\n {\n test: /\\.(png|jpg|gif|svg)$/,\n loader: 'file-loader',\n options: {\n name: '[name].[ext]?[hash]'\n }\n }\n ]\n },\n resolve: {\n alias: {\n 'vue$': 'vue/dist/vue.esm.js'\n },\n extensions: ['*', '.js', '.vue', '.json']\n },\n devServer: {\n port: '8999',\n hot: true,\n contentBase: path.join(__dirname, 'dist'),\n stats: 'errors-only'\n },\n performance: {\n hints: false\n },\n devtool: '#eval-source-map',\n plugins: [\n new webpack.DefinePlugin({\n 'process.env': {\n NODE_ENV: '\"development\"'\n }\n }),\n new webpack.HotModuleReplacementPlugin(),\n new HtmlWebpackPlugin({\n filename: 'index.html',\n template: './examples/index.html',\n inject: true\n })\n ]\n}\n" }, { "path": "dist/style.css", "content": "\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n#wrapper {\n width: 50%;\n margin: 0 auto;\n}\n\n#wrapper li {\n margin-top: 20px;\n}\n\n#wrapper a {\n font-size: 24px;\n}\n\n#wrapper span {\n font-size: 24px;\n}\n\n#chart-container {\n position: relative;\n display: inline-block;\n top: 10px;\n left: 10px;\n height: 50%;\n width: calc(100% - 24px);\n border-radius: 5px;\n overflow: auto;\n overflow-x: hidden;\n text-align: center;\n font-family: \"Source Sans Pro\", \"Helvetica Neue\", Arial, sans-serif;\n font-size: 14px;\n}\n.orgchart {\n display: inline-block;\n min-height: 100%;\n min-width: 100%;\n -webkit-touch-callout: none;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-size: 10px 10px;\n border: 1px dashed transparent;\n}\n\n.orgchart .hidden, .orgchart~.hidden {\n display: none;\n}\n\n.orgchart div,\n.orgchart div::before,\n.orgchart div::after {\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n.orgchart.b2t {\n -webkit-transform: rotate(180deg);\n transform: rotate(180deg);\n}\n\n.orgchart.l2r {\n -webkit-transform: rotate(-90deg) rotateY(180deg);\n transform: rotate(-90deg) rotateY(180deg);\n}\n\n.orgchart .verticalNodes ul {\n list-style: none;\n margin: 0;\n padding-left: 18px;\n text-align: left;\n}\n\n.orgchart .verticalNodes ul:first-child {\n margin-top: 3px;\n}\n\n.orgchart .verticalNodes>td::before {\n content: '';\n border: 1px solid rgba(217, 83, 79, 0.8);\n}\n\n.orgchart .verticalNodes>td>ul>li:first-child::before {\n top: -4px;\n height: 30px;\n width: calc(50% - 2px);\n border-width: 2px 0 0 2px;\n}\n\n.orgchart .verticalNodes ul>li {\n position: relative;\n}\n\n.orgchart .verticalNodes ul>li::before,\n.orgchart .verticalNodes ul>li::after {\n content: '';\n position: absolute;\n left: -6px;\n border-color: rgba(217, 83, 79, 0.8);\n border-style: solid;\n border-width: 0 0 2px 2px;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n}\n\n.orgchart .verticalNodes ul>li::before {\n top: -4px;\n height: 30px;\n width: 11px;\n}\n\n.orgchart .verticalNodes ul>li::after {\n top: 1px;\n height: 100%;\n}\n\n.orgchart .verticalNodes ul>li:first-child::after {\n top: 24px;\n width: 11px;\n border-width: 2px 0 0 2px;\n}\n\n.orgchart .verticalNodes ul>li:last-child::after {\n border-width: 2px 0 0;\n}\n\n.orgchart.r2l {\n -webkit-transform: rotate(90deg);\n transform: rotate(90deg);\n}\n\n.orgchart>.spinner {\n font-size: 100px;\n margin-top: 30px;\n color: rgba(68, 157, 68, 0.8);\n}\n\n.orgchart table {\n border-spacing: 0;\n border-collapse: separate;\n}\n\n.orgchart>table:first-child{\n margin: 20px auto;\n}\n\n.orgchart td {\n text-align: center;\n vertical-align: top;\n padding: 0;\n}\n\n.orgchart tr.lines .topLine {\n border-top: 2px solid #616161;\n}\n\n.orgchart tr.lines .rightLine {\n border-right: 1px solid #616161;\n float: none;\n border-radius: 0;\n}\n\n.orgchart tr.lines .leftLine {\n border-left: 1px solid #616161;\n float: none;\n border-radius: 0;\n}\n\n.orgchart tr.lines .downLine {\n background-color: #616161;\n margin: 0 auto;\n height: 20px;\n width: 2px;\n float: none;\n}\n\n/* node styling */\n.orgchart .node {\n display: inline-block;\n position: relative;\n margin: 0;\n padding: 3px;\n border: 2px dashed transparent;\n text-align: center;\n width: 130px;\n}\n\n.orgchart.l2r .node, .orgchart.r2l .node {\n width: 40px;\n height: 130px;\n}\n\n.orgchart .node>.hazy {\n opacity: 0.2;\n}\n\n.orgchart .node>.spinner {\n position: absolute;\n top: calc(50% - 15px);\n left: calc(50% - 15px);\n vertical-align: middle;\n font-size: 30px;\n color: rgba(68, 157, 68, 0.8);\n}\n\n.orgchart .node:hover {\n background-color: rgba(238, 217, 54, 0.5);\n -webkit-transition: .5s;\n transition: .5s;\n cursor: default;\n z-index: 20;\n}\n\n.orgchart .node.focused {\n background-color: rgba(238, 217, 54, 0.5);\n}\n\n.orgchart .ghost-node {\n position: fixed;\n left: -10000px;\n top: -10000px;\n}\n\n.orgchart .ghost-node rect {\n fill: #ffffff;\n stroke: #bf0000;\n}\n\n.orgchart .node.allowedDrop {\n border-color: rgba(68, 157, 68, 0.9);\n}\n\n.orgchart .node .title {\n text-align: center;\n font-size: 12px;\n font-weight: 300;\n height: 20px;\n line-height: 20px;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n background-color: #42b983;\n color: #fff;\n border-radius: 4px 4px 0 0;\n}\n\n.orgchart.b2t .node .title {\n -webkit-transform: rotate(-180deg);\n transform: rotate(-180deg);\n -webkit-transform-origin: center bottom;\n transform-origin: center bottom;\n}\n\n.orgchart.l2r .node .title {\n -webkit-transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);\n transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);\n -webkit-transform-origin: bottom center;\n transform-origin: bottom center;\n width: 120px;\n}\n\n.orgchart.r2l .node .title {\n -webkit-transform: rotate(-90deg) translate(-40px, -40px);\n transform: rotate(-90deg) translate(-40px, -40px);\n -webkit-transform-origin: bottom center;\n transform-origin: bottom center;\n width: 120px;\n}\n\n.orgchart .node .title .symbol {\n float: left;\n margin-top: 4px;\n margin-left: 2px;\n}\n\n.orgchart .node .content {\n width: 100%;\n height: 20px;\n font-size: 11px;\n line-height: 18px;\n border: 1px solid #42b983;\n border-radius: 0 0 4px 4px;\n text-align: center;\n background-color: #fff;\n color: #333;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n}\n\n.orgchart.b2t .node .content {\n -webkit-transform: rotate(180deg);\n transform: rotate(180deg);\n -webkit-transform-origin: center top;\n transform-origin: center top;\n}\n\n.orgchart.l2r .node .content {\n -webkit-transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);\n transform: rotate(-90deg) translate(-40px, -40px) rotateY(180deg);\n -webkit-transform-origin: top center;\n transform-origin: top center;\n width: 120px;\n}\n\n.orgchart.r2l .node .content {\n -webkit-transform: rotate(-90deg) translate(-40px, -40px);\n transform: rotate(-90deg) translate(-40px, -40px);\n -webkit-transform-origin: top center;\n transform-origin: top center;\n width: 120px;\n}\n\n.orgchart .node .edge {\n font-size: 15px;\n position: absolute;\n color: rgba(68, 157, 68, 0.5);\n cursor: default;\n transition: .2s;\n -webkit-transition: .2s;\n}\n\n.orgchart.noncollapsable .node .edge {\n display: none;\n}\n\n.orgchart .edge:hover {\n color: #449d44;\n cursor: pointer;\n}\n\n.orgchart .node .verticalEdge {\n width: calc(100% - 10px);\n width: -moz-calc(100% - 10px);\n left: 5px;\n}\n\n.orgchart .node .topEdge {\n top: -4px;\n}\n\n.orgchart .node .bottomEdge {\n bottom: -4px;\n}\n\n.orgchart .node .horizontalEdge {\n width: 15px;\n height: calc(100% - 10px);\n height: -moz-calc(100% - 10px);\n top: 5px;\n}\n\n.orgchart .node .rightEdge {\n right: -4px;\n}\n\n.orgchart .node .leftEdge {\n left: -4px;\n}\n\n.orgchart .node .horizontalEdge::before {\n position: absolute;\n top: calc(50% - 7px);\n top: -moz-calc(50% - 7px);\n}\n\n.orgchart .node .rightEdge::before {\n right: 3px;\n}\n\n.orgchart .node .leftEdge::before {\n left: 3px;\n}\n\n.orgchart .node .toggleBtn {\n position: absolute;\n left: 5px;\n bottom: -2px;\n color: rgba(68, 157, 68, 0.6);\n}\n\n.orgchart .node .toggleBtn:hover {\n color: rgba(68, 157, 68, 0.8);\n}\n\n.oc-export-btn {\n display: inline-block;\n position: absolute;\n right: 5px;\n bottom: 5px;\n padding: 6px 12px;\n margin-bottom: 0;\n font-size: 14px;\n font-weight: 400;\n line-height: 1.42857143;\n text-align: center;\n white-space: nowrap;\n vertical-align: middle;\n -ms-touch-action: manipulation;\n touch-action: manipulation;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n color: #fff;\n background-color: #409eff;\n border: 1px solid transparent;\n border-color: #409eff;\n border-radius: 4px;\n}\n\n.oc-export-btn:hover,.oc-export-btn:focus,.oc-export-btn:active {\n background-color: #409eff;\n border-color: #409eff;\n}\n\n.orgchart~.mask {\n position: absolute;\n top: 0;\n right: 0;\n bottom: 0;\n left: 0;\n z-index: 999;\n text-align: center;\n background-color: rgba(0,0,0,0.3);\n}\n\n.orgchart~.mask .spinner {\n position: absolute;\n top: calc(50% - 54px);\n left: calc(50% - 54px);\n color: rgba(255,255,255,0.8);\n font-size: 108px;\n}\n\n.orgchart .node {\n -webkit-transition: all 0.3s;\n transition: all 0.3s;\n top: 0;\n left: 0;\n}\n\n.orgchart .slide-down {\n opacity: 0;\n top: 40px;\n}\n\n.orgchart.l2r .node.slide-down, .orgchart.r2l .node.slide-down {\n top: 130px;\n}\n\n.orgchart .slide-up {\n opacity: 0;\n top: -40px;\n}\n\n.orgchart.l2r .node.slide-up, .orgchart.r2l .node.slide-up {\n top: -130px;\n}\n\n.orgchart .slide-right {\n opacity: 0;\n left: 130px;\n}\n\n.orgchart.l2r .node.slide-right, .orgchart.r2l .node.slide-right {\n left: 40px;\n}\n\n.orgchart .slide-left {\n opacity: 0;\n left: -130px;\n}\n\n.orgchart.l2r .node.slide-left, .orgchart.r2l .node.slide-left {\n left: -40px;\n}\n#edit-panel {\n position: relative;\n left: 10px;\n width: calc(100% - 40px);\n border-radius: 4px;\n float: left;\n margin-top: 20px;\n padding: 10px 5px 10px 10px;\n font-size: 14px;\n line-height: 1.5;\n border-radius: 2px;\n color: rgba(0, 0, 0, 0.65);\n background-color: #fff;\n}\n\n#edit-panel .btn-inputs {\n font-size: 24px;\n}\n\n#edit-panel label {\n font-weight: bold;\n}\n\n#edit-panel .new-node {\n height: 24px;\n -webkit-appearance: none;\n background-color:#fff;\n background-image: none;\n border-radius: 4px;\n line-height: 1;\n border: 1px solid #d8dce5;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n color: #5a5e66;\n display: inline-block;\n -webkit-transition: border-color .2s cubic-bezier(.645,.045,.355,1);\n transition: border-color .2s cubic-bezier(.645,.045,.355,1);\n}\n\n#edit-panel .new-node:focus {\n border-color: #409eff;\n outline: none;\n}\n\n#edit-panel .new-node:hover {\n border-color: #b4bccc;\n}\n\n#edit-panel.edit-parent-node .selected-node-group{\n display: none;\n}\n\n#chart-state-panel, #selected-node, #btn-remove-input {\n margin-right: 20px;\n}\n\n#edit-panel button {\n /* color: #333;\n background-color: #fff; */\n display: inline-block;\n padding: 6px 12px;\n margin-bottom: 0;\n line-height: 1.42857143;\n text-align: center;\n white-space: nowrap;\n border-radius: 4px;\n vertical-align: middle;\n -ms-touch-action: manipulation;\n touch-action: manipulation;\n cursor: pointer;\n -webkit-user-select: none;\n -moz-user-select: none;\n -ms-user-select: none;\n user-select: none;\n background-image: none;\n}\n\n#edit-panel.edit-parent-node button:not(#btn-add-nodes) {\n display: none;\n}\n\n#edit-panel button:hover,.edit-panel button:focus,.edit-panel button:active {\n border-color: #409eff;\n -webkit-box-shadow: 0 0 10px #409eff;\n box-shadow: 0 0 10px #409eff;\n}\n\n#new-nodelist {\n display: inline-block;\n list-style:none;\n margin-top: -2px;\n padding: 0;\n vertical-align: text-top;\n}\n\n#new-nodelist>* {\n padding-bottom: 4px;\n}\n\n.btn-inputs {\n vertical-align: sub;\n}\n\n\n.btn-inputs:hover {\n text-shadow: 0 0 4px #fff;\n}\n\n.radio-panel input[type='radio'] {\n border: 1px solid #d8dce5;\n border-radius: 100%;\n cursor: pointer;\n -webkit-box-sizing: border-box;\n box-sizing: border-box;\n display: inline-block;\n height: 14px;\n width: 14px;\n vertical-align: top;\n}\n\n#edit-panel.view-state .radio-panel input[type='radio']+label {\n font-size: 14px;\n font-weight: 500;\n /* color: #5a5e66; */\n line-height: 1;\n}\n\n#btn-add-nodes {\n margin-left: 20px;\n}\n\n" }, { "path": "dist/vue-orgchart.common.js", "content": "'use strict';\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\nvar _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n return typeof obj;\n} : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n};\n\n\n\n\n\n\n\n\n\n\n\nvar classCallCheck = function (instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n};\n\nvar createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\n\n\n\n\n\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar toConsumableArray = function (arr) {\n if (Array.isArray(arr)) {\n for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];\n\n return arr2;\n } else {\n return Array.from(arr);\n }\n};\n\nvar OrgChart$1 = function () {\n function OrgChart(options) {\n classCallCheck(this, OrgChart);\n\n this._name = 'OrgChart';\n Promise.prototype.finally = function (callback) {\n var P = this.constructor;\n\n return this.then(function (value) {\n return P.resolve(callback()).then(function () {\n return value;\n });\n }, function (reason) {\n return P.resolve(callback()).then(function () {\n throw reason;\n });\n });\n };\n\n var that = this,\n defaultOptions = {\n 'nodeTitle': 'name',\n 'nodeId': 'id',\n 'toggleSiblingsResp': false,\n 'depth': 999,\n 'chartClass': '',\n 'exportButton': false,\n 'exportButtonName': 'Export',\n 'exportFilename': 'OrgChart',\n 'parentNodeSymbol': '',\n 'draggable': false,\n 'direction': 't2b',\n 'pan': false,\n 'zoom': false,\n 'toggleCollapse': true\n },\n opts = _extends(defaultOptions, options),\n data = opts.data,\n chart = document.createElement('div'),\n chartContainer = document.querySelector(opts.chartContainer);\n\n this.options = opts;\n delete this.options.data;\n this.chart = chart;\n this.chartContainer = chartContainer;\n chart.dataset.options = JSON.stringify(opts);\n chart.setAttribute('class', 'orgchart' + (opts.chartClass !== '' ? ' ' + opts.chartClass : '') + (opts.direction !== 't2b' ? ' ' + opts.direction : ''));\n if ((typeof data === 'undefined' ? 'undefined' : _typeof(data)) === 'object') {\n // local json datasource\n this.buildHierarchy(chart, opts.ajaxURL ? data : this._attachRel(data, '00'), 0);\n } else if (typeof data === 'string' && data.startsWith('#')) {\n // ul datasource\n this.buildHierarchy(chart, this._buildJsonDS(document.querySelector(data).children[0]), 0);\n } else {\n // ajax datasource\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n chart.appendChild(spinner);\n this._getJSON(data).then(function (resp) {\n that.buildHierarchy(chart, opts.ajaxURL ? resp : that._attachRel(resp, '00'), 0);\n }).catch(function (err) {\n console.error('failed to fetch datasource for orgchart', err);\n }).finally(function () {\n var spinner = chart.querySelector('.spinner');\n\n spinner.parentNode.removeChild(spinner);\n });\n }\n chart.addEventListener('click', this._clickChart.bind(this));\n // append the export button to the chart-container\n if (opts.exportButton && !chartContainer.querySelector('.oc-export-btn')) {\n var exportBtn = document.createElement('button'),\n downloadBtn = document.createElement('a');\n\n exportBtn.setAttribute('class', 'oc-export-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n opts.exportButtonName === 'Export' ? exportBtn.innerHTML = 'Export' : exportBtn.innerHTML = '' + opts.exportButtonName;\n exportBtn.addEventListener('click', this._clickExportButton.bind(this));\n downloadBtn.setAttribute('class', 'oc-download-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n downloadBtn.setAttribute('download', opts.exportFilename + '.png');\n chartContainer.appendChild(exportBtn);\n chartContainer.appendChild(downloadBtn);\n }\n\n if (opts.pan) {\n chartContainer.style.overflow = 'hidden';\n chart.addEventListener('mousedown', this._onPanStart.bind(this));\n chart.addEventListener('touchstart', this._onPanStart.bind(this));\n document.body.addEventListener('mouseup', this._onPanEnd.bind(this));\n document.body.addEventListener('touchend', this._onPanEnd.bind(this));\n }\n\n if (opts.zoom) {\n chartContainer.addEventListener('wheel', this._onWheeling.bind(this));\n chartContainer.addEventListener('touchstart', this._onTouchStart.bind(this));\n document.body.addEventListener('touchmove', this._onTouchMove.bind(this));\n document.body.addEventListener('touchend', this._onTouchEnd.bind(this));\n }\n\n chartContainer.appendChild(chart);\n }\n\n createClass(OrgChart, [{\n key: '_closest',\n value: function _closest(el, fn) {\n return el && (fn(el) && el !== this.chart ? el : this._closest(el.parentNode, fn));\n }\n }, {\n key: '_siblings',\n value: function _siblings(el, expr) {\n return Array.from(el.parentNode.children).filter(function (child) {\n if (child !== el) {\n if (expr) {\n return el.matches(expr);\n }\n return true;\n }\n return false;\n });\n }\n }, {\n key: '_prevAll',\n value: function _prevAll(el, expr) {\n var sibs = [],\n prevSib = el.previousElementSibling;\n\n while (prevSib) {\n if (!expr || prevSib.matches(expr)) {\n sibs.push(prevSib);\n }\n prevSib = prevSib.previousElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_nextAll',\n value: function _nextAll(el, expr) {\n var sibs = [];\n var nextSib = el.nextElementSibling;\n\n while (nextSib) {\n if (!expr || nextSib.matches(expr)) {\n sibs.push(nextSib);\n }\n nextSib = nextSib.nextElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_isVisible',\n value: function _isVisible(el) {\n return el.offsetParent !== null;\n }\n }, {\n key: '_addClass',\n value: function _addClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.add(className);\n });\n } else {\n el.classList.add(classNames);\n }\n });\n }\n }, {\n key: '_removeClass',\n value: function _removeClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.remove(className);\n });\n } else {\n el.classList.remove(classNames);\n }\n });\n }\n }, {\n key: '_css',\n value: function _css(elements, prop, val) {\n elements.forEach(function (el) {\n el.style[prop] = val;\n });\n }\n }, {\n key: '_removeAttr',\n value: function _removeAttr(elements, attr) {\n elements.forEach(function (el) {\n el.removeAttribute(attr);\n });\n }\n }, {\n key: '_one',\n value: function _one(el, type, listener, self) {\n var one = function one(event) {\n try {\n listener.call(self, event);\n } finally {\n el.removeEventListener(type, one);\n }\n };\n\n el && el.addEventListener(type, one);\n }\n }, {\n key: '_getDescElements',\n value: function _getDescElements(ancestors, selector) {\n var results = [];\n\n ancestors.forEach(function (el) {\n return results.push.apply(results, toConsumableArray(el.querySelectorAll(selector)));\n });\n return results;\n }\n }, {\n key: '_getJSON',\n value: function _getJSON(url) {\n return new Promise(function (resolve, reject) {\n var xhr = new XMLHttpRequest();\n\n function handler() {\n if (this.readyState !== 4) {\n return;\n }\n if (this.status === 200) {\n resolve(JSON.parse(this.response));\n } else {\n reject(new Error(this.statusText));\n }\n }\n xhr.open('GET', url);\n xhr.onreadystatechange = handler;\n xhr.responseType = 'json';\n // xhr.setRequestHeader('Accept', 'application/json');\n xhr.setRequestHeader('Content-Type', 'application/json');\n xhr.send();\n });\n }\n }, {\n key: '_buildJsonDS',\n value: function _buildJsonDS(li) {\n var _this = this;\n\n var subObj = {\n 'name': li.firstChild.textContent.trim(),\n 'relationship': (li.parentNode.parentNode.nodeName === 'LI' ? '1' : '0') + (li.parentNode.children.length > 1 ? 1 : 0) + (li.children.length ? 1 : 0)\n };\n\n if (li.id) {\n subObj.id = li.id;\n }\n if (li.querySelector('ul')) {\n Array.from(li.querySelector('ul').children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this._buildJsonDS(el));\n });\n }\n return subObj;\n }\n }, {\n key: '_attachRel',\n value: function _attachRel(data, flags) {\n data.relationship = flags + (data.children && data.children.length > 0 ? 1 : 0);\n if (data.children) {\n var _iteratorNormalCompletion = true;\n var _didIteratorError = false;\n var _iteratorError = undefined;\n\n try {\n for (var _iterator = data.children[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n var item = _step.value;\n\n this._attachRel(item, '1' + (data.children.length > 1 ? 1 : 0));\n }\n } catch (err) {\n _didIteratorError = true;\n _iteratorError = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion && _iterator.return) {\n _iterator.return();\n }\n } finally {\n if (_didIteratorError) {\n throw _iteratorError;\n }\n }\n }\n }\n return data;\n }\n }, {\n key: '_repaint',\n value: function _repaint(node) {\n if (node) {\n node.style.offsetWidth = node.offsetWidth;\n }\n }\n // whether the cursor is hovering over the node\n\n }, {\n key: '_isInAction',\n value: function _isInAction(node) {\n return node.querySelector(':scope > .edge').className.indexOf('fa-') > -1;\n }\n // detect the exist/display state of related node\n\n }, {\n key: '_getNodeState',\n value: function _getNodeState(node, relation) {\n var _this2 = this;\n\n var criteria = void 0,\n state = { 'exist': false, 'visible': false };\n\n if (relation === 'parent') {\n criteria = this._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria.parentNode.children[0])) {\n state.visible = true;\n }\n } else if (relation === 'children') {\n criteria = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).nextElementSibling;\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria)) {\n state.visible = true;\n }\n } else if (relation === 'siblings') {\n criteria = this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n if (criteria.length) {\n state.exist = true;\n }\n if (state.exist && criteria.some(function (el) {\n return _this2._isVisible(el);\n })) {\n state.visible = true;\n }\n }\n\n return state;\n }\n // find the related nodes\n\n }, {\n key: 'getRelatedNodes',\n value: function getRelatedNodes(node, relation) {\n if (relation === 'parent') {\n return this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node');\n } else if (relation === 'children') {\n return Array.from(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children).map(function (el) {\n return el.querySelector('.node');\n });\n } else if (relation === 'siblings') {\n return this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n }\n return [];\n }\n }, {\n key: '_switchHorizontalArrow',\n value: function _switchHorizontalArrow(node) {\n var opts = this.options,\n leftEdge = node.querySelector('.leftEdge'),\n rightEdge = node.querySelector('.rightEdge'),\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (opts.toggleSiblingsResp && (typeof opts.ajaxURL === 'undefined' || this._closest(node, function (el) {\n return el.classList.contains('.nodes');\n }).dataset.siblingsLoaded)) {\n var prevSib = temp.previousElementSibling,\n nextSib = temp.nextElementSibling;\n\n if (prevSib) {\n if (prevSib.classList.contains('hidden')) {\n leftEdge.classList.add('fa-chevron-left');\n leftEdge.classList.remove('fa-chevron-right');\n } else {\n leftEdge.classList.add('fa-chevron-right');\n leftEdge.classList.remove('fa-chevron-left');\n }\n }\n if (nextSib) {\n if (nextSib.classList.contains('hidden')) {\n rightEdge.classList.add('fa-chevron-right');\n rightEdge.classList.remove('fa-chevron-left');\n } else {\n rightEdge.classList.add('fa-chevron-left');\n rightEdge.classList.remove('fa-chevron-right');\n }\n }\n } else {\n var sibs = this._siblings(temp),\n sibsVisible = sibs.length ? !sibs.some(function (el) {\n return el.classList.contains('hidden');\n }) : false;\n\n leftEdge.classList.toggle('fa-chevron-right', sibsVisible);\n leftEdge.classList.toggle('fa-chevron-left', !sibsVisible);\n rightEdge.classList.toggle('fa-chevron-left', sibsVisible);\n rightEdge.classList.toggle('fa-chevron-right', !sibsVisible);\n }\n }\n }, {\n key: '_hoverNode',\n value: function _hoverNode(event) {\n var node = event.target,\n flag = false,\n topEdge = node.querySelector(':scope > .topEdge'),\n bottomEdge = node.querySelector(':scope > .bottomEdge'),\n leftEdge = node.querySelector(':scope > .leftEdge');\n\n if (event.type === 'mouseenter') {\n if (topEdge) {\n flag = this._getNodeState(node, 'parent').visible;\n topEdge.classList.toggle('fa-chevron-up', !flag);\n topEdge.classList.toggle('fa-chevron-down', flag);\n }\n if (bottomEdge) {\n flag = this._getNodeState(node, 'children').visible;\n bottomEdge.classList.toggle('fa-chevron-down', !flag);\n bottomEdge.classList.toggle('fa-chevron-up', flag);\n }\n if (leftEdge) {\n this._switchHorizontalArrow(node);\n }\n } else {\n Array.from(node.querySelectorAll(':scope > .edge')).forEach(function (el) {\n el.classList.remove('fa-chevron-up', 'fa-chevron-down', 'fa-chevron-right', 'fa-chevron-left');\n });\n }\n }\n // define node click event handler\n\n }, {\n key: '_clickNode',\n value: function _clickNode(event) {\n var clickedNode = event.currentTarget,\n focusedNode = this.chart.querySelector('.focused');\n\n if (focusedNode) {\n focusedNode.classList.remove('focused');\n }\n clickedNode.classList.add('focused');\n }\n // build the parent node of specific node\n\n }, {\n key: '_buildParentNode',\n value: function _buildParentNode(currentRoot, nodeData, callback) {\n var that = this,\n table = document.createElement('table');\n\n nodeData.relationship = nodeData.relationship || '001';\n this._createNode(nodeData, 0).then(function (nodeDiv) {\n var chart = that.chart;\n\n nodeDiv.classList.remove('slide-up');\n nodeDiv.classList.add('slide-down');\n var parentTr = document.createElement('tr'),\n superiorLine = document.createElement('tr'),\n inferiorLine = document.createElement('tr'),\n childrenTr = document.createElement('tr');\n\n parentTr.setAttribute('class', 'hidden');\n parentTr.innerHTML = '';\n table.appendChild(parentTr);\n superiorLine.setAttribute('class', 'lines hidden');\n superiorLine.innerHTML = '
';\n table.appendChild(superiorLine);\n inferiorLine.setAttribute('class', 'lines hidden');\n inferiorLine.innerHTML = '  ';\n table.appendChild(inferiorLine);\n childrenTr.setAttribute('class', 'nodes');\n childrenTr.innerHTML = '';\n table.appendChild(childrenTr);\n table.querySelector('td').appendChild(nodeDiv);\n chart.insertBefore(table, chart.children[0]);\n table.children[3].children[0].appendChild(chart.lastChild);\n callback();\n }).catch(function (err) {\n console.error('Failed to create parent node', err);\n });\n }\n }, {\n key: '_switchVerticalArrow',\n value: function _switchVerticalArrow(arrow) {\n arrow.classList.toggle('fa-chevron-up');\n arrow.classList.toggle('fa-chevron-down');\n }\n // show the parent node of the specified node\n\n }, {\n key: 'showParent',\n value: function showParent(node) {\n // just show only one superior level\n var temp = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n this._removeClass(temp, 'hidden');\n // just show only one line\n this._addClass(Array(temp[0].children).slice(1, -1), 'hidden');\n // show parent node with animation\n var parent = temp[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector(':scope > .topEdge'));\n }\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // show the sibling nodes of the specified node\n\n }, {\n key: 'showSiblings',\n value: function showSiblings(node, direction) {\n var _this3 = this;\n\n // firstly, show the sibling td tags\n var siblings = [],\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (direction) {\n siblings = direction === 'left' ? this._prevAll(temp) : this._nextAll(temp);\n } else {\n siblings = this._siblings(temp);\n }\n this._removeClass(siblings, 'hidden');\n // secondly, show the lines\n var upperLevel = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n temp = Array.from(upperLevel[0].querySelectorAll(':scope > .hidden'));\n if (direction) {\n this._removeClass(temp.slice(0, siblings.length * 2), 'hidden');\n } else {\n this._removeClass(temp, 'hidden');\n }\n // thirdly, do some cleaning stuff\n if (!this._getNodeState(node, 'parent').visible) {\n this._removeClass(upperLevel, 'hidden');\n var parent = upperLevel[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function (event) {\n event.target.classList.remove('slide');\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // lastly, show the sibling nodes with animation\n siblings.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this3._isVisible(node)) {\n node.classList.add('slide');\n node.classList.remove('slide-left', 'slide-right');\n }\n });\n });\n this._one(siblings[0].querySelector('.slide'), 'transitionend', function () {\n var _this4 = this;\n\n siblings.forEach(function (sib) {\n _this4._removeClass(Array.from(sib.querySelectorAll('.slide')), 'slide');\n });\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n node.querySelector('.topEdge').classList.remove('fa-chevron-up');\n node.querySelector('.topEdge').classList.add('fa-chevron-down');\n }\n }, this);\n }\n // hide the sibling nodes of the specified node\n\n }, {\n key: 'hideSiblings',\n value: function hideSiblings(node, direction) {\n var _this5 = this;\n\n var nodeContainer = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(nodeContainer);\n\n siblings.forEach(function (sib) {\n if (sib.querySelector('.spinner')) {\n _this5.chart.dataset.inAjax = false;\n }\n });\n\n if (!direction || direction && direction === 'left') {\n var preSibs = this._prevAll(nodeContainer);\n\n preSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-right');\n }\n });\n });\n }\n if (!direction || direction && direction !== 'left') {\n var nextSibs = this._nextAll(nodeContainer);\n\n nextSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-left');\n }\n });\n });\n }\n\n var animatedNodes = [];\n\n this._siblings(nodeContainer).forEach(function (sib) {\n Array.prototype.push.apply(animatedNodes, Array.from(sib.querySelectorAll('.slide')));\n });\n var lines = [];\n\n var _iteratorNormalCompletion2 = true;\n var _didIteratorError2 = false;\n var _iteratorError2 = undefined;\n\n try {\n for (var _iterator2 = animatedNodes[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {\n var _node = _step2.value;\n\n var temp = this._closest(_node, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling;\n\n lines.push(temp);\n lines.push(temp.previousElementSibling);\n }\n } catch (err) {\n _didIteratorError2 = true;\n _iteratorError2 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion2 && _iterator2.return) {\n _iterator2.return();\n }\n } finally {\n if (_didIteratorError2) {\n throw _iteratorError2;\n }\n }\n }\n\n lines = [].concat(toConsumableArray(new Set(lines)));\n lines.forEach(function (line) {\n line.style.visibility = 'hidden';\n });\n\n this._one(animatedNodes[0], 'transitionend', function (event) {\n var _this6 = this;\n\n lines.forEach(function (line) {\n line.removeAttribute('style');\n });\n var sibs = [];\n\n if (direction) {\n if (direction === 'left') {\n sibs = this._prevAll(nodeContainer, ':not(.hidden)');\n } else {\n sibs = this._nextAll(nodeContainer, ':not(.hidden)');\n }\n } else {\n sibs = this._siblings(nodeContainer);\n }\n var temp = Array.from(this._closest(nodeContainer, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling.querySelectorAll(':scope > :not(.hidden)'));\n\n var someLines = temp.slice(1, direction ? sibs.length * 2 + 1 : -1);\n\n this._addClass(someLines, 'hidden');\n this._removeClass(animatedNodes, 'slide');\n sibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).slice(1).forEach(function (node) {\n if (_this6._isVisible(node)) {\n node.classList.remove('slide-left', 'slide-right');\n node.classList.add('slide-up');\n }\n });\n });\n sibs.forEach(function (sib) {\n _this6._addClass(Array.from(sib.querySelectorAll('.lines')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.nodes')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.verticalNodes')), 'hidden');\n });\n this._addClass(sibs, 'hidden');\n\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n }\n }, this);\n }\n // recursively hide the ancestor node and sibling nodes of the specified node\n\n }, {\n key: 'hideParent',\n value: function hideParent(node) {\n var temp = Array.from(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children).slice(0, 3);\n\n if (temp[0].querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n // hide the sibling nodes\n if (this._getNodeState(node, 'siblings').visible) {\n this.hideSiblings(node);\n }\n // hide the lines\n var lines = temp.slice(1);\n\n this._css(lines, 'visibility', 'hidden');\n // hide the superior nodes with transition\n var parent = temp[0].querySelector('.node'),\n grandfatherVisible = this._getNodeState(parent, 'parent').visible;\n\n if (parent && this._isVisible(parent)) {\n parent.classList.add('slide', 'slide-down');\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n this._removeAttr(lines, 'style');\n this._addClass(temp, 'hidden');\n }, this);\n }\n // if the current node has the parent node, hide it recursively\n if (parent && grandfatherVisible) {\n this.hideParent(parent);\n }\n }\n // exposed method\n\n }, {\n key: 'addParent',\n value: function addParent(currentRoot, data) {\n var that = this;\n\n this._buildParentNode(currentRoot, data, function () {\n if (!currentRoot.querySelector(':scope > .topEdge')) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n currentRoot.appendChild(topEdge);\n }\n that.showParent(currentRoot);\n });\n }\n // start up loading status for requesting new nodes\n\n }, {\n key: '_startLoading',\n value: function _startLoading(arrow, node) {\n var opts = this.options,\n chart = this.chart;\n\n if (typeof chart.dataset.inAjax !== 'undefined' && chart.dataset.inAjax === 'true') {\n return false;\n }\n\n arrow.classList.add('hidden');\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n node.appendChild(spinner);\n this._addClass(Array.from(node.querySelectorAll(':scope > *:not(.spinner)')), 'hazy');\n chart.dataset.inAjax = true;\n\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = true;\n }\n return true;\n }\n // terminate loading status for requesting new nodes\n\n }, {\n key: '_endLoading',\n value: function _endLoading(arrow, node) {\n var opts = this.options;\n\n arrow.classList.remove('hidden');\n node.querySelector(':scope > .spinner').remove();\n this._removeClass(Array.from(node.querySelectorAll(':scope > .hazy')), 'hazy');\n this.chart.dataset.inAjax = false;\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = false;\n }\n }\n // define click event handler for the top edge\n\n }, {\n key: '_clickTopEdge',\n value: function _clickTopEdge(event) {\n event.stopPropagation();\n var that = this,\n topEdge = event.target,\n node = topEdge.parentNode,\n parentState = this._getNodeState(node, 'parent'),\n opts = this.options;\n\n if (parentState.exist) {\n var temp = this._closest(node, function (el) {\n return el.classList.contains('nodes');\n });\n var parent = temp.parentNode.firstChild.querySelector('.node');\n\n if (parent.classList.contains('slide')) {\n return;\n }\n // hide the ancestor nodes and sibling nodes of the specified node\n if (parentState.visible) {\n this.hideParent(node);\n this._one(parent, 'transitionend', function () {\n if (this._isInAction(node)) {\n this._switchVerticalArrow(topEdge);\n this._switchHorizontalArrow(node);\n }\n }, this);\n } else {\n // show the ancestors and siblings\n this.showParent(node);\n }\n } else {\n // load the new parent node of the specified node by ajax request\n var nodeId = topEdge.parentNode.id;\n\n // start up loading status\n if (this._startLoading(topEdge, node)) {\n // load new nodes\n this._getJSON(typeof opts.ajaxURL.parent === 'function' ? opts.ajaxURL.parent(node.dataset.source) : opts.ajaxURL.parent + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (Object.keys(resp).length) {\n that.addParent(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get parent node data.', err);\n }).finally(function () {\n that._endLoading(topEdge, node);\n });\n }\n }\n }\n // recursively hide the descendant nodes of the specified node\n\n }, {\n key: 'hideChildren',\n value: function hideChildren(node) {\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n lastItem = temp[temp.length - 1],\n lines = [];\n\n if (lastItem.querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n var descendants = Array.from(lastItem.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }),\n isVerticalDesc = lastItem.classList.contains('verticalNodes');\n\n if (!isVerticalDesc) {\n descendants.forEach(function (desc) {\n Array.prototype.push.apply(lines, that._prevAll(that._closest(desc, function (el) {\n return el.classList.contains('nodes');\n }), '.lines'));\n });\n lines = [].concat(toConsumableArray(new Set(lines)));\n this._css(lines, 'visibility', 'hidden');\n }\n this._one(descendants[0], 'transitionend', function (event) {\n this._removeClass(descendants, 'slide');\n if (isVerticalDesc) {\n that._addClass(temp, 'hidden');\n } else {\n lines.forEach(function (el) {\n el.removeAttribute('style');\n el.classList.add('hidden');\n el.parentNode.lastChild.classList.add('hidden');\n });\n this._addClass(Array.from(lastItem.querySelectorAll('.verticalNodes')), 'hidden');\n }\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide slide-up');\n }\n // show the children nodes of the specified node\n\n }, {\n key: 'showChildren',\n value: function showChildren(node) {\n var _this7 = this;\n\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n descendants = [];\n\n this._removeClass(temp, 'hidden');\n if (temp.some(function (el) {\n return el.classList.contains('verticalNodes');\n })) {\n temp.forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n } else {\n Array.from(temp[2].children).forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelector('tr').querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n }\n // the two following statements are used to enforce browser to repaint\n this._repaint(descendants[0]);\n this._one(descendants[0], 'transitionend', function (event) {\n _this7._removeClass(descendants, 'slide');\n if (_this7._isInAction(node)) {\n _this7._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide');\n this._removeClass(descendants, 'slide-up');\n }\n // build the child nodes of specific node\n\n }, {\n key: '_buildChildNode',\n value: function _buildChildNode(appendTo, nodeData, callback) {\n var data = nodeData.children || nodeData.siblings;\n\n appendTo.querySelector('td').setAttribute('colSpan', data.length * 2);\n this.buildHierarchy(appendTo, { 'children': data }, 0, callback);\n }\n // exposed method\n\n }, {\n key: 'addChildren',\n value: function addChildren(node, data) {\n var that = this,\n opts = this.options,\n count = 0;\n\n this.chart.dataset.inEdit = 'addChildren';\n this._buildChildNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n if (++count === data.children.length) {\n if (!node.querySelector('.bottomEdge')) {\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n node.appendChild(bottomEdge);\n }\n if (!node.querySelector('.symbol')) {\n var symbol = document.createElement('i');\n\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n node.querySelector(':scope > .title').appendChild(symbol);\n }\n that.showChildren(node);\n that.chart.dataset.inEdit = '';\n }\n });\n }\n // bind click event handler for the bottom edge\n\n }, {\n key: '_clickBottomEdge',\n value: function _clickBottomEdge(event) {\n var _this8 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n bottomEdge = event.target,\n node = bottomEdge.parentNode,\n childrenState = this._getNodeState(node, 'children');\n\n if (childrenState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).parentNode.lastChild;\n\n if (Array.from(temp.querySelectorAll('.node')).some(function (node) {\n return _this8._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n // hide the descendant nodes of the specified node\n if (childrenState.visible) {\n this.hideChildren(node);\n } else {\n // show the descendants\n this.showChildren(node);\n }\n } else {\n // load the new children nodes of the specified node by ajax request\n var nodeId = bottomEdge.parentNode.id;\n\n if (this._startLoading(bottomEdge, node)) {\n this._getJSON(typeof opts.ajaxURL.children === 'function' ? opts.ajaxURL.children(node.dataset.source) : opts.ajaxURL.children + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.children.length) {\n that.addChildren(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get children nodes data', err);\n }).finally(function () {\n that._endLoading(bottomEdge, node);\n });\n }\n }\n }\n // subsequent processing of build sibling nodes\n\n }, {\n key: '_complementLine',\n value: function _complementLine(oneSibling, siblingCount, existingSibligCount) {\n var temp = oneSibling.parentNode.parentNode.children;\n\n temp[0].children[0].setAttribute('colspan', siblingCount * 2);\n temp[1].children[0].setAttribute('colspan', siblingCount * 2);\n for (var i = 0; i < existingSibligCount; i++) {\n var rightLine = document.createElement('td'),\n leftLine = document.createElement('td');\n\n rightLine.setAttribute('class', 'rightLine topLine');\n rightLine.innerHTML = ' ';\n temp[2].insertBefore(rightLine, temp[2].children[1]);\n leftLine.setAttribute('class', 'leftLine topLine');\n leftLine.innerHTML = ' ';\n temp[2].insertBefore(leftLine, temp[2].children[1]);\n }\n }\n // build the sibling nodes of specific node\n\n }, {\n key: '_buildSiblingNode',\n value: function _buildSiblingNode(nodeChart, nodeData, callback) {\n var _this9 = this;\n\n var that = this,\n newSiblingCount = nodeData.siblings ? nodeData.siblings.length : nodeData.children.length,\n existingSibligCount = nodeChart.parentNode.nodeName === 'TD' ? this._closest(nodeChart, function (el) {\n return el.nodeName === 'TR';\n }).children.length : 1,\n siblingCount = existingSibligCount + newSiblingCount,\n insertPostion = siblingCount > 1 ? Math.floor(siblingCount / 2 - 1) : 0;\n\n // just build the sibling nodes for the specific node\n if (nodeChart.parentNode.nodeName === 'TD') {\n var temp = this._prevAll(nodeChart.parentNode.parentNode);\n\n temp[0].remove();\n temp[1].remove();\n var childCount = 0;\n\n that._buildChildNode.call(that, that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }), nodeData, function () {\n if (++childCount === newSiblingCount) {\n var siblingTds = Array.from(that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children);\n\n if (existingSibligCount > 1) {\n var _temp = nodeChart.parentNode.parentNode;\n\n Array.from(_temp.children).forEach(function (el) {\n siblingTds[0].parentNode.insertBefore(el, siblingTds[0]);\n });\n _temp.remove();\n that._complementLine(siblingTds[0], siblingCount, existingSibligCount);\n that._addClass(siblingTds, 'hidden');\n siblingTds.forEach(function (el) {\n that._addClass(el.querySelectorAll('.node'), 'slide-left');\n });\n } else {\n var _temp2 = nodeChart.parentNode.parentNode;\n\n siblingTds[insertPostion].parentNode.insertBefore(nodeChart.parentNode, siblingTds[insertPostion + 1]);\n _temp2.remove();\n that._complementLine(siblingTds[insertPostion], siblingCount, 1);\n that._addClass(siblingTds, 'hidden');\n that._addClass(that._getDescElements(siblingTds.slice(0, insertPostion + 1), '.node'), 'slide-right');\n that._addClass(that._getDescElements(siblingTds.slice(insertPostion + 1), '.node'), 'slide-left');\n }\n callback();\n }\n });\n } else {\n // build the sibling nodes and parent node for the specific ndoe\n var nodeCount = 0;\n\n that.buildHierarchy.call(that, that.chart, nodeData, 0, function () {\n if (++nodeCount === siblingCount) {\n var _temp3 = nodeChart.nextElementSibling.children[3].children[insertPostion],\n td = document.createElement('td');\n\n td.setAttribute('colspan', 2);\n td.appendChild(nodeChart);\n _temp3.parentNode.insertBefore(td, _temp3.nextElementSibling);\n that._complementLine(_temp3, siblingCount, 1);\n\n var temp2 = that._closest(nodeChart, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0];\n\n temp2.classList.add('hidden');\n that._addClass(Array.from(temp2.querySelectorAll('.node')), 'slide-down');\n\n var temp3 = _this9._siblings(nodeChart.parentNode);\n\n that._addClass(temp3, 'hidden');\n that._addClass(that._getDescElements(temp3.slice(0, insertPostion), '.node'), 'slide-right');\n that._addClass(that._getDescElements(temp3.slice(insertPostion), '.node'), 'slide-left');\n callback();\n }\n });\n }\n }\n }, {\n key: 'addSiblings',\n value: function addSiblings(node, data) {\n var that = this;\n\n this.chart.dataset.inEdit = 'addSiblings';\n this._buildSiblingNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n that._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).dataset.siblingsLoaded = true;\n if (!node.querySelector('.leftEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n node.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n node.appendChild(leftEdge);\n }\n that.showSiblings(node);\n that.chart.dataset.inEdit = '';\n });\n }\n }, {\n key: 'removeNodes',\n value: function removeNodes(node) {\n var parent = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n sibs = this._siblings(parent.parentNode);\n\n if (parent.nodeName === 'TD') {\n if (this._getNodeState(node, 'siblings').exist) {\n sibs[2].querySelector('.topLine').nextElementSibling.remove();\n sibs[2].querySelector('.topLine').remove();\n sibs[0].children[0].setAttribute('colspan', sibs[2].children.length);\n sibs[1].children[0].setAttribute('colspan', sibs[2].children.length);\n parent.remove();\n } else {\n sibs[0].children[0].removeAttribute('colspan');\n sibs[0].querySelector('.bottomEdge').remove();\n this._siblings(sibs[0]).forEach(function (el) {\n return el.remove();\n });\n }\n } else {\n Array.from(parent.parentNode.children).forEach(function (el) {\n return el.remove();\n });\n }\n }\n // bind click event handler for the left and right edges\n\n }, {\n key: '_clickHorizontalEdge',\n value: function _clickHorizontalEdge(event) {\n var _this10 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n hEdge = event.target,\n node = hEdge.parentNode,\n siblingsState = this._getNodeState(node, 'siblings');\n\n if (siblingsState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(temp);\n\n if (siblings.some(function (el) {\n var node = el.querySelector('.node');\n\n return _this10._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n if (opts.toggleSiblingsResp) {\n var prevSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.previousElementSibling,\n nextSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.nextElementSibling;\n\n if (hEdge.classList.contains('leftEdge')) {\n if (prevSib && prevSib.classList.contains('hidden')) {\n this.showSiblings(node, 'left');\n } else {\n this.hideSiblings(node, 'left');\n }\n } else {\n if (nextSib && nextSib.classList.contains('hidden')) {\n this.showSiblings(node, 'right');\n } else {\n this.hideSiblings(node, 'right');\n }\n }\n } else {\n if (siblingsState.visible) {\n this.hideSiblings(node);\n } else {\n this.showSiblings(node);\n }\n }\n } else {\n // load the new sibling nodes of the specified node by ajax request\n var nodeId = hEdge.parentNode.id,\n url = this._getNodeState(node, 'parent').exist ? typeof opts.ajaxURL.siblings === 'function' ? opts.ajaxURL.siblings(JSON.parse(node.dataset.source)) : opts.ajaxURL.siblings + nodeId : typeof opts.ajaxURL.families === 'function' ? opts.ajaxURL.families(JSON.parse(node.dataset.source)) : opts.ajaxURL.families + nodeId;\n\n if (this._startLoading(hEdge, node)) {\n this._getJSON(url).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.siblings || resp.children) {\n that.addSiblings(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get sibling nodes data', err);\n }).finally(function () {\n that._endLoading(hEdge, node);\n });\n }\n }\n }\n // event handler for toggle buttons in Hybrid(horizontal + vertical) OrgChart\n\n }, {\n key: '_clickToggleButton',\n value: function _clickToggleButton(event) {\n var that = this,\n toggleBtn = event.target,\n descWrapper = toggleBtn.parentNode.nextElementSibling,\n descendants = Array.from(descWrapper.querySelectorAll('.node')),\n children = Array.from(descWrapper.children).map(function (item) {\n return item.querySelector('.node');\n });\n\n if (children.some(function (item) {\n return item.classList.contains('slide');\n })) {\n return;\n }\n toggleBtn.classList.toggle('fa-plus-square');\n toggleBtn.classList.toggle('fa-minus-square');\n if (descendants[0].classList.contains('slide-up')) {\n descWrapper.classList.remove('hidden');\n this._repaint(children[0]);\n this._addClass(children, 'slide');\n this._removeClass(children, 'slide-up');\n this._one(children[0], 'transitionend', function () {\n that._removeClass(children, 'slide');\n });\n } else {\n this._addClass(descendants, 'slide slide-up');\n this._one(descendants[0], 'transitionend', function () {\n that._removeClass(descendants, 'slide');\n descendants.forEach(function (desc) {\n var ul = that._closest(desc, function (el) {\n return el.nodeName === 'UL';\n });\n\n ul.classList.add('hidden');\n });\n });\n\n descendants.forEach(function (desc) {\n var subTBs = Array.from(desc.querySelectorAll('.toggleBtn'));\n\n that._removeClass(subTBs, 'fa-minus-square');\n that._addClass(subTBs, 'fa-plus-square');\n });\n }\n }\n }, {\n key: '_dispatchClickEvent',\n value: function _dispatchClickEvent(event) {\n var classList = event.target.classList;\n\n if (classList.contains('topEdge')) {\n this._clickTopEdge(event);\n } else if (classList.contains('rightEdge') || classList.contains('leftEdge')) {\n this._clickHorizontalEdge(event);\n } else if (classList.contains('bottomEdge')) {\n this._clickBottomEdge(event);\n } else if (classList.contains('toggleBtn')) {\n this._clickToggleButton(event);\n } else {\n this._clickNode(event);\n }\n }\n }, {\n key: '_onDragStart',\n value: function _onDragStart(event) {\n var nodeDiv = event.target,\n opts = this.options,\n isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());\n\n if (isFirefox) {\n event.dataTransfer.setData('text/html', 'hack for firefox');\n }\n // if users enable zoom or direction options\n if (this.chart.style.transform) {\n var ghostNode = void 0,\n nodeCover = void 0;\n\n if (!document.querySelector('.ghost-node')) {\n ghostNode = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n ghostNode.classList.add('ghost-node');\n nodeCover = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\n ghostNode.appendChild(nodeCover);\n this.chart.appendChild(ghostNode);\n } else {\n ghostNode = this.chart.querySelector(':scope > .ghost-node');\n nodeCover = ghostNode.children[0];\n }\n var transValues = this.chart.style.transform.split(','),\n scale = Math.abs(window.parseFloat(opts.direction === 't2b' || opts.direction === 'b2t' ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));\n\n ghostNode.setAttribute('width', nodeDiv.offsetWidth);\n ghostNode.setAttribute('height', nodeDiv.offsetHeight);\n nodeCover.setAttribute('x', 5 * scale);\n nodeCover.setAttribute('y', 5 * scale);\n nodeCover.setAttribute('width', 120 * scale);\n nodeCover.setAttribute('height', 40 * scale);\n nodeCover.setAttribute('rx', 4 * scale);\n nodeCover.setAttribute('ry', 4 * scale);\n nodeCover.setAttribute('stroke-width', 1 * scale);\n var xOffset = event.offsetX * scale,\n yOffset = event.offsetY * scale;\n\n if (opts.direction === 'l2r') {\n xOffset = event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'r2l') {\n xOffset = nodeDiv.offsetWidth - event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'b2t') {\n xOffset = nodeDiv.offsetWidth - event.offsetX * scale;\n yOffset = nodeDiv.offsetHeight - event.offsetY * scale;\n }\n if (isFirefox) {\n // hack for old version of Firefox(< 48.0)\n var ghostNodeWrapper = document.createElement('img');\n\n ghostNodeWrapper.src = 'data:image/svg+xml;utf8,' + new XMLSerializer().serializeToString(ghostNode);\n event.dataTransfer.setDragImage(ghostNodeWrapper, xOffset, yOffset);\n nodeCover.setAttribute('fill', 'rgb(255, 255, 255)');\n nodeCover.setAttribute('stroke', 'rgb(191, 0, 0)');\n } else {\n event.dataTransfer.setDragImage(ghostNode, xOffset, yOffset);\n }\n }\n var dragged = event.target;\n var closestDraggedNodes = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n var dragZone = null;\n closestDraggedNodes !== null ? dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node') : null;\n var dragHier = Array.from(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).querySelectorAll('.node'));\n\n this.dragged = dragged;\n Array.from(this.chart.querySelectorAll('.node')).forEach(function (node) {\n if (!dragHier.includes(node)) {\n if (opts.dropCriteria) {\n if (opts.dropCriteria(dragged, dragZone, node)) {\n node.classList.add('allowedDrop');\n }\n } else {\n node.classList.add('allowedDrop');\n }\n }\n });\n }\n }, {\n key: '_onDragOver',\n value: function _onDragOver(event) {\n event.preventDefault();\n var dropZone = event.currentTarget;\n\n if (!dropZone.classList.contains('allowedDrop')) {\n event.dataTransfer.dropEffect = 'none';\n }\n }\n }, {\n key: '_onDragEnd',\n value: function _onDragEnd(event) {\n Array.from(this.chart.querySelectorAll('.allowedDrop')).forEach(function (el) {\n el.classList.remove('allowedDrop');\n });\n }\n }, {\n key: '_onDrop',\n value: function _onDrop(event) {\n var dropZone = event.currentTarget,\n chart = this.chart,\n dragged = this.dragged,\n dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].children[0];\n\n this._removeClass(Array.from(chart.querySelectorAll('.allowedDrop')), 'allowedDrop');\n // firstly, deal with the hierarchy of drop zone\n if (!dropZone.parentNode.parentNode.nextElementSibling) {\n // if the drop zone is a leaf node\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n dropZone.appendChild(bottomEdge);\n dropZone.parentNode.setAttribute('colspan', 2);\n var table = this._closest(dropZone, function (el) {\n return el.nodeName === 'TABLE';\n }),\n upperTr = document.createElement('tr'),\n lowerTr = document.createElement('tr'),\n nodeTr = document.createElement('tr');\n\n upperTr.setAttribute('class', 'lines');\n upperTr.innerHTML = '
';\n table.appendChild(upperTr);\n lowerTr.setAttribute('class', 'lines');\n lowerTr.innerHTML = '  ';\n table.appendChild(lowerTr);\n nodeTr.setAttribute('class', 'nodes');\n table.appendChild(nodeTr);\n Array.from(dragged.querySelectorAll('.horizontalEdge')).forEach(function (hEdge) {\n dragged.removeChild(hEdge);\n });\n var draggedTd = this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n nodeTr.appendChild(draggedTd);\n } else {\n var dropColspan = window.parseInt(dropZone.parentNode.colSpan) + 2;\n\n dropZone.parentNode.setAttribute('colspan', dropColspan);\n dropZone.parentNode.parentNode.nextElementSibling.children[0].setAttribute('colspan', dropColspan);\n if (!dragged.querySelector('.horizontalEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dragged.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dragged.appendChild(leftEdge);\n }\n var temp = dropZone.parentNode.parentNode.nextElementSibling.nextElementSibling,\n leftline = document.createElement('td'),\n rightline = document.createElement('td');\n\n leftline.setAttribute('class', 'leftLine topLine');\n leftline.innerHTML = ' ';\n temp.insertBefore(leftline, temp.children[1]);\n rightline.setAttribute('class', 'rightLine topLine');\n rightline.innerHTML = ' ';\n temp.insertBefore(rightline, temp.children[2]);\n temp.nextElementSibling.appendChild(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n\n var dropSibs = this._siblings(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n\n if (dropSibs.length === 1) {\n var _rightEdge = document.createElement('i'),\n _leftEdge = document.createElement('i');\n\n _rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dropSibs[0].appendChild(_rightEdge);\n _leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dropSibs[0].appendChild(_leftEdge);\n }\n }\n // secondly, deal with the hierarchy of dragged node\n var dragColSpan = window.parseInt(dragZone.colSpan);\n\n if (dragColSpan > 2) {\n dragZone.setAttribute('colspan', dragColSpan - 2);\n dragZone.parentNode.nextElementSibling.children[0].setAttribute('colspan', dragColSpan - 2);\n var _temp4 = dragZone.parentNode.nextElementSibling.nextElementSibling;\n\n _temp4.children[1].remove();\n _temp4.children[1].remove();\n\n var dragSibs = Array.from(dragZone.parentNode.parentNode.children[3].children).map(function (td) {\n return td.querySelector('.node');\n });\n\n if (dragSibs.length === 1) {\n dragSibs[0].querySelector('.leftEdge').remove();\n dragSibs[0].querySelector('.rightEdge').remove();\n }\n } else {\n dragZone.removeAttribute('colspan');\n dragZone.querySelector('.node').removeChild(dragZone.querySelector('.bottomEdge'));\n Array.from(dragZone.parentNode.parentNode.children).slice(1).forEach(function (tr) {\n return tr.remove();\n });\n }\n var customE = new CustomEvent('nodedropped.orgchart', { 'detail': {\n 'draggedNode': dragged,\n 'dragZone': dragZone.children[0],\n 'dropZone': dropZone\n } });\n\n chart.dispatchEvent(customE);\n }\n // create node\n\n }, {\n key: '_createNode',\n value: function _createNode(nodeData, level) {\n var that = this,\n opts = this.options;\n\n return new Promise(function (resolve, reject) {\n if (nodeData.children) {\n var _iteratorNormalCompletion3 = true;\n var _didIteratorError3 = false;\n var _iteratorError3 = undefined;\n\n try {\n for (var _iterator3 = nodeData.children[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {\n var child = _step3.value;\n\n child.parentId = nodeData.id;\n }\n } catch (err) {\n _didIteratorError3 = true;\n _iteratorError3 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion3 && _iterator3.return) {\n _iterator3.return();\n }\n } finally {\n if (_didIteratorError3) {\n throw _iteratorError3;\n }\n }\n }\n }\n\n // construct the content of node\n var nodeDiv = document.createElement('div');\n\n delete nodeData.children;\n nodeDiv.dataset.source = JSON.stringify(nodeData);\n if (nodeData[opts.nodeId]) {\n nodeDiv.id = nodeData[opts.nodeId];\n }\n var inEdit = that.chart.dataset.inEdit,\n isHidden = void 0;\n\n if (inEdit) {\n isHidden = inEdit === 'addChildren' ? ' slide-up' : '';\n } else {\n isHidden = level >= opts.depth ? ' slide-up' : '';\n }\n nodeDiv.setAttribute('class', 'node ' + (nodeData.className || '') + isHidden);\n if (opts.draggable) {\n nodeDiv.setAttribute('draggable', true);\n }\n if (nodeData.parentId) {\n nodeDiv.setAttribute('data-parent', nodeData.parentId);\n }\n nodeDiv.innerHTML = '\\n
' + nodeData[opts.nodeTitle] + '
\\n ' + (opts.nodeContent ? '
' + nodeData[opts.nodeContent] + '
' : '') + '\\n ';\n // append 4 direction arrows or expand/collapse buttons\n var flags = nodeData.relationship || '';\n\n if (opts.verticalDepth && level + 2 > opts.verticalDepth) {\n if (level + 1 >= opts.verticalDepth && Number(flags.substr(2, 1))) {\n var toggleBtn = document.createElement('i'),\n icon = level + 1 >= opts.depth ? 'plus' : 'minus';\n\n toggleBtn.setAttribute('class', 'toggleBtn fa fa-' + icon + '-square');\n nodeDiv.appendChild(toggleBtn);\n }\n } else {\n if (Number(flags.substr(0, 1))) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n nodeDiv.appendChild(topEdge);\n }\n if (Number(flags.substr(1, 1))) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n nodeDiv.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n nodeDiv.appendChild(leftEdge);\n }\n if (Number(flags.substr(2, 1))) {\n var bottomEdge = document.createElement('i'),\n symbol = document.createElement('i'),\n title = nodeDiv.querySelector(':scope > .title');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n nodeDiv.appendChild(bottomEdge);\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n title.insertBefore(symbol, title.children[0]);\n }\n }\n if (opts.toggleCollapse) {\n nodeDiv.addEventListener('mouseenter', that._hoverNode.bind(that));\n nodeDiv.addEventListener('mouseleave', that._hoverNode.bind(that));\n nodeDiv.addEventListener('click', that._dispatchClickEvent.bind(that));\n }\n if (opts.draggable) {\n nodeDiv.addEventListener('dragstart', that._onDragStart.bind(that));\n nodeDiv.addEventListener('dragover', that._onDragOver.bind(that));\n nodeDiv.addEventListener('dragend', that._onDragEnd.bind(that));\n nodeDiv.addEventListener('drop', that._onDrop.bind(that));\n }\n // allow user to append dom modification after finishing node create of orgchart\n if (opts.createNode) {\n opts.createNode(nodeDiv, nodeData);\n }\n\n resolve(nodeDiv);\n });\n }\n }, {\n key: 'buildHierarchy',\n value: function buildHierarchy(appendTo, nodeData, level, callback) {\n // Construct the node\n var that = this,\n opts = this.options,\n nodeWrapper = void 0,\n childNodes = nodeData.children,\n isVerticalNode = opts.verticalDepth && level + 1 >= opts.verticalDepth;\n\n if (Object.keys(nodeData).length > 1) {\n // if nodeData has nested structure\n nodeWrapper = isVerticalNode ? appendTo : document.createElement('table');\n if (!isVerticalNode) {\n appendTo.appendChild(nodeWrapper);\n }\n this._createNode(nodeData, level).then(function (nodeDiv) {\n if (isVerticalNode) {\n nodeWrapper.insertBefore(nodeDiv, nodeWrapper.firstChild);\n } else {\n var tr = document.createElement('tr');\n\n tr.innerHTML = '\\n \\n \\n ';\n tr.children[0].appendChild(nodeDiv);\n nodeWrapper.insertBefore(tr, nodeWrapper.children[0] ? nodeWrapper.children[0] : null);\n }\n if (callback) {\n callback();\n }\n }).catch(function (err) {\n console.error('Failed to creat node', err);\n });\n }\n // Construct the inferior nodes and connectiong lines\n if (childNodes && childNodes.length !== 0) {\n if (Object.keys(nodeData).length === 1) {\n // if nodeData is just an array\n nodeWrapper = appendTo;\n }\n var isHidden = void 0,\n isVerticalLayer = opts.verticalDepth && level + 2 >= opts.verticalDepth,\n inEdit = that.chart.dataset.inEdit;\n\n if (inEdit) {\n isHidden = inEdit === 'addSiblings' ? '' : ' hidden';\n } else {\n isHidden = level + 1 >= opts.depth ? ' hidden' : '';\n }\n\n // draw the line close to parent node\n if (!isVerticalLayer) {\n var tr = document.createElement('tr');\n\n tr.setAttribute('class', 'lines' + isHidden);\n tr.innerHTML = '\\n \\n
\\n \\n ';\n nodeWrapper.appendChild(tr);\n }\n // draw the lines close to children nodes\n var lineLayer = document.createElement('tr');\n\n lineLayer.setAttribute('class', 'lines' + isHidden);\n lineLayer.innerHTML = '\\n  \\n ' + childNodes.slice(1).map(function () {\n return '\\n  \\n  \\n ';\n }).join('') + '\\n  \\n ';\n var nodeLayer = void 0;\n\n if (isVerticalLayer) {\n nodeLayer = document.createElement('ul');\n if (isHidden) {\n nodeLayer.classList.add(isHidden.trim());\n }\n if (level + 2 === opts.verticalDepth) {\n var _tr = document.createElement('tr');\n\n _tr.setAttribute('class', 'verticalNodes' + isHidden);\n _tr.innerHTML = '';\n _tr.firstChild.appendChild(nodeLayer);\n nodeWrapper.appendChild(_tr);\n } else {\n nodeWrapper.appendChild(nodeLayer);\n }\n } else {\n nodeLayer = document.createElement('tr');\n nodeLayer.setAttribute('class', 'nodes' + isHidden);\n nodeWrapper.appendChild(lineLayer);\n nodeWrapper.appendChild(nodeLayer);\n }\n // recurse through children nodes\n childNodes.forEach(function (child) {\n var nodeCell = void 0;\n\n if (isVerticalLayer) {\n nodeCell = document.createElement('li');\n } else {\n nodeCell = document.createElement('td');\n nodeCell.setAttribute('colspan', 2);\n }\n nodeLayer.appendChild(nodeCell);\n that.buildHierarchy(nodeCell, child, level + 1, callback);\n });\n }\n }\n }, {\n key: '_clickChart',\n value: function _clickChart(event) {\n var closestNode = this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n\n if (!closestNode && this.chart.querySelector('.node.focused')) {\n this.chart.querySelector('.node.focused').classList.remove('focused');\n }\n }\n }, {\n key: '_clickExportButton',\n value: function _clickExportButton() {\n var opts = this.options,\n chartContainer = this.chartContainer,\n mask = chartContainer.querySelector(':scope > .mask'),\n sourceChart = chartContainer.querySelector('.orgchart:not(.hidden)'),\n flag = opts.direction === 'l2r' || opts.direction === 'r2l';\n\n if (!mask) {\n mask = document.createElement('div');\n mask.setAttribute('class', 'mask');\n mask.innerHTML = '';\n chartContainer.appendChild(mask);\n } else {\n mask.classList.remove('hidden');\n }\n chartContainer.classList.add('canvasContainer');\n window.html2canvas(sourceChart, {\n 'width': flag ? sourceChart.clientHeight : sourceChart.clientWidth,\n 'height': flag ? sourceChart.clientWidth : sourceChart.clientHeight,\n 'onclone': function onclone(cloneDoc) {\n var canvasContainer = cloneDoc.querySelector('.canvasContainer');\n\n canvasContainer.style.overflow = 'visible';\n canvasContainer.querySelector('.orgchart:not(.hidden)').transform = '';\n }\n }).then(function (canvas) {\n var downloadBtn = chartContainer.querySelector('.oc-download-btn');\n\n chartContainer.querySelector('.mask').classList.add('hidden');\n downloadBtn.setAttribute('href', canvas.toDataURL());\n downloadBtn.click();\n }).catch(function (err) {\n console.error('Failed to export the curent orgchart!', err);\n }).finally(function () {\n chartContainer.classList.remove('canvasContainer');\n });\n }\n }, {\n key: '_loopChart',\n value: function _loopChart(chart) {\n var _this11 = this;\n\n var subObj = { 'id': chart.querySelector('.node').id };\n\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this11._loopChart(el.firstChild));\n });\n }\n return subObj;\n }\n }, {\n key: '_loopChartDataset',\n value: function _loopChartDataset(chart) {\n var _this12 = this;\n\n var _subObj = JSON.parse(chart.querySelector('.node').dataset.source);\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!_subObj.children) {\n _subObj.children = [];\n }\n _subObj.children.push(_this12._loopChartDataset(el.firstChild));\n });\n }\n return _subObj;\n }\n }, {\n key: 'getChartJSON',\n value: function getChartJSON() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChartDataset(this.chart.querySelector('table'));\n }\n }, {\n key: 'getHierarchy',\n value: function getHierarchy() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChart(this.chart.querySelector('table'));\n }\n }, {\n key: '_onPanStart',\n value: function _onPanStart(event) {\n var chart = event.currentTarget;\n\n if (this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n }) || event.touches && event.touches.length > 1) {\n chart.dataset.panning = false;\n return;\n }\n chart.style.cursor = 'move';\n chart.dataset.panning = true;\n\n var lastX = 0,\n lastY = 0,\n lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf !== 'none') {\n var temp = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n lastX = Number.parseInt(temp[4], 10);\n lastY = Number.parseInt(temp[5], 10);\n } else {\n lastX = Number.parseInt(temp[12], 10);\n lastY = Number.parseInt(temp[13], 10);\n }\n }\n var startX = 0,\n startY = 0;\n\n if (!event.targetTouches) {\n // pan on desktop\n startX = event.pageX - lastX;\n startY = event.pageY - lastY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n startX = event.targetTouches[0].pageX - lastX;\n startY = event.targetTouches[0].pageY - lastY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n chart.dataset.panStart = JSON.stringify({ 'startX': startX, 'startY': startY });\n chart.addEventListener('mousemove', this._onPanning.bind(this));\n chart.addEventListener('touchmove', this._onPanning.bind(this));\n }\n }, {\n key: '_onPanning',\n value: function _onPanning(event) {\n var chart = event.currentTarget;\n\n if (chart.dataset.panning === 'false') {\n return;\n }\n var newX = 0,\n newY = 0,\n panStart = JSON.parse(chart.dataset.panStart),\n startX = panStart.startX,\n startY = panStart.startY;\n\n if (!event.targetTouches) {\n // pand on desktop\n newX = event.pageX - startX;\n newY = event.pageY - startY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n newX = event.targetTouches[0].pageX - startX;\n newY = event.targetTouches[0].pageY - startY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n if (!lastTf.includes('3d')) {\n chart.style.transform = 'matrix(1, 0, 0, 1, ' + newX + ', ' + newY + ')';\n } else {\n chart.style.transform = 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, ' + newX + ', ' + newY + ', 0, 1)';\n }\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[4] = newX;\n matrix[5] = newY + ')';\n } else {\n matrix[12] = newX;\n matrix[13] = newY;\n }\n chart.style.transform = matrix.join(',');\n }\n }\n }, {\n key: '_onPanEnd',\n value: function _onPanEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.panning === 'true') {\n chart.dataset.panning = false;\n chart.style.cursor = 'default';\n document.body.removeEventListener('mousemove', this._onPanning);\n document.body.removeEventListener('touchmove', this._onPanning);\n }\n }\n }, {\n key: '_setChartScale',\n value: function _setChartScale(chart, newScale) {\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n chart.style.transform = 'scale(' + newScale + ',' + newScale + ')';\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[0] = 'matrix(' + newScale;\n matrix[3] = newScale;\n chart.style.transform = lastTf + ' scale(' + newScale + ',' + newScale + ')';\n } else {\n chart.style.transform = lastTf + ' scale3d(' + newScale + ',' + newScale + ', 1)';\n }\n }\n chart.dataset.scale = newScale;\n }\n }, {\n key: '_onWheeling',\n value: function _onWheeling(event) {\n event.preventDefault();\n\n var newScale = event.deltaY > 0 ? 0.8 : 1.2;\n\n this._setChartScale(this.chart, newScale);\n }\n }, {\n key: '_getPinchDist',\n value: function _getPinchDist(event) {\n return Math.sqrt((event.touches[0].clientX - event.touches[1].clientX) * (event.touches[0].clientX - event.touches[1].clientX) + (event.touches[0].clientY - event.touches[1].clientY) * (event.touches[0].clientY - event.touches[1].clientY));\n }\n }, {\n key: '_onTouchStart',\n value: function _onTouchStart(event) {\n var chart = this.chart;\n\n if (event.touches && event.touches.length === 2) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinching = true;\n chart.dataset.pinchDistStart = dist;\n }\n }\n }, {\n key: '_onTouchMove',\n value: function _onTouchMove(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinchDistEnd = dist;\n }\n }\n }, {\n key: '_onTouchEnd',\n value: function _onTouchEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n chart.dataset.pinching = false;\n var diff = chart.dataset.pinchDistEnd - chart.dataset.pinchDistStart;\n\n if (diff > 0) {\n this._setChartScale(chart, 1);\n } else if (diff < 0) {\n this._setChartScale(chart, -1);\n }\n }\n }\n }, {\n key: 'name',\n get: function get$$1() {\n return this._name;\n }\n }]);\n return OrgChart;\n}();\n\n/**\n * Removes all key-value entries from the list cache.\n *\n * @private\n * @name clear\n * @memberOf ListCache\n */\nfunction listCacheClear() {\n this.__data__ = [];\n this.size = 0;\n}\n\n/**\n * Performs a\n * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * comparison between two values to determine if they are equivalent.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to compare.\n * @param {*} other The other value to compare.\n * @returns {boolean} Returns `true` if the values are equivalent, else `false`.\n * @example\n *\n * var object = { 'a': 1 };\n * var other = { 'a': 1 };\n *\n * _.eq(object, object);\n * // => true\n *\n * _.eq(object, other);\n * // => false\n *\n * _.eq('a', 'a');\n * // => true\n *\n * _.eq('a', Object('a'));\n * // => false\n *\n * _.eq(NaN, NaN);\n * // => true\n */\nfunction eq(value, other) {\n return value === other || (value !== value && other !== other);\n}\n\n/**\n * Gets the index at which the `key` is found in `array` of key-value pairs.\n *\n * @private\n * @param {Array} array The array to inspect.\n * @param {*} key The key to search for.\n * @returns {number} Returns the index of the matched value, else `-1`.\n */\nfunction assocIndexOf(array, key) {\n var length = array.length;\n while (length--) {\n if (eq(array[length][0], key)) {\n return length;\n }\n }\n return -1;\n}\n\n/** Used for built-in method references. */\nvar arrayProto = Array.prototype;\n\n/** Built-in value references. */\nvar splice = arrayProto.splice;\n\n/**\n * Removes `key` and its value from the list cache.\n *\n * @private\n * @name delete\n * @memberOf ListCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction listCacheDelete(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n return false;\n }\n var lastIndex = data.length - 1;\n if (index == lastIndex) {\n data.pop();\n } else {\n splice.call(data, index, 1);\n }\n --this.size;\n return true;\n}\n\n/**\n * Gets the list cache value for `key`.\n *\n * @private\n * @name get\n * @memberOf ListCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction listCacheGet(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n return index < 0 ? undefined : data[index][1];\n}\n\n/**\n * Checks if a list cache value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf ListCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction listCacheHas(key) {\n return assocIndexOf(this.__data__, key) > -1;\n}\n\n/**\n * Sets the list cache `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf ListCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the list cache instance.\n */\nfunction listCacheSet(key, value) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n ++this.size;\n data.push([key, value]);\n } else {\n data[index][1] = value;\n }\n return this;\n}\n\n/**\n * Creates an list cache object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction ListCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `ListCache`.\nListCache.prototype.clear = listCacheClear;\nListCache.prototype['delete'] = listCacheDelete;\nListCache.prototype.get = listCacheGet;\nListCache.prototype.has = listCacheHas;\nListCache.prototype.set = listCacheSet;\n\n/**\n * Removes all key-value entries from the stack.\n *\n * @private\n * @name clear\n * @memberOf Stack\n */\nfunction stackClear() {\n this.__data__ = new ListCache;\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the stack.\n *\n * @private\n * @name delete\n * @memberOf Stack\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction stackDelete(key) {\n var data = this.__data__,\n result = data['delete'](key);\n\n this.size = data.size;\n return result;\n}\n\n/**\n * Gets the stack value for `key`.\n *\n * @private\n * @name get\n * @memberOf Stack\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction stackGet(key) {\n return this.__data__.get(key);\n}\n\n/**\n * Checks if a stack value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Stack\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction stackHas(key) {\n return this.__data__.has(key);\n}\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Built-in value references. */\nvar Symbol$1 = root.Symbol;\n\n/** Used for built-in method references. */\nvar objectProto$1 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$1 = objectProto$1.hasOwnProperty;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString = objectProto$1.toString;\n\n/** Built-in value references. */\nvar symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the raw `toStringTag`.\n */\nfunction getRawTag(value) {\n var isOwn = hasOwnProperty$1.call(value, symToStringTag$1),\n tag = value[symToStringTag$1];\n\n try {\n value[symToStringTag$1] = undefined;\n var unmasked = true;\n } catch (e) {}\n\n var result = nativeObjectToString.call(value);\n if (unmasked) {\n if (isOwn) {\n value[symToStringTag$1] = tag;\n } else {\n delete value[symToStringTag$1];\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$2 = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString$1 = objectProto$2.toString;\n\n/**\n * Converts `value` to a string using `Object.prototype.toString`.\n *\n * @private\n * @param {*} value The value to convert.\n * @returns {string} Returns the converted string.\n */\nfunction objectToString(value) {\n return nativeObjectToString$1.call(value);\n}\n\n/** `Object#toString` result references. */\nvar nullTag = '[object Null]';\nvar undefinedTag = '[object Undefined]';\n\n/** Built-in value references. */\nvar symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * The base implementation of `getTag` without fallbacks for buggy environments.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the `toStringTag`.\n */\nfunction baseGetTag(value) {\n if (value == null) {\n return value === undefined ? undefinedTag : nullTag;\n }\n return (symToStringTag && symToStringTag in Object(value))\n ? getRawTag(value)\n : objectToString(value);\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n var type = typeof value;\n return value != null && (type == 'object' || type == 'function');\n}\n\n/** `Object#toString` result references. */\nvar asyncTag = '[object AsyncFunction]';\nvar funcTag = '[object Function]';\nvar genTag = '[object GeneratorFunction]';\nvar proxyTag = '[object Proxy]';\n\n/**\n * Checks if `value` is classified as a `Function` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a function, else `false`.\n * @example\n *\n * _.isFunction(_);\n * // => true\n *\n * _.isFunction(/abc/);\n * // => false\n */\nfunction isFunction(value) {\n if (!isObject(value)) {\n return false;\n }\n // The use of `Object#toString` avoids issues with the `typeof` operator\n // in Safari 9 which returns 'object' for typed arrays and other constructors.\n var tag = baseGetTag(value);\n return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;\n}\n\n/** Used to detect overreaching core-js shims. */\nvar coreJsData = root['__core-js_shared__'];\n\n/** Used to detect methods masquerading as native. */\nvar maskSrcKey = (function() {\n var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');\n return uid ? ('Symbol(src)_1.' + uid) : '';\n}());\n\n/**\n * Checks if `func` has its source masked.\n *\n * @private\n * @param {Function} func The function to check.\n * @returns {boolean} Returns `true` if `func` is masked, else `false`.\n */\nfunction isMasked(func) {\n return !!maskSrcKey && (maskSrcKey in func);\n}\n\n/** Used for built-in method references. */\nvar funcProto$1 = Function.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$1 = funcProto$1.toString;\n\n/**\n * Converts `func` to its source code.\n *\n * @private\n * @param {Function} func The function to convert.\n * @returns {string} Returns the source code.\n */\nfunction toSource(func) {\n if (func != null) {\n try {\n return funcToString$1.call(func);\n } catch (e) {}\n try {\n return (func + '');\n } catch (e) {}\n }\n return '';\n}\n\n/**\n * Used to match `RegExp`\n * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).\n */\nvar reRegExpChar = /[\\\\^$.*+?()[\\]{}|]/g;\n\n/** Used to detect host constructors (Safari). */\nvar reIsHostCtor = /^\\[object .+?Constructor\\]$/;\n\n/** Used for built-in method references. */\nvar funcProto = Function.prototype;\nvar objectProto = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Used to detect if a method is native. */\nvar reIsNative = RegExp('^' +\n funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\\\$&')\n .replace(/hasOwnProperty|(function).*?(?=\\\\\\()| for .+?(?=\\\\\\])/g, '$1.*?') + '$'\n);\n\n/**\n * The base implementation of `_.isNative` without bad shim checks.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a native function,\n * else `false`.\n */\nfunction baseIsNative(value) {\n if (!isObject(value) || isMasked(value)) {\n return false;\n }\n var pattern = isFunction(value) ? reIsNative : reIsHostCtor;\n return pattern.test(toSource(value));\n}\n\n/**\n * Gets the value at `key` of `object`.\n *\n * @private\n * @param {Object} [object] The object to query.\n * @param {string} key The key of the property to get.\n * @returns {*} Returns the property value.\n */\nfunction getValue(object, key) {\n return object == null ? undefined : object[key];\n}\n\n/**\n * Gets the native function at `key` of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {string} key The key of the method to get.\n * @returns {*} Returns the function if it's native, else `undefined`.\n */\nfunction getNative(object, key) {\n var value = getValue(object, key);\n return baseIsNative(value) ? value : undefined;\n}\n\n/* Built-in method references that are verified to be native. */\nvar Map = getNative(root, 'Map');\n\n/* Built-in method references that are verified to be native. */\nvar nativeCreate = getNative(Object, 'create');\n\n/**\n * Removes all key-value entries from the hash.\n *\n * @private\n * @name clear\n * @memberOf Hash\n */\nfunction hashClear() {\n this.__data__ = nativeCreate ? nativeCreate(null) : {};\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the hash.\n *\n * @private\n * @name delete\n * @memberOf Hash\n * @param {Object} hash The hash to modify.\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction hashDelete(key) {\n var result = this.has(key) && delete this.__data__[key];\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED = '__lodash_hash_undefined__';\n\n/** Used for built-in method references. */\nvar objectProto$3 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$2 = objectProto$3.hasOwnProperty;\n\n/**\n * Gets the hash value for `key`.\n *\n * @private\n * @name get\n * @memberOf Hash\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction hashGet(key) {\n var data = this.__data__;\n if (nativeCreate) {\n var result = data[key];\n return result === HASH_UNDEFINED ? undefined : result;\n }\n return hasOwnProperty$2.call(data, key) ? data[key] : undefined;\n}\n\n/** Used for built-in method references. */\nvar objectProto$4 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$3 = objectProto$4.hasOwnProperty;\n\n/**\n * Checks if a hash value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Hash\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction hashHas(key) {\n var data = this.__data__;\n return nativeCreate ? (data[key] !== undefined) : hasOwnProperty$3.call(data, key);\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED$1 = '__lodash_hash_undefined__';\n\n/**\n * Sets the hash `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Hash\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the hash instance.\n */\nfunction hashSet(key, value) {\n var data = this.__data__;\n this.size += this.has(key) ? 0 : 1;\n data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED$1 : value;\n return this;\n}\n\n/**\n * Creates a hash object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Hash(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `Hash`.\nHash.prototype.clear = hashClear;\nHash.prototype['delete'] = hashDelete;\nHash.prototype.get = hashGet;\nHash.prototype.has = hashHas;\nHash.prototype.set = hashSet;\n\n/**\n * Removes all key-value entries from the map.\n *\n * @private\n * @name clear\n * @memberOf MapCache\n */\nfunction mapCacheClear() {\n this.size = 0;\n this.__data__ = {\n 'hash': new Hash,\n 'map': new (Map || ListCache),\n 'string': new Hash\n };\n}\n\n/**\n * Checks if `value` is suitable for use as unique object key.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is suitable, else `false`.\n */\nfunction isKeyable(value) {\n var type = typeof value;\n return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')\n ? (value !== '__proto__')\n : (value === null);\n}\n\n/**\n * Gets the data for `map`.\n *\n * @private\n * @param {Object} map The map to query.\n * @param {string} key The reference key.\n * @returns {*} Returns the map data.\n */\nfunction getMapData(map, key) {\n var data = map.__data__;\n return isKeyable(key)\n ? data[typeof key == 'string' ? 'string' : 'hash']\n : data.map;\n}\n\n/**\n * Removes `key` and its value from the map.\n *\n * @private\n * @name delete\n * @memberOf MapCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction mapCacheDelete(key) {\n var result = getMapData(this, key)['delete'](key);\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/**\n * Gets the map value for `key`.\n *\n * @private\n * @name get\n * @memberOf MapCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction mapCacheGet(key) {\n return getMapData(this, key).get(key);\n}\n\n/**\n * Checks if a map value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf MapCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction mapCacheHas(key) {\n return getMapData(this, key).has(key);\n}\n\n/**\n * Sets the map `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf MapCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the map cache instance.\n */\nfunction mapCacheSet(key, value) {\n var data = getMapData(this, key),\n size = data.size;\n\n data.set(key, value);\n this.size += data.size == size ? 0 : 1;\n return this;\n}\n\n/**\n * Creates a map cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction MapCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `MapCache`.\nMapCache.prototype.clear = mapCacheClear;\nMapCache.prototype['delete'] = mapCacheDelete;\nMapCache.prototype.get = mapCacheGet;\nMapCache.prototype.has = mapCacheHas;\nMapCache.prototype.set = mapCacheSet;\n\n/** Used as the size to enable large array optimizations. */\nvar LARGE_ARRAY_SIZE = 200;\n\n/**\n * Sets the stack `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Stack\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the stack cache instance.\n */\nfunction stackSet(key, value) {\n var data = this.__data__;\n if (data instanceof ListCache) {\n var pairs = data.__data__;\n if (!Map || (pairs.length < LARGE_ARRAY_SIZE - 1)) {\n pairs.push([key, value]);\n this.size = ++data.size;\n return this;\n }\n data = this.__data__ = new MapCache(pairs);\n }\n data.set(key, value);\n this.size = data.size;\n return this;\n}\n\n/**\n * Creates a stack cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Stack(entries) {\n var data = this.__data__ = new ListCache(entries);\n this.size = data.size;\n}\n\n// Add methods to `Stack`.\nStack.prototype.clear = stackClear;\nStack.prototype['delete'] = stackDelete;\nStack.prototype.get = stackGet;\nStack.prototype.has = stackHas;\nStack.prototype.set = stackSet;\n\nvar defineProperty$1 = (function() {\n try {\n var func = getNative(Object, 'defineProperty');\n func({}, '', {});\n return func;\n } catch (e) {}\n}());\n\n/**\n * The base implementation of `assignValue` and `assignMergeValue` without\n * value checks.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction baseAssignValue(object, key, value) {\n if (key == '__proto__' && defineProperty$1) {\n defineProperty$1(object, key, {\n 'configurable': true,\n 'enumerable': true,\n 'value': value,\n 'writable': true\n });\n } else {\n object[key] = value;\n }\n}\n\n/**\n * This function is like `assignValue` except that it doesn't assign\n * `undefined` values.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignMergeValue(object, key, value) {\n if ((value !== undefined && !eq(object[key], value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Creates a base function for methods like `_.forIn` and `_.forOwn`.\n *\n * @private\n * @param {boolean} [fromRight] Specify iterating from right to left.\n * @returns {Function} Returns the new base function.\n */\nfunction createBaseFor(fromRight) {\n return function(object, iteratee, keysFunc) {\n var index = -1,\n iterable = Object(object),\n props = keysFunc(object),\n length = props.length;\n\n while (length--) {\n var key = props[fromRight ? length : ++index];\n if (iteratee(iterable[key], key, iterable) === false) {\n break;\n }\n }\n return object;\n };\n}\n\n/**\n * The base implementation of `baseForOwn` which iterates over `object`\n * properties returned by `keysFunc` and invokes `iteratee` for each property.\n * Iteratee functions may exit iteration early by explicitly returning `false`.\n *\n * @private\n * @param {Object} object The object to iterate over.\n * @param {Function} iteratee The function invoked per iteration.\n * @param {Function} keysFunc The function to get the keys of `object`.\n * @returns {Object} Returns `object`.\n */\nvar baseFor = createBaseFor();\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Built-in value references. */\nvar Buffer = moduleExports ? root.Buffer : undefined;\nvar allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined;\n\n/**\n * Creates a clone of `buffer`.\n *\n * @private\n * @param {Buffer} buffer The buffer to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Buffer} Returns the cloned buffer.\n */\nfunction cloneBuffer(buffer, isDeep) {\n if (isDeep) {\n return buffer.slice();\n }\n var length = buffer.length,\n result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);\n\n buffer.copy(result);\n return result;\n}\n\n/** Built-in value references. */\nvar Uint8Array = root.Uint8Array;\n\n/**\n * Creates a clone of `arrayBuffer`.\n *\n * @private\n * @param {ArrayBuffer} arrayBuffer The array buffer to clone.\n * @returns {ArrayBuffer} Returns the cloned array buffer.\n */\nfunction cloneArrayBuffer(arrayBuffer) {\n var result = new arrayBuffer.constructor(arrayBuffer.byteLength);\n new Uint8Array(result).set(new Uint8Array(arrayBuffer));\n return result;\n}\n\n/**\n * Creates a clone of `typedArray`.\n *\n * @private\n * @param {Object} typedArray The typed array to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Object} Returns the cloned typed array.\n */\nfunction cloneTypedArray(typedArray, isDeep) {\n var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;\n return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);\n}\n\n/**\n * Copies the values of `source` to `array`.\n *\n * @private\n * @param {Array} source The array to copy values from.\n * @param {Array} [array=[]] The array to copy values to.\n * @returns {Array} Returns `array`.\n */\nfunction copyArray(source, array) {\n var index = -1,\n length = source.length;\n\n array || (array = Array(length));\n while (++index < length) {\n array[index] = source[index];\n }\n return array;\n}\n\n/** Built-in value references. */\nvar objectCreate = Object.create;\n\n/**\n * The base implementation of `_.create` without support for assigning\n * properties to the created object.\n *\n * @private\n * @param {Object} proto The object to inherit from.\n * @returns {Object} Returns the new object.\n */\nvar baseCreate = (function() {\n function object() {}\n return function(proto) {\n if (!isObject(proto)) {\n return {};\n }\n if (objectCreate) {\n return objectCreate(proto);\n }\n object.prototype = proto;\n var result = new object;\n object.prototype = undefined;\n return result;\n };\n}());\n\n/**\n * Creates a unary function that invokes `func` with its argument transformed.\n *\n * @private\n * @param {Function} func The function to wrap.\n * @param {Function} transform The argument transform.\n * @returns {Function} Returns the new function.\n */\nfunction overArg(func, transform) {\n return function(arg) {\n return func(transform(arg));\n };\n}\n\n/** Built-in value references. */\nvar getPrototype = overArg(Object.getPrototypeOf, Object);\n\n/** Used for built-in method references. */\nvar objectProto$5 = Object.prototype;\n\n/**\n * Checks if `value` is likely a prototype object.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.\n */\nfunction isPrototype(value) {\n var Ctor = value && value.constructor,\n proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$5;\n\n return value === proto;\n}\n\n/**\n * Initializes an object clone.\n *\n * @private\n * @param {Object} object The object to clone.\n * @returns {Object} Returns the initialized clone.\n */\nfunction initCloneObject(object) {\n return (typeof object.constructor == 'function' && !isPrototype(object))\n ? baseCreate(getPrototype(object))\n : {};\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n return value != null && typeof value == 'object';\n}\n\n/** `Object#toString` result references. */\nvar argsTag = '[object Arguments]';\n\n/**\n * The base implementation of `_.isArguments`.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n */\nfunction baseIsArguments(value) {\n return isObjectLike(value) && baseGetTag(value) == argsTag;\n}\n\n/** Used for built-in method references. */\nvar objectProto$6 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$4 = objectProto$6.hasOwnProperty;\n\n/** Built-in value references. */\nvar propertyIsEnumerable = objectProto$6.propertyIsEnumerable;\n\n/**\n * Checks if `value` is likely an `arguments` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n * else `false`.\n * @example\n *\n * _.isArguments(function() { return arguments; }());\n * // => true\n *\n * _.isArguments([1, 2, 3]);\n * // => false\n */\nvar isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {\n return isObjectLike(value) && hasOwnProperty$4.call(value, 'callee') &&\n !propertyIsEnumerable.call(value, 'callee');\n};\n\n/**\n * Checks if `value` is classified as an `Array` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array, else `false`.\n * @example\n *\n * _.isArray([1, 2, 3]);\n * // => true\n *\n * _.isArray(document.body.children);\n * // => false\n *\n * _.isArray('abc');\n * // => false\n *\n * _.isArray(_.noop);\n * // => false\n */\nvar isArray = Array.isArray;\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER = 9007199254740991;\n\n/**\n * Checks if `value` is a valid array-like length.\n *\n * **Note:** This method is loosely based on\n * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.\n * @example\n *\n * _.isLength(3);\n * // => true\n *\n * _.isLength(Number.MIN_VALUE);\n * // => false\n *\n * _.isLength(Infinity);\n * // => false\n *\n * _.isLength('3');\n * // => false\n */\nfunction isLength(value) {\n return typeof value == 'number' &&\n value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;\n}\n\n/**\n * Checks if `value` is array-like. A value is considered array-like if it's\n * not a function and has a `value.length` that's an integer greater than or\n * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is array-like, else `false`.\n * @example\n *\n * _.isArrayLike([1, 2, 3]);\n * // => true\n *\n * _.isArrayLike(document.body.children);\n * // => true\n *\n * _.isArrayLike('abc');\n * // => true\n *\n * _.isArrayLike(_.noop);\n * // => false\n */\nfunction isArrayLike(value) {\n return value != null && isLength(value.length) && !isFunction(value);\n}\n\n/**\n * This method is like `_.isArrayLike` except that it also checks if `value`\n * is an object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array-like object,\n * else `false`.\n * @example\n *\n * _.isArrayLikeObject([1, 2, 3]);\n * // => true\n *\n * _.isArrayLikeObject(document.body.children);\n * // => true\n *\n * _.isArrayLikeObject('abc');\n * // => false\n *\n * _.isArrayLikeObject(_.noop);\n * // => false\n */\nfunction isArrayLikeObject(value) {\n return isObjectLike(value) && isArrayLike(value);\n}\n\n/**\n * This method returns `false`.\n *\n * @static\n * @memberOf _\n * @since 4.13.0\n * @category Util\n * @returns {boolean} Returns `false`.\n * @example\n *\n * _.times(2, _.stubFalse);\n * // => [false, false]\n */\nfunction stubFalse() {\n return false;\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$1 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$1 = freeExports$1 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;\n\n/** Built-in value references. */\nvar Buffer$1 = moduleExports$1 ? root.Buffer : undefined;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeIsBuffer = Buffer$1 ? Buffer$1.isBuffer : undefined;\n\n/**\n * Checks if `value` is a buffer.\n *\n * @static\n * @memberOf _\n * @since 4.3.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.\n * @example\n *\n * _.isBuffer(new Buffer(2));\n * // => true\n *\n * _.isBuffer(new Uint8Array(2));\n * // => false\n */\nvar isBuffer = nativeIsBuffer || stubFalse;\n\n/** `Object#toString` result references. */\nvar objectTag = '[object Object]';\n\n/** Used for built-in method references. */\nvar funcProto$2 = Function.prototype;\nvar objectProto$7 = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$2 = funcProto$2.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$5 = objectProto$7.hasOwnProperty;\n\n/** Used to infer the `Object` constructor. */\nvar objectCtorString = funcToString$2.call(Object);\n\n/**\n * Checks if `value` is a plain object, that is, an object created by the\n * `Object` constructor or one with a `[[Prototype]]` of `null`.\n *\n * @static\n * @memberOf _\n * @since 0.8.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * }\n *\n * _.isPlainObject(new Foo);\n * // => false\n *\n * _.isPlainObject([1, 2, 3]);\n * // => false\n *\n * _.isPlainObject({ 'x': 0, 'y': 0 });\n * // => true\n *\n * _.isPlainObject(Object.create(null));\n * // => true\n */\nfunction isPlainObject(value) {\n if (!isObjectLike(value) || baseGetTag(value) != objectTag) {\n return false;\n }\n var proto = getPrototype(value);\n if (proto === null) {\n return true;\n }\n var Ctor = hasOwnProperty$5.call(proto, 'constructor') && proto.constructor;\n return typeof Ctor == 'function' && Ctor instanceof Ctor &&\n funcToString$2.call(Ctor) == objectCtorString;\n}\n\n/** `Object#toString` result references. */\nvar argsTag$1 = '[object Arguments]';\nvar arrayTag = '[object Array]';\nvar boolTag = '[object Boolean]';\nvar dateTag = '[object Date]';\nvar errorTag = '[object Error]';\nvar funcTag$1 = '[object Function]';\nvar mapTag = '[object Map]';\nvar numberTag = '[object Number]';\nvar objectTag$1 = '[object Object]';\nvar regexpTag = '[object RegExp]';\nvar setTag = '[object Set]';\nvar stringTag = '[object String]';\nvar weakMapTag = '[object WeakMap]';\n\nvar arrayBufferTag = '[object ArrayBuffer]';\nvar dataViewTag = '[object DataView]';\nvar float32Tag = '[object Float32Array]';\nvar float64Tag = '[object Float64Array]';\nvar int8Tag = '[object Int8Array]';\nvar int16Tag = '[object Int16Array]';\nvar int32Tag = '[object Int32Array]';\nvar uint8Tag = '[object Uint8Array]';\nvar uint8ClampedTag = '[object Uint8ClampedArray]';\nvar uint16Tag = '[object Uint16Array]';\nvar uint32Tag = '[object Uint32Array]';\n\n/** Used to identify `toStringTag` values of typed arrays. */\nvar typedArrayTags = {};\ntypedArrayTags[float32Tag] = typedArrayTags[float64Tag] =\ntypedArrayTags[int8Tag] = typedArrayTags[int16Tag] =\ntypedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =\ntypedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =\ntypedArrayTags[uint32Tag] = true;\ntypedArrayTags[argsTag$1] = typedArrayTags[arrayTag] =\ntypedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =\ntypedArrayTags[dataViewTag] = typedArrayTags[dateTag] =\ntypedArrayTags[errorTag] = typedArrayTags[funcTag$1] =\ntypedArrayTags[mapTag] = typedArrayTags[numberTag] =\ntypedArrayTags[objectTag$1] = typedArrayTags[regexpTag] =\ntypedArrayTags[setTag] = typedArrayTags[stringTag] =\ntypedArrayTags[weakMapTag] = false;\n\n/**\n * The base implementation of `_.isTypedArray` without Node.js optimizations.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n */\nfunction baseIsTypedArray(value) {\n return isObjectLike(value) &&\n isLength(value.length) && !!typedArrayTags[baseGetTag(value)];\n}\n\n/**\n * The base implementation of `_.unary` without support for storing metadata.\n *\n * @private\n * @param {Function} func The function to cap arguments for.\n * @returns {Function} Returns the new capped function.\n */\nfunction baseUnary(func) {\n return function(value) {\n return func(value);\n };\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$2 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$2 = freeExports$2 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$2 = freeModule$2 && freeModule$2.exports === freeExports$2;\n\n/** Detect free variable `process` from Node.js. */\nvar freeProcess = moduleExports$2 && freeGlobal.process;\n\n/** Used to access faster Node.js helpers. */\nvar nodeUtil = (function() {\n try {\n return freeProcess && freeProcess.binding && freeProcess.binding('util');\n } catch (e) {}\n}());\n\n/* Node.js helper references. */\nvar nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;\n\n/**\n * Checks if `value` is classified as a typed array.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n * @example\n *\n * _.isTypedArray(new Uint8Array);\n * // => true\n *\n * _.isTypedArray([]);\n * // => false\n */\nvar isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;\n\n/** Used for built-in method references. */\nvar objectProto$8 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$6 = objectProto$8.hasOwnProperty;\n\n/**\n * Assigns `value` to `key` of `object` if the existing value is not equivalent\n * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * for equality comparisons.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignValue(object, key, value) {\n var objValue = object[key];\n if (!(hasOwnProperty$6.call(object, key) && eq(objValue, value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Copies properties of `source` to `object`.\n *\n * @private\n * @param {Object} source The object to copy properties from.\n * @param {Array} props The property identifiers to copy.\n * @param {Object} [object={}] The object to copy properties to.\n * @param {Function} [customizer] The function to customize copied values.\n * @returns {Object} Returns `object`.\n */\nfunction copyObject(source, props, object, customizer) {\n var isNew = !object;\n object || (object = {});\n\n var index = -1,\n length = props.length;\n\n while (++index < length) {\n var key = props[index];\n\n var newValue = customizer\n ? customizer(object[key], source[key], key, object, source)\n : undefined;\n\n if (newValue === undefined) {\n newValue = source[key];\n }\n if (isNew) {\n baseAssignValue(object, key, newValue);\n } else {\n assignValue(object, key, newValue);\n }\n }\n return object;\n}\n\n/**\n * The base implementation of `_.times` without support for iteratee shorthands\n * or max array length checks.\n *\n * @private\n * @param {number} n The number of times to invoke `iteratee`.\n * @param {Function} iteratee The function invoked per iteration.\n * @returns {Array} Returns the array of results.\n */\nfunction baseTimes(n, iteratee) {\n var index = -1,\n result = Array(n);\n\n while (++index < n) {\n result[index] = iteratee(index);\n }\n return result;\n}\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER$1 = 9007199254740991;\n\n/** Used to detect unsigned integer values. */\nvar reIsUint = /^(?:0|[1-9]\\d*)$/;\n\n/**\n * Checks if `value` is a valid array-like index.\n *\n * @private\n * @param {*} value The value to check.\n * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.\n * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.\n */\nfunction isIndex(value, length) {\n length = length == null ? MAX_SAFE_INTEGER$1 : length;\n return !!length &&\n (typeof value == 'number' || reIsUint.test(value)) &&\n (value > -1 && value % 1 == 0 && value < length);\n}\n\n/** Used for built-in method references. */\nvar objectProto$9 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$7 = objectProto$9.hasOwnProperty;\n\n/**\n * Creates an array of the enumerable property names of the array-like `value`.\n *\n * @private\n * @param {*} value The value to query.\n * @param {boolean} inherited Specify returning inherited property names.\n * @returns {Array} Returns the array of property names.\n */\nfunction arrayLikeKeys(value, inherited) {\n var isArr = isArray(value),\n isArg = !isArr && isArguments(value),\n isBuff = !isArr && !isArg && isBuffer(value),\n isType = !isArr && !isArg && !isBuff && isTypedArray(value),\n skipIndexes = isArr || isArg || isBuff || isType,\n result = skipIndexes ? baseTimes(value.length, String) : [],\n length = result.length;\n\n for (var key in value) {\n if ((inherited || hasOwnProperty$7.call(value, key)) &&\n !(skipIndexes && (\n // Safari 9 has enumerable `arguments.length` in strict mode.\n key == 'length' ||\n // Node.js 0.10 has enumerable non-index properties on buffers.\n (isBuff && (key == 'offset' || key == 'parent')) ||\n // PhantomJS 2 has enumerable non-index properties on typed arrays.\n (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||\n // Skip index properties.\n isIndex(key, length)\n ))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * This function is like\n * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)\n * except that it includes inherited enumerable properties.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction nativeKeysIn(object) {\n var result = [];\n if (object != null) {\n for (var key in Object(object)) {\n result.push(key);\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$10 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$8 = objectProto$10.hasOwnProperty;\n\n/**\n * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction baseKeysIn(object) {\n if (!isObject(object)) {\n return nativeKeysIn(object);\n }\n var isProto = isPrototype(object),\n result = [];\n\n for (var key in object) {\n if (!(key == 'constructor' && (isProto || !hasOwnProperty$8.call(object, key)))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * Creates an array of the own and inherited enumerable property names of `object`.\n *\n * **Note:** Non-object values are coerced to objects.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Object\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.keysIn(new Foo);\n * // => ['a', 'b', 'c'] (iteration order is not guaranteed)\n */\nfunction keysIn(object) {\n return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);\n}\n\n/**\n * Converts `value` to a plain object flattening inherited enumerable string\n * keyed properties of `value` to own properties of the plain object.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to convert.\n * @returns {Object} Returns the converted plain object.\n * @example\n *\n * function Foo() {\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.assign({ 'a': 1 }, new Foo);\n * // => { 'a': 1, 'b': 2 }\n *\n * _.assign({ 'a': 1 }, _.toPlainObject(new Foo));\n * // => { 'a': 1, 'b': 2, 'c': 3 }\n */\nfunction toPlainObject(value) {\n return copyObject(value, keysIn(value));\n}\n\n/**\n * A specialized version of `baseMerge` for arrays and objects which performs\n * deep merges and tracks traversed objects enabling objects with circular\n * references to be merged.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {string} key The key of the value to merge.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} mergeFunc The function to merge values.\n * @param {Function} [customizer] The function to customize assigned values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {\n var objValue = object[key],\n srcValue = source[key],\n stacked = stack.get(srcValue);\n\n if (stacked) {\n assignMergeValue(object, key, stacked);\n return;\n }\n var newValue = customizer\n ? customizer(objValue, srcValue, (key + ''), object, source, stack)\n : undefined;\n\n var isCommon = newValue === undefined;\n\n if (isCommon) {\n var isArr = isArray(srcValue),\n isBuff = !isArr && isBuffer(srcValue),\n isTyped = !isArr && !isBuff && isTypedArray(srcValue);\n\n newValue = srcValue;\n if (isArr || isBuff || isTyped) {\n if (isArray(objValue)) {\n newValue = objValue;\n }\n else if (isArrayLikeObject(objValue)) {\n newValue = copyArray(objValue);\n }\n else if (isBuff) {\n isCommon = false;\n newValue = cloneBuffer(srcValue, true);\n }\n else if (isTyped) {\n isCommon = false;\n newValue = cloneTypedArray(srcValue, true);\n }\n else {\n newValue = [];\n }\n }\n else if (isPlainObject(srcValue) || isArguments(srcValue)) {\n newValue = objValue;\n if (isArguments(objValue)) {\n newValue = toPlainObject(objValue);\n }\n else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {\n newValue = initCloneObject(srcValue);\n }\n }\n else {\n isCommon = false;\n }\n }\n if (isCommon) {\n // Recursively merge objects and arrays (susceptible to call stack limits).\n stack.set(srcValue, newValue);\n mergeFunc(newValue, srcValue, srcIndex, customizer, stack);\n stack['delete'](srcValue);\n }\n assignMergeValue(object, key, newValue);\n}\n\n/**\n * The base implementation of `_.merge` without support for multiple sources.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} [customizer] The function to customize merged values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMerge(object, source, srcIndex, customizer, stack) {\n if (object === source) {\n return;\n }\n baseFor(source, function(srcValue, key) {\n if (isObject(srcValue)) {\n stack || (stack = new Stack);\n baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);\n }\n else {\n var newValue = customizer\n ? customizer(object[key], srcValue, (key + ''), object, source, stack)\n : undefined;\n\n if (newValue === undefined) {\n newValue = srcValue;\n }\n assignMergeValue(object, key, newValue);\n }\n }, keysIn);\n}\n\n/**\n * This method returns the first argument it receives.\n *\n * @static\n * @since 0.1.0\n * @memberOf _\n * @category Util\n * @param {*} value Any value.\n * @returns {*} Returns `value`.\n * @example\n *\n * var object = { 'a': 1 };\n *\n * console.log(_.identity(object) === object);\n * // => true\n */\nfunction identity(value) {\n return value;\n}\n\n/**\n * A faster alternative to `Function#apply`, this function invokes `func`\n * with the `this` binding of `thisArg` and the arguments of `args`.\n *\n * @private\n * @param {Function} func The function to invoke.\n * @param {*} thisArg The `this` binding of `func`.\n * @param {Array} args The arguments to invoke `func` with.\n * @returns {*} Returns the result of `func`.\n */\nfunction apply(func, thisArg, args) {\n switch (args.length) {\n case 0: return func.call(thisArg);\n case 1: return func.call(thisArg, args[0]);\n case 2: return func.call(thisArg, args[0], args[1]);\n case 3: return func.call(thisArg, args[0], args[1], args[2]);\n }\n return func.apply(thisArg, args);\n}\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max;\n\n/**\n * A specialized version of `baseRest` which transforms the rest array.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @param {Function} transform The rest array transform.\n * @returns {Function} Returns the new function.\n */\nfunction overRest(func, start, transform) {\n start = nativeMax(start === undefined ? (func.length - 1) : start, 0);\n return function() {\n var args = arguments,\n index = -1,\n length = nativeMax(args.length - start, 0),\n array = Array(length);\n\n while (++index < length) {\n array[index] = args[start + index];\n }\n index = -1;\n var otherArgs = Array(start + 1);\n while (++index < start) {\n otherArgs[index] = args[index];\n }\n otherArgs[start] = transform(array);\n return apply(func, this, otherArgs);\n };\n}\n\n/**\n * Creates a function that returns `value`.\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Util\n * @param {*} value The value to return from the new function.\n * @returns {Function} Returns the new constant function.\n * @example\n *\n * var objects = _.times(2, _.constant({ 'a': 1 }));\n *\n * console.log(objects);\n * // => [{ 'a': 1 }, { 'a': 1 }]\n *\n * console.log(objects[0] === objects[1]);\n * // => true\n */\nfunction constant(value) {\n return function() {\n return value;\n };\n}\n\n/**\n * The base implementation of `setToString` without support for hot loop shorting.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar baseSetToString = !defineProperty$1 ? identity : function(func, string) {\n return defineProperty$1(func, 'toString', {\n 'configurable': true,\n 'enumerable': false,\n 'value': constant(string),\n 'writable': true\n });\n};\n\n/** Used to detect hot functions by number of calls within a span of milliseconds. */\nvar HOT_COUNT = 800;\nvar HOT_SPAN = 16;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeNow = Date.now;\n\n/**\n * Creates a function that'll short out and invoke `identity` instead\n * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`\n * milliseconds.\n *\n * @private\n * @param {Function} func The function to restrict.\n * @returns {Function} Returns the new shortable function.\n */\nfunction shortOut(func) {\n var count = 0,\n lastCalled = 0;\n\n return function() {\n var stamp = nativeNow(),\n remaining = HOT_SPAN - (stamp - lastCalled);\n\n lastCalled = stamp;\n if (remaining > 0) {\n if (++count >= HOT_COUNT) {\n return arguments[0];\n }\n } else {\n count = 0;\n }\n return func.apply(undefined, arguments);\n };\n}\n\n/**\n * Sets the `toString` method of `func` to return `string`.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar setToString = shortOut(baseSetToString);\n\n/**\n * The base implementation of `_.rest` which doesn't validate or coerce arguments.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @returns {Function} Returns the new function.\n */\nfunction baseRest(func, start) {\n return setToString(overRest(func, start, identity), func + '');\n}\n\n/**\n * Checks if the given arguments are from an iteratee call.\n *\n * @private\n * @param {*} value The potential iteratee value argument.\n * @param {*} index The potential iteratee index or key argument.\n * @param {*} object The potential iteratee object argument.\n * @returns {boolean} Returns `true` if the arguments are from an iteratee call,\n * else `false`.\n */\nfunction isIterateeCall(value, index, object) {\n if (!isObject(object)) {\n return false;\n }\n var type = typeof index;\n if (type == 'number'\n ? (isArrayLike(object) && isIndex(index, object.length))\n : (type == 'string' && index in object)\n ) {\n return eq(object[index], value);\n }\n return false;\n}\n\n/**\n * Creates a function like `_.assign`.\n *\n * @private\n * @param {Function} assigner The function to assign values.\n * @returns {Function} Returns the new assigner function.\n */\nfunction createAssigner(assigner) {\n return baseRest(function(object, sources) {\n var index = -1,\n length = sources.length,\n customizer = length > 1 ? sources[length - 1] : undefined,\n guard = length > 2 ? sources[2] : undefined;\n\n customizer = (assigner.length > 3 && typeof customizer == 'function')\n ? (length--, customizer)\n : undefined;\n\n if (guard && isIterateeCall(sources[0], sources[1], guard)) {\n customizer = length < 3 ? undefined : customizer;\n length = 1;\n }\n object = Object(object);\n while (++index < length) {\n var source = sources[index];\n if (source) {\n assigner(object, source, index, customizer);\n }\n }\n return object;\n });\n}\n\n/**\n * This method is like `_.assign` except that it recursively merges own and\n * inherited enumerable string keyed properties of source objects into the\n * destination object. Source properties that resolve to `undefined` are\n * skipped if a destination value exists. Array and plain object properties\n * are merged recursively. Other objects and value types are overridden by\n * assignment. Source objects are applied from left to right. Subsequent\n * sources overwrite property assignments of previous sources.\n *\n * **Note:** This method mutates `object`.\n *\n * @static\n * @memberOf _\n * @since 0.5.0\n * @category Object\n * @param {Object} object The destination object.\n * @param {...Object} [sources] The source objects.\n * @returns {Object} Returns `object`.\n * @example\n *\n * var object = {\n * 'a': [{ 'b': 2 }, { 'd': 4 }]\n * };\n *\n * var other = {\n * 'a': [{ 'c': 3 }, { 'e': 5 }]\n * };\n *\n * _.merge(object, other);\n * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }\n */\nvar merge = createAssigner(function(object, source, srcIndex) {\n baseMerge(object, source, srcIndex);\n});\n\nvar mergeOptions = function mergeOptions(obj, src) {\n return merge(obj, src);\n};\n\nvar VoBasic = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-basic\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'orgchart',\n props: {\n data: { type: Object, default: function _default() {\n return {};\n }\n },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n 'chartContainer': '#chart-container'\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nvar closest = function closest(el, fn) {\n return el && (fn(el) && el !== document.querySelector('.orgchart') ? el : closest(el.parentNode, fn));\n};\n\n\n\n\n\nvar bindEventHandler = function bindEventHandler(selector, type, fn, parentSelector) {\n if (parentSelector) {\n document.querySelector(parentSelector).addEventListener(type, function (event) {\n if (event.target.classList && event.target.classList.contains(selector.slice(1)) || closest(event.target, function (el) {\n return el.classList && el.classList.contains(selector.slice(1));\n })) {\n fn(event);\n }\n });\n } else {\n document.querySelectorAll(selector).forEach(function (element) {\n element.addEventListener(type, fn);\n });\n }\n};\n\nvar clickNode = function clickNode(event) {\n var sNode = closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n var sNodeInput = document.getElementById('selected-node');\n\n sNodeInput.value = sNode.querySelector('.title').textContent;\n sNodeInput.dataset.node = sNode.id;\n};\n\nvar clickChart = function clickChart(event) {\n if (!closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n })) {\n document.getElementById('selected-node').textContent = '';\n }\n};\n\n\n\n\n\n\n\n\n\n\n\nvar getId = function getId() {\n return new Date().getTime() * 1000 + Math.floor(Math.random() * 1001);\n};\n\nvar VoEdit = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-edit\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'VoEdit',\n props: {\n data: { type: Object },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n chartContainer: '#chart-container',\n createNode: function createNode(node, data) {\n node.id = getId();\n }\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n this.$nextTick(function () {\n bindEventHandler('.node', 'click', clickNode, '#chart-container');\n bindEventHandler('.orgchart', 'click', clickChart, '#chart-container');\n });\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nif (typeof window !== 'undefined' && window.Vue) {\n window.Vue.component('vo-basic', VoBasic);\n window.Vue.component('vo-edit', VoEdit);\n}\n\nexports.VoBasic = VoBasic;\nexports.VoEdit = VoEdit;\n" }, { "path": "dist/vue-orgchart.esm.js", "content": "var _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n return typeof obj;\n} : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n};\n\n\n\n\n\n\n\n\n\n\n\nvar classCallCheck = function (instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n};\n\nvar createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\n\n\n\n\n\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar toConsumableArray = function (arr) {\n if (Array.isArray(arr)) {\n for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];\n\n return arr2;\n } else {\n return Array.from(arr);\n }\n};\n\nvar OrgChart$1 = function () {\n function OrgChart(options) {\n classCallCheck(this, OrgChart);\n\n this._name = 'OrgChart';\n Promise.prototype.finally = function (callback) {\n var P = this.constructor;\n\n return this.then(function (value) {\n return P.resolve(callback()).then(function () {\n return value;\n });\n }, function (reason) {\n return P.resolve(callback()).then(function () {\n throw reason;\n });\n });\n };\n\n var that = this,\n defaultOptions = {\n 'nodeTitle': 'name',\n 'nodeId': 'id',\n 'toggleSiblingsResp': false,\n 'depth': 999,\n 'chartClass': '',\n 'exportButton': false,\n 'exportButtonName': 'Export',\n 'exportFilename': 'OrgChart',\n 'parentNodeSymbol': '',\n 'draggable': false,\n 'direction': 't2b',\n 'pan': false,\n 'zoom': false,\n 'toggleCollapse': true\n },\n opts = _extends(defaultOptions, options),\n data = opts.data,\n chart = document.createElement('div'),\n chartContainer = document.querySelector(opts.chartContainer);\n\n this.options = opts;\n delete this.options.data;\n this.chart = chart;\n this.chartContainer = chartContainer;\n chart.dataset.options = JSON.stringify(opts);\n chart.setAttribute('class', 'orgchart' + (opts.chartClass !== '' ? ' ' + opts.chartClass : '') + (opts.direction !== 't2b' ? ' ' + opts.direction : ''));\n if ((typeof data === 'undefined' ? 'undefined' : _typeof(data)) === 'object') {\n // local json datasource\n this.buildHierarchy(chart, opts.ajaxURL ? data : this._attachRel(data, '00'), 0);\n } else if (typeof data === 'string' && data.startsWith('#')) {\n // ul datasource\n this.buildHierarchy(chart, this._buildJsonDS(document.querySelector(data).children[0]), 0);\n } else {\n // ajax datasource\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n chart.appendChild(spinner);\n this._getJSON(data).then(function (resp) {\n that.buildHierarchy(chart, opts.ajaxURL ? resp : that._attachRel(resp, '00'), 0);\n }).catch(function (err) {\n console.error('failed to fetch datasource for orgchart', err);\n }).finally(function () {\n var spinner = chart.querySelector('.spinner');\n\n spinner.parentNode.removeChild(spinner);\n });\n }\n chart.addEventListener('click', this._clickChart.bind(this));\n // append the export button to the chart-container\n if (opts.exportButton && !chartContainer.querySelector('.oc-export-btn')) {\n var exportBtn = document.createElement('button'),\n downloadBtn = document.createElement('a');\n\n exportBtn.setAttribute('class', 'oc-export-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n opts.exportButtonName === 'Export' ? exportBtn.innerHTML = 'Export' : exportBtn.innerHTML = '' + opts.exportButtonName;\n exportBtn.addEventListener('click', this._clickExportButton.bind(this));\n downloadBtn.setAttribute('class', 'oc-download-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n downloadBtn.setAttribute('download', opts.exportFilename + '.png');\n chartContainer.appendChild(exportBtn);\n chartContainer.appendChild(downloadBtn);\n }\n\n if (opts.pan) {\n chartContainer.style.overflow = 'hidden';\n chart.addEventListener('mousedown', this._onPanStart.bind(this));\n chart.addEventListener('touchstart', this._onPanStart.bind(this));\n document.body.addEventListener('mouseup', this._onPanEnd.bind(this));\n document.body.addEventListener('touchend', this._onPanEnd.bind(this));\n }\n\n if (opts.zoom) {\n chartContainer.addEventListener('wheel', this._onWheeling.bind(this));\n chartContainer.addEventListener('touchstart', this._onTouchStart.bind(this));\n document.body.addEventListener('touchmove', this._onTouchMove.bind(this));\n document.body.addEventListener('touchend', this._onTouchEnd.bind(this));\n }\n\n chartContainer.appendChild(chart);\n }\n\n createClass(OrgChart, [{\n key: '_closest',\n value: function _closest(el, fn) {\n return el && (fn(el) && el !== this.chart ? el : this._closest(el.parentNode, fn));\n }\n }, {\n key: '_siblings',\n value: function _siblings(el, expr) {\n return Array.from(el.parentNode.children).filter(function (child) {\n if (child !== el) {\n if (expr) {\n return el.matches(expr);\n }\n return true;\n }\n return false;\n });\n }\n }, {\n key: '_prevAll',\n value: function _prevAll(el, expr) {\n var sibs = [],\n prevSib = el.previousElementSibling;\n\n while (prevSib) {\n if (!expr || prevSib.matches(expr)) {\n sibs.push(prevSib);\n }\n prevSib = prevSib.previousElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_nextAll',\n value: function _nextAll(el, expr) {\n var sibs = [];\n var nextSib = el.nextElementSibling;\n\n while (nextSib) {\n if (!expr || nextSib.matches(expr)) {\n sibs.push(nextSib);\n }\n nextSib = nextSib.nextElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_isVisible',\n value: function _isVisible(el) {\n return el.offsetParent !== null;\n }\n }, {\n key: '_addClass',\n value: function _addClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.add(className);\n });\n } else {\n el.classList.add(classNames);\n }\n });\n }\n }, {\n key: '_removeClass',\n value: function _removeClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.remove(className);\n });\n } else {\n el.classList.remove(classNames);\n }\n });\n }\n }, {\n key: '_css',\n value: function _css(elements, prop, val) {\n elements.forEach(function (el) {\n el.style[prop] = val;\n });\n }\n }, {\n key: '_removeAttr',\n value: function _removeAttr(elements, attr) {\n elements.forEach(function (el) {\n el.removeAttribute(attr);\n });\n }\n }, {\n key: '_one',\n value: function _one(el, type, listener, self) {\n var one = function one(event) {\n try {\n listener.call(self, event);\n } finally {\n el.removeEventListener(type, one);\n }\n };\n\n el && el.addEventListener(type, one);\n }\n }, {\n key: '_getDescElements',\n value: function _getDescElements(ancestors, selector) {\n var results = [];\n\n ancestors.forEach(function (el) {\n return results.push.apply(results, toConsumableArray(el.querySelectorAll(selector)));\n });\n return results;\n }\n }, {\n key: '_getJSON',\n value: function _getJSON(url) {\n return new Promise(function (resolve, reject) {\n var xhr = new XMLHttpRequest();\n\n function handler() {\n if (this.readyState !== 4) {\n return;\n }\n if (this.status === 200) {\n resolve(JSON.parse(this.response));\n } else {\n reject(new Error(this.statusText));\n }\n }\n xhr.open('GET', url);\n xhr.onreadystatechange = handler;\n xhr.responseType = 'json';\n // xhr.setRequestHeader('Accept', 'application/json');\n xhr.setRequestHeader('Content-Type', 'application/json');\n xhr.send();\n });\n }\n }, {\n key: '_buildJsonDS',\n value: function _buildJsonDS(li) {\n var _this = this;\n\n var subObj = {\n 'name': li.firstChild.textContent.trim(),\n 'relationship': (li.parentNode.parentNode.nodeName === 'LI' ? '1' : '0') + (li.parentNode.children.length > 1 ? 1 : 0) + (li.children.length ? 1 : 0)\n };\n\n if (li.id) {\n subObj.id = li.id;\n }\n if (li.querySelector('ul')) {\n Array.from(li.querySelector('ul').children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this._buildJsonDS(el));\n });\n }\n return subObj;\n }\n }, {\n key: '_attachRel',\n value: function _attachRel(data, flags) {\n data.relationship = flags + (data.children && data.children.length > 0 ? 1 : 0);\n if (data.children) {\n var _iteratorNormalCompletion = true;\n var _didIteratorError = false;\n var _iteratorError = undefined;\n\n try {\n for (var _iterator = data.children[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n var item = _step.value;\n\n this._attachRel(item, '1' + (data.children.length > 1 ? 1 : 0));\n }\n } catch (err) {\n _didIteratorError = true;\n _iteratorError = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion && _iterator.return) {\n _iterator.return();\n }\n } finally {\n if (_didIteratorError) {\n throw _iteratorError;\n }\n }\n }\n }\n return data;\n }\n }, {\n key: '_repaint',\n value: function _repaint(node) {\n if (node) {\n node.style.offsetWidth = node.offsetWidth;\n }\n }\n // whether the cursor is hovering over the node\n\n }, {\n key: '_isInAction',\n value: function _isInAction(node) {\n return node.querySelector(':scope > .edge').className.indexOf('fa-') > -1;\n }\n // detect the exist/display state of related node\n\n }, {\n key: '_getNodeState',\n value: function _getNodeState(node, relation) {\n var _this2 = this;\n\n var criteria = void 0,\n state = { 'exist': false, 'visible': false };\n\n if (relation === 'parent') {\n criteria = this._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria.parentNode.children[0])) {\n state.visible = true;\n }\n } else if (relation === 'children') {\n criteria = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).nextElementSibling;\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria)) {\n state.visible = true;\n }\n } else if (relation === 'siblings') {\n criteria = this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n if (criteria.length) {\n state.exist = true;\n }\n if (state.exist && criteria.some(function (el) {\n return _this2._isVisible(el);\n })) {\n state.visible = true;\n }\n }\n\n return state;\n }\n // find the related nodes\n\n }, {\n key: 'getRelatedNodes',\n value: function getRelatedNodes(node, relation) {\n if (relation === 'parent') {\n return this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node');\n } else if (relation === 'children') {\n return Array.from(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children).map(function (el) {\n return el.querySelector('.node');\n });\n } else if (relation === 'siblings') {\n return this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n }\n return [];\n }\n }, {\n key: '_switchHorizontalArrow',\n value: function _switchHorizontalArrow(node) {\n var opts = this.options,\n leftEdge = node.querySelector('.leftEdge'),\n rightEdge = node.querySelector('.rightEdge'),\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (opts.toggleSiblingsResp && (typeof opts.ajaxURL === 'undefined' || this._closest(node, function (el) {\n return el.classList.contains('.nodes');\n }).dataset.siblingsLoaded)) {\n var prevSib = temp.previousElementSibling,\n nextSib = temp.nextElementSibling;\n\n if (prevSib) {\n if (prevSib.classList.contains('hidden')) {\n leftEdge.classList.add('fa-chevron-left');\n leftEdge.classList.remove('fa-chevron-right');\n } else {\n leftEdge.classList.add('fa-chevron-right');\n leftEdge.classList.remove('fa-chevron-left');\n }\n }\n if (nextSib) {\n if (nextSib.classList.contains('hidden')) {\n rightEdge.classList.add('fa-chevron-right');\n rightEdge.classList.remove('fa-chevron-left');\n } else {\n rightEdge.classList.add('fa-chevron-left');\n rightEdge.classList.remove('fa-chevron-right');\n }\n }\n } else {\n var sibs = this._siblings(temp),\n sibsVisible = sibs.length ? !sibs.some(function (el) {\n return el.classList.contains('hidden');\n }) : false;\n\n leftEdge.classList.toggle('fa-chevron-right', sibsVisible);\n leftEdge.classList.toggle('fa-chevron-left', !sibsVisible);\n rightEdge.classList.toggle('fa-chevron-left', sibsVisible);\n rightEdge.classList.toggle('fa-chevron-right', !sibsVisible);\n }\n }\n }, {\n key: '_hoverNode',\n value: function _hoverNode(event) {\n var node = event.target,\n flag = false,\n topEdge = node.querySelector(':scope > .topEdge'),\n bottomEdge = node.querySelector(':scope > .bottomEdge'),\n leftEdge = node.querySelector(':scope > .leftEdge');\n\n if (event.type === 'mouseenter') {\n if (topEdge) {\n flag = this._getNodeState(node, 'parent').visible;\n topEdge.classList.toggle('fa-chevron-up', !flag);\n topEdge.classList.toggle('fa-chevron-down', flag);\n }\n if (bottomEdge) {\n flag = this._getNodeState(node, 'children').visible;\n bottomEdge.classList.toggle('fa-chevron-down', !flag);\n bottomEdge.classList.toggle('fa-chevron-up', flag);\n }\n if (leftEdge) {\n this._switchHorizontalArrow(node);\n }\n } else {\n Array.from(node.querySelectorAll(':scope > .edge')).forEach(function (el) {\n el.classList.remove('fa-chevron-up', 'fa-chevron-down', 'fa-chevron-right', 'fa-chevron-left');\n });\n }\n }\n // define node click event handler\n\n }, {\n key: '_clickNode',\n value: function _clickNode(event) {\n var clickedNode = event.currentTarget,\n focusedNode = this.chart.querySelector('.focused');\n\n if (focusedNode) {\n focusedNode.classList.remove('focused');\n }\n clickedNode.classList.add('focused');\n }\n // build the parent node of specific node\n\n }, {\n key: '_buildParentNode',\n value: function _buildParentNode(currentRoot, nodeData, callback) {\n var that = this,\n table = document.createElement('table');\n\n nodeData.relationship = nodeData.relationship || '001';\n this._createNode(nodeData, 0).then(function (nodeDiv) {\n var chart = that.chart;\n\n nodeDiv.classList.remove('slide-up');\n nodeDiv.classList.add('slide-down');\n var parentTr = document.createElement('tr'),\n superiorLine = document.createElement('tr'),\n inferiorLine = document.createElement('tr'),\n childrenTr = document.createElement('tr');\n\n parentTr.setAttribute('class', 'hidden');\n parentTr.innerHTML = '';\n table.appendChild(parentTr);\n superiorLine.setAttribute('class', 'lines hidden');\n superiorLine.innerHTML = '
';\n table.appendChild(superiorLine);\n inferiorLine.setAttribute('class', 'lines hidden');\n inferiorLine.innerHTML = '  ';\n table.appendChild(inferiorLine);\n childrenTr.setAttribute('class', 'nodes');\n childrenTr.innerHTML = '';\n table.appendChild(childrenTr);\n table.querySelector('td').appendChild(nodeDiv);\n chart.insertBefore(table, chart.children[0]);\n table.children[3].children[0].appendChild(chart.lastChild);\n callback();\n }).catch(function (err) {\n console.error('Failed to create parent node', err);\n });\n }\n }, {\n key: '_switchVerticalArrow',\n value: function _switchVerticalArrow(arrow) {\n arrow.classList.toggle('fa-chevron-up');\n arrow.classList.toggle('fa-chevron-down');\n }\n // show the parent node of the specified node\n\n }, {\n key: 'showParent',\n value: function showParent(node) {\n // just show only one superior level\n var temp = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n this._removeClass(temp, 'hidden');\n // just show only one line\n this._addClass(Array(temp[0].children).slice(1, -1), 'hidden');\n // show parent node with animation\n var parent = temp[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector(':scope > .topEdge'));\n }\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // show the sibling nodes of the specified node\n\n }, {\n key: 'showSiblings',\n value: function showSiblings(node, direction) {\n var _this3 = this;\n\n // firstly, show the sibling td tags\n var siblings = [],\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (direction) {\n siblings = direction === 'left' ? this._prevAll(temp) : this._nextAll(temp);\n } else {\n siblings = this._siblings(temp);\n }\n this._removeClass(siblings, 'hidden');\n // secondly, show the lines\n var upperLevel = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n temp = Array.from(upperLevel[0].querySelectorAll(':scope > .hidden'));\n if (direction) {\n this._removeClass(temp.slice(0, siblings.length * 2), 'hidden');\n } else {\n this._removeClass(temp, 'hidden');\n }\n // thirdly, do some cleaning stuff\n if (!this._getNodeState(node, 'parent').visible) {\n this._removeClass(upperLevel, 'hidden');\n var parent = upperLevel[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function (event) {\n event.target.classList.remove('slide');\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // lastly, show the sibling nodes with animation\n siblings.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this3._isVisible(node)) {\n node.classList.add('slide');\n node.classList.remove('slide-left', 'slide-right');\n }\n });\n });\n this._one(siblings[0].querySelector('.slide'), 'transitionend', function () {\n var _this4 = this;\n\n siblings.forEach(function (sib) {\n _this4._removeClass(Array.from(sib.querySelectorAll('.slide')), 'slide');\n });\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n node.querySelector('.topEdge').classList.remove('fa-chevron-up');\n node.querySelector('.topEdge').classList.add('fa-chevron-down');\n }\n }, this);\n }\n // hide the sibling nodes of the specified node\n\n }, {\n key: 'hideSiblings',\n value: function hideSiblings(node, direction) {\n var _this5 = this;\n\n var nodeContainer = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(nodeContainer);\n\n siblings.forEach(function (sib) {\n if (sib.querySelector('.spinner')) {\n _this5.chart.dataset.inAjax = false;\n }\n });\n\n if (!direction || direction && direction === 'left') {\n var preSibs = this._prevAll(nodeContainer);\n\n preSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-right');\n }\n });\n });\n }\n if (!direction || direction && direction !== 'left') {\n var nextSibs = this._nextAll(nodeContainer);\n\n nextSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-left');\n }\n });\n });\n }\n\n var animatedNodes = [];\n\n this._siblings(nodeContainer).forEach(function (sib) {\n Array.prototype.push.apply(animatedNodes, Array.from(sib.querySelectorAll('.slide')));\n });\n var lines = [];\n\n var _iteratorNormalCompletion2 = true;\n var _didIteratorError2 = false;\n var _iteratorError2 = undefined;\n\n try {\n for (var _iterator2 = animatedNodes[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {\n var _node = _step2.value;\n\n var temp = this._closest(_node, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling;\n\n lines.push(temp);\n lines.push(temp.previousElementSibling);\n }\n } catch (err) {\n _didIteratorError2 = true;\n _iteratorError2 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion2 && _iterator2.return) {\n _iterator2.return();\n }\n } finally {\n if (_didIteratorError2) {\n throw _iteratorError2;\n }\n }\n }\n\n lines = [].concat(toConsumableArray(new Set(lines)));\n lines.forEach(function (line) {\n line.style.visibility = 'hidden';\n });\n\n this._one(animatedNodes[0], 'transitionend', function (event) {\n var _this6 = this;\n\n lines.forEach(function (line) {\n line.removeAttribute('style');\n });\n var sibs = [];\n\n if (direction) {\n if (direction === 'left') {\n sibs = this._prevAll(nodeContainer, ':not(.hidden)');\n } else {\n sibs = this._nextAll(nodeContainer, ':not(.hidden)');\n }\n } else {\n sibs = this._siblings(nodeContainer);\n }\n var temp = Array.from(this._closest(nodeContainer, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling.querySelectorAll(':scope > :not(.hidden)'));\n\n var someLines = temp.slice(1, direction ? sibs.length * 2 + 1 : -1);\n\n this._addClass(someLines, 'hidden');\n this._removeClass(animatedNodes, 'slide');\n sibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).slice(1).forEach(function (node) {\n if (_this6._isVisible(node)) {\n node.classList.remove('slide-left', 'slide-right');\n node.classList.add('slide-up');\n }\n });\n });\n sibs.forEach(function (sib) {\n _this6._addClass(Array.from(sib.querySelectorAll('.lines')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.nodes')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.verticalNodes')), 'hidden');\n });\n this._addClass(sibs, 'hidden');\n\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n }\n }, this);\n }\n // recursively hide the ancestor node and sibling nodes of the specified node\n\n }, {\n key: 'hideParent',\n value: function hideParent(node) {\n var temp = Array.from(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children).slice(0, 3);\n\n if (temp[0].querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n // hide the sibling nodes\n if (this._getNodeState(node, 'siblings').visible) {\n this.hideSiblings(node);\n }\n // hide the lines\n var lines = temp.slice(1);\n\n this._css(lines, 'visibility', 'hidden');\n // hide the superior nodes with transition\n var parent = temp[0].querySelector('.node'),\n grandfatherVisible = this._getNodeState(parent, 'parent').visible;\n\n if (parent && this._isVisible(parent)) {\n parent.classList.add('slide', 'slide-down');\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n this._removeAttr(lines, 'style');\n this._addClass(temp, 'hidden');\n }, this);\n }\n // if the current node has the parent node, hide it recursively\n if (parent && grandfatherVisible) {\n this.hideParent(parent);\n }\n }\n // exposed method\n\n }, {\n key: 'addParent',\n value: function addParent(currentRoot, data) {\n var that = this;\n\n this._buildParentNode(currentRoot, data, function () {\n if (!currentRoot.querySelector(':scope > .topEdge')) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n currentRoot.appendChild(topEdge);\n }\n that.showParent(currentRoot);\n });\n }\n // start up loading status for requesting new nodes\n\n }, {\n key: '_startLoading',\n value: function _startLoading(arrow, node) {\n var opts = this.options,\n chart = this.chart;\n\n if (typeof chart.dataset.inAjax !== 'undefined' && chart.dataset.inAjax === 'true') {\n return false;\n }\n\n arrow.classList.add('hidden');\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n node.appendChild(spinner);\n this._addClass(Array.from(node.querySelectorAll(':scope > *:not(.spinner)')), 'hazy');\n chart.dataset.inAjax = true;\n\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = true;\n }\n return true;\n }\n // terminate loading status for requesting new nodes\n\n }, {\n key: '_endLoading',\n value: function _endLoading(arrow, node) {\n var opts = this.options;\n\n arrow.classList.remove('hidden');\n node.querySelector(':scope > .spinner').remove();\n this._removeClass(Array.from(node.querySelectorAll(':scope > .hazy')), 'hazy');\n this.chart.dataset.inAjax = false;\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = false;\n }\n }\n // define click event handler for the top edge\n\n }, {\n key: '_clickTopEdge',\n value: function _clickTopEdge(event) {\n event.stopPropagation();\n var that = this,\n topEdge = event.target,\n node = topEdge.parentNode,\n parentState = this._getNodeState(node, 'parent'),\n opts = this.options;\n\n if (parentState.exist) {\n var temp = this._closest(node, function (el) {\n return el.classList.contains('nodes');\n });\n var parent = temp.parentNode.firstChild.querySelector('.node');\n\n if (parent.classList.contains('slide')) {\n return;\n }\n // hide the ancestor nodes and sibling nodes of the specified node\n if (parentState.visible) {\n this.hideParent(node);\n this._one(parent, 'transitionend', function () {\n if (this._isInAction(node)) {\n this._switchVerticalArrow(topEdge);\n this._switchHorizontalArrow(node);\n }\n }, this);\n } else {\n // show the ancestors and siblings\n this.showParent(node);\n }\n } else {\n // load the new parent node of the specified node by ajax request\n var nodeId = topEdge.parentNode.id;\n\n // start up loading status\n if (this._startLoading(topEdge, node)) {\n // load new nodes\n this._getJSON(typeof opts.ajaxURL.parent === 'function' ? opts.ajaxURL.parent(node.dataset.source) : opts.ajaxURL.parent + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (Object.keys(resp).length) {\n that.addParent(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get parent node data.', err);\n }).finally(function () {\n that._endLoading(topEdge, node);\n });\n }\n }\n }\n // recursively hide the descendant nodes of the specified node\n\n }, {\n key: 'hideChildren',\n value: function hideChildren(node) {\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n lastItem = temp[temp.length - 1],\n lines = [];\n\n if (lastItem.querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n var descendants = Array.from(lastItem.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }),\n isVerticalDesc = lastItem.classList.contains('verticalNodes');\n\n if (!isVerticalDesc) {\n descendants.forEach(function (desc) {\n Array.prototype.push.apply(lines, that._prevAll(that._closest(desc, function (el) {\n return el.classList.contains('nodes');\n }), '.lines'));\n });\n lines = [].concat(toConsumableArray(new Set(lines)));\n this._css(lines, 'visibility', 'hidden');\n }\n this._one(descendants[0], 'transitionend', function (event) {\n this._removeClass(descendants, 'slide');\n if (isVerticalDesc) {\n that._addClass(temp, 'hidden');\n } else {\n lines.forEach(function (el) {\n el.removeAttribute('style');\n el.classList.add('hidden');\n el.parentNode.lastChild.classList.add('hidden');\n });\n this._addClass(Array.from(lastItem.querySelectorAll('.verticalNodes')), 'hidden');\n }\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide slide-up');\n }\n // show the children nodes of the specified node\n\n }, {\n key: 'showChildren',\n value: function showChildren(node) {\n var _this7 = this;\n\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n descendants = [];\n\n this._removeClass(temp, 'hidden');\n if (temp.some(function (el) {\n return el.classList.contains('verticalNodes');\n })) {\n temp.forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n } else {\n Array.from(temp[2].children).forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelector('tr').querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n }\n // the two following statements are used to enforce browser to repaint\n this._repaint(descendants[0]);\n this._one(descendants[0], 'transitionend', function (event) {\n _this7._removeClass(descendants, 'slide');\n if (_this7._isInAction(node)) {\n _this7._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide');\n this._removeClass(descendants, 'slide-up');\n }\n // build the child nodes of specific node\n\n }, {\n key: '_buildChildNode',\n value: function _buildChildNode(appendTo, nodeData, callback) {\n var data = nodeData.children || nodeData.siblings;\n\n appendTo.querySelector('td').setAttribute('colSpan', data.length * 2);\n this.buildHierarchy(appendTo, { 'children': data }, 0, callback);\n }\n // exposed method\n\n }, {\n key: 'addChildren',\n value: function addChildren(node, data) {\n var that = this,\n opts = this.options,\n count = 0;\n\n this.chart.dataset.inEdit = 'addChildren';\n this._buildChildNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n if (++count === data.children.length) {\n if (!node.querySelector('.bottomEdge')) {\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n node.appendChild(bottomEdge);\n }\n if (!node.querySelector('.symbol')) {\n var symbol = document.createElement('i');\n\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n node.querySelector(':scope > .title').appendChild(symbol);\n }\n that.showChildren(node);\n that.chart.dataset.inEdit = '';\n }\n });\n }\n // bind click event handler for the bottom edge\n\n }, {\n key: '_clickBottomEdge',\n value: function _clickBottomEdge(event) {\n var _this8 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n bottomEdge = event.target,\n node = bottomEdge.parentNode,\n childrenState = this._getNodeState(node, 'children');\n\n if (childrenState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).parentNode.lastChild;\n\n if (Array.from(temp.querySelectorAll('.node')).some(function (node) {\n return _this8._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n // hide the descendant nodes of the specified node\n if (childrenState.visible) {\n this.hideChildren(node);\n } else {\n // show the descendants\n this.showChildren(node);\n }\n } else {\n // load the new children nodes of the specified node by ajax request\n var nodeId = bottomEdge.parentNode.id;\n\n if (this._startLoading(bottomEdge, node)) {\n this._getJSON(typeof opts.ajaxURL.children === 'function' ? opts.ajaxURL.children(node.dataset.source) : opts.ajaxURL.children + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.children.length) {\n that.addChildren(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get children nodes data', err);\n }).finally(function () {\n that._endLoading(bottomEdge, node);\n });\n }\n }\n }\n // subsequent processing of build sibling nodes\n\n }, {\n key: '_complementLine',\n value: function _complementLine(oneSibling, siblingCount, existingSibligCount) {\n var temp = oneSibling.parentNode.parentNode.children;\n\n temp[0].children[0].setAttribute('colspan', siblingCount * 2);\n temp[1].children[0].setAttribute('colspan', siblingCount * 2);\n for (var i = 0; i < existingSibligCount; i++) {\n var rightLine = document.createElement('td'),\n leftLine = document.createElement('td');\n\n rightLine.setAttribute('class', 'rightLine topLine');\n rightLine.innerHTML = ' ';\n temp[2].insertBefore(rightLine, temp[2].children[1]);\n leftLine.setAttribute('class', 'leftLine topLine');\n leftLine.innerHTML = ' ';\n temp[2].insertBefore(leftLine, temp[2].children[1]);\n }\n }\n // build the sibling nodes of specific node\n\n }, {\n key: '_buildSiblingNode',\n value: function _buildSiblingNode(nodeChart, nodeData, callback) {\n var _this9 = this;\n\n var that = this,\n newSiblingCount = nodeData.siblings ? nodeData.siblings.length : nodeData.children.length,\n existingSibligCount = nodeChart.parentNode.nodeName === 'TD' ? this._closest(nodeChart, function (el) {\n return el.nodeName === 'TR';\n }).children.length : 1,\n siblingCount = existingSibligCount + newSiblingCount,\n insertPostion = siblingCount > 1 ? Math.floor(siblingCount / 2 - 1) : 0;\n\n // just build the sibling nodes for the specific node\n if (nodeChart.parentNode.nodeName === 'TD') {\n var temp = this._prevAll(nodeChart.parentNode.parentNode);\n\n temp[0].remove();\n temp[1].remove();\n var childCount = 0;\n\n that._buildChildNode.call(that, that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }), nodeData, function () {\n if (++childCount === newSiblingCount) {\n var siblingTds = Array.from(that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children);\n\n if (existingSibligCount > 1) {\n var _temp = nodeChart.parentNode.parentNode;\n\n Array.from(_temp.children).forEach(function (el) {\n siblingTds[0].parentNode.insertBefore(el, siblingTds[0]);\n });\n _temp.remove();\n that._complementLine(siblingTds[0], siblingCount, existingSibligCount);\n that._addClass(siblingTds, 'hidden');\n siblingTds.forEach(function (el) {\n that._addClass(el.querySelectorAll('.node'), 'slide-left');\n });\n } else {\n var _temp2 = nodeChart.parentNode.parentNode;\n\n siblingTds[insertPostion].parentNode.insertBefore(nodeChart.parentNode, siblingTds[insertPostion + 1]);\n _temp2.remove();\n that._complementLine(siblingTds[insertPostion], siblingCount, 1);\n that._addClass(siblingTds, 'hidden');\n that._addClass(that._getDescElements(siblingTds.slice(0, insertPostion + 1), '.node'), 'slide-right');\n that._addClass(that._getDescElements(siblingTds.slice(insertPostion + 1), '.node'), 'slide-left');\n }\n callback();\n }\n });\n } else {\n // build the sibling nodes and parent node for the specific ndoe\n var nodeCount = 0;\n\n that.buildHierarchy.call(that, that.chart, nodeData, 0, function () {\n if (++nodeCount === siblingCount) {\n var _temp3 = nodeChart.nextElementSibling.children[3].children[insertPostion],\n td = document.createElement('td');\n\n td.setAttribute('colspan', 2);\n td.appendChild(nodeChart);\n _temp3.parentNode.insertBefore(td, _temp3.nextElementSibling);\n that._complementLine(_temp3, siblingCount, 1);\n\n var temp2 = that._closest(nodeChart, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0];\n\n temp2.classList.add('hidden');\n that._addClass(Array.from(temp2.querySelectorAll('.node')), 'slide-down');\n\n var temp3 = _this9._siblings(nodeChart.parentNode);\n\n that._addClass(temp3, 'hidden');\n that._addClass(that._getDescElements(temp3.slice(0, insertPostion), '.node'), 'slide-right');\n that._addClass(that._getDescElements(temp3.slice(insertPostion), '.node'), 'slide-left');\n callback();\n }\n });\n }\n }\n }, {\n key: 'addSiblings',\n value: function addSiblings(node, data) {\n var that = this;\n\n this.chart.dataset.inEdit = 'addSiblings';\n this._buildSiblingNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n that._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).dataset.siblingsLoaded = true;\n if (!node.querySelector('.leftEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n node.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n node.appendChild(leftEdge);\n }\n that.showSiblings(node);\n that.chart.dataset.inEdit = '';\n });\n }\n }, {\n key: 'removeNodes',\n value: function removeNodes(node) {\n var parent = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n sibs = this._siblings(parent.parentNode);\n\n if (parent.nodeName === 'TD') {\n if (this._getNodeState(node, 'siblings').exist) {\n sibs[2].querySelector('.topLine').nextElementSibling.remove();\n sibs[2].querySelector('.topLine').remove();\n sibs[0].children[0].setAttribute('colspan', sibs[2].children.length);\n sibs[1].children[0].setAttribute('colspan', sibs[2].children.length);\n parent.remove();\n } else {\n sibs[0].children[0].removeAttribute('colspan');\n sibs[0].querySelector('.bottomEdge').remove();\n this._siblings(sibs[0]).forEach(function (el) {\n return el.remove();\n });\n }\n } else {\n Array.from(parent.parentNode.children).forEach(function (el) {\n return el.remove();\n });\n }\n }\n // bind click event handler for the left and right edges\n\n }, {\n key: '_clickHorizontalEdge',\n value: function _clickHorizontalEdge(event) {\n var _this10 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n hEdge = event.target,\n node = hEdge.parentNode,\n siblingsState = this._getNodeState(node, 'siblings');\n\n if (siblingsState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(temp);\n\n if (siblings.some(function (el) {\n var node = el.querySelector('.node');\n\n return _this10._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n if (opts.toggleSiblingsResp) {\n var prevSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.previousElementSibling,\n nextSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.nextElementSibling;\n\n if (hEdge.classList.contains('leftEdge')) {\n if (prevSib && prevSib.classList.contains('hidden')) {\n this.showSiblings(node, 'left');\n } else {\n this.hideSiblings(node, 'left');\n }\n } else {\n if (nextSib && nextSib.classList.contains('hidden')) {\n this.showSiblings(node, 'right');\n } else {\n this.hideSiblings(node, 'right');\n }\n }\n } else {\n if (siblingsState.visible) {\n this.hideSiblings(node);\n } else {\n this.showSiblings(node);\n }\n }\n } else {\n // load the new sibling nodes of the specified node by ajax request\n var nodeId = hEdge.parentNode.id,\n url = this._getNodeState(node, 'parent').exist ? typeof opts.ajaxURL.siblings === 'function' ? opts.ajaxURL.siblings(JSON.parse(node.dataset.source)) : opts.ajaxURL.siblings + nodeId : typeof opts.ajaxURL.families === 'function' ? opts.ajaxURL.families(JSON.parse(node.dataset.source)) : opts.ajaxURL.families + nodeId;\n\n if (this._startLoading(hEdge, node)) {\n this._getJSON(url).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.siblings || resp.children) {\n that.addSiblings(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get sibling nodes data', err);\n }).finally(function () {\n that._endLoading(hEdge, node);\n });\n }\n }\n }\n // event handler for toggle buttons in Hybrid(horizontal + vertical) OrgChart\n\n }, {\n key: '_clickToggleButton',\n value: function _clickToggleButton(event) {\n var that = this,\n toggleBtn = event.target,\n descWrapper = toggleBtn.parentNode.nextElementSibling,\n descendants = Array.from(descWrapper.querySelectorAll('.node')),\n children = Array.from(descWrapper.children).map(function (item) {\n return item.querySelector('.node');\n });\n\n if (children.some(function (item) {\n return item.classList.contains('slide');\n })) {\n return;\n }\n toggleBtn.classList.toggle('fa-plus-square');\n toggleBtn.classList.toggle('fa-minus-square');\n if (descendants[0].classList.contains('slide-up')) {\n descWrapper.classList.remove('hidden');\n this._repaint(children[0]);\n this._addClass(children, 'slide');\n this._removeClass(children, 'slide-up');\n this._one(children[0], 'transitionend', function () {\n that._removeClass(children, 'slide');\n });\n } else {\n this._addClass(descendants, 'slide slide-up');\n this._one(descendants[0], 'transitionend', function () {\n that._removeClass(descendants, 'slide');\n descendants.forEach(function (desc) {\n var ul = that._closest(desc, function (el) {\n return el.nodeName === 'UL';\n });\n\n ul.classList.add('hidden');\n });\n });\n\n descendants.forEach(function (desc) {\n var subTBs = Array.from(desc.querySelectorAll('.toggleBtn'));\n\n that._removeClass(subTBs, 'fa-minus-square');\n that._addClass(subTBs, 'fa-plus-square');\n });\n }\n }\n }, {\n key: '_dispatchClickEvent',\n value: function _dispatchClickEvent(event) {\n var classList = event.target.classList;\n\n if (classList.contains('topEdge')) {\n this._clickTopEdge(event);\n } else if (classList.contains('rightEdge') || classList.contains('leftEdge')) {\n this._clickHorizontalEdge(event);\n } else if (classList.contains('bottomEdge')) {\n this._clickBottomEdge(event);\n } else if (classList.contains('toggleBtn')) {\n this._clickToggleButton(event);\n } else {\n this._clickNode(event);\n }\n }\n }, {\n key: '_onDragStart',\n value: function _onDragStart(event) {\n var nodeDiv = event.target,\n opts = this.options,\n isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());\n\n if (isFirefox) {\n event.dataTransfer.setData('text/html', 'hack for firefox');\n }\n // if users enable zoom or direction options\n if (this.chart.style.transform) {\n var ghostNode = void 0,\n nodeCover = void 0;\n\n if (!document.querySelector('.ghost-node')) {\n ghostNode = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n ghostNode.classList.add('ghost-node');\n nodeCover = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\n ghostNode.appendChild(nodeCover);\n this.chart.appendChild(ghostNode);\n } else {\n ghostNode = this.chart.querySelector(':scope > .ghost-node');\n nodeCover = ghostNode.children[0];\n }\n var transValues = this.chart.style.transform.split(','),\n scale = Math.abs(window.parseFloat(opts.direction === 't2b' || opts.direction === 'b2t' ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));\n\n ghostNode.setAttribute('width', nodeDiv.offsetWidth);\n ghostNode.setAttribute('height', nodeDiv.offsetHeight);\n nodeCover.setAttribute('x', 5 * scale);\n nodeCover.setAttribute('y', 5 * scale);\n nodeCover.setAttribute('width', 120 * scale);\n nodeCover.setAttribute('height', 40 * scale);\n nodeCover.setAttribute('rx', 4 * scale);\n nodeCover.setAttribute('ry', 4 * scale);\n nodeCover.setAttribute('stroke-width', 1 * scale);\n var xOffset = event.offsetX * scale,\n yOffset = event.offsetY * scale;\n\n if (opts.direction === 'l2r') {\n xOffset = event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'r2l') {\n xOffset = nodeDiv.offsetWidth - event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'b2t') {\n xOffset = nodeDiv.offsetWidth - event.offsetX * scale;\n yOffset = nodeDiv.offsetHeight - event.offsetY * scale;\n }\n if (isFirefox) {\n // hack for old version of Firefox(< 48.0)\n var ghostNodeWrapper = document.createElement('img');\n\n ghostNodeWrapper.src = 'data:image/svg+xml;utf8,' + new XMLSerializer().serializeToString(ghostNode);\n event.dataTransfer.setDragImage(ghostNodeWrapper, xOffset, yOffset);\n nodeCover.setAttribute('fill', 'rgb(255, 255, 255)');\n nodeCover.setAttribute('stroke', 'rgb(191, 0, 0)');\n } else {\n event.dataTransfer.setDragImage(ghostNode, xOffset, yOffset);\n }\n }\n var dragged = event.target;\n var closestDraggedNodes = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n var dragZone = null;\n closestDraggedNodes !== null ? dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node') : null;\n var dragHier = Array.from(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).querySelectorAll('.node'));\n\n this.dragged = dragged;\n Array.from(this.chart.querySelectorAll('.node')).forEach(function (node) {\n if (!dragHier.includes(node)) {\n if (opts.dropCriteria) {\n if (opts.dropCriteria(dragged, dragZone, node)) {\n node.classList.add('allowedDrop');\n }\n } else {\n node.classList.add('allowedDrop');\n }\n }\n });\n }\n }, {\n key: '_onDragOver',\n value: function _onDragOver(event) {\n event.preventDefault();\n var dropZone = event.currentTarget;\n\n if (!dropZone.classList.contains('allowedDrop')) {\n event.dataTransfer.dropEffect = 'none';\n }\n }\n }, {\n key: '_onDragEnd',\n value: function _onDragEnd(event) {\n Array.from(this.chart.querySelectorAll('.allowedDrop')).forEach(function (el) {\n el.classList.remove('allowedDrop');\n });\n }\n }, {\n key: '_onDrop',\n value: function _onDrop(event) {\n var dropZone = event.currentTarget,\n chart = this.chart,\n dragged = this.dragged,\n dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].children[0];\n\n this._removeClass(Array.from(chart.querySelectorAll('.allowedDrop')), 'allowedDrop');\n // firstly, deal with the hierarchy of drop zone\n if (!dropZone.parentNode.parentNode.nextElementSibling) {\n // if the drop zone is a leaf node\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n dropZone.appendChild(bottomEdge);\n dropZone.parentNode.setAttribute('colspan', 2);\n var table = this._closest(dropZone, function (el) {\n return el.nodeName === 'TABLE';\n }),\n upperTr = document.createElement('tr'),\n lowerTr = document.createElement('tr'),\n nodeTr = document.createElement('tr');\n\n upperTr.setAttribute('class', 'lines');\n upperTr.innerHTML = '
';\n table.appendChild(upperTr);\n lowerTr.setAttribute('class', 'lines');\n lowerTr.innerHTML = '  ';\n table.appendChild(lowerTr);\n nodeTr.setAttribute('class', 'nodes');\n table.appendChild(nodeTr);\n Array.from(dragged.querySelectorAll('.horizontalEdge')).forEach(function (hEdge) {\n dragged.removeChild(hEdge);\n });\n var draggedTd = this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n nodeTr.appendChild(draggedTd);\n } else {\n var dropColspan = window.parseInt(dropZone.parentNode.colSpan) + 2;\n\n dropZone.parentNode.setAttribute('colspan', dropColspan);\n dropZone.parentNode.parentNode.nextElementSibling.children[0].setAttribute('colspan', dropColspan);\n if (!dragged.querySelector('.horizontalEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dragged.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dragged.appendChild(leftEdge);\n }\n var temp = dropZone.parentNode.parentNode.nextElementSibling.nextElementSibling,\n leftline = document.createElement('td'),\n rightline = document.createElement('td');\n\n leftline.setAttribute('class', 'leftLine topLine');\n leftline.innerHTML = ' ';\n temp.insertBefore(leftline, temp.children[1]);\n rightline.setAttribute('class', 'rightLine topLine');\n rightline.innerHTML = ' ';\n temp.insertBefore(rightline, temp.children[2]);\n temp.nextElementSibling.appendChild(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n\n var dropSibs = this._siblings(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n\n if (dropSibs.length === 1) {\n var _rightEdge = document.createElement('i'),\n _leftEdge = document.createElement('i');\n\n _rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dropSibs[0].appendChild(_rightEdge);\n _leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dropSibs[0].appendChild(_leftEdge);\n }\n }\n // secondly, deal with the hierarchy of dragged node\n var dragColSpan = window.parseInt(dragZone.colSpan);\n\n if (dragColSpan > 2) {\n dragZone.setAttribute('colspan', dragColSpan - 2);\n dragZone.parentNode.nextElementSibling.children[0].setAttribute('colspan', dragColSpan - 2);\n var _temp4 = dragZone.parentNode.nextElementSibling.nextElementSibling;\n\n _temp4.children[1].remove();\n _temp4.children[1].remove();\n\n var dragSibs = Array.from(dragZone.parentNode.parentNode.children[3].children).map(function (td) {\n return td.querySelector('.node');\n });\n\n if (dragSibs.length === 1) {\n dragSibs[0].querySelector('.leftEdge').remove();\n dragSibs[0].querySelector('.rightEdge').remove();\n }\n } else {\n dragZone.removeAttribute('colspan');\n dragZone.querySelector('.node').removeChild(dragZone.querySelector('.bottomEdge'));\n Array.from(dragZone.parentNode.parentNode.children).slice(1).forEach(function (tr) {\n return tr.remove();\n });\n }\n var customE = new CustomEvent('nodedropped.orgchart', { 'detail': {\n 'draggedNode': dragged,\n 'dragZone': dragZone.children[0],\n 'dropZone': dropZone\n } });\n\n chart.dispatchEvent(customE);\n }\n // create node\n\n }, {\n key: '_createNode',\n value: function _createNode(nodeData, level) {\n var that = this,\n opts = this.options;\n\n return new Promise(function (resolve, reject) {\n if (nodeData.children) {\n var _iteratorNormalCompletion3 = true;\n var _didIteratorError3 = false;\n var _iteratorError3 = undefined;\n\n try {\n for (var _iterator3 = nodeData.children[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {\n var child = _step3.value;\n\n child.parentId = nodeData.id;\n }\n } catch (err) {\n _didIteratorError3 = true;\n _iteratorError3 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion3 && _iterator3.return) {\n _iterator3.return();\n }\n } finally {\n if (_didIteratorError3) {\n throw _iteratorError3;\n }\n }\n }\n }\n\n // construct the content of node\n var nodeDiv = document.createElement('div');\n\n delete nodeData.children;\n nodeDiv.dataset.source = JSON.stringify(nodeData);\n if (nodeData[opts.nodeId]) {\n nodeDiv.id = nodeData[opts.nodeId];\n }\n var inEdit = that.chart.dataset.inEdit,\n isHidden = void 0;\n\n if (inEdit) {\n isHidden = inEdit === 'addChildren' ? ' slide-up' : '';\n } else {\n isHidden = level >= opts.depth ? ' slide-up' : '';\n }\n nodeDiv.setAttribute('class', 'node ' + (nodeData.className || '') + isHidden);\n if (opts.draggable) {\n nodeDiv.setAttribute('draggable', true);\n }\n if (nodeData.parentId) {\n nodeDiv.setAttribute('data-parent', nodeData.parentId);\n }\n nodeDiv.innerHTML = '\\n
' + nodeData[opts.nodeTitle] + '
\\n ' + (opts.nodeContent ? '
' + nodeData[opts.nodeContent] + '
' : '') + '\\n ';\n // append 4 direction arrows or expand/collapse buttons\n var flags = nodeData.relationship || '';\n\n if (opts.verticalDepth && level + 2 > opts.verticalDepth) {\n if (level + 1 >= opts.verticalDepth && Number(flags.substr(2, 1))) {\n var toggleBtn = document.createElement('i'),\n icon = level + 1 >= opts.depth ? 'plus' : 'minus';\n\n toggleBtn.setAttribute('class', 'toggleBtn fa fa-' + icon + '-square');\n nodeDiv.appendChild(toggleBtn);\n }\n } else {\n if (Number(flags.substr(0, 1))) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n nodeDiv.appendChild(topEdge);\n }\n if (Number(flags.substr(1, 1))) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n nodeDiv.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n nodeDiv.appendChild(leftEdge);\n }\n if (Number(flags.substr(2, 1))) {\n var bottomEdge = document.createElement('i'),\n symbol = document.createElement('i'),\n title = nodeDiv.querySelector(':scope > .title');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n nodeDiv.appendChild(bottomEdge);\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n title.insertBefore(symbol, title.children[0]);\n }\n }\n if (opts.toggleCollapse) {\n nodeDiv.addEventListener('mouseenter', that._hoverNode.bind(that));\n nodeDiv.addEventListener('mouseleave', that._hoverNode.bind(that));\n nodeDiv.addEventListener('click', that._dispatchClickEvent.bind(that));\n }\n if (opts.draggable) {\n nodeDiv.addEventListener('dragstart', that._onDragStart.bind(that));\n nodeDiv.addEventListener('dragover', that._onDragOver.bind(that));\n nodeDiv.addEventListener('dragend', that._onDragEnd.bind(that));\n nodeDiv.addEventListener('drop', that._onDrop.bind(that));\n }\n // allow user to append dom modification after finishing node create of orgchart\n if (opts.createNode) {\n opts.createNode(nodeDiv, nodeData);\n }\n\n resolve(nodeDiv);\n });\n }\n }, {\n key: 'buildHierarchy',\n value: function buildHierarchy(appendTo, nodeData, level, callback) {\n // Construct the node\n var that = this,\n opts = this.options,\n nodeWrapper = void 0,\n childNodes = nodeData.children,\n isVerticalNode = opts.verticalDepth && level + 1 >= opts.verticalDepth;\n\n if (Object.keys(nodeData).length > 1) {\n // if nodeData has nested structure\n nodeWrapper = isVerticalNode ? appendTo : document.createElement('table');\n if (!isVerticalNode) {\n appendTo.appendChild(nodeWrapper);\n }\n this._createNode(nodeData, level).then(function (nodeDiv) {\n if (isVerticalNode) {\n nodeWrapper.insertBefore(nodeDiv, nodeWrapper.firstChild);\n } else {\n var tr = document.createElement('tr');\n\n tr.innerHTML = '\\n \\n \\n ';\n tr.children[0].appendChild(nodeDiv);\n nodeWrapper.insertBefore(tr, nodeWrapper.children[0] ? nodeWrapper.children[0] : null);\n }\n if (callback) {\n callback();\n }\n }).catch(function (err) {\n console.error('Failed to creat node', err);\n });\n }\n // Construct the inferior nodes and connectiong lines\n if (childNodes && childNodes.length !== 0) {\n if (Object.keys(nodeData).length === 1) {\n // if nodeData is just an array\n nodeWrapper = appendTo;\n }\n var isHidden = void 0,\n isVerticalLayer = opts.verticalDepth && level + 2 >= opts.verticalDepth,\n inEdit = that.chart.dataset.inEdit;\n\n if (inEdit) {\n isHidden = inEdit === 'addSiblings' ? '' : ' hidden';\n } else {\n isHidden = level + 1 >= opts.depth ? ' hidden' : '';\n }\n\n // draw the line close to parent node\n if (!isVerticalLayer) {\n var tr = document.createElement('tr');\n\n tr.setAttribute('class', 'lines' + isHidden);\n tr.innerHTML = '\\n \\n
\\n \\n ';\n nodeWrapper.appendChild(tr);\n }\n // draw the lines close to children nodes\n var lineLayer = document.createElement('tr');\n\n lineLayer.setAttribute('class', 'lines' + isHidden);\n lineLayer.innerHTML = '\\n  \\n ' + childNodes.slice(1).map(function () {\n return '\\n  \\n  \\n ';\n }).join('') + '\\n  \\n ';\n var nodeLayer = void 0;\n\n if (isVerticalLayer) {\n nodeLayer = document.createElement('ul');\n if (isHidden) {\n nodeLayer.classList.add(isHidden.trim());\n }\n if (level + 2 === opts.verticalDepth) {\n var _tr = document.createElement('tr');\n\n _tr.setAttribute('class', 'verticalNodes' + isHidden);\n _tr.innerHTML = '';\n _tr.firstChild.appendChild(nodeLayer);\n nodeWrapper.appendChild(_tr);\n } else {\n nodeWrapper.appendChild(nodeLayer);\n }\n } else {\n nodeLayer = document.createElement('tr');\n nodeLayer.setAttribute('class', 'nodes' + isHidden);\n nodeWrapper.appendChild(lineLayer);\n nodeWrapper.appendChild(nodeLayer);\n }\n // recurse through children nodes\n childNodes.forEach(function (child) {\n var nodeCell = void 0;\n\n if (isVerticalLayer) {\n nodeCell = document.createElement('li');\n } else {\n nodeCell = document.createElement('td');\n nodeCell.setAttribute('colspan', 2);\n }\n nodeLayer.appendChild(nodeCell);\n that.buildHierarchy(nodeCell, child, level + 1, callback);\n });\n }\n }\n }, {\n key: '_clickChart',\n value: function _clickChart(event) {\n var closestNode = this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n\n if (!closestNode && this.chart.querySelector('.node.focused')) {\n this.chart.querySelector('.node.focused').classList.remove('focused');\n }\n }\n }, {\n key: '_clickExportButton',\n value: function _clickExportButton() {\n var opts = this.options,\n chartContainer = this.chartContainer,\n mask = chartContainer.querySelector(':scope > .mask'),\n sourceChart = chartContainer.querySelector('.orgchart:not(.hidden)'),\n flag = opts.direction === 'l2r' || opts.direction === 'r2l';\n\n if (!mask) {\n mask = document.createElement('div');\n mask.setAttribute('class', 'mask');\n mask.innerHTML = '';\n chartContainer.appendChild(mask);\n } else {\n mask.classList.remove('hidden');\n }\n chartContainer.classList.add('canvasContainer');\n window.html2canvas(sourceChart, {\n 'width': flag ? sourceChart.clientHeight : sourceChart.clientWidth,\n 'height': flag ? sourceChart.clientWidth : sourceChart.clientHeight,\n 'onclone': function onclone(cloneDoc) {\n var canvasContainer = cloneDoc.querySelector('.canvasContainer');\n\n canvasContainer.style.overflow = 'visible';\n canvasContainer.querySelector('.orgchart:not(.hidden)').transform = '';\n }\n }).then(function (canvas) {\n var downloadBtn = chartContainer.querySelector('.oc-download-btn');\n\n chartContainer.querySelector('.mask').classList.add('hidden');\n downloadBtn.setAttribute('href', canvas.toDataURL());\n downloadBtn.click();\n }).catch(function (err) {\n console.error('Failed to export the curent orgchart!', err);\n }).finally(function () {\n chartContainer.classList.remove('canvasContainer');\n });\n }\n }, {\n key: '_loopChart',\n value: function _loopChart(chart) {\n var _this11 = this;\n\n var subObj = { 'id': chart.querySelector('.node').id };\n\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this11._loopChart(el.firstChild));\n });\n }\n return subObj;\n }\n }, {\n key: '_loopChartDataset',\n value: function _loopChartDataset(chart) {\n var _this12 = this;\n\n var _subObj = JSON.parse(chart.querySelector('.node').dataset.source);\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!_subObj.children) {\n _subObj.children = [];\n }\n _subObj.children.push(_this12._loopChartDataset(el.firstChild));\n });\n }\n return _subObj;\n }\n }, {\n key: 'getChartJSON',\n value: function getChartJSON() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChartDataset(this.chart.querySelector('table'));\n }\n }, {\n key: 'getHierarchy',\n value: function getHierarchy() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChart(this.chart.querySelector('table'));\n }\n }, {\n key: '_onPanStart',\n value: function _onPanStart(event) {\n var chart = event.currentTarget;\n\n if (this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n }) || event.touches && event.touches.length > 1) {\n chart.dataset.panning = false;\n return;\n }\n chart.style.cursor = 'move';\n chart.dataset.panning = true;\n\n var lastX = 0,\n lastY = 0,\n lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf !== 'none') {\n var temp = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n lastX = Number.parseInt(temp[4], 10);\n lastY = Number.parseInt(temp[5], 10);\n } else {\n lastX = Number.parseInt(temp[12], 10);\n lastY = Number.parseInt(temp[13], 10);\n }\n }\n var startX = 0,\n startY = 0;\n\n if (!event.targetTouches) {\n // pan on desktop\n startX = event.pageX - lastX;\n startY = event.pageY - lastY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n startX = event.targetTouches[0].pageX - lastX;\n startY = event.targetTouches[0].pageY - lastY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n chart.dataset.panStart = JSON.stringify({ 'startX': startX, 'startY': startY });\n chart.addEventListener('mousemove', this._onPanning.bind(this));\n chart.addEventListener('touchmove', this._onPanning.bind(this));\n }\n }, {\n key: '_onPanning',\n value: function _onPanning(event) {\n var chart = event.currentTarget;\n\n if (chart.dataset.panning === 'false') {\n return;\n }\n var newX = 0,\n newY = 0,\n panStart = JSON.parse(chart.dataset.panStart),\n startX = panStart.startX,\n startY = panStart.startY;\n\n if (!event.targetTouches) {\n // pand on desktop\n newX = event.pageX - startX;\n newY = event.pageY - startY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n newX = event.targetTouches[0].pageX - startX;\n newY = event.targetTouches[0].pageY - startY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n if (!lastTf.includes('3d')) {\n chart.style.transform = 'matrix(1, 0, 0, 1, ' + newX + ', ' + newY + ')';\n } else {\n chart.style.transform = 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, ' + newX + ', ' + newY + ', 0, 1)';\n }\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[4] = newX;\n matrix[5] = newY + ')';\n } else {\n matrix[12] = newX;\n matrix[13] = newY;\n }\n chart.style.transform = matrix.join(',');\n }\n }\n }, {\n key: '_onPanEnd',\n value: function _onPanEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.panning === 'true') {\n chart.dataset.panning = false;\n chart.style.cursor = 'default';\n document.body.removeEventListener('mousemove', this._onPanning);\n document.body.removeEventListener('touchmove', this._onPanning);\n }\n }\n }, {\n key: '_setChartScale',\n value: function _setChartScale(chart, newScale) {\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n chart.style.transform = 'scale(' + newScale + ',' + newScale + ')';\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[0] = 'matrix(' + newScale;\n matrix[3] = newScale;\n chart.style.transform = lastTf + ' scale(' + newScale + ',' + newScale + ')';\n } else {\n chart.style.transform = lastTf + ' scale3d(' + newScale + ',' + newScale + ', 1)';\n }\n }\n chart.dataset.scale = newScale;\n }\n }, {\n key: '_onWheeling',\n value: function _onWheeling(event) {\n event.preventDefault();\n\n var newScale = event.deltaY > 0 ? 0.8 : 1.2;\n\n this._setChartScale(this.chart, newScale);\n }\n }, {\n key: '_getPinchDist',\n value: function _getPinchDist(event) {\n return Math.sqrt((event.touches[0].clientX - event.touches[1].clientX) * (event.touches[0].clientX - event.touches[1].clientX) + (event.touches[0].clientY - event.touches[1].clientY) * (event.touches[0].clientY - event.touches[1].clientY));\n }\n }, {\n key: '_onTouchStart',\n value: function _onTouchStart(event) {\n var chart = this.chart;\n\n if (event.touches && event.touches.length === 2) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinching = true;\n chart.dataset.pinchDistStart = dist;\n }\n }\n }, {\n key: '_onTouchMove',\n value: function _onTouchMove(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinchDistEnd = dist;\n }\n }\n }, {\n key: '_onTouchEnd',\n value: function _onTouchEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n chart.dataset.pinching = false;\n var diff = chart.dataset.pinchDistEnd - chart.dataset.pinchDistStart;\n\n if (diff > 0) {\n this._setChartScale(chart, 1);\n } else if (diff < 0) {\n this._setChartScale(chart, -1);\n }\n }\n }\n }, {\n key: 'name',\n get: function get$$1() {\n return this._name;\n }\n }]);\n return OrgChart;\n}();\n\n/**\n * Removes all key-value entries from the list cache.\n *\n * @private\n * @name clear\n * @memberOf ListCache\n */\nfunction listCacheClear() {\n this.__data__ = [];\n this.size = 0;\n}\n\n/**\n * Performs a\n * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * comparison between two values to determine if they are equivalent.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to compare.\n * @param {*} other The other value to compare.\n * @returns {boolean} Returns `true` if the values are equivalent, else `false`.\n * @example\n *\n * var object = { 'a': 1 };\n * var other = { 'a': 1 };\n *\n * _.eq(object, object);\n * // => true\n *\n * _.eq(object, other);\n * // => false\n *\n * _.eq('a', 'a');\n * // => true\n *\n * _.eq('a', Object('a'));\n * // => false\n *\n * _.eq(NaN, NaN);\n * // => true\n */\nfunction eq(value, other) {\n return value === other || (value !== value && other !== other);\n}\n\n/**\n * Gets the index at which the `key` is found in `array` of key-value pairs.\n *\n * @private\n * @param {Array} array The array to inspect.\n * @param {*} key The key to search for.\n * @returns {number} Returns the index of the matched value, else `-1`.\n */\nfunction assocIndexOf(array, key) {\n var length = array.length;\n while (length--) {\n if (eq(array[length][0], key)) {\n return length;\n }\n }\n return -1;\n}\n\n/** Used for built-in method references. */\nvar arrayProto = Array.prototype;\n\n/** Built-in value references. */\nvar splice = arrayProto.splice;\n\n/**\n * Removes `key` and its value from the list cache.\n *\n * @private\n * @name delete\n * @memberOf ListCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction listCacheDelete(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n return false;\n }\n var lastIndex = data.length - 1;\n if (index == lastIndex) {\n data.pop();\n } else {\n splice.call(data, index, 1);\n }\n --this.size;\n return true;\n}\n\n/**\n * Gets the list cache value for `key`.\n *\n * @private\n * @name get\n * @memberOf ListCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction listCacheGet(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n return index < 0 ? undefined : data[index][1];\n}\n\n/**\n * Checks if a list cache value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf ListCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction listCacheHas(key) {\n return assocIndexOf(this.__data__, key) > -1;\n}\n\n/**\n * Sets the list cache `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf ListCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the list cache instance.\n */\nfunction listCacheSet(key, value) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n ++this.size;\n data.push([key, value]);\n } else {\n data[index][1] = value;\n }\n return this;\n}\n\n/**\n * Creates an list cache object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction ListCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `ListCache`.\nListCache.prototype.clear = listCacheClear;\nListCache.prototype['delete'] = listCacheDelete;\nListCache.prototype.get = listCacheGet;\nListCache.prototype.has = listCacheHas;\nListCache.prototype.set = listCacheSet;\n\n/**\n * Removes all key-value entries from the stack.\n *\n * @private\n * @name clear\n * @memberOf Stack\n */\nfunction stackClear() {\n this.__data__ = new ListCache;\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the stack.\n *\n * @private\n * @name delete\n * @memberOf Stack\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction stackDelete(key) {\n var data = this.__data__,\n result = data['delete'](key);\n\n this.size = data.size;\n return result;\n}\n\n/**\n * Gets the stack value for `key`.\n *\n * @private\n * @name get\n * @memberOf Stack\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction stackGet(key) {\n return this.__data__.get(key);\n}\n\n/**\n * Checks if a stack value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Stack\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction stackHas(key) {\n return this.__data__.has(key);\n}\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Built-in value references. */\nvar Symbol$1 = root.Symbol;\n\n/** Used for built-in method references. */\nvar objectProto$1 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$1 = objectProto$1.hasOwnProperty;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString = objectProto$1.toString;\n\n/** Built-in value references. */\nvar symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the raw `toStringTag`.\n */\nfunction getRawTag(value) {\n var isOwn = hasOwnProperty$1.call(value, symToStringTag$1),\n tag = value[symToStringTag$1];\n\n try {\n value[symToStringTag$1] = undefined;\n var unmasked = true;\n } catch (e) {}\n\n var result = nativeObjectToString.call(value);\n if (unmasked) {\n if (isOwn) {\n value[symToStringTag$1] = tag;\n } else {\n delete value[symToStringTag$1];\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$2 = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString$1 = objectProto$2.toString;\n\n/**\n * Converts `value` to a string using `Object.prototype.toString`.\n *\n * @private\n * @param {*} value The value to convert.\n * @returns {string} Returns the converted string.\n */\nfunction objectToString(value) {\n return nativeObjectToString$1.call(value);\n}\n\n/** `Object#toString` result references. */\nvar nullTag = '[object Null]';\nvar undefinedTag = '[object Undefined]';\n\n/** Built-in value references. */\nvar symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * The base implementation of `getTag` without fallbacks for buggy environments.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the `toStringTag`.\n */\nfunction baseGetTag(value) {\n if (value == null) {\n return value === undefined ? undefinedTag : nullTag;\n }\n return (symToStringTag && symToStringTag in Object(value))\n ? getRawTag(value)\n : objectToString(value);\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n var type = typeof value;\n return value != null && (type == 'object' || type == 'function');\n}\n\n/** `Object#toString` result references. */\nvar asyncTag = '[object AsyncFunction]';\nvar funcTag = '[object Function]';\nvar genTag = '[object GeneratorFunction]';\nvar proxyTag = '[object Proxy]';\n\n/**\n * Checks if `value` is classified as a `Function` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a function, else `false`.\n * @example\n *\n * _.isFunction(_);\n * // => true\n *\n * _.isFunction(/abc/);\n * // => false\n */\nfunction isFunction(value) {\n if (!isObject(value)) {\n return false;\n }\n // The use of `Object#toString` avoids issues with the `typeof` operator\n // in Safari 9 which returns 'object' for typed arrays and other constructors.\n var tag = baseGetTag(value);\n return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;\n}\n\n/** Used to detect overreaching core-js shims. */\nvar coreJsData = root['__core-js_shared__'];\n\n/** Used to detect methods masquerading as native. */\nvar maskSrcKey = (function() {\n var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');\n return uid ? ('Symbol(src)_1.' + uid) : '';\n}());\n\n/**\n * Checks if `func` has its source masked.\n *\n * @private\n * @param {Function} func The function to check.\n * @returns {boolean} Returns `true` if `func` is masked, else `false`.\n */\nfunction isMasked(func) {\n return !!maskSrcKey && (maskSrcKey in func);\n}\n\n/** Used for built-in method references. */\nvar funcProto$1 = Function.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$1 = funcProto$1.toString;\n\n/**\n * Converts `func` to its source code.\n *\n * @private\n * @param {Function} func The function to convert.\n * @returns {string} Returns the source code.\n */\nfunction toSource(func) {\n if (func != null) {\n try {\n return funcToString$1.call(func);\n } catch (e) {}\n try {\n return (func + '');\n } catch (e) {}\n }\n return '';\n}\n\n/**\n * Used to match `RegExp`\n * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).\n */\nvar reRegExpChar = /[\\\\^$.*+?()[\\]{}|]/g;\n\n/** Used to detect host constructors (Safari). */\nvar reIsHostCtor = /^\\[object .+?Constructor\\]$/;\n\n/** Used for built-in method references. */\nvar funcProto = Function.prototype;\nvar objectProto = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Used to detect if a method is native. */\nvar reIsNative = RegExp('^' +\n funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\\\$&')\n .replace(/hasOwnProperty|(function).*?(?=\\\\\\()| for .+?(?=\\\\\\])/g, '$1.*?') + '$'\n);\n\n/**\n * The base implementation of `_.isNative` without bad shim checks.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a native function,\n * else `false`.\n */\nfunction baseIsNative(value) {\n if (!isObject(value) || isMasked(value)) {\n return false;\n }\n var pattern = isFunction(value) ? reIsNative : reIsHostCtor;\n return pattern.test(toSource(value));\n}\n\n/**\n * Gets the value at `key` of `object`.\n *\n * @private\n * @param {Object} [object] The object to query.\n * @param {string} key The key of the property to get.\n * @returns {*} Returns the property value.\n */\nfunction getValue(object, key) {\n return object == null ? undefined : object[key];\n}\n\n/**\n * Gets the native function at `key` of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {string} key The key of the method to get.\n * @returns {*} Returns the function if it's native, else `undefined`.\n */\nfunction getNative(object, key) {\n var value = getValue(object, key);\n return baseIsNative(value) ? value : undefined;\n}\n\n/* Built-in method references that are verified to be native. */\nvar Map = getNative(root, 'Map');\n\n/* Built-in method references that are verified to be native. */\nvar nativeCreate = getNative(Object, 'create');\n\n/**\n * Removes all key-value entries from the hash.\n *\n * @private\n * @name clear\n * @memberOf Hash\n */\nfunction hashClear() {\n this.__data__ = nativeCreate ? nativeCreate(null) : {};\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the hash.\n *\n * @private\n * @name delete\n * @memberOf Hash\n * @param {Object} hash The hash to modify.\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction hashDelete(key) {\n var result = this.has(key) && delete this.__data__[key];\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED = '__lodash_hash_undefined__';\n\n/** Used for built-in method references. */\nvar objectProto$3 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$2 = objectProto$3.hasOwnProperty;\n\n/**\n * Gets the hash value for `key`.\n *\n * @private\n * @name get\n * @memberOf Hash\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction hashGet(key) {\n var data = this.__data__;\n if (nativeCreate) {\n var result = data[key];\n return result === HASH_UNDEFINED ? undefined : result;\n }\n return hasOwnProperty$2.call(data, key) ? data[key] : undefined;\n}\n\n/** Used for built-in method references. */\nvar objectProto$4 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$3 = objectProto$4.hasOwnProperty;\n\n/**\n * Checks if a hash value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Hash\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction hashHas(key) {\n var data = this.__data__;\n return nativeCreate ? (data[key] !== undefined) : hasOwnProperty$3.call(data, key);\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED$1 = '__lodash_hash_undefined__';\n\n/**\n * Sets the hash `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Hash\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the hash instance.\n */\nfunction hashSet(key, value) {\n var data = this.__data__;\n this.size += this.has(key) ? 0 : 1;\n data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED$1 : value;\n return this;\n}\n\n/**\n * Creates a hash object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Hash(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `Hash`.\nHash.prototype.clear = hashClear;\nHash.prototype['delete'] = hashDelete;\nHash.prototype.get = hashGet;\nHash.prototype.has = hashHas;\nHash.prototype.set = hashSet;\n\n/**\n * Removes all key-value entries from the map.\n *\n * @private\n * @name clear\n * @memberOf MapCache\n */\nfunction mapCacheClear() {\n this.size = 0;\n this.__data__ = {\n 'hash': new Hash,\n 'map': new (Map || ListCache),\n 'string': new Hash\n };\n}\n\n/**\n * Checks if `value` is suitable for use as unique object key.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is suitable, else `false`.\n */\nfunction isKeyable(value) {\n var type = typeof value;\n return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')\n ? (value !== '__proto__')\n : (value === null);\n}\n\n/**\n * Gets the data for `map`.\n *\n * @private\n * @param {Object} map The map to query.\n * @param {string} key The reference key.\n * @returns {*} Returns the map data.\n */\nfunction getMapData(map, key) {\n var data = map.__data__;\n return isKeyable(key)\n ? data[typeof key == 'string' ? 'string' : 'hash']\n : data.map;\n}\n\n/**\n * Removes `key` and its value from the map.\n *\n * @private\n * @name delete\n * @memberOf MapCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction mapCacheDelete(key) {\n var result = getMapData(this, key)['delete'](key);\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/**\n * Gets the map value for `key`.\n *\n * @private\n * @name get\n * @memberOf MapCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction mapCacheGet(key) {\n return getMapData(this, key).get(key);\n}\n\n/**\n * Checks if a map value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf MapCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction mapCacheHas(key) {\n return getMapData(this, key).has(key);\n}\n\n/**\n * Sets the map `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf MapCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the map cache instance.\n */\nfunction mapCacheSet(key, value) {\n var data = getMapData(this, key),\n size = data.size;\n\n data.set(key, value);\n this.size += data.size == size ? 0 : 1;\n return this;\n}\n\n/**\n * Creates a map cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction MapCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `MapCache`.\nMapCache.prototype.clear = mapCacheClear;\nMapCache.prototype['delete'] = mapCacheDelete;\nMapCache.prototype.get = mapCacheGet;\nMapCache.prototype.has = mapCacheHas;\nMapCache.prototype.set = mapCacheSet;\n\n/** Used as the size to enable large array optimizations. */\nvar LARGE_ARRAY_SIZE = 200;\n\n/**\n * Sets the stack `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Stack\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the stack cache instance.\n */\nfunction stackSet(key, value) {\n var data = this.__data__;\n if (data instanceof ListCache) {\n var pairs = data.__data__;\n if (!Map || (pairs.length < LARGE_ARRAY_SIZE - 1)) {\n pairs.push([key, value]);\n this.size = ++data.size;\n return this;\n }\n data = this.__data__ = new MapCache(pairs);\n }\n data.set(key, value);\n this.size = data.size;\n return this;\n}\n\n/**\n * Creates a stack cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Stack(entries) {\n var data = this.__data__ = new ListCache(entries);\n this.size = data.size;\n}\n\n// Add methods to `Stack`.\nStack.prototype.clear = stackClear;\nStack.prototype['delete'] = stackDelete;\nStack.prototype.get = stackGet;\nStack.prototype.has = stackHas;\nStack.prototype.set = stackSet;\n\nvar defineProperty$1 = (function() {\n try {\n var func = getNative(Object, 'defineProperty');\n func({}, '', {});\n return func;\n } catch (e) {}\n}());\n\n/**\n * The base implementation of `assignValue` and `assignMergeValue` without\n * value checks.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction baseAssignValue(object, key, value) {\n if (key == '__proto__' && defineProperty$1) {\n defineProperty$1(object, key, {\n 'configurable': true,\n 'enumerable': true,\n 'value': value,\n 'writable': true\n });\n } else {\n object[key] = value;\n }\n}\n\n/**\n * This function is like `assignValue` except that it doesn't assign\n * `undefined` values.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignMergeValue(object, key, value) {\n if ((value !== undefined && !eq(object[key], value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Creates a base function for methods like `_.forIn` and `_.forOwn`.\n *\n * @private\n * @param {boolean} [fromRight] Specify iterating from right to left.\n * @returns {Function} Returns the new base function.\n */\nfunction createBaseFor(fromRight) {\n return function(object, iteratee, keysFunc) {\n var index = -1,\n iterable = Object(object),\n props = keysFunc(object),\n length = props.length;\n\n while (length--) {\n var key = props[fromRight ? length : ++index];\n if (iteratee(iterable[key], key, iterable) === false) {\n break;\n }\n }\n return object;\n };\n}\n\n/**\n * The base implementation of `baseForOwn` which iterates over `object`\n * properties returned by `keysFunc` and invokes `iteratee` for each property.\n * Iteratee functions may exit iteration early by explicitly returning `false`.\n *\n * @private\n * @param {Object} object The object to iterate over.\n * @param {Function} iteratee The function invoked per iteration.\n * @param {Function} keysFunc The function to get the keys of `object`.\n * @returns {Object} Returns `object`.\n */\nvar baseFor = createBaseFor();\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Built-in value references. */\nvar Buffer = moduleExports ? root.Buffer : undefined;\nvar allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined;\n\n/**\n * Creates a clone of `buffer`.\n *\n * @private\n * @param {Buffer} buffer The buffer to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Buffer} Returns the cloned buffer.\n */\nfunction cloneBuffer(buffer, isDeep) {\n if (isDeep) {\n return buffer.slice();\n }\n var length = buffer.length,\n result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);\n\n buffer.copy(result);\n return result;\n}\n\n/** Built-in value references. */\nvar Uint8Array = root.Uint8Array;\n\n/**\n * Creates a clone of `arrayBuffer`.\n *\n * @private\n * @param {ArrayBuffer} arrayBuffer The array buffer to clone.\n * @returns {ArrayBuffer} Returns the cloned array buffer.\n */\nfunction cloneArrayBuffer(arrayBuffer) {\n var result = new arrayBuffer.constructor(arrayBuffer.byteLength);\n new Uint8Array(result).set(new Uint8Array(arrayBuffer));\n return result;\n}\n\n/**\n * Creates a clone of `typedArray`.\n *\n * @private\n * @param {Object} typedArray The typed array to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Object} Returns the cloned typed array.\n */\nfunction cloneTypedArray(typedArray, isDeep) {\n var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;\n return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);\n}\n\n/**\n * Copies the values of `source` to `array`.\n *\n * @private\n * @param {Array} source The array to copy values from.\n * @param {Array} [array=[]] The array to copy values to.\n * @returns {Array} Returns `array`.\n */\nfunction copyArray(source, array) {\n var index = -1,\n length = source.length;\n\n array || (array = Array(length));\n while (++index < length) {\n array[index] = source[index];\n }\n return array;\n}\n\n/** Built-in value references. */\nvar objectCreate = Object.create;\n\n/**\n * The base implementation of `_.create` without support for assigning\n * properties to the created object.\n *\n * @private\n * @param {Object} proto The object to inherit from.\n * @returns {Object} Returns the new object.\n */\nvar baseCreate = (function() {\n function object() {}\n return function(proto) {\n if (!isObject(proto)) {\n return {};\n }\n if (objectCreate) {\n return objectCreate(proto);\n }\n object.prototype = proto;\n var result = new object;\n object.prototype = undefined;\n return result;\n };\n}());\n\n/**\n * Creates a unary function that invokes `func` with its argument transformed.\n *\n * @private\n * @param {Function} func The function to wrap.\n * @param {Function} transform The argument transform.\n * @returns {Function} Returns the new function.\n */\nfunction overArg(func, transform) {\n return function(arg) {\n return func(transform(arg));\n };\n}\n\n/** Built-in value references. */\nvar getPrototype = overArg(Object.getPrototypeOf, Object);\n\n/** Used for built-in method references. */\nvar objectProto$5 = Object.prototype;\n\n/**\n * Checks if `value` is likely a prototype object.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.\n */\nfunction isPrototype(value) {\n var Ctor = value && value.constructor,\n proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$5;\n\n return value === proto;\n}\n\n/**\n * Initializes an object clone.\n *\n * @private\n * @param {Object} object The object to clone.\n * @returns {Object} Returns the initialized clone.\n */\nfunction initCloneObject(object) {\n return (typeof object.constructor == 'function' && !isPrototype(object))\n ? baseCreate(getPrototype(object))\n : {};\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n return value != null && typeof value == 'object';\n}\n\n/** `Object#toString` result references. */\nvar argsTag = '[object Arguments]';\n\n/**\n * The base implementation of `_.isArguments`.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n */\nfunction baseIsArguments(value) {\n return isObjectLike(value) && baseGetTag(value) == argsTag;\n}\n\n/** Used for built-in method references. */\nvar objectProto$6 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$4 = objectProto$6.hasOwnProperty;\n\n/** Built-in value references. */\nvar propertyIsEnumerable = objectProto$6.propertyIsEnumerable;\n\n/**\n * Checks if `value` is likely an `arguments` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n * else `false`.\n * @example\n *\n * _.isArguments(function() { return arguments; }());\n * // => true\n *\n * _.isArguments([1, 2, 3]);\n * // => false\n */\nvar isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {\n return isObjectLike(value) && hasOwnProperty$4.call(value, 'callee') &&\n !propertyIsEnumerable.call(value, 'callee');\n};\n\n/**\n * Checks if `value` is classified as an `Array` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array, else `false`.\n * @example\n *\n * _.isArray([1, 2, 3]);\n * // => true\n *\n * _.isArray(document.body.children);\n * // => false\n *\n * _.isArray('abc');\n * // => false\n *\n * _.isArray(_.noop);\n * // => false\n */\nvar isArray = Array.isArray;\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER = 9007199254740991;\n\n/**\n * Checks if `value` is a valid array-like length.\n *\n * **Note:** This method is loosely based on\n * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.\n * @example\n *\n * _.isLength(3);\n * // => true\n *\n * _.isLength(Number.MIN_VALUE);\n * // => false\n *\n * _.isLength(Infinity);\n * // => false\n *\n * _.isLength('3');\n * // => false\n */\nfunction isLength(value) {\n return typeof value == 'number' &&\n value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;\n}\n\n/**\n * Checks if `value` is array-like. A value is considered array-like if it's\n * not a function and has a `value.length` that's an integer greater than or\n * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is array-like, else `false`.\n * @example\n *\n * _.isArrayLike([1, 2, 3]);\n * // => true\n *\n * _.isArrayLike(document.body.children);\n * // => true\n *\n * _.isArrayLike('abc');\n * // => true\n *\n * _.isArrayLike(_.noop);\n * // => false\n */\nfunction isArrayLike(value) {\n return value != null && isLength(value.length) && !isFunction(value);\n}\n\n/**\n * This method is like `_.isArrayLike` except that it also checks if `value`\n * is an object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array-like object,\n * else `false`.\n * @example\n *\n * _.isArrayLikeObject([1, 2, 3]);\n * // => true\n *\n * _.isArrayLikeObject(document.body.children);\n * // => true\n *\n * _.isArrayLikeObject('abc');\n * // => false\n *\n * _.isArrayLikeObject(_.noop);\n * // => false\n */\nfunction isArrayLikeObject(value) {\n return isObjectLike(value) && isArrayLike(value);\n}\n\n/**\n * This method returns `false`.\n *\n * @static\n * @memberOf _\n * @since 4.13.0\n * @category Util\n * @returns {boolean} Returns `false`.\n * @example\n *\n * _.times(2, _.stubFalse);\n * // => [false, false]\n */\nfunction stubFalse() {\n return false;\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$1 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$1 = freeExports$1 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;\n\n/** Built-in value references. */\nvar Buffer$1 = moduleExports$1 ? root.Buffer : undefined;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeIsBuffer = Buffer$1 ? Buffer$1.isBuffer : undefined;\n\n/**\n * Checks if `value` is a buffer.\n *\n * @static\n * @memberOf _\n * @since 4.3.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.\n * @example\n *\n * _.isBuffer(new Buffer(2));\n * // => true\n *\n * _.isBuffer(new Uint8Array(2));\n * // => false\n */\nvar isBuffer = nativeIsBuffer || stubFalse;\n\n/** `Object#toString` result references. */\nvar objectTag = '[object Object]';\n\n/** Used for built-in method references. */\nvar funcProto$2 = Function.prototype;\nvar objectProto$7 = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$2 = funcProto$2.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$5 = objectProto$7.hasOwnProperty;\n\n/** Used to infer the `Object` constructor. */\nvar objectCtorString = funcToString$2.call(Object);\n\n/**\n * Checks if `value` is a plain object, that is, an object created by the\n * `Object` constructor or one with a `[[Prototype]]` of `null`.\n *\n * @static\n * @memberOf _\n * @since 0.8.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * }\n *\n * _.isPlainObject(new Foo);\n * // => false\n *\n * _.isPlainObject([1, 2, 3]);\n * // => false\n *\n * _.isPlainObject({ 'x': 0, 'y': 0 });\n * // => true\n *\n * _.isPlainObject(Object.create(null));\n * // => true\n */\nfunction isPlainObject(value) {\n if (!isObjectLike(value) || baseGetTag(value) != objectTag) {\n return false;\n }\n var proto = getPrototype(value);\n if (proto === null) {\n return true;\n }\n var Ctor = hasOwnProperty$5.call(proto, 'constructor') && proto.constructor;\n return typeof Ctor == 'function' && Ctor instanceof Ctor &&\n funcToString$2.call(Ctor) == objectCtorString;\n}\n\n/** `Object#toString` result references. */\nvar argsTag$1 = '[object Arguments]';\nvar arrayTag = '[object Array]';\nvar boolTag = '[object Boolean]';\nvar dateTag = '[object Date]';\nvar errorTag = '[object Error]';\nvar funcTag$1 = '[object Function]';\nvar mapTag = '[object Map]';\nvar numberTag = '[object Number]';\nvar objectTag$1 = '[object Object]';\nvar regexpTag = '[object RegExp]';\nvar setTag = '[object Set]';\nvar stringTag = '[object String]';\nvar weakMapTag = '[object WeakMap]';\n\nvar arrayBufferTag = '[object ArrayBuffer]';\nvar dataViewTag = '[object DataView]';\nvar float32Tag = '[object Float32Array]';\nvar float64Tag = '[object Float64Array]';\nvar int8Tag = '[object Int8Array]';\nvar int16Tag = '[object Int16Array]';\nvar int32Tag = '[object Int32Array]';\nvar uint8Tag = '[object Uint8Array]';\nvar uint8ClampedTag = '[object Uint8ClampedArray]';\nvar uint16Tag = '[object Uint16Array]';\nvar uint32Tag = '[object Uint32Array]';\n\n/** Used to identify `toStringTag` values of typed arrays. */\nvar typedArrayTags = {};\ntypedArrayTags[float32Tag] = typedArrayTags[float64Tag] =\ntypedArrayTags[int8Tag] = typedArrayTags[int16Tag] =\ntypedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =\ntypedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =\ntypedArrayTags[uint32Tag] = true;\ntypedArrayTags[argsTag$1] = typedArrayTags[arrayTag] =\ntypedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =\ntypedArrayTags[dataViewTag] = typedArrayTags[dateTag] =\ntypedArrayTags[errorTag] = typedArrayTags[funcTag$1] =\ntypedArrayTags[mapTag] = typedArrayTags[numberTag] =\ntypedArrayTags[objectTag$1] = typedArrayTags[regexpTag] =\ntypedArrayTags[setTag] = typedArrayTags[stringTag] =\ntypedArrayTags[weakMapTag] = false;\n\n/**\n * The base implementation of `_.isTypedArray` without Node.js optimizations.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n */\nfunction baseIsTypedArray(value) {\n return isObjectLike(value) &&\n isLength(value.length) && !!typedArrayTags[baseGetTag(value)];\n}\n\n/**\n * The base implementation of `_.unary` without support for storing metadata.\n *\n * @private\n * @param {Function} func The function to cap arguments for.\n * @returns {Function} Returns the new capped function.\n */\nfunction baseUnary(func) {\n return function(value) {\n return func(value);\n };\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$2 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$2 = freeExports$2 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$2 = freeModule$2 && freeModule$2.exports === freeExports$2;\n\n/** Detect free variable `process` from Node.js. */\nvar freeProcess = moduleExports$2 && freeGlobal.process;\n\n/** Used to access faster Node.js helpers. */\nvar nodeUtil = (function() {\n try {\n return freeProcess && freeProcess.binding && freeProcess.binding('util');\n } catch (e) {}\n}());\n\n/* Node.js helper references. */\nvar nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;\n\n/**\n * Checks if `value` is classified as a typed array.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n * @example\n *\n * _.isTypedArray(new Uint8Array);\n * // => true\n *\n * _.isTypedArray([]);\n * // => false\n */\nvar isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;\n\n/** Used for built-in method references. */\nvar objectProto$8 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$6 = objectProto$8.hasOwnProperty;\n\n/**\n * Assigns `value` to `key` of `object` if the existing value is not equivalent\n * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * for equality comparisons.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignValue(object, key, value) {\n var objValue = object[key];\n if (!(hasOwnProperty$6.call(object, key) && eq(objValue, value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Copies properties of `source` to `object`.\n *\n * @private\n * @param {Object} source The object to copy properties from.\n * @param {Array} props The property identifiers to copy.\n * @param {Object} [object={}] The object to copy properties to.\n * @param {Function} [customizer] The function to customize copied values.\n * @returns {Object} Returns `object`.\n */\nfunction copyObject(source, props, object, customizer) {\n var isNew = !object;\n object || (object = {});\n\n var index = -1,\n length = props.length;\n\n while (++index < length) {\n var key = props[index];\n\n var newValue = customizer\n ? customizer(object[key], source[key], key, object, source)\n : undefined;\n\n if (newValue === undefined) {\n newValue = source[key];\n }\n if (isNew) {\n baseAssignValue(object, key, newValue);\n } else {\n assignValue(object, key, newValue);\n }\n }\n return object;\n}\n\n/**\n * The base implementation of `_.times` without support for iteratee shorthands\n * or max array length checks.\n *\n * @private\n * @param {number} n The number of times to invoke `iteratee`.\n * @param {Function} iteratee The function invoked per iteration.\n * @returns {Array} Returns the array of results.\n */\nfunction baseTimes(n, iteratee) {\n var index = -1,\n result = Array(n);\n\n while (++index < n) {\n result[index] = iteratee(index);\n }\n return result;\n}\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER$1 = 9007199254740991;\n\n/** Used to detect unsigned integer values. */\nvar reIsUint = /^(?:0|[1-9]\\d*)$/;\n\n/**\n * Checks if `value` is a valid array-like index.\n *\n * @private\n * @param {*} value The value to check.\n * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.\n * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.\n */\nfunction isIndex(value, length) {\n length = length == null ? MAX_SAFE_INTEGER$1 : length;\n return !!length &&\n (typeof value == 'number' || reIsUint.test(value)) &&\n (value > -1 && value % 1 == 0 && value < length);\n}\n\n/** Used for built-in method references. */\nvar objectProto$9 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$7 = objectProto$9.hasOwnProperty;\n\n/**\n * Creates an array of the enumerable property names of the array-like `value`.\n *\n * @private\n * @param {*} value The value to query.\n * @param {boolean} inherited Specify returning inherited property names.\n * @returns {Array} Returns the array of property names.\n */\nfunction arrayLikeKeys(value, inherited) {\n var isArr = isArray(value),\n isArg = !isArr && isArguments(value),\n isBuff = !isArr && !isArg && isBuffer(value),\n isType = !isArr && !isArg && !isBuff && isTypedArray(value),\n skipIndexes = isArr || isArg || isBuff || isType,\n result = skipIndexes ? baseTimes(value.length, String) : [],\n length = result.length;\n\n for (var key in value) {\n if ((inherited || hasOwnProperty$7.call(value, key)) &&\n !(skipIndexes && (\n // Safari 9 has enumerable `arguments.length` in strict mode.\n key == 'length' ||\n // Node.js 0.10 has enumerable non-index properties on buffers.\n (isBuff && (key == 'offset' || key == 'parent')) ||\n // PhantomJS 2 has enumerable non-index properties on typed arrays.\n (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||\n // Skip index properties.\n isIndex(key, length)\n ))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * This function is like\n * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)\n * except that it includes inherited enumerable properties.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction nativeKeysIn(object) {\n var result = [];\n if (object != null) {\n for (var key in Object(object)) {\n result.push(key);\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$10 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$8 = objectProto$10.hasOwnProperty;\n\n/**\n * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction baseKeysIn(object) {\n if (!isObject(object)) {\n return nativeKeysIn(object);\n }\n var isProto = isPrototype(object),\n result = [];\n\n for (var key in object) {\n if (!(key == 'constructor' && (isProto || !hasOwnProperty$8.call(object, key)))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * Creates an array of the own and inherited enumerable property names of `object`.\n *\n * **Note:** Non-object values are coerced to objects.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Object\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.keysIn(new Foo);\n * // => ['a', 'b', 'c'] (iteration order is not guaranteed)\n */\nfunction keysIn(object) {\n return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);\n}\n\n/**\n * Converts `value` to a plain object flattening inherited enumerable string\n * keyed properties of `value` to own properties of the plain object.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to convert.\n * @returns {Object} Returns the converted plain object.\n * @example\n *\n * function Foo() {\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.assign({ 'a': 1 }, new Foo);\n * // => { 'a': 1, 'b': 2 }\n *\n * _.assign({ 'a': 1 }, _.toPlainObject(new Foo));\n * // => { 'a': 1, 'b': 2, 'c': 3 }\n */\nfunction toPlainObject(value) {\n return copyObject(value, keysIn(value));\n}\n\n/**\n * A specialized version of `baseMerge` for arrays and objects which performs\n * deep merges and tracks traversed objects enabling objects with circular\n * references to be merged.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {string} key The key of the value to merge.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} mergeFunc The function to merge values.\n * @param {Function} [customizer] The function to customize assigned values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {\n var objValue = object[key],\n srcValue = source[key],\n stacked = stack.get(srcValue);\n\n if (stacked) {\n assignMergeValue(object, key, stacked);\n return;\n }\n var newValue = customizer\n ? customizer(objValue, srcValue, (key + ''), object, source, stack)\n : undefined;\n\n var isCommon = newValue === undefined;\n\n if (isCommon) {\n var isArr = isArray(srcValue),\n isBuff = !isArr && isBuffer(srcValue),\n isTyped = !isArr && !isBuff && isTypedArray(srcValue);\n\n newValue = srcValue;\n if (isArr || isBuff || isTyped) {\n if (isArray(objValue)) {\n newValue = objValue;\n }\n else if (isArrayLikeObject(objValue)) {\n newValue = copyArray(objValue);\n }\n else if (isBuff) {\n isCommon = false;\n newValue = cloneBuffer(srcValue, true);\n }\n else if (isTyped) {\n isCommon = false;\n newValue = cloneTypedArray(srcValue, true);\n }\n else {\n newValue = [];\n }\n }\n else if (isPlainObject(srcValue) || isArguments(srcValue)) {\n newValue = objValue;\n if (isArguments(objValue)) {\n newValue = toPlainObject(objValue);\n }\n else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {\n newValue = initCloneObject(srcValue);\n }\n }\n else {\n isCommon = false;\n }\n }\n if (isCommon) {\n // Recursively merge objects and arrays (susceptible to call stack limits).\n stack.set(srcValue, newValue);\n mergeFunc(newValue, srcValue, srcIndex, customizer, stack);\n stack['delete'](srcValue);\n }\n assignMergeValue(object, key, newValue);\n}\n\n/**\n * The base implementation of `_.merge` without support for multiple sources.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} [customizer] The function to customize merged values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMerge(object, source, srcIndex, customizer, stack) {\n if (object === source) {\n return;\n }\n baseFor(source, function(srcValue, key) {\n if (isObject(srcValue)) {\n stack || (stack = new Stack);\n baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);\n }\n else {\n var newValue = customizer\n ? customizer(object[key], srcValue, (key + ''), object, source, stack)\n : undefined;\n\n if (newValue === undefined) {\n newValue = srcValue;\n }\n assignMergeValue(object, key, newValue);\n }\n }, keysIn);\n}\n\n/**\n * This method returns the first argument it receives.\n *\n * @static\n * @since 0.1.0\n * @memberOf _\n * @category Util\n * @param {*} value Any value.\n * @returns {*} Returns `value`.\n * @example\n *\n * var object = { 'a': 1 };\n *\n * console.log(_.identity(object) === object);\n * // => true\n */\nfunction identity(value) {\n return value;\n}\n\n/**\n * A faster alternative to `Function#apply`, this function invokes `func`\n * with the `this` binding of `thisArg` and the arguments of `args`.\n *\n * @private\n * @param {Function} func The function to invoke.\n * @param {*} thisArg The `this` binding of `func`.\n * @param {Array} args The arguments to invoke `func` with.\n * @returns {*} Returns the result of `func`.\n */\nfunction apply(func, thisArg, args) {\n switch (args.length) {\n case 0: return func.call(thisArg);\n case 1: return func.call(thisArg, args[0]);\n case 2: return func.call(thisArg, args[0], args[1]);\n case 3: return func.call(thisArg, args[0], args[1], args[2]);\n }\n return func.apply(thisArg, args);\n}\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max;\n\n/**\n * A specialized version of `baseRest` which transforms the rest array.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @param {Function} transform The rest array transform.\n * @returns {Function} Returns the new function.\n */\nfunction overRest(func, start, transform) {\n start = nativeMax(start === undefined ? (func.length - 1) : start, 0);\n return function() {\n var args = arguments,\n index = -1,\n length = nativeMax(args.length - start, 0),\n array = Array(length);\n\n while (++index < length) {\n array[index] = args[start + index];\n }\n index = -1;\n var otherArgs = Array(start + 1);\n while (++index < start) {\n otherArgs[index] = args[index];\n }\n otherArgs[start] = transform(array);\n return apply(func, this, otherArgs);\n };\n}\n\n/**\n * Creates a function that returns `value`.\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Util\n * @param {*} value The value to return from the new function.\n * @returns {Function} Returns the new constant function.\n * @example\n *\n * var objects = _.times(2, _.constant({ 'a': 1 }));\n *\n * console.log(objects);\n * // => [{ 'a': 1 }, { 'a': 1 }]\n *\n * console.log(objects[0] === objects[1]);\n * // => true\n */\nfunction constant(value) {\n return function() {\n return value;\n };\n}\n\n/**\n * The base implementation of `setToString` without support for hot loop shorting.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar baseSetToString = !defineProperty$1 ? identity : function(func, string) {\n return defineProperty$1(func, 'toString', {\n 'configurable': true,\n 'enumerable': false,\n 'value': constant(string),\n 'writable': true\n });\n};\n\n/** Used to detect hot functions by number of calls within a span of milliseconds. */\nvar HOT_COUNT = 800;\nvar HOT_SPAN = 16;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeNow = Date.now;\n\n/**\n * Creates a function that'll short out and invoke `identity` instead\n * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`\n * milliseconds.\n *\n * @private\n * @param {Function} func The function to restrict.\n * @returns {Function} Returns the new shortable function.\n */\nfunction shortOut(func) {\n var count = 0,\n lastCalled = 0;\n\n return function() {\n var stamp = nativeNow(),\n remaining = HOT_SPAN - (stamp - lastCalled);\n\n lastCalled = stamp;\n if (remaining > 0) {\n if (++count >= HOT_COUNT) {\n return arguments[0];\n }\n } else {\n count = 0;\n }\n return func.apply(undefined, arguments);\n };\n}\n\n/**\n * Sets the `toString` method of `func` to return `string`.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar setToString = shortOut(baseSetToString);\n\n/**\n * The base implementation of `_.rest` which doesn't validate or coerce arguments.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @returns {Function} Returns the new function.\n */\nfunction baseRest(func, start) {\n return setToString(overRest(func, start, identity), func + '');\n}\n\n/**\n * Checks if the given arguments are from an iteratee call.\n *\n * @private\n * @param {*} value The potential iteratee value argument.\n * @param {*} index The potential iteratee index or key argument.\n * @param {*} object The potential iteratee object argument.\n * @returns {boolean} Returns `true` if the arguments are from an iteratee call,\n * else `false`.\n */\nfunction isIterateeCall(value, index, object) {\n if (!isObject(object)) {\n return false;\n }\n var type = typeof index;\n if (type == 'number'\n ? (isArrayLike(object) && isIndex(index, object.length))\n : (type == 'string' && index in object)\n ) {\n return eq(object[index], value);\n }\n return false;\n}\n\n/**\n * Creates a function like `_.assign`.\n *\n * @private\n * @param {Function} assigner The function to assign values.\n * @returns {Function} Returns the new assigner function.\n */\nfunction createAssigner(assigner) {\n return baseRest(function(object, sources) {\n var index = -1,\n length = sources.length,\n customizer = length > 1 ? sources[length - 1] : undefined,\n guard = length > 2 ? sources[2] : undefined;\n\n customizer = (assigner.length > 3 && typeof customizer == 'function')\n ? (length--, customizer)\n : undefined;\n\n if (guard && isIterateeCall(sources[0], sources[1], guard)) {\n customizer = length < 3 ? undefined : customizer;\n length = 1;\n }\n object = Object(object);\n while (++index < length) {\n var source = sources[index];\n if (source) {\n assigner(object, source, index, customizer);\n }\n }\n return object;\n });\n}\n\n/**\n * This method is like `_.assign` except that it recursively merges own and\n * inherited enumerable string keyed properties of source objects into the\n * destination object. Source properties that resolve to `undefined` are\n * skipped if a destination value exists. Array and plain object properties\n * are merged recursively. Other objects and value types are overridden by\n * assignment. Source objects are applied from left to right. Subsequent\n * sources overwrite property assignments of previous sources.\n *\n * **Note:** This method mutates `object`.\n *\n * @static\n * @memberOf _\n * @since 0.5.0\n * @category Object\n * @param {Object} object The destination object.\n * @param {...Object} [sources] The source objects.\n * @returns {Object} Returns `object`.\n * @example\n *\n * var object = {\n * 'a': [{ 'b': 2 }, { 'd': 4 }]\n * };\n *\n * var other = {\n * 'a': [{ 'c': 3 }, { 'e': 5 }]\n * };\n *\n * _.merge(object, other);\n * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }\n */\nvar merge = createAssigner(function(object, source, srcIndex) {\n baseMerge(object, source, srcIndex);\n});\n\nvar mergeOptions = function mergeOptions(obj, src) {\n return merge(obj, src);\n};\n\nvar VoBasic = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-basic\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'orgchart',\n props: {\n data: { type: Object, default: function _default() {\n return {};\n }\n },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n 'chartContainer': '#chart-container'\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nvar closest = function closest(el, fn) {\n return el && (fn(el) && el !== document.querySelector('.orgchart') ? el : closest(el.parentNode, fn));\n};\n\n\n\n\n\nvar bindEventHandler = function bindEventHandler(selector, type, fn, parentSelector) {\n if (parentSelector) {\n document.querySelector(parentSelector).addEventListener(type, function (event) {\n if (event.target.classList && event.target.classList.contains(selector.slice(1)) || closest(event.target, function (el) {\n return el.classList && el.classList.contains(selector.slice(1));\n })) {\n fn(event);\n }\n });\n } else {\n document.querySelectorAll(selector).forEach(function (element) {\n element.addEventListener(type, fn);\n });\n }\n};\n\nvar clickNode = function clickNode(event) {\n var sNode = closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n var sNodeInput = document.getElementById('selected-node');\n\n sNodeInput.value = sNode.querySelector('.title').textContent;\n sNodeInput.dataset.node = sNode.id;\n};\n\nvar clickChart = function clickChart(event) {\n if (!closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n })) {\n document.getElementById('selected-node').textContent = '';\n }\n};\n\n\n\n\n\n\n\n\n\n\n\nvar getId = function getId() {\n return new Date().getTime() * 1000 + Math.floor(Math.random() * 1001);\n};\n\nvar VoEdit = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-edit\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'VoEdit',\n props: {\n data: { type: Object },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n chartContainer: '#chart-container',\n createNode: function createNode(node, data) {\n node.id = getId();\n }\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n this.$nextTick(function () {\n bindEventHandler('.node', 'click', clickNode, '#chart-container');\n bindEventHandler('.orgchart', 'click', clickChart, '#chart-container');\n });\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nif (typeof window !== 'undefined' && window.Vue) {\n window.Vue.component('vo-basic', VoBasic);\n window.Vue.component('vo-edit', VoEdit);\n}\n\nexport { VoBasic, VoEdit };\n" }, { "path": "dist/vue-orgchart.js", "content": "(function (global, factory) {\n\ttypeof exports === 'object' && typeof module !== 'undefined' ? factory(exports) :\n\ttypeof define === 'function' && define.amd ? define(['exports'], factory) :\n\t(factory((global['vue-orgchart'] = {})));\n}(this, (function (exports) { 'use strict';\n\nvar _typeof = typeof Symbol === \"function\" && typeof Symbol.iterator === \"symbol\" ? function (obj) {\n return typeof obj;\n} : function (obj) {\n return obj && typeof Symbol === \"function\" && obj.constructor === Symbol && obj !== Symbol.prototype ? \"symbol\" : typeof obj;\n};\n\n\n\n\n\n\n\n\n\n\n\nvar classCallCheck = function (instance, Constructor) {\n if (!(instance instanceof Constructor)) {\n throw new TypeError(\"Cannot call a class as a function\");\n }\n};\n\nvar createClass = function () {\n function defineProperties(target, props) {\n for (var i = 0; i < props.length; i++) {\n var descriptor = props[i];\n descriptor.enumerable = descriptor.enumerable || false;\n descriptor.configurable = true;\n if (\"value\" in descriptor) descriptor.writable = true;\n Object.defineProperty(target, descriptor.key, descriptor);\n }\n }\n\n return function (Constructor, protoProps, staticProps) {\n if (protoProps) defineProperties(Constructor.prototype, protoProps);\n if (staticProps) defineProperties(Constructor, staticProps);\n return Constructor;\n };\n}();\n\n\n\n\n\n\n\nvar _extends = Object.assign || function (target) {\n for (var i = 1; i < arguments.length; i++) {\n var source = arguments[i];\n\n for (var key in source) {\n if (Object.prototype.hasOwnProperty.call(source, key)) {\n target[key] = source[key];\n }\n }\n }\n\n return target;\n};\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar toConsumableArray = function (arr) {\n if (Array.isArray(arr)) {\n for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) arr2[i] = arr[i];\n\n return arr2;\n } else {\n return Array.from(arr);\n }\n};\n\nvar OrgChart$1 = function () {\n function OrgChart(options) {\n classCallCheck(this, OrgChart);\n\n this._name = 'OrgChart';\n Promise.prototype.finally = function (callback) {\n var P = this.constructor;\n\n return this.then(function (value) {\n return P.resolve(callback()).then(function () {\n return value;\n });\n }, function (reason) {\n return P.resolve(callback()).then(function () {\n throw reason;\n });\n });\n };\n\n var that = this,\n defaultOptions = {\n 'nodeTitle': 'name',\n 'nodeId': 'id',\n 'toggleSiblingsResp': false,\n 'depth': 999,\n 'chartClass': '',\n 'exportButton': false,\n 'exportButtonName': 'Export',\n 'exportFilename': 'OrgChart',\n 'parentNodeSymbol': '',\n 'draggable': false,\n 'direction': 't2b',\n 'pan': false,\n 'zoom': false,\n 'toggleCollapse': true\n },\n opts = _extends(defaultOptions, options),\n data = opts.data,\n chart = document.createElement('div'),\n chartContainer = document.querySelector(opts.chartContainer);\n\n this.options = opts;\n delete this.options.data;\n this.chart = chart;\n this.chartContainer = chartContainer;\n chart.dataset.options = JSON.stringify(opts);\n chart.setAttribute('class', 'orgchart' + (opts.chartClass !== '' ? ' ' + opts.chartClass : '') + (opts.direction !== 't2b' ? ' ' + opts.direction : ''));\n if ((typeof data === 'undefined' ? 'undefined' : _typeof(data)) === 'object') {\n // local json datasource\n this.buildHierarchy(chart, opts.ajaxURL ? data : this._attachRel(data, '00'), 0);\n } else if (typeof data === 'string' && data.startsWith('#')) {\n // ul datasource\n this.buildHierarchy(chart, this._buildJsonDS(document.querySelector(data).children[0]), 0);\n } else {\n // ajax datasource\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n chart.appendChild(spinner);\n this._getJSON(data).then(function (resp) {\n that.buildHierarchy(chart, opts.ajaxURL ? resp : that._attachRel(resp, '00'), 0);\n }).catch(function (err) {\n console.error('failed to fetch datasource for orgchart', err);\n }).finally(function () {\n var spinner = chart.querySelector('.spinner');\n\n spinner.parentNode.removeChild(spinner);\n });\n }\n chart.addEventListener('click', this._clickChart.bind(this));\n // append the export button to the chart-container\n if (opts.exportButton && !chartContainer.querySelector('.oc-export-btn')) {\n var exportBtn = document.createElement('button'),\n downloadBtn = document.createElement('a');\n\n exportBtn.setAttribute('class', 'oc-export-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n opts.exportButtonName === 'Export' ? exportBtn.innerHTML = 'Export' : exportBtn.innerHTML = '' + opts.exportButtonName;\n exportBtn.addEventListener('click', this._clickExportButton.bind(this));\n downloadBtn.setAttribute('class', 'oc-download-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n downloadBtn.setAttribute('download', opts.exportFilename + '.png');\n chartContainer.appendChild(exportBtn);\n chartContainer.appendChild(downloadBtn);\n }\n\n if (opts.pan) {\n chartContainer.style.overflow = 'hidden';\n chart.addEventListener('mousedown', this._onPanStart.bind(this));\n chart.addEventListener('touchstart', this._onPanStart.bind(this));\n document.body.addEventListener('mouseup', this._onPanEnd.bind(this));\n document.body.addEventListener('touchend', this._onPanEnd.bind(this));\n }\n\n if (opts.zoom) {\n chartContainer.addEventListener('wheel', this._onWheeling.bind(this));\n chartContainer.addEventListener('touchstart', this._onTouchStart.bind(this));\n document.body.addEventListener('touchmove', this._onTouchMove.bind(this));\n document.body.addEventListener('touchend', this._onTouchEnd.bind(this));\n }\n\n chartContainer.appendChild(chart);\n }\n\n createClass(OrgChart, [{\n key: '_closest',\n value: function _closest(el, fn) {\n return el && (fn(el) && el !== this.chart ? el : this._closest(el.parentNode, fn));\n }\n }, {\n key: '_siblings',\n value: function _siblings(el, expr) {\n return Array.from(el.parentNode.children).filter(function (child) {\n if (child !== el) {\n if (expr) {\n return el.matches(expr);\n }\n return true;\n }\n return false;\n });\n }\n }, {\n key: '_prevAll',\n value: function _prevAll(el, expr) {\n var sibs = [],\n prevSib = el.previousElementSibling;\n\n while (prevSib) {\n if (!expr || prevSib.matches(expr)) {\n sibs.push(prevSib);\n }\n prevSib = prevSib.previousElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_nextAll',\n value: function _nextAll(el, expr) {\n var sibs = [];\n var nextSib = el.nextElementSibling;\n\n while (nextSib) {\n if (!expr || nextSib.matches(expr)) {\n sibs.push(nextSib);\n }\n nextSib = nextSib.nextElementSibling;\n }\n return sibs;\n }\n }, {\n key: '_isVisible',\n value: function _isVisible(el) {\n return el.offsetParent !== null;\n }\n }, {\n key: '_addClass',\n value: function _addClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.add(className);\n });\n } else {\n el.classList.add(classNames);\n }\n });\n }\n }, {\n key: '_removeClass',\n value: function _removeClass(elements, classNames) {\n elements.forEach(function (el) {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach(function (className) {\n return el.classList.remove(className);\n });\n } else {\n el.classList.remove(classNames);\n }\n });\n }\n }, {\n key: '_css',\n value: function _css(elements, prop, val) {\n elements.forEach(function (el) {\n el.style[prop] = val;\n });\n }\n }, {\n key: '_removeAttr',\n value: function _removeAttr(elements, attr) {\n elements.forEach(function (el) {\n el.removeAttribute(attr);\n });\n }\n }, {\n key: '_one',\n value: function _one(el, type, listener, self) {\n var one = function one(event) {\n try {\n listener.call(self, event);\n } finally {\n el.removeEventListener(type, one);\n }\n };\n\n el && el.addEventListener(type, one);\n }\n }, {\n key: '_getDescElements',\n value: function _getDescElements(ancestors, selector) {\n var results = [];\n\n ancestors.forEach(function (el) {\n return results.push.apply(results, toConsumableArray(el.querySelectorAll(selector)));\n });\n return results;\n }\n }, {\n key: '_getJSON',\n value: function _getJSON(url) {\n return new Promise(function (resolve, reject) {\n var xhr = new XMLHttpRequest();\n\n function handler() {\n if (this.readyState !== 4) {\n return;\n }\n if (this.status === 200) {\n resolve(JSON.parse(this.response));\n } else {\n reject(new Error(this.statusText));\n }\n }\n xhr.open('GET', url);\n xhr.onreadystatechange = handler;\n xhr.responseType = 'json';\n // xhr.setRequestHeader('Accept', 'application/json');\n xhr.setRequestHeader('Content-Type', 'application/json');\n xhr.send();\n });\n }\n }, {\n key: '_buildJsonDS',\n value: function _buildJsonDS(li) {\n var _this = this;\n\n var subObj = {\n 'name': li.firstChild.textContent.trim(),\n 'relationship': (li.parentNode.parentNode.nodeName === 'LI' ? '1' : '0') + (li.parentNode.children.length > 1 ? 1 : 0) + (li.children.length ? 1 : 0)\n };\n\n if (li.id) {\n subObj.id = li.id;\n }\n if (li.querySelector('ul')) {\n Array.from(li.querySelector('ul').children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this._buildJsonDS(el));\n });\n }\n return subObj;\n }\n }, {\n key: '_attachRel',\n value: function _attachRel(data, flags) {\n data.relationship = flags + (data.children && data.children.length > 0 ? 1 : 0);\n if (data.children) {\n var _iteratorNormalCompletion = true;\n var _didIteratorError = false;\n var _iteratorError = undefined;\n\n try {\n for (var _iterator = data.children[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {\n var item = _step.value;\n\n this._attachRel(item, '1' + (data.children.length > 1 ? 1 : 0));\n }\n } catch (err) {\n _didIteratorError = true;\n _iteratorError = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion && _iterator.return) {\n _iterator.return();\n }\n } finally {\n if (_didIteratorError) {\n throw _iteratorError;\n }\n }\n }\n }\n return data;\n }\n }, {\n key: '_repaint',\n value: function _repaint(node) {\n if (node) {\n node.style.offsetWidth = node.offsetWidth;\n }\n }\n // whether the cursor is hovering over the node\n\n }, {\n key: '_isInAction',\n value: function _isInAction(node) {\n return node.querySelector(':scope > .edge').className.indexOf('fa-') > -1;\n }\n // detect the exist/display state of related node\n\n }, {\n key: '_getNodeState',\n value: function _getNodeState(node, relation) {\n var _this2 = this;\n\n var criteria = void 0,\n state = { 'exist': false, 'visible': false };\n\n if (relation === 'parent') {\n criteria = this._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria.parentNode.children[0])) {\n state.visible = true;\n }\n } else if (relation === 'children') {\n criteria = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).nextElementSibling;\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria)) {\n state.visible = true;\n }\n } else if (relation === 'siblings') {\n criteria = this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n if (criteria.length) {\n state.exist = true;\n }\n if (state.exist && criteria.some(function (el) {\n return _this2._isVisible(el);\n })) {\n state.visible = true;\n }\n }\n\n return state;\n }\n // find the related nodes\n\n }, {\n key: 'getRelatedNodes',\n value: function getRelatedNodes(node, relation) {\n if (relation === 'parent') {\n return this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node');\n } else if (relation === 'children') {\n return Array.from(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children).map(function (el) {\n return el.querySelector('.node');\n });\n } else if (relation === 'siblings') {\n return this._siblings(this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n }\n return [];\n }\n }, {\n key: '_switchHorizontalArrow',\n value: function _switchHorizontalArrow(node) {\n var opts = this.options,\n leftEdge = node.querySelector('.leftEdge'),\n rightEdge = node.querySelector('.rightEdge'),\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (opts.toggleSiblingsResp && (typeof opts.ajaxURL === 'undefined' || this._closest(node, function (el) {\n return el.classList.contains('.nodes');\n }).dataset.siblingsLoaded)) {\n var prevSib = temp.previousElementSibling,\n nextSib = temp.nextElementSibling;\n\n if (prevSib) {\n if (prevSib.classList.contains('hidden')) {\n leftEdge.classList.add('fa-chevron-left');\n leftEdge.classList.remove('fa-chevron-right');\n } else {\n leftEdge.classList.add('fa-chevron-right');\n leftEdge.classList.remove('fa-chevron-left');\n }\n }\n if (nextSib) {\n if (nextSib.classList.contains('hidden')) {\n rightEdge.classList.add('fa-chevron-right');\n rightEdge.classList.remove('fa-chevron-left');\n } else {\n rightEdge.classList.add('fa-chevron-left');\n rightEdge.classList.remove('fa-chevron-right');\n }\n }\n } else {\n var sibs = this._siblings(temp),\n sibsVisible = sibs.length ? !sibs.some(function (el) {\n return el.classList.contains('hidden');\n }) : false;\n\n leftEdge.classList.toggle('fa-chevron-right', sibsVisible);\n leftEdge.classList.toggle('fa-chevron-left', !sibsVisible);\n rightEdge.classList.toggle('fa-chevron-left', sibsVisible);\n rightEdge.classList.toggle('fa-chevron-right', !sibsVisible);\n }\n }\n }, {\n key: '_hoverNode',\n value: function _hoverNode(event) {\n var node = event.target,\n flag = false,\n topEdge = node.querySelector(':scope > .topEdge'),\n bottomEdge = node.querySelector(':scope > .bottomEdge'),\n leftEdge = node.querySelector(':scope > .leftEdge');\n\n if (event.type === 'mouseenter') {\n if (topEdge) {\n flag = this._getNodeState(node, 'parent').visible;\n topEdge.classList.toggle('fa-chevron-up', !flag);\n topEdge.classList.toggle('fa-chevron-down', flag);\n }\n if (bottomEdge) {\n flag = this._getNodeState(node, 'children').visible;\n bottomEdge.classList.toggle('fa-chevron-down', !flag);\n bottomEdge.classList.toggle('fa-chevron-up', flag);\n }\n if (leftEdge) {\n this._switchHorizontalArrow(node);\n }\n } else {\n Array.from(node.querySelectorAll(':scope > .edge')).forEach(function (el) {\n el.classList.remove('fa-chevron-up', 'fa-chevron-down', 'fa-chevron-right', 'fa-chevron-left');\n });\n }\n }\n // define node click event handler\n\n }, {\n key: '_clickNode',\n value: function _clickNode(event) {\n var clickedNode = event.currentTarget,\n focusedNode = this.chart.querySelector('.focused');\n\n if (focusedNode) {\n focusedNode.classList.remove('focused');\n }\n clickedNode.classList.add('focused');\n }\n // build the parent node of specific node\n\n }, {\n key: '_buildParentNode',\n value: function _buildParentNode(currentRoot, nodeData, callback) {\n var that = this,\n table = document.createElement('table');\n\n nodeData.relationship = nodeData.relationship || '001';\n this._createNode(nodeData, 0).then(function (nodeDiv) {\n var chart = that.chart;\n\n nodeDiv.classList.remove('slide-up');\n nodeDiv.classList.add('slide-down');\n var parentTr = document.createElement('tr'),\n superiorLine = document.createElement('tr'),\n inferiorLine = document.createElement('tr'),\n childrenTr = document.createElement('tr');\n\n parentTr.setAttribute('class', 'hidden');\n parentTr.innerHTML = '';\n table.appendChild(parentTr);\n superiorLine.setAttribute('class', 'lines hidden');\n superiorLine.innerHTML = '
';\n table.appendChild(superiorLine);\n inferiorLine.setAttribute('class', 'lines hidden');\n inferiorLine.innerHTML = '  ';\n table.appendChild(inferiorLine);\n childrenTr.setAttribute('class', 'nodes');\n childrenTr.innerHTML = '';\n table.appendChild(childrenTr);\n table.querySelector('td').appendChild(nodeDiv);\n chart.insertBefore(table, chart.children[0]);\n table.children[3].children[0].appendChild(chart.lastChild);\n callback();\n }).catch(function (err) {\n console.error('Failed to create parent node', err);\n });\n }\n }, {\n key: '_switchVerticalArrow',\n value: function _switchVerticalArrow(arrow) {\n arrow.classList.toggle('fa-chevron-up');\n arrow.classList.toggle('fa-chevron-down');\n }\n // show the parent node of the specified node\n\n }, {\n key: 'showParent',\n value: function showParent(node) {\n // just show only one superior level\n var temp = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n this._removeClass(temp, 'hidden');\n // just show only one line\n this._addClass(Array(temp[0].children).slice(1, -1), 'hidden');\n // show parent node with animation\n var parent = temp[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector(':scope > .topEdge'));\n }\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // show the sibling nodes of the specified node\n\n }, {\n key: 'showSiblings',\n value: function showSiblings(node, direction) {\n var _this3 = this;\n\n // firstly, show the sibling td tags\n var siblings = [],\n temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n if (direction) {\n siblings = direction === 'left' ? this._prevAll(temp) : this._nextAll(temp);\n } else {\n siblings = this._siblings(temp);\n }\n this._removeClass(siblings, 'hidden');\n // secondly, show the lines\n var upperLevel = this._prevAll(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }));\n\n temp = Array.from(upperLevel[0].querySelectorAll(':scope > .hidden'));\n if (direction) {\n this._removeClass(temp.slice(0, siblings.length * 2), 'hidden');\n } else {\n this._removeClass(temp, 'hidden');\n }\n // thirdly, do some cleaning stuff\n if (!this._getNodeState(node, 'parent').visible) {\n this._removeClass(upperLevel, 'hidden');\n var parent = upperLevel[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function (event) {\n event.target.classList.remove('slide');\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // lastly, show the sibling nodes with animation\n siblings.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this3._isVisible(node)) {\n node.classList.add('slide');\n node.classList.remove('slide-left', 'slide-right');\n }\n });\n });\n this._one(siblings[0].querySelector('.slide'), 'transitionend', function () {\n var _this4 = this;\n\n siblings.forEach(function (sib) {\n _this4._removeClass(Array.from(sib.querySelectorAll('.slide')), 'slide');\n });\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n node.querySelector('.topEdge').classList.remove('fa-chevron-up');\n node.querySelector('.topEdge').classList.add('fa-chevron-down');\n }\n }, this);\n }\n // hide the sibling nodes of the specified node\n\n }, {\n key: 'hideSiblings',\n value: function hideSiblings(node, direction) {\n var _this5 = this;\n\n var nodeContainer = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(nodeContainer);\n\n siblings.forEach(function (sib) {\n if (sib.querySelector('.spinner')) {\n _this5.chart.dataset.inAjax = false;\n }\n });\n\n if (!direction || direction && direction === 'left') {\n var preSibs = this._prevAll(nodeContainer);\n\n preSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-right');\n }\n });\n });\n }\n if (!direction || direction && direction !== 'left') {\n var nextSibs = this._nextAll(nodeContainer);\n\n nextSibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).forEach(function (node) {\n if (_this5._isVisible(node)) {\n node.classList.add('slide', 'slide-left');\n }\n });\n });\n }\n\n var animatedNodes = [];\n\n this._siblings(nodeContainer).forEach(function (sib) {\n Array.prototype.push.apply(animatedNodes, Array.from(sib.querySelectorAll('.slide')));\n });\n var lines = [];\n\n var _iteratorNormalCompletion2 = true;\n var _didIteratorError2 = false;\n var _iteratorError2 = undefined;\n\n try {\n for (var _iterator2 = animatedNodes[Symbol.iterator](), _step2; !(_iteratorNormalCompletion2 = (_step2 = _iterator2.next()).done); _iteratorNormalCompletion2 = true) {\n var _node = _step2.value;\n\n var temp = this._closest(_node, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling;\n\n lines.push(temp);\n lines.push(temp.previousElementSibling);\n }\n } catch (err) {\n _didIteratorError2 = true;\n _iteratorError2 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion2 && _iterator2.return) {\n _iterator2.return();\n }\n } finally {\n if (_didIteratorError2) {\n throw _iteratorError2;\n }\n }\n }\n\n lines = [].concat(toConsumableArray(new Set(lines)));\n lines.forEach(function (line) {\n line.style.visibility = 'hidden';\n });\n\n this._one(animatedNodes[0], 'transitionend', function (event) {\n var _this6 = this;\n\n lines.forEach(function (line) {\n line.removeAttribute('style');\n });\n var sibs = [];\n\n if (direction) {\n if (direction === 'left') {\n sibs = this._prevAll(nodeContainer, ':not(.hidden)');\n } else {\n sibs = this._nextAll(nodeContainer, ':not(.hidden)');\n }\n } else {\n sibs = this._siblings(nodeContainer);\n }\n var temp = Array.from(this._closest(nodeContainer, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling.querySelectorAll(':scope > :not(.hidden)'));\n\n var someLines = temp.slice(1, direction ? sibs.length * 2 + 1 : -1);\n\n this._addClass(someLines, 'hidden');\n this._removeClass(animatedNodes, 'slide');\n sibs.forEach(function (sib) {\n Array.from(sib.querySelectorAll('.node')).slice(1).forEach(function (node) {\n if (_this6._isVisible(node)) {\n node.classList.remove('slide-left', 'slide-right');\n node.classList.add('slide-up');\n }\n });\n });\n sibs.forEach(function (sib) {\n _this6._addClass(Array.from(sib.querySelectorAll('.lines')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.nodes')), 'hidden');\n _this6._addClass(Array.from(sib.querySelectorAll('.verticalNodes')), 'hidden');\n });\n this._addClass(sibs, 'hidden');\n\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n }\n }, this);\n }\n // recursively hide the ancestor node and sibling nodes of the specified node\n\n }, {\n key: 'hideParent',\n value: function hideParent(node) {\n var temp = Array.from(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children).slice(0, 3);\n\n if (temp[0].querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n // hide the sibling nodes\n if (this._getNodeState(node, 'siblings').visible) {\n this.hideSiblings(node);\n }\n // hide the lines\n var lines = temp.slice(1);\n\n this._css(lines, 'visibility', 'hidden');\n // hide the superior nodes with transition\n var parent = temp[0].querySelector('.node'),\n grandfatherVisible = this._getNodeState(parent, 'parent').visible;\n\n if (parent && this._isVisible(parent)) {\n parent.classList.add('slide', 'slide-down');\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n this._removeAttr(lines, 'style');\n this._addClass(temp, 'hidden');\n }, this);\n }\n // if the current node has the parent node, hide it recursively\n if (parent && grandfatherVisible) {\n this.hideParent(parent);\n }\n }\n // exposed method\n\n }, {\n key: 'addParent',\n value: function addParent(currentRoot, data) {\n var that = this;\n\n this._buildParentNode(currentRoot, data, function () {\n if (!currentRoot.querySelector(':scope > .topEdge')) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n currentRoot.appendChild(topEdge);\n }\n that.showParent(currentRoot);\n });\n }\n // start up loading status for requesting new nodes\n\n }, {\n key: '_startLoading',\n value: function _startLoading(arrow, node) {\n var opts = this.options,\n chart = this.chart;\n\n if (typeof chart.dataset.inAjax !== 'undefined' && chart.dataset.inAjax === 'true') {\n return false;\n }\n\n arrow.classList.add('hidden');\n var spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n node.appendChild(spinner);\n this._addClass(Array.from(node.querySelectorAll(':scope > *:not(.spinner)')), 'hazy');\n chart.dataset.inAjax = true;\n\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = true;\n }\n return true;\n }\n // terminate loading status for requesting new nodes\n\n }, {\n key: '_endLoading',\n value: function _endLoading(arrow, node) {\n var opts = this.options;\n\n arrow.classList.remove('hidden');\n node.querySelector(':scope > .spinner').remove();\n this._removeClass(Array.from(node.querySelectorAll(':scope > .hazy')), 'hazy');\n this.chart.dataset.inAjax = false;\n var exportBtn = this.chartContainer.querySelector('.oc-export-btn' + (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = false;\n }\n }\n // define click event handler for the top edge\n\n }, {\n key: '_clickTopEdge',\n value: function _clickTopEdge(event) {\n event.stopPropagation();\n var that = this,\n topEdge = event.target,\n node = topEdge.parentNode,\n parentState = this._getNodeState(node, 'parent'),\n opts = this.options;\n\n if (parentState.exist) {\n var temp = this._closest(node, function (el) {\n return el.classList.contains('nodes');\n });\n var parent = temp.parentNode.firstChild.querySelector('.node');\n\n if (parent.classList.contains('slide')) {\n return;\n }\n // hide the ancestor nodes and sibling nodes of the specified node\n if (parentState.visible) {\n this.hideParent(node);\n this._one(parent, 'transitionend', function () {\n if (this._isInAction(node)) {\n this._switchVerticalArrow(topEdge);\n this._switchHorizontalArrow(node);\n }\n }, this);\n } else {\n // show the ancestors and siblings\n this.showParent(node);\n }\n } else {\n // load the new parent node of the specified node by ajax request\n var nodeId = topEdge.parentNode.id;\n\n // start up loading status\n if (this._startLoading(topEdge, node)) {\n // load new nodes\n this._getJSON(typeof opts.ajaxURL.parent === 'function' ? opts.ajaxURL.parent(node.dataset.source) : opts.ajaxURL.parent + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (Object.keys(resp).length) {\n that.addParent(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get parent node data.', err);\n }).finally(function () {\n that._endLoading(topEdge, node);\n });\n }\n }\n }\n // recursively hide the descendant nodes of the specified node\n\n }, {\n key: 'hideChildren',\n value: function hideChildren(node) {\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n lastItem = temp[temp.length - 1],\n lines = [];\n\n if (lastItem.querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n var descendants = Array.from(lastItem.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }),\n isVerticalDesc = lastItem.classList.contains('verticalNodes');\n\n if (!isVerticalDesc) {\n descendants.forEach(function (desc) {\n Array.prototype.push.apply(lines, that._prevAll(that._closest(desc, function (el) {\n return el.classList.contains('nodes');\n }), '.lines'));\n });\n lines = [].concat(toConsumableArray(new Set(lines)));\n this._css(lines, 'visibility', 'hidden');\n }\n this._one(descendants[0], 'transitionend', function (event) {\n this._removeClass(descendants, 'slide');\n if (isVerticalDesc) {\n that._addClass(temp, 'hidden');\n } else {\n lines.forEach(function (el) {\n el.removeAttribute('style');\n el.classList.add('hidden');\n el.parentNode.lastChild.classList.add('hidden');\n });\n this._addClass(Array.from(lastItem.querySelectorAll('.verticalNodes')), 'hidden');\n }\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide slide-up');\n }\n // show the children nodes of the specified node\n\n }, {\n key: 'showChildren',\n value: function showChildren(node) {\n var _this7 = this;\n\n var that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n descendants = [];\n\n this._removeClass(temp, 'hidden');\n if (temp.some(function (el) {\n return el.classList.contains('verticalNodes');\n })) {\n temp.forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n } else {\n Array.from(temp[2].children).forEach(function (el) {\n Array.prototype.push.apply(descendants, Array.from(el.querySelector('tr').querySelectorAll('.node')).filter(function (el) {\n return that._isVisible(el);\n }));\n });\n }\n // the two following statements are used to enforce browser to repaint\n this._repaint(descendants[0]);\n this._one(descendants[0], 'transitionend', function (event) {\n _this7._removeClass(descendants, 'slide');\n if (_this7._isInAction(node)) {\n _this7._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide');\n this._removeClass(descendants, 'slide-up');\n }\n // build the child nodes of specific node\n\n }, {\n key: '_buildChildNode',\n value: function _buildChildNode(appendTo, nodeData, callback) {\n var data = nodeData.children || nodeData.siblings;\n\n appendTo.querySelector('td').setAttribute('colSpan', data.length * 2);\n this.buildHierarchy(appendTo, { 'children': data }, 0, callback);\n }\n // exposed method\n\n }, {\n key: 'addChildren',\n value: function addChildren(node, data) {\n var that = this,\n opts = this.options,\n count = 0;\n\n this.chart.dataset.inEdit = 'addChildren';\n this._buildChildNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n if (++count === data.children.length) {\n if (!node.querySelector('.bottomEdge')) {\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n node.appendChild(bottomEdge);\n }\n if (!node.querySelector('.symbol')) {\n var symbol = document.createElement('i');\n\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n node.querySelector(':scope > .title').appendChild(symbol);\n }\n that.showChildren(node);\n that.chart.dataset.inEdit = '';\n }\n });\n }\n // bind click event handler for the bottom edge\n\n }, {\n key: '_clickBottomEdge',\n value: function _clickBottomEdge(event) {\n var _this8 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n bottomEdge = event.target,\n node = bottomEdge.parentNode,\n childrenState = this._getNodeState(node, 'children');\n\n if (childrenState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).parentNode.lastChild;\n\n if (Array.from(temp.querySelectorAll('.node')).some(function (node) {\n return _this8._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n // hide the descendant nodes of the specified node\n if (childrenState.visible) {\n this.hideChildren(node);\n } else {\n // show the descendants\n this.showChildren(node);\n }\n } else {\n // load the new children nodes of the specified node by ajax request\n var nodeId = bottomEdge.parentNode.id;\n\n if (this._startLoading(bottomEdge, node)) {\n this._getJSON(typeof opts.ajaxURL.children === 'function' ? opts.ajaxURL.children(node.dataset.source) : opts.ajaxURL.children + nodeId).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.children.length) {\n that.addChildren(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get children nodes data', err);\n }).finally(function () {\n that._endLoading(bottomEdge, node);\n });\n }\n }\n }\n // subsequent processing of build sibling nodes\n\n }, {\n key: '_complementLine',\n value: function _complementLine(oneSibling, siblingCount, existingSibligCount) {\n var temp = oneSibling.parentNode.parentNode.children;\n\n temp[0].children[0].setAttribute('colspan', siblingCount * 2);\n temp[1].children[0].setAttribute('colspan', siblingCount * 2);\n for (var i = 0; i < existingSibligCount; i++) {\n var rightLine = document.createElement('td'),\n leftLine = document.createElement('td');\n\n rightLine.setAttribute('class', 'rightLine topLine');\n rightLine.innerHTML = ' ';\n temp[2].insertBefore(rightLine, temp[2].children[1]);\n leftLine.setAttribute('class', 'leftLine topLine');\n leftLine.innerHTML = ' ';\n temp[2].insertBefore(leftLine, temp[2].children[1]);\n }\n }\n // build the sibling nodes of specific node\n\n }, {\n key: '_buildSiblingNode',\n value: function _buildSiblingNode(nodeChart, nodeData, callback) {\n var _this9 = this;\n\n var that = this,\n newSiblingCount = nodeData.siblings ? nodeData.siblings.length : nodeData.children.length,\n existingSibligCount = nodeChart.parentNode.nodeName === 'TD' ? this._closest(nodeChart, function (el) {\n return el.nodeName === 'TR';\n }).children.length : 1,\n siblingCount = existingSibligCount + newSiblingCount,\n insertPostion = siblingCount > 1 ? Math.floor(siblingCount / 2 - 1) : 0;\n\n // just build the sibling nodes for the specific node\n if (nodeChart.parentNode.nodeName === 'TD') {\n var temp = this._prevAll(nodeChart.parentNode.parentNode);\n\n temp[0].remove();\n temp[1].remove();\n var childCount = 0;\n\n that._buildChildNode.call(that, that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }), nodeData, function () {\n if (++childCount === newSiblingCount) {\n var siblingTds = Array.from(that._closest(nodeChart.parentNode, function (el) {\n return el.nodeName === 'TABLE';\n }).lastChild.children);\n\n if (existingSibligCount > 1) {\n var _temp = nodeChart.parentNode.parentNode;\n\n Array.from(_temp.children).forEach(function (el) {\n siblingTds[0].parentNode.insertBefore(el, siblingTds[0]);\n });\n _temp.remove();\n that._complementLine(siblingTds[0], siblingCount, existingSibligCount);\n that._addClass(siblingTds, 'hidden');\n siblingTds.forEach(function (el) {\n that._addClass(el.querySelectorAll('.node'), 'slide-left');\n });\n } else {\n var _temp2 = nodeChart.parentNode.parentNode;\n\n siblingTds[insertPostion].parentNode.insertBefore(nodeChart.parentNode, siblingTds[insertPostion + 1]);\n _temp2.remove();\n that._complementLine(siblingTds[insertPostion], siblingCount, 1);\n that._addClass(siblingTds, 'hidden');\n that._addClass(that._getDescElements(siblingTds.slice(0, insertPostion + 1), '.node'), 'slide-right');\n that._addClass(that._getDescElements(siblingTds.slice(insertPostion + 1), '.node'), 'slide-left');\n }\n callback();\n }\n });\n } else {\n // build the sibling nodes and parent node for the specific ndoe\n var nodeCount = 0;\n\n that.buildHierarchy.call(that, that.chart, nodeData, 0, function () {\n if (++nodeCount === siblingCount) {\n var _temp3 = nodeChart.nextElementSibling.children[3].children[insertPostion],\n td = document.createElement('td');\n\n td.setAttribute('colspan', 2);\n td.appendChild(nodeChart);\n _temp3.parentNode.insertBefore(td, _temp3.nextElementSibling);\n that._complementLine(_temp3, siblingCount, 1);\n\n var temp2 = that._closest(nodeChart, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0];\n\n temp2.classList.add('hidden');\n that._addClass(Array.from(temp2.querySelectorAll('.node')), 'slide-down');\n\n var temp3 = _this9._siblings(nodeChart.parentNode);\n\n that._addClass(temp3, 'hidden');\n that._addClass(that._getDescElements(temp3.slice(0, insertPostion), '.node'), 'slide-right');\n that._addClass(that._getDescElements(temp3.slice(insertPostion), '.node'), 'slide-left');\n callback();\n }\n });\n }\n }\n }, {\n key: 'addSiblings',\n value: function addSiblings(node, data) {\n var that = this;\n\n this.chart.dataset.inEdit = 'addSiblings';\n this._buildSiblingNode.call(this, this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }), data, function () {\n that._closest(node, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).dataset.siblingsLoaded = true;\n if (!node.querySelector('.leftEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n node.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n node.appendChild(leftEdge);\n }\n that.showSiblings(node);\n that.chart.dataset.inEdit = '';\n });\n }\n }, {\n key: 'removeNodes',\n value: function removeNodes(node) {\n var parent = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n sibs = this._siblings(parent.parentNode);\n\n if (parent.nodeName === 'TD') {\n if (this._getNodeState(node, 'siblings').exist) {\n sibs[2].querySelector('.topLine').nextElementSibling.remove();\n sibs[2].querySelector('.topLine').remove();\n sibs[0].children[0].setAttribute('colspan', sibs[2].children.length);\n sibs[1].children[0].setAttribute('colspan', sibs[2].children.length);\n parent.remove();\n } else {\n sibs[0].children[0].removeAttribute('colspan');\n sibs[0].querySelector('.bottomEdge').remove();\n this._siblings(sibs[0]).forEach(function (el) {\n return el.remove();\n });\n }\n } else {\n Array.from(parent.parentNode.children).forEach(function (el) {\n return el.remove();\n });\n }\n }\n // bind click event handler for the left and right edges\n\n }, {\n key: '_clickHorizontalEdge',\n value: function _clickHorizontalEdge(event) {\n var _this10 = this;\n\n event.stopPropagation();\n var that = this,\n opts = this.options,\n hEdge = event.target,\n node = hEdge.parentNode,\n siblingsState = this._getNodeState(node, 'siblings');\n\n if (siblingsState.exist) {\n var temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(temp);\n\n if (siblings.some(function (el) {\n var node = el.querySelector('.node');\n\n return _this10._isVisible(node) && node.classList.contains('slide');\n })) {\n return;\n }\n if (opts.toggleSiblingsResp) {\n var prevSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.previousElementSibling,\n nextSib = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode.nextElementSibling;\n\n if (hEdge.classList.contains('leftEdge')) {\n if (prevSib && prevSib.classList.contains('hidden')) {\n this.showSiblings(node, 'left');\n } else {\n this.hideSiblings(node, 'left');\n }\n } else {\n if (nextSib && nextSib.classList.contains('hidden')) {\n this.showSiblings(node, 'right');\n } else {\n this.hideSiblings(node, 'right');\n }\n }\n } else {\n if (siblingsState.visible) {\n this.hideSiblings(node);\n } else {\n this.showSiblings(node);\n }\n }\n } else {\n // load the new sibling nodes of the specified node by ajax request\n var nodeId = hEdge.parentNode.id,\n url = this._getNodeState(node, 'parent').exist ? typeof opts.ajaxURL.siblings === 'function' ? opts.ajaxURL.siblings(JSON.parse(node.dataset.source)) : opts.ajaxURL.siblings + nodeId : typeof opts.ajaxURL.families === 'function' ? opts.ajaxURL.families(JSON.parse(node.dataset.source)) : opts.ajaxURL.families + nodeId;\n\n if (this._startLoading(hEdge, node)) {\n this._getJSON(url).then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.siblings || resp.children) {\n that.addSiblings(node, resp);\n }\n }\n }).catch(function (err) {\n console.error('Failed to get sibling nodes data', err);\n }).finally(function () {\n that._endLoading(hEdge, node);\n });\n }\n }\n }\n // event handler for toggle buttons in Hybrid(horizontal + vertical) OrgChart\n\n }, {\n key: '_clickToggleButton',\n value: function _clickToggleButton(event) {\n var that = this,\n toggleBtn = event.target,\n descWrapper = toggleBtn.parentNode.nextElementSibling,\n descendants = Array.from(descWrapper.querySelectorAll('.node')),\n children = Array.from(descWrapper.children).map(function (item) {\n return item.querySelector('.node');\n });\n\n if (children.some(function (item) {\n return item.classList.contains('slide');\n })) {\n return;\n }\n toggleBtn.classList.toggle('fa-plus-square');\n toggleBtn.classList.toggle('fa-minus-square');\n if (descendants[0].classList.contains('slide-up')) {\n descWrapper.classList.remove('hidden');\n this._repaint(children[0]);\n this._addClass(children, 'slide');\n this._removeClass(children, 'slide-up');\n this._one(children[0], 'transitionend', function () {\n that._removeClass(children, 'slide');\n });\n } else {\n this._addClass(descendants, 'slide slide-up');\n this._one(descendants[0], 'transitionend', function () {\n that._removeClass(descendants, 'slide');\n descendants.forEach(function (desc) {\n var ul = that._closest(desc, function (el) {\n return el.nodeName === 'UL';\n });\n\n ul.classList.add('hidden');\n });\n });\n\n descendants.forEach(function (desc) {\n var subTBs = Array.from(desc.querySelectorAll('.toggleBtn'));\n\n that._removeClass(subTBs, 'fa-minus-square');\n that._addClass(subTBs, 'fa-plus-square');\n });\n }\n }\n }, {\n key: '_dispatchClickEvent',\n value: function _dispatchClickEvent(event) {\n var classList = event.target.classList;\n\n if (classList.contains('topEdge')) {\n this._clickTopEdge(event);\n } else if (classList.contains('rightEdge') || classList.contains('leftEdge')) {\n this._clickHorizontalEdge(event);\n } else if (classList.contains('bottomEdge')) {\n this._clickBottomEdge(event);\n } else if (classList.contains('toggleBtn')) {\n this._clickToggleButton(event);\n } else {\n this._clickNode(event);\n }\n }\n }, {\n key: '_onDragStart',\n value: function _onDragStart(event) {\n var nodeDiv = event.target,\n opts = this.options,\n isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());\n\n if (isFirefox) {\n event.dataTransfer.setData('text/html', 'hack for firefox');\n }\n // if users enable zoom or direction options\n if (this.chart.style.transform) {\n var ghostNode = void 0,\n nodeCover = void 0;\n\n if (!document.querySelector('.ghost-node')) {\n ghostNode = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n ghostNode.classList.add('ghost-node');\n nodeCover = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\n ghostNode.appendChild(nodeCover);\n this.chart.appendChild(ghostNode);\n } else {\n ghostNode = this.chart.querySelector(':scope > .ghost-node');\n nodeCover = ghostNode.children[0];\n }\n var transValues = this.chart.style.transform.split(','),\n scale = Math.abs(window.parseFloat(opts.direction === 't2b' || opts.direction === 'b2t' ? transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));\n\n ghostNode.setAttribute('width', nodeDiv.offsetWidth);\n ghostNode.setAttribute('height', nodeDiv.offsetHeight);\n nodeCover.setAttribute('x', 5 * scale);\n nodeCover.setAttribute('y', 5 * scale);\n nodeCover.setAttribute('width', 120 * scale);\n nodeCover.setAttribute('height', 40 * scale);\n nodeCover.setAttribute('rx', 4 * scale);\n nodeCover.setAttribute('ry', 4 * scale);\n nodeCover.setAttribute('stroke-width', 1 * scale);\n var xOffset = event.offsetX * scale,\n yOffset = event.offsetY * scale;\n\n if (opts.direction === 'l2r') {\n xOffset = event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'r2l') {\n xOffset = nodeDiv.offsetWidth - event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'b2t') {\n xOffset = nodeDiv.offsetWidth - event.offsetX * scale;\n yOffset = nodeDiv.offsetHeight - event.offsetY * scale;\n }\n if (isFirefox) {\n // hack for old version of Firefox(< 48.0)\n var ghostNodeWrapper = document.createElement('img');\n\n ghostNodeWrapper.src = 'data:image/svg+xml;utf8,' + new XMLSerializer().serializeToString(ghostNode);\n event.dataTransfer.setDragImage(ghostNodeWrapper, xOffset, yOffset);\n nodeCover.setAttribute('fill', 'rgb(255, 255, 255)');\n nodeCover.setAttribute('stroke', 'rgb(191, 0, 0)');\n } else {\n event.dataTransfer.setDragImage(ghostNode, xOffset, yOffset);\n }\n }\n var dragged = event.target;\n var closestDraggedNodes = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n });\n var dragZone = null;\n closestDraggedNodes !== null ? dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node') : null;\n var dragHier = Array.from(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).querySelectorAll('.node'));\n\n this.dragged = dragged;\n Array.from(this.chart.querySelectorAll('.node')).forEach(function (node) {\n if (!dragHier.includes(node)) {\n if (opts.dropCriteria) {\n if (opts.dropCriteria(dragged, dragZone, node)) {\n node.classList.add('allowedDrop');\n }\n } else {\n node.classList.add('allowedDrop');\n }\n }\n });\n }\n }, {\n key: '_onDragOver',\n value: function _onDragOver(event) {\n event.preventDefault();\n var dropZone = event.currentTarget;\n\n if (!dropZone.classList.contains('allowedDrop')) {\n event.dataTransfer.dropEffect = 'none';\n }\n }\n }, {\n key: '_onDragEnd',\n value: function _onDragEnd(event) {\n Array.from(this.chart.querySelectorAll('.allowedDrop')).forEach(function (el) {\n el.classList.remove('allowedDrop');\n });\n }\n }, {\n key: '_onDrop',\n value: function _onDrop(event) {\n var dropZone = event.currentTarget,\n chart = this.chart,\n dragged = this.dragged,\n dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].children[0];\n\n this._removeClass(Array.from(chart.querySelectorAll('.allowedDrop')), 'allowedDrop');\n // firstly, deal with the hierarchy of drop zone\n if (!dropZone.parentNode.parentNode.nextElementSibling) {\n // if the drop zone is a leaf node\n var bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n dropZone.appendChild(bottomEdge);\n dropZone.parentNode.setAttribute('colspan', 2);\n var table = this._closest(dropZone, function (el) {\n return el.nodeName === 'TABLE';\n }),\n upperTr = document.createElement('tr'),\n lowerTr = document.createElement('tr'),\n nodeTr = document.createElement('tr');\n\n upperTr.setAttribute('class', 'lines');\n upperTr.innerHTML = '
';\n table.appendChild(upperTr);\n lowerTr.setAttribute('class', 'lines');\n lowerTr.innerHTML = '  ';\n table.appendChild(lowerTr);\n nodeTr.setAttribute('class', 'nodes');\n table.appendChild(nodeTr);\n Array.from(dragged.querySelectorAll('.horizontalEdge')).forEach(function (hEdge) {\n dragged.removeChild(hEdge);\n });\n var draggedTd = this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode;\n\n nodeTr.appendChild(draggedTd);\n } else {\n var dropColspan = window.parseInt(dropZone.parentNode.colSpan) + 2;\n\n dropZone.parentNode.setAttribute('colspan', dropColspan);\n dropZone.parentNode.parentNode.nextElementSibling.children[0].setAttribute('colspan', dropColspan);\n if (!dragged.querySelector('.horizontalEdge')) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dragged.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dragged.appendChild(leftEdge);\n }\n var temp = dropZone.parentNode.parentNode.nextElementSibling.nextElementSibling,\n leftline = document.createElement('td'),\n rightline = document.createElement('td');\n\n leftline.setAttribute('class', 'leftLine topLine');\n leftline.innerHTML = ' ';\n temp.insertBefore(leftline, temp.children[1]);\n rightline.setAttribute('class', 'rightLine topLine');\n rightline.innerHTML = ' ';\n temp.insertBefore(rightline, temp.children[2]);\n temp.nextElementSibling.appendChild(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n\n var dropSibs = this._siblings(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map(function (el) {\n return el.querySelector('.node');\n });\n\n if (dropSibs.length === 1) {\n var _rightEdge = document.createElement('i'),\n _leftEdge = document.createElement('i');\n\n _rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dropSibs[0].appendChild(_rightEdge);\n _leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dropSibs[0].appendChild(_leftEdge);\n }\n }\n // secondly, deal with the hierarchy of dragged node\n var dragColSpan = window.parseInt(dragZone.colSpan);\n\n if (dragColSpan > 2) {\n dragZone.setAttribute('colspan', dragColSpan - 2);\n dragZone.parentNode.nextElementSibling.children[0].setAttribute('colspan', dragColSpan - 2);\n var _temp4 = dragZone.parentNode.nextElementSibling.nextElementSibling;\n\n _temp4.children[1].remove();\n _temp4.children[1].remove();\n\n var dragSibs = Array.from(dragZone.parentNode.parentNode.children[3].children).map(function (td) {\n return td.querySelector('.node');\n });\n\n if (dragSibs.length === 1) {\n dragSibs[0].querySelector('.leftEdge').remove();\n dragSibs[0].querySelector('.rightEdge').remove();\n }\n } else {\n dragZone.removeAttribute('colspan');\n dragZone.querySelector('.node').removeChild(dragZone.querySelector('.bottomEdge'));\n Array.from(dragZone.parentNode.parentNode.children).slice(1).forEach(function (tr) {\n return tr.remove();\n });\n }\n var customE = new CustomEvent('nodedropped.orgchart', { 'detail': {\n 'draggedNode': dragged,\n 'dragZone': dragZone.children[0],\n 'dropZone': dropZone\n } });\n\n chart.dispatchEvent(customE);\n }\n // create node\n\n }, {\n key: '_createNode',\n value: function _createNode(nodeData, level) {\n var that = this,\n opts = this.options;\n\n return new Promise(function (resolve, reject) {\n if (nodeData.children) {\n var _iteratorNormalCompletion3 = true;\n var _didIteratorError3 = false;\n var _iteratorError3 = undefined;\n\n try {\n for (var _iterator3 = nodeData.children[Symbol.iterator](), _step3; !(_iteratorNormalCompletion3 = (_step3 = _iterator3.next()).done); _iteratorNormalCompletion3 = true) {\n var child = _step3.value;\n\n child.parentId = nodeData.id;\n }\n } catch (err) {\n _didIteratorError3 = true;\n _iteratorError3 = err;\n } finally {\n try {\n if (!_iteratorNormalCompletion3 && _iterator3.return) {\n _iterator3.return();\n }\n } finally {\n if (_didIteratorError3) {\n throw _iteratorError3;\n }\n }\n }\n }\n\n // construct the content of node\n var nodeDiv = document.createElement('div');\n\n delete nodeData.children;\n nodeDiv.dataset.source = JSON.stringify(nodeData);\n if (nodeData[opts.nodeId]) {\n nodeDiv.id = nodeData[opts.nodeId];\n }\n var inEdit = that.chart.dataset.inEdit,\n isHidden = void 0;\n\n if (inEdit) {\n isHidden = inEdit === 'addChildren' ? ' slide-up' : '';\n } else {\n isHidden = level >= opts.depth ? ' slide-up' : '';\n }\n nodeDiv.setAttribute('class', 'node ' + (nodeData.className || '') + isHidden);\n if (opts.draggable) {\n nodeDiv.setAttribute('draggable', true);\n }\n if (nodeData.parentId) {\n nodeDiv.setAttribute('data-parent', nodeData.parentId);\n }\n nodeDiv.innerHTML = '\\n
' + nodeData[opts.nodeTitle] + '
\\n ' + (opts.nodeContent ? '
' + nodeData[opts.nodeContent] + '
' : '') + '\\n ';\n // append 4 direction arrows or expand/collapse buttons\n var flags = nodeData.relationship || '';\n\n if (opts.verticalDepth && level + 2 > opts.verticalDepth) {\n if (level + 1 >= opts.verticalDepth && Number(flags.substr(2, 1))) {\n var toggleBtn = document.createElement('i'),\n icon = level + 1 >= opts.depth ? 'plus' : 'minus';\n\n toggleBtn.setAttribute('class', 'toggleBtn fa fa-' + icon + '-square');\n nodeDiv.appendChild(toggleBtn);\n }\n } else {\n if (Number(flags.substr(0, 1))) {\n var topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n nodeDiv.appendChild(topEdge);\n }\n if (Number(flags.substr(1, 1))) {\n var rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n nodeDiv.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n nodeDiv.appendChild(leftEdge);\n }\n if (Number(flags.substr(2, 1))) {\n var bottomEdge = document.createElement('i'),\n symbol = document.createElement('i'),\n title = nodeDiv.querySelector(':scope > .title');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n nodeDiv.appendChild(bottomEdge);\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n title.insertBefore(symbol, title.children[0]);\n }\n }\n if (opts.toggleCollapse) {\n nodeDiv.addEventListener('mouseenter', that._hoverNode.bind(that));\n nodeDiv.addEventListener('mouseleave', that._hoverNode.bind(that));\n nodeDiv.addEventListener('click', that._dispatchClickEvent.bind(that));\n }\n if (opts.draggable) {\n nodeDiv.addEventListener('dragstart', that._onDragStart.bind(that));\n nodeDiv.addEventListener('dragover', that._onDragOver.bind(that));\n nodeDiv.addEventListener('dragend', that._onDragEnd.bind(that));\n nodeDiv.addEventListener('drop', that._onDrop.bind(that));\n }\n // allow user to append dom modification after finishing node create of orgchart\n if (opts.createNode) {\n opts.createNode(nodeDiv, nodeData);\n }\n\n resolve(nodeDiv);\n });\n }\n }, {\n key: 'buildHierarchy',\n value: function buildHierarchy(appendTo, nodeData, level, callback) {\n // Construct the node\n var that = this,\n opts = this.options,\n nodeWrapper = void 0,\n childNodes = nodeData.children,\n isVerticalNode = opts.verticalDepth && level + 1 >= opts.verticalDepth;\n\n if (Object.keys(nodeData).length > 1) {\n // if nodeData has nested structure\n nodeWrapper = isVerticalNode ? appendTo : document.createElement('table');\n if (!isVerticalNode) {\n appendTo.appendChild(nodeWrapper);\n }\n this._createNode(nodeData, level).then(function (nodeDiv) {\n if (isVerticalNode) {\n nodeWrapper.insertBefore(nodeDiv, nodeWrapper.firstChild);\n } else {\n var tr = document.createElement('tr');\n\n tr.innerHTML = '\\n \\n \\n ';\n tr.children[0].appendChild(nodeDiv);\n nodeWrapper.insertBefore(tr, nodeWrapper.children[0] ? nodeWrapper.children[0] : null);\n }\n if (callback) {\n callback();\n }\n }).catch(function (err) {\n console.error('Failed to creat node', err);\n });\n }\n // Construct the inferior nodes and connectiong lines\n if (childNodes && childNodes.length !== 0) {\n if (Object.keys(nodeData).length === 1) {\n // if nodeData is just an array\n nodeWrapper = appendTo;\n }\n var isHidden = void 0,\n isVerticalLayer = opts.verticalDepth && level + 2 >= opts.verticalDepth,\n inEdit = that.chart.dataset.inEdit;\n\n if (inEdit) {\n isHidden = inEdit === 'addSiblings' ? '' : ' hidden';\n } else {\n isHidden = level + 1 >= opts.depth ? ' hidden' : '';\n }\n\n // draw the line close to parent node\n if (!isVerticalLayer) {\n var tr = document.createElement('tr');\n\n tr.setAttribute('class', 'lines' + isHidden);\n tr.innerHTML = '\\n \\n
\\n \\n ';\n nodeWrapper.appendChild(tr);\n }\n // draw the lines close to children nodes\n var lineLayer = document.createElement('tr');\n\n lineLayer.setAttribute('class', 'lines' + isHidden);\n lineLayer.innerHTML = '\\n  \\n ' + childNodes.slice(1).map(function () {\n return '\\n  \\n  \\n ';\n }).join('') + '\\n  \\n ';\n var nodeLayer = void 0;\n\n if (isVerticalLayer) {\n nodeLayer = document.createElement('ul');\n if (isHidden) {\n nodeLayer.classList.add(isHidden.trim());\n }\n if (level + 2 === opts.verticalDepth) {\n var _tr = document.createElement('tr');\n\n _tr.setAttribute('class', 'verticalNodes' + isHidden);\n _tr.innerHTML = '';\n _tr.firstChild.appendChild(nodeLayer);\n nodeWrapper.appendChild(_tr);\n } else {\n nodeWrapper.appendChild(nodeLayer);\n }\n } else {\n nodeLayer = document.createElement('tr');\n nodeLayer.setAttribute('class', 'nodes' + isHidden);\n nodeWrapper.appendChild(lineLayer);\n nodeWrapper.appendChild(nodeLayer);\n }\n // recurse through children nodes\n childNodes.forEach(function (child) {\n var nodeCell = void 0;\n\n if (isVerticalLayer) {\n nodeCell = document.createElement('li');\n } else {\n nodeCell = document.createElement('td');\n nodeCell.setAttribute('colspan', 2);\n }\n nodeLayer.appendChild(nodeCell);\n that.buildHierarchy(nodeCell, child, level + 1, callback);\n });\n }\n }\n }, {\n key: '_clickChart',\n value: function _clickChart(event) {\n var closestNode = this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n\n if (!closestNode && this.chart.querySelector('.node.focused')) {\n this.chart.querySelector('.node.focused').classList.remove('focused');\n }\n }\n }, {\n key: '_clickExportButton',\n value: function _clickExportButton() {\n var opts = this.options,\n chartContainer = this.chartContainer,\n mask = chartContainer.querySelector(':scope > .mask'),\n sourceChart = chartContainer.querySelector('.orgchart:not(.hidden)'),\n flag = opts.direction === 'l2r' || opts.direction === 'r2l';\n\n if (!mask) {\n mask = document.createElement('div');\n mask.setAttribute('class', 'mask');\n mask.innerHTML = '';\n chartContainer.appendChild(mask);\n } else {\n mask.classList.remove('hidden');\n }\n chartContainer.classList.add('canvasContainer');\n window.html2canvas(sourceChart, {\n 'width': flag ? sourceChart.clientHeight : sourceChart.clientWidth,\n 'height': flag ? sourceChart.clientWidth : sourceChart.clientHeight,\n 'onclone': function onclone(cloneDoc) {\n var canvasContainer = cloneDoc.querySelector('.canvasContainer');\n\n canvasContainer.style.overflow = 'visible';\n canvasContainer.querySelector('.orgchart:not(.hidden)').transform = '';\n }\n }).then(function (canvas) {\n var downloadBtn = chartContainer.querySelector('.oc-download-btn');\n\n chartContainer.querySelector('.mask').classList.add('hidden');\n downloadBtn.setAttribute('href', canvas.toDataURL());\n downloadBtn.click();\n }).catch(function (err) {\n console.error('Failed to export the curent orgchart!', err);\n }).finally(function () {\n chartContainer.classList.remove('canvasContainer');\n });\n }\n }, {\n key: '_loopChart',\n value: function _loopChart(chart) {\n var _this11 = this;\n\n var subObj = { 'id': chart.querySelector('.node').id };\n\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!subObj.children) {\n subObj.children = [];\n }\n subObj.children.push(_this11._loopChart(el.firstChild));\n });\n }\n return subObj;\n }\n }, {\n key: '_loopChartDataset',\n value: function _loopChartDataset(chart) {\n var _this12 = this;\n\n var _subObj = JSON.parse(chart.querySelector('.node').dataset.source);\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach(function (el) {\n if (!_subObj.children) {\n _subObj.children = [];\n }\n _subObj.children.push(_this12._loopChartDataset(el.firstChild));\n });\n }\n return _subObj;\n }\n }, {\n key: 'getChartJSON',\n value: function getChartJSON() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChartDataset(this.chart.querySelector('table'));\n }\n }, {\n key: 'getHierarchy',\n value: function getHierarchy() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChart(this.chart.querySelector('table'));\n }\n }, {\n key: '_onPanStart',\n value: function _onPanStart(event) {\n var chart = event.currentTarget;\n\n if (this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n }) || event.touches && event.touches.length > 1) {\n chart.dataset.panning = false;\n return;\n }\n chart.style.cursor = 'move';\n chart.dataset.panning = true;\n\n var lastX = 0,\n lastY = 0,\n lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf !== 'none') {\n var temp = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n lastX = Number.parseInt(temp[4], 10);\n lastY = Number.parseInt(temp[5], 10);\n } else {\n lastX = Number.parseInt(temp[12], 10);\n lastY = Number.parseInt(temp[13], 10);\n }\n }\n var startX = 0,\n startY = 0;\n\n if (!event.targetTouches) {\n // pan on desktop\n startX = event.pageX - lastX;\n startY = event.pageY - lastY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n startX = event.targetTouches[0].pageX - lastX;\n startY = event.targetTouches[0].pageY - lastY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n chart.dataset.panStart = JSON.stringify({ 'startX': startX, 'startY': startY });\n chart.addEventListener('mousemove', this._onPanning.bind(this));\n chart.addEventListener('touchmove', this._onPanning.bind(this));\n }\n }, {\n key: '_onPanning',\n value: function _onPanning(event) {\n var chart = event.currentTarget;\n\n if (chart.dataset.panning === 'false') {\n return;\n }\n var newX = 0,\n newY = 0,\n panStart = JSON.parse(chart.dataset.panStart),\n startX = panStart.startX,\n startY = panStart.startY;\n\n if (!event.targetTouches) {\n // pand on desktop\n newX = event.pageX - startX;\n newY = event.pageY - startY;\n } else if (event.targetTouches.length === 1) {\n // pan on mobile device\n newX = event.targetTouches[0].pageX - startX;\n newY = event.targetTouches[0].pageY - startY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n if (!lastTf.includes('3d')) {\n chart.style.transform = 'matrix(1, 0, 0, 1, ' + newX + ', ' + newY + ')';\n } else {\n chart.style.transform = 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, ' + newX + ', ' + newY + ', 0, 1)';\n }\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[4] = newX;\n matrix[5] = newY + ')';\n } else {\n matrix[12] = newX;\n matrix[13] = newY;\n }\n chart.style.transform = matrix.join(',');\n }\n }\n }, {\n key: '_onPanEnd',\n value: function _onPanEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.panning === 'true') {\n chart.dataset.panning = false;\n chart.style.cursor = 'default';\n document.body.removeEventListener('mousemove', this._onPanning);\n document.body.removeEventListener('touchmove', this._onPanning);\n }\n }\n }, {\n key: '_setChartScale',\n value: function _setChartScale(chart, newScale) {\n var lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n chart.style.transform = 'scale(' + newScale + ',' + newScale + ')';\n } else {\n var matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[0] = 'matrix(' + newScale;\n matrix[3] = newScale;\n chart.style.transform = lastTf + ' scale(' + newScale + ',' + newScale + ')';\n } else {\n chart.style.transform = lastTf + ' scale3d(' + newScale + ',' + newScale + ', 1)';\n }\n }\n chart.dataset.scale = newScale;\n }\n }, {\n key: '_onWheeling',\n value: function _onWheeling(event) {\n event.preventDefault();\n\n var newScale = event.deltaY > 0 ? 0.8 : 1.2;\n\n this._setChartScale(this.chart, newScale);\n }\n }, {\n key: '_getPinchDist',\n value: function _getPinchDist(event) {\n return Math.sqrt((event.touches[0].clientX - event.touches[1].clientX) * (event.touches[0].clientX - event.touches[1].clientX) + (event.touches[0].clientY - event.touches[1].clientY) * (event.touches[0].clientY - event.touches[1].clientY));\n }\n }, {\n key: '_onTouchStart',\n value: function _onTouchStart(event) {\n var chart = this.chart;\n\n if (event.touches && event.touches.length === 2) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinching = true;\n chart.dataset.pinchDistStart = dist;\n }\n }\n }, {\n key: '_onTouchMove',\n value: function _onTouchMove(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n var dist = this._getPinchDist(event);\n\n chart.dataset.pinchDistEnd = dist;\n }\n }\n }, {\n key: '_onTouchEnd',\n value: function _onTouchEnd(event) {\n var chart = this.chart;\n\n if (chart.dataset.pinching) {\n chart.dataset.pinching = false;\n var diff = chart.dataset.pinchDistEnd - chart.dataset.pinchDistStart;\n\n if (diff > 0) {\n this._setChartScale(chart, 1);\n } else if (diff < 0) {\n this._setChartScale(chart, -1);\n }\n }\n }\n }, {\n key: 'name',\n get: function get$$1() {\n return this._name;\n }\n }]);\n return OrgChart;\n}();\n\n/**\n * Removes all key-value entries from the list cache.\n *\n * @private\n * @name clear\n * @memberOf ListCache\n */\nfunction listCacheClear() {\n this.__data__ = [];\n this.size = 0;\n}\n\n/**\n * Performs a\n * [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * comparison between two values to determine if they are equivalent.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to compare.\n * @param {*} other The other value to compare.\n * @returns {boolean} Returns `true` if the values are equivalent, else `false`.\n * @example\n *\n * var object = { 'a': 1 };\n * var other = { 'a': 1 };\n *\n * _.eq(object, object);\n * // => true\n *\n * _.eq(object, other);\n * // => false\n *\n * _.eq('a', 'a');\n * // => true\n *\n * _.eq('a', Object('a'));\n * // => false\n *\n * _.eq(NaN, NaN);\n * // => true\n */\nfunction eq(value, other) {\n return value === other || (value !== value && other !== other);\n}\n\n/**\n * Gets the index at which the `key` is found in `array` of key-value pairs.\n *\n * @private\n * @param {Array} array The array to inspect.\n * @param {*} key The key to search for.\n * @returns {number} Returns the index of the matched value, else `-1`.\n */\nfunction assocIndexOf(array, key) {\n var length = array.length;\n while (length--) {\n if (eq(array[length][0], key)) {\n return length;\n }\n }\n return -1;\n}\n\n/** Used for built-in method references. */\nvar arrayProto = Array.prototype;\n\n/** Built-in value references. */\nvar splice = arrayProto.splice;\n\n/**\n * Removes `key` and its value from the list cache.\n *\n * @private\n * @name delete\n * @memberOf ListCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction listCacheDelete(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n return false;\n }\n var lastIndex = data.length - 1;\n if (index == lastIndex) {\n data.pop();\n } else {\n splice.call(data, index, 1);\n }\n --this.size;\n return true;\n}\n\n/**\n * Gets the list cache value for `key`.\n *\n * @private\n * @name get\n * @memberOf ListCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction listCacheGet(key) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n return index < 0 ? undefined : data[index][1];\n}\n\n/**\n * Checks if a list cache value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf ListCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction listCacheHas(key) {\n return assocIndexOf(this.__data__, key) > -1;\n}\n\n/**\n * Sets the list cache `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf ListCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the list cache instance.\n */\nfunction listCacheSet(key, value) {\n var data = this.__data__,\n index = assocIndexOf(data, key);\n\n if (index < 0) {\n ++this.size;\n data.push([key, value]);\n } else {\n data[index][1] = value;\n }\n return this;\n}\n\n/**\n * Creates an list cache object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction ListCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `ListCache`.\nListCache.prototype.clear = listCacheClear;\nListCache.prototype['delete'] = listCacheDelete;\nListCache.prototype.get = listCacheGet;\nListCache.prototype.has = listCacheHas;\nListCache.prototype.set = listCacheSet;\n\n/**\n * Removes all key-value entries from the stack.\n *\n * @private\n * @name clear\n * @memberOf Stack\n */\nfunction stackClear() {\n this.__data__ = new ListCache;\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the stack.\n *\n * @private\n * @name delete\n * @memberOf Stack\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction stackDelete(key) {\n var data = this.__data__,\n result = data['delete'](key);\n\n this.size = data.size;\n return result;\n}\n\n/**\n * Gets the stack value for `key`.\n *\n * @private\n * @name get\n * @memberOf Stack\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction stackGet(key) {\n return this.__data__.get(key);\n}\n\n/**\n * Checks if a stack value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Stack\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction stackHas(key) {\n return this.__data__.has(key);\n}\n\n/** Detect free variable `global` from Node.js. */\nvar freeGlobal = typeof global == 'object' && global && global.Object === Object && global;\n\n/** Detect free variable `self`. */\nvar freeSelf = typeof self == 'object' && self && self.Object === Object && self;\n\n/** Used as a reference to the global object. */\nvar root = freeGlobal || freeSelf || Function('return this')();\n\n/** Built-in value references. */\nvar Symbol$1 = root.Symbol;\n\n/** Used for built-in method references. */\nvar objectProto$1 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$1 = objectProto$1.hasOwnProperty;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString = objectProto$1.toString;\n\n/** Built-in value references. */\nvar symToStringTag$1 = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * A specialized version of `baseGetTag` which ignores `Symbol.toStringTag` values.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the raw `toStringTag`.\n */\nfunction getRawTag(value) {\n var isOwn = hasOwnProperty$1.call(value, symToStringTag$1),\n tag = value[symToStringTag$1];\n\n try {\n value[symToStringTag$1] = undefined;\n var unmasked = true;\n } catch (e) {}\n\n var result = nativeObjectToString.call(value);\n if (unmasked) {\n if (isOwn) {\n value[symToStringTag$1] = tag;\n } else {\n delete value[symToStringTag$1];\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$2 = Object.prototype;\n\n/**\n * Used to resolve the\n * [`toStringTag`](http://ecma-international.org/ecma-262/7.0/#sec-object.prototype.tostring)\n * of values.\n */\nvar nativeObjectToString$1 = objectProto$2.toString;\n\n/**\n * Converts `value` to a string using `Object.prototype.toString`.\n *\n * @private\n * @param {*} value The value to convert.\n * @returns {string} Returns the converted string.\n */\nfunction objectToString(value) {\n return nativeObjectToString$1.call(value);\n}\n\n/** `Object#toString` result references. */\nvar nullTag = '[object Null]';\nvar undefinedTag = '[object Undefined]';\n\n/** Built-in value references. */\nvar symToStringTag = Symbol$1 ? Symbol$1.toStringTag : undefined;\n\n/**\n * The base implementation of `getTag` without fallbacks for buggy environments.\n *\n * @private\n * @param {*} value The value to query.\n * @returns {string} Returns the `toStringTag`.\n */\nfunction baseGetTag(value) {\n if (value == null) {\n return value === undefined ? undefinedTag : nullTag;\n }\n return (symToStringTag && symToStringTag in Object(value))\n ? getRawTag(value)\n : objectToString(value);\n}\n\n/**\n * Checks if `value` is the\n * [language type](http://www.ecma-international.org/ecma-262/7.0/#sec-ecmascript-language-types)\n * of `Object`. (e.g. arrays, functions, objects, regexes, `new Number(0)`, and `new String('')`)\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an object, else `false`.\n * @example\n *\n * _.isObject({});\n * // => true\n *\n * _.isObject([1, 2, 3]);\n * // => true\n *\n * _.isObject(_.noop);\n * // => true\n *\n * _.isObject(null);\n * // => false\n */\nfunction isObject(value) {\n var type = typeof value;\n return value != null && (type == 'object' || type == 'function');\n}\n\n/** `Object#toString` result references. */\nvar asyncTag = '[object AsyncFunction]';\nvar funcTag = '[object Function]';\nvar genTag = '[object GeneratorFunction]';\nvar proxyTag = '[object Proxy]';\n\n/**\n * Checks if `value` is classified as a `Function` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a function, else `false`.\n * @example\n *\n * _.isFunction(_);\n * // => true\n *\n * _.isFunction(/abc/);\n * // => false\n */\nfunction isFunction(value) {\n if (!isObject(value)) {\n return false;\n }\n // The use of `Object#toString` avoids issues with the `typeof` operator\n // in Safari 9 which returns 'object' for typed arrays and other constructors.\n var tag = baseGetTag(value);\n return tag == funcTag || tag == genTag || tag == asyncTag || tag == proxyTag;\n}\n\n/** Used to detect overreaching core-js shims. */\nvar coreJsData = root['__core-js_shared__'];\n\n/** Used to detect methods masquerading as native. */\nvar maskSrcKey = (function() {\n var uid = /[^.]+$/.exec(coreJsData && coreJsData.keys && coreJsData.keys.IE_PROTO || '');\n return uid ? ('Symbol(src)_1.' + uid) : '';\n}());\n\n/**\n * Checks if `func` has its source masked.\n *\n * @private\n * @param {Function} func The function to check.\n * @returns {boolean} Returns `true` if `func` is masked, else `false`.\n */\nfunction isMasked(func) {\n return !!maskSrcKey && (maskSrcKey in func);\n}\n\n/** Used for built-in method references. */\nvar funcProto$1 = Function.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$1 = funcProto$1.toString;\n\n/**\n * Converts `func` to its source code.\n *\n * @private\n * @param {Function} func The function to convert.\n * @returns {string} Returns the source code.\n */\nfunction toSource(func) {\n if (func != null) {\n try {\n return funcToString$1.call(func);\n } catch (e) {}\n try {\n return (func + '');\n } catch (e) {}\n }\n return '';\n}\n\n/**\n * Used to match `RegExp`\n * [syntax characters](http://ecma-international.org/ecma-262/7.0/#sec-patterns).\n */\nvar reRegExpChar = /[\\\\^$.*+?()[\\]{}|]/g;\n\n/** Used to detect host constructors (Safari). */\nvar reIsHostCtor = /^\\[object .+?Constructor\\]$/;\n\n/** Used for built-in method references. */\nvar funcProto = Function.prototype;\nvar objectProto = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString = funcProto.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty = objectProto.hasOwnProperty;\n\n/** Used to detect if a method is native. */\nvar reIsNative = RegExp('^' +\n funcToString.call(hasOwnProperty).replace(reRegExpChar, '\\\\$&')\n .replace(/hasOwnProperty|(function).*?(?=\\\\\\()| for .+?(?=\\\\\\])/g, '$1.*?') + '$'\n);\n\n/**\n * The base implementation of `_.isNative` without bad shim checks.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a native function,\n * else `false`.\n */\nfunction baseIsNative(value) {\n if (!isObject(value) || isMasked(value)) {\n return false;\n }\n var pattern = isFunction(value) ? reIsNative : reIsHostCtor;\n return pattern.test(toSource(value));\n}\n\n/**\n * Gets the value at `key` of `object`.\n *\n * @private\n * @param {Object} [object] The object to query.\n * @param {string} key The key of the property to get.\n * @returns {*} Returns the property value.\n */\nfunction getValue(object, key) {\n return object == null ? undefined : object[key];\n}\n\n/**\n * Gets the native function at `key` of `object`.\n *\n * @private\n * @param {Object} object The object to query.\n * @param {string} key The key of the method to get.\n * @returns {*} Returns the function if it's native, else `undefined`.\n */\nfunction getNative(object, key) {\n var value = getValue(object, key);\n return baseIsNative(value) ? value : undefined;\n}\n\n/* Built-in method references that are verified to be native. */\nvar Map = getNative(root, 'Map');\n\n/* Built-in method references that are verified to be native. */\nvar nativeCreate = getNative(Object, 'create');\n\n/**\n * Removes all key-value entries from the hash.\n *\n * @private\n * @name clear\n * @memberOf Hash\n */\nfunction hashClear() {\n this.__data__ = nativeCreate ? nativeCreate(null) : {};\n this.size = 0;\n}\n\n/**\n * Removes `key` and its value from the hash.\n *\n * @private\n * @name delete\n * @memberOf Hash\n * @param {Object} hash The hash to modify.\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction hashDelete(key) {\n var result = this.has(key) && delete this.__data__[key];\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED = '__lodash_hash_undefined__';\n\n/** Used for built-in method references. */\nvar objectProto$3 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$2 = objectProto$3.hasOwnProperty;\n\n/**\n * Gets the hash value for `key`.\n *\n * @private\n * @name get\n * @memberOf Hash\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction hashGet(key) {\n var data = this.__data__;\n if (nativeCreate) {\n var result = data[key];\n return result === HASH_UNDEFINED ? undefined : result;\n }\n return hasOwnProperty$2.call(data, key) ? data[key] : undefined;\n}\n\n/** Used for built-in method references. */\nvar objectProto$4 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$3 = objectProto$4.hasOwnProperty;\n\n/**\n * Checks if a hash value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf Hash\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction hashHas(key) {\n var data = this.__data__;\n return nativeCreate ? (data[key] !== undefined) : hasOwnProperty$3.call(data, key);\n}\n\n/** Used to stand-in for `undefined` hash values. */\nvar HASH_UNDEFINED$1 = '__lodash_hash_undefined__';\n\n/**\n * Sets the hash `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Hash\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the hash instance.\n */\nfunction hashSet(key, value) {\n var data = this.__data__;\n this.size += this.has(key) ? 0 : 1;\n data[key] = (nativeCreate && value === undefined) ? HASH_UNDEFINED$1 : value;\n return this;\n}\n\n/**\n * Creates a hash object.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Hash(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `Hash`.\nHash.prototype.clear = hashClear;\nHash.prototype['delete'] = hashDelete;\nHash.prototype.get = hashGet;\nHash.prototype.has = hashHas;\nHash.prototype.set = hashSet;\n\n/**\n * Removes all key-value entries from the map.\n *\n * @private\n * @name clear\n * @memberOf MapCache\n */\nfunction mapCacheClear() {\n this.size = 0;\n this.__data__ = {\n 'hash': new Hash,\n 'map': new (Map || ListCache),\n 'string': new Hash\n };\n}\n\n/**\n * Checks if `value` is suitable for use as unique object key.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is suitable, else `false`.\n */\nfunction isKeyable(value) {\n var type = typeof value;\n return (type == 'string' || type == 'number' || type == 'symbol' || type == 'boolean')\n ? (value !== '__proto__')\n : (value === null);\n}\n\n/**\n * Gets the data for `map`.\n *\n * @private\n * @param {Object} map The map to query.\n * @param {string} key The reference key.\n * @returns {*} Returns the map data.\n */\nfunction getMapData(map, key) {\n var data = map.__data__;\n return isKeyable(key)\n ? data[typeof key == 'string' ? 'string' : 'hash']\n : data.map;\n}\n\n/**\n * Removes `key` and its value from the map.\n *\n * @private\n * @name delete\n * @memberOf MapCache\n * @param {string} key The key of the value to remove.\n * @returns {boolean} Returns `true` if the entry was removed, else `false`.\n */\nfunction mapCacheDelete(key) {\n var result = getMapData(this, key)['delete'](key);\n this.size -= result ? 1 : 0;\n return result;\n}\n\n/**\n * Gets the map value for `key`.\n *\n * @private\n * @name get\n * @memberOf MapCache\n * @param {string} key The key of the value to get.\n * @returns {*} Returns the entry value.\n */\nfunction mapCacheGet(key) {\n return getMapData(this, key).get(key);\n}\n\n/**\n * Checks if a map value for `key` exists.\n *\n * @private\n * @name has\n * @memberOf MapCache\n * @param {string} key The key of the entry to check.\n * @returns {boolean} Returns `true` if an entry for `key` exists, else `false`.\n */\nfunction mapCacheHas(key) {\n return getMapData(this, key).has(key);\n}\n\n/**\n * Sets the map `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf MapCache\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the map cache instance.\n */\nfunction mapCacheSet(key, value) {\n var data = getMapData(this, key),\n size = data.size;\n\n data.set(key, value);\n this.size += data.size == size ? 0 : 1;\n return this;\n}\n\n/**\n * Creates a map cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction MapCache(entries) {\n var index = -1,\n length = entries == null ? 0 : entries.length;\n\n this.clear();\n while (++index < length) {\n var entry = entries[index];\n this.set(entry[0], entry[1]);\n }\n}\n\n// Add methods to `MapCache`.\nMapCache.prototype.clear = mapCacheClear;\nMapCache.prototype['delete'] = mapCacheDelete;\nMapCache.prototype.get = mapCacheGet;\nMapCache.prototype.has = mapCacheHas;\nMapCache.prototype.set = mapCacheSet;\n\n/** Used as the size to enable large array optimizations. */\nvar LARGE_ARRAY_SIZE = 200;\n\n/**\n * Sets the stack `key` to `value`.\n *\n * @private\n * @name set\n * @memberOf Stack\n * @param {string} key The key of the value to set.\n * @param {*} value The value to set.\n * @returns {Object} Returns the stack cache instance.\n */\nfunction stackSet(key, value) {\n var data = this.__data__;\n if (data instanceof ListCache) {\n var pairs = data.__data__;\n if (!Map || (pairs.length < LARGE_ARRAY_SIZE - 1)) {\n pairs.push([key, value]);\n this.size = ++data.size;\n return this;\n }\n data = this.__data__ = new MapCache(pairs);\n }\n data.set(key, value);\n this.size = data.size;\n return this;\n}\n\n/**\n * Creates a stack cache object to store key-value pairs.\n *\n * @private\n * @constructor\n * @param {Array} [entries] The key-value pairs to cache.\n */\nfunction Stack(entries) {\n var data = this.__data__ = new ListCache(entries);\n this.size = data.size;\n}\n\n// Add methods to `Stack`.\nStack.prototype.clear = stackClear;\nStack.prototype['delete'] = stackDelete;\nStack.prototype.get = stackGet;\nStack.prototype.has = stackHas;\nStack.prototype.set = stackSet;\n\nvar defineProperty$1 = (function() {\n try {\n var func = getNative(Object, 'defineProperty');\n func({}, '', {});\n return func;\n } catch (e) {}\n}());\n\n/**\n * The base implementation of `assignValue` and `assignMergeValue` without\n * value checks.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction baseAssignValue(object, key, value) {\n if (key == '__proto__' && defineProperty$1) {\n defineProperty$1(object, key, {\n 'configurable': true,\n 'enumerable': true,\n 'value': value,\n 'writable': true\n });\n } else {\n object[key] = value;\n }\n}\n\n/**\n * This function is like `assignValue` except that it doesn't assign\n * `undefined` values.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignMergeValue(object, key, value) {\n if ((value !== undefined && !eq(object[key], value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Creates a base function for methods like `_.forIn` and `_.forOwn`.\n *\n * @private\n * @param {boolean} [fromRight] Specify iterating from right to left.\n * @returns {Function} Returns the new base function.\n */\nfunction createBaseFor(fromRight) {\n return function(object, iteratee, keysFunc) {\n var index = -1,\n iterable = Object(object),\n props = keysFunc(object),\n length = props.length;\n\n while (length--) {\n var key = props[fromRight ? length : ++index];\n if (iteratee(iterable[key], key, iterable) === false) {\n break;\n }\n }\n return object;\n };\n}\n\n/**\n * The base implementation of `baseForOwn` which iterates over `object`\n * properties returned by `keysFunc` and invokes `iteratee` for each property.\n * Iteratee functions may exit iteration early by explicitly returning `false`.\n *\n * @private\n * @param {Object} object The object to iterate over.\n * @param {Function} iteratee The function invoked per iteration.\n * @param {Function} keysFunc The function to get the keys of `object`.\n * @returns {Object} Returns `object`.\n */\nvar baseFor = createBaseFor();\n\n/** Detect free variable `exports`. */\nvar freeExports = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule = freeExports && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports = freeModule && freeModule.exports === freeExports;\n\n/** Built-in value references. */\nvar Buffer = moduleExports ? root.Buffer : undefined;\nvar allocUnsafe = Buffer ? Buffer.allocUnsafe : undefined;\n\n/**\n * Creates a clone of `buffer`.\n *\n * @private\n * @param {Buffer} buffer The buffer to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Buffer} Returns the cloned buffer.\n */\nfunction cloneBuffer(buffer, isDeep) {\n if (isDeep) {\n return buffer.slice();\n }\n var length = buffer.length,\n result = allocUnsafe ? allocUnsafe(length) : new buffer.constructor(length);\n\n buffer.copy(result);\n return result;\n}\n\n/** Built-in value references. */\nvar Uint8Array = root.Uint8Array;\n\n/**\n * Creates a clone of `arrayBuffer`.\n *\n * @private\n * @param {ArrayBuffer} arrayBuffer The array buffer to clone.\n * @returns {ArrayBuffer} Returns the cloned array buffer.\n */\nfunction cloneArrayBuffer(arrayBuffer) {\n var result = new arrayBuffer.constructor(arrayBuffer.byteLength);\n new Uint8Array(result).set(new Uint8Array(arrayBuffer));\n return result;\n}\n\n/**\n * Creates a clone of `typedArray`.\n *\n * @private\n * @param {Object} typedArray The typed array to clone.\n * @param {boolean} [isDeep] Specify a deep clone.\n * @returns {Object} Returns the cloned typed array.\n */\nfunction cloneTypedArray(typedArray, isDeep) {\n var buffer = isDeep ? cloneArrayBuffer(typedArray.buffer) : typedArray.buffer;\n return new typedArray.constructor(buffer, typedArray.byteOffset, typedArray.length);\n}\n\n/**\n * Copies the values of `source` to `array`.\n *\n * @private\n * @param {Array} source The array to copy values from.\n * @param {Array} [array=[]] The array to copy values to.\n * @returns {Array} Returns `array`.\n */\nfunction copyArray(source, array) {\n var index = -1,\n length = source.length;\n\n array || (array = Array(length));\n while (++index < length) {\n array[index] = source[index];\n }\n return array;\n}\n\n/** Built-in value references. */\nvar objectCreate = Object.create;\n\n/**\n * The base implementation of `_.create` without support for assigning\n * properties to the created object.\n *\n * @private\n * @param {Object} proto The object to inherit from.\n * @returns {Object} Returns the new object.\n */\nvar baseCreate = (function() {\n function object() {}\n return function(proto) {\n if (!isObject(proto)) {\n return {};\n }\n if (objectCreate) {\n return objectCreate(proto);\n }\n object.prototype = proto;\n var result = new object;\n object.prototype = undefined;\n return result;\n };\n}());\n\n/**\n * Creates a unary function that invokes `func` with its argument transformed.\n *\n * @private\n * @param {Function} func The function to wrap.\n * @param {Function} transform The argument transform.\n * @returns {Function} Returns the new function.\n */\nfunction overArg(func, transform) {\n return function(arg) {\n return func(transform(arg));\n };\n}\n\n/** Built-in value references. */\nvar getPrototype = overArg(Object.getPrototypeOf, Object);\n\n/** Used for built-in method references. */\nvar objectProto$5 = Object.prototype;\n\n/**\n * Checks if `value` is likely a prototype object.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a prototype, else `false`.\n */\nfunction isPrototype(value) {\n var Ctor = value && value.constructor,\n proto = (typeof Ctor == 'function' && Ctor.prototype) || objectProto$5;\n\n return value === proto;\n}\n\n/**\n * Initializes an object clone.\n *\n * @private\n * @param {Object} object The object to clone.\n * @returns {Object} Returns the initialized clone.\n */\nfunction initCloneObject(object) {\n return (typeof object.constructor == 'function' && !isPrototype(object))\n ? baseCreate(getPrototype(object))\n : {};\n}\n\n/**\n * Checks if `value` is object-like. A value is object-like if it's not `null`\n * and has a `typeof` result of \"object\".\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is object-like, else `false`.\n * @example\n *\n * _.isObjectLike({});\n * // => true\n *\n * _.isObjectLike([1, 2, 3]);\n * // => true\n *\n * _.isObjectLike(_.noop);\n * // => false\n *\n * _.isObjectLike(null);\n * // => false\n */\nfunction isObjectLike(value) {\n return value != null && typeof value == 'object';\n}\n\n/** `Object#toString` result references. */\nvar argsTag = '[object Arguments]';\n\n/**\n * The base implementation of `_.isArguments`.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n */\nfunction baseIsArguments(value) {\n return isObjectLike(value) && baseGetTag(value) == argsTag;\n}\n\n/** Used for built-in method references. */\nvar objectProto$6 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$4 = objectProto$6.hasOwnProperty;\n\n/** Built-in value references. */\nvar propertyIsEnumerable = objectProto$6.propertyIsEnumerable;\n\n/**\n * Checks if `value` is likely an `arguments` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an `arguments` object,\n * else `false`.\n * @example\n *\n * _.isArguments(function() { return arguments; }());\n * // => true\n *\n * _.isArguments([1, 2, 3]);\n * // => false\n */\nvar isArguments = baseIsArguments(function() { return arguments; }()) ? baseIsArguments : function(value) {\n return isObjectLike(value) && hasOwnProperty$4.call(value, 'callee') &&\n !propertyIsEnumerable.call(value, 'callee');\n};\n\n/**\n * Checks if `value` is classified as an `Array` object.\n *\n * @static\n * @memberOf _\n * @since 0.1.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array, else `false`.\n * @example\n *\n * _.isArray([1, 2, 3]);\n * // => true\n *\n * _.isArray(document.body.children);\n * // => false\n *\n * _.isArray('abc');\n * // => false\n *\n * _.isArray(_.noop);\n * // => false\n */\nvar isArray = Array.isArray;\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER = 9007199254740991;\n\n/**\n * Checks if `value` is a valid array-like length.\n *\n * **Note:** This method is loosely based on\n * [`ToLength`](http://ecma-international.org/ecma-262/7.0/#sec-tolength).\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a valid length, else `false`.\n * @example\n *\n * _.isLength(3);\n * // => true\n *\n * _.isLength(Number.MIN_VALUE);\n * // => false\n *\n * _.isLength(Infinity);\n * // => false\n *\n * _.isLength('3');\n * // => false\n */\nfunction isLength(value) {\n return typeof value == 'number' &&\n value > -1 && value % 1 == 0 && value <= MAX_SAFE_INTEGER;\n}\n\n/**\n * Checks if `value` is array-like. A value is considered array-like if it's\n * not a function and has a `value.length` that's an integer greater than or\n * equal to `0` and less than or equal to `Number.MAX_SAFE_INTEGER`.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is array-like, else `false`.\n * @example\n *\n * _.isArrayLike([1, 2, 3]);\n * // => true\n *\n * _.isArrayLike(document.body.children);\n * // => true\n *\n * _.isArrayLike('abc');\n * // => true\n *\n * _.isArrayLike(_.noop);\n * // => false\n */\nfunction isArrayLike(value) {\n return value != null && isLength(value.length) && !isFunction(value);\n}\n\n/**\n * This method is like `_.isArrayLike` except that it also checks if `value`\n * is an object.\n *\n * @static\n * @memberOf _\n * @since 4.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is an array-like object,\n * else `false`.\n * @example\n *\n * _.isArrayLikeObject([1, 2, 3]);\n * // => true\n *\n * _.isArrayLikeObject(document.body.children);\n * // => true\n *\n * _.isArrayLikeObject('abc');\n * // => false\n *\n * _.isArrayLikeObject(_.noop);\n * // => false\n */\nfunction isArrayLikeObject(value) {\n return isObjectLike(value) && isArrayLike(value);\n}\n\n/**\n * This method returns `false`.\n *\n * @static\n * @memberOf _\n * @since 4.13.0\n * @category Util\n * @returns {boolean} Returns `false`.\n * @example\n *\n * _.times(2, _.stubFalse);\n * // => [false, false]\n */\nfunction stubFalse() {\n return false;\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$1 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$1 = freeExports$1 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$1 = freeModule$1 && freeModule$1.exports === freeExports$1;\n\n/** Built-in value references. */\nvar Buffer$1 = moduleExports$1 ? root.Buffer : undefined;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeIsBuffer = Buffer$1 ? Buffer$1.isBuffer : undefined;\n\n/**\n * Checks if `value` is a buffer.\n *\n * @static\n * @memberOf _\n * @since 4.3.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a buffer, else `false`.\n * @example\n *\n * _.isBuffer(new Buffer(2));\n * // => true\n *\n * _.isBuffer(new Uint8Array(2));\n * // => false\n */\nvar isBuffer = nativeIsBuffer || stubFalse;\n\n/** `Object#toString` result references. */\nvar objectTag = '[object Object]';\n\n/** Used for built-in method references. */\nvar funcProto$2 = Function.prototype;\nvar objectProto$7 = Object.prototype;\n\n/** Used to resolve the decompiled source of functions. */\nvar funcToString$2 = funcProto$2.toString;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$5 = objectProto$7.hasOwnProperty;\n\n/** Used to infer the `Object` constructor. */\nvar objectCtorString = funcToString$2.call(Object);\n\n/**\n * Checks if `value` is a plain object, that is, an object created by the\n * `Object` constructor or one with a `[[Prototype]]` of `null`.\n *\n * @static\n * @memberOf _\n * @since 0.8.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a plain object, else `false`.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * }\n *\n * _.isPlainObject(new Foo);\n * // => false\n *\n * _.isPlainObject([1, 2, 3]);\n * // => false\n *\n * _.isPlainObject({ 'x': 0, 'y': 0 });\n * // => true\n *\n * _.isPlainObject(Object.create(null));\n * // => true\n */\nfunction isPlainObject(value) {\n if (!isObjectLike(value) || baseGetTag(value) != objectTag) {\n return false;\n }\n var proto = getPrototype(value);\n if (proto === null) {\n return true;\n }\n var Ctor = hasOwnProperty$5.call(proto, 'constructor') && proto.constructor;\n return typeof Ctor == 'function' && Ctor instanceof Ctor &&\n funcToString$2.call(Ctor) == objectCtorString;\n}\n\n/** `Object#toString` result references. */\nvar argsTag$1 = '[object Arguments]';\nvar arrayTag = '[object Array]';\nvar boolTag = '[object Boolean]';\nvar dateTag = '[object Date]';\nvar errorTag = '[object Error]';\nvar funcTag$1 = '[object Function]';\nvar mapTag = '[object Map]';\nvar numberTag = '[object Number]';\nvar objectTag$1 = '[object Object]';\nvar regexpTag = '[object RegExp]';\nvar setTag = '[object Set]';\nvar stringTag = '[object String]';\nvar weakMapTag = '[object WeakMap]';\n\nvar arrayBufferTag = '[object ArrayBuffer]';\nvar dataViewTag = '[object DataView]';\nvar float32Tag = '[object Float32Array]';\nvar float64Tag = '[object Float64Array]';\nvar int8Tag = '[object Int8Array]';\nvar int16Tag = '[object Int16Array]';\nvar int32Tag = '[object Int32Array]';\nvar uint8Tag = '[object Uint8Array]';\nvar uint8ClampedTag = '[object Uint8ClampedArray]';\nvar uint16Tag = '[object Uint16Array]';\nvar uint32Tag = '[object Uint32Array]';\n\n/** Used to identify `toStringTag` values of typed arrays. */\nvar typedArrayTags = {};\ntypedArrayTags[float32Tag] = typedArrayTags[float64Tag] =\ntypedArrayTags[int8Tag] = typedArrayTags[int16Tag] =\ntypedArrayTags[int32Tag] = typedArrayTags[uint8Tag] =\ntypedArrayTags[uint8ClampedTag] = typedArrayTags[uint16Tag] =\ntypedArrayTags[uint32Tag] = true;\ntypedArrayTags[argsTag$1] = typedArrayTags[arrayTag] =\ntypedArrayTags[arrayBufferTag] = typedArrayTags[boolTag] =\ntypedArrayTags[dataViewTag] = typedArrayTags[dateTag] =\ntypedArrayTags[errorTag] = typedArrayTags[funcTag$1] =\ntypedArrayTags[mapTag] = typedArrayTags[numberTag] =\ntypedArrayTags[objectTag$1] = typedArrayTags[regexpTag] =\ntypedArrayTags[setTag] = typedArrayTags[stringTag] =\ntypedArrayTags[weakMapTag] = false;\n\n/**\n * The base implementation of `_.isTypedArray` without Node.js optimizations.\n *\n * @private\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n */\nfunction baseIsTypedArray(value) {\n return isObjectLike(value) &&\n isLength(value.length) && !!typedArrayTags[baseGetTag(value)];\n}\n\n/**\n * The base implementation of `_.unary` without support for storing metadata.\n *\n * @private\n * @param {Function} func The function to cap arguments for.\n * @returns {Function} Returns the new capped function.\n */\nfunction baseUnary(func) {\n return function(value) {\n return func(value);\n };\n}\n\n/** Detect free variable `exports`. */\nvar freeExports$2 = typeof exports == 'object' && exports && !exports.nodeType && exports;\n\n/** Detect free variable `module`. */\nvar freeModule$2 = freeExports$2 && typeof module == 'object' && module && !module.nodeType && module;\n\n/** Detect the popular CommonJS extension `module.exports`. */\nvar moduleExports$2 = freeModule$2 && freeModule$2.exports === freeExports$2;\n\n/** Detect free variable `process` from Node.js. */\nvar freeProcess = moduleExports$2 && freeGlobal.process;\n\n/** Used to access faster Node.js helpers. */\nvar nodeUtil = (function() {\n try {\n return freeProcess && freeProcess.binding && freeProcess.binding('util');\n } catch (e) {}\n}());\n\n/* Node.js helper references. */\nvar nodeIsTypedArray = nodeUtil && nodeUtil.isTypedArray;\n\n/**\n * Checks if `value` is classified as a typed array.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to check.\n * @returns {boolean} Returns `true` if `value` is a typed array, else `false`.\n * @example\n *\n * _.isTypedArray(new Uint8Array);\n * // => true\n *\n * _.isTypedArray([]);\n * // => false\n */\nvar isTypedArray = nodeIsTypedArray ? baseUnary(nodeIsTypedArray) : baseIsTypedArray;\n\n/** Used for built-in method references. */\nvar objectProto$8 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$6 = objectProto$8.hasOwnProperty;\n\n/**\n * Assigns `value` to `key` of `object` if the existing value is not equivalent\n * using [`SameValueZero`](http://ecma-international.org/ecma-262/7.0/#sec-samevaluezero)\n * for equality comparisons.\n *\n * @private\n * @param {Object} object The object to modify.\n * @param {string} key The key of the property to assign.\n * @param {*} value The value to assign.\n */\nfunction assignValue(object, key, value) {\n var objValue = object[key];\n if (!(hasOwnProperty$6.call(object, key) && eq(objValue, value)) ||\n (value === undefined && !(key in object))) {\n baseAssignValue(object, key, value);\n }\n}\n\n/**\n * Copies properties of `source` to `object`.\n *\n * @private\n * @param {Object} source The object to copy properties from.\n * @param {Array} props The property identifiers to copy.\n * @param {Object} [object={}] The object to copy properties to.\n * @param {Function} [customizer] The function to customize copied values.\n * @returns {Object} Returns `object`.\n */\nfunction copyObject(source, props, object, customizer) {\n var isNew = !object;\n object || (object = {});\n\n var index = -1,\n length = props.length;\n\n while (++index < length) {\n var key = props[index];\n\n var newValue = customizer\n ? customizer(object[key], source[key], key, object, source)\n : undefined;\n\n if (newValue === undefined) {\n newValue = source[key];\n }\n if (isNew) {\n baseAssignValue(object, key, newValue);\n } else {\n assignValue(object, key, newValue);\n }\n }\n return object;\n}\n\n/**\n * The base implementation of `_.times` without support for iteratee shorthands\n * or max array length checks.\n *\n * @private\n * @param {number} n The number of times to invoke `iteratee`.\n * @param {Function} iteratee The function invoked per iteration.\n * @returns {Array} Returns the array of results.\n */\nfunction baseTimes(n, iteratee) {\n var index = -1,\n result = Array(n);\n\n while (++index < n) {\n result[index] = iteratee(index);\n }\n return result;\n}\n\n/** Used as references for various `Number` constants. */\nvar MAX_SAFE_INTEGER$1 = 9007199254740991;\n\n/** Used to detect unsigned integer values. */\nvar reIsUint = /^(?:0|[1-9]\\d*)$/;\n\n/**\n * Checks if `value` is a valid array-like index.\n *\n * @private\n * @param {*} value The value to check.\n * @param {number} [length=MAX_SAFE_INTEGER] The upper bounds of a valid index.\n * @returns {boolean} Returns `true` if `value` is a valid index, else `false`.\n */\nfunction isIndex(value, length) {\n length = length == null ? MAX_SAFE_INTEGER$1 : length;\n return !!length &&\n (typeof value == 'number' || reIsUint.test(value)) &&\n (value > -1 && value % 1 == 0 && value < length);\n}\n\n/** Used for built-in method references. */\nvar objectProto$9 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$7 = objectProto$9.hasOwnProperty;\n\n/**\n * Creates an array of the enumerable property names of the array-like `value`.\n *\n * @private\n * @param {*} value The value to query.\n * @param {boolean} inherited Specify returning inherited property names.\n * @returns {Array} Returns the array of property names.\n */\nfunction arrayLikeKeys(value, inherited) {\n var isArr = isArray(value),\n isArg = !isArr && isArguments(value),\n isBuff = !isArr && !isArg && isBuffer(value),\n isType = !isArr && !isArg && !isBuff && isTypedArray(value),\n skipIndexes = isArr || isArg || isBuff || isType,\n result = skipIndexes ? baseTimes(value.length, String) : [],\n length = result.length;\n\n for (var key in value) {\n if ((inherited || hasOwnProperty$7.call(value, key)) &&\n !(skipIndexes && (\n // Safari 9 has enumerable `arguments.length` in strict mode.\n key == 'length' ||\n // Node.js 0.10 has enumerable non-index properties on buffers.\n (isBuff && (key == 'offset' || key == 'parent')) ||\n // PhantomJS 2 has enumerable non-index properties on typed arrays.\n (isType && (key == 'buffer' || key == 'byteLength' || key == 'byteOffset')) ||\n // Skip index properties.\n isIndex(key, length)\n ))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * This function is like\n * [`Object.keys`](http://ecma-international.org/ecma-262/7.0/#sec-object.keys)\n * except that it includes inherited enumerable properties.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction nativeKeysIn(object) {\n var result = [];\n if (object != null) {\n for (var key in Object(object)) {\n result.push(key);\n }\n }\n return result;\n}\n\n/** Used for built-in method references. */\nvar objectProto$10 = Object.prototype;\n\n/** Used to check objects for own properties. */\nvar hasOwnProperty$8 = objectProto$10.hasOwnProperty;\n\n/**\n * The base implementation of `_.keysIn` which doesn't treat sparse arrays as dense.\n *\n * @private\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n */\nfunction baseKeysIn(object) {\n if (!isObject(object)) {\n return nativeKeysIn(object);\n }\n var isProto = isPrototype(object),\n result = [];\n\n for (var key in object) {\n if (!(key == 'constructor' && (isProto || !hasOwnProperty$8.call(object, key)))) {\n result.push(key);\n }\n }\n return result;\n}\n\n/**\n * Creates an array of the own and inherited enumerable property names of `object`.\n *\n * **Note:** Non-object values are coerced to objects.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Object\n * @param {Object} object The object to query.\n * @returns {Array} Returns the array of property names.\n * @example\n *\n * function Foo() {\n * this.a = 1;\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.keysIn(new Foo);\n * // => ['a', 'b', 'c'] (iteration order is not guaranteed)\n */\nfunction keysIn(object) {\n return isArrayLike(object) ? arrayLikeKeys(object, true) : baseKeysIn(object);\n}\n\n/**\n * Converts `value` to a plain object flattening inherited enumerable string\n * keyed properties of `value` to own properties of the plain object.\n *\n * @static\n * @memberOf _\n * @since 3.0.0\n * @category Lang\n * @param {*} value The value to convert.\n * @returns {Object} Returns the converted plain object.\n * @example\n *\n * function Foo() {\n * this.b = 2;\n * }\n *\n * Foo.prototype.c = 3;\n *\n * _.assign({ 'a': 1 }, new Foo);\n * // => { 'a': 1, 'b': 2 }\n *\n * _.assign({ 'a': 1 }, _.toPlainObject(new Foo));\n * // => { 'a': 1, 'b': 2, 'c': 3 }\n */\nfunction toPlainObject(value) {\n return copyObject(value, keysIn(value));\n}\n\n/**\n * A specialized version of `baseMerge` for arrays and objects which performs\n * deep merges and tracks traversed objects enabling objects with circular\n * references to be merged.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {string} key The key of the value to merge.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} mergeFunc The function to merge values.\n * @param {Function} [customizer] The function to customize assigned values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMergeDeep(object, source, key, srcIndex, mergeFunc, customizer, stack) {\n var objValue = object[key],\n srcValue = source[key],\n stacked = stack.get(srcValue);\n\n if (stacked) {\n assignMergeValue(object, key, stacked);\n return;\n }\n var newValue = customizer\n ? customizer(objValue, srcValue, (key + ''), object, source, stack)\n : undefined;\n\n var isCommon = newValue === undefined;\n\n if (isCommon) {\n var isArr = isArray(srcValue),\n isBuff = !isArr && isBuffer(srcValue),\n isTyped = !isArr && !isBuff && isTypedArray(srcValue);\n\n newValue = srcValue;\n if (isArr || isBuff || isTyped) {\n if (isArray(objValue)) {\n newValue = objValue;\n }\n else if (isArrayLikeObject(objValue)) {\n newValue = copyArray(objValue);\n }\n else if (isBuff) {\n isCommon = false;\n newValue = cloneBuffer(srcValue, true);\n }\n else if (isTyped) {\n isCommon = false;\n newValue = cloneTypedArray(srcValue, true);\n }\n else {\n newValue = [];\n }\n }\n else if (isPlainObject(srcValue) || isArguments(srcValue)) {\n newValue = objValue;\n if (isArguments(objValue)) {\n newValue = toPlainObject(objValue);\n }\n else if (!isObject(objValue) || (srcIndex && isFunction(objValue))) {\n newValue = initCloneObject(srcValue);\n }\n }\n else {\n isCommon = false;\n }\n }\n if (isCommon) {\n // Recursively merge objects and arrays (susceptible to call stack limits).\n stack.set(srcValue, newValue);\n mergeFunc(newValue, srcValue, srcIndex, customizer, stack);\n stack['delete'](srcValue);\n }\n assignMergeValue(object, key, newValue);\n}\n\n/**\n * The base implementation of `_.merge` without support for multiple sources.\n *\n * @private\n * @param {Object} object The destination object.\n * @param {Object} source The source object.\n * @param {number} srcIndex The index of `source`.\n * @param {Function} [customizer] The function to customize merged values.\n * @param {Object} [stack] Tracks traversed source values and their merged\n * counterparts.\n */\nfunction baseMerge(object, source, srcIndex, customizer, stack) {\n if (object === source) {\n return;\n }\n baseFor(source, function(srcValue, key) {\n if (isObject(srcValue)) {\n stack || (stack = new Stack);\n baseMergeDeep(object, source, key, srcIndex, baseMerge, customizer, stack);\n }\n else {\n var newValue = customizer\n ? customizer(object[key], srcValue, (key + ''), object, source, stack)\n : undefined;\n\n if (newValue === undefined) {\n newValue = srcValue;\n }\n assignMergeValue(object, key, newValue);\n }\n }, keysIn);\n}\n\n/**\n * This method returns the first argument it receives.\n *\n * @static\n * @since 0.1.0\n * @memberOf _\n * @category Util\n * @param {*} value Any value.\n * @returns {*} Returns `value`.\n * @example\n *\n * var object = { 'a': 1 };\n *\n * console.log(_.identity(object) === object);\n * // => true\n */\nfunction identity(value) {\n return value;\n}\n\n/**\n * A faster alternative to `Function#apply`, this function invokes `func`\n * with the `this` binding of `thisArg` and the arguments of `args`.\n *\n * @private\n * @param {Function} func The function to invoke.\n * @param {*} thisArg The `this` binding of `func`.\n * @param {Array} args The arguments to invoke `func` with.\n * @returns {*} Returns the result of `func`.\n */\nfunction apply(func, thisArg, args) {\n switch (args.length) {\n case 0: return func.call(thisArg);\n case 1: return func.call(thisArg, args[0]);\n case 2: return func.call(thisArg, args[0], args[1]);\n case 3: return func.call(thisArg, args[0], args[1], args[2]);\n }\n return func.apply(thisArg, args);\n}\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeMax = Math.max;\n\n/**\n * A specialized version of `baseRest` which transforms the rest array.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @param {Function} transform The rest array transform.\n * @returns {Function} Returns the new function.\n */\nfunction overRest(func, start, transform) {\n start = nativeMax(start === undefined ? (func.length - 1) : start, 0);\n return function() {\n var args = arguments,\n index = -1,\n length = nativeMax(args.length - start, 0),\n array = Array(length);\n\n while (++index < length) {\n array[index] = args[start + index];\n }\n index = -1;\n var otherArgs = Array(start + 1);\n while (++index < start) {\n otherArgs[index] = args[index];\n }\n otherArgs[start] = transform(array);\n return apply(func, this, otherArgs);\n };\n}\n\n/**\n * Creates a function that returns `value`.\n *\n * @static\n * @memberOf _\n * @since 2.4.0\n * @category Util\n * @param {*} value The value to return from the new function.\n * @returns {Function} Returns the new constant function.\n * @example\n *\n * var objects = _.times(2, _.constant({ 'a': 1 }));\n *\n * console.log(objects);\n * // => [{ 'a': 1 }, { 'a': 1 }]\n *\n * console.log(objects[0] === objects[1]);\n * // => true\n */\nfunction constant(value) {\n return function() {\n return value;\n };\n}\n\n/**\n * The base implementation of `setToString` without support for hot loop shorting.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar baseSetToString = !defineProperty$1 ? identity : function(func, string) {\n return defineProperty$1(func, 'toString', {\n 'configurable': true,\n 'enumerable': false,\n 'value': constant(string),\n 'writable': true\n });\n};\n\n/** Used to detect hot functions by number of calls within a span of milliseconds. */\nvar HOT_COUNT = 800;\nvar HOT_SPAN = 16;\n\n/* Built-in method references for those with the same name as other `lodash` methods. */\nvar nativeNow = Date.now;\n\n/**\n * Creates a function that'll short out and invoke `identity` instead\n * of `func` when it's called `HOT_COUNT` or more times in `HOT_SPAN`\n * milliseconds.\n *\n * @private\n * @param {Function} func The function to restrict.\n * @returns {Function} Returns the new shortable function.\n */\nfunction shortOut(func) {\n var count = 0,\n lastCalled = 0;\n\n return function() {\n var stamp = nativeNow(),\n remaining = HOT_SPAN - (stamp - lastCalled);\n\n lastCalled = stamp;\n if (remaining > 0) {\n if (++count >= HOT_COUNT) {\n return arguments[0];\n }\n } else {\n count = 0;\n }\n return func.apply(undefined, arguments);\n };\n}\n\n/**\n * Sets the `toString` method of `func` to return `string`.\n *\n * @private\n * @param {Function} func The function to modify.\n * @param {Function} string The `toString` result.\n * @returns {Function} Returns `func`.\n */\nvar setToString = shortOut(baseSetToString);\n\n/**\n * The base implementation of `_.rest` which doesn't validate or coerce arguments.\n *\n * @private\n * @param {Function} func The function to apply a rest parameter to.\n * @param {number} [start=func.length-1] The start position of the rest parameter.\n * @returns {Function} Returns the new function.\n */\nfunction baseRest(func, start) {\n return setToString(overRest(func, start, identity), func + '');\n}\n\n/**\n * Checks if the given arguments are from an iteratee call.\n *\n * @private\n * @param {*} value The potential iteratee value argument.\n * @param {*} index The potential iteratee index or key argument.\n * @param {*} object The potential iteratee object argument.\n * @returns {boolean} Returns `true` if the arguments are from an iteratee call,\n * else `false`.\n */\nfunction isIterateeCall(value, index, object) {\n if (!isObject(object)) {\n return false;\n }\n var type = typeof index;\n if (type == 'number'\n ? (isArrayLike(object) && isIndex(index, object.length))\n : (type == 'string' && index in object)\n ) {\n return eq(object[index], value);\n }\n return false;\n}\n\n/**\n * Creates a function like `_.assign`.\n *\n * @private\n * @param {Function} assigner The function to assign values.\n * @returns {Function} Returns the new assigner function.\n */\nfunction createAssigner(assigner) {\n return baseRest(function(object, sources) {\n var index = -1,\n length = sources.length,\n customizer = length > 1 ? sources[length - 1] : undefined,\n guard = length > 2 ? sources[2] : undefined;\n\n customizer = (assigner.length > 3 && typeof customizer == 'function')\n ? (length--, customizer)\n : undefined;\n\n if (guard && isIterateeCall(sources[0], sources[1], guard)) {\n customizer = length < 3 ? undefined : customizer;\n length = 1;\n }\n object = Object(object);\n while (++index < length) {\n var source = sources[index];\n if (source) {\n assigner(object, source, index, customizer);\n }\n }\n return object;\n });\n}\n\n/**\n * This method is like `_.assign` except that it recursively merges own and\n * inherited enumerable string keyed properties of source objects into the\n * destination object. Source properties that resolve to `undefined` are\n * skipped if a destination value exists. Array and plain object properties\n * are merged recursively. Other objects and value types are overridden by\n * assignment. Source objects are applied from left to right. Subsequent\n * sources overwrite property assignments of previous sources.\n *\n * **Note:** This method mutates `object`.\n *\n * @static\n * @memberOf _\n * @since 0.5.0\n * @category Object\n * @param {Object} object The destination object.\n * @param {...Object} [sources] The source objects.\n * @returns {Object} Returns `object`.\n * @example\n *\n * var object = {\n * 'a': [{ 'b': 2 }, { 'd': 4 }]\n * };\n *\n * var other = {\n * 'a': [{ 'c': 3 }, { 'e': 5 }]\n * };\n *\n * _.merge(object, other);\n * // => { 'a': [{ 'b': 2, 'c': 3 }, { 'd': 4, 'e': 5 }] }\n */\nvar merge = createAssigner(function(object, source, srcIndex) {\n baseMerge(object, source, srcIndex);\n});\n\nvar mergeOptions = function mergeOptions(obj, src) {\n return merge(obj, src);\n};\n\nvar VoBasic = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-basic\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'orgchart',\n props: {\n data: { type: Object, default: function _default() {\n return {};\n }\n },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n 'chartContainer': '#chart-container'\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nvar closest = function closest(el, fn) {\n return el && (fn(el) && el !== document.querySelector('.orgchart') ? el : closest(el.parentNode, fn));\n};\n\n\n\n\n\nvar bindEventHandler = function bindEventHandler(selector, type, fn, parentSelector) {\n if (parentSelector) {\n document.querySelector(parentSelector).addEventListener(type, function (event) {\n if (event.target.classList && event.target.classList.contains(selector.slice(1)) || closest(event.target, function (el) {\n return el.classList && el.classList.contains(selector.slice(1));\n })) {\n fn(event);\n }\n });\n } else {\n document.querySelectorAll(selector).forEach(function (element) {\n element.addEventListener(type, fn);\n });\n }\n};\n\nvar clickNode = function clickNode(event) {\n var sNode = closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n var sNodeInput = document.getElementById('selected-node');\n\n sNodeInput.value = sNode.querySelector('.title').textContent;\n sNodeInput.dataset.node = sNode.id;\n};\n\nvar clickChart = function clickChart(event) {\n if (!closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n })) {\n document.getElementById('selected-node').textContent = '';\n }\n};\n\n\n\n\n\n\n\n\n\n\n\nvar getId = function getId() {\n return new Date().getTime() * 1000 + Math.floor(Math.random() * 1001);\n};\n\nvar VoEdit = { render: function render() {\n var _vm = this;var _h = _vm.$createElement;var _c = _vm._self._c || _h;return _c('div', { staticClass: \"vo-edit\", attrs: { \"id\": \"chart-container\" } });\n }, staticRenderFns: [],\n name: 'VoEdit',\n props: {\n data: { type: Object },\n pan: { type: Boolean, default: false },\n zoom: { type: Boolean, default: false },\n direction: { type: String, default: 't2b' },\n verticalDepth: { type: Number },\n toggleSiblingsResp: { type: Boolean, default: false },\n ajaxURL: { type: Object },\n depth: { type: Number, default: 999 },\n nodeTitle: { type: String, default: 'name' },\n parentNodeSymbol: { type: String, default: '' },\n nodeContent: { type: String },\n nodeId: { type: String, default: 'id' },\n createNode: { type: Function },\n exportButton: { type: Boolean, default: false },\n exportButtonName: { type: String, default: 'Export' },\n exportFilename: { type: String },\n chartClass: { type: String, default: '' },\n draggable: { type: Boolean, default: false },\n dropCriteria: { type: Function },\n toggleCollapse: { type: Boolean, default: true }\n },\n data: function data() {\n return {\n newData: null,\n orgchart: null,\n defaultOptions: {\n chartContainer: '#chart-container',\n createNode: function createNode(node, data) {\n node.id = getId();\n }\n }\n };\n },\n mounted: function mounted() {\n this.newData === null ? this.initOrgChart() : null;\n this.$nextTick(function () {\n bindEventHandler('.node', 'click', clickNode, '#chart-container');\n bindEventHandler('.orgchart', 'click', clickChart, '#chart-container');\n });\n },\n\n methods: {\n initOrgChart: function initOrgChart() {\n var opts = mergeOptions(this.defaultOptions, this.$props);\n this.orgchart = new OrgChart$1(opts);\n }\n },\n watch: {\n data: function data(newVal) {\n var _this = this;\n\n this.newData = newVal;\n var promise = new Promise(function (resolve) {\n if (newVal) {\n resolve();\n }\n });\n promise.then(function () {\n var opts = mergeOptions(_this.defaultOptions, _this.$props);\n _this.orgchart = new OrgChart$1(opts);\n });\n }\n }\n};\n\nif (typeof window !== 'undefined' && window.Vue) {\n window.Vue.component('vo-basic', VoBasic);\n window.Vue.component('vo-edit', VoEdit);\n}\n\nexports.VoBasic = VoBasic;\nexports.VoEdit = VoEdit;\n\nObject.defineProperty(exports, '__esModule', { value: true });\n\n})));\n" }, { "path": "docs/.nojekyll", "content": "" }, { "path": "docs/README.md", "content": "## vue-orgchart\n\n> A vue wrapper for OrgChart.js.\n\n### Intro\n- First of all, thanks a lot for dabeng's great work -- [OrgChart.js](https://github.com/dabeng/OrgChart.js)\n- If you prefer the Vue.js Wrapper for Orgchart.js,you could try [my project](https://github.com/spiritree/vue-orgchart)\n\n### Feature\n- Support import and export JSON\n- Supports exporting chart as a picture\n- draggable Orgchart\n- Editable Orgchart\n\n...\n" }, { "path": "docs/_coverpage.md", "content": "![logo](_assets/tree.svg)\n\n# vue-orgchart 1.0.0\n\n> A Vue.js wrapper for OrgChart.js.\n\n- Support import and export JSON\n- Supports exporting chart as a picture\n- Editable Orgchart\n\n\n[GitHub](https://github.com/spiritree/vue-orgchart)\n[Get Started](#vue-orgchart)\n\n\n![color](#b3daff)\n" }, { "path": "docs/_navbar.md", "content": "- Translations\n - [:cn: 中文](/zh-cn/)\n - [:uk: English](/)\n" }, { "path": "docs/_sidebar.md", "content": "- Getting started\n - [Quick Start](quickstart)\n - [Chart Props](props)\n- Charts\n - [Basic Orgchart](basic)\n - [Pan/Zoom Orgchart](panzoom)\n - [Draggable Orgchart](drag)\n - [Export Picture Orgchart](exportpic)\n - [Editable Orgchart](edit)\n" }, { "path": "docs/basic.md", "content": "## Basic OrgChart\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/drag.md", "content": "## Draggable OrgChart\n\n```html\n/*vue*/\n\n\n\n```\n\n" }, { "path": "docs/edit.md", "content": "## Editable OrgChart\n\n```html\n/*vue*/\n\n\n\n```\n```json\n```\n" }, { "path": "docs/exportpic.md", "content": "## Export Picture OrgChart\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/index.html", "content": "\n\n\n \n vue-orgchart - A vue wrapper for OrgChart.js\n \n \n \n \n \n \n \n\n\n
\n \n \n \n \n \n \n \n\n\n" }, { "path": "docs/panzoom.md", "content": "## Pan/Zoom OrgChart\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/props.md", "content": "### Vue-OrgChart props\n\n### Example\n\n``\n\n``\n\n### Props\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
NameTypeRequiredDefaultDescription
datajson or stringyesdatasource usded to build out structure of orgchart. It could be a json object or a string containing the URL to which the ajax request is sent.
panbooleannofalseUsers could pan the orgchart by mouse drag&drop if they enable this option.
zoombooleannofalseUsers could zoomin/zoomout the orgchart by mouse wheel if they enable this option.
directionstringno\"t2b\"The available values are t2b(implies \"top to bottom\", it's default value), b2t(implies \"bottom to top\"), l2r(implies \"left to right\"), r2l(implies \"right to left\").
verticalDepthintegernoUsers can make use of this option to align the nodes vertically from the specified depth.
toggleSiblingsRespbooleannofalseOnce enable this option, users can show/hide left/right sibling nodes respectively by clicking left/right arrow.
toggleCollapsebooleannotrueShow the arrow and you can click it to collapse the node
ajaxURLjsonnoIt inclueds four properites -- parent, children, siblings, families(ask for parent node and siblings nodes). As their names imply, different propety provides the URL to which ajax request for different nodes is sent.
depthpositive integerno999It indicates the level that at the very beginning orgchart is expanded to.
nodeTitlestringno\"name\"It sets one property of datasource as text content of title section of orgchart node. In fact, users can create a simple orghcart with only nodeTitle option.
parentNodeSymbolstringno\" \"Using font awesome icon to imply that the node has child nodes.
nodeContentstringnoIt sets one property of datasource as text content of content section of orgchart node.
nodeIdstringno\"id\"It sets one property of datasource as unique identifier of every orgchart node.
createNodefunctionnoIt's a callback function used to customize every orgchart node. It recieves two parament: \"$node\" stands for jquery object of single node div; \"data\" stands for datasource of single node.
exportButtonbooleannofalseIt enable the export button for orgchart.
exportButtonNamestringnothe name for export Button
exportFilenamestringno\"Orgchart\"It's filename when you export current orgchart as a picture.
chartClassstringno\"\"when you wanna instantiate multiple orgcharts on one page, you should add diffent classname to them in order to distinguish them.
draggablebooleannofalseUsers can drag & drop the nodes of orgchart if they enable this option. **Note**: this feature doesn't work on IE due to its poor support for HTML5 drag & drop API.
dropCriteriafunctionnoUsers can construct their own criteria to limit the relationships between dragged node and drop zone. Furtherly, this function accept three arguments(draggedNode, dragZone, dropZone) and just only return boolen values.
\n" }, { "path": "docs/quickstart.md", "content": "## Quick Start\n\n### Install\n```shell\nnpm install vue-orgchart -S\n```\n\n### Import in your project\n\n> `main.js`\n\n```js\nimport 'vue-orgchart/dist/style.min.css'\n```\n\n> In `*.vue`\n\n```js\n\nimport { VoBasic } from 'vue-orgchart'\nexport default {\n components: { VoEdit },\n created () {\n this.chartData = {\n name: 'JavaScript',\n children: [\n { name: 'Angular' },\n {\n name: 'React',\n children: [{ name: 'Preact' }]\n },\n {\n name: 'Vue',\n children: [{ name: 'Moon' }]\n }\n ]\n }\n }\n}\n```\n\n### CDN\n```html\n\n\n```\n" }, { "path": "docs/style.css", "content": "iframe {\n border: 2px solid #eee;\n}\n\n* {\n -webkit-font-smoothing: inherit !important\n}\n\n.vuep {\n height: 460px;\n}\n\n.cm-error {\n color: rgba(255, 83, 112, 1) !important;\n background-color: inherit !important;\n}\n\n.data-empty {\n position: absolute;\n left: 0;\n right: 0;\n top: 0;\n bottom: 0;\n display: flex;\n justify-content: center;\n align-items: center;\n background-color: rgba(255, 255, 255, .7);\n color: #888;\n font-size: 14px;\n}\n\n.demo-block .source {\n text-align: center;\n}\n\n.markdown-section tr {\n border: 1px solid #fff;\n background:#fff;\n}\n" }, { "path": "docs/zh-cn/README.md", "content": "## vue-orgchart\n\n> A vue wrapper for OrgChart.js.\n\n### 前言\n- 首先感谢dabeng的Orgchart.js -- [OrgChart.js](https://github.com/dabeng/OrgChart.js)\n- 如果你想用OrgChart.js的Vue封装，可以直接用 [我的项目](https://github.com/spiritree/vue-orgchart)\n\n### 功能\n- JSON格式导入导出树形关系图\n- 支持树形关系图导出图片\n- 可拖拉树形关系图\n- 可编辑树形关系图\n\n...\n" }, { "path": "docs/zh-cn/_navbar.md", "content": "- Translations\n - [:cn: 中文](/zh-cn/)\n - [:uk: English](/)\n" }, { "path": "docs/zh-cn/_sidebar.md", "content": "- 入门\n - [快速开始](zh-cn/quickstart)\n - [图表属性](zh-cn/props)\n- 图表\n - [基础组织树图](zh-cn/basic)\n - [缩放组织树图](zh-cn/panzoom)\n - [可拖拉组织树图](zh-cn/drag)\n - [可导出组织树形图图片](zh-cn/exportpic)\n - [可编辑组织树图](zh-cn/edit)\n" }, { "path": "docs/zh-cn/basic.md", "content": "## 基础组织树图\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/zh-cn/drag.md", "content": "## 可拖拉组织树图\n\n```html\n/*vue*/\n\n\n\n```\n\n" }, { "path": "docs/zh-cn/edit.md", "content": "## 可编辑组织树图\n\n```html\n/*vue*/\n\n\n\n```\n```json\n```\n" }, { "path": "docs/zh-cn/exportpic.md", "content": "## 可导出组织树图图片\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/zh-cn/panzoom.md", "content": "## 缩放组织树图\n\n\n```html\n/*vue*/\n\n\n\n```\n" }, { "path": "docs/zh-cn/props.md", "content": "### 图表属性\n\n### 例子\n\n``\n\n``\n\n!> 在非webpack等编译打包环境中，注意将camelCase (驼峰式命名) 的 prop 需要转换为相对应的 kebab-case (短横线分隔式命名)，如`chartName`=>`chart-name`\n\n### 属性\n\n\n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n \n
配置项类型需要默认描述
dataObject,Stringyes图表数据
panBooleannofalse鼠标拖放来平移该组织图
zoomBooleannofalse通过鼠标滚轮放大/缩小组织图
directionStringno\"t2b\"t2b(表示 \"top to bottom\", it's default value), b2t(表示 \"bottom to top\"), l2r(表示 \"left to right\"), r2l(表示 \"right to left\").
verticalDepthIntergerno垂直深度
toggleSiblingsRespBooleannofalse一旦启用此选项，用户可以显示/隐藏左/右兄弟节点分别点击左/右箭头
toggleCollapseBooleannotrue你可以设值为false来关闭节点的箭头图标
ajaxURLStringnoAjax获取JSON数据
depthPositive Intergerno999最大级别
nodeTitleStringno\"name\"树形组织图中的元素名称
parentNodeSymbolStringno\"\"父元素节点的图标class
nodeContentStringno树形组织图中二级元素名称
nodeIdStringno\"id\"节点的ID值
createNodeFunctionno一个回调函数来定制创造节点的规则
exportButtonBooleannofalse导出图片
exportButtonNamestringno导出图片按钮标题
exportFilenameStringno\"Orgchart\"导出图片名称
chartClassStringno\"\"图标的class
draggableBooleannofalse可拖拉选项
dropCriteriaFunctionno可以通过函数来限制拖拽节点和放置区之间的关系。另外，这个函数接受三个参数（draggedNode，dragZone，dropZone），只返回boolean值。
\n" }, { "path": "docs/zh-cn/quickstart.md", "content": "## 快速开始\n\n### 安装\n```shell\nnpm install vue-orgchart -S\n```\n\n### 在项目中导入\n\n> `main.js`\n\n```js\nimport 'vue-orgchart/dist/style.min.css'\n```\n\n> In `*.vue`\n\n```js\n\nimport { VoBasic } from 'vue-orgchart'\nexport default {\n components: { VoEdit },\n created () {\n this.chartData = {\n name: 'JavaScript',\n children: [\n { name: 'Angular' },\n {\n name: 'React',\n children: [{ name: 'Preact' }]\n },\n {\n name: 'Vue',\n children: [{ name: 'Moon' }]\n }\n ]\n }\n }\n}\n```\n\n### CDN\n```html\n\n\n```\n" }, { "path": "examples/Ajax.vue", "content": "\n\n\n\n\n" }, { "path": "examples/App.vue", "content": "\n\n\n\n" }, { "path": "examples/data/basic.js", "content": "export default {\n name: '基础树形关系图(Basic orgchart)',\n type: 'basic',\n data: [\n {\n name: 'Basic orgchart',\n data: {\n name: 'JavaScript',\n children: [\n { name: 'Angular' },\n {\n name: 'React',\n children: [{ name: 'Preact' }]\n },\n {\n name: 'Vue',\n children: [{ name: 'Moon' }]\n }\n ]\n }\n }\n ]\n}\n" }, { "path": "examples/data/edit.js", "content": "export default {\n name: '可编辑树形关系图(Editable orgchart)',\n type: 'edit',\n data: [\n {\n name: 'Editable orgchart',\n data: {\n name: 'JavaScript',\n children: [\n { name: 'Angular' },\n {\n name: 'React',\n children: [{ name: 'Preact' }]\n },\n {\n name: 'Vue',\n children: [{ name: 'Moon' }]\n }\n ]\n }\n }\n ]\n}\n" }, { "path": "examples/data/index.js", "content": "import basic from './basic'\nimport edit from './edit'\n\nexport default {\n basic,\n edit\n}\n" }, { "path": "examples/index.html", "content": "\n\n \n \n \n vue-orgchart\n \n \n \n
\n \n \n\n" }, { "path": "examples/main.js", "content": "import Vue from 'vue'\nimport App from './App.vue'\nimport store from './store'\nimport '../dist/style.min.css'\n\nnew Vue({\n el: '#app',\n store,\n render: h => h(App)\n})\n" }, { "path": "examples/store/index.js", "content": "import Vue from 'vue'\nimport Vuex from 'vuex'\nimport { getData } from './service'\n\nVue.use(Vuex)\n\nconst state = {\n treeData: {}\n}\n\nconst actions = {\n async getAreas ({ commit }) {\n const res = await getData()\n commit('getAreas', res)\n },\n}\n\nconst mutations = {\n 'getAreas' (state, treeData) {\n state.treeData = treeData\n },\n}\n\nexport default new Vuex.Store({\n state,\n // getters,\n actions,\n mutations\n})\n" }, { "path": "examples/store/service.js", "content": "import axios from 'axios'\n\nexport const getData = () => {\n return axios\n .get(\"https://easy-mock.com/mock/5a2f9181c430642f15c5fef8/chart/orgtree\")\n .then((res) => res.data)\n}\n" }, { "path": "package.json", "content": "{\n \"name\": \"vue-orgchart\",\n \"description\": \"A vue wrapper for OrgChart.js\",\n \"version\": \"1.1.7\",\n \"author\": {\n \"name\": \"spiritree\",\n \"email\": \"spiritreess@gmail.com\",\n \"url\": \"https://github.com/spiritree\"\n },\n \"files\": [\n \"dist\",\n \"src\",\n \"docs\"\n ],\n \"main\": \"dist/vue-orgchart.min.js\",\n \"license\": \"MIT\",\n \"homepage\": \"https://spiritree.github.io/vue-orgchart\",\n \"bugs\": {\n \"url\": \"https://github.com/spiritree/vue-orgchart/issues\"\n },\n \"scripts\": {\n \"dev\": \"webpack-dev-server --config ./build/webpack.config.js\",\n \"build\": \"webpack --progress --hide-modules --config ./build/webpack.config.build.js && cross-env NODE_ENV=production webpack --progress --hide-modules --config ./build/webpack.config.build.min.js\",\n \"rollup\": \"node build/rollup.config.js\",\n \"docs\": \"docsify serve docs --port 3002\",\n \"test\": \"karma start ./test/karma.conf.js\"\n },\n \"repository\": {\n \"type\": \"git\",\n \"url\": \"git+https://github.com/spiritree/vue-orgchart.git\"\n },\n \"keywords\": [\n \"vue\",\n \"orgchart\"\n ],\n \"dependencies\": {\n \"axios\": \"^0.17.1\",\n \"orgchart.js\": \"0.0.4\",\n \"vue\": \"^2.5.13\",\n \"vue-loader\": \"^14.1.1\",\n \"vue-style-loader\": \"^3.1.2\",\n \"vue-template-compiler\": \"^2.5.13\",\n \"vuex\": \"^3.0.1\"\n },\n \"browserslist\": [\n \"> 1%\",\n \"last 2 versions\",\n \"not ie <= 8\"\n ],\n \"devDependencies\": {\n \"autoprefixer\": \"^7.1.6\",\n \"babel-core\": \"^6.26.0\",\n \"babel-eslint\": \"^8.0.2\",\n \"babel-loader\": \"^7.1.2\",\n \"babel-plugin-external-helpers\": \"^6.22.0\",\n \"babel-plugin-transform-object-assign\": \"^6.22.0\",\n \"babel-plugin-transform-runtime\": \"^6.23.0\",\n \"babel-preset-env\": \"^1.6.0\",\n \"babel-preset-es2015\": \"^6.24.1\",\n \"babel-preset-latest\": \"^6.24.1\",\n \"babel-preset-stage-2\": \"^6.24.1\",\n \"cross-env\": \"^5.0.5\",\n \"css-loader\": \"^0.28.7\",\n \"cssnano\": \"^3.10.0\",\n \"docsify-cli\": \"^4.2.0\",\n \"es6-promise\": \"^4.1.1\",\n \"eslint\": \"^4.12.0\",\n \"eslint-config-standard\": \"^10.2.1\",\n \"eslint-friendly-formatter\": \"^3.0.0\",\n \"eslint-loader\": \"^1.9.0\",\n \"eslint-plugin-html\": \"^4.0.1\",\n \"eslint-plugin-import\": \"^2.8.0\",\n \"eslint-plugin-node\": \"^5.2.1\",\n \"eslint-plugin-promise\": \"^3.6.0\",\n \"eslint-plugin-standard\": \"^3.0.1\",\n \"extract-text-webpack-plugin\": \"^3.0.2\",\n \"file-loader\": \"^1.1.4\",\n \"html-webpack-plugin\": \"^2.30.1\",\n \"jasmine-core\": \"^2.8.0\",\n \"json-loader\": \"^0.5.7\",\n \"karma\": \"^1.7.0\",\n \"karma-babel-preprocessor\": \"^6.0.1\",\n \"karma-chrome-launcher\": \"^2.1.1\",\n \"karma-commonjs\": \"^1.0.0\",\n \"karma-jasmine\": \"^1.1.0\",\n \"karma-phantomjs-launcher\": \"^1.0.4\",\n \"karma-spec-reporter\": \"^0.0.31\",\n \"karma-webpack\": \"^2.0.3\",\n \"lodash-es\": \"^4.17.4\",\n \"opn\": \"^5.1.0\",\n \"rollup\": \"^0.52.0\",\n \"rollup-plugin-alias\": \"^1.4.0\",\n \"rollup-plugin-babel\": \"^3.0.2\",\n \"rollup-plugin-commonjs\": \"^8.2.6\",\n \"rollup-plugin-node-resolve\": \"^3.0.0\",\n \"rollup-plugin-uglify\": \"^2.0.1\",\n \"rollup-plugin-vue\": \"^2.5.2\",\n \"webpack\": \"^3.8.0\",\n \"webpack-dev-server\": \"^2.9.1\"\n }\n}\n" }, { "path": "src/components/VoBasic.vue", "content": "\n\n\n\n\n" }, { "path": "src/components/VoEdit.vue", "content": "\n\n\n" }, { "path": "src/index.js", "content": "import VoBasic from '../src/components/VoBasic.vue'\nimport VoEdit from '../src/components/VoEdit.vue'\n\nexport {\n VoBasic,\n VoEdit\n}\n\nif (typeof window !== 'undefined' && window.Vue) {\n window.Vue.component('vo-basic', VoBasic)\n window.Vue.component('vo-edit', VoEdit)\n}\n" }, { "path": "src/lib/lodash.js", "content": "import merge from 'lodash-es/merge'\n\nexport const mergeOptions = (obj, src) => {\n return merge(obj, src)\n}\n" }, { "path": "src/lib/orgchart.js", "content": "export default class OrgChart {\n constructor(options) {\n this._name = 'OrgChart';\n Promise.prototype.finally = function (callback) {\n let P = this.constructor;\n\n return this.then(\n value => P.resolve(callback()).then(() => value),\n reason => P.resolve(callback()).then(() => { throw reason; })\n );\n };\n\n let that = this,\n defaultOptions = {\n 'nodeTitle': 'name',\n 'nodeId': 'id',\n 'toggleSiblingsResp': false,\n 'depth': 999,\n 'chartClass': '',\n 'exportButton': false,\n 'exportButtonName': 'Export',\n 'exportFilename': 'OrgChart',\n 'parentNodeSymbol': '',\n 'draggable': false,\n 'direction': 't2b',\n 'pan': false,\n 'zoom': false,\n 'toggleCollapse': true\n },\n opts = Object.assign(defaultOptions, options),\n data = opts.data,\n chart = document.createElement('div'),\n chartContainer = document.querySelector(opts.chartContainer);\n\n this.options = opts;\n delete this.options.data;\n this.chart = chart;\n this.chartContainer = chartContainer;\n chart.dataset.options = JSON.stringify(opts);\n chart.setAttribute('class', 'orgchart' + (opts.chartClass !== '' ? ' ' + opts.chartClass : '') +\n (opts.direction !== 't2b' ? ' ' + opts.direction : ''));\n if (typeof data === 'object') { // local json datasource\n this.buildHierarchy(chart, opts.ajaxURL ? data : this._attachRel(data, '00'), 0);\n } else if (typeof data === 'string' && data.startsWith('#')) { // ul datasource\n this.buildHierarchy(chart, this._buildJsonDS(document.querySelector(data).children[0]), 0);\n } else { // ajax datasource\n let spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n chart.appendChild(spinner);\n this._getJSON(data)\n .then(function (resp) {\n that.buildHierarchy(chart, opts.ajaxURL ? resp : that._attachRel(resp, '00'), 0);\n })\n .catch(function (err) {\n console.error('failed to fetch datasource for orgchart', err);\n })\n .finally(function () {\n let spinner = chart.querySelector('.spinner');\n\n spinner.parentNode.removeChild(spinner);\n });\n }\n chart.addEventListener('click', this._clickChart.bind(this));\n // append the export button to the chart-container\n if (opts.exportButton && !chartContainer.querySelector('.oc-export-btn')) {\n let exportBtn = document.createElement('button'),\n downloadBtn = document.createElement('a');\n\n exportBtn.setAttribute('class', 'oc-export-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n opts.exportButtonName === 'Export' ? exportBtn.innerHTML = `Export` : exportBtn.innerHTML = `${opts.exportButtonName}`;\n exportBtn.addEventListener('click', this._clickExportButton.bind(this));\n downloadBtn.setAttribute('class', 'oc-download-btn' + (opts.chartClass !== '' ? ' ' + opts.chartClass : ''));\n downloadBtn.setAttribute('download', opts.exportFilename + '.png');\n chartContainer.appendChild(exportBtn);\n chartContainer.appendChild(downloadBtn);\n }\n\n if (opts.pan) {\n chartContainer.style.overflow = 'hidden';\n chart.addEventListener('mousedown', this._onPanStart.bind(this));\n chart.addEventListener('touchstart', this._onPanStart.bind(this));\n document.body.addEventListener('mouseup', this._onPanEnd.bind(this));\n document.body.addEventListener('touchend', this._onPanEnd.bind(this));\n }\n\n if (opts.zoom) {\n chartContainer.addEventListener('wheel', this._onWheeling.bind(this));\n chartContainer.addEventListener('touchstart', this._onTouchStart.bind(this));\n document.body.addEventListener('touchmove', this._onTouchMove.bind(this));\n document.body.addEventListener('touchend', this._onTouchEnd.bind(this));\n }\n\n chartContainer.appendChild(chart);\n }\n get name() {\n return this._name;\n }\n _closest(el, fn) {\n return el && ((fn(el) && el !== this.chart) ? el : this._closest(el.parentNode, fn));\n }\n _siblings(el, expr) {\n return Array.from(el.parentNode.children).filter((child) => {\n if (child !== el) {\n if (expr) {\n return el.matches(expr);\n }\n return true;\n }\n return false;\n });\n }\n _prevAll(el, expr) {\n let sibs = [],\n prevSib = el.previousElementSibling;\n\n while (prevSib) {\n if (!expr || prevSib.matches(expr)) {\n sibs.push(prevSib);\n }\n prevSib = prevSib.previousElementSibling;\n }\n return sibs;\n }\n _nextAll(el, expr) {\n let sibs = [];\n let nextSib = el.nextElementSibling;\n\n while (nextSib) {\n if (!expr || nextSib.matches(expr)) {\n sibs.push(nextSib);\n }\n nextSib = nextSib.nextElementSibling;\n }\n return sibs;\n }\n _isVisible(el) {\n return el.offsetParent !== null;\n }\n _addClass(elements, classNames) {\n elements.forEach((el) => {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach((className) => el.classList.add(className));\n } else {\n el.classList.add(classNames);\n }\n });\n }\n _removeClass(elements, classNames) {\n elements.forEach((el) => {\n if (classNames.indexOf(' ') > 0) {\n classNames.split(' ').forEach((className) => el.classList.remove(className));\n } else {\n el.classList.remove(classNames);\n }\n });\n }\n _css(elements, prop, val) {\n elements.forEach((el) => {\n el.style[prop] = val;\n });\n }\n _removeAttr(elements, attr) {\n elements.forEach((el) => {\n el.removeAttribute(attr);\n });\n }\n _one(el, type, listener, self) {\n let one = function (event) {\n try {\n listener.call(self, event);\n } finally {\n el.removeEventListener(type, one);\n }\n };\n\n el && el.addEventListener(type, one);\n }\n _getDescElements(ancestors, selector) {\n let results = [];\n\n ancestors.forEach((el) => results.push(...el.querySelectorAll(selector)));\n return results;\n }\n _getJSON(url) {\n return new Promise(function (resolve, reject) {\n let xhr = new XMLHttpRequest();\n\n function handler() {\n if (this.readyState !== 4) {\n return;\n }\n if (this.status === 200) {\n resolve(JSON.parse(this.response));\n } else {\n reject(new Error(this.statusText));\n }\n }\n xhr.open('GET', url);\n xhr.onreadystatechange = handler;\n xhr.responseType = 'json';\n // xhr.setRequestHeader('Accept', 'application/json');\n xhr.setRequestHeader('Content-Type', 'application/json');\n xhr.send();\n });\n }\n _buildJsonDS(li) {\n let subObj = {\n 'name': li.firstChild.textContent.trim(),\n 'relationship': (li.parentNode.parentNode.nodeName === 'LI' ? '1' : '0') +\n (li.parentNode.children.length > 1 ? 1 : 0) + (li.children.length ? 1 : 0)\n };\n\n if (li.id) {\n subObj.id = li.id;\n }\n if (li.querySelector('ul')) {\n Array.from(li.querySelector('ul').children).forEach((el) => {\n if (!subObj.children) { subObj.children = []; }\n subObj.children.push(this._buildJsonDS(el));\n });\n }\n return subObj;\n }\n _attachRel(data, flags) {\n data.relationship = flags + (data.children && data.children.length > 0 ? 1 : 0);\n if (data.children) {\n for (let item of data.children) {\n this._attachRel(item, '1' + (data.children.length > 1 ? 1 : 0));\n }\n }\n return data;\n }\n _repaint(node) {\n if (node) {\n node.style.offsetWidth = node.offsetWidth;\n }\n }\n // whether the cursor is hovering over the node\n _isInAction(node) {\n return node.querySelector(':scope > .edge').className.indexOf('fa-') > -1;\n }\n // detect the exist/display state of related node\n _getNodeState(node, relation) {\n let criteria,\n state = { 'exist': false, 'visible': false };\n\n if (relation === 'parent') {\n criteria = this._closest(node, (el) => el.classList && el.classList.contains('nodes'));\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria.parentNode.children[0])) {\n state.visible = true;\n }\n } else if (relation === 'children') {\n criteria = this._closest(node, (el) => el.nodeName === 'TR').nextElementSibling;\n if (criteria) {\n state.exist = true;\n }\n if (state.exist && this._isVisible(criteria)) {\n state.visible = true;\n }\n } else if (relation === 'siblings') {\n criteria = this._siblings(this._closest(node, (el) => el.nodeName === 'TABLE').parentNode);\n if (criteria.length) {\n state.exist = true;\n }\n if (state.exist && criteria.some((el) => this._isVisible(el))) {\n state.visible = true;\n }\n }\n\n return state;\n }\n // find the related nodes\n getRelatedNodes(node, relation) {\n if (relation === 'parent') {\n return this._closest(node, (el) => el.classList.contains('nodes'))\n .parentNode.children[0].querySelector('.node');\n } else if (relation === 'children') {\n return Array.from(this._closest(node, (el) => el.nodeName === 'TABLE').lastChild.children)\n .map((el) => el.querySelector('.node'));\n } else if (relation === 'siblings') {\n return this._siblings(this._closest(node, (el) => el.nodeName === 'TABLE').parentNode)\n .map((el) => el.querySelector('.node'));\n }\n return [];\n }\n _switchHorizontalArrow(node) {\n let opts = this.options,\n leftEdge = node.querySelector('.leftEdge'),\n rightEdge = node.querySelector('.rightEdge'),\n temp = this._closest(node, (el) => el.nodeName === 'TABLE').parentNode;\n\n if (opts.toggleSiblingsResp && (typeof opts.ajaxURL === 'undefined' ||\n this._closest(node, (el) => el.classList.contains('.nodes')).dataset.siblingsLoaded)) {\n let prevSib = temp.previousElementSibling,\n nextSib = temp.nextElementSibling;\n\n if (prevSib) {\n if (prevSib.classList.contains('hidden')) {\n leftEdge.classList.add('fa-chevron-left');\n leftEdge.classList.remove('fa-chevron-right');\n } else {\n leftEdge.classList.add('fa-chevron-right');\n leftEdge.classList.remove('fa-chevron-left');\n }\n }\n if (nextSib) {\n if (nextSib.classList.contains('hidden')) {\n rightEdge.classList.add('fa-chevron-right');\n rightEdge.classList.remove('fa-chevron-left');\n } else {\n rightEdge.classList.add('fa-chevron-left');\n rightEdge.classList.remove('fa-chevron-right');\n }\n }\n } else {\n let sibs = this._siblings(temp),\n sibsVisible = sibs.length ? !sibs.some((el) => el.classList.contains('hidden')) : false;\n\n leftEdge.classList.toggle('fa-chevron-right', sibsVisible);\n leftEdge.classList.toggle('fa-chevron-left', !sibsVisible);\n rightEdge.classList.toggle('fa-chevron-left', sibsVisible);\n rightEdge.classList.toggle('fa-chevron-right', !sibsVisible);\n }\n }\n _hoverNode(event) {\n let node = event.target,\n flag = false,\n topEdge = node.querySelector(':scope > .topEdge'),\n bottomEdge = node.querySelector(':scope > .bottomEdge'),\n leftEdge = node.querySelector(':scope > .leftEdge');\n\n if (event.type === 'mouseenter') {\n if (topEdge) {\n flag = this._getNodeState(node, 'parent').visible;\n topEdge.classList.toggle('fa-chevron-up', !flag);\n topEdge.classList.toggle('fa-chevron-down', flag);\n }\n if (bottomEdge) {\n flag = this._getNodeState(node, 'children').visible;\n bottomEdge.classList.toggle('fa-chevron-down', !flag);\n bottomEdge.classList.toggle('fa-chevron-up', flag);\n }\n if (leftEdge) {\n this._switchHorizontalArrow(node);\n }\n } else {\n Array.from(node.querySelectorAll(':scope > .edge')).forEach((el) => {\n el.classList.remove('fa-chevron-up', 'fa-chevron-down', 'fa-chevron-right', 'fa-chevron-left');\n });\n }\n }\n // define node click event handler\n _clickNode(event) {\n let clickedNode = event.currentTarget,\n focusedNode = this.chart.querySelector('.focused');\n\n if (focusedNode) {\n focusedNode.classList.remove('focused');\n }\n clickedNode.classList.add('focused');\n }\n // build the parent node of specific node\n _buildParentNode(currentRoot, nodeData, callback) {\n let that = this,\n table = document.createElement('table');\n\n nodeData.relationship = nodeData.relationship || '001';\n this._createNode(nodeData, 0)\n .then(function (nodeDiv) {\n let chart = that.chart;\n\n nodeDiv.classList.remove('slide-up');\n nodeDiv.classList.add('slide-down');\n let parentTr = document.createElement('tr'),\n superiorLine = document.createElement('tr'),\n inferiorLine = document.createElement('tr'),\n childrenTr = document.createElement('tr');\n\n parentTr.setAttribute('class', 'hidden');\n parentTr.innerHTML = ``;\n table.appendChild(parentTr);\n superiorLine.setAttribute('class', 'lines hidden');\n superiorLine.innerHTML = `
`;\n table.appendChild(superiorLine);\n inferiorLine.setAttribute('class', 'lines hidden');\n inferiorLine.innerHTML = `  `;\n table.appendChild(inferiorLine);\n childrenTr.setAttribute('class', 'nodes');\n childrenTr.innerHTML = ``;\n table.appendChild(childrenTr);\n table.querySelector('td').appendChild(nodeDiv);\n chart.insertBefore(table, chart.children[0]);\n table.children[3].children[0].appendChild(chart.lastChild);\n callback();\n })\n .catch(function (err) {\n console.error('Failed to create parent node', err);\n });\n }\n _switchVerticalArrow(arrow) {\n arrow.classList.toggle('fa-chevron-up');\n arrow.classList.toggle('fa-chevron-down');\n }\n // show the parent node of the specified node\n showParent(node) {\n // just show only one superior level\n let temp = this._prevAll(this._closest(node, (el) => el.classList.contains('nodes')));\n\n this._removeClass(temp, 'hidden');\n // just show only one line\n this._addClass(Array(temp[0].children).slice(1, -1), 'hidden');\n // show parent node with animation\n let parent = temp[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector(':scope > .topEdge'));\n }\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // show the sibling nodes of the specified node\n showSiblings(node, direction) {\n // firstly, show the sibling td tags\n let siblings = [],\n temp = this._closest(node, (el) => el.nodeName === 'TABLE').parentNode;\n\n if (direction) {\n siblings = direction === 'left' ? this._prevAll(temp) : this._nextAll(temp);\n } else {\n siblings = this._siblings(temp);\n }\n this._removeClass(siblings, 'hidden');\n // secondly, show the lines\n let upperLevel = this._prevAll(this._closest(node, (el) => el.classList.contains('nodes')));\n\n temp = Array.from(upperLevel[0].querySelectorAll(':scope > .hidden'));\n if (direction) {\n this._removeClass(temp.slice(0, siblings.length * 2), 'hidden');\n } else {\n this._removeClass(temp, 'hidden');\n }\n // thirdly, do some cleaning stuff\n if (!this._getNodeState(node, 'parent').visible) {\n this._removeClass(upperLevel, 'hidden');\n let parent = upperLevel[2].querySelector('.node');\n\n this._one(parent, 'transitionend', function (event) {\n event.target.classList.remove('slide');\n }, this);\n this._repaint(parent);\n parent.classList.add('slide');\n parent.classList.remove('slide-down');\n }\n // lastly, show the sibling nodes with animation\n siblings.forEach((sib) => {\n Array.from(sib.querySelectorAll('.node')).forEach((node) => {\n if (this._isVisible(node)) {\n node.classList.add('slide');\n node.classList.remove('slide-left', 'slide-right');\n }\n });\n });\n this._one(siblings[0].querySelector('.slide'), 'transitionend', function () {\n siblings.forEach((sib) => {\n this._removeClass(Array.from(sib.querySelectorAll('.slide')), 'slide');\n });\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n node.querySelector('.topEdge').classList.remove('fa-chevron-up');\n node.querySelector('.topEdge').classList.add('fa-chevron-down');\n }\n }, this);\n }\n // hide the sibling nodes of the specified node\n hideSiblings(node, direction) {\n let nodeContainer = this._closest(node, (el) => el.nodeName === 'TABLE').parentNode,\n siblings = this._siblings(nodeContainer);\n\n siblings.forEach((sib) => {\n if (sib.querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n });\n\n if (!direction || (direction && direction === 'left')) {\n let preSibs = this._prevAll(nodeContainer);\n\n preSibs.forEach((sib) => {\n Array.from(sib.querySelectorAll('.node')).forEach((node) => {\n if (this._isVisible(node)) {\n node.classList.add('slide', 'slide-right');\n }\n });\n });\n }\n if (!direction || (direction && direction !== 'left')) {\n let nextSibs = this._nextAll(nodeContainer);\n\n nextSibs.forEach((sib) => {\n Array.from(sib.querySelectorAll('.node')).forEach((node) => {\n if (this._isVisible(node)) {\n node.classList.add('slide', 'slide-left');\n }\n });\n });\n }\n\n let animatedNodes = [];\n\n this._siblings(nodeContainer).forEach((sib) => {\n Array.prototype.push.apply(animatedNodes, Array.from(sib.querySelectorAll('.slide')));\n });\n let lines = [];\n\n for (let node of animatedNodes) {\n let temp = this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling;\n\n lines.push(temp);\n lines.push(temp.previousElementSibling);\n }\n lines = [...new Set(lines)];\n lines.forEach(function (line) {\n line.style.visibility = 'hidden';\n });\n\n this._one(animatedNodes[0], 'transitionend', function (event) {\n lines.forEach(function (line) {\n line.removeAttribute('style');\n });\n let sibs = [];\n\n if (direction) {\n if (direction === 'left') {\n sibs = this._prevAll(nodeContainer, ':not(.hidden)');\n } else {\n sibs = this._nextAll(nodeContainer, ':not(.hidden)');\n }\n } else {\n sibs = this._siblings(nodeContainer);\n }\n let temp = Array.from(this._closest(nodeContainer, function (el) {\n return el.classList.contains('nodes');\n }).previousElementSibling.querySelectorAll(':scope > :not(.hidden)'));\n\n let someLines = temp.slice(1, direction ? sibs.length * 2 + 1 : -1);\n\n this._addClass(someLines, 'hidden');\n this._removeClass(animatedNodes, 'slide');\n sibs.forEach((sib) => {\n Array.from(sib.querySelectorAll('.node')).slice(1).forEach((node) => {\n if (this._isVisible(node)) {\n node.classList.remove('slide-left', 'slide-right');\n node.classList.add('slide-up');\n }\n });\n });\n sibs.forEach((sib) => {\n this._addClass(Array.from(sib.querySelectorAll('.lines')), 'hidden');\n this._addClass(Array.from(sib.querySelectorAll('.nodes')), 'hidden');\n this._addClass(Array.from(sib.querySelectorAll('.verticalNodes')), 'hidden');\n });\n this._addClass(sibs, 'hidden');\n\n if (this._isInAction(node)) {\n this._switchHorizontalArrow(node);\n }\n }, this);\n }\n // recursively hide the ancestor node and sibling nodes of the specified node\n hideParent(node) {\n let temp = Array.from(this._closest(node, function (el) {\n return el.classList.contains('nodes');\n }).parentNode.children).slice(0, 3);\n\n if (temp[0].querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n // hide the sibling nodes\n if (this._getNodeState(node, 'siblings').visible) {\n this.hideSiblings(node);\n }\n // hide the lines\n let lines = temp.slice(1);\n\n this._css(lines, 'visibility', 'hidden');\n // hide the superior nodes with transition\n let parent = temp[0].querySelector('.node'),\n grandfatherVisible = this._getNodeState(parent, 'parent').visible;\n\n if (parent && this._isVisible(parent)) {\n parent.classList.add('slide', 'slide-down');\n this._one(parent, 'transitionend', function () {\n parent.classList.remove('slide');\n this._removeAttr(lines, 'style');\n this._addClass(temp, 'hidden');\n }, this);\n }\n // if the current node has the parent node, hide it recursively\n if (parent && grandfatherVisible) {\n this.hideParent(parent);\n }\n }\n // exposed method\n addParent(currentRoot, data) {\n let that = this;\n\n this._buildParentNode(currentRoot, data, function () {\n if (!currentRoot.querySelector(':scope > .topEdge')) {\n let topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n currentRoot.appendChild(topEdge);\n }\n that.showParent(currentRoot);\n });\n }\n // start up loading status for requesting new nodes\n _startLoading(arrow, node) {\n let opts = this.options,\n chart = this.chart;\n\n if (typeof chart.dataset.inAjax !== 'undefined' && chart.dataset.inAjax === 'true') {\n return false;\n }\n\n arrow.classList.add('hidden');\n let spinner = document.createElement('i');\n\n spinner.setAttribute('class', 'fa fa-circle-o-notch fa-spin spinner');\n node.appendChild(spinner);\n this._addClass(Array.from(node.querySelectorAll(':scope > *:not(.spinner)')), 'hazy');\n chart.dataset.inAjax = true;\n\n let exportBtn = this.chartContainer.querySelector('.oc-export-btn' +\n (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = true;\n }\n return true;\n }\n // terminate loading status for requesting new nodes\n _endLoading(arrow, node) {\n let opts = this.options;\n\n arrow.classList.remove('hidden');\n node.querySelector(':scope > .spinner').remove();\n this._removeClass(Array.from(node.querySelectorAll(':scope > .hazy')), 'hazy');\n this.chart.dataset.inAjax = false;\n let exportBtn = this.chartContainer.querySelector('.oc-export-btn' +\n (opts.chartClass !== '' ? '.' + opts.chartClass : ''));\n\n if (exportBtn) {\n exportBtn.disabled = false;\n }\n }\n // define click event handler for the top edge\n _clickTopEdge(event) {\n event.stopPropagation();\n let that = this,\n topEdge = event.target,\n node = topEdge.parentNode,\n parentState = this._getNodeState(node, 'parent'),\n opts = this.options;\n\n if (parentState.exist) {\n let temp = this._closest(node, function (el) {\n return el.classList.contains('nodes');\n });\n let parent = temp.parentNode.firstChild.querySelector('.node');\n\n if (parent.classList.contains('slide')) { return; }\n // hide the ancestor nodes and sibling nodes of the specified node\n if (parentState.visible) {\n this.hideParent(node);\n this._one(parent, 'transitionend', function () {\n if (this._isInAction(node)) {\n this._switchVerticalArrow(topEdge);\n this._switchHorizontalArrow(node);\n }\n }, this);\n } else { // show the ancestors and siblings\n this.showParent(node);\n }\n } else {\n // load the new parent node of the specified node by ajax request\n let nodeId = topEdge.parentNode.id;\n\n // start up loading status\n if (this._startLoading(topEdge, node)) {\n // load new nodes\n this._getJSON(typeof opts.ajaxURL.parent === 'function' ?\n opts.ajaxURL.parent(node.dataset.source) : opts.ajaxURL.parent + nodeId)\n .then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (Object.keys(resp).length) {\n that.addParent(node, resp);\n }\n }\n })\n .catch(function (err) {\n console.error('Failed to get parent node data.', err);\n })\n .finally(function () {\n that._endLoading(topEdge, node);\n });\n }\n }\n }\n // recursively hide the descendant nodes of the specified node\n hideChildren(node) {\n let that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n lastItem = temp[temp.length - 1],\n lines = [];\n\n if (lastItem.querySelector('.spinner')) {\n this.chart.dataset.inAjax = false;\n }\n let descendants = Array.from(lastItem.querySelectorAll('.node')).filter((el) => that._isVisible(el)),\n isVerticalDesc = lastItem.classList.contains('verticalNodes');\n\n if (!isVerticalDesc) {\n descendants.forEach((desc) => {\n Array.prototype.push.apply(lines,\n that._prevAll(that._closest(desc, (el) => el.classList.contains('nodes')), '.lines'));\n });\n lines = [...new Set(lines)];\n this._css(lines, 'visibility', 'hidden');\n }\n this._one(descendants[0], 'transitionend', function (event) {\n this._removeClass(descendants, 'slide');\n if (isVerticalDesc) {\n that._addClass(temp, 'hidden');\n } else {\n lines.forEach((el) => {\n el.removeAttribute('style');\n el.classList.add('hidden');\n el.parentNode.lastChild.classList.add('hidden');\n });\n this._addClass(Array.from(lastItem.querySelectorAll('.verticalNodes')), 'hidden');\n }\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide slide-up');\n }\n // show the children nodes of the specified node\n showChildren(node) {\n let that = this,\n temp = this._nextAll(node.parentNode.parentNode),\n descendants = [];\n\n this._removeClass(temp, 'hidden');\n if (temp.some((el) => el.classList.contains('verticalNodes'))) {\n temp.forEach((el) => {\n Array.prototype.push.apply(descendants, Array.from(el.querySelectorAll('.node')).filter((el) => {\n return that._isVisible(el);\n }));\n });\n } else {\n Array.from(temp[2].children).forEach((el) => {\n Array.prototype.push.apply(descendants,\n Array.from(el.querySelector('tr').querySelectorAll('.node')).filter((el) => {\n return that._isVisible(el);\n }));\n });\n }\n // the two following statements are used to enforce browser to repaint\n this._repaint(descendants[0]);\n this._one(descendants[0], 'transitionend', (event) => {\n this._removeClass(descendants, 'slide');\n if (this._isInAction(node)) {\n this._switchVerticalArrow(node.querySelector('.bottomEdge'));\n }\n }, this);\n this._addClass(descendants, 'slide');\n this._removeClass(descendants, 'slide-up');\n }\n // build the child nodes of specific node\n _buildChildNode(appendTo, nodeData, callback) {\n let data = nodeData.children || nodeData.siblings;\n\n appendTo.querySelector('td').setAttribute('colSpan', data.length * 2);\n this.buildHierarchy(appendTo, { 'children': data }, 0, callback);\n }\n // exposed method\n addChildren(node, data) {\n let that = this,\n opts = this.options,\n count = 0;\n\n this.chart.dataset.inEdit = 'addChildren';\n this._buildChildNode.call(this, this._closest(node, (el) => el.nodeName === 'TABLE'), data, function () {\n if (++count === data.children.length) {\n if (!node.querySelector('.bottomEdge')) {\n let bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n node.appendChild(bottomEdge);\n }\n if (!node.querySelector('.symbol')) {\n let symbol = document.createElement('i');\n\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n node.querySelector(':scope > .title').appendChild(symbol);\n }\n that.showChildren(node);\n that.chart.dataset.inEdit = '';\n }\n });\n }\n // bind click event handler for the bottom edge\n _clickBottomEdge(event) {\n event.stopPropagation();\n let that = this,\n opts = this.options,\n bottomEdge = event.target,\n node = bottomEdge.parentNode,\n childrenState = this._getNodeState(node, 'children');\n\n if (childrenState.exist) {\n let temp = this._closest(node, function (el) {\n return el.nodeName === 'TR';\n }).parentNode.lastChild;\n\n if (Array.from(temp.querySelectorAll('.node')).some((node) => {\n return this._isVisible(node) && node.classList.contains('slide');\n })) { return; }\n // hide the descendant nodes of the specified node\n if (childrenState.visible) {\n this.hideChildren(node);\n } else { // show the descendants\n this.showChildren(node);\n }\n } else { // load the new children nodes of the specified node by ajax request\n let nodeId = bottomEdge.parentNode.id;\n\n if (this._startLoading(bottomEdge, node)) {\n this._getJSON(typeof opts.ajaxURL.children === 'function' ?\n opts.ajaxURL.children(node.dataset.source) : opts.ajaxURL.children + nodeId)\n .then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.children.length) {\n that.addChildren(node, resp);\n }\n }\n })\n .catch(function (err) {\n console.error('Failed to get children nodes data', err);\n })\n .finally(function () {\n that._endLoading(bottomEdge, node);\n });\n }\n }\n }\n // subsequent processing of build sibling nodes\n _complementLine(oneSibling, siblingCount, existingSibligCount) {\n let temp = oneSibling.parentNode.parentNode.children;\n\n temp[0].children[0].setAttribute('colspan', siblingCount * 2);\n temp[1].children[0].setAttribute('colspan', siblingCount * 2);\n for (let i = 0; i < existingSibligCount; i++) {\n let rightLine = document.createElement('td'),\n leftLine = document.createElement('td');\n\n rightLine.setAttribute('class', 'rightLine topLine');\n rightLine.innerHTML = ' ';\n temp[2].insertBefore(rightLine, temp[2].children[1]);\n leftLine.setAttribute('class', 'leftLine topLine');\n leftLine.innerHTML = ' ';\n temp[2].insertBefore(leftLine, temp[2].children[1]);\n }\n }\n // build the sibling nodes of specific node\n _buildSiblingNode(nodeChart, nodeData, callback) {\n let that = this,\n newSiblingCount = nodeData.siblings ? nodeData.siblings.length : nodeData.children.length,\n existingSibligCount = nodeChart.parentNode.nodeName === 'TD' ? this._closest(nodeChart, (el) => {\n return el.nodeName === 'TR';\n }).children.length : 1,\n siblingCount = existingSibligCount + newSiblingCount,\n insertPostion = (siblingCount > 1) ? Math.floor(siblingCount / 2 - 1) : 0;\n\n // just build the sibling nodes for the specific node\n if (nodeChart.parentNode.nodeName === 'TD') {\n let temp = this._prevAll(nodeChart.parentNode.parentNode);\n\n temp[0].remove();\n temp[1].remove();\n let childCount = 0;\n\n that._buildChildNode.call(that, that._closest(nodeChart.parentNode, (el) => el.nodeName === 'TABLE'),\n nodeData, () => {\n if (++childCount === newSiblingCount) {\n let siblingTds = Array.from(that._closest(nodeChart.parentNode, (el) => el.nodeName === 'TABLE')\n .lastChild.children);\n\n if (existingSibligCount > 1) {\n let temp = nodeChart.parentNode.parentNode;\n\n Array.from(temp.children).forEach((el) => {\n siblingTds[0].parentNode.insertBefore(el, siblingTds[0]);\n });\n temp.remove();\n that._complementLine(siblingTds[0], siblingCount, existingSibligCount);\n that._addClass(siblingTds, 'hidden');\n siblingTds.forEach((el) => {\n that._addClass(el.querySelectorAll('.node'), 'slide-left');\n });\n } else {\n let temp = nodeChart.parentNode.parentNode;\n\n siblingTds[insertPostion].parentNode.insertBefore(nodeChart.parentNode, siblingTds[insertPostion + 1]);\n temp.remove();\n that._complementLine(siblingTds[insertPostion], siblingCount, 1);\n that._addClass(siblingTds, 'hidden');\n that._addClass(that._getDescElements(siblingTds.slice(0, insertPostion + 1), '.node'), 'slide-right');\n that._addClass(that._getDescElements(siblingTds.slice(insertPostion + 1), '.node'), 'slide-left');\n }\n callback();\n }\n });\n } else { // build the sibling nodes and parent node for the specific ndoe\n let nodeCount = 0;\n\n that.buildHierarchy.call(that, that.chart, nodeData, 0, () => {\n if (++nodeCount === siblingCount) {\n let temp = nodeChart.nextElementSibling.children[3]\n .children[insertPostion],\n td = document.createElement('td');\n\n td.setAttribute('colspan', 2);\n td.appendChild(nodeChart);\n temp.parentNode.insertBefore(td, temp.nextElementSibling);\n that._complementLine(temp, siblingCount, 1);\n\n let temp2 = that._closest(nodeChart, (el) => el.classList && el.classList.contains('nodes'))\n .parentNode.children[0];\n\n temp2.classList.add('hidden');\n that._addClass(Array.from(temp2.querySelectorAll('.node')), 'slide-down');\n\n let temp3 = this._siblings(nodeChart.parentNode);\n\n that._addClass(temp3, 'hidden');\n that._addClass(that._getDescElements(temp3.slice(0, insertPostion), '.node'), 'slide-right');\n that._addClass(that._getDescElements(temp3.slice(insertPostion), '.node'), 'slide-left');\n callback();\n }\n });\n }\n }\n addSiblings(node, data) {\n let that = this;\n\n this.chart.dataset.inEdit = 'addSiblings';\n this._buildSiblingNode.call(this, this._closest(node, (el) => el.nodeName === 'TABLE'), data, () => {\n that._closest(node, (el) => el.classList && el.classList.contains('nodes'))\n .dataset.siblingsLoaded = true;\n if (!node.querySelector('.leftEdge')) {\n let rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n node.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n node.appendChild(leftEdge);\n }\n that.showSiblings(node);\n that.chart.dataset.inEdit = '';\n });\n }\n removeNodes(node) {\n let parent = this._closest(node, el => el.nodeName === 'TABLE').parentNode,\n sibs = this._siblings(parent.parentNode);\n\n if (parent.nodeName === 'TD') {\n if (this._getNodeState(node, 'siblings').exist) {\n sibs[2].querySelector('.topLine').nextElementSibling.remove();\n sibs[2].querySelector('.topLine').remove();\n sibs[0].children[0].setAttribute('colspan', sibs[2].children.length);\n sibs[1].children[0].setAttribute('colspan', sibs[2].children.length);\n parent.remove();\n } else {\n sibs[0].children[0].removeAttribute('colspan');\n sibs[0].querySelector('.bottomEdge').remove();\n this._siblings(sibs[0]).forEach(el => el.remove());\n }\n } else {\n Array.from(parent.parentNode.children).forEach(el => el.remove());\n }\n }\n // bind click event handler for the left and right edges\n _clickHorizontalEdge(event) {\n event.stopPropagation();\n let that = this,\n opts = this.options,\n hEdge = event.target,\n node = hEdge.parentNode,\n siblingsState = this._getNodeState(node, 'siblings');\n\n if (siblingsState.exist) {\n let temp = this._closest(node, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode,\n siblings = this._siblings(temp);\n\n if (siblings.some((el) => {\n let node = el.querySelector('.node');\n\n return this._isVisible(node) && node.classList.contains('slide');\n })) { return; }\n if (opts.toggleSiblingsResp) {\n let prevSib = this._closest(node, (el) => el.nodeName === 'TABLE').parentNode.previousElementSibling,\n nextSib = this._closest(node, (el) => el.nodeName === 'TABLE').parentNode.nextElementSibling;\n\n if (hEdge.classList.contains('leftEdge')) {\n if (prevSib && prevSib.classList.contains('hidden')) {\n this.showSiblings(node, 'left');\n } else {\n this.hideSiblings(node, 'left');\n }\n } else {\n if (nextSib && nextSib.classList.contains('hidden')) {\n this.showSiblings(node, 'right');\n } else {\n this.hideSiblings(node, 'right');\n }\n }\n } else {\n if (siblingsState.visible) {\n this.hideSiblings(node);\n } else {\n this.showSiblings(node);\n }\n }\n } else {\n // load the new sibling nodes of the specified node by ajax request\n let nodeId = hEdge.parentNode.id,\n url = (this._getNodeState(node, 'parent').exist) ?\n (typeof opts.ajaxURL.siblings === 'function' ?\n opts.ajaxURL.siblings(JSON.parse(node.dataset.source)) : opts.ajaxURL.siblings + nodeId) :\n (typeof opts.ajaxURL.families === 'function' ?\n opts.ajaxURL.families(JSON.parse(node.dataset.source)) : opts.ajaxURL.families + nodeId);\n\n if (this._startLoading(hEdge, node)) {\n this._getJSON(url)\n .then(function (resp) {\n if (that.chart.dataset.inAjax === 'true') {\n if (resp.siblings || resp.children) {\n that.addSiblings(node, resp);\n }\n }\n })\n .catch(function (err) {\n console.error('Failed to get sibling nodes data', err);\n })\n .finally(function () {\n that._endLoading(hEdge, node);\n });\n }\n }\n }\n // event handler for toggle buttons in Hybrid(horizontal + vertical) OrgChart\n _clickToggleButton(event) {\n let that = this,\n toggleBtn = event.target,\n descWrapper = toggleBtn.parentNode.nextElementSibling,\n descendants = Array.from(descWrapper.querySelectorAll('.node')),\n children = Array.from(descWrapper.children).map(item => item.querySelector('.node'));\n\n if (children.some((item) => item.classList.contains('slide'))) { return; }\n toggleBtn.classList.toggle('fa-plus-square');\n toggleBtn.classList.toggle('fa-minus-square');\n if (descendants[0].classList.contains('slide-up')) {\n descWrapper.classList.remove('hidden');\n this._repaint(children[0]);\n this._addClass(children, 'slide');\n this._removeClass(children, 'slide-up');\n this._one(children[0], 'transitionend', () => {\n that._removeClass(children, 'slide');\n });\n } else {\n this._addClass(descendants, 'slide slide-up');\n this._one(descendants[0], 'transitionend', () => {\n that._removeClass(descendants, 'slide');\n descendants.forEach(desc => {\n let ul = that._closest(desc, function (el) {\n return el.nodeName === 'UL';\n });\n\n ul.classList.add('hidden');\n });\n });\n\n descendants.forEach(desc => {\n let subTBs = Array.from(desc.querySelectorAll('.toggleBtn'));\n\n that._removeClass(subTBs, 'fa-minus-square');\n that._addClass(subTBs, 'fa-plus-square');\n });\n }\n }\n _dispatchClickEvent(event) {\n let classList = event.target.classList;\n\n if (classList.contains('topEdge')) {\n this._clickTopEdge(event);\n } else if (classList.contains('rightEdge') || classList.contains('leftEdge')) {\n this._clickHorizontalEdge(event);\n } else if (classList.contains('bottomEdge')) {\n this._clickBottomEdge(event);\n } else if (classList.contains('toggleBtn')) {\n this._clickToggleButton(event);\n } else {\n this._clickNode(event);\n }\n }\n _onDragStart(event) {\n let nodeDiv = event.target,\n opts = this.options,\n isFirefox = /firefox/.test(window.navigator.userAgent.toLowerCase());\n\n if (isFirefox) {\n event.dataTransfer.setData('text/html', 'hack for firefox');\n }\n // if users enable zoom or direction options\n if (this.chart.style.transform) {\n let ghostNode, nodeCover;\n\n if (!document.querySelector('.ghost-node')) {\n ghostNode = document.createElementNS('http://www.w3.org/2000/svg', 'svg');\n ghostNode.classList.add('ghost-node');\n nodeCover = document.createElementNS('http://www.w3.org/2000/svg', 'rect');\n ghostNode.appendChild(nodeCover);\n this.chart.appendChild(ghostNode);\n } else {\n ghostNode = this.chart.querySelector(':scope > .ghost-node');\n nodeCover = ghostNode.children[0];\n }\n let transValues = this.chart.style.transform.split(','),\n scale = Math.abs(window.parseFloat((opts.direction === 't2b' || opts.direction === 'b2t') ?\n transValues[0].slice(transValues[0].indexOf('(') + 1) : transValues[1]));\n\n ghostNode.setAttribute('width', nodeDiv.offsetWidth);\n ghostNode.setAttribute('height', nodeDiv.offsetHeight);\n nodeCover.setAttribute('x', 5 * scale);\n nodeCover.setAttribute('y', 5 * scale);\n nodeCover.setAttribute('width', 120 * scale);\n nodeCover.setAttribute('height', 40 * scale);\n nodeCover.setAttribute('rx', 4 * scale);\n nodeCover.setAttribute('ry', 4 * scale);\n nodeCover.setAttribute('stroke-width', 1 * scale);\n let xOffset = event.offsetX * scale,\n yOffset = event.offsetY * scale;\n\n if (opts.direction === 'l2r') {\n xOffset = event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'r2l') {\n xOffset = nodeDiv.offsetWidth - event.offsetY * scale;\n yOffset = event.offsetX * scale;\n } else if (opts.direction === 'b2t') {\n xOffset = nodeDiv.offsetWidth - event.offsetX * scale;\n yOffset = nodeDiv.offsetHeight - event.offsetY * scale;\n }\n if (isFirefox) { // hack for old version of Firefox(< 48.0)\n let ghostNodeWrapper = document.createElement('img');\n\n ghostNodeWrapper.src = 'data:image/svg+xml;utf8,' + (new XMLSerializer()).serializeToString(ghostNode);\n event.dataTransfer.setDragImage(ghostNodeWrapper, xOffset, yOffset);\n nodeCover.setAttribute('fill', 'rgb(255, 255, 255)');\n nodeCover.setAttribute('stroke', 'rgb(191, 0, 0)');\n } else {\n event.dataTransfer.setDragImage(ghostNode, xOffset, yOffset);\n }\n }\n let dragged = event.target;\n let closestDraggedNodes = this._closest(dragged, (el) => {\n return el.classList && el.classList.contains('nodes');\n });\n let dragZone = null;\n closestDraggedNodes !== null\n ? dragZone = this._closest(dragged, (el) => {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].querySelector('.node')\n : null;\n let dragHier = Array.from(this._closest(dragged, (el) => {\n return el.nodeName === 'TABLE';\n }).querySelectorAll('.node'));\n\n this.dragged = dragged;\n Array.from(this.chart.querySelectorAll('.node')).forEach(function (node) {\n if (!dragHier.includes(node)) {\n if (opts.dropCriteria) {\n if (opts.dropCriteria(dragged, dragZone, node)) {\n node.classList.add('allowedDrop');\n }\n } else {\n node.classList.add('allowedDrop');\n }\n }\n });\n }\n _onDragOver(event) {\n event.preventDefault();\n let dropZone = event.currentTarget;\n\n if (!dropZone.classList.contains('allowedDrop')) {\n event.dataTransfer.dropEffect = 'none';\n }\n }\n _onDragEnd(event) {\n Array.from(this.chart.querySelectorAll('.allowedDrop')).forEach(function (el) {\n el.classList.remove('allowedDrop');\n });\n }\n _onDrop(event) {\n let dropZone = event.currentTarget,\n chart = this.chart,\n dragged = this.dragged,\n dragZone = this._closest(dragged, function (el) {\n return el.classList && el.classList.contains('nodes');\n }).parentNode.children[0].children[0];\n\n this._removeClass(Array.from(chart.querySelectorAll('.allowedDrop')), 'allowedDrop');\n // firstly, deal with the hierarchy of drop zone\n if (!dropZone.parentNode.parentNode.nextElementSibling) { // if the drop zone is a leaf node\n let bottomEdge = document.createElement('i');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n dropZone.appendChild(bottomEdge);\n dropZone.parentNode.setAttribute('colspan', 2);\n let table = this._closest(dropZone, function (el) {\n return el.nodeName === 'TABLE';\n }),\n upperTr = document.createElement('tr'),\n lowerTr = document.createElement('tr'),\n nodeTr = document.createElement('tr');\n\n upperTr.setAttribute('class', 'lines');\n upperTr.innerHTML = `
`;\n table.appendChild(upperTr);\n lowerTr.setAttribute('class', 'lines');\n lowerTr.innerHTML = `  `;\n table.appendChild(lowerTr);\n nodeTr.setAttribute('class', 'nodes');\n table.appendChild(nodeTr);\n Array.from(dragged.querySelectorAll('.horizontalEdge')).forEach((hEdge) => {\n dragged.removeChild(hEdge);\n });\n let draggedTd = this._closest(dragged, (el) => el.nodeName === 'TABLE').parentNode;\n\n nodeTr.appendChild(draggedTd);\n } else {\n let dropColspan = window.parseInt(dropZone.parentNode.colSpan) + 2;\n\n dropZone.parentNode.setAttribute('colspan', dropColspan);\n dropZone.parentNode.parentNode.nextElementSibling.children[0].setAttribute('colspan', dropColspan);\n if (!dragged.querySelector('.horizontalEdge')) {\n let rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dragged.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dragged.appendChild(leftEdge);\n }\n let temp = dropZone.parentNode.parentNode.nextElementSibling.nextElementSibling,\n leftline = document.createElement('td'),\n rightline = document.createElement('td');\n\n leftline.setAttribute('class', 'leftLine topLine');\n leftline.innerHTML = ` `;\n temp.insertBefore(leftline, temp.children[1]);\n rightline.setAttribute('class', 'rightLine topLine');\n rightline.innerHTML = ` `;\n temp.insertBefore(rightline, temp.children[2]);\n temp.nextElementSibling.appendChild(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode);\n\n let dropSibs = this._siblings(this._closest(dragged, function (el) {\n return el.nodeName === 'TABLE';\n }).parentNode).map((el) => el.querySelector('.node'));\n\n if (dropSibs.length === 1) {\n let rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n dropSibs[0].appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n dropSibs[0].appendChild(leftEdge);\n }\n }\n // secondly, deal with the hierarchy of dragged node\n let dragColSpan = window.parseInt(dragZone.colSpan);\n\n if (dragColSpan > 2) {\n dragZone.setAttribute('colspan', dragColSpan - 2);\n dragZone.parentNode.nextElementSibling.children[0].setAttribute('colspan', dragColSpan - 2);\n let temp = dragZone.parentNode.nextElementSibling.nextElementSibling;\n\n temp.children[1].remove();\n temp.children[1].remove();\n\n let dragSibs = Array.from(dragZone.parentNode.parentNode.children[3].children).map(function (td) {\n return td.querySelector('.node');\n });\n\n if (dragSibs.length === 1) {\n dragSibs[0].querySelector('.leftEdge').remove();\n dragSibs[0].querySelector('.rightEdge').remove();\n }\n } else {\n dragZone.removeAttribute('colspan');\n dragZone.querySelector('.node').removeChild(dragZone.querySelector('.bottomEdge'));\n Array.from(dragZone.parentNode.parentNode.children).slice(1).forEach((tr) => tr.remove());\n }\n let customE = new CustomEvent('nodedropped.orgchart', { 'detail': {\n 'draggedNode': dragged,\n 'dragZone': dragZone.children[0],\n 'dropZone': dropZone\n }});\n\n chart.dispatchEvent(customE);\n }\n // create node\n _createNode(nodeData, level) {\n let that = this,\n opts = this.options;\n\n return new Promise(function (resolve, reject) {\n if (nodeData.children) {\n for (let child of nodeData.children) {\n child.parentId = nodeData.id;\n }\n }\n\n // construct the content of node\n let nodeDiv = document.createElement('div');\n\n delete nodeData.children;\n nodeDiv.dataset.source = JSON.stringify(nodeData);\n if (nodeData[opts.nodeId]) {\n nodeDiv.id = nodeData[opts.nodeId];\n }\n let inEdit = that.chart.dataset.inEdit,\n isHidden;\n\n if (inEdit) {\n isHidden = inEdit === 'addChildren' ? ' slide-up' : '';\n } else {\n isHidden = level >= opts.depth ? ' slide-up' : '';\n }\n nodeDiv.setAttribute('class', 'node ' + (nodeData.className || '') + isHidden);\n if (opts.draggable) {\n nodeDiv.setAttribute('draggable', true);\n }\n if (nodeData.parentId) {\n nodeDiv.setAttribute('data-parent', nodeData.parentId);\n }\n nodeDiv.innerHTML = `\n
${nodeData[opts.nodeTitle]}
\n ${opts.nodeContent ? `
${nodeData[opts.nodeContent]}
` : ''}\n `;\n // append 4 direction arrows or expand/collapse buttons\n let flags = nodeData.relationship || '';\n\n if (opts.verticalDepth && (level + 2) > opts.verticalDepth) {\n if ((level + 1) >= opts.verticalDepth && Number(flags.substr(2, 1))) {\n let toggleBtn = document.createElement('i'),\n icon = level + 1 >= opts.depth ? 'plus' : 'minus';\n\n toggleBtn.setAttribute('class', 'toggleBtn fa fa-' + icon + '-square');\n nodeDiv.appendChild(toggleBtn);\n }\n } else {\n if (Number(flags.substr(0, 1))) {\n let topEdge = document.createElement('i');\n\n topEdge.setAttribute('class', 'edge verticalEdge topEdge fa');\n nodeDiv.appendChild(topEdge);\n }\n if (Number(flags.substr(1, 1))) {\n let rightEdge = document.createElement('i'),\n leftEdge = document.createElement('i');\n\n rightEdge.setAttribute('class', 'edge horizontalEdge rightEdge fa');\n nodeDiv.appendChild(rightEdge);\n leftEdge.setAttribute('class', 'edge horizontalEdge leftEdge fa');\n nodeDiv.appendChild(leftEdge);\n }\n if (Number(flags.substr(2, 1))) {\n let bottomEdge = document.createElement('i'),\n symbol = document.createElement('i'),\n title = nodeDiv.querySelector(':scope > .title');\n\n bottomEdge.setAttribute('class', 'edge verticalEdge bottomEdge fa');\n nodeDiv.appendChild(bottomEdge);\n symbol.setAttribute('class', 'fa ' + opts.parentNodeSymbol + ' symbol');\n title.insertBefore(symbol, title.children[0]);\n }\n }\n if (opts.toggleCollapse) {\n nodeDiv.addEventListener('mouseenter', that._hoverNode.bind(that));\n nodeDiv.addEventListener('mouseleave', that._hoverNode.bind(that));\n nodeDiv.addEventListener('click', that._dispatchClickEvent.bind(that));\n }\n if (opts.draggable) {\n nodeDiv.addEventListener('dragstart', that._onDragStart.bind(that));\n nodeDiv.addEventListener('dragover', that._onDragOver.bind(that));\n nodeDiv.addEventListener('dragend', that._onDragEnd.bind(that));\n nodeDiv.addEventListener('drop', that._onDrop.bind(that));\n }\n // allow user to append dom modification after finishing node create of orgchart\n if (opts.createNode) {\n opts.createNode(nodeDiv, nodeData);\n }\n\n resolve(nodeDiv);\n });\n }\n buildHierarchy(appendTo, nodeData, level, callback) {\n // Construct the node\n let that = this,\n opts = this.options,\n nodeWrapper,\n childNodes = nodeData.children,\n isVerticalNode = opts.verticalDepth && (level + 1) >= opts.verticalDepth;\n\n if (Object.keys(nodeData).length > 1) { // if nodeData has nested structure\n nodeWrapper = isVerticalNode ? appendTo : document.createElement('table');\n if (!isVerticalNode) {\n appendTo.appendChild(nodeWrapper);\n }\n this._createNode(nodeData, level)\n .then(function (nodeDiv) {\n if (isVerticalNode) {\n nodeWrapper.insertBefore(nodeDiv, nodeWrapper.firstChild);\n } else {\n let tr = document.createElement('tr');\n\n tr.innerHTML = `\n \n \n `;\n tr.children[0].appendChild(nodeDiv);\n nodeWrapper.insertBefore(tr, nodeWrapper.children[0] ? nodeWrapper.children[0] : null);\n }\n if (callback) {\n callback();\n }\n })\n .catch(function (err) {\n console.error('Failed to creat node', err);\n });\n }\n // Construct the inferior nodes and connectiong lines\n if (childNodes && childNodes.length !== 0) {\n if (Object.keys(nodeData).length === 1) { // if nodeData is just an array\n nodeWrapper = appendTo;\n }\n let isHidden,\n isVerticalLayer = opts.verticalDepth && (level + 2) >= opts.verticalDepth,\n inEdit = that.chart.dataset.inEdit;\n\n if (inEdit) {\n isHidden = inEdit === 'addSiblings' ? '' : ' hidden';\n } else {\n isHidden = level + 1 >= opts.depth ? ' hidden' : '';\n }\n\n // draw the line close to parent node\n if (!isVerticalLayer) {\n let tr = document.createElement('tr');\n\n tr.setAttribute('class', 'lines' + isHidden);\n tr.innerHTML = `\n \n
\n \n `;\n nodeWrapper.appendChild(tr);\n }\n // draw the lines close to children nodes\n let lineLayer = document.createElement('tr');\n\n lineLayer.setAttribute('class', 'lines' + isHidden);\n lineLayer.innerHTML = `\n  \n ${childNodes.slice(1).map(() => `\n  \n  \n `).join('')}\n  \n `;\n let nodeLayer;\n\n if (isVerticalLayer) {\n nodeLayer = document.createElement('ul');\n if (isHidden) {\n nodeLayer.classList.add(isHidden.trim());\n }\n if (level + 2 === opts.verticalDepth) {\n let tr = document.createElement('tr');\n\n tr.setAttribute('class', 'verticalNodes' + isHidden);\n tr.innerHTML = ``;\n tr.firstChild.appendChild(nodeLayer);\n nodeWrapper.appendChild(tr);\n } else {\n nodeWrapper.appendChild(nodeLayer);\n }\n } else {\n nodeLayer = document.createElement('tr');\n nodeLayer.setAttribute('class', 'nodes' + isHidden);\n nodeWrapper.appendChild(lineLayer);\n nodeWrapper.appendChild(nodeLayer);\n }\n // recurse through children nodes\n childNodes.forEach((child) => {\n let nodeCell;\n\n if (isVerticalLayer) {\n nodeCell = document.createElement('li');\n } else {\n nodeCell = document.createElement('td');\n nodeCell.setAttribute('colspan', 2);\n }\n nodeLayer.appendChild(nodeCell);\n that.buildHierarchy(nodeCell, child, level + 1, callback);\n });\n }\n }\n _clickChart(event) {\n let closestNode = this._closest(event.target, function (el) {\n return el.classList && el.classList.contains('node');\n });\n\n if (!closestNode && this.chart.querySelector('.node.focused')) {\n this.chart.querySelector('.node.focused').classList.remove('focused');\n }\n }\n _clickExportButton() {\n let opts = this.options,\n chartContainer = this.chartContainer,\n mask = chartContainer.querySelector(':scope > .mask'),\n sourceChart = chartContainer.querySelector('.orgchart:not(.hidden)'),\n flag = opts.direction === 'l2r' || opts.direction === 'r2l';\n\n if (!mask) {\n mask = document.createElement('div');\n mask.setAttribute('class', 'mask');\n mask.innerHTML = ``;\n chartContainer.appendChild(mask);\n } else {\n mask.classList.remove('hidden');\n }\n chartContainer.classList.add('canvasContainer');\n window.html2canvas(sourceChart, {\n 'width': flag ? sourceChart.clientHeight : sourceChart.clientWidth,\n 'height': flag ? sourceChart.clientWidth : sourceChart.clientHeight,\n 'onclone': function (cloneDoc) {\n let canvasContainer = cloneDoc.querySelector('.canvasContainer');\n\n canvasContainer.style.overflow = 'visible';\n canvasContainer.querySelector('.orgchart:not(.hidden)').transform = '';\n }\n })\n .then((canvas) => {\n let downloadBtn = chartContainer.querySelector('.oc-download-btn');\n\n chartContainer.querySelector('.mask').classList.add('hidden');\n downloadBtn.setAttribute('href', canvas.toDataURL());\n downloadBtn.click();\n })\n .catch((err) => {\n console.error('Failed to export the curent orgchart!', err);\n })\n .finally(() => {\n chartContainer.classList.remove('canvasContainer');\n });\n }\n _loopChart(chart) {\n let subObj = { 'id': chart.querySelector('.node').id };\n\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach((el) => {\n if (!subObj.children) { subObj.children = []; }\n subObj.children.push(this._loopChart(el.firstChild));\n });\n }\n return subObj;\n }\n _loopChartDataset(chart) {\n let _subObj = JSON.parse(chart.querySelector('.node').dataset.source);\n if (chart.children[3]) {\n Array.from(chart.children[3].children).forEach((el) => {\n if (!_subObj.children) { _subObj.children = []; }\n _subObj.children.push(this._loopChartDataset(el.firstChild));\n });\n }\n return _subObj;\n }\n getChartJSON() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChartDataset(this.chart.querySelector('table'));\n }\n getHierarchy() {\n if (!this.chart.querySelector('.node').id) {\n return 'Error: Nodes of orghcart to be exported must have id attribute!';\n }\n return this._loopChart(this.chart.querySelector('table'));\n }\n _onPanStart(event) {\n let chart = event.currentTarget;\n\n if (this._closest(event.target, (el) => el.classList && el.classList.contains('node')) ||\n (event.touches && event.touches.length > 1)) {\n chart.dataset.panning = false;\n return;\n }\n chart.style.cursor = 'move';\n chart.dataset.panning = true;\n\n let lastX = 0,\n lastY = 0,\n lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf !== 'none') {\n let temp = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n lastX = Number.parseInt(temp[4], 10);\n lastY = Number.parseInt(temp[5], 10);\n } else {\n lastX = Number.parseInt(temp[12], 10);\n lastY = Number.parseInt(temp[13], 10);\n }\n }\n let startX = 0,\n startY = 0;\n\n if (!event.targetTouches) { // pan on desktop\n startX = event.pageX - lastX;\n startY = event.pageY - lastY;\n } else if (event.targetTouches.length === 1) { // pan on mobile device\n startX = event.targetTouches[0].pageX - lastX;\n startY = event.targetTouches[0].pageY - lastY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n chart.dataset.panStart = JSON.stringify({ 'startX': startX, 'startY': startY });\n chart.addEventListener('mousemove', this._onPanning.bind(this));\n chart.addEventListener('touchmove', this._onPanning.bind(this));\n }\n _onPanning(event) {\n let chart = event.currentTarget;\n\n if (chart.dataset.panning === 'false') {\n return;\n }\n let newX = 0,\n newY = 0,\n panStart = JSON.parse(chart.dataset.panStart),\n startX = panStart.startX,\n startY = panStart.startY;\n\n if (!event.targetTouches) { // pand on desktop\n newX = event.pageX - startX;\n newY = event.pageY - startY;\n } else if (event.targetTouches.length === 1) { // pan on mobile device\n newX = event.targetTouches[0].pageX - startX;\n newY = event.targetTouches[0].pageY - startY;\n } else if (event.targetTouches.length > 1) {\n return;\n }\n let lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n if (!lastTf.includes('3d')) {\n chart.style.transform = 'matrix(1, 0, 0, 1, ' + newX + ', ' + newY + ')';\n } else {\n chart.style.transform = 'matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, 0, ' + newX + ', ' + newY + ', 0, 1)';\n }\n } else {\n let matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[4] = newX;\n matrix[5] = newY + ')';\n } else {\n matrix[12] = newX;\n matrix[13] = newY;\n }\n chart.style.transform = matrix.join(',');\n }\n }\n _onPanEnd(event) {\n let chart = this.chart;\n\n if (chart.dataset.panning === 'true') {\n chart.dataset.panning = false;\n chart.style.cursor = 'default';\n document.body.removeEventListener('mousemove', this._onPanning);\n document.body.removeEventListener('touchmove', this._onPanning);\n }\n }\n _setChartScale(chart, newScale) {\n let lastTf = window.getComputedStyle(chart).transform;\n\n if (lastTf === 'none') {\n chart.style.transform = 'scale(' + newScale + ',' + newScale + ')';\n } else {\n let matrix = lastTf.split(',');\n\n if (!lastTf.includes('3d')) {\n matrix[0] = 'matrix(' + newScale;\n matrix[3] = newScale;\n chart.style.transform = lastTf + ' scale(' + newScale + ',' + newScale + ')';\n } else {\n chart.style.transform = lastTf + ' scale3d(' + newScale + ',' + newScale + ', 1)';\n }\n }\n chart.dataset.scale = newScale;\n }\n _onWheeling(event) {\n event.preventDefault();\n\n let newScale = event.deltaY > 0 ? 0.8 : 1.2;\n\n this._setChartScale(this.chart, newScale);\n }\n _getPinchDist(event) {\n return Math.sqrt((event.touches[0].clientX - event.touches[1].clientX) *\n (event.touches[0].clientX - event.touches[1].clientX) +\n (event.touches[0].clientY - event.touches[1].clientY) *\n (event.touches[0].clientY - event.touches[1].clientY));\n }\n _onTouchStart(event) {\n let chart = this.chart;\n\n if (event.touches && event.touches.length === 2) {\n let dist = this._getPinchDist(event);\n\n chart.dataset.pinching = true;\n chart.dataset.pinchDistStart = dist;\n }\n }\n _onTouchMove(event) {\n let chart = this.chart;\n\n if (chart.dataset.pinching) {\n let dist = this._getPinchDist(event);\n\n chart.dataset.pinchDistEnd = dist;\n }\n }\n _onTouchEnd(event) {\n let chart = this.chart;\n\n if (chart.dataset.pinching) {\n chart.dataset.pinching = false;\n let diff = chart.dataset.pinchDistEnd - chart.dataset.pinchDistStart;\n\n if (diff > 0) {\n this._setChartScale(chart, 1);\n } else if (diff < 0) {\n this._setChartScale(chart, -1);\n }\n }\n }\n}\n" }, { "path": "src/lib/utils.js", "content": "export const closest = (el, fn) => {\n return el && ((fn(el) && el !== document.querySelector('.orgchart')) ? el : closest(el.parentNode, fn))\n}\n\nexport const addClass = (elements, classNames) => {\n elements.forEach((el) => {\n if (classNames.includes(' ')) {\n classNames.split(' ').forEach((className) => el.classList.add(className))\n } else {\n el.classList.add(classNames)\n }\n })\n}\n\nexport const removeClass = (elements, classNames) => {\n elements.forEach((el) => {\n if (classNames.includes(' ')) {\n classNames.split(' ').forEach((className) => el.classList.remove(className))\n } else {\n el.classList.remove(classNames)\n }\n })\n}\n\nexport const bindEventHandler = (selector, type, fn, parentSelector) => {\n if (parentSelector) {\n document.querySelector(parentSelector).addEventListener(type, function (event) {\n if ((event.target.classList && event.target.classList.contains(selector.slice(1))) ||\n closest(event.target, el => el.classList && el.classList.contains(selector.slice(1)))) {\n fn(event)\n }\n })\n } else {\n document.querySelectorAll(selector).forEach(element => {\n element.addEventListener(type, fn)\n })\n }\n}\n\nexport const clickNode = (event) => {\n let sNode = closest(event.target, el => el.classList && el.classList.contains('node'))\n let sNodeInput = document.getElementById('selected-node')\n\n sNodeInput.value = sNode.querySelector('.title').textContent\n sNodeInput.dataset.node = sNode.id\n}\n\nexport const clickChart = (event) => {\n if (!closest(event.target, el => el.classList && el.classList.contains('node'))) {\n document.getElementById('selected-node').textContent = ''\n }\n}\n\nexport const addInputs = () => {\n let newNode = document.createElement('li')\n newNode.innerHTML = ``\n document.getElementById('new-nodelist').appendChild(newNode)\n}\n\nexport const removeInputs = () => {\n let inputs = Array.from(document.getElementById('new-nodelist').children)\n if (inputs.length > 1) {\n inputs.pop().remove()\n }\n}\n\nexport const addNodes = (orgchart) => {\n let chartContainer = document.getElementById('chart-container')\n let nodeVals = []\n\n Array.from(document.getElementById('new-nodelist').querySelectorAll('.new-node'))\n .forEach(item => {\n let validVal = item.value.trim()\n\n if (validVal) {\n nodeVals.push(validVal)\n }\n })\n let selectedNode = document.getElementById(document.getElementById('selected-node').dataset.node)\n\n if (!nodeVals.length) {\n alert('Please input value for new node')\n return\n }\n let nodeType = document.querySelector('input[name=\"node-type\"]:checked')\n\n if (!nodeType) {\n alert('Please select a node type')\n return\n }\n if (nodeType.value !== 'parent' && !document.querySelector('.orgchart')) {\n alert('Please creat the root node firstly when you want to build up the orgchart from the scratch')\n return\n }\n if (nodeType.value !== 'parent' && !selectedNode) {\n alert('Please select one node in orgchart')\n return\n }\n /* eslint-disable */\n if (nodeType.value === 'parent') {\n if (!chartContainer.children.length) {// if the original chart has been deleted\n orgchart = new OrgChart({\n 'chartContainer': '#chart-container',\n 'data': { 'name': nodeVals[0] },\n 'parentNodeSymbol': 'fa-th-large',\n 'createNode': function (node, data) {\n node.id = getId()\n }\n })\n orgchart.chart.classList.add('view-state')\n } else {\n orgchart.addParent(chartContainer.querySelector('.node'), { 'name': nodeVals[0], 'Id': getId() })\n }\n } else if (nodeType.value === 'siblings') {\n orgchart.addSiblings(selectedNode, {\n 'siblings': nodeVals.map(item => {\n return { 'name': item, 'relationship': '110', 'Id': getId() }\n })\n })\n } else {\n let hasChild = selectedNode.parentNode.colSpan > 1\n\n if (!hasChild) {\n let rel = nodeVals.length > 1 ? '110' : '100'\n\n orgchart.addChildren(selectedNode, {\n 'children': nodeVals.map(item => {\n return { 'name': item, 'relationship': rel, 'Id': getId() }\n })\n })\n } else {\n orgchart.addSiblings(closest(selectedNode, el => el.nodeName === 'TABLE').querySelector('.nodes').querySelector('.node'),\n { 'siblings': nodeVals.map(function (item) { return { 'name': item, 'relationship': '110', 'Id': getId() } })\n })\n }\n }\n}\n\nexport const deleteNodes = (orgchart) => {\n let sNodeInput = document.getElementById('selected-node')\n let sNode = document.getElementById(sNodeInput.dataset.node)\n\n if (!sNode) {\n alert('Please select one node in orgchart')\n return\n } else if (sNode === document.querySelector('.orgchart').querySelector('.node')) {\n if (!window.confirm('Are you sure you want to delete the whole chart?')) {\n return\n }\n }\n orgchart.removeNodes(sNode)\n sNodeInput.value = ''\n sNodeInput.dataset.node = ''\n}\n\nexport const resetPanel = () => {\n let fNode = document.querySelector('.orgchart').querySelector('.focused')\n\n if (fNode) {\n fNode.classList.remove('focused')\n }\n document.getElementById('selected-node').value = ''\n document.getElementById('new-nodelist').querySelector('input').value = ''\n Array.from(document.getElementById('new-nodelist').children).slice(1).forEach(item => item.remove())\n document.getElementById('node-type-panel').querySelectorAll('input').forEach(item => {\n item.checked = false\n })\n}\n\nexport const getId = () => {\n return (new Date().getTime()) * 1000 + Math.floor(Math.random() * 1001)\n}\n\nexport const exportJSON = (orgchart) => {\n let datasourceJSON = {}\n let ChartJSON = orgchart.getChartJSON()\n datasourceJSON = JSON.stringify(ChartJSON, null, 2)\n if(document.getElementsByTagName('code')[1]) {\n let code = document.getElementsByTagName('code')[1]\n code.innerHTML = datasourceJSON\n }\n return datasourceJSON\n}\n" }, { "path": "test/index.js", "content": "/* eslint-disable*/\nimport Vue from 'vue'\nimport chartData from '../examples/data/index.js'\n\nwindow.Promise = require('es6-promise').Promise\nimport {\n VoBasic,\n VoEdit\n} from '../dist/vue-orgchart.esm.js'\n\nconst comps = {\n basic: VoBasic,\n edit: VoEdit,\n}\n\nlet box\nlet vm = {}\ncreateBox()\n\nafterEach(() => {\n if (vm.$el) document.body.removeChild(vm.$el)\n createBox()\n})\n\nObject.keys(comps).forEach(type => {\n chartData[type].data.forEach(item => {\n describe(type + ': ', () => {\n testMount(type, comps[type], item)\n })\n })\n})\n\nfunction testMount (type, comp, item) {\n it(item.name, () => {\n const Ctor = Vue.extend(comp)\n const vm = new Ctor({\n propsData: { data: item.data }\n }).$mount(box)\n expect(vm.$el.classList.contains('vo-' + type)).toEqual(true)\n })\n}\n\nfunction createBox () {\n box = document.createElement('div')\n box.id = 'app'\n document.body.appendChild(box)\n}\n" }, { "path": "test/karma.conf.js", "content": "module.exports = function (config) {\n config.set({\n frameworks: ['jasmine'],\n files: [\n './index.js'\n ],\n browsers: ['PhantomJS'],\n reporters: ['spec'],\n preprocessors: {\n './index.js': ['webpack']\n },\n webpack: {\n devtool: 'inline-source-map',\n module: {\n loaders: [\n {\n test: /\\.(js)$/,\n loader: 'babel-loader'\n }\n ]\n },\n resolve: {\n extensions: ['.js', '.vue']\n }\n },\n singleRun: true\n })\n}\n" }, { "path": "test/load/webpack/basic/App.vue", "content": "\n\n\n" }, { "path": "test/load/webpack/basic/index.js", "content": "\nimport Vue from 'vue'\nimport App from './App.vue'\n\nVue.config.productionTip = false\n\n/* eslint-disable no-new */\nnew Vue({\n el: '#app',\n render: h => h(App)\n})\n" }, { "path": "test/load/webpack/basic/webpack.config.js", "content": "const webpack = require('webpack')\nconst path = require('path')\nconst HtmlWebpackPlugin = require('html-webpack-plugin')\n\nfunction resolve (dir) {\n return path.join(__dirname, '..', dir)\n}\n\nmodule.exports = {\n entry: {\n app: './index.js'\n },\n output: {\n path: path.resolve(__dirname, '../dist'),\n filename: 'index.js',\n publicPath: '/'\n },\n resolve: {\n alias: {\n 'vue$': 'vue/dist/vue.esm.js'\n },\n extensions: ['*', '.js', '.vue', '.json']\n },\n devServer: {\n port: '8180',\n hot: true,\n stats: 'errors-only'\n },\n performance: {\n hints: false\n },\n module: {\n rules: [\n {\n test: /\\.vue$/,\n loader: 'vue-loader'\n },\n {\n test: /\\.js$/,\n loader: 'babel-loader'\n },\n {\n test: /\\.css$/,\n use: ['style-loader', 'css-loader']\n }\n ]\n },\n plugins: [\n new webpack.DefinePlugin({\n 'process.env': {\n NODE_ENV: '\"development\"'\n }\n }),\n new webpack.HotModuleReplacementPlugin(),\n new HtmlWebpackPlugin({\n filename: 'index.html',\n template: '../index.html',\n inject: true\n })\n ]\n}\n" }, { "path": "test/load/webpack/edit/App.vue", "content": "\n\n\n" }, { "path": "test/load/webpack/edit/index.js", "content": "\nimport Vue from 'vue'\nimport App from './App.vue'\n\nVue.config.productionTip = false\n\n/* eslint-disable no-new */\nnew Vue({\n el: '#app',\n render: h => h(App)\n})\n" }, { "path": "test/load/webpack/edit/webpack.config.js", "content": "const webpack = require('webpack')\nconst path = require('path')\nconst HtmlWebpackPlugin = require('html-webpack-plugin')\n\nfunction resolve (dir) {\n return path.join(__dirname, '..', dir)\n}\n\nmodule.exports = {\n entry: {\n app: './index.js'\n },\n output: {\n path: path.resolve(__dirname, '../dist'),\n filename: 'index.js',\n publicPath: '/'\n },\n resolve: {\n alias: {\n 'vue$': 'vue/dist/vue.esm.js'\n },\n extensions: ['*', '.js', '.vue', '.json']\n },\n devServer: {\n port: '8180',\n hot: true,\n stats: 'errors-only'\n },\n performance: {\n hints: false\n },\n module: {\n rules: [\n {\n test: /\\.vue$/,\n loader: 'vue-loader'\n },\n {\n test: /\\.js$/,\n loader: 'babel-loader'\n },\n {\n test: /\\.css$/,\n use: ['style-loader', 'css-loader']\n }\n ]\n },\n plugins: [\n new webpack.DefinePlugin({\n 'process.env': {\n NODE_ENV: '\"development\"'\n }\n }),\n new webpack.HotModuleReplacementPlugin(),\n new HtmlWebpackPlugin({\n filename: 'index.html',\n template: '../index.html',\n inject: true\n })\n ]\n}\n" }, { "path": "test/load/webpack/index.html", "content": "\n\n \n \n \n vue-orgchart\n \n \n
\n \n\n" } ]