Allow selects to support no placeholder option

This commit is contained in:
Andrew Kingston 2021-04-16 09:01:21 +01:00
parent 4b51381c88
commit b0f31aaf15
2 changed files with 4 additions and 5 deletions

View File

@ -4,7 +4,7 @@
export let value = null export let value = null
export let fieldId = null export let fieldId = null
export let placeholder = null export let placeholder = "Choose an option"
export let disabled = false export let disabled = false
export let error = null export let error = null
export let options = [] export let options = []
@ -13,13 +13,12 @@
const dispatch = createEventDispatcher() const dispatch = createEventDispatcher()
let open = false let open = false
$: placeholderText = placeholder || "Choose an option"
$: isNull = value == null || value === "" $: isNull = value == null || value === ""
$: selectedOption = options.find(option => getOptionValue(option) === value) $: selectedOption = options.find(option => getOptionValue(option) === value)
$: selectedLabel = selectedOption $: selectedLabel = selectedOption
? getOptionLabel(selectedOption) ? getOptionLabel(selectedOption)
: placeholderText : placeholderText
$: fieldText = isNull ? placeholderText : selectedLabel $: fieldText = isNull ? placeholder || "Choose an option" : selectedLabel
const selectOption = value => { const selectOption = value => {
dispatch("change", value) dispatch("change", value)
@ -37,6 +36,6 @@
{getOptionLabel} {getOptionLabel}
{getOptionValue} {getOptionValue}
isPlaceholder={isNull} isPlaceholder={isNull}
placeholderOption={placeholderText} placeholderOption={placeholder}
isOptionSelected={option => option === value} isOptionSelected={option => option === value}
onSelectOption={selectOption} /> onSelectOption={selectOption} />

View File

@ -8,7 +8,7 @@
export let disabled = false export let disabled = false
export let labelPosition = "above" export let labelPosition = "above"
export let error = null export let error = null
export let placeholder = null export let placeholder = "Choose an option"
export let options = [] export let options = []
export let getOptionLabel = option => option export let getOptionLabel = option => option
export let getOptionValue = option => option export let getOptionValue = option => option