From ef34b2cd7ac245edc8aa51e04ab4b7d0f2da49d0 Mon Sep 17 00:00:00 2001 From: Victor Genaev Date: Thu, 23 Nov 2023 16:30:17 +0100 Subject: [PATCH] chore(tokens): update transparent color function --- packages/orbit-design-tokens/src/js/transparentColor.ts | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/packages/orbit-design-tokens/src/js/transparentColor.ts b/packages/orbit-design-tokens/src/js/transparentColor.ts index a98e67ae65..7779f9ee28 100644 --- a/packages/orbit-design-tokens/src/js/transparentColor.ts +++ b/packages/orbit-design-tokens/src/js/transparentColor.ts @@ -1,11 +1,16 @@ import { parseToRgba, rgba, guard } from "color2k"; +const isHex = (color: string): boolean => color.startsWith("#"); +const isRgb = (color: string): boolean => color.startsWith("rgb"); + const transparentColor = (color: string, opacity: number): string => { // tailwind package is using css variables if (color.match(/var\(/)) { const regex = /var\(([^,]+),\s*([^)]+)\)/; const [, , colorValue] = color.match(regex); - return transparentColor(colorValue, opacity); + const value = colorValue as string; + const isValidColor = isHex(value) || isRgb(value); + return transparentColor(isValidColor ? value : `rgb(${value})`, opacity); } const [R, G, B] = parseToRgba(color);