shadcn.io is not affiliated with official shadcn/ui
Promise Chips Footer Block for React Aria
A footer for a privacy-first analytics tool with a wrapping row of four check-marked chips (EU data residency, No ad trackers, Open API, Export anytime) and two link columns.
Installation
Overview
A footer that makes four promises for React with React Aria. At the start are the wordmark, one sentence and a wrapping row of chips, each with a check mark: EU data residency, No ad trackers, Open API and Export anytime. At the end are two link columns in a nav labelled Footer, and a plain legal row sits under them. The only line is the page's top rule: spacing does the rest. The chips are not buttons, so they add no tab stops. Show only promises you keep. It's built from Guides, the catalog's Badge, plain links and your theme's tokens.
FAQ
How do I change the promises?
Edit the PROMISES array at the top of the file: each entry is one short phrase. Four fit on one line from lg and wrap on a phone; add more and they wrap further. Keep each to three or four words, and make sure it is true.
Are the chips interactive?
No. They are list items in a labelled list ("Our promises"), each with a decorative check mark, so a screen reader reads four items and nothing takes focus. To link a promise to the page that explains it, wrap the phrase in an anchor inside the chip.
How do screen readers move through it?
The block is a footer element, so at the end of the page it is the content-info landmark. The promises are a labelled list; the two link columns sit in one nav labelled Footer, each with an h2; the legal links are a labelled list.