@backstage/ui 0.11.0-next.1 → 0.11.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/CHANGELOG.md +100 -0
- package/css/styles.css +2 -0
- package/dist/components/Accordion/Accordion.module.css.esm.js +2 -2
- package/dist/components/Avatar/Avatar.module.css.esm.js +2 -2
- package/dist/components/Box/Box.module.css.esm.js +2 -2
- package/dist/components/Button/Button.module.css.esm.js +2 -2
- package/dist/components/ButtonIcon/ButtonIcon.module.css.esm.js +2 -2
- package/dist/components/Card/Card.module.css.esm.js +2 -2
- package/dist/components/Checkbox/Checkbox.esm.js +10 -7
- package/dist/components/Checkbox/Checkbox.esm.js.map +1 -1
- package/dist/components/Checkbox/Checkbox.module.css.esm.js +2 -2
- package/dist/components/Checkbox/definition.esm.js +2 -1
- package/dist/components/Checkbox/definition.esm.js.map +1 -1
- package/dist/components/Container/Container.module.css.esm.js +2 -2
- package/dist/components/Dialog/Dialog.module.css.esm.js +2 -2
- package/dist/components/FieldError/FieldError.module.css.esm.js +2 -2
- package/dist/components/FieldLabel/FieldLabel.module.css.esm.js +2 -2
- package/dist/components/Flex/Flex.module.css.esm.js +2 -2
- package/dist/components/Grid/Grid.module.css.esm.js +2 -2
- package/dist/components/Header/Header.module.css.esm.js +2 -2
- package/dist/components/HeaderPage/HeaderPage.module.css.esm.js +2 -2
- package/dist/components/Link/Link.module.css.esm.js +2 -2
- package/dist/components/Menu/Menu.esm.js +3 -26
- package/dist/components/Menu/Menu.esm.js.map +1 -1
- package/dist/components/Menu/Menu.module.css.esm.js +2 -2
- package/dist/components/Popover/Popover.esm.js +45 -0
- package/dist/components/Popover/Popover.esm.js.map +1 -0
- package/dist/components/Popover/Popover.module.css.esm.js +3 -3
- package/dist/components/Popover/definition.esm.js +3 -1
- package/dist/components/Popover/definition.esm.js.map +1 -1
- package/dist/components/RadioGroup/RadioGroup.module.css.esm.js +2 -2
- package/dist/components/SearchField/SearchField.module.css.esm.js +2 -2
- package/dist/components/Select/Select.esm.js +5 -5
- package/dist/components/Select/Select.esm.js.map +1 -1
- package/dist/components/Select/Select.module.css.esm.js +2 -2
- package/dist/components/Select/SelectContent.esm.js +1 -0
- package/dist/components/Select/SelectContent.esm.js.map +1 -1
- package/dist/components/Skeleton/Skeleton.module.css.esm.js +2 -2
- package/dist/components/Switch/Switch.module.css.esm.js +2 -2
- package/dist/components/Table/Table.module.css.esm.js +2 -2
- package/dist/components/Table/components/Column.esm.js +3 -3
- package/dist/components/Table/components/Column.esm.js.map +1 -1
- package/dist/components/Table/components/Row.esm.js +1 -0
- package/dist/components/Table/components/Row.esm.js.map +1 -1
- package/dist/components/Table/components/Table.esm.js +14 -6
- package/dist/components/Table/components/Table.esm.js.map +1 -1
- package/dist/components/Table/hooks/getEffectivePageSize.esm.js +25 -0
- package/dist/components/Table/hooks/getEffectivePageSize.esm.js.map +1 -0
- package/dist/components/Table/hooks/useCompletePagination.esm.js +3 -1
- package/dist/components/Table/hooks/useCompletePagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/useCursorPagination.esm.js +2 -1
- package/dist/components/Table/hooks/useCursorPagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/useOffsetPagination.esm.js +3 -1
- package/dist/components/Table/hooks/useOffsetPagination.esm.js.map +1 -1
- package/dist/components/Table/hooks/useTable.esm.js +26 -5
- package/dist/components/Table/hooks/useTable.esm.js.map +1 -1
- package/dist/components/TablePagination/TablePagination.esm.js +52 -16
- package/dist/components/TablePagination/TablePagination.esm.js.map +1 -1
- package/dist/components/TablePagination/TablePagination.module.css.esm.js +2 -2
- package/dist/components/Tabs/Tabs.module.css.esm.js +2 -2
- package/dist/components/TagGroup/TagGroup.module.css.esm.js +2 -2
- package/dist/components/Text/Text.module.css.esm.js +2 -2
- package/dist/components/TextField/TextField.module.css.esm.js +2 -2
- package/dist/components/ToggleButton/ToggleButton.module.css.esm.js +2 -2
- package/dist/components/ToggleButtonGroup/ToggleButtonGroup.module.css.esm.js +2 -2
- package/dist/components/Tooltip/Tooltip.module.css.esm.js +2 -2
- package/dist/components/VisuallyHidden/VisuallyHidden.module.css.esm.js +2 -2
- package/dist/index.d.ts +93 -14
- package/dist/index.esm.js +2 -0
- package/dist/index.esm.js.map +1 -1
- package/package.json +3 -3
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,105 @@
|
|
|
1
1
|
# @backstage/ui
|
|
2
2
|
|
|
3
|
+
## 0.11.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 243e5e7: **BREAKING**: Redesigned Table component with new `useTable` hook API.
|
|
8
|
+
|
|
9
|
+
- The `Table` component (React Aria wrapper) is renamed to `TableRoot`
|
|
10
|
+
- New high-level `Table` component that handles data display, pagination, sorting, and selection
|
|
11
|
+
- The `useTable` hook is completely redesigned with a new API supporting three pagination modes (complete, offset, cursor)
|
|
12
|
+
- New types: `ColumnConfig`, `TableProps`, `TableItem`, `UseTableOptions`, `UseTableResult`
|
|
13
|
+
|
|
14
|
+
New features include unified pagination modes, debounced query changes, stale data preservation during reloads, and row selection with toggle/replace behaviors.
|
|
15
|
+
|
|
16
|
+
**Migration guide:**
|
|
17
|
+
|
|
18
|
+
1. Update imports and use the new `useTable` hook:
|
|
19
|
+
|
|
20
|
+
```diff
|
|
21
|
+
-import { Table, useTable } from '@backstage/ui';
|
|
22
|
+
-const { data, paginationProps } = useTable({ data: items, pagination: {...} });
|
|
23
|
+
+import { Table, useTable, type ColumnConfig } from '@backstage/ui';
|
|
24
|
+
+const { tableProps } = useTable({
|
|
25
|
+
+ mode: 'complete',
|
|
26
|
+
+ getData: () => items,
|
|
27
|
+
+});
|
|
28
|
+
```
|
|
29
|
+
|
|
30
|
+
2. Define columns and render with the new Table API:
|
|
31
|
+
|
|
32
|
+
```diff
|
|
33
|
+
-<Table aria-label="My table">
|
|
34
|
+
- <TableHeader>...</TableHeader>
|
|
35
|
+
- <TableBody items={data}>...</TableBody>
|
|
36
|
+
-</Table>
|
|
37
|
+
-<TablePagination {...paginationProps} />
|
|
38
|
+
+const columns: ColumnConfig<Item>[] = [
|
|
39
|
+
+ { id: 'name', label: 'Name', isRowHeader: true, cell: item => <CellText title={item.name} /> },
|
|
40
|
+
+ { id: 'type', label: 'Type', cell: item => <CellText title={item.type} /> },
|
|
41
|
+
+];
|
|
42
|
+
+
|
|
43
|
+
+<Table columnConfig={columns} {...tableProps} />
|
|
44
|
+
```
|
|
45
|
+
|
|
46
|
+
Affected components: Table, TableRoot, TablePagination
|
|
47
|
+
|
|
48
|
+
- 95246eb: **Breaking** Updating color tokens to match the new neutral style on different surfaces.
|
|
49
|
+
|
|
50
|
+
## Migration notes
|
|
51
|
+
|
|
52
|
+
There's no direct replacement for the old tint tokens but you can use the new neutral set of color tokens on surface 0 or 1 as a replacement.
|
|
53
|
+
|
|
54
|
+
- `--bui-bg-tint` can be replaced by `--bui-bg-neutral-on-surface-0`
|
|
55
|
+
- `--bui-bg-tint-hover` can be replaced by `--bui-bg-neutral-on-surface-0-hover`
|
|
56
|
+
- `--bui-bg-tint-pressed` can be replaced by `--bui-bg-neutral-on-surface-0-pressed`
|
|
57
|
+
- `--bui-bg-tint-disabled` can be replaced by `--bui-bg-neutral-on-surface-0-disabled`
|
|
58
|
+
|
|
59
|
+
- ea0c6d8: Introduce new `ToggleButton` & `ToggleButtonGroup` components in Backstage UI
|
|
60
|
+
- 4ea1d15: **BREAKING**: Renamed CSS variable `--bui-bg` to `--bui-bg-surface-0` for consistency.
|
|
61
|
+
|
|
62
|
+
### Patch Changes
|
|
63
|
+
|
|
64
|
+
- 1880402: Fixes app background color on dark mode.
|
|
65
|
+
- d2fdded: Added indeterminate state support to the Checkbox component for handling partial selection scenarios like table header checkboxes.
|
|
66
|
+
|
|
67
|
+
Affected components: Checkbox
|
|
68
|
+
|
|
69
|
+
- 4fb15d2: Added missing `aria-label` attributes to `SearchField` components in `Select`, `MenuAutocomplete`, and `MenuAutocompleteListbox` to fix accessibility warnings.
|
|
70
|
+
|
|
71
|
+
Affected components: Select, MenuAutocomplete, MenuAutocompleteListbox
|
|
72
|
+
|
|
73
|
+
- 21c87cc: Fixes disabled state in primary and secondary buttons in Backstage UI.
|
|
74
|
+
- 9c76682: build(deps-dev): bump `storybook` from 10.1.9 to 10.1.10
|
|
75
|
+
- de80336: Fixed disabled tertiary buttons incorrectly showing hover effects on surfaces.
|
|
76
|
+
- 133d5c6: Added new Popover component for Backstage UI with automatic overflow handling, and full placement support. Also introduced `--bui-shadow` token for consistent elevation styling across overlay components (Popover, Tooltip, Menu).
|
|
77
|
+
- 973c839: Fixed Table sorting indicator not being visible when a column is actively sorted.
|
|
78
|
+
|
|
79
|
+
Affected components: Table, Column
|
|
80
|
+
|
|
81
|
+
- df40cfc: Fixed Menu component trigger button not toggling correctly. Removed custom click-outside handler that was interfering with React Aria's built-in state management, allowing the menu to properly open and close when clicking the trigger button.
|
|
82
|
+
- b01ab96: Added support for column width configuration in Table component. Columns now accept `width`, `defaultWidth`, `minWidth`, and `maxWidth` props for responsive layout control.
|
|
83
|
+
|
|
84
|
+
Affected components: Table, Column
|
|
85
|
+
|
|
86
|
+
- b4a4911: Fixed SearchField `startCollapsed` prop not working correctly in Backstage UI. The field now properly starts in a collapsed state, expands when clicked and focused, and collapses back when unfocused with no input. Also fixed CSS logic to work correctly in all layout contexts (flex row, flex column, and regular containers).
|
|
87
|
+
|
|
88
|
+
Affected components: SearchField
|
|
89
|
+
|
|
90
|
+
- b3253b6: Fixed `Link` component causing hard page refreshes for internal routes. The component now properly uses React Router's navigation instead of full page reloads.
|
|
91
|
+
- fe7fe69: Added support for custom pagination options in `useTable` hook and `Table` component. You can now configure `pageSizeOptions` to customize the page size dropdown, and hook into pagination events via `onPageSizeChange`, `onNextPage`, and `onPreviousPage` callbacks. When `pageSize` doesn't match any option, the first option is used and a warning is logged.
|
|
92
|
+
|
|
93
|
+
Affected components: Table, TablePagination
|
|
94
|
+
|
|
95
|
+
- cfac8a4: Fixed missing border styles on table selection cells in multi-select mode.
|
|
96
|
+
|
|
97
|
+
Affected components: Table
|
|
98
|
+
|
|
99
|
+
- 2532d2a: Added `className` and `style` props to the `Table` component.
|
|
100
|
+
|
|
101
|
+
Affected components: Table
|
|
102
|
+
|
|
3
103
|
## 0.11.0-next.1
|
|
4
104
|
|
|
5
105
|
### Minor Changes
|
package/css/styles.css
CHANGED
|
@@ -100,6 +100,7 @@
|
|
|
100
100
|
--bui-ring: #1f5493;
|
|
101
101
|
--bui-scrollbar: #a0a0a03b;
|
|
102
102
|
--bui-scrollbar-thumb: #a0a0a0;
|
|
103
|
+
--bui-shadow: 0 10px 15px -3px #0000001a, 0 4px 6px -4px #0000001a;
|
|
103
104
|
--bui-animate-pulse: pulse 2s cubic-bezier(.4, 0, .6, 1) infinite;
|
|
104
105
|
}
|
|
105
106
|
|
|
@@ -161,6 +162,7 @@
|
|
|
161
162
|
--bui-ring: #1f5493;
|
|
162
163
|
--bui-scrollbar: #3636363a;
|
|
163
164
|
--bui-scrollbar-thumb: #575757;
|
|
165
|
+
--bui-shadow: none;
|
|
164
166
|
}
|
|
165
167
|
}
|
|
166
168
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Accordion":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Accordion_bui-Accordion__65122c2f40 {\n width: 100%;\n background-color: var(--bui-bg-surface-1);\n border-radius: var(--bui-radius-3);\n padding: var(--bui-space-3);\n }\n\n .Accordion_bui-AccordionTrigger__65122c2f40 {\n all: unset;\n width: 100%;\n display: flex;\n align-items: center;\n justify-content: space-between;\n }\n\n .Accordion_bui-AccordionTriggerButton__65122c2f40 {\n all: unset;\n width: 100%;\n color: var(--bui-fg-primary);\n display: flex;\n align-items: center;\n justify-content: space-between;\n cursor: pointer;\n text-align: left;\n\n &:focus-visible {\n outline: none;\n transition: none;\n box-shadow: inset 0 0 0 2px var(--bui-ring);\n }\n\n &[data-disabled='true'] {\n background-color: transparent;\n color: var(--bui-fg-disabled);\n cursor: not-allowed;\n }\n }\n\n .Accordion_bui-AccordionTriggerTitle__65122c2f40 {\n font-size: var(--bui-font-size-4);\n font-weight: var(--bui-font-weight-bold);\n line-height: 140%;\n }\n\n .Accordion_bui-AccordionTriggerSubtitle__65122c2f40 {\n font-size: var(--bui-font-size-2);\n line-height: 140%;\n color: var(--bui-fg-secondary);\n }\n\n .Accordion_bui-AccordionTriggerIcon__65122c2f40 {\n transition: transform 150ms ease-out;\n flex-shrink: 0;\n width: 1rem;\n height: 1rem;\n\n [data-expanded='true'] & {\n transform: rotate(180deg);\n }\n }\n\n .Accordion_bui-AccordionPanel__65122c2f40 {\n [data-expanded='true'] & {\n padding-top: var(--bui-space-1);\n }\n }\n\n .Accordion_bui-AccordionGroup__65122c2f40 {\n display: flex;\n flex-direction: column;\n gap: var(--bui-space-3);\n width: 100%;\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Accordion":"Accordion_bui-Accordion__65122c2f40","bui-AccordionTrigger":"Accordion_bui-AccordionTrigger__65122c2f40","bui-AccordionTriggerButton":"Accordion_bui-AccordionTriggerButton__65122c2f40","bui-AccordionTriggerTitle":"Accordion_bui-AccordionTriggerTitle__65122c2f40","bui-AccordionTriggerSubtitle":"Accordion_bui-AccordionTriggerSubtitle__65122c2f40","bui-AccordionTriggerIcon":"Accordion_bui-AccordionTriggerIcon__65122c2f40","bui-AccordionPanel":"Accordion_bui-AccordionPanel__65122c2f40","bui-AccordionGroup":"Accordion_bui-AccordionGroup__65122c2f40"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-AvatarRoot":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Avatar_bui-AvatarRoot__17171335c3 {\n display: inline-flex;\n justify-content: center;\n align-items: center;\n vertical-align: middle;\n border-radius: 100%;\n user-select: none;\n font-weight: 500;\n color: var(--bui-fg-primary);\n background-color: var(--bui-bg-surface-2);\n font-size: 1rem;\n line-height: 1;\n overflow: hidden;\n height: 2rem;\n width: 2rem;\n }\n\n .Avatar_bui-AvatarRoot__17171335c3[data-size='x-small'] {\n height: 1.25rem;\n width: 1.25rem;\n }\n\n .Avatar_bui-AvatarRoot__17171335c3[data-size='small'] {\n height: 1.5rem;\n width: 1.5rem;\n }\n\n .Avatar_bui-AvatarRoot__17171335c3[data-size='medium'] {\n height: 2rem;\n width: 2rem;\n }\n\n .Avatar_bui-AvatarRoot__17171335c3[data-size='large'] {\n height: 2.5rem;\n width: 2.5rem;\n }\n\n .Avatar_bui-AvatarRoot__17171335c3[data-size='x-large'] {\n height: 3rem;\n width: 3rem;\n }\n\n .Avatar_bui-AvatarImage__17171335c3 {\n object-fit: cover;\n height: 100%;\n width: 100%;\n display: block;\n }\n\n .Avatar_bui-AvatarFallback__17171335c3 {\n align-items: center;\n display: flex;\n justify-content: center;\n height: 100%;\n width: 100%;\n font-size: var(--bui-font-size-3);\n font-weight: var(--bui-font-weight-regular);\n box-shadow: inset 0 0 0 1px var(--bui-border);\n border-radius: var(--bui-radius-full);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-AvatarRoot":"Avatar_bui-AvatarRoot__17171335c3","bui-AvatarImage":"Avatar_bui-AvatarImage__17171335c3","bui-AvatarFallback":"Avatar_bui-AvatarFallback__17171335c3"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Box":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Box_bui-Box__38028633d4 {\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-regular);\n color: var(--bui-fg-primary);\n }\n\n .Box_bui-Box__38028633d4[data-surface='0'] {\n background-color: var(--bui-bg-surface-0);\n }\n\n .Box_bui-Box__38028633d4[data-surface='1'] {\n background-color: var(--bui-bg-surface-1);\n }\n\n .Box_bui-Box__38028633d4[data-surface='2'] {\n background-color: var(--bui-bg-surface-2);\n }\n\n .Box_bui-Box__38028633d4[data-surface='3'] {\n background-color: var(--bui-bg-surface-3);\n }\n\n .Box_bui-Box__38028633d4[data-surface='danger'] {\n background-color: var(--bui-bg-danger);\n }\n\n .Box_bui-Box__38028633d4[data-surface='warning'] {\n background-color: var(--bui-bg-warning);\n }\n\n .Box_bui-Box__38028633d4[data-surface='success'] {\n background-color: var(--bui-bg-success);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Box":"Box_bui-Box__38028633d4"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var stylesButton = {"bui-Button":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Button_bui-Button__47f4267606 {\n --loading-duration: 200ms;\n --bg: transparent;\n --bg-hover: transparent;\n --bg-active: transparent;\n --fg: inherit;\n\n position: relative;\n display: inline-flex;\n border: none;\n user-select: none;\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-bold);\n padding: 0;\n cursor: pointer;\n border-radius: var(--bui-radius-2);\n flex-shrink: 0;\n transition: background-color var(--loading-duration) ease-out,\n box-shadow var(--loading-duration) ease-out;\n\n /* Apply variables */\n color: var(--fg);\n background-color: var(--bg);\n\n &:hover {\n background-color: var(--bg-hover);\n transition: background-color 150ms ease;\n }\n\n &:active {\n background-color: var(--bg-active);\n }\n\n &[data-disabled='true'] {\n cursor: not-allowed;\n }\n\n &[data-loading='true'] {\n cursor: wait;\n }\n }\n\n .Button_bui-Button__47f4267606[data-variant='primary'] {\n --bg: var(--bui-bg-solid);\n --bg-hover: var(--bui-bg-solid-hover);\n --bg-active: var(--bui-bg-solid-pressed);\n --fg: var(--bui-fg-solid);\n\n &[data-disabled='true'],\n &[data-loading='true'] {\n --bg: var(--bui-bg-solid-disabled);\n --bg-hover: var(--bui-bg-solid-disabled);\n --bg-active: var(--bui-bg-solid-disabled);\n --fg: var(--bui-fg-solid-disabled);\n }\n\n &:focus-visible {\n outline: 2px solid var(--bui-ring);\n outline-offset: 2px;\n }\n }\n\n .Button_bui-Button__47f4267606[data-variant='secondary'] {\n --bg: var(--bui-bg-neutral-on-surface-0);\n --bg-hover: var(--bui-bg-neutral-on-surface-0-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-0-pressed);\n --fg: var(--bui-fg-primary);\n\n &[data-on-surface='1'] {\n --bg: var(--bui-bg-neutral-on-surface-1);\n --bg-hover: var(--bui-bg-neutral-on-surface-1-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-1-pressed);\n }\n\n &[data-on-surface='2'] {\n --bg: var(--bui-bg-neutral-on-surface-2);\n --bg-hover: var(--bui-bg-neutral-on-surface-2-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-2-pressed);\n }\n\n &[data-on-surface='3'] {\n --bg: var(--bui-bg-neutral-on-surface-3);\n --bg-hover: var(--bui-bg-neutral-on-surface-3-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-3-pressed);\n }\n\n &[data-disabled='true'],\n &[data-loading='true'] {\n --bg-hover: var(--bg);\n --bg-active: var(--bg);\n --fg: var(--bui-fg-disabled);\n }\n\n &:focus-visible {\n outline: none;\n transition: none;\n box-shadow: inset 0 0 0 2px var(--bui-ring);\n }\n }\n\n .Button_bui-Button__47f4267606[data-variant='tertiary'] {\n --bg-hover: var(--bui-bg-neutral-on-surface-0-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-0-pressed);\n --fg: var(--bui-fg-primary);\n\n &[data-on-surface='1'] {\n --bg-hover: var(--bui-bg-neutral-on-surface-1-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-1-pressed);\n }\n\n &[data-on-surface='2'] {\n --bg-hover: var(--bui-bg-neutral-on-surface-2-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-2-pressed);\n }\n\n &[data-on-surface='3'] {\n --bg-hover: var(--bui-bg-neutral-on-surface-3-hover);\n --bg-active: var(--bui-bg-neutral-on-surface-3-pressed);\n }\n\n &[data-disabled='true'],\n &[data-loading='true'] {\n --bg-hover: var(--bg);\n --bg-active: var(--bg);\n --fg: var(--bui-fg-disabled);\n }\n\n &:focus-visible {\n outline: none;\n transition: none;\n box-shadow: inset 0 0 0 2px var(--bui-ring);\n }\n }\n\n .Button_bui-Button__47f4267606[data-size='small'] {\n font-size: var(--bui-font-size-3);\n padding: 0 var(--bui-space-2);\n height: 2rem;\n\n svg {\n width: 1rem;\n height: 1rem;\n }\n }\n\n .Button_bui-Button__47f4267606[data-size='medium'] {\n font-size: var(--bui-font-size-4);\n padding: 0 var(--bui-space-3);\n height: 2.5rem;\n\n svg {\n width: 1.25rem;\n height: 1.25rem;\n }\n }\n\n .Button_bui-ButtonContent__47f4267606 {\n display: inline-flex;\n align-items: center;\n justify-content: center;\n gap: var(--bui-space-1_5);\n height: 100%;\n width: 100%;\n transition: opacity var(--loading-duration) ease-out;\n\n .Button_bui-Button__47f4267606[data-loading='true'] & {\n opacity: 0;\n }\n }\n\n .Button_bui-ButtonSpinner__47f4267606 {\n position: absolute;\n top: 50%;\n left: 50%;\n transform: translate(-50%, -50%);\n display: flex;\n opacity: 0;\n transition: opacity var(--loading-duration) ease-in;\n\n .Button_bui-Button__47f4267606[data-loading='true'] & {\n opacity: 1;\n }\n\n & svg {\n animation: Button_bui-spin__47f4267606 1s linear infinite;\n }\n }\n\n @media (prefers-reduced-motion: reduce) {\n .Button_bui-Button__47f4267606 {\n transition-duration: 50ms;\n }\n\n .Button_bui-ButtonContent__47f4267606 {\n transition-duration: 50ms;\n }\n\n .Button_bui-ButtonSpinner__47f4267606 {\n transition-duration: 50ms;\n }\n\n .Button_bui-ButtonSpinner__47f4267606 svg {\n animation: none;\n }\n }\n\n @keyframes Button_bui-spin__47f4267606 {\n from {\n transform: rotate(0deg);\n }\n\n to {\n transform: rotate(360deg);\n }\n }\n}\n";
|
|
4
|
+
var stylesButton = {"bui-Button":"Button_bui-Button__47f4267606","bui-ButtonContent":"Button_bui-ButtonContent__47f4267606","bui-ButtonSpinner":"Button_bui-ButtonSpinner__47f4267606","bui-spin":"Button_bui-spin__47f4267606"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { stylesButton as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var stylesButtonIcon = {"bui-ButtonIcon":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .ButtonIcon_bui-ButtonIcon__8091494e93 {\n align-items: center;\n justify-content: center;\n }\n\n .ButtonIcon_bui-ButtonIcon__8091494e93[data-size='small'] {\n padding: 0;\n width: 2rem;\n }\n\n .ButtonIcon_bui-ButtonIcon__8091494e93[data-size='medium'] {\n padding: 0;\n width: 2.5rem;\n }\n}\n";
|
|
4
|
+
var stylesButtonIcon = {"bui-ButtonIcon":"ButtonIcon_bui-ButtonIcon__8091494e93"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { stylesButtonIcon as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Card":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Card_bui-Card__2625fd3ebb {\n display: flex;\n flex-direction: column;\n gap: var(--bui-space-3);\n background-color: var(--bui-bg-surface-1);\n border-radius: var(--bui-radius-3);\n padding-block: var(--bui-space-3);\n color: var(--bui-fg-primary);\n border: 1px solid var(--bui-border);\n overflow: hidden;\n min-height: 0;\n width: 100%;\n }\n\n .Card_bui-CardBody__2625fd3ebb {\n flex: 1;\n min-height: 0;\n overflow: auto;\n padding-inline: var(--bui-space-3);\n }\n\n .Card_bui-CardHeader__2625fd3ebb {\n padding-inline: var(--bui-space-3);\n }\n\n .Card_bui-CardFooter__2625fd3ebb {\n padding-inline: var(--bui-space-3);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Card":"Card_bui-Card__2625fd3ebb","bui-CardBody":"Card_bui-CardBody__2625fd3ebb","bui-CardHeader":"Card_bui-CardHeader__2625fd3ebb","bui-CardFooter":"Card_bui-CardFooter__2625fd3ebb"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,32 +1,35 @@
|
|
|
1
|
-
import { jsxs,
|
|
1
|
+
import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
|
|
2
2
|
import { forwardRef } from 'react';
|
|
3
3
|
import { Checkbox as Checkbox$1 } from 'react-aria-components';
|
|
4
4
|
import { useStyles } from '../../hooks/useStyles.esm.js';
|
|
5
5
|
import { CheckboxDefinition } from './definition.esm.js';
|
|
6
6
|
import clsx from 'clsx';
|
|
7
7
|
import styles from './Checkbox.module.css.esm.js';
|
|
8
|
-
import { RiCheckLine } from '@remixicon/react';
|
|
8
|
+
import { RiSubtractLine, RiCheckLine } from '@remixicon/react';
|
|
9
9
|
|
|
10
10
|
const Checkbox = forwardRef(
|
|
11
11
|
(props, ref) => {
|
|
12
12
|
const { classNames } = useStyles(CheckboxDefinition);
|
|
13
13
|
const { className, children, ...rest } = props;
|
|
14
|
-
return /* @__PURE__ */
|
|
14
|
+
return /* @__PURE__ */ jsx(
|
|
15
15
|
Checkbox$1,
|
|
16
16
|
{
|
|
17
17
|
ref,
|
|
18
18
|
className: clsx(classNames.root, styles[classNames.root], className),
|
|
19
19
|
...rest,
|
|
20
|
-
children: [
|
|
20
|
+
children: ({ isIndeterminate }) => /* @__PURE__ */ jsxs(Fragment, { children: [
|
|
21
21
|
/* @__PURE__ */ jsx(
|
|
22
22
|
"div",
|
|
23
23
|
{
|
|
24
|
-
className: clsx(
|
|
25
|
-
|
|
24
|
+
className: clsx(
|
|
25
|
+
classNames.indicator,
|
|
26
|
+
styles[classNames.indicator]
|
|
27
|
+
),
|
|
28
|
+
children: isIndeterminate ? /* @__PURE__ */ jsx(RiSubtractLine, { size: 12 }) : /* @__PURE__ */ jsx(RiCheckLine, { size: 12 })
|
|
26
29
|
}
|
|
27
30
|
),
|
|
28
31
|
children
|
|
29
|
-
]
|
|
32
|
+
] })
|
|
30
33
|
}
|
|
31
34
|
);
|
|
32
35
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Checkbox.esm.js","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Checkbox as RACheckbox } from 'react-aria-components';\nimport type { CheckboxProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport { CheckboxDefinition } from './definition';\nimport clsx from 'clsx';\nimport styles from './Checkbox.module.css';\nimport { RiCheckLine } from '@remixicon/react';\n\n/** @public */\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n (props, ref) => {\n const { classNames } = useStyles(CheckboxDefinition);\n const { className, children, ...rest } = props;\n\n return (\n <RACheckbox\n ref={ref}\n className={clsx(classNames.root, styles[classNames.root], className)}\n {...rest}\n >\n <div\n
|
|
1
|
+
{"version":3,"file":"Checkbox.esm.js","sources":["../../../src/components/Checkbox/Checkbox.tsx"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { forwardRef } from 'react';\nimport { Checkbox as RACheckbox } from 'react-aria-components';\nimport type { CheckboxProps } from './types';\nimport { useStyles } from '../../hooks/useStyles';\nimport { CheckboxDefinition } from './definition';\nimport clsx from 'clsx';\nimport styles from './Checkbox.module.css';\nimport { RiCheckLine, RiSubtractLine } from '@remixicon/react';\n\n/** @public */\nexport const Checkbox = forwardRef<HTMLLabelElement, CheckboxProps>(\n (props, ref) => {\n const { classNames } = useStyles(CheckboxDefinition);\n const { className, children, ...rest } = props;\n\n return (\n <RACheckbox\n ref={ref}\n className={clsx(classNames.root, styles[classNames.root], className)}\n {...rest}\n >\n {({ isIndeterminate }) => (\n <>\n <div\n className={clsx(\n classNames.indicator,\n styles[classNames.indicator],\n )}\n >\n {isIndeterminate ? (\n <RiSubtractLine size={12} />\n ) : (\n <RiCheckLine size={12} />\n )}\n </div>\n {children}\n </>\n )}\n </RACheckbox>\n );\n },\n);\n"],"names":["RACheckbox"],"mappings":";;;;;;;;;AA0BO,MAAM,QAAA,GAAW,UAAA;AAAA,EACtB,CAAC,OAAO,GAAA,KAAQ;AACd,IAAA,MAAM,EAAE,UAAA,EAAW,GAAI,SAAA,CAAU,kBAAkB,CAAA;AACnD,IAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAU,GAAG,MAAK,GAAI,KAAA;AAEzC,IAAA,uBACE,GAAA;AAAA,MAACA,UAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,KAAK,UAAA,CAAW,IAAA,EAAM,OAAO,UAAA,CAAW,IAAI,GAAG,SAAS,CAAA;AAAA,QAClE,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,CAAC,EAAE,eAAA,EAAgB,qBAClB,IAAA,CAAA,QAAA,EAAA,EACE,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,IAAA;AAAA,gBACT,UAAA,CAAW,SAAA;AAAA,gBACX,MAAA,CAAO,WAAW,SAAS;AAAA,eAC7B;AAAA,cAEC,QAAA,EAAA,eAAA,uBACE,cAAA,EAAA,EAAe,IAAA,EAAM,IAAI,CAAA,mBAE1B,GAAA,CAAC,WAAA,EAAA,EAAY,IAAA,EAAM,EAAA,EAAI;AAAA;AAAA,WAE3B;AAAA,UACC;AAAA,SAAA,EACH;AAAA;AAAA,KAEJ;AAAA,EAEJ;AACF;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Checkbox":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Checkbox_bui-Checkbox__74dcbb2139 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n font-size: var(--bui-font-size-3);\n font-family: var(--bui-font-regular);\n font-weight: var(--bui-font-weight-regular);\n color: var(--bui-fg-primary);\n user-select: none;\n cursor: pointer;\n }\n\n .Checkbox_bui-Checkbox__74dcbb2139[data-disabled] {\n cursor: not-allowed;\n opacity: 0.5;\n }\n\n .Checkbox_bui-CheckboxIndicator__74dcbb2139 {\n border: none;\n display: flex;\n align-items: center;\n justify-content: center;\n width: 1rem;\n height: 1rem;\n box-shadow: inset 0 0 0 1px var(--bui-border);\n border-radius: 2px;\n transition: background-color 0.2s ease-in-out;\n background-color: var(--bui-bg-surface-1);\n padding: 0;\n flex-shrink: 0;\n color: transparent;\n\n .Checkbox_bui-Checkbox__74dcbb2139[data-focus-visible] & {\n transition: none;\n outline: 2px solid var(--bui-ring);\n outline-offset: 2px;\n }\n\n .Checkbox_bui-Checkbox__74dcbb2139[data-selected] & {\n background-color: var(--bui-bg-solid);\n box-shadow: none;\n color: var(--bui-fg-solid);\n }\n\n .Checkbox_bui-Checkbox__74dcbb2139[data-indeterminate] & {\n background-color: var(--bui-bg-surface-1);\n box-shadow: inset 0 0 0 1px var(--bui-border);\n color: var(--bui-fg-primary);\n }\n\n .Checkbox_bui-Checkbox__74dcbb2139[data-hovered]:not([data-selected]):not([data-indeterminate])\n & {\n box-shadow: inset 0 0 0 1px var(--bui-border-hover);\n }\n\n @media (prefers-reduced-motion: reduce) {\n & {\n transition: none;\n }\n }\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Checkbox":"Checkbox_bui-Checkbox__74dcbb2139","bui-CheckboxIndicator":"Checkbox_bui-CheckboxIndicator__74dcbb2139"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Checkbox/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for Checkbox\n * @public\n */\nexport const CheckboxDefinition = {\n classNames: {\n root: 'bui-Checkbox',\n indicator: 'bui-CheckboxIndicator',\n },\n dataAttributes: {\n selected: [true, false] as const,\n },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,kBAAA,GAAqB;AAAA,EAChC,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,cAAA;AAAA,IACN,SAAA,EAAW;AAAA,GACb;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,QAAA,EAAU,CAAC,IAAA,EAAM,KAAK;AAAA;
|
|
1
|
+
{"version":3,"file":"definition.esm.js","sources":["../../../src/components/Checkbox/definition.ts"],"sourcesContent":["/*\n * Copyright 2024 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { ComponentDefinition } from '../../types';\n\n/**\n * Component definition for Checkbox\n * @public\n */\nexport const CheckboxDefinition = {\n classNames: {\n root: 'bui-Checkbox',\n indicator: 'bui-CheckboxIndicator',\n },\n dataAttributes: {\n selected: [true, false] as const,\n indeterminate: [true, false] as const,\n },\n} as const satisfies ComponentDefinition;\n"],"names":[],"mappings":"AAsBO,MAAM,kBAAA,GAAqB;AAAA,EAChC,UAAA,EAAY;AAAA,IACV,IAAA,EAAM,cAAA;AAAA,IACN,SAAA,EAAW;AAAA,GACb;AAAA,EACA,cAAA,EAAgB;AAAA,IACd,QAAA,EAAU,CAAC,IAAA,EAAM,KAAK,CAAA;AAAA,IACtB,aAAA,EAAe,CAAC,IAAA,EAAM,KAAK;AAAA;AAE/B;;;;"}
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Container":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Container_bui-Container__10ae690c55 {\n max-width: 120rem;\n padding-inline: var(--bui-space-4);\n margin-inline: auto;\n transition: padding 0.2s ease-in-out;\n }\n\n @media (min-width: 640px) {\n .Container_bui-Container__10ae690c55 {\n padding-inline: var(--bui-space-5);\n }\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Container":"Container_bui-Container__10ae690c55"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-DialogOverlay":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Dialog_bui-DialogOverlay__f7c1977537 {\n position: fixed;\n top: 0;\n left: 0;\n width: 100%;\n height: 100%;\n background: color-mix(in srgb, var(--bui-gray-2) 80%, transparent);\n display: flex;\n align-items: center;\n justify-content: center;\n z-index: 1000;\n }\n\n [data-theme='dark'] .Dialog_bui-Dialog__f7c1977537 {\n background: rgba(0, 0, 0, 0.5);\n }\n\n .Dialog_bui-DialogOverlay__f7c1977537[data-entering] {\n animation: Dialog_fade-in__f7c1977537 200ms ease-out forwards;\n }\n\n .Dialog_bui-DialogOverlay__f7c1977537[data-exiting] {\n animation: Dialog_fade-out__f7c1977537 150ms ease-out forwards;\n }\n\n .Dialog_bui-Dialog__f7c1977537 {\n background: var(--bui-bg-surface-1);\n border-radius: 0.5rem;\n border: 1px solid var(--bui-border);\n color: var(--bui-fg-primary);\n position: relative;\n width: min(var(--bui-dialog-min-width, 400px), calc(100vw - 3rem));\n max-width: calc(100vw - 3rem);\n height: min(var(--bui-dialog-min-height, auto), calc(100vh - 3rem));\n max-height: calc(100vh - 3rem);\n display: flex;\n flex-direction: column;\n outline: none;\n }\n\n /* Dialog entering animation */\n .Dialog_bui-DialogOverlay__f7c1977537[data-entering] .Dialog_bui-Dialog__f7c1977537 {\n animation: Dialog_dialog-enter__f7c1977537 150ms ease-out forwards;\n }\n\n /* Dialog exiting animation */\n .Dialog_bui-DialogOverlay__f7c1977537[data-exiting] .Dialog_bui-Dialog__f7c1977537 {\n animation: Dialog_dialog-exit__f7c1977537 150ms ease-out forwards;\n }\n\n .Dialog_bui-DialogHeader__f7c1977537 {\n display: flex;\n justify-content: space-between;\n align-items: center;\n padding-inline: var(--bui-space-3);\n padding-block: var(--bui-space-2);\n border-bottom: 1px solid var(--bui-border);\n }\n\n .Dialog_bui-DialogHeaderTitle__f7c1977537 {\n font-size: var(--bui-font-size-3);\n font-weight: var(--bui-font-weight-bold);\n margin: 0;\n }\n\n .Dialog_bui-DialogFooter__f7c1977537 {\n display: flex;\n align-items: center;\n justify-content: end;\n gap: var(--bui-space-2);\n padding-inline: var(--bui-space-3);\n padding-block: var(--bui-space-3);\n border-top: 1px solid var(--bui-border);\n }\n\n .Dialog_bui-DialogBody__f7c1977537 {\n padding: var(--bui-space-3);\n flex: 1;\n overflow-y: auto;\n }\n\n /* Keyframe animations */\n @keyframes Dialog_fade-in__f7c1977537 {\n from {\n opacity: 0;\n }\n to {\n opacity: 1;\n }\n }\n\n @keyframes Dialog_fade-out__f7c1977537 {\n from {\n opacity: 1;\n }\n to {\n opacity: 0;\n }\n }\n\n @keyframes Dialog_dialog-enter__f7c1977537 {\n from {\n opacity: 0.5;\n transform: scale(0.8);\n }\n to {\n opacity: 1;\n transform: scale(1);\n }\n }\n\n @keyframes Dialog_dialog-exit__f7c1977537 {\n from {\n opacity: 1;\n transform: scale(1);\n }\n to {\n opacity: 0;\n transform: scale(0.95);\n }\n }\n}\n";
|
|
4
|
+
var styles = {"bui-DialogOverlay":"Dialog_bui-DialogOverlay__f7c1977537","bui-Dialog":"Dialog_bui-Dialog__f7c1977537","fade-in":"Dialog_fade-in__f7c1977537","fade-out":"Dialog_fade-out__f7c1977537","dialog-enter":"Dialog_dialog-enter__f7c1977537","dialog-exit":"Dialog_dialog-exit__f7c1977537","bui-DialogHeader":"Dialog_bui-DialogHeader__f7c1977537","bui-DialogHeaderTitle":"Dialog_bui-DialogHeaderTitle__f7c1977537","bui-DialogFooter":"Dialog_bui-DialogFooter__f7c1977537","bui-DialogBody":"Dialog_bui-DialogBody__f7c1977537"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-FieldError":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .FieldError_bui-FieldError__056d38b74d {\n display: inline-block;\n color: var(--bui-fg-danger);\n font-size: var(--bui-font-size-2);\n font-weight: var(--bui-font-weight-regular);\n margin-top: var(--bui-space-2);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-FieldError":"FieldError_bui-FieldError__056d38b74d"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-FieldLabelWrapper":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .FieldLabel_bui-FieldLabelWrapper__555273e590 {\n display: flex;\n flex-direction: column;\n margin-bottom: var(--bui-space-3);\n gap: var(--bui-space-1);\n }\n\n .FieldLabel_bui-FieldLabel__555273e590 {\n color: var(--bui-fg-primary);\n margin-right: auto;\n cursor: pointer;\n font-weight: var(--bui-font-weight-regular);\n font-size: var(--bui-font-size-2);\n }\n\n .FieldLabel_bui-FieldSecondaryLabel__555273e590 {\n color: var(--bui-fg-secondary);\n font-weight: var(--bui-font-weight-regular);\n margin-left: var(--bui-space-1);\n }\n\n .FieldLabel_bui-FieldDescription__555273e590 {\n font-weight: var(--bui-font-weight-regular);\n font-size: var(--bui-font-size-2);\n color: var(--bui-fg-secondary);\n margin: 0;\n }\n}\n";
|
|
4
|
+
var styles = {"bui-FieldLabelWrapper":"FieldLabel_bui-FieldLabelWrapper__555273e590","bui-FieldLabel":"FieldLabel_bui-FieldLabel__555273e590","bui-FieldSecondaryLabel":"FieldLabel_bui-FieldSecondaryLabel__555273e590","bui-FieldDescription":"FieldLabel_bui-FieldDescription__555273e590"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Flex":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Flex_bui-Flex__f0807aaa30 {\n display: flex;\n\n /* This helps when using `truncate` on text inside a flex container */\n min-width: 0;\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='0'] {\n background-color: var(--bui-bg-surface-0);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='1'] {\n background-color: var(--bui-bg-surface-1);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='2'] {\n background-color: var(--bui-bg-surface-2);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='3'] {\n background-color: var(--bui-bg-surface-3);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='danger'] {\n background-color: var(--bui-bg-danger);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='warning'] {\n background-color: var(--bui-bg-warning);\n }\n\n .Flex_bui-Flex__f0807aaa30[data-surface='success'] {\n background-color: var(--bui-bg-success);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Flex":"Flex_bui-Flex__f0807aaa30"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Grid":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Grid_bui-Grid__d16d166229 {\n display: grid;\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='0'],\n .Grid_bui-GridItem__d16d166229[data-surface='0'] {\n background-color: var(--bui-bg-surface-0);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='1'],\n .Grid_bui-GridItem__d16d166229[data-surface='1'] {\n background-color: var(--bui-bg-surface-1);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='2'],\n .Grid_bui-GridItem__d16d166229[data-surface='2'] {\n background-color: var(--bui-bg-surface-2);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='3'],\n .Grid_bui-GridItem__d16d166229[data-surface='3'] {\n background-color: var(--bui-bg-surface-3);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='danger'],\n .Grid_bui-GridItem__d16d166229[data-surface='danger'] {\n background-color: var(--bui-bg-danger);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='warning'],\n .Grid_bui-GridItem__d16d166229[data-surface='warning'] {\n background-color: var(--bui-bg-warning);\n }\n\n .Grid_bui-Grid__d16d166229[data-surface='success'],\n .Grid_bui-GridItem__d16d166229[data-surface='success'] {\n background-color: var(--bui-bg-success);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Grid":"Grid_bui-Grid__d16d166229","bui-GridItem":"Grid_bui-GridItem__d16d166229"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-HeaderToolbar":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Header_bui-HeaderToolbar__d881b756ea {\n margin-bottom: var(--bui-space-6);\n\n &::before {\n content: '';\n position: absolute;\n top: 0;\n left: 0px;\n right: 0px;\n height: 16px;\n background-color: var(--bui-bg-surface-0);\n z-index: 0;\n }\n\n &[data-has-tabs='true'] {\n margin-bottom: 0;\n }\n }\n\n .Header_bui-HeaderToolbarWrapper__d881b756ea {\n position: relative;\n z-index: 1;\n display: flex;\n flex-direction: row;\n align-items: center;\n justify-content: space-between;\n background-color: var(--bui-bg-surface-1);\n padding-inline: var(--bui-space-5);\n border-bottom: 1px solid var(--bui-border);\n color: var(--bui-fg-primary);\n height: 52px;\n }\n\n .Header_bui-HeaderToolbarContent__d881b756ea {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n }\n\n .Header_bui-HeaderToolbarName__d881b756ea {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n font-size: var(--bui-font-size-3);\n font-weight: var(--bui-font-weight-regular);\n flex-shrink: 0;\n }\n\n .Header_bui-HeaderToolbarIcon__d881b756ea {\n width: 16px;\n height: 16px;\n color: var(--bui-fg-primary);\n\n & svg {\n width: 100%;\n height: 100%;\n }\n }\n\n .Header_bui-HeaderToolbarControls__d881b756ea {\n position: absolute;\n right: var(--bui-space-5);\n top: 50%;\n transform: translateY(-50%);\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n }\n\n .Header_bui-HeaderTabsWrapper__d881b756ea {\n margin-bottom: var(--bui-space-4);\n padding-inline: var(--bui-space-3);\n border-bottom: 1px solid var(--bui-border);\n background-color: var(--bui-bg-surface-1);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-HeaderToolbar":"Header_bui-HeaderToolbar__d881b756ea","bui-HeaderToolbarWrapper":"Header_bui-HeaderToolbarWrapper__d881b756ea","bui-HeaderToolbarContent":"Header_bui-HeaderToolbarContent__d881b756ea","bui-HeaderToolbarName":"Header_bui-HeaderToolbarName__d881b756ea","bui-HeaderToolbarIcon":"Header_bui-HeaderToolbarIcon__d881b756ea","bui-HeaderToolbarControls":"Header_bui-HeaderToolbarControls__d881b756ea","bui-HeaderTabsWrapper":"Header_bui-HeaderTabsWrapper__d881b756ea"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-HeaderPage":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .HeaderPage_bui-HeaderPage__7c070290f2 {\n display: flex;\n flex-direction: column;\n gap: var(--bui-space-1);\n margin-top: var(--bui-space-6);\n margin-bottom: var(--bui-space-6);\n }\n\n .HeaderPage_bui-HeaderPageContent__7c070290f2 {\n display: flex;\n flex-direction: row;\n justify-content: space-between;\n }\n\n .HeaderPage_bui-HeaderPageTabsWrapper__7c070290f2 {\n margin-left: -8px;\n }\n\n .HeaderPage_bui-HeaderPageControls__7c070290f2 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n }\n\n .HeaderPage_bui-HeaderPageBreadcrumbs__7c070290f2 {\n display: flex;\n flex-direction: row;\n align-items: center;\n gap: var(--bui-space-2);\n }\n}\n";
|
|
4
|
+
var styles = {"bui-HeaderPage":"HeaderPage_bui-HeaderPage__7c070290f2","bui-HeaderPageContent":"HeaderPage_bui-HeaderPageContent__7c070290f2","bui-HeaderPageTabsWrapper":"HeaderPage_bui-HeaderPageTabsWrapper__7c070290f2","bui-HeaderPageControls":"HeaderPage_bui-HeaderPageControls__7c070290f2","bui-HeaderPageBreadcrumbs":"HeaderPage_bui-HeaderPageBreadcrumbs__7c070290f2"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import styleInject from '../../node_modules_dist/style-inject/dist/style-inject.es.esm.js';
|
|
2
2
|
|
|
3
|
-
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .
|
|
4
|
-
var styles = {"bui-Link":"
|
|
3
|
+
var css_248z = "/*\n * Copyright 2025 The Backstage Authors\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n * http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\n@layer tokens, base, components, utilities;\n\n@layer components {\n .Link_bui-Link__6e54885f86 {\n font-family: var(--bui-font-regular);\n padding: 0;\n margin: 0;\n cursor: pointer;\n text-decoration-line: none;\n display: inline-block;\n\n &:hover {\n text-decoration-line: underline;\n text-decoration-style: solid;\n text-decoration-thickness: min(2px, max(1px, 0.05em));\n text-underline-offset: calc(0.025em + 2px);\n text-decoration-color: color-mix(in srgb, currentColor 30%, transparent);\n }\n }\n\n .Link_bui-Link__6e54885f86[data-variant='title-large'] {\n font-size: var(--bui-font-size-8);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='title-medium'] {\n font-size: var(--bui-font-size-7);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='title-small'] {\n font-size: var(--bui-font-size-6);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='title-x-small'] {\n font-size: var(--bui-font-size-5);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='body-large'] {\n font-size: var(--bui-font-size-4);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='body-medium'] {\n font-size: var(--bui-font-size-3);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='body-small'] {\n font-size: var(--bui-font-size-2);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-variant='body-x-small'] {\n font-size: var(--bui-font-size-1);\n line-height: 140%;\n }\n\n .Link_bui-Link__6e54885f86[data-weight='regular'] {\n font-weight: var(--bui-font-weight-regular);\n }\n\n .Link_bui-Link__6e54885f86[data-weight='bold'] {\n font-weight: var(--bui-font-weight-bold);\n }\n\n .Link_bui-Link__6e54885f86[data-color='primary'] {\n color: var(--bui-fg-primary);\n }\n\n .Link_bui-Link__6e54885f86[data-color='secondary'] {\n color: var(--bui-fg-secondary);\n }\n\n .Link_bui-Link__6e54885f86[data-color='danger'] {\n color: var(--bui-fg-danger);\n }\n\n .Link_bui-Link__6e54885f86[data-color='warning'] {\n color: var(--bui-fg-warning);\n }\n\n .Link_bui-Link__6e54885f86[data-color='success'] {\n color: var(--bui-fg-success);\n }\n\n .Link_bui-Link__6e54885f86[data-truncate] {\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n }\n}\n";
|
|
4
|
+
var styles = {"bui-Link":"Link_bui-Link__6e54885f86"};
|
|
5
5
|
styleInject(css_248z);
|
|
6
6
|
|
|
7
7
|
export { styles as default };
|