Resize Box

import { ResizeBox, ResizeHandle } from '@otfdashkit/ui/layouts-resize-box'

export function Example() {
  return (
    <div className="p-4">
      <p className="text-xs text-[hsl(var(--muted-foreground))] mb-3 font-medium uppercase tracking-wider">Drag the handle to resize</p>
      <ResizeBox
        resize="both"
        minWidth={200}
        minHeight={120}
        className="border border-[hsl(var(--border))] rounded-lg bg-[hsl(var(--card))] p-4"
        style={{ width: 320, height: 180 }}
      >
        <p className="text-sm text-[hsl(var(--muted-foreground))]">This box is resizable. Drag the bottom-right corner to resize it.</p>
        <ResizeHandle />
      </ResizeBox>
    </div>
  )
}