feat(app): modal headers and fix storybook (#3460)
This commit is contained in:
Alireza
GitHub
commit
1d38fe30a4
42
README.md
42
README.md
@ -17,16 +17,19 @@ provided by the <a href="https://ohif.org/">Open Health Imaging Foundation (OHIF
|
|||||||
<div align="center">
|
<div align="center">
|
||||||
📰 <a href="https://ohif.org/news/"><strong>Join OHIF Newsletter</strong></a> 📰
|
📰 <a href="https://ohif.org/news/"><strong>Join OHIF Newsletter</strong></a> 📰
|
||||||
</div>
|
</div>
|
||||||
|
<div align="center">
|
||||||
|
📰 <a href="https://ohif.org/news/"><strong>Join OHIF Newsletter</strong></a> 📰
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
<hr />
|
<hr />
|
||||||
|
|
||||||
[![NPM version][npm-version-image]][npm-url]
|
[![NPM version][npm-version-image]][npm-url]
|
||||||
[![NPM downloads][npm-downloads-image]][npm-url]
|
|
||||||
[![Pulls][docker-pulls-img]][docker-image-url]
|
|
||||||
[![MIT License][license-image]][license-url]
|
[![MIT License][license-image]][license-url]
|
||||||
[![This project is using Percy.io for visual regression testing.][percy-image]](percy-url)
|
[![This project is using Percy.io for visual regression testing.][percy-image]](percy-url)
|
||||||
|
<!-- [![NPM downloads][npm-downloads-image]][npm-url] -->
|
||||||
|
<!-- [![Pulls][docker-pulls-img]][docker-image-url] -->
|
||||||
<!-- [](https://app.fossa.io/projects/git%2Bgithub.com%2FOHIF%2FViewers?ref=badge_shield) -->
|
<!-- [](https://app.fossa.io/projects/git%2Bgithub.com%2FOHIF%2FViewers?ref=badge_shield) -->
|
||||||
|
|
||||||
<!-- [![Netlify Status][netlify-image]][netlify-url] -->
|
<!-- [![Netlify Status][netlify-image]][netlify-url] -->
|
||||||
@ -35,6 +38,8 @@ provided by the <a href="https://ohif.org/">Open Health Imaging Foundation (OHIF
|
|||||||
<!-- [](#contributors) -->
|
<!-- [](#contributors) -->
|
||||||
<!-- prettier-ignore-end -->
|
<!-- prettier-ignore-end -->
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
## About
|
## About
|
||||||
|
|
||||||
The OHIF Medical Imaging Viewer is for viewing medical images. It can retrieve
|
The OHIF Medical Imaging Viewer is for viewing medical images. It can retrieve
|
||||||
@ -95,6 +100,37 @@ questions; please read our
|
|||||||
|
|
||||||
## Developing
|
## Developing
|
||||||
|
|
||||||
|
### Branches
|
||||||
|
|
||||||
|
#### `master` branch - The latest dev (beta) release
|
||||||
|
|
||||||
|
- `master` - The latest dev release
|
||||||
|
|
||||||
|
This is typically where the latest development happens. Code that is in the master branch has passed code reviews and automated tests, but it may not be deemed ready for production. This branch usually contains the most recent changes and features being worked on by the development team. It's often the starting point for creating feature branches (where new features are developed) and hotfix branches (for urgent fixes).
|
||||||
|
|
||||||
|
Each package is tagged with beta version numbers, and published to npm such as `@ohif/ui@3.6.0-beta.1`
|
||||||
|
|
||||||
|
### `release` branch - The latest stable release
|
||||||
|
|
||||||
|
This branch represents the latest stable version of the project that is considered ready for production. The code in this branch should be fully tested and vetted for release. Once the code in the master branch reaches a state where it's stable and ready to be released to users,
|
||||||
|
we do a comprehensive code review and QA testing. Once the code is approved,
|
||||||
|
we merge it into the release branch and tag a new release.
|
||||||
|
|
||||||
|
Each package is tagged with version numbers, and published to npm such as `@ohif/ui@3.5.0`
|
||||||
|
|
||||||
|
Note: `master` is always ahead of `release` branch. We publish both docker builds for beta and stable releases.
|
||||||
|
|
||||||
|
Here is a schematic representation of our development workflow:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### Requirements
|
### Requirements
|
||||||
|
|
||||||
- [Yarn 1.17.3+](https://yarnpkg.com/en/docs/install)
|
- [Yarn 1.17.3+](https://yarnpkg.com/en/docs/install)
|
||||||
@ -261,7 +297,7 @@ MIT © [OHIF](https://github.com/OHIF)
|
|||||||
[npm-downloads-image]: https://img.shields.io/npm/dm/@ohif/app.svg?style=flat-square
|
[npm-downloads-image]: https://img.shields.io/npm/dm/@ohif/app.svg?style=flat-square
|
||||||
[npm-version-image]: https://img.shields.io/npm/v/@ohif/app.svg?style=flat-square
|
[npm-version-image]: https://img.shields.io/npm/v/@ohif/app.svg?style=flat-square
|
||||||
[docker-pulls-img]: https://img.shields.io/docker/pulls/ohif/viewer.svg?style=flat-square
|
[docker-pulls-img]: https://img.shields.io/docker/pulls/ohif/viewer.svg?style=flat-square
|
||||||
[docker-image-url]: https://hub.docker.com/r/ohif/viewer
|
[docker-image-url]: https://hub.docker.com/r/ohif/app
|
||||||
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
|
[license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
|
||||||
[license-url]: LICENSE
|
[license-url]: LICENSE
|
||||||
[percy-image]: https://percy.io/static/images/percy-badge.svg
|
[percy-image]: https://percy.io/static/images/percy-badge.svg
|
||||||
|
|||||||
@ -1 +1 @@
|
|||||||
16afa740b60b31037100444ef9311b80ffea2f67
|
3d8cc9801a8a0b2add8f2b57b5a8498d9f0522c4
|
||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-cornerstone-dicom-rt",
|
"name": "@ohif/extension-cornerstone-dicom-rt",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "DICOM RT read workflow",
|
"description": "DICOM RT read workflow",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -31,44 +31,19 @@
|
|||||||
"start": "yarn run dev"
|
"start": "yarn run dev"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/i18n": "3.5.0",
|
"@ohif/i18n": "3.6.0-beta.3",
|
||||||
"prop-types": "^15.6.2",
|
"prop-types": "^15.6.2",
|
||||||
"react": "^17.0.2",
|
"react": "^17.0.2",
|
||||||
"react-dom": "^17.0.2",
|
"react-dom": "^17.0.2",
|
||||||
"react-i18next": "^10.11.0",
|
"react-i18next": "^10.11.0",
|
||||||
"react-router": "^6.3.0",
|
"react-router": "^6.3.0",
|
||||||
"react-router-dom": "^6.3.0",
|
"react-router-dom": "^6.3.0"
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13",
|
"@babel/runtime": "^7.20.13",
|
||||||
"react-color": "^2.19.3"
|
"react-color": "^2.19.3"
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@babel/core": "^7.21.4",
|
|
||||||
"@babel/plugin-proposal-class-properties": "^7.5.0",
|
|
||||||
"@babel/plugin-proposal-object-rest-spread": "^7.5.5",
|
|
||||||
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
|
|
||||||
"@babel/plugin-transform-arrow-functions": "^7.2.0",
|
|
||||||
"@babel/plugin-transform-regenerator": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.17.0",
|
|
||||||
"@babel/preset-env": "^7.5.0",
|
|
||||||
"@babel/preset-react": "^7.16.7",
|
|
||||||
"babel-eslint": "^8.0.3",
|
|
||||||
"babel-loader": "^8.0.0-beta.4",
|
|
||||||
"babel-plugin-inline-react-svg": "^2.0.1",
|
|
||||||
"clean-webpack-plugin": "^4.0.0",
|
|
||||||
"copy-webpack-plugin": "^10.2.0",
|
|
||||||
"cross-env": "^7.0.3",
|
|
||||||
"dotenv": "^14.1.0",
|
|
||||||
"eslint": "^5.0.1",
|
|
||||||
"eslint-loader": "^2.0.0",
|
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-cli": "^4.7.2",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-cornerstone-dicom-seg",
|
"name": "@ohif/extension-cornerstone-dicom-seg",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "DICOM SEG read workflow",
|
"description": "DICOM SEG read workflow",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -31,44 +31,19 @@
|
|||||||
"start": "yarn run dev"
|
"start": "yarn run dev"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/i18n": "3.5.0",
|
"@ohif/i18n": "3.6.0-beta.3",
|
||||||
"prop-types": "^15.6.2",
|
"prop-types": "^15.6.2",
|
||||||
"react": "^17.0.2",
|
"react": "^17.0.2",
|
||||||
"react-dom": "^17.0.2",
|
"react-dom": "^17.0.2",
|
||||||
"react-i18next": "^12.2.2",
|
"react-i18next": "^12.2.2",
|
||||||
"react-router": "^6.8.1",
|
"react-router": "^6.8.1",
|
||||||
"react-router-dom": "^6.8.1",
|
"react-router-dom": "^6.8.1"
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13",
|
"@babel/runtime": "^7.20.13",
|
||||||
"react-color": "^2.19.3"
|
"react-color": "^2.19.3"
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@babel/core": "^7.21.4",
|
|
||||||
"@babel/plugin-proposal-class-properties": "^7.5.0",
|
|
||||||
"@babel/plugin-proposal-object-rest-spread": "^7.5.5",
|
|
||||||
"@babel/plugin-syntax-dynamic-import": "^7.2.0",
|
|
||||||
"@babel/plugin-transform-arrow-functions": "^7.2.0",
|
|
||||||
"@babel/plugin-transform-regenerator": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.17.0",
|
|
||||||
"@babel/preset-env": "^7.5.0",
|
|
||||||
"@babel/preset-react": "^7.16.7",
|
|
||||||
"babel-eslint": "^8.0.3",
|
|
||||||
"babel-loader": "^8.0.0-beta.4",
|
|
||||||
"babel-plugin-inline-react-svg": "^2.0.1",
|
|
||||||
"clean-webpack-plugin": "^4.0.0",
|
|
||||||
"copy-webpack-plugin": "^11.0.0",
|
|
||||||
"cross-env": "^7.0.3",
|
|
||||||
"dotenv": "^14.1.0",
|
|
||||||
"eslint": "^5.0.1",
|
|
||||||
"eslint-loader": "^2.0.0",
|
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-cli": "^4.7.2",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -24,7 +24,7 @@ function callInputDialog(uiDialogService, label, callback) {
|
|||||||
showOverlay: true,
|
showOverlay: true,
|
||||||
content: Dialog,
|
content: Dialog,
|
||||||
contentProps: {
|
contentProps: {
|
||||||
title: 'Enter Segment Label',
|
title: 'Segment',
|
||||||
value: { label },
|
value: { label },
|
||||||
noCloseButton: true,
|
noCloseButton: true,
|
||||||
onClose: () => uiDialogService.dismiss({ id: dialogId }),
|
onClose: () => uiDialogService.dismiss({ id: dialogId }),
|
||||||
@ -35,24 +35,23 @@ function callInputDialog(uiDialogService, label, callback) {
|
|||||||
onSubmit: onSubmitHandler,
|
onSubmit: onSubmitHandler,
|
||||||
body: ({ value, setValue }) => {
|
body: ({ value, setValue }) => {
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<Input
|
||||||
<Input
|
label="Enter the segment label"
|
||||||
autoFocus
|
labelClassName="text-white text-[14px] leading-[1.2]"
|
||||||
className="mt-2 bg-black border-primary-main"
|
autoFocus
|
||||||
type="text"
|
className="bg-black border-primary-main"
|
||||||
containerClassName="mr-2"
|
type="text"
|
||||||
value={value.label}
|
value={value.label}
|
||||||
onChange={event => {
|
onChange={event => {
|
||||||
event.persist();
|
event.persist();
|
||||||
setValue(value => ({ ...value, label: event.target.value }));
|
setValue(value => ({ ...value, label: event.target.value }));
|
||||||
}}
|
}}
|
||||||
onKeyPress={event => {
|
onKeyPress={event => {
|
||||||
if (event.key === 'Enter') {
|
if (event.key === 'Enter') {
|
||||||
onSubmitHandler({ value, action: { id: 'save' } });
|
onSubmitHandler({ value, action: { id: 'save' } });
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-cornerstone-dicom-sr",
|
"name": "@ohif/extension-cornerstone-dicom-sr",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for an SR Cornerstone Viewport",
|
"description": "OHIF extension for an SR Cornerstone Viewport",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -32,10 +32,10 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-measurement-tracking": "3.5.0",
|
"@ohif/extension-measurement-tracking": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"dicom-parser": "^1.8.9",
|
"dicom-parser": "^1.8.9",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-cornerstone",
|
"name": "@ohif/extension-cornerstone",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for Cornerstone",
|
"description": "OHIF extension for Cornerstone",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -37,8 +37,8 @@
|
|||||||
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
||||||
"@cornerstonejs/codec-openjph": "^2.4.2",
|
"@cornerstonejs/codec-openjph": "^2.4.2",
|
||||||
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.6",
|
"dcmjs": "^0.29.6",
|
||||||
"dicom-parser": "^1.8.21",
|
"dicom-parser": "^1.8.21",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -97,7 +97,7 @@ const DicomUploadProgressItem = memo(
|
|||||||
)}
|
)}
|
||||||
<div className="flex cursor-pointer ml-auto">
|
<div className="flex cursor-pointer ml-auto">
|
||||||
<Icon
|
<Icon
|
||||||
className="w-6 h-6 self-center text-primary-active"
|
className="self-center text-primary-active"
|
||||||
name="close"
|
name="close"
|
||||||
onClick={cancelUpload}
|
onClick={cancelUpload}
|
||||||
/>
|
/>
|
||||||
|
|||||||
@ -117,7 +117,7 @@ class SegmentationService extends PubSubService {
|
|||||||
* -- opacity: the opacity of the segment
|
* -- opacity: the opacity of the segment
|
||||||
* -- visibility: the visibility of the segment (boolean)
|
* -- visibility: the visibility of the segment (boolean)
|
||||||
* -- isLocked: whether the segment is locked for editing
|
* -- isLocked: whether the segment is locked for editing
|
||||||
* -- active: whether the segment is currently the active segment to be edited
|
* -- active: whether the segment is currently the active segment to be edited or not
|
||||||
*/
|
*/
|
||||||
public addSegment(
|
public addSegment(
|
||||||
segmentationId: string,
|
segmentationId: string,
|
||||||
|
|||||||
@ -27,8 +27,8 @@ function callInputDialog(
|
|||||||
: data.label
|
: data.label
|
||||||
: '';
|
: '';
|
||||||
const {
|
const {
|
||||||
dialogTitle = 'Enter your annotation',
|
dialogTitle = 'Annotation',
|
||||||
inputLabel = '',
|
inputLabel = 'Enter your annotation',
|
||||||
validateFunc = value => true,
|
validateFunc = value => true,
|
||||||
} = dialogConfig;
|
} = dialogConfig;
|
||||||
|
|
||||||
@ -66,27 +66,24 @@ function callInputDialog(
|
|||||||
onSubmit: onSubmitHandler,
|
onSubmit: onSubmitHandler,
|
||||||
body: ({ value, setValue }) => {
|
body: ({ value, setValue }) => {
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<Input
|
||||||
<Input
|
autoFocus
|
||||||
autoFocus
|
className="bg-black border-primary-main"
|
||||||
className="mt-2 bg-black border-primary-main"
|
type="text"
|
||||||
type="text"
|
id="annotation"
|
||||||
id="annotation"
|
label={inputLabel}
|
||||||
containerClassName="mr-2"
|
labelClassName="text-white text-[14px] leading-[1.2]"
|
||||||
label={inputLabel}
|
value={value.label}
|
||||||
labelClassName="text-primary-light"
|
onChange={event => {
|
||||||
value={value.label}
|
event.persist();
|
||||||
onChange={event => {
|
setValue(value => ({ ...value, label: event.target.value }));
|
||||||
event.persist();
|
}}
|
||||||
setValue(value => ({ ...value, label: event.target.value }));
|
onKeyPress={event => {
|
||||||
}}
|
if (event.key === 'Enter') {
|
||||||
onKeyPress={event => {
|
onSubmitHandler({ value, action: { id: 'save' } });
|
||||||
if (event.key === 'Enter') {
|
}
|
||||||
onSubmitHandler({ value, action: { id: 'save' } });
|
}}
|
||||||
}
|
/>
|
||||||
}}
|
|
||||||
/>
|
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-default",
|
"name": "@ohif/extension-default",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Common/default features and functionality for basic image viewing",
|
"description": "Common/default features and functionality for basic image viewing",
|
||||||
"author": "OHIF Core Team",
|
"author": "OHIF Core Team",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -30,8 +30,8 @@
|
|||||||
"start": "yarn run dev"
|
"start": "yarn run dev"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/i18n": "3.5.0",
|
"@ohif/i18n": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"dicomweb-client": "^0.10.2",
|
"dicomweb-client": "^0.10.2",
|
||||||
"prop-types": "^15.6.2",
|
"prop-types": "^15.6.2",
|
||||||
|
|||||||
@ -160,7 +160,7 @@ export default function PanelMeasurementTable({
|
|||||||
showOverlay: true,
|
showOverlay: true,
|
||||||
content: Dialog,
|
content: Dialog,
|
||||||
contentProps: {
|
contentProps: {
|
||||||
title: 'Enter your annotation',
|
title: 'Annotation',
|
||||||
noCloseButton: true,
|
noCloseButton: true,
|
||||||
value: { label: measurement.label || '' },
|
value: { label: measurement.label || '' },
|
||||||
body: ({ value, setValue }) => {
|
body: ({ value, setValue }) => {
|
||||||
@ -175,18 +175,17 @@ export default function PanelMeasurementTable({
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<Input
|
||||||
<Input
|
label="Enter your annotation"
|
||||||
autoFocus
|
labelClassName="text-white text-[14px] leading-[1.2]"
|
||||||
id="annotation"
|
autoFocus
|
||||||
className="mt-2 bg-black border-primary-main"
|
id="annotation"
|
||||||
type="text"
|
className="bg-black border-primary-main"
|
||||||
containerClassName="mr-2"
|
type="text"
|
||||||
value={value.label}
|
value={value.label}
|
||||||
onChange={onChangeHandler}
|
onChange={onChangeHandler}
|
||||||
onKeyPress={onKeyPressHandler}
|
onKeyPress={onKeyPressHandler}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
actions: [
|
actions: [
|
||||||
|
|||||||
@ -11,7 +11,7 @@ export default function createReportDialogPrompt(
|
|||||||
uiDialogService,
|
uiDialogService,
|
||||||
{ extensionManager }
|
{ extensionManager }
|
||||||
) {
|
) {
|
||||||
return new Promise(function (resolve, reject) {
|
return new Promise(function(resolve, reject) {
|
||||||
let dialogId = undefined;
|
let dialogId = undefined;
|
||||||
|
|
||||||
const _handleClose = () => {
|
const _handleClose = () => {
|
||||||
@ -73,7 +73,7 @@ export default function createReportDialogPrompt(
|
|||||||
useLastPosition: false,
|
useLastPosition: false,
|
||||||
showOverlay: true,
|
showOverlay: true,
|
||||||
contentProps: {
|
contentProps: {
|
||||||
title: 'Provide a name for your report',
|
title: 'Create Report',
|
||||||
value: {
|
value: {
|
||||||
label: '',
|
label: '',
|
||||||
dataSourceName: extensionManager.activeDataSource,
|
dataSourceName: extensionManager.activeDataSource,
|
||||||
@ -102,38 +102,34 @@ export default function createReportDialogPrompt(
|
|||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<div className="p-4 bg-primary-dark">
|
{dataSourcesOpts.length > 1 && (
|
||||||
{dataSourcesOpts.length > 1 && (
|
<Select
|
||||||
<Select
|
closeMenuOnSelect={true}
|
||||||
closeMenuOnSelect={true}
|
className="mr-2 bg-black border-primary-main"
|
||||||
className="mr-2 bg-black border-primary-main"
|
options={dataSourcesOpts}
|
||||||
options={dataSourcesOpts}
|
placeholder={
|
||||||
placeholder={
|
dataSourcesOpts.find(
|
||||||
dataSourcesOpts.find(
|
option => option.value === value.dataSourceName
|
||||||
option => option.value === value.dataSourceName
|
).placeHolder
|
||||||
).placeHolder
|
}
|
||||||
}
|
value={value.dataSourceName}
|
||||||
value={value.dataSourceName}
|
onChange={evt => {
|
||||||
onChange={evt => {
|
setValue(v => ({ ...v, dataSourceName: evt.value }));
|
||||||
setValue(v => ({ ...v, dataSourceName: evt.value }));
|
}}
|
||||||
}}
|
isClearable={false}
|
||||||
isClearable={false}
|
|
||||||
/>
|
|
||||||
)}
|
|
||||||
</div>
|
|
||||||
<div className="p-4 bg-primary-dark">
|
|
||||||
<Input
|
|
||||||
autoFocus
|
|
||||||
className="mt-2 bg-black border-primary-main"
|
|
||||||
type="text"
|
|
||||||
placeholder="Enter Report Name"
|
|
||||||
containerClassName="mr-2"
|
|
||||||
value={value.label}
|
|
||||||
onChange={onChangeHandler}
|
|
||||||
onKeyPress={onKeyPressHandler}
|
|
||||||
required
|
|
||||||
/>
|
/>
|
||||||
</div>
|
)}
|
||||||
|
<Input
|
||||||
|
autoFocus
|
||||||
|
label="Enter the report name"
|
||||||
|
labelClassName="text-white text-[14px] leading-[1.2]"
|
||||||
|
className="bg-black border-primary-main"
|
||||||
|
type="text"
|
||||||
|
value={value.label}
|
||||||
|
onChange={onChangeHandler}
|
||||||
|
onKeyPress={onKeyPressHandler}
|
||||||
|
required
|
||||||
|
/>
|
||||||
</>
|
</>
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-dicom-microscopy",
|
"name": "@ohif/extension-dicom-microscopy",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for DICOM microscopy",
|
"description": "OHIF extension for DICOM microscopy",
|
||||||
"author": "Bill Wallace, md-prog",
|
"author": "Bill Wallace, md-prog",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -28,18 +28,16 @@
|
|||||||
"start": "yarn run dev"
|
"start": "yarn run dev"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/i18n": "3.5.0",
|
"@ohif/i18n": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"prop-types": "^15.6.2",
|
"prop-types": "^15.6.2",
|
||||||
"react": "^17.0.2",
|
"react": "^17.0.2",
|
||||||
"react-dom": "^17.0.2",
|
"react-dom": "^17.0.2",
|
||||||
"react-i18next": "^10.11.0",
|
"react-i18next": "^10.11.0",
|
||||||
"react-router": "^6.8.1",
|
"react-router": "^6.8.1",
|
||||||
"react-router-dom": "^6.8.1",
|
"react-router-dom": "^6.8.1"
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13",
|
"@babel/runtime": "^7.20.13",
|
||||||
@ -49,31 +47,5 @@
|
|||||||
"colormap": "^2.3",
|
"colormap": "^2.3",
|
||||||
"dicom-microscopy-viewer": "^0.44.0",
|
"dicom-microscopy-viewer": "^0.44.0",
|
||||||
"dicomicc": "^0.1"
|
"dicomicc": "^0.1"
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@babel/core": "^7.21.4",
|
|
||||||
"@babel/plugin-proposal-class-properties": "^7.16.7",
|
|
||||||
"@babel/plugin-proposal-object-rest-spread": "^7.17.3",
|
|
||||||
"@babel/plugin-proposal-private-methods": "^7.18.6",
|
|
||||||
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
|
||||||
"@babel/plugin-transform-arrow-functions": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-regenerator": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.17.0",
|
|
||||||
"@babel/plugin-transform-typescript": "^7.13.0",
|
|
||||||
"@babel/preset-env": "^7.16.11",
|
|
||||||
"@babel/preset-react": "^7.16.7",
|
|
||||||
"@babel/preset-typescript": "^7.13.0",
|
|
||||||
"babel-eslint": "^8.0.3",
|
|
||||||
"babel-loader": "^8.0.0-beta.4",
|
|
||||||
"babel-plugin-inline-react-svg": "^2.0.1",
|
|
||||||
"clean-webpack-plugin": "^4.0.0",
|
|
||||||
"copy-webpack-plugin": "^10.2.0",
|
|
||||||
"cross-env": "^7.0.3",
|
|
||||||
"dotenv": "^14.1.0",
|
|
||||||
"eslint": "^5.0.1",
|
|
||||||
"eslint-loader": "^2.0.0",
|
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-cli": "^4.7.2",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -31,7 +31,6 @@ export default function getCommandsModule({
|
|||||||
|
|
||||||
callInputDialog({
|
callInputDialog({
|
||||||
uiDialogService,
|
uiDialogService,
|
||||||
title: 'Enter your annotation',
|
|
||||||
defaultValue: '',
|
defaultValue: '',
|
||||||
callback: (value: string, action: string) => {
|
callback: (value: string, action: string) => {
|
||||||
switch (action) {
|
switch (action) {
|
||||||
|
|||||||
@ -12,7 +12,7 @@ import { Input, Dialog } from '@ohif/ui';
|
|||||||
*/
|
*/
|
||||||
export default function callInputDialog({
|
export default function callInputDialog({
|
||||||
uiDialogService,
|
uiDialogService,
|
||||||
title = 'Enter your annotation',
|
title = 'Annotation',
|
||||||
defaultValue = '',
|
defaultValue = '',
|
||||||
callback = (value: string, action: string) => {}
|
callback = (value: string, action: string) => {}
|
||||||
}) {
|
}) {
|
||||||
@ -49,27 +49,26 @@ export default function callInputDialog({
|
|||||||
onSubmit: onSubmitHandler,
|
onSubmit: onSubmitHandler,
|
||||||
body: ({ value, setValue }) => {
|
body: ({ value, setValue }) => {
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<Input
|
||||||
<Input
|
label="Enter your annotation"
|
||||||
autoFocus
|
labelClassName="text-white text-[14px] leading-[1.2]"
|
||||||
className="mt-2 bg-black border-primary-main"
|
autoFocus
|
||||||
type="text"
|
className="bg-black border-primary-main"
|
||||||
containerClassName="mr-2"
|
type="text"
|
||||||
value={value.defaultValue}
|
value={value.defaultValue}
|
||||||
onChange={event => {
|
onChange={event => {
|
||||||
event.persist();
|
event.persist();
|
||||||
setValue(value => ({ ...value, value: event.target.value }));
|
setValue(value => ({ ...value, value: event.target.value }));
|
||||||
}}
|
}}
|
||||||
onKeyPress={event => {
|
onKeyPress={event => {
|
||||||
if (event.key === 'Enter') {
|
if (event.key === 'Enter') {
|
||||||
onSubmitHandler({ value, action: { id: 'save' } });
|
onSubmitHandler({ value, action: { id: 'save' } });
|
||||||
}
|
}
|
||||||
}}
|
}}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-dicom-pdf",
|
"name": "@ohif/extension-dicom-pdf",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for PDF display",
|
"description": "OHIF extension for PDF display",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -28,8 +28,8 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"dicom-parser": "^1.8.9",
|
"dicom-parser": "^1.8.9",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-dicom-video",
|
"name": "@ohif/extension-dicom-video",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for video display",
|
"description": "OHIF extension for video display",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -28,8 +28,8 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"dicom-parser": "^1.8.9",
|
"dicom-parser": "^1.8.9",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-measurement-tracking",
|
"name": "@ohif/extension-measurement-tracking",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Tracking features and functionality for basic image viewing",
|
"description": "Tracking features and functionality for basic image viewing",
|
||||||
"author": "OHIF Core Team",
|
"author": "OHIF Core Team",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -32,9 +32,9 @@
|
|||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@cornerstonejs/core": "^1.1.0",
|
"@cornerstonejs/core": "^1.1.0",
|
||||||
"@cornerstonejs/tools": "^1.1.0",
|
"@cornerstonejs/tools": "^1.1.0",
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"classnames": "^2.3.2",
|
"classnames": "^2.3.2",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"lodash.debounce": "^4.17.21",
|
"lodash.debounce": "^4.17.21",
|
||||||
@ -46,7 +46,7 @@
|
|||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13",
|
"@babel/runtime": "^7.20.13",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"@xstate/react": "^0.8.1",
|
"@xstate/react": "^0.8.1",
|
||||||
"xstate": "^4.10.0"
|
"xstate": "^4.10.0"
|
||||||
}
|
}
|
||||||
|
|||||||
@ -38,7 +38,7 @@ export default function createReportDialogPrompt(uiDialogService) {
|
|||||||
useLastPosition: false,
|
useLastPosition: false,
|
||||||
showOverlay: true,
|
showOverlay: true,
|
||||||
contentProps: {
|
contentProps: {
|
||||||
title: 'Provide a name for your report',
|
title: 'Create Report',
|
||||||
value: { label: '' },
|
value: { label: '' },
|
||||||
noCloseButton: true,
|
noCloseButton: true,
|
||||||
onClose: _handleClose,
|
onClose: _handleClose,
|
||||||
@ -60,12 +60,13 @@ export default function createReportDialogPrompt(uiDialogService) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<div className="">
|
||||||
<Input
|
<Input
|
||||||
|
label="Enter the report name"
|
||||||
|
labelClassName="text-white grow leading-[1.2] text-[14px]"
|
||||||
autoFocus
|
autoFocus
|
||||||
className="mt-2 bg-black border-primary-main"
|
className="bg-black border-primary-main grow"
|
||||||
type="text"
|
type="text"
|
||||||
containerClassName="mr-2"
|
|
||||||
value={value.label}
|
value={value.label}
|
||||||
onChange={onChangeHandler}
|
onChange={onChangeHandler}
|
||||||
onKeyPress={onKeyPressHandler}
|
onKeyPress={onKeyPressHandler}
|
||||||
|
|||||||
@ -188,7 +188,7 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
|||||||
showOverlay: true,
|
showOverlay: true,
|
||||||
content: Dialog,
|
content: Dialog,
|
||||||
contentProps: {
|
contentProps: {
|
||||||
title: 'Enter your annotation',
|
title: 'Annotation',
|
||||||
noCloseButton: true,
|
noCloseButton: true,
|
||||||
value: { label: measurement.label || '' },
|
value: { label: measurement.label || '' },
|
||||||
body: ({ value, setValue }) => {
|
body: ({ value, setValue }) => {
|
||||||
@ -203,18 +203,17 @@ function PanelMeasurementTableTracking({ servicesManager, extensionManager }) {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
return (
|
return (
|
||||||
<div className="p-4 bg-primary-dark">
|
<Input
|
||||||
<Input
|
label="Enter your annotation"
|
||||||
autoFocus
|
labelClassName="text-white grow text-[14px] leading-[1.2]"
|
||||||
id="annotation"
|
autoFocus
|
||||||
className="mt-2 bg-black border-primary-main"
|
id="annotation"
|
||||||
type="text"
|
className="bg-black border-primary-main"
|
||||||
containerClassName="mr-2"
|
type="text"
|
||||||
value={value.label}
|
value={value.label}
|
||||||
onChange={onChangeHandler}
|
onChange={onChangeHandler}
|
||||||
onKeyPress={onKeyPressHandler}
|
onKeyPress={onKeyPressHandler}
|
||||||
/>
|
/>
|
||||||
</div>
|
|
||||||
);
|
);
|
||||||
},
|
},
|
||||||
actions: [
|
actions: [
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-test",
|
"name": "@ohif/extension-test",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension used inside e2e testing",
|
"description": "OHIF extension used inside e2e testing",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -28,8 +28,8 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "0.29.4",
|
"dcmjs": "0.29.4",
|
||||||
"dicom-parser": "^1.8.9",
|
"dicom-parser": "^1.8.9",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/extension-tmtv",
|
"name": "@ohif/extension-tmtv",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF extension for Total Metabolic Tumor Volume",
|
"description": "OHIF extension for Total Metabolic Tumor Volume",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -28,8 +28,8 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"dcmjs": "^0.29.5",
|
"dcmjs": "^0.29.5",
|
||||||
"dicom-parser": "^1.8.9",
|
"dicom-parser": "^1.8.9",
|
||||||
"hammerjs": "^2.0.8",
|
"hammerjs": "^2.0.8",
|
||||||
|
|||||||
@ -1,5 +1,5 @@
|
|||||||
{
|
{
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"packages": ["extensions/*", "platform/*", "modes/*"],
|
"packages": ["extensions/*", "platform/*", "modes/*"],
|
||||||
"npmClient": "yarn",
|
"npmClient": "yarn",
|
||||||
"useWorkspaces": true
|
"useWorkspaces": true
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/mode-basic-dev-mode",
|
"name": "@ohif/mode-basic-dev-mode",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Basic OHIF Viewer Using Cornerstone",
|
"description": "Basic OHIF Viewer Using Cornerstone",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -29,12 +29,12 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-pdf": "3.5.0",
|
"@ohif/extension-dicom-pdf": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-video": "3.5.0"
|
"@ohif/extension-dicom-video": "3.6.0-beta.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13"
|
"@babel/runtime": "^7.20.13"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/mode-test",
|
"name": "@ohif/mode-test",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Basic mode for testing",
|
"description": "Basic mode for testing",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -32,14 +32,14 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-pdf": "3.5.0",
|
"@ohif/extension-dicom-pdf": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-video": "3.5.0",
|
"@ohif/extension-dicom-video": "3.6.0-beta.3",
|
||||||
"@ohif/extension-measurement-tracking": "3.5.0",
|
"@ohif/extension-measurement-tracking": "3.6.0-beta.3",
|
||||||
"@ohif/extension-test": "3.5.0"
|
"@ohif/extension-test": "3.6.0-beta.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13"
|
"@babel/runtime": "^7.20.13"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/mode-longitudinal",
|
"name": "@ohif/mode-longitudinal",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Longitudinal Workflow",
|
"description": "Longitudinal Workflow",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -32,15 +32,15 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-rt": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-rt": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-seg": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-seg": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-pdf": "3.5.0",
|
"@ohif/extension-dicom-pdf": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-video": "3.5.0",
|
"@ohif/extension-dicom-video": "3.6.0-beta.3",
|
||||||
"@ohif/extension-measurement-tracking": "3.5.0"
|
"@ohif/extension-measurement-tracking": "3.6.0-beta.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13"
|
"@babel/runtime": "^7.20.13"
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/mode-microscopy",
|
"name": "@ohif/mode-microscopy",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "OHIF mode for DICOM microscopy",
|
"description": "OHIF mode for DICOM microscopy",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -33,36 +33,10 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-microscopy": "3.5.0"
|
"@ohif/extension-dicom-microscopy": "3.6.0-beta.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13"
|
"@babel/runtime": "^7.20.13"
|
||||||
},
|
|
||||||
"devDependencies": {
|
|
||||||
"@babel/core": "^7.21.4",
|
|
||||||
"@babel/plugin-proposal-class-properties": "^7.16.7",
|
|
||||||
"@babel/plugin-proposal-object-rest-spread": "^7.17.3",
|
|
||||||
"@babel/plugin-proposal-private-methods": "^7.18.6",
|
|
||||||
"@babel/plugin-syntax-dynamic-import": "^7.8.3",
|
|
||||||
"@babel/plugin-transform-arrow-functions": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-regenerator": "^7.16.7",
|
|
||||||
"@babel/plugin-transform-runtime": "^7.17.0",
|
|
||||||
"@babel/plugin-transform-typescript": "^7.13.0",
|
|
||||||
"@babel/preset-env": "^7.16.11",
|
|
||||||
"@babel/preset-react": "^7.16.7",
|
|
||||||
"@babel/preset-typescript": "^7.13.0",
|
|
||||||
"babel-eslint": "^8.0.3",
|
|
||||||
"babel-loader": "^8.0.0-beta.4",
|
|
||||||
"babel-plugin-inline-react-svg": "^2.0.1",
|
|
||||||
"clean-webpack-plugin": "^4.0.0",
|
|
||||||
"copy-webpack-plugin": "^10.2.0",
|
|
||||||
"cross-env": "^7.0.3",
|
|
||||||
"dotenv": "^14.1.0",
|
|
||||||
"eslint": "^5.0.1",
|
|
||||||
"eslint-loader": "^2.0.0",
|
|
||||||
"webpack": "^5.50.0",
|
|
||||||
"webpack-cli": "^4.7.2",
|
|
||||||
"webpack-merge": "^5.7.3"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/mode-tmtv",
|
"name": "@ohif/mode-tmtv",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Total Metabolic Tumor Volume Workflow",
|
"description": "Total Metabolic Tumor Volume Workflow",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -32,13 +32,13 @@
|
|||||||
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
"test:unit:ci": "jest --ci --runInBand --collectCoverage --passWithNoTests"
|
||||||
},
|
},
|
||||||
"peerDependencies": {
|
"peerDependencies": {
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-pdf": "3.5.0",
|
"@ohif/extension-dicom-pdf": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-video": "3.5.0",
|
"@ohif/extension-dicom-video": "3.6.0-beta.3",
|
||||||
"@ohif/extension-measurement-tracking": "3.5.0"
|
"@ohif/extension-measurement-tracking": "3.6.0-beta.3"
|
||||||
},
|
},
|
||||||
"dependencies": {
|
"dependencies": {
|
||||||
"@babel/runtime": "^7.20.13"
|
"@babel/runtime": "^7.20.13"
|
||||||
|
|||||||
@ -151,6 +151,7 @@
|
|||||||
"resolutions": {
|
"resolutions": {
|
||||||
"@cornerstonejs/core": "^1.1.0",
|
"@cornerstonejs/core": "^1.1.0",
|
||||||
"**/@babel/runtime": "^7.20.13",
|
"**/@babel/runtime": "^7.20.13",
|
||||||
|
"commander": "8.3.0",
|
||||||
"nth-check": "^2.1.1",
|
"nth-check": "^2.1.1",
|
||||||
"trim-newlines": "^5.0.0",
|
"trim-newlines": "^5.0.0",
|
||||||
"glob-parent": "^6.0.2",
|
"glob-parent": "^6.0.2",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/app",
|
"name": "@ohif/app",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"productVersion": "3.4.0",
|
"productVersion": "3.4.0",
|
||||||
"description": "OHIF Viewer",
|
"description": "OHIF Viewer",
|
||||||
"author": "OHIF Contributors",
|
"author": "OHIF Contributors",
|
||||||
@ -52,22 +52,22 @@
|
|||||||
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
||||||
"@cornerstonejs/codec-openjph": "^2.4.2",
|
"@cornerstonejs/codec-openjph": "^2.4.2",
|
||||||
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
||||||
"@ohif/core": "3.5.0",
|
"@ohif/core": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone": "3.5.0",
|
"@ohif/extension-cornerstone": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-rt": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-rt": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-seg": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-seg": "3.6.0-beta.3",
|
||||||
"@ohif/extension-cornerstone-dicom-sr": "3.5.0",
|
"@ohif/extension-cornerstone-dicom-sr": "3.6.0-beta.3",
|
||||||
"@ohif/extension-default": "3.5.0",
|
"@ohif/extension-default": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-microscopy": "3.5.0",
|
"@ohif/extension-dicom-microscopy": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-pdf": "3.5.0",
|
"@ohif/extension-dicom-pdf": "3.6.0-beta.3",
|
||||||
"@ohif/extension-dicom-video": "3.5.0",
|
"@ohif/extension-dicom-video": "3.6.0-beta.3",
|
||||||
"@ohif/extension-test": "3.5.0",
|
"@ohif/extension-test": "3.6.0-beta.3",
|
||||||
"@ohif/i18n": "3.5.0",
|
"@ohif/i18n": "3.6.0-beta.3",
|
||||||
"@ohif/mode-basic-dev-mode": "3.5.0",
|
"@ohif/mode-basic-dev-mode": "3.6.0-beta.3",
|
||||||
"@ohif/mode-longitudinal": "3.5.0",
|
"@ohif/mode-longitudinal": "3.6.0-beta.3",
|
||||||
"@ohif/mode-microscopy": "3.5.0",
|
"@ohif/mode-microscopy": "3.6.0-beta.3",
|
||||||
"@ohif/mode-test": "3.5.0",
|
"@ohif/mode-test": "3.6.0-beta.3",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"@types/react": "^17.0.38",
|
"@types/react": "^17.0.38",
|
||||||
"classnames": "^2.3.2",
|
"classnames": "^2.3.2",
|
||||||
"core-js": "^3.16.1",
|
"core-js": "^3.16.1",
|
||||||
|
|||||||
@ -33,7 +33,7 @@ window.config = {
|
|||||||
supportsWildcard: true,
|
supportsWildcard: true,
|
||||||
dicomUploadEnabled: true,
|
dicomUploadEnabled: true,
|
||||||
bulkDataURI: {
|
bulkDataURI: {
|
||||||
enabled: false,
|
enabled: true,
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@ -1,3 +1,9 @@
|
|||||||
|
navigator.serviceWorker.getRegistrations().then(function(registrations) {
|
||||||
|
for (let registration of registrations) {
|
||||||
|
registration.unregister();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// https://developers.google.com/web/tools/workbox/modules/workbox-window
|
// https://developers.google.com/web/tools/workbox/modules/workbox-window
|
||||||
// All major browsers that support service worker also support native JavaScript
|
// All major browsers that support service worker also support native JavaScript
|
||||||
// modules, so it's perfectly fine to serve this code to any browsers
|
// modules, so it's perfectly fine to serve this code to any browsers
|
||||||
@ -5,7 +11,7 @@
|
|||||||
//
|
//
|
||||||
//import { Workbox } from './workbox-window.prod.mjs';
|
//import { Workbox } from './workbox-window.prod.mjs';
|
||||||
// proper initialization
|
// proper initialization
|
||||||
if( 'function' === typeof importScripts) {
|
if ('function' === typeof importScripts) {
|
||||||
importScripts(
|
importScripts(
|
||||||
'https://storage.googleapis.com/workbox-cdn/releases/6.5.4/workbox-window.prod.mjs'
|
'https://storage.googleapis.com/workbox-cdn/releases/6.5.4/workbox-window.prod.mjs'
|
||||||
);
|
);
|
||||||
@ -55,5 +61,4 @@ if( 'function' === typeof importScripts) {
|
|||||||
|
|
||||||
wb.register();
|
wb.register();
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|||||||
@ -1,3 +1,9 @@
|
|||||||
|
navigator.serviceWorker.getRegistrations().then(function(registrations) {
|
||||||
|
for (let registration of registrations) {
|
||||||
|
registration.unregister();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
// https://developers.google.com/web/tools/workbox/guides/troubleshoot-and-debug
|
// https://developers.google.com/web/tools/workbox/guides/troubleshoot-and-debug
|
||||||
importScripts(
|
importScripts(
|
||||||
'https://storage.googleapis.com/workbox-cdn/releases/5.0.0-beta.1/workbox-sw.js'
|
'https://storage.googleapis.com/workbox-cdn/releases/5.0.0-beta.1/workbox-sw.js'
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/cli",
|
"name": "@ohif/cli",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "A CLI to bootstrap new OHIF extension or mode",
|
"description": "A CLI to bootstrap new OHIF extension or mode",
|
||||||
"type": "module",
|
"type": "module",
|
||||||
"main": "src/index.js",
|
"main": "src/index.js",
|
||||||
@ -21,7 +21,6 @@
|
|||||||
"@babel/core": "^7.21.4",
|
"@babel/core": "^7.21.4",
|
||||||
"axios": "^0.26.1",
|
"axios": "^0.26.1",
|
||||||
"chalk": "^5.0.0",
|
"chalk": "^5.0.0",
|
||||||
"commander": "^8.3.0",
|
|
||||||
"execa": "^6.0.0",
|
"execa": "^6.0.0",
|
||||||
"gitignore": "^0.7.0",
|
"gitignore": "^0.7.0",
|
||||||
"inquirer": "^8.2.0",
|
"inquirer": "^8.2.0",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/core",
|
"name": "@ohif/core",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Generic business logic for web-based medical imaging applications",
|
"description": "Generic business logic for web-based medical imaging applications",
|
||||||
"author": "OHIF Core Team",
|
"author": "OHIF Core Team",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
@ -36,7 +36,7 @@
|
|||||||
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
"@cornerstonejs/codec-openjpeg": "^1.2.2",
|
||||||
"@cornerstonejs/codec-openjph": "^2.4.2",
|
"@cornerstonejs/codec-openjph": "^2.4.2",
|
||||||
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
"@cornerstonejs/dicom-image-loader": "^0.6.8",
|
||||||
"@ohif/ui": "3.5.0",
|
"@ohif/ui": "3.6.0-beta.3",
|
||||||
"cornerstone-math": "0.1.9",
|
"cornerstone-math": "0.1.9",
|
||||||
"dicom-parser": "^1.8.21"
|
"dicom-parser": "^1.8.21"
|
||||||
},
|
},
|
||||||
|
|||||||
BIN
platform/docs/docs/assets/img/github-readme-branches.png
Normal file
BIN
platform/docs/docs/assets/img/github-readme-branches.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 87 KiB |
@ -43,3 +43,11 @@ The Dockerfile and entry point use the `${PORT}` environment variable as the por
|
|||||||
```sh
|
```sh
|
||||||
docker run -d -e PORT=8080 -p 3000:8080/tcp --name ohif-viewer-container ohif-viewer-image
|
docker run -d -e PORT=8080 -p 3000:8080/tcp --name ohif-viewer-container ohif-viewer-image
|
||||||
```
|
```
|
||||||
|
|
||||||
|
### Configuring the OHIF config file
|
||||||
|
|
||||||
|
The OHIF [config file](../configuration/configurationFiles.md) to use can be specified by mounting it as a volume for the Docker container using the `-v` flag. If the OHIF config file is on the local file system then it can be specified as below. Note that depending on the version of Docker, an absolute path to the config file might be required.
|
||||||
|
|
||||||
|
```sh
|
||||||
|
docker run -d -p 3000:80/tcp -v /path/to/config/file.js:/usr/share/nginx/html/app-config.js --name ohif-viewer-container ohif-viewer-image
|
||||||
|
```
|
||||||
|
|||||||
@ -40,6 +40,31 @@ aren't as concerned with syncing updates, then follow these steps:
|
|||||||
|
|
||||||
## Developing
|
## Developing
|
||||||
|
|
||||||
|
### Branches
|
||||||
|
|
||||||
|
#### `master` branch - The latest dev (beta) release
|
||||||
|
|
||||||
|
- `master` - The latest dev release
|
||||||
|
|
||||||
|
This is typically where the latest development happens. Code that is in the master branch has passed code reviews and automated tests, but it may not be deemed ready for production. This branch usually contains the most recent changes and features being worked on by the development team. It's often the starting point for creating feature branches (where new features are developed) and hotfix branches (for urgent fixes).
|
||||||
|
|
||||||
|
Each package is tagged with beta version numbers, and published to npm such as `@ohif/ui@3.6.0-beta.1`
|
||||||
|
|
||||||
|
### `release` branch - The latest stable release
|
||||||
|
|
||||||
|
This branch represents the latest stable version of the project that is considered ready for production. The code in this branch should be fully tested and vetted for release. Once the code in the master branch reaches a state where it's stable and ready to be released to users,
|
||||||
|
we do a comprehensive code review and QA testing. Once the code is approved,
|
||||||
|
we merge it into the release branch and tag a new release.
|
||||||
|
|
||||||
|
Each package is tagged with version numbers, and published to npm such as `@ohif/ui@3.5.0`
|
||||||
|
|
||||||
|
Note: `master` is always ahead of `release` branch. We publish both docker builds for beta and stable releases.
|
||||||
|
|
||||||
|
Here is a schematic representation of our development workflow:
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
### Requirements
|
### Requirements
|
||||||
|
|
||||||
- [Node.js & NPM](https://nodejs.org/en/)
|
- [Node.js & NPM](https://nodejs.org/en/)
|
||||||
|
|||||||
@ -235,9 +235,6 @@ module.exports = {
|
|||||||
current: {
|
current: {
|
||||||
label: 'Latest',
|
label: 'Latest',
|
||||||
},
|
},
|
||||||
'2.0': {
|
|
||||||
label: 'Version 2.0 - Master branch',
|
|
||||||
},
|
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
theme: {
|
theme: {
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "ohif-docs",
|
"name": "ohif-docs",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"private": true,
|
"private": true,
|
||||||
"workspaces": {
|
"workspaces": {
|
||||||
"nohoist": [
|
"nohoist": [
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/i18n",
|
"name": "@ohif/i18n",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "Internationalization library for The OHIF Viewer",
|
"description": "Internationalization library for The OHIF Viewer",
|
||||||
"author": "OHIF",
|
"author": "OHIF",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@ -1,6 +1,6 @@
|
|||||||
{
|
{
|
||||||
"name": "@ohif/ui",
|
"name": "@ohif/ui",
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"description": "A set of React components for Medical Imaging Viewers",
|
"description": "A set of React components for Medical Imaging Viewers",
|
||||||
"author": "OHIF Contributors",
|
"author": "OHIF Contributors",
|
||||||
"license": "MIT",
|
"license": "MIT",
|
||||||
|
|||||||
@ -1,7 +0,0 @@
|
|||||||
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 19 19">
|
|
||||||
<g fill="currentColor" fill-rule="evenodd">
|
|
||||||
<g stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5">
|
|
||||||
<path d="M.188.187L8.813 8.812M8.813.187L.188 8.812" transform="translate(5 5)"/>
|
|
||||||
</g>
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 332 B |
3
platform/ui/src/assets/icons/closeIcon.svg
Normal file
3
platform/ui/src/assets/icons/closeIcon.svg
Normal file
@ -0,0 +1,3 @@
|
|||||||
|
<svg width="12" height="12" viewBox="0 0 12 12" xmlns="http://www.w3.org/2000/svg">
|
||||||
|
<path d="M12 1.05 10.95 0 6 4.95 1.05 0 0 1.05 4.95 6 0 10.95 1.05 12 6 7.05 10.95 12 12 10.95 7.05 6z" fill="currentColor" fill-rule="evenodd"/>
|
||||||
|
</svg>
|
||||||
|
After Width: | Height: | Size: 241 B |
@ -1,8 +1,10 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { Typography, Icon } from '../';
|
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import detect from 'browser-detect';
|
import detect from 'browser-detect';
|
||||||
|
|
||||||
|
import Typography from '../Typography';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const Link = ({ href, children, showIcon = false }) => {
|
const Link = ({ href, children, showIcon = false }) => {
|
||||||
return (
|
return (
|
||||||
<a href={href} target="_blank" rel="noopener noreferrer">
|
<a href={href} target="_blank" rel="noopener noreferrer">
|
||||||
@ -49,7 +51,11 @@ const AboutModal = ({ buildNumber, versionNumber, commitHash }) => {
|
|||||||
|
|
||||||
const renderRowTitle = title => (
|
const renderRowTitle = title => (
|
||||||
<div className="pb-3 mb-3 border-b-2 border-black">
|
<div className="pb-3 mb-3 border-b-2 border-black">
|
||||||
<Typography variant="h6" className="text-primary-light">
|
<Typography
|
||||||
|
variant="inherit"
|
||||||
|
color="primaryLight"
|
||||||
|
className="text-[16px] font-semibold !leading-[1.2]"
|
||||||
|
>
|
||||||
{title}
|
{title}
|
||||||
</Typography>
|
</Typography>
|
||||||
</div>
|
</div>
|
||||||
@ -83,6 +89,11 @@ const AboutModal = ({ buildNumber, versionNumber, commitHash }) => {
|
|||||||
value="https://github.com/OHIF/Viewers/"
|
value="https://github.com/OHIF/Viewers/"
|
||||||
link="https://github.com/OHIF/Viewers/"
|
link="https://github.com/OHIF/Viewers/"
|
||||||
/>
|
/>
|
||||||
|
<Row
|
||||||
|
title="Data Citation"
|
||||||
|
value="https://github.com/OHIF/Viewers/blob/master/DATACITATION.md"
|
||||||
|
link="https://github.com/OHIF/Viewers/blob/master/DATACITATION.md"
|
||||||
|
/>
|
||||||
{/* <Row
|
{/* <Row
|
||||||
title="Last Master Commits"
|
title="Last Master Commits"
|
||||||
value="https://github.com/OHIF/Viewers/"
|
value="https://github.com/OHIF/Viewers/"
|
||||||
|
|||||||
@ -1,7 +1,10 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import debounce from 'lodash.debounce';
|
import debounce from 'lodash.debounce';
|
||||||
import { Icon, Tooltip, InputRange } from '../';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
import InputRange from '../InputRange';
|
||||||
|
|
||||||
import './CinePlayer.css';
|
import './CinePlayer.css';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
|
|||||||
@ -2,17 +2,19 @@ import React from 'react';
|
|||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Typography } from '..';
|
import Typography from '../Typography';
|
||||||
|
|
||||||
const Body = ({ text, className }) => {
|
const Body = ({ text, className }) => {
|
||||||
const theme = 'bg-primary-dark';
|
const theme = 'bg-primary-dark';
|
||||||
return (
|
return (
|
||||||
<div className={classNames('relative flex-auto', theme, className)}>
|
<div className={classNames('relative flex-auto', theme, className)}>
|
||||||
<div className="p-6">
|
<Typography
|
||||||
<Typography variant="body" className="my-4 leading-relaxed">
|
variant="inherit"
|
||||||
{text}
|
color="initial"
|
||||||
</Typography>
|
className="text-[14px] !leading-[1.2]"
|
||||||
</div>
|
>
|
||||||
|
{text}
|
||||||
|
</Typography>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|||||||
@ -22,12 +22,13 @@ const Dialog = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const [value, setValue] = useState(defaultValue);
|
const [value, setValue] = useState(defaultValue);
|
||||||
|
|
||||||
const theme = 'bg-secondary-light';
|
const theme = 'bg-primary-dark';
|
||||||
const flex = 'flex flex-col';
|
const flex = 'flex flex-col';
|
||||||
const border = 'border-0 rounded-lg drop-shadow-lg';
|
const border = 'border-0 rounded';
|
||||||
const outline = 'outline-none focus:outline-none';
|
const outline = 'outline-none focus:outline-none';
|
||||||
const position = 'relative';
|
const position = 'relative';
|
||||||
const width = 'w-full';
|
const width = 'w-full';
|
||||||
|
const padding = 'px-[20px] pb-[20px] pt-[13px]';
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
if (onShow) {
|
if (onShow) {
|
||||||
@ -36,7 +37,17 @@ const Dialog = ({
|
|||||||
}, [onShow]);
|
}, [onShow]);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classNames(theme, flex, border, outline, position, width)}>
|
<div
|
||||||
|
className={classNames(
|
||||||
|
theme,
|
||||||
|
flex,
|
||||||
|
border,
|
||||||
|
outline,
|
||||||
|
position,
|
||||||
|
width,
|
||||||
|
padding
|
||||||
|
)}
|
||||||
|
>
|
||||||
<HeaderComponent
|
<HeaderComponent
|
||||||
title={title}
|
title={title}
|
||||||
noCloseButton={noCloseButton}
|
noCloseButton={noCloseButton}
|
||||||
|
|||||||
@ -2,16 +2,14 @@ import React from 'react';
|
|||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Button } from '..';
|
import Button from '../Button';
|
||||||
|
|
||||||
const Footer = ({ actions, className, onSubmit, value }) => {
|
const Footer = ({ actions, className, onSubmit, value }) => {
|
||||||
const flex = 'flex items-center justify-end';
|
const flex = 'flex items-center justify-end';
|
||||||
const border = 'border-t-2 border-solid border-black rounded-b';
|
const padding = 'pt-[20px]';
|
||||||
const spacing = 'p-6';
|
|
||||||
const theme = 'bg-primary-dark';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classNames(flex, border, spacing, theme, className)}>
|
<div className={classNames(flex, padding, className)}>
|
||||||
{actions.map((action, index) => {
|
{actions.map((action, index) => {
|
||||||
const isFirst = index === 0;
|
const isFirst = index === 0;
|
||||||
const isPrimary = action.type === 'primary';
|
const isPrimary = action.type === 'primary';
|
||||||
|
|||||||
@ -2,7 +2,8 @@ import React from 'react';
|
|||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Typography, Icon } from '..';
|
import Typography from '../Typography';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const CloseButton = ({ onClick }) => {
|
const CloseButton = ({ onClick }) => {
|
||||||
return (
|
return (
|
||||||
@ -10,7 +11,7 @@ const CloseButton = ({ onClick }) => {
|
|||||||
data-cy="close-button"
|
data-cy="close-button"
|
||||||
onClick={onClick}
|
onClick={onClick}
|
||||||
name="close"
|
name="close"
|
||||||
className="cursor-pointer text-primary-active w-6 h-6"
|
className="cursor-pointer text-primary-active"
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
@ -20,14 +21,13 @@ CloseButton.propTypes = {
|
|||||||
};
|
};
|
||||||
|
|
||||||
const Header = ({ title, noCloseButton, onClose }) => {
|
const Header = ({ title, noCloseButton, onClose }) => {
|
||||||
const theme = 'bg-secondary-main';
|
const theme = 'bg-primary-dark';
|
||||||
const flex = 'flex items-center justify-between';
|
const flex = 'flex items-center justify-between';
|
||||||
const border = 'border-b-2 border-solid border-black rounded-t';
|
const padding = 'pb-[20px]';
|
||||||
const spacing = 'p-4';
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={classNames(theme, flex, border, spacing)}>
|
<div className={classNames(theme, flex, padding)}>
|
||||||
<Typography variant="h6" color="primaryActive">
|
<Typography variant="h6" color="primaryLight" className="!leading-[1.2]">
|
||||||
{title}
|
{title}
|
||||||
</Typography>
|
</Typography>
|
||||||
{!noCloseButton && <CloseButton onClick={onClose} />}
|
{!noCloseButton && <CloseButton onClick={onClose} />}
|
||||||
|
|||||||
@ -2,7 +2,8 @@ import React, { useEffect, useCallback, useState, useRef } from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
import { Icon, Typography } from '../';
|
import Icon from '../Icon';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
|
||||||
const Dropdown = ({ id, children, showDropdownIcon, list, titleClassName }) => {
|
const Dropdown = ({ id, children, showDropdownIcon, list, titleClassName }) => {
|
||||||
const [open, setOpen] = useState(false);
|
const [open, setOpen] = useState(false);
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon, Typography } from '../';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
|
||||||
// TODO: Add loading spinner to OHIF + use it here.
|
// TODO: Add loading spinner to OHIF + use it here.
|
||||||
const EmptyStudies = ({ className }) => {
|
const EmptyStudies = ({ className }) => {
|
||||||
|
|||||||
@ -1,8 +1,10 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { ErrorBoundary as ReactErrorBoundary } from 'react-error-boundary';
|
import { ErrorBoundary as ReactErrorBoundary } from 'react-error-boundary';
|
||||||
import { Icon, IconButton } from '@ohif/ui';
|
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import Modal from '../Modal';
|
import Modal from '../Modal';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import IconButton from '../IconButton';
|
||||||
|
|
||||||
const isProduction = process.env.NODE_ENV === 'production';
|
const isProduction = process.env.NODE_ENV === 'production';
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,8 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
import { IconButton, Icon } from '../';
|
import IconButton from '../IconButton';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
import './ExpandableToolbarButton.css';
|
import './ExpandableToolbarButton.css';
|
||||||
|
|
||||||
|
|||||||
@ -2,7 +2,12 @@ import React, { ReactNode } from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { NavBar, Svg, Icon, IconButton, Dropdown } from '../';
|
|
||||||
|
import NavBar from '../NavBar';
|
||||||
|
import Svg from '../Svg';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import IconButton from '../IconButton';
|
||||||
|
import Dropdown from '../Dropdown';
|
||||||
|
|
||||||
function Header({
|
function Header({
|
||||||
children,
|
children,
|
||||||
|
|||||||
@ -1,9 +1,11 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { HotkeyField, Typography } from '../';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
|
import HotkeyField from '../HotkeyField';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
|
||||||
/* TODO: Move these configs and utils to core? */
|
/* TODO: Move these configs and utils to core? */
|
||||||
import { MODIFIER_KEYS } from './hotkeysConfig';
|
import { MODIFIER_KEYS } from './hotkeysConfig';
|
||||||
import { validate, splitHotkeyDefinitionsAndCreateTuples } from './utils';
|
import { validate, splitHotkeyDefinitionsAndCreateTuples } from './utils';
|
||||||
|
|||||||
@ -8,7 +8,7 @@ import arrowRightSmall from './../../assets/icons/arrow-right-small.svg';
|
|||||||
import calendar from './../../assets/icons/calendar.svg';
|
import calendar from './../../assets/icons/calendar.svg';
|
||||||
import cancel from './../../assets/icons/cancel.svg';
|
import cancel from './../../assets/icons/cancel.svg';
|
||||||
import clipboard from './../../assets/icons/clipboard.svg';
|
import clipboard from './../../assets/icons/clipboard.svg';
|
||||||
import close from './../../assets/icons/close.svg';
|
import close from './../../assets/icons/closeIcon.svg';
|
||||||
import dottedCircle from './../../assets/icons/dotted-circle.svg';
|
import dottedCircle from './../../assets/icons/dotted-circle.svg';
|
||||||
import circledCheckmark from './../../assets/icons/circled-checkmark.svg';
|
import circledCheckmark from './../../assets/icons/circled-checkmark.svg';
|
||||||
import chevronDown from './../../assets/icons/chevron-down.svg';
|
import chevronDown from './../../assets/icons/chevron-down.svg';
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { DateRange, InputLabelWrapper } from '../';
|
import DateRange from '../DateRange';
|
||||||
|
import InputLabelWrapper from '../InputLabelWrapper';
|
||||||
|
|
||||||
const InputDateRange = ({
|
const InputDateRange = ({
|
||||||
id,
|
id,
|
||||||
@ -14,7 +15,7 @@ const InputDateRange = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const { startDate, endDate } = value;
|
const { startDate, endDate } = value;
|
||||||
|
|
||||||
const onClickHandler = (event) => {
|
const onClickHandler = event => {
|
||||||
event.preventDefault();
|
event.preventDefault();
|
||||||
onLabelClick(event);
|
onLabelClick(event);
|
||||||
};
|
};
|
||||||
@ -38,11 +39,11 @@ const InputDateRange = ({
|
|||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
const noop = () => { };
|
const noop = () => {};
|
||||||
|
|
||||||
InputDateRange.defaultProps = {
|
InputDateRange.defaultProps = {
|
||||||
value: {},
|
value: {},
|
||||||
onLabelClick: noop
|
onLabelClick: noop,
|
||||||
};
|
};
|
||||||
|
|
||||||
InputDateRange.propTypes = {
|
InputDateRange.propTypes = {
|
||||||
|
|||||||
@ -1,14 +1,12 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import getGridWidthClass from '../../utils/getGridWidthClass'
|
import getGridWidthClass from '../../utils/getGridWidthClass';
|
||||||
|
|
||||||
import {
|
import InputText from '../InputText';
|
||||||
InputText,
|
import InputDateRange from '../InputDateRange';
|
||||||
InputDateRange,
|
import InputMultiSelect from '../InputMultiSelect';
|
||||||
InputMultiSelect,
|
import InputLabelWrapper from '../InputLabelWrapper';
|
||||||
InputLabelWrapper,
|
|
||||||
} from '../';
|
|
||||||
|
|
||||||
const InputGroup = ({
|
const InputGroup = ({
|
||||||
inputMeta,
|
inputMeta,
|
||||||
|
|||||||
@ -3,11 +3,12 @@ import PropTypes from 'prop-types';
|
|||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { Icon } from '../';
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const baseLabelClassName =
|
const baseLabelClassName =
|
||||||
'flex flex-col flex-1 text-white text-lg pl-1 select-none';
|
'flex flex-col flex-1 text-white text-lg pl-1 select-none';
|
||||||
const spanClassName = 'flex flex-row items-center cursor-pointer focus:outline-none';
|
const spanClassName =
|
||||||
|
'flex flex-row items-center cursor-pointer focus:outline-none';
|
||||||
const sortIconMap = {
|
const sortIconMap = {
|
||||||
descending: 'sorting-active-up',
|
descending: 'sorting-active-up',
|
||||||
ascending: 'sorting-active-down',
|
ascending: 'sorting-active-down',
|
||||||
@ -22,7 +23,7 @@ const InputLabelWrapper = ({
|
|||||||
className,
|
className,
|
||||||
children,
|
children,
|
||||||
}) => {
|
}) => {
|
||||||
const { t } = useTranslation("StudyList")
|
const { t } = useTranslation('StudyList');
|
||||||
|
|
||||||
const onClickHandler = e => {
|
const onClickHandler = e => {
|
||||||
if (!isSortable) {
|
if (!isSortable) {
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Select, InputLabelWrapper } from '../';
|
import Select from '../Select';
|
||||||
|
import InputLabelWrapper from '../InputLabelWrapper';
|
||||||
|
|
||||||
const InputMultiSelect = ({
|
const InputMultiSelect = ({
|
||||||
id,
|
id,
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Input, InputLabelWrapper } from '../';
|
import Input from '../Input';
|
||||||
|
import InputLabelWrapper from '../InputLabelWrapper';
|
||||||
|
|
||||||
const InputText = ({
|
const InputText = ({
|
||||||
id,
|
id,
|
||||||
@ -36,7 +37,7 @@ const InputText = ({
|
|||||||
InputText.defaultProps = {
|
InputText.defaultProps = {
|
||||||
value: '',
|
value: '',
|
||||||
isSortable: false,
|
isSortable: false,
|
||||||
onLabelClick: () => { },
|
onLabelClick: () => {},
|
||||||
sortDirection: 'none',
|
sortDirection: 'none',
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import debounce from 'lodash.debounce';
|
import debounce from 'lodash.debounce';
|
||||||
import { IconButton, Icon } from '../';
|
|
||||||
|
import IconButton from '../IconButton';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
import './LegacyCinePlayerCustomInputRange.css';
|
import './LegacyCinePlayerCustomInputRange.css';
|
||||||
|
|
||||||
@ -62,7 +64,7 @@ const LegacyCinePlayer = ({
|
|||||||
className="mr-3 border rounded-full text-primary-active border-primary-active"
|
className="mr-3 border rounded-full text-primary-active border-primary-active"
|
||||||
onClick={onClose}
|
onClick={onClose}
|
||||||
>
|
>
|
||||||
<Icon name="close" width="15px" height="15px" />
|
<Icon name="close" />
|
||||||
</IconButton>
|
</IconButton>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -1,9 +1,11 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Icon, Tooltip } from '../';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
|
||||||
const classes = {
|
const classes = {
|
||||||
infoHeader: 'text-base text-primary-light',
|
infoHeader: 'text-base text-primary-light',
|
||||||
infoText: 'text-base text-white max-w-24 truncate',
|
infoText: 'text-base text-white max-w-24 truncate',
|
||||||
|
|||||||
@ -1,10 +1,14 @@
|
|||||||
import React, { useState, useRef, useEffect } from 'react';
|
import React, { useState, useRef, useEffect } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Icon, ButtonGroup, Button, LegacyCinePlayer } from '../';
|
|
||||||
import useOnClickOutside from '../../utils/useOnClickOutside';
|
import useOnClickOutside from '../../utils/useOnClickOutside';
|
||||||
import LegacyPatientInfo from '../LegacyPatientInfo';
|
|
||||||
import { StringNumber } from '../../types';
|
import { StringNumber } from '../../types';
|
||||||
|
|
||||||
|
import LegacyPatientInfo from '../LegacyPatientInfo';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import ButtonGroup from '../ButtonGroup';
|
||||||
|
import Button from '../Button';
|
||||||
|
import LegacyCinePlayer from '../LegacyCinePlayer';
|
||||||
|
|
||||||
const LegacyViewportActionBar = ({
|
const LegacyViewportActionBar = ({
|
||||||
studyData,
|
studyData,
|
||||||
showNavArrows,
|
showNavArrows,
|
||||||
@ -75,7 +79,7 @@ const LegacyViewportActionBar = ({
|
|||||||
<div className="flex flex-1 grow mt-2 min-w-48">
|
<div className="flex flex-1 grow mt-2 min-w-48">
|
||||||
<div className="flex items-center">
|
<div className="flex items-center">
|
||||||
<span className="mr-2 text-white text-large">{label}</span>
|
<span className="mr-2 text-white text-large">{label}</span>
|
||||||
{showStatus && getStatusComponent()}
|
{showStatus && getStatusComponent && getStatusComponent()}
|
||||||
</div>
|
</div>
|
||||||
<div className="flex flex-col justify-start ml-4">
|
<div className="flex flex-col justify-start ml-4">
|
||||||
<div className="flex">
|
<div className="flex">
|
||||||
|
|||||||
@ -1,6 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
import { Icon } from '@ohif/ui';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
import ProgressLoadingBar from '../ProgressLoadingBar';
|
import ProgressLoadingBar from '../ProgressLoadingBar';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon } from '../';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const MeasurementItem = ({
|
const MeasurementItem = ({
|
||||||
uid,
|
uid,
|
||||||
|
|||||||
@ -34,6 +34,13 @@ MeasurementTable is a component that renders the MeasurementTables.
|
|||||||
name="Overview"
|
name="Overview"
|
||||||
args={{
|
args={{
|
||||||
title: 'Measurements',
|
title: 'Measurements',
|
||||||
|
servicesManager: {
|
||||||
|
services: {
|
||||||
|
customizationService: {
|
||||||
|
getCustomization: (title, data) => data.content,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{MeasurementTableTemplate.bind({})}
|
{MeasurementTableTemplate.bind({})}
|
||||||
@ -62,6 +69,13 @@ With data
|
|||||||
isActive: false,
|
isActive: false,
|
||||||
},
|
},
|
||||||
],
|
],
|
||||||
|
servicesManager: {
|
||||||
|
services: {
|
||||||
|
customizationService: {
|
||||||
|
getCustomization: (title, data) => data,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
{MeasurementTableTemplate.bind({})}
|
{MeasurementTableTemplate.bind({})}
|
||||||
|
|||||||
@ -1,12 +1,13 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import ReactModal from 'react-modal';
|
import ReactModal from 'react-modal';
|
||||||
|
import { useModal } from '../../contextProviders';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
|
||||||
import './Modal.css';
|
import './Modal.css';
|
||||||
|
|
||||||
import { Typography, Icon } from '../';
|
|
||||||
import { useModal } from '../../contextProviders';
|
|
||||||
|
|
||||||
if (typeof document !== 'undefined') {
|
if (typeof document !== 'undefined') {
|
||||||
ReactModal.setAppElement(document.getElementById('root'));
|
ReactModal.setAppElement(document.getElementById('root'));
|
||||||
}
|
}
|
||||||
@ -29,10 +30,11 @@ const Modal = ({
|
|||||||
const renderHeader = () => {
|
const renderHeader = () => {
|
||||||
return (
|
return (
|
||||||
title && (
|
title && (
|
||||||
<header className="flex items-center p-4 border-b-2 border-black bg-secondary-dark rounded-tl rounded-tr">
|
<header className="flex items-center px-[20px] py-[13px] bg-primary-dark rounded-tl rounded-tr">
|
||||||
<Typography
|
<Typography
|
||||||
variant="h4"
|
variant="h6"
|
||||||
className="flex grow text-primary-light font-light"
|
color="primaryLight"
|
||||||
|
className="flex grow !leading-[1.2]"
|
||||||
data-cy="modal-header"
|
data-cy="modal-header"
|
||||||
>
|
>
|
||||||
{title}
|
{title}
|
||||||
@ -41,7 +43,7 @@ const Modal = ({
|
|||||||
<Icon
|
<Icon
|
||||||
onClick={onClose}
|
onClick={onClose}
|
||||||
name="close"
|
name="close"
|
||||||
className="cursor-pointer text-primary-active w-6 h-6"
|
className="cursor-pointer text-primary-active"
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
</header>
|
</header>
|
||||||
@ -60,7 +62,7 @@ const Modal = ({
|
|||||||
shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}
|
shouldCloseOnOverlayClick={shouldCloseOnOverlayClick}
|
||||||
>
|
>
|
||||||
{renderHeader()}
|
{renderHeader()}
|
||||||
<section className="ohif-scrollbar modal-content overflow-y-auto px-4 py-6 rounded-bl rounded-br bg-primary-dark">
|
<section className="ohif-scrollbar modal-content overflow-y-auto px-[20px] pt-2 pb-[20px] rounded-bl rounded-br bg-primary-dark">
|
||||||
{children}
|
{children}
|
||||||
</section>
|
</section>
|
||||||
</ReactModal>
|
</ReactModal>
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
import React, { useEffect, useRef } from 'react';
|
import React, { useEffect, useRef } from 'react';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Button, Icon } from '../';
|
|
||||||
|
import Button from '../Button';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const Notification = ({
|
const Notification = ({
|
||||||
id,
|
id,
|
||||||
|
|||||||
@ -1,9 +1,11 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Icon, Tooltip } from '../';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
|
||||||
const classes = {
|
const classes = {
|
||||||
infoHeader: 'text-base text-primary-light',
|
infoHeader: 'text-base text-primary-light',
|
||||||
infoText: 'text-base text-white max-w-24 truncate',
|
infoText: 'text-base text-white max-w-24 truncate',
|
||||||
|
|||||||
@ -1,7 +1,11 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import { Icon, InputRange, CheckBox, InputNumber } from '../';
|
|
||||||
import classNames from 'classnames';
|
import classNames from 'classnames';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import InputRange from '../InputRange';
|
||||||
|
import CheckBox from '../CheckBox';
|
||||||
|
import InputNumber from '../InputNumber';
|
||||||
|
|
||||||
const ActiveSegmentationConfig = ({
|
const ActiveSegmentationConfig = ({
|
||||||
config,
|
config,
|
||||||
setRenderOutline,
|
setRenderOutline,
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon } from '@ohif/ui';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const SegmentItem = ({
|
const SegmentItem = ({
|
||||||
segmentIndex,
|
segmentIndex,
|
||||||
@ -66,7 +67,7 @@ const SegmentItem = ({
|
|||||||
{isSegmentIndexHovering && showSegmentDelete ? (
|
{isSegmentIndexHovering && showSegmentDelete ? (
|
||||||
<Icon
|
<Icon
|
||||||
name="close"
|
name="close"
|
||||||
className={classnames('w-5 h-5 pr-2')}
|
className={classnames('pr-0.5')}
|
||||||
onClick={e => {
|
onClick={e => {
|
||||||
e.stopPropagation();
|
e.stopPropagation();
|
||||||
onDelete(segmentationId, segmentIndex);
|
onDelete(segmentationId, segmentIndex);
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon } from '../';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const SegmentationItem = ({
|
const SegmentationItem = ({
|
||||||
id,
|
id,
|
||||||
@ -55,7 +56,7 @@ const SegmentationItem = ({
|
|||||||
<Icon
|
<Icon
|
||||||
name="close"
|
name="close"
|
||||||
className={classnames(
|
className={classnames(
|
||||||
'w-5 transition duration-500 text-center hover:opacity-80',
|
'w-[10px] transition duration-500 text-center hover:opacity-80',
|
||||||
{
|
{
|
||||||
'bg-primary-light text-black': isActive,
|
'bg-primary-light text-black': isActive,
|
||||||
'bg-primary-dark text-primary-light group-hover:bg-secondary-main': !isActive,
|
'bg-primary-dark text-primary-light group-hover:bg-secondary-main': !isActive,
|
||||||
|
|||||||
@ -1,8 +1,9 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Icon } from '../';
|
|
||||||
import SegmentationItem from './SegmentationItem';
|
import SegmentationItem from './SegmentationItem';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const SegmentationTable = ({
|
const SegmentationTable = ({
|
||||||
title,
|
title,
|
||||||
segmentations,
|
segmentations,
|
||||||
|
|||||||
@ -2,7 +2,8 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import ReactSelect, { components } from 'react-select';
|
import ReactSelect, { components } from 'react-select';
|
||||||
import { Icon } from '@ohif/ui';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
import './Select.css';
|
import './Select.css';
|
||||||
|
|
||||||
|
|||||||
@ -13,7 +13,10 @@ import { Swiper, SwiperSlide } from 'swiper/react';
|
|||||||
|
|
||||||
import { PanelService, ServicesManager, Types } from '@ohif/core';
|
import { PanelService, ServicesManager, Types } from '@ohif/core';
|
||||||
|
|
||||||
import { Button, Icon, IconButton, Tooltip } from '../';
|
import Button from '../Button';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import IconButton from '../IconButton';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
|
||||||
import 'swiper/css';
|
import 'swiper/css';
|
||||||
import 'swiper/css/navigation';
|
import 'swiper/css/navigation';
|
||||||
@ -75,7 +78,7 @@ const SidePanel = ({
|
|||||||
activeTabIndex: activeTabIndexProp,
|
activeTabIndex: activeTabIndexProp,
|
||||||
tabs,
|
tabs,
|
||||||
}) => {
|
}) => {
|
||||||
const panelService: PanelService = servicesManager.services.panelService;
|
const panelService: PanelService = servicesManager?.services?.panelService;
|
||||||
|
|
||||||
const { t } = useTranslation('SidePanel');
|
const { t } = useTranslation('SidePanel');
|
||||||
|
|
||||||
@ -128,23 +131,25 @@ const SidePanel = ({
|
|||||||
);
|
);
|
||||||
|
|
||||||
useEffect(() => {
|
useEffect(() => {
|
||||||
const activatePanelSubscription = panelService.subscribe(
|
if (panelService) {
|
||||||
panelService.EVENTS.ACTIVATE_PANEL,
|
const activatePanelSubscription = panelService.subscribe(
|
||||||
(activatePanelEvent: Types.ActivatePanelEvent) => {
|
panelService.EVENTS.ACTIVATE_PANEL,
|
||||||
if (!hasBeenOpened || activatePanelEvent.forceActive) {
|
(activatePanelEvent: Types.ActivatePanelEvent) => {
|
||||||
const tabIndex = tabs.findIndex(
|
if (!hasBeenOpened || activatePanelEvent.forceActive) {
|
||||||
tab => tab.id === activatePanelEvent.panelId
|
const tabIndex = tabs.findIndex(
|
||||||
);
|
tab => tab.id === activatePanelEvent.panelId
|
||||||
if (tabIndex !== -1) {
|
);
|
||||||
updateActiveTabIndex(tabIndex);
|
if (tabIndex !== -1) {
|
||||||
|
updateActiveTabIndex(tabIndex);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
);
|
||||||
);
|
|
||||||
|
|
||||||
return () => {
|
return () => {
|
||||||
activatePanelSubscription.unsubscribe();
|
activatePanelSubscription.unsubscribe();
|
||||||
};
|
};
|
||||||
|
}
|
||||||
}, [tabs, hasBeenOpened, panelService, updateActiveTabIndex]);
|
}, [tabs, hasBeenOpened, panelService, updateActiveTabIndex]);
|
||||||
|
|
||||||
const getCloseStateComponent = () => {
|
const getCloseStateComponent = () => {
|
||||||
|
|||||||
@ -32,6 +32,16 @@ SidePanel is a component that renders the SidePanels.
|
|||||||
args={{
|
args={{
|
||||||
side: 'left',
|
side: 'left',
|
||||||
defaultComponentOpen: 'Example',
|
defaultComponentOpen: 'Example',
|
||||||
|
tabs: [
|
||||||
|
{
|
||||||
|
id: 'tab1',
|
||||||
|
name: 'tab1',
|
||||||
|
label: 'Tab 1',
|
||||||
|
iconName: 'group-layers',
|
||||||
|
iconLabel: 'group-layers',
|
||||||
|
content: () => <div class="text-primary-light p-3">Hello</div>,
|
||||||
|
}
|
||||||
|
],
|
||||||
childComponents: [
|
childComponents: [
|
||||||
{
|
{
|
||||||
iconName: 'home',
|
iconName: 'home',
|
||||||
|
|||||||
@ -56,7 +56,7 @@ const SnackbarItem = ({ options, onClose }) => {
|
|||||||
onClick={handleClose}
|
onClick={handleClose}
|
||||||
className="w-5 h-5 rounded-full flex items-center justify-center self-start ml-auto relative left-[3px] top-[-3px] text-[#0944b3]"
|
className="w-5 h-5 rounded-full flex items-center justify-center self-start ml-auto relative left-[3px] top-[-3px] text-[#0944b3]"
|
||||||
>
|
>
|
||||||
<Icon name="close" className="w-5 h-5 text-black" />
|
<Icon name="close" className="text-black" />
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@ -4,7 +4,10 @@ import classNames from 'classnames';
|
|||||||
import OutsideClickHandler from 'react-outside-click-handler';
|
import OutsideClickHandler from 'react-outside-click-handler';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { Icon, Tooltip, ListMenu, ToolbarButton } from '../';
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
import ListMenu from '../ListMenu';
|
||||||
|
import ToolbarButton from '../ToolbarButton';
|
||||||
|
|
||||||
const baseClasses = {
|
const baseClasses = {
|
||||||
Button:
|
Button:
|
||||||
@ -92,7 +95,7 @@ const SplitButton = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const { t } = useTranslation('Buttons');
|
const { t } = useTranslation('Buttons');
|
||||||
|
|
||||||
const { toolbarService } = servicesManager.services;
|
const { toolbarService } = servicesManager?.services || {};
|
||||||
|
|
||||||
const { primaryToolId, toggles } = bState;
|
const { primaryToolId, toggles } = bState;
|
||||||
/* Bubbles up individual item clicks */
|
/* Bubbles up individual item clicks */
|
||||||
@ -146,7 +149,7 @@ const SplitButton = ({
|
|||||||
(isPrimaryToggle && toggles[state.primary.id] === true);
|
(isPrimaryToggle && toggles[state.primary.id] === true);
|
||||||
|
|
||||||
const PrimaryButtonComponent =
|
const PrimaryButtonComponent =
|
||||||
toolbarService.getButtonComponentForUIType(state.primary.uiType) ??
|
toolbarService?.getButtonComponentForUIType(state.primary.uiType) ??
|
||||||
ToolbarButton;
|
ToolbarButton;
|
||||||
|
|
||||||
const primaryButtonClassName = classes.Primary({
|
const primaryButtonClassName = classes.Primary({
|
||||||
|
|||||||
@ -2,7 +2,10 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { ButtonGroup, Button, StudyItem, ThumbnailList } from '../';
|
import StudyItem from '../StudyItem';
|
||||||
|
import ButtonGroup from '../ButtonGroup';
|
||||||
|
import Button from '../Button';
|
||||||
|
import ThumbnailList from '../ThumbnailList';
|
||||||
import { StringNumber } from '../../types';
|
import { StringNumber } from '../../types';
|
||||||
|
|
||||||
const getTrackedSeries = displaySets => {
|
const getTrackedSeries = displaySets => {
|
||||||
@ -171,7 +174,7 @@ StudyBrowser.propTypes = {
|
|||||||
),
|
),
|
||||||
};
|
};
|
||||||
|
|
||||||
const noop = () => { };
|
const noop = () => {};
|
||||||
|
|
||||||
StudyBrowser.defaultProps = {
|
StudyBrowser.defaultProps = {
|
||||||
onClickTab: noop,
|
onClickTab: noop,
|
||||||
|
|||||||
@ -2,7 +2,7 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
import { Icon } from '../';
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const baseClasses =
|
const baseClasses =
|
||||||
'first:border-0 border-t border-secondary-light cursor-pointer select-none outline-none';
|
'first:border-0 border-t border-secondary-light cursor-pointer select-none outline-none';
|
||||||
|
|||||||
@ -2,7 +2,11 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { Table, TableHead, TableBody, TableRow, TableCell } from '../';
|
import Table from '../Table';
|
||||||
|
import TableHead from '../TableHead';
|
||||||
|
import TableBody from '../TableBody';
|
||||||
|
import TableRow from '../TableRow';
|
||||||
|
import TableCell from '../TableCell';
|
||||||
|
|
||||||
const StudyListExpandedRow = ({
|
const StudyListExpandedRow = ({
|
||||||
seriesTableColumns,
|
seriesTableColumns,
|
||||||
@ -11,7 +15,6 @@ const StudyListExpandedRow = ({
|
|||||||
}) => {
|
}) => {
|
||||||
const { t } = useTranslation('StudyList');
|
const { t } = useTranslation('StudyList');
|
||||||
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full bg-black py-4 pl-12 pr-2">
|
<div className="w-full bg-black py-4 pl-12 pr-2">
|
||||||
<div className="block">{children}</div>
|
<div className="block">{children}</div>
|
||||||
|
|||||||
@ -2,7 +2,10 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import { Button, Icon, Typography, InputGroup } from '../';
|
import Button from '../Button';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
import InputGroup from '../InputGroup';
|
||||||
|
|
||||||
const StudyListFilter = ({
|
const StudyListFilter = ({
|
||||||
filtersMeta,
|
filtersMeta,
|
||||||
|
|||||||
@ -1,8 +1,12 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Button, ButtonGroup, Typography, Select } from '../';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
|
import Button from '../Button';
|
||||||
|
import ButtonGroup from '../ButtonGroup';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
import Select from '../Select';
|
||||||
|
|
||||||
const StudyListPagination = ({
|
const StudyListPagination = ({
|
||||||
onChangePage,
|
onChangePage,
|
||||||
currentPage,
|
currentPage,
|
||||||
|
|||||||
@ -1,9 +1,10 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon } from '../';
|
|
||||||
import getGridWidthClass from '../../utils/getGridWidthClass';
|
import getGridWidthClass from '../../utils/getGridWidthClass';
|
||||||
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const StudyListTableRow = props => {
|
const StudyListTableRow = props => {
|
||||||
const { tableData } = props;
|
const { tableData } = props;
|
||||||
const { row, expandedContent, onClickRow, isExpanded } = tableData;
|
const { row, expandedContent, onClickRow, isExpanded } = tableData;
|
||||||
|
|||||||
@ -2,7 +2,7 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { useDrag } from 'react-dnd';
|
import { useDrag } from 'react-dnd';
|
||||||
import { Icon } from '../';
|
import Icon from '../Icon';
|
||||||
import { StringNumber } from '../../types';
|
import { StringNumber } from '../../types';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
|
|||||||
@ -1,7 +1,9 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
|
|
||||||
import { Thumbnail, ThumbnailNoImage, ThumbnailTracked } from '../';
|
import Thumbnail from '../Thumbnail';
|
||||||
|
import ThumbnailNoImage from '../ThumbnailNoImage';
|
||||||
|
import ThumbnailTracked from '../ThumbnailTracked';
|
||||||
import * as Types from '../../types';
|
import * as Types from '../../types';
|
||||||
|
|
||||||
const ThumbnailList = ({
|
const ThumbnailList = ({
|
||||||
|
|||||||
@ -2,7 +2,9 @@ import React from 'react';
|
|||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { useDrag } from 'react-dnd';
|
import { useDrag } from 'react-dnd';
|
||||||
import { Icon, Tooltip, Typography } from '../';
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
|
||||||
const ThumbnailNoImage = ({
|
const ThumbnailNoImage = ({
|
||||||
displaySetInstanceUID,
|
displaySetInstanceUID,
|
||||||
|
|||||||
@ -2,7 +2,9 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
import { Icon, Thumbnail, Tooltip } from '../';
|
import Icon from '../Icon';
|
||||||
|
import Thumbnail from '../Thumbnail';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
import { StringNumber } from '../../types';
|
import { StringNumber } from '../../types';
|
||||||
|
|
||||||
const ThumbnailTracked = ({
|
const ThumbnailTracked = ({
|
||||||
|
|||||||
@ -2,7 +2,9 @@ import React from 'react';
|
|||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
|
|
||||||
import { IconButton, Icon, Tooltip } from '../';
|
import IconButton from '../IconButton';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
import Tooltip from '../Tooltip';
|
||||||
|
|
||||||
const ToolbarButton = ({
|
const ToolbarButton = ({
|
||||||
type = 'tool',
|
type = 'tool',
|
||||||
|
|||||||
@ -1,7 +1,8 @@
|
|||||||
import React, { useState, useRef, useEffect } from 'react';
|
import React, { useState, useRef, useEffect } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import classnames from 'classnames';
|
import classnames from 'classnames';
|
||||||
import { Icon } from '../';
|
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
const DELAY_TO_SHOW = 1000;
|
const DELAY_TO_SHOW = 1000;
|
||||||
const DELAY_TO_HIDE = 10; // it needs at least a little delay to prevent tooltip to suddenly hide
|
const DELAY_TO_HIDE = 10; // it needs at least a little delay to prevent tooltip to suddenly hide
|
||||||
|
|||||||
@ -46,6 +46,7 @@ const classes = {
|
|||||||
inherit: 'text-inherit',
|
inherit: 'text-inherit',
|
||||||
primary: 'text-primary-main',
|
primary: 'text-primary-main',
|
||||||
primaryActive: 'text-primary-active',
|
primaryActive: 'text-primary-active',
|
||||||
|
primaryLight: 'text-primary-light',
|
||||||
secondary: 'text-common-light',
|
secondary: 'text-common-light',
|
||||||
error: 'text-red-600',
|
error: 'text-red-600',
|
||||||
},
|
},
|
||||||
@ -133,7 +134,7 @@ Typography.propTypes = {
|
|||||||
'primaryActive',
|
'primaryActive',
|
||||||
'secondary',
|
'secondary',
|
||||||
'error',
|
'error',
|
||||||
'primaryActive',
|
'primaryLight',
|
||||||
]),
|
]),
|
||||||
className: PropTypes.string,
|
className: PropTypes.string,
|
||||||
children: PropTypes.node,
|
children: PropTypes.node,
|
||||||
|
|||||||
@ -1,8 +1,12 @@
|
|||||||
import React, { useState } from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Select, Typography, Button, HotkeysPreferences } from '../';
|
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
|
import Select from '../Select';
|
||||||
|
import Typography from '../Typography';
|
||||||
|
import Button from '../Button';
|
||||||
|
import HotkeysPreferences from '../HotkeysPreferences';
|
||||||
|
|
||||||
const UserPreferences = ({
|
const UserPreferences = ({
|
||||||
availableLanguages,
|
availableLanguages,
|
||||||
defaultLanguage,
|
defaultLanguage,
|
||||||
@ -63,8 +67,9 @@ const UserPreferences = ({
|
|||||||
<>
|
<>
|
||||||
<div className="border-b-2 border-black mb-2">
|
<div className="border-b-2 border-black mb-2">
|
||||||
<Typography
|
<Typography
|
||||||
variant="h5"
|
variant="inherit"
|
||||||
className="flex grow text-primary-light font-light pb-2"
|
color="primaryLight"
|
||||||
|
className="flex text-[16px] font-semibold pb-2 !leading-[1.2]"
|
||||||
>
|
>
|
||||||
{title}
|
{title}
|
||||||
</Typography>
|
</Typography>
|
||||||
@ -74,7 +79,7 @@ const UserPreferences = ({
|
|||||||
);
|
);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="p-2">
|
<>
|
||||||
<Section title={t('General')}>
|
<Section title={t('General')}>
|
||||||
<div className="flex flex-row justify-center items-center w-72">
|
<div className="flex flex-row justify-center items-center w-72">
|
||||||
<Typography variant="subtitle" className="mr-5 text-right h-full">
|
<Typography variant="subtitle" className="mr-5 text-right h-full">
|
||||||
@ -122,7 +127,7 @@ const UserPreferences = ({
|
|||||||
</Button>
|
</Button>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</>
|
||||||
);
|
);
|
||||||
};
|
};
|
||||||
|
|
||||||
|
|||||||
@ -1,6 +1,7 @@
|
|||||||
import React from 'react';
|
import React from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { LegacyViewportActionBar, Notification } from '../';
|
import LegacyViewportActionBar from '../LegacyViewportActionBar';
|
||||||
|
import Notification from '../Notification';
|
||||||
|
|
||||||
const Viewport = ({
|
const Viewport = ({
|
||||||
viewportId,
|
viewportId,
|
||||||
|
|||||||
@ -7,10 +7,11 @@ import React, {
|
|||||||
useRef,
|
useRef,
|
||||||
useState,
|
useState,
|
||||||
} from 'react';
|
} from 'react';
|
||||||
import { Icon } from '..';
|
|
||||||
import { useResizeObserver } from '../../hooks';
|
import { useResizeObserver } from '../../hooks';
|
||||||
import useOnClickOutside from '../../utils/useOnClickOutside';
|
import useOnClickOutside from '../../utils/useOnClickOutside';
|
||||||
|
|
||||||
import PatientInfo from '../PatientInfo';
|
import PatientInfo from '../PatientInfo';
|
||||||
|
import Icon from '../Icon';
|
||||||
|
|
||||||
export type ViewportActionBarProps = {
|
export type ViewportActionBarProps = {
|
||||||
studyData: any;
|
studyData: any;
|
||||||
|
|||||||
@ -7,16 +7,14 @@ import React, {
|
|||||||
} from 'react';
|
} from 'react';
|
||||||
import { useTranslation } from 'react-i18next';
|
import { useTranslation } from 'react-i18next';
|
||||||
|
|
||||||
import {
|
import Typography from '../Typography';
|
||||||
Typography,
|
import Input from '../Input';
|
||||||
Input,
|
import Tooltip from '../Tooltip';
|
||||||
Tooltip,
|
import IconButton from '../IconButton';
|
||||||
IconButton,
|
import Icon from '../Icon';
|
||||||
Icon,
|
import Select from '../Select';
|
||||||
Select,
|
import InputLabelWrapper from '../InputLabelWrapper';
|
||||||
InputLabelWrapper,
|
import Button from '../Button';
|
||||||
Button,
|
|
||||||
} from '../';
|
|
||||||
|
|
||||||
const FILE_TYPE_OPTIONS = [
|
const FILE_TYPE_OPTIONS = [
|
||||||
{
|
{
|
||||||
|
|||||||
@ -219,7 +219,7 @@ const DialogProvider = ({ children, service }) => {
|
|||||||
isDragging && 'dragging',
|
isDragging && 'dragging',
|
||||||
isDraggable && 'draggable'
|
isDraggable && 'draggable'
|
||||||
)}
|
)}
|
||||||
style={{ zIndex: '999', position: 'absolute' }}
|
style={{ zIndex: '999', position: 'absolute', width: '350px' }}
|
||||||
onClick={() => _bringToFront(id)}
|
onClick={() => _bringToFront(id)}
|
||||||
>
|
>
|
||||||
<DialogContent {...dialog} {...contentProps} />
|
<DialogContent {...dialog} {...contentProps} />
|
||||||
|
|||||||
@ -1,4 +1,4 @@
|
|||||||
{
|
{
|
||||||
"version": "3.5.0",
|
"version": "3.6.0-beta.3",
|
||||||
"commit": "16afa740b60b31037100444ef9311b80ffea2f67"
|
"commit": "3d8cc9801a8a0b2add8f2b57b5a8498d9f0522c4"
|
||||||
}
|
}
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user