import { color, complex } from "style-value-types"; import { mix } from "./mix"; import { mixColor } from "./mix-color"; import { isNum } from "./inc"; import { pipe } from "./pipe"; import { warning } from "hey-listen"; function getMixer(origin, target) { if (isNum(origin)) { return (v) => mix(origin, target, v); } else if (color.test(origin)) { return mixColor(origin, target); } else { return mixComplex(origin, target); } } export const mixArray = (from, to) => { const output = [...from]; const numValues = output.length; const blendValue = from.map((fromThis, i) => getMixer(fromThis, to[i])); return (v) => { for (let i = 0; i < numValues; i++) { output[i] = blendValue[i](v); } return output; }; }; export const mixObject = (origin, target) => { const output = Object.assign(Object.assign({}, origin), target); const blendValue = {}; for (const key in output) { if (origin[key] !== undefined && target[key] !== undefined) { blendValue[key] = getMixer(origin[key], target[key]); } } return (v) => { for (const key in blendValue) { output[key] = blendValue[key](v); } return output; }; }; function analyse(value) { const parsed = complex.parse(value); const numValues = parsed.length; let numNumbers = 0; let numRGB = 0; let numHSL = 0; for (let i = 0; i < numValues; i++) { if (numNumbers || typeof parsed[i] === "number") { numNumbers++; } else { if (parsed[i].hue !== undefined) { numHSL++; } else { numRGB++; } } } return { parsed, numNumbers, numRGB, numHSL }; } export const mixComplex = (origin, target) => { const template = complex.createTransformer(target); const originStats = analyse(origin); const targetStats = analyse(target); const canInterpolate = originStats.numHSL === targetStats.numHSL && originStats.numRGB === targetStats.numRGB && originStats.numNumbers >= targetStats.numNumbers; if (canInterpolate) { return pipe(mixArray(originStats.parsed, targetStats.parsed), template); } else { warning(true, `Complex values '${origin}' and '${target}' too different to mix. Ensure all colors are of the same type, and that each contains the same quantity of number and color values. Falling back to instant transition.`); return (p) => `${p > 0 ? target : origin}`; } }; //# sourceMappingURL=mix-complex.js.map