@redhat-cloud-services/frontend-components 3.4.6 → 3.4.10

package/ConditionalFilter/ConditionalFilter.js

@@ -108,7 +108,6 @@ var ConditionalFilter = /*#__PURE__*/function (_Component) {
       return width <= _this.breakpointConstant;
     });
     _this.breakpointConstant = parseInt(_global_breakpoint_md["default"].value.replace('px', ''));
-    _this.containerRef = /*#__PURE__*/_react["default"].createRef();
     _this.state = {
       isOpen: false,
       stateValue: undefined,
@@ -222,14 +221,10 @@ var ConditionalFilter = /*#__PURE__*/function (_Component) {
         })
       })), ActiveComponent && /*#__PURE__*/_react["default"].createElement(_SplitItem.SplitItem, {
         isFilled: true
-      }, /*#__PURE__*/_react["default"].createElement("div", {
-        ref: this.containerRef
       }, /*#__PURE__*/_react["default"].createElement(ActiveComponent, (0, _extends2["default"])({}, activeItem.type !== _conditionalFilterConstants.conditionalFilterType.custom && {
         placeholder: placeholder || activeItem.placeholder || "Filter by ".concat(activeItem.label),
         id: activeItem.filterValues && activeItem.filterValues.id || currentValue
-      }, activeItem.filterValues, {
-        containerRef: this.containerRef.current
-      })))))));
+      }, activeItem.filterValues))))));
     }
   }]);
   return ConditionalFilter;

package/ConditionalFilter/GroupFilter.js

@@ -64,8 +64,7 @@ var Group = function Group(_ref) {
       groups = _ref$groups === void 0 ? [] : _ref$groups,
       onChange = _ref.onChange,
       selected = _ref.selected,
-      isFilterable = _ref.isFilterable,
-      containerRef = _ref.containerRef;
+      isFilterable = _ref.isFilterable;
 
   var _useState = (0, _react.useState)({}),
       _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
@@ -83,6 +82,7 @@ var Group = function Group(_ref) {
       setIsOpen = _useState6[1];
 
   var toggleRef = (0, _react.useRef)();
+  var containerRef = (0, _react.useRef)();
   var menuRef = (0, _react.useRef)();
   (0, _react.useEffect)(function () {
     setStateSelected(selected);
@@ -174,8 +174,10 @@ var Group = function Group(_ref) {
     });
   };
 
-  return /*#__PURE__*/_react["default"].createElement(_Popper.Popper, {
-    appendTo: containerRef,
+  return /*#__PURE__*/_react["default"].createElement("div", {
+    ref: containerRef
+  }, /*#__PURE__*/_react["default"].createElement(_Popper.Popper, {
+    appendTo: containerRef.current,
     trigger: /*#__PURE__*/_react["default"].createElement(_MenuToggle.MenuToggle, {
       ref: toggleRef,
       onClick: onToggleClick,
@@ -214,7 +216,7 @@ var Group = function Group(_ref) {
       value: ""
     })))),
     isVisible: isOpen
-  });
+  }));
 };
 
 Group.propTypes = {
@@ -243,8 +245,7 @@ Group.propTypes = {
     }))
   })),
   onChange: _propTypes["default"].func.isRequired,
-  selectedTags: _propTypes["default"].shape({}),
-  containerRef: _propTypes["default"].element
+  selectedTags: _propTypes["default"].shape({})
 };
 var _default = Group;
 exports["default"] = _default;

package/esm/ConditionalFilter/ConditionalFilter.js

@@ -76,7 +76,6 @@ var ConditionalFilter = /*#__PURE__*/function (_Component) {
     });
 
     _this.breakpointConstant = parseInt(globalBreakpointMd.value.replace('px', ''));
-    _this.containerRef = /*#__PURE__*/React.createRef();
     _this.state = {
       isOpen: false,
       stateValue: undefined,
@@ -191,14 +190,10 @@ var ConditionalFilter = /*#__PURE__*/function (_Component) {
         })
       })), ActiveComponent && /*#__PURE__*/React.createElement(SplitItem, {
         isFilled: true
-      }, /*#__PURE__*/React.createElement("div", {
-        ref: this.containerRef
       }, /*#__PURE__*/React.createElement(ActiveComponent, _extends({}, activeItem.type !== conditionalFilterType.custom && {
         placeholder: placeholder || activeItem.placeholder || "Filter by ".concat(activeItem.label),
         id: activeItem.filterValues && activeItem.filterValues.id || currentValue
-      }, activeItem.filterValues, {
-        containerRef: this.containerRef.current
-      })))))));
+      }, activeItem.filterValues))))));
     }
   }]);
 

package/esm/ConditionalFilter/GroupFilter.js

@@ -31,8 +31,7 @@ var Group = function Group(_ref) {
       groups = _ref$groups === void 0 ? [] : _ref$groups,
       onChange = _ref.onChange,
       selected = _ref.selected,
-      isFilterable = _ref.isFilterable,
-      containerRef = _ref.containerRef;
+      isFilterable = _ref.isFilterable;
 
   var _useState = useState({}),
       _useState2 = _slicedToArray(_useState, 2),
@@ -50,6 +49,7 @@ var Group = function Group(_ref) {
       setIsOpen = _useState6[1];
 
   var toggleRef = useRef();
+  var containerRef = useRef();
   var menuRef = useRef();
   useEffect(function () {
     setStateSelected(selected);
@@ -141,8 +141,10 @@ var Group = function Group(_ref) {
     });
   };
 
-  return /*#__PURE__*/React.createElement(Popper, {
-    appendTo: containerRef,
+  return /*#__PURE__*/React.createElement("div", {
+    ref: containerRef
+  }, /*#__PURE__*/React.createElement(Popper, {
+    appendTo: containerRef.current,
     trigger: /*#__PURE__*/React.createElement(MenuToggle, {
       ref: toggleRef,
       onClick: onToggleClick,
@@ -181,7 +183,7 @@ var Group = function Group(_ref) {
       value: ""
     })))),
     isVisible: isOpen
-  });
+  }));
 };
 
 Group.propTypes = {
@@ -210,7 +212,6 @@ Group.propTypes = {
     }))
   })),
   onChange: PropTypes.func.isRequired,
-  selectedTags: PropTypes.shape({}),
-  containerRef: PropTypes.element
+  selectedTags: PropTypes.shape({})
 };
 export default Group;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@redhat-cloud-services/frontend-components",
-    "version": "3.4.6",
+    "version": "3.4.10",
     "description": "Common components for RedHat Cloud Services project.",
     "main": "index.js",
     "module": "esm/index.js",
@@ -43,8 +43,8 @@
     "dependencies": {
         "@redhat-cloud-services/frontend-components-utilities": ">=3.0.0",
         "sanitize-html": "^2.3.2",
-        "@scalprum/core": "^0.0.11",
-        "@scalprum/react-core": "0.1.1"
+        "@scalprum/core": "^0.1.1",
+        "@scalprum/react-core": "^0.1.7"
     },
     "devDependencies": {
         "@patternfly/patternfly": ">=4.102.2",