Merge branch 'release/1.0.0-alpha.1'

package.json

@@ -1,6 +1,6 @@
 {
     "name": "ncore-ui-kit",
-    "version": "1.0.0-alpha.0",
+    "version": "1.0.0-alpha.1",
     "description": "NİBGAT® | NCore - UI Kit for React-Native Mobile Apps.",
     "main": "./lib/module/index.js",
     "types": "./lib/typescript/src/index.d.ts",
@@ -37,9 +37,10 @@
         "clean": "del-cli lib",
         "lint": "eslint . --ext .ts,.tsx --fix",
         "prepare": "bob build && copyfiles -u 1 \"src/variants/**/*.json\" lib/typescript/src/ && node version.mjs",
-        "typecheck": "tsc -p tsconfig.build.json",
+        "type-check-build": "tsc -p tsconfig.build.json",
+        "type-check": "tsc --project tsconfig.json --noEmit",
         "release": "release-it --only-version",
-        "build": "yarn clean && yarn lint && yarn typecheck && yarn prepare && npm publish"
+        "build": "yarn clean && yarn lint && yarn type-check-build && yarn prepare && npm publish"
     },
     "keywords": [
         "ncore",

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;
 }

src/index.tsx

@@ -120,10 +120,13 @@ export type {
     NCoreUIKitIcon,
     ModalDataType,
     SharpnessType,
+    PureWebStyles,
+    PureRNStyles,
     LocalizeType,
     PaletteType,
     ThemesType,
     LocaleType,
+    AllStyles,
     ThemeType,
     ModalType,
     Mutable
@@ -133,3 +136,11 @@ export {
     Portal,
     Host
 } from "./helpers/portalize";
+
+export {
+    androidTypographyFixer,
+    windowHeight,
+    windowWidth,
+    webStyle,
+    uuid
+} from "./utils";

src/types/index.ts

@@ -1,6 +1,12 @@
 import {
-    type ForwardRefRenderFunction
+    type ForwardRefRenderFunction,
+    type CSSProperties
 } from "react";
+import type {
+    ImageStyle,
+    TextStyle,
+    ViewStyle
+} from "react-native";
 import {
     type INCoreUIKitIconCallbackProps
 } from "./icon";
@@ -57,6 +63,16 @@ export type {
     ThemeType
 };
 
+export type PureRNStyles = Omit<ViewStyle & TextStyle & ImageStyle, "position" | "cursor" | "filter">;
+
+export type PureWebStyles = Omit<CSSProperties, "position" | "cursor" | "filter">;
+
+export type AllStyles = PureRNStyles & PureWebStyles & {
+    position?: CSSProperties["position"];
+    cursor?: CSSProperties["cursor"];
+    filter?: string;
+};
+
 export type RecursiveRecord = {
   [key: string]: string | RecursiveRecord;
 };

src/utils/index.ts

@@ -1,14 +1,20 @@
 import {
+    type ViewStyle,
     Dimensions,
     Platform
 } from "react-native";
+import type {
+    AllStyles
+} from "../types";
 
 const dimensions = Dimensions.get("window");
 
 export const windowHeight = dimensions.height;
 export const windowWidth = dimensions.width;
 
-export const webStyle = (styles: Record<string, unknown>): Record<string, unknown> => Platform.OS === "web" ? styles : {};
+export const webStyle = <T extends AllStyles>(styles: T): ViewStyle => {
+    return (Platform.OS === "web" ? styles : {}) as unknown as ViewStyle;
+};
 
 export const uuid = () => {
     return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, function(c) {