ustyle 1.15.3 → 1.16.1

data/grunt/tasks/styleguide.js

@@ -1,49 +1,44 @@
-"use strict";
-
-// Expose
-module.exports = function(grunt){
-  grunt.registerMultiTask('styleguide', 'Parse DSS comment blocks', function(){
-
-    var dss             = require('dss'),
-        _               = require('lodash'),
-        async           = require('async'),
-        path            = require('path'),
-        fs              = require('fs'),
-        dssHelper       = require('../modules/dss-helper'),
-        fileHelper      = require('../modules/file'),
-        parser          = require('../modules/html-parser'),
-        humanize        = require("underscore.string/humanize"),
-        underscored     = require("underscore.string/underscored"),
-        slugify         = require("underscore.string/slugify"),
-        matter          = require("gray-matter"),
-        cssstats        = require('cssstats'),
-        StyleStats      = require('stylestats'),
-        marked          = require('marked'),
-        semver          = require('semver'),
-        exec            = require('child_process').exec,
-        simpleGit       = require('simple-git')( path.resolve('.') ),
-        promise         = this.async(),
-        files           = this.files,
-        outputFilePath  = this.data.output,
-        styleguidePath  = this.data.dir,
-        contentPath     = path.join(styleguidePath, "content"),
-        templatePath    = path.join(styleguidePath, "templates"),
-        cssStatsFile    = this.data.statsFor,
-        tagStartVersion = this.data.tagStartVersion,
-        tagPlaceholder  = this.data.tagPlaceholder,
-        styleguide      = [];
+const dss = require('dss')
+const _ = require('lodash')
+const async = require('async')
+const path = require('path')
+const fs = require('fs')
+const dssHelper = require('../modules/dss-helper')
+const fileHelper = require('../modules/file')
+const parser = require('../modules/html-parser')
+const humanize = require('underscore.string/humanize')
+const underscored = require('underscore.string/underscored')
+const slugify = require('underscore.string/slugify')
+const matter = require('gray-matter')
+const StyleStats = require('stylestats')
+const marked = require('marked')
+const semver = require('semver')
+const exec = require('child_process').exec
+const simpleGit = require('simple-git')(path.resolve('.'))
+
+module.exports = function (grunt) {
+  grunt.registerMultiTask('styleguide', 'Parse DSS comment blocks', function () {
+    var promise = this.async()
+    var files = this.files
+    var outputFilePath = this.data.output
+    var styleguidePath = this.data.dir
+    var contentPath = path.join(styleguidePath, 'content')
+    var templatePath = path.join(styleguidePath, 'templates')
+    var cssStatsFile = this.data.statsFor
+    var tagStartVersion = this.data.tagStartVersion
+    var tagPlaceholder = this.data.tagPlaceholder
 
     var options = this.options({
-        template: "styleguide.tpl",
-        contentTemplate: "simple.tpl",
-        parsers: {
-          variable: dssHelper.variableDssParser(),
-          partial: function(i, line, block){ return line; },
-          page: function(i, line, block){ return line; },
-          description: dssHelper.descriptionDssParser,
-          javascript: dssHelper.javascriptParser
-        }
-    });
+      template: 'styleguide.tpl',
+      contentTemplate: 'simple.tpl',
+      parsers: {
+        variable: dssHelper.variableDssParser(),
+        partial: function (i, line, block) { return line },
+        page: function (i, line, block) { return line },
+        description: dssHelper.descriptionDssParser,
+        javascript: dssHelper.javascriptParser
+      }
+    })
 
     async.waterfall([
       init,
@@ -53,242 +48,252 @@ module.exports = function(grunt){
       generateStyleguide,
       generateStats,
       writeFile
-    ], completeTask);
+    ], completeTask)
 
-    function completeTask(){
-      promise();
+    function completeTask () {
+      promise()
     }
 
-    function init(callback){
-      dssHelper.addParsers(options.parsers);
-      callback(null);
+    function init (callback) {
+      dssHelper.addParsers(options.parsers)
+      callback(null)
     }
 
-    function parseDSS(callback){
-      var styleguide = [];
-      var srcFiles = files[0].src;
-
-      srcFiles.forEach(function(file){
-        dss.parse(grunt.file.read(file), { file: file }, function(parsed) {
+    function parseDSS (callback) {
+      var styleguide = []
+      var srcFiles = files[0].src
 
+      srcFiles.forEach(function (file) {
+        dss.parse(grunt.file.read(file), { file: file }, function (parsed) {
           // Continue only if file contains DSS annotation
           if (parsed.blocks.length) {
             // Add comment block to styleguide
-            parsed.blocks.map(function(block){
-
-              block['path'] = file;
-              block['file'] = path.basename(file);
+            parsed.blocks.map(function (block) {
+              block['path'] = file
+              block['file'] = path.basename(file)
               block['link'] = underscored(slugify(block['name']));
 
               // Normalize @state and @variable to array
-              ['state', 'variable'].forEach(function(prop) {
+              ['state', 'variable'].forEach(function (prop) {
                 if (block.hasOwnProperty(prop) && typeof block[prop].slice !== 'function') {
-                  block[prop] = [block[prop]];
+                  block[prop] = [block[prop]]
                 }
-              });
+              })
 
-              if(block.markup){
-                block.markup.escaped = dssHelper.removeModifiersFromMarkup(block.markup.escaped);
+              if (block.markup) {
+                block.markup.escaped = dssHelper.removeModifiersFromMarkup(block.markup.escaped)
               }
 
-              if(block.hasOwnProperty('state')){
-                block.state.map(function(state){
+              if (block.hasOwnProperty('state')) {
+                block.state.map(function (state) {
                   state.markup = {
                     example: dssHelper.addStateToExample(block.markup.example, state.escaped)
                   }
                 })
               }
-            });
-            styleguide.push(parsed.blocks);
+            })
+            styleguide.push(parsed.blocks)
           }
-        });
-      });
-      callback(null, styleguide);
+        })
+      })
+      callback(null, styleguide)
     }
 
-    function groupDSS(styleguide, callback){
+    function groupDSS (styleguide, callback) {
       var sections = _.chain(styleguide).flatten().groupBy('page')
-                    .map(function(value, key) {
-
-                      var structure = key.split("/"),
-                          section = slugify(structure[0]),
-                          page = structure[1];
-
-                      return {
-                          name: page,
-                          page: slugify(page) + '.html',
-                          template: _getTemplate(options.template),
-                          section: slugify(section),
-                          blocks: value
-                      }
-                    })
-                    // As it's iterating over files, we don't want files that aren't documented to come through
-                    .filter(function(object) { return object.section != "undefined" }).compact().value();
-      callback(null, sections);
-    }
+        .map(function (value, key) {
+          const structure = key.split('/')
+          const section = slugify(structure[0])
+          const page = structure[1]
+
+          return {
+            name: page,
+            page: slugify(page) + '.html',
+            template: _getTemplate(options.template),
+            section: slugify(section),
+            blocks: value
+          }
+        })
+        // As it's iterating over files, we don't want files that aren't documented to come through
+        .filter(function (object) { return object.section !== 'undefined' }).compact().value()
 
-    function generateStaticContent(sections, callback) {
+      callback(null, sections)
+    }
 
-      var pages = grunt.file.expand(contentPath + "/**/*")
-          .filter(function(dir){
-            var stats = fs.lstatSync(dir);
-            return !stats.isDirectory();
+    function generateStaticContent (sections, callback) {
+      var pages = grunt.file.expand(contentPath + '/**/*')
+          .filter(function (dir) {
+            var stats = fs.lstatSync(dir)
+            return !stats.isDirectory()
           })
-          .map(function(file){
-            var data = matter.read(file),
-                html = parser.removeSubNav(data.content),
-                extension = path.extname(file),
-                subNavData = parser.extractSubNav(data.content),
-                section = path.dirname(file).replace((new RegExp(contentPath + "\/?", "g")), ""),
-                filename = path.basename(file, extension);
+          .map(function (file) {
+            const data = matter.read(file)
+            const html = parser.removeSubNav(data.content)
+            const extension = path.extname(file)
+            const subNavData = parser.extractSubNav(data.content)
+            const section = path.dirname(file).replace((new RegExp(contentPath + '/?', 'g')), '')
+            const filename = path.basename(file, extension)
 
             return {
               name: data.data.name || humanize(filename),
               page: filename + '.html',
               template: _getTemplate(data.data.template || options.contentTemplate),
-              section: section,
+              section,
               content: (fileHelper.isMarkdown(extension) ? marked(html) : html),
               subNav: subNavData
             }
-          });
+          })
 
-      var data = _sortyByIndex(pages).concat(sections);
+      var data = _sortyByIndex(pages).concat(sections)
 
-      callback(null, _sortyByIndex(data));
+      callback(null, _sortyByIndex(data))
     }
 
-    function generateStyleguide(sections, callback){
+    function generateStyleguide (sections, callback) {
       var model = {
         pages: sections,
         navigation: _getSection(sections),
         project: grunt.file.readJSON('package.json')
       }
 
-      callback(null, model);
+      callback(null, model)
     }
 
-    function generateStats(model, callback) {
-      var cssFileData, selectors, cssParser,
-          omitEntries, statsPage, cachedStatsFile;
+    function generateStats (model, callback) {
+      var cssParser
+      var omitEntries
+      var statsPage
+      var cachedStatsFile
 
-      cachedStatsFile = 'tmp/.stats-cache';
+      cachedStatsFile = 'tmp/.stats-cache'
 
       statsPage = {
         name: 'Stats',
         page: 'stats.html',
         section: 'pattern-library',
         content: {report: []},
-        template: 'styleguide/templates/stats.tpl',
-      };
+        template: 'styleguide/templates/stats.tpl'
+      }
 
-      //Get the latest tag, if the tag is different from the cached one
-      //fetch new data.
+      // Get the latest tag, if the tag is different from the cached one
+      // fetch new data.
       exec('git describe --tags `git rev-list --tags --max-count=1`',
-        function(error, stdout, sterr) {
-          var latestTag = semver.clean(stdout);
-          var data;
+        function (error, stdout, sterr) {
+          if (error) {
+            console.log(error)
+          }
+
+          var latestTag = semver.clean(stdout)
+          var data
 
           try {
-            data = grunt.file.readJSON(cachedStatsFile);
-            var latestVersion = data[0].version;
-            if(data[0] && data[0].version && semver.eq(latestVersion, latestTag)) {
-              statsPage.content.report = data;
-              next();
-            }else {
-              fetchNewStatsData();
+            data = grunt.file.readJSON(cachedStatsFile)
+            var latestVersion = data[0].version
+            if (data[0] && data[0].version && semver.eq(latestVersion, latestTag)) {
+              statsPage.content.report = data
+              next()
+            } else {
+              fetchNewStatsData()
             }
-          }
-          catch(err) {
+          } catch (err) {
             // File does't exist or wrong format.
             fetchNewStatsData()
           }
         }
-      );
+      )
 
-      function fetchNewStatsData() {
+      function fetchNewStatsData () {
         async.waterfall([
           getTags,
           getStylesListing,
-          getStats,
-        ], next);
+          getStats
+        ], next)
       }
 
-      function getTags(callback) {
-        simpleGit.tags(function(err, tags) {
-          callback(null, tags);
-        });
+      function getTags (callback) {
+        simpleGit.tags(function (err, tags) {
+          if (err) {
+            console.log(err)
+          }
+
+          callback(null, tags)
+        })
       }
 
-      function getStylesListing(tags, callback) {
-        var styleListing = tags.all.map(function(tag){
-          var cleanTag = semver.clean(tag);
-          if(cleanTag!=null && semver.gt(cleanTag, tagStartVersion)) {
+      function getStylesListing (tags, callback) {
+        var styleListing = tags.all.map(function (tag) {
+          var cleanTag = semver.clean(tag)
+          if (cleanTag != null && semver.gt(cleanTag, tagStartVersion)) {
             return {
-                    version: cleanTag,
-                    path: cssStatsFile.replace(tagPlaceholder, cleanTag)
-                   }
+              version: cleanTag,
+              path: cssStatsFile.replace(tagPlaceholder, cleanTag)
+            }
           }
-        });
-        callback(null, _.compact(styleListing));
+        })
+        callback(null, _.compact(styleListing))
       }
 
-      function getStats(styleListing, callback) {
+      function getStats (styleListing, callback) {
         omitEntries = [
-          'dataUriSize', 'ratioOfDataUriSize','lowestCohesion',
+          'dataUriSize', 'ratioOfDataUriSize', 'lowestCohesion',
           'lowestCohesionSelector', 'uniqueFontSize', 'uniqueFontFamily',
           'propertiesCount', 'published', 'paths', 'mostIdentifierSelector',
           'totalUniqueFontSizes', 'mostIdentifier', 'totalUniqueFontFamilies',
           'totalUniqueColors', 'unqualifiedAttributeSelectors', 'floatProperties',
           'uniqueColor'
-        ];
+        ]
 
         async.map(styleListing,
-          function(entry, cb){
-            cssParser = new StyleStats(entry.path, {});
-            cssParser.parse(function(err, styleStatsData){
-              var generalReport = _.omit(styleStatsData,omitEntries);
-              if(Object.keys(generalReport).length) {
-                generalReport.version = entry.version;
-                statsPage.content.report.push(generalReport);
+          function (entry, cb) {
+            cssParser = new StyleStats(entry.path, {})
+            cssParser.parse(function (err, styleStatsData) {
+              if (err) {
+                console.log(err)
+              }
+
+              var generalReport = _.omit(styleStatsData, omitEntries)
+              if (Object.keys(generalReport).length) {
+                generalReport.version = entry.version
+                statsPage.content.report.push(generalReport)
               }
-              cb();
-            });
+              cb()
+            })
           },
-          function(){
-            //Sort array
-            var sortedReport = statsPage.content.report.sort(function(a,b){
-              return semver.rcompare(a.version, b.version);
-            });
-            statsPage.content.report = sortedReport;
-            fileHelper.writeFile(JSON.stringify(sortedReport), cachedStatsFile, "Cached stats");
-            callback();
+          function () {
+            // Sort array
+            var sortedReport = statsPage.content.report.sort(function (a, b) {
+              return semver.rcompare(a.version, b.version)
+            })
+            statsPage.content.report = sortedReport
+            fileHelper.writeFile(JSON.stringify(sortedReport), cachedStatsFile, 'Cached stats')
+            callback()
           }
-        );
+        )
       }
 
-      function next(){
-        model.pages.push(statsPage);
-        callback(null, model);
+      function next () {
+        model.pages.push(statsPage)
+        callback(null, model)
       }
     }
 
-    function _getSection(sections){
-      return _.chain(sections).map(function(data){ return slugify(data.section) }).compact().uniq().value();
+    function _getSection (sections) {
+      return _.chain(sections).map(function (data) { return slugify(data.section) }).compact().uniq().value()
     }
 
-    function _sortyByIndex(sections){
-      return sections.sort(function(a, b){
-        return (a.page == "index.html" ? -1 : 1);
+    function _sortyByIndex (sections) {
+      return sections.sort(function (a, b) {
+        return (a.page === 'index.html' ? -1 : 1)
       })
     }
 
-    function _getTemplate(name){
-      return path.join(templatePath, name);
+    function _getTemplate (name) {
+      return path.join(templatePath, name)
     }
 
-    function writeFile(model, callback){
-      fileHelper.writeFile(JSON.stringify(model), outputFilePath, "Styleguide");
-      callback(null, 'done');
+    function writeFile (model, callback) {
+      fileHelper.writeFile(JSON.stringify(model), outputFilePath, 'Styleguide')
+      callback(null, 'done')
     }
-  });
-};
+  })
+}

data/index.js

@@ -0,0 +1,31 @@
+const types = require('node-sass').types
+const path = require('path')
+const fs = require('fs')
+
+const base64encode = string => {
+  const stringBuffer = Buffer.from(string.getValue())
+  return types.String(stringBuffer.toString('base64'))
+}
+
+const inlineSVG = source => {
+  const sourcePath = path.join(__dirname, 'vendor', 'assets', 'images', source.getValue())
+  let svg = ''
+
+  try {
+    svg = fs.readFileSync(sourcePath).toString()
+  } catch (err) {
+    console.error('Error inlining SVG file', err)
+  }
+
+  const dataUrl = `url('data:image/svg+xml;charset=utf-8,${encodeURIComponent(svg)}')`
+  return types.String(dataUrl)
+}
+
+const SassHelpers = {
+  'base64encode($string)': base64encode,
+  'inline-svg($source)': inlineSVG
+}
+
+module.exports = {
+  SassHelpers
+}

data/lib/ustyle/version.rb

@@ -1,4 +1,4 @@
 module Ustyle
-  version = "1.15.3"
+  version = "1.16.1"
   VERSION = version
 end