diff --git a/.eslintrc.js b/.eslintrc.js index 3f3df4f..9ee4b35 100644 --- a/.eslintrc.js +++ b/.eslintrc.js @@ -6,9 +6,12 @@ module.exports = { extends: ["plugin:vue/essential", "@vue/prettier"], rules: { "no-console": process.env.NODE_ENV === "production" ? "error" : "off", - "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off" + "no-debugger": process.env.NODE_ENV === "production" ? "error" : "off", + "prettier/prettier": { + tabWidth: 4, + } }, parserOptions: { parser: "babel-eslint" - } + }, }; diff --git a/README.md b/README.md index 7459e68..b304f15 100644 --- a/README.md +++ b/README.md @@ -43,7 +43,7 @@ export default { ### Passing options -The `options` prop accepts arrays of strings +The `options` property accepts arrays of strings. ```html @@ -53,3 +53,80 @@ And arrays of objects ```html ``` + +Or you can provide a function to fetch the items. +```html + + +``` + +Even asynchronously. +```html + + +``` + +To customize the look of the dropdown, you can use the `label` slot. +```html + + + +``` + +### Supported Props +#### `value-prop` +To determine which item is selected, we use the `"value"` property on the selected object by default. +You may override this behaviour by setting name in the `value-prop` property. + +#### `text-prop` +When not using the `label` slot, you can override which property will show as label +by setting the `text-prop` property. + +#### `label-not-found` +If there are no items to be displayed (or they are all filtered away), by default we show "No results matched", +You may override this text by setting the desired text in the `label-not-found` property. +> CAVEAT: Be aware the search term is always appended to this string. +> Use the `label-not-found` template to provide your own formatting. This slot accepts the +> Scope `search` for the search term. + +#### `label-title` +If there are items in the array, but none were selected. This text will appear. +Default: `"Nothing selected` + +#### `label-search-placeholder` +This property overrides the placeholder set in the search ``. This is `"Search"` by default. + + +#### `searchable` +Boolean - Determine wether the search box should be enabled. + +#### `show-default-option` +Boolean - Determine wether `label-title` should be shown. diff --git a/package-lock.json b/package-lock.json index 6c7a2b3..f380325 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "@alfsnd/vue-bootstrap-select", - "version": "0.4.1", + "version": "0.4.3", "lockfileVersion": 1, "requires": true, "dependencies": { @@ -6812,9 +6812,9 @@ } }, "fstream": { - "version": "1.0.11", - "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.11.tgz", - "integrity": "sha1-XB+x8RdHcRTwYyoOtLcbPLD9MXE=", + "version": "1.0.12", + "resolved": "https://registry.npmjs.org/fstream/-/fstream-1.0.12.tgz", + "integrity": "sha512-WvJ193OHa0GHPEL+AycEJgxvBEwyfRkN1vhjca23OaPVMCaLCXTd5qAu82AjTcgP1UJmytkOKb63Ypde7raDIg==", "dev": true, "requires": { "graceful-fs": "^4.1.2", @@ -8590,18 +8590,6 @@ "integrity": "sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg==", "dev": true }, - "lodash.assign": { - "version": "4.2.0", - "resolved": "https://registry.npmjs.org/lodash.assign/-/lodash.assign-4.2.0.tgz", - "integrity": "sha1-DZnzzNem0mHRm9rrkkUAXShYCOc=", - "dev": true - }, - "lodash.clonedeep": { - "version": "4.5.0", - "resolved": "https://registry.npmjs.org/lodash.clonedeep/-/lodash.clonedeep-4.5.0.tgz", - "integrity": "sha1-4j8/nE+Pvd6HJSnBBxhXoIblzO8=", - "dev": true - }, "lodash.defaultsdeep": { "version": "4.6.0", "resolved": "https://registry.npmjs.org/lodash.defaultsdeep/-/lodash.defaultsdeep-4.6.0.tgz", @@ -8626,12 +8614,6 @@ "integrity": "sha1-vMbEmkKihA7Zl/Mj6tpezRguC/4=", "dev": true }, - "lodash.mergewith": { - "version": "4.6.1", - "resolved": "https://registry.npmjs.org/lodash.mergewith/-/lodash.mergewith-4.6.1.tgz", - "integrity": "sha512-eWw5r+PYICtEBgrBE5hhlT6aAa75f411bgDz/ZL2KZqYV03USvucsxcHUIlGTDTECs1eunpI7HOV7U+WLDvNdQ==", - "dev": true - }, "lodash.tail": { "version": "4.1.1", "resolved": "https://registry.npmjs.org/lodash.tail/-/lodash.tail-4.1.1.tgz", @@ -9105,7 +9087,8 @@ "version": "2.12.1", "resolved": "https://registry.npmjs.org/nan/-/nan-2.12.1.tgz", "integrity": "sha512-JY7V6lRkStKcKTvHO5NVSQRv+RV+FIL5pvDoLiAtSL9pKlC5x9PKQcZDsq7m4FO4d57mkhC6Z+QhAh3Jdk5JFw==", - "dev": true + "dev": true, + "optional": true }, "nanomatch": { "version": "1.2.13", @@ -9273,9 +9256,9 @@ } }, "node-sass": { - "version": "4.11.0", - "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.11.0.tgz", - "integrity": "sha512-bHUdHTphgQJZaF1LASx0kAviPH7sGlcyNhWade4eVIpFp6tsn7SV8xNMTbsQFpEV9VXpnwTTnNYlfsZXgGgmkA==", + "version": "4.12.0", + "resolved": "https://registry.npmjs.org/node-sass/-/node-sass-4.12.0.tgz", + "integrity": "sha512-A1Iv4oN+Iel6EPv77/HddXErL2a+gZ4uBeZUy+a8O35CFYTXhgA8MgLCWBtwpGZdCvTvQ9d+bQxX/QC36GDPpQ==", "dev": true, "requires": { "async-foreach": "^0.1.3", @@ -9285,12 +9268,10 @@ "get-stdin": "^4.0.1", "glob": "^7.0.3", "in-publish": "^2.0.0", - "lodash.assign": "^4.2.0", - "lodash.clonedeep": "^4.3.2", - "lodash.mergewith": "^4.6.0", + "lodash": "^4.17.11", "meow": "^3.7.0", "mkdirp": "^0.5.1", - "nan": "^2.10.0", + "nan": "^2.13.2", "node-gyp": "^3.8.0", "npmlog": "^4.0.0", "request": "^2.88.0", @@ -9334,6 +9315,12 @@ "integrity": "sha1-uWjGsKBDhDJJAui/Gl3zJXmkUP4=", "dev": true }, + "nan": { + "version": "2.14.0", + "resolved": "https://registry.npmjs.org/nan/-/nan-2.14.0.tgz", + "integrity": "sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg==", + "dev": true + }, "supports-color": { "version": "2.0.0", "resolved": "https://registry.npmjs.org/supports-color/-/supports-color-2.0.0.tgz", @@ -14136,13 +14123,13 @@ "dev": true }, "tar": { - "version": "2.2.1", - "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.1.tgz", - "integrity": "sha1-jk0qJWwOIYXGsYrWlK7JaLg8sdE=", + "version": "2.2.2", + "resolved": "https://registry.npmjs.org/tar/-/tar-2.2.2.tgz", + "integrity": "sha512-FCEhQ/4rE1zYv9rYXJw/msRqsnmlje5jHP6huWeBZ704jUTy02c5AZyWujpMR1ax6mVw9NyJMfuK2CMDWVIfgA==", "dev": true, "requires": { "block-stream": "*", - "fstream": "^1.0.2", + "fstream": "^1.0.12", "inherits": "2" } }, diff --git a/package.json b/package.json index c5fe4bb..5d9d39f 100644 --- a/package.json +++ b/package.json @@ -42,12 +42,12 @@ "eslint": "^5.8.0", "eslint-plugin-vue": "^5.0.0", "minimist": "^1.2.0", - "node-sass": "^4.9.0", - "sass-loader": "^7.1.0", + "node-sass": "^4.12.0", "rollup": "^0.66.2", "rollup-plugin-buble": "^0.19.2", "rollup-plugin-uglify-es": "0.0.1", "rollup-plugin-vue": "^4.3.0", + "sass-loader": "^7.1.0", "vue": "^2.5.22", "vue-template-compiler": "^2.5.22" } diff --git a/public/images/profilepictures/Credits.txt b/public/images/profilepictures/Credits.txt new file mode 100644 index 0000000..e531f23 --- /dev/null +++ b/public/images/profilepictures/Credits.txt @@ -0,0 +1,5 @@ +(c) Thispersondoesnotexist.com + +Produced by a GAN (generative adversarial network) +StyleGAN (Dec 2018) - Karras et al. and Nvidia +Original GAN (2014) - Goodfellow et al. \ No newline at end of file diff --git a/public/images/profilepictures/brian.jpeg b/public/images/profilepictures/brian.jpeg new file mode 100644 index 0000000..3de693d Binary files /dev/null and b/public/images/profilepictures/brian.jpeg differ diff --git a/public/images/profilepictures/charlotte.jpeg b/public/images/profilepictures/charlotte.jpeg new file mode 100644 index 0000000..090b676 Binary files /dev/null and b/public/images/profilepictures/charlotte.jpeg differ diff --git a/public/images/profilepictures/leo.jpeg b/public/images/profilepictures/leo.jpeg new file mode 100644 index 0000000..7e8c8c1 Binary files /dev/null and b/public/images/profilepictures/leo.jpeg differ diff --git a/public/images/profilepictures/lisa.jpeg b/public/images/profilepictures/lisa.jpeg new file mode 100644 index 0000000..3b3a417 Binary files /dev/null and b/public/images/profilepictures/lisa.jpeg differ diff --git a/public/images/profilepictures/robert.jpeg b/public/images/profilepictures/robert.jpeg new file mode 100644 index 0000000..634908a Binary files /dev/null and b/public/images/profilepictures/robert.jpeg differ diff --git a/src/App.vue b/src/App.vue index 6d7e104..afc844d 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,92 +1,271 @@ - diff --git a/src/entry.js b/src/entry.js index 34cc246..1166814 100644 --- a/src/entry.js +++ b/src/entry.js @@ -3,26 +3,26 @@ import component from './vue-bootstrap-select.vue'; // install function executed by Vue.use() function install(Vue) { - if (install.installed) return; - install.installed = true; - Vue.component('VueBootstrapSelect', component); + if (install.installed) return; + install.installed = true; + Vue.component('VueBootstrapSelect', component); } // Create module definition for Vue.use() const plugin = { - install, + install, }; // To auto-install when vue is found /* global window global */ let GlobalVue = null; if (typeof window !== 'undefined') { - GlobalVue = window.Vue; + GlobalVue = window.Vue; } else if (typeof global !== 'undefined') { - GlobalVue = global.Vue; + GlobalVue = global.Vue; } if (GlobalVue) { - GlobalVue.use(plugin); + GlobalVue.use(plugin); } // To allow use as module (npm/webpack/etc.) export component diff --git a/src/main.js b/src/main.js index a3fd06b..1f4f28e 100644 --- a/src/main.js +++ b/src/main.js @@ -4,5 +4,5 @@ import App from "./App.vue"; Vue.config.productionTip = false; new Vue({ - render: h => h(App) + render: h => h(App) }).$mount("#app"); diff --git a/src/vue-bootstrap-select.vue b/src/vue-bootstrap-select.vue index 4cda5e3..4307bb4 100644 --- a/src/vue-bootstrap-select.vue +++ b/src/vue-bootstrap-select.vue @@ -1,393 +1,415 @@ diff --git a/vue.config.js b/vue.config.js index 4fa175b..53f122a 100644 --- a/vue.config.js +++ b/vue.config.js @@ -4,7 +4,7 @@ module.exports = { .rule("eslint") .use("eslint-loader") .options({ - fix: true + fix: false, }); } };