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

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

import { limiter } from ".";
import { HSL_LIMITS } from "../constants";
import { ChannelParams } from "../types";

interface QuickParamsType {
    shadeFactor: number;
    HSL_channel: number;
    HSL_letter: string;
    workingObj: ChannelParams;
  }

export default function getChannelValue({ shadeFactor, HSL_channel, HSL_letter, workingObj }: QuickParamsType): number {
    const { upperboundDivider, lowerboundDivider, upperboundPadding, lowerboundPadding } = workingObj;
  
    let HSL_letter_MAX;
  
    switch (HSL_letter) {
      case "h":
        HSL_letter_MAX = HSL_LIMITS.MAX_H;
        break;
      case "s":
        HSL_letter_MAX = HSL_LIMITS.MAX_S;
        break;
      case "l":
        HSL_letter_MAX = HSL_LIMITS.MAX_L;
        break;
      default:
        HSL_letter_MAX = 0;
        break;
    }
  
    const upperbound = HSL_letter_MAX - HSL_channel;
    const lowerbound = HSL_channel;
    const upperboundStep =
      upperboundDivider && upperboundPadding ? Math.round((upperbound / upperboundDivider) * upperboundPadding) : 0;
    const lowerboundStep =
      lowerboundDivider && lowerboundPadding ? Math.round((lowerbound / lowerboundDivider) * lowerboundPadding) : 0;
  
    if (shadeFactor > 0) HSL_channel = limiter(HSL_channel + upperboundStep * shadeFactor, `max-${HSL_letter_MAX - 5}`);
    if (shadeFactor < 0) HSL_channel = limiter(HSL_channel + lowerboundStep * shadeFactor, `min-${0 + 15}`);
  
    return HSL_channel;
  }