@volverjs/ui-vue 0.0.10 → 0.0.12

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.
Files changed (94) hide show
  1. package/bin/icons.js +1 -93
  2. package/dist/components/VvAccordion/VvAccordion.es.js +1 -366
  3. package/dist/components/VvAccordion/VvAccordion.vue.d.ts +2 -1
  4. package/dist/components/VvAccordionGroup/VvAccordionGroup.es.js +2 -702
  5. package/dist/components/VvAccordionGroup/VvAccordionGroup.vue.d.ts +3 -2
  6. package/dist/components/VvAction/VvAction.es.js +1 -302
  7. package/dist/components/VvAction/VvAction.vue.d.ts +2 -1
  8. package/dist/components/VvAlert/VvAlert.es.js +1 -527
  9. package/dist/components/VvAlert/VvAlert.umd.js +1 -1
  10. package/dist/components/VvAlert/VvAlert.vue.d.ts +2 -1
  11. package/dist/components/VvAlertGroup/VvAlertGroup.es.js +1 -730
  12. package/dist/components/VvAlertGroup/VvAlertGroup.umd.js +1 -1
  13. package/dist/components/VvAlertGroup/VvAlertGroup.vue.d.ts +2 -1
  14. package/dist/components/VvAvatar/VvAvatar.es.js +1 -132
  15. package/dist/components/VvAvatar/VvAvatar.vue.d.ts +2 -1
  16. package/dist/components/VvAvatarGroup/VvAvatarGroup.es.js +1 -250
  17. package/dist/components/VvAvatarGroup/VvAvatarGroup.vue.d.ts +2 -1
  18. package/dist/components/VvBadge/VvBadge.es.js +1 -131
  19. package/dist/components/VvBadge/VvBadge.vue.d.ts +2 -1
  20. package/dist/components/VvBreadcrumb/VvBreadcrumb.es.js +1 -410
  21. package/dist/components/VvBreadcrumb/VvBreadcrumb.vue.d.ts +2 -1
  22. package/dist/components/VvButton/VvButton.es.js +1 -882
  23. package/dist/components/VvButton/VvButton.umd.js +1 -1
  24. package/dist/components/VvButton/VvButton.vue.d.ts +2 -1
  25. package/dist/components/VvButtonGroup/VvButtonGroup.es.js +1 -214
  26. package/dist/components/VvButtonGroup/VvButtonGroup.vue.d.ts +2 -1
  27. package/dist/components/VvCard/VvCard.es.js +1 -152
  28. package/dist/components/VvCard/VvCard.vue.d.ts +2 -1
  29. package/dist/components/VvCheckbox/VvCheckbox.es.js +1 -741
  30. package/dist/components/VvCheckbox/VvCheckbox.vue.d.ts +3 -2
  31. package/dist/components/VvCheckboxGroup/VvCheckboxGroup.es.js +1 -981
  32. package/dist/components/VvCheckboxGroup/VvCheckboxGroup.vue.d.ts +2 -1
  33. package/dist/components/VvCombobox/VvCombobox.es.js +1 -3463
  34. package/dist/components/VvCombobox/VvCombobox.umd.js +1 -1
  35. package/dist/components/VvCombobox/VvCombobox.vue.d.ts +263 -317
  36. package/dist/components/VvDialog/VvDialog.es.js +1 -317
  37. package/dist/components/VvDialog/VvDialog.vue.d.ts +2 -1
  38. package/dist/components/VvDropdown/VvDropdown.es.js +1 -750
  39. package/dist/components/VvDropdown/VvDropdown.vue.d.ts +2 -1
  40. package/dist/components/VvDropdown/VvDropdownAction.vue.d.ts +5 -4
  41. package/dist/components/VvDropdown/VvDropdownItem.vue.d.ts +2 -1
  42. package/dist/components/VvDropdown/VvDropdownOptgroup.vue.d.ts +10 -2
  43. package/dist/components/VvDropdown/VvDropdownOption.vue.d.ts +2 -1
  44. package/dist/components/VvDropdownAction/VvDropdownAction.es.js +1 -448
  45. package/dist/components/VvDropdownItem/VvDropdownItem.es.js +1 -149
  46. package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.es.js +1 -104
  47. package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.umd.js +1 -1
  48. package/dist/components/VvDropdownOption/VvDropdownOption.es.js +1 -281
  49. package/dist/components/VvIcon/VvIcon.es.js +1 -143
  50. package/dist/components/VvIcon/VvIcon.umd.js +1 -1
  51. package/dist/components/VvIcon/VvIcon.vue.d.ts +2 -1
  52. package/dist/components/VvInputFile/VvInputFile.es.js +1 -1704
  53. package/dist/components/VvInputFile/VvInputFile.umd.js +1 -1
  54. package/dist/components/VvInputFile/VvInputFile.vue.d.ts +2 -1
  55. package/dist/components/VvInputText/VvInputText.es.js +4 -2790
  56. package/dist/components/VvInputText/VvInputText.umd.js +1 -1
  57. package/dist/components/VvInputText/VvInputText.vue.d.ts +2 -1
  58. package/dist/components/VvNav/VvNav.es.js +1 -438
  59. package/dist/components/VvNav/VvNav.vue.d.ts +2 -1
  60. package/dist/components/VvNav/VvNavItem.vue.d.ts +2 -1
  61. package/dist/components/VvNav/VvNavSeparator.vue.d.ts +2 -1
  62. package/dist/components/VvNavItem/VvNavItem.es.js +1 -337
  63. package/dist/components/VvNavSeparator/VvNavSeparator.es.js +1 -24
  64. package/dist/components/VvProgress/VvProgress.es.js +1 -163
  65. package/dist/components/VvProgress/VvProgress.vue.d.ts +2 -1
  66. package/dist/components/VvRadio/VvRadio.es.js +1 -661
  67. package/dist/components/VvRadio/VvRadio.vue.d.ts +3 -2
  68. package/dist/components/VvRadioGroup/VvRadioGroup.es.js +1 -901
  69. package/dist/components/VvRadioGroup/VvRadioGroup.vue.d.ts +2 -1
  70. package/dist/components/VvSelect/VvSelect.es.js +1 -1103
  71. package/dist/components/VvSelect/VvSelect.umd.js +1 -1
  72. package/dist/components/VvSelect/VvSelect.vue.d.ts +130 -71
  73. package/dist/components/VvTab/VvTab.es.js +1 -558
  74. package/dist/components/VvTab/VvTab.vue.d.ts +2 -1
  75. package/dist/components/VvTextarea/VvTextarea.es.js +2 -1989
  76. package/dist/components/VvTextarea/VvTextarea.umd.js +1 -1
  77. package/dist/components/VvTextarea/VvTextarea.vue.d.ts +2 -1
  78. package/dist/components/VvTooltip/VvTooltip.es.js +1 -154
  79. package/dist/components/VvTooltip/VvTooltip.vue.d.ts +2 -1
  80. package/dist/components/index.es.js +6 -8558
  81. package/dist/components/index.umd.js +1 -1
  82. package/dist/composables/index.es.js +2 -247
  83. package/dist/composables/index.umd.js +1 -1
  84. package/dist/directives/index.es.js +2 -311
  85. package/dist/directives/index.umd.js +1 -1
  86. package/dist/directives/v-contextmenu.es.js +2 -142
  87. package/dist/directives/v-contextmenu.umd.js +1 -1
  88. package/dist/directives/v-tooltip.es.js +1 -172
  89. package/dist/icons.es.js +1 -39
  90. package/dist/icons.umd.js +1 -1
  91. package/dist/index.es.js +1 -219
  92. package/dist/resolvers/unplugin.es.js +1 -187
  93. package/dist/stories/AccordionGroup/AccordionGroupSlots.stories.d.ts +14 -14
  94. package/package.json +37 -37
@@ -1,6 +1,6 @@
1
1
  import type { AutoPlacementOptions, FlipOptions, OffsetOptions, ShiftOptions, SizeOptions } from '../../types/floating-ui';
2
2
  import { Side, Strategy } from '../../constants';
3
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
3
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
4
4
  modelValue: {
5
5
  type: BooleanConstructor;
6
6
  default: undefined;
@@ -315,6 +315,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis
315
315
  expanded: boolean;
316
316
  }) => any;
317
317
  }>;
318
+ declare const _default: typeof __VLS_export;
318
319
  export default _default;
319
320
  type __VLS_WithSlots<T, S> = T & {
320
321
  new (): {
@@ -1,8 +1,8 @@
1
- declare var __VLS_10: {};
1
+ declare var __VLS_12: {};
2
2
  type __VLS_Slots = {} & {
3
- default?: (props: typeof __VLS_10) => any;
3
+ default?: (props: typeof __VLS_12) => any;
4
4
  };
5
- declare const __VLS_component: import("vue").DefineComponent<globalThis.ExtractPropTypes<{
5
+ declare const __VLS_base: import("vue").DefineComponent<globalThis.ExtractPropTypes<{
6
6
  modifiers: {
7
7
  type: PropType<string | string[]>;
8
8
  default: undefined;
@@ -108,7 +108,8 @@ declare const __VLS_component: import("vue").DefineComponent<globalThis.ExtractP
108
108
  active: boolean;
109
109
  pressed: boolean;
110
110
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
111
- declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
111
+ declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
112
+ declare const _default: typeof __VLS_export;
112
113
  export default _default;
113
114
  type __VLS_WithSlots<T, S> = T & {
114
115
  new (): {
@@ -1,4 +1,4 @@
1
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
1
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
2
  focusOnHover: {
3
3
  type: BooleanConstructor;
4
4
  default: boolean;
@@ -13,6 +13,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis
13
13
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
14
14
  default?: (props: {}) => any;
15
15
  }>;
16
+ declare const _default: typeof __VLS_export;
16
17
  export default _default;
17
18
  type __VLS_WithSlots<T, S> = T & {
18
19
  new (): {
@@ -1,4 +1,4 @@
1
- declare const _default: import("vue").DefineComponent<globalThis.ExtractPropTypes<{
1
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
2
  label: {
3
3
  type: (StringConstructor | NumberConstructor)[];
4
4
  default: undefined;
@@ -10,5 +10,13 @@ declare const _default: import("vue").DefineComponent<globalThis.ExtractPropType
10
10
  };
11
11
  }>> & Readonly<{}>, {
12
12
  label: string | number;
13
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
13
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
14
+ default?: (props: {}) => any;
15
+ }>;
16
+ declare const _default: typeof __VLS_export;
14
17
  export default _default;
18
+ type __VLS_WithSlots<T, S> = T & {
19
+ new (): {
20
+ $slots: S;
21
+ };
22
+ };
@@ -1,4 +1,4 @@
1
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
1
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
2
  deselectHintLabel: {
3
3
  type: StringConstructor;
4
4
  };
@@ -73,6 +73,7 @@ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<globalThis
73
73
  unselectable: boolean;
74
74
  }) => any;
75
75
  }>;
76
+ declare const _default: typeof __VLS_export;
76
77
  export default _default;
77
78
  type __VLS_WithSlots<T, S> = T & {
78
79
  new (): {
@@ -1,448 +1 @@
1
- import { inject, defineComponent, getCurrentInstance, ref, watch, computed, resolveComponent, createBlock, openBlock, resolveDynamicComponent, unref, mergeProps, withCtx, renderSlot, createTextVNode, toDisplayString, provide, createElementBlock, toRefs, createVNode } from "vue";
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_VOLVER = Symbol.for("volver");
46
- const INJECTION_KEY_DROPDOWN_TRIGGER = Symbol.for(
47
- "dropdownTrigger"
48
- );
49
- const INJECTION_KEY_DROPDOWN_ITEM = Symbol.for(
50
- "dropdownItem"
51
- );
52
- const INJECTION_KEY_DROPDOWN_ACTION = Symbol.for(
53
- "dropdownAction"
54
- );
55
- const LinkProps = {
56
- /**
57
- * The router-link/nuxt-link property, if it is defined the button is rendered as a ruouter-link or nuxt-link.
58
- * @see Documentation of [router-link](https://router.vuejs.org/api/#router-link) and [nuxt-link](https://nuxtjs.org/api/components-nuxt-link/)
59
- */
60
- to: {
61
- type: [String, Object]
62
- },
63
- /**
64
- * Anchor href
65
- */
66
- href: String,
67
- /**
68
- * Anchor target
69
- */
70
- target: String,
71
- /**
72
- * Anchor rel
73
- */
74
- rel: {
75
- type: String,
76
- default: "noopener noreferrer"
77
- }
78
- };
79
- const DisabledProps = {
80
- /**
81
- * Whether the form control is disabled
82
- */
83
- disabled: {
84
- type: Boolean,
85
- default: false
86
- }
87
- };
88
- const ActiveProps = {
89
- /**
90
- * Whether the item is active
91
- */
92
- active: {
93
- type: Boolean,
94
- default: false
95
- }
96
- };
97
- const CurrentProps = {
98
- /**
99
- * Whether the item is current
100
- */
101
- current: {
102
- type: Boolean,
103
- default: false
104
- }
105
- };
106
- const PressedProps = {
107
- /**
108
- * Whether the item is pressed
109
- */
110
- pressed: {
111
- type: Boolean,
112
- default: false
113
- }
114
- };
115
- const LabelProps = {
116
- /**
117
- * The item label
118
- */
119
- label: {
120
- type: [String, Number],
121
- default: void 0
122
- }
123
- };
124
- const ModifiersProps = {
125
- /**
126
- * Component BEM modifiers
127
- */
128
- modifiers: {
129
- type: [String, Array],
130
- default: void 0
131
- }
132
- };
133
- ({
134
- /**
135
- * VvIcon position
136
- */
137
- iconPosition: {
138
- default: Position.before
139
- }
140
- });
141
- ({
142
- /**
143
- * Dropdown placement
144
- */
145
- placement: {
146
- default: Side.bottom
147
- }
148
- });
149
- const ActionProps = {
150
- ...DisabledProps,
151
- ...LabelProps,
152
- ...PressedProps,
153
- ...ActiveProps,
154
- ...CurrentProps,
155
- ...LinkProps,
156
- /**
157
- * Button type
158
- */
159
- type: {
160
- type: String,
161
- default: ButtonType.button,
162
- validator: (value) => Object.values(ButtonType).includes(value)
163
- },
164
- /**
165
- * Button aria-label
166
- */
167
- ariaLabel: {
168
- type: String,
169
- default: void 0
170
- },
171
- /**
172
- * Default tag for the action
173
- */
174
- defaultTag: {
175
- type: String,
176
- default: ActionTag.button
177
- }
178
- };
179
- ({
180
- storageType: {
181
- default: StorageType.local
182
- }
183
- });
184
- const VvActionEvents = ["click", "mouseover", "mouseleave"];
185
- const VvActionProps = ActionProps;
186
- function useVolver() {
187
- return inject(INJECTION_KEY_VOLVER, void 0);
188
- }
189
- function useInjectedDropdownTrigger() {
190
- return inject(INJECTION_KEY_DROPDOWN_TRIGGER, {});
191
- }
192
- function useInjectedDropdownItem() {
193
- return inject(INJECTION_KEY_DROPDOWN_ITEM, {});
194
- }
195
- function useInjectedDropdownAction() {
196
- return inject(INJECTION_KEY_DROPDOWN_ACTION, {});
197
- }
198
- const __default__$1 = {
199
- name: "VvAction"
200
- };
201
- const _sfc_main$2 = /* @__PURE__ */ defineComponent({
202
- ...__default__$1,
203
- props: VvActionProps,
204
- emits: VvActionEvents,
205
- setup(__props, { expose: __expose, emit: __emit }) {
206
- const props = __props;
207
- const emit = __emit;
208
- const instance = getCurrentInstance();
209
- const volver = useVolver();
210
- const element = ref(null);
211
- __expose({ $el: element });
212
- const {
213
- reference: dropdownTriggerReference,
214
- bus: dropdownEventBus,
215
- aria: dropdownAria,
216
- expanded: dropdownExpanded
217
- } = useInjectedDropdownTrigger();
218
- watch(
219
- () => element.value,
220
- (newValue) => {
221
- if (dropdownTriggerReference) {
222
- dropdownTriggerReference.value = newValue;
223
- }
224
- }
225
- );
226
- const pressed = computed(() => {
227
- return props.pressed || dropdownExpanded?.value;
228
- });
229
- const { role } = useInjectedDropdownAction();
230
- const hasTag = computed(() => {
231
- switch (true) {
232
- case props.disabled:
233
- return ActionTag.button;
234
- case props.to !== void 0:
235
- return volver?.nuxt ? resolveComponent(ActionTag.nuxtLink) : ActionTag.routerLink;
236
- case props.href !== void 0:
237
- return ActionTag.a;
238
- default:
239
- return props.defaultTag;
240
- }
241
- });
242
- const hasProps = computed(() => {
243
- const toReturn = {
244
- ...dropdownAria?.value,
245
- ariaPressed: pressed.value ? true : void 0,
246
- ariaLabel: props.ariaLabel,
247
- role: role?.value
248
- };
249
- switch (hasTag.value) {
250
- case ActionTag.a:
251
- return {
252
- ...toReturn,
253
- href: props.href,
254
- target: props.target,
255
- rel: props.rel
256
- };
257
- case ActionTag.routerLink:
258
- case ActionTag.nuxtLink:
259
- return {
260
- ...toReturn,
261
- to: props.to,
262
- target: props.target
263
- };
264
- case ActionTag.button:
265
- return {
266
- ...toReturn,
267
- type: props.type,
268
- disabled: props.disabled
269
- };
270
- default:
271
- return toReturn;
272
- }
273
- });
274
- function onClick(e) {
275
- if (props.disabled) {
276
- e.preventDefault();
277
- return;
278
- }
279
- if (instance?.vnode.props?.onClick) {
280
- emit("click", e);
281
- return;
282
- }
283
- dropdownEventBus?.emit("click", e);
284
- }
285
- function onMouseover(e) {
286
- if (instance?.vnode.props?.onMouseover) {
287
- emit("mouseover", e);
288
- return;
289
- }
290
- dropdownEventBus?.emit("mouseover", e);
291
- }
292
- function onMouseleave(e) {
293
- if (instance?.vnode.props?.onMouseleave) {
294
- emit("mouseleave", e);
295
- return;
296
- }
297
- dropdownEventBus?.emit("mouseleave", e);
298
- }
299
- return (_ctx, _cache) => {
300
- return openBlock(), createBlock(resolveDynamicComponent(unref(hasTag)), mergeProps(unref(hasProps), {
301
- ref_key: "element",
302
- ref: element,
303
- class: {
304
- active: _ctx.active,
305
- pressed: unref(pressed),
306
- disabled: _ctx.disabled,
307
- current: _ctx.current
308
- },
309
- onClickPassive: onClick,
310
- onMouseoverPassive: onMouseover,
311
- onMouseleavePassive: onMouseleave
312
- }), {
313
- default: withCtx(() => [
314
- renderSlot(_ctx.$slots, "default", {}, () => [
315
- createTextVNode(
316
- toDisplayString(_ctx.label),
317
- 1
318
- /* TEXT */
319
- )
320
- ])
321
- ]),
322
- _: 3
323
- /* FORWARDED */
324
- }, 16, ["class"]);
325
- };
326
- }
327
- });
328
- ({
329
- /**
330
- * Dropdown role
331
- */
332
- role: {
333
- default: DropdownRole.menu
334
- }
335
- });
336
- const VvDropdownItemProps = {
337
- focusOnHover: {
338
- type: Boolean,
339
- default: false
340
- }
341
- };
342
- function useDropdownProvideAction({
343
- expanded
344
- }) {
345
- provide(INJECTION_KEY_DROPDOWN_ACTION, {
346
- role: ref(ActionRoles.menuitem),
347
- expanded
348
- });
349
- }
350
- const __default__ = {
351
- name: "VvDropdownItem"
352
- };
353
- const _sfc_main$1 = /* @__PURE__ */ defineComponent({
354
- ...__default__,
355
- props: VvDropdownItemProps,
356
- setup(__props) {
357
- const props = __props;
358
- const { role, expanded } = useInjectedDropdownItem();
359
- const element = ref(null);
360
- useDropdownProvideAction({ expanded });
361
- const hovered = useElementHover(element);
362
- const { focused } = useFocus(element);
363
- const { focused: focusedWithin } = useFocusWithin(element);
364
- watch(hovered, (newValue) => {
365
- if (newValue && props.focusOnHover) {
366
- focused.value = true;
367
- }
368
- });
369
- return (_ctx, _cache) => {
370
- return openBlock(), createElementBlock(
371
- "div",
372
- mergeProps({ role: unref(role) }, {
373
- ref_key: "element",
374
- ref: element,
375
- class: ["vv-dropdown__item", { "focus-visible": unref(focused) || unref(focusedWithin) }]
376
- }),
377
- [
378
- renderSlot(_ctx.$slots, "default")
379
- ],
380
- 16
381
- /* FULL_PROPS */
382
- );
383
- };
384
- }
385
- });
386
- function useModifiers(prefix, modifiers, others) {
387
- return computed(() => {
388
- const toReturn = {
389
- [prefix]: true
390
- };
391
- const modifiersArray = typeof modifiers?.value === "string" ? modifiers.value.split(" ") : modifiers?.value;
392
- if (modifiersArray) {
393
- if (Array.isArray(modifiersArray)) {
394
- modifiersArray.forEach((modifier) => {
395
- if (modifier) {
396
- toReturn[`${prefix}--${modifier}`] = true;
397
- }
398
- });
399
- }
400
- }
401
- return toReturn;
402
- });
403
- }
404
- const _sfc_main = /* @__PURE__ */ defineComponent({
405
- __name: "VvDropdownAction",
406
- props: {
407
- ...ActionProps,
408
- ...ModifiersProps
409
- },
410
- setup(__props) {
411
- const props = __props;
412
- const { modifiers } = toRefs(props);
413
- const bemCssClasses = useModifiers("vv-dropdown-action", modifiers);
414
- return (_ctx, _cache) => {
415
- return openBlock(), createBlock(_sfc_main$1, null, {
416
- default: withCtx(() => [
417
- createVNode(_sfc_main$2, mergeProps({
418
- disabled: _ctx.disabled,
419
- pressed: _ctx.pressed,
420
- active: _ctx.active,
421
- type: _ctx.type,
422
- to: _ctx.to,
423
- href: _ctx.href,
424
- target: _ctx.target,
425
- rel: _ctx.rel
426
- }, { class: unref(bemCssClasses) }), {
427
- default: withCtx(() => [
428
- renderSlot(_ctx.$slots, "default", {}, () => [
429
- createTextVNode(
430
- toDisplayString(_ctx.label),
431
- 1
432
- /* TEXT */
433
- )
434
- ])
435
- ]),
436
- _: 3
437
- /* FORWARDED */
438
- }, 16, ["class"])
439
- ]),
440
- _: 3
441
- /* FORWARDED */
442
- });
443
- };
444
- }
445
- });
446
- export {
447
- _sfc_main as default
448
- };
1
+ import{inject as e,defineComponent as t,getCurrentInstance as o,ref as r,watch as n,computed as a,resolveComponent as l,createBlock as s,openBlock as u,resolveDynamicComponent as i,unref as d,mergeProps as c,withCtx as f,renderSlot as p,createTextVNode as v,toDisplayString as m,provide as b,createElementBlock as y,toRefs as g,createVNode as k}from"vue";import"mitt";import{useElementHover as x,useFocus as S,useFocusWithin as h}from"@vueuse/core";var w=/* @__PURE__ */(e=>(e.local="local",e.session="session",e))(w||{}),L=/* @__PURE__ */(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(L||{}),_=/* @__PURE__ */(e=>(e.before="before",e.after="after",e))(_||{}),A=/* @__PURE__ */(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(A||{}),$=/* @__PURE__ */(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))($||{}),B=/* @__PURE__ */(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(B||{}),M=/* @__PURE__ */(e=>(e.listbox="listbox",e.menu="menu",e))(M||{});const O=Symbol.for("volver"),P=Symbol.for("dropdownTrigger"),D=Symbol.for("dropdownItem"),T=Symbol.for("dropdownAction"),V={to:{type:[String,Object]},href:String,target:String,rel:{type:String,default:"noopener noreferrer"}},j={disabled:{type:Boolean,default:!1}},C={active:{type:Boolean,default:!1}},H={current:{type:Boolean,default:!1}},I={pressed:{type:Boolean,default:!1}},E={label:{type:[String,Number],default:void 0}},N={modifiers:{type:[String,Array],default:void 0}};_.before,L.bottom;const q={...j,...E,...I,...C,...H,...V,type:{type:String,default:A.button,validator:e=>Object.values(A).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:$.button}};w.local;const z=/* @__PURE__ */t({name:"VvAction",props:q,emits:["click","mouseover","mouseleave"],setup(t,{expose:b,emit:y}){const g=t,k=y,x=o(),S=e(O,void 0),h=r(null);b({$el:h});const{reference:w,bus:L,aria:_,expanded:A}=e(P,{});n(()=>h.value,e=>{w&&(w.value=e)});const B=a(()=>g.pressed||A?.value),{role:M}=e(T,{}),D=a(()=>{switch(!0){case g.disabled:return $.button;case void 0!==g.to:return S?.nuxt?l($.nuxtLink):$.routerLink;case void 0!==g.href:return $.a;default:return g.defaultTag}}),V=a(()=>{const e={..._?.value,ariaPressed:!!B.value||void 0,ariaLabel:g.ariaLabel,role:M?.value};switch(D.value){case $.a:return{...e,href:g.href,target:g.target,rel:g.rel};case $.routerLink:case $.nuxtLink:return{...e,to:g.to,target:g.target};case $.button:return{...e,type:g.type,disabled:g.disabled};default:return e}});function j(e){g.disabled?e.preventDefault():x?.vnode.props?.onClick?k("click",e):L?.emit("click",e)}function C(e){x?.vnode.props?.onMouseover?k("mouseover",e):L?.emit("mouseover",e)}function H(e){x?.vnode.props?.onMouseleave?k("mouseleave",e):L?.emit("mouseleave",e)}return(e,t)=>(u(),s(i(d(D)),c(d(V),{ref_key:"element",ref:h,class:{active:e.active,pressed:d(B),disabled:e.disabled,current:e.current},onClickPassive:j,onMouseoverPassive:C,onMouseleavePassive:H}),{default:f(()=>[p(e.$slots,"default",{},()=>[v(m(e.label),1)])]),_:3},16,["class"]))}});M.menu;const F=/* @__PURE__ */t({name:"VvDropdownItem",props:{focusOnHover:{type:Boolean,default:!1}},setup(t){const o=t,{role:a,expanded:l}=e(D,{}),s=r(null);!function({expanded:e}){b(T,{role:r(B.menuitem),expanded:e})}({expanded:l});const i=x(s),{focused:f}=S(s),{focused:v}=h(s);return n(i,e=>{e&&o.focusOnHover&&(f.value=!0)}),(e,t)=>(u(),y("div",c({role:d(a)},{ref_key:"element",ref:s,class:["vv-dropdown__item",{"focus-visible":d(f)||d(v)}]}),[p(e.$slots,"default")],16))}});const G=/* @__PURE__ */t({__name:"VvDropdownAction",props:{...q,...N},setup(e){const t=e,{modifiers:o}=g(t),r=function(e,t){return a(()=>{const o={[e]:!0},r="string"==typeof t?.value?t.value.split(" "):t?.value;return r&&Array.isArray(r)&&r.forEach(t=>{t&&(o[`${e}--${t}`]=!0)}),o})}("vv-dropdown-action",o);return(e,t)=>(u(),s(F,null,{default:f(()=>[k(z,c({disabled:e.disabled,pressed:e.pressed,active:e.active,type:e.type,to:e.to,href:e.href,target:e.target,rel:e.rel},{class:d(r)}),{default:f(()=>[p(e.$slots,"default",{},()=>[v(m(e.label),1)])]),_:3},16,["class"])]),_:3}))}});export{G as default};
@@ -1,149 +1 @@
1
- import { inject, provide, ref, defineComponent, watch, createElementBlock, openBlock, mergeProps, unref, renderSlot } from "vue";
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=Symbol.for("dropdownItem"),_=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};