Skip to content

React Hooks

fin-ratios ships React hooks for building financial dashboards. Hooks are in the fin-ratios/hooks sub-path.

Installation

npm install fin-ratios
# React is a peer dependency โ€” install separately if needed
npm install react

Available Hooks

useRatios

Fetch and compute ratios for a ticker:

import { useRatios } from 'fin-ratios/hooks'

function StockCard({ ticker }: { ticker: string }) {
  const { data, loading, error } = useRatios(ticker)

  if (loading) return <p>Loading...</p>
  if (error) return <p>Error: {error.message}</p>

  return (
    <div>
      <p>P/E: {data?.pe?.toFixed(1)}</p>
      <p>ROE: {((data?.roe ?? 0) * 100).toFixed(1)}%</p>
    </div>
  )
}

useRatio

Single ratio with custom inputs:

import { useRatio } from 'fin-ratios/hooks'

const { value } = useRatio('pe', { marketCap: 3e12, netIncome: 1e11 })
// value = 30

useHealthScore

Overall financial health score (0โ€“100):

import { useHealthScore } from 'fin-ratios/hooks'

const { score, grade, loading } = useHealthScore(ticker)
// score = 74, grade = 'B+'

useScenarioDcf

Three-scenario DCF valuation:

import { useScenarioDcf } from 'fin-ratios/hooks'

const { bear, base, bull, loading } = useScenarioDcf({
  ticker,
  wacc: 0.09,
  currentPrice: 185,
})

useCompareRatios

Side-by-side comparison across multiple tickers:

import { useCompareRatios } from 'fin-ratios/hooks'

const { data, loading } = useCompareRatios(
  ['AAPL', 'MSFT', 'GOOGL'],
  ['pe', 'roe', 'fcf_margin'],
)

Notes

  • Hooks use the Yahoo Finance fetcher internally โ€” no API key required
  • Data is fetched client-side; for server-side rendering use the core functions directly
  • React 18+ required