@patternfly/patternfly 4.183.2 → 4.184.2

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 (92) hide show
  1. package/components/Accordion/accordion.css +1 -0
  2. package/components/Accordion/accordion.scss +1 -0
  3. package/components/Menu/menu.css +1 -1
  4. package/components/Menu/menu.scss +2 -1
  5. package/components/MenuToggle/menu-toggle.css +18 -1
  6. package/components/MenuToggle/menu-toggle.scss +28 -1
  7. package/components/TextInputGroup/text-input-group.css +6 -0
  8. package/components/TextInputGroup/text-input-group.scss +11 -0
  9. package/docs/components/Accordion/examples/Accordion.md +16 -3
  10. package/docs/components/DescriptionList/examples/DescriptionList.md +19 -19
  11. package/docs/components/Form/examples/Form.md +118 -47
  12. package/docs/components/MenuToggle/examples/MenuToggle.md +68 -9
  13. package/docs/components/ModalBox/examples/ModalBox.md +1 -0
  14. package/docs/components/OptionsMenu/examples/options-menu.md +1 -1
  15. package/docs/components/Page/examples/Page.md +9 -8
  16. package/docs/components/Pagination/examples/Pagination.css +3 -0
  17. package/docs/components/Pagination/examples/Pagination.md +136 -158
  18. package/docs/components/Toolbar/examples/Toolbar.md +22 -26
  19. package/docs/components/Wizard/examples/Wizard.md +19 -18
  20. package/docs/demos/CardView/examples/CardView.md +22 -26
  21. package/docs/demos/DataList/examples/DataList.md +88 -104
  22. package/docs/demos/Form/examples/BasicForms.md +40 -8
  23. package/docs/demos/Modal/examples/Modal.md +7 -4
  24. package/docs/demos/Page/examples/Page.md +1 -0
  25. package/docs/demos/PasswordGenerator/examples/PasswordGenerator.md +5 -1
  26. package/docs/demos/PasswordStrength/examples/PasswordStrength.md +20 -4
  27. package/docs/demos/PrimaryDetail/examples/PrimaryDetail.md +54 -89
  28. package/docs/demos/Table/examples/Table.md +227 -273
  29. package/docs/demos/Tabs/examples/Tabs.md +64 -88
  30. package/docs/demos/Toolbar/examples/Toolbar.md +88 -104
  31. package/docs/demos/Wizard/examples/Wizard.md +4 -4
  32. package/package.json +1 -1
  33. package/patternfly-no-reset.css +26 -2
  34. package/patternfly.css +26 -2
  35. package/patternfly.min.css +1 -1
  36. package/patternfly.min.css.map +1 -1
  37. package/themes/dark/_patternfly-theme-dark.scss +118 -0
  38. package/themes/dark/_variables.scss +94 -0
  39. package/themes/dark/colors.scss +16 -0
  40. package/themes/dark/globals.scss +7 -0
  41. package/themes/dark/mixins.scss +5 -0
  42. package/themes/dark/placeholders.scss +30 -0
  43. package/themes/dark/scss-variables.scss +85 -0
  44. package/components/AboutModalBox/themes/dark/about-modal-box.css +0 -0
  45. package/components/Accordion/themes/dark/accordion.css +0 -0
  46. package/components/Alert/themes/dark/alert.css +0 -0
  47. package/components/AppLauncher/themes/dark/app-launcher.css +0 -0
  48. package/components/Badge/themes/dark/badge.css +0 -0
  49. package/components/Banner/themes/dark/banner.css +0 -0
  50. package/components/Breadcrumb/themes/dark/breadcrumb.css +0 -0
  51. package/components/Button/themes/dark/button.css +0 -0
  52. package/components/CalendarMonth/themes/dark/calendar-month.css +0 -0
  53. package/components/Chip/themes/dark/chip.css +0 -0
  54. package/components/ClipboardCopy/themes/dark/clipboard-copy.css +0 -0
  55. package/components/CodeEditor/themes/dark/code-editor.css +0 -0
  56. package/components/ContextSelector/themes/dark/context-selector.css +0 -0
  57. package/components/DataList/themes/dark/data-list.css +0 -0
  58. package/components/DatePicker/themes/dark/date-picker.css +0 -0
  59. package/components/Drawer/themes/dark/drawer.css +0 -0
  60. package/components/Dropdown/themes/dark/dropdown.css +0 -0
  61. package/components/Form/themes/dark/form.css +0 -0
  62. package/components/FormControl/themes/dark/form-control.css +0 -0
  63. package/components/HelperText/themes/dark/helper-text.css +0 -0
  64. package/components/Hint/themes/dark/hint.css +0 -0
  65. package/components/InputGroup/themes/dark/input-group.css +0 -0
  66. package/components/Label/themes/dark/label.css +0 -0
  67. package/components/LogViewer/themes/dark/log-viewer.css +0 -0
  68. package/components/Login/themes/dark/login.css +0 -0
  69. package/components/Masthead/themes/dark/masthead.css +0 -0
  70. package/components/Menu/themes/dark/menu.css +0 -0
  71. package/components/MenuToggle/themes/dark/menu-toggle.css +0 -0
  72. package/components/ModalBox/themes/dark/modal-box.css +0 -0
  73. package/components/Nav/themes/dark/nav.css +0 -0
  74. package/components/NotificationBadge/themes/dark/notification-badge.css +0 -0
  75. package/components/NotificationDrawer/themes/dark/notification-drawer.css +0 -0
  76. package/components/OptionsMenu/themes/dark/options-menu.css +0 -0
  77. package/components/Page/themes/dark/page.css +0 -0
  78. package/components/Pagination/themes/dark/pagination.css +0 -0
  79. package/components/Popover/themes/dark/popover.css +0 -0
  80. package/components/Progress/themes/dark/progress.css +0 -0
  81. package/components/SearchInput/themes/dark/search-input.css +0 -0
  82. package/components/Select/themes/dark/select.css +0 -0
  83. package/components/SimpleList/themes/dark/simple-list.css +0 -0
  84. package/components/Skeleton/themes/dark/skeleton.css +0 -0
  85. package/components/Switch/themes/dark/switch.css +0 -0
  86. package/components/Table/themes/dark/table.css +0 -0
  87. package/components/Tabs/themes/dark/tabs.css +0 -0
  88. package/components/Tile/themes/dark/tile.css +0 -0
  89. package/components/ToggleGroup/themes/dark/toggle-group.css +0 -0
  90. package/components/Tooltip/themes/dark/tooltip.css +0 -0
  91. package/components/TreeView/themes/dark/tree-view.css +0 -0
  92. package/components/Wizard/themes/dark/wizard.css +0 -0
package/patternfly.css CHANGED
@@ -5824,6 +5824,7 @@ a {
5824
5824
  right: 0;
5825
5825
  bottom: 0;
5826
5826
  left: 0;
5827
+ pointer-events: none;
5827
5828
  content: "";
5828
5829
  border-bottom: var(--pf-c-accordion--m-bordered__expanded-content--m-expanded__expanded-content-body--last-child--after--BorderBottomWidth) solid var(--pf-c-accordion--m-bordered__expanded-content--m-expanded__expanded-content-body--last-child--after--BorderBottomColor);
5829
5830
  }
@@ -16972,7 +16973,7 @@ ul.pf-c-list {
16972
16973
  --pf-c-menu__list-item--BackgroundColor: var(--pf-c-menu__list-item--hover--BackgroundColor);
16973
16974
  --pf-c-menu__list-item--Color: var(--pf-c-menu__list-item--hover--Color, inherit);
16974
16975
  }
16975
- .pf-c-menu__list-item:focus-within {
16976
+ .pf-c-menu__list-item:focus-within, .pf-c-menu__list-item.pf-m-focus {
16976
16977
  --pf-c-menu__list-item--BackgroundColor: var(--pf-c-menu__list-item--focus-within--BackgroundColor);
16977
16978
  --pf-c-menu__list-item--Color: var(--pf-c-menu__list-item--focus-within--Color, inherit);
16978
16979
  }
@@ -17250,6 +17251,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17250
17251
  --pf-c-menu-toggle--m-split-button--m-action--m-secondary--child--BorderLeftColor: var(--pf-global--primary-color--100);
17251
17252
  --pf-c-menu-toggle__button__controls--MarginRight: var(--pf-global--spacer--sm);
17252
17253
  --pf-c-menu-toggle__button__controls--MarginLeft: var(--pf-global--spacer--sm);
17254
+ --pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginTop: calc(var(--pf-c-menu-toggle--PaddingTop) * -1);
17255
+ --pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginRight: calc(var(--pf-c-menu-toggle--PaddingRight) * -1);
17256
+ --pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginBottom: calc(var(--pf-c-menu-toggle--PaddingBottom) * -1);
17257
+ --pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginLeft: calc(var(--pf-c-menu-toggle--PaddingLeft) * -1);
17258
+ --pf-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight: var(--pf-global--spacer--sm);
17253
17259
  position: relative;
17254
17260
  display: inline-flex;
17255
17261
  align-items: center;
@@ -17258,6 +17264,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17258
17264
  font-size: var(--pf-c-menu-toggle--FontSize);
17259
17265
  line-height: var(--pf-c-menu-toggle--LineHeight);
17260
17266
  color: var(--pf-c-menu-toggle--Color);
17267
+ cursor: pointer;
17261
17268
  background-color: var(--pf-c-menu-toggle--BackgroundColor);
17262
17269
  border: 0;
17263
17270
  border-radius: var(--pf-c-menu-toggle--BorderRadius);
@@ -17339,7 +17346,7 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17339
17346
  --pf-c-menu-toggle--m-plain__toggle-icon--Color: var(--pf-c-menu-toggle--m-plain--hover__toggle-icon--Color);
17340
17347
  --pf-c-menu-toggle--m-plain--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
17341
17348
  }
17342
- .pf-c-menu-toggle:focus {
17349
+ .pf-c-menu-toggle:focus, .pf-c-menu-toggle:focus-within {
17343
17350
  --pf-c-menu-toggle--BackgroundColor: var(--pf-c-menu-toggle--focus--BackgroundColor);
17344
17351
  --pf-c-menu-toggle--after--BorderBottomWidth: var(--pf-c-menu-toggle--focus--after--BorderBottomWidth);
17345
17352
  --pf-c-menu-toggle--after--BorderBottomColor: var(--pf-c-menu-toggle--focus--after--BorderBottomColor);
@@ -17380,6 +17387,11 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17380
17387
  --pf-c-menu-toggle--active--after--BorderBottomWidth: var(--pf-c-menu-toggle--m-full-height--active--after--BorderBottomWidth);
17381
17388
  height: 100%;
17382
17389
  }
17390
+ .pf-c-menu-toggle.pf-m-typeahead .pf-c-text-input-group {
17391
+ --pf-c-text-input-group__utilities--c-button--PaddingRight: var(--pf-c-menu-toggle--m-typeahead--c-text-input-group__utilities--c-button--PaddingRight);
17392
+ flex: 1;
17393
+ margin: var(--pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginTop) var(--pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginRight) var(--pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginBottom) var(--pf-c-menu-toggle--m-typeahead--c-text-input-group--MarginLeft);
17394
+ }
17383
17395
  .pf-c-menu-toggle.pf-m-split-button {
17384
17396
  --pf-c-menu-toggle__toggle-icon--MarginRight: 0;
17385
17397
  padding: 0;
@@ -17477,6 +17489,12 @@ label.pf-c-menu__item:where(:not([disabled], .pf-m-disabled)) {
17477
17489
  color: var(--pf-c-menu-toggle--m-split-button--child--disabled--Color);
17478
17490
  background-color: var(--pf-c-menu-toggle--m-split-button--child--disabled--BackgroundColor);
17479
17491
  }
17492
+ .pf-c-menu-toggle.pf-m-typeahead, .pf-c-menu-toggle.pf-m-split-button {
17493
+ --pf-c-menu-toggle__toggle-icon--MarginRight: 0;
17494
+ }
17495
+ .pf-c-menu-toggle.pf-m-full-width {
17496
+ width: 100%;
17497
+ }
17480
17498
 
17481
17499
  .pf-c-menu-toggle__button {
17482
17500
  color: inherit;
@@ -27379,6 +27397,12 @@ svg.pf-c-spinner.pf-m-xl {
27379
27397
  --pf-c-text-input-group--BackgroundColor: var(--pf-c-text-input-group--m-disabled--BackgroundColor);
27380
27398
  pointer-events: none;
27381
27399
  }
27400
+ .pf-c-text-input-group.pf-m-plain {
27401
+ --pf-c-text-input-group--BackgroundColor: transparent;
27402
+ }
27403
+ .pf-c-text-input-group.pf-m-plain .pf-c-text-input-group__text::before, .pf-c-text-input-group.pf-m-plain .pf-c-text-input-group__text::after {
27404
+ border: 0;
27405
+ }
27382
27406
 
27383
27407
  .pf-c-text-input-group__main {
27384
27408
  display: flex;