visits-style 1.4.1 → 1.4.2

package/dist/index.cjs.js

@@ -683,11 +683,13 @@ function Tooltip$1({
   disabled
 }) {
   const [open, setOpen] = React.useState(false);
+  const nodeId = react.useId();
   const {
     refs,
     floatingStyles,
     context
   } = react.useFloating({
+    nodeId,
     open,
     placement: position,
     middleware: [react.shift(), react.flip(), react.offset({
@@ -710,7 +712,7 @@ function Tooltip$1({
       ref: refs.setReference,
       ...getReferenceProps()
     }),
-    /* @__PURE__ */ jsxRuntime.jsx(Portal$1, { children: open ? /* @__PURE__ */ jsxRuntime.jsx(react.FloatingFocusManager, { context, modal: false, children: /* @__PURE__ */ jsxRuntime.jsx(TooltipWrapper, { className, ref: refs.setFloating, role: "tooltip", $color: color, style: floatingStyles, ...getFloatingProps(), children: label }) }) : null })
+    /* @__PURE__ */ jsxRuntime.jsx(Portal$1, { children: open ? /* @__PURE__ */ jsxRuntime.jsx(TooltipWrapper, { className, ref: refs.setFloating, role: "tooltip", $color: color, style: floatingStyles, ...getFloatingProps(), children: label }) : null })
   ] });
 }
 const TooltipWrapper = /* @__PURE__ */ styledComponents.styled.div.withConfig({
@@ -750,6 +752,7 @@ function stopPropagation$1(e) {
     return;
   e.stopPropagation();
 }
+
 const Popover = React.forwardRef(({
   position,
   label,
@@ -765,11 +768,13 @@ const Popover = React.forwardRef(({
   ...rest
 }, ref) => {
   const [open, setOpen] = React.useState(false);
+  const nodeId = react.useId();
   const {
     refs,
     floatingStyles,
     context
   } = react.useFloating({
+    nodeId,
     placement: position,
     middleware: [react.shift(), react.flip({
       fallbackAxisSideDirection: "end"
@@ -820,10 +825,10 @@ const Popover = React.forwardRef(({
     }),
     /* @__PURE__ */ jsxRuntime.jsx(Portal$1, { children: open ? /* @__PURE__ */ jsxRuntime.jsx(react.FloatingOverlay, { "data-testid": "visits-style-shadow", onClick: handleBlur, style: {
       zIndex: 9996
-    }, children: /* @__PURE__ */ jsxRuntime.jsx(react.FloatingFocusManager, { context, modal: false, children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { role: "tooltip", ref: refs.setFloating, color, style: floatingStyles, ...getFloatingProps({
+    }, children: /* @__PURE__ */ jsxRuntime.jsx(Tooltip, { role: "tooltip", ref: refs.setFloating, color, style: floatingStyles, ...getFloatingProps({
       ...rest,
       onClick: stopPropagation$1
-    }), children }) }) }) : null })
+    }), children }) }) : null })
   ] });
 });
 Popover.displayName = "Popover";

package/dist/index.es.js

@@ -2,7 +2,7 @@ import { styled, css, keyframes } from 'styled-components';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import React, { forwardRef, useLayoutEffect, useEffect, useRef, useMemo, useImperativeHandle, useState, cloneElement, Children, useCallback, createElement } from 'react';
 import { getLuminance, transparentize, darken } from 'polished';
-import { useFloating, shift, flip, offset, useInteractions, useHover, useClientPoint, FloatingFocusManager, autoUpdate, useClick, FloatingOverlay, useId, useDismiss, useTransitionStyles } from '@floating-ui/react';
+import { useId, useFloating, shift, flip, offset, useInteractions, useHover, useClientPoint, autoUpdate, useClick, FloatingOverlay, useDismiss, useTransitionStyles } from '@floating-ui/react';
 import { createPortal } from 'react-dom';
 
 const Wrapper$6 = /* @__PURE__ */ styled.div.withConfig({
@@ -675,11 +675,13 @@ function Tooltip$1({
   disabled
 }) {
   const [open, setOpen] = useState(false);
+  const nodeId = useId();
   const {
     refs,
     floatingStyles,
     context
   } = useFloating({
+    nodeId,
     open,
     placement: position,
     middleware: [shift(), flip(), offset({
@@ -702,7 +704,7 @@ function Tooltip$1({
       ref: refs.setReference,
       ...getReferenceProps()
     }),
-    /* @__PURE__ */ jsx(Portal$1, { children: open ? /* @__PURE__ */ jsx(FloatingFocusManager, { context, modal: false, children: /* @__PURE__ */ jsx(TooltipWrapper, { className, ref: refs.setFloating, role: "tooltip", $color: color, style: floatingStyles, ...getFloatingProps(), children: label }) }) : null })
+    /* @__PURE__ */ jsx(Portal$1, { children: open ? /* @__PURE__ */ jsx(TooltipWrapper, { className, ref: refs.setFloating, role: "tooltip", $color: color, style: floatingStyles, ...getFloatingProps(), children: label }) : null })
   ] });
 }
 const TooltipWrapper = /* @__PURE__ */ styled.div.withConfig({
@@ -742,6 +744,7 @@ function stopPropagation$1(e) {
     return;
   e.stopPropagation();
 }
+
 const Popover = forwardRef(({
   position,
   label,
@@ -757,11 +760,13 @@ const Popover = forwardRef(({
   ...rest
 }, ref) => {
   const [open, setOpen] = useState(false);
+  const nodeId = useId();
   const {
     refs,
     floatingStyles,
     context
   } = useFloating({
+    nodeId,
     placement: position,
     middleware: [shift(), flip({
       fallbackAxisSideDirection: "end"
@@ -812,10 +817,10 @@ const Popover = forwardRef(({
     }),
     /* @__PURE__ */ jsx(Portal$1, { children: open ? /* @__PURE__ */ jsx(FloatingOverlay, { "data-testid": "visits-style-shadow", onClick: handleBlur, style: {
       zIndex: 9996
-    }, children: /* @__PURE__ */ jsx(FloatingFocusManager, { context, modal: false, children: /* @__PURE__ */ jsx(Tooltip, { role: "tooltip", ref: refs.setFloating, color, style: floatingStyles, ...getFloatingProps({
+    }, children: /* @__PURE__ */ jsx(Tooltip, { role: "tooltip", ref: refs.setFloating, color, style: floatingStyles, ...getFloatingProps({
       ...rest,
       onClick: stopPropagation$1
-    }), children }) }) }) : null })
+    }), children }) }) : null })
   ] });
 });
 Popover.displayName = "Popover";

package/dist/utils/stopPropagation.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export default function stopPropagation(e?: React.MouseEvent<Element>): void;

package/package.json

@@ -2,7 +2,7 @@
   "name": "visits-style",
   "repository": "https://github.com/visits-works/visits-style",
   "homepage": "https://github.com/visits-works/visits-style",
-  "version": "1.4.1",
+  "version": "1.4.2",
   "type": "module",
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.es.js",