@olleemilsson/flowbite-react/lib/esm/components/Modal/ModalHeader.js

<div align="center"> <h1>:construction: flowbite-react (unreleased) :construction:</h1> <p> <a href="https://flowbite-react.com"> <img alt="Flowbite - Tailwind CSS components" width="350" src=".github/assets/flowbite-react-github.png"> <

import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
import classNames from 'classnames';
import { HiOutlineX } from 'react-icons/hi';
import { useTheme } from '../Flowbite/ThemeContext';
import { useModalContext } from './ModalContext';
export const ModalHeader = ({ children, className, ...props }) => {
    const { popup, onClose } = useModalContext();
    const theme = useTheme().theme.modal.header;
    return (_jsxs("div", { className: classNames(theme.base, {
            [theme.popup]: popup,
        }, className), ...props, children: [_jsx("h3", { className: theme.title, children: children }), _jsx("button", { "aria-label": "Close", className: theme.close.base, type: "button", onClick: onClose, children: _jsx(HiOutlineX, { "aria-hidden": true, className: theme.close.icon }) })] }));
};