Format using new prettier config

2023-02-25 11:33:57 -05:00
parent 69fd273367
commit b986c38a31
7 changed files with 531 additions and 527 deletions
@@ -1,11 +1,11 @@
 /** Converts a percentage scale value (0-100) to normalized scale (0-1) value. */
 export function percentageToNormalized(value: number) {
-  const normalized = value / 100;
-  return normalized;
+    const normalized = value / 100
+    return normalized
 }

 /** Converts a normalized scale (0-1) value to a percentage scale (0-100) value. */
 export function normalizedToPercetage(value: number) {
-  const percentage = value * 100;
-  return percentage;
+    const percentage = value * 100
+    return percentage
 }
@@ -1,5 +1,5 @@
-import bezier from "bezier-easing";
-import { Curve } from "../ref/curves";
+import bezier from "bezier-easing"
+import { Curve } from "../ref/curves"

 /**
 * Formats our Curve data structure into a bezier easing function.
@@ -8,14 +8,19 @@ import { Curve } from "../ref/curves";
 * @returns {EasingFunction} The formatted easing function.
 */
 export function curve(curve: Curve, inverted?: Boolean) {
-  if (inverted) {
-    return bezier(
-      curve.value[3],
-      curve.value[2],
-      curve.value[1],
-      curve.value[0]
-    );
-  }
+    if (inverted) {
+        return bezier(
+            curve.value[3],
+            curve.value[2],
+            curve.value[1],
+            curve.value[0]
+        )
+    }

-  return bezier(curve.value[0], curve.value[1], curve.value[2], curve.value[3]);
+    return bezier(
+        curve.value[0],
+        curve.value[1],
+        curve.value[2],
+        curve.value[3]
+    )
 }
@@ -1,11 +1,11 @@
-import bezier from "bezier-easing";
-import chroma from "chroma-js";
-import { Color, ColorFamily, ColorFamilyConfig, ColorScale } from "../types";
-import { percentageToNormalized } from "./convert";
-import { curve } from "./curve";
+import bezier from "bezier-easing"
+import chroma from "chroma-js"
+import { Color, ColorFamily, ColorFamilyConfig, ColorScale } from "../types"
+import { percentageToNormalized } from "./convert"
+import { curve } from "./curve"

 // Re-export interface in a more standard format
-export type EasingFunction = bezier.EasingFunction;
+export type EasingFunction = bezier.EasingFunction

 /**
 * Generates a color, outputs it in multiple formats, and returns a variety of useful metadata.
@@ -20,60 +20,60 @@ export type EasingFunction = bezier.EasingFunction;
 * @returns {Color} The generated color, with its calculated contrast against black and white, as well as its LCH values, RGBA array, hexadecimal representation, and a flag indicating if it is light or dark.
 */
 function generateColor(
-  hueEasing: EasingFunction,
-  saturationEasing: EasingFunction,
-  lightnessEasing: EasingFunction,
-  family: ColorFamilyConfig,
-  step: number,
-  steps: number
+    hueEasing: EasingFunction,
+    saturationEasing: EasingFunction,
+    lightnessEasing: EasingFunction,
+    family: ColorFamilyConfig,
+    step: number,
+    steps: number
 ) {
-  const { hue, saturation, lightness } = family.color;
+    const { hue, saturation, lightness } = family.color

-  const stepHue = hueEasing(step / steps) * (hue.end - hue.start) + hue.start;
-  const stepSaturation =
-    saturationEasing(step / steps) * (saturation.end - saturation.start) +
-    saturation.start;
-  const stepLightness =
-    lightnessEasing(step / steps) * (lightness.end - lightness.start) +
-    lightness.start;
+    const stepHue = hueEasing(step / steps) * (hue.end - hue.start) + hue.start
+    const stepSaturation =
+        saturationEasing(step / steps) * (saturation.end - saturation.start) +
+        saturation.start
+    const stepLightness =
+        lightnessEasing(step / steps) * (lightness.end - lightness.start) +
+        lightness.start

-  const color = chroma.hsl(
-    stepHue,
-    percentageToNormalized(stepSaturation),
-    percentageToNormalized(stepLightness)
-  );
+    const color = chroma.hsl(
+        stepHue,
+        percentageToNormalized(stepSaturation),
+        percentageToNormalized(stepLightness)
+    )

-  const contrast = {
-    black: {
-      value: chroma.contrast(color, "black"),
-      aaPass: chroma.contrast(color, "black") >= 4.5,
-      aaaPass: chroma.contrast(color, "black") >= 7,
-    },
-    white: {
-      value: chroma.contrast(color, "white"),
-      aaPass: chroma.contrast(color, "white") >= 4.5,
-      aaaPass: chroma.contrast(color, "white") >= 7,
-    },
-  };
+    const contrast = {
+        black: {
+            value: chroma.contrast(color, "black"),
+            aaPass: chroma.contrast(color, "black") >= 4.5,
+            aaaPass: chroma.contrast(color, "black") >= 7,
+        },
+        white: {
+            value: chroma.contrast(color, "white"),
+            aaPass: chroma.contrast(color, "white") >= 4.5,
+            aaaPass: chroma.contrast(color, "white") >= 7,
+        },
+    }

-  const lch = color.lch();
-  const rgba = color.rgba();
-  const hex = color.hex();
+    const lch = color.lch()
+    const rgba = color.rgba()
+    const hex = color.hex()

-  // 55 is a magic number. It's the lightness value at which we consider a color to be "light".
-  // It was picked by eye with some testing. We might want to use a more scientific approach in the future.
-  const isLight = lch[0] > 55;
+    // 55 is a magic number. It's the lightness value at which we consider a color to be "light".
+    // It was picked by eye with some testing. We might want to use a more scientific approach in the future.
+    const isLight = lch[0] > 55

-  const result: Color = {
-    step,
-    lch,
-    hex,
-    rgba,
-    contrast,
-    isLight,
-  };
+    const result: Color = {
+        step,
+        lch,
+        hex,
+        rgba,
+        contrast,
+        isLight,
+    }

-  return result;
+    return result
 }

 /**
@@ -110,50 +110,50 @@ function generateColor(
 */

 export function generateColorScale(
-  config: ColorFamilyConfig,
-  inverted: Boolean = false
+    config: ColorFamilyConfig,
+    inverted: Boolean = false
 ) {
-  const { hue, saturation, lightness } = config.color;
+    const { hue, saturation, lightness } = config.color

-  // 101 steps means we get values from 0-100
-  const NUM_STEPS = 101;
+    // 101 steps means we get values from 0-100
+    const NUM_STEPS = 101

-  const hueEasing = curve(hue.curve, inverted);
-  const saturationEasing = curve(saturation.curve, inverted);
-  const lightnessEasing = curve(lightness.curve, inverted);
+    const hueEasing = curve(hue.curve, inverted)
+    const saturationEasing = curve(saturation.curve, inverted)
+    const lightnessEasing = curve(lightness.curve, inverted)

-  let scale: ColorScale = {
-    colors: [],
-    values: [],
-  };
+    let scale: ColorScale = {
+        colors: [],
+        values: [],
+    }

-  for (let i = 0; i < NUM_STEPS; i++) {
-    const color = generateColor(
-      hueEasing,
-      saturationEasing,
-      lightnessEasing,
-      config,
-      i,
-      NUM_STEPS
-    );
+    for (let i = 0; i < NUM_STEPS; i++) {
+        const color = generateColor(
+            hueEasing,
+            saturationEasing,
+            lightnessEasing,
+            config,
+            i,
+            NUM_STEPS
+        )

-    scale.colors.push(color);
-    scale.values.push(color.hex);
-  }
+        scale.colors.push(color)
+        scale.values.push(color.hex)
+    }

-  return scale;
+    return scale
 }

 /** Generates a color family with a scale and an inverted scale. */
 export function generateColorFamily(config: ColorFamilyConfig) {
-  const scale = generateColorScale(config, false);
-  const invertedScale = generateColorScale(config, true);
+    const scale = generateColorScale(config, false)
+    const invertedScale = generateColorScale(config, true)

-  const family: ColorFamily = {
-    name: config.name,
-    scale,
-    invertedScale,
-  };
+    const family: ColorFamily = {
+        name: config.name,
+        scale,
+        invertedScale,
+    }

-  return family;
+    return family
 }