@bridge-ui/vue 0.5.1 → 0.7.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.
- package/ai/skills/bridge-ui-components/SKILL.md +2 -2
- package/dist/Adapters/I18n/useI18nAdapter.d.ts +1 -1
- package/dist/Adapters/I18n/useI18nAdapter.js +4 -1
- package/dist/Components/Accordion/Accordion.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/Components/Accordion/accordion.types.d.ts +2 -2
- package/dist/Components/Alert/alertDefaultIcons.js +1 -0
- package/dist/Components/Autocomplete/composables/useAutocomplete.d.ts +2 -2
- package/dist/Components/Autocomplete/composables/useAutocomplete.js +150 -145
- package/dist/Components/BaseField/BaseField.vue_vue_type_script_setup_true_lang.js +33 -28
- package/dist/Components/BaseField/BaseFieldCorner.js +5 -0
- package/dist/Components/BaseField/BaseFieldCorner.vue.d.ts +17 -0
- package/dist/Components/BaseField/BaseFieldCorner.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/BaseField/baseField.types.d.ts +4 -2
- package/dist/Components/BaseField/composables/useBaseField.d.ts +1 -1
- package/dist/Components/BaseField/composables/useBaseField.js +11 -8
- package/dist/Components/Button/Button.vue_vue_type_script_setup_true_lang.js +1 -0
- package/dist/Components/Button/button.types.d.ts +6 -0
- package/dist/Components/Button/composables/useButton.d.ts +4 -1
- package/dist/Components/Button/composables/useButton.js +88 -69
- package/dist/Components/ButtonGroup/ButtonGroup.js +5 -0
- package/dist/Components/ButtonGroup/ButtonGroup.vue.d.ts +14 -0
- package/dist/Components/ButtonGroup/ButtonGroup.vue_vue_type_script_setup_true_lang.js +37 -0
- package/dist/Components/ButtonGroup/buttonGroup.types.d.ts +93 -0
- package/dist/Components/ButtonGroup/buttonGroupInjectionKey.d.ts +7 -0
- package/dist/Components/ButtonGroup/buttonGroupInjectionKey.js +4 -0
- package/dist/Components/ButtonGroup/composables/useButtonGroup.d.ts +16 -0
- package/dist/Components/ButtonGroup/composables/useButtonGroup.js +66 -0
- package/dist/Components/ButtonGroup/index.d.ts +4 -0
- package/dist/Components/ButtonGroup/index.js +4 -0
- package/dist/Components/Calendar/Calendar.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/Components/CalendarRange/CalendarRange.vue_vue_type_script_setup_true_lang.js +2 -2
- package/dist/Components/Checkbox/composables/useCheckbox.js +1 -1
- package/dist/Components/ColorField/composables/useColorField.d.ts +1 -1
- package/dist/Components/DataTable/DataTable.vue_vue_type_script_setup_true_lang.js +180 -158
- package/dist/Components/DataTable/DataTableColumnsMenu.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/Components/DataTable/DataTableFilterMenu.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/Components/DataTable/DataTableFilterOptions.vue_vue_type_script_setup_true_lang.js +1 -1
- package/dist/Components/DataTable/DataTablePagination.js +5 -0
- package/dist/Components/DataTable/DataTablePagination.vue.d.ts +24 -0
- package/dist/Components/DataTable/DataTablePagination.vue_vue_type_script_setup_true_lang.js +40 -0
- package/dist/Components/DataTable/DataTableSortButton.vue.d.ts +5 -11
- package/dist/Components/DataTable/DataTableSortButton.vue_vue_type_script_setup_true_lang.js +22 -26
- package/dist/Components/DataTable/composables/useDataTable.d.ts +8 -6
- package/dist/Components/DataTable/composables/useDataTable.js +268 -263
- package/dist/Components/DataTable/composables/useDataTablePagination.d.ts +69 -0
- package/dist/Components/DataTable/composables/useDataTablePagination.js +130 -0
- package/dist/Components/DataTable/dataTable.types.d.ts +27 -12
- package/dist/Components/DataTable/dataTablePagination.types.d.ts +169 -0
- package/dist/Components/DataTable/index.d.ts +2 -1
- package/dist/Components/DateField/composables/useDateField.d.ts +1 -1
- package/dist/Components/DateRangeField/composables/useDateRangeField.d.ts +1 -1
- package/dist/Components/DateTimeField/composables/useDateTimeField.d.ts +1 -1
- package/dist/Components/DateTimeRangeField/composables/useDateTimeRangeField.d.ts +1 -1
- package/dist/Components/FieldOverlay/composables/useFieldOverlay.js +4 -1
- package/dist/Components/FormField/FilledFormField.vue.d.ts +7 -7
- package/dist/Components/FormField/FilledFormField.vue_vue_type_script_setup_true_lang.js +32 -27
- package/dist/Components/FormField/FormFieldCorner.js +5 -0
- package/dist/Components/FormField/FormFieldCorner.vue.d.ts +17 -0
- package/dist/Components/FormField/FormFieldCorner.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/FormField/NotchedFormField.vue.d.ts +7 -7
- package/dist/Components/FormField/NotchedFormField.vue_vue_type_script_setup_true_lang.js +31 -26
- package/dist/Components/FormField/OutlinedFormField.vue.d.ts +7 -7
- package/dist/Components/FormField/OutlinedFormField.vue_vue_type_script_setup_true_lang.js +32 -27
- package/dist/Components/FormField/StackedFormField.vue.d.ts +6 -6
- package/dist/Components/FormField/StackedFormField.vue_vue_type_script_setup_true_lang.js +34 -29
- package/dist/Components/FormField/UnderlinedFormField.vue.d.ts +7 -7
- package/dist/Components/FormField/UnderlinedFormField.vue_vue_type_script_setup_true_lang.js +32 -27
- package/dist/Components/FormField/composables/useFormField.d.ts +1 -1
- package/dist/Components/FormField/composables/useFormField.js +15 -9
- package/dist/Components/FormField/formField.types.d.ts +4 -2
- package/dist/Components/List/composables/useList.js +1 -1
- package/dist/Components/ListItem/ListItem.vue.d.ts +1 -1
- package/dist/Components/ListItem/composables/useListItem.d.ts +2 -2
- package/dist/Components/ListItem/composables/useListItem.js +101 -86
- package/dist/Components/ListSection/composables/useListSection.js +34 -31
- package/dist/Components/ListSection/listSection.types.d.ts +2 -1
- package/dist/Components/Listbox/Listbox.vue_vue_type_script_setup_true_lang.js +82 -82
- package/dist/Components/Listbox/collectComposedListboxOptions.d.ts +5 -0
- package/dist/Components/Listbox/collectComposedListboxOptions.js +27 -0
- package/dist/Components/NumberField/composables/useNumberField.d.ts +1 -1
- package/dist/Components/OtpField/composables/useOtpField.d.ts +1 -1
- package/dist/Components/Pagination/Pagination.vue_vue_type_script_setup_true_lang.js +6 -6
- package/dist/Components/Pagination/composables/usePagination.d.ts +4 -2
- package/dist/Components/Pagination/composables/usePagination.js +125 -127
- package/dist/Components/Pagination/pagination.types.d.ts +5 -5
- package/dist/Components/PasswordField/composables/usePasswordField.d.ts +1 -1
- package/dist/Components/Radio/composables/useRadio.js +2 -1
- package/dist/Components/Select/composables/useSelect.d.ts +2 -2
- package/dist/Components/Select/composables/useSelect.js +104 -99
- package/dist/Components/Sidebar/composables/useSidebarListItem.js +29 -28
- package/dist/Components/Sidebar/composables/useSidebarTrigger.js +14 -14
- package/dist/Components/Slider/composables/useSlider.d.ts +1 -1
- package/dist/Components/Slider/composables/useSlider.js +53 -53
- package/dist/Components/Snackbar/snackbarDefaultIcons.js +1 -0
- package/dist/Components/Tabs/Tabs.vue_vue_type_script_setup_true_lang.js +13 -12
- package/dist/Components/Tabs/composables/useTabs.js +16 -10
- package/dist/Components/Tabs/tabs.types.d.ts +3 -3
- package/dist/Components/TextField/composables/useTextField.d.ts +1 -1
- package/dist/Components/Textarea/composables/useTextarea.d.ts +1 -1
- package/dist/Components/TimeField/composables/useTimeField.d.ts +1 -1
- package/dist/Components/TimePanel/composables/useTimePanel.js +106 -106
- package/dist/Components/TimeRangeField/composables/useTimeRangeField.d.ts +1 -1
- package/dist/augments.d.ts +5 -0
- package/dist/index.d.ts +3 -1
- package/dist/index.js +150 -147
- package/docs/README.md +1 -0
- package/docs/components/Accordion.md +1 -1
- package/docs/components/Badge.md +2 -0
- package/docs/components/Button.md +5 -1
- package/docs/components/ButtonGroup.md +124 -0
- package/docs/components/DataTable.md +9 -11
- package/docs/components/Divider.md +1 -0
- package/docs/components/I18n.md +65 -24
- package/docs/components/Pagination.md +5 -3
- package/docs/components/Table.md +2 -2
- package/docs/components/Tabs.md +24 -6
- package/docs/components/ToggleGroup.md +1 -1
- package/docs/examples/i18n-dictionary.ts +31 -10
- package/docs/examples/i18n-vue-i18n.ts +7 -6
- package/docs/examples/icon-fontawesome.ts +4 -0
- package/docs/examples/icon-heroicons.ts +5 -1
- package/docs/examples/icon-lucide.ts +4 -0
- package/docs/examples/icon-phosphor.ts +4 -0
- package/docs/examples/icon-tabler.ts +4 -0
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -20,150 +20,153 @@ import { useLabel as k } from "./Components/Label/composables/useLabel.js";
|
|
|
20
20
|
import A from "./Components/Label/Label.js";
|
|
21
21
|
import j from "./Components/FormField/FormField.js";
|
|
22
22
|
import { useListbox as M } from "./Components/Listbox/composables/useListbox.js";
|
|
23
|
-
import {
|
|
24
|
-
import P from "./Components/Button/
|
|
25
|
-
import
|
|
26
|
-
import {
|
|
27
|
-
import L from "./Components/Drawer/
|
|
28
|
-
import
|
|
29
|
-
import z from "./Components/Menu/
|
|
30
|
-
import
|
|
31
|
-
import V from "./Components/Modal/
|
|
32
|
-
import H from "./Components/
|
|
33
|
-
import
|
|
34
|
-
import W from "./Components/List/
|
|
35
|
-
import G from "./Components/
|
|
36
|
-
import K from "./Components/
|
|
37
|
-
import
|
|
38
|
-
import J from "./Components/Progress/
|
|
39
|
-
import Y from "./Components/
|
|
40
|
-
import X from "./Components/
|
|
41
|
-
import Z from "./Components/Autocomplete/
|
|
42
|
-
import Q from "./Components/
|
|
43
|
-
import
|
|
44
|
-
import ee from "./Components/Badge/
|
|
45
|
-
import te from "./Components/
|
|
46
|
-
import
|
|
47
|
-
import {
|
|
48
|
-
import {
|
|
49
|
-
import ae from "./Components/BreadcrumbItem/
|
|
50
|
-
import oe from "./Components/
|
|
51
|
-
import
|
|
52
|
-
import {
|
|
53
|
-
import le from "./Components/
|
|
54
|
-
import {
|
|
55
|
-
import de from "./Components/
|
|
56
|
-
import
|
|
57
|
-
import pe from "./Components/
|
|
58
|
-
import me from "./Components/
|
|
59
|
-
import {
|
|
60
|
-
import
|
|
61
|
-
import _e from "./Components/
|
|
62
|
-
import ve from "./Components/CalendarRange/
|
|
63
|
-
import {
|
|
64
|
-
import be from "./Components/
|
|
65
|
-
import
|
|
66
|
-
import Se from "./Components/
|
|
67
|
-
import
|
|
68
|
-
import we from "./Components/
|
|
69
|
-
import
|
|
70
|
-
import {
|
|
71
|
-
import De from "./Components/
|
|
72
|
-
import Oe from "./Components/ColorField/
|
|
73
|
-
import {
|
|
74
|
-
import
|
|
75
|
-
import je from "./Components/
|
|
76
|
-
import Me from "./Components/DateField/
|
|
77
|
-
import {
|
|
78
|
-
import
|
|
79
|
-
import Fe from "./Components/
|
|
80
|
-
import Ie from "./Components/DateRangeField/
|
|
81
|
-
import {
|
|
82
|
-
import
|
|
83
|
-
import
|
|
84
|
-
import Be from "./Components/
|
|
85
|
-
import Ve from "./Components/DateTimePicker/
|
|
86
|
-
import He from "./Components/
|
|
87
|
-
import
|
|
88
|
-
import
|
|
89
|
-
import Ge from "./Components/
|
|
90
|
-
import Ke from "./Components/DateTimeRangeField/
|
|
91
|
-
import {
|
|
92
|
-
import Je from "./Components/
|
|
93
|
-
import
|
|
94
|
-
import Xe from "./Components/
|
|
95
|
-
import
|
|
96
|
-
import Qe from "./Components/
|
|
97
|
-
import
|
|
98
|
-
import et from "./Components/
|
|
99
|
-
import
|
|
100
|
-
import nt from "./Components/
|
|
101
|
-
import
|
|
102
|
-
import it from "./Components/
|
|
103
|
-
import
|
|
104
|
-
import ot from "./Components/
|
|
105
|
-
import st from "./Components/
|
|
106
|
-
import ct from "./Components/
|
|
107
|
-
import
|
|
108
|
-
import
|
|
109
|
-
import
|
|
110
|
-
import {
|
|
111
|
-
import {
|
|
112
|
-
import {
|
|
113
|
-
import {
|
|
114
|
-
import gt from "./Components/Sidebar/
|
|
115
|
-
import _t from "./Components/Sidebar/
|
|
116
|
-
import vt from "./Components/Sidebar/
|
|
117
|
-
import
|
|
118
|
-
import bt from "./Components/
|
|
119
|
-
import xt from "./Components/Sidebar/
|
|
120
|
-
import St from "./Components/
|
|
121
|
-
import Ct from "./Components/
|
|
122
|
-
import
|
|
123
|
-
import Tt from "./Components/
|
|
124
|
-
import
|
|
125
|
-
import Dt from "./Components/
|
|
126
|
-
import
|
|
127
|
-
import kt from "./Components/
|
|
128
|
-
import
|
|
129
|
-
import jt from "./Components/
|
|
130
|
-
import
|
|
131
|
-
import Nt from "./Components/
|
|
132
|
-
import
|
|
133
|
-
import Ft from "./Components/
|
|
134
|
-
import
|
|
135
|
-
import Lt from "./Components/
|
|
136
|
-
import
|
|
137
|
-
import {
|
|
138
|
-
import Bt from "./Components/
|
|
139
|
-
import {
|
|
140
|
-
import Ht from "./Components/
|
|
141
|
-
import
|
|
142
|
-
import Wt from "./Components/
|
|
143
|
-
import
|
|
144
|
-
import Kt from "./Components/
|
|
145
|
-
import
|
|
146
|
-
import Jt from "./Components/
|
|
147
|
-
import
|
|
148
|
-
import Xt from "./Components/
|
|
149
|
-
import
|
|
150
|
-
import Qt from "./Components/
|
|
151
|
-
import
|
|
152
|
-
import {
|
|
153
|
-
import tn from "./Components/
|
|
154
|
-
import nn from "./Components/TimeField/
|
|
155
|
-
import {
|
|
156
|
-
import
|
|
157
|
-
import on from "./Components/
|
|
158
|
-
import sn from "./Components/TimeRangeField/
|
|
159
|
-
import {
|
|
160
|
-
import
|
|
161
|
-
import un from "./Components/
|
|
162
|
-
import {
|
|
163
|
-
import fn from "./Components/
|
|
164
|
-
import pn from "./
|
|
165
|
-
import {
|
|
166
|
-
import
|
|
167
|
-
import
|
|
168
|
-
import {
|
|
169
|
-
|
|
23
|
+
import { BUTTON_GROUP_INJECTION_KEY as N } from "./Components/ButtonGroup/buttonGroupInjectionKey.js";
|
|
24
|
+
import { useButton as P } from "./Components/Button/composables/useButton.js";
|
|
25
|
+
import F from "./Components/Button/Button.js";
|
|
26
|
+
import { useFieldOverlay as I } from "./Components/FieldOverlay/composables/useFieldOverlay.js";
|
|
27
|
+
import { useDrawer as L } from "./Components/Drawer/composables/useDrawer.js";
|
|
28
|
+
import R from "./Components/Drawer/Drawer.js";
|
|
29
|
+
import { useMenu as z } from "./Components/Menu/composables/useMenu.js";
|
|
30
|
+
import B from "./Components/Menu/Menu.js";
|
|
31
|
+
import { useModal as V } from "./Components/Modal/composables/useModal.js";
|
|
32
|
+
import H from "./Components/Modal/Modal.js";
|
|
33
|
+
import U from "./Components/FieldOverlay/FieldOverlay.js";
|
|
34
|
+
import { useList as W } from "./Components/List/composables/useList.js";
|
|
35
|
+
import G from "./Components/List/List.js";
|
|
36
|
+
import K from "./Components/ListItem/ListItem.js";
|
|
37
|
+
import q from "./Components/ListSection/ListSection.js";
|
|
38
|
+
import { useProgress as J } from "./Components/Progress/composables/useProgress.js";
|
|
39
|
+
import Y from "./Components/Progress/Progress.js";
|
|
40
|
+
import X from "./Components/Listbox/Listbox.js";
|
|
41
|
+
import Z from "./Components/Autocomplete/Autocomplete.js";
|
|
42
|
+
import Q from "./Components/Autocomplete/AutocompleteOption.js";
|
|
43
|
+
import $ from "./Components/Avatar/Avatar.js";
|
|
44
|
+
import { useBadge as ee } from "./Components/Badge/composables/useBadge.js";
|
|
45
|
+
import te from "./Components/Badge/Badge.js";
|
|
46
|
+
import ne from "./Components/BaseField/BaseField.js";
|
|
47
|
+
import { useBaseField as re } from "./Components/BaseField/composables/useBaseField.js";
|
|
48
|
+
import { useBreadcrumb as ie } from "./Components/Breadcrumb/composables/useBreadcrumb.js";
|
|
49
|
+
import { useBreadcrumbItem as ae } from "./Components/BreadcrumbItem/composables/useBreadcrumbItem.js";
|
|
50
|
+
import oe from "./Components/BreadcrumbItem/BreadcrumbItem.js";
|
|
51
|
+
import se from "./Components/Breadcrumb/Breadcrumb.js";
|
|
52
|
+
import { useButtonGroup as ce } from "./Components/ButtonGroup/composables/useButtonGroup.js";
|
|
53
|
+
import le from "./Components/ButtonGroup/ButtonGroup.js";
|
|
54
|
+
import { useCalendar as ue } from "./Components/Calendar/composables/useCalendar.js";
|
|
55
|
+
import { useCalendarDate as de } from "./Components/CalendarDate/composables/useCalendarDate.js";
|
|
56
|
+
import fe from "./Components/CalendarDate/CalendarDate.js";
|
|
57
|
+
import { useCalendarMonth as pe } from "./Components/CalendarMonth/composables/useCalendarMonth.js";
|
|
58
|
+
import me from "./Components/CalendarMonth/CalendarMonth.js";
|
|
59
|
+
import { useCalendarYear as he } from "./Components/CalendarYear/composables/useCalendarYear.js";
|
|
60
|
+
import ge from "./Components/CalendarYear/CalendarYear.js";
|
|
61
|
+
import _e from "./Components/Calendar/Calendar.js";
|
|
62
|
+
import { useCalendarRange as ve } from "./Components/CalendarRange/composables/useCalendarRange.js";
|
|
63
|
+
import { useDivider as ye } from "./Components/Divider/composables/useDivider.js";
|
|
64
|
+
import be from "./Components/Divider/Divider.js";
|
|
65
|
+
import xe from "./Components/CalendarRange/CalendarRange.js";
|
|
66
|
+
import { useCard as Se } from "./Components/Card/composables/useCard.js";
|
|
67
|
+
import Ce from "./Components/Card/Card.js";
|
|
68
|
+
import { useFormControl as we } from "./Components/FormControl/composables/useFormControl.js";
|
|
69
|
+
import Te from "./Components/FormControl/FormControl.js";
|
|
70
|
+
import { useCheckbox as Ee } from "./Components/Checkbox/composables/useCheckbox.js";
|
|
71
|
+
import De from "./Components/Checkbox/Checkbox.js";
|
|
72
|
+
import { useColorField as Oe } from "./Components/ColorField/composables/useColorField.js";
|
|
73
|
+
import { useColorPicker as ke } from "./Components/ColorPicker/composables/useColorPicker.js";
|
|
74
|
+
import Ae from "./Components/ColorPicker/ColorPicker.js";
|
|
75
|
+
import je from "./Components/ColorField/ColorField.js";
|
|
76
|
+
import { useDateField as Me } from "./Components/DateField/composables/useDateField.js";
|
|
77
|
+
import { useDatePicker as Ne } from "./Components/DatePicker/composables/useDatePicker.js";
|
|
78
|
+
import Pe from "./Components/DatePicker/DatePicker.js";
|
|
79
|
+
import Fe from "./Components/DateField/DateField.js";
|
|
80
|
+
import { useDateRangeField as Ie } from "./Components/DateRangeField/composables/useDateRangeField.js";
|
|
81
|
+
import { useDateRangePicker as Le } from "./Components/DateRangePicker/composables/useDateRangePicker.js";
|
|
82
|
+
import Re from "./Components/DateRangePicker/DateRangePicker.js";
|
|
83
|
+
import ze from "./Components/DateRangeField/DateRangeField.js";
|
|
84
|
+
import { useDateTimeField as Be } from "./Components/DateTimeField/composables/useDateTimeField.js";
|
|
85
|
+
import { useDateTimePicker as Ve } from "./Components/DateTimePicker/composables/useDateTimePicker.js";
|
|
86
|
+
import { useTimePanel as He } from "./Components/TimePanel/composables/useTimePanel.js";
|
|
87
|
+
import Ue from "./Components/TimePanel/TimePanel.js";
|
|
88
|
+
import We from "./Components/DateTimePicker/DateTimePicker.js";
|
|
89
|
+
import Ge from "./Components/DateTimeField/DateTimeField.js";
|
|
90
|
+
import { useDateTimeRangeField as Ke } from "./Components/DateTimeRangeField/composables/useDateTimeRangeField.js";
|
|
91
|
+
import { useDateTimeRangePicker as qe } from "./Components/DateTimeRangePicker/composables/useDateTimeRangePicker.js";
|
|
92
|
+
import Je from "./Components/DateTimeRangePicker/DateTimeRangePicker.js";
|
|
93
|
+
import Ye from "./Components/DateTimeRangeField/DateTimeRangeField.js";
|
|
94
|
+
import { useEmptyState as Xe } from "./Components/EmptyState/composables/useEmptyState.js";
|
|
95
|
+
import Ze from "./Components/EmptyState/EmptyState.js";
|
|
96
|
+
import { useLink as Qe } from "./Components/Link/composables/useLink.js";
|
|
97
|
+
import $e from "./Components/Link/Link.js";
|
|
98
|
+
import { useNumberField as et } from "./Components/NumberField/composables/useNumberField.js";
|
|
99
|
+
import tt from "./Components/NumberField/NumberField.js";
|
|
100
|
+
import { useOtpField as nt } from "./Components/OtpField/composables/useOtpField.js";
|
|
101
|
+
import rt from "./Components/OtpField/OtpField.js";
|
|
102
|
+
import { usePagination as it } from "./Components/Pagination/composables/usePagination.js";
|
|
103
|
+
import at from "./Components/Pagination/Pagination.js";
|
|
104
|
+
import { usePasswordField as ot } from "./Components/PasswordField/composables/usePasswordField.js";
|
|
105
|
+
import st from "./Components/PasswordField/PasswordField.js";
|
|
106
|
+
import { useRadio as ct } from "./Components/Radio/composables/useRadio.js";
|
|
107
|
+
import lt from "./Components/Radio/Radio.js";
|
|
108
|
+
import ut from "./Components/Select/Select.js";
|
|
109
|
+
import dt from "./Components/Select/SelectOption.js";
|
|
110
|
+
import { useSidebar as ft } from "./Components/Sidebar/composables/useSidebar.js";
|
|
111
|
+
import { useSidebarInset as pt } from "./Components/Sidebar/composables/useSidebarInset.js";
|
|
112
|
+
import { useSidebarList as mt } from "./Components/Sidebar/composables/useSidebarList.js";
|
|
113
|
+
import { useSidebarListItem as ht } from "./Components/Sidebar/composables/useSidebarListItem.js";
|
|
114
|
+
import { useSidebarProvider as gt } from "./Components/Sidebar/composables/useSidebarProvider.js";
|
|
115
|
+
import { useSidebarShell as _t } from "./Components/Sidebar/composables/useSidebarShell.js";
|
|
116
|
+
import { useSidebarTrigger as vt } from "./Components/Sidebar/composables/useSidebarTrigger.js";
|
|
117
|
+
import yt from "./Components/Sidebar/Sidebar.js";
|
|
118
|
+
import bt from "./Components/Sidebar/SidebarInset.js";
|
|
119
|
+
import xt from "./Components/Sidebar/SidebarList.js";
|
|
120
|
+
import { useTooltip as St } from "./Components/Tooltip/composables/useTooltip.js";
|
|
121
|
+
import Ct from "./Components/Tooltip/Tooltip.js";
|
|
122
|
+
import wt from "./Components/Sidebar/SidebarListItem.js";
|
|
123
|
+
import Tt from "./Components/Sidebar/SidebarProvider.js";
|
|
124
|
+
import Et from "./Components/Sidebar/SidebarTrigger.js";
|
|
125
|
+
import { useSkeleton as Dt } from "./Components/Skeleton/composables/useSkeleton.js";
|
|
126
|
+
import Ot from "./Components/Skeleton/Skeleton.js";
|
|
127
|
+
import { useSlider as kt } from "./Components/Slider/composables/useSlider.js";
|
|
128
|
+
import At from "./Components/Slider/Slider.js";
|
|
129
|
+
import { useSnackbar as jt } from "./Components/Snackbar/composables/useSnackbar.js";
|
|
130
|
+
import Mt from "./Components/Snackbar/Snackbar.js";
|
|
131
|
+
import { useSpinner as Nt } from "./Components/Spinner/composables/useSpinner.js";
|
|
132
|
+
import Pt from "./Components/Spinner/Spinner.js";
|
|
133
|
+
import { useStep as Ft } from "./Components/Step/composables/useStep.js";
|
|
134
|
+
import It from "./Components/Step/Step.js";
|
|
135
|
+
import { useStepper as Lt } from "./Components/Stepper/composables/useStepper.js";
|
|
136
|
+
import Rt from "./Components/Stepper/Stepper.js";
|
|
137
|
+
import { useSwitch as zt } from "./Components/Switch/composables/useSwitch.js";
|
|
138
|
+
import Bt from "./Components/Switch/Switch.js";
|
|
139
|
+
import { TABS_INJECTION_KEY as Vt } from "./Components/Tabs/tabsInjectionKey.js";
|
|
140
|
+
import { useTab as Ht } from "./Components/Tab/composables/useTab.js";
|
|
141
|
+
import Ut from "./Components/Tab/Tab.js";
|
|
142
|
+
import { useTabItem as Wt } from "./Components/TabItem/composables/useTabItem.js";
|
|
143
|
+
import Gt from "./Components/TabItem/TabItem.js";
|
|
144
|
+
import { useTabList as Kt } from "./Components/TabList/composables/useTabList.js";
|
|
145
|
+
import qt from "./Components/TabList/TabList.js";
|
|
146
|
+
import { useTabPanel as Jt } from "./Components/TabPanel/composables/useTabPanel.js";
|
|
147
|
+
import Yt from "./Components/TabPanel/TabPanel.js";
|
|
148
|
+
import { useTabs as Xt } from "./Components/Tabs/composables/useTabs.js";
|
|
149
|
+
import Zt from "./Components/Tabs/Tabs.js";
|
|
150
|
+
import { useTextarea as Qt } from "./Components/Textarea/composables/useTextarea.js";
|
|
151
|
+
import $t from "./Components/Textarea/Textarea.js";
|
|
152
|
+
import { useTextField as en } from "./Components/TextField/composables/useTextField.js";
|
|
153
|
+
import tn from "./Components/TextField/TextField.js";
|
|
154
|
+
import { useTimeField as nn } from "./Components/TimeField/composables/useTimeField.js";
|
|
155
|
+
import { useTimePicker as rn } from "./Components/TimePicker/composables/useTimePicker.js";
|
|
156
|
+
import an from "./Components/TimePicker/TimePicker.js";
|
|
157
|
+
import on from "./Components/TimeField/TimeField.js";
|
|
158
|
+
import { useTimeRangeField as sn } from "./Components/TimeRangeField/composables/useTimeRangeField.js";
|
|
159
|
+
import { useTimeRangePicker as cn } from "./Components/TimeRangePicker/composables/useTimeRangePicker.js";
|
|
160
|
+
import ln from "./Components/TimeRangePicker/TimeRangePicker.js";
|
|
161
|
+
import un from "./Components/TimeRangeField/TimeRangeField.js";
|
|
162
|
+
import { TOGGLE_GROUP_INJECTION_KEY as dn } from "./Components/ToggleGroup/toggleGroupInjectionKey.js";
|
|
163
|
+
import { useToggleGroup as fn } from "./Components/ToggleGroup/composables/useToggleGroup.js";
|
|
164
|
+
import pn from "./Components/ToggleGroup/ToggleGroup.js";
|
|
165
|
+
import { useToggleItem as mn } from "./Components/ToggleItem/composables/useToggleItem.js";
|
|
166
|
+
import hn from "./Components/ToggleItem/ToggleItem.js";
|
|
167
|
+
import gn from "./Provider/BridgeUIProvider.js";
|
|
168
|
+
import { createBridgeUI as _n } from "./Provider/createBridgeUI.js";
|
|
169
|
+
import { SEMANTIC_ICON_NAMES as vn, interpolateMessage as yn, resolveMessage as bn, selectPluralMessage as xn } from "@bridge-ui/core/Adapters";
|
|
170
|
+
import { cn as Sn } from "@bridge-ui/core/Utils";
|
|
171
|
+
import { BRIDGE_UI_DEFAULT_GLOBAL as Cn, mergeBridgeUIComponents as wn, mergeBridgeUIGlobal as Tn, resolveBridgeUIOptions as En } from "@bridge-ui/core/Config";
|
|
172
|
+
export { l as ACCORDION_INJECTION_KEY, m as Accordion, _ as AccordionItem, y as Alert, Z as Autocomplete, Q as AutocompleteOption, $ as Avatar, Cn as BRIDGE_UI_DEFAULT_GLOBAL, N as BUTTON_GROUP_INJECTION_KEY, te as Badge, ne as BaseField, se as Breadcrumb, oe as BreadcrumbItem, gn as BridgeUIProvider, F as Button, le as ButtonGroup, _e as Calendar, fe as CalendarDate, me as CalendarMonth, xe as CalendarRange, ge as CalendarYear, Ce as Card, De as Checkbox, O as Chip, je as ColorField, Ae as ColorPicker, Fe as DateField, Pe as DatePicker, ze as DateRangeField, Re as DateRangePicker, Ge as DateTimeField, We as DateTimePicker, Ye as DateTimeRangeField, Je as DateTimeRangePicker, be as Divider, R as Drawer, Ze as EmptyState, U as FieldOverlay, Te as FormControl, j as FormField, g as Icon, A as Label, $e as Link, G as List, K as ListItem, q as ListSection, X as Listbox, B as Menu, H as Modal, tt as NumberField, rt as OtpField, at as Pagination, st as PasswordField, Y as Progress, lt as Radio, vn as SEMANTIC_ICON_NAMES, ut as Select, dt as SelectOption, yt as Sidebar, bt as SidebarInset, xt as SidebarList, wt as SidebarListItem, Tt as SidebarProvider, Et as SidebarTrigger, Ot as Skeleton, At as Slider, Mt as Snackbar, Pt as Spinner, It as Step, Rt as Stepper, Bt as Switch, Vt as TABS_INJECTION_KEY, dn as TOGGLE_GROUP_INJECTION_KEY, Ut as Tab, Gt as TabItem, qt as TabList, Yt as TabPanel, Zt as Tabs, tn as TextField, $t as Textarea, on as TimeField, Ue as TimePanel, an as TimePicker, un as TimeRangeField, ln as TimeRangePicker, pn as ToggleGroup, hn as ToggleItem, Ct as Tooltip, Sn as cn, _n as createBridgeUI, x as findFirstEnabledOptionIndex, S as findLastEnabledOptionIndex, C as getListboxActiveDescendantId, w as getListboxOptionId, yn as interpolateMessage, wn as mergeBridgeUIComponents, Tn as mergeBridgeUIGlobal, T as moveListboxHighlight, En as resolveBridgeUIOptions, bn as resolveMessage, xn as selectPluralMessage, t as setDateAdapterForTests, i as setI18nAdapterForTests, s as setIconAdapterForTests, p as useAccordion, h as useAccordionItem, v as useAlert, ee as useBadge, re as useBaseField, ie as useBreadcrumb, ae as useBreadcrumbItem, u as useBreakpoint, e as useBridgeUI, d as useBridgeUIComponent, f as useBridgeUIMergedRegistryClasses, P as useButton, ce as useButtonGroup, ue as useCalendar, de as useCalendarDate, pe as useCalendarMonth, ve as useCalendarRange, he as useCalendarYear, Se as useCard, Ee as useCheckbox, D as useChip, Oe as useColorField, ke as useColorPicker, n as useDateAdapter, r as useDateAdapterContext, Me as useDateField, Ne as useDatePicker, Ie as useDateRangeField, Le as useDateRangePicker, Be as useDateTimeField, Ve as useDateTimePicker, Ke as useDateTimeRangeField, qe as useDateTimeRangePicker, ye as useDivider, L as useDrawer, Xe as useEmptyState, I as useFieldOverlay, we as useFormControl, b as useFormField, a as useI18nAdapter, c as useIconAdapter, k as useLabel, Qe as useLink, W as useList, M as useListbox, E as useListboxNavigation, z as useMenu, V as useModal, et as useNumberField, nt as useOtpField, it as usePagination, ot as usePasswordField, J as useProgress, ct as useRadio, o as useResolveMessage, ft as useSidebar, pt as useSidebarInset, mt as useSidebarList, ht as useSidebarListItem, gt as useSidebarProvider, _t as useSidebarShell, vt as useSidebarTrigger, Dt as useSkeleton, kt as useSlider, jt as useSnackbar, Nt as useSpinner, Ft as useStep, Lt as useStepper, zt as useSwitch, Ht as useTab, Wt as useTabItem, Kt as useTabList, Jt as useTabPanel, Xt as useTabs, en as useTextField, Qt as useTextarea, nn as useTimeField, He as useTimePanel, rn as useTimePicker, sn as useTimeRangeField, cn as useTimeRangePicker, fn as useToggleGroup, mn as useToggleItem, St as useTooltip };
|
package/docs/README.md
CHANGED
|
@@ -13,6 +13,7 @@ Component reference and adapter samples for **Vue**. This folder ships with the
|
|
|
13
13
|
- [BridgeUIProvider](./components/BridgeUIProvider.md)
|
|
14
14
|
- [Breadcrumb](./components/Breadcrumb.md)
|
|
15
15
|
- [Button](./components/Button.md)
|
|
16
|
+
- [ButtonGroup](./components/ButtonGroup.md)
|
|
16
17
|
- [Calendar](./components/Calendar.md)
|
|
17
18
|
- [CalendarDate](./components/CalendarDate.md)
|
|
18
19
|
- [CalendarMonth](./components/CalendarMonth.md)
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Accordion
|
|
2
2
|
|
|
3
|
-
Expandable sections for FAQs, settings groups, and stacked content. Single or multiple panels open at once. Compose with `AccordionItem`.
|
|
3
|
+
Expandable sections for FAQs, settings groups, and stacked content. Single or multiple panels open at once. Compose with `AccordionItem`. Expanded items stay on the same quiet text color; `color` optionally accents the open trigger.
|
|
4
4
|
|
|
5
5
|
## Import
|
|
6
6
|
|
package/docs/components/Badge.md
CHANGED
|
@@ -15,6 +15,8 @@ import { Button } from "@bridge-ui/vue/Components/Button";
|
|
|
15
15
|
```vue
|
|
16
16
|
<Button color="primary">Click me</Button>
|
|
17
17
|
|
|
18
|
+
<Button color="black">Black</Button>
|
|
19
|
+
|
|
18
20
|
<Button variant="outline" :start-icon="Plus">
|
|
19
21
|
With icon
|
|
20
22
|
</Button>
|
|
@@ -35,6 +37,7 @@ import { Button } from "@bridge-ui/vue/Components/Button";
|
|
|
35
37
|
```vue
|
|
36
38
|
<Button loading>Loading</Button>
|
|
37
39
|
<Button disabled>Disabled</Button>
|
|
40
|
+
<Button selected>Selected</Button>
|
|
38
41
|
```
|
|
39
42
|
|
|
40
43
|
### Slots
|
|
@@ -83,6 +86,7 @@ import { Button } from "@bridge-ui/vue/Components/Button";
|
|
|
83
86
|
| `icon` | `LucideIcon` | — | Icon for mini density (replaces label and start/end icons). |
|
|
84
87
|
| `loading` | `boolean` | `false` | Whether the button is loading. |
|
|
85
88
|
| `rounded` | `ButtonRounded` | "md" | The roundedness of the button. |
|
|
89
|
+
| `selected` | `boolean` | `false` | Whether the button is in a selected / pressed state. |
|
|
86
90
|
| `size` | `ButtonSize` | "md" | The size of the button. |
|
|
87
91
|
| `startIcon` | `LucideIcon` | — | Icon at the **inline start** (physical left in `ltr`, physical right in `rtl`). |
|
|
88
92
|
| `text` | `string` | — | Label text when the default slot is not used. |
|
|
@@ -90,4 +94,4 @@ import { Button } from "@bridge-ui/vue/Components/Button";
|
|
|
90
94
|
|
|
91
95
|
## Related components
|
|
92
96
|
|
|
93
|
-
Link, Icon
|
|
97
|
+
Link, Icon, ButtonGroup
|
|
@@ -0,0 +1,124 @@
|
|
|
1
|
+
# ButtonGroup
|
|
2
|
+
|
|
3
|
+
Groups related action buttons in a joined strip with a full-height divider between children. The divider fill matches the button text color. Set `size`, `variant`, `color`, `density`, or `rounded` on the group to apply them to nested `Button` children. A `Button` can still override any of those props. Set `selected` on a `Button` to show a pressed state. Use `ToggleGroup` when the controls select a value.
|
|
4
|
+
|
|
5
|
+
## Import
|
|
6
|
+
|
|
7
|
+
```ts
|
|
8
|
+
import { ButtonGroup } from "@bridge-ui/vue/Components/ButtonGroup";
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## Examples
|
|
12
|
+
|
|
13
|
+
### Usage
|
|
14
|
+
|
|
15
|
+
```vue
|
|
16
|
+
<ButtonGroup variant="outline" aria-label="Export">
|
|
17
|
+
<Button>Copy</Button>
|
|
18
|
+
<Button>Paste</Button>
|
|
19
|
+
</ButtonGroup>
|
|
20
|
+
```
|
|
21
|
+
|
|
22
|
+
### Orientation
|
|
23
|
+
|
|
24
|
+
```vue
|
|
25
|
+
<ButtonGroup variant="outline" aria-label="Zoom" orientation="vertical">
|
|
26
|
+
<Button>+</Button>
|
|
27
|
+
<Button>-</Button>
|
|
28
|
+
</ButtonGroup>
|
|
29
|
+
```
|
|
30
|
+
|
|
31
|
+
### Size
|
|
32
|
+
|
|
33
|
+
```vue
|
|
34
|
+
<ButtonGroup size="sm" variant="outline" aria-label="Small">
|
|
35
|
+
<Button>One</Button>
|
|
36
|
+
<Button>Two</Button>
|
|
37
|
+
</ButtonGroup>
|
|
38
|
+
```
|
|
39
|
+
|
|
40
|
+
### Selected
|
|
41
|
+
|
|
42
|
+
Set `selected` on a `Button` for a pressed action. Use `ToggleGroup` when the controls select a value.
|
|
43
|
+
|
|
44
|
+
```vue
|
|
45
|
+
<ButtonGroup variant="outline" aria-label="Format">
|
|
46
|
+
<Button selected>Bold</Button>
|
|
47
|
+
<Button>Italic</Button>
|
|
48
|
+
<Button>Underline</Button>
|
|
49
|
+
</ButtonGroup>
|
|
50
|
+
```
|
|
51
|
+
|
|
52
|
+
### Color
|
|
53
|
+
|
|
54
|
+
```vue
|
|
55
|
+
<ButtonGroup color="primary" variant="outline" aria-label="Export">
|
|
56
|
+
<Button>Copy</Button>
|
|
57
|
+
<Button>Paste</Button>
|
|
58
|
+
</ButtonGroup>
|
|
59
|
+
```
|
|
60
|
+
|
|
61
|
+
### Nested
|
|
62
|
+
|
|
63
|
+
Nest groups to space clusters of actions. Joined edges and dividers stay inside each inner group. Appearance props cascade through nested groups. Keep inner groups as the only direct children of the outer group — mixing loose `Button` children with nested groups removes the hairline divider between all children.
|
|
64
|
+
|
|
65
|
+
```vue
|
|
66
|
+
<ButtonGroup variant="outline" aria-label="Editor">
|
|
67
|
+
<ButtonGroup>
|
|
68
|
+
<Button>Bold</Button>
|
|
69
|
+
<Button>Italic</Button>
|
|
70
|
+
</ButtonGroup>
|
|
71
|
+
<ButtonGroup>
|
|
72
|
+
<Button>Undo</Button>
|
|
73
|
+
<Button>Redo</Button>
|
|
74
|
+
</ButtonGroup>
|
|
75
|
+
</ButtonGroup>
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
### Split
|
|
79
|
+
|
|
80
|
+
```vue
|
|
81
|
+
<ButtonGroup aria-label="Save">
|
|
82
|
+
<Button>Save</Button>
|
|
83
|
+
<Button density="mini" :icon="ChevronDown" aria-label="More save options" />
|
|
84
|
+
</ButtonGroup>
|
|
85
|
+
```
|
|
86
|
+
|
|
87
|
+
### Full width
|
|
88
|
+
|
|
89
|
+
```vue
|
|
90
|
+
<ButtonGroup full variant="outline" aria-label="Export">
|
|
91
|
+
<Button>Copy</Button>
|
|
92
|
+
<Button>Paste</Button>
|
|
93
|
+
</ButtonGroup>
|
|
94
|
+
```
|
|
95
|
+
|
|
96
|
+
### No separator
|
|
97
|
+
|
|
98
|
+
```vue
|
|
99
|
+
<ButtonGroup variant="outline" aria-label="Export" :separator="false">
|
|
100
|
+
<Button>Copy</Button>
|
|
101
|
+
<Button>Paste</Button>
|
|
102
|
+
</ButtonGroup>
|
|
103
|
+
```
|
|
104
|
+
|
|
105
|
+
## Props
|
|
106
|
+
|
|
107
|
+
| Prop | Type | Default | Description |
|
|
108
|
+
| ------------- | ------------------------ | -------------- | --------------------------------------------------------------------------------------------- |
|
|
109
|
+
| `classes` | `ButtonGroupClasses` | — | Classes for button group parts. |
|
|
110
|
+
| `color` | `ButtonColor` | `"primary"` | Color applied to nested buttons when set. The divider follows the button text color. |
|
|
111
|
+
| `customProps` | `ButtonGroupCustomProps` | — | Extra props for internal parts. |
|
|
112
|
+
| `density` | `ButtonDensity` | — | Density applied to nested buttons unless they set `density`. |
|
|
113
|
+
| `full` | `boolean` | `false` | Stretch the group to the container width. |
|
|
114
|
+
| `orientation` | `ButtonGroupOrientation` | `"horizontal"` | Layout orientation of the group. |
|
|
115
|
+
| `rounded` | `ButtonRounded` | — | Roundness applied to nested buttons unless they set `rounded`. |
|
|
116
|
+
| `separator` | `boolean` | `true` | Draw a full-height divider between adjacent children. The fill matches the button text color. |
|
|
117
|
+
| `size` | `ButtonSize` | — | Size applied to nested buttons unless they set `size`. |
|
|
118
|
+
| `variant` | `ButtonVariant` | — | Variant applied to nested buttons unless they set `variant`. |
|
|
119
|
+
|
|
120
|
+
Pass `aria-label` or `aria-labelledby` on the group.
|
|
121
|
+
|
|
122
|
+
## Related components
|
|
123
|
+
|
|
124
|
+
Button, ToggleGroup
|
|
@@ -26,7 +26,7 @@ import { DataTable } from "@bridge-ui/vue/Components/DataTable";
|
|
|
26
26
|
|
|
27
27
|
### Variants
|
|
28
28
|
|
|
29
|
-
DataTable chrome (`plain` / `ghost` / `bordered`).
|
|
29
|
+
DataTable chrome (`plain` / `ghost` / `bordered`). The built-in footer pager is first / previous / next / last and does not follow table variant:
|
|
30
30
|
|
|
31
31
|
```vue
|
|
32
32
|
<DataTable :rows="users" variant="plain" :columns="columns" />
|
|
@@ -34,12 +34,6 @@ DataTable chrome (`plain` / `ghost` / `bordered`). Built-in `Pagination` follows
|
|
|
34
34
|
<DataTable :rows="users" variant="bordered" :columns="columns" />
|
|
35
35
|
```
|
|
36
36
|
|
|
37
|
-
| DataTable `variant` | Pagination `variant` |
|
|
38
|
-
| ------------------- | -------------------- |
|
|
39
|
-
| `plain` | `text` |
|
|
40
|
-
| `ghost` | `ghost` |
|
|
41
|
-
| `bordered` | `outlined` |
|
|
42
|
-
|
|
43
37
|
`striped` is independent of variant:
|
|
44
38
|
|
|
45
39
|
```vue
|
|
@@ -66,7 +60,7 @@ DataTable chrome (`plain` / `ghost` / `bordered`). Built-in `Pagination` follows
|
|
|
66
60
|
|
|
67
61
|
### Selection + pagination
|
|
68
62
|
|
|
69
|
-
|
|
63
|
+
The chrome footer shows a selection summary when `selection` is bound, a per-page Select when `per-page` is set (`per-page-options`, default 10 / 25 / 50 / 100), and a first / previous / next / last pager when `page` is set with `page-count` or `total-count` (server fetch stays in the app). `page` + `per-page` without those totals slices `rows` locally. `#selected`, `#pagination`, and `#perPage` replace each control:
|
|
70
64
|
|
|
71
65
|
```vue
|
|
72
66
|
<DataTable
|
|
@@ -98,7 +92,7 @@ Client paging slices `rows`. Server paging with a total uses `total-count` inste
|
|
|
98
92
|
/>
|
|
99
93
|
```
|
|
100
94
|
|
|
101
|
-
Slot replaces the built-in
|
|
95
|
+
Slot replaces the built-in footer controls (`#selected` / `#pagination` / `#perPage`; slot props match the built-ins):
|
|
102
96
|
|
|
103
97
|
```vue
|
|
104
98
|
<DataTable :rows="users" :columns="columns" :get-row-id="(row) => row.id">
|
|
@@ -141,7 +135,7 @@ When `page` and `page-count` (or `total-count`) are set, DataTable does not sort
|
|
|
141
135
|
|
|
142
136
|
### Empty, loading, and footer
|
|
143
137
|
|
|
144
|
-
Empty rows render `EmptyState` at the table `size`, with the semantic `inbox` icon and the i18n title `"No data"`. `#empty` replaces it. `loading` keeps the table visible. `loadingVariant="overlay"` (default) dims the table with a spin; `loadingVariant="bar"` dims the table and draws a progress line under the header. `#loading` replaces the indicator. `#footer` renders below the table, above
|
|
138
|
+
Empty rows render `EmptyState` at the table `size`, with the semantic `inbox` icon and the i18n title `"No data"`. `#empty` replaces it. `loading` keeps the table visible. `loadingVariant="overlay"` (default) dims the table with a spin; `loadingVariant="bar"` dims the table and draws a progress line under the header. `#loading` replaces the indicator. `#footer` renders below the table, above the chrome footer:
|
|
145
139
|
|
|
146
140
|
```vue
|
|
147
141
|
<DataTable :rows="[]" :columns="columns" :loading="isLoading">
|
|
@@ -180,7 +174,7 @@ const columns = [
|
|
|
180
174
|
];
|
|
181
175
|
```
|
|
182
176
|
|
|
183
|
-
Table-level slots stay `empty` / `expanded` / `footer` / `item.{id}` / `item` / `loading` / `pagination` / `perPage` / `search` / `toolbar` / `toolbarActions`. `#item` is a catch-all when `#item.{id}` is not set.
|
|
177
|
+
Table-level slots stay `empty` / `expanded` / `footer` / `item.{id}` / `item` / `loading` / `pagination` / `perPage` / `search` / `selected` / `toolbar` / `toolbarActions`. `#item` is a catch-all when `#item.{id}` is not set.
|
|
184
178
|
|
|
185
179
|
### Selection
|
|
186
180
|
|
|
@@ -196,6 +190,10 @@ Table-level slots stay `empty` / `expanded` / `footer` / `item.{id}` / `item` /
|
|
|
196
190
|
/>
|
|
197
191
|
```
|
|
198
192
|
|
|
193
|
+
### Sorting
|
|
194
|
+
|
|
195
|
+
Set `sortable` on a column to show a sort button in that header, matching the filter control. Clicks cycle unsorted → ascending → descending → unsorted. Bind `v-model:sorting`. The header cell keeps `aria-sort`.
|
|
196
|
+
|
|
199
197
|
### Filters
|
|
200
198
|
|
|
201
199
|
Set `filters` on a column to show a funnel in that header. The panel uses checkboxes (`filterMultiple`, default) or radios (`:filter-multiple="false"`), and **Select all items** for multiple filters. Nested `children` render as a group in the same panel. **OK** commits; **Reset** clears the draft (commit on **OK**); closing without **OK** discards it.
|