From d4ae582b7d2420fd460bb14c2fa45f36be714311 Mon Sep 17 00:00:00 2001
From: Gregor Martynus <39992+gr2m@users.noreply.github.com>
Date: Tue, 15 Aug 2023 12:09:00 -0700
Subject: [PATCH] fix(sx): support Primer colors for `border*Color` properties
 (#3619)

* fix(sx): support Primer colors for `border*Color` properties

* build: add changeset
---
 .changeset/angry-boats-wash.md | 7 +++++++
 src/sx.ts                      | 4 +++-
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/angry-boats-wash.md

diff --git a/.changeset/angry-boats-wash.md b/.changeset/angry-boats-wash.md
new file mode 100644
index 00000000000..7b7e1d30c6f
--- /dev/null
+++ b/.changeset/angry-boats-wash.md
@@ -0,0 +1,7 @@
+---
+'@primer/react': patch
+---
+
+Include `border*Color` properties in sx to support named Primer colors
+
+<!-- Changed components: _none_ -->
diff --git a/src/sx.ts b/src/sx.ts
index c00a71ed356..0a2f378b0c6 100644
--- a/src/sx.ts
+++ b/src/sx.ts
@@ -1,10 +1,12 @@
 import css, {SystemCssProperties, SystemStyleObject} from '@styled-system/css'
 import {ThemeColorPaths, ThemeShadowPaths} from './theme'
-import {ColorProps, ShadowProps} from 'styled-system'
+import {ColorProps, BorderColorProps, ShadowProps} from 'styled-system'
 import merge from 'deepmerge'
 
 export type BetterCssProperties = {
   [K in keyof SystemCssProperties]: K extends keyof ColorProps
+    ? ThemeColorPaths | SystemCssProperties[K]
+    : K extends keyof BorderColorProps
     ? ThemeColorPaths | SystemCssProperties[K]
     : K extends keyof ShadowProps
     ? ThemeShadowPaths | SystemCssProperties[K]