@veritree/ui 0.39.3 → 0.41.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/index.js +79 -69
- package/package.json +1 -1
- package/src/components/Dialog/VTDialog.vue +9 -6
- package/src/components/Dialog/VTDialogContent.vue +10 -1
- package/src/components/Drawer/VTDrawer.vue +9 -1
- package/src/components/Form/VTFieldset.vue +5 -0
- package/src/components/Form/VTForm.vue +9 -1
- package/src/components/Form/VTLegend.vue +5 -0
package/index.js
CHANGED
|
@@ -1,71 +1,76 @@
|
|
|
1
|
-
import VTAlert from
|
|
2
|
-
import VTAvatar from
|
|
3
|
-
import VTAvatarImage from
|
|
4
|
-
import VTAvatarText from
|
|
5
|
-
import VTButton from
|
|
6
|
-
import VTImage from
|
|
7
|
-
import VTImageCounter from
|
|
8
|
-
import VTImageHover from
|
|
9
|
-
import VTDropdownMenu from
|
|
10
|
-
import VTDropdownMenuContent from
|
|
11
|
-
import VTDropdownMenuDivider from
|
|
12
|
-
import VTDropdownMenuGroup from
|
|
13
|
-
import VTDropdownMenuItem from
|
|
14
|
-
import VTDropdownMenuLabel from
|
|
15
|
-
import VTDropdownMenuTrigger from
|
|
16
|
-
import VTPopover from
|
|
17
|
-
import VTPopoverContent from
|
|
18
|
-
import VTPopoverDivider from
|
|
19
|
-
import VTPopoverGroup from
|
|
20
|
-
import VTPopoverItem from
|
|
21
|
-
import VTPopoverTrigger from
|
|
22
|
-
import
|
|
23
|
-
import
|
|
24
|
-
import
|
|
25
|
-
import
|
|
26
|
-
import
|
|
27
|
-
import
|
|
28
|
-
import
|
|
29
|
-
import
|
|
30
|
-
import
|
|
31
|
-
import
|
|
32
|
-
import
|
|
33
|
-
import
|
|
34
|
-
import
|
|
35
|
-
import
|
|
36
|
-
import
|
|
37
|
-
import
|
|
38
|
-
import
|
|
39
|
-
import
|
|
40
|
-
import
|
|
41
|
-
import
|
|
42
|
-
import
|
|
43
|
-
import
|
|
44
|
-
import
|
|
45
|
-
import
|
|
46
|
-
import
|
|
47
|
-
import
|
|
48
|
-
import
|
|
49
|
-
import
|
|
50
|
-
import
|
|
51
|
-
import
|
|
52
|
-
import
|
|
53
|
-
import
|
|
54
|
-
import
|
|
55
|
-
import
|
|
56
|
-
import
|
|
57
|
-
import
|
|
58
|
-
import
|
|
59
|
-
import
|
|
60
|
-
import
|
|
61
|
-
import
|
|
62
|
-
import
|
|
63
|
-
import
|
|
64
|
-
import
|
|
65
|
-
import
|
|
66
|
-
import
|
|
67
|
-
import
|
|
68
|
-
import
|
|
1
|
+
import VTAlert from './src/components/Alert/VTAlert.vue';
|
|
2
|
+
import VTAvatar from './src/components/Avatar/VTAvatar.vue';
|
|
3
|
+
import VTAvatarImage from './src/components/Avatar/VTAvatarImage.vue';
|
|
4
|
+
import VTAvatarText from './src/components/Avatar/VTAvatarText.vue';
|
|
5
|
+
import VTButton from './src/components/Button/VTButton.vue';
|
|
6
|
+
import VTImage from './src/components/Image/VTImage.vue';
|
|
7
|
+
import VTImageCounter from './src/components/Image/VTImageCounter.vue';
|
|
8
|
+
import VTImageHover from './src/components/Image/VTImageHover.vue';
|
|
9
|
+
import VTDropdownMenu from './src/components/DropdownMenu/VTDropdownMenu.vue';
|
|
10
|
+
import VTDropdownMenuContent from './src/components/DropdownMenu/VTDropdownMenuContent.vue';
|
|
11
|
+
import VTDropdownMenuDivider from './src/components/DropdownMenu/VTDropdownMenuDivider.vue';
|
|
12
|
+
import VTDropdownMenuGroup from './src/components/DropdownMenu/VTDropdownMenuGroup.vue';
|
|
13
|
+
import VTDropdownMenuItem from './src/components/DropdownMenu/VTDropdownMenuItem.vue';
|
|
14
|
+
import VTDropdownMenuLabel from './src/components/DropdownMenu/VTDropdownMenuLabel.vue';
|
|
15
|
+
import VTDropdownMenuTrigger from './src/components/DropdownMenu/VTDropdownMenuTrigger.vue';
|
|
16
|
+
import VTPopover from './src/components/Popover/VTPopover.vue';
|
|
17
|
+
import VTPopoverContent from './src/components/Popover/VTPopoverContent.vue';
|
|
18
|
+
import VTPopoverDivider from './src/components/Popover/VTPopoverDivider.vue';
|
|
19
|
+
import VTPopoverGroup from './src/components/Popover/VTPopoverGroup.vue';
|
|
20
|
+
import VTPopoverItem from './src/components/Popover/VTPopoverItem.vue';
|
|
21
|
+
import VTPopoverTrigger from './src/components/Popover/VTPopoverTrigger.vue';
|
|
22
|
+
import VTForm from './src/components/Form/VTForm.vue';
|
|
23
|
+
import VTFormRow from './src/components/Form/VTFormRow.vue';
|
|
24
|
+
import VTFormCol from './src/components/Form/VTFormCol.vue';
|
|
25
|
+
import VTFieldset from './src/components/Form/VTFieldset.vue';
|
|
26
|
+
import VTLegend from './src/components/Form/VTLegend.vue';
|
|
27
|
+
import VTFormFeedback from './src/components/Form/VTFormFeedback.vue';
|
|
28
|
+
import VTFormGroup from './src/components/Form/VTFormGroup.vue';
|
|
29
|
+
import VTInput from './src/components/Form/VTInput.vue';
|
|
30
|
+
import VTInputIcon from './src/components/Form/VTInputIcon.vue';
|
|
31
|
+
import VTInputPassword from './src/components/Form/VTInputPassword.vue';
|
|
32
|
+
import VTListbox from './src/components/Listbox/VTListbox.vue';
|
|
33
|
+
import VTListboxContent from './src/components/Listbox/VTListboxContent.vue';
|
|
34
|
+
import VTListboxItem from './src/components/Listbox/VTListboxItem.vue';
|
|
35
|
+
import VTListboxLabel from './src/components/Listbox/VTListboxLabel.vue';
|
|
36
|
+
import VTListboxList from './src/components/Listbox/VTListboxList.vue';
|
|
37
|
+
import VTListboxSearch from './src/components/Listbox/VTListboxSearch.vue';
|
|
38
|
+
import VTListboxTrigger from './src/components/Listbox/VTListboxTrigger.vue';
|
|
39
|
+
import VTSpinner from './src/components/Spinner/VTSpinner.vue';
|
|
40
|
+
import VTInputDate from './src/components/Input/VTInputDate.vue';
|
|
41
|
+
import VTInputFile from './src/components/Input/VTInputFile.vue';
|
|
42
|
+
import VTInputUpload from './src/components/Input/VTInputUpload.vue';
|
|
43
|
+
import VTProgressBar from './src/components/ProgressBar/VTProgressBar.vue';
|
|
44
|
+
import VTTextarea from './src/components/Textarea/VTTextarea.vue';
|
|
45
|
+
import VTModal from './src/components/Modal/VTModal.vue';
|
|
46
|
+
import VTTab from './src/components/Tabs/VTTab.vue';
|
|
47
|
+
import VTTabGroup from './src/components/Tabs/VTTabGroup.vue';
|
|
48
|
+
import VTTabList from './src/components/Tabs/VTTabList.vue';
|
|
49
|
+
import VTTabPanel from './src/components/Tabs/VTTabPanel.vue';
|
|
50
|
+
import VTTabPanels from './src/components/Tabs/VTTabPanels.vue';
|
|
51
|
+
import VTDialog from './src/components/Dialog/VTDialog.vue';
|
|
52
|
+
import VTDialogClose from './src/components/Dialog/VTDialogClose.vue';
|
|
53
|
+
import VTDialogContent from './src/components/Dialog/VTDialogContent.vue';
|
|
54
|
+
import VTDialogFooter from './src/components/Dialog/VTDialogFooter.vue';
|
|
55
|
+
import VTDialogHeader from './src/components/Dialog/VTDialogHeader.vue';
|
|
56
|
+
import VTDialogMain from './src/components/Dialog/VTDialogMain.vue';
|
|
57
|
+
import VTDialogOverlay from './src/components/Dialog/VTDialogOverlay.vue';
|
|
58
|
+
import VTDialogTitle from './src/components/Dialog/VTDialogTitle.vue';
|
|
59
|
+
import VTDrawer from './src/components/Drawer/VTDrawer.vue';
|
|
60
|
+
import VTDrawerClose from './src/components/Drawer/VTDrawerClose.vue';
|
|
61
|
+
import VTDrawerContent from './src/components/Drawer/VTDrawerContent.vue';
|
|
62
|
+
import VTDrawerFooter from './src/components/Drawer/VTDrawerFooter.vue';
|
|
63
|
+
import VTDrawerHeader from './src/components/Drawer/VTDrawerHeader.vue';
|
|
64
|
+
import VTDrawerTitle from './src/components/Drawer/VTDrawerTitle.vue';
|
|
65
|
+
import VTDrawerMain from './src/components/Drawer/VTDrawerMain.vue';
|
|
66
|
+
import VTDrawerOverlay from './src/components/Drawer/VTDrawerOverlay.vue';
|
|
67
|
+
import VTDisclosure from './src/components/Disclosure/VTDisclosure.vue';
|
|
68
|
+
import VTDisclosureDetails from './src/components/Disclosure/VTDisclosureDetails.vue';
|
|
69
|
+
import VTDisclosureHeader from './src/components/Disclosure/VTDisclosureHeader.vue';
|
|
70
|
+
import VTDisclosureIcon from './src/components/Disclosure/VTDisclosureIcon.vue';
|
|
71
|
+
import VTDisclosureContent from './src/components/Disclosure/VTDisclosureContent.vue';
|
|
72
|
+
import VTSkeleton from './src/components/Skeleton/VTSkeleton.vue';
|
|
73
|
+
import VTSkeletonItem from './src/components/Skeleton/VTSkeletonItem.vue';
|
|
69
74
|
|
|
70
75
|
export {
|
|
71
76
|
VTAvatar,
|
|
@@ -89,8 +94,13 @@ export {
|
|
|
89
94
|
VTPopoverGroup,
|
|
90
95
|
VTPopoverItem,
|
|
91
96
|
VTPopoverTrigger,
|
|
97
|
+
VTForm,
|
|
98
|
+
VTFormCol,
|
|
92
99
|
VTFormFeedback,
|
|
93
100
|
VTFormGroup,
|
|
101
|
+
VTFormRow,
|
|
102
|
+
VTFieldset,
|
|
103
|
+
VTLegend,
|
|
94
104
|
VTListbox,
|
|
95
105
|
VTListboxContent,
|
|
96
106
|
VTListboxItem,
|
|
@@ -135,5 +145,5 @@ export {
|
|
|
135
145
|
VTDisclosureIcon,
|
|
136
146
|
VTDisclosureContent,
|
|
137
147
|
VTSkeleton,
|
|
138
|
-
VTSkeletonItem
|
|
148
|
+
VTSkeletonItem,
|
|
139
149
|
};
|
package/package.json
CHANGED
|
@@ -46,15 +46,14 @@ export default {
|
|
|
46
46
|
|
|
47
47
|
const emit = () => this.emit();
|
|
48
48
|
|
|
49
|
-
const full = this.full;
|
|
50
|
-
|
|
51
49
|
return {
|
|
52
50
|
componentId,
|
|
53
51
|
hide,
|
|
54
52
|
emit,
|
|
55
53
|
registerContent,
|
|
56
54
|
registerOverlay,
|
|
57
|
-
full,
|
|
55
|
+
full: this.full,
|
|
56
|
+
type: this.type,
|
|
58
57
|
};
|
|
59
58
|
},
|
|
60
59
|
};
|
|
@@ -65,14 +64,18 @@ export default {
|
|
|
65
64
|
},
|
|
66
65
|
|
|
67
66
|
props: {
|
|
68
|
-
|
|
67
|
+
headless: {
|
|
69
68
|
type: Boolean,
|
|
70
69
|
default: false,
|
|
71
70
|
},
|
|
72
|
-
|
|
71
|
+
visible: {
|
|
73
72
|
type: Boolean,
|
|
74
73
|
default: false,
|
|
75
74
|
},
|
|
75
|
+
type: {
|
|
76
|
+
type: String,
|
|
77
|
+
default: null, // null or static: when set to static, the dialog will not close when clicking outside it or on esc.
|
|
78
|
+
},
|
|
76
79
|
full: {
|
|
77
80
|
type: Boolean,
|
|
78
81
|
default: false,
|
|
@@ -136,7 +139,7 @@ export default {
|
|
|
136
139
|
*/
|
|
137
140
|
onClick(ev) {
|
|
138
141
|
if (!ev || ev.target.id !== this.overlay?.id) return;
|
|
139
|
-
this.hide();
|
|
142
|
+
if (this.type !== 'static') this.hide();
|
|
140
143
|
},
|
|
141
144
|
},
|
|
142
145
|
};
|
|
@@ -17,7 +17,7 @@
|
|
|
17
17
|
: `relative m-auto flex flex-col overflow-auto rounded bg-white p-4 focus:outline-none lg:p-6 ${classes}`
|
|
18
18
|
"
|
|
19
19
|
tabindex="-1"
|
|
20
|
-
@keydown.esc.stop="
|
|
20
|
+
@keydown.esc.stop="onEsc"
|
|
21
21
|
>
|
|
22
22
|
<slot></slot>
|
|
23
23
|
</div>
|
|
@@ -55,6 +55,10 @@ export default {
|
|
|
55
55
|
full() {
|
|
56
56
|
return this.apiDialog().full;
|
|
57
57
|
},
|
|
58
|
+
|
|
59
|
+
type() {
|
|
60
|
+
return this.apiDialog().type;
|
|
61
|
+
},
|
|
58
62
|
},
|
|
59
63
|
|
|
60
64
|
mounted() {
|
|
@@ -65,6 +69,11 @@ export default {
|
|
|
65
69
|
},
|
|
66
70
|
|
|
67
71
|
methods: {
|
|
72
|
+
onEsc() {
|
|
73
|
+
if (this.type === 'static') return;
|
|
74
|
+
this.hide();
|
|
75
|
+
},
|
|
76
|
+
|
|
68
77
|
show() {
|
|
69
78
|
this.visible = true;
|
|
70
79
|
},
|
|
@@ -3,7 +3,11 @@
|
|
|
3
3
|
<div
|
|
4
4
|
v-if="visible"
|
|
5
5
|
:id="id"
|
|
6
|
-
:class="{
|
|
6
|
+
:class="{
|
|
7
|
+
Drawer: headless,
|
|
8
|
+
'fixed inset-0 z-50 h-screen': !headless,
|
|
9
|
+
[drawerClass]: true,
|
|
10
|
+
}"
|
|
7
11
|
aria-modal="true"
|
|
8
12
|
@click="onClick"
|
|
9
13
|
>
|
|
@@ -86,6 +90,10 @@ export default {
|
|
|
86
90
|
type: String,
|
|
87
91
|
default: 'full',
|
|
88
92
|
},
|
|
93
|
+
drawerClass: {
|
|
94
|
+
type: String,
|
|
95
|
+
default: '',
|
|
96
|
+
},
|
|
89
97
|
},
|
|
90
98
|
|
|
91
99
|
data() {
|