@thangk/easythemer/src/utils/generateShades.ts

Easily generate shades from a colour palette for use in your app

import { getBoundSteps } from ".";
import { TYPE, defaultShadeFactorsSet } from "../constants";
import { HSLToHex, HexToHSL } from "../converters";
import { ShadeFactorsSet, ShadeOption } from "../types";

export default function generateShades(inputOption: ShadeOption, inputShadeFactorsSet?: ShadeFactorsSet) {
  type ShadeSet = { [key: string]: string };

  let shadeSet: ShadeSet = {};
  const { hex } = inputOption;

  const workingShadeFactorsSet = inputShadeFactorsSet ? inputShadeFactorsSet : defaultShadeFactorsSet;

  for (const [key, value] of Object.entries(workingShadeFactorsSet.shadeFactors)) {
    if (!value) {
      shadeSet[key] = hex;
      continue;
    }

    const { h: hh, s: ss, l: ll } = HexToHSL(hex);
    const { h, s, l } = getBoundSteps({ h: hh, s: ss, l: ll }, inputOption, value);
    shadeSet[key] = HSLToHex({ type: TYPE.HSL, h, s, l });
  }

  return shadeSet;
}