@patternfly/patternfly 5.0.0-alpha.54 → 5.0.0-alpha.56

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.
@@ -1400,18 +1400,24 @@ wrapperTag: div
1400
1400
  aria-label="Control panel table"
1401
1401
  id="status-card-expanded-with-popover-example-popover-table"
1402
1402
  >
1403
- <thead>
1404
- <tr>
1405
- <td role="cell"></td>
1406
-
1407
- <th scope="col">Components</th>
1408
- <th class="pf-m-fit-content" scope="col">Response rate</th>
1403
+ <thead class="pf-v5-c-table__thead">
1404
+ <tr class="pf-v5-c-table__tr">
1405
+ <td class="pf-v5-c-table__td" role="cell"></td>
1406
+
1407
+ <th class="pf-v5-c-table__th" scope="col">Components</th>
1408
+ <th
1409
+ class="pf-v5-c-table__th pf-m-fit-content"
1410
+ scope="col"
1411
+ >Response rate</th>
1409
1412
  </tr>
1410
1413
  </thead>
1411
1414
 
1412
- <tbody class="pf-m-expanded">
1413
- <tr>
1414
- <td class="pf-v5-c-table__toggle" role="cell">
1415
+ <tbody class="pf-v5-c-table__tbody pf-m-expanded">
1416
+ <tr class="pf-v5-c-table__tr">
1417
+ <td
1418
+ class="pf-v5-c-table__td pf-v5-c-table__toggle"
1419
+ role="cell"
1420
+ >
1415
1421
  <button
1416
1422
  class="pf-v5-c-button pf-m-plain pf-m-expanded"
1417
1423
  aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle1"
@@ -1427,14 +1433,18 @@ wrapperTag: div
1427
1433
  </td>
1428
1434
 
1429
1435
  <td
1430
- class
1436
+ class="pf-v5-c-table__td"
1431
1437
  role="cell"
1432
1438
  id="{{table--id}}-node1"
1433
1439
  data-label="Branches"
1434
1440
  >
1435
1441
  <span class="pf-v5-c-table__text">API Servers</span>
1436
1442
  </td>
1437
- <td role="cell" data-label="Pull requests">
1443
+ <td
1444
+ class="pf-v5-c-table__td"
1445
+ role="cell"
1446
+ data-label="Pull requests"
1447
+ >
1438
1448
  <span class="pf-v5-c-table__text">
1439
1449
  20%&nbsp;
1440
1450
  <i
@@ -1445,9 +1455,11 @@ wrapperTag: div
1445
1455
  </td>
1446
1456
  </tr>
1447
1457
 
1448
- <tr class="pf-v5-c-table__expandable-row pf-m-expanded">
1458
+ <tr
1459
+ class="pf-v5-c-table__tr pf-v5-c-table__expandable-row pf-m-expanded"
1460
+ >
1449
1461
  <td
1450
- class
1462
+ class="pf-v5-c-table__td"
1451
1463
  role="cell"
1452
1464
  colspan="3"
1453
1465
  id="status-card-expanded-with-popover-example-popover-table-content1"
@@ -1475,9 +1487,12 @@ wrapperTag: div
1475
1487
  </tr>
1476
1488
  </tbody>
1477
1489
 
1478
- <tbody>
1479
- <tr>
1480
- <td class="pf-v5-c-table__toggle" role="cell">
1490
+ <tbody class="pf-v5-c-table__tbody">
1491
+ <tr class="pf-v5-c-table__tr">
1492
+ <td
1493
+ class="pf-v5-c-table__td pf-v5-c-table__toggle"
1494
+ role="cell"
1495
+ >
1481
1496
  <button
1482
1497
  class="pf-v5-c-button pf-m-plain"
1483
1498
  aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle2"
@@ -1492,7 +1507,7 @@ wrapperTag: div
1492
1507
  </td>
1493
1508
 
1494
1509
  <td
1495
- class
1510
+ class="pf-v5-c-table__td"
1496
1511
  role="cell"
1497
1512
  id="{{table--id}}-node2"
1498
1513
  data-label="Branches"
@@ -1501,7 +1516,11 @@ wrapperTag: div
1501
1516
  class="pf-v5-c-table__text"
1502
1517
  >Controller Managers</span>
1503
1518
  </td>
1504
- <td role="cell" data-label="Pull requests">
1519
+ <td
1520
+ class="pf-v5-c-table__td"
1521
+ role="cell"
1522
+ data-label="Pull requests"
1523
+ >
1505
1524
  <span class="pf-v5-c-table__text">
1506
1525
  100%&nbsp;
1507
1526
  <i
@@ -1512,9 +1531,11 @@ wrapperTag: div
1512
1531
  </td>
1513
1532
  </tr>
1514
1533
 
1515
- <tr class="pf-v5-c-table__expandable-row">
1534
+ <tr
1535
+ class="pf-v5-c-table__tr pf-v5-c-table__expandable-row"
1536
+ >
1516
1537
  <td
1517
- class
1538
+ class="pf-v5-c-table__td"
1518
1539
  role="cell"
1519
1540
  colspan="3"
1520
1541
  id="status-card-expanded-with-popover-example-popover-table-content2"
@@ -1526,9 +1547,12 @@ wrapperTag: div
1526
1547
  </tr>
1527
1548
  </tbody>
1528
1549
 
1529
- <tbody>
1530
- <tr>
1531
- <td class="pf-v5-c-table__toggle" role="cell">
1550
+ <tbody class="pf-v5-c-table__tbody">
1551
+ <tr class="pf-v5-c-table__tr">
1552
+ <td
1553
+ class="pf-v5-c-table__td pf-v5-c-table__toggle"
1554
+ role="cell"
1555
+ >
1532
1556
  <button
1533
1557
  class="pf-v5-c-button pf-m-plain"
1534
1558
  aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle3"
@@ -1543,14 +1567,18 @@ wrapperTag: div
1543
1567
  </td>
1544
1568
 
1545
1569
  <td
1546
- class
1570
+ class="pf-v5-c-table__td"
1547
1571
  role="cell"
1548
1572
  id="{{table--id}}-node3"
1549
1573
  data-label="Branches"
1550
1574
  >
1551
1575
  <span class="pf-v5-c-table__text">Schedulers</span>
1552
1576
  </td>
1553
- <td role="cell" data-label="Pull requests">
1577
+ <td
1578
+ class="pf-v5-c-table__td"
1579
+ role="cell"
1580
+ data-label="Pull requests"
1581
+ >
1554
1582
  <span class="pf-v5-c-table__text">
1555
1583
  100%&nbsp;
1556
1584
  <i
@@ -1561,9 +1589,11 @@ wrapperTag: div
1561
1589
  </td>
1562
1590
  </tr>
1563
1591
 
1564
- <tr class="pf-v5-c-table__expandable-row">
1592
+ <tr
1593
+ class="pf-v5-c-table__tr pf-v5-c-table__expandable-row"
1594
+ >
1565
1595
  <td
1566
- class
1596
+ class="pf-v5-c-table__td"
1567
1597
  role="cell"
1568
1598
  colspan="3"
1569
1599
  id="status-card-expanded-with-popover-example-popover-table-content3"
@@ -1575,9 +1605,12 @@ wrapperTag: div
1575
1605
  </tr>
1576
1606
  </tbody>
1577
1607
 
1578
- <tbody>
1579
- <tr>
1580
- <td class="pf-v5-c-table__toggle" role="cell">
1608
+ <tbody class="pf-v5-c-table__tbody">
1609
+ <tr class="pf-v5-c-table__tr">
1610
+ <td
1611
+ class="pf-v5-c-table__td pf-v5-c-table__toggle"
1612
+ role="cell"
1613
+ >
1581
1614
  <button
1582
1615
  class="pf-v5-c-button pf-m-plain"
1583
1616
  aria-labelledby="status-card-expanded-with-popover-example-popover-table-node1 expandable-toggle4"
@@ -1592,14 +1625,18 @@ wrapperTag: div
1592
1625
  </td>
1593
1626
 
1594
1627
  <td
1595
- class
1628
+ class="pf-v5-c-table__td"
1596
1629
  role="cell"
1597
1630
  id="{{table--id}}-node4"
1598
1631
  data-label="Branches"
1599
1632
  >
1600
1633
  <span class="pf-v5-c-table__text">etcd</span>
1601
1634
  </td>
1602
- <td role="cell" data-label="Pull requests">
1635
+ <td
1636
+ class="pf-v5-c-table__td"
1637
+ role="cell"
1638
+ data-label="Pull requests"
1639
+ >
1603
1640
  <span class="pf-v5-c-table__text">
1604
1641
  91%&nbsp;
1605
1642
  <i
@@ -1610,9 +1647,11 @@ wrapperTag: div
1610
1647
  </td>
1611
1648
  </tr>
1612
1649
 
1613
- <tr class="pf-v5-c-table__expandable-row">
1650
+ <tr
1651
+ class="pf-v5-c-table__tr pf-v5-c-table__expandable-row"
1652
+ >
1614
1653
  <td
1615
- class
1654
+ class="pf-v5-c-table__td"
1616
1655
  role="cell"
1617
1656
  colspan="3"
1618
1657
  id="status-card-expanded-with-popover-example-popover-table-content4"
@@ -4519,9 +4519,12 @@ wrapperTag: div
4519
4519
  aria-label="This is a compact table example"
4520
4520
  id="compact-table-demo-data-list"
4521
4521
  >
4522
- <thead>
4523
- <tr role="row">
4524
- <td class="pf-v5-c-table__check" role="cell">
4522
+ <thead class="pf-v5-c-table__thead">
4523
+ <tr class="pf-v5-c-table__tr" role="row">
4524
+ <td
4525
+ class="pf-v5-c-table__td pf-v5-c-table__check"
4526
+ role="cell"
4527
+ >
4525
4528
  <div class="pf-v5-c-check pf-m-standalone">
4526
4529
  <input
4527
4530
  class="pf-v5-c-check__input"
@@ -4531,23 +4534,46 @@ wrapperTag: div
4531
4534
  />
4532
4535
  </div>
4533
4536
  </td>
4534
- <th role="columnheader" scope="col">Contributor</th>
4535
- <th role="columnheader" scope="col">Position</th>
4536
- <th role="columnheader" scope="col">Location</th>
4537
- <th role="columnheader" scope="col">Last seen</th>
4538
- <th role="columnheader" scope="col">Numbers</th>
4539
4537
  <th
4540
- class="pf-v5-c-table__icon"
4538
+ class="pf-v5-c-table__th"
4539
+ role="columnheader"
4540
+ scope="col"
4541
+ >Contributor</th>
4542
+ <th
4543
+ class="pf-v5-c-table__th"
4544
+ role="columnheader"
4545
+ scope="col"
4546
+ >Position</th>
4547
+ <th
4548
+ class="pf-v5-c-table__th"
4549
+ role="columnheader"
4550
+ scope="col"
4551
+ >Location</th>
4552
+ <th
4553
+ class="pf-v5-c-table__th"
4554
+ role="columnheader"
4555
+ scope="col"
4556
+ >Last seen</th>
4557
+ <th
4558
+ class="pf-v5-c-table__th"
4559
+ role="columnheader"
4560
+ scope="col"
4561
+ >Numbers</th>
4562
+ <th
4563
+ class="pf-v5-c-table__th pf-v5-c-table__icon"
4541
4564
  role="columnheader"
4542
4565
  scope="col"
4543
4566
  >Icons</th>
4544
- <td></td>
4545
- <td></td>
4567
+ <td class="pf-v5-c-table__td"></td>
4568
+ <td class="pf-v5-c-table__td"></td>
4546
4569
  </tr>
4547
4570
  </thead>
4548
- <tbody role="rowgroup">
4549
- <tr role="row">
4550
- <td class="pf-v5-c-table__check" role="cell">
4571
+ <tbody class="pf-v5-c-table__tbody" role="rowgroup">
4572
+ <tr class="pf-v5-c-table__tr" role="row">
4573
+ <td
4574
+ class="pf-v5-c-table__td pf-v5-c-table__check"
4575
+ role="cell"
4576
+ >
4551
4577
  <div class="pf-v5-c-check pf-m-standalone">
4552
4578
  <input
4553
4579
  class="pf-v5-c-check__input"
@@ -4557,24 +4583,51 @@ wrapperTag: div
4557
4583
  />
4558
4584
  </div>
4559
4585
  </td>
4560
- <td role="cell" data-label="Contributor">
4586
+ <td
4587
+ class="pf-v5-c-table__td"
4588
+ role="cell"
4589
+ data-label="Contributor"
4590
+ >
4561
4591
  <span id="compact-table-demo-data-list-name1">Sam Jones</span>
4562
4592
  </td>
4563
- <td role="cell" data-label="Position">CSS guru</td>
4564
- <td role="cell" data-label="Location">Not too sure</td>
4565
- <td role="cell" data-label="Last seen">May 9, 2018</td>
4566
- <td role="cell" data-label="Numbers">0556</td>
4567
4593
  <td
4568
- class="pf-v5-c-table__icon"
4594
+ class="pf-v5-c-table__td"
4595
+ role="cell"
4596
+ data-label="Position"
4597
+ >CSS guru</td>
4598
+ <td
4599
+ class="pf-v5-c-table__td"
4600
+ role="cell"
4601
+ data-label="Location"
4602
+ >Not too sure</td>
4603
+ <td
4604
+ class="pf-v5-c-table__td"
4605
+ role="cell"
4606
+ data-label="Last seen"
4607
+ >May 9, 2018</td>
4608
+ <td
4609
+ class="pf-v5-c-table__td"
4610
+ role="cell"
4611
+ data-label="Numbers"
4612
+ >0556</td>
4613
+ <td
4614
+ class="pf-v5-c-table__td pf-v5-c-table__icon"
4569
4615
  role="cell"
4570
4616
  data-label="Icon"
4571
4617
  >
4572
4618
  <i class="fas fa-check"></i>
4573
4619
  </td>
4574
- <td role="cell" data-label="Action">
4620
+ <td
4621
+ class="pf-v5-c-table__td"
4622
+ role="cell"
4623
+ data-label="Action"
4624
+ >
4575
4625
  <a href="#">Action link</a>
4576
4626
  </td>
4577
- <td class="pf-v5-c-table__action" role="cell">
4627
+ <td
4628
+ class="pf-v5-c-table__td pf-v5-c-table__action"
4629
+ role="cell"
4630
+ >
4578
4631
  <div class="pf-v5-c-dropdown">
4579
4632
  <button
4580
4633
  class="pf-v5-c-dropdown__toggle pf-m-plain"
@@ -4628,8 +4681,11 @@ wrapperTag: div
4628
4681
  </div>
4629
4682
  </td>
4630
4683
  </tr>
4631
- <tr role="row">
4632
- <td class="pf-v5-c-table__check" role="cell">
4684
+ <tr class="pf-v5-c-table__tr" role="row">
4685
+ <td
4686
+ class="pf-v5-c-table__td pf-v5-c-table__check"
4687
+ role="cell"
4688
+ >
4633
4689
  <div class="pf-v5-c-check pf-m-standalone">
4634
4690
  <input
4635
4691
  class="pf-v5-c-check__input"
@@ -4639,24 +4695,51 @@ wrapperTag: div
4639
4695
  />
4640
4696
  </div>
4641
4697
  </td>
4642
- <th role="columnheader" data-label="Contributor">
4698
+ <th
4699
+ class="pf-v5-c-table__th"
4700
+ role="columnheader"
4701
+ data-label="Contributor"
4702
+ >
4643
4703
  <span id="compact-table-demo-data-list-name2">Amy Miller</span>
4644
4704
  </th>
4645
- <td role="cell" data-label="Position">Visual design</td>
4646
- <td role="cell" data-label="Location">Raleigh</td>
4647
- <td role="cell" data-label="Last seen">May 9, 2018</td>
4648
- <td role="cell" data-label="Numbers">9492</td>
4649
4705
  <td
4650
- class="pf-v5-c-table__icon"
4706
+ class="pf-v5-c-table__td"
4707
+ role="cell"
4708
+ data-label="Position"
4709
+ >Visual design</td>
4710
+ <td
4711
+ class="pf-v5-c-table__td"
4712
+ role="cell"
4713
+ data-label="Location"
4714
+ >Raleigh</td>
4715
+ <td
4716
+ class="pf-v5-c-table__td"
4717
+ role="cell"
4718
+ data-label="Last seen"
4719
+ >May 9, 2018</td>
4720
+ <td
4721
+ class="pf-v5-c-table__td"
4722
+ role="cell"
4723
+ data-label="Numbers"
4724
+ >9492</td>
4725
+ <td
4726
+ class="pf-v5-c-table__td pf-v5-c-table__icon"
4651
4727
  role="cell"
4652
4728
  data-label="Icon"
4653
4729
  >
4654
4730
  <i class="fas fa-check"></i>
4655
4731
  </td>
4656
- <td role="cell" data-label="Action">
4732
+ <td
4733
+ class="pf-v5-c-table__td"
4734
+ role="cell"
4735
+ data-label="Action"
4736
+ >
4657
4737
  <a href="#">Action link</a>
4658
4738
  </td>
4659
- <td class="pf-v5-c-table__action" role="cell">
4739
+ <td
4740
+ class="pf-v5-c-table__td pf-v5-c-table__action"
4741
+ role="cell"
4742
+ >
4660
4743
  <div class="pf-v5-c-dropdown">
4661
4744
  <button
4662
4745
  class="pf-v5-c-dropdown__toggle pf-m-plain"
@@ -4710,8 +4793,11 @@ wrapperTag: div
4710
4793
  </div>
4711
4794
  </td>
4712
4795
  </tr>
4713
- <tr role="row">
4714
- <td class="pf-v5-c-table__check" role="cell">
4796
+ <tr class="pf-v5-c-table__tr" role="row">
4797
+ <td
4798
+ class="pf-v5-c-table__td pf-v5-c-table__check"
4799
+ role="cell"
4800
+ >
4715
4801
  <div class="pf-v5-c-check pf-m-standalone">
4716
4802
  <input
4717
4803
  class="pf-v5-c-check__input"
@@ -4721,30 +4807,53 @@ wrapperTag: div
4721
4807
  />
4722
4808
  </div>
4723
4809
  </td>
4724
- <th role="columnheader" data-label="Contributor">
4810
+ <th
4811
+ class="pf-v5-c-table__th"
4812
+ role="columnheader"
4813
+ data-label="Contributor"
4814
+ >
4725
4815
  <span
4726
4816
  id="compact-table-demo-data-list-name3"
4727
4817
  >Steve Wilson</span>
4728
4818
  </th>
4729
4819
  <td
4730
- class
4820
+ class="pf-v5-c-table__td"
4731
4821
  role="cell"
4732
4822
  data-label="Position"
4733
4823
  >Visual design lead</td>
4734
- <td role="cell" data-label="Location">Westford</td>
4735
- <td role="cell" data-label="Last seen">May 9, 2018</td>
4736
- <td role="cell" data-label="Numbers">9929</td>
4737
4824
  <td
4738
- class="pf-v5-c-table__icon"
4825
+ class="pf-v5-c-table__td"
4826
+ role="cell"
4827
+ data-label="Location"
4828
+ >Westford</td>
4829
+ <td
4830
+ class="pf-v5-c-table__td"
4831
+ role="cell"
4832
+ data-label="Last seen"
4833
+ >May 9, 2018</td>
4834
+ <td
4835
+ class="pf-v5-c-table__td"
4836
+ role="cell"
4837
+ data-label="Numbers"
4838
+ >9929</td>
4839
+ <td
4840
+ class="pf-v5-c-table__td pf-v5-c-table__icon"
4739
4841
  role="cell"
4740
4842
  data-label="Icon"
4741
4843
  >
4742
4844
  <i class="fas fa-check"></i>
4743
4845
  </td>
4744
- <td role="cell" data-label="Action">
4846
+ <td
4847
+ class="pf-v5-c-table__td"
4848
+ role="cell"
4849
+ data-label="Action"
4850
+ >
4745
4851
  <a href="#">Action link</a>
4746
4852
  </td>
4747
- <td class="pf-v5-c-table__action" role="cell">
4853
+ <td
4854
+ class="pf-v5-c-table__td pf-v5-c-table__action"
4855
+ role="cell"
4856
+ >
4748
4857
  <div class="pf-v5-c-dropdown">
4749
4858
  <button
4750
4859
  class="pf-v5-c-dropdown__toggle pf-m-plain"
@@ -4798,8 +4907,11 @@ wrapperTag: div
4798
4907
  </div>
4799
4908
  </td>
4800
4909
  </tr>
4801
- <tr role="row">
4802
- <td class="pf-v5-c-table__check" role="cell">
4910
+ <tr class="pf-v5-c-table__tr" role="row">
4911
+ <td
4912
+ class="pf-v5-c-table__td pf-v5-c-table__check"
4913
+ role="cell"
4914
+ >
4803
4915
  <div class="pf-v5-c-check pf-m-standalone">
4804
4916
  <input
4805
4917
  class="pf-v5-c-check__input"
@@ -4809,30 +4921,53 @@ wrapperTag: div
4809
4921
  />
4810
4922
  </div>
4811
4923
  </td>
4812
- <td role="cell" data-label="Contributor name">
4924
+ <td
4925
+ class="pf-v5-c-table__td"
4926
+ role="cell"
4927
+ data-label="Contributor name"
4928
+ >
4813
4929
  <span
4814
4930
  id="compact-table-demo-data-list-name4"
4815
4931
  >Emma Jackson</span>
4816
4932
  </td>
4817
4933
  <td
4818
- class
4934
+ class="pf-v5-c-table__td"
4819
4935
  role="cell"
4820
4936
  data-label="Position"
4821
4937
  >Interaction design</td>
4822
- <td role="cell" data-label="Location">Westford</td>
4823
- <td role="cell" data-label="Workspaces">May 9, 2018</td>
4824
- <td role="cell" data-label="Last commit">2217</td>
4825
4938
  <td
4826
- class="pf-v5-c-table__icon"
4939
+ class="pf-v5-c-table__td"
4940
+ role="cell"
4941
+ data-label="Location"
4942
+ >Westford</td>
4943
+ <td
4944
+ class="pf-v5-c-table__td"
4945
+ role="cell"
4946
+ data-label="Workspaces"
4947
+ >May 9, 2018</td>
4948
+ <td
4949
+ class="pf-v5-c-table__td"
4950
+ role="cell"
4951
+ data-label="Last commit"
4952
+ >2217</td>
4953
+ <td
4954
+ class="pf-v5-c-table__td pf-v5-c-table__icon"
4827
4955
  role="cell"
4828
4956
  data-label="Icon"
4829
4957
  >
4830
4958
  <i class="fas fa-check"></i>
4831
4959
  </td>
4832
- <td role="cell" data-label="Action">
4960
+ <td
4961
+ class="pf-v5-c-table__td"
4962
+ role="cell"
4963
+ data-label="Action"
4964
+ >
4833
4965
  <a href="#">Action link</a>
4834
4966
  </td>
4835
- <td class="pf-v5-c-table__action" role="cell">
4967
+ <td
4968
+ class="pf-v5-c-table__td pf-v5-c-table__action"
4969
+ role="cell"
4970
+ >
4836
4971
  <div class="pf-v5-c-dropdown">
4837
4972
  <button
4838
4973
  class="pf-v5-c-dropdown__toggle pf-m-plain"