react-native-unistyles 2.4.0-rc.1 → 2.4.0-rc.2

package/lib/typescript/src/core/UnistylesRuntime.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"UnistylesRuntime.d.ts","sourceRoot":"","sources":["../../../../src/core/UnistylesRuntime.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAChE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAChD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D;;GAEG;AACH,qBAAa,gBAAgB;IACb,OAAO,CAAC,eAAe;IAAmB,OAAO,CAAC,iBAAiB;gBAA3D,eAAe,EAAE,eAAe,EAAU,iBAAiB,EAAE,gBAAgB;IAEjG;;;OAGG;IACH,IAAW,WAAW,uCAErB;IAED;;;OAGG;IACH,IAAW,iBAAiB,YAE3B;IAED;;;OAGG;IACH,IAAW,SAAS,UAEnB;IAED;;;OAGG;IACH,IAAW,mBAAmB,gGAE7B;IAED;;;OAGG;IACH,IAAW,UAAU,mDAEpB;IAED;;;OAGG;IACH,IAAW,WAAW,6CAErB;IAED;;;OAGG;IACH,IAAW,cAAc,aAExB;IAED;;;OAGG;IACH,IAAW,MAAM;;;MAKhB;IAED;;;OAGG;IACH,IAAW,MAAM,oCAEhB;IAED;;;OAGG;IACH,IAAW,SAAS,2CAEnB;IAED;;;OAGG;IACH,IAAW,WAAW,6BAQrB;IAED;;;;OAIG;IACI,QAAQ,SAAU,MAAM,eAAe,sBAY7C;IAED;;;;;OAKG;IACI,WAAW,SAAU,MAAM,eAAe,mBAAmB,eAAe,CAAC,MAAM,eAAe,CAAC,KAAK,eAAe,CAAC,MAAM,eAAe,CAAC,UAEpJ;IAED;;;OAGG;IACI,iBAAiB,WAAY,OAAO,UAE1C;IAED;;;OAGG;IACI,SAAS,WAAY,eAAe,UAE1C;IAED;;;OAGG;IACI,YAAY,WAAY,eAAe,UAE7C;CACJ"}
+{"version":3,"file":"UnistylesRuntime.d.ts","sourceRoot":"","sources":["../../../../src/core/UnistylesRuntime.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,eAAe,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAChE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,WAAW,CAAA;AAChD,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D;;GAEG;AACH,qBAAa,gBAAgB;IACb,OAAO,CAAC,eAAe;IAAmB,OAAO,CAAC,iBAAiB;gBAA3D,eAAe,EAAE,eAAe,EAAU,iBAAiB,EAAE,gBAAgB;IAEjG;;;OAGG;IACH,IAAW,WAAW,uCAErB;IAED;;;OAGG;IACH,IAAW,iBAAiB,YAE3B;IAED;;;OAGG;IACH,IAAW,SAAS,UAEnB;IAED;;;OAGG;IACH,IAAW,mBAAmB,gGAE7B;IAED;;;OAGG;IACH,IAAW,UAAU,mDAEpB;IAED;;;OAGG;IACH,IAAW,WAAW,6CAErB;IAED;;;OAGG;IACH,IAAW,cAAc,aAExB;IAED;;;OAGG;IACH,IAAW,MAAM;;;MAKhB;IAED;;;OAGG;IACH,IAAW,MAAM,oCAEhB;IAED;;;OAGG;IACH,IAAW,SAAS,wCAEnB;IAED;;;OAGG;IACH,IAAW,aAAa,wCAEvB;IAED;;;OAGG;IACH,IAAW,WAAW,6BAQrB;IAED;;;;OAIG;IACI,QAAQ,SAAU,MAAM,eAAe,sBAY7C;IAED;;;;;OAKG;IACI,WAAW,SAAU,MAAM,eAAe,mBAAmB,eAAe,CAAC,MAAM,eAAe,CAAC,KAAK,eAAe,CAAC,MAAM,eAAe,CAAC,UAEpJ;IAED;;;OAGG;IACI,iBAAiB,WAAY,OAAO,UAE1C;IAED;;;OAGG;IACI,SAAS,WAAY,eAAe,UAE1C;IAED;;;OAGG;IACI,YAAY,WAAY,eAAe,UAE7C;CACJ"}

package/lib/typescript/src/hooks/useUnistyles.d.ts

@@ -8,6 +8,20 @@ export declare const useUnistyles: () => {
             width: number;
             height: number;
         };
+        statusBar: {
+            width: number;
+            height: number;
+        };
+        navigationBar: {
+            width: number;
+            height: number;
+        };
+        insets: {
+            top: number;
+            bottom: number;
+            left: number;
+            right: number;
+        };
     };
     contentSizeCategory: import("../common").IOSContentSizeCategory | import("../common").AndroidContentSizeCategory;
 };

package/lib/typescript/src/hooks/useUnistyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useUnistyles.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useUnistyles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,YAAY;;;;;;;;;;;;CAuDxB,CAAA"}
+{"version":3,"file":"useUnistyles.d.ts","sourceRoot":"","sources":["../../../../src/hooks/useUnistyles.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;CAwExB,CAAA"}

package/lib/typescript/src/types/unistyles.d.ts

@@ -9,7 +9,7 @@ export type ScreenInsets = {
     bottom: number;
     left: number;
 };
-export type StatusBarDimensions = {
+export type ScreenDimensions = {
     height: number;
     width: number;
 };
@@ -30,7 +30,8 @@ export type UnistylesBridge = {
     contentSizeCategory: IOSContentSizeCategory | AndroidContentSizeCategory;
     sortedBreakpointPairs: Array<[keyof UnistylesBreakpoints, UnistylesBreakpoints[keyof UnistylesBreakpoints]]>;
     insets: ScreenInsets;
-    statusBar: StatusBarDimensions;
+    statusBar: ScreenDimensions;
+    navigationBar: ScreenDimensions;
     themes: Array<keyof UnistylesThemes>;
     useBreakpoints(breakpoints: UnistylesBreakpoints): void;
     useTheme(name: keyof UnistylesThemes): void;
@@ -49,6 +50,9 @@ export type UnistylesMobileLayoutEvent = {
     type: UnistylesEventType.Layout;
     payload: {
         screen: ScreenSize;
+        statusBar: ScreenDimensions;
+        navigationBar: ScreenDimensions;
+        insets: ScreenInsets;
         breakpoint: keyof UnistylesBreakpoints;
         orientation: typeof ScreenOrientation[keyof typeof ScreenOrientation];
     };

package/lib/typescript/src/types/unistyles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"unistyles.d.ts","sourceRoot":"","sources":["../../../../src/types/unistyles.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,sBAAsB,EAAE,0BAA0B,EAAE,MAAM,WAAW,CAAA;AACrH,OAAO,KAAK,EAAE,eAAe,EAAE,oBAAoB,EAAE,MAAM,WAAW,CAAA;AACtE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,QAAQ,CAAA;AACxC,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,UAAU,CAAA;AAE/C,MAAM,MAAM,eAAe,GAAG,OAAO,GAAG,MAAM,GAAG,aAAa,CAAA;AAE9D,MAAM,MAAM,YAAY,GAAG;IACvB,GAAG,EAAE,MAAM,CAAC;IACZ,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAA;CACf,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAC9B,MAAM,EAAE,MAAM,CAAC;IACf,KAAK,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,YAAY,CAAC,EAAE,MAAM,eAAe,CAAC;IACrC,OAAO,CAAC,EAAE,KAAK,CAAC,eAAe,CAAC,CAAC;IACjC,2BAA2B,CAAC,EAAE,OAAO,CAAA;CACxC,CAAA;AAED,MAAM,MAAM,eAAe,GAAG;IAE1B,WAAW,EAAE,MAAM,CAAC;IACpB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;IAC9B,iBAAiB,EAAE,OAAO,CAAC;IAC3B,SAAS,EAAE,MAAM,eAAe,CAAC;IACjC,UAAU,EAAE,MAAM,oBAAoB,CAAC;IACvC,WAAW,EAAE,eAAe,CAAC;IAC7B,mBAAmB,EAAE,sBAAsB,GAAG,0BAA0B,CAAC;IACzE,qBAAqB,EAAE,KAAK,CAAC,CAAC,MAAM,oBAAoB,EAAE,oBAAoB,CAAC,MAAM,oBAAoB,CAAC,CAAC,CAAC,CAAC;IAC7G,MAAM,EAAE,YAAY,CAAC;IACrB,SAAS,EAAE,mBAAmB,CAAC;IAG/B,MAAM,EAAE,KAAK,CAAC,MAAM,eAAe,CAAC,CAAC;IACrC,cAAc,CAAC,WAAW,EAAE,oBAAoB,GAAG,IAAI,CAAC;IACxD,QAAQ,CAAC,IAAI,EAAE,MAAM,eAAe,GAAG,IAAI,CAAC;IAC5C,WAAW,CAAC,IAAI,EAAE,MAAM,eAAe,GAAG,IAAI,CAAC;IAC/C,iBAAiB,CAAC,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACzC,SAAS,CAAC,UAAU,EAAE,MAAM,EAAE,MAAM,EAAE,OAAO,GAAG,IAAI,CAAC;IACrD,YAAY,CAAC,UAAU,EAAE,MAAM,GAAG,IAAI,CAAA;CACzC,CAAA;AAED,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,kBAAkB,CAAC,KAAK,CAAC;IAC/B,OAAO,EAAE;QACL,SAAS,EAAE,MAAM,eAAe,CAAA;KACnC,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,0BAA0B,GAAG;IACrC,IAAI,EAAE,kBAAkB,CAAC,MAAM,CAAC;IAChC,OAAO,EAAE;QACL,MAAM,EAAE,UAAU,CAAC;QACnB,UAAU,EAAE,MAAM,oBAAoB,CAAC;QACvC,WAAW,EAAE,OAAO,iBAAiB,CAAC,MAAM,OAAO,iBAAiB,CAAC,CAAA;KACxE,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,oBAAoB,GAAG;IAC/B,IAAI,EAAE,kBAAkB,CAAC,MAAM,CAAA;CAClC,CAAA;AAED,MAAM,MAAM,6BAA6B,GAAG;IACxC,IAAI,EAAE,kBAAkB,CAAC,eAAe,CAAC;IACzC,OAAO,EAAE;QACL,mBAAmB,EAAE,sBAAsB,GAAG,0BAA0B,CAAA;KAC3E,CAAA;CACJ,CAAA;AAED,MAAM,MAAM,eAAe,GAAG,mBAAmB,GAAG,0BAA0B,GAAG,oBAAoB,GAAG,6BAA6B,CAAA"}
+{"version":3,"file":"unistyles.d.ts","sourceRoot":"","sources":["../../../../src/types/unistyles.ts"],"names":[],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-unistyles",
-  "version": "2.4.0-rc.1",
+  "version": "2.4.0-rc.2",
   "description": "Level up your React Native StyleSheet",
   "scripts": {
     "test": "jest",

package/src/common.ts

@@ -16,6 +16,11 @@ export const ScreenOrientation = {
 } as const
 
 export enum IOSContentSizeCategory {
+    AccessibilityExtraExtraExtraLarge = 'accessibilityExtraExtraExtraLarge',
+    AccessibilityExtraExtraLarge = 'accessibilityExtraExtraLarge',
+    AccessibilityExtraLarge = 'accessibilityExtraLarge',
+    AccessibilityLarge = 'accessibilityLarge',
+    AccessibilityMedium = 'accessibilityMedium',
     ExtraExtraExtraLarge = 'xxxLarge',
     ExtraExtraLarge = 'xxLarge',
     ExtraLarge = 'xLarge',
@@ -31,7 +36,9 @@ export enum AndroidContentSizeCategory {
     Default = 'Default',
     Large = 'Large',
     ExtraLarge = 'ExtraLarge',
-    Huge = 'Huge'
+    Huge = 'Huge',
+    ExtraHuge = 'ExtraHuge',
+    ExtraExtraHuge = 'ExtraExtraHuge'
 }
 
 export enum UnistylesEventType {

package/src/core/UnistylesModule.ts

@@ -1,6 +1,6 @@
 import { NativeEventEmitter, NativeModules } from 'react-native'
 import type { UnistylesThemes, UnistylesBreakpoints } from 'react-native-unistyles'
-import type { ColorSchemeName, ScreenInsets, StatusBarDimensions } from '../types'
+import type { ColorSchemeName, ScreenInsets, ScreenDimensions } from '../types'
 import { normalizeWebStylesPlugin } from '../plugins'
 import { isServer } from '../common'
 
@@ -25,7 +25,11 @@ export class UnistylesBridgeWeb {
         bottom: 0,
         left: 0
     }
-    #statusBar: StatusBarDimensions = {
+    #statusBar: ScreenDimensions = {
+        height: 0,
+        width: 0
+    }
+    #navigationBar: ScreenDimensions = {
         height: 0,
         width: 0
     }
@@ -68,6 +72,8 @@ export class UnistylesBridgeWeb {
                         return this.#insets
                     case 'statusBar':
                         return this.#statusBar
+                    case 'navigationBar':
+                        return this.#navigationBar
                     case 'useTheme':
                         return (themeName: keyof UnistylesThemes) => this.useTheme(themeName)
                     case 'updateTheme':

package/src/core/UnistylesRuntime.ts

@@ -92,6 +92,14 @@ export class UnistylesRuntime {
         return this.unistylesBridge.statusBar
     }
 
+    /**
+     * Get the navigation bar info (Android)
+     * @returns - The navigation bar size { width, height }
+     */
+    public get navigationBar() {
+        return this.unistylesBridge.navigationBar
+    }
+
     /**
      * Get the screen orientation
      * @returns - The screen orientation

package/src/hooks/useUnistyles.ts

@@ -16,6 +16,20 @@ export const useUnistyles = () => {
         screenSize: {
             width: unistyles.runtime.screen.width,
             height: unistyles.runtime.screen.height
+        },
+        statusBar: {
+            width: unistyles.runtime.statusBar.width,
+            height: unistyles.runtime.statusBar.height
+        },
+        navigationBar: {
+            width: unistyles.runtime.navigationBar.width,
+            height: unistyles.runtime.navigationBar.height
+        },
+        insets: {
+            top: unistyles.runtime.insets.top,
+            bottom: unistyles.runtime.insets.bottom,
+            left: unistyles.runtime.insets.left,
+            right: unistyles.runtime.insets.right
         }
     })
 
@@ -35,7 +49,10 @@ export const useUnistyles = () => {
                         return setLayout({
                             breakpoint: layoutEvent.payload.breakpoint,
                             orientation: layoutEvent.payload.orientation,
-                            screenSize: layoutEvent.payload.screen
+                            screenSize: layoutEvent.payload.screen,
+                            statusBar: layoutEvent.payload.statusBar,
+                            insets: layoutEvent.payload.insets,
+                            navigationBar: layoutEvent.payload.navigationBar
                         })
                     }
                     case UnistylesEventType.Plugin: {

package/src/types/unistyles.ts

@@ -12,7 +12,7 @@ export type ScreenInsets = {
     left: number
 }
 
-export type StatusBarDimensions = {
+export type ScreenDimensions = {
     height: number,
     width: number
 }
@@ -36,7 +36,8 @@ export type UnistylesBridge = {
     contentSizeCategory: IOSContentSizeCategory | AndroidContentSizeCategory,
     sortedBreakpointPairs: Array<[keyof UnistylesBreakpoints, UnistylesBreakpoints[keyof UnistylesBreakpoints]]>,
     insets: ScreenInsets,
-    statusBar: StatusBarDimensions,
+    statusBar: ScreenDimensions,
+    navigationBar: ScreenDimensions
 
     // setters
     themes: Array<keyof UnistylesThemes>,
@@ -59,6 +60,9 @@ export type UnistylesMobileLayoutEvent = {
     type: UnistylesEventType.Layout,
     payload: {
         screen: ScreenSize,
+        statusBar: ScreenDimensions,
+        navigationBar: ScreenDimensions,
+        insets: ScreenInsets,
         breakpoint: keyof UnistylesBreakpoints,
         orientation: typeof ScreenOrientation[keyof typeof ScreenOrientation]
     }