refactor(toast-plate): move back custom icons

core-ds · May 3, 2024 · cfde16e · cfde16e
1 parent 32653a0
commit cfde16e
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 0 deletions.
diff --git a/packages/status-badge/src/Component.tsx b/packages/status-badge/src/Component.tsx
@@ -58,6 +58,15 @@ export type StatusBadgeProps = {
      * Идентификатор для систем автоматизированного тестирования
      */
     dataTestId?: string;
+
+    /**
+     * Необходим для переопределения иконок
+     */
+    customIcons?: {
+        negative: React.FC<React.SVGProps<SVGSVGElement>>;
+        positive: React.FC<React.SVGProps<SVGSVGElement>>;
+        attention: React.FC<React.SVGProps<SVGSVGElement>>;
+    };
 };
 
 const ICON_MAP: Record<
@@ -128,7 +137,23 @@ export const StatusBadge = ({
     size = 24,
     view,
     colors = 'default',
+    customIcons,
 }: StatusBadgeProps) => {
+    if (customIcons) {
+        ICON_MAP['positive-checkmark'] = {
+            ...ICON_MAP['positive-checkmark'],
+            24: customIcons.positive,
+        };
+        ICON_MAP['negative-cross'] = {
+            ...ICON_MAP['negative-cross'],
+            24: customIcons.negative,
+        };
+        ICON_MAP['attention-alert'] = {
+            ...ICON_MAP['attention-alert'],
+            24: customIcons.attention,
+        };
+    }
+
     const Icon = ICON_MAP[view][size];
 
     return (

diff --git a/packages/toast-plate/src/components/base-toast-plate/component.tsx b/packages/toast-plate/src/components/base-toast-plate/component.tsx
@@ -18,6 +18,12 @@ const colorStyles = {
     inverted: invertedColors,
 };
 
+export type BadgeIcons = {
+    negative: React.FC<React.SVGProps<SVGSVGElement>>;
+    positive: React.FC<React.SVGProps<SVGSVGElement>>;
+    attention: React.FC<React.SVGProps<SVGSVGElement>>;
+};
+
 export type BaseToastPlateProps = HTMLAttributes<HTMLDivElement> & {
     /**
      * Дополнительный класс
@@ -94,6 +100,11 @@ export type BaseToastPlateProps = HTMLAttributes<HTMLDivElement> & {
      */
     onClose?: (event?: MouseEvent<HTMLButtonElement>) => void;
 
+    /**
+     * Функция, с помощью которой можно переопределить иконки в Badge
+     */
+    getBadgeIcons?: () => BadgeIcons;
+
     /**
      * Набор цветов для компонента
      */
@@ -126,6 +137,7 @@ export const BaseToastPlate = forwardRef<HTMLDivElement, BaseToastPlateProps>(
             actionButton,
             block,
             onClose,
+            getBadgeIcons,
             colors = 'default',
             closerWrapperClassName,
             closerClassName,
@@ -175,6 +187,9 @@ export const BaseToastPlate = forwardRef<HTMLDivElement, BaseToastPlateProps>(
                                         <StatusBadge
                                             view={statusBadgeView as StatusBadgeProps['view']}
                                             dataTestId='badge'
+                                            {...(getBadgeIcons && {
+                                                customIcons: getBadgeIcons(),
+                                            })}
                                         />
                                     ))}
                             </div>