Merge pull request #31 from jessiehuff/fix/token-comments

fix: Update formatting of comments
patternfly · Apr 16, 2024 · ba08833 · ba08833
2 parents d277ce3 + 6316670
commit ba08833
Show file tree

Hide file tree

Showing 9 changed files with 36 additions and 26 deletions.
diff --git a/packages/module/build.js b/packages/module/build.js
@@ -1,9 +1,22 @@
 /* eslint-disable no-console */
 const StyleDictionary = require('style-dictionary');
+const { fileHeader, formattedVariables } = StyleDictionary.formatHelpers;
 
 console.log('Build started...');
 console.log('\n============================');
 
+//Register comment format
+StyleDictionary.registerFormat({
+  name: 'customFormat',
+  formatter: function({dictionary, file, options}) {
+    const { outputReferences } = options;
+    return fileHeader({file, commentStyle: 'short'}) +
+      ':root {\n' +
+      formattedVariables({format: 'css', dictionary, outputReferences}) +
+      '\n}\n';
+  }
+});
+
 // Register custom transforms
 StyleDictionary.registerTransform({
   name: 'patternfly/global/px',
@@ -52,5 +65,6 @@ darkExtendedSD.buildAllPlatforms();
 paletteExtendedSD.buildAllPlatforms();
 chartExtendedSD.buildAllPlatforms();
 
+
 console.log('\n============================');
 console.log('\nBuild completed.');
diff --git a/packages/module/build/css/_tokens-charts.scss b/packages/module/build/css/_tokens-charts.scss
@@ -1,7 +1,6 @@
-// /**
-//  * Do not edit directly
-//  * Generated on Mon, 01 Apr 2024 17:12:28 GMT
-//  */
+
+// Do not edit directly
+// Generated on Thu, 11 Apr 2024 19:46:01 GMT
 
 :root {
   --pf-t--chart--stroke--width--sm: 2;

diff --git a/packages/module/build/css/_tokens-dark.scss b/packages/module/build/css/_tokens-dark.scss
@@ -1,7 +1,6 @@
-// /**
-//  * Do not edit directly
-//  * Generated on Mon, 01 Apr 2024 17:12:28 GMT
-//  */
+
+// Do not edit directly
+// Generated on Thu, 11 Apr 2024 19:46:01 GMT
 
 :root {
   --pf-t--global--background--color--action--plain--default: rgba(0, 0, 0, 0.0000);

diff --git a/packages/module/build/css/_tokens-default.scss b/packages/module/build/css/_tokens-default.scss
@@ -1,7 +1,6 @@
-// /**
-//  * Do not edit directly
-//  * Generated on Mon, 01 Apr 2024 17:12:28 GMT
-//  */
+
+// Do not edit directly
+// Generated on Thu, 11 Apr 2024 19:46:01 GMT
 
 :root {
   --pf-t--global--background--color--action--plain--default: rgba(255, 255, 255, 0.0000);
@@ -166,12 +165,12 @@
   --pf-t--global--box-shadow--X--sm--bottom: var(--pf-t--global--box-shadow--X--400);
   --pf-t--global--box-shadow--X--sm--top: var(--pf-t--global--box-shadow--X--400);
   --pf-t--global--box-shadow--X--sm--default: var(--pf-t--global--box-shadow--X--400);
-  --pf-t--global--z-index--2xl: 600;
-  --pf-t--global--z-index--xl: 500;
-  --pf-t--global--z-index--lg: 400;
-  --pf-t--global--z-index--md: 300;
-  --pf-t--global--z-index--sm: 200;
-  --pf-t--global--z-index--xs: 100;
+  --pf-t--global--z-index--2xl: var(--pf-t--global--z-index--600);
+  --pf-t--global--z-index--xl: var(--pf-t--global--z-index--500);
+  --pf-t--global--z-index--lg: var(--pf-t--global--z-index--400);
+  --pf-t--global--z-index--md: var(--pf-t--global--z-index--300);
+  --pf-t--global--z-index--sm: var(--pf-t--global--z-index--200);
+  --pf-t--global--z-index--xs: var(--pf-t--global--z-index--100);
   --pf-t--global--font--size--4xl: var(--pf-t--global--font--size--800);
   --pf-t--global--font--size--3xl: var(--pf-t--global--font--size--700);
   --pf-t--global--font--size--2xl: var(--pf-t--global--font--size--600);

diff --git a/packages/module/build/css/_tokens-palette.scss b/packages/module/build/css/_tokens-palette.scss
@@ -1,7 +1,6 @@
-// /**
-//  * Do not edit directly
-//  * Generated on Mon, 01 Apr 2024 17:12:28 GMT
-//  */
+
+// Do not edit directly
+// Generated on Thu, 11 Apr 2024 19:46:01 GMT
 
 :root {
   --pf-t--color--red--70: #5f0000;

diff --git a/packages/module/config.chart.json b/packages/module/config.chart.json
@@ -7,7 +7,7 @@
       "prefix": "pf-t",
       "files": [{
         "destination": "_tokens-charts.scss",
-        "format": "css/variables",
+        "format": "customFormat",
         "options": {
           "outputReferences": true
         },

diff --git a/packages/module/config.dark.json b/packages/module/config.dark.json
@@ -7,7 +7,7 @@
       "prefix": "pf-t",
       "files": [{
         "destination": "_tokens-dark.scss",
-        "format": "css/variables",
+        "format": "customFormat",
         "options": {
           "outputReferences": true
         },

diff --git a/packages/module/config.default.json b/packages/module/config.default.json
@@ -7,7 +7,7 @@
       "prefix": "pf-t",
       "files": [{
         "destination": "_tokens-default.scss",
-        "format": "css/variables",
+        "format": "customFormat",
         "options": {
           "outputReferences": true
         },

diff --git a/packages/module/config.palette-colors.json b/packages/module/config.palette-colors.json
@@ -7,7 +7,7 @@
       "prefix": "pf-t",
       "files": [{
         "destination": "_tokens-palette.scss",
-        "format": "css/variables",
+        "format": "customFormat",        
         "options": {
           "outputReferences": true
         },