Skip to content
  • Start Here
  • Platform Builds

    Full custom platform builds.

    Tome

    The platform we build on.

    Case Studies

    Proof — what we've shipped.

  • About
  • Contact
Login
Start HereAboutContact
Login

Copyright © All Rights Reserved.

Categories

All blocks162Hero14Feature9Pricing4Call to Action3Testimonials5FAQ2Logos & Clients2Media15Data & Metrics24Navigation8Banners & Notices3Editorial Layout7Editorial Devices7Rich Text Embeds3Layout & Structure12Primitives & Utilities4Actions2Content38

Bundles

Blocks›Data & Metrics

Data and metrics blocks for Payload CMS

Stat strips, changelogs, timelines, ledgers and status readouts live in this group, and Tome has 24 of them, including Metric Strip, Stats, Changelog, Timeline and Ledger. None is free today, and every one installs into the Payload project you already have.

⌕24 blocks
Columns
Starter
TimelineAgency Essentials
Starter
StatsAgency Essentials
Starter
Stat BarAgency Essentials
Pro
ChangelogExtras
Add-on
Metric StripEditorial Pack
Add-on
Status BoardEditorial Pack
Add-on
Inventory BadgeCommerce Blocks
Add-on
Progress BarLearning Blocks
Add-on
Quiz SummaryLearning Blocks
Add-on
Signal BannerSignal Block Pack
Add-on
Signal Data TableSignal Block Pack
Add-on
Signal Progress BarSignal Block Pack
Add-on
Signal StatsSignal Block Pack
Add-on
Org ChartOrg Blocks
Add-on
Case File RowDossier Blocks
Add-on
Evidence PlateDossier Blocks
Add-on
Compare LedgerDossier Blocks
Add-on
Term LedgerDossier Blocks
Add-on
Cost LedgerDossier Blocks
Add-on
LedgerDossier Blocks
Add-on
Spec SheetDossier Blocks
Add-on
Spec PlateDossier Blocks
Add-on
Dated LedgerDossier Blocks
Add-on
Campaign CountCampaign Blocks

Add one to your Payload project

You need a Payload 3 and Next.js app, a free account and an install token. The get-started guide covers the token and the .npmrc lines.

Metric Strip is in the paid Editorial Pack pack, so your token needs to cover it. The steps are the same as for a free pack.

Read the get-started guide →

  1. Install the pack

    npm install @wabbit/tome-blocks-editorial-pack
  2. Load the design tokens

    One line in your global CSS. Without it the blocks render unstyled.

    @import '@wabbit/tome-blocks-core/styles.css';
  3. Add the block to a field

    Put it in your Pages collection's blocks field, next to the blocks you already have. Run payload generate:types afterwards so your generated types know about the new block.

    import { metricStripBlock } from '@wabbit/tome-blocks-editorial-pack'
    
    // in your Pages collection:
    {
      name: 'layout',
      type: 'blocks',
      blocks: [...existingBlocks, metricStripBlock.block()],
    }
  4. Render it on the Tome grid

    import { renderers } from '@wabbit/tome-blocks-editorial-pack/render/register'
    import { adaptRenderersForPayload, RenderBlocks } from '@wabbit/tome-blocks-core/render'
    import gridStyles from '@wabbit/tome-ui/grid'
    
    const blockComponents = {
      ...yourExistingComponents,
      ...adaptRenderersForPayload(renderers),
    }
    
    <RenderBlocks
      blocks={page.layout}
      components={blockComponents}
      gridClassName={gridStyles.grid}
    />

Only if the project has never installed from our registry

Sign up at /signup (no card). Then go to Account, Credentials, claim the free license and generate your key in the same card. Add this to the project's .npmrc:

@wabbit:registry=https://npm.wabbit.com/

And this to your user-level ~/.npmrc:

//npm.wabbit.com/:_authToken=YOUR_TOKEN_HERE

Questions about data and metrics blocks

Which block shows headline numbers?
Metric Strip, in the Editorial Pack, is a row of up to six cells, each with a large value, an optional sub-label, an up or down delta and a status color. Stats, in Agency Essentials, is a grid of counters such as "99%" or "$1M", each with a title and a suffix.
Is there a block for release notes?
Changelog, in Extras, is a feed of dated entries, each with a version tag, a change-type badge (added, fixed, changed or removed) and a rich-text body. Timeline, in Agency Essentials, is a chronological event list with a date and tagline per entry.
What are the options for tables and ledgers?
Ledger, in Dossier Blocks, is a four-column table (Line, Category, Cost and What Compounds) with 2 to 10 rows and an optional accent row for a running total. Signal Data Table takes headers and rows with an optional caption, and Spec Sheet shows up to four label and value cells in a strip.
Are any data blocks free?
Not today. All 24 come from paid packs, and the Craft Library, at $250 a year, covers every paid pack. The free packs are Marketing Starter and Content Writer.

Other block categories

  • 9 blocksFeatureFeature blocks that include a stat band.
  • 5 blocksTestimonialsNumbers and quotes are the two kinds of proof.
  • 7 blocksEditorial LayoutInfo Panel pairs prose with a key-facts sidebar.

Start with the free packs.

Create a free account, generate an install token, and add a pack to the Payload project you already have. There is no card and no trial.

The Craft Library is $250 a year and adds every paid pack with full source. If you stop, what you installed stays yours.

Create a free accountSee the plans and what each includes →
  • Free: Marketing Starter and Content Writer, 19 blocks, no card.
  • Craft Library, $250 a year: every paid pack and theme, full source, scoped install tokens.
  • Single packs, $49 once: for the packs sold on their own.

Still deciding?

Let's make something worth keeping.

Start a conversation ↗

No pitch deck, no countdown timer. One conversation about what you're building — and the truth about what it takes.

We read everything that comes in.

Big Ideas, Built Better -

Big Ideas, Built Better -

Services

  • Platform Builds
  • Static Sites
  • Architecture Sprint
  • Pricing

Tome

  • What Tome is
  • Plans & Engines
  • Block Catalog
  • Compare
  • Get started
  • License

Learn

  • Start Here
  • The Library
  • Wabbit EDU

Wabbit

  • About
  • Work / Case Studies
  • The Validation Laboratory
  • Contact
  • Login

Copyright © Wabbit 2026

Privacy · Terms · Refunds & Returns · License · Support · Continuity