From 2e8dd919ca9b18775035d811df91205f5769a76e Mon Sep 17 00:00:00 2001 From: Jeff Sagal Date: Tue, 20 Jul 2021 09:20:23 -0700 Subject: [PATCH 1/7] docs: update sponsors, remove ads --- docs/.vuepress/components/Sponsors.vue | 6 ++-- docs/.vuepress/github/clientDynamicModules.js | 28 ++++++++++++------- docs/.vuepress/theme/layouts/Layout.vue | 6 +--- 3 files changed, 22 insertions(+), 18 deletions(-) diff --git a/docs/.vuepress/components/Sponsors.vue b/docs/.vuepress/components/Sponsors.vue index 310eb6c..08a3876 100644 --- a/docs/.vuepress/components/Sponsors.vue +++ b/docs/.vuepress/components/Sponsors.vue @@ -16,11 +16,11 @@ import { format } from "date-fns"; export default { data: () => ({ - sponsors: SPONSORS.map(({ createdAt, sponsor }) => ({ + sponsors: SPONSORS.map(({ createdAt, sponsorEntity }) => ({ createdAt: format(new Date(createdAt), "LLL yyyy"), - ...sponsor + ...sponsorEntity })) - }) + }), }; diff --git a/docs/.vuepress/github/clientDynamicModules.js b/docs/.vuepress/github/clientDynamicModules.js index 0335d3e..e4a76f5 100644 --- a/docs/.vuepress/github/clientDynamicModules.js +++ b/docs/.vuepress/github/clientDynamicModules.js @@ -28,20 +28,28 @@ async function getContributors() { */ async function getSponsors() { const query = ` - { - user(login: "sagalbot") { - sponsorshipsAsMaintainer(first: 100) { - nodes { - createdAt - sponsor { - login - avatarUrl - } + { + user(login: "sagalbot") { + sponsorshipsAsMaintainer(first: 100) { + nodes { + sponsorEntity { + ... on User { + id + avatarUrl + login + } + ... on Organization { + id + avatarUrl + login } } + createdAt } } - `; + } + } + `; try { const { user } = await graphql(query, { diff --git a/docs/.vuepress/theme/layouts/Layout.vue b/docs/.vuepress/theme/layouts/Layout.vue index 7b22cee..c60a619 100644 --- a/docs/.vuepress/theme/layouts/Layout.vue +++ b/docs/.vuepress/theme/layouts/Layout.vue @@ -1,17 +1,13 @@ From 7da3ad422f40adc0e180ad6c6b216fd80863c479 Mon Sep 17 00:00:00 2001 From: George Catalin <44193533+rsgcata@users.noreply.github.com> Date: Thu, 22 Jul 2021 23:15:18 +0300 Subject: [PATCH 2/7] docs: add missing @search event #1417 --- docs/api/events.md | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/docs/api/events.md b/docs/api/events.md index 4866fef..710ef2e 100644 --- a/docs/api/events.md +++ b/docs/api/events.md @@ -69,3 +69,21 @@ event is triggered. ```js this.$emit("search:focus"); ``` + +## `search` + +Triggered when the search text changes. + +```js +/** + * Anytime the search string changes, emit the + * 'search' event. The event is passed with two + * parameters: the search string, and a function + * that accepts a boolean parameter to toggle the + * loading state. + * + * @emits search + */ +this.$emit('search', newSearchString, toggleLoading); +``` + From 7d59ab206f4218764cea2b817402617b21a7a0e6 Mon Sep 17 00:00:00 2001 From: Kevin Cameron Date: Thu, 22 Jul 2021 13:18:31 -0700 Subject: [PATCH 3/7] docs: Fix typo (#1374) --- docs/guide/components.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/guide/components.md b/docs/guide/components.md index b26b551..e5436f4 100644 --- a/docs/guide/components.md +++ b/docs/guide/components.md @@ -58,7 +58,7 @@ export default { ## Setting Globally at Registration -If you want to all instances of Vue Select to use your custom components throughout your app, while +If you want all instances of Vue Select to use your custom components throughout your app, while only having to set the implementation once, you can do so when registering Vue Select as a component. ```js From 86dd03dfdab911fb4800393078b5f62ef74792b0 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Can=20Geli=C5=9F?= Date: Thu, 22 Jul 2021 23:22:52 +0300 Subject: [PATCH 4/7] docs: add open and close events to the documentation (#1366) * add open and close events to the documentation * Update events.md Co-authored-by: Jeff Sagal --- docs/api/events.md | 16 ++++++++++++++++ 1 file changed, 16 insertions(+) diff --git a/docs/api/events.md b/docs/api/events.md index 710ef2e..ae83772 100644 --- a/docs/api/events.md +++ b/docs/api/events.md @@ -9,6 +9,22 @@ Triggered when the selected value changes. Used internally for `v-model`. this.$emit("input", val); ``` +## `open` + +Triggered when the dropdown is open. + +```js +this.$emit("open"); +``` + +## `close` + +Triggered when the dropdown is closed. + +```js +this.$emit("close"); +``` + ## `option:selecting` Triggered after an option has been selected, before updating internal state. From 94549ff9034d8033e26ef0d2336c7d45ccad2a97 Mon Sep 17 00:00:00 2001 From: Alexander Karlstad Date: Thu, 22 Jul 2021 22:35:07 +0200 Subject: [PATCH 5/7] docs: Add search event to documentation (#1342) * Add search event to documentation * Fix jsdoc for other event examples * Add toggleLoading param to documentation * Update events.md Co-authored-by: Jeff Sagal --- docs/api/events.md | 33 +++++++++++++++++++++++++++++++-- 1 file changed, 31 insertions(+), 2 deletions(-) diff --git a/docs/api/events.md b/docs/api/events.md index ae83772..a314206 100644 --- a/docs/api/events.md +++ b/docs/api/events.md @@ -4,7 +4,7 @@ Triggered when the selected value changes. Used internally for `v-model`. ```js /** - * @param val {Object|String}` - selected option. + * @param {Object|String} val - selected option. */ this.$emit("input", val); ``` @@ -63,11 +63,40 @@ Triggered when `taggable` is `true` and a new option has been created. ```js /** - * @param newOption {Object} - created option + * @param {Object} newOption - created option */ this.$emit("option:created", newOption); ``` +## `search` + +Anytime the search string changes, emit the +'search' event. The event is passed with two +parameters: the search string, and a function +that accepts a boolean parameter to toggle the +loading state. + +See the [AJAX Guide](/guide/ajax.html#loading-options-with-ajax) +for a complete example. + +```js +/** + * @param {String} searchString - the search string + * @param {Function} toggleLoading - function to toggle loading state, accepts true or false boolean + */ +this.$emit('search', this.search, this.toggleLoading); +``` + +```vue + + +``` + ## `search:blur` Triggered when the text input loses focus. The dropdown will close immediately before this From 16769473191650546c6069936eda3a9f5a6be39d Mon Sep 17 00:00:00 2001 From: Jeff Sagal Date: Thu, 22 Jul 2021 13:51:43 -0700 Subject: [PATCH 6/7] feat: add dropdownShouldOpen prop (#1464) --- docs/api/props.md | 15 +++++++++++++++ src/components/Select.vue | 16 +++++++++++++++- tests/unit/Dropdown.spec.js | 10 ++++++++++ 3 files changed, 40 insertions(+), 1 deletion(-) diff --git a/docs/api/props.md b/docs/api/props.md index 999e935..cfe3aca 100644 --- a/docs/api/props.md +++ b/docs/api/props.md @@ -187,6 +187,21 @@ disabled: { }, ``` +## dropdownShouldOpen + +Determines whether the dropdown should open. Used +for overriding the default dropdown behaviour. Receives +the vue-select instance as the single argument to the function. + +```js +dropdownShouldOpen: { + type: Function, + default({noDrop, open, mutableLoading}) { + return noDrop ? false : open && !mutableLoading; + } +} +``` + ## filter diff --git a/src/components/Select.vue b/src/components/Select.vue index 0eede03..c73b6a7 100644 --- a/src/components/Select.vue +++ b/src/components/Select.vue @@ -565,6 +565,20 @@ dropdownList.style.left = left; dropdownList.style.width = width; } + }, + + /** + * Determines whether the dropdown should be open. + * Receives the component instance as the only argument. + * + * @since v3.12.0 + * @return boolean + */ + dropdownShouldOpen: { + type: Function, + default({noDrop, open, mutableLoading}) { + return noDrop ? false : open && !mutableLoading; + } } }, @@ -1132,7 +1146,7 @@ * @return {Boolean} True if open */ dropdownOpen() { - return this.noDrop ? false : this.open && !this.mutableLoading + return this.dropdownShouldOpen(this); }, /** diff --git a/tests/unit/Dropdown.spec.js b/tests/unit/Dropdown.spec.js index c73b2e1..7404284 100755 --- a/tests/unit/Dropdown.spec.js +++ b/tests/unit/Dropdown.spec.js @@ -188,4 +188,14 @@ describe("Toggling Dropdown", () => { expect(Select.classes('vs--searching')).toBeFalsy(); }); + it("can be opened with dropdownShouldOpen", () => { + const Select = selectWithProps({ + noDrop: true, + dropdownShouldOpen: () => true, + options: ['one'] + }); + + expect(Select.classes('vs--open')).toBeTruthy(); + expect(Select.find('.vs__dropdown-menu li')).toBeTruthy(); + }) }); From d648a1f8bcad43981665f53a5c2d7d9775a6028f Mon Sep 17 00:00:00 2001 From: semantic-release-bot Date: Thu, 22 Jul 2021 20:52:47 +0000 Subject: [PATCH 7/7] =?UTF-8?q?chore(=F0=9F=9A=80):=203.12.0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 36cf2c5..43d8805 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-select", - "version": "3.11.2", + "version": "3.12.0", "description": "Everything you wish the HTML