mirror of
https://github.com/zoriya/v10.git
synced 2026-08-16 02:45:09 +00:00
fix: hydration mismatch in Tooltip and Popover (#190)
This commit is contained in:
@@ -9,6 +9,7 @@ import {
|
||||
useCallback,
|
||||
useContext,
|
||||
useEffect,
|
||||
useId,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
@@ -266,7 +267,8 @@ function PopoverPopup({ id, className, children }: PopoverPopupProps): JSX.Eleme
|
||||
const { popupRef, triggerRef, transitionStatus, placement } = usePopoverContext();
|
||||
const triggerElement = triggerRef.current;
|
||||
|
||||
const popupId = useMemo(() => id ?? `popover-${Math.random().toString(36).substring(2, 9)}`, [id]);
|
||||
const uniqueId = useId();
|
||||
const popupId = id ?? uniqueId;
|
||||
|
||||
useEffect(() => {
|
||||
if (!popupRef.current || !triggerRef.current) return;
|
||||
|
||||
@@ -9,6 +9,7 @@ import {
|
||||
useCallback,
|
||||
useContext,
|
||||
useEffect,
|
||||
useId,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
@@ -307,7 +308,8 @@ function TooltipPopup({ id, className = '', children }: TooltipPopupProps): JSX.
|
||||
const { popupRef, triggerRef, transitionStatus, placement } = useTooltipContext();
|
||||
const triggerElement = triggerRef.current;
|
||||
|
||||
const popupId = useMemo(() => id ?? `tooltip-${Math.random().toString(36).substring(2, 9)}`, [id]);
|
||||
const uniqueId = useId();
|
||||
const popupId = id ?? uniqueId;
|
||||
|
||||
useEffect(() => {
|
||||
if (!popupRef.current || !triggerRef.current) return;
|
||||
|
||||
Reference in New Issue
Block a user