Button, Project Solar - focus style updates (HDS-5666)

[KristinLBradley]

WIP: Testing modifications to Button focus styles to standardize and to optimize for easier "Carbonization"

Previews:

• Button Carbonization, states: https://hds-showcase-git-kristin-hds-5666-dryrun-butto-04f709-hashicorp.vercel.app/carbonization/components/button#states
• Button states: https://hds-showcase-git-kristin-hds-5666-dryrun-butto-04f709-hashicorp.vercel.app/components/button#states
• Focus ring states: https://hds-showcase-git-kristin-hds-5666-dryrun-butto-04f709-hashicorp.vercel.app/carbonization/foundations/focus-ring

---

📌 Summary

If merged, this PR modifies the focus styles of Buttons...

🛠️ Detailed description

1. From the ticket: "the focus of the Primary HDS button has a slightly different implementation than the other HDS buttons (different offset of the ring)"

• Testing modification of Primary Button focus styles to follow implementation of other Button variants. (Safe focus ring offset, etc.)
• UPDATE: Visual style differences to standardize Primary Button are on hold until there's time for closer review.

2. From the ticket: "the focus for the Carbon buttons is applied as two inset/inner shadows, with two different colors. - This is a completely different approach than ours"

• Testing modification of Button styles to use box-shadow & border-color instead of pseudo-element, more similar to Carbon's implementation.
• Now testing outline vs. box-shadow

📸 Screenshots

PROPOSED STANDARDIZATION OF “PRIMARY” FOCUS STYLE

CURRENT FOCUS STYLE

STANDARDIZED FOCUS STYLE
Modified to follow styling of other Button variant focus styles

🔗 External links

• Jira ticket: HDS-5666

---

👀 Component checklist

• Percy was checked for any visual regression
• A changelog entry was added via Changesets if needed (see templates here)

💬 Please consider using conventional comments when reviewing this PR.

📋 PCI review checklist

• If applicable, I've documented a plan to revert these changes if they require more than reverting the pull request.
• If applicable, I've worked with GRC to document the impact of any changes to security controls.
  Examples of changes to controls include access controls, encryption, logging, etc.
• If applicable, I've worked with GRC to ensure compliance due to a significant change to the in-scope PCI environment.
  Examples include changes to operating systems, ports, protocols, services, cryptography-related components, PII processing code, etc.

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

Project	Deployment	Preview	Updated (UTC)
hds-showcase	Ready	Preview	Dec 5, 2025 10:35am
hds-website	Ready	Preview	Dec 5, 2025 10:35am

[KristinLBradley]

Added back test of focus styles using outline vs. box-shadow styles.

[KristinLBradley]

Use of pseudo-elements for focus on AdvancedTable child components can be re-examined at a later time, as it seems to necessitate visual design changes.