feat: fix typings for functions

example/src/examples/Extreme.tsx

@@ -38,7 +38,8 @@ const stylesheet = createStyles(theme => ({
             },
             {
                 translateX: {
-                    sm: 10
+                    sm: 10,
+                    md: 20
                 }
             }
         ]

example/src/examples/MinimalWithCreateStyles.tsx

@@ -26,6 +26,10 @@ const stylesheet = createStyles({
     text: {
         borderWidth: 1,
         borderColor: 'purple',
-        padding: 20
+        padding: 20,
+        flex: {
+            xs: 2,
+            md: 1
+        }
     }
 })

src/createUnistyles.ts

@@ -8,7 +8,13 @@ export const createUnistyles = <B extends Record<string, number>, T = {}>(breakp
     const sortedBreakpoints = sortAndValidateBreakpoints(breakpoints)
 
     return {
-        createStyles: <S extends CustomNamedStyles<S, B>>(styles: S | CustomNamedStyles<S, B> | CreateStylesFactory<S, T>) => styles as S,
+        createStyles: <S extends CustomNamedStyles<S, B>, X>(styles: S | CustomNamedStyles<S, B> | X | ((theme: T) => X | CustomNamedStyles<X, B>)): S | X => {
+            if (typeof styles === 'function') {
+                return styles as X
+            }
+
+            return styles as S
+        },
         useStyles: <ST extends CustomNamedStyles<ST, B>>(stylesheet?: ST | CreateStylesFactory<ST, T>) => {
             const theme = useContext(UnistylesContext) as T
             const dimensions = useDimensions()

src/types.ts

@@ -20,7 +20,7 @@ export type ScreenSize = {
     height: number
 }
 
-export type CreateStylesFactory<T, Theme> = (theme: Theme) => T
+export type CreateStylesFactory<ST, Theme> = (theme: Theme) => ST
 
 type StyleProperty<T, B extends Record<string, number>> = {
     [K in keyof T]: {