Skip to content

Commit 4a94da0

Browse files
author
Eric Olkowski
committed
Added button component instead of button classes
1 parent 1da394d commit 4a94da0

File tree

2 files changed

+80
-4
lines changed

2 files changed

+80
-4
lines changed

‎packages/react-core/src/components/JumpLinks/JumpLinksItem.tsx‎

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
11
import * as React from 'react';
22
import { css } from '@patternfly/react-styles';
33
import styles from '@patternfly/react-styles/css/components/JumpLinks/jump-links';
4-
import buttonStyles from '@patternfly/react-styles/css/components/Button/button';
54
import { JumpLinksList } from './JumpLinksList';
5+
import { Button, ButtonVariant } from '../Button';
66

77
export interface JumpLinksItemProps extends Omit<React.HTMLProps<HTMLLIElement>, 'onClick'> {
88
/** Whether this item is active. Parent JumpLinks component sets this when passed a `scrollableSelector`. */
@@ -14,7 +14,7 @@ export interface JumpLinksItemProps extends Omit<React.HTMLProps<HTMLLIElement>,
1414
/** Text to be rendered inside span */
1515
children?: React.ReactNode;
1616
/** Click handler for anchor tag. Parent JumpLinks components tap into this. */
17-
onClick?: (ev: React.MouseEvent<HTMLAnchorElement>) => void;
17+
onClick?: (ev: React.MouseEvent) => void;
1818
/** Class to add to li */
1919
className?: string;
2020
}
@@ -40,9 +40,9 @@ export const JumpLinksItem: React.FunctionComponent<JumpLinksItemProps> = ({
4040
{...props}
4141
>
4242
<span className={styles.jumpLinksLink}>
43-
<a className={css(buttonStyles.button, buttonStyles.modifiers.link)} href={href} onClick={onClick}>
43+
<Button variant={ButtonVariant.link} component="a" href={href} onClick={onClick}>
4444
<span className={styles.jumpLinksLinkText}>{children}</span>
45-
</a>
45+
</Button>
4646
</span>
4747
{sublists}
4848
</li>

‎packages/react-core/src/components/JumpLinks/__tests__/__snapshots__/JumpLinks.test.tsx.snap‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -66,7 +66,11 @@ exports[`expandable vertical with subsection 1`] = `
6666
class="pf-v5-c-jump-links__link"
6767
>
6868
<a
69+
aria-disabled="false"
6970
class="pf-v5-c-button pf-m-link"
71+
data-ouia-component-id="OUIA-Generated-Button-link-13"
72+
data-ouia-component-type="PF5/Button"
73+
data-ouia-safe="true"
7074
href="#"
7175
>
7276
<span
@@ -84,7 +88,11 @@ exports[`expandable vertical with subsection 1`] = `
8488
class="pf-v5-c-jump-links__link"
8589
>
8690
<a
91+
aria-disabled="false"
8792
class="pf-v5-c-button pf-m-link"
93+
data-ouia-component-id="OUIA-Generated-Button-link-14"
94+
data-ouia-component-type="PF5/Button"
95+
data-ouia-safe="true"
8896
href="#"
8997
>
9098
<span
@@ -106,7 +114,11 @@ exports[`expandable vertical with subsection 1`] = `
106114
class="pf-v5-c-jump-links__link"
107115
>
108116
<a
117+
aria-disabled="false"
109118
class="pf-v5-c-button pf-m-link"
119+
data-ouia-component-id="OUIA-Generated-Button-link-15"
120+
data-ouia-component-type="PF5/Button"
121+
data-ouia-safe="true"
110122
href="#"
111123
>
112124
<span
@@ -124,7 +136,11 @@ exports[`expandable vertical with subsection 1`] = `
124136
class="pf-v5-c-jump-links__link"
125137
>
126138
<a
139+
aria-disabled="false"
127140
class="pf-v5-c-button pf-m-link"
141+
data-ouia-component-id="OUIA-Generated-Button-link-16"
142+
data-ouia-component-type="PF5/Button"
143+
data-ouia-safe="true"
128144
href="#"
129145
>
130146
<span
@@ -142,7 +158,11 @@ exports[`expandable vertical with subsection 1`] = `
142158
class="pf-v5-c-jump-links__link"
143159
>
144160
<a
161+
aria-disabled="false"
145162
class="pf-v5-c-button pf-m-link"
163+
data-ouia-component-id="OUIA-Generated-Button-link-17"
164+
data-ouia-component-type="PF5/Button"
165+
data-ouia-safe="true"
146166
href="#"
147167
>
148168
<span
@@ -162,7 +182,11 @@ exports[`expandable vertical with subsection 1`] = `
162182
class="pf-v5-c-jump-links__link"
163183
>
164184
<a
185+
aria-disabled="false"
165186
class="pf-v5-c-button pf-m-link"
187+
data-ouia-component-id="OUIA-Generated-Button-link-18"
188+
data-ouia-component-type="PF5/Button"
189+
data-ouia-safe="true"
166190
href="#"
167191
>
168192
<span
@@ -180,7 +204,11 @@ exports[`expandable vertical with subsection 1`] = `
180204
class="pf-v5-c-jump-links__link"
181205
>
182206
<a
207+
aria-disabled="false"
183208
class="pf-v5-c-button pf-m-link"
209+
data-ouia-component-id="OUIA-Generated-Button-link-19"
210+
data-ouia-component-type="PF5/Button"
211+
data-ouia-safe="true"
184212
href="#"
185213
>
186214
<span
@@ -219,7 +247,11 @@ exports[`jumplinks centered 1`] = `
219247
class="pf-v5-c-jump-links__link"
220248
>
221249
<a
250+
aria-disabled="false"
222251
class="pf-v5-c-button pf-m-link"
252+
data-ouia-component-id="OUIA-Generated-Button-link-4"
253+
data-ouia-component-type="PF5/Button"
254+
data-ouia-safe="true"
223255
href="#"
224256
>
225257
<span
@@ -238,7 +270,11 @@ exports[`jumplinks centered 1`] = `
238270
class="pf-v5-c-jump-links__link"
239271
>
240272
<a
273+
aria-disabled="false"
241274
class="pf-v5-c-button pf-m-link"
275+
data-ouia-component-id="OUIA-Generated-Button-link-5"
276+
data-ouia-component-type="PF5/Button"
277+
data-ouia-safe="true"
242278
href="#"
243279
>
244280
<span
@@ -256,7 +292,11 @@ exports[`jumplinks centered 1`] = `
256292
class="pf-v5-c-jump-links__link"
257293
>
258294
<a
295+
aria-disabled="false"
259296
class="pf-v5-c-button pf-m-link"
297+
data-ouia-component-id="OUIA-Generated-Button-link-6"
298+
data-ouia-component-type="PF5/Button"
299+
data-ouia-safe="true"
260300
href="#"
261301
>
262302
<span
@@ -302,7 +342,11 @@ exports[`jumplinks with label 1`] = `
302342
class="pf-v5-c-jump-links__link"
303343
>
304344
<a
345+
aria-disabled="false"
305346
class="pf-v5-c-button pf-m-link"
347+
data-ouia-component-id="OUIA-Generated-Button-link-7"
348+
data-ouia-component-type="PF5/Button"
349+
data-ouia-safe="true"
306350
href="#"
307351
>
308352
<span
@@ -321,7 +365,11 @@ exports[`jumplinks with label 1`] = `
321365
class="pf-v5-c-jump-links__link"
322366
>
323367
<a
368+
aria-disabled="false"
324369
class="pf-v5-c-button pf-m-link"
370+
data-ouia-component-id="OUIA-Generated-Button-link-8"
371+
data-ouia-component-type="PF5/Button"
372+
data-ouia-safe="true"
325373
href="#"
326374
>
327375
<span
@@ -339,7 +387,11 @@ exports[`jumplinks with label 1`] = `
339387
class="pf-v5-c-jump-links__link"
340388
>
341389
<a
390+
aria-disabled="false"
342391
class="pf-v5-c-button pf-m-link"
392+
data-ouia-component-id="OUIA-Generated-Button-link-9"
393+
data-ouia-component-type="PF5/Button"
394+
data-ouia-safe="true"
343395
href="#"
344396
>
345397
<span
@@ -378,7 +430,11 @@ exports[`simple jumplinks 1`] = `
378430
class="pf-v5-c-jump-links__link"
379431
>
380432
<a
433+
aria-disabled="false"
381434
class="pf-v5-c-button pf-m-link"
435+
data-ouia-component-id="OUIA-Generated-Button-link-1"
436+
data-ouia-component-type="PF5/Button"
437+
data-ouia-safe="true"
382438
href="#"
383439
>
384440
<span
@@ -397,7 +453,11 @@ exports[`simple jumplinks 1`] = `
397453
class="pf-v5-c-jump-links__link"
398454
>
399455
<a
456+
aria-disabled="false"
400457
class="pf-v5-c-button pf-m-link"
458+
data-ouia-component-id="OUIA-Generated-Button-link-2"
459+
data-ouia-component-type="PF5/Button"
460+
data-ouia-safe="true"
401461
href="#"
402462
>
403463
<span
@@ -415,7 +475,11 @@ exports[`simple jumplinks 1`] = `
415475
class="pf-v5-c-jump-links__link"
416476
>
417477
<a
478+
aria-disabled="false"
418479
class="pf-v5-c-button pf-m-link"
480+
data-ouia-component-id="OUIA-Generated-Button-link-3"
481+
data-ouia-component-type="PF5/Button"
482+
data-ouia-safe="true"
419483
href="#"
420484
>
421485
<span
@@ -461,7 +525,11 @@ exports[`vertical with label 1`] = `
461525
class="pf-v5-c-jump-links__link"
462526
>
463527
<a
528+
aria-disabled="false"
464529
class="pf-v5-c-button pf-m-link"
530+
data-ouia-component-id="OUIA-Generated-Button-link-10"
531+
data-ouia-component-type="PF5/Button"
532+
data-ouia-safe="true"
465533
href="#"
466534
>
467535
<span
@@ -480,7 +548,11 @@ exports[`vertical with label 1`] = `
480548
class="pf-v5-c-jump-links__link"
481549
>
482550
<a
551+
aria-disabled="false"
483552
class="pf-v5-c-button pf-m-link"
553+
data-ouia-component-id="OUIA-Generated-Button-link-11"
554+
data-ouia-component-type="PF5/Button"
555+
data-ouia-safe="true"
484556
href="#"
485557
>
486558
<span
@@ -498,7 +570,11 @@ exports[`vertical with label 1`] = `
498570
class="pf-v5-c-jump-links__link"
499571
>
500572
<a
573+
aria-disabled="false"
501574
class="pf-v5-c-button pf-m-link"
575+
data-ouia-component-id="OUIA-Generated-Button-link-12"
576+
data-ouia-component-type="PF5/Button"
577+
data-ouia-safe="true"
502578
href="#"
503579
>
504580
<span

0 commit comments

Comments
 (0)