From e595b9a42fc594bd2d4fee24900ed92f485ef563 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Tue, 27 Jun 2023 18:04:15 -0400
Subject: [PATCH 01/13] fixes type errors that appeared during v36 updates

---
 src/CounterLabel/CounterLabel.tsx    |  1 -
 src/Token/TokenBase.tsx              | 35 +++++++++++++++-------------
 src/drafts/MarkdownEditor/Footer.tsx |  5 ++--
 3 files changed, 22 insertions(+), 19 deletions(-)

diff --git a/src/CounterLabel/CounterLabel.tsx b/src/CounterLabel/CounterLabel.tsx
index 7de16f4405a..7871e2c24a5 100644
--- a/src/CounterLabel/CounterLabel.tsx
+++ b/src/CounterLabel/CounterLabel.tsx
@@ -34,7 +34,6 @@ const CounterLabel = forwardRef<HTMLSpanElement, CounterLabelProps>(
           )}
           {...props}
           as="span"
-          // @ts-expect-error Box is expecting a divelement, but this component forces a span element
           ref={forwardedRef}
         >
           {children}
diff --git a/src/Token/TokenBase.tsx b/src/Token/TokenBase.tsx
index 366a51edc04..a0ae3688b43 100644
--- a/src/Token/TokenBase.tsx
+++ b/src/Token/TokenBase.tsx
@@ -128,22 +128,25 @@ const StyledTokenBase = styled.span<
   ${sx}
 `
 
-const TokenBase = React.forwardRef(({onRemove, onKeyDown, id, size = defaultTokenSize, ...rest}, forwardedRef) => {
-  return (
-    <StyledTokenBase
-      onKeyDown={(event: KeyboardEvent<HTMLSpanElement & HTMLAnchorElement & HTMLButtonElement>) => {
-        onKeyDown && onKeyDown(event)
+const TokenBase = React.forwardRef<HTMLButtonElement | HTMLAnchorElement | HTMLSpanElement | undefined, TokenBaseProps>(
+  ({onRemove, onKeyDown, id, size = defaultTokenSize, ...rest}, forwardedRef) => {
+    return (
+      <StyledTokenBase
+        onKeyDown={(event: KeyboardEvent<HTMLSpanElement & HTMLAnchorElement & HTMLButtonElement>) => {
+          onKeyDown && onKeyDown(event)
 
-        if ((event.key === 'Backspace' || event.key === 'Delete') && onRemove) {
-          onRemove()
-        }
-      }}
-      id={id?.toString()}
-      size={size}
-      {...rest}
-      ref={forwardedRef}
-    />
-  )
-}) as PolymorphicForwardRefComponent<'span' | 'a' | 'button', TokenBaseProps & SxProp>
+          if ((event.key === 'Backspace' || event.key === 'Delete') && onRemove) {
+            onRemove()
+          }
+        }}
+        id={id?.toString()}
+        size={size}
+        {...rest}
+        // @ts-expect-error TokenBase wants Anchor, Button, and Span refs
+        ref={forwardedRef}
+      />
+    )
+  },
+) as PolymorphicForwardRefComponent<'span' | 'a' | 'button', TokenBaseProps & SxProp>
 
 export default TokenBase
diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index 3b23623c843..230c58b37c4 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -1,7 +1,8 @@
 import React, {memo, forwardRef, useContext} from 'react'
 import {AlertIcon, ImageIcon, MarkdownIcon} from '@primer/octicons-react'
 
-import {Spinner, Button, ButtonProps, LinkButton, Box, Text} from '../..'
+import {Spinner, LinkButton, Box, Text} from '../..'
+import {Button, ButtonProps} from '../Button2'
 import {MarkdownEditorContext} from './_MarkdownEditorContext'
 import {useSlots} from '../../hooks/useSlots'
 
@@ -80,7 +81,7 @@ const FileUploadButton = memo(({fileDraggedOver, ...props}: Partial<ButtonProps>
   return (
     <Button
       variant="invisible"
-      leadingVisual={ImageIcon}
+      leadingIcon={ImageIcon}
       size="small"
       sx={{color: 'fg.default', fontWeight: fileDraggedOver ? 'bold' : 'normal', px: 2}}
       onMouseDown={(e: React.MouseEvent) => {

From 21cfbfc0a02aa5d98d110b459f75289092b1e01a Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Tue, 27 Jun 2023 18:05:18 -0400
Subject: [PATCH 02/13] adds changeset

---
 .changeset/few-rocks-run.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/few-rocks-run.md

diff --git a/.changeset/few-rocks-run.md b/.changeset/few-rocks-run.md
new file mode 100644
index 00000000000..4a4276a6e9f
--- /dev/null
+++ b/.changeset/few-rocks-run.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Fixes type errors that appeared during v36 development. Likely caused by Button updates

From dc67b2c059001d96cf11747b4abfa896046fbdb2 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 12:16:16 -0400
Subject: [PATCH 03/13] re-add ts-expect-error to CounterLabel ref

---
 src/CounterLabel/CounterLabel.tsx | 1 +
 1 file changed, 1 insertion(+)

diff --git a/src/CounterLabel/CounterLabel.tsx b/src/CounterLabel/CounterLabel.tsx
index 7871e2c24a5..7de16f4405a 100644
--- a/src/CounterLabel/CounterLabel.tsx
+++ b/src/CounterLabel/CounterLabel.tsx
@@ -34,6 +34,7 @@ const CounterLabel = forwardRef<HTMLSpanElement, CounterLabelProps>(
           )}
           {...props}
           as="span"
+          // @ts-expect-error Box is expecting a divelement, but this component forces a span element
           ref={forwardedRef}
         >
           {children}

From 186d2d8a76e330ad1340d29ec6d513d066bbc343 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 15:06:48 -0400
Subject: [PATCH 04/13] fixes circular depency in CheckboxOrRadioGroup (I
 think)

---
 .../CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx     |  8 +-------
 .../CheckboxOrRadioGroupCaption.tsx                   |  2 +-
 .../CheckboxOrRadioGroupContext.tsx                   | 11 +++++++++++
 .../CheckboxOrRadioGroupLabel.tsx                     |  2 +-
 .../CheckboxOrRadioGroupValidation.tsx                |  2 +-
 src/internal/components/CheckboxOrRadioGroup/index.ts |  3 ++-
 6 files changed, 17 insertions(+), 11 deletions(-)
 create mode 100644 src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx

diff --git a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx
index fa8b9ab47ba..18c8e8376aa 100644
--- a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx
+++ b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroup.tsx
@@ -7,6 +7,7 @@ import {useSSRSafeId} from '../../../utils/ssr'
 import CheckboxOrRadioGroupCaption from './CheckboxOrRadioGroupCaption'
 import CheckboxOrRadioGroupLabel from './CheckboxOrRadioGroupLabel'
 import CheckboxOrRadioGroupValidation from './CheckboxOrRadioGroupValidation'
+import CheckboxOrRadioGroupContext from './CheckboxOrRadioGroupContext'
 import VisuallyHidden from '../../../_VisuallyHidden'
 import {useSlots} from '../../../hooks/useSlots'
 import {SxProp} from '../../../sx'
@@ -31,13 +32,6 @@ export type CheckboxOrRadioGroupProps = {
   required?: boolean
 } & SxProp
 
-export type CheckboxOrRadioGroupContext = {
-  validationMessageId?: string
-  captionId?: string
-} & CheckboxOrRadioGroupProps
-
-export const CheckboxOrRadioGroupContext = React.createContext<CheckboxOrRadioGroupContext>({})
-
 const Body = styled.div`
   display: flex;
   flex-direction: column;
diff --git a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx
index bab1bad56dd..2406775f139 100644
--- a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx
+++ b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupCaption.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import Text from '../../../Text'
 import {SxProp} from '../../../sx'
-import {CheckboxOrRadioGroupContext} from './CheckboxOrRadioGroup'
+import CheckboxOrRadioGroupContext from './CheckboxOrRadioGroupContext'
 
 const CheckboxOrRadioGroupCaption: React.FC<React.PropsWithChildren<SxProp>> = ({children, sx}) => {
   const {disabled, captionId} = React.useContext(CheckboxOrRadioGroupContext)
diff --git a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx
new file mode 100644
index 00000000000..2c52f3b10fa
--- /dev/null
+++ b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupContext.tsx
@@ -0,0 +1,11 @@
+import React from 'react'
+import {CheckboxOrRadioGroupProps} from './CheckboxOrRadioGroup'
+
+export type CheckboxOrRadioGroupContext = {
+  validationMessageId?: string
+  captionId?: string
+} & CheckboxOrRadioGroupProps
+
+const CheckboxOrRadioGroupContext = React.createContext<CheckboxOrRadioGroupContext>({})
+
+export default CheckboxOrRadioGroupContext
diff --git a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx
index 6d2067a4385..cfa47df4e67 100644
--- a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx
+++ b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupLabel.tsx
@@ -2,7 +2,7 @@ import React from 'react'
 import Box from '../../../Box'
 import VisuallyHidden from '../../../_VisuallyHidden'
 import {SxProp} from '../../../sx'
-import {CheckboxOrRadioGroupContext} from './CheckboxOrRadioGroup'
+import CheckboxOrRadioGroupContext from './CheckboxOrRadioGroupContext'
 
 export type CheckboxOrRadioGroupLabelProps = {
   /**
diff --git a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx
index 2a23adb47a9..3a350c32360 100644
--- a/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx
+++ b/src/internal/components/CheckboxOrRadioGroup/CheckboxOrRadioGroupValidation.tsx
@@ -2,7 +2,7 @@ import React from 'react'
 import InputValidation from '../InputValidation'
 import {SxProp} from '../../../sx'
 import {FormValidationStatus} from '../../../utils/types/FormValidationStatus'
-import {CheckboxOrRadioGroupContext} from './CheckboxOrRadioGroup'
+import CheckboxOrRadioGroupContext from './CheckboxOrRadioGroupContext'
 
 export type CheckboxOrRadioGroupValidationProps = {
   /** Changes the visual style to match the validation status */
diff --git a/src/internal/components/CheckboxOrRadioGroup/index.ts b/src/internal/components/CheckboxOrRadioGroup/index.ts
index 0a399acd807..06b176e89ce 100644
--- a/src/internal/components/CheckboxOrRadioGroup/index.ts
+++ b/src/internal/components/CheckboxOrRadioGroup/index.ts
@@ -1,2 +1,3 @@
-export {default, CheckboxOrRadioGroupContext} from './CheckboxOrRadioGroup'
+export {default} from './CheckboxOrRadioGroup'
 export type {CheckboxOrRadioGroupProps} from './CheckboxOrRadioGroup'
+export {default as CheckboxOrRadioGroupContext} from './CheckboxOrRadioGroupContext'

From 1a939021442dee41ec61fb487e7879296093fa04 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 15:50:42 -0400
Subject: [PATCH 05/13] testing a fix for CI type errors

---
 src/drafts/MarkdownEditor/Actions.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/drafts/MarkdownEditor/Actions.tsx b/src/drafts/MarkdownEditor/Actions.tsx
index 25055e623b9..5cc8edfd847 100644
--- a/src/drafts/MarkdownEditor/Actions.tsx
+++ b/src/drafts/MarkdownEditor/Actions.tsx
@@ -1,5 +1,5 @@
 import React, {forwardRef, useContext} from 'react'
-import {Button, ButtonProps} from '../../Button'
+import {Button, ButtonProps} from '../Button2'
 import {MarkdownEditorContext} from './_MarkdownEditorContext'
 
 export const Actions = ({children}: {children?: React.ReactNode}) => <>{children}</>

From 60108b7b3e1daad9052418486e10bdb2e39a9b6d Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 15:56:31 -0400
Subject: [PATCH 06/13] testing ANOTHER fix for CI type errors

---
 src/drafts/Button2/types.ts          | 2 +-
 src/drafts/MarkdownEditor/Footer.tsx | 4 ++++
 2 files changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/drafts/Button2/types.ts b/src/drafts/Button2/types.ts
index 7c92531816b..30c7a2ba555 100644
--- a/src/drafts/Button2/types.ts
+++ b/src/drafts/Button2/types.ts
@@ -20,7 +20,7 @@ type ButtonA11yProps =
 
 export type ButtonBaseProps = {
   /**
-   * Determine's the styles on a button one of 'default' | 'primary' | 'invisible' | 'danger'
+   * Determine's the styles on a button one of 'default' | 'primary' | 'invisible' | 'danger' | 'outline'
    */
   variant?: VariantType
   /**
diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index 230c58b37c4..d44eadd5ebe 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -51,6 +51,10 @@ FooterButton.displayName = 'MarkdownEditor.FooterButton'
 const DefaultFooterButtons = memo(() => {
   const {uploadButtonProps, fileDraggedOver} = useContext(MarkdownEditorContext)
 
+  // Removing the variant prop from the upload button because it's causing a mysterious type error
+  // in the "size" check in CI. The variant prop is not used by the upload button anyway.
+  delete uploadButtonProps?.variant
+
   return (
     <>
       <MarkdownSupportedHint />

From 0e8b90e7f1513c4981f34ba5042c9bb9f006b7af Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 16:04:39 -0400
Subject: [PATCH 07/13] testing ONE MORE fix for CI type erros on the 'size'
 check

---
 src/drafts/MarkdownEditor/Footer.tsx | 8 +++-----
 1 file changed, 3 insertions(+), 5 deletions(-)

diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index d44eadd5ebe..6e7af774011 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -50,10 +50,8 @@ FooterButton.displayName = 'MarkdownEditor.FooterButton'
 
 const DefaultFooterButtons = memo(() => {
   const {uploadButtonProps, fileDraggedOver} = useContext(MarkdownEditorContext)
-
-  // Removing the variant prop from the upload button because it's causing a mysterious type error
-  // in the "size" check in CI. The variant prop is not used by the upload button anyway.
-  delete uploadButtonProps?.variant
+  // eslint-disable-next-line @typescript-eslint/no-unused-vars
+  const {variant, ...uploadButtonPropsRest} = uploadButtonProps || {}
 
   return (
     <>
@@ -62,7 +60,7 @@ const DefaultFooterButtons = memo(() => {
       {uploadButtonProps && (
         <>
           <VisualSeparator />
-          <FileUploadButton fileDraggedOver={fileDraggedOver} {...uploadButtonProps} />
+          <FileUploadButton fileDraggedOver={fileDraggedOver} {...uploadButtonPropsRest} />
         </>
       )}
     </>

From 2c002519c09ddf793dd749ce596dada9d2c92307 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Wed, 28 Jun 2023 16:14:39 -0400
Subject: [PATCH 08/13] removes janky attempt at fixing CI 'size' check's type
 error

---
 src/drafts/MarkdownEditor/Footer.tsx | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index 6e7af774011..230c58b37c4 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -50,8 +50,6 @@ FooterButton.displayName = 'MarkdownEditor.FooterButton'
 
 const DefaultFooterButtons = memo(() => {
   const {uploadButtonProps, fileDraggedOver} = useContext(MarkdownEditorContext)
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars
-  const {variant, ...uploadButtonPropsRest} = uploadButtonProps || {}
 
   return (
     <>
@@ -60,7 +58,7 @@ const DefaultFooterButtons = memo(() => {
       {uploadButtonProps && (
         <>
           <VisualSeparator />
-          <FileUploadButton fileDraggedOver={fileDraggedOver} {...uploadButtonPropsRest} />
+          <FileUploadButton fileDraggedOver={fileDraggedOver} {...uploadButtonProps} />
         </>
       )}
     </>

From 75f843d4927405f78d68c0310c11789eea0e3b9a Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Thu, 29 Jun 2023 21:34:41 +1000
Subject: [PATCH 09/13] replace Button2 with Button

---
 src/drafts/MarkdownEditor/Actions.tsx               | 2 +-
 src/drafts/MarkdownEditor/Footer.tsx                | 2 +-
 src/drafts/MarkdownEditor/_MarkdownEditorContext.ts | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/drafts/MarkdownEditor/Actions.tsx b/src/drafts/MarkdownEditor/Actions.tsx
index 5cc8edfd847..25055e623b9 100644
--- a/src/drafts/MarkdownEditor/Actions.tsx
+++ b/src/drafts/MarkdownEditor/Actions.tsx
@@ -1,5 +1,5 @@
 import React, {forwardRef, useContext} from 'react'
-import {Button, ButtonProps} from '../Button2'
+import {Button, ButtonProps} from '../../Button'
 import {MarkdownEditorContext} from './_MarkdownEditorContext'
 
 export const Actions = ({children}: {children?: React.ReactNode}) => <>{children}</>
diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index 230c58b37c4..e2f250c34b4 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -2,7 +2,7 @@ import React, {memo, forwardRef, useContext} from 'react'
 import {AlertIcon, ImageIcon, MarkdownIcon} from '@primer/octicons-react'
 
 import {Spinner, LinkButton, Box, Text} from '../..'
-import {Button, ButtonProps} from '../Button2'
+import {Button, ButtonProps} from '../../Button'
 import {MarkdownEditorContext} from './_MarkdownEditorContext'
 import {useSlots} from '../../hooks/useSlots'
 
diff --git a/src/drafts/MarkdownEditor/_MarkdownEditorContext.ts b/src/drafts/MarkdownEditor/_MarkdownEditorContext.ts
index 7758233e96c..70a71bf7f39 100644
--- a/src/drafts/MarkdownEditor/_MarkdownEditorContext.ts
+++ b/src/drafts/MarkdownEditor/_MarkdownEditorContext.ts
@@ -1,6 +1,6 @@
 import {createContext, RefObject} from 'react'
 import {FormattingTools} from './_FormattingTools'
-import {ButtonProps} from '../Button2'
+import {ButtonProps} from '../../Button'
 
 // For performance, the properties in context MUST NOT be values that change often - every time
 // any of the properties change, all components including memoized ones will be re-rendered

From a2c1f58d0944e04052964e58e0ad9da113368b36 Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Thu, 29 Jun 2023 21:41:00 +1000
Subject: [PATCH 10/13] Button major changes leadingIcon-> leadingVisual
 updates on Markdown comp

---
 src/drafts/MarkdownEditor/Footer.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/drafts/MarkdownEditor/Footer.tsx b/src/drafts/MarkdownEditor/Footer.tsx
index e2f250c34b4..a621df3b5aa 100644
--- a/src/drafts/MarkdownEditor/Footer.tsx
+++ b/src/drafts/MarkdownEditor/Footer.tsx
@@ -81,7 +81,7 @@ const FileUploadButton = memo(({fileDraggedOver, ...props}: Partial<ButtonProps>
   return (
     <Button
       variant="invisible"
-      leadingIcon={ImageIcon}
+      leadingVisual={ImageIcon}
       size="small"
       sx={{color: 'fg.default', fontWeight: fileDraggedOver ? 'bold' : 'normal', px: 2}}
       onMouseDown={(e: React.MouseEvent) => {

From c2a049630a329945e52bc1f5087cc053abd78fb9 Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Thu, 29 Jun 2023 21:45:47 +1000
Subject: [PATCH 11/13] update props on the story

---
 src/drafts/MarkdownEditor/MarkdownEditor.stories.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/drafts/MarkdownEditor/MarkdownEditor.stories.tsx b/src/drafts/MarkdownEditor/MarkdownEditor.stories.tsx
index ecfcca7871e..31794e23a16 100644
--- a/src/drafts/MarkdownEditor/MarkdownEditor.stories.tsx
+++ b/src/drafts/MarkdownEditor/MarkdownEditor.stories.tsx
@@ -342,7 +342,7 @@ export const CustomFooter = ({
           <MarkdownEditor.FooterButton
             variant="invisible"
             onClick={onFooterClick}
-            leadingIcon={PlusIcon}
+            leadingVisual={PlusIcon}
             sx={{borderRadius: '14px', color: 'fg.muted', borderColor: 'border.muted'}}
           >
             Add Button

From a0fc975944dea6110b6d67a2aa614cc168833026 Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Fri, 30 Jun 2023 09:16:36 +1000
Subject: [PATCH 12/13] try not exporting Button2

---
 src/drafts/index.ts | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/drafts/index.ts b/src/drafts/index.ts
index 0d9bdf21ca6..728b1368ba2 100644
--- a/src/drafts/index.ts
+++ b/src/drafts/index.ts
@@ -54,4 +54,4 @@ export * from '../SplitPageLayout'
 
 // CSS Experiment
 export * from './CSSComponent'
-export * from './Button2'
+// export * from './Button2'

From 48938d6b9a09a6956822292159066caff0741699 Mon Sep 17 00:00:00 2001
From: Armagan Ersoz <broccolinisoup@github.com>
Date: Fri, 30 Jun 2023 09:24:10 +1000
Subject: [PATCH 13/13] try exporting Button2 as Button2

---
 src/drafts/Button2/Button.dev.stories.tsx      | 2 +-
 src/drafts/Button2/Button.features.stories.tsx | 2 +-
 src/drafts/Button2/Button.stories.tsx          | 2 +-
 src/drafts/Button2/index.ts                    | 2 +-
 4 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/src/drafts/Button2/Button.dev.stories.tsx b/src/drafts/Button2/Button.dev.stories.tsx
index 94f06efa15c..472e4063b26 100644
--- a/src/drafts/Button2/Button.dev.stories.tsx
+++ b/src/drafts/Button2/Button.dev.stories.tsx
@@ -1,6 +1,6 @@
 import {SearchIcon, TriangleDownIcon, EyeIcon} from '@primer/octicons-react'
 import React from 'react'
-import {Button} from '.'
+import {Button2 as Button} from '.'
 
 export default {
   title: 'Drafts/Components/Button/DevOnly',
diff --git a/src/drafts/Button2/Button.features.stories.tsx b/src/drafts/Button2/Button.features.stories.tsx
index 79014edda13..ab0fce76123 100644
--- a/src/drafts/Button2/Button.features.stories.tsx
+++ b/src/drafts/Button2/Button.features.stories.tsx
@@ -1,6 +1,6 @@
 import {EyeIcon, TriangleDownIcon, HeartIcon} from '@primer/octicons-react'
 import React, {useState} from 'react'
-import {Button} from '.'
+import {Button2 as Button} from '.'
 
 export default {
   title: 'Drafts/Components/Button/Features',
diff --git a/src/drafts/Button2/Button.stories.tsx b/src/drafts/Button2/Button.stories.tsx
index deed09867fb..32a841e66c4 100644
--- a/src/drafts/Button2/Button.stories.tsx
+++ b/src/drafts/Button2/Button.stories.tsx
@@ -1,7 +1,7 @@
 import React from 'react'
 import {EyeClosedIcon, EyeIcon, SearchIcon, TriangleDownIcon, XIcon, HeartIcon} from '@primer/octicons-react'
 import {Meta, StoryFn} from '@storybook/react'
-import {Button} from '.'
+import {Button2 as Button} from '.'
 import {OcticonArgType} from '../../utils/story-helpers'
 
 export default {
diff --git a/src/drafts/Button2/index.ts b/src/drafts/Button2/index.ts
index 254d7bf77d2..5bebc2d158b 100644
--- a/src/drafts/Button2/index.ts
+++ b/src/drafts/Button2/index.ts
@@ -2,6 +2,6 @@ import {ButtonComponent} from './Button'
 import {Counter} from './ButtonCounter'
 export type {ButtonProps, IconButtonProps} from './types'
 
-export const Button = Object.assign(ButtonComponent, {
+export const Button2 = Object.assign(ButtonComponent, {
   Counter,
 })