@inveniosoftware/react-invenio-app-ils 1.0.0-alpha.70 → 1.0.0-alpha.71

package/CHANGES.md

@@ -1,5 +1,11 @@
 # Changes
 
+Version 1.0.0-alpha.71 (released 2022-10-07)
+
+- series: improve search tip popup and fix searchbar autofocus
+- covers: fix alignment in front page
+- covers: add box shadows to small and large sizes
+
 Version 1.0.0-alpha.70 (released 2022-08-24)
 
 - disable Google fonts
@@ -28,12 +34,10 @@ Version 1.0.0-alpha.65 (released 2022-02-21)
 
 - other authors: fix `et al.` display across the site
 
-
 Version 1.0.0-alpha.64 (released 2022-02-07)
 
 - update npm dependencies
 
-
 Version 1.0.0-alpha.63 (released 2022-02-01)
 
 - backoffice: display missing alternate titles for documents

package/dist/cjs/index.js

@@ -13201,16 +13201,6 @@ var LiteratureSearch = /*#__PURE__*/function (_Component) {
         }
       }
     });
-
-    _this.renderLoader = function () {
-      return /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Loader, {
-        active: true,
-        size: "huge",
-        inline: "centered",
-        className: "full-height"
-      });
-    };
-
     return _this;
   }
 
@@ -13239,9 +13229,7 @@ var LiteratureSearch = /*#__PURE__*/function (_Component) {
         className: "literature-search-container"
       }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Container, null, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.SearchBar, Object.assign({
         placeholder: invenioConfig.APP.HOME_SEARCH_BAR_PLACEHOLDER
-      }, invenioConfig.APP.SEARCH_BAR_PROPS, {
-        responsiveAutofocus: true
-      })), /*#__PURE__*/React__default["default"].createElement(SearchGuideLink, null))), /*#__PURE__*/React__default["default"].createElement(Media, {
+      }, invenioConfig.APP.SEARCH_BAR_PROPS)), /*#__PURE__*/React__default["default"].createElement(SearchGuideLink, null))), /*#__PURE__*/React__default["default"].createElement(Media, {
         greaterThanOrEqual: "computer"
       }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Container, {
         fluid: true,
@@ -13251,9 +13239,7 @@ var LiteratureSearch = /*#__PURE__*/function (_Component) {
         stackable: true,
         relaxed: true,
         className: "grid-documents-search"
-      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.ResultsLoader, {
-        renderElement: this.renderLoader
-      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
+      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.ResultsLoader, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
         width: 3,
         className: "search-aggregations"
       }, /*#__PURE__*/React__default["default"].createElement(SearchAggregation$1, {
@@ -13282,7 +13268,7 @@ LiteratureSearch.defaultProps = {
 };
 var LiteratureSearch$1 = Overridable__default["default"].component('LiteratureSearch', LiteratureSearch);
 
-var _excluded$k = ["className", "onKeyPressHandler", "onSearchHandler", "onPasteHandler", "onChangeHandler", "placeholder", "ref", "responsiveAutofocus"];
+var _excluded$k = ["className", "onKeyPressHandler", "onSearchHandler", "onPasteHandler", "onChangeHandler", "placeholder", "ref", "focusOnRender"];
 var SearchBarILS = /*#__PURE__*/function (_Component) {
   _inherits(SearchBarILS, _Component);
 
@@ -13335,12 +13321,10 @@ var SearchBarILS = /*#__PURE__*/function (_Component) {
   _createClass(SearchBarILS, [{
     key: "componentDidMount",
     value: function componentDidMount() {
-      var responsiveAutofocus = this.props.responsiveAutofocus;
+      var focusOnRender = this.props.focusOnRender;
       var autofocus = screenIsWiderThan(Breakpoints.computer);
 
-      if (responsiveAutofocus && autofocus) {
-        this.inputRef.current.focus();
-      } else if (!responsiveAutofocus) {
+      if (focusOnRender && autofocus) {
         this.inputRef.current.focus();
       }
     }
@@ -13357,7 +13341,7 @@ var SearchBarILS = /*#__PURE__*/function (_Component) {
           onChangeHandler = _this$props.onChangeHandler,
           placeholder = _this$props.placeholder;
           _this$props.ref;
-          _this$props.responsiveAutofocus;
+          _this$props.focusOnRender;
           var rest = _objectWithoutProperties(_this$props, _excluded$k);
 
       var currentValue = this.state.currentValue;
@@ -13397,7 +13381,7 @@ SearchBarILS.defaultProps = {
   onChangeHandler: null,
   placeholder: '',
   className: '',
-  responsiveAutofocus: false,
+  focusOnRender: true,
   ref: null
 };
 
@@ -13432,8 +13416,7 @@ var HomeSearchBar = /*#__PURE__*/function (_Component) {
         onPasteHandler: function onPasteHandler() {},
         onSearchHandler: this.onSearchExecute,
         placeholder: invenioConfig.APP.HOME_SEARCH_BAR_PLACEHOLDER,
-        className: "fs-headline",
-        responsiveAutofocus: true
+        className: "fs-headline"
       });
     }
   }]);
@@ -53600,7 +53583,7 @@ var DocumentPanelMobile = /*#__PURE__*/function (_Component) {
           isLoading = _this$props.isLoading,
           loansInfo = _this$props.loansInfo;
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "document-panel",
+        className: "literature-panel",
         "data-test": doc.metadata ? doc.metadata.pid : 0
       }, /*#__PURE__*/React__default["default"].createElement(Overridable__default["default"], {
         id: "DocumentPanel.layout",
@@ -53692,7 +53675,7 @@ var DocumentPanel = /*#__PURE__*/function (_Component) {
       }, /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Media, {
         greaterThanOrEqual: "tablet"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "document-panel",
+        className: "literature-panel",
         "data-test": doc.metadata ? doc.metadata.pid : 0
       }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid, {
         columns: 3
@@ -53950,8 +53933,7 @@ var DocumentDetails$1 = /*#__PURE__*/function (_Component) {
         onPasteHandler: function onPasteHandler() {},
         onSearchHandler: this.onSearchClick,
         placeholder: invenioConfig.APP.HOME_SEARCH_BAR_PLACEHOLDER,
-        className: "fs-headline",
-        responsiveAutofocus: true
+        className: "fs-headline"
       })))), /*#__PURE__*/React__default["default"].createElement(DocumentDetailsLayout, {
         error: error,
         isLoading: isLoading,
@@ -57129,16 +57111,6 @@ var SeriesLiteratureSearch = /*#__PURE__*/function (_React$Component) {
 
     _this = _super.call.apply(_super, [this].concat(args));
     _this.modelName = 'LITERATURE';
-
-    _this.renderLoader = function () {
-      return /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Loader, {
-        active: true,
-        size: "huge",
-        inline: "centered",
-        className: "full-height"
-      });
-    };
-
     return _this;
   }
 
@@ -57170,21 +57142,9 @@ var SeriesLiteratureSearch = /*#__PURE__*/function (_React$Component) {
         defaultSortingOnEmptyQueryString: defaultSortingOnEmptyQueryString
       }, /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Container, {
         className: "series-details-search-container"
-      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.SearchBar, Object.assign({
-        placeholder: "Search for volumes or issues..."
-      }, invenioConfig.APP.SEARCH_BAR_PROPS, {
-        responsiveAutofocus: true
-      })), /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Popup, {
-        content: "You can search by volume using volume field (e.g., volume:1)",
-        trigger: /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Icon, {
-          name: "question circle outline",
-          size: "small"
-        })
-      })), /*#__PURE__*/React__default["default"].createElement(Media, {
+      }, /*#__PURE__*/React__default["default"].createElement(SeriesDetailsSearch, null)), /*#__PURE__*/React__default["default"].createElement(Media, {
         greaterThanOrEqual: "computer"
-      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.ResultsLoader, {
-        renderElement: this.renderLoader
-      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.EmptyResults, null), /*#__PURE__*/React__default["default"].createElement(reactSearchkit.Error, null), /*#__PURE__*/React__default["default"].createElement(SearchControls, {
+      }, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.ResultsLoader, null, /*#__PURE__*/React__default["default"].createElement(reactSearchkit.EmptyResults, null), /*#__PURE__*/React__default["default"].createElement(reactSearchkit.Error, null), /*#__PURE__*/React__default["default"].createElement(SearchControls, {
         modelName: this.modelName
       }), /*#__PURE__*/React__default["default"].createElement(reactSearchkit.ResultsMultiLayout, null), /*#__PURE__*/React__default["default"].createElement(SearchFooter$1, null))), /*#__PURE__*/React__default["default"].createElement(Media, {
         lessThan: "computer"
@@ -57196,6 +57156,26 @@ var SeriesLiteratureSearch = /*#__PURE__*/function (_React$Component) {
 
   return SeriesLiteratureSearch;
 }(React__default["default"].Component);
+var SeriesDetailsSearch = reactSearchkit.withState(function (_ref) {
+  var updateQueryState = _ref.updateQueryState,
+      currentQueryState = _ref.currentQueryState;
+
+  var onBtnSearchClick = function onBtnSearchClick(queryString) {
+    updateQueryState(_objectSpread2(_objectSpread2({}, currentQueryState), {}, {
+      queryString: queryString
+    }));
+  };
+
+  return /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Popup, {
+    trigger: /*#__PURE__*/React__default["default"].createElement(SearchBarILS, {
+      onSearchHandler: onBtnSearchClick,
+      placeholder: "Search for volumes or issues...",
+      focusOnRender: false
+    }),
+    content: "You can search by volume using volume field (e.g., volume:1)",
+    on: "focus"
+  });
+});
 
 var SeriesAllTitles = function SeriesAllTitles(_ref) {
   var title = _ref.title,
@@ -57663,9 +57643,10 @@ var SeriesPanelMobile = /*#__PURE__*/function (_Component) {
           isLoading = _this$props.isLoading,
           series = _this$props.series;
       return /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "series-panel",
         "data-test": series.metadata ? series.metadata.pid : 0
-      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
+      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid, {
+        className: "literature-panel"
+      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
         mobile: 16,
         textAlign: "center"
       }, /*#__PURE__*/React__default["default"].createElement(LiteratureCover$1, {
@@ -57795,9 +57776,10 @@ var SeriesPanel = /*#__PURE__*/function (_Component) {
       return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement(Media, {
         greaterThanOrEqual: "tablet"
       }, /*#__PURE__*/React__default["default"].createElement("div", {
-        className: "series-panel",
         "data-test": series.metadata ? series.metadata.pid : 0
-      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
+      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid, {
+        className: "literature-panel"
+      }, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Row, null, /*#__PURE__*/React__default["default"].createElement(semanticUiReact.Grid.Column, {
         width: 5
       }, /*#__PURE__*/React__default["default"].createElement(LiteratureCover$1, {
         url: _get__default["default"](series, 'metadata.cover_metadata.urls.large'),
@@ -58035,8 +58017,7 @@ var SeriesDetails$1 = /*#__PURE__*/function (_React$Component) {
         onPasteHandler: function onPasteHandler() {},
         onSearchHandler: this.onSearchClick,
         placeholder: invenioConfig.APP.HOME_SEARCH_BAR_PLACEHOLDER,
-        className: "fs-headline",
-        responsiveAutofocus: true
+        className: "fs-headline"
       })))), /*#__PURE__*/React__default["default"].createElement(SeriesDetailsLayout, {
         series: series,
         error: error,