fix scope for focus outline (#1027)

primer · Aug 16, 2024 · 8301cb9 · 8301cb9
1 parent 401fef1
commit 8301cb9
Show file tree

Hide file tree

Showing 5 changed files with 19 additions and 23 deletions.
diff --git 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
@@ -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
@@ -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
@@ -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
@@ -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'],