@scattered-light/loomiere-base-ui 0.7.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +2 -2
- package/dist/custom/collection/index.d.ts +7 -1
- package/dist/custom/collection/index.js +35 -17
- package/dist/custom/collection/index.js.map +1 -1
- package/dist/design-system/components/Collection/README.md +1 -1
- package/dist/design-system/components/CollectionToolbar/README.md +7 -2
- package/dist/design-system/components/DataList/preview.html +171 -171
- package/dist/design-system/components/DataTable/preview.html +168 -168
- package/dist/design-system/components/bundle.js +5 -5
- package/dist/design-system/components/styles.css +141 -58
- package/dist/styles/components/Accordion.css +1 -1
- package/dist/styles/components/AlertDialog.css +1 -1
- package/dist/styles/components/Autocomplete.css +1 -1
- package/dist/styles/components/Avatar.css +1 -1
- package/dist/styles/components/Button.css +1 -1
- package/dist/styles/components/Checkbox.css +1 -1
- package/dist/styles/components/CheckboxGroup.css +1 -1
- package/dist/styles/components/Collapsible.css +1 -1
- package/dist/styles/components/Combobox.css +1 -1
- package/dist/styles/components/ContextMenu.css +1 -1
- package/dist/styles/components/Dialog.css +1 -1
- package/dist/styles/components/Drawer.css +1 -1
- package/dist/styles/components/Field.css +1 -1
- package/dist/styles/components/Fieldset.css +1 -1
- package/dist/styles/components/Form.css +1 -1
- package/dist/styles/components/Input.css +1 -1
- package/dist/styles/components/Menu.css +1 -1
- package/dist/styles/components/Menubar.css +1 -1
- package/dist/styles/components/Meter.css +1 -1
- package/dist/styles/components/NavigationMenu.css +1 -1
- package/dist/styles/components/NumberField.css +1 -1
- package/dist/styles/components/OTPField.css +1 -1
- package/dist/styles/components/Popover.css +1 -1
- package/dist/styles/components/PreviewCard.css +1 -1
- package/dist/styles/components/Progress.css +1 -1
- package/dist/styles/components/Radio.css +1 -1
- package/dist/styles/components/ScrollArea.css +1 -1
- package/dist/styles/components/Select.css +1 -1
- package/dist/styles/components/Separator.css +1 -1
- package/dist/styles/components/Slider.css +1 -1
- package/dist/styles/components/Switch.css +1 -1
- package/dist/styles/components/Tabs.css +1 -1
- package/dist/styles/components/Toast.css +1 -1
- package/dist/styles/components/Toggle.css +1 -1
- package/dist/styles/components/ToggleGroup.css +1 -1
- package/dist/styles/components/Toolbar.css +1 -1
- package/dist/styles/components/Tooltip.css +1 -1
- package/dist/styles/custom/Badge.css +1 -1
- package/dist/styles/custom/Collection.css +2 -2
- package/dist/styles/custom/CollectionPagination.css +1 -1
- package/dist/styles/custom/CollectionToolbar.css +87 -4
- package/dist/styles/custom/DataList.css +1 -1
- package/dist/styles/custom/DataTable.css +1 -1
- package/dist/styles/custom/DatePicker.css +1 -1
- package/dist/styles/custom/EditableList.css +1 -1
- package/dist/styles/custom/EmptyState.css +1 -1
- package/dist/styles/custom/ListDetail.css +1 -1
- package/dist/styles/custom/MoneyField.css +1 -1
- package/dist/styles/custom/Splitter.css +1 -1
- package/dist/styles/custom/Table.css +1 -1
- package/dist/styles/index.css +1 -1
- package/dist/styles/reset/accessibility.css +1 -1
- package/dist/styles/reset/reset-accessibility.css +1 -1
- package/dist/styles/reset/reset-tailwind.css +1 -1
- package/dist/styles/reset/reset.css +1 -1
- package/dist/styles/tailwind.css +1 -1
- package/package.json +2 -2
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Collection
|
|
2
2
|
|
|
3
|
-
The Base UI Collection styled by the theme. DataTable, DataList, the toolbar and the pagination, in one place so the two views share the table concept. Sections: toolbar, table additions, groups, list, pagination, sizes. Each section is its own file so the design system can name the part. This file brings them in. The selection bar replaces the trailing controls (filters, sort,
|
|
3
|
+
The Base UI Collection styled by the theme. DataTable, DataList, the toolbar and the pagination, in one place so the two views share the table concept. Sections: toolbar, table additions, groups, list, pagination, sizes. Each section is its own file so the design system can name the part. This file brings them in. The selection bar replaces the trailing controls (filters, sort, actions) and leaves the tabs and the search where they are, so selecting rows does not grow the toolbar.
|
|
4
4
|
|
|
5
5
|
Use `Loomiere.Collection` (`import { Collection } from '@base-ui/react/collection'` in an app) and give each part the class below; the styles target those classes, not Base UI's own markup.
|
|
6
6
|
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# CollectionToolbar
|
|
2
2
|
|
|
3
|
-
Loomiere component, not part of Base UI. The wrap follows the toolbar's own width, not the window: a table in a narrow pane wraps even when the page is wide. Search takes the full
|
|
3
|
+
Loomiere component, not part of Base UI. The wrap follows the toolbar's own width, not the window: a table in a narrow pane wraps even when the page is wide. Search grows to fill the row beside the trailing controls, and wraps to its own line before it shrinks under collection.search-min-width. Under the narrow width it takes the full row and filters wrap under it. A container query cannot read the width token, so the component also sets data-narrow. The search icon and the clear button sit inside the field. The browser's own search cancel is hidden by the reset, so the clear button is the only one, in every browser.
|
|
4
4
|
|
|
5
5
|
Use `Loomiere.CollectionToolbar` from `@scattered-light/loomiere-base-ui/custom/collection`. Install `@tanstack/react-table` (peer, optional). It is not on the main entry, so an app that only imports Badge does not need it.
|
|
6
6
|
|
|
@@ -12,11 +12,16 @@ Not a Base UI part, so there is no base-ui.com page for it.
|
|
|
12
12
|
|---|---|
|
|
13
13
|
| `CollectionToolbar` | `data-narrow` |
|
|
14
14
|
| `CollectionToolbarMain` | |
|
|
15
|
-
| `CollectionToolbarTrailing` | |
|
|
16
15
|
| `CollectionSelectionBar` | |
|
|
17
16
|
| `CollectionSort` | |
|
|
18
17
|
| `CollectionSearch` | |
|
|
18
|
+
| `CollectionSearchField` | `data-filled` |
|
|
19
19
|
| `Input` | |
|
|
20
|
+
| `CollectionSearchIcon` | |
|
|
21
|
+
| `CollectionSearchClear` | |
|
|
22
|
+
| `CollectionToolbarTrailing` | |
|
|
23
|
+
| `SelectTrigger` | |
|
|
24
|
+
| `ComboboxInputWrapper` | |
|
|
20
25
|
| `CollectionToolbarActions` | |
|
|
21
26
|
| `CollectionView` | `data-narrow` |
|
|
22
27
|
| `CollectionCount` | |
|