DS style barrel, Storybook style entry, and consumption docs

[flacoman91]

Redo of #613 to get the automatic tests and preview to run.

Thanks arpitjain099

this resolves #578

Go to slug preview link to validate:

https://cfpb.github.io/design-system-react/pr-previews/pr-618/?path=/story/components-verified-headings--slug&globals=responsivePreview:all

[github-actions]

PR Preview Action v1.8.1
🚀 View preview at https://cfpb.github.io/design-system-react/pr-previews/pr-618/
Built to branch gh-pages at 2026-06-27 01:22 UTC. Preview will be ready when the GitHub Pages deployment is complete.

[anselmbradford]

I noticed in other components you don't generally drill this deep into the DS scss. Does this line seem right?

[flacoman91]

You're right. I tested this branch in a boilerplate repo here (yarn install; yarn start)

https://github.com/cfpb/dsr-test

None of the DS/DSR styles are coming through.

I just did
https://github.com/cfpb/dsr-test/blob/main/src/App.tsx#L33-L34

import { Button, Heading } from "@cfpb/design-system-react";
<Button label="Click me" />
<Heading type={"slug"}>Slug type</Heading>

I'm not sure if the expectation is you can just do a component export into a template and just call it a day, or more configuration is supposed to done regarding the included scss files?

We should update the readme with instructions on the correct way to set up DSR to get it to work in an app.

Here's what it looks like in the demo app:

[flacoman91]

Ok, i did some more digging and found out why the styles aren't coming through.

If the consuming app includes all of DS, it will work, but if all you need is a simple button or minimal changes we shouldn't be importing everything.

Here's a PR in that repo I made:
cfpb/dsr-test#2

This points to the current DSR without this fix. We should also note that this scss include pattern also exists in the pagination component
https://github.com/cfpb/design-system-react/blame/main/src/components/Pagination/pagination.tsx#L1