@patternfly/react-core 4.202.34 → 4.202.37

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 (44) hide show
  1. package/CHANGELOG.md +24 -0
  2. package/dist/esm/components/Brand/Brand.d.ts +23 -3
  3. package/dist/esm/components/Brand/Brand.d.ts.map +1 -1
  4. package/dist/esm/components/Brand/Brand.js +12 -2
  5. package/dist/esm/components/Brand/Brand.js.map +1 -1
  6. package/dist/esm/components/Tabs/Tabs.d.ts +2 -0
  7. package/dist/esm/components/Tabs/Tabs.d.ts.map +1 -1
  8. package/dist/esm/components/Tabs/Tabs.js +3 -2
  9. package/dist/esm/components/Tabs/Tabs.js.map +1 -1
  10. package/dist/js/components/Brand/Brand.d.ts +23 -3
  11. package/dist/js/components/Brand/Brand.d.ts.map +1 -1
  12. package/dist/js/components/Brand/Brand.js +12 -2
  13. package/dist/js/components/Brand/Brand.js.map +1 -1
  14. package/dist/js/components/Tabs/Tabs.d.ts +2 -0
  15. package/dist/js/components/Tabs/Tabs.d.ts.map +1 -1
  16. package/dist/js/components/Tabs/Tabs.js +3 -2
  17. package/dist/js/components/Tabs/Tabs.js.map +1 -1
  18. package/dist/umd/react-core.css +115 -35
  19. package/dist/umd/react-core.js +145 -123
  20. package/dist/umd/react-core.min.css +80 -0
  21. package/dist/umd/react-core.min.js +4 -4
  22. package/package.json +6 -6
  23. package/src/components/Brand/Brand.tsx +61 -8
  24. package/src/components/Brand/__tests__/Brand.test.tsx +15 -4
  25. package/src/components/Brand/__tests__/__snapshots__/Brand.test.tsx.snap +1 -1
  26. package/src/components/Brand/examples/Brand.md +13 -0
  27. package/src/components/Brand/examples/BrandResponsive.tsx +18 -0
  28. package/src/components/Brand/examples/pf-c-brand--logo-base.jpg +0 -0
  29. package/src/components/Brand/examples/pf-c-brand--logo-on-lg.svg +32 -0
  30. package/src/components/Brand/examples/pf-c-brand--logo-on-md.svg +42 -0
  31. package/src/components/Brand/examples/pf-c-brand--logo-on-sm.svg +17 -0
  32. package/src/components/Brand/examples/pf-c-brand--logo-on-xl.svg +39 -0
  33. package/src/components/Brand/examples/pf-c-brand--logo.svg +10 -0
  34. package/src/components/Tabs/Tabs.tsx +5 -0
  35. package/src/components/Tabs/__tests__/Tabs.test.tsx +17 -0
  36. package/src/components/Tabs/__tests__/__snapshots__/Tabs.test.tsx.snap +153 -0
  37. package/src/components/TextInputGroup/__tests__/TextInputGroup.test.tsx +47 -146
  38. package/src/components/TextInputGroup/__tests__/TextInputGroupMain.test.tsx +302 -0
  39. package/src/components/TextInputGroup/__tests__/TextInputGroupUtilities.test.tsx +34 -0
  40. package/src/components/TextInputGroup/__tests__/__snapshots__/TextInputGroup.test.tsx.snap +2 -203
  41. package/src/components/TextInputGroup/__tests__/__snapshots__/TextInputGroupMain.test.tsx.snap +21 -0
  42. package/src/components/TextInputGroup/__tests__/__snapshots__/TextInputGroupUtilities.test.tsx.snap +13 -0
  43. package/src/demos/Tabs.md +5 -0
  44. package/src/demos/examples/Tabs/TabsAndTablesAutoWidthTabs.tsx +442 -0
package/dist/umd/react-core.min.css CHANGED
@@ -773,6 +773,7 @@
773
773
  --pf-c-form-control--m-expanded--PaddingBottom: calc(var(--pf-global--spacer--form-element) - var(--pf-c-form-control--focus--BorderBottomWidth));
774
774
  --pf-c-form-control--m-expanded--BorderBottomColor: var(--pf-global--primary-color--100);
775
775
  --pf-c-form-control--placeholder--Color: var(--pf-global--Color--dark-200);
776
+ --pf-c-form-control--placeholder--child--Color: var(--pf-global--Color--100);
776
777
  --pf-c-form-control--disabled--Color: var(--pf-global--disabled-color--100);
777
778
  --pf-c-form-control--disabled--BackgroundColor: var(--pf-global--disabled-color--300);
778
779
  --pf-c-form-control--disabled--BorderColor: transparent;
@@ -1059,6 +1060,14 @@ select.pf-c-form-control.pf-m-placeholder {
1059
1060
  color: var(--pf-c-form-control--placeholder--Color);
1060
1061
  }
1061
1062
 
1063
+ select.pf-c-form-control.pf-m-placeholder * {
1064
+ color: var(--pf-c-form-control--placeholder--child--Color);
1065
+ }
1066
+
1067
+ select.pf-c-form-control.pf-m-placeholder *:disabled {
1068
+ color: revert;
1069
+ }
1070
+
1062
1071
  textarea.pf-c-form-control {
1063
1072
  --pf-c-form-control--success--BackgroundPositionY: var(--pf-c-form-control--textarea--success--BackgroundPositionY);
1064
1073
  --pf-c-form-control--invalid--BackgroundPositionY: var(--pf-c-form-control--textarea--invalid--BackgroundPositionY);
@@ -1736,6 +1745,70 @@ textarea.pf-c-form-control {
1736
1745
  cursor: not-allowed;
1737
1746
  }
1738
1747
 
1748
+ .pf-c-brand {
1749
+ --pf-c-brand--Width: auto;
1750
+ --pf-c-brand--Height: auto;
1751
+ width: var(--pf-c-brand--Width--base);
1752
+ height: var(--pf-c-brand--Height--base);
1753
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width);
1754
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height);
1755
+ }
1756
+
1757
+ @media (min-width: 576px) {
1758
+ .pf-c-brand {
1759
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width-on-sm, var(--pf-c-brand--Width));
1760
+ }
1761
+ }
1762
+ @media (min-width: 768px) {
1763
+ .pf-c-brand {
1764
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width-on-md, var(--pf-c-brand--Width-on-sm, var(--pf-c-brand--Width)));
1765
+ }
1766
+ }
1767
+ @media (min-width: 992px) {
1768
+ .pf-c-brand {
1769
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width-on-lg, var(--pf-c-brand--Width-on-md, var(--pf-c-brand--Width-on-sm, var(--pf-c-brand--Width))));
1770
+ }
1771
+ }
1772
+ @media (min-width: 1200px) {
1773
+ .pf-c-brand {
1774
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width-on-xl, var(--pf-c-brand--Width-on-lg, var(--pf-c-brand--Width-on-md, var(--pf-c-brand--Width-on-sm, var(--pf-c-brand--Width)))));
1775
+ }
1776
+ }
1777
+ @media (min-width: 1450px) {
1778
+ .pf-c-brand {
1779
+ --pf-c-brand--Width--base: var(--pf-c-brand--Width-on-2xl, var(--pf-c-brand--Width-on-xl, var(--pf-c-brand--Width-on-lg, var(--pf-c-brand--Width-on-md, var(--pf-c-brand--Width-on-sm, var(--pf-c-brand--Width))))));
1780
+ }
1781
+ }
1782
+ @media (min-width: 576px) {
1783
+ .pf-c-brand {
1784
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height-on-sm, var(--pf-c-brand--Height));
1785
+ }
1786
+ }
1787
+ @media (min-width: 768px) {
1788
+ .pf-c-brand {
1789
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height-on-md, var(--pf-c-brand--Height-on-sm, var(--pf-c-brand--Height)));
1790
+ }
1791
+ }
1792
+ @media (min-width: 992px) {
1793
+ .pf-c-brand {
1794
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height-on-lg, var(--pf-c-brand--Height-on-md, var(--pf-c-brand--Height-on-sm, var(--pf-c-brand--Height))));
1795
+ }
1796
+ }
1797
+ @media (min-width: 1200px) {
1798
+ .pf-c-brand {
1799
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height-on-xl, var(--pf-c-brand--Height-on-lg, var(--pf-c-brand--Height-on-md, var(--pf-c-brand--Height-on-sm, var(--pf-c-brand--Height)))));
1800
+ }
1801
+ }
1802
+ @media (min-width: 1450px) {
1803
+ .pf-c-brand {
1804
+ --pf-c-brand--Height--base: var(--pf-c-brand--Height-on-2xl, var(--pf-c-brand--Height-on-xl, var(--pf-c-brand--Height-on-lg, var(--pf-c-brand--Height-on-md, var(--pf-c-brand--Height-on-sm, var(--pf-c-brand--Height))))));
1805
+ }
1806
+ }
1807
+ .pf-c-brand.pf-m-picture {
1808
+ display: inline-flex;
1809
+ max-width: 100%;
1810
+ }
1811
+
1739
1812
  .pf-c-breadcrumb {
1740
1813
  --pf-c-breadcrumb__item--FontSize: var(--pf-global--FontSize--sm);
1741
1814
  --pf-c-breadcrumb__item--LineHeight: var(--pf-global--LineHeight--sm);
@@ -2651,6 +2724,7 @@ button.pf-c-breadcrumb__link {
2651
2724
  --pf-c-card--m-selectable-raised--m-selected-raised--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base);
2652
2725
  --pf-c-card--m-flat--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-flat--BorderWidth));
2653
2726
  --pf-c-card--m-rounded--m-selectable-raised--m-selected-raised--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY--base) + var(--pf-c-card--m-rounded--BorderRadius));
2727
+ --pf-c-card--m-selectable-raised--m-selected-raised--ZIndex: var(--pf-global--ZIndex--xs);
2654
2728
  --pf-c-card--m-selectable-raised--m-selected-raised--Transition: transform .25s linear, box-shadow .25s linear;
2655
2729
  --pf-c-card--m-selectable-raised--m-selected-raised--before--Transition: transform .25s linear;
2656
2730
  --pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY: calc(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY) * -1);
@@ -2770,6 +2844,7 @@ button.pf-c-breadcrumb__link {
2770
2844
  --pf-c-card--m-selectable-raised--before--Transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--Transition);
2771
2845
  --pf-c-card--m-selectable-raised--before--TranslateY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--TranslateY);
2772
2846
  --pf-c-card--m-selectable-raised--before--ScaleY: var(--pf-c-card--m-selectable-raised--m-selected-raised--before--ScaleY);
2847
+ z-index: var(--pf-c-card--m-selectable-raised--m-selected-raised--ZIndex);
2773
2848
  box-shadow: var(--pf-c-card--m-selectable-raised--m-selected-raised--BoxShadow);
2774
2849
  transition: var(--pf-c-card--m-selectable-raised--m-selected-raised--Transition);
2775
2850
  transform: translateY(var(--pf-c-card--m-selectable-raised--m-selected-raised--TranslateY));
@@ -18102,6 +18177,11 @@ svg.pf-c-spinner.pf-m-xl {
18102
18177
  --pf-c-tabs__link--disabled--before--BorderBottomWidth: 0;
18103
18178
  }
18104
18179
 
18180
+ .pf-c-tabs.pf-m-border-bottom {
18181
+ --pf-c-tabs--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
18182
+ --pf-c-tabs__link--disabled--before--BorderBottomWidth: var(--pf-c-tabs--before--border-width--base);
18183
+ }
18184
+
18105
18185
  .pf-c-tabs.pf-m-box .pf-c-tabs__link, .pf-c-tabs.pf-m-vertical .pf-c-tabs__link {
18106
18186
  --pf-c-tabs__link--after--BorderBottomWidth: 0;
18107
18187
  }