"use strict";
var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    var desc = Object.getOwnPropertyDescriptor(m, k);
    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
      desc = { enumerable: true, get: function() { return m[k]; } };
    }
    Object.defineProperty(o, k2, desc);
}) : (function(o, m, k, k2) {
    if (k2 === undefined) k2 = k;
    o[k2] = m[k];
}));
var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
    Object.defineProperty(o, "default", { enumerable: true, value: v });
}) : function(o, v) {
    o["default"] = v;
});
var __importStar = (this && this.__importStar) || function (mod) {
    if (mod && mod.__esModule) return mod;
    var result = {};
    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
    __setModuleDefault(result, mod);
    return result;
};
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
const react_1 = __importStar(require("react"));
const __1 = require("../..");
const BasicForm_1 = __importDefault(require("../BasicForm"));
const Styled = __importStar(require("./index.styled"));
const Body_1 = require("./Body");
const Footer_1 = require("./Footer");
const index_type_1 = require("../GlobalLayoutHeaderProvider/index.type");
const hooks_1 = require("../../hooks");
/**  getElementByName 으로 하고 싶었으나, Title 등이 bottomSheet 에 있으면, children 있다고 하기도 애매하네, props 로 명시해야할 듯 */
const BasicLayoutComp = react_1.default.memo(({ hasHeader, hasFooter, children, bottomExtraComp, bodyCenterizing = false }) => {
    const isMobile = (0, hooks_1.useLayoutIsMobile)();
    const { hasGlobalLayoutHeaderInMobile, hasGlobalLayoutHeader } = (0, react_1.useContext)(index_type_1.GlobalLayoutHeaderContext);
    return (react_1.default.createElement(Styled.BasicLayoutBase.ParentWrapper, { hasGlobalLayoutHeader: hasGlobalLayoutHeader, bodyCenterizing: bodyCenterizing },
        react_1.default.createElement(Styled.BasicLayoutBase.ChildrenWrapper, { bodyCenterizing: bodyCenterizing },
            !hasGlobalLayoutHeaderInMobile && !hasHeader && react_1.default.createElement(Styled.MarginTopNoHeader, null),
            children,
            isMobile && Boolean(bottomExtraComp) && bottomExtraComp,
            !hasFooter && react_1.default.createElement(Styled.MarginBottomNoFooter, null)),
        !isMobile && Boolean(bottomExtraComp) && bottomExtraComp));
});
const VerticalHorizontalCenterLayoutComp = ({ children }) => {
    return (react_1.default.createElement(Styled.PureLayoutBase.ParentWrapper, null,
        react_1.default.createElement(Styled.PureLayoutBase.VerticalHorizontalCenterBody, null, children)));
};
// fyi. 원하는 컴포넌트 선택해서 끼워넣을 수 있도록
const BasicLayout = Object.assign(BasicLayoutComp, {
    /* Layout */
    // BasicLayout (itself): BasicLayoutComp
    VerticalHorizontalCenterLayout: VerticalHorizontalCenterLayoutComp,
    /* Header */
    Header: __1.Title,
    /* Body */
    Body: Styled.BasicLayoutBase.Body,
    SidePaddingBody: Styled.SidePaddingBody,
    CenterBody: Styled.CenterBody,
    ImageCenterBody: Body_1.ImageCenterBodyComp,
    /* Footer */
    Footer: Styled.BasicLayoutBase.Footer,
    SingleButton: Footer_1.SingleButtonComp,
    SingleATag: Footer_1.SingleATagComp,
    DoubleButton: Footer_1.DoubleButtonComp,
    ContentsPadding: Styled.ContentsPadding,
    ContentsVerticalPadding: Styled.ContentsVerticalPadding,
    StickBottomWrapper: Footer_1.StickBottomWrapperComp,
    SingleButtonWithTooltip: Footer_1.SingleButtonWithTooltipComp,
    SingleButtonWithInformationIcon: Footer_1.SingleButtonWithInformationIconComp,
    /* etc */
    Form: BasicForm_1.default,
});
exports.default = BasicLayout;
