@blaze-cms/plugin-search-ui 0.110.0-alpha.1

package/README.md

@@ -0,0 +1,45 @@
+# Base search plugin ui
+
+This plugin is creating a modal interface for blaze admin and also a searchbar (for client-side) boat are consuming an ELK (Elastic search) API to be able to find any field in the content already created.
+
+## Query
+
+To do that we are passing to the SearchAdmin query an speciall variable rawQuery (same with search published content query). This raw query is an ELK query composed by the following fields:
+
+- query: Returns documents based on a provided query string, using a parser with a strict syntax.
+- fields: Allow you to find in multiple fields. In our case there are not anyone set.
+- minimum_should_match: That matches documents with at least two of the terms that are set in query. Imagine that you have set in query 'this, that or thus' then will match if there are at least of two of this words.
+- type: 'cross_fields': The cross_fields type is particularly useful with structured documents where multiple fields should match. For instance, when querying the first_name and last_name fields for “Will Smith”, the best match is likely to have “Will” in one field and “Smith” in the other.
+
+Also at the end of te query value we added a wildcard in order to do a partial matches. For example if I would like to search all the names that contains da, the results could be adam, david because is matching partially with those names.
+
+```js
+rawQuery: {
+  query_string: {
+    query: <value>*,
+    fields: [],
+    minimum_should_match: 2,
+    type: 'cross_fields'
+  }
+}
+```
+
+### Filter
+
+We have added a filter in order to be able to filter among which entities (pages, articles...) would you like to focus your search. To do that we are accepting the filter variable into te query which has the following format:
+
+```js
+{
+  filter: [
+    {
+      terms: {
+        docType: filter
+      }
+    }
+  ];
+}
+```
+
+## Advanced seaches
+
+Imagine that you know in which field is the value that you would like to search. For example in a metakeyword field. Then you could add to the query the following value: `metakeyword:myKeyword` just to search in every field `metakeyword` the value `myKeyword`.

package/babel.config.js

@@ -0,0 +1,3 @@
+const babelConfig = require('@blaze-cms/setup-ui/babel/babel.config');
+
+module.exports = babelConfig;

package/jest.config.js

@@ -0,0 +1,5 @@
+const buildConfig = require('@blaze-cms/tools/jest/react-build-config');
+
+const jestConfig = buildConfig(__dirname);
+
+module.exports = jestConfig;

package/lib/application/query/index.js

@@ -0,0 +1,32 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
+
+var _graphqlTag = _interopRequireDefault(require("graphql-tag"));
+
+var _templateObject, _templateObject2;
+
+var SEARCH_ADMIN = function SEARCH_ADMIN() {
+  return (0, _graphqlTag["default"])(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2["default"])(["\n  query searchAdmin($limit: Int, $offset: Int, $sort: String, $rawQuery: JSON!) {\n    search: searchAdmin(limit: $limit, offset: $offset, sort: $sort, rawQuery: $rawQuery) {\n      jsonResults\n      total\n    }\n  }\n"])));
+};
+
+var SEARCH_PUBLISHED = function SEARCH_PUBLISHED(_ref) {
+  var resultKeys = _ref.resultKeys;
+  return (0, _graphqlTag["default"])(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2["default"])(["\n  query searchPublishedContent($limit: Int, $offset: Int, $sort: String, $rawQuery: JSON!) {\n    search: searchPublishedContent(\n      limit: $limit\n      offset: $offset\n      sort: $sort\n      rawQuery: $rawQuery\n    ) {\n      results {\n        ", "\n      }\n      total\n    }\n  }\n"])), resultKeys);
+};
+
+var _default = {
+  SEARCH_ADMIN: SEARCH_ADMIN,
+  SEARCH_PUBLISHED: SEARCH_PUBLISHED
+};
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/application/query/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/application/query/index.js"],"names":["SEARCH_ADMIN","gql","SEARCH_PUBLISHED","resultKeys"],"mappings":";;;;;;;;;;;;;AAAA;;;;AAEA,IAAMA,YAAY,GAAG,SAAfA,YAAe;AAAA,aAAMC,sBAAN;AAAA,CAArB;;AASA,IAAMC,gBAAgB,GAAG,SAAnBA,gBAAmB;AAAA,MAAGC,UAAH,QAAGA,UAAH;AAAA,aAAoBF,sBAApB,mYASfE,UATe;AAAA,CAAzB;;eAgBe;AAAEH,EAAAA,YAAY,EAAZA,YAAF;AAAgBE,EAAAA,gBAAgB,EAAhBA;AAAhB,C","sourcesContent":["import gql from 'graphql-tag';\n\nconst SEARCH_ADMIN = () => gql`\n  query searchAdmin($limit: Int, $offset: Int, $sort: String, $rawQuery: JSON!) {\n    search: searchAdmin(limit: $limit, offset: $offset, sort: $sort, rawQuery: $rawQuery) {\n      jsonResults\n      total\n    }\n  }\n`;\n\nconst SEARCH_PUBLISHED = ({ resultKeys }) => gql`\n  query searchPublishedContent($limit: Int, $offset: Int, $sort: String, $rawQuery: JSON!) {\n    search: searchPublishedContent(\n      limit: $limit\n      offset: $offset\n      sort: $sort\n      rawQuery: $rawQuery\n    ) {\n      results {\n        ${resultKeys}\n      }\n      total\n    }\n  }\n`;\n\nexport default { SEARCH_ADMIN, SEARCH_PUBLISHED };\n"],"file":"index.js"}

package/lib/components/SearchAdmin/RecentSearches/RecentSearches.js

@@ -0,0 +1,62 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("core-js/modules/es.regexp.exec.js");
+
+require("core-js/modules/es.string.search.js");
+
+require("core-js/modules/es.array.map.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var RecentSearches = function RecentSearches(_ref) {
+  var recentSearches = _ref.recentSearches,
+      handleSearchTerm = _ref.handleSearchTerm,
+      search = _ref.search;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "list list--search"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header header--list"
+  }, /*#__PURE__*/_react["default"].createElement("h2", null, "Recent searches")), recentSearches.map(function (searchedTerm) {
+    return /*#__PURE__*/_react["default"].createElement("div", {
+      key: searchedTerm,
+      role: "button",
+      className: "list__item list__item--search",
+      onClick: function onClick() {
+        handleSearchTerm({
+          target: {
+            value: searchedTerm
+          }
+        });
+        search({
+          value: searchedTerm
+        });
+      }
+    }, /*#__PURE__*/_react["default"].createElement("div", {
+      className: "list__item-row list__item-row--search"
+    }, /*#__PURE__*/_react["default"].createElement("i", {
+      className: "material-icons"
+    }, "search"), /*#__PURE__*/_react["default"].createElement("div", {
+      className: "list__item-text list__item-text--search"
+    }, searchedTerm)));
+  }));
+};
+
+RecentSearches.propTypes = {
+  recentSearches: _propTypes["default"].array.isRequired,
+  handleSearchTerm: _propTypes["default"].func.isRequired,
+  search: _propTypes["default"].func.isRequired
+};
+var _default = RecentSearches;
+exports["default"] = _default;
+//# sourceMappingURL=RecentSearches.js.map

package/lib/components/SearchAdmin/RecentSearches/RecentSearches.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SearchAdmin/RecentSearches/RecentSearches.js"],"names":["RecentSearches","recentSearches","handleSearchTerm","search","map","searchedTerm","target","value","propTypes","PropTypes","array","isRequired","func"],"mappings":";;;;;;;;;;;;;;;;;AAAA;;AACA;;AAEA,IAAMA,cAAc,GAAG,SAAjBA,cAAiB;AAAA,MAAGC,cAAH,QAAGA,cAAH;AAAA,MAAmBC,gBAAnB,QAAmBA,gBAAnB;AAAA,MAAqCC,MAArC,QAAqCA,MAArC;AAAA,sBACrB;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE,8DADF,CADF,EAIGF,cAAc,CAACG,GAAf,CAAmB,UAAAC,YAAY;AAAA,wBAC9B;AACE,MAAA,GAAG,EAAEA,YADP;AAEE,MAAA,IAAI,EAAC,QAFP;AAGE,MAAA,SAAS,EAAC,+BAHZ;AAIE,MAAA,OAAO,EAAE,mBAAM;AACbH,QAAAA,gBAAgB,CAAC;AAAEI,UAAAA,MAAM,EAAE;AAAEC,YAAAA,KAAK,EAAEF;AAAT;AAAV,SAAD,CAAhB;AACAF,QAAAA,MAAM,CAAC;AAAEI,UAAAA,KAAK,EAAEF;AAAT,SAAD,CAAN;AACD;AAPH,oBAQE;AAAK,MAAA,SAAS,EAAC;AAAf,oBACE;AAAG,MAAA,SAAS,EAAC;AAAb,gBADF,eAEE;AAAK,MAAA,SAAS,EAAC;AAAf,OAA0DA,YAA1D,CAFF,CARF,CAD8B;AAAA,GAA/B,CAJH,CADqB;AAAA,CAAvB;;AAuBAL,cAAc,CAACQ,SAAf,GAA2B;AACzBP,EAAAA,cAAc,EAAEQ,sBAAUC,KAAV,CAAgBC,UADP;AAEzBT,EAAAA,gBAAgB,EAAEO,sBAAUG,IAAV,CAAeD,UAFR;AAGzBR,EAAAA,MAAM,EAAEM,sBAAUG,IAAV,CAAeD;AAHE,CAA3B;eAMeX,c","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst RecentSearches = ({ recentSearches, handleSearchTerm, search }) => (\n  <div className=\"list list--search\">\n    <div className=\"header header--list\">\n      <h2>Recent searches</h2>\n    </div>\n    {recentSearches.map(searchedTerm => (\n      <div\n        key={searchedTerm}\n        role=\"button\"\n        className=\"list__item list__item--search\"\n        onClick={() => {\n          handleSearchTerm({ target: { value: searchedTerm } });\n          search({ value: searchedTerm });\n        }}>\n        <div className=\"list__item-row list__item-row--search\">\n          <i className=\"material-icons\">search</i>\n          <div className=\"list__item-text list__item-text--search\">{searchedTerm}</div>\n        </div>\n      </div>\n    ))}\n  </div>\n);\n\nRecentSearches.propTypes = {\n  recentSearches: PropTypes.array.isRequired,\n  handleSearchTerm: PropTypes.func.isRequired,\n  search: PropTypes.func.isRequired\n};\n\nexport default RecentSearches;\n"],"file":"RecentSearches.js"}

package/lib/components/SearchAdmin/RecentSearches/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _RecentSearches = _interopRequireDefault(require("./RecentSearches"));
+
+var _default = _RecentSearches["default"];
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/components/SearchAdmin/RecentSearches/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SearchAdmin/RecentSearches/index.js"],"names":["RecentSearches"],"mappings":";;;;;;;;;;;AAAA;;eAEeA,0B","sourcesContent":["import RecentSearches from './RecentSearches';\n\nexport default RecentSearches;\n"],"file":"index.js"}

package/lib/components/SearchAdmin/SearchAdmin.js

@@ -0,0 +1,191 @@
+"use strict";
+
+require("core-js/modules/es.array.iterator.js");
+
+require("core-js/modules/es.object.to-string.js");
+
+require("core-js/modules/es.string.iterator.js");
+
+require("core-js/modules/es.weak-map.js");
+
+require("core-js/modules/web.dom-collections.iterator.js");
+
+require("core-js/modules/es.object.define-property.js");
+
+require("core-js/modules/es.object.get-own-property-descriptor.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+var _typeof = require("@babel/runtime/helpers/typeof");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("core-js/modules/es.array.slice.js");
+
+require("core-js/modules/es.array.includes.js");
+
+require("core-js/modules/es.string.includes.js");
+
+var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
+
+var _react = _interopRequireWildcard(require("react"));
+
+var _classnames = _interopRequireDefault(require("classnames"));
+
+var _useLocalStorage3 = _interopRequireDefault(require("../useLocalStorage"));
+
+var _SearchBar = _interopRequireDefault(require("./SearchBar"));
+
+var _RecentSearches = _interopRequireDefault(require("./RecentSearches"));
+
+var _SearchResults = _interopRequireDefault(require("./SearchResults"));
+
+var _TriggerModal = _interopRequireDefault(require("./TriggerModal"));
+
+var _useSearchResults3 = _interopRequireDefault(require("../useSearchResults"));
+
+var _constants = require("../../constants");
+
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(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; }
+
+var SearchAdmin = function SearchAdmin() {
+  var _useState = (0, _react.useState)(''),
+      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+      searchTerm = _useState2[0],
+      setSearchTerm = _useState2[1];
+
+  var _useLocalStorage = (0, _useLocalStorage3["default"])('recentSearches', []),
+      _useLocalStorage2 = (0, _slicedToArray2["default"])(_useLocalStorage, 2),
+      recentSearches = _useLocalStorage2[0],
+      setRecentSearches = _useLocalStorage2[1];
+
+  var _useState3 = (0, _react.useState)(false),
+      _useState4 = (0, _slicedToArray2["default"])(_useState3, 2),
+      displaySearchModalFrame = _useState4[0],
+      setDisplaySearchModalFrame = _useState4[1];
+
+  var _useState5 = (0, _react.useState)(true),
+      _useState6 = (0, _slicedToArray2["default"])(_useState5, 2),
+      enableResults = _useState6[0],
+      setEnableResults = _useState6[1];
+
+  var searchInputRef = (0, _react.useRef)(null);
+
+  var _useSearchResults = (0, _useSearchResults3["default"])({
+    queryKey: _constants.SEARCH_ADMIN
+  }),
+      _useSearchResults2 = (0, _slicedToArray2["default"])(_useSearchResults, 2),
+      _useSearchResults2$ = _useSearchResults2[0],
+      loading = _useSearchResults2$.loading,
+      results = _useSearchResults2$.results,
+      total = _useSearchResults2$.total,
+      setQueryParams = _useSearchResults2[1];
+
+  (0, _react.useEffect)(function () {
+    if (searchInputRef && searchInputRef.current) {
+      searchInputRef.current.focus();
+    }
+  }, [displaySearchModalFrame]);
+
+  var handleSearchTerm = function handleSearchTerm(_ref) {
+    var value = _ref.target.value;
+    setSearchTerm(value);
+  };
+
+  var toggleSearchModal = function toggleSearchModal() {
+    setSearchTerm(null);
+    setEnableResults(false);
+    setDisplaySearchModalFrame(!displaySearchModalFrame);
+  };
+
+  var _search = function search(_ref2) {
+    var value = _ref2.value;
+    if (!value) return;
+    !enableResults && setEnableResults(true);
+    var MAX_RECENT_SEARCHES = 5;
+    var recentSearchesCopy = recentSearches.slice();
+
+    if (!recentSearchesCopy.includes(value)) {
+      recentSearchesCopy.push(value);
+
+      if (recentSearchesCopy.length > MAX_RECENT_SEARCHES) {
+        recentSearchesCopy.shift();
+      }
+    }
+
+    setRecentSearches(recentSearchesCopy);
+    setQueryParams({
+      value: value
+    });
+  };
+
+  var handleKeyDown = function handleKeyDown(_ref3) {
+    var key = _ref3.key;
+
+    if (key === 'Enter') {
+      if (!searchTerm) return clear();
+
+      _search({
+        value: searchTerm
+      });
+    }
+  };
+
+  var clear = function clear() {
+    setSearchTerm('');
+    setEnableResults(false);
+  };
+
+  var searchModalResultsClassName = (0, _classnames["default"])('modal modal--full-screen modal--search', {
+    'modal--show': displaySearchModalFrame
+  });
+  var isEmptySearchTermAndData = !searchTerm && !results.length;
+  var isEmptySearchTermnAndDisabledResults = !searchTerm && !enableResults;
+  var shouldDisplayRecentSearches = isEmptySearchTermAndData || isEmptySearchTermnAndDisabledResults;
+  var showResults = enableResults && results.length;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "search search--header"
+  }, /*#__PURE__*/_react["default"].createElement(_TriggerModal["default"], {
+    toggleSearchModal: toggleSearchModal
+  }), /*#__PURE__*/_react["default"].createElement("div", {
+    className: searchModalResultsClassName
+  }, displaySearchModalFrame && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "modal__header modal__header--search"
+  }, /*#__PURE__*/_react["default"].createElement(_SearchBar["default"], {
+    toggleSearchModal: toggleSearchModal,
+    handleKeyDown: handleKeyDown,
+    searchInputRef: searchInputRef,
+    handleSearchTerm: handleSearchTerm,
+    searchTerm: searchTerm,
+    search: function search() {
+      return _search({
+        value: searchTerm
+      });
+    }
+  })), shouldDisplayRecentSearches ? /*#__PURE__*/_react["default"].createElement(_RecentSearches["default"], {
+    recentSearches: recentSearches,
+    handleSearchTerm: handleSearchTerm,
+    search: _search
+  }) : /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, !showResults && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "list list--search"
+  }, /*#__PURE__*/_react["default"].createElement("div", {
+    className: "header header--list"
+  }, /*#__PURE__*/_react["default"].createElement("h2", null, "No Results")))), showResults && /*#__PURE__*/_react["default"].createElement(_SearchResults["default"], {
+    currentValue: searchTerm,
+    searchTerm: searchTerm,
+    loading: loading,
+    results: results,
+    total: total,
+    setQueryParams: setQueryParams,
+    closeModal: toggleSearchModal
+  }))));
+};
+
+var _default = SearchAdmin;
+exports["default"] = _default;
+//# sourceMappingURL=SearchAdmin.js.map

package/lib/components/SearchAdmin/SearchAdmin.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/components/SearchAdmin/SearchAdmin.js"],"names":["SearchAdmin","searchTerm","setSearchTerm","recentSearches","setRecentSearches","displaySearchModalFrame","setDisplaySearchModalFrame","enableResults","setEnableResults","searchInputRef","queryKey","SEARCH_ADMIN","loading","results","total","setQueryParams","current","focus","handleSearchTerm","value","target","toggleSearchModal","search","MAX_RECENT_SEARCHES","recentSearchesCopy","slice","includes","push","length","shift","handleKeyDown","key","clear","searchModalResultsClassName","isEmptySearchTermAndData","isEmptySearchTermnAndDisabledResults","shouldDisplayRecentSearches","showResults"],"mappings":"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","sourcesContent":["import React, { useState, useRef, useEffect } from 'react';\nimport classnames from 'classnames';\nimport useLocalStorage from '../useLocalStorage';\nimport SearchBar from './SearchBar';\nimport RecentSearches from './RecentSearches';\nimport SearchResults from './SearchResults';\nimport TriggerModal from './TriggerModal';\nimport useSearchResults from '../useSearchResults';\nimport { SEARCH_ADMIN } from '../../constants';\n\nconst SearchAdmin = () => {\n  const [searchTerm, setSearchTerm] = useState('');\n  const [recentSearches, setRecentSearches] = useLocalStorage('recentSearches', []);\n  const [displaySearchModalFrame, setDisplaySearchModalFrame] = useState(false);\n  const [enableResults, setEnableResults] = useState(true);\n  const searchInputRef = useRef(null);\n  const [{ loading, results, total }, setQueryParams] = useSearchResults({\n    queryKey: SEARCH_ADMIN\n  });\n\n  useEffect(\n    () => {\n      if (searchInputRef && searchInputRef.current) {\n        searchInputRef.current.focus();\n      }\n    },\n    [displaySearchModalFrame]\n  );\n\n  const handleSearchTerm = ({ target: { value } }) => {\n    setSearchTerm(value);\n  };\n  const toggleSearchModal = () => {\n    setSearchTerm(null);\n    setEnableResults(false);\n    setDisplaySearchModalFrame(!displaySearchModalFrame);\n  };\n  const search = ({ value }) => {\n    if (!value) return;\n    !enableResults && setEnableResults(true);\n    const MAX_RECENT_SEARCHES = 5;\n    const recentSearchesCopy = recentSearches.slice();\n\n    if (!recentSearchesCopy.includes(value)) {\n      recentSearchesCopy.push(value);\n      if (recentSearchesCopy.length > MAX_RECENT_SEARCHES) {\n        recentSearchesCopy.shift();\n      }\n    }\n\n    setRecentSearches(recentSearchesCopy);\n    setQueryParams({ value });\n  };\n\n  const handleKeyDown = ({ key }) => {\n    if (key === 'Enter') {\n      if (!searchTerm) return clear();\n      search({ value: searchTerm });\n    }\n  };\n\n  const clear = () => {\n    setSearchTerm('');\n    setEnableResults(false);\n  };\n\n  const searchModalResultsClassName = classnames('modal modal--full-screen modal--search', {\n    'modal--show': displaySearchModalFrame\n  });\n\n  const isEmptySearchTermAndData = !searchTerm && !results.length;\n  const isEmptySearchTermnAndDisabledResults = !searchTerm && !enableResults;\n  const shouldDisplayRecentSearches =\n    isEmptySearchTermAndData || isEmptySearchTermnAndDisabledResults;\n\n  const showResults = enableResults && results.length;\n\n  return (\n    <div className=\"search search--header\">\n      <TriggerModal toggleSearchModal={toggleSearchModal} />\n      <div className={searchModalResultsClassName}>\n        {displaySearchModalFrame && (\n          <>\n            <div className=\"modal__header modal__header--search\">\n              <SearchBar\n                toggleSearchModal={toggleSearchModal}\n                handleKeyDown={handleKeyDown}\n                searchInputRef={searchInputRef}\n                handleSearchTerm={handleSearchTerm}\n                searchTerm={searchTerm}\n                search={() => search({ value: searchTerm })}\n              />\n            </div>\n            {shouldDisplayRecentSearches ? (\n              <RecentSearches\n                recentSearches={recentSearches}\n                handleSearchTerm={handleSearchTerm}\n                search={search}\n              />\n            ) : (\n              <>\n                {!showResults && (\n                  <div className=\"list list--search\">\n                    <div className=\"header header--list\">\n                      <h2>No Results</h2>\n                    </div>\n                  </div>\n                )}\n              </>\n            )}\n            {showResults && (\n              <SearchResults\n                currentValue={searchTerm}\n                searchTerm={searchTerm}\n                loading={loading}\n                results={results}\n                total={total}\n                setQueryParams={setQueryParams}\n                closeModal={toggleSearchModal}\n              />\n            )}\n          </>\n        )}\n      </div>\n    </div>\n  );\n};\n\nexport default SearchAdmin;\n"],"file":"SearchAdmin.js"}

package/lib/components/SearchAdmin/SearchBar/SearchBar.js

@@ -0,0 +1,72 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+require("core-js/modules/es.regexp.exec.js");
+
+require("core-js/modules/es.string.search.js");
+
+var _react = _interopRequireDefault(require("react"));
+
+var _propTypes = _interopRequireDefault(require("prop-types"));
+
+var SearchBar = function SearchBar(_ref) {
+  var handleKeyDown = _ref.handleKeyDown,
+      searchInputRef = _ref.searchInputRef,
+      handleSearchTerm = _ref.handleSearchTerm,
+      searchTerm = _ref.searchTerm,
+      toggleSearchModal = _ref.toggleSearchModal,
+      close = _ref.close,
+      search = _ref.search,
+      placeholder = _ref.placeholder;
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    className: "search__wrapper"
+  }, /*#__PURE__*/_react["default"].createElement("input", {
+    onKeyDown: handleKeyDown,
+    ref: searchInputRef,
+    placeholder: placeholder,
+    type: "text",
+    onChange: handleSearchTerm,
+    value: searchTerm
+  }), /*#__PURE__*/_react["default"].createElement("span", {
+    onClick: search,
+    role: "button",
+    className: "icon-button icon-button--search icon-button--toggle"
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "material-icons"
+  }, "search")), close && /*#__PURE__*/_react["default"].createElement("div", {
+    className: "modal__close"
+  }, /*#__PURE__*/_react["default"].createElement("i", {
+    className: "material-icons",
+    onClick: toggleSearchModal,
+    role: "button"
+  }, "close")));
+};
+
+SearchBar.propTypes = {
+  close: _propTypes["default"].bool,
+  handleKeyDown: _propTypes["default"].func.isRequired,
+  searchInputRef: _propTypes["default"].object,
+  handleSearchTerm: _propTypes["default"].func.isRequired,
+  searchTerm: _propTypes["default"].string,
+  toggleSearchModal: _propTypes["default"].func,
+  search: _propTypes["default"].func.isRequired,
+  placeholder: _propTypes["default"].string
+};
+SearchBar.defaultProps = {
+  searchTerm: '',
+  close: true,
+  placeholder: 'Search...',
+  toggleSearchModal: null,
+  searchInputRef: null
+};
+var _default = SearchBar;
+exports["default"] = _default;
+//# sourceMappingURL=SearchBar.js.map

package/lib/components/SearchAdmin/SearchBar/SearchBar.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SearchAdmin/SearchBar/SearchBar.js"],"names":["SearchBar","handleKeyDown","searchInputRef","handleSearchTerm","searchTerm","toggleSearchModal","close","search","placeholder","propTypes","PropTypes","bool","func","isRequired","object","string","defaultProps"],"mappings":";;;;;;;;;;;;;;;AAAA;;AACA;;AAEA,IAAMA,SAAS,GAAG,SAAZA,SAAY;AAAA,MAChBC,aADgB,QAChBA,aADgB;AAAA,MAEhBC,cAFgB,QAEhBA,cAFgB;AAAA,MAGhBC,gBAHgB,QAGhBA,gBAHgB;AAAA,MAIhBC,UAJgB,QAIhBA,UAJgB;AAAA,MAKhBC,iBALgB,QAKhBA,iBALgB;AAAA,MAMhBC,KANgB,QAMhBA,KANgB;AAAA,MAOhBC,MAPgB,QAOhBA,MAPgB;AAAA,MAQhBC,WARgB,QAQhBA,WARgB;AAAA,sBAUhB;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AACE,IAAA,SAAS,EAAEP,aADb;AAEE,IAAA,GAAG,EAAEC,cAFP;AAGE,IAAA,WAAW,EAAEM,WAHf;AAIE,IAAA,IAAI,EAAC,MAJP;AAKE,IAAA,QAAQ,EAAEL,gBALZ;AAME,IAAA,KAAK,EAAEC;AANT,IADF,eASE;AACE,IAAA,OAAO,EAAEG,MADX;AAEE,IAAA,IAAI,EAAC,QAFP;AAGE,IAAA,SAAS,EAAC;AAHZ,kBAIE;AAAG,IAAA,SAAS,EAAC;AAAb,cAJF,CATF,EAeGD,KAAK,iBACJ;AAAK,IAAA,SAAS,EAAC;AAAf,kBACE;AAAG,IAAA,SAAS,EAAC,gBAAb;AAA8B,IAAA,OAAO,EAAED,iBAAvC;AAA0D,IAAA,IAAI,EAAC;AAA/D,aADF,CAhBJ,CAVgB;AAAA,CAAlB;;AAmCAL,SAAS,CAACS,SAAV,GAAsB;AACpBH,EAAAA,KAAK,EAAEI,sBAAUC,IADG;AAEpBV,EAAAA,aAAa,EAAES,sBAAUE,IAAV,CAAeC,UAFV;AAGpBX,EAAAA,cAAc,EAAEQ,sBAAUI,MAHN;AAIpBX,EAAAA,gBAAgB,EAAEO,sBAAUE,IAAV,CAAeC,UAJb;AAKpBT,EAAAA,UAAU,EAAEM,sBAAUK,MALF;AAMpBV,EAAAA,iBAAiB,EAAEK,sBAAUE,IANT;AAOpBL,EAAAA,MAAM,EAAEG,sBAAUE,IAAV,CAAeC,UAPH;AAQpBL,EAAAA,WAAW,EAAEE,sBAAUK;AARH,CAAtB;AAWAf,SAAS,CAACgB,YAAV,GAAyB;AACvBZ,EAAAA,UAAU,EAAE,EADW;AAEvBE,EAAAA,KAAK,EAAE,IAFgB;AAGvBE,EAAAA,WAAW,EAAE,WAHU;AAIvBH,EAAAA,iBAAiB,EAAE,IAJI;AAKvBH,EAAAA,cAAc,EAAE;AALO,CAAzB;eAQeF,S","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nconst SearchBar = ({\n  handleKeyDown,\n  searchInputRef,\n  handleSearchTerm,\n  searchTerm,\n  toggleSearchModal,\n  close,\n  search,\n  placeholder\n}) => (\n  <div className=\"search__wrapper\">\n    <input\n      onKeyDown={handleKeyDown}\n      ref={searchInputRef}\n      placeholder={placeholder}\n      type=\"text\"\n      onChange={handleSearchTerm}\n      value={searchTerm}\n    />\n    <span\n      onClick={search}\n      role=\"button\"\n      className=\"icon-button icon-button--search icon-button--toggle\">\n      <i className=\"material-icons\">search</i>\n    </span>\n    {close && (\n      <div className=\"modal__close\">\n        <i className=\"material-icons\" onClick={toggleSearchModal} role=\"button\">\n          close\n        </i>\n      </div>\n    )}\n  </div>\n);\n\nSearchBar.propTypes = {\n  close: PropTypes.bool,\n  handleKeyDown: PropTypes.func.isRequired,\n  searchInputRef: PropTypes.object,\n  handleSearchTerm: PropTypes.func.isRequired,\n  searchTerm: PropTypes.string,\n  toggleSearchModal: PropTypes.func,\n  search: PropTypes.func.isRequired,\n  placeholder: PropTypes.string\n};\n\nSearchBar.defaultProps = {\n  searchTerm: '',\n  close: true,\n  placeholder: 'Search...',\n  toggleSearchModal: null,\n  searchInputRef: null\n};\n\nexport default SearchBar;\n"],"file":"SearchBar.js"}

package/lib/components/SearchAdmin/SearchBar/index.js

@@ -0,0 +1,16 @@
+"use strict";
+
+require("core-js/modules/es.object.define-property.js");
+
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports["default"] = void 0;
+
+var _SearchBar = _interopRequireDefault(require("./SearchBar"));
+
+var _default = _SearchBar["default"];
+exports["default"] = _default;
+//# sourceMappingURL=index.js.map

package/lib/components/SearchAdmin/SearchBar/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/components/SearchAdmin/SearchBar/index.js"],"names":["SearchBar"],"mappings":";;;;;;;;;;;AAAA;;eAEeA,qB","sourcesContent":["import SearchBar from './SearchBar';\n\nexport default SearchBar;\n"],"file":"index.js"}