css-declaration-sorter - npm Package Compare versions

Comparing version 1.6.0 to 1.7.0

bin/cssdeclsort.js

 #!/usr/bin/env node
 'use strict';
 
-var fs = require('fs');
-var path = require('path');
-var read = require('read-file-stdin');
-var write = require('write-file-stdout');
-var args = require('argh').argv;
+const fs = require('fs');
+const path = require('path');
+const read = require('read-file-stdin');
+const write = require('write-file-stdout');
+const args = require('argh').argv;
 
-var cssdeclsort = require('../src/index.js');
-var log = require('./verbose-log');
+const cssdeclsort = require('../src/index.js');
+const log = require('./verbose-log');
 
-var transform = function (input, output) {
+const transform = function (input, output) {
   // Read from a file, fallback to stdin
   read(input, function (error, data) {
-    var options = {};
+    const options = {};
 
@@ -36,6 +36,6 @@ if (error) throw error;
 
-var handleArgs = function () {
-  var directory = args.directory || '';
-  var explicitOutput = args.output;
-  var usageFile;
+const handleArgs = function () {
+  const directory = args.directory || '';
+  const explicitOutput = args.output;
+  let usageFile;
 
@@ -65,3 +65,3 @@ log('Arguments:', args, '\n');
     args.argv.forEach(function (file) {
-      var output = explicitOutput || path.join(directory, file);
+      const output = explicitOutput || path.join(directory, file);
       transform(file, output);
@@ -68,0 +68,0 @@ });

bin/verbose-log.js

 'use strict';
 
-var args = require('argh').argv;
+const args = require('argh').argv;
 
@@ -5,0 +5,0 @@ module.exports = function () {

orders/concentric-css.json

@@ -86,2 +86,8 @@ [
   "mask",
+  "mask-clip",
+  "mask-image",
+  "mask-origin",
+  "mask-position",
+  "mask-repeat",
+  "mask-size",
   "mask-type",
@@ -263,2 +269,3 @@ "filter",
   "unicode-bidi",
+  "unicode-range",
   "text-combine-upright",
@@ -265,0 +272,0 @@ "text-align",

orders/smacss.json

@@ -253,2 +253,8 @@ [
   "mask",
+  "mask-clip",
+  "mask-image",
+  "mask-origin",
+  "mask-position",
+  "mask-repeat",
+  "mask-size",
   "mask-type",
@@ -281,2 +287,3 @@ "opacity",
   "unicode-bidi",
+  "unicode-range",
   "vertical-align",
@@ -283,0 +290,0 @@ "visibility",

orders/source.json

@@ -185,2 +185,8 @@ [
   "mask",
+  "mask-clip",
+  "mask-image",
+  "mask-origin",
+  "mask-position",
+  "mask-repeat",
+  "mask-size",
   "mask-type",
@@ -272,2 +278,3 @@ "max-block-size",
   "unicode-bidi",
+  "unicode-range",
   "vertical-align",
@@ -283,2 +290,2 @@ "visibility",
   "z-index"
-]
+]

package.json

 {
   "name": "css-declaration-sorter",
-  "version": "1.6.0",
+  "version": "1.7.0",
   "description": "Sorts CSS declarations fast and automatically in a certain order.",
@@ -37,3 +37,3 @@ "keywords": [
     "lint": "eslint src/*.js bin/*.js tests/*.js",
-    "watch": "watch 'npm run test && npm run lint --silent' src bin",
+    "watch": "watch 'npm run test && npm run lint --silent' src bin tests",
     "scrape": "node src/property-scraper"
@@ -51,4 +51,4 @@ },
     "tape": "^4.2.1",
-    "watch": "^0.19.2"
+    "watch": "^1.0.1"
   }
 }

readme.md

@@ -68,5 +68,5 @@ <img alt='CSS declaration sorter logo' src='https://cdn.rawgit.com/Siilwyn/css-declaration-sorter/master/logo.svg' height='260' align='right'>
 ```js
-var fs = require('fs');
-var postcss = require('postcss');
-var cssdeclsort = require('css-declaration-sorter');
+const fs = require('fs');
+const postcss = require('postcss');
+const cssdeclsort = require('css-declaration-sorter');
 
@@ -82,5 +82,5 @@ postcss([cssdeclsort({order: 'smacss'})])
 ```js
-var gulp = require('gulp');
-var gulpPostcss = require('gulp-postcss');
-var cssdeclsort = require('css-declaration-sorter');
+const gulp = require('gulp');
+const gulpPostcss = require('gulp-postcss');
+const cssdeclsort = require('css-declaration-sorter');
 
@@ -87,0 +87,0 @@ gulp.task('css', function () {

src/index.js

 'use strict';
 
-var fs = require('fs');
-var path = require('path');
+const fs = require('fs');
+const path = require('path');
 
-var postcss = require('postcss');
-var timsort = require('timsort').sort;
+const postcss = require('postcss');
+const timsort = require('timsort').sort;
 
-module.exports = postcss.plugin('css-declaration-sorter', function (options) {
-  // Sort CSS declarations alphabetically or using the set sorting order
-  var sortCssDecls = function (cssDecls, sortOrder) {
-    if (sortOrder === 'alphabetically') {
-      timsort(cssDecls, function (a, b) {
-        if (a.prop !== b.prop) {
-          return a.prop < b.prop ? -1 : 1;
-        } else {
-          return 0;
-        }
-      });
-    } else {
-      timsort(cssDecls, function (a, b) {
-        var aIndex = sortOrder.indexOf(a.prop);
-        var bIndex = sortOrder.indexOf(b.prop);
+// Sort CSS declarations alphabetically or using the set sorting order
+function sortCssDecls (cssDecls, sortOrder) {
+  if (sortOrder === 'alphabetically') {
+    timsort(cssDecls, function (a, b) {
+      if (a.prop !== b.prop) {
+        return a.prop < b.prop ? -1 : 1;
+      } else {
+        return 0;
+      }
+    });
+  } else {
+    timsort(cssDecls, function (a, b) {
+      const aIndex = sortOrder.indexOf(a.prop);
+      const bIndex = sortOrder.indexOf(b.prop);
 
-        if (aIndex !== bIndex) {
-          return aIndex < bIndex ? -1 : 1;
-        } else {
-          return 0;
-        }
-      });
-    }
-  };
+      if (aIndex !== bIndex) {
+        return aIndex < bIndex ? -1 : 1;
+      } else {
+        return 0;
+      }
+    });
+  }
+}
 
-  // Return all comments in two types with the node they belong to
-  var processComments = function (css) {
-    var newline = [];
-    var inline = [];
+function processCss (css, sortOrder) {
+  const newline = [];
+  const inline = [];
+  const rulesCache = [];
 
-    css.walkComments(function (comment) {
+  css.walk(function (node) {
+    const nodes = node.nodes;
+    const type = node.type;
+
+    if (type === 'comment') {
       // Don't do anything to root comments or the last newline comment
-      var lastNewlineNode = !comment.next() && ~comment.raws.before.indexOf('\n');
+      const lastNewlineNode = !node.next() && ~node.raws.before.indexOf('\n');
 
-      if (comment.parent.type === 'root' || lastNewlineNode) {
+      if (node.parent.type === 'root' || lastNewlineNode) {
         return;
       }
 
-      if (~comment.raws.before.indexOf('\n')) {
-        newline.push({
-          'comment': comment,
-          'pairedNode': comment.next()
+      if (~node.raws.before.indexOf('\n')) {
+        newline.unshift({
+          'comment': node,
+          'pairedNode': node.next()
         });
       } else {
         inline.push({
-          'comment': comment,
-          'pairedNode': comment.prev()
+          'comment': node,
+          'pairedNode': node.prev()
         });
       }
 
-      comment.remove();
-    });
+      node.remove();
+      return;
+    }
 
-    // Reverse order because newline comments are inserted before the next node
-    newline.reverse();
+    // Add rule-like nodes to a cache so that we can remove all
+    // comment nodes before we start sorting.
+    const isRule = type === 'rule' || type === 'atrule';
+    if (isRule && nodes && nodes.length > 1) {
+      rulesCache.push(nodes);
+    }
+  });
 
-    return {
-      'newline': newline,
-      'inline': inline
-    };
-  };
+  // Perform a sort once all comment nodes are removed
+  rulesCache.forEach(function (nodes) {
+    sortCssDecls(nodes, sortOrder);
+  });
 
-  var processCss = function (css, sortOrder) {
-    var processedComments = processComments(css);
+  // Add comments back to the nodes they are paired with
+  newline.forEach(function (element) {
+    element.comment.remove();
+    element.pairedNode.parent.insertBefore(element.pairedNode, element.comment);
+  });
 
-    // Traverse nodes with children and sort those children
-    css.walk(function (rule) {
-      var isRule = rule.type === 'rule' || rule.type === 'atrule';
+  inline.forEach(function (element) {
+    element.comment.remove();
+    element.pairedNode.parent.insertAfter(element.pairedNode, element.comment);
+  });
+}
 
-      if (isRule && rule.nodes && rule.nodes.length > 1) {
-        sortCssDecls(rule.nodes, sortOrder);
-      }
-    });
-
-    // Add comments back to the nodes they are paired with
-    processedComments.newline.forEach(function (element) {
-      element.comment.remove();
-      element.pairedNode.parent.insertBefore(element.pairedNode, element.comment);
-    });
-
-    processedComments.inline.forEach(function (element) {
-      element.comment.remove();
-      element.pairedNode.parent.insertAfter(element.pairedNode, element.comment);
-    });
-  };
-
+module.exports = postcss.plugin('css-declaration-sorter', function (options) {
   return function (css) {
-    var sortOrderPath;
+    let sortOrderPath;
 
@@ -98,0 +95,0 @@ options = options || {};

src/property-scraper.js

 'use strict';
 
-var https = require('https');
-var fs = require('fs');
+const https = require('https');
+const fs = require('fs');
 
-var includes = function (element, searchValue) {
-  return Boolean(~element.indexOf(searchValue));
+const isStandardProperty = function (tags) {
+  return (
+    tags.find(function (tagName) {
+      return tagName.match(/css property/i);
+    }) &&
+    !tags.find(function (tagName) {
+      return tagName.match(/non-standard/i);
+    })
+  );
 };
 
-var options = {
+const options = {
   hostname: 'developer.mozilla.org',
@@ -16,5 +23,4 @@ port: 443,
 
-var request = https.get(options, function (result) {
-  var data = '';
-  var cssProperties = [];
+const request = https.get(options, function (result) {
+  let data = '';
 
@@ -31,9 +37,20 @@ result.setEncoding('utf8');
 
-    data.subpages.forEach(function (element) {
-      // Add element if tagged as CSS property and not tagged as Non-standard
-      if (includes(element.tags, 'CSS Property') && !includes(element.tags, 'Non-standard')) {
-        cssProperties.push(element.title);
+    let cssProperties = data.subpages.reduce(function (cssProperties, page) {
+      // Add page title if tagged as CSS property and not tagged as Non-standard
+      if (isStandardProperty(page.tags)) {
+        cssProperties.push(page.title);
       }
-    });
 
+      const cssDescriptors = page.subpages.reduce(function (cssDescriptors, subPage) {
+        if (isStandardProperty(subPage.tags) && !~cssProperties.indexOf(subPage.title)) {
+          cssDescriptors.push(subPage.title);
+        }
+
+        return cssDescriptors;
+      }, []);
+
+      return [].concat(cssProperties, cssDescriptors);
+    }, []);
+
+    cssProperties.sort();
     cssProperties = JSON.stringify(cssProperties, null, 2);
@@ -40,0 +57,0 @@

New alerts

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Fixed alerts

Network access

Supply chain risk

This module accesses the network.

Found 1 instance in 1 package

Filesystem access

Supply chain risk

Accesses the file system, and could potentially read sensitive data.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

31280

2.06%

Lines of code

1078

3.16%

No dependency changes