@redseed/redseed-ui-vue3 8.67.0 → 8.68.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
<script setup>
|
|
2
|
-
import { ref, watch } from 'vue'
|
|
2
|
+
import { computed, ref, useSlots, watch } from 'vue'
|
|
3
3
|
import Card from './Card.vue'
|
|
4
4
|
import CardHeader from './CardHeader.vue'
|
|
5
5
|
import FormFieldCheckbox from '../FormField/FormFieldCheckbox.vue'
|
|
@@ -31,6 +31,14 @@ const props = defineProps({
|
|
|
31
31
|
|
|
32
32
|
const emit = defineEmits(['check', 'uncheck', 'change'])
|
|
33
33
|
|
|
34
|
+
const slots = useSlots()
|
|
35
|
+
|
|
36
|
+
// Whether anything renders BELOW the header. When nothing does, the card is header-only
|
|
37
|
+
// and the header has to pay its own bottom padding — it is styled `pb-0` and normally
|
|
38
|
+
// borrows its bottom edge from the body's padding, so without this a title-only card sits
|
|
39
|
+
// flush against its own border.
|
|
40
|
+
const hasBody = computed(() => Boolean(slots.default || slots.meta))
|
|
41
|
+
|
|
34
42
|
const isChecked = ref(props.checked)
|
|
35
43
|
|
|
36
44
|
watch(() => props.checked, (val) => {
|
|
@@ -66,6 +74,7 @@ function onFieldInput() {
|
|
|
66
74
|
:showMoreActions="showMoreActions"
|
|
67
75
|
:showDivider="false"
|
|
68
76
|
:singleLine="false"
|
|
77
|
+
:headerOnlyCard="!hasBody"
|
|
69
78
|
>
|
|
70
79
|
<div class="rsui-checkbox-card__title-row">
|
|
71
80
|
<div class="rsui-checkbox-card__field">
|
|
@@ -102,7 +111,13 @@ function onFieldInput() {
|
|
|
102
111
|
</CardHeader>
|
|
103
112
|
</template>
|
|
104
113
|
|
|
105
|
-
<slot
|
|
114
|
+
<!-- v-if, not a bare <slot>. Card already guards its body with
|
|
115
|
+
`v-if="$slots.default || $slots.meta"`, but a bare <slot> here counts as a default
|
|
116
|
+
slot whether or not the consumer filled it, so that guard could never fire and a
|
|
117
|
+
title-only task card still rendered an empty padded body. -->
|
|
118
|
+
<template #default v-if="$slots.default">
|
|
119
|
+
<slot></slot>
|
|
120
|
+
</template>
|
|
106
121
|
|
|
107
122
|
<template #meta v-if="$slots.meta">
|
|
108
123
|
<slot name="meta"></slot>
|