caliper uidocs
DemoSign inGet Pro

Finance home

Pro

Where finance starts the day: cash across every entity and currency in one reporting total, lines to match, claims to approve and invoices past due, and each entity's progress through the close.

Installs components/ui/finance-home.tsxDepends on @radix-ui/react-slot, d3-shape, lucide-reactMotion none in component source
pnpm dlx shadcn@latest add @caliper/finance-home

Overview

3 entities · closing September 2026

Cash, all entities
€405,510
in EUR at today’s rates
Halden Ltd
€251,180
GBP, USD · 2 accounts
Halden Portugal
€96,310
EUR · 1 account
Halden BV
€58,020
EUR · 1 account
Cash by entity, in EUR, last 90 days

Cash by entity, in EUR, last 90 days
PeriodHalden LtdHalden PortugalHalden BVTotal
16 Jul20556710143841232348237
17 Jul20580610152341647348976
18 Jul20583210173642038349606
19 Jul20567110206242393350126
20 Jul20536410247942704350547
21 Jul20495610295842965350879
22 Jul20450110347143171351143
23 Jul20405110398443322351357
24 Jul20366310446543420351548
25 Jul20338710488443471351742
26 Jul20326910521443481351964
27 Jul20334510543243460352237
28 Jul20364010552143420352581
29 Jul20416910547343373353015
30 Jul20493510528543333353553
31 Jul20592510496343311354199
1 Aug20711710451943319354955
2 Aug20847710397243367355816
3 Aug20996210334843462356772
4 Aug21152210267643611357809
5 Aug21310210198643814358902
6 Aug21465010131244072360034
7 Aug21611110068544380361176
8 Aug21743710013441453359024
9 Aug2185859136441842351791
10 Aug2174659103442256350755
11 Aug2041399083945964340942
12 Aug2046139910346391350107
13 Aug2069189918646807352911
14 Aug2209879939747198367582
15 Aug2208309972147554368105
16 Aug22052410013647866368526
17 Aug22011810061548127368860
18 Aug21966310112748335369125
19 Aug21921410164148487369342
20 Aug21882410212348586369533
21 Aug21854610254348637369726
22 Aug21842410287548647369946
23 Aug21849610309548627370218
24 Aug21878710318648588370561
25 Aug21931210314148541370994
26 Aug22007410295548500371529
27 Aug22106010263548478372173
28 Aug22224910219348485372927
29 Aug22360610164848532373786
30 Aug22509010102648627374743
31 Aug22664710035448774375775
1 Sept2282299966448977376870
2 Sept2297779898949234378000
3 Sept2312419836149541379143
4 Sept2325689780849894380270
5 Sept2337219735650282381359
6 Sept2346669702550696382387
7 Sept2353829682747843380052
8 Sept2358628844948271372582
9 Sept2340498852948686371264
10 Sept2200428873852358361138
11 Sept2198879738052715369982
12 Sept2216459779453027372466
13 Sept2352809827253290386842
14 Sept2348259878453498387107
15 Sept2343749929753651387322
16 Sept2339849978053751387515
17 Sept23370310020253803387708
18 Sept23357910053553814387928
19 Sept23364610075753795388198
20 Sept23393310085253755388540
21 Sept23445510080853709388972
22 Sept23521110062553668389504
23 Sept23619510030753645390147
24 Sept2373819986753652390900
25 Sept2387359932453698391757
26 Sept2402169870353792392711
27 Sept2417749803153938393743
28 Sept2433549734254139394835
29 Sept2449059666654395395966
30 Sept2463699603754702397108
1 Oct2477009548355054398237
2 Oct2488559502955442399326
3 Oct2498059469555855400355
4 Oct2505269449556282401303
5 Oct2510109443456710402154
6 Oct2512619451257126402899
7 Oct2512979471954238400254
8 Oct2511468671954595392460
9 Oct2487848713154909390824
10 Oct2343418760858452380401
11 Oct2338879644058662388989
12 Oct2354979695458816391267
13 Oct2491449743858917405499

Needs you

  • 9 bank lines to matchAcross 4 accounts
  • 6 expense claims to approve€939
  • 7 invoices past due€37,523

Owed to you, by age

  • Not yet due€8,251
  • 1–30 days€35,885
  • 31–60 days€0
  • Over 60 days€1,638

Bills due within a week

  • AWS EMEA11 days late£2,318.40
  • Figma4 days late£540.00
  • EDP ComercialDue 15 Oct · not approved€412.30
  • WeWork MoorgateDue 16 Oct£4,200.00
  • LinearDue 18 OctUS$960.00

Close September 2026

When to use #

Use it for

  • The landing screen of a finance or accounting product.

Skip it when

  • Revenue analytics; use the revenue explorer.

Installation #

terminal
pnpm dlx shadcn@latest add @caliper/finance-home

Adds its 12 files to components/ui/, each with its own stylesheet, and installs their packages. Pro installs with your access token, set up once per project. See Pro access. The first part also adds Caliper UI’s tokens; import them once as in Installation.

Usage #

Import it from your copy of the source. The example behind the preview comes with the source.

example.tsx
import { FinanceHome } from "@/components/ui/finance-home"

The worked example comes with Pro

The 144-line example behind the preview opens here with a Pro or Team licence.

Checking your licence…

API reference #

FinanceHome

component
PropTypeDefaultDescription
data *FinanceData—
onShow((screen: FinanceScreen) => void)—Opens a screen, e.g. from "Match lines".
onEntityChange((entityId: string) => void)—Switches to an entity, from its close progress.
todaystringnew Date().toISOString().slice(0, 10)ISO date treated as today.
classNamestring—

Accessibility #

It is built on native elements and keeps aria-hidden and aria-label in step with state.

No custom key handling; Tab and the native activation keys do the work.

Motion #

It declares no animation in its component source. Any transition comes from its stylesheet, which uses the duration tokens that collapse to instant under prefers-reduced-motion.