Added key value renderer and implementations for everything except value formatter

Author: Jiří Třečák

.gitignore

@@ -0,0 +1 @@
+.build/*

src/borders.pr

@@ -4,4 +4,11 @@ Generate all border tokens as named variables.
 Tokens are named by their group path and then name, 
 and their value rendered using `rendered-border` blueprint
 
-*}
+*}
+:root {
+{[ for token in @ds.tokensByType("Border") ]}
+    {[ inject "rendered-token-var" context token /]}
+    
+
+{[/]}
+}

src/gradients.pr

@@ -4,4 +4,11 @@ Generate all gradient tokens as named variables.
 Tokens are named by their group path and then name, 
 and their value rendered using `gradient-color` blueprint
 
-*}
+*}
+:root {
+{[ for token in @ds.tokensByType("Gradient") ]}
+    {[ inject "rendered-token-var" context token /]}
+    
+
+{[/]}
+}

src/object-renderers/rendered-name.pr renamed to src/main-renderers/rendered-name.pr

@@ -43,4 +43,5 @@ Rendered as:
         {[ prefix = "" /]}  
 {[/]}
 {[ let tokenName = @js.readableVariableName(context, tokenGroup, prefix) /]}
-{{ tokenName }}
+{{ tokenName }}
+{[ let test = @init /]}

src/object-renderers/rendered-token-var.pr renamed to src/main-renderers/rendered-token-var.pr

@@ -23,4 +23,4 @@ Rendered as:
 
 *}
 {[ let token = context /]}
-{[ inject "rendered-name" context token /]}: "value";
+--{[ inject "rendered-name" context token /]}: {[ inject "rendered-value" context token /]};

src/main-renderers/rendered-value.pr

@@ -0,0 +1,41 @@
+{*
+
+Injectable blueprint that represents token value as css.valid string
+Note that this only converts the value, name is converted somewhere else
+
+
+Source data: Any Token (https://developers.supernova.io/design-system-data/tokens)
+Note: Value is passed as `context` property because it is injected
+
+{
+  "context": {
+    "id": string
+    "name": string
+    "description": string
+    "tokenType": Depends on the token type
+    "origin": ItemOrigin | null
+    "value": Depends on the token type
+  }
+}
+
+
+Rendered as:
+
+[group1][group2][...][name];
+
+*}
+{[ let token = context /]}
+{[ switch context.tokenType ]}
+    {[ case "Color" ]}
+{[ inject "rendered-color" context token /]}
+    {[ case "Typography" ]}
+{[ inject "rendered-typography" context token /]}
+    {[ case "Shadow" ]}
+{[ inject "rendered-shadow" context token /]}
+    {[ case "Border" ]}
+{[ inject "rendered-border" context token /]}
+    {[ case "Measure" ]}
+{[ inject "rendered-measure" context token /]} 
+    {[ case "Gradient" ]}
+{[ inject "rendered-gradient" context token /]} 
+{[/]}

src/measures.pr

@@ -4,4 +4,11 @@ Generate all measure tokens as named variables.
 Tokens are named by their group path and then name, 
 and their value rendered using `rendered-measure` blueprint
 
-*}
+*}
+:root {
+{[ for token in @ds.tokensByType("Measure") ]}
+    {[ inject "rendered-token-var" context token /]}
+    
+
+{[/]}
+}

src/shadows.pr

@@ -4,4 +4,11 @@ Generate all shadow tokens as named variables.
 Tokens are named by their group path and then name, 
 and their value rendered using `shadow-color` blueprint
 
-*}
+*}
+:root {
+{[ for token in @ds.tokensByType("Shadow") ]}
+    {[ inject "rendered-token-var" context token /]}
+    
+
+{[/]}
+}

src/object-renderers/rendered-border.pr renamed to src/token-renderers/rendered-border.pr

@@ -33,3 +33,4 @@ Rendered as:
 Xpx solid (rendered-color.pr);
 
 *}
+Border

src/object-renderers/rendered-color.pr renamed to src/token-renderers/rendered-color.pr

@@ -26,3 +26,4 @@ Rendered as:
 rgba(r, g, b, a) if it is semi-transparent color
 
 *}
+Color

src/object-renderers/rendered-gradient.pr renamed to src/token-renderers/rendered-gradient.pr

@@ -30,3 +30,4 @@ Rendered as:
 Xpx solid (rendered-color.pr);
 
 *}
+Gradient

src/object-renderers/rendered-measure.pr renamed to src/token-renderers/rendered-measure.pr

@@ -16,3 +16,4 @@ Note: Value is passed as `context` property because it is injected
 }
 
 *}
+Measure

src/object-renderers/rendered-shadow.pr renamed to src/token-renderers/rendered-shadow.pr

@@ -48,3 +48,4 @@ Rendered as:
 Xpx Xpx Xpx [Rendered Color];
 
 *}
+Shadow

src/object-renderers/rendered-typography.pr renamed to src/token-renderers/rendered-typography.pr

@@ -20,3 +20,4 @@ Rendered as:
 [text]
 
 *}
+Typography