expose useSafeArea prop in ActionBar, also allow to control whether the ActionBar is positioned relative or absolute, using keepRelative prop

Author: ethanshar

package.json

@@ -1,6 +1,6 @@
 {
   "name": "react-native-ui-lib",
-  "version": "3.3.34",
+  "version": "3.3.35",
   "main": "index.js",
   "author": "Ethan Sharabi <[email protected]>",
   "publishConfig": {

src/components/actionBar/index.js

@@ -32,6 +32,14 @@ export default class ActionBar extends BaseComponent {
      * should action be equally centered
      */
     centered: PropTypes.bool,
+    /**
+     * use safe area, in case action bar attached to the bottom (default: true)
+     */
+    useSafeArea: PropTypes.bool,
+    /**
+     * keep the action bar postion relative instead of it absolute position
+     */
+    keepRelative: PropTypes.bool,
     /**
      * style the action bar
      */
@@ -41,6 +49,7 @@ export default class ActionBar extends BaseComponent {
   static defaultProps = {
     height: 48,
     backgroundColor: Colors.white,
+    useSafeArea: true,
   };
 
   generateStyles() {
@@ -59,10 +68,10 @@ export default class ActionBar extends BaseComponent {
   }
 
   render() {
-    const {actions, centered, style, ...others} = this.props;
+    const {actions, centered, style, useSafeArea, keepRelative, ...others} = this.props;
 
     return (
-      <View useSafeArea style={this.styles.absoluteContainer}>
+      <View useSafeArea={useSafeArea} style={[!keepRelative && this.styles.absoluteContainer]}>
         <View
           row
           centerV