@patternfly/patternfly 5.0.0-alpha.49 → 5.0.0-alpha.50

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 (72) hide show
  1. package/base/patternfly-variables.css +1 -1
  2. package/components/Breadcrumb/breadcrumb.css +1 -5
  3. package/components/Breadcrumb/breadcrumb.scss +1 -8
  4. package/components/Divider/divider.css +12 -12
  5. package/components/List/list.css +1 -1
  6. package/components/List/list.scss +1 -1
  7. package/components/LogViewer/log-viewer.css +0 -3
  8. package/components/LogViewer/log-viewer.scss +0 -4
  9. package/components/Masthead/masthead.css +12 -12
  10. package/components/MultipleFileUpload/multiple-file-upload.css +3 -3
  11. package/components/MultipleFileUpload/multiple-file-upload.scss +3 -3
  12. package/components/Pagination/pagination.css +12 -12
  13. package/components/Tabs/tabs.css +24 -24
  14. package/components/TextInputGroup/text-input-group.css +1 -5
  15. package/components/TextInputGroup/text-input-group.scss +1 -7
  16. package/components/Toolbar/toolbar.css +54 -54
  17. package/components/_all.scss +1 -2
  18. package/docs/components/AppLauncher/examples/application-launcher.md +8 -7
  19. package/docs/components/Chip/examples/Chip.md +713 -4
  20. package/docs/components/ContextSelector/examples/context-selector.md +12 -12
  21. package/docs/components/DualListSelector/examples/DualListSelector.md +32 -32
  22. package/docs/components/LogViewer/examples/LogViewer.md +40 -40
  23. package/docs/components/Menu/examples/Menu.md +20 -18
  24. package/docs/components/Select/examples/Select.md +16 -14
  25. package/docs/components/TextInputGroup/examples/TextInputGroup.css +0 -13
  26. package/docs/components/TextInputGroup/examples/TextInputGroup.md +21 -21
  27. package/docs/components/Toolbar/examples/Toolbar.md +10 -10
  28. package/docs/components/TreeView/examples/TreeView.md +8 -7
  29. package/docs/demos/AboutModal/examples/AboutModal.md +21 -21
  30. package/docs/demos/Alert/examples/Alert.md +63 -63
  31. package/docs/demos/BackToTop/examples/BackToTop.md +21 -21
  32. package/docs/demos/Banner/examples/Banner.md +42 -42
  33. package/docs/demos/CardView/examples/CardView.md +21 -21
  34. package/docs/demos/ContextSelector/examples/ContextSelector.md +95 -91
  35. package/docs/demos/Dashboard/examples/Dashboard.md +21 -21
  36. package/docs/demos/DataList/examples/DataList.md +104 -105
  37. package/docs/demos/DescriptionList/examples/DescriptionList.md +63 -63
  38. package/docs/demos/Drawer/examples/Drawer.md +105 -105
  39. package/docs/demos/JumpLinks/examples/JumpLinks.md +126 -126
  40. package/docs/demos/Masthead/examples/Masthead.md +56 -55
  41. package/docs/demos/Modal/examples/Modal.md +126 -126
  42. package/docs/demos/Nav/examples/Nav.md +168 -168
  43. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +105 -105
  44. package/docs/demos/Page/examples/Page.md +189 -189
  45. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +153 -153
  46. package/docs/demos/Skeleton/examples/Skeleton.md +21 -21
  47. package/docs/demos/Table/examples/Table.md +339 -339
  48. package/docs/demos/Tabs/examples/Tabs.md +126 -126
  49. package/docs/demos/Toolbar/examples/Toolbar.md +50 -50
  50. package/docs/demos/Wizard/examples/Wizard.md +189 -189
  51. package/docs/layouts/Flex/examples/Flex.md +319 -215
  52. package/layouts/Flex/flex.css +738 -31
  53. package/layouts/Flex/flex.scss +101 -17
  54. package/package.json +1 -1
  55. package/patternfly-base-no-globals.css +1 -1
  56. package/patternfly-base.css +1 -1
  57. package/patternfly-no-globals.css +859 -389
  58. package/patternfly.css +859 -389
  59. package/patternfly.min.css +1 -1
  60. package/patternfly.min.css.map +1 -1
  61. package/sass-utilities/component-namespaces.scss +0 -3
  62. package/sass-utilities/functions.scss +9 -5
  63. package/sass-utilities/themes/dark/scss-variables.scss +1 -4
  64. package/components/Breadcrumb/themes/dark/breadcrumb.scss +0 -7
  65. package/components/SearchInput/search-input.css +0 -199
  66. package/components/SearchInput/search-input.scss +0 -231
  67. package/components/SearchInput/themes/dark/search-input.scss +0 -16
  68. package/docs/components/ChipGroup/examples/ChipGroup.md +0 -716
  69. package/docs/components/SearchInput/examples/SearchInput.css +0 -12
  70. package/docs/components/SearchInput/examples/SearchInput.md +0 -681
  71. /package/components/{ChipGroup → Chip}/chip-group.css +0 -0
  72. /package/components/{ChipGroup → Chip}/chip-group.scss +0 -0
package/docs/demos/Wizard/examples/Wizard.md CHANGED
@@ -75,20 +75,18 @@ wrapperTag: div
75
75
  hidden
76
76
  >
77
77
  <div class="pf-v5-c-app-launcher__menu-search">
78
- <div class="pf-v5-c-search-input">
79
- <div class="pf-v5-c-search-input__bar">
80
- <span class="pf-v5-c-search-input__text">
81
- <span class="pf-v5-c-search-input__icon">
82
- <i
83
- class="fas fa-search fa-fw"
84
- aria-hidden="true"
85
- ></i>
78
+ <div class="pf-v5-c-text-input-group">
79
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
80
+ <span class="pf-v5-c-text-input-group__text">
81
+ <span class="pf-v5-c-text-input-group__icon">
82
+ <i class="fas fa-fw fa-search"></i>
86
83
  </span>
87
84
  <input
88
- class="pf-v5-c-search-input__text-input"
85
+ class="pf-v5-c-text-input-group__text-input"
89
86
  type="text"
90
- placeholder="Filter by name"
91
- aria-label="Filter by name"
87
+ placeholder="Filer by name"
88
+ value
89
+ aria-label="Search input"
92
90
  />
93
91
  </span>
94
92
  </div>
@@ -606,22 +604,24 @@ wrapperTag: div
606
604
  </div>
607
605
  <div class="pf-v5-c-menu__search">
608
606
  <div class="pf-v5-c-menu__search-input">
609
- <div class="pf-v5-c-search-input">
610
- <div class="pf-v5-c-search-input__bar">
611
- <span class="pf-v5-c-search-input__text">
607
+ <div class="pf-v5-c-text-input-group">
608
+ <div
609
+ class="pf-v5-c-text-input-group__main pf-m-icon"
610
+ >
611
+ <span
612
+ class="pf-v5-c-text-input-group__text"
613
+ >
612
614
  <span
613
- class="pf-v5-c-search-input__icon"
615
+ class="pf-v5-c-text-input-group__icon"
614
616
  >
615
- <i
616
- class="fas fa-search fa-fw"
617
- aria-hidden="true"
618
- ></i>
617
+ <i class="fas fa-fw fa-search"></i>
619
618
  </span>
620
619
  <input
621
- class="pf-v5-c-search-input__text-input"
620
+ class="pf-v5-c-text-input-group__text-input"
622
621
  type="text"
623
622
  placeholder="Search"
624
- aria-label="Search"
623
+ value
624
+ aria-label="Search input"
625
625
  />
626
626
  </span>
627
627
  </div>
@@ -1290,20 +1290,18 @@ wrapperTag: div
1290
1290
  hidden
1291
1291
  >
1292
1292
  <div class="pf-v5-c-app-launcher__menu-search">
1293
- <div class="pf-v5-c-search-input">
1294
- <div class="pf-v5-c-search-input__bar">
1295
- <span class="pf-v5-c-search-input__text">
1296
- <span class="pf-v5-c-search-input__icon">
1297
- <i
1298
- class="fas fa-search fa-fw"
1299
- aria-hidden="true"
1300
- ></i>
1293
+ <div class="pf-v5-c-text-input-group">
1294
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
1295
+ <span class="pf-v5-c-text-input-group__text">
1296
+ <span class="pf-v5-c-text-input-group__icon">
1297
+ <i class="fas fa-fw fa-search"></i>
1301
1298
  </span>
1302
1299
  <input
1303
- class="pf-v5-c-search-input__text-input"
1300
+ class="pf-v5-c-text-input-group__text-input"
1304
1301
  type="text"
1305
- placeholder="Filter by name"
1306
- aria-label="Filter by name"
1302
+ placeholder="Filer by name"
1303
+ value
1304
+ aria-label="Search input"
1307
1305
  />
1308
1306
  </span>
1309
1307
  </div>
@@ -1821,22 +1819,24 @@ wrapperTag: div
1821
1819
  </div>
1822
1820
  <div class="pf-v5-c-menu__search">
1823
1821
  <div class="pf-v5-c-menu__search-input">
1824
- <div class="pf-v5-c-search-input">
1825
- <div class="pf-v5-c-search-input__bar">
1826
- <span class="pf-v5-c-search-input__text">
1822
+ <div class="pf-v5-c-text-input-group">
1823
+ <div
1824
+ class="pf-v5-c-text-input-group__main pf-m-icon"
1825
+ >
1826
+ <span
1827
+ class="pf-v5-c-text-input-group__text"
1828
+ >
1827
1829
  <span
1828
- class="pf-v5-c-search-input__icon"
1830
+ class="pf-v5-c-text-input-group__icon"
1829
1831
  >
1830
- <i
1831
- class="fas fa-search fa-fw"
1832
- aria-hidden="true"
1833
- ></i>
1832
+ <i class="fas fa-fw fa-search"></i>
1834
1833
  </span>
1835
1834
  <input
1836
- class="pf-v5-c-search-input__text-input"
1835
+ class="pf-v5-c-text-input-group__text-input"
1837
1836
  type="text"
1838
1837
  placeholder="Search"
1839
- aria-label="Search"
1838
+ value
1839
+ aria-label="Search input"
1840
1840
  />
1841
1841
  </span>
1842
1842
  </div>
@@ -2487,20 +2487,18 @@ wrapperTag: div
2487
2487
  hidden
2488
2488
  >
2489
2489
  <div class="pf-v5-c-app-launcher__menu-search">
2490
- <div class="pf-v5-c-search-input">
2491
- <div class="pf-v5-c-search-input__bar">
2492
- <span class="pf-v5-c-search-input__text">
2493
- <span class="pf-v5-c-search-input__icon">
2494
- <i
2495
- class="fas fa-search fa-fw"
2496
- aria-hidden="true"
2497
- ></i>
2490
+ <div class="pf-v5-c-text-input-group">
2491
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
2492
+ <span class="pf-v5-c-text-input-group__text">
2493
+ <span class="pf-v5-c-text-input-group__icon">
2494
+ <i class="fas fa-fw fa-search"></i>
2498
2495
  </span>
2499
2496
  <input
2500
- class="pf-v5-c-search-input__text-input"
2497
+ class="pf-v5-c-text-input-group__text-input"
2501
2498
  type="text"
2502
- placeholder="Filter by name"
2503
- aria-label="Filter by name"
2499
+ placeholder="Filer by name"
2500
+ value
2501
+ aria-label="Search input"
2504
2502
  />
2505
2503
  </span>
2506
2504
  </div>
@@ -3018,22 +3016,24 @@ wrapperTag: div
3018
3016
  </div>
3019
3017
  <div class="pf-v5-c-menu__search">
3020
3018
  <div class="pf-v5-c-menu__search-input">
3021
- <div class="pf-v5-c-search-input">
3022
- <div class="pf-v5-c-search-input__bar">
3023
- <span class="pf-v5-c-search-input__text">
3019
+ <div class="pf-v5-c-text-input-group">
3020
+ <div
3021
+ class="pf-v5-c-text-input-group__main pf-m-icon"
3022
+ >
3023
+ <span
3024
+ class="pf-v5-c-text-input-group__text"
3025
+ >
3024
3026
  <span
3025
- class="pf-v5-c-search-input__icon"
3027
+ class="pf-v5-c-text-input-group__icon"
3026
3028
  >
3027
- <i
3028
- class="fas fa-search fa-fw"
3029
- aria-hidden="true"
3030
- ></i>
3029
+ <i class="fas fa-fw fa-search"></i>
3031
3030
  </span>
3032
3031
  <input
3033
- class="pf-v5-c-search-input__text-input"
3032
+ class="pf-v5-c-text-input-group__text-input"
3034
3033
  type="text"
3035
3034
  placeholder="Search"
3036
- aria-label="Search"
3035
+ value
3036
+ aria-label="Search input"
3037
3037
  />
3038
3038
  </span>
3039
3039
  </div>
@@ -3765,20 +3765,18 @@ wrapperTag: div
3765
3765
  hidden
3766
3766
  >
3767
3767
  <div class="pf-v5-c-app-launcher__menu-search">
3768
- <div class="pf-v5-c-search-input">
3769
- <div class="pf-v5-c-search-input__bar">
3770
- <span class="pf-v5-c-search-input__text">
3771
- <span class="pf-v5-c-search-input__icon">
3772
- <i
3773
- class="fas fa-search fa-fw"
3774
- aria-hidden="true"
3775
- ></i>
3768
+ <div class="pf-v5-c-text-input-group">
3769
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
3770
+ <span class="pf-v5-c-text-input-group__text">
3771
+ <span class="pf-v5-c-text-input-group__icon">
3772
+ <i class="fas fa-fw fa-search"></i>
3776
3773
  </span>
3777
3774
  <input
3778
- class="pf-v5-c-search-input__text-input"
3775
+ class="pf-v5-c-text-input-group__text-input"
3779
3776
  type="text"
3780
- placeholder="Filter by name"
3781
- aria-label="Filter by name"
3777
+ placeholder="Filer by name"
3778
+ value
3779
+ aria-label="Search input"
3782
3780
  />
3783
3781
  </span>
3784
3782
  </div>
@@ -4296,22 +4294,24 @@ wrapperTag: div
4296
4294
  </div>
4297
4295
  <div class="pf-v5-c-menu__search">
4298
4296
  <div class="pf-v5-c-menu__search-input">
4299
- <div class="pf-v5-c-search-input">
4300
- <div class="pf-v5-c-search-input__bar">
4301
- <span class="pf-v5-c-search-input__text">
4297
+ <div class="pf-v5-c-text-input-group">
4298
+ <div
4299
+ class="pf-v5-c-text-input-group__main pf-m-icon"
4300
+ >
4301
+ <span
4302
+ class="pf-v5-c-text-input-group__text"
4303
+ >
4302
4304
  <span
4303
- class="pf-v5-c-search-input__icon"
4305
+ class="pf-v5-c-text-input-group__icon"
4304
4306
  >
4305
- <i
4306
- class="fas fa-search fa-fw"
4307
- aria-hidden="true"
4308
- ></i>
4307
+ <i class="fas fa-fw fa-search"></i>
4309
4308
  </span>
4310
4309
  <input
4311
- class="pf-v5-c-search-input__text-input"
4310
+ class="pf-v5-c-text-input-group__text-input"
4312
4311
  type="text"
4313
4312
  placeholder="Search"
4314
- aria-label="Search"
4313
+ value
4314
+ aria-label="Search input"
4315
4315
  />
4316
4316
  </span>
4317
4317
  </div>
@@ -5042,20 +5042,18 @@ wrapperTag: div
5042
5042
  hidden
5043
5043
  >
5044
5044
  <div class="pf-v5-c-app-launcher__menu-search">
5045
- <div class="pf-v5-c-search-input">
5046
- <div class="pf-v5-c-search-input__bar">
5047
- <span class="pf-v5-c-search-input__text">
5048
- <span class="pf-v5-c-search-input__icon">
5049
- <i
5050
- class="fas fa-search fa-fw"
5051
- aria-hidden="true"
5052
- ></i>
5045
+ <div class="pf-v5-c-text-input-group">
5046
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
5047
+ <span class="pf-v5-c-text-input-group__text">
5048
+ <span class="pf-v5-c-text-input-group__icon">
5049
+ <i class="fas fa-fw fa-search"></i>
5053
5050
  </span>
5054
5051
  <input
5055
- class="pf-v5-c-search-input__text-input"
5052
+ class="pf-v5-c-text-input-group__text-input"
5056
5053
  type="text"
5057
- placeholder="Filter by name"
5058
- aria-label="Filter by name"
5054
+ placeholder="Filer by name"
5055
+ value
5056
+ aria-label="Search input"
5059
5057
  />
5060
5058
  </span>
5061
5059
  </div>
@@ -5573,22 +5571,24 @@ wrapperTag: div
5573
5571
  </div>
5574
5572
  <div class="pf-v5-c-menu__search">
5575
5573
  <div class="pf-v5-c-menu__search-input">
5576
- <div class="pf-v5-c-search-input">
5577
- <div class="pf-v5-c-search-input__bar">
5578
- <span class="pf-v5-c-search-input__text">
5574
+ <div class="pf-v5-c-text-input-group">
5575
+ <div
5576
+ class="pf-v5-c-text-input-group__main pf-m-icon"
5577
+ >
5578
+ <span
5579
+ class="pf-v5-c-text-input-group__text"
5580
+ >
5579
5581
  <span
5580
- class="pf-v5-c-search-input__icon"
5582
+ class="pf-v5-c-text-input-group__icon"
5581
5583
  >
5582
- <i
5583
- class="fas fa-search fa-fw"
5584
- aria-hidden="true"
5585
- ></i>
5584
+ <i class="fas fa-fw fa-search"></i>
5586
5585
  </span>
5587
5586
  <input
5588
- class="pf-v5-c-search-input__text-input"
5587
+ class="pf-v5-c-text-input-group__text-input"
5589
5588
  type="text"
5590
5589
  placeholder="Search"
5591
- aria-label="Search"
5590
+ value
5591
+ aria-label="Search input"
5592
5592
  />
5593
5593
  </span>
5594
5594
  </div>
@@ -6187,20 +6187,18 @@ wrapperTag: div
6187
6187
  hidden
6188
6188
  >
6189
6189
  <div class="pf-v5-c-app-launcher__menu-search">
6190
- <div class="pf-v5-c-search-input">
6191
- <div class="pf-v5-c-search-input__bar">
6192
- <span class="pf-v5-c-search-input__text">
6193
- <span class="pf-v5-c-search-input__icon">
6194
- <i
6195
- class="fas fa-search fa-fw"
6196
- aria-hidden="true"
6197
- ></i>
6190
+ <div class="pf-v5-c-text-input-group">
6191
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
6192
+ <span class="pf-v5-c-text-input-group__text">
6193
+ <span class="pf-v5-c-text-input-group__icon">
6194
+ <i class="fas fa-fw fa-search"></i>
6198
6195
  </span>
6199
6196
  <input
6200
- class="pf-v5-c-search-input__text-input"
6197
+ class="pf-v5-c-text-input-group__text-input"
6201
6198
  type="text"
6202
- placeholder="Filter by name"
6203
- aria-label="Filter by name"
6199
+ placeholder="Filer by name"
6200
+ value
6201
+ aria-label="Search input"
6204
6202
  />
6205
6203
  </span>
6206
6204
  </div>
@@ -6718,22 +6716,24 @@ wrapperTag: div
6718
6716
  </div>
6719
6717
  <div class="pf-v5-c-menu__search">
6720
6718
  <div class="pf-v5-c-menu__search-input">
6721
- <div class="pf-v5-c-search-input">
6722
- <div class="pf-v5-c-search-input__bar">
6723
- <span class="pf-v5-c-search-input__text">
6719
+ <div class="pf-v5-c-text-input-group">
6720
+ <div
6721
+ class="pf-v5-c-text-input-group__main pf-m-icon"
6722
+ >
6723
+ <span
6724
+ class="pf-v5-c-text-input-group__text"
6725
+ >
6724
6726
  <span
6725
- class="pf-v5-c-search-input__icon"
6727
+ class="pf-v5-c-text-input-group__icon"
6726
6728
  >
6727
- <i
6728
- class="fas fa-search fa-fw"
6729
- aria-hidden="true"
6730
- ></i>
6729
+ <i class="fas fa-fw fa-search"></i>
6731
6730
  </span>
6732
6731
  <input
6733
- class="pf-v5-c-search-input__text-input"
6732
+ class="pf-v5-c-text-input-group__text-input"
6734
6733
  type="text"
6735
6734
  placeholder="Search"
6736
- aria-label="Search"
6735
+ value
6736
+ aria-label="Search input"
6737
6737
  />
6738
6738
  </span>
6739
6739
  </div>
@@ -7340,20 +7340,18 @@ wrapperTag: div
7340
7340
  hidden
7341
7341
  >
7342
7342
  <div class="pf-v5-c-app-launcher__menu-search">
7343
- <div class="pf-v5-c-search-input">
7344
- <div class="pf-v5-c-search-input__bar">
7345
- <span class="pf-v5-c-search-input__text">
7346
- <span class="pf-v5-c-search-input__icon">
7347
- <i
7348
- class="fas fa-search fa-fw"
7349
- aria-hidden="true"
7350
- ></i>
7343
+ <div class="pf-v5-c-text-input-group">
7344
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
7345
+ <span class="pf-v5-c-text-input-group__text">
7346
+ <span class="pf-v5-c-text-input-group__icon">
7347
+ <i class="fas fa-fw fa-search"></i>
7351
7348
  </span>
7352
7349
  <input
7353
- class="pf-v5-c-search-input__text-input"
7350
+ class="pf-v5-c-text-input-group__text-input"
7354
7351
  type="text"
7355
- placeholder="Filter by name"
7356
- aria-label="Filter by name"
7352
+ placeholder="Filer by name"
7353
+ value
7354
+ aria-label="Search input"
7357
7355
  />
7358
7356
  </span>
7359
7357
  </div>
@@ -7871,22 +7869,24 @@ wrapperTag: div
7871
7869
  </div>
7872
7870
  <div class="pf-v5-c-menu__search">
7873
7871
  <div class="pf-v5-c-menu__search-input">
7874
- <div class="pf-v5-c-search-input">
7875
- <div class="pf-v5-c-search-input__bar">
7876
- <span class="pf-v5-c-search-input__text">
7872
+ <div class="pf-v5-c-text-input-group">
7873
+ <div
7874
+ class="pf-v5-c-text-input-group__main pf-m-icon"
7875
+ >
7876
+ <span
7877
+ class="pf-v5-c-text-input-group__text"
7878
+ >
7877
7879
  <span
7878
- class="pf-v5-c-search-input__icon"
7880
+ class="pf-v5-c-text-input-group__icon"
7879
7881
  >
7880
- <i
7881
- class="fas fa-search fa-fw"
7882
- aria-hidden="true"
7883
- ></i>
7882
+ <i class="fas fa-fw fa-search"></i>
7884
7883
  </span>
7885
7884
  <input
7886
- class="pf-v5-c-search-input__text-input"
7885
+ class="pf-v5-c-text-input-group__text-input"
7887
7886
  type="text"
7888
7887
  placeholder="Search"
7889
- aria-label="Search"
7888
+ value
7889
+ aria-label="Search input"
7890
7890
  />
7891
7891
  </span>
7892
7892
  </div>
@@ -8475,20 +8475,18 @@ wrapperTag: div
8475
8475
  hidden
8476
8476
  >
8477
8477
  <div class="pf-v5-c-app-launcher__menu-search">
8478
- <div class="pf-v5-c-search-input">
8479
- <div class="pf-v5-c-search-input__bar">
8480
- <span class="pf-v5-c-search-input__text">
8481
- <span class="pf-v5-c-search-input__icon">
8482
- <i
8483
- class="fas fa-search fa-fw"
8484
- aria-hidden="true"
8485
- ></i>
8478
+ <div class="pf-v5-c-text-input-group">
8479
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
8480
+ <span class="pf-v5-c-text-input-group__text">
8481
+ <span class="pf-v5-c-text-input-group__icon">
8482
+ <i class="fas fa-fw fa-search"></i>
8486
8483
  </span>
8487
8484
  <input
8488
- class="pf-v5-c-search-input__text-input"
8485
+ class="pf-v5-c-text-input-group__text-input"
8489
8486
  type="text"
8490
- placeholder="Filter by name"
8491
- aria-label="Filter by name"
8487
+ placeholder="Filer by name"
8488
+ value
8489
+ aria-label="Search input"
8492
8490
  />
8493
8491
  </span>
8494
8492
  </div>
@@ -9006,22 +9004,24 @@ wrapperTag: div
9006
9004
  </div>
9007
9005
  <div class="pf-v5-c-menu__search">
9008
9006
  <div class="pf-v5-c-menu__search-input">
9009
- <div class="pf-v5-c-search-input">
9010
- <div class="pf-v5-c-search-input__bar">
9011
- <span class="pf-v5-c-search-input__text">
9007
+ <div class="pf-v5-c-text-input-group">
9008
+ <div
9009
+ class="pf-v5-c-text-input-group__main pf-m-icon"
9010
+ >
9011
+ <span
9012
+ class="pf-v5-c-text-input-group__text"
9013
+ >
9012
9014
  <span
9013
- class="pf-v5-c-search-input__icon"
9015
+ class="pf-v5-c-text-input-group__icon"
9014
9016
  >
9015
- <i
9016
- class="fas fa-search fa-fw"
9017
- aria-hidden="true"
9018
- ></i>
9017
+ <i class="fas fa-fw fa-search"></i>
9019
9018
  </span>
9020
9019
  <input
9021
- class="pf-v5-c-search-input__text-input"
9020
+ class="pf-v5-c-text-input-group__text-input"
9022
9021
  type="text"
9023
9022
  placeholder="Search"
9024
- aria-label="Search"
9023
+ value
9024
+ aria-label="Search input"
9025
9025
  />
9026
9026
  </span>
9027
9027
  </div>
@@ -9679,20 +9679,18 @@ wrapperTag: div
9679
9679
  hidden
9680
9680
  >
9681
9681
  <div class="pf-v5-c-app-launcher__menu-search">
9682
- <div class="pf-v5-c-search-input">
9683
- <div class="pf-v5-c-search-input__bar">
9684
- <span class="pf-v5-c-search-input__text">
9685
- <span class="pf-v5-c-search-input__icon">
9686
- <i
9687
- class="fas fa-search fa-fw"
9688
- aria-hidden="true"
9689
- ></i>
9682
+ <div class="pf-v5-c-text-input-group">
9683
+ <div class="pf-v5-c-text-input-group__main pf-m-icon">
9684
+ <span class="pf-v5-c-text-input-group__text">
9685
+ <span class="pf-v5-c-text-input-group__icon">
9686
+ <i class="fas fa-fw fa-search"></i>
9690
9687
  </span>
9691
9688
  <input
9692
- class="pf-v5-c-search-input__text-input"
9689
+ class="pf-v5-c-text-input-group__text-input"
9693
9690
  type="text"
9694
- placeholder="Filter by name"
9695
- aria-label="Filter by name"
9691
+ placeholder="Filer by name"
9692
+ value
9693
+ aria-label="Search input"
9696
9694
  />
9697
9695
  </span>
9698
9696
  </div>
@@ -10210,22 +10208,24 @@ wrapperTag: div
10210
10208
  </div>
10211
10209
  <div class="pf-v5-c-menu__search">
10212
10210
  <div class="pf-v5-c-menu__search-input">
10213
- <div class="pf-v5-c-search-input">
10214
- <div class="pf-v5-c-search-input__bar">
10215
- <span class="pf-v5-c-search-input__text">
10211
+ <div class="pf-v5-c-text-input-group">
10212
+ <div
10213
+ class="pf-v5-c-text-input-group__main pf-m-icon"
10214
+ >
10215
+ <span
10216
+ class="pf-v5-c-text-input-group__text"
10217
+ >
10216
10218
  <span
10217
- class="pf-v5-c-search-input__icon"
10219
+ class="pf-v5-c-text-input-group__icon"
10218
10220
  >
10219
- <i
10220
- class="fas fa-search fa-fw"
10221
- aria-hidden="true"
10222
- ></i>
10221
+ <i class="fas fa-fw fa-search"></i>
10223
10222
  </span>
10224
10223
  <input
10225
- class="pf-v5-c-search-input__text-input"
10224
+ class="pf-v5-c-text-input-group__text-input"
10226
10225
  type="text"
10227
10226
  placeholder="Search"
10228
- aria-label="Search"
10227
+ value
10228
+ aria-label="Search input"
10229
10229
  />
10230
10230
  </span>
10231
10231
  </div>