postcss-bem-linter - npm Package Compare versions

Comparing version 2.6.0 to 2.7.0

CHANGELOG.md

@@ -0,1 +1,5 @@
+=== 2.7.0 (February 28, 2017)
+
+* Add implicitComponents and implicitUtilities option ([#93](https://github.com/postcss/postcss-bem-linter/pull/93))
+
 === 2.6.0 (September 26, 2016)
@@ -2,0 +6,0 @@

index.js

@@ -7,2 +7,4 @@ var postcss = require('postcss');
 var toRegexp = require('./lib/to-regexp');
+var path = require('path');
+var checkImplicit = require('./lib/check-implicit');
 
@@ -92,2 +94,27 @@ var DEFINE_VALUE = '([-_a-zA-Z0-9]+)\\s*(?:;\\s*(weak))?';
       var ranges = [];
+
+      if (root.source && root.source.input && root.source.input.file) {
+        var filename = root.source.input.file;
+        if (checkImplicit.isImplicitUtilities(config.implicitUtilities, filename)) {
+          ranges.push({
+            defined: 'utilities',
+            start: 0,
+            weakMode: false,
+          });
+        } else if (checkImplicit.isImplicitComponent(config.implicitComponents, filename)) {
+          var defined = path.basename(filename).split('.')[0]
+
+          if (defined !== UTILITIES_IDENT && !toRegexp(config.componentNamePattern).test(defined)) {
+            result.warn(
+              'Invalid component name from implicit conversion from filename ' + filename
+            );
+          }
+          ranges.push({
+            defined: defined,
+            start: 0,
+            weakMode: false,
+          });
+        }
+      }
+
       root.walkComments(function(comment) {
@@ -94,0 +121,0 @@ var commentStartLine = (comment.source) ? comment.source.start.line : null;

lib/generate-config.js

@@ -49,2 +49,7 @@ var presetPatterns = require('./preset-patterns');
 
+  var implicitComponents =
+    getImplicitDefineValue('implicitComponents', primaryOptions, secondaryOptions);
+  var implicitUtilities =
+    getImplicitDefineValue('implicitUtilities', primaryOptions, secondaryOptions);
+
   return {
@@ -54,3 +59,21 @@ patterns: patterns,
     componentNamePattern: patterns.componentName || /^[-_a-zA-Z0-9]+$/,
+    implicitComponents: implicitComponents,
+    implicitUtilities: implicitUtilities,
+  };
+}
+
+function getImplicitDefineValue(key, primaryOptions, secondaryOptions) {
+  var implicitValue = false;
+
+  if (secondaryOptions && secondaryOptions[key] !== undefined) {
+    implicitValue = secondaryOptions[key];
+  } else if (primaryOptions && primaryOptions[key]) {
+    implicitValue = primaryOptions[key]
   }
-}
+
+  if (typeof implicitValue === 'string') {
+    implicitValue = [implicitValue];
+  }
+
+  return implicitValue;
+}

lib/preset-patterns.js

@@ -5,3 +5,3 @@ module.exports = {
     componentSelectors: suitSelector,
-    utilitySelectors: /^\.u(?:-[a-z0-9][a-zA-Z0-9]*)+$/,
+    utilitySelectors: /^\.u-(sm-|md-|lg-)?(?:[a-z0-9][a-zA-Z0-9]*)+$/,
   },
@@ -8,0 +8,0 @@ bem: {

package.json

 {
   "name": "postcss-bem-linter",
-  "version": "2.6.0",
+  "version": "2.7.0",
   "description": "A BEM linter for postcss",
@@ -10,2 +10,3 @@ "files": [
   "dependencies": {
+    "minimatch": "^3.0.3",
     "postcss": "^5.0.0",
@@ -12,0 +13,0 @@ "postcss-resolve-nested-selector": "^0.1.1"

README.md

@@ -28,3 +28,3 @@ # postcss-bem-linter
 
-**Throughout this document, terms like "selector", "selector sequence", and "simple selector" are used according to the definitions in the [Selectors Level 3 spec](http://www.w3.org/TR/css3-selectors/#selector-syntax).**  
+**Throughout this document, terms like "selector", "selector sequence", and "simple selector" are used according to the definitions in the [Selectors Level 3 spec](http://www.w3.org/TR/css3-selectors/#selector-syntax).**
 
@@ -109,12 +109,16 @@ ### stylelint plugin
 - A *single function* that accepts a component name and returns a regular expression, e.g.
-  ```js
-  componentSelectors: function(componentName) {
-    return new RegExp('^\\.ns-' + componentName + '(?:-[a-zA-Z]+)?$');
-  }
-  ```
+
+```js
+componentSelectors: function(componentName) {
+  return new RegExp('^\\.ns-' + componentName + '(?:-[a-zA-Z]+)?$');
+}
+```
+
 - A *single string* that provides a valid pattern for the `RegExp()` constructor *when
   `{componentName}` is interpolated with the defined component's name*, e.g.
-  ```js
-  componentSelectors: '^\\.ns-{componentName}(?:-[a-zA-Z]+)?$'
-  ```
+
+```js
+componentSelectors: '^\\.ns-{componentName}(?:-[a-zA-Z]+)?$'
+```
+
 - An *object consisting of two properties*, `initial` and `combined`. Both properties accept the
@@ -259,9 +263,29 @@ same two forms described above: a function accepting a component name and returning a regular
 
-### Defining a component
+### Defining a component and utilities
 
-The plugin will only run if it finds special comments that
-define a named component or a group of utilities.
+The plugin will only lint the CSS if it knows the context of the CSS: is it a utility or a
+component. To define the context, use the configuration options to define it based on the filename
+(`css/components/*.css`) or use a special comment to define context for the CSS after it.
+When defining a component, the component name is needed.
 
-These definitions can be provided in two syntaxes: concise and verbose.
+#### Define components and utilities implicitly based on their filename
 
+When defining a component base on the filename, the name of the file (minus the extension) will be
+used implicitly as the component name for linting.
+The configuration option for implicit components take:
+
+- Enable it for all files: `implicitComponents: true`
+- Enable it for files that match a glob pattern: `implicitComponents: 'components/**/*.css'`
+- Enable it for files that match one of multiple glob patterns: `implicitComponents: ['components/**/*.css', 'others/**/*.css']`
+
+The CSS will implicitly be linted as utilities in files marked as such by their filename.
+The configuration option for implicit utilities take:
+
+- Enable it for files that match a glob pattern: `implicitUtilities: 'utils/*.css'`
+- Enable it for files that match one of multiple glob patterns: `implicitUtilities: ['util/*.css', 'bar/**/*.css']`
+
+#### Define components/utilities with a comment
+
+These comment definitions can be provided in two syntaxes: concise and verbose.
+
 - Concise definition syntax: `/** @define ComponentName */` or `/** @define utilities */`
@@ -315,2 +339,13 @@ - Verbose definition syntax: `/* postcss-bem-linter: define ComponentName */` or `/* postcss-bem-linter: define utilities */`.
 
+Implicit:
+
+```javascript
+bemLinter({
+  preset: 'bem',
+  implicitComponents: 'components/**/*.css',
+  implicitUtilities: 'utils/*.css'
+});
+```
+
+
 Utilities:
@@ -317,0 +352,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

New author

Supply chain risk

A new npm collaborator published a version of the package for the first time. New collaborators are usually benign additions to a project, but do indicate a change to the security surface area of a package.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

39128

increased by13.8%

Number of package files

19

increased by5.56%

Lines of code

526

increased by19.55%

Number of lines in readme file

465

increased by8.14%

Worsened metrics

Dependency count

3

increased by50%

Number of medium supply chain risk alerts

1

increased byInfinity%

Dependency changes

• + Addedminimatch@^3.0.3

• + Addedbalanced-match@1.0.2(transitive)

• + Addedbrace-expansion@1.1.11(transitive)

• + Addedconcat-map@0.0.1(transitive)

• + Addedminimatch@3.1.2(transitive)