updating site examples

Author: Yuraima Estevez

polaris.shopify.com/pages/examples/button-group-outline-with-segmented-buttons.tsx

@@ -4,7 +4,7 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 
 function ButtonGroupOutlineWithSegmentedButtonsExample() {
   return (
-    <ButtonGroup segmented>
+    <ButtonGroup variant="segmented">
       <Button outline>Bold</Button>
       <Button outline>Italic</Button>
       <Button outline>Underline</Button>

polaris.shopify.com/pages/examples/button-group-pressed-with-segmented-buttons.tsx

@@ -14,7 +14,7 @@ function ButtonGroupPressedWithSegmentedButtonsExample() {
   );
 
   return (
-    <ButtonGroup segmented>
+    <ButtonGroup variant="segmented">
       <Button
         pressed={activeButtonIndex === 0}
         onClick={() => handleButtonClick(0)}

polaris.shopify.com/pages/examples/button-group-with-segmented-buttons.tsx

@@ -4,7 +4,7 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 
 function ButtonGroupExample() {
   return (
-    <ButtonGroup segmented>
+    <ButtonGroup variant="segmented">
       <Button>Bold</Button>
       <Button>Italic</Button>
       <Button>Underline</Button>

polaris.shopify.com/pages/examples/button-pressed.tsx

@@ -16,7 +16,7 @@ function PressedButton() {
   }, [isFirstButtonActive]);
 
   return (
-    <ButtonGroup segmented>
+    <ButtonGroup variant="segmented">
       <Button pressed={isFirstButtonActive} onClick={handleFirstButtonClick}>
         First button
       </Button>

polaris.shopify.com/pages/examples/toast-multiple-messages.tsx

@@ -28,7 +28,7 @@ function MultipleToastExample() {
     <div style={{height: '250px'}}>
       <Frame>
         <Page title="Toast example">
-          <ButtonGroup segmented>
+          <ButtonGroup variant="segmented">
             <Button onClick={toggleActiveOne}>Show toast 1</Button>
             <Button onClick={toggleActiveTwo}>Show toast 2</Button>
           </ButtonGroup>

polaris.shopify.com/pages/examples/tooltip-visible-only-with-child-interaction.tsx

@@ -5,7 +5,7 @@ import {withPolarisExample} from '../../src/components/PolarisExampleWrapper';
 function TooltipExample() {
   return (
     <div style={{width: '200px'}}>
-      <ButtonGroup segmented fullWidth>
+      <ButtonGroup variant="segmented" fullWidth>
         <Tooltip content="Bold" dismissOnMouseOut>
           <Button>B</Button>
         </Tooltip>