"use strict";
var __importDefault = (this && this.__importDefault) || function (mod) {
    return (mod && mod.__esModule) ? mod : { "default": mod };
};
Object.defineProperty(exports, "__esModule", { value: true });
exports.ImageCenterBodyPage = exports.CenterBodyPage = exports.NoSidePaddingLayoutPage = exports.DoubleButtonLayoutPage = exports.SingleButtonOnlyLayoutPage = exports.SingleButtonWithTooltipLayoutPage = exports.SingleButtonWithUnderlyingButtonLayoutPage = void 0;
const react_1 = __importDefault(require("react"));
const _1 = __importDefault(require("."));
const components_1 = require("../../components");
/**
 * fyi.
 * type GlobalLayoutHeaderContext 기반으로 GlobalLayoutHeaderProvider 를 정의해야 BasicLayout 상하 여백이 정상 작동합니다.
 * storybook 에서는 GlobalLayoutHeaderProvider 생략하고 컴포넌트 쌓는 예시에 초점 맞췄습니다.
 */
const meta = {
    title: 'Library/BasicLayout',
    component: _1.default,
    tags: ['autodocs'],
};
exports.default = meta;
exports.SingleButtonWithUnderlyingButtonLayoutPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true },
            react_1.default.createElement(_1.default.Form, null,
                react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
                react_1.default.createElement(_1.default.SidePaddingBody, null,
                    react_1.default.createElement(components_1.BaseInput, { placeholder: "\uC774\uB984", value: 'name', onChange: () => console.log('onChange') })),
                react_1.default.createElement(_1.default.Footer, null,
                    react_1.default.createElement(_1.default.SingleButton, { purpose: "main", colorType: "pink", onClick: () => {
                            console.log('onClick');
                        }, disabled: true, underlineText: "\uBBF8\uB2C8\uBC84\uD2BC", underlineOnClick: () => {
                            console.log('underlineOnClick');
                        } }, "\uB2E4\uC74C")))))),
};
exports.SingleButtonWithTooltipLayoutPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true },
            react_1.default.createElement(_1.default.Form, null,
                react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
                react_1.default.createElement(_1.default.SidePaddingBody, null,
                    react_1.default.createElement(components_1.BaseInput, { placeholder: "\uC774\uB984", value: 'name', onChange: () => console.log('onChange') })),
                react_1.default.createElement(_1.default.Footer, null,
                    react_1.default.createElement(_1.default.SingleButtonWithTooltip, { purpose: "main", colorType: "pink", onClick: () => {
                            console.log('onClick');
                        }, disabled: true, tooltip: { placement: 'bottom-center', content: '툴팁 문구를 입력해주세요', colorType: 'gray' } }, "\uB2E4\uC74C")))))),
};
exports.SingleButtonOnlyLayoutPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true },
            react_1.default.createElement(_1.default.Form, null,
                react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
                react_1.default.createElement(_1.default.SidePaddingBody, null,
                    react_1.default.createElement(components_1.BaseInput, { placeholder: "\uC774\uB984", value: 'name', onChange: () => console.log('onChange') })),
                react_1.default.createElement(_1.default.Footer, null,
                    react_1.default.createElement(_1.default.SingleButton, { purpose: "main", colorType: "pink", onClick: () => {
                            console.log('onClick');
                        }, disabled: true }, "\uB2E4\uC74C")))))),
};
exports.DoubleButtonLayoutPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true },
            react_1.default.createElement(_1.default.Form, null,
                react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
                react_1.default.createElement(_1.default.SidePaddingBody, null,
                    react_1.default.createElement(components_1.BaseInput, { placeholder: "\uC774\uB984", value: 'name', onChange: () => console.log('onChange') })),
                react_1.default.createElement(_1.default.Footer, null,
                    react_1.default.createElement(_1.default.DoubleButton, { colorType: "pink", purpose: "main", left: {
                            children: '왼쪽',
                            onClick: () => {
                                console.log('leftOnClick');
                            },
                        }, right: {
                            children: '오른쪽',
                            onClick: () => {
                                console.log('rightOnClick');
                            },
                        } })))))),
};
exports.NoSidePaddingLayoutPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true },
            react_1.default.createElement(_1.default.Form, null,
                react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
                react_1.default.createElement(_1.default.Body, null,
                    react_1.default.createElement(components_1.BaseInput, { placeholder: "\uC774\uB984", value: 'name', onChange: () => console.log('onChange') })),
                react_1.default.createElement(_1.default.Footer, null,
                    react_1.default.createElement(_1.default.SingleButton, { purpose: "main", colorType: "pink", onClick: () => {
                            console.log('onClick');
                        }, disabled: true }, "\uB2E4\uC74C")))))),
};
exports.CenterBodyPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true, bodyCenterizing: true },
            react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
            react_1.default.createElement(_1.default.CenterBody, null, "\uC548\uB155\uD558\uC138\uC694!"),
            react_1.default.createElement(_1.default.Footer, null,
                react_1.default.createElement(_1.default.SingleButton, { purpose: "main", colorType: "pink", onClick: () => {
                        console.log('onClick');
                    }, disabled: true }, "\uB2E4\uC74C"))))),
};
exports.ImageCenterBodyPage = {
    render: () => (react_1.default.createElement(react_1.default.Fragment, null,
        react_1.default.createElement(_1.default, { hasHeader: true, hasFooter: true, bodyCenterizing: true },
            react_1.default.createElement(_1.default.Header, { title: "Title", subTitle: "SubTitle" }),
            react_1.default.createElement(_1.default.ImageCenterBody, { imageType: "pngSet", imageWidth: 300, imageHeight: 300, imagePath: `test` }),
            react_1.default.createElement(_1.default.Footer, null,
                react_1.default.createElement(_1.default.SingleButton, { purpose: "main", colorType: "pink", onClick: () => {
                        console.log('onClick');
                    }, disabled: true }, "\uB2E4\uC74C"))))),
};
