🔥(tokens) remove colors sub maps

Create color sub maps seems to be a good idea but in fact was not. In
fact if with need to create token sub map this structure should appear
within the tokens module.

.changeset/many-taxis-promise.md

@@ -0,0 +1,5 @@
+---
+"@openfun/cunningham-tokens": minor
+---
+
+Do not generate sass sub maps

packages/tokens/src/bin/Generators/JsGenerator.spec.ts

@@ -24,7 +24,7 @@ describe("JsGenerator", () => {
     await run(["", "", "-g", "js"]);
     expect(fs.existsSync(tokensFile)).toEqual(true);
     expect(fs.readFileSync(tokensFile).toString()).toMatchInlineSnapshot(`
-      "export const tokens = {"theme":{"colors":{"primary":"#055FD2","secondary":"#DA0000","ternary-900":"#022858"},"font":{"sizes":{"m":"1rem"},"weights":{"medium":400},"families":{"base":"Roboto"}},"spacings":{"s":"1rem"},"transitions":{"ease":"linear"}}};
+      "export const tokens = {"theme":{"colors":{"primary":"#055FD2","secondary":"#DA0000","ternary-900":"#022858","ogre-odor-is-orange-indeed":"#FD5240"},"font":{"sizes":{"m":"1rem"},"weights":{"medium":400},"families":{"base":"Roboto"}},"spacings":{"s":"1rem"},"transitions":{"ease":"linear"}}};
       "
     `);
   });

packages/tokens/src/bin/Generators/SassGenerator.spec.ts

@@ -28,9 +28,8 @@ describe("SassGenerator", () => {
       "$colors: (
         'primary': #055FD2,
         'secondary': #DA0000,
-        'ternary': (
+        'ternary-900': #022858,
-          '900': #022858
+        'ogre-odor-is-orange-indeed': #FD5240
-        )
       );
       $fontFamilies: (
         'base': Roboto

packages/tokens/src/bin/Generators/SassGenerator.ts

@@ -23,12 +23,7 @@ const generateSassMaps = (tokens: Tokens) => {
 // for a color with shades.
 // Example: `primary-500: #000` will return `primary: (500: #000)`
 const generateColorsSassMap = (tokens: Tokens) => {
-  const colors = Object.entries(tokens.theme.colors).reduce(
+  return `$colors: ${JSONToSassMap(tokens.theme.colors)};`;
-    propertiesReducer,
-    {}
-  );
-
-  return `$colors: ${JSONToSassMap(colors)};`;
 };
 const generateFontSassMap = (tokens: Tokens) => {
   return [
@@ -72,21 +67,3 @@ function JSONToSassMap(json: Object) {
     .replace(/}/g, ")")
     .replace(/"/g, "");
 }
-
-function propertiesReducer(
-  propertyMap: Record<string, string | Record<string, string>>,
-  [key, value]: [string, string]
-) {
-  const [property, subProperty] = key.split("-");
-
-  if (subProperty) {
-    if (propertyMap[property] === undefined) {
-      propertyMap[property] = {};
-    }
-    (propertyMap[property] as Record<string, string>)[subProperty] = value;
-  } else {
-    propertyMap[property] = value;
-  }
-
-  return propertyMap;
-}

packages/tokens/src/bin/Generators/TsGenerator.spec.ts

@@ -24,7 +24,7 @@ describe("TsGenerator", () => {
     await run(["", "", "-g", "ts"]);
     expect(fs.existsSync(tokensFile)).toEqual(true);
     expect(fs.readFileSync(tokensFile).toString()).toMatchInlineSnapshot(`
-      "export const tokens = {"theme":{"colors":{"primary":"#055FD2","secondary":"#DA0000","ternary-900":"#022858"},"font":{"sizes":{"m":"1rem"},"weights":{"medium":400},"families":{"base":"Roboto"}},"spacings":{"s":"1rem"},"transitions":{"ease":"linear"}}};
+      "export const tokens = {"theme":{"colors":{"primary":"#055FD2","secondary":"#DA0000","ternary-900":"#022858","ogre-odor-is-orange-indeed":"#FD5240"},"font":{"sizes":{"m":"1rem"},"weights":{"medium":400},"families":{"base":"Roboto"}},"spacings":{"s":"1rem"},"transitions":{"ease":"linear"}}};
       "
     `);
   });

packages/tokens/src/bin/__mocks__/cunningham.ts

@@ -4,6 +4,7 @@ module.exports = {
       primary: "#055FD2",
       secondary: "#DA0000",
       "ternary-900": "#022858",
+      "ogre-odor-is-orange-indeed": "#FD5240",
     },
     font: {
       sizes: {

packages/tokens/src/bin/tests/assets/expected-default-cunningham-tokens.css

@@ -2,6 +2,7 @@
 	--c--theme--colors--primary: #055FD2;
 	--c--theme--colors--secondary: #DA0000;
 	--c--theme--colors--ternary-900: #022858;
+	--c--theme--colors--ogre-odor-is-orange-indeed: #FD5240;
 	--c--theme--font--sizes--m: 1rem;
 	--c--theme--font--weights--medium: 400;
 	--c--theme--font--families--base: Roboto;

packages/tokens/src/bin/tests/assets/expected-js-cunningham-tokens.css

@@ -2,6 +2,7 @@
 	--c--theme--colors--primary: AntiqueWhite;
 	--c--theme--colors--secondary: #DA0000;
 	--c--theme--colors--ternary-900: #022858;
+	--c--theme--colors--ogre-odor-is-orange-indeed: #FD5240;
 	--c--theme--font--sizes--m: 1rem;
 	--c--theme--font--weights--medium: 400;
 	--c--theme--font--families--base: Roboto;

packages/tokens/src/bin/tests/assets/expected-with-utility-classes-cunningham-tokens.css

@@ -2,6 +2,7 @@
 	--c--theme--colors--primary: #055FD2;
 	--c--theme--colors--secondary: #DA0000;
 	--c--theme--colors--ternary-900: #022858;
+	--c--theme--colors--ogre-odor-is-orange-indeed: #FD5240;
 	--c--theme--font--sizes--m: 1rem;
 	--c--theme--font--weights--medium: 400;
 	--c--theme--font--families--base: Roboto;
@@ -10,9 +11,11 @@
 } .clr-primary { color: var(--c--theme--colors--primary); }
 .clr-secondary { color: var(--c--theme--colors--secondary); }
 .clr-ternary-900 { color: var(--c--theme--colors--ternary-900); }
+.clr-ogre-odor-is-orange-indeed { color: var(--c--theme--colors--ogre-odor-is-orange-indeed); }
 .bg-primary { background-color: var(--c--theme--colors--primary); }
 .bg-secondary { background-color: var(--c--theme--colors--secondary); }
 .bg-ternary-900 { background-color: var(--c--theme--colors--ternary-900); }
+.bg-ogre-odor-is-orange-indeed { background-color: var(--c--theme--colors--ogre-odor-is-orange-indeed); }
 .fw-medium { font-weight: var(--c--theme--font--weights--medium); }
 .fs-m { font-size: var(--c--theme--font--sizes--m); }
 .f-base { font-family: var(--c--theme--font--families--base); }