@patternfly/react-core 4.234.2 → 4.235.0

package/dist/js/next/components/Wizard/types.d.ts

@@ -0,0 +1,69 @@
+import React from 'react';
+import { WizardNavProps, WizardNavItemProps } from '../Wizard';
+/** Type used to define 'basic' steps, or in other words, steps that are neither parents or children of parents. */
+export interface WizardBasicStep {
+    /** Name of the step's nav item */
+    name: React.ReactNode;
+    /** Unique identifier */
+    id: string | number;
+    /** Flag to disable the step's nav item */
+    isDisabled?: boolean;
+    /** Flag to represent whether the step has been visited (navigated to) */
+    visited?: boolean;
+    /** Content shown when the step's nav item is selected. When treated as a parent step, only sub-step content will be shown. */
+    component?: React.ReactElement;
+    /** (Unused if nav is controlled) Custom WizardNavItem */
+    navItem?: React.ReactElement<WizardNavItemProps>;
+    /** (Unused if footer is controlled) Can change the Next button text. If nextButtonText is also set for the Wizard, this step specific one overrides it. */
+    nextButtonText?: React.ReactNode;
+    /** (Unused if footer is controlled) The condition needed to disable the Next button */
+    disableNext?: boolean;
+    /** (Unused if footer is controlled) True to hide the Cancel button */
+    hideCancelButton?: boolean;
+    /** (Unused if footer is controlled) True to hide the Back button */
+    hideBackButton?: boolean;
+}
+/** Type used to define parent steps. */
+export interface WizardParentStep extends WizardBasicStep {
+    /** Nested step IDs */
+    subStepIds: string[];
+}
+/** Type used to define sub-steps. */
+export interface WizardSubStep extends WizardBasicStep {
+    /** Unique identifier of the parent step */
+    parentId: string | number;
+}
+/** Used to customize aspects of the Wizard's default navigation. */
+export interface DefaultWizardNavProps {
+    /** Flag indicating nav items with sub steps are expandable */
+    isExpandable?: boolean;
+    /** Aria-label for the Nav */
+    ariaLabel?: string;
+    /** Sets aria-labelledby on nav element */
+    ariaLabelledBy?: string;
+    /** Disable step nav items until they are visited */
+    forceStepVisit?: boolean;
+}
+/** Used to customize aspects of the Wizard's default footer. */
+export interface DefaultWizardFooterProps {
+    /** The Next button text */
+    nextButtonText?: React.ReactNode;
+    /** The Back button text */
+    backButtonText?: React.ReactNode;
+    /** The Cancel button text */
+    cancelButtonText?: React.ReactNode;
+}
+/** Encompasses all step type variants that are internally controlled by the Wizard. */
+export declare type WizardControlStep = WizardBasicStep | WizardParentStep | WizardSubStep;
+/** Callback for the Wizard's 'onNext', 'onBack', and 'onNavByIndex' properties. */
+export declare type WizardNavStepFunction = (currentStep: WizardNavStepData, previousStep: WizardNavStepData) => void;
+/** Data returned for either parameter of WizardNavStepFunction. */
+export declare type WizardNavStepData = Pick<WizardControlStep, 'id' | 'name'>;
+/** Callback for the Wizard's 'nav' property. Returns element which replaces the Wizard's default navigation. */
+export declare type CustomWizardNavFunction = (isOpen: boolean, steps: WizardControlStep[], activeStep: WizardControlStep, goToStepByIndex: (index: number) => void) => React.ReactElement<WizardNavProps>;
+export declare function isCustomWizardNav(nav: DefaultWizardNavProps | CustomWizardNavFunction): nav is CustomWizardNavFunction;
+export declare function isCustomWizardFooter(footer: DefaultWizardFooterProps | React.ReactElement): footer is React.ReactElement;
+export declare function isWizardBasicStep(step: WizardControlStep): step is WizardBasicStep;
+export declare function isWizardSubStep(step: WizardControlStep): step is WizardSubStep;
+export declare function isWizardParentStep(step: WizardControlStep): step is WizardParentStep;
+//# sourceMappingURL=types.d.ts.map

package/dist/js/next/components/Wizard/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/types.tsx"],"names":[],"mappings":"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"}

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

@@ -0,0 +1,29 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.isWizardParentStep = exports.isWizardSubStep = exports.isWizardBasicStep = exports.isCustomWizardFooter = exports.isCustomWizardNav = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+function isCustomWizardNav(nav) {
+    return typeof nav === 'function';
+}
+exports.isCustomWizardNav = isCustomWizardNav;
+function isCustomWizardFooter(footer) {
+    return react_1.default.isValidElement(footer);
+}
+exports.isCustomWizardFooter = isCustomWizardFooter;
+function isWizardBasicStep(step) {
+    var _a;
+    return ((_a = step) === null || _a === void 0 ? void 0 : _a.subStepIds) === undefined && !isWizardSubStep(step);
+}
+exports.isWizardBasicStep = isWizardBasicStep;
+function isWizardSubStep(step) {
+    var _a;
+    return ((_a = step) === null || _a === void 0 ? void 0 : _a.parentId) !== undefined;
+}
+exports.isWizardSubStep = isWizardSubStep;
+function isWizardParentStep(step) {
+    var _a;
+    return ((_a = step) === null || _a === void 0 ? void 0 : _a.subStepIds) !== undefined;
+}
+exports.isWizardParentStep = isWizardParentStep;
+//# sourceMappingURL=types.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/types.tsx"],"names":[],"mappings":";;;;AAAA,0DAA0B;AA8E1B,SAAgB,iBAAiB,CAC/B,GAAoD;IAEpD,OAAO,OAAO,GAAG,KAAK,UAAU,CAAC;AACnC,CAAC;AAJD,8CAIC;AAED,SAAgB,oBAAoB,CAClC,MAAqD;IAErD,OAAO,eAAK,CAAC,cAAc,CAAC,MAAM,CAAC,CAAC;AACtC,CAAC;AAJD,oDAIC;AAED,SAAgB,iBAAiB,CAAC,IAAuB;;IACvD,OAAO,CAAA,MAAC,IAAyB,0CAAE,UAAU,MAAK,SAAS,IAAI,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;AACxF,CAAC;AAFD,8CAEC;AAED,SAAgB,eAAe,CAAC,IAAuB;;IACrD,OAAO,CAAA,MAAC,IAAsB,0CAAE,QAAQ,MAAK,SAAS,CAAC;AACzD,CAAC;AAFD,0CAEC;AAED,SAAgB,kBAAkB,CAAC,IAAuB;;IACxD,OAAO,CAAA,MAAC,IAAyB,0CAAE,UAAU,MAAK,SAAS,CAAC;AAC9D,CAAC;AAFD,gDAEC"}

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

@@ -0,0 +1,15 @@
+import React from 'react';
+import { WizardControlStep, WizardNavStepData } from './types';
+import { WizardStepProps } from './WizardStep';
+/**
+ * Accumulate list of step & sub-step props pulled from child components
+ * @param children
+ * @returns WizardControlStep[]
+ */
+export declare const buildSteps: (children: React.ReactElement<WizardStepProps> | React.ReactElement<WizardStepProps>[]) => WizardControlStep[];
+export declare const normalizeNavStep: ({ id, name }: WizardNavStepData) => {
+    id: string | number;
+    name: React.ReactNode;
+};
+export declare const getActiveStep: (steps: WizardControlStep[], currentStepIndex: number) => WizardControlStep;
+//# sourceMappingURL=utils.d.ts.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.d.ts","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/utils.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,MAAM,OAAO,CAAC;AAE1B,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,SAAS,CAAC;AAC/D,OAAO,EAAc,eAAe,EAAE,MAAM,cAAc,CAAC;AAM3D;;;;GAIG;AACH,eAAO,MAAM,UAAU,aAAc,MAAM,YAAY,CAAC,eAAe,CAAC,GAAG,MAAM,YAAY,CAAC,eAAe,CAAC,EAAE,wBA4BxG,CAAC;AAET,eAAO,MAAM,gBAAgB,iBAAkB,iBAAiB;;;CAAmB,CAAC;AACpF,eAAO,MAAM,aAAa,UAAW,iBAAiB,EAAE,oBAAoB,MAAM,sBACxB,CAAC"}

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

@@ -0,0 +1,41 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getActiveStep = exports.normalizeNavStep = exports.buildSteps = void 0;
+const tslib_1 = require("tslib");
+const react_1 = tslib_1.__importDefault(require("react"));
+const WizardStep_1 = require("./WizardStep");
+function hasWizardStepProps(props) {
+    return props.name !== undefined && props.id !== undefined && props.children !== undefined;
+}
+/**
+ * Accumulate list of step & sub-step props pulled from child components
+ * @param children
+ * @returns WizardControlStep[]
+ */
+const buildSteps = (children) => react_1.default.Children.toArray(children).reduce((acc, child) => {
+    if (react_1.default.isValidElement(child)) {
+        if (child.type === WizardStep_1.WizardStep || hasWizardStepProps(child.props)) {
+            // Omit "children" and use the whole "child" (WizardStep) for the component prop. Sub-steps will do the same.
+            // eslint-disable-next-line @typescript-eslint/no-unused-vars
+            const _a = child.props, { steps: subSteps, id, children } = _a, stepProps = tslib_1.__rest(_a, ["steps", "id", "children"]);
+            acc.push(Object.assign(Object.assign({ id, component: child }, stepProps), (subSteps && {
+                subStepIds: subSteps === null || subSteps === void 0 ? void 0 : subSteps.map(subStep => {
+                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                    const _a = subStep.props, { children } = _a, subStepProps = tslib_1.__rest(_a, ["children"]);
+                    acc.push(Object.assign(Object.assign({}, subStepProps), { component: subStep, parentId: id }));
+                    return subStep.props.id;
+                })
+            })));
+        }
+        else {
+            throw new Error('Wizard only accepts children of type WizardStep');
+        }
+    }
+    return acc;
+}, []);
+exports.buildSteps = buildSteps;
+const normalizeNavStep = ({ id, name }) => ({ id, name });
+exports.normalizeNavStep = normalizeNavStep;
+const getActiveStep = (steps, currentStepIndex) => steps.find((_, index) => index + 1 === currentStepIndex);
+exports.getActiveStep = getActiveStep;
+//# sourceMappingURL=utils.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/next/components/Wizard/utils.ts"],"names":[],"mappings":";;;;AAAA,0DAA0B;AAG1B,6CAA2D;AAE3D,SAAS,kBAAkB,CAAC,KAA4B;IACtD,OAAO,KAAK,CAAC,IAAI,KAAK,SAAS,IAAI,KAAK,CAAC,EAAE,KAAK,SAAS,IAAI,KAAK,CAAC,QAAQ,KAAK,SAAS,CAAC;AAC5F,CAAC;AAED;;;;GAIG;AACI,MAAM,UAAU,GAAG,CAAC,QAAqF,EAAE,EAAE,CAClH,eAAK,CAAC,QAAQ,CAAC,OAAO,CAAC,QAAQ,CAAC,CAAC,MAAM,CAAC,CAAC,GAAwB,EAAE,KAAK,EAAE,EAAE;IAC1E,IAAI,eAAK,CAAC,cAAc,CAAC,KAAK,CAAC,EAAE;QAC/B,IAAI,KAAK,CAAC,IAAI,KAAK,uBAAU,IAAI,kBAAkB,CAAC,KAAK,CAAC,KAAK,CAAC,EAAE;YAChE,6GAA6G;YAC7G,6DAA6D;YAC7D,MAAM,KAAkD,KAAK,CAAC,KAAwB,EAAhF,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,EAAE,QAAQ,OAAiD,EAA5C,SAAS,sBAA7C,2BAA+C,CAAiC,CAAC;YAEvF,GAAG,CAAC,IAAI,+BACN,EAAE,EACF,SAAS,EAAE,KAAK,IACb,SAAS,GACT,CAAC,QAAQ,IAAI;gBACd,UAAU,EAAE,QAAQ,aAAR,QAAQ,uBAAR,QAAQ,CAAE,GAAG,CAAC,OAAO,CAAC,EAAE;oBAClC,6DAA6D;oBAC7D,MAAM,KAAgC,OAAO,CAAC,KAAK,EAA7C,EAAE,QAAQ,OAAmC,EAA9B,YAAY,sBAA3B,YAA6B,CAAgB,CAAC;oBACpD,GAAG,CAAC,IAAI,iCAAM,YAAY,KAAE,SAAS,EAAE,OAAO,EAAE,QAAQ,EAAE,EAAE,IAAG,CAAC;oBAEhE,OAAO,OAAO,CAAC,KAAK,CAAC,EAAE,CAAC;gBAC1B,CAAC,CAAC;aACH,CAAC,EACF,CAAC;SACJ;aAAM;YACL,MAAM,IAAI,KAAK,CAAC,iDAAiD,CAAC,CAAC;SACpE;KACF;IAED,OAAO,GAAG,CAAC;AACb,CAAC,EAAE,EAAE,CAAC,CAAC;AA5BI,QAAA,UAAU,cA4Bd;AAEF,MAAM,gBAAgB,GAAG,CAAC,EAAE,EAAE,EAAE,IAAI,EAAqB,EAAE,EAAE,CAAC,CAAC,EAAE,EAAE,EAAE,IAAI,EAAE,CAAC,CAAC;AAAvE,QAAA,gBAAgB,oBAAuD;AAC7E,MAAM,aAAa,GAAG,CAAC,KAA0B,EAAE,gBAAwB,EAAE,EAAE,CACpF,KAAK,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,KAAK,EAAE,EAAE,CAAC,KAAK,GAAG,CAAC,KAAK,gBAAgB,CAAC,CAAC;AAD9C,QAAA,aAAa,iBACiC"}

package/dist/js/next/components/index.d.ts

@@ -1,2 +1,2 @@
-export * from './';
+export * from './Wizard';
 //# sourceMappingURL=index.d.ts.map

package/dist/js/next/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,IAAI,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC"}

package/dist/js/next/components/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./"), exports);
+tslib_1.__exportStar(require("./Wizard"), exports);
 //# sourceMappingURL=index.js.map

package/dist/js/next/components/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":";;;AAAA,6CAAmB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/next/components/index.ts"],"names":[],"mappings":";;;AAAA,mDAAyB"}

package/dist/umd/react-core.css

@@ -1141,6 +1141,153 @@ textarea.pf-c-form-control {
   color: var(--pf-global--palette--black-100);
 }
 
+.pf-u-screen-reader {
+  position: fixed;
+  top: 0;
+  left: 0;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border: 0;
+}
+
+.pf-u-visible {
+  position: static;
+  overflow: visible;
+  clip: auto;
+  white-space: normal;
+  border: inherit;
+}
+
+.pf-u-hidden {
+  display: none !important;
+}
+
+@media screen and (min-width: 576px) {
+  .pf-u-screen-reader-on-sm {
+    position: fixed;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+@media screen and (min-width: 576px) {
+  .pf-u-visible-on-sm {
+    position: static;
+    overflow: visible;
+    clip: auto;
+    white-space: normal;
+    border: inherit;
+  }
+}
+@media screen and (min-width: 576px) {
+  .pf-u-hidden-on-sm {
+    display: none !important;
+  }
+}
+@media screen and (min-width: 768px) {
+  .pf-u-screen-reader-on-md {
+    position: fixed;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+@media screen and (min-width: 768px) {
+  .pf-u-visible-on-md {
+    position: static;
+    overflow: visible;
+    clip: auto;
+    white-space: normal;
+    border: inherit;
+  }
+}
+@media screen and (min-width: 768px) {
+  .pf-u-hidden-on-md {
+    display: none !important;
+  }
+}
+@media screen and (min-width: 992px) {
+  .pf-u-screen-reader-on-lg {
+    position: fixed;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+@media screen and (min-width: 992px) {
+  .pf-u-visible-on-lg {
+    position: static;
+    overflow: visible;
+    clip: auto;
+    white-space: normal;
+    border: inherit;
+  }
+}
+@media screen and (min-width: 992px) {
+  .pf-u-hidden-on-lg {
+    display: none !important;
+  }
+}
+@media screen and (min-width: 1200px) {
+  .pf-u-screen-reader-on-xl {
+    position: fixed;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+@media screen and (min-width: 1200px) {
+  .pf-u-visible-on-xl {
+    position: static;
+    overflow: visible;
+    clip: auto;
+    white-space: normal;
+    border: inherit;
+  }
+}
+@media screen and (min-width: 1200px) {
+  .pf-u-hidden-on-xl {
+    display: none !important;
+  }
+}
+@media screen and (min-width: 1450px) {
+  .pf-u-screen-reader-on-2xl {
+    position: fixed;
+    top: 0;
+    left: 0;
+    overflow: hidden;
+    clip: rect(0, 0, 0, 0);
+    white-space: nowrap;
+    border: 0;
+  }
+}
+@media screen and (min-width: 1450px) {
+  .pf-u-visible-on-2xl {
+    position: static;
+    overflow: visible;
+    clip: auto;
+    white-space: normal;
+    border: inherit;
+  }
+}
+@media screen and (min-width: 1450px) {
+  .pf-u-hidden-on-2xl {
+    display: none !important;
+  }
+}
 .pf-c-avatar {
   --pf-c-avatar--BorderColor: transparent;
   --pf-c-avatar--BorderWidth: 0;
@@ -1395,153 +1542,6 @@ textarea.pf-c-form-control {
     --pf-c-avatar--Height: var(--pf-c-avatar--m-xl--Height-on-2xl, var(--pf-c-avatar--m-xl--Height-on-xl, var(--pf-c-avatar--m-xl--Height-on-lg, var(--pf-c-avatar--m-xl--Height-on-md, var(--pf-c-avatar--m-xl--Height-on-sm, var(--pf-c-avatar--m-xl--Height))))));
   }
 }
-.pf-u-screen-reader {
-  position: fixed;
-  top: 0;
-  left: 0;
-  overflow: hidden;
-  clip: rect(0, 0, 0, 0);
-  white-space: nowrap;
-  border: 0;
-}
-
-.pf-u-visible {
-  position: static;
-  overflow: visible;
-  clip: auto;
-  white-space: normal;
-  border: inherit;
-}
-
-.pf-u-hidden {
-  display: none !important;
-}
-
-@media screen and (min-width: 576px) {
-  .pf-u-screen-reader-on-sm {
-    position: fixed;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-  }
-}
-@media screen and (min-width: 576px) {
-  .pf-u-visible-on-sm {
-    position: static;
-    overflow: visible;
-    clip: auto;
-    white-space: normal;
-    border: inherit;
-  }
-}
-@media screen and (min-width: 576px) {
-  .pf-u-hidden-on-sm {
-    display: none !important;
-  }
-}
-@media screen and (min-width: 768px) {
-  .pf-u-screen-reader-on-md {
-    position: fixed;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-  }
-}
-@media screen and (min-width: 768px) {
-  .pf-u-visible-on-md {
-    position: static;
-    overflow: visible;
-    clip: auto;
-    white-space: normal;
-    border: inherit;
-  }
-}
-@media screen and (min-width: 768px) {
-  .pf-u-hidden-on-md {
-    display: none !important;
-  }
-}
-@media screen and (min-width: 992px) {
-  .pf-u-screen-reader-on-lg {
-    position: fixed;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-  }
-}
-@media screen and (min-width: 992px) {
-  .pf-u-visible-on-lg {
-    position: static;
-    overflow: visible;
-    clip: auto;
-    white-space: normal;
-    border: inherit;
-  }
-}
-@media screen and (min-width: 992px) {
-  .pf-u-hidden-on-lg {
-    display: none !important;
-  }
-}
-@media screen and (min-width: 1200px) {
-  .pf-u-screen-reader-on-xl {
-    position: fixed;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-  }
-}
-@media screen and (min-width: 1200px) {
-  .pf-u-visible-on-xl {
-    position: static;
-    overflow: visible;
-    clip: auto;
-    white-space: normal;
-    border: inherit;
-  }
-}
-@media screen and (min-width: 1200px) {
-  .pf-u-hidden-on-xl {
-    display: none !important;
-  }
-}
-@media screen and (min-width: 1450px) {
-  .pf-u-screen-reader-on-2xl {
-    position: fixed;
-    top: 0;
-    left: 0;
-    overflow: hidden;
-    clip: rect(0, 0, 0, 0);
-    white-space: nowrap;
-    border: 0;
-  }
-}
-@media screen and (min-width: 1450px) {
-  .pf-u-visible-on-2xl {
-    position: static;
-    overflow: visible;
-    clip: auto;
-    white-space: normal;
-    border: inherit;
-  }
-}
-@media screen and (min-width: 1450px) {
-  .pf-u-hidden-on-2xl {
-    display: none !important;
-  }
-}
 .pf-c-back-to-top {
   --pf-c-back-to-top--Right: var(--pf-global--spacer--2xl);
   --pf-c-back-to-top--Bottom: var(--pf-global--spacer--lg);
@@ -5454,67 +5454,6 @@ label.pf-c-check, .pf-c-check__label,
     overflow-y: visible;
   }
 }
-.pf-c-date-picker {
-  --pf-c-date-picker--m-top__calendar--Top: 0;
-  --pf-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
-  --pf-c-date-picker__helper-text--MarginTop: var(--pf-global--spacer--xs);
-  --pf-c-date-picker__helper-text--FontSize: var(--pf-global--FontSize--sm);
-  --pf-c-date-picker__helper-text--Color: var(--pf-global--Color--100);
-  --pf-c-date-picker__helper-text--m-error--Color: var(--pf-global--danger-color--100);
-  --pf-c-date-picker__input--c-form-control--Width: calc(var(--pf-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-c-date-picker__input--c-form-control--width-base));
-  --pf-c-date-picker__input--c-form-control--width-base: calc(var(--pf-global--spacer--xl) + var(--pf-global--spacer--sm));
-  --pf-c-date-picker__input--c-form-control--width-chars: 10;
-  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
-  --pf-c-date-picker__calendar--BoxShadow: var(--pf-global--BoxShadow--md);
-  --pf-c-date-picker__calendar--ZIndex: var(--pf-global--ZIndex--sm);
-  --pf-c-date-picker__calendar--Top: calc(100% + var(--pf-global--spacer--xs));
-  --pf-c-date-picker__calendar--Right: auto;
-  --pf-c-date-picker__calendar--Left: 0;
-  --pf-c-date-picker__calendar--m-align-right--Right: 0;
-  --pf-c-date-picker__calendar--m-align-right--Left: auto;
-  position: relative;
-  display: inline-block;
-}
-
-.pf-c-date-picker__helper-text {
-  margin-top: var(--pf-c-date-picker__helper-text--MarginTop);
-  font-size: var(--pf-c-date-picker__helper-text--FontSize);
-  color: var(--pf-c-date-picker__helper-text--Color);
-}
-
-.pf-c-date-picker__helper-text.pf-m-error {
-  --pf-c-date-picker__helper-text--Color: var(--pf-c-date-picker__helper-text--m-error--Color);
-}
-
-.pf-c-date-picker__input .pf-c-form-control {
-  width: var(--pf-c-date-picker__input--c-form-control--Width);
-}
-
-.pf-c-date-picker__calendar {
-  position: absolute;
-  top: var(--pf-c-date-picker__calendar--Top);
-  right: var(--pf-c-date-picker__calendar--Right);
-  left: var(--pf-c-date-picker__calendar--Left);
-  z-index: var(--pf-c-date-picker__calendar--ZIndex);
-  background-color: var(--pf-c-date-picker__calendar--BackgroundColor);
-  box-shadow: var(--pf-c-date-picker__calendar--BoxShadow);
-}
-
-.pf-c-date-picker__calendar.pf-m-align-right {
-  --pf-c-date-picker__calendar--Right: var(--pf-c-date-picker__calendar--m-align-right--Right);
-  --pf-c-date-picker__calendar--Left: var(--pf-c-date-picker__calendar--m-align-right--Left);
-}
-
-.pf-c-date-picker.pf-m-top .pf-c-date-picker__calendar {
-  --pf-c-date-picker__calendar--Top: var(--pf-c-date-picker--m-top__calendar--Top);
-  transform: translateY(var(--pf-c-date-picker--m-top__calendar--TranslateY));
-}
-
-:where(.pf-theme-dark) .pf-c-date-picker {
-  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--300);
-  --pf-c-date-picker__calendar--Top: 100%;
-}
-
 .pf-c-description-list {
   --pf-c-description-list--RowGap: var(--pf-global--gutter--md);
   --pf-c-description-list--ColumnGap: var(--pf-global--spacer--lg);
@@ -6337,6 +6276,67 @@ label.pf-c-check, .pf-c-check__label,
     --pf-c-divider--after--Inset: var(--pf-global--spacer--3xl);
   }
 }
+.pf-c-date-picker {
+  --pf-c-date-picker--m-top__calendar--Top: 0;
+  --pf-c-date-picker--m-top__calendar--TranslateY: calc(-100% - var(--pf-global--spacer--xs));
+  --pf-c-date-picker__helper-text--MarginTop: var(--pf-global--spacer--xs);
+  --pf-c-date-picker__helper-text--FontSize: var(--pf-global--FontSize--sm);
+  --pf-c-date-picker__helper-text--Color: var(--pf-global--Color--100);
+  --pf-c-date-picker__helper-text--m-error--Color: var(--pf-global--danger-color--100);
+  --pf-c-date-picker__input--c-form-control--Width: calc(var(--pf-c-date-picker__input--c-form-control--width-chars) * 1ch + var(--pf-c-date-picker__input--c-form-control--width-base));
+  --pf-c-date-picker__input--c-form-control--width-base: calc(var(--pf-global--spacer--xl) + var(--pf-global--spacer--sm));
+  --pf-c-date-picker__input--c-form-control--width-chars: 10;
+  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--light-100);
+  --pf-c-date-picker__calendar--BoxShadow: var(--pf-global--BoxShadow--md);
+  --pf-c-date-picker__calendar--ZIndex: var(--pf-global--ZIndex--sm);
+  --pf-c-date-picker__calendar--Top: calc(100% + var(--pf-global--spacer--xs));
+  --pf-c-date-picker__calendar--Right: auto;
+  --pf-c-date-picker__calendar--Left: 0;
+  --pf-c-date-picker__calendar--m-align-right--Right: 0;
+  --pf-c-date-picker__calendar--m-align-right--Left: auto;
+  position: relative;
+  display: inline-block;
+}
+
+.pf-c-date-picker__helper-text {
+  margin-top: var(--pf-c-date-picker__helper-text--MarginTop);
+  font-size: var(--pf-c-date-picker__helper-text--FontSize);
+  color: var(--pf-c-date-picker__helper-text--Color);
+}
+
+.pf-c-date-picker__helper-text.pf-m-error {
+  --pf-c-date-picker__helper-text--Color: var(--pf-c-date-picker__helper-text--m-error--Color);
+}
+
+.pf-c-date-picker__input .pf-c-form-control {
+  width: var(--pf-c-date-picker__input--c-form-control--Width);
+}
+
+.pf-c-date-picker__calendar {
+  position: absolute;
+  top: var(--pf-c-date-picker__calendar--Top);
+  right: var(--pf-c-date-picker__calendar--Right);
+  left: var(--pf-c-date-picker__calendar--Left);
+  z-index: var(--pf-c-date-picker__calendar--ZIndex);
+  background-color: var(--pf-c-date-picker__calendar--BackgroundColor);
+  box-shadow: var(--pf-c-date-picker__calendar--BoxShadow);
+}
+
+.pf-c-date-picker__calendar.pf-m-align-right {
+  --pf-c-date-picker__calendar--Right: var(--pf-c-date-picker__calendar--m-align-right--Right);
+  --pf-c-date-picker__calendar--Left: var(--pf-c-date-picker__calendar--m-align-right--Left);
+}
+
+.pf-c-date-picker.pf-m-top .pf-c-date-picker__calendar {
+  --pf-c-date-picker__calendar--Top: var(--pf-c-date-picker--m-top__calendar--Top);
+  transform: translateY(var(--pf-c-date-picker--m-top__calendar--TranslateY));
+}
+
+:where(.pf-theme-dark) .pf-c-date-picker {
+  --pf-c-date-picker__calendar--BackgroundColor: var(--pf-global--BackgroundColor--300);
+  --pf-c-date-picker__calendar--Top: 100%;
+}
+
 .pf-c-drawer {
   --pf-c-drawer__section--BackgroundColor: var(--pf-global--BackgroundColor--100);
   --pf-c-drawer__section--m-light-200--BackgroundColor: var(--pf-global--BackgroundColor--200);

package/dist/umd/react-core.js

@@ -14974,10 +14974,11 @@
     LoginFooter.displayName = 'LoginFooter';
 
     const LoginMainHeader = (_a) => {
-        var { children = null, className = '', title = '', subtitle = '' } = _a, props = __rest$1(_a, ["children", "className", "title", "subtitle"]);
+        var { children = null, className = '', title = '', subtitle = '', headerUtilities = null } = _a, props = __rest$1(_a, ["children", "className", "title", "subtitle", "headerUtilities"]);
         return (React__namespace.createElement("header", Object.assign({ className: css(styles$B.loginMainHeader, className) }, props),
             title && (React__namespace.createElement(Title, { headingLevel: "h2", size: exports.TitleSizes['3xl'] }, title)),
             subtitle && React__namespace.createElement("p", { className: css(styles$B.loginMainHeaderDesc) }, subtitle),
+            headerUtilities && React__namespace.createElement("div", { className: css(styles$B.loginMainHeaderUtilities) }, headerUtilities),
             children));
     };
     LoginMainHeader.displayName = 'LoginMainHeader';
@@ -15000,7 +15001,7 @@
     LoginMainFooter.displayName = 'LoginMainFooter';
 
     const LoginPage = (_a) => {
-        var { children = null, className = '', brandImgSrc = '', brandImgAlt = '', backgroundImgSrc = '', backgroundImgAlt = '', footerListItems = null, textContent = '', footerListVariants, loginTitle, loginSubtitle, signUpForAccountMessage = null, forgotCredentials = null, socialMediaLoginContent = null } = _a, props = __rest$1(_a, ["children", "className", "brandImgSrc", "brandImgAlt", "backgroundImgSrc", "backgroundImgAlt", "footerListItems", "textContent", "footerListVariants", "loginTitle", "loginSubtitle", "signUpForAccountMessage", "forgotCredentials", "socialMediaLoginContent"]);
+        var { children = null, className = '', brandImgSrc = '', brandImgAlt = '', backgroundImgSrc = '', backgroundImgAlt = '', footerListItems = null, textContent = '', footerListVariants, loginTitle, loginSubtitle, headerUtilities, signUpForAccountMessage = null, forgotCredentials = null, socialMediaLoginContent = null } = _a, props = __rest$1(_a, ["children", "className", "brandImgSrc", "brandImgAlt", "backgroundImgSrc", "backgroundImgAlt", "footerListItems", "textContent", "footerListVariants", "loginTitle", "loginSubtitle", "headerUtilities", "signUpForAccountMessage", "forgotCredentials", "socialMediaLoginContent"]);
         const HeaderBrand = (React__namespace.createElement(React__namespace.Fragment, null,
             React__namespace.createElement(Brand, { src: brandImgSrc, alt: brandImgAlt })));
         const Header = React__namespace.createElement(LoginHeader, { headerBrand: HeaderBrand });
@@ -15010,7 +15011,7 @@
         return (React__namespace.createElement(React__namespace.Fragment, null,
             backgroundImgSrc && React__namespace.createElement(BackgroundImage, { src: backgroundImgSrc, alt: backgroundImgAlt }),
             React__namespace.createElement(Login, Object.assign({ header: Header, footer: Footer, className: css(className) }, props),
-                React__namespace.createElement(LoginMainHeader, { title: loginTitle, subtitle: loginSubtitle }),
+                React__namespace.createElement(LoginMainHeader, { title: loginTitle, subtitle: loginSubtitle, headerUtilities: headerUtilities }),
                 React__namespace.createElement(LoginMainBody, null, children),
                 (socialMediaLoginContent || forgotCredentials || signUpForAccountMessage) && (React__namespace.createElement(LoginMainFooter, { socialMediaLoginContent: socialMediaLoginContent, forgotCredentials: forgotCredentials, signUpForAccountMessage: signUpForAccountMessage })))));
     };