refactor: migrate lqip-loader to TS, fix typing for Webpack Loaders (#5779)

packages/lqip-loader/src/utils.ts

@@ -0,0 +1,37 @@
+/**
+ * Copyright (c) Facebook, Inc. and its affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ */
+
+import {sortBy} from 'lodash';
+import type {Palette} from 'node-vibrant/lib/color';
+
+/**
+ * it returns a Base64 image string with required formatting
+ * to work on the web (<img src=".." /> or in CSS url('..'))
+ */
+const toBase64 = (extMimeType: string, data: Buffer): string => {
+  return `data:${extMimeType};base64,${data.toString('base64')}`;
+};
+
+/**
+ * takes a color swatch object, converts it to an array & returns
+ * only hex color
+ */
+const toPalette = (swatch: Palette): string[] => {
+  let palette = Object.keys(swatch).reduce((result, key) => {
+    if (swatch[key] !== null) {
+      result.push({
+        popularity: swatch[key]!.getPopulation(),
+        hex: swatch[key]!.getHex(),
+      });
+    }
+    return result;
+  }, [] as {popularity: number; hex: string}[]);
+  palette = sortBy(palette, ['popularity']);
+  return palette.map((color) => color.hex).reverse();
+};
+
+export {toBase64, toPalette};