var __assign = (this && this.__assign) || function () {
    __assign = Object.assign || function(t) {
        for (var s, i = 1, n = arguments.length; i < n; i++) {
            s = arguments[i];
            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
                t[p] = s[p];
        }
        return t;
    };
    return __assign.apply(this, arguments);
};
import React, { useContext, useLayoutEffect } from 'react';
import { useEmotion, useStyles } from '../../lib/renderEnvironment/index.js';
import { useGetScrollWidth } from '../../lib/dom/getScrollWidth.js';
import { Sticky } from '../Sticky/index.js';
import { ThemeContext } from '../../lib/theming/ThemeContext.js';
import { CommonWrapper } from '../../internal/CommonWrapper/index.js';
import { useResponsiveLayout } from '../ResponsiveLayout/index.js';
import { Gapped } from '../Gapped/index.js';
import { isNonNullable } from '../../lib/utils.js';
import { getStyles } from './Modal.styles.js';
import { ModalContext } from './ModalContext.js';
import { ModalSeparator } from './ModalSeparator.js';
export var ModalFooterDataTids = {
    root: 'ModalFooter__root',
};
/**
 * Футер модального окна, где обычно располагаются кнопки основных действий.
 *
 * @visibleName Modal.Footer
 */
function ModalFooter(props) {
    var theme = useContext(ThemeContext);
    var cx = useEmotion().cx;
    var styles = useStyles(getStyles);
    var modal = useContext(ModalContext);
    var layout = useResponsiveLayout();
    var scrollWidth = useGetScrollWidth();
    var _a = props.sticky, sticky = _a === void 0 ? !layout.isMobile : _a, gap = props.gap, panel = props.panel, children = props.children;
    useLayoutEffect(function () {
        var _a, _b;
        (_a = modal.setHasFooter) === null || _a === void 0 ? void 0 : _a.call(modal, true);
        (_b = modal.setHasPanel) === null || _b === void 0 ? void 0 : _b.call(modal, panel || false);
        return function () {
            var _a, _b;
            (_a = modal.setHasFooter) === null || _a === void 0 ? void 0 : _a.call(modal, false);
            (_b = modal.setHasPanel) === null || _b === void 0 ? void 0 : _b.call(modal, false);
        };
    }, [panel]);
    var renderContent = function (fixed) {
        if (fixed === void 0) { fixed = false; }
        return (React.createElement("div", null,
            (panel || fixed) && React.createElement(ModalSeparator, { fixed: fixed }),
            React.createElement("div", { "data-tid": ModalFooterDataTids.root, className: cx(styles.footer(theme), fixed && styles.fixedFooter(theme), Boolean(panel) && styles.panel(theme), fixed && Boolean(panel) && styles.fixedPanel(theme), layout.isMobile && styles.mobileFooter(theme), layout.isMobile && fixed && styles.mobileFixedFooter(theme)) }, isNonNullable(gap) ? (React.createElement(Gapped, { vertical: layout.isMobile, gap: gap }, children)) : (children))));
    };
    var getStickyOffset = function () {
        var offset = 0;
        if (modal.horizontalScroll) {
            offset += scrollWidth;
        }
        if (layout.isMobile && !modal.mobileOnFullScreen) {
            offset += parseInt(theme.mobileModalContainerMarginBottom);
        }
        return offset;
    };
    return (React.createElement(CommonWrapper, __assign({}, props), sticky ? (React.createElement(Sticky, { side: "bottom", offset: getStickyOffset() }, renderContent)) : (renderContent())));
}
ModalFooter.__KONTUR_REACT_UI__ = 'ModalFooter';
ModalFooter.displayName = 'ModalFooter';
ModalFooter.__MODAL_FOOTER__ = true;
export { ModalFooter };
//# sourceMappingURL=ModalFooter.js.map