mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 12:14:41 +01:00
fix(Slider): handle generic types
This commit is contained in:
@@ -38,13 +38,13 @@ export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' |
|
|||||||
ui?: Slider['slots']
|
ui?: Slider['slots']
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SliderEmits {
|
export interface SliderEmits<T extends number | number[] = number | number[]> {
|
||||||
(e: 'update:modelValue', payload: number | number[]): void
|
(e: 'update:modelValue', payload: T): void
|
||||||
(e: 'change', payload: Event): void
|
(e: 'change', payload: Event): void
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts" generic="T extends number | number[]">
|
||||||
import { computed } from 'vue'
|
import { computed } from 'vue'
|
||||||
import { SliderRoot, SliderRange, SliderTrack, SliderThumb, useForwardPropsEmits } from 'reka-ui'
|
import { SliderRoot, SliderRange, SliderTrack, SliderThumb, useForwardPropsEmits } from 'reka-ui'
|
||||||
import { reactivePick } from '@vueuse/core'
|
import { reactivePick } from '@vueuse/core'
|
||||||
@@ -59,9 +59,9 @@ const props = withDefaults(defineProps<SliderProps>(), {
|
|||||||
step: 1,
|
step: 1,
|
||||||
orientation: 'horizontal'
|
orientation: 'horizontal'
|
||||||
})
|
})
|
||||||
const emits = defineEmits<SliderEmits>()
|
const emits = defineEmits<SliderEmits<T>>()
|
||||||
|
|
||||||
const modelValue = defineModel<number | number[]>()
|
const modelValue = defineModel<T>()
|
||||||
|
|
||||||
const appConfig = useAppConfig() as Slider['AppConfig']
|
const appConfig = useAppConfig() as Slider['AppConfig']
|
||||||
|
|
||||||
@@ -81,10 +81,10 @@ const sliderValue = computed({
|
|||||||
if (typeof modelValue.value === 'number') {
|
if (typeof modelValue.value === 'number') {
|
||||||
return [modelValue.value]
|
return [modelValue.value]
|
||||||
}
|
}
|
||||||
return modelValue.value ?? defaultSliderValue.value
|
return (modelValue.value as number[]) ?? defaultSliderValue.value
|
||||||
},
|
},
|
||||||
set(value) {
|
set(value) {
|
||||||
modelValue.value = value?.length !== 1 ? value : value[0]
|
modelValue.value = (value?.length !== 1 ? value : value[0]) as T
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user