Updated color-utils to use TypeScript (#481)

* Ran yarn build with latest babel env

* Ran build without terser to check differences

* Added TypeScript config

* Restored terser

* Added type definitions

* Removed unused dependencies

Author: binary-koan

packages/color-utils/.eslintrc.js

@@ -2,6 +2,6 @@
 module.exports = {
     plugins: ['ghost'],
     extends: [
-        'plugin:ghost/es'
+        'plugin:ghost/ts'
     ]
 };

packages/color-utils/cjs/color-utils.js

@@ -7,54 +7,37 @@ var Color = require('color');
 function lightenToContrastThreshold(foreground, background, contrastThreshold) {
     const foregroundColor = Color(foreground);
     const backgroundColor = Color(background);
-
-    const {h,s} = foregroundColor.hsl().object();
-
+    const { h, s } = foregroundColor.hsl().object();
     let newColor = foregroundColor;
-
     while (newColor.contrast(backgroundColor) < contrastThreshold) {
         if (newColor.lightness() >= 100) {
             break;
         }
-
-        newColor = Color({h, s, l: newColor.lightness() + 5});
+        newColor = Color({ h, s, l: newColor.lightness() + 5 });
     }
-
     return newColor;
 }
-
 function darkenToContrastThreshold(foreground, background, contrastThreshold) {
     const foregroundColor = Color(foreground);
     const backgroundColor = Color(background);
-
-    const {h,s} = foregroundColor.hsl().object();
-
+    const { h, s } = foregroundColor.hsl().object();
     let newColor = foregroundColor;
-
     while (newColor.contrast(backgroundColor) < contrastThreshold) {
         if (newColor.lightness() <= 0) {
             break;
         }
-
-        newColor = Color({h, s, l: newColor.lightness() - 5});
+        newColor = Color({ h, s, l: newColor.lightness() - 5 });
     }
-
     return newColor;
 }
-
 function textColorForBackgroundColor(background) {
     const backgroundColor = Color(background);
-
-    const white = Color({r: 255, g: 255, b: 255});
-    const black = Color({r: 0, g: 0, b: 0});
-
+    const white = Color({ r: 255, g: 255, b: 255 });
+    const black = Color({ r: 0, g: 0, b: 0 });
     // shared with Portal https://github.com/TryGhost/Portal/blob/317876f20d22431df15e655ea6cc197fe636615e/src/utils/contrast-color.js#L26-L29
-    const yiq = (
-        backgroundColor.red() * 0.299 +
+    const yiq = (backgroundColor.red() * 0.299 +
         backgroundColor.green() * 0.587 +
-        backgroundColor.b() * 0.114
-    );
-
+        backgroundColor.b() * 0.114);
     return (yiq >= 186) ? black : white;
 }
 

packages/color-utils/es/color-utils.js

@@ -8,11 +8,11 @@
   "umd:main": "umd/color-utils.min.js",
   "unpkg": "umd/color-utils.min.js",
   "module": "es/color-utils.js",
-  "source": "lib/color-utils.js",
+  "source": "src/color-utils.ts",
   "scripts": {
     "dev": "echo \"Implement me!\"",
     "test": "NODE_ENV=testing mocha './test/**/*.test.js'",
-    "build": "rollup -c",
+    "build": "rollup -c && tsc --declaration --emitDeclarationOnly --declarationDir ./types",
     "lint": "eslint . --ext .js --cache",
     "prepare": "NODE_ENV=production yarn build",
     "posttest": "yarn lint"
@@ -21,25 +21,27 @@
     "LICENSE",
     "README.md",
     "cjs/",
-    "lib/",
+    "src/",
     "umd/",
     "es/"
   ],
   "publishConfig": {
     "access": "public"
   },
   "devDependencies": {
+    "@rollup/plugin-typescript": "11.1.5",
     "mocha": "10.2.0",
     "rollup": "2.79.1",
-    "rollup-plugin-babel": "4.4.0",
     "rollup-plugin-commonjs": "10.1.0",
     "rollup-plugin-node-resolve": "5.2.0",
     "rollup-plugin-replace": "2.2.0",
     "rollup-plugin-terser": "7.0.2",
     "should": "13.2.3",
-    "sinon": "17.0.0"
+    "sinon": "17.0.0",
+    "typescript": "5.2.2"
   },
   "dependencies": {
+    "@types/color": "3.0.2",
     "color": "^3.2.1"
   }
 }