Feature: HighlightButton feature added to Switcher Components.

src/components/localeSwitcher/index.tsx

@@ -18,9 +18,11 @@ import {
     EnUsIcon,
     TRTRIcon
 } from "../../assets/svg";
+import HighlightButton from "../highlightButton";
 
 const PaletteSwitcher: FC<ILocaleSwitcherProps> = ({
     variants: variantsProps = [],
+    isWorkWithHighlightButton,
     isWorkWithNextShowSystem,
     customLocalize,
     color,
@@ -99,21 +101,22 @@ const PaletteSwitcher: FC<ILocaleSwitcherProps> = ({
 
     const currentVariant = variants[isWorkWithNextShowSystem ? viewVariantIndex : currentVariantIndex];
 
-    return <Button
-        {...props}
-        customBorderColor={currentVariant && currentVariant.borderColor ?
+    const allProps = {
+        ...props,
+        customBorderColor: currentVariant && currentVariant.borderColor ?
             currentVariant.borderColor
             :
-            color
-        }
-        customColor={currentVariant && currentVariant.backgroundColor ?
+            color,
+        customColor: currentVariant && currentVariant.backgroundColor ?
             currentVariant.backgroundColor
             :
-            color
-        }
-        icon={({
+            color,
+        icon: ({
             color,
             size
+        }: {
+            color: keyof NCoreUIKit.IconContentColors;
+            size: number;
         }) => {
             const Icon = currentVariant?.icon as NCoreUIKitIcon;
 
@@ -122,15 +125,25 @@ const PaletteSwitcher: FC<ILocaleSwitcherProps> = ({
                 color={color}
                 size={size}
             />;
-        }}
-        onPress={() => {
+        },
+        onPress: () => {
             NCoreUIKitLocalize.switch({
                 localeKey: localeKeys[viewVariantIndex] as keyof NCoreUIKit.LocaleKey
             });
-        }}
-        style={[
+        },
+        style: [
             style
-        ]}
+        ]
+    };
+
+    if(isWorkWithHighlightButton) {
+        return <HighlightButton
+            {...allProps}
+        />;
+    }
+
+    return <Button
+        {...allProps}
     />;
 };
 export default PaletteSwitcher;

src/components/localeSwitcher/type.ts

@@ -23,6 +23,7 @@ interface ILocaleSwitcherProps extends Omit<IButtonProps, "onPress"> {
     customLocalize?: {
         activeLocale?: keyof NCoreUIKit.LocaleKey;
     };
+    isWorkWithHighlightButton?: boolean;
     isWorkWithNextShowSystem?: boolean;
     variants?: LocaleSwitchVariants;
 }

src/components/paletteSwitcher/index.tsx

@@ -15,13 +15,15 @@ import type {
 } from "../../types";
 import Button from "../button";
 import {
-    CayCoreIcon,
     NIBGATCommunityIcon,
+    CayCoreIcon,
     NIBGATIcon
 } from "../../assets/svg";
+import HighlightButton from "../highlightButton";
 
 const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
     variants: variantsProps = [],
+    isWorkWithHighlightButton,
     isWorkWithNextShowSystem,
     customTheme,
     color,
@@ -117,21 +119,22 @@ const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
 
     const currentVariant = variants[isWorkWithNextShowSystem ? viewVariantIndex : currentVariantIndex];
 
-    return <Button
-        {...props}
-        customBorderColor={currentVariant && currentVariant.borderColor ?
+    const allProps = {
+        ...props,
+        customBorderColor: currentVariant && currentVariant.borderColor ?
             currentVariant.borderColor
             :
-            color
-        }
-        customColor={currentVariant && currentVariant.backgroundColor ?
+            color,
+        customColor: currentVariant && currentVariant.backgroundColor ?
             currentVariant.backgroundColor
             :
-            color
-        }
-        icon={({
+            color,
+        icon: ({
             color,
             size
+        }: {
+            color: keyof NCoreUIKit.IconContentColors;
+            size: number;
         }) => {
             const Icon = currentVariant?.icon as NCoreUIKitIcon;
 
@@ -140,15 +143,25 @@ const PaletteSwitcher: FC<IPaletteSwitcherProps> = ({
                 color={color}
                 size={size}
             />;
-        }}
-        onPress={() => {
+        },
+        onPress: () => {
             NCoreUIKitTheme.switch({
                 paletteKey: paletteKeys[viewVariantIndex]
             });
-        }}
-        style={[
+        },
+        style: [
             style
-        ]}
+        ]
+    };
+
+    if(isWorkWithHighlightButton) {
+        return <HighlightButton
+            {...allProps}
+        />;
+    }
+
+    return <Button
+        {...allProps}
     />;
 };
 export default PaletteSwitcher;

src/components/paletteSwitcher/type.ts

@@ -26,6 +26,7 @@ interface IPaletteSwitcherProps extends Omit<IButtonProps, "onPress"> {
         themeKey?: keyof NCoreUIKit.ThemeKey;
     };
     style?: StyleProp<TextStyle>[] | StyleProp<TextStyle>;
+    isWorkWithHighlightButton?: boolean;
     isWorkWithNextShowSystem?: boolean;
     variants?: ThemeSwitchVariants;
 }

src/components/themeSwitcher/index.tsx

@@ -18,9 +18,11 @@ import {
     Sun as SunIcon
 } from "lucide-react-native";
 import Button from "../button";
+import HighlightButton from "../highlightButton";
 
 const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
     variants: variantsProps = [],
+    isWorkWithHighlightButton,
     isWorkWithNextShowSystem,
     customTheme,
     color,
@@ -110,21 +112,22 @@ const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
 
     const currentVariant = variants[isWorkWithNextShowSystem ? viewVariantIndex : currentVariantIndex];
 
-    return <Button
-        {...props}
-        customBorderColor={currentVariant && currentVariant.borderColor ?
+    const allProps = {
+        ...props,
+        customBorderColor: currentVariant && currentVariant.borderColor ?
             currentVariant.borderColor
             :
-            color
-        }
-        customColor={currentVariant && currentVariant.backgroundColor ?
+            color,
+        customColor: currentVariant && currentVariant.backgroundColor ?
             currentVariant.backgroundColor
             :
-            color
-        }
-        icon={({
+            color,
+        icon: ({
             color,
             size
+        }: {
+            color: keyof NCoreUIKit.IconContentColors;
+            size: number;
         }) => {
             const Icon = currentVariant?.icon as NCoreUIKitIcon;
 
@@ -133,15 +136,25 @@ const ThemeSwitcher: FC<IThemeSwitcherProps> = ({
                 color={color}
                 size={size}
             />;
-        }}
-        onPress={() => {
+        },
+        onPress: () => {
             NCoreUIKitTheme.switch({
                 themeKey: themeKeys[viewVariantIndex]
             });
-        }}
-        style={[
+        },
+        style: [
             style
-        ]}
+        ]
+    };
+
+    if(isWorkWithHighlightButton) {
+        return <HighlightButton
+            {...allProps}
+        />;
+    }
+
+    return <Button
+        {...allProps}
     />;
 };
 export default ThemeSwitcher;

src/components/themeSwitcher/type.ts

@@ -26,6 +26,7 @@ interface IThemeSwitcherProps extends Omit<IButtonProps, "onPress"> {
         themeKey?: keyof NCoreUIKit.ThemeKey;
     };
     style?: StyleProp<TextStyle>[] | StyleProp<TextStyle>;
+    isWorkWithHighlightButton?: boolean;
     isWorkWithNextShowSystem?: boolean;
     variants?: ThemeSwitchVariants;
 }