shadcn.io is not affiliated with official shadcn/ui
Enterprise Updates Changelog Block for React
Six enterprise capabilities as a three-by-two grid of cells with overshoot, each with an icon plate, a lock badge and the release it shipped in, and a closing band with a Talk to sales Shine Button.
Installation
Overview
An enterprise-updates changelog for React with Base UI, written for Deskloom, a fictional workspace suite. A centred header sits over six cells, three by two from lg, two across from sm and one on a phone, whose lines run a little past their corners: SSO, SAML, SCIM provisioning, an audit log, data residency and custom roles, newest first. Each cell has an icon plate, an "Enterprise" outline badge with a lock, a line on what it does and when it shipped ("Shipped v4.4, Sep 16, 2026"). A closing band under the grid, with a top rule only, says what all six come with and holds the block's one Shine Button, "Talk to sales", with a ghost link to compare plans. It's built from Guides, Badge, Shine Button and Button, with CSS transitions for the entrance and your theme's tokens for every colour. For B2B products that want their enterprise work on a changelog. The capabilities and days are example data.
FAQ
How do I change the capabilities?
Edit CAPABILITIES at the top of the file. A capability has a name, an icon, a summary, a version and a shipped day as an ISO date, spelled out by a small helper so it reads the same on the server and in every browser. Keep them newest first. The grid is six cells; with another count, use a multiple of three so no cell is left empty.
Why does every cell say Enterprise?
The badge names the plan the capability belongs to, in words with a lock icon, so it reads the same in greyscale and to a screen reader. If some capabilities ship on every plan, drop the badge from those cells.
Where do the buttons go?
Both are links (href="#"): point Talk to sales at your contact page and Compare plans at your pricing.
The buttons render the link with render and nativeButton={false}.
Why is Talk to sales the only filled button?
The theme's primary colour marks one action per block. The cells and the badges stay in neutral tones, and Compare plans is a ghost button, so the page's attention goes to one place.
Related
- Pro
Cell Grid Security Updates Changelog
Security and auditsThree security advisories in cells on shared hairlines, each with its severity as an icon and a word, id, plain-language summary, affected and fixed versions as inline code and an upgrade command with a working Copy button.
- Pro
Access Control Changes Changelog
Security and auditsA permission diff matrix in an inset frame: a row for each permission, a column for each role, each cell showing what a release granted or revoked, with a release Select at the header's end.
- Pro
Permission Changes Changelog
Security and auditsAn audit of permission changes as diffs in an inset frame: each role with who changed it and when, inserted and struck-out permission rows with a sign and a word, how many people it reaches, and a toggle group that keeps only granted or revoked rows.
- Pro
Compliance Updates Changelog
Security and auditsRegulation changes as rows rail to rail: the law as a title, what changed, its effective date and stage, and a readiness bar that opens a list of its tasks.
- Pro
Pricing Updates Changelog
Roadmap and customersA changelog of plan price changes for a billing tool: four plan rows with the old price struck through, the new one in bold, the day it took effect and a reason, and a Monthly and Yearly toggle that re-reads every price.
- Pro
Audit Trail Changelog
Security and auditsA tamper-evident audit trail: six events in a framed table, each with the hash of the event before it and its own, and a Verify chain Shine Button that recomputes every hash in the browser.