diff --git a/README.md b/README.md index 56bf4a5..d2f071e 100644 --- a/README.md +++ b/README.md @@ -160,7 +160,7 @@ Grabber props to be used for android grabber or handle. | color | `ColorValue` | `"rgba(73,69,79,0.4)"` | Grabber color according to M3 specs. | | height | `number` | `4` | Grabber height according to M3 specs. | | width | `number` | `32` | Grabber width according to M3 specs. | -| topOffset | `number` | `6` | Grabber top position offset. | +| topOffset | `number` | `0` | Grabber top position offset. | ### `BlurTint` diff --git a/src/TrueSheetGrabber.tsx b/src/TrueSheetGrabber.tsx index 9e11bf9..f03f120 100644 --- a/src/TrueSheetGrabber.tsx +++ b/src/TrueSheetGrabber.tsx @@ -1,10 +1,8 @@ import React from 'react' import { View, type ColorValue, type ViewStyle, type StyleProp } from 'react-native' -const GRABBER_WRAPPER_HEIGHT = 24 const GRABBER_DEFAULT_HEIGHT = 4 const GRABBER_DEFAULT_WIDTH = 32 -const GRABBER_DEFAULT_TOP_OFFSET = 6 // M3 spec: #49454F 0.4 alpha const GRABBER_DEFAULT_COLOR = 'rgba(73,69,79,0.4)' @@ -57,27 +55,25 @@ export const TrueSheetGrabber = (props: TrueSheetGrabberProps) => { color = GRABBER_DEFAULT_COLOR, width = GRABBER_DEFAULT_WIDTH, height = GRABBER_DEFAULT_HEIGHT, - topOffset = GRABBER_DEFAULT_TOP_OFFSET, + topOffset = 0, style, } = props if (!visible) return null return ( - - + + ) } const $wrapper: ViewStyle = { position: 'absolute', - top: 0, - left: 0, - right: 0, alignSelf: 'center', - height: GRABBER_WRAPPER_HEIGHT, + paddingHorizontal: 12, alignItems: 'center', + justifyContent: 'center', zIndex: 9999, }