diff --git a/packages/bbui/src/Form/Core/Multiselect.svelte b/packages/bbui/src/Form/Core/Multiselect.svelte index d6c4dc23ac..d76dba96d3 100644 --- a/packages/bbui/src/Form/Core/Multiselect.svelte +++ b/packages/bbui/src/Form/Core/Multiselect.svelte @@ -17,12 +17,13 @@ const dispatch = createEventDispatcher() - $: selectedLookupMap = getSelectedLookupMap(value) + $: arrayValue = Array.isArray(value) ? value : [value].filter(x => !!x) + $: selectedLookupMap = getSelectedLookupMap(arrayValue) $: optionLookupMap = getOptionLookupMap(options) - $: fieldText = getFieldText(value, optionLookupMap, placeholder) + $: fieldText = getFieldText(arrayValue, optionLookupMap, placeholder) $: isOptionSelected = optionValue => selectedLookupMap[optionValue] === true - $: toggleOption = makeToggleOption(selectedLookupMap, value) + $: toggleOption = makeToggleOption(selectedLookupMap, arrayValue) const getFieldText = (value, map, placeholder) => { if (Array.isArray(value) && value.length > 0) { @@ -81,7 +82,7 @@ {readonly} {fieldText} {options} - isPlaceholder={!value?.length} + isPlaceholder={!arrayValue.length} {autocomplete} {isOptionSelected} {getOptionLabel} diff --git a/packages/bbui/src/Table/ArrayRenderer.svelte b/packages/bbui/src/Table/ArrayRenderer.svelte index 3755850666..637454dbca 100644 --- a/packages/bbui/src/Table/ArrayRenderer.svelte +++ b/packages/bbui/src/Table/ArrayRenderer.svelte @@ -5,8 +5,9 @@ const displayLimit = 5 - $: badges = Array.isArray(value) ? value.slice(0, displayLimit) : [] - $: leftover = (value?.length ?? 0) - badges.length + $: arrayValue = Array.isArray(value) ? value : [value].filter(x => !!x) + $: badges = arrayValue.slice(0, displayLimit) + $: leftover = arrayValue.length - badges.length {#each badges as badge} diff --git a/packages/client/src/components/app/spreadsheet/MultiSelectCell.svelte b/packages/client/src/components/app/spreadsheet/MultiSelectCell.svelte new file mode 100644 index 0000000000..e69de29bb2