@bridge-ui/vue 0.1.1 → 0.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.
- package/ai/skills/bridge-ui-components/SKILL.md +4 -1
- package/dist/Components/Autocomplete/composables/useAutocomplete.d.ts +1 -1
- package/dist/Components/CalendarRange/CalendarRange.vue_vue_type_script_setup_true_lang.js +135 -109
- package/dist/Components/CalendarRange/calendarRange.types.d.ts +17 -5
- package/dist/Components/CalendarRange/composables/useCalendarRange.d.ts +4 -2
- package/dist/Components/CalendarRange/composables/useCalendarRange.js +85 -86
- package/dist/Components/ColorField/composables/useColorField.d.ts +2 -1
- package/dist/Components/DataTable/DataTable.js +5 -0
- package/dist/Components/DataTable/DataTable.vue.d.ts +43 -0
- package/dist/Components/DataTable/DataTable.vue_vue_type_script_setup_true_lang.js +382 -0
- package/dist/Components/DataTable/DataTableCellContent.js +5 -0
- package/dist/Components/DataTable/DataTableCellContent.vue.d.ts +23 -0
- package/dist/Components/DataTable/DataTableCellContent.vue_vue_type_script_setup_true_lang.js +38 -0
- package/dist/Components/DataTable/DataTableColumnsMenu.js +5 -0
- package/dist/Components/DataTable/DataTableColumnsMenu.vue.d.ts +11 -0
- package/dist/Components/DataTable/DataTableColumnsMenu.vue_vue_type_script_setup_true_lang.js +47 -0
- package/dist/Components/DataTable/DataTableFilterMenu.js +5 -0
- package/dist/Components/DataTable/DataTableFilterMenu.vue.d.ts +17 -0
- package/dist/Components/DataTable/DataTableFilterMenu.vue_vue_type_script_setup_true_lang.js +132 -0
- package/dist/Components/DataTable/DataTableFilterOptions.js +5 -0
- package/dist/Components/DataTable/DataTableFilterOptions.vue.d.ts +14 -0
- package/dist/Components/DataTable/DataTableFilterOptions.vue_vue_type_script_setup_true_lang.js +73 -0
- package/dist/Components/DataTable/DataTableSearch.js +5 -0
- package/dist/Components/DataTable/DataTableSearch.vue.d.ts +12 -0
- package/dist/Components/DataTable/DataTableSearch.vue_vue_type_script_setup_true_lang.js +39 -0
- package/dist/Components/DataTable/DataTableSelection.js +5 -0
- package/dist/Components/DataTable/DataTableSelection.vue.d.ts +20 -0
- package/dist/Components/DataTable/DataTableSelection.vue_vue_type_script_setup_true_lang.js +55 -0
- package/dist/Components/DataTable/DataTableSortButton.js +5 -0
- package/dist/Components/DataTable/DataTableSortButton.vue.d.ts +17 -0
- package/dist/Components/DataTable/DataTableSortButton.vue_vue_type_script_setup_true_lang.js +43 -0
- package/dist/Components/DataTable/DataTableToolbarButton.js +5 -0
- package/dist/Components/DataTable/DataTableToolbarButton.vue.d.ts +13 -0
- package/dist/Components/DataTable/DataTableToolbarButton.vue_vue_type_script_setup_true_lang.js +31 -0
- package/dist/Components/DataTable/composables/useDataTable.d.ts +557 -0
- package/dist/Components/DataTable/composables/useDataTable.js +479 -0
- package/dist/Components/DataTable/dataTable.types.d.ts +480 -0
- package/dist/Components/DataTable/index.d.ts +3 -0
- package/dist/Components/DataTable/index.js +3 -0
- package/dist/Components/DateField/composables/useDateField.d.ts +2 -1
- package/dist/Components/DateRangeField/composables/useDateRangeField.d.ts +2 -1
- package/dist/Components/DateTimeField/composables/useDateTimeField.d.ts +2 -1
- package/dist/Components/DateTimeRangeField/composables/useDateTimeRangeField.d.ts +2 -1
- package/dist/Components/DateTimeRangePicker/DateTimeRangePicker.vue_vue_type_script_setup_true_lang.js +1 -6
- package/dist/Components/Drawer/composables/useDrawer.js +1 -1
- package/dist/Components/FieldOverlay/FieldOverlay.vue_vue_type_script_setup_true_lang.js +35 -35
- package/dist/Components/FieldOverlay/composables/useFieldOverlay.d.ts +1 -0
- package/dist/Components/FieldOverlay/composables/useFieldOverlay.js +21 -19
- package/dist/Components/FieldOverlay/fieldOverlay.types.d.ts +11 -3
- package/dist/Components/FormField/composables/useFormField.d.ts +1 -1
- package/dist/Components/Listbox/composables/useListbox.js +1 -1
- package/dist/Components/Menu/Menu.vue_vue_type_script_setup_true_lang.js +1 -0
- package/dist/Components/Menu/composables/useMenu.d.ts +1 -1
- package/dist/Components/Menu/composables/useMenu.js +7 -3
- package/dist/Components/Menu/menu.types.d.ts +6 -0
- package/dist/Components/Modal/composables/useModal.js +1 -1
- package/dist/Components/NumberField/composables/useNumberField.d.ts +1 -1
- package/dist/Components/PasswordField/composables/usePasswordField.d.ts +1 -1
- package/dist/Components/Radio/Radio.vue_vue_type_script_setup_true_lang.js +9 -9
- package/dist/Components/Radio/composables/useRadio.js +57 -54
- package/dist/Components/Select/composables/useSelect.d.ts +1 -1
- package/dist/Components/Slider/composables/useSlider.d.ts +2 -2
- package/dist/Components/Snackbar/composables/useSnackbar.d.ts +1 -1
- package/dist/Components/Table/Table.js +5 -0
- package/dist/Components/Table/Table.vue.d.ts +16 -0
- package/dist/Components/Table/Table.vue_vue_type_script_setup_true_lang.js +44 -0
- package/dist/Components/Table/TableBody.js +5 -0
- package/dist/Components/Table/TableBody.vue.d.ts +11 -0
- package/dist/Components/Table/TableBody.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/Table/TableCaption.js +5 -0
- package/dist/Components/Table/TableCaption.vue.d.ts +11 -0
- package/dist/Components/Table/TableCaption.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/Table/TableCell.js +5 -0
- package/dist/Components/Table/TableCell.vue.d.ts +11 -0
- package/dist/Components/Table/TableCell.vue_vue_type_script_setup_true_lang.js +19 -0
- package/dist/Components/Table/TableFooter.js +5 -0
- package/dist/Components/Table/TableFooter.vue.d.ts +11 -0
- package/dist/Components/Table/TableFooter.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/Table/TableHead.js +5 -0
- package/dist/Components/Table/TableHead.vue.d.ts +11 -0
- package/dist/Components/Table/TableHead.vue_vue_type_script_setup_true_lang.js +19 -0
- package/dist/Components/Table/TableHeader.js +5 -0
- package/dist/Components/Table/TableHeader.vue.d.ts +11 -0
- package/dist/Components/Table/TableHeader.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/Table/TableRow.js +5 -0
- package/dist/Components/Table/TableRow.vue.d.ts +11 -0
- package/dist/Components/Table/TableRow.vue_vue_type_script_setup_true_lang.js +17 -0
- package/dist/Components/Table/composables/useTable.d.ts +16 -0
- package/dist/Components/Table/composables/useTable.js +88 -0
- package/dist/Components/Table/composables/useTableCell.d.ts +12 -0
- package/dist/Components/Table/composables/useTableCell.js +40 -0
- package/dist/Components/Table/composables/useTablePart.d.ts +12 -0
- package/dist/Components/Table/composables/useTablePart.js +32 -0
- package/dist/Components/Table/composables/useTableRow.d.ts +6 -0
- package/dist/Components/Table/composables/useTableRow.js +29 -0
- package/dist/Components/Table/index.d.ts +14 -0
- package/dist/Components/Table/index.js +14 -0
- package/dist/Components/Table/table.types.d.ts +416 -0
- package/dist/Components/Table/tableInjectionKey.d.ts +114 -0
- package/dist/Components/Table/tableInjectionKey.js +4 -0
- 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 +2 -1
- package/dist/Components/TimePanel/composables/useTimePanel.d.ts +4 -0
- package/dist/Components/TimePanel/composables/useTimePanel.js +13 -12
- package/dist/Components/TimeRangeField/composables/useTimeRangeField.d.ts +2 -1
- package/dist/Components/TimeRangePicker/TimeRangePicker.vue_vue_type_script_setup_true_lang.js +103 -89
- package/dist/Components/TimeRangePicker/composables/useTimeRangePicker.d.ts +4 -2
- package/dist/Components/TimeRangePicker/composables/useTimeRangePicker.js +55 -54
- package/dist/Components/TimeRangePicker/timeRangePicker.types.d.ts +1 -7
- package/dist/index.js +32 -32
- package/dist/theme.css +2 -0
- package/docs/README.md +6 -0
- package/docs/ScrollUtilities.md +89 -0
- package/docs/components/Autocomplete.md +2 -0
- package/docs/components/CalendarDate.md +1 -1
- package/docs/components/CalendarRange.md +4 -3
- package/docs/components/DataTable.md +345 -0
- package/docs/components/DateField.md +2 -2
- package/docs/components/DatePicker.md +3 -3
- package/docs/components/DateRangePicker.md +4 -3
- package/docs/components/Drawer.md +21 -21
- package/docs/components/FieldOverlay.md +19 -8
- package/docs/components/Modal.md +19 -19
- package/docs/components/Pagination.md +2 -2
- package/docs/components/Select.md +2 -0
- package/docs/components/Table.md +122 -0
- package/docs/components/TimePanel.md +2 -0
- package/docs/components/TimeRangePicker.md +0 -1
- package/docs/examples/i18n-dictionary.ts +4 -0
- package/docs/examples/icon-fontawesome.ts +8 -0
- package/docs/examples/icon-heroicons.ts +8 -0
- package/docs/examples/icon-lucide.ts +8 -0
- package/docs/examples/icon-phosphor.ts +8 -0
- package/docs/examples/icon-tabler.ts +8 -0
- package/package.json +9 -2
|
@@ -0,0 +1,480 @@
|
|
|
1
|
+
import { HTMLAttributes, Slot, VNodeChild } from 'vue';
|
|
2
|
+
import { DataTableColumnBase, DataTableColumnSearch, DataTableFilterOption, DataTableFilters, DataTableItemSlotProps, DataTableLoadingVariant, DataTablePaginationSlotProps, DataTablePerPageSlotProps, DataTableSelectionMode, DataTableSorting, DataTableStickyEdge, DataTableStickyHeader } from '@bridge-ui/core/Domain';
|
|
3
|
+
import { TableAlign, TableRounded, TableSize, TableVariant } from '@bridge-ui/core/Tokens';
|
|
4
|
+
import { MergeHtmlProps, MergeProps } from '@bridge-ui/core/Utils';
|
|
5
|
+
import { CheckboxProps } from '../Checkbox/checkbox.types';
|
|
6
|
+
import { PaginationOwnProps } from '../Pagination/pagination.types';
|
|
7
|
+
import { ProgressOwnProps } from '../Progress/progress.types';
|
|
8
|
+
import { RadioProps } from '../Radio/radio.types';
|
|
9
|
+
import { SelectOwnProps } from '../Select/select.types';
|
|
10
|
+
import { TableAlignOverrides, TableRoundedOverrides, TableSizeOverrides, TableVariantOverrides } from '../Table/table.types';
|
|
11
|
+
import { TextFieldOwnProps } from '../TextField/textField.types';
|
|
12
|
+
export type { DataTableColumnBase, DataTableColumnSearch, DataTableFilterOption, DataTableFilters, DataTableItemSlotProps, DataTableLoadingVariant, DataTablePaginationSlotProps, DataTablePerPageSlotProps, DataTableSelectionMode, DataTableSorting, DataTableStickyEdge, DataTableStickyHeader, };
|
|
13
|
+
/**
|
|
14
|
+
* Column definition with Vue renderers.
|
|
15
|
+
*/
|
|
16
|
+
export type DataTableColumn<T> = Omit<DataTableColumnBase<T>, "align"> & {
|
|
17
|
+
/**
|
|
18
|
+
* Text alignment for the header and cells.
|
|
19
|
+
*
|
|
20
|
+
* @default "start"
|
|
21
|
+
*/
|
|
22
|
+
align?: MergeProps<TableAlign, TableAlignOverrides>;
|
|
23
|
+
/**
|
|
24
|
+
* Cell renderer for a data row. Used when no `#item.{id}` slot is set.
|
|
25
|
+
* Defaults to the column accessor (or `row[id]`).
|
|
26
|
+
*
|
|
27
|
+
* @default undefined
|
|
28
|
+
*/
|
|
29
|
+
cell?: (row: T) => VNodeChild;
|
|
30
|
+
/**
|
|
31
|
+
* Header content.
|
|
32
|
+
*/
|
|
33
|
+
header: VNodeChild;
|
|
34
|
+
/**
|
|
35
|
+
* Footer cell for a summary row. Receives the current (filtered) rows.
|
|
36
|
+
*/
|
|
37
|
+
summary?: (rows: T[]) => VNodeChild;
|
|
38
|
+
};
|
|
39
|
+
export interface DataTableClasses {
|
|
40
|
+
/**
|
|
41
|
+
* Classes merged onto the body rowgroup.
|
|
42
|
+
*/
|
|
43
|
+
body?: string;
|
|
44
|
+
/**
|
|
45
|
+
* Classes merged onto body cells.
|
|
46
|
+
*/
|
|
47
|
+
cell?: string;
|
|
48
|
+
/**
|
|
49
|
+
* Classes merged onto the empty-state region.
|
|
50
|
+
*/
|
|
51
|
+
empty?: string;
|
|
52
|
+
/**
|
|
53
|
+
* Classes merged onto the footer region below the table.
|
|
54
|
+
*/
|
|
55
|
+
footer?: string;
|
|
56
|
+
/**
|
|
57
|
+
* Classes merged onto header cells.
|
|
58
|
+
*/
|
|
59
|
+
head?: string;
|
|
60
|
+
/**
|
|
61
|
+
* Classes merged onto the header rowgroup.
|
|
62
|
+
*/
|
|
63
|
+
header?: string;
|
|
64
|
+
/**
|
|
65
|
+
* Classes merged onto the loading region.
|
|
66
|
+
*/
|
|
67
|
+
loading?: string;
|
|
68
|
+
/**
|
|
69
|
+
* Classes merged onto the pagination region.
|
|
70
|
+
*/
|
|
71
|
+
pagination?: string;
|
|
72
|
+
/**
|
|
73
|
+
* Classes merged onto the per-page Select.
|
|
74
|
+
*/
|
|
75
|
+
perPage?: string;
|
|
76
|
+
/**
|
|
77
|
+
* Classes merged onto the DataTable root.
|
|
78
|
+
*/
|
|
79
|
+
root?: string;
|
|
80
|
+
/**
|
|
81
|
+
* Classes merged onto rows.
|
|
82
|
+
*/
|
|
83
|
+
row?: string;
|
|
84
|
+
/**
|
|
85
|
+
* Classes merged onto the toolbar search field.
|
|
86
|
+
*/
|
|
87
|
+
search?: string;
|
|
88
|
+
/**
|
|
89
|
+
* Classes merged onto the `<table>` element.
|
|
90
|
+
*/
|
|
91
|
+
table?: string;
|
|
92
|
+
/**
|
|
93
|
+
* Classes merged onto the toolbar region.
|
|
94
|
+
*/
|
|
95
|
+
toolbar?: string;
|
|
96
|
+
/**
|
|
97
|
+
* Classes merged onto the table wrapper (`Table` root).
|
|
98
|
+
*/
|
|
99
|
+
wrapper?: string;
|
|
100
|
+
}
|
|
101
|
+
export interface DataTableCustomProps {
|
|
102
|
+
/**
|
|
103
|
+
* Props forwarded to the body rowgroup.
|
|
104
|
+
*
|
|
105
|
+
* @default undefined
|
|
106
|
+
*/
|
|
107
|
+
body?: HTMLAttributes;
|
|
108
|
+
/**
|
|
109
|
+
* Props forwarded to body cells.
|
|
110
|
+
*
|
|
111
|
+
* @default undefined
|
|
112
|
+
*/
|
|
113
|
+
cell?: HTMLAttributes;
|
|
114
|
+
/**
|
|
115
|
+
* Extra props for selection checkboxes.
|
|
116
|
+
*
|
|
117
|
+
* @default undefined
|
|
118
|
+
*/
|
|
119
|
+
checkbox?: Partial<Omit<CheckboxProps, "modelValue" | "indeterminate">>;
|
|
120
|
+
/**
|
|
121
|
+
* Props forwarded to the empty-state region.
|
|
122
|
+
*
|
|
123
|
+
* @default undefined
|
|
124
|
+
*/
|
|
125
|
+
empty?: HTMLAttributes;
|
|
126
|
+
/**
|
|
127
|
+
* Props forwarded to the footer region below the table.
|
|
128
|
+
*
|
|
129
|
+
* @default undefined
|
|
130
|
+
*/
|
|
131
|
+
footer?: HTMLAttributes;
|
|
132
|
+
/**
|
|
133
|
+
* Props forwarded to header cells.
|
|
134
|
+
*
|
|
135
|
+
* @default undefined
|
|
136
|
+
*/
|
|
137
|
+
head?: HTMLAttributes;
|
|
138
|
+
/**
|
|
139
|
+
* Props forwarded to the header rowgroup.
|
|
140
|
+
*
|
|
141
|
+
* @default undefined
|
|
142
|
+
*/
|
|
143
|
+
header?: HTMLAttributes;
|
|
144
|
+
/**
|
|
145
|
+
* Props forwarded to the loading region.
|
|
146
|
+
*
|
|
147
|
+
* @default undefined
|
|
148
|
+
*/
|
|
149
|
+
loading?: HTMLAttributes;
|
|
150
|
+
/**
|
|
151
|
+
* Extra props for the built-in `Pagination`.
|
|
152
|
+
*
|
|
153
|
+
* @default undefined
|
|
154
|
+
*/
|
|
155
|
+
pagination?: Partial<Omit<PaginationOwnProps, "count">>;
|
|
156
|
+
/**
|
|
157
|
+
* Extra props for the built-in per-page `Select`.
|
|
158
|
+
*
|
|
159
|
+
* @default undefined
|
|
160
|
+
*/
|
|
161
|
+
perPage?: Partial<Omit<SelectOwnProps, "options">>;
|
|
162
|
+
/**
|
|
163
|
+
* Extra props for the built-in `Progress` (`loadingVariant="bar"`).
|
|
164
|
+
*
|
|
165
|
+
* @default undefined
|
|
166
|
+
*/
|
|
167
|
+
progress?: Partial<ProgressOwnProps>;
|
|
168
|
+
/**
|
|
169
|
+
* Extra props for selection radios (`selectionMode="single"`).
|
|
170
|
+
*
|
|
171
|
+
* @default undefined
|
|
172
|
+
*/
|
|
173
|
+
radio?: Partial<Omit<RadioProps, "modelValue">>;
|
|
174
|
+
/**
|
|
175
|
+
* Props forwarded to the DataTable root.
|
|
176
|
+
*
|
|
177
|
+
* @default undefined
|
|
178
|
+
*/
|
|
179
|
+
root?: HTMLAttributes;
|
|
180
|
+
/**
|
|
181
|
+
* Props forwarded to rows.
|
|
182
|
+
*
|
|
183
|
+
* @default undefined
|
|
184
|
+
*/
|
|
185
|
+
row?: HTMLAttributes;
|
|
186
|
+
/**
|
|
187
|
+
* Extra props for the toolbar search field.
|
|
188
|
+
*
|
|
189
|
+
* @default undefined
|
|
190
|
+
*/
|
|
191
|
+
search?: Partial<Omit<TextFieldOwnProps, "modelValue">>;
|
|
192
|
+
/**
|
|
193
|
+
* Props forwarded to the `<table>` element.
|
|
194
|
+
*
|
|
195
|
+
* @default undefined
|
|
196
|
+
*/
|
|
197
|
+
table?: HTMLAttributes;
|
|
198
|
+
/**
|
|
199
|
+
* Props forwarded to the toolbar region.
|
|
200
|
+
*
|
|
201
|
+
* @default undefined
|
|
202
|
+
*/
|
|
203
|
+
toolbar?: HTMLAttributes;
|
|
204
|
+
/**
|
|
205
|
+
* Props forwarded to the table wrapper (`Table` root).
|
|
206
|
+
*
|
|
207
|
+
* @default undefined
|
|
208
|
+
*/
|
|
209
|
+
wrapper?: HTMLAttributes;
|
|
210
|
+
}
|
|
211
|
+
export interface DataTableEmits {
|
|
212
|
+
/**
|
|
213
|
+
* Emitted when per-column text search should update (`v-model:column-search`).
|
|
214
|
+
*/
|
|
215
|
+
"update:columnSearch": [search: DataTableColumnSearch];
|
|
216
|
+
/**
|
|
217
|
+
* Emitted when expanded row ids should update (`v-model:expanded`).
|
|
218
|
+
*/
|
|
219
|
+
"update:expanded": [ids: string[]];
|
|
220
|
+
/**
|
|
221
|
+
* Emitted when column filters should update (`v-model:filters`).
|
|
222
|
+
*/
|
|
223
|
+
"update:filters": [filters: DataTableFilters];
|
|
224
|
+
/**
|
|
225
|
+
* Emitted when hidden column ids should update (`v-model:hidden-columns`).
|
|
226
|
+
*/
|
|
227
|
+
"update:hiddenColumns": [ids: string[]];
|
|
228
|
+
/**
|
|
229
|
+
* Emitted when the numbered page should update (`v-model:page`).
|
|
230
|
+
*/
|
|
231
|
+
"update:page": [page: number];
|
|
232
|
+
/**
|
|
233
|
+
* Emitted when the page size should update (`v-model:per-page`).
|
|
234
|
+
* DataTable also resets to page 1.
|
|
235
|
+
*/
|
|
236
|
+
"update:perPage": [perPage: number];
|
|
237
|
+
/**
|
|
238
|
+
* Emitted when the toolbar search query should update (`v-model:search`).
|
|
239
|
+
*/
|
|
240
|
+
"update:search": [query: string];
|
|
241
|
+
/**
|
|
242
|
+
* Emitted when selected row ids should update (`v-model:selection`).
|
|
243
|
+
*/
|
|
244
|
+
"update:selection": [ids: string[]];
|
|
245
|
+
/**
|
|
246
|
+
* Emitted when sort should update (`v-model:sorting`).
|
|
247
|
+
*/
|
|
248
|
+
"update:sorting": [sorting: DataTableSorting];
|
|
249
|
+
}
|
|
250
|
+
/**
|
|
251
|
+
* Opinionated data table. Compose with `columns` / `rows`.
|
|
252
|
+
*/
|
|
253
|
+
export interface DataTableOwnProps<T> {
|
|
254
|
+
/**
|
|
255
|
+
* Classes for DataTable regions.
|
|
256
|
+
*
|
|
257
|
+
* @default undefined
|
|
258
|
+
*/
|
|
259
|
+
classes?: DataTableClasses;
|
|
260
|
+
/**
|
|
261
|
+
* Column definitions (Bridge shape).
|
|
262
|
+
*
|
|
263
|
+
* @default []
|
|
264
|
+
*/
|
|
265
|
+
columns?: DataTableColumn<T>[];
|
|
266
|
+
/**
|
|
267
|
+
* Controlled per-column text search: column id → query. Set `searchable`
|
|
268
|
+
* on a column to show the field in that header's filter menu.
|
|
269
|
+
*
|
|
270
|
+
* @default undefined
|
|
271
|
+
*/
|
|
272
|
+
columnSearch?: DataTableColumnSearch;
|
|
273
|
+
/**
|
|
274
|
+
* Extra props for internal parts (`table`, `wrapper`, checkboxes, …).
|
|
275
|
+
*
|
|
276
|
+
* @default undefined
|
|
277
|
+
*/
|
|
278
|
+
customProps?: DataTableCustomProps;
|
|
279
|
+
/**
|
|
280
|
+
* Controlled expanded row ids.
|
|
281
|
+
*
|
|
282
|
+
* @default undefined
|
|
283
|
+
*/
|
|
284
|
+
expanded?: string[];
|
|
285
|
+
/**
|
|
286
|
+
* Controlled column filters: column id → selected option values.
|
|
287
|
+
*
|
|
288
|
+
* @default undefined
|
|
289
|
+
*/
|
|
290
|
+
filters?: DataTableFilters;
|
|
291
|
+
/**
|
|
292
|
+
* Stretch the table to at least the wrapper width.
|
|
293
|
+
*
|
|
294
|
+
* @default true
|
|
295
|
+
*/
|
|
296
|
+
full?: boolean;
|
|
297
|
+
/**
|
|
298
|
+
* Stable row id. Required for reliable selection.
|
|
299
|
+
*
|
|
300
|
+
* @default undefined
|
|
301
|
+
*/
|
|
302
|
+
getRowId?: (row: T) => string;
|
|
303
|
+
/**
|
|
304
|
+
* Controlled hidden column ids.
|
|
305
|
+
*
|
|
306
|
+
* @default undefined
|
|
307
|
+
*/
|
|
308
|
+
hiddenColumns?: string[];
|
|
309
|
+
/**
|
|
310
|
+
* Row hover styles on the body.
|
|
311
|
+
*
|
|
312
|
+
* @default false
|
|
313
|
+
*/
|
|
314
|
+
hoverable?: boolean;
|
|
315
|
+
/**
|
|
316
|
+
* Show the loading region (`aria-busy` on the table).
|
|
317
|
+
*
|
|
318
|
+
* @default false
|
|
319
|
+
*/
|
|
320
|
+
loading?: boolean;
|
|
321
|
+
/**
|
|
322
|
+
* How `loading` is shown. `overlay` dims the table; `bar` dims the table
|
|
323
|
+
* and draws a progress line under the header.
|
|
324
|
+
*
|
|
325
|
+
* @default "overlay"
|
|
326
|
+
*/
|
|
327
|
+
loadingVariant?: DataTableLoadingVariant;
|
|
328
|
+
/**
|
|
329
|
+
* Controlled page for built-in numbered Pagination (1-based).
|
|
330
|
+
*
|
|
331
|
+
* @default undefined
|
|
332
|
+
*/
|
|
333
|
+
page?: number;
|
|
334
|
+
/**
|
|
335
|
+
* Total pages for built-in numbered Pagination. Use this or `totalCount`.
|
|
336
|
+
*
|
|
337
|
+
* @default undefined
|
|
338
|
+
*/
|
|
339
|
+
pageCount?: number;
|
|
340
|
+
/**
|
|
341
|
+
* Alignment of the built-in Pagination region.
|
|
342
|
+
*
|
|
343
|
+
* @default "end"
|
|
344
|
+
*/
|
|
345
|
+
paginationAlign?: MergeProps<TableAlign, TableAlignOverrides>;
|
|
346
|
+
/**
|
|
347
|
+
* Page size. With `page` and no `pageCount`/`totalCount`, slices `rows`
|
|
348
|
+
* locally. With server paging, only drives the per-page Select.
|
|
349
|
+
*
|
|
350
|
+
* @default undefined
|
|
351
|
+
*/
|
|
352
|
+
perPage?: number;
|
|
353
|
+
/**
|
|
354
|
+
* Options for the built-in per-page Select.
|
|
355
|
+
*
|
|
356
|
+
* @default [10, 25, 50, 100]
|
|
357
|
+
*/
|
|
358
|
+
perPageOptions?: number[];
|
|
359
|
+
/**
|
|
360
|
+
* Corner radius of the table wrapper, header, and footer.
|
|
361
|
+
*
|
|
362
|
+
* @default "lg"
|
|
363
|
+
*/
|
|
364
|
+
rounded?: MergeProps<TableRounded, TableRoundedOverrides>;
|
|
365
|
+
/**
|
|
366
|
+
* Current page of data (or the full set when not paging on the server).
|
|
367
|
+
*
|
|
368
|
+
* @default []
|
|
369
|
+
*/
|
|
370
|
+
rows?: T[];
|
|
371
|
+
/**
|
|
372
|
+
* Controlled toolbar search query. Filters visible columns client-side,
|
|
373
|
+
* or emits `update:search` only when server-paged.
|
|
374
|
+
*
|
|
375
|
+
* @default undefined
|
|
376
|
+
*/
|
|
377
|
+
search?: string;
|
|
378
|
+
/**
|
|
379
|
+
* Controlled selected row ids.
|
|
380
|
+
*
|
|
381
|
+
* @default undefined
|
|
382
|
+
*/
|
|
383
|
+
selection?: string[];
|
|
384
|
+
/**
|
|
385
|
+
* Row selection chrome: radios (`single`) or checkboxes (`multiple`).
|
|
386
|
+
*
|
|
387
|
+
* @default "multiple"
|
|
388
|
+
*/
|
|
389
|
+
selectionMode?: DataTableSelectionMode;
|
|
390
|
+
/**
|
|
391
|
+
* Cell padding / type scale.
|
|
392
|
+
*
|
|
393
|
+
* @default "md"
|
|
394
|
+
*/
|
|
395
|
+
size?: MergeProps<TableSize, TableSizeOverrides>;
|
|
396
|
+
/**
|
|
397
|
+
* Controlled sort: one column, or `null` when unsorted.
|
|
398
|
+
*
|
|
399
|
+
* @default undefined
|
|
400
|
+
*/
|
|
401
|
+
sorting?: DataTableSorting;
|
|
402
|
+
/**
|
|
403
|
+
* Stick header cells to the page (`true`) or inside the wrapper (`"boxed"`).
|
|
404
|
+
* For boxed, set a max height on `classes.wrapper` or `classes.root`.
|
|
405
|
+
*
|
|
406
|
+
* @default false
|
|
407
|
+
*/
|
|
408
|
+
stickyHeader?: DataTableStickyHeader;
|
|
409
|
+
/**
|
|
410
|
+
* Alternating body row surfaces.
|
|
411
|
+
*
|
|
412
|
+
* @default false
|
|
413
|
+
*/
|
|
414
|
+
striped?: boolean;
|
|
415
|
+
/**
|
|
416
|
+
* Total item count when the app owns paging. Derives page count with
|
|
417
|
+
* `perPage`. Use this or `pageCount`, not both (`pageCount` wins).
|
|
418
|
+
*
|
|
419
|
+
* @default undefined
|
|
420
|
+
*/
|
|
421
|
+
totalCount?: number;
|
|
422
|
+
/**
|
|
423
|
+
* Chrome treatment. Built-in Pagination follows the matching variant.
|
|
424
|
+
*
|
|
425
|
+
* @default "plain"
|
|
426
|
+
*/
|
|
427
|
+
variant?: MergeProps<TableVariant, TableVariantOverrides>;
|
|
428
|
+
}
|
|
429
|
+
/**
|
|
430
|
+
* Opinionated data table slots. Per-column cells use `#item.{columnId}`
|
|
431
|
+
* (`row`, `value`) and override `columns[].cell`.
|
|
432
|
+
*/
|
|
433
|
+
export interface DataTableSlots<T = unknown> {
|
|
434
|
+
/**
|
|
435
|
+
* Shown when `rows` is empty.
|
|
436
|
+
*/
|
|
437
|
+
empty?: Slot<undefined>;
|
|
438
|
+
/**
|
|
439
|
+
* Rendered in a spanning row when a row is expanded.
|
|
440
|
+
*/
|
|
441
|
+
expanded?: Slot<{
|
|
442
|
+
row: T;
|
|
443
|
+
}>;
|
|
444
|
+
/**
|
|
445
|
+
* Region below the table, above pagination.
|
|
446
|
+
*/
|
|
447
|
+
footer?: Slot<undefined>;
|
|
448
|
+
/**
|
|
449
|
+
* Catch-all cell slot when `#item.{columnId}` is not set.
|
|
450
|
+
*/
|
|
451
|
+
item?: Slot<DataTableItemSlotProps<T>>;
|
|
452
|
+
/**
|
|
453
|
+
* Indicator shown when `loading` is set. Overlay defaults to a spin; bar
|
|
454
|
+
* defaults to `Progress` under the header.
|
|
455
|
+
*/
|
|
456
|
+
loading?: Slot<undefined>;
|
|
457
|
+
/**
|
|
458
|
+
* Replaces the built-in numbered Pagination (no auto variant). Receives
|
|
459
|
+
* `page`, `count`, `variant`, and `onPageChange`.
|
|
460
|
+
*/
|
|
461
|
+
pagination?: Slot<DataTablePaginationSlotProps>;
|
|
462
|
+
/**
|
|
463
|
+
* Replaces the built-in per-page Select. Receives `perPage`, `options`,
|
|
464
|
+
* and `onPerPageChange`.
|
|
465
|
+
*/
|
|
466
|
+
perPage?: Slot<DataTablePerPageSlotProps>;
|
|
467
|
+
/**
|
|
468
|
+
* Replaces the toolbar search field.
|
|
469
|
+
*/
|
|
470
|
+
search?: Slot<undefined>;
|
|
471
|
+
/**
|
|
472
|
+
* Leading toolbar region (left of Columns / Search).
|
|
473
|
+
*/
|
|
474
|
+
toolbar?: Slot<undefined>;
|
|
475
|
+
/**
|
|
476
|
+
* Extra controls beside Columns and Search in the toolbar end cluster.
|
|
477
|
+
*/
|
|
478
|
+
toolbarActions?: Slot<undefined>;
|
|
479
|
+
}
|
|
480
|
+
export type DataTableProps<T = unknown> = MergeHtmlProps<DataTableOwnProps<T>, HTMLAttributes>;
|
|
@@ -0,0 +1,3 @@
|
|
|
1
|
+
export { useDataTable } from './composables/useDataTable';
|
|
2
|
+
export type { DataTableClasses, DataTableColumn, DataTableColumnBase, DataTableColumnSearch, DataTableCustomProps, DataTableEmits, DataTableFilterOption, DataTableFilters, DataTableItemSlotProps, DataTableLoadingVariant, DataTableOwnProps, DataTablePaginationSlotProps, DataTablePerPageSlotProps, DataTableProps, DataTableSelectionMode, DataTableSlots, DataTableSorting, DataTableStickyEdge, DataTableStickyHeader, } from './dataTable.types';
|
|
3
|
+
export { default as DataTable } from './DataTable.vue';
|
|
@@ -179,7 +179,7 @@ export declare function useDateField(props: DateFieldOwnProps, model: Ref<null |
|
|
|
179
179
|
dir?: string | undefined | undefined;
|
|
180
180
|
draggable?: (boolean | "true" | "false") | undefined;
|
|
181
181
|
enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
182
|
-
enterKeyHint?: "
|
|
182
|
+
enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
|
|
183
183
|
hidden?: "" | "until-found" | "hidden" | (boolean | "true" | "false") | undefined;
|
|
184
184
|
inert?: (boolean | "true" | "false") | undefined;
|
|
185
185
|
placeholder?: string | undefined | undefined;
|
|
@@ -720,6 +720,7 @@ export declare function useDateField(props: DateFieldOwnProps, model: Ref<null |
|
|
|
720
720
|
disableAutoFocus?: boolean;
|
|
721
721
|
disableScrollLock?: boolean;
|
|
722
722
|
keepMounted?: boolean;
|
|
723
|
+
matchWidth?: boolean;
|
|
723
724
|
offset?: number;
|
|
724
725
|
onShowChange?: (show: boolean) => void;
|
|
725
726
|
persistent?: boolean;
|
|
@@ -178,7 +178,7 @@ export declare function useDateRangeField(props: DateRangeFieldOwnProps, model:
|
|
|
178
178
|
dir?: string | undefined | undefined;
|
|
179
179
|
draggable?: (boolean | "true" | "false") | undefined;
|
|
180
180
|
enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
181
|
-
enterKeyHint?: "
|
|
181
|
+
enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
|
|
182
182
|
hidden?: "" | "until-found" | "hidden" | (boolean | "true" | "false") | undefined;
|
|
183
183
|
inert?: (boolean | "true" | "false") | undefined;
|
|
184
184
|
placeholder?: string | undefined | undefined;
|
|
@@ -720,6 +720,7 @@ export declare function useDateRangeField(props: DateRangeFieldOwnProps, model:
|
|
|
720
720
|
disableAutoFocus?: boolean;
|
|
721
721
|
disableScrollLock?: boolean;
|
|
722
722
|
keepMounted?: boolean;
|
|
723
|
+
matchWidth?: boolean;
|
|
723
724
|
offset?: number;
|
|
724
725
|
onShowChange?: (show: boolean) => void;
|
|
725
726
|
persistent?: boolean;
|
|
@@ -179,7 +179,7 @@ export declare function useDateTimeField(props: DateTimeFieldOwnProps, model: Re
|
|
|
179
179
|
dir?: string | undefined | undefined;
|
|
180
180
|
draggable?: (boolean | "true" | "false") | undefined;
|
|
181
181
|
enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
182
|
-
enterKeyHint?: "
|
|
182
|
+
enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
|
|
183
183
|
hidden?: "" | "until-found" | "hidden" | (boolean | "true" | "false") | undefined;
|
|
184
184
|
inert?: (boolean | "true" | "false") | undefined;
|
|
185
185
|
placeholder?: string | undefined | undefined;
|
|
@@ -721,6 +721,7 @@ export declare function useDateTimeField(props: DateTimeFieldOwnProps, model: Re
|
|
|
721
721
|
disableAutoFocus?: boolean;
|
|
722
722
|
disableScrollLock?: boolean;
|
|
723
723
|
keepMounted?: boolean;
|
|
724
|
+
matchWidth?: boolean;
|
|
724
725
|
offset?: number;
|
|
725
726
|
onShowChange?: (show: boolean) => void;
|
|
726
727
|
persistent?: boolean;
|
|
@@ -180,7 +180,7 @@ export declare function useDateTimeRangeField(props: DateTimeRangeFieldOwnProps,
|
|
|
180
180
|
dir?: string | undefined | undefined;
|
|
181
181
|
draggable?: (boolean | "true" | "false") | undefined;
|
|
182
182
|
enterkeyhint?: "enter" | "done" | "go" | "next" | "previous" | "search" | "send" | undefined | undefined;
|
|
183
|
-
enterKeyHint?: "
|
|
183
|
+
enterKeyHint?: "search" | "done" | "enter" | "go" | "next" | "previous" | "send" | undefined;
|
|
184
184
|
hidden?: "" | "until-found" | "hidden" | (boolean | "true" | "false") | undefined;
|
|
185
185
|
inert?: (boolean | "true" | "false") | undefined;
|
|
186
186
|
placeholder?: string | undefined | undefined;
|
|
@@ -723,6 +723,7 @@ export declare function useDateTimeRangeField(props: DateTimeRangeFieldOwnProps,
|
|
|
723
723
|
disableAutoFocus?: boolean;
|
|
724
724
|
disableScrollLock?: boolean;
|
|
725
725
|
keepMounted?: boolean;
|
|
726
|
+
matchWidth?: boolean;
|
|
726
727
|
offset?: number;
|
|
727
728
|
onShowChange?: (show: boolean) => void;
|
|
728
729
|
persistent?: boolean;
|
|
@@ -77,12 +77,7 @@ var b = /*@__PURE__*/ u({
|
|
|
77
77
|
"hide-weekdays": v(x).hideWeekdays,
|
|
78
78
|
"disable-years": v(x).disableYears,
|
|
79
79
|
"disable-months": v(x).disableMonths,
|
|
80
|
-
"hide-outside-days": v(x).hideOutsideDays
|
|
81
|
-
"custom-props": {
|
|
82
|
-
end: { class: "pr-2.5" },
|
|
83
|
-
start: { class: "pr-2.5" },
|
|
84
|
-
panels: { class: "gap-0" }
|
|
85
|
-
}
|
|
80
|
+
"hide-outside-days": v(x).hideOutsideDays
|
|
86
81
|
}, {
|
|
87
82
|
day: y((e) => [g(i.$slots, "day", m(d(e)), () => [c(_(e.label), 1)])]),
|
|
88
83
|
startAside: y(() => [s("div", { class: p(v(C)) }, [s("div", {
|
|
@@ -91,7 +91,7 @@ function h(h, g, _ = {}) {
|
|
|
91
91
|
"relative rounded-none": !0,
|
|
92
92
|
[be.value ?? ""]: !0,
|
|
93
93
|
[Se.value ?? ""]: !0,
|
|
94
|
-
"overflow-y-auto": B.value === "paper",
|
|
94
|
+
"overflow-y-auto bridge-scroll-fade-y bridge-hide-scrollbar": B.value === "paper",
|
|
95
95
|
[we.value]: z.value,
|
|
96
96
|
[s(L.value, "panel") ?? ""]: !0
|
|
97
97
|
})
|
|
@@ -3,12 +3,12 @@ import t from "../Drawer/Drawer.js";
|
|
|
3
3
|
import { FIELD_OVERLAY_INJECTION_KEY as n } from "./fieldOverlayInjectionKey.js";
|
|
4
4
|
import r from "../Menu/Menu.js";
|
|
5
5
|
import i from "../Modal/Modal.js";
|
|
6
|
-
import { createBlock as a,
|
|
6
|
+
import { createBlock as a, createElementVNode as o, defineComponent as s, guardReactiveProps as c, mergeModels as l, mergeProps as u, normalizeProps as d, openBlock as f, provide as p, renderSlot as m, unref as h, useModel as g, withCtx as _ } from "vue";
|
|
7
7
|
//#region src/Components/FieldOverlay/FieldOverlay.vue?vue&type=script&setup=true&lang.ts
|
|
8
|
-
var
|
|
8
|
+
var v = /*@__PURE__*/ s({
|
|
9
9
|
inheritAttrs: !1,
|
|
10
10
|
__name: "FieldOverlay",
|
|
11
|
-
props: /*@__PURE__*/
|
|
11
|
+
props: /*@__PURE__*/ l({
|
|
12
12
|
customProps: {},
|
|
13
13
|
overlay: { default: "auto" }
|
|
14
14
|
}, {
|
|
@@ -18,55 +18,55 @@ var h = /*@__PURE__*/ o({
|
|
|
18
18
|
},
|
|
19
19
|
modelModifiers: {}
|
|
20
20
|
}),
|
|
21
|
-
emits: /*@__PURE__*/
|
|
22
|
-
setup(
|
|
23
|
-
let
|
|
24
|
-
|
|
21
|
+
emits: /*@__PURE__*/ l(["close", "show-change"], ["update:modelValue"]),
|
|
22
|
+
setup(s, { emit: l }) {
|
|
23
|
+
let v = l, y = s, b = g(s, "modelValue"), { menuBind: x, modalBind: S, drawerBind: C, resolvedOverlay: w, drawerScrollerBind: T } = e(y);
|
|
24
|
+
p(n, {
|
|
25
25
|
apply: () => {
|
|
26
|
-
|
|
26
|
+
b.value = !1;
|
|
27
27
|
},
|
|
28
28
|
cancel: () => {
|
|
29
|
-
|
|
29
|
+
b.value = !1;
|
|
30
30
|
}
|
|
31
31
|
});
|
|
32
|
-
function
|
|
33
|
-
|
|
32
|
+
function E(e) {
|
|
33
|
+
v("show-change", e);
|
|
34
34
|
}
|
|
35
|
-
function
|
|
36
|
-
|
|
35
|
+
function D() {
|
|
36
|
+
v("close");
|
|
37
37
|
}
|
|
38
|
-
return (e, n) =>
|
|
38
|
+
return (e, n) => h(w) === "menu" ? (f(), a(h(r), u({
|
|
39
39
|
key: 0,
|
|
40
|
-
modelValue:
|
|
41
|
-
"onUpdate:modelValue": n[0] ||= (e) =>
|
|
42
|
-
},
|
|
43
|
-
onClose:
|
|
44
|
-
"onUpdate:modelValue":
|
|
40
|
+
modelValue: b.value,
|
|
41
|
+
"onUpdate:modelValue": n[0] ||= (e) => b.value = e
|
|
42
|
+
}, h(x), {
|
|
43
|
+
onClose: D,
|
|
44
|
+
"onUpdate:modelValue": E
|
|
45
45
|
}), {
|
|
46
|
-
default:
|
|
46
|
+
default: _(() => [m(e.$slots, "default")]),
|
|
47
47
|
_: 3
|
|
48
|
-
}, 16, ["modelValue"])) :
|
|
48
|
+
}, 16, ["modelValue"])) : h(w) === "modal" ? (f(), a(h(i), u({
|
|
49
49
|
key: 1,
|
|
50
|
-
modelValue:
|
|
51
|
-
"onUpdate:modelValue": n[1] ||= (e) =>
|
|
52
|
-
},
|
|
53
|
-
onClose:
|
|
54
|
-
onShowChange:
|
|
50
|
+
modelValue: b.value,
|
|
51
|
+
"onUpdate:modelValue": n[1] ||= (e) => b.value = e
|
|
52
|
+
}, h(S), {
|
|
53
|
+
onClose: D,
|
|
54
|
+
onShowChange: E
|
|
55
55
|
}), {
|
|
56
|
-
default:
|
|
56
|
+
default: _(() => [m(e.$slots, "default")]),
|
|
57
57
|
_: 3
|
|
58
|
-
}, 16, ["modelValue"])) : (
|
|
58
|
+
}, 16, ["modelValue"])) : (f(), a(h(t), u({
|
|
59
59
|
key: 2,
|
|
60
|
-
modelValue:
|
|
61
|
-
"onUpdate:modelValue": n[2] ||= (e) =>
|
|
62
|
-
},
|
|
63
|
-
onClose:
|
|
64
|
-
onShowChange:
|
|
60
|
+
modelValue: b.value,
|
|
61
|
+
"onUpdate:modelValue": n[2] ||= (e) => b.value = e
|
|
62
|
+
}, h(C), {
|
|
63
|
+
onClose: D,
|
|
64
|
+
onShowChange: E
|
|
65
65
|
}), {
|
|
66
|
-
default:
|
|
66
|
+
default: _(() => [o("div", d(c(h(T))), [m(e.$slots, "default")], 16)]),
|
|
67
67
|
_: 3
|
|
68
68
|
}, 16, ["modelValue"]));
|
|
69
69
|
}
|
|
70
70
|
});
|
|
71
71
|
//#endregion
|
|
72
|
-
export {
|
|
72
|
+
export { v as default };
|