import './_commonjsHelpers-0c4b6f40.js';
import './core.get-iterator-method-86d4db69.js';
import './_library-528f1934.js';
import './_object-pie-33c40e79.js';
import { _ as _extends } from './extends-a4230287.js';
import './_object-sap-8b8ea5a9.js';
import { _ as _inherits, a as _classCallCheck, b as _possibleConstructorReturn, c as _Object$getPrototypeOf, d as _createClass } from './inherits-91a2c374.js';
import './define-property-6d26cb48.js';
import './web.dom.iterable-f8f967cd.js';
import { _ as _typeof } from './typeof-f1b7564e.js';
import './_is-array-4df618a6.js';
import React from 'react';
import PropTypes from 'prop-types';
import { m as moment } from './moment-b6f49411.js';
import 'react-dom';
import './slicedToArray-67a08c9c.js';
import './index-51a80699.js';
import urlFor from './urlFor.js';
import { L as LazyLoad } from './index-6c12bdd5.js';
import { DropdownButton } from 'react-bootstrap';
import { InstantSearch, Configure, SearchBox, RefinementList, ClearRefinements, Hits, Pagination } from 'react-instantsearch-dom';

var HitComponent = function HitComponent(hits, props) {
  var propsObj = {
    styles: props.deckStyles,
    client: props.sanityClient,
    siteType: props.siteType,
    defaultImage: props.defaultImage,
    hit: hits.hit,
    variant: props.variant
  };
  var styles = propsObj.styles,
      client = propsObj.client,
      hit = propsObj.hit,
      siteType = propsObj.siteType,
      defaultImage = propsObj.defaultImage,
      variant = propsObj.variant;

  var dateFormat = siteType === 'pharmsci' ? 'MMMM DD, YYYY' : 'MMMM Do YYYY';

  return React.createElement(
    'div',
    { key: hit.url, className: 'hitResult ' + styles.article },
    hit.thumbnail && hit.thumbnail.asset ? imageDiv(hit, styles, client, siteType, defaultImage, variant) : !hit.thumbnail && siteType !== 'pharmsci' ? imageDiv(hit, styles, client, siteType, defaultImage, variant) : null,
    React.createElement(
      'div',
      { className: styles.info, style: props.variant === 'right' ? { padding: '0 1rem 0 0' } : { padding: ' 0 0 0 1rem' } },
      React.createElement(
        'a',
        { href: '/view/' + hit.url },
        React.createElement(
          'h2',
          null,
          hit.title
        )
      ),
      hit.pubDateSort && React.createElement(
        'p',
        { className: styles.published },
        moment(hit.pubDateSort).format('' + dateFormat)
      ),
      hit.authorMapping && hit.authorMapping.length > 0 && React.createElement(
        'p',
        { className: styles.author },
        hit.authorMapping.map(function (author, index) {
          return React.createElement(
            'span',
            { key: author + '_' + index },
            author.displayName
          );
        })
      ),
      hit.summary && React.createElement('p', { dangerouslySetInnerHTML: { __html: hit.summary }, className: styles.summary })
    )
  );
};

var imageDiv = function imageDiv(hit, styles, client, siteType, defaultImage, variant) {
  return React.createElement(
    'a',
    { href: '/view/' + hit.url, style: variant === 'right' ? { flexDirection: 'row-reverse' } : {} },
    React.createElement(
      'div',
      { className: styles.thumb },
      React.createElement(
        'figure',
        null,
        React.createElement(
          LazyLoad,
          { once: true },
          React.createElement('img', {
            src: hit.thumbnail && hit.thumbnail.asset ? urlFor({ client: client, source: hit.thumbnail }) : hit.thumbnail && _typeof(hit.thumbnail === 'string') ? hit.thumbnail : defaultImage
          })
        )
      )
    )
  );
};

var nowTimestamp = Date.now();

var AlgoliaSearch = function (_React$Component) {
  _inherits(AlgoliaSearch, _React$Component);

  function AlgoliaSearch() {
    _classCallCheck(this, AlgoliaSearch);

    return _possibleConstructorReturn(this, (AlgoliaSearch.__proto__ || _Object$getPrototypeOf(AlgoliaSearch)).apply(this, arguments));
  }

  _createClass(AlgoliaSearch, [{
    key: 'render',
    value: function render() {
      var _this2 = this;

      return React.createElement(
        React.Fragment,
        null,
        React.createElement(
          InstantSearch,
          _extends({
            searchClient: this.props.searchClient,
            resultsState: this.props.resultsState,
            onSearchStateChange: this.props.onSearchStateChange,
            searchState: this.props.searchState,
            createURL: this.props.createURL,
            indexName: this.props.indexName,
            onSearchParameters: this.props.onSearchParameters
          }, this.props),
          React.createElement(Configure, { hitsPerPage: this.props.hitsPerPage || 20, filters: 'pubDateSort <= ' + nowTimestamp }),
          React.createElement(
            'div',
            { className: 'd-flex align-items-center' },
            this.props.searchIconUrl && React.createElement(
              'div',
              { className: 'custom-search-img mr-2' },
              React.createElement('img', { className: 'img-fluid', src: this.props.searchIconUrl, alt: 'search icon' })
            ),
            React.createElement(
              'div',
              { style: { flex: '1 1 auto' } },
              React.createElement(SearchBox, null)
            )
          ),
          this.props.refinementAttributes && React.createElement(
            'div',
            { className: 'search_refinement' },
            this.props.refinementAttributes.map(function (item, index) {
              return React.createElement(
                DropdownButton,
                { align: 'end', title: item.title },
                React.createElement(RefinementList, { searchable: true, showMore: item.showMore, limit: item.limit, showMoreLimit: item.showMoreLimit, attribute: item.attribute })
              );
            }),
            React.createElement(ClearRefinements, null)
          ),
          React.createElement(
            'div',
            { className: 'AlgoliaResults' },
            React.createElement(Hits, { hitComponent: function hitComponent(hit) {
                return HitComponent(hit, _this2.props);
              } })
          ),
          React.createElement(Pagination, null)
        ),
        React.createElement(
          'style',
          { jsx: 'true' },
          '\n          .hitResult {\n            display: flex;\n            flex-direction: row;\n            justify-content: space-between;\n            margin-bottom: 1rem;\n            border-bottom: 1px solid #00000024;\n            padding: 1rem 0;\n          }\n          .hitResult > a:first-child {\n            width: 30%;\n          }\n          .hitResult > a:first-child > div {\n            width: 100%;\n          }\n          .hitResult > div:last-child {\n            width: 100%;\n          }\n          .hitResult > div:last-child > a {\n            margin-bottom: 0.5rem;\n            width: 100%;\n          }\n          .custom-search-img{\n            max-width: 130px;\n          }\n          @media only screen and (max-width: 568px) {\n            .custom-search-img {\n              max-width: 80px;\n            }\n            .hitResult {\n              align-items: center;\n              border: none;\n              padding: 0;\n              flex-direction: column;\n            }\n            .hitResult > a:first-child {\n              width: 100%;\n            }\n            .hitResult > div:last-child {\n              width: 100%;\n            }\n            .search_refinement {\n              flex-wrap: wrap;\n            }\n            .dropdown{\n              margin-bottom: 1rem;\n            }\n            .ais-SearchBox-form{\n              display: flex;\n            }\n            .ais-RefinementList-list {\n              width: 95vw;\n            }\n            .ais-SearchBox-input {\n              width: calc(100vw - ' + (this.props.searchIconUrl ? '110px' : '150px') + ');\n            }\n          }\n          .AlgoliaResults {\n            padding-left: 15px;\n            margin-top: 3rem;\n          }\n\n          .search_refinement {\n            display: flex;\n            margin: 2rem 0;\n            align-items: center;\n          }\n\n          .search_refinement > div {\n            padding-right: 1rem;\n            max-height: 500px;\n            align-self: flex-start;\n          }\n\n          .ais-Hits-list {\n            margin: 0;\n            list-style: none;\n            padding-inline-start: 0;\n          }\n          .ais-Pagination-list {\n            list-style: none;\n          }\n          .ais-Pagination-list {\n            -webkit-box-pack: center;\n            -ms-flex-pack: center;\n            justify-content: center;\n          }\n          .ais-Pagination-item + .ais-Pagination-item {\n            margin-left: 0.3rem;\n          }\n          .ais-Pagination-link {\n            padding: 0.3rem 0.6rem;\n            display: block;\n            border: 1px solid var(--search-primary);\n            border-radius: 5px;\n            transition: background-color 0.2s ease-out;\n          }\n          .ais-Pagination-link:focus,\n          .ais-Pagination-link:hover {\n            background-color: var(--search-secondary);\n            color: #fff;\n          }\n          .ais-Pagination-item--disabled .ais-Pagination-link {\n            opacity: 0.6;\n            cursor: not-allowed;\n            color: var(--search-secondary);\n          }\n          .ais-Pagination-item--disabled .ais-Pagination-link:focus,\n          .ais-Pagination-item--disabled .ais-Pagination-link:hover {\n            color: #fff;\n            background-color: var(--search-secondary);\n          }\n          .ais-Pagination-item--selected .ais-Pagination-link {\n            color: #fff;\n            background-color: var(--search-primary);\n            border-color: var(--search-primary);\n          }\n          .ais-Pagination-item--selected .ais-Pagination-link:focus,\n          .ais-Pagination-item--selected .ais-Pagination-link:hover {\n            color: #fff;\n          }\n          .ais-Pagination-list,\n          .ais-Results-list {\n            margin: 0;\n            padding: 0;\n            list-style: none;\n          }\n          .ais-Pagination-list,\n          .ais-PoweredBy,\n          .ais-RangeInput-form,\n          .ais-RatingMenu-link {\n            display: -webkit-box;\n            display: -ms-flexbox;\n            display: flex;\n            -webkit-box-align: center;\n            -ms-flex-align: center;\n            align-items: center;\n          }\n          .ais-RefinementList{\n            min-width: 325px;\n          }\n          .ais-RefinementList-item {\n            list-style: none;\n            margin: 0;\n            padding: 0;\n          }\n          .ais-RefinementList-list {\n            margin: 1rem 0;\n            padding: 0 1rem;\n            width: 100%;\n          }\n          .ais-SearchBox-form {\n            width: 100%;\n            border-radius: 5px;\n            height: 48px;\n            text-align: center\'\n          }\n          .ais-SearchBox-input {\n            padding: 0.5rem;\n            border-radius: 5px;\n            width: calc(100% - ' + (this.props.searchIconUrl ? '110px' : '150px') + ');\n            min-width: 225px;\n            height: 48px;\n            border: 0;\n            border: 0.5px solid var(--search-secondary);\n          }\n\n          .ais-SearchBox-submit {\n            width: ' + (this.props.searchIconUrl ? '48px' : '78px') + ';\n            border-radius: 5px;\n            padding: 7px;\n            margin-left: 5px;\n            height: 48px;\n            background-color: var(--search-primary);\n            border: 0.5px solid var(--search-secondary);\n          }\n\n          .ais-SearchBox-submit > svg {\n            fill: #fff;\n          }\n          .search_refinement > .dropdown > button {\n            background-color: var(--search-primary);\n            border-color: var(--search-primary);\n          }\n\n          .ais-SearchBox-reset {\n            height: 48px;\n            width: 48px;\n            color: #fff;\n            background-color: var(--search-primary);\n            border: 0;\n            margin-left: 5px;\n            border-radius: 5px;\n            border: 0.5px solid var(--search-secondary);\n          }\n\n          .ais-SearchBox-reset > svg {\n            fill: #fff;\n          }\n          .ais-RefinementList-checkbox {\n            margin-right: 5px;\n          }\n          .ais-ClearRefinements-button{\n            background-color: var(--search-primary);\n            border: 0.5px solid var(--search-secondary);\n            color: #fff;\n            padding: 7px;\n          }\n          .ais-RefinementList-showMore {\n            padding: 0.5rem;\n            border: 0;\n            background-color: var(--search-primary);\n            border-color: var(--search-primary);\n            color: #fff;\n            border: 1px solid;\n            border-radius: 5px;\n            margin-left: 1rem;\n          }\n        '
        )
      );
    }
  }]);

  return AlgoliaSearch;
}(React.Component);

AlgoliaSearch.propTypes = {
  searchState: PropTypes.object,
  resultsState: PropTypes.oneOfType([PropTypes.object, PropTypes.array]),
  onSearchStateChange: PropTypes.func,
  createURL: PropTypes.func,
  indexName: PropTypes.string,
  searchClient: PropTypes.object,
  refinementAttributes: PropTypes.array
};

export default AlgoliaSearch;
