Add basic eslint project with working logic

.gitignore

@@ -0,0 +1,61 @@
+# Logs
+logs
+*.log
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Runtime data
+pids
+*.pid
+*.seed
+*.pid.lock
+
+# Directory for instrumented libs generated by jscoverage/JSCover
+lib-cov
+
+# Coverage directory used by tools like istanbul
+coverage
+
+# nyc test coverage
+.nyc_output
+
+# Grunt intermediate storage (http://gruntjs.com/creating-plugins#storing-task-files)
+.grunt
+
+# Bower dependency directory (https://bower.io/)
+bower_components
+
+# node-waf configuration
+.lock-wscript
+
+# Compiled binary addons (https://nodejs.org/api/addons.html)
+build/Release
+
+# Dependency directories
+node_modules/
+jspm_packages/
+
+# TypeScript v1 declaration files
+typings/
+
+# Optional npm cache directory
+.npm
+
+# Optional eslint cache
+.eslintcache
+
+# Optional REPL history
+.node_repl_history
+
+# Output of 'npm pack'
+*.tgz
+
+# Yarn Integrity file
+.yarn-integrity
+
+# dotenv environment variables file
+.env
+
+# next.js build output
+.next

README.md

@@ -0,0 +1,51 @@
+# eslint-plugin-no-classname-with-stylename
+
+While using CSS Modules, disallow using (non-conditional / string) classNames in a JSX tag if it already has a styleName
+
+## Installation
+
+You'll first need to install [ESLint](http://eslint.org):
+
+```
+$ npm i eslint --save-dev
+```
+
+Next, install `eslint-plugin-no-classname-with-stylename`:
+
+```
+$ npm install eslint-plugin-no-classname-with-stylename --save-dev
+```
+
+**Note:** If you installed ESLint globally (using the `-g` flag) then you must also install `eslint-plugin-no-classname-with-stylename` globally.
+
+## Usage
+
+Add `no-classname-with-stylename` to the plugins section of your `.eslintrc` configuration file. You can omit the `eslint-plugin-` prefix:
+
+```json
+{
+    "plugins": [
+        "no-classname-with-stylename"
+    ]
+}
+```
+
+
+Then configure the rules you want to use under the rules section.
+
+```json
+{
+    "rules": {
+        "no-classname-with-stylename/rule-name": 2
+    }
+}
+```
+
+## Supported Rules
+
+* Fill in provided rules here
+
+
+
+
+

docs/rules/no-classname-with-stylename.md

@@ -0,0 +1,36 @@
+# Disallow string className alongwith styleName in the same JSX tag (no-classname-with-stylename)
+
+Please describe the origin of the rule here.
+
+
+## Rule Details
+
+This rule aims to...
+
+Examples of **incorrect** code for this rule:
+
+```js
+
+// fill me in
+
+```
+
+Examples of **correct** code for this rule:
+
+```js
+
+// fill me in
+
+```
+
+### Options
+
+If there are any options, describe them here. Otherwise, delete this section.
+
+## When Not To Use It
+
+Give a short description of when it would be appropriate to turn off this rule.
+
+## Further Reading
+
+If there are other links that describe the issue this rule addresses, please include them here in a bulleted list.

lib/index.js

@@ -0,0 +1,22 @@
+/**
+ * @fileoverview While using CSS Modules, disallow using (non-conditional / string) classNames in a JSX tag if it already has a styleName
+ * @author Abhas Bhattacharya
+ */
+"use strict";
+
+//------------------------------------------------------------------------------
+// Requirements
+//------------------------------------------------------------------------------
+
+var requireIndex = require("requireindex");
+
+//------------------------------------------------------------------------------
+// Plugin Definition
+//------------------------------------------------------------------------------
+
+
+// import all rules in lib/rules
+module.exports.rules = requireIndex(__dirname + "/rules");
+
+
+

lib/rules/no-classname-with-stylename.js

@@ -0,0 +1,51 @@
+/**
+ * @fileoverview Disallow string className alongwith styleName in the same JSX tag
+ * @author Abhas Bhattacharya
+ */
+"use strict";
+
+//------------------------------------------------------------------------------
+// Rule Definition
+//------------------------------------------------------------------------------
+
+const reportText = "Do not use className alongwith styleName in same JSX tag. \nstyleName should compose from the className";
+
+module.exports = {
+    meta: {
+        docs: {
+            description: "Disallow string className alongwith styleName in the same JSX tag",
+            category: "Fill me in",
+            recommended: false
+        },
+        fixable: null,  // or "code" or "whitespace"
+        schema: [
+            // fill in your schema
+        ]
+    },
+
+    create: function (context) {
+
+        // variables should be defined here
+
+        //----------------------------------------------------------------------
+        // Helpers
+        //----------------------------------------------------------------------
+
+        // any helper functions should go here or else delete this section
+
+        //----------------------------------------------------------------------
+        // Public
+        //----------------------------------------------------------------------
+
+        return {
+            "JSXOpeningElement": function (node) {
+                const hasClassNameWithoutExpr = node.attributes.some((attr) => attr.name.name === "className" && (attr.value === null || attr.value.type !== 'JSXExpressionContainer'))
+                const hasStyleName = node.attributes.some((attr) => attr.name.name === "styleName");
+
+                if (hasClassNameWithoutExpr && hasStyleName) {
+                    context.report(node, reportText);
+                }
+            }
+        };
+    }
+};

package.json

@@ -0,0 +1,26 @@
+{
+  "name": "eslint-plugin-no-classname-with-stylename",
+  "version": "0.0.0",
+  "description": "While using CSS Modules, disallow using (non-conditional / string) classNames in a JSX tag if it already has a styleName",
+  "keywords": [
+    "eslint",
+    "eslintplugin",
+    "eslint-plugin"
+  ],
+  "author": "Abhas Bhattacharya",
+  "main": "lib/index.js",
+  "scripts": {
+    "test": "mocha tests --recursive"
+  },
+  "dependencies": {
+    "requireindex": "~1.1.0"
+  },
+  "devDependencies": {
+    "eslint": "~3.9.1",
+    "mocha": "^3.1.2"
+  },
+  "engines": {
+    "node": ">=0.10.0"
+  },
+  "license": "ISC"
+}

tests/lib/rules/no-classname-with-stylename.js

@@ -0,0 +1,58 @@
+/**
+ * @fileoverview Disallow string className alongwith styleName in the same JSX tag
+ * @author Abhas Bhattacharya
+ */
+"use strict";
+
+//------------------------------------------------------------------------------
+// Requirements
+//------------------------------------------------------------------------------
+
+var rule = require("../../../lib/rules/no-classname-with-stylename"),
+
+    RuleTester = require("eslint").RuleTester;
+
+
+//------------------------------------------------------------------------------
+// Tests
+//------------------------------------------------------------------------------
+
+var ruleTester = new RuleTester({
+    parserOptions: {
+        "ecmaFeatures": {
+            "jsx": true
+        }
+    }
+});
+ruleTester.run("no-classname-with-stylename", rule, {
+
+    valid: [
+        "<span styleName='my-card' />",
+        "<span className='card' />",
+        "<span className={123} styleName='my-card' />",
+        "<span className={'card'} styleName='my-card' />",
+        "<span className={true ? 'card' : 'no-card'} styleName='my-card' />"
+        // give me some code that won't trigger a warning
+    ],
+
+    invalid: [
+        {
+            code: "<span className='card' styleName={true ? 'my-card' : 'not-my-card'} />",
+            errors: [{
+                // message: "Disallow string className alongwith styleName in the same JSX tag",
+            }]
+        },
+        {
+            code: "<span className styleName='my-card' />",
+            errors: [{
+                // message: "Disallow string className alongwith styleName in the same JSX tag",
+            }]
+        },
+        {
+            code: "<span className='card' styleName='my-card' />",
+            errors: [{
+                // message: "Disallow string className alongwith styleName in the same JSX tag",
+            }]
+        }
+    ]
+});