Sorry, but you either have no stories or none are selected somehow.
If the problem persists, check the browser console, or the terminal you've run Storybook from.
The component failed to render properly, likely due to a configuration issue in Storybook. Here are some common causes and how you can address them:
This is a pre-release version and is not production ready. For new and ongoing projects, please refer to the latest Design System version.
People using keyboard, screen readers, switch controls and other assistive technologies use skip links to reach main content or other important sections easier and faster.
For the skiplinks to work, don't forget to add corresponding ID to the element that needs to be skipped to.
preview-5491--swisspost-design-system-next.netlify.app/?path=/docs/2fc3b456-19ba-4ede-b1bc-499518f829b1--docs&story=Default#2fc3b456-19ba-4ede-b1bc-499518f829b1--default
/?path=/story/2fc3b456-19ba-4ede-b1bc-499518f829b1--default&full=true
<div class="skiplinks"> <a href="#navigation" target="_self">Navigation</a> <a href="#main-content" target="_self">Main</a> </div> <div id="navigation" role="navigation"> Navigation <ul> <li> <a href="#">Link</a> </li> </ul> </div> <div id="main-content" role="main" tabindex="-1"> Main content <ul> <li> <a href="#">Link</a> </li> </ul> </div>
Make sure the @swisspost/design-system-styles package is already present in your project or follow the installation guidelines.
To import all Design System styles:
@use '@swisspost/design-system-styles/post-compact.scss';
To import only the styles required for this component:
@use '@swisspost/design-system-styles/basics.scss'; @use '@swisspost/design-system-styles/components/skiplinks.scss';