diff --git a/.circleci/config.yml b/.circleci/config.yml
index ad4274d..41dbc00 100644
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -1,38 +1,52 @@
-version: 2
-jobs:
-  build:
-    working_directory: ~/datavisyn
+version: 2.1
+
+executors:
+  node-executor:
+    working_directory: ~/phovea
     docker:
       - image: circleci/node:12.13-buster-browsers
+
+jobs:
+  build:
+    executor: node-executor
     steps:
       - checkout
+      - run:
+          name: Show Node.js and npm version
+          command: |
+            node -v
+            npm -v
       - restore_cache:
-          key: deps3-{{ .Branch }}-{{ checksum "package.json" }}
+          key: deps1-{{ .Branch }}-{{ checksum "package.json" }}
       - run:
-          name: install-npm-wee
+          name: Install npm dependencies
           command: npm install
       - save_cache:
-          key: deps3-{{ .Branch }}-{{ checksum "package.json" }}
-          paths:
-          - ./node_modules
+          key: deps1-{{ .Branch }}-{{ checksum "package.json" }}
+          paths: ./node_modules
       - run:
-          name: dist
+          name: Show installed npm dependencies
+          command: npm list --depth=1 || true
+      - run:
+          name: Build
           command: npm run dist
       - store_artifacts:
           path: dist
 workflows:
-  version: 2
-  build-branch:
-    jobs:
-      - build:
-          filters:
-            tags:
-              ignore: /^v.*/
-  build-tag:
+  version: 2.1
+#  build-nightly:
+#    triggers:
+#      - schedule:
+#          cron: "15 1 * * 1-5" # "At 01:15 on every day-of-week from Monday through Friday.”, see: https://crontab.guru/#15_1_*_*_1-5
+#          filters:
+#            branches:
+#              only:
+#                - develop
+#    jobs:
+#      - build
+  build-branches-and-tags:
     jobs:
       - build:
           filters:
-            branches:
-              ignore: /.*/
             tags:
-              only: /^v.*/
+              only: /.*/        
diff --git a/.gitattributes b/.gitattributes
index 544c336..711da28 100644
--- a/.gitattributes
+++ b/.gitattributes
@@ -125,3 +125,10 @@ AUTHORS text
 # with the python modules ``pickle``, ``dbm.*``,
 # ``shelve``, ``marshal``, ``anydbm``, & ``bsddb``
 # (among others).
+
+
+# Mark compiled files as generated to hide them in PRs
+/dist/** linguist-generated=true
+
+# Hide compiled files from git diff and auto-replace them when merging different branches
+/dist/** -diff -merge
diff --git a/.gitignore b/.gitignore
index a6f2959..815fb66 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,6 +1,7 @@
 /.tscache
 /.idea
 /lib/
+/dist/tsBuildInfoFile
 /build/
 /tmp
 /.bower.json
diff --git a/dist/scss/abstracts/_mixins.scss b/dist/scss/abstracts/_mixins.scss
new file mode 100644
index 0000000..836bd08
--- /dev/null
+++ b/dist/scss/abstracts/_mixins.scss
@@ -0,0 +1,5 @@
+@mixin abspos() {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
diff --git a/dist/scss/abstracts/_variables.scss b/dist/scss/abstracts/_variables.scss
new file mode 100644
index 0000000..9fc22f7
--- /dev/null
+++ b/dist/scss/abstracts/_variables.scss
@@ -0,0 +1,2 @@
+
+$ds_css: datavisyn-scatterplot !default;
\ No newline at end of file
diff --git a/dist/scss/base/_base.scss b/dist/scss/base/_base.scss
new file mode 100644
index 0000000..a23dbc5
--- /dev/null
+++ b/dist/scss/base/_base.scss
@@ -0,0 +1,129 @@
+/**
+ * Created by sam on 28.10.2016.
+ */
+
+.#{$ds_css} {
+    position: relative;
+
+    &.xy-zoomed {
+        cursor: all-scroll;
+    }
+
+    &.x-zoomed {
+        cursor: ew-resize;
+    }
+
+    &.y-zoomed {
+        cursor: ns-resize;
+    }
+
+    canvas {
+        @include abspos();
+
+        &.#{$ds_css}-data-layer {
+            pointer-events: none;
+            z-index: 1;
+        }
+
+        &.#{$ds_css}-selection-layer {
+            z-index: 2;
+        }
+    }
+
+    svg {
+        pointer-events: none;
+        @include abspos();
+
+        &.#{$ds_css}-axis-left {
+            z-index: 2;
+        }
+
+        &.#{$ds_css}-axis-bottom {
+            bottom: 0;
+            z-index: 3;
+        }
+
+        &.#{$ds_css}-axis-right {
+            position: absolute;
+        }
+    }
+
+    div {
+        &.#{$ds_css}-axis-left-label,
+        &.#{$ds_css}-axis-bottom-label,
+        &.#{$ds_css}-axis-right-label {
+            pointer-events: none;
+            user-select: none;
+            text-align: center;
+            position: absolute;
+        }
+
+        &.#{$ds_css}-axis-bottom-label {
+            bottom: 0;
+        }
+
+        &.#{$ds_css}-axis-left-label,
+        &.#{$ds_css}-axis-right-label {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            width: 1em;
+            white-space: nowrap;
+
+            > div {
+                transform: rotate(270deg);
+                transform-origin: center center;
+            }
+        }
+
+        &.#{$ds_css}-draw-area {
+            position: absolute;
+            user-select: none;
+            z-index: 3;
+        }
+    }
+
+    /*
+    * similar to bootstrap tooltip
+    */
+
+    .#{$ds_css}-tooltip {
+        display: none;
+        position: absolute;
+        width: auto;
+        height: auto;
+        z-index: 4;
+        padding: 5px 0;
+
+        > :first-child {
+            padding: 3px 8px;
+            color: #fff;
+            text-align: center;
+            background-color: #000;
+            border-radius: 4px;
+        }
+
+        > :last-child {
+            margin-left: -5px;
+            border-width: 5px 5px 0;
+            border-style: solid;
+            border-color: transparent;
+            border-top-color: #000;
+            position: absolute;
+            bottom: 0;
+            left: 50%;
+            width: 0;
+            height: 0;
+        }
+    }
+}
+
+.#{$ds_css}-minimap {
+    position: relative;
+    background-color: gray;
+
+    svg {
+        width: 100%;
+        height: 100%;
+    }
+}
diff --git a/dist/scss/main.scss b/dist/scss/main.scss
index 2d35762..fe19d62 100644
--- a/dist/scss/main.scss
+++ b/dist/scss/main.scss
@@ -1,137 +1,4 @@
-/**
- * Created by sam on 28.10.2016.
- */
+@import './abstracts/variables';
+@import './abstracts/mixins';
 
-@mixin abspos() {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-}
-
-$ds_css: datavisyn-scatterplot;
-
-.#{$ds_css} {
-  position: relative;
-
-  &.xy-zoomed {
-    cursor: all-scroll;
-  }
-
-  &.x-zoomed {
-    cursor: ew-resize;
-  }
-
-  &.y-zoomed {
-    cursor: ns-resize;
-  }
-
-  canvas {
-    @include abspos();
-
-    &.#{$ds_css}-data-layer {
-      pointer-events: none;
-      z-index: 1;
-    }
-
-    &.#{$ds_css}-selection-layer {
-      z-index: 2;
-    }
-  }
-
-  svg {
-    pointer-events: none;
-    @include abspos();
-
-    &.#{$ds_css}-axis-left {
-      z-index: 2;
-    }
-
-    &.#{$ds_css}-axis-bottom {
-      bottom: 0;
-      z-index: 3;
-    }
-
-    &.#{$ds_css}-axis-right {
-      position: absolute;
-    }
-  }
-
-  div {
-    &.#{$ds_css}-axis-left-label,
-    &.#{$ds_css}-axis-bottom-label,
-    &.#{$ds_css}-axis-right-label {
-      pointer-events: none;
-      user-select: none;
-      text-align: center;
-      position: absolute;
-    }
-
-    &.#{$ds_css}-axis-bottom-label {
-      bottom: 0;
-    }
-
-    &.#{$ds_css}-axis-left-label,
-    &.#{$ds_css}-axis-right-label {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      width: 1em;
-      white-space: nowrap;
-
-      > div {
-        transform: rotate(270deg);
-        transform-origin: center center;
-      }
-    }
-
-    &.#{$ds_css}-draw-area {
-      position: absolute;
-      user-select: none;
-      z-index: 3;
-    }
-  }
-
-  /*
-   * similar to bootstrap tooltip
-   */
-
-  .#{$ds_css}-tooltip {
-    display: none;
-    position: absolute;
-    width: auto;
-    height: auto;
-    z-index: 4;
-    padding: 5px 0;
-
-    > :first-child {
-      padding: 3px 8px;
-      color: #fff;
-      text-align: center;
-      background-color: #000;
-      border-radius: 4px;
-    }
-
-    > :last-child {
-      margin-left: -5px;
-      border-width: 5px 5px 0;
-      border-style: solid;
-      border-color: transparent;
-      border-top-color: #000;
-      position: absolute;
-      bottom: 0;
-      left: 50%;
-      width: 0;
-      height: 0;
-    }
-  }
-}
-
-.#{$ds_css}-minimap {
-  position: relative;
-  background-color: gray;
-
-  svg {
-    width: 100%;
-    height: 100%;
-  }
-}
+@import './base/base';
diff --git a/jest.config.js b/jest.config.js
index 93a59cc..5e98f15 100644
--- a/jest.config.js
+++ b/jest.config.js
@@ -37,7 +37,7 @@ module.exports = {
     "__VERSION__": "TEST_VERSION",
     "__APP_CONTEXT__": "TEST_CONTEXT",
     // has to be set to true, otherwise i18n import fails
-    "tsConfig": {
+    "tsconfig": {
       "esModuleInterop": true
     }
   },
diff --git a/package.json b/package.json
index 38c14d2..26e7792 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "datavisyn-scatterplot",
-  "version": "3.0.0",
+  "version": "4.0.0",
   "description": "a canvas based scatterplot implementation",
   "homepage": "https://datavisyn.io",
   "author": {
@@ -67,16 +67,16 @@
     "@types/d3-scale": "^2.0.1",
     "@types/d3-shape": "^1.2.3",
     "@types/d3-zoom": "^1.7.1",
-    "@types/jest": "~26.0.5",
+    "@types/jest": "~26.0.20",
     "identity-obj-proxy": "~3.0.0",
-    "jest": "~26.1.0",
+    "jest": "~26.6.3",
     "jest-raw-loader": "~1.0.1",
     "rimraf": "~3.0.2",
-    "shx": "~0.3.2",
-    "ts-jest": "~26.1.3",
-    "tslib": "~2.0.0",
+    "shx": "~0.3.3",
+    "ts-jest": "~26.4.4",
+    "tslib": "~2.0.3",
     "tslint": "~5.20.1",
-    "typedoc": "~0.17.8",
+    "typedoc": "~0.19.2",
     "typescript": "~3.9.7"
   },
   "dependencies": {
@@ -91,6 +91,6 @@
     "d3-selection": "^1.3.0",
     "d3-shape": "^1.2.0",
     "d3-zoom": "^1.7.1",
-    "eventemitter3": "3.0.1"
+    "eventemitter3": "^4.0.7"
   }
 }
diff --git a/src/scss/abstracts/_mixins.scss b/src/scss/abstracts/_mixins.scss
new file mode 100644
index 0000000..836bd08
--- /dev/null
+++ b/src/scss/abstracts/_mixins.scss
@@ -0,0 +1,5 @@
+@mixin abspos() {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+}
diff --git a/src/scss/abstracts/_variables.scss b/src/scss/abstracts/_variables.scss
new file mode 100644
index 0000000..9fc22f7
--- /dev/null
+++ b/src/scss/abstracts/_variables.scss
@@ -0,0 +1,2 @@
+
+$ds_css: datavisyn-scatterplot !default;
\ No newline at end of file
diff --git a/src/scss/base/_base.scss b/src/scss/base/_base.scss
new file mode 100644
index 0000000..a23dbc5
--- /dev/null
+++ b/src/scss/base/_base.scss
@@ -0,0 +1,129 @@
+/**
+ * Created by sam on 28.10.2016.
+ */
+
+.#{$ds_css} {
+    position: relative;
+
+    &.xy-zoomed {
+        cursor: all-scroll;
+    }
+
+    &.x-zoomed {
+        cursor: ew-resize;
+    }
+
+    &.y-zoomed {
+        cursor: ns-resize;
+    }
+
+    canvas {
+        @include abspos();
+
+        &.#{$ds_css}-data-layer {
+            pointer-events: none;
+            z-index: 1;
+        }
+
+        &.#{$ds_css}-selection-layer {
+            z-index: 2;
+        }
+    }
+
+    svg {
+        pointer-events: none;
+        @include abspos();
+
+        &.#{$ds_css}-axis-left {
+            z-index: 2;
+        }
+
+        &.#{$ds_css}-axis-bottom {
+            bottom: 0;
+            z-index: 3;
+        }
+
+        &.#{$ds_css}-axis-right {
+            position: absolute;
+        }
+    }
+
+    div {
+        &.#{$ds_css}-axis-left-label,
+        &.#{$ds_css}-axis-bottom-label,
+        &.#{$ds_css}-axis-right-label {
+            pointer-events: none;
+            user-select: none;
+            text-align: center;
+            position: absolute;
+        }
+
+        &.#{$ds_css}-axis-bottom-label {
+            bottom: 0;
+        }
+
+        &.#{$ds_css}-axis-left-label,
+        &.#{$ds_css}-axis-right-label {
+            display: flex;
+            justify-content: center;
+            align-items: center;
+            width: 1em;
+            white-space: nowrap;
+
+            > div {
+                transform: rotate(270deg);
+                transform-origin: center center;
+            }
+        }
+
+        &.#{$ds_css}-draw-area {
+            position: absolute;
+            user-select: none;
+            z-index: 3;
+        }
+    }
+
+    /*
+    * similar to bootstrap tooltip
+    */
+
+    .#{$ds_css}-tooltip {
+        display: none;
+        position: absolute;
+        width: auto;
+        height: auto;
+        z-index: 4;
+        padding: 5px 0;
+
+        > :first-child {
+            padding: 3px 8px;
+            color: #fff;
+            text-align: center;
+            background-color: #000;
+            border-radius: 4px;
+        }
+
+        > :last-child {
+            margin-left: -5px;
+            border-width: 5px 5px 0;
+            border-style: solid;
+            border-color: transparent;
+            border-top-color: #000;
+            position: absolute;
+            bottom: 0;
+            left: 50%;
+            width: 0;
+            height: 0;
+        }
+    }
+}
+
+.#{$ds_css}-minimap {
+    position: relative;
+    background-color: gray;
+
+    svg {
+        width: 100%;
+        height: 100%;
+    }
+}
diff --git a/src/scss/main.scss b/src/scss/main.scss
index 2d35762..fe19d62 100644
--- a/src/scss/main.scss
+++ b/src/scss/main.scss
@@ -1,137 +1,4 @@
-/**
- * Created by sam on 28.10.2016.
- */
+@import './abstracts/variables';
+@import './abstracts/mixins';
 
-@mixin abspos() {
-  position: absolute;
-  width: 100%;
-  height: 100%;
-}
-
-$ds_css: datavisyn-scatterplot;
-
-.#{$ds_css} {
-  position: relative;
-
-  &.xy-zoomed {
-    cursor: all-scroll;
-  }
-
-  &.x-zoomed {
-    cursor: ew-resize;
-  }
-
-  &.y-zoomed {
-    cursor: ns-resize;
-  }
-
-  canvas {
-    @include abspos();
-
-    &.#{$ds_css}-data-layer {
-      pointer-events: none;
-      z-index: 1;
-    }
-
-    &.#{$ds_css}-selection-layer {
-      z-index: 2;
-    }
-  }
-
-  svg {
-    pointer-events: none;
-    @include abspos();
-
-    &.#{$ds_css}-axis-left {
-      z-index: 2;
-    }
-
-    &.#{$ds_css}-axis-bottom {
-      bottom: 0;
-      z-index: 3;
-    }
-
-    &.#{$ds_css}-axis-right {
-      position: absolute;
-    }
-  }
-
-  div {
-    &.#{$ds_css}-axis-left-label,
-    &.#{$ds_css}-axis-bottom-label,
-    &.#{$ds_css}-axis-right-label {
-      pointer-events: none;
-      user-select: none;
-      text-align: center;
-      position: absolute;
-    }
-
-    &.#{$ds_css}-axis-bottom-label {
-      bottom: 0;
-    }
-
-    &.#{$ds_css}-axis-left-label,
-    &.#{$ds_css}-axis-right-label {
-      display: flex;
-      justify-content: center;
-      align-items: center;
-      width: 1em;
-      white-space: nowrap;
-
-      > div {
-        transform: rotate(270deg);
-        transform-origin: center center;
-      }
-    }
-
-    &.#{$ds_css}-draw-area {
-      position: absolute;
-      user-select: none;
-      z-index: 3;
-    }
-  }
-
-  /*
-   * similar to bootstrap tooltip
-   */
-
-  .#{$ds_css}-tooltip {
-    display: none;
-    position: absolute;
-    width: auto;
-    height: auto;
-    z-index: 4;
-    padding: 5px 0;
-
-    > :first-child {
-      padding: 3px 8px;
-      color: #fff;
-      text-align: center;
-      background-color: #000;
-      border-radius: 4px;
-    }
-
-    > :last-child {
-      margin-left: -5px;
-      border-width: 5px 5px 0;
-      border-style: solid;
-      border-color: transparent;
-      border-top-color: #000;
-      position: absolute;
-      bottom: 0;
-      left: 50%;
-      width: 0;
-      height: 0;
-    }
-  }
-}
-
-.#{$ds_css}-minimap {
-  position: relative;
-  background-color: gray;
-
-  svg {
-    width: 100%;
-    height: 100%;
-  }
-}
+@import './base/base';
diff --git a/tsconfig.json b/tsconfig.json
index e7bc9b2..2e06f21 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -16,7 +16,9 @@
     "esModuleInterop": false,
     "resolveJsonModule": true,
     "allowSyntheticDefaultImports": true,
-    "preserveWatchOutput": true
+    "preserveWatchOutput": true,
+    "incremental": true,
+    "tsBuildInfoFile": "dist/tsBuildInfoFile"
   },
   "include": [
     "src/**/*.ts",