react-native-ui-lib 8.4.3-snapshot.7927 → 8.4.3-snapshot.7933

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "8.4.3-snapshot.7927",
+  "version": "8.4.3-snapshot.7933",
   "main": "src/index.js",
   "types": "src/index.d.ts",
   "author": "Ethan Sharabi <ethan.shar@gmail.com>",

package/src/components/screenFooter/index.js

@@ -29,6 +29,7 @@ const ScreenFooter = props => {
     shadow = ScreenFooterShadow.SH20,
     hideDivider = false,
     isAndroidEdgeToEdge = !!androidVersion && androidVersion >= 35 ? true : undefined,
+    containerStyle: containerStyleOverride,
     contentContainerStyle: contentContainerStyleOverride
   } = props;
   const withoutAnimation = animationDuration === 0;
@@ -186,15 +187,15 @@ const ScreenFooter = props => {
     return withoutAnimation ? View : Animated.View;
   }, [withoutAnimation]);
   const containerStyle = useMemo(() => {
-    return withoutAnimation ? styles.container : [styles.container, hoistedAnimatedStyle];
+    return withoutAnimation ? [styles.container, containerStyleOverride] : [styles.container, hoistedAnimatedStyle, containerStyleOverride];
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [withoutAnimation]);
+  }, [withoutAnimation, containerStyleOverride]);
   if (keyboardBehavior === KeyboardBehavior.HOISTED) {
     return <Container style={containerStyle} pointerEvents={visible ? 'box-none' : 'none'}>
         <Keyboard.KeyboardAccessoryView renderContent={renderFooterContent} kbInputRef={undefined} scrollBehavior={Keyboard.KeyboardAccessoryView.scrollBehaviors.FIXED_OFFSET} useSafeArea={false} manageScrollView={false} revealKeyboardInteractive onHeightChanged={setHeight} />
       </Container>;
   }
-  return <Animated.View testID={testID} onLayout={onLayout} style={[styles.container, stickyAnimatedStyle]}>
+  return <Animated.View testID={testID} onLayout={onLayout} style={[styles.container, stickyAnimatedStyle, containerStyleOverride]}>
       {renderFooterContent()}
     </Animated.View>;
 };
@@ -205,7 +206,7 @@ const styles = StyleSheet.create({
     bottom: 0,
     left: 0,
     right: 0,
-    zIndex: 1
+    zIndex: 50
   },
   contentContainer: {
     paddingTop: Spacings.s4,

package/src/components/screenFooter/screenFooter.api.json

@@ -87,6 +87,11 @@
       "type": "boolean",
       "description": "Indicates if the device is an Android device that supports edge-to-edge. Defaults to true for Android with version 35 and above, undefined for others."
     },
+    {
+      "name": "containerStyle",
+      "type": "StyleProp<ViewStyle>",
+      "description": "Custom style for the outer container of the footer. Can be used to override zIndex or other container-level properties."
+    },
     {
       "name": "contentContainerStyle",
       "type": "StyleProp<ViewStyle>",

package/src/components/screenFooter/types.d.ts

@@ -97,6 +97,10 @@ export interface ScreenFooterProps extends PropsWithChildren<{}> {
      * Only applies when backgroundType is 'solid'
      */
     hideDivider?: boolean;
+    /**
+     * Custom style for the outer container of the footer.
+     */
+    containerStyle?: StyleProp<ViewStyle>;
     /**
      * Custom style for the content container that wraps the footer's children.
      * Can be used to override default padding, gap, or other layout properties.