@volverjs/ui-vue 0.0.11 → 0.0.13-beta.1
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/bin/icons.js +1 -93
- package/dist/components/VvAccordion/VvAccordion.es.js +1 -366
- package/dist/components/VvAccordion/VvAccordion.vue.d.ts +7 -2
- package/dist/components/VvAccordionGroup/VvAccordionGroup.es.js +2 -702
- package/dist/components/VvAccordionGroup/VvAccordionGroup.vue.d.ts +5 -2
- package/dist/components/VvAction/VvAction.es.js +1 -302
- package/dist/components/VvAction/VvAction.umd.js +1 -1
- package/dist/components/VvAction/VvAction.vue.d.ts +3 -2
- package/dist/components/VvAlert/VvAlert.es.js +1 -527
- package/dist/components/VvAlert/VvAlert.vue.d.ts +3 -2
- package/dist/components/VvAlertGroup/VvAlertGroup.es.js +1 -730
- package/dist/components/VvAlertGroup/VvAlertGroup.vue.d.ts +3 -3
- package/dist/components/VvAvatar/VvAvatar.es.js +1 -132
- package/dist/components/VvAvatar/VvAvatar.vue.d.ts +2 -2
- package/dist/components/VvAvatarGroup/VvAvatarGroup.es.js +1 -250
- package/dist/components/VvAvatarGroup/VvAvatarGroup.vue.d.ts +2 -2
- package/dist/components/VvBadge/VvBadge.es.js +1 -131
- package/dist/components/VvBadge/VvBadge.vue.d.ts +2 -2
- package/dist/components/VvBreadcrumb/VvBreadcrumb.es.js +1 -410
- package/dist/components/VvBreadcrumb/VvBreadcrumb.umd.js +1 -1
- package/dist/components/VvBreadcrumb/VvBreadcrumb.vue.d.ts +2 -2
- package/dist/components/VvButton/VvButton.es.js +1 -882
- package/dist/components/VvButton/VvButton.umd.js +1 -1
- package/dist/components/VvButton/VvButton.vue.d.ts +3 -2
- package/dist/components/VvButtonGroup/VvButtonGroup.es.js +1 -214
- package/dist/components/VvButtonGroup/VvButtonGroup.vue.d.ts +2 -2
- package/dist/components/VvCard/VvCard.es.js +1 -152
- package/dist/components/VvCard/VvCard.vue.d.ts +2 -2
- package/dist/components/VvCheckbox/VvCheckbox.es.js +1 -741
- package/dist/components/VvCheckbox/VvCheckbox.vue.d.ts +2 -2
- package/dist/components/VvCheckboxGroup/VvCheckboxGroup.es.js +1 -981
- package/dist/components/VvCheckboxGroup/VvCheckboxGroup.vue.d.ts +2 -2
- package/dist/components/VvCombobox/VvCombobox.es.js +1 -3463
- package/dist/components/VvCombobox/VvCombobox.umd.js +1 -1
- package/dist/components/VvCombobox/VvCombobox.vue.d.ts +16 -7
- package/dist/components/VvDialog/VvDialog.es.js +1 -317
- package/dist/components/VvDialog/VvDialog.vue.d.ts +4 -2
- package/dist/components/VvDropdown/VvDropdown.es.js +1 -750
- package/dist/components/VvDropdown/VvDropdown.vue.d.ts +14 -2
- package/dist/components/VvDropdown/VvDropdownAction.vue.d.ts +2 -2
- package/dist/components/VvDropdown/VvDropdownItem.vue.d.ts +2 -2
- package/dist/components/VvDropdown/VvDropdownOptgroup.vue.d.ts +11 -4
- package/dist/components/VvDropdown/VvDropdownOption.vue.d.ts +2 -2
- package/dist/components/VvDropdownAction/VvDropdownAction.es.js +1 -448
- package/dist/components/VvDropdownAction/VvDropdownAction.umd.js +1 -1
- package/dist/components/VvDropdownItem/VvDropdownItem.es.js +1 -149
- package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.es.js +1 -104
- package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.umd.js +1 -1
- package/dist/components/VvDropdownOption/VvDropdownOption.es.js +1 -281
- package/dist/components/VvIcon/VvIcon.es.js +1 -143
- package/dist/components/VvIcon/VvIcon.vue.d.ts +2 -2
- package/dist/components/VvInputFile/VvInputFile.es.js +1 -1704
- package/dist/components/VvInputFile/VvInputFile.umd.js +1 -1
- package/dist/components/VvInputFile/VvInputFile.vue.d.ts +34 -4
- package/dist/components/VvInputFile/index.d.ts +7 -0
- package/dist/components/VvInputText/VvInputText.es.js +4 -2790
- package/dist/components/VvInputText/VvInputText.umd.js +1 -1
- package/dist/components/VvInputText/VvInputText.vue.d.ts +8 -3
- package/dist/components/VvNav/VvNav.es.js +1 -438
- package/dist/components/VvNav/VvNav.umd.js +1 -1
- package/dist/components/VvNav/VvNav.vue.d.ts +2 -2
- package/dist/components/VvNav/VvNavItem.vue.d.ts +2 -2
- package/dist/components/VvNav/VvNavSeparator.vue.d.ts +1 -1
- package/dist/components/VvNavItem/VvNavItem.es.js +1 -337
- package/dist/components/VvNavItem/VvNavItem.umd.js +1 -1
- package/dist/components/VvNavSeparator/VvNavSeparator.es.js +1 -24
- package/dist/components/VvProgress/VvProgress.es.js +1 -163
- package/dist/components/VvProgress/VvProgress.vue.d.ts +2 -2
- package/dist/components/VvRadio/VvRadio.es.js +1 -661
- package/dist/components/VvRadio/VvRadio.vue.d.ts +2 -2
- package/dist/components/VvRadioGroup/VvRadioGroup.es.js +1 -901
- package/dist/components/VvRadioGroup/VvRadioGroup.vue.d.ts +2 -2
- package/dist/components/VvSelect/VvSelect.es.js +1 -1103
- package/dist/components/VvSelect/VvSelect.vue.d.ts +11 -7
- package/dist/components/VvTab/VvTab.es.js +1 -558
- package/dist/components/VvTab/VvTab.umd.js +1 -1
- package/dist/components/VvTab/VvTab.vue.d.ts +2 -2
- package/dist/components/VvTextarea/VvTextarea.es.js +2 -1989
- package/dist/components/VvTextarea/VvTextarea.vue.d.ts +3 -3
- package/dist/components/VvTooltip/VvTooltip.es.js +1 -154
- package/dist/components/VvTooltip/VvTooltip.vue.d.ts +2 -2
- package/dist/components/index.es.js +6 -8558
- package/dist/components/index.umd.js +1 -1
- package/dist/composables/index.es.js +2 -247
- package/dist/composables/index.umd.js +1 -1
- package/dist/directives/index.es.js +2 -311
- package/dist/directives/index.umd.js +1 -1
- package/dist/directives/v-contextmenu.es.js +2 -142
- package/dist/directives/v-contextmenu.umd.js +1 -1
- package/dist/directives/v-tooltip.es.js +1 -172
- package/dist/icons.es.js +1 -39
- package/dist/icons.umd.js +1 -1
- package/dist/index.es.js +1 -219
- package/dist/props/index.d.ts +7 -0
- package/dist/resolvers/unplugin.es.js +1 -187
- package/dist/stories/AccordionGroup/AccordionGroupSlots.stories.d.ts +2 -2
- package/dist/stories/Avatar/Avatar.settings.d.ts +1 -1
- package/package.json +47 -40
|
@@ -1,149 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
import "mitt";
|
|
3
|
-
import { useElementHover, useFocus, useFocusWithin } from "@vueuse/core";
|
|
4
|
-
var StorageType = /* @__PURE__ */ ((StorageType2) => {
|
|
5
|
-
StorageType2["local"] = "local";
|
|
6
|
-
StorageType2["session"] = "session";
|
|
7
|
-
return StorageType2;
|
|
8
|
-
})(StorageType || {});
|
|
9
|
-
var Side = /* @__PURE__ */ ((Side2) => {
|
|
10
|
-
Side2["left"] = "left";
|
|
11
|
-
Side2["right"] = "right";
|
|
12
|
-
Side2["top"] = "top";
|
|
13
|
-
Side2["bottom"] = "bottom";
|
|
14
|
-
return Side2;
|
|
15
|
-
})(Side || {});
|
|
16
|
-
var Position = /* @__PURE__ */ ((Position2) => {
|
|
17
|
-
Position2["before"] = "before";
|
|
18
|
-
Position2["after"] = "after";
|
|
19
|
-
return Position2;
|
|
20
|
-
})(Position || {});
|
|
21
|
-
var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
|
|
22
|
-
ButtonType2["button"] = "button";
|
|
23
|
-
ButtonType2["submit"] = "submit";
|
|
24
|
-
ButtonType2["reset"] = "reset";
|
|
25
|
-
return ButtonType2;
|
|
26
|
-
})(ButtonType || {});
|
|
27
|
-
var ActionTag = /* @__PURE__ */ ((ActionTag2) => {
|
|
28
|
-
ActionTag2["nuxtLink"] = "nuxt-link";
|
|
29
|
-
ActionTag2["routerLink"] = "router-link";
|
|
30
|
-
ActionTag2["a"] = "a";
|
|
31
|
-
ActionTag2["button"] = "button";
|
|
32
|
-
return ActionTag2;
|
|
33
|
-
})(ActionTag || {});
|
|
34
|
-
var ActionRoles = /* @__PURE__ */ ((ActionRoles2) => {
|
|
35
|
-
ActionRoles2["button"] = "button";
|
|
36
|
-
ActionRoles2["link"] = "link";
|
|
37
|
-
ActionRoles2["menuitem"] = "menuitem";
|
|
38
|
-
return ActionRoles2;
|
|
39
|
-
})(ActionRoles || {});
|
|
40
|
-
var DropdownRole = /* @__PURE__ */ ((DropdownRole2) => {
|
|
41
|
-
DropdownRole2["listbox"] = "listbox";
|
|
42
|
-
DropdownRole2["menu"] = "menu";
|
|
43
|
-
return DropdownRole2;
|
|
44
|
-
})(DropdownRole || {});
|
|
45
|
-
const INJECTION_KEY_DROPDOWN_ITEM = Symbol.for(
|
|
46
|
-
"dropdownItem"
|
|
47
|
-
);
|
|
48
|
-
const INJECTION_KEY_DROPDOWN_ACTION = Symbol.for(
|
|
49
|
-
"dropdownAction"
|
|
50
|
-
);
|
|
51
|
-
({
|
|
52
|
-
/**
|
|
53
|
-
* VvIcon position
|
|
54
|
-
*/
|
|
55
|
-
iconPosition: {
|
|
56
|
-
default: Position.before
|
|
57
|
-
}
|
|
58
|
-
});
|
|
59
|
-
({
|
|
60
|
-
/**
|
|
61
|
-
* Dropdown placement
|
|
62
|
-
*/
|
|
63
|
-
placement: {
|
|
64
|
-
default: Side.bottom
|
|
65
|
-
}
|
|
66
|
-
});
|
|
67
|
-
({
|
|
68
|
-
/**
|
|
69
|
-
* Button type
|
|
70
|
-
*/
|
|
71
|
-
type: {
|
|
72
|
-
default: ButtonType.button
|
|
73
|
-
},
|
|
74
|
-
/**
|
|
75
|
-
* Default tag for the action
|
|
76
|
-
*/
|
|
77
|
-
defaultTag: {
|
|
78
|
-
default: ActionTag.button
|
|
79
|
-
}
|
|
80
|
-
});
|
|
81
|
-
({
|
|
82
|
-
storageType: {
|
|
83
|
-
default: StorageType.local
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
({
|
|
87
|
-
/**
|
|
88
|
-
* Dropdown role
|
|
89
|
-
*/
|
|
90
|
-
role: {
|
|
91
|
-
default: DropdownRole.menu
|
|
92
|
-
}
|
|
93
|
-
});
|
|
94
|
-
const VvDropdownItemProps = {
|
|
95
|
-
focusOnHover: {
|
|
96
|
-
type: Boolean,
|
|
97
|
-
default: false
|
|
98
|
-
}
|
|
99
|
-
};
|
|
100
|
-
function useInjectedDropdownItem() {
|
|
101
|
-
return inject(INJECTION_KEY_DROPDOWN_ITEM, {});
|
|
102
|
-
}
|
|
103
|
-
function useDropdownProvideAction({
|
|
104
|
-
expanded
|
|
105
|
-
}) {
|
|
106
|
-
provide(INJECTION_KEY_DROPDOWN_ACTION, {
|
|
107
|
-
role: ref(ActionRoles.menuitem),
|
|
108
|
-
expanded
|
|
109
|
-
});
|
|
110
|
-
}
|
|
111
|
-
const __default__ = {
|
|
112
|
-
name: "VvDropdownItem"
|
|
113
|
-
};
|
|
114
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
115
|
-
...__default__,
|
|
116
|
-
props: VvDropdownItemProps,
|
|
117
|
-
setup(__props) {
|
|
118
|
-
const props = __props;
|
|
119
|
-
const { role, expanded } = useInjectedDropdownItem();
|
|
120
|
-
const element = ref(null);
|
|
121
|
-
useDropdownProvideAction({ expanded });
|
|
122
|
-
const hovered = useElementHover(element);
|
|
123
|
-
const { focused } = useFocus(element);
|
|
124
|
-
const { focused: focusedWithin } = useFocusWithin(element);
|
|
125
|
-
watch(hovered, (newValue) => {
|
|
126
|
-
if (newValue && props.focusOnHover) {
|
|
127
|
-
focused.value = true;
|
|
128
|
-
}
|
|
129
|
-
});
|
|
130
|
-
return (_ctx, _cache) => {
|
|
131
|
-
return openBlock(), createElementBlock(
|
|
132
|
-
"div",
|
|
133
|
-
mergeProps({ role: unref(role) }, {
|
|
134
|
-
ref_key: "element",
|
|
135
|
-
ref: element,
|
|
136
|
-
class: ["vv-dropdown__item", { "focus-visible": unref(focused) || unref(focusedWithin) }]
|
|
137
|
-
}),
|
|
138
|
-
[
|
|
139
|
-
renderSlot(_ctx.$slots, "default")
|
|
140
|
-
],
|
|
141
|
-
16
|
|
142
|
-
/* FULL_PROPS */
|
|
143
|
-
);
|
|
144
|
-
};
|
|
145
|
-
}
|
|
146
|
-
});
|
|
147
|
-
export {
|
|
148
|
-
_sfc_main as default
|
|
149
|
-
};
|
|
1
|
+
import{inject as o,provide as e,ref as t,defineComponent as n,watch as r,createElementBlock as u,openBlock as l,mergeProps as s,unref as i,renderSlot as m}from"vue";import"mitt";import{useElementHover as f,useFocus as b,useFocusWithin as d}from"@vueuse/core";var a=/* @__PURE__ */(o=>(o.local="local",o.session="session",o))(a||{}),p=/* @__PURE__ */(o=>(o.left="left",o.right="right",o.top="top",o.bottom="bottom",o))(p||{}),c=/* @__PURE__ */(o=>(o.before="before",o.after="after",o))(c||{}),v=/* @__PURE__ */(o=>(o.button="button",o.submit="submit",o.reset="reset",o))(v||{}),x=/* @__PURE__ */(o=>(o.nuxtLink="nuxt-link",o.routerLink="router-link",o.a="a",o.button="button",o))(x||{}),k=/* @__PURE__ */(o=>(o.button="button",o.link="link",o.menuitem="menuitem",o))(k||{}),w=/* @__PURE__ */(o=>(o.listbox="listbox",o.menu="menu",o))(w||{});const y=/* @__PURE__ */Symbol.for("dropdownItem"),_=/* @__PURE__ */Symbol.for("dropdownAction");c.before,p.bottom,v.button,x.button,a.local,w.menu;const g=/* @__PURE__ */n({name:"VvDropdownItem",props:{focusOnHover:{type:Boolean,default:!1}},setup(n){const a=n,{role:p,expanded:c}=o(y,{}),v=t(null);!function({expanded:o}){e(_,{role:t(k.menuitem),expanded:o})}({expanded:c});const x=f(v),{focused:w}=b(v),{focused:g}=d(v);return r(x,o=>{o&&a.focusOnHover&&(w.value=!0)}),(o,e)=>(l(),u("div",s({role:i(p)},{ref_key:"element",ref:v,class:["vv-dropdown__item",{"focus-visible":i(w)||i(g)}]}),[m(o.$slots,"default")],16))}});export{g as default};
|
|
@@ -1,104 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
var StorageType = /* @__PURE__ */ ((StorageType2) => {
|
|
3
|
-
StorageType2["local"] = "local";
|
|
4
|
-
StorageType2["session"] = "session";
|
|
5
|
-
return StorageType2;
|
|
6
|
-
})(StorageType || {});
|
|
7
|
-
var Side = /* @__PURE__ */ ((Side2) => {
|
|
8
|
-
Side2["left"] = "left";
|
|
9
|
-
Side2["right"] = "right";
|
|
10
|
-
Side2["top"] = "top";
|
|
11
|
-
Side2["bottom"] = "bottom";
|
|
12
|
-
return Side2;
|
|
13
|
-
})(Side || {});
|
|
14
|
-
var Position = /* @__PURE__ */ ((Position2) => {
|
|
15
|
-
Position2["before"] = "before";
|
|
16
|
-
Position2["after"] = "after";
|
|
17
|
-
return Position2;
|
|
18
|
-
})(Position || {});
|
|
19
|
-
var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
|
|
20
|
-
ButtonType2["button"] = "button";
|
|
21
|
-
ButtonType2["submit"] = "submit";
|
|
22
|
-
ButtonType2["reset"] = "reset";
|
|
23
|
-
return ButtonType2;
|
|
24
|
-
})(ButtonType || {});
|
|
25
|
-
var ActionTag = /* @__PURE__ */ ((ActionTag2) => {
|
|
26
|
-
ActionTag2["nuxtLink"] = "nuxt-link";
|
|
27
|
-
ActionTag2["routerLink"] = "router-link";
|
|
28
|
-
ActionTag2["a"] = "a";
|
|
29
|
-
ActionTag2["button"] = "button";
|
|
30
|
-
return ActionTag2;
|
|
31
|
-
})(ActionTag || {});
|
|
32
|
-
const LabelProps = {
|
|
33
|
-
/**
|
|
34
|
-
* The item label
|
|
35
|
-
*/
|
|
36
|
-
label: {
|
|
37
|
-
type: [String, Number],
|
|
38
|
-
default: void 0
|
|
39
|
-
}
|
|
40
|
-
};
|
|
41
|
-
({
|
|
42
|
-
/**
|
|
43
|
-
* VvIcon position
|
|
44
|
-
*/
|
|
45
|
-
iconPosition: {
|
|
46
|
-
default: Position.before
|
|
47
|
-
}
|
|
48
|
-
});
|
|
49
|
-
({
|
|
50
|
-
/**
|
|
51
|
-
* Dropdown placement
|
|
52
|
-
*/
|
|
53
|
-
placement: {
|
|
54
|
-
default: Side.bottom
|
|
55
|
-
}
|
|
56
|
-
});
|
|
57
|
-
({
|
|
58
|
-
/**
|
|
59
|
-
* Button type
|
|
60
|
-
*/
|
|
61
|
-
type: {
|
|
62
|
-
default: ButtonType.button
|
|
63
|
-
},
|
|
64
|
-
/**
|
|
65
|
-
* Default tag for the action
|
|
66
|
-
*/
|
|
67
|
-
defaultTag: {
|
|
68
|
-
default: ActionTag.button
|
|
69
|
-
}
|
|
70
|
-
});
|
|
71
|
-
({
|
|
72
|
-
storageType: {
|
|
73
|
-
default: StorageType.local
|
|
74
|
-
}
|
|
75
|
-
});
|
|
76
|
-
const _hoisted_1 = {
|
|
77
|
-
class: "vv-dropdown-optgroup",
|
|
78
|
-
role: "presentation",
|
|
79
|
-
tabindex: "-1"
|
|
80
|
-
};
|
|
81
|
-
const __default__ = {
|
|
82
|
-
name: "VvDropdownOptgroup"
|
|
83
|
-
};
|
|
84
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
85
|
-
...__default__,
|
|
86
|
-
props: {
|
|
87
|
-
...LabelProps
|
|
88
|
-
},
|
|
89
|
-
setup(__props) {
|
|
90
|
-
const props = __props;
|
|
91
|
-
return (_ctx, _cache) => {
|
|
92
|
-
return openBlock(), createElementBlock(
|
|
93
|
-
"li",
|
|
94
|
-
_hoisted_1,
|
|
95
|
-
toDisplayString(props.label),
|
|
96
|
-
1
|
|
97
|
-
/* TEXT */
|
|
98
|
-
);
|
|
99
|
-
};
|
|
100
|
-
}
|
|
101
|
-
});
|
|
102
|
-
export {
|
|
103
|
-
_sfc_main as default
|
|
104
|
-
};
|
|
1
|
+
import{defineComponent as t,createElementBlock as o,openBlock as e,renderSlot as r,createTextVNode as n,toDisplayString as l}from"vue";var s=/* @__PURE__ */(t=>(t.local="local",t.session="session",t))(s||{}),u=/* @__PURE__ */(t=>(t.left="left",t.right="right",t.top="top",t.bottom="bottom",t))(u||{}),a=/* @__PURE__ */(t=>(t.before="before",t.after="after",t))(a||{}),b=/* @__PURE__ */(t=>(t.button="button",t.submit="submit",t.reset="reset",t))(b||{}),i=/* @__PURE__ */(t=>(t.nuxtLink="nuxt-link",t.routerLink="router-link",t.a="a",t.button="button",t))(i||{});const p={label:{type:[String,Number],default:void 0}};a.before,u.bottom,b.button,i.button,s.local;const f={class:"vv-dropdown-optgroup",role:"presentation",tabindex:"-1"},m=/* @__PURE__ */t({name:"VvDropdownOptgroup",props:{...p},setup(t){const s=t;return(t,u)=>(e(),o("li",f,[r(t.$slots,"default",{},()=>[n(l(s.label),1)])]))}});export{m as default};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
!function(t
|
|
1
|
+
!function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue")):"function"==typeof define&&define.amd?define(["vue"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvDropdownOptgroup=t(e.vue)}(this,function(e){"use strict";var t=(e=>(e.local="local",e.session="session",e))(t||{}),o=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(o||{}),n=(e=>(e.before="before",e.after="after",e))(n||{}),r=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(r||{}),u=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(u||{});const l={label:{type:[String,Number],default:void 0}};n.before,o.bottom,r.button,u.button,t.local;const i={class:"vv-dropdown-optgroup",role:"presentation",tabindex:"-1"};return e.defineComponent({name:"VvDropdownOptgroup",props:{...l},setup(t){const o=t;return(t,n)=>(e.openBlock(),e.createElementBlock("li",i,[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(o.label),1)])]))}})});
|
|
@@ -1,281 +1 @@
|
|
|
1
|
-
import
|
|
2
|
-
import "mitt";
|
|
3
|
-
import { useElementHover, useFocus, useFocusWithin } from "@vueuse/core";
|
|
4
|
-
var StorageType = /* @__PURE__ */ ((StorageType2) => {
|
|
5
|
-
StorageType2["local"] = "local";
|
|
6
|
-
StorageType2["session"] = "session";
|
|
7
|
-
return StorageType2;
|
|
8
|
-
})(StorageType || {});
|
|
9
|
-
var Side = /* @__PURE__ */ ((Side2) => {
|
|
10
|
-
Side2["left"] = "left";
|
|
11
|
-
Side2["right"] = "right";
|
|
12
|
-
Side2["top"] = "top";
|
|
13
|
-
Side2["bottom"] = "bottom";
|
|
14
|
-
return Side2;
|
|
15
|
-
})(Side || {});
|
|
16
|
-
var Position = /* @__PURE__ */ ((Position2) => {
|
|
17
|
-
Position2["before"] = "before";
|
|
18
|
-
Position2["after"] = "after";
|
|
19
|
-
return Position2;
|
|
20
|
-
})(Position || {});
|
|
21
|
-
var ButtonType = /* @__PURE__ */ ((ButtonType2) => {
|
|
22
|
-
ButtonType2["button"] = "button";
|
|
23
|
-
ButtonType2["submit"] = "submit";
|
|
24
|
-
ButtonType2["reset"] = "reset";
|
|
25
|
-
return ButtonType2;
|
|
26
|
-
})(ButtonType || {});
|
|
27
|
-
var ActionTag = /* @__PURE__ */ ((ActionTag2) => {
|
|
28
|
-
ActionTag2["nuxtLink"] = "nuxt-link";
|
|
29
|
-
ActionTag2["routerLink"] = "router-link";
|
|
30
|
-
ActionTag2["a"] = "a";
|
|
31
|
-
ActionTag2["button"] = "button";
|
|
32
|
-
return ActionTag2;
|
|
33
|
-
})(ActionTag || {});
|
|
34
|
-
var ActionRoles = /* @__PURE__ */ ((ActionRoles2) => {
|
|
35
|
-
ActionRoles2["button"] = "button";
|
|
36
|
-
ActionRoles2["link"] = "link";
|
|
37
|
-
ActionRoles2["menuitem"] = "menuitem";
|
|
38
|
-
return ActionRoles2;
|
|
39
|
-
})(ActionRoles || {});
|
|
40
|
-
var DropdownRole = /* @__PURE__ */ ((DropdownRole2) => {
|
|
41
|
-
DropdownRole2["listbox"] = "listbox";
|
|
42
|
-
DropdownRole2["menu"] = "menu";
|
|
43
|
-
return DropdownRole2;
|
|
44
|
-
})(DropdownRole || {});
|
|
45
|
-
const INJECTION_KEY_DROPDOWN_ITEM = Symbol.for(
|
|
46
|
-
"dropdownItem"
|
|
47
|
-
);
|
|
48
|
-
const INJECTION_KEY_DROPDOWN_ACTION = Symbol.for(
|
|
49
|
-
"dropdownAction"
|
|
50
|
-
);
|
|
51
|
-
const DisabledProps = {
|
|
52
|
-
/**
|
|
53
|
-
* Whether the form control is disabled
|
|
54
|
-
*/
|
|
55
|
-
disabled: {
|
|
56
|
-
type: Boolean,
|
|
57
|
-
default: false
|
|
58
|
-
}
|
|
59
|
-
};
|
|
60
|
-
const SelectedProps = {
|
|
61
|
-
/**
|
|
62
|
-
* Whether the item is selected
|
|
63
|
-
*/
|
|
64
|
-
selected: {
|
|
65
|
-
type: Boolean,
|
|
66
|
-
default: false
|
|
67
|
-
}
|
|
68
|
-
};
|
|
69
|
-
const ModifiersProps = {
|
|
70
|
-
/**
|
|
71
|
-
* Component BEM modifiers
|
|
72
|
-
*/
|
|
73
|
-
modifiers: {
|
|
74
|
-
type: [String, Array],
|
|
75
|
-
default: void 0
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
({
|
|
79
|
-
/**
|
|
80
|
-
* VvIcon position
|
|
81
|
-
*/
|
|
82
|
-
iconPosition: {
|
|
83
|
-
default: Position.before
|
|
84
|
-
}
|
|
85
|
-
});
|
|
86
|
-
const UnselectableProps = {
|
|
87
|
-
/**
|
|
88
|
-
* If true the input will be unselectable
|
|
89
|
-
*/
|
|
90
|
-
unselectable: { type: Boolean, default: true }
|
|
91
|
-
};
|
|
92
|
-
({
|
|
93
|
-
/**
|
|
94
|
-
* Dropdown placement
|
|
95
|
-
*/
|
|
96
|
-
placement: {
|
|
97
|
-
default: Side.bottom
|
|
98
|
-
}
|
|
99
|
-
});
|
|
100
|
-
({
|
|
101
|
-
/**
|
|
102
|
-
* Button type
|
|
103
|
-
*/
|
|
104
|
-
type: {
|
|
105
|
-
default: ButtonType.button
|
|
106
|
-
},
|
|
107
|
-
/**
|
|
108
|
-
* Default tag for the action
|
|
109
|
-
*/
|
|
110
|
-
defaultTag: {
|
|
111
|
-
default: ActionTag.button
|
|
112
|
-
}
|
|
113
|
-
});
|
|
114
|
-
({
|
|
115
|
-
storageType: {
|
|
116
|
-
default: StorageType.local
|
|
117
|
-
}
|
|
118
|
-
});
|
|
119
|
-
({
|
|
120
|
-
/**
|
|
121
|
-
* Dropdown role
|
|
122
|
-
*/
|
|
123
|
-
role: {
|
|
124
|
-
default: DropdownRole.menu
|
|
125
|
-
}
|
|
126
|
-
});
|
|
127
|
-
const VvDropdownItemProps = {
|
|
128
|
-
focusOnHover: {
|
|
129
|
-
type: Boolean,
|
|
130
|
-
default: false
|
|
131
|
-
}
|
|
132
|
-
};
|
|
133
|
-
const VvDropdownOptionProps = {
|
|
134
|
-
...DisabledProps,
|
|
135
|
-
...SelectedProps,
|
|
136
|
-
...UnselectableProps,
|
|
137
|
-
...ModifiersProps,
|
|
138
|
-
deselectHintLabel: {
|
|
139
|
-
type: String
|
|
140
|
-
},
|
|
141
|
-
selectHintLabel: {
|
|
142
|
-
type: String
|
|
143
|
-
},
|
|
144
|
-
selectedHintLabel: {
|
|
145
|
-
type: String
|
|
146
|
-
},
|
|
147
|
-
focusOnHover: {
|
|
148
|
-
type: Boolean,
|
|
149
|
-
default: false
|
|
150
|
-
}
|
|
151
|
-
};
|
|
152
|
-
function useInjectedDropdownItem() {
|
|
153
|
-
return inject(INJECTION_KEY_DROPDOWN_ITEM, {});
|
|
154
|
-
}
|
|
155
|
-
function useDropdownProvideAction({
|
|
156
|
-
expanded
|
|
157
|
-
}) {
|
|
158
|
-
provide(INJECTION_KEY_DROPDOWN_ACTION, {
|
|
159
|
-
role: ref(ActionRoles.menuitem),
|
|
160
|
-
expanded
|
|
161
|
-
});
|
|
162
|
-
}
|
|
163
|
-
const __default__$1 = {
|
|
164
|
-
name: "VvDropdownItem"
|
|
165
|
-
};
|
|
166
|
-
const _sfc_main$1 = /* @__PURE__ */ defineComponent({
|
|
167
|
-
...__default__$1,
|
|
168
|
-
props: VvDropdownItemProps,
|
|
169
|
-
setup(__props) {
|
|
170
|
-
const props = __props;
|
|
171
|
-
const { role, expanded } = useInjectedDropdownItem();
|
|
172
|
-
const element = ref(null);
|
|
173
|
-
useDropdownProvideAction({ expanded });
|
|
174
|
-
const hovered = useElementHover(element);
|
|
175
|
-
const { focused } = useFocus(element);
|
|
176
|
-
const { focused: focusedWithin } = useFocusWithin(element);
|
|
177
|
-
watch(hovered, (newValue) => {
|
|
178
|
-
if (newValue && props.focusOnHover) {
|
|
179
|
-
focused.value = true;
|
|
180
|
-
}
|
|
181
|
-
});
|
|
182
|
-
return (_ctx, _cache) => {
|
|
183
|
-
return openBlock(), createElementBlock(
|
|
184
|
-
"div",
|
|
185
|
-
mergeProps({ role: unref(role) }, {
|
|
186
|
-
ref_key: "element",
|
|
187
|
-
ref: element,
|
|
188
|
-
class: ["vv-dropdown__item", { "focus-visible": unref(focused) || unref(focusedWithin) }]
|
|
189
|
-
}),
|
|
190
|
-
[
|
|
191
|
-
renderSlot(_ctx.$slots, "default")
|
|
192
|
-
],
|
|
193
|
-
16
|
|
194
|
-
/* FULL_PROPS */
|
|
195
|
-
);
|
|
196
|
-
};
|
|
197
|
-
}
|
|
198
|
-
});
|
|
199
|
-
function useModifiers(prefix, modifiers, others) {
|
|
200
|
-
return computed(() => {
|
|
201
|
-
const toReturn = {
|
|
202
|
-
[prefix]: true
|
|
203
|
-
};
|
|
204
|
-
const modifiersArray = typeof modifiers?.value === "string" ? modifiers.value.split(" ") : modifiers?.value;
|
|
205
|
-
if (modifiersArray) {
|
|
206
|
-
if (Array.isArray(modifiersArray)) {
|
|
207
|
-
modifiersArray.forEach((modifier) => {
|
|
208
|
-
if (modifier) {
|
|
209
|
-
toReturn[`${prefix}--${modifier}`] = true;
|
|
210
|
-
}
|
|
211
|
-
});
|
|
212
|
-
}
|
|
213
|
-
}
|
|
214
|
-
if (others) {
|
|
215
|
-
Object.keys(others.value).forEach((key) => {
|
|
216
|
-
toReturn[`${prefix}--${key}`] = unref(others.value[key]);
|
|
217
|
-
});
|
|
218
|
-
}
|
|
219
|
-
return toReturn;
|
|
220
|
-
});
|
|
221
|
-
}
|
|
222
|
-
const _hoisted_1 = ["title"];
|
|
223
|
-
const __default__ = {
|
|
224
|
-
name: "VvDropdownOption"
|
|
225
|
-
};
|
|
226
|
-
const _sfc_main = /* @__PURE__ */ defineComponent({
|
|
227
|
-
...__default__,
|
|
228
|
-
props: VvDropdownOptionProps,
|
|
229
|
-
setup(__props) {
|
|
230
|
-
const props = __props;
|
|
231
|
-
const { modifiers } = toRefs(props);
|
|
232
|
-
const bemCssClasses = useModifiers(
|
|
233
|
-
"vv-dropdown-option",
|
|
234
|
-
modifiers,
|
|
235
|
-
computed(() => ({
|
|
236
|
-
disabled: props.disabled,
|
|
237
|
-
selected: props.selected,
|
|
238
|
-
unselectable: props.unselectable && props.selected
|
|
239
|
-
}))
|
|
240
|
-
);
|
|
241
|
-
const hintLabel = computed(() => {
|
|
242
|
-
if (props.selected) {
|
|
243
|
-
return props.unselectable ? props.deselectHintLabel : props.selectedHintLabel;
|
|
244
|
-
}
|
|
245
|
-
if (!props.disabled) {
|
|
246
|
-
return props.selectHintLabel;
|
|
247
|
-
}
|
|
248
|
-
return "";
|
|
249
|
-
});
|
|
250
|
-
return (_ctx, _cache) => {
|
|
251
|
-
return openBlock(), createBlock(_sfc_main$1, {
|
|
252
|
-
class: normalizeClass(unref(bemCssClasses)),
|
|
253
|
-
tabindex: _ctx.disabled ? -1 : 0,
|
|
254
|
-
"aria-selected": _ctx.selected,
|
|
255
|
-
"aria-disabled": _ctx.disabled,
|
|
256
|
-
"focus-on-hover": _ctx.focusOnHover
|
|
257
|
-
}, {
|
|
258
|
-
default: withCtx(() => [
|
|
259
|
-
renderSlot(_ctx.$slots, "default"),
|
|
260
|
-
createElementVNode("span", {
|
|
261
|
-
class: "vv-dropdown-option__hint",
|
|
262
|
-
title: unref(hintLabel)
|
|
263
|
-
}, [
|
|
264
|
-
renderSlot(_ctx.$slots, "hint", normalizeProps(guardReactiveProps({ disabled: _ctx.disabled, selected: _ctx.selected, unselectable: _ctx.unselectable })), () => [
|
|
265
|
-
createTextVNode(
|
|
266
|
-
toDisplayString(unref(hintLabel)),
|
|
267
|
-
1
|
|
268
|
-
/* TEXT */
|
|
269
|
-
)
|
|
270
|
-
])
|
|
271
|
-
], 8, _hoisted_1)
|
|
272
|
-
]),
|
|
273
|
-
_: 3
|
|
274
|
-
/* FORWARDED */
|
|
275
|
-
}, 8, ["class", "tabindex", "aria-selected", "aria-disabled", "focus-on-hover"]);
|
|
276
|
-
};
|
|
277
|
-
}
|
|
278
|
-
});
|
|
279
|
-
export {
|
|
280
|
-
_sfc_main as default
|
|
281
|
-
};
|
|
1
|
+
import{inject as e,provide as t,ref as o,defineComponent as l,watch as n,createElementBlock as s,openBlock as a,mergeProps as d,unref as r,renderSlot as i,computed as u,toRefs as c,createBlock as b,normalizeClass as f,withCtx as p,createElementVNode as m,normalizeProps as v,guardReactiveProps as y,createTextVNode as x,toDisplayString as H}from"vue";import"mitt";import{useElementHover as h,useFocus as k,useFocusWithin as L}from"@vueuse/core";var g=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(g||{}),w=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(w||{}),$=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))($||{}),O=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(O||{}),S=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(S||{}),_=/* @__PURE__ */(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(_||{}),B=/* @__PURE__ */(e=>(e.listbox="listbox",e.menu="menu",e))(B||{});const A=/* @__PURE__ */Symbol.for("dropdownItem"),D=/* @__PURE__ */Symbol.for("dropdownAction"),E={disabled:{type:Boolean,default:!1}},I={selected:{type:Boolean,default:!1}},V={modifiers:{type:[String,Array],default:void 0}};$.before;const j={unselectable:{type:Boolean,default:!0}};w.bottom,O.button,S.button,g.local,B.menu;const q={focusOnHover:{type:Boolean,default:!1}},z={...E,...I,...j,...V,deselectHintLabel:{type:String},selectHintLabel:{type:String},selectedHintLabel:{type:String},focusOnHover:{type:Boolean,default:!1}};const C=/* @__PURE__ */l({name:"VvDropdownItem",props:q,setup(l){const u=l,{role:c,expanded:b}=e(A,{}),f=o(null);!function({expanded:e}){t(D,{role:o(_.menuitem),expanded:e})}({expanded:b});const p=h(f),{focused:m}=k(f),{focused:v}=L(f);return n(p,e=>{e&&u.focusOnHover&&(m.value=!0)}),(e,t)=>(a(),s("div",d({role:r(c)},{ref_key:"element",ref:f,class:["vv-dropdown__item",{"focus-visible":r(m)||r(v)}]}),[i(e.$slots,"default")],16))}});const F=["title"],G=/* @__PURE__ */l({name:"VvDropdownOption",props:z,setup(e){const t=e,{modifiers:o}=c(t),l=function(e,t,o){return u(()=>{const l={[e]:!0},n="string"==typeof t?.value?t.value.split(" "):t?.value;return n&&Array.isArray(n)&&n.forEach(t=>{t&&(l[`${e}--${t}`]=!0)}),o&&Object.keys(o.value).forEach(t=>{l[`${e}--${t}`]=r(o.value[t])}),l})}("vv-dropdown-option",o,u(()=>({disabled:t.disabled,selected:t.selected,unselectable:t.unselectable&&t.selected}))),n=u(()=>t.selected?t.unselectable?t.deselectHintLabel:t.selectedHintLabel:t.disabled?"":t.selectHintLabel);return(e,t)=>(a(),b(C,{class:f(r(l)),tabindex:e.disabled?-1:0,"aria-selected":e.selected,"aria-disabled":e.disabled,"focus-on-hover":e.focusOnHover},{default:p(()=>[i(e.$slots,"default"),m("span",{class:"vv-dropdown-option__hint",title:r(n)},[i(e.$slots,"hint",v(y({disabled:e.disabled,selected:e.selected,unselectable:e.unselectable})),()=>[x(H(r(n)),1)])],8,F)]),_:3},8,["class","tabindex","aria-selected","aria-disabled","focus-on-hover"]))}});export{G as default};
|