txend-react-native-ui-datepicker/lib/commonjs/DateTimePicker.js

Customizable multi-date range datetime picker for React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireWildcard(require("react"));
var _utils = require("./utils");
var _CalendarContext = _interopRequireDefault(require("./CalendarContext"));
var _enums = require("./enums");
var _Calendar = _interopRequireDefault(require("./components/Calendar"));
var _dayjs = _interopRequireDefault(require("dayjs"));
var _localeData = _interopRequireDefault(require("dayjs/plugin/localeData"));
var _relativeTime = _interopRequireDefault(require("dayjs/plugin/relativeTime"));
var _localizedFormat = _interopRequireDefault(require("dayjs/plugin/localizedFormat"));
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
_dayjs.default.extend(_localeData.default);
_dayjs.default.extend(_relativeTime.default);
_dayjs.default.extend(_localizedFormat.default);
const DateTimePicker = ({
  value,
  mode = 'datetime',
  locale = 'en',
  minimumDate = null,
  maximumDate = null,
  firstDayOfWeek = 0,
  onValueChange = () => {},
  displayFullDays = false,
  headerButtonsPosition = 'around',
  headerContainerStyle,
  footerTextContainerStyle,
  footerContainerStyle,
  footerTextStyle,
  headerTextContainerStyle,
  headerTextStyle,
  headerButtonStyle,
  headerButtonColor,
  headerButtonSize,
  dayContainerStyle,
  todayContainerStyle,
  todayTextStyle,
  monthContainerStyle,
  yearContainerStyle,
  weekDaysContainerStyle,
  weekDaysTextStyle,
  calendarTextStyle,
  selectedTextStyle,
  selectedItemColor,
  timePickerContainerStyle,
  timePickerTextStyle,
  buttonPrevIcon,
  buttonNextIcon
}) => {
  _dayjs.default.locale(locale);
  const theme = {
    headerButtonsPosition,
    headerContainerStyle,
    headerTextContainerStyle,
    headerTextStyle,
    headerButtonStyle,
    headerButtonColor,
    headerButtonSize,
    footerTextContainerStyle,
    footerContainerStyle,
    footerTextStyle,
    dayContainerStyle,
    todayContainerStyle,
    todayTextStyle,
    monthContainerStyle,
    yearContainerStyle,
    weekDaysContainerStyle,
    weekDaysTextStyle,
    calendarTextStyle,
    selectedTextStyle,
    selectedItemColor,
    timePickerContainerStyle,
    timePickerTextStyle
  };
  const [state, dispatch] = (0, _react.useReducer)((prevState, action) => {
    switch (action.type) {
      case _enums.CalendarActionKind.SET_CALENDAR_VIEW:
        return {
          ...prevState,
          calendarView: action.payload
        };
      case _enums.CalendarActionKind.CHANGE_CURRENT_DATE:
        return {
          ...prevState,
          currentDate: action.payload
        };
      case _enums.CalendarActionKind.CHANGE_CURRENT_YEAR:
        return {
          ...prevState,
          currentYear: action.payload
        };
      case _enums.CalendarActionKind.CHANGE_SELECTED_DATE:
        return {
          ...prevState,
          selectedDate: action.payload
        };
      case _enums.CalendarActionKind.CHANGE_SELECTED_DATE_TO:
        return {
          ...prevState,
          selectedDateTo: action.payload
        };
    }
  }, {
    calendarView: mode === 'time' ? _enums.CalendarViews.time : _enums.CalendarViews.day,
    selectedDate: null,
    selectedDateTo: null,
    currentDate: value ? (0, _utils.getFormated)(value) : new Date(),
    currentYear: value ? (0, _utils.getDateYear)(value) : new Date().getFullYear()
  });
  (0, _react.useEffect)(() => {
    dispatch({
      type: _enums.CalendarActionKind.SET_CALENDAR_VIEW,
      payload: mode === 'time' ? _enums.CalendarViews.time : _enums.CalendarViews.day
    });
  }, [mode]);
  const actions = {
    setCalendarView: view => dispatch({
      type: _enums.CalendarActionKind.SET_CALENDAR_VIEW,
      payload: view
    }),
    onSelectDate: date => {
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_SELECTED_DATE,
        payload: date
      });
      // eslint-disable-next-line no-lone-blocks
      {
        date != null && dispatch({
          type: _enums.CalendarActionKind.CHANGE_CURRENT_DATE,
          payload: date
        });
      }
    },
    onSelectDateTo: (date, from) => {
      if (from != null) {
        onValueChange(from, date);
      }
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_SELECTED_DATE_TO,
        payload: date
      });
      // eslint-disable-next-line no-lone-blocks
      {
        date != null && dispatch({
          type: _enums.CalendarActionKind.CHANGE_CURRENT_DATE,
          payload: date
        });
      }
    },
    onSelectMonth: month => {
      const newDate = (0, _utils.getDate)(state.currentDate).month(month);
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_CURRENT_DATE,
        payload: (0, _utils.getFormated)(newDate)
      });
      dispatch({
        type: _enums.CalendarActionKind.SET_CALENDAR_VIEW,
        payload: _enums.CalendarViews.day
      });
    },
    onSelectYear: year => {
      const newDate = (0, _utils.getDate)(state.currentDate).year(year);
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_CURRENT_DATE,
        payload: (0, _utils.getFormated)(newDate)
      });
      dispatch({
        type: _enums.CalendarActionKind.SET_CALENDAR_VIEW,
        payload: _enums.CalendarViews.day
      });
    },
    onChangeMonth: month => {
      const newDate = (0, _utils.getDate)(state.currentDate).add(month, 'month');
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_CURRENT_DATE,
        payload: (0, _utils.getFormated)(newDate)
      });
    },
    onChangeYear: year => {
      dispatch({
        type: _enums.CalendarActionKind.CHANGE_CURRENT_YEAR,
        payload: year
      });
    }
  };
  return /*#__PURE__*/_react.default.createElement(_CalendarContext.default.Provider, {
    value: {
      ...state,
      ...actions,
      locale,
      mode,
      displayFullDays,
      minimumDate,
      maximumDate,
      firstDayOfWeek: firstDayOfWeek >= 0 && firstDayOfWeek <= 6 ? firstDayOfWeek : 0,
      theme
    }
  }, /*#__PURE__*/_react.default.createElement(_Calendar.default, {
    buttonPrevIcon: buttonPrevIcon,
    buttonNextIcon: buttonNextIcon
  }));
};
var _default = exports.default = DateTimePicker;
//# sourceMappingURL=DateTimePicker.js.map