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
|
import type { Meta, StoryObj } from '@storybook/react';
import { Input } from '../fields';
import { Fieldset, type FieldsetProps } from './fieldset';
const meta = {
component: Fieldset,
title: 'Atoms/Forms/Fieldset',
} satisfies Meta<typeof Fieldset>;
export default meta;
type Story = StoryObj<typeof meta>;
export const Default: Story = {
args: {},
};
const FieldsetWithFields = ({
inputLabel,
...props
}: FieldsetProps & { inputLabel: string }) => (
<Fieldset {...props}>
<Input aria-label={inputLabel} id="field" name="field" type="text" />
</Fieldset>
);
type WithFieldStory = StoryObj<FieldsetProps & { inputLabel: string }>;
export const Enabled: WithFieldStory = {
name: 'State: Enabled',
args: {
...Default.args,
inputLabel: 'Example of a field inside an enabled fieldset',
isDisabled: false,
},
render: FieldsetWithFields,
};
export const Disabled: WithFieldStory = {
name: 'State: Disabled',
args: {
...Default.args,
inputLabel: 'Example of a field inside a disabled fieldset',
isDisabled: true,
},
render: FieldsetWithFields,
};
|
