UNPKG

@kyawthihasoe/react-modalbox

Version:

A customizable React modalbox component with sorting and pagination

44 lines (43 loc) 1.28 kB
import React from 'react'; import './Modal.css'; /** * Props for the Modal component * @interface ModalProps * @property {boolean} isOpen - Controls the visibility of the modal * @property {() => void} onClose - Callback function when modal is closed * @property {string} [title] - Optional title for the modal * @property {React.ReactNode} children - Content to be displayed in the modal * @property {'small' | 'medium' | 'large'} [size='medium'] - Size of the modal */ export interface ModalProps { isOpen: boolean; onClose: () => void; title?: string; children: React.ReactNode; size?: 'small' | 'medium' | 'large'; } /** * A customizable modal component with various size options and keyboard support. * * @component * @param {ModalProps} props - The component props * @returns {React.ReactElement | null} The modal component or null if not open * * @example * ```tsx * const [isOpen, setIsOpen] = useState(false); * * return ( * <Modal * isOpen={isOpen} * onClose={() => setIsOpen(false)} * title="My Modal" * size="medium" * > * <p>This is the modal content</p> * </Modal> * ); * ``` */ declare const Modal: React.FC<ModalProps>; export default Modal;