@rific/auto-paper 0.13.2 → 0.13.3

package/README.md

@@ -413,7 +413,7 @@ function SettingsScreen() {
 
 ### `Appbar`
 
-A thin wrapper around `react-native-paper`'s `Appbar` that automatically syncs `StatusBar` background color and bar style to the current theme surface color (no `StatusBar` under `<Provider statusBar={false}>`).
+A thin wrapper around `react-native-paper`'s `Appbar` that automatically syncs the `StatusBar` bar style to the current theme (React Native 0.88 removed `StatusBar`'s Android-only `backgroundColor`, which edge-to-edge already ignored, so 0.13.3 stopped passing it) (no `StatusBar` under `<Provider statusBar={false}>`).
 
 ```tsx
 import { Appbar } from '@rific/auto-paper'

package/dist/index.js

@@ -628,7 +628,7 @@ function ThemeProviderBody({ children, defaults, expoBlur, fontFamily, maskedVie
   }, [theme, onReady]);
   if (!theme) return null;
   return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(import_react_native_paper2.Provider, { theme, children: [
-    statusBar && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.StatusBar, { backgroundColor: theme.colors.background, barStyle: theme.dark ? "light-content" : "dark-content", ...statusBarProps }),
+    statusBar && /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.StatusBar, { barStyle: theme.dark ? "light-content" : "dark-content", ...statusBarProps }),
     /* @__PURE__ */ (0, import_jsx_runtime.jsx)(StatusBarEnabledContext.Provider, { value: statusBar, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(PaperDefaultsContext.Provider, { value: defaults ?? {}, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(NavBarContext.Provider, { value: { navigationBar, onNavBarChange }, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(BlurModuleContext.Provider, { value: expoBlur, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(ReanimatedModuleContext.Provider, { value: reanimated, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(MaskedViewModuleContext.Provider, { value: maskedView, children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native_paper2.Portal.Host, { children: /* @__PURE__ */ (0, import_jsx_runtime.jsx)(import_react_native2.View, { style: [styles.flex, { backgroundColor: theme.colors.background }, style], children }) }) }) }) }) }) }) })
   ] });
 }
@@ -643,7 +643,7 @@ function Header({ style, ...props }) {
   const theme = (0, import_react_native_paper3.useTheme)();
   const statusBar = useStatusBarEnabled();
   return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_jsx_runtime2.Fragment, { children: [
-    statusBar && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native3.StatusBar, { backgroundColor: theme.colors.surface, barStyle: theme.dark ? "light-content" : "dark-content" }),
+    statusBar && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native3.StatusBar, { barStyle: theme.dark ? "light-content" : "dark-content" }),
     /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_react_native_paper3.Appbar.Header, { ...defaults.AppbarHeader, ...props, style })
   ] });
 }

package/dist/index.mjs

@@ -542,7 +542,7 @@ function ThemeProviderBody({ children, defaults, expoBlur, fontFamily, maskedVie
   }, [theme, onReady]);
   if (!theme) return null;
   return /* @__PURE__ */ jsxs(PaperProvider, { theme, children: [
-    statusBar && /* @__PURE__ */ jsx(StatusBar, { backgroundColor: theme.colors.background, barStyle: theme.dark ? "light-content" : "dark-content", ...statusBarProps }),
+    statusBar && /* @__PURE__ */ jsx(StatusBar, { barStyle: theme.dark ? "light-content" : "dark-content", ...statusBarProps }),
     /* @__PURE__ */ jsx(StatusBarEnabledContext.Provider, { value: statusBar, children: /* @__PURE__ */ jsx(PaperDefaultsContext.Provider, { value: defaults ?? {}, children: /* @__PURE__ */ jsx(NavBarContext.Provider, { value: { navigationBar, onNavBarChange }, children: /* @__PURE__ */ jsx(BlurModuleContext.Provider, { value: expoBlur, children: /* @__PURE__ */ jsx(ReanimatedModuleContext.Provider, { value: reanimated, children: /* @__PURE__ */ jsx(MaskedViewModuleContext.Provider, { value: maskedView, children: /* @__PURE__ */ jsx(Portal.Host, { children: /* @__PURE__ */ jsx(View, { style: [styles.flex, { backgroundColor: theme.colors.background }, style], children }) }) }) }) }) }) }) })
   ] });
 }
@@ -557,7 +557,7 @@ function Header({ style, ...props }) {
   const theme = useTheme();
   const statusBar = useStatusBarEnabled();
   return /* @__PURE__ */ jsxs2(Fragment, { children: [
-    statusBar && /* @__PURE__ */ jsx2(StatusBar2, { backgroundColor: theme.colors.surface, barStyle: theme.dark ? "light-content" : "dark-content" }),
+    statusBar && /* @__PURE__ */ jsx2(StatusBar2, { barStyle: theme.dark ? "light-content" : "dark-content" }),
     /* @__PURE__ */ jsx2(PaperAppbar.Header, { ...defaults.AppbarHeader, ...props, style })
   ] });
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rific/auto-paper",
-  "version": "0.13.2",
+  "version": "0.13.3",
   "description": "Adaptive react-native-paper theming: triadic palette from a seed color + system/light/dark appearance",
   "keywords": [
     "react-native",
@@ -69,8 +69,8 @@
   },
   "devDependencies": {
     "@infinitetoken/eslint-config": "0.2.0",
-    "@infinitetoken/jest-config": "^0.4.0",
-    "@infinitetoken/tsconfig": "^0.5.0",
+    "@infinitetoken/jest-config": "^0.5.0",
+    "@infinitetoken/tsconfig": "^0.6.0",
     "@react-native-masked-view/masked-view": "^0.3.2",
     "@reduxjs/toolkit": "^2.0.0",
     "@rific/core": "^0.3.0",
@@ -81,16 +81,16 @@
     "eslint": "^9.39.4",
     "eslint-plugin-react-hooks": "^7.1.1",
     "eslint-plugin-react-native": "^5.0.0",
-    "expo-blur": "^57.0.3",
-    "expo-navigation-bar": "^57.0.3",
+    "expo-blur": "^58.0.3",
+    "expo-navigation-bar": "^58.0.4",
     "jest": "^30.0.0",
     "jest-environment-jsdom": "^30.0.0",
     "prettier": "^3.8.3",
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
-    "react-native": "^0.86.3",
+    "react-native": "^0.88.0",
     "react-native-paper": "^5.12.0",
-    "react-native-safe-area-context": "^5.5.2",
+    "react-native-safe-area-context": "^5.10.1",
     "tsup": "^8.0.0",
     "typescript": "^6.0.3"
   },

package/src/ThemeProvider.tsx

@@ -109,7 +109,7 @@ function ThemeProviderBody({ children, defaults, expoBlur, fontFamily, maskedVie
 
   return (
     <PaperProvider theme={theme}>
-      {statusBar && <StatusBar backgroundColor={theme.colors.background} barStyle={theme.dark ? 'light-content' : 'dark-content'} {...statusBarProps} />}
+      {statusBar && <StatusBar barStyle={theme.dark ? 'light-content' : 'dark-content'} {...statusBarProps} />}
       <StatusBarEnabledContext.Provider value={statusBar}>
         <PaperDefaultsContext.Provider value={defaults ?? {}}>
           <NavBarContext.Provider value={{ navigationBar, onNavBarChange }}>

package/src/components/Appbar.tsx

@@ -11,7 +11,7 @@ function Header({ style, ...props }: AppbarHeaderProps) {
   const statusBar = useStatusBarEnabled()
   return (
     <>
-      {statusBar && <StatusBar backgroundColor={theme.colors.surface} barStyle={theme.dark ? 'light-content' : 'dark-content'} />}
+      {statusBar && <StatusBar barStyle={theme.dark ? 'light-content' : 'dark-content'} />}
       <PaperAppbar.Header {...defaults.AppbarHeader} {...props} style={style} />
     </>
   )