icons script which creates sass list of icons

.gitignore

@@ -43,4 +43,6 @@ docs/build
 dist/
 docs/source/assets/img
 docs/source/assets/js/libs/calcite-web.js
-calcite-web.zip
+calcite-web.zip
+docs/source/icons.json
+lib/sass/calcite-web/icons/sets/

bin/icons.js

@@ -0,0 +1,39 @@
+#!/usr/bin/env node
+// Builds a .scss file with all site icons
+var glob = require('glob')
+var fs = require('fs')
+var path = require('path')
+var format = require('util').format
+
+var sets = ['calcite', 'calcite-large', 'vecticons']
+
+function comma (index, array) {
+  var needsComma = index !== array.length - 1
+  return needsComma ? ',' : ''
+}
+
+function formatLine (files, i) {
+  var icon = path.basename(files[i], '.svg')
+  return format('\n    "%s"%s', icon, comma(i, files))
+}
+
+function parseFiles (setName, index) {
+  var files = glob.sync(format('lib/img/icons/%s/*.svg', setName))
+  var sassStream = fs.createWriteStream(format('lib/sass/calcite-web/icons/sets/%s.scss', setName), 'utf8')
+
+  dataStream.write(format('\n  "%s": [', setName))
+  sassStream.write(format('$%s-icons:', setName))
+
+  files.forEach(function (file, i) {
+    var line = formatLine(files, i)
+    dataStream.write(line)
+    sassStream.write(line)
+  })
+  sassStream.end(';')
+  dataStream.write(format('\n  ]%s', comma(index, sets)))
+}
+
+var dataStream = fs.createWriteStream('docs/source/icons.json', 'utf8')
+dataStream.write('{')
+sets.forEach(parseFiles)
+dataStream.end('\n}')

lib/sass/calcite-web/icons/_icons.scss

@@ -4,6 +4,10 @@
 //  ↳ http://esri.github.io/calcite-web/icons/
 //  ↳ icons → _overview.md
 
+@import "sets/calcite-large";
+@import "sets/calcite";
+@import "sets/vecticons";
+
 @mixin icons() {
   // Basic Icon Styles
   [class*="icon-"] {
@@ -21,6 +25,17 @@
   .icon-close {
     content: "×"
   }
+
+  @each $icon in $calcite-large-icons {
+    .calcite-large-#{$icon} { background-image: url('lib/sass/calcite-web/icons/calcite-large/#{$icon}.svg'); }
+  }
+  @each $icon in $calcite-icons {
+    .calcite-#{$icon} { background-image: url('lib/sass/calcite-web/icons/calcite/#{$icon}.svg'); }
+  }
+  @each $icon in $vecticons-icons {
+    .icon-#{$icon} { background-image: url('lib/sass/calcite-web/icons/vecticons/#{$icon}.svg'); }
+  }
+
 }
 
 @if $include-icons == true {