cornerstonejs / react-cornerstone-viewport

Cornerstone medical image viewport component for React
https://react.cornerstonejs.org/
MIT License
96 stars 74 forks source link

Feature request: Props documentation for main component #162

Open Shubhambawner opened 1 year ago

Shubhambawner commented 1 year ago

description: strongly needed the guide to use this project optimally. Although it is mentioned on the website that this job is in progress, I did not see any live/ongoing PR or issue or branch linked to this. So, It seems this was one of the backlogs and needs to be put done. (If by accident I have missed an ongoing work this issue may be closed with that reason)

reference: https://react.cornerstonejs.org/props

further, I am putting the observed prop types in below comment:

Shubhambawner commented 1 year ago
static propTypes = {
    imageIds: PropTypes.arrayOf(PropTypes.string).isRequired,
    imageIdIndex: PropTypes.number,
    // Controlled
    activeTool: PropTypes.string,
    tools: PropTypes.arrayOf(
      PropTypes.oneOfType([
        // String
        PropTypes.string,
        // Object
        PropTypes.shape({
          name: PropTypes.string, // Tool Name
          toolClass: PropTypes.func, // Custom (ToolClass)
          props: PropTypes.Object, // Props to Pass to `addTool`
          mode: PropTypes.string, // Initial mode, if one other than default
          modeOptions: PropTypes.Object, // { mouseButtonMask: [int] }
        }),
      ])
    ),
    // Optional
    // isActive ?? classname -> active
    children: PropTypes.node,
    cornerstoneOptions: PropTypes.object, // cornerstone.enable options
    isStackPrefetchEnabled: PropTypes.bool, // should prefetch?
    // CINE
    isPlaying: PropTypes.bool,
    frameRate: PropTypes.number, // Between 1 and ?
    //
    initialViewport: PropTypes.object,
    setViewportActive: PropTypes.func, // Called when viewport should be set to active?
    onNewImage: PropTypes.func,
    onNewImageDebounced: PropTypes.func,
    onNewImageDebounceTime: PropTypes.number,
    viewportOverlayComponent: PropTypes.oneOfType([
      PropTypes.string,
      PropTypes.func,
    ]),
    // Cornerstone Events
    onElementEnabled: PropTypes.func, // Escape hatch
    eventListeners: PropTypes.arrayOf(
      PropTypes.shape({
        target: PropTypes.oneOf(['element', 'cornerstone']).isRequired,
        eventName: PropTypes.string.isRequired,
        handler: PropTypes.func.isRequired,
      })
    ),
    startLoadHandler: PropTypes.func,
    endLoadHandler: PropTypes.func,
    loadIndicatorDelay: PropTypes.number,
    loadingIndicatorComponent: PropTypes.oneOfType([
      PropTypes.element,
      PropTypes.func,
    ]),
    /** false to enable automatic viewport resizing */
    enableResizeDetector: PropTypes.bool,
    /** rate at witch to apply resize mode's logic */
    resizeRefreshRateMs: PropTypes.number,
    /** whether resize refresh behavior is exhibited as throttle or debounce */
    resizeRefreshMode: PropTypes.oneOf(['throttle', 'debounce']),
    //
    style: PropTypes.object,
    className: PropTypes.string,
    isOverlayVisible: PropTypes.bool,
    orientationMarkers: PropTypes.arrayOf(PropTypes.string),
  };

  static defaultProps = {
    // Watch
    imageIdIndex: 0,
    isPlaying: false,
    cineFrameRate: 24,
    viewportOverlayComponent: ViewportOverlay,
    imageIds: ['no-id://'],
    initialViewport: {},
    // Init
    cornerstoneOptions: {},
    isStackPrefetchEnabled: false,
    isOverlayVisible: true,
    loadIndicatorDelay: 45,
    loadingIndicatorComponent: LoadingIndicator,
    enableResizeDetector: true,
    resizeRefreshRateMs: 200,
    resizeRefreshMode: 'debounce',
    tools: [],
    onNewImageDebounceTime: 0,
    orientationMarkers: ['top', 'left'],
  };
pooch-tonic commented 1 year ago

+1 for this to be updated. I'm struggling to understand what's really possible and what's not in this react wrapped component compared to the standard cornerstone lib.

JetJacobs commented 1 year ago

Bump! I'm not too familiar with the library, but have gone back and forth deciding if I should attempt to use the standard cornerstone library to write something that matches my specific need.