@patternfly/patternfly 5.0.0-alpha.10 → 5.0.0-alpha.12

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 (54) hide show
  1. package/RELEASE-NOTES.md +17 -0
  2. package/assets/icons/iconUnicodes.json +1 -0
  3. package/assets/pficon/pficon.scss +6 -0
  4. package/assets/pficon/pficon.woff +0 -0
  5. package/assets/pficon/pficon.woff2 +0 -0
  6. package/base/_chart-globals.scss +0 -4
  7. package/base/patternfly-icons.css +5 -1
  8. package/base/patternfly-pf-icons.css +5 -1
  9. package/components/CalendarMonth/calendar-month.css +1 -1
  10. package/components/CalendarMonth/calendar-month.scss +1 -1
  11. package/components/ChipGroup/chip-group.css +1 -3
  12. package/components/ChipGroup/chip-group.scss +1 -4
  13. package/components/Content/content.css +6 -0
  14. package/components/Content/content.scss +8 -0
  15. package/components/Pagination/pagination.css +0 -108
  16. package/components/Pagination/pagination.scss +0 -6
  17. package/components/Popover/popover.css +1 -1
  18. package/components/Popover/themes/dark/popover.scss +1 -1
  19. package/components/Tabs/tabs.css +0 -4
  20. package/components/Tabs/tabs.scss +0 -7
  21. package/components/Tooltip/themes/dark/tooltip.scss +1 -8
  22. package/components/Tooltip/tooltip.css +7 -9
  23. package/components/Tooltip/tooltip.scss +6 -3
  24. package/docs/components/Check/examples/Check.md +2 -6
  25. package/docs/components/ChipGroup/examples/ChipGroup.md +10 -339
  26. package/docs/components/Content/examples/Content.md +28 -0
  27. package/docs/components/DataList/examples/DataList.md +104 -65
  28. package/docs/components/Dropdown/examples/Dropdown.md +73 -49
  29. package/docs/components/LabelGroup/examples/LabelGroup.md +2 -14
  30. package/docs/components/Menu/examples/Menu.md +1 -1
  31. package/docs/components/MenuToggle/examples/MenuToggle.md +4 -4
  32. package/docs/components/Table/examples/Table.md +1117 -700
  33. package/docs/components/Tabs/examples/Tabs.md +102 -102
  34. package/docs/components/Toolbar/examples/Toolbar.md +48 -30
  35. package/docs/demos/Banner/examples/Banner.md +0 -1
  36. package/docs/demos/CardView/examples/CardView.md +8 -5
  37. package/docs/demos/DataList/examples/DataList.md +136 -85
  38. package/docs/demos/DescriptionList/examples/DescriptionList.md +0 -1
  39. package/docs/demos/HelperText/examples/HelperText.md +0 -1
  40. package/docs/demos/Page/examples/Page.md +1 -1
  41. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +0 -1
  42. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +8 -5
  43. package/docs/demos/Table/examples/Table.md +421 -265
  44. package/docs/demos/Tabs/examples/Tabs.md +48 -30
  45. package/docs/demos/Toolbar/examples/Toolbar.md +80 -50
  46. package/docs/demos/Wizard/examples/Wizard.md +179 -171
  47. package/icons/pf-icons.json +1 -0
  48. package/package.json +5 -5
  49. package/patternfly-base-no-reset.css +5 -1
  50. package/patternfly-base.css +5 -1
  51. package/patternfly-no-reset.css +21 -127
  52. package/patternfly.css +21 -127
  53. package/patternfly.min.css +1 -1
  54. package/patternfly.min.css.map +1 -1
@@ -1117,11 +1117,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1117
1117
  class="pf-c-dropdown__toggle-check"
1118
1118
  for="toolbar-selected-filters-toggle-group-collapsed-example-bulk-select-toggle-check"
1119
1119
  >
1120
- <input
1121
- type="checkbox"
1122
- id="toolbar-selected-filters-toggle-group-collapsed-example-bulk-select-toggle-check"
1123
- aria-label="Select all"
1124
- />
1120
+ <div class="pf-c-check pf-m-standalone">
1121
+ <input
1122
+ class="pf-c-check__input"
1123
+ type="checkbox"
1124
+ id="toolbar-selected-filters-toggle-group-collapsed-example-bulk-select-toggle-check"
1125
+ aria-label="Select all"
1126
+ />
1127
+ </div>
1125
1128
  </label>
1126
1129
 
1127
1130
  <button
@@ -1657,11 +1660,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
1657
1660
  class="pf-c-dropdown__toggle-check"
1658
1661
  for="toolbar-selected-filters-toggle-group-expanded-example-bulk-select-toggle-check"
1659
1662
  >
1660
- <input
1661
- type="checkbox"
1662
- id="toolbar-selected-filters-toggle-group-expanded-example-bulk-select-toggle-check"
1663
- aria-label="Select all"
1664
- />
1663
+ <div class="pf-c-check pf-m-standalone">
1664
+ <input
1665
+ class="pf-c-check__input"
1666
+ type="checkbox"
1667
+ id="toolbar-selected-filters-toggle-group-expanded-example-bulk-select-toggle-check"
1668
+ aria-label="Select all"
1669
+ />
1670
+ </div>
1665
1671
  </label>
1666
1672
 
1667
1673
  <button
@@ -2192,11 +2198,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
2192
2198
  class="pf-c-dropdown__toggle-check"
2193
2199
  for="toolbar-selected-filters-example-bulk-select-toggle-check"
2194
2200
  >
2195
- <input
2196
- type="checkbox"
2197
- id="toolbar-selected-filters-example-bulk-select-toggle-check"
2198
- aria-label="Select all"
2199
- />
2201
+ <div class="pf-c-check pf-m-standalone">
2202
+ <input
2203
+ class="pf-c-check__input"
2204
+ type="checkbox"
2205
+ id="toolbar-selected-filters-example-bulk-select-toggle-check"
2206
+ aria-label="Select all"
2207
+ />
2208
+ </div>
2200
2209
  </label>
2201
2210
 
2202
2211
  <button
@@ -3104,11 +3113,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
3104
3113
  class="pf-c-dropdown__toggle-check"
3105
3114
  for="toolbar-stacked-example-bulk-select-toggle-check"
3106
3115
  >
3107
- <input
3108
- type="checkbox"
3109
- id="toolbar-stacked-example-bulk-select-toggle-check"
3110
- aria-label="Select all"
3111
- />
3116
+ <div class="pf-c-check pf-m-standalone">
3117
+ <input
3118
+ class="pf-c-check__input"
3119
+ type="checkbox"
3120
+ id="toolbar-stacked-example-bulk-select-toggle-check"
3121
+ aria-label="Select all"
3122
+ />
3123
+ </div>
3112
3124
  </label>
3113
3125
 
3114
3126
  <button
@@ -3617,11 +3629,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
3617
3629
  class="pf-c-dropdown__toggle-check"
3618
3630
  for="toolbar-stacked-collapsed-example-bulk-select-toggle-check"
3619
3631
  >
3620
- <input
3621
- type="checkbox"
3622
- id="toolbar-stacked-collapsed-example-bulk-select-toggle-check"
3623
- aria-label="Select all"
3624
- />
3632
+ <div class="pf-c-check pf-m-standalone">
3633
+ <input
3634
+ class="pf-c-check__input"
3635
+ type="checkbox"
3636
+ id="toolbar-stacked-collapsed-example-bulk-select-toggle-check"
3637
+ aria-label="Select all"
3638
+ />
3639
+ </div>
3625
3640
  </label>
3626
3641
 
3627
3642
  <button
@@ -3765,11 +3780,14 @@ The `.pf-m-toggle-group` controls when, and at which breakpoint, filters will be
3765
3780
  class="pf-c-dropdown__toggle-check"
3766
3781
  for="toolbar-expanded-elements-example-bulk-select-toggle-check"
3767
3782
  >
3768
- <input
3769
- type="checkbox"
3770
- id="toolbar-expanded-elements-example-bulk-select-toggle-check"
3771
- aria-label="Select all"
3772
- />
3783
+ <div class="pf-c-check pf-m-standalone">
3784
+ <input
3785
+ class="pf-c-check__input"
3786
+ type="checkbox"
3787
+ id="toolbar-expanded-elements-example-bulk-select-toggle-check"
3788
+ aria-label="Select all"
3789
+ />
3790
+ </div>
3773
3791
  </label>
3774
3792
 
3775
3793
  <button
@@ -1,7 +1,6 @@
1
1
  ---
2
2
  id: 'Banner'
3
3
  section: components
4
- beta: true
5
4
  cssPrefix: pf-c-banner
6
5
  wrapperTag: div
7
6
  ---## Examples
@@ -983,11 +983,14 @@ section: demos
983
983
  class="pf-c-dropdown__toggle-check"
984
984
  for="card-view-basic-example-toolbar-bulk-select-toggle-check"
985
985
  >
986
- <input
987
- type="checkbox"
988
- id="card-view-basic-example-toolbar-bulk-select-toggle-check"
989
- aria-label="Select all"
990
- />
986
+ <div class="pf-c-check pf-m-standalone">
987
+ <input
988
+ class="pf-c-check__input"
989
+ type="checkbox"
990
+ id="card-view-basic-example-toolbar-bulk-select-toggle-check"
991
+ aria-label="Select all"
992
+ />
993
+ </div>
991
994
  </label>
992
995
 
993
996
  <button
@@ -888,11 +888,14 @@ wrapperTag: div
888
888
  class="pf-c-dropdown__toggle-check"
889
889
  for="-bulk-select-toggle-check"
890
890
  >
891
- <input
892
- type="checkbox"
893
- id="-bulk-select-toggle-check"
894
- aria-label="Select all"
895
- />
891
+ <div class="pf-c-check pf-m-standalone">
892
+ <input
893
+ class="pf-c-check__input"
894
+ type="checkbox"
895
+ id="-bulk-select-toggle-check"
896
+ aria-label="Select all"
897
+ />
898
+ </div>
896
899
  </label>
897
900
 
898
901
  <button
@@ -2417,11 +2420,14 @@ wrapperTag: div
2417
2420
  class="pf-c-dropdown__toggle-check"
2418
2421
  for="-bulk-select-toggle-check"
2419
2422
  >
2420
- <input
2421
- type="checkbox"
2422
- id="-bulk-select-toggle-check"
2423
- aria-label="Select all"
2424
- />
2423
+ <div class="pf-c-check pf-m-standalone">
2424
+ <input
2425
+ class="pf-c-check__input"
2426
+ type="checkbox"
2427
+ id="-bulk-select-toggle-check"
2428
+ aria-label="Select all"
2429
+ />
2430
+ </div>
2425
2431
  </label>
2426
2432
 
2427
2433
  <button
@@ -2651,11 +2657,14 @@ wrapperTag: div
2651
2657
  <div class="pf-c-data-list__item-row">
2652
2658
  <div class="pf-c-data-list__item-control">
2653
2659
  <div class="pf-c-data-list__check">
2654
- <input
2655
- type="checkbox"
2656
- name="check-action-check1"
2657
- aria-labelledby="data-list-actionable-example-data-list-item-1"
2658
- />
2660
+ <div class="pf-c-check pf-m-standalone">
2661
+ <input
2662
+ class="pf-c-check__input"
2663
+ type="checkbox"
2664
+ name="check-action-check1"
2665
+ aria-labelledby="data-list-actionable-example-data-list-item-1"
2666
+ />
2667
+ </div>
2659
2668
  </div>
2660
2669
  </div>
2661
2670
  <div class="pf-c-data-list__item-content">
@@ -2721,11 +2730,14 @@ wrapperTag: div
2721
2730
  <div class="pf-c-data-list__item-row">
2722
2731
  <div class="pf-c-data-list__item-control">
2723
2732
  <div class="pf-c-data-list__check">
2724
- <input
2725
- type="checkbox"
2726
- name="check-action-check2"
2727
- aria-labelledby="data-list-actionable-example-data-list-item-2"
2728
- />
2733
+ <div class="pf-c-check pf-m-standalone">
2734
+ <input
2735
+ class="pf-c-check__input"
2736
+ type="checkbox"
2737
+ name="check-action-check2"
2738
+ aria-labelledby="data-list-actionable-example-data-list-item-2"
2739
+ />
2740
+ </div>
2729
2741
  </div>
2730
2742
  </div>
2731
2743
  <div class="pf-c-data-list__item-content">
@@ -2815,11 +2827,14 @@ wrapperTag: div
2815
2827
  <div class="pf-c-data-list__item-row">
2816
2828
  <div class="pf-c-data-list__item-control">
2817
2829
  <div class="pf-c-data-list__check">
2818
- <input
2819
- type="checkbox"
2820
- name="check-action-check3"
2821
- aria-labelledby="data-list-actionable-example-data-list-item-3"
2822
- />
2830
+ <div class="pf-c-check pf-m-standalone">
2831
+ <input
2832
+ class="pf-c-check__input"
2833
+ type="checkbox"
2834
+ name="check-action-check3"
2835
+ aria-labelledby="data-list-actionable-example-data-list-item-3"
2836
+ />
2837
+ </div>
2823
2838
  </div>
2824
2839
  </div>
2825
2840
  <div class="pf-c-data-list__item-content">
@@ -2846,11 +2861,14 @@ wrapperTag: div
2846
2861
  <div class="pf-c-data-list__item-row">
2847
2862
  <div class="pf-c-data-list__item-control">
2848
2863
  <div class="pf-c-data-list__check">
2849
- <input
2850
- type="checkbox"
2851
- name="check-action-check4"
2852
- aria-labelledby="data-list-actionable-example-data-list-item-4"
2853
- />
2864
+ <div class="pf-c-check pf-m-standalone">
2865
+ <input
2866
+ class="pf-c-check__input"
2867
+ type="checkbox"
2868
+ name="check-action-check4"
2869
+ aria-labelledby="data-list-actionable-example-data-list-item-4"
2870
+ />
2871
+ </div>
2854
2872
  </div>
2855
2873
  </div>
2856
2874
  <div class="pf-c-data-list__item-content">
@@ -3922,11 +3940,14 @@ wrapperTag: div
3922
3940
  class="pf-c-dropdown__toggle-check"
3923
3941
  for="-bulk-select-toggle-check"
3924
3942
  >
3925
- <input
3926
- type="checkbox"
3927
- id="-bulk-select-toggle-check"
3928
- aria-label="Select all"
3929
- />
3943
+ <div class="pf-c-check pf-m-standalone">
3944
+ <input
3945
+ class="pf-c-check__input"
3946
+ type="checkbox"
3947
+ id="-bulk-select-toggle-check"
3948
+ aria-label="Select all"
3949
+ />
3950
+ </div>
3930
3951
  </label>
3931
3952
 
3932
3953
  <button
@@ -4203,11 +4224,14 @@ wrapperTag: div
4203
4224
  </div>
4204
4225
 
4205
4226
  <div class="pf-c-data-list__check">
4206
- <input
4207
- type="checkbox"
4208
- name="check-expandable-check1"
4209
- aria-labelledby="data-list-expandable-example-data-list-item-1"
4210
- />
4227
+ <div class="pf-c-check pf-m-standalone">
4228
+ <input
4229
+ class="pf-c-check__input"
4230
+ type="checkbox"
4231
+ name="check-expandable-check1"
4232
+ aria-labelledby="data-list-expandable-example-data-list-item-1"
4233
+ />
4234
+ </div>
4211
4235
  </div>
4212
4236
  </div>
4213
4237
  <div class="pf-c-data-list__item-content">
@@ -4281,11 +4305,14 @@ wrapperTag: div
4281
4305
  <thead>
4282
4306
  <tr role="row">
4283
4307
  <td class="pf-c-table__check" role="cell">
4284
- <input
4285
- type="checkbox"
4286
- name="check-all"
4287
- aria-label="Select all rows"
4288
- />
4308
+ <div class="pf-c-check pf-m-standalone">
4309
+ <input
4310
+ class="pf-c-check__input"
4311
+ type="checkbox"
4312
+ name="check-all"
4313
+ aria-label="Select all rows"
4314
+ />
4315
+ </div>
4289
4316
  </td>
4290
4317
  <th role="columnheader" scope="col">Contributor</th>
4291
4318
  <th role="columnheader" scope="col">Position</th>
@@ -4304,11 +4331,14 @@ wrapperTag: div
4304
4331
  <tbody role="rowgroup">
4305
4332
  <tr role="row">
4306
4333
  <td class="pf-c-table__check" role="cell">
4307
- <input
4308
- type="checkbox"
4309
- name="checkrow1"
4310
- aria-labelledby="compact-table-demo-data-list-name1"
4311
- />
4334
+ <div class="pf-c-check pf-m-standalone">
4335
+ <input
4336
+ class="pf-c-check__input"
4337
+ type="checkbox"
4338
+ name="checkrow1"
4339
+ aria-labelledby="compact-table-demo-data-list-name1"
4340
+ />
4341
+ </div>
4312
4342
  </td>
4313
4343
  <td role="cell" data-label="Contributor">
4314
4344
  <span id="compact-table-demo-data-list-name1">Sam Jones</span>
@@ -4380,11 +4410,14 @@ wrapperTag: div
4380
4410
  </tr>
4381
4411
  <tr role="row">
4382
4412
  <td class="pf-c-table__check" role="cell">
4383
- <input
4384
- type="checkbox"
4385
- name="checkrow2"
4386
- aria-labelledby="compact-table-demo-data-list-name2"
4387
- />
4413
+ <div class="pf-c-check pf-m-standalone">
4414
+ <input
4415
+ class="pf-c-check__input"
4416
+ type="checkbox"
4417
+ name="checkrow2"
4418
+ aria-labelledby="compact-table-demo-data-list-name2"
4419
+ />
4420
+ </div>
4388
4421
  </td>
4389
4422
  <th role="columnheader" data-label="Contributor">
4390
4423
  <span id="compact-table-demo-data-list-name2">Amy Miller</span>
@@ -4456,11 +4489,14 @@ wrapperTag: div
4456
4489
  </tr>
4457
4490
  <tr role="row">
4458
4491
  <td class="pf-c-table__check" role="cell">
4459
- <input
4460
- type="checkbox"
4461
- name="checkrow3"
4462
- aria-labelledby="compact-table-demo-data-list-name3"
4463
- />
4492
+ <div class="pf-c-check pf-m-standalone">
4493
+ <input
4494
+ class="pf-c-check__input"
4495
+ type="checkbox"
4496
+ name="checkrow3"
4497
+ aria-labelledby="compact-table-demo-data-list-name3"
4498
+ />
4499
+ </div>
4464
4500
  </td>
4465
4501
  <th role="columnheader" data-label="Contributor">
4466
4502
  <span
@@ -4538,11 +4574,14 @@ wrapperTag: div
4538
4574
  </tr>
4539
4575
  <tr role="row">
4540
4576
  <td class="pf-c-table__check" role="cell">
4541
- <input
4542
- type="checkbox"
4543
- name="checkrow4"
4544
- aria-labelledby="compact-table-demo-data-list-name4"
4545
- />
4577
+ <div class="pf-c-check pf-m-standalone">
4578
+ <input
4579
+ class="pf-c-check__input"
4580
+ type="checkbox"
4581
+ name="checkrow4"
4582
+ aria-labelledby="compact-table-demo-data-list-name4"
4583
+ />
4584
+ </div>
4546
4585
  </td>
4547
4586
  <td role="cell" data-label="Contributor name">
4548
4587
  <span
@@ -4647,11 +4686,14 @@ wrapperTag: div
4647
4686
  </div>
4648
4687
 
4649
4688
  <div class="pf-c-data-list__check">
4650
- <input
4651
- type="checkbox"
4652
- name="check-expandable-check2"
4653
- aria-labelledby="data-list-expandable-example-data-list-item-2"
4654
- />
4689
+ <div class="pf-c-check pf-m-standalone">
4690
+ <input
4691
+ class="pf-c-check__input"
4692
+ type="checkbox"
4693
+ name="check-expandable-check2"
4694
+ aria-labelledby="data-list-expandable-example-data-list-item-2"
4695
+ />
4696
+ </div>
4655
4697
  </div>
4656
4698
  </div>
4657
4699
  <div class="pf-c-data-list__item-content">
@@ -4767,11 +4809,14 @@ wrapperTag: div
4767
4809
  </div>
4768
4810
 
4769
4811
  <div class="pf-c-data-list__check">
4770
- <input
4771
- type="checkbox"
4772
- name="check-expandable-check3"
4773
- aria-labelledby="data-list-expandable-example-data-list-item-3"
4774
- />
4812
+ <div class="pf-c-check pf-m-standalone">
4813
+ <input
4814
+ class="pf-c-check__input"
4815
+ type="checkbox"
4816
+ name="check-expandable-check3"
4817
+ aria-labelledby="data-list-expandable-example-data-list-item-3"
4818
+ />
4819
+ </div>
4775
4820
  </div>
4776
4821
  </div>
4777
4822
  <div class="pf-c-data-list__item-content">
@@ -4817,11 +4862,14 @@ wrapperTag: div
4817
4862
  </div>
4818
4863
 
4819
4864
  <div class="pf-c-data-list__check">
4820
- <input
4821
- type="checkbox"
4822
- name="check-expandable-check4"
4823
- aria-labelledby="data-list-expandable-example-data-list-item-4"
4824
- />
4865
+ <div class="pf-c-check pf-m-standalone">
4866
+ <input
4867
+ class="pf-c-check__input"
4868
+ type="checkbox"
4869
+ name="check-expandable-check4"
4870
+ aria-labelledby="data-list-expandable-example-data-list-item-4"
4871
+ />
4872
+ </div>
4825
4873
  </div>
4826
4874
  </div>
4827
4875
  <div class="pf-c-data-list__item-content">
@@ -4913,11 +4961,14 @@ wrapperTag: div
4913
4961
  </div>
4914
4962
 
4915
4963
  <div class="pf-c-data-list__check">
4916
- <input
4917
- type="checkbox"
4918
- name="check-expandable-check5"
4919
- aria-labelledby="data-list-expandable-example-data-list-item-5"
4920
- />
4964
+ <div class="pf-c-check pf-m-standalone">
4965
+ <input
4966
+ class="pf-c-check__input"
4967
+ type="checkbox"
4968
+ name="check-expandable-check5"
4969
+ aria-labelledby="data-list-expandable-example-data-list-item-5"
4970
+ />
4971
+ </div>
4921
4972
  </div>
4922
4973
  </div>
4923
4974
  <div class="pf-c-data-list__item-content">
@@ -1,6 +1,5 @@
1
1
  ---
2
2
  id: 'Description list'
3
- beta: true
4
3
  section: components
5
4
  cssPrefix: pf-d-description-list
6
5
  ---## Examples
@@ -1,6 +1,5 @@
1
1
  ---
2
2
  id: 'Helper text'
3
- beta: true
4
3
  section: components
5
4
  ---## Examples
6
5
 
@@ -3941,7 +3941,7 @@ Using the `.pf-m-full-height` modifier class on the page component eliminates th
3941
3941
 
3942
3942
  ### Sticky breadcrumb on medium
3943
3943
 
3944
- ```html isFullscreen isBeta
3944
+ ```html isFullscreen
3945
3945
  <div class="pf-c-page" id="page-demo-sticky-top-breadcrumb">
3946
3946
  <div class="pf-c-skip-to-content">
3947
3947
  <a
@@ -1,6 +1,5 @@
1
1
  ---
2
2
  id: 'Password strength'
3
- beta: true
4
3
  section: demos
5
4
  ---## Examples
6
5
 
@@ -6304,11 +6304,14 @@ wrapperTag: div
6304
6304
  class="pf-c-dropdown__toggle-check"
6305
6305
  for="primary-detail-card-view-expanded-example-drawer-toolbar-bulk-select-toggle-check"
6306
6306
  >
6307
- <input
6308
- type="checkbox"
6309
- id="primary-detail-card-view-expanded-example-drawer-toolbar-bulk-select-toggle-check"
6310
- aria-label="Select all"
6311
- />
6307
+ <div class="pf-c-check pf-m-standalone">
6308
+ <input
6309
+ class="pf-c-check__input"
6310
+ type="checkbox"
6311
+ id="primary-detail-card-view-expanded-example-drawer-toolbar-bulk-select-toggle-check"
6312
+ aria-label="Select all"
6313
+ />
6314
+ </div>
6312
6315
  </label>
6313
6316
 
6314
6317
  <button