@astral/ui 4.89.0 → 4.90.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/components/Accordion/styles.d.ts +1 -1
- package/components/AutoSaveIndicator/DefaultState/styles.d.ts +1 -1
- package/components/AutoSaveIndicator/ErrorState/styles.d.ts +1 -1
- package/components/AutoSaveIndicator/LoadingState/styles.d.ts +1 -1
- package/components/AutoSaveIndicator/SuccessState/styles.d.ts +1 -1
- package/components/BulletListItem/styles.d.ts +1 -1
- package/components/Chevron/styles.d.ts +1 -1
- package/components/Chip/ChipStatusIcon/styled.d.ts +1 -1
- package/components/ComplianceStatus/styles.d.ts +3 -3
- package/components/CopyTypography/styles.d.ts +1 -1
- package/components/DataGrid/Row/styles.d.ts +1 -1
- package/components/DataGridCollapsibleRow/styles.d.ts +1 -1
- package/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarNextButton/styles.d.ts +2 -2
- package/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarPrevButton/styles.d.ts +2 -2
- package/components/FormHelperText/FormHelperTextContent/styles.d.ts +2 -2
- package/components/HintIcon/HintIcon.d.ts +1 -1
- package/components/HintIcon/HintIcon.js +2 -2
- package/components/HintIcon/Icon/Icon.d.ts +1 -1
- package/components/HintIcon/Icon/Icon.js +11 -4
- package/components/HintIcon/Icon/useLogic/useLogic.d.ts +1 -3
- package/components/HintIcon/Icon/useLogic/useLogic.js +2 -14
- package/components/HintIcon/constants.d.ts +5 -4
- package/components/HintIcon/constants.js +4 -5
- package/components/HintIcon/types.d.ts +6 -0
- package/components/JsonViewer/JsonNode/styles.d.ts +1 -1
- package/components/LegacyNotification/styles.d.ts +4 -4
- package/components/Loader/styles.d.ts +1 -1
- package/components/NavMenu/Item/ItemButton/styles.d.ts +2 -2
- package/components/NewPopover/styles.js +1 -1
- package/components/NewStepper/Step/styles.d.ts +1 -1
- package/components/Notification/styles.d.ts +4 -4
- package/components/SearchField/styles.d.ts +1 -1
- package/components/Stepper/ArrowConnector/ArrowConnector.d.ts +1 -1
- package/components/Stepper/StepIcon/styles.d.ts +5 -5
- package/components/SvgIcon/SvgIcon.js +11 -1
- package/components/SvgIcon/constants.d.ts +4 -0
- package/components/SvgIcon/constants.js +4 -0
- package/components/SvgIcon/styles.js +7 -4
- package/components/SvgIcon/types.d.ts +2 -2
- package/components/Tree/TreeItem/styles.d.ts +1 -1
- package/components/fileUploading/FileInfo/styles.d.ts +1 -1
- package/hook-form/EditableText/styles.d.ts +1 -1
- package/hook-form/FormWizardPageLayout/FormWizardFooter/styles.d.ts +2 -2
- package/node/components/Accordion/styles.d.ts +1 -1
- package/node/components/AutoSaveIndicator/DefaultState/styles.d.ts +1 -1
- package/node/components/AutoSaveIndicator/ErrorState/styles.d.ts +1 -1
- package/node/components/AutoSaveIndicator/LoadingState/styles.d.ts +1 -1
- package/node/components/AutoSaveIndicator/SuccessState/styles.d.ts +1 -1
- package/node/components/BulletListItem/styles.d.ts +1 -1
- package/node/components/Chevron/styles.d.ts +1 -1
- package/node/components/Chip/ChipStatusIcon/styled.d.ts +1 -1
- package/node/components/ComplianceStatus/styles.d.ts +3 -3
- package/node/components/CopyTypography/styles.d.ts +1 -1
- package/node/components/DataGrid/Row/styles.d.ts +1 -1
- package/node/components/DataGridCollapsibleRow/styles.d.ts +1 -1
- package/node/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarNextButton/styles.d.ts +2 -2
- package/node/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarPrevButton/styles.d.ts +2 -2
- package/node/components/FormHelperText/FormHelperTextContent/styles.d.ts +2 -2
- package/node/components/HintIcon/HintIcon.d.ts +1 -1
- package/node/components/HintIcon/HintIcon.js +2 -2
- package/node/components/HintIcon/Icon/Icon.d.ts +1 -1
- package/node/components/HintIcon/Icon/Icon.js +10 -3
- package/node/components/HintIcon/Icon/useLogic/useLogic.d.ts +1 -3
- package/node/components/HintIcon/Icon/useLogic/useLogic.js +2 -14
- package/node/components/HintIcon/constants.d.ts +5 -4
- package/node/components/HintIcon/constants.js +4 -5
- package/node/components/HintIcon/types.d.ts +6 -0
- package/node/components/JsonViewer/JsonNode/styles.d.ts +1 -1
- package/node/components/LegacyNotification/styles.d.ts +4 -4
- package/node/components/Loader/styles.d.ts +1 -1
- package/node/components/NavMenu/Item/ItemButton/styles.d.ts +2 -2
- package/node/components/NewPopover/styles.js +1 -1
- package/node/components/NewStepper/Step/styles.d.ts +1 -1
- package/node/components/Notification/styles.d.ts +4 -4
- package/node/components/SearchField/styles.d.ts +1 -1
- package/node/components/Stepper/ArrowConnector/ArrowConnector.d.ts +1 -1
- package/node/components/Stepper/StepIcon/styles.d.ts +5 -5
- package/node/components/SvgIcon/SvgIcon.js +11 -1
- package/node/components/SvgIcon/constants.d.ts +4 -0
- package/node/components/SvgIcon/constants.js +4 -0
- package/node/components/SvgIcon/styles.js +7 -4
- package/node/components/SvgIcon/types.d.ts +2 -2
- package/node/components/Tree/TreeItem/styles.d.ts +1 -1
- package/node/components/fileUploading/FileInfo/styles.d.ts +1 -1
- package/node/hook-form/EditableText/styles.d.ts +1 -1
- package/node/hook-form/FormWizardPageLayout/FormWizardFooter/styles.d.ts +2 -2
- package/package.json +1 -1
|
@@ -358,7 +358,7 @@ export declare const DotIcon: import("../../styled").StyledComponent<{
|
|
|
358
358
|
children?: import("react").ReactNode;
|
|
359
359
|
color?: string | undefined;
|
|
360
360
|
titleAccess?: string | undefined;
|
|
361
|
-
size?: "sm" | "md" | undefined;
|
|
361
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
362
362
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
363
363
|
theme?: import("@emotion/react").Theme | undefined;
|
|
364
364
|
}, {}, {}>;
|
|
@@ -17,7 +17,7 @@ export declare const StyledEditIcon: import("../../components/styled").StyledCom
|
|
|
17
17
|
children?: import("react").ReactNode;
|
|
18
18
|
color?: string | undefined;
|
|
19
19
|
titleAccess?: string | undefined;
|
|
20
|
-
size?: "sm" | "md" | undefined;
|
|
20
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
21
21
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
22
22
|
theme?: import("@emotion/react").Theme | undefined;
|
|
23
23
|
} & {
|
|
@@ -13,7 +13,7 @@ export declare const StyledPreviousIcon: import("../../../components/styled").St
|
|
|
13
13
|
children?: import("react").ReactNode;
|
|
14
14
|
color?: string | undefined;
|
|
15
15
|
titleAccess?: string | undefined;
|
|
16
|
-
size?: "sm" | "md" | undefined;
|
|
16
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
17
17
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
18
18
|
theme?: import("@emotion/react").Theme | undefined;
|
|
19
19
|
}, {}, {}>;
|
|
@@ -21,7 +21,7 @@ export declare const StyledNextIcon: import("../../../components/styled").Styled
|
|
|
21
21
|
children?: import("react").ReactNode;
|
|
22
22
|
color?: string | undefined;
|
|
23
23
|
titleAccess?: string | undefined;
|
|
24
|
-
size?: "sm" | "md" | undefined;
|
|
24
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
25
25
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
26
26
|
theme?: import("@emotion/react").Theme | undefined;
|
|
27
27
|
}, {}, {}>;
|
|
@@ -42,7 +42,7 @@ export declare const Chevron: import("@emotion/styled/dist/declarations/src/type
|
|
|
42
42
|
children?: import("react").ReactNode;
|
|
43
43
|
color?: string | undefined;
|
|
44
44
|
titleAccess?: string | undefined;
|
|
45
|
-
size?: "sm" | "md" | undefined;
|
|
45
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
46
46
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
47
47
|
theme?: import("@emotion/react").Theme | undefined;
|
|
48
48
|
} & {
|
|
@@ -6,7 +6,7 @@ export declare const DefaultIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
6
6
|
children?: import("react").ReactNode;
|
|
7
7
|
color?: string | undefined;
|
|
8
8
|
titleAccess?: string | undefined;
|
|
9
|
-
size?: "sm" | "md" | undefined;
|
|
9
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
10
10
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
11
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
12
12
|
}, {}, {}>;
|
|
@@ -17,7 +17,7 @@ export declare const ErrorIcon: import("@emotion/styled/dist/declarations/src/ty
|
|
|
17
17
|
children?: import("react").ReactNode;
|
|
18
18
|
color?: string | undefined;
|
|
19
19
|
titleAccess?: string | undefined;
|
|
20
|
-
size?: "sm" | "md" | undefined;
|
|
20
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
21
21
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
22
22
|
theme?: import("@emotion/react").Theme | undefined;
|
|
23
23
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const LoadingIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const SuccessIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -7,7 +7,7 @@ export declare const Icon: import("@emotion/styled/dist/declarations/src/types")
|
|
|
7
7
|
children?: import("react").ReactNode;
|
|
8
8
|
color?: string | undefined;
|
|
9
9
|
titleAccess?: string | undefined;
|
|
10
|
-
size?: "sm" | "md" | undefined;
|
|
10
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
11
11
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
12
12
|
theme?: import("@emotion/react").Theme | undefined;
|
|
13
13
|
}, {}, {}>;
|
|
@@ -6,7 +6,7 @@ export declare const ChevronIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
6
6
|
children?: import("react").ReactNode;
|
|
7
7
|
color?: string | undefined;
|
|
8
8
|
titleAccess?: string | undefined;
|
|
9
|
-
size?: "sm" | "md" | undefined;
|
|
9
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
10
10
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
11
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
12
12
|
} & ChevronWrapperProps, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const StatusIcon: import("@emotion/styled/dist/declarations/src/t
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -20,7 +20,7 @@ export declare const EmptyIcon: import("@emotion/styled/dist/declarations/src/ty
|
|
|
20
20
|
children?: import("react").ReactNode;
|
|
21
21
|
color?: string | undefined;
|
|
22
22
|
titleAccess?: string | undefined;
|
|
23
|
-
size?: "sm" | "md" | undefined;
|
|
23
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
24
24
|
} & import("react").SVGProps<SVGSVGElement>, {}, {}>;
|
|
25
25
|
export declare const RejectIcon: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
|
|
26
26
|
theme?: import("@emotion/react").Theme | undefined;
|
|
@@ -31,7 +31,7 @@ export declare const RejectIcon: import("@emotion/styled/dist/declarations/src/t
|
|
|
31
31
|
children?: import("react").ReactNode;
|
|
32
32
|
color?: string | undefined;
|
|
33
33
|
titleAccess?: string | undefined;
|
|
34
|
-
size?: "sm" | "md" | undefined;
|
|
34
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
35
35
|
} & import("react").SVGProps<SVGSVGElement>, {}, {}>;
|
|
36
36
|
export declare const SuccessIcon: import("@emotion/styled/dist/declarations/src/types").StyledComponent<{
|
|
37
37
|
theme?: import("@emotion/react").Theme | undefined;
|
|
@@ -42,7 +42,7 @@ export declare const SuccessIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
42
42
|
children?: import("react").ReactNode;
|
|
43
43
|
color?: string | undefined;
|
|
44
44
|
titleAccess?: string | undefined;
|
|
45
|
-
size?: "sm" | "md" | undefined;
|
|
45
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
46
46
|
} & import("react").SVGProps<SVGSVGElement>, {}, {}>;
|
|
47
47
|
export declare const StyledLoader: import("@emotion/styled/dist/declarations/src/types").StyledComponent<import("../Loader").LoaderProps & {
|
|
48
48
|
theme?: import("@emotion/react").Theme | undefined;
|
|
@@ -18,7 +18,7 @@ export declare const StyledCopyIcon: import("@emotion/styled/dist/declarations/s
|
|
|
18
18
|
children?: import("react").ReactNode;
|
|
19
19
|
color?: string | undefined;
|
|
20
20
|
titleAccess?: string | undefined;
|
|
21
|
-
size?: "sm" | "md" | undefined;
|
|
21
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
22
22
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
23
23
|
theme?: import("@emotion/react").Theme | undefined;
|
|
24
24
|
} & {
|
|
@@ -34,7 +34,7 @@ export declare const ChevronIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
34
34
|
children?: import("react").ReactNode;
|
|
35
35
|
color?: string | undefined;
|
|
36
36
|
titleAccess?: string | undefined;
|
|
37
|
-
size?: "sm" | "md" | undefined;
|
|
37
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
38
38
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
39
39
|
theme?: import("@emotion/react").Theme | undefined;
|
|
40
40
|
} & {
|
|
@@ -33,7 +33,7 @@ export declare const ChevronIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
33
33
|
children?: import("react").ReactNode;
|
|
34
34
|
color?: string | undefined;
|
|
35
35
|
titleAccess?: string | undefined;
|
|
36
|
-
size?: "sm" | "md" | undefined;
|
|
36
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
37
37
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
38
38
|
theme?: import("@emotion/react").Theme | undefined;
|
|
39
39
|
}, {}, {}>;
|
|
@@ -6,7 +6,7 @@ export declare const NextIcon: import("@emotion/styled/dist/declarations/src/typ
|
|
|
6
6
|
children?: import("react").ReactNode;
|
|
7
7
|
color?: string | undefined;
|
|
8
8
|
titleAccess?: string | undefined;
|
|
9
|
-
size?: "sm" | "md" | undefined;
|
|
9
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
10
10
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
11
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
12
12
|
}, {}, {}>;
|
|
@@ -18,7 +18,7 @@ export declare const DoubleNextIcon: import("@emotion/styled/dist/declarations/s
|
|
|
18
18
|
children?: import("react").ReactNode;
|
|
19
19
|
color?: string | undefined;
|
|
20
20
|
titleAccess?: string | undefined;
|
|
21
|
-
size?: "sm" | "md" | undefined;
|
|
21
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
22
22
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
23
23
|
theme?: import("@emotion/react").Theme | undefined;
|
|
24
24
|
}, {}, {}>;
|
|
@@ -6,7 +6,7 @@ export declare const PrevIcon: import("@emotion/styled/dist/declarations/src/typ
|
|
|
6
6
|
children?: import("react").ReactNode;
|
|
7
7
|
color?: string | undefined;
|
|
8
8
|
titleAccess?: string | undefined;
|
|
9
|
-
size?: "sm" | "md" | undefined;
|
|
9
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
10
10
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
11
11
|
theme?: import("@emotion/react").Theme | undefined;
|
|
12
12
|
}, {}, {}>;
|
|
@@ -18,7 +18,7 @@ export declare const DoublePrevIcon: import("@emotion/styled/dist/declarations/s
|
|
|
18
18
|
children?: import("react").ReactNode;
|
|
19
19
|
color?: string | undefined;
|
|
20
20
|
titleAccess?: string | undefined;
|
|
21
|
-
size?: "sm" | "md" | undefined;
|
|
21
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
22
22
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
23
23
|
theme?: import("@emotion/react").Theme | undefined;
|
|
24
24
|
}, {}, {}>;
|
|
@@ -11,7 +11,7 @@ export declare const SuccessIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
11
11
|
children?: import("react").ReactNode;
|
|
12
12
|
color?: string | undefined;
|
|
13
13
|
titleAccess?: string | undefined;
|
|
14
|
-
size?: "sm" | "md" | undefined;
|
|
14
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
15
15
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -19,7 +19,7 @@ export declare const ErrorIcon: import("@emotion/styled/dist/declarations/src/ty
|
|
|
19
19
|
children?: import("react").ReactNode;
|
|
20
20
|
color?: string | undefined;
|
|
21
21
|
titleAccess?: string | undefined;
|
|
22
|
-
size?: "sm" | "md" | undefined;
|
|
22
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
23
23
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
24
24
|
theme?: import("@emotion/react").Theme | undefined;
|
|
25
25
|
}, {}, {}>;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
1
|
import { type HintIconProps } from './types';
|
|
2
|
-
export declare const HintIcon: ({ variant, title, note, iconOption, tooltipPlacement, renderIcon, tooltipWidth, }: HintIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
2
|
+
export declare const HintIcon: ({ variant, title, note, iconOption, size, tooltipPlacement, renderIcon, tooltipWidth, }: HintIconProps) => import("react/jsx-runtime").JSX.Element;
|
|
@@ -6,8 +6,8 @@ const BottomDrawer_1 = require("../BottomDrawer");
|
|
|
6
6
|
const Icon_1 = require("./Icon");
|
|
7
7
|
const styles_1 = require("./styles");
|
|
8
8
|
const useLogic_1 = require("./useLogic");
|
|
9
|
-
const HintIcon = ({ variant, title, note, iconOption, tooltipPlacement = 'bottom', renderIcon, tooltipWidth, }) => {
|
|
9
|
+
const HintIcon = ({ variant, title, note, iconOption, size, tooltipPlacement = 'bottom', renderIcon, tooltipWidth, }) => {
|
|
10
10
|
const { handleClose, handleOpen, open } = (0, useLogic_1.useLogic)();
|
|
11
|
-
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1.Icon, { onClick: handleOpen, variant: variant, iconOption: iconOption, note: note, tooltipPlacement: tooltipPlacement, renderIcon: renderIcon, tooltipWidth: tooltipWidth }), (0, jsx_runtime_1.jsx)(BottomDrawer_1.BottomDrawer, { title: title, open: open, onClose: handleClose, children: (0, jsx_runtime_1.jsx)(styles_1.DrawerContent, { children: note }) })] }));
|
|
11
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Icon_1.Icon, { onClick: handleOpen, variant: variant, iconOption: iconOption, size: size, note: note, tooltipPlacement: tooltipPlacement, renderIcon: renderIcon, tooltipWidth: tooltipWidth }), (0, jsx_runtime_1.jsx)(BottomDrawer_1.BottomDrawer, { title: title, open: open, onClose: handleClose, children: (0, jsx_runtime_1.jsx)(styles_1.DrawerContent, { children: note }) })] }));
|
|
12
12
|
};
|
|
13
13
|
exports.HintIcon = HintIcon;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import type { SyntheticEvent } from 'react';
|
|
2
2
|
import type { HintIconProps, TooltipPlacement } from '../types';
|
|
3
|
-
export type IconProps = Pick<HintIconProps, 'variant' | 'iconOption' | 'note' | 'renderIcon' | 'tooltipWidth'> & {
|
|
3
|
+
export type IconProps = Pick<HintIconProps, 'variant' | 'iconOption' | 'size' | 'note' | 'renderIcon' | 'tooltipWidth'> & {
|
|
4
4
|
onClick: (e: SyntheticEvent) => void;
|
|
5
5
|
tooltipPlacement: TooltipPlacement;
|
|
6
6
|
};
|
|
@@ -7,8 +7,15 @@ const constants_1 = require("../constants");
|
|
|
7
7
|
const styles_1 = require("./styles");
|
|
8
8
|
const useLogic_1 = require("./useLogic");
|
|
9
9
|
const Icon = (props) => {
|
|
10
|
-
const {
|
|
11
|
-
const { onClick, note, tooltipPlacement, tooltipWidth } = props;
|
|
12
|
-
|
|
10
|
+
const { iconColor } = (0, useLogic_1.useLogic)(props);
|
|
11
|
+
const { onClick, variant, iconOption, size, note, tooltipPlacement, tooltipWidth, renderIcon, } = props;
|
|
12
|
+
const IconVariant = () => {
|
|
13
|
+
if (renderIcon) {
|
|
14
|
+
return renderIcon();
|
|
15
|
+
}
|
|
16
|
+
const Component = constants_1.ICONS[variant ?? 'info'][iconOption?.variant ?? 'fill'];
|
|
17
|
+
return (0, jsx_runtime_1.jsx)(Component, { size: size });
|
|
18
|
+
};
|
|
19
|
+
return ((0, jsx_runtime_1.jsx)(Tooltip_1.Tooltip, { title: note, placement: tooltipPlacement, width: tooltipWidth, children: (0, jsx_runtime_1.jsx)(styles_1.IconWrapper, { onClick: onClick, "$color": iconColor, className: constants_1.hintIconClassnames.iconWrapper, children: (0, jsx_runtime_1.jsx)(IconVariant, {}) }) }));
|
|
13
20
|
};
|
|
14
21
|
exports.Icon = Icon;
|
|
@@ -1,8 +1,6 @@
|
|
|
1
|
-
import { type ReactNode } from 'react';
|
|
2
1
|
import { type IconProps } from '../Icon';
|
|
3
2
|
type UseLogicParams = IconProps;
|
|
4
|
-
export declare const useLogic: ({ iconOption,
|
|
5
|
-
getIcon: () => ReactNode;
|
|
3
|
+
export declare const useLogic: ({ iconOption, renderIcon }: UseLogicParams) => {
|
|
6
4
|
iconColor: string;
|
|
7
5
|
};
|
|
8
6
|
export {};
|
|
@@ -1,21 +1,9 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.useLogic = void 0;
|
|
4
|
-
const constants_1 = require("../../constants");
|
|
5
4
|
const hooks_1 = require("./hooks");
|
|
6
|
-
const useLogic = ({ iconOption,
|
|
5
|
+
const useLogic = ({ iconOption, renderIcon }) => {
|
|
7
6
|
const iconColor = (0, hooks_1.useIconColor)({ color: iconOption?.color, renderIcon });
|
|
8
|
-
|
|
9
|
-
const getIcon = () => {
|
|
10
|
-
if (renderIcon) {
|
|
11
|
-
return renderIcon();
|
|
12
|
-
}
|
|
13
|
-
const icon = constants_1.ICONS[variant][iconOptionVariant];
|
|
14
|
-
if (icon) {
|
|
15
|
-
return icon;
|
|
16
|
-
}
|
|
17
|
-
return constants_1.ICONS.info.fill;
|
|
18
|
-
};
|
|
19
|
-
return { getIcon, iconColor };
|
|
7
|
+
return { iconColor };
|
|
20
8
|
};
|
|
21
9
|
exports.useLogic = useLogic;
|
|
@@ -1,13 +1,14 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
1
2
|
export declare const hintIconClassnames: {
|
|
2
3
|
iconWrapper: string;
|
|
3
4
|
};
|
|
4
5
|
export declare const ICONS: {
|
|
5
6
|
question: {
|
|
6
|
-
fill: import("react
|
|
7
|
-
outline: import("react
|
|
7
|
+
fill: import("react").FunctionComponent<import("..").SvgIconProps>;
|
|
8
|
+
outline: import("react").FunctionComponent<import("..").SvgIconProps>;
|
|
8
9
|
};
|
|
9
10
|
info: {
|
|
10
|
-
fill: import("react
|
|
11
|
-
outline: import("react
|
|
11
|
+
fill: import("react").FunctionComponent<import("..").SvgIconProps>;
|
|
12
|
+
outline: import("react").FunctionComponent<import("..").SvgIconProps>;
|
|
12
13
|
};
|
|
13
14
|
};
|
|
@@ -1,7 +1,6 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
3
|
exports.ICONS = exports.hintIconClassnames = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
4
|
const InfoFillMd_1 = require("../../icons/InfoFillMd");
|
|
6
5
|
const InfoOutlineMd_1 = require("../../icons/InfoOutlineMd");
|
|
7
6
|
const QuestionFillMd_1 = require("../../icons/QuestionFillMd");
|
|
@@ -12,11 +11,11 @@ exports.hintIconClassnames = {
|
|
|
12
11
|
};
|
|
13
12
|
exports.ICONS = {
|
|
14
13
|
question: {
|
|
15
|
-
fill:
|
|
16
|
-
outline:
|
|
14
|
+
fill: QuestionFillMd_1.QuestionFillMd,
|
|
15
|
+
outline: QuestionOutlineMd_1.QuestionOutlineMd,
|
|
17
16
|
},
|
|
18
17
|
info: {
|
|
19
|
-
fill:
|
|
20
|
-
outline:
|
|
18
|
+
fill: InfoFillMd_1.InfoFillMd,
|
|
19
|
+
outline: InfoOutlineMd_1.InfoOutlineMd,
|
|
21
20
|
},
|
|
22
21
|
};
|
|
@@ -20,6 +20,12 @@ export type HintIconProps = {
|
|
|
20
20
|
*/
|
|
21
21
|
color?: 'warning' | 'grey' | 'lightGrey';
|
|
22
22
|
};
|
|
23
|
+
/**
|
|
24
|
+
* Размеры (width и height) иконки.
|
|
25
|
+
*
|
|
26
|
+
* sm = 16px, md = 24px, auto = 1em
|
|
27
|
+
*/
|
|
28
|
+
size?: 'sm' | 'md' | 'auto';
|
|
23
29
|
/**
|
|
24
30
|
* Текст заголовка BottomDrawer
|
|
25
31
|
*/
|
|
@@ -16,7 +16,7 @@ export declare const Chevron: import("@emotion/styled/dist/declarations/src/type
|
|
|
16
16
|
children?: import("react").ReactNode;
|
|
17
17
|
color?: string | undefined;
|
|
18
18
|
titleAccess?: string | undefined;
|
|
19
|
-
size?: "sm" | "md" | undefined;
|
|
19
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
20
20
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
21
21
|
theme?: import("@emotion/react").Theme | undefined;
|
|
22
22
|
} & {
|
|
@@ -3,7 +3,7 @@ export declare const InfoNotificationIcon: import("@emotion/styled/dist/declarat
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -11,7 +11,7 @@ export declare const SuccessNotificationIcon: import("@emotion/styled/dist/decla
|
|
|
11
11
|
children?: import("react").ReactNode;
|
|
12
12
|
color?: string | undefined;
|
|
13
13
|
titleAccess?: string | undefined;
|
|
14
|
-
size?: "sm" | "md" | undefined;
|
|
14
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
15
15
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -19,7 +19,7 @@ export declare const WarningNotificationIcon: import("@emotion/styled/dist/decla
|
|
|
19
19
|
children?: import("react").ReactNode;
|
|
20
20
|
color?: string | undefined;
|
|
21
21
|
titleAccess?: string | undefined;
|
|
22
|
-
size?: "sm" | "md" | undefined;
|
|
22
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
23
23
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
24
24
|
theme?: import("@emotion/react").Theme | undefined;
|
|
25
25
|
}, {}, {}>;
|
|
@@ -27,7 +27,7 @@ export declare const ErrorNotificationIcon: import("@emotion/styled/dist/declara
|
|
|
27
27
|
children?: import("react").ReactNode;
|
|
28
28
|
color?: string | undefined;
|
|
29
29
|
titleAccess?: string | undefined;
|
|
30
|
-
size?: "sm" | "md" | undefined;
|
|
30
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
31
31
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
32
32
|
theme?: import("@emotion/react").Theme | undefined;
|
|
33
33
|
}, {}, {}>;
|
|
@@ -12,7 +12,7 @@ export declare const StyledSvgIcon: import("@emotion/styled/dist/declarations/sr
|
|
|
12
12
|
children?: import("react").ReactNode;
|
|
13
13
|
color?: string | undefined;
|
|
14
14
|
titleAccess?: string | undefined;
|
|
15
|
-
size?: "sm" | "md" | undefined;
|
|
15
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
16
16
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
17
17
|
theme?: import("@emotion/react").Theme | undefined;
|
|
18
18
|
}, {}, {}>;
|
|
@@ -642,7 +642,7 @@ export declare const NavMenuItemButtonChevron: import("@emotion/styled/dist/decl
|
|
|
642
642
|
children?: import("react").ReactNode;
|
|
643
643
|
color?: string | undefined;
|
|
644
644
|
titleAccess?: string | undefined;
|
|
645
|
-
size?: "sm" | "md" | undefined;
|
|
645
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
646
646
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
647
647
|
theme?: import("@emotion/react").Theme | undefined;
|
|
648
648
|
} & {
|
|
@@ -659,7 +659,7 @@ export declare const StyledPageDotOutlineMd: import("@emotion/styled/dist/declar
|
|
|
659
659
|
children?: import("react").ReactNode;
|
|
660
660
|
color?: string | undefined;
|
|
661
661
|
titleAccess?: string | undefined;
|
|
662
|
-
size?: "sm" | "md" | undefined;
|
|
662
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
663
663
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
664
664
|
theme?: import("@emotion/react").Theme | undefined;
|
|
665
665
|
}, {}, {}>;
|
|
@@ -12,7 +12,7 @@ exports.StyledMuiPopper = (0, styled_1.styled)(Popper_1.default) `
|
|
|
12
12
|
--arrow-base: ${constants_1.ARROW_BASE}px;
|
|
13
13
|
--arrow-height: ${constants_1.ARROW_HEIGHT}px;
|
|
14
14
|
|
|
15
|
-
z-index: ${({ theme }) => theme.zIndex.
|
|
15
|
+
z-index: ${({ theme }) => theme.zIndex.modal};
|
|
16
16
|
}
|
|
17
17
|
|
|
18
18
|
/* Anchor ушёл за скролл/вьюпорт — прячем стрелку. */
|
|
@@ -11,7 +11,7 @@ export declare const ArrowConnector: import("@emotion/styled/dist/declarations/s
|
|
|
11
11
|
children?: import("react").ReactNode;
|
|
12
12
|
color?: string | undefined;
|
|
13
13
|
titleAccess?: string | undefined;
|
|
14
|
-
size?: "sm" | "md" | undefined;
|
|
14
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
15
15
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const InfoNotificationIcon: import("@emotion/styled/dist/declarat
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -11,7 +11,7 @@ export declare const SuccessNotificationIcon: import("@emotion/styled/dist/decla
|
|
|
11
11
|
children?: import("react").ReactNode;
|
|
12
12
|
color?: string | undefined;
|
|
13
13
|
titleAccess?: string | undefined;
|
|
14
|
-
size?: "sm" | "md" | undefined;
|
|
14
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
15
15
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -19,7 +19,7 @@ export declare const WarningNotificationIcon: import("@emotion/styled/dist/decla
|
|
|
19
19
|
children?: import("react").ReactNode;
|
|
20
20
|
color?: string | undefined;
|
|
21
21
|
titleAccess?: string | undefined;
|
|
22
|
-
size?: "sm" | "md" | undefined;
|
|
22
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
23
23
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
24
24
|
theme?: import("@emotion/react").Theme | undefined;
|
|
25
25
|
}, {}, {}>;
|
|
@@ -27,7 +27,7 @@ export declare const ErrorNotificationIcon: import("@emotion/styled/dist/declara
|
|
|
27
27
|
children?: import("react").ReactNode;
|
|
28
28
|
color?: string | undefined;
|
|
29
29
|
titleAccess?: string | undefined;
|
|
30
|
-
size?: "sm" | "md" | undefined;
|
|
30
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
31
31
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
32
32
|
theme?: import("@emotion/react").Theme | undefined;
|
|
33
33
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const SearchIcon: import("@emotion/styled/dist/declarations/src/t
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const ArrowConnector: import("@emotion/styled/dist/declarations/s
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -3,7 +3,7 @@ export declare const ErrorIcon: import("@emotion/styled/dist/declarations/src/ty
|
|
|
3
3
|
children?: import("react").ReactNode;
|
|
4
4
|
color?: string | undefined;
|
|
5
5
|
titleAccess?: string | undefined;
|
|
6
|
-
size?: "sm" | "md" | undefined;
|
|
6
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
7
7
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
8
8
|
theme?: import("@emotion/react").Theme | undefined;
|
|
9
9
|
}, {}, {}>;
|
|
@@ -11,7 +11,7 @@ export declare const SuccessIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
11
11
|
children?: import("react").ReactNode;
|
|
12
12
|
color?: string | undefined;
|
|
13
13
|
titleAccess?: string | undefined;
|
|
14
|
-
size?: "sm" | "md" | undefined;
|
|
14
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
15
15
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
16
16
|
theme?: import("@emotion/react").Theme | undefined;
|
|
17
17
|
}, {}, {}>;
|
|
@@ -19,7 +19,7 @@ export declare const SelectIcon: import("@emotion/styled/dist/declarations/src/t
|
|
|
19
19
|
children?: import("react").ReactNode;
|
|
20
20
|
color?: string | undefined;
|
|
21
21
|
titleAccess?: string | undefined;
|
|
22
|
-
size?: "sm" | "md" | undefined;
|
|
22
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
23
23
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
24
24
|
theme?: import("@emotion/react").Theme | undefined;
|
|
25
25
|
} & {
|
|
@@ -29,7 +29,7 @@ export declare const DefaultIcon: import("@emotion/styled/dist/declarations/src/
|
|
|
29
29
|
children?: import("react").ReactNode;
|
|
30
30
|
color?: string | undefined;
|
|
31
31
|
titleAccess?: string | undefined;
|
|
32
|
-
size?: "sm" | "md" | undefined;
|
|
32
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
33
33
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
34
34
|
theme?: import("@emotion/react").Theme | undefined;
|
|
35
35
|
}, {}, {}>;
|
|
@@ -37,7 +37,7 @@ export declare const ActiveIcon: import("@emotion/styled/dist/declarations/src/t
|
|
|
37
37
|
children?: import("react").ReactNode;
|
|
38
38
|
color?: string | undefined;
|
|
39
39
|
titleAccess?: string | undefined;
|
|
40
|
-
size?: "sm" | "md" | undefined;
|
|
40
|
+
size?: "sm" | "md" | "auto" | undefined;
|
|
41
41
|
} & import("react").SVGProps<SVGSVGElement> & {
|
|
42
42
|
theme?: import("@emotion/react").Theme | undefined;
|
|
43
43
|
}, {}, {}>;
|
|
@@ -3,10 +3,20 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
3
3
|
exports.SvgIcon = void 0;
|
|
4
4
|
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
5
|
const classNames_1 = require("../utils/classNames");
|
|
6
|
+
const cva_1 = require("../utils/cva");
|
|
6
7
|
const constants_1 = require("./constants");
|
|
7
8
|
const styles_1 = require("./styles");
|
|
9
|
+
const svgCva = (0, cva_1.cva)(constants_1.svgIconClassnames.root, {
|
|
10
|
+
variants: {
|
|
11
|
+
size: {
|
|
12
|
+
auto: constants_1.svgIconClassnames.sizeAuto,
|
|
13
|
+
sm: constants_1.svgIconClassnames.sizeSm,
|
|
14
|
+
md: constants_1.svgIconClassnames.sizeMd,
|
|
15
|
+
},
|
|
16
|
+
},
|
|
17
|
+
});
|
|
8
18
|
const SvgIcon = (props) => {
|
|
9
19
|
const { children, color = 'inherit', titleAccess, size, width, height, viewBox = '0 0 24 24', xmlns = 'http://www.w3.org/2000/svg', className, ...restProps } = props;
|
|
10
|
-
return ((0, jsx_runtime_1.jsxs)(styles_1.StyledSvg, { className: (0, classNames_1.classNames)(className,
|
|
20
|
+
return ((0, jsx_runtime_1.jsxs)(styles_1.StyledSvg, { className: (0, classNames_1.classNames)(className, svgCva({ size })), viewBox: viewBox, "aria-hidden": titleAccess ? undefined : true, role: titleAccess ? 'img' : undefined, xmlns: xmlns, color: color, width: constants_1.SIZES[size] || width || '1em', height: constants_1.SIZES[size] || height || '1em', ...restProps, children: [children, titleAccess ? (0, jsx_runtime_1.jsx)("title", { children: titleAccess }) : null] }));
|
|
11
21
|
};
|
|
12
22
|
exports.SvgIcon = SvgIcon;
|