@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.
Files changed (130) hide show
  1. package/ARCHITECTURE.md +15 -0
  2. package/CHANGELOG.md +32 -0
  3. package/SETUP.md +79 -0
  4. package/USAGE.md +55 -0
  5. package/dist/mantine-adapter.cjs +1 -1
  6. package/dist/mantine-adapter.cjs.map +1 -1
  7. package/dist/mantine-adapter.css +1 -1
  8. package/dist/mantine-adapter.js +928 -878
  9. package/dist/mantine-adapter.js.map +1 -1
  10. package/dist/src/components/Accordion/Accordion.d.ts +4 -24
  11. package/dist/src/components/AssistiveElement/AssistiveElement.d.ts +1 -6
  12. package/dist/src/components/AutoComplete/AutoComplete.d.ts +7 -3
  13. package/dist/src/components/Avatar/Avatar.d.ts +2 -6
  14. package/dist/src/components/Badge/Badge.d.ts +2 -5
  15. package/dist/src/components/Breadcrumb/Breadcrumb.d.ts +1 -2
  16. package/dist/src/components/Button/Button.d.ts +2 -16
  17. package/dist/src/components/Card/Card.d.ts +4 -6
  18. package/dist/src/components/Checkbox/Checkbox.d.ts +4 -4
  19. package/dist/src/components/Checkbox/CheckboxGroup.d.ts +7 -3
  20. package/dist/src/components/Chip/Chip.d.ts +1 -10
  21. package/dist/src/components/Container/Container.d.ts +1 -11
  22. package/dist/src/components/DatePicker/DatePicker.d.ts +7 -3
  23. package/dist/src/components/Dropdown/Dropdown.d.ts +2 -4
  24. package/dist/src/components/Flex/Flex.d.ts +2 -11
  25. package/dist/src/components/FormControlLayout/FormControlLayout.d.ts +2 -7
  26. package/dist/src/components/FormControlWrapper/FormControlWrapper.d.ts +1 -15
  27. package/dist/src/components/Group/Group.d.ts +1 -10
  28. package/dist/src/components/HoverCard/HoverCard.d.ts +1 -11
  29. package/dist/src/components/Label/Label.d.ts +1 -14
  30. package/dist/src/components/Link/Link.d.ts +2 -11
  31. package/dist/src/components/Loader/Loader.d.ts +2 -7
  32. package/dist/src/components/Menu/Menu.d.ts +4 -3
  33. package/dist/src/components/Modal/Modal.d.ts +2 -1
  34. package/dist/src/components/NumberInput/NumberInput.d.ts +2 -4
  35. package/dist/src/components/Pagination/Pagination.d.ts +2 -4
  36. package/dist/src/components/Panel/Panel.d.ts +2 -9
  37. package/dist/src/components/Popover/Popover.d.ts +1 -11
  38. package/dist/src/components/Radio/Radio.d.ts +4 -4
  39. package/dist/src/components/Radio/RadioGroup.d.ts +7 -3
  40. package/dist/src/components/ReadOnlyField/ReadOnlyField.d.ts +2 -10
  41. package/dist/src/components/SegmentedControl/SegmentedControl.d.ts +1 -11
  42. package/dist/src/components/Slider/Slider.d.ts +7 -13
  43. package/dist/src/components/Stack/Stack.d.ts +2 -9
  44. package/dist/src/components/Stepper/Stepper.d.ts +2 -4
  45. package/dist/src/components/Switch/Switch.d.ts +4 -4
  46. package/dist/src/components/Switch/SwitchGroup.d.ts +7 -3
  47. package/dist/src/components/Table/Table.d.ts +2 -1
  48. package/dist/src/components/Tabs/Tabs.d.ts +2 -4
  49. package/dist/src/components/Text/Text.d.ts +2 -11
  50. package/dist/src/components/TextArea/TextArea.d.ts +2 -8
  51. package/dist/src/components/TextField/TextField.d.ts +7 -3
  52. package/dist/src/components/TimePicker/TimePicker.d.ts +2 -1
  53. package/dist/src/components/Timeline/Timeline.d.ts +2 -1
  54. package/dist/src/components/Timeline/TimelineItem.d.ts +1 -12
  55. package/dist/src/components/Title/Title.d.ts +1 -7
  56. package/dist/src/components/Toast/Toast.d.ts +1 -12
  57. package/dist/src/components/Tooltip/Tooltip.d.ts +1 -12
  58. package/dist/src/components/TransferList/TransferList.d.ts +2 -1
  59. package/dist/src/utils/RequireAccessibleLabel.d.ts +1 -18
  60. package/dist/src/utils/filterStylingProps.d.ts +1 -11
  61. package/llms.txt +16 -0
  62. package/package.json +9 -2
  63. package/src/components/Accordion/Accordion.module.css +1 -2
  64. package/src/components/Accordion/Accordion.tsx +15 -28
  65. package/src/components/AssistiveElement/AssistiveElement.tsx +1 -6
  66. package/src/components/AutoComplete/AutoComplete.tsx +4 -1
  67. package/src/components/Avatar/Avatar.tsx +1 -5
  68. package/src/components/Badge/Badge.tsx +1 -4
  69. package/src/components/Breadcrumb/Breadcrumb.tsx +1 -2
  70. package/src/components/Button/Button.module.css +18 -45
  71. package/src/components/Button/Button.tsx +1 -15
  72. package/src/components/Card/Card.tsx +11 -6
  73. package/src/components/Checkbox/Checkbox.module.css +6 -10
  74. package/src/components/Checkbox/Checkbox.tsx +19 -14
  75. package/src/components/Checkbox/CheckboxGroup.tsx +4 -1
  76. package/src/components/Chip/CHIP_IMPLEMENTATION_NOTES.md +4 -1
  77. package/src/components/Chip/Chip.module.css +36 -28
  78. package/src/components/Chip/Chip.tsx +8 -15
  79. package/src/components/Container/Container.tsx +1 -19
  80. package/src/components/DatePicker/DatePicker.module.css +2 -2
  81. package/src/components/DatePicker/DatePicker.tsx +4 -1
  82. package/src/components/Dropdown/Dropdown.tsx +4 -4
  83. package/src/components/Flex/Flex.tsx +2 -13
  84. package/src/components/FormControlLayout/FormControlLayout.module.css +6 -18
  85. package/src/components/FormControlLayout/FormControlLayout.tsx +4 -8
  86. package/src/components/FormControlWrapper/FormControlWrapper.tsx +2 -15
  87. package/src/components/Group/Group.tsx +2 -13
  88. package/src/components/HoverCard/HoverCard.tsx +1 -8
  89. package/src/components/Label/Label.module.css +5 -10
  90. package/src/components/Label/Label.tsx +1 -14
  91. package/src/components/Link/Link.module.css +4 -3
  92. package/src/components/Link/Link.stories.tsx +2 -3
  93. package/src/components/Link/Link.tsx +1 -10
  94. package/src/components/Loader/Loader.module.css +1 -2
  95. package/src/components/Loader/Loader.tsx +1 -7
  96. package/src/components/Menu/Menu.tsx +5 -1
  97. package/src/components/Modal/Modal.tsx +3 -1
  98. package/src/components/NumberInput/NumberInput.tsx +4 -4
  99. package/src/components/Pagination/Pagination.module.css +12 -24
  100. package/src/components/Pagination/Pagination.stories.tsx +0 -8
  101. package/src/components/Pagination/Pagination.tsx +5 -4
  102. package/src/components/Panel/Panel.tsx +1 -8
  103. package/src/components/Popover/Popover.tsx +1 -8
  104. package/src/components/Radio/Radio.module.css +4 -10
  105. package/src/components/Radio/Radio.tsx +19 -14
  106. package/src/components/Radio/RadioGroup.tsx +4 -1
  107. package/src/components/ReadOnlyField/ReadOnlyField.module.css +9 -18
  108. package/src/components/ReadOnlyField/ReadOnlyField.tsx +4 -11
  109. package/src/components/SegmentedControl/SegmentedControl.module.css +20 -44
  110. package/src/components/SegmentedControl/SegmentedControl.tsx +1 -11
  111. package/src/components/Slider/Slider.module.css +1 -4
  112. package/src/components/Slider/Slider.tsx +4 -12
  113. package/src/components/Stack/Stack.tsx +2 -11
  114. package/src/components/Stepper/Stepper.tsx +1 -7
  115. package/src/components/Switch/Switch.tsx +19 -11
  116. package/src/components/Switch/SwitchGroup.tsx +4 -1
  117. package/src/components/Table/Table.tsx +3 -1
  118. package/src/components/Tabs/Tabs.tsx +1 -7
  119. package/src/components/Text/Text.tsx +2 -16
  120. package/src/components/TextArea/TextArea.tsx +4 -8
  121. package/src/components/TextField/TextField.tsx +4 -1
  122. package/src/components/TimePicker/TimePicker.tsx +3 -1
  123. package/src/components/Timeline/Timeline.tsx +4 -1
  124. package/src/components/Timeline/TimelineItem.tsx +1 -12
  125. package/src/components/Title/Title.tsx +1 -6
  126. package/src/components/Toast/Toast.tsx +1 -13
  127. package/src/components/Tooltip/Tooltip.tsx +1 -9
  128. package/src/components/TransferList/TransferList.tsx +3 -1
  129. package/src/utils/RequireAccessibleLabel.ts +1 -12
  130. 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
- /** The specific value to be rendered in read-only mode explicitly matching the original field input */
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
- export interface RecursicaSegmentedControlProps {
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
- /** The form control label displayed above or beside the slider track. */
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
- export interface RecursicaStackProps {
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
- export interface RecursicaStepperProps
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 { type RequireAccessibleLabel } from "../../utils/RequireAccessibleLabel";
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 RecursicaSwitchProps = RequireAccessibleLabel<
24
- Omit<MantineSwitchProps, "size" | "color" | "radius" | "variant"> &
25
- ReadOnlyControlProps &
26
- Pick<
27
- FormControlLayoutProps,
28
- "formLayout" | "labelSize" | "controlMaxWidth" | "controlMinWidth"
29
- >
30
- >;
31
-
32
- export type SwitchProps = RecursicaOverStyled<RecursicaSwitchProps>;
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
- export interface RecursicaTabsProps
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, type ReactNode } from "react";
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
- export type TextVariant =
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
- /** Maximum rows for autosize textarea to grow */
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
- export interface RecursicaTimelineItemProps {
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
- export type RecursicaTitleProps = Omit<MantineTitleProps, "order"> & {
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
- export interface RecursicaToastProps {
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
- export interface RecursicaTooltipProps {
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
- import { ReactNode } from "react";
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";