@dnb/eufemia/cjs/components/date-picker/DatePickerFooter.js

DNB Eufemia Design System UI Library

"use strict";
"use client";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = require("react");
var _Button = _interopRequireDefault(require("../button/Button.js"));
var _DatePickerContext = _interopRequireDefault(require("./DatePickerContext.js"));
var _DatePickerCalc = require("./DatePickerCalc.js");
var _index = require("../../shared/index.js");
var _jsxRuntime = require("react/jsx-runtime");
var _span, _span2, _span3;
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
function DatePickerFooter({
  isRange,
  submitButtonText,
  cancelButtonText,
  resetButtonText,
  onSubmit,
  onCancel,
  onReset
}) {
  const {
    updateDates,
    previousDateProps,
    startDate,
    endDate,
    submittedDates,
    setSubmittedDates,
    dateFormat,
    props: contextProps
  } = (0, _react.useContext)(_DatePickerContext.default);
  const {
    showResetButton,
    showCancelButton,
    showSubmitButton
  } = contextProps;
  const {
    submitButtonText: submitButtonTextTranslation,
    cancelButtonText: cancelButtonTextTranslation,
    resetButtonText: resetButtonTextTranslation
  } = (0, _index.useTranslation)().DatePicker;
  const onSubmitHandler = (0, _react.useCallback)(args => {
    onSubmit === null || onSubmit === void 0 || onSubmit(args);
    setSubmittedDates({
      startDate,
      endDate
    });
  }, [onSubmit, startDate, endDate, setSubmittedDates]);
  const onCancelHandler = (0, _react.useCallback)(args => {
    updateDates(submittedDates, dates => {
      onCancel === null || onCancel === void 0 || onCancel({
        ...args,
        ...dates
      });
    });
  }, [updateDates, onCancel, submittedDates]);
  const onResetHandler = (0, _react.useCallback)(args => {
    const startDate = previousDateProps.startDate ? (0, _DatePickerCalc.convertStringToDate)(previousDateProps.startDate, {
      dateFormat
    }) : previousDateProps.date ? (0, _DatePickerCalc.convertStringToDate)(previousDateProps.date, {
      dateFormat
    }) : undefined;
    const endDate = previousDateProps.endDate ? (0, _DatePickerCalc.convertStringToDate)(previousDateProps.endDate, {
      dateFormat
    }) : startDate;
    updateDates({
      startDate,
      endDate
    }, dates => {
      onReset === null || onReset === void 0 || onReset({
        ...args,
        ...dates
      });
    });
  }, [dateFormat, updateDates, previousDateProps, onReset]);
  if (!isRange && !showSubmitButton && !showCancelButton && !showResetButton) {
    return null;
  }
  return (0, _jsxRuntime.jsxs)("div", {
    className: "dnb-date-picker__footer",
    children: [(isRange || showSubmitButton) && (0, _jsxRuntime.jsx)(_Button.default, {
      text: submitButtonText || submitButtonTextTranslation,
      onClick: onSubmitHandler,
      "data-testid": "submit"
    }) || _span || (_span = (0, _jsxRuntime.jsx)("span", {})), (0, _jsxRuntime.jsxs)("span", {
      children: [showResetButton && (0, _jsxRuntime.jsx)(_Button.default, {
        text: resetButtonText || resetButtonTextTranslation,
        icon: "reset",
        iconPosition: "left",
        variant: "tertiary",
        onClick: onResetHandler,
        "data-testid": "reset",
        right: "1rem"
      }) || _span2 || (_span2 = (0, _jsxRuntime.jsx)("span", {})), (isRange || showCancelButton) && (0, _jsxRuntime.jsx)(_Button.default, {
        text: cancelButtonText || cancelButtonTextTranslation,
        icon: "close",
        iconPosition: "left",
        variant: "tertiary",
        onClick: onCancelHandler,
        "data-testid": "cancel"
      }) || _span3 || (_span3 = (0, _jsxRuntime.jsx)("span", {}))]
    })]
  });
}
var _default = exports.default = DatePickerFooter;
//# sourceMappingURL=DatePickerFooter.js.map