import { splitProps, type JSX } from "solid-js";
import { cn } from "../../lib/cn";

export type PageProps = JSX.HTMLAttributes<HTMLElement>;

/** Standard constrained content area rendered inside a Page iframe. */
export function Page(props: PageProps) {
  const [local, rest] = splitProps(props, ["class", "children"]);
  return (
    <main
      {...rest}
      data-slot="page"
      class={cn("mx-auto w-full max-w-[1480px] px-4 py-5 sm:px-6 lg:px-8 lg:py-7", local.class)}
    >
      {local.children}
    </main>
  );
}