import { _ as _defineProperty } from '../../defineProperty-CEd-kZQW.js';
import React__default from 'react';
import SelectMenu from '../../select-menu/index.js';
import MultiSelect from '../../multiselect/index.js';
import '../../extends-C4cduGrv.js';
import '../../objectWithoutProperties-TXwlfNxG.js';
import 'prop-types';
import '../../select-menu-BvA3x4Nf.js';
import '../../slicedToArray-BB-AwwkK.js';
import '../../floating-ui.react-cWPyyUrN.js';
import '../../typeof-CgC7Bq6K.js';
import '../../toConsumableArray-dKQYsfpV.js';
import '../../index-qSfOyGhk.js';
import 'react-dom';
import 'classnames';
import '../../_commonjsHelpers-_1FafXWI.js';
import '../../label/index.js';
import '@reach/visually-hidden';
import '../../ck-icon/index.js';
import '../../ck-icon/assets/icon-map/index.js';
import '../../icon/index.js';
import '@fortawesome/react-fontawesome';
import '../../icon/icons.js';
import '../../icon/library.js';
import '@fortawesome/fontawesome-svg-core';
import '@fortawesome/pro-solid-svg-icons';
import '@fortawesome/pro-light-svg-icons';
import '@fortawesome/free-brands-svg-icons';
import '../../portal/index.js';
import '../../use-rerender-once/index.js';
import '../../use-force-update/index.js';
import '../../select-menu/autocomplete.js';
import '../../multiselect/input.js';
import '../../checkbox/index.js';
import '../../multiselect/filter.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; }

function View(_ref) {
  var filter = _ref.filter;
  return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement("div", {
    className: "uppercase text-gray-700"
  }, "Subscribed to the"), /*#__PURE__*/React__default.createElement("div", {
    className: "uppercase text-gray-700"
  }, filter.subscribable_type));
}

var subscribableTypeOptions = [{
  value: "landing_page",
  label: "forms"
}, {
  value: "course",
  label: "sequences"
}, {
  value: "tag",
  label: "tags"
}, {
  value: "product",
  label: "products"
}]; // TODO: load from context

var subscribableOptions = [{
  value: 1,
  label: "Form 1"
}, {
  value: 2,
  label: "Form 2"
}, {
  value: 3,
  label: "Form 3"
}, {
  value: 4,
  label: "Form 4"
}, {
  value: 5,
  label: "Form 5"
}, {
  value: 6,
  label: "Form 6"
}, {
  value: 7,
  label: "Form 7"
}, {
  value: 8,
  label: "Form 8"
}, {
  value: 9,
  label: "Form 9"
}, {
  value: 10,
  label: "Form 10"
}, {
  value: 11,
  label: "Form 11"
}, {
  value: 12,
  label: "Form 12"
}, {
  value: 13,
  label: "Form 13"
}];
var SubscribedTo = {
  View: View,
  Edit: function Edit(_ref2) {
    var filter = _ref2.filter,
        setFilter = _ref2.setFilter;

    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)));
    };

    return /*#__PURE__*/React__default.createElement("div", null, /*#__PURE__*/React__default.createElement(SelectMenu, {
      className: "w-full mt-2",
      name: "subscribable_type",
      onChange: handleChange,
      value: filter.subscribable_type,
      options: subscribableTypeOptions
    }), /*#__PURE__*/React__default.createElement(MultiSelect, {
      className: "w-full mt-2",
      name: "subscribable_ids",
      onChange: handleChange,
      value: filter.subscribable_ids || [],
      options: subscribableOptions
    }));
  },
  icon: function icon() {
    return "";
  },
  label: function label() {
    return "subscribed to";
  },
  defaults: {
    subscribable_type: "form"
  }
};

export { SubscribedTo as default };
