@patternfly/react-core 4.227.7 → 4.228.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (99) hide show
  1. package/CHANGELOG.md +27 -0
  2. package/dist/esm/components/Menu/MenuItem.d.ts +3 -1
  3. package/dist/esm/components/Menu/MenuItem.d.ts.map +1 -1
  4. package/dist/esm/components/Menu/MenuItem.js +2 -2
  5. package/dist/esm/components/Menu/MenuItem.js.map +1 -1
  6. package/dist/esm/components/MenuToggle/MenuToggle.d.ts +6 -12
  7. package/dist/esm/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  8. package/dist/esm/components/MenuToggle/MenuToggle.js +12 -8
  9. package/dist/esm/components/MenuToggle/MenuToggle.js.map +1 -1
  10. package/dist/esm/components/Tabs/OverflowTab.d.ts +16 -0
  11. package/dist/esm/components/Tabs/OverflowTab.d.ts.map +1 -0
  12. package/dist/esm/components/Tabs/OverflowTab.js +74 -0
  13. package/dist/esm/components/Tabs/OverflowTab.js.map +1 -0
  14. package/dist/esm/components/Tabs/Tabs.d.ts +12 -0
  15. package/dist/esm/components/Tabs/Tabs.d.ts.map +1 -1
  16. package/dist/esm/components/Tabs/Tabs.js +36 -13
  17. package/dist/esm/components/Tabs/Tabs.js.map +1 -1
  18. package/dist/esm/components/TextInputGroup/TextInputGroup.d.ts +2 -0
  19. package/dist/esm/components/TextInputGroup/TextInputGroup.d.ts.map +1 -1
  20. package/dist/esm/components/TextInputGroup/TextInputGroup.js +2 -2
  21. package/dist/esm/components/TextInputGroup/TextInputGroup.js.map +1 -1
  22. package/dist/esm/components/TextInputGroup/TextInputGroupMain.d.ts +1 -1
  23. package/dist/esm/components/TextInputGroup/TextInputGroupMain.d.ts.map +1 -1
  24. package/dist/esm/components/TreeView/TreeView.d.ts +2 -0
  25. package/dist/esm/components/TreeView/TreeView.d.ts.map +1 -1
  26. package/dist/esm/components/TreeView/TreeView.js +3 -3
  27. package/dist/esm/components/TreeView/TreeView.js.map +1 -1
  28. package/dist/esm/components/TreeView/TreeViewListItem.d.ts +2 -0
  29. package/dist/esm/components/TreeView/TreeViewListItem.d.ts.map +1 -1
  30. package/dist/esm/components/TreeView/TreeViewListItem.js +23 -14
  31. package/dist/esm/components/TreeView/TreeViewListItem.js.map +1 -1
  32. package/dist/js/components/Menu/MenuItem.d.ts +3 -1
  33. package/dist/js/components/Menu/MenuItem.d.ts.map +1 -1
  34. package/dist/js/components/Menu/MenuItem.js +2 -2
  35. package/dist/js/components/Menu/MenuItem.js.map +1 -1
  36. package/dist/js/components/MenuToggle/MenuToggle.d.ts +6 -12
  37. package/dist/js/components/MenuToggle/MenuToggle.d.ts.map +1 -1
  38. package/dist/js/components/MenuToggle/MenuToggle.js +12 -8
  39. package/dist/js/components/MenuToggle/MenuToggle.js.map +1 -1
  40. package/dist/js/components/Tabs/OverflowTab.d.ts +16 -0
  41. package/dist/js/components/Tabs/OverflowTab.d.ts.map +1 -0
  42. package/dist/js/components/Tabs/OverflowTab.js +78 -0
  43. package/dist/js/components/Tabs/OverflowTab.js.map +1 -0
  44. package/dist/js/components/Tabs/Tabs.d.ts +12 -0
  45. package/dist/js/components/Tabs/Tabs.d.ts.map +1 -1
  46. package/dist/js/components/Tabs/Tabs.js +36 -13
  47. package/dist/js/components/Tabs/Tabs.js.map +1 -1
  48. package/dist/js/components/TextInputGroup/TextInputGroup.d.ts +2 -0
  49. package/dist/js/components/TextInputGroup/TextInputGroup.d.ts.map +1 -1
  50. package/dist/js/components/TextInputGroup/TextInputGroup.js +2 -2
  51. package/dist/js/components/TextInputGroup/TextInputGroup.js.map +1 -1
  52. package/dist/js/components/TextInputGroup/TextInputGroupMain.d.ts +1 -1
  53. package/dist/js/components/TextInputGroup/TextInputGroupMain.d.ts.map +1 -1
  54. package/dist/js/components/TreeView/TreeView.d.ts +2 -0
  55. package/dist/js/components/TreeView/TreeView.d.ts.map +1 -1
  56. package/dist/js/components/TreeView/TreeView.js +3 -3
  57. package/dist/js/components/TreeView/TreeView.js.map +1 -1
  58. package/dist/js/components/TreeView/TreeViewListItem.d.ts +2 -0
  59. package/dist/js/components/TreeView/TreeViewListItem.d.ts.map +1 -1
  60. package/dist/js/components/TreeView/TreeViewListItem.js +23 -14
  61. package/dist/js/components/TreeView/TreeViewListItem.js.map +1 -1
  62. package/dist/styles/base-no-reset.css +9 -0
  63. package/dist/styles/base.css +9 -0
  64. package/dist/umd/react-core.css +21 -31
  65. package/dist/umd/react-core.js +149 -48
  66. package/dist/umd/react-core.min.css +21 -31
  67. package/dist/umd/react-core.min.js +5 -5
  68. package/package.json +6 -6
  69. package/src/components/Menu/MenuItem.tsx +4 -0
  70. package/src/components/MenuToggle/MenuToggle.tsx +63 -25
  71. package/src/components/Page/examples/Page.md +10 -615
  72. package/src/components/Page/examples/PageCenteredSection.tsx +76 -0
  73. package/src/components/Page/examples/PageGroupSection.tsx +106 -0
  74. package/src/components/Page/examples/PageHorizontalNav.tsx +43 -0
  75. package/src/components/Page/examples/PageMainSectionPadding.tsx +72 -0
  76. package/src/components/Page/examples/PageTertiaryNav.tsx +42 -0
  77. package/src/components/Page/examples/PageUncontrolledNav.tsx +53 -0
  78. package/src/components/Page/examples/PageVerticalNav.tsx +65 -0
  79. package/src/components/Page/examples/PageVerticalNavUsingPageHeaderComponent.tsx +44 -0
  80. package/src/components/Page/examples/PageWithOrWithoutFill.tsx +67 -0
  81. package/src/components/Switch/examples/Switch.md +6 -153
  82. package/src/components/Switch/examples/SwitchBasic.tsx +20 -0
  83. package/src/components/Switch/examples/SwitchCheckedWithLabel.tsx +22 -0
  84. package/src/components/Switch/examples/SwitchDisabled.tsx +28 -0
  85. package/src/components/Switch/examples/SwitchReversed.tsx +21 -0
  86. package/src/components/Switch/examples/SwitchUncontrolled.tsx +14 -0
  87. package/src/components/Switch/examples/SwitchWithoutLabel.tsx +12 -0
  88. package/src/components/Tabs/OverflowTab.tsx +141 -0
  89. package/src/components/Tabs/Tabs.tsx +72 -25
  90. package/src/components/Tabs/examples/Tabs.md +6 -1
  91. package/src/components/Tabs/examples/TabsHorizontalOverflow.tsx +67 -0
  92. package/src/components/TextInputGroup/TextInputGroup.tsx +9 -1
  93. package/src/components/TextInputGroup/TextInputGroupMain.tsx +1 -1
  94. package/src/components/TreeView/TreeView.tsx +5 -0
  95. package/src/components/TreeView/TreeViewListItem.tsx +31 -17
  96. package/src/components/TreeView/__tests__/__snapshots__/TreeView.test.tsx.snap +299 -299
  97. package/src/components/TreeView/examples/TreeView.md +125 -7
  98. package/src/demos/ComposableMenu/ComposableMenu.md +8 -0
  99. package/src/demos/ComposableMenu/examples/ComposableTypeaheadSelect.tsx +196 -0
package/src/components/TreeView/__tests__/__snapshots__/TreeView.test.tsx.snap CHANGED
@@ -23,10 +23,10 @@ exports[`renders compact no background successfully 1`] = `
23
23
  class="pf-c-tree-view__node"
24
24
  tabindex="0"
25
25
  >
26
- <div
26
+ <span
27
27
  class="pf-c-tree-view__node-container"
28
28
  >
29
- <div
29
+ <span
30
30
  class="pf-c-tree-view__node-toggle"
31
31
  tabindex="-1"
32
32
  >
@@ -47,8 +47,8 @@ exports[`renders compact no background successfully 1`] = `
47
47
  />
48
48
  </svg>
49
49
  </span>
50
- </div>
51
- <div
50
+ </span>
51
+ <span
52
52
  class="pf-c-tree-view__node-content"
53
53
  >
54
54
  <span
@@ -56,8 +56,8 @@ exports[`renders compact no background successfully 1`] = `
56
56
  >
57
57
  ApplicationLauncher
58
58
  </span>
59
- </div>
60
- </div>
59
+ </span>
60
+ </span>
61
61
  </button>
62
62
  </div>
63
63
  <ul
@@ -77,10 +77,10 @@ exports[`renders compact no background successfully 1`] = `
77
77
  class="pf-c-tree-view__node"
78
78
  tabindex="-1"
79
79
  >
80
- <div
80
+ <span
81
81
  class="pf-c-tree-view__node-container"
82
82
  >
83
- <div
83
+ <span
84
84
  class="pf-c-tree-view__node-toggle"
85
85
  tabindex="-1"
86
86
  >
@@ -101,8 +101,8 @@ exports[`renders compact no background successfully 1`] = `
101
101
  />
102
102
  </svg>
103
103
  </span>
104
- </div>
105
- <div
104
+ </span>
105
+ <span
106
106
  class="pf-c-tree-view__node-content"
107
107
  >
108
108
  <span
@@ -110,8 +110,8 @@ exports[`renders compact no background successfully 1`] = `
110
110
  >
111
111
  Application 1
112
112
  </span>
113
- </div>
114
- </div>
113
+ </span>
114
+ </span>
115
115
  </button>
116
116
  </div>
117
117
  </li>
@@ -128,10 +128,10 @@ exports[`renders compact no background successfully 1`] = `
128
128
  class="pf-c-tree-view__node"
129
129
  tabindex="-1"
130
130
  >
131
- <div
131
+ <span
132
132
  class="pf-c-tree-view__node-container"
133
133
  >
134
- <div
134
+ <span
135
135
  class="pf-c-tree-view__node-toggle"
136
136
  tabindex="-1"
137
137
  >
@@ -152,8 +152,8 @@ exports[`renders compact no background successfully 1`] = `
152
152
  />
153
153
  </svg>
154
154
  </span>
155
- </div>
156
- <div
155
+ </span>
156
+ <span
157
157
  class="pf-c-tree-view__node-content"
158
158
  >
159
159
  <span
@@ -161,8 +161,8 @@ exports[`renders compact no background successfully 1`] = `
161
161
  >
162
162
  Application 2
163
163
  </span>
164
- </div>
165
- </div>
164
+ </span>
165
+ </span>
166
166
  </button>
167
167
  </div>
168
168
  </li>
@@ -181,10 +181,10 @@ exports[`renders compact no background successfully 1`] = `
181
181
  class="pf-c-tree-view__node"
182
182
  tabindex="-1"
183
183
  >
184
- <div
184
+ <span
185
185
  class="pf-c-tree-view__node-container"
186
186
  >
187
- <div
187
+ <span
188
188
  class="pf-c-tree-view__node-toggle"
189
189
  tabindex="-1"
190
190
  >
@@ -205,8 +205,8 @@ exports[`renders compact no background successfully 1`] = `
205
205
  />
206
206
  </svg>
207
207
  </span>
208
- </div>
209
- <div
208
+ </span>
209
+ <span
210
210
  class="pf-c-tree-view__node-content"
211
211
  >
212
212
  <span
@@ -214,8 +214,8 @@ exports[`renders compact no background successfully 1`] = `
214
214
  >
215
215
  Cost Management
216
216
  </span>
217
- </div>
218
- </div>
217
+ </span>
218
+ </span>
219
219
  </button>
220
220
  </div>
221
221
  </li>
@@ -232,10 +232,10 @@ exports[`renders compact no background successfully 1`] = `
232
232
  class="pf-c-tree-view__node"
233
233
  tabindex="-1"
234
234
  >
235
- <div
235
+ <span
236
236
  class="pf-c-tree-view__node-container"
237
237
  >
238
- <div
238
+ <span
239
239
  class="pf-c-tree-view__node-toggle"
240
240
  tabindex="-1"
241
241
  >
@@ -256,8 +256,8 @@ exports[`renders compact no background successfully 1`] = `
256
256
  />
257
257
  </svg>
258
258
  </span>
259
- </div>
260
- <div
259
+ </span>
260
+ <span
261
261
  class="pf-c-tree-view__node-content"
262
262
  >
263
263
  <span
@@ -265,8 +265,8 @@ exports[`renders compact no background successfully 1`] = `
265
265
  >
266
266
  Sources
267
267
  </span>
268
- </div>
269
- </div>
268
+ </span>
269
+ </span>
270
270
  </button>
271
271
  </div>
272
272
  </li>
@@ -283,10 +283,10 @@ exports[`renders compact no background successfully 1`] = `
283
283
  class="pf-c-tree-view__node"
284
284
  tabindex="-1"
285
285
  >
286
- <div
286
+ <span
287
287
  class="pf-c-tree-view__node-container"
288
288
  >
289
- <div
289
+ <span
290
290
  class="pf-c-tree-view__node-toggle"
291
291
  tabindex="-1"
292
292
  >
@@ -307,8 +307,8 @@ exports[`renders compact no background successfully 1`] = `
307
307
  />
308
308
  </svg>
309
309
  </span>
310
- </div>
311
- <div
310
+ </span>
311
+ <span
312
312
  class="pf-c-tree-view__node-content"
313
313
  >
314
314
  <span
@@ -316,8 +316,8 @@ exports[`renders compact no background successfully 1`] = `
316
316
  >
317
317
  Really really really long folder name that overflows the container it is in
318
318
  </span>
319
- </div>
320
- </div>
319
+ </span>
320
+ </span>
321
321
  </button>
322
322
  </div>
323
323
  </li>
@@ -349,10 +349,10 @@ exports[`renders compact successfully 1`] = `
349
349
  class="pf-c-tree-view__node"
350
350
  tabindex="0"
351
351
  >
352
- <div
352
+ <span
353
353
  class="pf-c-tree-view__node-container"
354
354
  >
355
- <div
355
+ <span
356
356
  class="pf-c-tree-view__node-toggle"
357
357
  tabindex="-1"
358
358
  >
@@ -373,8 +373,8 @@ exports[`renders compact successfully 1`] = `
373
373
  />
374
374
  </svg>
375
375
  </span>
376
- </div>
377
- <div
376
+ </span>
377
+ <span
378
378
  class="pf-c-tree-view__node-content"
379
379
  >
380
380
  <span
@@ -382,8 +382,8 @@ exports[`renders compact successfully 1`] = `
382
382
  >
383
383
  ApplicationLauncher
384
384
  </span>
385
- </div>
386
- </div>
385
+ </span>
386
+ </span>
387
387
  </button>
388
388
  </div>
389
389
  <ul
@@ -403,10 +403,10 @@ exports[`renders compact successfully 1`] = `
403
403
  class="pf-c-tree-view__node"
404
404
  tabindex="-1"
405
405
  >
406
- <div
406
+ <span
407
407
  class="pf-c-tree-view__node-container"
408
408
  >
409
- <div
409
+ <span
410
410
  class="pf-c-tree-view__node-toggle"
411
411
  tabindex="-1"
412
412
  >
@@ -427,8 +427,8 @@ exports[`renders compact successfully 1`] = `
427
427
  />
428
428
  </svg>
429
429
  </span>
430
- </div>
431
- <div
430
+ </span>
431
+ <span
432
432
  class="pf-c-tree-view__node-content"
433
433
  >
434
434
  <span
@@ -436,8 +436,8 @@ exports[`renders compact successfully 1`] = `
436
436
  >
437
437
  Application 1
438
438
  </span>
439
- </div>
440
- </div>
439
+ </span>
440
+ </span>
441
441
  </button>
442
442
  </div>
443
443
  </li>
@@ -454,10 +454,10 @@ exports[`renders compact successfully 1`] = `
454
454
  class="pf-c-tree-view__node"
455
455
  tabindex="-1"
456
456
  >
457
- <div
457
+ <span
458
458
  class="pf-c-tree-view__node-container"
459
459
  >
460
- <div
460
+ <span
461
461
  class="pf-c-tree-view__node-toggle"
462
462
  tabindex="-1"
463
463
  >
@@ -478,8 +478,8 @@ exports[`renders compact successfully 1`] = `
478
478
  />
479
479
  </svg>
480
480
  </span>
481
- </div>
482
- <div
481
+ </span>
482
+ <span
483
483
  class="pf-c-tree-view__node-content"
484
484
  >
485
485
  <span
@@ -487,8 +487,8 @@ exports[`renders compact successfully 1`] = `
487
487
  >
488
488
  Application 2
489
489
  </span>
490
- </div>
491
- </div>
490
+ </span>
491
+ </span>
492
492
  </button>
493
493
  </div>
494
494
  </li>
@@ -507,10 +507,10 @@ exports[`renders compact successfully 1`] = `
507
507
  class="pf-c-tree-view__node"
508
508
  tabindex="-1"
509
509
  >
510
- <div
510
+ <span
511
511
  class="pf-c-tree-view__node-container"
512
512
  >
513
- <div
513
+ <span
514
514
  class="pf-c-tree-view__node-toggle"
515
515
  tabindex="-1"
516
516
  >
@@ -531,8 +531,8 @@ exports[`renders compact successfully 1`] = `
531
531
  />
532
532
  </svg>
533
533
  </span>
534
- </div>
535
- <div
534
+ </span>
535
+ <span
536
536
  class="pf-c-tree-view__node-content"
537
537
  >
538
538
  <span
@@ -540,8 +540,8 @@ exports[`renders compact successfully 1`] = `
540
540
  >
541
541
  Cost Management
542
542
  </span>
543
- </div>
544
- </div>
543
+ </span>
544
+ </span>
545
545
  </button>
546
546
  </div>
547
547
  </li>
@@ -558,10 +558,10 @@ exports[`renders compact successfully 1`] = `
558
558
  class="pf-c-tree-view__node"
559
559
  tabindex="-1"
560
560
  >
561
- <div
561
+ <span
562
562
  class="pf-c-tree-view__node-container"
563
563
  >
564
- <div
564
+ <span
565
565
  class="pf-c-tree-view__node-toggle"
566
566
  tabindex="-1"
567
567
  >
@@ -582,8 +582,8 @@ exports[`renders compact successfully 1`] = `
582
582
  />
583
583
  </svg>
584
584
  </span>
585
- </div>
586
- <div
585
+ </span>
586
+ <span
587
587
  class="pf-c-tree-view__node-content"
588
588
  >
589
589
  <span
@@ -591,8 +591,8 @@ exports[`renders compact successfully 1`] = `
591
591
  >
592
592
  Sources
593
593
  </span>
594
- </div>
595
- </div>
594
+ </span>
595
+ </span>
596
596
  </button>
597
597
  </div>
598
598
  </li>
@@ -609,10 +609,10 @@ exports[`renders compact successfully 1`] = `
609
609
  class="pf-c-tree-view__node"
610
610
  tabindex="-1"
611
611
  >
612
- <div
612
+ <span
613
613
  class="pf-c-tree-view__node-container"
614
614
  >
615
- <div
615
+ <span
616
616
  class="pf-c-tree-view__node-toggle"
617
617
  tabindex="-1"
618
618
  >
@@ -633,8 +633,8 @@ exports[`renders compact successfully 1`] = `
633
633
  />
634
634
  </svg>
635
635
  </span>
636
- </div>
637
- <div
636
+ </span>
637
+ <span
638
638
  class="pf-c-tree-view__node-content"
639
639
  >
640
640
  <span
@@ -642,8 +642,8 @@ exports[`renders compact successfully 1`] = `
642
642
  >
643
643
  Really really really long folder name that overflows the container it is in
644
644
  </span>
645
- </div>
646
- </div>
645
+ </span>
646
+ </span>
647
647
  </button>
648
648
  </div>
649
649
  </li>
@@ -675,10 +675,10 @@ exports[`renders guides successfully 1`] = `
675
675
  class="pf-c-tree-view__node"
676
676
  tabindex="0"
677
677
  >
678
- <div
678
+ <span
679
679
  class="pf-c-tree-view__node-container"
680
680
  >
681
- <div
681
+ <span
682
682
  class="pf-c-tree-view__node-toggle"
683
683
  tabindex="-1"
684
684
  >
@@ -699,13 +699,13 @@ exports[`renders guides successfully 1`] = `
699
699
  />
700
700
  </svg>
701
701
  </span>
702
- </div>
702
+ </span>
703
703
  <span
704
704
  class="pf-c-tree-view__node-text"
705
705
  >
706
706
  ApplicationLauncher
707
707
  </span>
708
- </div>
708
+ </span>
709
709
  </button>
710
710
  </div>
711
711
  <ul
@@ -725,10 +725,10 @@ exports[`renders guides successfully 1`] = `
725
725
  class="pf-c-tree-view__node"
726
726
  tabindex="-1"
727
727
  >
728
- <div
728
+ <span
729
729
  class="pf-c-tree-view__node-container"
730
730
  >
731
- <div
731
+ <span
732
732
  class="pf-c-tree-view__node-toggle"
733
733
  tabindex="-1"
734
734
  >
@@ -749,13 +749,13 @@ exports[`renders guides successfully 1`] = `
749
749
  />
750
750
  </svg>
751
751
  </span>
752
- </div>
752
+ </span>
753
753
  <span
754
754
  class="pf-c-tree-view__node-text"
755
755
  >
756
756
  Application 1
757
757
  </span>
758
- </div>
758
+ </span>
759
759
  </button>
760
760
  </div>
761
761
  </li>
@@ -772,10 +772,10 @@ exports[`renders guides successfully 1`] = `
772
772
  class="pf-c-tree-view__node"
773
773
  tabindex="-1"
774
774
  >
775
- <div
775
+ <span
776
776
  class="pf-c-tree-view__node-container"
777
777
  >
778
- <div
778
+ <span
779
779
  class="pf-c-tree-view__node-toggle"
780
780
  tabindex="-1"
781
781
  >
@@ -796,13 +796,13 @@ exports[`renders guides successfully 1`] = `
796
796
  />
797
797
  </svg>
798
798
  </span>
799
- </div>
799
+ </span>
800
800
  <span
801
801
  class="pf-c-tree-view__node-text"
802
802
  >
803
803
  Application 2
804
804
  </span>
805
- </div>
805
+ </span>
806
806
  </button>
807
807
  </div>
808
808
  </li>
@@ -821,10 +821,10 @@ exports[`renders guides successfully 1`] = `
821
821
  class="pf-c-tree-view__node"
822
822
  tabindex="-1"
823
823
  >
824
- <div
824
+ <span
825
825
  class="pf-c-tree-view__node-container"
826
826
  >
827
- <div
827
+ <span
828
828
  class="pf-c-tree-view__node-toggle"
829
829
  tabindex="-1"
830
830
  >
@@ -845,13 +845,13 @@ exports[`renders guides successfully 1`] = `
845
845
  />
846
846
  </svg>
847
847
  </span>
848
- </div>
848
+ </span>
849
849
  <span
850
850
  class="pf-c-tree-view__node-text"
851
851
  >
852
852
  Cost Management
853
853
  </span>
854
- </div>
854
+ </span>
855
855
  </button>
856
856
  </div>
857
857
  </li>
@@ -868,10 +868,10 @@ exports[`renders guides successfully 1`] = `
868
868
  class="pf-c-tree-view__node"
869
869
  tabindex="-1"
870
870
  >
871
- <div
871
+ <span
872
872
  class="pf-c-tree-view__node-container"
873
873
  >
874
- <div
874
+ <span
875
875
  class="pf-c-tree-view__node-toggle"
876
876
  tabindex="-1"
877
877
  >
@@ -892,13 +892,13 @@ exports[`renders guides successfully 1`] = `
892
892
  />
893
893
  </svg>
894
894
  </span>
895
- </div>
895
+ </span>
896
896
  <span
897
897
  class="pf-c-tree-view__node-text"
898
898
  >
899
899
  Sources
900
900
  </span>
901
- </div>
901
+ </span>
902
902
  </button>
903
903
  </div>
904
904
  </li>
@@ -915,10 +915,10 @@ exports[`renders guides successfully 1`] = `
915
915
  class="pf-c-tree-view__node"
916
916
  tabindex="-1"
917
917
  >
918
- <div
918
+ <span
919
919
  class="pf-c-tree-view__node-container"
920
920
  >
921
- <div
921
+ <span
922
922
  class="pf-c-tree-view__node-toggle"
923
923
  tabindex="-1"
924
924
  >
@@ -939,13 +939,13 @@ exports[`renders guides successfully 1`] = `
939
939
  />
940
940
  </svg>
941
941
  </span>
942
- </div>
942
+ </span>
943
943
  <span
944
944
  class="pf-c-tree-view__node-text"
945
945
  >
946
946
  Really really really long folder name that overflows the container it is in
947
947
  </span>
948
- </div>
948
+ </span>
949
949
  </button>
950
950
  </div>
951
951
  </li>
@@ -977,10 +977,10 @@ exports[`tree view renders active successfully 1`] = `
977
977
  class="pf-c-tree-view__node"
978
978
  tabindex="0"
979
979
  >
980
- <div
980
+ <span
981
981
  class="pf-c-tree-view__node-container"
982
982
  >
983
- <div
983
+ <span
984
984
  class="pf-c-tree-view__node-toggle"
985
985
  tabindex="-1"
986
986
  >
@@ -1001,13 +1001,13 @@ exports[`tree view renders active successfully 1`] = `
1001
1001
  />
1002
1002
  </svg>
1003
1003
  </span>
1004
- </div>
1004
+ </span>
1005
1005
  <span
1006
1006
  class="pf-c-tree-view__node-text"
1007
1007
  >
1008
1008
  ApplicationLauncher
1009
1009
  </span>
1010
- </div>
1010
+ </span>
1011
1011
  </button>
1012
1012
  </div>
1013
1013
  <ul
@@ -1027,10 +1027,10 @@ exports[`tree view renders active successfully 1`] = `
1027
1027
  class="pf-c-tree-view__node"
1028
1028
  tabindex="-1"
1029
1029
  >
1030
- <div
1030
+ <span
1031
1031
  class="pf-c-tree-view__node-container"
1032
1032
  >
1033
- <div
1033
+ <span
1034
1034
  class="pf-c-tree-view__node-toggle"
1035
1035
  tabindex="-1"
1036
1036
  >
@@ -1051,13 +1051,13 @@ exports[`tree view renders active successfully 1`] = `
1051
1051
  />
1052
1052
  </svg>
1053
1053
  </span>
1054
- </div>
1054
+ </span>
1055
1055
  <span
1056
1056
  class="pf-c-tree-view__node-text"
1057
1057
  >
1058
1058
  Application 1
1059
1059
  </span>
1060
- </div>
1060
+ </span>
1061
1061
  </button>
1062
1062
  </div>
1063
1063
  </li>
@@ -1074,10 +1074,10 @@ exports[`tree view renders active successfully 1`] = `
1074
1074
  class="pf-c-tree-view__node"
1075
1075
  tabindex="-1"
1076
1076
  >
1077
- <div
1077
+ <span
1078
1078
  class="pf-c-tree-view__node-container"
1079
1079
  >
1080
- <div
1080
+ <span
1081
1081
  class="pf-c-tree-view__node-toggle"
1082
1082
  tabindex="-1"
1083
1083
  >
@@ -1098,13 +1098,13 @@ exports[`tree view renders active successfully 1`] = `
1098
1098
  />
1099
1099
  </svg>
1100
1100
  </span>
1101
- </div>
1101
+ </span>
1102
1102
  <span
1103
1103
  class="pf-c-tree-view__node-text"
1104
1104
  >
1105
1105
  Application 2
1106
1106
  </span>
1107
- </div>
1107
+ </span>
1108
1108
  </button>
1109
1109
  </div>
1110
1110
  </li>
@@ -1123,10 +1123,10 @@ exports[`tree view renders active successfully 1`] = `
1123
1123
  class="pf-c-tree-view__node"
1124
1124
  tabindex="-1"
1125
1125
  >
1126
- <div
1126
+ <span
1127
1127
  class="pf-c-tree-view__node-container"
1128
1128
  >
1129
- <div
1129
+ <span
1130
1130
  class="pf-c-tree-view__node-toggle"
1131
1131
  tabindex="-1"
1132
1132
  >
@@ -1147,13 +1147,13 @@ exports[`tree view renders active successfully 1`] = `
1147
1147
  />
1148
1148
  </svg>
1149
1149
  </span>
1150
- </div>
1150
+ </span>
1151
1151
  <span
1152
1152
  class="pf-c-tree-view__node-text"
1153
1153
  >
1154
1154
  Cost Management
1155
1155
  </span>
1156
- </div>
1156
+ </span>
1157
1157
  </button>
1158
1158
  </div>
1159
1159
  </li>
@@ -1170,10 +1170,10 @@ exports[`tree view renders active successfully 1`] = `
1170
1170
  class="pf-c-tree-view__node"
1171
1171
  tabindex="-1"
1172
1172
  >
1173
- <div
1173
+ <span
1174
1174
  class="pf-c-tree-view__node-container"
1175
1175
  >
1176
- <div
1176
+ <span
1177
1177
  class="pf-c-tree-view__node-toggle"
1178
1178
  tabindex="-1"
1179
1179
  >
@@ -1194,13 +1194,13 @@ exports[`tree view renders active successfully 1`] = `
1194
1194
  />
1195
1195
  </svg>
1196
1196
  </span>
1197
- </div>
1197
+ </span>
1198
1198
  <span
1199
1199
  class="pf-c-tree-view__node-text"
1200
1200
  >
1201
1201
  Sources
1202
1202
  </span>
1203
- </div>
1203
+ </span>
1204
1204
  </button>
1205
1205
  </div>
1206
1206
  </li>
@@ -1217,10 +1217,10 @@ exports[`tree view renders active successfully 1`] = `
1217
1217
  class="pf-c-tree-view__node"
1218
1218
  tabindex="-1"
1219
1219
  >
1220
- <div
1220
+ <span
1221
1221
  class="pf-c-tree-view__node-container"
1222
1222
  >
1223
- <div
1223
+ <span
1224
1224
  class="pf-c-tree-view__node-toggle"
1225
1225
  tabindex="-1"
1226
1226
  >
@@ -1241,13 +1241,13 @@ exports[`tree view renders active successfully 1`] = `
1241
1241
  />
1242
1242
  </svg>
1243
1243
  </span>
1244
- </div>
1244
+ </span>
1245
1245
  <span
1246
1246
  class="pf-c-tree-view__node-text"
1247
1247
  >
1248
1248
  Really really really long folder name that overflows the container it is in
1249
1249
  </span>
1250
- </div>
1250
+ </span>
1251
1251
  </button>
1252
1252
  </div>
1253
1253
  </li>
@@ -1279,10 +1279,10 @@ exports[`tree view renders badges successfully 1`] = `
1279
1279
  class="pf-c-tree-view__node"
1280
1280
  tabindex="0"
1281
1281
  >
1282
- <div
1282
+ <span
1283
1283
  class="pf-c-tree-view__node-container"
1284
1284
  >
1285
- <div
1285
+ <span
1286
1286
  class="pf-c-tree-view__node-toggle"
1287
1287
  tabindex="-1"
1288
1288
  >
@@ -1303,7 +1303,7 @@ exports[`tree view renders badges successfully 1`] = `
1303
1303
  />
1304
1304
  </svg>
1305
1305
  </span>
1306
- </div>
1306
+ </span>
1307
1307
  <span
1308
1308
  class="pf-c-tree-view__node-text"
1309
1309
  >
@@ -1318,7 +1318,7 @@ exports[`tree view renders badges successfully 1`] = `
1318
1318
  2
1319
1319
  </span>
1320
1320
  </span>
1321
- </div>
1321
+ </span>
1322
1322
  </button>
1323
1323
  </div>
1324
1324
  <ul
@@ -1338,10 +1338,10 @@ exports[`tree view renders badges successfully 1`] = `
1338
1338
  class="pf-c-tree-view__node"
1339
1339
  tabindex="-1"
1340
1340
  >
1341
- <div
1341
+ <span
1342
1342
  class="pf-c-tree-view__node-container"
1343
1343
  >
1344
- <div
1344
+ <span
1345
1345
  class="pf-c-tree-view__node-toggle"
1346
1346
  tabindex="-1"
1347
1347
  >
@@ -1362,7 +1362,7 @@ exports[`tree view renders badges successfully 1`] = `
1362
1362
  />
1363
1363
  </svg>
1364
1364
  </span>
1365
- </div>
1365
+ </span>
1366
1366
  <span
1367
1367
  class="pf-c-tree-view__node-text"
1368
1368
  >
@@ -1377,7 +1377,7 @@ exports[`tree view renders badges successfully 1`] = `
1377
1377
  2
1378
1378
  </span>
1379
1379
  </span>
1380
- </div>
1380
+ </span>
1381
1381
  </button>
1382
1382
  </div>
1383
1383
  </li>
@@ -1394,10 +1394,10 @@ exports[`tree view renders badges successfully 1`] = `
1394
1394
  class="pf-c-tree-view__node"
1395
1395
  tabindex="-1"
1396
1396
  >
1397
- <div
1397
+ <span
1398
1398
  class="pf-c-tree-view__node-container"
1399
1399
  >
1400
- <div
1400
+ <span
1401
1401
  class="pf-c-tree-view__node-toggle"
1402
1402
  tabindex="-1"
1403
1403
  >
@@ -1418,7 +1418,7 @@ exports[`tree view renders badges successfully 1`] = `
1418
1418
  />
1419
1419
  </svg>
1420
1420
  </span>
1421
- </div>
1421
+ </span>
1422
1422
  <span
1423
1423
  class="pf-c-tree-view__node-text"
1424
1424
  >
@@ -1433,7 +1433,7 @@ exports[`tree view renders badges successfully 1`] = `
1433
1433
  2
1434
1434
  </span>
1435
1435
  </span>
1436
- </div>
1436
+ </span>
1437
1437
  </button>
1438
1438
  </div>
1439
1439
  </li>
@@ -1452,10 +1452,10 @@ exports[`tree view renders badges successfully 1`] = `
1452
1452
  class="pf-c-tree-view__node"
1453
1453
  tabindex="-1"
1454
1454
  >
1455
- <div
1455
+ <span
1456
1456
  class="pf-c-tree-view__node-container"
1457
1457
  >
1458
- <div
1458
+ <span
1459
1459
  class="pf-c-tree-view__node-toggle"
1460
1460
  tabindex="-1"
1461
1461
  >
@@ -1476,7 +1476,7 @@ exports[`tree view renders badges successfully 1`] = `
1476
1476
  />
1477
1477
  </svg>
1478
1478
  </span>
1479
- </div>
1479
+ </span>
1480
1480
  <span
1481
1481
  class="pf-c-tree-view__node-text"
1482
1482
  >
@@ -1491,7 +1491,7 @@ exports[`tree view renders badges successfully 1`] = `
1491
1491
  1
1492
1492
  </span>
1493
1493
  </span>
1494
- </div>
1494
+ </span>
1495
1495
  </button>
1496
1496
  </div>
1497
1497
  </li>
@@ -1508,10 +1508,10 @@ exports[`tree view renders badges successfully 1`] = `
1508
1508
  class="pf-c-tree-view__node"
1509
1509
  tabindex="-1"
1510
1510
  >
1511
- <div
1511
+ <span
1512
1512
  class="pf-c-tree-view__node-container"
1513
1513
  >
1514
- <div
1514
+ <span
1515
1515
  class="pf-c-tree-view__node-toggle"
1516
1516
  tabindex="-1"
1517
1517
  >
@@ -1532,7 +1532,7 @@ exports[`tree view renders badges successfully 1`] = `
1532
1532
  />
1533
1533
  </svg>
1534
1534
  </span>
1535
- </div>
1535
+ </span>
1536
1536
  <span
1537
1537
  class="pf-c-tree-view__node-text"
1538
1538
  >
@@ -1547,7 +1547,7 @@ exports[`tree view renders badges successfully 1`] = `
1547
1547
  1
1548
1548
  </span>
1549
1549
  </span>
1550
- </div>
1550
+ </span>
1551
1551
  </button>
1552
1552
  </div>
1553
1553
  </li>
@@ -1564,10 +1564,10 @@ exports[`tree view renders badges successfully 1`] = `
1564
1564
  class="pf-c-tree-view__node"
1565
1565
  tabindex="-1"
1566
1566
  >
1567
- <div
1567
+ <span
1568
1568
  class="pf-c-tree-view__node-container"
1569
1569
  >
1570
- <div
1570
+ <span
1571
1571
  class="pf-c-tree-view__node-toggle"
1572
1572
  tabindex="-1"
1573
1573
  >
@@ -1588,7 +1588,7 @@ exports[`tree view renders badges successfully 1`] = `
1588
1588
  />
1589
1589
  </svg>
1590
1590
  </span>
1591
- </div>
1591
+ </span>
1592
1592
  <span
1593
1593
  class="pf-c-tree-view__node-text"
1594
1594
  >
@@ -1603,7 +1603,7 @@ exports[`tree view renders badges successfully 1`] = `
1603
1603
  1
1604
1604
  </span>
1605
1605
  </span>
1606
- </div>
1606
+ </span>
1607
1607
  </button>
1608
1608
  </div>
1609
1609
  </li>
@@ -1635,10 +1635,10 @@ exports[`tree view renders basic successfully 1`] = `
1635
1635
  class="pf-c-tree-view__node"
1636
1636
  tabindex="0"
1637
1637
  >
1638
- <div
1638
+ <span
1639
1639
  class="pf-c-tree-view__node-container"
1640
1640
  >
1641
- <div
1641
+ <span
1642
1642
  class="pf-c-tree-view__node-toggle"
1643
1643
  tabindex="-1"
1644
1644
  >
@@ -1659,13 +1659,13 @@ exports[`tree view renders basic successfully 1`] = `
1659
1659
  />
1660
1660
  </svg>
1661
1661
  </span>
1662
- </div>
1662
+ </span>
1663
1663
  <span
1664
1664
  class="pf-c-tree-view__node-text"
1665
1665
  >
1666
1666
  ApplicationLauncher
1667
1667
  </span>
1668
- </div>
1668
+ </span>
1669
1669
  </button>
1670
1670
  </div>
1671
1671
  <ul
@@ -1685,10 +1685,10 @@ exports[`tree view renders basic successfully 1`] = `
1685
1685
  class="pf-c-tree-view__node"
1686
1686
  tabindex="-1"
1687
1687
  >
1688
- <div
1688
+ <span
1689
1689
  class="pf-c-tree-view__node-container"
1690
1690
  >
1691
- <div
1691
+ <span
1692
1692
  class="pf-c-tree-view__node-toggle"
1693
1693
  tabindex="-1"
1694
1694
  >
@@ -1709,13 +1709,13 @@ exports[`tree view renders basic successfully 1`] = `
1709
1709
  />
1710
1710
  </svg>
1711
1711
  </span>
1712
- </div>
1712
+ </span>
1713
1713
  <span
1714
1714
  class="pf-c-tree-view__node-text"
1715
1715
  >
1716
1716
  Application 1
1717
1717
  </span>
1718
- </div>
1718
+ </span>
1719
1719
  </button>
1720
1720
  </div>
1721
1721
  </li>
@@ -1732,10 +1732,10 @@ exports[`tree view renders basic successfully 1`] = `
1732
1732
  class="pf-c-tree-view__node"
1733
1733
  tabindex="-1"
1734
1734
  >
1735
- <div
1735
+ <span
1736
1736
  class="pf-c-tree-view__node-container"
1737
1737
  >
1738
- <div
1738
+ <span
1739
1739
  class="pf-c-tree-view__node-toggle"
1740
1740
  tabindex="-1"
1741
1741
  >
@@ -1756,13 +1756,13 @@ exports[`tree view renders basic successfully 1`] = `
1756
1756
  />
1757
1757
  </svg>
1758
1758
  </span>
1759
- </div>
1759
+ </span>
1760
1760
  <span
1761
1761
  class="pf-c-tree-view__node-text"
1762
1762
  >
1763
1763
  Application 2
1764
1764
  </span>
1765
- </div>
1765
+ </span>
1766
1766
  </button>
1767
1767
  </div>
1768
1768
  </li>
@@ -1781,10 +1781,10 @@ exports[`tree view renders basic successfully 1`] = `
1781
1781
  class="pf-c-tree-view__node"
1782
1782
  tabindex="-1"
1783
1783
  >
1784
- <div
1784
+ <span
1785
1785
  class="pf-c-tree-view__node-container"
1786
1786
  >
1787
- <div
1787
+ <span
1788
1788
  class="pf-c-tree-view__node-toggle"
1789
1789
  tabindex="-1"
1790
1790
  >
@@ -1805,13 +1805,13 @@ exports[`tree view renders basic successfully 1`] = `
1805
1805
  />
1806
1806
  </svg>
1807
1807
  </span>
1808
- </div>
1808
+ </span>
1809
1809
  <span
1810
1810
  class="pf-c-tree-view__node-text"
1811
1811
  >
1812
1812
  Cost Management
1813
1813
  </span>
1814
- </div>
1814
+ </span>
1815
1815
  </button>
1816
1816
  </div>
1817
1817
  </li>
@@ -1828,10 +1828,10 @@ exports[`tree view renders basic successfully 1`] = `
1828
1828
  class="pf-c-tree-view__node"
1829
1829
  tabindex="-1"
1830
1830
  >
1831
- <div
1831
+ <span
1832
1832
  class="pf-c-tree-view__node-container"
1833
1833
  >
1834
- <div
1834
+ <span
1835
1835
  class="pf-c-tree-view__node-toggle"
1836
1836
  tabindex="-1"
1837
1837
  >
@@ -1852,13 +1852,13 @@ exports[`tree view renders basic successfully 1`] = `
1852
1852
  />
1853
1853
  </svg>
1854
1854
  </span>
1855
- </div>
1855
+ </span>
1856
1856
  <span
1857
1857
  class="pf-c-tree-view__node-text"
1858
1858
  >
1859
1859
  Sources
1860
1860
  </span>
1861
- </div>
1861
+ </span>
1862
1862
  </button>
1863
1863
  </div>
1864
1864
  </li>
@@ -1875,10 +1875,10 @@ exports[`tree view renders basic successfully 1`] = `
1875
1875
  class="pf-c-tree-view__node"
1876
1876
  tabindex="-1"
1877
1877
  >
1878
- <div
1878
+ <span
1879
1879
  class="pf-c-tree-view__node-container"
1880
1880
  >
1881
- <div
1881
+ <span
1882
1882
  class="pf-c-tree-view__node-toggle"
1883
1883
  tabindex="-1"
1884
1884
  >
@@ -1899,13 +1899,13 @@ exports[`tree view renders basic successfully 1`] = `
1899
1899
  />
1900
1900
  </svg>
1901
1901
  </span>
1902
- </div>
1902
+ </span>
1903
1903
  <span
1904
1904
  class="pf-c-tree-view__node-text"
1905
1905
  >
1906
1906
  Really really really long folder name that overflows the container it is in
1907
1907
  </span>
1908
- </div>
1908
+ </span>
1909
1909
  </button>
1910
1910
  </div>
1911
1911
  </li>
@@ -1933,11 +1933,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
1933
1933
  <div
1934
1934
  class="pf-c-tree-view__content"
1935
1935
  >
1936
- <div
1937
- class="pf-c-tree-view__node"
1936
+ <label
1937
+ class="pf-c-tree-view__node pf-m-selectable"
1938
+ for="checkbox-id18"
1939
+ id="label-checkbox-id18"
1938
1940
  tabindex="-1"
1939
1941
  >
1940
- <div
1942
+ <span
1941
1943
  class="pf-c-tree-view__node-container"
1942
1944
  >
1943
1945
  <button
@@ -1972,15 +1974,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
1972
1974
  type="checkbox"
1973
1975
  />
1974
1976
  </span>
1975
- <label
1977
+ <span
1976
1978
  class="pf-c-tree-view__node-text"
1977
- for="checkbox-id18"
1978
- id="label-checkbox-id18"
1979
1979
  >
1980
1980
  ApplicationLauncher
1981
- </label>
1982
- </div>
1983
- </div>
1981
+ </span>
1982
+ </span>
1983
+ </label>
1984
1984
  </div>
1985
1985
  <ul
1986
1986
  class="pf-c-tree-view__list"
@@ -1995,11 +1995,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
1995
1995
  <div
1996
1996
  class="pf-c-tree-view__content"
1997
1997
  >
1998
- <div
1999
- class="pf-c-tree-view__node"
1998
+ <label
1999
+ class="pf-c-tree-view__node pf-m-selectable"
2000
+ for="checkbox-id19"
2001
+ id="label-checkbox-id19"
2000
2002
  tabindex="-1"
2001
2003
  >
2002
- <div
2004
+ <span
2003
2005
  class="pf-c-tree-view__node-container"
2004
2006
  >
2005
2007
  <button
@@ -2034,15 +2036,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2034
2036
  type="checkbox"
2035
2037
  />
2036
2038
  </span>
2037
- <label
2039
+ <span
2038
2040
  class="pf-c-tree-view__node-text"
2039
- for="checkbox-id19"
2040
- id="label-checkbox-id19"
2041
2041
  >
2042
2042
  Application 1
2043
- </label>
2044
- </div>
2045
- </div>
2043
+ </span>
2044
+ </span>
2045
+ </label>
2046
2046
  </div>
2047
2047
  </li>
2048
2048
  <li
@@ -2054,11 +2054,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2054
2054
  <div
2055
2055
  class="pf-c-tree-view__content"
2056
2056
  >
2057
- <div
2058
- class="pf-c-tree-view__node"
2057
+ <label
2058
+ class="pf-c-tree-view__node pf-m-selectable"
2059
+ for="checkbox-id20"
2060
+ id="label-checkbox-id20"
2059
2061
  tabindex="-1"
2060
2062
  >
2061
- <div
2063
+ <span
2062
2064
  class="pf-c-tree-view__node-container"
2063
2065
  >
2064
2066
  <button
@@ -2093,15 +2095,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2093
2095
  type="checkbox"
2094
2096
  />
2095
2097
  </span>
2096
- <label
2098
+ <span
2097
2099
  class="pf-c-tree-view__node-text"
2098
- for="checkbox-id20"
2099
- id="label-checkbox-id20"
2100
2100
  >
2101
2101
  Application 2
2102
- </label>
2103
- </div>
2104
- </div>
2102
+ </span>
2103
+ </span>
2104
+ </label>
2105
2105
  </div>
2106
2106
  </li>
2107
2107
  </ul>
@@ -2115,11 +2115,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2115
2115
  <div
2116
2116
  class="pf-c-tree-view__content"
2117
2117
  >
2118
- <div
2119
- class="pf-c-tree-view__node"
2118
+ <label
2119
+ class="pf-c-tree-view__node pf-m-selectable"
2120
+ for="checkbox-id21"
2121
+ id="label-checkbox-id21"
2120
2122
  tabindex="-1"
2121
2123
  >
2122
- <div
2124
+ <span
2123
2125
  class="pf-c-tree-view__node-container"
2124
2126
  >
2125
2127
  <button
@@ -2154,15 +2156,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2154
2156
  type="checkbox"
2155
2157
  />
2156
2158
  </span>
2157
- <label
2159
+ <span
2158
2160
  class="pf-c-tree-view__node-text"
2159
- for="checkbox-id21"
2160
- id="label-checkbox-id21"
2161
2161
  >
2162
2162
  Cost Management
2163
- </label>
2164
- </div>
2165
- </div>
2163
+ </span>
2164
+ </span>
2165
+ </label>
2166
2166
  </div>
2167
2167
  </li>
2168
2168
  <li
@@ -2174,11 +2174,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2174
2174
  <div
2175
2175
  class="pf-c-tree-view__content"
2176
2176
  >
2177
- <div
2178
- class="pf-c-tree-view__node"
2177
+ <label
2178
+ class="pf-c-tree-view__node pf-m-selectable"
2179
+ for="checkbox-id22"
2180
+ id="label-checkbox-id22"
2179
2181
  tabindex="-1"
2180
2182
  >
2181
- <div
2183
+ <span
2182
2184
  class="pf-c-tree-view__node-container"
2183
2185
  >
2184
2186
  <button
@@ -2213,15 +2215,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2213
2215
  type="checkbox"
2214
2216
  />
2215
2217
  </span>
2216
- <label
2218
+ <span
2217
2219
  class="pf-c-tree-view__node-text"
2218
- for="checkbox-id22"
2219
- id="label-checkbox-id22"
2220
2220
  >
2221
2221
  Sources
2222
- </label>
2223
- </div>
2224
- </div>
2222
+ </span>
2223
+ </span>
2224
+ </label>
2225
2225
  </div>
2226
2226
  </li>
2227
2227
  <li
@@ -2233,11 +2233,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2233
2233
  <div
2234
2234
  class="pf-c-tree-view__content"
2235
2235
  >
2236
- <div
2237
- class="pf-c-tree-view__node"
2236
+ <label
2237
+ class="pf-c-tree-view__node pf-m-selectable"
2238
+ for="checkbox-id23"
2239
+ id="label-checkbox-id23"
2238
2240
  tabindex="-1"
2239
2241
  >
2240
- <div
2242
+ <span
2241
2243
  class="pf-c-tree-view__node-container"
2242
2244
  >
2243
2245
  <button
@@ -2272,15 +2274,13 @@ exports[`tree view renders checkboxes successfully 1`] = `
2272
2274
  type="checkbox"
2273
2275
  />
2274
2276
  </span>
2275
- <label
2277
+ <span
2276
2278
  class="pf-c-tree-view__node-text"
2277
- for="checkbox-id23"
2278
- id="label-checkbox-id23"
2279
2279
  >
2280
2280
  Really really really long folder name that overflows the container it is in
2281
- </label>
2282
- </div>
2283
- </div>
2281
+ </span>
2282
+ </span>
2283
+ </label>
2284
2284
  </div>
2285
2285
  </li>
2286
2286
  </ul>
@@ -2311,10 +2311,10 @@ exports[`tree view renders icons successfully 1`] = `
2311
2311
  class="pf-c-tree-view__node"
2312
2312
  tabindex="0"
2313
2313
  >
2314
- <div
2314
+ <span
2315
2315
  class="pf-c-tree-view__node-container"
2316
2316
  >
2317
- <div
2317
+ <span
2318
2318
  class="pf-c-tree-view__node-toggle"
2319
2319
  tabindex="-1"
2320
2320
  >
@@ -2335,7 +2335,7 @@ exports[`tree view renders icons successfully 1`] = `
2335
2335
  />
2336
2336
  </svg>
2337
2337
  </span>
2338
- </div>
2338
+ </span>
2339
2339
  <span
2340
2340
  class="pf-c-tree-view__node-icon"
2341
2341
  >
@@ -2358,7 +2358,7 @@ exports[`tree view renders icons successfully 1`] = `
2358
2358
  >
2359
2359
  ApplicationLauncher
2360
2360
  </span>
2361
- </div>
2361
+ </span>
2362
2362
  </button>
2363
2363
  </div>
2364
2364
  <ul
@@ -2378,10 +2378,10 @@ exports[`tree view renders icons successfully 1`] = `
2378
2378
  class="pf-c-tree-view__node"
2379
2379
  tabindex="-1"
2380
2380
  >
2381
- <div
2381
+ <span
2382
2382
  class="pf-c-tree-view__node-container"
2383
2383
  >
2384
- <div
2384
+ <span
2385
2385
  class="pf-c-tree-view__node-toggle"
2386
2386
  tabindex="-1"
2387
2387
  >
@@ -2402,7 +2402,7 @@ exports[`tree view renders icons successfully 1`] = `
2402
2402
  />
2403
2403
  </svg>
2404
2404
  </span>
2405
- </div>
2405
+ </span>
2406
2406
  <span
2407
2407
  class="pf-c-tree-view__node-icon"
2408
2408
  >
@@ -2425,7 +2425,7 @@ exports[`tree view renders icons successfully 1`] = `
2425
2425
  >
2426
2426
  Application 1
2427
2427
  </span>
2428
- </div>
2428
+ </span>
2429
2429
  </button>
2430
2430
  </div>
2431
2431
  </li>
@@ -2442,10 +2442,10 @@ exports[`tree view renders icons successfully 1`] = `
2442
2442
  class="pf-c-tree-view__node"
2443
2443
  tabindex="-1"
2444
2444
  >
2445
- <div
2445
+ <span
2446
2446
  class="pf-c-tree-view__node-container"
2447
2447
  >
2448
- <div
2448
+ <span
2449
2449
  class="pf-c-tree-view__node-toggle"
2450
2450
  tabindex="-1"
2451
2451
  >
@@ -2466,7 +2466,7 @@ exports[`tree view renders icons successfully 1`] = `
2466
2466
  />
2467
2467
  </svg>
2468
2468
  </span>
2469
- </div>
2469
+ </span>
2470
2470
  <span
2471
2471
  class="pf-c-tree-view__node-icon"
2472
2472
  >
@@ -2489,7 +2489,7 @@ exports[`tree view renders icons successfully 1`] = `
2489
2489
  >
2490
2490
  Application 2
2491
2491
  </span>
2492
- </div>
2492
+ </span>
2493
2493
  </button>
2494
2494
  </div>
2495
2495
  </li>
@@ -2508,10 +2508,10 @@ exports[`tree view renders icons successfully 1`] = `
2508
2508
  class="pf-c-tree-view__node"
2509
2509
  tabindex="-1"
2510
2510
  >
2511
- <div
2511
+ <span
2512
2512
  class="pf-c-tree-view__node-container"
2513
2513
  >
2514
- <div
2514
+ <span
2515
2515
  class="pf-c-tree-view__node-toggle"
2516
2516
  tabindex="-1"
2517
2517
  >
@@ -2532,7 +2532,7 @@ exports[`tree view renders icons successfully 1`] = `
2532
2532
  />
2533
2533
  </svg>
2534
2534
  </span>
2535
- </div>
2535
+ </span>
2536
2536
  <span
2537
2537
  class="pf-c-tree-view__node-icon"
2538
2538
  >
@@ -2555,7 +2555,7 @@ exports[`tree view renders icons successfully 1`] = `
2555
2555
  >
2556
2556
  Cost Management
2557
2557
  </span>
2558
- </div>
2558
+ </span>
2559
2559
  </button>
2560
2560
  </div>
2561
2561
  </li>
@@ -2572,10 +2572,10 @@ exports[`tree view renders icons successfully 1`] = `
2572
2572
  class="pf-c-tree-view__node"
2573
2573
  tabindex="-1"
2574
2574
  >
2575
- <div
2575
+ <span
2576
2576
  class="pf-c-tree-view__node-container"
2577
2577
  >
2578
- <div
2578
+ <span
2579
2579
  class="pf-c-tree-view__node-toggle"
2580
2580
  tabindex="-1"
2581
2581
  >
@@ -2596,7 +2596,7 @@ exports[`tree view renders icons successfully 1`] = `
2596
2596
  />
2597
2597
  </svg>
2598
2598
  </span>
2599
- </div>
2599
+ </span>
2600
2600
  <span
2601
2601
  class="pf-c-tree-view__node-icon"
2602
2602
  >
@@ -2619,7 +2619,7 @@ exports[`tree view renders icons successfully 1`] = `
2619
2619
  >
2620
2620
  Sources
2621
2621
  </span>
2622
- </div>
2622
+ </span>
2623
2623
  </button>
2624
2624
  </div>
2625
2625
  </li>
@@ -2636,10 +2636,10 @@ exports[`tree view renders icons successfully 1`] = `
2636
2636
  class="pf-c-tree-view__node"
2637
2637
  tabindex="-1"
2638
2638
  >
2639
- <div
2639
+ <span
2640
2640
  class="pf-c-tree-view__node-container"
2641
2641
  >
2642
- <div
2642
+ <span
2643
2643
  class="pf-c-tree-view__node-toggle"
2644
2644
  tabindex="-1"
2645
2645
  >
@@ -2660,7 +2660,7 @@ exports[`tree view renders icons successfully 1`] = `
2660
2660
  />
2661
2661
  </svg>
2662
2662
  </span>
2663
- </div>
2663
+ </span>
2664
2664
  <span
2665
2665
  class="pf-c-tree-view__node-icon"
2666
2666
  >
@@ -2683,7 +2683,7 @@ exports[`tree view renders icons successfully 1`] = `
2683
2683
  >
2684
2684
  Really really really long folder name that overflows the container it is in
2685
2685
  </span>
2686
- </div>
2686
+ </span>
2687
2687
  </button>
2688
2688
  </div>
2689
2689
  </li>
@@ -2711,11 +2711,13 @@ exports[`tree view renders individual flag options successfully 1`] = `
2711
2711
  <div
2712
2712
  class="pf-c-tree-view__content"
2713
2713
  >
2714
- <div
2715
- class="pf-c-tree-view__node"
2714
+ <label
2715
+ class="pf-c-tree-view__node pf-m-selectable"
2716
+ for="checkbox-id36"
2717
+ id="label-checkbox-id36"
2716
2718
  tabindex="0"
2717
2719
  >
2718
- <div
2720
+ <span
2719
2721
  class="pf-c-tree-view__node-container"
2720
2722
  >
2721
2723
  <button
@@ -2767,15 +2769,13 @@ exports[`tree view renders individual flag options successfully 1`] = `
2767
2769
  />
2768
2770
  </svg>
2769
2771
  </span>
2770
- <label
2772
+ <span
2771
2773
  class="pf-c-tree-view__node-text"
2772
- for="checkbox-id36"
2773
- id="label-checkbox-id36"
2774
2774
  >
2775
2775
  ApplicationLauncher
2776
- </label>
2777
- </div>
2778
- </div>
2776
+ </span>
2777
+ </span>
2778
+ </label>
2779
2779
  </div>
2780
2780
  <ul
2781
2781
  class="pf-c-tree-view__list"
@@ -2794,10 +2794,10 @@ exports[`tree view renders individual flag options successfully 1`] = `
2794
2794
  class="pf-c-tree-view__node"
2795
2795
  tabindex="-1"
2796
2796
  >
2797
- <div
2797
+ <span
2798
2798
  class="pf-c-tree-view__node-container"
2799
2799
  >
2800
- <div
2800
+ <span
2801
2801
  class="pf-c-tree-view__node-toggle"
2802
2802
  tabindex="-1"
2803
2803
  >
@@ -2818,13 +2818,13 @@ exports[`tree view renders individual flag options successfully 1`] = `
2818
2818
  />
2819
2819
  </svg>
2820
2820
  </span>
2821
- </div>
2821
+ </span>
2822
2822
  <span
2823
2823
  class="pf-c-tree-view__node-text"
2824
2824
  >
2825
2825
  Application 1
2826
2826
  </span>
2827
- </div>
2827
+ </span>
2828
2828
  </button>
2829
2829
  </div>
2830
2830
  </li>
@@ -2841,10 +2841,10 @@ exports[`tree view renders individual flag options successfully 1`] = `
2841
2841
  class="pf-c-tree-view__node"
2842
2842
  tabindex="-1"
2843
2843
  >
2844
- <div
2844
+ <span
2845
2845
  class="pf-c-tree-view__node-container"
2846
2846
  >
2847
- <div
2847
+ <span
2848
2848
  class="pf-c-tree-view__node-toggle"
2849
2849
  tabindex="-1"
2850
2850
  >
@@ -2865,7 +2865,7 @@ exports[`tree view renders individual flag options successfully 1`] = `
2865
2865
  />
2866
2866
  </svg>
2867
2867
  </span>
2868
- </div>
2868
+ </span>
2869
2869
  <span
2870
2870
  class="pf-c-tree-view__node-text"
2871
2871
  >
@@ -2880,7 +2880,7 @@ exports[`tree view renders individual flag options successfully 1`] = `
2880
2880
  2
2881
2881
  </span>
2882
2882
  </span>
2883
- </div>
2883
+ </span>
2884
2884
  </button>
2885
2885
  </div>
2886
2886
  </li>
@@ -2899,10 +2899,10 @@ exports[`tree view renders individual flag options successfully 1`] = `
2899
2899
  class="pf-c-tree-view__node"
2900
2900
  tabindex="-1"
2901
2901
  >
2902
- <div
2902
+ <span
2903
2903
  class="pf-c-tree-view__node-container"
2904
2904
  >
2905
- <div
2905
+ <span
2906
2906
  class="pf-c-tree-view__node-toggle"
2907
2907
  tabindex="-1"
2908
2908
  >
@@ -2923,7 +2923,7 @@ exports[`tree view renders individual flag options successfully 1`] = `
2923
2923
  />
2924
2924
  </svg>
2925
2925
  </span>
2926
- </div>
2926
+ </span>
2927
2927
  <span
2928
2928
  class="pf-c-tree-view__node-text"
2929
2929
  >
@@ -2938,7 +2938,7 @@ exports[`tree view renders individual flag options successfully 1`] = `
2938
2938
  1
2939
2939
  </span>
2940
2940
  </span>
2941
- </div>
2941
+ </span>
2942
2942
  </button>
2943
2943
  <div
2944
2944
  class="pf-c-tree-view__action"
@@ -2982,10 +2982,10 @@ exports[`tree view renders individual flag options successfully 1`] = `
2982
2982
  class="pf-c-tree-view__node"
2983
2983
  tabindex="-1"
2984
2984
  >
2985
- <div
2985
+ <span
2986
2986
  class="pf-c-tree-view__node-container"
2987
2987
  >
2988
- <div
2988
+ <span
2989
2989
  class="pf-c-tree-view__node-toggle"
2990
2990
  tabindex="-1"
2991
2991
  >
@@ -3006,13 +3006,13 @@ exports[`tree view renders individual flag options successfully 1`] = `
3006
3006
  />
3007
3007
  </svg>
3008
3008
  </span>
3009
- </div>
3009
+ </span>
3010
3010
  <span
3011
3011
  class="pf-c-tree-view__node-text"
3012
3012
  >
3013
3013
  Sources
3014
3014
  </span>
3015
- </div>
3015
+ </span>
3016
3016
  </button>
3017
3017
  </div>
3018
3018
  </li>
@@ -3029,10 +3029,10 @@ exports[`tree view renders individual flag options successfully 1`] = `
3029
3029
  class="pf-c-tree-view__node"
3030
3030
  tabindex="-1"
3031
3031
  >
3032
- <div
3032
+ <span
3033
3033
  class="pf-c-tree-view__node-container"
3034
3034
  >
3035
- <div
3035
+ <span
3036
3036
  class="pf-c-tree-view__node-toggle"
3037
3037
  tabindex="-1"
3038
3038
  >
@@ -3053,13 +3053,13 @@ exports[`tree view renders individual flag options successfully 1`] = `
3053
3053
  />
3054
3054
  </svg>
3055
3055
  </span>
3056
- </div>
3056
+ </span>
3057
3057
  <span
3058
3058
  class="pf-c-tree-view__node-text"
3059
3059
  >
3060
3060
  Really really really long folder name that overflows the container it is in
3061
3061
  </span>
3062
- </div>
3062
+ </span>
3063
3063
  </button>
3064
3064
  </div>
3065
3065
  </li>
@@ -3113,10 +3113,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3113
3113
  class="pf-c-tree-view__node"
3114
3114
  tabindex="0"
3115
3115
  >
3116
- <div
3116
+ <span
3117
3117
  class="pf-c-tree-view__node-container"
3118
3118
  >
3119
- <div
3119
+ <span
3120
3120
  class="pf-c-tree-view__node-toggle"
3121
3121
  tabindex="-1"
3122
3122
  >
@@ -3137,13 +3137,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3137
3137
  />
3138
3138
  </svg>
3139
3139
  </span>
3140
- </div>
3140
+ </span>
3141
3141
  <span
3142
3142
  class="pf-c-tree-view__node-text"
3143
3143
  >
3144
3144
  ApplicationLauncher
3145
3145
  </span>
3146
- </div>
3146
+ </span>
3147
3147
  </button>
3148
3148
  </div>
3149
3149
  <ul
@@ -3163,10 +3163,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3163
3163
  class="pf-c-tree-view__node"
3164
3164
  tabindex="-1"
3165
3165
  >
3166
- <div
3166
+ <span
3167
3167
  class="pf-c-tree-view__node-container"
3168
3168
  >
3169
- <div
3169
+ <span
3170
3170
  class="pf-c-tree-view__node-toggle"
3171
3171
  tabindex="-1"
3172
3172
  >
@@ -3187,13 +3187,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3187
3187
  />
3188
3188
  </svg>
3189
3189
  </span>
3190
- </div>
3190
+ </span>
3191
3191
  <span
3192
3192
  class="pf-c-tree-view__node-text"
3193
3193
  >
3194
3194
  Application 1
3195
3195
  </span>
3196
- </div>
3196
+ </span>
3197
3197
  </button>
3198
3198
  </div>
3199
3199
  </li>
@@ -3210,10 +3210,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3210
3210
  class="pf-c-tree-view__node"
3211
3211
  tabindex="-1"
3212
3212
  >
3213
- <div
3213
+ <span
3214
3214
  class="pf-c-tree-view__node-container"
3215
3215
  >
3216
- <div
3216
+ <span
3217
3217
  class="pf-c-tree-view__node-toggle"
3218
3218
  tabindex="-1"
3219
3219
  >
@@ -3234,13 +3234,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3234
3234
  />
3235
3235
  </svg>
3236
3236
  </span>
3237
- </div>
3237
+ </span>
3238
3238
  <span
3239
3239
  class="pf-c-tree-view__node-text"
3240
3240
  >
3241
3241
  Application 2
3242
3242
  </span>
3243
- </div>
3243
+ </span>
3244
3244
  </button>
3245
3245
  </div>
3246
3246
  </li>
@@ -3259,10 +3259,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3259
3259
  class="pf-c-tree-view__node"
3260
3260
  tabindex="-1"
3261
3261
  >
3262
- <div
3262
+ <span
3263
3263
  class="pf-c-tree-view__node-container"
3264
3264
  >
3265
- <div
3265
+ <span
3266
3266
  class="pf-c-tree-view__node-toggle"
3267
3267
  tabindex="-1"
3268
3268
  >
@@ -3283,13 +3283,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3283
3283
  />
3284
3284
  </svg>
3285
3285
  </span>
3286
- </div>
3286
+ </span>
3287
3287
  <span
3288
3288
  class="pf-c-tree-view__node-text"
3289
3289
  >
3290
3290
  Cost Management
3291
3291
  </span>
3292
- </div>
3292
+ </span>
3293
3293
  </button>
3294
3294
  </div>
3295
3295
  </li>
@@ -3306,10 +3306,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3306
3306
  class="pf-c-tree-view__node"
3307
3307
  tabindex="-1"
3308
3308
  >
3309
- <div
3309
+ <span
3310
3310
  class="pf-c-tree-view__node-container"
3311
3311
  >
3312
- <div
3312
+ <span
3313
3313
  class="pf-c-tree-view__node-toggle"
3314
3314
  tabindex="-1"
3315
3315
  >
@@ -3330,13 +3330,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3330
3330
  />
3331
3331
  </svg>
3332
3332
  </span>
3333
- </div>
3333
+ </span>
3334
3334
  <span
3335
3335
  class="pf-c-tree-view__node-text"
3336
3336
  >
3337
3337
  Sources
3338
3338
  </span>
3339
- </div>
3339
+ </span>
3340
3340
  </button>
3341
3341
  </div>
3342
3342
  </li>
@@ -3353,10 +3353,10 @@ exports[`tree view renders toolbar successfully 1`] = `
3353
3353
  class="pf-c-tree-view__node"
3354
3354
  tabindex="-1"
3355
3355
  >
3356
- <div
3356
+ <span
3357
3357
  class="pf-c-tree-view__node-container"
3358
3358
  >
3359
- <div
3359
+ <span
3360
3360
  class="pf-c-tree-view__node-toggle"
3361
3361
  tabindex="-1"
3362
3362
  >
@@ -3377,13 +3377,13 @@ exports[`tree view renders toolbar successfully 1`] = `
3377
3377
  />
3378
3378
  </svg>
3379
3379
  </span>
3380
- </div>
3380
+ </span>
3381
3381
  <span
3382
3382
  class="pf-c-tree-view__node-text"
3383
3383
  >
3384
3384
  Really really really long folder name that overflows the container it is in
3385
3385
  </span>
3386
- </div>
3386
+ </span>
3387
3387
  </button>
3388
3388
  </div>
3389
3389
  </li>