fix(v8 FocusZone): Add wrapping to FocusZone examples to avoid truncation on smaller screens (#34975)

Author: emmayjiang

packages/react-examples/src/react-focus/FocusZone/FocusZone.Disabled.Example.tsx

@@ -12,7 +12,7 @@ export const FocusZoneDisabledExample: React.FunctionComponent = () => {
   return (
     <Stack tokens={tokens} horizontalAlign="start">
       <FocusZone direction={FocusZoneDirection.horizontal}>
-        <Stack tokens={tokens} horizontal verticalAlign="center">
+        <Stack tokens={tokens} horizontal verticalAlign="center" wrap>
           <span>Enabled FocusZone: </span>
           <DefaultButton>Button 1</DefaultButton>
           <DefaultButton>Button 2</DefaultButton>
@@ -22,7 +22,7 @@ export const FocusZoneDisabledExample: React.FunctionComponent = () => {
       </FocusZone>
       <DefaultButton>Tabbable Element 1</DefaultButton>
       <FocusZone disabled={true}>
-        <Stack tokens={tokens} horizontal verticalAlign="center">
+        <Stack tokens={tokens} horizontal verticalAlign="center" wrap>
           <span>Disabled FocusZone: </span>
           <DefaultButton>Button 1</DefaultButton>
           <DefaultButton>Button 2</DefaultButton>

packages/react-examples/src/react-focus/FocusZone/FocusZone.Tabbable.Example.tsx

@@ -28,7 +28,7 @@ export const FocusZoneTabbableExample: React.FunctionComponent = () => {
         handleTabKey={FocusZoneTabbableElements.all}
         isCircularNavigation={true}
       >
-        <Stack tokens={tokens} horizontal verticalAlign="center">
+        <Stack tokens={tokens} horizontal verticalAlign="center" wrap>
           <span>Circular Tabbable FocusZone: </span>
           <DefaultButton>Button 1</DefaultButton>
           <DefaultButton>Button 2</DefaultButton>
@@ -48,7 +48,7 @@ export const FocusZoneTabbableExample: React.FunctionComponent = () => {
         handleTabKey={FocusZoneTabbableElements.inputOnly}
         isCircularNavigation={false}
       >
-        <Stack tokens={tokens} horizontal verticalAlign="center">
+        <Stack tokens={tokens} horizontal verticalAlign="center" wrap>
           <span>Input Only FocusZone: </span>
           <DefaultButton>Button 1</DefaultButton>
           <DefaultButton>Button 2</DefaultButton>