Skip Link

The Skip Link enables screen readers and keyboard users to jump directly to relevant sections of the page, skipping repetitive elements.

React

Is new design vision part implemented using new tokens?

Up to date

Resources

Storybook

React guidance

Source

GitHub code

Example


                                                        
                                                        
                                                            import { SkipLinks } from '@optimus-web/core';
                                                        
                                                        <SkipLinks
                                                            label="Skip links:"
                                                            list={
                                                            [
                                                                { text: 'Nav', link: '#nav' },
                                                                { text: 'Main', link: '#main' },
                                                                { text: 'Footer', link: '#footer' },
                                                            ]
                                                        } />

API

Name	Description	Type	Default
label	The label for the skip links.	ReactNode	-
list	An array of skip link items	SkipLinkListItemProps[]	-