import React, { Component, } from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { SoftPortal } from '../Portal';
import { SoftScreenReaderOnly } from '../Accessibility';
import { SoftI18n } from '../I18n';
const paddingSizeToClassNameMap = {
    none: null,
    s: 'softBottomBar--paddingSmall',
    m: 'softBottomBar--paddingMedium',
    l: 'softBottomBar--paddingLarge',
};
export const PADDING_SIZES = Object.keys(paddingSizeToClassNameMap);
/**
 *
 BottomBar is a simple wrapper component that does nothing but fix a bottom bar (usually filled with buttons) to the bottom of the page. Use it when you have really long pages or complicated, multi-page forms. In the case of forms, only invoke it if a form is in a savable state.

 Like many of our other wrapper components, BottomBar accepts a paddingSize prop, which can be set to s / m / l / none.
 */
export class SoftBottomBar extends Component {
    componentDidMount() {
        const height = this.bar.clientHeight;
        document.body.style.paddingBottom = `${height}px`;
        if (this.props.bodyClassName) {
            document.body.classList.add(this.props.bodyClassName);
        }
    }
    componentWillUnmount() {
        document.body.style.paddingBottom = null;
        if (this.props.bodyClassName) {
            document.body.classList.remove(this.props.bodyClassName);
        }
    }
    render() {
        const { children, className, paddingSize, 
        // eslint-disable-next-line no-unused-vars
        bodyClassName, ...rest } = this.props;
        const classes = classNames('softBottomBar', paddingSizeToClassNameMap[paddingSize], className);
        return (React.createElement(SoftPortal, null,
            React.createElement(SoftScreenReaderOnly, null,
                React.createElement("p", { "aria-live": "assertive" },
                    React.createElement(SoftI18n, { token: "softBottomBar.screenReaderAnnouncement", default: "There is a new menu opening with page level controls at the end of the document." }))),
            React.createElement("div", Object.assign({ className: classes, ref: node => {
                    this.bar = node;
                } }, rest), children)));
    }
}
SoftBottomBar.propTypes = {
    children: PropTypes.node,
    /**
     * Optional class applied to the bar itself
     */
    className: PropTypes.string,
    /**
     * Optional class applied to the body class
     */
    bodyClassName: PropTypes.string,
    /**
     * Padding applied to the bar
     */
    paddingSize: PropTypes.oneOf(PADDING_SIZES),
};
SoftBottomBar.defaultProps = {
    paddingSize: 'm',
};
//# sourceMappingURL=SoftBottomBar.js.map