Rev 6707 | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
import React, { useRef } from 'react'
import useOutsideClick from '../../hooks/useOutsideClick'
const ConfirmBox = ({ show, onClose, onAccept }) => {
const confirmationBoxRef = useRef()
useOutsideClick(confirmationBoxRef, () => onClose())
return (
<div
className="popover confirmation fade bs-popover-top show"
id="confirmation937427"
style={{
position: 'absolute',
top: '-2.5rem',
left: '50%',
transform: 'translate(-50%, -100%)',
width: '120px',
display: show ? 'block' : 'none',
}}
ref={confirmationBoxRef}
>
<div className="arrow" style={{ left: '46px' }}></div>
<p className="popover-header">¿Está seguro?</p>
<div className="popover-body">
<p className="confirmation-content" style={{ display: 'none' }}></p>
<div className="confirmation-buttons text-center">
<div className="btn-group">
<button
type="button"
className="h-100 d-flex align-items-center btn btn-sm btn-primary"
onClick={() => {
onAccept()
onClose()
}}
>
Si
</button>
<button
type="button"
className="h-100 d-flex align-items-center btn btn-sm btn-secondary"
onClick={() => {
onClose()
}}
>
No
</button>
</div>
</div>
</div>
</div>
)
}
export default ConfirmBox