carbon-react 141.0.7 → 141.0.8

package/esm/components/popover-container/popover-container.component.js

@@ -1,5 +1,5 @@
 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); }
-import React, { useCallback, useEffect, useRef, useState } from "react";
+import React, { useCallback, useEffect, useRef, useState, useMemo } from "react";
 import PropTypes from "prop-types";
 import { Transition } from "react-transition-group";
 import { flip, offset } from "@floating-ui/dom";
@@ -56,14 +56,14 @@ export const renderClose = ({
 })), /*#__PURE__*/React.createElement(Icon, {
   type: "close"
 }));
-function getPopoverMiddleware(shouldCoverButton) {
-  return [offset(shouldCoverButton ? ({
+function usePopoverMiddleware(shouldCoverButton) {
+  return useMemo(() => [offset(shouldCoverButton ? ({
     rects
   }) => ({
     mainAxis: -rects.reference.height
   }) : 6), flip({
     fallbackStrategy: "initialPlacement"
-  })];
+  })], [shouldCoverButton]);
 }
 export const PopoverContainer = ({
   children,
@@ -93,6 +93,7 @@ export const PopoverContainer = ({
   const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
   const isOpen = isControlled ? open : isOpenInternal;
   const reduceMotion = !useMediaQuery("screen and (prefers-reduced-motion: no-preference)");
+  const popoverMiddleware = usePopoverMiddleware(shouldCoverButton);
   const closePopover = useCallback(ev => {
     if (!isControlled) {
       setIsOpenInternal(false);
@@ -198,7 +199,7 @@ export const PopoverContainer = ({
     reference: popoverReference,
     placement: position === "right" ? "bottom-start" : "bottom-end",
     popoverStrategy: disableAnimation || reduceMotion ? "fixed" : "absolute",
-    middleware: getPopoverMiddleware(shouldCoverButton),
+    middleware: popoverMiddleware,
     childRefOverride: popoverContentNodeRef
   }, childrenToRender(state))));
 };

package/lib/components/popover-container/popover-container.component.js

@@ -67,14 +67,14 @@ const renderClose = ({
   type: "close"
 }));
 exports.renderClose = renderClose;
-function getPopoverMiddleware(shouldCoverButton) {
-  return [(0, _dom.offset)(shouldCoverButton ? ({
+function usePopoverMiddleware(shouldCoverButton) {
+  return (0, _react.useMemo)(() => [(0, _dom.offset)(shouldCoverButton ? ({
     rects
   }) => ({
     mainAxis: -rects.reference.height
   }) : 6), (0, _dom.flip)({
     fallbackStrategy: "initialPlacement"
-  })];
+  })], [shouldCoverButton]);
 }
 const PopoverContainer = ({
   children,
@@ -104,6 +104,7 @@ const PopoverContainer = ({
   const popoverContainerId = title ? `PopoverContainer_${guid.current}` : undefined;
   const isOpen = isControlled ? open : isOpenInternal;
   const reduceMotion = !(0, _useMediaQuery.default)("screen and (prefers-reduced-motion: no-preference)");
+  const popoverMiddleware = usePopoverMiddleware(shouldCoverButton);
   const closePopover = (0, _react.useCallback)(ev => {
     if (!isControlled) {
       setIsOpenInternal(false);
@@ -209,7 +210,7 @@ const PopoverContainer = ({
     reference: popoverReference,
     placement: position === "right" ? "bottom-start" : "bottom-end",
     popoverStrategy: disableAnimation || reduceMotion ? "fixed" : "absolute",
-    middleware: getPopoverMiddleware(shouldCoverButton),
+    middleware: popoverMiddleware,
     childRefOverride: popoverContentNodeRef
   }, childrenToRender(state))));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "carbon-react",
-  "version": "141.0.7",
+  "version": "141.0.8",
   "description": "A library of reusable React components for easily building user interfaces.",
   "files": [
     "lib",