Update all form components to update bound values before firing onchange events
This commit is contained in:
parent
da47cfa4e5
commit
e41c6e33e0
|
@ -12,8 +12,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -15,8 +15,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
const extractProperty = (value, property) => {
|
||||
if (value && typeof value === "object") {
|
||||
|
|
|
@ -46,10 +46,10 @@
|
|||
let map = null
|
||||
if (options?.length) {
|
||||
map = {}
|
||||
options.forEach(option => {
|
||||
const optionValue = getOptionValue(option)
|
||||
options.forEach((option, idx) => {
|
||||
const optionValue = getOptionValue(option, idx)
|
||||
if (optionValue != null) {
|
||||
map[optionValue] = getOptionLabel(option) || ""
|
||||
map[optionValue] = getOptionLabel(option, idx) || ""
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
|
@ -81,16 +81,16 @@
|
|||
</li>
|
||||
{/if}
|
||||
{#if options && Array.isArray(options)}
|
||||
{#each options as option}
|
||||
{#each options as option, idx}
|
||||
<li
|
||||
class="spectrum-Menu-item"
|
||||
class:is-selected={isOptionSelected(getOptionValue(option))}
|
||||
class:is-selected={isOptionSelected(getOptionValue(option, idx))}
|
||||
role="option"
|
||||
aria-selected="true"
|
||||
tabindex="0"
|
||||
on:click={() => onSelectOption(getOptionValue(option))}>
|
||||
on:click={() => onSelectOption(getOptionValue(option, idx))}>
|
||||
<span
|
||||
class="spectrum-Menu-itemLabel">{getOptionLabel(option)}</span>
|
||||
class="spectrum-Menu-itemLabel">{getOptionLabel(option, idx)}</span>
|
||||
<svg
|
||||
class="spectrum-Icon spectrum-UIIcon-Checkmark100 spectrum-Menu-checkmark spectrum-Menu-itemIcon"
|
||||
focusable="false"
|
||||
|
|
|
@ -28,8 +28,10 @@
|
|||
}
|
||||
|
||||
// Render the label if the selected option is found, otherwide raw value
|
||||
const selected = options.find(option => getOptionValue(option) === value)
|
||||
return selected ? getOptionLabel(selected) : value
|
||||
const index = options.findIndex(
|
||||
(option, idx) => getOptionValue(option, idx) === value
|
||||
)
|
||||
return index !== -1 ? getOptionLabel(options[index], index) : value
|
||||
}
|
||||
|
||||
const selectOption = value => {
|
||||
|
|
|
@ -14,8 +14,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -16,8 +16,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -14,8 +14,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
const extractProperty = (value, property) => {
|
||||
if (value && typeof value === "object") {
|
||||
|
|
|
@ -16,8 +16,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
const extractProperty = (value, property) => {
|
||||
if (value && typeof value === "object") {
|
||||
|
|
|
@ -13,8 +13,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
@ -12,8 +12,8 @@
|
|||
|
||||
const dispatch = createEventDispatcher()
|
||||
const onChange = e => {
|
||||
dispatch("change", e.detail)
|
||||
value = e.detail
|
||||
dispatch("change", e.detail)
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
Loading…
Reference in New Issue