logitude-dashboard-library 1.4.79 → 1.4.81

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/dist/index.js +117 -56
  2. package/dist/index.js.map +1 -1
  3. package/dist/index.modern.js +117 -56
  4. package/dist/index.modern.js.map +1 -1
  5. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -6,6 +6,7 @@ var reactGridLayout = require('react-grid-layout');
6
6
  var progressspinner = require('primereact/progressspinner');
7
7
  var axios = _interopDefault(require('axios'));
8
8
  var moment = _interopDefault(require('moment'));
9
+ var uuid = require('uuid');
9
10
  var ReactFC = _interopDefault(require('react-fusioncharts'));
10
11
  var FusionCharts = _interopDefault(require('fusioncharts'));
11
12
  var Charts = _interopDefault(require('fusioncharts/fusioncharts.charts'));
@@ -310,11 +311,11 @@ var isNullOrUndefined = function isNullOrUndefined(val) {
310
311
  };
311
312
 
312
313
  var KpiChart = function KpiChart(props) {
313
- var _widget$current8;
314
+ var _widget$current17;
314
315
 
315
- var _useState = React.useState(false),
316
- dataLoaded = _useState[0],
317
- setDataLoaded = _useState[1];
316
+ var _useState = React.useState(true),
317
+ isLoading = _useState[0],
318
+ setIsLoading = _useState[1];
318
319
 
319
320
  var _useState2 = React.useState(),
320
321
  error = _useState2[0],
@@ -330,13 +331,23 @@ var KpiChart = function KpiChart(props) {
330
331
  isKPICustomSizeNeeded = _useState4[0],
331
332
  setIsKPICustomSizeNeeded = _useState4[1];
332
333
 
334
+ var _useState5 = React.useState(uuid.v4()),
335
+ triggerId = _useState5[0],
336
+ setTriggerId = _useState5[1];
337
+
333
338
  React.useEffect(function () {
339
+ var _props$customChartPro;
340
+
334
341
  widget.current = props.customChartProps.widget;
335
342
  HandleKPICustomSize();
336
- setDataLoaded(false);
337
- setTimeout(function () {
338
- RefreshData();
339
- }, 500);
343
+ RefreshData();
344
+ (_props$customChartPro = props.customChartProps.dataBinding) === null || _props$customChartPro === void 0 ? void 0 : _props$customChartPro.widgetUpdated.subscribe(function (updatedWidget) {
345
+ var _widget$current;
346
+
347
+ if ((updatedWidget === null || updatedWidget === void 0 ? void 0 : updatedWidget.key) != ((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.key)) return;
348
+ widget.current = _extends({}, updatedWidget);
349
+ setTriggerId(uuid.v4());
350
+ });
340
351
  }, []);
341
352
  React.useEffect(function () {
342
353
  HandleKPICustomSize();
@@ -355,7 +366,7 @@ var KpiChart = function KpiChart(props) {
355
366
  var emptyData = {};
356
367
  emptyData.Value = 0;
357
368
  setData(emptyData);
358
- setDataLoaded(true);
369
+ setIsLoading(false);
359
370
  return;
360
371
  }
361
372
 
@@ -366,22 +377,22 @@ var KpiChart = function KpiChart(props) {
366
377
  postWidget.onChange = undefined;
367
378
  dashboardAnalyticsService.getKpiData(postWidget).then(function (result) {
368
379
  setData(result.data);
369
- setDataLoaded(true);
380
+ setIsLoading(false);
370
381
  }, function (error) {
371
382
  var _error$response, _error$response$data, _error$response2, _error$response2$data;
372
383
 
373
384
  console.log('error', error);
374
385
  if (error !== null && error !== void 0 && (_error$response = error.response) !== null && _error$response !== void 0 && (_error$response$data = _error$response.data) !== null && _error$response$data !== void 0 && _error$response$data.ErrorMessage) setError(error === null || error === void 0 ? void 0 : (_error$response2 = error.response) === null || _error$response2 === void 0 ? void 0 : (_error$response2$data = _error$response2.data) === null || _error$response2$data === void 0 ? void 0 : _error$response2$data.ErrorMessage);else setError(error.message);
375
- setDataLoaded(true);
386
+ setIsLoading(false);
376
387
  });
377
388
  };
378
389
 
379
390
  var kpiClick = function kpiClick() {
380
- var _widget$current, _widget$current2, _widget$current3, _widget$current3$Widg;
391
+ var _widget$current2, _widget$current3, _widget$current4, _widget$current4$Widg;
381
392
 
382
393
  var measureFieldId;
383
- var currentWidgetMeasure = widget === null || widget === void 0 ? void 0 : (_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.WidgetMeasures[0];
384
- if (widget !== null && widget !== void 0 && (_widget$current2 = widget.current) !== null && _widget$current2 !== void 0 && _widget$current2.WidgetMeasures) measureFieldId = widget === null || widget === void 0 ? void 0 : (_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : (_widget$current3$Widg = _widget$current3.WidgetMeasures[0]) === null || _widget$current3$Widg === void 0 ? void 0 : _widget$current3$Widg.MeasureFieldId;
394
+ var currentWidgetMeasure = widget === null || widget === void 0 ? void 0 : (_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.WidgetMeasures[0];
395
+ if (widget !== null && widget !== void 0 && (_widget$current3 = widget.current) !== null && _widget$current3 !== void 0 && _widget$current3.WidgetMeasures) measureFieldId = widget === null || widget === void 0 ? void 0 : (_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : (_widget$current4$Widg = _widget$current4.WidgetMeasures[0]) === null || _widget$current4$Widg === void 0 ? void 0 : _widget$current4$Widg.MeasureFieldId;
385
396
  props.customChartProps.onSelectDataPoint({
386
397
  MeasureFieldId: measureFieldId,
387
398
  Widget: widget.current,
@@ -401,6 +412,8 @@ var KpiChart = function KpiChart(props) {
401
412
  }
402
413
 
403
414
  function getArrowComponent() {
415
+ var _widget$current5, _widget$current6, _widget$current7, _widget$current8, _widget$current9, _widget$current10, _widget$current11, _widget$current12;
416
+
404
417
  if (!data) return null;
405
418
  if ((data === null || data === void 0 ? void 0 : data.Ratio) == 0 || data.Value == data.ComparisonValue || (data.Value == "0" || data.Value == 0) && (data.ComparisonValue == "0" || data.ComparisonValue == 0)) return React__default.createElement("div", {
406
419
  className: "dl-kpi-arrow-container"
@@ -412,22 +425,22 @@ var KpiChart = function KpiChart(props) {
412
425
  marginTop: "2px"
413
426
  }
414
427
  }));
415
- if ((data === null || data === void 0 ? void 0 : data.Ratio) > 1 && (data === null || data === void 0 ? void 0 : data.Increase) == "Positive") return React__default.createElement("div", {
428
+ if ((data === null || data === void 0 ? void 0 : data.Ratio) > 1 && (_widget$current5 = widget.current) !== null && _widget$current5 !== void 0 && _widget$current5.Increase && ((_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.Increase) == "Positive") return React__default.createElement("div", {
416
429
  className: "dl-kpi-arrow-container"
417
430
  }, React__default.createElement("span", {
418
431
  className: "dl-kpi-arrow-pic dl-kpi-arrow-up-green"
419
432
  }));
420
- if ((data === null || data === void 0 ? void 0 : data.Ratio) > 1 && (data === null || data === void 0 ? void 0 : data.Increase) == "Negative") return React__default.createElement("div", {
433
+ if ((data === null || data === void 0 ? void 0 : data.Ratio) > 1 && (_widget$current7 = widget.current) !== null && _widget$current7 !== void 0 && _widget$current7.Increase && ((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.Increase) == "Negative") return React__default.createElement("div", {
421
434
  className: "dl-kpi-arrow-container"
422
435
  }, React__default.createElement("span", {
423
436
  className: "dl-kpi-arrow-pic dl-kpi-arrow-up-red"
424
437
  }));
425
- if ((data === null || data === void 0 ? void 0 : data.Ratio) < 1 && (data === null || data === void 0 ? void 0 : data.Increase) == "Positive") return React__default.createElement("div", {
438
+ if ((data === null || data === void 0 ? void 0 : data.Ratio) < 1 && (_widget$current9 = widget.current) !== null && _widget$current9 !== void 0 && _widget$current9.Increase && ((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.Increase) == "Positive") return React__default.createElement("div", {
426
439
  className: "dl-kpi-arrow-container"
427
440
  }, React__default.createElement("span", {
428
441
  className: "dl-kpi-arrow-pic dl-kpi-arrow-down-red"
429
442
  }));
430
- if ((data === null || data === void 0 ? void 0 : data.Ratio) < 1 && (data === null || data === void 0 ? void 0 : data.Increase) == "Negative") return React__default.createElement("div", {
443
+ if ((data === null || data === void 0 ? void 0 : data.Ratio) < 1 && (_widget$current11 = widget.current) !== null && _widget$current11 !== void 0 && _widget$current11.Increase && ((_widget$current12 = widget.current) === null || _widget$current12 === void 0 ? void 0 : _widget$current12.Increase) == "Negative") return React__default.createElement("div", {
431
444
  className: "dl-kpi-arrow-container"
432
445
  }, React__default.createElement("span", {
433
446
  className: "dl-kpi-arrow-pic dl-kpi-arrow-down-green"
@@ -478,22 +491,22 @@ var KpiChart = function KpiChart(props) {
478
491
  }
479
492
 
480
493
  var getIsKPIHasSmallestHeight = function getIsKPIHasSmallestHeight() {
481
- var _props$customChartPro, _props$customChartPro2;
494
+ var _props$customChartPro2, _props$customChartPro3;
482
495
 
483
- return props.customChartProps.widgetRef && ((_props$customChartPro = props.customChartProps.widgetRef) === null || _props$customChartPro === void 0 ? void 0 : _props$customChartPro.Layout) && ((_props$customChartPro2 = props.customChartProps.widgetRef.Layout) === null || _props$customChartPro2 === void 0 ? void 0 : _props$customChartPro2.h) == 2;
496
+ return props.customChartProps.widgetRef && ((_props$customChartPro2 = props.customChartProps.widgetRef) === null || _props$customChartPro2 === void 0 ? void 0 : _props$customChartPro2.Layout) && ((_props$customChartPro3 = props.customChartProps.widgetRef.Layout) === null || _props$customChartPro3 === void 0 ? void 0 : _props$customChartPro3.h) == 2;
484
497
  };
485
498
 
486
499
  var isKPICustomResizeNeeded = function isKPICustomResizeNeeded() {
487
- var _widget$current4, _widget$current5, _widget$current6, _widget$current7;
500
+ var _widget$current13, _widget$current14, _widget$current15, _widget$current16;
488
501
 
489
502
  if (!widget || !widget.current) return;
490
- var isThereTitle = !isNullOrUndefined((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.Title) && ((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.Title.length) > 0;
491
- var isThereSubTitle = !isNullOrUndefined((_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.Subtitle) && ((_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.Subtitle.length) > 0;
503
+ var isThereTitle = !isNullOrUndefined((_widget$current13 = widget.current) === null || _widget$current13 === void 0 ? void 0 : _widget$current13.Title) && ((_widget$current14 = widget.current) === null || _widget$current14 === void 0 ? void 0 : _widget$current14.Title.length) > 0;
504
+ var isThereSubTitle = !isNullOrUndefined((_widget$current15 = widget.current) === null || _widget$current15 === void 0 ? void 0 : _widget$current15.Subtitle) && ((_widget$current16 = widget.current) === null || _widget$current16 === void 0 ? void 0 : _widget$current16.Subtitle.length) > 0;
492
505
  var isKPIHasSmallestHeight = getIsKPIHasSmallestHeight();
493
506
  return isThereTitle && isThereSubTitle && isKPIHasSmallestHeight;
494
507
  };
495
508
 
496
- return !dataLoaded ? React__default.createElement("div", {
509
+ return isLoading || !widget.current ? React__default.createElement("div", {
497
510
  className: 'dl-full-hight dl-flex-content-center spinner-custome'
498
511
  }, React__default.createElement(progressspinner.ProgressSpinner, {
499
512
  style: {
@@ -502,9 +515,10 @@ var KpiChart = function KpiChart(props) {
502
515
  },
503
516
  strokeWidth: "4",
504
517
  animationDuration: "2s"
505
- })) : !error ? React__default.createElement("div", {
518
+ })) : !error && widget.current ? React__default.createElement("div", {
519
+ key: triggerId,
506
520
  onClick: kpiClick,
507
- className: ((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.Alighnment) == "Left" ? "dl-kpi-container-click db-justify-content-flex-start" : "dl-kpi-container-click"
521
+ className: ((_widget$current17 = widget.current) === null || _widget$current17 === void 0 ? void 0 : _widget$current17.Alighnment) == "Left" ? "dl-kpi-container-click db-justify-content-flex-start" : "dl-kpi-container-click"
508
522
  }, React__default.createElement("div", {
509
523
  className: isKPICustomSizeNeeded ? "dl-kpi-container kpi-custom-size" : "dl-kpi-container"
510
524
  }, getLabel(), getValueComponent(), getPreviousValueComponent())) : React__default.createElement("div", {
@@ -569,6 +583,14 @@ var TableChart = function TableChart(props) {
569
583
  });
570
584
  };
571
585
 
586
+ var getBooleanStringValue = function getBooleanStringValue(value) {
587
+ if (isNullOrUndefined(value)) return "";
588
+
589
+ var _value = value + "";
590
+
591
+ return _value.charAt(0).toUpperCase() + _value.slice(1);
592
+ };
593
+
572
594
  var getDateTimeValue = function getDateTimeValue(value) {
573
595
  if (!value) return value;
574
596
 
@@ -600,7 +622,7 @@ var TableChart = function TableChart(props) {
600
622
  var key = field.FieldCode;
601
623
  var valueType = field.DataTypeCode;
602
624
 
603
- var _value = valueType && (valueType == "Date" || valueType == "DateTime") ? getDateTimeValue(item[key]) : item[key];
625
+ var _value = valueType && (valueType == "Date" || valueType == "DateTime") ? getDateTimeValue(item[key]) : valueType == "Boolean" ? getBooleanStringValue(item[key]) : item[key];
604
626
 
605
627
  _tableRow.push({
606
628
  value: _value
@@ -619,14 +641,14 @@ var TableChart = function TableChart(props) {
619
641
  }, "No data to display.") : React__default.createElement("table", null, React__default.createElement("thead", null, React__default.createElement("tr", null, tableData[0].map(function (el) {
620
642
  return React__default.createElement("th", {
621
643
  key: el.value
622
- }, el.value ? el.value : '');
644
+ }, !isNullOrUndefined(el.value) ? el.value + "" : '');
623
645
  }))), React__default.createElement("tbody", null, tableData.map(function (el, index) {
624
646
  return index == 0 ? null : React__default.createElement("tr", {
625
647
  key: index
626
648
  }, el.map(function (item, index2) {
627
649
  return React__default.createElement("td", {
628
650
  key: index2 + "_" + el.value
629
- }, item.value ? item.value : '');
651
+ }, !isNullOrUndefined(item.value) ? item.value + "" : '');
630
652
  }));
631
653
  })));
632
654
  };
@@ -1384,25 +1406,43 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1384
1406
  error = _useState2[0],
1385
1407
  setError = _useState2[1];
1386
1408
 
1409
+ var _useState3 = React.useState(uuid.v4()),
1410
+ fusionKey = _useState3[0];
1411
+
1412
+ var chartData = React.useRef(null);
1387
1413
  var widget = React.useRef();
1388
1414
 
1389
- var _useState3 = React.useState({}),
1390
- args = _useState3[0],
1391
- setArgs = _useState3[1];
1415
+ var _useState4 = React.useState({}),
1416
+ args = _useState4[0],
1417
+ setArgs = _useState4[1];
1392
1418
 
1393
- var _useState4 = React.useState(),
1394
- fChart = _useState4[0],
1395
- setFchart = _useState4[1];
1419
+ var _useState5 = React.useState(),
1420
+ fChart = _useState5[0],
1421
+ setFchart = _useState5[1];
1396
1422
 
1397
1423
  var id = (Math.random() + 1).toString(36).substring(7);
1398
1424
  var progressRef = React.useRef(null);
1399
1425
  var fusionRef = React.useRef(null);
1400
1426
  var fusionChartHelper = React.useRef();
1401
1427
  React.useEffect(function () {
1428
+ var _props$dataBinding;
1429
+
1402
1430
  widget.current = props.widget;
1403
1431
  setTimeout(function () {
1404
1432
  RefreshData();
1405
1433
  }, 500);
1434
+ (_props$dataBinding = props.dataBinding) === null || _props$dataBinding === void 0 ? void 0 : _props$dataBinding.widgetUpdated.subscribe(function (updatedWidget) {
1435
+ var _widget$current;
1436
+
1437
+ if ((updatedWidget === null || updatedWidget === void 0 ? void 0 : updatedWidget.key) != ((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.key)) return;
1438
+ widget.current = _extends({}, updatedWidget);
1439
+
1440
+ if (chartData && chartData.current) {
1441
+ var _data = JSON.parse(JSON.stringify(chartData.current));
1442
+
1443
+ handleData(_data, true);
1444
+ }
1445
+ });
1406
1446
  }, []);
1407
1447
  React.useEffect(function () {
1408
1448
  var timeout;
@@ -1428,17 +1468,17 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1428
1468
  });
1429
1469
 
1430
1470
  var HandleSizeChange = function HandleSizeChange() {
1431
- var _widget$current, _widget$current2;
1471
+ var _widget$current2, _widget$current3;
1432
1472
 
1433
- if (!widget || ((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.TypeCode) != "pie" && ((_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.TypeCode) != "donut") return;
1473
+ if (!widget || ((_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.TypeCode) != "pie" && ((_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.TypeCode) != "donut") return;
1434
1474
  setTimeout(function () {
1435
- var _fusionChartHelper$cu, _fusionChartHelper$cu2, _fusionChartHelper$cu3, _fusionRef$current, _fusionRef$current2, _widget$current3, _fusionChartHelper$cu4, _widget$current4, _fusionChartHelper$cu5;
1475
+ var _fusionChartHelper$cu, _fusionChartHelper$cu2, _fusionChartHelper$cu3, _fusionRef$current, _fusionRef$current2, _widget$current4, _fusionChartHelper$cu4, _widget$current5, _fusionChartHelper$cu5;
1436
1476
 
1437
1477
  var oldPieRadius = fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu = fusionChartHelper.current) === null || _fusionChartHelper$cu === void 0 ? void 0 : _fusionChartHelper$cu.getPieRadius();
1438
1478
  var oldLegendWidth = fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu2 = fusionChartHelper.current) === null || _fusionChartHelper$cu2 === void 0 ? void 0 : _fusionChartHelper$cu2.getLegendWidth();
1439
1479
  fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu3 = fusionChartHelper.current) === null || _fusionChartHelper$cu3 === void 0 ? void 0 : _fusionChartHelper$cu3.trimChartLabels(fusionRef === null || fusionRef === void 0 ? void 0 : (_fusionRef$current = fusionRef.current) === null || _fusionRef$current === void 0 ? void 0 : _fusionRef$current.offsetWidth, fusionRef === null || fusionRef === void 0 ? void 0 : (_fusionRef$current2 = fusionRef.current) === null || _fusionRef$current2 === void 0 ? void 0 : _fusionRef$current2.offsetHeight);
1440
- if (((_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.LabelsPosition) != 'InLegend' && oldPieRadius == (fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu4 = fusionChartHelper.current) === null || _fusionChartHelper$cu4 === void 0 ? void 0 : _fusionChartHelper$cu4.getPieRadius())) return;
1441
- if (((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.LabelsPosition) == 'InLegend' && oldLegendWidth == (fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu5 = fusionChartHelper.current) === null || _fusionChartHelper$cu5 === void 0 ? void 0 : _fusionChartHelper$cu5.getLegendWidth())) return;
1480
+ if (((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.LabelsPosition) != 'InLegend' && oldPieRadius == (fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu4 = fusionChartHelper.current) === null || _fusionChartHelper$cu4 === void 0 ? void 0 : _fusionChartHelper$cu4.getPieRadius())) return;
1481
+ if (((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.LabelsPosition) == 'InLegend' && oldLegendWidth == (fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : (_fusionChartHelper$cu5 = fusionChartHelper.current) === null || _fusionChartHelper$cu5 === void 0 ? void 0 : _fusionChartHelper$cu5.getLegendWidth())) return;
1442
1482
  setDataLoaded(false);
1443
1483
  setTimeout(function () {
1444
1484
  setDataLoaded(true);
@@ -1459,6 +1499,7 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1459
1499
  postWidget.onChange = undefined;
1460
1500
  dashboardAnalyticsService.getData(postWidget).then(function (result) {
1461
1501
  handleData(result === null || result === void 0 ? void 0 : result.data);
1502
+ chartData.current = result === null || result === void 0 ? void 0 : result.data;
1462
1503
  }, function (error) {
1463
1504
  var _error$response, _error$response$data, _error$response2, _error$response2$data;
1464
1505
 
@@ -1468,14 +1509,21 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1468
1509
  });
1469
1510
  };
1470
1511
 
1471
- var handleData = function handleData(data) {
1512
+ var handleData = function handleData(data, isDummyChange) {
1472
1513
  var _progressRef$current, _progressRef$current2;
1473
1514
 
1515
+ if (isDummyChange === void 0) {
1516
+ isDummyChange = false;
1517
+ }
1518
+
1474
1519
  var chart = BuildFusionChartObject(data, widget.current);
1475
1520
  fusionChartHelper.current = new FusionChartHelper(widget.current, chart);
1476
1521
  fusionChartHelper === null || fusionChartHelper === void 0 ? void 0 : fusionChartHelper.current.trimChartLabels(progressRef === null || progressRef === void 0 ? void 0 : (_progressRef$current = progressRef.current) === null || _progressRef$current === void 0 ? void 0 : _progressRef$current.offsetWidth, progressRef === null || progressRef === void 0 ? void 0 : (_progressRef$current2 = progressRef.current) === null || _progressRef$current2 === void 0 ? void 0 : _progressRef$current2.offsetHeight);
1477
1522
  setArgs(chart);
1478
- setDataLoaded(true);
1523
+
1524
+ if (!isDummyChange) {
1525
+ setDataLoaded(true);
1526
+ }
1479
1527
  };
1480
1528
 
1481
1529
  var dataplotClick = function dataplotClick(eventObj, dataObj) {
@@ -1517,7 +1565,8 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1517
1565
  })) : !error ? React__default.createElement("div", {
1518
1566
  className: 'db-fc-parent-container',
1519
1567
  ref: fusionRef
1520
- }, " ", React__default.createElement("div", {
1568
+ }, React__default.createElement("div", {
1569
+ key: fusionKey,
1521
1570
  className: 'db-fc-container',
1522
1571
  ref: ref,
1523
1572
  id: id
@@ -1525,7 +1574,7 @@ var FusionChart = React.forwardRef(function (props, comRef) {
1525
1574
  "fcEvent-dataplotClick": dataplotClick,
1526
1575
  onRender: renderComplete,
1527
1576
  "fcEvent-drawComplete": drawComplete
1528
- }))), " ") : React__default.createElement("div", {
1577
+ })))) : React__default.createElement("div", {
1529
1578
  className: "dl-flex-content-center dl-full-hight",
1530
1579
  style: {
1531
1580
  width: '100%'
@@ -1630,7 +1679,7 @@ function SvgCopyIcon(props) {
1630
1679
  }
1631
1680
 
1632
1681
  var WidgetCard = React.forwardRef(function (props, comRef) {
1633
- var _widget$current6, _widget$current7, _widget$current8, _widget$current9, _widget$current10, _widget$current11, _widget$current12;
1682
+ var _widget$current7, _widget$current8, _widget$current9, _widget$current10, _widget$current11, _widget$current12, _widget$current13;
1634
1683
 
1635
1684
  var widget = React.useRef();
1636
1685
 
@@ -1644,6 +1693,10 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1644
1693
 
1645
1694
  var fusionChartRef = React.useRef(null);
1646
1695
 
1696
+ var _useState3 = React.useState(uuid.v4()),
1697
+ triggerId = _useState3[0],
1698
+ setTriggerId = _useState3[1];
1699
+
1647
1700
  var editWidget = function editWidget() {
1648
1701
  props.editBtnClicked(widget.current);
1649
1702
  };
@@ -1657,7 +1710,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1657
1710
  };
1658
1711
 
1659
1712
  React.useEffect(function () {
1660
- var _props$dataBinding;
1713
+ var _props$dataBinding, _props$dataBinding2;
1661
1714
 
1662
1715
  widget.current = props.widget;
1663
1716
  (_props$dataBinding = props.dataBinding) === null || _props$dataBinding === void 0 ? void 0 : _props$dataBinding.onEditWidget.subscribe(function (e) {
@@ -1668,6 +1721,13 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1668
1721
  widget.current = _extends({}, e);
1669
1722
  setIsLoading(false);
1670
1723
  });
1724
+ (_props$dataBinding2 = props.dataBinding) === null || _props$dataBinding2 === void 0 ? void 0 : _props$dataBinding2.widgetUpdated.subscribe(function (updatedWidget) {
1725
+ var _widget$current3;
1726
+
1727
+ if ((updatedWidget === null || updatedWidget === void 0 ? void 0 : updatedWidget.key) != ((_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.key)) return;
1728
+ widget.current = _extends({}, updatedWidget);
1729
+ setTriggerId(uuid.v4());
1730
+ });
1671
1731
  }, []);
1672
1732
  React.useImperativeHandle(comRef, function () {
1673
1733
  return {
@@ -1692,10 +1752,10 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1692
1752
  };
1693
1753
 
1694
1754
  var GetChartComponent = function GetChartComponent() {
1695
- var _widget$current3, _widget$current4, _widget$current5;
1755
+ var _widget$current4, _widget$current5, _widget$current6;
1696
1756
 
1697
- if (isLoading || !((_widget$current3 = widget.current) !== null && _widget$current3 !== void 0 && _widget$current3.TypeCode)) return "";
1698
- if (((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.TypeCode) == "kpi" || ((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.TypeCode) == "table") return React__default.createElement(CustomChart, {
1757
+ if (isLoading || !((_widget$current4 = widget.current) !== null && _widget$current4 !== void 0 && _widget$current4.TypeCode)) return "";
1758
+ if (((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.TypeCode) == "kpi" || ((_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.TypeCode) == "table") return React__default.createElement(CustomChart, {
1699
1759
  isPreviewModeActive: props.isPreviewModeActive,
1700
1760
  dataBinding: props.dataBinding,
1701
1761
  widget: widget.current,
@@ -1721,6 +1781,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1721
1781
  setIsWidgetHovered(false);
1722
1782
  }
1723
1783
  }, React__default.createElement("header", {
1784
+ key: triggerId,
1724
1785
  className: "widget-header"
1725
1786
  }, React__default.createElement("div", {
1726
1787
  className: "header-contents"
@@ -1743,7 +1804,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1743
1804
  color: getCSSPropertyValue(widget.current, 'TitleFontColor', ''),
1744
1805
  textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined)
1745
1806
  }
1746
- }, (_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.Title),
1807
+ }, (_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.Title),
1747
1808
  position: ['top center'],
1748
1809
  arrowStyle: {
1749
1810
  color: '#262626'
@@ -1752,15 +1813,15 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
1752
1813
  on: ['hover', 'focus']
1753
1814
  }, React__default.createElement("span", {
1754
1815
  className: "widget-title-tooltip-text"
1755
- }, (_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.Title))), React__default.createElement("div", {
1756
- className: (_widget$current8 = widget.current) !== null && _widget$current8 !== void 0 && _widget$current8.Subtitle && ((_widget$current9 = widget.current) === null || _widget$current9 === void 0 ? void 0 : _widget$current9.Subtitle.length) > 0 ? "subtitle" : "subtitle margin-top-4",
1816
+ }, (_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.Title))), React__default.createElement("div", {
1817
+ className: (_widget$current9 = widget.current) !== null && _widget$current9 !== void 0 && _widget$current9.Subtitle && ((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.Subtitle.length) > 0 ? "subtitle" : "subtitle margin-top-4",
1757
1818
  style: {
1758
1819
  fontSize: getCSSPropertyValue(widget.current, 'SubtitleFontSize', 'px'),
1759
1820
  textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined),
1760
1821
  color: getCSSPropertyValue(widget.current, 'SubtitleFontColor', '')
1761
1822
  }
1762
- }, (_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.Subtitle)), React__default.createElement("div", {
1763
- className: (_widget$current11 = widget.current) !== null && _widget$current11 !== void 0 && _widget$current11.Title && ((_widget$current12 = widget.current) === null || _widget$current12 === void 0 ? void 0 : _widget$current12.Title.length) > 0 ? "widget-options-container" : "widget-options-container margin-top-6"
1823
+ }, (_widget$current11 = widget.current) === null || _widget$current11 === void 0 ? void 0 : _widget$current11.Subtitle)), React__default.createElement("div", {
1824
+ className: (_widget$current12 = widget.current) !== null && _widget$current12 !== void 0 && _widget$current12.Title && ((_widget$current13 = widget.current) === null || _widget$current13 === void 0 ? void 0 : _widget$current13.Title.length) > 0 ? "widget-options-container" : "widget-options-container margin-top-6"
1764
1825
  }, props.isInEditMode && isWidgetHovered ? React__default.createElement(React__default.Fragment, null, React__default.createElement(SvgEditIcon, {
1765
1826
  onClick: function onClick() {
1766
1827
  return editWidget();
@@ -2056,7 +2117,7 @@ var Dashboard = function Dashboard(props) {
2056
2117
 
2057
2118
  var _useState4 = React.useState(props.widgetData),
2058
2119
  previewWidget = _useState4[0],
2059
- setPreviewWidgett = _useState4[1];
2120
+ setPreviewWidget = _useState4[1];
2060
2121
 
2061
2122
  React.useEffect(function () {
2062
2123
  Session.CurrentUserId = props.userId;
@@ -2077,7 +2138,7 @@ var Dashboard = function Dashboard(props) {
2077
2138
  }, []);
2078
2139
  React.useEffect(function () {
2079
2140
  if (props.widgetData) {
2080
- setPreviewWidgett(JSON.parse(JSON.stringify(props.widgetData)));
2141
+ setPreviewWidget(JSON.parse(JSON.stringify(props.widgetData)));
2081
2142
  }
2082
2143
  }, [props.widgetData]);
2083
2144