@adiraku/react-native-ui 0.2.4 → 1.0.1

package/lib/commonjs/components/BottomSheet/BottomSheet.component.js

@@ -6,11 +6,14 @@ Object.defineProperty(exports, "__esModule", {
 exports.BottomSheet = void 0;
 var React = _interopRequireWildcard(require("react"));
 var _reactNative = require("react-native");
+var _reactNativeModal = _interopRequireDefault(require("react-native-modal"));
 var _BottomSheet = require("./BottomSheet.style");
 var _typography = require("../typography/typography.component");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const deviceWindow = _reactNative.Dimensions.get('window');
 const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
   const {
     onDismiss,
@@ -18,22 +21,25 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
     titleProps = {},
     subtitle,
     subtitleProps = {},
-    isOverlayDismissDisabled = false,
     dismissIcon = null,
     dismissIconProps = {},
     action = null,
     largeIcon = null,
     largeIconContainerHeight = 50,
-    animationType = 'slide',
-    children
+    maxSheetHeight = 0.85,
+    backdropTransitionOutTiming = 0,
+    onBackdropPress = () => {},
+    onBackButtonPress = () => {},
+    children,
+    ...rest
   } = props;
-  const screenHeight = _reactNative.Dimensions.get('screen').height;
-  const screenWidth = _reactNative.Dimensions.get('screen').width;
-  const panY = React.useRef(new _reactNative.Animated.Value(screenHeight)).current;
+  const computedStyle = (0, _BottomSheet.getStyle)();
   const [visibility, setVisibility] = React.useState(false);
+  const panY = React.useRef(new _reactNative.Animated.Value(deviceWindow.height)).current;
   React.useImperativeHandle(ref, () => {
     return {
       open() {
+        console.log('clicked');
         setVisibility(true);
       },
       close() {
@@ -41,14 +47,17 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
     };
   }, []);
-  const computedStyle = (0, _BottomSheet.getStyle)();
+  const handleDismiss = () => {
+    setVisibility(false);
+    closeAnim.start(onDismiss);
+  };
   const resetPositionAnim = _reactNative.Animated.timing(panY, {
     toValue: 0,
     duration: 300,
     useNativeDriver: true
   });
   const closeAnim = _reactNative.Animated.timing(panY, {
-    toValue: screenHeight,
+    toValue: deviceWindow.height,
     duration: 300,
     useNativeDriver: true
   });
@@ -56,10 +65,6 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
     inputRange: [-1, 0, 1],
     outputRange: [0, 0, 1]
   });
-  const handleDismiss = () => {
-    setVisibility(false);
-    closeAnim.start(onDismiss);
-  };
   React.useEffect(() => {
     resetPositionAnim.start();
   }, [resetPositionAnim]);
@@ -85,8 +90,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       style: [computedStyle.sheetHeader]
     }, /*#__PURE__*/React.createElement(_reactNative.View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 2,
-        minWidth: (screenWidth - 32) / 8 * 2
+        maxWidth: (deviceWindow.width - 32) / 8 * 2,
+        minWidth: (deviceWindow.width - 32) / 8 * 2
       }]
     }, !!dismissIcon && /*#__PURE__*/React.createElement(_reactNative.TouchableHighlight, _extends({
       onPress: handleDismiss,
@@ -94,8 +99,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       underlayColor: 'transparent'
     }, dismissIconProps), dismissIcon)), /*#__PURE__*/React.createElement(_reactNative.View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 4,
-        minWidth: (screenWidth - 32) / 8 * 4
+        maxWidth: (deviceWindow.width - 32) / 8 * 4,
+        minWidth: (deviceWindow.width - 32) / 8 * 4
       }]
     }, !!title && /*#__PURE__*/React.createElement(_typography.Typography, _extends({
       variant: "subtitle1",
@@ -103,8 +108,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       numberOfLines: 2
     }, titleProps), title)), /*#__PURE__*/React.createElement(_reactNative.View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 2,
-        minWidth: (screenWidth - 32) / 8 * 2
+        maxWidth: (deviceWindow.width - 32) / 8 * 2,
+        minWidth: (deviceWindow.width - 32) / 8 * 2
       }, computedStyle.sheetActionWrapper]
     }, action || null)), !!subtitle && /*#__PURE__*/React.createElement(_typography.Typography, _extends({
       variant: "body2",
@@ -121,31 +126,34 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       style: [computedStyle.largeIconAbsoluteWrapper]
     }, largeIcon));
   };
-  return /*#__PURE__*/React.createElement(_reactNative.Modal, {
-    animated: true,
-    animationType: animationType,
-    visible: visibility,
-    transparent: true,
-    onRequestClose: handleDismiss
-  }, /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: [computedStyle.flex, computedStyle.overlayColor]
-  }, /*#__PURE__*/React.createElement(_reactNative.TouchableWithoutFeedback, {
-    onPress: handleDismiss,
-    disabled: isOverlayDismissDisabled
-  }, /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: [computedStyle.overlay]
-  })), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
+  return /*#__PURE__*/React.createElement(_reactNativeModal.default, _extends({
+    isVisible: visibility,
+    backdropTransitionOutTiming: backdropTransitionOutTiming,
+    onBackdropPress: () => {
+      onBackdropPress();
+      handleDismiss();
+    },
+    onBackButtonPress: () => {
+      onBackButtonPress();
+      handleDismiss();
+    },
+    onSwipeComplete: () => handleDismiss(),
     style: {
-      ...computedStyle.container,
+      flex: 1,
+      margin: 0
+    }
+  }, rest), /*#__PURE__*/React.createElement(_reactNative.Animated.View, {
+    style: [computedStyle.container, {
+      maxHeight: deviceWindow.height * maxSheetHeight,
       transform: [{
         translateY: translateY
       }]
-    }
-  }, /*#__PURE__*/React.createElement(_reactNative.View, null, /*#__PURE__*/React.createElement(_reactNative.View, _extends({
+    }]
+  }, /*#__PURE__*/React.createElement(_reactNative.View, _extends({
     style: [computedStyle.sheetIndicatorWrapper]
   }, panResponders.panHandlers), !largeIcon && /*#__PURE__*/React.createElement(_reactNative.View, {
     style: computedStyle.sliderIndicator
-  })), largeIcon ? renderLargeIconComponent() : renderSheetHeader()), children)));
+  })), largeIcon ? renderLargeIconComponent() : renderSheetHeader(), children));
 });
 exports.BottomSheet = BottomSheet;
 //# sourceMappingURL=BottomSheet.component.js.map

package/lib/commonjs/components/BottomSheet/BottomSheet.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["BottomSheet","React","forwardRef","props","ref","onDismiss","title","titleProps","subtitle","subtitleProps","isOverlayDismissDisabled","dismissIcon","dismissIconProps","action","largeIcon","largeIconContainerHeight","animationType","children","screenHeight","Dimensions","get","height","screenWidth","width","panY","useRef","Animated","Value","current","visibility","setVisibility","useState","useImperativeHandle","open","close","computedStyle","getStyle","resetPositionAnim","timing","toValue","duration","useNativeDriver","closeAnim","translateY","interpolate","inputRange","outputRange","handleDismiss","start","useEffect","panResponders","PanResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","event","dy","onPanResponderRelease","_","gs","vy","renderSheetHeader","sheetHeaderWrapper","sheetHeader","maxWidth","minWidth","sheetDismissIconWrapper","textCenter","sheetActionWrapper","renderLargeIconComponent","largeIconContainer","largeIconAbsoluteWrapper","flex","overlayColor","overlay","container","transform","sheetIndicatorWrapper","panHandlers","sliderIndicator"],"sourceRoot":"../../src","sources":["BottomSheet.component.tsx"],"mappings":"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"}
+{"version":3,"names":["deviceWindow","Dimensions","get","BottomSheet","React","forwardRef","props","ref","onDismiss","title","titleProps","subtitle","subtitleProps","dismissIcon","dismissIconProps","action","largeIcon","largeIconContainerHeight","maxSheetHeight","backdropTransitionOutTiming","onBackdropPress","onBackButtonPress","children","rest","computedStyle","getStyle","visibility","setVisibility","useState","panY","useRef","Animated","Value","height","current","useImperativeHandle","open","console","log","close","handleDismiss","closeAnim","start","resetPositionAnim","timing","toValue","duration","useNativeDriver","translateY","interpolate","inputRange","outputRange","useEffect","panResponders","PanResponder","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","event","dy","onPanResponderRelease","_","gs","vy","renderSheetHeader","sheetHeaderWrapper","sheetHeader","maxWidth","width","minWidth","sheetDismissIconWrapper","textCenter","sheetActionWrapper","renderLargeIconComponent","largeIconContainer","largeIconAbsoluteWrapper","flex","margin","container","maxHeight","transform","sheetIndicatorWrapper","panHandlers","sliderIndicator"],"sourceRoot":"../../src","sources":["BottomSheet.component.tsx"],"mappings":"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"}

package/lib/commonjs/components/BottomSheet/BottomSheet.style.js

@@ -5,7 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.getStyle = void 0;
 var _reactNative = require("react-native");
-var _themes = require("../../../src/themes");
+var _themes = require("../../themes");
 const getStyle = () => {
   const computedStyle = {};
   computedStyle.flex = {
@@ -15,14 +15,13 @@ const getStyle = () => {
     flex: 1,
     justifyContent: 'flex-end'
   };
-  computedStyle.overlayColor = {
-    backgroundColor: 'rgba(0,0,0,0.2)'
-  };
   computedStyle.container = {
-    maxHeight: _reactNative.Dimensions.get('window').height / 8 * 7,
-    borderTopRightRadius: _themes.Radius[16],
-    borderTopLeftRadius: _themes.Radius[16],
-    backgroundColor: _themes.Palettes.whiteDark[50]
+    backgroundColor: _themes.Palettes.white[50],
+    position: 'absolute',
+    bottom: 0,
+    width: '100%',
+    borderTopEndRadius: _themes.Spacing[16],
+    borderTopStartRadius: _themes.Spacing[16]
   };
   computedStyle.sliderIndicator = {
     height: 5,
@@ -41,7 +40,8 @@ const getStyle = () => {
     justifyContent: 'space-between'
   };
   computedStyle.sheetHeaderWrapper = {
-    paddingHorizontal: _themes.Spacing[16]
+    paddingHorizontal: _themes.Spacing[16],
+    paddingBottom: _themes.Spacing[8]
   };
   computedStyle.sheetDismissIconWrapper = {
     padding: 4

package/lib/commonjs/components/BottomSheet/BottomSheet.style.js.map

@@ -1 +1 @@
-{"version":3,"names":["getStyle","computedStyle","flex","overlay","justifyContent","overlayColor","backgroundColor","container","maxHeight","Dimensions","get","height","borderTopRightRadius","Radius","borderTopLeftRadius","Palettes","whiteDark","sliderIndicator","width","borderRadius","full","grey","sheetIndicatorWrapper","alignItems","sheetHeader","flexDirection","sheetHeaderWrapper","paddingHorizontal","Spacing","sheetDismissIconWrapper","padding","sheetActionWrapper","textCenter","textAlign","largeIconContainer","largeIconAbsoluteWrapper","position","bottom","StyleSheet","create"],"sourceRoot":"../../src","sources":["BottomSheet.style.tsx"],"mappings":";;;;;;AACA;AAEA;AAmBO,MAAMA,QAAQ,GAAG,MAAM;EAC5B,MAAMC,aAAiC,GAAG,CAAC,CAAC;EAE5CA,aAAa,CAACC,IAAI,GAAG;IACnBA,IAAI,EAAE;EACR,CAAC;EAEDD,aAAa,CAACE,OAAO,GAAG;IACtBD,IAAI,EAAE,CAAC;IACPE,cAAc,EAAE;EAClB,CAAC;EACDH,aAAa,CAACI,YAAY,GAAG;IAC3BC,eAAe,EAAE;EACnB,CAAC;EAEDL,aAAa,CAACM,SAAS,GAAG;IACxBC,SAAS,EAAGC,uBAAU,CAACC,GAAG,CAAC,QAAQ,CAAC,CAACC,MAAM,GAAG,CAAC,GAAI,CAAC;IACpDC,oBAAoB,EAAEC,cAAM,CAAC,EAAE,CAAC;IAChCC,mBAAmB,EAAED,cAAM,CAAC,EAAE,CAAC;IAC/BP,eAAe,EAAES,gBAAQ,CAACC,SAAS,CAAC,EAAE;EACxC,CAAC;EACDf,aAAa,CAACgB,eAAe,GAAG;IAC9BN,MAAM,EAAE,CAAC;IACTO,KAAK,EAAE,GAAG;IACVC,YAAY,EAAEN,cAAM,CAACO,IAAI;IACzBd,eAAe,EAAES,gBAAQ,CAACM,IAAI,CAAC,GAAG;EACpC,CAAC;EAEDpB,aAAa,CAACqB,qBAAqB,GAAG;IACpCX,MAAM,EAAE,EAAE;IACVY,UAAU,EAAE,QAAQ;IACpBnB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACuB,WAAW,GAAG;IAC1BC,aAAa,EAAE,KAAK;IACpBF,UAAU,EAAE,QAAQ;IACpBnB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACyB,kBAAkB,GAAG;IACjCC,iBAAiB,EAAEC,eAAO,CAAC,EAAE;EAC/B,CAAC;EACD3B,aAAa,CAAC4B,uBAAuB,GAAG;IACtCC,OAAO,EAAE;EACX,CAAC;EACD7B,aAAa,CAAC8B,kBAAkB,GAAG;IACjCN,aAAa,EAAE,KAAK;IACpBrB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAAC+B,UAAU,GAAG;IACzBC,SAAS,EAAE;EACb,CAAC;EAEDhC,aAAa,CAACiC,kBAAkB,GAAG;IACjCX,UAAU,EAAE;EACd,CAAC;EAEDtB,aAAa,CAACkC,wBAAwB,GAAG;IACvCC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE;EACV,CAAC;EAED,OAAOC,uBAAU,CAACC,MAAM,CAACtC,aAAa,CAAC;AACzC,CAAC;AAAC"}
+{"version":3,"names":["getStyle","computedStyle","flex","overlay","justifyContent","container","backgroundColor","Palettes","white","position","bottom","width","borderTopEndRadius","Spacing","borderTopStartRadius","sliderIndicator","height","borderRadius","Radius","full","grey","sheetIndicatorWrapper","alignItems","sheetHeader","flexDirection","sheetHeaderWrapper","paddingHorizontal","paddingBottom","sheetDismissIconWrapper","padding","sheetActionWrapper","textCenter","textAlign","largeIconContainer","largeIconAbsoluteWrapper","StyleSheet","create"],"sourceRoot":"../../src","sources":["BottomSheet.style.tsx"],"mappings":";;;;;;AACA;AAEA;AAmBO,MAAMA,QAAQ,GAAG,MAAM;EAC5B,MAAMC,aAAiC,GAAG,CAAC,CAAC;EAE5CA,aAAa,CAACC,IAAI,GAAG;IACnBA,IAAI,EAAE;EACR,CAAC;EAEDD,aAAa,CAACE,OAAO,GAAG;IACtBD,IAAI,EAAE,CAAC;IACPE,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACI,SAAS,GAAG;IACxBC,eAAe,EAAEC,gBAAQ,CAACC,KAAK,CAAC,EAAE,CAAC;IACnCC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,KAAK,EAAE,MAAM;IACbC,kBAAkB,EAAEC,eAAO,CAAC,EAAE,CAAC;IAC/BC,oBAAoB,EAAED,eAAO,CAAC,EAAE;EAClC,CAAC;EAEDZ,aAAa,CAACc,eAAe,GAAG;IAC9BC,MAAM,EAAE,CAAC;IACTL,KAAK,EAAE,GAAG;IACVM,YAAY,EAAEC,cAAM,CAACC,IAAI;IACzBb,eAAe,EAAEC,gBAAQ,CAACa,IAAI,CAAC,GAAG;EACpC,CAAC;EAEDnB,aAAa,CAACoB,qBAAqB,GAAG;IACpCL,MAAM,EAAE,EAAE;IACVM,UAAU,EAAE,QAAQ;IACpBlB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACsB,WAAW,GAAG;IAC1BC,aAAa,EAAE,KAAK;IACpBF,UAAU,EAAE,QAAQ;IACpBlB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACwB,kBAAkB,GAAG;IACjCC,iBAAiB,EAAEb,eAAO,CAAC,EAAE,CAAC;IAC9Bc,aAAa,EAAEd,eAAO,CAAC,CAAC;EAC1B,CAAC;EACDZ,aAAa,CAAC2B,uBAAuB,GAAG;IACtCC,OAAO,EAAE;EACX,CAAC;EACD5B,aAAa,CAAC6B,kBAAkB,GAAG;IACjCN,aAAa,EAAE,KAAK;IACpBpB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAAC8B,UAAU,GAAG;IACzBC,SAAS,EAAE;EACb,CAAC;EAED/B,aAAa,CAACgC,kBAAkB,GAAG;IACjCX,UAAU,EAAE;EACd,CAAC;EAEDrB,aAAa,CAACiC,wBAAwB,GAAG;IACvCzB,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE;EACV,CAAC;EAED,OAAOyB,uBAAU,CAACC,MAAM,CAACnC,aAAa,CAAC;AACzC,CAAC;AAAC"}

package/lib/commonjs/components/index.js

@@ -21,6 +21,12 @@ Object.defineProperty(exports, "BottomSheet", {
     return _BottomSheet.BottomSheet;
   }
 });
+Object.defineProperty(exports, "BottomSheetHandler", {
+  enumerable: true,
+  get: function () {
+    return _BottomSheet.BottomSheetHandler;
+  }
+});
 Object.defineProperty(exports, "Button", {
   enumerable: true,
   get: function () {

package/lib/commonjs/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":[],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}
+{"version":3,"names":[],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAIA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA"}

package/lib/module/components/BottomSheet/BottomSheet.component.js

@@ -1,9 +1,11 @@
 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 import * as React from 'react';
-import { Animated, Dimensions, PanResponder, Modal, TouchableWithoutFeedback, View } from 'react-native';
+import { Animated, Dimensions, PanResponder, View } from 'react-native';
+import Modal from 'react-native-modal';
 import { getStyle } from './BottomSheet.style';
 import { Typography } from '../typography/typography.component';
 import { TouchableHighlight } from 'react-native';
+const deviceWindow = Dimensions.get('window');
 const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
   const {
     onDismiss,
@@ -11,22 +13,25 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
     titleProps = {},
     subtitle,
     subtitleProps = {},
-    isOverlayDismissDisabled = false,
     dismissIcon = null,
     dismissIconProps = {},
     action = null,
     largeIcon = null,
     largeIconContainerHeight = 50,
-    animationType = 'slide',
-    children
+    maxSheetHeight = 0.85,
+    backdropTransitionOutTiming = 0,
+    onBackdropPress = () => {},
+    onBackButtonPress = () => {},
+    children,
+    ...rest
   } = props;
-  const screenHeight = Dimensions.get('screen').height;
-  const screenWidth = Dimensions.get('screen').width;
-  const panY = React.useRef(new Animated.Value(screenHeight)).current;
+  const computedStyle = getStyle();
   const [visibility, setVisibility] = React.useState(false);
+  const panY = React.useRef(new Animated.Value(deviceWindow.height)).current;
   React.useImperativeHandle(ref, () => {
     return {
       open() {
+        console.log('clicked');
         setVisibility(true);
       },
       close() {
@@ -34,14 +39,17 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       }
     };
   }, []);
-  const computedStyle = getStyle();
+  const handleDismiss = () => {
+    setVisibility(false);
+    closeAnim.start(onDismiss);
+  };
   const resetPositionAnim = Animated.timing(panY, {
     toValue: 0,
     duration: 300,
     useNativeDriver: true
   });
   const closeAnim = Animated.timing(panY, {
-    toValue: screenHeight,
+    toValue: deviceWindow.height,
     duration: 300,
     useNativeDriver: true
   });
@@ -49,10 +57,6 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
     inputRange: [-1, 0, 1],
     outputRange: [0, 0, 1]
   });
-  const handleDismiss = () => {
-    setVisibility(false);
-    closeAnim.start(onDismiss);
-  };
   React.useEffect(() => {
     resetPositionAnim.start();
   }, [resetPositionAnim]);
@@ -78,8 +82,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       style: [computedStyle.sheetHeader]
     }, /*#__PURE__*/React.createElement(View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 2,
-        minWidth: (screenWidth - 32) / 8 * 2
+        maxWidth: (deviceWindow.width - 32) / 8 * 2,
+        minWidth: (deviceWindow.width - 32) / 8 * 2
       }]
     }, !!dismissIcon && /*#__PURE__*/React.createElement(TouchableHighlight, _extends({
       onPress: handleDismiss,
@@ -87,8 +91,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       underlayColor: 'transparent'
     }, dismissIconProps), dismissIcon)), /*#__PURE__*/React.createElement(View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 4,
-        minWidth: (screenWidth - 32) / 8 * 4
+        maxWidth: (deviceWindow.width - 32) / 8 * 4,
+        minWidth: (deviceWindow.width - 32) / 8 * 4
       }]
     }, !!title && /*#__PURE__*/React.createElement(Typography, _extends({
       variant: "subtitle1",
@@ -96,8 +100,8 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       numberOfLines: 2
     }, titleProps), title)), /*#__PURE__*/React.createElement(View, {
       style: [{
-        maxWidth: (screenWidth - 32) / 8 * 2,
-        minWidth: (screenWidth - 32) / 8 * 2
+        maxWidth: (deviceWindow.width - 32) / 8 * 2,
+        minWidth: (deviceWindow.width - 32) / 8 * 2
       }, computedStyle.sheetActionWrapper]
     }, action || null)), !!subtitle && /*#__PURE__*/React.createElement(Typography, _extends({
       variant: "body2",
@@ -114,31 +118,34 @@ const BottomSheet = /*#__PURE__*/React.forwardRef((props, ref) => {
       style: [computedStyle.largeIconAbsoluteWrapper]
     }, largeIcon));
   };
-  return /*#__PURE__*/React.createElement(Modal, {
-    animated: true,
-    animationType: animationType,
-    visible: visibility,
-    transparent: true,
-    onRequestClose: handleDismiss
-  }, /*#__PURE__*/React.createElement(View, {
-    style: [computedStyle.flex, computedStyle.overlayColor]
-  }, /*#__PURE__*/React.createElement(TouchableWithoutFeedback, {
-    onPress: handleDismiss,
-    disabled: isOverlayDismissDisabled
-  }, /*#__PURE__*/React.createElement(View, {
-    style: [computedStyle.overlay]
-  })), /*#__PURE__*/React.createElement(Animated.View, {
+  return /*#__PURE__*/React.createElement(Modal, _extends({
+    isVisible: visibility,
+    backdropTransitionOutTiming: backdropTransitionOutTiming,
+    onBackdropPress: () => {
+      onBackdropPress();
+      handleDismiss();
+    },
+    onBackButtonPress: () => {
+      onBackButtonPress();
+      handleDismiss();
+    },
+    onSwipeComplete: () => handleDismiss(),
     style: {
-      ...computedStyle.container,
+      flex: 1,
+      margin: 0
+    }
+  }, rest), /*#__PURE__*/React.createElement(Animated.View, {
+    style: [computedStyle.container, {
+      maxHeight: deviceWindow.height * maxSheetHeight,
       transform: [{
         translateY: translateY
       }]
-    }
-  }, /*#__PURE__*/React.createElement(View, null, /*#__PURE__*/React.createElement(View, _extends({
+    }]
+  }, /*#__PURE__*/React.createElement(View, _extends({
     style: [computedStyle.sheetIndicatorWrapper]
   }, panResponders.panHandlers), !largeIcon && /*#__PURE__*/React.createElement(View, {
     style: computedStyle.sliderIndicator
-  })), largeIcon ? renderLargeIconComponent() : renderSheetHeader()), children)));
+  })), largeIcon ? renderLargeIconComponent() : renderSheetHeader(), children));
 });
 export { BottomSheet };
 //# sourceMappingURL=BottomSheet.component.js.map

package/lib/module/components/BottomSheet/BottomSheet.component.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","Animated","Dimensions","PanResponder","Modal","TouchableWithoutFeedback","View","getStyle","Typography","TouchableHighlight","BottomSheet","forwardRef","props","ref","onDismiss","title","titleProps","subtitle","subtitleProps","isOverlayDismissDisabled","dismissIcon","dismissIconProps","action","largeIcon","largeIconContainerHeight","animationType","children","screenHeight","get","height","screenWidth","width","panY","useRef","Value","current","visibility","setVisibility","useState","useImperativeHandle","open","close","computedStyle","resetPositionAnim","timing","toValue","duration","useNativeDriver","closeAnim","translateY","interpolate","inputRange","outputRange","handleDismiss","start","useEffect","panResponders","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","event","dy","onPanResponderRelease","_","gs","vy","renderSheetHeader","sheetHeaderWrapper","sheetHeader","maxWidth","minWidth","sheetDismissIconWrapper","textCenter","sheetActionWrapper","renderLargeIconComponent","largeIconContainer","largeIconAbsoluteWrapper","flex","overlayColor","overlay","container","transform","sheetIndicatorWrapper","panHandlers","sliderIndicator"],"sourceRoot":"../../src","sources":["BottomSheet.component.tsx"],"mappings":"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"}
+{"version":3,"names":["React","Animated","Dimensions","PanResponder","View","Modal","getStyle","Typography","TouchableHighlight","deviceWindow","get","BottomSheet","forwardRef","props","ref","onDismiss","title","titleProps","subtitle","subtitleProps","dismissIcon","dismissIconProps","action","largeIcon","largeIconContainerHeight","maxSheetHeight","backdropTransitionOutTiming","onBackdropPress","onBackButtonPress","children","rest","computedStyle","visibility","setVisibility","useState","panY","useRef","Value","height","current","useImperativeHandle","open","console","log","close","handleDismiss","closeAnim","start","resetPositionAnim","timing","toValue","duration","useNativeDriver","translateY","interpolate","inputRange","outputRange","useEffect","panResponders","create","onStartShouldSetPanResponder","onMoveShouldSetPanResponder","onPanResponderMove","event","dy","onPanResponderRelease","_","gs","vy","renderSheetHeader","sheetHeaderWrapper","sheetHeader","maxWidth","width","minWidth","sheetDismissIconWrapper","textCenter","sheetActionWrapper","renderLargeIconComponent","largeIconContainer","largeIconAbsoluteWrapper","flex","margin","container","maxHeight","transform","sheetIndicatorWrapper","panHandlers","sliderIndicator"],"sourceRoot":"../../src","sources":["BottomSheet.component.tsx"],"mappings":"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"}

package/lib/module/components/BottomSheet/BottomSheet.style.js

@@ -1,5 +1,5 @@
-import { Dimensions, StyleSheet } from 'react-native';
-import { Palettes, Radius, Spacing } from '../../../src/themes';
+import { StyleSheet } from 'react-native';
+import { Palettes, Radius, Spacing } from '../../themes';
 export const getStyle = () => {
   const computedStyle = {};
   computedStyle.flex = {
@@ -9,14 +9,13 @@ export const getStyle = () => {
     flex: 1,
     justifyContent: 'flex-end'
   };
-  computedStyle.overlayColor = {
-    backgroundColor: 'rgba(0,0,0,0.2)'
-  };
   computedStyle.container = {
-    maxHeight: Dimensions.get('window').height / 8 * 7,
-    borderTopRightRadius: Radius[16],
-    borderTopLeftRadius: Radius[16],
-    backgroundColor: Palettes.whiteDark[50]
+    backgroundColor: Palettes.white[50],
+    position: 'absolute',
+    bottom: 0,
+    width: '100%',
+    borderTopEndRadius: Spacing[16],
+    borderTopStartRadius: Spacing[16]
   };
   computedStyle.sliderIndicator = {
     height: 5,
@@ -35,7 +34,8 @@ export const getStyle = () => {
     justifyContent: 'space-between'
   };
   computedStyle.sheetHeaderWrapper = {
-    paddingHorizontal: Spacing[16]
+    paddingHorizontal: Spacing[16],
+    paddingBottom: Spacing[8]
   };
   computedStyle.sheetDismissIconWrapper = {
     padding: 4

package/lib/module/components/BottomSheet/BottomSheet.style.js.map

@@ -1 +1 @@
-{"version":3,"names":["Dimensions","StyleSheet","Palettes","Radius","Spacing","getStyle","computedStyle","flex","overlay","justifyContent","overlayColor","backgroundColor","container","maxHeight","get","height","borderTopRightRadius","borderTopLeftRadius","whiteDark","sliderIndicator","width","borderRadius","full","grey","sheetIndicatorWrapper","alignItems","sheetHeader","flexDirection","sheetHeaderWrapper","paddingHorizontal","sheetDismissIconWrapper","padding","sheetActionWrapper","textCenter","textAlign","largeIconContainer","largeIconAbsoluteWrapper","position","bottom","create"],"sourceRoot":"../../src","sources":["BottomSheet.style.tsx"],"mappings":"AACA,SAASA,UAAU,EAAEC,UAAU,QAAQ,cAAc;AAErD,SAASC,QAAQ,EAAEC,MAAM,EAAEC,OAAO,QAAQ,qBAAqB;AAmB/D,OAAO,MAAMC,QAAQ,GAAG,MAAM;EAC5B,MAAMC,aAAiC,GAAG,CAAC,CAAC;EAE5CA,aAAa,CAACC,IAAI,GAAG;IACnBA,IAAI,EAAE;EACR,CAAC;EAEDD,aAAa,CAACE,OAAO,GAAG;IACtBD,IAAI,EAAE,CAAC;IACPE,cAAc,EAAE;EAClB,CAAC;EACDH,aAAa,CAACI,YAAY,GAAG;IAC3BC,eAAe,EAAE;EACnB,CAAC;EAEDL,aAAa,CAACM,SAAS,GAAG;IACxBC,SAAS,EAAGb,UAAU,CAACc,GAAG,CAAC,QAAQ,CAAC,CAACC,MAAM,GAAG,CAAC,GAAI,CAAC;IACpDC,oBAAoB,EAAEb,MAAM,CAAC,EAAE,CAAC;IAChCc,mBAAmB,EAAEd,MAAM,CAAC,EAAE,CAAC;IAC/BQ,eAAe,EAAET,QAAQ,CAACgB,SAAS,CAAC,EAAE;EACxC,CAAC;EACDZ,aAAa,CAACa,eAAe,GAAG;IAC9BJ,MAAM,EAAE,CAAC;IACTK,KAAK,EAAE,GAAG;IACVC,YAAY,EAAElB,MAAM,CAACmB,IAAI;IACzBX,eAAe,EAAET,QAAQ,CAACqB,IAAI,CAAC,GAAG;EACpC,CAAC;EAEDjB,aAAa,CAACkB,qBAAqB,GAAG;IACpCT,MAAM,EAAE,EAAE;IACVU,UAAU,EAAE,QAAQ;IACpBhB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACoB,WAAW,GAAG;IAC1BC,aAAa,EAAE,KAAK;IACpBF,UAAU,EAAE,QAAQ;IACpBhB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACsB,kBAAkB,GAAG;IACjCC,iBAAiB,EAAEzB,OAAO,CAAC,EAAE;EAC/B,CAAC;EACDE,aAAa,CAACwB,uBAAuB,GAAG;IACtCC,OAAO,EAAE;EACX,CAAC;EACDzB,aAAa,CAAC0B,kBAAkB,GAAG;IACjCL,aAAa,EAAE,KAAK;IACpBlB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAAC2B,UAAU,GAAG;IACzBC,SAAS,EAAE;EACb,CAAC;EAED5B,aAAa,CAAC6B,kBAAkB,GAAG;IACjCV,UAAU,EAAE;EACd,CAAC;EAEDnB,aAAa,CAAC8B,wBAAwB,GAAG;IACvCC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE;EACV,CAAC;EAED,OAAOrC,UAAU,CAACsC,MAAM,CAACjC,aAAa,CAAC;AACzC,CAAC"}
+{"version":3,"names":["StyleSheet","Palettes","Radius","Spacing","getStyle","computedStyle","flex","overlay","justifyContent","container","backgroundColor","white","position","bottom","width","borderTopEndRadius","borderTopStartRadius","sliderIndicator","height","borderRadius","full","grey","sheetIndicatorWrapper","alignItems","sheetHeader","flexDirection","sheetHeaderWrapper","paddingHorizontal","paddingBottom","sheetDismissIconWrapper","padding","sheetActionWrapper","textCenter","textAlign","largeIconContainer","largeIconAbsoluteWrapper","create"],"sourceRoot":"../../src","sources":["BottomSheet.style.tsx"],"mappings":"AACA,SAASA,UAAU,QAAQ,cAAc;AAEzC,SAASC,QAAQ,EAAEC,MAAM,EAAEC,OAAO,QAAQ,cAAc;AAmBxD,OAAO,MAAMC,QAAQ,GAAG,MAAM;EAC5B,MAAMC,aAAiC,GAAG,CAAC,CAAC;EAE5CA,aAAa,CAACC,IAAI,GAAG;IACnBA,IAAI,EAAE;EACR,CAAC;EAEDD,aAAa,CAACE,OAAO,GAAG;IACtBD,IAAI,EAAE,CAAC;IACPE,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACI,SAAS,GAAG;IACxBC,eAAe,EAAET,QAAQ,CAACU,KAAK,CAAC,EAAE,CAAC;IACnCC,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE,CAAC;IACTC,KAAK,EAAE,MAAM;IACbC,kBAAkB,EAAEZ,OAAO,CAAC,EAAE,CAAC;IAC/Ba,oBAAoB,EAAEb,OAAO,CAAC,EAAE;EAClC,CAAC;EAEDE,aAAa,CAACY,eAAe,GAAG;IAC9BC,MAAM,EAAE,CAAC;IACTJ,KAAK,EAAE,GAAG;IACVK,YAAY,EAAEjB,MAAM,CAACkB,IAAI;IACzBV,eAAe,EAAET,QAAQ,CAACoB,IAAI,CAAC,GAAG;EACpC,CAAC;EAEDhB,aAAa,CAACiB,qBAAqB,GAAG;IACpCJ,MAAM,EAAE,EAAE;IACVK,UAAU,EAAE,QAAQ;IACpBf,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACmB,WAAW,GAAG;IAC1BC,aAAa,EAAE,KAAK;IACpBF,UAAU,EAAE,QAAQ;IACpBf,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAACqB,kBAAkB,GAAG;IACjCC,iBAAiB,EAAExB,OAAO,CAAC,EAAE,CAAC;IAC9ByB,aAAa,EAAEzB,OAAO,CAAC,CAAC;EAC1B,CAAC;EACDE,aAAa,CAACwB,uBAAuB,GAAG;IACtCC,OAAO,EAAE;EACX,CAAC;EACDzB,aAAa,CAAC0B,kBAAkB,GAAG;IACjCN,aAAa,EAAE,KAAK;IACpBjB,cAAc,EAAE;EAClB,CAAC;EAEDH,aAAa,CAAC2B,UAAU,GAAG;IACzBC,SAAS,EAAE;EACb,CAAC;EAED5B,aAAa,CAAC6B,kBAAkB,GAAG;IACjCX,UAAU,EAAE;EACd,CAAC;EAEDlB,aAAa,CAAC8B,wBAAwB,GAAG;IACvCvB,QAAQ,EAAE,UAAU;IACpBC,MAAM,EAAE;EACV,CAAC;EAED,OAAOb,UAAU,CAACoC,MAAM,CAAC/B,aAAa,CAAC;AACzC,CAAC"}

package/lib/module/components/index.js

@@ -11,7 +11,7 @@ export { StepperCounter } from './StepperCounter/StepperCounter.component';
 export { Divider } from './Divider/Divider.component';
 export { Tabs } from './Tabs/Tabs.component';
 export { RadioButton } from './RadioButton/RadioButton.component';
-export { BottomSheet } from './BottomSheet/BottomSheet.component';
+export { BottomSheet, BottomSheetHandler } from './BottomSheet/BottomSheet.component';
 export { RadioInput } from './RadioInput/RadioInput.component';
 export { CheckBoxInput } from './CheckBoxInput/CheckBoxInput.component';
 export { Checkbox } from './Checkbox/Checkbox.component';

package/lib/module/components/index.js.map

@@ -1 +1 @@
-{"version":3,"names":["Button","Label","BaseComponent","Typography","Coachmark","TextLink","SliderIndicator","TextInput","TextArea","StepperCounter","Divider","Tabs","RadioButton","BottomSheet","RadioInput","CheckBoxInput","Checkbox","Appbar","Snackbar","SnackbarComponent","Switch","Dot","InformationBox","RoundedTab","Countdown"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":"AAAA,SAASA,MAAM,QAAQ,2BAA2B;AAClD,SAASC,KAAK,QAAQ,yBAAyB;AAC/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,eAAe,QAAQ,+CAA+C;AAC/E,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,cAAc,QAAQ,2CAA2C;AAC1E,SAASC,OAAO,QAAQ,6BAA6B;AACrD,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,QAAQ,EAAEC,iBAAiB,QAAQ,+BAA+B;AAC3E,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,GAAG,QAAQ,qBAAqB;AACzC,SAASC,cAAc,QAAQ,6CAA6C;AAC5E,SAASC,UAAU,QAAQ,qCAAqC;AAChE,SAASC,SAAS,QAAQ,iCAAiC"}
+{"version":3,"names":["Button","Label","BaseComponent","Typography","Coachmark","TextLink","SliderIndicator","TextInput","TextArea","StepperCounter","Divider","Tabs","RadioButton","BottomSheet","BottomSheetHandler","RadioInput","CheckBoxInput","Checkbox","Appbar","Snackbar","SnackbarComponent","Switch","Dot","InformationBox","RoundedTab","Countdown"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":"AAAA,SAASA,MAAM,QAAQ,2BAA2B;AAClD,SAASC,KAAK,QAAQ,yBAAyB;AAC/C,SAASC,aAAa,QAAQ,uBAAuB;AACrD,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,eAAe,QAAQ,+CAA+C;AAC/E,SAASC,SAAS,QAAQ,iCAAiC;AAC3D,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,cAAc,QAAQ,2CAA2C;AAC1E,SAASC,OAAO,QAAQ,6BAA6B;AACrD,SAASC,IAAI,QAAQ,uBAAuB;AAC5C,SAASC,WAAW,QAAQ,qCAAqC;AACjE,SACEC,WAAW,EACXC,kBAAkB,QACb,qCAAqC;AAC5C,SAASC,UAAU,QAAQ,mCAAmC;AAC9D,SAASC,aAAa,QAAQ,yCAAyC;AACvE,SAASC,QAAQ,QAAQ,+BAA+B;AACxD,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,QAAQ,EAAEC,iBAAiB,QAAQ,+BAA+B;AAC3E,SAASC,MAAM,QAAQ,2BAA2B;AAClD,SAASC,GAAG,QAAQ,qBAAqB;AACzC,SAASC,cAAc,QAAQ,6CAA6C;AAC5E,SAASC,UAAU,QAAQ,qCAAqC;AAChE,SAASC,SAAS,QAAQ,iCAAiC"}

package/lib/typescript/components/BottomSheet/BottomSheet.component.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.component.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAG3D,aAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAEtE,QAAA,MAAM,WAAW,+FA0MhB,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,CAAC"}
+{"version":3,"file":"BottomSheet.component.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.component.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAO/B,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAC;AAG3D,aAAK,oBAAoB,GAAG;IAC1B,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC;AAEF,oBAAY,kBAAkB,GAAG,KAAK,CAAC,UAAU,CAAC,OAAO,WAAW,CAAC,CAAC;AAItE,QAAA,MAAM,WAAW,+FA4MhB,CAAC;AAEF,OAAO,EAAE,WAAW,EAAE,CAAC"}

package/lib/typescript/components/BottomSheet/BottomSheet.style.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.style.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.style.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzD,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,qBAAqB,CAAC,EAAE,SAAS,CAAC;IAClC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,uBAAuB,CAAC,EAAE,SAAS,CAAC;IACpC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,wBAAwB,CAAC,EAAE,SAAS,CAAC;CACtC;AAED,eAAO,MAAM,QAAQ,0BAiEpB,CAAC"}
+{"version":3,"file":"BottomSheet.style.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.style.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAKzD,UAAU,kBAAkB;IAC1B,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB,SAAS,CAAC,EAAE,SAAS,CAAC;IACtB,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,eAAe,CAAC,EAAE,SAAS,CAAC;IAC5B,qBAAqB,CAAC,EAAE,SAAS,CAAC;IAClC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB,IAAI,CAAC,EAAE,SAAS,CAAC;IACjB,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,uBAAuB,CAAC,EAAE,SAAS,CAAC;IACpC,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,kBAAkB,CAAC,EAAE,SAAS,CAAC;IAC/B,wBAAwB,CAAC,EAAE,SAAS,CAAC;CACtC;AAED,eAAO,MAAM,QAAQ,0BAkEpB,CAAC"}

package/lib/typescript/components/BottomSheet/BottomSheet.type.d.ts

@@ -1,6 +1,7 @@
 import { ReactNode } from 'react';
 import type { TextProps, TouchableHighlightProps } from 'react-native';
-export interface BottomSheetProps {
+import type { ModalProps } from 'react-native-modal';
+export interface BottomSheetProps extends Omit<ModalProps, 'isVisible'> {
     onDismiss?: () => void;
     sheetHeader?: ReactNode;
     title: string;
@@ -13,8 +14,10 @@ export interface BottomSheetProps {
     action?: ReactNode;
     largeIcon?: ReactNode;
     largeIconContainerHeight?: number;
-    animationType?: 'slide' | 'none' | 'fade';
-    children?: ReactNode;
+    /**
+     * Decimal number between 0 - 1
+     */
+    maxSheetHeight?: number;
 }
 export declare type BottomSheetRefHandle = {
     open: () => void;

package/lib/typescript/components/BottomSheet/BottomSheet.type.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"BottomSheet.type.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,KAAK,EAAE,SAAS,EAAE,uBAAuB,EAAE,MAAM,cAAc,CAAC;AAEvE,MAAM,WAAW,gBAAgB;IAC/B,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,KAAK,EAAE,MAAM,CAAC;IAEd,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,aAAa,CAAC,EAAE,SAAS,CAAC;IAE1B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IAEnC,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,gBAAgB,CAAC,EAAE,uBAAuB,CAAC;IAE3C,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC,aAAa,CAAC,EAAE,OAAO,GAAG,MAAM,GAAG,MAAM,CAAC;IAE1C,QAAQ,CAAC,EAAE,SAAS,CAAC;CACtB;AAED,oBAAY,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC"}
+{"version":3,"file":"BottomSheet.type.d.ts","sourceRoot":"","sources":["../../../../src/components/BottomSheet/BottomSheet.type.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAElC,OAAO,KAAK,EAAE,SAAS,EAAE,uBAAuB,EAAE,MAAM,cAAc,CAAC;AACvE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAC;AAErD,MAAM,WAAW,gBAAiB,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,CAAC;IACrE,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IAEvB,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,KAAK,EAAE,MAAM,CAAC;IAEd,UAAU,CAAC,EAAE,SAAS,CAAC;IAEvB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAElB,aAAa,CAAC,EAAE,SAAS,CAAC;IAE1B,wBAAwB,CAAC,EAAE,OAAO,CAAC;IAEnC,WAAW,CAAC,EAAE,SAAS,CAAC;IAExB,gBAAgB,CAAC,EAAE,uBAAuB,CAAC;IAE3C,MAAM,CAAC,EAAE,SAAS,CAAC;IAEnB,SAAS,CAAC,EAAE,SAAS,CAAC;IAEtB,wBAAwB,CAAC,EAAE,MAAM,CAAC;IAElC;;OAEG;IACH,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,oBAAY,oBAAoB,GAAG;IACjC,IAAI,EAAE,MAAM,IAAI,CAAC;IACjB,KAAK,EAAE,MAAM,IAAI,CAAC;CACnB,CAAC"}

package/lib/typescript/components/index.d.ts

@@ -11,7 +11,7 @@ export { StepperCounter } from './StepperCounter/StepperCounter.component';
 export { Divider } from './Divider/Divider.component';
 export { Tabs } from './Tabs/Tabs.component';
 export { RadioButton } from './RadioButton/RadioButton.component';
-export { BottomSheet } from './BottomSheet/BottomSheet.component';
+export { BottomSheet, BottomSheetHandler, } from './BottomSheet/BottomSheet.component';
 export { RadioInput } from './RadioInput/RadioInput.component';
 export { CheckBoxInput } from './CheckBoxInput/CheckBoxInput.component';
 export { Checkbox } from './Checkbox/Checkbox.component';

package/lib/typescript/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AACrF,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAChF,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,MAAM,yBAAyB,CAAC;AAChD,OAAO,EAAE,aAAa,EAAE,MAAM,uBAAuB,CAAC;AACtD,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,eAAe,EAAE,MAAM,+CAA+C,CAAC;AAChF,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,cAAc,EAAE,MAAM,2CAA2C,CAAC;AAC3E,OAAO,EAAE,OAAO,EAAE,MAAM,6BAA6B,CAAC;AACtD,OAAO,EAAE,IAAI,EAAE,MAAM,uBAAuB,CAAC;AAC7C,OAAO,EAAE,WAAW,EAAE,MAAM,qCAAqC,CAAC;AAClE,OAAO,EACL,WAAW,EACX,kBAAkB,GACnB,MAAM,qCAAqC,CAAC;AAC7C,OAAO,EAAE,UAAU,EAAE,MAAM,mCAAmC,CAAC;AAC/D,OAAO,EAAE,aAAa,EAAE,MAAM,yCAAyC,CAAC;AACxE,OAAO,EAAE,QAAQ,EAAE,MAAM,+BAA+B,CAAC;AACzD,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,QAAQ,EAAE,iBAAiB,EAAE,MAAM,+BAA+B,CAAC;AAC5E,OAAO,EAAE,MAAM,EAAE,MAAM,2BAA2B,CAAC;AACnD,OAAO,EAAE,GAAG,EAAE,MAAM,qBAAqB,CAAC;AAC1C,OAAO,EAAE,cAAc,EAAE,MAAM,6CAA6C,CAAC;AAC7E,OAAO,EAAE,UAAU,EAAE,MAAM,qCAAqC,CAAC;AACjE,OAAO,EAAE,SAAS,EAAE,MAAM,iCAAiC,CAAC;AAE5D,YAAY,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,oBAAoB,EAAE,MAAM,0CAA0C,CAAC;AACrF,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,eAAe,EAAE,MAAM,8BAA8B,CAAC;AACpE,YAAY,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAC;AACjE,YAAY,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAC9D,YAAY,EAAE,mBAAmB,EAAE,MAAM,sCAAsC,CAAC;AAChF,YAAY,EAAE,YAAY,EAAE,MAAM,wBAAwB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,kBAAkB,CAAC"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@adiraku/react-native-ui",
-  "version": "0.2.4",
-  "description": "test",
+  "version": "1.0.1",
+  "description": "UI library for Adiraku apps",
   "main": "lib/commonjs/index",
   "module": "lib/module/index",
   "types": "lib/typescript/index.d.ts",
@@ -80,7 +80,7 @@
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "react-native-svg": "*"
+    "react-native-svg": "9.9.3"
   },
   "packageManager": "^yarn@1.22.15",
   "jest": {
@@ -126,6 +126,7 @@
     ]
   },
   "dependencies": {
+    "react-native-modal": "^11.5.6",
     "react-native-toast-message": "^2.1.6"
   }
 }

package/src/components/BottomSheet/BottomSheet.component.tsx

@@ -1,12 +1,6 @@
 import * as React from 'react';
-import {
-  Animated,
-  Dimensions,
-  PanResponder,
-  Modal,
-  TouchableWithoutFeedback,
-  View,
-} from 'react-native';
+import { Animated, Dimensions, PanResponder, View } from 'react-native';
+import Modal from 'react-native-modal';
 
 import { getStyle } from './BottomSheet.style';
 import { Typography } from '../typography/typography.component';
@@ -21,6 +15,8 @@ type BottomSheetRefHandle = {
 
 export type BottomSheetHandler = React.ElementRef<typeof BottomSheet>;
 
+const deviceWindow = Dimensions.get('window');
+
 const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
   (props, ref) => {
     const {
@@ -29,26 +25,30 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
       titleProps = {},
       subtitle,
       subtitleProps = {},
-      isOverlayDismissDisabled = false,
       dismissIcon = null,
       dismissIconProps = {},
       action = null,
       largeIcon = null,
       largeIconContainerHeight = 50,
-      animationType = 'slide',
+      maxSheetHeight = 0.85,
+      backdropTransitionOutTiming = 0,
+      onBackdropPress = () => {},
+      onBackButtonPress = () => {},
       children,
+      ...rest
     } = props;
-    const screenHeight = Dimensions.get('screen').height;
-    const screenWidth = Dimensions.get('screen').width;
-    const panY = React.useRef(new Animated.Value(screenHeight)).current;
+
+    const computedStyle = getStyle();
 
     const [visibility, setVisibility] = React.useState(false);
+    const panY = React.useRef(new Animated.Value(deviceWindow.height)).current;
 
     React.useImperativeHandle(
       ref,
       () => {
         return {
           open() {
+            console.log('clicked');
             setVisibility(true);
           },
           close() {
@@ -59,7 +59,10 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
       []
     );
 
-    const computedStyle = getStyle();
+    const handleDismiss = () => {
+      setVisibility(false);
+      closeAnim.start(onDismiss);
+    };
 
     const resetPositionAnim = Animated.timing(panY, {
       toValue: 0,
@@ -68,7 +71,7 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
     });
 
     const closeAnim = Animated.timing(panY, {
-      toValue: screenHeight,
+      toValue: deviceWindow.height,
       duration: 300,
       useNativeDriver: true,
     });
@@ -78,11 +81,6 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
       outputRange: [0, 0, 1],
     });
 
-    const handleDismiss = () => {
-      setVisibility(false);
-      closeAnim.start(onDismiss);
-    };
-
     React.useEffect(() => {
       resetPositionAnim.start();
     }, [resetPositionAnim]);
@@ -110,8 +108,8 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
             <View
               style={[
                 {
-                  maxWidth: ((screenWidth - 32) / 8) * 2,
-                  minWidth: ((screenWidth - 32) / 8) * 2,
+                  maxWidth: ((deviceWindow.width - 32) / 8) * 2,
+                  minWidth: ((deviceWindow.width - 32) / 8) * 2,
                 },
               ]}
             >
@@ -129,8 +127,8 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
             <View
               style={[
                 {
-                  maxWidth: ((screenWidth - 32) / 8) * 4,
-                  minWidth: ((screenWidth - 32) / 8) * 4,
+                  maxWidth: ((deviceWindow.width - 32) / 8) * 4,
+                  minWidth: ((deviceWindow.width - 32) / 8) * 4,
                 },
               ]}
             >
@@ -148,8 +146,8 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
             <View
               style={[
                 {
-                  maxWidth: ((screenWidth - 32) / 8) * 2,
-                  minWidth: ((screenWidth - 32) / 8) * 2,
+                  maxWidth: ((deviceWindow.width - 32) / 8) * 2,
+                  minWidth: ((deviceWindow.width - 32) / 8) * 2,
                 },
                 computedStyle.sheetActionWrapper,
               ]}
@@ -188,38 +186,38 @@ const BottomSheet = React.forwardRef<BottomSheetRefHandle, BottomSheetProps>(
 
     return (
       <Modal
-        animated
-        animationType={animationType}
-        visible={visibility}
-        transparent
-        onRequestClose={handleDismiss}
+        isVisible={visibility}
+        backdropTransitionOutTiming={backdropTransitionOutTiming}
+        onBackdropPress={() => {
+          onBackdropPress();
+          handleDismiss();
+        }}
+        onBackButtonPress={() => {
+          onBackButtonPress();
+          handleDismiss();
+        }}
+        onSwipeComplete={() => handleDismiss()}
+        style={{ flex: 1, margin: 0 }}
+        {...rest}
       >
-        <View style={[computedStyle.flex, computedStyle.overlayColor]}>
-          <TouchableWithoutFeedback
-            onPress={handleDismiss}
-            disabled={isOverlayDismissDisabled}
-          >
-            <View style={[computedStyle.overlay]} />
-          </TouchableWithoutFeedback>
-          <Animated.View
-            style={{
-              ...computedStyle.container,
+        <Animated.View
+          style={[
+            computedStyle.container,
+            {
+              maxHeight: deviceWindow.height * maxSheetHeight,
               transform: [{ translateY: translateY }],
-            }}
+            },
+          ]}
+        >
+          <View
+            style={[computedStyle.sheetIndicatorWrapper]}
+            {...panResponders.panHandlers}
           >
-            <View>
-              <View
-                style={[computedStyle.sheetIndicatorWrapper]}
-                {...panResponders.panHandlers}
-              >
-                {!largeIcon && <View style={computedStyle.sliderIndicator} />}
-              </View>
-              {largeIcon ? renderLargeIconComponent() : renderSheetHeader()}
-            </View>
-
-            {children}
-          </Animated.View>
-        </View>
+            {!largeIcon && <View style={computedStyle.sliderIndicator} />}
+          </View>
+          {largeIcon ? renderLargeIconComponent() : renderSheetHeader()}
+          {children}
+        </Animated.View>
       </Modal>
     );
   }

package/src/components/BottomSheet/BottomSheet.style.tsx

@@ -1,7 +1,7 @@
 import type { ViewStyle, TextStyle } from 'react-native';
-import { Dimensions, StyleSheet } from 'react-native';
+import { StyleSheet } from 'react-native';
 
-import { Palettes, Radius, Spacing } from '../../../src/themes';
+import { Palettes, Radius, Spacing } from '../../themes';
 
 interface ComputedStyleProps {
   overlay?: ViewStyle;
@@ -31,16 +31,16 @@ export const getStyle = () => {
     flex: 1,
     justifyContent: 'flex-end',
   };
-  computedStyle.overlayColor = {
-    backgroundColor: 'rgba(0,0,0,0.2)',
-  };
 
   computedStyle.container = {
-    maxHeight: (Dimensions.get('window').height / 8) * 7,
-    borderTopRightRadius: Radius[16],
-    borderTopLeftRadius: Radius[16],
-    backgroundColor: Palettes.whiteDark[50],
+    backgroundColor: Palettes.white[50],
+    position: 'absolute',
+    bottom: 0,
+    width: '100%',
+    borderTopEndRadius: Spacing[16],
+    borderTopStartRadius: Spacing[16],
   };
+
   computedStyle.sliderIndicator = {
     height: 5,
     width: 100,
@@ -62,6 +62,7 @@ export const getStyle = () => {
 
   computedStyle.sheetHeaderWrapper = {
     paddingHorizontal: Spacing[16],
+    paddingBottom: Spacing[8],
   };
   computedStyle.sheetDismissIconWrapper = {
     padding: 4,

package/src/components/BottomSheet/BottomSheet.type.ts

@@ -1,8 +1,9 @@
 import { ReactNode } from 'react';
 
 import type { TextProps, TouchableHighlightProps } from 'react-native';
+import type { ModalProps } from 'react-native-modal';
 
-export interface BottomSheetProps {
+export interface BottomSheetProps extends Omit<ModalProps, 'isVisible'> {
   onDismiss?: () => void;
 
   sheetHeader?: ReactNode;
@@ -27,9 +28,10 @@ export interface BottomSheetProps {
 
   largeIconContainerHeight?: number;
 
-  animationType?: 'slide' | 'none' | 'fade';
-
-  children?: ReactNode;
+  /**
+   * Decimal number between 0 - 1
+   */
+  maxSheetHeight?: number;
 }
 
 export type BottomSheetRefHandle = {

package/src/components/index.ts

@@ -11,7 +11,10 @@ export { StepperCounter } from './StepperCounter/StepperCounter.component';
 export { Divider } from './Divider/Divider.component';
 export { Tabs } from './Tabs/Tabs.component';
 export { RadioButton } from './RadioButton/RadioButton.component';
-export { BottomSheet } from './BottomSheet/BottomSheet.component';
+export {
+  BottomSheet,
+  BottomSheetHandler,
+} from './BottomSheet/BottomSheet.component';
 export { RadioInput } from './RadioInput/RadioInput.component';
 export { CheckBoxInput } from './CheckBoxInput/CheckBoxInput.component';
 export { Checkbox } from './Checkbox/Checkbox.component';