Merge pull request #111 from qlik-oss/tsm/rename-pkg

chore: rename package
fix: build and verification
2023-11-16 08:45:00 +01:00 · 2023-11-16 08:42:44 +01:00 · 2023-11-16 08:37:35 +01:00 · 2023-11-16 08:36:50 +01:00 · 2023-07-08 12:51:05 +00:00 · 2022-11-14 14:03:28 +01:00
29 changed files with 1028 additions and 1155 deletions
--- a/.circleci/config.yml
+++ b/.circleci/config.yml
@@ -3,7 +3,7 @@ version: 2
 defaults: &defaults
  working_directory: ~/qlik-smart-pivot
  docker:
-    - image: circleci/node:stretch
+    - image: circleci/node:16.13.0
  environment:
    GITHUB_ORG: "qlik-oss"
    GITHUB_REPO: "PLSmartPivot"
@@ -12,20 +12,12 @@ defaults: &defaults
 jobs:
  test:
    docker:
-    - image: circleci/node:stretch-browsers
+    - image: circleci/node:16.13.0-browsers
    steps:
      - checkout
      - run:
          name: Install dependencies
          command: npm install
-      - run:
-          name: BlackDuck scan
-          command: curl -s https://blackducksoftware.github.io/hub-detect/hub-detect.sh | bash -s -- \
-            --blackduck.url="https://qliktech.blackducksoftware.com" \
-            --blackduck.trust.cert=true \
-            --blackduck.username="svc-blackduck" \
-            --blackduck.password=${svc_blackduck} \
-            --detect.project.name="viz-bundle-qlik-smart-pivot"

  bump-version:
    <<: *defaults
@@ -43,6 +35,10 @@ jobs:
    <<: *defaults
    steps:
      - checkout
+      - run:
+          name: Setup environment
+          command: |
+           sudo chmod +x ./.circleci/upgrade-node.sh
      - attach_workspace:
          at: ~/qlik-smart-pivot
      - run:
--- a/.circleci/upgrade-node.sh
+++ b/.circleci/upgrade-node.sh
@@ -0,0 +1,17 @@
+#!/bin/bash
+
+set -eo pipefail
+
+NVM_DIR="/opt/circleci/.nvm"
+NODE_VERSION="v16"
+
+curl -o-  https://raw.githubusercontent.com/nvm-sh/nvm/v0.38.0/install.sh | bash
+[ -s "$NVM_DIR/nvm.sh" ] && \. "$NVM_DIR/nvm.sh"
+
+echo "Installing Node $NODE_VERSION"
+nvm install $NODE_VERSION
+nvm alias default $NODE_VERSION
+
+# Each step uses the same `$BASH_ENV`, so need to modify it
+echo 'export NVM_DIR="/opt/circleci/.nvm"' >> $BASH_ENV
+echo "[ -s \"$NVM_DIR/nvm.sh\" ] && . \"$NVM_DIR/nvm.sh\"" >> $BASH_ENV
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -3,15 +3,15 @@ module.exports = {
    ecmaVersion: 6,
    ecmaFeatures: {
      jsx: true,
-      modules: true
+      modules: true,
    },
-    sourceType: "module"
+    sourceType: "module",
  },
  parser: "babel-eslint",
  env: {
    browser: true,
    es6: true,
-    node: true
+    node: true,
  },
  globals: {
    angular: false,
@@ -21,49 +21,63 @@ module.exports = {
    document: false,
    expect: false,
    it: false,
-    require: false
+    require: false,
  },
  rules: {
-    "indent": ["error", 2, { "SwitchCase": 1 }],
+    indent: ["warn", 2, { SwitchCase: 1 }],
    "linebreak-style": ["error", "unix"],
    "object-curly-spacing": ["error", "always"],
    "max-lines": ["warn", 300],
-    "max-len": ["warn", { "code": 120, "ignoreComments": true, "ignoreTrailingComments": false }],
+    "max-len": [
+      "warn",
+      { code: 120, ignoreComments: true, ignoreTrailingComments: false },
+    ],
    "no-console": ["warn"],
-    "no-mixed-operators": ["warn", {
-      "groups": [
-        ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
-        ["&&", "||"],
-        ["in", "instanceof"]
-      ],
-      "allowSamePrecedence": true
-    }],
+    "no-mixed-operators": [
+      "warn",
+      {
+        groups: [
+          ["==", "!=", "===", "!==", ">", ">=", "<", "<="],
+          ["&&", "||"],
+          ["in", "instanceof"],
+        ],
+        allowSamePrecedence: true,
+      },
+    ],
+    "comma-dangle": ["off"],
+    "space-before-function-paren": ["off"],
    "no-multi-spaces": ["error"],
    "no-cond-assign": ["warn"],
    "no-fallthrough": ["warn"],
    "no-undef": ["error"],
    "no-unused-vars": ["error"],
-    "no-use-before-define": ["error", { "functions": false, "classes": false, "variables": false }],
+    "no-use-before-define": [
+      "error",
+      { functions: false, classes: false, variables: false },
+    ],
    "no-useless-escape": ["warn"],
    "no-useless-return": ["warn"],
-    "no-underscore-dangle": ["warn", { "allow": ["_id"] }],
+    "no-underscore-dangle": ["warn", { allow: ["_id"] }],
    "no-redeclare": ["error"],
    "no-restricted-syntax": ["warn"],
    "operator-linebreak": ["warn", "before"],
    "prefer-promise-reject-errors": ["warn"],
-    "padded-blocks": ["warn", { "blocks": "never", "switches": "never", "classes": "never" }],
-    "semi": ["error", "always"],
+    "padded-blocks": [
+      "warn",
+      { blocks: "never", switches: "never", classes: "never" },
+    ],
+    semi: ["error", "always"],
    "valid-typeof": ["warn"],
    "no-eval": ["error"],
    "no-implied-eval": ["error"],
    "no-debugger": ["warn"],
    "no-unreachable": ["warn"],
-    "quotes": ["warn", "single", { "avoidEscape": true }],
+    quotes: ["warn", "single", { avoidEscape: true }],
    "sort-imports": ["off"],
    "max-lines-per-function": ["off"], // marks the entire functions, a bit too noisy
-    "complexity": ["warn"],
-    "camelcase": ["warn"],
-    "max-statements": ["off"],  // marks the entire functions, a bit too noisy
+    complexity: ["warn"],
+    camelcase: ["warn"],
+    "max-statements": ["off"], // marks the entire functions, a bit too noisy
    "sort-vars": ["off"], // not much value for the work
    "init-declarations": ["off"],
    "capitalized-comments": ["off"],
@@ -99,13 +113,13 @@ module.exports = {
    "array-bracket-newline": ["warn"],
    "array-element-newline": ["warn"],
    "object-shorthand": ["warn"],
-    "eqeqeq": ["warn"],
+    eqeqeq: ["warn"],
    "no-empty-function": ["off"],
    "function-paren-newline": ["warn"],
    "no-invalid-this": ["warn"],
    "newline-per-chained-call": ["warn"],
    "no-unused-expressions": ["warn"],
-    "strict": ["warn"],
+    strict: ["warn"],
    "no-ternary": ["off"],
    "multiline-ternary": ["off"],
    "no-param-reassign": ["error"],
@@ -115,9 +129,9 @@ module.exports = {
    "default-case": ["warn"],
    "no-alert": ["warn"],
    "max-params": ["warn"],
-    "brace-style": ["warn", "1tbs", { "allowSingleLine": true }],
+    "brace-style": ["warn", "1tbs", { allowSingleLine: true }],
    "prefer-const": ["warn"],
-    "class-methods-use-this":["warn"],
+    "class-methods-use-this": ["warn"],
    // plugin:react
    "react/jsx-indent": ["warn", 2],
    "react/jsx-indent-props": ["warn", 2],
@@ -131,10 +145,7 @@ module.exports = {
    "react/jsx-max-depth": ["off"], // rule throws exception in single-dimension-measure
    "react/jsx-filename-extension": ["warn"],
    "react/prefer-stateless-function": ["warn"],
-    "react/no-set-state": ["warn"]
+    "react/no-set-state": ["warn"],
  },
-  extends: [
-    "eslint:all",
-    "plugin:react/all"
-  ]
-}
+  extends: ["eslint:all", "plugin:react/all"],
+};
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -0,0 +1,3 @@
+{
+    "json.format.enable": false
+}
--- a/assets/Excel.png
+++ b/assets/Excel.png
--- a/gulpfile.js
+++ b/gulpfile.js
@@ -9,48 +9,52 @@ var pkg = require('./package.json');
 var DIST = './dist';
 var VERSION = process.env.VERSION || 'local-dev';

-gulp.task('qext', function () {
-	var qext = {
-		name: 'P&L pivot',
-		type: 'visualization',
-		description: pkg.description + '\nVersion: ' + VERSION,
-		version: VERSION,
-		icon: 'pivot-table',
-		preview: 'qlik-smart-pivot.png',
-		keywords: 'qlik-sense, visualization',
-		author: pkg.author,
-		homepage: pkg.homepage,
-		license: pkg.license,
-		repository: pkg.repository,
-		dependencies: {
-			'qlik-sense': '>=5.5.x'
-		}
-	};
-	if (pkg.contributors) {
-		qext.contributors = pkg.contributors;
-	}
-	var src = require('stream').Readable({
-		objectMode: true
-	});
-	src._read = function () {
-		this.push(new gutil.File({
-			cwd: '',
-			base: '',
-			path: pkg.name + '.qext',
-			contents: Buffer.from(JSON.stringify(qext, null, 4))
-		}));
-		this.push(null);
-	};
-	return src.pipe(gulp.dest(DIST));
+gulp.task("qext", function () {
+  var qext = {
+    name: "P&L pivot",
+    type: "visualization",
+    description: pkg.description + "\nVersion: " + VERSION,
+    version: VERSION,
+    icon: "pivot-table",
+    preview: "qlik-smart-pivot.png",
+    keywords: "qlik-sense, visualization",
+    author: pkg.author,
+    homepage: pkg.homepage,
+    license: pkg.license,
+    repository: pkg.repository,
+    dependencies: {
+      "qlik-sense": ">=5.5.x",
+    },
+    __next: true,
+  };
+  if (pkg.contributors) {
+    qext.contributors = pkg.contributors;
+  }
+  var src = require("stream").Readable({
+    objectMode: true,
+  });
+  src._read = function () {
+    this.push(
+      new gutil.File({
+        cwd: "",
+        base: "",
+        path: "qlik-smart-pivot.qext",
+        contents: Buffer.from(JSON.stringify(qext, null, 4)),
+      })
+    );
+    this.push(null);
+  };
+  return src.pipe(gulp.dest(DIST));
 });

-gulp.task('clean', function(){
+gulp.task("clean", function () {
  return del([DIST], { force: true });
 });

-gulp.task('zip-build', function(){
-  return gulp.src(DIST + '/**/*')
-    .pipe(zip(`${pkg.name}_${VERSION}.zip`))
+gulp.task("zip-build", function () {
+  return gulp
+    .src(DIST + "/**/*")
+    .pipe(zip(`qlik-smart-pivot_${VERSION}.zip`))
    .pipe(gulp.dest(DIST));
 });

--- a/package-lock.json
+++ b/package-lock.json
@@ -1417,23 +1417,6 @@
      "integrity": "sha1-iYUI2iIm84DfkEcoRWhJwVAaSw0=",
      "dev": true
    },
-    "asap": {
-      "version": "2.0.6",
-      "resolved": "https://registry.npmjs.org/asap/-/asap-2.0.6.tgz",
-      "integrity": "sha1-5QNHYR1+aQlDIIu9r+vLwvuGbUY=",
-      "dev": true,
-      "optional": true
-    },
-    "asn1": {
-      "version": "0.2.4",
-      "resolved": "https://registry.npmjs.org/asn1/-/asn1-0.2.4.tgz",
-      "integrity": "sha512-jxwzQpLQjSmWXgwaCZE9Nz+glAG01yF1QnWgbhGwHI5A6FRIEY6IVqtHhIepHqI7/kyEyQEagBC5mBEFlIYvdg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "safer-buffer": "~2.1.0"
-      }
-    },
    "asn1.js": {
      "version": "4.10.1",
      "resolved": "https://registry.npmjs.org/asn1.js/-/asn1.js-4.10.1.tgz",
@@ -1462,7 +1445,7 @@
        },
        "util": {
          "version": "0.10.3",
-          "resolved": "http://registry.npmjs.org/util/-/util-0.10.3.tgz",
+          "resolved": "https://registry.npmjs.org/util/-/util-0.10.3.tgz",
          "integrity": "sha1-evsa/lCAUkZInj23/g7TeTNqwPk=",
          "dev": true,
          "requires": {
@@ -1471,12 +1454,6 @@
        }
      }
    },
-    "assert-plus": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/assert-plus/-/assert-plus-1.0.0.tgz",
-      "integrity": "sha1-8S4PPF13sLHN2RRpQuTpbB5N1SU=",
-      "dev": true
-    },
    "assign-symbols": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/assign-symbols/-/assign-symbols-1.0.0.tgz",
@@ -1524,13 +1501,6 @@
        "async-done": "^1.2.2"
      }
    },
-    "asynckit": {
-      "version": "0.4.0",
-      "resolved": "https://registry.npmjs.org/asynckit/-/asynckit-0.4.0.tgz",
-      "integrity": "sha1-x57Zf380y48robyXkLzDZkdLS3k=",
-      "dev": true,
-      "optional": true
-    },
    "atob": {
      "version": "2.1.2",
      "resolved": "https://registry.npmjs.org/atob/-/atob-2.1.2.tgz",
@@ -1563,20 +1533,6 @@
        }
      }
    },
-    "aws-sign2": {
-      "version": "0.7.0",
-      "resolved": "https://registry.npmjs.org/aws-sign2/-/aws-sign2-0.7.0.tgz",
-      "integrity": "sha1-tG6JCTSpWR8tL2+G1+ap8bP+dqg=",
-      "dev": true,
-      "optional": true
-    },
-    "aws4": {
-      "version": "1.8.0",
-      "resolved": "https://registry.npmjs.org/aws4/-/aws4-1.8.0.tgz",
-      "integrity": "sha512-ReZxvNHIOv88FlT7rxcXIIC0fPt4KZqZbOlivyWtXLt8ESx84zd3kMC6iK5jVeS2qt+g7ftS7ye4fi06X5rtRQ==",
-      "dev": true,
-      "optional": true
-    },
    "babel-code-frame": {
      "version": "6.26.0",
      "resolved": "https://registry.npmjs.org/babel-code-frame/-/babel-code-frame-6.26.0.tgz",
@@ -1596,7 +1552,7 @@
        },
        "chalk": {
          "version": "1.1.3",
-          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
          "dev": true,
          "requires": {
@@ -1737,16 +1693,6 @@
      "integrity": "sha512-ccav/yGvoa80BQDljCxsmmQ3Xvx60/UpBIij5QN21W3wBi/hhIC9OoO+KLpu9IJTS9j4DRVJ3aDDF9cMSoa2lw==",
      "dev": true
    },
-    "bcrypt-pbkdf": {
-      "version": "1.0.2",
-      "resolved": "https://registry.npmjs.org/bcrypt-pbkdf/-/bcrypt-pbkdf-1.0.2.tgz",
-      "integrity": "sha1-pDAdOJtqQ/m2f/PKEaP2Y342Dp4=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "tweetnacl": "^0.14.3"
-      }
-    },
    "beeper": {
      "version": "1.1.1",
      "resolved": "https://registry.npmjs.org/beeper/-/beeper-1.1.1.tgz",
@@ -2041,13 +1987,6 @@
      "integrity": "sha512-D6J9jloPm2MPkg0PXcODLMQAJKkeixKO9xhqTUMvtd44MtTYMyyDXPQ2Lk9IgBq5FH0frwiPa/N/w8ncQf7kIQ==",
      "dev": true
    },
-    "caseless": {
-      "version": "0.12.0",
-      "resolved": "https://registry.npmjs.org/caseless/-/caseless-0.12.0.tgz",
-      "integrity": "sha1-G2gcIf+EAzyCZUMJBolCDRhxUdw=",
-      "dev": true,
-      "optional": true
-    },
    "ccount": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/ccount/-/ccount-1.0.3.tgz",
@@ -2325,15 +2264,6 @@
      "integrity": "sha512-qiBjkpbMLO/HL68y+lh4q0/O1MZFj2RX6X/KmMa3+gJD3z+WwI1ZzDHysvqHGS3mP6mznPckpXmw1nI9cJjyRg==",
      "dev": true
    },
-    "combined-stream": {
-      "version": "1.0.7",
-      "resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.7.tgz",
-      "integrity": "sha512-brWl9y6vOB1xYPZcpZde3N9zDByXTosAeMDo4p1wzo6UMOX4vumB+TP1RZ76sfE6Md68Q0NJSrE/gbezd4Ul+w==",
-      "dev": true,
-      "requires": {
-        "delayed-stream": "~1.0.0"
-      }
-    },
    "commander": {
      "version": "2.19.0",
      "resolved": "https://registry.npmjs.org/commander/-/commander-2.19.0.tgz",
@@ -2394,6 +2324,15 @@
        "safe-buffer": "~5.1.1"
      }
    },
+    "copy-anything": {
+      "version": "2.0.6",
+      "resolved": "https://registry.npmjs.org/copy-anything/-/copy-anything-2.0.6.tgz",
+      "integrity": "sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==",
+      "dev": true,
+      "requires": {
+        "is-what": "^3.14.1"
+      }
+    },
    "copy-concurrently": {
      "version": "1.0.5",
      "resolved": "https://registry.npmjs.org/copy-concurrently/-/copy-concurrently-1.0.5.tgz",
@@ -2585,13 +2524,13 @@
      "dependencies": {
        "jsesc": {
          "version": "0.5.0",
-          "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
          "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=",
          "dev": true
        },
        "regexpu-core": {
          "version": "1.0.0",
-          "resolved": "http://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
+          "resolved": "https://registry.npmjs.org/regexpu-core/-/regexpu-core-1.0.0.tgz",
          "integrity": "sha1-hqdj9Y7k18L2sQLkdkBQ3n7ZDGs=",
          "dev": true,
          "requires": {
@@ -2602,13 +2541,13 @@
        },
        "regjsgen": {
          "version": "0.2.0",
-          "resolved": "http://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
+          "resolved": "https://registry.npmjs.org/regjsgen/-/regjsgen-0.2.0.tgz",
          "integrity": "sha1-bAFq3qxVT3WCP+N6wFuS1aTtsfc=",
          "dev": true
        },
        "regjsparser": {
          "version": "0.1.5",
-          "resolved": "http://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
+          "resolved": "https://registry.npmjs.org/regjsparser/-/regjsparser-0.1.5.tgz",
          "integrity": "sha1-fuj4Tcb6eS0/0K4ijSS9lJ6tIFw=",
          "dev": true,
          "requires": {
@@ -2653,16 +2592,6 @@
        "es5-ext": "^0.10.9"
      }
    },
-    "dashdash": {
-      "version": "1.14.1",
-      "resolved": "https://registry.npmjs.org/dashdash/-/dashdash-1.14.1.tgz",
-      "integrity": "sha1-hTz6D3y+L+1d4gMmuN1YEDX24vA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "^1.0.0"
-      }
-    },
    "date-now": {
      "version": "0.1.4",
      "resolved": "https://registry.npmjs.org/date-now/-/date-now-0.1.4.tgz",
@@ -2823,7 +2752,7 @@
        },
        "globby": {
          "version": "3.0.1",
-          "resolved": "http://registry.npmjs.org/globby/-/globby-3.0.1.tgz",
+          "resolved": "https://registry.npmjs.org/globby/-/globby-3.0.1.tgz",
          "integrity": "sha1-IJSvhCHhkVIVDViT62QWsxLZoi8=",
          "dev": true,
          "requires": {
@@ -2837,18 +2766,12 @@
        },
        "pify": {
          "version": "2.3.0",
-          "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
          "dev": true
        }
      }
    },
-    "delayed-stream": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/delayed-stream/-/delayed-stream-1.0.0.tgz",
-      "integrity": "sha1-3zrhmayt+31ECqrgsp4icrJOxhk=",
-      "dev": true
-    },
    "des.js": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/des.js/-/des.js-1.0.0.tgz",
@@ -2913,7 +2836,7 @@
      "dependencies": {
        "domelementtype": {
          "version": "1.1.3",
-          "resolved": "http://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
+          "resolved": "https://registry.npmjs.org/domelementtype/-/domelementtype-1.1.3.tgz",
          "integrity": "sha1-vSh3PiZCiBrsUVRJJCmcXNgiGFs=",
          "dev": true
        }
@@ -2976,7 +2899,7 @@
        },
        "readable-stream": {
          "version": "1.1.14",
-          "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.1.14.tgz",
          "integrity": "sha1-fPTFTvZI44EwhMY23SB54WbAgdk=",
          "dev": true,
          "requires": {
@@ -3016,17 +2939,6 @@
        "object.defaults": "^1.1.0"
      }
    },
-    "ecc-jsbn": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/ecc-jsbn/-/ecc-jsbn-0.1.2.tgz",
-      "integrity": "sha1-OoOpBOVDUyh4dMVkt1SThoSamMk=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "jsbn": "~0.1.0",
-        "safer-buffer": "^2.1.0"
-      }
-    },
    "electron-to-chromium": {
      "version": "1.3.88",
      "resolved": "https://registry.npmjs.org/electron-to-chromium/-/electron-to-chromium-1.3.88.tgz",
@@ -3605,12 +3517,6 @@
        }
      }
    },
-    "extsprintf": {
-      "version": "1.3.0",
-      "resolved": "https://registry.npmjs.org/extsprintf/-/extsprintf-1.3.0.tgz",
-      "integrity": "sha1-lpGEQOMEGnpBT4xS48V06zw+HgU=",
-      "dev": true
-    },
    "fancy-log": {
      "version": "1.3.3",
      "resolved": "https://registry.npmjs.org/fancy-log/-/fancy-log-1.3.3.tgz",
@@ -3794,25 +3700,6 @@
        "for-in": "^1.0.1"
      }
    },
-    "forever-agent": {
-      "version": "0.6.1",
-      "resolved": "https://registry.npmjs.org/forever-agent/-/forever-agent-0.6.1.tgz",
-      "integrity": "sha1-+8cfDEGt6zf5bFd60e1C2P2sypE=",
-      "dev": true,
-      "optional": true
-    },
-    "form-data": {
-      "version": "2.3.3",
-      "resolved": "https://registry.npmjs.org/form-data/-/form-data-2.3.3.tgz",
-      "integrity": "sha512-1lLKB2Mu3aGP1Q/2eCOx0fNbRMe7XdwktwOruhfqqd0rIJWwN4Dh+E3hrPSlDCXnSR7UtZ1N38rVXm+6+MEhJQ==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asynckit": "^0.4.0",
-        "combined-stream": "^1.0.6",
-        "mime-types": "^2.1.12"
-      }
-    },
    "fragment-cache": {
      "version": "0.2.1",
      "resolved": "https://registry.npmjs.org/fragment-cache/-/fragment-cache-0.2.1.tgz",
@@ -3880,7 +3767,8 @@
        "ansi-regex": {
          "version": "2.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "aproba": {
          "version": "1.2.0",
@@ -3901,12 +3789,14 @@
        "balanced-match": {
          "version": "1.0.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "brace-expansion": {
          "version": "1.1.11",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "balanced-match": "^1.0.0",
            "concat-map": "0.0.1"
@@ -3921,17 +3811,20 @@
        "code-point-at": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "concat-map": {
          "version": "0.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "console-control-strings": {
          "version": "1.1.0",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "core-util-is": {
          "version": "1.0.2",
@@ -4048,7 +3941,8 @@
        "inherits": {
          "version": "2.0.3",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "ini": {
          "version": "1.3.5",
@@ -4060,6 +3954,7 @@
          "version": "1.0.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "number-is-nan": "^1.0.0"
          }
@@ -4074,6 +3969,7 @@
          "version": "3.0.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "brace-expansion": "^1.1.7"
          }
@@ -4081,12 +3977,14 @@
        "minimist": {
          "version": "0.0.8",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "minipass": {
          "version": "2.2.4",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "safe-buffer": "^5.1.1",
            "yallist": "^3.0.0"
@@ -4105,6 +4003,7 @@
          "version": "0.5.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "minimist": "0.0.8"
          }
@@ -4185,7 +4084,8 @@
        "number-is-nan": {
          "version": "1.0.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "object-assign": {
          "version": "4.1.1",
@@ -4197,6 +4097,7 @@
          "version": "1.4.0",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "wrappy": "1"
          }
@@ -4282,7 +4183,8 @@
        "safe-buffer": {
          "version": "5.1.1",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "safer-buffer": {
          "version": "2.1.2",
@@ -4318,6 +4220,7 @@
          "version": "1.0.2",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "code-point-at": "^1.0.0",
            "is-fullwidth-code-point": "^1.0.0",
@@ -4337,6 +4240,7 @@
          "version": "3.0.1",
          "bundled": true,
          "dev": true,
+          "optional": true,
          "requires": {
            "ansi-regex": "^2.0.0"
          }
@@ -4380,12 +4284,14 @@
        "wrappy": {
          "version": "1.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        },
        "yallist": {
          "version": "3.0.2",
          "bundled": true,
-          "dev": true
+          "dev": true,
+          "optional": true
        }
      }
    },
@@ -4430,16 +4336,6 @@
      "integrity": "sha1-3BXKHGcjh8p2vTesCjlbogQqLCg=",
      "dev": true
    },
-    "getpass": {
-      "version": "0.1.7",
-      "resolved": "https://registry.npmjs.org/getpass/-/getpass-0.1.7.tgz",
-      "integrity": "sha1-Xv+OPmhNVprkyysSgmBOi6YhSfo=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "^1.0.0"
-      }
-    },
    "glob": {
      "version": "7.1.3",
      "resolved": "https://registry.npmjs.org/glob/-/glob-7.1.3.tgz",
@@ -4699,7 +4595,7 @@
        },
        "chalk": {
          "version": "1.1.3",
-          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
          "dev": true,
          "requires": {
@@ -4780,7 +4676,7 @@
        },
        "chalk": {
          "version": "1.1.3",
-          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
          "dev": true,
          "requires": {
@@ -4799,7 +4695,7 @@
        },
        "readable-stream": {
          "version": "1.0.34",
-          "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
+          "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-1.0.34.tgz",
          "integrity": "sha1-Elgg40vIQtLyqq+v5MKRbuMsFXw=",
          "dev": true,
          "requires": {
@@ -4823,7 +4719,7 @@
        },
        "through2": {
          "version": "0.6.5",
-          "resolved": "http://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
+          "resolved": "https://registry.npmjs.org/through2/-/through2-0.6.5.tgz",
          "integrity": "sha1-QaucZ7KdVyCQcUEOHXp6lozTrUg=",
          "dev": true,
          "requires": {
@@ -4842,24 +4738,6 @@
        "glogg": "^1.0.0"
      }
    },
-    "har-schema": {
-      "version": "2.0.0",
-      "resolved": "https://registry.npmjs.org/har-schema/-/har-schema-2.0.0.tgz",
-      "integrity": "sha1-qUwiJOvKwEeCoNkDVSHyRzW37JI=",
-      "dev": true,
-      "optional": true
-    },
-    "har-validator": {
-      "version": "5.1.3",
-      "resolved": "https://registry.npmjs.org/har-validator/-/har-validator-5.1.3.tgz",
-      "integrity": "sha512-sNvOCzEQNr/qrvJgc3UG/kD4QtlHycrzwS+6mfTrrSq97BvaYcPZZI1ZSqGSPR73Cxn4LKTD4PttRwfU7jWq5g==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "ajv": "^6.5.5",
-        "har-schema": "^2.0.0"
-      }
-    },
    "has": {
      "version": "1.0.3",
      "resolved": "https://registry.npmjs.org/has/-/has-1.0.3.tgz",
@@ -5010,18 +4888,6 @@
        }
      }
    },
-    "http-signature": {
-      "version": "1.2.0",
-      "resolved": "https://registry.npmjs.org/http-signature/-/http-signature-1.2.0.tgz",
-      "integrity": "sha1-muzZJRFHcvPZW2WmCruPfBj7rOE=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "^1.0.0",
-        "jsprim": "^1.2.2",
-        "sshpk": "^1.7.0"
-      }
-    },
    "https-browserify": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
@@ -5073,7 +4939,7 @@
    "image-size": {
      "version": "0.5.5",
      "resolved": "https://registry.npmjs.org/image-size/-/image-size-0.5.5.tgz",
-      "integrity": "sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=",
+      "integrity": "sha512-6TDAlDPZxUFCv+fuOkIoXT/V/f3Qbq8e37p+YOiYrUv3v9cc3/6x78VdfPgFVaB9dZYeLUfKgHRebpkm/oP2VQ==",
      "dev": true,
      "optional": true
    },
@@ -5533,13 +5399,6 @@
        "has-symbols": "^1.0.0"
      }
    },
-    "is-typedarray": {
-      "version": "1.0.0",
-      "resolved": "https://registry.npmjs.org/is-typedarray/-/is-typedarray-1.0.0.tgz",
-      "integrity": "sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=",
-      "dev": true,
-      "optional": true
-    },
    "is-unc-path": {
      "version": "1.0.0",
      "resolved": "https://registry.npmjs.org/is-unc-path/-/is-unc-path-1.0.0.tgz",
@@ -5561,6 +5420,12 @@
      "integrity": "sha1-Kb8+/3Ab4tTTFdusw5vDn+j2Aao=",
      "dev": true
    },
+    "is-what": {
+      "version": "3.14.1",
+      "resolved": "https://registry.npmjs.org/is-what/-/is-what-3.14.1.tgz",
+      "integrity": "sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==",
+      "dev": true
+    },
    "is-whitespace-character": {
      "version": "1.0.2",
      "resolved": "https://registry.npmjs.org/is-whitespace-character/-/is-whitespace-character-1.0.2.tgz",
@@ -5597,13 +5462,6 @@
      "integrity": "sha1-TkMekrEalzFjaqH5yNHMvP2reN8=",
      "dev": true
    },
-    "isstream": {
-      "version": "0.1.2",
-      "resolved": "https://registry.npmjs.org/isstream/-/isstream-0.1.2.tgz",
-      "integrity": "sha1-R+Y/evVa+m+S4VAOaQ64uFKcCZo=",
-      "dev": true,
-      "optional": true
-    },
    "js-base64": {
      "version": "2.4.9",
      "resolved": "https://registry.npmjs.org/js-base64/-/js-base64-2.4.9.tgz",
@@ -5631,12 +5489,6 @@
        "esprima": "^4.0.0"
      }
    },
-    "jsbn": {
-      "version": "0.1.1",
-      "resolved": "https://registry.npmjs.org/jsbn/-/jsbn-0.1.1.tgz",
-      "integrity": "sha1-peZUwuWi3rXyAdls77yoDA7y9RM=",
-      "dev": true
-    },
    "jsesc": {
      "version": "2.5.2",
      "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-2.5.2.tgz",
@@ -5649,13 +5501,6 @@
      "integrity": "sha512-mrqyZKfX5EhL7hvqcV6WG1yYjnjeuYDzDhhcAAUrq8Po85NBQBJP+ZDUT75qZQ98IkUoBqdkExkukOU7Ts2wrw==",
      "dev": true
    },
-    "json-schema": {
-      "version": "0.2.3",
-      "resolved": "https://registry.npmjs.org/json-schema/-/json-schema-0.2.3.tgz",
-      "integrity": "sha1-tIDIkuWaLwWVTOcnvT8qTogvnhM=",
-      "dev": true,
-      "optional": true
-    },
    "json-schema-traverse": {
      "version": "0.4.1",
      "resolved": "https://registry.npmjs.org/json-schema-traverse/-/json-schema-traverse-0.4.1.tgz",
@@ -5677,13 +5522,6 @@
      "integrity": "sha1-nbe1lJatPzz+8wp1FC0tkwrXJlE=",
      "dev": true
    },
-    "json-stringify-safe": {
-      "version": "5.0.1",
-      "resolved": "https://registry.npmjs.org/json-stringify-safe/-/json-stringify-safe-5.0.1.tgz",
-      "integrity": "sha1-Epai1Y/UXxmg9s4B1lcB4sc1tus=",
-      "dev": true,
-      "optional": true
-    },
    "json5": {
      "version": "0.5.1",
      "resolved": "http://registry.npmjs.org/json5/-/json5-0.5.1.tgz",
@@ -5696,19 +5534,6 @@
      "integrity": "sha1-LHS27kHZPKUbe1qu6PUDYx0lKnM=",
      "dev": true
    },
-    "jsprim": {
-      "version": "1.4.1",
-      "resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.1.tgz",
-      "integrity": "sha1-MT5mvB5cwG5Di8G3SZwuXFastqI=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "1.0.0",
-        "extsprintf": "1.3.0",
-        "json-schema": "0.2.3",
-        "verror": "1.10.0"
-      }
-    },
    "jsx-ast-utils": {
      "version": "2.0.1",
      "resolved": "https://registry.npmjs.org/jsx-ast-utils/-/jsx-ast-utils-2.0.1.tgz",
@@ -5774,26 +5599,37 @@
      }
    },
    "less": {
-      "version": "3.8.1",
-      "resolved": "https://registry.npmjs.org/less/-/less-3.8.1.tgz",
-      "integrity": "sha512-8HFGuWmL3FhQR0aH89escFNBQH/nEiYPP2ltDFdQw2chE28Yx2E3lhAIq9Y2saYwLSwa699s4dBVEfCY8Drf7Q==",
+      "version": "3.13.1",
+      "resolved": "https://registry.npmjs.org/less/-/less-3.13.1.tgz",
+      "integrity": "sha512-SwA1aQXGUvp+P5XdZslUOhhLnClSLIjWvJhmd+Vgib5BFIr9lMNlQwmwUNOjXThF/A0x+MCYYPeWEfeWiLRnTw==",
      "dev": true,
      "requires": {
-        "clone": "^2.1.2",
+        "copy-anything": "^2.0.1",
        "errno": "^0.1.1",
        "graceful-fs": "^4.1.2",
        "image-size": "~0.5.0",
+        "make-dir": "^2.1.0",
        "mime": "^1.4.1",
-        "mkdirp": "^0.5.0",
-        "promise": "^7.1.1",
-        "request": "^2.83.0",
-        "source-map": "~0.6.0"
+        "native-request": "^1.0.5",
+        "source-map": "~0.6.0",
+        "tslib": "^1.10.0"
      },
      "dependencies": {
-        "mime": {
-          "version": "1.6.0",
-          "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
-          "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
+        "make-dir": {
+          "version": "2.1.0",
+          "resolved": "https://registry.npmjs.org/make-dir/-/make-dir-2.1.0.tgz",
+          "integrity": "sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==",
+          "dev": true,
+          "optional": true,
+          "requires": {
+            "pify": "^4.0.1",
+            "semver": "^5.6.0"
+          }
+        },
+        "pify": {
+          "version": "4.0.1",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-4.0.1.tgz",
+          "integrity": "sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==",
          "dev": true,
          "optional": true
        },
@@ -5803,6 +5639,12 @@
          "integrity": "sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==",
          "dev": true,
          "optional": true
+        },
+        "tslib": {
+          "version": "1.14.1",
+          "resolved": "https://registry.npmjs.org/tslib/-/tslib-1.14.1.tgz",
+          "integrity": "sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==",
+          "dev": true
        }
      }
    },
@@ -5845,7 +5687,7 @@
    },
    "load-json-file": {
      "version": "1.1.0",
-      "resolved": "http://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
+      "resolved": "https://registry.npmjs.org/load-json-file/-/load-json-file-1.1.0.tgz",
      "integrity": "sha1-lWkFcI1YtLq0wiYbBPWfMcmTdMA=",
      "dev": true,
      "requires": {
@@ -5858,7 +5700,7 @@
      "dependencies": {
        "pify": {
          "version": "2.3.0",
-          "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
          "dev": true
        },
@@ -6380,20 +6222,12 @@
        "brorand": "^1.0.1"
      }
    },
-    "mime-db": {
-      "version": "1.37.0",
-      "resolved": "https://registry.npmjs.org/mime-db/-/mime-db-1.37.0.tgz",
-      "integrity": "sha512-R3C4db6bgQhlIhPU48fUtdVmKnflq+hRdad7IyKhtFj06VPNVdk2RhiYL3UjQIlso8L+YxAtFkobT0VK+S/ybg==",
-      "dev": true
-    },
-    "mime-types": {
-      "version": "2.1.21",
-      "resolved": "https://registry.npmjs.org/mime-types/-/mime-types-2.1.21.tgz",
-      "integrity": "sha512-3iL6DbwpyLzjR3xHSFNFeb9Nz/M8WDkX33t1GFQnFOllWk8pOrh/LSrB5OXlnlW5P9LH73X6loW/eogc+F5lJg==",
+    "mime": {
+      "version": "1.6.0",
+      "resolved": "https://registry.npmjs.org/mime/-/mime-1.6.0.tgz",
+      "integrity": "sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==",
      "dev": true,
-      "requires": {
-        "mime-db": "~1.37.0"
-      }
+      "optional": true
    },
    "mimic-fn": {
      "version": "1.2.0",
@@ -6559,6 +6393,13 @@
        "to-regex": "^3.0.1"
      }
    },
+    "native-request": {
+      "version": "1.1.0",
+      "resolved": "https://registry.npmjs.org/native-request/-/native-request-1.1.0.tgz",
+      "integrity": "sha512-uZ5rQaeRn15XmpgE0xoPL8YWqcX90VtCFglYwAgkvKM5e8fog+vePLAhHxuuv/gRkrQxIeh5U3q9sMNUrENqWw==",
+      "dev": true,
+      "optional": true
+    },
    "natural-compare": {
      "version": "1.4.0",
      "resolved": "https://registry.npmjs.org/natural-compare/-/natural-compare-1.4.0.tgz",
@@ -6707,13 +6548,6 @@
      "integrity": "sha1-CXtgK1NCKlIsGvuHkDGDNpQaAR0=",
      "dev": true
    },
-    "oauth-sign": {
-      "version": "0.9.0",
-      "resolved": "https://registry.npmjs.org/oauth-sign/-/oauth-sign-0.9.0.tgz",
-      "integrity": "sha512-fexhUFFPTGV8ybAtSIGbV6gOkSv8UtRbDBnAyLQw4QPKkgNlsH2ByPGtMUqdWkos6YCRmAqViwgZrJc/mRDzZQ==",
-      "dev": true,
-      "optional": true
-    },
    "object-assign": {
      "version": "4.1.1",
      "resolved": "https://registry.npmjs.org/object-assign/-/object-assign-4.1.1.tgz",
@@ -7283,7 +7117,7 @@
        },
        "chalk": {
          "version": "1.1.3",
-          "resolved": "http://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
+          "resolved": "https://registry.npmjs.org/chalk/-/chalk-1.1.3.tgz",
          "integrity": "sha1-qBFcVeSnAv5NFQq9OHKCKn4J/Jg=",
          "dev": true,
          "requires": {
@@ -7481,16 +7315,6 @@
      "integrity": "sha512-7PiHtLll5LdnKIMw100I+8xJXR5gW2QwWYkT6iJva0bXitZKa/XMrSbdmg3r2Xnaidz9Qumd0VPaMrZlF9V9sA==",
      "dev": true
    },
-    "promise": {
-      "version": "7.3.1",
-      "resolved": "https://registry.npmjs.org/promise/-/promise-7.3.1.tgz",
-      "integrity": "sha512-nolQXZ/4L+bP/UGlkfaIujX9BKxGwmQ9OT4mOt5yvy8iK1h3wqTEJCijzGANTCCl9nWjY41juyAn2K3Q1hLLTg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asap": "~2.0.3"
-      }
-    },
    "promise-inflight": {
      "version": "1.0.1",
      "resolved": "https://registry.npmjs.org/promise-inflight/-/promise-inflight-1.0.1.tgz",
@@ -7518,13 +7342,6 @@
      "integrity": "sha1-8FKijacOYYkX7wqKw0wa5aaChrM=",
      "dev": true
    },
-    "psl": {
-      "version": "1.1.29",
-      "resolved": "https://registry.npmjs.org/psl/-/psl-1.1.29.tgz",
-      "integrity": "sha512-AeUmQ0oLN02flVHXWh9sSJF7mcdFq0ppid/JkErufc3hGIV/AMa8Fo9VgDo/cT2jFdOWoFvHp90qqBH54W+gjQ==",
-      "dev": true,
-      "optional": true
-    },
    "public-encrypt": {
      "version": "4.0.3",
      "resolved": "https://registry.npmjs.org/public-encrypt/-/public-encrypt-4.0.3.tgz",
@@ -7566,13 +7383,6 @@
      "integrity": "sha512-XRsRjdf+j5ml+y/6GKHPZbrF/8p2Yga0JPtdqTIY2Xe5ohJPD9saDJJLPvp9+NSBprVvevdXZybnj2cv8OEd0A==",
      "dev": true
    },
-    "qs": {
-      "version": "6.5.2",
-      "resolved": "https://registry.npmjs.org/qs/-/qs-6.5.2.tgz",
-      "integrity": "sha512-N5ZAX4/LxJmF+7wN74pUD6qAh9/wnvdQcjq9TZjevvXzSUo7bfmw91saqMjzGS2xq91/odN2dW/WOl7qQHNDGA==",
-      "dev": true,
-      "optional": true
-    },
    "querystring": {
      "version": "0.2.0",
      "resolved": "https://registry.npmjs.org/querystring/-/querystring-0.2.0.tgz",
@@ -7736,7 +7546,7 @@
        },
        "pify": {
          "version": "2.3.0",
-          "resolved": "http://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
+          "resolved": "https://registry.npmjs.org/pify/-/pify-2.3.0.tgz",
          "integrity": "sha1-7RQaasBDqEnqWISY59yosVMw6Qw=",
          "dev": true
        },
@@ -7805,7 +7615,7 @@
    },
    "readable-stream": {
      "version": "2.3.6",
-      "resolved": "http://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
+      "resolved": "https://registry.npmjs.org/readable-stream/-/readable-stream-2.3.6.tgz",
      "integrity": "sha512-tQtKA9WIAhBF3+VLAseyMqZeBjW0AHJoxOtYqSUZNJxauErmLbVm2FW1y+J/YA9dUrAC39ITejlZWhVIwawkKw==",
      "dev": true,
      "requires": {
@@ -7934,7 +7744,7 @@
      "dependencies": {
        "jsesc": {
          "version": "0.5.0",
-          "resolved": "http://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
+          "resolved": "https://registry.npmjs.org/jsesc/-/jsesc-0.5.0.tgz",
          "integrity": "sha1-597mbjXW/Bb3EP6R1c9p9w8IkR0=",
          "dev": true
        }
@@ -8052,35 +7862,6 @@
        "remove-trailing-separator": "^1.1.0"
      }
    },
-    "request": {
-      "version": "2.88.0",
-      "resolved": "https://registry.npmjs.org/request/-/request-2.88.0.tgz",
-      "integrity": "sha512-NAqBSrijGLZdM0WZNsInLJpkJokL72XYjUpnB0iwsRgxh7dB6COrHnTBNwN0E+lHDAJzu7kLAkDeY08z2/A0hg==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "aws-sign2": "~0.7.0",
-        "aws4": "^1.8.0",
-        "caseless": "~0.12.0",
-        "combined-stream": "~1.0.6",
-        "extend": "~3.0.2",
-        "forever-agent": "~0.6.1",
-        "form-data": "~2.3.2",
-        "har-validator": "~5.1.0",
-        "http-signature": "~1.2.0",
-        "is-typedarray": "~1.0.0",
-        "isstream": "~0.1.2",
-        "json-stringify-safe": "~5.0.1",
-        "mime-types": "~2.1.19",
-        "oauth-sign": "~0.9.0",
-        "performance-now": "^2.1.0",
-        "qs": "~6.5.2",
-        "safe-buffer": "^5.1.2",
-        "tough-cookie": "~2.4.3",
-        "tunnel-agent": "^0.6.0",
-        "uuid": "^3.3.2"
-      }
-    },
    "require-directory": {
      "version": "2.1.1",
      "resolved": "https://registry.npmjs.org/require-directory/-/require-directory-2.1.1.tgz",
@@ -8578,24 +8359,6 @@
      "integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
      "dev": true
    },
-    "sshpk": {
-      "version": "1.15.2",
-      "resolved": "https://registry.npmjs.org/sshpk/-/sshpk-1.15.2.tgz",
-      "integrity": "sha512-Ra/OXQtuh0/enyl4ETZAfTaeksa6BXks5ZcjpSUNrjBr0DvrJKX+1fsKDPpT9TBXgHAFsa4510aNVgI8g/+SzA==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "asn1": "~0.2.3",
-        "assert-plus": "^1.0.0",
-        "bcrypt-pbkdf": "^1.0.0",
-        "dashdash": "^1.12.0",
-        "ecc-jsbn": "~0.1.1",
-        "getpass": "^0.1.1",
-        "jsbn": "~0.1.0",
-        "safer-buffer": "^2.0.2",
-        "tweetnacl": "~0.14.0"
-      }
-    },
    "ssri": {
      "version": "5.3.0",
      "resolved": "https://registry.npmjs.org/ssri/-/ssri-5.3.0.tgz",
@@ -8744,7 +8507,7 @@
    },
    "strip-ansi": {
      "version": "3.0.1",
-      "resolved": "http://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
+      "resolved": "https://registry.npmjs.org/strip-ansi/-/strip-ansi-3.0.1.tgz",
      "integrity": "sha1-ajhfuIU9lS1f8F0Oiq+UJ43GPc8=",
      "dev": true,
      "requires": {
@@ -8981,7 +8744,7 @@
        },
        "table": {
          "version": "4.0.3",
-          "resolved": "http://registry.npmjs.org/table/-/table-4.0.3.tgz",
+          "resolved": "https://registry.npmjs.org/table/-/table-4.0.3.tgz",
          "integrity": "sha512-S7rnFITmBH1EnyKcvxBh1LjYeQMmnZtCXSEbHcH6S0NoKit24ZuFO/T1vDcLdYsLQkM188PVVhQmzKIuThNkKg==",
          "dev": true,
          "requires": {
@@ -9194,26 +8957,6 @@
        "through2": "^2.0.3"
      }
    },
-    "tough-cookie": {
-      "version": "2.4.3",
-      "resolved": "https://registry.npmjs.org/tough-cookie/-/tough-cookie-2.4.3.tgz",
-      "integrity": "sha512-Q5srk/4vDM54WJsJio3XNn6K2sCG+CQ8G5Wz6bZhRZoAe/+TxjWB/GlFAnYEbkYVlON9FMk/fE3h2RLpPXo4lQ==",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "psl": "^1.1.24",
-        "punycode": "^1.4.1"
-      },
-      "dependencies": {
-        "punycode": {
-          "version": "1.4.1",
-          "resolved": "https://registry.npmjs.org/punycode/-/punycode-1.4.1.tgz",
-          "integrity": "sha1-wNWmOycYgArY4esPpSachN1BhF4=",
-          "dev": true,
-          "optional": true
-        }
-      }
-    },
    "trim": {
      "version": "0.0.1",
      "resolved": "https://registry.npmjs.org/trim/-/trim-0.0.1.tgz",
@@ -9256,22 +8999,6 @@
      "integrity": "sha1-oVe6QC2iTpv5V/mqadUk7tQpAaY=",
      "dev": true
    },
-    "tunnel-agent": {
-      "version": "0.6.0",
-      "resolved": "https://registry.npmjs.org/tunnel-agent/-/tunnel-agent-0.6.0.tgz",
-      "integrity": "sha1-J6XeoGs2sEoKmWZ3SykIaPD8QP0=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "safe-buffer": "^5.0.1"
-      }
-    },
-    "tweetnacl": {
-      "version": "0.14.5",
-      "resolved": "https://registry.npmjs.org/tweetnacl/-/tweetnacl-0.14.5.tgz",
-      "integrity": "sha1-WuaBd/GS1EViadEIr6k/+HQ/T2Q=",
-      "dev": true
-    },
    "type-check": {
      "version": "0.3.2",
      "resolved": "https://registry.npmjs.org/type-check/-/type-check-0.3.2.tgz",
@@ -9653,13 +9380,6 @@
        "object.getownpropertydescriptors": "^2.0.3"
      }
    },
-    "uuid": {
-      "version": "3.3.2",
-      "resolved": "https://registry.npmjs.org/uuid/-/uuid-3.3.2.tgz",
-      "integrity": "sha512-yXJmeNaw3DnnKAOKJE51sL/ZaYfWJRl1pK9dr19YFCu0ObS231AB1/LbqTKRAQ5kw8A90rA6fr4riOUpTZvQZA==",
-      "dev": true,
-      "optional": true
-    },
    "v8flags": {
      "version": "3.1.1",
      "resolved": "https://registry.npmjs.org/v8flags/-/v8flags-3.1.1.tgz",
@@ -9685,18 +9405,6 @@
      "integrity": "sha1-HCQ6ULWVwb5Up1S/7OhWO5/42BM=",
      "dev": true
    },
-    "verror": {
-      "version": "1.10.0",
-      "resolved": "https://registry.npmjs.org/verror/-/verror-1.10.0.tgz",
-      "integrity": "sha1-OhBcoXBTr1XW4nDB+CiGguGNpAA=",
-      "dev": true,
-      "optional": true,
-      "requires": {
-        "assert-plus": "^1.0.0",
-        "core-util-is": "1.0.2",
-        "extsprintf": "^1.2.0"
-      }
-    },
    "vfile": {
      "version": "2.3.0",
      "resolved": "https://registry.npmjs.org/vfile/-/vfile-2.3.0.tgz",
--- a/package.json
+++ b/package.json
@@ -1,5 +1,5 @@
 {
-  "name": "qlik-smart-pivot",
+  "name": "@qlik/qlik-smart-pivot",
  "version": "0.0.1",
  "description": "Profit & Loss reporting with color and font customizations.",
  "homepage": "",
@@ -31,7 +31,7 @@
    "gulp": "4.0.0",
    "gulp-util": "^3.0.7",
    "gulp-zip": "3.0.2",
-    "less": "3.8.1",
+    "less": "3.13.1",
    "less-loader": "4.1.0",
    "lodash.merge": "4.6.1",
    "style-loader": "0.23.1",
--- a/scripts/verify-files.sh
+++ b/scripts/verify-files.sh
@@ -6,15 +6,8 @@ set -o errexit

 echo "Verifying built file count"

-while read line; do
-    if [[ $line =~ ^\"name\": ]]; then
-        name=${line#*: \"}
-        name=${name%\"*}
-    fi
-done < package.json
-
 expected_file_count=$(($(find dist -type f | wc -l)-1))
-zip_file_count=$(zipinfo dist/${name}_${VERSION}.zip | grep ^- | wc -l)
+zip_file_count=$(zipinfo dist/qlik-smart-pivot_${VERSION}.zip | grep ^- | wc -l)

 if [ "${expected_file_count}" -ne "${zip_file_count}" ]; then
    # File count is incorrect
--- a/src/data-table/data-cell.jsx
+++ b/src/data-table/data-cell.jsx
@@ -1,53 +1,64 @@
+/* eslint-disable react/sort-prop-types */
+/* eslint-disable space-before-function-paren */
 import React from 'react';
 import PropTypes from 'prop-types';
 import Tooltip from '../tooltip/index.jsx';

 class DataCell extends React.PureComponent {
-  constructor (props) {
+  constructor(props) {
    super(props);
    this.handleSelect = this.handleSelect.bind(this);
  }

-  handleSelect () {
-    const { data: { meta: { dimensionCount } }, general: { allowFilteringByClick }, measurement, qlik } = this.props;
+  handleSelect() {
+    const {
+      data: {
+        meta: {
+          dimensionCount
+        }
+      },
+      general: {
+        allowFilteringByClick
+      },
+      measurement,
+      component
+    } = this.props;
+
    const hasSecondDimension = dimensionCount > 1;
    if (!allowFilteringByClick) {
      return;
    }
-
-    qlik.backendApi.selectValues(0, [measurement.parents.dimension1.elementNumber], true);
-
+    // fixes the console error on selection made from data cells
+    component.selectValues(0, [measurement.parents.dimension1.elementNumber], false);
    if (hasSecondDimension) {
-      qlik.backendApi.selectValues(1, [measurement.parents.dimension2.elementNumber], true);
+      component.selectValues(1, [measurement.parents.dimension2.elementNumber], false);
    }
  }

-  render () {
+  render() {
    const {
-      general,
+      cellWidth,
      measurement,
      styleBuilder,
      styling
    } = this.props;

-    let textAlignment = styling.options.textAlignment || 'Right';
+    const textAlignment = styling.options.textAlignment || 'Right';

-    let cellStyle = {
+    const cellStyle = {
      fontFamily: styling.options.fontFamily,
      ...styleBuilder.getStyle(),
      paddingLeft: '5px',
      textAlign: textAlignment,
-      minWidth: general.cellWidth,
-      maxWidth: general.cellWidth
+      minWidth: cellWidth,
+      maxWidth: cellWidth
    };

    const isEmptyCell = measurement.displayValue === '';
    let formattedMeasurementValue;
-    if (isEmptyCell) {
+    if (isEmptyCell || styleBuilder.hasComments()) {
      formattedMeasurementValue = '';
      cellStyle.cursor = 'default';
-    } else if (styleBuilder.hasComments()) {
-      formattedMeasurementValue = '.';
    } else {
      formattedMeasurementValue = formatMeasurementValue(measurement, styling);
    }
@@ -55,10 +66,10 @@ class DataCell extends React.PureComponent {
    const { conditionalColoring } = styling;
    if (conditionalColoring.enabled) {
      const isValidConditionalColoringValue = !styleBuilder.hasComments() && !isNaN(measurement.value);
-      const isSpecifiedRow =
-        conditionalColoring.rows.indexOf(measurement.parents.dimension1.header) !== -1;
-      const isSpecifiedMeasure =
-        conditionalColoring.measures.indexOf(measurement.parents.measurement.index) !== -1;
+      const isSpecifiedRow
+        = conditionalColoring.rows.indexOf(measurement.parents.dimension1.header) !== -1;
+      const isSpecifiedMeasure
+        = conditionalColoring.measures.indexOf(measurement.parents.measurement.index) !== -1;
      const shouldHaveConditionalColoring = (conditionalColoring.colorAllRows || isSpecifiedRow)
        && (conditionalColoring.colorAllMeasures || isSpecifiedMeasure);
      if (isValidConditionalColoringValue && shouldHaveConditionalColoring) {
@@ -86,22 +97,24 @@ class DataCell extends React.PureComponent {
 }

 DataCell.propTypes = {
+  cellWidth: PropTypes.string.isRequired,
  data: PropTypes.shape({
    headers: PropTypes.shape({
      measurements: PropTypes.array.isRequired
+    }).isRequired,
+    meta: PropTypes.shape({
+      dimensionCount: PropTypes.number.isRequired
    }).isRequired
  }).isRequired,
-  general: PropTypes.shape({
-    cellWidth: PropTypes.string.isRequired
-  }).isRequired,
+  general: PropTypes.shape({}).isRequired,
  measurement: PropTypes.shape({
    format: PropTypes.string,
    name: PropTypes.string,
    value: PropTypes.any
  }).isRequired,
-  qlik: PropTypes.shape({
+  component: PropTypes.shape({
    backendApi: PropTypes.shape({
-      selectValues: function (props, propName) {
+      selectValues (props, propName) {
        if (props.isSnapshot || typeof props[propName] === 'function') {
          return null;
        }
@@ -119,7 +132,7 @@ DataCell.propTypes = {

 export default DataCell;

-function formatMeasurementValue (measurement, styling) {
+function formatMeasurementValue(measurement, styling) {
  if (isNaN(measurement.value)) {
    return styling.symbolForNulls;
  }
@@ -127,7 +140,7 @@ function formatMeasurementValue (measurement, styling) {
  return measurement.displayValue;
 }

-function getConditionalColor (measurement, conditionalColoring) {
+function getConditionalColor(measurement, conditionalColoring) {
  if (measurement.value < conditionalColoring.threshold.poor) {
    return conditionalColoring.colors.poor;
  }
--- a/src/data-table/index.jsx
+++ b/src/data-table/index.jsx
@@ -5,101 +5,175 @@ import DataCell from './data-cell.jsx';
 import RowHeader from './row-header.jsx';
 import { injectSeparators } from '../utilities';

-const DataTable = ({ data, general, qlik, renderData, styling }) => {
-  const {
-    headers: {
-      dimension1,
-      measurements
-    },
-    matrix
-  } = data;
+// eslint-disable-next-line react/prefer-stateless-function
+class DataTable extends React.PureComponent {
+  render () {
+    const {
+      cellWidth,
+      columnSeparatorWidth,
+      component,
+      data,
+      general,
+      renderData,
+      styling
+    } = this.props;

-  return (
-    <div className="row-wrapper">
-      <table>
-        <tbody>
-          {dimension1.map((dimensionEntry, dimensionIndex) => {
-            const rowHeaderText = dimensionEntry.displayValue || '';
-            if (rowHeaderText === '-') {
-              return null;
-            }
-            const styleBuilder = new StyleBuilder(styling);
-            if (styling.hasCustomFileStyle) {
-              styleBuilder.parseCustomFileStyle(rowHeaderText);
-            } else {
-              styleBuilder.applyStandardAttributes(dimensionIndex);
-              styleBuilder.applyCustomStyle({
-                fontSize: `${14 + styling.options.fontSizeAdjustment}px`
-              });
-            }
-            const rowStyle = {
-              fontFamily: styling.options.fontFamily,
-              width: '230px',
-              ...styleBuilder.getStyle()
-            };
+    const {
+      headers: {
+        dimension1,
+        dimension2,
+        measurements
+      },
+      matrix
+    } = data;

-            return (
-              <tr key={dimensionEntry.displayValue}>
-                {!renderData ?
-                  <RowHeader
-                    entry={dimensionEntry}
-                    qlik={qlik}
-                    rowStyle={rowStyle}
-                    styleBuilder={styleBuilder}
-                    styling={styling}
-                  /> : null
+    const separatorStyle = {
+      minWidth: columnSeparatorWidth,
+      maxWidth: columnSeparatorWidth
+    };
+
+    const renderMeasurementData = (dimIndex, atEvery) => {
+      if (dimension2.length <= 0) {
+        return injectSeparators(
+          matrix[dimIndex],
+          columnSeparatorWidth,
+          atEvery
+        );
+      }
+      const measurementDataRow = [];
+      let index = 0,
+        match;
+      dimension2.forEach(dim2 => {
+        measurements.forEach((measure, mesInd) => {
+          for (index = 0; index < matrix[dimIndex].length; index++) {
+            match = false;
+            if (
+              matrix[dimIndex][index].parents &&
+              dimension1[dimIndex].displayValue ===
+                matrix[dimIndex][index].parents.dimension1.header
+            ) {
+              if (
+                dim2.displayValue ===
+                matrix[dimIndex][index].parents.dimension2.header
+              ) {
+                if (
+                  measure.name ===
+                  matrix[dimIndex][index].parents.measurement.header
+                ) {
+                  measurementDataRow.push(matrix[dimIndex][index]);
+                  match = true;
+                  break;
                }
-                {renderData && injectSeparators(
-                  matrix[dimensionIndex],
-                  styling.useSeparatorColumns,
-                  { atEvery: measurements.length }
-                ).map((measurementData, index) => {
-                  if (measurementData.isSeparator) {
-                    const separatorStyle = {
-                      color: 'white',
-                      fontFamily: styling.options.fontFamily,
-                      fontSize: `${12 + styling.options.fontSizeAdjustment}px`
-                    };
+              }
+            }
+          }
+          if (!match) {
+            measurementDataRow.push({
+              displayValue: "",
+              parents: {
+                dimension1: {
+                  elementNumber: dimension1[dimIndex].elementNumber,
+                  header: dimension1[dimIndex].displayValue
+                },
+                dimension2: {
+                  elementNumber: dim2.elementNumber,
+                  header: dim2.displayValue
+                },
+                measurement: {
+                  header: measure.name,
+                  index: mesInd
+                }
+              }
+            });
+          }
+        });
+      });
+      return injectSeparators(
+        measurementDataRow,
+        columnSeparatorWidth,
+        atEvery
+      );
+    };

-                    return (
-                      <td
-                        className="empty"
-                        key={`${dimensionEntry.displayValue}-${index}-separator`}
-                        style={separatorStyle}
-                      >
-                        *
-                      </td>
-                    );
-                  }

-                  const { dimension1: dimension1Info, dimension2, measurement } = measurementData.parents;
-                  const id = `${dimension1Info.elementNumber}-${dimension2 && dimension2.elementNumber}-${measurement.header}`;
-                  return (
-                    <DataCell
-                      data={data}
-                      general={general}
-                      key={`${dimensionEntry.displayValue}-${id}`}
-                      measurement={measurementData}
-                      qlik={qlik}
+    return (
+      <div className="row-wrapper">
+        <table>
+          <tbody>
+            {dimension1.map((dimensionEntry, dimensionIndex) => {
+              const rowHeaderText = dimensionEntry.displayValue || '';
+              if (rowHeaderText === '-') {
+                return null;
+              }
+              const styleBuilder = new StyleBuilder(styling);
+              if (styling.hasCustomFileStyle) {
+                styleBuilder.parseCustomFileStyle(rowHeaderText);
+              } else {
+                styleBuilder.applyStandardAttributes(dimensionIndex);
+                styleBuilder.applyCustomStyle({
+                  fontSize: `${14 + styling.options.fontSizeAdjustment}px`
+                });
+              }
+              const rowStyle = {
+                fontFamily: styling.options.fontFamily,
+                width: '230px',
+                ...styleBuilder.getStyle()
+              };
+
+              return (
+                <tr key={`${dimensionEntry.displayValue}-${dimensionIndex}-separator`}>
+                  {!renderData ?
+                    <RowHeader
+                      component={component}
+                      entry={dimensionEntry}
+                      rowStyle={rowStyle}
                      styleBuilder={styleBuilder}
                      styling={styling}
-                    />
-                  );
-                })}
-              </tr>
-            );
-          })}
-        </tbody>
-      </table>
-    </div>
-  );
-};
+                    /> : null
+                  }
+                  {renderData && renderMeasurementData(dimensionIndex, { atEvery: measurements.length }).map((measurementData, index) => {
+                    if (measurementData.isSeparator) {
+                      return (
+                        <td
+                          className="empty"
+                          key={`${dimensionEntry.displayValue}-${index}-separator`}
+                          style={separatorStyle}
+                        />
+                      );
+                    }
+
+                    // eslint-disable-next-line no-shadow
+                    return (
+                      <DataCell
+                        cellWidth={cellWidth}
+                        component={component}
+                        data={data}
+                        general={general}
+                        key={`${Math.random()}-${new Date().getTime()}`}
+                        measurement={measurementData}
+                        styleBuilder={styleBuilder}
+                        styling={styling}
+                      />
+                    );
+                  })}
+                </tr>
+              );
+            })}
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+}

 DataTable.defaultProps = {
  renderData: true
 };

 DataTable.propTypes = {
+  cellWidth: PropTypes.string.isRequired,
+  columnSeparatorWidth: PropTypes.string.isRequired,
+  component: PropTypes.shape({}).isRequired,
  data: PropTypes.shape({
    headers: PropTypes.shape({
      dimension1: PropTypes.array.isRequired
@@ -107,7 +181,6 @@ DataTable.propTypes = {
    matrix: PropTypes.arrayOf(PropTypes.array.isRequired).isRequired
  }).isRequired,
  general: PropTypes.shape({}).isRequired,
-  qlik: PropTypes.shape({}).isRequired,
  renderData: PropTypes.bool,
  styling: PropTypes.shape({
    hasCustomFileStyle: PropTypes.bool.isRequired
--- a/src/data-table/row-header.jsx
+++ b/src/data-table/row-header.jsx
@@ -10,14 +10,15 @@ class RowHeader extends React.PureComponent {
    this.handleSelect = this.handleSelect.bind(this);
  }

+  // fixes the console error on row selected values
  handleSelect () {
-    const { entry, qlik } = this.props;
-    qlik.backendApi.selectValues(0, [entry.elementNumber], true);
+    const { component, entry } = this.props;
+    component.selectValues(0, [entry.elementNumber], false);
  }

  render () {
-    const { entry, rowStyle, styleBuilder, styling, qlik } = this.props;
-    const inEditState = qlik.inEditState();
+    const { entry, rowStyle, styleBuilder, styling, component } = this.props;
+    const inEditState = component.inEditState();

    return (
      <td
@@ -42,12 +43,9 @@ class RowHeader extends React.PureComponent {
 }

 RowHeader.propTypes = {
-  entry: PropTypes.shape({
-    displayValue: PropTypes.string.isRequired
-  }).isRequired,
-  qlik: PropTypes.shape({
+  component: PropTypes.shape({
    backendApi: PropTypes.shape({
-      selectValues: function (props, propName) {
+      selectValues (props, propName) {
        if (props.isSnapshot || typeof props[propName] === 'function') {
          return null;
        }
@@ -55,6 +53,10 @@ RowHeader.propTypes = {
      }
    }).isRequired
  }).isRequired,
+  entry: PropTypes.shape({
+    displayValue: PropTypes.string.isRequired,
+    elementNumber: PropTypes.number.isRequired
+  }).isRequired,
  rowStyle: PropTypes.shape({}).isRequired,
  styleBuilder: PropTypes.shape({}).isRequired,
  styling: PropTypes.shape({}).isRequired
--- a/src/dataset.js
+++ b/src/dataset.js
@@ -6,39 +6,66 @@ function createCube (definition, app) {
  });
 }

-async function buildDataCube (originCubeDefinition, hasTwoDimensions, app) {
+async function buildDataCube (originCubeDefinition, originCube, app, requestPage) {
  const cubeDefinition = {
    ...originCubeDefinition,
    qInitialDataFetch: [
      {
+        // eslint-disable-next-line no-undefined
+        qTop: requestPage === undefined ? 0 : requestPage[0].qTop,
+        qLeft: 0,
        qHeight: 1000,
-        qWidth: 10
+        qWidth: originCube.qSize.qcx
      }
    ],
    qDimensions: [originCubeDefinition.qDimensions[0]],
    qMeasures: originCubeDefinition.qMeasures
  };
-  if (hasTwoDimensions) {
+  if (originCube.qDimensionInfo.length === 2) {
    cubeDefinition.qDimensions.push(originCubeDefinition.qDimensions[1]);
  }
  const cube = await createCube(cubeDefinition, app);
-  return cube.qHyperCube.qDataPages[0].qMatrix;
+  const cubeMatrix = cube.qHyperCube.qDataPages[0].qMatrix;
+  app.destroySessionObject(cube.qInfo.qId);
+  return cubeMatrix;
 }

 export async function initializeDataCube (component, layout) {
+
  if (component.backendApi.isSnapshot) {
    return layout.snapshotData.dataCube;
  }
-
  const app = qlik.currApp(component);
  const properties = (await component.backendApi.getProperties());
+  const rowCount = component.backendApi.getRowCount();
+  const cellCount = rowCount * layout.qHyperCube.qSize.qcx;
+  const maxLoops = layout.maxloops;

  // If this is a master object, fetch the hyperCubeDef of the original object
-  const hyperCubeDef = properties.qExtendsId
+  let hyperCubeDef = properties.qExtendsId
    ? (await app.getObjectProperties(properties.qExtendsId)).properties.qHyperCubeDef
    : properties.qHyperCubeDef;
-
-  return buildDataCube(hyperCubeDef, layout.qHyperCube.qDimensionInfo.length === 2, app);
+  hyperCubeDef = JSON.parse(JSON.stringify(hyperCubeDef));
+  hyperCubeDef.qStateName = layout.qStateName;
+  const pagedCube = {};
+  let lastRow = 0;
+  if (cellCount < (maxLoops * 10000)) {
+    for (let index = 0; cellCount > lastRow; index += 1) {
+      const requestPage = [
+        {
+          qHeight: 1000,
+          qLeft: 0,
+          qTop: lastRow,
+          qWidth: 10 // should be # of columns
+        }
+      ];
+      // eslint-disable-next-line no-await-in-loop
+      pagedCube[index] = await buildDataCube(hyperCubeDef, layout.qHyperCube, app, requestPage);
+      lastRow = lastRow + 1000;
+    }
+    return pagedCube;
+  }
+  return null;
 }

 export function initializeDesignList (component, layout) {
@@ -59,6 +86,6 @@ export function initializeDesignList (component, layout) {
      resolve(data);
    };
    stylingField.OnData.bind(listener);
-    stylingField.getData();
+    stylingField.getData({ rows: 5000 });
  });
 }
--- a/src/definition/index.js
+++ b/src/definition/index.js
@@ -39,7 +39,7 @@ const definition = {
          component: 'text'
        },
        paragraph1: {
-          label: `P&L pivot is a Qlik Sense extension which allows you to display Profit & Loss
+          label: `P&L pivot is a Qlik Sense chart which allows you to display Profit & Loss
            reporting with color and font customizations.`,
          component: 'text'
        },
--- a/src/definition/pagination.js
+++ b/src/definition/pagination.js
@@ -23,30 +23,6 @@ const pagination = {
        {
          value: 4,
          label: '40k cells'
-        },
-        {
-          value: 5,
-          label: '50k cells'
-        },
-        {
-          value: 6,
-          label: '60k cells'
-        },
-        {
-          value: 7,
-          label: '70k cells'
-        },
-        {
-          value: 8,
-          label: '80k cells'
-        },
-        {
-          value: 9,
-          label: '90k cells'
-        },
-        {
-          value: 10,
-          label: '100k cells'
        }
      ],
      defaultValue: 2
@@ -55,7 +31,8 @@ const pagination = {
      ref: 'errormessage',
      label: 'Default error message',
      type: 'string',
-      defaultValue: 'Unable to display all the data. Apply more filters to limit the amount of displayed data.'
+      defaultValue: `Unable to display all the data. 
+      Change the pagination size supported or apply more filters to limit the amount of displayed data.`
    }
  }
 };
--- a/src/definition/table-format.js
+++ b/src/definition/table-format.js
@@ -209,6 +209,23 @@ const tableFormat = {
      ],
      defaultValue: 'right'
    },
+    FitChartWidth: {
+      ref: 'fitchartwidth',
+      type: 'boolean',
+      component: 'switch',
+      label: 'Fill chart width',
+      options: [
+        {
+          value: true,
+          label: 'On'
+        },
+        {
+          value: false,
+          label: 'Off'
+        }
+      ],
+      defaultValue: false
+    },
    ColumnWidthSlider: {
      type: 'number',
      component: 'slider',
@@ -217,7 +234,8 @@ const tableFormat = {
      min: 20,
      max: 250,
      step: 10,
-      defaultValue: 50
+      defaultValue: 50,
+      show: data => !data.fitchartwidth
    },
    SymbolForNulls: {
      ref: 'symbolfornulls',
--- a/src/excel-export.js
+++ b/src/excel-export.js
@@ -7,13 +7,12 @@ function cleanupNodes (node) {
  });
 }

-function buildTableHTML (id, title, subtitle, footnote) {
+function buildTableHTML (containerElement, title, subtitle, footnote) {
  const titleHTML = `<p style="font-size:15pt"><b>${title}</b></p>`;
  const subtitleHTML = `<p style="font-size:11pt">${subtitle}</p>`;
  const footnoteHTML = `<p style="font-size:11pt">${footnote}</p>`;
-  const container = document.querySelector(`[tid="${id}"]`);
-  const kpiTableClone = container.querySelector('.kpi-table').cloneNode(true);
-  const dataTableClone = container.querySelector('.data-table').cloneNode(true);
+  const kpiTableClone = containerElement[0].querySelector('.kpi-table').cloneNode(true);
+  const dataTableClone = containerElement[0].querySelector('.data-table').cloneNode(true);
  cleanupNodes(kpiTableClone);
  cleanupNodes(kpiTableClone);

@@ -83,7 +82,7 @@ function buildTableHTML (id, title, subtitle, footnote) {

 function downloadXLS (html) {
  const filename = 'analysis.xls';
-  const blobObject = new Blob([html]);
+  const blobObject = new Blob([html], { type: 'application/vnd.ms-excel' });

  // IE/Edge
  if (window.navigator.msSaveOrOpenBlob) {
@@ -100,8 +99,8 @@ function downloadXLS (html) {
  return true;
 }

-export function exportXLS (id, title, subtitle, footnote) {
+export function exportXLS (containerElement, title, subtitle, footnote) {
  // original was removing icon when starting export, disable and some spinner instead, shouldn't take enough time to warrant either..?
-  const table = buildTableHTML(id, title, subtitle, footnote);
+  const table = buildTableHTML(containerElement, title, subtitle, footnote);
  downloadXLS(table);
 }
--- a/src/export-button.jsx
+++ b/src/export-button.jsx
@@ -1,42 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { exportXLS } from './excel-export';
-
-class ExportButton extends React.PureComponent {
-  constructor (props) {
-    super(props);
-    this.handleExport = this.handleExport.bind(this);
-  }
-
-  handleExport () {
-    const { id, excelExport, general } = this.props;
-    const { title, subtitle, footnote } = general;
-    if (excelExport) {
-      exportXLS(id, title, subtitle, footnote);
-    }
-  }
-
-  render () {
-    const { excelExport } = this.props;
-    return excelExport === true && (
-      <input
-        className="icon-xls"
-        onClick={this.handleExport}
-        src="/Extensions/qlik-smart-pivot/Excel.png"
-        type="image"
-      />
-    );
-  }
-}
-
-ExportButton.defaultProps = {
-  excelExport: false
-};
-
-ExportButton.propTypes = {
-  id: PropTypes.string.isRequired,
-  excelExport: PropTypes.bool,
-  general: PropTypes.shape({}).isRequired
-};
-
-export default ExportButton;
--- a/src/headers-table/column-header.jsx
+++ b/src/headers-table/column-header.jsx
@@ -1,22 +1,25 @@
+/* eslint-disable object-shorthand */
+/* eslint-disable space-before-function-paren */
 import React from 'react';
 import PropTypes from 'prop-types';
 import { HEADER_FONT_SIZE } from '../initialize-transformed';
 import Tooltip from '../tooltip/index.jsx';

 class ColumnHeader extends React.PureComponent {
-  constructor (props) {
+  constructor(props) {
    super(props);
    this.handleSelect = this.handleSelect.bind(this);
  }

-  handleSelect () {
-    const { entry, qlik } = this.props;
-    qlik.backendApi.selectValues(1, [entry.elementNumber], true);
+  // fixes console error for column selected values
+  handleSelect() {
+    const { component, entry } = this.props;
+    component.selectValues(1, [entry.elementNumber], false);
  }

-  render () {
-    const { baseCSS, cellWidth, colSpan, entry, styling, qlik } = this.props;
-    const inEditState = qlik.inEditState();
+  render() {
+    const { baseCSS, cellWidth, colSpan, component, entry, styling } = this.props;
+    const inEditState = component.inEditState();
    const isMediumFontSize = styling.headerOptions.fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;

    const style = {
@@ -53,13 +56,9 @@ ColumnHeader.defaultProps = {

 ColumnHeader.propTypes = {
  baseCSS: PropTypes.shape({}).isRequired,
-  cellWidth: PropTypes.string,
+  cellWidth: PropTypes.string.isRequired,
  colSpan: PropTypes.number,
-  entry: PropTypes.shape({
-    elementNumber: PropTypes.number.isRequired,
-    name: PropTypes.string.isRequired
-  }).isRequired,
-  qlik: PropTypes.shape({
+  component: PropTypes.shape({
    backendApi: PropTypes.shape({
      selectValues: function (props, propName) {
        if (props.isSnapshot || typeof props[propName] === 'function') {
@@ -69,6 +68,10 @@ ColumnHeader.propTypes = {
      }
    }).isRequired
  }).isRequired,
+  entry: PropTypes.shape({
+    displayValue: PropTypes.string.isRequired,
+    elementNumber: PropTypes.number.isRequired
+  }).isRequired,
  styling: PropTypes.shape({
    headerOptions: PropTypes.shape({
      fontSizeAdjustment: PropTypes.number.isRequired
--- a/src/headers-table/export-column-header.jsx
+++ b/src/headers-table/export-column-header.jsx
@@ -1,9 +1,10 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ExportButton from '../export-button.jsx';
 import { HEADER_FONT_SIZE } from '../initialize-transformed';
+import Tooltip from '../tooltip/index.jsx';

-const ExportColumnHeader = ({ id, baseCSS, general, title, allowExcelExport, hasSecondDimension, styling }) => {
+const Dim1Header = ({ component, baseCSS, title, hasSecondDimension, styling }) => {
+  const inEditState = component.inEditState();
  const rowSpan = hasSecondDimension ? 2 : 1;
  const isMediumFontSize = styling.headerOptions.fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;
  const style = {
@@ -21,21 +22,20 @@ const ExportColumnHeader = ({ id, baseCSS, general, title, allowExcelExport, has
      rowSpan={rowSpan}
      style={style}
    >
-      <ExportButton
-        id={id}
-        excelExport={allowExcelExport}
-        general={general}
-      />
-      {title}
+      <Tooltip
+        isTooltipActive={!inEditState}
+        styling={styling}
+        tooltipText={title}
+      >
+        {title}
+      </Tooltip>
    </th>
  );
 };

-ExportColumnHeader.propTypes = {
-  id: PropTypes.string.isRequired,
-  allowExcelExport: PropTypes.bool.isRequired,
+Dim1Header.propTypes = {
  baseCSS: PropTypes.shape({}).isRequired,
-  general: PropTypes.shape({}).isRequired,
+  component: PropTypes.shape({}).isRequired,
  hasSecondDimension: PropTypes.bool.isRequired,
  styling: PropTypes.shape({
    headerOptions: PropTypes.shape({
@@ -45,4 +45,4 @@ ExportColumnHeader.propTypes = {
  title: PropTypes.string.isRequired
 };

-export default ExportColumnHeader;
+export default Dim1Header;
--- a/src/headers-table/index.jsx
+++ b/src/headers-table/index.jsx
@@ -1,124 +1,124 @@
 import React from 'react';
 import PropTypes from 'prop-types';
-import ExportColumnHeader from './export-column-header.jsx';
+import Dim1Header from './dim1-header.jsx';
 import ColumnHeader from './column-header.jsx';
 import MeasurementColumnHeader from './measurement-column-header.jsx';
 import { injectSeparators } from '../utilities';

-const HeadersTable = ({ data, general, qlik, styling, isKpi }) => {
-  const baseCSS = {
-    backgroundColor: styling.headerOptions.colorSchema,
-    color: styling.headerOptions.textColor,
-    fontFamily: styling.options.fontFamily,
-    textAlign: styling.headerOptions.alignment
-  };
+class HeadersTable extends React.PureComponent {
+  render () {
+    const {
+      cellWidth,
+      columnSeparatorWidth,
+      component,
+      data,
+      isKpi,
+      styling
+    } = this.props;

-  const {
-    dimension1,
-    dimension2,
-    measurements
-  } = data.headers;
+    const baseCSS = {
+      backgroundColor: styling.headerOptions.colorSchema,
+      color: styling.headerOptions.textColor,
+      fontFamily: styling.options.fontFamily,
+      textAlign: styling.headerOptions.alignment
+    };

-  const hasSecondDimension = dimension2.length > 0;
+    const {
+      dimension1,
+      dimension2,
+      measurements
+    } = data.headers;

-  return (
-    <div className="header-wrapper">
-      <table className="header">
-        <tbody>
-          <tr>
-            {isKpi ?
-              <ExportColumnHeader
-                id={qlik.options.id}
-                allowExcelExport={general.allowExcelExport}
-                baseCSS={baseCSS}
-                general={general}
-                hasSecondDimension={hasSecondDimension}
-                styling={styling}
-                title={dimension1[0].name}
-              /> : null
-            }
-            {!isKpi && !hasSecondDimension && measurements.map(measurementEntry => (
-              <MeasurementColumnHeader
-                baseCSS={baseCSS}
-                general={general}
-                hasSecondDimension={hasSecondDimension}
-                key={`${measurementEntry.displayValue}-${measurementEntry.name}`}
-                measurement={measurementEntry}
-                styling={styling}
-              />
-            ))}
-            {!isKpi && hasSecondDimension && injectSeparators(dimension2, styling.useSeparatorColumns).map((entry, index) => {
-              if (entry.isSeparator) {
-                const separatorStyle = {
-                  color: 'white',
-                  fontFamily: styling.options.fontFamily,
-                  fontSize: `${13 + styling.headerOptions.fontSizeAdjustment}px`
-                };
+    const hasSecondDimension = dimension2.length > 0;

-                return (
-                  <th
-                    className="empty"
-                    key={index}
-                    style={separatorStyle}
-                  >
-                    *
-                  </th>
-                );
-              }
-              return (
-                <ColumnHeader
+    const separatorStyle = {
+      minWidth: columnSeparatorWidth,
+      maxWidth: columnSeparatorWidth
+    };
+
+    return (
+      <div className="header-wrapper">
+        <table className="header">
+          <tbody>
+            <tr>
+              {isKpi ?
+                <Dim1Header
                  baseCSS={baseCSS}
-                  cellWidth={general.cellWidth}
-                  colSpan={measurements.length}
-                  entry={entry}
-                  key={entry.displayValue}
-                  qlik={qlik}
+                  component={component}
+                  hasSecondDimension={hasSecondDimension}
+                  styling={styling}
+                  title={dimension1[0].name}
+                /> : null
+              }
+              {!isKpi && !hasSecondDimension && measurements.map(measurementEntry => (
+                <MeasurementColumnHeader
+                  baseCSS={baseCSS}
+                  cellWidth={cellWidth}
+                  hasSecondDimension={hasSecondDimension}
+                  key={`${measurementEntry.displayValue}-${measurementEntry.name}-${measurementEntry.index}`}
+                  measurement={measurementEntry}
                  styling={styling}
                />
-              );
-            })}
-          </tr>
-          {!isKpi && hasSecondDimension && (
-            <tr>
-              {injectSeparators(dimension2, styling.useSeparatorColumns).map((dimensionEntry, index) => {
-                if (dimensionEntry.isSeparator) {
-                  const separatorStyle = {
-                    color: 'white',
-                    fontFamily: styling.options.fontFamily,
-                    fontSize: `${12 + styling.headerOptions.fontSizeAdjustment}px`
-                  };
-
+              ))}
+              {!isKpi && hasSecondDimension && injectSeparators(dimension2, columnSeparatorWidth).map((entry, index) => {
+                if (entry.isSeparator) {
                  return (
                    <th
                      className="empty"
                      key={index}
                      style={separatorStyle}
-                    >
-                      *
-                    </th>
+                    />
                  );
                }
-                return measurements.map(measurementEntry => (
-                  <MeasurementColumnHeader
+                return (
+                  <ColumnHeader
                    baseCSS={baseCSS}
-                    dimensionEntry={dimensionEntry}
-                    general={general}
-                    hasSecondDimension={hasSecondDimension}
-                    key={`${measurementEntry.displayValue}-${measurementEntry.name}-${dimensionEntry.name}`}
-                    measurement={measurementEntry}
+                    cellWidth={cellWidth}
+                    colSpan={measurements.length}
+                    component={component}
+                    entry={entry}
+                    key={`${entry.displayValue}-${index}-separator`}
                    styling={styling}
                  />
-                ));
+                );
              })}
            </tr>
-          )}
-        </tbody>
-      </table>
-    </div>
-  );
-};
+            {!isKpi && hasSecondDimension && (
+              <tr>
+                {injectSeparators(dimension2, columnSeparatorWidth).map((dimensionEntry, index) => {
+                  if (dimensionEntry.isSeparator) {
+                    return (
+                      <th
+                        className="empty"
+                        key={index}
+                        style={separatorStyle}
+                      />
+                    );
+                  }
+                  return measurements.map(measurementEntry => (
+                    <MeasurementColumnHeader
+                      baseCSS={baseCSS}
+                      cellWidth={cellWidth}
+                      dimensionEntry={dimensionEntry}
+                      hasSecondDimension={hasSecondDimension}
+                      key={`${measurementEntry.displayValue}-${measurementEntry.name}-${measurementEntry.index}-${dimensionEntry.name}`}
+                      measurement={measurementEntry}
+                      styling={styling}
+                    />
+                  ));
+                })}
+              </tr>
+            )}
+          </tbody>
+        </table>
+      </div>
+    );
+  }
+}

 HeadersTable.propTypes = {
+  cellWidth: PropTypes.string.isRequired,
+  columnSeparatorWidth: PropTypes.string.isRequired,
  data: PropTypes.shape({
    headers: PropTypes.shape({
      dimension1: PropTypes.array,
@@ -126,17 +126,7 @@ HeadersTable.propTypes = {
      measurements: PropTypes.array
    })
  }).isRequired,
-  general: PropTypes.shape({}).isRequired,
-  qlik: PropTypes.shape({
-    backendApi: PropTypes.shape({
-      selectValues: function (props, propName) {
-        if (props.isSnapshot || typeof props[propName] === 'function') {
-          return null;
-        }
-        return new Error('Missing implementation of qlik.backendApi.selectValues.');
-      }
-    }).isRequired
-  }).isRequired,
+  component: PropTypes.shape({}).isRequired,
  styling: PropTypes.shape({
    headerOptions: PropTypes.shape({}),
    options: PropTypes.shape({})
--- a/src/headers-table/measurement-column-header.jsx
+++ b/src/headers-table/measurement-column-header.jsx
@@ -3,25 +3,27 @@ import PropTypes from 'prop-types';
 import { HEADER_FONT_SIZE } from '../initialize-transformed';
 import Tooltip from '../tooltip/index.jsx';

-const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measurement, styling }) => {
+const MeasurementColumnHeader = ({ baseCSS, cellWidth, hasSecondDimension, measurement, styling }) => {
  const title = `${measurement.name}`;
  const { fontSizeAdjustment } = styling.headerOptions;
  const isMediumFontSize = fontSizeAdjustment === HEADER_FONT_SIZE.MEDIUM;

+  const cellStyle = {
+    ...baseCSS,
+    verticalAlign: 'middle',
+    minWidth: cellWidth,
+    maxWidth: cellWidth
+  };
+
  if (hasSecondDimension) {
    const isPercentageFormat = measurement.format.substring(measurement.format.length - 1) === '%';
    let baseFontSize = 14;
    if (isPercentageFormat) {
      baseFontSize = 13;
    }
-    const cellStyle = {
-      ...baseCSS,
-      fontSize: `${baseFontSize + fontSizeAdjustment}px`,
-      height: isMediumFontSize ? '45px' : '35px',
-      verticalAlign: 'middle',
-      minWidth: general.cellWidth,
-      maxWidth: general.cellWidth
-    };
+    cellStyle.fontSize = `${baseFontSize + fontSizeAdjustment}px`;
+    cellStyle.height = isMediumFontSize ? '45px' : '35px';
+
    return (
      <th
        className="grid-cells"
@@ -37,18 +39,12 @@ const MeasurementColumnHeader = ({ baseCSS, general, hasSecondDimension, measure
    );
  }

-  const style = {
-    ...baseCSS,
-    fontSize: `${15 + fontSizeAdjustment}px`,
-    height: isMediumFontSize ? '90px' : '70px',
-    verticalAlign: 'middle',
-    minWidth: general.cellWidth,
-    maxWidth: general.cellWidth
-  };
+  cellStyle.fontSize = `${15 + fontSizeAdjustment}px`;
+  cellStyle.height = isMediumFontSize ? '90px' : '70px';
  return (
    <th
      className="grid-cells"
-      style={style}
+      style={cellStyle}
    >
      <Tooltip
        tooltipText={title}
@@ -66,9 +62,7 @@ MeasurementColumnHeader.defaultProps = {

 MeasurementColumnHeader.propTypes = {
  baseCSS: PropTypes.shape({}).isRequired,
-  general: PropTypes.shape({
-    cellWidth: PropTypes.string.isRequired
-  }).isRequired,
+  cellWidth: PropTypes.string.isRequired,
  hasSecondDimension: PropTypes.bool,
  measurement: PropTypes.shape({
    name: PropTypes.string.isRequired
--- a/src/index.js
+++ b/src/index.js
@@ -1,21 +1,18 @@
-import definition from './definition';
-import { initializeDataCube, initializeDesignList } from './dataset';
-import initializeStore from './store';
-import React from 'react';
-import ReactDOM from 'react-dom';
-import Root from './root.jsx';
-import './main.less';
+import definition from "./definition";
+import { exportXLS } from "./excel-export";
+import { initializeDataCube, initializeDesignList } from "./dataset";
+import initializeStore from "./store";
+import React from "react";
+import ReactDOM from "react-dom";
+import Root from "./root.jsx";
+import "./main.less";

-if (!window._babelPolyfill) { // eslint-disable-line no-underscore-dangle
-  require('@babel/polyfill'); // eslint-disable-line global-require
+if (!window._babelPolyfill) {
+  // eslint-disable-line no-underscore-dangle
+  require("@babel/polyfill"); // eslint-disable-line global-require
 }

-export default {
-  controller: [
-    '$scope',
-    '$timeout',
-    function controller () {}
-  ],
+export default ({ flags }) => ({
  design: {
    dimensions: {
      max: 1,
@@ -24,20 +21,23 @@ export default {
  },
  data: {
    dimensions: {
-      max: function (nMeasures) {
+      max (nMeasures) {
        return nMeasures < 9 ? 2 : 1;
      },
      min: 1,
      uses: 'dimensions'
    },
    measures: {
-      max: function (nDims) {
+      max (nDims) {
        return nDims < 2 ? 9 : 8;
      },
      min: 1,
      uses: 'measures'
    }
  },
+  // Prevent conversion from and to this object
+  exportProperties: null,
+  importProperties: null,
  definition,
  initialProperties: {
    version: 1.0,
@@ -45,11 +45,14 @@ export default {
      qDimensions: [],
      qInitialDataFetch: [
        {
-          qHeight: 1,
-          qWidth: 10
+          qTop: 0,
+          qLeft: 0,
+          qWidth: 50,
+          qHeight: 50
        }
      ],
-      qMeasures: []
+      qMeasures: [],
+      qSuppressZero: false
    }
  },
  support: {
@@ -57,23 +60,32 @@ export default {
    exportData: true,
    snapshot: true
  },
-  paint: async function ($element, layout) {
-    const dataCube = await initializeDataCube(this, layout);
-    const designList = await initializeDesignList(this, layout);
-    const state = await initializeStore({
-      $element,
-      component: this,
-      dataCube,
-      designList,
-      layout
-    });
+  async paint ($element, layout, requestPage) {
+    const dataCube = await initializeDataCube(this, layout, requestPage);
    const editmodeClass = this.inAnalysisState() ? '' : 'edit-mode';
+    let state, designList;
+    if (dataCube === null) {
+      state = {
+        $element,
+        component: this,
+        dataCube,
+        designList,
+        layout,
+        error: true
+      };
+    } else {
+      designList = await initializeDesignList(this, layout);
+      state = await initializeStore({
+        $element,
+        component: this,
+        dataCube,
+        designList,
+        layout,
+        error: false
+      });
+    }
    const jsx = (
-      <Root
-        editmodeClass={editmodeClass}
-        qlik={this}
-        state={state}
-      />
+      <Root editmodeClass={editmodeClass} component={this} state={state} />
    );

    ReactDOM.render(jsx, $element[0]);
@@ -81,10 +93,48 @@ export default {
  snapshot: {
    canTakeSnapshot: true
  },
-  setSnapshotData: async function (snapshotLayout) {
-    snapshotLayout.snapshotData.dataCube = await initializeDataCube(this, snapshotLayout);
-    snapshotLayout.snapshotData.designList = await initializeDesignList(this, snapshotLayout);
+  async setSnapshotData (snapshotLayout) {
+    snapshotLayout.snapshotData.dataCube = await initializeDataCube(
+      this,
+      snapshotLayout
+    );
+    snapshotLayout.snapshotData.designList = await initializeDesignList(
+      this,
+      snapshotLayout
+    );
    return snapshotLayout;
  },
+  async getContextMenu (obj, menu) {
+    if (!this.$scope.layout.allowexportxls) {
+      return menu;
+    }
+
+    const app = this.backendApi.model.app;
+    const isPersonalResult = await app.global.isPersonalMode();
+
+    // Export as XLS option is removed from desktop because the desktop wrapper blocks downloads.
+    // Enabled for windows and QCS
+    // isPersonalMode returns true for both desktop and QCS
+    // By checking both if has download dialog and if is QCS can enable Export as XLS option on QCS
+    if (
+      (this.backendApi.model.layout.qMeta.privileges.includes('exportdata') && !isPersonalResult) ||
+      (flags.isEnabled('DOWNLOAD_USE_REPORTING') && isPersonalResult)
+    ) {
+      menu.addItem({
+        translation: 'Export as XLS',
+        tid: 'export-excel',
+        icon: 'export',
+        select: () => {
+          exportXLS(
+            this.$element,
+            this.$scope.layout.title,
+            this.$scope.layout.subtitle,
+            this.$scope.layout.footnote
+          );
+        }
+      });
+    }
+    return menu;
+  },
  version: 1.0
-};
+});
--- a/src/initialize-transformed.js
+++ b/src/initialize-transformed.js
@@ -1,50 +1,55 @@
-import { distinctArray } from './utilities';
+import { distinctArray } from "./utilities";

 export const HEADER_FONT_SIZE = {
  SMALL: -1,
-  MEDIUM: 1
+  MEDIUM: 1,
 };

-function getAlignment (option) {
+function getAlignment(option) {
  const alignmentOptions = {
-    1: 'left',
-    2: 'center',
-    3: 'right'
+    1: "left",
+    2: "center",
+    3: "right",
  };

-  return alignmentOptions[option] || 'left';
+  return alignmentOptions[option] || "left";
 }

-function getFontSizeAdjustment (option) {
+function getFontSizeAdjustment(option) {
  const fontSizeAdjustmentOptions = {
    1: HEADER_FONT_SIZE.SMALL,
-    2: HEADER_FONT_SIZE.MEDIUM
+    2: HEADER_FONT_SIZE.MEDIUM,
  };

  return fontSizeAdjustmentOptions[option] || 0;
 }

-function generateMeasurements (information) {
-  return information.map(measurement => {
+function generateMeasurements(information) {
+  return information.map((measurement) => {
    const transformedMeasurement = {
-      format: measurement.qNumFormat.qFmt || '#.##0',
-      name: measurement.qFallbackTitle
+      format: measurement.qNumFormat.qFmt || "#.##0",
+      name: measurement.qFallbackTitle,
    };

    return transformedMeasurement;
  });
 }

-function generateDimensionEntry (information, data) {
+function generateDimensionEntry(information, data) {
  return {
    displayValue: data.qText || data.qNum,
    elementNumber: data.qElemNumber,
    name: information.qFallbackTitle,
-    value: data.qNum
+    value: data.qNum,
  };
 }

-function generateMatrixCell ({ cell, dimension1Information, dimension2Information, measurementInformation }) {
+function generateMatrixCell({
+  cell,
+  dimension1Information,
+  dimension2Information,
+  measurementInformation,
+}) {
  const matrixCell = {
    displayValue: cell.qText,
    format: measurementInformation.format,
@@ -52,174 +57,136 @@ function generateMatrixCell ({ cell, dimension1Information, dimension2Informatio
    parents: {
      dimension1: {
        elementNumber: dimension1Information.qElemNumber,
-        header: dimension1Information.qText
+        header: dimension1Information.qText,
      },
      measurement: {
        header: measurementInformation.name,
-        index: measurementInformation.index
-      }
+        index: measurementInformation.index,
+      },
    },
-    value: cell.qNum
+    value: cell.qNum,
  };

  if (dimension2Information) {
    matrixCell.parents.dimension2 = {
-      elementNumber: dimension2Information.qElemNumber
+      elementNumber: dimension2Information.qElemNumber,
+      header: dimension2Information.qText,
    };
  }

  return matrixCell;
 }

-let lastRow = 0;
-function generateDataSet (
-  component, dimensionsInformation, measurementsInformation, dataCube) {
-
+function generateDataSet(
+  component,
+  dimensionsInformation,
+  measurementsInformation,
+  dataCube
+) {
  const measurements = generateMeasurements(measurementsInformation);
  let dimension1 = [];
  let dimension2 = [];
  let matrix = [];

  const hasSecondDimension = dimensionsInformation.length > 1;
-  dataCube.forEach(row => {
-    lastRow += 1;
-    const dimension1Entry = generateDimensionEntry(dimensionsInformation[0], row[0]);
-    dimension1.push(dimension1Entry);
-    let dimension2Entry;
-    let firstDataCell = 1;
-    if (hasSecondDimension) {
-      dimension2Entry = generateDimensionEntry(dimensionsInformation[1], row[1]);
-      dimension2.push(dimension2Entry);
-      firstDataCell = 2;
-    }
-    let matrixRow = row
-      .slice(firstDataCell, row.length)
-      .map((cell, cellIndex) => {
-        const measurementInformation = measurements[cellIndex];
-        measurementInformation.index = cellIndex;
-        const dimension1Information = row[0]; // eslint-disable-line prefer-destructuring
-        const dimension2Information = hasSecondDimension ? row[1] : null;
-        const generatedCell = generateMatrixCell({
-          cell,
-          dimension1Information,
-          dimension2Information,
-          measurementInformation
+  // eslint-disable-next-line no-undefined
+  for (let index = 0; dataCube[index] !== undefined; index++) {
+    // eslint-disable-next-line no-loop-func
+    dataCube[index].forEach((row) => {
+      const dimension1Entry = generateDimensionEntry(
+        dimensionsInformation[0],
+        row[0]
+      );
+      dimension1.push(dimension1Entry);
+      let dimension2Entry;
+      let firstDataCell = 1;
+      if (hasSecondDimension) {
+        dimension2Entry = generateDimensionEntry(
+          dimensionsInformation[1],
+          row[1]
+        );
+        dimension2.push(dimension2Entry);
+        firstDataCell = 2;
+      }
+      let matrixRow = row
+        .slice(firstDataCell, row.length)
+        .map((cell, cellIndex) => {
+          const measurementInformation = measurements[cellIndex];
+          measurementInformation.index = cellIndex;
+          const dimension1Information = row[0]; // eslint-disable-line prefer-destructuring
+          const dimension2Information = hasSecondDimension ? row[1] : null;
+          const generatedCell = generateMatrixCell({
+            cell,
+            dimension1Information,
+            dimension2Information,
+            measurementInformation,
+          });
+          return generatedCell;
        });

-        return generatedCell;
-      });
-
-    let appendToRowIndex = matrix.length;
-    if (hasSecondDimension) {
-      // See if there already is a row for the current dim1
-      for (let i = 0; i < matrix.length; i++) {
-        if (matrix[i][0].parents.dimension1.header === matrixRow[0].parents.dimension1.header) {
-          appendToRowIndex = i;
-          matrixRow = matrix[i].concat(matrixRow);
+      let appendToRowIndex = matrix.length;
+      if (hasSecondDimension) {
+        // See if there already is a row for the current dim1
+        for (let i = 0; i < matrix.length; i++) {
+          if (
+            matrix[i][0].parents.dimension1.header ===
+            matrixRow[0].parents.dimension1.header
+          ) {
+            appendToRowIndex = i;
+            matrixRow = matrix[i].concat(matrixRow);
+          }
        }
      }
-    }
-    matrix[appendToRowIndex] = matrixRow;
-  });
+      matrix[appendToRowIndex] = matrixRow;
+    });
+  }

  // filter header dimensions to only have distinct values
  dimension1 = distinctArray(dimension1);
  dimension2 = distinctArray(dimension2);

-  // Make sure all rows are saturated, otherwise data risks being displayed in the wrong column
-  matrix = matrix.map((row, rowIndex) => {
-    if ((hasSecondDimension && row.length == (dimension2.length * measurements.length))
-      || (!hasSecondDimension && row.length == measurements.length)) {
-      // Row is saturated
-      return row;
-    }
-
-    // Row is not saturated, so must add empty cells to fill the gaps
-    let newRow = [];
-    if (hasSecondDimension) {
-      // Got a second dimension, so need to add measurements for all values of the second dimension
-      let rowDataIndex = 0;
-      dimension2.forEach(dim => {
-        rowDataIndex = appendMissingCells(
-          row, newRow, rowDataIndex, measurements, rowIndex, dim.elementNumber);
-      });
-    } else {
-      appendMissingCells(row, newRow, 0, measurements, rowIndex);
-    }
-
-    return newRow;
-  });
-
  return {
    dimension1: dimension1,
    dimension2: dimension2,
    matrix,
-    measurements
+    measurements,
  };
 }

-/*
- * Appends the cells of the source row, as well as those missing, to the destination row, starting
- * from the given source index. Returns the source index of the next source cell after this has
- * completed. If there is a second dimension the dim2ElementNumber should be set to the current
- * index of the dimension2 value being processed.
- */
-function appendMissingCells (
-  sourceRow, destRow, sourceIndex, measurements, dim1ElementNumber, dim2ElementNumber = -1) {
-
-  let index = sourceIndex;
-  measurements.forEach((measurement, measureIndex) => {
-    if (index < sourceRow.length
-      && (dim2ElementNumber === -1
-        || sourceRow[index].parents.dimension2.elementNumber === dim2ElementNumber)
-      && sourceRow[index].parents.measurement.header === measurement.name) {
-      // Source contains the expected cell
-      destRow.push(sourceRow[index]);
-      index++;
-    } else {
-      // Source doesn't contain the expected cell, so add empty
-      destRow.push({
-        displayValue: '',
-        parents: {
-          dimension1: { elementNumber: dim1ElementNumber },
-          dimension2: { elementNumber: dim2ElementNumber },
-          measurement: {
-            header: measurement.name,
-            index: measureIndex
-          }
-        }
-      });
-    }
-  });
-  return index;
-}
-
-function initializeTransformed ({ $element, component, dataCube, designList, layout }) {
+function initializeTransformed({
+  $element,
+  component,
+  dataCube,
+  designList,
+  layout,
+}) {
  const dimensionsInformation = component.backendApi.getDimensionInfos();
  const measurementsInformation = component.backendApi.getMeasureInfos();
  const dimensionCount = layout.qHyperCube.qDimensionInfo.length;
-  const rowCount = component.backendApi.getRowCount();
-  const maxLoops = layout.maxloops;
-  const {
-    dimension1,
-    dimension2,
-    measurements,
-    matrix
-  } = generateDataSet(component, dimensionsInformation, measurementsInformation, dataCube);
+  const { dimension1, dimension2, measurements, matrix } = generateDataSet(
+    component,
+    dimensionsInformation,
+    measurementsInformation,
+    dataCube
+  );

  const customSchemaBasic = [];
  const customSchemaFull = [];
  let customHeadersCount = 0;

  if (designList && designList.length > 0) {
-    const headers = designList[0].split(';');
+    const headers = designList[0].split(";");
    customHeadersCount = headers.length;
    for (let lineNumber = 0; lineNumber < designList.length; lineNumber += 1) {
      customSchemaFull[lineNumber] = new Array(headers.length);
-      const data = designList[lineNumber].split(';');
+      const data = designList[lineNumber].split(";");

      if (data.length === headers.length) {
-        for (let headerIndex = 0; headerIndex < headers.length; headerIndex += 1) {
+        for (
+          let headerIndex = 0;
+          headerIndex < headers.length;
+          headerIndex += 1
+        ) {
          [customSchemaBasic[lineNumber]] = data;
          customSchemaFull[lineNumber][headerIndex] = data[headerIndex];
        }
@@ -227,46 +194,62 @@ function initializeTransformed ({ $element, component, dataCube, designList, lay
    }
  }

+  let cellWidth;
+  if (layout.fitchartwidth) {
+    // The widths are calculated based on the current element width. Note: this could use % to set
+    // the widths as percentages of the available width. However, this often results in random
+    // columns getting 1px wider than the others because of rounding necessary to fill the width.
+    // This 1px causes missalignment between the data- and header tables.
+    cellWidth = "";
+  } else {
+    // If using the previous solution just set 60px
+    cellWidth = `${
+      layout.columnwidthslider > 10 ? layout.columnwidthslider : 60
+    }px`;
+  }
+
  // top level properties could be reducers and then components connect to grab what they want,
  // possibly with reselect for some presentational transforms (moving some of the presentational logic like formatting and such)
  const transformedProperties = {
+    element: $element[0],
    data: {
      headers: {
        dimension1, // column headers
        dimension2, // parent row headers if exists
-        measurements // row headers, looped for each dimension2 if exists
+        measurements, // row headers, looped for each dimension2 if exists
      },
      matrix, // 2d array of all rows/cells to render in body of datatable
      meta: {
-        dimensionCount: dimensionsInformation.length
-      }
+        dimensionCount: dimensionsInformation.length,
+      },
    },
    general: {
      allowExcelExport: layout.allowexportxls,
      allowFilteringByClick: layout.filteroncellclick,
-      // If using the previous solution just set 60px
-      cellWidth: `${layout.columnwidthslider > 10 ? layout.columnwidthslider : 60}px`,
+      cellWidth: cellWidth,
      errorMessage: layout.errormessage,
      footnote: layout.footnote,
-      maxLoops,
      subtitle: layout.subtitle,
-      title: layout.title
+      title: layout.title,
+      useColumnSeparator: layout.separatorcols && dimensionCount > 1,
    },
    selection: {
-      dimensionSelectionCounts: dimensionsInformation.map(dimensionInfo => dimensionInfo.qStateCounts.qSelected)
+      dimensionSelectionCounts: dimensionsInformation.map(
+        (dimensionInfo) => dimensionInfo.qStateCounts.qSelected
+      ),
    },
    styling: {
      customCSV: {
        basic: customSchemaBasic,
        count: customHeadersCount,
-        full: customSchemaFull
+        full: customSchemaFull,
      },
      hasCustomFileStyle: Boolean(designList),
      headerOptions: {
        alignment: getAlignment(layout.HeaderAlign),
        colorSchema: layout.HeaderColorSchema.color,
        fontSizeAdjustment: getFontSizeAdjustment(layout.lettersizeheader),
-        textColor: layout.HeaderTextColorSchema.color
+        textColor: layout.HeaderTextColorSchema.color,
      },
      options: {
        backgroundColor: layout.rowEvenBGColor,
@@ -274,55 +257,44 @@ function initializeTransformed ({ $element, component, dataCube, designList, lay
        color: layout.BodyTextColorSchema,
        fontFamily: layout.FontFamily,
        fontSizeAdjustment: getFontSizeAdjustment(layout.lettersize),
-        textAlignment: layout.cellTextAlignment
+        textAlignment: layout.cellTextAlignment,
      },
      conditionalColoring: {
        enabled: layout.conditionalcoloring.enabled,
        colorAllRows: layout.conditionalcoloring.colorall,
-        rows: layout.conditionalcoloring.rows.map(row => row.rowname),
-        colorAllMeasures: typeof layout.conditionalcoloring.colorallmeasures === 'undefined'
-          || layout.conditionalcoloring.colorallmeasures,
+        rows: layout.conditionalcoloring.rows.map((row) => row.rowname),
+        colorAllMeasures:
+          typeof layout.conditionalcoloring.colorallmeasures === "undefined" ||
+          layout.conditionalcoloring.colorallmeasures,
        measures: !layout.conditionalcoloring.measures
-          ? [] : layout.conditionalcoloring.measures.split(',').map(index => Number(index)),
+          ? []
+          : layout.conditionalcoloring.measures
+              .split(",")
+              .map((index) => Number(index)),
        threshold: {
          poor: layout.conditionalcoloring.threshold_poor,
-          fair: layout.conditionalcoloring.threshold_fair
+          fair: layout.conditionalcoloring.threshold_fair,
        },
        colors: {
          poor: {
            color: layout.conditionalcoloring.color_poor,
-            textColor: layout.conditionalcoloring.textcolor_poor
+            textColor: layout.conditionalcoloring.textcolor_poor,
          },
          fair: {
            color: layout.conditionalcoloring.color_fair,
-            textColor: layout.conditionalcoloring.textcolor_fair
+            textColor: layout.conditionalcoloring.textcolor_fair,
          },
          good: {
            color: layout.conditionalcoloring.color_good,
-            textColor: layout.conditionalcoloring.textcolor_good
-          }
-        }
+            textColor: layout.conditionalcoloring.textcolor_good,
+          },
+        },
      },
      symbolForNulls: layout.symbolfornulls,
      usePadding: layout.indentbool,
-      useSeparatorColumns: dimensionCount === 1 ? false : layout.separatorcols
-    }
+    },
  };

-  if (rowCount > lastRow && rowCount <= (maxLoops * 1000)) {
-    const requestPage = [
-      {
-        qHeight: Math.min(1000, rowCount - lastRow),
-        qLeft: 0,
-        qTop: matrix.length,
-        qWidth: 10 // should be # of columns
-      }
-    ];
-    component.backendApi.getData(requestPage).then(() => {
-      component.paint($element, layout);
-    });
-  }
-
  return transformedProperties;
 }

--- a/src/linked-scroll/linked-scroll-wrapper.jsx
+++ b/src/linked-scroll/linked-scroll-wrapper.jsx
@@ -33,7 +33,7 @@ class LinkedScrollWrapper extends React.PureComponent {
  unlinkComponent (component) {
    const componentIndex = this.scrollElements.map(element => element.component).indexOf(component);
    if (componentIndex !== -1) {
-      this.scrollElements.removeAt(componentIndex);
+      this.scrollElements.splice(componentIndex, 1);
      // eslint-disable-next-line react/no-find-dom-node
      const node = ReactDOM.findDOMNode(component);
      node.onscroll = null;
--- a/src/main.less
+++ b/src/main.less
@@ -57,10 +57,8 @@
  }

  .empty {
-    width: 3%;
    background: #fff;
-    min-width: 4px !important;
-    max-width: 4px !important;
+    padding: 0 !important;
  }

  th.main-kpi {
@@ -107,6 +105,20 @@
    width: 100%;
  }

+  .error {
+    position: absolute; /*Define position */
+    width: 100%; /* Full width (cover the whole page) */
+    height: 100%; /* Full height (cover the whole page) */
+    top: 0;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    z-index: 1000; /* Specify a stack order in case you're using a different order for other elements */
+    display: flex;
+    justify-content: center;
+    align-items: center;
+  }
+
  .kpi-table .fdim-cells,
  .data-table td {
    line-height: 1em !important;
--- a/src/root.jsx
+++ b/src/root.jsx
@@ -1,64 +1,121 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import HeadersTable from './headers-table/index.jsx';
-import DataTable from './data-table/index.jsx';
-import { LinkedScrollWrapper, LinkedScrollSection } from './linked-scroll';
+import React from "react";
+import PropTypes from "prop-types";
+import HeadersTable from "./headers-table/index.jsx";
+import DataTable from "./data-table/index.jsx";
+import { LinkedScrollWrapper, LinkedScrollSection } from "./linked-scroll";

-const Root = ({ state, qlik, editmodeClass }) => (
-  <div className="root">
-    <LinkedScrollWrapper>
-      <div className={`kpi-table ${editmodeClass}`}>
-        <HeadersTable
-          data={state.data}
-          general={state.general}
-          isKpi
-          qlik={qlik}
-          styling={state.styling}
-        />
-        <LinkedScrollSection linkVertical>
-          <DataTable
-            data={state.data}
-            general={state.general}
-            qlik={qlik}
-            renderData={false}
-            styling={state.styling}
-          />
-        </LinkedScrollSection>
+class Root extends React.PureComponent {
+  render () {
+    const { editmodeClass, component, state } = this.props;
+    const { data, general, styling, error, element } = state;
+
+    // Determine cell- and column separator width
+    let cellWidth = '0px';
+    let columnSeparatorWidth = '';
+    if (!error && element) {
+      const tableWidth = element.getBoundingClientRect().width;
+
+      if (general.cellWidth) {
+        cellWidth = general.cellWidth;
+        if (general.useColumnSeparator) {
+          columnSeparatorWidth = '8px';
+        }
+      } else {
+        // 230 is the left "header", rest is magic margins
+        const headerMarginRight = 8 + 230 + 20;
+        const borderWidth = 1;
+        const rowCellCount = data.matrix[0].length;
+
+        let separatorCount = 0;
+        let separatorWidth = 0;
+        if (general.useColumnSeparator) {
+          separatorCount = data.headers.dimension2.length - 1;
+          separatorWidth = Math.min(
+            Math.floor((tableWidth * 0.2) / separatorCount),
+            8
+          );
+          columnSeparatorWidth = `${separatorWidth}px`;
+        }
+
+        const separatorWidthSum =
+          (separatorWidth + borderWidth) * separatorCount;
+        cellWidth = `${Math.floor(
+          (tableWidth - separatorWidthSum - headerMarginRight - borderWidth) /
+            rowCellCount) - borderWidth}px`;
+      }
+    }
+
+    return (
+      <div className="root">
+        {error ? (
+          <div className={`error ${editmodeClass}`}>
+            {state.layout.errormessage}
+          </div>
+        ) : (
+          <LinkedScrollWrapper>
+            <div className={`kpi-table ${editmodeClass}`}>
+              <HeadersTable
+                cellWidth={cellWidth}
+                columnSeparatorWidth={columnSeparatorWidth}
+                component={component}
+                data={data}
+                general={general}
+                isKpi
+                styling={styling}
+              />
+              <LinkedScrollSection linkVertical>
+                <DataTable
+                  cellWidth={cellWidth}
+                  columnSeparatorWidth={columnSeparatorWidth}
+                  component={component}
+                  data={data}
+                  general={general}
+                  renderData={false}
+                  styling={styling}
+                />
+              </LinkedScrollSection>
+            </div>
+            <div
+              className={`data-table ${editmodeClass}`}
+              style={{ width: general.cellWidth ? 'auto' : '100%' }}
+            >
+              <LinkedScrollSection linkHorizontal>
+                <HeadersTable
+                  cellWidth={cellWidth}
+                  columnSeparatorWidth={columnSeparatorWidth}
+                  component={component}
+                  data={data}
+                  general={general}
+                  isKpi={false}
+                  styling={styling}
+                />
+              </LinkedScrollSection>
+              <LinkedScrollSection linkHorizontal linkVertical>
+                <DataTable
+                  cellWidth={cellWidth}
+                  columnSeparatorWidth={columnSeparatorWidth}
+                  component={component}
+                  data={data}
+                  general={general}
+                  styling={styling}
+                />
+              </LinkedScrollSection>
+            </div>
+          </LinkedScrollWrapper>
+        )}
      </div>
-      <div className={`data-table ${editmodeClass}`}>
-        <LinkedScrollSection linkHorizontal>
-          <HeadersTable
-            data={state.data}
-            general={state.general}
-            isKpi={false}
-            qlik={qlik}
-            styling={state.styling}
-          />
-        </LinkedScrollSection>
-        <LinkedScrollSection
-          linkHorizontal
-          linkVertical
-        >
-          <DataTable
-            data={state.data}
-            general={state.general}
-            qlik={qlik}
-            styling={state.styling}
-          />
-        </LinkedScrollSection>
-      </div>
-    </LinkedScrollWrapper>
-  </div>
-);
+    );
+  }
+}

 Root.propTypes = {
-  qlik: PropTypes.shape({}).isRequired,
+  component: PropTypes.shape({}).isRequired,
+  editmodeClass: PropTypes.string.isRequired,
  state: PropTypes.shape({
-    data: PropTypes.object.isRequired,
-    general: PropTypes.object.isRequired,
-    styling: PropTypes.object.isRequired
-  }).isRequired,
-  editmodeClass: PropTypes.string.isRequired
+    data: PropTypes.object,
+    general: PropTypes.object,
+    styling: PropTypes.object
+  }).isRequired
 };

 export default Root;
--- a/src/utilities.js
+++ b/src/utilities.js
@@ -16,7 +16,7 @@ export function Deferred () {
  });
 }

-export function injectSeparators (array, shouldHaveSeparator, suppliedOptions) {
+export function injectSeparators (array, columnSeparatorWidth, suppliedOptions) {
  const defaultOptions = {
    atEvery: 1,
    separator: { isSeparator: true }
@@ -26,7 +26,7 @@ export function injectSeparators (array, shouldHaveSeparator, suppliedOptions) {
    ...suppliedOptions
  };

-  if (!shouldHaveSeparator) {
+  if (!columnSeparatorWidth) {
    return array;
  }
  return array.reduce((result, entry, index) => {
--- a/webpack.config.js
+++ b/webpack.config.js
@@ -3,76 +3,72 @@ const packageJSON = require('./package.json');
 const path = require('path');

 const DIST = path.resolve("./dist");
+// eslint-disable-next-line no-process-env
 const MODE = process.env.NODE_ENV || 'development';
+const SOURCE_MAP = 'source-map';
+const DEVTOOL = MODE === 'development' ? SOURCE_MAP : false;

 console.log('Webpack mode:', MODE); // eslint-disable-line no-console

 const config = {
-  devtool: 'source-map',
-  entry: ['./src/index.js'],
+  devtool: DEVTOOL,
+  entry: ["./src/index.js"],
  externals: {
    jquery: {
-      amd: 'jquery',
-      commonjs: 'jquery',
-      commonjs2: 'jquery',
-      root: '_'
+      amd: "jquery",
+      commonjs: "jquery",
+      commonjs2: "jquery",
+      root: "_",
    },
    qlik: {
-      amd: 'qlik',
-      commonjs: 'qlik',
-      commonjs2: 'qlik',
-      root: '_'
-    }
+      amd: "qlik",
+      commonjs: "qlik",
+      commonjs2: "qlik",
+      root: "_",
+    },
  },
  mode: MODE,
  module: {
    rules: [
      {
-        enforce: 'pre',
+        enforce: "pre",
        exclude: /(node_modules|Library)/,
-        loader: 'eslint-loader',
+        loader: "eslint-loader",
        options: {
-          failOnError: true
+          failOnError: true,
        },
-        test: /\.(js|jsx)$/
+        test: /\.(js|jsx)$/,
      },
      {
        exclude: /node_modules/,
        test: /\.(js|jsx)$/,
        use: {
-          loader: 'babel-loader',
+          loader: "babel-loader",
          options: {
            plugins: [
-              '@babel/plugin-transform-async-to-generator',
-              '@babel/plugin-proposal-class-properties'
+              "@babel/plugin-transform-async-to-generator",
+              "@babel/plugin-proposal-class-properties",
            ],
-            presets: [
-              '@babel/preset-env',
-              '@babel/preset-react'
-            ]
-          }
-        }
+            presets: ["@babel/preset-env", "@babel/preset-react"],
+          },
+        },
      },
      {
        test: /.less$/,
-        use: [
-          'style-loader',
-          'css-loader',
-          'less-loader'
-        ]
-      }
-    ]
+        use: ["style-loader", "css-loader", "less-loader"],
+      },
+    ],
  },
  output: {
-    filename: `${packageJSON.name}.js`,
-    libraryTarget: 'amd',
-    path: DIST
+    filename: "qlik-smart-pivot.js",
+    libraryTarget: "amd",
+    path: DIST,
  },
  plugins: [
    new StyleLintPlugin({
-      files: '**/*.less'
-    })
-  ]
+      files: "**/*.less",
+    }),
+  ],
 };

 module.exports = config;
Author	SHA1	Message	Date
Tobias Åström	ca1248d36f	Merge pull request #111 from qlik-oss/tsm/rename-pkg chore: rename package	2023-11-16 08:45:00 +01:00
caele	927f1ef921	fix: build and verification	2023-11-16 08:42:44 +01:00
caele	a0623614fc	chore: rename package	2023-11-16 08:37:35 +01:00
Tobias Åström	48f90f20b2	Merge pull request #106 from qlik-oss/dependabot/npm_and_yarn/tough-cookie-and-less--removed chore(deps): bump tough-cookie and less	2023-11-16 08:36:50 +01:00
dependabot[bot]	b1ffb3a9d1	chore(deps): bump tough-cookie and less Removes [tough-cookie](https://github.com/salesforce/tough-cookie). It's no longer used after updating ancestor dependency [less](https://github.com/less/less.js). These dependencies need to be updated together. Removes `tough-cookie` Updates `less` from 3.8.1 to 3.13.1 - [Release notes](https://github.com/less/less.js/releases) - [Changelog](https://github.com/less/less.js/blob/master/CHANGELOG.md) - [Commits](https://github.com/less/less.js/compare/v3.8.1...v3.13.1) --- updated-dependencies: - dependency-name: tough-cookie dependency-type: indirect - dependency-name: less dependency-type: direct:development ... Signed-off-by: dependabot[bot] <support@github.com>	2023-07-08 12:51:05 +00:00
Purwa Shrivastava	090a47cffd	Merge pull request #96 from qlik-oss/atq/fixDeploy fix: Environment Setup not needed for deploy	2022-11-14 14:03:28 +01:00
Purwa Shrivastava	43fa4cd380	fix: Environment Setup not needed for deploy	2022-11-11 14:48:15 +01:00
Purwa Shrivastava	233f2a5c7c	Merge pull request #95 from qlik-oss/fix/QB-14863 fix: QB-14863-duplicateKeys	2022-11-11 14:28:12 +01:00
Purwa Shrivastava	ca6893296a	fix: permission issue	2022-11-10 14:53:53 +01:00
Purwa Shrivastava	f13312c288	fix: yml file	2022-11-10 14:45:37 +01:00
Purwa Shrivastava	6fc73c4cc8	fix: update docker image	2022-11-10 14:34:46 +01:00
Purwa Shrivastava	9424e847c9	fix: use node v16 instead of v17	2022-11-10 14:09:53 +01:00
Purwa Shrivastava	b86a3ae9c6	fix: generated unique keys for data columns and removed blackduck scan	2022-11-10 10:53:19 +01:00
Jingjing Xie	ed50a8f3d3	Merge pull request #93 from qlik-oss/fix/QB-5202-option-in-QCS fix: Export as XLS in QCS	2021-07-07 16:42:47 +02:00
Jingjing Xie	cca315efbb	fix: check for desktop	2021-07-07 14:15:24 +02:00
Jingjing Xie	c888dd9fe4	fix: Export as XLS in QCS	2021-07-06 10:24:00 +02:00
Jingjing Xie	467948a46c	Merge pull request #92 from qlik-oss/fcy/QB-5202 fix: enable Export as XLS option on qcs	2021-06-23 15:56:45 +02:00
Jingjing Xie	315191ccfa	fix: comment	2021-06-23 12:29:23 +02:00
Jingjing Xie	80a9fdf2a9	fix: enable Export as XLS option on qcs	2021-06-23 10:26:36 +02:00
Tobias Åström	092b89d69f	Merge pull request #91 from qlik-oss/tsm/qb-2727 fix: remove infinite loop	2021-01-14 16:51:40 +01:00
caele	f934fa929d	chore: add comment	2021-01-14 10:23:22 +01:00
caele	acf6eb7b26	fix: remove infinite loop	2021-01-13 16:09:38 +01:00
Tobias Åström	d6ae86220e	Merge pull request #90 from qlik-oss/tsm/increase-style-rows Tsm/increase style rows	2021-01-05 09:29:18 +01:00
caele	3397bd419d	fix: set style rows to 5000	2021-01-05 09:13:46 +01:00
caele	2dd11ad24c	fix: set style rows to 5000	2021-01-05 09:10:39 +01:00
Tobias Åström	1099be87fa	chore: add comment to explain export in QCS	2020-09-24 13:29:39 +02:00
Tobias Åström	13c5b9613d	Merge pull request #89 from qlik-oss/tsm/QB-1634 fix: correctly check data export privileges	2020-06-09 08:54:31 +02:00
Tobias Åström	32890ba3db	fix: correctly check data export privileges	2020-06-08 09:27:36 +02:00
Snigdha	8f7465dd8d	Merge pull request #88 from qlik-oss/qb-1147-selection-refresh-pivot pivot selection refresh fixed	2020-03-27 12:20:46 +05:30
Snigdha Snigdha	be710cb17b	pivot selection refresh fixed	2020-03-20 18:29:32 +05:30
Avinash	2729321f40	Merge pull request #87 from qlik-oss/bugfix/QB-980 PL Pivot table Error message not showing	2020-02-26 18:06:04 +05:30
Avinash Shinde	2710d4629f	fix: PL Pivot table Error message not showing	2020-02-25 13:17:19 +05:30
Purwa Shrivastava	8c093a4692	Merge pull request #86 from qlik-oss/QLIK-98564/sourceMaps Removing source maps from production mode.	2020-02-14 11:03:05 +01:00
Avinash	ec822b843b	Merge pull request #85 from qlik-oss/bugfix/QB-959 bugfix for Column separator is misaligned	2020-02-14 11:51:42 +05:30
Purwa Shrivastava	5dc8bb49a4	Removing souce maps from production mode.	2020-02-12 08:06:07 +01:00
Avinash Shinde	0d98553a71	fix: removing .lock file	2020-02-11 16:32:58 +05:30
Avinash Shinde	6513a294b3	fix: Column separator is misaligned	2020-02-10 15:32:43 +05:30
Shiben Dutta	79e753c2b2	Merge pull request #84 from qlik-oss/QB262 fix: disable data export as per QMC	2020-02-04 08:26:39 +05:30
Shiben Dutta	468598540f	fix: disable data export as per QMC	2020-01-16 17:22:50 +05:30
snigdhaprasad26	045d0db215	Merge pull request #83 from qlik-oss/QB-285-console-error console error fixed	2020-01-10 13:43:25 +05:30
Snigdha Snigdha	73011d0388	fix: eslint error fixed and yarn.lock file removed	2020-01-09 16:24:15 +05:30
Snigdha Snigdha	41cf77e8d2	fix: console error fixed of qb-285	2020-01-09 15:49:47 +05:30
Snigdha Snigdha	1355381346	fix: console error fixed of qb-285	2020-01-09 15:18:05 +05:30
Snigdha Snigdha	730f35a83c	fix: console error fixed of qb-285	2020-01-09 15:11:11 +05:30
Snigdha Snigdha	71bf25e8fb	fix: console error fixed of qb-285	2020-01-09 15:08:57 +05:30
Snigdha Snigdha	9b4fe54239	fix: console error of qb-285	2020-01-09 14:56:56 +05:30
Snigdha Snigdha	e59c594215	console error fixed	2019-12-31 19:44:54 +05:30
Purwa Shrivastava	97a54e6f5a	Merge pull request #82 from qlik-oss/qb-612/missingvaluesfix Fix missing values resulting in data being rendered in wrong columns.	2019-12-10 14:40:45 +01:00
Purwa Shrivastava	eac9fd2a5f	Fix missing values resulting in data being rendered in wrong columns.	2019-12-10 12:29:28 +01:00
Purwa Shrivastava	96f09f9323	Merge pull request #81 from qlik-oss/QB-377/errorMessage React rendering Errors for few apps.	2019-12-09 08:42:31 +01:00
Purwa Shrivastava	2ab340f3f1	React rendering Errors for few apps.	2019-12-06 11:11:25 +01:00
Purwa Shrivastava	58d0f542eb	Merge pull request #80 from qlik-oss/QB-377/errorMessage Corrected the react error when componentDidUpdate is called. So the e…	2019-12-06 10:15:05 +01:00
Purwa Shrivastava	8ba826a0ea	Corrected the react error when componentDidUpdate is called. So the error message is uniformly shown in both analysis and edit mode.	2019-12-06 10:12:07 +01:00
Purwa Shrivastava	d2446395e2	Merge pull request #77 from qlik-oss/QB-331/PivotPagination Pivot Pagination Fix.	2019-12-05 13:41:29 +01:00
Purwa Shrivastava	f17a7b7714	Merge pull request #79 from qlik-oss/QB-493/wrongDataDisplay Qb 493/wrong data display	2019-12-05 09:15:42 +01:00
Purwa Shrivastava	8aa86275f0	Changed the rendering of each data cell to check for the headers of each dimesnsion and measure where it shall be written.	2019-12-04 11:15:14 +01:00
Purwa Shrivastava	3ebc2b9e29	Adding Dim 2 to the rendering logic.	2019-11-29 16:17:49 +01:00
Purwa Shrivastava	ce81549011	Merge pull request #78 from qlik-oss/QB-498/disableConversion Conversion led to different sort orders of data in different objects …	2019-11-28 13:40:45 +01:00
Purwa Shrivastava	e64af66dab	Conversion led to different sort orders of data in different objects so disabling it.	2019-11-27 14:54:42 +01:00
Purwa Shrivastava	fd9e645fc1	Pivot Pagination Fix.	2019-11-21 10:59:28 +01:00
Philip Olsén	ca1b1a9b53	Merge pull request #75 from qlik-oss/pol/bd Update black duck link	2019-09-20 15:33:56 +02:00
Philip Olsén	a65f843008	Update black duck link	2019-09-20 14:23:37 +02:00
Purwa Shrivastava	be9570e0aa	Merge pull request #74 from qlik-oss/atq/about Updated the About info for the smart pivot.	2019-07-12 12:40:29 +02:00
Purwa Shrivastava	41d3a7c9af	Updated the About info for the smart pivot.	2019-07-11 11:01:42 +02:00
Albert Backenhof	1e0a7c1204	Merge pull request #72 from qlik-oss/DEB-211/ContextMenuExportExcel Moved Excel export to context menu	2019-06-27 12:35:04 +02:00
Albert Backenhof	17b5df296c	Moved Excel export to context menu -Not showing context menu option for desktop users. Issue: DEB-211	2019-06-26 13:41:07 +02:00
Albert Backenhof	64b778b1af	Merge pull request #71 from qlik-oss/DEB-244/ExcelRow Suppress missing values and use correct cube size	2019-06-17 13:37:05 +02:00
Albert Backenhof	be6718ccf4	Merge pull request #73 from qlik-oss/DEB-250/ImprovedSelection Selecting with backendApi instead of Field	2019-06-17 09:30:27 +02:00
Albert Backenhof	28e6237a43	Selecting with backendApi instead of Field -Makes it possible to select master fields with different names than the original field. -Alternate state is no longer a problem when using this technique to select. Issue: DEB-250	2019-06-14 08:30:57 +02:00
Albert Backenhof	4fab3b5933	Suppress missing values and use correct cube size Issue: DEB-244	2019-05-29 15:17:17 +02:00
Albert Backenhof	79339a8963	Merge pull request #70 from qlik-oss/QLIK-95962/SpanWidth Add option to fit cells to chart width	2019-05-29 12:19:59 +02:00
Albert Backenhof	a6faeeb656	Add option to fit cells to chart width -To achieve pixel perfection the container of both header and data needs to calculate the size of the child tables' cells. Issue: QLIK-95962	2019-05-28 07:44:40 +02:00
Albert Backenhof	c22b7f5c6b	Merge pull request #61 from qlik-oss/DEB-232/DoubleMeasure Made the table cell keys more unique	2019-05-27 14:37:07 +02:00
Albert Backenhof	80f97602e4	Merge pull request #69 from qlik-oss/DEB-242/ExportInContainer Excel export inside container	2019-05-27 14:36:31 +02:00
Albert Backenhof	f745656b4c	Excel export inside container -No tid-element available when inside native container. Therefore, use root element to find table cells instead. Issue: DEB-242	2019-05-27 14:33:43 +02:00
Albert Backenhof	f7e780b92e	Merge pull request #68 from qlik-oss/excelType Specifying excel type of excel download	2019-05-27 14:28:26 +02:00
Albert Backenhof	d7a76c7db9	Merge pull request #63 from qlik-oss/QLIK-95802/AltStateFix Fixed alternate state support	2019-05-27 14:26:58 +02:00
Albert Backenhof	16c380e1c6	Fixed alternate state support -Previously, the shown data always followed default state, and not the set state. -Previously, the selections made in smart pivot sometimes used the previous alternate state. Issue: QLIK-95802	2019-05-27 14:24:02 +02:00
Albert Backenhof	072a3b80c4	Merge pull request #62 from qlik-oss/DEB-233/Selections Handle selection toggle properly	2019-05-27 14:12:43 +02:00
Albert Backenhof	5572b7ce67	Merge pull request #64 from qlik-oss/DEB-221/WidthSlider Slider for cell width without presets	2019-05-27 14:11:01 +02:00
Albert Backenhof	e26d5fded8	Specifying excel type of excel download	2019-05-20 10:12:22 +02:00
Albert Backenhof	1436463f59	Made the table cell keys more unique -This makes it possible to use the same measurement multiple times within the same smart-pivot chart. Issue: DEB-232	2019-05-13 13:12:32 +02:00
Albert Backenhof	729a31920d	Handle selection toggle properly -Previously, the cell selection would toggle the current selection. This meant, if a column is already selected when making a cell selection, the column selection would toggle off. With this fix the column selection stays on. Issue: DEB-233	2019-05-13 09:43:41 +02:00