stylelint-use-logical-spec - npm Package Compare versions

Comparing version 4.1.0 to 5.0.0

index.cjs.js

@@ -40,8 +40,12 @@ 'use strict';
 const validateRuleWithProps = (root, props, fn) => {
-  // conditionally walk nodes with children
-  if (root.nodes && root.nodes.length) {
+  // For supporting css-in-js
+  const {
+    nodes = [root]
+  } = root; // conditionally walk nodes with children
+
+  if (nodes && nodes.length) {
     const args = [];
     const hasProps = props.every(prop => {
-      const declIndex = root.nodes.findIndex(child => child.type === 'decl' && child.prop === prop);
-      const decl = root.nodes[declIndex];
+      const declIndex = nodes.findIndex(child => child.type === 'decl' && child.prop === prop);
+      const decl = nodes[declIndex];
 
@@ -61,2 +65,58 @@ if (decl) {
 
+const cssValueSplit = value => {
+  const ret = [];
+  const stack = [];
+  let part = '';
+  let esc = false;
+  let q = '';
+
+  for (let i = 0; i < value.length; i++) {
+    const c = value[i];
+
+    if (esc) {
+      esc = false;
+    } else if (c === '\\') {
+      esc = true;
+    } else if (q) {
+      if (c === q) {
+        q = '';
+      }
+    } else if (c === '\'' || c === '"') {
+      q = c;
+    } else if (c === ' ' && stack.length === 0) {
+      if (part) {
+        ret.push(part);
+      }
+
+      part = '';
+      continue;
+    } else if (c === '(') {
+      stack.push(')');
+    } else if (c === '{') {
+      stack.push('}');
+    } else if (c === '[') {
+      stack.push(']');
+    } else if (stack.length && c === stack[stack.length - 1]) {
+      stack.length--;
+    }
+
+    part += c;
+  }
+
+  if (part) {
+    ret.push(part);
+  }
+
+  return ret;
+}; // console.log(cssValueSplit('3px  0 5px'));
+// -> [ '3px', '0', '5px' ]
+// console.log(cssValueSplit('3px calc(--bla, 0) 5px'));
+// -> [ '3px', 'calc(--bla, 0)', '5px' ]
+// console.log(cssValueSplit('3px map-get($spacers, 2) 5px'));
+// -> [ '3px', 'map-get($spacers, 2)', '5px' ]
+// console.log(cssValueSplit('-#{map-get($spacers, 2)} #{map-get($spacers, 3)} 5px'));
+// -> [ '-#{map-get($spacers, 2)}', '#{map-get($spacers, 3)}', '5px' ]
+// console.log(cssValueSplit('-#{function("something ) else\')\\" bla", 2)} #{map-get($spacers, 3)} 5px'));
+// [ `-#{function("something ) else')\\" bla", 2)}`, '#{map-get($spacers, 3)}', '5px' ]
+
 var ruleName = 'liberty/use-logical-spec';
@@ -100,6 +160,10 @@
 
-const reportedDecls = new WeakMap();
+const reportedDecls = new WeakMap(); // Ignore autofix on those expression value
+
+const expressionRegex = /^\$\{.*\}$/g;
 var index = stylelint__default['default'].createPlugin(ruleName, (method, opts, context) => {
   const propExceptions = [].concat(Object(opts).except || []);
-  const isAutofix = isContextAutofixing(context);
+
+  const isAutofixable = node => isContextAutofixing(context) && !expressionRegex.test(node.value);
+
   const dir = /^rtl$/i.test(Object(opts).direction) ? 'rtl' : 'ltr';
@@ -145,3 +209,3 @@ return (root, result) => {
 
-            if (isAutofix) {
+            if (isAutofixable(node)) {
               console.warn(`Migrating ${prop[0]} to Logical standards.`);
@@ -177,3 +241,3 @@ const value = outDateDecl.value;
             ) {
-                if (isAutofix) {
+                if (isAutofixable(node)) {
                   firstInlineDecl.cloneBefore({
@@ -201,6 +265,6 @@ prop,
             // eslint-disable-line
-            let inputValues = physicalDecl.value.trim().split(' ');
+            const inputValues = cssValueSplit(physicalDecl.value);
 
             if (!isDeclAnException(physicalDecl, propExceptions) && inputValues.length !== 1) {
-              if (isAutofix) {
+              if (isAutofixable(node)) {
                 let outputValues = convertShorthandValues(inputValues, dir);
@@ -228,3 +292,3 @@ ['block', 'inline'].forEach(type => {
             if (!isDeclAnException(startDecl, propExceptions) && !isDeclAnException(endDecl, propExceptions)) {
-              if (isAutofix) {
+              if (isAutofixable(node)) {
                 firstInlineDecl.cloneBefore({
@@ -248,3 +312,3 @@ prop,
             if (!isDeclAnException(physicalDecl, propExceptions)) {
-              if (isAutofix) {
+              if (isAutofixable(node)) {
                 physicalDecl.prop = prop;
@@ -266,3 +330,3 @@ } else if (!isDeclReported(physicalDecl)) {
 
-              if (isAutofix) {
+              if (isAutofixable(node)) {
                 node.value = value;
@@ -295,3 +359,3 @@ } else {
           if (value !== originalValue) {
-            if (isAutofix) {
+            if (isAutofixable(node)) {
               node.value = value;
@@ -367,3 +431,3 @@ } else {
 const optimizeCssValues = value => {
-  let values = value.split(' ');
+  const values = cssValueSplit(value);
 
@@ -370,0 +434,0 @@ if (values.length === 2 && values[0] === values[1]) {

package.json

 {
   "name": "stylelint-use-logical-spec",
-  "version": "4.1.0",
+  "version": "5.0.0",
   "description": "Enforce usage of logical properties and values in CSS",
@@ -30,3 +30,2 @@ "license": "CC0-1.0",
   },
-  "dependencies": {},
   "devDependencies": {
@@ -33,0 +32,0 @@ "@babel/core": "^7.12.3",

No alert changes

Improved metrics

Total package byte prevSize

125243

9.21%

Lines of code

736

16.83%

No dependency changes