@patternfly/react-styles 6.0.0-alpha.2 → 6.0.0-alpha.20

package/css/components/MenuToggle/menu-toggle.d.ts

@@ -1,29 +1,33 @@
 import './menu-toggle.css';
 declare const _default: {
-  "check": "pf-v5-c-check",
-  "checkInput": "pf-v5-c-check__input",
-  "menuToggle": "pf-v5-c-menu-toggle",
-  "menuToggleButton": "pf-v5-c-menu-toggle__button",
-  "menuToggleControls": "pf-v5-c-menu-toggle__controls",
-  "menuToggleCount": "pf-v5-c-menu-toggle__count",
-  "menuToggleIcon": "pf-v5-c-menu-toggle__icon",
-  "menuToggleText": "pf-v5-c-menu-toggle__text",
-  "menuToggleToggleIcon": "pf-v5-c-menu-toggle__toggle-icon",
+  "button": "pf-v6-c-button",
+  "check": "pf-v6-c-check",
+  "checkInput": "pf-v6-c-check__input",
+  "menuToggle": "pf-v6-c-menu-toggle",
+  "menuToggleButton": "pf-v6-c-menu-toggle__button",
+  "menuToggleControls": "pf-v6-c-menu-toggle__controls",
+  "menuToggleCount": "pf-v6-c-menu-toggle__count",
+  "menuToggleIcon": "pf-v6-c-menu-toggle__icon",
+  "menuToggleStatusIcon": "pf-v6-c-menu-toggle__status-icon",
+  "menuToggleText": "pf-v6-c-menu-toggle__text",
+  "menuToggleToggleIcon": "pf-v6-c-menu-toggle__toggle-icon",
   "modifiers": {
     "primary": "pf-m-primary",
     "secondary": "pf-m-secondary",
-    "expanded": "pf-m-expanded",
-    "plain": "pf-m-plain",
-    "text": "pf-m-text",
     "fullHeight": "pf-m-full-height",
+    "fullWidth": "pf-m-full-width",
+    "plain": "pf-m-plain",
+    "expanded": "pf-m-expanded",
+    "active": "pf-m-active",
     "disabled": "pf-m-disabled",
-    "typeahead": "pf-m-typeahead",
+    "small": "pf-m-small",
+    "success": "pf-m-success",
+    "warning": "pf-m-warning",
+    "danger": "pf-m-danger",
     "splitButton": "pf-m-split-button",
     "action": "pf-m-action",
-    "active": "pf-m-active",
-    "fullWidth": "pf-m-full-width"
+    "typeahead": "pf-m-typeahead"
   },
-  "textInputGroup": "pf-v5-c-text-input-group",
-  "themeDark": "pf-v5-theme-dark"
+  "textInputGroup": "pf-v6-c-text-input-group"
 };
 export default _default;

package/css/components/MenuToggle/menu-toggle.js

@@ -2,29 +2,33 @@
 exports.__esModule = true;
 require('./menu-toggle.css');
 exports.default = {
-  "check": "pf-v5-c-check",
-  "checkInput": "pf-v5-c-check__input",
-  "menuToggle": "pf-v5-c-menu-toggle",
-  "menuToggleButton": "pf-v5-c-menu-toggle__button",
-  "menuToggleControls": "pf-v5-c-menu-toggle__controls",
-  "menuToggleCount": "pf-v5-c-menu-toggle__count",
-  "menuToggleIcon": "pf-v5-c-menu-toggle__icon",
-  "menuToggleText": "pf-v5-c-menu-toggle__text",
-  "menuToggleToggleIcon": "pf-v5-c-menu-toggle__toggle-icon",
+  "button": "pf-v6-c-button",
+  "check": "pf-v6-c-check",
+  "checkInput": "pf-v6-c-check__input",
+  "menuToggle": "pf-v6-c-menu-toggle",
+  "menuToggleButton": "pf-v6-c-menu-toggle__button",
+  "menuToggleControls": "pf-v6-c-menu-toggle__controls",
+  "menuToggleCount": "pf-v6-c-menu-toggle__count",
+  "menuToggleIcon": "pf-v6-c-menu-toggle__icon",
+  "menuToggleStatusIcon": "pf-v6-c-menu-toggle__status-icon",
+  "menuToggleText": "pf-v6-c-menu-toggle__text",
+  "menuToggleToggleIcon": "pf-v6-c-menu-toggle__toggle-icon",
   "modifiers": {
     "primary": "pf-m-primary",
     "secondary": "pf-m-secondary",
-    "expanded": "pf-m-expanded",
-    "plain": "pf-m-plain",
-    "text": "pf-m-text",
     "fullHeight": "pf-m-full-height",
+    "fullWidth": "pf-m-full-width",
+    "plain": "pf-m-plain",
+    "expanded": "pf-m-expanded",
+    "active": "pf-m-active",
     "disabled": "pf-m-disabled",
-    "typeahead": "pf-m-typeahead",
+    "small": "pf-m-small",
+    "success": "pf-m-success",
+    "warning": "pf-m-warning",
+    "danger": "pf-m-danger",
     "splitButton": "pf-m-split-button",
     "action": "pf-m-action",
-    "active": "pf-m-active",
-    "fullWidth": "pf-m-full-width"
+    "typeahead": "pf-m-typeahead"
   },
-  "textInputGroup": "pf-v5-c-text-input-group",
-  "themeDark": "pf-v5-theme-dark"
+  "textInputGroup": "pf-v6-c-text-input-group"
 };

package/css/components/MenuToggle/menu-toggle.mjs

@@ -1,28 +1,32 @@
 import './menu-toggle.css';
 export default {
-  "check": "pf-v5-c-check",
-  "checkInput": "pf-v5-c-check__input",
-  "menuToggle": "pf-v5-c-menu-toggle",
-  "menuToggleButton": "pf-v5-c-menu-toggle__button",
-  "menuToggleControls": "pf-v5-c-menu-toggle__controls",
-  "menuToggleCount": "pf-v5-c-menu-toggle__count",
-  "menuToggleIcon": "pf-v5-c-menu-toggle__icon",
-  "menuToggleText": "pf-v5-c-menu-toggle__text",
-  "menuToggleToggleIcon": "pf-v5-c-menu-toggle__toggle-icon",
+  "button": "pf-v6-c-button",
+  "check": "pf-v6-c-check",
+  "checkInput": "pf-v6-c-check__input",
+  "menuToggle": "pf-v6-c-menu-toggle",
+  "menuToggleButton": "pf-v6-c-menu-toggle__button",
+  "menuToggleControls": "pf-v6-c-menu-toggle__controls",
+  "menuToggleCount": "pf-v6-c-menu-toggle__count",
+  "menuToggleIcon": "pf-v6-c-menu-toggle__icon",
+  "menuToggleStatusIcon": "pf-v6-c-menu-toggle__status-icon",
+  "menuToggleText": "pf-v6-c-menu-toggle__text",
+  "menuToggleToggleIcon": "pf-v6-c-menu-toggle__toggle-icon",
   "modifiers": {
     "primary": "pf-m-primary",
     "secondary": "pf-m-secondary",
-    "expanded": "pf-m-expanded",
-    "plain": "pf-m-plain",
-    "text": "pf-m-text",
     "fullHeight": "pf-m-full-height",
+    "fullWidth": "pf-m-full-width",
+    "plain": "pf-m-plain",
+    "expanded": "pf-m-expanded",
+    "active": "pf-m-active",
     "disabled": "pf-m-disabled",
-    "typeahead": "pf-m-typeahead",
+    "small": "pf-m-small",
+    "success": "pf-m-success",
+    "warning": "pf-m-warning",
+    "danger": "pf-m-danger",
     "splitButton": "pf-m-split-button",
     "action": "pf-m-action",
-    "active": "pf-m-active",
-    "fullWidth": "pf-m-full-width"
+    "typeahead": "pf-m-typeahead"
   },
-  "textInputGroup": "pf-v5-c-text-input-group",
-  "themeDark": "pf-v5-theme-dark"
+  "textInputGroup": "pf-v6-c-text-input-group"
 };

package/css/components/ModalBox/modal-box.css

@@ -1,187 +1,198 @@
-.pf-v5-c-modal-box {
-  --pf-v5-c-modal-box--BackgroundColor: var(--pf-v5-global--BackgroundColor--100);
-  --pf-v5-c-modal-box--BoxShadow: var(--pf-v5-global--BoxShadow--xl);
-  --pf-v5-c-modal-box--ZIndex: var(--pf-v5-global--ZIndex--xl);
-  --pf-v5-c-modal-box--Width: 100%;
-  --pf-v5-c-modal-box--MaxWidth: calc(100% - var(--pf-v5-global--spacer--xl));
-  --pf-v5-c-modal-box--m-sm--sm--MaxWidth: 35rem;
-  --pf-v5-c-modal-box--m-md--Width: 52.5rem;
-  --pf-v5-c-modal-box--m-lg--lg--MaxWidth: 70rem;
-  --pf-v5-c-modal-box--MaxHeight: calc(100% - var(--pf-v5-global--spacer--2xl));
-  --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-modal-box--m-align-top--xl--spacer: var(--pf-v5-global--spacer--xl);
-  --pf-v5-c-modal-box--m-align-top--MarginTop: var(--pf-v5-c-modal-box--m-align-top--spacer);
-  --pf-v5-c-modal-box--m-align-top--MaxHeight: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer), var(--pf-v5-global--spacer--2xl)) - var(--pf-v5-c-modal-box--m-align-top--spacer));
-  --pf-v5-c-modal-box--m-align-top--MaxWidth: calc(100% - min(var(--pf-v5-c-modal-box--m-align-top--spacer) * 2, var(--pf-v5-global--spacer--xl)));
-  --pf-v5-c-modal-box--m-danger__title-icon--Color: var(--pf-v5-global--danger-color--100);
-  --pf-v5-c-modal-box--m-warning__title-icon--Color: var(--pf-v5-global--warning-color--100);
-  --pf-v5-c-modal-box--m-success__title-icon--Color: var(--pf-v5-global--success-color--100);
-  --pf-v5-c-modal-box--m-info__title-icon--Color: var(--pf-v5-global--info-color--100);
-  --pf-v5-c-modal-box--m-custom__title-icon--Color: var(--pf-v5-global--custom-color--200);
-  --pf-v5-c-modal-box__header--PaddingTop: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__header--PaddingRight: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__header--PaddingLeft: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__header--last-child--PaddingBottom: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__title--LineHeight: var(--pf-v5-global--LineHeight--sm);
-  --pf-v5-c-modal-box__title--FontFamily: var(--pf-v5-global--FontFamily--heading);
-  --pf-v5-c-modal-box__title--FontSize: var(--pf-v5-global--FontSize--2xl);
-  --pf-v5-c-modal-box__title-icon--MarginRight: var(--pf-v5-global--spacer--sm);
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-global--Color--100);
-  --pf-v5-c-modal-box__description--PaddingTop: var(--pf-v5-global--spacer--xs);
-  --pf-v5-c-modal-box__body--MinHeight: calc(var(--pf-v5-global--FontSize--md) * var(--pf-v5-global--LineHeight--md));
-  --pf-v5-c-modal-box__body--PaddingTop: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__body--PaddingRight: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__body--PaddingLeft: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__body--last-child--PaddingBottom: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__header--body--PaddingTop: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-modal-box__close--Top: calc(var(--pf-v5-global--spacer--lg));
-  --pf-v5-c-modal-box__close--Right: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-modal-box__close--sibling--MarginRight: calc(var(--pf-v5-global--spacer--xl) + var(--pf-v5-global--spacer--sm));
-  --pf-v5-c-modal-box__footer--PaddingTop: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__footer--PaddingRight: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__footer--PaddingBottom: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__footer--PaddingLeft: var(--pf-v5-global--spacer--lg);
-  --pf-v5-c-modal-box__footer--c-button--MarginRight: var(--pf-v5-global--spacer--md);
-  --pf-v5-c-modal-box__footer--c-button--sm--MarginRight: calc(var(--pf-v5-c-modal-box__footer--c-button--MarginRight) / 2);
-  position: relative;
-  z-index: var(--pf-v5-c-modal-box--ZIndex);
-  display: flex;
-  flex-direction: column;
-  width: var(--pf-v5-c-modal-box--Width);
-  max-width: var(--pf-v5-c-modal-box--MaxWidth);
-  max-height: var(--pf-v5-c-modal-box--MaxHeight);
-  background-color: var(--pf-v5-c-modal-box--BackgroundColor);
-  box-shadow: var(--pf-v5-c-modal-box--BoxShadow);
+:root {
+  --pf-v6-c-modal-box--BackgroundColor: var(--pf-t--global--background--color--floating--default);
+  --pf-v6-c-modal-box--BorderRadius: var(--pf-t--global--border--radius--large);
+  --pf-v6-c-modal-box--BoxShadow: var(--pf-t--global--box-shadow--lg);
+  --pf-v6-c-modal-box--ZIndex: var(--pf-t--global--z-index--xl);
+  --pf-v6-c-modal-box--Width: 100%;
+  --pf-v6-c-modal-box--MaxWidth: calc(100% - var(--pf-t--global--spacer--xl));
+  --pf-v6-c-modal-box--m-sm--sm--MaxWidth: 35rem;
+  --pf-v6-c-modal-box--m-md--Width: 52.5rem;
+  --pf-v6-c-modal-box--m-lg--lg--MaxWidth: 70rem;
+  --pf-v6-c-modal-box--MaxHeight: calc(100% - var(--pf-t--global--spacer--2xl));
+  --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-modal-box--m-align-top--xl--spacer: var(--pf-t--global--spacer--xl);
+  --pf-v6-c-modal-box--m-align-top--Top: var(--pf-v6-c-modal-box--m-align-top--spacer);
+  --pf-v6-c-modal-box--m-align-top--MaxHeight: calc(100% - min(var(--pf-v6-c-modal-box--m-align-top--spacer), var(--pf-t--global--spacer--2xl)) - var(--pf-v6-c-modal-box--m-align-top--spacer));
+  --pf-v6-c-modal-box--m-align-top--MaxWidth: calc(100% - min(var(--pf-v6-c-modal-box--m-align-top--spacer) * 2, var(--pf-t--global--spacer--xl)));
+  --pf-v6-c-modal-box--m-danger__title-icon--Color: var(--pf-t--global--icon--color--status--danger--default);
+  --pf-v6-c-modal-box--m-warning__title-icon--Color: var(--pf-t--global--icon--color--status--warning--default);
+  --pf-v6-c-modal-box--m-success__title-icon--Color: var(--pf-t--global--icon--color--status--success--default);
+  --pf-v6-c-modal-box--m-info__title-icon--Color: var(--pf-t--global--icon--color--status--info--default);
+  --pf-v6-c-modal-box--m-custom__title-icon--Color: var(--pf-t--global--icon--color--status--custom--default);
+  --pf-v6-c-modal-box__header--PaddingTop: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--PaddingRight: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--Gap: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__header-main--Gap: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__title--LineHeight: var(--pf-t--global--font--line-height--heading);
+  --pf-v6-c-modal-box__title--FontFamily: var(--pf-t--global--font--family--heading);
+  --pf-v6-c-modal-box__title--FontSize: var(--pf-t--global--font--size--heading--md);
+  --pf-v6-c-modal-box__title-icon--MarginRight: var(--pf-t--global--spacer--sm);
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-t--global--icon--color--regular);
+  --pf-v6-c-modal-box__description--FontSize: var(--pf-t--global--font--size--body--sm);
+  --pf-v6-c-modal-box__description--Color: var(--pf-t--global--text--color--subtle);
+  --pf-v6-c-modal-box__body--MinHeight: calc(var(--pf-t--global--font--size--body--default) * var(--pf-t--global--font--line-height--body));
+  --pf-v6-c-modal-box__body--PaddingTop: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--PaddingRight: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__body--last-child--PaddingBottom: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__header--body--PaddingTop: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__close--Top: var(--pf-v6-c-modal-box__header--PaddingTop);
+  --pf-v6-c-modal-box__close--Right: var(--pf-v6-c-modal-box__header--PaddingRight);
+  --pf-v6-c-modal-box__close--sibling--MarginRight: calc(var(--pf-t--global--spacer--xl) + var(--pf-t--global--spacer--sm));
+  --pf-v6-c-modal-box__footer--PaddingTop: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingRight: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingBottom: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--PaddingLeft: var(--pf-t--global--spacer--lg);
+  --pf-v6-c-modal-box__footer--c-button--MarginRight: var(--pf-t--global--spacer--md);
+  --pf-v6-c-modal-box__footer--c-button--sm--MarginRight: calc(var(--pf-v6-c-modal-box__footer--c-button--MarginRight) / 2);
 }
 @media (min-width: 1200px) {
-  .pf-v5-c-modal-box {
-    --pf-v5-c-modal-box--m-align-top--spacer: var(--pf-v5-c-modal-box--m-align-top--xl--spacer);
+  :root {
+    --pf-v6-c-modal-box--m-align-top--spacer: var(--pf-v6-c-modal-box--m-align-top--xl--spacer);
   }
 }
-.pf-v5-c-modal-box.pf-m-sm {
-  --pf-v5-c-modal-box--Width: var(--pf-v5-c-modal-box--m-sm--sm--MaxWidth);
+
+.pf-v6-c-modal-box {
+  position: relative;
+  z-index: var(--pf-v6-c-modal-box--ZIndex);
+  display: flex;
+  flex-direction: column;
+  width: var(--pf-v6-c-modal-box--Width);
+  max-width: var(--pf-v6-c-modal-box--MaxWidth);
+  max-height: var(--pf-v6-c-modal-box--MaxHeight);
+  overflow: auto;
+  background-color: var(--pf-v6-c-modal-box--BackgroundColor);
+  border-radius: var(--pf-v6-c-modal-box--BorderRadius);
+  box-shadow: var(--pf-v6-c-modal-box--BoxShadow);
 }
-.pf-v5-c-modal-box.pf-m-md {
-  --pf-v5-c-modal-box--Width: var(--pf-v5-c-modal-box--m-md--Width);
+.pf-v6-c-modal-box.pf-m-sm {
+  --pf-v6-c-modal-box--Width: var(--pf-v6-c-modal-box--m-sm--sm--MaxWidth);
 }
-.pf-v5-c-modal-box.pf-m-lg {
-  --pf-v5-c-modal-box--Width: var(--pf-v5-c-modal-box--m-lg--lg--MaxWidth);
+.pf-v6-c-modal-box.pf-m-md {
+  --pf-v6-c-modal-box--Width: var(--pf-v6-c-modal-box--m-md--Width);
 }
-.pf-v5-c-modal-box.pf-m-align-top {
-  inset-block-start: var(--pf-v5-c-modal-box--m-align-top--MarginTop);
+.pf-v6-c-modal-box.pf-m-lg {
+  --pf-v6-c-modal-box--Width: var(--pf-v6-c-modal-box--m-lg--lg--MaxWidth);
+}
+.pf-v6-c-modal-box.pf-m-align-top {
+  inset-block-start: var(--pf-v6-c-modal-box--m-align-top--Top);
   align-self: flex-start;
-  max-width: var(--pf-v5-c-modal-box--m-align-top--MaxWidth);
-  max-height: var(--pf-v5-c-modal-box--m-align-top--MaxHeight);
+  max-width: var(--pf-v6-c-modal-box--m-align-top--MaxWidth);
+  max-height: var(--pf-v6-c-modal-box--m-align-top--MaxHeight);
 }
-.pf-v5-c-modal-box.pf-m-danger {
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-c-modal-box--m-danger__title-icon--Color);
+.pf-v6-c-modal-box__title.pf-m-danger, .pf-v6-c-modal-box.pf-m-danger {
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-v6-c-modal-box--m-danger__title-icon--Color);
 }
-.pf-v5-c-modal-box.pf-m-warning {
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-c-modal-box--m-warning__title-icon--Color);
+
+.pf-v6-c-modal-box__title.pf-m-warning, .pf-v6-c-modal-box.pf-m-warning {
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-v6-c-modal-box--m-warning__title-icon--Color);
 }
-.pf-v5-c-modal-box.pf-m-success {
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-c-modal-box--m-success__title-icon--Color);
+
+.pf-v6-c-modal-box__title.pf-m-success, .pf-v6-c-modal-box.pf-m-success {
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-v6-c-modal-box--m-success__title-icon--Color);
 }
-.pf-v5-c-modal-box.pf-m-custom {
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-c-modal-box--m-custom__title-icon--Color);
+
+.pf-v6-c-modal-box__title.pf-m-custom, .pf-v6-c-modal-box.pf-m-custom {
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-v6-c-modal-box--m-custom__title-icon--Color);
 }
-.pf-v5-c-modal-box.pf-m-info {
-  --pf-v5-c-modal-box__title-icon--Color: var(--pf-v5-c-modal-box--m-info__title-icon--Color);
+
+.pf-v6-c-modal-box__title.pf-m-info, .pf-v6-c-modal-box.pf-m-info {
+  --pf-v6-c-modal-box__title-icon--Color: var(--pf-v6-c-modal-box--m-info__title-icon--Color);
 }
 
-.pf-v5-c-modal-box__close {
+.pf-v6-c-modal-box__close {
   position: absolute;
-  inset-block-start: var(--pf-v5-c-modal-box__close--Top);
-  inset-inline-end: var(--pf-v5-c-modal-box__close--Right);
+  inset-block-start: var(--pf-v6-c-modal-box__close--Top);
+  inset-inline-end: var(--pf-v6-c-modal-box__close--Right);
 }
-.pf-v5-c-modal-box__close + * {
-  margin-inline-end: var(--pf-v5-c-modal-box__close--sibling--MarginRight);
+.pf-v6-c-modal-box__close + * {
+  margin-inline-end: var(--pf-v6-c-modal-box__close--sibling--MarginRight);
 }
 
-.pf-v5-c-modal-box__header {
+.pf-v6-c-modal-box__header {
   display: flex;
   flex-direction: column;
   flex-shrink: 0;
-  padding-block-start: var(--pf-v5-c-modal-box__header--PaddingTop);
-  padding-inline-start: var(--pf-v5-c-modal-box__header--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-modal-box__header--PaddingRight);
+  gap: var(--pf-v6-c-modal-box__header--Gap);
+  padding-block-start: var(--pf-v6-c-modal-box__header--PaddingTop);
+  padding-inline-start: var(--pf-v6-c-modal-box__header--PaddingLeft);
+  padding-inline-end: var(--pf-v6-c-modal-box__header--PaddingRight);
 }
-.pf-v5-c-modal-box__header.pf-m-help {
+.pf-v6-c-modal-box__header.pf-m-help {
   display: flex;
   flex-direction: row;
 }
-.pf-v5-c-modal-box__header:last-child {
-  padding-block-end: var(--pf-v5-c-modal-box__header--last-child--PaddingBottom);
-}
-.pf-v5-c-modal-box__header + .pf-v5-c-modal-box__body {
-  --pf-v5-c-modal-box__body--PaddingTop: var(--pf-v5-c-modal-box__header--body--PaddingTop);
+.pf-v6-c-modal-box__header + .pf-v6-c-modal-box__body {
+  --pf-v6-c-modal-box__body--PaddingTop: var(--pf-v6-c-modal-box__header--body--PaddingTop);
 }
 
-.pf-v5-c-modal-box__header-main {
+.pf-v6-c-modal-box__header-main {
+  display: flex;
+  flex-direction: column;
   flex-grow: 1;
+  gap: var(--pf-v6-c-modal-box__header-main--Gap);
   min-width: 0;
 }
 
-.pf-v5-c-modal-box__title,
-.pf-v5-c-modal-box__title-text {
+.pf-v6-c-modal-box__title,
+.pf-v6-c-modal-box__title-text {
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;
 }
 
-.pf-v5-c-modal-box__title {
+.pf-v6-c-modal-box__title {
   flex: 0 0 auto;
-  font-family: var(--pf-v5-c-modal-box__title--FontFamily);
-  font-size: var(--pf-v5-c-modal-box__title--FontSize);
-  line-height: var(--pf-v5-c-modal-box__title--LineHeight);
+  font-family: var(--pf-v6-c-modal-box__title--FontFamily);
+  font-size: var(--pf-v6-c-modal-box__title--FontSize);
+  line-height: var(--pf-v6-c-modal-box__title--LineHeight);
 }
-.pf-v5-c-modal-box__title.pf-m-icon {
+.pf-v6-c-modal-box__title.pf-m-icon {
   display: flex;
 }
 
-.pf-v5-c-modal-box__title-icon {
-  margin-inline-end: var(--pf-v5-c-modal-box__title-icon--MarginRight);
-  color: var(--pf-v5-c-modal-box__title-icon--Color);
+.pf-v6-c-modal-box__title-icon {
+  margin-inline-end: var(--pf-v6-c-modal-box__title-icon--MarginRight);
+  color: var(--pf-v6-c-modal-box__title-icon--Color);
 }
 
-.pf-v5-c-modal-box__description {
-  padding-block-start: var(--pf-v5-c-modal-box__description--PaddingTop);
+.pf-v6-c-modal-box__description {
+  padding-block-start: var(--pf-v6-c-modal-box__description--PaddingTop);
+  font-size: var(--pf-v6-c-modal-box__description--FontSize);
+  color: var(--pf-v6-c-modal-box__description--Color);
 }
 
-.pf-v5-c-modal-box__body {
+.pf-v6-c-modal-box__body {
   flex: 1 1 auto;
-  min-height: var(--pf-v5-c-modal-box__body--MinHeight);
-  padding-block-start: var(--pf-v5-c-modal-box__body--PaddingTop);
-  padding-inline-start: var(--pf-v5-c-modal-box__body--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-modal-box__body--PaddingRight);
+  min-height: var(--pf-v6-c-modal-box__body--MinHeight);
+  padding-block-start: var(--pf-v6-c-modal-box__body--PaddingTop);
+  padding-inline-start: var(--pf-v6-c-modal-box__body--PaddingLeft);
+  padding-inline-end: var(--pf-v6-c-modal-box__body--PaddingRight);
   overflow-x: hidden;
   overflow-y: auto;
   overscroll-behavior: contain;
   word-break: break-word;
   -webkit-overflow-scrolling: touch;
 }
-.pf-v5-c-modal-box__body:last-child {
-  padding-block-end: var(--pf-v5-c-modal-box__body--last-child--PaddingBottom);
+.pf-v6-c-modal-box__body:last-child {
+  padding-block-end: var(--pf-v6-c-modal-box__body--last-child--PaddingBottom);
 }
 
-.pf-v5-c-modal-box__footer {
+.pf-v6-c-modal-box__footer {
   display: flex;
   flex: 0 0 auto;
   align-items: center;
-  padding-block-start: var(--pf-v5-c-modal-box__footer--PaddingTop);
-  padding-block-end: var(--pf-v5-c-modal-box__footer--PaddingBottom);
-  padding-inline-start: var(--pf-v5-c-modal-box__footer--PaddingLeft);
-  padding-inline-end: var(--pf-v5-c-modal-box__footer--PaddingRight);
+  padding-block-start: var(--pf-v6-c-modal-box__footer--PaddingTop);
+  padding-block-end: var(--pf-v6-c-modal-box__footer--PaddingBottom);
+  padding-inline-start: var(--pf-v6-c-modal-box__footer--PaddingLeft);
+  padding-inline-end: var(--pf-v6-c-modal-box__footer--PaddingRight);
 }
-.pf-v5-c-modal-box__footer > .pf-v5-c-button:not(:last-child) {
-  margin-inline-end: var(--pf-v5-c-modal-box__footer--c-button--MarginRight);
+.pf-v6-c-modal-box__footer > .pf-v6-c-button:not(:last-child) {
+  margin-inline-end: var(--pf-v6-c-modal-box__footer--c-button--MarginRight);
 }
 @media screen and (min-width: 576px) {
-  .pf-v5-c-modal-box__footer > .pf-v5-c-button:not(:last-child) {
-    --pf-v5-c-modal-box__footer--c-button--MarginRight: var(--pf-v5-c-modal-box__footer--c-button--sm--MarginRight);
+  .pf-v6-c-modal-box__footer > .pf-v6-c-button:not(:last-child) {
+    --pf-v6-c-modal-box__footer--c-button--MarginRight: var(--pf-v6-c-modal-box__footer--c-button--sm--MarginRight);
   }
-}
-
-:where(.pf-v5-theme-dark) .pf-v5-c-modal-box {
-  --pf-v5-c-modal-box--BackgroundColor: var(--pf-v5-global--BackgroundColor--300);
 }

package/css/components/ModalBox/modal-box.d.ts

@@ -1,16 +1,16 @@
 import './modal-box.css';
 declare const _default: {
-  "button": "pf-v5-c-button",
-  "modalBox": "pf-v5-c-modal-box",
-  "modalBoxBody": "pf-v5-c-modal-box__body",
-  "modalBoxClose": "pf-v5-c-modal-box__close",
-  "modalBoxDescription": "pf-v5-c-modal-box__description",
-  "modalBoxFooter": "pf-v5-c-modal-box__footer",
-  "modalBoxHeader": "pf-v5-c-modal-box__header",
-  "modalBoxHeaderMain": "pf-v5-c-modal-box__header-main",
-  "modalBoxTitle": "pf-v5-c-modal-box__title",
-  "modalBoxTitleIcon": "pf-v5-c-modal-box__title-icon",
-  "modalBoxTitleText": "pf-v5-c-modal-box__title-text",
+  "button": "pf-v6-c-button",
+  "modalBox": "pf-v6-c-modal-box",
+  "modalBoxBody": "pf-v6-c-modal-box__body",
+  "modalBoxClose": "pf-v6-c-modal-box__close",
+  "modalBoxDescription": "pf-v6-c-modal-box__description",
+  "modalBoxFooter": "pf-v6-c-modal-box__footer",
+  "modalBoxHeader": "pf-v6-c-modal-box__header",
+  "modalBoxHeaderMain": "pf-v6-c-modal-box__header-main",
+  "modalBoxTitle": "pf-v6-c-modal-box__title",
+  "modalBoxTitleIcon": "pf-v6-c-modal-box__title-icon",
+  "modalBoxTitleText": "pf-v6-c-modal-box__title-text",
   "modifiers": {
     "sm": "pf-m-sm",
     "md": "pf-m-md",
@@ -23,7 +23,6 @@ declare const _default: {
     "info": "pf-m-info",
     "help": "pf-m-help",
     "icon": "pf-m-icon"
-  },
-  "themeDark": "pf-v5-theme-dark"
+  }
 };
 export default _default;

package/css/components/ModalBox/modal-box.js

@@ -2,17 +2,17 @@
 exports.__esModule = true;
 require('./modal-box.css');
 exports.default = {
-  "button": "pf-v5-c-button",
-  "modalBox": "pf-v5-c-modal-box",
-  "modalBoxBody": "pf-v5-c-modal-box__body",
-  "modalBoxClose": "pf-v5-c-modal-box__close",
-  "modalBoxDescription": "pf-v5-c-modal-box__description",
-  "modalBoxFooter": "pf-v5-c-modal-box__footer",
-  "modalBoxHeader": "pf-v5-c-modal-box__header",
-  "modalBoxHeaderMain": "pf-v5-c-modal-box__header-main",
-  "modalBoxTitle": "pf-v5-c-modal-box__title",
-  "modalBoxTitleIcon": "pf-v5-c-modal-box__title-icon",
-  "modalBoxTitleText": "pf-v5-c-modal-box__title-text",
+  "button": "pf-v6-c-button",
+  "modalBox": "pf-v6-c-modal-box",
+  "modalBoxBody": "pf-v6-c-modal-box__body",
+  "modalBoxClose": "pf-v6-c-modal-box__close",
+  "modalBoxDescription": "pf-v6-c-modal-box__description",
+  "modalBoxFooter": "pf-v6-c-modal-box__footer",
+  "modalBoxHeader": "pf-v6-c-modal-box__header",
+  "modalBoxHeaderMain": "pf-v6-c-modal-box__header-main",
+  "modalBoxTitle": "pf-v6-c-modal-box__title",
+  "modalBoxTitleIcon": "pf-v6-c-modal-box__title-icon",
+  "modalBoxTitleText": "pf-v6-c-modal-box__title-text",
   "modifiers": {
     "sm": "pf-m-sm",
     "md": "pf-m-md",
@@ -25,6 +25,5 @@ exports.default = {
     "info": "pf-m-info",
     "help": "pf-m-help",
     "icon": "pf-m-icon"
-  },
-  "themeDark": "pf-v5-theme-dark"
+  }
 };

package/css/components/ModalBox/modal-box.mjs

@@ -1,16 +1,16 @@
 import './modal-box.css';
 export default {
-  "button": "pf-v5-c-button",
-  "modalBox": "pf-v5-c-modal-box",
-  "modalBoxBody": "pf-v5-c-modal-box__body",
-  "modalBoxClose": "pf-v5-c-modal-box__close",
-  "modalBoxDescription": "pf-v5-c-modal-box__description",
-  "modalBoxFooter": "pf-v5-c-modal-box__footer",
-  "modalBoxHeader": "pf-v5-c-modal-box__header",
-  "modalBoxHeaderMain": "pf-v5-c-modal-box__header-main",
-  "modalBoxTitle": "pf-v5-c-modal-box__title",
-  "modalBoxTitleIcon": "pf-v5-c-modal-box__title-icon",
-  "modalBoxTitleText": "pf-v5-c-modal-box__title-text",
+  "button": "pf-v6-c-button",
+  "modalBox": "pf-v6-c-modal-box",
+  "modalBoxBody": "pf-v6-c-modal-box__body",
+  "modalBoxClose": "pf-v6-c-modal-box__close",
+  "modalBoxDescription": "pf-v6-c-modal-box__description",
+  "modalBoxFooter": "pf-v6-c-modal-box__footer",
+  "modalBoxHeader": "pf-v6-c-modal-box__header",
+  "modalBoxHeaderMain": "pf-v6-c-modal-box__header-main",
+  "modalBoxTitle": "pf-v6-c-modal-box__title",
+  "modalBoxTitleIcon": "pf-v6-c-modal-box__title-icon",
+  "modalBoxTitleText": "pf-v6-c-modal-box__title-text",
   "modifiers": {
     "sm": "pf-m-sm",
     "md": "pf-m-md",
@@ -23,6 +23,5 @@ export default {
     "info": "pf-m-info",
     "help": "pf-m-help",
     "icon": "pf-m-icon"
-  },
-  "themeDark": "pf-v5-theme-dark"
+  }
 };