feat: introduce mini runtime

src/core/UnistylesRuntime.ts

@@ -9,6 +9,30 @@ import type { UnistyleRegistry } from './UnistyleRegistry'
 export class UnistylesRuntime {
     constructor(private unistylesBridge: UnistylesBridge, private unistylesRegistry: UnistyleRegistry) {}
 
+    /**
+     * Get the mini runtime injected to creteStyleSheet
+     * @returns - The mini runtime
+     */
+    public get miniRuntime() {
+        return {
+            contentSizeCategory: this.contentSizeCategory,
+            breakpoint: this.breakpoint,
+            screen: this.screen,
+            insets: this.insets,
+            statusBar: {
+                width: this.statusBar.width,
+                height: this.statusBar.height
+            },
+            navigationBar: {
+                width: this.navigationBar.width,
+                height: this.navigationBar.height
+            },
+            orientation: this.orientation,
+            pixelRatio: this.pixelRatio,
+            fontScale: this.fontScale
+        }
+    }
+
     /**
      * Get the current color scheme
      * @returns - The current color scheme

src/core/index.ts

@@ -1,2 +1,8 @@
-export { unistyles } from './Unistyles'
+import { unistyles } from './Unistyles'
 export type { UnistylesRuntime } from './UnistylesRuntime'
+
+export type UnistylesMiniRuntime = typeof unistyles.runtime.miniRuntime
+
+export {
+    unistyles
+}

src/types/breakpoints.ts

@@ -2,7 +2,7 @@ import type { ColorValue, OpaqueColorValue } from 'react-native'
 import type { UnistylesTheme } from '../types'
 import type { BreakpointsOrMediaQueries, ToDeepUnistyles } from './stylesheet'
 import type { TransformStyles } from './core'
-import type { UnistylesRuntime } from '../core'
+import type { UnistylesMiniRuntime } from '../core'
 
 type ExtractTransformArray<T> = T extends object
     ? { [K in keyof T]: ExtractBreakpoints<T[K]> }
@@ -57,6 +57,6 @@ type ParseStyleKeys<T> = T extends object
     ? { [K in keyof T]: ParseNestedObject<T[K]> }
     : never
 
-export type ReactNativeStyleSheet<T> = T extends (theme: UnistylesTheme, runtime: UnistylesRuntime) => infer R
+export type ReactNativeStyleSheet<T> = T extends (theme: UnistylesTheme, runtime: UnistylesMiniRuntime) => infer R
     ? ParseStyleKeys<R>
     : ParseStyleKeys<T>

src/types/stylesheet.ts

@@ -1,7 +1,7 @@
 import type { ImageStyle, TextStyle, ViewStyle } from 'react-native'
 import type { ShadowOffset, TransformStyles, UnistylesTheme } from './core'
 import type { UnistylesBreakpoints } from '../global'
-import type { UnistylesRuntime } from '../core'
+import type { UnistylesMiniRuntime } from '../core'
 
 // these props are treated differently to nest breakpoints and media queries
 type NestedKeys = 'shadowOffset' | 'transform' | 'textShadowOffset'
@@ -47,4 +47,4 @@ export type StyleSheet = {
     [styleName: string]: UnistylesValues | ((...args: any) => UnistylesValues)
 }
 
-export type StyleSheetWithSuperPowers = ((theme: UnistylesTheme, runtime: UnistylesRuntime) => StyleSheet) | StyleSheet
+export type StyleSheetWithSuperPowers = ((theme: UnistylesTheme, miniRuntime: UnistylesMiniRuntime) => StyleSheet) | StyleSheet

src/useStyles.ts

@@ -26,7 +26,7 @@ export const useStyles = <ST extends StyleSheetWithSuperPowers>(
     const { theme, layout, plugins } = useUnistyles()
     const variants = useVariants(variantsMap)
     const parsedStyles = useMemo(() => typeof stylesheet === 'function'
-        ? stylesheet(theme, unistyles.runtime)
+        ? stylesheet(theme, unistyles.runtime.miniRuntime)
         : stylesheet, [theme, stylesheet, layout])
 
     const dynamicStyleSheet = useMemo(() => Object