import { _ as _slicedToArray } from '../slicedToArray-5b664d46.js';
import React__default from 'react';
import Popover, { usePopover, PopoverButton, PopoverContent } from '../popover/index.js';
import EditFilter from './edit-filter.js';
import useKey from './use-key.js';
import '../defineProperty-18999f8e.js';
import '../extends-e61fd370.js';
import '../objectWithoutProperties-72d23964.js';
import 'prop-types';
import '../portal/index.js';
import 'react-dom';
import '../use-rerender-once/index.js';
import '../use-force-update/index.js';
import 'classnames';
import '../index-4e01772f.js';
import '../typeof-6c6d8d7a.js';
import '../toConsumableArray-f2f53597.js';
import '../index-81a9bdac.js';
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-2b54f757.js';
import '../utils.esm-514fad91.js';
import '../warning-ed2bf294.js';
import '../portal.esm-613949dc.js';
import '@reach/visually-hidden';
import '../button/button-group.js';
import '../use-previous/index.js';
import './filter-type-context.js';
import '../select-menu/index.js';
import '../select-menu-e9eb09bc.js';
import '../_commonjsHelpers-57e89916.js';
import '../label/index.js';
import '../select-menu/autocomplete.js';

var initialValue = {
  type: "all_subscribers"
};

function AddFilter(_ref) {
  var onSave = _ref.onSave;
  var popover = usePopover();

  var _useKey = useKey(),
      _useKey2 = _slicedToArray(_useKey, 2),
      key = _useKey2[0],
      resetKey = _useKey2[1];

  var handleSave = function handleSave(filter) {
    onSave(filter);
    popover.hide();
    resetKey();
  };

  var handleCancel = function handleCancel() {
    popover.hide();
    resetKey();
  };

  return /*#__PURE__*/React__default.createElement(Popover, {
    label: "add-filter",
    arrow: false,
    popover: popover
  }, /*#__PURE__*/React__default.createElement(PopoverButton, {
    is: "secondary",
    className: "w-full"
  }, "Add Filter"), /*#__PURE__*/React__default.createElement(PopoverContent, {
    style: {
      top: "-72px",
      bottom: "auto"
    },
    className: "outline-none z-10",
    "aria-label": "Welcome"
  }, /*#__PURE__*/React__default.createElement(EditFilter, {
    key: key,
    filter: initialValue,
    onSave: handleSave,
    onCancel: handleCancel
  })));
}

export { AddFilter as default };
