import { Box, type DOMElement, useInput } from "ink";
import { type ComponentPropsWithoutRef, type ForwardRefExoticComponent, forwardRef, type RefAttributes } from "react";

import { useScreenSize } from "./useScreenSize.js";

export type BoxProps = ComponentPropsWithoutRef<typeof Box>;

// Explicit type annotation to avoid TS2742 (portable type) errors caused by
// deep inferred generic types from ink's Box component pulling in transient dependencies.
export const FullScreenBox: ForwardRefExoticComponent<BoxProps & RefAttributes<DOMElement>> = forwardRef<
	DOMElement,
	BoxProps
>(function FullScreenBox(props, ref) {
	useInput(() => {}); // prevent input from rendering and shifting the layout
	const { height, width } = useScreenSize();
	return <Box ref={ref} height={height} width={width} {...props} />;
});