From 5a9fa59f159bc6f7aed7d9c72c5c358594b3ef9d Mon Sep 17 00:00:00 2001
From: Alexander Schwarzmann <hello@sashathor.com>
Date: Thu, 23 May 2024 11:21:10 +0200
Subject: [PATCH] chore(ui-kit): fixes for design token parser filter

---
 packages/ui-kit/scripts/design-tokens/parse.mts      | 10 ++++++----
 .../src/components/PieChart/PieChart.module.scss     | 12 ++++++++++++
 2 files changed, 18 insertions(+), 4 deletions(-)

diff --git a/packages/ui-kit/scripts/design-tokens/parse.mts b/packages/ui-kit/scripts/design-tokens/parse.mts
index 5000ddb8..95396878 100644
--- a/packages/ui-kit/scripts/design-tokens/parse.mts
+++ b/packages/ui-kit/scripts/design-tokens/parse.mts
@@ -232,6 +232,10 @@ const main = async (isProdEnv = false) => {
 
     const themes = variablesJSON.collections.find(({ name }) => name === '1. Color Modes')?.modes
 
+    // Parse theme tokens
+    let lightTheme = getThemeTokens({ name: 'light', themes, variables, tokens })
+    let darkTheme = getThemeTokens({ name: 'dark', themes, variables, tokens })
+
     if (isProdEnv) {
       await buildSASSFiles(spinner)
 
@@ -243,14 +247,12 @@ const main = async (isProdEnv = false) => {
 
       variables = variables.filter((variable) => currentVariablesList.includes(variable.cssName))
       tokens = tokens.filter((token) => currentVariablesList.includes(token.cssName))
+      lightTheme = lightTheme?.filter((token) => currentVariablesList.includes(token.cssName))
+      darkTheme = darkTheme?.filter((token) => currentVariablesList.includes(token.cssName))
 
       succeedMessage = `Filter out all design variables (${variables.length} from ${statsBefore.variables}) and tokens (${tokens.length} from ${statsBefore.tokens}) not in use`
     }
 
-    // Parse theme tokens
-    const lightTheme = getThemeTokens({ name: 'light', themes, variables, tokens })
-    const darkTheme = getThemeTokens({ name: 'dark', themes, variables, tokens })
-
     // Generate _variables.scss
     writeToFileSync(
       '_variables.scss',
diff --git a/packages/ui-kit/src/components/PieChart/PieChart.module.scss b/packages/ui-kit/src/components/PieChart/PieChart.module.scss
index ad76be16..c0ca5954 100644
--- a/packages/ui-kit/src/components/PieChart/PieChart.module.scss
+++ b/packages/ui-kit/src/components/PieChart/PieChart.module.scss
@@ -7,6 +7,18 @@
   overflow: auto;
   padding: 0;
 
+  --pie-bg-25: var(--propel-brand-25);
+  --pie-bg-50: var(--propel-brand-50);
+  --pie-bg-100: var(--propel-brand-100);
+  --pie-bg-200: var(--propel-brand-200);
+  --pie-bg-300: var(--propel-brand-300);
+  --pie-bg-400: var(--propel-brand-400);
+  --pie-bg-500: var(--propel-brand-500);
+  --pie-bg-600: var(--propel-brand-600);
+  --pie-bg-700: var(--propel-brand-700);
+  --pie-bg-900: var(--propel-brand-900);
+  --pie-bg-empty: var(--propel-background-brand-primary);
+
   canvas {
     height: var(--propel-component-height);
   }