Custom React hook for listening to whether or not the window is currently printing.

useIsPrinting.ts

/**
 * Allows you to subscribe to whether or not the window is currently printing (user invoked the system print dialog).
 *
 * @returns Whether or not the document is currently printing.
 */
export default function useIsPrinting(): boolean {
  const [printing, setIsPrinting] = useState(
    window.matchMedia('print').matches
  );

  useEffect(() => {
    const beforeprint = () => setIsPrinting(true);
    const afterprint = () => setIsPrinting(false);

    window.addEventListener('beforeprint', beforeprint);
    window.addEventListener('afterprint', afterprint);

    return () => {
      window.removeEventListener('beforeprint', beforeprint);
      window.removeEventListener('afterprint', afterprint);
    };
  }, []);

  return printing;
}

useIsPrintingWithCallbacks.ts

type UseIsPrintingOptions = {
  beforePrintCallback: () => void;
  afterPrintCallback: () => void;
};

/**
 * Allows you to subscribe to whether or not the window is currently printing (user invoked the system print dialog).
 *
 * @param options An optional object with callbacks to be invoked when the window goes into and/or out of printing mode.
 * @returns Whether or not the document is currently printing.
 */
export default function useIsPrinting(options?: UseIsPrintingOptions): boolean {
  const [printing, setIsPrinting] = useState(
    window.matchMedia('print').matches
  );

  useEffect(() => {
    const beforeprint = () => {
      options?.beforePrintCallback?.call(null);
      setIsPrinting(true);
    };

    const afterprint = () => {
      options?.afterPrintCallback?.call(null);
      setIsPrinting(false);
    };

    window.addEventListener('beforeprint', beforeprint);
    window.addEventListener('afterprint', afterprint);

    return () => {
      window.removeEventListener('beforeprint', beforeprint);
      window.removeEventListener('afterprint', afterprint);
    };
  }, [options?.afterPrintCallback, options?.beforePrintCallback]);

  return printing;
}