@activecollab/components/dist/cjs/components/SelectDate/DatePickerForm.js

ActiveCollab Components

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.DatePickerForm = void 0;
var _react = _interopRequireWildcard(require("react"));
var _Styles = require("./Styles");
var _DatePicker = require("../DatePicker/DatePicker");
var _IconButton = require("../IconButton");
var _CancelCross = _interopRequireDefault(require("../Icons/collection/CancelCross"));
var _Tooltip = require("../Tooltip/Tooltip");
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 _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 && 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; }
var DatePickerForm = exports.DatePickerForm = function DatePickerForm(_ref) {
  var mode = _ref.mode,
    _ref$saveButtonText = _ref.saveButtonText,
    saveButtonText = _ref$saveButtonText === void 0 ? "Save" : _ref$saveButtonText,
    _ref$cancelButtonText = _ref.cancelButtonText,
    cancelButtonText = _ref$cancelButtonText === void 0 ? "Cancel" : _ref$cancelButtonText,
    _ref$clearButtonText = _ref.clearButtonText,
    clearButtonText = _ref$clearButtonText === void 0 ? "Clear" : _ref$clearButtonText,
    onSave = _ref.onSave,
    onCancel = _ref.onCancel,
    onClear = _ref.onClear,
    _ref$dateRequired = _ref.dateRequired,
    dateRequired = _ref$dateRequired === void 0 ? false : _ref$dateRequired,
    _ref$firstDayOfWeek = _ref.firstDayOfWeek,
    firstDayOfWeek = _ref$firstDayOfWeek === void 0 ? 0 : _ref$firstDayOfWeek,
    selectedDays = _ref.selectedDays,
    _ref$selectionMode = _ref.selectionMode,
    selectionMode = _ref$selectionMode === void 0 ? "custom" : _ref$selectionMode,
    onChange = _ref.onChange,
    onDayClick = _ref.onDayClick,
    onMonthChange = _ref.onMonthChange,
    month = _ref.month,
    _ref$disabledSaveButt = _ref.disabledSaveButton,
    disabledSaveButton = _ref$disabledSaveButt === void 0 ? false : _ref$disabledSaveButt,
    modifiers = _ref.modifiers,
    renderDay = _ref.renderDay;
  var handleOnKeyDown = (0, _react.useCallback)(function (e) {
    if (e.key === "Enter" && typeof onSave === "function") {
      onSave();
    } else if ((e.key === "Esc" || e.key === "Escape") && typeof onCancel === "function") {
      onCancel(e);
    }
  }, [onSave, onCancel]);
  return /*#__PURE__*/_react.default.createElement("div", {
    onKeyDown: handleOnKeyDown,
    tabIndex: -1,
    className: "date-picker-form"
  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledSelectDateDatePicker, null, /*#__PURE__*/_react.default.createElement(_DatePicker.DatePicker, {
    month: month,
    onMonthChange: onMonthChange,
    onChange: onChange,
    onDayClick: onDayClick,
    selectedDays: selectedDays,
    selectionMode: selectionMode,
    dateRequired: dateRequired,
    firstDayOfWeek: firstDayOfWeek,
    modifiers: modifiers,
    renderDay: renderDay
  })), mode === "atomic" || !dateRequired ? /*#__PURE__*/_react.default.createElement(_Styles.StyledSelectDateFooter, {
    className: "date-picker-footer",
    $mode: mode
  }, mode === "atomic" ? /*#__PURE__*/_react.default.createElement(_Styles.StyledSelectDateButtons, {
    className: "date-picker-buttons"
  }, /*#__PURE__*/_react.default.createElement(_Styles.StyledButtonSave, {
    size: "small",
    variant: "primary",
    onClick: onSave,
    disabled: disabledSaveButton
  }, saveButtonText), /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
    title: cancelButtonText,
    popperTooltipStyle: {
      zIndex: 1301
    }
  }, /*#__PURE__*/_react.default.createElement(_IconButton.IconButton, {
    size: "small",
    variant: "text gray",
    onClick: onCancel
  }, /*#__PURE__*/_react.default.createElement(_CancelCross.default, null))), !dateRequired ? /*#__PURE__*/_react.default.createElement(_Styles.StyledButtonClose, {
    size: "small",
    onClick: onClear,
    variant: "text gray"
  }, clearButtonText) : null) : !dateRequired && /*#__PURE__*/_react.default.createElement(_Styles.StyledButtonCloseColored, {
    size: "small",
    onClick: onClear,
    variant: "text colored"
  }, clearButtonText)) : null);
};
DatePickerForm.displayName = "DatePickerForm";
//# sourceMappingURL=DatePickerForm.js.map