From 8a340e2ea7fc46f63091780a8b96690f5f8875d8 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Tue, 20 Sep 2022 13:54:37 -0400
Subject: [PATCH 1/2] fixes sx prop on the SegmentedControl buttons

---
 src/SegmentedControl/SegmentedControl.tsx | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/SegmentedControl/SegmentedControl.tsx b/src/SegmentedControl/SegmentedControl.tsx
index ad11d2ea9b0..f0c47c70e13 100644
--- a/src/SegmentedControl/SegmentedControl.tsx
+++ b/src/SegmentedControl/SegmentedControl.tsx
@@ -162,8 +162,9 @@ const Root: React.FC<React.PropsWithChildren<SegmentedControlProps>> = ({
           selected: index === selectedIndex,
           sx: {
             '--separator-color':
-              index === selectedIndex || index === selectedIndex - 1 ? 'transparent' : theme?.colors.border.default
-          } as React.CSSProperties
+              index === selectedIndex || index === selectedIndex - 1 ? 'transparent' : theme?.colors.border.default,
+            ...child.props.sx
+          }
         }
 
         // Render the 'hideLabels' variant of the SegmentedControlButton

From 129f006299c2cd4613bb2a5b5827d0f82201b6f9 Mon Sep 17 00:00:00 2001
From: Mike Perrotti <mperrotti@github.com>
Date: Tue, 20 Sep 2022 13:59:34 -0400
Subject: [PATCH 2/2] adds changeset

---
 .changeset/clever-hotels-kneel.md | 5 +++++
 1 file changed, 5 insertions(+)
 create mode 100644 .changeset/clever-hotels-kneel.md

diff --git a/.changeset/clever-hotels-kneel.md b/.changeset/clever-hotels-kneel.md
new file mode 100644
index 00000000000..0180e6dc7ec
--- /dev/null
+++ b/.changeset/clever-hotels-kneel.md
@@ -0,0 +1,5 @@
+---
+'@primer/react': patch
+---
+
+Fixes the sx prop on the SegmentedControl buttons by properly merging the sx prop when cloning button children.