@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.
Files changed (98) 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 +7 -2
  4. package/dist/components/VvAccordionGroup/VvAccordionGroup.es.js +2 -702
  5. package/dist/components/VvAccordionGroup/VvAccordionGroup.vue.d.ts +5 -2
  6. package/dist/components/VvAction/VvAction.es.js +1 -302
  7. package/dist/components/VvAction/VvAction.umd.js +1 -1
  8. package/dist/components/VvAction/VvAction.vue.d.ts +3 -2
  9. package/dist/components/VvAlert/VvAlert.es.js +1 -527
  10. package/dist/components/VvAlert/VvAlert.vue.d.ts +3 -2
  11. package/dist/components/VvAlertGroup/VvAlertGroup.es.js +1 -730
  12. package/dist/components/VvAlertGroup/VvAlertGroup.vue.d.ts +3 -3
  13. package/dist/components/VvAvatar/VvAvatar.es.js +1 -132
  14. package/dist/components/VvAvatar/VvAvatar.vue.d.ts +2 -2
  15. package/dist/components/VvAvatarGroup/VvAvatarGroup.es.js +1 -250
  16. package/dist/components/VvAvatarGroup/VvAvatarGroup.vue.d.ts +2 -2
  17. package/dist/components/VvBadge/VvBadge.es.js +1 -131
  18. package/dist/components/VvBadge/VvBadge.vue.d.ts +2 -2
  19. package/dist/components/VvBreadcrumb/VvBreadcrumb.es.js +1 -410
  20. package/dist/components/VvBreadcrumb/VvBreadcrumb.umd.js +1 -1
  21. package/dist/components/VvBreadcrumb/VvBreadcrumb.vue.d.ts +2 -2
  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 +3 -2
  25. package/dist/components/VvButtonGroup/VvButtonGroup.es.js +1 -214
  26. package/dist/components/VvButtonGroup/VvButtonGroup.vue.d.ts +2 -2
  27. package/dist/components/VvCard/VvCard.es.js +1 -152
  28. package/dist/components/VvCard/VvCard.vue.d.ts +2 -2
  29. package/dist/components/VvCheckbox/VvCheckbox.es.js +1 -741
  30. package/dist/components/VvCheckbox/VvCheckbox.vue.d.ts +2 -2
  31. package/dist/components/VvCheckboxGroup/VvCheckboxGroup.es.js +1 -981
  32. package/dist/components/VvCheckboxGroup/VvCheckboxGroup.vue.d.ts +2 -2
  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 +16 -7
  36. package/dist/components/VvDialog/VvDialog.es.js +1 -317
  37. package/dist/components/VvDialog/VvDialog.vue.d.ts +4 -2
  38. package/dist/components/VvDropdown/VvDropdown.es.js +1 -750
  39. package/dist/components/VvDropdown/VvDropdown.vue.d.ts +14 -2
  40. package/dist/components/VvDropdown/VvDropdownAction.vue.d.ts +2 -2
  41. package/dist/components/VvDropdown/VvDropdownItem.vue.d.ts +2 -2
  42. package/dist/components/VvDropdown/VvDropdownOptgroup.vue.d.ts +11 -4
  43. package/dist/components/VvDropdown/VvDropdownOption.vue.d.ts +2 -2
  44. package/dist/components/VvDropdownAction/VvDropdownAction.es.js +1 -448
  45. package/dist/components/VvDropdownAction/VvDropdownAction.umd.js +1 -1
  46. package/dist/components/VvDropdownItem/VvDropdownItem.es.js +1 -149
  47. package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.es.js +1 -104
  48. package/dist/components/VvDropdownOptgroup/VvDropdownOptgroup.umd.js +1 -1
  49. package/dist/components/VvDropdownOption/VvDropdownOption.es.js +1 -281
  50. package/dist/components/VvIcon/VvIcon.es.js +1 -143
  51. package/dist/components/VvIcon/VvIcon.vue.d.ts +2 -2
  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 +34 -4
  55. package/dist/components/VvInputFile/index.d.ts +7 -0
  56. package/dist/components/VvInputText/VvInputText.es.js +4 -2790
  57. package/dist/components/VvInputText/VvInputText.umd.js +1 -1
  58. package/dist/components/VvInputText/VvInputText.vue.d.ts +8 -3
  59. package/dist/components/VvNav/VvNav.es.js +1 -438
  60. package/dist/components/VvNav/VvNav.umd.js +1 -1
  61. package/dist/components/VvNav/VvNav.vue.d.ts +2 -2
  62. package/dist/components/VvNav/VvNavItem.vue.d.ts +2 -2
  63. package/dist/components/VvNav/VvNavSeparator.vue.d.ts +1 -1
  64. package/dist/components/VvNavItem/VvNavItem.es.js +1 -337
  65. package/dist/components/VvNavItem/VvNavItem.umd.js +1 -1
  66. package/dist/components/VvNavSeparator/VvNavSeparator.es.js +1 -24
  67. package/dist/components/VvProgress/VvProgress.es.js +1 -163
  68. package/dist/components/VvProgress/VvProgress.vue.d.ts +2 -2
  69. package/dist/components/VvRadio/VvRadio.es.js +1 -661
  70. package/dist/components/VvRadio/VvRadio.vue.d.ts +2 -2
  71. package/dist/components/VvRadioGroup/VvRadioGroup.es.js +1 -901
  72. package/dist/components/VvRadioGroup/VvRadioGroup.vue.d.ts +2 -2
  73. package/dist/components/VvSelect/VvSelect.es.js +1 -1103
  74. package/dist/components/VvSelect/VvSelect.vue.d.ts +11 -7
  75. package/dist/components/VvTab/VvTab.es.js +1 -558
  76. package/dist/components/VvTab/VvTab.umd.js +1 -1
  77. package/dist/components/VvTab/VvTab.vue.d.ts +2 -2
  78. package/dist/components/VvTextarea/VvTextarea.es.js +2 -1989
  79. package/dist/components/VvTextarea/VvTextarea.vue.d.ts +3 -3
  80. package/dist/components/VvTooltip/VvTooltip.es.js +1 -154
  81. package/dist/components/VvTooltip/VvTooltip.vue.d.ts +2 -2
  82. package/dist/components/index.es.js +6 -8558
  83. package/dist/components/index.umd.js +1 -1
  84. package/dist/composables/index.es.js +2 -247
  85. package/dist/composables/index.umd.js +1 -1
  86. package/dist/directives/index.es.js +2 -311
  87. package/dist/directives/index.umd.js +1 -1
  88. package/dist/directives/v-contextmenu.es.js +2 -142
  89. package/dist/directives/v-contextmenu.umd.js +1 -1
  90. package/dist/directives/v-tooltip.es.js +1 -172
  91. package/dist/icons.es.js +1 -39
  92. package/dist/icons.umd.js +1 -1
  93. package/dist/index.es.js +1 -219
  94. package/dist/props/index.d.ts +7 -0
  95. package/dist/resolvers/unplugin.es.js +1 -187
  96. package/dist/stories/AccordionGroup/AccordionGroupSlots.stories.d.ts +2 -2
  97. package/dist/stories/Avatar/Avatar.settings.d.ts +1 -1
  98. package/package.json +47 -40
@@ -1,5 +1,7 @@
1
1
  import type { AutoPlacementOptions, FlipOptions, OffsetOptions, ShiftOptions, SizeOptions } from '../../types/floating-ui';
2
2
  import { Side, Strategy } from '../../constants';
3
+ declare const _default: typeof __VLS_export;
4
+ export default _default;
3
5
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
4
6
  modelValue: {
5
7
  type: BooleanConstructor;
@@ -72,14 +74,26 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<global
72
74
  };
73
75
  id: (StringConstructor | NumberConstructor)[];
74
76
  }>, {
77
+ /** Toggle the dropdown */
75
78
  toggle: () => void;
79
+ /** Show the dropdown */
76
80
  show: () => void;
81
+ /** Hide the dropdown */
77
82
  hide: () => void;
83
+ /**
84
+ * Initialize the dropdown
85
+ * @param {HTMLElement} el - The dropdown reference element to attach to
86
+ */
78
87
  init: (el: HTMLElement) => void;
88
+ /** Focus the first focusable element */
79
89
  focusFirst: () => void;
90
+ /** Focus the first focusable element in the list */
80
91
  focusFirstListElement: () => void;
92
+ /** Focus the next focusable element */
81
93
  focusNext: () => void;
94
+ /** Focus the previous focusable element */
82
95
  focusPrev: () => void;
96
+ /** The dropdown has custom position */
83
97
  customPosition: globalThis.Ref<boolean, boolean>;
84
98
  }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
85
99
  "update:modelValue": (...args: any[]) => void;
@@ -315,8 +329,6 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<global
315
329
  expanded: boolean;
316
330
  }) => any;
317
331
  }>;
318
- declare const _default: typeof __VLS_export;
319
- export default _default;
320
332
  type __VLS_WithSlots<T, S> = T & {
321
333
  new (): {
322
334
  $slots: S;
@@ -1,6 +1,6 @@
1
- declare var __VLS_10: {};
1
+ declare var __VLS_14: {};
2
2
  type __VLS_Slots = {} & {
3
- default?: (props: typeof __VLS_10) => any;
3
+ default?: (props: typeof __VLS_14) => any;
4
4
  };
5
5
  declare const __VLS_base: import("vue").DefineComponent<globalThis.ExtractPropTypes<{
6
6
  modifiers: {
@@ -1,3 +1,5 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
1
3
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
4
  focusOnHover: {
3
5
  type: BooleanConstructor;
@@ -13,8 +15,6 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<global
13
15
  }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
14
16
  default?: (props: {}) => any;
15
17
  }>;
16
- declare const _default: typeof __VLS_export;
17
- export default _default;
18
18
  type __VLS_WithSlots<T, S> = T & {
19
19
  new (): {
20
20
  $slots: S;
@@ -1,4 +1,6 @@
1
- declare const __VLS_export: import("vue").DefineComponent<globalThis.ExtractPropTypes<{
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
3
+ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
4
  label: {
3
5
  type: (StringConstructor | NumberConstructor)[];
4
6
  default: undefined;
@@ -10,6 +12,11 @@ declare const __VLS_export: import("vue").DefineComponent<globalThis.ExtractProp
10
12
  };
11
13
  }>> & Readonly<{}>, {
12
14
  label: string | number;
13
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
14
- declare const _default: typeof __VLS_export;
15
- export default _default;
15
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>, {
16
+ default?: (props: {}) => any;
17
+ }>;
18
+ type __VLS_WithSlots<T, S> = T & {
19
+ new (): {
20
+ $slots: S;
21
+ };
22
+ };
@@ -1,3 +1,5 @@
1
+ declare const _default: typeof __VLS_export;
2
+ export default _default;
1
3
  declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<globalThis.ExtractPropTypes<{
2
4
  deselectHintLabel: {
3
5
  type: StringConstructor;
@@ -73,8 +75,6 @@ declare const __VLS_export: __VLS_WithSlots<import("vue").DefineComponent<global
73
75
  unselectable: boolean;
74
76
  }) => any;
75
77
  }>;
76
- declare const _default: typeof __VLS_export;
77
- export default _default;
78
78
  type __VLS_WithSlots<T, S> = T & {
79
79
  new (): {
80
80
  $slots: S;
@@ -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=/* @__PURE__ */Symbol.for("volver"),P=/* @__PURE__ */Symbol.for("dropdownTrigger"),D=/* @__PURE__ */Symbol.for("dropdownItem"),T=/* @__PURE__ */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}},E={current:{type:Boolean,default:!1}},H={pressed:{type:Boolean,default:!1}},I={label:{type:[String,Number],default:void 0}},N={modifiers:{type:[String,Array],default:void 0}};_.before,L.bottom;const q={...j,...I,...H,...C,...E,...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 E(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:"rootEl",ref:h,class:{active:e.active,pressed:d(B),disabled:e.disabled,current:e.current},onClickPassive:j,onMouseoverPassive:C,onMouseleavePassive:E}),{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 +1 @@
1
- !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("mitt"),require("@vueuse/core")):"function"==typeof define&&define.amd?define(["vue","mitt","@vueuse/core"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvDropdownAction=t(e.vue,null,e.core)}(this,function(e,t,o){"use strict";var r=(e=>(e.local="local",e.session="session",e))(r||{}),n=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(n||{}),u=(e=>(e.before="before",e.after="after",e))(u||{}),l=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(l||{}),a=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(a||{}),s=(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(s||{}),i=(e=>(e.listbox="listbox",e.menu="menu",e))(i||{});const d=Symbol.for("volver"),c=Symbol.for("dropdownTrigger"),f=Symbol.for("dropdownItem"),p=Symbol.for("dropdownAction"),v={to:{type:[String,Object]},href:String,target:String,rel:{type:String,default:"noopener noreferrer"}},m={disabled:{type:Boolean,default:!1}},b={active:{type:Boolean,default:!1}},y={current:{type:Boolean,default:!1}},g={pressed:{type:Boolean,default:!1}},k={label:{type:[String,Number],default:void 0}},h={modifiers:{type:[String,Array],default:void 0}};u.before,n.bottom;const x={...m,...k,...g,...b,...y,...v,type:{type:String,default:l.button,validator:e=>Object.values(l).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:a.button}};r.local;const S=x;const w=e.defineComponent({name:"VvAction",props:S,emits:["click","mouseover","mouseleave"],setup(t,{expose:o,emit:r}){const n=t,u=r,l=e.getCurrentInstance(),s=e.inject(d,void 0),i=e.ref(null);o({$el:i});const{reference:f,bus:v,aria:m,expanded:b}=e.inject(c,{});e.watch(()=>i.value,e=>{f&&(f.value=e)});const y=e.computed(()=>n.pressed||b?.value),{role:g}=e.inject(p,{}),k=e.computed(()=>{switch(!0){case n.disabled:return a.button;case void 0!==n.to:return s?.nuxt?e.resolveComponent(a.nuxtLink):a.routerLink;case void 0!==n.href:return a.a;default:return n.defaultTag}}),h=e.computed(()=>{const e={...m?.value,ariaPressed:!!y.value||void 0,ariaLabel:n.ariaLabel,role:g?.value};switch(k.value){case a.a:return{...e,href:n.href,target:n.target,rel:n.rel};case a.routerLink:case a.nuxtLink:return{...e,to:n.to,target:n.target};case a.button:return{...e,type:n.type,disabled:n.disabled};default:return e}});function x(e){n.disabled?e.preventDefault():l?.vnode.props?.onClick?u("click",e):v?.emit("click",e)}function S(e){l?.vnode.props?.onMouseover?u("mouseover",e):v?.emit("mouseover",e)}function w(e){l?.vnode.props?.onMouseleave?u("mouseleave",e):v?.emit("mouseleave",e)}return(t,o)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(k)),e.mergeProps(e.unref(h),{ref_key:"element",ref:i,class:{active:t.active,pressed:e.unref(y),disabled:t.disabled,current:t.current},onClickPassive:x,onMouseoverPassive:S,onMouseleavePassive:w}),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])]),_:3},16,["class"]))}});i.menu;const B={focusOnHover:{type:Boolean,default:!1}};const C=e.defineComponent({name:"VvDropdownItem",props:B,setup(t){const r=t,{role:n,expanded:u}=e.inject(f,{}),l=e.ref(null);!function({expanded:t}){e.provide(p,{role:e.ref(s.menuitem),expanded:t})}({expanded:u});const a=o.useElementHover(l),{focused:i}=o.useFocus(l),{focused:d}=o.useFocusWithin(l);return e.watch(a,e=>{e&&r.focusOnHover&&(i.value=!0)}),(t,o)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps({role:e.unref(n)},{ref_key:"element",ref:l,class:["vv-dropdown__item",{"focus-visible":e.unref(i)||e.unref(d)}]}),[e.renderSlot(t.$slots,"default")],16))}});return e.defineComponent({__name:"VvDropdownAction",props:{...x,...h},setup(t){const o=t,{modifiers:r}=e.toRefs(o),n=function(t,o){return e.computed(()=>{const e={[t]:!0},r="string"==typeof o?.value?o.value.split(" "):o?.value;return r&&Array.isArray(r)&&r.forEach(o=>{o&&(e[`${t}--${o}`]=!0)}),e})}("vv-dropdown-action",r);return(t,o)=>(e.openBlock(),e.createBlock(C,null,{default:e.withCtx(()=>[e.createVNode(w,e.mergeProps({disabled:t.disabled,pressed:t.pressed,active:t.active,type:t.type,to:t.to,href:t.href,target:t.target,rel:t.rel},{class:e.unref(n)}),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])]),_:3},16,["class"])]),_:3}))}})});
1
+ !function(e,t){"object"==typeof exports&&"undefined"!=typeof module?module.exports=t(require("vue"),require("mitt"),require("@vueuse/core")):"function"==typeof define&&define.amd?define(["vue","mitt","@vueuse/core"],t):(e="undefined"!=typeof globalThis?globalThis:e||self).VvDropdownAction=t(e.vue,null,e.core)}(this,function(e,t,o){"use strict";var r=(e=>(e.local="local",e.session="session",e))(r||{}),n=(e=>(e.left="left",e.right="right",e.top="top",e.bottom="bottom",e))(n||{}),u=(e=>(e.before="before",e.after="after",e))(u||{}),l=(e=>(e.button="button",e.submit="submit",e.reset="reset",e))(l||{}),a=(e=>(e.nuxtLink="nuxt-link",e.routerLink="router-link",e.a="a",e.button="button",e))(a||{}),s=(e=>(e.button="button",e.link="link",e.menuitem="menuitem",e))(s||{}),i=(e=>(e.listbox="listbox",e.menu="menu",e))(i||{});const d=Symbol.for("volver"),c=Symbol.for("dropdownTrigger"),f=Symbol.for("dropdownItem"),p=Symbol.for("dropdownAction"),v={to:{type:[String,Object]},href:String,target:String,rel:{type:String,default:"noopener noreferrer"}},m={disabled:{type:Boolean,default:!1}},b={active:{type:Boolean,default:!1}},y={current:{type:Boolean,default:!1}},g={pressed:{type:Boolean,default:!1}},k={label:{type:[String,Number],default:void 0}},h={modifiers:{type:[String,Array],default:void 0}};u.before,n.bottom;const x={...m,...k,...g,...b,...y,...v,type:{type:String,default:l.button,validator:e=>Object.values(l).includes(e)},ariaLabel:{type:String,default:void 0},defaultTag:{type:String,default:a.button}};r.local;const S=x;const w=e.defineComponent({name:"VvAction",props:S,emits:["click","mouseover","mouseleave"],setup(t,{expose:o,emit:r}){const n=t,u=r,l=e.getCurrentInstance(),s=e.inject(d,void 0),i=e.ref(null);o({$el:i});const{reference:f,bus:v,aria:m,expanded:b}=e.inject(c,{});e.watch(()=>i.value,e=>{f&&(f.value=e)});const y=e.computed(()=>n.pressed||b?.value),{role:g}=e.inject(p,{}),k=e.computed(()=>{switch(!0){case n.disabled:return a.button;case void 0!==n.to:return s?.nuxt?e.resolveComponent(a.nuxtLink):a.routerLink;case void 0!==n.href:return a.a;default:return n.defaultTag}}),h=e.computed(()=>{const e={...m?.value,ariaPressed:!!y.value||void 0,ariaLabel:n.ariaLabel,role:g?.value};switch(k.value){case a.a:return{...e,href:n.href,target:n.target,rel:n.rel};case a.routerLink:case a.nuxtLink:return{...e,to:n.to,target:n.target};case a.button:return{...e,type:n.type,disabled:n.disabled};default:return e}});function x(e){n.disabled?e.preventDefault():l?.vnode.props?.onClick?u("click",e):v?.emit("click",e)}function S(e){l?.vnode.props?.onMouseover?u("mouseover",e):v?.emit("mouseover",e)}function w(e){l?.vnode.props?.onMouseleave?u("mouseleave",e):v?.emit("mouseleave",e)}return(t,o)=>(e.openBlock(),e.createBlock(e.resolveDynamicComponent(e.unref(k)),e.mergeProps(e.unref(h),{ref_key:"rootEl",ref:i,class:{active:t.active,pressed:e.unref(y),disabled:t.disabled,current:t.current},onClickPassive:x,onMouseoverPassive:S,onMouseleavePassive:w}),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])]),_:3},16,["class"]))}});i.menu;const B={focusOnHover:{type:Boolean,default:!1}};const C=e.defineComponent({name:"VvDropdownItem",props:B,setup(t){const r=t,{role:n,expanded:u}=e.inject(f,{}),l=e.ref(null);!function({expanded:t}){e.provide(p,{role:e.ref(s.menuitem),expanded:t})}({expanded:u});const a=o.useElementHover(l),{focused:i}=o.useFocus(l),{focused:d}=o.useFocusWithin(l);return e.watch(a,e=>{e&&r.focusOnHover&&(i.value=!0)}),(t,o)=>(e.openBlock(),e.createElementBlock("div",e.mergeProps({role:e.unref(n)},{ref_key:"element",ref:l,class:["vv-dropdown__item",{"focus-visible":e.unref(i)||e.unref(d)}]}),[e.renderSlot(t.$slots,"default")],16))}});return e.defineComponent({__name:"VvDropdownAction",props:{...x,...h},setup(t){const o=t,{modifiers:r}=e.toRefs(o),n=function(t,o){return e.computed(()=>{const e={[t]:!0},r="string"==typeof o?.value?o.value.split(" "):o?.value;return r&&Array.isArray(r)&&r.forEach(o=>{o&&(e[`${t}--${o}`]=!0)}),e})}("vv-dropdown-action",r);return(t,o)=>(e.openBlock(),e.createBlock(C,null,{default:e.withCtx(()=>[e.createVNode(w,e.mergeProps({disabled:t.disabled,pressed:t.pressed,active:t.active,type:t.type,to:t.to,href:t.href,target:t.target,rel:t.rel},{class:e.unref(n)}),{default:e.withCtx(()=>[e.renderSlot(t.$slots,"default",{},()=>[e.createTextVNode(e.toDisplayString(t.label),1)])]),_:3},16,["class"])]),_:3}))}})});