chore(release): publish [skip ci]

- @ohif/extension-vtk@0.52.30
 - @ohif/ui@0.59.0
 - @ohif/viewer@2.4.0

extensions/vtk/CHANGELOG.md

@@ -3,6 +3,33 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+## [0.52.30](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@0.52.29...@ohif/extension-vtk@0.52.30) (2019-11-04)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
+## [0.52.29](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@0.52.28...@ohif/extension-vtk@0.52.29) (2019-11-04)
+
+
+### Bug Fixes
+
+* 🐛 Upgrade react-vtkjs-viewport to fix volume orientation ([#1143](https://github.com/OHIF/Viewers/issues/1143)) ([1d86b1a](https://github.com/OHIF/Viewers/commit/1d86b1a102fc422053cff103de8c12ca6f437354))
+
+
+
+
+
+## [0.52.28](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@0.52.27...@ohif/extension-vtk@0.52.28) (2019-11-04)
+
+**Note:** Version bump only for package @ohif/extension-vtk
+
+
+
+
+
 ## [0.52.27](https://github.com/OHIF/Viewers/compare/@ohif/extension-vtk@0.52.26...@ohif/extension-vtk@0.52.27) (2019-10-31)
 
 **Note:** Version bump only for package @ohif/extension-vtk

extensions/vtk/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/extension-vtk",
-  "version": "0.52.27",
+  "version": "0.52.30",
   "description": "OHIF extension for VTK.js",
   "author": "OHIF",
   "license": "MIT",
@@ -49,11 +49,11 @@
   "dependencies": {
     "@babel/runtime": "^7.5.5",
     "lodash.throttle": "^4.1.1",
-    "react-vtkjs-viewport": "^0.3.7"
+    "react-vtkjs-viewport": "^0.3.9"
   },
   "devDependencies": {
     "@ohif/core": "^1.6.1",
-    "@ohif/ui": "^0.58.4",
+    "@ohif/ui": "^0.59.0",
     "cornerstone-tools": "^4.0.9",
     "cornerstone-wado-image-loader": "^3.0.0",
     "dcmjs": "^0.6.1",

platform/ui/CHANGELOG.md

@@ -3,6 +3,28 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [0.59.0](https://github.com/OHIF/Viewers/compare/@ohif/ui@0.58.5...@ohif/ui@0.59.0) (2019-11-04)
+
+
+### Features
+
+* 🎸 New modal provider ([#1110](https://github.com/OHIF/Viewers/issues/1110)) ([5ee832b](https://github.com/OHIF/Viewers/commit/5ee832b19505a4e8e5756660ce6ed03a7f18dec3)), closes [#1086](https://github.com/OHIF/Viewers/issues/1086) [#1116](https://github.com/OHIF/Viewers/issues/1116)
+
+
+
+
+
+## [0.58.5](https://github.com/OHIF/Viewers/compare/@ohif/ui@0.58.4...@ohif/ui@0.58.5) (2019-11-04)
+
+
+### Bug Fixes
+
+* 🐛 Minor issues measurement panel related to description ([#1142](https://github.com/OHIF/Viewers/issues/1142)) ([681384b](https://github.com/OHIF/Viewers/commit/681384b7425c83b02a0ed83371ca92d78ca7838c))
+
+
+
+
+
 ## [0.58.4](https://github.com/OHIF/Viewers/compare/@ohif/ui@0.58.3...@ohif/ui@0.58.4) (2019-10-31)
 
 

platform/ui/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/ui",
-  "version": "0.58.4",
+  "version": "0.59.0",
   "description": "A set of React components for Medical Imaging Viewers",
   "author": "OHIF Contributors",
   "license": "MIT",

platform/ui/src/components/index.js

@@ -16,6 +16,7 @@ import { QuickSwitch } from './quickSwitch';
 import { RoundedButtonGroup } from './roundedButtonGroup';
 import { SelectTree } from './selectTree';
 import { SimpleDialog } from './simpleDialog';
+import { OHIFModal } from './ohifModal';
 import {
   PageToolbar,
   StudyList,
@@ -52,4 +53,5 @@ export {
   AboutModal,
   UserPreferences,
   UserPreferencesModal,
+  OHIFModal,
 };

platform/ui/src/components/measurementTable/MeasurementTableItem.styl

@@ -30,6 +30,11 @@
   .measurementLocation
     margin-left: 9px;
     margin-top: 9px;
+    overflow: hidden;
+    max-width: calc(100% - 50px);
+    text-overflow: ellipsis;
+    overflow-wrap: normal;
+    white-space: nowrap;
 
   .measurementDisplayText
     display: inline-block;

platform/ui/src/components/ohifModal/OHIFModal.js

@@ -0,0 +1,60 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import ReactBootstrapModal from 'react-bootstrap-modal';
+import classNames from 'classnames';
+
+const OHIFModal = ({
+  className,
+  closeButton,
+  backdrop,
+  keyboard,
+  show,
+  title,
+  onHide,
+  footer: Footer,
+  header: Header,
+  children: Component,
+}) => (
+  <ReactBootstrapModal
+    className={classNames('modal fade themed in', className)}
+    backdrop={backdrop}
+    keyboard={keyboard}
+    show={show}
+    large={true}
+    title={title}
+    onHide={onHide}
+  >
+    {(Header || title) && (
+      <ReactBootstrapModal.Header closeButton={closeButton}>
+        {title && (
+          <ReactBootstrapModal.Title>{title}</ReactBootstrapModal.Title>
+        )}
+        {Header && <Header hide={onHide} />}
+      </ReactBootstrapModal.Header>
+    )}
+    <ReactBootstrapModal.Body>
+      {Component && <Component hide={onHide} />}
+    </ReactBootstrapModal.Body>
+    {Footer && (
+      <ReactBootstrapModal.Footer>
+        {' '}
+        <Footer hide={onHide} />
+      </ReactBootstrapModal.Footer>
+    )}
+  </ReactBootstrapModal>
+);
+
+OHIFModal.propTypes = {
+  className: PropTypes.string,
+  closeButton: PropTypes.bool,
+  backdrop: PropTypes.bool,
+  keyboard: PropTypes.bool,
+  show: PropTypes.bool,
+  title: PropTypes.string,
+  onHide: PropTypes.func,
+  footer: PropTypes.node,
+  header: PropTypes.node,
+  children: PropTypes.node,
+};
+
+export default OHIFModal;

platform/ui/src/components/ohifModal/__docs__/ohifModal.mdx

@@ -0,0 +1,39 @@
+---
+name: OHIFModal
+menu: Components
+route: /components/ohif-modal
+---
+
+import { Playground, Props } from 'docz'
+import { State } from 'react-powerplug'
+import { OHIFModal } from './../index'
+import NameSpace from '../../../__docs__/NameSpace'
+
+# OHIF Modal
+
+## Basic usage
+
+<Playground>
+  <State
+    initial={{}}
+  >
+    {({ state, setState }) => (
+      <React.Fragment>
+        <div>
+          <pre>{JSON.stringify(state, null, 2)}</pre>
+        </div>
+        <div style={{ maxWidth: '400px', margin: '0 auto' }}>
+          <OHIFModal />
+        </div>
+      </React.Fragment>
+    )}
+  </State>
+</Playground>
+
+## API
+
+<Props of={OHIFModal} />
+
+## Translation Namespace
+
+<NameSpace name="OHIFModal" />

platform/ui/src/components/ohifModal/index.js

@@ -0,0 +1,2 @@
+import OHIFModal from './OHIFModal';
+export { OHIFModal };

platform/ui/src/components/tableList/TableListItem.styl

@@ -38,6 +38,7 @@
   .itemContent
     flex: 1
     color: var(--text-secondary-color)
+    width: calc(100% - 30px);
     font-weight: 400
     margin-left: 9px;
     margin-top: 9px;

platform/ui/src/index.js

@@ -25,6 +25,7 @@ import {
   AboutModal,
   UserPreferences,
   UserPreferencesModal,
+  OHIFModal,
 } from './components';
 import { useDebounce, useMedia } from './hooks';
 
@@ -52,6 +53,11 @@ import SnackbarProvider, {
   useSnackbarContext,
   withSnackbar,
 } from './utils/SnackbarProvider';
+import ModalProvider, {
+  useModal,
+  withModal,
+  ModalConsumer,
+} from './utils/ModalProvider';
 
 export {
   // Elements
@@ -100,6 +106,11 @@ export {
   SnackbarProvider,
   useSnackbarContext,
   withSnackbar,
+  ModalProvider,
+  useModal,
+  ModalConsumer,
+  withModal,
+  OHIFModal,
   // Hooks
   useDebounce,
   useMedia,

platform/ui/src/utils/ModalProvider.js

@@ -0,0 +1,83 @@
+import React, { useState, createContext, useContext } from 'react';
+import PropTypes from 'prop-types';
+import classNames from 'classnames';
+
+const ModalContext = createContext(null);
+const { Provider, Consumer } = ModalContext;
+
+export const useModal = () => useContext(ModalContext);
+
+const ModalProvider = ({ children, modal: Modal }) => {
+  const DEFAULT_OPTIONS = {
+    component: null /* The component instance inside the modal. */,
+    backdrop: false /* Should the modal render a backdrop overlay. */,
+    keyboard: false /* Modal is dismissible via the esc key. */,
+    show: true /* Make the Modal visible or hidden. */,
+    closeButton: true /* Should the modal body render the close button. */,
+    title: null /* Should the modal render the title independently of the body content. */,
+    customClassName: null /* The custom class to style the modal. */,
+  };
+
+  const [options, setOptions] = useState(DEFAULT_OPTIONS);
+
+  /**
+   * Show the modal and override its configuration props.
+   *
+   * @returns void
+   */
+  const show = (component, props = {}) =>
+    setOptions(Object.assign({}, options, props, { component }));
+
+  /**
+   * Hide the modal and set its properties to default.
+   *
+   * @returns void
+   */
+  const hide = () => setOptions(DEFAULT_OPTIONS);
+
+  return (
+    <Provider value={{ ...options, show, hide }}>
+      <Consumer>
+        {props => {
+          const { component, footer, header, customClassName } = props;
+          return component ? (
+            <Modal
+              className={classNames(customClassName, component.className)}
+              backdrop={options.backdrop}
+              keyboard={options.keyboard}
+              show={options.show}
+              title={options.title}
+              closeButton={options.closeButton}
+              onHide={hide}
+              footer={footer}
+              header={header}
+            >
+              {component}
+            </Modal>
+          ) : null;
+        }}
+      </Consumer>
+      {children}
+    </Provider>
+  );
+};
+
+ModalProvider.propTypes = {
+  children: PropTypes.node,
+  modal: PropTypes.node,
+};
+
+/**
+ * Higher Order Component to use the modal methods through a Class Component.
+ *
+ * @returns
+ */
+export const withModal = Component => {
+  return function WrappedComponent(props) {
+    return <Component {...props} modalContext={{ ...useModal() }} />;
+  };
+};
+
+export default ModalProvider;
+
+export const ModalConsumer = ModalContext.Consumer;

platform/viewer/CHANGELOG.md

@@ -3,6 +3,36 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [2.4.0](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.3.8...@ohif/viewer@2.4.0) (2019-11-04)
+
+
+### Features
+
+* 🎸 New modal provider ([#1110](https://github.com/OHIF/Viewers/issues/1110)) ([5ee832b](https://github.com/OHIF/Viewers/commit/5ee832b19505a4e8e5756660ce6ed03a7f18dec3)), closes [#1086](https://github.com/OHIF/Viewers/issues/1086) [#1116](https://github.com/OHIF/Viewers/issues/1116)
+
+
+
+
+
+## [2.3.8](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.3.7...@ohif/viewer@2.3.8) (2019-11-04)
+
+**Note:** Version bump only for package @ohif/viewer
+
+
+
+
+
+## [2.3.7](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.3.6...@ohif/viewer@2.3.7) (2019-11-04)
+
+
+### Bug Fixes
+
+* 🐛 Minor issues measurement panel related to description ([#1142](https://github.com/OHIF/Viewers/issues/1142)) ([681384b](https://github.com/OHIF/Viewers/commit/681384b7425c83b02a0ed83371ca92d78ca7838c))
+
+
+
+
+
 ## [2.3.6](https://github.com/OHIF/Viewers/compare/@ohif/viewer@2.3.5...@ohif/viewer@2.3.6) (2019-11-02)
 
 **Note:** Version bump only for package @ohif/viewer

platform/viewer/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ohif/viewer",
-  "version": "2.3.6",
+  "version": "2.4.0",
   "description": "OHIF Viewer",
   "author": "OHIF Contributors",
   "license": "MIT",
@@ -50,9 +50,9 @@
     "@ohif/extension-dicom-html": "^1.0.1",
     "@ohif/extension-dicom-microscopy": "^0.50.6",
     "@ohif/extension-dicom-pdf": "^1.0.0",
-    "@ohif/extension-vtk": "^0.52.27",
+    "@ohif/extension-vtk": "^0.52.30",
     "@ohif/i18n": "^0.51.0",
-    "@ohif/ui": "^0.58.4",
+    "@ohif/ui": "^0.59.0",
     "@tanem/react-nprogress": "^1.1.25",
     "classnames": "^2.2.6",
     "core-js": "^3.2.1",

platform/viewer/src/App.js

@@ -28,7 +28,7 @@ import { BrowserRouter as Router } from 'react-router-dom';
 import { getActiveContexts } from './store/layout/selectors.js';
 import i18n from '@ohif/i18n';
 import store from './store';
-import { SnackbarProvider } from '@ohif/ui';
+import { SnackbarProvider, ModalProvider, OHIFModal } from '@ohif/ui';
 
 // Contexts
 import WhiteLabellingContext from './context/WhiteLabellingContext';
@@ -85,6 +85,7 @@ class App extends Component {
   }
 
   render() {
+    const { whiteLabelling, routerBasename } = this.props;
     const userManager = this._userManager;
     const config = {
       appConfig: this._appConfig,
@@ -97,12 +98,12 @@ class App extends Component {
             <I18nextProvider i18n={i18n}>
               <OidcProvider store={store} userManager={userManager}>
                 <UserManagerContext.Provider value={userManager}>
-                  <Router basename={this.props.routerBasename}>
-                    <WhiteLabellingContext.Provider
-                      value={this.props.whiteLabelling}
-                    >
+                  <Router basename={routerBasename}>
+                    <WhiteLabellingContext.Provider value={whiteLabelling}>
                       <SnackbarProvider>
-                        <OHIFStandaloneViewer userManager={userManager} />
+                        <ModalProvider modal={OHIFModal}>
+                          <OHIFStandaloneViewer userManager={userManager} />
+                        </ModalProvider>
                       </SnackbarProvider>
                     </WhiteLabellingContext.Provider>
                   </Router>
@@ -118,10 +119,12 @@ class App extends Component {
       <AppContext.Provider value={config}>
         <Provider store={store}>
           <I18nextProvider i18n={i18n}>
-            <Router basename={this.props.routerBasename}>
-              <WhiteLabellingContext.Provider value={this.props.whiteLabelling}>
+            <Router basename={routerBasename}>
+              <WhiteLabellingContext.Provider value={whiteLabelling}>
                 <SnackbarProvider>
-                  <OHIFStandaloneViewer />
+                  <ModalProvider modal={OHIFModal}>
+                    <OHIFStandaloneViewer />
+                  </ModalProvider>
                 </SnackbarProvider>
               </WhiteLabellingContext.Provider>
             </Router>

platform/viewer/src/appExtensions/MeasurementsPanel/ConnectedMeasurementTable.js

@@ -31,7 +31,7 @@ function getAllTools() {
 function getMeasurementText(measurementData = {}) {
   const defaultText = '...';
   const { location = '', description = '' } = measurementData;
-  const result = location + (description ? `(${description})` : '');
+  const result = location + (description ? ` (${description})` : '');
 
   return result || defaultText;
 }

platform/viewer/src/appExtensions/MeasurementsPanel/labelingFlowCallbacks.js

@@ -105,9 +105,9 @@ function getToolLabellingFlowCallback(store) {
       if (location) {
         measurementData.location = location;
       }
-      if (description) {
-        measurementData.description = description;
-      }
+
+      measurementData.description = description || '';
+
       if (response) {
         measurementData.response = response;
       }

platform/viewer/src/components/Labelling/LabellingFlow.js

@@ -152,6 +152,7 @@ export default class LabellingFlow extends Component {
                   ref={this.descriptionInput}
                   defaultValue={description || ''}
                   autoComplete="off"
+                  onKeyPress={this.handleKeyPress}
                 />
               </div>
             </div>
@@ -223,6 +224,12 @@ export default class LabellingFlow extends Component {
     });
   };
 
+  handleKeyPress = e => {
+    if (e.key === 'Enter') {
+      this.descriptionSave();
+    }
+  };
+
   descriptionSave = () => {
     const description = this.descriptionInput.current.value;
     this.props.updateLabelling({ description });

yarn.lock

@@ -6929,7 +6929,7 @@ direction@^1.0.1, direction@^1.0.2:
   resolved "https://registry.yarnpkg.com/direction/-/direction-1.0.3.tgz#5030e1e091e923904067d015dbaafd08f4d27d26"
   integrity sha512-8bHRqMt4w/kND19KBksE4NOJo+gIOPuiZfxQvbd6xikfKbuNBYBdLIw0hA/4lWzBaDpwpW+Olmg1BjD9+0LU2w==
 
-dnd-core@^9.3.4, dnd-core@^9.4.0:
+dnd-core@^9.4.0:
   version "9.4.0"
   resolved "https://registry.yarnpkg.com/dnd-core/-/dnd-core-9.4.0.tgz#ccf605d36887f18cdde8fd5576ca3145d2e69fa8"
   integrity sha512-Kg+8VwU8s7TgdR/BUYGUHrvFiS+5ePMZ0Q0XD7p+cFVJvgKqykBaeQDuaziuauFMPm8QxtnUy8Pncey9flXW3Q==
@@ -15920,14 +15920,14 @@ react-dev-utils@^9.0.1:
     strip-ansi "5.2.0"
     text-table "0.2.0"
 
-react-dnd-html5-backend@^9.3.4:
+react-dnd-html5-backend@^9.4.0:
   version "9.4.0"
   resolved "https://registry.yarnpkg.com/react-dnd-html5-backend/-/react-dnd-html5-backend-9.4.0.tgz#5b1d192f57d103298657cde1fe0eabdbf2726311"
   integrity sha512-gehPwLp505F6RoFkQiDX7Q4mbpbyfyT0TbIoZop/m4vkBw6yUE/QLrnxBQdNpDPSwL/9XkZxxd/PrbeMCQ+WrQ==
   dependencies:
     dnd-core "^9.4.0"
 
-react-dnd-touch-backend@^9.3.4:
+react-dnd-touch-backend@^9.4.0:
   version "9.4.0"
   resolved "https://registry.yarnpkg.com/react-dnd-touch-backend/-/react-dnd-touch-backend-9.4.0.tgz#6784e71fad0904723e33e6710caafe36c62192a4"
   integrity sha512-yJjFhgslriSTIEXQ/Q5MrLnETJaoyRct+AsJ//e96WOH2pUNMGSxkl8RIb/IMhNysVnMc8frLIyT8dQxXAcmGA==
@@ -15936,14 +15936,14 @@ react-dnd-touch-backend@^9.3.4:
     dnd-core "^9.4.0"
     invariant "^2.2.4"
 
-react-dnd@9.3.4:
-  version "9.3.4"
-  resolved "https://registry.yarnpkg.com/react-dnd/-/react-dnd-9.3.4.tgz#ebab4b5b430b72f3580c058a29298054e1f9d2b8"
-  integrity sha512-UUtyoHFRrryMxVMEGYa3EdZIdibnys/ax7ZRs6CKpETHlnJQOFhHE3rpI+ManvKS0o3MFc1DZ+aoudAFtrOvFA==
+react-dnd@9.4.0:
+  version "9.4.0"
+  resolved "https://registry.yarnpkg.com/react-dnd/-/react-dnd-9.4.0.tgz#eec87035c6360fb33a44932326b3369af011a41c"
+  integrity sha512-jnLF8qKowCKTqSddfCiLx5+sb+HxO1qgdiAgbBeL8yuo5tRYNtKxZYn7+wVwNoyZuWEuM1Gw/Wsdhr+yb2RELQ==
   dependencies:
     "@types/hoist-non-react-statics" "^3.3.1"
     "@types/shallowequal" "^1.1.1"
-    dnd-core "^9.3.4"
+    dnd-core "^9.4.0"
     hoist-non-react-statics "^3.3.0"
     shallowequal "^1.1.0"
 
@@ -16221,10 +16221,10 @@ react-transition-group@^4.1.1:
     loose-envify "^1.4.0"
     prop-types "^15.6.2"
 
-react-vtkjs-viewport@^0.3.7:
-  version "0.3.7"
-  resolved "https://registry.yarnpkg.com/react-vtkjs-viewport/-/react-vtkjs-viewport-0.3.7.tgz#a71eb09a88586b2b96c40f7e8fe2db56b693d613"
-  integrity sha512-hPaTIAJCgrdsegU96OdDRSKBDoRXbg0x72x/CCTR+6vMaXry4CnoMNMVtNJ3eCa29j6bKytiE7VkPBBEcoG+IQ==
+react-vtkjs-viewport@^0.3.9:
+  version "0.3.9"
+  resolved "https://registry.yarnpkg.com/react-vtkjs-viewport/-/react-vtkjs-viewport-0.3.9.tgz#dc3dd5323c4cbaf5978cd64af2794b6b4ed61642"
+  integrity sha512-Sc3dRRz8tRSdUrdgL8tuYwVEl0CTjaZfDLqP5ufMXH2KjwBt3T5bjpk4xvzFyPc9CG6ywEX5MSa6eQ+NNjaUkw==
   dependencies:
     date-fns "^2.2.1"
     gl-matrix "^3.1.0"