From 9a2a8e14d4bfbe5e0098f2c328b19ea26b439e8d Mon Sep 17 00:00:00 2001 From: Douglas Nassif Roma Junior Date: Mon, 17 Apr 2023 10:56:06 -0300 Subject: [PATCH] Add statusBarTranslucent prop --- README.md | 19 ++++++++++--------- src/Dialog.tsx | 5 ++++- 2 files changed, 14 insertions(+), 10 deletions(-) diff --git a/README.md b/README.md index 0f999b3..41c59b7 100644 --- a/README.md +++ b/README.md @@ -1,8 +1,8 @@ # React Native Simple Dialogs -[![Licence MIT](https://img.shields.io/badge/licence-MIT-blue.svg)](https://github.com/douglasjunior/react-native-simple-dialogs/blob/master/LICENSE) -[![npm version](https://img.shields.io/npm/v/react-native-simple-dialogs.svg)](https://www.npmjs.com/package/react-native-simple-dialogs) -[![npm downloads](https://img.shields.io/npm/dt/react-native-simple-dialogs.svg)](#install) +[![License MIT](https://img.shields.io/badge/licence-MIT-blue.svg)](https://github.com/douglasjunior/react-native-simple-dialogs/blob/master/LICENSE) +[![npm version](https://img.shields.io/npm/v/react-native-simple-dialogs.svg)](https://www.npmjs.com/package/react-native-simple-dialogs?activeTab=versions) +[![npm downloads](https://img.shields.io/npm/dt/react-native-simple-dialogs.svg)](https://www.npmjs.com/package/react-native-simple-dialogs) ⚛ Cross-platform React Native dialogs based on the Modal component. @@ -71,6 +71,7 @@ import { Dialog } from 'react-native-simple-dialogs'; | onShow | Function | null | Callback that's called once the modal has been shown | | onOrientationChange | Function | null | Callback that's called when the orientation change while the modal is being displayed on iOS | | supportedOrientations | Array of Enum('portrait', 'portrait-upside-down', 'landscape', 'landscape-left', 'landscape-right') | 'portrait' | Allowed orientation while modals is being shown. More info at [react-native docs](https://facebook.github.io/react-native/docs/modal#supportedorientations) | +| statusBarTranslucent | Boolean | null | Determines whether your modal should go under the system statusbar. More info at [react-native docs](https://facebook.github.io/react-native/docs/modal#statusbartranslucent-android) | | onTouchOutside | Function | null | Callbac that's called when users tap outside the shown modal | | title | String | null | Modal's title | | titleStyle | [Text StyleSheet](https://facebook.github.io/react-native/docs/text-style-props) | null | Custom text style object for modal's title | @@ -78,7 +79,7 @@ import { Dialog } from 'react-native-simple-dialogs'; | contentStyle | [View StyleSheet](https://facebook.github.io/react-native/docs/view-style-props) | null | Custom view style for dialog content wrapper | | buttonsStyle | [View StyleSheet](https://facebook.github.io/react-native/docs/view-style-props) | null | Custom view style for dialog button wrapper | | overlayStyle | [View StyleSheet](https://facebook.github.io/react-native/docs/view-style-props) | null | Custom view style for dialog overlay | -| buttons | React Component | null | Modal button component | +| buttons | React Node | null | Modal button component | | keyboardDismissMode | Enum('none', 'on-drag', 'interactive') | null | [Determines whether the keyboard gets dismissed in response to a drag.](https://facebook.github.io/react-native/docs/scrollview#keyboarddismissmode) | | keyboardShouldPersistTaps | Enum('always', 'never', 'handled', false, true) | null | [Determines when the keyboard should stay visible after a tap.](https://facebook.github.io/react-native/docs/scrollview#keyboardshouldpersisttaps) | @@ -155,10 +156,10 @@ import { ProgressDialog } from 'react-native-simple-dialogs'; | Name | Type | Default | Description | | ---------------------- | -------------------------------------------------------------------------------- | ------------ | ------------------------------------------------------- | | ...{Dialog.props} | Dialog Props | null | Same props as Dialog Component | -| message | String | **REQUIRED** | Message shown in the progress dialog | +| message | String | null | Message shown in the progress dialog | | messageStyle | [Text StyleSheet](https://facebook.github.io/react-native/docs/text-style-props) | null | Custom text style for message | -| activityIndicatorColor | color | 'gray' | The foreground color of the spinner | -| activityIndicatorSize | enum('small', 'large'), number | 'small' | Size of the indicator. Number only supported on Android | +| activityIndicatorColor | color | null | The foreground color of the spinner | +| activityIndicatorSize | enum('small', 'large'), number | null | Size of the indicator. Number only supported on Android | | activityIndicatorStyle | [View StyleSheet](https://facebook.github.io/react-native/docs/view-style-props) | null | Custom style for the activity indicator | More info on the [sample project](https://github.com/douglasjunior/react-native-simple-dialogs/blob/master/Sample/src/App.js). @@ -174,7 +175,7 @@ New features, bug fixes and improvements are welcome! For questions and suggesti [![Star History Chart](https://api.star-history.com/svg?repos=douglasjunior/react-native-simple-dialogs&type=Date)](https://star-history.com/#douglasjunior/react-native-simple-dialogs) -## Licence +## License ``` The MIT License (MIT) @@ -182,4 +183,4 @@ The MIT License (MIT) Copyright (c) 2017 Douglas Nassif Roma Junior ``` -See the full [licence file](https://github.com/douglasjunior/react-native-simple-dialogs/blob/master/LICENSE). +See the full [license file](https://github.com/douglasjunior/react-native-simple-dialogs/blob/master/LICENSE). diff --git a/src/Dialog.tsx b/src/Dialog.tsx index b0ae83d..4bc286b 100644 --- a/src/Dialog.tsx +++ b/src/Dialog.tsx @@ -56,6 +56,7 @@ export type DialogPropsType = { onTouchOutside?: () => void; overlayStyle?: StyleProp; supportedOrientations?: ModalProps['supportedOrientations']; + statusBarTranslucent?: ModalProps['statusBarTranslucent']; keyboardDismissMode?: ScrollViewProps['keyboardDismissMode']; keyboardShouldPersistTaps?: ScrollViewProps['keyboardShouldPersistTaps']; contentInsetAdjustmentBehavior: ScrollViewProps['contentInsetAdjustmentBehavior']; @@ -77,6 +78,7 @@ const Dialog = ({ onTouchOutside, overlayStyle, supportedOrientations, + statusBarTranslucent, keyboardDismissMode, keyboardShouldPersistTaps, contentInsetAdjustmentBehavior, @@ -164,7 +166,8 @@ const Dialog = ({ onRequestClose={onRequestClose} onShow={onShow} onOrientationChange={onOrientationChange} - supportedOrientations={supportedOrientations}> + supportedOrientations={supportedOrientations} + statusBarTranslucent={statusBarTranslucent}>