New approach for ScaledSheet types (#83)

Author: vladbelozertsev

index.d.ts

@@ -1,54 +1,6 @@
-import * as RN from "react-native";
-
-declare module "react-native-size-matters" {
-    interface StringifiedStyles {
-        fontSize?: string | number;
-        letterSpacing?: string | number;
-        lineHeight?: string | number;
-        textShadowRadius?: string | number;
-        borderBottomLeftRadius?: string | number;
-        borderBottomRightRadius?: string | number;
-        borderTopLeftRadius?: string | number;
-        borderTopRightRadius?: string | number;
-        borderBottomWidth?: string | number;
-        borderTopWidth?: string | number;
-        borderRightWidth?: string | number;
-        borderLeftWidth?: string | number;
-        borderRadius?: string | number;
-        shadowRadius?: string | number;
-        borderWidth?: string | number;
-        aspectRatio?: string | number;
-        rotation?: string | number;
-        scaleX?: string | number;
-        scaleY?: string | number;
-        translateX?: string | number;
-        translateY?: string | number;
-        padding?: string | number;
-        paddingLeft?: string | number;
-        paddingRight?: string | number;
-        paddingTop?: string | number;
-        paddingBottom?: string | number;
-        paddingHorizontal?: string | number;
-        paddingVertical?: string | number;
-        margin?: string | number;
-        marginLeft?: string | number;
-        marginRight?: string | number;
-        marginTop?: string | number;
-        marginBottom?: string | number;
-        marginHorizontal?: string | number;
-        marginVertical?: string | number;
-        top?: string | number;
-        left?: string | number;
-        right?: string | number;
-        bottom?: string | number;
-        width?: string | number;
-        height?: string | number;
-        minWidth?: string | number;
-        minHeight?: string | number;
-        maxWidth?: string | number;
-        maxHeight?: string | number;
-    }
+import * as RN from 'react-native';
 
+declare module 'react-native-size-matters' {
     export function scale(size: number): number;
     export function verticalScale(size: number): number;
     export function moderateScale(size: number, factor?: number): number;
@@ -58,14 +10,24 @@ declare module "react-native-size-matters" {
     export function ms(size: number, factor?: number): number;
     export function mvs(size: number, factor?: number): number;
 
-    type ViewStyle = Omit<RN.ViewStyle, keyof StringifiedStyles> & StringifiedStyles;
-    type TextStyle = Omit<RN.TextStyle, keyof StringifiedStyles> & StringifiedStyles;
-    type ImageStyle = Omit<RN.ImageStyle, keyof StringifiedStyles> & StringifiedStyles;
+    type Scale = `${number}@s`;
+    type VerticalScale = `${number}@vs`;
+    type ModerateScale = `${number}@ms${number | ''}`;
+    type ModerateVerticalScale = `${number}@mvs${number | ''}`;
+    type Size = Scale | VerticalScale | ModerateScale | ModerateVerticalScale;
+    type WithSize<T> = { [P in keyof T]: number extends T[P] ? Size | T[P] : T[P] };
+    type ViewStyle = WithSize<RN.ViewStyle>;
+    type TextStyle = WithSize<RN.TextStyle>;
+    type ImageStyle = WithSize<RN.ImageStyle>;
     type NamedStyles<T> = { [P in keyof T]: ViewStyle | TextStyle | ImageStyle };
 
     export namespace ScaledSheet {
-        export function create<T extends NamedStyles<T> | NamedStyles<any>>(stylesObject: T): {
-            [P in keyof T]: RN.RegisteredStyle<T[P] & Record<Extract<keyof T[P], keyof StringifiedStyles>, number>>
+        export function create<T extends NamedStyles<T> | NamedStyles<any>>(
+            stylesObject: T,
+        ): {
+            [P in keyof T]: RN.RegisteredStyle<{
+                [S in keyof T[P]]: T[P][S] extends Size ? number : T[P][S];
+            }>;
         };
     }
 }