@patternfly/patternfly 4.152.1 → 4.155.0

package/docs/components/MenuToggle/examples/MenuToggle.md

@@ -186,6 +186,53 @@ cssPrefix: pf-c-menu-toggle
 
 ```
 
+### Plain with text
+
+```html
+<button
+  class="pf-c-menu-toggle pf-m-plain pf-m-text"
+  type="button"
+  aria-expanded="false"
+  disabled
+>
+  <span class="pf-c-menu-toggle__text">Disabled</span>
+  <span class="pf-c-menu-toggle__controls">
+    <span class="pf-c-menu-toggle__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </span>
+  </span>
+</button>
+
+&nbsp;
+<button
+  class="pf-c-menu-toggle pf-m-plain pf-m-text"
+  type="button"
+  aria-expanded="false"
+>
+  <span class="pf-c-menu-toggle__text">Custom text</span>
+  <span class="pf-c-menu-toggle__controls">
+    <span class="pf-c-menu-toggle__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </span>
+  </span>
+</button>
+
+&nbsp;
+<button
+  class="pf-c-menu-toggle pf-m-plain pf-m-text pf-m-expanded"
+  type="button"
+  aria-expanded="true"
+>
+  <span class="pf-c-menu-toggle__text">Custom text (expanded)</span>
+  <span class="pf-c-menu-toggle__controls">
+    <span class="pf-c-menu-toggle__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </span>
+  </span>
+</button>
+
+```
+
 ### With image and text
 
 ```html
@@ -246,6 +293,7 @@ cssPrefix: pf-c-menu-toggle
 | `.pf-c-menu-toggle__controls`    | `<span>`            | Defines the menu toggle component controls.                   |
 | `.pf-c-menu-toggle__toggle-icon` | `<span>`            | Defines the menu toggle component toggle/arrow icon.          |
 | `.pf-m-primary`                  | `.pf-c-menu-toggle` | Modifies the menu toggle component for the primary variation. |
+| `.pf-m-text`                     | `.pf-c-menu-toggle` | Modifies the menu toggle component for the text variation.    |
 | `.pf-m-plain`                    | `.pf-c-menu-toggle` | Modifies the menu toggle component for the plain variation.   |
 | `.pf-m-expanded`                 | `.pf-c-menu-toggle` | Modifies the menu toggle component for the expanded state.    |
 | `.pf-m-full-height`              | `.pf-c-menu-toggle` | Modifies the menu toggle component to full height of parent.  |

package/docs/components/OptionsMenu/examples/options-menu.md

@@ -415,21 +415,19 @@ cssPrefix: pf-c-options-menu
 
 ```html
 <div class="pf-c-options-menu">
-  <div class="pf-c-options-menu__toggle pf-m-text pf-m-disabled pf-m-plain">
+  <button
+    class="pf-c-options-menu__toggle pf-m-text pf-m-plain"
+    type="button"
+    id="options-menu-disabled-text-example-toggle"
+    aria-haspopup="listbox"
+    aria-expanded="false"
+    disabled
+  >
     <span class="pf-c-options-menu__toggle-text">Custom text</span>
-    <button
-      class="pf-c-options-menu__toggle-button"
-      id="options-menu-disabled-text-example-toggle"
-      aria-haspopup="listbox"
-      aria-expanded="false"
-      aria-label="Options menu"
-      disabled
-    >
-      <span class="pf-c-options-menu__toggle-button-icon">
-        <i class="fas fa-caret-down" aria-hidden="true"></i>
-      </span>
-    </button>
-  </div>
+    <div class="pf-c-options-menu__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </div>
+  </button>
   <ul
     class="pf-c-options-menu__menu"
     aria-labelledby="options-menu-disabled-text-example-toggle"
@@ -453,20 +451,18 @@ cssPrefix: pf-c-options-menu
 </div>
 
 <div class="pf-c-options-menu">
-  <div class="pf-c-options-menu__toggle pf-m-text pf-m-plain">
+  <button
+    class="pf-c-options-menu__toggle pf-m-text pf-m-plain"
+    type="button"
+    id="options-menu-plain-text-example-toggle"
+    aria-haspopup="listbox"
+    aria-expanded="false"
+  >
     <span class="pf-c-options-menu__toggle-text">Custom text</span>
-    <button
-      class="pf-c-options-menu__toggle-button"
-      id="options-menu-plain-text-example-toggle"
-      aria-haspopup="listbox"
-      aria-expanded="false"
-      aria-label="Options menu"
-    >
-      <span class="pf-c-options-menu__toggle-button-icon">
-        <i class="fas fa-caret-down" aria-hidden="true"></i>
-      </span>
-    </button>
-  </div>
+    <div class="pf-c-options-menu__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </div>
+  </button>
   <ul
     class="pf-c-options-menu__menu"
     aria-labelledby="options-menu-plain-text-example-toggle"
@@ -490,20 +486,18 @@ cssPrefix: pf-c-options-menu
 </div>
 
 <div class="pf-c-options-menu pf-m-expanded">
-  <div class="pf-c-options-menu__toggle pf-m-text pf-m-plain">
+  <button
+    class="pf-c-options-menu__toggle pf-m-text pf-m-plain"
+    type="button"
+    id="options-menu-plain-text-expanded-example-toggle"
+    aria-haspopup="listbox"
+    aria-expanded="true"
+  >
     <span class="pf-c-options-menu__toggle-text">Custom text</span>
-    <button
-      class="pf-c-options-menu__toggle-button"
-      id="options-menu-plain-text-expanded-example-toggle"
-      aria-haspopup="listbox"
-      aria-expanded="true"
-      aria-label="Options menu"
-    >
-      <span class="pf-c-options-menu__toggle-button-icon">
-        <i class="fas fa-caret-down" aria-hidden="true"></i>
-      </span>
-    </button>
-  </div>
+    <div class="pf-c-options-menu__toggle-icon">
+      <i class="fas fa-caret-down" aria-hidden="true"></i>
+    </div>
+  </button>
   <ul
     class="pf-c-options-menu__menu"
     aria-labelledby="options-menu-plain-text-expanded-example-toggle"

package/docs/components/TextInputGroup/examples/TextInputGroup.md

@@ -23,6 +23,25 @@ cssPrefix: pf-c-text-input-group
 
 ```
 
+### Disabled
+
+```html
+<div class="pf-c-text-input-group pf-m-disabled">
+  <div class="pf-c-text-input-group__main">
+    <span class="pf-c-text-input-group__text">
+      <input
+        class="pf-c-text-input-group__text-input"
+        type="text"
+        value="Disabled"
+        aria-label="Disabled text input group example input"
+        disabled
+      />
+    </span>
+  </div>
+</div>
+
+```
+
 ### Utilities and icon
 
 ```html

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly/patternfly",
   "description": "Assets, source, tooling, and content for PatternFly 4",
-  "version": "4.152.1",
+  "version": "4.155.0",
   "keywords": [],
   "license": "MIT",
   "scripts": {

package/patternfly-no-reset.css

@@ -14644,12 +14644,14 @@ ul.pf-c-list {
   --pf-c-log-viewer__main--BorderWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-log-viewer__main--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-log-viewer__scroll-container--Height: 37.5rem;
+  --pf-c-log-viewer__scroll-container--PaddingTop: var(--pf-global--spacer--sm);
+  --pf-c-log-viewer__scroll-container--PaddingBottom: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Top: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Bottom: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Width: var(--pf-global--BorderWidth--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor: var(--pf-global--BorderColor--100);
-  --pf-c-log-viewer__scroll-container--PaddingTop: var(--pf-global--spacer--md);
-  --pf-c-log-viewer__scroll-container--PaddingBottom: var(--pf-global--spacer--md);
+  --pf-c-log-viewer__list--Height: auto;
+  --pf-c-log-viewer--m-line-numbers__list--Left: var(--pf-c-log-viewer__index--Width);
   --pf-c-log-viewer__index--Display: none;
   --pf-c-log-viewer__index--Width: 4.0625rem;
   --pf-c-log-viewer__index--PaddingRight: var(--pf-global--spacer--xl);
@@ -14657,11 +14659,16 @@ ul.pf-c-list {
   --pf-c-log-viewer__index--FontFamily: var(--pf-global--FontFamily--monospace);
   --pf-c-log-viewer__index--FontSize: var(--pf-global--FontSize--sm);
   --pf-c-log-viewer__index--Color: var(--pf-global--Color--200);
+  --pf-c-log-viewer__index--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-log-viewer__text--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-log-viewer__text--PaddingLeft: var(--pf-global--spacer--md);
   --pf-c-log-viewer__text--FontFamily: var(--pf-global--FontFamily--monospace);
   --pf-c-log-viewer__text--FontSize: var(--pf-global--FontSize--sm);
   --pf-c-log-viewer__text--Color: var(--pf-global--Color--100);
+  --pf-c-log-viewer__text--WordBreak: break-all;
+  --pf-c-log-viewer__text--WhiteSpace: break-spaces;
+  --pf-c-log-viewer__text--LineBreak: anywhere;
+  --pf-c-log-viewer--m-nowrap__text--WhiteSpace: nowrap;
   --pf-c-log-viewer__string--m-match--Color: var(--pf-global--palette--gold-700);
   --pf-c-log-viewer__string--m-match--BackgroundColor: var(--pf-global--palette--gold-100);
   --pf-c-log-viewer__string--m-current--Color: var(--pf-global--palette--gold-700);
@@ -14693,9 +14700,18 @@ ul.pf-c-list {
 .pf-c-log-viewer.pf-m-wrap-text {
   word-break: break-all;
 }
+.pf-c-log-viewer.pf-m-nowrap {
+  --pf-c-log-viewer__text--WhiteSpace: var(--pf-c-log-viewer--m-nowrap__text--WhiteSpace);
+}
 .pf-c-log-viewer.pf-m-line-numbers {
   --pf-c-log-viewer__index--Display: var(--pf-c-log-viewer--m-line-numbers__index--Display);
 }
+.pf-c-log-viewer.pf-m-line-numbers .pf-c-log-viewer__list {
+  position: absolute;
+  right: 0;
+  left: var(--pf-c-log-viewer--m-line-numbers__list--Left);
+  overflow: auto;
+}
 .pf-c-log-viewer .pf-c-toolbar {
   --pf-c-toolbar--PaddingTop: var(--pf-c-log-viewer--c-toolbar--PaddingTop);
   --pf-c-toolbar--PaddingBottom: var(--pf-c-log-viewer--c-toolbar--PaddingBottom);
@@ -14736,19 +14752,23 @@ ul.pf-c-list {
 }
 
 .pf-c-log-viewer__scroll-container {
+  position: relative;
   height: var(--pf-c-log-viewer__scroll-container--Height);
   padding-top: var(--pf-c-log-viewer__scroll-container--PaddingTop);
   padding-bottom: var(--pf-c-log-viewer__scroll-container--PaddingBottom);
   overflow: auto;
+  will-change: transform;
+  direction: ltr;
 }
 
 .pf-c-log-viewer__list {
   position: relative;
+  height: var(--pf-c-log-viewer__list--Height);
 }
 
-.pf-m-line-numbers .pf-c-log-viewer__list-item {
-  display: grid;
-  grid-template-columns: max-content 1fr;
+.pf-c-log-viewer__list-item {
+  left: 0;
+  width: 100%;
 }
 
 .pf-c-log-viewer__string.pf-m-match {
@@ -14761,6 +14781,8 @@ ul.pf-c-list {
 }
 
 .pf-c-log-viewer__index {
+  position: fixed;
+  left: 0;
   display: var(--pf-c-log-viewer__index--Display);
   width: var(--pf-c-log-viewer__index--Width);
   padding-right: var(--pf-c-log-viewer__index--PaddingRight);
@@ -14768,6 +14790,7 @@ ul.pf-c-list {
   font-family: var(--pf-c-log-viewer__index--FontFamily);
   font-size: var(--pf-c-log-viewer__index--FontSize);
   color: var(--pf-c-log-viewer__index--Color);
+  background-color: var(--pf-c-log-viewer__index--BackgroundColor);
 }
 
 .pf-c-log-viewer__text {
@@ -14777,9 +14800,9 @@ ul.pf-c-list {
   font-family: var(--pf-c-log-viewer__text--FontFamily);
   font-size: var(--pf-c-log-viewer__text--FontSize);
   color: var(--pf-c-log-viewer__text--Color);
-  word-break: break-all;
-  white-space: break-spaces;
-  line-break: anywhere;
+  word-break: var(--pf-c-log-viewer__text--WordBreak);
+  white-space: var(--pf-c-log-viewer__text--WhiteSpace);
+  line-break: var(--pf-c-log-viewer__text--LineBreak);
 }
 
 .pf-c-log-viewer__timestamp {
@@ -16222,7 +16245,7 @@ ul.pf-c-list {
   --pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-primary--m-expanded--Color);
   --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor);
 }
-.pf-c-menu-toggle.pf-m-plain {
+.pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
   --pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
   --pf-c-menu-toggle--focus--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
@@ -17775,37 +17798,29 @@ ul.pf-c-list {
   justify-content: space-between;
   min-width: var(--pf-c-options-menu__toggle--MinWidth);
   max-width: 100%;
-  padding-left: var(--pf-c-options-menu__toggle--PaddingLeft);
+  padding: var(--pf-c-options-menu__toggle--PaddingTop) var(--pf-c-options-menu__toggle--PaddingRight) var(--pf-c-options-menu__toggle--PaddingBottom) var(--pf-c-options-menu__toggle--PaddingLeft);
   line-height: var(--pf-c-options-menu__toggle--LineHeight);
   color: var(--pf-c-options-menu__toggle--Color);
   background-color: var(--pf-c-options-menu__toggle--BackgroundColor);
   border: none;
 }
-.pf-c-options-menu__toggle:not(.pf-m-text) {
-  padding-top: var(--pf-c-options-menu__toggle--PaddingTop);
-  padding-right: var(--pf-c-options-menu__toggle--PaddingRight);
-  padding-bottom: var(--pf-c-options-menu__toggle--PaddingBottom);
-}
 .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle::before {
   --pf-c-options-menu__toggle--BorderBottomColor: var(--pf-c-options-menu__toggle--expanded--BorderBottomColor);
   border-bottom-width: var(--pf-c-options-menu__toggle--expanded--BorderBottomWidth);
 }
-.pf-c-options-menu__toggle.pf-m-plain {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-options-menu__toggle--PaddingRight: var(--pf-c-options-menu__toggle--m-plain--PaddingRight);
   --pf-c-options-menu__toggle--PaddingLeft: var(--pf-c-options-menu__toggle--m-plain--PaddingLeft);
   display: inline-block;
-}
-.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
-  justify-content: center;
   color: var(--pf-c-options-menu__toggle--m-plain--Color);
 }
-.pf-c-options-menu__toggle.pf-m-plain .pf-c-options-menu__toggle-button-icon {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) .pf-c-options-menu__toggle-button-icon {
   line-height: var(--pf-c-options-menu__toggle--LineHeight);
 }
-.pf-c-options-menu__toggle.pf-m-plain:hover, .pf-c-options-menu__toggle.pf-m-plain:active, .pf-c-options-menu__toggle.pf-m-plain.pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):hover, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--hover--Color);
 }
-.pf-c-options-menu__toggle.pf-m-plain.pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:disabled {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):disabled {
   --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--disabled--Color);
 }
 .pf-c-options-menu__toggle.pf-m-disabled, .pf-c-options-menu__toggle:disabled {
@@ -25782,6 +25797,7 @@ svg.pf-c-spinner.pf-m-xl {
 }
 
 .pf-c-text-input-group {
+  --pf-c-text-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-text-input-group__text--before--BorderWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-text-input-group__text--before--BorderColor: var(--pf-global--BorderColor--300);
   --pf-c-text-input-group__text--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
@@ -25806,12 +25822,24 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-text-input-group__utilities--child--MarginLeft: var(--pf-global--spacer--xs);
   --pf-c-text-input-group__utilities--c-button--PaddingRight: var(--pf-global--spacer--xs);
   --pf-c-text-input-group__utilities--c-button--PaddingLeft: var(--pf-global--spacer--xs);
+  --pf-c-text-input-group--m-disabled--Color: var(--pf-global--disabled-color--100);
+  --pf-c-text-input-group--m-disabled--BackgroundColor: var(--pf-global--disabled-color--300);
   position: relative;
   display: flex;
+  color: var(--pf-c-text-input-group--Color, inherit);
+  background-color: var(--pf-c-text-input-group--BackgroundColor);
 }
 .pf-c-text-input-group:hover {
   --pf-c-text-input-group__text--after--BorderBottomColor: var(--pf-c-text-input-group--hover__text--after--BorderBottomColor);
 }
+.pf-c-text-input-group.pf-m-disabled {
+  --pf-c-text-input-group__text--before--BorderWidth: 0;
+  --pf-c-text-input-group__text--after--BorderBottomWidth: 0;
+  --pf-c-text-input-group--Color: var(--pf-c-text-input-group--m-disabled--Color);
+  --pf-c-text-input-group__icon--Color: var(--pf-c-text-input-group--m-disabled--Color);
+  --pf-c-text-input-group--BackgroundColor: var(--pf-c-text-input-group--m-disabled--BackgroundColor);
+  pointer-events: none;
+}
 
 .pf-c-text-input-group__main {
   display: flex;

package/patternfly.css

@@ -14780,12 +14780,14 @@ ul.pf-c-list {
   --pf-c-log-viewer__main--BorderWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-log-viewer__main--BorderColor: var(--pf-global--BorderColor--100);
   --pf-c-log-viewer__scroll-container--Height: 37.5rem;
+  --pf-c-log-viewer__scroll-container--PaddingTop: var(--pf-global--spacer--sm);
+  --pf-c-log-viewer__scroll-container--PaddingBottom: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Top: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Bottom: var(--pf-global--spacer--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--Width: var(--pf-global--BorderWidth--sm);
   --pf-c-log-viewer--m-line-numbers__main--before--BackgroundColor: var(--pf-global--BorderColor--100);
-  --pf-c-log-viewer__scroll-container--PaddingTop: var(--pf-global--spacer--md);
-  --pf-c-log-viewer__scroll-container--PaddingBottom: var(--pf-global--spacer--md);
+  --pf-c-log-viewer__list--Height: auto;
+  --pf-c-log-viewer--m-line-numbers__list--Left: var(--pf-c-log-viewer__index--Width);
   --pf-c-log-viewer__index--Display: none;
   --pf-c-log-viewer__index--Width: 4.0625rem;
   --pf-c-log-viewer__index--PaddingRight: var(--pf-global--spacer--xl);
@@ -14793,11 +14795,16 @@ ul.pf-c-list {
   --pf-c-log-viewer__index--FontFamily: var(--pf-global--FontFamily--monospace);
   --pf-c-log-viewer__index--FontSize: var(--pf-global--FontSize--sm);
   --pf-c-log-viewer__index--Color: var(--pf-global--Color--200);
+  --pf-c-log-viewer__index--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-log-viewer__text--PaddingRight: var(--pf-global--spacer--md);
   --pf-c-log-viewer__text--PaddingLeft: var(--pf-global--spacer--md);
   --pf-c-log-viewer__text--FontFamily: var(--pf-global--FontFamily--monospace);
   --pf-c-log-viewer__text--FontSize: var(--pf-global--FontSize--sm);
   --pf-c-log-viewer__text--Color: var(--pf-global--Color--100);
+  --pf-c-log-viewer__text--WordBreak: break-all;
+  --pf-c-log-viewer__text--WhiteSpace: break-spaces;
+  --pf-c-log-viewer__text--LineBreak: anywhere;
+  --pf-c-log-viewer--m-nowrap__text--WhiteSpace: nowrap;
   --pf-c-log-viewer__string--m-match--Color: var(--pf-global--palette--gold-700);
   --pf-c-log-viewer__string--m-match--BackgroundColor: var(--pf-global--palette--gold-100);
   --pf-c-log-viewer__string--m-current--Color: var(--pf-global--palette--gold-700);
@@ -14829,9 +14836,18 @@ ul.pf-c-list {
 .pf-c-log-viewer.pf-m-wrap-text {
   word-break: break-all;
 }
+.pf-c-log-viewer.pf-m-nowrap {
+  --pf-c-log-viewer__text--WhiteSpace: var(--pf-c-log-viewer--m-nowrap__text--WhiteSpace);
+}
 .pf-c-log-viewer.pf-m-line-numbers {
   --pf-c-log-viewer__index--Display: var(--pf-c-log-viewer--m-line-numbers__index--Display);
 }
+.pf-c-log-viewer.pf-m-line-numbers .pf-c-log-viewer__list {
+  position: absolute;
+  right: 0;
+  left: var(--pf-c-log-viewer--m-line-numbers__list--Left);
+  overflow: auto;
+}
 .pf-c-log-viewer .pf-c-toolbar {
   --pf-c-toolbar--PaddingTop: var(--pf-c-log-viewer--c-toolbar--PaddingTop);
   --pf-c-toolbar--PaddingBottom: var(--pf-c-log-viewer--c-toolbar--PaddingBottom);
@@ -14872,19 +14888,23 @@ ul.pf-c-list {
 }
 
 .pf-c-log-viewer__scroll-container {
+  position: relative;
   height: var(--pf-c-log-viewer__scroll-container--Height);
   padding-top: var(--pf-c-log-viewer__scroll-container--PaddingTop);
   padding-bottom: var(--pf-c-log-viewer__scroll-container--PaddingBottom);
   overflow: auto;
+  will-change: transform;
+  direction: ltr;
 }
 
 .pf-c-log-viewer__list {
   position: relative;
+  height: var(--pf-c-log-viewer__list--Height);
 }
 
-.pf-m-line-numbers .pf-c-log-viewer__list-item {
-  display: grid;
-  grid-template-columns: max-content 1fr;
+.pf-c-log-viewer__list-item {
+  left: 0;
+  width: 100%;
 }
 
 .pf-c-log-viewer__string.pf-m-match {
@@ -14897,6 +14917,8 @@ ul.pf-c-list {
 }
 
 .pf-c-log-viewer__index {
+  position: fixed;
+  left: 0;
   display: var(--pf-c-log-viewer__index--Display);
   width: var(--pf-c-log-viewer__index--Width);
   padding-right: var(--pf-c-log-viewer__index--PaddingRight);
@@ -14904,6 +14926,7 @@ ul.pf-c-list {
   font-family: var(--pf-c-log-viewer__index--FontFamily);
   font-size: var(--pf-c-log-viewer__index--FontSize);
   color: var(--pf-c-log-viewer__index--Color);
+  background-color: var(--pf-c-log-viewer__index--BackgroundColor);
 }
 
 .pf-c-log-viewer__text {
@@ -14913,9 +14936,9 @@ ul.pf-c-list {
   font-family: var(--pf-c-log-viewer__text--FontFamily);
   font-size: var(--pf-c-log-viewer__text--FontSize);
   color: var(--pf-c-log-viewer__text--Color);
-  word-break: break-all;
-  white-space: break-spaces;
-  line-break: anywhere;
+  word-break: var(--pf-c-log-viewer__text--WordBreak);
+  white-space: var(--pf-c-log-viewer__text--WhiteSpace);
+  line-break: var(--pf-c-log-viewer__text--LineBreak);
 }
 
 .pf-c-log-viewer__timestamp {
@@ -16358,7 +16381,7 @@ ul.pf-c-list {
   --pf-c-menu-toggle--m-expanded--Color: var(--pf-c-menu-toggle--m-primary--m-expanded--Color);
   --pf-c-menu-toggle--m-expanded--BackgroundColor: var(--pf-c-menu-toggle--m-primary--m-expanded--BackgroundColor);
 }
-.pf-c-menu-toggle.pf-m-plain {
+.pf-c-menu-toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-menu-toggle--Color: var(--pf-c-menu-toggle--m-plain--Color);
   --pf-c-menu-toggle--hover--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
   --pf-c-menu-toggle--focus--Color: var(--pf-c-menu-toggle--m-plain--hover--Color);
@@ -17911,37 +17934,29 @@ ul.pf-c-list {
   justify-content: space-between;
   min-width: var(--pf-c-options-menu__toggle--MinWidth);
   max-width: 100%;
-  padding-left: var(--pf-c-options-menu__toggle--PaddingLeft);
+  padding: var(--pf-c-options-menu__toggle--PaddingTop) var(--pf-c-options-menu__toggle--PaddingRight) var(--pf-c-options-menu__toggle--PaddingBottom) var(--pf-c-options-menu__toggle--PaddingLeft);
   line-height: var(--pf-c-options-menu__toggle--LineHeight);
   color: var(--pf-c-options-menu__toggle--Color);
   background-color: var(--pf-c-options-menu__toggle--BackgroundColor);
   border: none;
 }
-.pf-c-options-menu__toggle:not(.pf-m-text) {
-  padding-top: var(--pf-c-options-menu__toggle--PaddingTop);
-  padding-right: var(--pf-c-options-menu__toggle--PaddingRight);
-  padding-bottom: var(--pf-c-options-menu__toggle--PaddingBottom);
-}
 .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle::before {
   --pf-c-options-menu__toggle--BorderBottomColor: var(--pf-c-options-menu__toggle--expanded--BorderBottomColor);
   border-bottom-width: var(--pf-c-options-menu__toggle--expanded--BorderBottomWidth);
 }
-.pf-c-options-menu__toggle.pf-m-plain {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-options-menu__toggle--PaddingRight: var(--pf-c-options-menu__toggle--m-plain--PaddingRight);
   --pf-c-options-menu__toggle--PaddingLeft: var(--pf-c-options-menu__toggle--m-plain--PaddingLeft);
   display: inline-block;
-}
-.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
-  justify-content: center;
   color: var(--pf-c-options-menu__toggle--m-plain--Color);
 }
-.pf-c-options-menu__toggle.pf-m-plain .pf-c-options-menu__toggle-button-icon {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) .pf-c-options-menu__toggle-button-icon {
   line-height: var(--pf-c-options-menu__toggle--LineHeight);
 }
-.pf-c-options-menu__toggle.pf-m-plain:hover, .pf-c-options-menu__toggle.pf-m-plain:active, .pf-c-options-menu__toggle.pf-m-plain.pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):hover, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-active, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):focus, .pf-c-options-menu.pf-m-expanded > .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text) {
   --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--hover--Color);
 }
-.pf-c-options-menu__toggle.pf-m-plain.pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:disabled {
+.pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text).pf-m-disabled, .pf-c-options-menu__toggle.pf-m-plain:not(.pf-m-text):disabled {
   --pf-c-options-menu__toggle--m-plain--Color: var(--pf-c-options-menu__toggle--m-plain--disabled--Color);
 }
 .pf-c-options-menu__toggle.pf-m-disabled, .pf-c-options-menu__toggle:disabled {
@@ -25918,6 +25933,7 @@ svg.pf-c-spinner.pf-m-xl {
 }
 
 .pf-c-text-input-group {
+  --pf-c-text-input-group--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-text-input-group__text--before--BorderWidth: var(--pf-global--BorderWidth--sm);
   --pf-c-text-input-group__text--before--BorderColor: var(--pf-global--BorderColor--300);
   --pf-c-text-input-group__text--after--BorderBottomWidth: var(--pf-global--BorderWidth--sm);
@@ -25942,12 +25958,24 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-text-input-group__utilities--child--MarginLeft: var(--pf-global--spacer--xs);
   --pf-c-text-input-group__utilities--c-button--PaddingRight: var(--pf-global--spacer--xs);
   --pf-c-text-input-group__utilities--c-button--PaddingLeft: var(--pf-global--spacer--xs);
+  --pf-c-text-input-group--m-disabled--Color: var(--pf-global--disabled-color--100);
+  --pf-c-text-input-group--m-disabled--BackgroundColor: var(--pf-global--disabled-color--300);
   position: relative;
   display: flex;
+  color: var(--pf-c-text-input-group--Color, inherit);
+  background-color: var(--pf-c-text-input-group--BackgroundColor);
 }
 .pf-c-text-input-group:hover {
   --pf-c-text-input-group__text--after--BorderBottomColor: var(--pf-c-text-input-group--hover__text--after--BorderBottomColor);
 }
+.pf-c-text-input-group.pf-m-disabled {
+  --pf-c-text-input-group__text--before--BorderWidth: 0;
+  --pf-c-text-input-group__text--after--BorderBottomWidth: 0;
+  --pf-c-text-input-group--Color: var(--pf-c-text-input-group--m-disabled--Color);
+  --pf-c-text-input-group__icon--Color: var(--pf-c-text-input-group--m-disabled--Color);
+  --pf-c-text-input-group--BackgroundColor: var(--pf-c-text-input-group--m-disabled--BackgroundColor);
+  pointer-events: none;
+}
 
 .pf-c-text-input-group__main {
   display: flex;