feat(AppRoot): add disableParentTransformForPositionFixedElements prop

Перенёс `translate3d(0, 0, 0)` из CSS в компонент.

packages/vkui/src/components/AppRoot/AppRoot.test.tsx

@@ -95,6 +95,12 @@ describe('AppRoot', () => {
       render(<AppRoot mode="embedded" />).unmount();
       expect(document.body).toContainElement(portalRoot1 as HTMLElement);
     });
+    it('should disable CSS transform on parent for mode="embedded"', () => {
+      const { rerender, container } = render(<AppRoot mode="embedded" />);
+      expect(container.style.transform).toBe('translate3d(0, 0, 0)');
+      rerender(<AppRoot mode="embedded" disableParentTransformForPositionFixedElements />);
+      expect(container.style.transform).toBe('');
+    });
     it('Accepts custom portal root', () => {
       const customPortalRoot = document.createElement('div');
       let portalRoot: HTMLElement | undefined | null;

packages/vkui/src/components/AppRoot/AppRoot.tsx

@@ -43,8 +43,17 @@ export interface AppRootProps extends React.HTMLAttributes<HTMLDivElement> {
    * Кастомный root-элемент портала
    */
   portalRoot?: HTMLElement | React.RefObject<HTMLElement> | null;
-  /** Disable portal for components */
+  /**
+   * Отключает рендер всплывающих компонентов в отдельном контейнере
+   */
   disablePortal?: boolean;
+  /**
+   * По умолчанию, mode="embedded" переносит систему координат элементов с `position: fixed` на
+   * свой контейнер через `transform: translate3d(0, 0, 0)`.
+   *
+   * Это поведение можно отключить с помощью этого параметра.
+   */
+  disableParentTransformForPositionFixedElements?: boolean;
 }
 
 /**
@@ -56,6 +65,7 @@ export const AppRoot = ({
   scroll = 'global',
   portalRoot: portalRootProp = null,
   disablePortal,
+  disableParentTransformForPositionFixedElements,
   className,
   safeAreaInsets,
   ...props
@@ -107,12 +117,22 @@ export const AppRoot = ({
 
     const parent = rootRef.current?.parentElement;
     const classes = ['vkui__root'].concat(mode === 'embedded' ? 'vkui__root--embedded' : []);
-    parent?.classList.add(...classes);
+    if (parent) {
+      if (!disableParentTransformForPositionFixedElements) {
+        parent.style.transform = 'translate3d(0, 0, 0)';
+      }
+      parent.classList.add(...classes);
+    }
 
     return () => {
-      parent?.classList.remove(...classes);
+      if (parent) {
+        if (!disableParentTransformForPositionFixedElements) {
+          parent.style.transform = '';
+        }
+        parent.classList.remove(...classes);
+      }
     };
-  }, []);
+  }, [disableParentTransformForPositionFixedElements]);
 
   useIsomorphicLayoutEffect(() => {
     if (mode === 'full') {

packages/vkui/src/styles/common.css

@@ -21,7 +21,6 @@
 }
 
 .vkui__root--embedded {
-  transform: translate3d(0, 0, 0);
   overflow-x: hidden;
 }