mes-app/uni_modules/lime-color/common/generate.uts

// https://github.com/ant-design/ant-design-colors/blob/main/src/generate.ts
import { inputToRGB } from './format-input';
import { rgbToHex, rgbToHsv } from './conversion';
import { HSV, LColorInfo, LGenerateOptions} from '../utssdk/interface.uts';

type DarkColorMapItem = {
	index : number;
	opacity : number;
};
const hueStep = 2; // 色相阶梯
const saturationStep = 0.16; // 饱和度阶梯，浅色部分
const saturationStep2 = 0.05; // 饱和度阶梯，深色部分
const brightnessStep1 = 0.05; // 亮度阶梯，浅色部分
const brightnessStep2 = 0.15; // 亮度阶梯，深色部分
const lightColorCount = 5; // 浅色数量，主色上
const darkColorCount = 4; // 深色数量，主色下
// 暗色主题颜色映射关系表
const darkColorMap = [
	{ index: 7, opacity: 0.15 },
	{ index: 6, opacity: 0.25 },
	{ index: 5, opacity: 0.3 },
	{ index: 5, opacity: 0.45 },
	{ index: 5, opacity: 0.65 },
	{ index: 5, opacity: 0.85 },
	{ index: 4, opacity: 0.9 },
	{ index: 3, opacity: 0.95 },
	{ index: 2, opacity: 0.97 },
	{ index: 1, opacity: 0.98 },
] as DarkColorMapItem[];


// 从 TinyColor.toHsv 移植的包装函数
// 保留这里，因为有 `hsv.h * 360`
function toHsv({ r, g, b } : LColorInfo) : HSV {
	// 将 RGB 值转换为 HSV 值
	const hsv = rgbToHsv(r, g, b);
	// 返回一个 HsvObject，其中 h 值乘以 360
	return { h: hsv.h * 360, s: hsv.s, v: hsv.v } as HSV;
}

// 从 TinyColor.toHexString 移植的包装函数
// 保留这里，因为有前缀 `#`
function toHex({ r, g, b }: LColorInfo) : string {
	// 将 RGB 值转换为十六进制字符串，并添加前缀 `#`
	return `#${rgbToHex(r, g, b, false)}`;
}


// 从 TinyColor.mix 移植的包装函数，无法进行 tree-shaking
// 数量范围为 [0, 1]
// 假设 color1 和 color2 没有透明度，因为以下源代码也是如此
function mix(rgb1 : LColorInfo, rgb2 : LColorInfo, amount : number) : LColorInfo {
	// 将 amount 除以 100，得到一个范围为 [0, 1] 的值
	const p = amount / 100;
	// 计算混合后的 RGB 值
	const rgb = {
		r: (rgb2.r - rgb1.r) * p + rgb1.r,
		g: (rgb2.g - rgb1.g) * p + rgb1.g,
		b: (rgb2.b - rgb1.b) * p + rgb1.b,
		a: 1
	} as LColorInfo;
	// 返回混合后的 RGB 对象
	return rgb;
}

// 根据给定的 HSV 对象和索引值计算新的色相值
// 如果 light 参数为 true，则色相向左转动；否则向右转动
function getHue(hsv : HSV, i : number, light : boolean = false) : number {
	let hue : number;
	// 根据色相不同，色相转向不同
	if (Math.round(hsv.h) >= 60 && Math.round(hsv.h) <= 240) {
		// 如果色相在 60 到 240 之间，向左转动
		hue = light ? Math.round(hsv.h) - hueStep * i : Math.round(hsv.h) + hueStep * i;
	} else {
		hue = light ? Math.round(hsv.h) + hueStep * i : Math.round(hsv.h) - hueStep * i;
	}

	if (hue < 0) {
		// 如果新的色相值小于 0，则加上 360
		hue += 360;
	} else if (hue >= 360) {
		// 如果新的色相值大于等于 360，则减去 360
		hue -= 360;
	}
	return hue;
}


// 根据给定的 HSV 对象和索引值计算新的饱和度值
// 如果 light 参数为 true，则饱和度减小；否则增加
function getSaturation(hsv : HSV, i : number, light : boolean = false) : number {
	// grey color don't change saturation
	// 如果颜色是灰色（色相和饱和度都为 0），则饱和度不变
	if (hsv.h == 0 && hsv.s == 0) {
		return hsv.s;
	}
	let saturation : number;
	// 如果 light 参数为 true，则饱和度减小
	if (light) {
		saturation = hsv.s - saturationStep * i;
	}
	// 如果 i 等于 darkColorCount，则饱和度增加
	else if (i == darkColorCount) {
		saturation = hsv.s + saturationStep;
	}
	// 否则，饱和度增加
	else {
		saturation = hsv.s + saturationStep2 * i;
	}
	// 边界值修正
	if (saturation > 1) {
		saturation = 1;
	}
	// 第一格的 s 限制在 0.06-0.1 之间
	if (light && i == lightColorCount && saturation > 0.1) {
		saturation = 0.1;
	}
	if (saturation < 0.06) {
		saturation = 0.06;
	}
	return parseFloat(saturation.toFixed(2))
}

// 根据给定的 HSV 对象和索引值计算新的亮度值
// 如果 light 参数为 true，则亮度增加；否则减少
function getValue(hsv : HSV, i : number, light : boolean = false) : number {
	let value : number;
	// 如果 light 参数为 true，则亮度增加
	if (light) {
		value = hsv.v + brightnessStep1 * i;
	} else {
		value = hsv.v - brightnessStep2 * i;
	}
	if (value > 1) {
		value = 1;
	}
	// 返回保留两位小数的亮度值
	return parseFloat(value.toFixed(2));
}




/**
 * generate 函数用于生成一组基于给定颜色的色彩模式。
 * 它可以生成亮色、暗色和深色主题颜色模式。
 *
 * @param {string} color - 输入的颜色值，可以是十六进制、RGB、RGBA、HSL、HSLA或颜色名称。
 * @param {LGenerateOptions} [opts] - 可选的生成选项。
 * @returns {string[]} - 返回一个包含生成的颜色模式的字符串数组。
 */
export function generate(color : string, opts : LGenerateOptions = {} as LGenerateOptions) : string[] {
	const patterns : string[] = [];
	const pColor = inputToRGB(color);

	// 生成亮色模式
	for (let i = lightColorCount; i > 0; i -= 1) {
		const hsv = toHsv(pColor);
		const colorString : string = toHex(
			inputToRGB({
				h: getHue(hsv, i, true),
				s: getSaturation(hsv, i, true),
				v: getValue(hsv, i, true),
			}),
		);
		patterns.push(colorString);
	}

	// 添加原始颜色
	patterns.push(toHex(pColor));

	// 生成暗色模式
	for (let i = 1; i <= darkColorCount; i += 1) {
		const hsv = toHsv(pColor);
		const colorString : string = toHex(
			inputToRGB({
				h: getHue(hsv, i),
				s: getSaturation(hsv, i),
				v: getValue(hsv, i),
			}),
		);
		patterns.push(colorString);
	}

	// 如果选项中指定了 dark 主题，则生成深色主题颜色模式
	if (opts.theme == 'dark') {
		return darkColorMap.map(({ index, opacity }, _):string => {
			const darkColorString : string = toHex(
				mix(
					inputToRGB(opts.backgroundColor ?? '#141414'),
					inputToRGB(patterns[index]),
					opacity * 100,
				),
			);
			return darkColorString;
		});
	}

	// 返回默认颜色模式
	return patterns;
}