ComponentsFinancial table

Financial table

A market-index table with country flags, YTD performance, sparklines, daily movement, and selected-row state. It is structured for dense financial dashboards where row scanning matters.

Dependencies

Motionnext-themesclsx

Copy below cli

npx shadcn add @bjork-ui/financial-table

How to use

import { FinancialTable } from "@/components/isaiahbjork/tables/financial-table";export function Demo() {  return <FinancialTable title="Index" indices={indices} />;}
Index
YTD Return
P/LTM EPS
Div yield
Mkt cap
Volume
2-day chart
Price
Daily performance
Dow Jones USA
USA
+0.40%
18.74
+2.00%
28.0B
1.7M
$333.90
-0.20
-0.06%
S&P 500 USA
USA
+11.72%
7.42
+1.44%
399.6B
24.6M
$428.72
-0.82
-0.19%
Nasdaq USA
USA
+36.59%
N/A
+0.54%
199.9B
18.9M
$362.97
-1.73
-0.47%
TSX Canada
Canada
-0.78%
6.06
+2.56%
3.7B
771.5M
$32.96
+0.19
+0.58%
Grupo BMV Mexico
Mexico
+4.15%
8.19
+2.34%
1.2B
1.1M
$53.70
-1.01
-1.85%
Ibovespa Brazil
Brazil
+11.19%
6.23
+9.46%
4.9B
6.8M
$29.28
-0.06
-0.22%