You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

39 lines
964 B

2 months ago
  1. // @flow
  2. import getWindow from './getWindow';
  3. import getDocumentElement from './getDocumentElement';
  4. import getWindowScrollBarX from './getWindowScrollBarX';
  5. import isLayoutViewport from './isLayoutViewport';
  6. import type { PositioningStrategy } from '../types';
  7. export default function getViewportRect(
  8. element: Element,
  9. strategy: PositioningStrategy
  10. ) {
  11. const win = getWindow(element);
  12. const html = getDocumentElement(element);
  13. const visualViewport = win.visualViewport;
  14. let width = html.clientWidth;
  15. let height = html.clientHeight;
  16. let x = 0;
  17. let y = 0;
  18. if (visualViewport) {
  19. width = visualViewport.width;
  20. height = visualViewport.height;
  21. const layoutViewport = isLayoutViewport();
  22. if (layoutViewport || (!layoutViewport && strategy === 'fixed')) {
  23. x = visualViewport.offsetLeft;
  24. y = visualViewport.offsetTop;
  25. }
  26. }
  27. return {
  28. width,
  29. height,
  30. x: x + getWindowScrollBarX(element),
  31. y,
  32. };
  33. }