@patternfly/react-core 4.255.1 → 4.256.0

package/dist/js/next/components/Wizard/utils.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.getCurrentStep = exports.normalizeNavStep = exports.normalizeStep = exports.isWizardStep = exports.buildSteps = void 0;
+exports.getActiveStep = exports.normalizeNavStep = exports.normalizeStep = exports.isWizardStep = exports.buildSteps = void 0;
 const tslib_1 = require("tslib");
 const react_1 = tslib_1.__importDefault(require("react"));
 const WizardStep_1 = require("./WizardStep");
@@ -11,16 +11,19 @@ const WizardStep_1 = require("./WizardStep");
  */
 const buildSteps = (children) => react_1.default.Children.toArray(children).reduce((acc, child) => {
     if (isWizardStep(child)) {
-        const { steps: subSteps, id } = child.props;
-        acc.push(Object.assign(Object.assign({ component: child }, exports.normalizeStep(child.props)), (subSteps && {
-            subStepIds: subSteps === null || subSteps === void 0 ? void 0 : subSteps.map(subStep => {
-                acc.push(Object.assign(Object.assign({}, exports.normalizeStep(subStep.props)), { component: subStep, parentId: id }));
+        const { steps: subSteps, id, isHidden, isDisabled } = child.props;
+        const subControlledSteps = [];
+        const stepIndex = acc.length + 1;
+        acc.push(Object.assign(Object.assign(Object.assign({ index: stepIndex, component: child }, (stepIndex === 1 && { isVisited: true })), (subSteps && {
+            subStepIds: subSteps === null || subSteps === void 0 ? void 0 : subSteps.map((subStep, subStepIndex) => {
+                subControlledSteps.push(Object.assign({ isHidden,
+                    isDisabled, component: subStep, parentId: id, index: stepIndex + subStepIndex + 1 }, exports.normalizeStep(subStep.props)));
                 return subStep.props.id;
             })
-        })));
+        })), exports.normalizeStep(child.props)), ...subControlledSteps);
     }
     else {
-        throw new Error('Wizard only accepts children of type WizardStep');
+        throw new Error('Wizard only accepts children with required WizardStepProps.');
     }
     return acc;
 }, []);
@@ -33,16 +36,16 @@ function isWizardStep(child) {
 exports.isWizardStep = isWizardStep;
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const normalizeStep = (_a) => {
-    var { children, steps, body } = _a, controlStep = tslib_1.__rest(_a, ["children", "steps", "body"]);
+    var { children, steps } = _a, controlStep = tslib_1.__rest(_a, ["children", "steps"]);
     return controlStep;
 };
 exports.normalizeStep = normalizeStep;
-const normalizeNavStep = (navStep, steps) => ({
+const normalizeNavStep = (navStep) => ({
     id: navStep.id,
-    name: navStep.name.toString(),
-    index: steps.indexOf(navStep) + 1
+    index: navStep.index,
+    name: navStep.name.toString()
 });
 exports.normalizeNavStep = normalizeNavStep;
-const getCurrentStep = (steps, currentStepIndex) => steps.find((_, index) => index + 1 === currentStepIndex);
-exports.getCurrentStep = getCurrentStep;
+const getActiveStep = (steps, activeStepIndex) => steps.find(step => step.index === activeStepIndex);
+exports.getActiveStep = getActiveStep;
 //# sourceMappingURL=utils.js.map

package/dist/js/next/components/Wizard/utils.js.map

@@ -1 +1 @@
-{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/utils.ts"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAG1B,6CAA2D;AAE3D;;;;GAIG;AACI,MAAM,UAAU,GAAG,CAAC,QAAqF,EAAE,EAAE,CAClH,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,GAAwB,EAAE,KAA6C,EAAE,EAAE;IAClH,IAAI,YAAY,CAAC,KAAK,CAAC,EAAE;QACvB,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC;QAE5C,GAAG,CAAC,IAAI,+BACN,SAAS,EAAE,KAAK,IACb,qBAAa,CAAC,KAAK,CAAC,KAAK,CAAC,GAC1B,CAAC,QAAQ,IAAI;YACd,UAAU,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,CAAC,OAAO,CAAC,EAAE;gBAClC,GAAG,CAAC,IAAI,iCACH,qBAAa,CAAC,OAAO,CAAC,KAAK,CAAC,KAC/B,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,EAAE,IACZ,CAAC;gBAEH,OAAO,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YAC1B,CAAC,CAAC;SACH,CAAC,EACF,CAAC;KACJ;SAAM;QACL,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;KACpE;IAED,OAAO,GAAG,CAAC;AACb,CAAC,EAAE,EAAE,CAAC,CAAC;AAzBI,QAAA,UAAU,cAyBd;AAET,SAAgB,YAAY,CAC1B,KAAgD;;IAEhD,OAAO,CACL,CAAC,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAK,KAA6C,CAAC,IAAI,KAAK,uBAAU,CAAC;QACnG,CAAC,CAAA,MAAA,KAAK,CAAC,KAAK,0CAAE,IAAI,MAAK,SAAS,IAAI,CAAA,MAAA,KAAK,CAAC,KAAK,0CAAE,EAAE,MAAK,SAAS,CAAC,CACnE,CAAC;AACJ,CAAC;AAPD,oCAOC;AAED,6DAA6D;AACtD,MAAM,aAAa,GAAG,CAAC,EAA0D,EAAqB,EAAE;QAAjF,EAAE,QAAQ,EAAE,KAAK,EAAE,IAAI,OAAmC,EAA9B,WAAW,sBAAvC,6BAAyC,CAAF;IACnE,OAAA,WAAW,CAAA;CAAA,CAAC;AADD,QAAA,aAAa,iBACZ;AAEP,MAAM,gBAAgB,GAAG,CAAC,OAA0B,EAAE,KAA0B,EAAqB,EAAE,CAAC,CAAC;IAC9G,EAAE,EAAE,OAAO,CAAC,EAAE;IACd,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE;IAC7B,KAAK,EAAE,KAAK,CAAC,OAAO,CAAC,OAAO,CAAC,GAAG,CAAC;CAClC,CAAC,CAAC;AAJU,QAAA,gBAAgB,oBAI1B;AAEI,MAAM,cAAc,GAAG,CAAC,KAA0B,EAAE,gBAAwB,EAAE,EAAE,CACrF,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,GAAG,CAAC,KAAK,gBAAgB,CAAC,CAAC;AAD9C,QAAA,cAAc,kBACgC"}
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/utils.ts"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAG1B,6CAA2D;AAE3D;;;;GAIG;AACI,MAAM,UAAU,GAAG,CAAC,QAAqF,EAAE,EAAE,CAClH,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,GAAwB,EAAE,KAAsB,EAAE,EAAE;IAC3F,IAAI,YAAY,CAAC,KAAK,CAAC,EAAE;QACvB,MAAM,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,KAAK,CAAC,KAAK,CAAC;QAClE,MAAM,kBAAkB,GAAwB,EAAE,CAAC;QACnD,MAAM,SAAS,GAAG,GAAG,CAAC,MAAM,GAAG,CAAC,CAAC;QAEjC,GAAG,CAAC,IAAI,6CAEJ,KAAK,EAAE,SAAS,EAChB,SAAS,EAAE,KAAK,IACb,CAAC,SAAS,KAAK,CAAC,IAAI,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,GACxC,CAAC,QAAQ,IAAI;YACd,UAAU,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,CAAC,CAAC,OAAO,EAAE,YAAY,EAAE,EAAE;gBAClD,kBAAkB,CAAC,IAAI,iBACrB,QAAQ;oBACR,UAAU,EACV,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,EAAE,EACZ,KAAK,EAAE,SAAS,GAAG,YAAY,GAAG,CAAC,IAChC,qBAAa,CAAC,OAAO,CAAC,KAAK,CAAC,EAC/B,CAAC;gBAEH,OAAO,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;YAC1B,CAAC,CAAC;SACH,CAAC,GACC,qBAAa,CAAC,KAAK,CAAC,KAAK,CAAC,GAE/B,GAAG,kBAAkB,CACtB,CAAC;KACH;SAAM;QACL,MAAM,IAAI,KAAK,CAAC,6DAA6D,CAAC,CAAC;KAChF;IAED,OAAO,GAAG,CAAC;AACb,CAAC,EAAE,EAAE,CAAC,CAAC;AAnCI,QAAA,UAAU,cAmCd;AAET,SAAgB,YAAY,CAC1B,KAAgD;;IAEhD,OAAO,CACL,CAAC,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,IAAK,KAA6C,CAAC,IAAI,KAAK,uBAAU,CAAC;QACnG,CAAC,CAAA,MAAA,KAAK,CAAC,KAAK,0CAAE,IAAI,MAAK,SAAS,IAAI,CAAA,MAAA,KAAK,CAAC,KAAK,0CAAE,EAAE,MAAK,SAAS,CAAC,CACnE,CAAC;AACJ,CAAC;AAPD,oCAOC;AAED,6DAA6D;AACtD,MAAM,aAAa,GAAG,CAAC,EAAoD,EAAoC,EAAE;QAA1F,EAAE,QAAQ,EAAE,KAAK,OAAmC,EAA9B,WAAW,sBAAjC,qBAAmC,CAAF;IAC7D,OAAA,WAAW,CAAA;CAAA,CAAC;AADD,QAAA,aAAa,iBACZ;AAEP,MAAM,gBAAgB,GAAG,CAAC,OAA0B,EAAqB,EAAE,CAAC,CAAC;IAClF,EAAE,EAAE,OAAO,CAAC,EAAE;IACd,KAAK,EAAE,OAAO,CAAC,KAAK;IACpB,IAAI,EAAE,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE;CAC9B,CAAC,CAAC;AAJU,QAAA,gBAAgB,oBAI1B;AAEI,MAAM,aAAa,GAAG,CAAC,KAA0B,EAAE,eAAuB,EAAE,EAAE,CACnF,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,IAAI,CAAC,KAAK,KAAK,eAAe,CAAC,CAAC;AADxC,QAAA,aAAa,iBAC2B"}

package/dist/umd/react-core.min.css

@@ -9425,143 +9425,6 @@ label.pf-c-check, .pf-c-check__label,
   --pf-c-hint--BorderColor: var(--pf-global--BorderColor--300);
 }
 
-.pf-c-icon {
-  --pf-c-icon--Width: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--Height: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--m-inline--Width: 1em;
-  --pf-c-icon--m-inline--Height: 1em;
-  --pf-c-icon--m-sm--Width: var(--pf-global--icon--FontSize--sm);
-  --pf-c-icon--m-md--Width: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--m-lg--Width: var(--pf-global--icon--FontSize--lg);
-  --pf-c-icon--m-xl--Width: var(--pf-global--icon--FontSize--xl);
-  --pf-c-icon--m-sm--Height: var(--pf-global--icon--FontSize--sm);
-  --pf-c-icon--m-md--Height: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--m-lg--Height: var(--pf-global--icon--FontSize--lg);
-  --pf-c-icon--m-xl--Height: var(--pf-global--icon--FontSize--xl);
-  --pf-c-icon__content--Color: var(--pf-global--icon--Color--dark);
-  --pf-c-icon__content--m-danger--Color: var(--pf-global--danger-color--100);
-  --pf-c-icon__content--m-warning--Color: var(--pf-global--warning-color--100);
-  --pf-c-icon__content--m-success--Color: var(--pf-global--success-color--100);
-  --pf-c-icon__content--m-info--Color: var(--pf-global--info-color--100);
-  --pf-c-icon__content--m-default--Color: var(--pf-global--default-color--100);
-  --pf-c-icon__content--FontSize: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--m-inline__content--FontSize: 1em;
-  --pf-c-icon__content--svg--VerticalAlign: -.125em;
-  --pf-c-icon--m-sm--content--FontSize: var(--pf-global--icon--FontSize--sm);
-  --pf-c-icon--m-md--content--FontSize: var(--pf-global--icon--FontSize--md);
-  --pf-c-icon--m-lg--content--FontSize: var(--pf-global--icon--FontSize--lg);
-  --pf-c-icon--m-xl--content--FontSize: var(--pf-global--icon--FontSize--xl);
-  position: relative;
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  width: var(--pf-c-icon--Width);
-  height: var(--pf-c-icon--Height);
-}
-
-.pf-c-icon.pf-m-inline {
-  --pf-c-icon--Width: var(--pf-c-icon--m-inline--Width);
-  --pf-c-icon--Height: var(--pf-c-icon--m-inline--Height);
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-inline__content--FontSize);
-  --pf-c-icon__content--Color: currentcolor;
-  line-height: 1;
-}
-
-.pf-c-icon.pf-m-inline .pf-c-spinner {
-  --pf-c-spinner--diameter: 1em;
-}
-
-.pf-c-icon.pf-m-sm {
-  --pf-c-icon--Width: var(--pf-c-icon--m-sm--Width);
-  --pf-c-icon--Height: var(--pf-c-icon--m-sm--Height);
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-sm--content--FontSize);
-}
-
-.pf-c-icon.pf-m-md {
-  --pf-c-icon--Width: var(--pf-c-icon--m-md--Width);
-  --pf-c-icon--Height: var(--pf-c-icon--m-md--Height);
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-md--content--FontSize);
-}
-
-.pf-c-icon.pf-m-lg {
-  --pf-c-icon--Width: var(--pf-c-icon--m-lg--Width);
-  --pf-c-icon--Height: var(--pf-c-icon--m-lg--Height);
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-lg--content--FontSize);
-}
-
-.pf-c-icon.pf-m-xl {
-  --pf-c-icon--Width: var(--pf-c-icon--m-xl--Width);
-  --pf-c-icon--Height: var(--pf-c-icon--m-xl--Height);
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-xl--content--FontSize);
-}
-
-.pf-c-icon.pf-m-in-progress {
-  --pf-c-icon__content--Opacity: 0;
-  --pf-c-icon__progress--Opacity: 1;
-}
-
-.pf-c-icon__content,
-.pf-c-icon__progress {
-  font-size: var(--pf-c-icon__content--FontSize);
-}
-
-.pf-c-icon__content svg,
-.pf-c-icon__progress svg {
-  vertical-align: var(--pf-c-icon__content--svg--VerticalAlign);
-}
-
-.pf-c-icon__content.pf-m-sm,
-.pf-c-icon__progress.pf-m-sm {
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-sm--content--FontSize);
-}
-
-.pf-c-icon__content.pf-m-md,
-.pf-c-icon__progress.pf-m-md {
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-md--content--FontSize);
-}
-
-.pf-c-icon__content.pf-m-lg,
-.pf-c-icon__progress.pf-m-lg {
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-lg--content--FontSize);
-}
-
-.pf-c-icon__content.pf-m-xl,
-.pf-c-icon__progress.pf-m-xl {
-  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-xl--content--FontSize);
-}
-
-.pf-c-icon__content {
-  color: var(--pf-c-icon__content--Color);
-  opacity: var(--pf-c-icon__content--Opacity, 1);
-}
-
-.pf-c-icon__content.pf-m-danger {
-  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-danger--Color);
-}
-
-.pf-c-icon__content.pf-m-warning {
-  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-warning--Color);
-}
-
-.pf-c-icon__content.pf-m-success {
-  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-success--Color);
-}
-
-.pf-c-icon__content.pf-m-info {
-  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-info--Color);
-}
-
-.pf-c-icon__content.pf-m-default {
-  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-default--Color);
-}
-
-.pf-c-icon__progress {
-  position: absolute;
-  top: calc(50% + 0.5 * var(--pf-c-icon__content--svg--VerticalAlign));
-  opacity: var(--pf-c-icon__progress--Opacity, 0);
-  transform: translateY(calc(-50% - 0.5 * var(--pf-c-icon__content--svg--VerticalAlign)));
-}
-
 .pf-c-input-group {
   --pf-global--Color--100: var(--pf-global--Color--dark-100);
   --pf-global--Color--200: var(--pf-global--Color--dark-200);
@@ -10919,6 +10782,143 @@ button.pf-c-label__content:focus {
   display: none;
 }
 
+.pf-c-icon {
+  --pf-c-icon--Width: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--Height: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--m-inline--Width: 1em;
+  --pf-c-icon--m-inline--Height: 1em;
+  --pf-c-icon--m-sm--Width: var(--pf-global--icon--FontSize--sm);
+  --pf-c-icon--m-md--Width: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--m-lg--Width: var(--pf-global--icon--FontSize--lg);
+  --pf-c-icon--m-xl--Width: var(--pf-global--icon--FontSize--xl);
+  --pf-c-icon--m-sm--Height: var(--pf-global--icon--FontSize--sm);
+  --pf-c-icon--m-md--Height: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--m-lg--Height: var(--pf-global--icon--FontSize--lg);
+  --pf-c-icon--m-xl--Height: var(--pf-global--icon--FontSize--xl);
+  --pf-c-icon__content--Color: var(--pf-global--icon--Color--dark);
+  --pf-c-icon__content--m-danger--Color: var(--pf-global--danger-color--100);
+  --pf-c-icon__content--m-warning--Color: var(--pf-global--warning-color--100);
+  --pf-c-icon__content--m-success--Color: var(--pf-global--success-color--100);
+  --pf-c-icon__content--m-info--Color: var(--pf-global--info-color--100);
+  --pf-c-icon__content--m-default--Color: var(--pf-global--default-color--100);
+  --pf-c-icon__content--FontSize: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--m-inline__content--FontSize: 1em;
+  --pf-c-icon__content--svg--VerticalAlign: -.125em;
+  --pf-c-icon--m-sm--content--FontSize: var(--pf-global--icon--FontSize--sm);
+  --pf-c-icon--m-md--content--FontSize: var(--pf-global--icon--FontSize--md);
+  --pf-c-icon--m-lg--content--FontSize: var(--pf-global--icon--FontSize--lg);
+  --pf-c-icon--m-xl--content--FontSize: var(--pf-global--icon--FontSize--xl);
+  position: relative;
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  width: var(--pf-c-icon--Width);
+  height: var(--pf-c-icon--Height);
+}
+
+.pf-c-icon.pf-m-inline {
+  --pf-c-icon--Width: var(--pf-c-icon--m-inline--Width);
+  --pf-c-icon--Height: var(--pf-c-icon--m-inline--Height);
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-inline__content--FontSize);
+  --pf-c-icon__content--Color: currentcolor;
+  line-height: 1;
+}
+
+.pf-c-icon.pf-m-inline .pf-c-spinner {
+  --pf-c-spinner--diameter: 1em;
+}
+
+.pf-c-icon.pf-m-sm {
+  --pf-c-icon--Width: var(--pf-c-icon--m-sm--Width);
+  --pf-c-icon--Height: var(--pf-c-icon--m-sm--Height);
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-sm--content--FontSize);
+}
+
+.pf-c-icon.pf-m-md {
+  --pf-c-icon--Width: var(--pf-c-icon--m-md--Width);
+  --pf-c-icon--Height: var(--pf-c-icon--m-md--Height);
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-md--content--FontSize);
+}
+
+.pf-c-icon.pf-m-lg {
+  --pf-c-icon--Width: var(--pf-c-icon--m-lg--Width);
+  --pf-c-icon--Height: var(--pf-c-icon--m-lg--Height);
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-lg--content--FontSize);
+}
+
+.pf-c-icon.pf-m-xl {
+  --pf-c-icon--Width: var(--pf-c-icon--m-xl--Width);
+  --pf-c-icon--Height: var(--pf-c-icon--m-xl--Height);
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-xl--content--FontSize);
+}
+
+.pf-c-icon.pf-m-in-progress {
+  --pf-c-icon__content--Opacity: 0;
+  --pf-c-icon__progress--Opacity: 1;
+}
+
+.pf-c-icon__content,
+.pf-c-icon__progress {
+  font-size: var(--pf-c-icon__content--FontSize);
+}
+
+.pf-c-icon__content svg,
+.pf-c-icon__progress svg {
+  vertical-align: var(--pf-c-icon__content--svg--VerticalAlign);
+}
+
+.pf-c-icon__content.pf-m-sm,
+.pf-c-icon__progress.pf-m-sm {
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-sm--content--FontSize);
+}
+
+.pf-c-icon__content.pf-m-md,
+.pf-c-icon__progress.pf-m-md {
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-md--content--FontSize);
+}
+
+.pf-c-icon__content.pf-m-lg,
+.pf-c-icon__progress.pf-m-lg {
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-lg--content--FontSize);
+}
+
+.pf-c-icon__content.pf-m-xl,
+.pf-c-icon__progress.pf-m-xl {
+  --pf-c-icon__content--FontSize: var(--pf-c-icon--m-xl--content--FontSize);
+}
+
+.pf-c-icon__content {
+  color: var(--pf-c-icon__content--Color);
+  opacity: var(--pf-c-icon__content--Opacity, 1);
+}
+
+.pf-c-icon__content.pf-m-danger {
+  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-danger--Color);
+}
+
+.pf-c-icon__content.pf-m-warning {
+  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-warning--Color);
+}
+
+.pf-c-icon__content.pf-m-success {
+  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-success--Color);
+}
+
+.pf-c-icon__content.pf-m-info {
+  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-info--Color);
+}
+
+.pf-c-icon__content.pf-m-default {
+  --pf-c-icon__content--Color: var(--pf-c-icon__content--m-default--Color);
+}
+
+.pf-c-icon__progress {
+  position: absolute;
+  top: calc(50% + 0.5 * var(--pf-c-icon__content--svg--VerticalAlign));
+  opacity: var(--pf-c-icon__progress--Opacity, 0);
+  transform: translateY(calc(-50% - 0.5 * var(--pf-c-icon__content--svg--VerticalAlign)));
+}
+
 .pf-c-list {
   --pf-c-list--PaddingLeft: var(--pf-global--spacer--lg);
   --pf-c-list--nested--MarginTop: var(--pf-global--spacer--sm);