@recursica/mantine-adapter 0.22.0 → 0.24.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 +18 -0
- package/SETUP.md +78 -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 +1897 -1575
- 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 +12 -2
- 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 +18 -2
- 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/dist/test.html +1 -0
- package/llms.txt +16 -0
- package/package.json +7 -3
- 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 +2 -16
- 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_IMPLEMENTATION_NOTES.md +16 -0
- package/src/components/DatePicker/DatePicker.module.css +282 -41
- package/src/components/DatePicker/DatePicker.stories.tsx +127 -4
- package/src/components/DatePicker/DatePicker.tsx +169 -5
- 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.module.css +1 -0
- 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_IMPLEMENTATION_NOTES.md +1 -2
- package/src/components/Loader/Loader.module.css +4 -11
- 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/IMPLEMENTATION_NOTES.md +49 -0
- package/src/components/Slider/Slider.module.css +492 -86
- package/src/components/Slider/Slider.stories.tsx +159 -4
- package/src/components/Slider/Slider.tsx +275 -4
- 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
|
@@ -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";
|
|
@@ -60,19 +60,13 @@ export const BLOCKED_STYLING_KEYS = [
|
|
|
60
60
|
"mih",
|
|
61
61
|
"mah", // Dimensions
|
|
62
62
|
] as const;
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
| "rec-md"
|
|
71
|
-
| "rec-lg"
|
|
72
|
-
| "rec-xl"
|
|
73
|
-
| "rec-2xl";
|
|
74
|
-
|
|
75
|
-
export type RecursicaSize = "small" | "default" | "large";
|
|
63
|
+
export {
|
|
64
|
+
type RecursicaSpacing,
|
|
65
|
+
type RecursicaSize,
|
|
66
|
+
type RecursicaOverStyled,
|
|
67
|
+
type BlockedStylingKeys,
|
|
68
|
+
type ForbiddenStyles,
|
|
69
|
+
} from "@recursica/adapter-common";
|
|
76
70
|
|
|
77
71
|
const LAYOUT_PROPS = new Set([
|
|
78
72
|
"m",
|
|
@@ -101,13 +95,6 @@ export const SPACING_MAP: Record<string, string> = {
|
|
|
101
95
|
"rec-2xl": "var(--recursica_brand_dimensions_general_2xl)",
|
|
102
96
|
};
|
|
103
97
|
|
|
104
|
-
export type ForbiddenStyles = { [K in BlockedStylingKeys]?: never };
|
|
105
|
-
|
|
106
|
-
export type RecursicaOverStyled<T> =
|
|
107
|
-
| (Omit<T, BlockedStylingKeys> &
|
|
108
|
-
ForbiddenStyles & { overStyled?: false | undefined })
|
|
109
|
-
| (T & { overStyled: true });
|
|
110
|
-
|
|
111
98
|
export function mapLayoutProps<T extends Record<string, unknown>>(props: T): T {
|
|
112
99
|
const mapped = { ...props };
|
|
113
100
|
for (const [key, value] of Object.entries(mapped)) {
|