From 0b698104bab0cd7dc496bfae5d20a123a0a6852a Mon Sep 17 00:00:00 2001
From: Zn4rK <alexander@paxxmedia.se>
Date: Thu, 23 Nov 2023 17:13:44 +0100
Subject: [PATCH] ease css var normalization

---
 .changeset/serious-plants-double.md                 |  5 +++++
 .../engine/src/helpers/normalizeCSSVarsValue.ts     |  6 +-----
 .../tests/src/helpers/normalizeCSSVarsValue.test.ts |  5 +++++
 packages/engine/tests/src/index.test.ts             | 13 +++++++++++++
 4 files changed, 24 insertions(+), 5 deletions(-)
 create mode 100644 .changeset/serious-plants-double.md

diff --git a/.changeset/serious-plants-double.md b/.changeset/serious-plants-double.md
new file mode 100644
index 0000000..241a57c
--- /dev/null
+++ b/.changeset/serious-plants-double.md
@@ -0,0 +1,5 @@
+---
+'@navita/engine': minor
+---
+
+ease check for running normalize css vars
diff --git a/packages/engine/src/helpers/normalizeCSSVarsValue.ts b/packages/engine/src/helpers/normalizeCSSVarsValue.ts
index d62b520..4e51fc3 100644
--- a/packages/engine/src/helpers/normalizeCSSVarsValue.ts
+++ b/packages/engine/src/helpers/normalizeCSSVarsValue.ts
@@ -1,11 +1,7 @@
 const cssVarRegex = /(?<!var\()(\s*)(--[a-zA-Z0-9_-]+)/g;
 
 export function normalizeCSSVarsValue(value: string) {
-  if (
-    value.startsWith('--') ||
-    value.includes(' --') ||
-    value.includes(',--')
-  ) {
+  if (value.includes('--')) {
     return value.replace(cssVarRegex, "$1var($2)");
   }
 
diff --git a/packages/engine/tests/src/helpers/normalizeCSSVarsValue.test.ts b/packages/engine/tests/src/helpers/normalizeCSSVarsValue.test.ts
index e251ffd..074dd8e 100644
--- a/packages/engine/tests/src/helpers/normalizeCSSVarsValue.test.ts
+++ b/packages/engine/tests/src/helpers/normalizeCSSVarsValue.test.ts
@@ -20,4 +20,9 @@ describe('normalizeCSSVarsValue', () => {
     expect(normalizeCSSVarsValue('var(--my-var, --this-is-wrong)')).toBe('var(--my-var, var(--this-is-wrong))');
     expect(normalizeCSSVarsValue('var(--my-var,--this-is-wrong)')).toBe('var(--my-var,var(--this-is-wrong))');
   });
+
+  it('should cover https://github.com/eagerpatch/navita/issues/21#issue-1992454530', () => {
+    expect(normalizeCSSVarsValue('rgba(--color, 0.15)')).toBe('rgba(var(--color), 0.15)');
+    expect(normalizeCSSVarsValue('rgba(--color,0.15)')).toBe('rgba(var(--color),0.15)');
+  });
 });
diff --git a/packages/engine/tests/src/index.test.ts b/packages/engine/tests/src/index.test.ts
index 755695c..a2e2b69 100644
--- a/packages/engine/tests/src/index.test.ts
+++ b/packages/engine/tests/src/index.test.ts
@@ -355,4 +355,17 @@ describe('Engine', () => {
       expect(engine.generateIdentifier('background')).toEqual('_b');
     });
   });
+
+  describe('issue #21', () => {
+    it('should generate correct css', () => {
+      const engine = new Engine();
+      engine.setFilePath('file1.ts');
+      engine.addStyle({
+        color: 'rgba(--color, 0.15)',
+      });
+      expect(engine.renderCssToString()).toEqual(
+        `.a1{color:rgba(var(--color), 0.15)}`,
+      );
+    });
+  });
 });