@patternfly/patternfly 5.2.0-prerelease.2 → 5.2.0-prerelease.4

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 (26) hide show
  1. package/components/Accordion/accordion.css +10 -1
  2. package/components/Accordion/accordion.scss +13 -1
  3. package/components/Switch/switch.css +1 -1
  4. package/components/Switch/switch.scss +1 -1
  5. package/docs/components/Accordion/examples/Accordion.md +95 -0
  6. package/docs/components/LogViewer/examples/LogViewer.md +130 -130
  7. package/docs/components/Menu/examples/Menu.md +507 -473
  8. package/docs/components/MenuToggle/examples/MenuToggle.md +106 -114
  9. package/docs/components/Nav/examples/Navigation.md +140 -113
  10. package/docs/components/TextInputGroup/examples/TextInputGroup.md +9 -9
  11. package/docs/components/Toolbar/examples/Toolbar.md +462 -2791
  12. package/docs/demos/CardView/examples/CardView.md +32 -51
  13. package/docs/demos/DataList/examples/DataList.md +182 -318
  14. package/docs/demos/Masthead/examples/Masthead.md +48 -207
  15. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +2 -1
  16. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +80 -268
  17. package/docs/demos/Table/examples/Table.md +1004 -1787
  18. package/docs/demos/Tabs/examples/Tabs.md +2 -2
  19. package/docs/demos/Toolbar/examples/Toolbar.css +10 -0
  20. package/docs/demos/Toolbar/examples/Toolbar.md +691 -1015
  21. package/package.json +2 -2
  22. package/patternfly-no-globals.css +11 -2
  23. package/patternfly-theme-dark-unversioned.css +11 -2
  24. package/patternfly.css +11 -2
  25. package/patternfly.min.css +1 -1
  26. package/patternfly.min.css.map +1 -1
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@patternfly/patternfly",
3
3
  "description": "Assets, source, tooling, and content for PatternFly 4",
4
- "version": "5.2.0-prerelease.2",
4
+ "version": "5.2.0-prerelease.4",
5
5
  "keywords": [],
6
6
  "license": "MIT",
7
7
  "scripts": {
@@ -45,7 +45,7 @@
45
45
  "@commitlint/config-conventional": "^17.6.7",
46
46
  "@fortawesome/fontawesome": "^1.1.8",
47
47
  "@octokit/rest": "^20.0.1",
48
- "@patternfly/documentation-framework": "5.2.18",
48
+ "@patternfly/documentation-framework": "5.2.24",
49
49
  "@patternfly/patternfly-a11y": "4.3.1",
50
50
  "@patternfly/react-code-editor": "5.1.1",
51
51
  "@patternfly/react-core": "5.1.1",
package/patternfly-no-globals.css CHANGED
@@ -5571,6 +5571,10 @@
5571
5571
  --pf-v5-c-accordion__toggle--after--Width: var(--pf-v5-global--BorderWidth--lg);
5572
5572
  --pf-v5-c-accordion__toggle--m-expanded--after--BackgroundColor: var(--pf-v5-global--primary-color--100);
5573
5573
  --pf-v5-c-accordion__toggle--BackgroundColor: transparent;
5574
+ --pf-v5-c-accordion__toggle--JustifyContent: space-between;
5575
+ --pf-v5-c-accordion__toggle--ColumnGap: 0;
5576
+ --pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent: start;
5577
+ --pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-v5-global--spacer--md);
5574
5578
  --pf-v5-c-accordion__toggle-text--MaxWidth: calc(100% - var(--pf-v5-global--spacer--lg));
5575
5579
  --pf-v5-c-accordion__toggle--hover__toggle-text--Color: var(--pf-v5-global--link--Color);
5576
5580
  --pf-v5-c-accordion__toggle--active__toggle-text--Color: var(--pf-v5-global--link--Color);
@@ -5624,6 +5628,10 @@
5624
5628
  color: var(--pf-v5-global--Color--100);
5625
5629
  background-color: var(--pf-v5-c-accordion--BackgroundColor);
5626
5630
  }
5631
+ .pf-v5-c-accordion.pf-m-toggle-start {
5632
+ --pf-v5-c-accordion__toggle--JustifyContent: var(--pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent);
5633
+ --pf-v5-c-accordion__toggle--ColumnGap: var(--pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap);
5634
+ }
5627
5635
  .pf-v5-c-accordion.pf-m-display-lg {
5628
5636
  --pf-v5-c-accordion__toggle--PaddingTop: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingTop);
5629
5637
  --pf-v5-c-accordion__toggle--PaddingRight: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingRight);
@@ -5683,8 +5691,9 @@
5683
5691
  .pf-v5-c-accordion__toggle {
5684
5692
  position: relative;
5685
5693
  display: flex;
5694
+ column-gap: var(--pf-v5-c-accordion__toggle--ColumnGap);
5686
5695
  align-items: center;
5687
- justify-content: space-between;
5696
+ justify-content: var(--pf-v5-c-accordion__toggle--JustifyContent);
5688
5697
  width: 100%;
5689
5698
  padding-block-start: var(--pf-v5-c-accordion__toggle--PaddingTop);
5690
5699
  padding-block-end: var(--pf-v5-c-accordion__toggle--PaddingBottom);
@@ -25112,7 +25121,7 @@ svg.pf-v5-c-spinner.pf-m-xl {
25112
25121
  cursor: pointer;
25113
25122
  opacity: 0;
25114
25123
  }
25115
- .pf-v5-c-switch__input:focus ~ .pf-v5-c-switch__toggle {
25124
+ .pf-v5-c-switch__input:focus-visible ~ .pf-v5-c-switch__toggle {
25116
25125
  outline: var(--pf-v5-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-v5-c-switch__input--focus__toggle--OutlineColor);
25117
25126
  outline-offset: var(--pf-v5-c-switch__input--focus__toggle--OutlineOffset);
25118
25127
  }
package/patternfly-theme-dark-unversioned.css CHANGED
@@ -5688,6 +5688,10 @@ button) {
5688
5688
  --pf-v5-c-accordion__toggle--after--Width: var(--pf-v5-global--BorderWidth--lg);
5689
5689
  --pf-v5-c-accordion__toggle--m-expanded--after--BackgroundColor: var(--pf-v5-global--primary-color--100);
5690
5690
  --pf-v5-c-accordion__toggle--BackgroundColor: transparent;
5691
+ --pf-v5-c-accordion__toggle--JustifyContent: space-between;
5692
+ --pf-v5-c-accordion__toggle--ColumnGap: 0;
5693
+ --pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent: start;
5694
+ --pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-v5-global--spacer--md);
5691
5695
  --pf-v5-c-accordion__toggle-text--MaxWidth: calc(100% - var(--pf-v5-global--spacer--lg));
5692
5696
  --pf-v5-c-accordion__toggle--hover__toggle-text--Color: var(--pf-v5-global--link--Color);
5693
5697
  --pf-v5-c-accordion__toggle--active__toggle-text--Color: var(--pf-v5-global--link--Color);
@@ -5741,6 +5745,10 @@ button) {
5741
5745
  color: var(--pf-v5-global--Color--100);
5742
5746
  background-color: var(--pf-v5-c-accordion--BackgroundColor);
5743
5747
  }
5748
+ .pf-v5-c-accordion.pf-m-toggle-start {
5749
+ --pf-v5-c-accordion__toggle--JustifyContent: var(--pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent);
5750
+ --pf-v5-c-accordion__toggle--ColumnGap: var(--pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap);
5751
+ }
5744
5752
  .pf-v5-c-accordion.pf-m-display-lg {
5745
5753
  --pf-v5-c-accordion__toggle--PaddingTop: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingTop);
5746
5754
  --pf-v5-c-accordion__toggle--PaddingRight: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingRight);
@@ -5800,8 +5808,9 @@ button) {
5800
5808
  .pf-v5-c-accordion__toggle {
5801
5809
  position: relative;
5802
5810
  display: flex;
5811
+ column-gap: var(--pf-v5-c-accordion__toggle--ColumnGap);
5803
5812
  align-items: center;
5804
- justify-content: space-between;
5813
+ justify-content: var(--pf-v5-c-accordion__toggle--JustifyContent);
5805
5814
  width: 100%;
5806
5815
  padding-block-start: var(--pf-v5-c-accordion__toggle--PaddingTop);
5807
5816
  padding-block-end: var(--pf-v5-c-accordion__toggle--PaddingBottom);
@@ -25229,7 +25238,7 @@ svg.pf-v5-c-spinner.pf-m-xl {
25229
25238
  cursor: pointer;
25230
25239
  opacity: 0;
25231
25240
  }
25232
- .pf-v5-c-switch__input:focus ~ .pf-v5-c-switch__toggle {
25241
+ .pf-v5-c-switch__input:focus-visible ~ .pf-v5-c-switch__toggle {
25233
25242
  outline: var(--pf-v5-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-v5-c-switch__input--focus__toggle--OutlineColor);
25234
25243
  outline-offset: var(--pf-v5-c-switch__input--focus__toggle--OutlineOffset);
25235
25244
  }
package/patternfly.css CHANGED
@@ -5688,6 +5688,10 @@ button) {
5688
5688
  --pf-v5-c-accordion__toggle--after--Width: var(--pf-v5-global--BorderWidth--lg);
5689
5689
  --pf-v5-c-accordion__toggle--m-expanded--after--BackgroundColor: var(--pf-v5-global--primary-color--100);
5690
5690
  --pf-v5-c-accordion__toggle--BackgroundColor: transparent;
5691
+ --pf-v5-c-accordion__toggle--JustifyContent: space-between;
5692
+ --pf-v5-c-accordion__toggle--ColumnGap: 0;
5693
+ --pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent: start;
5694
+ --pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap: var(--pf-v5-global--spacer--md);
5691
5695
  --pf-v5-c-accordion__toggle-text--MaxWidth: calc(100% - var(--pf-v5-global--spacer--lg));
5692
5696
  --pf-v5-c-accordion__toggle--hover__toggle-text--Color: var(--pf-v5-global--link--Color);
5693
5697
  --pf-v5-c-accordion__toggle--active__toggle-text--Color: var(--pf-v5-global--link--Color);
@@ -5741,6 +5745,10 @@ button) {
5741
5745
  color: var(--pf-v5-global--Color--100);
5742
5746
  background-color: var(--pf-v5-c-accordion--BackgroundColor);
5743
5747
  }
5748
+ .pf-v5-c-accordion.pf-m-toggle-start {
5749
+ --pf-v5-c-accordion__toggle--JustifyContent: var(--pf-v5-c-accordion--m-toggle-start__toggle--JustifyContent);
5750
+ --pf-v5-c-accordion__toggle--ColumnGap: var(--pf-v5-c-accordion--m-toggle-start__toggle--ColumnGap);
5751
+ }
5744
5752
  .pf-v5-c-accordion.pf-m-display-lg {
5745
5753
  --pf-v5-c-accordion__toggle--PaddingTop: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingTop);
5746
5754
  --pf-v5-c-accordion__toggle--PaddingRight: var(--pf-v5-c-accordion--m-display-lg__toggle--PaddingRight);
@@ -5800,8 +5808,9 @@ button) {
5800
5808
  .pf-v5-c-accordion__toggle {
5801
5809
  position: relative;
5802
5810
  display: flex;
5811
+ column-gap: var(--pf-v5-c-accordion__toggle--ColumnGap);
5803
5812
  align-items: center;
5804
- justify-content: space-between;
5813
+ justify-content: var(--pf-v5-c-accordion__toggle--JustifyContent);
5805
5814
  width: 100%;
5806
5815
  padding-block-start: var(--pf-v5-c-accordion__toggle--PaddingTop);
5807
5816
  padding-block-end: var(--pf-v5-c-accordion__toggle--PaddingBottom);
@@ -25229,7 +25238,7 @@ svg.pf-v5-c-spinner.pf-m-xl {
25229
25238
  cursor: pointer;
25230
25239
  opacity: 0;
25231
25240
  }
25232
- .pf-v5-c-switch__input:focus ~ .pf-v5-c-switch__toggle {
25241
+ .pf-v5-c-switch__input:focus-visible ~ .pf-v5-c-switch__toggle {
25233
25242
  outline: var(--pf-v5-c-switch__input--focus__toggle--OutlineWidth) solid var(--pf-v5-c-switch__input--focus__toggle--OutlineColor);
25234
25243
  outline-offset: var(--pf-v5-c-switch__input--focus__toggle--OutlineOffset);
25235
25244
  }