Link component updates

[flacoman91]

This PR removes the type property from the Link component in favor of the appearance prop to make it like the Button component

It would be simpler to just keep things as appearance for both Button and Link

valid params can now be Warning or Destructive

Changes

• Replace type property with appearance in Link Component
• Add warning as a valid value for appearance to make it similar to the Button component
• Added configurable options so you can configure the Link component in the Storybook demo

How to test this PR

1. go to demo link, play with options and confirm both Link and Link isButton renderings are correct

Screenshots

Notes

[github-actions]

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

[natalia-fitzgerald]

@flacoman91
Generally we've tried to keep the Storybook component pages as consistent with the CFPB Design System presentation as possible (story names and ordering of the stories). Here we are adding a new "Link Text" as the first item that shows up on the page.

Perhaps you can walk me through the changes tomorrow so that I can better understand them? As a first step can you change the casing of "Link Text" to "Link text" to align with our content style guidelines for links?

What is the difference between "Warning" and "Destructive"? Are the styles identical? I only see "Destructive link" in the DS.

[natalia-fitzgerald]

@flacoman91 @anselmbradford

For the appearance options, I believe that destructive and warning refer to the same thing. Should we consolidate into one? @anselmbradford - Would it make sense for these to be called "destructive" in the code instead of warning? This would align with the user facing titles for these and would avoid confusion about their use case.

For this one, I am hoping that in the near future we can stop referring to this as "Jump" in the code since this is a "Standalone link." Would it be confusing for a React user if we used "IsStandalone" in the DSR use case even if the code continues to call this <a class="a-link a-link--jump" for the time being?

@anselmbradford
Should "jump link" or anchor link be a separate type in the DS?

[anselmbradford]

Would it make sense for these to be called "destructive" in the code instead of warning? This would align with the user facing titles for these and would avoid confusion about their use case.

Appearance is if it's a link stylized as a button? Looks like warning, primary, secondary from https://cfpb.github.io/design-system/components/buttons#types-1 and then destructive is https://cfpb.github.io/design-system/components/links#destructive-link

Should "jump link" or anchor link be a separate type in the DS?

"Inline" and "Standalone" are separate here https://cfpb.github.io/design-system/components/links#types-1

[flacoman91]

I think that warning as a button appearance may be some old legacy thing.

I am in favor of keeping it consistent and calling it destructive

I am hoping to keep the pattern consistent because the way links and buttons change their appearance in DSR use either appearance or type

https://github.com/cfpb/design-system-react/blob/main/src/components/Link/link.tsx#L48
https://github.com/cfpb/design-system-react/blob/main/src/components/Buttons/button.tsx#L21

[natalia-fitzgerald]

@flacoman91
What is meant by "Type" in the DSR?