CRM

BlockPro

A sales pipeline: open value by stage, the deals in it with filtering and sorting, the win rate and cycle length, and the last few touches.

Pipeline

What is open, what closed, and what moved.

Open pipeline

Open pipeline: $590,000, up +15.2% vs last period

Closed won

Closed won: $186,000, up +13.4% vs last period

Win rate

Win rate: 34%, up +17.2% vs last period

Sales cycle

Sales cycle: 31 days, down -13.9% vs last period

By stage

Where the open value sits.

  • Lead$84,000
  • Qualified$142,000
  • Proposal$236,000
  • Negotiation$128,000
  • Lead6 deals · $84,000
  • Qualified4 deals · $142,000
  • Proposal3 deals · $236,000
  • Negotiation2 deals · $128,000

Deals

8 open deals.

8 deals match the filter.

Open

Acme Corp

Dana Whitfield

Proposal$120,000
PNPriya Nair

Northwind Traders

Miguel Santos

Negotiation$88,000
SOSam Okafor

Globex

Lee Tanaka

Proposal$76,000
PNPriya Nair

Initech

Qualified$54,000
SOSam Okafor

Umbrella Health

Rosa Diaz

Negotiation$40,000
ABAisha Bello

Stark Logistics

Qualified$38,000
ABAisha Bello

Wayne Foods

Terry Osei

Lead$24,000
PNPriya Nair

Hooli

Lead$12,000
SOSam Okafor
Page 1 of 1
Rows per page

Recent activity

The last few touches, newest first.

  1. Called Dana Whitfield at Acmecall

    Pricing questions on the enterprise tier. Sending a revised proposal today.
  2. Demo with Northwind Tradersmeeting

    Security review scheduled for next week.
  3. Emailed Globexemail

    Sent the SOC 2 report.
  4. Note on Initechnote

    Champion moved teams; need a new sponsor.

A still, rendered at build time from the same story the tests run. The block itself is interactive; the copy that runs is the one the CLI installs.

Installation

The block is written to your blocks directory, and everything it is built from is installed alongside it. This one needs a licence: sign in once with the CLI and the install is the same command.

Terminal
pnpm dlx @dowel-ui/cli add crm

Built from

A block is not a black box. Every piece is a component you already have documentation for, and can change independently.

Props

CrmBlock

PropTypeDefault
deals (required)CrmDeal[]
pipelineValue (required)

Open pipeline, as a number. Formatted by formatMoney.

number
stages (required)CrmStage[]
wonValue (required)

Closed-won in the period.

number
actionsReactNode
activityCrmActivity[][]
comparisonLabelstring"vs last period"
cycleDays

Average days from open to close. Lower is better.

number
descriptionstring"What is open, what closed, and what moved."
formatMoney

Formats every amount. The currency is a presentation choice, so it is yours.

(value: number) => string(value) => defaultMoney.format(value)
onNewDeal() => void
onOpenDeal

Opens a deal. When omitted, a deal with an href renders as a link instead.

(deal: CrmDeal) => void
previousCycleDaysnumber
previousPipelineValuenumber
previousWinRatenumber
previousWonValuenumber
titlestring"Pipeline"
winRate

Share of closed deals that were won, 0–1.

number
classNamestring

Accessibility

The pipeline is one bar split by stage, with the same figures listed beside it as numbers, so nobody reads a proportion off a coloured segment; the meter announces the total and its legend names every stage. Sales cycle is declared lower-is-better, so a slowing pipeline is not painted green. The deal filter has a real label and announces the matching count politely, and each Open button is named after its deal rather than being one of ten identical buttons.

Source

One file, written by dowel add crm with imports rewritten to your own path alias, and yours to edit from then on.

This is a Pro block.

The preview is the real block, rendered from its own story — a still of it, not a copy of it. The source is installed by the CLI once this machine is signed in with a licence key — dowel login checks the key against the registry before storing it — and lands in your project as a file you own, exactly like a free block.

Registry name: crm