diff options
Diffstat (limited to 'packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx')
| -rw-r--r-- | packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx | 13 |
1 files changed, 8 insertions, 5 deletions
diff --git a/packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx b/packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx index 375f8da93..05733fe19 100644 --- a/packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx +++ b/packages/exchange-backoffice-ui/src/forms/InputSelectMultiple.tsx @@ -7,9 +7,11 @@ import { useState } from "preact/hooks"; export function InputSelectMultiple( props: { choices: Choice[]; + unique?: boolean; } & UIFormProps<Array<string>>, ): VNode { - const { name, label, choices, placeholder, tooltip, required } = props; + const { name, label, choices, placeholder, tooltip, required, unique } = + props; const { value, onChange } = useField<{ [s: string]: Array<string> }>(name); const [filter, setFilter] = useState<string | undefined>(undefined); @@ -26,7 +28,7 @@ export function InputSelectMultiple( return regex.test(v.label); }); return ( - <div class="sm:col-span-4"> + <div class="sm:col-span-6"> <LabelWithTooltipMaybeRequired label={label} required={required} @@ -101,18 +103,19 @@ export function InputSelectMultiple( role="listbox" > {filteredChoices.map((v, idx) => { - let clazz = - "relative flex border p-4 focus:outline-none disabled:text-grey"; return ( <li class="relative cursor-pointer select-none py-2 pl-3 pr-9 text-gray-900 hover:text-white hover:bg-indigo-600" id="option-0" role="option" onClick={() => { + setFilter(undefined); + if (unique && list.indexOf(v.value) !== -1) { + return; + } const newValue = [...list]; newValue.splice(0, 0, v.value); onChange(newValue); - setFilter(undefined); }} // tabindex="-1" |