arthur/ui
1
0
Fork 0
mirror of https://github.com/ArthurDanjou/ui.git synced 2026-01-21 23:40:39 +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

20
src/runtime/components/Modal.vue
View File

@@ -48,7 +48,7 @@ export interface ModalSlots {
header(props?: {}): any
title(props?: {}): any
description(props?: {}): any
close(props: { class: string }): any
close(props: { ui: any }): any
body(props?: {}): any
footer(props?: {}): any
}
@@ -85,7 +85,7 @@ const contentEvents = computed(() => {
const appConfig = useAppConfig()
const ui = computed(() => tv({ extend: modal, slots: props.ui })({
const ui = computed(() => modal({
transition: props.transition,
fullscreen: props.fullscreen
}))
@@ -98,26 +98,26 @@ const ui = computed(() => tv({ extend: modal, slots: props.ui })({
</DialogTrigger>
<DialogPortal :disabled="!portal">
<DialogOverlay v-if="overlay" :class="ui.overlay()" />
<DialogOverlay v-if="overlay" :class="ui.overlay({ class: props.ui?.overlay })" />
<DialogContent :class="ui.content({ class: props.class })" v-bind="contentProps" v-on="contentEvents">
<slot name="content">
<div v-if="!!slots.header || (title || !!slots.title) || (description || !!slots.description) || (close || !!slots.close)" :class="ui.header()">
<div v-if="!!slots.header || (title || !!slots.title) || (description || !!slots.description) || (close || !!slots.close)" :class="ui.header({ class: props.ui?.header })">
<slot name="header">
<DialogTitle v-if="title || !!slots.title" :class="ui.title()">
<DialogTitle v-if="title || !!slots.title" :class="ui.title({ class: props.ui?.title })">
<slot name="title">
{{ title }}
</slot>
</DialogTitle>
<DialogDescription v-if="description || !!slots.description" :class="ui.description()">
<DialogDescription v-if="description || !!slots.description" :class="ui.description({ class: props.ui?.description })">
<slot name="description">
{{ description }}
</slot>
</DialogDescription>
<DialogClose as-child>
<slot name="close" :class="ui.close()">
<slot name="close" :ui="ui">
<UButton
v-if="close"
:icon="closeIcon || appConfig.ui.icons.close"
@@ -126,18 +126,18 @@ const ui = computed(() => tv({ extend: modal, slots: props.ui })({
variant="ghost"
aria-label="Close"
v-bind="typeof close === 'object' ? close : undefined"
:class="ui.close()"
:class="ui.close({ class: props.ui?.close })"
/>
</slot>
</DialogClose>
</slot>
</div>
<div v-if="!!slots.body" :class="ui.body()">
<div v-if="!!slots.body" :class="ui.body({ class: props.ui?.body })">
<slot name="body" />
</div>
<div v-if="!!slots.footer" :class="ui.footer()">
<div v-if="!!slots.footer" :class="ui.footer({ class: props.ui?.footer })">
<slot name="footer" />
</div>
</slot>