import { AspectRatio, AspectRatioProps } from './index'

export function AspectRatioDemo({ ratio }: AspectRatioProps) {
  return (
    <div tw="w-auto">
      <AspectRatio ratio={ratio} tw="bg-slate-50 dark:bg-slate-800">
        <img
          src="https://images.unsplash.com/photo-1576075796033-848c2a5f3696?w=800&dpr=2&q=80"
          alt="test"
          tw="rounded-md object-cover w-[100%] h-[100%]"
        />
      </AspectRatio>
    </div>
  )
}
