@recursica/mantine-adapter 0.23.0 → 0.26.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/ARCHITECTURE.md +15 -0
- package/CHANGELOG.md +32 -0
- package/SETUP.md +79 -0
- package/USAGE.md +55 -0
- package/dist/mantine-adapter.cjs +1 -1
- package/dist/mantine-adapter.cjs.map +1 -1
- package/dist/mantine-adapter.css +1 -1
- package/dist/mantine-adapter.js +928 -878
- package/dist/mantine-adapter.js.map +1 -1
- package/dist/src/components/Accordion/Accordion.d.ts +4 -24
- package/dist/src/components/AssistiveElement/AssistiveElement.d.ts +1 -6
- package/dist/src/components/AutoComplete/AutoComplete.d.ts +7 -3
- package/dist/src/components/Avatar/Avatar.d.ts +2 -6
- package/dist/src/components/Badge/Badge.d.ts +2 -5
- package/dist/src/components/Breadcrumb/Breadcrumb.d.ts +1 -2
- package/dist/src/components/Button/Button.d.ts +2 -16
- package/dist/src/components/Card/Card.d.ts +4 -6
- package/dist/src/components/Checkbox/Checkbox.d.ts +4 -4
- package/dist/src/components/Checkbox/CheckboxGroup.d.ts +7 -3
- package/dist/src/components/Chip/Chip.d.ts +1 -10
- package/dist/src/components/Container/Container.d.ts +1 -11
- package/dist/src/components/DatePicker/DatePicker.d.ts +7 -3
- package/dist/src/components/Dropdown/Dropdown.d.ts +2 -4
- package/dist/src/components/Flex/Flex.d.ts +2 -11
- package/dist/src/components/FormControlLayout/FormControlLayout.d.ts +2 -7
- package/dist/src/components/FormControlWrapper/FormControlWrapper.d.ts +1 -15
- package/dist/src/components/Group/Group.d.ts +1 -10
- package/dist/src/components/HoverCard/HoverCard.d.ts +1 -11
- package/dist/src/components/Label/Label.d.ts +1 -14
- package/dist/src/components/Link/Link.d.ts +2 -11
- package/dist/src/components/Loader/Loader.d.ts +2 -7
- package/dist/src/components/Menu/Menu.d.ts +4 -3
- package/dist/src/components/Modal/Modal.d.ts +2 -1
- package/dist/src/components/NumberInput/NumberInput.d.ts +2 -4
- package/dist/src/components/Pagination/Pagination.d.ts +2 -4
- package/dist/src/components/Panel/Panel.d.ts +2 -9
- package/dist/src/components/Popover/Popover.d.ts +1 -11
- package/dist/src/components/Radio/Radio.d.ts +4 -4
- package/dist/src/components/Radio/RadioGroup.d.ts +7 -3
- package/dist/src/components/ReadOnlyField/ReadOnlyField.d.ts +2 -10
- package/dist/src/components/SegmentedControl/SegmentedControl.d.ts +1 -11
- package/dist/src/components/Slider/Slider.d.ts +7 -13
- package/dist/src/components/Stack/Stack.d.ts +2 -9
- package/dist/src/components/Stepper/Stepper.d.ts +2 -4
- package/dist/src/components/Switch/Switch.d.ts +4 -4
- package/dist/src/components/Switch/SwitchGroup.d.ts +7 -3
- package/dist/src/components/Table/Table.d.ts +2 -1
- package/dist/src/components/Tabs/Tabs.d.ts +2 -4
- package/dist/src/components/Text/Text.d.ts +2 -11
- package/dist/src/components/TextArea/TextArea.d.ts +2 -8
- package/dist/src/components/TextField/TextField.d.ts +7 -3
- package/dist/src/components/TimePicker/TimePicker.d.ts +2 -1
- package/dist/src/components/Timeline/Timeline.d.ts +2 -1
- package/dist/src/components/Timeline/TimelineItem.d.ts +1 -12
- package/dist/src/components/Title/Title.d.ts +1 -7
- package/dist/src/components/Toast/Toast.d.ts +1 -12
- package/dist/src/components/Tooltip/Tooltip.d.ts +1 -12
- package/dist/src/components/TransferList/TransferList.d.ts +2 -1
- package/dist/src/utils/RequireAccessibleLabel.d.ts +1 -18
- package/dist/src/utils/filterStylingProps.d.ts +1 -11
- package/llms.txt +16 -0
- package/package.json +9 -2
- package/src/components/Accordion/Accordion.module.css +1 -2
- package/src/components/Accordion/Accordion.tsx +15 -28
- package/src/components/AssistiveElement/AssistiveElement.tsx +1 -6
- package/src/components/AutoComplete/AutoComplete.tsx +4 -1
- package/src/components/Avatar/Avatar.tsx +1 -5
- package/src/components/Badge/Badge.tsx +1 -4
- package/src/components/Breadcrumb/Breadcrumb.tsx +1 -2
- package/src/components/Button/Button.module.css +18 -45
- package/src/components/Button/Button.tsx +1 -15
- package/src/components/Card/Card.tsx +11 -6
- package/src/components/Checkbox/Checkbox.module.css +6 -10
- package/src/components/Checkbox/Checkbox.tsx +19 -14
- package/src/components/Checkbox/CheckboxGroup.tsx +4 -1
- package/src/components/Chip/CHIP_IMPLEMENTATION_NOTES.md +4 -1
- package/src/components/Chip/Chip.module.css +36 -28
- package/src/components/Chip/Chip.tsx +8 -15
- package/src/components/Container/Container.tsx +1 -19
- package/src/components/DatePicker/DatePicker.module.css +2 -2
- package/src/components/DatePicker/DatePicker.tsx +4 -1
- package/src/components/Dropdown/Dropdown.tsx +4 -4
- package/src/components/Flex/Flex.tsx +2 -13
- package/src/components/FormControlLayout/FormControlLayout.module.css +6 -18
- package/src/components/FormControlLayout/FormControlLayout.tsx +4 -8
- package/src/components/FormControlWrapper/FormControlWrapper.tsx +2 -15
- package/src/components/Group/Group.tsx +2 -13
- package/src/components/HoverCard/HoverCard.tsx +1 -8
- package/src/components/Label/Label.module.css +5 -10
- package/src/components/Label/Label.tsx +1 -14
- package/src/components/Link/Link.module.css +4 -3
- package/src/components/Link/Link.stories.tsx +2 -3
- package/src/components/Link/Link.tsx +1 -10
- package/src/components/Loader/Loader.module.css +1 -2
- package/src/components/Loader/Loader.tsx +1 -7
- package/src/components/Menu/Menu.tsx +5 -1
- package/src/components/Modal/Modal.tsx +3 -1
- package/src/components/NumberInput/NumberInput.tsx +4 -4
- package/src/components/Pagination/Pagination.module.css +12 -24
- package/src/components/Pagination/Pagination.stories.tsx +0 -8
- package/src/components/Pagination/Pagination.tsx +5 -4
- package/src/components/Panel/Panel.tsx +1 -8
- package/src/components/Popover/Popover.tsx +1 -8
- package/src/components/Radio/Radio.module.css +4 -10
- package/src/components/Radio/Radio.tsx +19 -14
- package/src/components/Radio/RadioGroup.tsx +4 -1
- package/src/components/ReadOnlyField/ReadOnlyField.module.css +9 -18
- package/src/components/ReadOnlyField/ReadOnlyField.tsx +4 -11
- package/src/components/SegmentedControl/SegmentedControl.module.css +20 -44
- package/src/components/SegmentedControl/SegmentedControl.tsx +1 -11
- package/src/components/Slider/Slider.module.css +1 -4
- package/src/components/Slider/Slider.tsx +4 -12
- package/src/components/Stack/Stack.tsx +2 -11
- package/src/components/Stepper/Stepper.tsx +1 -7
- package/src/components/Switch/Switch.tsx +19 -11
- package/src/components/Switch/SwitchGroup.tsx +4 -1
- package/src/components/Table/Table.tsx +3 -1
- package/src/components/Tabs/Tabs.tsx +1 -7
- package/src/components/Text/Text.tsx +2 -16
- package/src/components/TextArea/TextArea.tsx +4 -8
- package/src/components/TextField/TextField.tsx +4 -1
- package/src/components/TimePicker/TimePicker.tsx +3 -1
- package/src/components/Timeline/Timeline.tsx +4 -1
- package/src/components/Timeline/TimelineItem.tsx +1 -12
- package/src/components/Title/Title.tsx +1 -6
- package/src/components/Toast/Toast.tsx +1 -13
- package/src/components/Tooltip/Tooltip.tsx +1 -9
- package/src/components/TransferList/TransferList.tsx +3 -1
- package/src/utils/RequireAccessibleLabel.ts +1 -12
- package/src/utils/filterStylingProps.ts +7 -20
|
@@ -13,13 +13,16 @@ import { type RecursicaFormControlWrapperProps } from "../FormControlWrapper/For
|
|
|
13
13
|
import { WithReadOnlyWrapper } from "../ReadOnlyField/WithReadOnlyWrapper";
|
|
14
14
|
import styles from "./Radio.module.css";
|
|
15
15
|
|
|
16
|
+
import { type RecursicaRadioGroupProps as BaseRecursicaRadioGroupProps } from "@recursica/adapter-common";
|
|
17
|
+
|
|
16
18
|
export interface RecursicaRadioGroupProps
|
|
17
19
|
extends Omit<MantineRadioGroupProps, "size" | "labelProps">,
|
|
18
20
|
Omit<
|
|
19
21
|
RecursicaFormControlWrapperProps,
|
|
20
22
|
"controlMaxWidth" | "controlMinWidth"
|
|
21
23
|
>,
|
|
22
|
-
ReadOnlyControlProps
|
|
24
|
+
ReadOnlyControlProps,
|
|
25
|
+
BaseRecursicaRadioGroupProps {}
|
|
23
26
|
|
|
24
27
|
export type RadioGroupProps = RecursicaOverStyled<RecursicaRadioGroupProps>;
|
|
25
28
|
|
|
@@ -22,42 +22,33 @@
|
|
|
22
22
|
word-break: break-word;
|
|
23
23
|
padding: 0; /* HARDCODE: read-only fields have no specific padding defined by tokens, zeroing it. */
|
|
24
24
|
font-family: var(
|
|
25
|
-
--recursica_ui-kit_components_read-only-field_properties_text_font-family
|
|
26
|
-
inherit
|
|
25
|
+
--recursica_ui-kit_components_read-only-field_properties_text_font-family
|
|
27
26
|
);
|
|
28
27
|
font-size: var(
|
|
29
|
-
--recursica_ui-kit_components_read-only-field_properties_text_font-size
|
|
30
|
-
1rem
|
|
28
|
+
--recursica_ui-kit_components_read-only-field_properties_text_font-size
|
|
31
29
|
);
|
|
32
30
|
font-weight: var(
|
|
33
|
-
--recursica_ui-kit_components_read-only-field_properties_text_font-weight
|
|
34
|
-
normal
|
|
31
|
+
--recursica_ui-kit_components_read-only-field_properties_text_font-weight
|
|
35
32
|
);
|
|
36
33
|
letter-spacing: var(
|
|
37
|
-
--recursica_ui-kit_components_read-only-field_properties_text_letter-spacing
|
|
38
|
-
normal
|
|
34
|
+
--recursica_ui-kit_components_read-only-field_properties_text_letter-spacing
|
|
39
35
|
);
|
|
40
36
|
line-height: var(
|
|
41
|
-
--recursica_ui-kit_components_read-only-field_properties_text_line-height
|
|
42
|
-
1.5
|
|
37
|
+
--recursica_ui-kit_components_read-only-field_properties_text_line-height
|
|
43
38
|
);
|
|
44
39
|
font-style: var(
|
|
45
|
-
--recursica_ui-kit_components_read-only-field_properties_text_font-style
|
|
46
|
-
normal
|
|
40
|
+
--recursica_ui-kit_components_read-only-field_properties_text_font-style
|
|
47
41
|
);
|
|
48
42
|
text-decoration: var(
|
|
49
|
-
--recursica_ui-kit_components_read-only-field_properties_text_text-decoration
|
|
50
|
-
none
|
|
43
|
+
--recursica_ui-kit_components_read-only-field_properties_text_text-decoration
|
|
51
44
|
);
|
|
52
45
|
text-transform: var(
|
|
53
|
-
--recursica_ui-kit_components_read-only-field_properties_text_text-transform
|
|
54
|
-
none
|
|
46
|
+
--recursica_ui-kit_components_read-only-field_properties_text_text-transform
|
|
55
47
|
);
|
|
56
48
|
color: var(
|
|
57
49
|
--recursica_ui-kit_components_read-only-field_properties_colors_text
|
|
58
50
|
);
|
|
59
51
|
min-height: var(
|
|
60
|
-
--recursica_ui-kit_components_read-only-field_properties_min-height
|
|
61
|
-
32px
|
|
52
|
+
--recursica_ui-kit_components_read-only-field_properties_min-height
|
|
62
53
|
);
|
|
63
54
|
}
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
|
2
2
|
import React, { forwardRef } from "react";
|
|
3
3
|
import {
|
|
4
|
-
ReadOnlyFieldType,
|
|
5
4
|
EmptyValueRenderer,
|
|
6
5
|
type ReadOnlyControlProps,
|
|
7
6
|
} from "@recursica/adapter-common";
|
|
@@ -16,21 +15,15 @@ import {
|
|
|
16
15
|
import { ReadOnlyTextField } from "./ReadOnlyTextField";
|
|
17
16
|
import styles from "./ReadOnlyField.module.css";
|
|
18
17
|
|
|
18
|
+
import { type RecursicaReadOnlyFieldProps as BaseRecursicaReadOnlyFieldProps } from "@recursica/adapter-common";
|
|
19
|
+
|
|
19
20
|
export interface RecursicaReadOnlyFieldProps
|
|
20
21
|
extends Omit<
|
|
21
22
|
FormControlWrapperProps,
|
|
22
23
|
"children" | "overStyled" | "controlMaxWidth" | "controlMinWidth"
|
|
23
24
|
>,
|
|
24
|
-
Pick<ReadOnlyControlProps, "emptyValueComponent"
|
|
25
|
-
|
|
26
|
-
value?: any;
|
|
27
|
-
/** The data type formatting rules bounding how the string is presented to the user */
|
|
28
|
-
type?: ReadOnlyFieldType;
|
|
29
|
-
/** Pass the native maximum width design variable dynamically bounding the specific wrapper width exclusively. */
|
|
30
|
-
controlMaxWidth?: string | undefined;
|
|
31
|
-
/** Pass the native minimum width design variable dynamically bounding the specific wrapper width exclusively. */
|
|
32
|
-
controlMinWidth?: string | undefined;
|
|
33
|
-
}
|
|
25
|
+
Pick<ReadOnlyControlProps, "emptyValueComponent">,
|
|
26
|
+
BaseRecursicaReadOnlyFieldProps {}
|
|
34
27
|
|
|
35
28
|
export type ReadOnlyFieldProps =
|
|
36
29
|
RecursicaOverStyled<RecursicaReadOnlyFieldProps>;
|
|
@@ -25,8 +25,7 @@
|
|
|
25
25
|
--recursica_ui-kit_components_segmented-control_properties_padding-horizontal
|
|
26
26
|
);
|
|
27
27
|
box-shadow: var(
|
|
28
|
-
--recursica_ui-kit_components_segmented-control_properties_elevation
|
|
29
|
-
none
|
|
28
|
+
--recursica_ui-kit_components_segmented-control_properties_elevation
|
|
30
29
|
);
|
|
31
30
|
gap: var(--recursica_ui-kit_components_segmented-control_properties_item-gap);
|
|
32
31
|
}
|
|
@@ -42,10 +41,7 @@
|
|
|
42
41
|
--recursica_ui-kit_components_segmented-control-item_properties_item_height
|
|
43
42
|
);
|
|
44
43
|
border-radius: var(
|
|
45
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected_border-radius
|
|
46
|
-
var(
|
|
47
|
-
--recursica_ui-kit_components_segmented-control-item_properties_item_border-radius
|
|
48
|
-
)
|
|
44
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected_border-radius
|
|
49
45
|
);
|
|
50
46
|
|
|
51
47
|
border: var(
|
|
@@ -63,41 +59,32 @@
|
|
|
63
59
|
);
|
|
64
60
|
|
|
65
61
|
font-family: var(
|
|
66
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-family
|
|
67
|
-
inherit
|
|
62
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-family
|
|
68
63
|
);
|
|
69
64
|
font-size: var(
|
|
70
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-size
|
|
71
|
-
inherit
|
|
65
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-size
|
|
72
66
|
);
|
|
73
67
|
font-style: var(
|
|
74
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-style
|
|
75
|
-
inherit
|
|
68
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-style
|
|
76
69
|
);
|
|
77
70
|
font-weight: var(
|
|
78
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-weight
|
|
79
|
-
inherit
|
|
71
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_font-weight
|
|
80
72
|
);
|
|
81
73
|
letter-spacing: var(
|
|
82
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_letter-spacing
|
|
83
|
-
inherit
|
|
74
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_letter-spacing
|
|
84
75
|
);
|
|
85
76
|
line-height: var(
|
|
86
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_line-height
|
|
87
|
-
inherit
|
|
77
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_line-height
|
|
88
78
|
);
|
|
89
79
|
text-decoration: var(
|
|
90
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_text-decoration
|
|
91
|
-
inherit
|
|
80
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_text-decoration
|
|
92
81
|
);
|
|
93
82
|
text-transform: var(
|
|
94
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_text-transform
|
|
95
|
-
inherit
|
|
83
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected-text_text-transform
|
|
96
84
|
);
|
|
97
85
|
|
|
98
86
|
color: var(
|
|
99
|
-
--recursica_ui-kit_components_segmented-control-item_properties_unselected_colors_text-color
|
|
100
|
-
inherit
|
|
87
|
+
--recursica_ui-kit_components_segmented-control-item_properties_unselected_colors_text-color
|
|
101
88
|
);
|
|
102
89
|
|
|
103
90
|
display: flex;
|
|
@@ -156,10 +143,7 @@
|
|
|
156
143
|
--recursica_ui-kit_components_segmented-control-item_properties_selected_elevation
|
|
157
144
|
);
|
|
158
145
|
border-radius: var(
|
|
159
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected_border-radius
|
|
160
|
-
var(
|
|
161
|
-
--recursica_ui-kit_components_segmented-control-item_properties_item_border-radius
|
|
162
|
-
)
|
|
146
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected_border-radius
|
|
163
147
|
);
|
|
164
148
|
}
|
|
165
149
|
|
|
@@ -169,35 +153,27 @@
|
|
|
169
153
|
--recursica_ui-kit_components_segmented-control-item_properties_selected_colors_text-color
|
|
170
154
|
);
|
|
171
155
|
font-family: var(
|
|
172
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-family
|
|
173
|
-
inherit
|
|
156
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-family
|
|
174
157
|
);
|
|
175
158
|
font-size: var(
|
|
176
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-size
|
|
177
|
-
inherit
|
|
159
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-size
|
|
178
160
|
);
|
|
179
161
|
font-style: var(
|
|
180
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-style
|
|
181
|
-
inherit
|
|
162
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-style
|
|
182
163
|
);
|
|
183
164
|
font-weight: var(
|
|
184
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-weight
|
|
185
|
-
inherit
|
|
165
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_font-weight
|
|
186
166
|
);
|
|
187
167
|
letter-spacing: var(
|
|
188
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_letter-spacing
|
|
189
|
-
inherit
|
|
168
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_letter-spacing
|
|
190
169
|
);
|
|
191
170
|
line-height: var(
|
|
192
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_line-height
|
|
193
|
-
inherit
|
|
171
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_line-height
|
|
194
172
|
);
|
|
195
173
|
text-decoration: var(
|
|
196
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_text-decoration
|
|
197
|
-
inherit
|
|
174
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_text-decoration
|
|
198
175
|
);
|
|
199
176
|
text-transform: var(
|
|
200
|
-
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_text-transform
|
|
201
|
-
inherit
|
|
177
|
+
--recursica_ui-kit_components_segmented-control-item_properties_selected-text_text-transform
|
|
202
178
|
);
|
|
203
179
|
}
|
|
@@ -9,17 +9,7 @@ import {
|
|
|
9
9
|
} from "../../utils/filterStylingProps";
|
|
10
10
|
import styles from "./SegmentedControl.module.css";
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
/** The orientation of the control */
|
|
14
|
-
orientation?: "horizontal" | "vertical";
|
|
15
|
-
/** If true, the control will take up the full width of its container */
|
|
16
|
-
fullWidth?: boolean;
|
|
17
|
-
/**
|
|
18
|
-
* SegmentedControl should NOT be allowed to be disabled by design.
|
|
19
|
-
* This component explicitly disables the `disabled` prop.
|
|
20
|
-
*/
|
|
21
|
-
disabled?: never;
|
|
22
|
-
}
|
|
12
|
+
import { type RecursicaSegmentedControlProps } from "@recursica/adapter-common";
|
|
23
13
|
|
|
24
14
|
export type SegmentedControlProps = RecursicaOverStyled<
|
|
25
15
|
Omit<
|
|
@@ -189,10 +189,7 @@
|
|
|
189
189
|
position: absolute;
|
|
190
190
|
bottom: calc(
|
|
191
191
|
100% +
|
|
192
|
-
var(
|
|
193
|
-
--recursica_ui-kit_globals_form_properties_label-field-gap-vertical,
|
|
194
|
-
8px
|
|
195
|
-
)
|
|
192
|
+
var(--recursica_ui-kit_globals_form_properties_label-field-gap-vertical)
|
|
196
193
|
);
|
|
197
194
|
right: 0;
|
|
198
195
|
white-space: nowrap;
|
|
@@ -14,6 +14,8 @@ import { WithReadOnlyWrapper } from "../ReadOnlyField/WithReadOnlyWrapper";
|
|
|
14
14
|
|
|
15
15
|
import styles from "./Slider.module.css";
|
|
16
16
|
|
|
17
|
+
import { type RecursicaSliderProps as BaseRecursicaSliderProps } from "@recursica/adapter-common";
|
|
18
|
+
|
|
17
19
|
export interface RecursicaSliderProps
|
|
18
20
|
extends Omit<
|
|
19
21
|
MantineSliderProps,
|
|
@@ -30,18 +32,8 @@ export interface RecursicaSliderProps
|
|
|
30
32
|
"controlMaxWidth" | "controlMinWidth"
|
|
31
33
|
>,
|
|
32
34
|
Pick<InputWrapperProps, "error" | "required" | "withAsterisk">,
|
|
33
|
-
ReadOnlyControlProps
|
|
34
|
-
|
|
35
|
-
label?: React.ReactNode;
|
|
36
|
-
/** Floating tooltip shown above the thumb when dragging. Replaces Mantine's `label`. */
|
|
37
|
-
tooltipLabel?: MantineSliderProps["label"];
|
|
38
|
-
/** An optional icon rendered to the left of the slider track. */
|
|
39
|
-
icon?: React.ReactNode;
|
|
40
|
-
/** Whether to render a numeric input field side-by-side or stacked with the track. Defaults to false. */
|
|
41
|
-
showInput?: boolean;
|
|
42
|
-
/** Whether to render min and max labels below the track. Defaults to true. */
|
|
43
|
-
showMinMaxLabels?: boolean;
|
|
44
|
-
}
|
|
35
|
+
ReadOnlyControlProps,
|
|
36
|
+
BaseRecursicaSliderProps {}
|
|
45
37
|
|
|
46
38
|
export type SliderProps = RecursicaOverStyled<RecursicaSliderProps>;
|
|
47
39
|
|
|
@@ -4,19 +4,10 @@ import {
|
|
|
4
4
|
type StackProps as MantineStackProps,
|
|
5
5
|
createPolymorphicComponent,
|
|
6
6
|
} from "@mantine/core";
|
|
7
|
-
import {
|
|
8
|
-
type RecursicaSpacing,
|
|
9
|
-
mapLayoutProps,
|
|
10
|
-
} from "../../utils/filterStylingProps";
|
|
7
|
+
import { mapLayoutProps } from "../../utils/filterStylingProps";
|
|
11
8
|
import styles from "./Stack.module.css";
|
|
12
9
|
|
|
13
|
-
|
|
14
|
-
/**
|
|
15
|
-
* Children components inside the stack
|
|
16
|
-
*/
|
|
17
|
-
children?: React.ReactNode;
|
|
18
|
-
gap?: MantineStackProps["gap"] | RecursicaSpacing;
|
|
19
|
-
}
|
|
10
|
+
import { type RecursicaStackProps } from "@recursica/adapter-common";
|
|
20
11
|
|
|
21
12
|
/**
|
|
22
13
|
* Stack flex layout wrapper.
|
|
@@ -9,13 +9,7 @@ import {
|
|
|
9
9
|
} from "../../utils/filterStylingProps";
|
|
10
10
|
import styles from "./Stepper.module.css";
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
extends Omit<
|
|
14
|
-
MantineStepperProps,
|
|
15
|
-
"size" | "color" | "radius" | "iconSize" | "contentPadding"
|
|
16
|
-
> {
|
|
17
|
-
size?: "small" | "large";
|
|
18
|
-
}
|
|
12
|
+
import { type RecursicaStepperProps } from "@recursica/adapter-common";
|
|
19
13
|
|
|
20
14
|
export type StepperProps = RecursicaOverStyled<RecursicaStepperProps>;
|
|
21
15
|
|
|
@@ -11,7 +11,10 @@ import {
|
|
|
11
11
|
filterStylingProps,
|
|
12
12
|
type RecursicaOverStyled,
|
|
13
13
|
} from "../../utils/filterStylingProps";
|
|
14
|
-
import {
|
|
14
|
+
import {
|
|
15
|
+
type RequireAccessibleLabel,
|
|
16
|
+
type RecursicaSwitchProps,
|
|
17
|
+
} from "@recursica/adapter-common";
|
|
15
18
|
import {
|
|
16
19
|
FormControlLayout,
|
|
17
20
|
type FormControlLayoutProps,
|
|
@@ -20,16 +23,21 @@ import styles from "./Switch.module.css";
|
|
|
20
23
|
|
|
21
24
|
import { SwitchGroup } from "./SwitchGroup";
|
|
22
25
|
|
|
23
|
-
export type
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
26
|
+
export type SwitchWrapperProps = Omit<
|
|
27
|
+
MantineSwitchProps,
|
|
28
|
+
"size" | "color" | "radius" | "variant"
|
|
29
|
+
> &
|
|
30
|
+
RecursicaSwitchProps &
|
|
31
|
+
ReadOnlyControlProps &
|
|
32
|
+
Pick<
|
|
33
|
+
FormControlLayoutProps,
|
|
34
|
+
"formLayout" | "labelSize" | "controlMaxWidth" | "controlMinWidth"
|
|
35
|
+
>;
|
|
36
|
+
|
|
37
|
+
export type RecursicaSwitchPropsAlias =
|
|
38
|
+
RequireAccessibleLabel<SwitchWrapperProps>;
|
|
39
|
+
|
|
40
|
+
export type SwitchProps = RecursicaOverStyled<RecursicaSwitchPropsAlias>;
|
|
33
41
|
|
|
34
42
|
type SwitchComponent = React.ForwardRefExoticComponent<
|
|
35
43
|
SwitchProps & React.RefAttributes<HTMLInputElement>
|
|
@@ -13,13 +13,16 @@ import { type RecursicaFormControlWrapperProps } from "../FormControlWrapper/For
|
|
|
13
13
|
import { WithReadOnlyWrapper } from "../ReadOnlyField/WithReadOnlyWrapper";
|
|
14
14
|
import styles from "./Switch.module.css";
|
|
15
15
|
|
|
16
|
+
import { type RecursicaSwitchGroupProps as BaseRecursicaSwitchGroupProps } from "@recursica/adapter-common";
|
|
17
|
+
|
|
16
18
|
export interface RecursicaSwitchGroupProps
|
|
17
19
|
extends Omit<MantineSwitchGroupProps, "size" | "labelProps">,
|
|
18
20
|
Omit<
|
|
19
21
|
RecursicaFormControlWrapperProps,
|
|
20
22
|
"controlMaxWidth" | "controlMinWidth"
|
|
21
23
|
>,
|
|
22
|
-
ReadOnlyControlProps
|
|
24
|
+
ReadOnlyControlProps,
|
|
25
|
+
BaseRecursicaSwitchGroupProps {}
|
|
23
26
|
|
|
24
27
|
export type SwitchGroupProps = RecursicaOverStyled<RecursicaSwitchGroupProps>;
|
|
25
28
|
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { type RecursicaTableProps } from "@recursica/adapter-common";
|
|
2
3
|
|
|
3
|
-
export type TableProps = React.HTMLAttributes<HTMLDivElement
|
|
4
|
+
export type TableProps = React.HTMLAttributes<HTMLDivElement> &
|
|
5
|
+
RecursicaTableProps;
|
|
4
6
|
|
|
5
7
|
export const Table: React.FC<TableProps> = (props) => {
|
|
6
8
|
return <div {...props}>Table</div>;
|
|
@@ -12,13 +12,7 @@ import {
|
|
|
12
12
|
} from "../../utils/filterStylingProps";
|
|
13
13
|
import styles from "./Tabs.module.css";
|
|
14
14
|
|
|
15
|
-
|
|
16
|
-
extends Omit<
|
|
17
|
-
MantineTabsProps,
|
|
18
|
-
"variant" | "classNames" | "color" | "radius"
|
|
19
|
-
> {
|
|
20
|
-
variant?: "default" | "outline" | "pills";
|
|
21
|
-
}
|
|
15
|
+
import { type RecursicaTabsProps } from "@recursica/adapter-common";
|
|
22
16
|
|
|
23
17
|
export type TabsProps = RecursicaOverStyled<RecursicaTabsProps>;
|
|
24
18
|
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { forwardRef
|
|
1
|
+
import { forwardRef } from "react";
|
|
2
2
|
import {
|
|
3
3
|
Text as MantineText,
|
|
4
4
|
type TextProps as MantineTextProps,
|
|
@@ -9,21 +9,7 @@ import {
|
|
|
9
9
|
type RecursicaOverStyled,
|
|
10
10
|
} from "../../utils/filterStylingProps";
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
| "body"
|
|
14
|
-
| "body-small"
|
|
15
|
-
| "caption"
|
|
16
|
-
| "overline"
|
|
17
|
-
| "subtitle"
|
|
18
|
-
| "subtitle-small";
|
|
19
|
-
|
|
20
|
-
export type RecursicaTextProps = Omit<MantineTextProps, "variant"> & {
|
|
21
|
-
/**
|
|
22
|
-
* The explicit typography hierarchy dictated by Recursica's global design tokens.
|
|
23
|
-
*/
|
|
24
|
-
variant?: TextVariant;
|
|
25
|
-
children?: ReactNode;
|
|
26
|
-
};
|
|
12
|
+
import { type RecursicaTextProps } from "@recursica/adapter-common";
|
|
27
13
|
|
|
28
14
|
export type TextProps = RecursicaOverStyled<RecursicaTextProps>;
|
|
29
15
|
|
|
@@ -12,6 +12,8 @@ import { type RecursicaFormControlWrapperProps } from "../FormControlWrapper/For
|
|
|
12
12
|
import { WithReadOnlyWrapper } from "../ReadOnlyField/WithReadOnlyWrapper";
|
|
13
13
|
import styles from "./TextArea.module.css";
|
|
14
14
|
|
|
15
|
+
import { type RecursicaTextAreaProps as BaseRecursicaTextAreaProps } from "@recursica/adapter-common";
|
|
16
|
+
|
|
15
17
|
export interface RecursicaTextAreaProps
|
|
16
18
|
extends Omit<
|
|
17
19
|
MantineTextareaProps,
|
|
@@ -28,14 +30,8 @@ export interface RecursicaTextAreaProps
|
|
|
28
30
|
| "labelWithEditIcon"
|
|
29
31
|
| "onLabelEditClick"
|
|
30
32
|
>,
|
|
31
|
-
ReadOnlyControlProps
|
|
32
|
-
|
|
33
|
-
maxRows?: number;
|
|
34
|
-
/** Minimum rows of autosize textarea */
|
|
35
|
-
minRows?: number;
|
|
36
|
-
/** If set, enables textarea height growing with its content */
|
|
37
|
-
autosize?: boolean;
|
|
38
|
-
}
|
|
33
|
+
ReadOnlyControlProps,
|
|
34
|
+
BaseRecursicaTextAreaProps {}
|
|
39
35
|
|
|
40
36
|
export type TextAreaProps = RecursicaOverStyled<RecursicaTextAreaProps>;
|
|
41
37
|
|
|
@@ -9,6 +9,8 @@ import { type RecursicaFormControlWrapperProps } from "../FormControlWrapper/For
|
|
|
9
9
|
import { WithReadOnlyWrapper } from "../ReadOnlyField/WithReadOnlyWrapper";
|
|
10
10
|
import styles from "./TextField.module.css";
|
|
11
11
|
|
|
12
|
+
import { type RecursicaTextFieldProps as BaseRecursicaTextFieldProps } from "@recursica/adapter-common";
|
|
13
|
+
|
|
12
14
|
export interface RecursicaTextFieldProps
|
|
13
15
|
extends Omit<InputProps, "size" | "variant" | "radius" | "wrapperProps">,
|
|
14
16
|
Pick<
|
|
@@ -23,7 +25,8 @@ export interface RecursicaTextFieldProps
|
|
|
23
25
|
RecursicaFormControlWrapperProps,
|
|
24
26
|
"controlMaxWidth" | "controlMinWidth"
|
|
25
27
|
>,
|
|
26
|
-
ReadOnlyControlProps
|
|
28
|
+
ReadOnlyControlProps,
|
|
29
|
+
BaseRecursicaTextFieldProps {}
|
|
27
30
|
|
|
28
31
|
export type TextFieldProps = RecursicaOverStyled<RecursicaTextFieldProps>;
|
|
29
32
|
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { type RecursicaTimePickerProps } from "@recursica/adapter-common";
|
|
2
3
|
|
|
3
|
-
export type TimePickerProps = React.HTMLAttributes<HTMLDivElement
|
|
4
|
+
export type TimePickerProps = React.HTMLAttributes<HTMLDivElement> &
|
|
5
|
+
RecursicaTimePickerProps;
|
|
4
6
|
|
|
5
7
|
export const TimePicker: React.FC<TimePickerProps> = (props) => {
|
|
6
8
|
return <div {...props}>TimePicker</div>;
|
|
@@ -10,13 +10,16 @@ import {
|
|
|
10
10
|
import styles from "./Timeline.module.css";
|
|
11
11
|
import { TimelineItem } from "./TimelineItem";
|
|
12
12
|
|
|
13
|
+
import { type RecursicaTimelineProps } from "@recursica/adapter-common";
|
|
14
|
+
|
|
13
15
|
/**
|
|
14
16
|
* Properties for the strictly-tokenized Timeline component.
|
|
15
17
|
* Native Mantine abstract properties like `color`, `radius`, `bulletSize`, and `lineWidth`
|
|
16
18
|
* have been stripped out to strictly enforce the structural mappings of the Recursica UI Kit.
|
|
17
19
|
*/
|
|
18
20
|
export type TimelineProps = RecursicaOverStyled<
|
|
19
|
-
Omit<MantineTimelineProps, "color" | "radius" | "bulletSize" | "lineWidth">
|
|
21
|
+
Omit<MantineTimelineProps, "color" | "radius" | "bulletSize" | "lineWidth"> &
|
|
22
|
+
RecursicaTimelineProps
|
|
20
23
|
>;
|
|
21
24
|
|
|
22
25
|
interface TimelineComponent
|
|
@@ -9,18 +9,7 @@ import {
|
|
|
9
9
|
} from "../../utils/filterStylingProps";
|
|
10
10
|
import styles from "./Timeline.module.css";
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* Timestamp text displayed below the description.
|
|
15
|
-
*/
|
|
16
|
-
timestamp?: React.ReactNode;
|
|
17
|
-
/**
|
|
18
|
-
* The structural styling variant of the bullet container.
|
|
19
|
-
* Maps to the UI Kit structural tokens.
|
|
20
|
-
* @default "default"
|
|
21
|
-
*/
|
|
22
|
-
bulletVariant?: "default" | "avatar" | "icon" | "icon-alternative";
|
|
23
|
-
}
|
|
12
|
+
import { type RecursicaTimelineItemProps } from "@recursica/adapter-common";
|
|
24
13
|
|
|
25
14
|
export type TimelineItemProps = RecursicaOverStyled<
|
|
26
15
|
Omit<MantineTimelineItemProps, "radius" | "color" | "lineVariant"> &
|
|
@@ -8,12 +8,7 @@ import {
|
|
|
8
8
|
type RecursicaOverStyled,
|
|
9
9
|
} from "../../utils/filterStylingProps";
|
|
10
10
|
|
|
11
|
-
|
|
12
|
-
/**
|
|
13
|
-
* Enforces semantic HTML headers (h1-h6) cleanly bound to native typographic scaling variables in the design system.
|
|
14
|
-
*/
|
|
15
|
-
order?: 1 | 2 | 3 | 4 | 5 | 6;
|
|
16
|
-
};
|
|
11
|
+
import { type RecursicaTitleProps } from "@recursica/adapter-common";
|
|
17
12
|
|
|
18
13
|
export type TitleProps = RecursicaOverStyled<RecursicaTitleProps>;
|
|
19
14
|
|
|
@@ -9,19 +9,7 @@ import {
|
|
|
9
9
|
} from "../../utils/filterStylingProps";
|
|
10
10
|
import styles from "./Toast.module.css";
|
|
11
11
|
|
|
12
|
-
|
|
13
|
-
/**
|
|
14
|
-
* The visual variant of the toast.
|
|
15
|
-
* @default "default"
|
|
16
|
-
*/
|
|
17
|
-
variant?: "default" | "error" | "success";
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Loading state is natively unsupported by Recursica UI Kit.
|
|
21
|
-
* If a loading state is required, pass a `<Loader size="sm" />` directly into the `icon` prop.
|
|
22
|
-
*/
|
|
23
|
-
loading?: false;
|
|
24
|
-
}
|
|
12
|
+
import { type RecursicaToastProps } from "@recursica/adapter-common";
|
|
25
13
|
|
|
26
14
|
/**
|
|
27
15
|
* Toast component wrapping Mantine's Notification.
|
|
@@ -15,15 +15,7 @@ import styles from "./Tooltip.module.css";
|
|
|
15
15
|
/**
|
|
16
16
|
* Recursica-specific props for Tooltip.
|
|
17
17
|
*/
|
|
18
|
-
|
|
19
|
-
/**
|
|
20
|
-
* Whether to display a beak (arrow) pointing from the tooltip to the target.
|
|
21
|
-
* This is the Recursica equivalent of Mantine's `withArrow`.
|
|
22
|
-
* When both `withBeak` and `withArrow` are provided, `withBeak` takes precedence.
|
|
23
|
-
* @default true
|
|
24
|
-
*/
|
|
25
|
-
withBeak?: boolean;
|
|
26
|
-
}
|
|
18
|
+
import { type RecursicaTooltipProps } from "@recursica/adapter-common";
|
|
27
19
|
|
|
28
20
|
/**
|
|
29
21
|
* Recursica Tooltip component wrapping Mantine's Tooltip.
|
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import React from "react";
|
|
2
|
+
import { type RecursicaTransferListProps } from "@recursica/adapter-common";
|
|
2
3
|
|
|
3
|
-
export type TransferListProps = React.HTMLAttributes<HTMLDivElement
|
|
4
|
+
export type TransferListProps = React.HTMLAttributes<HTMLDivElement> &
|
|
5
|
+
RecursicaTransferListProps;
|
|
4
6
|
|
|
5
7
|
export const TransferList: React.FC<TransferListProps> = (props) => {
|
|
6
8
|
return <div {...props}>TransferList</div>;
|
|
@@ -1,12 +1 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
/**
|
|
4
|
-
* Enforces accessibility by strictly requiring at least one form of labeling:
|
|
5
|
-
* either a visual \`label\`, an \`aria-label\`, or an \`aria-labelledby\`.
|
|
6
|
-
*/
|
|
7
|
-
export type RequireAccessibleLabel<T> = T &
|
|
8
|
-
(
|
|
9
|
-
| { label: ReactNode; "aria-label"?: string; "aria-labelledby"?: string }
|
|
10
|
-
| { label?: ReactNode; "aria-label": string; "aria-labelledby"?: string }
|
|
11
|
-
| { label?: ReactNode; "aria-label"?: string; "aria-labelledby": string }
|
|
12
|
-
);
|
|
1
|
+
export { type RequireAccessibleLabel } from "@recursica/adapter-common";
|