@policystudio/policy-studio-ui-vue 1.1.90-beta.78 → 1.1.90-beta.80
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
|
@@ -4,7 +4,7 @@
|
|
|
4
4
|
@apply psui-border psui-border-gray-20 psui-rounded-md psui-flex psui-flex-col psui-items-center psui-justify-center psui-px-3 psui-py-2 psui-cursor-pointer;
|
|
5
5
|
|
|
6
6
|
&-title {
|
|
7
|
-
@apply psui-text-xsmall psui-font-bold psui-text-gray-40 psui-mb-1;
|
|
7
|
+
@apply psui-flex psui-text-xsmall psui-font-bold psui-text-gray-40 psui-mb-1;
|
|
8
8
|
}
|
|
9
9
|
|
|
10
10
|
&-content {
|
|
@@ -4,7 +4,10 @@
|
|
|
4
4
|
@click="onClick()"
|
|
5
5
|
>
|
|
6
6
|
<h5 class="psui-el-card-infos-title">
|
|
7
|
-
<span class="
|
|
7
|
+
<span :class="[titleColor, 'psui-mr-1']">{{ title }}</span>
|
|
8
|
+
<slot name="subtitle">
|
|
9
|
+
<span :class="subtitleColor">{{ subtitle }}</span>
|
|
10
|
+
</slot>
|
|
8
11
|
</h5>
|
|
9
12
|
<div class="psui-el-card-infos-content">
|
|
10
13
|
<span class="psui-el-card-infos-icon material-icons-round">{{ icon }}</span>
|
|
@@ -45,6 +48,20 @@ defineProps({
|
|
|
45
48
|
type: String,
|
|
46
49
|
default: '',
|
|
47
50
|
},
|
|
51
|
+
/**
|
|
52
|
+
* It sets the color class for the title text.
|
|
53
|
+
*/
|
|
54
|
+
titleColor: {
|
|
55
|
+
type: String,
|
|
56
|
+
default: 'psui-text-gray-60',
|
|
57
|
+
},
|
|
58
|
+
/**
|
|
59
|
+
* It sets the color class for the subtitle text.
|
|
60
|
+
*/
|
|
61
|
+
subtitleColor: {
|
|
62
|
+
type: String,
|
|
63
|
+
default: 'psui-text-gray-40',
|
|
64
|
+
},
|
|
48
65
|
})
|
|
49
66
|
|
|
50
67
|
const onClick = () => {
|
|
@@ -7,8 +7,9 @@
|
|
|
7
7
|
@click="toggle"
|
|
8
8
|
>
|
|
9
9
|
<slot
|
|
10
|
-
v-if="
|
|
10
|
+
v-if="hasDropdownTrigger"
|
|
11
11
|
name="dropdownTrigger"
|
|
12
|
+
:show="show"
|
|
12
13
|
/>
|
|
13
14
|
<button
|
|
14
15
|
v-else
|
|
@@ -57,7 +58,7 @@ import {
|
|
|
57
58
|
size
|
|
58
59
|
} from '@floating-ui/vue'
|
|
59
60
|
|
|
60
|
-
import { ref, defineProps } from 'vue'
|
|
61
|
+
import { ref, defineProps, useSlots, computed } from 'vue'
|
|
61
62
|
import Teleport from 'vue2-teleport'
|
|
62
63
|
|
|
63
64
|
const props = defineProps({
|
|
@@ -80,6 +81,12 @@ const props = defineProps({
|
|
|
80
81
|
|
|
81
82
|
const emit = defineEmits(['open', 'close'])
|
|
82
83
|
|
|
84
|
+
const slots = useSlots()
|
|
85
|
+
|
|
86
|
+
const hasDropdownTrigger = computed(() => {
|
|
87
|
+
return !!slots.dropdownTrigger
|
|
88
|
+
})
|
|
89
|
+
|
|
83
90
|
const show = ref(false)
|
|
84
91
|
|
|
85
92
|
const PSDropdownTrigger = ref(null)
|