[color engine] Support transparent color string

arnelenero · Mar 27, 2022 · d82b204 · d82b204
1 parent 2d4b3fe
commit d82b204
Show file tree

Hide file tree

Showing 2 changed files with 9 additions and 3 deletions.
diff --git a/src/color/__tests__/rgb.spec.ts b/src/color/__tests__/rgb.spec.ts
@@ -19,9 +19,10 @@ describe('rgb', () => {
     expect(rgb('#FAC3')).toEqual({ r: 255, g: 170, b: 204, a: 0.2 })
   })
 
-  it('returns RGB values from CSS color names', () => {
+  it('returns RGB values from CSS color names/keywords', () => {
     expect(rgb('blue')).toEqual({ r: 0, g: 0, b: 255, a: 1 })
     expect(rgb('yellow')).toEqual({ r: 255, g: 255, b: 0, a: 1 })
+    expect(rgb('transparent')).toEqual({ r: 0, g: 0, b: 0, a: 0 })
   })
 
   it('returns null if not a valid color string', () => {

diff --git a/src/color/rgb.ts b/src/color/rgb.ts
@@ -1,11 +1,11 @@
 import named from './named'
-import { isHexString, matchHexString } from './parsers/hexString'
+import { matchHexString } from './parsers/hexString'
 
 export interface RGB {
   r: number
   g: number
   b: number
-  a?: number
+  a: number
 }
 
 export function rgbFromHexString(colorString: string): RGB | null {
@@ -26,6 +26,11 @@ export function rgbFromHexString(colorString: string): RGB | null {
 }
 
 export default function rgb(colorString: string): RGB | null {
+  colorString = colorString.trim()
+
+  if (colorString.toLowerCase() === 'transparent')
+    return { r: 0, g: 0, b: 0, a: 0 }
+
   // Get hex value if string is a color name
   const hexFromName = named(colorString)
   if (hexFromName) colorString = hexFromName