logitude-dashboard-library 3.1.102 → 3.1.103

package/dist/assets/styles/dl-dashboard.scss

@@ -658,12 +658,12 @@ $dark-grey: #717585;
     font-weight: bold;
 }
 
-.db-fc-container {
+.db-fc-parent-container {
     width: 100%;
     height: calc(100% - 5px);
 }
 
-.db-fc-parent-container {
+.db-fc-container {
     width: 100%;
     height: calc(100% - 5px);
 }
@@ -674,6 +674,7 @@ $dark-grey: #717585;
     fill: #323232 !important;
     fill-opacity: 100 !important;
 }
+
 .db-fc-container tspan {
     font-family: 'Manrope' !important;
     font-size: inherit !important;
@@ -691,6 +692,34 @@ $dark-grey: #717585;
     height: 100%;
 }
 
+.db-fc-container-guage {
+    width: 100%;
+    height: calc(100% - 5px);
+}
+
+.db-fc-container-guage text {
+    font-family: 'Manrope' !important;
+    font-size: inherit !important;
+    fill-opacity: 100 !important;
+}
+
+.db-fc-container-guage tspan {
+    font-family: 'Manrope' !important;
+    font-size: inherit !important;
+    fill: #323232 !important;
+    fill-opacity: 100 !important;
+}
+
+.db-fc-container-guage * {
+    font-family: 'Manrope' !important;
+    // font-size: 10px !important;
+}
+
+.db-fc-container-guage>*:first-child {
+    width: 100%;
+    height: 100%;
+}
+
 .dl-line {
     border-top: 1px solid #E7E7E7;
     margin-left: 12px;

package/dist/features/Dashboard/ChartsComponents/FusionCharts/FusionChartObjectBuilder.d.ts

@@ -2,4 +2,4 @@ import { ChartObject } from "fusioncharts";
 import { SeriesMeasure } from "../../../../types/SeriesMeasure";
 import { ReactWidgetPM } from "../../../../types/widget";
 export declare function BuildFusionChartObject(seriesMeasures: SeriesMeasure[], widget: ReactWidgetPM): ChartObject;
-export declare const getGaugeObject: (data: any, widget: ReactWidgetPM) => ChartObject;
+export declare const getGaugeObject: (data: any, widget: ReactWidgetPM, isPreviewModeActive?: boolean | undefined) => ChartObject;

package/dist/features/Dashboard/ChartsComponents/FusionCharts/FusionChartObjectHelper.d.ts

@@ -93,6 +93,8 @@ export interface ChartInfo {
     manageResize: string | null;
     valueBelowPivot: string | null;
     showValue: string | null;
+    valueFontSize: string | null;
+    valueFontColor: string | null;
     autoScale: string | null;
     formatNumber: string | null;
     forceDecimals: string | null;

package/dist/index.js

@@ -2701,13 +2701,15 @@ var getWidgetRanges = function getWidgetRanges(widget, value) {
   return gaugeRanges;
 };
 
-var getGaugeObject = function getGaugeObject(data, widget) {
+var getGaugeObject = function getGaugeObject(data, widget, isPreviewModeActive) {
   var fusionObject = getDefaultChartobject();
   fusionObject.type = 'angulargauge';
   var chartInfo = getDefaultChartInfo(widget);
   chartInfo.manageResize = "1";
   chartInfo.valueBelowPivot = "1";
-  chartInfo.showValue = "1";
+  chartInfo.showValue = widget.ShowValue ? "1" : '0';
+  chartInfo.valueFontSize = widget.ShowValue ? widget.ValueFontSize : null;
+  chartInfo.valueFontColor = widget.ShowValue ? widget.ValueFontColor : null;
   chartInfo.autoScale = "1";
   chartInfo.chartTopMargin = "0";
   chartInfo.chartBottomMargin = "0";
@@ -2721,7 +2723,8 @@ var getGaugeObject = function getGaugeObject(data, widget) {
     },
     "dials": {
       "dial": [{
-        "value": getTruncatedValue(value, widget)
+        "value": getTruncatedValue(value, widget),
+        "tooltext": !isPreviewModeActive ? "Click for more details" : null
       }]
     }
   };
@@ -3811,7 +3814,7 @@ var FusionChart$1 = React.forwardRef(function (props, comRef) {
       isDummyChange = false;
     }
 
-    var chart = getGaugeObject(data, widget.current);
+    var chart = getGaugeObject(data, widget.current, props.isPreviewModeActive);
     setArgs(chart);
 
     if (!isDummyChange) {
@@ -3823,6 +3826,67 @@ var FusionChart$1 = React.forwardRef(function (props, comRef) {
     }
   };
 
+  var dataplotClick = function dataplotClick(eventObj, dataObj) {
+    props.onSelectDataPoint({
+      GroupById: dataObj.id.groupbyid,
+      MeasureFieldId: dataObj.id.measurefieldid,
+      MeasureCode: dataObj.id.measurecode,
+      Formula: dataObj.id.formula,
+      Widget: widget.current,
+      GroupByIdSec: dataObj.id.groupbyidsec
+    });
+  };
+
+  var renderComplete = function renderComplete(eventObj) {
+    var chartRef = eventObj.sender;
+    var chartContainer = FusionCharts.getObjectReference(chartRef.id);
+
+    if (!chartContainer) {
+      console.error('Chart container is undefined');
+      return;
+    }
+
+    var svgContainer = chartContainer.querySelector('svg');
+
+    if (!svgContainer) {
+      console.error('SVG Container is undefined');
+      return;
+    }
+
+    var textElements = svgContainer.querySelectorAll('text');
+
+    if (textElements.length > 0) {
+      var lastTextElement = textElements[textElements.length - 1];
+
+      if (!props.isPreviewModeActive) {
+        lastTextElement.style.cursor = 'pointer';
+        lastTextElement.style.transition = 'fill 0.2s, text-decoration 0.2s';
+        lastTextElement.addEventListener('mouseenter', function () {
+          lastTextElement.style.fill = '#007bff';
+          lastTextElement.style.textDecoration = 'underline';
+        });
+        lastTextElement.addEventListener('mouseleave', function () {
+          lastTextElement.style.fill = '';
+          lastTextElement.style.textDecoration = 'none';
+        });
+      }
+
+      lastTextElement.addEventListener('click', function () {
+        var _widget$current2, _widget$current3, _widget$current4, _widget$current4$Widg;
+
+        var measureFieldId;
+        var currentWidgetMeasure = widget === null || widget === void 0 ? void 0 : (_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.WidgetMeasures[0];
+        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;
+        props.onSelectDataPoint({
+          MeasureFieldId: measureFieldId,
+          Widget: widget.current,
+          MeasureCode: currentWidgetMeasure.MeasureCode,
+          Formula: currentWidgetMeasure.Formula
+        });
+      });
+    }
+  };
+
   return !dataLoaded ? React__default.createElement("div", {
     ref: progressRef,
     className: 'dl-full-hight dl-flex-content-center spinner-custome'
@@ -3837,10 +3901,13 @@ var FusionChart$1 = React.forwardRef(function (props, comRef) {
     className: 'db-fc-parent-container',
     ref: fusionRef
   }, React__default.createElement("div", {
-    className: 'db-fc-container',
+    className: 'db-fc-container-guage',
     key: fusionKey,
     id: chartContainerId
-  }, React__default.createElement(ReactFC, Object.assign({}, args)))) : React__default.createElement("div", {
+  }, React__default.createElement(ReactFC, Object.assign({}, args, {
+    "fcEvent-dataplotClick": dataplotClick,
+    "fcEvent-renderComplete": renderComplete
+  })))) : React__default.createElement("div", {
     className: "dl-flex-content-center dl-full-hight",
     style: {
       width: '100%'