import React, { forwardRef } from 'react';
import { faArrowRight } from '@fortawesome/free-solid-svg-icons/faArrowRight';
import { FontAwesomeIcon } from '../font-awesome-icon';
import DropdownMenuTrigger from '../dropdown-menu/dropdown-menu-trigger';
import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
const DateRangePickerButton = /*#__PURE__*/forwardRef(({
  onClick,
  isOpen,
  isDisabled,
  start,
  end,
  dateFormat,
  timeFormat,
  showTimeZoneSuffix,
  labelFormat,
  utcSuffix
}, ref) => {
  const triggerOptions = {
    triggerClassName: 'datetime-range-dropdown-button',
    triggerTestId: 'datetime-range-dropdown-button',
    triggerDynamicContent: () => /*#__PURE__*/_jsx(DateRangePickerButtonContent, {
      start: start,
      end: end,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      labelFormat: labelFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      utcSuffix: utcSuffix
    })
  };
  return /*#__PURE__*/_jsx(DropdownMenuTrigger, {
    ref: ref,
    onClick: onClick,
    isOpen: isOpen,
    isDisabled: isDisabled,
    triggerOptions: triggerOptions
  });
});
DateRangePickerButton.displayName = 'DateRangePickerButton';
function DateRangePickerButtonContent({
  start,
  end,
  dateFormat,
  timeFormat,
  showTimeZoneSuffix,
  labelFormat,
  utcSuffix
}) {
  const startLabelTestId = 'datetime-range-button-start-label';
  const endLabelTestId = 'datetime-range-button-end-label';
  if (!timeFormat) {
    return /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsx(DateRangePickerButtonDateLabel, {
        datetime: start,
        dateFormat: dateFormat,
        testId: startLabelTestId,
        labelFormat: labelFormat
      }), /*#__PURE__*/_jsx(StartToEndArrowSeparator, {}), /*#__PURE__*/_jsx(DateRangePickerButtonDateLabel, {
        datetime: end,
        dateFormat: dateFormat,
        testId: endLabelTestId,
        labelFormat: labelFormat
      })]
    });
  }
  if (!dateFormat) {
    return /*#__PURE__*/_jsxs(_Fragment, {
      children: [/*#__PURE__*/_jsx(DateRangePickerButtonTimeLabel, {
        datetime: start,
        timeFormat: timeFormat,
        testId: startLabelTestId,
        showTimeZoneSuffix: showTimeZoneSuffix,
        utcSuffix: utcSuffix
      }), /*#__PURE__*/_jsx(StartToEndArrowSeparator, {}), /*#__PURE__*/_jsx(DateRangePickerButtonTimeLabel, {
        datetime: end,
        timeFormat: timeFormat,
        testId: endLabelTestId,
        showTimeZoneSuffix: showTimeZoneSuffix,
        utcSuffix: utcSuffix
      })]
    });
  }
  return /*#__PURE__*/_jsxs(_Fragment, {
    children: [/*#__PURE__*/_jsx(DateRangePickerButtonDateAndTimeLabel, {
      datetime: start,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      testId: startLabelTestId,
      utcSuffix: utcSuffix
    }), /*#__PURE__*/_jsx(StartToEndArrowSeparator, {}), /*#__PURE__*/_jsx(DateRangePickerButtonDateAndTimeLabel, {
      datetime: end,
      dateFormat: dateFormat,
      timeFormat: timeFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      testId: endLabelTestId,
      utcSuffix: utcSuffix
    })]
  });
}
function StartToEndArrowSeparator() {
  return /*#__PURE__*/_jsx(FontAwesomeIcon, {
    icon: faArrowRight,
    className: "date-range-picker-arrow-icon"
  });
}
function DateRangePickerButtonDateAndTimeLabel({
  datetime,
  dateFormat,
  timeFormat,
  showTimeZoneSuffix,
  testId,
  utcSuffix
}) {
  return /*#__PURE__*/_jsxs("span", {
    "test-id": testId,
    children: [/*#__PURE__*/_jsx(DateRangePickerButtonDateLabel, {
      datetime: datetime,
      dateFormat: dateFormat
    }), /*#__PURE__*/_jsx(DateRangePickerButtonTimeLabel, {
      datetime: datetime,
      timeFormat: timeFormat,
      showTimeZoneSuffix: showTimeZoneSuffix,
      utcSuffix: utcSuffix
    })]
  });
}
function DateRangePickerButtonDateLabel({
  datetime,
  dateFormat,
  testId,
  labelFormat
}) {
  return /*#__PURE__*/_jsx("span", {
    className: "date-part",
    "test-id": testId,
    children: `${datetime.format(labelFormat || dateFormat)}`
  });
}
function DateRangePickerButtonTimeLabel({
  datetime,
  timeFormat,
  showTimeZoneSuffix = true,
  testId,
  utcSuffix
}) {
  const buttonText = showTimeZoneSuffix ? `${datetime.format(timeFormat)} ${utcSuffix}` : datetime.format(timeFormat);
  return /*#__PURE__*/_jsx("span", {
    className: "time-part",
    "test-id": testId,
    children: buttonText
  });
}
export default DateRangePickerButton;