@xleddyl/443-components-vue 0.2.3 → 0.4.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 (236) hide show
  1. package/README.md +106 -19
  2. package/dist/chart/BarChart.vue.d.ts +2 -2
  3. package/dist/chart/ChartLegend.vue.d.ts +4 -4
  4. package/dist/chart/ChartPanel.vue.d.ts +2 -2
  5. package/dist/chart/ChartSummary.vue.d.ts +2 -2
  6. package/dist/chart/DoughnutChart.vue.d.ts +2 -2
  7. package/dist/chart/LineChart.vue.d.ts +2 -2
  8. package/dist/components/core/Button.vue.d.ts +2 -2
  9. package/dist/components/core/FieldBoundary.vue +14 -0
  10. package/dist/components/core/FieldBoundary.vue.d.ts +15 -0
  11. package/dist/components/core/FieldMessage.vue +28 -0
  12. package/dist/components/core/FieldMessage.vue.d.ts +409 -0
  13. package/dist/components/core/Form.vue +109 -11
  14. package/dist/components/core/Form.vue.d.ts +45 -6
  15. package/dist/components/core/FormAlerts.vue +30 -0
  16. package/dist/components/core/FormAlerts.vue.d.ts +393 -0
  17. package/dist/components/core/FormField.vue +54 -17
  18. package/dist/components/core/FormField.vue.d.ts +5 -4
  19. package/dist/components/core/Icon.vue.d.ts +2 -2
  20. package/dist/components/core/Input.vue.d.ts +4 -4
  21. package/dist/components/core/Kbd.vue.d.ts +2 -2
  22. package/dist/components/core/Root.vue.d.ts +6 -6
  23. package/dist/components/core/Spinner.vue +13 -1
  24. package/dist/components/core/Spinner.vue.d.ts +4 -2
  25. package/dist/components/core/Textarea.vue.d.ts +4 -4
  26. package/dist/components/core/VisuallyHidden.vue.d.ts +6 -6
  27. package/dist/components/core/index.d.ts +3 -0
  28. package/dist/components/core/index.mjs +3 -0
  29. package/dist/components/data/Avatar.vue.d.ts +2 -2
  30. package/dist/components/data/AvatarGroup.vue.d.ts +2 -2
  31. package/dist/components/data/Badge.vue.d.ts +2 -2
  32. package/dist/components/data/DescriptionList.vue.d.ts +2 -2
  33. package/dist/components/data/FilterPill.vue +35 -0
  34. package/dist/components/data/FilterPill.vue.d.ts +445 -0
  35. package/dist/components/data/FilterPills.vue +100 -27
  36. package/dist/components/data/FilterPills.vue.d.ts +47 -411
  37. package/dist/components/data/Pagination.vue.d.ts +4 -4
  38. package/dist/components/data/SelectionBar.vue +81 -0
  39. package/dist/components/data/SelectionBar.vue.d.ts +427 -0
  40. package/dist/components/data/Stat.vue.d.ts +8 -8
  41. package/dist/components/data/Tag.vue.d.ts +4 -4
  42. package/dist/components/data/Timeline.vue.d.ts +2 -2
  43. package/dist/components/data/Tree.vue +245 -21
  44. package/dist/components/data/Tree.vue.d.ts +40 -10
  45. package/dist/components/data/index.d.ts +3 -0
  46. package/dist/components/data/index.mjs +3 -0
  47. package/dist/components/data/types.d.ts +26 -2
  48. package/dist/components/feedback/Alert.vue.d.ts +18 -18
  49. package/dist/components/feedback/EmptyState.vue.d.ts +2 -2
  50. package/dist/components/feedback/LoadingOverlay.vue.d.ts +2 -2
  51. package/dist/components/feedback/Meter.vue.d.ts +2 -2
  52. package/dist/components/feedback/Progress.vue.d.ts +2 -2
  53. package/dist/components/feedback/ProgressRing.vue.d.ts +2 -2
  54. package/dist/components/feedback/Skeleton.vue.d.ts +3 -3
  55. package/dist/components/forms/Calendar.vue.d.ts +4 -4
  56. package/dist/components/forms/CheckboxGroup.vue +2 -1
  57. package/dist/components/forms/ColorInput.vue.d.ts +6 -6
  58. package/dist/components/forms/DateInput.vue.d.ts +14 -14
  59. package/dist/components/forms/DatePicker.vue.d.ts +6 -6
  60. package/dist/components/forms/FileInput.vue +160 -34
  61. package/dist/components/forms/FileInput.vue.d.ts +43 -15
  62. package/dist/components/forms/InputAddon.vue.d.ts +2 -2
  63. package/dist/components/forms/InputGroup.vue.d.ts +2 -2
  64. package/dist/components/forms/NumberInput.vue.d.ts +6 -6
  65. package/dist/components/forms/PasswordInput.vue.d.ts +16 -16
  66. package/dist/components/forms/PinInput.vue.d.ts +6 -6
  67. package/dist/components/forms/Radio.vue.d.ts +2 -2
  68. package/dist/components/forms/RadioGroup.vue +2 -1
  69. package/dist/components/forms/SegmentedControl.vue +33 -8
  70. package/dist/components/forms/SegmentedControl.vue.d.ts +15 -7
  71. package/dist/components/forms/Slider.vue.d.ts +6 -6
  72. package/dist/components/forms/Switch.vue.d.ts +6 -6
  73. package/dist/components/forms/TimeInput.vue.d.ts +16 -16
  74. package/dist/components/forms/types.d.ts +17 -0
  75. package/dist/components/layout/Accordion.vue +25 -5
  76. package/dist/components/layout/Accordion.vue.d.ts +11 -8
  77. package/dist/components/layout/AppShell.vue +1 -1
  78. package/dist/components/layout/AppShell.vue.d.ts +7 -7
  79. package/dist/components/layout/Breadcrumbs.vue +28 -20
  80. package/dist/components/layout/Breadcrumbs.vue.d.ts +18 -3
  81. package/dist/components/layout/Card.vue +22 -3
  82. package/dist/components/layout/Card.vue.d.ts +10 -4
  83. package/dist/components/layout/CopyButton.vue.d.ts +4 -4
  84. package/dist/components/layout/Grid.vue.d.ts +2 -2
  85. package/dist/components/layout/NavLink.vue.d.ts +8 -8
  86. package/dist/components/layout/PageHeader.vue +10 -1
  87. package/dist/components/layout/PageHeader.vue.d.ts +17 -9
  88. package/dist/components/layout/Separator.vue.d.ts +2 -2
  89. package/dist/components/layout/Sidebar.vue.d.ts +2 -2
  90. package/dist/components/layout/SidebarSection.vue.d.ts +2 -2
  91. package/dist/components/layout/Stack.vue.d.ts +6 -6
  92. package/dist/components/layout/Tabs.vue +37 -7
  93. package/dist/components/layout/Tabs.vue.d.ts +11 -4
  94. package/dist/components/layout/ThemeSwitch.vue.d.ts +2 -2
  95. package/dist/components/layout/Toolbar.vue.d.ts +2 -2
  96. package/dist/components/layout/types.d.ts +8 -1
  97. package/dist/components/overlays/CommandPalette.vue +35 -8
  98. package/dist/components/overlays/CommandPalette.vue.d.ts +273 -497
  99. package/dist/components/overlays/ConfirmDialog.vue.d.ts +8 -6
  100. package/dist/components/overlays/ConfirmHost.vue +5 -1
  101. package/dist/components/overlays/ConfirmHost.vue.d.ts +10 -8
  102. package/dist/components/overlays/ContextMenu.vue.d.ts +4 -4
  103. package/dist/components/overlays/Drawer.vue +4 -2
  104. package/dist/components/overlays/Drawer.vue.d.ts +8 -6
  105. package/dist/components/overlays/DropdownMenu.vue.d.ts +2 -2
  106. package/dist/components/overlays/HoverCard.vue +2 -1
  107. package/dist/components/overlays/HoverCard.vue.d.ts +8 -8
  108. package/dist/components/overlays/Modal.vue +5 -3
  109. package/dist/components/overlays/Modal.vue.d.ts +8 -6
  110. package/dist/components/overlays/Popover.vue +2 -1
  111. package/dist/components/overlays/Popover.vue.d.ts +8 -8
  112. package/dist/components/overlays/Toaster.vue.d.ts +4 -4
  113. package/dist/components/overlays/Tooltip.vue.d.ts +2 -2
  114. package/dist/components/overlays/types.d.ts +11 -5
  115. package/dist/components/templates/AccountMenu.vue.d.ts +6 -6
  116. package/dist/components/templates/AppearanceSettings.vue.d.ts +2 -2
  117. package/dist/components/templates/AuthLayout.vue.d.ts +2 -2
  118. package/dist/components/templates/Brand.vue +34 -5
  119. package/dist/components/templates/Brand.vue.d.ts +20 -15
  120. package/dist/components/templates/DashboardLayout.vue +49 -10
  121. package/dist/components/templates/DashboardLayout.vue.d.ts +332 -553
  122. package/dist/components/templates/DashboardPage.vue.d.ts +2 -2
  123. package/dist/components/templates/DetailPage.vue.d.ts +4 -4
  124. package/dist/components/templates/EmptyPage.vue.d.ts +2 -2
  125. package/dist/components/templates/ErrorPage.vue.d.ts +2 -2
  126. package/dist/components/templates/ListPage.vue +17 -11
  127. package/dist/components/templates/ListPage.vue.d.ts +3 -3
  128. package/dist/components/templates/NotFoundPage.vue.d.ts +1 -1
  129. package/dist/components/templates/SaveBar.vue.d.ts +4 -4
  130. package/dist/components/templates/SettingsGroup.vue.d.ts +2 -2
  131. package/dist/components/templates/SettingsModal.vue +5 -2
  132. package/dist/components/templates/SettingsModal.vue.d.ts +13 -8
  133. package/dist/components/templates/SettingsPage.vue.d.ts +4 -4
  134. package/dist/components/templates/SettingsSection.vue.d.ts +12 -8
  135. package/dist/components/templates/types.d.ts +25 -2
  136. package/dist/composables/core.d.ts +1 -0
  137. package/dist/composables/core.mjs +1 -0
  138. package/dist/composables/useField.d.ts +8 -1
  139. package/dist/composables/useField.mjs +41 -10
  140. package/dist/composables/useFieldBoundary.d.ts +2 -0
  141. package/dist/composables/useFieldBoundary.mjs +9 -0
  142. package/dist/composables/useFileDrop.d.ts +20 -0
  143. package/dist/composables/useFileDrop.mjs +115 -7
  144. package/dist/composables/useForm.d.ts +36 -19
  145. package/dist/composables/useForm.mjs +258 -51
  146. package/dist/editor/RichTextEditor.vue +32 -4
  147. package/dist/editor/RichTextEditor.vue.d.ts +11 -6
  148. package/dist/editor/rich-text-editor.css +1 -1
  149. package/dist/editor/types.d.ts +3 -0
  150. package/dist/grid/GridToolbar.vue.d.ts +4 -4
  151. package/dist/grid/cells/BadgeCell.vue.d.ts +2 -2
  152. package/dist/grid/cells/BooleanCell.vue.d.ts +2 -2
  153. package/dist/grid/cells/DateCell.vue.d.ts +2 -2
  154. package/dist/grid/cells/ImageCell.vue.d.ts +2 -2
  155. package/dist/grid/cells/LinkCell.vue.d.ts +2 -2
  156. package/dist/internal/core/ButtonElement.d.ts +2 -0
  157. package/dist/internal/core/ButtonElement.mjs +8 -0
  158. package/dist/internal/data/tree.d.ts +8 -0
  159. package/dist/internal/data/tree.mjs +41 -0
  160. package/dist/internal/forms/files.d.ts +9 -0
  161. package/dist/internal/forms/files.mjs +32 -1
  162. package/dist/internal/forms/standard-schema.d.ts +17 -0
  163. package/dist/internal/forms/standard-schema.mjs +40 -0
  164. package/dist/internal/keys.d.ts +2 -1
  165. package/dist/internal/keys.mjs +1 -0
  166. package/dist/internal/overlays/DialogFrame.vue +17 -7
  167. package/dist/internal/overlays/DialogFrame.vue.d.ts +9 -5
  168. package/dist/internal/overlays/MenuList.vue +2 -0
  169. package/dist/internal/overlays/MenuList.vue.d.ts +5 -5
  170. package/dist/internal/overlays/OverlayView.vue +2 -0
  171. package/dist/internal/overlays/OverlayView.vue.d.ts +14 -12
  172. package/dist/internal/overlays/dialog.d.ts +4 -1
  173. package/dist/internal/overlays/dialog.mjs +39 -5
  174. package/dist/internal/overlays/stack.d.ts +2 -1
  175. package/dist/locale/en.mjs +19 -2
  176. package/dist/locale/it.mjs +19 -2
  177. package/dist/locale/types.d.ts +17 -0
  178. package/dist/nuxt/module.d.ts +1 -0
  179. package/dist/nuxt/module.mjs +6 -3
  180. package/dist/nuxt/runtime/layouts/auth.vue.d.ts +8 -8
  181. package/dist/nuxt/runtime/layouts/dashboard.vue.d.ts +8 -8
  182. package/dist/styles/base.css +2 -0
  183. package/dist/styles/core/button.css +1 -13
  184. package/dist/styles/core/field-message.css +34 -0
  185. package/dist/styles/core/form-field.css +0 -23
  186. package/dist/styles/core/form.css +11 -0
  187. package/dist/styles/core/kbd.css +2 -2
  188. package/dist/styles/core/spinner.css +19 -0
  189. package/dist/styles/core.css +1 -0
  190. package/dist/styles/data/avatar.css +1 -1
  191. package/dist/styles/data/badge.css +1 -1
  192. package/dist/styles/data/filter-pills.css +40 -4
  193. package/dist/styles/data/pagination.css +0 -1
  194. package/dist/styles/data/selection-bar.css +89 -0
  195. package/dist/styles/data/stat.css +1 -6
  196. package/dist/styles/data/table.css +1 -3
  197. package/dist/styles/data/tag.css +1 -4
  198. package/dist/styles/data/tree.css +163 -2
  199. package/dist/styles/data.css +1 -0
  200. package/dist/styles/feedback/alert.css +0 -1
  201. package/dist/styles/feedback/empty-state.css +0 -1
  202. package/dist/styles/forms/calendar.css +1 -1
  203. package/dist/styles/forms/color-input.css +1 -1
  204. package/dist/styles/forms/combobox.css +0 -1
  205. package/dist/styles/forms/date-picker.css +1 -1
  206. package/dist/styles/forms/file-input.css +17 -1
  207. package/dist/styles/forms/number-input.css +1 -1
  208. package/dist/styles/forms/password-input.css +1 -5
  209. package/dist/styles/forms/segmented.css +8 -0
  210. package/dist/styles/forms/select.css +1 -1
  211. package/dist/styles/forms/slider.css +2 -2
  212. package/dist/styles/forms/switch.css +0 -1
  213. package/dist/styles/layout/accordion.css +22 -1
  214. package/dist/styles/layout/app-shell.css +4 -0
  215. package/dist/styles/layout/breadcrumbs.css +16 -1
  216. package/dist/styles/layout/card.css +20 -6
  217. package/dist/styles/layout/copy-button.css +2 -2
  218. package/dist/styles/layout/nav-link.css +2 -3
  219. package/dist/styles/layout/sidebar-nav.css +1 -1
  220. package/dist/styles/layout/sidebar.css +2 -2
  221. package/dist/styles/layout/tabs.css +65 -3
  222. package/dist/styles/layout/theme-switch.css +1 -3
  223. package/dist/styles/overlays/command.css +21 -3
  224. package/dist/styles/overlays/confirm.css +0 -1
  225. package/dist/styles/overlays/menu.css +3 -5
  226. package/dist/styles/overlays/modal.css +38 -0
  227. package/dist/styles/overlays/toast.css +0 -1
  228. package/dist/styles/templates/auth-layout.css +0 -1
  229. package/dist/styles/templates/brand.css +15 -0
  230. package/dist/styles/templates/empty-page.css +4 -4
  231. package/dist/styles/templates/form-page.css +1 -1
  232. package/dist/styles/templates/list-page.css +2 -6
  233. package/dist/styles/templates/page.css +1 -1
  234. package/dist/styles/templates/settings-modal.css +2 -3
  235. package/dist/styles/tokens.css +1 -1
  236. package/package.json +1 -1
@@ -0,0 +1,409 @@
1
+ import type { IconName } from '../../composables/useIcons';
2
+ declare var __VLS_6: {};
3
+ type __VLS_Slots = {} & {
4
+ default?: (props: typeof __VLS_6) => any;
5
+ };
6
+ declare const __VLS_base: import("vue").DefineComponent<{
7
+ message?: string;
8
+ tone?: "danger" | "warning" | "neutral";
9
+ icon?: IconName | false;
10
+ id?: string | undefined;
11
+ innerHTML?: string | undefined | undefined;
12
+ class?: import("vue").ClassValue;
13
+ style?: import("vue").StyleValue;
14
+ accesskey?: string | undefined | undefined;
15
+ contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
16
+ contextmenu?: string | undefined | undefined;
17
+ dir?: string | undefined | undefined;
18
+ draggable?: (boolean | "true" | "false") | undefined;
19
+ enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
20
+ enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
21
+ hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
22
+ inert?: (boolean | "true" | "false") | undefined;
23
+ lang?: string | undefined | undefined;
24
+ placeholder?: string | undefined | undefined;
25
+ spellcheck?: (boolean | "true" | "false") | undefined;
26
+ tabindex?: (string | number) | undefined;
27
+ title?: string | undefined | undefined;
28
+ translate?: "yes" | "no" | undefined | undefined;
29
+ radiogroup?: string | undefined | undefined;
30
+ role?: string | undefined | undefined;
31
+ about?: string | undefined | undefined;
32
+ datatype?: string | undefined | undefined;
33
+ inlist?: any;
34
+ prefix?: string | undefined | undefined;
35
+ property?: string | undefined | undefined;
36
+ resource?: string | undefined | undefined;
37
+ typeof?: string | undefined | undefined;
38
+ vocab?: string | undefined | undefined;
39
+ autocapitalize?: string | undefined | undefined;
40
+ autocorrect?: string | undefined | undefined;
41
+ autosave?: string | undefined | undefined;
42
+ color?: string | undefined | undefined;
43
+ itemprop?: string | undefined | undefined;
44
+ itemscope?: (boolean | "true" | "false") | undefined;
45
+ itemtype?: string | undefined | undefined;
46
+ itemid?: string | undefined | undefined;
47
+ itemref?: string | undefined | undefined;
48
+ results?: (string | number) | undefined;
49
+ security?: string | undefined | undefined;
50
+ unselectable?: "on" | "off" | undefined | undefined;
51
+ inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
52
+ is?: string | undefined | undefined;
53
+ exportparts?: string | undefined;
54
+ part?: string | undefined;
55
+ popover?: (import("../../index.ts").PopoverMode | "" | boolean) | undefined;
56
+ 'aria-activedescendant'?: string | undefined | undefined;
57
+ 'aria-atomic'?: (boolean | "true" | "false") | undefined;
58
+ 'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined | undefined;
59
+ 'aria-busy'?: (boolean | "true" | "false") | undefined;
60
+ 'aria-checked'?: (boolean | "true" | "false") | "mixed" | undefined;
61
+ 'aria-colcount'?: (string | number) | undefined;
62
+ 'aria-colindex'?: (string | number) | undefined;
63
+ 'aria-colspan'?: (string | number) | undefined;
64
+ 'aria-controls'?: string | undefined | undefined;
65
+ 'aria-current'?: "page" | "time" | (boolean | "true" | "false") | "step" | "location" | "date" | undefined;
66
+ 'aria-describedby'?: string | undefined | undefined;
67
+ 'aria-details'?: string | undefined | undefined;
68
+ 'aria-disabled'?: (boolean | "true" | "false") | undefined;
69
+ 'aria-dropeffect'?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
70
+ 'aria-errormessage'?: string | undefined | undefined;
71
+ 'aria-expanded'?: (boolean | "true" | "false") | undefined;
72
+ 'aria-flowto'?: string | undefined | undefined;
73
+ 'aria-grabbed'?: (boolean | "true" | "false") | undefined;
74
+ 'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
75
+ 'aria-hidden'?: (boolean | "true" | "false") | undefined;
76
+ 'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
77
+ 'aria-keyshortcuts'?: string | undefined | undefined;
78
+ 'aria-label'?: string | undefined | undefined;
79
+ 'aria-labelledby'?: string | undefined | undefined;
80
+ 'aria-level'?: (string | number) | undefined;
81
+ 'aria-live'?: "off" | "assertive" | "polite" | undefined | undefined;
82
+ 'aria-modal'?: (boolean | "true" | "false") | undefined;
83
+ 'aria-multiline'?: (boolean | "true" | "false") | undefined;
84
+ 'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
85
+ 'aria-orientation'?: "horizontal" | "vertical" | undefined | undefined;
86
+ 'aria-owns'?: string | undefined | undefined;
87
+ 'aria-placeholder'?: string | undefined | undefined;
88
+ 'aria-posinset'?: (string | number) | undefined;
89
+ 'aria-pressed'?: (boolean | "true" | "false") | "mixed" | undefined;
90
+ 'aria-readonly'?: (boolean | "true" | "false") | undefined;
91
+ 'aria-relevant'?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
92
+ 'aria-required'?: (boolean | "true" | "false") | undefined;
93
+ 'aria-roledescription'?: string | undefined | undefined;
94
+ 'aria-rowcount'?: (string | number) | undefined;
95
+ 'aria-rowindex'?: (string | number) | undefined;
96
+ 'aria-rowspan'?: (string | number) | undefined;
97
+ 'aria-selected'?: (boolean | "true" | "false") | undefined;
98
+ 'aria-setsize'?: (string | number) | undefined;
99
+ 'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
100
+ 'aria-valuemax'?: (string | number) | undefined;
101
+ 'aria-valuemin'?: (string | number) | undefined;
102
+ 'aria-valuenow'?: (string | number) | undefined;
103
+ 'aria-valuetext'?: string | undefined | undefined;
104
+ onCopy?: ((payload: ClipboardEvent) => void) | undefined;
105
+ onCut?: ((payload: ClipboardEvent) => void) | undefined;
106
+ onPaste?: ((payload: ClipboardEvent) => void) | undefined;
107
+ onCompositionend?: ((payload: CompositionEvent) => void) | undefined;
108
+ onCompositionstart?: ((payload: CompositionEvent) => void) | undefined;
109
+ onCompositionupdate?: ((payload: CompositionEvent) => void) | undefined;
110
+ onDrag?: ((payload: DragEvent) => void) | undefined;
111
+ onDragend?: ((payload: DragEvent) => void) | undefined;
112
+ onDragenter?: ((payload: DragEvent) => void) | undefined;
113
+ onDragexit?: ((payload: DragEvent) => void) | undefined;
114
+ onDragleave?: ((payload: DragEvent) => void) | undefined;
115
+ onDragover?: ((payload: DragEvent) => void) | undefined;
116
+ onDragstart?: ((payload: DragEvent) => void) | undefined;
117
+ onDrop?: ((payload: DragEvent) => void) | undefined;
118
+ onFocus?: ((payload: FocusEvent) => void) | undefined;
119
+ onFocusin?: ((payload: FocusEvent) => void) | undefined;
120
+ onFocusout?: ((payload: FocusEvent) => void) | undefined;
121
+ onBlur?: ((payload: FocusEvent) => void) | undefined;
122
+ onChange?: ((payload: Event) => void) | undefined;
123
+ onBeforeinput?: ((payload: InputEvent) => void) | undefined;
124
+ onFormdata?: ((payload: FormDataEvent) => void) | undefined;
125
+ onInput?: ((payload: InputEvent) => void) | undefined;
126
+ onReset?: ((payload: Event) => void) | undefined;
127
+ onSubmit?: ((payload: SubmitEvent) => void) | undefined;
128
+ onInvalid?: ((payload: Event) => void) | undefined;
129
+ onFullscreenchange?: ((payload: Event) => void) | undefined;
130
+ onFullscreenerror?: ((payload: Event) => void) | undefined;
131
+ onLoad?: ((payload: Event) => void) | undefined;
132
+ onError?: ((payload: Event) => void) | undefined;
133
+ onKeydown?: ((payload: KeyboardEvent) => void) | undefined;
134
+ onKeypress?: ((payload: KeyboardEvent) => void) | undefined;
135
+ onKeyup?: ((payload: KeyboardEvent) => void) | undefined;
136
+ onDblclick?: ((payload: MouseEvent) => void) | undefined;
137
+ onMousedown?: ((payload: MouseEvent) => void) | undefined;
138
+ onMouseenter?: ((payload: MouseEvent) => void) | undefined;
139
+ onMouseleave?: ((payload: MouseEvent) => void) | undefined;
140
+ onMousemove?: ((payload: MouseEvent) => void) | undefined;
141
+ onMouseout?: ((payload: MouseEvent) => void) | undefined;
142
+ onMouseover?: ((payload: MouseEvent) => void) | undefined;
143
+ onMouseup?: ((payload: MouseEvent) => void) | undefined;
144
+ onAbort?: ((payload: UIEvent) => void) | undefined;
145
+ onCanplay?: ((payload: Event) => void) | undefined;
146
+ onCanplaythrough?: ((payload: Event) => void) | undefined;
147
+ onDurationchange?: ((payload: Event) => void) | undefined;
148
+ onEmptied?: ((payload: Event) => void) | undefined;
149
+ onEncrypted?: ((payload: MediaEncryptedEvent) => void) | undefined;
150
+ onEnded?: ((payload: Event) => void) | undefined;
151
+ onLoadeddata?: ((payload: Event) => void) | undefined;
152
+ onLoadedmetadata?: ((payload: Event) => void) | undefined;
153
+ onLoadstart?: ((payload: Event) => void) | undefined;
154
+ onPause?: ((payload: Event) => void) | undefined;
155
+ onPlay?: ((payload: Event) => void) | undefined;
156
+ onPlaying?: ((payload: Event) => void) | undefined;
157
+ onProgress?: ((payload: ProgressEvent<EventTarget>) => void) | undefined;
158
+ onRatechange?: ((payload: Event) => void) | undefined;
159
+ onSeeked?: ((payload: Event) => void) | undefined;
160
+ onSeeking?: ((payload: Event) => void) | undefined;
161
+ onStalled?: ((payload: Event) => void) | undefined;
162
+ onSuspend?: ((payload: Event) => void) | undefined;
163
+ onTimeupdate?: ((payload: Event) => void) | undefined;
164
+ onVolumechange?: ((payload: Event) => void) | undefined;
165
+ onWaiting?: ((payload: Event) => void) | undefined;
166
+ onSelect?: ((payload: Event) => void) | undefined;
167
+ onScroll?: ((payload: Event) => void) | undefined;
168
+ onScrollend?: ((payload: Event) => void) | undefined;
169
+ onTouchcancel?: ((payload: TouchEvent) => void) | undefined;
170
+ onTouchend?: ((payload: TouchEvent) => void) | undefined;
171
+ onTouchmove?: ((payload: TouchEvent) => void) | undefined;
172
+ onTouchstart?: ((payload: TouchEvent) => void) | undefined;
173
+ onAuxclick?: ((payload: PointerEvent) => void) | undefined;
174
+ onClick?: ((payload: PointerEvent) => void) | undefined;
175
+ onContextmenu?: ((payload: PointerEvent) => void) | undefined;
176
+ onGotpointercapture?: ((payload: PointerEvent) => void) | undefined;
177
+ onLostpointercapture?: ((payload: PointerEvent) => void) | undefined;
178
+ onPointerdown?: ((payload: PointerEvent) => void) | undefined;
179
+ onPointermove?: ((payload: PointerEvent) => void) | undefined;
180
+ onPointerup?: ((payload: PointerEvent) => void) | undefined;
181
+ onPointercancel?: ((payload: PointerEvent) => void) | undefined;
182
+ onPointerenter?: ((payload: PointerEvent) => void) | undefined;
183
+ onPointerleave?: ((payload: PointerEvent) => void) | undefined;
184
+ onPointerover?: ((payload: PointerEvent) => void) | undefined;
185
+ onPointerout?: ((payload: PointerEvent) => void) | undefined;
186
+ onBeforetoggle?: ((payload: ToggleEvent) => void) | undefined;
187
+ onToggle?: ((payload: ToggleEvent) => void) | undefined;
188
+ onWheel?: ((payload: WheelEvent) => void) | undefined;
189
+ onAnimationcancel?: ((payload: AnimationEvent) => void) | undefined;
190
+ onAnimationstart?: ((payload: AnimationEvent) => void) | undefined;
191
+ onAnimationend?: ((payload: AnimationEvent) => void) | undefined;
192
+ onAnimationiteration?: ((payload: AnimationEvent) => void) | undefined;
193
+ onSecuritypolicyviolation?: ((payload: SecurityPolicyViolationEvent) => void) | undefined;
194
+ onTransitioncancel?: ((payload: TransitionEvent) => void) | undefined;
195
+ onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
196
+ onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
197
+ onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
198
+ key?: PropertyKey | undefined;
199
+ ref?: import("vue").VNodeRef | undefined;
200
+ ref_for?: boolean | undefined | undefined;
201
+ ref_key?: string | undefined | undefined;
202
+ }, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{
203
+ message?: string;
204
+ tone?: "danger" | "warning" | "neutral";
205
+ icon?: IconName | false;
206
+ id?: string | undefined;
207
+ innerHTML?: string | undefined | undefined;
208
+ class?: import("vue").ClassValue;
209
+ style?: import("vue").StyleValue;
210
+ accesskey?: string | undefined | undefined;
211
+ contenteditable?: (boolean | "true" | "false") | "inherit" | "plaintext-only" | undefined;
212
+ contextmenu?: string | undefined | undefined;
213
+ dir?: string | undefined | undefined;
214
+ draggable?: (boolean | "true" | "false") | undefined;
215
+ enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
216
+ enterKeyHint?: "search" | "done" | "previous" | "next" | "enter" | "go" | "send" | undefined;
217
+ hidden?: "" | (boolean | "true" | "false") | "hidden" | "until-found" | undefined;
218
+ inert?: (boolean | "true" | "false") | undefined;
219
+ lang?: string | undefined | undefined;
220
+ placeholder?: string | undefined | undefined;
221
+ spellcheck?: (boolean | "true" | "false") | undefined;
222
+ tabindex?: (string | number) | undefined;
223
+ title?: string | undefined | undefined;
224
+ translate?: "yes" | "no" | undefined | undefined;
225
+ radiogroup?: string | undefined | undefined;
226
+ role?: string | undefined | undefined;
227
+ about?: string | undefined | undefined;
228
+ datatype?: string | undefined | undefined;
229
+ inlist?: any;
230
+ prefix?: string | undefined | undefined;
231
+ property?: string | undefined | undefined;
232
+ resource?: string | undefined | undefined;
233
+ typeof?: string | undefined | undefined;
234
+ vocab?: string | undefined | undefined;
235
+ autocapitalize?: string | undefined | undefined;
236
+ autocorrect?: string | undefined | undefined;
237
+ autosave?: string | undefined | undefined;
238
+ color?: string | undefined | undefined;
239
+ itemprop?: string | undefined | undefined;
240
+ itemscope?: (boolean | "true" | "false") | undefined;
241
+ itemtype?: string | undefined | undefined;
242
+ itemid?: string | undefined | undefined;
243
+ itemref?: string | undefined | undefined;
244
+ results?: (string | number) | undefined;
245
+ security?: string | undefined | undefined;
246
+ unselectable?: "on" | "off" | undefined | undefined;
247
+ inputmode?: "none" | "text" | "tel" | "url" | "email" | "numeric" | "decimal" | "search" | undefined | undefined;
248
+ is?: string | undefined | undefined;
249
+ exportparts?: string | undefined;
250
+ part?: string | undefined;
251
+ popover?: (import("../../index.ts").PopoverMode | "" | boolean) | undefined;
252
+ 'aria-activedescendant'?: string | undefined | undefined;
253
+ 'aria-atomic'?: (boolean | "true" | "false") | undefined;
254
+ 'aria-autocomplete'?: "none" | "inline" | "list" | "both" | undefined | undefined;
255
+ 'aria-busy'?: (boolean | "true" | "false") | undefined;
256
+ 'aria-checked'?: (boolean | "true" | "false") | "mixed" | undefined;
257
+ 'aria-colcount'?: (string | number) | undefined;
258
+ 'aria-colindex'?: (string | number) | undefined;
259
+ 'aria-colspan'?: (string | number) | undefined;
260
+ 'aria-controls'?: string | undefined | undefined;
261
+ 'aria-current'?: "page" | "time" | (boolean | "true" | "false") | "step" | "location" | "date" | undefined;
262
+ 'aria-describedby'?: string | undefined | undefined;
263
+ 'aria-details'?: string | undefined | undefined;
264
+ 'aria-disabled'?: (boolean | "true" | "false") | undefined;
265
+ 'aria-dropeffect'?: "none" | "copy" | "execute" | "link" | "move" | "popup" | undefined | undefined;
266
+ 'aria-errormessage'?: string | undefined | undefined;
267
+ 'aria-expanded'?: (boolean | "true" | "false") | undefined;
268
+ 'aria-flowto'?: string | undefined | undefined;
269
+ 'aria-grabbed'?: (boolean | "true" | "false") | undefined;
270
+ 'aria-haspopup'?: "grid" | "tree" | "dialog" | "menu" | (boolean | "true" | "false") | "listbox" | undefined;
271
+ 'aria-hidden'?: (boolean | "true" | "false") | undefined;
272
+ 'aria-invalid'?: (boolean | "true" | "false") | "grammar" | "spelling" | undefined;
273
+ 'aria-keyshortcuts'?: string | undefined | undefined;
274
+ 'aria-label'?: string | undefined | undefined;
275
+ 'aria-labelledby'?: string | undefined | undefined;
276
+ 'aria-level'?: (string | number) | undefined;
277
+ 'aria-live'?: "off" | "assertive" | "polite" | undefined | undefined;
278
+ 'aria-modal'?: (boolean | "true" | "false") | undefined;
279
+ 'aria-multiline'?: (boolean | "true" | "false") | undefined;
280
+ 'aria-multiselectable'?: (boolean | "true" | "false") | undefined;
281
+ 'aria-orientation'?: "horizontal" | "vertical" | undefined | undefined;
282
+ 'aria-owns'?: string | undefined | undefined;
283
+ 'aria-placeholder'?: string | undefined | undefined;
284
+ 'aria-posinset'?: (string | number) | undefined;
285
+ 'aria-pressed'?: (boolean | "true" | "false") | "mixed" | undefined;
286
+ 'aria-readonly'?: (boolean | "true" | "false") | undefined;
287
+ 'aria-relevant'?: "additions" | "additions removals" | "additions text" | "all" | "removals" | "removals additions" | "removals text" | "text" | "text additions" | "text removals" | undefined | undefined;
288
+ 'aria-required'?: (boolean | "true" | "false") | undefined;
289
+ 'aria-roledescription'?: string | undefined | undefined;
290
+ 'aria-rowcount'?: (string | number) | undefined;
291
+ 'aria-rowindex'?: (string | number) | undefined;
292
+ 'aria-rowspan'?: (string | number) | undefined;
293
+ 'aria-selected'?: (boolean | "true" | "false") | undefined;
294
+ 'aria-setsize'?: (string | number) | undefined;
295
+ 'aria-sort'?: "none" | "ascending" | "descending" | "other" | undefined | undefined;
296
+ 'aria-valuemax'?: (string | number) | undefined;
297
+ 'aria-valuemin'?: (string | number) | undefined;
298
+ 'aria-valuenow'?: (string | number) | undefined;
299
+ 'aria-valuetext'?: string | undefined | undefined;
300
+ onCopy?: ((payload: ClipboardEvent) => void) | undefined;
301
+ onCut?: ((payload: ClipboardEvent) => void) | undefined;
302
+ onPaste?: ((payload: ClipboardEvent) => void) | undefined;
303
+ onCompositionend?: ((payload: CompositionEvent) => void) | undefined;
304
+ onCompositionstart?: ((payload: CompositionEvent) => void) | undefined;
305
+ onCompositionupdate?: ((payload: CompositionEvent) => void) | undefined;
306
+ onDrag?: ((payload: DragEvent) => void) | undefined;
307
+ onDragend?: ((payload: DragEvent) => void) | undefined;
308
+ onDragenter?: ((payload: DragEvent) => void) | undefined;
309
+ onDragexit?: ((payload: DragEvent) => void) | undefined;
310
+ onDragleave?: ((payload: DragEvent) => void) | undefined;
311
+ onDragover?: ((payload: DragEvent) => void) | undefined;
312
+ onDragstart?: ((payload: DragEvent) => void) | undefined;
313
+ onDrop?: ((payload: DragEvent) => void) | undefined;
314
+ onFocus?: ((payload: FocusEvent) => void) | undefined;
315
+ onFocusin?: ((payload: FocusEvent) => void) | undefined;
316
+ onFocusout?: ((payload: FocusEvent) => void) | undefined;
317
+ onBlur?: ((payload: FocusEvent) => void) | undefined;
318
+ onChange?: ((payload: Event) => void) | undefined;
319
+ onBeforeinput?: ((payload: InputEvent) => void) | undefined;
320
+ onFormdata?: ((payload: FormDataEvent) => void) | undefined;
321
+ onInput?: ((payload: InputEvent) => void) | undefined;
322
+ onReset?: ((payload: Event) => void) | undefined;
323
+ onSubmit?: ((payload: SubmitEvent) => void) | undefined;
324
+ onInvalid?: ((payload: Event) => void) | undefined;
325
+ onFullscreenchange?: ((payload: Event) => void) | undefined;
326
+ onFullscreenerror?: ((payload: Event) => void) | undefined;
327
+ onLoad?: ((payload: Event) => void) | undefined;
328
+ onError?: ((payload: Event) => void) | undefined;
329
+ onKeydown?: ((payload: KeyboardEvent) => void) | undefined;
330
+ onKeypress?: ((payload: KeyboardEvent) => void) | undefined;
331
+ onKeyup?: ((payload: KeyboardEvent) => void) | undefined;
332
+ onDblclick?: ((payload: MouseEvent) => void) | undefined;
333
+ onMousedown?: ((payload: MouseEvent) => void) | undefined;
334
+ onMouseenter?: ((payload: MouseEvent) => void) | undefined;
335
+ onMouseleave?: ((payload: MouseEvent) => void) | undefined;
336
+ onMousemove?: ((payload: MouseEvent) => void) | undefined;
337
+ onMouseout?: ((payload: MouseEvent) => void) | undefined;
338
+ onMouseover?: ((payload: MouseEvent) => void) | undefined;
339
+ onMouseup?: ((payload: MouseEvent) => void) | undefined;
340
+ onAbort?: ((payload: UIEvent) => void) | undefined;
341
+ onCanplay?: ((payload: Event) => void) | undefined;
342
+ onCanplaythrough?: ((payload: Event) => void) | undefined;
343
+ onDurationchange?: ((payload: Event) => void) | undefined;
344
+ onEmptied?: ((payload: Event) => void) | undefined;
345
+ onEncrypted?: ((payload: MediaEncryptedEvent) => void) | undefined;
346
+ onEnded?: ((payload: Event) => void) | undefined;
347
+ onLoadeddata?: ((payload: Event) => void) | undefined;
348
+ onLoadedmetadata?: ((payload: Event) => void) | undefined;
349
+ onLoadstart?: ((payload: Event) => void) | undefined;
350
+ onPause?: ((payload: Event) => void) | undefined;
351
+ onPlay?: ((payload: Event) => void) | undefined;
352
+ onPlaying?: ((payload: Event) => void) | undefined;
353
+ onProgress?: ((payload: ProgressEvent<EventTarget>) => void) | undefined;
354
+ onRatechange?: ((payload: Event) => void) | undefined;
355
+ onSeeked?: ((payload: Event) => void) | undefined;
356
+ onSeeking?: ((payload: Event) => void) | undefined;
357
+ onStalled?: ((payload: Event) => void) | undefined;
358
+ onSuspend?: ((payload: Event) => void) | undefined;
359
+ onTimeupdate?: ((payload: Event) => void) | undefined;
360
+ onVolumechange?: ((payload: Event) => void) | undefined;
361
+ onWaiting?: ((payload: Event) => void) | undefined;
362
+ onSelect?: ((payload: Event) => void) | undefined;
363
+ onScroll?: ((payload: Event) => void) | undefined;
364
+ onScrollend?: ((payload: Event) => void) | undefined;
365
+ onTouchcancel?: ((payload: TouchEvent) => void) | undefined;
366
+ onTouchend?: ((payload: TouchEvent) => void) | undefined;
367
+ onTouchmove?: ((payload: TouchEvent) => void) | undefined;
368
+ onTouchstart?: ((payload: TouchEvent) => void) | undefined;
369
+ onAuxclick?: ((payload: PointerEvent) => void) | undefined;
370
+ onClick?: ((payload: PointerEvent) => void) | undefined;
371
+ onContextmenu?: ((payload: PointerEvent) => void) | undefined;
372
+ onGotpointercapture?: ((payload: PointerEvent) => void) | undefined;
373
+ onLostpointercapture?: ((payload: PointerEvent) => void) | undefined;
374
+ onPointerdown?: ((payload: PointerEvent) => void) | undefined;
375
+ onPointermove?: ((payload: PointerEvent) => void) | undefined;
376
+ onPointerup?: ((payload: PointerEvent) => void) | undefined;
377
+ onPointercancel?: ((payload: PointerEvent) => void) | undefined;
378
+ onPointerenter?: ((payload: PointerEvent) => void) | undefined;
379
+ onPointerleave?: ((payload: PointerEvent) => void) | undefined;
380
+ onPointerover?: ((payload: PointerEvent) => void) | undefined;
381
+ onPointerout?: ((payload: PointerEvent) => void) | undefined;
382
+ onBeforetoggle?: ((payload: ToggleEvent) => void) | undefined;
383
+ onToggle?: ((payload: ToggleEvent) => void) | undefined;
384
+ onWheel?: ((payload: WheelEvent) => void) | undefined;
385
+ onAnimationcancel?: ((payload: AnimationEvent) => void) | undefined;
386
+ onAnimationstart?: ((payload: AnimationEvent) => void) | undefined;
387
+ onAnimationend?: ((payload: AnimationEvent) => void) | undefined;
388
+ onAnimationiteration?: ((payload: AnimationEvent) => void) | undefined;
389
+ onSecuritypolicyviolation?: ((payload: SecurityPolicyViolationEvent) => void) | undefined;
390
+ onTransitioncancel?: ((payload: TransitionEvent) => void) | undefined;
391
+ onTransitionend?: ((payload: TransitionEvent) => void) | undefined;
392
+ onTransitionrun?: ((payload: TransitionEvent) => void) | undefined;
393
+ onTransitionstart?: ((payload: TransitionEvent) => void) | undefined;
394
+ key?: PropertyKey | undefined;
395
+ ref?: import("vue").VNodeRef | undefined;
396
+ ref_for?: boolean | undefined | undefined;
397
+ ref_key?: string | undefined | undefined;
398
+ }> & Readonly<{}>, {
399
+ icon: false | IconName;
400
+ tone: "neutral" | "warning" | "danger";
401
+ }, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
402
+ declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
403
+ declare const _default: typeof __VLS_export;
404
+ export default _default;
405
+ type __VLS_WithSlots<T, S> = T & {
406
+ new (): {
407
+ $slots: S;
408
+ };
409
+ };
@@ -1,44 +1,142 @@
1
1
  <template>
2
2
  <form
3
+ v-if="as === 'form'"
3
4
  ref="formRef"
4
5
  class="k-form"
5
6
  novalidate
6
7
  :aria-busy="form.submitting.value ? 'true' : void 0"
7
- @submit.prevent="onSubmit"
8
- @reset.prevent="onReset"
8
+ @submit="onSubmitEvent"
9
+ @reset="onResetEvent"
9
10
  >
11
+ <template v-if="alerts === 'start'">
12
+ <slot name="alerts" :errors="rootErrors" :warnings="rootWarnings">
13
+ <FormAlerts :errors="rootErrors" :warnings="rootWarnings" />
14
+ </slot>
15
+ </template>
10
16
  <slot
11
17
  :values="form.values"
12
18
  :errors="form.errors"
19
+ :warnings="form.warnings"
20
+ :root-errors="rootErrors"
21
+ :root-warnings="rootWarnings"
13
22
  :dirty="form.dirty.value"
14
23
  :submitting="form.submitting.value"
15
24
  />
25
+ <template v-if="alerts === 'end'">
26
+ <slot name="alerts" :errors="rootErrors" :warnings="rootWarnings">
27
+ <FormAlerts :errors="rootErrors" :warnings="rootWarnings" />
28
+ </slot>
29
+ </template>
16
30
  </form>
31
+ <div
32
+ v-else
33
+ ref="divRef"
34
+ class="k-form"
35
+ :aria-busy="form.submitting.value ? 'true' : void 0"
36
+ @keydown="onKeydown"
37
+ @click="onClick"
38
+ >
39
+ <template v-if="alerts === 'start'">
40
+ <slot name="alerts" :errors="rootErrors" :warnings="rootWarnings">
41
+ <FormAlerts :errors="rootErrors" :warnings="rootWarnings" />
42
+ </slot>
43
+ </template>
44
+ <slot
45
+ :values="form.values"
46
+ :errors="form.errors"
47
+ :warnings="form.warnings"
48
+ :root-errors="rootErrors"
49
+ :root-warnings="rootWarnings"
50
+ :dirty="form.dirty.value"
51
+ :submitting="form.submitting.value"
52
+ />
53
+ <template v-if="alerts === 'end'">
54
+ <slot name="alerts" :errors="rootErrors" :warnings="rootWarnings">
55
+ <FormAlerts :errors="rootErrors" :warnings="rootWarnings" />
56
+ </slot>
57
+ </template>
58
+ </div>
17
59
  </template>
18
60
 
19
61
  <script setup>
20
- import { nextTick, provide, useTemplateRef } from "vue";
21
- import { FORM_KEY } from "../../internal/keys";
62
+ import { computed, nextTick, useTemplateRef } from "vue";
63
+ import { provideForm } from "../../composables/useForm";
64
+ import FormAlerts from "./FormAlerts.vue";
22
65
  const props = defineProps({
23
66
  form: { type: Object, required: true },
24
- focusOnError: { type: Boolean, required: false, default: true }
67
+ as: { type: String, required: false, default: "form" },
68
+ focusOnError: { type: Boolean, required: false, default: true },
69
+ alerts: { type: [String, Boolean], required: false, default: "start" }
25
70
  });
26
71
  const emit = defineEmits(["submitted", "invalid", "reset"]);
27
72
  const formRef = useTemplateRef("formRef");
28
- provide(FORM_KEY, props.form);
29
- async function onSubmit() {
73
+ const divRef = useTemplateRef("divRef");
74
+ const rootRef = computed(() => formRef.value ?? divRef.value);
75
+ const rootErrors = computed(() => props.form.rootErrors?.value ?? []);
76
+ const rootWarnings = computed(() => props.form.rootWarnings?.value ?? []);
77
+ provideForm(props.form);
78
+ const IMPLICIT_SUBMIT_SKIP = /* @__PURE__ */ new Set([
79
+ "button",
80
+ "submit",
81
+ "reset",
82
+ "image",
83
+ "checkbox",
84
+ "radio",
85
+ "file",
86
+ "color",
87
+ "range",
88
+ "hidden"
89
+ ]);
90
+ function ownsTarget(target) {
91
+ if (!(target instanceof Element)) return false;
92
+ return target.closest("form, .k-form") === rootRef.value;
93
+ }
94
+ async function submit() {
30
95
  const ok = await props.form.submit();
31
96
  if (ok) {
32
97
  emit("submitted");
33
- return;
98
+ return true;
34
99
  }
35
100
  emit("invalid");
36
- if (!props.focusOnError) return;
101
+ if (!props.focusOnError) return false;
37
102
  await nextTick();
38
- formRef.value?.querySelector('[aria-invalid="true"]')?.focus();
103
+ const control = rootRef.value?.querySelector('[aria-invalid="true"]');
104
+ if (control) control.focus();
105
+ else rootRef.value?.querySelector(".k-form-alerts")?.focus();
106
+ return false;
39
107
  }
40
- function onReset() {
108
+ function reset() {
41
109
  props.form.reset();
42
110
  emit("reset");
43
111
  }
112
+ function onSubmitEvent(event) {
113
+ if (event.target !== formRef.value) return;
114
+ event.preventDefault();
115
+ void submit();
116
+ }
117
+ function onResetEvent(event) {
118
+ if (event.target !== formRef.value) return;
119
+ event.preventDefault();
120
+ reset();
121
+ }
122
+ function onKeydown(event) {
123
+ if (event.key !== "Enter" || event.defaultPrevented) return;
124
+ if (event.isComposing || event.shiftKey || event.altKey) return;
125
+ const target = event.target;
126
+ if (!(target instanceof HTMLInputElement) || IMPLICIT_SUBMIT_SKIP.has(target.type)) return;
127
+ if (!ownsTarget(target)) return;
128
+ event.preventDefault();
129
+ void submit();
130
+ }
131
+ function onClick(event) {
132
+ if (event.defaultPrevented || !(event.target instanceof Element)) return;
133
+ const button = event.target.closest(
134
+ 'button[type="submit"], button:not([type]), input[type="submit"], button[type="reset"], input[type="reset"]'
135
+ );
136
+ if (!button || button.disabled || !ownsTarget(button)) return;
137
+ event.preventDefault();
138
+ if (button.type === "reset") reset();
139
+ else void submit();
140
+ }
141
+ defineExpose({ submit, reset, el: rootRef });
44
142
  </script>
@@ -1,24 +1,63 @@
1
1
  import type { FormSchema, UseFormReturn } from '../../composables/useForm';
2
- declare const __VLS_export: <S extends FormSchema>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
2
+ declare const __VLS_export: <S extends FormSchema, V extends object>(__VLS_props: NonNullable<Awaited<typeof __VLS_setup>>["props"], __VLS_ctx?: __VLS_PrettifyLocal<Pick<NonNullable<Awaited<typeof __VLS_setup>>, "attrs" | "emit" | "slots">>, __VLS_exposed?: NonNullable<Awaited<typeof __VLS_setup>>["expose"], __VLS_setup?: Promise<{
3
3
  props: import("vue").PublicProps & __VLS_PrettifyLocal<{
4
- form: UseFormReturn<S>;
4
+ form: UseFormReturn<S, V>;
5
+ as?: "form" | "div";
5
6
  focusOnError?: boolean;
7
+ alerts?: "start" | "end" | false;
6
8
  } & {
7
9
  onInvalid?: (() => any) | undefined;
8
10
  onReset?: (() => any) | undefined;
9
11
  onSubmitted?: (() => any) | undefined;
10
- } & Partial<import("vue").FormHTMLAttributes & import("vue").ReservedProps>> & (typeof globalThis extends {
12
+ } & Partial<import("vue").FormHTMLAttributes & import("vue").ReservedProps & import("vue").HTMLAttributes>> & (typeof globalThis extends {
11
13
  __VLS_PROPS_FALLBACK: infer P;
12
14
  } ? P : {});
13
- expose: (exposed: {}) => void;
15
+ expose: (exposed: import("vue").ShallowUnwrapRef<{
16
+ submit: () => Promise<boolean>;
17
+ reset: () => void;
18
+ el: import("vue").ComputedRef<HTMLElement | null>;
19
+ }>) => void;
14
20
  attrs: any;
15
21
  slots: {
22
+ alerts?: (props: {
23
+ errors: readonly string[];
24
+ warnings: readonly string[];
25
+ }) => any;
26
+ } & {
16
27
  default?: (props: {
17
- values: import("vue").UnwrapRef<import("../..").FormValues<S>>;
18
- errors: Partial<Record<keyof S & string, string>>;
28
+ values: import("vue").UnwrapRef<V>;
29
+ errors: import("../../index.ts").FormErrors<S>;
30
+ warnings: Readonly<import("../../index.ts").FormMessageMap>;
31
+ rootErrors: readonly string[];
32
+ rootWarnings: readonly string[];
19
33
  dirty: boolean;
20
34
  submitting: boolean;
21
35
  }) => any;
36
+ } & {
37
+ alerts?: (props: {
38
+ errors: readonly string[];
39
+ warnings: readonly string[];
40
+ }) => any;
41
+ } & {
42
+ alerts?: (props: {
43
+ errors: readonly string[];
44
+ warnings: readonly string[];
45
+ }) => any;
46
+ } & {
47
+ default?: (props: {
48
+ values: import("vue").UnwrapRef<V>;
49
+ errors: import("../../index.ts").FormErrors<S>;
50
+ warnings: Readonly<import("../../index.ts").FormMessageMap>;
51
+ rootErrors: readonly string[];
52
+ rootWarnings: readonly string[];
53
+ dirty: boolean;
54
+ submitting: boolean;
55
+ }) => any;
56
+ } & {
57
+ alerts?: (props: {
58
+ errors: readonly string[];
59
+ warnings: readonly string[];
60
+ }) => any;
22
61
  };
23
62
  emit: ((evt: "invalid") => void) & ((evt: "reset") => void) & ((evt: "submitted") => void);
24
63
  }>) => import("vue").VNode & {