diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-01-18 19:00:14 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-01-18 19:00:14 +0000 |
commit | 05f0ebba3a2c8ddf39e436f412dc2ab5bf1353b2 (patch) | |
tree | 11d0f2a6ec31c7793c184106cedc2ded3d9a2cc5 /app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue | |
parent | ec73467c23693d0db63a797d10194da9e72a74af (diff) | |
download | gitlab-ce-05f0ebba3a2c8ddf39e436f412dc2ab5bf1353b2.tar.gz |
Add latest changes from gitlab-org/gitlab@15-8-stable-eev15.8.0-rc42
Diffstat (limited to 'app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue')
-rw-r--r-- | app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue | 31 |
1 files changed, 26 insertions, 5 deletions
diff --git a/app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue b/app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue index b1809e6a9f3..bc6b5d3176f 100644 --- a/app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue +++ b/app/assets/javascripts/vue_shared/components/listbox_input/listbox_input.vue @@ -1,25 +1,37 @@ <script> -import { GlListbox } from '@gitlab/ui'; +import { GlFormGroup, GlListbox } from '@gitlab/ui'; import { __ } from '~/locale'; -const MIN_ITEMS_COUNT_FOR_SEARCHING = 20; +const MIN_ITEMS_COUNT_FOR_SEARCHING = 10; export default { i18n: { noResultsText: __('No results found'), }, components: { + GlFormGroup, GlListbox, }, model: GlListbox.model, props: { + label: { + type: String, + required: false, + default: '', + }, + description: { + type: String, + required: false, + default: '', + }, name: { type: String, required: true, }, defaultToggleText: { type: String, - required: true, + required: false, + default: '', }, selected: { type: String, @@ -30,6 +42,11 @@ export default { type: GlListbox.props.items.type, required: true, }, + disabled: { + type: Boolean, + required: false, + default: false, + }, }, data() { return { @@ -37,6 +54,9 @@ export default { }; }, computed: { + wrapperComponent() { + return this.label || this.description ? 'gl-form-group' : 'div'; + }, allOptions() { const allOptions = []; @@ -95,16 +115,17 @@ export default { </script> <template> - <div> + <component :is="wrapperComponent" :label="label" :description="description" v-bind="$attrs"> <gl-listbox :selected="selected" :toggle-text="toggleText" :items="filteredItems" :searchable="isSearchable" :no-results-text="$options.i18n.noResultsText" + :disabled="disabled" @search="search" @select="$emit($options.model.event, $event)" /> <input ref="input" type="hidden" :name="name" :value="selected" /> - </div> + </component> </template> |