@redseed/redseed-ui-vue3 6.0.0 → 6.0.2
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
|
@@ -40,6 +40,10 @@ const cardHeaderElement = ref(null)
|
|
|
40
40
|
const { responsiveWidth } = useResponsiveWidth(cardHeaderElement, 640)
|
|
41
41
|
|
|
42
42
|
const emit = defineEmits(['click:more-actions'])
|
|
43
|
+
|
|
44
|
+
function handleMoreActionsClick() {
|
|
45
|
+
emit('click:more-actions')
|
|
46
|
+
}
|
|
43
47
|
</script>
|
|
44
48
|
<template>
|
|
45
49
|
<div ref="cardHeaderElement"
|
|
@@ -113,9 +117,13 @@ const emit = defineEmits(['click:more-actions'])
|
|
|
113
117
|
<div v-if="showMoreActions"
|
|
114
118
|
class="rsui-card-header__more-actions"
|
|
115
119
|
>
|
|
116
|
-
<slot name="more-actions"
|
|
117
|
-
|
|
118
|
-
|
|
120
|
+
<slot name="more-actions"
|
|
121
|
+
:handleMoreActionsClick="handleMoreActionsClick"
|
|
122
|
+
>
|
|
123
|
+
<ButtonTertiary @click="handleMoreActionsClick">
|
|
124
|
+
<slot name="more-actions-label">
|
|
125
|
+
<EllipsisVerticalIcon class="rsui-card-header__more-actions-icon" />
|
|
126
|
+
</slot>
|
|
119
127
|
</ButtonTertiary>
|
|
120
128
|
</slot>
|
|
121
129
|
</div>
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
<script setup>
|
|
2
2
|
import { ref, watch, watchEffect, nextTick, onMounted } from 'vue'
|
|
3
|
-
import {
|
|
3
|
+
import { ChevronDownIcon } from '@heroicons/vue/24/outline'
|
|
4
4
|
import { ButtonTertiary } from '../Button'
|
|
5
5
|
|
|
6
6
|
defineOptions({
|
|
@@ -104,14 +104,14 @@ onMounted(() => {
|
|
|
104
104
|
:full="$attrs.full"
|
|
105
105
|
@click.stop="handleTrigger"
|
|
106
106
|
>
|
|
107
|
-
<
|
|
107
|
+
<ChevronDownIcon
|
|
108
108
|
:class="[
|
|
109
109
|
'rsui-disclosure__trigger-icon',
|
|
110
110
|
{
|
|
111
111
|
'rsui-disclosure__trigger-icon--open': isOpen,
|
|
112
112
|
}
|
|
113
113
|
]"
|
|
114
|
-
></
|
|
114
|
+
></ChevronDownIcon>
|
|
115
115
|
</ButtonTertiary>
|
|
116
116
|
</slot>
|
|
117
117
|
</Teleport>
|
|
@@ -138,7 +138,7 @@ onMounted(() => {
|
|
|
138
138
|
@apply transition-all;
|
|
139
139
|
|
|
140
140
|
&--open {
|
|
141
|
-
@apply rotate-180;
|
|
141
|
+
@apply -rotate-180;
|
|
142
142
|
}
|
|
143
143
|
}
|
|
144
144
|
|
|
@@ -32,6 +32,10 @@ const sectionHeaderElement = ref(null)
|
|
|
32
32
|
const { responsiveWidth } = useResponsiveWidth(sectionHeaderElement, 768)
|
|
33
33
|
|
|
34
34
|
const emit = defineEmits(['click:more-actions'])
|
|
35
|
+
|
|
36
|
+
function handleMoreActionsClick() {
|
|
37
|
+
emit('click:more-actions')
|
|
38
|
+
}
|
|
35
39
|
</script>
|
|
36
40
|
<template>
|
|
37
41
|
<div ref="sectionHeaderElement"
|
|
@@ -79,9 +83,13 @@ const emit = defineEmits(['click:more-actions'])
|
|
|
79
83
|
<div v-if="showMoreActions"
|
|
80
84
|
class="rsui-section-header__more-actions"
|
|
81
85
|
>
|
|
82
|
-
<slot name="more-actions"
|
|
83
|
-
|
|
84
|
-
|
|
86
|
+
<slot name="more-actions"
|
|
87
|
+
:handleMoreActionsClick="handleMoreActionsClick"
|
|
88
|
+
>
|
|
89
|
+
<ButtonTertiary @click="handleMoreActionsClick">
|
|
90
|
+
<slot name="more-actions-label">
|
|
91
|
+
<EllipsisVerticalIcon class="rsui-section-header__more-actions-icon" />
|
|
92
|
+
</slot>
|
|
85
93
|
</ButtonTertiary>
|
|
86
94
|
</slot>
|
|
87
95
|
</div>
|