import Button from '../button';
import ConfigProvider from '../config-provider';
import React, { Component } from 'react';
import cls from 'classnames';
import { Drawer as NextDrawer } from '@alifd/next';
class Drawer extends Component {
    render() {
        const { prefix = 'next-', className, size = 'medium', fullScreen, multilevel, children, footer = false, onOk, onCancel, okProps, cancelProps, footerAlign = 'right', width, footerActions, top } = this.props;
        if (multilevel) {
            const curwidth = document.getElementsByClassName(`${prefix}drawer-previus`)[0] ? document.getElementsByClassName(`${prefix}drawer-previus`)[0].clientWidth : 0;
            let prewidth;
            if (size === 'medium') {
                prewidth = 640;
            }
            else if (size === 'small') {
                prewidth = 480;
            }
            else if (size === 'large') {
                prewidth = 800;
            }
            return (React.createElement(NextDrawer, Object.assign({ footerAlign: footerAlign }, this.props, { className: cls(className, {
                    [`${prefix}drawer-small`]: size === 'small',
                    [`${prefix}drawer-medium`]: size === 'medium',
                    [`${prefix}drawer-large`]: size === 'large',
                    [`${prefix}drawer-fullscreen`]: fullScreen,
                    [`${prefix}drawer-multilevel`]: multilevel,
                    [`${prefix}drawer-footer`]: footer,
                    [`${prefix}drawer-footer-center`]: footerAlign === 'center',
                    [`${prefix}drawer-footer-right`]: footerAlign === 'right',
                    [`${prefix}drawer-footer-left`]: footerAlign === 'left',
                    [`${prefix}drawer-footer-only-ok`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['ok'].join(''),
                    [`${prefix}drawer-footer-only-cancel`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['cancel'].join(''),
                    [`${prefix}drawer-footer-reverse`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['ok', 'cancel'].join(''),
                    [`${prefix}drawer-with-top`]: top,
                }), style: { width: this.props.width ? (Number(this.props.width) + curwidth) : (prewidth + curwidth), paddingRight: curwidth, position: 'relative', marginTop: top } }),
                React.createElement("div", { className: `${prefix}drawer-multi-child`, style: { position: 'relative', height: '100%' } },
                    " ",
                    children),
                (footer == null || footer === true) ? React.createElement("footer", { className: `${prefix}drawer-btn`, style: { paddingBottom: (footerAlign === 'right' || footerAlign === 'center') ? (top + 64) : (top + 16) } },
                    React.createElement("div", { className: `${prefix}drawer-btn-child`, style: { zIndex: 2000, right: footerAlign === 'right' ? (curwidth + 24) : undefined, left: (footerAlign === 'center' ? Number(width ? width : prewidth) / 2 : (footerAlign === 'left' ? '24px' : undefined)), transform: (footerAlign === 'center' ? '-50%' : undefined), bottom: 24 + top } },
                        React.createElement(Button, { type: "secondary", size: "large", onClick: onCancel, style: { marginRight: '8px' } }, cancelProps ? cancelProps : '取消'),
                        React.createElement(Button, { type: "primary", size: "large", onClick: onOk }, okProps ? okProps : '确认'))) : (!footer ? undefined : footer)));
        }
        return (React.createElement(NextDrawer, Object.assign({}, this.props, { style: { marginTop: top }, className: cls(className, {
                [`${prefix}drawer-small`]: size === 'small',
                [`${prefix}drawer-medium`]: size === 'medium',
                [`${prefix}drawer-large`]: size === 'large',
                [`${prefix}drawer-fullscreen`]: fullScreen,
                [`${prefix}drawer-previus`]: true,
                [`${prefix}drawer-footer`]: footer,
                [`${prefix}drawer-footer-center`]: footerAlign === 'center',
                [`${prefix}drawer-footer-right`]: footerAlign === 'right',
                [`${prefix}drawer-footer-left`]: footerAlign === 'left',
                [`${prefix}drawer-footer-only-ok`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['ok'].join(''),
                [`${prefix}drawer-footer-only-cancel`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['cancel'].join(''),
                [`${prefix}drawer-footer-reverse`]: (footerActions === null || footerActions === void 0 ? void 0 : footerActions.join('')) === ['ok', 'cancel'].join(''),
                [`${prefix}drawer-with-top`]: top,
            }) }),
            children,
            (footer == null || footer === true) ? React.createElement("footer", { className: `${prefix}drawer-btn`, style: { zIndex: 2000, paddingBottom: (footerAlign === 'right' || footerAlign === 'center') ? (top + 64) : (top + 16) } },
                React.createElement("div", { className: `${prefix}drawer-btn-child` },
                    React.createElement(Button, { type: "secondary", size: "large", onClick: onCancel, style: { marginRight: '8px' } }, cancelProps ? cancelProps : '取消'),
                    React.createElement(Button, { type: "primary", size: "large", onClick: onOk }, okProps ? okProps : '确认'))) : (!footer ? undefined : footer)));
    }
}
export default ConfigProvider.config(Drawer);
