Chore/kill yalc with fire (#629)

* init * more shifting * Move @babel dependencies up to workspace root * Begin updating dependent libraries to use sync'd webpack builds w/ watches * Commit changes before a long weekend * Split packages into platform and extensions * Consolidate how/where we specify file/module type entrypoints * Make it possible to pass in extensions as App props * Resolve viewer's modules * Target for UMD bundle * Add Webpack Stylus loader * Provide WebPack build options for microscopy, vtk, and ui * Better entrypoint for extensions * Push changes up to switch PCs * Fix ESM symlink build for Viewers * Shift docs to root * Specify additional lerna config props * Begin providing basic readme info * Rename example extension folder * Shift links to bottom of doc * First attempt at a netlify deploy preview * Attempt to fix deploy preview build * push workspace enabled to initial command; remove second yarn install; use npx to call gitbook cli commands * Try to use global gitbook-cli * Export node_modules path * More agressive with modifying PATH * Follow deploy log output advice * try again to set bin path * Try swapping bash with a new shell * Try bash -l instead of exec bash * Annd let's try again * and again * We may have figured it out johnny, boy * We need to pull cornerstone-wado-image-loader files from hoisted node_modules * Attempt to fix ticks/escapes * Change copy syntax; try running tests on viewers from root for circleci * Lower version to match circleci image * Try alternative jest-canvas-mock location and version file syntax * Run version command instead of calling node directly * Try alternative jest transform * Set path and enable workspaces * Add codecov flags * Use cpx so our copying finishes? * Get all platform unit tests to run * Run and report individually and in parallel * Try once relying on codecov yaml to split w/ flags * Add projects to split by flags * Generate separate reports * Trigger codecov after everything has finished running; these may not support flags * Use recommended flags from issue comments for codecov * Fix typo * Remove clear flag * Shift back to calling codecov from root * Generate example for codecov issue * Try fixing paths * Simplify * Try using codecov orb * Bump circleci version * Upload core and viewer * Use full string paths * Remove individual codecov calls * Fix dir * Combine files before upload * Escape anchors * tryfix syntax * Escape string literal * Combine lines to reduce path * long paths * Use home alias * Fix filename * Try to see the contents of our cat'd file * Also upload `core` * Try running with aliased folder * Fix path; split PR and Merge unit tests into separate jobs * Set default threshold * Fix typo * Changing to scoped package names * Adding note * Catch more updates * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.0 - @ohif/extension-dicom-html@0.0.4-alpha.0 - @ohif/extension-dicom-microscopy@0.0.9-alpha.0 - @ohif/extension-dicom-pdf@0.0.8-alpha.0 - @ohif/extension-vtk@0.1.4-alpha.0 - @ohif/core@0.11.1-alpha.0 - @ohif/i18n@0.2.3-alpha.0 - @ohif/ui@0.2.18-alpha.0 - @ohif/viewer@0.0.22-alpha.0 * Clean up primary readme * Support for dev and dev:* commands * Shift build command; satisfy default PWA build * Remove old scripts * Clean up UI to set webpack scripts * Tidy up project links * Clean duplicate code in UI project * Update UI project's docs * Clean up ui and i18n config * Reduce duplicate code in `@ohif/core` * Fix @ohif/ui versions * bump @ohif/core versions * Redux testkit dep * Remove unused/duplicate config files for projects/packages * ohif-core --> @ohif/core * Safer publish command * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.1 - @ohif/extension-dicom-html@0.0.4-alpha.1 - @ohif/extension-dicom-microscopy@0.0.9-alpha.1 - @ohif/extension-dicom-pdf@0.0.8-alpha.1 - @ohif/extension-vtk@0.1.4-alpha.1 - @ohif/core@0.11.1-alpha.1 - @ohif/i18n@0.2.3-alpha.1 - @ohif/ui@0.2.18-alpha.1 - @ohif/viewer@0.0.22-alpha.1 * test version bump * Add global prettier config * chore(release): publish %s [skip ci] - @ohif/viewer@0.0.22-alpha.2 * test lerna publish * Update package.jsons * Fix build scripts * catch changes * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.2 - @ohif/extension-dicom-html@0.0.4-alpha.2 - @ohif/extension-dicom-microscopy@0.0.9-alpha.2 - @ohif/extension-dicom-pdf@0.0.8-alpha.2 - @ohif/extension-vtk@0.1.4-alpha.2 - @ohif/core@0.11.1-alpha.2 - @ohif/i18n@0.2.3-alpha.2 - @ohif/ui@0.2.18-alpha.2 - @ohif/viewer@0.0.22-alpha.3 * fix eslint issues caused by eslint 6 and our react-app config * Publish with canary tag * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.3 - @ohif/extension-dicom-html@0.0.4-alpha.3 - @ohif/extension-dicom-microscopy@0.0.9-alpha.3 - @ohif/extension-dicom-pdf@0.0.8-alpha.3 - @ohif/extension-vtk@0.1.4-alpha.3 - @ohif/core@0.11.1-alpha.3 - @ohif/i18n@0.2.3-alpha.3 - @ohif/ui@0.2.18-alpha.3 - @ohif/viewer@0.0.22-alpha.4 * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.4 - @ohif/extension-dicom-html@0.0.4-alpha.4 - @ohif/extension-dicom-microscopy@0.0.9-alpha.4 - @ohif/extension-dicom-pdf@0.0.8-alpha.4 - @ohif/extension-vtk@0.1.4-alpha.4 - @ohif/core@0.11.1-alpha.4 - @ohif/i18n@0.2.3-alpha.4 - @ohif/ui@0.2.18-alpha.4 - @ohif/viewer@0.0.22-alpha.5 * Simplify build * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.5 - @ohif/extension-dicom-html@0.0.4-alpha.5 - @ohif/extension-dicom-microscopy@0.0.9-alpha.5 - @ohif/extension-dicom-pdf@0.0.8-alpha.5 - @ohif/extension-vtk@0.1.4-alpha.5 - @ohif/core@0.11.1-alpha.5 - @ohif/i18n@0.2.3-alpha.5 - @ohif/ui@0.2.18-alpha.5 - @ohif/viewer@0.0.22-alpha.6 * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.6 - @ohif/extension-dicom-html@0.0.4-alpha.6 - @ohif/extension-dicom-microscopy@0.0.9-alpha.6 - @ohif/extension-dicom-pdf@0.0.8-alpha.6 - @ohif/extension-vtk@0.1.4-alpha.6 - @ohif/core@0.11.1-alpha.6 - @ohif/i18n@0.2.3-alpha.6 - @ohif/ui@0.2.18-alpha.6 - @ohif/viewer@0.0.22-alpha.7 * Split version and publish * chore(release): publish %s [skip ci] - @ohif/extension-cornerstone@0.0.39-alpha.7 - @ohif/extension-dicom-html@0.0.4-alpha.7 - @ohif/extension-dicom-microscopy@0.0.9-alpha.7 - @ohif/extension-dicom-pdf@0.0.8-alpha.7 - @ohif/extension-vtk@0.1.4-alpha.7 - @ohif/core@0.11.1-alpha.7 - @ohif/i18n@0.2.3-alpha.7 - @ohif/ui@0.2.18-alpha.7 - @ohif/viewer@0.0.22-alpha.8 * Try simplify netlify build * react-viewerbase --> @ohif/ui * add test for stylus loader * Try new way to specify publish path * Use an output folder that won't be ignored * Try move command * fiddle with paths * Dig for some information * Make sure we're in root for our commands * Remove discovery * Setup script-tag example * Fix typo * Move config folder * Update cornerstone extension to use shared/root webpack configs * capture changes * Update extension webpack configs * Don't check in docz output * Fix babel runtime resolution issue * Simplify ui build steps * Push in progress * Shift directories * Get viewer dev path to work * Fix viewer commonjs build * Fix build pwa config for viewers * Make sure our package specific command can be called from root * Update notes * Fix imports and misc. merge notes * Bump wado-image-loader version * Switch up commands to remove webworkers copy * Fix CI config * Fix more broken package references * Add react-dropzone * Persist so e2e test can use * Fix lockfile * Use cypress orb to simplify CI * Fix config * Try again * Install yarn latest for orb * Install yarn a different way * Wait on correct port * Run tests in viewer project * Fix cypress config * Make Cypress happier - use default location * Simplify e2e testing * Capture UI changes since fork * Catch core up * Grab latest deps after merge * Fix broken import * Make sure cornerstone-wado-image-loader resolves to 3+ * Note regarding orbs * Fix refresh on 404 routes * Fix odd error for cornerstone-wado-image-loader * Different target for UMD * Simplify dev script * Try to get fancy with netlify output * Let's do it again * Try to fix measurementTools issue * See if we can get our lerna magic to work on merge to monorepo branch
2019-08-13 15:36:46 -04:00
1 parent cac911f08e
commit 08ff214ea6
@@ -0,0 +1,37 @@
+import { Component } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
+
+export default class InputRadio extends Component {
+  static propTypes = {
+    value: PropTypes.string,
+    label: PropTypes.string.isRequired,
+    itemData: PropTypes.object.isRequired,
+    labelClass: PropTypes.string,
+    id: PropTypes.string.isRequired,
+    onSelected: PropTypes.func.isRequired,
+  };
+
+  render() {
+    const labelClass = this.props.labelClass ? this.props.labelClass : '';
+    return (
+      <label
+        className={'wrapperLabel radioLabel ' + labelClass}
+        htmlFor={this.props.id}
+      >
+        <input
+          type="radio"
+          id={this.props.id}
+          className="radioInput"
+          value={this.props.value}
+          onChange={this.onSelected}
+        />
+        <span className="wrapperText">{this.props.label}</span>
+      </label>
+    );
+  }
+
+  onSelected = evt => {
+    this.props.onSelected(evt, this.props.itemData);
+  };
+}
@@ -0,0 +1,192 @@
+import './SelectTree.styl';
+
+import React, { Component } from 'react';
+
+import { Icon } from './../../elements/Icon';
+import InputRadio from './InputRadio.js';
+import PropTypes from 'prop-types';
+import SelectTreeBreadcrumb from './SelectTreeBreadcrumb.js';
+import cloneDeep from 'lodash.clonedeep';
+
+export class SelectTree extends Component {
+  static propTypes = {
+    autoFocus: PropTypes.bool,
+    searchEnabled: PropTypes.bool,
+    selectTreeFirstTitle: PropTypes.string,
+    selectTreeSecondTitle: PropTypes.string,
+    /** Called when 'componentDidUpdate' is triggered */
+    onComponentChange: PropTypes.func,
+    /** [{ label, value, items[]}] - An array of items than can be expanded to show child items */
+    items: PropTypes.array.isRequired,
+    /** fn(evt, item) - Called when a child item is selected; receives event and selected item */
+    onSelected: PropTypes.func.isRequired,
+  };
+
+  static defaultProps = {
+    searchEnabled: true,
+    autoFocus: true,
+    selectTreeFirstTitle: 'First Level itens',
+    items: [],
+  };
+
+  constructor(props) {
+    super(props);
+
+    this.state = {
+      searchTerm: null,
+      currentNode: null,
+      value: null,
+    };
+  }
+
+  render() {
+    const treeItems = this.getTreeItems();
+
+    return (
+      <div className="selectTree selectTreeRoot">
+        <div className="treeContent">
+          {this.headerItem()}
+          <div className="treeOptions">
+            {this.state.currentNode && (
+              <SelectTreeBreadcrumb
+                onSelected={this.onBreadcrumbSelected}
+                label={this.state.currentNode.label}
+                value={this.state.currentNode.value}
+              />
+            )}
+            <div className="treeInputsWrapper">
+              <div className="treeInputs">{treeItems}</div>
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+
+  componentDidUpdate = () => {
+    if (this.props.onComponentChange) {
+      this.props.onComponentChange();
+    }
+  };
+
+  isLeafSelected = item => item && !Array.isArray(item.items);
+
+  getLabelClass = item => {
+    let labelClass = 'treeLeaf';
+    if (this.state.searchTerm || Array.isArray(item.items)) {
+      labelClass = 'treeNode';
+    }
+    return labelClass;
+  };
+
+  filterItems() {
+    const filteredItems = [];
+    const rawItems = cloneDeep(this.props.items);
+    rawItems.forEach(item => {
+      if (Array.isArray(item.items)) {
+        item.items.forEach(item => {
+          const label = item.label.toLowerCase();
+          const searchTerm = this.state.searchTerm.toLowerCase();
+          if (label.indexOf(searchTerm) !== -1) {
+            filteredItems.push(item);
+          }
+        });
+      } else {
+        const label = item.label.toLowerCase();
+        const searchTerm = this.state.searchTerm.toLowerCase();
+        if (label.indexOf(searchTerm) !== -1) {
+          filteredItems.push(item);
+        }
+      }
+    });
+    return filteredItems;
+  }
+
+  getTreeItems() {
+    const storageKey = 'SelectTree';
+    let treeItems;
+
+    if (this.state.searchTerm) {
+      treeItems = this.filterItems();
+    } else if (this.state.currentNode) {
+      treeItems = cloneDeep(this.state.currentNode.items);
+    } else {
+      treeItems = cloneDeep(this.props.items);
+    }
+
+    return treeItems.map((item, index) => {
+      let itemKey = index;
+      if (this.state.currentNode) {
+        itemKey += `_${this.state.currentNode.value}`;
+      }
+      return (
+        <InputRadio
+          key={itemKey}
+          id={`${storageKey}_${item.value}`}
+          name={index}
+          itemData={item}
+          value={item.value}
+          label={item.label}
+          labelClass={this.getLabelClass(item)}
+          onSelected={this.onSelected}
+        />
+      );
+    });
+  }
+
+  headerItem = () => {
+    let title = this.props.selectTreeFirstTitle;
+    if (this.state.currentNode && this.props.selectTreeSecondTitle) {
+      title = this.props.selectTreeSecondTitle;
+    }
+
+    return (
+      <div className="wrapperLabel treeHeader">
+        <div className="wrapperText">{title}</div>
+        {this.props.searchEnabled && (
+          <div className="wrapperSearch">
+            <div className="searchIcon">
+              <Icon name="search" />
+            </div>
+            <input
+              type="text"
+              className="searchInput"
+              placeholder="Search labels"
+              autoFocus={this.props.autoFocus}
+              onChange={this.searchLocations}
+              value={this.state.searchTerm ? this.state.searchTerm : ''}
+            />
+          </div>
+        )}
+      </div>
+    );
+  };
+
+  searchLocations = evt => {
+    this.setState({
+      currentNode: null,
+      searchTerm: evt.currentTarget.value,
+    });
+  };
+
+  onSelected = (event, item) => {
+    if (this.isLeafSelected(item)) {
+      this.setState({
+        searchTerm: null,
+        currentNode: null,
+        value: null,
+      });
+    } else {
+      this.setState({
+        currentNode: item,
+      });
+    }
+    return this.props.onSelected(event, item);
+  };
+
+  onBreadcrumbSelected = () => {
+    this.setState({
+      currentNode: null,
+    });
+  };
+}
@@ -0,0 +1,108 @@
+@import './../../design/styles/common/global.styl'
+
+.selectTreeRoot
+  text-align: initial;
+  width: 320px;
+  max-height: inherit;
+  font-size: 14px;
+  line-height: 26px;
+
+  .treeContent
+    max-height: inherit;
+    overflow: hidden;
+    border: 1px solid #c4c4c4;
+    border-radius: 5px;
+    background-color: #ffffff;
+    display: flex;
+    flex-direction: column;
+
+  .treeHeader
+    background-color: #c0c0c0;
+    border-bottom: 1px solid #c4c4c4;
+    color: #303030;
+    padding: 5px;
+    text-align: center;
+
+    .wrapperText
+      font-weight: bold;
+      padding-bottom: 2px;
+
+    .wrapperSearch
+      width: 100%;
+
+    .searchIcon
+      position: absolute;
+      width: 18px;
+      height: 15px;
+      margin: 7px 10px 13px 10px;
+      color: #a3a3a3;
+
+    .searchInput
+      width: 100%;
+      padding: 6px 12px 6px 35px;
+      background-color: #fff;
+      background-image: none;
+      border: 1px solid #9b9b9b;
+      border-radius: 4px;
+      font-size: 14px;
+      line-height: 1.42857143;
+      color: #555;
+      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
+      transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
+
+      &:focus
+        outline: 0;
+        box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075),
+          0 0 8px rgba(102, 175, 233, 0.6);
+
+  .wrapperText
+    white-space: nowrap;
+    cursor: pointer;
+
+  .selectTreeBreadcrumb
+    .wrapperLabel
+      cursor: pointer;
+      padding: 0 12px;
+      height: 41px;
+      width: 100%;
+      line-height: 41px;
+
+    .backIcon
+      padding-right: 10px;
+
+      svg
+        width: 14px;
+        height: 14px;
+        position: relative;
+        top: 2px;
+        color: #457fb0;
+
+  .treeOptions
+    overflow: auto;
+    height: 100%;
+
+    .selectTreeBreadcrumb + .treeInputsWrapper .treeInputs .treeLeaf
+      border: none;
+      height: initial;
+      line-height: 26px;
+
+    & > .treeInputsWrapper > .treeInputs .treeLeaf
+      border-bottom: 1px solid #ccc;
+      height: 41px;
+      line-height: 41px;
+
+  .treeNode, .treeLeaf
+    cursor: pointer;
+    display: block;
+    overflow: hidden;
+    font-weight: normal;
+    box-shadow: 0 0 0 200px transparent;
+    padding: 0 12px;
+
+  .treeNode
+    border-bottom: 1px solid #ccc;
+    height: 41px;
+    line-height: 41px;
+
+  .radioLabel .radioInput
+    display: none;
@@ -0,0 +1,37 @@
+import { Component } from 'react';
+import React from 'react';
+import PropTypes from 'prop-types';
+import { Icon } from './../../elements/Icon';
+
+export default class SelectTreeBreadcrumb extends Component {
+  static propTypes = {
+    label: PropTypes.string.isRequired,
+    value: PropTypes.string.isRequired,
+    onSelected: PropTypes.func.isRequired,
+  };
+
+  render() {
+    return (
+      <div className="selectTreeBreadcrumb">
+        <label
+          className="wrapperLabel radioLabel"
+          htmlFor="selectTreeBreadcrumb"
+        >
+          <input
+            type="radio"
+            id="selectTreeBreadcrumb"
+            className="treeNode radioInput"
+            value={this.props.value}
+            onChange={this.props.onSelected}
+          />
+          <span className="wrapperText">
+            <span className="backIcon">
+              <Icon name="fast-backward" />
+            </span>
+            {this.props.label}
+          </span>
+        </label>
+      </div>
+    );
+  }
+}
@@ -0,0 +1,42 @@
+---
+name: Select Tree
+menu: Components
+route: /components/select-tree
+---
+
+import { Playground, Props } from 'docz'
+import { State } from 'react-powerplug'
+import { SelectTree } from './../index.js'
+
+import selectTreeItems from './selectTreeItems.js'
+
+# SelectTree
+
+## Basic usage
+
+<Playground>
+    <State initial={{
+        items: selectTreeItems,
+    }}>
+        {({ state, setState }) => (
+            <React.Fragment>
+            <pre style={{ maxHeight: '135px', overflowX: 'auto' }}>
+                {JSON.stringify(state.items, null, 2)}
+            </pre>
+
+           <SelectTree
+                items={state.items}
+                onSelected={(event, item) => setState({ itemLabelSelected: item.label }) }
+                selectTreeFirstTitle="Select Tree Example Header"
+                autoFocus={false}
+            />
+            </React.Fragment>
+        )}
+
+    </State>
+
+</Playground>
+
+## API
+
+<Props of={SelectTree} />
@@ -0,0 +1,30 @@
+export default [
+  {
+    label: 'A',
+    value: 'A',
+    items: [
+      {
+        label: 'Abdominal Wall',
+        value: 'AbdominalWall',
+      },
+      {
+        label: 'Adrenal Left',
+        value: 'AdrenalLeft',
+      },
+    ],
+  },
+  {
+    label: 'B',
+    value: 'B',
+    items: [
+      {
+        label: 'Brain',
+        value: 'Brain',
+      },
+      {
+        label: 'Breast',
+        value: 'Breast',
+      },
+    ],
+  },
+];
@@ -0,0 +1 @@
+export { SelectTree } from './SelectTree';