Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

feat: create container style prop #8

Merged
merged 3 commits into from
May 26, 2020
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -164,6 +164,7 @@ This is the list of exclusive props that are meant to be used to customise the b
| `animationConfig` | no | `{ duration: number, easing: Animated.EasingFunction }` | Timing configuration for the animation, by default it uses a duration of 250ms and easing fn `Easing.inOut(Easing.linear)` |
| `topInset` | no | `number` | This value is useful to provide an offset (in dp) when applying percentages for snapping points |
| `innerRef` | no | `RefObject` | Ref to the inner scrollable component (ScrollView, FlatList or SectionList), so that you can call its imperative methods. For instance, calling `scrollTo` on a ScrollView. In order to so, you have to use `getNode` as well, since it's wrapped into an _animated_ component: `ref.current.getNode().scrollTo({y: 0, animated: true})` |
| `containerStyle` | no | `StyleProp<ViewStyle>` | Style to be applied to the container (Handle and Content) |


### Inherited
Expand Down
8 changes: 8 additions & 0 deletions src/index.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,8 @@ import {
SectionListProps,
StyleSheet,
View,
StyleProp,
ViewStyle,
} from 'react-native';
import Animated, {
abs,
Expand Down Expand Up @@ -156,6 +158,10 @@ type CommonProps = {
* Reference to FlatList, ScrollView or SectionList in order to execute its imperative methods.
*/
innerRef: RefObject<FlatList | ScrollView | SectionList>;
/*
* Style to be applied to the container.
*/
containerStyle?: StyleProp<ViewStyle>;
};

type Props<T> = CommonProps &
Expand Down Expand Up @@ -595,6 +601,7 @@ export class ScrollBottomSheet<T extends any> extends Component<Props<T>> {
componentType,
onSettle,
animatedPosition,
containerStyle,
...rest
} = this.props;
const AnimatedScrollableComponent = this.scrollComponent;
Expand All @@ -606,6 +613,7 @@ export class ScrollBottomSheet<T extends any> extends Component<Props<T>> {
style={[
StyleSheet.absoluteFillObject,
// @ts-ignore
containerStyle,
rgommezz marked this conversation as resolved.
Show resolved Hide resolved
{
transform: [{ translateY: this.translateY }],
},
Expand Down