import { useShrink } from 'react-shrink'

function ImageUploader() {
  const { shrink, isProcessing, progress } = useShrink()

  const handleFile = async (file: File) => {
    const result = await shrink(file, {
      maxKB: 300,  // Target 300KB or less
      maxEdge: 2048 // Max 2048px width/height
    })

    // Upload compressed blob
    await uploadToServer(result.blob)
  }

  return (
    <div>
      <input type="file" accept="image/*" onChange={e => handleFile(e.target.files[0])} />
      {isProcessing && <progress value={progress} max={100} />}
    </div>
  )
}

import { shrink } from 'react-shrink'

const result = await shrink(imageFile, {
  maxKB: 500,
  codecs: ['webp', 'jpeg']
})

console.log(`Reduced from ${imageFile.size} to ${result.bytes} bytes`)

import { shrinkWithWorker } from 'react-shrink'

// Non-blocking compression - UI stays responsive
const result = await shrinkWithWorker(largeFile, { maxKB: 300 })

const result = await shrink(file, {
  maxKB: 300,           // Target max size (KB)
  maxEdge: 2048,        // Max dimension (px)
  codecs: ['webp', 'jpeg'], // Preferred formats
  quality: 0.85,        // Fixed quality or auto
  useWorker: false      // Use web worker
})

{
  blob: Blob          // Compressed image
  bytes: number       // Final size
  width: number       // Final dimensions
  height: number
  mime: string        // Output format
  diagnostics: {
    ratio: number     // Compression ratio
    timeMs: number    // Processing time
    codec: string     // Used codec
    quality: number   // Applied quality
  }
}

const result = await shrinkBatch(files, {
  maxKB: 300,
  concurrency: 3,  // Parallel operations
  onProgress: (done, total) => console.log(`${done}/${total}`)
})

console.log(`Processed: ${result.successful}/${result.total}`)

const {
  shrink,              // Compress single file
  shrinkBatch,         // Compress multiple files
  isProcessing,        // Current state
  progress,            // 0-100
  error,               // Last error
  result,              // Last result
  workerSupported,     // Worker availability
  reset                // Clear state
} = useShrink()

import { PRESET_AVATAR, PRESET_GALLERY, PRESET_SOCIAL } from 'react-shrink'

await shrink(file, PRESET_AVATAR)  // 100KB, 512px
await shrink(file, PRESET_GALLERY) // 300KB, 2048px
await shrink(file, PRESET_SOCIAL)  // 500KB, 1920px

const custom = createPreset('gallery', { maxKB: 500, codecs: ['avif', 'webp'] })

import { useShrink } from 'react-shrink'

function BatchUploader() {
  const { shrinkBatch } = useShrink()

  const handleFiles = async (files: File[]) => {
    const result = await shrinkBatch(files, {
      maxKB: 300,
      concurrency: 3,
      useWorker: true
    })

    console.log(`Saved ${result.totalBytesSaved} bytes`)
  }

  return <input type="file" multiple onChange={e => handleFiles([...e.target.files])} />
}

function ProgressExample() {
  const [progress, setProgress] = useState(0)

  const compress = async (file: File) => {
    await shrink(file, {
      maxKB: 300,
      onProgress: setProgress
    })
  }

  return <progress value={progress} max={100} />
}

import { ImageLoadError, CompressionError } from 'react-shrink'

try {
  const result = await shrink(file)
} catch (error) {
  if (error instanceof ImageLoadError) {
    alert('Invalid image file')
  } else if (error instanceof CompressionError) {
    alert('Compression failed')
  }
}

import { shrink } from 'react-shrink'

// Automatic HEIC detection and conversion
const result = await shrink(iphotoFile, { maxKB: 300 })
// Works seamlessly if heic2any is installed

import { getWorkerPool, terminateWorkerPool } from 'react-shrink'

// Access worker pool directly
const pool = await getWorkerPool(4) // 4 workers
console.log(pool.getStats())

// Cleanup when done
terminateWorkerPool()

import { canUseWorkerCompression, getOptimalWorkerCount } from 'react-shrink'

if (canUseWorkerCompression()) {
  console.log(`Workers available: ${getOptimalWorkerCount()}`)
}

import {
  calculateNewDimensions,
  hasAlphaChannel,
  isCodecSupported,
  getMimeType
} from 'react-shrink'

// Dimension calculations
const { width, height } = calculateNewDimensions(1920, 1080, 1024)

// Codec detection
const avifSupported = await isCodecSupported('avif')