Setup dev

.babelrc

@@ -0,0 +1,4 @@
+{
+  "presets": ["@babel/preset-env"],
+  "plugins": ["@babel/plugin-proposal-class-properties"]
+}

.eslintrc.json

@@ -0,0 +1,41 @@
+{
+  "env": {
+    "browser": true,
+    "es6": true
+  },
+  "extends": [
+    "plugin:jest/recommended",
+    "airbnb",
+    "plugin:prettier/recommended"
+  ],
+  "globals": {
+    "Atomics": "readonly",
+    "SharedArrayBuffer": "readonly"
+  },
+  "parser": "babel-eslint",
+  "parserOptions": {
+    "ecmaFeatures": {
+      "jsx": true
+    },
+    "ecmaVersion": 2018,
+    "sourceType": "module"
+  },
+  "plugins": ["prettier", "jest"],
+  "rules": {
+    "import/prefer-default-export": 0,
+    "strict": 0,
+    "prettier/prettier": [
+      "error",
+      {
+        "trailingComma": "all",
+        "singleQuote": true
+      }
+    ],
+    "jest/valid-describe": 0,
+    "jest/no-disabled-tests": "warn",
+    "jest/no-focused-tests": "error",
+    "jest/no-identical-title": "error",
+    "jest/prefer-to-have-length": "warn",
+    "jest/valid-expect": "error"
+  }
+}

.gitignore

@@ -0,0 +1,3 @@
+/node_modules
+
+/dist

.npmignore

@@ -0,0 +1,3 @@
+/src
+/.vscode
+/node_modules

package.json

@@ -0,0 +1,37 @@
+{
+  "name": "@react-theming/theme-name",
+  "version": "1.0.0",
+  "main": "dist/index.js",
+  "repository": "https://github.com/UsulPro/theme-name.git",
+  "scripts": {
+    "start": "start-storybook -p 6006 --ci",
+    "prepare": "rm -rf dist && babel src --out-dir dist --verbose",
+    "lintfix": "eslint --fix src",
+    "test": "jest",
+    "tdd": "jest --watchAll"
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.2.3",
+    "@babel/core": "^7.4.4",
+    "@babel/plugin-proposal-class-properties": "^7.4.4",
+    "@babel/preset-env": "^7.2.3",
+    "babel-eslint": "^10.0.1",
+    "babel-jest": "^24.8.0",
+    "eslint": "^5.16.0",
+    "eslint-config-airbnb": "^17.1.0",
+    "eslint-config-prettier": "^4.2.0",
+    "eslint-plugin-import": "^2.17.2",
+    "eslint-plugin-jest": "^22.5.1",
+    "eslint-plugin-jsx-a11y": "^6.2.1",
+    "eslint-plugin-prettier": "^3.1.0",
+    "eslint-plugin-react": "^7.13.0",
+    "jest": "^24.8.0",
+    "prettier": "^1.17.1"
+  },
+  "author": "Oleg Proskurin <[email protected]>",
+  "license": "MIT",
+  "dependencies": {
+    "color-name-list": "^4.7.1",
+    "nearest-color": "^0.4.4"
+  }
+}

src/__tests__/index.test.js

@@ -0,0 +1,17 @@
+import { nearest } from '../index';
+
+it('should find color names', () => {
+  const color = '#f1c1d1';
+  expect(nearest(color)).toMatchInlineSnapshot(`
+    Object {
+      "distance": 1,
+      "name": "Fairy Tale",
+      "rgb": Object {
+        "b": 209,
+        "g": 193,
+        "r": 242,
+      },
+      "value": "#f2c1d1",
+    }
+  `);
+});

src/index.js

@@ -0,0 +1,13 @@
+import nearestColor from 'nearest-color';
+import namedColors from 'color-name-list';
+
+// nearestColor need objects {name => hex} as input
+const colors = namedColors.reduce(
+  (o, { name, hex }) => Object.assign(o, { [name]: hex }),
+  {},
+);
+
+export const nearest = nearestColor.from(colors);
+
+// get closest named color
+nearest('#f1c1d1'); // => Fairy Tale