diff options
Diffstat (limited to 'app/assets/javascripts/listbox/index.js')
-rw-r--r-- | app/assets/javascripts/listbox/index.js | 48 |
1 files changed, 18 insertions, 30 deletions
diff --git a/app/assets/javascripts/listbox/index.js b/app/assets/javascripts/listbox/index.js index f63171e2785..7eacbf7fcdd 100644 --- a/app/assets/javascripts/listbox/index.js +++ b/app/assets/javascripts/listbox/index.js @@ -1,4 +1,4 @@ -import { GlDropdown, GlDropdownItem } from '@gitlab/ui'; +import { GlListbox } from '@gitlab/ui'; import Vue from 'vue'; import { parseBoolean } from '~/lib/utils/common_utils'; @@ -31,37 +31,25 @@ export function initListbox(el, { onChange } = {}) { }, }, render(h) { - return h( - GlDropdown, - { - props: { - text: this.text, - right, + return h(GlListbox, { + props: { + items, + right, + selected: this.selected, + toggleText: this.text, + }, + class: className, + on: { + select: (selectedValue) => { + this.selected = selectedValue; + const selectedItem = items.find(({ value }) => value === selectedValue); + + if (typeof onChange === 'function') { + onChange(selectedItem); + } }, - class: className, }, - items.map((item) => - h( - GlDropdownItem, - { - props: { - isCheckItem: true, - isChecked: this.selected === item.value, - }, - on: { - click: () => { - this.selected = item.value; - - if (typeof onChange === 'function') { - onChange(item); - } - }, - }, - }, - item.text, - ), - ), - ); + }); }, }); } |