Rename scripts folder

docs/_scripts/.gitignore

@@ -0,0 +1,5 @@
+# Folders
+
+/build
+/output
+/variables

docs/_scripts/01-initial.js

@@ -0,0 +1,13 @@
+const Metalsmith = require('metalsmith');
+const filter = require('metalsmith-filter');
+
+const regex_initial = '**/initial-variables.sass';
+const initial_plugin = require('./plugins/01-read-initial-variables');
+
+Metalsmith(__dirname)
+  .source('../../sass')
+  .use(filter(regex_initial))
+  .use(initial_plugin())
+  .build(function(err) {
+    if (err) throw err;
+  });

docs/_scripts/02-derived.js

@@ -0,0 +1,13 @@
+const Metalsmith = require('metalsmith');
+const filter = require('metalsmith-filter');
+
+const regex_derived = '**/derived-variables.sass';
+const derived_plugin = require('./plugins/02-read-derived-variables');
+
+Metalsmith(__dirname)
+  .source('../../sass')
+  .use(filter(regex_derived))
+  .use(derived_plugin())
+  .build(function(err) {
+    if (err) throw err;
+  });

docs/_scripts/03-other.js

@@ -0,0 +1,13 @@
+const Metalsmith = require('metalsmith');
+const filter = require('metalsmith-filter');
+
+const regex_sass = '**/*.sass';
+const other_plugin = require('./plugins/03-read-other-variables');
+
+Metalsmith(__dirname)
+  .source('../../sass')
+  .use(filter(regex_sass))
+  .use(other_plugin())
+  .build(function(err) {
+    if (err) throw err;
+  });

docs/_scripts/plugins/01-read-initial-variables.js

@@ -0,0 +1,30 @@
+module.exports = plugin;
+
+const utils = require('./utils');
+
+function plugin() {
+
+  return (files, metalsmith, done) => {
+    setImmediate(done);
+
+    Object.keys(files).forEach(file_path => {
+      const {file_name, lines} = utils.getLines(files, file_path);
+      let variables = {
+        by_name: {},
+        list: [],
+        file_path,
+      };
+
+      lines.forEach(line => {
+        const variable = utils.parseLine(line);
+
+        if (variable != false) {
+          variables.by_name[variable.name] = variable;
+          variables.list.push(variable.name);
+        }
+      });
+
+      utils.writeFile(file_path, variables);
+    });
+  };
+}

docs/_scripts/plugins/02-read-derived-variables.js

@@ -0,0 +1,40 @@
+module.exports = plugin;
+
+const utils = require('./utils');
+const fs = require('fs');
+
+let initial_variables = JSON.parse(fs.readFileSync(utils.files.initial_variables));
+let derived_variables = JSON.parse(fs.readFileSync(utils.files.derived_variables));
+
+function plugin() {
+  return (files, metalsmith, done) => {
+    setImmediate(done);
+
+    Object.keys(files).forEach(file_path => {
+      const {file_name, lines} = utils.getLines(files, file_path);
+      let variables = {
+        by_name: {},
+        list: [],
+        file_path,
+      };
+
+      lines.forEach(line => {
+        const variable = utils.parseLine(line);
+
+        if (variable != false) {
+          const computed_data = utils.getComputedData(variable.name, variable.value, variable.type, initial_variables, derived_variables);
+
+          if (Object.keys(computed_data).length > 0) {
+            variable.computed_type = computed_data.computed_type;
+            variable.computed_value = computed_data.computed_value;
+          }
+
+          variables.by_name[variable.name] = variable;
+          variables.list.push(variable.name);
+        }
+      });
+
+      utils.writeFile(file_path, variables);
+    });
+  };
+}

docs/_scripts/plugins/03-read-other-variables.js

@@ -0,0 +1,46 @@
+module.exports = plugin;
+
+const utils = require('./utils');
+const fs = require('fs');
+
+let initial_variables = JSON.parse(fs.readFileSync(utils.files.initial_variables));
+let derived_variables = JSON.parse(fs.readFileSync(utils.files.derived_variables));
+
+function plugin() {
+  return (files, metalsmith, done) => {
+    setImmediate(done);
+
+    Object.keys(files).forEach(file_path => {
+      // if (file_path.startsWith('utilities')) {
+      //   return;
+      // }
+
+      const {file_name, lines} = utils.getLines(files, file_path);
+      let variables = {
+        by_name: {},
+        list: [],
+        file_path,
+      };
+
+      lines.forEach(line => {
+        const variable = utils.parseLine(line);
+
+        if (variable != false) {
+          const computed_data = utils.getComputedData(variable.name, variable.value, variable.type, initial_variables, derived_variables);
+
+          if (Object.keys(computed_data).length > 0) {
+            variable.computed_type = computed_data.computed_type;
+            variable.computed_value = computed_data.computed_value;
+          }
+
+          variables.by_name[variable.name] = variable;
+          variables.list.push(variable.name);
+        }
+      });
+
+      if (variables.list.length > 0) {
+        utils.writeFile(file_path, variables);
+      }
+    });
+  };
+}

docs/_scripts/plugins/utils.js

@@ -0,0 +1,195 @@
+const fs = require('fs');
+const path = require('path');
+
+const base_path = '../_data/variables/';
+const css_keywords = ['null', 'ease-out', 'optimizeLegibility'];
+const regex_unitless = /^([0-9]+\.[0-9]+)$/;
+
+let utils = {
+  getVariableType: (name, value) => {
+    if (!value) {
+      return 'string';
+    }
+
+    if (name == '$sizes') {
+      return 'map';
+    }
+
+    if (value.startsWith('hsl') || value.startsWith('#') || value.startsWith('rgb')) {
+      return 'color';
+    } else if (css_keywords.includes(value)) {
+      return 'keyword';
+    } else if (
+        value.startsWith('findColorInvert')
+        || value.startsWith('mergeColorMaps')
+      ) {
+      return 'function';
+    } else if (value.startsWith('$')) {
+      return 'variable';
+    } else if (
+        value.startsWith('BlinkMacSystemFont')
+        || value == 'monospace'
+      ) {
+      return 'font-family';
+    } else if (value == 'true'
+        || value == 'false'
+      ) {
+      return 'boolean';
+    } else if (value.endsWith('ms')) {
+      return 'duration';
+    } else if (value.includes('+')) {
+      return 'computed';
+    } else if (
+        value.endsWith('00')
+        || value == 'normal'
+      ) {
+      return 'font-weight';
+    } else if (
+        value.endsWith('px')
+        || value.endsWith('em')
+        || value.includes('px ')
+        || value.includes('em ')
+      ) {
+      return 'size';
+    } else if (value.includes('$')) {
+      return 'compound';
+    } else if (value.match(regex_unitless)) {
+      return 'unitless';
+    }
+
+    return 'string';
+  },
+
+  parseLine: (line) => {
+    if (line.startsWith('$') && line.endsWith('!default')) {
+      const colon_index = line.indexOf(':');
+      const variable_name = line.substring(0, colon_index).trim();
+
+      const default_index = line.indexOf('!default');
+      const variable_value = line.substring(colon_index + 1, default_index).trim();
+
+      return variable = {
+        name: variable_name,
+        value: variable_value,
+        type: utils.getVariableType(variable_name, variable_value),
+      };
+    }
+
+    return false;
+  },
+
+  getLines: (files, file_path) => {
+    const file = files[file_path];
+    const slash_index = file_path.lastIndexOf('/');
+    const dot_index = file_path.lastIndexOf('.');
+    const file_name = file_path.substring(slash_index + 1, dot_index);
+
+    return {
+      file_name,
+      lines: file.contents.toString().split(/(?:\r\n|\r|\n)/g),
+    }
+  },
+
+  writeFile: (file_path, data) => {
+    const json_data = JSON.stringify(data, null, '  ');
+    const json_file_path = base_path + file_path.replace('.sass', '.json');
+
+    utils.ensureDirectoryExistence(json_file_path);
+
+    fs.writeFile(json_file_path, json_data, err => {
+      if (err) {
+        return console.log(err);
+      }
+
+      console.log(`The file ${json_file_path} was saved!`);
+    });
+  },
+
+  getInitialValue: (value, type, initial_variables) => {
+    if (value.startsWith('$') && value in initial_variables.by_name) {
+      const second_value = initial_variables.by_name[value].value;
+
+      if (second_value.startsWith('$') && second_value in initial_variables.by_name) {
+        const third_value = initial_variables.by_name[second_value].value;
+
+        return third_value;
+      }
+
+      return second_value;
+    }
+
+    return value;
+  },
+
+  getComputedData: (name, value, type, initial_variables, derived_variables = {}) => {
+    let computed_value = '';
+
+    if (value.startsWith('$')) {
+      let second_value;
+
+      if (value in initial_variables.by_name) {
+        second_value = initial_variables.by_name[value].value;
+      } else if (derived_variables.by_name && value in derived_variables.by_name) {
+        second_value = derived_variables.by_name[value].value;
+      }
+
+      if (second_value && second_value.startsWith('$')) {
+        let third_value;
+
+        if (second_value in initial_variables.by_name) {
+          third_value = initial_variables.by_name[second_value].value;
+        } else if (derived_variables.by_name && second_value in derived_variables.by_name) {
+          third_value = derived_variables.by_name[second_value].value;
+        }
+
+        computed_value = third_value;
+      } else {
+        computed_value = second_value;
+      }
+    } else if (value.startsWith('findColorInvert')) {
+      // e.g. $turquoise-invert -> findColorInvert($turquoise)
+      if (value.endsWith('($yellow)')) {
+        computed_value = 'rgba(0, 0, 0, 0.7)';
+      } else {
+        computed_value = '#fff';
+      }
+    }
+
+    if (computed_value && computed_value != '') {
+      // e.g. $primary-invert -> $turquoise-invert -> findColorInvert($turquoise)
+      if (computed_value.startsWith('findColorInvert')) {
+        if (computed_value.endsWith('($yellow)')) {
+          computed_value = 'rgba(0, 0, 0, 0.7)';
+        } else {
+          computed_value = '#fff';
+        }
+      }
+
+      const computed_type = utils.getVariableType(name, computed_value);
+
+      return {
+        computed_type,
+        computed_value,
+      }
+    }
+
+    return {};
+  },
+
+  ensureDirectoryExistence: (file_path) => {
+    var dirname = path.dirname(file_path);
+
+    if (fs.existsSync(dirname)) {
+      return true;
+    }
+
+    utils.ensureDirectoryExistence(dirname);
+    fs.mkdirSync(dirname);
+  }
+}
+
+utils.files = {};
+utils.files.initial_variables = `${base_path}utilities/initial-variables.json`;
+utils.files.derived_variables = `${base_path}utilities/derived-variables.json`;
+
+module.exports = utils;