reactstrap-date-picker/lib/DatePicker.cjs

Reactstrap based, zero dependencies, date picker

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DatePicker = void 0;
var _react = _interopRequireWildcard(require("react"));
var _useCheckProps = require("./util/useCheckProps");
var _InputGroup = require("./input/InputGroup");
var _InputOverlay = require("./input/InputOverlay");
var _InputHidden = require("./input/InputHidden");
var _InputClearButton = require("./input/InputClearButton");
var _InputControlInput = require("./input/InputControlInput");
var _useInputValues = require("./input/useInputValues");
var _useInputIds = require("./input/useInputIds");
var _useDayLabels = require("./input/useDayLabels");
var _Calendar = require("./calendar/Calendar");
var _useCalendarProps = require("./calendar/useCalendarProps");
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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 && {}.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; }
var _defaultDateFormat = () => {
  var language = typeof window !== 'undefined' && window.navigator ? (window.navigator.userLanguage || window.navigator.language || '').toLowerCase() : '';
  var dateFormat = !language || language === 'en-us' ? 'MM/DD/YYYY' : 'DD/MM/YYYY';
  return dateFormat;
};
var DEFAULT_DAY_LABELS = ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'];
var DEFAULT_MONTH_LABELS = ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'];
var DatePickerBase = (props, ref) => {
  var {
    // Global props
    value,
    defaultValue,
    id,
    name,
    dateFormat = _defaultDateFormat(),
    minDate,
    maxDate,
    clearButtonElement = '×',
    showClearButton = true,
    // Event props
    onInvalid,
    onChange,
    onClear,
    onBlur,
    onFocus,
    // Input Group props
    size,
    valid,
    invalid,
    customInputGroup,
    // Input props
    autoComplete = 'on',
    autoFocus = false,
    disabled = false,
    noValidate = false,
    placeholder,
    required,
    className,
    style = undefined /* {
                      width: '100%'
                      } */,
    inputRef,
    customControl,
    children,
    // Calendar props
    // target,
    calendarContainer,
    dayLabels = DEFAULT_DAY_LABELS,
    monthLabels = DEFAULT_MONTH_LABELS,
    weekStartsOn,
    showWeeks = false,
    previousButtonElement = '<',
    nextButtonElement = '>',
    pickMonthElement = undefined,
    showTodayButton = false,
    todayButtonLabel = 'Today',
    roundedCorners = false,
    cellPadding = '5px',
    calendarPlacement = 'bottom'
  } = props;
  var propError = (0, _useCheckProps.useCheckProps)(value, defaultValue);
  if (propError != undefined) {
    throw new Error(propError);
  }
  var [hiddenInputRef, overlayContainerRef, popoverRef, controlInputRef, open, placement, handleFocus, handleBlur] = (0, _useCalendarProps.useCalendarProps)(calendarPlacement, inputRef, autoFocus, onBlur, onFocus);
  var [innerValue, inputValue, displayDate, selectedDate, handleClear, handleInputChange, handleChangeMonth, handleChangeDate, handleBadInputOnBlur] = (0, _useInputValues.useInputValues)(controlInputRef, value, defaultValue, minDate, maxDate, dateFormat, onClear, onChange);
  var [groupInputId, hiddenInputId, controlInputId, overlayId] = (0, _useInputIds.useInputIds)(id, name, customControl);
  (0, _react.useImperativeHandle)(ref, () => ({
    getValue: () => {
      return selectedDate ? selectedDate.toISOString() : null;
    },
    getFormattedValue: () => {
      return displayDate ? inputValue : null;
    },
    getNode: () => controlInputRef === null || controlInputRef === void 0 ? void 0 : controlInputRef.current
  })); //, [controlInputRef, displayDate, inputValue, selectedDate]))

  var fixedDayLabels = (0, _useDayLabels.useFixedDayLabels)(dayLabels, weekStartsOn);
  var handleChangeDateAndBlur = nSelectedDate => {
    handleChangeDate(nSelectedDate);
    handleBlur(true);
  };
  return /*#__PURE__*/_react.default.createElement(_InputGroup.InputGroup, {
    customInputGroup: customInputGroup,
    size: size,
    inputId: groupInputId
  }, /*#__PURE__*/_react.default.createElement(_InputControlInput.InputControlInput, {
    controlId: controlInputId,
    customControl: customControl,
    value: inputValue || '',
    required: required,
    placeholder: placeholder || '',
    inputRef: controlInputRef,
    disabled: disabled,
    className: className,
    style: style,
    autoFocus: autoFocus,
    autoComplete: autoComplete,
    onInvalid: onInvalid,
    noValidate: noValidate,
    valid: valid,
    invalid: invalid,
    onFocus: () => handleFocus(),
    onBlur: event => {
      handleBadInputOnBlur();
      handleBlur(event);
    },
    onChange: () => handleInputChange()
  }), /*#__PURE__*/_react.default.createElement(_InputOverlay.InputOverlay, {
    overlayContainerRef: overlayContainerRef,
    oid: overlayId
  }, overlayContainerRef.current == undefined ? null : /*#__PURE__*/_react.default.createElement(_Calendar.Calendar, {
    popoverRef: popoverRef,
    placement: placement,
    open: open,
    container: calendarContainer || overlayContainerRef,
    target: controlInputId,
    previousButtonElement: previousButtonElement,
    nextButtonElement: nextButtonElement,
    pickMonthElement: pickMonthElement,
    displayDate: displayDate,
    minDate: minDate,
    maxDate: maxDate,
    onChangeMonth: newDisplayDate => handleChangeMonth(newDisplayDate),
    monthLabels: monthLabels,
    cellPadding: cellPadding,
    selectedDate: selectedDate,
    onChange: newSelectedDate => handleChangeDateAndBlur(newSelectedDate),
    dayLabels: fixedDayLabels,
    weekStartsOn: weekStartsOn,
    showTodayButton: showTodayButton,
    todayButtonLabel: todayButtonLabel,
    roundedCorners: roundedCorners,
    showWeeks: showWeeks
  })), /*#__PURE__*/_react.default.createElement(_InputHidden.InputHidden, {
    inputId: hiddenInputId,
    name: name,
    value: innerValue || '',
    formattedValue: innerValue ? inputValue : '',
    hiddenInputRef: hiddenInputRef
  }), showClearButton && !customControl ? /*#__PURE__*/_react.default.createElement(_InputClearButton.InputClearButton, {
    inputValue: inputValue,
    disabled: disabled,
    clearButtonElement: clearButtonElement,
    onClick: () => handleClear()
  }) : null, children);
};
var DatePicker = exports.DatePicker = /*#__PURE__*/(0, _react.forwardRef)(DatePickerBase);