ohif-viewer/platform/ui
Danny Brown 2cdef4b984
feat: responsive study list (#1068)
* feat: 🎸 Load spinner when selecting gcloud store. Add key on td

* feat: 🎸 Code review. Translate loading study status

* feat: 🎸 Code review. Minor code refactoring

* fix: add missing study and index declerations

* Newer version of react-dates (calendar input component)

* Add useMedia hook

* Add useDebounce hook

* Export hooks for consumption

* Pull search filter into own component

* StudyListWithData to StudyListRoute

* Rename pagination component

* Rename Toolbar

* CustomeDateRangePicker to plain ol' css

* Remove unused styles

* Misc

* Magic to make our "OR" filters work

* Play w/ Mobile styles

* Fix pagination pushing out max width for viewport

* Tidy up small and medium templates

* Remove unecessary nesting

* Better mobile header and logo styles

* Fix studyList font size

* Remove unused code

* hookup on click

* Fix table search selectors

* Cypress uses medium width

* Remove irrelevant test

* Fix primary sort

* Fix sort for our smaller displays

* fix study list sometimes longer than specified rowsPerPage

* Simplify date picker styles

* restore study date filters

* Fix about table styling

* fix take value for search

* Fix header sizing for viewer and list route

* Remove dead code

* Restore isLoading

* Update platform/ui/src/components/studyList/StudyList.styl

Co-Authored-By: Rodrigo Antinarelli <rodrigoantinarelli@gmail.com>

* Attempt first usage of translations w/ hooks

* Pull from react-i18n library

* Fit presets on to a single line

* add no results message

* Show error message in studyList table

* Update input selectors for e2e tests

* Make sure messages span all columns

* fix test selector for table results

* Skip hover for result rows

* fix imports

* Date filtering w/ config

* Default export

* Pushed to PageComponent

* Remove DropZone

This previously only worked for null/undefined studies. I'm unable to trigger the state by testing the data. This "might" have happened when using a fresh/empty PACS; but even an empty array of studies would not show
2019-10-28 14:47:57 -04:00
..
.webpack fix: measurementsAPI issue caused by production build (#842) 2019-09-04 13:53:13 -04:00
public Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
src feat: responsive study list (#1068) 2019-10-28 14:47:57 -04:00
.all-contributorsrc Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
.env Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
app.css Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
babel.config.js Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
CHANGELOG.md chore(release): publish [skip ci] 2019-10-28 03:19:19 +00:00
doczrc.js Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
jest.config.js Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
LICENSE Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
package.json feat: responsive study list (#1068) 2019-10-28 14:47:57 -04:00
postcss.config.js Chore/kill yalc with fire (#629) 2019-08-13 15:36:46 -04:00
README.md chore: update references to ohif-core and react-viewerbase 2019-09-05 21:52:45 -04:00

@ohif/ui

@ohif/ui is a collection of components and utilities that power OHIF's zero-footprint DICOM viewer.


NPM version NPM downloads All Contributors MIT License

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):

Erik Ziegler
Erik Ziegler

💻 🚧
Danny Brown
Danny Brown

💻 🚧
Gustavo André Lelis
Gustavo André Lelis

💻 🚧
Thiago Maltempi
Thiago Maltempi

💻
Esref Durna
Esref Durna

💻
Steve Pieper
Steve Pieper

💻
Biharck Araujo
Biharck Araujo

💻
Rodrigo Antinarelli
Rodrigo Antinarelli

💻
João Felipe de Medeiros Moreira
João Felipe de Medeiros Moreira

💻
James Gosbell
James Gosbell

💻
Evren Ozkan
Evren Ozkan

💻
Zach S.
Zach S.

💻
Mete Ugur Akdogan
Mete Ugur Akdogan

💻

This project follows the all-contributors specification. Contributions of any kind welcome!

License

MIT © OHIF