@sme.up/ketchup 5.0.0 → 5.1.1

package/dist/collection/components/kup-dropdown-button/kup-dropdown-button.js

@@ -13,7 +13,7 @@ export class KupDropdownButton {
     /*-------------------------------------------------*/
     /*                   S t a t e s                   */
     /*-------------------------------------------------*/
-    this.value = '';
+    this.id = '';
     /*-------------------------------------------------*/
     /*                    P r o p s                    */
     /*-------------------------------------------------*/
@@ -147,7 +147,7 @@ export class KupDropdownButton {
     this.kupBlur.emit({
       comp: this,
       id: this.rootElement.id,
-      value: this.value,
+      value: this.id,
     });
   }
   onKupClick() {
@@ -155,14 +155,14 @@ export class KupDropdownButton {
     this.kupClick.emit({
       comp: this,
       id: this.rootElement.id,
-      value: this.value,
+      value: this.id,
     });
   }
   onKupFocus() {
     this.kupFocus.emit({
       comp: this,
       id: this.rootElement.id,
-      value: this.value,
+      value: this.id,
     });
   }
   onDropDownClick() {
@@ -179,12 +179,12 @@ export class KupDropdownButton {
     this.kupChange.emit({
       comp: this,
       id: this.rootElement.id,
-      value: this.value,
+      value: this.id,
     });
     this.kupItemClick.emit({
       comp: this,
       id: this.rootElement.id,
-      value: this.value,
+      value: this.id,
     });
   }
   /*-------------------------------------------------*/
@@ -202,7 +202,7 @@ export class KupDropdownButton {
    * Returns the component's internal value.
    */
   async getValue() {
-    return this.value;
+    return this.id;
   }
   /**
    * This method is used to trigger a new render of the component.
@@ -221,7 +221,7 @@ export class KupDropdownButton {
    * Sets the internal value of the component.
    */
   async setValue(value) {
-    this.value = value;
+    this.id = value;
   }
   /*-------------------------------------------------*/
   /*           P r i v a t e   M e t h o d s         */
@@ -280,9 +280,9 @@ export class KupDropdownButton {
   /**
    * Checks the consistency of the list.
    */
-  consistencyCheck(e, valueIn) {
-    const ret = consistencyCheck(valueIn, this.data['kup-list'], this.listEl, this.selectMode, this.displayMode, e);
-    this.value = ret.value;
+  consistencyCheck(e, idIn) {
+    const ret = consistencyCheck(idIn, this.data['kup-list'], this.listEl, this.selectMode, this.displayMode, e);
+    this.id = ret.value;
   }
   /*-------------------------------------------------*/
   /*          L i f e c y c l e   H o o k s          */
@@ -290,7 +290,7 @@ export class KupDropdownButton {
   componentWillLoad() {
     this.kupManager.debug.logLoad(this, false);
     this.kupManager.theme.register(this);
-    this.value = this.initialValue;
+    this.id = this.initialValue;
     if (!this.data) {
       this.data = {
         'kup-list': {},
@@ -298,7 +298,7 @@ export class KupDropdownButton {
     }
   }
   componentDidLoad() {
-    this.consistencyCheck(undefined, this.value);
+    this.consistencyCheck(undefined, this.id);
     this.kupManager.debug.logLoad(this, true);
   }
   componentWillRender() {
@@ -612,7 +612,7 @@ export class KupDropdownButton {
     }
   }; }
   static get states() { return {
-    "value": {}
+    "id": {}
   }; }
   static get events() { return [{
       "method": "kupBlur",

package/dist/collection/components/kup-echart/kup-echart-declarations.js

@@ -6,6 +6,8 @@ export var KupEchartProps;
 (function (KupEchartProps) {
   KupEchartProps["axis"] = "Sets the axis of the chart.";
   KupEchartProps["chartTitle"] = "Title of the graph.";
+  KupEchartProps["colors"] = "Overrides theme's colors.";
+  KupEchartProps["consistencyCheck"] = "When true, performs checks in order to properly initialize props which could be missing (i.e.: axis). For performances purposes, this prop will run only once when the component is initially created.";
   KupEchartProps["customStyle"] = "Custom style of the component.";
   KupEchartProps["data"] = "The actual data of the chart.";
   KupEchartProps["legend"] = "Sets the position of the legend. Supported values: bottom, left, right, top. Keep in mind that legend types are tied to chart types, some combinations might not work.";
@@ -21,6 +23,7 @@ export var KupEchartLegendPlacement;
 (function (KupEchartLegendPlacement) {
   KupEchartLegendPlacement["BOTTOM"] = "bottom";
   KupEchartLegendPlacement["LEFT"] = "left";
+  KupEchartLegendPlacement["HIDDEN"] = "hidden";
   KupEchartLegendPlacement["RIGHT"] = "right";
   KupEchartLegendPlacement["TOP"] = "top";
 })(KupEchartLegendPlacement || (KupEchartLegendPlacement = {}));

package/dist/collection/components/kup-echart/kup-echart.js

@@ -9,7 +9,7 @@ var __classPrivateFieldSet = (this && this.__classPrivateFieldSet) || function (
   if (typeof state === "function" ? receiver !== state || !f : !state.has(receiver)) throw new TypeError("Cannot write private member to an object whose class did not declare it");
   return (kind === "a" ? f.call(receiver, value) : f ? f.value = value : state.set(receiver, value)), value;
 };
-var _KupEchart_instances, _KupEchart_kupManager, _KupEchart_resizeTimeout, _KupEchart_chartContainer, _KupEchart_chartEl, _KupEchart_gaussianDatasets, _KupEchart_sortedDataset, _KupEchart_themeBorder, _KupEchart_themeBackground, _KupEchart_themeColors, _KupEchart_themeColorBrighter, _KupEchart_themeColorDarker, _KupEchart_themeFont, _KupEchart_themeText, _KupEchart_mapObj, _KupEchart_initChart, _KupEchart_createChart, _KupEchart_createX, _KupEchart_createY, _KupEchart_setAxisColors, _KupEchart_setLegend, _KupEchart_setTitle, _KupEchart_setTooltip, _KupEchart_setVisualMap, _KupEchart_setMapOptions, _KupEchart_setPieOptions, _KupEchart_setGaussianOptions, _KupEchart_addSeries, _KupEchart_setOptions, _KupEchart_fetchThemeColors;
+var _KupEchart_instances, _KupEchart_chartContainer, _KupEchart_chartEl, _KupEchart_gaussianDatasets, _KupEchart_kupManager, _KupEchart_mapObj, _KupEchart_resizeTimeout, _KupEchart_sortedDataset, _KupEchart_themeBorder, _KupEchart_themeBackground, _KupEchart_computedColors, _KupEchart_minColorHeatMap, _KupEchart_maxColorHeatMap, _KupEchart_themeFont, _KupEchart_themeText, _KupEchart_initChart, _KupEchart_createChart, _KupEchart_createX, _KupEchart_createY, _KupEchart_setAxisColors, _KupEchart_setLegend, _KupEchart_setTitle, _KupEchart_setTooltip, _KupEchart_setVisualMap, _KupEchart_setMapOptions, _KupEchart_setPieOptions, _KupEchart_setGaussianOptions, _KupEchart_addSeries, _KupEchart_setOptions, _KupEchart_fetchcomputedColors, _KupEchart_checks;
 import { Component, Element, Event, forceUpdate, getAssetPath, Host, h, Method, Prop, } from '@stencil/core';
 import * as echarts from 'echarts';
 import { KupEchartLegendPlacement, KupEchartMaps, KupEchartProps, KupEchartTypes, } from './kup-echart-declarations';
@@ -19,6 +19,7 @@ import { KupThemeColorValues } from '../../managers/kup-theme/kup-theme-declarat
 import { getProps, setProps } from '../../utils/utils';
 import { componentWrapperId } from '../../variables/GenericVariables';
 import { getColumnByName } from '../../utils/cell-utils';
+import { KupDataNewColumnTypes, } from '../../managers/kup-data/kup-data-declarations';
 export class KupEchart {
   constructor() {
     _KupEchart_instances.add(this);
@@ -30,6 +31,17 @@ export class KupEchart {
      * @default ""
      */
     this.axis = '';
+    /**
+     * Overrides theme's colors.
+     * @default []
+     */
+    this.colors = [];
+    /**
+     * When true, performs checks in order to properly initialize props which could be missing (i.e.: axis).
+     * For performances purposes, this prop will run only once when the component is initially created.
+     * @default false
+     */
+    this.consistencyCheck = false;
     /**
      * Title of the graph.
      * @default null
@@ -47,7 +59,7 @@ export class KupEchart {
      */
     this.data = null;
     /**
-     * Sets the position of the legend. Supported values: bottom, left, right, top. Keep in mind that legend types are tied to chart types, some combinations might not work.
+     * Sets the position of the legend. Supported values: bottom, left, right, top, hidden. Keep in mind that legend types are tied to chart types, some combinations might not work.
      * @default KupEchartLegendPlacement.RIGHT
      */
     this.legend = KupEchartLegendPlacement.RIGHT;
@@ -89,20 +101,20 @@ export class KupEchart {
     /*-------------------------------------------------*/
     /*       I n t e r n a l   V a r i a b l e s       */
     /*-------------------------------------------------*/
-    _KupEchart_kupManager.set(this, kupManagerInstance());
-    _KupEchart_resizeTimeout.set(this, void 0);
     _KupEchart_chartContainer.set(this, void 0);
     _KupEchart_chartEl.set(this, void 0);
     _KupEchart_gaussianDatasets.set(this, void 0);
+    _KupEchart_kupManager.set(this, kupManagerInstance());
+    _KupEchart_mapObj.set(this, {});
+    _KupEchart_resizeTimeout.set(this, void 0);
     _KupEchart_sortedDataset.set(this, null);
     _KupEchart_themeBorder.set(this, null);
     _KupEchart_themeBackground.set(this, null);
-    _KupEchart_themeColors.set(this, null);
-    _KupEchart_themeColorBrighter.set(this, null);
-    _KupEchart_themeColorDarker.set(this, null);
+    _KupEchart_computedColors.set(this, null);
+    _KupEchart_minColorHeatMap.set(this, null);
+    _KupEchart_maxColorHeatMap.set(this, null);
     _KupEchart_themeFont.set(this, null);
     _KupEchart_themeText.set(this, null);
-    _KupEchart_mapObj.set(this, {});
   }
   /*-------------------------------------------------*/
   /*           P u b l i c   M e t h o d s           */
@@ -126,7 +138,19 @@ export class KupEchart {
    */
   async resizeCallback() {
     window.clearTimeout(__classPrivateFieldGet(this, _KupEchart_resizeTimeout, "f"));
-    __classPrivateFieldSet(this, _KupEchart_resizeTimeout, window.setTimeout(() => this.refresh(), 300), "f");
+    __classPrivateFieldSet(this, _KupEchart_resizeTimeout, window.setTimeout(() => {
+      if (__classPrivateFieldGet(this, _KupEchart_chartEl, "f")) {
+        const xMin = this.rootElement.clientWidth - 5;
+        const xMax = this.rootElement.clientWidth + 5;
+        const yMin = this.rootElement.clientHeight - 5;
+        const yMax = this.rootElement.clientHeight + 5;
+        const x = __classPrivateFieldGet(this, _KupEchart_chartEl, "f").getWidth();
+        const y = __classPrivateFieldGet(this, _KupEchart_chartEl, "f").getHeight();
+        if (x < xMin || x > xMax || y < yMin || y > yMax) {
+          __classPrivateFieldGet(this, _KupEchart_chartEl, "f").resize();
+        }
+      }
+    }, 300), "f");
   }
   /**
    * Sets the props to the component.
@@ -141,6 +165,9 @@ export class KupEchart {
   componentWillLoad() {
     __classPrivateFieldGet(this, _KupEchart_kupManager, "f").debug.logLoad(this, false);
     __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.register(this);
+    if (this.consistencyCheck) {
+      __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_checks).call(this);
+    }
   }
   componentDidLoad() {
     __classPrivateFieldGet(this, _KupEchart_kupManager, "f").resize.observe(this.rootElement);
@@ -148,7 +175,7 @@ export class KupEchart {
   }
   componentWillRender() {
     __classPrivateFieldGet(this, _KupEchart_kupManager, "f").debug.logRender(this, false);
-    __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_fetchThemeColors).call(this);
+    __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_fetchcomputedColors).call(this);
   }
   componentDidRender() {
     if (this.data && this.data.columns && this.data.rows) {
@@ -184,7 +211,7 @@ export class KupEchart {
   static get properties() { return {
     "axis": {
       "type": "string",
-      "mutable": false,
+      "mutable": true,
       "complexType": {
         "original": "string",
         "resolved": "string",
@@ -203,6 +230,46 @@ export class KupEchart {
       "reflect": false,
       "defaultValue": "''"
     },
+    "colors": {
+      "type": "unknown",
+      "mutable": false,
+      "complexType": {
+        "original": "string[]",
+        "resolved": "string[]",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "default",
+            "text": "[]"
+          }],
+        "text": "Overrides theme's colors."
+      },
+      "defaultValue": "[]"
+    },
+    "consistencyCheck": {
+      "type": "boolean",
+      "mutable": false,
+      "complexType": {
+        "original": "boolean",
+        "resolved": "boolean",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [{
+            "name": "default",
+            "text": "false"
+          }],
+        "text": "When true, performs checks in order to properly initialize props which could be missing (i.e.: axis).\r\nFor performances purposes, this prop will run only once when the component is initially created."
+      },
+      "attribute": "consistency-check",
+      "reflect": false,
+      "defaultValue": "false"
+    },
     "chartTitle": {
       "type": "unknown",
       "mutable": false,
@@ -280,7 +347,7 @@ export class KupEchart {
       "mutable": false,
       "complexType": {
         "original": "KupEchartLegendPlacement",
-        "resolved": "KupEchartLegendPlacement.BOTTOM | KupEchartLegendPlacement.LEFT | KupEchartLegendPlacement.RIGHT | KupEchartLegendPlacement.TOP",
+        "resolved": "KupEchartLegendPlacement.BOTTOM | KupEchartLegendPlacement.HIDDEN | KupEchartLegendPlacement.LEFT | KupEchartLegendPlacement.RIGHT | KupEchartLegendPlacement.TOP",
         "references": {
           "KupEchartLegendPlacement": {
             "location": "import",
@@ -295,7 +362,7 @@ export class KupEchart {
             "name": "default",
             "text": "KupEchartLegendPlacement.RIGHT"
           }],
-        "text": "Sets the position of the legend. Supported values: bottom, left, right, top. Keep in mind that legend types are tied to chart types, some combinations might not work."
+        "text": "Sets the position of the legend. Supported values: bottom, left, right, top, hidden. Keep in mind that legend types are tied to chart types, some combinations might not work."
       },
       "attribute": "legend",
       "reflect": false,
@@ -583,7 +650,7 @@ export class KupEchart {
   }; }
   static get elementRef() { return "rootElement"; }
 }
-_KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(), _KupEchart_chartContainer = new WeakMap(), _KupEchart_chartEl = new WeakMap(), _KupEchart_gaussianDatasets = new WeakMap(), _KupEchart_sortedDataset = new WeakMap(), _KupEchart_themeBorder = new WeakMap(), _KupEchart_themeBackground = new WeakMap(), _KupEchart_themeColors = new WeakMap(), _KupEchart_themeColorBrighter = new WeakMap(), _KupEchart_themeColorDarker = new WeakMap(), _KupEchart_themeFont = new WeakMap(), _KupEchart_themeText = new WeakMap(), _KupEchart_mapObj = new WeakMap(), _KupEchart_instances = new WeakSet(), _KupEchart_initChart = function _KupEchart_initChart() {
+_KupEchart_chartContainer = new WeakMap(), _KupEchart_chartEl = new WeakMap(), _KupEchart_gaussianDatasets = new WeakMap(), _KupEchart_kupManager = new WeakMap(), _KupEchart_mapObj = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(), _KupEchart_sortedDataset = new WeakMap(), _KupEchart_themeBorder = new WeakMap(), _KupEchart_themeBackground = new WeakMap(), _KupEchart_computedColors = new WeakMap(), _KupEchart_minColorHeatMap = new WeakMap(), _KupEchart_maxColorHeatMap = new WeakMap(), _KupEchart_themeFont = new WeakMap(), _KupEchart_themeText = new WeakMap(), _KupEchart_instances = new WeakSet(), _KupEchart_initChart = function _KupEchart_initChart() {
   if (__classPrivateFieldGet(this, _KupEchart_chartEl, "f")) {
     echarts.dispose(__classPrivateFieldGet(this, _KupEchart_chartContainer, "f"));
   }
@@ -596,18 +663,6 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
   }
 }, _KupEchart_createChart = async function _KupEchart_createChart() {
   __classPrivateFieldSet(this, _KupEchart_sortedDataset, null, "f");
-  if (!this.types.includes(KupEchartTypes.GAUSSIAN) &&
-    (!this.axis ||
-      !__classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.column.find(this.data, { name: this.axis }).length)) {
-    for (let index = 0; index < this.data.columns.length; index++) {
-      const column = this.data.columns[index];
-      if (!__classPrivateFieldGet(this, _KupEchart_kupManager, "f").objects.isNumber(column.obj)) {
-        this.axis = column.name;
-        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").debug.logMessage(this, 'Axis overridden. (' + this.axis + ')', KupDebugCategory.WARNING);
-        break;
-      }
-    }
-  }
   let options = null;
   const firstType = this.types[0];
   switch (firstType) {
@@ -643,12 +698,14 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
   }
   __classPrivateFieldGet(this, _KupEchart_chartEl, "f").setOption(options, true);
   __classPrivateFieldGet(this, _KupEchart_chartEl, "f").on('click', (e) => {
-    const column = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.column.find(this.data, {
+    const column = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.find(this.data, {
       title: e.seriesName,
     })[0];
     let row = null;
     if (e.seriesType === 'map') {
-      row = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.row.find(this.data, { value: __classPrivateFieldGet(this, _KupEchart_mapObj, "f")[e.name] })[0];
+      row = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.row.find(this.data, {
+        value: __classPrivateFieldGet(this, _KupEchart_mapObj, "f")[e.name],
+      })[0];
     }
     else if (__classPrivateFieldGet(this, _KupEchart_sortedDataset, "f") && e.seriesType === 'bar') {
       row = __classPrivateFieldGet(this, _KupEchart_sortedDataset, "f").rows[e.dataIndex];
@@ -745,6 +802,9 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     splitLine: { lineStyle: { color: __classPrivateFieldGet(this, _KupEchart_themeBorder, "f") } },
   };
 }, _KupEchart_setLegend = function _KupEchart_setLegend(y) {
+  if (this.legend === KupEchartLegendPlacement.HIDDEN) {
+    return null;
+  }
   const data = [];
   for (let key in y) {
     data.push(key);
@@ -790,17 +850,23 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
   const colorRange = !hasNumericValues
     ? undefined
     : colors.length > 0
-      ? { inRange: { color: colors }, min: min, max: max }
+      ? {
+        inRange: { color: colors },
+        min: min,
+        max: max,
+        textStyle: { color: __classPrivateFieldGet(this, _KupEchart_themeText, "f") },
+      }
       : {
         inRange: {
-          color: [__classPrivateFieldGet(this, _KupEchart_themeColorBrighter, "f"), __classPrivateFieldGet(this, _KupEchart_themeColorDarker, "f")],
+          color: [__classPrivateFieldGet(this, _KupEchart_minColorHeatMap, "f"), __classPrivateFieldGet(this, _KupEchart_maxColorHeatMap, "f")],
         },
         min: min,
         max: max,
+        textStyle: { color: __classPrivateFieldGet(this, _KupEchart_themeText, "f") },
       };
   if (colorRange) {
     opts.visualMap = Object.assign(Object.assign(Object.assign({}, opts.visualMap), colorRange), { calculable: true, formatter: (value) => {
-        return __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.format(value);
+        return __classPrivateFieldGet(this, _KupEchart_kupManager, "f").math.format(value);
       }, min: min, max: max, show: true });
   }
   return opts;
@@ -846,7 +912,7 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
         color = hexColor;
       }
       else {
-        n = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.numberify(value);
+        n = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").math.numberify(value);
         if (n > max) {
           max = n;
         }
@@ -886,11 +952,9 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
       return null;
     }
     else {
-      //TODO: handle locale properly inside KupData [KupDataLocale]
-      __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.numeral.locale(__classPrivateFieldGet(this, _KupEchart_kupManager, "f").dates.locale);
-      return (params.name +
-        ': ' +
-        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.format(value));
+      return ("<div style='min-width: 60px; text-align: center'>" +
+        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").math.format(value) +
+        '</div>');
     }
   };
   const echartOption = Object.assign({ emphasis: {
@@ -901,13 +965,44 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
       {
         data: data,
         emphasis: {
+          itemStyle: {
+            areaColor: null,
+            borderWidth: 1.5,
+          },
           label: {
+            color: __classPrivateFieldGet(this, _KupEchart_themeText, "f"),
+            fontFamily: __classPrivateFieldGet(this, _KupEchart_themeFont, "f"),
             show: true,
           },
         },
+        itemStyle: {
+          areaColor: __classPrivateFieldGet(this, _KupEchart_themeBackground, "f"),
+          borderColor: __classPrivateFieldGet(this, _KupEchart_themeText, "f"),
+        },
+        label: {
+          backgroundColor: __classPrivateFieldGet(this, _KupEchart_themeBackground, "f"),
+          borderColor: __classPrivateFieldGet(this, _KupEchart_themeBorder, "f"),
+          borderRadius: 4,
+          borderWidth: 1,
+          color: __classPrivateFieldGet(this, _KupEchart_themeText, "f"),
+          fontFamily: __classPrivateFieldGet(this, _KupEchart_themeFont, "f"),
+          padding: 4,
+        },
         map: this.rootElement.id ? this.rootElement.id : '',
-        name: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.column.find(this.data, { name: this.axis })[0].title,
+        name: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.find(this.data, {
+          name: this.axis,
+        })[0].title,
         roam: true,
+        select: {
+          itemStyle: {
+            areaColor: __classPrivateFieldGet(this, _KupEchart_computedColors, "f")[0],
+          },
+          label: {
+            color: __classPrivateFieldGet(this, _KupEchart_themeText, "f"),
+            fontFamily: __classPrivateFieldGet(this, _KupEchart_themeFont, "f"),
+            show: true,
+          },
+        },
         type: 'map',
       },
     ] }, __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setVisualMap).call(this, max, min, colors, hasNumericValues));
@@ -926,13 +1021,15 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     });
   }
   return {
-    color: __classPrivateFieldGet(this, _KupEchart_themeColors, "f"),
+    color: __classPrivateFieldGet(this, _KupEchart_computedColors, "f"),
     legend: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setLegend).call(this, y),
     title: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setTitle).call(this),
     tooltip: Object.assign(Object.assign({}, __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setTooltip).call(this)), { trigger: 'item', formatter: '{a} <br/>{b}: {c} ({d}%)' }),
     series: [
       {
-        name: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.column.find(this.data, { name: this.axis })[0].title,
+        name: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.find(this.data, {
+          name: this.axis,
+        })[0].title,
         type: 'pie',
         data: data,
         emphasis: {
@@ -965,9 +1062,10 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     const column = this.data.columns.find((col) => col.title === key);
     if (type == KupEchartTypes.GAUSSIAN) {
       if (!__classPrivateFieldGet(this, _KupEchart_kupManager, "f").objects.isNumber(column.obj)) {
-        const newDataset = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.distinct(this.data, [column.name]);
-        values =
-          __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.cell.getValue(newDataset, [column.name]);
+        const newDataset = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.distinct(this.data, [column.name]);
+        values = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.cell.getValue(newDataset, [
+          column.name,
+        ]);
         __classPrivateFieldGet(this, _KupEchart_gaussianDatasets, "f")[column.name] = newDataset;
       }
       else {
@@ -977,14 +1075,14 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     else {
       if (needSortDataset) {
         // if there is only one series other than the Gaussian then I apply the sorting algorithm that arranges the data in "mountain"
-        __classPrivateFieldSet(this, _KupEchart_sortedDataset, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.sort(this.data, 'normalDistribution', column.name), "f");
-        values =
-          __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.cell.getValue(__classPrivateFieldGet(this, _KupEchart_sortedDataset, "f"), [column.name]);
+        __classPrivateFieldSet(this, _KupEchart_sortedDataset, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.sort(this.data, 'normalDistribution', column.name), "f");
+        values = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.cell.getValue(__classPrivateFieldGet(this, _KupEchart_sortedDataset, "f"), [column.name]);
         x = __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_createX).call(this, __classPrivateFieldGet(this, _KupEchart_sortedDataset, "f"));
       }
       else {
-        values =
-          __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.cell.getValue(this.data, [column.name]);
+        values = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.cell.getValue(this.data, [
+          column.name,
+        ]);
       }
     }
     __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_addSeries).call(this, type, series, values, key, mixedSeries, needSortDataset);
@@ -1013,7 +1111,7 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
             min: value - (value / 100) * 50,
           },
         };
-        const rows = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.datasetOperations.row.find(__classPrivateFieldGet(this, _KupEchart_gaussianDatasets, "f")[column]
+        const rows = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.row.find(__classPrivateFieldGet(this, _KupEchart_gaussianDatasets, "f")[column]
           ? __classPrivateFieldGet(this, _KupEchart_gaussianDatasets, "f")[column]
           : this.data, filters);
         for (let index = 0; index < rows.length; index++) {
@@ -1070,7 +1168,7 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     yAxisTmp.splice(0, 1);
   }
   return {
-    color: __classPrivateFieldGet(this, _KupEchart_themeColors, "f"),
+    color: __classPrivateFieldGet(this, _KupEchart_computedColors, "f"),
     legend: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setLegend).call(this, y),
     series: series,
     title: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setTitle).call(this),
@@ -1082,7 +1180,7 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
   switch (type) {
     case KupEchartTypes.GAUSSIAN:
       series.push({
-        data: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.normalDistribution(values),
+        data: __classPrivateFieldGet(this, _KupEchart_kupManager, "f").math.normalDistribution(values),
         name: key,
         showSymbol: false,
         smooth: true,
@@ -1133,7 +1231,7 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     i++;
   }
   return {
-    color: __classPrivateFieldGet(this, _KupEchart_themeColors, "f"),
+    color: __classPrivateFieldGet(this, _KupEchart_computedColors, "f"),
     legend: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setLegend).call(this, y),
     series: series,
     title: __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setTitle).call(this),
@@ -1141,8 +1239,8 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
     xAxis: Object.assign(Object.assign(Object.assign({}, __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setAxisColors).call(this)), { data: x, type: 'category' }), this.xAxis),
     yAxis: Object.assign(Object.assign(Object.assign({}, __classPrivateFieldGet(this, _KupEchart_instances, "m", _KupEchart_setAxisColors).call(this)), { type: 'value' }), this.yAxis),
   };
-}, _KupEchart_fetchThemeColors = function _KupEchart_fetchThemeColors() {
-  let colorArray = [];
+}, _KupEchart_fetchcomputedColors = function _KupEchart_fetchcomputedColors() {
+  let colorArray = this.colors && this.colors.length > 0 ? [...this.colors] : [];
   let key = '--kup-chart-color-';
   for (let index = 1; __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.cssVars[key + index]; index++) {
     colorArray.push(__classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.cssVars[key + index]);
@@ -1151,8 +1249,98 @@ _KupEchart_kupManager = new WeakMap(), _KupEchart_resizeTimeout = new WeakMap(),
   __classPrivateFieldSet(this, _KupEchart_themeBorder, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.cssVars[KupThemeColorValues.BORDER], "f");
   __classPrivateFieldSet(this, _KupEchart_themeFont, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.cssVars['--kup-font-family'], "f");
   __classPrivateFieldSet(this, _KupEchart_themeText, __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.cssVars[KupThemeColorValues.TEXT], "f");
-  __classPrivateFieldSet(this, _KupEchart_themeColors, colorArray, "f");
-  const colorCheck = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.colorCheck(colorArray[0]);
-  __classPrivateFieldSet(this, _KupEchart_themeColorDarker, `hsl(${colorCheck.hue}, ${colorCheck.saturation},  ${(parseFloat(colorCheck.lightness) - 30).toString()}%)`, "f");
-  __classPrivateFieldSet(this, _KupEchart_themeColorBrighter, `hsl(${colorCheck.hue}, ${colorCheck.saturation}, ${(parseFloat(colorCheck.lightness) + 30).toString()}%)`, "f");
+  __classPrivateFieldSet(this, _KupEchart_computedColors, colorArray, "f");
+  if (this.colors && this.colors[0]) {
+    __classPrivateFieldSet(this, _KupEchart_maxColorHeatMap, this.colors[0], "f");
+  }
+  else {
+    const colorCheckDark = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.colorCheck(colorArray[0]);
+    __classPrivateFieldSet(this, _KupEchart_maxColorHeatMap, `hsl(${colorCheckDark.hue}, ${colorCheckDark.saturation},  ${(parseFloat(colorCheckDark.lightness) - 30).toString()}%)`, "f");
+  }
+  if (this.colors && this.colors[1]) {
+    __classPrivateFieldSet(this, _KupEchart_minColorHeatMap, this.colors[1], "f");
+  }
+  else {
+    const colorCheckBright = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").theme.colorCheck(colorArray[0]);
+    __classPrivateFieldSet(this, _KupEchart_minColorHeatMap, `hsl(${colorCheckBright.hue}, ${colorCheckBright.saturation}, ${(parseFloat(colorCheckBright.lightness) + 30).toString()}%)`, "f");
+  }
+}, _KupEchart_checks = function _KupEchart_checks() {
+  const gaussianCount = this.types.filter((type) => type === KupEchartTypes.GAUSSIAN).length;
+  const nonGaussianCount = this.types.filter((type) => type === KupEchartTypes.GAUSSIAN).length;
+  // Automatically sets axis when there is no Gaussian chart and when axis is invalid.
+  // The first visible and non-numerical column will be used as axis.
+  if (!gaussianCount &&
+    (!this.axis ||
+      !__classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.find(this.data, {
+        name: this.axis,
+      }).length)) {
+    for (let index = 0; index < this.data.columns.length; index++) {
+      const column = this.data.columns[index];
+      if (column.visible &&
+        !__classPrivateFieldGet(this, _KupEchart_kupManager, "f").objects.isNumber(column.obj)) {
+        this.axis = column.name;
+        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").debug.logMessage(this, 'Axis overridden. (' + this.axis + ')', KupDebugCategory.WARNING);
+        break;
+      }
+    }
+  }
+  // Automatically copies columns when there are multiple types and no specified series.
+  // Also 1 types must be GAUSSIAN.
+  if ((!this.series || !this.series.length) &&
+    gaussianCount === 1 &&
+    nonGaussianCount > 0 &&
+    this.data.columns &&
+    ((this.data.columns.length === 1 && !this.axis) ||
+      (this.data.columns.length === 2 && this.axis))) {
+    const series = !this.axis
+      ? this.data.columns[0]
+      : this.data.columns.filter((col) => col.name !== this.axis)[0];
+    for (let index = 0; index < this.types.length; index++) {
+      const type = this.types[index];
+      if (type !== KupEchartTypes.GAUSSIAN) {
+        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.new(this.data, KupDataNewColumnTypes.DUPLICATE, {
+          columns: [series.name],
+          newColumn: Object.assign(Object.assign({}, series), { name: series.name + '_' + index, title: series.title + ` (${type})` }),
+        });
+      }
+    }
+  }
+  // Checks for multiple series with the same column name, creating duplicate columns in case they are present.
+  // When there are more types than series, new series will be automatically added to match chart types.
+  if (this.series &&
+    this.types &&
+    this.series.length &&
+    this.types.length &&
+    this.data.columns) {
+    if (this.types.length > this.series.length) {
+      const lastSerie = this.series[this.series.length - 1];
+      for (let index = this.series.length; index < this.types.length; index++) {
+        this.series.push(lastSerie);
+      }
+    }
+    const occurrences = {};
+    for (let index = 0; index < this.series.length; index++) {
+      const serie = this.series[index];
+      if (Object.keys(occurrences).includes(serie)) {
+        occurrences[serie].push(index);
+      }
+      else {
+        occurrences[serie] = [index];
+      }
+    }
+    for (const key in occurrences) {
+      const indexes = occurrences[key];
+      for (let index = 1; indexes.length > 1 && index < indexes.length; index++) {
+        const seriesIndex = indexes[index];
+        const column = __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.find(this.data, { name: this.series[seriesIndex] })[0];
+        const newName = column.name + '_' + index;
+        __classPrivateFieldGet(this, _KupEchart_kupManager, "f").data.column.new(this.data, KupDataNewColumnTypes.DUPLICATE, {
+          columns: [column.name],
+          newColumn: Object.assign(Object.assign({}, column), { name: newName, title: column.title +
+              ` (${this.types[seriesIndex]})` }),
+        });
+        this.series[seriesIndex] = newName;
+      }
+    }
+  }
 };

package/dist/collection/components/kup-image/assets/svg/instagram.svg

@@ -0,0 +1 @@
+<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" viewBox="0 0 24 24"><path d="M7.8,2H16.2C19.4,2 22,4.6 22,7.8V16.2A5.8,5.8 0 0,1 16.2,22H7.8C4.6,22 2,19.4 2,16.2V7.8A5.8,5.8 0 0,1 7.8,2M7.6,4A3.6,3.6 0 0,0 4,7.6V16.4C4,18.39 5.61,20 7.6,20H16.4A3.6,3.6 0 0,0 20,16.4V7.6C20,5.61 18.39,4 16.4,4H7.6M17.25,5.5A1.25,1.25 0 0,1 18.5,6.75A1.25,1.25 0 0,1 17.25,8A1.25,1.25 0 0,1 16,6.75A1.25,1.25 0 0,1 17.25,5.5M12,7A5,5 0 0,1 17,12A5,5 0 0,1 12,17A5,5 0 0,1 7,12A5,5 0 0,1 12,7M12,9A3,3 0 0,0 9,12A3,3 0 0,0 12,15A3,3 0 0,0 15,12A3,3 0 0,0 12,9Z" /></svg>