fix(components): refactor types after @nuxt/module-builder upgrade (#3855)

This commit is contained in:
Benjamin Canac
2025-04-12 17:53:03 +02:00
committed by GitHub
parent 333b7e4c9b
commit 39c861a64b
57 changed files with 635 additions and 731 deletions

View File

@@ -1,16 +1,10 @@
<script lang="ts">
import type { VariantProps } from 'tailwind-variants'
import type { SliderRootProps } from 'reka-ui'
import type { AppConfig } from '@nuxt/schema'
import _appConfig from '#build/app.config'
import theme from '#build/ui/slider'
import { tv } from '../utils/tv'
import type { ComponentConfig } from '../types/utils'
const appConfigSlider = _appConfig as AppConfig & { ui: { slider: Partial<typeof theme> } }
const slider = tv({ extend: tv(theme), ...(appConfigSlider.ui?.slider || {}) })
type SliderVariants = VariantProps<typeof slider>
type Slider = ComponentConfig<typeof theme, AppConfig, 'slider'>
export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' | 'inverted' | 'min' | 'max' | 'step' | 'minStepsBetweenThumbs'> {
/**
@@ -21,11 +15,11 @@ export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' |
/**
* @defaultValue 'md'
*/
size?: SliderVariants['size']
size?: Slider['variants']['size']
/**
* @defaultValue 'primary'
*/
color?: SliderVariants['color']
color?: Slider['variants']['color']
/**
* The orientation of the slider.
* @defaultValue 'horizontal'
@@ -34,7 +28,7 @@ export interface SliderProps extends Pick<SliderRootProps, 'name' | 'disabled' |
/** The value of the slider when initially rendered. Use when you do not need to control the state of the slider. */
defaultValue?: number | number[]
class?: any
ui?: Partial<typeof slider.slots>
ui?: Slider['slots']
}
export interface SliderEmits {
@@ -47,7 +41,9 @@ export interface SliderEmits {
import { computed } from 'vue'
import { SliderRoot, SliderRange, SliderTrack, SliderThumb, useForwardPropsEmits } from 'reka-ui'
import { reactivePick } from '@vueuse/core'
import { useAppConfig } from '#imports'
import { useFormField } from '../composables/useFormField'
import { tv } from '../utils/tv'
const props = withDefaults(defineProps<SliderProps>(), {
min: 0,
@@ -59,6 +55,8 @@ const emits = defineEmits<SliderEmits>()
const modelValue = defineModel<number | number[]>()
const appConfig = useAppConfig() as Slider['AppConfig']
const rootProps = useForwardPropsEmits(reactivePick(props, 'as', 'orientation', 'min', 'max', 'step', 'minStepsBetweenThumbs', 'inverted'), emits)
const { id, emitFormChange, emitFormInput, size, color, name, disabled, ariaAttrs } = useFormField<SliderProps>(props)
@@ -84,7 +82,7 @@ const sliderValue = computed({
const thumbsCount = computed(() => sliderValue.value?.length ?? 1)
const ui = computed(() => slider({
const ui = computed(() => tv({ extend: tv(theme), ...(appConfig.ui?.slider || {}) })({
disabled: disabled.value,
size: size.value,
color: color.value,