compote-ui
Version:
An opinionated UI component library for Svelte, built on top of [Ark UI](https://ark-ui.com) with additional components and features not available in the core Ark UI library.
32 lines (31 loc) • 1.35 kB
TypeScript
/**
* Client-side image processing utilities using the Canvas API.
* These are browser-only utilities — they will throw if called during SSR.
*/
export interface ProcessImageOptions {
maxWidth?: number;
maxHeight?: number;
quality?: number;
format?: 'image/webp' | 'image/jpeg' | 'image/png';
/** Trim near-white/near-transparent edges before resizing (default: false) */
trim?: boolean;
/** 0–255 tolerance for what counts as "white" (default: 10) */
trimThreshold?: number;
}
export interface CropRegion {
x: number;
y: number;
width: number;
height: number;
}
/** Load an image element from a src URL (data URL, blob URL, or regular URL) */
export declare function loadImage(src: string): Promise<HTMLImageElement>;
/** Convert a File to a base64 data URL */
export declare function fileToDataUrl(file: File): Promise<string>;
/**
* Crop a full-resolution source image using natural pixel coordinates, then resize and convert.
* Use this instead of getCroppedImage() from Ark UI which outputs at CSS/display resolution.
*/
export declare function cropImage(src: string, crop: CropRegion, opts?: ProcessImageOptions): Promise<Blob>;
/** Resize and convert an image without cropping, returns a Blob */
export declare function processImage(src: string, opts?: ProcessImageOptions): Promise<Blob>;