Generate color-system.scss from primer-colors

script/generate-colors.js

@@ -0,0 +1,52 @@
+#!/usr/bin/env node
+
+const colors = require('primer-colors')
+const write = console.log
+
+const hues = {}
+for (const [name, value] of Object.entries(colors)) {
+  if (Array.isArray(value)) {
+    const mapName = `${name}s`
+    writeArray(mapName, value)
+    for (const index of Object.keys(value)) {
+      writeVariable(`${name}-${index}`, `map-get($${mapName}, ${index})`)
+      writeVariable(`${name}-${index}00`, `map-get($${mapName}, ${index})`)
+    }
+    hues[name] = `$${mapName}`
+    write('')
+  } else {
+    writeVariable(name, value)
+  }
+}
+
+write('')
+for (const hue of Object.keys(hues)) {
+  writeVariable(hue, `$${hue}-5`)
+}
+
+write('')
+writeVariable('gray-dark', '$gray-900')
+writeVariable('gray-light', '$gray-400')
+writeVariable('gray', '$gray-500')
+write('')
+
+for (const color of ['black', 'white']) {
+  for (const alpha of [15, 30, 50, 70, 85]) {
+    writeVariable(`${color}-fade-${alpha}`, `rgba($${color}, 0.${alpha})`)
+  }
+  write('')
+}
+
+writeArray('hue-maps', hues)
+
+function writeVariable(name, value) {
+  write(`$${name}: ${value} !default;`)
+}
+
+function writeArray(name, value) {
+  write(`$${name}: (${Object.entries(value).map(formatArrayEntry).join('')}\n) !default;\n`)
+}
+
+function formatArrayEntry([index, value]) {
+  return `\n  ${index}: ${value},`
+}