react-native-paper-dates 0.4.5 → 0.6.0

package/lib/commonjs/Date/CalendarEdit.js

@@ -9,28 +9,26 @@ var React = _interopRequireWildcard(require("react"));
 
 var _reactNative = require("react-native");
 
-var _TextInputMask = _interopRequireDefault(require("../TextInputMask"));
-
-var _reactNativePaper = require("react-native-paper");
-
-var _dateUtils = require("./dateUtils");
+var _DatePickerInput = _interopRequireDefault(require("./DatePickerInput"));
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
-
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
-function CalendarEdit({
-  mode,
-  state,
-  label = '',
-  startLabel = 'Start',
-  endLabel = 'End',
-  collapsed,
-  onChange,
-  validRange
-}) {
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
+function CalendarEdit(_ref) {
+  let {
+    mode,
+    state,
+    label = '',
+    startLabel = 'Start',
+    endLabel = 'End',
+    collapsed,
+    onChange,
+    validRange,
+    locale
+  } = _ref;
   const dateInput = React.useRef(null);
   const startInput = React.useRef(null);
   const endInput = React.useRef(null); // when switching views focus, or un-focus text input
@@ -63,7 +61,8 @@ function CalendarEdit({
     style: styles.root
   }, /*#__PURE__*/React.createElement(_reactNative.View, {
     style: styles.inner
-  }, mode === 'single' ? /*#__PURE__*/React.createElement(CalendarInput, {
+  }, mode === 'single' ? /*#__PURE__*/React.createElement(_DatePickerInput.default, {
+    inputMode: "start",
     ref: dateInput,
     label: label,
     value: state.date,
@@ -71,8 +70,12 @@ function CalendarEdit({
       date
     }),
     onSubmitEditing: onSubmitInput,
-    validRange: validRange
-  }) : null, mode === 'range' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(CalendarInput, {
+    validRange: validRange,
+    locale: locale,
+    withModal: false,
+    autoCompleteType: 'off'
+  }) : null, mode === 'range' ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_DatePickerInput.default, {
+    inputMode: "start",
     ref: startInput,
     label: startLabel,
     value: state.startDate,
@@ -81,106 +84,28 @@ function CalendarEdit({
     }),
     returnKeyType: 'next',
     onSubmitEditing: onSubmitStartInput,
-    validRange: validRange
+    validRange: validRange,
+    locale: locale,
+    withModal: false,
+    autoCompleteType: 'off'
   }), /*#__PURE__*/React.createElement(_reactNative.View, {
     style: styles.separator
-  }), /*#__PURE__*/React.createElement(CalendarInput, {
+  }), /*#__PURE__*/React.createElement(_DatePickerInput.default, {
+    inputMode: "end",
     ref: endInput,
     label: endLabel,
     value: state.endDate,
     onChange: endDate => onChange({ ...state,
       endDate
     }),
-    isEndDate: true,
     onSubmitEditing: onSubmitEndInput,
-    validRange: validRange
+    validRange: validRange,
+    locale: locale,
+    withModal: false,
+    autoCompleteType: 'off'
   })) : null));
 }
 
-function CalendarInputPure({
-  label,
-  value,
-  onChange,
-  isEndDate,
-  returnKeyType,
-  onSubmitEditing,
-  locale,
-  validRange
-}, ref) {
-  const theme = (0, _reactNativePaper.useTheme)();
-  const [error, setError] = React.useState(null);
-  const formatter = React.useMemo(() => {
-    return new Intl.DateTimeFormat(locale, {
-      month: '2-digit',
-      day: '2-digit',
-      year: 'numeric'
-    });
-  }, [locale]);
-  const inputFormat = React.useMemo(() => {
-    // TODO: something cleaner and more universal?
-    const inputDate = formatter.format(new Date(2020, 10 - 1, 1));
-    return inputDate.replace('2020', 'YYYY').replace('10', 'MM').replace('01', 'DD');
-  }, [formatter]);
-  const formattedValue = formatter.format(value);
-
-  const onChangeText = date => {
-    const dayIndex = inputFormat.indexOf('DD');
-    const monthIndex = inputFormat.indexOf('MM');
-    const yearIndex = inputFormat.indexOf('YYYY');
-    const day = Number(date.slice(dayIndex, dayIndex + 2));
-    const year = Number(date.slice(yearIndex, yearIndex + 4));
-    const month = Number(date.slice(monthIndex, monthIndex + 2));
-
-    if (Number.isNaN(day) || Number.isNaN(year) || Number.isNaN(month)) {
-      setError(inputFormat);
-      return;
-    }
-
-    const finalDate = isEndDate ? new Date(year, month - 1, day, 23, 59, 59) : new Date(year, month - 1, day);
-    const validStart = validRange === null || validRange === void 0 ? void 0 : validRange.startDate;
-    const validEnd = validRange === null || validRange === void 0 ? void 0 : validRange.endDate;
-
-    if (!(0, _dateUtils.isDateWithinOptionalRange)(finalDate, {
-      startUnix: validStart ? (0, _dateUtils.dateToUnix)(validStart) : undefined,
-      endUnix: validEnd ? (0, _dateUtils.dateToUnix)(validEnd) : undefined
-    })) {
-      let errors = validStart && validEnd ? [`${formatter.format(validStart)} - ${formatter.format(validEnd)}`] : [validStart ? `> ${formatter.format(validStart)}` : '', validEnd ? `< ${formatter.format(validEnd)}` : ''];
-      setError(errors.filter(n => n).join(' '));
-      return;
-    }
-
-    setError(null);
-
-    if (isEndDate) {
-      onChange(finalDate);
-    } else {
-      onChange(finalDate);
-    }
-  };
-
-  return /*#__PURE__*/React.createElement(_reactNative.View, {
-    style: styles.inputContainer
-  }, /*#__PURE__*/React.createElement(_TextInputMask.default, {
-    ref: ref,
-    value: formattedValue,
-    style: styles.input,
-    label: `${label} (${inputFormat})`,
-    keyboardType: 'number-pad',
-    placeholder: inputFormat,
-    mask: inputFormat,
-    onChangeText: onChangeText,
-    returnKeyType: returnKeyType,
-    onSubmitEditing: onSubmitEditing,
-    keyboardAppearance: theme.dark ? 'dark' : 'default',
-    error: !!error
-  }), /*#__PURE__*/React.createElement(_reactNativePaper.HelperText, {
-    type: "error",
-    visible: !!error
-  }, error));
-}
-
-const CalendarInput = /*#__PURE__*/React.forwardRef(CalendarInputPure);
-
 const styles = _reactNative.StyleSheet.create({
   root: {
     padding: 12

package/lib/commonjs/Date/CalendarEdit.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CalendarEdit.tsx"],"names":["CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","dateInput","React","useRef","startInput","endInput","useEffect","Keyboard","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","inner","date","startDate","separator","endDate","CalendarInputPure","value","isEndDate","returnKeyType","onSubmitEditing","locale","ref","theme","error","setError","useState","formatter","useMemo","Intl","DateTimeFormat","month","day","year","inputFormat","inputDate","format","Date","replace","formattedValue","onChangeText","dayIndex","indexOf","monthIndex","yearIndex","Number","slice","isNaN","finalDate","validStart","validEnd","startUnix","undefined","endUnix","errors","join","inputContainer","input","dark","CalendarInput","forwardRef","StyleSheet","create","padding","flexDirection","flex","width","memo"],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n  View,\n  StyleSheet,\n  TextInput as TextInputNative,\n  Keyboard,\n} from 'react-native'\n\nimport { CalendarDate, ModeType, ValidRangeType } from './Calendar'\nimport { LocalState } from './DatePickerModalContent'\nimport TextInputWithMask from '../TextInputMask'\nimport { HelperText, useTheme } from 'react-native-paper'\nimport { dateToUnix, isDateWithinOptionalRange } from './dateUtils'\n\nfunction CalendarEdit({\n  mode,\n  state,\n  label = '',\n  startLabel = 'Start',\n  endLabel = 'End',\n  collapsed,\n  onChange,\n  validRange,\n}: {\n  mode: ModeType\n  label?: string\n  startLabel?: string\n  endLabel?: string\n  state: LocalState\n  collapsed: boolean\n  onChange: (s: LocalState) => any\n  validRange: ValidRangeType | undefined\n}) {\n  const dateInput = React.useRef<TextInputNative | null>(null)\n  const startInput = React.useRef<TextInputNative | null>(null)\n  const endInput = React.useRef<TextInputNative | null>(null)\n\n  // when switching views focus, or un-focus text input\n  React.useEffect(() => {\n    // hide open keyboard\n    if (collapsed) {\n      Keyboard.dismiss()\n    }\n\n    const inputsToFocus = [dateInput.current, startInput.current].filter(\n      (n) => n\n    ) as TextInputNative[]\n\n    const inputsToBlur = [\n      dateInput.current,\n      startInput.current,\n      endInput.current,\n    ].filter((n) => n) as TextInputNative[]\n\n    if (collapsed) {\n      inputsToBlur.forEach((ip) => ip.blur())\n    } else {\n      inputsToFocus.forEach((ip) => ip.focus())\n    }\n  }, [mode, startInput, endInput, dateInput, collapsed])\n\n  const onSubmitStartInput = React.useCallback(() => {\n    if (endInput.current) {\n      endInput.current.focus()\n    }\n  }, [endInput])\n\n  const onSubmitEndInput = React.useCallback(() => {\n    // TODO: close modal and persist range\n  }, [])\n\n  const onSubmitInput = React.useCallback(() => {\n    // TODO: close modal and persist range\n  }, [])\n\n  return (\n    <View style={styles.root}>\n      <View style={styles.inner}>\n        {mode === 'single' ? (\n          <CalendarInput\n            ref={dateInput}\n            label={label}\n            value={state.date}\n            onChange={(date) => onChange({ ...state, date })}\n            onSubmitEditing={onSubmitInput}\n            validRange={validRange}\n          />\n        ) : null}\n        {mode === 'range' ? (\n          <>\n            <CalendarInput\n              ref={startInput}\n              label={startLabel}\n              value={state.startDate}\n              onChange={(startDate) => onChange({ ...state, startDate })}\n              returnKeyType={'next'}\n              onSubmitEditing={onSubmitStartInput}\n              validRange={validRange}\n            />\n            <View style={styles.separator} />\n            <CalendarInput\n              ref={endInput}\n              label={endLabel}\n              value={state.endDate}\n              onChange={(endDate) => onChange({ ...state, endDate })}\n              isEndDate\n              onSubmitEditing={onSubmitEndInput}\n              validRange={validRange}\n            />\n          </>\n        ) : null}\n      </View>\n    </View>\n  )\n}\n\nfunction CalendarInputPure(\n  {\n    label,\n    value,\n    onChange,\n    isEndDate,\n    returnKeyType,\n    onSubmitEditing,\n    locale,\n    validRange,\n  }: {\n    locale?: undefined | string\n    label: string\n    value: CalendarDate\n    onChange: (d: Date | undefined) => any\n    isEndDate?: boolean\n    returnKeyType?: string\n    onSubmitEditing?: () => any\n    validRange: ValidRangeType | undefined\n  },\n  ref: any\n) {\n  const theme = useTheme()\n  const [error, setError] = React.useState<null | string>(null)\n  const formatter = React.useMemo(() => {\n    return new Intl.DateTimeFormat(locale, {\n      month: '2-digit',\n      day: '2-digit',\n      year: 'numeric',\n    })\n  }, [locale])\n\n  const inputFormat = React.useMemo(() => {\n    // TODO: something cleaner and more universal?\n    const inputDate = formatter.format(new Date(2020, 10 - 1, 1))\n    return inputDate\n      .replace('2020', 'YYYY')\n      .replace('10', 'MM')\n      .replace('01', 'DD')\n  }, [formatter])\n\n  const formattedValue = formatter.format(value)\n  const onChangeText = (date: string) => {\n    const dayIndex = inputFormat.indexOf('DD')\n    const monthIndex = inputFormat.indexOf('MM')\n    const yearIndex = inputFormat.indexOf('YYYY')\n\n    const day = Number(date.slice(dayIndex, dayIndex + 2))\n    const year = Number(date.slice(yearIndex, yearIndex + 4))\n    const month = Number(date.slice(monthIndex, monthIndex + 2))\n\n    if (Number.isNaN(day) || Number.isNaN(year) || Number.isNaN(month)) {\n      setError(inputFormat)\n      return\n    }\n\n    const finalDate = isEndDate\n      ? new Date(year, month - 1, day, 23, 59, 59)\n      : new Date(year, month - 1, day)\n\n    const validStart = validRange?.startDate\n    const validEnd = validRange?.endDate\n    if (\n      !isDateWithinOptionalRange(finalDate, {\n        startUnix: validStart ? dateToUnix(validStart) : undefined,\n        endUnix: validEnd ? dateToUnix(validEnd) : undefined,\n      })\n    ) {\n      let errors =\n        validStart && validEnd\n          ? [`${formatter.format(validStart)} - ${formatter.format(validEnd)}`]\n          : [\n              validStart ? `> ${formatter.format(validStart)}` : '',\n              validEnd ? `< ${formatter.format(validEnd)}` : '',\n            ]\n      setError(errors.filter((n) => n).join(' '))\n      return\n    }\n\n    setError(null)\n    if (isEndDate) {\n      onChange(finalDate)\n    } else {\n      onChange(finalDate)\n    }\n  }\n  return (\n    <View style={styles.inputContainer}>\n      <TextInputWithMask\n        ref={ref}\n        value={formattedValue}\n        style={styles.input}\n        label={`${label} (${inputFormat})`}\n        keyboardType={'number-pad'}\n        placeholder={inputFormat}\n        mask={inputFormat}\n        onChangeText={onChangeText}\n        returnKeyType={returnKeyType}\n        onSubmitEditing={onSubmitEditing}\n        keyboardAppearance={theme.dark ? 'dark' : 'default'}\n        error={!!error}\n      />\n      <HelperText type=\"error\" visible={!!error}>\n        {error}\n      </HelperText>\n    </View>\n  )\n}\n\nconst CalendarInput = React.forwardRef(CalendarInputPure)\n\nconst styles = StyleSheet.create({\n  root: { padding: 12 },\n  inner: { flexDirection: 'row' },\n  inputContainer: { flex: 1 },\n  input: { flex: 1 },\n  separator: { width: 12 },\n})\n\nexport default React.memo(CalendarEdit)\n"]}
+{"version":3,"sources":["CalendarEdit.tsx"],"names":["CalendarEdit","mode","state","label","startLabel","endLabel","collapsed","onChange","validRange","locale","dateInput","React","useRef","startInput","endInput","useEffect","Keyboard","dismiss","inputsToFocus","current","filter","n","inputsToBlur","forEach","ip","blur","focus","onSubmitStartInput","useCallback","onSubmitEndInput","onSubmitInput","styles","root","inner","date","startDate","separator","endDate","StyleSheet","create","padding","flexDirection","inputContainer","flex","input","width","memo"],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n  View,\n  StyleSheet,\n  TextInput as TextInputNative,\n  Keyboard,\n} from 'react-native'\n\nimport type { ModeType, ValidRangeType } from './Calendar'\nimport type { LocalState } from './DatePickerModalContent'\n\nimport DatePickerInput from './DatePickerInput'\n\nfunction CalendarEdit({\n  mode,\n  state,\n  label = '',\n  startLabel = 'Start',\n  endLabel = 'End',\n  collapsed,\n  onChange,\n  validRange,\n  locale,\n}: {\n  mode: ModeType\n  label?: string\n  startLabel?: string\n  endLabel?: string\n  state: LocalState\n  collapsed: boolean\n  onChange: (s: LocalState) => any\n  validRange: ValidRangeType | undefined\n  locale: string\n}) {\n  const dateInput = React.useRef<TextInputNative | null>(null)\n  const startInput = React.useRef<TextInputNative | null>(null)\n  const endInput = React.useRef<TextInputNative | null>(null)\n\n  // when switching views focus, or un-focus text input\n  React.useEffect(() => {\n    // hide open keyboard\n    if (collapsed) {\n      Keyboard.dismiss()\n    }\n\n    const inputsToFocus = [dateInput.current, startInput.current].filter(\n      (n) => n\n    ) as TextInputNative[]\n\n    const inputsToBlur = [\n      dateInput.current,\n      startInput.current,\n      endInput.current,\n    ].filter((n) => n) as TextInputNative[]\n\n    if (collapsed) {\n      inputsToBlur.forEach((ip) => ip.blur())\n    } else {\n      inputsToFocus.forEach((ip) => ip.focus())\n    }\n  }, [mode, startInput, endInput, dateInput, collapsed])\n\n  const onSubmitStartInput = React.useCallback(() => {\n    if (endInput.current) {\n      endInput.current.focus()\n    }\n  }, [endInput])\n\n  const onSubmitEndInput = React.useCallback(() => {\n    // TODO: close modal and persist range\n  }, [])\n\n  const onSubmitInput = React.useCallback(() => {\n    // TODO: close modal and persist range\n  }, [])\n\n  return (\n    <View style={styles.root}>\n      <View style={styles.inner}>\n        {mode === 'single' ? (\n          <DatePickerInput\n            inputMode=\"start\"\n            ref={dateInput}\n            label={label}\n            value={state.date}\n            onChange={(date) => onChange({ ...state, date })}\n            onSubmitEditing={onSubmitInput}\n            validRange={validRange}\n            locale={locale}\n            withModal={false}\n            autoCompleteType={'off'}\n          />\n        ) : null}\n        {mode === 'range' ? (\n          <>\n            <DatePickerInput\n              inputMode=\"start\"\n              ref={startInput}\n              label={startLabel}\n              value={state.startDate}\n              onChange={(startDate) => onChange({ ...state, startDate })}\n              returnKeyType={'next'}\n              onSubmitEditing={onSubmitStartInput}\n              validRange={validRange}\n              locale={locale}\n              withModal={false}\n              autoCompleteType={'off'}\n            />\n            <View style={styles.separator} />\n            <DatePickerInput\n              inputMode=\"end\"\n              ref={endInput}\n              label={endLabel}\n              value={state.endDate}\n              onChange={(endDate) => onChange({ ...state, endDate })}\n              onSubmitEditing={onSubmitEndInput}\n              validRange={validRange}\n              locale={locale}\n              withModal={false}\n              autoCompleteType={'off'}\n            />\n          </>\n        ) : null}\n      </View>\n    </View>\n  )\n}\n\nconst styles = StyleSheet.create({\n  root: { padding: 12 },\n  inner: { flexDirection: 'row' },\n  inputContainer: { flex: 1 },\n  input: { flex: 1 },\n  separator: { width: 12 },\n})\n\nexport default React.memo(CalendarEdit)\n"]}

package/lib/commonjs/Date/CalendarHeader.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.getCalendarHeaderHeight = getCalendarHeaderHeight;
 exports.default = void 0;
+exports.getCalendarHeaderHeight = getCalendarHeaderHeight;
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -14,9 +14,9 @@ var _reactNativePaper = require("react-native-paper");
 
 var _DayNames = _interopRequireWildcard(require("./DayNames"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 const buttonContainerHeight = 56;
 const buttonContainerMarginTop = 4;
@@ -30,13 +30,14 @@ function getCalendarHeaderHeight(scrollMode) {
   return _DayNames.dayNamesHeight;
 }
 
-function CalendarHeader({
-  scrollMode,
-  onPrev,
-  onNext,
-  disableWeekDays,
-  locale
-}) {
+function CalendarHeader(_ref) {
+  let {
+    scrollMode,
+    onPrev,
+    onNext,
+    disableWeekDays,
+    locale
+  } = _ref;
   const theme = (0, _reactNativePaper.useTheme)();
   const isHorizontal = scrollMode === 'horizontal';
   return /*#__PURE__*/React.createElement(_reactNative.View, {
@@ -54,14 +55,20 @@ function CalendarHeader({
     }]
   }, /*#__PURE__*/React.createElement(_reactNativePaper.IconButton, {
     icon: "chevron-left",
-    onPress: onPrev
+    onPress: onPrev // RN types bug
+    ,
+    hasTVPreferredFocus: undefined,
+    tvParallaxProperties: undefined
   })), /*#__PURE__*/React.createElement(_reactNative.View, {
     style: [styles.buttonWrapper, {
       backgroundColor: theme.colors.surface
     }]
   }, /*#__PURE__*/React.createElement(_reactNativePaper.IconButton, {
     icon: "chevron-right",
-    onPress: onNext
+    onPress: onNext // RN types bug
+    ,
+    hasTVPreferredFocus: undefined,
+    tvParallaxProperties: undefined
   }))) : null, /*#__PURE__*/React.createElement(_DayNames.default, {
     disableWeekDays: disableWeekDays,
     locale: locale

package/lib/commonjs/Date/CalendarHeader.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CalendarHeader.tsx"],"names":["buttonContainerHeight","buttonContainerMarginTop","buttonContainerMarginBottom","getCalendarHeaderHeight","scrollMode","dayNamesHeight","CalendarHeader","onPrev","onNext","disableWeekDays","locale","theme","isHorizontal","styles","datePickerHeader","buttonContainer","spacer","buttonWrapper","backgroundColor","colors","surface","StyleSheet","create","position","top","right","left","zIndex","height","marginTop","marginBottom","flexDirection","alignItems","flex","React","memo"],"mappings":";;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAGA,MAAMA,qBAAqB,GAAG,EAA9B;AACA,MAAMC,wBAAwB,GAAG,CAAjC;AACA,MAAMC,2BAA2B,GAAG,CAApC;;AAEO,SAASC,uBAAT,CAAiCC,UAAjC,EAAwE;AAC7E,MAAIA,UAAU,KAAK,YAAnB,EAAiC;AAC/B,WACEJ,qBAAqB,GACrBC,wBADA,GAEAC,2BAFA,GAGAG,wBAJF;AAMD;;AACD,SAAOA,wBAAP;AACD;;AAED,SAASC,cAAT,CAAwB;AACtBF,EAAAA,UADsB;AAEtBG,EAAAA,MAFsB;AAGtBC,EAAAA,MAHsB;AAItBC,EAAAA,eAJsB;AAKtBC,EAAAA;AALsB,CAAxB,EAYG;AACD,QAAMC,KAAK,GAAG,iCAAd;AACA,QAAMC,YAAY,GAAGR,UAAU,KAAK,YAApC;AACA,sBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAES,MAAM,CAACC,gBAApB;AAAsC,IAAA,aAAa,EAAE;AAArD,KACGF,YAAY,gBACX,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEC,MAAM,CAACE,eAApB;AAAqC,IAAA,aAAa,EAAE;AAApD,kBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEF,MAAM,CAACG,MAApB;AAA4B,IAAA,aAAa,EAAE;AAA3C,IADF,eAEE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLH,MAAM,CAACI,aADF,EAEL;AAAEC,MAAAA,eAAe,EAAEP,KAAK,CAACQ,MAAN,CAAaC;AAAhC,KAFK;AADT,kBAME,oBAAC,4BAAD;AAAY,IAAA,IAAI,EAAC,cAAjB;AAAgC,IAAA,OAAO,EAAEb;AAAzC,IANF,CAFF,eAWE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLM,MAAM,CAACI,aADF,EAEL;AAAEC,MAAAA,eAAe,EAAEP,KAAK,CAACQ,MAAN,CAAaC;AAAhC,KAFK;AADT,kBAME,oBAAC,4BAAD;AAAY,IAAA,IAAI,EAAC,eAAjB;AAAiC,IAAA,OAAO,EAAEZ;AAA1C,IANF,CAXF,CADW,GAqBT,IAtBN,eAuBE,oBAAC,iBAAD;AAAU,IAAA,eAAe,EAAEC,eAA3B;AAA4C,IAAA,MAAM,EAAEC;AAApD,IAvBF,CADF;AA2BD;;AAED,MAAMG,MAAM,GAAGQ,wBAAWC,MAAX,CAAkB;AAC/BR,EAAAA,gBAAgB,EAAE;AAChBS,IAAAA,QAAQ,EAAE,UADM;AAEhBC,IAAAA,GAAG,EAAE,CAFW;AAGhBC,IAAAA,KAAK,EAAE,CAHS;AAIhBC,IAAAA,IAAI,EAAE,CAJU;AAKhBC,IAAAA,MAAM,EAAE;AALQ,GADa;AAQ/BZ,EAAAA,eAAe,EAAE;AACfa,IAAAA,MAAM,EAAE5B,qBADO;AAEf6B,IAAAA,SAAS,EAAE5B,wBAFI;AAGf6B,IAAAA,YAAY,EAAE5B,2BAHC;AAIf6B,IAAAA,aAAa,EAAE,KAJA;AAKfC,IAAAA,UAAU,EAAE;AALG,GARc;AAe/Bf,EAAAA,aAAa,EAAE,EAfgB;AAgB/BD,EAAAA,MAAM,EAAE;AAAEiB,IAAAA,IAAI,EAAE;AAAR;AAhBuB,CAAlB,CAAf;;4BAmBeC,KAAK,CAACC,IAAN,CAAW7B,cAAX,C","sourcesContent":["import * as React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { IconButton, useTheme } from 'react-native-paper'\nimport DayNames, { dayNamesHeight } from './DayNames'\nimport { DisableWeekDaysType } from './dateUtils'\n\nconst buttonContainerHeight = 56\nconst buttonContainerMarginTop = 4\nconst buttonContainerMarginBottom = 8\n\nexport function getCalendarHeaderHeight(scrollMode: 'horizontal' | 'vertical') {\n  if (scrollMode === 'horizontal') {\n    return (\n      buttonContainerHeight +\n      buttonContainerMarginTop +\n      buttonContainerMarginBottom +\n      dayNamesHeight\n    )\n  }\n  return dayNamesHeight\n}\n\nfunction CalendarHeader({\n  scrollMode,\n  onPrev,\n  onNext,\n  disableWeekDays,\n  locale,\n}: {\n  locale: undefined | string\n  scrollMode: 'horizontal' | 'vertical'\n  onPrev: () => any\n  onNext: () => any\n  disableWeekDays?: DisableWeekDaysType\n}) {\n  const theme = useTheme()\n  const isHorizontal = scrollMode === 'horizontal'\n  return (\n    <View style={styles.datePickerHeader} pointerEvents={'box-none'}>\n      {isHorizontal ? (\n        <View style={styles.buttonContainer} pointerEvents={'box-none'}>\n          <View style={styles.spacer} pointerEvents={'box-none'} />\n          <View\n            style={[\n              styles.buttonWrapper,\n              { backgroundColor: theme.colors.surface },\n            ]}\n          >\n            <IconButton icon=\"chevron-left\" onPress={onPrev} />\n          </View>\n\n          <View\n            style={[\n              styles.buttonWrapper,\n              { backgroundColor: theme.colors.surface },\n            ]}\n          >\n            <IconButton icon=\"chevron-right\" onPress={onNext} />\n          </View>\n        </View>\n      ) : null}\n      <DayNames disableWeekDays={disableWeekDays} locale={locale} />\n    </View>\n  )\n}\n\nconst styles = StyleSheet.create({\n  datePickerHeader: {\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    left: 0,\n    zIndex: 10,\n  },\n  buttonContainer: {\n    height: buttonContainerHeight,\n    marginTop: buttonContainerMarginTop,\n    marginBottom: buttonContainerMarginBottom,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  buttonWrapper: {},\n  spacer: { flex: 1 },\n})\n\nexport default React.memo(CalendarHeader)\n"]}
+{"version":3,"sources":["CalendarHeader.tsx"],"names":["buttonContainerHeight","buttonContainerMarginTop","buttonContainerMarginBottom","getCalendarHeaderHeight","scrollMode","dayNamesHeight","CalendarHeader","onPrev","onNext","disableWeekDays","locale","theme","isHorizontal","styles","datePickerHeader","buttonContainer","spacer","buttonWrapper","backgroundColor","colors","surface","undefined","StyleSheet","create","position","top","right","left","zIndex","height","marginTop","marginBottom","flexDirection","alignItems","flex","React","memo"],"mappings":";;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;AAGA,MAAMA,qBAAqB,GAAG,EAA9B;AACA,MAAMC,wBAAwB,GAAG,CAAjC;AACA,MAAMC,2BAA2B,GAAG,CAApC;;AAEO,SAASC,uBAAT,CAAiCC,UAAjC,EAAwE;AAC7E,MAAIA,UAAU,KAAK,YAAnB,EAAiC;AAC/B,WACEJ,qBAAqB,GACrBC,wBADA,GAEAC,2BAFA,GAGAG,wBAJF;AAMD;;AACD,SAAOA,wBAAP;AACD;;AAED,SAASC,cAAT,OAYG;AAAA,MAZqB;AACtBF,IAAAA,UADsB;AAEtBG,IAAAA,MAFsB;AAGtBC,IAAAA,MAHsB;AAItBC,IAAAA,eAJsB;AAKtBC,IAAAA;AALsB,GAYrB;AACD,QAAMC,KAAK,GAAG,iCAAd;AACA,QAAMC,YAAY,GAAGR,UAAU,KAAK,YAApC;AACA,sBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAES,MAAM,CAACC,gBAApB;AAAsC,IAAA,aAAa,EAAE;AAArD,KACGF,YAAY,gBACX,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEC,MAAM,CAACE,eAApB;AAAqC,IAAA,aAAa,EAAE;AAApD,kBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEF,MAAM,CAACG,MAApB;AAA4B,IAAA,aAAa,EAAE;AAA3C,IADF,eAEE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLH,MAAM,CAACI,aADF,EAEL;AAAEC,MAAAA,eAAe,EAAEP,KAAK,CAACQ,MAAN,CAAaC;AAAhC,KAFK;AADT,kBAME,oBAAC,4BAAD;AACE,IAAA,IAAI,EAAC,cADP;AAEE,IAAA,OAAO,EAAEb,MAFX,CAGE;AAHF;AAIE,IAAA,mBAAmB,EAAEc,SAJvB;AAKE,IAAA,oBAAoB,EAAEA;AALxB,IANF,CAFF,eAiBE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLR,MAAM,CAACI,aADF,EAEL;AAAEC,MAAAA,eAAe,EAAEP,KAAK,CAACQ,MAAN,CAAaC;AAAhC,KAFK;AADT,kBAME,oBAAC,4BAAD;AACE,IAAA,IAAI,EAAC,eADP;AAEE,IAAA,OAAO,EAAEZ,MAFX,CAGE;AAHF;AAIE,IAAA,mBAAmB,EAAEa,SAJvB;AAKE,IAAA,oBAAoB,EAAEA;AALxB,IANF,CAjBF,CADW,GAiCT,IAlCN,eAmCE,oBAAC,iBAAD;AAAU,IAAA,eAAe,EAAEZ,eAA3B;AAA4C,IAAA,MAAM,EAAEC;AAApD,IAnCF,CADF;AAuCD;;AAED,MAAMG,MAAM,GAAGS,wBAAWC,MAAX,CAAkB;AAC/BT,EAAAA,gBAAgB,EAAE;AAChBU,IAAAA,QAAQ,EAAE,UADM;AAEhBC,IAAAA,GAAG,EAAE,CAFW;AAGhBC,IAAAA,KAAK,EAAE,CAHS;AAIhBC,IAAAA,IAAI,EAAE,CAJU;AAKhBC,IAAAA,MAAM,EAAE;AALQ,GADa;AAQ/Bb,EAAAA,eAAe,EAAE;AACfc,IAAAA,MAAM,EAAE7B,qBADO;AAEf8B,IAAAA,SAAS,EAAE7B,wBAFI;AAGf8B,IAAAA,YAAY,EAAE7B,2BAHC;AAIf8B,IAAAA,aAAa,EAAE,KAJA;AAKfC,IAAAA,UAAU,EAAE;AALG,GARc;AAe/BhB,EAAAA,aAAa,EAAE,EAfgB;AAgB/BD,EAAAA,MAAM,EAAE;AAAEkB,IAAAA,IAAI,EAAE;AAAR;AAhBuB,CAAlB,CAAf;;4BAmBeC,KAAK,CAACC,IAAN,CAAW9B,cAAX,C","sourcesContent":["import * as React from 'react'\nimport { StyleSheet, View } from 'react-native'\nimport { IconButton, useTheme } from 'react-native-paper'\nimport DayNames, { dayNamesHeight } from './DayNames'\nimport type { DisableWeekDaysType } from './dateUtils'\n\nconst buttonContainerHeight = 56\nconst buttonContainerMarginTop = 4\nconst buttonContainerMarginBottom = 8\n\nexport function getCalendarHeaderHeight(scrollMode: 'horizontal' | 'vertical') {\n  if (scrollMode === 'horizontal') {\n    return (\n      buttonContainerHeight +\n      buttonContainerMarginTop +\n      buttonContainerMarginBottom +\n      dayNamesHeight\n    )\n  }\n  return dayNamesHeight\n}\n\nfunction CalendarHeader({\n  scrollMode,\n  onPrev,\n  onNext,\n  disableWeekDays,\n  locale,\n}: {\n  locale: undefined | string\n  scrollMode: 'horizontal' | 'vertical'\n  onPrev: () => any\n  onNext: () => any\n  disableWeekDays?: DisableWeekDaysType\n}) {\n  const theme = useTheme()\n  const isHorizontal = scrollMode === 'horizontal'\n  return (\n    <View style={styles.datePickerHeader} pointerEvents={'box-none'}>\n      {isHorizontal ? (\n        <View style={styles.buttonContainer} pointerEvents={'box-none'}>\n          <View style={styles.spacer} pointerEvents={'box-none'} />\n          <View\n            style={[\n              styles.buttonWrapper,\n              { backgroundColor: theme.colors.surface },\n            ]}\n          >\n            <IconButton\n              icon=\"chevron-left\"\n              onPress={onPrev}\n              // RN types bug\n              hasTVPreferredFocus={undefined}\n              tvParallaxProperties={undefined}\n            />\n          </View>\n\n          <View\n            style={[\n              styles.buttonWrapper,\n              { backgroundColor: theme.colors.surface },\n            ]}\n          >\n            <IconButton\n              icon=\"chevron-right\"\n              onPress={onNext}\n              // RN types bug\n              hasTVPreferredFocus={undefined}\n              tvParallaxProperties={undefined}\n            />\n          </View>\n        </View>\n      ) : null}\n      <DayNames disableWeekDays={disableWeekDays} locale={locale} />\n    </View>\n  )\n}\n\nconst styles = StyleSheet.create({\n  datePickerHeader: {\n    position: 'absolute',\n    top: 0,\n    right: 0,\n    left: 0,\n    zIndex: 10,\n  },\n  buttonContainer: {\n    height: buttonContainerHeight,\n    marginTop: buttonContainerMarginTop,\n    marginBottom: buttonContainerMarginBottom,\n    flexDirection: 'row',\n    alignItems: 'center',\n  },\n  buttonWrapper: {},\n  spacer: { flex: 1 },\n})\n\nexport default React.memo(CalendarHeader)\n"]}

package/lib/commonjs/Date/DatePickerInput.js

@@ -3,7 +3,7 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.default = DatePickerInput;
+exports.default = void 0;
 
 var React = _interopRequireWildcard(require("react"));
 
@@ -15,55 +15,128 @@ var _reactNative = require("react-native");
 
 var _DatePickerModal = _interopRequireDefault(require("./DatePickerModal"));
 
+var _inputUtils = _interopRequireDefault(require("./inputUtils"));
+
+var _utils = require("../utils");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function DatePickerInput() {
+function DatePickerInput(_ref, ref) {
+  let {
+    label,
+    value,
+    onChange,
+    style,
+    locale,
+    validRange,
+    inputMode,
+    withModal = true,
+    withDateFormatInLabel = true,
+    ...rest
+  } = _ref;
+  const theme = (0, _reactNativePaper.useTheme)();
+  const {
+    formattedValue,
+    inputFormat,
+    onChangeText,
+    error
+  } = (0, _inputUtils.default)({
+    locale,
+    value,
+    validRange,
+    inputMode,
+    onChange
+  });
   const [visible, setVisible] = React.useState(false);
   const onDismiss = React.useCallback(() => {
     setVisible(false);
   }, [setVisible]);
-  const onConfirm = React.useCallback(() => {
+  const onChangeRef = (0, _utils.useLatest)(onChange);
+  const onInnerConfirm = React.useCallback(_ref2 => {
+    let {
+      date
+    } = _ref2;
     setVisible(false);
-  }, [setVisible]);
+    onChangeRef.current(date);
+  }, [setVisible, onChangeRef]);
   return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_reactNative.View, {
     style: styles.root
-  }, /*#__PURE__*/React.createElement(_TextInputMask.default, {
-    value: '',
-    keyboardType: 'numeric',
-    placeholder: 'DD-MM-YYY',
-    mask: 'DD-MM-YYY',
-    onChangeText: () => {},
-    style: styles.input
-  }), /*#__PURE__*/React.createElement(_reactNativePaper.IconButton, {
+  }, /*#__PURE__*/React.createElement(_TextInputMask.default, _extends({}, rest, {
+    ref: ref,
+    label: getLabel({
+      label,
+      inputFormat,
+      withDateFormatInLabel
+    }),
+    value: formattedValue,
+    keyboardType: 'number-pad',
+    placeholder: inputFormat,
+    mask: inputFormat,
+    onChangeText: onChangeText,
+    keyboardAppearance: theme.dark ? 'dark' : 'default',
+    error: !!error,
+    style: [styles.input, style]
+  })), withModal ? /*#__PURE__*/React.createElement(_reactNativePaper.IconButton, {
     size: 24,
     style: styles.calendarButton,
     icon: "calendar",
-    onPress: () => setVisible(true)
-  })), /*#__PURE__*/React.createElement(_DatePickerModal.default, {
+    onPress: () => setVisible(true) // RN types bug
+    ,
+    hasTVPreferredFocus: undefined,
+    tvParallaxProperties: undefined
+  }) : null), /*#__PURE__*/React.createElement(_reactNativePaper.HelperText, {
+    type: "error",
+    visible: !!error
+  }, error), withModal ? /*#__PURE__*/React.createElement(_DatePickerModal.default, {
+    date: value,
     mode: "single",
     visible: visible,
     onDismiss: onDismiss,
-    onConfirm: onConfirm
-  }));
+    onConfirm: onInnerConfirm,
+    locale: locale,
+    dateMode: inputMode
+  }) : null);
+}
+
+function getLabel(_ref3) {
+  let {
+    withDateFormatInLabel,
+    inputFormat,
+    label
+  } = _ref3;
+
+  if (withDateFormatInLabel) {
+    return label ? `${label} (${inputFormat})` : inputFormat;
+  }
+
+  return label || '';
 }
 
 const styles = _reactNative.StyleSheet.create({
   root: {
+    minWidth: 150,
     flexDirection: 'row',
     position: 'relative',
     alignItems: 'center',
-    flex: 1
+    flexGrow: 1,
+    alignSelf: 'flex-start'
   },
   input: {
-    flex: 1
+    flexGrow: 1
   },
   calendarButton: {
     position: 'absolute',
     right: 0
   }
 });
+
+var _default = /*#__PURE__*/React.forwardRef(DatePickerInput);
+
+exports.default = _default;
 //# sourceMappingURL=DatePickerInput.js.map

package/lib/commonjs/Date/DatePickerInput.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DatePickerInput.tsx"],"names":["DatePickerInput","visible","setVisible","React","useState","onDismiss","useCallback","onConfirm","styles","root","input","calendarButton","StyleSheet","create","flexDirection","position","alignItems","flex","right"],"mappings":";;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;;;AAEe,SAASA,eAAT,GAA2B;AACxC,QAAM,CAACC,OAAD,EAAUC,UAAV,IAAwBC,KAAK,CAACC,QAAN,CAAwB,KAAxB,CAA9B;AACA,QAAMC,SAAS,GAAGF,KAAK,CAACG,WAAN,CAAkB,MAAM;AACxCJ,IAAAA,UAAU,CAAC,KAAD,CAAV;AACD,GAFiB,EAEf,CAACA,UAAD,CAFe,CAAlB;AAGA,QAAMK,SAAS,GAAGJ,KAAK,CAACG,WAAN,CAAkB,MAAM;AACxCJ,IAAAA,UAAU,CAAC,KAAD,CAAV;AACD,GAFiB,EAEf,CAACA,UAAD,CAFe,CAAlB;AAIA,sBACE,uDACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAEM,MAAM,CAACC;AAApB,kBACE,oBAAC,sBAAD;AACE,IAAA,KAAK,EAAE,EADT;AAEE,IAAA,YAAY,EAAE,SAFhB;AAGE,IAAA,WAAW,EAAE,WAHf;AAIE,IAAA,IAAI,EAAE,WAJR;AAKE,IAAA,YAAY,EAAE,MAAM,CAAE,CALxB;AAME,IAAA,KAAK,EAAED,MAAM,CAACE;AANhB,IADF,eASE,oBAAC,4BAAD;AACE,IAAA,IAAI,EAAE,EADR;AAEE,IAAA,KAAK,EAAEF,MAAM,CAACG,cAFhB;AAGE,IAAA,IAAI,EAAC,UAHP;AAIE,IAAA,OAAO,EAAE,MAAMT,UAAU,CAAC,IAAD;AAJ3B,IATF,CADF,eAiBE,oBAAC,wBAAD;AACE,IAAA,IAAI,EAAC,QADP;AAEE,IAAA,OAAO,EAAED,OAFX;AAGE,IAAA,SAAS,EAAEI,SAHb;AAIE,IAAA,SAAS,EAAEE;AAJb,IAjBF,CADF;AA0BD;;AAED,MAAMC,MAAM,GAAGI,wBAAWC,MAAX,CAAkB;AAC/BJ,EAAAA,IAAI,EAAE;AACJK,IAAAA,aAAa,EAAE,KADX;AAEJC,IAAAA,QAAQ,EAAE,UAFN;AAGJC,IAAAA,UAAU,EAAE,QAHR;AAIJC,IAAAA,IAAI,EAAE;AAJF,GADyB;AAO/BP,EAAAA,KAAK,EAAE;AAAEO,IAAAA,IAAI,EAAE;AAAR,GAPwB;AAQ/BN,EAAAA,cAAc,EAAE;AAAEI,IAAAA,QAAQ,EAAE,UAAZ;AAAwBG,IAAAA,KAAK,EAAE;AAA/B;AARe,CAAlB,CAAf","sourcesContent":["import * as React from 'react'\n\nimport TextInputWithMask from '../TextInputMask'\nimport { IconButton } from 'react-native-paper'\nimport { View, StyleSheet } from 'react-native'\nimport DatePickerModal from './DatePickerModal'\n\nexport default function DatePickerInput() {\n  const [visible, setVisible] = React.useState<boolean>(false)\n  const onDismiss = React.useCallback(() => {\n    setVisible(false)\n  }, [setVisible])\n  const onConfirm = React.useCallback(() => {\n    setVisible(false)\n  }, [setVisible])\n\n  return (\n    <>\n      <View style={styles.root}>\n        <TextInputWithMask\n          value={''}\n          keyboardType={'numeric'}\n          placeholder={'DD-MM-YYY'}\n          mask={'DD-MM-YYY'}\n          onChangeText={() => {}}\n          style={styles.input}\n        />\n        <IconButton\n          size={24}\n          style={styles.calendarButton}\n          icon=\"calendar\"\n          onPress={() => setVisible(true)}\n        />\n      </View>\n      <DatePickerModal\n        mode=\"single\"\n        visible={visible}\n        onDismiss={onDismiss}\n        onConfirm={onConfirm}\n      />\n    </>\n  )\n}\n\nconst styles = StyleSheet.create({\n  root: {\n    flexDirection: 'row',\n    position: 'relative',\n    alignItems: 'center',\n    flex: 1,\n  },\n  input: { flex: 1 },\n  calendarButton: { position: 'absolute', right: 0 },\n})\n"]}
+{"version":3,"sources":["DatePickerInput.tsx"],"names":["DatePickerInput","ref","label","value","onChange","style","locale","validRange","inputMode","withModal","withDateFormatInLabel","rest","theme","formattedValue","inputFormat","onChangeText","error","visible","setVisible","React","useState","onDismiss","useCallback","onChangeRef","onInnerConfirm","date","current","styles","root","getLabel","dark","input","calendarButton","undefined","StyleSheet","create","minWidth","flexDirection","position","alignItems","flexGrow","alignSelf","right","forwardRef"],"mappings":"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","sourcesContent":["import * as React from 'react'\n\nimport TextInputWithMask from '../TextInputMask'\nimport { HelperText, IconButton, TextInput, useTheme } from 'react-native-paper'\nimport { View, StyleSheet } from 'react-native'\nimport DatePickerModal from './DatePickerModal'\nimport useDateInput from './inputUtils'\nimport type { ValidRangeType } from './Calendar'\nimport { useLatest } from '../utils'\n\nfunction DatePickerInput(\n  {\n    label,\n    value,\n    onChange,\n    style,\n    locale,\n    validRange,\n    inputMode,\n    withModal = true,\n    withDateFormatInLabel = true,\n    ...rest\n  }: Omit<React.ComponentProps<typeof TextInput>, 'value' | 'onChange'> & {\n    inputMode: 'start' | 'end'\n    locale: string\n    onChange: (date: Date | undefined) => void\n    value: Date | undefined\n    validRange?: ValidRangeType | undefined\n    withModal?: boolean\n    withDateFormatInLabel?: boolean\n  },\n  ref: any\n) {\n  const theme = useTheme()\n  const { formattedValue, inputFormat, onChangeText, error } = useDateInput({\n    locale,\n    value,\n    validRange,\n    inputMode,\n    onChange,\n  })\n\n  const [visible, setVisible] = React.useState<boolean>(false)\n  const onDismiss = React.useCallback(() => {\n    setVisible(false)\n  }, [setVisible])\n  const onChangeRef = useLatest(onChange)\n  const onInnerConfirm = React.useCallback(\n    ({ date }) => {\n      setVisible(false)\n      onChangeRef.current(date)\n    },\n    [setVisible, onChangeRef]\n  )\n\n  return (\n    <>\n      <View style={styles.root}>\n        <TextInputWithMask\n          {...rest}\n          ref={ref}\n          label={getLabel({ label, inputFormat, withDateFormatInLabel })}\n          value={formattedValue}\n          keyboardType={'number-pad'}\n          placeholder={inputFormat}\n          mask={inputFormat}\n          onChangeText={onChangeText}\n          keyboardAppearance={theme.dark ? 'dark' : 'default'}\n          error={!!error}\n          style={[styles.input, style]}\n        />\n        {withModal ? (\n          <IconButton\n            size={24}\n            style={styles.calendarButton}\n            icon=\"calendar\"\n            onPress={() => setVisible(true)}\n            // RN types bug\n            hasTVPreferredFocus={undefined}\n            tvParallaxProperties={undefined}\n          />\n        ) : null}\n      </View>\n      <HelperText type=\"error\" visible={!!error}>\n        {error}\n      </HelperText>\n\n      {withModal ? (\n        <DatePickerModal\n          date={value}\n          mode=\"single\"\n          visible={visible}\n          onDismiss={onDismiss}\n          onConfirm={onInnerConfirm}\n          locale={locale}\n          dateMode={inputMode}\n        />\n      ) : null}\n    </>\n  )\n}\n\nfunction getLabel({\n  withDateFormatInLabel,\n  inputFormat,\n  label,\n}: {\n  withDateFormatInLabel: boolean\n  inputFormat: string\n  label: string | undefined\n}) {\n  if (withDateFormatInLabel) {\n    return label ? `${label} (${inputFormat})` : inputFormat\n  }\n  return label || ''\n}\n\nconst styles = StyleSheet.create({\n  root: {\n    minWidth: 150,\n    flexDirection: 'row',\n    position: 'relative',\n    alignItems: 'center',\n    flexGrow: 1,\n    alignSelf: 'flex-start',\n  },\n  input: {\n    flexGrow: 1,\n  },\n  calendarButton: { position: 'absolute', right: 0 },\n})\nexport default React.forwardRef(DatePickerInput)\n"]}

package/lib/commonjs/Date/DatePickerModal.js

@@ -14,15 +14,13 @@ var _reactNativePaper = require("react-native-paper");
 
 var _DatePickerModalContent = _interopRequireDefault(require("./DatePickerModalContent"));
 
-var _color = _interopRequireDefault(require("color"));
-
 var _utils = require("../utils");
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function () { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
 function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
@@ -43,7 +41,7 @@ function DatePickerModal(props) {
   });
 
   const isLight = (0, _utils.useHeaderColorIsLight)();
-  const statusBarColor = (0, React.useMemo)(() => (0, _color.default)(theme.colors.primary).darken(0.2).hex(), [theme]);
+  const headerBackgroundColor = (0, _utils.useHeaderBackgroundColor)();
   return /*#__PURE__*/React.createElement(_reactNative.View, {
     style: [_reactNative.StyleSheet.absoluteFill],
     pointerEvents: "box-none"
@@ -75,7 +73,7 @@ function DatePickerModal(props) {
   }), disableStatusBarPadding ? null : /*#__PURE__*/React.createElement(_reactNative.View, {
     style: [{
       height: _reactNative.StatusBar.currentHeight,
-      backgroundColor: statusBarColor
+      backgroundColor: headerBackgroundColor
     }]
   }), /*#__PURE__*/React.createElement(_DatePickerModalContent.default, _extends({}, rest, {
     disableSafeTop: disableStatusBar

package/lib/commonjs/Date/DatePickerModal.js.map

@@ -1 +1 @@
-{"version":3,"sources":["DatePickerModal.tsx"],"names":["DatePickerModal","props","theme","dimensions","visible","animationType","disableStatusBar","disableStatusBarPadding","rest","animationTypeCalculated","Platform","select","web","default","isLight","statusBarColor","colors","primary","darken","hex","StyleSheet","absoluteFill","onDismiss","supportedOrientations","styles","modalBackground","backgroundColor","backdrop","modalRoot","modalContent","surface","width","modalContentBig","height","StatusBar","currentHeight","create","justifyContent","alignItems","flex","maxWidth","maxHeight","borderRadius","overflow","React","memo"],"mappings":"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","sourcesContent":["import * as React from 'react'\nimport {\n  Modal,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  useWindowDimensions,\n  View,\n  Platform,\n  StatusBar,\n} from 'react-native'\n\nimport { useTheme } from 'react-native-paper'\nimport DatePickerModalContent, {\n  DatePickerModalContentMultiProps,\n  DatePickerModalContentRangeProps,\n  DatePickerModalContentSingleProps,\n} from './DatePickerModalContent'\nimport { useMemo } from 'react'\nimport Color from 'color'\nimport { useHeaderColorIsLight } from '../utils'\n\ninterface DatePickerModalProps {\n  visible: boolean\n  animationType?: 'slide' | 'fade' | 'none'\n  disableStatusBar?: boolean\n  disableStatusBarPadding?: boolean\n}\n\nexport interface DatePickerModalSingleProps\n  extends DatePickerModalContentSingleProps,\n    DatePickerModalProps {}\n\nexport interface DatePickerModalMultiProps\n  extends DatePickerModalContentMultiProps,\n    DatePickerModalProps {}\n\nexport interface DatePickerModalRangeProps\n  extends DatePickerModalContentRangeProps,\n    DatePickerModalProps {}\n\nexport function DatePickerModal(\n  props:\n    | DatePickerModalRangeProps\n    | DatePickerModalSingleProps\n    | DatePickerModalMultiProps\n) {\n  const theme = useTheme()\n  const dimensions = useWindowDimensions()\n  const {\n    visible,\n    animationType,\n    disableStatusBar,\n    disableStatusBarPadding,\n    ...rest\n  } = props\n  const animationTypeCalculated =\n    animationType ||\n    Platform.select({\n      web: 'none',\n      default: 'slide',\n    })\n\n  const isLight = useHeaderColorIsLight()\n  const statusBarColor = useMemo<string>(\n    () => Color(theme.colors.primary).darken(0.2).hex(),\n    [theme]\n  )\n\n  return (\n    <View style={[StyleSheet.absoluteFill]} pointerEvents=\"box-none\">\n      <Modal\n        animationType={animationTypeCalculated}\n        transparent={true}\n        visible={visible}\n        onRequestClose={rest.onDismiss}\n        presentationStyle=\"overFullScreen\"\n        supportedOrientations={supportedOrientations}\n        //@ts-ignore\n        statusBarTranslucent={true}\n      >\n        <>\n          <TouchableWithoutFeedback onPress={rest.onDismiss}>\n            <View\n              style={[\n                StyleSheet.absoluteFill,\n                styles.modalBackground,\n                { backgroundColor: theme.colors.backdrop },\n              ]}\n            />\n          </TouchableWithoutFeedback>\n          <View\n            style={[StyleSheet.absoluteFill, styles.modalRoot]}\n            pointerEvents=\"box-none\"\n          >\n            <View\n              style={[\n                styles.modalContent,\n                { backgroundColor: theme.colors.surface },\n                dimensions.width > 650 ? styles.modalContentBig : null,\n              ]}\n            >\n              {disableStatusBar ? null : (\n                <StatusBar\n                  translucent={true}\n                  barStyle={isLight ? 'dark-content' : 'light-content'}\n                />\n              )}\n              {disableStatusBarPadding ? null : (\n                <View\n                  style={[\n                    {\n                      height: StatusBar.currentHeight,\n                      backgroundColor: statusBarColor,\n                    },\n                  ]}\n                />\n              )}\n              <DatePickerModalContent\n                {...rest}\n                disableSafeTop={disableStatusBar}\n              />\n            </View>\n          </View>\n        </>\n      </Modal>\n    </View>\n  )\n}\nconst supportedOrientations: any = [\n  'portrait',\n  'portrait-upside-down',\n  'landscape',\n  'landscape-left',\n  'landscape-right',\n]\n\nconst styles = StyleSheet.create({\n  modalRoot: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  modalBackground: {\n    flex: 1,\n  },\n  modalContent: {\n    flex: 1,\n    width: '100%',\n  },\n  modalContentBig: {\n    maxWidth: 600,\n    maxHeight: 800,\n    borderRadius: 10,\n    width: '100%',\n    overflow: 'hidden',\n  },\n})\n\nexport default React.memo(DatePickerModal)\n"]}
+{"version":3,"sources":["DatePickerModal.tsx"],"names":["DatePickerModal","props","theme","dimensions","visible","animationType","disableStatusBar","disableStatusBarPadding","rest","animationTypeCalculated","Platform","select","web","default","isLight","headerBackgroundColor","StyleSheet","absoluteFill","onDismiss","supportedOrientations","styles","modalBackground","backgroundColor","colors","backdrop","modalRoot","modalContent","surface","width","modalContentBig","height","StatusBar","currentHeight","create","justifyContent","alignItems","flex","maxWidth","maxHeight","borderRadius","overflow","React","memo"],"mappings":";;;;;;;;AAAA;;AACA;;AAUA;;AACA;;AAKA;;;;;;;;;;AAqBO,SAASA,eAAT,CACLC,KADK,EAKL;AACA,QAAMC,KAAK,GAAG,iCAAd;AACA,QAAMC,UAAU,GAAG,uCAAnB;AACA,QAAM;AACJC,IAAAA,OADI;AAEJC,IAAAA,aAFI;AAGJC,IAAAA,gBAHI;AAIJC,IAAAA,uBAJI;AAKJ,OAAGC;AALC,MAMFP,KANJ;;AAOA,QAAMQ,uBAAuB,GAC3BJ,aAAa,IACbK,sBAASC,MAAT,CAAgB;AACdC,IAAAA,GAAG,EAAE,MADS;AAEdC,IAAAA,OAAO,EAAE;AAFK,GAAhB,CAFF;;AAOA,QAAMC,OAAO,GAAG,mCAAhB;AACA,QAAMC,qBAAqB,GAAG,sCAA9B;AAEA,sBACE,oBAAC,iBAAD;AAAM,IAAA,KAAK,EAAE,CAACC,wBAAWC,YAAZ,CAAb;AAAwC,IAAA,aAAa,EAAC;AAAtD,kBACE,oBAAC,kBAAD;AACE,IAAA,aAAa,EAAER,uBADjB;AAEE,IAAA,WAAW,EAAE,IAFf;AAGE,IAAA,OAAO,EAAEL,OAHX;AAIE,IAAA,cAAc,EAAEI,IAAI,CAACU,SAJvB;AAKE,IAAA,iBAAiB,EAAC,gBALpB;AAME,IAAA,qBAAqB,EAAEC,qBANzB,CAOE;AAPF;AAQE,IAAA,oBAAoB,EAAE;AARxB,kBAUE,uDACE,oBAAC,qCAAD;AAA0B,IAAA,OAAO,EAAEX,IAAI,CAACU;AAAxC,kBACE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLF,wBAAWC,YADN,EAELG,MAAM,CAACC,eAFF,EAGL;AAAEC,MAAAA,eAAe,EAAEpB,KAAK,CAACqB,MAAN,CAAaC;AAAhC,KAHK;AADT,IADF,CADF,eAUE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CAACR,wBAAWC,YAAZ,EAA0BG,MAAM,CAACK,SAAjC,CADT;AAEE,IAAA,aAAa,EAAC;AAFhB,kBAIE,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACLL,MAAM,CAACM,YADF,EAEL;AAAEJ,MAAAA,eAAe,EAAEpB,KAAK,CAACqB,MAAN,CAAaI;AAAhC,KAFK,EAGLxB,UAAU,CAACyB,KAAX,GAAmB,GAAnB,GAAyBR,MAAM,CAACS,eAAhC,GAAkD,IAH7C;AADT,KAOGvB,gBAAgB,GAAG,IAAH,gBACf,oBAAC,sBAAD;AACE,IAAA,WAAW,EAAE,IADf;AAEE,IAAA,QAAQ,EAAEQ,OAAO,GAAG,cAAH,GAAoB;AAFvC,IARJ,EAaGP,uBAAuB,GAAG,IAAH,gBACtB,oBAAC,iBAAD;AACE,IAAA,KAAK,EAAE,CACL;AACEuB,MAAAA,MAAM,EAAEC,uBAAUC,aADpB;AAEEV,MAAAA,eAAe,EAAEP;AAFnB,KADK;AADT,IAdJ,eAuBE,oBAAC,+BAAD,eACMP,IADN;AAEE,IAAA,cAAc,EAAEF;AAFlB,KAvBF,CAJF,CAVF,CAVF,CADF,CADF;AA2DD;;AACD,MAAMa,qBAA0B,GAAG,CACjC,UADiC,EAEjC,sBAFiC,EAGjC,WAHiC,EAIjC,gBAJiC,EAKjC,iBALiC,CAAnC;;AAQA,MAAMC,MAAM,GAAGJ,wBAAWiB,MAAX,CAAkB;AAC/BR,EAAAA,SAAS,EAAE;AACTS,IAAAA,cAAc,EAAE,QADP;AAETC,IAAAA,UAAU,EAAE,QAFH;AAGTC,IAAAA,IAAI,EAAE;AAHG,GADoB;AAM/Bf,EAAAA,eAAe,EAAE;AACfe,IAAAA,IAAI,EAAE;AADS,GANc;AAS/BV,EAAAA,YAAY,EAAE;AACZU,IAAAA,IAAI,EAAE,CADM;AAEZR,IAAAA,KAAK,EAAE;AAFK,GATiB;AAa/BC,EAAAA,eAAe,EAAE;AACfQ,IAAAA,QAAQ,EAAE,GADK;AAEfC,IAAAA,SAAS,EAAE,GAFI;AAGfC,IAAAA,YAAY,EAAE,EAHC;AAIfX,IAAAA,KAAK,EAAE,MAJQ;AAKfY,IAAAA,QAAQ,EAAE;AALK;AAbc,CAAlB,CAAf;;4BAsBeC,KAAK,CAACC,IAAN,CAAW1C,eAAX,C","sourcesContent":["import * as React from 'react'\nimport {\n  Modal,\n  StyleSheet,\n  TouchableWithoutFeedback,\n  useWindowDimensions,\n  View,\n  Platform,\n  StatusBar,\n} from 'react-native'\n\nimport { useTheme } from 'react-native-paper'\nimport DatePickerModalContent, {\n  DatePickerModalContentMultiProps,\n  DatePickerModalContentRangeProps,\n  DatePickerModalContentSingleProps,\n} from './DatePickerModalContent'\nimport { useHeaderBackgroundColor, useHeaderColorIsLight } from '../utils'\n\ninterface DatePickerModalProps {\n  visible: boolean\n  animationType?: 'slide' | 'fade' | 'none'\n  disableStatusBar?: boolean\n  disableStatusBarPadding?: boolean\n}\n\nexport interface DatePickerModalSingleProps\n  extends DatePickerModalContentSingleProps,\n    DatePickerModalProps {}\n\nexport interface DatePickerModalMultiProps\n  extends DatePickerModalContentMultiProps,\n    DatePickerModalProps {}\n\nexport interface DatePickerModalRangeProps\n  extends DatePickerModalContentRangeProps,\n    DatePickerModalProps {}\n\nexport function DatePickerModal(\n  props:\n    | DatePickerModalRangeProps\n    | DatePickerModalSingleProps\n    | DatePickerModalMultiProps\n) {\n  const theme = useTheme()\n  const dimensions = useWindowDimensions()\n  const {\n    visible,\n    animationType,\n    disableStatusBar,\n    disableStatusBarPadding,\n    ...rest\n  } = props\n  const animationTypeCalculated =\n    animationType ||\n    Platform.select({\n      web: 'none',\n      default: 'slide',\n    })\n\n  const isLight = useHeaderColorIsLight()\n  const headerBackgroundColor = useHeaderBackgroundColor()\n\n  return (\n    <View style={[StyleSheet.absoluteFill]} pointerEvents=\"box-none\">\n      <Modal\n        animationType={animationTypeCalculated}\n        transparent={true}\n        visible={visible}\n        onRequestClose={rest.onDismiss}\n        presentationStyle=\"overFullScreen\"\n        supportedOrientations={supportedOrientations}\n        //@ts-ignore\n        statusBarTranslucent={true}\n      >\n        <>\n          <TouchableWithoutFeedback onPress={rest.onDismiss}>\n            <View\n              style={[\n                StyleSheet.absoluteFill,\n                styles.modalBackground,\n                { backgroundColor: theme.colors.backdrop },\n              ]}\n            />\n          </TouchableWithoutFeedback>\n          <View\n            style={[StyleSheet.absoluteFill, styles.modalRoot]}\n            pointerEvents=\"box-none\"\n          >\n            <View\n              style={[\n                styles.modalContent,\n                { backgroundColor: theme.colors.surface },\n                dimensions.width > 650 ? styles.modalContentBig : null,\n              ]}\n            >\n              {disableStatusBar ? null : (\n                <StatusBar\n                  translucent={true}\n                  barStyle={isLight ? 'dark-content' : 'light-content'}\n                />\n              )}\n              {disableStatusBarPadding ? null : (\n                <View\n                  style={[\n                    {\n                      height: StatusBar.currentHeight,\n                      backgroundColor: headerBackgroundColor,\n                    },\n                  ]}\n                />\n              )}\n              <DatePickerModalContent\n                {...rest}\n                disableSafeTop={disableStatusBar}\n              />\n            </View>\n          </View>\n        </>\n      </Modal>\n    </View>\n  )\n}\nconst supportedOrientations: any = [\n  'portrait',\n  'portrait-upside-down',\n  'landscape',\n  'landscape-left',\n  'landscape-right',\n]\n\nconst styles = StyleSheet.create({\n  modalRoot: {\n    justifyContent: 'center',\n    alignItems: 'center',\n    flex: 1,\n  },\n  modalBackground: {\n    flex: 1,\n  },\n  modalContent: {\n    flex: 1,\n    width: '100%',\n  },\n  modalContentBig: {\n    maxWidth: 600,\n    maxHeight: 800,\n    borderRadius: 10,\n    width: '100%',\n    overflow: 'hidden',\n  },\n})\n\nexport default React.memo(DatePickerModal)\n"]}