applications/calendar/src/app/hooks/useRect.ts

   1 import { useLayoutEffect, useState } from 'react';
   2
   3 import type { Rect } from './observeRect';
   4 import observeRect from './observeRect';
   5
   6 export function useRect(nodeRef: HTMLElement | null, observe = true, once = false, dependency?: any) {
   7     const [rect, setRect] = useState<Rect | undefined>(undefined);
   8
   9     useLayoutEffect(() => {
  10         if (!nodeRef || !observe) {
  11             setRect(undefined);
  12             return;
  13         }
  14
  15         if (once) {
  16             let onceState = false;
  17
  18             const stop = observeRect(nodeRef, (rect: Rect) => {
  19                 if (!onceState) {
  20                     onceState = true;
  21                     stop();
  22                     setRect(rect);
  23                 }
  24             });
  25
  26             return stop;
  27         }
  28
  29         return observeRect(nodeRef, (rect) => {
  30             setRect(rect);
  31         });
  32     }, [nodeRef, observe, once, dependency]);
  33
  34     return rect;
  35 }