mirror of
https://github.com/ArthurDanjou/ui.git
synced 2026-01-14 12:14:41 +01:00
fix(components): ui prop override with class (#136)
This commit is contained in:
@@ -44,7 +44,7 @@ import type { FormError } from '../types/form'
|
||||
const props = defineProps<FormFieldProps>()
|
||||
const slots = defineSlots<FormFieldSlots>()
|
||||
|
||||
const ui = computed(() => tv({ extend: formField, slots: props.ui })({
|
||||
const ui = computed(() => formField({
|
||||
size: props.size,
|
||||
required: props.required
|
||||
}))
|
||||
@@ -72,21 +72,21 @@ provide(formFieldInjectionKey, computed(() => ({
|
||||
|
||||
<template>
|
||||
<div :class="ui.root({ class: props.class })">
|
||||
<div :class="ui.wrapper()">
|
||||
<div v-if="label || !!slots.label" :class="ui.labelWrapper()">
|
||||
<Label :for="id" :class="ui.label()">
|
||||
<div :class="ui.wrapper({ class: props.ui?.wrapper })">
|
||||
<div v-if="label || !!slots.label" :class="ui.labelWrapper({ class: props.ui?.labelWrapper })">
|
||||
<Label :for="id" :class="ui.label({ class: props.ui?.label })">
|
||||
<slot name="label" :label="label">
|
||||
{{ label }}
|
||||
</slot>
|
||||
</Label>
|
||||
<span v-if="hint || !!slots.hint" :class="ui.hint()">
|
||||
<span v-if="hint || !!slots.hint" :class="ui.hint({ class: props.ui?.hint })">
|
||||
<slot name="hint" :hint="hint">
|
||||
{{ hint }}
|
||||
</slot>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<p v-if="description || !!slots.description" :class="ui.description()">
|
||||
<p v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
|
||||
<slot name="description" :description="description">
|
||||
{{ description }}
|
||||
</slot>
|
||||
@@ -96,12 +96,12 @@ provide(formFieldInjectionKey, computed(() => ({
|
||||
<div :class="[label && ui.container()]">
|
||||
<slot :error="error" />
|
||||
|
||||
<p v-if="(typeof error === 'string' && error) || !!slots.error" :class="ui.error()">
|
||||
<p v-if="(typeof error === 'string' && error) || !!slots.error" :class="ui.error({ class: props.ui?.error })">
|
||||
<slot name="error" :error="error">
|
||||
{{ error }}
|
||||
</slot>
|
||||
</p>
|
||||
<p v-else-if="help || !!slots.help" :class="ui.help()">
|
||||
<p v-else-if="help || !!slots.help" :class="ui.help({ class: props.ui?.help })">
|
||||
<slot name="help" :help="help">
|
||||
{{ help }}
|
||||
</slot>
|
||||
|
||||
Reference in New Issue
Block a user