@kubit-ui-web/react-components/dist/cjs/components/modalV2/fragments/modalHeader.js

Kubit React Components is a customizable, accessible library of React web components, designed to enhance your application's user experience

"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.ModalHeader = void 0;
const jsx_runtime_1 = require("react/jsx-runtime");
const text_1 = require("../../../components/text/text");
const breakpoints_1 = require("../../../types/breakpoints/breakpoints");
const button_1 = require("../../button/button");
const elementOrIcon_1 = require("../../elementOrIcon/elementOrIcon");
const component_1 = require("../../text/types/component");
const modal_styled_1 = require("../modal.styled");
const ModalHeader = (props) => {
    const isMobileOrTablet = props.device === breakpoints_1.DeviceBreakpointsType.MOBILE || props.device === breakpoints_1.DeviceBreakpointsType.TABLET;
    return ((0, jsx_runtime_1.jsxs)(modal_styled_1.ModalHeaderStyled, { "data-modal-header": true, "$styles": props.styles, children: [isMobileOrTablet && !props.blocked && props.dragIcon && ((0, jsx_runtime_1.jsx)(modal_styled_1.DraggableIcon, { "data-modal-draggable-icon": true, "$styles": props.styles, children: (0, jsx_runtime_1.jsx)(elementOrIcon_1.ElementOrIcon, { customIconStyles: props.styles?.dragIcon, ...props.dragIcon }) })), (0, jsx_runtime_1.jsxs)(modal_styled_1.ModalHeaderContentStyled, { "$styles": props.styles, children: [!props.blocked && props.closeIcon?.icon && ((0, jsx_runtime_1.jsx)(modal_styled_1.ModalCloseButtonStyled, { "$styles": props.styles, children: (0, jsx_runtime_1.jsx)(elementOrIcon_1.ElementOrIcon, { customIconStyles: props.styles?.closeButtonIcon, ...props.closeIcon }) })), !props.blocked &&
                        props.closeButton?.content &&
                        (props.styles.closeButton?.buttonVariant || props.closeButton?.variant) && ((0, jsx_runtime_1.jsx)(button_1.Button, { variant: props.styles.closeButton?.buttonVariant, ...props.closeButton, children: props.closeButton.content })), props.title?.visible === undefined || props.title.visible ? ((0, jsx_runtime_1.jsx)(modal_styled_1.TitleContainerStyled, { "$styles": props.styles, children: (0, jsx_runtime_1.jsx)(text_1.Text, { component: component_1.TextComponentType.H1, customTypography: props.styles.title, id: props.titleIdFinal, ...props.title, children: props.title?.content }) })) : ((0, jsx_runtime_1.jsx)(modal_styled_1.TitleHiddenContainer, { id: props.titleIdFinal, children: props.title?.content }))] })] }));
};
exports.ModalHeader = ModalHeader;
//# sourceMappingURL=modalHeader.js.map