@patternfly/patternfly 5.0.0-alpha.60 → 5.0.0-alpha.61

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 (8) hide show
  1. package/components/Table/table.css +0 -1
  2. package/components/Table/table.scss +0 -1
  3. package/docs/components/Table/examples/Table.md +434 -432
  4. package/package.json +1 -1
  5. package/patternfly-no-globals.css +0 -1
  6. package/patternfly.css +0 -1
  7. package/patternfly.min.css +1 -1
  8. package/patternfly.min.css.map +1 -1
package/docs/components/Table/examples/Table.md CHANGED
@@ -9073,7 +9073,7 @@ Note: To apply padding to `.pf-v5-c-table__expandable-row`, wrap the content in
9073
9073
  <thead class="pf-v5-c-table__thead">
9074
9074
  <tr class="pf-v5-c-table__tr">
9075
9075
  <th
9076
- class="pf-v5-c-table__th {{pfv}}table__tree-view-title-header-cell"
9076
+ class="pf-v5-c-table__th table__tree-view-title-header-cell"
9077
9077
  scope="col"
9078
9078
  >Name</th>
9079
9079
  <th class="pf-v5-c-table__th" scope="col">Count</th>
@@ -10638,7 +10638,7 @@ Note: To apply padding to `.pf-v5-c-table__expandable-row`, wrap the content in
10638
10638
  <thead class="pf-v5-c-table__thead">
10639
10639
  <tr class="pf-v5-c-table__tr">
10640
10640
  <th
10641
- class="pf-v5-c-table__th {{pfv}}table__tree-view-title-header-cell"
10641
+ class="pf-v5-c-table__th table__tree-view-title-header-cell"
10642
10642
  scope="col"
10643
10643
  >Name</th>
10644
10644
  <th class="pf-v5-c-table__th" scope="col">Count</th>
@@ -12408,7 +12408,7 @@ Note: To apply padding to `.pf-v5-c-table__expandable-row`, wrap the content in
12408
12408
  <thead class="pf-v5-c-table__thead">
12409
12409
  <tr class="pf-v5-c-table__tr">
12410
12410
  <th
12411
- class="pf-v5-c-table__th {{pfv}}table__tree-view-title-header-cell"
12411
+ class="pf-v5-c-table__th table__tree-view-title-header-cell"
12412
12412
  scope="col"
12413
12413
  >Name</th>
12414
12414
  <th class="pf-v5-c-table__th" scope="col">Count</th>
@@ -14229,7 +14229,7 @@ Note: To apply padding to `.pf-v5-c-table__expandable-row`, wrap the content in
14229
14229
  <thead class="pf-v5-c-table__thead">
14230
14230
  <tr class="pf-v5-c-table__tr">
14231
14231
  <th
14232
- class="pf-v5-c-table__th {{pfv}}table__tree-view-title-header-cell"
14232
+ class="pf-v5-c-table__th table__tree-view-title-header-cell"
14233
14233
  scope="col"
14234
14234
  >Name</th>
14235
14235
  <th class="pf-v5-c-table__th" scope="col">Count</th>
@@ -14238,474 +14238,476 @@ Note: To apply padding to `.pf-v5-c-table__expandable-row`, wrap the content in
14238
14238
  </tr>
14239
14239
  </thead>
14240
14240
 
14241
- <tr class="pf-v5-c-table__tr" role="row">
14242
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14243
- <div class="pf-v5-c-table__tree-view-main">
14244
- <div class="pf-v5-c-table__tree-view-text">
14245
- <span
14246
- class="pf-v5-c-table__text"
14247
- id="tree-table-indent-example-node-1"
14248
- >Level 1, leaf 1</span>
14241
+ <tbody class="pf-v5-c-table__tbody">
14242
+ <tr class="pf-v5-c-table__tr" role="row">
14243
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14244
+ <div class="pf-v5-c-table__tree-view-main">
14245
+ <div class="pf-v5-c-table__tree-view-text">
14246
+ <span
14247
+ class="pf-v5-c-table__text"
14248
+ id="tree-table-indent-example-node-1"
14249
+ >Level 1, leaf 1</span>
14250
+ </div>
14251
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14252
+ <button
14253
+ class="pf-v5-c-button pf-m-plain"
14254
+ type="button"
14255
+ aria-label="tree-table-indent-example-1--tree-table--details-toggle"
14256
+ >
14257
+ <span class="pf-v5-c-table__details-toggle-icon">
14258
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14259
+ </span>
14260
+ </button>
14261
+ </span>
14249
14262
  </div>
14250
- <span class="pf-v5-c-table__tree-view-details-toggle">
14263
+ </th>
14264
+ <td
14265
+ class="pf-v5-c-table__td"
14266
+ role="gridcell"
14267
+ data-label="Migration assessment"
14268
+ >10</td>
14269
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14270
+ <td
14271
+ class="pf-v5-c-table__td"
14272
+ role="gridcell"
14273
+ data-label="Number of Data Stores"
14274
+ >5</td>
14275
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14276
+ <div class="pf-v5-c-dropdown">
14251
14277
  <button
14252
- class="pf-v5-c-button pf-m-plain"
14278
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14279
+ id="tree-table-indent-example-1-actions-button"
14280
+ aria-expanded="false"
14253
14281
  type="button"
14254
- aria-label="tree-table-indent-example-1--tree-table--details-toggle"
14282
+ aria-label="Actions"
14255
14283
  >
14256
- <span class="pf-v5-c-table__details-toggle-icon">
14257
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14258
- </span>
14284
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14259
14285
  </button>
14260
- </span>
14261
- </div>
14262
- </th>
14263
- <td
14264
- class="pf-v5-c-table__td"
14265
- role="gridcell"
14266
- data-label="Migration assessment"
14267
- >10</td>
14268
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14269
- <td
14270
- class="pf-v5-c-table__td"
14271
- role="gridcell"
14272
- data-label="Number of Data Stores"
14273
- >5</td>
14274
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14275
- <div class="pf-v5-c-dropdown">
14276
- <button
14277
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14278
- id="tree-table-indent-example-1-actions-button"
14279
- aria-expanded="false"
14280
- type="button"
14281
- aria-label="Actions"
14282
- >
14283
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14284
- </button>
14285
- <ul
14286
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14287
- aria-labelledby="tree-table-indent-example-1-actions-button"
14288
- hidden
14289
- >
14290
- <li>
14291
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14292
- </li>
14293
- <li>
14294
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14295
- </li>
14296
- <li>
14297
- <a
14298
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14299
- href="#"
14300
- aria-disabled="true"
14301
- tabindex="-1"
14302
- >Disabled link</a>
14303
- </li>
14304
- <li>
14286
+ <ul
14287
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14288
+ aria-labelledby="tree-table-indent-example-1-actions-button"
14289
+ hidden
14290
+ >
14291
+ <li>
14292
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14293
+ </li>
14294
+ <li>
14295
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14296
+ </li>
14297
+ <li>
14298
+ <a
14299
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14300
+ href="#"
14301
+ aria-disabled="true"
14302
+ tabindex="-1"
14303
+ >Disabled link</a>
14304
+ </li>
14305
+ <li>
14306
+ <button
14307
+ class="pf-v5-c-dropdown__menu-item"
14308
+ type="button"
14309
+ disabled
14310
+ >Disabled action</button>
14311
+ </li>
14312
+ <li class="pf-v5-c-divider" role="separator"></li>
14313
+ <li>
14314
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14315
+ </li>
14316
+ </ul>
14317
+ </div>
14318
+ </td>
14319
+ </tr>
14320
+ <tr class="pf-v5-c-table__tr" role="row">
14321
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14322
+ <div class="pf-v5-c-table__tree-view-main">
14323
+ <div class="pf-v5-c-table__tree-view-text">
14324
+ <span
14325
+ class="pf-v5-c-table__text"
14326
+ id="tree-table-indent-example-node-2"
14327
+ >Level 1, leaf 2</span>
14328
+ </div>
14329
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14305
14330
  <button
14306
- class="pf-v5-c-dropdown__menu-item"
14331
+ class="pf-v5-c-button pf-m-plain"
14307
14332
  type="button"
14308
- disabled
14309
- >Disabled action</button>
14310
- </li>
14311
- <li class="pf-v5-c-divider" role="separator"></li>
14312
- <li>
14313
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14314
- </li>
14315
- </ul>
14316
- </div>
14317
- </td>
14318
- </tr>
14319
- <tr class="pf-v5-c-table__tr" role="row">
14320
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14321
- <div class="pf-v5-c-table__tree-view-main">
14322
- <div class="pf-v5-c-table__tree-view-text">
14323
- <span
14324
- class="pf-v5-c-table__text"
14325
- id="tree-table-indent-example-node-2"
14326
- >Level 1, leaf 2</span>
14333
+ aria-label="tree-table-indent-example-2--tree-table--details-toggle"
14334
+ >
14335
+ <span class="pf-v5-c-table__details-toggle-icon">
14336
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14337
+ </span>
14338
+ </button>
14339
+ </span>
14327
14340
  </div>
14328
- <span class="pf-v5-c-table__tree-view-details-toggle">
14341
+ </th>
14342
+ <td
14343
+ class="pf-v5-c-table__td"
14344
+ role="gridcell"
14345
+ data-label="Migration assessment"
14346
+ >10</td>
14347
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14348
+ <td
14349
+ class="pf-v5-c-table__td"
14350
+ role="gridcell"
14351
+ data-label="Number of Data Stores"
14352
+ >5</td>
14353
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14354
+ <div class="pf-v5-c-dropdown">
14329
14355
  <button
14330
- class="pf-v5-c-button pf-m-plain"
14356
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14357
+ id="tree-table-indent-example-2-actions-button"
14358
+ aria-expanded="false"
14331
14359
  type="button"
14332
- aria-label="tree-table-indent-example-2--tree-table--details-toggle"
14360
+ aria-label="Actions"
14333
14361
  >
14334
- <span class="pf-v5-c-table__details-toggle-icon">
14335
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14336
- </span>
14362
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14337
14363
  </button>
14338
- </span>
14339
- </div>
14340
- </th>
14341
- <td
14342
- class="pf-v5-c-table__td"
14343
- role="gridcell"
14344
- data-label="Migration assessment"
14345
- >10</td>
14346
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14347
- <td
14348
- class="pf-v5-c-table__td"
14349
- role="gridcell"
14350
- data-label="Number of Data Stores"
14351
- >5</td>
14352
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14353
- <div class="pf-v5-c-dropdown">
14354
- <button
14355
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14356
- id="tree-table-indent-example-2-actions-button"
14357
- aria-expanded="false"
14358
- type="button"
14359
- aria-label="Actions"
14360
- >
14361
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14362
- </button>
14363
- <ul
14364
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14365
- aria-labelledby="tree-table-indent-example-2-actions-button"
14366
- hidden
14367
- >
14368
- <li>
14369
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14370
- </li>
14371
- <li>
14372
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14373
- </li>
14374
- <li>
14375
- <a
14376
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14377
- href="#"
14378
- aria-disabled="true"
14379
- tabindex="-1"
14380
- >Disabled link</a>
14381
- </li>
14382
- <li>
14364
+ <ul
14365
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14366
+ aria-labelledby="tree-table-indent-example-2-actions-button"
14367
+ hidden
14368
+ >
14369
+ <li>
14370
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14371
+ </li>
14372
+ <li>
14373
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14374
+ </li>
14375
+ <li>
14376
+ <a
14377
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14378
+ href="#"
14379
+ aria-disabled="true"
14380
+ tabindex="-1"
14381
+ >Disabled link</a>
14382
+ </li>
14383
+ <li>
14384
+ <button
14385
+ class="pf-v5-c-dropdown__menu-item"
14386
+ type="button"
14387
+ disabled
14388
+ >Disabled action</button>
14389
+ </li>
14390
+ <li class="pf-v5-c-divider" role="separator"></li>
14391
+ <li>
14392
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14393
+ </li>
14394
+ </ul>
14395
+ </div>
14396
+ </td>
14397
+ </tr>
14398
+ <tr class="pf-v5-c-table__tr" role="row">
14399
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14400
+ <div class="pf-v5-c-table__tree-view-main">
14401
+ <div class="pf-v5-c-table__tree-view-text">
14402
+ <span
14403
+ class="pf-v5-c-table__text"
14404
+ id="tree-table-indent-example-node-3"
14405
+ >Level 1, leaf 3</span>
14406
+ </div>
14407
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14383
14408
  <button
14384
- class="pf-v5-c-dropdown__menu-item"
14409
+ class="pf-v5-c-button pf-m-plain"
14385
14410
  type="button"
14386
- disabled
14387
- >Disabled action</button>
14388
- </li>
14389
- <li class="pf-v5-c-divider" role="separator"></li>
14390
- <li>
14391
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14392
- </li>
14393
- </ul>
14394
- </div>
14395
- </td>
14396
- </tr>
14397
- <tr class="pf-v5-c-table__tr" role="row">
14398
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14399
- <div class="pf-v5-c-table__tree-view-main">
14400
- <div class="pf-v5-c-table__tree-view-text">
14401
- <span
14402
- class="pf-v5-c-table__text"
14403
- id="tree-table-indent-example-node-3"
14404
- >Level 1, leaf 3</span>
14411
+ aria-label="tree-table-indent-example-3--tree-table--details-toggle"
14412
+ >
14413
+ <span class="pf-v5-c-table__details-toggle-icon">
14414
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14415
+ </span>
14416
+ </button>
14417
+ </span>
14405
14418
  </div>
14406
- <span class="pf-v5-c-table__tree-view-details-toggle">
14419
+ </th>
14420
+ <td
14421
+ class="pf-v5-c-table__td"
14422
+ role="gridcell"
14423
+ data-label="Migration assessment"
14424
+ >10</td>
14425
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14426
+ <td
14427
+ class="pf-v5-c-table__td"
14428
+ role="gridcell"
14429
+ data-label="Number of Data Stores"
14430
+ >5</td>
14431
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14432
+ <div class="pf-v5-c-dropdown">
14407
14433
  <button
14408
- class="pf-v5-c-button pf-m-plain"
14434
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14435
+ id="tree-table-indent-example-3-actions-button"
14436
+ aria-expanded="false"
14409
14437
  type="button"
14410
- aria-label="tree-table-indent-example-3--tree-table--details-toggle"
14438
+ aria-label="Actions"
14411
14439
  >
14412
- <span class="pf-v5-c-table__details-toggle-icon">
14413
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14414
- </span>
14440
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14415
14441
  </button>
14416
- </span>
14417
- </div>
14418
- </th>
14419
- <td
14420
- class="pf-v5-c-table__td"
14421
- role="gridcell"
14422
- data-label="Migration assessment"
14423
- >10</td>
14424
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14425
- <td
14426
- class="pf-v5-c-table__td"
14427
- role="gridcell"
14428
- data-label="Number of Data Stores"
14429
- >5</td>
14430
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14431
- <div class="pf-v5-c-dropdown">
14432
- <button
14433
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14434
- id="tree-table-indent-example-3-actions-button"
14435
- aria-expanded="false"
14436
- type="button"
14437
- aria-label="Actions"
14438
- >
14439
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14440
- </button>
14441
- <ul
14442
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14443
- aria-labelledby="tree-table-indent-example-3-actions-button"
14444
- hidden
14445
- >
14446
- <li>
14447
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14448
- </li>
14449
- <li>
14450
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14451
- </li>
14452
- <li>
14453
- <a
14454
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14455
- href="#"
14456
- aria-disabled="true"
14457
- tabindex="-1"
14458
- >Disabled link</a>
14459
- </li>
14460
- <li>
14442
+ <ul
14443
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14444
+ aria-labelledby="tree-table-indent-example-3-actions-button"
14445
+ hidden
14446
+ >
14447
+ <li>
14448
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14449
+ </li>
14450
+ <li>
14451
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14452
+ </li>
14453
+ <li>
14454
+ <a
14455
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14456
+ href="#"
14457
+ aria-disabled="true"
14458
+ tabindex="-1"
14459
+ >Disabled link</a>
14460
+ </li>
14461
+ <li>
14462
+ <button
14463
+ class="pf-v5-c-dropdown__menu-item"
14464
+ type="button"
14465
+ disabled
14466
+ >Disabled action</button>
14467
+ </li>
14468
+ <li class="pf-v5-c-divider" role="separator"></li>
14469
+ <li>
14470
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14471
+ </li>
14472
+ </ul>
14473
+ </div>
14474
+ </td>
14475
+ </tr>
14476
+ <tr class="pf-v5-c-table__tr" role="row">
14477
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14478
+ <div class="pf-v5-c-table__tree-view-main">
14479
+ <div class="pf-v5-c-table__tree-view-text">
14480
+ <span
14481
+ class="pf-v5-c-table__text"
14482
+ id="tree-table-indent-example-node-4"
14483
+ >Level 1, leaf 4</span>
14484
+ </div>
14485
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14461
14486
  <button
14462
- class="pf-v5-c-dropdown__menu-item"
14487
+ class="pf-v5-c-button pf-m-plain"
14463
14488
  type="button"
14464
- disabled
14465
- >Disabled action</button>
14466
- </li>
14467
- <li class="pf-v5-c-divider" role="separator"></li>
14468
- <li>
14469
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14470
- </li>
14471
- </ul>
14472
- </div>
14473
- </td>
14474
- </tr>
14475
- <tr class="pf-v5-c-table__tr" role="row">
14476
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14477
- <div class="pf-v5-c-table__tree-view-main">
14478
- <div class="pf-v5-c-table__tree-view-text">
14479
- <span
14480
- class="pf-v5-c-table__text"
14481
- id="tree-table-indent-example-node-4"
14482
- >Level 1, leaf 4</span>
14489
+ aria-label="tree-table-indent-example-4--tree-table--details-toggle"
14490
+ >
14491
+ <span class="pf-v5-c-table__details-toggle-icon">
14492
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14493
+ </span>
14494
+ </button>
14495
+ </span>
14483
14496
  </div>
14484
- <span class="pf-v5-c-table__tree-view-details-toggle">
14497
+ </th>
14498
+ <td
14499
+ class="pf-v5-c-table__td"
14500
+ role="gridcell"
14501
+ data-label="Migration assessment"
14502
+ >10</td>
14503
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14504
+ <td
14505
+ class="pf-v5-c-table__td"
14506
+ role="gridcell"
14507
+ data-label="Number of Data Stores"
14508
+ >5</td>
14509
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14510
+ <div class="pf-v5-c-dropdown">
14485
14511
  <button
14486
- class="pf-v5-c-button pf-m-plain"
14512
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14513
+ id="tree-table-indent-example-4-actions-button"
14514
+ aria-expanded="false"
14487
14515
  type="button"
14488
- aria-label="tree-table-indent-example-4--tree-table--details-toggle"
14516
+ aria-label="Actions"
14489
14517
  >
14490
- <span class="pf-v5-c-table__details-toggle-icon">
14491
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14492
- </span>
14518
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14493
14519
  </button>
14494
- </span>
14495
- </div>
14496
- </th>
14497
- <td
14498
- class="pf-v5-c-table__td"
14499
- role="gridcell"
14500
- data-label="Migration assessment"
14501
- >10</td>
14502
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14503
- <td
14504
- class="pf-v5-c-table__td"
14505
- role="gridcell"
14506
- data-label="Number of Data Stores"
14507
- >5</td>
14508
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14509
- <div class="pf-v5-c-dropdown">
14510
- <button
14511
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14512
- id="tree-table-indent-example-4-actions-button"
14513
- aria-expanded="false"
14514
- type="button"
14515
- aria-label="Actions"
14516
- >
14517
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14518
- </button>
14519
- <ul
14520
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14521
- aria-labelledby="tree-table-indent-example-4-actions-button"
14522
- hidden
14523
- >
14524
- <li>
14525
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14526
- </li>
14527
- <li>
14528
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14529
- </li>
14530
- <li>
14531
- <a
14532
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14533
- href="#"
14534
- aria-disabled="true"
14535
- tabindex="-1"
14536
- >Disabled link</a>
14537
- </li>
14538
- <li>
14520
+ <ul
14521
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14522
+ aria-labelledby="tree-table-indent-example-4-actions-button"
14523
+ hidden
14524
+ >
14525
+ <li>
14526
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14527
+ </li>
14528
+ <li>
14529
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14530
+ </li>
14531
+ <li>
14532
+ <a
14533
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14534
+ href="#"
14535
+ aria-disabled="true"
14536
+ tabindex="-1"
14537
+ >Disabled link</a>
14538
+ </li>
14539
+ <li>
14540
+ <button
14541
+ class="pf-v5-c-dropdown__menu-item"
14542
+ type="button"
14543
+ disabled
14544
+ >Disabled action</button>
14545
+ </li>
14546
+ <li class="pf-v5-c-divider" role="separator"></li>
14547
+ <li>
14548
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14549
+ </li>
14550
+ </ul>
14551
+ </div>
14552
+ </td>
14553
+ </tr>
14554
+ <tr class="pf-v5-c-table__tr" role="row">
14555
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14556
+ <div class="pf-v5-c-table__tree-view-main">
14557
+ <div class="pf-v5-c-table__tree-view-text">
14558
+ <span
14559
+ class="pf-v5-c-table__text"
14560
+ id="tree-table-indent-example-node-5"
14561
+ >Level 1, leaf 5</span>
14562
+ </div>
14563
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14539
14564
  <button
14540
- class="pf-v5-c-dropdown__menu-item"
14565
+ class="pf-v5-c-button pf-m-plain"
14541
14566
  type="button"
14542
- disabled
14543
- >Disabled action</button>
14544
- </li>
14545
- <li class="pf-v5-c-divider" role="separator"></li>
14546
- <li>
14547
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14548
- </li>
14549
- </ul>
14550
- </div>
14551
- </td>
14552
- </tr>
14553
- <tr class="pf-v5-c-table__tr" role="row">
14554
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14555
- <div class="pf-v5-c-table__tree-view-main">
14556
- <div class="pf-v5-c-table__tree-view-text">
14557
- <span
14558
- class="pf-v5-c-table__text"
14559
- id="tree-table-indent-example-node-5"
14560
- >Level 1, leaf 5</span>
14567
+ aria-label="tree-table-indent-example-5--tree-table--details-toggle"
14568
+ >
14569
+ <span class="pf-v5-c-table__details-toggle-icon">
14570
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14571
+ </span>
14572
+ </button>
14573
+ </span>
14561
14574
  </div>
14562
- <span class="pf-v5-c-table__tree-view-details-toggle">
14575
+ </th>
14576
+ <td
14577
+ class="pf-v5-c-table__td"
14578
+ role="gridcell"
14579
+ data-label="Migration assessment"
14580
+ >10</td>
14581
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14582
+ <td
14583
+ class="pf-v5-c-table__td"
14584
+ role="gridcell"
14585
+ data-label="Number of Data Stores"
14586
+ >5</td>
14587
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14588
+ <div class="pf-v5-c-dropdown">
14563
14589
  <button
14564
- class="pf-v5-c-button pf-m-plain"
14590
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14591
+ id="tree-table-indent-example-5-actions-button"
14592
+ aria-expanded="false"
14565
14593
  type="button"
14566
- aria-label="tree-table-indent-example-5--tree-table--details-toggle"
14594
+ aria-label="Actions"
14567
14595
  >
14568
- <span class="pf-v5-c-table__details-toggle-icon">
14569
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14570
- </span>
14596
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14571
14597
  </button>
14572
- </span>
14573
- </div>
14574
- </th>
14575
- <td
14576
- class="pf-v5-c-table__td"
14577
- role="gridcell"
14578
- data-label="Migration assessment"
14579
- >10</td>
14580
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14581
- <td
14582
- class="pf-v5-c-table__td"
14583
- role="gridcell"
14584
- data-label="Number of Data Stores"
14585
- >5</td>
14586
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14587
- <div class="pf-v5-c-dropdown">
14588
- <button
14589
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14590
- id="tree-table-indent-example-5-actions-button"
14591
- aria-expanded="false"
14592
- type="button"
14593
- aria-label="Actions"
14594
- >
14595
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14596
- </button>
14597
- <ul
14598
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14599
- aria-labelledby="tree-table-indent-example-5-actions-button"
14600
- hidden
14601
- >
14602
- <li>
14603
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14604
- </li>
14605
- <li>
14606
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14607
- </li>
14608
- <li>
14609
- <a
14610
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14611
- href="#"
14612
- aria-disabled="true"
14613
- tabindex="-1"
14614
- >Disabled link</a>
14615
- </li>
14616
- <li>
14598
+ <ul
14599
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14600
+ aria-labelledby="tree-table-indent-example-5-actions-button"
14601
+ hidden
14602
+ >
14603
+ <li>
14604
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14605
+ </li>
14606
+ <li>
14607
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14608
+ </li>
14609
+ <li>
14610
+ <a
14611
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14612
+ href="#"
14613
+ aria-disabled="true"
14614
+ tabindex="-1"
14615
+ >Disabled link</a>
14616
+ </li>
14617
+ <li>
14618
+ <button
14619
+ class="pf-v5-c-dropdown__menu-item"
14620
+ type="button"
14621
+ disabled
14622
+ >Disabled action</button>
14623
+ </li>
14624
+ <li class="pf-v5-c-divider" role="separator"></li>
14625
+ <li>
14626
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14627
+ </li>
14628
+ </ul>
14629
+ </div>
14630
+ </td>
14631
+ </tr>
14632
+ <tr class="pf-v5-c-table__tr" role="row">
14633
+ <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14634
+ <div class="pf-v5-c-table__tree-view-main">
14635
+ <div class="pf-v5-c-table__tree-view-text">
14636
+ <span
14637
+ class="pf-v5-c-table__text"
14638
+ id="tree-table-indent-example-node-6"
14639
+ >Level 1, leaf 6</span>
14640
+ </div>
14641
+ <span class="pf-v5-c-table__tree-view-details-toggle">
14617
14642
  <button
14618
- class="pf-v5-c-dropdown__menu-item"
14643
+ class="pf-v5-c-button pf-m-plain"
14619
14644
  type="button"
14620
- disabled
14621
- >Disabled action</button>
14622
- </li>
14623
- <li class="pf-v5-c-divider" role="separator"></li>
14624
- <li>
14625
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14626
- </li>
14627
- </ul>
14628
- </div>
14629
- </td>
14630
- </tr>
14631
- <tr class="pf-v5-c-table__tr" role="row">
14632
- <th class="pf-v5-c-table__th pf-v5-c-table__tree-view-title-cell">
14633
- <div class="pf-v5-c-table__tree-view-main">
14634
- <div class="pf-v5-c-table__tree-view-text">
14635
- <span
14636
- class="pf-v5-c-table__text"
14637
- id="tree-table-indent-example-node-6"
14638
- >Level 1, leaf 6</span>
14645
+ aria-label="tree-table-indent-example-6--tree-table--details-toggle"
14646
+ >
14647
+ <span class="pf-v5-c-table__details-toggle-icon">
14648
+ <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14649
+ </span>
14650
+ </button>
14651
+ </span>
14639
14652
  </div>
14640
- <span class="pf-v5-c-table__tree-view-details-toggle">
14653
+ </th>
14654
+ <td
14655
+ class="pf-v5-c-table__td"
14656
+ role="gridcell"
14657
+ data-label="Migration assessment"
14658
+ >10</td>
14659
+ <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14660
+ <td
14661
+ class="pf-v5-c-table__td"
14662
+ role="gridcell"
14663
+ data-label="Number of Data Stores"
14664
+ >5</td>
14665
+ <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14666
+ <div class="pf-v5-c-dropdown">
14641
14667
  <button
14642
- class="pf-v5-c-button pf-m-plain"
14668
+ class="pf-v5-c-dropdown__toggle pf-m-plain"
14669
+ id="tree-table-indent-example-6-actions-button"
14670
+ aria-expanded="false"
14643
14671
  type="button"
14644
- aria-label="tree-table-indent-example-6--tree-table--details-toggle"
14672
+ aria-label="Actions"
14645
14673
  >
14646
- <span class="pf-v5-c-table__details-toggle-icon">
14647
- <i class="fas fa-ellipsis-h" aria-hidden="true"></i>
14648
- </span>
14674
+ <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14649
14675
  </button>
14650
- </span>
14651
- </div>
14652
- </th>
14653
- <td
14654
- class="pf-v5-c-table__td"
14655
- role="gridcell"
14656
- data-label="Migration assessment"
14657
- >10</td>
14658
- <td class="pf-v5-c-table__td" role="gridcell" data-label="Size of VM">25</td>
14659
- <td
14660
- class="pf-v5-c-table__td"
14661
- role="gridcell"
14662
- data-label="Number of Data Stores"
14663
- >5</td>
14664
- <td class="pf-v5-c-table__td pf-v5-c-table__action" role="gridcell">
14665
- <div class="pf-v5-c-dropdown">
14666
- <button
14667
- class="pf-v5-c-dropdown__toggle pf-m-plain"
14668
- id="tree-table-indent-example-6-actions-button"
14669
- aria-expanded="false"
14670
- type="button"
14671
- aria-label="Actions"
14672
- >
14673
- <i class="fas fa-ellipsis-v" aria-hidden="true"></i>
14674
- </button>
14675
- <ul
14676
- class="pf-v5-c-dropdown__menu pf-m-align-right"
14677
- aria-labelledby="tree-table-indent-example-6-actions-button"
14678
- hidden
14679
- >
14680
- <li>
14681
- <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14682
- </li>
14683
- <li>
14684
- <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14685
- </li>
14686
- <li>
14687
- <a
14688
- class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14689
- href="#"
14690
- aria-disabled="true"
14691
- tabindex="-1"
14692
- >Disabled link</a>
14693
- </li>
14694
- <li>
14695
- <button
14696
- class="pf-v5-c-dropdown__menu-item"
14697
- type="button"
14698
- disabled
14699
- >Disabled action</button>
14700
- </li>
14701
- <li class="pf-v5-c-divider" role="separator"></li>
14702
- <li>
14703
- <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14704
- </li>
14705
- </ul>
14706
- </div>
14707
- </td>
14708
- </tr>
14676
+ <ul
14677
+ class="pf-v5-c-dropdown__menu pf-m-align-right"
14678
+ aria-labelledby="tree-table-indent-example-6-actions-button"
14679
+ hidden
14680
+ >
14681
+ <li>
14682
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Link</a>
14683
+ </li>
14684
+ <li>
14685
+ <button class="pf-v5-c-dropdown__menu-item" type="button">Action</button>
14686
+ </li>
14687
+ <li>
14688
+ <a
14689
+ class="pf-v5-c-dropdown__menu-item pf-m-disabled"
14690
+ href="#"
14691
+ aria-disabled="true"
14692
+ tabindex="-1"
14693
+ >Disabled link</a>
14694
+ </li>
14695
+ <li>
14696
+ <button
14697
+ class="pf-v5-c-dropdown__menu-item"
14698
+ type="button"
14699
+ disabled
14700
+ >Disabled action</button>
14701
+ </li>
14702
+ <li class="pf-v5-c-divider" role="separator"></li>
14703
+ <li>
14704
+ <a class="pf-v5-c-dropdown__menu-item" href="#">Separated link</a>
14705
+ </li>
14706
+ </ul>
14707
+ </div>
14708
+ </td>
14709
+ </tr>
14710
+ </tbody>
14709
14711
  </table>
14710
14712
 
14711
14713
  ```