@patternfly/patternfly 6.0.0-alpha.97 → 6.0.0-alpha.98

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 (34) hide show
  1. package/components/MenuToggle/menu-toggle.css +20 -6
  2. package/components/MenuToggle/menu-toggle.scss +32 -6
  3. package/docs/components/LogViewer/examples/LogViewer.md +130 -10
  4. package/docs/components/MenuToggle/examples/MenuToggle.md +162 -6
  5. package/docs/components/Toolbar/examples/Toolbar.md +143 -11
  6. package/docs/demos/AboutModal/examples/AboutModal.md +52 -4
  7. package/docs/demos/Alert/examples/Alert.md +156 -12
  8. package/docs/demos/BackToTop/examples/BackToTop.md +52 -4
  9. package/docs/demos/Banner/examples/Banner.md +104 -8
  10. package/docs/demos/CardView/examples/CardView.md +65 -5
  11. package/docs/demos/ContextSelector/examples/ContextSelector.md +156 -12
  12. package/docs/demos/Dashboard/examples/Dashboard.md +52 -4
  13. package/docs/demos/DataList/examples/DataList.md +273 -21
  14. package/docs/demos/DescriptionList/examples/DescriptionList.md +156 -12
  15. package/docs/demos/Drawer/examples/Drawer.md +260 -20
  16. package/docs/demos/JumpLinks/examples/JumpLinks.md +312 -24
  17. package/docs/demos/Masthead/examples/Masthead.md +247 -19
  18. package/docs/demos/Modal/examples/Modal.md +312 -24
  19. package/docs/demos/Nav/examples/Nav.md +312 -24
  20. package/docs/demos/NotificationDrawer/examples/NotificationDrawer.md +260 -20
  21. package/docs/demos/Page/examples/Page.md +468 -36
  22. package/docs/demos/Page/examples/Penta.md +13 -1
  23. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +455 -35
  24. package/docs/demos/Skeleton/examples/Skeleton.md +52 -4
  25. package/docs/demos/Table/examples/Table.md +1094 -86
  26. package/docs/demos/Tabs/examples/Tabs.md +325 -25
  27. package/docs/demos/Toolbar/examples/Toolbar.md +325 -25
  28. package/docs/demos/Wizard/examples/Wizard.md +468 -36
  29. package/package.json +1 -1
  30. package/patternfly-no-globals.css +20 -6
  31. package/patternfly-theme-dark-unversioned.css +20 -6
  32. package/patternfly.css +20 -6
  33. package/patternfly.min.css +1 -1
  34. package/patternfly.min.css.map +1 -1
@@ -159,7 +159,19 @@ section: components
159
159
  aria-label="Application launcher"
160
160
  >
161
161
  <span class="pf-v6-c-menu-toggle__icon">
162
- <i class="fas fa-th" aria-hidden="true"></i>
162
+ <svg
163
+ class="pf-v5-svg"
164
+ viewBox="0 0 192 512"
165
+ fill="currentColor"
166
+ aria-hidden="true"
167
+ role="img"
168
+ width="1em"
169
+ height="1em"
170
+ >
171
+ <path
172
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
173
+ />
174
+ </svg>
163
175
  </span>
164
176
  </button>
165
177
  </div>
@@ -171,7 +183,19 @@ section: components
171
183
  aria-label="Settings"
172
184
  >
173
185
  <span class="pf-v6-c-menu-toggle__icon">
174
- <i class="fas fa-cog" aria-hidden="true"></i>
186
+ <svg
187
+ class="pf-v5-svg"
188
+ viewBox="0 0 192 512"
189
+ fill="currentColor"
190
+ aria-hidden="true"
191
+ role="img"
192
+ width="1em"
193
+ height="1em"
194
+ >
195
+ <path
196
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
197
+ />
198
+ </svg>
175
199
  </span>
176
200
  </button>
177
201
  </div>
@@ -183,7 +207,19 @@ section: components
183
207
  aria-label="Help"
184
208
  >
185
209
  <span class="pf-v6-c-menu-toggle__icon">
186
- <i class="fas fa-question-circle" aria-hidden="true"></i>
210
+ <svg
211
+ class="pf-v5-svg"
212
+ viewBox="0 0 192 512"
213
+ fill="currentColor"
214
+ aria-hidden="true"
215
+ role="img"
216
+ width="1em"
217
+ height="1em"
218
+ >
219
+ <path
220
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
221
+ />
222
+ </svg>
187
223
  </span>
188
224
  </button>
189
225
  </div>
@@ -196,7 +232,19 @@ section: components
196
232
  aria-label="Actions"
197
233
  >
198
234
  <span class="pf-v6-c-menu-toggle__icon">
199
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
235
+ <svg
236
+ class="pf-v5-svg"
237
+ viewBox="0 0 192 512"
238
+ fill="currentColor"
239
+ aria-hidden="true"
240
+ role="img"
241
+ width="1em"
242
+ height="1em"
243
+ >
244
+ <path
245
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
246
+ />
247
+ </svg>
200
248
  </span>
201
249
  </button>
202
250
  </div>
@@ -1167,7 +1215,19 @@ section: components
1167
1215
  aria-label="Application launcher"
1168
1216
  >
1169
1217
  <span class="pf-v6-c-menu-toggle__icon">
1170
- <i class="fas fa-th" aria-hidden="true"></i>
1218
+ <svg
1219
+ class="pf-v5-svg"
1220
+ viewBox="0 0 192 512"
1221
+ fill="currentColor"
1222
+ aria-hidden="true"
1223
+ role="img"
1224
+ width="1em"
1225
+ height="1em"
1226
+ >
1227
+ <path
1228
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
1229
+ />
1230
+ </svg>
1171
1231
  </span>
1172
1232
  </button>
1173
1233
  </div>
@@ -1179,7 +1239,19 @@ section: components
1179
1239
  aria-label="Settings"
1180
1240
  >
1181
1241
  <span class="pf-v6-c-menu-toggle__icon">
1182
- <i class="fas fa-cog" aria-hidden="true"></i>
1242
+ <svg
1243
+ class="pf-v5-svg"
1244
+ viewBox="0 0 192 512"
1245
+ fill="currentColor"
1246
+ aria-hidden="true"
1247
+ role="img"
1248
+ width="1em"
1249
+ height="1em"
1250
+ >
1251
+ <path
1252
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
1253
+ />
1254
+ </svg>
1183
1255
  </span>
1184
1256
  </button>
1185
1257
  </div>
@@ -1191,7 +1263,19 @@ section: components
1191
1263
  aria-label="Help"
1192
1264
  >
1193
1265
  <span class="pf-v6-c-menu-toggle__icon">
1194
- <i class="fas fa-question-circle" aria-hidden="true"></i>
1266
+ <svg
1267
+ class="pf-v5-svg"
1268
+ viewBox="0 0 192 512"
1269
+ fill="currentColor"
1270
+ aria-hidden="true"
1271
+ role="img"
1272
+ width="1em"
1273
+ height="1em"
1274
+ >
1275
+ <path
1276
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
1277
+ />
1278
+ </svg>
1195
1279
  </span>
1196
1280
  </button>
1197
1281
  </div>
@@ -1204,7 +1288,19 @@ section: components
1204
1288
  aria-label="Actions"
1205
1289
  >
1206
1290
  <span class="pf-v6-c-menu-toggle__icon">
1207
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
1291
+ <svg
1292
+ class="pf-v5-svg"
1293
+ viewBox="0 0 192 512"
1294
+ fill="currentColor"
1295
+ aria-hidden="true"
1296
+ role="img"
1297
+ width="1em"
1298
+ height="1em"
1299
+ >
1300
+ <path
1301
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
1302
+ />
1303
+ </svg>
1208
1304
  </span>
1209
1305
  </button>
1210
1306
  </div>
@@ -2175,7 +2271,19 @@ section: components
2175
2271
  aria-label="Application launcher"
2176
2272
  >
2177
2273
  <span class="pf-v6-c-menu-toggle__icon">
2178
- <i class="fas fa-th" aria-hidden="true"></i>
2274
+ <svg
2275
+ class="pf-v5-svg"
2276
+ viewBox="0 0 192 512"
2277
+ fill="currentColor"
2278
+ aria-hidden="true"
2279
+ role="img"
2280
+ width="1em"
2281
+ height="1em"
2282
+ >
2283
+ <path
2284
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
2285
+ />
2286
+ </svg>
2179
2287
  </span>
2180
2288
  </button>
2181
2289
  </div>
@@ -2187,7 +2295,19 @@ section: components
2187
2295
  aria-label="Settings"
2188
2296
  >
2189
2297
  <span class="pf-v6-c-menu-toggle__icon">
2190
- <i class="fas fa-cog" aria-hidden="true"></i>
2298
+ <svg
2299
+ class="pf-v5-svg"
2300
+ viewBox="0 0 192 512"
2301
+ fill="currentColor"
2302
+ aria-hidden="true"
2303
+ role="img"
2304
+ width="1em"
2305
+ height="1em"
2306
+ >
2307
+ <path
2308
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
2309
+ />
2310
+ </svg>
2191
2311
  </span>
2192
2312
  </button>
2193
2313
  </div>
@@ -2199,7 +2319,19 @@ section: components
2199
2319
  aria-label="Help"
2200
2320
  >
2201
2321
  <span class="pf-v6-c-menu-toggle__icon">
2202
- <i class="fas fa-question-circle" aria-hidden="true"></i>
2322
+ <svg
2323
+ class="pf-v5-svg"
2324
+ viewBox="0 0 192 512"
2325
+ fill="currentColor"
2326
+ aria-hidden="true"
2327
+ role="img"
2328
+ width="1em"
2329
+ height="1em"
2330
+ >
2331
+ <path
2332
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
2333
+ />
2334
+ </svg>
2203
2335
  </span>
2204
2336
  </button>
2205
2337
  </div>
@@ -2212,7 +2344,19 @@ section: components
2212
2344
  aria-label="Actions"
2213
2345
  >
2214
2346
  <span class="pf-v6-c-menu-toggle__icon">
2215
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
2347
+ <svg
2348
+ class="pf-v5-svg"
2349
+ viewBox="0 0 192 512"
2350
+ fill="currentColor"
2351
+ aria-hidden="true"
2352
+ role="img"
2353
+ width="1em"
2354
+ height="1em"
2355
+ >
2356
+ <path
2357
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
2358
+ />
2359
+ </svg>
2216
2360
  </span>
2217
2361
  </button>
2218
2362
  </div>
@@ -3186,7 +3330,19 @@ section: components
3186
3330
  aria-label="Application launcher"
3187
3331
  >
3188
3332
  <span class="pf-v6-c-menu-toggle__icon">
3189
- <i class="fas fa-th" aria-hidden="true"></i>
3333
+ <svg
3334
+ class="pf-v5-svg"
3335
+ viewBox="0 0 192 512"
3336
+ fill="currentColor"
3337
+ aria-hidden="true"
3338
+ role="img"
3339
+ width="1em"
3340
+ height="1em"
3341
+ >
3342
+ <path
3343
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
3344
+ />
3345
+ </svg>
3190
3346
  </span>
3191
3347
  </button>
3192
3348
  </div>
@@ -3198,7 +3354,19 @@ section: components
3198
3354
  aria-label="Settings"
3199
3355
  >
3200
3356
  <span class="pf-v6-c-menu-toggle__icon">
3201
- <i class="fas fa-cog" aria-hidden="true"></i>
3357
+ <svg
3358
+ class="pf-v5-svg"
3359
+ viewBox="0 0 192 512"
3360
+ fill="currentColor"
3361
+ aria-hidden="true"
3362
+ role="img"
3363
+ width="1em"
3364
+ height="1em"
3365
+ >
3366
+ <path
3367
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
3368
+ />
3369
+ </svg>
3202
3370
  </span>
3203
3371
  </button>
3204
3372
  </div>
@@ -3210,7 +3378,19 @@ section: components
3210
3378
  aria-label="Help"
3211
3379
  >
3212
3380
  <span class="pf-v6-c-menu-toggle__icon">
3213
- <i class="fas fa-question-circle" aria-hidden="true"></i>
3381
+ <svg
3382
+ class="pf-v5-svg"
3383
+ viewBox="0 0 192 512"
3384
+ fill="currentColor"
3385
+ aria-hidden="true"
3386
+ role="img"
3387
+ width="1em"
3388
+ height="1em"
3389
+ >
3390
+ <path
3391
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
3392
+ />
3393
+ </svg>
3214
3394
  </span>
3215
3395
  </button>
3216
3396
  </div>
@@ -3223,7 +3403,19 @@ section: components
3223
3403
  aria-label="Actions"
3224
3404
  >
3225
3405
  <span class="pf-v6-c-menu-toggle__icon">
3226
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
3406
+ <svg
3407
+ class="pf-v5-svg"
3408
+ viewBox="0 0 192 512"
3409
+ fill="currentColor"
3410
+ aria-hidden="true"
3411
+ role="img"
3412
+ width="1em"
3413
+ height="1em"
3414
+ >
3415
+ <path
3416
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
3417
+ />
3418
+ </svg>
3227
3419
  </span>
3228
3420
  </button>
3229
3421
  </div>
@@ -4196,7 +4388,19 @@ section: components
4196
4388
  aria-label="Application launcher"
4197
4389
  >
4198
4390
  <span class="pf-v6-c-menu-toggle__icon">
4199
- <i class="fas fa-th" aria-hidden="true"></i>
4391
+ <svg
4392
+ class="pf-v5-svg"
4393
+ viewBox="0 0 192 512"
4394
+ fill="currentColor"
4395
+ aria-hidden="true"
4396
+ role="img"
4397
+ width="1em"
4398
+ height="1em"
4399
+ >
4400
+ <path
4401
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
4402
+ />
4403
+ </svg>
4200
4404
  </span>
4201
4405
  </button>
4202
4406
  </div>
@@ -4208,7 +4412,19 @@ section: components
4208
4412
  aria-label="Settings"
4209
4413
  >
4210
4414
  <span class="pf-v6-c-menu-toggle__icon">
4211
- <i class="fas fa-cog" aria-hidden="true"></i>
4415
+ <svg
4416
+ class="pf-v5-svg"
4417
+ viewBox="0 0 192 512"
4418
+ fill="currentColor"
4419
+ aria-hidden="true"
4420
+ role="img"
4421
+ width="1em"
4422
+ height="1em"
4423
+ >
4424
+ <path
4425
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
4426
+ />
4427
+ </svg>
4212
4428
  </span>
4213
4429
  </button>
4214
4430
  </div>
@@ -4220,7 +4436,19 @@ section: components
4220
4436
  aria-label="Help"
4221
4437
  >
4222
4438
  <span class="pf-v6-c-menu-toggle__icon">
4223
- <i class="fas fa-question-circle" aria-hidden="true"></i>
4439
+ <svg
4440
+ class="pf-v5-svg"
4441
+ viewBox="0 0 192 512"
4442
+ fill="currentColor"
4443
+ aria-hidden="true"
4444
+ role="img"
4445
+ width="1em"
4446
+ height="1em"
4447
+ >
4448
+ <path
4449
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
4450
+ />
4451
+ </svg>
4224
4452
  </span>
4225
4453
  </button>
4226
4454
  </div>
@@ -4233,7 +4461,19 @@ section: components
4233
4461
  aria-label="Actions"
4234
4462
  >
4235
4463
  <span class="pf-v6-c-menu-toggle__icon">
4236
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
4464
+ <svg
4465
+ class="pf-v5-svg"
4466
+ viewBox="0 0 192 512"
4467
+ fill="currentColor"
4468
+ aria-hidden="true"
4469
+ role="img"
4470
+ width="1em"
4471
+ height="1em"
4472
+ >
4473
+ <path
4474
+ d="M96 184c39.8 0 72 32.2 72 72s-32.2 72-72 72-72-32.2-72-72 32.2-72 72-72zM24 80c0 39.8 32.2 72 72 72s72-32.2 72-72S135.8 8 96 8 24 40.2 24 80zm0 352c0 39.8 32.2 72 72 72s72-32.2 72-72-32.2-72-72-72-72 32.2-72 72z"
4475
+ />
4476
+ </svg>
4237
4477
  </span>
4238
4478
  </button>
4239
4479
  </div>