@simplybusiness/mobius 9.3.0 → 9.3.2

package/dist/cjs/components/index.js

@@ -4316,6 +4316,7 @@ var init_Popover = __esm({
     Popover = (props) => {
       const { trigger, children, onOpen, onClose, className } = props;
       const arrowRef = (0, import_react34.useRef)(null);
+      const floatingContainerRef = (0, import_react34.useRef)(null);
       const [isOpen, setIsOpen] = (0, import_react34.useState)(false);
       const { refs, floatingStyles, context } = (0, import_react33.useFloating)({
         open: isOpen,
@@ -4347,6 +4348,25 @@ var init_Popover = __esm({
         "mobius-popover__container",
         className
       );
+      const setFloatingRef = (0, import_react34.useCallback)(
+        (node) => {
+          refs.setFloating(node);
+          floatingContainerRef.current = node;
+        },
+        [refs]
+      );
+      (0, import_react34.useEffect)(() => {
+        const el = floatingContainerRef.current;
+        if (!el) return;
+        const preventLabelActivation = (e) => {
+          const target = e.target;
+          if (!target.closest("a[href], input, select, textarea")) {
+            e.preventDefault();
+          }
+        };
+        el.addEventListener("click", preventLabelActivation);
+        return () => el.removeEventListener("click", preventLabelActivation);
+      }, [isOpen]);
       const toggleVisibility = () => {
         if (isOpen) {
           setIsOpen(false);
@@ -4378,7 +4398,7 @@ var init_Popover = __esm({
           "div",
           {
             className: containerClasses,
-            ref: refs.setFloating,
+            ref: setFloatingRef,
             style: floatingStyles,
             ...getFloatingProps(),
             children: [