updating types export, including all exported interfaces in 'React next' doc for Wizard

Author: jpuzz0

packages/react-core/src/next/components/Wizard/WizardContext.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
-import { Step, SubStep } from './types';
+import { WizardControlStep } from './types';
 import { getActiveStep } from './utils';
 
 export interface WizardContextProps {
   /** List of steps */
-  steps: (Step | SubStep)[];
+  steps: WizardControlStep[];
   /** Active step */
-  activeStep: Step | SubStep;
+  activeStep: WizardControlStep;
   /** Footer element */
   footer: React.ReactElement;
   /** Navigate to the next step */
@@ -28,16 +28,16 @@ export interface WizardContextProps {
 export const WizardContext = React.createContext({} as WizardContextProps);
 
 interface WizardContextRenderProps {
-  steps: (Step | SubStep)[];
-  activeStep: Step | SubStep;
+  steps: WizardControlStep[];
+  activeStep: WizardControlStep;
   footer: React.ReactElement;
   onNext(): void;
   onBack(): void;
   onClose(): void;
 }
 
 export interface WizardContextProviderProps {
-  steps: (Step | SubStep)[];
+  steps: WizardControlStep[];
   currentStepIndex: number;
   footer: React.ReactElement;
   children: React.ReactElement | ((props: WizardContextRenderProps) => React.ReactElement);

packages/react-core/src/next/components/Wizard/WizardFooter.tsx

@@ -4,15 +4,15 @@ import { css } from '@patternfly/react-styles';
 import styles from '@patternfly/react-styles/css/components/Wizard/wizard';
 
 import { Button, ButtonVariant } from '../../../components/Button';
-import { Step, SubStep, WizardNavStepFunction } from './types';
+import { WizardControlStep, WizardNavStepFunction } from './types';
 
 /**
  * Hosts the standard structure of a footer with ties to the active step so that text for buttons can vary from step to step.
  */
 
 export interface WizardFooterProps {
   /** The currently active WizardStep */
-  activeStep: Step | SubStep;
+  activeStep: WizardControlStep;
   /** Next button callback */
   onNext(): WizardNavStepFunction | void;
   /** Back button callback */

packages/react-core/src/next/components/Wizard/WizardStep.tsx

@@ -1,15 +1,15 @@
 import React from 'react';
 
-import { Step } from './types';
+import { WizardControlStep } from './types';
 import { WizardBody, WizardBodyProps } from './WizardBody';
 
 /**
  * Used as a passthrough of step properties for Wizard and all supporting child components.
  * Also acts as a wrapper for content, with an optional inclusion of WizardBody.
  */
 
-export interface WizardStepProps extends Omit<Step, 'parentId' | 'subStepIds' | 'visited'> {
-  /** Optional for when the Step is used as a parent to sub-steps */
+export interface WizardStepProps extends Omit<WizardControlStep, 'parentId' | 'subStepIds' | 'visited'> {
+  /** Optional for when the step is used as a parent to sub-steps */
   children?: React.ReactNode;
   /** Props for WizardBody that wraps content by default. Can be set to null for exclusion of WizardBody. */
   body?: WizardBodyProps | null;

packages/react-core/src/next/components/Wizard/WizardToggle.tsx

@@ -8,14 +8,13 @@ import CaretDownIcon from '@patternfly/react-icons/dist/esm/icons/caret-down-ico
 import { KeyTypes } from '../../../helpers/constants';
 import { WizardNav, WizardNavItem } from '../../../components/Wizard';
 import {
-  Step,
-  SubStep,
-  isWizardSubStep,
-  isCustomWizardNav,
+  WizardControlStep,
   CustomWizardNavFunction,
   DefaultWizardNavProps,
   isWizardBasicStep,
-  isWizardParentStep
+  isWizardParentStep,
+  isWizardSubStep,
+  isCustomWizardNav
 } from './types';
 
 /**
@@ -24,9 +23,9 @@ import {
 
 export interface WizardToggleProps {
   /** List of steps and/or sub-steps */
-  steps: (Step | SubStep)[];
+  steps: WizardControlStep[];
   /** The currently active WizardStep */
-  activeStep: Step | SubStep;
+  activeStep: WizardControlStep;
   /** The WizardFooter */
   footer: React.ReactElement;
   /** Custom WizardNav or callback used to create a default WizardNav */

packages/react-core/src/next/components/Wizard/__tests__/Wizard.test.tsx

@@ -4,8 +4,8 @@ import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
 
 import { WizardNav, WizardNavItem } from '../../../../components/Wizard';
-import { DefaultWizardNavProps, Step, SubStep } from '../types';
-import { DefaultWizardFooterProps, Wizard, WizardStep } from '..';
+import { DefaultWizardNavProps, WizardControlStep, DefaultWizardFooterProps } from '../types';
+import { Wizard, WizardStep } from '..';
 
 describe('Wizard', () => {
   it('renders step when child is of type WizardStep', () => {
@@ -123,8 +123,8 @@ describe('Wizard', () => {
   it('renders custom nav', () => {
     const nav = (
       isOpen: boolean,
-      steps: (Step | SubStep)[],
-      activeStep: Step | SubStep,
+      steps: WizardControlStep[],
+      activeStep: WizardControlStep,
       goToStepByIndex: (index: number) => void
     ) => (
       <WizardNav isOpen={isOpen}>

packages/react-core/src/next/components/Wizard/examples/Wizard.md

@@ -2,7 +2,7 @@
 id: Wizard
 section: components
 cssPrefix: pf-c-wizard
-propComponents: ['Wizard', 'WizardStep', 'WizardFooter', 'WizardToggle', 'WizardStep', 'WizardBody', 'WizardContextProps', 'Step', 'SubStep']
+propComponents: ['Wizard', 'WizardStep', 'WizardFooter', 'WizardToggle', 'WizardStep', 'WizardBody', 'WizardContextProps', 'WizardBasicStep', 'WizardParentStep', 'WizardSubStep', 'DefaultWizardNavProps', 'DefaultWizardFooterProps']
 beta: true
 ---
 

packages/react-core/src/next/components/Wizard/examples/WizardCustomNav.tsx

@@ -1,12 +1,12 @@
 import React from 'react';
 import { WizardNav, WizardNavItem } from '@patternfly/react-core';
-import { Wizard, WizardStep, Step, SubStep } from '@patternfly/react-core/next';
+import { Wizard, WizardStep, WizardControlStep } from '@patternfly/react-core/next';
 
 export const WizardCustomNav: React.FunctionComponent = () => {
   const nav = (
     isOpen: boolean,
-    steps: (Step | SubStep)[],
-    activeStep: Step | SubStep,
+    steps: WizardControlStep[],
+    activeStep: WizardControlStep,
     goToStepByIndex: (index: number) => void
   ) => (
     <WizardNav isOpen={isOpen}>

packages/react-core/src/next/components/Wizard/examples/WizardKitchenSink.tsx

@@ -16,13 +16,13 @@ import {
   WizardHeader
 } from '@patternfly/react-core';
 import {
-  Step,
   Wizard,
   WizardStep,
   WizardBody,
   WizardFooter,
-  useWizardFooter,
   WizardStepProps,
+  WizardControlStep,
+  useWizardFooter,
   useWizardContext
 } from '@patternfly/react-core/next';
 import { css } from '@patternfly/react-styles';
@@ -35,7 +35,7 @@ const CustomWizardFooter = () => {
 
 const CustomNavItem = () => {
   const { steps, activeStep, goToStepByIndex } = useWizardContext();
-  const step = (steps.find(step => step.id === 'third-step') || {}) as Step;
+  const step = (steps.find(step => step.id === 'third-step') || {}) as WizardControlStep;
 
   return (
     <WizardNavItem

packages/react-core/src/next/components/Wizard/index.ts

@@ -4,8 +4,5 @@ export * from './WizardFooter';
 export * from './WizardToggle';
 export * from './WizardStep';
 export * from './hooks';
+export * from './types';
 export { useWizardContext } from './WizardContext';
-
-import * as Types from './types';
-export type Step = Types.Step;
-export type SubStep = Types.SubStep;

packages/react-core/src/next/components/Wizard/types.tsx

@@ -1,9 +1,7 @@
 import React from 'react';
 import { WizardNavItemProps, WizardNavProps } from '../../../components/Wizard';
 
-/** Initially inferred from WizardStep components, these properties represent what is controllable from within WizardContext for a given step. */
-
-export interface Step {
+export interface WizardBasicStep {
   /** Name of the step's nav item */
   name: React.ReactNode;
   /** Unique identifier */
@@ -14,8 +12,6 @@ export interface Step {
   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;
-  /** Nested step IDs */
-  subStepIds?: string[];
   /** (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. */
@@ -28,14 +24,18 @@ export interface Step {
   hideBackButton?: boolean;
 }
 
-/** With the same purpose as Step, SubStep inherits all properties of Step with the exception of subStepIds. */
+export interface WizardParentStep extends WizardBasicStep {
+  /** Nested step IDs */
+  subStepIds?: string[];
+}
 
-export interface SubStep extends Omit<Step, 'subStepIds'> {
+export interface WizardSubStep extends WizardBasicStep {
   /** Unique identifier of the parent step */
   parentId?: string | number;
 }
 
-export type WizardNavStepData = Pick<Step | SubStep, 'id' | 'name'>;
+export type WizardControlStep = WizardBasicStep | WizardParentStep | WizardSubStep;
+export type WizardNavStepData = Pick<WizardControlStep, 'id' | 'name'>;
 export type WizardNavStepFunction = (currentStep: WizardNavStepData, previousStep: WizardNavStepData) => void;
 
 export interface DefaultWizardNavProps {
@@ -60,8 +60,8 @@ export interface DefaultWizardFooterProps {
 
 export type CustomWizardNavFunction = (
   isOpen: boolean,
-  steps: (Step | SubStep)[],
-  activeStep: Step | SubStep,
+  steps: WizardControlStep[],
+  activeStep: WizardControlStep,
   goToStepByIndex: (index: number) => void
 ) => React.ReactElement<WizardNavProps>;
 
@@ -77,14 +77,14 @@ export function isCustomWizardFooter(
   return React.isValidElement(footer);
 }
 
-export function isWizardBasicStep(step: Step | SubStep): step is Step {
-  return (step as Step)?.subStepIds === undefined && !isWizardSubStep(step);
+export function isWizardBasicStep(step: WizardControlStep): step is WizardBasicStep {
+  return (step as WizardParentStep)?.subStepIds === undefined && !isWizardSubStep(step);
 }
 
-export function isWizardSubStep(step: Step | SubStep): step is SubStep {
-  return (step as SubStep)?.parentId !== undefined;
+export function isWizardSubStep(step: WizardControlStep): step is WizardSubStep {
+  return (step as WizardSubStep)?.parentId !== undefined;
 }
 
-export function isWizardParentStep(step: Step | SubStep): step is Step {
-  return (step as Step)?.subStepIds !== undefined;
+export function isWizardParentStep(step: WizardControlStep): step is WizardParentStep {
+  return (step as WizardParentStep)?.subStepIds !== undefined;
 }