fix nits

Author: TheSonOfThomp

packages/wizard/src/Wizard/Wizard.styles.ts

@@ -1,12 +1,12 @@
 import { css } from '@leafygreen-ui/emotion';
+import { spacing } from '@leafygreen-ui/tokens';
 
 export const wizardContainerStyles = css`
   width: 100%;
   height: 100%;
   display: flex;
   flex-direction: column;
-  gap: 24px;
-  outline: 1px solid red;
+  gap: ${spacing[600]}px;
 `;
 
 export const stepContentStyles = css`

packages/wizard/src/Wizard/Wizard.tsx

@@ -3,14 +3,14 @@ import React, { Children, isValidElement } from 'react';
 import { Direction } from '@leafygreen-ui/descendants';
 import { findChild } from '@leafygreen-ui/lib';
 
-import { WIZARD_FOOTER_KEY } from '../constants';
 import { useWizardControlledValue } from '../utils/useWizardControlledValue/useWizardControlledValue';
 import { WizardContext } from '../WizardContext/WizardContext';
 import { WizardFooter } from '../WizardFooter';
 import { WizardStep } from '../WizardStep';
 
 import { stepContentStyles, wizardContainerStyles } from './Wizard.styles';
 import { WizardProps } from './Wizard.types';
+import { WizardSubComponentProperties } from '../constants';
 
 export function Wizard({
   activeStep: activeStepProp,
@@ -50,7 +50,7 @@ export function Wizard({
     onStepChange?.(getNextStep(activeStep));
   };
 
-  const footerChild = findChild(children, WIZARD_FOOTER_KEY);
+  const footerChild = findChild(children, WizardSubComponentProperties.Footer);
 
   // Get the current step to render
   const currentStep = stepChildren[activeStep] || null;

packages/wizard/src/WizardFooter/WizardFooter.tsx

@@ -3,10 +3,10 @@ import React, { MouseEventHandler } from 'react';
 import { Direction } from '@leafygreen-ui/descendants';
 import FormFooter from '@leafygreen-ui/form-footer';
 
-import { WIZARD_FOOTER_KEY } from '../constants';
 import { useWizardContext } from '../WizardContext/WizardContext';
 
 import { WizardFooterProps } from './WizardFooter.types';
+import { WizardSubComponentProperties } from '../constants';
 
 export const WizardFooter = ({
   backButtonProps,
@@ -45,4 +45,4 @@ export const WizardFooter = ({
 };
 
 WizardFooter.displayName = 'WizardFooter';
-WizardFooter[WIZARD_FOOTER_KEY] = true;
+WizardFooter[WizardSubComponentProperties.Footer] = true;

packages/wizard/src/constants.ts

@@ -1,2 +1,6 @@
-export const WIZARD_STEP_KEY = 'isWizardStep';
-export const WIZARD_FOOTER_KEY = 'isWizardFooter';
+export const WizardSubComponentProperties = {
+  Step: 'isWizardStep',
+  Footer: 'isWizardFooter',
+} as const;
+export type WizardSubComponentProperties =
+  (typeof WizardSubComponentProperties)[keyof typeof WizardSubComponentProperties];