fix(fluent): use json transformer for dart sass

telerik · Jan 10, 2023 · 9457acd · 9457acd
1 parent b657a62
commit 9457acd
Show file tree

Hide file tree

Showing 37 changed files with 98 additions and 19 deletions.
diff --git a/gulpfile.js b/gulpfile.js
@@ -63,21 +63,41 @@ function writeSwatches( cwds, options ) {
     });
 }
 
-function swatchJsonTransformer(json) {
-    const sassContent = [];
-    let { groups } = json;
+function swatchJsonTransformer( json ) {
+    const variables = [];
 
-    groups.forEach( (group) => {
+    json.groups.forEach( (group) => {
         for ( const [ name, meta ] of Object.entries(group.variables) ) {
-            sassContent.push(`$${name}: ${meta.value};`);
+            variables.push({ name: name, value: meta.value });
         }
     });
 
-    sassContent.push('');
+    const templates = {
+        modern: () => {
+            const sassContent = [];
 
-    sassContent.push(`@import "all.scss";`);
+            sassContent.push(`@use "../scss/index.scss" as kendo-theme;`);
+            sassContent.push(variables.map( (variable) => `kendo-theme.$${variable.name}: ${variable.value};`).join( '\n' ));
+            sassContent.push(`@include kendo-theme.config();`);
+            sassContent.push(`@include kendo-theme.styles();`);
 
-    return sassContent.join( '\n' );
+            return sassContent.join( '\n' );
+        },
+        legacy: () => {
+            const sassContent = [];
+
+            sassContent.push(variables.map( (variable) => `$${variable.name}: ${variable.value};`).join( '\n' ));
+            sassContent.push(`@import "all.scss";`);
+
+            return sassContent.join( '\n' );
+        }
+    };
+
+    if ( json.api === 'modern' ) {
+        return templates.modern();
+    }
+
+    return templates.legacy();
 }
 // #endregion
 

diff --git a/packages/classic/lib/swatches/classic-green-dark.json b/packages/classic/lib/swatches/classic-green-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#000000",
         "#131413",

diff --git a/packages/classic/lib/swatches/classic-green.json b/packages/classic/lib/swatches/classic-green.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f3f4f3",

diff --git a/packages/classic/lib/swatches/classic-main-dark.json b/packages/classic/lib/swatches/classic-main-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#000000",
         "#101010",

diff --git a/packages/classic/lib/swatches/classic-main.json b/packages/classic/lib/swatches/classic-main.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f0f0f0",

diff --git a/packages/classic/lib/swatches/classic-opal-dark.json b/packages/classic/lib/swatches/classic-opal-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#000000",
         "#1e242d",

diff --git a/packages/classic/lib/swatches/classic-opal.json b/packages/classic/lib/swatches/classic-opal.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#def4fd",

diff --git a/packages/classic/lib/swatches/classic-silver-dark.json b/packages/classic/lib/swatches/classic-silver-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#000000",
         "#131314",

diff --git a/packages/classic/lib/swatches/classic-silver.json b/packages/classic/lib/swatches/classic-silver.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-classic",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f3f3f4",

diff --git a/packages/default/lib/swatches/default-dataviz-v4.json b/packages/default/lib/swatches/default-dataviz-v4.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ff6358",
         "#ffd246",

diff --git a/packages/default/lib/swatches/default-green.json b/packages/default/lib/swatches/default-green.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-main-dark.json b/packages/default/lib/swatches/default-main-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#000000",
         "#151515",

diff --git a/packages/default/lib/swatches/default-main.json b/packages/default/lib/swatches/default-main.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-nordic.json b/packages/default/lib/swatches/default-nordic.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#50686e",

diff --git a/packages/default/lib/swatches/default-ocean-blue.json b/packages/default/lib/swatches/default-ocean-blue.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-orange.json b/packages/default/lib/swatches/default-orange.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-purple.json b/packages/default/lib/swatches/default-purple.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-turquoise.json b/packages/default/lib/swatches/default-turquoise.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#f5f5f5",

diff --git a/packages/default/lib/swatches/default-urban.json b/packages/default/lib/swatches/default-urban.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-default",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e3eef4",

diff --git a/packages/fluent/lib/swatches/all.json b/packages/fluent/lib/swatches/all.json
@@ -0,0 +1,17 @@
+{
+    "$schema": "https://unpkg.com/@progress/kendo-theme-tasks@1.14.0/lib/schemas/kendo-swatch.json",
+    "name": "All",
+    "product": "kendo",
+    "base": "@progress/kendo-theme-fluent",
+    "version": "5.1.2-dev.7",
+    "api": "modern",
+    "previewColors": [
+        "#ffffff",
+        "#f5f5f5",
+        "#ff6358",
+        "#d6534a",
+        "#424242"
+    ],
+    "components": [],
+    "groups": []
+}
diff --git a/packages/fluent/lib/swatches/fluent-main.json b/packages/fluent/lib/swatches/fluent-main.json
@@ -0,0 +1,17 @@
+{
+    "$schema": "https://unpkg.com/@progress/kendo-theme-tasks@1.14.0/lib/schemas/kendo-swatch.json",
+    "name": "Fluent Main",
+    "product": "kendo",
+    "base": "@progress/kendo-theme-fluent",
+    "version": "5.1.2-dev.7",
+    "api": "modern",
+    "previewColors": [
+        "#ffffff",
+        "#f5f5f5",
+        "#ff6358",
+        "#d6534a",
+        "#424242"
+    ],
+    "components": [],
+    "groups": []
+}
diff --git a/packages/material/lib/swatches/material-aqua-dark.json b/packages/material/lib/swatches/material-aqua-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#121212",
         "#212121",

diff --git a/packages/material/lib/swatches/material-arctic.json b/packages/material/lib/swatches/material-arctic.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-burnt-teal.json b/packages/material/lib/swatches/material-burnt-teal.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-dataviz-v4.json b/packages/material/lib/swatches/material-dataviz-v4.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#3f51b5",
         "#2196f3",

diff --git a/packages/material/lib/swatches/material-eggplant.json b/packages/material/lib/swatches/material-eggplant.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-lime-dark.json b/packages/material/lib/swatches/material-lime-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#121212",
         "#212121",

diff --git a/packages/material/lib/swatches/material-lime.json b/packages/material/lib/swatches/material-lime.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-main-dark.json b/packages/material/lib/swatches/material-main-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#121212",
         "#212121",

diff --git a/packages/material/lib/swatches/material-main.json b/packages/material/lib/swatches/material-main.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-nova.json b/packages/material/lib/swatches/material-nova.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-pacific-dark.json b/packages/material/lib/swatches/material-pacific-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#121212",
         "#212121",

diff --git a/packages/material/lib/swatches/material-pacific.json b/packages/material/lib/swatches/material-pacific.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-sky-dark.json b/packages/material/lib/swatches/material-sky-dark.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#121212",
         "#212121",

diff --git a/packages/material/lib/swatches/material-sky.json b/packages/material/lib/swatches/material-sky.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/packages/material/lib/swatches/material-smoke.json b/packages/material/lib/swatches/material-smoke.json
@@ -4,6 +4,7 @@
     "product": "kendo",
     "base": "@progress/kendo-theme-material",
     "version": "5.1.2-dev.7",
+    "api": "legacy",
     "previewColors": [
         "#ffffff",
         "#e0e0e0",

diff --git a/sass-swatches.config.js b/sass-swatches.config.js
@@ -21,17 +21,9 @@ module.exports = {
         },
         {
             cwd: 'packages/fluent',
-            file: 'scss/all.scss',
-            outFile: 'dist/all.css',
-            compiler: 'sass-embedded',
-            api: 'modern'
-        },
-        {
-            cwd: 'packages/fluent',
-            file: 'scss/all.scss',
-            outFile: 'dist/fluent-main.css',
-            compiler: 'sass-embedded',
-            api: 'modern'
+            entry: [ 'dist/!(_|variables)*.scss' ],
+            api: "modern",
+            compiler: "sass-embedded"
         }
     ]
 };