@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.
Files changed (87) hide show
  1. package/components/Accordion/styles.d.ts +1 -1
  2. package/components/AutoSaveIndicator/DefaultState/styles.d.ts +1 -1
  3. package/components/AutoSaveIndicator/ErrorState/styles.d.ts +1 -1
  4. package/components/AutoSaveIndicator/LoadingState/styles.d.ts +1 -1
  5. package/components/AutoSaveIndicator/SuccessState/styles.d.ts +1 -1
  6. package/components/BulletListItem/styles.d.ts +1 -1
  7. package/components/Chevron/styles.d.ts +1 -1
  8. package/components/Chip/ChipStatusIcon/styled.d.ts +1 -1
  9. package/components/ComplianceStatus/styles.d.ts +3 -3
  10. package/components/CopyTypography/styles.d.ts +1 -1
  11. package/components/DataGrid/Row/styles.d.ts +1 -1
  12. package/components/DataGridCollapsibleRow/styles.d.ts +1 -1
  13. package/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarNextButton/styles.d.ts +2 -2
  14. package/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarPrevButton/styles.d.ts +2 -2
  15. package/components/FormHelperText/FormHelperTextContent/styles.d.ts +2 -2
  16. package/components/HintIcon/HintIcon.d.ts +1 -1
  17. package/components/HintIcon/HintIcon.js +2 -2
  18. package/components/HintIcon/Icon/Icon.d.ts +1 -1
  19. package/components/HintIcon/Icon/Icon.js +11 -4
  20. package/components/HintIcon/Icon/useLogic/useLogic.d.ts +1 -3
  21. package/components/HintIcon/Icon/useLogic/useLogic.js +2 -14
  22. package/components/HintIcon/constants.d.ts +5 -4
  23. package/components/HintIcon/constants.js +4 -5
  24. package/components/HintIcon/types.d.ts +6 -0
  25. package/components/JsonViewer/JsonNode/styles.d.ts +1 -1
  26. package/components/LegacyNotification/styles.d.ts +4 -4
  27. package/components/Loader/styles.d.ts +1 -1
  28. package/components/NavMenu/Item/ItemButton/styles.d.ts +2 -2
  29. package/components/NewPopover/styles.js +1 -1
  30. package/components/NewStepper/Step/styles.d.ts +1 -1
  31. package/components/Notification/styles.d.ts +4 -4
  32. package/components/SearchField/styles.d.ts +1 -1
  33. package/components/Stepper/ArrowConnector/ArrowConnector.d.ts +1 -1
  34. package/components/Stepper/StepIcon/styles.d.ts +5 -5
  35. package/components/SvgIcon/SvgIcon.js +11 -1
  36. package/components/SvgIcon/constants.d.ts +4 -0
  37. package/components/SvgIcon/constants.js +4 -0
  38. package/components/SvgIcon/styles.js +7 -4
  39. package/components/SvgIcon/types.d.ts +2 -2
  40. package/components/Tree/TreeItem/styles.d.ts +1 -1
  41. package/components/fileUploading/FileInfo/styles.d.ts +1 -1
  42. package/hook-form/EditableText/styles.d.ts +1 -1
  43. package/hook-form/FormWizardPageLayout/FormWizardFooter/styles.d.ts +2 -2
  44. package/node/components/Accordion/styles.d.ts +1 -1
  45. package/node/components/AutoSaveIndicator/DefaultState/styles.d.ts +1 -1
  46. package/node/components/AutoSaveIndicator/ErrorState/styles.d.ts +1 -1
  47. package/node/components/AutoSaveIndicator/LoadingState/styles.d.ts +1 -1
  48. package/node/components/AutoSaveIndicator/SuccessState/styles.d.ts +1 -1
  49. package/node/components/BulletListItem/styles.d.ts +1 -1
  50. package/node/components/Chevron/styles.d.ts +1 -1
  51. package/node/components/Chip/ChipStatusIcon/styled.d.ts +1 -1
  52. package/node/components/ComplianceStatus/styles.d.ts +3 -3
  53. package/node/components/CopyTypography/styles.d.ts +1 -1
  54. package/node/components/DataGrid/Row/styles.d.ts +1 -1
  55. package/node/components/DataGridCollapsibleRow/styles.d.ts +1 -1
  56. package/node/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarNextButton/styles.d.ts +2 -2
  57. package/node/components/DatePicker/DateCalendar/DateCalendarChevronButton/DateCalendarPrevButton/styles.d.ts +2 -2
  58. package/node/components/FormHelperText/FormHelperTextContent/styles.d.ts +2 -2
  59. package/node/components/HintIcon/HintIcon.d.ts +1 -1
  60. package/node/components/HintIcon/HintIcon.js +2 -2
  61. package/node/components/HintIcon/Icon/Icon.d.ts +1 -1
  62. package/node/components/HintIcon/Icon/Icon.js +10 -3
  63. package/node/components/HintIcon/Icon/useLogic/useLogic.d.ts +1 -3
  64. package/node/components/HintIcon/Icon/useLogic/useLogic.js +2 -14
  65. package/node/components/HintIcon/constants.d.ts +5 -4
  66. package/node/components/HintIcon/constants.js +4 -5
  67. package/node/components/HintIcon/types.d.ts +6 -0
  68. package/node/components/JsonViewer/JsonNode/styles.d.ts +1 -1
  69. package/node/components/LegacyNotification/styles.d.ts +4 -4
  70. package/node/components/Loader/styles.d.ts +1 -1
  71. package/node/components/NavMenu/Item/ItemButton/styles.d.ts +2 -2
  72. package/node/components/NewPopover/styles.js +1 -1
  73. package/node/components/NewStepper/Step/styles.d.ts +1 -1
  74. package/node/components/Notification/styles.d.ts +4 -4
  75. package/node/components/SearchField/styles.d.ts +1 -1
  76. package/node/components/Stepper/ArrowConnector/ArrowConnector.d.ts +1 -1
  77. package/node/components/Stepper/StepIcon/styles.d.ts +5 -5
  78. package/node/components/SvgIcon/SvgIcon.js +11 -1
  79. package/node/components/SvgIcon/constants.d.ts +4 -0
  80. package/node/components/SvgIcon/constants.js +4 -0
  81. package/node/components/SvgIcon/styles.js +7 -4
  82. package/node/components/SvgIcon/types.d.ts +2 -2
  83. package/node/components/Tree/TreeItem/styles.d.ts +1 -1
  84. package/node/components/fileUploading/FileInfo/styles.d.ts +1 -1
  85. package/node/hook-form/EditableText/styles.d.ts +1 -1
  86. package/node/hook-form/FormWizardPageLayout/FormWizardFooter/styles.d.ts +2 -2
  87. 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 { getIcon, iconColor } = (0, useLogic_1.useLogic)(props);
11
- const { onClick, note, tooltipPlacement, tooltipWidth } = props;
12
- 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: getIcon() }) }));
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, variant, renderIcon, }: UseLogicParams) => {
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, variant, renderIcon, }) => {
5
+ const useLogic = ({ iconOption, renderIcon }) => {
7
6
  const iconColor = (0, hooks_1.useIconColor)({ color: iconOption?.color, renderIcon });
8
- const { variant: iconOptionVariant = 'fill' } = iconOption || {};
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/jsx-runtime").JSX.Element;
7
- outline: import("react/jsx-runtime").JSX.Element;
7
+ fill: import("react").FunctionComponent<import("..").SvgIconProps>;
8
+ outline: import("react").FunctionComponent<import("..").SvgIconProps>;
8
9
  };
9
10
  info: {
10
- fill: import("react/jsx-runtime").JSX.Element;
11
- outline: import("react/jsx-runtime").JSX.Element;
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: (0, jsx_runtime_1.jsx)(QuestionFillMd_1.QuestionFillMd, {}),
16
- outline: (0, jsx_runtime_1.jsx)(QuestionOutlineMd_1.QuestionOutlineMd, {}),
14
+ fill: QuestionFillMd_1.QuestionFillMd,
15
+ outline: QuestionOutlineMd_1.QuestionOutlineMd,
17
16
  },
18
17
  info: {
19
- fill: (0, jsx_runtime_1.jsx)(InfoFillMd_1.InfoFillMd, {}),
20
- outline: (0, jsx_runtime_1.jsx)(InfoOutlineMd_1.InfoOutlineMd, {}),
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.tooltip};
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, constants_1.svgIconClassnames.root), 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] }));
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;
@@ -1,7 +1,11 @@
1
1
  export declare const SIZES: {
2
2
  sm: string;
3
3
  md: string;
4
+ auto: string;
4
5
  };
5
6
  export declare const svgIconClassnames: {
6
7
  root: string;
8
+ sizeAuto: string;
9
+ sizeSm: string;
10
+ sizeMd: string;
7
11
  };