@thangk/easythemer/src/types.ts

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

import {
  RawChannelParams,
  RawShadeOption,
  RawHSL,
  RawShadesSet,
  RawShadeFactorsSet,
  RawUseThemerProp,
} from "./interfaces";

// inspired from https://youtube.com/shorts/2lCCKiWGlC0?feature=share
type Prettify<T> = { [K in keyof T]: T[K] } & {};

export type ValidateTypes = "options" | "shades";
export type Hex = string;

/**
 * @example
 * ```
 * [
 *    {
 *       ...defaultChannelParams,
 *       channel: "h",
 *    },
 *    {
 *       ...defaultChannelParams,
 *       channel: "s",
 *    },
 *    {
 *       ...defaultChannelParams,
 *       useBounds: true,
 *       channel: "l",
 *    },
 * ]
 * ```
 */
export type ChannelParams = Prettify<RawChannelParams>;

/**
 * @example
 * ```
 * [
 *    {
 *      type: "ShadeOption",
 *      optionName: "orange",
 *      hex: "#ff670f",
 *      generateShades: true,
 *      channelParams: [
 *         {
 *            ...defaultChannelParams,
 *            channel: "h",
 *         },
 *         {
 *            ...defaultChannelParams,
 *            channel: "s",
 *         },
 *         {
 *            ...defaultChannelParams,
 *            useBounds: true,
 *            channel: "l",
 *         },
 *      ]
 *    }
 * ]
 *
 * ```
 */
export type ShadeOption = Prettify<RawShadeOption>;

/**
 * @example
 * ```
 * {
 *    h: 0,
 *    s: 100,
 *    l: 50,
 * }
 * ```
 */
export type HSL = Prettify<RawHSL>;

/**
 * @example
 * ```
 * {
 *     type: TYPE.SHADES_SET,
 *     setName: "red",
 *     shades: {
 *         "light": "hexCode",
 *         "normal": "hexCode",
 *         "dark": "hexCode"
 *     }
 * }
 * ```
 */
export type ShadesSet = Prettify<RawShadesSet>;

/**
 * @example
 * ```
 * {
 *     type: TYPE.SHADE_FACTORS_SET,
 *     setName: "red",
 *     shadeFactors: {
 *         "light": 1,
 *         "normal": 0,
 *         "dark": -1
 *     }
 * }
 * ```
 */
export type ShadeFactorsSet = Prettify<RawShadeFactorsSet>;

/**
 * @description the final complete object to be used by useThemer
 */
export type UseThemerProp = Prettify<RawUseThemerProp>;