🧪 [Spike] Viewport breakpoints (re-using IBM Carbon values/mixins)

[didoo]

🚨 DO NOT MERGE 🚨

:pushpin: Summary

This PR is an exploration of how we could potentially use the IBM Carbon breakpoints values and mixins within HDS (eg. for our components) and expose them to our consumers.

👉 👉 👉 Preview: https://hds-showcase-git-spike-viewport-breakpoints-hashicorp.vercel.app/foundations/breakpoints

🚧 TODOs

• [ ] move the "source" Sass files for the Sass variables and mixins (showcase/app/styles/_temp-hds-breakpoints.scss) under the packages/components folder.
• [ ] see if there are other ways we can expose these values/mixins to the consumers
  • [ ] breakpoint values as JavaScript object (see showcase/app/components/mock/demo/hds-breakpoints.ts)
  • [ ] consume these JS breakpoints in the showcase (add a demo, in which I render a string with the current breakpoint)

:link: External links

Jira ticket: https://hashicorp.atlassian.net/browse/HDS-4806

[vercel[bot]]

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated (UTC)
hds-showcase	✅ Ready (Inspect)	Visit Preview	Apr 29, 2025 9:12am
hds-website	✅ Ready (Inspect)	Visit Preview	Apr 29, 2025 9:12am