arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-14 12:14:41 +01:00
Code Issues Packages Projects Releases Wiki Activity

fix(Input/Textarea): handle generic types

Browse Source 
Resolves nuxt/ui-pro#887
This commit is contained in:
Benjamin Canac
2025-05-13 17:18:06 +02:00
parent 67da90a2f6
commit 3c8d6cd01d
2 changed files with 14 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
src/runtime/components/Input.vue
View File

@@ -4,7 +4,7 @@ import type { AppConfig } from '@nuxt/schema'
import theme from '#build/ui/input'
import type { UseComponentIconsProps } from '../composables/useComponentIcons'
import type { AvatarProps } from '../types'
import type { ComponentConfig } from '../types/utils'
import type { AcceptableValue, ComponentConfig } from '../types/utils'
type Input = ComponentConfig<typeof theme, AppConfig, 'input'>
@@ -42,8 +42,8 @@ export interface InputProps extends UseComponentIconsProps {
ui?: Input['slots']
}
export interface InputEmits {
(e: 'update:modelValue', payload: string | number): void
export interface InputEmits<T extends AcceptableValue = AcceptableValue> {
(e: 'update:modelValue', payload: T): void
(e: 'blur', event: FocusEvent): void
(e: 'change', event: Event): void
}
@@ -55,7 +55,7 @@ export interface InputSlots {
}
</script>
<script setup lang="ts">
<script setup lang="ts" generic="T extends AcceptableValue">
import { ref, computed, onMounted } from 'vue'
import { Primitive } from 'reka-ui'
import { useAppConfig } from '#imports'
@@ -74,10 +74,10 @@ const props = withDefaults(defineProps<InputProps>(), {
autocomplete: 'off',
autofocusDelay: 0
})
const emits = defineEmits<InputEmits>()
const emits = defineEmits<InputEmits<T>>()
const slots = defineSlots<InputSlots>()
const [modelValue, modelModifiers] = defineModel<string | number | null>()
const [modelValue, modelModifiers] = defineModel<T>()
const appConfig = useAppConfig() as Input['AppConfig']
const { emitFormBlur, emitFormInput, emitFormChange, size: formGroupSize, color, id, name, highlight, disabled, emitFormFocus, ariaAttrs } = useFormField<InputProps>(props, { deferInputValidation: true })
@@ -114,7 +114,7 @@ function updateInput(value: string | null) {
value ||= null
}
modelValue.value = value
modelValue.value = value as T
emitFormInput()
}

14
src/runtime/components/Textarea.vue
View File

@@ -3,7 +3,7 @@ import type { AppConfig } from '@nuxt/schema'
import theme from '#build/ui/textarea'
import type { UseComponentIconsProps } from '../composables/useComponentIcons'
import type { AvatarProps } from '../types'
import type { ComponentConfig } from '../types/utils'
import type { AcceptableValue, ComponentConfig } from '../types/utils'
type Textarea = ComponentConfig<typeof theme, AppConfig, 'textarea'>
@@ -43,8 +43,8 @@ export interface TextareaProps extends UseComponentIconsProps {
ui?: Textarea['slots']
}
export interface TextareaEmits {
(e: 'update:modelValue', payload: string | number): void
export interface TextareaEmits<T extends AcceptableValue = AcceptableValue> {
(e: 'update:modelValue', payload: T): void
(e: 'blur', event: FocusEvent): void
(e: 'change', event: Event): void
}
@@ -56,7 +56,7 @@ export interface TextareaSlots {
}
</script>
<script setup lang="ts">
<script setup lang="ts" generic="T extends AcceptableValue">
import { ref, computed, onMounted, nextTick, watch } from 'vue'
import { Primitive } from 'reka-ui'
import { useAppConfig } from '#imports'
@@ -73,10 +73,10 @@ const props = withDefaults(defineProps<TextareaProps>(), {
autofocusDelay: 0,
autoresizeDelay: 0
})
const emits = defineEmits<TextareaEmits<T>>()
const slots = defineSlots<TextareaSlots>()
const emits = defineEmits<TextareaEmits>()
const [modelValue, modelModifiers] = defineModel<string | number | null>()
const [modelValue, modelModifiers] = defineModel<T>()
const appConfig = useAppConfig() as Textarea['AppConfig']
const { emitFormFocus, emitFormBlur, emitFormInput, emitFormChange, size, color, id, name, highlight, disabled, ariaAttrs } = useFormField<TextareaProps>(props, { deferInputValidation: true })
@@ -109,7 +109,7 @@ function updateInput(value: string | null) {
value ||= null
}
modelValue.value = value
modelValue.value = value as T
emitFormInput()
}