Corpo

Buttons

View docs

Form controls

40

Numbers and dates

$ pcs
September 2026
SuMoTuWeThFrSa

Select the start date

cp-input--numeric right-aligns tabular figures; cp-input--trigger dresses a picker's button as a field. The range panel pairs cp-daterange__presets with a calendar whose span uses cp-calendar__day--in-range.

Dropzone

Drop files here or

PDF, XLSX, or CSV · 10 MB max

Drop files here or

PDF, XLSX, or CSV · 10 MB max

Drop files here or

PDF, XLSX, or CSV · 10 MB max

Display

Renewal

Card ending 4421 was declined.

We will retry the charge in 3 days.
Neutral Paid Overdue
Monthly recurring revenue $48,120+4.2%
Esc Cmd+K MI Exports a CSV of the current view
InvoiceClientAmountStatus
INV-2041Acme Inc.$4,200.00Paid
INV-2042Northwind$1,180.00Pending
INV-2043Globex$860.00Overdue
You are billed monthly based on active seats.
Yes — cancel from Settings and access continues until the period ends.

Feedback

Scheduled maintenance
Statements will be delayed by up to an hour on Aug 30.
Payment declined
Card ending 4421 was declined.
Import progress62%
Invoice sent
INV-2041 was sent to billing@acme.com.

Navigation

12 open invoices, 4 due this week.

Meters and heatmaps

Warehouse capacity
Budget used
Oct MonWedFri

Activity log

Ctrl+Enter to post
  1. Maria AnderscommentedOct 6, 10:02 AM
    Customer asked to hold delivery until the dock is repaired.
  2. Maria Anderschanged 1 fieldOct 6, 9:58 AM
    • Due date Nov 4, 2026 to Nov 18, 2026
  3. Order confirmedOct 5, 2:40 PM

Attachments

Approvals

1 of 2 approved

  1. Maria AndersDepartment manager

    Needed for the Q4 warehouse refit.

    ApprovedOct 6, 9:14 AM
  2. Ana SørensenFinance
    Pending

Split view

Invoice list
Select an item to see its details.
INV-2040 — phone layout, one pane with a back button.

Notifications

Notifications2 new

Items and feeds

Tree grid

AccountBalance
1000 Assets412,300.00
1500 Fixed assets250,000.00
3000 Equity273,550.00

Filters

Status: Overdue Client: Acme Inc. 2 of 84 invoices

App navigation

Verification and layout

Globex CorporationC-1003 · ap@globex.example
Create “glo”
Finance Operations
Invoice list
INV-2041 — Acme Inc.

More

Invoices

84 invoices across all clients.

Billing

Where invoices for this account are sent.

Invoices go to billing@acme.com on the first business day of each month.

Security

Two-factor authentication is required for all members.

Status: Overdue Operational
$
Uptime99.98% Latency84ms
No invoices yet Invoices you create will show up here.

Spreadsheet

MetricQ1Q2Balance
1Revenue12,40012,89625,296.00
2Net position-86027,736.00

A DataTable grid preset: row numbers, in-place editing (B2 is open in the editor), tones for derived and negative values, bold inset balance cells.

Accounting

Amount

12,400.00 (1,234.56) −1,234.56 – $27,736.00

Accounting figures: paren negatives with 1ch padding on positives for decimal alignment, red negatives, zero dash, hanging currency.

Ledger register

DateMemoRef DrCrBalance
Opening balance 24,180.40
2026-01-03Client invoice #1042AR 12,400.00 36,580.40
2026-01-05Office lease — JanuaryCHK 2201 3,800.00 32,780.40
2026-01-31Payroll run — JanuaryJE-88 9,640.00 23,140.40
Salaries expense 8,000.00
Payroll taxes 1,640.00
Totals 12,400.0013,440.00 23,140.40

Register with opening row, indented split postings, green-bar banding, running balance, and a footed period total.

T-account

Cash
Dr
Balance b/d24,180.40
Invoice #104212,400.00
36,580.40
Cr
Office lease3,800.00
Balance c/d32,780.40
36,580.40

Trial balance

Meridian Consulting LLC
Trial Balance
As of January 31, 2026
AccountRefDrCr
Cash101$32,780.40
Accounts Payable201$4,320.00
Owner's Equity30128,210.40
Totals $32,780.40 $32,530.40
Out of balance by 250.00 — Dr over

An unproved balance keeps the single rule and renders the error strip; only Σ Dr = Σ Cr earns the double rule.

Journal entry

Balanced
AccountMemoDrCr
Totals 3,800.003,800.00

Statement

Meridian Consulting LLC
410 Harbor Blvd, Suite 300
Costa Mesa, CA 92626
Invoice
№ INV-1044
February 2, 2026
Bill to
Hollis & Marsh LLP
DescriptionQtyRateAmount
Advisory retainer — January16,500.00$6,500.00
Implementation support22185.004,070.00
Subtotal10,570.00
Sales tax (7.75%)819.18
Total due$11,389.18
Remit to: Meridian Consulting LLC · Routing 122000247 · Account 4410098833 · Ref INV-1044
Net 30. A 1.5% monthly finance charge applies to past-due balances.

Record page

Sales order

SO-10482

Draft
Customer
Northwind Traders
Ordered
Oct 5, 2026
Due
Nov 4, 2026
Total
2,397.44
Customer

Who the order bills and ships to.

Terms

cp-record — header, key-facts strip, main column and aside (stacks below 768px). cp-form-section is a fieldset over a cp-form-grid--{2,3,4}; fields span with cp-field--span-{2,3,full}.

Line items

ItemDescriptionQtyUnit priceDisc.TaxAmount
1,256.40
899.00
75.00
Subtotal2,230.40
Tax167.04
Total$2,397.44

cp-lines — a document's editable lines. Cells hold ordinary corpo controls that shed their field chrome; the totals block reuses the cp-foot footing rules.

DataTable

3/4
INV-1042Acme Inc.12,400.00
INV-1043Northwind8,150.00
INV-1039Globex(1,200.00)
Total19,350.00
1 selected

Sorting/filtering/selection over the cp-table chassis — sortable headers with aria-sort, quick-filter toolbar with a match count, accent-tinted selected rows, a totals row (tfoot), and the bulk action bar shown while rows are selected. Behavior lives in the React layer; this specimen is static.

Data grid

InvoiceClientRegionOwnerIssuedDueSubtotalTaxTotalStatus
INV-2000Acme Inc.North AmericaA. Shah2026-09-012026-10-01350.0027.12377.12Paid
INV-2001NorthwindLATAMJ. Lindqvist2026-09-022026-10-028,269.00640.858,909.85Pending
INV-2002GlobexAPACL. Moreau2026-09-032026-10-0316,188.001,254.5717,442.57Overdue
INV-2003InitechEMEAM. Okafor2026-09-042026-10-0424,107.001,868.2925,975.29Draft
INV-2004UmbrellaNorth AmericaR. Tanaka2026-09-052026-10-0532,026.002,482.0134,508.01Paid
INV-2005HooliLATAMA. Shah2026-09-062026-10-0639,945.003,095.7443,040.74Pending
INV-2006Acme Inc.APACJ. Lindqvist2026-09-072026-10-0747,864.003,709.4651,573.46Overdue
INV-2007NorthwindEMEAL. Moreau2026-09-082026-10-087,783.00603.188,386.18Draft
INV-2008GlobexNorth AmericaM. Okafor2026-09-092026-10-0915,702.001,216.9016,918.90Paid
INV-2009InitechLATAMR. Tanaka2026-09-102026-10-1023,621.001,830.6325,451.63Pending
INV-2010UmbrellaAPACA. Shah2026-09-112026-10-1131,540.002,444.3533,984.35Overdue
INV-2011HooliEMEAJ. Lindqvist2026-09-122026-10-1239,459.003,058.0742,517.07Draft
INV-2012Acme Inc.North AmericaL. Moreau2026-09-132026-10-1347,378.003,671.8051,049.80Paid
INV-2013NorthwindLATAMM. Okafor2026-09-142026-10-147,297.00565.527,862.52Pending
INV-2014GlobexAPACR. Tanaka2026-09-152026-10-1515,216.001,179.2416,395.24Overdue
INV-2015InitechEMEAA. Shah2026-09-162026-10-1623,135.001,792.9624,927.96Draft
INV-2016UmbrellaNorth AmericaJ. Lindqvist2026-09-172026-10-1731,054.002,406.6833,460.68Paid
INV-2017HooliLATAML. Moreau2026-09-182026-10-1838,973.003,020.4141,993.41Pending
INV-2018Acme Inc.APACM. Okafor2026-09-192026-10-1946,892.003,634.1350,526.13Overdue
INV-2019NorthwindEMEAR. Tanaka2026-09-202026-10-206,811.00527.857,338.85Draft
INV-2020GlobexNorth AmericaA. Shah2026-09-212026-10-2114,730.001,141.5815,871.58Paid
INV-2021InitechLATAMJ. Lindqvist2026-09-222026-10-2222,649.001,755.3024,404.30Pending
INV-2022UmbrellaAPACL. Moreau2026-09-232026-10-2330,568.002,369.0232,937.02Overdue
INV-2023HooliEMEAM. Okafor2026-09-242026-10-2438,487.002,982.7441,469.74Draft
INV-2024Acme Inc.North AmericaR. Tanaka2026-09-252026-10-2546,406.003,596.4750,002.47Paid
INV-2025NorthwindLATAMA. Shah2026-09-262026-10-266,325.00490.196,815.19Pending
INV-2026GlobexAPACJ. Lindqvist2026-09-272026-10-2714,244.001,103.9115,347.91Overdue
INV-2027InitechEMEAL. Moreau2026-09-282026-10-2822,163.001,717.6323,880.63Draft
INV-2028UmbrellaNorth AmericaM. Okafor2026-09-012026-10-0130,082.002,331.3632,413.36Paid
INV-2029HooliLATAMR. Tanaka2026-09-022026-10-0238,001.002,945.0840,946.08Pending
INV-2030Acme Inc.APACA. Shah2026-09-032026-10-0345,920.003,558.8049,478.80Overdue
INV-2031NorthwindEMEAJ. Lindqvist2026-09-042026-10-045,839.00452.526,291.52Draft
INV-2032GlobexNorth AmericaL. Moreau2026-09-052026-10-0513,758.001,066.2414,824.24Paid
INV-2033InitechLATAMM. Okafor2026-09-062026-10-0621,677.001,679.9723,356.97Pending
INV-2034UmbrellaAPACR. Tanaka2026-09-072026-10-0729,596.002,293.6931,889.69Overdue
INV-2035HooliEMEAA. Shah2026-09-082026-10-0837,515.002,907.4140,422.41Draft
INV-2036Acme Inc.North AmericaJ. Lindqvist2026-09-092026-10-0945,434.003,521.1348,955.13Paid
INV-2037NorthwindLATAML. Moreau2026-09-102026-10-105,353.00414.865,767.86Pending
INV-2038GlobexAPACM. Okafor2026-09-112026-10-1113,272.001,028.5814,300.58Overdue
INV-2039InitechEMEAR. Tanaka2026-09-122026-10-1221,191.001,642.3022,833.30Draft
40 invoices1,006,820.0078,028.541,084,848.54

cp-table--grid — dense spreadsheet-like records: gridlines, ~28px rows, sticky header inside a bounded height. cp-table--striped adds zebra rows; cp-table--pin-first keeps the selection and first data column in view while scrolling sideways. The tfoot totals row sticks to the bottom.

Dependency graph

Click to select · click a ready or in-progress node again to advance it · drag to pan · wheel to zoom

Profile card

AS Available
Ana Sørensen
Staff engineer
Payments platform
Capacity
Utilization70%
On-call load25%
Kotlin Postgres Payments Incident response
Leads the invoice pipeline rebuild. Previously scaled the ledger service through two provider migrations; mentors two engineers on the team.

License assignment

Enterprise Datadog Observability · Annual contract
Cost per seat$28/mo
RenewalMar 1, 2027
Seats in use9 of 12
Metrics, traces, and log management for the platform group. Includes on-call paging integration.

Description list

Invoice number
INV-2041
Bill to
Acme Inc.
Amount due
$4,200.00
Due date
Aug 30, 2026
Payment terms
Net 30
Purchase order
PO-8841
Cardholder
Maya Chen
Card
Visa ending 4421
Expires
08/28
Billing ZIP
10013

Timeline

  1. Invoice created Aug 4, 9:14 AM
    INV-2041 was drafted for Acme Inc.
  2. Invoice sent Aug 4, 9:16 AM
    Sent to billing@acme.com
  3. Reminder sent Aug 12, 8:00 AM
    Net 30 terms end in two days
  4. Payment declined Aug 14, 4:02 PM
    Card ending 4421 was declined.
  5. Payment received Aug 15, 10:41 AM
    $4,200.00 posted to the ledger

Stepper

  1. 1 Submit request
  2. 2 Manager review
  3. 3 Finance approval
  4. 4 Issue purchase order

Tree view

Charts

Weekly active seats 1,284

Hover the line chart for the crosshair tooltip; hover a bar for its value.

App shell

Invoices
AS
Outstanding $12,4803 overdue

Below 768px the sidebar goes off-canvas — the topbar toggle opens it, the scrim closes it.