fix: stop unregistering Select item labels on unmount
SelectItem removed its entry from the shared itemLabels map on unmount, which fires for every item when the dropdown closes -- including the item that was just selected. That wiped the trigger's display label right after selecting (and after Escape/close in general). Labels only need to be learned once and can safely persist, matching the documented behavior in tests/Select.spec.ts. Found via manual Storybook verification.
This commit is contained in:
parent
8c830438d5
commit
b8fb6769c7
3 changed files with 1 additions and 6 deletions
|
|
@ -37,7 +37,6 @@ provide(SelectContextKey, {
|
||||||
contentId: `select-content-${useId()}`,
|
contentId: `select-content-${useId()}`,
|
||||||
itemLabels,
|
itemLabels,
|
||||||
registerLabel: (value: string, label: string) => { itemLabels.set(value, label) },
|
registerLabel: (value: string, label: string) => { itemLabels.set(value, label) },
|
||||||
unregisterLabel: (value: string) => { itemLabels.delete(value) },
|
|
||||||
})
|
})
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -1,7 +1,7 @@
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { CheckIcon } from '@lucide/vue'
|
import { CheckIcon } from '@lucide/vue'
|
||||||
import type { HTMLAttributes } from 'vue'
|
import type { HTMLAttributes } from 'vue'
|
||||||
import { computed, inject, onBeforeUnmount, onMounted, ref } from 'vue'
|
import { computed, inject, onMounted, ref } from 'vue'
|
||||||
import { cn } from '@/lib/utils'
|
import { cn } from '@/lib/utils'
|
||||||
import { SelectContextKey } from './context'
|
import { SelectContextKey } from './context'
|
||||||
import SelectItemText from './SelectItemText.vue'
|
import SelectItemText from './SelectItemText.vue'
|
||||||
|
|
@ -31,9 +31,6 @@ function onPointerMove() {
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
context.registerLabel(props.value, itemRef.value?.textContent?.trim() ?? '')
|
context.registerLabel(props.value, itemRef.value?.textContent?.trim() ?? '')
|
||||||
})
|
})
|
||||||
onBeforeUnmount(() => {
|
|
||||||
context.unregisterLabel(props.value)
|
|
||||||
})
|
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,6 @@ export interface SelectContext {
|
||||||
contentId: string
|
contentId: string
|
||||||
itemLabels: Map<string, string>
|
itemLabels: Map<string, string>
|
||||||
registerLabel: (value: string, label: string) => void
|
registerLabel: (value: string, label: string) => void
|
||||||
unregisterLabel: (value: string) => void
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export const SelectContextKey: InjectionKey<SelectContext> = Symbol('SelectContext')
|
export const SelectContextKey: InjectionKey<SelectContext> = Symbol('SelectContext')
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue