{"_id":"@a.perrot/vue3-treeselect","_rev":"1-5c4b912cafd71454b50af698612140a2","name":"@a.perrot/vue3-treeselect","dist-tags":{"latest":"0.1.1"},"versions":{"0.1.1":{"name":"@a.perrot/vue3-treeselect","version":"0.1.1","description":"Tree select hierarchical component for vue 3 (next)","main":"dist/vue3-treeselect.common.js","unpkg":"dist/vue3-treeselect.umd.js","author":{"name":"megafetis"},"scripts":{"build":"vue-cli-service build --target lib --name vue3-treeselect ./src/index.js && webpack --env.production","test":"echo \"Error: no test specified\" && exit 1"},"devDependencies":{"@babel/core":"^7.12.10","@babel/preset-env":"^7.12.11","@babel/preset-typescript":"^7.12.7","@types/ts-nameof":"4.2.1","@vue/babel-plugin-jsx":"1.0.1","@vue/babel-preset-jsx":"1.2.4","@vue/cli-plugin-babel":"~4.5.0","@vue/cli-plugin-typescript":"~4.5.0","@vue/cli-service":"~4.5.0","@vue/compiler-sfc":"3.0.5","babel-loader":"^8.1.0","clean-webpack-plugin":"^3.0.0","copy-webpack-plugin":"^6.0.3","css-loader":"^4.2.0","dotenv":"^8.2.0","easings-css":"2.0.3","file-loader":"^6.0.0","fuzzysearch":"1.0.3","html-webpack-plugin":"^4.3.0","is-promise":"4.0.0","less":"^3.13.0","less-loader":"^7.1.0","material-colors":"1.2.6","mini-css-extract-plugin":"^0.9.0","resolve-url-loader":"^3.1.2","sass":"^1.26.10","sass-loader":"^9.0.3","style-loader":"^1.2.1","ts-loader":"^8.0.12","ts-nameof":"5.0.0","typescript":"^4.1.3","url-loader":"^4.1.0","vue":"^3.0.5","vue-loader":"16.1.2","vue-style-loader":"4.1.2","watch-size":"2.0.0","webpack":"^4.46.0","webpack-cli":"^3.3.12","webpack-dev-server":"^3.11.0","webpackbar":"^4.0.0"},"peerDependencies":{"vue":"^3.0.0"},"bugs":{"url":"https://github.com/AlexPerrot/vue3-treeselect/issues"},"browserslist":["Android >= 4.0","iOS >= 8"],"homepage":"https://github.com/AlexPerrot/vue3-treeselect","keywords":["vue","vue3","next","vue next","tree","treeselect","select","tree select","hierarchy","hierarchical"],"style":"dist/vue3-treeselect.css","sideEffects":["*.css","*.less"],"license":"MIT","repository":{"type":"git","url":"git+https://github.com/AlexPerrot/vue3-treeselect.git"},"gitHead":"5d0f4bb0d96486f7b077f4c9b40fac8db050d6a8","_id":"@a.perrot/vue3-treeselect@0.1.1","_nodeVersion":"16.13.0","_npmVersion":"8.1.0","dist":{"integrity":"sha512-bRIBXAD4xv7QhAMqIm+w3/bBcjafrWWoN8GG309Lc8BW9nIcWysHJT2gkBmDBLfSzru8wQxS63Xy9f6lsxVu/g==","shasum":"2f55ae75e3035ca8deea9101f9d3a864cc1bd124","tarball":"https://registry.npmjs.org/@a.perrot/vue3-treeselect/-/vue3-treeselect-0.1.1.tgz","fileCount":20,"unpackedSize":693225,"npm-signature":"-----BEGIN PGP SIGNATURE-----\r\nVersion: OpenPGP.js v4.10.10\r\nComment: https://openpgpjs.org\r\n\r\nwsFzBAEBCAAGBQJiJi+dACEJED1NWxICdlZqFiEECWMYAoorWMhJKdjhPU1b\r\nEgJ2VmrgMBAAiSQAgJNBePQcStggoJ/yfnmmHoDdsPDUoT7ZqjllXI40a6AN\r\nge6twXDVjjFDbBUvkvu/Zux4+wU3/Ylm/0QLtEjnw06eJ3Q0jxgiegjUw8fD\r\nKA/KF3yV/mRMu8lnqP4mFF66nAg+/kdyuYfC6X8tCQJrd6IJ11U3gWTebiKJ\r\n8V78E8vHn4QLbCUoIRcG5kiKeJkSQ9UP2B/JSXV49hlj9fqRXSLN5eQghEbB\r\nbgf05qoO1+IUiwi3PufV8s7bF80sedtwDwAqspxCQHoln/DgsyrOEBrKgviS\r\nSiPJngtiaWlqojjOzwv447FrA7PTEV7WDFWdj4W6M8Dxv6FmWXcqixe+z5XH\r\n/s8GGPu58OqrZvAwzy3RyUyQnPEibAR8xLxFIp/ugrvkjDnCfm42YVUsA7ee\r\nhynhcLqBzhl5BNxioR4LA9QlPNIedzUy62k2l7H2axwFxqvfwlA1CWTroUMW\r\nVPtj6Jouoog8alUaiUOGBdxqvAnTwGkbkTITSJaRNB/yLFovSjurk1qO03xo\r\n4NI6Upqs/LPEm1UWODKMD5sOUj95t5/XE5fb361c3rZ3LMVircH1DaJfEpzZ\r\nWzSZWsCYzSLUtFYTlWiXExLN9EGZO9La9771mowTirUeHYTcdfUHIaUgPBD+\r\ne/JomzJ2QX6nT9947PmKDioP7UQZMWMxbu4=\r\n=Okjy\r\n-----END PGP SIGNATURE-----\r\n","signatures":[{"keyid":"SHA256:jl3bwswu80PjjokCgh0o2w5c2U4LhQAE57gj9cz1kzA","sig":"MEQCIETZsbEpv7z6ehsRbG8dKotzz04BvkQ4fAX5tXb4gbjHAiB11jS4EXgaIkUpiIEkLhOu65rp8dg+S9npdQX7NDbgWw=="}]},"_npmUser":{"name":"a.perrot","email":"a.perrot@catie.fr"},"directories":{},"maintainers":[{"name":"a.perrot","email":"a.perrot@catie.fr"}],"_npmOperationalInternal":{"host":"s3://npm-registry-packages","tmp":"tmp/vue3-treeselect_0.1.1_1646669725345_0.05279468954540678"},"_hasShrinkwrap":false}},"time":{"created":"2022-03-07T16:15:25.251Z","0.1.1":"2022-03-07T16:15:25.539Z","modified":"2022-04-04T10:52:42.106Z"},"maintainers":[{"name":"a.perrot","email":"a.perrot@catie.fr"}],"description":"Tree select hierarchical component for vue 3 (next)","homepage":"https://github.com/AlexPerrot/vue3-treeselect","keywords":["vue","vue3","next","vue next","tree","treeselect","select","tree select","hierarchy","hierarchical"],"repository":{"type":"git","url":"git+https://github.com/AlexPerrot/vue3-treeselect.git"},"author":{"name":"megafetis"},"bugs":{"url":"https://github.com/AlexPerrot/vue3-treeselect/issues"},"license":"MIT","readme":"# vue3-treeselect\n[![npm](https://badgen.now.sh/npm/v/vue3-treeselect)](https://www.npmjs.com/package/vue3-treeselect)  [![Coverage](https://badgen.net/codecov/c/github/megafetis/vue3-treeselect)](https://codecov.io/gh/megafetis/vue3-treeselect?branch=main)\n![npm monthly downloads](https://badgen.now.sh/npm/dm/megafetis/vue3-treeselect)\n [![Known vulnerabilities](https://snyk.io/test/npm/megafetis/vue3-treeselect/badge.svg)](https://snyk.io/test/npm/megafetis/vue3-treeselect) ![License](https://badgen.net/github/license/megafetis/vue3-treeselect)\n\n> A multi-select component with nested options support for Vue 3. Thank to [riophae](https://github.com/riophae/vue-treeselect) and his sources and library for vue 2 taken as basis.\n\nBreaking changes from his library:\n\n* property `value` => `modelValue`\n* event `input` => `updated:modelValue`\n* Now use slots with `<template>`\n\n![Vue-Treeselect Screenshot](https://raw.githubusercontent.com/riophae/vue-treeselect/master/screenshot.png)\n\n### Features\n\n- Single & multiple select with nested options support\n- Fuzzy matching\n- Async searching\n- Delayed loading (load data of deep level options only when needed)\n- Keyboard support (navigate using <kbd>Arrow Up</kbd> & <kbd>Arrow Down</kbd> keys, select option using <kbd>Enter</kbd> key, etc.)\n- Rich options & highly customizable\n- Supports a wide range of browsers (see [below](#browser-compatibility))\n- RTL support\n\n*Requires Vue 3.0+*\n\n### Getting Started\n\nIt's recommended to install vue3-treeselect via npm, and build your app using a bundler like [webpack](https://webpack.js.org/).\n\n```bash\nnpm install --save vue3-treeselect\n```\n\nThis example shows how to integrate vue3-treeselect with your [Vue SFCs](https://vuejs.org/v2/guide/single-file-components.html).\n\n```vue\n<!-- Vue SFC -->\n<template>\n  <div id=\"app\">\n    <treeselect v-model=\"value\" :multiple=\"true\" :options=\"options\" />\n  </div>\n</template>\n\n<script>\n  // import the component\n  import Treeselect from 'vue3-treeselect'\n  // import the styles\n  import 'vue3-treeselect/dist/vue3-treeselect.css'\n\n  export default {\n    // register the component\n    components: { Treeselect },\n    data() {\n      return {\n        // define the default value\n        value: null,\n        // define options\n        options: [ {\n          id: 'a',\n          label: 'a',\n          children: [ {\n            id: 'aa',\n            label: 'aa',\n          }, {\n            id: 'ab',\n            label: 'ab',\n          } ],\n        }, {\n          id: 'b',\n          label: 'b',\n        }, {\n          id: 'c',\n          label: 'c',\n        } ],\n      }\n    },\n  }\n</script>\n```\n\nIf you just don't want to use webpack or any other bundlers, you can simply include the standalone UMD build in your page. In this way, make sure Vue as a dependency is included before vue3-treeselect.\n\n```html\n<html>\n  <head>\n    <!-- include Vue 2.x -->\n    <script src=\"https://cdn.jsdelivr.net/npm/vue@next\"></script>\n    <!-- include vue-treeselect & its styles. you can change the version tag to better suit your needs. -->\n    <script src=\"https://cdn.jsdelivr.net/npm/vue3-treeselect@^0.1.0/dist/vue3-treeselect.umd.min.js\"></script>\n    <link rel=\"stylesheet\" href=\"https://cdn.jsdelivr.net/npm/vue3-treeselect@^0.1.0/dist/vue3-treeselect.min.css\">\n  </head>\n  <body>\n    <div id=\"app\">\n      <treeselect v-model=\"value\" :multiple=\"true\" :options=\"options\" />\n    </div>\n  </body>\n  <script>\n      createApp({\n          data: {\n            // define the default value\n            value: null,\n            // define options\n            options: [ {\n            id: 'a',\n            label: 'a',\n            children: [ {\n                id: 'aa',\n                label: 'aa',\n            }, {\n                id: 'ab',\n                label: 'ab',\n            } ],\n            }, {\n            id: 'b',\n            label: 'b',\n            }, {\n            id: 'c',\n            label: 'c',\n            } ],\n        },\n      })\n        .component('treeselect', VueTreeselect.Treeselect)\n        .mount('#app')\n\n  </script>\n</html>\n```\n\n### Documentation for vue 2 & Live Demo. Be careful with breaking changes above.\n\n[Visit the website](https://vue-treeselect.js.org/)\n\nNote: please use a desktop browser since the website hasn't been optimized for mobile devices.\n\n### Browser Compatibility\n\n- Chrome\n- Edge\n- Firefox\n- Safari\n\nIt should function well on IE9, but the style can be slightly broken due to the lack of support of some relatively new CSS features, such as `transition` and `animation`. Nevertheless it should look 90% same as on modern browsers.\n\n### Bugs\n\nYou can [open an issue](https://github.com/megafetis/vue3-treeselect/issues/new).\n\n### Contributing\n\n1. Fork & clone the repo\n2. Install dependencies by `yarn` or `npm install`\n3. Check out a new branch\n4. `npm run dev` & hack\n5. Make sure `npm test` passes\n6. Push your changes & file a pull request\n\n### Credits\n\nThis project is inspired by [vue-treeselect](https://github.com/riophae/vue-treeselect).\nSpecial thanks go to their respective authors!\n\nSome icons used in this project:\n\n  - \"link\" icon made by [Smashicons](https://www.flaticon.com/authors/smashicons) is licensed under [CC 3.0 BY](https://creativecommons.org/licenses/by/3.0/)\n  - \"spinner\" icon from [SpinKit](https://github.com/tobiasahlin/SpinKit) is licensed under the [MIT License](https://github.com/tobiasahlin/SpinKit/blob/master/LICENSE)\n  - \"caret\" icon made by [Dave Gandy](https://www.flaticon.com/authors/dave-gandy) is licensed under [CC 3.0 BY](https://creativecommons.org/licenses/by/3.0/)\n  - \"delete\" icon made by [Freepik](https://www.flaticon.com/authors/freepik) is licensed under [CC 3.0 BY](https://creativecommons.org/licenses/by/3.0/)\n  - \"checkmark symbol\" & \"minus symbol\" icons made by [Catalin Fertu](https://www.flaticon.com/authors/catalin-fertu) are licensed under [CC 3.0 BY](https://creativecommons.org/licenses/by/3.0/)\n\n### License\n\nReleased under the [MIT License](https://github.com/megafetis/vue3-treeselect/blob/master/LICENSE).\n","readmeFilename":"README.md"}