@patternfly/react-core 5.3.3 → 5.4.0-prerelease.10

package/src/components/Wizard/examples/Wizard.md

@@ -16,7 +16,7 @@ propComponents:
     'WizardContextProps',
     'WizardBasicStep',
     'WizardParentStep',
-    'WizardSubStep',
+    'WizardSubStep'
   ]
 ---
 
@@ -57,91 +57,119 @@ import layout from '@patternfly/react-styles/css/layouts/Bullseye/bullseye';
 ### Basic
 
 ```ts file="./WizardBasic.tsx"
+
+```
+
+### Focus content on next/back
+
+To focus the main content element of the `Wizard`, pass in the `shouldFocusContent` property. It is recommended that this is passed in so that users can navigate through a `WizardStep` content in order.
+
+If a `WizardStep` is passed a `body={null}` property, you must manually handle focus.
+
+```ts file="./WizardFocusOnNextBack.tsx"
+
 ```
 
 ### Basic with disabled steps
 
 ```ts file="./WizardBasicDisabledSteps.tsx"
+
 ```
 
 ### Anchors for nav items
 
 ```ts file="./WizardWithNavAnchors.tsx"
+
 ```
 
 ### Incrementally enabled steps
 
 ```ts file="./WizardStepVisitRequired.tsx"
+
 ```
 
 ### Expandable steps
 
 ```ts file="./WizardExpandableSteps.tsx"
+
 ```
 
 ### Progress after submission
 
 ```ts file="./WizardWithSubmitProgress.tsx"
+
 ```
 
 ### Enabled on form validation
 
 ```ts file="./WizardEnabledOnFormValidation.tsx"
+
 ```
 
 ### Validate on button press
 
 ```ts file="./WizardValidateOnButtonPress.tsx"
+
 ```
 
 ### Progressive steps
 
 ```ts file="./WizardProgressiveSteps.tsx"
+
 ```
 
 ### Get current step
 
 ```ts file="./WizardGetCurrentStep.tsx"
+
 ```
 
 ### Within modal
 
 ```ts file="./WizardWithinModal.tsx"
+
 ```
 
 ### Step drawer content
 
 ```ts file="./WizardStepDrawerContent.tsx"
+
 ```
 
 ### Custom navigation
 
 ```ts file="./WizardWithCustomNav.tsx"
+
 ```
 
 ### Header
 
 ```ts file="./WizardWithHeader.tsx"
+
 ```
 
 ### Custom footer
 
 ```ts file="./WizardWithCustomFooter.tsx"
+
 ```
 
 ### Custom navigation item
 
 ```ts file="./WizardWithCustomNavItem.tsx"
+
 ```
 
 ### Toggle step visibility
 
 ```ts file="./WizardToggleStepVisibility.tsx"
+
 ```
 
 ### Step error status
 
 ```ts file="./WizardStepErrorStatus.tsx"
+
 ```
 
 ## Hooks

package/src/components/Wizard/examples/WizardFocusOnNextBack.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { Wizard, WizardStep } from '@patternfly/react-core';
+
+export const WizardFocusOnNextBack: React.FunctionComponent = () => (
+  <Wizard shouldFocusContent title="Wizard that focuses content on next or back click">
+    <WizardStep name="Step 1" id="wizard-focus-first-step">
+      Step 1 content
+    </WizardStep>
+    <WizardStep name="Step 2" id="wizard-focus-second-step">
+      Step 2 content
+    </WizardStep>
+    <WizardStep name="Review" id="wizard-focus-review-step" footer={{ nextButtonText: 'Finish' }}>
+      Review step content
+    </WizardStep>
+  </Wizard>
+);

package/src/components/Wizard/examples/WizardWithCustomFooter.tsx

@@ -40,12 +40,12 @@ const CustomStepTwoFooter = () => {
 
   return (
     <WizardFooterWrapper>
-      <Button variant="primary" onClick={onNext} isLoading={isLoading} isDisabled={isLoading}>
-        Async Next
-      </Button>
       <Button variant="secondary" onClick={goToPrevStep} isDisabled={isLoading}>
         Back
       </Button>
+      <Button variant="primary" onClick={onNext} isLoading={isLoading} isDisabled={isLoading}>
+        Async Next
+      </Button>
       <Button variant="link" onClick={close} isDisabled={isLoading}>
         Cancel
       </Button>

package/src/deprecated/components/ApplicationLauncher/examples/ApplicationLauncher.md

@@ -12,6 +12,7 @@ import { DropdownDirection, DropdownPosition } from '@patternfly/react-core/depr
 import HelpIcon from '@patternfly/react-icons/dist/esm/icons/help-icon';
 import { Link } from '@reach/router';
 import pfLogoSm from '@patternfly/react-core/src/demos/assets/pf-logo-small.svg';
+import c_app_launcher__menu_item_Color from '@patternfly/react-tokens/dist/esm/c_app_launcher__menu_item_Color';
 
 Note: Application launcher is built on dropdown, for extended API go to [dropdown](/components/menus/dropdown) documentation.
 To add a tooltip, use the `tooltip` prop and optionally add more tooltip props by using `tooltipProps`. For more tooltip information go to [tooltip](/components/tooltip).