chore(release): publish [skip ci]

- @ohif/viewer@2.3.0

.babelrc

@@ -1,19 +0,0 @@
-{
-  "presets": [
-    [
-      "@babel/preset-env",
-      {
-        "targets": {
-          "ie": "11"
-        }
-      }
-    ],
-    "@babel/preset-react"
-  ],
-  "plugins": [
-    "@babel/plugin-proposal-class-properties",
-    "@babel/plugin-syntax-dynamic-import",
-    "@babel/plugin-transform-regenerator",
-    "@babel/plugin-transform-runtime"
-  ]
-}

.browserslistrc

@@ -0,0 +1,6 @@
+# Browsers that we support
+
+> 1%
+IE 11
+not dead
+not op_mini all

.circleci/build-and-publish-docs.sh

@@ -0,0 +1,69 @@
+#!/bin/bash
+
+# Set directory to location of this script
+# https://stackoverflow.com/a/3355423/1867984
+cd "$(dirname "$0")"
+
+yarn -v
+node -v
+
+echo 'Installing Gitbook CLI'
+
+yarn global bin
+yarn config get prefix
+yarn config set prefix ~/.yarn
+export PATH="$PATH:`yarn global bin`"
+
+echo 'Running Gitbook installation'
+
+# Generate all version's GitBook output
+# For each directory in /docs ...
+cd ./../docs/
+for D in *; do
+    if [ -d "${D}" ]; then
+
+			echo "Generating output for: ${D}"
+			cd "${D}"
+
+			# Clear previous output, generate new
+			rm -rf _book
+			gitbook install
+			gitbook build
+
+			cd ..
+
+		fi
+done
+
+# Move CNAME File into `latest`
+cp CNAME ./latest/_book/CNAME
+
+# Create a history folder in our latest version's output
+mkdir ./latest/_book/history
+
+# Move each version's files to latest's history folder
+for D in *; do
+	if [ -d "${D}" ]; then
+		if [ "${D}" == v* ] ; then
+
+			echo "Moving ${D} to the latest version's history folder"
+
+			mkdir "./latest/_book/history/${D}"
+			cp -v -r "./${D}/_book"/* "./latest/_book/history/${D}"
+
+		fi
+	fi
+done
+
+# Back to repo root
+cd ..
+
+echo "Done generating documentation output"
+echo 'STARTING PUBLISH'
+
+# WILL ALWAYS FAIL IF INITIATED FROM PR BRANCH
+./node_modules/.bin/gh-pages \
+  --silent \
+  --repo https://$GITHUB_TOKEN@github.com/OHIF/Viewers.git \
+  --message 'Autogenerated Message: [ci skip]' \
+	--dist docs/latest/_book

.circleci/config.yml

@@ -1,4 +1,4 @@
-version: 2
+version: 2.1
 
 ### ABOUT
 #
@@ -9,51 +9,155 @@ version: 2
 # create pull request previews and to update `https://docs.ohif.org`
 ###
 
+## https://github.com/cypress-io/circleci-orb
+##
+orbs:
+  codecov: codecov/codecov@1.0.5
+  cypress: cypress-io/cypress@1.11.0
+
 defaults: &defaults
-  working_directory: ~/repo
   docker:
-    - image: circleci/node:10.15.1
+    - image: circleci/node:12.9.1
+      environment:
+        TERM: xterm # Enable colors in term
+  working_directory: ~/repo
 
 jobs:
-  build_and_test:
+  UNIT_TESTS:
     <<: *defaults
     steps:
-      # Download and cache dependencies
-      - checkout
+      # Update yarn
+      - run: yarn -v
+      #- run: rm -rf ~/.yarn && npm i -g yarn && yarn -v
+
+      # Enable yarn workspaces
+      - run: yarn config set workspaces-experimental true
+
+      # Checkout code and ALL Git Tags
+      - checkout:
+          post:
+            - git fetch --all
+
       - restore_cache:
-          name: Restore Yarn Package Cache
+          name: Restore Yarn and Cypress Package Cache
           keys:
             # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-v1-{{ .Branch }}-{{ checksum "yarn.lock" }}
-            - yarn-packages-v1-{{ .Branch }}-
-            - yarn-packages-v1-
+            - yarn-packages-{{ checksum "yarn.lock" }}
+            - yarn-packages-
+
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
+
       - save_cache:
           name: Save Yarn Package Cache
           paths:
-            - ~/.cache/yarn
-          key: yarn-packages-v1-{{ .Branch }}-{{ checksum "yarn.lock" }}
-      # Build & Test
-      - run: yarn build:package:ci
-      # https://www.viget.com/articles/using-junit-on-circleci-2-0-with-jest-and-eslint/
+            - ~/.cache ## Cache yarn and Cypress
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+
+      # RUN TESTS
       - run:
           name: 'JavaScript Test Suite'
-          command: yarn test:ci
-          environment:
-            JEST_JUNIT_OUTPUT: 'reports/junit/js-test-results.xml'
-      # Store result
-      - store_test_results:
-          path: reports/junit
-      - store_artifacts:
-          path: reports/junit
+          command: yarn run test:unit:ci
+
+      # PLATFORM/VIEWER
+      - run:
+          name: 'VIEWER: Combine report output'
+          command: |
+            viewerCov="/home/circleci/repo/platform/viewer/coverage"
+            touch "${viewerCov}/reports"
+            cat "${viewerCov}/clover.xml" >> "${viewerCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${viewerCov}/reports"
+            cat "${viewerCov}/lcov.info" >>"${viewerCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${viewerCov}/reports"
+      - codecov/upload:
+          file: '/home/circleci/repo/platform/viewer/coverage/reports'
+          flags: 'viewer'
+
+      # PLATFORM/CORE
+      - run:
+          name: 'CORE: Combine report output'
+          command: |
+            coreCov="/home/circleci/repo/platform/core/coverage"
+            touch "${coreCov}/reports"
+            cat "${coreCov}/clover.xml" >> "${coreCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${coreCov}/reports"
+            cat "${coreCov}/lcov.info" >> "${coreCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${coreCov}/reports"
+      - codecov/upload:
+          file: '/home/circleci/repo/platform/core/coverage/reports'
+          flags: 'core'
+
+  UNIT_TESTS_PERSIST_WORKSPACE:
+    <<: *defaults
+    steps:
+      # Update yarn
+      #- run: rm -rf ~/.yarn && npm i -g yarn && yarn -v
+
+      # Enable yarn workspaces
+      - run: yarn config set workspaces-experimental true
+
+      # Checkout code and ALL Git Tags
+      - checkout:
+          post:
+            - git fetch --all
+
+      - restore_cache:
+          name: Restore Yarn and Cypress Package Cache
+          keys:
+            # when lock file changes, use increasingly general patterns to restore cache
+            - yarn-packages-{{ checksum "yarn.lock" }}
+            - yarn-packages-
+
+      - run:
+          name: Install Dependencies
+          command: yarn install --frozen-lockfile
+
+      - save_cache:
+          name: Save Yarn Package Cache
+          paths:
+            - ~/.cache ## Cache yarn and Cypress
+          key: yarn-packages-{{ checksum "yarn.lock" }}
+
+      # RUN TESTS
+      - run:
+          name: 'JavaScript Test Suite'
+          command: yarn run test:unit:ci
+
+      # PLATFORM/VIEWER
+      - run:
+          name: 'VIEWER: Combine report output'
+          command: |
+            viewerCov="/home/circleci/repo/platform/viewer/coverage"
+            touch "${viewerCov}/reports"
+            cat "${viewerCov}/clover.xml" >> "${viewerCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${viewerCov}/reports"
+            cat "${viewerCov}/lcov.info" >>"${viewerCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${viewerCov}/reports"
+      - codecov/upload:
+          file: '/home/circleci/repo/platform/viewer/coverage/reports'
+          flags: 'viewer'
+
+      # PLATFORM/CORE
+      - run:
+          name: 'CORE: Combine report output'
+          command: |
+            coreCov="/home/circleci/repo/platform/core/coverage"
+            touch "${coreCov}/reports"
+            cat "${coreCov}/clover.xml" >> "${coreCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${coreCov}/reports"
+            cat "${coreCov}/lcov.info" >> "${coreCov}/reports"
+            echo "\<<\<<\<< EOF" >> "${coreCov}/reports"
+      - codecov/upload:
+          file: '/home/circleci/repo/platform/core/coverage/reports'
+          flags: 'core'
+
       # Persist :+1:
-      - persist_to_workspace:
+      - persist_to_workspace: &persist_to_workspace
           root: ~/repo
           paths: .
 
-  npm_publish:
+  NPM_PUBLISH:
     <<: *defaults
     steps:
       - attach_workspace:
@@ -63,17 +167,21 @@ jobs:
           command:
             mkdir ~/.ssh/ && echo -e "Host github.com\n\tStrictHostKeyChecking
             no\n" > ~/.ssh/config
-      # --no-ci argument is not ideal; however, semantic-rlease thinks we're
-      # attempting to run it from a `pr`, which is not the case
+      - run: git config --global user.email "danny.ri.brown+ohif-bot@gmail.com"
+      - run: git config --global user.name "ohif-bot"
       - run:
-          name: Publish using Semantic Release
-          command: npx semantic-release --debug
+          name: Authenticate with registry
+          command:
+            echo "//registry.npmjs.org/:_authToken=$NPM_TOKEN" > ~/repo/.npmrc
+      - run: npx lerna version
+      - run: npx lerna publish from-package
+
       # Persist :+1:
       - persist_to_workspace:
           root: ~/repo
           paths: .
 
-  docs_publish:
+  DOCS_PUBLISH:
     <<: *defaults
     steps:
       - attach_workspace:
@@ -83,35 +191,32 @@ jobs:
           command:
             mkdir ~/.ssh/ && echo -e "Host github.com\n\tStrictHostKeyChecking
             no\n" > ~/.ssh/config
-      - run: git config --global user.email "gh-pages@localhost"
-      - run: git config --global user.name "npm gh-pages"
+      - run: git config --global user.email "danny.ri.brown+ohif-bot@gmail.com"
+      - run: git config --global user.name "ohif-bot"
+      - run: yarn global add gitbook-cli
       - run: yarn global add gh-pages
-      - run:
-          name: Generate Docs
-          command: yarn run staticDeploy
-      - run:
-          name: Publish Docs
-          command: yarn run docs:publish
+      - run: chmod +x ~/repo/.circleci/build-and-publish-docs.sh
+      - run: ~/repo/.circleci/build-and-publish-docs.sh
 
-  docker_publish:
+  DOCKER_MASTER_PUBLISH:
     <<: *defaults
     steps:
       - attach_workspace:
           at: ~/repo
       - setup_remote_docker:
-          docker_layer_caching: true
+          docker_layer_caching: false
       - run:
           name: Build and push Docker image
           command: |
             # This file will exist if a new version was published by
             # our `semantic-release` command in the previous job
-            if [[ ! -e tmp/updated-version.txt ]]; then
+            if [[ ! -e platform/viewer/success_version.txt ]]; then
               exit 0
             else
               # Remove npm config
               rm -f ./.npmrc
               # Set our version number using vars
-              export IMAGE_VERSION=$(cat tmp/updated-version.txt)
+              export IMAGE_VERSION=$(cat platform/viewer/success_version.txt)
               export IMAGE_VERSION_FULL=v$IMAGE_VERSION.${CIRCLE_BUILD_NUM}
               echo $IMAGE_VERSION
               echo $IMAGE_VERSION_FULL
@@ -121,107 +226,235 @@ jobs:
               docker push ohif/$IMAGE_NAME:$IMAGE_VERSION_FULL
               docker push ohif/$IMAGE_NAME:latest
             fi
-  build_demo_site:
+
+  DOCKER_PR_PUBLISH:
     <<: *defaults
     steps:
-      # Download and cache dependencies
-      - checkout
+      # Enable yarn workspaces
+      - run: yarn config set workspaces-experimental true
+
+      # Checkout code and ALL Git Tags
+      - checkout:
+          post:
+            - git fetch --all
+
       - restore_cache:
-          name: Restore Yarn Package Cache
+          name: Restore Yarn and Cypress Package Cache
           keys:
             # when lock file changes, use increasingly general patterns to restore cache
-            - yarn-packages-v1-{{ .Branch }}-{{ checksum "yarn.lock" }}
-            - yarn-packages-v1-{{ .Branch }}-
-            - yarn-packages-v1-
+            - yarn-packages-{{ checksum "yarn.lock" }}
+            - yarn-packages-
+
       - run:
           name: Install Dependencies
           command: yarn install --frozen-lockfile
-      - save_cache:
-          name: Save Yarn Package Cache
-          paths:
-            - ~/.cache/yarn
-          key: yarn-packages-v1-{{ .Branch }}-{{ checksum "yarn.lock" }}
+
+      - setup_remote_docker:
+          docker_layer_caching: false
+
+      - run:
+          name: Build and push Docker image
+          command: |
+            # Remove npm config
+            rm -f ./.npmrc
+            # Set our version number using vars
+            echo $CIRCLE_BUILD_NUM
+            # Build our image, auth, and push
+            docker build --tag ohif/viewer:PR_BUILD-$CIRCLE_BUILD_NUM .
+            echo $DOCKER_PWD | docker login -u $DOCKER_LOGIN --password-stdin
+            docker push ohif/viewer:PR_BUILD-$CIRCLE_BUILD_NUM
+
+  VIEWER_DEMO_BUILD:
+    <<: *defaults
+    steps:
+      - attach_workspace:
+          at: ~/repo
       # Build & Test
       - run:
-          name: 'Build Demo Site, Upload SourceMaps, Send Deploy Notification'
+          name: 'Build Demo Site'
+          command: yarn run build:demo
+          no_output_timeout: 45m
+      - run:
+          name: 'Upload SourceMaps, Send Deploy Notification'
           command: |
-            yarn build:demo:ci
-            export FILE_1=$(find ./build/static/js -type f -name "2.*.js" -exec basename {} \;)
-            export FILE_MAIN=$(find ./build/static/js -type f -name "main.*.js" -exec basename {} \;)
-            export FILE_RUNTIME_MAIN=$(find ./build/static/js -type f -name "runtime~main.*.js" -exec basename {} \;)
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_1.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_1
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_MAIN
-            curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_RUNTIME_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_RUNTIME_MAIN
+            # export FILE_1=$(find ./build/static/js -type f -name "2.*.js" -exec basename {} \;)
+            # export FILE_MAIN=$(find ./build/static/js -type f -name "main.*.js" -exec basename {} \;)
+            # export FILE_RUNTIME_MAIN=$(find ./build/static/js -type f -name "runtime~main.*.js" -exec basename {} \;)
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_1.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_1
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_MAIN
+            # curl https://api.rollbar.com/api/1/sourcemap -F source_map=@build/static/js/$FILE_RUNTIME_MAIN.map -F access_token=$ROLLBAR_TOKEN -F version=$CIRCLE_SHA1 -F minified_url=https://$GOOGLE_STORAGE_BUCKET/static/js/$FILE_RUNTIME_MAIN
             curl --request POST https://api.rollbar.com/api/1/deploy/ -F access_token=$ROLLBAR_TOKEN -F environment=$GOOGLE_STORAGE_BUCKET -F revision=$CIRCLE_SHA1 -F local_username=CircleCI
       # Persist :+1:
       - persist_to_workspace:
           root: ~/repo
           paths: .
-  demo_site_publish:
+
+  VIEWER_DEMO_PUBLISH:
     working_directory: ~/repo
     docker:
-    - image: google/cloud-sdk
+      - image: google/cloud-sdk
     steps:
       - attach_workspace:
           at: ~/repo
       - setup_remote_docker:
-          docker_layer_caching: true
+          docker_layer_caching: false
       - run:
           name: Deploy latest version to viewer.ohif.org
           command: |
-            # This file will exist if a new version was published by
-            # our `semantic-release` command in the previous job
-            #if [[ ! -e tmp/updated-version.txt ]]; then
-            #  exit 0
-            #else
-              echo $GCLOUD_SERVICE_KEY | gcloud auth activate-service-account --key-file=-
-              gcloud --quiet config set project ${GOOGLE_PROJECT_ID}
-              gcloud --quiet config set compute/zone ${GOOGLE_COMPUTE_ZONE}
-
-              gsutil -m rm gs://$GOOGLE_STORAGE_BUCKET/**
-              gsutil -m rsync -R build gs://$GOOGLE_STORAGE_BUCKET
-            #fi
+            # https://circleci.com/docs/2.0/google-auth/#authorization
+            echo $GCLOUD_SERVICE_KEY | gcloud auth activate-service-account --key-file=-
+            gcloud --quiet config set project ${GOOGLE_PROJECT_ID}
+            gcloud --quiet config set compute/zone ${GOOGLE_COMPUTE_ZONE}
+            # Remove all files in Storage Bucket; Push latest
+            gsutil -m rm gs://$GOOGLE_STORAGE_BUCKET/**
+            gsutil -m rsync -R platform/viewer/dist gs://$GOOGLE_STORAGE_BUCKET
 
 workflows:
   version: 2
 
   # PULL REQUESTS
-  pull_requests:
+  PR_CHECKS:
     jobs:
-      - build_and_test:
+      - UNIT_TESTS:
           filters:
             branches:
               ignore:
                 - master
                 - feature/*
                 - hotfix/*
+      # E2E: PWA
+      - cypress/run:
+          name: 'E2E: PWA'
+          executor: cypress/browsers-chrome76
+          browser: chrome
+          pre-steps:
+            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
+                add wait-on' # Use yarn latest
+          yarn: true
+          record: false
+          store_artifacts: false
+          working_directory: platform/viewer
+          build: npx cross-env QUICK_BUILD=true yarn run build
+          start: yarn run test:e2e:serve
+          wait-on: 'http://localhost:3000'
+          cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
+          no-workspace: true # Don't persist workspace
+          post-steps:
+            - store_artifacts:
+                path: platform/viewer/cypress/screenshots
+          requires:
+            - UNIT_TESTS
+      # E2E: script-tag
+      - cypress/run:
+          name: 'E2E: Script Tag'
+          executor: cypress/browsers-chrome76
+          browser: chrome
+          pre-steps:
+            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
+                add wait-on' # Use yarn latest
+          yarn: true
+          record: false
+          store_artifacts: false
+          working_directory: platform/viewer
+          build: npx cross-env QUICK_BUILD=true yarn run build:package
+          start: yarn run test:e2e:serve
+          spec: 'cypress/integration/common/**/*'
+          wait-on: 'http://localhost:3000'
+          cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
+          no-workspace: true # Don't persist workspace
+          post-steps:
+            - store_artifacts:
+                path: platform/viewer/cypress/screenshots
+          requires:
+            - UNIT_TESTS
+
+  PR_OPTIONAL_DOCKER_PUBLISH:
+    jobs:
+      # https://circleci.com/docs/2.0/workflows/#holding-a-workflow-for-a-manual-approval
+      - AWAIT_APPROVAL:
+          type: approval
+      # Update hub.docker.org
+      - DOCKER_PR_PUBLISH:
+          context: Docker Hub
+          requires:
+            - AWAIT_APPROVAL
 
   # MERGE TO MASTER
-  cut_release:
+  RELEASE:
     jobs:
-      - build_and_test:
+      - UNIT_TESTS_PERSIST_WORKSPACE:
           filters:
             branches:
               only: master
-      - npm_publish:
+      # E2E: PWA + Persist
+      - cypress/run:
+          name: 'E2E: PWA'
+          executor: cypress/browsers-chrome76
+          browser: chrome
+          pre-steps:
+            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
+                add wait-on' # Use yarn latest
+          yarn: true
+          record: false
+          store_artifacts: true
+          working_directory: platform/viewer
+          build: npx cross-env QUICK_BUILD=true yarn run build
+          start: yarn run test:e2e:serve
+          wait-on: 'http://localhost:3000'
+          command: 'yarn run test:e2e:ci'
+          cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
+          no-workspace: true # Don't persist workspace
+          post-steps:
+            - store_artifacts:
+                path: platform/viewer/cypress/screenshots
+            - store_test_results:
+                path: cypress/results
           requires:
-            - build_and_test
-      - docs_publish:
+            - UNIT_TESTS_PERSIST_WORKSPACE
+      # E2E: script-tag
+      - cypress/run:
+          name: 'E2E: Script Tag'
+          executor: cypress/browsers-chrome76
+          browser: chrome
+          pre-steps:
+            - run: 'rm -rf ~/.yarn && npm i -g yarn && yarn -v && yarn global
+                add wait-on' # Use yarn latest
+          yarn: true
+          record: false
+          store_artifacts: false
+          working_directory: platform/viewer
+          build: npx cross-env QUICK_BUILD=true yarn run build:package
+          start: yarn run test:e2e:serve
+          spec: 'cypress/integration/common/**/*'
+          wait-on: 'http://localhost:3000'
+          cache-key: 'yarn-packages-{{ checksum "yarn.lock" }}'
+          no-workspace: true # Don't persist workspace
+          post-steps:
+            - store_artifacts:
+                path: platform/viewer/cypress/screenshots
+            - store_test_results:
+                path: cypress/results
           requires:
-            - build_and_test
-      - docker_publish:
+            - UNIT_TESTS_PERSIST_WORKSPACE
+      # Update NPM
+      - NPM_PUBLISH:
           requires:
-            - build_and_test
-            - npm_publish
-      - build_demo_site:
+            - 'E2E: Script Tag'
+            - 'E2E: PWA'
+      # Update docs.ohif.org
+      - DOCS_PUBLISH:
           requires:
-            - build_and_test
-          filters:
-            branches:
-              only: master
-      - demo_site_publish:
+            - 'E2E: Script Tag'
+            - 'E2E: PWA'
+      - VIEWER_DEMO_BUILD:
           requires:
-            - build_demo_site
-          filters:
-            branches:
-              only: master
+            - 'E2E: Script Tag'
+            - 'E2E: PWA'
+      # Update viewer.ohif.org
+      - VIEWER_DEMO_PUBLISH:
+          requires:
+            - VIEWER_DEMO_BUILD
+      # Update hub.docker.org
+      - DOCKER_MASTER_PUBLISH:
+          requires:
+            - NPM_PUBLISH

.codecov.yml

@@ -0,0 +1,25 @@
+# ABOUT:
+# https://docs.codecov.io/docs/codecov-yaml
+#
+#
+# COMMIT STATUS:
+# https://docs.codecov.io/docs/commit-status
+coverage:
+  status:
+    project:
+      default:
+        threshold: 0.5%
+      core:
+        flags: core
+        threshold: 0.5%
+      viewer:
+        flags: viewer
+        threshold: 0.5%
+    patch: off
+flags:
+  core:
+    paths:
+      - platform/core
+  viewer:
+    paths:
+      - platform/viewer

.docker/Nginx-Orthanc/docker-compose.yml

@@ -0,0 +1,15 @@
+version: '3.5'
+
+services:
+  orthanc:
+    image: jodogne/orthanc-plugins:1.5.6
+    hostname: orthanc
+    volumes:
+      # Config
+      - ./config/orthanc.json:/etc/orthanc/orthanc.json:ro
+      # Persist data
+      - ./volumes/orthanc-db/:/var/lib/orthanc/db/
+    ports:
+      - '4242:4242' # DICOM
+      - '8042:8042' # Web
+    restart: unless-stopped

.docker/Viewer-v2.x/entrypoint.sh

@@ -0,0 +1,19 @@
+#!/bin/bash
+
+# If CLIENT_ID is specified, use the google.js configuration with the modified ID
+if [ ! -z "$CLIENT_ID" ]
+  then
+  	echo "Google Cloud Healthcare $CLIENT_ID has been provided: "
+  	echo $CLIENT_ID
+  	echo "Updating config..."
+
+  	# - Use SED to replace the CLIENT_ID that is currently in google.js
+	sed -i -e "s/YOURCLIENTID.apps.googleusercontent.com/$CLIENT_ID/g" /usr/share/nginx/html/google.js
+
+	# - Copy google.js to overwrite app-config.js
+	cp /usr/share/nginx/html/google.js /usr/share/nginx/html/app-config.js
+fi
+
+echo "Starting Nginx to serve the OHIF Viewer..."
+
+exec "$@"

.dockerignore

@@ -1,5 +1,9 @@
+# Reduces size of context and hides
+# files from Docker (can't COPY or ADD these)
+
 # Output
 dist/
+build/
 
 # Dependencies
 node_modules/
@@ -7,6 +11,7 @@ node_modules/
 # Root
 README.md
 Dockerfile
+dockerfile
 
 # Misc. Config
 .git
@@ -14,3 +19,12 @@ Dockerfile
 .gitignore
 .vscode
 .circleci
+
+# Unnecessary things to pull into container
+.circleci/
+.github/
+.netlify/
+.scripts/
+.vscode/
+coverage/
+docs/

.env.example

@@ -1,13 +1 @@
-##
-# EXAMPLE
-#
-# Read more about .env files when using create-react-app here:
-# https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-development-environment-variables-in-env
-#
-
-PUBLIC_URL=/demo
-
-#
-# Most vars require REACT_APP_* naming
-#
-REACT_APP_CONFIG=config/netlify.js
+PERCY_TOKEN=<your token here>

.eslintrc

@@ -1,16 +0,0 @@
-{
-  "extends": [
-    "react-app",
-    "eslint:recommended",
-    "plugin:react/recommended"
-  ],
-  "parser": "babel-eslint",
-  "env": {
-    "jest": true
-  },
-  "settings": {
-    "react": {
-      "version": "detect",
-    },
-  },
-}

.eslintrc.json

@@ -0,0 +1,24 @@
+{
+  "extends": [
+    "react-app",
+    "eslint:recommended",
+    "plugin:react/recommended",
+    "plugin:prettier/recommended"
+  ],
+  "parser": "babel-eslint",
+  "env": {
+    "jest": true
+  },
+  "settings": {
+    "react": {
+      "version": "detect"
+    }
+  },
+  "globals": {
+    "cy": true,
+    "before": true,
+    "context": true,
+    "Cypress": true,
+    "assert": true
+  }
+}

.gitattributes

@@ -1 +0,0 @@
-* text eol=lf

.github/ISSUE_TEMPLATE/---bug-report.md

@@ -0,0 +1,33 @@
+---
+name: "\U0001F41B Bug report"
+about: Create a report to help us improve
+title: ''
+labels: 'Community: Report :bug:'
+assignees: ''
+---
+
+> **Before Creating an issue**
+>
+> - Are you running the latest version?
+> - Are you reporting to the correct repository?
+> - Did you search existing issues?
+
+## Bug Report
+
+### Describe the Bug
+
+_A clear and concise description of what the bug is._
+
+### What steps can we follow to reproduce the bug?
+
+1. First step
+2. Second step
+3. ...
+
+```js
+Please use code blocks to show formatted errors or code snippets
+```
+
+> :warning: Reports we cannot reproduce are at risk of being marked stale and
+> closed. The more information you can provide, the more likely we are to look
+> into and address your issue.

.github/ISSUE_TEMPLATE/---feature-request.md

@@ -0,0 +1,25 @@
+---
+name: "\U0001F680 Feature request"
+about: Suggest an idea for this project
+title: ''
+labels: 'Community: Request :hand:'
+assignees: ''
+---
+
+> :hand: Many people requests features. Tell us why yours is important to the
+> community. How does it add value? Why _this feature_?
+>
+> Is your request very specific to your needs? Consider
+> [contributing it](https://docs.ohif.org/contributing.html) yourself! Or reach
+> out to a community member that offers
+> [consulting services](https://docs.ohif.org/help.html#paid--commercial).
+
+## Request
+
+**What feature or change would you like to see made?**
+
+...
+
+**Why should we prioritize this feature?**
+
+...

.github/ISSUE_TEMPLATE/---support-question.md

@@ -0,0 +1,18 @@
+---
+name: "\U0001F917 Support Question"
+about: "I have a question \U0001F4AC"
+title: ''
+labels: 'Community: Question :question:'
+assignees: ''
+---
+
+> :hand: We are a small team with limited resources. Your question is much more
+> likely to be answered if it is
+> [a good question](https://stackoverflow.com/help/how-to-ask)
+
+**Description**
+
+Questions can often be answered by our documentation. Unable to find an answer
+in our docs? We'll try to help. In the meantime, if you answer your own
+question, please respond with the answer here so that others may benefit as
+well. Better yet, open a PR to expand our docs ^\_^

.github/PULL_REQUEST_TEMPLATE/pull_request_template.md

@@ -0,0 +1,29 @@
+### Request Checklist
+
+- [] Brief description of changes
+- [] Links to any relevant issues
+- [] Required status checks are passing
+- [] `@mention` a maintainer to request a review
+
+#### Special
+
+> If this PR is not on a branch for this repo, it is "untrusted" and does not
+> have access to env vars. Reviewers can kick off a trusted docker deploy by:
+>
+> 1. Verifying there are no malicious changes to CI build
+> 2. Using the [git-push-fork-to-upstream-branch][script] script
+> 3. Executing the manual approval step in the CI workflow
+
+- [] Request docker publish of PR
+
+_Want to improve this process? Consider PR'ing the ability for reviewers to add
+a label to trigger this process._
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[blog]: https://circleci.com/blog/triggering-trusted-ci-jobs-on-untrusted-forks/
+[script]: https://github.com/jklukas/git-push-fork-to-upstream-branch
+<!-- prettier-ignore-end -->

.github/stale.yml

@@ -0,0 +1,28 @@
+# GitHub App: Stale
+# https://github.com/apps/stale
+#
+# Number of days of inactivity before an issue becomes stale
+daysUntilStale: 21
+# Number of days of inactivity before a stale issue is closed
+daysUntilClose: 7
+# Issues with these labels will never be considered stale
+exemptLabels:
+  - 'Story :raised_hands:'
+  - 'Bug: Verified :bug:'
+  - 'Task: CI/Tooling 🤖'
+  - 'Task: Docs 📖'
+  - 'Task: Docs :book:'
+  - 'Task: Refactor 🛠'
+  - 'Task: Tests :microscope:'
+  - 'PR: Awaiting Review 👀'
+  - 'Triage 🏳️'
+  - 'Announcement 🎉'
+# Label to use when marking an issue as stale
+staleLabel: 'Stale :baguette_bread:'
+# Comment to post when marking an issue as stale. Set to `false` to disable
+markComment: >
+  This issue has been automatically marked as stale because it has not had
+  recent activity. It will be closed if no further activity occurs. Thank you
+  for your contributions.
+# Comment to post when closing a stale issue. Set to `false` to disable
+closeComment: false

.gitignore

@@ -8,6 +8,7 @@ docs/_book
 src/version.js
 junit.xml
 coverage/
+.docz/
 
 # YALC (for Erik)
 .yalc
@@ -20,8 +21,15 @@ npm-debug.log
 package-lock.json
 yarn-error.log
 .DS_Store
+.env
 
 # Common Example Data Directories
 sampledata/
 example/deps/
 docker/dcm4che/dcm4che-arc
+
+# Cypress test results
+videos/
+
+# Locize settings
+.locize

.jscsrc

@@ -1,45 +0,0 @@
-{
-    "requireCurlyBraces": {
-        "keywords": [ "if", "else", "for", "while", "do" ],
-        "allExcept" : ["return" , "continue", "break"]
-    },
-    "requireSpaceAfterKeywords": [ "if", "else", "for", "while", "do", "switch", "return" ],
-    "requireSpacesInFunctionExpression": {
-        "beforeOpeningCurlyBrace": true
-    },
-    "disallowSpacesInFunctionExpression": {
-        "beforeOpeningRoundBrace": true
-    },
-    "disallowSpacesInsideParentheses": true,
-    "disallowKeywordsOnNewLine": ["else"],
-    "disallowNewlineBeforeBlockStatements": true,
-    "requirePaddingNewLinesAfterUseStrict": true,
-    "requirePaddingNewLinesAfterBlocks": {
-        "allExcept": ["inCallExpressions", "inArrayExpressions", "inProperties"]
-    },
-    "requireObjectKeysOnNewLine": true,
-    "requireSemicolons": true,
-    "requireSpaceAfterBinaryOperators": true,
-    "requireSpaceAfterComma": true,
-    "requireSpaceBeforeObjectValues": true,
-    "requireSpacesInsideObjectBrackets": "all",
-    "requireLineBreakAfterVariableAssignment": true,
-    "requireSpaceBeforeBinaryOperators": ["+", "-", "/", "*", "=", "==", "===", "!=", "!=="],
-    "disallowSpaceAfterPrefixUnaryOperators": ["++", "--", "+", "-"],
-    "disallowSpaceBeforePostfixUnaryOperators": ["++", "--"],
-    "disallowKeywords": [ "with" ],
-    "disallowMultipleLineBreaks": true,
-    "requireLineFeedAtFileEnd": true,
-    "disallowSpaceAfterObjectKeys": true,
-    "disallowQuotedKeysInObjects": true,
-    "disallowMultipleSpaces": true,
-    "disallowVar": true,
-    "validateLineBreaks": "LF",
-    "validateIndentation": 4,
-    "validateQuoteMarks": {
-        "mark": "'",
-        "escape": true
-    },
-    "validateParameterSeparator": ", ",
-    "requireDollarBeforejQueryAssignment": true
-}

.jshintrc

@@ -1,93 +0,0 @@
-{
-    // JSHint Default Configuration File (as on JSHint website)
-    // See http://jshint.com/docs/ for more details
-
-    "maxerr"        : 50,       // {int} Maximum error before stopping
-
-    // Enforcing
-    "bitwise"       : true,     // true: Prohibit bitwise operators (&, |, ^, etc.)
-    "camelcase"     : false,    // true: Identifiers must be in camelCase
-    "curly"         : false,     // true: Require {} for every new block or scope
-    "eqeqeq"        : true,     // true: Require triple equals (===) for comparison
-    "forin"         : true,     // true: Require filtering for..in loops with obj.hasOwnProperty()
-    "freeze"        : true,     // true: prohibits overwriting prototypes of native objects such as Array, Date etc.
-    "immed"         : false,    // true: Require immediate invocations to be wrapped in parens e.g. `(function () { } ());`
-    "latedef"       : false,    // true: Require variables/functions to be defined before being used
-    "newcap"        : false,    // true: Require capitalization of all constructor functions e.g. `new F()`
-    "noarg"         : true,     // true: Prohibit use of `arguments.caller` and `arguments.callee`
-    "noempty"       : true,     // true: Prohibit use of empty blocks
-    "nonbsp"        : true,     // true: Prohibit "non-breaking whitespace" characters.
-    "nonew"         : false,    // true: Prohibit use of constructors for side-effects (without assignment)
-    "plusplus"      : false,    // true: Prohibit use of `++` and `--`
-    "quotmark"      : false,    // Quotation mark consistency:
-                                //   false    : do nothing (default)
-                                //   true     : ensure whatever is used is consistent
-                                //   "single" : require single quotes
-                                //   "double" : require double quotes
-    "undef"         : true,     // true: Require all non-global variables to be declared (prevents global leaks)
-    "unused"        : "vars",   // Unused variables:
-                                //   true     : all variables, last function parameter
-                                //   "vars"   : all variables only
-                                //   "strict" : all variables, all function parameters
-    "strict"        : false,    // true: Requires all functions run in ES5 Strict Mode
-    "maxparams"     : false,    // {int} Max number of formal params allowed per function
-    "maxdepth"      : false,    // {int} Max depth of nested blocks (within functions)
-    "maxstatements" : false,    // {int} Max number statements per function
-    "maxcomplexity" : false,    // {int} Max cyclomatic complexity per function
-    "maxlen"        : false,    // {int} Max number of characters per line
-    "varstmt"       : false,    // true: Disallow any var statements. Only `let` and `const` are allowed.
-
-    // Relaxing
-    "asi"           : false,     // true: Tolerate Automatic Semicolon Insertion (no semicolons)
-    "boss"          : false,     // true: Tolerate assignments where comparisons would be expected
-    "debug"         : false,     // true: Allow debugger statements e.g. browser breakpoints.
-    "eqnull"        : false,     // true: Tolerate use of `== null`
-    "es5"           : true,      // true: Allow ES5 syntax (ex: getters and setters)
-    "esnext"        : true,      // true: Allow ES.next (ES6) syntax (ex: `const`)
-    "moz"           : false,     // true: Allow Mozilla specific syntax (extends and overrides esnext features)
-                                 // (ex: `for each`, multiple try/catch, function expression…)
-    "evil"          : false,     // true: Tolerate use of `eval` and `new Function()`
-    "expr"          : false,     // true: Tolerate `ExpressionStatement` as Programs
-    "funcscope"     : false,     // true: Tolerate defining variables inside control statements
-    "globalstrict"  : false,     // true: Allow global "use strict" (also enables 'strict')
-    "iterator"      : false,     // true: Tolerate using the `__iterator__` property
-    "lastsemic"     : false,     // true: Tolerate omitting a semicolon for the last statement of a 1-line block
-    "laxbreak"      : false,     // true: Tolerate possibly unsafe line breakings
-    "laxcomma"      : false,     // true: Tolerate comma-first style coding
-    "loopfunc"      : false,     // true: Tolerate functions being defined in loops
-    "multistr"      : false,     // true: Tolerate multi-line strings
-    "noyield"       : false,     // true: Tolerate generator functions with no yield statement in them.
-    "notypeof"      : false,     // true: Tolerate invalid typeof operator values
-    "proto"         : false,     // true: Tolerate using the `__proto__` property
-    "scripturl"     : false,     // true: Tolerate script-targeted URLs
-    "shadow"        : false,     // true: Allows re-define variables later in code e.g. `var x=1; x=2;`
-    "sub"           : false,     // true: Tolerate using `[]` notation when it can still be expressed in dot notation
-    "supernew"      : false,     // true: Tolerate `new function () { ... };` and `new Object;`
-    "validthis"     : false,     // true: Tolerate using this in a non-constructor function
-
-    // Environments
-    "browser"       : true,     // Web Browser (window, document, etc)
-    "browserify"    : false,    // Browserify (node.js code in the browser)
-    "couch"         : false,    // CouchDB
-    "devel"         : false,    // Development/debugging (alert, confirm, etc)
-    "dojo"          : false,    // Dojo Toolkit
-    "jasmine"       : false,    // Jasmine
-    "jquery"        : true,     // jQuery
-    "mocha"         : false,    // Mocha
-    "mootools"      : false,    // MooTools
-    "node"          : false,    // Node.js
-    "nonstandard"   : false,    // Widely adopted globals (escape, unescape, etc)
-    "phantom"       : false,    // PhantomJS
-    "prototypejs"   : false,    // Prototype and Scriptaculous
-    "qunit"         : false,    // QUnit
-    "rhino"         : false,    // Rhino
-    "shelljs"       : false,    // ShellJS
-    "typed"         : false,    // Globals for typed array constructions
-    "worker"        : false,    // Web Workers
-    "wsh"           : false,    // Windows Scripting Host
-    "yui"           : false,    // Yahoo User Interface
-    "globals"       : {
-        "require": true,
-        "Package": true         // Meteor Package definition
-    }
-}

.netlify/build-deploy-preview.sh

@@ -0,0 +1,27 @@
+#!/bin/bash
+
+# Set directory to location of this script
+# https://stackoverflow.com/a/3355423/1867984
+cd "$(dirname "$0")"
+cd .. # Up to project root
+
+# Helpful to verify which versions we're using
+yarn -v
+node -v
+
+# Install build deps and all monorepo package dependencies. Yarn Workspaces
+# should also symlink all projects appropriately
+yarn install --no-ignore-optional --pure-lockfile
+
+# Build && Move PWA Output
+yarn run build:ci
+mkdir -p ./.netlify/www/pwa
+mv platform/viewer/dist/* .netlify/www/pwa -v
+
+# Build && Move script output
+# yarn run build:package
+
+echo 'Nothing left to see here. Go home, folks.'
+
+# Build using react-scripts
+# npx cross-env PUBLIC_URL=/demo APP_CONFIG=config/netlify.js react-scripts --max_old_space_size=4096 build

.netlify/www/_redirects

@@ -0,0 +1,6 @@
+# Specific to our deploy-preview
+# Our docs are published using CircleCI + GitBook
+# Confgure redirects using netlify.toml
+
+# PWA Demo
+/pwa/* /pwa/index.html 200

.netlify/www/index.html

@@ -0,0 +1,14 @@
+<html>
+  <head>
+    <title>OHIF Viewer: Deploy Preview</title>
+  </head>
+  <body>
+    <h1>Index of Previews</h1>
+
+    <ul>
+      <li>
+        <a href="/pwa">Progressive Web App</a>
+      </li>
+    </ul>
+  </body>
+</html>

.prettierrc

@@ -4,6 +4,5 @@
   "proseWrap": "always",
   "tabWidth": 2,
   "semi": true,
-  "singleQuote": true,
-  "endOfLine": "lf"
+  "singleQuote": true
 }

.releaserc

@@ -1,14 +0,0 @@
-{
-  "plugins": [
-    "@semantic-release/commit-analyzer",
-    "@semantic-release/release-notes-generator",
-    "@semantic-release/npm",
-    "@semantic-release/github",
-    [
-      "@semantic-release/exec",
-      {
-        "publishCmd": "mkdir tmp && echo ${nextRelease.version} > tmp/updated-version.txt"
-      }
-    ]
-  ]
-}

.scripts/dev.sh

@@ -0,0 +1,14 @@
+#!/bin/bash
+# https://github.com/shelljs/shelljs
+# https://github.com/shelljs/shelljs#exclude-options
+PROJECT=$1
+
+if [ -z "$PROJECT" ]
+then
+  # Default
+  npx lerna run dev:viewer
+else
+  eval "npx lerna run dev:$PROJECT"
+fi
+
+read -p 'Press [Enter] key to continue...'

.vscode/settings.json

@@ -1,30 +1,32 @@
 {
-    "editor.rulers": [80, 120],
-  
-    // ===
-    // Spacing
-    // ===
-  
-    "editor.insertSpaces": true,
-    "editor.tabSize": 2,
-    "editor.trimAutoWhitespace": true,
-    "files.trimTrailingWhitespace": true,
-    "files.eol": "\n",
-    "files.insertFinalNewline": true,
-    "files.trimFinalNewlines": true,
-  
-    // ===
-    // Event Triggers
-    // ===
-  
-    "editor.formatOnSave": true,
-    "eslint.autoFixOnSave": true,
-    "eslint.run": "onSave",
-    "eslint.validate": [
-      { "language": "javascript", "autoFix": true },
-      { "language": "javascriptreact", "autoFix": true }
-    ],
-    "prettier.disableLanguages": [],
-    "prettier.endOfLine": "lf"
-  }
-  
+  "editor.rulers": [80, 120],
+  // ===
+  // Spacing
+  // ===
+  "editor.insertSpaces": true,
+  "editor.tabSize": 2,
+  "editor.trimAutoWhitespace": true,
+  "files.trimTrailingWhitespace": true,
+  "files.eol": "\n",
+  "files.insertFinalNewline": true,
+  "files.trimFinalNewlines": true,
+  // ===
+  // Event Triggers
+  // ===
+  "editor.formatOnSave": true,
+  "eslint.autoFixOnSave": true,
+  "eslint.run": "onSave",
+  "eslint.validate": [
+    {
+      "language": "javascript",
+      "autoFix": true
+    },
+    {
+      "language": "javascriptreact",
+      "autoFix": true
+    }
+  ],
+  "prettier.disableLanguages": ["html"],
+  "prettier.endOfLine": "lf",
+  "workbench.colorCustomizations": {}
+}

.webpack/helpers/excludeNodeModulesExcept.js

@@ -0,0 +1,22 @@
+const path = require('path');
+
+function excludeNodeModulesExcept(modules) {
+  var pathSep = path.sep;
+  if (pathSep == '\\')
+    // must be quoted for use in a regexp:
+    pathSep = '\\\\';
+  var moduleRegExps = modules.map(function(modName) {
+    return new RegExp('node_modules' + pathSep + modName);
+  });
+
+  return function(modulePath) {
+    if (/node_modules/.test(modulePath)) {
+      for (var i = 0; i < moduleRegExps.length; i++)
+        if (moduleRegExps[i].test(modulePath)) return false;
+      return true;
+    }
+    return false;
+  };
+}
+
+module.exports = excludeNodeModulesExcept;

.webpack/rules/cssToJavaScript.js

@@ -0,0 +1,17 @@
+const autoprefixer = require('autoprefixer');
+
+const cssToJavaScript = {
+  test: /\.css$/,
+  use: [
+    'style-loader',
+    { loader: 'css-loader', options: { importLoaders: 1 } },
+    {
+      loader: 'postcss-loader',
+      options: {
+        plugins: () => [autoprefixer('last 2 version', 'ie >= 11')],
+      },
+    },
+  ],
+};
+
+module.exports = cssToJavaScript;

.webpack/rules/loadShaders.js

@@ -0,0 +1,10 @@
+/**
+ * This is exclusively used by `vtk.js` to bundle glsl files.
+ */
+const loadShaders = {
+  test: /\.glsl$/i,
+  include: /vtk\.js[\/\\]Sources/,
+  loader: 'shader-loader',
+};
+
+module.exports = loadShaders;

.webpack/rules/loadWebWorkers.js

@@ -0,0 +1,17 @@
+/**
+ * This allows us to include web workers in our bundle, and VTK.js
+ * web workers in our bundle. While this increases bundle size, it
+ * cuts down on the number of includes we need for `script tag` usage.
+ */
+const loadWebWorkers = {
+  test: /\.worker\.js$/,
+  include: /vtk\.js[\/\\]Sources/,
+  use: [
+    {
+      loader: 'worker-loader',
+      options: { inline: true, fallback: false },
+    },
+  ],
+};
+
+module.exports = loadWebWorkers;

.webpack/rules/stylusToJavaScript.js

@@ -0,0 +1,10 @@
+const stylusToJavaScript = {
+  test: /\.styl$/,
+  use: [
+    { loader: 'style-loader' }, // 3. Style nodes from JS Strings
+    { loader: 'css-loader' }, // 2. CSS to CommonJS
+    { loader: 'stylus-loader' }, // 1. Stylus to CSS
+  ],
+};
+
+module.exports = stylusToJavaScript;

.webpack/rules/transpileJavaScript.js

@@ -0,0 +1,39 @@
+const excludeNodeModulesExcept = require('./../helpers/excludeNodeModulesExcept.js');
+
+function transpileJavaScript(mode) {
+  const exclude =
+    mode === 'production'
+      ? excludeNodeModulesExcept([
+          'vtk.js',
+          // 'dicomweb-client',
+          // https://github.com/react-dnd/react-dnd/blob/master/babel.config.js
+          'react-dnd',
+          // https://github.com/dcmjs-org/dcmjs/blob/master/.babelrc
+          // https://github.com/react-dnd/react-dnd/issues/1342
+          // 'dcmjs', // contains: loglevelnext
+          // https://github.com/shellscape/loglevelnext#browser-support
+          // 'loglevelnext',
+          // https://github.com/dcmjs-org/dicom-microscopy-viewer/issues/35
+          // 'dicom-microscopy-viewer',
+          // https://github.com/openlayers/openlayers#supported-browsers
+          // 'ol', --> Should be fine
+        ])
+      : excludeNodeModulesExcept([]);
+
+  return {
+    test: /\.jsx?$/,
+    // These are packages that are not transpiled to our lowest supported
+    // JS version (currently ES5). Most of these leverage ES6+ features,
+    // that we need to transpile to a different syntax.
+    exclude,
+    loader: 'babel-loader',
+    options: {
+      // Find babel.config.js in monorepo root
+      // https://babeljs.io/docs/en/options#rootmode
+      rootMode: 'upward',
+      envName: mode,
+    },
+  };
+}
+
+module.exports = transpileJavaScript;

.webpack/webpack.base.js

@@ -0,0 +1,108 @@
+// ~~ ENV
+const dotenv = require('dotenv');
+//
+const path = require('path');
+const webpack = require('webpack');
+const PACKAGE = require('../platform/viewer/package.json');
+// ~~ RULES
+const loadShadersRule = require('./rules/loadShaders.js');
+const loadWebWorkersRule = require('./rules/loadWebWorkers.js');
+const transpileJavaScriptRule = require('./rules/transpileJavaScript.js');
+// ~~ PLUGINS
+const TerserJSPlugin = require('terser-webpack-plugin');
+// ~~ ENV VARS
+const NODE_ENV = process.env.NODE_ENV;
+const QUICK_BUILD = process.env.QUICK_BUILD;
+const BUILD_NUM = process.env.CIRCLE_BUILD_NUM || '0';
+
+//
+dotenv.config();
+
+module.exports = (env, argv, { SRC_DIR, DIST_DIR }) => {
+  if (!process.env.NODE_ENV) {
+    throw new Error('process.env.NODE_ENV not set');
+  }
+
+  const mode = NODE_ENV === 'production' ? 'production' : 'development';
+  const isProdBuild = NODE_ENV === 'production';
+  const isQuickBuild = QUICK_BUILD === 'true';
+
+  const config = {
+    mode: isProdBuild ? 'production' : 'development',
+    devtool: isProdBuild ? 'source-map' : 'cheap-module-eval-source-map',
+    entry: {
+      app: `${SRC_DIR}/index.js`,
+    },
+    optimization: {
+      minimize: isProdBuild,
+      sideEffects: true,
+    },
+    context: SRC_DIR,
+    stats: {
+      colors: true,
+      hash: true,
+      timings: true,
+      assets: true,
+      chunks: false,
+      chunkModules: false,
+      modules: false,
+      children: false,
+      warnings: true,
+    },
+    module: {
+      rules: [
+        transpileJavaScriptRule(mode),
+        loadWebWorkersRule,
+        loadShadersRule,
+      ],
+    },
+    resolve: {
+      // Which directories to search when resolving modules
+      modules: [
+        // Modules specific to this package
+        path.resolve(__dirname, '../node_modules'),
+        // Hoisted Yarn Workspace Modules
+        path.resolve(__dirname, '../../../node_modules'),
+        SRC_DIR,
+      ],
+      // Attempt to resolve these extensions in order.
+      extensions: ['.js', '.jsx', '.json', '*'],
+      // symlinked resources are resolved to their real path, not their symlinked location
+      symlinks: true,
+    },
+    plugins: [
+      new webpack.DefinePlugin({
+        'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV),
+        'process.env.DEBUG': JSON.stringify(process.env.DEBUG),
+        'process.env.APP_CONFIG': JSON.stringify(process.env.APP_CONFIG || ''),
+        'process.env.PUBLIC_URL': JSON.stringify(process.env.PUBLIC_URL || '/'),
+        'process.env.VERSION_NUMBER': JSON.stringify(PACKAGE.version || ''),
+        'process.env.BUILD_NUM': JSON.stringify(BUILD_NUM),
+      }),
+    ],
+    // Fix: https://github.com/webpack-contrib/css-loader/issues/447#issuecomment-285598881
+    // For issue in cornerstone-wado-image-loader
+    node: {
+      fs: 'empty',
+    },
+  };
+
+  if (isProdBuild) {
+    config.optimization.minimizer = [
+      new TerserJSPlugin({
+        // Supports:
+        // source-map and inline-source-map
+        sourceMap: isProdBuild && !isQuickBuild,
+        parallel: true,
+        terserOptions: {},
+      }),
+    ];
+  }
+
+  if (isQuickBuild) {
+    config.optimization.minimize = false;
+    config.devtool = false;
+  }
+
+  return config;
+};

.webpack/webpack.commonjs.js

@@ -0,0 +1,19 @@
+const merge = require('webpack-merge');
+const webpackBase = require('./webpack.base.js');
+const cssToJavaScriptRule = require('./rules/cssToJavaScript.js');
+const stylusToJavaScriptRule = require('./rules/stylusToJavaScript.js');
+
+/**
+ * WebPack configuration for CommonJS Bundles. Extends rules of BaseConfig by making
+ * sure we're bundling styles and other files that would normally be split in a
+ * PWA.
+ */
+module.exports = (env, argv, { SRC_DIR, DIST_DIR }) => {
+  const baseConfig = webpackBase(env, argv, { SRC_DIR, DIST_DIR });
+
+  return merge(baseConfig, {
+    module: {
+      rules: [cssToJavaScriptRule, stylusToJavaScriptRule],
+    },
+  });
+};

Dockerfile

@@ -21,28 +21,45 @@
 
 # Stage 1: Build the application
 # docker build -t ohif/viewer:latest .
-FROM node:11.2.0-slim as builder
+FROM node:10.16.3-slim as builder
 
-# RUN apt-get update && apt-get install -y git yarn
 RUN mkdir /usr/src/app
 WORKDIR /usr/src/app
 
-ENV PATH /usr/src/app/node_modules/.bin:$PATH
-ENV GENERATE_SOURCEMAP=false
-
+# Copy Files
+COPY .docker /usr/src/app/.docker
+COPY .webpack /usr/src/app/.webpack
+COPY extensions /usr/src/app/extensions
+COPY platform /usr/src/app/platform
+COPY .browserslistrc /usr/src/app/.browserslistrc
+COPY aliases.config.js /usr/src/app/aliases.config.js
+COPY babel.config.js /usr/src/app/babel.config.js
+COPY lerna.json /usr/src/app/lerna.json
 COPY package.json /usr/src/app/package.json
+COPY postcss.config.js /usr/src/app/postcss.config.js
 COPY yarn.lock /usr/src/app/yarn.lock
 
-ADD . /usr/src/app/
+# Run the install before copying the rest of the files
+RUN yarn config set workspaces-experimental true
 RUN yarn install
-RUN yarn run build:web
+
+ENV PATH /usr/src/app/node_modules/.bin:$PATH
+ENV QUICK_BUILD true
+# ENV GENERATE_SOURCEMAP=false
+# ENV REACT_APP_CONFIG=config/default.js
+
+RUN yarn run build
 
 # Stage 2: Bundle the built application into a Docker container
 # which runs Nginx using Alpine Linux
 FROM nginx:1.15.5-alpine
+RUN apk add --no-cache bash
 RUN rm -rf /etc/nginx/conf.d
-COPY docker/Viewer-v2.x /etc/nginx/conf.d
-COPY --from=builder /usr/src/app/build /usr/share/nginx/html
+COPY .docker/Viewer-v2.x /etc/nginx/conf.d
+COPY .docker/Viewer-v2.x/entrypoint.sh /usr/src/
+RUN chmod 777 /usr/src/entrypoint.sh
+COPY --from=builder /usr/src/app/platform/viewer/dist /usr/share/nginx/html
 EXPOSE 80
 EXPOSE 443
+ENTRYPOINT ["/usr/src/entrypoint.sh"]
 CMD ["nginx", "-g", "daemon off;"]

LICENSE

@@ -1,6 +1,6 @@
-The MIT License (MIT)
+MIT License
 
-Copyright (c) 2015 Open Health Imaging Foundation
+Copyright (c) 2018 Open Health Imaging Foundation
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal

README.md

@@ -1,8 +1,8 @@
 <!-- prettier-ignore-start -->
 <!-- markdownlint-disable -->
 <div align="center">
-  <h1>ohif-viewer</h1>
-  <p><strong>ohif-viewer</strong> is a zero-footprint medical image viewer provided by the <a href="http://ohif.org/">Open Health Imaging Foundation (OHIF)</a>. It is a configurable and extensible progressive web application with out-of-the-box support for image archives which support <a href="https://www.dicomstandard.org/dicomweb/">DICOMweb</a>.</p>
+  <h1>OHIF Medical Imaging Viewer</h1>
+  <p><strong>The OHIF Viewer</strong> is a zero-footprint medical image viewer provided by the <a href="http://ohif.org/">Open Health Imaging Foundation (OHIF)</a>. It is a configurable and extensible progressive web application with out-of-the-box support for image archives which support <a href="https://www.dicomstandard.org/dicomweb/">DICOMweb</a>.</p>
 </div>
 
 
@@ -11,196 +11,230 @@
   <a href="https://github.com/OHIF/Viewers/tree/master/docs/latest">Edit the docs</a>
 </div>
 <div align="center">
-  <a href="https://docs.ohif.org/demo">Demo</a> |
-  <a href="https://ohif.canny.io/">Roadmap</a> |
+  <a href="https://viewer.ohif.org/">Live Demo</a> |
   <a href="https://react.ohif.org/">Component Library</a>
 </div>
 
 
 <hr />
 
-[![CircleCI][circleci-image]][circleci-url]
-[![codecov][codecov-image]][codecov-url]
-[![All Contributors](https://img.shields.io/badge/all_contributors-6-orange.svg?style=flat-square)](#contributors)
-[![code style: prettier][prettier-image]][prettier-url]
-[![semantic-release][semantic-image]][semantic-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]
-<!-- markdownlint-enable -->
+
+[![Netlify Status][netlify-image]][netlify-url]
+[![CircleCI][circleci-image]][circleci-url]
+[![codecov][codecov-image]][codecov-url]
+[![This project is using Percy.io for visual regression testing.][percy-image]](percy-url)
+[![All Contributors](https://img.shields.io/badge/all_contributors-10-orange.svg?style=flat-square)](#contributors)
 <!-- prettier-ignore-end -->
 
-> ATTENTION: If you are looking for Version 1 (the Meteor Version) of this
-> repository, it lives on
-> [the `v1.x` branch](https://github.com/OHIF/Viewers/tree/v1.x)
+## About
 
-## Why?
+The OHIF Medical Imaging Viewer is for viewing medical images. It can retrieve
+and load images from most sources and formats; render sets in 2D, 3D, and
+reconstructed representations; allows for the manipulation, annotation, and
+serialization of observations; supports internationalization, OpenID Connect,
+offline use, hotkeys, and many more features.
 
-Building a web based medical imaging viewer from scratch is time intensive, hard
-to get right, and expensive. Instead of re-inventing the wheel, you can use the
-OHIF Viewer as a rock solid platform to build on top of. The Viewer is a
-[React][react-url] [Progressive Web Application][pwa-url] that can be embedded
-in existing applications via it's [packaged source
-(ohif-viewer)][ohif-viewer-url] or hosted stand-alone. The Viewer exposes
-[configuration][configuration-url] and [extensions][extensions-url] to support
-workflow customization and advanced functionality at common integration points.
+Almost everything offers some degree of customization and configuration. If it
+doesn't support something you need, we accept pull requests and have an ever
+improving Extension System.
 
-If you're interested in using the OHIF Viewer, but you're not sure it supports
-your use case [check out our docs](https://docs.ohif.org/). Still not sure, or
-you would like to propose new features? Don't hesitate to
-[create an issue](https://github.com/OHIF/Viewers/issues) or open a pull
-request.
+## Why Choose Us
 
-## Getting Started
+### Community & Experience
 
-This readme is specific to testing and developing locally. If you're more
-interested in production deployment strategies,
-[you can check out our documentation on publishing](https://docs.ohif.org/).
+The OHIF Viewer is a collaborative effort that has served as the basis for many
+active, production, and FDA Cleared medical imaging viewers. It benefits from
+our extensive community's collective experience, and from the sponsored
+contributions of individuals, research groups, and commercial organizations.
 
-Want to play around before you dig in?
-[Check out our LIVE Demo](https://viewer.ohif.org/)
+### Built to Adapt
 
-### Setup
+After more than 5-years of integrating with many companies and organizations,
+The OHIF Viewer has been rebuilt from the ground up to better address the
+varying workflow and configuration needs of its many users. All of the Viewer's
+core features are built using it's own extension system. The same extensibility
+that allows us to offer:
 
-_Requirements:_
+- 2D and 3D medical image viewing
+- Multiplanar Reconstruction (MPR)
+- Maximum Intensity Project (MIP)
+- Whole slide microscopy viewing
+- PDF and Dicom Structured Report rendering
+- User Access Control (UAC)
+- Context specific toolbar and side panel content
+- and many others
 
-- [NodeJS & NPM](https://nodejs.org/en/download/)
-- [Yarn](https://yarnpkg.com/lang/en/docs/install/)
+Can be leveraged by you to customize the viewer for your workflow, and to add
+any new functionality you may need (and wish to maintain privately without
+forking).
 
-_Steps:_
+### Support
 
-1. Fork this repository
-2. Clone your forked repository (your `origin`)
+We offer support through
+[GitHub Issues](https://github.com/OHIF/Viewers/issues/new/choose). You can:
 
-- `git clone git@github.com:YOUR_GITHUB_USERNAME/Viewers.git`
+- [Report a Bug 🐛](https://github.com/OHIF/Viewers/issues/new?assignees=&labels=Community%3A+Report+%3Abug%3A&template=---bug-report.md)
+- [Request a Feature 🚀](https://github.com/OHIF/Viewers/issues/new?assignees=&labels=Community%3A+Request+%3Ahand%3A&template=---feature-request.md)
+- [Ask a Question 🤗](https://github.com/OHIF/Viewers/issues/new?assignees=&labels=Community%3A+Question+%3Aquestion%3A&template=---support-question.md)
 
-3. Add `OHIF/Viewers` as a `remote` repository (the `upstream`)
+For commercial support, academic collaberations, and answers to common
+questions; please read our
+[documented FAQ](https://docs.ohif.org/frequently-asked-questions.html#does-ohif-offer-commercial-support).
 
-- `git remote add upstream git@github.com:OHIF/Viewers.git`
+## Quick Start Deployment
 
-### Developing Locally
+> This is only one of many ways to configure and deploy the OHIF Viewer. To
+> learn more about your options, and how to choose the best one for your
+> requirements, check out
+> [our deployment recipes and documentation](https://docs.ohif.org/deployment/).
 
-In your cloned repository's root folder, run:
+The fastest and easiest way to get started is to include the OHIF Viewer with a
+script tag. In practice, this is as simple as:
+
+- Including the following dependencies with script tags:
+  - [React](https://unpkg.com/react@16/umd/react.production.min.js)
+  - [React Dom](https://unpkg.com/react-dom@16/umd/react-dom.production.min.js)
+  - The [OHIF Viewer](https://unpkg.com/@ohif/viewer)
+- Have an element with an ID of `root` on the page
+- Configure the OHIF Viewer at `window.config`:
 
 ```js
-// Restore dependencies
+window.config = {
+  routerBasename: '/',
+  servers: {
+    dicomWeb: [
+      {
+        name: 'DCM4CHEE',
+        qidoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
+        wadoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
+        qidoSupportsIncludeField: true,
+        imageRendering: 'wadors',
+        thumbnailRendering: 'wadors',
+      },
+    ],
+  },
+};
+```
+
+- Install the viewer:
+  `window.OHIFStandaloneViewer.installViewer(window.config);`
+
+This exact setup is demonstrated in this
+[CodeSandbox](https://codesandbox.io/s/viewer-script-tag-tprch) and in our
+[Embedding The Viewer](https://docs.ohif.org/deployment/recipes/embedded-viewer.html)
+deployment recipe.
+
+## Developing
+
+### Requirements
+
+- [Yarn 1.17.3+](https://yarnpkg.com/en/docs/install)
+- [Node 10+](https://nodejs.org/en/)
+- Yarn Workspaces should be enabled on your machine:
+  - `yarn config set workspaces-experimental true`
+
+### Getting Started
+
+1. [Fork this repository][how-to-fork]
+2. [Clone your forked repository][how-to-clone]
+   - `git clone https://github.com/YOUR-USERNAME/Viewers.git`
+3. Navigate to the cloned project's directory
+4. Add this repo as a `remote` named `upstream`
+   - `git remote add upstream https://github.com/OHIF/Viewers.git`
+5. `yarn install` to restore dependencies and link projects
+
+#### To Develop
+
+_From this repository's root directory:_
+
+```bash
+# Enable Yarn Workspaces
+yarn config set workspaces-experimental true
+
+# Restore dependencies
 yarn install
-
-// Stands up local server to host Viewer.
-// Viewer connects to our public cloud PACS by default
-yarn start
 ```
 
-For more advanced local development scenarios, like using your own locally
-hosted PACS and test data,
-[check out our Essential: Getting Started](https://docs.ohif.org/essentials/getting-started.html)
-guide.
+## Commands
 
-### Contributing
+These commands are available from the root directory. Each project directory
+also supports a number of commands that can be found in their respective
+`README.md` and `project.json` files.
 
-> Large portions of the Viewer's functionality are maintained in other
-> repositories. To get a better understanding of the Viewer's architecture and
-> "where things live", read
-> [our docs on the Viewer's architecture](https://docs.ohif.org/advanced/architecture.html#diagram)
+| Yarn Commands                | Description                                                   |
+| ---------------------------- | ------------------------------------------------------------- |
+| **Develop**                  |                                                               |
+| `dev` or `start`             | Default development experience for Viewer                     |
+| `dev:project <package-name>` | Replace with `core`, `ui`, `i18n`, `cornerstone`, `vtk`, etc. |
+| `test:unit`                  | Jest multi-project test runner; overall coverage              |
+| **Deploy**                   |                                                               |
+| `build`\*                    | Builds production output for our PWA Viewer                   |
+| `build:package`\*            | Builds production `commonjs` output for our Viewer            |
+| `build:package-all`\*        | Builds commonjs bundles for all projects                      |
 
-It is notoriously difficult to setup multiple dependent repositories for
-end-to-end testing and development. That's why we recommend writing and running
-unit tests when adding and modifying features. This allows us to program in
-isolation without a complex setup, and has the added benefit of producing
-well-tested business logic.
+\* - For more information on our different builds, check out our [Deploy
+Docs][deployment-docs]
 
-1. Clone this repository
-2. Navigate to the project directory, and `yarn install`
-3. To begin making changes, `yarn run dev`
-4. To commit changes, run `yarn run cm`
+## Projects
 
-When creating tests, place the test file "next to" the file you're testing.
-[For example](https://github.com/OHIF/Viewers/blob/master/src/utils/index.test.js):
+The OHIF Medical Image Viewing Platform is maintained as a
+[`monorepo`][monorepo]. This means that this repository, instead of containing a
+single project, contains many projects. If you explore our project structure,
+you'll see the following:
 
-```js
-// File
-index.js
-
-// Test for file
-index.test.js
+```bash
+.
+├── extensions              #
+│   ├── _example            # Skeleton of example extension
+│   ├── cornerstone         # 2D images w/ Cornerstone.js
+│   ├── dicom-html          # Structured Reports as HTML in viewport
+│   ├── dicom-microscopy    # Whole slide microscopy viewing
+│   ├── dicom-pdf           # View DICOM wrapped PDFs in viewport
+│   └── vtk                 # MPR and Volume support w/ VTK.js
+│
+├── platform                #
+│   ├── core                # Business Logic
+│   ├── i18n                # Internationalization Support
+│   ├── ui                  # React component library
+│   └── viewer              # Connects platform and extension projects
+│
+├── ...                     # misc. shared configuration
+├── lerna.json              # MonoRepo (Lerna) settings
+├── package.json            # Shared devDependencies and commands
+└── README.md               # This file
 ```
 
-As you add and modify code, `jest` will watch for uncommitted changes and run
-your tests, reporting the results to your terminal. Make a pull request with
-your changes to `master`, and a core team member will review your work. If you
-have any questions, please don't hesitate to reach out via a GitHub issue.
+Want to better understand why and how we've structured this repository? Read
+more about it in our [Architecture Documentation][ohif-architecture].
 
-## Issues
+### Platform
 
-_Looking to contribute? Look for the [Good First Issue][good-first-issue]
-label._
+These projects comprise the
 
-### 🐛 Bugs
+| Name                            | Description                                                                                          | Links             |
+| ------------------------------- | ---------------------------------------------------------------------------------------------------- | ----------------- |
+| [@ohif/core][platform-core]     | Business logic and classes that model the data, services, and extensions that are framework agnostic | [NPM][core-npm]   |
+| [@ohif/i18n][platform-i18n]     | Language files and small API for wrapping component/ui text for translations                         | [NPM][i18n-npm]   |
+| [@ohif/viewer][platform-viewer] | The OHIF Viewer. Where we consume and configure all platform library's and extensions                | [NPM][viewer-npm] |
+| [@ohif/ui][platform-ui]         | Reusable React components we consume and compose to build our Viewer's UI                            | [NPM][ui-npm]     |
 
-Please file an issue for bugs, missing documentation, or unexpected behavior.
+### Extensions
 
-[**See Bugs**][bugs]
+This is a list of Extensions maintained by the OHIF Core team. It's possible to
+customize and configure these extensions, and you can even create your own. You
+can [read more about extensions here][ohif-extensions].
 
-### 💡 Feature Requests
-
-Please file an issue to suggest new features. Vote on feature requests by adding
-a 👍. This helps maintainers prioritize what to work on.
-
-[**See Feature Requests**][requests-feature]
-
-### ❓ Questions
-
-For questions related to using the library, please visit our support community,
-or file an issue on GitHub.
-
-[Google Group][google-group]
-
-## Roadmap
-
-If you want to know what's planned for the very near future,
-[check out our roadmap](https://ohif.canny.io/). The best way to influence when
-and what is worked on is to contribute to the conversation by creating GitHub
-issues, and contributing code through pull requests. OHIF's high level
-priorities for the near future are:
-
-- Feature parity with version 1
-- Extension and configuration improvements with key integration partners
-- Continued Developer Experience Improvements
-- Segmentation Tools, and improved VTK.js support
-
-More granular information will make it's way to the backlog as these items
-become scoped for development by core maintainers.
-
-> Don't hesitate to ask questions, propose features, or create pull requests.
-> We're here, we're listening, and we're ready to build the best open source
-> medical imaging viewer on the web.
-
-#### Roadmap Generously Powered by Canny.io
-
-<a href="https://ohif.canny.io/">
-  <img height="30" src="docs/latest/assets/img/canny-full.png" />
-</a>
-
-## Contributors
-
-Thanks goes to these wonderful people
-([emoji key](https://allcontributors.org/docs/en/emoji-key)):
-
-<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
-<!-- prettier-ignore -->
-<table><tr><td align="center"><a href="https://github.com/swederik"><img src="https://avatars3.githubusercontent.com/u/607793?v=4" width="100px;" alt="Erik Ziegler"/><br /><sub><b>Erik Ziegler</b></sub></a><br /><a href="https://github.com/OHIF/Viewers/commits?author=swederik" title="Code">💻</a></td><td align="center"><a href="https://github.com/evren217"><img src="https://avatars1.githubusercontent.com/u/4920551?v=4" width="100px;" alt="Evren Ozkan"/><br /><sub><b>Evren Ozkan</b></sub></a><br /><a href="https://github.com/OHIF/Viewers/commits?author=evren217" title="Code">💻</a></td><td align="center"><a href="https://github.com/galelis"><img src="https://avatars3.githubusercontent.com/u/2378326?v=4" width="100px;" alt="Gustavo André Lelis"/><br /><sub><b>Gustavo André Lelis</b></sub></a><br /><a href="https://github.com/OHIF/Viewers/commits?author=galelis" title="Code">💻</a></td><td align="center"><a href="http://dannyrb.com/"><img src="https://avatars1.githubusercontent.com/u/5797588?v=4" width="100px;" alt="Danny Brown"/><br /><sub><b>Danny Brown</b></sub></a><br /><a href="https://github.com/OHIF/Viewers/commits?author=dannyrb" title="Code">💻</a></td><td align="center"><a href="https://github.com/all-contributors/all-contributors-bot"><img src="https://avatars3.githubusercontent.com/u/46843839?v=4" width="100px;" alt="allcontributors[bot]"/><br /><sub><b>allcontributors[bot]</b></sub></a><br /><a href="https://github.com/OHIF/Viewers/commits?author=allcontributors" title="Documentation">📖</a></td><td align="center"><a href="https://www.linkedin.com/in/siliconvalleynextgeneration/"><img src="https://avatars0.githubusercontent.com/u/1230575?v=4" width="100px;" alt="Esref Durna"/><br /><sub><b>Esref Durna</b></sub></a><br /><a href="#question-EsrefDurna" title="Answering Questions">💬</a></td></tr></table>
-
-<!-- ALL-CONTRIBUTORS-LIST:END -->
-
-This project follows the
-[all-contributors](https://github.com/all-contributors/all-contributors)
-specification. Contributions of any kind welcome!
-
-## License
-
-MIT © [OHIF](https://github.com/OHIF)
+| Name                                                           | Description                                             | Links                  |
+| -------------------------------------------------------------- | ------------------------------------------------------- | ---------------------- |
+| [@ohif/extension-cornestone][extension-cornerstone]            | 2D image viewing, annotation, and segementation tools   | [NPM][cornerstone-npm] |
+| [@ohif/extension-dicom-html][extension-dicom-html]             | Support for viewing DICOM SR as rendered HTML           | [NPM][html-npm]        |
+| [@ohif/extension-dicom-microscopy][extension-dicom-microscopy] | Whole slide microscopy viewing                          | [NPM][microscopy-npm]  |
+| [@ohif/extension-dicom-pdf][extension-dicom-pdf]               | View DICOM wrapped PDFs in a viewport                   | [NPM][pdf-npm]         |
+| [@ohif/extension-vtk][extension-vtk]                           | Volume rendering, reconstruction, and 3D visualizations | [NPM][vtk-npm]         |
 
 ## Acknowledgments
 
@@ -224,41 +258,69 @@ Cancer Institute, Informatics Technology for Cancer Research (ITCR) program,
 under a
 [grant to Dr. Gordon Harris at Massachusetts General Hospital (U24 CA199460)](https://projectreporter.nih.gov/project_info_description.cfm?aid=8971104).
 
+## License
+
+MIT © [OHIF](https://github.com/OHIF)
+
 <!--
-Links:
--->
+  Links
+  -->
 
 <!-- prettier-ignore-start -->
-<!-- ROW -->
+<!-- Badges -->
+[lerna-image]: https://img.shields.io/badge/maintained%20with-lerna-cc00ff.svg
+[lerna-url]: https://lerna.js.org/
+[netlify-image]: https://api.netlify.com/api/v1/badges/a5d369ab-18a6-41c3-bcde-83805205ac7f/deploy-status
+[netlify-url]: https://app.netlify.com/sites/ohif/deploys
 [all-contributors-image]: https://img.shields.io/badge/all_contributors-0-orange.svg?style=flat-square
-[contributing-url]: https://github.com/OHIF/Viewers/blob/react/CONTRIBUTING.md
 [circleci-image]: https://circleci.com/gh/OHIF/Viewers.svg?style=svg
 [circleci-url]: https://circleci.com/gh/OHIF/Viewers
-[codecov-image]: https://codecov.io/gh/OHIF/Viewers/branch/react/graph/badge.svg
-[codecov-url]: https://codecov.io/gh/OHIF/Viewers/branch/react
+[codecov-image]: https://codecov.io/gh/OHIF/Viewers/branch/master/graph/badge.svg
+[codecov-url]: https://codecov.io/gh/OHIF/Viewers/branch/master
 [prettier-image]: https://img.shields.io/badge/code_style-prettier-ff69b4.svg?style=flat-square
 [prettier-url]: https://github.com/prettier/prettier
 [semantic-image]: https://img.shields.io/badge/%20%20%F0%9F%93%A6%F0%9F%9A%80-semantic--release-e10079.svg
 [semantic-url]: https://github.com/semantic-release/semantic-release
 <!-- ROW -->
-[npm-url]: https://npmjs.org/package/ohif-viewer
-[npm-downloads-image]: https://img.shields.io/npm/dm/ohif-viewer.svg?style=flat-square
-[npm-version-image]: https://img.shields.io/npm/v/ohif-viewer.svg?style=flat-square
+[npm-url]: https://npmjs.org/package/@ohif/viewer
+[npm-downloads-image]: https://img.shields.io/npm/dm/@ohif/viewer.svg?style=flat-square
+[npm-version-image]: https://img.shields.io/npm/v/@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
 [license-image]: https://img.shields.io/badge/license-MIT-blue.svg?style=flat-square
 [license-url]: LICENSE
-<!-- DOCS -->
+[percy-image]: https://percy.io/static/images/percy-badge.svg
+[percy-url]: https://percy.io/Open-Health-Imaging-Foundation/OHIF-Viewer
+<!-- Links -->
+[monorepo]: https://en.wikipedia.org/wiki/Monorepo
+[how-to-fork]: https://help.github.com/en/articles/fork-a-repo
+[how-to-clone]: https://help.github.com/en/articles/fork-a-repo#step-2-create-a-local-clone-of-your-fork
+[ohif-architecture]: https://docs.ohif.org/advanced/architecture.html
+[ohif-extensions]: https://docs.ohif.org/advanced/architecture.html
+[deployment-docs]: https://docs.ohif.org/deployment/
 [react-url]: https://reactjs.org/
 [pwa-url]: https://developers.google.com/web/progressive-web-apps/
-[ohif-viewer-url]: https://www.npmjs.com/package/ohif-viewer
+[ohif-viewer-url]: https://www.npmjs.com/package/@ohif/viewer
 [configuration-url]: https://docs.ohif.org/essentials/configuration.html
 [extensions-url]: https://docs.ohif.org/advanced/extensions.html
-<!-- Misc. -->
-[react-viewer]: https://github.com/OHIF/Viewers/tree/react
-<!-- Issue Boilerplate -->
-[bugs]: https://github.com/OHIF/Viewers/labels/bug
-[requests-feature]: https://github.com/OHIF/Viewers/labels/enhancement
-[good-first-issue]: https://github.com/OHIF/Viewers/labels/good%20first%20issue
-[google-group]: https://groups.google.com/forum/#!forum/cornerstone-platform
+<!-- Platform -->
+[platform-core]: platform/core/README.md
+[core-npm]: https://www.npmjs.com/package/@ohif/core
+[platform-i18n]: platform/i18n/README.md
+[i18n-npm]: https://www.npmjs.com/package/@ohif/i18n
+[platform-ui]: platform/ui/README.md
+[ui-npm]: https://www.npmjs.com/package/@ohif/ui
+[platform-viewer]: platform/viewer/README.md
+[viewer-npm]: https://www.npmjs.com/package/@ohif/viewer
+<!-- Extensions -->
+[extension-cornerstone]: extensions/cornerstone/README.md
+[cornerstone-npm]: https://www.npmjs.com/package/@ohif/extension-cornerstone
+[extension-dicom-html]: extensions/dicom-html/README.md
+[html-npm]: https://www.npmjs.com/package/@ohif/extension-dicom-html
+[extension-dicom-microscopy]: extensions/dicom-microscopy/README.md
+[microscopy-npm]: https://www.npmjs.com/package/@ohif/extension-dicom-microscopy
+[extension-dicom-pdf]: extensions/dicom-pdf/README.md
+[pdf-npm]: https://www.npmjs.com/package/@ohif/extension-dicom-pdf
+[extension-vtk]: extensions/vtk/README.md
+[vtk-npm]: https://www.npmjs.com/package/@ohif/extension-vtk
 <!-- prettier-ignore-end -->

aliases.config.js

@@ -0,0 +1,8 @@
+/* Used by webpack, babel and eslint */
+
+const path = require('path');
+
+module.exports = {
+  '@codinsky/parse-js': path.resolve(__dirname, 'packages/parse/src'),
+  '@codinsky/curate': path.resolve(__dirname, 'packages/curate/src'),
+};

babel.config.js

@@ -0,0 +1,63 @@
+const aliases = require('./aliases.config');
+const path = require('path');
+
+// https://babeljs.io/docs/en/options#babelrcroots
+module.exports = {
+  babelrcRoots: ['./platform/*', './extensions/*'],
+  plugins: ['inline-react-svg', '@babel/plugin-proposal-class-properties'],
+  env: {
+    test: {
+      presets: [
+        [
+          // TODO: https://babeljs.io/blog/2019/03/19/7.4.0#migration-from-core-js-2
+          '@babel/preset-env',
+          {
+            modules: 'commonjs',
+            debug: false,
+          },
+        ],
+        '@babel/preset-react',
+      ],
+      plugins: [
+        '@babel/plugin-proposal-object-rest-spread',
+        '@babel/plugin-syntax-dynamic-import',
+        '@babel/plugin-transform-regenerator',
+        '@babel/plugin-transform-runtime',
+      ],
+    },
+    production: {
+      presets: [
+        // WebPack handles ES6 --> Target Syntax
+        ['@babel/preset-env', { modules: false }],
+        '@babel/preset-react',
+      ],
+      ignore: ['**/*.test.jsx', '**/*.test.js', '__snapshots__', '__tests__'],
+    },
+    development: {
+      presets: [
+        // WebPack handles ES6 --> Target Syntax
+        ['@babel/preset-env', { modules: false }],
+        '@babel/preset-react',
+      ],
+      plugins: ['react-hot-loader/babel'],
+      ignore: ['**/*.test.jsx', '**/*.test.js', '__snapshots__', '__tests__'],
+    },
+  },
+};
+
+// TODO: Plugins; Aliases
+// We don't currently use aliases, but this is a nice snippet that would help
+// [
+//   'module-resolver',
+//   {
+//     // https://github.com/tleunen/babel-plugin-module-resolver/issues/338
+//     // There seem to be a bug with module-resolver with a mono-repo setup:
+//     // It doesn't resolve paths correctly when using root/alias combo, so we
+//     // use this function instead.
+//     resolvePath(sourcePath, currentFile, opts) {
+//       // This will return undefined if aliases has no key for the sourcePath,
+//       // in which case module-resolver will fallback on its default behaviour.
+//       return aliases[sourcePath];
+//     },
+//   },
+// ],

build-and-publish-docs.sh

@@ -6,6 +6,7 @@ cd "$(dirname "$0")"
 
 yarn -v
 node -v
+
 echo 'Installing Gitbook CLI'
 yarn global add gitbook-cli
 
@@ -13,7 +14,7 @@ echo 'Running Gitbook installation'
 
 # Generate all version's GitBook output
 # For each directory in /docs ...
-cd ./docs/
+cd ./../docs/
 for D in *; do
     if [ -d "${D}" ]; then
 
@@ -49,9 +50,15 @@ for D in *; do
 		fi
 	fi
 done
+
+# Back to repo root
 cd ..
 
-# Build and copy the StandaloneViewer into the static directory
-mkdir ./docs/latest/_book/demo/
-yarn install
-yarn build:web:ci
+echo "Done generating documentation output"
+echo 'PUBLISHING'
+
+./node_modules/.bin/gh-pages \
+  --silent \
+  --repo https://$GITHUB_TOKEN@github.com/OHIF/Viewers.git \
+  --message 'Autogenerated Message: [ci skip]' \
+	--dist docs/latest/_book

docker/Nginx-Orthanc/docker-compose.yml

@@ -1,26 +0,0 @@
-version: '3.5'
-
-services:
-  proxy:
-    image: nginx:1.15-alpine
-    ports:
-      - 8899:80
-    volumes:
-      - ./config/nginx.conf:/etc/nginx/nginx.conf:ro
-    restart: unless-stopped
-
-  # LINK: https://hub.docker.com/r/jodogne/orthanc-plugins/
-  # TODO: Update to use Postgres
-  # https://github.com/mrts/docker-postgresql-multiple-databases
-  orthanc:
-    image: jodogne/orthanc-plugins:1.5.6
-    hostname: orthanc
-    volumes:
-      # Config
-      - ./config/orthanc.json:/etc/orthanc/orthanc.json:ro
-      # Persist data
-      - ./volumes/orthanc-db/:/var/lib/orthanc/db/
-    # ports:
-    #  - '4242:4242' # DICOM
-    #  - '8042:8042' # Web
-    restart: unless-stopped

docs/_redirects

@@ -0,0 +1,3 @@
+# Netlify redirects
+# SPA rules for our docs
+/*    /index.html   200

docs/latest/README.md

@@ -1,4 +1,14 @@
-##### Looking for a Deploy Preview? - <a onclick="function redirect() { window.location.href='/demo/'; } redirect();">Deploy Preview for Viewer</a>
+<div class='row'>
+	<div class='column' style='text-align: right; padding: 0 20px'>
+		<strong>Looking for a Live Demo?</strong>
+		<a href="http://viewer.ohif.org/">Preview The OHIF Viewer</a>
+	</div>
+	<div class='column' style='text-align: left; padding: 0 20px'>
+		<a href="https://www.netlify.com">
+		  <img src="https://www.netlify.com/img/global/badges/netlify-color-bg.svg"/>
+		</a>
+	</div>
+</div>
 
 > ATTENTION! You are looking at the docs for the `React` version of the OHIF
 > Viewer. If you're looking for the `Meteor` version's documentation (now
@@ -23,14 +33,14 @@ yourself unable to extend the viewer for your purposes, please reach out via our
 [GitHub issues][gh-issues]. We are actively seeking feedback on ways to improve
 our integration and extension points.
 
-## Where to Next?
+## Where to next?
 
 Check out these helpful links:
 
 - Ready to dive into some code? Check out our
   [Getting Started Guide](./essentials/getting-started.md).
 - We're an active, vibrant community.
-  [Learn how you can be more involved.](./contributing.md)
+  [Learn how you can be more involved.](./contributing/index.md)
 - Feeling lost? Read our [help page](./help.md).
 
 <!--

docs/latest/SUMMARY.md

@@ -45,7 +45,7 @@
 
 ---
 
-- [Contributing](contributing.md)
 - [FAQ](frequently-asked-questions.md)
-- [Roadmap](roadmap.md)
+- [Contributing](contributing/index.md)
+- [Browser Support](browser-support.md)
 - [Help](help.md)

docs/latest/advanced/_maintained-extensions-table.md

@@ -10,7 +10,7 @@
         <!-- CORNERSTONE.js -->
         <tr>
             <td>
-                <a href="https://www.npmjs.com/package/ohif-cornerstone-extension">
+                <a href="https://www.npmjs.com/package/@ohif/extension-cornerstone">
                     Cornerstone
                 </a>
             </td>
@@ -22,7 +22,7 @@
         <!-- VTK.js -->
         <tr>
             <td>
-                <a href="https://www.npmjs.com/package/ohif-vtk-extension">
+                <a href="https://www.npmjs.com/package/@ohif/extension-vtk">
                     VTK.js
                 </a>
             </td>
@@ -33,30 +33,30 @@
         </tr>
         <tr>
             <td>
-                <a href="">HTML</a>
+                <a href="https://www.npmjs.com/package/@ohif/extension-dicom-html">DICOM HTML</a>
             </td>
             <td>
-                Renders text and HTML content for <a href="https://github.com/OHIF/Viewers/blob/react/extensions/ohif-dicom-html-extension/src/OHIFDicomHtmlSopClassHandler.js#L7-L15">specific SopClassUIDs</a>.
+                Renders text and HTML content for <a href="https://github.com/OHIF/Viewers/blob/master/extensions/dicom-html/src/OHIFDicomHtmlSopClassHandler.js#L4-L12">specific SopClassUIDs</a>.
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
         <tr>
             <td>
-                <a href="https://www.npmjs.com/package/ohif-dicom-pdf-extension">PDF</a>
+                <a href="https://www.npmjs.com/package/@ohif/extension-dicom-pdf">DICOM PDF</a>
             </td>
             <td>
-                Renders PDFs for a <a href="https://github.com/OHIF/Viewers/blob/react/extensions/ohif-dicom-pdf-extension/src/OHIFDicomPDFSopClassHandler.js#L8">specific SopClassUID</a>.
+                Renders PDFs for a <a href="https://github.com/OHIF/Viewers/blob/master/extensions/dicom-pdf/src/OHIFDicomPDFSopClassHandler.js#L4-L6">specific SopClassUID</a>.
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
         <tr>
             <td>
-                <a href="https://www.npmjs.com/package/ohif-dicom-microscopy-extension">Microscopy</a>
+                <a href="https://www.npmjs.com/package/@ohif/extension-dicom-microscopy">DICOM Microscopy</a>
             </td>
             <td>
-                Renders Microscopy images for a <a href="https://github.com/OHIF/Viewers/blob/react/extensions/ohif-dicom-microscopy-extension/src/DicomMicroscopySopClassHandler.js#L6">specific SopClassUID</a>.
+                Renders Microscopy images for a <a href="https://github.com/OHIF/Viewers/blob/master/extensions/dicom-microscopy/src/DicomMicroscopySopClassHandler.js#L5-L7">specific SopClassUID</a>.
             </td>
             <td>Viewport, SopClassHandler</td>
         </tr>
     </tbody>
-</table>
+</table>

docs/latest/advanced/architecture.md

@@ -12,32 +12,48 @@ architected, and the role each of it's dependent libraries plays.
 
 ## Overview
 
-The [`OHIF/Viewers`](https://github.com/OHIF/Viewers/tree/react) repository
-contains the source code for the OHIF Medical Imaging Viewer. It is effectively
-a React
-[progressive web app](https://developers.google.com/web/progressive-web-apps/)
-(PWA) that combines the business logic housed in
-[`OHIF/ohif-core`](https://github.com/OHIF/ohif-core) and the components in our
-React Component library
-[`OHIF/react-viewerbase`](https://github.com/OHIF/react-viewerbase). It provides
-customization for common use cases through
-[configuration](../essentials/configuration.md) and for adding functionality via
-[extensions](./extensions.md).
+The [OHIF Medical Image Viewing Platform][viewers-project] is maintained as a
+[`monorepo`][monorepo]. This means that this repository, instead of containing a
+single project, contains many projects. If you explore our project structure,
+you'll see the following:
+
+```bash
+.
+├── extensions
+│   ├── _example            # Skeleton of example extension
+│   ├── cornerstone         # 2D images w/ Cornerstone.js
+│   ├── dicom-html          # Structured Reports as HTML in viewport
+│   ├── dicom-microscopy    # Whole slide microscopy viewing
+│   ├── dicom-pdf           # View DICOM wrapped PDFs in viewport
+│   └── vtk                 # MPR and Volume support w/ VTK.js
+│
+├── platform
+│   ├── core                # Business Logic
+│   ├── i18n                # Internationalization Support
+│   ├── ui                  # React component library
+│   └── viewer              # Connects platform and extension projects
+│
+├── ...                     # misc. shared configuration
+├── lerna.json              # MonoRepo (Lerna) settings
+├── package.json            # Shared devDependencies and commands
+└── README.md
+```
+
+Continue reading to see how these libraries work together to create the OHIF
+Viewer.
 
 ### Business Logic
 
-Our goal is to maintain the majority of our business logic in
-[`OHIF/ohif-core`](https://github.com/OHIF/ohif-core). `ohif-core` offers
-pre-packaged solutions for features common to Web-based medical imaging viewers.
-For example:
+The [`@ohif/core`][core-github] project offers pre-packaged solutions for
+features common to Web-based medical imaging viewers. For example:
 
 - Hotkeys
-- DICOM Web
+- DICOM Web requests
 - Hanging Protocols
 - Managing a study's measurements
 - Managing a study's DICOM metadata
 - A flexible pattern for extensions
-- [And many others](https://github.com/OHIF/ohif-core/blob/master/src/index.js#L49-L69)
+- And many others
 
 It does this while remaining decoupled from any particular view library or
 rendering logic. While we use it to power our React Viewer, it can be used with
@@ -45,20 +61,42 @@ Vue, React, Vanilla JS, or any number of other frameworks.
 
 ### React Component Library
 
-[`OHIF/react-viewerbase`](https://github.com/OHIF/react-viewerbase) is a React
-Component library that contains the reusable components that power the OHIF
-Viewer. It allows us to build, compose, and test components in isolation; easing
-the development process by reducing the need to stand-up a local PACS with test
-case data.
+[`@ohif/ui`][ui-github] is a React Component library that contains the reusable
+components that power the OHIF Viewer. It allows us to build, compose, and test
+components in isolation; easing the development process by reducing the need to
+stand-up a local PACS with test case data.
+
+Extension authors can also use these same components when building their
+extension's UI; allowing for a consistent look and feel with the rest of the
+application.
 
 [Check out our component library!](https://react.ohif.org/)
 
-### Misc. Extensions
+### Internationalization (i18n)
 
-Want to add custom logic or UI Components to the OHIF Viewer, but don't want to
-maintain a fork? We expose common integration points via
-[extensions](./extensions.md) to make that possible. For a list of extensions
-maintained by OHIF,
+...
+
+### The Viewer
+
+...
+
+### Extensions & Configuration
+
+While OHIF maintains several high value and commonly requested features in its
+own extensions, there are many instances where one may wish to further extend
+the viewer. Some common use cases include:
+
+- Adding AI/ML tools and insights
+- Custom workflows for guided diagnosis
+- Collecting specific annotations for training data or reports
+- Authentication and granular permissions
+- Teleconsultation workflow, image comments, and tracking
+- Adding surgical templating tools and reports
+- and many others
+
+We expose common integration points via [extensions](./extensions.md) to make
+this possible. The viewer and many of our own extensions also offer
+[configuration][configuration]. For a list of extensions maintained by OHIF,
 [check out this helpful table](./extensions.html#ohif-maintained-extensions).
 
 If you find yourself thinking "I wish the Viewer could do X", and you can't
@@ -71,15 +109,14 @@ looking for ways to improve our extensibility ^\_^
 
 This diagram is a conceptual illustration of how the Viewer is architected.
 
-0. (optional) `extensions` can be registered with `ohif-core`'s extension
+1. (optional) `extensions` can be registered with `@ohif/core`'s extension
    manager
-1. `ohif-core` provides bussiness logic and a way for `viewer` to access
+2. `@ohif/core` provides bussiness logic and a way for `@ohif/viewer` to access
    registered extensions
-1. The `viewer` composes and provides data to components from our component
-   library (`react-viewerbase`)
-1. The `viewer` can be built and served as a stand-alone PWA, or as an
-   embeddable package
-   ([`ohif-viewer`](https://www.npmjs.com/package/ohif-viewer))
+3. The `@ohif/viewer` composes and provides data to components from our
+   component library (`@ohif/ui`)
+4. The `@ohif/viewer` can be built and served as a stand-alone PWA, or as an
+   embeddable package ([`@ohif/viewer`][viewer-npm])
 
 ![Architecture Diagram](../assets/img/architecture-diagram.png)
 
@@ -87,14 +124,28 @@ This diagram is a conceptual illustration of how the Viewer is architected.
 
 ## Common Questions
 
-> When should I use the packaged source `ohif-viewer` versus building a PWA from
-> the source?
+> When should I use the packaged source `@ohif/viewer` versus building a PWA
+> from the source?
 
 ...
 
 > Can I create my own Viewer using Vue.js or Angular.js?
 
 You can, but you will not be able to leverage as much of the existing code and
-components. `ohif-core` could still be used for business logic, and to provide a
-model for extensions. `react-viewerbase` would then become a guide for the
-components you would need to recreate.
+components. `@ohif/core` could still be used for business logic, and to provide
+a model for extensions. `@ohif/ui` would then become a guide for the components
+you would need to recreate.
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[viewers-project]: https://github.com/OHIF/Viewers
+[viewer-npm]: https://www.npmjs.com/package/@ohif/viewer
+[pwa]: https://developers.google.com/web/progressive-web-apps/
+[configuration]: ../essentials/configuration.md
+[extensions]: ./extensions.md
+[core-github]: https://github.com/OHIF/viewers/platform/core
+[ui-github]: https://github.com/OHIF/Viewers/platform/ui
+<!-- prettier-ignore-end -->

docs/latest/advanced/extensions.md

@@ -8,57 +8,121 @@ toolbar, or as complex as a new viewport capable of rendering volumes in 3D.
 
 - [Overview](#overview)
 - [Modules](#modules)
-  - [Viewport](#viewport)
-  - [Toolbar](#toolbar)
-  - [SOP Class Handler](#sopclasshandler)
-  - [Panel](#panel)
   - [Commands](#commands)
   - [Hotkeys](#hotkeys)
+  - [Toolbar](#toolbar)
+  - [Panel](#panel)
+  - [Viewport](#viewport)
+  - [SOP Class Handler](#sopclasshandler)
 
 ## Overview
 
-At a glance, an extension is a class or object that has a `getExtensionId()`
-method, and one or more "module" methods. You can find an abbreviated extension
-below, or
-[view the source](https://github.com/OHIF/Viewers/blob/react/extensions/ohif-cornerstone-extension/src/OHIFCornerstoneExtension.js#L32-L65)
-of our `cornerstone` viewport extension.
+At a glance, an extension is a javascript object that has an `id` property, and
+one or more "module" methods. You can find an abbreviated extension below, or
+[view the source][example-ext-src] of our example extension.
 
 ```js
-class myCustomExtension {
+export default {
+    /**
+     * Only required property. Should be a unique value across all extensions.
+     */
+    id: 'example-extension',
 
-    /** Required */
-    getExtensionId: () => 'my-extension-id';
+    /**
+     * Registers one or more named commands scoped to a context. Commands are
+     * the primary means for...
+     */
+    getCommandsModule() {
+        return {
+            defaultContext: 'VIEWER'
+            actions: { ... },
+            definitions: { ... }
+        }
+    },
 
-    /** React component that receives props from ConnectLayoutManager
-     *  If more than one viewport module is registered, SopClassHandler
-     *  is used to help determine which component is used */
-    getViewportModule: () => reactViewportComponent;
+    /**
+     * Allows you to provide toolbar definitions that will be merged with any
+     * existing application toolbar configuration. Used to determine which
+     * buttons should be visible when, their order, what happens when they're
+     * clicked, etc.
+     */
+    getToolbarModule() {
+        return {
+            definitions: [ ... ],
+            defaultContext: 'ACTIVE_VIEWPORT::CORNERSTONE'
+        }
+    }
 
-    /** React component that adds buttons/behavior to the viewer Toolbar */
-    getToolbarModule: () => reactToolbarComponent;
+    /**
+     * Not yet implemented
+     */
+    getPanelModule: () => null,
+
+    /**
+     * Registers a ReactComponent that should be used to render data in a
+     * Viewport. The first registered viewport is our "default viewport". If
+     * more than one viewport is registered, we use `SopClassHandlers` to
+     * determine which viewport should be used.
+    */
+    getViewportModule: () => reactViewportComponent,
 
     /** Provides a whitelist of SOPClassUIDs the viewport is capable of rendering.
      *  Can modify default behavior for methods like `getDisplaySetFromSeries` */
     getSopClassHandler: () => {
         id: 'some-other-unique-id',
-        type: PLUGIN_TYPES.SOP_CLASS_HANDLER,
-        sopClassUids: ['string'],
-        getDisplaySetFromSeries: (series, study, dicomWebClient, authorizationHeaders) => ...
-    };
-
-    // Not yet used
-    getPanelModule: () => null;
+        sopClassUids: [ ... ],
+        getDisplaySetFromSeries: (series, study, dicomWebClient, authorizationHeaders) => { ... }
+    },
 }
 ```
 
 ### Modules
 
-There are a few different kinds of modules. Each kind of module allows us to
-extend the viewer in a different way, and provides a consistent API for us to do
-so. You can find a full list of the
-[different types of modules `in ohif-core`](https://github.com/OHIF/ohif-core/blob/43c08a29eff3fb646a0e83a03a236ddd84f4a6e8/src/plugins.js#L1-L6).
-Information on each type of module, it's API, and how we determine when/where it
-should be used is included below:
+There are a few different module types. Each module type allows us to extend the
+viewer in a different way, and provides a consistent API for us to do so. You
+can find a full list of the different types of modules
+[`in ohif-core`][module-types]. Information on each type of module, it's API,
+and how we determine when/where it should be used is included below.
+
+> NOTE: Modifying the extensions/modules registered to the OHIF Viewer currently
+> requires us to import and pass extensions to the ExtensionManager in
+> `src/App.js`, then rebuild the application. Long-term, we intend to make it
+> possible to accomplish this without a build step.
+
+#### Commands
+
+The Commands Module allows us to register one or more commands scoped to
+specific contexts. Commands can be run by [hotkeys][#], [toolbar buttons][#],
+and any registered custom react component (like a [viewport][#] or [panel][#]).
+Here is a simple example commands module:
+
+```js
+{
+    getCommandsModule() {
+        return {
+            actions: {
+                speak: ({ viewports, words }) => {
+                    console.log(viewports, words);
+                },
+            },
+            definitions: {
+                rotateViewportCW: {
+                    commandFn: actions.rotateViewport,
+                    storeContexts: ['viewports'],
+                    options: { rotation: 90 }
+                },
+                rotateViewportCCW: {
+                    commandFn: actions.rotateViewport,
+                    storeContexts: ['viewports'],
+                    options: { rotation: -90 },
+                    context: 'ACTIVE_VIEWER::CORNERSTONE'
+                },
+            },
+            defaultContext: 'VIEWER'
+        }
+    }
+}
+```
 
 #### Viewport
 
@@ -76,8 +140,8 @@ children: PropTypes.node,
 customProps: PropTypes.object
 ```
 
-Viewport components are managed by the `LayoutManager`. Which Viewport component
-is used depends on:
+Viewport components are managed by the `ViewportGrid` Component. Which Viewport
+component is used depends on:
 
 - The Layout Configuration
 - Registered SopClassHandlers
@@ -88,14 +152,15 @@ is used depends on:
 <center><i>An example of three Viewports</i></center>
 
 For a complete example implementation,
-[check out the OHIFCornerstoneViewport](https://github.com/OHIF/Viewers/blob/react/extensions/ohif-cornerstone-extension/src/OHIFCornerstoneViewport.js).
+[check out the OHIFCornerstoneViewport](https://github.com/OHIF/Viewers/blob/master/extensions/cornerstone/src/OHIFCornerstoneViewport.js).
 
 #### Toolbar
 
 An extension can register a Toolbar Module by providing a `getToolbarModule()`
 method that returns a React Component. The component does not receive any props.
 If you want to modify or react to state, you will need to connect to the redux
-store.
+store. The given toolbar must determine its set of elements and the context of
+them. The set of elements will be listed on toolbar `definitions`.
 
 ![Toolbar Extension](../assets/img/extensions-toolbar.gif)
 
@@ -104,7 +169,39 @@ store.
 Toolbar components are rendered in the `ToolbarRow` component.
 
 For a complete example implementation,
-[check out the OHIFCornerstoneViewport's Toolbar Module](https://github.com/OHIF/Viewers/blob/react/extensions/ohif-cornerstone-extension/src/ToolbarModule.js).
+[check out the OHIFCornerstoneViewport's Toolbar Module](https://github.com/OHIF/Viewers/blob/master/extensions/cornerstone/src/toolbarModule.js).
+
+##### Toolbar Custom Component
+
+Toolbar elements can define its own custom react component to be consumed when
+rendering it. So far, it accepts `Functional` and `Class` Components. For that,
+you just need to expose your `CustomToolbarComponent` as the value of key
+`CustomComponent`. In case the property `CustomComponent` is not present, a
+default toolbar component will be used to render it. See bellow
+
+```js
+definitions: [
+...
+    {
+        id: 'Custom',
+        label: 'Custom',
+        icon: 'custom-icon',
+        CustomComponent: CustomToolbarComponent,
+    }
+...
+]
+
+```
+
+`CustomComponent` components will receive the following props:
+
+- parentContext: parent context. (In most of the cases it will be a ToolbarRow
+  instance)
+- toolbarClickCallback: callback method when clicking on toolbar
+- button: its own definition object
+- key: react key prop
+- activeButtons: list of active elements
+- isActive: if current
 
 #### SopClassHandler
 
@@ -114,10 +211,6 @@ For a complete example implementation,
 
 > The panel module is not yet in use.
 
-#### Commands
-
-...
-
 #### Hotkeys
 
 ...
@@ -138,7 +231,7 @@ _app.js_
 
 ```js
 import { createStore, combineReducers } from 'redux';
-import OHIF from 'ohif-core';
+import OHIF from '@ohif/core';
 import OHIFCornerstoneExtension from 'ohif-cornerstone-extension';
 
 const combined = combineReducers(OHIF.redux.reducers);
@@ -154,8 +247,17 @@ ExtensionManager.registerExtensions(store, extensions);
 
 A small number of powerful extensions for popular use cases are maintained by
 OHIF. They're co-located in the
-[`OHIF/Viewers`](https://github.com/OHIF/Viewers/tree/react/) repository, in the
-top level [`extensions/`](https://github.com/OHIF/Viewers/tree/react/extensions)
+[`OHIF/Viewers`](https://github.com/OHIF/Viewers) repository, in the top level
+[`extensions/`](https://github.com/OHIF/Viewers/tree/master/extensions)
 directory.
 
 {% include "./_maintained-extensions-table.md" %}
+
+<!--
+    Links
+-->
+
+<!-- prettier-ignore-start -->
+[example-ext-src]: https://github.com/OHIF/Viewers/tree/master/extensions/_example/src
+[module-types]: https://github.com/OHIF/Viewers/blob/master/platform/core/src/extensions/MODULE_TYPES.js
+<!-- prettier-ignore-end -->

docs/latest/advanced/monorepos-a-crash-courese.md

@@ -0,0 +1,23 @@
+# MonoRepos: A Crash Course
+
+- [Lerna][lerna]
+
+Solutions:
+
+## Semantic-Release
+
+- [Semantic-Release](https://github.com/semantic-release/semantic-release/issues/193#issuecomment-462063871)
+- [Multi-semantic-release](https://github.com/dhoulb/multi-semantic-release)
+- [semantic-release-monorepo](https://github.com/Updater/semantic-release-monorepo)
+
+# Netlify
+
+- https://community.netlify.com/t/best-practices-for-deploying-sites-from-monorepos/818
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[lerna]: https://github.com/lerna/lerna
+<!-- prettier-ignore-end -->

docs/latest/assets/img/locizeSponsor.svg

@@ -0,0 +1,187 @@
+<?xml version="1.0" encoding="UTF-8"?>
+<svg width="203px" height="39px" viewBox="0 0 203 39" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+    <!-- Generator: Sketch 54.1 (76490) - https://sketchapp.com -->
+    <title>Custom Preset 2 Copy</title>
+    <desc>Created with Sketch.</desc>
+    <defs>
+        <filter x="-22.4%" y="-22.4%" width="144.8%" height="144.8%" filterUnits="objectBoundingBox" id="filter-1">
+            <feOffset dx="0" dy="1" in="SourceAlpha" result="shadowOffsetOuter1"></feOffset>
+            <feGaussianBlur stdDeviation="1" in="shadowOffsetOuter1" result="shadowBlurOuter1"></feGaussianBlur>
+            <feColorMatrix values="0 0 0 0 0   0 0 0 0 0   0 0 0 0 0  0 0 0 0.4707441 0" type="matrix" in="shadowBlurOuter1" result="shadowMatrixOuter1"></feColorMatrix>
+            <feMerge>
+                <feMergeNode in="shadowMatrixOuter1"></feMergeNode>
+                <feMergeNode in="SourceGraphic"></feMergeNode>
+            </feMerge>
+        </filter>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-2"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-4"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-6"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-8"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-10"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-12"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-14"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-16"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-18"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-20"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-22"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-24"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-26"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-28"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176" id="path-30"></path>
+        <path d="M0.103703704,13.9901176 C0.103703704,21.6217647 6.3365037,27.8085294 14.0246815,27.8085294 L14.0246815,27.8085294 C21.7130667,27.8085294 27.9456593,21.6217647 27.9456593,13.9901176 L27.9456593,13.9901176 C27.9456593,6.35805882 21.7130667,0.171294118 14.0246815,0.171294118 L14.0246815,0.171294118 C6.3365037,0.171294118 0.103703704,6.35805882 0.103703704,13.9901176 L0.103703704,13.9901176 Z" id="path-32"></path>
+        <polyline id="path-34" points="1.7512 17.989 11.9476 17.989 12.85 0.35 0.05 0.1"></polyline>
+        <polyline id="path-36" points="1.7512 17.989 11.9476 17.989 12.85 0.35 0.05 0.1"></polyline>
+        <polygon id="path-38" points="1.7512 17.989 11.9476 17.989 12.85 0.35 0.05 0.1"></polygon>
+    </defs>
+    <g id="Custom-Preset-2-Copy" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
+        <rect fill="#FFFFFF" x="0" y="0" width="203" height="39"></rect>
+        <g id="Group-65" filter="url(#filter-1)" transform="translate(6.000000, 5.000000)">
+            <g id="Group-49" transform="translate(1.000000, 1.000000)">
+                <g id="Group-3">
+                    <mask id="mask-3" fill="white">
+                        <use xlink:href="#path-2"></use>
+                    </mask>
+                    <g id="Clip-2"></g>
+                    <path d="M1.85138074,6.7158 C1.69250667,7.85927059 2.08948444,8.45077059 1.85138074,9.00253529 C1.61306963,9.55450588 1.3349363,10.5402706 1.57324741,11.2104176 C1.81155852,11.8805647 2.16892148,13.3392412 2.48666963,13.3789765 C2.80441778,13.4180941 2.24856593,11.8019176 2.56610667,12.3143588 C2.88406222,12.8270059 2.88406222,13.5893882 3.44012148,14.1150059 C3.99597333,14.6406235 4.75072889,14.5617706 5.34661037,15.0740059 C5.94228444,15.5866529 6.53795852,16.3358588 7.09401778,16.2570059 C7.09401778,16.2570059 7.05419556,16.6510647 6.77626963,17.3214176 C6.4983437,17.9915647 6.45852148,18.7798882 6.81609185,19.2532118 C7.17345481,19.7263294 7.53081778,20.4362118 7.84877333,20.7909471 C8.16652148,21.1456824 8.40483259,23.0381529 8.32518815,23.9841824 C8.24595852,24.9304176 8.68275852,27.0594471 9.67561778,27.5327706 C10.668477,28.0058882 9.67561778,27.2960059 9.47712889,26.7047118 C9.27843259,26.1134176 9.63040296,24.7333882 10.1101363,24.5361529 C10.58904,24.3389176 11.0260474,23.5505941 11.3834104,22.9984176 C11.7409807,22.4466529 12.654403,22.2098882 12.9325363,21.5399471 C13.2106696,20.8698 13.0914104,20.0810647 13.2502844,19.7263294 C13.4091585,19.3713882 13.8461659,18.5828588 12.8927141,18.1097412 C11.939677,17.6366235 11.5424919,17.8733882 11.5026696,17.4395941 C11.4628474,17.0058 11.2245363,16.5328882 10.5496326,16.3358588 C9.87431407,16.1384176 9.27843259,15.7560941 8.52367704,15.6714765 C7.76912889,15.5866529 7.61025481,16.1781529 7.21306963,15.8625353 C6.81609185,15.5473294 6.4983437,15.2317118 6.33926222,14.8376529 C6.18059556,14.4433882 5.70376593,14.6799471 5.74379556,14.4433882 C5.78320296,14.2066235 6.41869926,13.5366824 5.70376593,13.7732412 C4.98904,14.0095941 4.3535437,13.9307412 4.39315852,13.3001235 C4.43318815,12.6693 5.30678815,12.4325353 5.66435852,12.3536824 C6.02151407,12.2748294 6.29964741,12.7084176 6.73665481,12.9847118 C7.17345481,13.2605941 6.77626963,12.5904471 7.01458074,12.1171235 C7.25289185,11.6440059 8.16652148,11.6835353 8.28557333,11.0133882 C8.40483259,10.3432412 8.24595852,9.79106471 8.96089185,9.71221176 C9.67561778,9.63335882 10.4301659,9.75153529 10.5098104,9.39659412 C10.58904,9.04206471 9.67561778,9.51518235 9.63600296,9.08138824 C9.59618074,8.6478 10.4301659,8.05650588 10.668477,8.49009412 C10.9067881,8.92368235 11.5026696,8.96321176 11.5821067,8.8053 C11.6615437,8.6478 11.5821067,8.37191765 11.3039733,7.70156471 C11.0260474,7.03121176 10.7479141,7.22844706 10.5098104,6.47944706 C10.2714993,5.73024118 9.87431407,6.51877059 9.47712889,6.12450588 C9.0799437,5.73024118 8.60332148,4.90218235 8.52367704,5.61206471 C8.44444741,6.32153529 8.44444741,6.7158 8.08708444,7.26777059 C7.72951407,7.81994706 7.57084741,7.38615294 7.25289185,7.03121176 C6.9351437,6.67647647 6.22021037,6.32153529 6.45852148,6.00632941 C6.69683259,5.69071176 6.9351437,4.86285882 7.29250667,5.09962353 C7.65007704,5.33618235 8.2061363,5.33618235 8.12669926,4.94171176 C8.04726222,4.54765294 8.12669926,4.38974118 8.28557333,4.19271176 C8.44444741,3.99547647 9.00050667,3.64053529 9.00050667,4.35041765 C9.00050667,5.06009412 8.92086222,5.25732941 9.47712889,5.33618235 C10.0331881,5.41503529 10.668477,5.45435882 10.6290696,5.09962353 C10.58904,4.74468235 10.7879437,4.82353529 10.6290696,4.23203529 C10.4699881,3.64053529 9.99336593,3.60141765 9.47712889,3.32512353 C8.96089185,3.04924118 8.68275852,2.61565294 8.24595852,2.77335882 C7.80915852,2.93106471 7.76912889,3.08856471 7.72951407,3.52235882 C7.68969185,3.95615294 7.45138074,4.11385882 7.29250667,3.91662353 C7.13384,3.71959412 7.33232889,3.08856471 6.73665481,3.48303529 C6.14077333,3.87709412 5.90266963,4.54765294 5.58492148,4.07432941 C5.26696593,3.60141765 6.0613363,2.77335882 5.22735111,3.1283 C4.39315852,3.48303529 3.79727704,3.87709412 4.23428444,4.03500588 C4.67129185,4.19271176 5.10829926,4.4688 4.67129185,4.62650588 C4.23428444,4.78400588 3.36047704,4.50812353 3.04272889,4.82353529 C2.72498074,5.13874118 1.85138074,6.7158 1.85138074,6.7158" id="Fill-1" fill="#2196F3" mask="url(#mask-3)"></path>
+                </g>
+                <g id="Group-6">
+                    <mask id="mask-5" fill="white">
+                        <use xlink:href="#path-4"></use>
+                    </mask>
+                    <g id="Clip-5"></g>
+                    <path d="M1.85138074,6.7158 C1.69250667,7.85927059 2.08948444,8.45077059 1.85138074,9.00253529 C1.61306963,9.55450588 1.3349363,10.5402706 1.57324741,11.2104176 C1.81155852,11.8805647 2.16892148,13.3392412 2.48666963,13.3789765 C2.80441778,13.4180941 2.24856593,11.8019176 2.56610667,12.3143588 C2.88406222,12.8270059 2.88406222,13.5893882 3.44012148,14.1150059 C3.99597333,14.6406235 4.75072889,14.5617706 5.34661037,15.0740059 C5.94228444,15.5866529 6.53795852,16.3358588 7.09401778,16.2570059 C7.09401778,16.2570059 7.05419556,16.6510647 6.77626963,17.3214176 C6.4983437,17.9915647 6.45852148,18.7798882 6.81609185,19.2532118 C7.17345481,19.7263294 7.53081778,20.4362118 7.84877333,20.7909471 C8.16652148,21.1456824 8.40483259,23.0381529 8.32518815,23.9841824 C8.24595852,24.9304176 8.68275852,27.0594471 9.67561778,27.5327706 C10.668477,28.0058882 9.67561778,27.2960059 9.47712889,26.7047118 C9.27843259,26.1134176 9.63040296,24.7333882 10.1101363,24.5361529 C10.58904,24.3389176 11.0260474,23.5505941 11.3834104,22.9984176 C11.7409807,22.4466529 12.654403,22.2098882 12.9325363,21.5399471 C13.2106696,20.8698 13.0914104,20.0810647 13.2502844,19.7263294 C13.4091585,19.3713882 13.8461659,18.5828588 12.8927141,18.1097412 C11.939677,17.6366235 11.5424919,17.8733882 11.5026696,17.4395941 C11.4628474,17.0058 11.2245363,16.5328882 10.5496326,16.3358588 C9.87431407,16.1384176 9.27843259,15.7560941 8.52367704,15.6714765 C7.76912889,15.5866529 7.61025481,16.1781529 7.21306963,15.8625353 C6.81609185,15.5473294 6.4983437,15.2317118 6.33926222,14.8376529 C6.18059556,14.4433882 5.70376593,14.6799471 5.74379556,14.4433882 C5.78320296,14.2066235 6.41869926,13.5366824 5.70376593,13.7732412 C4.98904,14.0095941 4.3535437,13.9307412 4.39315852,13.3001235 C4.43318815,12.6693 5.30678815,12.4325353 5.66435852,12.3536824 C6.02151407,12.2748294 6.29964741,12.7084176 6.73665481,12.9847118 C7.17345481,13.2605941 6.77626963,12.5904471 7.01458074,12.1171235 C7.25289185,11.6440059 8.16652148,11.6835353 8.28557333,11.0133882 C8.40483259,10.3432412 8.24595852,9.79106471 8.96089185,9.71221176 C9.67561778,9.63335882 10.4301659,9.75153529 10.5098104,9.39659412 C10.58904,9.04206471 9.67561778,9.51518235 9.63600296,9.08138824 C9.59618074,8.6478 10.4301659,8.05650588 10.668477,8.49009412 C10.9067881,8.92368235 11.5026696,8.96321176 11.5821067,8.8053 C11.6615437,8.6478 11.5821067,8.37191765 11.3039733,7.70156471 C11.0260474,7.03121176 10.7479141,7.22844706 10.5098104,6.47944706 C10.2714993,5.73024118 9.87431407,6.51877059 9.47712889,6.12450588 C9.0799437,5.73024118 8.60332148,4.90218235 8.52367704,5.61206471 C8.44444741,6.32153529 8.44444741,6.7158 8.08708444,7.26777059 C7.72951407,7.81994706 7.57084741,7.38615294 7.25289185,7.03121176 C6.9351437,6.67647647 6.22021037,6.32153529 6.45852148,6.00632941 C6.69683259,5.69071176 6.9351437,4.86285882 7.29250667,5.09962353 C7.65007704,5.33618235 8.2061363,5.33618235 8.12669926,4.94171176 C8.04726222,4.54765294 8.12669926,4.38974118 8.28557333,4.19271176 C8.44444741,3.99547647 9.00050667,3.64053529 9.00050667,4.35041765 C9.00050667,5.06009412 8.92086222,5.25732941 9.47712889,5.33618235 C10.0331881,5.41503529 10.668477,5.45435882 10.6290696,5.09962353 C10.58904,4.74468235 10.7879437,4.82353529 10.6290696,4.23203529 C10.4699881,3.64053529 9.99336593,3.60141765 9.47712889,3.32512353 C8.96089185,3.04924118 8.68275852,2.61565294 8.24595852,2.77335882 C7.80915852,2.93106471 7.76912889,3.08856471 7.72951407,3.52235882 C7.68969185,3.95615294 7.45138074,4.11385882 7.29250667,3.91662353 C7.13384,3.71959412 7.33232889,3.08856471 6.73665481,3.48303529 C6.14077333,3.87709412 5.90266963,4.54765294 5.58492148,4.07432941 C5.26696593,3.60141765 6.0613363,2.77335882 5.22735111,3.1283 C4.39315852,3.48303529 3.79727704,3.87709412 4.23428444,4.03500588 C4.67129185,4.19271176 5.10829926,4.4688 4.67129185,4.62650588 C4.23428444,4.78400588 3.36047704,4.50812353 3.04272889,4.82353529 C2.72498074,5.13874118 1.85138074,6.7158 1.85138074,6.7158 Z" id="Stroke-4" stroke="#2196F3" mask="url(#mask-5)"></path>
+                </g>
+                <g id="Group-9">
+                    <mask id="mask-7" fill="white">
+                        <use xlink:href="#path-6"></use>
+                    </mask>
+                    <g id="Clip-8"></g>
+                    <path d="M6.5378963,2.45802941 C6.53582222,2.89882353 6.65715556,3.24635294 7.05434074,2.85229412 C7.45152593,2.45802941 7.68962963,1.98491176 7.96797037,2.18194118 C8.2458963,2.37917647 8.72251852,2.32667647 8.9208,2.3135 C9.1197037,2.30032353 9.15931852,1.70882353 9.71537778,1.78767647 C10.271437,1.86652941 10.0729481,1.6695 10.6686222,1.35388235 C11.2645037,1.03847059 12.5354963,0.486705882 11.2246815,0.644411765 C9.91386667,0.802117647 9.83442963,0.447176471 8.9208,1.03847059 C8.00758519,1.62997059 7.8090963,1.62997059 7.57078519,1.78767647 C7.33247407,1.94538235 7.05434074,1.31455882 6.73659259,1.78767647 C6.41863704,2.26079412 6.54017778,2.00879412 6.5378963,2.45802941" id="Fill-7" fill="#2196F3" mask="url(#mask-7)"></path>
+                </g>
+                <g id="Group-12">
+                    <mask id="mask-9" fill="white">
+                        <use xlink:href="#path-8"></use>
+                    </mask>
+                    <g id="Clip-11"></g>
+                    <path d="M6.5378963,2.45802941 C6.53582222,2.89882353 6.65715556,3.24635294 7.05434074,2.85229412 C7.45152593,2.45802941 7.68962963,1.98491176 7.96797037,2.18194118 C8.2458963,2.37917647 8.72251852,2.32667647 8.9208,2.3135 C9.1197037,2.30032353 9.15931852,1.70882353 9.71537778,1.78767647 C10.271437,1.86652941 10.0729481,1.6695 10.6686222,1.35388235 C11.2645037,1.03847059 12.5354963,0.486705882 11.2246815,0.644411765 C9.91386667,0.802117647 9.83442963,0.447176471 8.9208,1.03847059 C8.00758519,1.62997059 7.8090963,1.62997059 7.57078519,1.78767647 C7.33247407,1.94538235 7.05434074,1.31455882 6.73659259,1.78767647 C6.41863704,2.26079412 6.54017778,2.00879412 6.5378963,2.45802941 Z" id="Stroke-10" stroke="#2196F3" mask="url(#mask-9)"></path>
+                </g>
+                <g id="Group-15">
+                    <mask id="mask-11" fill="white">
+                        <use xlink:href="#path-10"></use>
+                    </mask>
+                    <g id="Clip-14"></g>
+                    <path d="M11.3040148,1.23570588 C10.8346519,1.63841176 10.1126667,2.22147059 10.6685185,2.22147059 C11.2245778,2.22147059 11.4946222,1.93241176 11.7966074,2.3135 C12.0985926,2.69438235 11.9791259,3.28588235 11.9791259,3.56176471 C11.9791259,3.83785294 11.8202519,4.46888235 12.2176444,5.25720588 C12.6148296,6.04552941 12.6544444,6.55817647 13.051837,6.04552941 C13.4488148,5.53329412 14.4020593,4.54752941 14.8786815,4.46888235 C15.3553037,4.38982353 15.8323407,4.19258824 16.0704444,3.79832353 C16.3085481,3.40405882 16.0704444,3.02152941 16.4674222,2.73988235 C16.8644,2.45802941 16.784963,2.10308824 16.9044296,1.6695 C17.0232741,1.23570588 18.0959852,1.23570588 17.6191556,0.999352941 C17.1427407,0.762588235 16.2689333,0.604882353 15.2360444,0.723264706 C14.203363,0.841441176 12.1778222,0.486705882 11.3040148,1.23570588" id="Fill-13" fill="#2196F3" mask="url(#mask-11)"></path>
+                </g>
+                <g id="Group-18">
+                    <mask id="mask-13" fill="white">
+                        <use xlink:href="#path-12"></use>
+                    </mask>
+                    <g id="Clip-17"></g>
+                    <path d="M11.3040148,1.23570588 C10.8346519,1.63841176 10.1126667,2.22147059 10.6685185,2.22147059 C11.2245778,2.22147059 11.4946222,1.93241176 11.7966074,2.3135 C12.0985926,2.69438235 11.9791259,3.28588235 11.9791259,3.56176471 C11.9791259,3.83785294 11.8202519,4.46888235 12.2176444,5.25720588 C12.6148296,6.04552941 12.6544444,6.55817647 13.051837,6.04552941 C13.4488148,5.53329412 14.4020593,4.54752941 14.8786815,4.46888235 C15.3553037,4.38982353 15.8323407,4.19258824 16.0704444,3.79832353 C16.3085481,3.40405882 16.0704444,3.02152941 16.4674222,2.73988235 C16.8644,2.45802941 16.784963,2.10308824 16.9044296,1.6695 C17.0232741,1.23570588 18.0959852,1.23570588 17.6191556,0.999352941 C17.1427407,0.762588235 16.2689333,0.604882353 15.2360444,0.723264706 C14.203363,0.841441176 12.1778222,0.486705882 11.3040148,1.23570588 Z" id="Stroke-16" stroke="#2196F3" mask="url(#mask-13)"></path>
+                </g>
+                <g id="Group-21">
+                    <mask id="mask-15" fill="white">
+                        <use xlink:href="#path-14"></use>
+                    </mask>
+                    <g id="Clip-20"></g>
+                    <path d="M6.93518519,13.4181353 C6.68256296,13.8270176 6.81592593,13.8519294 7.09405926,13.9307824 C7.37198519,14.0096353 6.9748,14.4825471 7.29254815,14.5220765 C7.6102963,14.5618118 8.32522963,14.7588412 8.52371852,14.5220765 C8.72262222,14.2857235 8.20617778,14.3779588 7.84860741,14.1150471 C7.49145185,13.8519294 7.11459259,13.1278412 6.93518519,13.4181353" id="Fill-19" fill="#2196F3" mask="url(#mask-15)"></path>
+                </g>
+                <g id="Group-24">
+                    <mask id="mask-17" fill="white">
+                        <use xlink:href="#path-16"></use>
+                    </mask>
+                    <g id="Clip-23"></g>
+                    <path d="M6.93518519,13.4181353 C6.68256296,13.8270176 6.81592593,13.8519294 7.09405926,13.9307824 C7.37198519,14.0096353 6.9748,14.4825471 7.29254815,14.5220765 C7.6102963,14.5618118 8.32522963,14.7588412 8.52371852,14.5220765 C8.72262222,14.2857235 8.20617778,14.3779588 7.84860741,14.1150471 C7.49145185,13.8519294 7.11459259,13.1278412 6.93518519,13.4181353 Z" id="Stroke-22" stroke="#2196F3" mask="url(#mask-17)"></path>
+                </g>
+                <g id="Group-27">
+                    <mask id="mask-19" fill="white">
+                        <use xlink:href="#path-18"></use>
+                    </mask>
+                    <g id="Clip-26"></g>
+                    <path d="M26.1584504,19.8445265 C25.7305689,20.0572029 25.9203467,20.3967029 25.5229541,20.6332618 C25.1257689,20.8696147 25.284643,20.9484676 25.1655911,21.5006441 C25.0463319,22.0524088 25.2052059,22.3678206 25.4833393,21.9342324 C25.7614726,21.5006441 26.6350726,19.6081735 26.1584504,19.8445265" id="Fill-25" fill="#2196F3" mask="url(#mask-19)"></path>
+                </g>
+                <g id="Group-30">
+                    <mask id="mask-21" fill="white">
+                        <use xlink:href="#path-20"></use>
+                    </mask>
+                    <g id="Clip-29"></g>
+                    <path d="M26.1584504,19.8445265 C25.7305689,20.0572029 25.9203467,20.3967029 25.5229541,20.6332618 C25.1257689,20.8696147 25.284643,20.9484676 25.1655911,21.5006441 C25.0463319,22.0524088 25.2052059,22.3678206 25.4833393,21.9342324 C25.7614726,21.5006441 26.6350726,19.6081735 26.1584504,19.8445265 Z" id="Stroke-28" stroke="#2196F3" mask="url(#mask-21)"></path>
+                </g>
+                <g id="Group-33">
+                    <mask id="mask-23" fill="white">
+                        <use xlink:href="#path-22"></use>
+                    </mask>
+                    <g id="Clip-32"></g>
+                    <path d="M26.5159378,11.4075706 C26.3966785,11.5259529 26.1981896,10.8556 26.0791378,10.5401882 C25.9598785,10.2247765 25.9627822,9.67651176 26.29816,9.37180588 C26.7158785,8.99174706 26.5159378,9.86983529 26.5159378,10.3431588 C26.5159378,10.8160706 26.6349896,11.2891882 26.5159378,11.4075706 M25.1254785,10.1854529 C24.8473452,10.0277471 24.331523,10.1854529 23.6960267,10.3824824 C23.060323,10.5797176 23.5688859,9.94374706 23.8549007,9.5151 C24.1106341,9.13195294 23.9739526,9.63327647 24.5302193,9.67280588 C25.0860711,9.71233529 25.4040267,10.3431588 25.1254785,10.1854529 M24.2124711,11.5259529 C24.1726489,11.8411588 24.331523,12.3538059 23.4577156,12.1567765 C22.5839081,11.9595412 22.5839081,11.4864235 22.2265452,11.8411588 C21.8691822,12.1961 21.4321748,12.5113059 20.9157304,11.9595412 C20.3994933,11.4075706 20.4789304,11.2498647 20.2010044,11.2103353 C20.0029304,11.1825412 19.3427526,11.0361588 18.7922933,11.1951 C18.8350193,11.1697765 18.8806489,11.1364235 18.9298044,11.0921588 C19.3269896,10.7374235 19.2475526,10.6190412 19.6843526,10.2247765 C20.1215674,9.83030588 20.4391081,9.47577647 20.7568563,9.83030588 C21.0746044,10.1854529 21.749923,10.2643059 21.5116119,10.6585706 C21.2733007,11.0526294 21.4321748,11.2891882 21.7103081,11.0526294 C21.9880267,10.8160706 22.3854193,10.6585706 22.1074933,10.3431588 C21.8291526,10.0277471 21.5510193,9.19968824 21.9486193,9.75165882 C22.3458044,10.3036294 22.4648563,10.5797176 22.70296,10.8949235 C22.9414785,11.2103353 23.1797896,11.4075706 23.2592267,11.2103353 C23.3386637,11.0133059 23.2194044,10.5797176 23.3386637,10.5008647 C23.4577156,10.4220118 23.3386637,11.1710118 23.6960267,11.2103353 C24.0533896,11.2498647 24.2520859,11.2103353 24.2124711,11.5259529 M28.4224267,13.2213941 C28.3033748,12.5508353 27.4295674,6.47936471 27.4295674,6.47936471 C27.4295674,6.47936471 25.0860711,4.98115882 24.6890933,5.29636471 C24.2917007,5.61198235 23.6165896,5.56442353 23.6960267,5.25312941 C23.7754637,4.94183529 24.2917007,5.02089412 23.4176859,4.42918824 C22.5442933,3.83768824 22.3854193,3.32524706 21.7103081,4.07424706 C21.0347822,4.82345294 20.8761156,5.45427647 20.4789304,5.65151176 C20.0817452,5.84854118 19.763997,6.47936471 20.2010044,6.63707059 C20.6378044,6.79457059 20.6776267,6.63707059 21.0347822,6.95227647 C21.39256,7.26789412 21.8691822,7.18883529 21.9486193,6.99201176 C22.0280563,6.79457059 22.1074933,6.16395294 22.1471081,5.92739412 C22.1869304,5.69083529 22.5905452,4.90230588 22.5474044,5.53312941 C22.5044711,6.16395294 23.1001452,6.16395294 22.70296,6.59754118 C22.3059822,7.03112941 22.5442933,7.38627647 21.749923,7.46512941 C20.9553452,7.54377647 20.9157304,7.07086471 20.4789304,7.30742353 C20.041923,7.54377647 20.0817452,7.70168824 19.9228711,7.93804118 C19.763997,8.1746 18.9298044,8.64771765 18.9298044,8.64771765 C18.9298044,8.64771765 18.2546933,8.41115882 18.5722341,8.84495294 C18.8901896,9.27854118 19.1681156,9.79098235 18.8901896,9.83030588 C18.6120563,9.86983529 17.8573007,9.43624706 17.8573007,9.90936471 C17.8573007,10.3824824 17.7384563,10.8949235 18.0562044,11.0133059 C18.2804119,11.0966882 18.4260119,11.2776588 18.63176,11.2523353 C18.4722637,11.3206882 18.3272859,11.4197176 18.2150785,11.5652765 C17.9058341,11.9661294 18.0958193,12.6692176 17.460323,12.9057765 C16.8250341,13.1425412 16.8250341,13.4182176 16.7055674,13.9308647 C16.586723,14.4433059 16.7055674,15.7442765 16.8644415,15.8626588 C17.0231081,15.9808353 17.3014489,16.9666 17.9767674,16.8875412 C18.6520859,16.8086882 19.3668119,16.7784235 19.605123,16.8922765 C19.8434341,17.0057176 20.2404119,16.6511882 20.3596711,17.5578941 C20.4789304,18.4646 20.7568563,18.5829824 20.9157304,19.0561 C21.0746044,19.5290118 20.8362933,20.5149824 20.9157304,21.1062765 C20.9951674,21.6975706 21.5510193,22.7228647 21.5510193,23.2353059 C21.5510193,23.7477471 22.1471081,23.9843059 22.4648563,23.7872765 C22.7826044,23.5900412 23.4577156,23.1957765 23.7356415,22.5649529 C24.0139822,21.9343353 24.0139822,21.6189235 24.4505748,20.7908647 C24.8873748,19.9630118 24.7685304,19.3715118 24.9668119,18.7406882 C25.1655081,18.1098647 25.6433748,17.6760706 26.29816,16.9666 C26.9527378,16.2571294 26.8349304,15.8626588 26.29816,15.9019824 C25.7613896,15.9413059 25.4034044,15.4290706 25.1254785,14.7982471 C24.8479674,14.1672176 24.5302193,12.5903647 24.7685304,13.1028059 C25.0068415,13.6156588 25.4832563,15.0348059 25.9598785,15.2713647 C26.4365007,15.5079235 27.3105156,14.8692765 27.5090044,14.6366294 C27.7074933,14.4037765 27.6280563,13.7338353 27.1116119,13.4577471 C26.5953748,13.1816588 26.913123,12.9453059 27.4295674,13.2605118 C27.9458044,13.5759235 28.5416859,13.8913353 28.4224267,13.2213941" id="Fill-31" fill="#2196F3" mask="url(#mask-23)"></path>
+                </g>
+                <g id="Group-36">
+                    <mask id="mask-25" fill="white">
+                        <use xlink:href="#path-24"></use>
+                    </mask>
+                    <g id="Clip-35"></g>
+                    <path d="M26.5159378,11.4075706 C26.3966785,11.5259529 26.1981896,10.8556 26.0791378,10.5401882 C25.9598785,10.2247765 25.9627822,9.67651176 26.29816,9.37180588 C26.7158785,8.99174706 26.5159378,9.86983529 26.5159378,10.3431588 C26.5159378,10.8160706 26.6349896,11.2891882 26.5159378,11.4075706 Z M25.1254785,10.1854529 C24.8473452,10.0277471 24.331523,10.1854529 23.6960267,10.3824824 C23.060323,10.5797176 23.5688859,9.94374706 23.8549007,9.5151 C24.1106341,9.13195294 23.9739526,9.63327647 24.5302193,9.67280588 C25.0860711,9.71233529 25.4040267,10.3431588 25.1254785,10.1854529 Z M24.2124711,11.5259529 C24.1726489,11.8411588 24.331523,12.3538059 23.4577156,12.1567765 C22.5839081,11.9595412 22.5839081,11.4864235 22.2265452,11.8411588 C21.8691822,12.1961 21.4321748,12.5113059 20.9157304,11.9595412 C20.3994933,11.4075706 20.4789304,11.2498647 20.2010044,11.2103353 C20.0029304,11.1825412 19.3427526,11.0361588 18.7922933,11.1951 C18.8350193,11.1697765 18.8806489,11.1364235 18.9298044,11.0921588 C19.3269896,10.7374235 19.2475526,10.6190412 19.6843526,10.2247765 C20.1215674,9.83030588 20.4391081,9.47577647 20.7568563,9.83030588 C21.0746044,10.1854529 21.749923,10.2643059 21.5116119,10.6585706 C21.2733007,11.0526294 21.4321748,11.2891882 21.7103081,11.0526294 C21.9880267,10.8160706 22.3854193,10.6585706 22.1074933,10.3431588 C21.8291526,10.0277471 21.5510193,9.19968824 21.9486193,9.75165882 C22.3458044,10.3036294 22.4648563,10.5797176 22.70296,10.8949235 C22.9414785,11.2103353 23.1797896,11.4075706 23.2592267,11.2103353 C23.3386637,11.0133059 23.2194044,10.5797176 23.3386637,10.5008647 C23.4577156,10.4220118 23.3386637,11.1710118 23.6960267,11.2103353 C24.0533896,11.2498647 24.2520859,11.2103353 24.2124711,11.5259529 Z M28.4224267,13.2213941 C28.3033748,12.5508353 27.4295674,6.47936471 27.4295674,6.47936471 C27.4295674,6.47936471 25.0860711,4.98115882 24.6890933,5.29636471 C24.2917007,5.61198235 23.6165896,5.56442353 23.6960267,5.25312941 C23.7754637,4.94183529 24.2917007,5.02089412 23.4176859,4.42918824 C22.5442933,3.83768824 22.3854193,3.32524706 21.7103081,4.07424706 C21.0347822,4.82345294 20.8761156,5.45427647 20.4789304,5.65151176 C20.0817452,5.84854118 19.763997,6.47936471 20.2010044,6.63707059 C20.6378044,6.79457059 20.6776267,6.63707059 21.0347822,6.95227647 C21.39256,7.26789412 21.8691822,7.18883529 21.9486193,6.99201176 C22.0280563,6.79457059 22.1074933,6.16395294 22.1471081,5.92739412 C22.1869304,5.69083529 22.5905452,4.90230588 22.5474044,5.53312941 C22.5044711,6.16395294 23.1001452,6.16395294 22.70296,6.59754118 C22.3059822,7.03112941 22.5442933,7.38627647 21.749923,7.46512941 C20.9553452,7.54377647 20.9157304,7.07086471 20.4789304,7.30742353 C20.041923,7.54377647 20.0817452,7.70168824 19.9228711,7.93804118 C19.763997,8.1746 18.9298044,8.64771765 18.9298044,8.64771765 C18.9298044,8.64771765 18.2546933,8.41115882 18.5722341,8.84495294 C18.8901896,9.27854118 19.1681156,9.79098235 18.8901896,9.83030588 C18.6120563,9.86983529 17.8573007,9.43624706 17.8573007,9.90936471 C17.8573007,10.3824824 17.7384563,10.8949235 18.0562044,11.0133059 C18.2804119,11.0966882 18.4260119,11.2776588 18.63176,11.2523353 C18.4722637,11.3206882 18.3272859,11.4197176 18.2150785,11.5652765 C17.9058341,11.9661294 18.0958193,12.6692176 17.460323,12.9057765 C16.8250341,13.1425412 16.8250341,13.4182176 16.7055674,13.9308647 C16.586723,14.4433059 16.7055674,15.7442765 16.8644415,15.8626588 C17.0231081,15.9808353 17.3014489,16.9666 17.9767674,16.8875412 C18.6520859,16.8086882 19.3668119,16.7784235 19.605123,16.8922765 C19.8434341,17.0057176 20.2404119,16.6511882 20.3596711,17.5578941 C20.4789304,18.4646 20.7568563,18.5829824 20.9157304,19.0561 C21.0746044,19.5290118 20.8362933,20.5149824 20.9157304,21.1062765 C20.9951674,21.6975706 21.5510193,22.7228647 21.5510193,23.2353059 C21.5510193,23.7477471 22.1471081,23.9843059 22.4648563,23.7872765 C22.7826044,23.5900412 23.4577156,23.1957765 23.7356415,22.5649529 C24.0139822,21.9343353 24.0139822,21.6189235 24.4505748,20.7908647 C24.8873748,19.9630118 24.7685304,19.3715118 24.9668119,18.7406882 C25.1655081,18.1098647 25.6433748,17.6760706 26.29816,16.9666 C26.9527378,16.2571294 26.8349304,15.8626588 26.29816,15.9019824 C25.7613896,15.9413059 25.4034044,15.4290706 25.1254785,14.7982471 C24.8479674,14.1672176 24.5302193,12.5903647 24.7685304,13.1028059 C25.0068415,13.6156588 25.4832563,15.0348059 25.9598785,15.2713647 C26.4365007,15.5079235 27.3105156,14.8692765 27.5090044,14.6366294 C27.7074933,14.4037765 27.6280563,13.7338353 27.1116119,13.4577471 C26.5953748,13.1816588 26.913123,12.9453059 27.4295674,13.2605118 C27.9458044,13.5759235 28.5416859,13.8913353 28.4224267,13.2213941 Z" id="Stroke-34" stroke="#2196F3" mask="url(#mask-25)"></path>
+                </g>
+                <g id="Group-39">
+                    <mask id="mask-27" fill="white">
+                        <use xlink:href="#path-26"></use>
+                    </mask>
+                    <g id="Clip-38"></g>
+                    <path d="M18.8503674,6.59758235 C18.6070785,6.67025882 18.4135674,7.14955294 18.5326193,7.38631765 C18.6520859,7.62267059 18.4135674,7.26772941 18.0958193,7.46496471 C17.7778637,7.66199412 17.3060119,8.21417059 17.7405304,8.25328824 C18.1752563,8.29302353 18.0958193,7.93808235 18.4930044,8.09578824 C18.8901896,8.25328824 19.3269896,8.21417059 19.3269896,7.81990588 C19.3269896,7.42543529 19.2475526,6.47940588 18.8503674,6.59758235" id="Fill-37" fill="#2196F3" mask="url(#mask-27)"></path>
+                </g>
+                <g id="Group-42">
+                    <mask id="mask-29" fill="white">
+                        <use xlink:href="#path-28"></use>
+                    </mask>
+                    <g id="Clip-41"></g>
+                    <path d="M18.8503674,6.59758235 C18.6070785,6.67025882 18.4135674,7.14955294 18.5326193,7.38631765 C18.6520859,7.62267059 18.4135674,7.26772941 18.0958193,7.46496471 C17.7778637,7.66199412 17.3060119,8.21417059 17.7405304,8.25328824 C18.1752563,8.29302353 18.0958193,7.93808235 18.4930044,8.09578824 C18.8901896,8.25328824 19.3269896,8.21417059 19.3269896,7.81990588 C19.3269896,7.42543529 19.2475526,6.47940588 18.8503674,6.59758235 Z" id="Stroke-40" stroke="#2196F3" mask="url(#mask-29)"></path>
+                </g>
+                <g id="Group-45">
+                    <mask id="mask-31" fill="white">
+                        <use xlink:href="#path-30"></use>
+                    </mask>
+                    <g id="Clip-44"></g>
+                    <path d="M16.2689333,4.78404706 C16.0295852,4.81801765 15.9509778,5.41487059 16.4674222,5.49372353 C16.9838667,5.57257647 17.9082815,5.37534118 17.5652296,5.05992941 C17.2221778,4.74472353 16.8252,4.70519412 16.2689333,4.78404706" id="Fill-43" fill="#2196F3" mask="url(#mask-31)"></path>
+                </g>
+                <g id="Group-48">
+                    <mask id="mask-33" fill="white">
+                        <use xlink:href="#path-32"></use>
+                    </mask>
+                    <g id="Clip-47"></g>
+                    <path d="M16.2689333,4.78404706 C16.0295852,4.81801765 15.9509778,5.41487059 16.4674222,5.49372353 C16.9838667,5.57257647 17.9082815,5.37534118 17.5652296,5.05992941 C17.2221778,4.74472353 16.8252,4.70519412 16.2689333,4.78404706 Z" id="Stroke-46" stroke="#2196F3" mask="url(#mask-33)"></path>
+                </g>
+            </g>
+            <g id="Group-54">
+                <path d="M28.1296528,14.2858085 C28.1296528,21.8560338 21.992681,27.9932099 14.4222514,27.9932099 C6.85182183,27.9932099 0.71485,21.8560338 0.71485,14.2858085 C0.71485,6.71537887 6.85182183,0.578407042 14.4222514,0.578407042 C21.992681,0.578407042 28.1296528,6.71537887 28.1296528,14.2858085 Z" id="Stroke-50" stroke="#2196F3"></path>
+                <path d="M14.4854387,1.69603028 C7.4461993,1.69603028 1.71931197,7.42291761 1.71931197,14.462157 C1.71931197,21.5013965 7.4461993,27.2280796 14.4854387,27.2280796 C21.5246782,27.2280796 27.2513613,21.5013965 27.2513613,14.462157 C27.2513613,7.42291761 21.5246782,1.69603028 14.4854387,1.69603028 M14.4854387,28.8618824 C6.54536127,28.8618824 0.0855091549,22.4022345 0.0855091549,14.462157 C0.0855091549,6.52187535 6.54536127,0.0622274648 14.4854387,0.0622274648 C22.4255162,0.0622274648 28.8851641,6.52187535 28.8851641,14.462157 C28.8851641,22.4022345 22.4255162,28.8618824 14.4854387,28.8618824" id="Fill-52" fill="#2196F3"></path>
+            </g>
+            <g id="Group-64" transform="translate(16.000000, 0.000000)">
+                <g id="Group-57">
+                    <mask id="mask-35" fill="white">
+                        <use xlink:href="#path-34"></use>
+                    </mask>
+                    <g id="Clip-56"></g>
+                    <path d="M7.92792,7.13868 C7.61952,7.44688 7.25072,7.60088 6.82132,7.60088 C6.39172,7.60088 6.02312,7.44688 5.71492,7.13868 C5.40672,6.83048 5.25232,6.46128 5.25232,6.03208 C5.25232,5.60268 5.40672,5.23948 5.71492,4.94208 C6.02312,4.64488 6.39172,4.49608 6.82132,4.49608 C7.25072,4.49608 7.61952,4.64488 7.92792,4.94208 C8.23592,5.23948 8.39032,5.60268 8.39032,6.03208 C8.39032,6.46128 8.23592,6.83048 7.92792,7.13868 M10.43812,2.53088 C9.44732,1.55088 8.24732,1.06088 6.83792,1.06088 C5.42852,1.06088 4.22852,1.55088 3.23752,2.53088 C2.24652,3.51048 1.75112,4.69428 1.75112,6.08168 C1.75112,6.91828 2.17492,8.31688 3.02292,10.27648 C3.87052,12.23628 4.71832,14.01988 5.56592,15.62728 C6.41412,17.23468 6.83792,18.01648 6.83792,17.97268 C6.96992,17.73048 7.15152,17.40008 7.38272,16.98168 C7.61412,16.56328 8.02152,15.77608 8.60512,14.61988 C9.18852,13.46368 9.70052,12.40108 10.14052,11.43288 C10.58132,10.46368 10.98872,9.46168 11.36292,8.42648 C11.73752,7.39188 11.92432,6.61008 11.92432,6.08168 C11.92432,4.69428 11.42892,3.51048 10.43812,2.53088" id="Fill-55" fill="#FFFFFF" mask="url(#mask-35)"></path>
+                </g>
+                <g id="Group-60">
+                    <mask id="mask-37" fill="white">
+                        <use xlink:href="#path-36"></use>
+                    </mask>
+                    <g id="Clip-59"></g>
+                    <path d="M7.92792,7.13868 C7.61952,7.44688 7.25072,7.60088 6.82132,7.60088 C6.39172,7.60088 6.02312,7.44688 5.71492,7.13868 C5.40672,6.83048 5.25232,6.46128 5.25232,6.03208 C5.25232,5.60268 5.40672,5.23948 5.71492,4.94208 C6.02312,4.64488 6.39172,4.49608 6.82132,4.49608 C7.25072,4.49608 7.61952,4.64488 7.92792,4.94208 C8.23592,5.23948 8.39032,5.60268 8.39032,6.03208 C8.39032,6.46128 8.23592,6.83048 7.92792,7.13868 M10.43812,2.53088 C9.44732,1.55088 8.24732,1.06088 6.83792,1.06088 C5.42852,1.06088 4.22852,1.55088 3.23752,2.53088 C2.24652,3.51048 1.75112,4.69428 1.75112,6.08168 C1.75112,6.91828 2.17492,8.31688 3.02292,10.27648 C3.87052,12.23628 4.71832,14.01988 5.56592,15.62728 C6.41412,17.23468 6.83792,18.01648 6.83792,17.97268 C6.96992,17.73048 7.15152,17.40008 7.38272,16.98168 C7.61412,16.56328 8.02152,15.77608 8.60512,14.61988 C9.18852,13.46368 9.70052,12.40108 10.14052,11.43288 C10.58132,10.46368 10.98872,9.46168 11.36292,8.42648 C11.73752,7.39188 11.92432,6.61008 11.92432,6.08168 C11.92432,4.69428 11.42892,3.51048 10.43812,2.53088" id="Fill-58" fill="#FFFFFF" mask="url(#mask-37)"></path>
+                </g>
+                <g id="Group-63">
+                    <mask id="mask-39" fill="white">
+                        <use xlink:href="#path-38"></use>
+                    </mask>
+                    <g id="Clip-62"></g>
+                    <path d="M6.82128,4.9961 C6.51968,4.9961 6.27828,5.0933 6.06188,5.3021 C5.85068,5.5057 5.75228,5.7377 5.75228,6.0321 C5.75228,6.3301 5.85268,6.5695 6.06828,6.7851 C6.28368,7.0005 6.52308,7.1009 6.82128,7.1009 C7.11948,7.1009 7.35888,7.0005 7.57448,6.7849 C7.78988,6.5695 7.89028,6.3301 7.89028,6.0321 C7.89028,5.7377 7.79188,5.5057 7.58068,5.3017 C7.36428,5.0933 7.12288,4.9961 6.82128,4.9961 L6.82128,4.9961 Z M6.82128,8.1009 C6.25648,8.1009 5.76528,7.8961 5.36128,7.4921 C4.95728,7.0881 4.75228,6.5969 4.75228,6.0321 C4.75228,5.4639 4.95928,4.9761 5.36748,4.5823 C5.77108,4.1933 6.26008,3.9961 6.82128,3.9961 C7.38228,3.9961 7.87128,4.1933 8.27488,4.5821 C8.68348,4.9763 8.89028,5.4641 8.89028,6.0321 C8.89028,6.5967 8.68548,7.0879 8.28168,7.4921 C7.87728,7.8961 7.38608,8.1009 6.82128,8.1009 L6.82128,8.1009 Z M6.83788,1.5609 C5.55368,1.5609 4.49108,1.9945 3.58908,2.8865 C2.68888,3.7763 2.25108,4.8215 2.25108,6.0817 C2.25108,6.6073 2.46468,7.7273 3.48188,10.0779 C4.31968,12.0155 5.16968,13.8041 6.00828,15.3941 C6.38528,16.1089 6.64868,16.6035 6.83208,16.9447 C6.86828,16.8789 6.90608,16.8105 6.94528,16.7399 C7.17208,16.3295 7.58028,15.5405 8.15888,14.3947 C8.73768,13.2469 9.25128,12.1809 9.68528,11.2259 C10.11888,10.2727 10.52508,9.2735 10.89248,8.2565 C11.33228,7.0427 11.42448,6.4039 11.42448,6.0817 C11.42448,4.8215 10.98668,3.7765 10.08648,2.8865 C9.18468,1.9945 8.12208,1.5609 6.83788,1.5609 L6.83788,1.5609 Z M7.04328,18.4751 L6.83508,18.4745 C6.52208,18.4733 6.46988,18.3767 6.06328,17.6257 C5.85068,17.2335 5.53768,16.6451 5.12388,15.8607 C4.27328,14.2479 3.41208,12.4359 2.56388,10.4749 C1.68068,8.4333 1.25108,6.9963 1.25108,6.0817 C1.25108,4.5619 1.80108,3.2475 2.88588,2.1753 C3.96928,1.1041 5.29908,0.5609 6.83788,0.5609 C8.37688,0.5609 9.70648,1.1041 10.78968,2.1753 C11.87448,3.2477 12.42448,4.5621 12.42448,6.0817 C12.42448,6.6751 12.23108,7.4977 11.83308,8.5967 C11.45648,9.6383 11.04028,10.6623 10.59568,11.6399 C10.15628,12.6071 9.63668,13.6855 9.05148,14.8451 C8.45908,16.0185 8.05648,16.7965 7.82048,17.2235 C7.62348,17.5797 7.46268,17.8721 7.33788,18.1003 L7.33788,18.1803 L7.04328,18.4751 Z" id="Fill-61" fill="#2196F3" mask="url(#mask-39)"></path>
+                </g>
+            </g>
+        </g>
+        <g id="Translation-Manageme" transform="translate(40.000000, 6.000000)" fill-rule="nonzero">
+            <path d="M2.688,9.94 L2.688,1.946 L1.42108547e-14,1.946 L1.42108547e-14,0.504 L7.126,0.504 L7.126,1.946 L4.41,1.946 L4.41,9.94 L2.688,9.94 Z M7.462,9.94 L7.462,5.32 C7.462,4.396 7.448,3.724 7.406,3.122 L8.89,3.122 L8.96,4.41 L9.002,4.41 C9.338,3.458 10.136,2.968 10.878,2.968 C11.046,2.968 11.144,2.982 11.284,3.01 L11.284,4.62 C11.13,4.592 10.976,4.578 10.766,4.578 C9.954,4.578 9.38,5.096 9.226,5.88 C9.198,6.034 9.184,6.216 9.184,6.398 L9.184,9.94 L7.462,9.94 Z M17.612,5.852 L17.612,8.302 C17.612,8.918 17.64,9.52 17.724,9.94 L16.17,9.94 L16.044,9.184 L16.002,9.184 C15.596,9.716 14.882,10.094 13.986,10.094 C12.614,10.094 11.844,9.1 11.844,8.064 C11.844,6.356 13.37,5.474 15.89,5.488 L15.89,5.376 C15.89,4.928 15.708,4.186 14.504,4.186 C13.832,4.186 13.132,4.396 12.67,4.69 L12.334,3.57 C12.838,3.262 13.72,2.968 14.798,2.968 C16.982,2.968 17.612,4.354 17.612,5.852 Z M15.932,7.546 L15.932,6.608 C14.714,6.594 13.552,6.846 13.552,7.882 C13.552,8.554 13.986,8.862 14.532,8.862 C15.232,8.862 15.722,8.414 15.89,7.924 C15.932,7.798 15.932,7.672 15.932,7.546 Z M19.432,9.94 L19.432,5.152 C19.432,4.368 19.404,3.71 19.376,3.122 L20.874,3.122 L20.958,4.144 L21,4.144 C21.308,3.612 22.05,2.968 23.184,2.968 C24.374,2.968 25.606,3.738 25.606,5.894 L25.606,9.94 L23.884,9.94 L23.884,6.09 C23.884,5.11 23.52,4.368 22.582,4.368 C21.896,4.368 21.42,4.858 21.238,5.376 C21.182,5.516 21.154,5.726 21.154,5.922 L21.154,9.94 L19.432,9.94 Z M27.02,9.604 L27.37,8.344 C27.748,8.582 28.49,8.848 29.106,8.848 C29.862,8.848 30.198,8.526 30.198,8.078 C30.198,7.616 29.918,7.392 29.078,7.084 C27.748,6.636 27.202,5.908 27.202,5.096 C27.202,3.892 28.196,2.968 29.778,2.968 C30.534,2.968 31.192,3.15 31.598,3.374 L31.248,4.578 C30.968,4.41 30.408,4.186 29.806,4.186 C29.19,4.186 28.854,4.494 28.854,4.914 C28.854,5.348 29.176,5.544 30.044,5.866 C31.29,6.3 31.85,6.93 31.864,7.938 C31.864,9.184 30.898,10.08 29.092,10.08 C28.266,10.08 27.524,9.884 27.02,9.604 Z M33.278,9.94 L33.278,-7.10542736e-15 L35,-7.10542736e-15 L35,9.94 L33.278,9.94 Z M42.168,5.852 L42.168,8.302 C42.168,8.918 42.196,9.52 42.28,9.94 L40.726,9.94 L40.6,9.184 L40.558,9.184 C40.152,9.716 39.438,10.094 38.542,10.094 C37.17,10.094 36.4,9.1 36.4,8.064 C36.4,6.356 37.926,5.474 40.446,5.488 L40.446,5.376 C40.446,4.928 40.264,4.186 39.06,4.186 C38.388,4.186 37.688,4.396 37.226,4.69 L36.89,3.57 C37.394,3.262 38.276,2.968 39.354,2.968 C41.538,2.968 42.168,4.354 42.168,5.852 Z M40.488,7.546 L40.488,6.608 C39.27,6.594 38.108,6.846 38.108,7.882 C38.108,8.554 38.542,8.862 39.088,8.862 C39.788,8.862 40.278,8.414 40.446,7.924 C40.488,7.798 40.488,7.672 40.488,7.546 Z M44.184,1.848 L45.878,1.372 L45.878,3.122 L47.516,3.122 L47.516,4.41 L45.878,4.41 L45.878,7.42 C45.878,8.26 46.102,8.68 46.76,8.68 C47.068,8.68 47.236,8.666 47.432,8.61 L47.46,9.912 C47.208,10.01 46.746,10.094 46.214,10.094 C45.57,10.094 45.052,9.884 44.73,9.534 C44.352,9.142 44.184,8.512 44.184,7.616 L44.184,4.41 L43.218,4.41 L43.218,3.122 L44.184,3.122 L44.184,1.848 Z M50.54,9.94 L48.818,9.94 L48.818,3.122 L50.54,3.122 L50.54,9.94 Z M49.686,0.28 C50.274,0.28 50.638,0.686 50.652,1.218 C50.652,1.722 50.274,2.142 49.672,2.142 C49.098,2.142 48.72,1.722 48.72,1.218 C48.72,0.686 49.112,0.28 49.686,0.28 Z M55.496,2.968 C57.526,2.968 58.884,4.396 58.884,6.468 C58.884,8.974 57.12,10.094 55.384,10.094 C53.466,10.094 51.968,8.778 51.968,6.58 C51.968,4.34 53.438,2.968 55.496,2.968 Z M55.454,4.214 C54.236,4.214 53.746,5.404 53.746,6.538 C53.746,7.854 54.404,8.848 55.44,8.848 C56.42,8.848 57.106,7.896 57.106,6.51 C57.106,5.446 56.63,4.214 55.454,4.214 Z M60.298,9.94 L60.298,5.152 C60.298,4.368 60.27,3.71 60.242,3.122 L61.74,3.122 L61.824,4.144 L61.866,4.144 C62.174,3.612 62.916,2.968 64.05,2.968 C65.24,2.968 66.472,3.738 66.472,5.894 L66.472,9.94 L64.75,9.94 L64.75,6.09 C64.75,5.11 64.386,4.368 63.448,4.368 C62.762,4.368 62.286,4.858 62.104,5.376 C62.048,5.516 62.02,5.726 62.02,5.922 L62.02,9.94 L60.298,9.94 Z M79.422,9.94 L79.24,6.09 C79.184,4.872 79.114,3.402 79.128,2.128 L79.086,2.128 C78.778,3.276 78.386,4.55 77.966,5.74 L76.58,9.828 L75.264,9.828 L74.004,5.796 C73.64,4.592 73.304,3.304 73.052,2.128 L73.024,2.128 C72.982,3.36 72.926,4.858 72.856,6.146 L72.646,9.94 L71.036,9.94 L71.666,0.504 L73.934,0.504 L75.166,4.298 C75.502,5.404 75.796,6.524 76.034,7.574 L76.076,7.574 C76.328,6.552 76.65,5.39 77.014,4.284 L78.316,0.504 L80.556,0.504 L81.102,9.94 L79.422,9.94 Z M88.13,5.852 L88.13,8.302 C88.13,8.918 88.158,9.52 88.242,9.94 L86.688,9.94 L86.562,9.184 L86.52,9.184 C86.114,9.716 85.4,10.094 84.504,10.094 C83.132,10.094 82.362,9.1 82.362,8.064 C82.362,6.356 83.888,5.474 86.408,5.488 L86.408,5.376 C86.408,4.928 86.226,4.186 85.022,4.186 C84.35,4.186 83.65,4.396 83.188,4.69 L82.852,3.57 C83.356,3.262 84.238,2.968 85.316,2.968 C87.5,2.968 88.13,4.354 88.13,5.852 Z M86.45,7.546 L86.45,6.608 C85.232,6.594 84.07,6.846 84.07,7.882 C84.07,8.554 84.504,8.862 85.05,8.862 C85.75,8.862 86.24,8.414 86.408,7.924 C86.45,7.798 86.45,7.672 86.45,7.546 Z M89Line truncated
+            <path d="M0.91,27.712 L0.91,20.376 C0.91,19.508 0.882,18.808 0.854,18.164 L1.946,18.164 L2.016,19.326 L2.044,19.326 C2.534,18.5 3.346,18.024 4.452,18.024 C6.104,18.024 7.336,19.41 7.336,21.454 C7.336,23.89 5.838,25.094 4.242,25.094 C3.346,25.094 2.562,24.702 2.156,24.03 L2.128,24.03 L2.128,27.712 L0.91,27.712 Z M2.128,21.006 L2.128,22.182 C2.128,22.364 2.142,22.532 2.184,22.686 C2.408,23.54 3.15,24.128 4.032,24.128 C5.334,24.128 6.09,23.064 6.09,21.51 C6.09,20.166 5.376,19.004 4.074,19.004 C3.234,19.004 2.436,19.592 2.212,20.516 C2.17,20.67 2.128,20.852 2.128,21.006 Z M11.746,18.024 C13.692,18.024 15.008,19.438 15.008,21.496 C15.008,24.002 13.258,25.094 11.634,25.094 C9.814,25.094 8.386,23.75 8.386,21.608 C8.386,19.354 9.884,18.024 11.746,18.024 Z M11.718,18.948 C10.276,18.948 9.646,20.292 9.646,21.566 C9.646,23.05 10.486,24.17 11.69,24.17 C12.866,24.17 13.748,23.064 13.748,21.538 C13.748,20.39 13.174,18.948 11.718,18.948 Z M15.694,18.164 L16.954,18.164 L17.864,21.608 C18.046,22.364 18.228,23.064 18.354,23.764 L18.396,23.764 C18.55,23.078 18.774,22.35 18.998,21.622 L20.104,18.164 L21.14,18.164 L22.19,21.552 C22.442,22.364 22.638,23.078 22.792,23.764 L22.834,23.764 C22.946,23.078 23.128,22.364 23.352,21.566 L24.318,18.164 L25.536,18.164 L23.352,24.94 L22.232,24.94 L21.196,21.706 C20.958,20.95 20.762,20.278 20.594,19.48 L20.566,19.48 C20.398,20.292 20.188,20.992 19.95,21.72 L18.858,24.94 L17.738,24.94 L15.694,18.164 Z M32.074,21.776 L27.314,21.776 C27.342,23.442 28.392,24.128 29.638,24.128 C30.52,24.128 31.066,23.974 31.514,23.778 L31.738,24.66 C31.304,24.856 30.548,25.094 29.47,25.094 C27.384,25.094 26.138,23.708 26.138,21.664 C26.138,19.62 27.342,18.024 29.316,18.024 C31.542,18.024 32.116,19.956 32.116,21.202 C32.116,21.454 32.102,21.636 32.074,21.776 Z M27.328,20.894 L30.926,20.894 C30.94,20.124 30.604,18.906 29.218,18.906 C27.958,18.906 27.426,20.04 27.328,20.894 Z M33.642,24.94 L33.642,20.278 C33.642,19.48 33.628,18.794 33.586,18.164 L34.664,18.164 L34.72,19.508 L34.762,19.508 C35.07,18.598 35.826,18.024 36.652,18.024 C36.778,18.024 36.876,18.038 36.988,18.052 L36.988,19.214 C36.862,19.186 36.736,19.186 36.568,19.186 C35.7,19.186 35.084,19.83 34.916,20.754 C34.888,20.922 34.874,21.132 34.874,21.328 L34.874,24.94 L33.642,24.94 Z M43.526,21.776 L38.766,21.776 C38.794,23.442 39.844,24.128 41.09,24.128 C41.972,24.128 42.518,23.974 42.966,23.778 L43.19,24.66 C42.756,24.856 42,25.094 40.922,25.094 C38.836,25.094 37.59,23.708 37.59,21.664 C37.59,19.62 38.794,18.024 40.768,18.024 C42.994,18.024 43.568,19.956 43.568,21.202 C43.568,21.454 43.554,21.636 43.526,21.776 Z M38.78,20.894 L42.378,20.894 C42.392,20.124 42.056,18.906 40.67,18.906 C39.41,18.906 38.878,20.04 38.78,20.894 Z M49.714,15 L50.932,15 L50.932,23.19 C50.932,23.792 50.96,24.478 50.988,24.94 L49.896,24.94 L49.84,23.764 L49.798,23.764 C49.434,24.52 48.622,25.094 47.516,25.094 C45.878,25.094 44.604,23.708 44.604,21.65 C44.59,19.396 46.004,18.024 47.642,18.024 C48.692,18.024 49.378,18.514 49.686,19.046 L49.714,19.046 L49.714,15 Z M49.714,22.098 L49.714,20.922 C49.714,20.768 49.7,20.558 49.658,20.404 C49.476,19.634 48.804,18.99 47.88,18.99 C46.606,18.99 45.85,20.11 45.85,21.594 C45.85,22.966 46.536,24.1 47.852,24.1 C48.678,24.1 49.434,23.54 49.658,22.63 C49.7,22.462 49.714,22.294 49.714,22.098 Z M55.958,23.19 L55.958,15 L57.176,15 L57.176,19.256 L57.204,19.256 C57.638,18.5 58.422,18.024 59.514,18.024 C61.208,18.024 62.384,19.424 62.384,21.468 C62.384,23.89 60.844,25.094 59.332,25.094 C58.352,25.094 57.568,24.716 57.05,23.834 L57.022,23.834 L56.952,24.94 L55.902,24.94 C55.93,24.478 55.958,23.792 55.958,23.19 Z M57.176,21.02 L57.176,22.224 C57.176,22.378 57.19,22.532 57.232,22.672 C57.456,23.526 58.184,24.114 59.08,24.114 C60.382,24.114 61.138,23.064 61.138,21.51 C61.138,20.152 60.438,18.99 59.108,18.99 C58.282,18.99 57.498,19.578 57.246,20.502 C57.204,20.656 57.176,20.824 57.176,21.02 Z M62.93,18.164 L64.274,18.164 L65.744,22.168 C65.912,22.616 66.08,23.148 66.192,23.554 L66.22,23.554 C66.346,23.148 66.486,22.63 66.654,22.14 L67.998,18.164 L69.3,18.164 L67.452,22.994 C66.57,25.318 65.968,26.494 65.128,27.236 C64.512,27.754 63.924,27.964 63.616,28.02 L63.308,26.998 C63.616,26.9 64.022,26.704 64.386,26.396 C64.722,26.13 65.128,25.654 65.422,25.024 C65.478,24.898 65.52,24.8 65.52,24.73 C65.52,24.66 65.492,24.562 65.422,24.408 L62.93,18.164 Z" id="poweredby" fill="#AAAAAA"></path>
+            <path d="M73.29,24.94 L73.29,15 L75.012,15 L75.012,24.94 L73.29,24.94 Z M79.982,17.968 C82.012,17.968 83.37,19.396 83.37,21.468 C83.37,23.974 81.606,25.094 79.87,25.094 C77.952,25.094 76.454,23.778 76.454,21.58 C76.454,19.34 77.924,17.968 79.982,17.968 Z M79.94,19.214 C78.722,19.214 78.232,20.404 78.232,21.538 C78.232,22.854 78.89,23.848 79.926,23.848 C80.906,23.848 81.592,22.896 81.592,21.51 C81.592,20.446 81.116,19.214 79.94,19.214 Z M89.558,23.456 L89.796,24.73 C89.432,24.898 88.718,25.08 87.864,25.08 C85.736,25.08 84.35,23.708 84.35,21.594 C84.35,19.55 85.75,17.968 88.144,17.968 C88.774,17.968 89.418,18.108 89.81,18.276 L89.502,19.578 C89.222,19.438 88.816,19.312 88.2,19.312 C86.884,19.312 86.1,20.278 86.114,21.524 C86.114,22.924 87.024,23.722 88.2,23.722 C88.788,23.722 89.222,23.596 89.558,23.456 Z M92.792,24.94 L91.07,24.94 L91.07,18.122 L92.792,18.122 L92.792,24.94 Z M91.938,15.28 C92.526,15.28 92.89,15.686 92.904,16.218 C92.904,16.722 92.526,17.142 91.924,17.142 C91.35,17.142 90.972,16.722 90.972,16.218 C90.972,15.686 91.364,15.28 91.938,15.28 Z M94.01,24.94 L94.01,23.946 L96.572,20.67 C96.922,20.25 97.216,19.914 97.566,19.522 L97.566,19.494 L94.262,19.494 L94.262,18.122 L99.666,18.122 L99.666,19.172 L97.174,22.378 C96.838,22.784 96.516,23.176 96.166,23.54 L96.166,23.568 L99.75,23.568 L99.75,24.94 L94.01,24.94 Z M106.638,22.014 L102.074,22.014 C102.116,23.246 103.068,23.778 104.174,23.778 C104.972,23.778 105.532,23.652 106.064,23.47 L106.316,24.646 C105.728,24.898 104.916,25.08 103.936,25.08 C101.724,25.08 100.422,23.722 100.422,21.636 C100.422,19.746 101.57,17.968 103.754,17.968 C105.966,17.968 106.694,19.788 106.694,21.286 C106.694,21.608 106.666,21.86 106.638,22.014 Z M102.074,20.81 L105.07,20.81 C105.084,20.18 104.804,19.144 103.656,19.144 C102.592,19.144 102.144,20.11 102.074,20.81 Z M108.724,25.094 C108.108,25.094 107.674,24.618 107.674,23.988 C107.674,23.344 108.122,22.882 108.738,22.882 C109.368,22.882 109.802,23.33 109.802,23.988 C109.802,24.618 109.382,25.094 108.724,25.094 Z M115.962,23.456 L116.2,24.73 C115.836,24.898 115.122,25.08 114.268,25.08 C112.14,25.08 110.754,23.708 110.754,21.594 C110.754,19.55 112.154,17.968 114.548,17.968 C115.178,17.968 115.822,18.108 116.214,18.276 L115.906,19.578 C115.626,19.438 115.22,19.312 114.604,19.312 C113.288,19.312 112.504,20.278 112.518,21.524 C112.518,22.924 113.428,23.722 114.604,23.722 C115.192,23.722 115.626,23.596 115.962,23.456 Z M120.442,17.968 C122.472,17.968 123.83,19.396 123.83,21.468 C123.83,23.974 122.066,25.094 120.33,25.094 C118.412,25.094 116.914,23.778 116.914,21.58 C116.914,19.34 118.384,17.968 120.442,17.968 Z M120.4,19.214 C119.182,19.214 118.692,20.404 118.692,21.538 C118.692,22.854 119.35,23.848 120.386,23.848 C121.366,23.848 122.052,22.896 122.052,21.51 C122.052,20.446 121.576,19.214 120.4,19.214 Z M125.244,24.94 L125.244,20.152 C125.244,19.368 125.216,18.71 125.188,18.122 L126.658,18.122 L126.742,19.13 L126.784,19.13 C127.106,18.598 127.722,17.968 128.884,17.968 C129.78,17.968 130.48,18.472 130.774,19.228 L130.802,19.228 C131.04,18.85 131.32,18.57 131.628,18.374 C132.02,18.108 132.454,17.968 133.028,17.968 C134.148,17.968 135.296,18.738 135.296,20.922 L135.296,24.94 L133.616,24.94 L133.616,21.174 C133.616,20.04 133.224,19.368 132.398,19.368 C131.81,19.368 131.376,19.788 131.194,20.278 C131.138,20.432 131.11,20.656 131.11,20.852 L131.11,24.94 L129.43,24.94 L129.43,20.992 C129.43,20.04 129.052,19.368 128.254,19.368 C127.61,19.368 127.176,19.872 127.008,20.334 C126.952,20.516 126.924,20.712 126.924,20.908 L126.924,24.94 L125.244,24.94 Z" id="locize.com" fill="#888888"></path>
+        </g>
+    </g>
+</svg>

docs/latest/browser-support.md

@@ -0,0 +1,47 @@
+# Browser Support
+
+The browsers that we support are specified in the `.browserlistrc` file located
+in the `platform/viewer` project. While we leverage the latest language features
+when writing code, we rely on `babel` to _transpile_ our code so that it can run
+in the browsers that we support.
+
+## In Practice
+
+The OHIF Viewer is capable of _running_ on:
+
+- IE 11
+- FireFox
+- Chrome
+- Safari
+- Edge
+
+However, we do not have the resources to adequately test and maintain bug free
+functionality across all of these. In order to push web based medical imaging
+forward, we focus our development efforts on recent version of modern evergreen
+browsers.
+
+Our support of older browsers equates to our willingness to review PRs for bug
+fixes, and target their minimum JS support whenever possible.
+
+### Polyfills
+
+> A polyfill, or polyfiller, is a piece of code (or plugin) that provides the
+> technology that you, the developer, expect the browser to provide natively.
+
+An example of a polyfill is that you expect `Array.prototype.filter` to exist,
+but for some reason, the browser that's being used has not implemented that
+language feature yet. Our earlier transpilation will rectify _syntax_
+discrepencies, but unimplemented features require a "temporary" implementation.
+That's where polyfills step in.
+
+You can utilize a service like [polyfill.io](https://polyfill.io/v3/) to
+auto-detect and apply polyfills as needed, or you can update the PWA build to
+include polyfill's in your bundle by incorporating [core-js][core-js]
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[core-js]: https://github.com/zloirock/core-js/blob/master/docs/2019-03-19-core-js-3-babel-and-a-look-into-the-future.md
+<!-- prettier-ignore-end -->

docs/latest/connecting-to-image-archives/google-cloud-healthcare.md

@@ -1,11 +1,5 @@
 # Google Cloud Healthcare
 
-> ATTENTION: The original documentation for this integration lives in the legacy
-> `version 1` Meteor documentation. You can
-> [find it here](/history/v1/connecting-to-image-archives/google-cloud-healthcare.html).
-> These docs will mirror the Meteor documentation until our `React`
-> implementation has been updated to work with Google Cloud Healthcare.
-
 > The [Google Cloud Healthcare API](https://cloud.google.com/healthcare/) is a
 > powerful option for storing medical imaging data in the cloud.
 
@@ -16,10 +10,7 @@ store their data in the cloud. It offers an
 [almost-entirely complete DICOMWeb API](https://cloud.google.com/healthcare/docs/dicom)
 which requires tokens generated via the
 [OAuth 2.0 Sign In flow](https://developers.google.com/identity/sign-in/web/sign-in).
-Images can even be transcoded on the fly if this is desired. The Cloud
-Healthcare API is a very attractive option because it allows us to avoid
-deploying the Meteor server entirely. We can just deploy OHIF as a client-only
-static site application.
+Images can even be transcoded on the fly if this is desired.
 
 ## Setup a Google Cloud Healthcare Project
 
@@ -46,8 +37,8 @@ static site application.
     [OAuth 2.0 Client ID](https://support.google.com/cloud/answer/6158849?hl=en)
   - Add your domain (e.g. `http://localhost:3000`) to Authorized JavaScript
     origins.
-  - Add your domain, plus `_oauth/google` (e.g.
-    `http://localhost:3000/_oauth/google`) to Authorized Redirect URIs.
+  - Add your domain, plus `callback` (e.g. `http://localhost:3000/callback`) to
+    Authorized Redirect URIs.
   - Save your Client ID for later.
 
 - (Optional): Enable Public Datasets that are being hosted by Google:
@@ -55,70 +46,26 @@ static site application.
 
 ## Run the viewer with your OAuth Client ID
 
-1. Open the `config/oidc-googleCloud.json` file and change `YOURCLIENTID` to
-   your Client ID value.
-1. Run the OHIF Viewer using the oidc-googleCloud.json configuration file
+1. Open the `config/google.js` file and change `YOURCLIENTID` to your Client ID
+   value.
+1. Run the OHIF Viewer using the config/google.js configuration file
 
 ```bash
 cd OHIFViewer
-METEOR_PACKAGE_DIRS="../Packages" meteor npm install
-METEOR_PACKAGE_DIRS="../Packages" meteor --settings ../config/oidc-googleCloud.json
+yarn install
+APP_CONFIG=config/google.js yarn run dev
 ```
 
 ## Running via Docker
 
-OHIF is also providing a Docker container which can connect to Google Cloud
-Healthcare with a Client ID which is provided at runtime. This is a very simple
-method to get up and running. Internally, the container is running
-[Nginx](https://nginx.org/) to serve the
-[Standalone Viewer](../standalone-viewer/usage.md).
+The OHIF Viewer Docker container can be connected to Google Cloud Healthcare by
+providing a Client ID at runtime. This is a very simple method to get up and
+running.
 
 1. Install Docker (https://www.docker.com/)
 1. Run the Docker container, providing a Client ID as an environment variable.
    Client IDs look like `xyz.apps.googleusercontent.com`.
 
 ```bash
-docker run --env CLIENT_ID=$CLIENT_ID --publish 3000:80 ohif/viewer-google-cloud:latest
-```
-
-## Building the ohif/viewer-google-cloud Docker Image
-
-The
-[ohif/viewer-google-cloud](https://cloud.docker.com/u/ohif/repository/docker/ohif/viewer-google-cloud)
-Docker image is built as follows. The Dockerfile and nginx.conf are in the
-`/dockersupport/viewer-google-cloud` folder.
-
-1. [Install Meteor](https://www.meteor.com/install)
-1. Clone the repository
-
-```bash
-git clone https://github.com/OHIF/Viewers.git
-cd Viewers
-```
-
-1. Install meteor-build-client-fixed2 so you can build the Standalone Viewer
-
-```bash
-npm install -g meteor-build-client-fixed2
-```
-
-1. Build the Standalone client-only OHIF Viewer
-
-```bash
-cd OHIFViewer/
-METEOR_PACKAGE_DIRS="../Packages" meteor npm install
-METEOR_PACKAGE_DIRS="../Packages" meteor-build-client-fixed2 ../dockersupport/viewer-google-cloud/build -s ../config/oidc.json
-```
-
-1. Build the Docker image
-
-```bash
-cd ../dockersupport/viewer-google-cloud
-docker build -t ohif/viewer-google-cloud .
-```
-
-1. Run the Docker image using an OAuth Client ID
-
-```bash
-docker run --env CLIENT_ID={$someID}.apps.googleusercontent.com --publish 3000:80 ohif/viewer-google-cloud
+docker run --env CLIENT_ID=$CLIENT_ID --publish 5000:80 ohif/viewer:latest
 ```

docs/latest/contributing.md

@@ -1,103 +0,0 @@
-# Contributing
-
-## I would like to contribute code - how do I do this?
-
-Fork the repository, make your change and submit a pull request.
-
-- The OHIF Viewer consists of code from three different repositories. Make sure
-  your change is modifying the appropriate one:
-  - `ohif-core`: Business Logic
-  - `react-viewerbase`: Reusable React Component Library
-  - `Viewers`: The glue, PWA, and primary extension point
-- At a minimum, you may want to read the following documentation:
-  - [Essentials: Getting Started](./essentials/getting-started.md)
-  - [Advanced: Architecture](./advanced/architecture.md)
-
-### When changes impact multiple repositories
-
-This is a particularly tricky scenario. We don't want to publish code in one
-repository, just so we can test and complete the other half of its requirements
-in another. Thankfully, there are a couple of ways you can test unpublished
-dependent changes locally before publishing:
-
-- [Use `yarn link`](https://yarnpkg.com/en/docs/cli/link)
-
-For example if you are working on `ohif-core` and would like to use your local
-version to debug a problem in `Viewers`, simply run yarn link inside of the
-`ohif-core` project.
-
-- If you're experiencing issues with `yarn link`,
-  [try `yalc`](https://github.com/whitecolor/yalc)
-
-Yalc provides an improved workflow as we add more and more dependent packages
-that are "in-progress". This comes into play as we begin working on extensions
-and their dependencies.
-
-```js
-// Install yalc for the first time
-yarn global add yalc
-
-// EXAMPLE: using an in-development version of ohif-core w/ Viewers locally
-// 1. Navigate to ohif-core's project root
-yarn install
-yalc publish
-
-// 2. Run the following after each change to ohif-core
-yarn build
-yalc push .
-
-// 3. Use the local package in our Viewers project. Navigate to the Viewers
-//    Project root.
-yarn install
-yalc add ohif-core
-yarn run dev
-```
-
-## Any guidance on submitting changes?
-
-While we do appreciate code contributions, triaging and integrating contributed
-code changes can be very time consuming. Please consider the following tips when
-working on your pull requests:
-
-- Functionality is appropriate for the repository. Consider creating a GitHub
-  issue to discuss your suggested changes.
-- The scope of the pull request is not too large. Please consider separate pull
-  requests for each feature as big pull requests are very time consuming to
-  understand.
-
-We will provide feedback on your pull requests as soon as possible. Following
-the tips above will help ensure your changes are reviewed.
-
-## Testing contribution pull requests
-
-OHIF uses [netlify](netlify.com) so that pull requests are autogenerated and
-available for testing.
-
-For example, [this url][example-url] allows you to test [pull request 237, the
-request that created this FAQ entry,][pr-237] using data pulled from Amazon S3.
-
-Replacing the number 237 in the link below with your pull request number should
-let you test it as well and you can use this link for discussions on github
-without requiring reviewers to download and build your branch.
-
-```bash
-https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
-```
-
-If you have made a documentation change, a link like this will let you preview
-the gitbook generated by the pull request:
-
-```bash
-https://deploy-preview-237--ohif.netlify.com/contributing.html
-```
-
-<!--
-  Links
-  -->
-
-<!-- prettier-ignore-start -->
-
-[example-url]: https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
-[pr-237]: https://github.com/OHIF/Viewers/pull/237
-
-<!-- prettier-ignore-end -->

docs/latest/contributing/index.md

@@ -0,0 +1,146 @@
+# Contributing
+
+## How can I help?
+
+Fork the repository, make your change and submit a pull request. If you would
+like to discuss the changes you intend to make to clarify where or how they
+should be implemented, please don't hesitate to create a new issue. At a
+minimum, you may want to read the following documentation:
+
+- [Essentials: Getting Started](./essentials/getting-started.md)
+- [Advanced: Architecture](./advanced/architecture.md)
+
+Pull requests that are:
+
+- Small
+- [Well tested](./testing.md)
+- Decoupled
+
+Are much more likely to get reviewed and merged in a timely manner.
+
+## When changes impact multiple repositories
+
+While this can be tricky, we've tried to reduce how often this situation crops
+up this with our [recent switch to a monorepo][monorepo]. Our maintained
+extensions, ui components, internationalization library, and business logic can
+all be developed by simply running `yarn run dev` from the repository root.
+
+Testing the viewer with locally developed, unpublished package changes from a
+package outside of the monorepo is most common with extension development. Let's
+demonstrate how to accomplish this with two commonly forked extension
+dependencies:
+
+### `cornerstone-tools`
+
+On your local file system:
+
+```bash
+# code/my-projects/
+.
+├── cornerstonejs/cornerstone-tools
+└── ohif/viewers
+```
+
+- Open a terminal/shell
+- Navigate to `cornerstonejs/cornerstone-tools`
+  - `npm install`
+  - [`yarn link`](https://yarnpkg.com/en/docs/cli/link)
+  - `npm run dev`
+- Open a new terminal/shell
+- Navigate to `ohif/viewers`.
+  - `yarn install`
+  - [`yarn link cornerstone-tools`](https://yarnpkg.com/en/docs/cli/link)
+  - `yarn run dev`
+
+As you make changed to `cornerstone-tools`, and it's output is rebuilt, you
+should see the following behavior:
+
+<div style="text-align: center;">
+  <a href="/assets/img/cornerstone-tools-link.gif">
+    <img src="/assets/img/cornerstone-tools-link.gif" alt="Example of linked cornerstone-tools package" style="margin: 0 auto; max-width: 500px;" />
+  </a>
+  <div><i>example of linked cornerstone-tools package</i></div>
+</div>
+
+If you wish to stop using your local package, run the following commands in the
+`ohif/viewers` repository root:
+
+- `yarn unlink cornerstone-tools`
+- `yarn install --force`
+
+### `react-vtkjs-viewport`
+
+On your local file system:
+
+```bash
+# code/my-projects/
+.
+├── ohif/react-vtkjs-viewport
+└── ohif/viewers
+```
+
+- Open a terminal/shell
+- Navigate to `ohif/react-vtkjs-viewport`
+  - `yarn install`
+  - [`yarn link`](https://yarnpkg.com/en/docs/cli/link)
+  - `yarn run start`
+- Open a new terminal/shell
+- Navigate to `ohif/viewers`.
+  - `yarn install`
+  - [`yarn link react-vtkjs-viewport`](https://yarnpkg.com/en/docs/cli/link)
+  - `yarn run dev`
+
+#### Other linkage notes
+
+We're still working out some of the kinks with local package development as
+there are a lot of factors that can influence the behavior of our development
+server and bundler. If you encounter issues not addressed here, please don't
+hesitate to reach out on GitHub.
+
+## Any guidance on submitting changes?
+
+While we do appreciate code contributions, triaging and integrating contributed
+code changes can be very time consuming. Please consider the following tips when
+working on your pull requests:
+
+- Functionality is appropriate for the repository. Consider creating a GitHub
+  issue to discuss your suggested changes.
+- The scope of the pull request is not too large. Please consider separate pull
+  requests for each feature as big pull requests are very time consuming to
+  understand.
+
+We will provide feedback on your pull requests as soon as possible. Following
+the tips above will help ensure your changes are reviewed.
+
+## Testing contribution pull requests
+
+OHIF uses [netlify](netlify.com) so that pull requests are autogenerated and
+available for testing.
+
+For example, [this url][example-url] allows you to test [pull request 237, the
+request that created this FAQ entry,][pr-237] using data pulled from Amazon S3.
+
+Replacing the number 237 in the link below with your pull request number should
+let you test it as well and you can use this link for discussions on github
+without requiring reviewers to download and build your branch.
+
+```bash
+https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
+```
+
+If you have made a documentation change, a link like this will let you preview
+the gitbook generated by the pull request:
+
+```bash
+https://deploy-preview-237--ohif.netlify.com/contributing.html
+```
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[example-url]: https://deploy-preview-237--ohif.netlify.com/viewer/?url=https://s3.eu-central-1.amazonaws.com/ohif-viewer/sampleDICOM.json
+[pr-237]: https://github.com/OHIF/Viewers/pull/237
+[monorepo]: https://github.com/OHIF/Viewers/issues/768
+<!-- prettier-ignore-end -->

docs/latest/contributing/testing.md

@@ -0,0 +1,145 @@
+# Contributing: Tests
+
+> Testing is an opinionated topic. Here is a rough overview of our testing
+> philosiphy. See something you want to discuss or think should be changed? Open
+> a PR and let's discuss.
+
+You're an engineer. You know how to write code, and writing tests isn't all that
+different. But do you know why we write tests? Do you know when to write one, or
+what kind of test to write? How do you know if a test is a _"good"_ test? This
+document's goal is to give you the tools you need to make those determinations.
+
+Okay. So why do we write tests? To increase our... **CONFIDENCE**
+
+- If I do a large refactor, does everything still work?
+- If I changed some critical piece of code, is it safe to push to production?
+
+Gaining the confidence we need to answer these questions after every change is
+costly. Good tests allow us to answer them without manual regression testing.
+What and how we choose to test to increase that confidence is nuanced.
+
+## Kinds of Tests
+
+Test's buy us confidence, but not all tests are created equal. Each kind of test
+has a different cost to write and maintain. An expensive test is worth it if it
+gives us confidence that a payment is processed, but it may not be the best
+choice for asserting an element's border color.
+
+| Test Type   | Example                                                                  | Speed            | Cost                                                                     |
+| ----------- | ------------------------------------------------------------------------ | ---------------- | ------------------------------------------------------------------------ |
+| Static      | `addNums(1, '2')` called with `string`, expected `int`.                  | :rocket: Instant | :money_with_wings:                                                       |
+| Unit        | `addNums(1, 2)` returns expected result `3`                              | :airplane: Fast  | :money_with_wings::money_with_wings:                                     |
+| Integration | Clicking "Sign In", navigates to the dashboard (mocked network requests) | :running: Okay   | :money_with_wings::money_with_wings::money_with_wings:                   |
+| End-to-end  | Clicking "Sign In", navigates to the dashboard (no mocks)                | :turtle: Slow    | :money_with_wings::money_with_wings::money_with_wings::money_with_wings: |
+
+- :rocket: Speed: How quickly tests run
+- :money_with_wings: Cost: Time to write, and to debug when broken (more points
+  of failure)
+
+### Static Code Analysis
+
+Modern tooling gives us this "for free". It can catch invalid regular
+expressions, unused variables, and guarantee we're calling methods/functions
+with the expected paramater types.
+
+Example Tooling:
+
+- [ESLint][eslint-rules]
+- [TypeScript][typescript-docs] or [Flow][flow-org]
+
+### Unit Tests
+
+The building blocks of our libraries and applications. For these, you'll often
+be testing a single function or method. Conceptually, this equates to:
+
+_Pure Function Test:_
+
+- If I call `sum(2, 2)`, I expect the output to be `4`
+
+_Side Effect Test:_
+
+- If I call `resetViewport(viewport)`, I expect `cornerstone.reset` to be called
+  with `viewport`
+
+#### When to use
+
+Anything that is exposed as public API should have unit tests.
+
+#### When to avoid
+
+You're actually testing implementation details. You're testing implementation
+details if:
+
+- Your test does something that the consumer of your code would never do.
+  - IE. Using a private function
+- A refactor can break your tests
+
+### Integration Tests
+
+We write integration tests to gain confidence that several units work together.
+Generally, we want to mock as little as possible for these tests. In practice,
+this means only mocking network requests.
+
+#### When to use
+
+...
+
+### End-to-End Tests
+
+These are the most expensive tests to write and maintain. Largely because, when
+they fail, they have the largest number of potential points of failure. So why
+do we write them? Because they also buy us the most confidence.
+
+#### When to use
+
+Mission critical features and functionality, or to cover a large breadth of
+functionality until unit tests catch up. Unsure if we should have a test for
+feature `X` or scenario `Y`? Open an issue and let's discuss.
+
+## Summary
+
+- Does your test increase confidence?
+- Does the test type chosen balance the cost-to-confidence ratio?
+
+## Further Reading
+
+### General
+
+- [Assert(js) Conf 2018 Talks][assert-js-talks]
+  - [Write tests. Not too many. Mostly integration.][kent-talk] - Kent C. Dodds
+  - [I see your point, but…][gleb-talk] - Gleb Bahmutov
+- [Static vs Unit vs Integration vs E2E Testing][kent-blog] - Kent C. Dodds
+  (Blog)
+
+### End-to-end Testing w/ Cypress
+
+- [Getting Started](https://docs.cypress.io/guides/overview/why-cypress.html)
+  - Be sure to check out `Getting Started` and `Core Concepts`
+- [Best Practices](https://docs.cypress.io/guides/references/best-practices.html)
+- [Example Recipes](https://docs.cypress.io/examples/examples/recipes.html)
+
+## Testing Dorito
+
+[![testing dorito][testing-dorito-img]][testing-dorito]
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[eslint-rules]: https://eslint.org/docs/rules/
+[typescript-docs]: https://www.typescriptlang.org/docs/home.html
+[flow-org]: https://flow.org/
+<!-- Talks -->
+[assert-js-talks]: https://www.youtube.com/playlist?list=PLZ66c9_z3umNSrKSb5cmpxdXZcIPNvKGw
+[kent-talk]: https://www.youtube.com/watch?list=PLV5CVI1eNcJgNqzNwcs4UKrlJdhfDjshf
+[gleb-talk]: https://www.youtube.com/watch?v=5FnalKRjpZk
+[kent-blog]: https://kentcdodds.com/blog/unit-vs-integration-vs-e2e-tests
+<!-- Images -->
+[testing-trophy]: https://twitter.com/kentcdodds/status/960723172591992832?ref_src=twsrc%5Etfw%7Ctwcamp%5Etweetembed%7Ctwterm%5E960723172591992832&ref_url=https%3A%2F%2Fkentcdodds.com%2Fblog%2Fwrite-tests
+[aaron-square]: https://twitter.com/Carofine247/status/966727489274961920
+[gleb-pyramid]: https://twitter.com/Carofine247/status/966764532046684160/photo/3
+[testing-pyramid]: https://dojo.ministryoftesting.com/dojo/lessons/the-mobile-test-pyramid
+[testing-dorito]: https://twitter.com/denvercoder/status/960752578198843392
+[testing-dorito-img]: https://pbs.twimg.com/media/DVVHXycUMAAcN-F?format=jpg&name=4096x4096
+<!-- prettier-ignore-end -->

docs/latest/deployment/index.md

@@ -1,11 +1,11 @@
 # Deployment
 
 The OHIF Viewer can be embedded in other web applications via it's [packaged
-script source][ohif-viewer-npm], or served up as a stand-alone PWA ([progressive
-web application][pwa-url]) by building and hosting a collection of static
-assets. In either case, you will need to configure your instance of the Viewer
-so that it can connect to your data source (the database or PACS that provides
-the data your Viewer will display).
+script source][viewer-npm], or served up as a stand-alone PWA ([progressive web
+application][pwa-url]) by building and hosting a collection of static assets. In
+either case, you will need to configure your instance of the Viewer so that it
+can connect to your data source (the database or PACS that provides the data
+your Viewer will display).
 
 ## Overview
 
@@ -196,8 +196,7 @@ Please feel free to suggest or contribute your own recipes.
   -->
 
 <!-- prettier-ignore-start -->
-
-[ohif-viewer-npm]: https://www.npmjs.com/package/ohif-viewer
+[viewer-npm]: https://www.npmjs.com/package/@ohif/viewer
 [pwa-url]: https://developers.google.com/web/progressive-web-apps/
 [static-assets-url]: https://www.maxcdn.com/one/visual-glossary/static-content/
 [app-store]: https://medium.freecodecamp.org/i-built-a-pwa-and-published-it-in-3-app-stores-heres-what-i-learned-7cb3f56daf9b
@@ -206,5 +205,5 @@ Please feel free to suggest or contribute your own recipes.
 [host-static-assets]: https://www.netlify.com/blog/2016/05/18/9-reasons-your-site-should-be-static/
 [cors]: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
 [code-flows]: https://medium.com/@darutk/diagrams-of-all-the-openid-connect-flows-6968e3990660
-[code-sandbox]: https://codesandbox.io/s/ohif-viewer-script-tag-usage-b3st9
+[code-sandbox]: https://codesandbox.io/s/viewer-script-tag-tprch
 <!-- prettier-ignore-end -->

docs/latest/deployment/recipes/build-for-production.md

@@ -19,9 +19,6 @@ _With Git:_
 ```bash
 # Clone the remote repository to your local machine
 git clone https://github.com/OHIF/Viewers.git
-
-# Make sure the local code reflects the `react` version of the OHIF Viewer
-git checkout react
 ```
 
 More on: _[`git clone`](https://git-scm.com/docs/git-clone),
@@ -29,7 +26,7 @@ More on: _[`git clone`](https://git-scm.com/docs/git-clone),
 
 _From .zip:_
 
-[OHIF/Viewers: react.zip](https://github.com/OHIF/Viewers/archive/react.zip)
+[OHIF/Viewers: react.zip](https://github.com/OHIF/Viewers/archive/master.zip)
 
 ### Restore Dependencies & Build
 
@@ -37,20 +34,24 @@ Open your terminal, and navigate to the directory containing the source files.
 Next run these commands:
 
 ```js
+// If you haven't already, enable yarn workspaces
+yarn config set workspaces-experimental true
+
 // Restore dependencies
 yarn install
 
 // Build source code for production
-yarn run build:web
+yarn run build
 ```
 
-If everything worked as expected, you should have a new `build/` directory in
-the project's folder. It should roughly resemble the following:
+If everything worked as expected, you should have a new `dist/` directory in the
+project's folder. It should roughly resemble the following:
 
 ```bash
-build
-├── config/
-├── static/
+<root>platform/viewer/dist/
+├── app-config.js
+├── app.bundle.js
+├── app.css
 ├── index.html
 ├── manifest.json
 ├── service-worker.js
@@ -64,61 +65,15 @@ how to configure the project for your own imaging archive below.
 
 ### Configuration
 
-> This step assumes you have an imaging archive. If you need assistance setting
-> one up, check out the [`Data Source` Guide](./../../essentials/data-source.md)
-> or a deployment recipe that contains an open source Image Archive
+The configuration for our viewer is in the `<root>platform/viewer/public/config`
+directory. Our build process knows which configuration file to use based on the
+`APP_CONFIG` environment variable. By default, its value is
+[`config/default.js`][default-config]. The majority of the viewer's features,
+and registered extension's features, are configured using this file.
 
-#### How it Works
-
-The configuration for our project is in the `/public/config` directory. Our
-build process knows which configuration file to use based on the
-`REACT_APP_CONFIG` environment variable. By default, its value is
-[`default.js`](https://github.com/OHIF/Viewers/blob/react/public/config/default.js).
-When we build, the `%REACT_APP_CONFIG%` value in
-our[`/public/index.html`](https://github.com/OHIF/Viewers/blob/react/public/index.html#L12-L15)
-file is substituted for the correct configuration file's name. This sets
-the`window.config` equal to our configuration file's value.
-
-#### How do I configure my project?
-
-The simplest way is to update the existing default config:
-
-_/public/config/default.js_
-
-```js
-window.config = {
-  routerBasename: '/',
-  relativeWebWorkerScriptsPath: '',
-  servers: {
-    dicomWeb: [
-      {
-        name: 'DCM4CHEE',
-        wadoUriRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/wado',
-        qidoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
-        wadoRoot: 'https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/rs',
-        qidoSupportsIncludeField: true,
-        imageRendering: 'wadors',
-        thumbnailRendering: 'wadors',
-        requestOptions: {
-          requestFromBrowser: true,
-        },
-      },
-    ],
-  },
-}
-```
-
-You can also create a new config file and specify its path relative to the build
-output's root by setting the `REACT_APP_CONFIG` environment variable. You can
-set the value of this environment variable a few different ways:
-
-- [Add a temporary environment variable in your shell](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-temporary-environment-variables-in-your-shell)
-- [Add environment specific variables in `.env` file(s)](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-development-environment-variables-in-env)
-- Using the `cross-env` package in an npm script:
-  - `"build": "cross-env REACT_APP_CONFIG=config/my-config.js react-scripts build"`
-
-After updating the configuration, `yarn run build:web` to generate updated build
-output.
+The easiest way to apply your own configuration is to modify the `default.js`
+file. For more advanced cofiguration options, check out our
+[configuration essentials guide](/essentials/configuration.md).
 
 ## Next Steps
 
@@ -142,7 +97,7 @@ _Advanced_
 ### Testing Build Output Locally
 
 A quick way to test your build output locally is to spin up a small webserver.
-You can do this by running the following commands in the `build/` output
+You can do this by running the following commands in the `dist/` output
 directory:
 
 ```js
@@ -163,8 +118,7 @@ web application. For a starting point, check out this repository's own use of:
 
 - [CircleCI][circleci]: [config.yaml][circleci-config]
 - [Netlify][netlify]: [netlify.toml][netlify.toml] |
-  [generateStaticSite.sh][generatestaticsite.sh]
-- [Semantic-Release][semantic-release]: [.releaserc][releaserc]
+  [build-deploy-preview.sh][build-deploy-preview.sh]
 
 ## Troubleshooting
 
@@ -174,10 +128,8 @@ web application. For a starting point, check out this repository's own use of:
 
 <!-- prettier-ignore-start -->
 [circleci]: https://circleci.com/gh/OHIF/Viewers
-[circleci-config]: https://github.com/OHIF/Viewers/blob/react/.circleci/config.yml
+[circleci-config]: https://github.com/OHIF/Viewers/blob/master/.circleci/config.yml
 [netlify]: https://app.netlify.com/sites/ohif/deploys
-[netlify.toml]: https://github.com/OHIF/Viewers/blob/react/netlify.toml
-[generateStaticSite.sh]: https://github.com/OHIF/Viewers/blob/react/generateStaticSite.sh
-[semantic-release]: https://semantic-release.gitbook.io/semantic-release/
-[releaserc]: https://github.com/OHIF/Viewers/blob/react/.releaserc
+[netlify.toml]: https://github.com/OHIF/Viewers/blob/master/netlify.toml
+[build-deploy-preview.sh]: https://github.com/OHIF/Viewers/blob/master/.netlify/build-deploy-preview.sh
 <!-- prettier-ignore-end -->

docs/latest/deployment/recipes/embedded-viewer.md

@@ -12,35 +12,18 @@ include tags. Here's how it works:
 
 <ul>
   <li>
-    <a href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
-      <code>bootstrap@3.3.7</code>
+    <a href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700&display=swap">
+      <code>Google Font: Roboto</code>
     </a>
   </li>
   <li>
-    <a href="https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700|Sanchez&display=swap">
-      <code>Google Fonts, Sanchez & Roboto</code>
-    </a>
-  </li>
-  <li>
-    <a href="https://unpkg.com/react@16/umd/react.production.min.js">
-      <code>react@16.8.6</code>
-    </a>
-  </li>
-  <li>
-    <a href="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js">
-      <code>react-dom@16.8.6</code>
-    </a>
-  </li>
-  <li>
-    <a href="https://unpkg.com/ohif-viewer/dist/index.umd.js">
-      <code>ohif-viewer@latest</code>
+    <a href="https://unpkg.com/@ohif/viewer">
+      <code>@ohif/viewer@latest</code>
     </a>
   </li>
 </ul>
 
 <ol start="2">
-  <li>The <a href="">WADO Image Loader Codecs and Web Worker source code</a>
-  should be accessible from your server's root</li>
   <li>Create a JS Object to hold the OHIF Viewer's configuration. Here are some
    example values that would allow the viewer to hit our public PACS:</li>
 </ol>
@@ -50,8 +33,6 @@ include tags. Here's how it works:
 window.config = {
   // default: '/'
   routerBasename: '/',
-  // default: ''
-  relativeWebWorkerScriptsPath: '',
   servers: {
     dicomWeb: [
       {
@@ -62,28 +43,64 @@ window.config = {
         qidoSupportsIncludeField: true,
         imageRendering: 'wadors',
         thumbnailRendering: 'wadors',
-        requestOptions: {
-          requestFromBrowser: true,
-        },
       },
     ],
   },
 };
 ```
 
-<ol start="5"><li>
+<ol start="3"><li>
   Render the viewer in the web page's target <code>div</code>
 </li></ol>
 
 ```js
-// Made available by the `ohif-viewer` script included in step 1
-var Viewer = window.OHIFStandaloneViewer.App;
-var app = React.createElement(Viewer, window.config, null);
-
-ReactDOM.render(app, document.getElementById('ohif-viewer-target'));
+// Made available by the `@ohif/viewer` script included in step 1
+var containerId = 'id-of-div-to-render-component-to';
+var componentRenderedOrUpdatedCallback = function() {
+  console.log('OHIF Viewer rendered/updated');
+};
+window.OHIFViewer.installViewer(
+  window.config,
+  containerId,
+  componentRenderedOrUpdatedCallback
+);
 ```
 
-#### Tips & Tricks
+You can see a live example of this recipe in [this CodeSandbox][code-sandbox].
+
+## Add Extensions
+
+The UMD build of the OHIF Viewer is a "light weight" build that only contains
+the core extensions required for basic 2D image viewing. It's possible to add
+other extensions at runtime.
+
+This only requires us to include a single script tag, and add it using the
+`extensions` key to our config. In this practical example, we register our
+popular whole slide microscopy extension:
+
+```html
+<script
+  src="https://unpkg.com/@ohif/extension-dicom-microscopy@0.50.5/dist/index.umd.js"
+  crossorigin
+></script>
+
+<!-- --->
+<script>
+  window.config = {
+    // ...
+    extensions: [OHIFExtDicomMicroscopy],
+  };
+</script>
+```
+
+You can see an example of a slide microscopy study in the viewer [with the
+extension enabled here][whole-slide-ext-demo] ([source code][ext-code-sandbox])
+and [without it here][whole-slide-base-demo] ([source code][code-sandbox]).
+
+You can read more about extensions and how to create your own in our
+[extensions guide](/advanced/extensions.md).
+
+#### FAQ
 
 > I'm having trouble getting this to work. Where can I go for help?
 
@@ -91,16 +108,34 @@ First, check out this fully functional [CodeSandbox][code-sandbox] example. If
 you're still having trouble, feel free to search or GitHub issues. Can't find
 anything related your problem? Create a new one.
 
-> When I include bootstrap, other styles on my page no longer work correctly.
-> What can I do?
+> My application's styles are impacting the OHIF Viewer's look and feel. What
+> can I do?
 
-When we include `bootsrap` (and the other dependencies), they are added
-globally. This has the potential of causing conflicts with other scripts and
-styles on the page. To prevent this, `embed` the viewer in a new/empty web page.
-Have that working? Good. Now `embed` that new page using an
+When you include stylesheets and scripts, they are added globally. This has the
+potential of causing conflicts with other scripts and styles on the page. To
+prevent this, `embed` the viewer in a new/empty web page. Have that working?
+Good. Now `embed` that new page using an
 [`<iframe>` element](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/iframe).
 
 This should produce the expected result while also protecting your page from any
 globally defined styles/scripts.
 
-[code-sandbox]: https://codesandbox.io/s/ohif-viewer-script-tag-usage-b3st9
+> We're trying to embed the OHIF Viewer into an existing React App, but seeing
+> react-dom and react conflicts. What can we do?
+
+`installViewer` is a convenience method that pulls in some dependencies that may
+not be compatible with existing `react` apps. `@ohif/viewer` also exports `App`
+which is a react component that takes the `configuration` outlined above as
+props. You can use it as a reusable component, and to avoid `react` version
+conflict issues.
+
+<!--
+  LINKS
+  -->
+
+<!-- prettier-ignore-start -->
+[code-sandbox]: https://codesandbox.io/s/viewer-script-tag-tprch
+[whole-slide-base-demo]: https://tprch.csb.app/viewer/1.2.392.200140.2.1.1.1.2.799008771.2020.1519719354.757
+[ext-code-sandbox]: https://codesandbox.io/s/viewer-script-tag-microscopy-extension-44unk
+[whole-slide-ext-demo]: https://44unk.csb.app/viewer/1.2.392.200140.2.1.1.1.2.799008771.2448.1519719572.518
+<!-- prettier-ignore-end -->

docs/latest/deployment/recipes/nginx--image-archive.md

@@ -11,7 +11,7 @@ control.
 Do not use this recipe to host sensitive medical data on the open web. Depending
 on your company's policies, this may be an appropriate setup on an internal
 network when protected with a server's basic authentication. For a more robust
-setup, check out our [user account control recpie](./user-account-control.md)
+setup, check out our [user account control recipe](./user-account-control.md)
 that builds on the lessons learned here.
 
 ## Overview
@@ -51,7 +51,7 @@ We can solve this one of two ways:
 
 This solution uses the first approach, but you can see an example of the second
 in the `docker-compose` bundled with this project for local development:
-[HERE](#)
+[HERE](https://github.com/OHIF/Viewers/blob/master/platform/viewer/.recipes/Nginx-Orthanc/docker-compose.yml)
 
 You can read more about CORS in this Medium article: [Understanding
 CORS][understanding-cors]
@@ -121,13 +121,9 @@ likely want to update:
 
 #### OHIF Viewer
 
-The OHIF Viewer's configuration is imported from a static `.js` file and made
-available globally at `window.config`. The configuration we use is set to a
-specific file when we build the viewer, and determined by the env variable:
-`REACT_APP_CONFIG`. You can see where we set its value in the `dockerfile` for
-this solution:
+The OHIF Viewer's configuration is imported from a static `.js` file. The configuration we use is set to a specific file when we build the viewer, and determined by the env variable: `APP_CONFIG`. You can see where we set its value in the `dockerfile` for this solution:
 
-`ENV REACT_APP_CONFIG=config/docker_openresty-orthanc.js`
+`ENV APP_CONFIG=config/docker_openresty-orthanc.js`
 
 You can find the configuration we're using here:
 `/public/config/docker_openresty-orthanc.js`

docs/latest/deployment/recipes/static-assets.md

@@ -127,7 +127,7 @@ through the trouble of using AWS/GCP/Azure, it's more likely you're doing so to
 avoid using a proxy or to simplify authentication.
 
 If that is the case, check out some of our more advanced `docker` deployments
-that target these providers from the left-hand sidebar.
+that target these providers from the left-hand sidepanel.
 
 These guides can be a bit longer and a update more frequently. To provide
 accurate documentation, we will link to each provider's own recommended steps:

docs/latest/deployment/recipes/user-account-control.md

@@ -122,13 +122,9 @@ likely want to update:
 
 #### OHIF Viewer
 
-The OHIF Viewer's configuration is imported from a static `.js` file and made
-available globally at `window.config`. The configuration we use is set to a
-specific file when we build the viewer, and determined by the env variable:
-`REACT_APP_CONFIG`. You can see where we set its value in the `dockerfile` for
-this solution:
+The OHIF Viewer's configuration is imported from a static `.js` file. The configuration we use is set to a specific file when we build the viewer, and determined by the env variable: `APP_CONFIG`. You can see where we set its value in the `dockerfile` for this solution:
 
-`ENV REACT_APP_CONFIG=config/docker_openresty-orthanc-keycloak.js`
+`ENV APP_CONFIG=config/docker_openresty-orthanc-keycloak.js`
 
 You can find the configuration we're using here:
 `/public/config/docker_openresty-orthanc-keycloak.js`
@@ -281,9 +277,9 @@ community members put together:
 [orthanc-docs]: http://book.orthanc-server.com/users/configuration.html#configuration
 [lua-resty-openidc-docs]: https://github.com/zmartzone/lua-resty-openidc
 <!-- SRC -->
-[config]: #
-[dockerfile]: #
-[config-nginx]: #
-[config-orthanc]: #
-[config-keycloak]: #
+[config]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/src/config.js
+[dockerfile]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
+[config-nginx]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
+[config-orthanc]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
+[config-keycloak]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/.recipes
 <!-- prettier-ignore-end -->

docs/latest/essentials/configuration.md

@@ -4,27 +4,51 @@
 > one up, check out the [`Data Source` Guide](./data-source.md) or a deployment
 > recipe that contains an open source Image Archive
 
-## How it Works
+## Overview
 
-The configuration for our project is in the `/public/config` directory. Our
-build process knows which configuration file to use based on the
-`REACT_APP_CONFIG` environment variable. By default, its value is
-[`default.js`](https://github.com/OHIF/Viewers/blob/react/public/config/default.js).
-When we build, the `%REACT_APP_CONFIG%` value in
-our[`/public/index.html`](https://github.com/OHIF/Viewers/blob/react/public/index.html#L12-L15)
-file is substituted for the correct configuration file's name. This sets the
-`window.config` equal to our configuration file's value.
+### Configuration Files
+
+The configuration for our viewer is in the `<root>platform/viewer/public/config`
+directory. Our build process knows which configuration file to use based on the
+`APP_CONFIG` environment variable. By default, its value is
+[`config/default.js`][default-config]. The majority of the viewer's features,
+and registered extension's features, are configured using this file.
+
+**Embedded Use Note:**
+
+Alternatively, when using the `commonjs` bundle for embedded use cases, these
+same values are what you'll pass to `installViewer` method:
+
+`OHIFStandaloneViewer.installViewer(window.config)`
+
+### Environment Variables
+
+We use environment variables at build and dev time to change the Viewer's
+behavior. We can update the `HTML_TEMPLATE` to easily change which extensions
+are registered, and specify a different `APP_CONFIG` to connect to an
+alternative data source (or even specify different default hotkeys).
+
+| Environment Variable | Description                                                                                        | Default             |
+| -------------------- | -------------------------------------------------------------------------------------------------- | ------------------- |
+| `HTML_TEMPLATE`      | Which [HTML template][html-templates] to use as our web app's entry point. Specific to PWA builds. | `index.html`        |
+| `PUBLIC_URL`         | The route relative to the host that the app will be served from. Specific to PWA builds.           | `/`                 |
+| `APP_CONFIG`         | Which [configuration file][config-file] to copy to output as `app-config.js`                       | `config/default.js` |
+| `PROXY_TARGET`       | When developing, proxy requests that match this pattern to `PROXY_DOMAIN`                          | `undefined`         |
+| `PROXY_DOMAIN`       | When developing, proxy requests from `PROXY_TARGET` to `PROXY_DOMAIN`                              | `undefined`         |
+
+### Registering Extensions
+
+> :warn: Instructions coming soon
 
 ## How do I configure my project?
 
 The simplest way is to update the existing default config:
 
-_/public/config/default.js_
+_/platform/viewer/public/config/default.js_
 
 ```js
 window.config = {
   routerBasename: '/',
-  relativeWebWorkerScriptsPath: '',
   servers: {
     dicomWeb: [
       {
@@ -35,23 +59,34 @@ window.config = {
         qidoSupportsIncludeField: true,
         imageRendering: 'wadors',
         thumbnailRendering: 'wadors',
-        requestOptions: {
-          requestFromBrowser: true,
-        },
       },
     ],
   },
-}
+};
 ```
 
 You can also create a new config file and specify its path relative to the build
-output's root by setting the `REACT_APP_CONFIG` environment variable. You can
-set the value of this environment variable a few different ways:
+output's root by setting the `APP_CONFIG` environment variable. You can set the
+value of this environment variable a few different ways:
 
-- [Add a temporary environment variable in your shell](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-temporary-environment-variables-in-your-shell)
-- [Add environment specific variables in `.env` file(s)](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-development-environment-variables-in-env)
+- ~[Add a temporary environment variable in your shell](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-temporary-environment-variables-in-your-shell)~
+  - Previous `react-scripts` functionality that we need to duplicate with
+    `dotenv-webpack`
+- ~[Add environment specific variables in `.env` file(s)](https://facebook.github.io/create-react-app/docs/adding-custom-environment-variables#adding-development-environment-variables-in-env)~
+  - Previous `react-scripts` functionality that we need to duplicate with
+    `dotenv-webpack`
 - Using the `cross-env` package in an npm script:
-  - `"build": "cross-env REACT_APP_CONFIG=config/my-config.js react-scripts build"`
+  - `"build": "cross-env APP_CONFIG=config/my-config.js react-scripts build"`
 
-After updating the configuration, `yarn run build:web` to generate updated build
+After updating the configuration, `yarn run build` to generate updated build
 output.
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[default-config]: https://github.com/OHIF/Viewers/blob/master/platform/viewer/public/config/default.js
+[html-templates]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/public/html-templates
+[config-files]: https://github.com/OHIF/Viewers/tree/master/platform/viewer/public/config
+<!-- prettier-ignore-end -->

docs/latest/essentials/data-source.md

@@ -29,11 +29,17 @@ For our purposes, we will be using `Orthanc`, but you can see a list of
 
 - Docker
   - [Docker for Mac](https://docs.docker.com/docker-for-mac/)
-  - [Docker for Windows](https://docs.docker.com/docker-for-windows/)
+  - [Docker for Windows (recommended)](https://docs.docker.com/docker-for-windows/)
+  - [Docker Toolbox for Windows](https://docs.docker.com/toolbox/toolbox_install_windows/)
 
 _Not sure if you have `docker` installed already? Try running `docker --version`
 in command prompt or terminal_
 
+> If you are using `Docker Toolbox` you need to change the _PROXY_DOMAIN_
+> parameter in _platform/viewer/package.json_ to http://192.168.99.100:8042 or
+> the ip docker-machine ip throws. This is the value [`WebPack`][webpack-proxy]
+> uses to proxy requests
+
 ### Running Orthanc
 
 _Start Orthanc:_
@@ -45,8 +51,9 @@ yarn run orthanc:up
 
 _Upload your first Study:_
 
-1. Navigate to [Orthanc's web interface](http://localhost:8899) at
-   `http://localhost:8899` in a web browser.
+1. Navigate to
+   [Orthanc's web interface](http://localhost:8042/app/explorer.html) at
+   `http://localhost:8042/app/explorer.html` in a web browser.
 2. In the top right corner, click "Upload"
 3. Click "Select files to upload..." and select one or more DICOM files
 4. Click "Start the upload"
@@ -54,17 +61,20 @@ _Upload your first Study:_
 #### Orthanc: Learn More
 
 You can see the `docker-compose.yml` file this command runs at
-[`<project-root>/docker/Nginx-Docker/`](#), and more on Orthanc for Docker in
-[Orthanc's documentation][orthanc-docker].
+[`<project-root>/.docker/Nginx-Orthanc/`][orthanc-docker-compose], and more on
+Orthanc for Docker in [Orthanc's documentation][orthanc-docker].
 
 ### Connecting to Orthanc
 
 Now that we have a local Orthanc instance up and running, we need to configure
 our web application to connect to it. Open a new terminal window, navigate to
-this project's root directory, and run:
+this repository's root directory, and run:
 
 ```bash
-# If you haven't already, restore dependencies
+# If you haven't already, enable yarn workspaces
+yarn config set workspaces-experimental true
+
+# Restore dependencies
 yarn install
 
 # Run our dev command, but with the local orthanc config
@@ -81,24 +91,28 @@ is running the `dev:orthanc` script in our project's `package.json`. That script
 is:
 
 ```js
-cross-env PORT=5000 REACT_APP_CONFIG=config/docker_nginx-orthanc.js react-scripts start
+cross-env NODE_ENV=development PROXY_TARGET=/dicom-web PROXY_DOMAIN=http://localhost:8042 APP_CONFIG=config/docker_nginx-orthanc.js webpack-dev-server --config .webpack/webpack.pwa.js -w
 ```
 
-- `cross-env` sets two environment variables
-  - PORT: 5000
-  - REACT_APP_CONFIG: `config/docker_nginx-orthanc.js`
-- `react-scripts` runs it's `start` script. This is [the de-facto
-  way][cra-start] to run a "Create React App" in development mode.
+- `cross-env` sets three environment variables
+  - PROXY_TARGET: `/dicom-web`
+  - PROXY_DOMAIN: `http://localhost:8042`
+  - APP_CONFIG: `config/docker_nginx-orthanc.js`
+- `webpack-dev-server` runs using the `.webpack/webpack.pwa.js` configuration
+  file. It will watch for changes and update as we develop.
 
-The `REACT_APP_CONFIG` value tells our app which file to load on to
-`window.config`. By default, our app uses the file at
-`<project-root>/public/config/default.js`. Here is what that configuration looks
-like:
+`PROXY_TARGET` and `PROXY_DOMAIN` tell our development server to proxy requests
+to `Orthanc`. This allows us to bypass CORS issues that normally occur when
+requesting resources that live at a different domain.
+
+The `APP_CONFIG` value tells our app which file to load on to `window.config`.
+By default, our app uses the file at
+`<project-root>/platform/viewer/public/config/default.js`. Here is what that
+configuration looks like:
 
 ```js
 window.config = {
   routerBasename: '/',
-  relativeWebWorkerScriptsPath: '',
   servers: {
     dicomWeb: [
       {
@@ -112,7 +126,7 @@ window.config = {
       },
     ],
   },
-}
+};
 ```
 
 To learn more about how you can configure the OHIF Viewer, check out our
@@ -141,7 +155,8 @@ _Feel free to make a Pull Request if you want to add to this list._
 [dcmjs-org]: https://server.dcmjs.org/dcm4chee-arc/aets/DCM4CHEE/wado
 [dicom-web]: https://en.wikipedia.org/wiki/DICOMweb
 [storescu]: http://support.dcmtk.org/docs/storescu.html
-[cra-start]: https://github.com/facebook/create-react-app#npm-start-or-yarn-start
+[webpack-proxy]: https://webpack.js.org/configuration/dev-server/#devserverproxy
+[orthanc-docker-compose]: https://github.com/OHIF/Viewers/tree/master/.docker/Nginx-Orthanc
 <!-- Archives -->
 [dcm4chee]: https://github.com/dcm4che/dcm4chee-arc-light
 [dcm4chee-docker]: https://github.com/dcm4che/dcm4chee-arc-light/wiki/Running-on-Docker

docs/latest/essentials/getting-started.md

@@ -24,8 +24,7 @@ graphic that illustrates this setup][triangular-workflow].
 Alternatively, if you intend to use the OHIF Viewer as a starting point, and you
 aren't as concerned with syncing updates, then follow these steps:
 
-1. Navigate to the [OHIF/Viewers/tree/react][ohif-viewers-react-repo] repository
-   and branch
+1. Navigate to the [OHIF/Viewers][ohif-viewers] repository
 2. Click `Clone or download`, and then `Download ZIP`
 3. Use the contents of the `.zip` file as a starting point for your viewer
 
@@ -39,6 +38,8 @@ aren't as concerned with syncing updates, then follow these steps:
 
 - [Node.js & NPM](https://nodejs.org/en/)
 - [Yarn](https://yarnpkg.com/en/)
+- Yarn workspaces should be enabled:
+  - `yarn config set workspaces-experimental true`
 
 ### Kick the tires
 
@@ -50,21 +51,18 @@ following commands:
 yarn install
 
 # Start local development server
-yarn start
+yarn run dev
 ```
 
 You should see the following output:
 
 ```bash
-Compiled successfully!
+@ohif/viewer: i ｢wds｣: Project is running at http://localhost:3000/
+@ohif/viewer: i ｢wds｣: webpack output is served from /
+@ohif/viewer: i ｢wds｣: Content not from webpack is served from D:\code\ohif\Viewers\platform\viewer
+@ohif/viewer: i ｢wds｣: 404s will fallback to /index.html
 
-You can now view ohif-viewer in the browser.
-
-  Local:            http://localhost:5000/
-  On Your Network:  http://10.74.20.83:5000/
-
-Note that the development build is not optimized.
-To create a production build, use yarn build.
+# And a list of all generated files
 ```
 
 ### 🎉 Celebrate 🎉
@@ -81,15 +79,17 @@ To create a production build, use yarn build.
 
 ```bash
 # Build static assets to host a PWA
-yarn run build:web
+yarn run build
 
-# Build packaged output
+# Build packaged output (script-tag use)
 yarn run build:package
 ```
 
 ## Next Steps
 
-...
+Take a look at the sidebar. Depending on how you intend to use The OHIF Viewer,
+different topics may be more pertinent than others. At a minimum, reading "The
+Essentials" and the deployment recipes should be a good starting point.
 
 ## Troubleshooting
 
@@ -111,5 +111,5 @@ yarn run build:package
 [sync-changes]: https://help.github.com/en/articles/syncing-a-fork
 [triangular-workflow]: https://github.blog/2015-07-29-git-2-5-including-multiple-worktrees-and-triangular-workflows/#improved-support-for-triangular-workflows
 [ohif-viewers-repo]: https://github.com/OHIF/Viewers
-[ohif-viewers-react-repo]: https://github.com/OHIF/Viewers/tree/react
+[ohif-viewers]: https://github.com/OHIF/Viewers
 <!-- prettier-ignore-end -->

docs/latest/essentials/installation.md

@@ -5,38 +5,52 @@ processes:
 
 ```bash
 # Static Asset output: For deploying PWAs
-yarn run build:web
+yarn run build
 
 # Single `.js` script, for embedding viewer into existing apps
 yarn run build:package
 ```
 
-## create-react-app (PWA)
+## Progressive Web Application (PWA)
 
-> [create-react-app](https://github.com/facebook/create-react-app) provides
-> pre-configured build process for developing front-end applications with
-> [React](https://reactjs.org/).
+> [Progressive Web Apps][pwa] are a new breed of web applications that meet the
+> [following requirements][pwa-checklist]. Notably, targeting a PWA allows us
+> provide a reliable, fast, and engaging experience across different devices and
+> network conditions.
 
-The ohif-viewer package can be run as a create-react-app application. This is
-useful for development, debugging, or evolving the OHIF Viewer into your own
-custom imaging application.
+The OHIF Viewer is maintained as a [monorepo][monorepo]. We use WebPack to build
+the many small static assets that comprise our application. Also generated is an
+`index.html` that will serve as an entry point for loading configuration and the
+application, as well as a `service-worker` that can intelligently cache files so
+that subsequent requests are from the local file system instead of over the
+network.
 
 You can read more about this particular strategy in our
 [Build for Production Deployment Guide](./../deployment/recipes/build-for-production.md)
 
-## Rollup (Packaged Script)
+## Commonjs Bundle (Packaged Script)
 
-> [Rollup](https://rollupjs.org/guide/en) is a module bundler for JavaScript. It
-> uses the new standardized format for code modules included in the ES6 revision
-> of JavaScript.
+The [@ohif/viewer][viewer-npm] package is built with WebPack to provide a React
+component that can be dropped into a larger application. The `OHIFViewer`
+component is the entire viewer, configurable via React `props`. This is useful
+for including the OHIF Viewer in a larger web application, as the entire
+application can be provided via a `<script>` tag with no build process required.
 
-The [ohif-viewer](https://www.npmjs.com/package/ohif-viewer) package can be
-built with Rollup to provide a set of React components which can be dropped into
-a larger application. Specifically, the ohif-viewer package provides a React
-component named `OHIFViewer` which is the entire viewer, configurable via React
-`props`. This is useful for including the OHIF Viewer in a larger web
-application, as the entire application can be provided via a `<script>` tag with
-no build process required.
+The bundle is not as performant or as optimized as the PWA build. It includes
+fonts, styles, and the core extensions. If you find yourself facing performance
+issues, you may wish to tweak what's included in this bundle or switch to the
+PWA build.
 
 You can read more about this particular strategy in our
 [Embedded Viewer Deployment Guide](./../deployment/recipes/embedded-viewer.md)
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[pwa]: https://developers.google.com/web/progressive-web-apps/
+[pwa-checklist]: https://developers.google.com/web/progressive-web-apps/checklist
+[monorepo]: https://github.com/OHIF/Viewers/issues/768
+[viewer-npm]: https://www.npmjs.com/package/@ohif/viewer
+<!-- prettier-ignore-end -->

docs/latest/essentials/themeing.md

@@ -4,7 +4,7 @@ Themeing is currently accomplished with color variables that are defined within
 the [`:root`](https://css-tricks.com/almanac/selectors/r/root/) selector
 (allowing them to cascade across all elements). This repository's components,
 and the ones we consume from our
-[React Viewerbase component library](https://react.ohif.org/styling-and-theming)
+[`@ohif/ui` component library](https://react.ohif.org/styling-and-theming)
 utilize them. We are interested in pursuing more robust themeing options, and
 open to pull requests and discussion issues.
 
@@ -80,12 +80,12 @@ function RadicalImagingLogo() {
       href: 'http://radicalimaging.com',
     },
     React.createElement('h5', {}, 'RADICAL IMAGING')
-  )
+  );
 }
 
 props.whiteLabelling = {
   logoComponent: RadicalImagingLogo(),
-}
+};
 ```
 
 <!--

docs/latest/essentials/translating.md

@@ -4,6 +4,17 @@ OHIF supports internationalization using [i18next](https://www.i18next.com/)
 through the npm package [@ohif/i18n](https://www.npmjs.com/package/@ohif/i18n),
 where is the main instance of i18n containing several languages and tools.
 
+<div class='row'>
+  <div class='column'>
+    <p>Our translation management is powered by <a href="https://locize.com/" target="_blank" rel="noopener noreferrer">Locize</a> through their generous support of open source.</p>
+  </div>
+  <div class='column'>
+    <a href="https://locize.com/" target="_blank" rel="noopener noreferrer" style='padding: 20px'>
+      <img src="../assets/img/locizeSponsor.svg" alt="Locize Translation Management Logo">
+    </a>
+  </div>
+</div>
+
 ### Installing
 
 ```bash
@@ -86,13 +97,15 @@ requires at least React > 16.8 😉
 OHIF Viewer already sets a main
 [I18nextProvider](https://react.i18next.com/latest/i18nextprovider) connected to
 the shared i18n instance from `@ohif/i18n`, all extensions inside OHIF Viewer
-will share this same provider at the end, you don't need to set new providers at all.
+will share this same provider at the end, you don't need to set new providers at
+all.
 
 But, if you need to use it completely outside of OHIF viewer, you can set the
 I18nextProvider this way:
 
 ```js
-import i18n, { I18nextProvider } from '@ohif/i18n';
+import i18n from '@ohif/i18n';
+import { I18nextProvider } from 'react-i18next';
 import App from './App';
 
 <I18nextProvider i18n={i18n}>
@@ -101,7 +114,8 @@ import App from './App';
 ```
 
 After setting `I18nextProvider` in your React App, all translations from
-`@ohif/i18n` should be available following the basic [With React](#with-react) usage.
+`@ohif/i18n` should be available following the basic [With React](#with-react)
+usage.
 
 ---
 
@@ -112,9 +126,9 @@ When needed, you can also use available translations _without React_.
 E.g.
 
 ```js
-import { t } from '@ohif/i18n';
-console.log(t('my translated text'));
-console.log(t('$t(Common:Play) my translated text'));
+import { T } from '@ohif/i18n';
+console.log(T('my translated text'));
+console.log(T('$t(Common:Play) my translated text'));
 ```
 
 ---
@@ -131,46 +145,78 @@ becomes a new namespace automatically.
 - CineDialog: Translations for the toll tips inside the Cine Player Dialog
 - Common: all common jargons that can be reused like `t('$t(common:image)')`
 - Header: translations related to OHIF's Header Top Bar
-- MeasurementTable - Translations for the react-viewerbase Measurement Table
-- UserPreferencesModal - Translations for the react-viewerbase Preferences Modal
+- MeasurementTable - Translations for the `@ohif/ui` Measurement Table
+- UserPreferencesModal - Translations for the `@ohif/ui` Preferences Modal
 
 ### How to use another NameSpace inside the current NameSpace?
-i18next provides a parsing feature able to get translations strings from any NameSpace,
- like this following example getting data from `Common` NameSpace:
+
+i18next provides a parsing feature able to get translations strings from any
+NameSpace, like this following example getting data from `Common` NameSpace:
+
 ```
 $t(Common:Reset)
 ```
 
 ## - Extending Languages in @ohif/i18n
 
-Sometimes, even using the same language, some nouns or jargons can change according to 
-the country, states or even from Hospital to Hospital. 
+Sometimes, even using the same language, some nouns or jargons can change
+according to the country, states or even from Hospital to Hospital.
 
-In this cases, you don't need to set an entire language again, you can extend languages creating a new folder inside a pre existent language folder and @ohif/i18n will do the hard work.
+In this cases, you don't need to set an entire language again, you can extend
+languages creating a new folder inside a pre existent language folder and
+@ohif/i18n will do the hard work.
 
-This new folder must to be called with a double character name, like the `UK` in the following file tree:
+This new folder must to be called with a double character name, like the `UK` in
+the following file tree:
 
 ```bash
  |-- src
     |-- locales
+    index.js
         |-- en
             |-- Buttons.json
+            index.js
             | UK
                |-- Buttons.js
+               indes.js
             | US
                |-- Buttons.js
+               index.js
   ...
 ```
 
-All properties inside a Namespace will be merged in the new sub language, e.g `en-US` and `en-UK` will merge the props with `en`.
+All properties inside a Namespace will be merged in the new sub language, e.g
+`en-US` and `en-UK` will merge the props with `en`, using i18next's fallback
+languages tool.
 
-This feature is based on i18next's fallback languages tool.
+You will need to export all Json files in your `index.js` file, mounting an
+object like this:
+
+```js
+   {
+     en: {
+       NameSpace: {
+         keyWord1: 'keyWord1Translation',
+         keyWord2: 'keyWord2Translation',
+         keyWord3: 'keyWord3Translation',
+       }
+     },
+     'en-UK': {
+       NameSpace: {
+         keyWord1: 'keyWord1DifferentTranslation',
+       }
+     }
+   }
+```
+
+Please check the `index.js` files inside locales folder for an example of this
+exporting structure.
 
 ### - Extending languages dynamically
 
-Once you have access to the i18n instance, you can use the 
+You have access to the i18next instance, so you can use the
 [addResourceBundle](https://www.i18next.com/how-to/add-or-load-translations#add-after-init)
-method to add and change language resources.
+method to add and change language resources as needed.
 
 E.g.
 
@@ -188,69 +234,76 @@ i18next.addResourceBundle('pt-BR', 'Buttons', {
 To set a brand new language you can do it in two different ways:
 
 - Opening a pull request for `@ohif/i18n` and sharing the translation with the
-  community. 😍 Please see [Contributing](#contributing-with-new-languages) section
-  for further information.
-  
+  community. 😍 Please see [Contributing](#contributing-with-new-languages)
+  section for further information.
+
 - Setting it only in your project or extension:
 
-You'll need a folder structure like the following, which you can load using the `node context` and send it to `addLocales` method.
+You'll need a a final object like the following, what is setting French as
+language, and send it to `addLocales` method.
 
-Folder structure:
-```bash
- |-- ...
- |-- src
-    |-- locales
-        |-- en
-            |-- Buttons.json
-        |-- es
-            | CO
-               |-- Buttons.js
-            |-- Buttons.json
-  ...
+```js
+const newLanguage =
+   {
+     fr: {
+       Commons: {
+          "Reset": "Réinitialiser",
+          "Previous": "Précédent",
+       },
+       Buttons: {
+         "Rectangle": "Rectangle",
+         "Circle": "Cercle",
+       }
+     }
 ```
 
+To make it easier to translate, you can copy the .json files in the /locales
+folder and theirs index.js exporters, keeping same keys and NameSpaces.
+Importing the main index.js file, will provide you an Object as expected by the
+method `addlocales`;
+
 E.g. of `addLocales` usage
+
 ```js
 import { addLocales } from '@ohif/i18n';
-
-const localesPath = './locales';
-const context = require.context(localesPath, true, /\.json$/);
-addLocales(context);
+import locales from './locales/index.js';
+addLocales(locales);
 ```
 
-Also, [i18next](https://www.i18next.com/how-to/add-or-load-translations#add-after-init) provides a few methods to deal with languages, you have access to it's instance importing the default of @ohif/i18n;
-Fell fre to play around with i18next like this:
-
-```
-import i18next from '@ohif/i18n';
-
-i18next.addResourceBundle('en', 'namespace1', {
-  key: 'hello from namespace 1'
-});
-   
-```
+You can also set them manually, one by one, using this
+[method](#extending-languages-dynamically).
 
 ---
 
-## language Detections
-@ohif/i18n uses [i18next-browser-languageDetector](https://github.com/i18next/i18next-browser-languageDetector) to manage detections, also exports a method called initI18n that accepts a new detector config as parameter.
+## Language Detections
+
+@ohif/i18n uses
+[i18next-browser-languageDetector](https://github.com/i18next/i18next-browser-languageDetector)
+to manage detections, also exports a method called initI18n that accepts a new
+detector config as parameter.
 
 ### Changing the language
-OHIF Viewer accepts a query param called `lng` in the url to change the language.
 
-E.g. 
+OHIF Viewer accepts a query param called `lng` in the url to change the
+language.
+
+E.g.
+
 ```
 https://docs.ohif.org/demo/?lng=es-MX
 ```
 
 ### Language Persistence
-The user's language preference is kept automatically by the detector and stored at a cookie called 'i18next', and in a localstorage key called 'i18nextLng'. 
-These names can be changed with a new [Detector Config](https://github.com/i18next/i18next-browser-languageDetector).
 
+The user's language preference is kept automatically by the detector and stored
+at a cookie called 'i18next', and in a localstorage key called 'i18nextLng'.
+These names can be changed with a new
+[Detector Config](https://github.com/i18next/i18next-browser-languageDetector).
 
 ## Debugging translations
 
-There is an environment variable responsible for debugging the translations, called `REACT_APP_I18N_DEBUG`.
+There is an environment variable responsible for debugging the translations,
+called `REACT_APP_I18N_DEBUG`.
 
 Run the project as following to get full debug information:
 

docs/latest/frequently-asked-questions.md

@@ -1,45 +1,28 @@
 # Frequently Asked Questions
 
-## How do I file a bug?
+## Index
 
-We accept and triage bug reports through Github primarily.
+- [Report a bug][report-bug]
+- [Request a feature][new-feature]
+- [Commercial Support & Consulting][commercial-support]
+- [Academic collaborations][academic]
+- [FDA Clearance or CE Marking][fda-clearance]
+- [HIPAA Compliance][hipaa]
 
-- [Create a Github account](https://github.com/join)
-- Search the current [Issue List](https://github.com/OHIF/Viewers/issues) to
-  ensure you are not creating a duplicate issue.
-  - If your issue already exists, post a comment to show us that this issue also
-    affects you.
-- If no prior issue exists,
-  [Create a New Issue](https://github.com/OHIF/Viewers/issues/new) on the
-  repository.
+### How do I report a bug?
 
-Some tips for filing a new issue:
-
-- **Make sure your issue is reproducible**: If we try to reproduce your issue
-  given your provided steps and we cannot reproduce it, we will not be able to
-  fix it. _Nobody wants to spend time guessing how to reproduce your issue!_
-  Before filing, please reproduce your issue more than once and clearly describe
-  the steps taken.
-- **If you are reporting a user interface issue, provide screenshots**: A
-  picture is worth a thousand words. If your issue concerns the UI, screenshots
-  will help us identify the issue dramatically faster since it can be extremely
-  challenging to describe UI bugs with text. _You should still clearly describe
-  the steps that you took to produce the issue_.
-- **Include platform & environment**: Your operating system, web browser, and
-  web browser version are highly relevant for many bugs. Please provide these
-  with all bug reports.
-- **Include expected and actual result**: Tell us what you expected to happen,
-  and what actually happened. If you don't do this, we might not consider it a
-  bug.
+Navigate to our [GitHub Repository][new-issue], and submit a new bug report.
+Follow the steps outlined in the [Bug Report Template][bug-report-template].
 
 ### How can I request a new feature?
 
 At the moment we are in the process of defining our roadmap and will do our best
 to communicate this to the community. If your requested feature is on the
 roadmap, then it will most likely be built at some point. If it is not, you are
-welcome to build it yourself and [contribute it](../contributing.md). If you
+welcome to build it yourself and [contribute it](contributing/index.md). If you
 have resources and would like to fund the development of a feature, please
-[contact us](http://www.ohif.org).
+[contact us](http://www.ohif.org) or work with community members that offer
+[consulting services][commercial-support].
 
 ### Who should I contact about Academic Collaborations?
 
@@ -49,7 +32,7 @@ collaborators. We are always happy to hear about new groups interested in using
 the OHIF framework, and may be able to provide development support if the
 proposed collaboration has an impact on cancer research.
 
-### Do you offer commercial support?
+### Does OHIF offer commercial support?
 
 The Open Health Imaging Foundation does not offer commercial support, however,
 some community members do offer consulting services. The following contacts may
@@ -60,36 +43,39 @@ be useful:
 **Please file a Pull Request if you wish to add your name or organization to
 this list.**
 
-### I emailed my question to you directly and you did not respond. Why not?
+### Does The OHIF Viewer have [510(k) Clearance][501k-clearance] from the U.S. F.D.A or [CE Marking][ce-marking] from the European Commission?
 
-Emailing developers directly is not a shortcut to faster support. Please file
-your issues and questions on Github so that everyone can benefit from the
-discussion and solutions.
-
-### Do your Viewers have [510(k) Clearance][501k-clearance] from the U.S. F.D.A or [CE Marking][ce-marking] from the European Commission?
-
-**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer, **NOT** F.D.A.
-cleared or CE Marked. It is the users responsibility to ensure compliance with
-applicable rules and regulations. The
+**NO.** The OHIF Viewer is **NOT** F.D.A. cleared or CE Marked. It is the users
+responsibility to ensure compliance with applicable rules and regulations. The
 [License](https://github.com/OHIF/Viewers/blob/master/LICENSE) for the OHIF
-Framework does not prevent your company or group from seeking F.D.A. clearance
-for a product built using the framework.
+Platform does not prevent your company or group from seeking F.D.A. clearance
+for a product built using the platform.
 
 If you have gone this route (or are going there), please let us know because we
 would be interested to hear about your experience.
 
-### Are your Viewers [HIPAA][hipaa] Compliant?
+### Is The OHIF Viewer [HIPAA][hipaa-def] Compliant?
 
-**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer **DO NOT**
-fulfill all of the criteria to become HIPAA Compliant. It is the users
-responsibility to ensure compliance with applicable rules and regulations.
+**NO.** The OHIF Viewer **DOES NOT** fulfill all of the criteria to become HIPAA
+Compliant. It is the users responsibility to ensure compliance with applicable
+rules and regulations.
 
 <!--
   Links
   -->
 
 <!-- prettier-ignore-start -->
+<!-- INDEX -->
+[report-bug]: #how-do-i-report-a-bug
+[new-feature]: #how-can-i-request-a-new-feature
+[commercial-support]: #does-ohif-offer-commercial-support
+[academic]: #who-should-i-contact-about-academic-collaborations
+[fda-clearance]: #does-the-ohif-viewer-have-510k-clearance-from-the-us-fda-or-ce-marking-from-the-european-commission
+[hipaa]: #is-the-ohif-viewer-hipaa-compliant
+<!-- OTHER -->
 [501k-clearance]: https://www.fda.gov/MedicalDevices/DeviceRegulationandGuidance/HowtoMarketYourDevice/PremarketSubmissions/PremarketNotification510k/
 [ce-marking]: https://ec.europa.eu/growth/single-market/ce-marking_en
-[hipaa]: https://en.wikipedia.org/wiki/Health_Insurance_Portability_and_Accountability_Act
+[hipaa-def]: https://en.wikipedia.org/wiki/Health_Insurance_Portability_and_Accountability_Act
+[new-issue]: https://github.com/OHIF/Viewers/issues/new/choose
+[bug-report-template]: https://github.com/OHIF/Viewers/issues/new?assignees=&labels=Bug+Report+%3Abug%3A&template=---bug-report.md&title=
 <!-- prettier-ignore-end -->

docs/latest/help.md

@@ -3,7 +3,7 @@
 We all need a little help sometimes. Don't let a few roadblocks stand in the way
 of you building something awesome.
 
-## Free
+## Community Support
 
 If you're a developer looking to contribute code, documentation, or discussion;
 we are more than happy to help provide clarification and answer questions via
@@ -21,7 +21,7 @@ resources and must be judicious with how we allocate them. If you find yourself
 in this situation and in need of assistance, it may be in your best interest to
 persue paid support.
 
-## Paid / Commercial
+## Commercial Support
 
 The Open Health Imaging Foundation does not offer commercial support, however,
 some community members do offer consulting services:

docs/latest/package.json

@@ -35,7 +35,7 @@
     "gitbook-plugin-ga": "^2.0.0",
     "gitbook-plugin-github": "^3.0.0",
     "gitbook-plugin-sitemap": "^1.2.0",
-    "gitbook-plugin-theme-cornerstone": "^1.1.2",
+    "gitbook-plugin-theme-cornerstone": "^1.1.4",
     "gitbook-plugin-versions": "^2.1.4"
   },
   "devDependencies": {

docs/latest/roadmap.md

@@ -1,25 +0,0 @@
-# Roadmap
-
-If you want to know what's planned for the very near future,
-[check out our roadmap](https://ohif.canny.io/). The best way to influence when
-and what is worked on is to contribute to the conversation by creating GitHub
-issues, and contributing code through pull requests. OHIF's high level
-priorities for the near future are:
-
-- Feature parity with version 1
-- Extension and configuration improvements with key integration partners
-- Continued Developer Experience Improvements
-- Segmentation Tools, and improved VTK.js support
-
-More granular information will make it's way to the backlog as these items
-become scoped for development by core maintainers.
-
-> Don't hesitate to ask questions, propose features, or create pull requests.
-> We're here, we're listening, and we're ready to build the best open source
-> medical imaging viewer on the web.
-
-### Roadmap Generously Powered by Canny.io
-
-<a href="https://ohif.canny.io/">
-  <img height="30" src="assets/img/canny-full.png" />
-</a>

docs/latest/yarn.lock

@@ -1074,10 +1074,10 @@ gitbook-plugin-sitemap@^1.2.0:
   dependencies:
     sitemap "1.5.0"
 
-gitbook-plugin-theme-cornerstone@^1.1.2:
-  version "1.1.3"
-  resolved "https://registry.yarnpkg.com/gitbook-plugin-theme-cornerstone/-/gitbook-plugin-theme-cornerstone-1.1.3.tgz#320e1d688eaf27dbf8d580f285509b55984437fd"
-  integrity sha512-fURj67XGQ5rZPj8LXbwEviMxLfWgN/s08t9Wnp1dQqffBUJwsLe00R/IeecOjsQHJ3Gvb8GjbXJ6qzIDGu5hPA==
+gitbook-plugin-theme-cornerstone@^1.1.4:
+  version "1.1.4"
+  resolved "https://registry.yarnpkg.com/gitbook-plugin-theme-cornerstone/-/gitbook-plugin-theme-cornerstone-1.1.4.tgz#bc21b65acee2ac67e2ddb0986442ec448fe0c7fb"
+  integrity sha512-BADgFyEKhkc0pPSBRwXa5VU2UoYQkd2cRwjrtjHyV6w4h/M7uyeWYFOcsgi2ju3rpHRCwF8lMg/TtDdAV8V1SQ==
 
 gitbook-plugin-versions@^2.1.4:
   version "2.1.4"
@@ -1608,9 +1608,9 @@ lodash.map@^4.4.0:
   integrity sha1-dx7Hg540c9nEzeKLGTlMNWL09tM=
 
 lodash.merge@^4.4.0:
-  version "4.6.1"
-  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.1.tgz#adc25d9cb99b9391c59624f379fbba60d7111d54"
-  integrity sha512-AOYza4+Hf5z1/0Hztxpm2/xiPZgi/cjMqdnKTUWTBSKchJlxXXuUSxCCl8rJlf4g6yww/j6mA8nC8Hw/EZWxKQ==
+  version "4.6.2"
+  resolved "https://registry.yarnpkg.com/lodash.merge/-/lodash.merge-4.6.2.tgz#558aa53b43b661e1925a0afdfa36a9a1085fe57a"
+  integrity sha512-0KpjqXRVvrYyCsX1swR/XTK0va6VQkQM6MNo7PqW77ByjAhoARA8EfrP1N4+KlKj8YS0ZUCtRT/YUuhyYDujIQ==
 
 lodash.pad@^4.1.0:
   version "4.5.1"

docs/v1/faq/general.md

@@ -1,47 +1,93 @@
 # Frequently Asked Questions - General
+
 ### How do I file a bug?
+
 We accept and triage bug reports through Github primarily.
+
 1. [Create a Github account](https://github.com/join)
-2. Search the current [Issue List](https://github.com/OHIF/Viewers/issues) to ensure you are not creating a duplicate issue.
+2. Search the current [Issue List](https://github.com/OHIF/Viewers/issues) to
+   ensure you are not creating a duplicate issue.
 
-  If your issue already exists, post a comment to show us that this issue also affects you.
+If your issue already exists, post a comment to show us that this issue also
+affects you.
 
-3. If no prior issue exists, [Create a New Issue](https://github.com/OHIF/Viewers/issues/new) on the repository.
+3. If no prior issue exists,
+   [Create a New Issue](https://github.com/OHIF/Viewers/issues/new) on the
+   repository.
 
 Some tips for filing a new issue:
-* **Make sure your issue is reproducible**: If we try to reproduce your issue given your provided steps and we cannot reproduce it, we will not be able to fix it. *Nobody wants to spend time guessing how to reproduce your issue!* Before filing, please reproduce your issue more than once and clearly describe the steps taken.
-* **If you are reporting a user interface issue, provide screenshots**: A picture is worth a thousand words. If your issue concerns the UI, screenshots will help us identify the issue dramatically faster since it can be extremely challenging to describe UI bugs with text. *You should still clearly describe the steps that you took to produce the issue*.
-* **Include platform & environment**: Your operating system, web browser, and web browser version are highly relevant for many bugs. Please provide these with all bug reports.
-* **Include expected and actual result**: Tell us what you expected to happen, and what actually happened. If you don't do this, we might not consider it a bug.
+
+- **Make sure your issue is reproducible**: If we try to reproduce your issue
+  given your provided steps and we cannot reproduce it, we will not be able to
+  fix it. _Nobody wants to spend time guessing how to reproduce your issue!_
+  Before filing, please reproduce your issue more than once and clearly describe
+  the steps taken.
+- **If you are reporting a user interface issue, provide screenshots**: A
+  picture is worth a thousand words. If your issue concerns the UI, screenshots
+  will help us identify the issue dramatically faster since it can be extremely
+  challenging to describe UI bugs with text. _You should still clearly describe
+  the steps that you took to produce the issue_.
+- **Include platform & environment**: Your operating system, web browser, and
+  web browser version are highly relevant for many bugs. Please provide these
+  with all bug reports.
+- **Include expected and actual result**: Tell us what you expected to happen,
+  and what actually happened. If you don't do this, we might not consider it a
+  bug.
 
 ### How can I request a new feature?
 
-At the moment we are in the process of defining our roadmap and will do our best to communicate this to the community. If your requested feature is on the roadmap, then it will most likely be built at some point. If it is not, you are welcome to build it yourself and [contribute it](../contributing.md). If you have resources and would like to fund the development of a feature, please [contact us](http://www.ohif.org).
+At the moment we are in the process of defining our roadmap and will do our best
+to communicate this to the community. If your requested feature is on the
+roadmap, then it will most likely be built at some point. If it is not, you are
+welcome to build it yourself and [contribute it](../contributing.md). If you
+have resources and would like to fund the development of a feature, please
+[contact us](http://www.ohif.org).
 
 ### Who should I contact about Academic Collaborations?
 
-[Gordon J. Harris](http://www.dfhcc.harvard.edu/insider/member-detail/member/gordon-j-harris-phd/) at Massachusetts General Hospital is the primary contact for any academic collaborators. We are always happy to hear about new groups interested in using the OHIF framework, and may be able to provide development support if the proposed collaboration has an impact on cancer research.
+[Gordon J. Harris](http://www.dfhcc.harvard.edu/insider/member-detail/member/gordon-j-harris-phd/)
+at Massachusetts General Hospital is the primary contact for any academic
+collaborators. We are always happy to hear about new groups interested in using
+the OHIF framework, and may be able to provide development support if the
+proposed collaboration has an impact on cancer research.
 
 ### Do you offer commercial support?
 
-The Open Health Imaging Foundation does not offer commercial support, however, some community members do offer consulting services. The following contacts may be useful:
+The Open Health Imaging Foundation does not offer commercial support, however,
+some community members do offer consulting services. The following contacts may
+be useful:
 
-* Rob Lewis ([Radical Imaging](http://radicalimaging.com/))
+- Rob Lewis ([Radical Imaging](http://radicalimaging.com/))
 
-**Please file a Pull Request if you wish to add your name or organization to this list.**
+**Please file a Pull Request if you wish to add your name or organization to
+this list.**
 
 ### I emailed my question to you directly and you did not respond. Why not?
 
-Emailing developers directly is not a shortcut to faster support. Please file your issues and questions on Github so that everyone can benefit from the discussion and solutions.
+Emailing developers directly is not a shortcut to faster support. Please file
+your issues and questions on Github so that everyone can benefit from the
+discussion and solutions.
 
 ### Do your Viewers have [510(k) Clearance](https://www.fda.gov/MedicalDevices/DeviceRegulationandGuidance/HowtoMarketYourDevice/PremarketSubmissions/PremarketNotification510k/) from the U.S. F.D.A or [CE Marking](https://ec.europa.eu/growth/single-market/ce-marking_en) from the European Commission?
 
-**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer, **NOT** F.D.A. cleared or CE Marked. It is the users responsibility to ensure compliance with applicable rules and regulations. The [License](https://github.com/OHIF/Viewers/blob/master/LICENSE) for the OHIF Framework does not prevent your company or group from seeking F.D.A. clearance for a product built using the framework.
+**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer, **NOT** F.D.A.
+cleared or CE Marked. It is the users responsibility to ensure compliance with
+applicable rules and regulations. The
+[License](https://github.com/OHIF/Viewers/blob/master/LICENSE) for the OHIF
+Framework does not prevent your company or group from seeking F.D.A. clearance
+for a product built using the framework.
 
-If you have gone this route (or are going there), please let us know because we would be interested to hear about your experience.
+If you have gone this route (or are going there), please let us know because we
+would be interested to hear about your experience.
 
 ### Are your Viewers [HIPAA](https://en.wikipedia.org/wiki/Health_Insurance_Portability_and_Accountability_Act) Compliant?
 
-**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer **DO NOT** fulfill all of the criteria to become HIPAA Compliant. It is the users responsibility to ensure compliance with applicable rules and regulations.
+**NO.** The OHIF Viewer, Lesion Tracker, and Standalone Viewer **DO NOT**
+fulfill all of the criteria to become HIPAA Compliant. It is the users
+responsibility to ensure compliance with applicable rules and regulations.
 
-The Lesion Tracker application demonstrates some available components and features (e.g. [Audit Trail](../lesion-tracker/audit-trail.md), automatic logoff, and unique user identification for [User Accounts](../lesion-tracker/user-accounts.md)) which could be used by third parties seeking HIPAA compliance.
+The Lesion Tracker application demonstrates some available components and
+features (e.g. [Audit Trail](../lesion-tracker/audit-trail.md), automatic
+logoff, and unique user identification for
+[User Accounts](../lesion-tracker/user-accounts.md)) which could be used by
+third parties seeking HIPAA compliance.

eslintAliasesResolver.js

@@ -0,0 +1,8 @@
+module.exports.interfaceVersion = 2;
+
+module.exports.resolve = (source, file, aliases) => {
+  if (aliases[source]) {
+    return { found: true, path: aliases[source] };
+  }
+  return { found: false };
+};

extensions/_example/src/index.js

@@ -0,0 +1,105 @@
+/**
+ *
+ */
+export default {
+  /**
+   * Only required property. Should be a unique value across all extensions.
+   */
+  id: 'example-extension',
+
+  /**
+   * LIFECYCLE HOOKS
+   */
+
+  preRegistration(extensionConfiguration) {},
+
+  /**
+   * MODULE GETTERS
+   */
+
+  getViewportModule() {
+    return '... react component ...';
+  },
+  getSopClassHandlerModule() {
+    return sopClassHandlerModule;
+  },
+  getPanelModule() {
+    return panelModule;
+  },
+  getToolbarModule() {
+    return panelModule;
+  },
+  getCommandsModule(/* store */) {
+    return commandsModule;
+  },
+};
+
+/**
+ *
+ */
+const commandsModule = {
+  actions: {
+    // Store Contexts + Options
+    exampleAction: ({ viewports, param1 }) => {
+      console.log(`There are ${viewports.length} viewports`);
+      console.log(`param1's value is: ${param1}`);
+    },
+  },
+  definitions: {
+    exampleActionDef: {
+      commandFn: this.actions.exampleAction,
+      storeContexts: ['viewports'],
+      options: { param1: 'hello world' },
+    },
+  },
+};
+
+/**
+ *
+ */
+const sopClassHandlerModule = {
+  id: 'OHIFDicomHtmlSopClassHandler',
+  sopClassUids: Object.values({
+    BASIC_TEXT_SR: '1.2.840.10008.5.1.4.1.1.88.11',
+    ENHANCED_SR: '1.2.840.10008.5.1.4.1.1.88.22',
+    COMPREHENSIVE_SR: '1.2.840.10008.5.1.4.1.1.88.33',
+    PROCEDURE_LOG_STORAGE: '1.2.840.10008.5.1.4.1.1.88.40',
+    MAMMOGRAPHY_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.50',
+    CHEST_CAD_SR: '1.2.840.10008.5.1.4.1.1.88.65',
+    X_RAY_RADIATION_DOSE_SR: '1.2.840.10008.5.1.4.1.1.88.67',
+  }),
+  getDisplaySetFromSeries(series, study, dicomWebClient, authorizationHeaders) {
+    const instance = series.getFirstInstance();
+
+    return {
+      plugin: 'html',
+      displaySetInstanceUid: 0, //utils.guid(),
+      wadoRoot: study.getData().wadoRoot,
+      wadoUri: instance.getData().wadouri,
+      sopInstanceUid: instance.getSOPInstanceUID(),
+      seriesInstanceUid: series.getSeriesInstanceUID(),
+      studyInstanceUid: study.getStudyInstanceUID(),
+      authorizationHeaders,
+    };
+  },
+};
+
+/**
+ *
+ */
+const panelModule = {
+  menuOptions: [
+    {
+      icon: 'th-list',
+      label: 'Segments',
+      target: 'segment-panel',
+    },
+  ],
+  components: [
+    {
+      id: 'segment-panel',
+      component: '... react component ...',
+    },
+  ],
+  defaultContext: ['VIEWER'],
+};

extensions/cornerstone/.webpack/webpack.dev.js

@@ -0,0 +1,8 @@
+const path = require('path');
+const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
+const SRC_DIR = path.join(__dirname, '../src');
+const DIST_DIR = path.join(__dirname, '../dist');
+
+module.exports = (env, argv) => {
+  return webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
+};

extensions/cornerstone/.webpack/webpack.prod.js

@@ -0,0 +1,44 @@
+const webpack = require('webpack');
+const merge = require('webpack-merge');
+const path = require('path');
+const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
+const pkg = require('./../package.json');
+
+const ROOT_DIR = path.join(__dirname, './..');
+const SRC_DIR = path.join(__dirname, '../src');
+const DIST_DIR = path.join(__dirname, '../dist');
+
+module.exports = (env, argv) => {
+  const commonConfig = webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
+
+  return merge(commonConfig, {
+    devtool: 'source-map',
+    stats: {
+      colors: true,
+      hash: true,
+      timings: true,
+      assets: true,
+      chunks: false,
+      chunkModules: false,
+      modules: false,
+      children: false,
+      warnings: true,
+    },
+    optimization: {
+      minimize: true,
+      sideEffects: true,
+    },
+    output: {
+      path: ROOT_DIR,
+      library: 'OHIFExtCornerstone',
+      libraryTarget: 'umd',
+      libraryExport: 'default',
+      filename: pkg.main,
+    },
+    plugins: [
+      new webpack.optimize.LimitChunkCountPlugin({
+        maxChunks: 1,
+      }),
+    ],
+  });
+};

extensions/cornerstone/CHANGELOG.md

@@ -0,0 +1,290 @@
+# Change Log
+
+All notable changes to this project will be documented in this file.
+See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+# [1.4.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.3.1...@ohif/extension-cornerstone@1.4.0) (2019-10-26)
+
+
+### Features
+
+* Snapshot Download Tool ([#840](https://github.com/OHIF/Viewers/issues/840)) ([450e098](https://github.com/OHIF/Viewers/commit/450e0981a5ba054fcfcb85eeaeb18371af9088f8))
+
+
+
+
+
+## [1.3.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.3.0...@ohif/extension-cornerstone@1.3.1) (2019-10-09)
+
+
+### Bug Fixes
+
+* 🐛 set tools bidirectional, eraser and annotate command ([#1020](https://github.com/OHIF/Viewers/issues/1020)) ([a28984e](https://github.com/OHIF/Viewers/commit/a28984e))
+
+
+
+
+
+# [1.3.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.5...@ohif/extension-cornerstone@1.3.0) (2019-10-09)
+
+
+### Features
+
+* Multiple fixes and implementation changes to react-cornerstone-viewport ([1cc94f3](https://github.com/OHIF/Viewers/commit/1cc94f3))
+
+
+
+
+
+## [1.2.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.4...@ohif/extension-cornerstone@1.2.5) (2019-09-27)
+
+
+### Bug Fixes
+
+* version bump issue ([#963](https://github.com/OHIF/Viewers/issues/963)) ([e607ed2](https://github.com/OHIF/Viewers/commit/e607ed2)), closes [#962](https://github.com/OHIF/Viewers/issues/962)
+
+
+
+
+
+# [2.0.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.2...@ohif/extension-cornerstone@2.0.0) (2019-09-27)
+
+
+### Bug Fixes
+
+* 🐛 Add DicomLoaderService & FileLoaderService to fix SR, PDF, and SEG support in local file and WADO-RS-only use cases ([#862](https://github.com/OHIF/Viewers/issues/862)) ([e7e1a8a](https://github.com/OHIF/Viewers/commit/e7e1a8a)), closes [#838](https://github.com/OHIF/Viewers/issues/838)
+* version bump issue ([#962](https://github.com/OHIF/Viewers/issues/962)) ([c80ea17](https://github.com/OHIF/Viewers/commit/c80ea17))
+
+
+### BREAKING CHANGES
+
+* DICOM Seg
+
+
+
+
+
+# [2.0.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.2...@ohif/extension-cornerstone@2.0.0) (2019-09-27)
+
+
+### Bug Fixes
+
+* 🐛 Add DicomLoaderService & FileLoaderService to fix SR, PDF, and SEG support in local file and WADO-RS-only use cases ([#862](https://github.com/OHIF/Viewers/issues/862)) ([e7e1a8a](https://github.com/OHIF/Viewers/commit/e7e1a8a)), closes [#838](https://github.com/OHIF/Viewers/issues/838)
+
+
+### BREAKING CHANGES
+
+* DICOM Seg
+
+
+
+
+
+## [1.2.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.1...@ohif/extension-cornerstone@1.2.2) (2019-09-26)
+
+
+### Bug Fixes
+
+* Add some code splitting for PWA build ([#937](https://github.com/OHIF/Viewers/issues/937)) ([8938035](https://github.com/OHIF/Viewers/commit/8938035))
+
+
+
+
+
+## [1.2.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.2.0...@ohif/extension-cornerstone@1.2.1) (2019-09-17)
+
+
+### Bug Fixes
+
+* bump cornerstone-tools version in peerDeps ([4afc88c](https://github.com/OHIF/Viewers/commit/4afc88c))
+
+
+
+
+
+# [1.2.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.1.1...@ohif/extension-cornerstone@1.2.0) (2019-09-12)
+
+
+### Features
+
+* **Annotate:** Add annotate tool back to toolbar ([26be967](https://github.com/OHIF/Viewers/commit/26be967))
+
+
+
+
+
+## [1.1.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.1.0...@ohif/extension-cornerstone@1.1.1) (2019-09-12)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [1.1.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.0.1...@ohif/extension-cornerstone@1.1.0) (2019-09-12)
+
+
+### Features
+
+* **BidirectionalTool:** Add BidrectionalTool to "more" menu ([#911](https://github.com/OHIF/Viewers/issues/911)) ([e40cbae](https://github.com/OHIF/Viewers/commit/e40cbae))
+* **EraserTool:** add eraserTool to @ohif/extension-cornerstone ([#912](https://github.com/OHIF/Viewers/issues/912)) ([698d274](https://github.com/OHIF/Viewers/commit/698d274))
+
+
+
+
+
+## [1.0.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@1.0.0...@ohif/extension-cornerstone@1.0.1) (2019-09-10)
+
+
+### Bug Fixes
+
+* simplify runtime-extension usage ([ac5dbda](https://github.com/OHIF/Viewers/commit/ac5dbda))
+
+
+
+
+
+# [1.0.0](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.5...@ohif/extension-cornerstone@1.0.0) (2019-09-09)
+
+
+### Features
+
+* 🎸 Upgraded to cornerstoneTools 4.0 ([86adb51](https://github.com/OHIF/Viewers/commit/86adb51))
+
+
+### BREAKING CHANGES
+
+* n
+
+
+
+
+
+## [0.50.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.4...@ohif/extension-cornerstone@0.50.5) (2019-09-06)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [0.50.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.3...@ohif/extension-cornerstone@0.50.4) (2019-09-04)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [0.50.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.2...@ohif/extension-cornerstone@0.50.3) (2019-09-04)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [0.50.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.1...@ohif/extension-cornerstone@0.50.2) (2019-09-04)
+
+
+### Bug Fixes
+
+* measurementsAPI issue caused by production build ([#842](https://github.com/OHIF/Viewers/issues/842)) ([49d3439](https://github.com/OHIF/Viewers/commit/49d3439))
+
+
+
+
+
+## [0.50.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.50.0-alpha.10...@ohif/extension-cornerstone@0.50.1) (2019-08-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# [0.50.0-alpha.10](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.9...@ohif/extension-cornerstone@0.50.0-alpha.10) (2019-08-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## [0.0.39-alpha.9](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.8...@ohif/extension-cornerstone@0.0.39-alpha.9) (2019-08-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+## 0.0.39-alpha.8 (2019-08-14)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+
+
+
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.7](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.6...@ohif/extension-cornerstone@0.0.39-alpha.7) (2019-08-08)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.6](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.5...@ohif/extension-cornerstone@0.0.39-alpha.6) (2019-08-08)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.5](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.4...@ohif/extension-cornerstone@0.0.39-alpha.5) (2019-08-08)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.4](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.3...@ohif/extension-cornerstone@0.0.39-alpha.4) (2019-08-08)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.3](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.2...@ohif/extension-cornerstone@0.0.39-alpha.3) (2019-08-08)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+# Change Log
+
+All notable changes to this project will be documented in this file. See
+[Conventional Commits](https://conventionalcommits.org) for commit guidelines.
+
+## [0.0.39-alpha.2](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.1...@ohif/extension-cornerstone@0.0.39-alpha.2) (2019-08-07)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+## [0.0.39-alpha.1](https://github.com/OHIF/Viewers/compare/@ohif/extension-cornerstone@0.0.39-alpha.0...@ohif/extension-cornerstone@0.0.39-alpha.1) (2019-08-07)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone
+
+## 0.0.39-alpha.0 (2019-08-05)
+
+**Note:** Version bump only for package @ohif/extension-cornerstone

extensions/cornerstone/README.md

@@ -0,0 +1,89 @@
+# @ohif/extension-cornerstone
+
+![npm (scoped)](https://img.shields.io/npm/v/@ohif/extension-cornerstone.svg?style=flat-square)
+
+This extension adds support for viewing and manipulating 2D medical images via a
+viewport. The underlying implementation wraps the
+`cornerstonejs/react-cornerstone-viewport`, and provides basic commands and
+toolbar buttons for common actions.
+
+<!-- TODO: Simple image or GIF? -->
+
+#### Index
+
+Extension Id: `cornerstone`
+
+- [Commands Module](#commands-module)
+- [Toolbar Module](#toolbar-module)
+- [Viewport Module](#viewport-module)
+
+## Commands Module
+
+This extensions includes the following `Commands` and `Command Definitions`.
+These can be registered with `@ohif/core`'s `CommandManager`. After registering
+the commands, they can be bound to `hotkeys` using the `HotkeysManager` and
+listed in the `UserPreferences` modal.
+
+You can read more about [`Commands`][docs-commands], [`Hotkeys`][docs-hotkeys],
+and the [`UserPreferences` Modal][docs-userprefs] in their respective locations
+in the OHIF Viewer's documentation.
+
+| Command Name                 | Description                             | Store Contexts |
+| ---------------------------- | --------------------------------------- | -------------- |
+| `rotateViewportCW`           |                                         | viewports      |
+| `rotateViewportCCW`          |                                         | viewports      |
+| `invertViewport`             |                                         | viewports      |
+| `flipViewportVertical`       |                                         | viewports      |
+| `flipViewportHorizontal`     |                                         | viewports      |
+| `scaleUpViewport`            |                                         | viewports      |
+| `scaleDownViewport`          |                                         | viewports      |
+| `fitViewportToWindow`        |                                         | viewports      |
+| `resetViewport`              |                                         | viewports      |
+| clearAnnotations             | TODO                                    |                |
+| next/previous Image          | TODO                                    |                |
+| first/last Image             | TODO                                    |                |
+| `nextViewportDisplaySet`     |                                         |                |
+| `previousViewportDisplaySet` |                                         |                |
+| `setToolActive`              | Activates tool for primary button/touch |                |
+
+## Toolbar Module
+
+Our toolbar module contains definitions for:
+
+- `StackScroll`
+- `Zoom`
+- `Wwwc`
+- `Pan`
+- `Length`
+- `Angle`
+- `Reset`
+- `Cine`
+
+All use the `ACTIVE_VIEWPORT::CORNERSTONE` context.
+
+## Viewport Module
+
+Our Viewport wraps [cornerstonejs/react-cornerstone-viewport][react-viewport]
+and is connected the redux store. This module is the most prone to change as we
+hammer out our Viewport interface.
+
+## Resources
+
+### Repositories
+
+- [cornerstonejs/react-cornerstone-viewport][react-viewport]
+- [cornerstonejs/cornerstoneTools][cornerstone-tools]
+- [cornerstonejs/cornerstone][cornerstone]
+
+<!--
+  Links
+  -->
+
+<!-- prettier-ignore-start -->
+[docs-commands]: https://www.com
+[docs-hotkeys]: https://www.com
+[docs-userprefs]: htt
+[react-viewport]: https://github.com/cornerstonejs/react-cornerstone-viewport
+[cornerstone-tools]: https://github.com/cornerstonejs/cornerstoneTools
+[cornerstone]: https://github.com/cornerstonejs/cornerstone
+<!-- prettier-ignore-end -->

extensions/cornerstone/package.json

@@ -0,0 +1,53 @@
+{
+  "name": "@ohif/extension-cornerstone",
+  "version": "1.4.0",
+  "description": "OHIF extension for Cornerstone",
+  "author": "OHIF",
+  "license": "MIT",
+  "repository": "OHIF/Viewers",
+  "main": "dist/index.umd.js",
+  "module": "src/index.js",
+  "engines": {
+    "node": ">=10",
+    "npm": ">=6",
+    "yarn": ">=1.16.0"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "cross-env NODE_ENV=development webpack --config .webpack/webpack.dev.js --watch --debug --output-pathinfo",
+    "dev:cornerstone": "yarn run dev",
+    "build": "cross-env NODE_ENV=production webpack --config .webpack/webpack.prod.js",
+    "build:package": "yarn run build",
+    "prepublishOnly": "yarn run build",
+    "start": "yarn run dev"
+  },
+  "peerDependencies": {
+    "@ohif/core": "^0.50.0",
+    "@ohif/ui": "^0.50.0",
+    "cornerstone-core": "^2.2.8",
+    "cornerstone-math": "^0.1.8",
+    "cornerstone-tools": "^4.0.9",
+    "cornerstone-wado-image-loader": "^3.0.0",
+    "dcmjs": "^0.6.1",
+    "dicom-parser": "^1.8.3",
+    "hammerjs": "^2.0.8",
+    "prop-types": "^15.6.2",
+    "react": "^16.8.6",
+    "react-dom": "^16.8.6",
+    "react-redux": "^6.0.0",
+    "react-resize-detector": "^3.4.0",
+    "redux": "^4.0.1"
+  },
+  "dependencies": {
+    "@babel/runtime": "^7.5.5",
+    "classnames": "^2.2.6",
+    "lodash.throttle": "^4.1.1",
+    "react-cornerstone-viewport": "2.x.x"
+  }
+}

extensions/cornerstone/src/ConnectedCornerstoneViewport.js

@@ -1,18 +1,29 @@
-import { connect } from 'react-redux';
 import CornerstoneViewport from 'react-cornerstone-viewport';
-import OHIF from 'ohif-core';
+import OHIF from '@ohif/core';
+import { connect } from 'react-redux';
 import throttle from 'lodash.throttle';
 
+const { setViewportActive, setViewportSpecificData } = OHIF.redux.actions;
 const {
-  setViewportActive,
-  setViewportSpecificData,
-  clearViewportSpecificData
-} = OHIF.redux.actions;
+  onAdded,
+  onRemoved,
+  onModified,
+} = OHIF.measurements.MeasurementHandlers;
+
+// TODO: Transition to enums for the action names so that we can ensure they stay up to date
+// everywhere they're used.
+const MEASUREMENT_ACTION_MAP = {
+  added: onAdded,
+  removed: onRemoved,
+  modified: throttle(event => {
+    return onModified(event);
+  }, 300),
+};
 
 const mapStateToProps = (state, ownProps) => {
-  const activeButton = state.tools.buttons.find(tool => tool.active === true);
   let dataFromStore;
 
+  // TODO: This may not be updated anymore :thinking:
   if (state.extensions && state.extensions.cornerstone) {
     dataFromStore = state.extensions.cornerstone;
   }
@@ -23,15 +34,29 @@ const mapStateToProps = (state, ownProps) => {
   const viewportSpecificData =
     state.viewports.viewportSpecificData[viewportIndex] || {};
 
+  // CINE
+  let isPlaying = false;
+  let frameRate = 24;
+
+  if (viewportSpecificData && viewportSpecificData.cine) {
+    const cine = viewportSpecificData.cine;
+
+    isPlaying = cine.isPlaying === true;
+    frameRate = cine.cineFrameRate || frameRate;
+  }
+
   return {
-    layout: state.viewports.layout,
+    // layout: state.viewports.layout,
     isActive,
-    activeTool: activeButton && activeButton.command,
+    // TODO: Need a cleaner and more versatile way.
+    // Currently justing using escape hatch + commands
+    // activeTool: activeButton && activeButton.command,
     ...dataFromStore,
-    enableStackPrefetch: isActive,
+    isStackPrefetchEnabled: isActive,
+    isPlaying,
+    frameRate,
     //stack: viewportSpecificData.stack,
-    cineToolData: viewportSpecificData.cine,
-    viewport: viewportSpecificData.viewport
+    // viewport: viewportSpecificData.viewport,
   };
 };
 
@@ -47,10 +72,6 @@ const mapDispatchToProps = (dispatch, ownProps) => {
       dispatch(setViewportSpecificData(viewportIndex, data));
     },
 
-    clearViewportSpecificData: () => {
-      dispatch(clearViewportSpecificData(viewportIndex));
-    },
-
     /**
      * Our component "enables" the underlying dom element on "componentDidMount"
      * It listens for that event, and then emits the enabledElement. We can grab
@@ -61,27 +82,16 @@ const mapDispatchToProps = (dispatch, ownProps) => {
       const enabledElement = event.detail.element;
       dispatch(
         setViewportSpecificData(viewportIndex, {
-          dom: enabledElement
+          // TODO: Hack to make sure our plugin info is available from the outset
+          plugin: 'cornerstone',
+          dom: enabledElement,
         })
       );
     },
 
     onMeasurementsChanged: (event, action) => {
-      const {
-        onAdded,
-        onRemoved,
-        onModified
-      } = OHIF.measurements.MeasurementHandlers;
-      const actions = {
-        added: onAdded,
-        removed: onRemoved,
-        modified: throttle(event => {
-          return onModified(event);
-        }, 300)
-      };
-
-      return actions[action](event);
-    }
+      return MEASUREMENT_ACTION_MAP[action](event);
+    },
   };
 };
 

extensions/cornerstone/src/OHIFCornerstoneViewport.js

@@ -1,9 +1,9 @@
 import React, { Component } from 'react';
-import PropTypes from 'prop-types';
-import OHIF from 'ohif-core';
+
 import ConnectedCornerstoneViewport from './ConnectedCornerstoneViewport';
+import OHIF from '@ohif/core';
+import PropTypes from 'prop-types';
 import cornerstone from 'cornerstone-core';
-import './config';
 import handleSegmentationStorage from './handleSegmentationStorage.js';
 
 const { StackManager } = OHIF.utils;
@@ -18,7 +18,7 @@ cornerstone.metaData.addProvider(
 StackManager.setMetadataProvider(metadataProvider);
 
 const SOP_CLASSES = {
-  SEGMENTATION_STORAGE: '1.2.840.10008.5.1.4.1.1.66.4'
+  SEGMENTATION_STORAGE: '1.2.840.10008.5.1.4.1.1.66.4',
 };
 
 const specialCaseHandlers = {};
@@ -28,11 +28,11 @@ specialCaseHandlers[
 
 class OHIFCornerstoneViewport extends Component {
   state = {
-    viewportData: null
+    viewportData: null,
   };
 
   static defaultProps = {
-    customProps: {}
+    customProps: {},
   };
 
   static propTypes = {
@@ -40,7 +40,7 @@ class OHIFCornerstoneViewport extends Component {
     displaySet: PropTypes.object,
     viewportIndex: PropTypes.number,
     children: PropTypes.node,
-    customProps: PropTypes.object
+    customProps: PropTypes.object,
   };
 
   static id = 'OHIFCornerstoneViewport';
@@ -54,31 +54,60 @@ class OHIFCornerstoneViewport extends Component {
     StackManager.clearStacks();
   }
 
+  /**
+   * Obtain the CornerstoneTools Stack for the specified display set.
+   *
+   * @param {Object[]} studies
+   * @param {String} studyInstanceUid
+   * @param {String} displaySetInstanceUid
+   * @param {String} [sopInstanceUid]
+   * @param {Number} [frameIndex=1]
+   * @return {Object} CornerstoneTools Stack
+   */
   static getCornerstoneStack(
     studies,
     studyInstanceUid,
     displaySetInstanceUid,
     sopInstanceUid,
-    frameIndex
+    frameIndex = 0
   ) {
+    if (!studies || !studies.length) {
+      throw new Error('Studies not provided.');
+    }
+
+    if (!studyInstanceUid) {
+      throw new Error('StudyInstanceUID not provided.');
+    }
+
+    if (!displaySetInstanceUid) {
+      throw new Error('StudyInstanceUID not provided.');
+    }
+
     // Create shortcut to displaySet
     const study = studies.find(
       study => study.studyInstanceUid === studyInstanceUid
     );
 
+    if (!study) {
+      throw new Error('Study not found.');
+    }
+
     const displaySet = study.displaySets.find(set => {
       return set.displaySetInstanceUid === displaySetInstanceUid;
     });
 
+    if (!displaySet) {
+      throw new Error('Display Set not found.');
+    }
+
     // Get stack from Stack Manager
     const storedStack = StackManager.findOrCreateStack(study, displaySet);
 
     // Clone the stack here so we don't mutate it
     const stack = Object.assign({}, storedStack);
+    stack.currentImageIdIndex = frameIndex;
 
-    if (frameIndex !== undefined) {
-      stack.currentImageIdIndex = frameIndex;
-    } else if (sopInstanceUid) {
+    if (sopInstanceUid) {
       const index = stack.imageIds.findIndex(imageId => {
         const sopCommonModule = cornerstone.metaData.get(
           'sopCommonModule',
@@ -94,31 +123,15 @@ class OHIFCornerstoneViewport extends Component {
       if (index > -1) {
         stack.currentImageIdIndex = index;
       } else {
-        stack.currentImageIdIndex = 0;
+        console.warn(
+          'SOPInstanceUID provided was not found in specified DisplaySet'
+        );
       }
-    } else {
-      stack.currentImageIdIndex = 0;
     }
 
     return stack;
   }
 
-  static getViewportData = (
-    studies,
-    studyInstanceUid,
-    displaySetInstanceUid,
-    sopInstanceUid,
-    frameIndex
-  ) => {
-    return OHIFCornerstoneViewport.getCornerstoneStack(
-      studies,
-      studyInstanceUid,
-      displaySetInstanceUid,
-      sopInstanceUid,
-      frameIndex
-    );
-  };
-
   getViewportData = async (
     studies,
     studyInstanceUid,
@@ -143,7 +156,7 @@ class OHIFCornerstoneViewport extends Component {
         );
         break;
       default:
-        const stack = OHIFCornerstoneViewport.getViewportData(
+        const stack = OHIFCornerstoneViewport.getCornerstoneStack(
           studies,
           studyInstanceUid,
           displaySetInstanceUid,
@@ -154,7 +167,7 @@ class OHIFCornerstoneViewport extends Component {
         viewportData = {
           studyInstanceUid,
           displaySetInstanceUid,
-          stack
+          stack,
         };
 
         break;
@@ -170,9 +183,13 @@ class OHIFCornerstoneViewport extends Component {
       displaySetInstanceUid,
       sopClassUids,
       sopInstanceUid,
-      frameIndex
+      frameIndex,
     } = displaySet;
 
+    if (!studyInstanceUid || !displaySetInstanceUid) {
+      return;
+    }
+
     if (sopClassUids && sopClassUids.length > 1) {
       console.warn(
         'More than one SOPClassUid in the same series is not yet supported.'
@@ -190,7 +207,7 @@ class OHIFCornerstoneViewport extends Component {
       frameIndex
     ).then(viewportData => {
       this.setState({
-        viewportData
+        viewportData,
       });
     });
   }
@@ -216,25 +233,42 @@ class OHIFCornerstoneViewport extends Component {
   render() {
     let childrenWithProps = null;
 
+    if (!this.state.viewportData) {
+      return null;
+    }
+    const { viewportIndex } = this.props;
+    const {
+      imageIds,
+      currentImageIdIndex,
+      // If this comes from the instance, would be a better default
+      // `FrameTime` in the instance
+      // frameRate = 0,
+    } = this.state.viewportData.stack;
+
     // TODO: Does it make more sense to use Context?
     if (this.props.children && this.props.children.length) {
       childrenWithProps = this.props.children.map((child, index) => {
         return React.cloneElement(child, {
           viewportIndex: this.props.viewportIndex,
-          key: index
+          key: index,
         });
       });
     }
 
     return (
       <>
-        {this.state.viewportData && (
-          <ConnectedCornerstoneViewport
-            viewportData={this.state.viewportData}
-            viewportIndex={this.props.viewportIndex}
-            {...this.props.customProps}
-          />
-        )}
+        <ConnectedCornerstoneViewport
+          viewportIndex={viewportIndex}
+          imageIds={imageIds}
+          imageIdIndex={currentImageIdIndex}
+          // ~~ Connected (From REDUX)
+          // frameRate={frameRate}
+          // isPlaying={false}
+          // isStackPrefetchEnabled={true}
+          // onElementEnabled={() => {}}
+          // setViewportActive{() => {}}
+          {...this.props.customProps}
+        />
         {childrenWithProps}
       </>
     );

extensions/cornerstone/src/commandsModule.js

@@ -1,8 +1,7 @@
 import cornerstone from 'cornerstone-core';
-import { redux } from 'ohif-core';
-import store from './../store/';
-
-const { setToolActive } = redux.actions;
+import cornerstoneTools from 'cornerstone-tools';
+import OHIF from '@ohif/core';
+const scroll = cornerstoneTools.import('util/scroll');
 
 const actions = {
   rotateViewport: ({ viewports, rotation }) => {
@@ -80,26 +79,88 @@ const actions = {
       cornerstone.setViewport(enabledElement, viewport);
     }
   },
-  // This has a weird hard dependency on the tools that are available as toolbar
-  // buttons. You can see this in `ohif-core/src/redux/reducers/tools.js`
-  // the `toolName` needs to equal the button's `command` property.
-  // NOTE: It would be nice if `hotkeys` could set this, instead of creating a command per tool
-  setCornerstoneToolActive: ({ toolName }) => {
-    store.dispatch(setToolActive(toolName));
+  // TODO: this is receiving `evt` from `ToolbarRow`. We could use it to have
+  //       better mouseButtonMask sets.
+  setToolActive: ({ toolName }) => {
+    if (!toolName) {
+      console.warn('No toolname provided to setToolActive command');
+    }
+    cornerstoneTools.setToolActive(toolName, { mouseButtonMask: 1 });
   },
   updateViewportDisplaySet: ({ direction }) => {
     // TODO
     console.warn('updateDisplaySet: ', direction);
   },
-  clearAnnotations: () => {
-    console.warn('clearAnnotations: not yet implemented');
-    // const toolState =
-    //   cornerstoneTools.globalImageIdSpecificToolStateManager.toolState;
-    // if (!toolState) return;
-    // Object.keys(toolState).forEach(imageId => {
-    //   if (!cornerstoneImageId || cornerstoneImageId === imageId)
-    //     delete toolState[imageId];
-    // });
+  clearAnnotations: ({ viewports }) => {
+    const element = _getActiveViewportEnabledElement(
+      viewports.viewportSpecificData,
+      viewports.activeViewportIndex
+    );
+    if (!element) {
+      return;
+    }
+
+    const enabledElement = cornerstone.getEnabledElement(element);
+    if (!enabledElement || !enabledElement.image) {
+      return;
+    }
+
+    const {
+      toolState,
+    } = cornerstoneTools.globalImageIdSpecificToolStateManager;
+    if (
+      !toolState ||
+      toolState.hasOwnProperty(enabledElement.image.imageId) === false
+    ) {
+      return;
+    }
+
+    const imageIdToolState = toolState[enabledElement.image.imageId];
+
+    const measurementsToRemove = [];
+
+    Object.keys(imageIdToolState).forEach(toolType => {
+      const { data } = imageIdToolState[toolType];
+
+      data.forEach(measurementData => {
+        const { _id, lesionNamingNumber, measurementNumber } = measurementData;
+        if (!_id) {
+          return;
+        }
+
+        measurementsToRemove.push({
+          toolType,
+          _id,
+          lesionNamingNumber,
+          measurementNumber,
+        });
+      });
+    });
+
+    measurementsToRemove.forEach(measurementData => {
+      OHIF.measurements.MeasurementHandlers.onRemoved({
+        detail: {
+          toolType: measurementData.toolType,
+          measurementData,
+        },
+      });
+    });
+  },
+  nextImage: ({ viewports }) => {
+    const enabledElement = _getActiveViewportEnabledElement(
+      viewports.viewportSpecificData,
+      viewports.activeViewportIndex
+    );
+
+    scroll(enabledElement, 1);
+  },
+  previousImage: ({ viewports }) => {
+    const enabledElement = _getActiveViewportEnabledElement(
+      viewports.viewportSpecificData,
+      viewports.activeViewportIndex
+    );
+
+    scroll(enabledElement, -1);
   },
 };
 
@@ -130,13 +191,11 @@ const definitions = {
     options: {},
   },
   scaleUpViewport: {
-    keys: '',
     commandFn: actions.scaleViewport,
     storeContexts: ['viewports'],
     options: { direction: 1 },
   },
   scaleDownViewport: {
-    keys: '',
     commandFn: actions.scaleViewport,
     storeContexts: ['viewports'],
     options: { direction: -1 },
@@ -151,8 +210,21 @@ const definitions = {
     storeContexts: ['viewports'],
     options: {},
   },
-  // TODO: Clear Annotations
-  // TODO: Next/Previous image
+  clearAnnotations: {
+    commandFn: actions.clearAnnotations,
+    storeContexts: ['viewports'],
+    options: {},
+  },
+  nextImage: {
+    commandFn: actions.nextImage,
+    storeContexts: ['viewports'],
+    options: {},
+  },
+  previousImage: {
+    commandFn: actions.previousImage,
+    storeContexts: ['viewports'],
+    options: {},
+  },
   // TODO: First/Last image
   // Next/Previous series/DisplaySet
   nextViewportDisplaySet: {
@@ -166,10 +238,10 @@ const definitions = {
     options: { direction: -1 },
   },
   // TOOLS
-  setZoomTool: {
-    commandFn: actions.setCornerstoneToolActive,
+  setToolActive: {
+    commandFn: actions.setToolActive,
     storeContexts: [],
-    options: { toolName: 'Zoom' },
+    options: {},
   },
 };
 
@@ -182,4 +254,8 @@ function _getActiveViewportEnabledElement(viewports, activeIndex) {
   return activeViewport.dom;
 }
 
-export default definitions;
+export default {
+  actions,
+  definitions,
+  defaultContext: 'ACTIVE_VIEWPORT::CORNERSTONE',
+};

extensions/cornerstone/src/handleSegmentationStorage.js

@@ -1,9 +1,10 @@
-import OHIF from 'ohif-core';
-import cornerstone from 'cornerstone-core';
-import cornerstoneTools from 'cornerstone-tools';
 import * as dcmjs from 'dcmjs';
 
-const { StackManager } = OHIF.utils;
+import OHIF from '@ohif/core';
+import cornerstone from 'cornerstone-core';
+import cornerstoneTools from 'cornerstone-tools';
+
+const { StackManager, DicomLoaderService } = OHIF.utils;
 
 function getDisplaySet(studies, studyInstanceUid, displaySetInstanceUid) {
   const study = studies.find(
@@ -27,28 +28,6 @@ function getDisplaySetsBySeries(studies, studyInstanceUid, seriesInstanceUid) {
   });
 }
 
-function getCornerstoneStack(studies, studyInstanceUid, displaySetInstanceUid) {
-  const study = studies.find(
-    study => study.studyInstanceUid === studyInstanceUid
-  );
-
-  // Create shortcut to displaySet
-  const displaySet = getDisplaySet(
-    studies,
-    studyInstanceUid,
-    displaySetInstanceUid
-  );
-
-  // Get stack from Stack Manager
-  const stack = StackManager.findOrCreateStack(study, displaySet);
-
-  // Clone the stack here so we don't mutate it later
-  const stackClone = Object.assign({}, stack);
-  stackClone.currentImageIdIndex = 0;
-
-  return stackClone;
-}
-
 function parseSeg(arrayBuffer, imageIds) {
   return dcmjs.adapters.Cornerstone.Segmentation.generateToolState(
     imageIds,
@@ -73,14 +52,6 @@ function addSegMetadataToCornerstoneToolState(
   }
 }
 
-function retrieveDicomData(wadoUri) {
-  // TODO: Authorization header depends on the server. If we ever have multiple servers
-  // we will need to figure out how / when to pass this information in.
-  return fetch(wadoUri, {
-    headers: OHIF.DICOMWeb.getAuthorizationHeader()
-  }).then(response => response.arrayBuffer());
-}
-
 async function handleSegmentationStorage(
   studies,
   studyInstanceUid,
@@ -94,8 +65,11 @@ async function handleSegmentationStorage(
     studyInstanceUid,
     displaySetInstanceUid
   );
-  const segWadoUri = displaySet.images[0].getData().wadouri;
-  const arrayBuffer = await retrieveDicomData(segWadoUri);
+
+  const arrayBuffer = await DicomLoaderService.findDicomDataPromise(
+    displaySet,
+    studies
+  );
   const dicomData = dcmjs.data.DicomMessage.readFile(arrayBuffer);
   const dataset = dcmjs.data.DicomMetaDictionary.naturalizeDataset(
     dicomData.dict
@@ -124,14 +98,16 @@ async function handleSegmentationStorage(
     throw new Error('Fractional segmentations are not supported');
   }
 
-  const { segMetadata, toolState } = results;
+  const { labelmapBuffer, segMetadata, segmentsOnFrame } = results;
+  const { setters } = cornerstoneTools.getModule('segmentation');
 
-  segMetadata.seriesInstanceUid = seriesInstanceUid;
-
-  addSegMetadataToCornerstoneToolState(
+  setters.labelmap3DByFirstImageId(
+    imageIds[0],
+    labelmapBuffer,
+    0, // TODO -> Can define a color LUT based on colors in the SEG later.
     segMetadata,
-    toolState,
-    displaySetInstanceUid
+    imageIds.length,
+    segmentsOnFrame
   );
 
   const cachedStack = StackManager.findOrCreateStack(
@@ -139,12 +115,13 @@ async function handleSegmentationStorage(
     referenceDisplaySet
   );
   const stack = Object.assign({}, cachedStack);
+
   stack.currentImageIdIndex = 0;
 
   return {
     studyInstanceUid,
     displaySetInstanceUid,
-    stack
+    stack,
   };
 }
 

extensions/cornerstone/src/index.js

@@ -0,0 +1,39 @@
+import init from './init.js';
+import asyncComponent from './asyncComponent.js';
+import commandsModule from './commandsModule.js';
+import toolbarModule from './toolbarModule.js';
+
+const OHIFCornerstoneViewport = asyncComponent(() =>
+  import(
+    /* webpackChunkName: "OHIFCornerstoneViewport" */ './OHIFCornerstoneViewport.js'
+  )
+);
+
+/**
+ *
+ */
+export default {
+  /**
+   * Only required property. Should be a unique value across all extensions.
+   */
+  id: 'cornerstone',
+
+  /**
+   *
+   *
+   * @param {object} [configuration={}]
+   * @param {object|array} [configuration.csToolsConfig] - Passed directly to `initCornerstoneTools`
+   */
+  preRegistration(configuration = {}) {
+    init(configuration);
+  },
+  getViewportModule() {
+    return OHIFCornerstoneViewport;
+  },
+  getToolbarModule() {
+    return toolbarModule;
+  },
+  getCommandsModule() {
+    return commandsModule;
+  },
+};

extensions/cornerstone/src/init.js

@@ -0,0 +1,87 @@
+import OHIF from '@ohif/core';
+import cornerstone from 'cornerstone-core';
+import csTools from 'cornerstone-tools';
+import initCornerstoneTools from './initCornerstoneTools.js';
+
+/**
+ *
+ * @param {object} configuration
+ * @param {Object|Array} configuration.csToolsConfig
+ */
+export default function init(configuration = {}) {
+  const { csToolsConfig } = configuration;
+  const { StackManager } = OHIF.utils;
+  const metadataProvider = new OHIF.cornerstone.MetadataProvider();
+
+  // ~~ Set our MetadataProvider
+  cornerstone.metaData.addProvider(
+    metadataProvider.provider.bind(metadataProvider)
+  );
+
+  StackManager.setMetadataProvider(metadataProvider);
+
+  // ~~
+  const defaultCsToolsConfig = csToolsConfig || {
+    globalToolSyncEnabled: true,
+    showSVGCursors: true,
+    autoResizeViewports: false,
+  };
+
+  initCornerstoneTools(defaultCsToolsConfig);
+
+  // ~~ Toooools 🙌
+  const {
+    PanTool,
+    ZoomTool,
+    WwwcTool,
+    MagnifyTool,
+    StackScrollTool,
+    StackScrollMouseWheelTool,
+    // Touch
+    PanMultiTouchTool,
+    ZoomTouchPinchTool,
+    // Annotations
+    EraserTool,
+    ArrowAnnotateTool,
+    BidirectionalTool,
+    LengthTool,
+    AngleTool,
+    FreehandRoiTool,
+    EllipticalRoiTool,
+    DragProbeTool,
+    RectangleRoiTool,
+    // Segmentation
+    BrushTool,
+  } = csTools;
+  const tools = [
+    PanTool,
+    ZoomTool,
+    WwwcTool,
+    MagnifyTool,
+    StackScrollTool,
+    StackScrollMouseWheelTool,
+    // Touch
+    PanMultiTouchTool,
+    ZoomTouchPinchTool,
+    // Annotations
+    EraserTool,
+    ArrowAnnotateTool,
+    BidirectionalTool,
+    LengthTool,
+    AngleTool,
+    FreehandRoiTool,
+    EllipticalRoiTool,
+    DragProbeTool,
+    RectangleRoiTool,
+    // Segmentation
+    BrushTool,
+  ];
+
+  tools.forEach(tool => csTools.addTool(tool));
+  csTools.setToolActive('Pan', { mouseButtonMask: 4 });
+  csTools.setToolActive('Zoom', { mouseButtonMask: 2 });
+  csTools.setToolActive('Wwwc', { mouseButtonMask: 1 });
+  csTools.setToolActive('StackScrollMouseWheel', {}); // TODO: Empty options should not be required
+  csTools.setToolActive('PanMultiTouch', { pointers: 2 }); // TODO: Better error if no options
+  csTools.setToolActive('ZoomTouchPinch', {});
+}

extensions/cornerstone/src/initCornerstoneTools.js

@@ -0,0 +1,27 @@
+import Hammer from 'hammerjs';
+import cornerstone from 'cornerstone-core';
+import cornerstoneMath from 'cornerstone-math';
+import cornerstoneTools from 'cornerstone-tools';
+
+export default function(configuration = {}) {
+  // For debugging
+  window.cornerstoneTools = cornerstoneTools;
+
+  cornerstoneTools.external.cornerstone = cornerstone;
+  cornerstoneTools.external.Hammer = Hammer;
+  cornerstoneTools.external.cornerstoneMath = cornerstoneMath;
+  cornerstoneTools.init(configuration);
+
+  // Set the tool font and font size
+  // context.font = "[style] [variant] [weight] [size]/[line height] [font family]";
+  const fontFamily =
+    'Roboto, OpenSans, HelveticaNeue-Light, Helvetica Neue Light, Helvetica Neue, Helvetica, Arial, Lucida Grande, sans-serif';
+  cornerstoneTools.textStyle.setFont(`16px ${fontFamily}`);
+
+  // Tool styles/colors
+  cornerstoneTools.toolStyle.setToolWidth(2);
+  cornerstoneTools.toolColors.setToolColor('rgb(255, 255, 0)');
+  cornerstoneTools.toolColors.setActiveColor('rgb(0, 255, 0)');
+
+  cornerstoneTools.store.state.touchProximity = 40;
+}

extensions/cornerstone/src/toolbarModule.js

@@ -0,0 +1,233 @@
+// TODO: A way to add Icons that don't already exist?
+// - Register them and add
+// - Include SVG Source/Inline?
+// - By URL, or own component?
+
+// What KINDS of toolbar buttons do we have...
+// - One's that dispatch commands
+// - One's that set tool's active
+// - More custom, like CINE
+//    - Built in for one's like this, or custom components?
+
+// Visible?
+// Disabled?
+// Based on contexts or misc. criteria?
+//  -- ACTIVE_ROUTE::VIEWER
+//  -- ACTIVE_VIEWPORT::CORNERSTONE
+// setToolActive commands should receive the button event that triggered
+// so we can do the "bind to this button" magic
+
+const TOOLBAR_BUTTON_TYPES = {
+  COMMAND: 'command',
+  SET_TOOL_ACTIVE: 'setToolActive',
+  BUILT_IN: 'builtIn',
+};
+
+const definitions = [
+  {
+    id: 'StackScroll',
+    label: 'Stack Scroll',
+    icon: 'bars',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'StackScroll' },
+  },
+  {
+    id: 'Zoom',
+    label: 'Zoom',
+    icon: 'search-plus',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'Zoom' },
+  },
+  {
+    id: 'Wwwc',
+    label: 'Levels',
+    icon: 'level',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'Wwwc' },
+  },
+  {
+    id: 'Pan',
+    label: 'Pan',
+    icon: 'arrows',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'Pan' },
+  },
+  {
+    id: 'Length',
+    label: 'Length',
+    icon: 'measure-temp',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'Length' },
+  },
+  {
+    id: 'ArrowAnnotate',
+    label: 'Annotate',
+    icon: 'measure-non-target',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'ArrowAnnotate' },
+  },
+  {
+    id: 'Angle',
+    label: 'Angle',
+    icon: 'angle-left',
+    //
+    type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+    commandName: 'setToolActive',
+    commandOptions: { toolName: 'Angle' },
+  },
+  {
+    id: 'Reset',
+    label: 'Reset',
+    icon: 'reset',
+    //
+    type: TOOLBAR_BUTTON_TYPES.COMMAND,
+    commandName: 'resetViewport',
+  },
+  {
+    id: 'Cine',
+    label: 'CINE',
+    icon: 'youtube',
+    //
+    type: TOOLBAR_BUTTON_TYPES.BUILT_IN,
+    options: {
+      behavior: 'CINE',
+    },
+  },
+  {
+    id: 'More',
+    label: 'More',
+    icon: 'ellipse-circle',
+    buttons: [
+      {
+        id: 'Magnify',
+        label: 'Magnify',
+        icon: 'circle',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'Magnify' },
+      },
+      {
+        id: 'WwwcRegion',
+        label: 'ROI Window',
+        icon: 'stop',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'WwwcRegion' },
+      },
+      {
+        id: 'DragProbe',
+        label: 'Probe',
+        icon: 'dot-circle',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'DragProbe' },
+      },
+      {
+        id: 'EllipticalRoi',
+        label: 'Ellipse',
+        icon: 'circle-o',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'EllipticalRoi' },
+      },
+      {
+        id: 'RectangleRoi',
+        label: 'Rectangle',
+        icon: 'square-o',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'RectangleRoi' },
+      },
+      {
+        id: 'Invert',
+        label: 'Invert',
+        icon: 'adjust',
+        //
+        type: TOOLBAR_BUTTON_TYPES.COMMAND,
+        commandName: 'invertViewport',
+      },
+      {
+        id: 'RotateRight',
+        label: 'Rotate Right',
+        icon: 'rotate-right',
+        //
+        type: TOOLBAR_BUTTON_TYPES.COMMAND,
+        commandName: 'rotateViewportCW',
+      },
+      {
+        id: 'FlipH',
+        label: 'Flip H',
+        icon: 'ellipse-h',
+        //
+        type: TOOLBAR_BUTTON_TYPES.COMMAND,
+        commandName: 'flipViewportHorizontal',
+      },
+      {
+        id: 'FlipV',
+        label: 'Flip V',
+        icon: 'ellipse-v',
+        //
+        type: TOOLBAR_BUTTON_TYPES.COMMAND,
+        commandName: 'flipViewportVertical',
+      },
+      {
+        id: 'Clear',
+        label: 'Clear',
+        icon: 'trash',
+        //
+        type: TOOLBAR_BUTTON_TYPES.COMMAND,
+        commandName: 'clearAnnotations',
+      },
+      {
+        id: 'Bidirectional',
+        label: 'Bidirectional',
+        icon: 'measure-target',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'Bidirectional' },
+      },
+      {
+        id: 'Eraser',
+        label: 'Eraser',
+        icon: 'eraser',
+        //
+        type: TOOLBAR_BUTTON_TYPES.SET_TOOL_ACTIVE,
+        commandName: 'setToolActive',
+        commandOptions: { toolName: 'Eraser' },
+      },
+      {
+        id: 'Download',
+        label: 'Download',
+        icon: 'create-screen-capture',
+        //
+        type: TOOLBAR_BUTTON_TYPES.BUILT_IN,
+        options: {
+          behavior: 'DOWNLOAD_SCREEN_SHOT',
+        },
+      },
+    ],
+  },
+];
+
+export default {
+  definitions,
+  defaultContext: 'ACTIVE_VIEWPORT::CORNERSTONE',
+};

extensions/dicom-html/.webpack/webpack.dev.js

@@ -0,0 +1,8 @@
+const path = require('path');
+const webpackCommon = require('./../../../.webpack/webpack.commonjs.js');
+const SRC_DIR = path.join(__dirname, '../src');
+const DIST_DIR = path.join(__dirname, '../dist');
+
+module.exports = (env, argv) => {
+  return webpackCommon(env, argv, { SRC_DIR, DIST_DIR });
+};