import type { ReactNode } from "react"
import { Frame, FramePanel } from "@/components/reui/frame"
import { DATA_PAGE_CARD_CLASS } from "@/components/data-grids/shared/data-grid-layout"
import { cn } from "@/lib/utils"

interface DataPageCardProps {
  children: ReactNode
  className?: string
}

/** Ops list shell — ReUI Frame, not shadcn Card. Preview: https://reui.io/docs/components/base/frame */
function DataPageCard({ children, className }: DataPageCardProps) {
  return (
    <Frame dense className={cn("w-full", className)}>
      <FramePanel className={cn(DATA_PAGE_CARD_CLASS, "p-0")}>
        {children}
      </FramePanel>
    </Frame>
  )
}

export { DataPageCard, type DataPageCardProps }