Skip to content

Commit

Permalink
Add an example of using a input as a page heading (#221)
Browse files Browse the repository at this point in the history
* Add an example of using a hint as a page heading by @edwardhorsford
  • Loading branch information
edwardhorsford authored Jun 10, 2024
1 parent 2d677c5 commit e0aaaa2
Showing 1 changed file with 18 additions and 1 deletion.
19 changes: 18 additions & 1 deletion stories/Form Elements/TextInput.stories.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ const meta: Meta<typeof TextInput> = {
args: {
id: 'input-example',
name: 'test-name',
label: 'National Insurance Number',
label: 'National Insurance number',
},
argTypes: {
inputRef: { table: { disable: true } },
Expand All @@ -24,6 +24,23 @@ export const WithHintText: Story = {
},
};

export const AsPageHeading: Story = {
args: {
labelProps: {
isPageHeading: true,
size: "l"
},
hint: 'It’s on your National Insurance card, benefit letter, payslip or P60. For example, ‘QQ 12 34 56 C’.',
},
parameters: {
docs: {
description: {
story: 'To be used when the input label should also be a page heading - such as when it is the main question on a page.'
}
}
}
};

export const WithErrorBoolean: Story = {
args: {
error: true,
Expand Down

0 comments on commit e0aaaa2

Please sign in to comment.