"use client"

import React from 'react'

export default function BuilderShell({
  left,
  center,
  right,
}: {
  left: React.ReactNode
  center: React.ReactNode
  right: React.ReactNode
}) {
  return (
    <div className="h-full w-full grid grid-cols-1 md:grid-cols-[280px_1fr_320px] gap-4 p-4" data-testid="builder-shell">
      <aside className="border rounded p-3 min-h-[200px]" aria-label="Components Panel" data-testid="panel-left">
        {left}
      </aside>
      <main className="border rounded p-3 min-h-[200px]" aria-label="Canvas" data-testid="panel-center">
        {center}
      </main>
      <aside className="border rounded p-3 min-h-[200px]" aria-label="Inspector" data-testid="panel-right">
        {right}
      </aside>
    </div>
  )
}