From 8301cb91ea46bff8efa86e60231706592ecf8e5c Mon Sep 17 00:00:00 2001
From: Lukas Oppermann <lukasoppermann@github.com>
Date: Fri, 16 Aug 2024 09:47:46 +0200
Subject: [PATCH] fix scope for focus outline (#1027)

---
 src/schemas/colorToken.ts                     |  2 +-
 src/schemas/dimensionToken.ts                 |  1 +
 src/schemas/scopes.ts                         | 31 ++++++-------------
 .../color/light/patterns-light.json5          |  2 +-
 src/transformers/figmaAttributes.ts           |  6 ++++
 5 files changed, 19 insertions(+), 23 deletions(-)

diff --git a/src/schemas/colorToken.ts b/src/schemas/colorToken.ts
index 5371d3046..803585b41 100644
--- a/src/schemas/colorToken.ts
+++ b/src/schemas/colorToken.ts
@@ -42,7 +42,7 @@ export const colorToken = baseToken
             'light tritanopia',
             'dark tritanopia',
           ]).optional(),
-          scopes: scopes(['all', 'bgColor', 'fgColor', 'borderColor']).optional(),
+          scopes: scopes(['all', 'bgColor', 'fgColor', 'borderColor', 'effectColor']).optional(),
         }),
       })
       .optional(),
diff --git a/src/schemas/dimensionToken.ts b/src/schemas/dimensionToken.ts
index be9ecc0f7..e7554f451 100644
--- a/src/schemas/dimensionToken.ts
+++ b/src/schemas/dimensionToken.ts
@@ -20,6 +20,7 @@ export const dimensionToken = baseToken
             'gap',
             'radius',
             'borderColor',
+            'effectFloat',
             'fontSize',
             'letterSpacing',
             'lineHeight',
diff --git a/src/schemas/scopes.ts b/src/schemas/scopes.ts
index accc9ca20..3575464e8 100644
--- a/src/schemas/scopes.ts
+++ b/src/schemas/scopes.ts
@@ -2,33 +2,17 @@ import {z} from 'zod'
 import {joinFriendly} from '../utilities/joinFriendly'
 import {schemaErrorMessage} from '../utilities/schemaErrorMessage'
 
-export type ValidScope =
-  | 'all'
-  | 'bgColor'
-  | 'fgColor'
-  | 'borderColor'
-  | 'size'
-  | 'gap'
-  | 'radius'
-  | 'effectColor'
-  | 'opacity'
-  | 'fontFamily'
-  | 'fontStyle'
-  | 'fontWeight'
-  | 'fontSize'
-  | 'lineHeight'
-  | 'letterSpacing'
-  | 'paragraphSpacing'
-  | 'paragraphIndent'
-const validScopes: ValidScope[] = [
+const validScopes = [
   'all',
   'bgColor',
   'fgColor',
   'borderColor',
+  'borderWidth',
   'size',
   'gap',
   'radius',
   'effectColor',
+  'effectFloat',
   'opacity',
   'fontFamily',
   'fontStyle',
@@ -38,14 +22,19 @@ const validScopes: ValidScope[] = [
   'letterSpacing',
   'paragraphSpacing',
   'paragraphIndent',
-]
+] as const
+
+export type ValidScope = (typeof validScopes)[number]
 
 export const scopes = (scopeSubset?: ValidScope[]) => {
   const scopeArray = scopeSubset ?? validScopes
   return z.array(z.string()).refine(
     value => value.every(item => scopeArray.includes(item as ValidScope)),
     value => ({
-      message: schemaErrorMessage(`Invalid scope: "${value}"`, `Valid scopes are: ${joinFriendly(scopeArray)}`),
+      message: schemaErrorMessage(
+        `Invalid scope: "${value}"`,
+        `Valid scopes are: ${joinFriendly(scopeArray as string[])}`,
+      ),
     }),
   )
 }
diff --git a/src/tokens/functional/color/light/patterns-light.json5 b/src/tokens/functional/color/light/patterns-light.json5
index a990660e6..6ab03e423 100644
--- a/src/tokens/functional/color/light/patterns-light.json5
+++ b/src/tokens/functional/color/light/patterns-light.json5
@@ -1852,7 +1852,7 @@
           collection: 'mode',
           mode: 'light',
           group: 'component (internal)',
-          scopes: ['borderColor'],
+          scopes: ['borderColor', 'effectColor'],
         },
       },
     },
diff --git a/src/transformers/figmaAttributes.ts b/src/transformers/figmaAttributes.ts
index 7a36e6d6f..753db9ef4 100644
--- a/src/transformers/figmaAttributes.ts
+++ b/src/transformers/figmaAttributes.ts
@@ -11,6 +11,9 @@ type FigmaVariableScope =
   | 'SHAPE_FILL'
   | 'TEXT_FILL'
   | 'STROKE_COLOR'
+  | 'STROKE_FLOAT'
+  | 'EFFECT_COLOR'
+  | 'EFFECT_FLOAT'
   | 'OPACITY'
   | 'FONT_FAMILY'
   | 'FONT_STYLE'
@@ -28,7 +31,10 @@ const figmaScopes: Record<string, FigmaVariableScope[]> = {
   gap: ['GAP'],
   bgColor: ['FRAME_FILL', 'SHAPE_FILL'],
   fgColor: ['TEXT_FILL', 'SHAPE_FILL'],
+  effectColor: ['EFFECT_COLOR'],
+  effectFloat: ['EFFECT_FLOAT'],
   borderColor: ['STROKE_COLOR'],
+  borderWidth: ['STROKE_FLOAT'],
   opacity: ['OPACITY'],
   fontFamily: ['FONT_FAMILY'],
   fontStyle: ['FONT_STYLE'],