Skip to content

Commit dce704b

Browse files
rvsiarvsia
committed
fix(pf4): add class for cancel wizard button
1 parent 8ef8fef commit dce704b

File tree

4 files changed

+171
-133
lines changed

4 files changed

+171
-133
lines changed

‎packages/pf4-component-mapper/src/files/wizard/step-buttons.js

Lines changed: 5 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -57,9 +57,11 @@ const WizardStepButtons = ({
5757
<Button type="button" variant="secondary" isDisabled={disableBack} onClick={handlePrev}>
5858
{back}
5959
</Button>
60-
<Button type="button" variant="link" onClick={formOptions.onCancel}>
61-
{cancel}
62-
</Button>
60+
<div className="pf-c-wizard__footer-cancel">
61+
<Button type="button" variant="link" onClick={formOptions.onCancel}>
62+
{cancel}
63+
</Button>
64+
</div>
6365
</React.Fragment>
6466
)}
6567
</FormSpy>

‎packages/pf4-component-mapper/src/tests/wizard/__snapshots__/step-buttons.test.js.snap

Lines changed: 40 additions & 32 deletions
Original file line numberDiff line numberDiff line change
@@ -83,26 +83,30 @@ exports[`<WizardSTepButtons should add custom className to toolbar 1`] = `
8383
Back
8484
</button>
8585
</Button>
86-
<Button
87-
onClick={[MockFunction]}
88-
type="button"
89-
variant="link"
86+
<div
87+
className="pf-c-wizard__footer-cancel"
9088
>
91-
<button
92-
aria-disabled={false}
93-
aria-label={null}
94-
className="pf-c-button pf-m-link"
95-
data-ouia-component-id="OUIA-Generated-Button-link-2"
96-
data-ouia-component-type="PF4/Button"
97-
data-ouia-safe={true}
98-
disabled={false}
89+
<Button
9990
onClick={[MockFunction]}
100-
role={null}
10191
type="button"
92+
variant="link"
10293
>
103-
Cancel
104-
</button>
105-
</Button>
94+
<button
95+
aria-disabled={false}
96+
aria-label={null}
97+
className="pf-c-button pf-m-link"
98+
data-ouia-component-id="OUIA-Generated-Button-link-2"
99+
data-ouia-component-type="PF4/Button"
100+
data-ouia-safe={true}
101+
disabled={false}
102+
onClick={[MockFunction]}
103+
role={null}
104+
type="button"
105+
>
106+
Cancel
107+
</button>
108+
</Button>
109+
</div>
106110
</FormSpy>
107111
</footer>
108112
</WizardStepButtons>
@@ -192,26 +196,30 @@ exports[`<WizardSTepButtons should render correctly 1`] = `
192196
Back
193197
</button>
194198
</Button>
195-
<Button
196-
onClick={[MockFunction]}
197-
type="button"
198-
variant="link"
199+
<div
200+
className="pf-c-wizard__footer-cancel"
199201
>
200-
<button
201-
aria-disabled={false}
202-
aria-label={null}
203-
className="pf-c-button pf-m-link"
204-
data-ouia-component-id="OUIA-Generated-Button-link-1"
205-
data-ouia-component-type="PF4/Button"
206-
data-ouia-safe={true}
207-
disabled={false}
202+
<Button
208203
onClick={[MockFunction]}
209-
role={null}
210204
type="button"
205+
variant="link"
211206
>
212-
Cancel
213-
</button>
214-
</Button>
207+
<button
208+
aria-disabled={false}
209+
aria-label={null}
210+
className="pf-c-button pf-m-link"
211+
data-ouia-component-id="OUIA-Generated-Button-link-1"
212+
data-ouia-component-type="PF4/Button"
213+
data-ouia-safe={true}
214+
disabled={false}
215+
onClick={[MockFunction]}
216+
role={null}
217+
type="button"
218+
>
219+
Cancel
220+
</button>
221+
</Button>
222+
</div>
215223
</FormSpy>
216224
</footer>
217225
</WizardStepButtons>

‎packages/pf4-component-mapper/src/tests/wizard/__snapshots__/wizard-step.test.js.snap

Lines changed: 60 additions & 48 deletions
Original file line numberDiff line numberDiff line change
@@ -173,26 +173,30 @@ exports[`<WizardStep /> should render correctly 1`] = `
173173
Back
174174
</button>
175175
</Button>
176-
<Button
177-
onClick={[MockFunction]}
178-
type="button"
179-
variant="link"
176+
<div
177+
className="pf-c-wizard__footer-cancel"
180178
>
181-
<button
182-
aria-disabled={false}
183-
aria-label={null}
184-
className="pf-c-button pf-m-link"
185-
data-ouia-component-id="OUIA-Generated-Button-link-1"
186-
data-ouia-component-type="PF4/Button"
187-
data-ouia-safe={true}
188-
disabled={false}
179+
<Button
189180
onClick={[MockFunction]}
190-
role={null}
191181
type="button"
182+
variant="link"
192183
>
193-
Cancel
194-
</button>
195-
</Button>
184+
<button
185+
aria-disabled={false}
186+
aria-label={null}
187+
className="pf-c-button pf-m-link"
188+
data-ouia-component-id="OUIA-Generated-Button-link-1"
189+
data-ouia-component-type="PF4/Button"
190+
data-ouia-safe={true}
191+
disabled={false}
192+
onClick={[MockFunction]}
193+
role={null}
194+
type="button"
195+
>
196+
Cancel
197+
</button>
198+
</Button>
199+
</div>
196200
</FormSpy>
197201
</footer>
198202
</WizardStepButtons>
@@ -381,26 +385,30 @@ exports[`<WizardStep /> should render custom description 1`] = `
381385
Back
382386
</button>
383387
</Button>
384-
<Button
385-
onClick={[MockFunction]}
386-
type="button"
387-
variant="link"
388+
<div
389+
className="pf-c-wizard__footer-cancel"
388390
>
389-
<button
390-
aria-disabled={false}
391-
aria-label={null}
392-
className="pf-c-button pf-m-link"
393-
data-ouia-component-id="OUIA-Generated-Button-link-5"
394-
data-ouia-component-type="PF4/Button"
395-
data-ouia-safe={true}
396-
disabled={false}
391+
<Button
397392
onClick={[MockFunction]}
398-
role={null}
399393
type="button"
394+
variant="link"
400395
>
401-
Cancel
402-
</button>
403-
</Button>
396+
<button
397+
aria-disabled={false}
398+
aria-label={null}
399+
className="pf-c-button pf-m-link"
400+
data-ouia-component-id="OUIA-Generated-Button-link-5"
401+
data-ouia-component-type="PF4/Button"
402+
data-ouia-safe={true}
403+
disabled={false}
404+
onClick={[MockFunction]}
405+
role={null}
406+
type="button"
407+
>
408+
Cancel
409+
</button>
410+
</Button>
411+
</div>
404412
</FormSpy>
405413
</footer>
406414
</WizardStepButtons>
@@ -618,26 +626,30 @@ exports[`<WizardStep /> should render title with showTitle 1`] = `
618626
Back
619627
</button>
620628
</Button>
621-
<Button
622-
onClick={[MockFunction]}
623-
type="button"
624-
variant="link"
629+
<div
630+
className="pf-c-wizard__footer-cancel"
625631
>
626-
<button
627-
aria-disabled={false}
628-
aria-label={null}
629-
className="pf-c-button pf-m-link"
630-
data-ouia-component-id="OUIA-Generated-Button-link-2"
631-
data-ouia-component-type="PF4/Button"
632-
data-ouia-safe={true}
633-
disabled={false}
632+
<Button
634633
onClick={[MockFunction]}
635-
role={null}
636634
type="button"
635+
variant="link"
637636
>
638-
Cancel
639-
</button>
640-
</Button>
637+
<button
638+
aria-disabled={false}
639+
aria-label={null}
640+
className="pf-c-button pf-m-link"
641+
data-ouia-component-id="OUIA-Generated-Button-link-2"
642+
data-ouia-component-type="PF4/Button"
643+
data-ouia-safe={true}
644+
disabled={false}
645+
onClick={[MockFunction]}
646+
role={null}
647+
type="button"
648+
>
649+
Cancel
650+
</button>
651+
</Button>
652+
</div>
641653
</FormSpy>
642654
</footer>
643655
</WizardStepButtons>

0 commit comments

Comments
 (0)