TrizTech/ohif-viewer
15
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

modal update & close handler

Browse Source
This commit is contained in:
Rodrigo Antinarelli 2020-06-22 22:38:39 -03:00
parent c89f3682cc
commit 248639777e
4 changed files with 12 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
platform/core/src/services/UIModalService/index.js
View File

@ -33,7 +33,7 @@ const serviceImplementation = {
function _show({ function _show({
content = null, content = null,
contentProps = null, contentProps = null,
shouldCloseOnEsc = false, shouldCloseOnEsc = true,
isOpen = true, isOpen = true,
closeButton = true, closeButton = true,
title = null, title = null,

9
platform/ui/src/components/Modal/Modal.jsx
View File

@ -3,7 +3,7 @@ import PropTypes from 'prop-types';
import ReactModal from 'react-modal'; import ReactModal from 'react-modal';
import classNames from 'classnames'; import classNames from 'classnames';
import { Typography } from '@ohif/ui'; import { Typography, useModal } from '@ohif/ui';
const customStyle = { const customStyle = {
overlay: { overlay: {
@ -27,6 +27,12 @@ const Modal = ({
onClose, onClose,
children, children,
}) => { }) => {
const { hide } = useModal();
const handleClose = () => {
hide();
};
const renderHeader = () => { const renderHeader = () => {
return ( return (
title && ( title && (
@ -52,6 +58,7 @@ const Modal = ({
`relative py-6 w-11/12 lg:w-10/12 xl:w-1/2 max-h-full outline-none bg-primary-dark border border-secondary-main text-white rounded ${className}` `relative py-6 w-11/12 lg:w-10/12 xl:w-1/2 max-h-full outline-none bg-primary-dark border border-secondary-main text-white rounded ${className}`
)} )}
shouldCloseOnEsc={shouldCloseOnEsc} shouldCloseOnEsc={shouldCloseOnEsc}
onRequestClose={handleClose}
isOpen={isOpen} isOpen={isOpen}
title={title} title={title}
style={customStyle} style={customStyle}

2
platform/ui/src/contextProviders/ModalComponent.jsx
View File

@ -16,7 +16,7 @@ const ModalComponent = ({
ModalComponent.defaultProps = { ModalComponent.defaultProps = {
content: null, content: null,
contentProps: null, contentProps: null,
shouldCloseOnEsc: false, shouldCloseOnEsc: true,
isOpen: true, isOpen: true,
closeButton: true, closeButton: true,
title: null, title: null,

4
platform/ui/src/contextProviders/ModalProvider.jsx
View File

@ -19,7 +19,7 @@ export const useModal = () => useContext(ModalContext);
* @typedef {Object} ModalProps * @typedef {Object} ModalProps
* @property {ReactElement|HTMLElement} [content=null] Modal content. * @property {ReactElement|HTMLElement} [content=null] Modal content.
* @property {Object} [contentProps=null] Modal content props. * @property {Object} [contentProps=null] Modal content props.
* @property {boolean} [shouldCloseOnEsc=false] Modal is dismissible via the esc key. * @property {boolean} [shouldCloseOnEsc=true] Modal is dismissible via the esc key.
* @property {boolean} [isOpen=true] Make the Modal visible or hidden. * @property {boolean} [isOpen=true] Make the Modal visible or hidden.
* @property {boolean} [closeButton=true] Should the modal body render the close button. * @property {boolean} [closeButton=true] Should the modal body render the close button.
* @property {string} [title=null] Should the modal render the title independently of the body content. * @property {string} [title=null] Should the modal render the title independently of the body content.
@ -30,7 +30,7 @@ const ModalProvider = ({ children, modal: Modal, service }) => {
const DEFAULT_OPTIONS = { const DEFAULT_OPTIONS = {
content: null, content: null,
contentProps: null, contentProps: null,
shouldCloseOnEsc: false, shouldCloseOnEsc: true,
isOpen: true, isOpen: true,
closeButton: true, closeButton: true,
title: null, title: null,