* feat: 🎸 New modal provider A new modal provider/context component to unify modal related code and simplify modal use Closes: #1086 * refactor(ModalContext): Keep current modal lib * Update modal provider version according to PR #1116 * Update modal provider props to use inner props * Add custom class prop * CR Update: Refactor provider to extract specific modal * Fix modal import * CR Update: Move from spread to object assign * CR Update: Add proptypes, use classnames dependency over interpolation and rename modal * fix: 🎸 Update AboutModal to use new modal provider (#1116) * feat: 🎸 Update AboutModal to use new modal provider This feature updates the AboutModal component and Header to use the new modal context (modal provider) * feat(ModalProvider): Add title prop to provider * fix(ModalContext): Add defaults on hide * CR Updates: Refactor modal provider and fix import * CR Update: Expose props and flat modal optons * Use customclassname instead of static * Add cypress tag * test: set right viewport when layout is decreased (#1146) * chore(release): publish [skip ci] - @ohif/viewer@2.3.6 * fix: 🐛 Minor issues measurement panel related to description (#1142) * chore(release): publish [skip ci] - @ohif/extension-vtk@0.52.28 - @ohif/ui@0.58.5 - @ohif/viewer@2.3.7 * fix: 🐛 Upgrade react-vtkjs-viewport to fix volume orientation (#1143) * chore(release): publish [skip ci] - @ohif/extension-vtk@0.52.29 - @ohif/viewer@2.3.8 * CR Update: Extract and rename AboutModal to AboutContent * feat: 🎸 New modal provider (#1110) * feat: 🎸 New modal provider A new modal provider/context component to unify modal related code and simplify modal use Closes: #1086 * refactor(ModalContext): Keep current modal lib * Update modal provider version according to PR #1116 * Update modal provider props to use inner props * Add custom class prop * CR Update: Refactor provider to extract specific modal * Fix modal import * CR Update: Move from spread to object assign * CR Update: Add proptypes, use classnames dependency over interpolation and rename modal * chore(release): publish [skip ci] - @ohif/extension-vtk@0.52.30 - @ohif/ui@0.59.0 - @ohif/viewer@2.4.0 * CR Update: Keep translation name * CR Update: Reposition cy tag of about modal in the correct level * feat: 🎸 Update DownloadModal to use new modal provider (#1119) * feat: 🎸 Update AboutModal to use new modal provider This feature updates the AboutModal component and Header to use the new modal context (modal provider) * feat(ModalProvider): Add title prop to provider * feat(DownloadModal): Refactor to use new modal provider * Update modal provider props * Use translation for DownloadDialog * CR Update: Use useTranslation hook * CR Update: Extract downloadDialog and rename to downloadContent * CR Update: Fix typo * CR Update: Rename download content to viewport download form |
||
|---|---|---|
| .. | ||
| .webpack | ||
| public | ||
| src | ||
| .all-contributorsrc | ||
| .env | ||
| app.css | ||
| babel.config.js | ||
| CHANGELOG.md | ||
| doczrc.js | ||
| jest.config.js | ||
| LICENSE | ||
| package.json | ||
| postcss.config.js | ||
| README.md | ||
@ohif/ui
@ohif/ui is a collection of components and utilities that power OHIF's zero-footprint DICOM viewer.
This set of "Medical Imaging Viewer" React components are maintained separately to:
- Decouple presentation from business logic
- Test and develop components in isolation
- Provide well documented, reusable components
- Aid rapid application development for context specific viewers
Install
This component library is pre- v1.0. All realeases until a v1.0 have the possibility of introducing breaking changes. Please depend on an "exact" version in your projects to prevent issues caused by loose versioning.
For full installation instructions, be sure to check out our getting started guide.
// with npm
npm i @ohif/ui --save-exact
// with yarn
yarn add @ohif/ui --exact
Usage
import React, { Component } from 'react';
import { LayoutButton } from '@ohif/ui';
class Example extends Component {
constructor(props) {
super(props);
this.state = {
selectedCell: {
className: 'hover',
col: 1,
row: 1,
},
};
}
render() {
return (
<LayoutButton
selectedCell={this.state.selectedCell}
onChange={cell => this.setState({ selectedCell: cell })}
/>
);
}
}
Developing Locally
Restore dependencies after cloning:
# Restore workspace dependencies (from repository root)
yarn install
# From project root
yarn run dev:ui
# OR from this project's directory
yarn run dev
Contributors ✨
Thanks goes to these wonderful people (emoji key):
This project follows the all-contributors specification. Contributions of any kind welcome!
License
MIT © OHIF