@backstage/ui 0.6.0 → 0.6.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/CHANGELOG.md +6 -0
- package/dist/components/Avatar/Avatar.esm.js +29 -0
- package/dist/components/Avatar/Avatar.esm.js.map +1 -0
- package/dist/components/Box/Box.esm.js +34 -0
- package/dist/components/Box/Box.esm.js.map +1 -0
- package/dist/components/Box/Box.props.esm.js +7 -0
- package/dist/components/Box/Box.props.esm.js.map +1 -0
- package/dist/components/Button/Button.esm.js +41 -0
- package/dist/components/Button/Button.esm.js.map +1 -0
- package/dist/components/ButtonIcon/ButtonIcon.esm.js +37 -0
- package/dist/components/ButtonIcon/ButtonIcon.esm.js.map +1 -0
- package/dist/components/ButtonLink/ButtonLink.esm.js +42 -0
- package/dist/components/ButtonLink/ButtonLink.esm.js.map +1 -0
- package/dist/components/Card/Card.esm.js +53 -0
- package/dist/components/Card/Card.esm.js.map +1 -0
- package/dist/components/Checkbox/Checkbox.esm.js +74 -0
- package/dist/components/Checkbox/Checkbox.esm.js.map +1 -0
- package/dist/components/Collapsible/Collapsible.esm.js +50 -0
- package/dist/components/Collapsible/Collapsible.esm.js.map +1 -0
- package/dist/components/Container/Container.esm.js +35 -0
- package/dist/components/Container/Container.esm.js.map +1 -0
- package/dist/components/DataTable/DataTable.esm.js +26 -0
- package/dist/components/DataTable/DataTable.esm.js.map +1 -0
- package/dist/components/DataTable/Pagination/DataTablePagination.esm.js +84 -0
- package/dist/components/DataTable/Pagination/DataTablePagination.esm.js.map +1 -0
- package/dist/components/DataTable/Root/DataTableRoot.esm.js +24 -0
- package/dist/components/DataTable/Root/DataTableRoot.esm.js.map +1 -0
- package/dist/components/DataTable/Table/DataTableTable.esm.js +64 -0
- package/dist/components/DataTable/Table/DataTableTable.esm.js.map +1 -0
- package/dist/components/FieldError/FieldError.esm.js +22 -0
- package/dist/components/FieldError/FieldError.esm.js.map +1 -0
- package/dist/components/FieldLabel/FieldLabel.esm.js +27 -0
- package/dist/components/FieldLabel/FieldLabel.esm.js.map +1 -0
- package/dist/components/Flex/Flex.esm.js +26 -0
- package/dist/components/Flex/Flex.esm.js.map +1 -0
- package/dist/components/Flex/Flex.props.esm.js +31 -0
- package/dist/components/Flex/Flex.props.esm.js.map +1 -0
- package/dist/components/Grid/Grid.esm.js +43 -0
- package/dist/components/Grid/Grid.esm.js.map +1 -0
- package/dist/components/Grid/Grid.props.esm.js +58 -0
- package/dist/components/Grid/Grid.props.esm.js.map +1 -0
- package/dist/components/Header/Header.esm.js +27 -0
- package/dist/components/Header/Header.esm.js.map +1 -0
- package/dist/components/Header/HeaderToolbar.esm.js +121 -0
- package/dist/components/Header/HeaderToolbar.esm.js.map +1 -0
- package/dist/components/HeaderPage/HeaderPage.esm.js +48 -0
- package/dist/components/HeaderPage/HeaderPage.esm.js.map +1 -0
- package/dist/components/Heading/Heading.esm.js +37 -0
- package/dist/components/Heading/Heading.esm.js.map +1 -0
- package/dist/components/Icon/Icon.esm.js +29 -0
- package/dist/components/Icon/Icon.esm.js.map +1 -0
- package/dist/components/Icon/context.esm.js +10 -0
- package/dist/components/Icon/context.esm.js.map +1 -0
- package/dist/components/Icon/icons.esm.js +63 -0
- package/dist/components/Icon/icons.esm.js.map +1 -0
- package/dist/components/Icon/provider.esm.js +12 -0
- package/dist/components/Icon/provider.esm.js.map +1 -0
- package/dist/components/Link/Link.esm.js +63 -0
- package/dist/components/Link/Link.esm.js.map +1 -0
- package/dist/components/Menu/Combobox.esm.js +212 -0
- package/dist/components/Menu/Combobox.esm.js.map +1 -0
- package/dist/components/Menu/Menu.esm.js +224 -0
- package/dist/components/Menu/Menu.esm.js.map +1 -0
- package/dist/components/RadioGroup/RadioGroup.esm.js +71 -0
- package/dist/components/RadioGroup/RadioGroup.esm.js.map +1 -0
- package/dist/components/ScrollArea/ScrollArea.esm.js +63 -0
- package/dist/components/ScrollArea/ScrollArea.esm.js.map +1 -0
- package/dist/components/SearchField/SearchField.esm.js +107 -0
- package/dist/components/SearchField/SearchField.esm.js.map +1 -0
- package/dist/components/Select/Select.esm.js +89 -0
- package/dist/components/Select/Select.esm.js.map +1 -0
- package/dist/components/Select/Select.styles.css.esm.js +7 -0
- package/dist/components/Select/Select.styles.css.esm.js.map +1 -0
- package/dist/components/Skeleton/Skeleton.esm.js +22 -0
- package/dist/components/Skeleton/Skeleton.esm.js.map +1 -0
- package/dist/components/Switch/Switch.esm.js +18 -0
- package/dist/components/Switch/Switch.esm.js.map +1 -0
- package/dist/components/Table/Table.esm.js +68 -0
- package/dist/components/Table/Table.esm.js.map +1 -0
- package/dist/components/Table/TableCell/TableCell.esm.js +13 -0
- package/dist/components/Table/TableCell/TableCell.esm.js.map +1 -0
- package/dist/components/Table/TableCellLink/TableCellLink.esm.js +28 -0
- package/dist/components/Table/TableCellLink/TableCellLink.esm.js.map +1 -0
- package/dist/components/Table/TableCellProfile/TableCellProfile.esm.js +40 -0
- package/dist/components/Table/TableCellProfile/TableCellProfile.esm.js.map +1 -0
- package/dist/components/Table/TableCellText/TableCellText.esm.js +27 -0
- package/dist/components/Table/TableCellText/TableCellText.esm.js.map +1 -0
- package/dist/components/Tabs/Tabs.esm.js +127 -0
- package/dist/components/Tabs/Tabs.esm.js.map +1 -0
- package/dist/components/Tabs/TabsIndicators.esm.js +140 -0
- package/dist/components/Tabs/TabsIndicators.esm.js.map +1 -0
- package/dist/components/Text/Text.esm.js +39 -0
- package/dist/components/Text/Text.esm.js.map +1 -0
- package/dist/components/TextField/TextField.esm.js +88 -0
- package/dist/components/TextField/TextField.esm.js.map +1 -0
- package/dist/components/Tooltip/Tooltip.esm.js +31 -0
- package/dist/components/Tooltip/Tooltip.esm.js.map +1 -0
- package/dist/hooks/useBreakpoint.esm.js +43 -0
- package/dist/hooks/useBreakpoint.esm.js.map +1 -0
- package/dist/hooks/useIsomorphicLayoutEffect.esm.js +6 -0
- package/dist/hooks/useIsomorphicLayoutEffect.esm.js.map +1 -0
- package/dist/hooks/useMediaQuery.esm.js +44 -0
- package/dist/hooks/useMediaQuery.esm.js.map +1 -0
- package/dist/hooks/useStyles.esm.js +46 -0
- package/dist/hooks/useStyles.esm.js.map +1 -0
- package/dist/index.d.ts +1398 -0
- package/dist/index.esm.js +40 -0
- package/dist/index.esm.js.map +1 -0
- package/dist/node_modules_dist/style-inject/dist/style-inject.es.esm.js +29 -0
- package/dist/node_modules_dist/style-inject/dist/style-inject.es.esm.js.map +1 -0
- package/dist/props/display.props.esm.js +12 -0
- package/dist/props/display.props.esm.js.map +1 -0
- package/dist/props/gap-props.esm.js +15 -0
- package/dist/props/gap-props.esm.js.map +1 -0
- package/dist/props/height.props.esm.js +23 -0
- package/dist/props/height.props.esm.js.map +1 -0
- package/dist/props/margin.props.esm.js +54 -0
- package/dist/props/margin.props.esm.js.map +1 -0
- package/dist/props/padding.props.esm.js +54 -0
- package/dist/props/padding.props.esm.js.map +1 -0
- package/dist/props/position.props.esm.js +18 -0
- package/dist/props/position.props.esm.js.map +1 -0
- package/dist/props/prop-def.esm.js +4 -0
- package/dist/props/prop-def.esm.js.map +1 -0
- package/dist/props/spacing.props.esm.js +28 -0
- package/dist/props/spacing.props.esm.js.map +1 -0
- package/dist/props/width.props.esm.js +23 -0
- package/dist/props/width.props.esm.js.map +1 -0
- package/dist/utils/componentDefinitions.esm.js +272 -0
- package/dist/utils/componentDefinitions.esm.js.map +1 -0
- package/dist/utils/extractProps.esm.js +49 -0
- package/dist/utils/extractProps.esm.js.map +1 -0
- package/package.json +10 -2
package/dist/index.d.ts
ADDED
|
@@ -0,0 +1,1398 @@
|
|
|
1
|
+
import * as react from 'react';
|
|
2
|
+
import { ReactNode, ElementType, ComponentPropsWithRef, ReactElement, ComponentProps, ForwardRefExoticComponent, RefAttributes } from 'react';
|
|
3
|
+
import { RemixiconComponentType } from '@remixicon/react';
|
|
4
|
+
import { Avatar as Avatar$1 } from '@base-ui-components/react/avatar';
|
|
5
|
+
import { ButtonProps as ButtonProps$1, LinkProps as LinkProps$1, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, TabsProps as TabsProps$1, TabListProps as TabListProps$1, TabPanelProps as TabPanelProps$1, TabProps, TextFieldProps as TextFieldProps$1, TooltipProps as TooltipProps$1, TooltipTriggerComponentProps, SearchFieldProps as SearchFieldProps$1, SelectProps as SelectProps$1, SwitchProps as SwitchProps$1 } from 'react-aria-components';
|
|
6
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
7
|
+
import { NavigateOptions } from 'react-router-dom';
|
|
8
|
+
import { Collapsible as Collapsible$1 } from '@base-ui-components/react/collapsible';
|
|
9
|
+
import { useRender } from '@base-ui-components/react/use-render';
|
|
10
|
+
import { Table as Table$1 } from '@tanstack/react-table';
|
|
11
|
+
import { Menu as Menu$1 } from '@base-ui-components/react/menu';
|
|
12
|
+
import { ScrollArea as ScrollArea$1 } from '@base-ui-components/react/scroll-area';
|
|
13
|
+
|
|
14
|
+
/** @public */
|
|
15
|
+
type IconNames = 'account-circle' | 'alert' | 'arrow-down' | 'arrow-down-circle' | 'caret-down' | 'caret-left' | 'caret-right' | 'caret-up' | 'arrow-left' | 'arrow-left-circle' | 'arrow-left-down' | 'arrow-left-up' | 'arrow-right' | 'arrow-right-circle' | 'arrow-right-down' | 'arrow-right-up' | 'arrow-up' | 'arrow-up-circle' | 'braces' | 'brackets' | 'bug' | 'check' | 'check-double' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'chevron-up' | 'close' | 'cloud' | 'code' | 'discord' | 'download' | 'external-link' | 'eye' | 'eye-off' | 'filter' | 'flower' | 'github' | 'git-repository' | 'group' | 'heart' | 'moon' | 'plus' | 'search' | 'sidebar-fold' | 'sidebar-unfold' | 'sparkling' | 'star' | 'sun' | 'terminal' | 'trash' | 'upload' | 'user' | 'youtube' | 'zoom-in' | 'zoom-out';
|
|
16
|
+
/** @public */
|
|
17
|
+
type IconMap = Partial<Record<IconNames, RemixiconComponentType>>;
|
|
18
|
+
/** @public */
|
|
19
|
+
type IconProps = {
|
|
20
|
+
name: IconNames;
|
|
21
|
+
size?: number;
|
|
22
|
+
className?: string;
|
|
23
|
+
style?: React.CSSProperties;
|
|
24
|
+
};
|
|
25
|
+
/** @public */
|
|
26
|
+
interface IconContextProps {
|
|
27
|
+
icons: IconMap;
|
|
28
|
+
}
|
|
29
|
+
/** @public */
|
|
30
|
+
interface IconProviderProps {
|
|
31
|
+
children?: ReactNode;
|
|
32
|
+
overrides?: Partial<Record<IconNames, RemixiconComponentType>>;
|
|
33
|
+
}
|
|
34
|
+
|
|
35
|
+
/** @public */
|
|
36
|
+
declare const IconContext: react.Context<IconContextProps>;
|
|
37
|
+
/** @public */
|
|
38
|
+
declare const useIcons: () => IconContextProps;
|
|
39
|
+
|
|
40
|
+
/**
|
|
41
|
+
* Component definitions for the Backstage UI library
|
|
42
|
+
* @public
|
|
43
|
+
*/
|
|
44
|
+
declare const componentDefinitions: {
|
|
45
|
+
readonly Avatar: {
|
|
46
|
+
readonly classNames: {
|
|
47
|
+
readonly root: "bui-AvatarRoot";
|
|
48
|
+
readonly image: "bui-AvatarImage";
|
|
49
|
+
readonly fallback: "bui-AvatarFallback";
|
|
50
|
+
};
|
|
51
|
+
readonly dataAttributes: {
|
|
52
|
+
readonly size: readonly ["small", "medium", "large"];
|
|
53
|
+
};
|
|
54
|
+
};
|
|
55
|
+
readonly Box: {
|
|
56
|
+
readonly classNames: {
|
|
57
|
+
readonly root: "bui-Box";
|
|
58
|
+
};
|
|
59
|
+
};
|
|
60
|
+
readonly Button: {
|
|
61
|
+
readonly classNames: {
|
|
62
|
+
readonly root: "bui-Button";
|
|
63
|
+
};
|
|
64
|
+
readonly dataAttributes: {
|
|
65
|
+
readonly size: readonly ["small", "medium", "large"];
|
|
66
|
+
readonly variant: readonly ["primary", "secondary", "ghost"];
|
|
67
|
+
};
|
|
68
|
+
};
|
|
69
|
+
readonly ButtonIcon: {
|
|
70
|
+
readonly classNames: {
|
|
71
|
+
readonly root: "bui-ButtonIcon";
|
|
72
|
+
};
|
|
73
|
+
};
|
|
74
|
+
readonly ButtonLink: {
|
|
75
|
+
readonly classNames: {
|
|
76
|
+
readonly root: "bui-ButtonLink";
|
|
77
|
+
};
|
|
78
|
+
};
|
|
79
|
+
readonly Card: {
|
|
80
|
+
readonly classNames: {
|
|
81
|
+
readonly root: "bui-Card";
|
|
82
|
+
readonly header: "bui-CardHeader";
|
|
83
|
+
readonly body: "bui-CardBody";
|
|
84
|
+
readonly footer: "bui-CardFooter";
|
|
85
|
+
};
|
|
86
|
+
};
|
|
87
|
+
readonly Checkbox: {
|
|
88
|
+
readonly classNames: {
|
|
89
|
+
readonly root: "bui-CheckboxRoot";
|
|
90
|
+
readonly label: "bui-CheckboxLabel";
|
|
91
|
+
readonly indicator: "bui-CheckboxIndicator";
|
|
92
|
+
};
|
|
93
|
+
readonly dataAttributes: {
|
|
94
|
+
readonly checked: readonly [true, false];
|
|
95
|
+
};
|
|
96
|
+
};
|
|
97
|
+
readonly Collapsible: {
|
|
98
|
+
readonly classNames: {
|
|
99
|
+
readonly root: "bui-CollapsibleRoot";
|
|
100
|
+
readonly trigger: "bui-CollapsibleTrigger";
|
|
101
|
+
readonly panel: "bui-CollapsiblePanel";
|
|
102
|
+
};
|
|
103
|
+
};
|
|
104
|
+
readonly Container: {
|
|
105
|
+
readonly classNames: {
|
|
106
|
+
readonly root: "bui-Container";
|
|
107
|
+
};
|
|
108
|
+
};
|
|
109
|
+
readonly FieldLabel: {
|
|
110
|
+
readonly classNames: {
|
|
111
|
+
readonly root: "bui-FieldLabelWrapper";
|
|
112
|
+
readonly label: "bui-FieldLabel";
|
|
113
|
+
readonly secondaryLabel: "bui-FieldSecondaryLabel";
|
|
114
|
+
readonly description: "bui-FieldDescription";
|
|
115
|
+
};
|
|
116
|
+
};
|
|
117
|
+
readonly Flex: {
|
|
118
|
+
readonly classNames: {
|
|
119
|
+
readonly root: "bui-Flex";
|
|
120
|
+
};
|
|
121
|
+
};
|
|
122
|
+
readonly Grid: {
|
|
123
|
+
readonly classNames: {
|
|
124
|
+
readonly root: "bui-Grid";
|
|
125
|
+
readonly item: "bui-GridItem";
|
|
126
|
+
};
|
|
127
|
+
};
|
|
128
|
+
readonly Header: {
|
|
129
|
+
readonly classNames: {
|
|
130
|
+
readonly toolbar: "bui-HeaderToolbar";
|
|
131
|
+
readonly toolbarWrapper: "bui-HeaderToolbarWrapper";
|
|
132
|
+
readonly toolbarContent: "bui-HeaderToolbarContent";
|
|
133
|
+
readonly toolbarControls: "bui-HeaderToolbarControls";
|
|
134
|
+
readonly toolbarIcon: "bui-HeaderToolbarIcon";
|
|
135
|
+
readonly toolbarName: "bui-HeaderToolbarName";
|
|
136
|
+
readonly breadcrumbs: "bui-HeaderBreadcrumbs";
|
|
137
|
+
readonly breadcrumb: "bui-HeaderBreadcrumb";
|
|
138
|
+
readonly breadcrumbLink: "bui-HeaderBreadcrumbLink";
|
|
139
|
+
readonly breadcrumbSeparator: "bui-HeaderBreadcrumbSeparator";
|
|
140
|
+
readonly tabsWrapper: "bui-HeaderTabsWrapper";
|
|
141
|
+
};
|
|
142
|
+
};
|
|
143
|
+
readonly HeaderPage: {
|
|
144
|
+
readonly classNames: {
|
|
145
|
+
readonly root: "bui-HeaderPage";
|
|
146
|
+
readonly content: "bui-HeaderPageContent";
|
|
147
|
+
readonly tabsWrapper: "bui-HeaderPageTabsWrapper";
|
|
148
|
+
readonly controls: "bui-HeaderPageControls";
|
|
149
|
+
};
|
|
150
|
+
};
|
|
151
|
+
readonly Heading: {
|
|
152
|
+
readonly classNames: {
|
|
153
|
+
readonly root: "bui-Heading";
|
|
154
|
+
};
|
|
155
|
+
readonly dataAttributes: {
|
|
156
|
+
readonly variant: readonly ["title1", "title2", "title3", "subtitle"];
|
|
157
|
+
readonly color: readonly ["primary", "secondary", "muted"];
|
|
158
|
+
readonly truncate: readonly [true, false];
|
|
159
|
+
};
|
|
160
|
+
};
|
|
161
|
+
readonly Icon: {
|
|
162
|
+
readonly classNames: {
|
|
163
|
+
readonly root: "bui-Icon";
|
|
164
|
+
};
|
|
165
|
+
};
|
|
166
|
+
readonly Link: {
|
|
167
|
+
readonly classNames: {
|
|
168
|
+
readonly root: "bui-Link";
|
|
169
|
+
};
|
|
170
|
+
readonly dataAttributes: {
|
|
171
|
+
readonly variant: readonly ["subtitle", "body", "caption", "label"];
|
|
172
|
+
readonly weight: readonly ["regular", "bold"];
|
|
173
|
+
};
|
|
174
|
+
};
|
|
175
|
+
readonly List: {
|
|
176
|
+
readonly classNames: {
|
|
177
|
+
readonly root: "bui-List";
|
|
178
|
+
readonly row: "bui-ListRow";
|
|
179
|
+
readonly label: "bui-ListLabel";
|
|
180
|
+
};
|
|
181
|
+
};
|
|
182
|
+
readonly Menu: {
|
|
183
|
+
readonly classNames: {
|
|
184
|
+
readonly trigger: "bui-MenuTrigger";
|
|
185
|
+
readonly backdrop: "bui-MenuBackdrop";
|
|
186
|
+
readonly positioner: "bui-MenuPositioner";
|
|
187
|
+
readonly popup: "bui-MenuPopup";
|
|
188
|
+
readonly arrow: "bui-MenuArrow";
|
|
189
|
+
readonly item: "bui-MenuItem";
|
|
190
|
+
readonly group: "bui-MenuGroup";
|
|
191
|
+
readonly groupLabel: "bui-MenuGroupLabel";
|
|
192
|
+
readonly radioGroup: "bui-MenuRadioGroup";
|
|
193
|
+
readonly radioItem: "bui-MenuRadioItem";
|
|
194
|
+
readonly radioItemIndicator: "bui-MenuRadioItemIndicator";
|
|
195
|
+
readonly checkboxItem: "bui-MenuCheckboxItem";
|
|
196
|
+
readonly checkboxItemIndicator: "bui-MenuCheckboxItemIndicator";
|
|
197
|
+
readonly submenuTrigger: "bui-MenuSubmenuTrigger";
|
|
198
|
+
readonly separator: "bui-MenuSeparator";
|
|
199
|
+
};
|
|
200
|
+
};
|
|
201
|
+
readonly Popover: {
|
|
202
|
+
readonly classNames: {
|
|
203
|
+
readonly root: "bui-Popover";
|
|
204
|
+
};
|
|
205
|
+
};
|
|
206
|
+
readonly RadioGroup: {
|
|
207
|
+
readonly classNames: {
|
|
208
|
+
readonly root: "bui-RadioGroup";
|
|
209
|
+
readonly content: "bui-RadioGroupContent";
|
|
210
|
+
readonly radio: "bui-Radio";
|
|
211
|
+
};
|
|
212
|
+
};
|
|
213
|
+
readonly ScrollArea: {
|
|
214
|
+
readonly classNames: {
|
|
215
|
+
readonly root: "bui-ScrollAreaRoot";
|
|
216
|
+
readonly viewport: "bui-ScrollAreaViewport";
|
|
217
|
+
readonly scrollbar: "bui-ScrollAreaScrollbar";
|
|
218
|
+
readonly thumb: "bui-ScrollAreaThumb";
|
|
219
|
+
};
|
|
220
|
+
};
|
|
221
|
+
readonly SearchField: {
|
|
222
|
+
readonly classNames: {
|
|
223
|
+
readonly root: "bui-SearchField";
|
|
224
|
+
readonly clear: "bui-InputClear";
|
|
225
|
+
};
|
|
226
|
+
};
|
|
227
|
+
readonly Select: {
|
|
228
|
+
readonly classNames: {
|
|
229
|
+
readonly root: "bui-Select";
|
|
230
|
+
readonly trigger: "bui-SelectTrigger";
|
|
231
|
+
readonly value: "bui-SelectValue";
|
|
232
|
+
readonly icon: "bui-SelectIcon";
|
|
233
|
+
readonly list: "bui-SelectList";
|
|
234
|
+
readonly item: "bui-SelectItem";
|
|
235
|
+
readonly itemIndicator: "bui-SelectItemIndicator";
|
|
236
|
+
readonly itemLabel: "bui-SelectItemLabel";
|
|
237
|
+
};
|
|
238
|
+
readonly dataAttributes: {
|
|
239
|
+
readonly size: readonly ["small", "medium"];
|
|
240
|
+
};
|
|
241
|
+
};
|
|
242
|
+
readonly Skeleton: {
|
|
243
|
+
readonly classNames: {
|
|
244
|
+
readonly root: "bui-Skeleton";
|
|
245
|
+
};
|
|
246
|
+
};
|
|
247
|
+
readonly Switch: {
|
|
248
|
+
readonly classNames: {
|
|
249
|
+
readonly root: "bui-Switch";
|
|
250
|
+
readonly indicator: "bui-SwitchIndicator";
|
|
251
|
+
};
|
|
252
|
+
};
|
|
253
|
+
readonly Table: {
|
|
254
|
+
readonly classNames: {
|
|
255
|
+
readonly root: "bui-TableRoot";
|
|
256
|
+
readonly header: "bui-TableHeader";
|
|
257
|
+
readonly body: "bui-TableBody";
|
|
258
|
+
readonly row: "bui-TableRow";
|
|
259
|
+
readonly head: "bui-TableHead";
|
|
260
|
+
readonly caption: "bui-TableCaption";
|
|
261
|
+
readonly cell: "bui-TableCell";
|
|
262
|
+
readonly cellText: "bui-TableCellText";
|
|
263
|
+
readonly cellLink: "bui-TableCellLink";
|
|
264
|
+
readonly cellProfile: "bui-TableCellProfile";
|
|
265
|
+
readonly cellProfileAvatar: "bui-TableCellProfileAvatar";
|
|
266
|
+
readonly cellProfileAvatarImage: "bui-TableCellProfileAvatarImage";
|
|
267
|
+
readonly cellProfileAvatarFallback: "bui-TableCellProfileAvatarFallback";
|
|
268
|
+
readonly cellProfileName: "bui-TableCellProfileName";
|
|
269
|
+
readonly cellProfileLink: "bui-TableCellProfileLink";
|
|
270
|
+
};
|
|
271
|
+
};
|
|
272
|
+
readonly Tabs: {
|
|
273
|
+
readonly classNames: {
|
|
274
|
+
readonly tabs: "bui-Tabs";
|
|
275
|
+
readonly tabList: "bui-TabList";
|
|
276
|
+
readonly tabListWrapper: "bui-TabListWrapper";
|
|
277
|
+
readonly tab: "bui-Tab";
|
|
278
|
+
readonly tabActive: "bui-TabActive";
|
|
279
|
+
readonly tabHovered: "bui-TabHovered";
|
|
280
|
+
readonly panel: "bui-TabPanel";
|
|
281
|
+
};
|
|
282
|
+
};
|
|
283
|
+
readonly Text: {
|
|
284
|
+
readonly classNames: {
|
|
285
|
+
readonly root: "bui-Text";
|
|
286
|
+
};
|
|
287
|
+
readonly dataAttributes: {
|
|
288
|
+
readonly variant: readonly ["subtitle", "body", "caption", "label"];
|
|
289
|
+
readonly weight: readonly ["regular", "bold"];
|
|
290
|
+
readonly color: readonly ["primary", "secondary", "danger", "warning", "success"];
|
|
291
|
+
readonly truncate: readonly [true, false];
|
|
292
|
+
};
|
|
293
|
+
};
|
|
294
|
+
readonly TextField: {
|
|
295
|
+
readonly classNames: {
|
|
296
|
+
readonly root: "bui-TextField";
|
|
297
|
+
readonly inputWrapper: "bui-InputWrapper";
|
|
298
|
+
readonly input: "bui-Input";
|
|
299
|
+
readonly inputIcon: "bui-InputIcon";
|
|
300
|
+
};
|
|
301
|
+
readonly dataAttributes: {
|
|
302
|
+
readonly invalid: readonly [true, false];
|
|
303
|
+
readonly disabled: readonly [true, false];
|
|
304
|
+
};
|
|
305
|
+
};
|
|
306
|
+
readonly Tooltip: {
|
|
307
|
+
readonly classNames: {
|
|
308
|
+
readonly tooltip: "bui-Tooltip";
|
|
309
|
+
readonly arrow: "bui-TooltipArrow";
|
|
310
|
+
};
|
|
311
|
+
};
|
|
312
|
+
};
|
|
313
|
+
|
|
314
|
+
/** @public */
|
|
315
|
+
type AsProps = 'div' | 'span' | 'p' | 'article' | 'section' | 'main' | 'nav' | 'aside' | 'ul' | 'ol' | 'li' | 'details' | 'summary' | 'dd' | 'dl' | 'dt';
|
|
316
|
+
/** @public */
|
|
317
|
+
type Breakpoint = 'initial' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
318
|
+
/** @public */
|
|
319
|
+
type Responsive<T> = T | Partial<Record<Breakpoint, T>>;
|
|
320
|
+
/** @public */
|
|
321
|
+
type Space = '0.5' | '1' | '1.5' | '2' | '3' | '4' | '5' | '6' | '7' | '8' | '9' | '10' | '11' | '12' | '13' | '14' | string;
|
|
322
|
+
/** @public */
|
|
323
|
+
type Display = 'none' | 'flex' | 'block' | 'inline';
|
|
324
|
+
/** @public */
|
|
325
|
+
type FlexDirection = 'row' | 'column';
|
|
326
|
+
/** @public */
|
|
327
|
+
type FlexWrap = 'wrap' | 'nowrap' | 'wrap-reverse';
|
|
328
|
+
/** @public */
|
|
329
|
+
type JustifyContent = 'stretch' | 'start' | 'center' | 'end' | 'around' | 'between';
|
|
330
|
+
/** @public */
|
|
331
|
+
type AlignItems = 'stretch' | 'start' | 'center' | 'end';
|
|
332
|
+
/** @public */
|
|
333
|
+
type BorderRadius = 'none' | '2xs' | 'xs' | 'sm' | 'md' | 'lg' | 'xl' | '2xl';
|
|
334
|
+
/** @public */
|
|
335
|
+
type Border = 'none' | 'base' | 'error' | 'warning' | 'selected';
|
|
336
|
+
/** @public */
|
|
337
|
+
type Columns = 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12 | 'auto';
|
|
338
|
+
/** @public */
|
|
339
|
+
interface SpaceProps {
|
|
340
|
+
m?: Responsive<Space>;
|
|
341
|
+
mb?: Responsive<Space>;
|
|
342
|
+
ml?: Responsive<Space>;
|
|
343
|
+
mr?: Responsive<Space>;
|
|
344
|
+
mt?: Responsive<Space>;
|
|
345
|
+
mx?: Responsive<Space>;
|
|
346
|
+
my?: Responsive<Space>;
|
|
347
|
+
p?: Responsive<Space>;
|
|
348
|
+
pb?: Responsive<Space>;
|
|
349
|
+
pl?: Responsive<Space>;
|
|
350
|
+
pr?: Responsive<Space>;
|
|
351
|
+
pt?: Responsive<Space>;
|
|
352
|
+
px?: Responsive<Space>;
|
|
353
|
+
py?: Responsive<Space>;
|
|
354
|
+
}
|
|
355
|
+
/** @public */
|
|
356
|
+
interface UtilityProps extends SpaceProps {
|
|
357
|
+
alignItems?: Responsive<AlignItems>;
|
|
358
|
+
border?: Responsive<Border>;
|
|
359
|
+
borderRadius?: Responsive<BorderRadius>;
|
|
360
|
+
colEnd?: Responsive<Columns | 'auto'>;
|
|
361
|
+
colSpan?: Responsive<Columns | 'full'>;
|
|
362
|
+
colStart?: Responsive<Columns | 'auto'>;
|
|
363
|
+
columns?: Responsive<Columns>;
|
|
364
|
+
display?: Responsive<Display>;
|
|
365
|
+
flexDirection?: Responsive<FlexDirection>;
|
|
366
|
+
flexWrap?: Responsive<FlexWrap>;
|
|
367
|
+
gap?: Responsive<Space>;
|
|
368
|
+
justifyContent?: Responsive<JustifyContent>;
|
|
369
|
+
rowSpan?: Responsive<Columns | 'full'>;
|
|
370
|
+
}
|
|
371
|
+
/**
|
|
372
|
+
* Base type for the component styles structure
|
|
373
|
+
* @public
|
|
374
|
+
*/
|
|
375
|
+
type ClassNamesMap = Record<string, string>;
|
|
376
|
+
/**
|
|
377
|
+
* Base type for the component styles structure
|
|
378
|
+
* @public
|
|
379
|
+
*/
|
|
380
|
+
type DataAttributeValues = readonly (string | number | boolean)[];
|
|
381
|
+
/**
|
|
382
|
+
* Base type for the component styles structure
|
|
383
|
+
* @public
|
|
384
|
+
*/
|
|
385
|
+
type DataAttributesMap = Record<string, DataAttributeValues>;
|
|
386
|
+
/**
|
|
387
|
+
* Base type for the component styles structure
|
|
388
|
+
* @public
|
|
389
|
+
*/
|
|
390
|
+
interface ComponentDefinition {
|
|
391
|
+
classNames: ClassNamesMap;
|
|
392
|
+
dataAttributes?: DataAttributesMap;
|
|
393
|
+
}
|
|
394
|
+
/**
|
|
395
|
+
* Type utilities for extracting information from the component styles
|
|
396
|
+
* @public
|
|
397
|
+
*/
|
|
398
|
+
type ComponentDefinitionName = keyof typeof componentDefinitions;
|
|
399
|
+
/**
|
|
400
|
+
* Helper type to extract class names for a component
|
|
401
|
+
* @public
|
|
402
|
+
*/
|
|
403
|
+
type ComponentClassNames<T extends ComponentDefinitionName> = (typeof componentDefinitions)[T]['classNames'];
|
|
404
|
+
|
|
405
|
+
/** @public */
|
|
406
|
+
declare const breakpoints: Breakpoint[];
|
|
407
|
+
/** @public */
|
|
408
|
+
type BooleanPropDef = {
|
|
409
|
+
type: 'boolean';
|
|
410
|
+
default?: boolean;
|
|
411
|
+
required?: boolean;
|
|
412
|
+
className?: string;
|
|
413
|
+
};
|
|
414
|
+
/** @public */
|
|
415
|
+
type StringPropDef = {
|
|
416
|
+
type: 'string';
|
|
417
|
+
default?: string;
|
|
418
|
+
required?: boolean;
|
|
419
|
+
};
|
|
420
|
+
/** @public */
|
|
421
|
+
type ReactNodePropDef = {
|
|
422
|
+
type: 'ReactNode';
|
|
423
|
+
default?: ReactNode;
|
|
424
|
+
required?: boolean;
|
|
425
|
+
};
|
|
426
|
+
/** @public */
|
|
427
|
+
type EnumPropDef<T> = {
|
|
428
|
+
type: 'enum';
|
|
429
|
+
values: readonly T[];
|
|
430
|
+
default?: T;
|
|
431
|
+
required?: boolean;
|
|
432
|
+
};
|
|
433
|
+
/** @public */
|
|
434
|
+
type EnumOrStringPropDef<T> = {
|
|
435
|
+
type: 'enum | string';
|
|
436
|
+
values: readonly T[];
|
|
437
|
+
default?: T | string;
|
|
438
|
+
required?: boolean;
|
|
439
|
+
};
|
|
440
|
+
/** @public */
|
|
441
|
+
type NonStylingPropDef = {
|
|
442
|
+
className?: never;
|
|
443
|
+
customProperties?: never;
|
|
444
|
+
parseValue?: never;
|
|
445
|
+
};
|
|
446
|
+
/** @public */
|
|
447
|
+
type StylingPropDef = {
|
|
448
|
+
className: string;
|
|
449
|
+
parseValue?: (value: string) => string | undefined;
|
|
450
|
+
};
|
|
451
|
+
/** @public */
|
|
452
|
+
type ArbitraryStylingPropDef = {
|
|
453
|
+
className: string;
|
|
454
|
+
customProperties: `--${string}`[];
|
|
455
|
+
parseValue?: (value: string) => string | undefined;
|
|
456
|
+
};
|
|
457
|
+
/** @public */
|
|
458
|
+
type RegularPropDef<T> = ReactNodePropDef | BooleanPropDef | (StringPropDef & ArbitraryStylingPropDef) | (StringPropDef & NonStylingPropDef) | (EnumPropDef<T> & StylingPropDef) | (EnumPropDef<T> & NonStylingPropDef) | (EnumOrStringPropDef<T> & ArbitraryStylingPropDef) | (EnumOrStringPropDef<T> & NonStylingPropDef);
|
|
459
|
+
/** @public */
|
|
460
|
+
type ResponsivePropDef<T = any> = RegularPropDef<T> & {
|
|
461
|
+
responsive: true;
|
|
462
|
+
};
|
|
463
|
+
/** @public */
|
|
464
|
+
type PropDef<T = any> = RegularPropDef<T> | ResponsivePropDef<T>;
|
|
465
|
+
/** @public */
|
|
466
|
+
type GetPropDefType<Def> = Def extends BooleanPropDef ? Def extends ResponsivePropDef ? Responsive<boolean> : boolean : Def extends StringPropDef ? Def extends ResponsivePropDef ? Responsive<string> : string : Def extends ReactNodePropDef ? Def extends ResponsivePropDef ? Responsive<ReactNode> : ReactNode : Def extends EnumOrStringPropDef<infer Type> ? Def extends ResponsivePropDef<infer Type extends string> ? Responsive<string | Type> : string | Type : Def extends EnumPropDef<infer Type> ? Def extends ResponsivePropDef<infer Type> ? Responsive<Type> : Type : never;
|
|
467
|
+
/** @public */
|
|
468
|
+
type GetPropDefTypes<P> = {
|
|
469
|
+
[K in keyof P]?: GetPropDefType<P[K]>;
|
|
470
|
+
};
|
|
471
|
+
|
|
472
|
+
/** @public */
|
|
473
|
+
declare const heightPropDefs: {
|
|
474
|
+
height: {
|
|
475
|
+
type: "string";
|
|
476
|
+
className: string;
|
|
477
|
+
customProperties: "--height"[];
|
|
478
|
+
responsive: true;
|
|
479
|
+
};
|
|
480
|
+
minHeight: {
|
|
481
|
+
type: "string";
|
|
482
|
+
className: string;
|
|
483
|
+
customProperties: "--min-height"[];
|
|
484
|
+
responsive: true;
|
|
485
|
+
};
|
|
486
|
+
maxHeight: {
|
|
487
|
+
type: "string";
|
|
488
|
+
className: string;
|
|
489
|
+
customProperties: "--max-height"[];
|
|
490
|
+
responsive: true;
|
|
491
|
+
};
|
|
492
|
+
};
|
|
493
|
+
/** @public */
|
|
494
|
+
type HeightProps = GetPropDefTypes<typeof heightPropDefs>;
|
|
495
|
+
|
|
496
|
+
/** @public */
|
|
497
|
+
declare const widthPropDefs: {
|
|
498
|
+
width: {
|
|
499
|
+
type: "string";
|
|
500
|
+
className: string;
|
|
501
|
+
customProperties: "--width"[];
|
|
502
|
+
responsive: true;
|
|
503
|
+
};
|
|
504
|
+
minWidth: {
|
|
505
|
+
type: "string";
|
|
506
|
+
className: string;
|
|
507
|
+
customProperties: "--min-width"[];
|
|
508
|
+
responsive: true;
|
|
509
|
+
};
|
|
510
|
+
maxWidth: {
|
|
511
|
+
type: "string";
|
|
512
|
+
className: string;
|
|
513
|
+
customProperties: "--max-width"[];
|
|
514
|
+
responsive: true;
|
|
515
|
+
};
|
|
516
|
+
};
|
|
517
|
+
/** @public */
|
|
518
|
+
type WidthProps = GetPropDefTypes<typeof widthPropDefs>;
|
|
519
|
+
|
|
520
|
+
/** @public */
|
|
521
|
+
declare const positionPropDefs: {
|
|
522
|
+
position: {
|
|
523
|
+
type: "enum";
|
|
524
|
+
className: string;
|
|
525
|
+
values: readonly ["static", "relative", "absolute", "fixed", "sticky"];
|
|
526
|
+
responsive: true;
|
|
527
|
+
};
|
|
528
|
+
};
|
|
529
|
+
/** @public */
|
|
530
|
+
type PositionProps = GetPropDefTypes<typeof positionPropDefs>;
|
|
531
|
+
|
|
532
|
+
/** @public */
|
|
533
|
+
declare const displayPropDefs: {
|
|
534
|
+
display: {
|
|
535
|
+
type: "enum";
|
|
536
|
+
className: string;
|
|
537
|
+
values: readonly ["none", "inline", "inline-block", "block"];
|
|
538
|
+
responsive: true;
|
|
539
|
+
};
|
|
540
|
+
};
|
|
541
|
+
/** @public */
|
|
542
|
+
type DisplayProps = GetPropDefTypes<typeof displayPropDefs>;
|
|
543
|
+
|
|
544
|
+
/** @public */
|
|
545
|
+
declare const boxPropDefs: {
|
|
546
|
+
as: {
|
|
547
|
+
type: "enum";
|
|
548
|
+
values: readonly ["div", "span"];
|
|
549
|
+
default: "div";
|
|
550
|
+
};
|
|
551
|
+
};
|
|
552
|
+
/** @public */
|
|
553
|
+
type BoxOwnProps = GetPropDefTypes<typeof boxPropDefs>;
|
|
554
|
+
|
|
555
|
+
/** @public */
|
|
556
|
+
interface BoxProps extends SpaceProps {
|
|
557
|
+
display?: DisplayProps['display'];
|
|
558
|
+
as?: BoxOwnProps['as'];
|
|
559
|
+
width?: WidthProps['width'];
|
|
560
|
+
minWidth?: WidthProps['minWidth'];
|
|
561
|
+
maxWidth?: WidthProps['maxWidth'];
|
|
562
|
+
height?: HeightProps['height'];
|
|
563
|
+
minHeight?: HeightProps['minHeight'];
|
|
564
|
+
maxHeight?: HeightProps['maxHeight'];
|
|
565
|
+
position?: PositionProps['position'];
|
|
566
|
+
children?: React.ReactNode;
|
|
567
|
+
className?: string;
|
|
568
|
+
style?: React.CSSProperties;
|
|
569
|
+
}
|
|
570
|
+
|
|
571
|
+
/** @public */
|
|
572
|
+
declare const Box: react.ForwardRefExoticComponent<BoxProps & react.RefAttributes<HTMLDivElement>>;
|
|
573
|
+
|
|
574
|
+
/** @public */
|
|
575
|
+
declare const gapPropDefs: {
|
|
576
|
+
gap: {
|
|
577
|
+
type: "enum | string";
|
|
578
|
+
className: string;
|
|
579
|
+
customProperties: "--gap"[];
|
|
580
|
+
values: string[];
|
|
581
|
+
responsive: true;
|
|
582
|
+
default: string;
|
|
583
|
+
};
|
|
584
|
+
};
|
|
585
|
+
/** @public */
|
|
586
|
+
type GapProps = GetPropDefTypes<typeof gapPropDefs>;
|
|
587
|
+
|
|
588
|
+
/** @public */
|
|
589
|
+
declare const gridPropDefs: {
|
|
590
|
+
columns: {
|
|
591
|
+
type: "enum | string";
|
|
592
|
+
className: string;
|
|
593
|
+
customProperties: "--columns"[];
|
|
594
|
+
values: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "auto"];
|
|
595
|
+
responsive: true;
|
|
596
|
+
default: string;
|
|
597
|
+
};
|
|
598
|
+
};
|
|
599
|
+
/** @public */
|
|
600
|
+
declare const gridItemPropDefs: {
|
|
601
|
+
colSpan: {
|
|
602
|
+
type: "enum | string";
|
|
603
|
+
className: string;
|
|
604
|
+
customProperties: "--col-span"[];
|
|
605
|
+
values: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "auto"];
|
|
606
|
+
responsive: true;
|
|
607
|
+
};
|
|
608
|
+
colEnd: {
|
|
609
|
+
type: "enum | string";
|
|
610
|
+
className: string;
|
|
611
|
+
customProperties: "--col-end"[];
|
|
612
|
+
values: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "auto"];
|
|
613
|
+
responsive: true;
|
|
614
|
+
};
|
|
615
|
+
colStart: {
|
|
616
|
+
type: "enum | string";
|
|
617
|
+
className: string;
|
|
618
|
+
customProperties: "--col-start"[];
|
|
619
|
+
values: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "auto"];
|
|
620
|
+
responsive: true;
|
|
621
|
+
};
|
|
622
|
+
rowSpan: {
|
|
623
|
+
type: "enum | string";
|
|
624
|
+
className: string;
|
|
625
|
+
customProperties: "--row-span"[];
|
|
626
|
+
values: readonly ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "auto"];
|
|
627
|
+
responsive: true;
|
|
628
|
+
};
|
|
629
|
+
};
|
|
630
|
+
/** @public */
|
|
631
|
+
type GridOwnProps = GetPropDefTypes<typeof gridPropDefs>;
|
|
632
|
+
/** @public */
|
|
633
|
+
type GridItemOwnProps = GetPropDefTypes<typeof gridItemPropDefs>;
|
|
634
|
+
|
|
635
|
+
/** @public */
|
|
636
|
+
interface GridProps extends SpaceProps {
|
|
637
|
+
children?: React.ReactNode;
|
|
638
|
+
className?: string;
|
|
639
|
+
columns?: GridOwnProps['columns'];
|
|
640
|
+
gap?: GapProps['gap'];
|
|
641
|
+
style?: React.CSSProperties;
|
|
642
|
+
}
|
|
643
|
+
/** @public */
|
|
644
|
+
interface GridItemProps {
|
|
645
|
+
children?: React.ReactNode;
|
|
646
|
+
className?: string;
|
|
647
|
+
colSpan?: GridItemOwnProps['colSpan'];
|
|
648
|
+
colEnd?: GridItemOwnProps['colEnd'];
|
|
649
|
+
colStart?: GridItemOwnProps['colStart'];
|
|
650
|
+
rowSpan?: GridItemOwnProps['rowSpan'];
|
|
651
|
+
style?: React.CSSProperties;
|
|
652
|
+
}
|
|
653
|
+
|
|
654
|
+
/** @public */
|
|
655
|
+
declare const Grid: {
|
|
656
|
+
Root: react.ForwardRefExoticComponent<GridProps & react.RefAttributes<HTMLDivElement>>;
|
|
657
|
+
Item: react.ForwardRefExoticComponent<GridItemProps & react.RefAttributes<HTMLDivElement>>;
|
|
658
|
+
};
|
|
659
|
+
|
|
660
|
+
/** @public */
|
|
661
|
+
declare const flexPropDefs: {
|
|
662
|
+
align: {
|
|
663
|
+
type: "enum";
|
|
664
|
+
className: string;
|
|
665
|
+
values: readonly ["start", "center", "end", "baseline", "stretch"];
|
|
666
|
+
responsive: true;
|
|
667
|
+
};
|
|
668
|
+
direction: {
|
|
669
|
+
type: "enum";
|
|
670
|
+
className: string;
|
|
671
|
+
values: readonly ["row", "column", "row-reverse", "column-reverse"];
|
|
672
|
+
responsive: true;
|
|
673
|
+
};
|
|
674
|
+
justify: {
|
|
675
|
+
type: "enum";
|
|
676
|
+
className: string;
|
|
677
|
+
values: readonly ["start", "center", "end", "between"];
|
|
678
|
+
responsive: true;
|
|
679
|
+
};
|
|
680
|
+
};
|
|
681
|
+
/** @public */
|
|
682
|
+
type FlexOwnProps = GetPropDefTypes<typeof flexPropDefs>;
|
|
683
|
+
|
|
684
|
+
/** @public */
|
|
685
|
+
interface FlexProps extends SpaceProps {
|
|
686
|
+
children: React.ReactNode;
|
|
687
|
+
gap?: GapProps['gap'];
|
|
688
|
+
align?: FlexOwnProps['align'];
|
|
689
|
+
justify?: FlexOwnProps['justify'];
|
|
690
|
+
direction?: FlexOwnProps['direction'];
|
|
691
|
+
className?: string;
|
|
692
|
+
style?: React.CSSProperties;
|
|
693
|
+
}
|
|
694
|
+
|
|
695
|
+
/** @public */
|
|
696
|
+
declare const Flex: react.ForwardRefExoticComponent<FlexProps & react.RefAttributes<HTMLDivElement>>;
|
|
697
|
+
|
|
698
|
+
/** @public */
|
|
699
|
+
interface ContainerProps {
|
|
700
|
+
children?: React.ReactNode;
|
|
701
|
+
className?: string;
|
|
702
|
+
my?: SpaceProps['my'];
|
|
703
|
+
mb?: SpaceProps['mb'];
|
|
704
|
+
mt?: SpaceProps['mt'];
|
|
705
|
+
py?: SpaceProps['py'];
|
|
706
|
+
pb?: SpaceProps['pb'];
|
|
707
|
+
pt?: SpaceProps['pt'];
|
|
708
|
+
style?: React.CSSProperties;
|
|
709
|
+
}
|
|
710
|
+
|
|
711
|
+
/** @public */
|
|
712
|
+
declare const Container: react.ForwardRefExoticComponent<ContainerProps & react.RefAttributes<HTMLDivElement>>;
|
|
713
|
+
|
|
714
|
+
/** @public */
|
|
715
|
+
type TextOwnProps = {
|
|
716
|
+
as?: 'p' | 'span' | 'label';
|
|
717
|
+
variant?: 'subtitle' | 'body' | 'caption' | 'label' | Partial<Record<Breakpoint, 'subtitle' | 'body' | 'caption' | 'label'>>;
|
|
718
|
+
weight?: 'regular' | 'bold' | Partial<Record<Breakpoint, 'regular' | 'bold'>>;
|
|
719
|
+
color?: 'primary' | 'secondary' | 'danger' | 'warning' | 'success' | Partial<Record<Breakpoint, 'primary' | 'secondary' | 'danger' | 'warning' | 'success'>>;
|
|
720
|
+
truncate?: boolean;
|
|
721
|
+
className?: string;
|
|
722
|
+
style?: React.CSSProperties;
|
|
723
|
+
};
|
|
724
|
+
/** @public */
|
|
725
|
+
type TextProps<T extends ElementType = 'p'> = TextOwnProps & Omit<ComponentPropsWithRef<T>, keyof TextOwnProps>;
|
|
726
|
+
|
|
727
|
+
/** @public */
|
|
728
|
+
declare const Text: {
|
|
729
|
+
<T extends ElementType = "p">(props: TextProps<T> & {
|
|
730
|
+
ref?: React.ComponentPropsWithRef<T>["ref"];
|
|
731
|
+
}): React.ReactElement<TextProps<T>, T>;
|
|
732
|
+
displayName: string;
|
|
733
|
+
};
|
|
734
|
+
|
|
735
|
+
/** @public */
|
|
736
|
+
type HeadingOwnProps = {
|
|
737
|
+
as?: 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
|
|
738
|
+
variant?: 'display' | 'title1' | 'title2' | 'title3' | 'title4' | 'title5' | Partial<Record<Breakpoint, 'display' | 'title1' | 'title2' | 'title3' | 'title4' | 'title5'>>;
|
|
739
|
+
color?: 'primary' | 'secondary' | Partial<Record<Breakpoint, 'primary' | 'secondary'>>;
|
|
740
|
+
truncate?: boolean;
|
|
741
|
+
className?: string;
|
|
742
|
+
style?: React.CSSProperties;
|
|
743
|
+
};
|
|
744
|
+
/** @public */
|
|
745
|
+
type HeadingProps<T extends ElementType = 'h1'> = HeadingOwnProps & Omit<ComponentPropsWithRef<T>, keyof HeadingOwnProps>;
|
|
746
|
+
|
|
747
|
+
/** @public */
|
|
748
|
+
declare const Heading: {
|
|
749
|
+
<T extends ElementType = "h1">(props: HeadingProps<T> & {
|
|
750
|
+
ref?: React.ComponentPropsWithRef<T>["ref"];
|
|
751
|
+
}): React.ReactElement<HeadingProps<T>, T>;
|
|
752
|
+
displayName: string;
|
|
753
|
+
};
|
|
754
|
+
|
|
755
|
+
/** @public */
|
|
756
|
+
interface AvatarProps extends React.ComponentPropsWithoutRef<typeof Avatar$1.Root> {
|
|
757
|
+
src: string;
|
|
758
|
+
name: string;
|
|
759
|
+
size?: 'small' | 'medium' | 'large';
|
|
760
|
+
}
|
|
761
|
+
|
|
762
|
+
/** @public */
|
|
763
|
+
declare const Avatar: react.ForwardRefExoticComponent<AvatarProps & react.RefAttributes<HTMLSpanElement>>;
|
|
764
|
+
|
|
765
|
+
/**
|
|
766
|
+
* Properties for {@link Button}
|
|
767
|
+
*
|
|
768
|
+
* @public
|
|
769
|
+
*/
|
|
770
|
+
interface ButtonProps extends ButtonProps$1 {
|
|
771
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
772
|
+
variant?: 'primary' | 'secondary' | 'tertiary' | Partial<Record<Breakpoint, 'primary' | 'secondary' | 'tertiary'>>;
|
|
773
|
+
iconStart?: ReactElement;
|
|
774
|
+
iconEnd?: ReactElement;
|
|
775
|
+
children?: ReactNode;
|
|
776
|
+
}
|
|
777
|
+
|
|
778
|
+
/** @public */
|
|
779
|
+
declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLButtonElement>>;
|
|
780
|
+
|
|
781
|
+
/**
|
|
782
|
+
* Props for the Card component.
|
|
783
|
+
*
|
|
784
|
+
* @public
|
|
785
|
+
*/
|
|
786
|
+
interface CardProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
787
|
+
children?: React.ReactNode;
|
|
788
|
+
}
|
|
789
|
+
/**
|
|
790
|
+
* Props for the CardHeader component.
|
|
791
|
+
*
|
|
792
|
+
* @public
|
|
793
|
+
*/
|
|
794
|
+
interface CardHeaderProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
795
|
+
children?: React.ReactNode;
|
|
796
|
+
}
|
|
797
|
+
/**
|
|
798
|
+
* Props for the CardBody component.
|
|
799
|
+
*
|
|
800
|
+
* @public
|
|
801
|
+
*/
|
|
802
|
+
interface CardBodyProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
803
|
+
children?: React.ReactNode;
|
|
804
|
+
}
|
|
805
|
+
/**
|
|
806
|
+
* Props for the CardFooter component.
|
|
807
|
+
*
|
|
808
|
+
* @public
|
|
809
|
+
*/
|
|
810
|
+
interface CardFooterProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
811
|
+
children?: React.ReactNode;
|
|
812
|
+
}
|
|
813
|
+
|
|
814
|
+
/**
|
|
815
|
+
* Card component.
|
|
816
|
+
*
|
|
817
|
+
* @public
|
|
818
|
+
*/
|
|
819
|
+
declare const Card: react.ForwardRefExoticComponent<CardProps & react.RefAttributes<HTMLDivElement>>;
|
|
820
|
+
|
|
821
|
+
/**
|
|
822
|
+
* Collapsible is a component that allows you to collapse and expand content.
|
|
823
|
+
* It is a wrapper around the CollapsiblePrimitive component from base-ui-components.
|
|
824
|
+
*
|
|
825
|
+
* @public
|
|
826
|
+
*/
|
|
827
|
+
declare const Collapsible: {
|
|
828
|
+
Root: react.ForwardRefExoticComponent<Omit<Collapsible$1.Root.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
829
|
+
Trigger: react.ForwardRefExoticComponent<Omit<Collapsible$1.Trigger.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
830
|
+
Panel: react.ForwardRefExoticComponent<Omit<Collapsible$1.Panel.Props & react.RefAttributes<HTMLButtonElement>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
831
|
+
};
|
|
832
|
+
|
|
833
|
+
/**
|
|
834
|
+
* Table component for displaying tabular data
|
|
835
|
+
* @public
|
|
836
|
+
*/
|
|
837
|
+
declare const Table: {
|
|
838
|
+
Root: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>>;
|
|
839
|
+
Header: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
840
|
+
Body: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
841
|
+
Head: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
842
|
+
Row: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
843
|
+
Cell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
844
|
+
CellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
|
|
845
|
+
CellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
|
|
846
|
+
CellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
|
|
847
|
+
Caption: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableCaptionElement> & react.RefAttributes<HTMLTableCaptionElement>>;
|
|
848
|
+
};
|
|
849
|
+
|
|
850
|
+
/** @public */
|
|
851
|
+
interface TableCellTextProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
852
|
+
title: string;
|
|
853
|
+
description?: string;
|
|
854
|
+
}
|
|
855
|
+
|
|
856
|
+
/** @public */
|
|
857
|
+
interface TableCellLinkProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
858
|
+
title: string;
|
|
859
|
+
description?: string;
|
|
860
|
+
href: string;
|
|
861
|
+
render?: useRender.ComponentProps<'a'>['render'];
|
|
862
|
+
}
|
|
863
|
+
|
|
864
|
+
/** @public */
|
|
865
|
+
interface TableCellProfileProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
866
|
+
src?: string;
|
|
867
|
+
name?: string;
|
|
868
|
+
to?: string;
|
|
869
|
+
withImage?: boolean;
|
|
870
|
+
}
|
|
871
|
+
|
|
872
|
+
/**
|
|
873
|
+
* DataTable component for displaying tabular data with pagination
|
|
874
|
+
* @public
|
|
875
|
+
*/
|
|
876
|
+
declare const DataTable: {
|
|
877
|
+
Root: <TData>(props: {
|
|
878
|
+
table: Table$1<TData>;
|
|
879
|
+
} & React.HTMLAttributes<HTMLDivElement>) => JSX.Element;
|
|
880
|
+
Pagination: react.ForwardRefExoticComponent<DataTablePaginationProps & react.RefAttributes<HTMLDivElement>>;
|
|
881
|
+
Table: react.ForwardRefExoticComponent<DataTableTableProps & react.RefAttributes<HTMLTableElement>>;
|
|
882
|
+
TableRoot: react.ForwardRefExoticComponent<Omit<react.HTMLAttributes<HTMLTableElement> & react.RefAttributes<HTMLTableElement>, "ref"> & react.RefAttributes<HTMLTableElement>>;
|
|
883
|
+
TableHeader: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
884
|
+
TableBody: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableSectionElement> & react.RefAttributes<HTMLTableSectionElement>>;
|
|
885
|
+
TableRow: react.ForwardRefExoticComponent<react.HTMLAttributes<HTMLTableRowElement> & react.RefAttributes<HTMLTableRowElement>>;
|
|
886
|
+
TableCell: react.ForwardRefExoticComponent<react.TdHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
887
|
+
TableCellText: react.ForwardRefExoticComponent<TableCellTextProps & react.RefAttributes<HTMLDivElement>>;
|
|
888
|
+
TableCellLink: react.ForwardRefExoticComponent<TableCellLinkProps & react.RefAttributes<HTMLDivElement>>;
|
|
889
|
+
TableCellProfile: react.ForwardRefExoticComponent<TableCellProfileProps & react.RefAttributes<HTMLDivElement>>;
|
|
890
|
+
TableHead: react.ForwardRefExoticComponent<react.ThHTMLAttributes<HTMLTableCellElement> & react.RefAttributes<HTMLTableCellElement>>;
|
|
891
|
+
};
|
|
892
|
+
|
|
893
|
+
/** @public */
|
|
894
|
+
interface DataTableRootProps<TData> extends React.HTMLAttributes<HTMLDivElement> {
|
|
895
|
+
/**
|
|
896
|
+
* The table instance.
|
|
897
|
+
*/
|
|
898
|
+
table: Table$1<TData>;
|
|
899
|
+
}
|
|
900
|
+
|
|
901
|
+
/** @public */
|
|
902
|
+
interface DataTablePaginationProps extends React.HTMLAttributes<HTMLDivElement> {
|
|
903
|
+
}
|
|
904
|
+
|
|
905
|
+
/** @public */
|
|
906
|
+
interface DataTableTableProps extends React.HTMLAttributes<HTMLTableElement> {
|
|
907
|
+
}
|
|
908
|
+
|
|
909
|
+
/** @public */
|
|
910
|
+
interface FieldLabelProps {
|
|
911
|
+
/**
|
|
912
|
+
* The label of the text field
|
|
913
|
+
*/
|
|
914
|
+
label?: string | null;
|
|
915
|
+
/**
|
|
916
|
+
* The secondary label of the text field
|
|
917
|
+
*/
|
|
918
|
+
secondaryLabel?: string | null;
|
|
919
|
+
/**
|
|
920
|
+
* The description of the text field
|
|
921
|
+
*/
|
|
922
|
+
description?: string | null;
|
|
923
|
+
/**
|
|
924
|
+
* The HTML for attribute of the text field
|
|
925
|
+
*/
|
|
926
|
+
htmlFor?: string;
|
|
927
|
+
/**
|
|
928
|
+
* The id of the text field
|
|
929
|
+
*/
|
|
930
|
+
id?: string;
|
|
931
|
+
}
|
|
932
|
+
|
|
933
|
+
/** @public */
|
|
934
|
+
declare const FieldLabel: react.ForwardRefExoticComponent<FieldLabelProps & react.RefAttributes<HTMLDivElement>>;
|
|
935
|
+
|
|
936
|
+
/**
|
|
937
|
+
* Props for the main Header component.
|
|
938
|
+
*
|
|
939
|
+
* @public
|
|
940
|
+
*/
|
|
941
|
+
interface HeaderProps {
|
|
942
|
+
icon?: React.ReactNode;
|
|
943
|
+
title?: string;
|
|
944
|
+
breadcrumbs?: HeaderBreadcrumb[];
|
|
945
|
+
customActions?: React.ReactNode;
|
|
946
|
+
menuItems?: HeaderMenuItem[];
|
|
947
|
+
tabs?: HeaderTab[];
|
|
948
|
+
}
|
|
949
|
+
/**
|
|
950
|
+
* Represents a tab item in the header navigation.
|
|
951
|
+
*
|
|
952
|
+
* @public
|
|
953
|
+
*/
|
|
954
|
+
interface HeaderTab {
|
|
955
|
+
id: string;
|
|
956
|
+
label: string;
|
|
957
|
+
href?: string;
|
|
958
|
+
}
|
|
959
|
+
/**
|
|
960
|
+
* Represents an option item in the header dropdown menu.
|
|
961
|
+
*
|
|
962
|
+
* @public
|
|
963
|
+
*/
|
|
964
|
+
interface HeaderMenuItem {
|
|
965
|
+
label: string;
|
|
966
|
+
value: string;
|
|
967
|
+
onClick?: () => void;
|
|
968
|
+
}
|
|
969
|
+
/**
|
|
970
|
+
* Represents a breadcrumb item in the header.
|
|
971
|
+
*
|
|
972
|
+
* @public
|
|
973
|
+
*/
|
|
974
|
+
interface HeaderBreadcrumb {
|
|
975
|
+
label: string;
|
|
976
|
+
href: string;
|
|
977
|
+
}
|
|
978
|
+
|
|
979
|
+
declare module 'react-aria-components' {
|
|
980
|
+
interface RouterConfig {
|
|
981
|
+
routerOptions: NavigateOptions;
|
|
982
|
+
}
|
|
983
|
+
}
|
|
984
|
+
/**
|
|
985
|
+
* A component that renders a toolbar.
|
|
986
|
+
*
|
|
987
|
+
* @public
|
|
988
|
+
*/
|
|
989
|
+
declare const Header: (props: HeaderProps) => react_jsx_runtime.JSX.Element;
|
|
990
|
+
|
|
991
|
+
/**
|
|
992
|
+
* Props for the main HeaderPage component.
|
|
993
|
+
*
|
|
994
|
+
* @public
|
|
995
|
+
*/
|
|
996
|
+
interface HeaderPageProps {
|
|
997
|
+
title?: string;
|
|
998
|
+
customActions?: React.ReactNode;
|
|
999
|
+
menuItems?: HeaderMenuItem[];
|
|
1000
|
+
tabs?: HeaderTab[];
|
|
1001
|
+
}
|
|
1002
|
+
|
|
1003
|
+
/**
|
|
1004
|
+
* A component that renders a header page.
|
|
1005
|
+
*
|
|
1006
|
+
* @public
|
|
1007
|
+
*/
|
|
1008
|
+
declare const HeaderPage: (props: HeaderPageProps) => react_jsx_runtime.JSX.Element;
|
|
1009
|
+
|
|
1010
|
+
/** @public */
|
|
1011
|
+
declare const icons: IconMap;
|
|
1012
|
+
|
|
1013
|
+
/** @public */
|
|
1014
|
+
declare const Icon: (props: IconProps) => react_jsx_runtime.JSX.Element | null;
|
|
1015
|
+
|
|
1016
|
+
/** @public */
|
|
1017
|
+
declare const IconProvider: (props: IconProviderProps) => react_jsx_runtime.JSX.Element;
|
|
1018
|
+
|
|
1019
|
+
/**
|
|
1020
|
+
* Properties for {@link ButtonIcon}
|
|
1021
|
+
*
|
|
1022
|
+
* @public
|
|
1023
|
+
*/
|
|
1024
|
+
interface ButtonIconProps extends ButtonProps$1 {
|
|
1025
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
1026
|
+
variant?: 'primary' | 'secondary' | 'tertiary' | Partial<Record<Breakpoint, 'primary' | 'secondary' | 'tertiary'>>;
|
|
1027
|
+
icon?: ReactElement;
|
|
1028
|
+
}
|
|
1029
|
+
|
|
1030
|
+
/** @public */
|
|
1031
|
+
declare const ButtonIcon: react.ForwardRefExoticComponent<ButtonIconProps & react.RefAttributes<HTMLButtonElement>>;
|
|
1032
|
+
|
|
1033
|
+
/**
|
|
1034
|
+
* Properties for {@link ButtonLink}
|
|
1035
|
+
*
|
|
1036
|
+
* @public
|
|
1037
|
+
*/
|
|
1038
|
+
interface ButtonLinkProps extends LinkProps$1 {
|
|
1039
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
1040
|
+
variant?: 'primary' | 'secondary' | 'tertiary' | Partial<Record<Breakpoint, 'primary' | 'secondary' | 'tertiary'>>;
|
|
1041
|
+
iconStart?: ReactElement;
|
|
1042
|
+
iconEnd?: ReactElement;
|
|
1043
|
+
children?: ReactNode;
|
|
1044
|
+
}
|
|
1045
|
+
|
|
1046
|
+
/** @public */
|
|
1047
|
+
declare const ButtonLink: react.ForwardRefExoticComponent<ButtonLinkProps & react.RefAttributes<HTMLAnchorElement>>;
|
|
1048
|
+
|
|
1049
|
+
/** @public */
|
|
1050
|
+
interface CheckboxProps {
|
|
1051
|
+
label?: string;
|
|
1052
|
+
defaultChecked?: boolean;
|
|
1053
|
+
checked?: boolean;
|
|
1054
|
+
onChange?: (checked: boolean) => void;
|
|
1055
|
+
disabled?: boolean;
|
|
1056
|
+
required?: boolean;
|
|
1057
|
+
className?: string;
|
|
1058
|
+
name?: string;
|
|
1059
|
+
value?: string;
|
|
1060
|
+
style?: React.CSSProperties;
|
|
1061
|
+
}
|
|
1062
|
+
|
|
1063
|
+
/** @public */
|
|
1064
|
+
declare const Checkbox: react.ForwardRefExoticComponent<CheckboxProps & react.RefAttributes<HTMLButtonElement>>;
|
|
1065
|
+
|
|
1066
|
+
/** @public */
|
|
1067
|
+
interface RadioGroupProps extends Omit<RadioGroupProps$1, 'children'>, Omit<FieldLabelProps, 'htmlFor' | 'id'> {
|
|
1068
|
+
children?: ReactNode;
|
|
1069
|
+
}
|
|
1070
|
+
/** @public */
|
|
1071
|
+
interface RadioProps extends RadioProps$1 {
|
|
1072
|
+
}
|
|
1073
|
+
|
|
1074
|
+
/** @public */
|
|
1075
|
+
declare const RadioGroup: react.ForwardRefExoticComponent<RadioGroupProps & react.RefAttributes<HTMLDivElement>>;
|
|
1076
|
+
/** @public */
|
|
1077
|
+
declare const Radio: react.ForwardRefExoticComponent<RadioProps & react.RefAttributes<HTMLLabelElement>>;
|
|
1078
|
+
|
|
1079
|
+
/**
|
|
1080
|
+
* Props for the Tabs component.
|
|
1081
|
+
*
|
|
1082
|
+
* @public
|
|
1083
|
+
*/
|
|
1084
|
+
interface TabsProps extends TabsProps$1 {
|
|
1085
|
+
}
|
|
1086
|
+
/**
|
|
1087
|
+
* Props for the TabList component.
|
|
1088
|
+
*
|
|
1089
|
+
* @public
|
|
1090
|
+
*/
|
|
1091
|
+
interface TabListProps extends Omit<TabListProps$1<object>, 'items'> {
|
|
1092
|
+
}
|
|
1093
|
+
/**
|
|
1094
|
+
* Props for the TabPanel component.
|
|
1095
|
+
*
|
|
1096
|
+
* @public
|
|
1097
|
+
*/
|
|
1098
|
+
interface TabPanelProps extends TabPanelProps$1 {
|
|
1099
|
+
}
|
|
1100
|
+
|
|
1101
|
+
/**
|
|
1102
|
+
* A component that renders a list of tabs.
|
|
1103
|
+
*
|
|
1104
|
+
* @public
|
|
1105
|
+
*/
|
|
1106
|
+
declare const Tabs: (props: TabsProps) => react_jsx_runtime.JSX.Element | null;
|
|
1107
|
+
/**
|
|
1108
|
+
* A component that renders a list of tabs.
|
|
1109
|
+
*
|
|
1110
|
+
* @public
|
|
1111
|
+
*/
|
|
1112
|
+
declare const TabList: (props: TabListProps) => react_jsx_runtime.JSX.Element;
|
|
1113
|
+
/**
|
|
1114
|
+
* A component that renders a tab.
|
|
1115
|
+
*
|
|
1116
|
+
* @public
|
|
1117
|
+
*/
|
|
1118
|
+
declare const Tab: (props: TabProps) => react_jsx_runtime.JSX.Element;
|
|
1119
|
+
/**
|
|
1120
|
+
* A component that renders the content of a tab.
|
|
1121
|
+
*
|
|
1122
|
+
* @public
|
|
1123
|
+
*/
|
|
1124
|
+
declare const TabPanel: (props: TabPanelProps) => react_jsx_runtime.JSX.Element;
|
|
1125
|
+
|
|
1126
|
+
/** @public */
|
|
1127
|
+
interface TextFieldProps extends TextFieldProps$1, Omit<FieldLabelProps, 'htmlFor' | 'id'> {
|
|
1128
|
+
/**
|
|
1129
|
+
* An icon to render before the input
|
|
1130
|
+
*/
|
|
1131
|
+
icon?: ReactNode;
|
|
1132
|
+
/**
|
|
1133
|
+
* The size of the text field
|
|
1134
|
+
* @defaultValue 'medium'
|
|
1135
|
+
*/
|
|
1136
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
1137
|
+
/**
|
|
1138
|
+
* Text to display in the input when it has no value
|
|
1139
|
+
*/
|
|
1140
|
+
placeholder?: string;
|
|
1141
|
+
}
|
|
1142
|
+
|
|
1143
|
+
/** @public */
|
|
1144
|
+
declare const TextField: react.ForwardRefExoticComponent<TextFieldProps & react.RefAttributes<HTMLDivElement>>;
|
|
1145
|
+
|
|
1146
|
+
/** @public */
|
|
1147
|
+
interface TooltipProps extends Omit<TooltipProps$1, 'children'> {
|
|
1148
|
+
children: React.ReactNode;
|
|
1149
|
+
}
|
|
1150
|
+
|
|
1151
|
+
/** @public */
|
|
1152
|
+
declare const TooltipTrigger: (props: TooltipTriggerComponentProps) => react_jsx_runtime.JSX.Element;
|
|
1153
|
+
/** @public */
|
|
1154
|
+
declare const Tooltip: react.ForwardRefExoticComponent<TooltipProps & react.RefAttributes<HTMLDivElement>>;
|
|
1155
|
+
|
|
1156
|
+
/** @public */
|
|
1157
|
+
type MenuComboboxOption = {
|
|
1158
|
+
label: string;
|
|
1159
|
+
value: string;
|
|
1160
|
+
disabled?: boolean;
|
|
1161
|
+
};
|
|
1162
|
+
/** @public */
|
|
1163
|
+
interface MenuComboboxProps extends ComponentProps<'div'> {
|
|
1164
|
+
options: MenuComboboxOption[];
|
|
1165
|
+
value?: string[];
|
|
1166
|
+
onValueChange?: (value: string[]) => void;
|
|
1167
|
+
multiselect?: boolean;
|
|
1168
|
+
closeParentOnEsc?: boolean;
|
|
1169
|
+
}
|
|
1170
|
+
/** @public */
|
|
1171
|
+
type MenuComponent = {
|
|
1172
|
+
Root: typeof Menu$1.Root;
|
|
1173
|
+
Trigger: typeof Menu$1.Trigger;
|
|
1174
|
+
Portal: typeof Menu$1.Portal;
|
|
1175
|
+
Backdrop: typeof Menu$1.Backdrop;
|
|
1176
|
+
Positioner: typeof Menu$1.Positioner;
|
|
1177
|
+
Popup: typeof Menu$1.Popup;
|
|
1178
|
+
Arrow: typeof Menu$1.Arrow;
|
|
1179
|
+
Item: typeof Menu$1.Item;
|
|
1180
|
+
Group: typeof Menu$1.Group;
|
|
1181
|
+
GroupLabel: typeof Menu$1.GroupLabel;
|
|
1182
|
+
RadioGroup: typeof Menu$1.RadioGroup;
|
|
1183
|
+
RadioItem: typeof Menu$1.RadioItem;
|
|
1184
|
+
RadioItemIndicator: typeof Menu$1.RadioItemIndicator;
|
|
1185
|
+
CheckboxItem: typeof Menu$1.CheckboxItem;
|
|
1186
|
+
CheckboxItemIndicator: typeof Menu$1.CheckboxItemIndicator;
|
|
1187
|
+
SubmenuTrigger: typeof Menu$1.SubmenuTrigger;
|
|
1188
|
+
Separator: typeof Menu$1.Separator;
|
|
1189
|
+
Combobox: ForwardRefExoticComponent<MenuComboboxProps & RefAttributes<HTMLDivElement>>;
|
|
1190
|
+
};
|
|
1191
|
+
|
|
1192
|
+
/** @public */
|
|
1193
|
+
declare const Menu: MenuComponent;
|
|
1194
|
+
|
|
1195
|
+
/** @public */
|
|
1196
|
+
declare const ScrollArea: {
|
|
1197
|
+
Root: react.ForwardRefExoticComponent<Omit<ScrollArea$1.Root.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
1198
|
+
Viewport: react.ForwardRefExoticComponent<Omit<ScrollArea$1.Viewport.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
1199
|
+
Scrollbar: react.ForwardRefExoticComponent<Omit<ScrollArea$1.Scrollbar.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
1200
|
+
Thumb: react.ForwardRefExoticComponent<Omit<ScrollArea$1.Thumb.Props & react.RefAttributes<HTMLDivElement>, "ref"> & react.RefAttributes<HTMLDivElement>>;
|
|
1201
|
+
};
|
|
1202
|
+
|
|
1203
|
+
/** @public */
|
|
1204
|
+
interface SearchFieldProps extends SearchFieldProps$1, Omit<FieldLabelProps, 'htmlFor' | 'id'> {
|
|
1205
|
+
/**
|
|
1206
|
+
* An icon to render before the input
|
|
1207
|
+
*/
|
|
1208
|
+
icon?: ReactNode | false;
|
|
1209
|
+
/**
|
|
1210
|
+
* The size of the text field
|
|
1211
|
+
* @defaultValue 'medium'
|
|
1212
|
+
*/
|
|
1213
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
1214
|
+
/**
|
|
1215
|
+
* The placeholder text for the input
|
|
1216
|
+
*/
|
|
1217
|
+
placeholder?: string;
|
|
1218
|
+
}
|
|
1219
|
+
|
|
1220
|
+
/** @public */
|
|
1221
|
+
declare const SearchField: react.ForwardRefExoticComponent<SearchFieldProps & react.RefAttributes<HTMLDivElement>>;
|
|
1222
|
+
|
|
1223
|
+
/** @public */
|
|
1224
|
+
interface LinkProps extends LinkProps$1 {
|
|
1225
|
+
variant?: 'title-large' | 'title-medium' | 'title-small' | 'title-x-small' | 'body-large' | 'body-medium' | 'body-small' | 'body-x-small' | Partial<Record<Breakpoint, 'title-large' | 'title-medium' | 'title-small' | 'title-x-small' | 'body-large' | 'body-medium' | 'body-small' | 'body-x-small'>>;
|
|
1226
|
+
weight?: 'regular' | 'bold' | Partial<Record<Breakpoint, 'regular' | 'bold'>>;
|
|
1227
|
+
color?: 'primary' | 'secondary' | Partial<Record<Breakpoint, 'primary' | 'secondary'>>;
|
|
1228
|
+
}
|
|
1229
|
+
|
|
1230
|
+
/** @public */
|
|
1231
|
+
declare const Link: react.ForwardRefExoticComponent<LinkProps & react.RefAttributes<HTMLAnchorElement>>;
|
|
1232
|
+
|
|
1233
|
+
/** @public */
|
|
1234
|
+
interface SelectProps extends SelectProps$1<{
|
|
1235
|
+
name: string;
|
|
1236
|
+
value: string;
|
|
1237
|
+
}>, Omit<FieldLabelProps, 'htmlFor' | 'id'> {
|
|
1238
|
+
/**
|
|
1239
|
+
* An icon to render before the input
|
|
1240
|
+
*/
|
|
1241
|
+
icon?: ReactNode;
|
|
1242
|
+
/**
|
|
1243
|
+
* The size of the select field
|
|
1244
|
+
* @defaultValue 'medium'
|
|
1245
|
+
*/
|
|
1246
|
+
size?: 'small' | 'medium' | Partial<Record<Breakpoint, 'small' | 'medium'>>;
|
|
1247
|
+
/**
|
|
1248
|
+
* The options of the select field
|
|
1249
|
+
*/
|
|
1250
|
+
options?: Array<{
|
|
1251
|
+
value: string;
|
|
1252
|
+
label: string;
|
|
1253
|
+
disabled?: boolean;
|
|
1254
|
+
}>;
|
|
1255
|
+
}
|
|
1256
|
+
|
|
1257
|
+
/** @public */
|
|
1258
|
+
declare const Select: react.ForwardRefExoticComponent<SelectProps & react.RefAttributes<HTMLDivElement>>;
|
|
1259
|
+
|
|
1260
|
+
/** @public */
|
|
1261
|
+
interface SkeletonProps extends ComponentProps<'div'> {
|
|
1262
|
+
width?: number | string;
|
|
1263
|
+
height?: number | string;
|
|
1264
|
+
rounded?: boolean;
|
|
1265
|
+
}
|
|
1266
|
+
|
|
1267
|
+
/** @public */
|
|
1268
|
+
declare const Skeleton: (props: SkeletonProps) => react_jsx_runtime.JSX.Element;
|
|
1269
|
+
|
|
1270
|
+
/** @public */
|
|
1271
|
+
interface SwitchProps extends SwitchProps$1 {
|
|
1272
|
+
/**
|
|
1273
|
+
* The label of the switch
|
|
1274
|
+
*/
|
|
1275
|
+
label?: string;
|
|
1276
|
+
}
|
|
1277
|
+
|
|
1278
|
+
/** @public */
|
|
1279
|
+
declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLLabelElement>>;
|
|
1280
|
+
|
|
1281
|
+
/** @public */
|
|
1282
|
+
declare const marginPropDefs: (spacingValues: string[]) => {
|
|
1283
|
+
m: {
|
|
1284
|
+
type: "enum | string";
|
|
1285
|
+
values: string[];
|
|
1286
|
+
className: string;
|
|
1287
|
+
customProperties: "--m"[];
|
|
1288
|
+
responsive: true;
|
|
1289
|
+
};
|
|
1290
|
+
mx: {
|
|
1291
|
+
type: "enum | string";
|
|
1292
|
+
values: string[];
|
|
1293
|
+
className: string;
|
|
1294
|
+
customProperties: "--mx"[];
|
|
1295
|
+
responsive: true;
|
|
1296
|
+
};
|
|
1297
|
+
my: {
|
|
1298
|
+
type: "enum | string";
|
|
1299
|
+
values: string[];
|
|
1300
|
+
className: string;
|
|
1301
|
+
customProperties: "--my"[];
|
|
1302
|
+
responsive: true;
|
|
1303
|
+
};
|
|
1304
|
+
mt: {
|
|
1305
|
+
type: "enum | string";
|
|
1306
|
+
values: string[];
|
|
1307
|
+
className: string;
|
|
1308
|
+
customProperties: "--mt"[];
|
|
1309
|
+
responsive: true;
|
|
1310
|
+
};
|
|
1311
|
+
mr: {
|
|
1312
|
+
type: "enum | string";
|
|
1313
|
+
values: string[];
|
|
1314
|
+
className: string;
|
|
1315
|
+
customProperties: "--mr"[];
|
|
1316
|
+
responsive: true;
|
|
1317
|
+
};
|
|
1318
|
+
mb: {
|
|
1319
|
+
type: "enum | string";
|
|
1320
|
+
values: string[];
|
|
1321
|
+
className: string;
|
|
1322
|
+
customProperties: "--mb"[];
|
|
1323
|
+
responsive: true;
|
|
1324
|
+
};
|
|
1325
|
+
ml: {
|
|
1326
|
+
type: "enum | string";
|
|
1327
|
+
values: string[];
|
|
1328
|
+
className: string;
|
|
1329
|
+
customProperties: "--ml"[];
|
|
1330
|
+
responsive: true;
|
|
1331
|
+
};
|
|
1332
|
+
};
|
|
1333
|
+
/** @public */
|
|
1334
|
+
type MarginProps = GetPropDefTypes<typeof marginPropDefs>;
|
|
1335
|
+
|
|
1336
|
+
/** @public */
|
|
1337
|
+
declare const paddingPropDefs: (spacingValues: string[]) => {
|
|
1338
|
+
p: {
|
|
1339
|
+
type: "enum | string";
|
|
1340
|
+
className: string;
|
|
1341
|
+
customProperties: "--p"[];
|
|
1342
|
+
values: string[];
|
|
1343
|
+
responsive: true;
|
|
1344
|
+
};
|
|
1345
|
+
px: {
|
|
1346
|
+
type: "enum | string";
|
|
1347
|
+
className: string;
|
|
1348
|
+
customProperties: "--px"[];
|
|
1349
|
+
values: string[];
|
|
1350
|
+
responsive: true;
|
|
1351
|
+
};
|
|
1352
|
+
py: {
|
|
1353
|
+
type: "enum | string";
|
|
1354
|
+
className: string;
|
|
1355
|
+
customProperties: "--py"[];
|
|
1356
|
+
values: string[];
|
|
1357
|
+
responsive: true;
|
|
1358
|
+
};
|
|
1359
|
+
pt: {
|
|
1360
|
+
type: "enum | string";
|
|
1361
|
+
className: string;
|
|
1362
|
+
customProperties: "--pt"[];
|
|
1363
|
+
values: string[];
|
|
1364
|
+
responsive: true;
|
|
1365
|
+
};
|
|
1366
|
+
pr: {
|
|
1367
|
+
type: "enum | string";
|
|
1368
|
+
className: string;
|
|
1369
|
+
customProperties: "--pr"[];
|
|
1370
|
+
values: string[];
|
|
1371
|
+
responsive: true;
|
|
1372
|
+
};
|
|
1373
|
+
pb: {
|
|
1374
|
+
type: "enum | string";
|
|
1375
|
+
className: string;
|
|
1376
|
+
customProperties: "--pb"[];
|
|
1377
|
+
values: string[];
|
|
1378
|
+
responsive: true;
|
|
1379
|
+
};
|
|
1380
|
+
pl: {
|
|
1381
|
+
type: "enum | string";
|
|
1382
|
+
className: string;
|
|
1383
|
+
customProperties: "--pl"[];
|
|
1384
|
+
values: string[];
|
|
1385
|
+
responsive: true;
|
|
1386
|
+
};
|
|
1387
|
+
};
|
|
1388
|
+
/** @public */
|
|
1389
|
+
type PaddingProps = GetPropDefTypes<typeof paddingPropDefs>;
|
|
1390
|
+
|
|
1391
|
+
/** @public */
|
|
1392
|
+
declare const useBreakpoint: () => {
|
|
1393
|
+
breakpoint: Breakpoint;
|
|
1394
|
+
up: (key: Breakpoint) => boolean;
|
|
1395
|
+
down: (key: Breakpoint) => boolean;
|
|
1396
|
+
};
|
|
1397
|
+
|
|
1398
|
+
export { type AlignItems, type ArbitraryStylingPropDef, type AsProps, Avatar, type AvatarProps, type BooleanPropDef, type Border, type BorderRadius, Box, type BoxOwnProps, type BoxProps, type Breakpoint, Button, ButtonIcon, type ButtonIconProps, ButtonLink, type ButtonLinkProps, type ButtonProps, Card, type CardBodyProps, type CardFooterProps, type CardHeaderProps, type CardProps, Checkbox, type CheckboxProps, type ClassNamesMap, Collapsible, type Columns, type ComponentClassNames, type ComponentDefinition, type ComponentDefinitionName, Container, type ContainerProps, type DataAttributeValues, type DataAttributesMap, DataTable, type DataTablePaginationProps, type DataTableRootProps, type DataTableTableProps, type Display, type DisplayProps, type EnumOrStringPropDef, type EnumPropDef, FieldLabel, type FieldLabelProps, Flex, type FlexDirection, type FlexOwnProps, type FlexProps, type FlexWrap, type GapProps, type GetPropDefType, type GetPropDefTypes, Grid, type GridItemOwnProps, type GridItemProps, type GridOwnProps, type GridProps, Header, type HeaderBreadcrumb, type HeaderMenuItem, HeaderPage, type HeaderPageProps, type HeaderProps, type HeaderTab, Heading, type HeadingOwnProps, type HeadingProps, type HeightProps, Icon, IconContext, type IconContextProps, type IconMap, type IconNames, type IconProps, IconProvider, type IconProviderProps, type JustifyContent, Link, type LinkProps, type MarginProps, Menu, type MenuComboboxOption, type MenuComboboxProps, type MenuComponent, type NonStylingPropDef, type PaddingProps, type PositionProps, type PropDef, Radio, RadioGroup, type RadioGroupProps, type RadioProps, type ReactNodePropDef, type RegularPropDef, type Responsive, type ResponsivePropDef, ScrollArea, SearchField, type SearchFieldProps, Select, type SelectProps, Skeleton, type SkeletonProps, type Space, type SpaceProps, type StringPropDef, type StylingPropDef, Switch, type SwitchProps, Tab, TabList, type TabListProps, TabPanel, type TabPanelProps, Table, type TableCellLinkProps, type TableCellProfileProps, type TableCellTextProps, Tabs, type TabsProps, Text, TextField, type TextFieldProps, type TextOwnProps, type TextProps, Tooltip, type TooltipProps, TooltipTrigger, type UtilityProps, type WidthProps, boxPropDefs, breakpoints, componentDefinitions, displayPropDefs, flexPropDefs, gapPropDefs, gridItemPropDefs, gridPropDefs, heightPropDefs, icons, marginPropDefs, paddingPropDefs, positionPropDefs, useBreakpoint, useIcons, widthPropDefs };
|