fix(OnboardingTooltipContainer): revert tooltip container from context (#8735)

This reverts commit 82dbd80.

Author: SevereCloud

packages/vkui/src/components/OnboardingTooltip/OnboardingTooltip.tsx

@@ -15,14 +15,14 @@ import {
   useFloatingMiddlewaresBootstrap,
   usePlacementChangeCallback,
 } from '../../lib/floating';
+import { useIsomorphicLayoutEffect } from '../../lib/useIsomorphicLayoutEffect';
 import { warnOnce } from '../../lib/warnOnce';
 import { DEFAULT_ARROW_HEIGHT, DEFAULT_ARROW_PADDING } from '../FloatingArrow/DefaultIcon';
 import type { FloatingArrowProps } from '../FloatingArrow/FloatingArrow';
 import { FocusTrap } from '../FocusTrap/FocusTrap';
 import { useNavTransition } from '../NavTransitionContext/NavTransitionContext';
 import { TOOLTIP_MAX_WIDTH, TooltipBase, type TooltipBaseProps } from '../TooltipBase/TooltipBase';
 import { onboardingTooltipContainerAttr } from './OnboardingTooltipContainer';
-import { useOnboardingTooltipContext } from './OnboardingTooltipContext';
 import styles from './OnboardingTooltip.module.css';
 
 const warn = warnOnce('OnboardingTooltip');
@@ -109,7 +109,6 @@ export const OnboardingTooltip = ({
   const generatedId = React.useId();
   const tooltipId = idProp || generatedId;
   const { entering } = useNavTransition();
-  const { containerRef: tooltipContainerRef } = useOnboardingTooltipContext();
 
   const [arrowRef, setArrowRef] = React.useState<HTMLDivElement | null>(null);
   const [tooltipContainer, setTooltipContainer] = React.useState<HTMLElement | null>(null);
@@ -196,23 +195,18 @@ export const OnboardingTooltip = ({
     );
   }
 
-  React.useEffect(
+  useIsomorphicLayoutEffect(
     function initialize() {
       const referenceEl = childRef.current;
-      if (!referenceEl) {
-        return;
-      }
-      const tooltipContainer =
-        tooltipContainerRef.current ||
-        // eslint-disable-next-line no-restricted-properties
-        referenceEl.closest<HTMLDivElement>(`[${onboardingTooltipContainerAttr}]`);
-      if (tooltipContainer) {
-        setTooltipContainer(tooltipContainer);
+      if (referenceEl) {
+        setTooltipContainer(
+          referenceEl.closest<HTMLDivElement>(`[${onboardingTooltipContainerAttr}]`), // eslint-disable-line no-restricted-properties
+        );
         setPositionStrategy(referenceEl.style.position === 'fixed' ? 'fixed' : 'absolute');
         refs.setReference(referenceEl);
       }
     },
-    [childRef, refs, tooltipContainerRef],
+    [childRef],
   );
 
   if (process.env.NODE_ENV === 'development') {

packages/vkui/src/components/OnboardingTooltip/OnboardingTooltipContainer.tsx

@@ -1,10 +1,6 @@
-'use client';
-
 import * as React from 'react';
-import { useExternRef } from '../../hooks/useExternRef';
 import { defineComponentDisplayNames } from '../../lib/react/defineComponentDisplayNames';
 import type { HasComponent, HasDataAttribute } from '../../types';
-import { OnboardingTooltipContext } from './OnboardingTooltipContext';
 
 export const onboardingTooltipContainerAttr = 'data-onboarding-tooltip-container';
 
@@ -22,16 +18,11 @@ export const OnboardingTooltipContainer: React.ForwardRefExoticComponent<
   // eslint-disable-next-line react/display-name -- используется defineComponentDisplayNames
 > = React.forwardRef<HTMLDivElement, OnboardingTooltipContainerProps>(
   ({ fixed = false, Component = 'div', ...props }, ref) => {
-    const containerRef = useExternRef(ref);
     const dataProps = {
       [onboardingTooltipContainerAttr]: fixed ? 'fixed' : 'true',
     };
 
-    return (
-      <OnboardingTooltipContext.Provider value={{ containerRef }}>
-        <Component {...dataProps} {...props} ref={containerRef} />
-      </OnboardingTooltipContext.Provider>
-    );
+    return <Component {...dataProps} {...props} ref={ref} />;
   },
 );