"use client";
import { Layouts } from "../../components";
import { Footers, Headers, Sidebar } from "../../containers";
import { Toast } from "../../containers/sidebars";
import Style from "./Frame.styled";
export default function Frame(props) {
    const width = props?.side || 60;
    const align = props?.align || "left";
    const position = props?.direction === "left" ? (props?.align === "left" ? "right" : "left") : props?.align || "left";
    const side = props?.sidebar && <Sidebar {...props?.sidebar} width={width} align={position}/>;
    return (<>
            <Layouts.BG {...props?.background}/>
            <Style $direction={props?.direction}>
                {props?.header &&
            (props?.header?.type === "custom" ? (props?.header?.children) : (<Headers.Header {...props?.header} side={{ ...props?.header?.side, width: width }}/>))}
                <section>
                    {align === "left" && side}
                    <main>
                        {props?.children}
                        <Footers.Footer {...props?.footer}/>
                        {/* {props?.footer && <Footers.Footer {...props?.footer} />} */}
                    </main>
                    {align === "right" && side}
                </section>
            </Style>
            {props?.toast && props?.toast?.list && props?.toast?.list?.length > 0 && (<Toast {...props?.toast} width={width} align={position}/>)}
        </>);
}
//# sourceMappingURL=Frame.jsx.map