Fix fancy select not correctly displaying the label for the selected value

This commit is contained in:
Andrew Kingston 2023-01-25 14:11:33 +00:00 committed by adrinr
parent dc68c8ce91
commit 37bf4214a6
1 changed files with 13 additions and 1 deletions

View File

@ -21,6 +21,7 @@
let wrapper
$: placeholder = !value
$: selectedLabel = getSelectedLabel(value)
const extractProperty = (value, property) => {
if (value && typeof value === "object") {
@ -37,6 +38,17 @@
}
open = false
}
const getSelectedLabel = value => {
if (!value || !options?.length) {
return ""
}
const selectedOption = options.find(x => getOptionValue(x) === value)
if (!selectedOption) {
return value
}
return getOptionLabel(selectedOption)
}
</script>
<FancyField
@ -53,7 +65,7 @@
{/if}
<div class="value" class:placeholder>
{value || ""}
{selectedLabel || ""}
</div>
<div class="arrow">