"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.default = void 0;
var _react = _interopRequireDefault(require("react"));
var _faRotateLeft = require("@fortawesome/free-solid-svg-icons/faRotateLeft");
var _input = require("../input");
var _tooltip = require("../tooltip");
var _button = require("../button");
var _formField = require("../form-field");
var _jsxRuntime = require("react/jsx-runtime");
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
/** Represents the datetime text input, timezone, and reset button along the top of a single calendar */
function DateRangeSingleDatePickerInput(renderProps) {
  // The 3rd party react-datetime component known as `Datetime` does not filter out the props that it
  // receives to only those that <input /> tags accept. Because of this, renderProps contains
  // a mix of props that SHOULD be passed down to our <Input /> component with props that should NOT
  // be passed down.
  // Therefore, we must split renderProps up into two objects, one representing those props that should
  // be passed on to <Input /> and one representing props that are used only locally in this component.
  const locallySpecificPropKeys = ['resetEnabled', 'onReset', 'resetButtonTestId', 'autoFocus', 'resetText', 'utcSuffix', 'dateFormat', 'timeFormat'];
  const validationValues = (0, _formField.useDefaultValidationValues)();
  const [inputProps, locallySpecificProps] = Object.keys(renderProps).reduce((acc, propName) => {
    if (locallySpecificPropKeys.includes(propName)) {
      acc[1][propName] = renderProps[propName];
    } else {
      acc[0][propName] = renderProps[propName];
    }
    return acc;
  }, [{}, {}]);
  const {
    resetEnabled,
    onReset,
    resetButtonTestId,
    autoFocus
  } = locallySpecificProps;
  const resetHelperText = resetEnabled ? renderProps.resetText : '';
  const ariaAttrs = (0, _formField.getErrorAriaAttributes)({
    validity: inputProps.validity,
    validationValues,
    id: inputProps.fieldTestId
  });
  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
    className: "datetime-range-picker-input",
    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_input.Input, {
      ...inputProps,
      type: _formField.INPUT_TYPES.TEXT,
      autoFocus: autoFocus,
      placeholder: `${renderProps.dateFormat} ${renderProps.timeFormat || ''}`,
      "aria-label": renderProps.ariaLabel,
      ...ariaAttrs
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
      className: "timezone-label",
      children: renderProps.utcSuffix
    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_tooltip.Tooltip, {
      content: resetHelperText,
      placement: _tooltip.TOOLTIP_PLACEMENT_TYPES.TOP,
      delayType: _tooltip.TOOLTIP_DELAY_TYPES.NONE,
      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_button.Button, {
        accentType: _button.ACCENT_TYPES.COMMAND,
        className: "reset-datetime-value",
        isDisabled: !resetEnabled,
        onClick: onReset,
        "aria-label": renderProps.resetText,
        testId: resetButtonTestId,
        rightIcon: _faRotateLeft.faRotateLeft
      })
    })]
  });
}
var _default = exports.default = DateRangeSingleDatePickerInput;