1
import type { Adjustments } from "../types";
2
 
3
/**
4
 * Build a CSS/canvas `filter` string from color adjustments. Used for BOTH the
5
 * live preview (react-easy-crop mediaStyle) and the export (canvas ctx.filter),
6
 * so what you see matches what you get. Returns '' when everything is neutral.
7
 */
8
export function buildFilter(a: Adjustments): string {
9
  const parts: string[] = [];
10
  if (a.brightness !== 1) parts.push(`brightness(${a.brightness})`);
11
  if (a.contrast !== 1) parts.push(`contrast(${a.contrast})`);
12
  if (a.saturate !== 1) parts.push(`saturate(${a.saturate})`);
13
  if (a.grayscale) parts.push(`grayscale(${a.grayscale})`);
14
  if (a.sepia) parts.push(`sepia(${a.sepia})`);
15
  if (a.hueRotate) parts.push(`hue-rotate(${a.hueRotate}deg)`);
16
  return parts.join(" ");
17
}