useTerminalSize() React Hook

use-terminal-size.ts

import { useEffect, useState } from 'react'

/**
 * React hook which provides the size of the terminal, based on https://usehooks.com/useWindowSize/
 * Great for usage with Ink (https://npmjs.com/package/ink)
 */
export function useTerminalSize() {
  const [terminalSize, setTerminalSize] = useState([
    process.stdout.columns,
    process.stdout.rows
  ])

  useEffect(() => {
    // Handler to call on window resize
    function handleResize() {
      // Set window width/height to state
      setTerminalSize([
        process.stdout.columns,
        process.stdout.rows
      ])
    }

    // Add event listener
    process.stdout.on('resize', handleResize)

    // Remove event listener on cleanup
    return () => {
      process.stdout.off('resize', handleResize)
    }
  }, []) // Empty array ensures that effect is only run on mount

  return terminalSize
}