/**
 * amis-ui v6.12.0-beta.0
 * Copyright 2018-2025 fex
 */

import React__default from 'react';
import { themeable } from 'amis-core';

/**
 * @file Layout
 * @description 页面布局，支持左边栏、顶部、内容区域布局。
 * @author fex
 *
 * @param 参数说明：
 * * children 会渲染在内容区。
 * * header 头部区域
 * * aside 边栏
 * * asideClassName 边栏附加样式class
 * * footer 页脚
 * * folder 是否收起边栏
 * * asideFixed 边栏是否为固定模式，如果是会用 position:fixed 来定位.
 * * className 附件的样式名
 * * contentClassName 内容区域附加样式名称
 */
function Layout(_a) {
    var _b;
    var header = _a.header, headerClassName = _a.headerClassName, aside = _a.aside, _c = _a.asideClassName, asideClassName = _c === void 0 ? '' : _c, children = _a.children, className = _a.className, contentClassName = _a.contentClassName, folded = _a.folded, _d = _a.asideFixed, asideFixed = _d === void 0 ? true : _d, _e = _a.headerFixed, headerFixed = _e === void 0 ? true : _e, _f = _a.footer, footer = _f === void 0 ? false : _f, _g = _a.offScreen, offScreen = _g === void 0 ? false : _g, size = _a.size, boxed = _a.boxed, cx = _a.classnames, bodyClassName = _a.bodyClassName, mainClassName = _a.mainClassName;
    var body = (React__default.createElement("div", { className: cx("Layout-body", contentClassName) }, children));
    if (aside) {
        body = (React__default.createElement("div", { className: cx('Layout-content'), role: "main" }, body));
    }
    React__default.useEffect(function () {
        bodyClassName && document.body.classList.add(bodyClassName);
        return function () {
            bodyClassName && document.body.classList.remove(bodyClassName);
        };
    }, [bodyClassName]);
    return (React__default.createElement("div", { className: cx("Layout", className, (_b = {
                'Layout--boxed': boxed,
                'Layout--withAside': !!aside,
                'Layout--headerFixed': header ? headerFixed : false,
                'Layout--asideFixed': aside ? asideFixed : false,
                'Layout--folded': folded,
                'Layout--offScreen': offScreen
            },
            _b["Layout--".concat(size)] = size,
            _b['Layout--noFooter'] = !footer,
            _b['Layout--noHeader'] = !header,
            _b)) },
        header ? (React__default.createElement("div", { className: cx('Layout-header', headerClassName) }, header)) : null,
        React__default.createElement("div", { className: cx('Layout-main', mainClassName) },
            aside ? (React__default.createElement("div", { className: cx("Layout-aside", asideClassName) },
                React__default.createElement("div", { className: cx('Layout-asideWrap') },
                    React__default.createElement("div", { id: "asideInner", className: cx('Layout-asideInner') }, aside)))) : null,
            body),
        footer ? (React__default.createElement("footer", { className: cx('Layout-footer'), role: "footer" }, footer)) : null));
}
var Layout$1 = themeable(Layout);

export { Layout, Layout$1 as default };
