import type React from "react";
import { Outlet } from "react-router-dom";

import { AppMain } from "./app-main";

interface AppFullscreenLayoutFrameProps {
  children: React.ReactNode;
}

export const AppFullscreenLayoutFrame = ({ children }: AppFullscreenLayoutFrameProps) => {
  return <AppMain className="h-dvh w-dvw">{children}</AppMain>;
};

/**
 * Shell de aplicación para páginas que ocupan toda el área disponible.
 * Se utiliza en editores y vistas de detalle sin sidebar ni topbar global.
 */

export const AppFullscreenLayout = () => {
  return (
    <AppFullscreenLayoutFrame>
      <Outlet />
    </AppFullscreenLayoutFrame>
  );
};