@collectionspace/cspace-public-browser 1.5.1

package/lib/components/search/result/ClearSearchParamsLink.js

@@ -0,0 +1,42 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = ClearSearchParamsLink;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _reactRouterDom = require("react-router-dom");
+var _immutable = _interopRequireDefault(require("immutable"));
+var _ids = require("../../../constants/ids");
+var _urlHelpers = require("../../../helpers/urlHelpers");
+var _SearchParamLink = _interopRequireDefault(require("../../../../styles/cspace/SearchParamLink.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const propTypes = {
+  params: _propTypes.default.instanceOf(_immutable.default.Map).isRequired
+};
+const messages = (0, _reactIntl.defineMessages)({
+  label: {
+    "id": "clearSearchParamsLink.label",
+    "defaultMessage": "Clear all"
+  }
+});
+function ClearSearchParamsLink(props) {
+  const {
+    params
+  } = props;
+  const sortParam = params.filter((value, key) => key === _ids.SORT_ID);
+  const hasNonSortParam = params.size > sortParam.size;
+  if (hasNonSortParam) {
+    const queryString = (0, _urlHelpers.searchParamsToQueryString)(sortParam);
+    return /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
+      className: _SearchParamLink.default.common,
+      to: {
+        search: `?${queryString}`
+      }
+    }, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, messages.label));
+  }
+  return null;
+}
+ClearSearchParamsLink.propTypes = propTypes;

package/lib/components/search/result/Filter.js

@@ -0,0 +1,186 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _reactRouter = require("react-router");
+var _immutable = _interopRequireDefault(require("immutable"));
+var _memoizeOne = _interopRequireDefault(require("memoize-one"));
+var _FilterSearchInput = _interopRequireDefault(require("./FilterSearchInput"));
+var _PanelContainer = _interopRequireDefault(require("../../layout/PanelContainer"));
+var _Filter = _interopRequireDefault(require("../../../../styles/cspace/Filter.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+const propTypes = {
+  aggregation: _propTypes.default.instanceOf(_immutable.default.Map),
+  field: _propTypes.default.string.isRequired,
+  formatValue: _propTypes.default.func,
+  history: _propTypes.default.shape({
+    push: _propTypes.default.func.isRequired
+  }).isRequired,
+  id: _propTypes.default.string.isRequired,
+  messages: _propTypes.default.shape({
+    label: _propTypes.default.object.isRequired
+  }).isRequired,
+  onSearchValueCommit: _propTypes.default.func,
+  onValueCommit: _propTypes.default.func,
+  params: _propTypes.default.instanceOf(_immutable.default.Map).isRequired,
+  searchValue: _propTypes.default.string,
+  showSearch: _propTypes.default.bool
+};
+const defaultProps = {
+  aggregation: _immutable.default.Map(),
+  formatValue: undefined,
+  onSearchValueCommit: () => undefined,
+  onValueCommit: () => undefined,
+  searchValue: undefined,
+  showSearch: true
+};
+const messages = (0, _reactIntl.defineMessages)({
+  count: {
+    "id": "filter.count",
+    "defaultMessage": "({count, number})"
+  }
+});
+const getFormattedValues = (0, _memoizeOne.default)((aggregation, formatValue) => {
+  if (!formatValue) {
+    return undefined;
+  }
+  const formattedValues = {};
+  aggregation.get('buckets').forEach(bucket => {
+    const value = bucket.get('key');
+    const formattedValue = formatValue(value);
+    formattedValues[value] = formattedValue;
+  });
+  return formattedValues;
+});
+const handleCheckboxFocus = event => {
+  const {
+    target: focusedFieldElement
+  } = event;
+  const fieldIndex = focusedFieldElement.getAttribute('data-number');
+  const focusedFieldLiElement = focusedFieldElement.parentElement.parentElement;
+  const focusedFieldUlElement = focusedFieldLiElement.parentElement;
+  const newScrollPosition = focusedFieldLiElement.getBoundingClientRect().height * fieldIndex;
+  focusedFieldUlElement.scrollTop = newScrollPosition;
+  focusedFieldUlElement.scrollIntoView({
+    block: 'end',
+    behavior: 'instant'
+  });
+};
+class Filter extends _react.Component {
+  constructor() {
+    super();
+    this.handleCheckboxChange = this.handleCheckboxChange.bind(this);
+    this.handleSearchInputCommit = this.handleSearchInputCommit.bind(this);
+  }
+  handleSearchInputCommit(value) {
+    const {
+      id,
+      onSearchValueCommit
+    } = this.props;
+    onSearchValueCommit(id, value);
+  }
+  handleCheckboxChange(event) {
+    const {
+      history,
+      id,
+      onValueCommit
+    } = this.props;
+    const {
+      target: checkbox
+    } = event;
+    const {
+      dataset,
+      name
+    } = checkbox;
+    const {
+      type
+    } = dataset;
+    const value = type === 'number' ? Number.parseInt(name, 10) : name;
+    onValueCommit(history, id, value, checkbox.checked);
+  }
+  renderBuckets() {
+    const {
+      aggregation,
+      formatValue,
+      id,
+      params,
+      searchValue
+    } = this.props;
+    const formattedValues = getFormattedValues(aggregation, formatValue);
+    const buckets = aggregation.get('buckets');
+    let matchingBuckets = buckets;
+    if (searchValue) {
+      const needle = searchValue.toLowerCase();
+      matchingBuckets = buckets.filter(bucket => {
+        const value = bucket.get('key');
+        const formattedValue = formattedValues ? formattedValues[value] : value;
+        const haystack = formattedValue.toLowerCase();
+        return haystack.includes(needle);
+      });
+    }
+    let selectedValues = params.get(id) || _immutable.default.List();
+    if (!_immutable.default.List.isList(selectedValues)) {
+      selectedValues = _immutable.default.List.of(selectedValues);
+    }
+    return matchingBuckets.map((bucket, index) => {
+      const value = bucket.get('key');
+      const type = typeof value;
+      const count = bucket.get('doc_count');
+      const isSelected = selectedValues.indexOf(value) >= 0;
+      const formattedValue = formattedValues ? formattedValues[value] : value;
+      return /*#__PURE__*/_react.default.createElement("li", {
+        key: value
+      }, /*#__PURE__*/_react.default.createElement("label", null, /*#__PURE__*/_react.default.createElement("input", {
+        checked: isSelected,
+        "data-type": type !== 'string' ? type : undefined,
+        "data-number": index,
+        name: value,
+        type: "checkbox",
+        onChange: this.handleCheckboxChange,
+        onFocus: handleCheckboxFocus
+      }), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("span", null, formattedValue, ' ', /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, _extends({}, messages.count, {
+        values: {
+          count
+        }
+      }))))));
+    });
+  }
+  render() {
+    const {
+      aggregation,
+      id,
+      messages: filterMessages,
+      searchValue,
+      showSearch
+    } = this.props;
+    const buckets = aggregation.get('buckets');
+    const isEmpty = !buckets || buckets.size === 0;
+    if (isEmpty) {
+      return null;
+    }
+
+    // eslint-disable-next-line react/jsx-props-no-spreading
+    const title = /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, filterMessages.label);
+    return /*#__PURE__*/_react.default.createElement(_PanelContainer.default, {
+      id: `Filter-${id}`,
+      title: title
+    }, /*#__PURE__*/_react.default.createElement("div", {
+      className: _Filter.default.common
+    }, showSearch && /*#__PURE__*/_react.default.createElement(_FilterSearchInput.default, {
+      value: searchValue,
+      onCommit: this.handleSearchInputCommit
+    }), /*#__PURE__*/_react.default.createElement("ul", null, this.renderBuckets(buckets))));
+  }
+}
+Filter.propTypes = propTypes;
+Filter.defaultProps = defaultProps;
+var _default = (0, _reactRouter.withRouter)(Filter);
+exports.default = _default;

package/lib/components/search/result/FilterContainer.js

@@ -0,0 +1,22 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _reactRedux = require("react-redux");
+var _Filter = _interopRequireDefault(require("./Filter"));
+var _filterActions = require("../../../actions/filterActions");
+var _searchActions = require("../../../actions/searchActions");
+var _reducers = require("../../../reducers");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const mapStateToProps = (state, ownProps) => ({
+  searchValue: (0, _reducers.getFilterSearchValue)(state, ownProps.id),
+  params: (0, _reducers.getSearchParams)(state)
+});
+const mapDispatchToProps = {
+  onSearchValueCommit: _filterActions.setFilterSearchValue,
+  onValueCommit: _searchActions.applyFilter
+};
+var _default = (0, _reactRedux.connect)(mapStateToProps, mapDispatchToProps)(_Filter.default);
+exports.default = _default;

package/lib/components/search/result/FilterGroup.js

@@ -0,0 +1,72 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = FilterGroup;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _immutable = _interopRequireDefault(require("immutable"));
+var _FilterContainer = _interopRequireDefault(require("./FilterContainer"));
+var _FilterGroup = _interopRequireDefault(require("../../../../styles/cspace/FilterGroup.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const propTypes = {
+  config: _propTypes.default.shape({
+    fields: _propTypes.default.arrayOf(_propTypes.default.string).isRequired,
+    label: _propTypes.default.string,
+    messages: _propTypes.default.object
+  }).isRequired,
+  fieldsConfig: _propTypes.default.objectOf(_propTypes.default.object).isRequired,
+  id: _propTypes.default.string.isRequired,
+  isPending: _propTypes.default.bool,
+  aggregations: _propTypes.default.instanceOf(_immutable.default.Map)
+};
+const defaultProps = {
+  isPending: false,
+  aggregations: _immutable.default.Map()
+};
+function FilterGroup(props) {
+  const {
+    aggregations,
+    config,
+    fieldsConfig
+  } = props;
+  const {
+    fields,
+    label,
+    messages
+  } = config;
+  const isEmpty = aggregations.isEmpty() || !fields.find(fieldId => {
+    const buckets = aggregations.getIn([fieldId, 'buckets']);
+    return buckets && buckets.size > 0;
+  });
+  if (isEmpty) {
+    return null;
+  }
+  const labelMessage = messages && messages.label;
+
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  const headerContent = labelMessage ? /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, labelMessage) : label;
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _FilterGroup.default.common
+  }, headerContent && /*#__PURE__*/_react.default.createElement("h1", null, headerContent), fields.map(fieldId => {
+    const {
+      field,
+      formatValue,
+      messages: fieldMessages,
+      showSearch
+    } = fieldsConfig[fieldId];
+    return /*#__PURE__*/_react.default.createElement(_FilterContainer.default, {
+      aggregation: aggregations.get(fieldId),
+      id: fieldId,
+      field: field,
+      formatValue: formatValue,
+      key: fieldId,
+      messages: fieldMessages,
+      showSearch: showSearch
+    });
+  }));
+}
+FilterGroup.propTypes = propTypes;
+FilterGroup.defaultProps = defaultProps;

package/lib/components/search/result/FilterList.js

@@ -0,0 +1,48 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = FilterList;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _immutable = _interopRequireDefault(require("immutable"));
+var _FilterGroup = _interopRequireDefault(require("./FilterGroup"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const propTypes = {
+  config: _propTypes.default.shape({
+    fields: _propTypes.default.object.isRequired,
+    groups: _propTypes.default.object.isRequired,
+    layout: _propTypes.default.object.isRequired
+  }).isRequired,
+  isPending: _propTypes.default.bool,
+  aggregations: _propTypes.default.instanceOf(_immutable.default.Map)
+};
+const defaultProps = {
+  aggregations: _immutable.default.Map(),
+  isPending: _propTypes.default.bool
+};
+function FilterList(props) {
+  const {
+    aggregations,
+    config,
+    isPending
+  } = props;
+  const {
+    fields,
+    groups,
+    layout
+  } = config;
+  return Object.keys(layout).map(layoutId => /*#__PURE__*/_react.default.createElement("div", {
+    key: layoutId
+  }, layout[layoutId].map(groupId => /*#__PURE__*/_react.default.createElement(_FilterGroup.default, {
+    aggregations: aggregations,
+    config: groups[groupId],
+    fieldsConfig: fields,
+    id: groupId,
+    isPending: isPending,
+    key: groupId
+  }))));
+}
+FilterList.propTypes = propTypes;
+FilterList.defaultProps = defaultProps;

package/lib/components/search/result/FilterPanel.js

@@ -0,0 +1,115 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _immutable = _interopRequireDefault(require("immutable"));
+var _FilterList = _interopRequireDefault(require("./FilterList"));
+var _config = _interopRequireDefault(require("../../../config"));
+var _FilterPanel = _interopRequireDefault(require("../../../../styles/cspace/FilterPanel.css"));
+var _dimensions = _interopRequireDefault(require("../../../../styles/dimensions.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+/* global window */
+
+const propTypes = {
+  api: _propTypes.default.func,
+  isExpanded: _propTypes.default.bool,
+  isPending: _propTypes.default.bool,
+  result: _propTypes.default.instanceOf(_immutable.default.Map)
+};
+const defaultProps = {
+  api: () => undefined,
+  isExpanded: false,
+  isPending: false,
+  result: _immutable.default.Map()
+};
+const messages = (0, _reactIntl.defineMessages)({
+  title: {
+    "id": "FilterPanel.title",
+    "defaultMessage": "Refine results:"
+  }
+});
+const {
+  filterPanelCutoffWidth: cssFilterPanelCutoffWidth
+} = _dimensions.default;
+const filterPanelCutoffWidth = parseInt(cssFilterPanelCutoffWidth, 10);
+class FilterPanel extends _react.Component {
+  constructor() {
+    super();
+    this.handleResize = this.handleResize.bind(this);
+    this.handleScroll = this.handleScroll.bind(this);
+    this.ref = /*#__PURE__*/_react.default.createRef();
+    this.state = {};
+  }
+  componentDidMount() {
+    const {
+      api
+    } = this.props;
+    window.addEventListener('resize', this.handleResize);
+    window.addEventListener('scroll', this.handleScroll);
+    api({
+      setHeight: this.setHeight.bind(this)
+    });
+    this.setHeight();
+  }
+  componentWillUnmount() {
+    window.removeEventListener('resize', this.handleResize);
+    window.removeEventListener('scroll', this.handleScroll);
+  }
+  handleResize() {
+    this.setHeight();
+  }
+  handleScroll() {
+    this.setHeight();
+  }
+  setHeight() {
+    const height = window.innerHeight;
+    const rect = this.ref.current.getBoundingClientRect();
+    const maxHeight = height - rect.top;
+    this.setState({
+      height: maxHeight
+    });
+  }
+  renderContent() {
+    const {
+      isExpanded,
+      isPending,
+      result
+    } = this.props;
+    const isVisible = window.innerWidth > filterPanelCutoffWidth || isExpanded;
+    if (!isVisible || !result.get('total')) {
+      return undefined;
+    }
+    return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement("header", null, /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, messages.title)), /*#__PURE__*/_react.default.createElement(_FilterList.default, {
+      aggregations: result.get('aggregations'),
+      config: _config.default.get('filters'),
+      isPending: isPending
+    }));
+  }
+  render() {
+    const {
+      isExpanded
+    } = this.props;
+    const {
+      height
+    } = this.state;
+    const className = isExpanded ? _FilterPanel.default.expanded : _FilterPanel.default.collapsed;
+    const inlineStyle = height ? {
+      height
+    } : undefined;
+    return /*#__PURE__*/_react.default.createElement("div", {
+      className: className,
+      ref: this.ref,
+      style: inlineStyle
+    }, this.renderContent());
+  }
+}
+exports.default = FilterPanel;
+FilterPanel.propTypes = propTypes;
+FilterPanel.defaultProps = defaultProps;

package/lib/components/search/result/FilterPanelContainer.js

@@ -0,0 +1,16 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _reactRedux = require("react-redux");
+var _FilterPanel = _interopRequireDefault(require("./FilterPanel"));
+var _reducers = require("../../../reducers");
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const mapStateToProps = state => ({
+  isPending: (0, _reducers.isSearchPending)(state),
+  result: (0, _reducers.getSearchResult)(state)
+});
+var _default = (0, _reactRedux.connect)(mapStateToProps)(_FilterPanel.default);
+exports.default = _default;

package/lib/components/search/result/FilterSearchInput.js

@@ -0,0 +1,63 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _react = _interopRequireWildcard(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _FilterSearchInput = _interopRequireDefault(require("../../../../styles/cspace/FilterSearchInput.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function (nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+const propTypes = {
+  intl: _propTypes.default.shape({
+    formatMessage: _propTypes.default.func.isRequired
+  }).isRequired,
+  onCommit: _propTypes.default.func,
+  value: _propTypes.default.string
+};
+const defaultProps = {
+  onCommit: () => undefined,
+  value: ''
+};
+const messages = (0, _reactIntl.defineMessages)({
+  label: {
+    "id": "filterSearchInput.label",
+    "defaultMessage": "Search"
+  }
+});
+class FilterSearchInput extends _react.Component {
+  constructor() {
+    super();
+    this.handleChange = this.handleChange.bind(this);
+  }
+  handleChange(event) {
+    const {
+      onCommit
+    } = this.props;
+    onCommit(event.target.value);
+  }
+  render() {
+    const {
+      intl,
+      value
+    } = this.props;
+    const label = intl.formatMessage(messages.label);
+    return (
+      /*#__PURE__*/
+      // eslint-disable-next-line jsx-a11y/label-has-associated-control
+      _react.default.createElement("label", null, label, /*#__PURE__*/_react.default.createElement("input", {
+        className: _FilterSearchInput.default.common,
+        type: "search",
+        value: value,
+        onChange: this.handleChange
+      }))
+    );
+  }
+}
+FilterSearchInput.propTypes = propTypes;
+FilterSearchInput.defaultProps = defaultProps;
+var _default = (0, _reactIntl.injectIntl)(FilterSearchInput);
+exports.default = _default;

package/lib/components/search/result/RemoveSearchParamLink.js

@@ -0,0 +1,66 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = RemoveSearchParamLink;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _reactIntl = require("react-intl");
+var _reactRouterDom = require("react-router-dom");
+var _immutable = _interopRequireDefault(require("immutable"));
+var _get = _interopRequireDefault(require("lodash/get"));
+var _SearchQueryInput = require("../entry/SearchQueryInput");
+var _config = _interopRequireDefault(require("../../../config"));
+var _ids = require("../../../constants/ids");
+var _urlHelpers = require("../../../helpers/urlHelpers");
+var _RemoveSearchParamLink = _interopRequireDefault(require("../../../../styles/cspace/RemoveSearchParamLink.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const propTypes = {
+  id: _propTypes.default.string.isRequired,
+  params: _propTypes.default.instanceOf(_immutable.default.Map).isRequired
+};
+const VALUE_DELIMITER = ', ';
+const getLabelMessage = (id, filterFieldConfig) => {
+  if (id === _ids.SEARCH_QUERY_ID) {
+    return _SearchQueryInput.messages.shortLabel;
+  }
+  if (filterFieldConfig) {
+    const {
+      messages: filterFieldMessages
+    } = filterFieldConfig;
+    return filterFieldMessages.shortLabel || filterFieldMessages.label;
+  }
+  return undefined;
+};
+const renderLabel = (id, filterFieldConfig) => {
+  const labelMessage = getLabelMessage(id, filterFieldConfig);
+  return labelMessage
+  // eslint-disable-next-line react/jsx-props-no-spreading
+  ? /*#__PURE__*/_react.default.createElement(_reactIntl.FormattedMessage, labelMessage) : id;
+};
+const renderValue = (id, filterFieldConfig, params) => {
+  const value = params.get(id);
+  const formatValue = (0, _get.default)(filterFieldConfig, 'formatValue');
+  if (_immutable.default.List.isList(value)) {
+    return formatValue ? value.map(v => formatValue(v)).join(VALUE_DELIMITER) : value.join(VALUE_DELIMITER);
+  }
+  return formatValue ? formatValue(value) : value;
+};
+function RemoveSearchParamLink(props) {
+  const {
+    id,
+    params
+  } = props;
+  const filterFieldConfig = _config.default.getFilterFieldConfig(id);
+  const queryString = (0, _urlHelpers.searchParamsToQueryString)(params.delete(id));
+  const label = renderLabel(id, filterFieldConfig);
+  const value = renderValue(id, filterFieldConfig, params);
+  return /*#__PURE__*/_react.default.createElement(_reactRouterDom.Link, {
+    className: _RemoveSearchParamLink.default.common,
+    to: {
+      search: `?${queryString}`
+    }
+  }, label, ":", ' ', value);
+}
+RemoveSearchParamLink.propTypes = propTypes;

package/lib/components/search/result/SearchError.js

@@ -0,0 +1,29 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = SearchError;
+var _react = _interopRequireDefault(require("react"));
+var _propTypes = _interopRequireDefault(require("prop-types"));
+var _SearchStatus = _interopRequireDefault(require("../../../../styles/cspace/SearchStatus.css"));
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+const propTypes = {
+  error: _propTypes.default.instanceOf(Error)
+};
+const defaultProps = {
+  error: undefined
+};
+function SearchError(props) {
+  const {
+    error
+  } = props;
+  if (!error) {
+    return undefined;
+  }
+  return /*#__PURE__*/_react.default.createElement("div", {
+    className: _SearchStatus.default.common
+  }, error.message);
+}
+SearchError.propTypes = propTypes;
+SearchError.defaultProps = defaultProps;