Monthly Digest

Monthly digest

Issue 12 · May 2026

May in about three minutes

Everything that shipped, everything that broke, and the one decision we are still arguing about internally.

About this block

Monthly DigestPRO

A monthly round-up grouped into what shipped, what broke, and what is still undecided, each entry a linked hairline row, beside a sticky tile floating the month's live figures.

News40: Monthly Digest

A monthly round-up grouped into what shipped, what broke and what is still undecided, each entry a linked hairline row, beside a sticky tile floating the month's live figures.

Upgrade to Pro

Pro blocks install through the shadcn CLI with your license key and ship their full source. Docs and live previews stay open to everyone, so you can read every block's details first.

Upgrade Now

Installation

Swap YOUR_EMAIL and YOUR_KEY for the email and license key on your account. Find your license key on your account page.

Radix flavor

bash
npx shadcn add "https://ui.beste.co/r/news40?email=YOUR_EMAIL&license_key=YOUR_KEY"

Base UI flavor

bash
npx shadcn add "https://ui.beste.co/r-base/news40?email=YOUR_EMAIL&license_key=YOUR_KEY"

This installs the block to components/beste/block/news40.tsx, the dashboard33 metrics piece it floats on the tile (installed to components/beste/piece/dashboard33.tsx), and the badge23 and button21 components it uses for the eyebrow and the actions.

Quick start

The installed file exports news40Demo alongside the block: the exact props behind the preview above. Spread it to get a working digest in one line.

tsx
import { News40, news40Demo } from "@/components/beste/block/news40";

export default function DigestPage() {
  return <News40 {...news40Demo} />;
}

Then replace the demo with your own props. Written out, a trimmed setup looks like this:

tsx
import { Dashboard33 } from "@/components/beste/piece/dashboard33";
import { News40 } from "@/components/beste/block/news40";

export default function DigestPage() {
  return (
    <News40
      badge={{ label: "Monthly digest" }}
      issueLabel="Issue 12 · May 2026"
      heading="May in about three minutes"
      description="Everything that shipped, everything that broke, and one decision we are still arguing about."
      sections={[
        {
          label: "Shipped",
          summary: "Four things went out, one after eleven weeks of testing.",
          entries: [
            {
              title: "Multi-site capacity sharing",
              detail: "Four clinics can share one waiting list while keeping their own rules.",
              href: "/news/multi-site",
            },
          ],
        },
        {
          label: "Broke",
          summary: "One incident, forty-one minutes, and the write-up is public.",
          entries: [
            {
              title: "Slow booking pages for one region",
              detail: "A 06:40 deploy degraded the booking service in the UK region.",
              href: "/news/incident-april",
            },
          ],
        },
      ]}
      media={
        <Dashboard33
          title="May, on the platform"
          range="1 to 31 May"
          items={[{ label: "Bookings", value: "18.4k", delta: "+9%", direction: "up" }]}
        />
      }
      image={{ src: "/backdrops/blue.jpg", alt: "Soft blue gradient backdrop" }}
      mediaCaption="The same three numbers every month, so you can watch them move."
      buttons={[
        { label: "Read the full issue", href: "/digest/12" },
        { label: "Get it by email", href: "/subscribe" },
      ]}
    />
  );
}

Props

PropTypeDefaultDescription
badge{ label: string }Eyebrow at the top left, rendered through Badge23
issueLabelstringIssue and month line, opposite the eyebrow
headingstringSection heading in the left column of the header
descriptionstringSupporting paragraph, right-aligned from md up
sectionsDigestSection[][]Groups of entries, each with a one-line summary
mediaReactNodeLive asset on the sticky tile, dashboard33 in the demo
image{ src: string; alt: string }Backdrop behind the media tile
mediaCaptionstringCaption under the tile
buttonsActionLink[][]Actions, first solid and the rest outlined
classNamestringExtra classes for the outer section
ts
type ActionLink = {
  label: string;
  href: string;
};

type Entry = {
  title: string;
  detail: string;
  href: string;
};

type DigestSection = {
  label: string;
  summary: string;
  entries: Entry[];
};

Behavior notes

  • summary is required on every section and sits inline beside the label on a shared baseline, so each group states its own scale before you read the entries.
  • Section labels are free text rather than a fixed union, so the third group can be "Still arguing about" rather than a status. That is the point of the block: it is a digest, not a changelog.
  • Entries are whole Link elements with md:px-4 alongside the hover fill, so the highlight extends slightly past the text on wider screens.
  • Sections use mb-10 with last:mb-0, and entries carry border-t, so rules appear between entries and above the first one in each section.
  • The tile column is lg:sticky lg:top-24 lg:self-start. The self-start is required, otherwise the column stretches to the row height and sticky has nothing to travel within.
  • issueLabel sits opposite the eyebrow at the top rather than in the body, which is the convention this set uses for dated documents.
  • The layout is a 1.8fr to 1fr split, giving the digest most of the width while the figures tile stays only as wide as it needs.

More News blocks

View all News
PRO

news24

Newsletter with Featured

Newsletter signup sidebar with featured story and additional headlines. Sticky subscription form.

PRO

news43

Minimal Issue Archive

A narrow archive reduced to one hairline row per issue, the subject line on the left and the date it went out on the right, with nothing else on the page to read past.

PRO

news28

Data Statistics Dashboard

Data journalism style cards with animated numbers, change indicators, progress bars, and key statistics.

PRO

news25

Category Hub

News categories grid with story counts, top story preview, and browse links.

PRO

news16

Quick News Bites

Compact quick news list with bullet points, source attribution, and external link indicators. Perfect for news digests.

PRO

news34

Newsletter Preview

Email newsletter style news layout with editor's note, categorized stories, and subscription CTA.