import _objectSpread from "@babel/runtime/helpers/objectSpread2";
import _toConsumableArray from "@babel/runtime/helpers/toConsumableArray";
import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
import _defineProperty from "@babel/runtime/helpers/defineProperty";

/* eslint import/no-webpack-loader-syntax: "off" */

/* eslint import/no-unresolved: "off" */
import '!style-loader!css-loader!react-dates/lib/css/_datepicker.css';
import '!style-loader!css-loader!./style.css';
import moment from 'moment';
import 'moment/locale/fi';
import 'moment/locale/sv';
import { useEffect, useState } from 'react';
import { DateRangePicker } from 'react-dates';
import 'react-dates/initialize';
import { defineMessage, FormattedMessage, useIntl } from 'react-intl';
import { add, sub } from 'date-fns';
import { makeStyles } from '@material-ui/core/styles';
import Button from '@material-ui/core/Button';
import { mapValues } from 'lodash';
import { DateRangePickerPhrases } from '../../../../lib/configToSchemas/types/date/phrases';
import { getAriaLabel } from '../../../utils.js';
import { jsx as _jsx } from "react/jsx-runtime";
import { Fragment as _Fragment } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var useStyles = makeStyles(function (theme) {
  return {
    button: _defineProperty({
      marginRight: theme.spacing(1),
      marginLeft: theme.spacing(1)
    }, theme.breakpoints.down('xs'), {
      marginTop: theme.spacing(1),
      marginLeft: '0px'
    }),
    dateBox: _defineProperty({
      display: 'flex',
      alignItems: 'center'
    }, theme.breakpoints.down('xs'), {
      flexDirection: 'column',
      alignItems: 'start',
      '& input::placeholder': {
        fontSize: '13px'
      }
    })
  };
});

function DateRangePickerField(props) {
  var _uiSchema$uiOptions, _uiSchema$uiOptions2, _uiSchema$uiOptions2$;

  var idSchema = props.idSchema,
      onChange = props.onChange,
      schema = props.schema,
      formData = props.formData,
      uiSchema = props.uiSchema,
      required = props.required,
      rawErrors = props.rawErrors;

  var _uiSchema$uiOptions$ = (_uiSchema$uiOptions = uiSchema['ui:options']) === null || _uiSchema$uiOptions === void 0 ? void 0 : _uiSchema$uiOptions.element,
      description = _uiSchema$uiOptions$.description,
      help = _uiSchema$uiOptions$.help;

  var intl = useIntl();

  var _useState = useState(),
      _useState2 = _slicedToArray(_useState, 2),
      focusedInput = _useState2[0],
      setFocusedInput = _useState2[1];

  var _props$uiSchema$uiOp = props.uiSchema['ui:options'],
      _props$uiSchema$uiOp$ = _props$uiSchema$uiOp.element,
      disableEnd = _props$uiSchema$uiOp$.disableEnd,
      disableStart = _props$uiSchema$uiOp$.disableStart,
      dateFormat = _props$uiSchema$uiOp.dateFormat;

  var handleFocusChange = function handleFocusChange(focusedInput) {
    return setFocusedInput(focusedInput);
  };

  var locale = intl.locale;
  var language = intl.locale.split('-')[0] !== 'en';
  var classes = useStyles();
  useEffect(function () {
    moment.locale(locale);
  }, [locale]);

  var earliestEndDate = function earliestEndDate() {
    if ((disableEnd === null || disableEnd === void 0 ? void 0 : disableEnd.disableBefore.type) === 'noValue' && (disableStart === null || disableStart === void 0 ? void 0 : disableStart.disableBefore.type) !== 'noValue') {
      return beforeDay(disableStart.disableBefore);
    } else if ((disableEnd === null || disableEnd === void 0 ? void 0 : disableEnd.disableBefore.type) !== 'noValue' && (disableStart === null || disableStart === void 0 ? void 0 : disableStart.disableBefore.type) === 'noValue') {
      return beforeDay(disableEnd.disableBefore);
    } else if (beforeDay(disableStart.disableBefore) > beforeDay(disableEnd.disableBefore)) {
      return beforeDay(disableStart.disableBefore);
    } else {
      return beforeDay(disableEnd.disableBefore);
    }
  };

  var beforeDay = function beforeDay(date) {
    if (date.type !== undefined) {
      return date.type !== 'date' ? sub(new Date(), _defineProperty({}, date.type, date.numberValue)) : new Date(date.dateValue);
    } else {
      return null;
    }
  };

  var afterDay = function afterDay(date) {
    if (date.type !== undefined) {
      return date.type !== 'date' ? add(new Date(), _defineProperty({}, date.type, date.numberValue)) : new Date(date.dateValue);
    } else {
      return null;
    }
  };

  var ariaLabel = getAriaLabel(uiSchema === null || uiSchema === void 0 ? void 0 : (_uiSchema$uiOptions2 = uiSchema['ui:options']) === null || _uiSchema$uiOptions2 === void 0 ? void 0 : (_uiSchema$uiOptions2$ = _uiSchema$uiOptions2.element) === null || _uiSchema$uiOptions2$ === void 0 ? void 0 : _uiSchema$uiOptions2$.label, uiSchema === null || uiSchema === void 0 ? void 0 : uiSchema['ui:options'], required, intl.formatMessage({
    id: "l4R23W",
    defaultMessage: [{
      "type": 0,
      "value": "Pakollinen kenttä"
    }]
  }));
  var ariaArray = [ariaLabel];

  if (description) {
    ariaArray.push(description);
  }

  if (help) {
    ariaArray.push(help);
  }

  if (rawErrors && rawErrors.length > 0) {
    ariaArray.push.apply(ariaArray, _toConsumableArray(rawErrors));
  }

  return /*#__PURE__*/_jsxs("div", {
    className: classes.dateBox,
    children: [/*#__PURE__*/_jsx(DateRangePicker, _objectSpread(_objectSpread({
      onDatesChange: function onDatesChange(_ref) {
        var startDate = _ref.startDate,
            endDate = _ref.endDate;
        return (startDate || endDate) && onChange({
          start: startDate === null || startDate === void 0 ? void 0 : startDate.format('YYYY-MM-DD'),
          end: endDate === null || endDate === void 0 ? void 0 : endDate.format('YYYY-MM-DD')
        });
      },
      onFocusChange: handleFocusChange,
      focusedInput: focusedInput,
      small: true,
      numberOfMonths: 1,
      "aria-label": ariaLabel,
      screenReaderInputMessage: ariaArray.join(', '),
      displayFormat: dateFormat !== null && dateFormat !== void 0 ? dateFormat : 'D.M.yyyy',
      disabled: schema.readOnly || uiSchema.readonly
    }, language ? {
      phrases: mapValues(DateRangePickerPhrases, function (message) {
        return intl.formatMessage(message);
      })
    } : {}), {}, {
      hideKeyboardShortcutsPanel: true,
      startDate: (formData === null || formData === void 0 ? void 0 : formData.start) === undefined ? null : moment(formData === null || formData === void 0 ? void 0 : formData.start),
      startDateId: idSchema.start.$id,
      startDatePlaceholderText: intl.formatMessage({
        id: "yFga8M",
        defaultMessage: [{
          "type": 0,
          "value": "Alkupäivä"
        }]
      }),
      endDate: (formData === null || formData === void 0 ? void 0 : formData.end) === undefined ? null : moment(formData === null || formData === void 0 ? void 0 : formData.end),
      endDateId: idSchema.end.$id,
      endDatePlaceholderText: intl.formatMessage({
        id: "l26Isu",
        defaultMessage: [{
          "type": 0,
          "value": "Loppupäivä"
        }]
      }),
      isOutsideRange: function isOutsideRange(m) {
        return focusedInput === 'startDate' ? (disableStart === null || disableStart === void 0 ? void 0 : disableStart.disableBefore.type) !== 'noValue' && m.isBefore(beforeDay(disableStart.disableBefore), 'day') || (disableStart === null || disableStart === void 0 ? void 0 : disableStart.disableAfter.type) !== 'noValue' && m.isAfter(afterDay(disableStart.disableAfter), 'day') : ((disableEnd === null || disableEnd === void 0 ? void 0 : disableEnd.disableBefore.type) !== 'noValue' || (disableStart === null || disableStart === void 0 ? void 0 : disableStart.disableBefore.type) !== 'noValue') && m.isBefore(earliestEndDate(), 'day') || (disableEnd === null || disableEnd === void 0 ? void 0 : disableEnd.disableAfter.type) !== 'noValue' && m.isAfter(afterDay(disableEnd.disableAfter), 'day');
      }
    })), (formData === null || formData === void 0 ? void 0 : formData.start) || (formData === null || formData === void 0 ? void 0 : formData.end) ? /*#__PURE__*/_jsx(Button, {
      variant: "contained",
      color: "secondary",
      size: "small",
      className: classes.button,
      onClick: function onClick(value) {
        return value && onChange({
          start: undefined,
          end: undefined
        });
      },
      children: /*#__PURE__*/_jsx(FormattedMessage, {
        id: "fVRBN+",
        defaultMessage: [{
          "type": 0,
          "value": "Tyhjennä"
        }]
      })
    }) : /*#__PURE__*/_jsx(_Fragment, {})]
  });
}

export default (function (_ref2) {
  var _reviewProps$dateForm;

  var _ref2$config = _ref2.config,
      disableBefore = _ref2$config.disableBefore,
      disableAfter = _ref2$config.disableAfter,
      required = _ref2$config.required,
      list = _ref2$config.list,
      reviewProps = _ref2.reviewProps;
  return {
    schema: _objectSpread(_objectSpread(_objectSpread({
      type: 'object'
    }, required ? {
      required: ['start', 'end']
    } : undefined), list ? {
      "default": {}
    } : undefined), {}, {
      properties: {
        start: {
          format: 'date',
          type: 'string'
        },
        end: {
          format: 'date',
          type: 'string'
        }
      }
    }),
    uiSchema: {
      'ui:field': DateRangePickerField,
      'ui:options': {
        disableBefore: disableBefore,
        disableAfter: disableAfter,
        dateFormat: reviewProps === null || reviewProps === void 0 ? void 0 : (_reviewProps$dateForm = reviewProps.dateFormat) === null || _reviewProps$dateForm === void 0 ? void 0 : _reviewProps$dateForm.replaceAll('d', 'D')
      }
    }
  };
});
export var name = defineMessage({
  id: "G3a8oG",
  defaultMessage: [{
    "type": 0,
    "value": "Päivämäärähaarukka"
  }]
});
export var elementType = 'field';
//# sourceMappingURL=index.js.map