blob: 24ac921f431ea0442aa63eba5c429ec7ef44735d (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
|
import type { ComponentMeta, ComponentStory } from '@storybook/react';
import { Link } from '../links';
import { VisuallyHidden } from './visually-hidden';
/**
* Sidebar - Storybook Meta
*/
export default {
title: 'Atoms/VisuallyHidden',
component: VisuallyHidden,
argTypes: {
children: {
control: {
type: 'text',
},
description: 'The contents to visually hide.',
type: {
name: 'string',
required: true,
},
},
},
} as ComponentMeta<typeof VisuallyHidden>;
const Template: ComponentStory<typeof VisuallyHidden> = (args) => (
<VisuallyHidden {...args} />
);
/**
* VisuallyHidden Stories - Not focusable
*/
export const NotFocusable = Template.bind({});
NotFocusable.args = {
children: 'Esse quia deserunt animi id sit voluptatem aperiam.',
};
/**
* VisuallyHidden Stories - Focusable
*/
export const Focusable = Template.bind({});
Focusable.args = {
children: (
<>
{'Esse quia deserunt animi id sit voluptatem aperiam. '}
<Link href="#">Any link.</Link>
</>
),
};
|
