@obosbbl/grunnmuren-react 2.0.0-canary.9 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +122 -10
- package/dist/index.d.mts +421 -81
- package/dist/index.mjs +1597 -189
- package/package.json +16 -6
- package/dist/Button-client-wuoyidfi.js +0 -144
package/dist/index.d.mts
CHANGED
|
@@ -1,87 +1,111 @@
|
|
|
1
|
-
import { CheckboxProps as CheckboxProps$1, CheckboxGroupProps as CheckboxGroupProps$1,
|
|
2
|
-
export { ListBoxItemProps as ComboboxItemProps, Form,
|
|
1
|
+
import { RouterProvider, ButtonProps as ButtonProps$1, LinkProps, CheckboxProps as CheckboxProps$1, CheckboxGroupProps as CheckboxGroupProps$1, ListBoxItemProps, ListBoxSectionProps, HeadingProps as HeadingProps$1, ComboBoxProps, RadioGroupProps as RadioGroupProps$1, RadioProps as RadioProps$1, SelectProps as SelectProps$1, TextFieldProps as TextFieldProps$1, NumberFieldProps as NumberFieldProps$1, ContextValue, BreadcrumbProps as BreadcrumbProps$1, BreadcrumbsProps as BreadcrumbsProps$1, DisclosureProps as DisclosureProps$1, FileTriggerProps as FileTriggerProps$1, TextProps, LabelProps, DialogTriggerProps as DialogTriggerProps$1, ModalOverlayProps, DialogProps as DialogProps$1, TagGroupProps as TagGroupProps$1, TagListProps as TagListProps$1, TagProps as TagProps$1 } from 'react-aria-components';
|
|
2
|
+
export { ListBoxItemProps as ComboboxItemProps, Form, LabelProps, ListBoxItemProps as SelectItemProps, DisclosureGroup as UNSAFE_DisclosureGroup, DisclosureGroupProps as UNSAFE_DisclosureGroupProps } from 'react-aria-components';
|
|
3
|
+
import * as react_jsx_runtime from 'react/jsx-runtime';
|
|
3
4
|
import * as react from 'react';
|
|
5
|
+
import { Ref, HTMLProps, ReactNode, RefAttributes, HTMLAttributes, RefObject, Dispatch, SetStateAction, ComponentProps } from 'react';
|
|
6
|
+
import * as cva from 'cva';
|
|
4
7
|
import { VariantProps } from 'cva';
|
|
5
|
-
import
|
|
8
|
+
import { DateFormatterOptions } from 'react-aria';
|
|
9
|
+
import { DisclosureState } from 'react-stately';
|
|
10
|
+
import { FormValidationProps } from '@react-stately/form';
|
|
11
|
+
|
|
12
|
+
type Locale = 'nb' | 'sv' | 'en';
|
|
13
|
+
/**
|
|
14
|
+
* Returns the locale set in `<GrunnmurenProvider />`
|
|
15
|
+
*/
|
|
16
|
+
declare function _useLocale(): Locale;
|
|
17
|
+
|
|
18
|
+
type RouterProviderProps = React.ComponentProps<typeof RouterProvider>;
|
|
19
|
+
type GrunnmurenProviderProps = {
|
|
20
|
+
children: React.ReactNode;
|
|
21
|
+
/**
|
|
22
|
+
* The locale to apply to the children.
|
|
23
|
+
* @default nb
|
|
24
|
+
*/
|
|
25
|
+
locale?: Locale;
|
|
26
|
+
/** The router to use for client side navigation */
|
|
27
|
+
navigate?: RouterProviderProps['navigate'];
|
|
28
|
+
/** Converts a router-specific href to a native HTML href, e.g. prepending a base path */
|
|
29
|
+
useHref?: RouterProviderProps['useHref'];
|
|
30
|
+
};
|
|
31
|
+
declare function GrunnmurenProvider({ children, locale, navigate, useHref, }: GrunnmurenProviderProps): react_jsx_runtime.JSX.Element;
|
|
32
|
+
|
|
33
|
+
type AccordionProps = {
|
|
34
|
+
children: React.ReactNode;
|
|
35
|
+
/** Additional CSS className for the element. */
|
|
36
|
+
className?: string;
|
|
37
|
+
/** Additional style properties for the element. */
|
|
38
|
+
style?: React.CSSProperties;
|
|
39
|
+
/** Ref to the element. */
|
|
40
|
+
ref?: Ref<HTMLDivElement>;
|
|
41
|
+
};
|
|
42
|
+
type AccordionItemProps = {
|
|
43
|
+
children?: React.ReactNode;
|
|
44
|
+
/** Additional CSS className for the element. */
|
|
45
|
+
className?: string;
|
|
46
|
+
/** Additional style properties for the element. */
|
|
47
|
+
style?: React.CSSProperties;
|
|
48
|
+
/** Whether the accordion is open (controlled) */
|
|
49
|
+
isOpen?: boolean;
|
|
50
|
+
/** Whether the accordion is open by default (uncontrolled) */
|
|
51
|
+
defaultOpen?: boolean;
|
|
52
|
+
/** Handler that is called when the accordion's open state changes */
|
|
53
|
+
onOpenChange?: (isOpen: boolean) => void;
|
|
54
|
+
ref?: Ref<HTMLDivElement>;
|
|
55
|
+
};
|
|
56
|
+
declare function Accordion(props: AccordionProps): react_jsx_runtime.JSX.Element;
|
|
57
|
+
declare function AccordionItem(props: AccordionItemProps): react_jsx_runtime.JSX.Element;
|
|
58
|
+
|
|
59
|
+
type BadgeProps = VariantProps<typeof badgeVariants> & {
|
|
60
|
+
children?: React.ReactNode;
|
|
61
|
+
/** Additional CSS className for the element. */
|
|
62
|
+
className?: string;
|
|
63
|
+
/** Ref to the element. */
|
|
64
|
+
ref?: Ref<HTMLSpanElement>;
|
|
65
|
+
};
|
|
66
|
+
declare const badgeVariants: (props?: ({
|
|
67
|
+
color?: "gray-dark" | "mint" | "sky" | "white" | "blue-dark" | "green-dark" | undefined;
|
|
68
|
+
size?: "small" | "medium" | "large" | undefined;
|
|
69
|
+
} & ({
|
|
70
|
+
class?: cva.ClassValue;
|
|
71
|
+
className?: never;
|
|
72
|
+
} | {
|
|
73
|
+
class?: never;
|
|
74
|
+
className?: cva.ClassValue;
|
|
75
|
+
})) | undefined) => string;
|
|
76
|
+
declare function Badge(props: BadgeProps): react_jsx_runtime.JSX.Element;
|
|
6
77
|
|
|
7
78
|
/**
|
|
8
79
|
* Figma: https://www.figma.com/file/9OvSg0ZXI5E1eQYi7AWiWn/Grunnmuren-2.0-%E2%94%82-Designsystem?node-id=30%3A2574&mode=dev
|
|
9
80
|
*/
|
|
10
81
|
declare const buttonVariants: (props?: ({
|
|
11
82
|
variant?: "primary" | "secondary" | "tertiary" | undefined;
|
|
12
|
-
color?: "
|
|
83
|
+
color?: "mint" | "white" | "green" | undefined;
|
|
13
84
|
isIconOnly?: boolean | undefined;
|
|
85
|
+
isPending?: boolean | undefined;
|
|
14
86
|
} & ({
|
|
15
|
-
class?:
|
|
16
|
-
|
|
17
|
-
} | null | undefined)[] | {
|
|
18
|
-
[x: string]: any;
|
|
19
|
-
} | null | undefined)[] | {
|
|
20
|
-
[x: string]: any;
|
|
21
|
-
} | null | undefined)[] | {
|
|
22
|
-
[x: string]: any;
|
|
23
|
-
} | null | undefined)[] | {
|
|
24
|
-
[x: string]: any;
|
|
25
|
-
} | null | undefined)[] | {
|
|
26
|
-
[x: string]: any;
|
|
27
|
-
} | null | undefined)[] | {
|
|
28
|
-
[x: string]: any;
|
|
29
|
-
} | null | undefined)[] | {
|
|
30
|
-
[x: string]: any;
|
|
31
|
-
} | null | undefined)[] | {
|
|
32
|
-
[x: string]: any;
|
|
33
|
-
} | null | undefined)[] | {
|
|
34
|
-
[x: string]: any;
|
|
35
|
-
} | null | undefined)[] | {
|
|
36
|
-
[x: string]: any;
|
|
37
|
-
} | null | undefined)[] | {
|
|
38
|
-
[x: string]: any;
|
|
39
|
-
} | null | undefined;
|
|
40
|
-
className?: undefined;
|
|
87
|
+
class?: cva.ClassValue;
|
|
88
|
+
className?: never;
|
|
41
89
|
} | {
|
|
42
|
-
class?:
|
|
43
|
-
className?:
|
|
44
|
-
[x: string]: any;
|
|
45
|
-
} | null | undefined)[] | {
|
|
46
|
-
[x: string]: any;
|
|
47
|
-
} | null | undefined)[] | {
|
|
48
|
-
[x: string]: any;
|
|
49
|
-
} | null | undefined)[] | {
|
|
50
|
-
[x: string]: any;
|
|
51
|
-
} | null | undefined)[] | {
|
|
52
|
-
[x: string]: any;
|
|
53
|
-
} | null | undefined)[] | {
|
|
54
|
-
[x: string]: any;
|
|
55
|
-
} | null | undefined)[] | {
|
|
56
|
-
[x: string]: any;
|
|
57
|
-
} | null | undefined)[] | {
|
|
58
|
-
[x: string]: any;
|
|
59
|
-
} | null | undefined)[] | {
|
|
60
|
-
[x: string]: any;
|
|
61
|
-
} | null | undefined)[] | {
|
|
62
|
-
[x: string]: any;
|
|
63
|
-
} | null | undefined)[] | {
|
|
64
|
-
[x: string]: any;
|
|
65
|
-
} | null | undefined)[] | {
|
|
66
|
-
[x: string]: any;
|
|
67
|
-
} | null | undefined;
|
|
90
|
+
class?: never;
|
|
91
|
+
className?: cva.ClassValue;
|
|
68
92
|
})) | undefined) => string;
|
|
69
|
-
type ButtonOrLinkProps =
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
href: string;
|
|
73
|
-
});
|
|
74
|
-
type ButtonProps = VariantProps<typeof buttonVariants> & {
|
|
75
|
-
className?: string;
|
|
76
|
-
children: React.ReactNode;
|
|
93
|
+
type ButtonOrLinkProps$1 = VariantProps<typeof buttonVariants> & {
|
|
94
|
+
children?: React.ReactNode;
|
|
95
|
+
href?: LinkProps['href'];
|
|
77
96
|
/**
|
|
78
97
|
* Display the button in a loading state
|
|
98
|
+
* @deprecated Use isPending instead.
|
|
79
99
|
* @default false
|
|
80
100
|
*/
|
|
81
101
|
isLoading?: boolean;
|
|
102
|
+
/** Additional style properties for the element. */
|
|
82
103
|
style?: React.CSSProperties;
|
|
83
|
-
|
|
84
|
-
|
|
104
|
+
/** Ref to the element. */
|
|
105
|
+
ref?: Ref<HTMLButtonElement | HTMLAnchorElement>;
|
|
106
|
+
};
|
|
107
|
+
type ButtonProps = (ButtonProps$1 | LinkProps) & ButtonOrLinkProps$1;
|
|
108
|
+
declare function Button(props: ButtonProps): react_jsx_runtime.JSX.Element;
|
|
85
109
|
|
|
86
110
|
type CheckboxProps = {
|
|
87
111
|
children: React.ReactNode;
|
|
@@ -93,8 +117,10 @@ type CheckboxProps = {
|
|
|
93
117
|
errorMessage?: React.ReactNode;
|
|
94
118
|
/** Additional style properties for the element. */
|
|
95
119
|
style?: React.CSSProperties;
|
|
120
|
+
/** Ref for the element. */
|
|
121
|
+
ref?: Ref<HTMLLabelElement>;
|
|
96
122
|
} & Omit<CheckboxProps$1, 'isDisabled' | 'style' | 'children' | 'isIndeterminate' | 'isReadOnly'>;
|
|
97
|
-
declare
|
|
123
|
+
declare function Checkbox(props: CheckboxProps): react_jsx_runtime.JSX.Element;
|
|
98
124
|
|
|
99
125
|
type CheckboxGroupProps = {
|
|
100
126
|
children: React.ReactNode;
|
|
@@ -108,8 +134,20 @@ type CheckboxGroupProps = {
|
|
|
108
134
|
label?: React.ReactNode;
|
|
109
135
|
/** Additional style properties for the element. */
|
|
110
136
|
style?: React.CSSProperties;
|
|
137
|
+
/** Ref to the element. */
|
|
138
|
+
ref?: Ref<HTMLDivElement>;
|
|
111
139
|
} & Omit<CheckboxGroupProps$1, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style' | 'orientation'>;
|
|
112
|
-
declare
|
|
140
|
+
declare function CheckboxGroup(props: CheckboxGroupProps): react_jsx_runtime.JSX.Element;
|
|
141
|
+
|
|
142
|
+
declare const ListBoxItem: (props: ListBoxItemProps) => react_jsx_runtime.JSX.Element;
|
|
143
|
+
/**
|
|
144
|
+
* This component can be used to group items in a listbox
|
|
145
|
+
*/
|
|
146
|
+
declare const ListBoxSection: <T extends object>({ className, ...restProps }: ListBoxSectionProps<T>) => react_jsx_runtime.JSX.Element;
|
|
147
|
+
/**
|
|
148
|
+
* This component can be used to label grouped items in a `ListBoxSection` with a heading
|
|
149
|
+
*/
|
|
150
|
+
declare const ListBoxHeader: (props: HeadingProps$1) => react_jsx_runtime.JSX.Element;
|
|
113
151
|
|
|
114
152
|
type ComboboxProps<T extends object> = {
|
|
115
153
|
children: React.ReactNode;
|
|
@@ -120,19 +158,25 @@ type ComboboxProps<T extends object> = {
|
|
|
120
158
|
/** Error message for the form control. Automatically sets `isInvalid` to true */
|
|
121
159
|
errorMessage?: React.ReactNode;
|
|
122
160
|
/**
|
|
123
|
-
* Display the dropdown button trigger in a
|
|
124
|
-
* @
|
|
161
|
+
* Display the dropdown button trigger in a pending state
|
|
162
|
+
* @deprecated Use isPending instead.
|
|
125
163
|
*/
|
|
126
164
|
isLoading?: boolean;
|
|
165
|
+
/**
|
|
166
|
+
* Display the dropdown button trigger in a pending state
|
|
167
|
+
* @default false
|
|
168
|
+
*/
|
|
169
|
+
isPending?: boolean;
|
|
127
170
|
/** Label for the form control. */
|
|
128
171
|
label?: React.ReactNode;
|
|
129
172
|
/** Placeholder text. Only visible when the input value is empty. */
|
|
130
173
|
placeholder?: string;
|
|
131
174
|
/** Additional style properties for the element. */
|
|
132
175
|
style?: React.CSSProperties;
|
|
176
|
+
/** Ref for the input element. */
|
|
177
|
+
ref?: Ref<HTMLInputElement>;
|
|
133
178
|
} & Omit<ComboBoxProps<T>, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style'>;
|
|
134
|
-
declare
|
|
135
|
-
declare const _Combobox: react.ForwardRefExoticComponent<Omit<ComboboxProps<object>, "ref"> & react.RefAttributes<HTMLInputElement>>;
|
|
179
|
+
declare function Combobox<T extends object>(props: ComboboxProps<T>): react_jsx_runtime.JSX.Element;
|
|
136
180
|
|
|
137
181
|
type RadioGroupProps = {
|
|
138
182
|
children: React.ReactNode;
|
|
@@ -146,8 +190,10 @@ type RadioGroupProps = {
|
|
|
146
190
|
label?: React.ReactNode;
|
|
147
191
|
/** Additional style properties for the element. */
|
|
148
192
|
style?: React.CSSProperties;
|
|
193
|
+
/** Ref for the element. */
|
|
194
|
+
ref?: Ref<HTMLDivElement>;
|
|
149
195
|
} & Omit<RadioGroupProps$1, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style' | 'orientation'>;
|
|
150
|
-
declare
|
|
196
|
+
declare function RadioGroup(props: RadioGroupProps): react_jsx_runtime.JSX.Element;
|
|
151
197
|
|
|
152
198
|
type RadioProps = {
|
|
153
199
|
children: React.ReactNode;
|
|
@@ -157,8 +203,10 @@ type RadioProps = {
|
|
|
157
203
|
description?: React.ReactNode;
|
|
158
204
|
/** Additional style properties for the element. */
|
|
159
205
|
style?: React.CSSProperties;
|
|
206
|
+
/** Ref for the element. */
|
|
207
|
+
ref?: Ref<HTMLLabelElement>;
|
|
160
208
|
} & Omit<RadioProps$1, 'isDisabled' | 'children' | 'style'>;
|
|
161
|
-
declare
|
|
209
|
+
declare function Radio(props: RadioProps): react_jsx_runtime.JSX.Element;
|
|
162
210
|
|
|
163
211
|
type SelectProps<T extends object> = {
|
|
164
212
|
children: React.ReactNode;
|
|
@@ -174,9 +222,10 @@ type SelectProps<T extends object> = {
|
|
|
174
222
|
placeholder?: string;
|
|
175
223
|
/** Additional style properties for the element. */
|
|
176
224
|
style?: React.CSSProperties;
|
|
225
|
+
/** Ref for the button element. */
|
|
226
|
+
ref?: Ref<HTMLButtonElement>;
|
|
177
227
|
} & Omit<SelectProps$1<T>, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style'>;
|
|
178
|
-
declare
|
|
179
|
-
declare const _Select: react.ForwardRefExoticComponent<Omit<SelectProps<object>, "ref"> & react.RefAttributes<HTMLButtonElement>>;
|
|
228
|
+
declare function Select<T extends object>(props: SelectProps<T>): react_jsx_runtime.JSX.Element;
|
|
180
229
|
|
|
181
230
|
type TextAreaProps = {
|
|
182
231
|
/** Additional CSS className for the element. */
|
|
@@ -196,8 +245,10 @@ type TextAreaProps = {
|
|
|
196
245
|
* @default 2
|
|
197
246
|
*/
|
|
198
247
|
rows?: number;
|
|
248
|
+
/** Ref for the textarea element. */
|
|
249
|
+
ref?: Ref<HTMLTextAreaElement>;
|
|
199
250
|
} & Omit<TextFieldProps$1, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style'>;
|
|
200
|
-
declare
|
|
251
|
+
declare function TextArea(props: TextAreaProps): react_jsx_runtime.JSX.Element;
|
|
201
252
|
|
|
202
253
|
type TextFieldProps = {
|
|
203
254
|
/** Additional CSS className for the element. */
|
|
@@ -221,10 +272,14 @@ type TextFieldProps = {
|
|
|
221
272
|
textAlign?: 'left' | 'right';
|
|
222
273
|
/** Additional style properties for the element. */
|
|
223
274
|
style?: React.CSSProperties;
|
|
224
|
-
/** Add a divider between the left/right addons and the input */
|
|
275
|
+
/** Add a divider between the left/right addons and the input, a value of 0 will be ignored */
|
|
225
276
|
withAddonDivider?: boolean;
|
|
277
|
+
/** Defines the number of characters and determines the width of the input element */
|
|
278
|
+
size?: number;
|
|
279
|
+
/** Ref for the input element. */
|
|
280
|
+
ref?: Ref<HTMLInputElement>;
|
|
226
281
|
} & Omit<TextFieldProps$1, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style'>;
|
|
227
|
-
declare
|
|
282
|
+
declare function TextField(props: TextFieldProps): react_jsx_runtime.JSX.Element;
|
|
228
283
|
|
|
229
284
|
type NumberFieldProps = {
|
|
230
285
|
/** Additional CSS className for the element. */
|
|
@@ -250,7 +305,292 @@ type NumberFieldProps = {
|
|
|
250
305
|
style?: React.CSSProperties;
|
|
251
306
|
/** Add a divider between the left/right addons and the input */
|
|
252
307
|
withAddonDivider?: boolean;
|
|
308
|
+
/** Defines the number of characters and determines the width of the input element, a value of 0 will be ignored */
|
|
309
|
+
size?: number;
|
|
310
|
+
/** Defines the maximum numeric value */
|
|
311
|
+
maxValue?: number;
|
|
312
|
+
/** Defines the minimum numeric value */
|
|
313
|
+
minValue?: number;
|
|
314
|
+
/** Ref for the input element. */
|
|
315
|
+
ref?: Ref<HTMLInputElement>;
|
|
253
316
|
} & Omit<NumberFieldProps$1, 'className' | 'isReadOnly' | 'isDisabled' | 'children' | 'style' | 'hideStepper'>;
|
|
254
|
-
declare
|
|
317
|
+
declare function NumberField(props: NumberFieldProps): react_jsx_runtime.JSX.Element;
|
|
318
|
+
|
|
319
|
+
declare const alertVariants: (props?: ({
|
|
320
|
+
variant?: "info" | "success" | "warning" | "danger" | undefined;
|
|
321
|
+
} & ({
|
|
322
|
+
class?: cva.ClassValue;
|
|
323
|
+
className?: never;
|
|
324
|
+
} | {
|
|
325
|
+
class?: never;
|
|
326
|
+
className?: cva.ClassValue;
|
|
327
|
+
})) | undefined) => string;
|
|
328
|
+
type Props = VariantProps<typeof alertVariants> & {
|
|
329
|
+
children: React.ReactNode;
|
|
330
|
+
/**
|
|
331
|
+
* The ARIA role for the alertbox.
|
|
332
|
+
*/
|
|
333
|
+
role: 'alert' | 'status' | 'none';
|
|
334
|
+
/** Additional CSS className for the element. */
|
|
335
|
+
className?: string;
|
|
336
|
+
/** Overrides the default icon for the alertbox variant. Should be used sparingly as the default icons are visually connected to the color of the variant. */
|
|
337
|
+
icon?: React.ComponentType;
|
|
338
|
+
/**
|
|
339
|
+
* Controls if the alert is expandable or not
|
|
340
|
+
* @default false
|
|
341
|
+
*/
|
|
342
|
+
isExpandable?: boolean;
|
|
343
|
+
/**
|
|
344
|
+
* Controls if the alert can be dismissed with a close button.
|
|
345
|
+
* @default false
|
|
346
|
+
*/
|
|
347
|
+
isDismissable?: boolean;
|
|
348
|
+
/**
|
|
349
|
+
* Controls if the alert is rendered or not.
|
|
350
|
+
* This is used to control the open/closed state of the component; make the component "controlled".
|
|
351
|
+
* @default false
|
|
352
|
+
*/
|
|
353
|
+
isDismissed?: boolean;
|
|
354
|
+
/**
|
|
355
|
+
* Callback that should be triggered when a dismissable alert is closed.
|
|
356
|
+
* This is used to control the open/closed state of the component; make the component "controlled".
|
|
357
|
+
*/
|
|
358
|
+
onDismiss?: () => void;
|
|
359
|
+
};
|
|
360
|
+
declare const Alertbox: ({ children, role, className, icon, variant, isDismissable, isDismissed, onDismiss, isExpandable, }: Props) => react_jsx_runtime.JSX.Element | undefined;
|
|
361
|
+
|
|
362
|
+
type HeadingProps = HTMLProps<HTMLHeadingElement> & {
|
|
363
|
+
children?: React.ReactNode;
|
|
364
|
+
/** The level of the heading */
|
|
365
|
+
level: 1 | 2 | 3 | 4 | 5 | 6;
|
|
366
|
+
/** @private Used internally for slotted components */
|
|
367
|
+
_innerWrapper?: (children: React.ReactNode) => React.ReactNode;
|
|
368
|
+
/** @private Used internally for slotted components */
|
|
369
|
+
_outerWrapper?: (children: React.ReactNode) => React.ReactNode;
|
|
370
|
+
/** Ref for the element. */
|
|
371
|
+
ref?: Ref<HTMLHeadingElement>;
|
|
372
|
+
};
|
|
373
|
+
declare const HeadingContext: react.Context<ContextValue<Partial<HeadingProps>, HTMLHeadingElement>>;
|
|
374
|
+
declare const Heading: ({ ref, ...props }: HeadingProps) => string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
|
|
375
|
+
declare const ContentContext: react.Context<ContextValue<Partial<ContentProps>, HTMLDivElement>>;
|
|
376
|
+
type ContentProps = HTMLProps<HTMLDivElement> & {
|
|
377
|
+
children: React.ReactNode;
|
|
378
|
+
/** @private Used internally for slotted components */
|
|
379
|
+
_outerWrapper?: (children: React.ReactNode) => React.ReactNode;
|
|
380
|
+
/** Ref for the element. */
|
|
381
|
+
ref?: Ref<HTMLDivElement>;
|
|
382
|
+
};
|
|
383
|
+
declare const Content: ({ ref, ...props }: ContentProps) => string | number | bigint | boolean | Iterable<react.ReactNode> | Promise<string | number | bigint | boolean | react.ReactPortal | react.ReactElement<unknown, string | react.JSXElementConstructor<any>> | Iterable<react.ReactNode> | null | undefined> | react_jsx_runtime.JSX.Element | null | undefined;
|
|
384
|
+
type MediaProps = HTMLProps<HTMLDivElement> & {
|
|
385
|
+
children: React.ReactNode;
|
|
386
|
+
};
|
|
387
|
+
declare const Media: (props: MediaProps) => react_jsx_runtime.JSX.Element;
|
|
388
|
+
type FooterProps = HTMLProps<HTMLDivElement> & {
|
|
389
|
+
children: React.ReactNode;
|
|
390
|
+
};
|
|
391
|
+
type CaptionProps = HTMLProps<HTMLDivElement> & {
|
|
392
|
+
children: React.ReactNode;
|
|
393
|
+
};
|
|
394
|
+
declare const Caption: ({ className, ...restProps }: CaptionProps) => react_jsx_runtime.JSX.Element;
|
|
395
|
+
declare const Footer: (props: FooterProps) => react_jsx_runtime.JSX.Element;
|
|
396
|
+
|
|
397
|
+
type BreadcrumbProps = {
|
|
398
|
+
/** Additional CSS className for the element. */
|
|
399
|
+
className?: string;
|
|
400
|
+
children?: React.ReactNode;
|
|
401
|
+
/** Additional style properties for the element. */
|
|
402
|
+
style?: React.CSSProperties;
|
|
403
|
+
/** The URL to navigate to when clicking the breadcrumb. */
|
|
404
|
+
href?: LinkProps['href'];
|
|
405
|
+
/** Ref to the element. */
|
|
406
|
+
ref?: Ref<HTMLLIElement>;
|
|
407
|
+
} & Omit<BreadcrumbProps$1, 'className' | 'style'>;
|
|
408
|
+
declare function Breadcrumb(props: BreadcrumbProps): react_jsx_runtime.JSX.Element;
|
|
409
|
+
|
|
410
|
+
type BreadcrumbsProps = {
|
|
411
|
+
/** Additional CSS className for the element. */
|
|
412
|
+
className?: string;
|
|
413
|
+
/** Additional style properties for the element. */
|
|
414
|
+
style?: React.CSSProperties;
|
|
415
|
+
/** Ref to the element. */
|
|
416
|
+
ref?: Ref<HTMLOListElement>;
|
|
417
|
+
} & Omit<BreadcrumbsProps$1<BreadcrumbProps>, 'className' | 'style'>;
|
|
418
|
+
declare function Breadcrumbs(props: BreadcrumbsProps): react_jsx_runtime.JSX.Element;
|
|
419
|
+
|
|
420
|
+
type ButtonOrLinkProps = {
|
|
421
|
+
children?: React.ReactNode;
|
|
422
|
+
/** Additional CSS className for the element. */
|
|
423
|
+
className?: string;
|
|
424
|
+
/** Determines whether to use an anchor or a button for the Backlink */
|
|
425
|
+
href?: LinkProps['href'];
|
|
426
|
+
/** To add a permanent underline on the link (not only on hover)
|
|
427
|
+
* @default false
|
|
428
|
+
*/
|
|
429
|
+
withUnderline?: boolean;
|
|
430
|
+
/** Ref to the element. */
|
|
431
|
+
ref?: Ref<HTMLAnchorElement | HTMLButtonElement>;
|
|
432
|
+
};
|
|
433
|
+
type BacklinkProps = (ButtonProps$1 | LinkProps) & ButtonOrLinkProps;
|
|
434
|
+
declare function Backlink(props: BacklinkProps): react_jsx_runtime.JSX.Element;
|
|
435
|
+
|
|
436
|
+
type CardProps = VariantProps<typeof cardVariants> & {
|
|
437
|
+
children?: React.ReactNode;
|
|
438
|
+
className?: string;
|
|
439
|
+
};
|
|
440
|
+
declare const cardVariants: (props?: ({
|
|
441
|
+
variant?: "subtle" | "outlined" | undefined;
|
|
442
|
+
layout?: "horizontal" | "vertical" | undefined;
|
|
443
|
+
} & ({
|
|
444
|
+
class?: cva.ClassValue;
|
|
445
|
+
className?: never;
|
|
446
|
+
} | {
|
|
447
|
+
class?: never;
|
|
448
|
+
className?: cva.ClassValue;
|
|
449
|
+
})) | undefined) => string;
|
|
450
|
+
declare const Card: ({ children, className: _className, variant, layout, ...restProps }: CardProps) => react_jsx_runtime.JSX.Element;
|
|
451
|
+
type CardLinkWrapperProps = {
|
|
452
|
+
children?: React.ReactNode;
|
|
453
|
+
className?: string;
|
|
454
|
+
} & {
|
|
455
|
+
[K in keyof Omit<LinkProps, 'className' | 'children'>]?: never;
|
|
456
|
+
};
|
|
457
|
+
type CardLinkProps = (Omit<LinkProps, 'href'> & Required<Pick<LinkProps, 'href'>>) | CardLinkWrapperProps;
|
|
458
|
+
/**
|
|
459
|
+
* A component that creates a clickable area on a card.
|
|
460
|
+
* It can be used either as a wrapper around a link or as a standalone link.
|
|
461
|
+
*/
|
|
462
|
+
declare const CardLink: ({ className: _className, href, ...restProps }: CardLinkProps) => react_jsx_runtime.JSX.Element;
|
|
463
|
+
|
|
464
|
+
type DateFormatterProps = {
|
|
465
|
+
value: Date | string;
|
|
466
|
+
options?: DateFormatterOptions;
|
|
467
|
+
/** Callback to customize the rendering of the date */
|
|
468
|
+
children?: (formattedDate: string) => ReactNode;
|
|
469
|
+
};
|
|
470
|
+
/**
|
|
471
|
+
* A React component that wraps https://react-spectrum.adobe.com/react-aria/useDateFormatter.html
|
|
472
|
+
* By default it sets the timeZone to `Europe/Berlin` to prevent the server's timezone from affecting
|
|
473
|
+
* the localized format
|
|
474
|
+
*/
|
|
475
|
+
declare const DateFormatter: ({ options: _options, value, children: render, }: DateFormatterProps) => ReactNode;
|
|
476
|
+
|
|
477
|
+
type VideoLoopProps = {
|
|
478
|
+
/** The video url */
|
|
479
|
+
src: string;
|
|
480
|
+
/** The video format */
|
|
481
|
+
format: string;
|
|
482
|
+
/**
|
|
483
|
+
* The content of the video must have a text description, so that it is accessible to screen readers.
|
|
484
|
+
* You can either provide just a caption, just an alt text, or both a caption and an alt text.
|
|
485
|
+
* Make sure the alt text doesn't repeat too much of the caption text, if so just a caption is sufficent.
|
|
486
|
+
* Think of this just as an alt text, but for a muted video - this text will not be visible, but read by screen readers.
|
|
487
|
+
* */
|
|
488
|
+
alt?: string;
|
|
489
|
+
className?: string;
|
|
490
|
+
};
|
|
491
|
+
declare const VideoLoop: ({ src, format, alt, className }: VideoLoopProps) => react_jsx_runtime.JSX.Element;
|
|
492
|
+
|
|
493
|
+
declare const disclosureButtonVariants: (props?: ({
|
|
494
|
+
withChevron?: boolean | undefined;
|
|
495
|
+
isIconOnly?: boolean | undefined;
|
|
496
|
+
} & ({
|
|
497
|
+
class?: cva.ClassValue;
|
|
498
|
+
className?: never;
|
|
499
|
+
} | {
|
|
500
|
+
class?: never;
|
|
501
|
+
className?: cva.ClassValue;
|
|
502
|
+
})) | undefined) => string;
|
|
503
|
+
type DisclosureButtonProps = Omit<ButtonProps$1, 'children' | 'aria-expanded' | 'aria-controls'> & VariantProps<typeof disclosureButtonVariants> & {
|
|
504
|
+
children: React.ReactNode;
|
|
505
|
+
} & RefAttributes<HTMLButtonElement>;
|
|
506
|
+
declare const DisclosureButton: ({ className, withChevron, isIconOnly, children, ref: _ref, ...restProps }: DisclosureButtonProps) => react_jsx_runtime.JSX.Element;
|
|
507
|
+
type DisclosureProps = DisclosureProps$1 & RefAttributes<HTMLDivElement> & {
|
|
508
|
+
className?: string;
|
|
509
|
+
};
|
|
510
|
+
declare const DisclosureStateContext: react.Context<DisclosureState | null>;
|
|
511
|
+
declare const Disclosure: ({ ref: _ref, children, ..._props }: DisclosureProps) => react_jsx_runtime.JSX.Element;
|
|
512
|
+
type DisclosurePanelProps = Omit<HTMLAttributes<HTMLDivElement>, 'role'> & {
|
|
513
|
+
children: React.ReactNode;
|
|
514
|
+
role?: 'group' | 'region' | 'none';
|
|
515
|
+
} & RefAttributes<HTMLDivElement>;
|
|
516
|
+
declare const DisclosurePanel: ({ ref, children, ...props }: DisclosurePanelProps) => react_jsx_runtime.JSX.Element;
|
|
517
|
+
|
|
518
|
+
type FileTriggerProps = Partial<FormValidationProps<File>> & FileTriggerProps$1 & Omit<HTMLAttributes<HTMLInputElement>, 'onSelect' | 'onChange' | 'required' | 'className'> & {
|
|
519
|
+
ref?: RefObject<HTMLInputElement | null>;
|
|
520
|
+
isInvalid?: boolean;
|
|
521
|
+
isRequired?: boolean;
|
|
522
|
+
};
|
|
523
|
+
|
|
524
|
+
type FileUploadProps = Omit<FileTriggerProps, 'onSelect'> & {
|
|
525
|
+
children: ReactNode;
|
|
526
|
+
files?: File[];
|
|
527
|
+
onChange?: Dispatch<SetStateAction<File[]>>;
|
|
528
|
+
validate?: (files: File) => true | string;
|
|
529
|
+
isRequired?: boolean;
|
|
530
|
+
isInvalid?: boolean;
|
|
531
|
+
errorMessage?: string;
|
|
532
|
+
};
|
|
533
|
+
declare const FileUpload: ({ children, files: _files, onChange, validate, isInvalid: _isInvalid, errorMessage, isRequired, allowsMultiple, ref, ...fileTriggerProps }: FileUploadProps) => react_jsx_runtime.JSX.Element;
|
|
534
|
+
|
|
535
|
+
type DescriptionProps = TextProps;
|
|
536
|
+
declare function Description(props: DescriptionProps): react_jsx_runtime.JSX.Element;
|
|
537
|
+
|
|
538
|
+
type ErrorMessageProps = TextProps;
|
|
539
|
+
declare function ErrorMessage(props: ErrorMessageProps): react_jsx_runtime.JSX.Element;
|
|
540
|
+
|
|
541
|
+
declare function Label(props: LabelProps): react_jsx_runtime.JSX.Element;
|
|
542
|
+
|
|
543
|
+
type AvatarProps = ComponentProps<'img'>;
|
|
544
|
+
declare const Avatar: ({ src, alt, className, onError, loading, ...rest }: AvatarProps) => react_jsx_runtime.JSX.Element;
|
|
545
|
+
|
|
546
|
+
type DialogTriggerProps = DialogTriggerProps$1;
|
|
547
|
+
declare const DialogTrigger: (props: DialogTriggerProps) => react_jsx_runtime.JSX.Element;
|
|
548
|
+
type ModalProps = Omit<ModalOverlayProps, 'isDismissable'>;
|
|
549
|
+
declare const Modal: ({ className, ...restProps }: ModalProps) => react_jsx_runtime.JSX.Element;
|
|
550
|
+
type DialogProps = DialogProps$1 & {
|
|
551
|
+
children: React.ReactNode;
|
|
552
|
+
};
|
|
553
|
+
declare const Dialog: ({ className, children, ...restProps }: DialogProps) => react_jsx_runtime.JSX.Element;
|
|
554
|
+
|
|
555
|
+
type TagGroupProps = Omit<TagGroupProps$1, 'className'> & RefAttributes<HTMLDivElement> & {
|
|
556
|
+
/**
|
|
557
|
+
* CSS classes to apply to the tag group
|
|
558
|
+
*/
|
|
559
|
+
className?: string;
|
|
560
|
+
/**
|
|
561
|
+
* The function to call when the tag is removed
|
|
562
|
+
*/
|
|
563
|
+
onRemove?: (key: React.Key) => void;
|
|
564
|
+
/**
|
|
565
|
+
* The selection mode for the tag group
|
|
566
|
+
* @default "single"
|
|
567
|
+
*/
|
|
568
|
+
selectionMode?: 'single' | 'multiple';
|
|
569
|
+
};
|
|
570
|
+
type TagListProps = Omit<TagListProps$1<object>, 'className'> & RefAttributes<HTMLDivElement> & {
|
|
571
|
+
/**
|
|
572
|
+
* CSS classes to apply to the tag list
|
|
573
|
+
*/
|
|
574
|
+
className?: string;
|
|
575
|
+
};
|
|
576
|
+
type TagProps = Omit<TagProps$1, 'className'> & RefAttributes<HTMLDivElement> & {
|
|
577
|
+
children: React.ReactNode;
|
|
578
|
+
/**
|
|
579
|
+
* CSS classes to apply to the tag
|
|
580
|
+
*/
|
|
581
|
+
className?: string;
|
|
582
|
+
};
|
|
583
|
+
/**
|
|
584
|
+
* A group component for Tag components that enables selection and organization of options.
|
|
585
|
+
*/
|
|
586
|
+
declare function TagGroup(props: TagGroupProps): react_jsx_runtime.JSX.Element;
|
|
587
|
+
/**
|
|
588
|
+
* A container component for Tag components within a TagGroup.
|
|
589
|
+
*/
|
|
590
|
+
declare function TagList(props: TagListProps): react_jsx_runtime.JSX.Element;
|
|
591
|
+
/**
|
|
592
|
+
* Interactive tag component for selections, filtering, and categorization.
|
|
593
|
+
*/
|
|
594
|
+
declare function Tag(props: TagProps): react_jsx_runtime.JSX.Element;
|
|
255
595
|
|
|
256
|
-
export {
|
|
596
|
+
export { Accordion, AccordionItem, type AccordionItemProps, type AccordionProps, Alertbox, type Props as AlertboxProps, Backlink, type BacklinkProps, Badge, type BadgeProps, Breadcrumb, type BreadcrumbProps, Breadcrumbs, type BreadcrumbsProps, Button, type ButtonProps, Caption, type CaptionProps, Card, CardLink, type CardLinkProps, type CardProps, Checkbox, CheckboxGroup, type CheckboxGroupProps, type CheckboxProps, Combobox, ListBoxHeader as ComboboxHeader, ListBoxItem as ComboboxItem, type ComboboxProps, ListBoxSection as ComboboxSection, Content, ContentContext, type ContentProps, DateFormatter, type DateFormatterProps, Description, type DescriptionProps, DisclosureStateContext, ErrorMessage, type ErrorMessageProps, Footer, type FooterProps, GrunnmurenProvider, type GrunnmurenProviderProps, Heading, HeadingContext, type HeadingProps, Label, type Locale, Media, type MediaProps, NumberField, type NumberFieldProps, Radio, RadioGroup, type RadioGroupProps, type RadioProps, Select, ListBoxHeader as SelectHeader, ListBoxItem as SelectItem, type SelectProps, ListBoxSection as SelectSection, type TagGroupProps, type TagListProps, type TagProps, TextArea, type TextAreaProps, TextField, type TextFieldProps, Avatar as UNSAFE_Avatar, type AvatarProps as UNSAFE_AvatarProps, Dialog as UNSAFE_Dialog, type DialogProps as UNSAFE_DialogProps, DialogTrigger as UNSAFE_DialogTrigger, type DialogTriggerProps as UNSAFE_DialogTriggerProps, Disclosure as UNSAFE_Disclosure, DisclosureButton as UNSAFE_DisclosureButton, type DisclosureButtonProps as UNSAFE_DisclosureButtonProps, DisclosurePanel as UNSAFE_DisclosurePanel, type DisclosurePanelProps as UNSAFE_DisclosurePanelProps, type DisclosureProps as UNSAFE_DisclosureProps, FileUpload as UNSAFE_FileUpload, type FileUploadProps as UNSAFE_FileUploadProps, Modal as UNSAFE_Modal, type ModalProps as UNSAFE_ModalProps, Tag as UNSAFE_Tag, TagGroup as UNSAFE_TagGroup, TagList as UNSAFE_TagList, VideoLoop, _useLocale as useLocale };
|