Rev 5 | Autoría | Ultima modificación | Ver Log |
import React from 'react'
import { useOutsideClick } from '@hooks'
const ConfirmBox = ({ show, onClose, onAccept }) => {
const [ref] = useOutsideClick(() => 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={ref}
>
<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