@patternfly/patternfly 5.0.0-alpha.21 → 5.0.0-alpha.22

package/docs/demos/Toolbar/examples/Toolbar.md

@@ -2920,53 +2920,65 @@ section: components
           >
             <li class="pf-c-chip-group__list-item">
               <div class="pf-c-chip">
-                <span
-                  class="pf-c-chip__text"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-group-chip-one"
-                >Canceled</span>
-                <button
-                  class="pf-c-button pf-m-plain"
-                  type="button"
-                  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-one"
-                  aria-label="Remove"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-one"
-                >
-                  <i class="fas fa-times" aria-hidden="true"></i>
-                </button>
+                <span class="pf-c-chip__content">
+                  <span
+                    class="pf-c-chip__text"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-group-chip-one"
+                  >Canceled</span>
+                </span>
+                <span class="pf-c-chip__actions">
+                  <button
+                    class="pf-c-button pf-m-plain"
+                    type="button"
+                    aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-one"
+                    aria-label="Remove"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-one"
+                  >
+                    <i class="fas fa-times" aria-hidden="true"></i>
+                  </button>
+                </span>
               </div>
             </li>
             <li class="pf-c-chip-group__list-item">
               <div class="pf-c-chip">
-                <span
-                  class="pf-c-chip__text"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-two"
-                >Paused</span>
-                <button
-                  class="pf-c-button pf-m-plain"
-                  type="button"
-                  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-two"
-                  aria-label="Remove"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-two"
-                >
-                  <i class="fas fa-times" aria-hidden="true"></i>
-                </button>
+                <span class="pf-c-chip__content">
+                  <span
+                    class="pf-c-chip__text"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-two"
+                  >Paused</span>
+                </span>
+                <span class="pf-c-chip__actions">
+                  <button
+                    class="pf-c-button pf-m-plain"
+                    type="button"
+                    aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-two"
+                    aria-label="Remove"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-two"
+                  >
+                    <i class="fas fa-times" aria-hidden="true"></i>
+                  </button>
+                </span>
               </div>
             </li>
             <li class="pf-c-chip-group__list-item">
               <div class="pf-c-chip">
-                <span
-                  class="pf-c-chip__text"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-three"
-                >Restarted</span>
-                <button
-                  class="pf-c-button pf-m-plain"
-                  type="button"
-                  aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-three"
-                  aria-label="Remove"
-                  id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-three"
-                >
-                  <i class="fas fa-times" aria-hidden="true"></i>
-                </button>
+                <span class="pf-c-chip__content">
+                  <span
+                    class="pf-c-chip__text"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-three"
+                  >Restarted</span>
+                </span>
+                <span class="pf-c-chip__actions">
+                  <button
+                    class="pf-c-button pf-m-plain"
+                    type="button"
+                    aria-labelledby="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupchip-three"
+                    aria-label="Remove"
+                    id="toolbar-attribute-value-checkbox-select-filter-desktop-example-chip-groupremove-chip-three"
+                  >
+                    <i class="fas fa-times" aria-hidden="true"></i>
+                  </button>
+                </span>
               </div>
             </li>
           </ul>
@@ -3298,53 +3310,65 @@ section: components
               >
                 <li class="pf-c-chip-group__list-item">
                   <div class="pf-c-chip">
-                    <span
-                      class="pf-c-chip__text"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-one"
-                    >Canceled</span>
-                    <button
-                      class="pf-c-button pf-m-plain"
-                      type="button"
-                      aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-one"
-                      aria-label="Remove"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-one"
-                    >
-                      <i class="fas fa-times" aria-hidden="true"></i>
-                    </button>
+                    <span class="pf-c-chip__content">
+                      <span
+                        class="pf-c-chip__text"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-one"
+                      >Canceled</span>
+                    </span>
+                    <span class="pf-c-chip__actions">
+                      <button
+                        class="pf-c-button pf-m-plain"
+                        type="button"
+                        aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-one toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-one"
+                        aria-label="Remove"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-one"
+                      >
+                        <i class="fas fa-times" aria-hidden="true"></i>
+                      </button>
+                    </span>
                   </div>
                 </li>
                 <li class="pf-c-chip-group__list-item">
                   <div class="pf-c-chip">
-                    <span
-                      class="pf-c-chip__text"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-two"
-                    >Paused</span>
-                    <button
-                      class="pf-c-button pf-m-plain"
-                      type="button"
-                      aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-two"
-                      aria-label="Remove"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-two"
-                    >
-                      <i class="fas fa-times" aria-hidden="true"></i>
-                    </button>
+                    <span class="pf-c-chip__content">
+                      <span
+                        class="pf-c-chip__text"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-two"
+                      >Paused</span>
+                    </span>
+                    <span class="pf-c-chip__actions">
+                      <button
+                        class="pf-c-button pf-m-plain"
+                        type="button"
+                        aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-two toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-two"
+                        aria-label="Remove"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-two"
+                      >
+                        <i class="fas fa-times" aria-hidden="true"></i>
+                      </button>
+                    </span>
                   </div>
                 </li>
                 <li class="pf-c-chip-group__list-item">
                   <div class="pf-c-chip">
-                    <span
-                      class="pf-c-chip__text"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-three"
-                    >Restarted</span>
-                    <button
-                      class="pf-c-button pf-m-plain"
-                      type="button"
-                      aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-three"
-                      aria-label="Remove"
-                      id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-three"
-                    >
-                      <i class="fas fa-times" aria-hidden="true"></i>
-                    </button>
+                    <span class="pf-c-chip__content">
+                      <span
+                        class="pf-c-chip__text"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-three"
+                      >Restarted</span>
+                    </span>
+                    <span class="pf-c-chip__actions">
+                      <button
+                        class="pf-c-button pf-m-plain"
+                        type="button"
+                        aria-labelledby="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-three toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupchip-three"
+                        aria-label="Remove"
+                        id="toolbar-attribute-value-checkbox-select-filter-mobile-example-chip-groupremove-chip-three"
+                      >
+                        <i class="fas fa-times" aria-hidden="true"></i>
+                      </button>
+                    </span>
                   </div>
                 </li>
               </ul>

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@patternfly/patternfly",
   "description": "Assets, source, tooling, and content for PatternFly 4",
-  "version": "5.0.0-alpha.21",
+  "version": "5.0.0-alpha.22",
   "keywords": [],
   "license": "MIT",
   "scripts": {
@@ -42,7 +42,7 @@
     "@commitlint/config-conventional": "^17.4.2",
     "@fortawesome/fontawesome": "^1.1.8",
     "@octokit/rest": "^19.0.7",
-    "@patternfly/documentation-framework": "1.9.1",
+    "@patternfly/documentation-framework": "1.10.0",
     "@patternfly/patternfly-a11y": "4.3.1",
     "@patternfly/react-code-editor": "4.82.113",
     "@patternfly/react-core": "4.276.6",

package/patternfly-no-reset.css

@@ -8504,18 +8504,19 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-chip--m-draggable--BackgroundColor: var(--pf-global--BackgroundColor--200);
   --pf-c-chip--m-draggable--BoxShadow: var(--pf-global--BoxShadow--sm);
   --pf-c-chip--m-draggable__icon--FontSize: var(--pf-global--icon--FontSize--sm);
-  --pf-c-chip__text--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-chip__content--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-chip__content--ColumnGap: var(--pf-global--spacer--xs);
   --pf-c-chip__text--Color: var(--pf-global--Color--100);
   --pf-c-chip__text--MaxWidth: 16ch;
-  --pf-c-chip__c-button--PaddingTop: var(--pf-global--spacer--xs);
-  --pf-c-chip__c-button--PaddingRight: var(--pf-global--spacer--sm);
-  --pf-c-chip__c-button--PaddingBottom: var(--pf-global--spacer--xs);
-  --pf-c-chip__c-button--PaddingLeft: var(--pf-global--spacer--sm);
-  --pf-c-chip__c-button--MarginTop: calc(var(--pf-c-chip--PaddingTop) * -1);
-  --pf-c-chip__c-button--MarginRight: calc(var(--pf-c-chip--PaddingRight) / 2 * -1);
-  --pf-c-chip__c-button--MarginBottom: calc(var(--pf-c-chip--PaddingBottom) * -1);
-  --pf-c-chip__c-button--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-chip__c-badge--MarginLeft: var(--pf-global--spacer--xs);
+  --pf-c-chip__actions--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-chip__actions--c-button--PaddingTop: var(--pf-global--spacer--xs);
+  --pf-c-chip__actions--c-button--PaddingRight: var(--pf-global--spacer--sm);
+  --pf-c-chip__actions--c-button--PaddingBottom: var(--pf-global--spacer--xs);
+  --pf-c-chip__actions--c-button--PaddingLeft: var(--pf-global--spacer--sm);
+  --pf-c-chip__actions--c-button--MarginTop: calc(var(--pf-c-chip--PaddingTop) * -1);
+  --pf-c-chip__actions--c-button--MarginRight: calc(var(--pf-c-chip--PaddingRight) / 2 * -1);
+  --pf-c-chip__actions--c-button--MarginBottom: calc(var(--pf-c-chip--PaddingBottom) * -1);
+  --pf-c-chip__actions--c-button--FontSize: var(--pf-global--FontSize--xs);
   --pf-c-chip__icon--MarginLeft: var(--pf-global--spacer--sm);
   color: var(--pf-global--Color--100);
   position: relative;
@@ -8550,19 +8551,6 @@ label.pf-c-check, .pf-c-check__label,
 .pf-c-chip.pf-m-draggable .pf-c-chip__icon {
   font-size: var(--pf-c-chip--m-draggable__icon--FontSize);
 }
-.pf-c-chip .pf-c-button {
-  --pf-c-button--PaddingTop: var(--pf-c-chip__c-button--PaddingTop);
-  --pf-c-button--PaddingRight: var(--pf-c-chip__c-button--PaddingRight);
-  --pf-c-button--PaddingBottom: var(--pf-c-chip__c-button--PaddingBottom);
-  --pf-c-button--PaddingLeft: var(--pf-c-chip__c-button--PaddingLeft);
-  --pf-c-button--FontSize: var(--pf-c-chip__c-button--FontSize);
-  margin-top: var(--pf-c-chip__c-button--MarginTop);
-  margin-right: var(--pf-c-chip__c-button--MarginRight);
-  margin-bottom: var(--pf-c-chip__c-button--MarginBottom);
-}
-.pf-c-chip .pf-c-badge {
-  margin-left: var(--pf-c-chip__c-badge--MarginLeft);
-}
 
 .pf-c-chip__text {
   overflow: hidden;
@@ -8570,7 +8558,6 @@ label.pf-c-check, .pf-c-check__label,
   white-space: nowrap;
   position: relative;
   max-width: var(--pf-c-chip__text--MaxWidth);
-  font-size: var(--pf-c-chip__text--FontSize);
   color: var(--pf-c-chip__text--Color);
 }
 
@@ -8579,6 +8566,28 @@ label.pf-c-check, .pf-c-check__label,
   margin-left: var(--pf-c-chip__icon--MarginLeft);
 }
 
+.pf-c-chip__content {
+  display: flex;
+  align-items: center;
+  column-gap: var(--pf-c-chip__content--ColumnGap);
+  font-size: var(--pf-c-chip__content--FontSize);
+}
+
+.pf-c-chip__actions {
+  font-size: var(--pf-c-chip__actions--FontSize);
+}
+.pf-c-chip__actions .pf-c-button {
+  --pf-c-button--PaddingTop: var(--pf-c-chip__actions--c-button--PaddingTop);
+  --pf-c-button--PaddingRight: var(--pf-c-chip__actions--c-button--PaddingRight);
+  --pf-c-button--PaddingBottom: var(--pf-c-chip__actions--c-button--PaddingBottom);
+  --pf-c-button--PaddingLeft: var(--pf-c-chip__actions--c-button--PaddingLeft);
+  --pf-c-button--FontSize: var(--pf-c-chip__actions--c-button--FontSize);
+  margin-top: var(--pf-c-chip__actions--c-button--MarginTop);
+  margin-right: var(--pf-c-chip__actions--c-button--MarginRight);
+  margin-bottom: var(--pf-c-chip__actions--c-button--MarginBottom);
+  line-height: 1;
+}
+
 :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
 :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-],
 :where(.pf-theme-dark) .pf-c-page__header, :where(.pf-theme-dark) .pf-c-masthead, :where(.pf-theme-dark) .pf-c-login__header,
@@ -16348,6 +16357,7 @@ label.pf-c-input-group__text {
   --pf-c-label--PaddingRight: var(--pf-global--spacer--sm);
   --pf-c-label--PaddingBottom: var(--pf-global--spacer--xs);
   --pf-c-label--PaddingLeft: var(--pf-global--spacer--sm);
+  --pf-c-label--MaxWidth: 100%;
   --pf-c-label--BorderRadius: var(--pf-global--BorderRadius--lg);
   --pf-c-label--BackgroundColor: var(--pf-global--palette--black-150);
   --pf-c-label--Color: var(--pf-global--Color--100);
@@ -16454,18 +16464,18 @@ label.pf-c-input-group__text {
   --pf-c-label__content--MaxWidth: 100%;
   --pf-c-label--m-outline__content--Color: var(--pf-global--Color--100);
   --pf-c-label--m-editable__content--MaxWidth: 16ch;
-  --pf-c-label__text--MaxWidth: 16ch;
+  --pf-c-label__text--MaxWidth: 100%;
   --pf-c-label__icon--Color: var(--pf-global--Color--100);
   --pf-c-label__icon--MarginRight: var(--pf-global--spacer--xs);
-  --pf-c-label__c-button--FontSize: var(--pf-global--FontSize--xs);
-  --pf-c-label__c-button--MarginTop: calc(var(--pf-global--spacer--form-element) * -1);
-  --pf-c-label__c-button--MarginRight: calc(var(--pf-global--spacer--form-element) * -1);
-  --pf-c-label__c-button--MarginBottom: calc(var(--pf-global--spacer--form-element) * -1);
-  --pf-c-label__c-button--MarginLeft: var(--pf-global--spacer--xs);
-  --pf-c-label__c-button--PaddingTop: var(--pf-global--spacer--xs);
-  --pf-c-label__c-button--PaddingRight: var(--pf-global--spacer--sm);
-  --pf-c-label__c-button--PaddingBottom: var(--pf-global--spacer--xs);
-  --pf-c-label__c-button--PaddingLeft: var(--pf-global--spacer--sm);
+  --pf-c-label__actions--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-label__actions--MarginRight: calc(var(--pf-c-label__actions--c-button--PaddingRight) * -1);
+  --pf-c-label__actions--c-button--FontSize: var(--pf-global--FontSize--xs);
+  --pf-c-label__actions--c-button--MarginTop: calc(var(--pf-c-label__actions--c-button--PaddingTop) * -1);
+  --pf-c-label__actions--c-button--MarginBottom: calc(var(--pf-c-label__actions--c-button--PaddingBottom) * -1);
+  --pf-c-label__actions--c-button--PaddingTop: var(--pf-global--spacer--xs);
+  --pf-c-label__actions--c-button--PaddingRight: var(--pf-global--spacer--sm);
+  --pf-c-label__actions--c-button--PaddingBottom: var(--pf-global--spacer--xs);
+  --pf-c-label__actions--c-button--PaddingLeft: var(--pf-global--spacer--sm);
   --pf-c-label--m-editable--Cursor: pointer;
   --pf-c-label--m-editable--TextDecoration: underline;
   --pf-c-label--m-editable--TextDecorationStyle: dashed;
@@ -16486,6 +16496,7 @@ label.pf-c-input-group__text {
   --pf-c-label--m-editable--m-editable-active__content--before--BorderWidth: 0;
   --pf-c-label--m-editable--m-editable-active__content--before--BorderColor: transparent;
   position: relative;
+  max-width: var(--pf-c-label--MaxWidth);
   padding: var(--pf-c-label--PaddingTop) var(--pf-c-label--PaddingRight) var(--pf-c-label--PaddingBottom) var(--pf-c-label--PaddingLeft);
   font-size: var(--pf-c-label--FontSize);
   color: var(--pf-c-label--Color);
@@ -16657,17 +16668,6 @@ label.pf-c-input-group__text {
   --pf-c-label--m-editable--TextDecoration: var(--pf-c-label--m-editable--m-editable-active--TextDecoration);
   --pf-c-label--BackgroundColor: var(--pf-c-label--m-editable--m-editable-active--BackgroundColor);
 }
-.pf-c-label .pf-c-button {
-  --pf-c-button--FontSize: var(--pf-c-label__c-button--FontSize);
-  --pf-c-button--PaddingTop: var(--pf-c-label__c-button--PaddingTop);
-  --pf-c-button--PaddingRight: var(--pf-c-label__c-button--PaddingRight);
-  --pf-c-button--PaddingBottom: var(--pf-c-label__c-button--PaddingBottom);
-  --pf-c-button--PaddingLeft: var(--pf-c-label__c-button--PaddingLeft);
-  margin-top: var(--pf-c-label__c-button--MarginTop);
-  margin-right: var(--pf-c-label__c-button--MarginRight);
-  margin-bottom: var(--pf-c-label__c-button--MarginBottom);
-  margin-left: var(--pf-c-label__c-button--MarginLeft);
-}
 .pf-c-label.pf-m-overflow, .pf-c-label.pf-m-add {
   --pf-c-label__content--Color: var(--pf-c-label--m-overflow__content--Color);
   --pf-c-label--BackgroundColor: var(--pf-c-label--m-overflow__content--BackgroundColor);
@@ -16693,10 +16693,8 @@ label.pf-c-input-group__text {
 }
 
 .pf-c-label__content {
-  overflow: hidden;
-  text-overflow: ellipsis;
-  white-space: nowrap;
   max-width: var(--pf-c-label__content--MaxWidth);
+  overflow: hidden;
   color: var(--pf-c-label__content--Color);
   background-color: var(--pf-c-label__content--BackgroundColor);
   border-width: 0;
@@ -16712,9 +16710,17 @@ label.pf-c-input-group__text {
   border: var(--pf-c-label__content--before--BorderWidth) solid var(--pf-c-label__content--before--BorderColor);
   border-radius: var(--pf-c-label--BorderRadius);
 }
+input.pf-c-label__content {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
 a.pf-c-label__content,
 button.pf-c-label__content {
+  padding: 0;
   cursor: pointer;
+  background-color: transparent;
   border: none;
 }
 a.pf-c-label__content, a.pf-c-label__content:hover, a.pf-c-label__content:focus,
@@ -16739,6 +16745,20 @@ button.pf-c-label__content:focus {
   color: var(--pf-c-label__icon--Color);
 }
 
+.pf-c-label__actions {
+  margin-right: var(--pf-c-label__actions--MarginRight);
+  font-size: var(--pf-c-label__actions--FontSize);
+}
+.pf-c-label__actions .pf-c-button {
+  --pf-c-button--FontSize: var(--pf-c-label__actions--c-button--FontSize);
+  --pf-c-button--PaddingTop: var(--pf-c-label__actions--c-button--PaddingTop);
+  --pf-c-button--PaddingRight: var(--pf-c-label__actions--c-button--PaddingRight);
+  --pf-c-button--PaddingBottom: var(--pf-c-label__actions--c-button--PaddingBottom);
+  --pf-c-button--PaddingLeft: var(--pf-c-label__actions--c-button--PaddingLeft);
+  margin-top: var(--pf-c-label__actions--c-button--MarginTop);
+  margin-bottom: var(--pf-c-label__actions--c-button--MarginBottom);
+}
+
 :where(.pf-theme-dark) .pf-c-wizard__header, :where(.pf-theme-dark) .pf-c-page__sidebar-body.pf-m-menu .pf-c-context-selector,
 :where(.pf-theme-dark) .pf-c-page__main-section[class*=pf-m-dark-],
 :where(.pf-theme-dark) .pf-c-page__header, :where(.pf-theme-dark) .pf-c-masthead, :where(.pf-theme-dark) .pf-c-login__header,
@@ -28932,10 +28952,20 @@ svg.pf-c-spinner.pf-m-xl {
   --pf-c-table--m-tree-view__toggle--Left: var(--pf-c-table__tree-view-main--PaddingLeft);
   --pf-c-table--m-tree-view__toggle--TranslateX: -100%;
   --pf-c-table--m-tree-view__toggle__toggle-icon--MinWidth: var(--pf-global--FontSize--md);
+  --pf-c-table--m-no-inset__tree-view-main--PaddingLeft: 0;
+  --pf-c-table--m-no-inset__tree-view-main--MarginLeft: 0;
 }
 .pf-c-table.pf-m-tree-view > tbody > tr {
   --pf-c-table--m-tree-view__toggle--Left: var(--pf-c-table__tree-view-main--PaddingLeft);
 }
+.pf-c-table.pf-m-tree-view > tbody > tr.pf-m-no-inset {
+  --pf-c-table__tree-view-main--PaddingLeft: var(--pf-c-table--m-no-inset__tree-view-main--PaddingLeft);
+  --pf-c-table__tree-view-main--MarginLeft: var(--pf-c-table--m-no-inset__tree-view-main--MarginLeft);
+}
+.pf-c-table.pf-m-tree-view.pf-m-no-inset {
+  --pf-c-table__tree-view-main--PaddingLeft: var(--pf-c-table--m-no-inset__tree-view-main--PaddingLeft);
+  --pf-c-table__tree-view-main--MarginLeft: var(--pf-c-table--m-no-inset__tree-view-main--MarginLeft);
+}
 .pf-c-table.pf-m-tree-view tr[aria-level="2"] {
   --pf-c-table__tree-view-main--PaddingLeft: calc(var(--pf-c-table__tree-view-main--nested-indent--base) * 1 + var(--pf-c-table__tree-view-main--indent--base));
 }