Image Cropper

Layout

Interactive image crop tool with drag/resize crop area and aspect ratio constraint.

Image Cropper — drag handles to define crop area

80% × 80%

Instalação via CLI

$ npx kikitocn add image-cropper

Interno:

@/lib/utils

Exemplo de uso

Image CropperExample.tsx

import { ImageCropper } from "@/components/ui/cn/image-cropper/ImageCropper";

export function ImageCropperExample() {
  return (
    <ImageCropper />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`src*`	`string`	—	URL da imagem a ser recortada
`aspect`	`number`	`undefined`	Proporção width/height obrigatória (ex: 16/9, 1)
`onCrop`	`(area: CropArea) => void`	`undefined`	Callback com área recortada: { x, y, width, height }

Voltar para Layout

Carregando…