Milestones
alex-cory opened this issue · 1 comments
alex-cory commented
- Styling the Portal directly with props
const useModal = () => {
const { isOpen, togglePortal, closePortal, Portal } = usePortal()
const Modal = useCallback(({ style, ...props }) => {
// this `isOpen` might be stale within here :/
const styles = !isOpen ? {} : {
position: 'fixed',
left: '50%',
top: '50%',
transform: 'translate(-50%,-50%)',
zIndex: 1000,
...styles
}
return <Portal {...props} style={styles} />
}, [isOpen])
return {
Modal,
toggleModal: togglePortal,
closeModal: closePortal,
isOpen
}
}
- stateless Portal
import { Portal } from 'react-useportal'
- react-native support
kunukn commented
This is my approach to create a useModal
hook using the usePortal
currently.
Demo
https://codesandbox.io/s/reactjs-usemodal-example-033fc