logitude-dashboard-library 1.4.49 → 1.4.50

package/dist/Utils/DateHelper.d.ts

@@ -0,0 +1,3 @@
+import { ReactWidgetPM } from "../types/widget";
+declare const getLabelFormatByDateGroupType: (label: string, widget: ReactWidgetPM, isSecondGrouping?: boolean) => any;
+export { getLabelFormatByDateGroupType };

package/dist/assets/images/red-warning.svg

@@ -7,7 +7,7 @@
 
 <g transform="translate(0.000000,134.000000) scale(0.100000,-0.100000)"
 fill="#ff0000" stroke="none">
-<path d="M705 1329 c-17 -4 -42 -21 -57 -36 -41 -44 -638 -1087 -644 -1124 -8
+<path fill='#CF2528' d="M705 1329 c-17 -4 -42 -21 -57 -36 -41 -44 -638 -1087 -644 -1124 -8
 -53 31 -119 86 -146 l44 -23 616 0 616 0 44 23 c83 42 110 118 70 196 -59 117
 -605 1050 -628 1074 -14 15 -42 32 -61 37 -41 11 -45 11 -86 -1z m116 -378
 c36 -36 38 -86 10 -199 -11 -43 -27 -115 -36 -162 -26 -138 -23 -132 -48 -128

package/dist/features/Dashboard/ChartsComponents/ApexChart.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+/// <reference types="react" />
 import { ReactWidgetPM } from "../../../types/widget";
 import { DataPointSelection } from '../../../types/SeriesMeasure';
 import { ApexOptions } from "apexcharts";
@@ -9,7 +9,7 @@ declare type ApexChartProps = {
     dataBinding: DashboardDataBinding;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };
-declare const ApexChart: (props: ApexChartProps) => React.JSX.Element;
+declare const ApexChart: (props: ApexChartProps) => JSX.Element;
 export declare type ApexChartArgs = {
     options: ApexOptions;
     series: ApexAxisChartSeries | ApexNonAxisChartSeries;

package/dist/features/Dashboard/ChartsComponents/CustomCharts/CustomChart.d.ts

@@ -1,4 +1,4 @@
-import React from "react";
+/// <reference types="react" />
 import { DashboardDataBinding } from "../../../../types/DashboardDataBinding";
 import { DataPointSelection } from "../../../../types/SeriesMeasure";
 import { ReactWidgetPM } from "../../../../types/widget";
@@ -8,5 +8,5 @@ export declare type CustomChartProps = {
     dataBinding: DashboardDataBinding;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };
-declare const CustomChart: (props: CustomChartProps) => React.JSX.Element;
+declare const CustomChart: (props: CustomChartProps) => JSX.Element;
 export default CustomChart;

package/dist/features/Dashboard/ChartsComponents/CustomCharts/KpiChart.d.ts

@@ -1,7 +1,7 @@
-import React from "react";
+/// <reference types="react" />
 import { CustomChartProps } from "./CustomChart";
 declare type KpiChartProps = {
     customChartProps: CustomChartProps;
 };
-declare const KpiChart: (props: KpiChartProps) => React.JSX.Element;
+declare const KpiChart: (props: KpiChartProps) => JSX.Element;
 export default KpiChart;

package/dist/features/Dashboard/ChartsComponents/FusionChartTest.d.ts

@@ -1,3 +1,3 @@
-import React from 'react';
-declare function FusionChartTest(): React.JSX.Element;
+/// <reference types="react" />
+declare function FusionChartTest(): JSX.Element;
 export default FusionChartTest;

package/dist/features/Dashboard/DashboardDesigner.d.ts

@@ -1,5 +1,5 @@
+/// <reference types="react" />
 import { Layouts } from "react-grid-layout";
-import React from "react";
 import { ReactWidgetPM } from "../../types/widget";
 import { DataPointSelection } from "../../types/SeriesMeasure";
 import { DashboardDataBinding } from "../../types/DashboardDataBinding";
@@ -13,7 +13,7 @@ declare type DashboardDesignerProps = {
     dataBinding: DashboardDataBinding;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };
-declare const DashboardDesigner: (props: DashboardDesignerProps) => React.JSX.Element;
+declare const DashboardDesigner: (props: DashboardDesignerProps) => JSX.Element;
 export declare const layoutGridProps: {
     rowHeight: number;
     className: string;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
+/// <reference types="react" />
 import "./styles.module.css";
 import { ReactWidgetPM } from './types/widget';
 import { DashboardDataBinding } from './types/DashboardDataBinding';
@@ -16,5 +16,5 @@ declare type DashboardProps = {
     openEditWidget: (Widget: ReactWidgetPM) => void;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };
-declare const Dashboard: (props: DashboardProps) => React.JSX.Element;
+declare const Dashboard: (props: DashboardProps) => JSX.Element;
 export default Dashboard;

package/dist/index.js

@@ -12,6 +12,7 @@ var ReactFC = _interopDefault(require('react-fusioncharts'));
 var FusionCharts = _interopDefault(require('fusioncharts'));
 var Charts = _interopDefault(require('fusioncharts/fusioncharts.charts'));
 var FusionTheme = _interopDefault(require('fusioncharts/themes/fusioncharts.theme.fusion'));
+var moment = _interopDefault(require('moment'));
 var useResizeObserver = _interopDefault(require('use-resize-observer'));
 
 function _extends() {
@@ -229,8 +230,8 @@ function SvgRedWarning(props) {
     height: 25,
     viewBox: "0 0 150 134"
   }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-    d: "M70.5 1.1c-1.7.4-4.2 2.1-5.7 3.6C60.7 9.1 1 113.4.4 117.1c-.8 5.3 3.1 11.9 8.6 14.6l4.4 2.3h123.2l4.4-2.3c8.3-4.2 11-11.8 7-19.6-5.9-11.7-60.5-105-62.8-107.4C83.8 3.2 81 1.5 79.1 1c-4.1-1.1-4.5-1.1-8.6.1zm11.6 37.8c3.6 3.6 3.8 8.6 1 19.9-1.1 4.3-2.7 11.5-3.6 16.2-2.6 13.8-2.3 13.2-4.8 12.8-1.8-.2-2.3-1.2-3-5.3-.4-2.8-2.1-11.3-3.9-19-4-18.2-4-21 .1-24.7 4.4-4 10.1-3.9 14.2.1zM80 95.7c3.9 2.7 4.9 4.5 5 8.6 0 8.8-10.8 13.1-17.1 6.8-8.2-8.2 2.6-22 12.1-15.4z",
-    fill: "red"
+    fill: "#CF2528",
+    d: "M70.5 1.1c-1.7.4-4.2 2.1-5.7 3.6C60.7 9.1 1 113.4.4 117.1c-.8 5.3 3.1 11.9 8.6 14.6l4.4 2.3h123.2l4.4-2.3c8.3-4.2 11-11.8 7-19.6-5.9-11.7-60.5-105-62.8-107.4C83.8 3.2 81 1.5 79.1 1c-4.1-1.1-4.5-1.1-8.6.1zm11.6 37.8c3.6 3.6 3.8 8.6 1 19.9-1.1 4.3-2.7 11.5-3.6 16.2-2.6 13.8-2.3 13.2-4.8 12.8-1.8-.2-2.3-1.2-3-5.3-.4-2.8-2.1-11.3-3.9-19-4-18.2-4-21 .1-24.7 4.4-4 10.1-3.9 14.2.1zM80 95.7c3.9 2.7 4.9 4.5 5 8.6 0 8.8-10.8 13.1-17.1 6.8-8.2-8.2 2.6-22 12.1-15.4z"
   })));
 }
 
@@ -420,6 +421,70 @@ var CustomChart = function CustomChart(props) {
   }, project());
 };
 
+var DateGroupCodes = {
+  Full_Date: 'Full Date',
+  Month: 'Month',
+  Quarter: 'Quarter',
+  Year: 'Year',
+  Month_Year: 'Month & Year',
+  Quarter_Year: 'Quarter & Year'
+};
+
+var getDateFormat = function getDateFormat(label, _format) {
+  if (!label) return label;
+
+  var _date = moment(label);
+
+  if (!_date || !_date.isValid()) return label;
+  return _date.format(_format);
+};
+
+var getQuarterYearFormat = function getQuarterYearFormat(label) {
+  if (!label) return label;
+
+  if (label.includes("/")) {
+    var result = label.split("/");
+    var quarterVal = result && result[1] ? result[1] : "";
+    var yearVal = result && result[0] ? result[0] : "";
+    return quarterVal + " " + yearVal;
+  }
+
+  return label;
+};
+
+var getLabelFormatByDateGroupType = function getLabelFormatByDateGroupType(label, widget, isSecondGrouping) {
+  if (isSecondGrouping === void 0) {
+    isSecondGrouping = false;
+  }
+
+  if (!widget) return label;
+  var groupFieldDataType = isSecondGrouping ? widget.SecondaryDateGroupCode : widget.DateGroupCode;
+  if (!groupFieldDataType) return label;
+
+  switch (groupFieldDataType) {
+    case DateGroupCodes.Full_Date:
+      return getDateFormat(label, "DD MMM YYYY");
+
+    case DateGroupCodes.Month:
+      return getDateFormat(label, "MMM");
+
+    case DateGroupCodes.Quarter:
+      return label;
+
+    case DateGroupCodes.Year:
+      return getDateFormat(label, "YYYY");
+
+    case DateGroupCodes.Month_Year:
+      return getDateFormat(label, "MMM YYYY");
+
+    case DateGroupCodes.Quarter_Year:
+      return getQuarterYearFormat(label);
+
+    default:
+      return label;
+  }
+};
+
 var mainYellowColor = "#F6CF33";
 var mainRedColor = "#EE5F77";
 var mainGreenColor = "#4AC76F";
@@ -486,7 +551,7 @@ function getCategoriesBasedDataSource(chartInfo, seriesMeasures, widget) {
   handelNullLabels(seriesMeasures);
   return {
     chart: chartInfo,
-    categories: buildCategories(seriesMeasures),
+    categories: buildCategories(seriesMeasures, widget),
     dataset: buildDataSet(seriesMeasures, widget)
   };
 }
@@ -495,7 +560,7 @@ function getStackedDataSource(chartInfo, seriesMeasures, widget) {
   handelNullLabels(seriesMeasures);
   return {
     chart: chartInfo,
-    categories: buildStackedCategories(seriesMeasures),
+    categories: buildStackedCategories(seriesMeasures, widget),
     dataset: buildStackedDataSet(seriesMeasures, widget)
   };
 }
@@ -532,7 +597,7 @@ function buildDataSource(values, widget) {
   data = series.Values.map(function (e, index) {
     var item = {
       value: e.Value,
-      label: e.Label,
+      label: getLabelFormatByDateGroupType(e.Label, widget, false),
       id: {
         GroupById: e.GroupById,
         MeasureFieldId: series.MeasureFieldId
@@ -585,7 +650,7 @@ function buildStackedDataSet(seriesMeasures, widget) {
       return x.code == element.GroupByIdSec;
     })) uniqueGroups.push({
       code: element.GroupByIdSec,
-      label: element.LabelSec
+      label: getLabelFormatByDateGroupType(element.LabelSec, widget, true)
     });
   });
   uniqueGroups.forEach(function (group) {
@@ -621,10 +686,10 @@ function buildStackedGroupData(secGroup, series, widget) {
   return data;
 }
 
-function buildCategories(seriesMeasures) {
+function buildCategories(seriesMeasures, widget) {
   var categories = seriesMeasures[0].Values.map(function (e) {
     return {
-      label: e.Label
+      label: getLabelFormatByDateGroupType(e.Label, widget, false)
     };
   });
   var result = [];
@@ -638,7 +703,7 @@ function buildStackedCategories(seriesMeasures, widget) {
   var uniqueGroups = getUniqueGroupOrderdList(seriesMeasures[0]);
   var categories = uniqueGroups.map(function (e) {
     return {
-      label: e.label
+      label: getLabelFormatByDateGroupType(e.label, widget, false)
     };
   });
   var result = [];