Niklas/shadcn-vue
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merge a7f0f7eff2 into 3eaef4a748

Browse Source
This commit is contained in:
Damir 2024-12-18 04:13:27 +00:00 committed by GitHub
commit a2cc70b85d
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 46 additions and 8 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

27
apps/www/src/lib/registry/default/ui/form/FormControl.vue
View File

@ -1,16 +1,35 @@
<script lang="ts" setup>
import { Slot } from 'radix-vue'
import { useFormField } from './useFormField'
import { Slot } from 'radix-vue';
import { useFormField } from './useFormField';
const { error, formItemId, formDescriptionId, formMessageId } = useFormField()
const props = defineProps<{
label?: string;
description?: string;
}>();
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
</script>
<template>
<FormLabel v-if="props.label">{{ props.label }}</FormLabel>
<Slot
:id="formItemId"
:aria-describedby="!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`"
:aria-describedby="
!error
? `${formDescriptionId}`
: props.description
? `${formMessageId}`
: `${formDescriptionId} ${formMessageId}`
"
:aria-invalid="!!error"
>
<slot />
</Slot>
<FormDescription v-if="props.description && !error">
{{ props.description }}
</FormDescription>
<FormMessage v-if="props.description" />
</template>

27
apps/www/src/lib/registry/new-york/ui/form/FormControl.vue
View File

@ -1,16 +1,35 @@
<script lang="ts" setup>
import { Slot } from 'radix-vue'
import { useFormField } from './useFormField'
import { Slot } from 'radix-vue';
import { useFormField } from './useFormField';
const { error, formItemId, formDescriptionId, formMessageId } = useFormField()
const props = defineProps<{
label?: string;
description?: string;
}>();
const { error, formItemId, formDescriptionId, formMessageId } = useFormField();
</script>
<template>
<FormLabel v-if="props.label">{{ props.label }}</FormLabel>
<Slot
:id="formItemId"
:aria-describedby="!error ? `${formDescriptionId}` : `${formDescriptionId} ${formMessageId}`"
:aria-describedby="
!error
? `${formDescriptionId}`
: props.description
? `${formMessageId}`
: `${formDescriptionId} ${formMessageId}`
"
:aria-invalid="!!error"
>
<slot />
</Slot>
<FormDescription v-if="props.description && !error">
{{ props.description }}
</FormDescription>
<FormMessage v-if="props.description" />
</template>