@gravity-ui/uikit
Version:
Gravity UI base styling and components
44 lines (43 loc) • 3.31 kB
JavaScript
'use client';
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.DialogFooter = DialogFooter;
const tslib_1 = require("tslib");
const jsx_runtime_1 = require("react/jsx-runtime");
const React = tslib_1.__importStar(require("react"));
const hooks_1 = require("../../../hooks/index.js");
const Button_1 = require("../../Button/index.js");
const Popup_1 = require("../../Popup/index.js");
const cn_1 = require("../../utils/cn.js");
const DialogPrivateContext_1 = require("../DialogPrivateContext.js");
require("./DialogFooter.css");
const b = (0, cn_1.block)('dialog-footer');
// TODO: Оно точно нужно?
function getButtonView(preset) {
switch (preset) {
case 'default':
return 'action';
case 'success':
return 'action';
case 'danger':
return 'action';
default:
return 'action';
}
}
function DialogFooter(props) {
const { onClickButtonCancel, onClickButtonApply, loading, textButtonCancel, textButtonApply, propsButtonCancel, propsButtonApply, preset = 'default', children, errorText, showError = false, renderButtons, className, } = props;
const { initialFocusRef, initialFocusAction, onTooltipEscapeKeyDown } = React.useContext(DialogPrivateContext_1.DialogPrivateContext);
const errorTooltipRef = React.useRef(null);
const apllyBtnRef = (0, hooks_1.useForkRef)(errorTooltipRef, initialFocusAction === 'apply' ? initialFocusRef : null);
const cancelBtnRef = (0, hooks_1.useForkRef)(initialFocusAction === 'cancel' ? initialFocusRef : null);
const buttonCancel = ((0, jsx_runtime_1.jsx)("div", { className: b('button', { action: 'cancel' }), children: (0, jsx_runtime_1.jsx)(Button_1.Button, { ref: cancelBtnRef, view: textButtonApply ? 'flat' : 'normal', size: "l", width: "max", onClick: onClickButtonCancel, disabled: loading, ...propsButtonCancel, children: textButtonCancel }) }));
const handleOpenChange = React.useCallback((isOpen, event, reason) => {
if (!isOpen && event && reason === 'escape-key') {
onTooltipEscapeKeyDown?.(event);
}
}, [onTooltipEscapeKeyDown]);
const buttonApply = ((0, jsx_runtime_1.jsxs)("div", { className: b('button', { action: 'apply' }), children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { ref: apllyBtnRef, type: "submit", view: getButtonView(preset), size: "l", width: "max", onClick: onClickButtonApply, loading: loading, className: b('button-apply', { preset }), ...propsButtonApply, children: textButtonApply }), errorText && ((0, jsx_runtime_1.jsx)(Popup_1.Popup, { open: showError, onOpenChange: handleOpenChange, anchorRef: errorTooltipRef, placement: "top", disablePortal: true, hasArrow: true, children: (0, jsx_runtime_1.jsx)("div", { className: b('error'), children: errorText }) }))] }));
return ((0, jsx_runtime_1.jsxs)("div", { className: b(null, className), children: [(0, jsx_runtime_1.jsx)("div", { className: b('children'), children: children }), (0, jsx_runtime_1.jsx)("div", { className: b('bts-wrapper'), children: renderButtons ? (renderButtons(buttonApply, buttonCancel)) : ((0, jsx_runtime_1.jsxs)(React.Fragment, { children: [textButtonCancel && buttonCancel, textButtonApply && buttonApply] })) })] }));
}
//# sourceMappingURL=DialogFooter.js.map