UNPKG

@boomerang-io/carbon-addons-boomerang-react

Version:
53 lines (50 loc) 2.81 kB
import React, { useState, useEffect } from 'react'; import { ModalHeader, ModalBody, ModalFooter, Button } from '@carbon/react'; import cx from 'classnames'; import { Modal } from '../Modal/Modal.js'; import { prefix } from '../../internal/settings.js'; /* IBM Confidential 694970X, 69497O0 © Copyright IBM Corp. 2022, 2024 */ function ConfirmModal(props) { const { affirmativeAction, affirmativeButtonProps, affirmativeText = "Yes", appElement, children, containerClassName, isExternallyControlled, label, modalHeaderProps = {}, modalProps, modalTrigger = () => void 0, negativeAction, negativeButtonProps, negativeText = "No", onCloseModal, selectorPrimaryFocus = `button[id="${prefix}--bmrg-confirm-modal-primary-button"]`, title = "Are you sure?", } = props; const [isOpen, setIsOpen] = useState(props.isOpen); useEffect(() => { setIsOpen(props.isOpen); }, [props.isOpen]); function closeModal() { if (typeof onCloseModal === "function") { onCloseModal(); } setIsOpen(false); } function handleAffirmativeAction() { if (typeof affirmativeAction === "function") { affirmativeAction(); } if (!isExternallyControlled) closeModal(); } function handleNegativeAction() { if (typeof negativeAction === "function") { negativeAction(); } if (!isExternallyControlled) closeModal(); } return (React.createElement(React.Fragment, null, modalTrigger({ openModal: () => setIsOpen(true) }), React.createElement(Modal, { appElement: appElement, containerClassName: cx(`${prefix}--bmrg-confirm-modal-container`, containerClassName), closeTimeoutMS: 240, //@ts-ignore isOpen: isOpen, onRequestClose: closeModal, shouldCloseOnOverlayClick: true, selectorPrimaryFocus: selectorPrimaryFocus, ...modalProps }, React.createElement(ModalHeader, { closeModal: closeModal, iconDescription: "Close", label: label, title: title, ...modalHeaderProps }), React.createElement("div", { id: "confirm-modal-container" }, React.createElement(ModalBody, null, React.createElement("div", { className: `${prefix}--modal-content__text` }, children))), React.createElement(ModalFooter, null, React.createElement(Button, { id: `${prefix}--bmrg-confirm-modal-secondary-button`, kind: "secondary", onClick: handleNegativeAction, ...negativeButtonProps }, negativeText), React.createElement(Button, { id: `${prefix}--bmrg-confirm-modal-primary-button`, onClick: handleAffirmativeAction, ...affirmativeButtonProps }, affirmativeText))))); } export { ConfirmModal as default };