@nuxt/ui 3.1.3 → 3.3.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (208) hide show
  1. package/.nuxt/ui/avatar.ts +1 -1
  2. package/.nuxt/ui/button.ts +42 -42
  3. package/.nuxt/ui/card.ts +1 -1
  4. package/.nuxt/ui/carousel.ts +1 -1
  5. package/.nuxt/ui/command-palette.ts +3 -1
  6. package/.nuxt/ui/drawer.ts +1 -1
  7. package/.nuxt/ui/file-upload.ts +290 -0
  8. package/.nuxt/ui/index.ts +3 -0
  9. package/.nuxt/ui/input-menu.ts +24 -10
  10. package/.nuxt/ui/input-tags.ts +310 -0
  11. package/.nuxt/ui/kbd.ts +167 -3
  12. package/.nuxt/ui/modal.ts +1 -1
  13. package/.nuxt/ui/navigation-menu.ts +1 -1
  14. package/.nuxt/ui/select-menu.ts +11 -6
  15. package/.nuxt/ui/select.ts +11 -6
  16. package/.nuxt/ui/table.ts +11 -2
  17. package/.nuxt/ui/tabs.ts +4 -2
  18. package/.nuxt/ui/timeline.ts +321 -0
  19. package/.nuxt/ui/toast.ts +8 -15
  20. package/.nuxt/ui/toaster.ts +1 -1
  21. package/.nuxt/ui/tooltip.ts +1 -1
  22. package/cli/templates.mjs +11 -7
  23. package/dist/module.d.mts +15 -1
  24. package/dist/module.json +1 -1
  25. package/dist/module.mjs +3 -3
  26. package/dist/runtime/components/Accordion.vue.d.ts +1 -1
  27. package/dist/runtime/components/Alert.vue +0 -1
  28. package/dist/runtime/components/Alert.vue.d.ts +2 -2
  29. package/dist/runtime/components/App.vue.d.ts +1 -1
  30. package/dist/runtime/components/Avatar.vue +10 -2
  31. package/dist/runtime/components/Avatar.vue.d.ts +3 -1
  32. package/dist/runtime/components/AvatarGroup.vue.d.ts +1 -1
  33. package/dist/runtime/components/Badge.vue.d.ts +1 -1
  34. package/dist/runtime/components/Breadcrumb.vue.d.ts +1 -1
  35. package/dist/runtime/components/Button.vue +6 -6
  36. package/dist/runtime/components/Button.vue.d.ts +1 -5
  37. package/dist/runtime/components/ButtonGroup.vue.d.ts +1 -1
  38. package/dist/runtime/components/Calendar.vue +4 -1
  39. package/dist/runtime/components/Calendar.vue.d.ts +1 -1
  40. package/dist/runtime/components/Card.vue.d.ts +1 -1
  41. package/dist/runtime/components/Carousel.vue +19 -16
  42. package/dist/runtime/components/Carousel.vue.d.ts +1 -1
  43. package/dist/runtime/components/Checkbox.vue +1 -1
  44. package/dist/runtime/components/Checkbox.vue.d.ts +1 -1
  45. package/dist/runtime/components/CheckboxGroup.vue.d.ts +1 -1
  46. package/dist/runtime/components/Chip.vue.d.ts +2 -2
  47. package/dist/runtime/components/Collapsible.vue.d.ts +1 -1
  48. package/dist/runtime/components/ColorPicker.vue +1 -2
  49. package/dist/runtime/components/ColorPicker.vue.d.ts +1 -1
  50. package/dist/runtime/components/CommandPalette.vue +84 -16
  51. package/dist/runtime/components/CommandPalette.vue.d.ts +38 -9
  52. package/dist/runtime/components/Container.vue.d.ts +1 -1
  53. package/dist/runtime/components/ContextMenu.vue.d.ts +1 -1
  54. package/dist/runtime/components/ContextMenuContent.vue.d.ts +5 -21
  55. package/dist/runtime/components/Drawer.vue +4 -4
  56. package/dist/runtime/components/Drawer.vue.d.ts +6 -1
  57. package/dist/runtime/components/DropdownMenu.vue.d.ts +1 -1
  58. package/dist/runtime/components/DropdownMenuContent.vue.d.ts +12 -25
  59. package/dist/runtime/components/FileUpload.vue +242 -0
  60. package/dist/runtime/components/FileUpload.vue.d.ts +167 -0
  61. package/dist/runtime/components/Form.vue +6 -6
  62. package/dist/runtime/components/Form.vue.d.ts +15 -13
  63. package/dist/runtime/components/FormField.vue +2 -2
  64. package/dist/runtime/components/FormField.vue.d.ts +4 -4
  65. package/dist/runtime/components/Icon.vue.d.ts +1 -1
  66. package/dist/runtime/components/Input.vue +10 -7
  67. package/dist/runtime/components/Input.vue.d.ts +9 -9
  68. package/dist/runtime/components/InputMenu.vue +17 -10
  69. package/dist/runtime/components/InputMenu.vue.d.ts +19 -16
  70. package/dist/runtime/components/InputNumber.vue +3 -2
  71. package/dist/runtime/components/InputNumber.vue.d.ts +5 -5
  72. package/dist/runtime/components/InputTags.vue +161 -0
  73. package/dist/runtime/components/InputTags.vue.d.ts +185 -0
  74. package/dist/runtime/components/Kbd.vue +2 -1
  75. package/dist/runtime/components/Kbd.vue.d.ts +5 -1
  76. package/dist/runtime/components/Link.vue +6 -5
  77. package/dist/runtime/components/Link.vue.d.ts +1 -3
  78. package/dist/runtime/components/LinkBase.vue.d.ts +1 -1
  79. package/dist/runtime/components/Modal.vue +14 -13
  80. package/dist/runtime/components/Modal.vue.d.ts +16 -6
  81. package/dist/runtime/components/NavigationMenu.vue +19 -17
  82. package/dist/runtime/components/NavigationMenu.vue.d.ts +1 -1
  83. package/dist/runtime/components/OverlayProvider.vue +2 -2
  84. package/dist/runtime/components/OverlayProvider.vue.d.ts +1 -1
  85. package/dist/runtime/components/Pagination.vue +1 -1
  86. package/dist/runtime/components/Pagination.vue.d.ts +1 -2
  87. package/dist/runtime/components/PinInput.vue +4 -3
  88. package/dist/runtime/components/PinInput.vue.d.ts +22 -19
  89. package/dist/runtime/components/Popover.vue +2 -1
  90. package/dist/runtime/components/Popover.vue.d.ts +8 -2
  91. package/dist/runtime/components/Progress.vue +2 -1
  92. package/dist/runtime/components/Progress.vue.d.ts +2 -2
  93. package/dist/runtime/components/RadioGroup.vue +3 -3
  94. package/dist/runtime/components/RadioGroup.vue.d.ts +5 -4
  95. package/dist/runtime/components/Select.vue +23 -4
  96. package/dist/runtime/components/Select.vue.d.ts +108 -2
  97. package/dist/runtime/components/SelectMenu.vue +33 -11
  98. package/dist/runtime/components/SelectMenu.vue.d.ts +106 -2
  99. package/dist/runtime/components/Separator.vue.d.ts +1 -1
  100. package/dist/runtime/components/Skeleton.vue.d.ts +1 -1
  101. package/dist/runtime/components/Slideover.vue +14 -13
  102. package/dist/runtime/components/Slideover.vue.d.ts +16 -6
  103. package/dist/runtime/components/Slider.vue.d.ts +5 -5
  104. package/dist/runtime/components/Stepper.vue.d.ts +1 -1
  105. package/dist/runtime/components/Switch.vue.d.ts +1 -1
  106. package/dist/runtime/components/Table.vue +90 -9
  107. package/dist/runtime/components/Table.vue.d.ts +30 -12
  108. package/dist/runtime/components/Tabs.vue +24 -4
  109. package/dist/runtime/components/Tabs.vue.d.ts +12 -4
  110. package/dist/runtime/components/Textarea.vue +10 -7
  111. package/dist/runtime/components/Textarea.vue.d.ts +14 -12
  112. package/dist/runtime/components/Timeline.vue +92 -0
  113. package/dist/runtime/components/Timeline.vue.d.ts +70 -0
  114. package/dist/runtime/components/Toast.vue +16 -9
  115. package/dist/runtime/components/Toast.vue.d.ts +14 -13
  116. package/dist/runtime/components/Toaster.vue.d.ts +1 -1
  117. package/dist/runtime/components/Tooltip.vue +2 -1
  118. package/dist/runtime/components/Tooltip.vue.d.ts +8 -2
  119. package/dist/runtime/components/Tree.vue +6 -4
  120. package/dist/runtime/components/Tree.vue.d.ts +2 -2
  121. package/dist/runtime/composables/defineLocale.d.ts +2 -0
  122. package/dist/runtime/composables/defineLocale.js +4 -0
  123. package/dist/runtime/composables/defineShortcuts.js +7 -5
  124. package/dist/runtime/composables/useAvatarGroup.d.ts +1 -1
  125. package/dist/runtime/composables/useComponentIcons.d.ts +1 -1
  126. package/dist/runtime/composables/useFileUpload.d.ts +19 -0
  127. package/dist/runtime/composables/useFileUpload.js +63 -0
  128. package/dist/runtime/composables/useFormField.d.ts +3 -6
  129. package/dist/runtime/composables/useFormField.js +5 -2
  130. package/dist/runtime/composables/useKbd.d.ts +1 -1
  131. package/dist/runtime/composables/useLocale.js +2 -2
  132. package/dist/runtime/composables/useOverlay.d.ts +30 -2
  133. package/dist/runtime/composables/useOverlay.js +8 -7
  134. package/dist/runtime/composables/usePortal.d.ts +1 -1
  135. package/dist/runtime/inertia/components/Link.vue.d.ts +1 -1
  136. package/dist/runtime/inertia/components/LinkBase.vue.d.ts +1 -1
  137. package/dist/runtime/inertia/stubs.d.ts +1 -0
  138. package/dist/runtime/inertia/stubs.js +4 -2
  139. package/dist/runtime/locale/ar.js +4 -2
  140. package/dist/runtime/locale/az.js +3 -1
  141. package/dist/runtime/locale/bg.js +3 -1
  142. package/dist/runtime/locale/bn.js +3 -1
  143. package/dist/runtime/locale/ca.js +3 -1
  144. package/dist/runtime/locale/ckb.js +4 -2
  145. package/dist/runtime/locale/cs.js +3 -1
  146. package/dist/runtime/locale/da.js +3 -1
  147. package/dist/runtime/locale/de.js +3 -1
  148. package/dist/runtime/locale/el.js +3 -1
  149. package/dist/runtime/locale/en.js +3 -1
  150. package/dist/runtime/locale/es.js +3 -1
  151. package/dist/runtime/locale/et.js +3 -1
  152. package/dist/runtime/locale/fa_ir.js +3 -1
  153. package/dist/runtime/locale/fi.js +3 -1
  154. package/dist/runtime/locale/fr.js +3 -1
  155. package/dist/runtime/locale/he.js +3 -1
  156. package/dist/runtime/locale/hi.js +4 -2
  157. package/dist/runtime/locale/hu.js +3 -1
  158. package/dist/runtime/locale/hy.js +3 -1
  159. package/dist/runtime/locale/id.js +3 -1
  160. package/dist/runtime/locale/index.d.ts +1 -0
  161. package/dist/runtime/locale/index.js +1 -0
  162. package/dist/runtime/locale/it.js +3 -1
  163. package/dist/runtime/locale/ja.js +3 -1
  164. package/dist/runtime/locale/kk.js +3 -1
  165. package/dist/runtime/locale/km.js +4 -2
  166. package/dist/runtime/locale/ko.js +3 -1
  167. package/dist/runtime/locale/ky.js +3 -1
  168. package/dist/runtime/locale/lb.d.ts +3 -0
  169. package/dist/runtime/locale/lb.js +56 -0
  170. package/dist/runtime/locale/lt.js +3 -1
  171. package/dist/runtime/locale/mn.js +3 -1
  172. package/dist/runtime/locale/ms.js +3 -1
  173. package/dist/runtime/locale/nb_no.js +3 -1
  174. package/dist/runtime/locale/nl.js +3 -1
  175. package/dist/runtime/locale/pl.js +3 -1
  176. package/dist/runtime/locale/pt.js +3 -1
  177. package/dist/runtime/locale/pt_br.js +3 -1
  178. package/dist/runtime/locale/ro.js +3 -1
  179. package/dist/runtime/locale/ru.js +3 -1
  180. package/dist/runtime/locale/sk.js +3 -1
  181. package/dist/runtime/locale/sl.js +3 -1
  182. package/dist/runtime/locale/sv.js +3 -1
  183. package/dist/runtime/locale/th.js +3 -1
  184. package/dist/runtime/locale/tj.js +3 -1
  185. package/dist/runtime/locale/tr.js +3 -1
  186. package/dist/runtime/locale/ug_cn.js +3 -1
  187. package/dist/runtime/locale/uk.js +3 -1
  188. package/dist/runtime/locale/ur.js +3 -1
  189. package/dist/runtime/locale/uz.js +3 -1
  190. package/dist/runtime/locale/vi.js +3 -1
  191. package/dist/runtime/locale/zh_cn.js +3 -1
  192. package/dist/runtime/locale/zh_tw.js +3 -1
  193. package/dist/runtime/types/form.d.ts +11 -10
  194. package/dist/runtime/types/index.d.ts +3 -0
  195. package/dist/runtime/types/index.js +3 -0
  196. package/dist/runtime/types/locale.d.ts +2 -0
  197. package/dist/runtime/types/utils.d.ts +3 -0
  198. package/dist/runtime/utils/index.d.ts +1 -0
  199. package/dist/runtime/utils/index.js +9 -0
  200. package/dist/runtime/vue/components/Icon.vue.d.ts +1 -1
  201. package/dist/runtime/vue/components/Link.vue.d.ts +1 -1
  202. package/dist/runtime/vue/stubs.d.ts +1 -0
  203. package/dist/runtime/vue/stubs.js +3 -1
  204. package/dist/shared/{ui.Bix4DSU4.mjs → ui.BkSj2DmF.mjs} +560 -55
  205. package/dist/unplugin.d.mts +2 -0
  206. package/dist/unplugin.mjs +6 -3
  207. package/dist/vite.mjs +1 -1
  208. package/package.json +37 -38
@@ -18,6 +18,7 @@ import UIcon from "./Icon.vue";
18
18
  import UBadge from "./Badge.vue";
19
19
  import UPopover from "./Popover.vue";
20
20
  import UTooltip from "./Tooltip.vue";
21
+ defineOptions({ inheritAttrs: false });
21
22
  const props = defineProps({
22
23
  as: { type: null, required: false },
23
24
  trailingIcon: { type: String, required: false },
@@ -88,19 +89,13 @@ const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.navigationMen
88
89
  const lists = computed(
89
90
  () => props.items?.length ? isArrayOfArray(props.items) ? props.items : [props.items] : []
90
91
  );
91
- function getAccordionDefaultValue(list) {
92
- function findItemsWithDefaultOpen(items, level = 0) {
93
- return items.reduce((acc, item, index) => {
94
- if (item.defaultOpen || item.open) {
95
- acc.push(item.value || (level > 0 ? `item-${level}-${index}` : `item-${index}`));
96
- }
97
- if (item.children?.length) {
98
- acc.push(...findItemsWithDefaultOpen(item.children, level + 1));
99
- }
100
- return acc;
101
- }, []);
102
- }
103
- const indexes = findItemsWithDefaultOpen(list);
92
+ function getAccordionDefaultValue(list, level = 0) {
93
+ const indexes = list.reduce((acc, item, index) => {
94
+ if (item.defaultOpen || item.open) {
95
+ acc.push(item.value || (level > 0 ? `item-${level}-${index}` : `item-${index}`));
96
+ }
97
+ return acc;
98
+ }, []);
104
99
  return props.type === "single" ? indexes[0] : indexes;
105
100
  }
106
101
  </script>
@@ -127,7 +122,7 @@ function getAccordionDefaultValue(list) {
127
122
  <component :is="orientation === 'vertical' && item.children?.length && !collapsed ? AccordionTrigger : 'span'" v-if="(!collapsed || orientation !== 'vertical') && (item.badge || orientation === 'horizontal' && (item.children?.length || !!slots[item.slot ? `${item.slot}-content` : 'item-content']) || orientation === 'vertical' && item.children?.length || item.trailingIcon || !!slots[item.slot ? `${item.slot}-trailing` : 'item-trailing'])" as="span" :class="ui.linkTrailing({ class: [props.ui?.linkTrailing, item.ui?.linkTrailing] })" @click.stop.prevent>
128
123
  <slot :name="item.slot ? `${item.slot}-trailing` : 'item-trailing'" :item="item" :active="active" :index="index">
129
124
  <UBadge
130
- v-if="item.badge"
125
+ v-if="item.badge !== void 0"
131
126
  color="neutral"
132
127
  variant="outline"
133
128
  :size="item.ui?.linkTrailingBadgeSize || props.ui?.linkTrailingBadgeSize || ui.linkTrailingBadgeSize()"
@@ -228,7 +223,14 @@ function getAccordionDefaultValue(list) {
228
223
  </ULink>
229
224
 
230
225
  <AccordionContent v-if="orientation === 'vertical' && item.children?.length && !collapsed" :class="ui.content({ class: [props.ui?.content, item.ui?.content] })">
231
- <ul :class="ui.childList({ class: props.ui?.childList })">
226
+ <AccordionRoot
227
+ v-bind="{
228
+ ...accordionProps,
229
+ defaultValue: getAccordionDefaultValue(item.children, level + 1)
230
+ }"
231
+ as="ul"
232
+ :class="ui.childList({ class: props.ui?.childList })"
233
+ >
232
234
  <ReuseItemTemplate
233
235
  v-for="(childItem, childIndex) in item.children"
234
236
  :key="childIndex"
@@ -237,12 +239,12 @@ function getAccordionDefaultValue(list) {
237
239
  :level="level + 1"
238
240
  :class="ui.childItem({ class: [props.ui?.childItem, childItem.ui?.childItem] })"
239
241
  />
240
- </ul>
242
+ </AccordionRoot>
241
243
  </AccordionContent>
242
244
  </component>
243
245
  </DefineItemTemplate>
244
246
 
245
- <NavigationMenuRoot v-bind="rootProps" :data-collapsed="collapsed" :class="ui.root({ class: [props.ui?.root, props.class] })">
247
+ <NavigationMenuRoot v-bind="{ ...rootProps, ...$attrs }" :data-collapsed="collapsed" :class="ui.root({ class: [props.ui?.root, props.class] })">
246
248
  <slot name="list-leading" />
247
249
 
248
250
  <template v-for="(list, listIndex) in lists" :key="`list-${listIndex}`">
@@ -166,5 +166,5 @@ declare const _default: <T extends ArrayOrNested<NavigationMenuItem>>(__VLS_prop
166
166
  };
167
167
  export default _default;
168
168
  type __VLS_PrettifyLocal<T> = {
169
- [K in keyof T]: T[K];
169
+ [K in keyof T as K]: T[K];
170
170
  } & {};
@@ -1,11 +1,11 @@
1
1
  <script setup>
2
2
  import { computed } from "vue";
3
3
  import { useOverlay } from "../composables/useOverlay";
4
- const { overlays, unMount, close } = useOverlay();
4
+ const { overlays, unmount, close } = useOverlay();
5
5
  const mountedOverlays = computed(() => overlays.filter((overlay) => overlay.isMounted));
6
6
  const onAfterLeave = (id) => {
7
7
  close(id);
8
- unMount(id);
8
+ unmount(id);
9
9
  };
10
10
  const onClose = (id, value) => {
11
11
  close(id, value);
@@ -1,2 +1,2 @@
1
- declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
1
+ declare const _default: import("vue").DefineComponent<{}, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
2
2
  export default _default;
@@ -22,7 +22,7 @@ const props = defineProps({
22
22
  activeColor: { type: null, required: false, default: "primary" },
23
23
  activeVariant: { type: null, required: false, default: "solid" },
24
24
  showControls: { type: Boolean, required: false, default: true },
25
- size: { type: null, required: false, default: "md" },
25
+ size: { type: null, required: false },
26
26
  to: { type: Function, required: false },
27
27
  class: { type: null, required: false },
28
28
  ui: { type: null, required: false },
@@ -95,12 +95,11 @@ export interface PaginationSlots {
95
95
  index: number;
96
96
  }): any;
97
97
  }
98
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PaginationProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
98
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PaginationProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
99
99
  "update:page": (value: number) => any;
100
100
  }, string, import("vue").PublicProps, Readonly<PaginationProps> & Readonly<{
101
101
  "onUpdate:page"?: ((value: number) => any) | undefined;
102
102
  }>, {
103
- size: "xs" | "sm" | "md" | "lg" | "xl";
104
103
  color: "error" | "info" | "primary" | "secondary" | "success" | "warning" | "neutral";
105
104
  activeColor: "error" | "info" | "primary" | "secondary" | "success" | "warning" | "neutral";
106
105
  variant: "link" | "solid" | "outline" | "soft" | "subtle" | "ghost";
@@ -25,16 +25,16 @@ const props = defineProps({
25
25
  disabled: { type: Boolean, required: false },
26
26
  id: { type: String, required: false },
27
27
  mask: { type: Boolean, required: false },
28
- modelValue: { type: [Array, null], required: false },
28
+ modelValue: { type: null, required: false },
29
29
  name: { type: String, required: false },
30
30
  otp: { type: Boolean, required: false },
31
31
  placeholder: { type: String, required: false },
32
32
  required: { type: Boolean, required: false },
33
- type: { type: String, required: false, default: "text" }
33
+ type: { type: null, required: false, default: "text" }
34
34
  });
35
35
  const emits = defineEmits(["update:modelValue", "complete", "change", "blur"]);
36
36
  const appConfig = useAppConfig();
37
- const rootProps = useForwardPropsEmits(reactivePick(props, "defaultValue", "disabled", "id", "mask", "modelValue", "name", "otp", "placeholder", "required", "type"), emits);
37
+ const rootProps = useForwardPropsEmits(reactivePick(props, "defaultValue", "disabled", "id", "mask", "modelValue", "name", "otp", "required", "type"), emits);
38
38
  const { emitFormInput, emitFormFocus, emitFormChange, emitFormBlur, size, color, id, name, highlight, disabled, ariaAttrs } = useFormField(props);
39
39
  const ui = computed(() => tv({ extend: tv(theme), ...appConfig.ui?.pinInput || {} })({
40
40
  color: color.value,
@@ -75,6 +75,7 @@ defineExpose({
75
75
  v-bind="{ ...rootProps, ...ariaAttrs }"
76
76
  :id="id"
77
77
  :name="name"
78
+ :placeholder="placeholder"
78
79
  :class="ui.root({ class: [props.ui?.root, props.class] })"
79
80
  @update:model-value="emitFormInput()"
80
81
  @complete="onComplete"
@@ -4,7 +4,8 @@ import type { AppConfig } from '@nuxt/schema';
4
4
  import theme from '#build/ui/pin-input';
5
5
  import type { ComponentConfig } from '../types/utils';
6
6
  type PinInput = ComponentConfig<typeof theme, AppConfig, 'pinInput'>;
7
- export interface PinInputProps extends Pick<PinInputRootProps, 'defaultValue' | 'disabled' | 'id' | 'mask' | 'modelValue' | 'name' | 'otp' | 'placeholder' | 'required' | 'type'> {
7
+ type PinInputType = 'text' | 'number';
8
+ export interface PinInputProps<T extends PinInputType = 'text'> extends Pick<PinInputRootProps<T>, 'defaultValue' | 'disabled' | 'id' | 'mask' | 'modelValue' | 'name' | 'otp' | 'placeholder' | 'required' | 'type'> {
8
9
  /**
9
10
  * The element or component this component should render as.
10
11
  * @defaultValue 'div'
@@ -33,25 +34,27 @@ export interface PinInputProps extends Pick<PinInputRootProps, 'defaultValue' |
33
34
  class?: any;
34
35
  ui?: PinInput['slots'];
35
36
  }
36
- export type PinInputEmits = PinInputRootEmits & {
37
+ export type PinInputEmits<T extends PinInputType = 'text'> = PinInputRootEmits<T> & {
37
38
  change: [payload: Event];
38
39
  blur: [payload: Event];
39
40
  };
40
- declare const _default: import("vue").DefineComponent<PinInputProps, {
41
- inputsRef: import("vue").Ref<ComponentPublicInstance[], ComponentPublicInstance[]>;
42
- }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
43
- blur: (payload: Event) => any;
44
- complete: (value: string[]) => any;
45
- change: (payload: Event) => any;
46
- "update:modelValue": (value: string[]) => any;
47
- }, string, import("vue").PublicProps, Readonly<PinInputProps> & Readonly<{
48
- onBlur?: ((payload: Event) => any) | undefined;
49
- onComplete?: ((value: string[]) => any) | undefined;
50
- onChange?: ((payload: Event) => any) | undefined;
51
- "onUpdate:modelValue"?: ((value: string[]) => any) | undefined;
52
- }>, {
53
- length: number | string;
54
- type: "text" | "number";
55
- autofocusDelay: number;
56
- }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
41
+ declare const _default: <T extends PinInputType = "text">(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_expose?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
42
+ props: __VLS_PrettifyLocal<Pick<Partial<{}> & Omit<{
43
+ readonly onBlur?: ((payload: Event) => any) | undefined;
44
+ readonly onComplete?: ((value: T extends "number" ? number[] : string[]) => any) | undefined;
45
+ readonly onChange?: ((payload: Event) => any) | undefined;
46
+ readonly "onUpdate:modelValue"?: ((value: T extends "number" ? number[] : string[]) => any) | undefined;
47
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onBlur" | "onChange" | "onUpdate:modelValue" | "onComplete"> & PinInputProps<T> & Partial<{}>> & import("vue").PublicProps;
48
+ expose(exposed: import("vue").ShallowUnwrapRef<{
49
+ inputsRef: import("vue").Ref<ComponentPublicInstance[], ComponentPublicInstance[]>;
50
+ }>): void;
51
+ attrs: any;
52
+ slots: {};
53
+ emit: ((evt: "blur", payload: Event) => void) & ((evt: "complete", value: T extends "number" ? number[] : string[]) => void) & ((evt: "change", payload: Event) => void) & ((evt: "update:modelValue", value: T extends "number" ? number[] : string[]) => void);
54
+ }>) => import("vue").VNode & {
55
+ __ctx?: Awaited<typeof __VLS_setup>;
56
+ };
57
57
  export default _default;
58
+ type __VLS_PrettifyLocal<T> = {
59
+ [K in keyof T as K]: T[K];
60
+ } & {};
@@ -16,6 +16,7 @@ const props = defineProps({
16
16
  content: { type: Object, required: false },
17
17
  arrow: { type: [Boolean, Object], required: false },
18
18
  portal: { type: [Boolean, String], required: false, skipCheck: true, default: true },
19
+ reference: { type: null, required: false },
19
20
  dismissible: { type: Boolean, required: false, default: true },
20
21
  class: { type: null, required: false },
21
22
  ui: { type: null, required: false },
@@ -54,7 +55,7 @@ const Component = computed(() => props.mode === "hover" ? HoverCard : Popover);
54
55
 
55
56
  <template>
56
57
  <Component.Root v-slot="{ open }" v-bind="rootProps">
57
- <Component.Trigger v-if="!!slots.default" as-child :class="props.class">
58
+ <Component.Trigger v-if="!!slots.default || !!reference" as-child :reference="reference" :class="props.class">
58
59
  <slot :open="open" />
59
60
  </Component.Trigger>
60
61
 
@@ -1,5 +1,5 @@
1
1
  import { Popover } from 'reka-ui/namespaced';
2
- import type { PopoverRootProps, HoverCardRootProps, PopoverRootEmits, PopoverContentProps, PopoverContentEmits, PopoverArrowProps } from 'reka-ui';
2
+ import type { PopoverRootProps, HoverCardRootProps, PopoverRootEmits, PopoverContentProps, PopoverContentEmits, PopoverArrowProps, HoverCardTriggerProps } from 'reka-ui';
3
3
  import type { AppConfig } from '@nuxt/schema';
4
4
  import theme from '#build/ui/popover';
5
5
  import type { EmitsToProps, ComponentConfig } from '../types/utils';
@@ -25,6 +25,12 @@ export interface PopoverProps extends PopoverRootProps, Pick<HoverCardRootProps,
25
25
  * @defaultValue true
26
26
  */
27
27
  portal?: boolean | string | HTMLElement;
28
+ /**
29
+ * The reference (or anchor) element that is being referred to for positioning.
30
+ *
31
+ * If not provided will use the current component as anchor.
32
+ */
33
+ reference?: HoverCardTriggerProps['reference'];
28
34
  /**
29
35
  * When `false`, the popover will not close when clicking outside or pressing escape.
30
36
  * @defaultValue true
@@ -43,7 +49,7 @@ export interface PopoverSlots {
43
49
  content(props?: {}): any;
44
50
  anchor(props?: {}): any;
45
51
  }
46
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PopoverProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
52
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<PopoverProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
47
53
  "update:open": (value: boolean) => any;
48
54
  "close:prevent": () => any;
49
55
  }, string, import("vue").PublicProps, Readonly<PopoverProps> & Readonly<{
@@ -21,13 +21,14 @@ const props = defineProps({
21
21
  class: { type: null, required: false },
22
22
  ui: { type: null, required: false },
23
23
  getValueLabel: { type: Function, required: false },
24
+ getValueText: { type: Function, required: false },
24
25
  modelValue: { type: [Number, null], required: false, default: null }
25
26
  });
26
27
  const emits = defineEmits(["update:modelValue", "update:max"]);
27
28
  const slots = defineSlots();
28
29
  const { dir } = useLocale();
29
30
  const appConfig = useAppConfig();
30
- const rootProps = useForwardPropsEmits(reactivePick(props, "getValueLabel", "modelValue"), emits);
31
+ const rootProps = useForwardPropsEmits(reactivePick(props, "getValueLabel", "getValueText", "modelValue"), emits);
31
32
  const isIndeterminate = computed(() => rootProps.value.modelValue === null);
32
33
  const hasSteps = computed(() => Array.isArray(props.max));
33
34
  const realMax = computed(() => {
@@ -3,7 +3,7 @@ import type { AppConfig } from '@nuxt/schema';
3
3
  import theme from '#build/ui/progress';
4
4
  import type { ComponentConfig } from '../types/utils';
5
5
  type Progress = ComponentConfig<typeof theme, AppConfig, 'progress'>;
6
- export interface ProgressProps extends Pick<ProgressRootProps, 'getValueLabel' | 'modelValue'> {
6
+ export interface ProgressProps extends Pick<ProgressRootProps, 'getValueLabel' | 'getValueText' | 'modelValue'> {
7
7
  /**
8
8
  * The element or component this component should render as.
9
9
  * @defaultValue 'div'
@@ -47,7 +47,7 @@ export type ProgressSlots = {
47
47
  step: number;
48
48
  }) => any;
49
49
  };
50
- declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ProgressProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
50
+ declare const _default: __VLS_WithSlots<import("vue").DefineComponent<ProgressProps, void, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
51
51
  "update:modelValue": (value: string[] | undefined) => any;
52
52
  "update:max": (value: number) => any;
53
53
  }, string, import("vue").PublicProps, Readonly<ProgressProps> & Readonly<{
@@ -24,10 +24,10 @@ const props = defineProps({
24
24
  indicator: { type: null, required: false },
25
25
  class: { type: null, required: false },
26
26
  ui: { type: null, required: false },
27
- defaultValue: { type: [String, Number, Object, null], required: false },
27
+ defaultValue: { type: null, required: false },
28
28
  disabled: { type: Boolean, required: false },
29
29
  loop: { type: Boolean, required: false },
30
- modelValue: { type: [String, Number, Object, null], required: false },
30
+ modelValue: { type: null, required: false },
31
31
  name: { type: String, required: false },
32
32
  required: { type: Boolean, required: false }
33
33
  });
@@ -54,7 +54,7 @@ function normalizeItem(item) {
54
54
  label: void 0
55
55
  };
56
56
  }
57
- if (typeof item === "string" || typeof item === "number") {
57
+ if (typeof item === "string" || typeof item === "number" || typeof item === "bigint") {
58
58
  return {
59
59
  id: `${id}:${item}`,
60
60
  value: String(item),
@@ -64,10 +64,11 @@ export interface RadioGroupProps<T extends RadioGroupItem = RadioGroupItem> exte
64
64
  export type RadioGroupEmits = RadioGroupRootEmits & {
65
65
  change: [payload: Event];
66
66
  };
67
+ type NormalizeItem<T extends RadioGroupItem> = Exclude<T & {
68
+ id: string;
69
+ }, RadioGroupValue>;
67
70
  type SlotProps<T extends RadioGroupItem> = (props: {
68
- item: T & {
69
- id: string;
70
- };
71
+ item: NormalizeItem<T>;
71
72
  modelValue?: RadioGroupValue;
72
73
  }) => any;
73
74
  export interface RadioGroupSlots<T extends RadioGroupItem = RadioGroupItem> {
@@ -89,5 +90,5 @@ declare const _default: <T extends RadioGroupItem>(__VLS_props: NonNullable<Awai
89
90
  };
90
91
  export default _default;
91
92
  type __VLS_PrettifyLocal<T> = {
92
- [K in keyof T]: T[K];
93
+ [K in keyof T as K]: T[K];
93
94
  } & {};
@@ -3,7 +3,7 @@ import theme from "#build/ui/select";
3
3
  </script>
4
4
 
5
5
  <script setup>
6
- import { computed, toRef } from "vue";
6
+ import { ref, computed, onMounted, toRef } from "vue";
7
7
  import { SelectRoot, SelectArrow, SelectTrigger, SelectPortal, SelectContent, SelectLabel, SelectGroup, SelectItem, SelectItemIndicator, SelectItemText, SelectSeparator, useForwardPropsEmits } from "reka-ui";
8
8
  import { defu } from "defu";
9
9
  import { reactivePick } from "@vueuse/core";
@@ -36,6 +36,8 @@ const props = defineProps({
36
36
  modelValue: { type: null, required: false },
37
37
  multiple: { type: Boolean, required: false },
38
38
  highlight: { type: Boolean, required: false },
39
+ autofocus: { type: Boolean, required: false },
40
+ autofocusDelay: { type: Number, required: false, default: 0 },
39
41
  class: { type: null, required: false },
40
42
  ui: { type: null, required: false },
41
43
  open: { type: Boolean, required: false },
@@ -79,11 +81,25 @@ const groups = computed(
79
81
  const items = computed(() => groups.value.flatMap((group) => group));
80
82
  function displayValue(value) {
81
83
  if (props.multiple && Array.isArray(value)) {
82
- return value.map((v) => displayValue(v)).filter(Boolean).join(", ");
84
+ const values = value.map((v) => displayValue(v)).filter(Boolean);
85
+ return values?.length ? values.join(", ") : void 0;
83
86
  }
84
87
  const item = items.value.find((item2) => compare(typeof item2 === "object" ? get(item2, props.valueKey) : item2, value));
85
88
  return item && (typeof item === "object" ? get(item, props.labelKey) : item);
86
89
  }
90
+ const triggerRef = ref(null);
91
+ function autoFocus() {
92
+ if (props.autofocus) {
93
+ triggerRef.value?.$el?.focus({
94
+ focusVisible: true
95
+ });
96
+ }
97
+ }
98
+ onMounted(() => {
99
+ setTimeout(() => {
100
+ autoFocus();
101
+ }, props.autofocusDelay);
102
+ });
87
103
  function onUpdate(value) {
88
104
  const event = new Event("change", { target: { value } });
89
105
  emits("change", event);
@@ -104,6 +120,9 @@ function onUpdateOpen(value) {
104
120
  function isSelectItem(item) {
105
121
  return typeof item === "object" && item !== null;
106
122
  }
123
+ defineExpose({
124
+ triggerRef
125
+ });
107
126
  </script>
108
127
 
109
128
  <template>
@@ -118,7 +137,7 @@ function isSelectItem(item) {
118
137
  @update:model-value="onUpdate"
119
138
  @update:open="onUpdateOpen"
120
139
  >
121
- <SelectTrigger :id="id" :class="ui.base({ class: [props.ui?.base, props.class] })" v-bind="{ ...$attrs, ...ariaAttrs }">
140
+ <SelectTrigger :id="id" ref="triggerRef" :class="ui.base({ class: [props.ui?.base, props.class] })" v-bind="{ ...$attrs, ...ariaAttrs }">
122
141
  <span v-if="isLeading || !!avatar || !!slots.leading" :class="ui.leading({ class: props.ui?.leading })">
123
142
  <slot name="leading" :model-value="modelValue" :open="open" :ui="ui">
124
143
  <UIcon v-if="isLeading && leadingIconName" :name="leadingIconName" :class="ui.leadingIcon({ class: props.ui?.leadingIcon })" />
@@ -128,7 +147,7 @@ function isSelectItem(item) {
128
147
 
129
148
  <slot :model-value="modelValue" :open="open">
130
149
  <template v-for="displayedModelValue in [displayValue(modelValue)]" :key="displayedModelValue">
131
- <span v-if="displayedModelValue" :class="ui.value({ class: props.ui?.value })">
150
+ <span v-if="displayedModelValue !== void 0 && displayedModelValue !== null" :class="ui.value({ class: props.ui?.value })">
132
151
  {{ displayedModelValue }}
133
152
  </span>
134
153
  <span v-else :class="ui.placeholder({ class: props.ui?.placeholder })">
@@ -88,6 +88,8 @@ export interface SelectProps<T extends ArrayOrNested<SelectItem> = ArrayOrNested
88
88
  multiple?: M & boolean;
89
89
  /** Highlight the ring color like a focus state. */
90
90
  highlight?: boolean;
91
+ autofocus?: boolean;
92
+ autofocusDelay?: number;
91
93
  class?: any;
92
94
  ui?: Select['slots'];
93
95
  }
@@ -134,7 +136,111 @@ declare const _default: <T extends ArrayOrNested<SelectItem>, VK extends GetItem
134
136
  readonly "onUpdate:open"?: ((value: boolean) => any) | undefined;
135
137
  readonly "onUpdate:modelValue"?: ((payload: GetModelValue<T, VK, M>) => any) | undefined;
136
138
  } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, never>, "onFocus" | "onBlur" | "onChange" | "onUpdate:open" | "onUpdate:modelValue"> & SelectProps<T, VK, M> & Partial<{}>> & import("vue").PublicProps;
137
- expose(exposed: import("vue").ShallowUnwrapRef<{}>): void;
139
+ expose(exposed: import("vue").ShallowUnwrapRef<{
140
+ triggerRef: import("vue").Ref<({
141
+ $: import("vue").ComponentInternalInstance;
142
+ $data: {};
143
+ $props: {
144
+ readonly disabled?: boolean | undefined;
145
+ readonly reference?: import("reka-ui").ReferenceElement | undefined;
146
+ readonly asChild?: boolean | undefined;
147
+ readonly as?: (import("reka-ui").AsTag | import("vue").Component) | undefined;
148
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps;
149
+ $attrs: {
150
+ [x: string]: unknown;
151
+ };
152
+ $refs: {
153
+ [x: string]: unknown;
154
+ };
155
+ $slots: Readonly<{
156
+ [name: string]: import("vue").Slot<any> | undefined;
157
+ }>;
158
+ $root: import("vue").ComponentPublicInstance | null;
159
+ $parent: import("vue").ComponentPublicInstance | null;
160
+ $host: Element | null;
161
+ $emit: (event: string, ...args: any[]) => void;
162
+ $el: any;
163
+ $options: import("vue").ComponentOptionsBase<Readonly<import("reka-ui").SelectTriggerProps> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
164
+ as: import("reka-ui").AsTag | import("vue").Component;
165
+ }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & {
166
+ beforeCreate?: (() => void) | (() => void)[];
167
+ created?: (() => void) | (() => void)[];
168
+ beforeMount?: (() => void) | (() => void)[];
169
+ mounted?: (() => void) | (() => void)[];
170
+ beforeUpdate?: (() => void) | (() => void)[];
171
+ updated?: (() => void) | (() => void)[];
172
+ activated?: (() => void) | (() => void)[];
173
+ deactivated?: (() => void) | (() => void)[];
174
+ beforeDestroy?: (() => void) | (() => void)[];
175
+ beforeUnmount?: (() => void) | (() => void)[];
176
+ destroyed?: (() => void) | (() => void)[];
177
+ unmounted?: (() => void) | (() => void)[];
178
+ renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
179
+ renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
180
+ errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance | null, info: string) => boolean | void)[];
181
+ };
182
+ $forceUpdate: () => void;
183
+ $nextTick: typeof import("vue").nextTick;
184
+ $watch<T_1 extends string | ((...args: any) => any)>(source: T_1, cb: T_1 extends (...args: any) => infer R ? (...args: [R, R, import("@vue/reactivity").OnCleanup]) => any : (...args: [any, any, import("@vue/reactivity").OnCleanup]) => any, options?: import("vue").WatchOptions): import("vue").WatchStopHandle;
185
+ } & Readonly<{
186
+ as: import("reka-ui").AsTag | import("vue").Component;
187
+ }> & Omit<Readonly<import("reka-ui").SelectTriggerProps> & Readonly<{}>, "as"> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {} & {
188
+ $slots: {
189
+ default?(_: {}): any;
190
+ };
191
+ }) | null, ({
192
+ $: import("vue").ComponentInternalInstance;
193
+ $data: {};
194
+ $props: {
195
+ readonly disabled?: boolean | undefined;
196
+ readonly reference?: import("reka-ui").ReferenceElement | undefined;
197
+ readonly asChild?: boolean | undefined;
198
+ readonly as?: (import("reka-ui").AsTag | import("vue").Component) | undefined;
199
+ } & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps;
200
+ $attrs: {
201
+ [x: string]: unknown;
202
+ };
203
+ $refs: {
204
+ [x: string]: unknown;
205
+ };
206
+ $slots: Readonly<{
207
+ [name: string]: import("vue").Slot<any> | undefined;
208
+ }>;
209
+ $root: import("vue").ComponentPublicInstance | null;
210
+ $parent: import("vue").ComponentPublicInstance | null;
211
+ $host: Element | null;
212
+ $emit: (event: string, ...args: any[]) => void;
213
+ $el: any;
214
+ $options: import("vue").ComponentOptionsBase<Readonly<import("reka-ui").SelectTriggerProps> & Readonly<{}>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, {
215
+ as: import("reka-ui").AsTag | import("vue").Component;
216
+ }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & {
217
+ beforeCreate?: (() => void) | (() => void)[];
218
+ created?: (() => void) | (() => void)[];
219
+ beforeMount?: (() => void) | (() => void)[];
220
+ mounted?: (() => void) | (() => void)[];
221
+ beforeUpdate?: (() => void) | (() => void)[];
222
+ updated?: (() => void) | (() => void)[];
223
+ activated?: (() => void) | (() => void)[];
224
+ deactivated?: (() => void) | (() => void)[];
225
+ beforeDestroy?: (() => void) | (() => void)[];
226
+ beforeUnmount?: (() => void) | (() => void)[];
227
+ destroyed?: (() => void) | (() => void)[];
228
+ unmounted?: (() => void) | (() => void)[];
229
+ renderTracked?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
230
+ renderTriggered?: ((e: import("vue").DebuggerEvent) => void) | ((e: import("vue").DebuggerEvent) => void)[];
231
+ errorCaptured?: ((err: unknown, instance: import("vue").ComponentPublicInstance | null, info: string) => boolean | void) | ((err: unknown, instance: import("vue").ComponentPublicInstance | null, info: string) => boolean | void)[];
232
+ };
233
+ $forceUpdate: () => void;
234
+ $nextTick: typeof import("vue").nextTick;
235
+ $watch<T_1 extends string | ((...args: any) => any)>(source: T_1, cb: T_1 extends (...args: any) => infer R ? (...args: [R, R, import("@vue/reactivity").OnCleanup]) => any : (...args: [any, any, import("@vue/reactivity").OnCleanup]) => any, options?: import("vue").WatchOptions): import("vue").WatchStopHandle;
236
+ } & Readonly<{
237
+ as: import("reka-ui").AsTag | import("vue").Component;
238
+ }> & Omit<Readonly<import("reka-ui").SelectTriggerProps> & Readonly<{}>, "as"> & import("vue").ShallowUnwrapRef<{}> & {} & import("vue").ComponentCustomProperties & {} & {
239
+ $slots: {
240
+ default?(_: {}): any;
241
+ };
242
+ }) | null>;
243
+ }>): void;
138
244
  attrs: any;
139
245
  slots: SelectSlots<T, VK, M, NestedItem<T>>;
140
246
  emit: ((evt: "blur", payload: FocusEvent) => void) & ((evt: "change", payload: Event) => void) & ((evt: "focus", payload: FocusEvent) => void) & ((evt: "update:open", value: boolean) => void) & ((evt: "update:modelValue", payload: GetModelValue<T, VK, M>) => void);
@@ -143,5 +249,5 @@ declare const _default: <T extends ArrayOrNested<SelectItem>, VK extends GetItem
143
249
  };
144
250
  export default _default;
145
251
  type __VLS_PrettifyLocal<T> = {
146
- [K in keyof T]: T[K];
252
+ [K in keyof T as K]: T[K];
147
253
  } & {};