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

fix(components): ui prop override with class (#136)

Browse Source
This commit is contained in:
Benjamin Canac
2024-07-03 14:35:58 +02:00
committed by GitHub
parent 5a22c62b2a
commit 235556d3e0
50 changed files with 383 additions and 375 deletions
Download Patch File Download Diff File Expand all files Collapse all files

16
src/runtime/components/Checkbox.vue
View File

@@ -74,7 +74,7 @@ const checked = computed({
}
})
const ui = computed(() => tv({ extend: checkbox, slots: props.ui })({
const ui = computed(() => checkbox({
size: size.value,
color: color.value,
required: props.required,
@@ -93,7 +93,7 @@ function onUpdate(value: any) {
<template>
<div :class="ui.root({ class: props.class })">
<div :class="ui.container()">
<div :class="ui.container({ class: props.ui?.container })">
<CheckboxRoot
:id="id"
v-model:checked="checked"
@@ -101,23 +101,23 @@ function onUpdate(value: any) {
v-bind="rootProps"
:name="name"
:disabled="disabled"
:class="ui.base()"
:class="ui.base({ class: props.ui?.base })"
@update:checked="onUpdate"
>
<CheckboxIndicator as-child>
<UIcon v-if="indeterminate" :name="indeterminateIcon || appConfig.ui.icons.minus" :class="ui.icon()" />
<UIcon v-else :name="icon || appConfig.ui.icons.check" :class="ui.icon()" />
<UIcon v-if="indeterminate" :name="indeterminateIcon || appConfig.ui.icons.minus" :class="ui.icon({ class: props.ui?.icon })" />
<UIcon v-else :name="icon || appConfig.ui.icons.check" :class="ui.icon({ class: props.ui?.icon })" />
</CheckboxIndicator>
</CheckboxRoot>
</div>
<div v-if="(label || !!slots.label) || (description || !!slots.description)" :class="ui.wrapper()">
<Label v-if="label || !!slots.label" :for="id" :class="ui.label()">
<div v-if="(label || !!slots.label) || (description || !!slots.description)" :class="ui.wrapper({ class: props.ui?.wrapper })">
<Label v-if="label || !!slots.label" :for="id" :class="ui.label({ class: props.ui?.label })">
<slot name="label" :label="label">
{{ label }}
</slot>
</Label>
<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>