@rific/scroll-view 0.6.4 → 0.6.5

package/dist/index.js

@@ -1096,9 +1096,10 @@ var ScrollViewFooter = ({ children, style }) => {
   }, [footerHeight, footerFixed, headerHeightShared, pullSearchHeightShared, scrollPosition, snapBackFooterShared, footerOffset]);
   const containerPaddingBottom = footerFixed && footerAboveKeyboard ? keyboardHeight : 0;
   const rowPaddingBottom = footerFixed && footerAboveKeyboard ? Math.max(insets.bottom - keyboardHeight, 0) : insets.bottom;
+  const { paddingBottom: consumerPaddingBottom, ...restStyle } = style ?? {};
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_react_native_reanimated11.default.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [styles6.footer, { bottom: tabBarHeight, paddingBottom: containerPaddingBottom }, footerStyle], children: [
     (footerHeight ?? 0) > 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_auto_paper3.BlurView, { blur, style: import_react_native11.StyleSheet.absoluteFill }),
-    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_native11.View, { style: [styles6.row, { paddingBottom: rowPaddingBottom }, style], children })
+    /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(import_react_native11.View, { style: [styles6.row, restStyle, { paddingBottom: rowPaddingBottom + (typeof consumerPaddingBottom === "number" ? consumerPaddingBottom : 0) }], children })
   ] });
 };
 var styles6 = import_react_native11.StyleSheet.create({

package/dist/index.mjs

@@ -1038,6 +1038,7 @@ var ScrollViewFooter = ({ children, style }) => {
   }, [footerHeight, footerFixed, headerHeightShared, pullSearchHeightShared, scrollPosition, snapBackFooterShared, footerOffset]);
   const containerPaddingBottom = footerFixed && footerAboveKeyboard ? keyboardHeight : 0;
   const rowPaddingBottom = footerFixed && footerAboveKeyboard ? Math.max(insets.bottom - keyboardHeight, 0) : insets.bottom;
+  const { paddingBottom: consumerPaddingBottom, ...restStyle } = style ?? {};
   return (
     // bottom: tabBarHeight (not the styles.footer default of 0) - a consuming app's own persistent
     // tab bar (a fixture outside this package's header/footer concepts entirely, same as
@@ -1045,7 +1046,7 @@ var ScrollViewFooter = ({ children, style }) => {
     // bar has to clear it rather than rendering flush against 0 and overlapping/hiding behind it.
     /* @__PURE__ */ jsxs5(Animated5.View, { onLayout: handleLayout, pointerEvents: "box-none", style: [styles6.footer, { bottom: tabBarHeight, paddingBottom: containerPaddingBottom }, footerStyle], children: [
       (footerHeight ?? 0) > 0 && /* @__PURE__ */ jsx8(BlurView2, { blur, style: StyleSheet5.absoluteFill }),
-      /* @__PURE__ */ jsx8(View5, { style: [styles6.row, { paddingBottom: rowPaddingBottom }, style], children })
+      /* @__PURE__ */ jsx8(View5, { style: [styles6.row, restStyle, { paddingBottom: rowPaddingBottom + (typeof consumerPaddingBottom === "number" ? consumerPaddingBottom : 0) }], children })
     ] })
   );
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rific/scroll-view",
-  "version": "0.6.4",
+  "version": "0.6.5",
   "description": "Blur styled scroll system for React Native. Floating headers/footers, keyboard awareness, and scroll-away chrome",
   "keywords": [
     "react-native",

package/src/ScrollViewFooter.tsx

@@ -75,6 +75,12 @@ export const ScrollViewFooter = ({ children, style }: ScrollViewFooterProps) =>
   // padding's growth cancel out exactly, so the content holds still at the safe-area line instead
   // of dropping past it and correcting back up.
   const rowPaddingBottom = footerFixed && footerAboveKeyboard ? Math.max(insets.bottom - keyboardHeight, 0) : insets.bottom
+  // A consumer's own `style.paddingBottom` (e.g. tightening the row's vertical rhythm to match a
+  // header's actionMargin) is spread after rowPaddingBottom below, so it has to be added to it
+  // rather than assigned after it — plain style-array merge would otherwise let it silently
+  // replace the safe-area clearance instead of sitting on top of it, leaving the row's real
+  // content (buttons, etc.) flush against the home indicator.
+  const { paddingBottom: consumerPaddingBottom, ...restStyle } = style ?? {}
   return (
     // bottom: tabBarHeight (not the styles.footer default of 0) - a consuming app's own persistent
     // tab bar (a fixture outside this package's header/footer concepts entirely, same as
@@ -82,7 +88,7 @@ export const ScrollViewFooter = ({ children, style }: ScrollViewFooterProps) =>
     // bar has to clear it rather than rendering flush against 0 and overlapping/hiding behind it.
     <Animated.View onLayout={handleLayout} pointerEvents='box-none' style={[styles.footer, { bottom: tabBarHeight, paddingBottom: containerPaddingBottom }, footerStyle]}>
       {(footerHeight ?? 0) > 0 && <BlurView blur={blur} style={StyleSheet.absoluteFill} />}
-      <View style={[styles.row, { paddingBottom: rowPaddingBottom }, style]}>{children}</View>
+      <View style={[styles.row, restStyle, { paddingBottom: rowPaddingBottom + (typeof consumerPaddingBottom === 'number' ? consumerPaddingBottom : 0) }]}>{children}</View>
     </Animated.View>
   )
 }