logitude-dashboard-library 1.4.60 → 1.4.62

package/dist/assets/images/copy-icon.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.24985 3.5V1.25C3.24985 0.83579 3.58564 0.5 3.99985 0.5H12.9998C13.4141 0.5 13.7498 0.83579 13.7498 1.25V11.75C13.7498 12.1642 13.4141 12.5 12.9998 12.5H10.7498V14.7493C10.7498 15.1639 10.4124 15.5 9.99475 15.5H1.00499C0.587942 15.5 0.25 15.1665 0.25 14.7493L0.25195 4.25065C0.252025 3.83608 0.58948 3.5 1.00706 3.5H3.24985ZM1.75181 5L1.75014 14H9.24985V5H1.75181ZM4.74985 3.5H10.7498V11H12.2498V2H4.74985V3.5Z" fill="#5FAFDA"/>
+</svg>

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

@@ -274,7 +274,7 @@ $dark-grey: #717585;
     .widget-titles-container {
         display: flex;
         flex-wrap: wrap;
-        width: calc(100% - 4rem);
+        width: calc(100% - 70px);
         padding: 0px 12px 12px 12px;
 
         .title-container {
@@ -321,7 +321,7 @@ $dark-grey: #717585;
     .widget-options-container {
         display: flex;
         align-items: center;
-        width: 45px;
+        width: 68px;
         column-gap: 6px;
 
         svg {

package/dist/copy-icon~GuWdHUAd.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.24985 3.5V1.25C3.24985 0.83579 3.58564 0.5 3.99985 0.5H12.9998C13.4141 0.5 13.7498 0.83579 13.7498 1.25V11.75C13.7498 12.1642 13.4141 12.5 12.9998 12.5H10.7498V14.7493C10.7498 15.1639 10.4124 15.5 9.99475 15.5H1.00499C0.587942 15.5 0.25 15.1665 0.25 14.7493L0.25195 4.25065C0.252025 3.83608 0.58948 3.5 1.00706 3.5H3.24985ZM1.75181 5L1.75014 14H9.24985V5H1.75181ZM4.74985 3.5H10.7498V11H12.2498V2H4.74985V3.5Z" fill="#5FAFDA"/>
+</svg>

package/dist/copy-icon~HOWuQVmq.svg

@@ -0,0 +1,3 @@
+<svg width="14" height="16" viewBox="0 0 14 16" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.24985 3.5V1.25C3.24985 0.83579 3.58564 0.5 3.99985 0.5H12.9998C13.4141 0.5 13.7498 0.83579 13.7498 1.25V11.75C13.7498 12.1642 13.4141 12.5 12.9998 12.5H10.7498V14.7493C10.7498 15.1639 10.4124 15.5 9.99475 15.5H1.00499C0.587942 15.5 0.25 15.1665 0.25 14.7493L0.25195 4.25065C0.252025 3.83608 0.58948 3.5 1.00706 3.5H3.24985ZM1.75181 5L1.75014 14H9.24985V5H1.75181ZM4.74985 3.5H10.7498V11H12.2498V2H4.74985V3.5Z" fill="#5FAFDA"/>
+</svg>

package/dist/copy-icon~RfJyMlEY.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.24985 3.5V1.25C3.24985 0.83579 3.58564 0.5 3.99985 0.5H12.9998C13.4141 0.5 13.7498 0.83579 13.7498 1.25V11.75C13.7498 12.1642 13.4141 12.5 12.9998 12.5H10.7498V14.7493C10.7498 15.1639 10.4124 15.5 9.99475 15.5H1.00499C0.587942 15.5 0.25 15.1665 0.25 14.7493L0.25195 4.25065C0.252025 3.83608 0.58948 3.5 1.00706 3.5H3.24985ZM1.75181 5L1.75014 14H9.24985V5H1.75181ZM4.74985 3.5H10.7498V11H12.2498V2H4.74985V3.5Z" fill="#5FAFDA"/>
+</svg>

package/dist/copy-icon~bdmUelWT.svg

@@ -0,0 +1,3 @@
+<svg viewBox="0 0 22 22" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M3.24985 3.5V1.25C3.24985 0.83579 3.58564 0.5 3.99985 0.5H12.9998C13.4141 0.5 13.7498 0.83579 13.7498 1.25V11.75C13.7498 12.1642 13.4141 12.5 12.9998 12.5H10.7498V14.7493C10.7498 15.1639 10.4124 15.5 9.99475 15.5H1.00499C0.587942 15.5 0.25 15.1665 0.25 14.7493L0.25195 4.25065C0.252025 3.83608 0.58948 3.5 1.00706 3.5H3.24985ZM1.75181 5L1.75014 14H9.24985V5H1.75181ZM4.74985 3.5H10.7498V11H12.2498V2H4.74985V3.5Z" fill="#5FAFDA"/>
+</svg>

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

@@ -18,6 +18,7 @@ declare type DashboardDesignerProps = {
     openEditWidget: (widget: ReactWidgetPM) => void;
     onLayoutChange: (layouts: Layouts) => void;
     onWidgetDelete: (deleteProps: DeleteWidgetProps) => void;
+    onCopyWidget?: (id: string) => void;
     dataBinding: DashboardDataBinding;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };

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

@@ -4,6 +4,7 @@ import { ReactWidgetPM } from "../../types/widget";
 import { DashboardDataBinding } from '../../types/DashboardDataBinding';
 declare type WidgetCardProps = {
     editBtnClicked(widget: any): any;
+    copyBtnClicked?(id: any): any;
     deleteBtnClicked(i: any): any;
     widget: ReactWidgetPM | undefined;
     widgetRef: ReactWidgetPM | undefined;

package/dist/index.d.ts

@@ -15,6 +15,7 @@ declare type DashboardProps = {
         lg: ReactWidgetPM[];
     }) => void;
     openEditWidget: (Widget: ReactWidgetPM) => void;
+    onCopyWidget?: (key: string) => void;
     openDeleteWidgetConfirmWindow: (deleteProps: DeleteWidgetProps) => void;
     onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
 };

package/dist/index.js

@@ -246,7 +246,7 @@ var getLabelFormatByDateGroupType = function getLabelFormatByDateGroupType(label
 };
 
 var KpiChart = function KpiChart(props) {
-  var _widget$current3;
+  var _widget$current4;
   var _useState = React.useState(false),
     dataLoaded = _useState[0],
     setDataLoaded = _useState[1];
@@ -286,12 +286,16 @@ var KpiChart = function KpiChart(props) {
     });
   };
   var kpiClick = function kpiClick() {
-    var _widget$current, _widget$current2, _widget$current2$Widg;
+    var _widget$current, _widget$current2, _widget$current3, _widget$current3$Widg;
     var measureFieldId;
-    if (widget !== null && widget !== void 0 && (_widget$current = widget.current) !== null && _widget$current !== void 0 && _widget$current.WidgetMeasures) measureFieldId = widget === null || widget === void 0 ? void 0 : (_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : (_widget$current2$Widg = _widget$current2.WidgetMeasures[0]) === null || _widget$current2$Widg === void 0 ? void 0 : _widget$current2$Widg.MeasureFieldId;
+    var currentWidgetMeasure = widget === null || widget === void 0 ? void 0 : (_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.WidgetMeasures[0];
+    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;
     props.customChartProps.onSelectDataPoint({
       MeasureFieldId: measureFieldId,
-      Widget: widget.current
+      Widget: widget.current,
+      MeasureCode: currentWidgetMeasure.MeasureCode,
+      Formula: currentWidgetMeasure.Formula,
+      GroupById: data === null || data === void 0 ? void 0 : data.GroupById
     });
   };
   function getRatioComponent() {
@@ -371,7 +375,7 @@ var KpiChart = function KpiChart(props) {
     return React__default.createElement("div", {
       className: "dl-kpi-label-container"
     }, React__default.createElement("span", {
-      className: "dl-kpi-label-span"
+      className: "dl-kpi-label-span dl-kpi-textTrimming"
     }, labelFormated));
   }
   return !dataLoaded ? React__default.createElement("div", {
@@ -385,7 +389,7 @@ var KpiChart = function KpiChart(props) {
     animationDuration: "2s"
   })) : !error ? React__default.createElement("div", {
     onClick: kpiClick,
-    className: ((_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.Alighnment) == "Left" ? "dl-kpi-container-click" : "dl-kpi-container-click dl-kpi-center-container"
+    className: ((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.Alighnment) == "Left" ? "dl-kpi-container-click" : "dl-kpi-container-click dl-kpi-center-container"
   }, React__default.createElement("div", {
     className: "dl-kpi-container"
   }, getLabel(), getValueComponent(), getPreviousValueComponent())) : React__default.createElement("div", {
@@ -520,7 +524,9 @@ function buildDataSource(values, widget) {
       label: getLabelFormatByDateGroupType(e.Label, widget, false),
       id: {
         GroupById: e.GroupById,
-        MeasureFieldId: series.MeasureFieldId
+        MeasureFieldId: series.MeasureFieldId,
+        MeasureCode: series.MeasureCode,
+        Formula: series.Formula
       },
       tooltext: buildToolTip(widget, null, series.Name, e.Label, 0),
       color: getSeriesPositionColor(index + 1)
@@ -538,7 +544,9 @@ function buildDataSet(seriesMeasures, widget) {
         value: e.Value,
         id: {
           GroupById: e.GroupById,
-          MeasureFieldId: seriesMeasure.MeasureFieldId
+          MeasureFieldId: seriesMeasure.MeasureFieldId,
+          MeasureCode: seriesMeasure.MeasureCode,
+          Formula: seriesMeasure.Formula
         },
         tooltext: buildToolTip(widget, e.Value, seriesMeasure.Name, null, index)
       };
@@ -1062,6 +1070,8 @@ var FusionChart = React.forwardRef(function (props, comRef) {
     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
     });
@@ -1169,8 +1179,34 @@ function SvgEditIcon(props) {
   })));
 }
 
+var _path$3;
+function _extends$4() {
+  _extends$4 = Object.assign ? Object.assign.bind() : function (target) {
+    for (var i = 1; i < arguments.length; i++) {
+      var source = arguments[i];
+      for (var key in source) {
+        if (Object.prototype.hasOwnProperty.call(source, key)) {
+          target[key] = source[key];
+        }
+      }
+    }
+    return target;
+  };
+  return _extends$4.apply(this, arguments);
+}
+function SvgCopyIcon(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$4({
+    viewBox: "0 0 22 22",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg"
+  }, props), _path$3 || (_path$3 = /*#__PURE__*/React.createElement("path", {
+    d: "M3.25 3.5V1.25A.75.75 0 014 .5h9a.75.75 0 01.75.75v10.5a.75.75 0 01-.75.75h-2.25v2.25c0 .414-.338.75-.755.75h-8.99a.751.751 0 01-.755-.75l.002-10.5c0-.414.337-.75.755-.75H3.25zM1.752 5l-.002 9h7.5V5H1.752zM4.75 3.5h6V11h1.5V2h-7.5v1.5z",
+    fill: "#5FAFDA"
+  })));
+}
+
 var WidgetCard = React.forwardRef(function (props, comRef) {
-  var _widget$current2, _widget$current3, _widget$current4, _widget$current5, _widget$current6, _widget$current7, _widget$current8;
+  var _widget$current3, _widget$current4, _widget$current5, _widget$current6, _widget$current7, _widget$current8, _widget$current9;
   var widget = React.useRef();
   var _useState = React.useState(false),
     isLoading = _useState[0],
@@ -1184,12 +1220,18 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
   var editWidget = function editWidget() {
     props.editBtnClicked(widget.current);
   };
+  var copyWidget = function copyWidget() {
+    if (props && props.copyBtnClicked) {
+      var _widget$current;
+      props.copyBtnClicked((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.key);
+    }
+  };
   React.useEffect(function () {
     var _props$dataBinding;
     widget.current = props.widget;
     (_props$dataBinding = props.dataBinding) === null || _props$dataBinding === void 0 ? void 0 : _props$dataBinding.onEditWidget.subscribe(function (e) {
-      var _widget$current;
-      if ((e === null || e === void 0 ? void 0 : e.key) != ((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.key)) return;
+      var _widget$current2;
+      if ((e === null || e === void 0 ? void 0 : e.key) != ((_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.key)) return;
       setIsLoading(true);
       widget.current = _extends({}, e);
       setIsLoading(false);
@@ -1240,7 +1282,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
       color: getCSSPropertyValue(widget.current, 'TitleFontColor', ''),
       textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined)
     },
-    "data-pr-tooltip": (_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.Title,
+    "data-pr-tooltip": (_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.Title,
     "data-pr-position": "top",
     onMouseEnter: function onMouseEnter() {
       return showTooltip(true);
@@ -1251,19 +1293,23 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
         return showTooltip(true);
       }, 50);
     }
-  }, (_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.Title)), React__default.createElement("div", {
-    className: (_widget$current4 = widget.current) !== null && _widget$current4 !== void 0 && _widget$current4.Subtitle && ((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.Subtitle.length) > 0 ? "subtitle" : "subtitle margin-top-4",
+  }, (_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.Title)), React__default.createElement("div", {
+    className: (_widget$current5 = widget.current) !== null && _widget$current5 !== void 0 && _widget$current5.Subtitle && ((_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.Subtitle.length) > 0 ? "subtitle" : "subtitle margin-top-4",
     style: {
       fontSize: getCSSPropertyValue(widget.current, 'SubtitleFontSize', 'px'),
       textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined),
       color: getCSSPropertyValue(widget.current, 'SubtitleFontColor', '')
     }
-  }, (_widget$current6 = widget.current) === null || _widget$current6 === void 0 ? void 0 : _widget$current6.Subtitle)), props.isInEditMode && isWidgetHovered ? React__default.createElement("div", {
-    className: (_widget$current7 = widget.current) !== null && _widget$current7 !== void 0 && _widget$current7.Title && ((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.Title.length) > 0 ? "widget-options-container" : "widget-options-container margin-top-6"
+  }, (_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.Subtitle)), props.isInEditMode && isWidgetHovered ? React__default.createElement("div", {
+    className: (_widget$current8 = widget.current) !== null && _widget$current8 !== void 0 && _widget$current8.Title && ((_widget$current9 = widget.current) === null || _widget$current9 === void 0 ? void 0 : _widget$current9.Title.length) > 0 ? "widget-options-container" : "widget-options-container margin-top-6"
   }, React__default.createElement(SvgEditIcon, {
     onClick: function onClick() {
       return editWidget();
     }
+  }), React__default.createElement(SvgCopyIcon, {
+    onClick: function onClick() {
+      return copyWidget();
+    }
   }), React__default.createElement(SvgDeleteIcon, {
     onClick: function onClick() {
       var _props$widget;
@@ -1279,9 +1325,9 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
     className: "dl-dashboard-widget"
   }, " ", GetChartComponent(), " "));
   function GetChartComponent() {
-    var _widget$current9, _widget$current10;
-    if (isLoading || !((_widget$current9 = widget.current) !== null && _widget$current9 !== void 0 && _widget$current9.TypeCode)) return null;
-    if (((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.TypeCode) == "kpi") return React__default.createElement(CustomChart, {
+    var _widget$current10, _widget$current11;
+    if (isLoading || !((_widget$current10 = widget.current) !== null && _widget$current10 !== void 0 && _widget$current10.TypeCode)) return null;
+    if (((_widget$current11 = widget.current) === null || _widget$current11 === void 0 ? void 0 : _widget$current11.TypeCode) == "kpi") return React__default.createElement(CustomChart, {
       dataBinding: props.dataBinding,
       widget: widget.current,
       widgetRef: props.widgetRef,
@@ -1422,6 +1468,11 @@ var DashboardDesigner = function DashboardDesigner(props) {
     widget.ChangeSetOp = 'Update';
     props.openEditWidget(widget);
   }
+  function copyWidget(key) {
+    if (props && props.onCopyWidget) {
+      props.onCopyWidget(key);
+    }
+  }
   function UpdatePlaceholderDimensions(layouts) {
     if (!layouts) return;
     var max = minimumPlaceholderRowsCount;
@@ -1480,6 +1531,7 @@ var DashboardDesigner = function DashboardDesigner(props) {
       editBtnClicked: editWidget,
       deleteBtnClicked: confirmDeleteWidget,
       onSelectDataPoint: props.onSelectDataPoint,
+      copyBtnClicked: copyWidget,
       ref: function ref(el) {
         var _widget$Layout3;
         widgetCardRef.current[i] = {
@@ -1544,6 +1596,11 @@ var Dashboard = function Dashboard(props) {
       setPreviewWidgett(JSON.parse(JSON.stringify(props.widgetData)));
     }
   }, [props.widgetData]);
+  var copyWidget = function copyWidget(key) {
+    if (props && props.onCopyWidget) {
+      props.onCopyWidget(key);
+    }
+  };
   var updateWidgets = function updateWidgets(layouts) {
     var layoutsDic = {};
     Object.keys(layouts).forEach(function (sizeType) {
@@ -1608,6 +1665,7 @@ var Dashboard = function Dashboard(props) {
     onWidgetDelete: function onWidgetDelete(deleteProps) {
       return props.openDeleteWidgetConfirmWindow(deleteProps);
     },
+    onCopyWidget: copyWidget,
     openEditWidget: function openEditWidget(widget) {
       return props.openEditWidget(widget);
     }