Select Date and Cancel Not Clickable on IOS - View not in SafeArea

[knightmate]

Current behaviour

On the iOS platform, the "Select Date" and "Cancel" icons are appearing in the top bar and are not clickable

Expected behaviour

On the iOS platform, the "Select Date" and "Cancel" icons should be under SafeArea View

How to reproduce?

Run the App on IOS and Open Calendar Modal

Preview

What have you tried so far?

I have fixed this by giving Maring from top,
modalRoot: {
justifyContent: 'center',
alignItems: 'center',
flex: 1,
marginTop:Platform.OS==="ios"?40:0
},

Your Environment

software	version
ios	12
android	x
react-native	x.x.x
react-native-paper	x.x.x
node	x.x.x
npm or yarn	x.x.x
expo sdk	x.x.x

[github-actions]

Hey! Thanks for opening the issue. Can you provide more information about the issue? Please fill the issue template when opening the issue without deleting any section. We need all the information we can, to be able to help. Make sure to at least provide - Current behaviour, Expected behaviour, A way to reproduce the issue with minimal code (link to snack.expo.dev) or a repo on GitHub, and the information about your environment (such as the platform of the device, versions of all the packages etc.).

[github-actions]

Hey! Thanks for opening the issue. Can you provide a minimal repro which demonstrates the issue? Posting a snippet of your code in the issue is useful, but it's not usually straightforward to run. A repro will help us debug the issue faster. Please try to keep the repro as small as possible. The easiest way to provide a repro is on snack.expo.dev. If it's not possible to repro it on snack.expo.dev, then you can also provide the repro in a GitHub repository.

[iM-GeeKy]

Here is a working example with SafeAreaProvider https://web-ridge.github.io/react-native-paper-dates/docs/date-picker/single-date-picker

[knightmate]

[knightmate]

@iM-GeeKy Is this working for you?

<SafeAreaProvider> <PaperProvider theme={theme}> <DatePickerModal mode={modeLocal as any} saveLabel={"Save"} theme={{color: "red"}} validRange={{ endDate: new Date( new Date().getFullYear(), new Date().getMonth(), new Date().getDate() ) // optional }} maxDate={new Date()} visible={isModalVisible} onDismiss={toggleModal} label="Select Date" onConfirm={ modeLocal === "single" ? handleConfirmDateSingle : handleConfirmDateRange } {...(rest as any)} /** any is used becase Library typescript has some issue */ /> </PaperProvider> </SafeAreaProvider>

[github-actions]

Hello 👋, this issue has been open for more than a month without a repro or any activity. If the issue is still present in the latest version, please provide a repro or leave a comment within 7 days to keep it open, otherwise it will be closed automatically. If you found a solution or workaround for the issue, please comment here for others to find. If this issue is critical for you, please consider sending a pull request to fix it.