feat: add per-cell fit/fill toggle to collage tool

Adds objectFit property to CellTransform (cover/contain). When set to
"contain", the entire image is shown within the cell with background
color fill. Toggle button in the cell controls toolbar switches between
modes. Server-side rendering handles both modes via Sharp.
This commit is contained in:
ashim-hq
2026-04-19 16:41:35 +08:00
parent a7094f3fa4
commit bb241d6044
4 changed files with 97 additions and 26 deletions
+4 -1
View File
@@ -14,10 +14,13 @@ export interface CollageImage {
previewLoading: boolean;
}
export type ObjectFit = "cover" | "contain";
export interface CellTransform {
panX: number; // percentage -100..100
panY: number; // percentage -100..100
zoom: number; // 1.0 to 3.0
objectFit: ObjectFit;
}
interface CollageState {
@@ -76,7 +79,7 @@ interface CollageState {
reset: () => void;
}
const DEFAULT_TRANSFORM: CellTransform = { panX: 0, panY: 0, zoom: 1 };
const DEFAULT_TRANSFORM: CellTransform = { panX: 0, panY: 0, zoom: 1, objectFit: "cover" };
let nextImageId = 0;