@react-native-community/datetimepicker
Advanced tools
Comparing version 6.5.3 to 6.5.4
{ | ||
"name": "@react-native-community/datetimepicker", | ||
"version": "6.5.3", | ||
"version": "6.5.4", | ||
"description": "DateTimePicker component for React Native", | ||
@@ -5,0 +5,0 @@ "main": "./src/index.js", |
@@ -230,3 +230,3 @@ ### 🚧🚧 Looking for collaborators and backers 🚧🚧 | ||
On Android, the picker will be controlled by the system locale. If you wish to change it, [see instructions here](https://stackoverflow.com/a/2900144/2070942). | ||
On Android, the picker will be controlled by the system locale. If you wish to change it, [see instructions here](https://developer.android.com/guide/topics/resources/app-languages). | ||
@@ -262,3 +262,3 @@ On iOS, use XCode, as [documented here](https://developer.apple.com/documentation/xcode/adding-support-for-languages-and-regions) to inform the OS about the locales your application supports. iOS will automatically display the correctly localized DateTimePicker as long as the target language is contained in `project.pbxproj`. | ||
> Please note that this library currently exposes functionality from [`UIDatePicker`](https://developer.apple.com/documentation/uikit/uidatepicker?language=objc) on iOS and [DatePickerDialog](https://developer.android.com/reference/android/app/DatePickerDialog) + [TimePickerDialog](https://developer.android.com/reference/android/app/TimePickerDialog) on Android, and [`CalendarDatePicker`](https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/calendar-date-picker) +[TimePicker](https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.timepicker?view=winrt-19041) on Windows. | ||
> Please note that this library currently exposes functionality from [`UIDatePicker`](https://developer.apple.com/documentation/uikit/uidatepicker?language=objc) on iOS and [DatePickerDialog](https://developer.android.com/reference/android/app/DatePickerDialog) + [TimePickerDialog](https://developer.android.com/reference/android/app/TimePickerDialog) on Android, and [`CalendarDatePicker`](https://docs.microsoft.com/en-us/windows/uwp/design/controls-and-patterns/calendar-date-picker) + [TimePicker](https://docs.microsoft.com/en-us/uwp/api/windows.ui.xaml.controls.timepicker?view=winrt-19041) on Windows. | ||
> | ||
@@ -288,3 +288,3 @@ > These native classes offer only limited configuration, while there are dozens of possible options you as a developer may need. It follows that if your requirement is not supported by the backing native views, this library will _not_ be able to implement your requirement. When you open an issue with a feature request, please document if (or how) the feature can be implemented using the aforementioned native views. If the native views do not support what you need, such feature requests will be closed as not actionable. | ||
- `"default"` - Show a default date picker (spinner/calendar/clock) based on `mode` and Android version. | ||
- `"default"` - Recommended. Show a default date picker (spinner/calendar/clock) based on `mode`. | ||
- `"spinner"` | ||
@@ -314,3 +314,8 @@ - `"calendar"` (only for `date` mode) | ||
```js | ||
setDate = (event, date) => {}; | ||
const setDate = (event: DateTimePickerEvent, date: Date) => { | ||
const { | ||
type, | ||
nativeEvent: {timestamp}, | ||
} = event; | ||
}; | ||
@@ -333,3 +338,3 @@ <RNDateTimePicker onChange={this.setDate} />; | ||
```js | ||
<RNDateTimePicker maximumDate={new Date(2300, 10, 20)} /> | ||
<RNDateTimePicker maximumDate={new Date(2030, 10, 20)} /> | ||
``` | ||
@@ -477,3 +482,3 @@ | ||
Sets style directly on picker component. By default, the picker height is determined based on the `display` prop. | ||
Sets style directly on picker component. By default, the picker dimensions are determined based on the props. | ||
@@ -484,3 +489,3 @@ Please note that by default, picker's text color is controlled by the application theme (light / dark mode). In dark mode, text is white and in light mode, text is black. | ||
This means that e.g. if the device has dark mode turned on, and your screen background color is white, you will not see the picker. Please use the `Appearance` api to adjust the picker's background color so that it is visible, as we do in the [example App](/example/App.js). | ||
Alternatively, use the `themeVariant` prop or [opt-out from dark mode (discouraged)](https://stackoverflow.com/a/56546554/2070942). | ||
Alternatively, use the `themeVariant` prop. | ||
@@ -501,8 +506,2 @@ ```js | ||
If you're rendering the picker component (using the `@testing-library/react-native` or similar), you need to mock the native module: | ||
``` | ||
"setupFiles": ["./node_modules/@react-native-community/datetimepicker/jest/setup.js"] | ||
``` | ||
For examples of how you can write your tests, look [here](/test/userlandTestExamples.test.js). | ||
@@ -509,0 +508,0 @@ |
@@ -60,3 +60,2 @@ /** | ||
export const NEUTRAL_BUTTON_LABEL = 'neutralButtonLabel'; | ||
export const NEUTRAL_BUTTON_ACTION = 'neutralButtonAction'; |
@@ -16,5 +16,5 @@ /** | ||
IOS_DISPLAY, | ||
ANDROID_MODE, | ||
EVENT_TYPE_SET, | ||
EVENT_TYPE_DISMISSED, | ||
IOS_MODE, | ||
} from './constants'; | ||
@@ -60,3 +60,3 @@ import * as React from 'react'; | ||
onChange, | ||
mode = ANDROID_MODE.date, | ||
mode = IOS_MODE.date, | ||
display: providedDisplay = IOS_DISPLAY.default, | ||
@@ -63,0 +63,0 @@ disabled = false, |
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
Sorry, the diff of this file is not supported yet
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
License Policy Violation
LicenseThis package is not allowed per your license policy. Review the package's license to ensure compliance.
Found 1 instance in 1 package
200456
1202
528