import { _ as _defineProperty } from '../../defineProperty-CEd-kZQW.js';
import React__default from 'react';
import SelectMenu from '../../select-menu/index.js';
import DatePickerInput from '../../date-picker-input/index.js';
import { p as parseISO, f as format } from '../../react-datepicker-CUT4ZgZ-.js';
import '../../extends-C4cduGrv.js';
import '../../objectWithoutProperties-TXwlfNxG.js';
import 'prop-types';
import '../../select-menu-Cz9N8-dh.js';
import '../../slicedToArray-BB-AwwkK.js';
import '../../index-Cqcn5RnV.js';
import '../../typeof-CgC7Bq6K.js';
import '../../toConsumableArray-dKQYsfpV.js';
import '../../index-qSfOyGhk.js';
import 'react-dom';
import 'classnames';
import '../../icon/assets/icon-map/index.js';
import '../../social-icon/index.js';
import '@fortawesome/react-fontawesome';
import '../../social-icon/icons.js';
import '../../social-icon/library.js';
import '@fortawesome/fontawesome-svg-core';
import '@fortawesome/free-solid-svg-icons';
import '@fortawesome/free-brands-svg-icons';
import '../../tooltip/index.js';
import '../../auto-id.esm-Cly76abB.js';
import '../../utils.esm-CKyxlHOy.js';
import '../../warning-s9zGJbnw.js';
import '../../portal.esm-CuKGPwhL.js';
import '@reach/visually-hidden';
import '../../portal/index.js';
import '../../use-rerender-once/index.js';
import '../../use-force-update/index.js';
import '../../button/button-group.js';
import '../../inject-css-BqVV5N0s.js';
import '../../_commonjsHelpers-_1FafXWI.js';
import '../../label/index.js';
import '../../select-menu/autocomplete.js';
import '../../Popper-CsEj9W8C.js';
import '../../usePopper-DMhEmCof.js';

function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }

function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
var comparisonOptions = [{
  value: "before",
  label: "before"
}, {
  value: "after",
  label: "after"
}];

function View(_ref) {
  var filter = _ref.filter;
  var comparisonOption = comparisonOptions.find(function (comparisonOption) {
    return comparisonOption.value === filter.comparison;
  });
  var date;

  try {
    date = format(parseISO(filter.date), "MMM d, h:mma");
  } catch (err) {
    date = "Invalid date";
  }

  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
    className: "uppercase text-gray-700 text-xs font-normal"
  }, "Subscribers who"), /*#__PURE__*/React__default.createElement("div", {
    className: "text-blue-500 font-semibold"
  }, "subscribed"), /*#__PURE__*/React__default.createElement("div", {
    className: "uppercase text-gray-700 text-xs font-normal"
  }, "".concat(comparisonOption.label, " ").concat(date)));
}

var SubscriptionDate = {
  View: View,
  Edit: function Edit(_ref2) {
    var filter = _ref2.filter,
        setFilter = _ref2.setFilter;
    var value = filter.date ? parseISO(filter.date) : null;

    var handleChange = function handleChange(event) {
      var _event$target = event.target,
          name = _event$target.name,
          value = _event$target.value;
      setFilter(_objectSpread(_objectSpread({}, filter), {}, _defineProperty({}, name, value)));
    };

    var handleDateChange = function handleDateChange(event) {
      var date = event.target.value;
      setFilter(_objectSpread(_objectSpread({}, filter), {}, {
        date: date.toJSON()
      }));
    };

    return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(SelectMenu, {
      className: "w-full mt-2",
      name: "comparison",
      onChange: handleChange,
      value: filter.comparison,
      options: comparisonOptions
    }), /*#__PURE__*/React__default.createElement(DatePickerInput, {
      className: "w-full mt-2",
      name: "value",
      onChange: handleDateChange,
      selected: value
    }));
  },
  icon: function icon() {
    return "calendar";
  },
  label: function label() {
    return "subscription date";
  },
  defaults: {
    comparison: "before",
    action_type: "subscribed"
  }
};

export { SubscriptionDate as default };
