Skip to content

Commit c2abbcf

Browse files
Remove HTML examples
1 parent 9bc670d commit c2abbcf

File tree

8 files changed

+0
-245
lines changed

8 files changed

+0
-245
lines changed

src/components/form-elements/error-message/__tests__/ErrorMessage.test.tsx

Lines changed: 0 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -26,13 +26,4 @@ describe('ErrorMessage', () => {
2626

2727
expect(container.querySelector('.nhsuk-u-visually-hidden')).toBeFalsy();
2828
});
29-
30-
it('contains HTML', () => {
31-
const { container } = render(
32-
<ErrorMessage>
33-
Error<span>this errored</span>
34-
</ErrorMessage>,
35-
);
36-
expect(container.innerHTML).toMatch(`Error<span>this errored</span>`);
37-
});
3829
});

src/components/form-elements/label/__tests__/Label.test.tsx

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -55,37 +55,4 @@ describe('Label', () => {
5555

5656
expect(container.querySelector('label')).toBeNull();
5757
});
58-
59-
it('renders with HTML', () => {
60-
const { container } = render(
61-
<Label>
62-
Text<span>and text within HTML</span>
63-
</Label>,
64-
);
65-
66-
expect(container.querySelector('label')?.innerHTML).toMatch(
67-
'Text<span>and text within HTML</span>',
68-
);
69-
});
70-
71-
it.each<NHSUKSize>(['s', 'm', 'l', 'xl'])(
72-
'renders with HTML and contains page heading with custom size %s',
73-
(size) => {
74-
const { container } = render(
75-
<Label isPageHeading size={size}>
76-
Text <span className={`nhsuk-caption-${size}`}>and text within HTML</span>
77-
</Label>,
78-
);
79-
80-
const headingEl = container.querySelector('.nhsuk-label-wrapper');
81-
const labelEl = headingEl?.querySelector('.nhsuk-label');
82-
83-
expect(headingEl?.tagName).toBe('H1');
84-
expect(labelEl).toHaveTextContent('Text and text within HTML');
85-
expect(labelEl?.innerHTML).toMatch(
86-
`Text <span class="nhsuk-caption-${size}">and text within HTML</span>`,
87-
);
88-
expect(labelEl).toHaveClass(`nhsuk-label--${size}`);
89-
},
90-
);
9158
});

stories/Form Elements/Checkboxes.stories.tsx

Lines changed: 0 additions & 61 deletions
Original file line numberDiff line numberDiff line change
@@ -69,40 +69,6 @@ export const WithHintText: Story = {
6969
),
7070
};
7171

72-
export const WithHintHTML: Story = {
73-
render: () => (
74-
<form>
75-
<Checkboxes legend="How do you want to sign in?" legendProps={{ size: 'l' }}>
76-
<Checkboxes.Item
77-
id="government-gateway"
78-
name="gateway"
79-
type="checkbox"
80-
value="gov-gateway"
81-
hint={
82-
<>
83-
You’ll have a user ID if you’ve registered for{' '}
84-
<span className="nhsuk-caption-l">
85-
{' '}
86-
Self Assessment or filed a tax return online before.
87-
</span>
88-
</>
89-
}
90-
>
91-
Sign in with Government Gateway
92-
</Checkboxes.Item>
93-
<Checkboxes.Item
94-
id="nhsuk-login"
95-
name="verify"
96-
value="nhsuk-verify"
97-
hint="You’ll have an account if you’ve already proved your identity with either Barclays, CitizenSafe, Digidentity, Experian, Post Office, Royal Mail or SecureIdentity."
98-
>
99-
Sign in with NHS.UK login
100-
</Checkboxes.Item>
101-
</Checkboxes>
102-
</form>
103-
),
104-
};
105-
10672
export const Small: Story = {
10773
args: {
10874
...Standard.args,
@@ -191,33 +157,6 @@ export const WithError: Story = {
191157
name: 'With Error (String)',
192158
};
193159

194-
export const WithHTMLError: Story = {
195-
render: () => {
196-
const error = (
197-
<>
198-
Please<span className="nhsuk-u-nowrap"> select an option below</span>
199-
</>
200-
);
201-
return (
202-
<form>
203-
<Checkboxes
204-
legend="Which types of waste do you transport regularly?"
205-
legendProps={{ size: 'l' }}
206-
hint="Select all that apply"
207-
error={error}
208-
id="waste"
209-
name="waste"
210-
>
211-
<Checkboxes.Item value="animal">Waste from animal carcasses</Checkboxes.Item>
212-
<Checkboxes.Item value="mines">Waste from mines or quarries</Checkboxes.Item>
213-
<Checkboxes.Item value="farm">Farm or agricultural waste</Checkboxes.Item>
214-
</Checkboxes>
215-
</form>
216-
);
217-
},
218-
name: 'With Error (HTML)',
219-
};
220-
221160
export const NoIDSupplied: Story = {
222161
render: function NoIDSuppliedRender() {
223162
const checkbox1Ref = useRef<HTMLInputElement>(null);

stories/Form Elements/ErrorMessage.stories.tsx

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -34,14 +34,3 @@ export const EmptyVisuallyHiddenText: Story = {
3434
args: { visuallyHiddenText: '' },
3535
argTypes: { visuallyHiddenText: { control: false } },
3636
};
37-
38-
export const WithHTML: Story = {
39-
args: {
40-
children: (
41-
<>
42-
Enter your full name (or call <span className="nhsuk-u-nowrap">999 123 4567</span>)
43-
</>
44-
),
45-
},
46-
argTypes: { visuallyHiddenText: { control: false } },
47-
};

stories/Form Elements/Fieldset.stories.tsx

Lines changed: 0 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -49,25 +49,6 @@ export const Standard: Story = {
4949
),
5050
};
5151

52-
export const WithLegendAsAPageHeading: Story = {
53-
render: () => (
54-
<Fieldset>
55-
<Fieldset.Legend isPageHeading>What is your address?</Fieldset.Legend>
56-
</Fieldset>
57-
),
58-
};
59-
60-
export const WithLegendHTML: Story = {
61-
name: 'With Legend HTML',
62-
render: () => (
63-
<Fieldset>
64-
<Fieldset.Legend>
65-
What is your address? <strong>small note: this is your home address</strong>
66-
</Fieldset.Legend>
67-
</Fieldset>
68-
),
69-
};
70-
7152
export const WithCustomLegendSizeS: Story = {
7253
name: 'With Bold Text (S)',
7354
render: (args) => (

stories/Form Elements/Label.stories.tsx

Lines changed: 0 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -50,14 +50,3 @@ export const WithCustomSizeXL: Story = {
5050
size: 'xl',
5151
},
5252
};
53-
54-
export const WithHTML: Story = {
55-
name: 'With HTML',
56-
args: {
57-
children: (
58-
<>
59-
This has <span>a span HTML element</span>
60-
</>
61-
),
62-
},
63-
};

stories/Form Elements/Radios.stories.tsx

Lines changed: 0 additions & 70 deletions
Original file line numberDiff line numberDiff line change
@@ -121,46 +121,6 @@ export const RadiosWithHintsOnItems: Story = {
121121
),
122122
};
123123

124-
export const RadiosWithHTMLHintsOnItems: Story = {
125-
render: () => (
126-
<Radios
127-
legend="How do you want to sign in?"
128-
legendProps={{ size: 'l' }}
129-
name="example"
130-
id="example-with-hints"
131-
>
132-
<Radios.Item
133-
value="government-gateway"
134-
hint={
135-
<>
136-
You&#39;ll{' '}
137-
<span className="nhsuk-u-nowrap">
138-
have a user ID if you&apos;ve registered for self-assessment or filed a tax return
139-
online before.
140-
</span>
141-
</>
142-
}
143-
>
144-
Use Government Gateway
145-
</Radios.Item>
146-
<Radios.Item
147-
value="nhsuk-login"
148-
hint={
149-
<>
150-
You’ll have an{' '}
151-
<span className="nhsuk-u-nowrap">
152-
account if you’ve already proved your identity with either Barclays, CitizenSafe,
153-
Digidentity, Experian, Post Office, Royal Mail or SecureIdentity.
154-
</span>
155-
</>
156-
}
157-
>
158-
Use NHS.UK login
159-
</Radios.Item>
160-
</Radios>
161-
),
162-
};
163-
164124
export const SmallRadios: Story = {
165125
args: {
166126
...StandardRadios.args,
@@ -247,33 +207,3 @@ export const RadiosWithError: Story = {
247207

248208
name: 'Radios With Error (String)',
249209
};
250-
251-
export const RadiosWithErrorHtml: Story = {
252-
render: function RadiosWithErrorHtmlRender() {
253-
const error = (
254-
<>
255-
Select <span className="nhsuk-u-nowrap">yes if you have changed your name</span>
256-
</>
257-
);
258-
return (
259-
<>
260-
<Radios
261-
legend="Have you changed your name?"
262-
legendProps={{ size: 'l' }}
263-
hint="This includes changing your last name or spelling your name differently"
264-
name="example-with-err-string"
265-
error={error}
266-
>
267-
<Radios.Item id="example-1" value="yes">
268-
Yes
269-
</Radios.Item>
270-
<Radios.Item id="example-2" value="no" checked>
271-
No
272-
</Radios.Item>
273-
</Radios>
274-
</>
275-
);
276-
},
277-
278-
name: 'Radios With Error (HTML)',
279-
};

stories/Form Elements/Select.stories.tsx

Lines changed: 0 additions & 31 deletions
Original file line numberDiff line numberDiff line change
@@ -43,20 +43,6 @@ export const SelectWithHintText: Story = {
4343
),
4444
};
4545

46-
export const SelectWithHintHTML: Story = {
47-
render: () => (
48-
<Select
49-
label="Label text goes here"
50-
labelProps={{ size: 'l' }}
51-
hint={<span className="nhsuk-u-nowrap">HTML hint text goes here</span>}
52-
>
53-
<Select.Option value="1">NHS.UK frontend option 1</Select.Option>
54-
<Select.Option value="2">NHS.UK frontend option 2</Select.Option>
55-
<Select.Option value="3">NHS.UK frontend option 3</Select.Option>
56-
</Select>
57-
),
58-
};
59-
6046
export const SelectWithError: Story = {
6147
render: function SelectWithErrorRender(args) {
6248
const [error, setError] = useState<string>('Error message goes here');
@@ -75,23 +61,6 @@ export const SelectWithError: Story = {
7561
name: 'Select With Error (String)',
7662
};
7763

78-
export const SelectWithHTMLError: Story = {
79-
render: function SelectWithErrorRender() {
80-
const error = <span className="nhsuk-u-nowrap">HTML error message goes here</span>;
81-
return (
82-
<>
83-
<Select label="Label text goes here" labelProps={{ size: 'l' }} error={error}>
84-
<Select.Option value="1">NHS.UK frontend option 1</Select.Option>
85-
<Select.Option value="2">NHS.UK frontend option 2</Select.Option>
86-
<Select.Option value="3">NHS.UK frontend option 3</Select.Option>
87-
</Select>
88-
</>
89-
);
90-
},
91-
92-
name: 'Select With Error (HTML)',
93-
};
94-
9564
export const SelectWithErrorAndHintText: Story = {
9665
args: {
9766
hint: 'Hint text goes here',

0 commit comments

Comments
 (0)