-
Notifications
You must be signed in to change notification settings - Fork 233
docs: add storybook plugins (barebones) #5737
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
docs: add storybook plugins (barebones) #5737
Conversation
|
import '../tokens/medium-vars.css'; | ||
import '../tokens/global-vars.css'; | ||
|
||
import { html } from 'lit'; |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This wasn't actually being used in this file so the import wasn't needed.
|
||
const preview = { | ||
parameters: { | ||
layout: 'centered', |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I think centered or padded are nice customer experiences. The downside of making every component fullscreen is that the smaller components get squashed into the top left corner.
}, | ||
}, | ||
}, | ||
tags: ['autodocs'], |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Automatically triggers documentation pages for every component. Components can opt-out using tags: ['!autodocs']
📚 Branch Preview🔍 Visual Regression Test ResultsWhen a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:
Deployed to Azure Blob Storage: If the changes are expected, update the |
"@axe-core/playwright": "^4.10.2", | ||
"@custom-elements-manifest/analyzer": "^0.10.5", | ||
"@storybook/addon-a11y": "9.1.3", | ||
"@storybook/addon-designs": "10.0.2", |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This lets us bring over the Figma resources that we have linked in CSS.
Tachometer resultsCurrently, no packages are changed by this PR... |
ee03381
to
d7025fb
Compare
Description
This PR adds essential Storybook plugins to the second-generation Spectrum Web Components package to enhance the development and documentation experience. The changes include adding three key Storybook addons: docs, accessibility (a11y), and designs, along with configuration updates to enable auto-documentation and centered layout.
Motivation and context
The second-generation SWC package was missing essential Storybook plugins that are crucial for:
These plugins are standard in modern component development workflows and will improve the developer experience for contributors working on the second-generation components.
Related issue(s)
Author's checklist
Reviewer's checklist
patch
,minor
, ormajor
featuresManual review test cases
Storybook addons functionality
second-gen/packages/swc/
directoryyarn storybook
to start the Storybook development serverAuto-documentation generation
Accessibility testing