logitude-dashboard-library 3.2.55 → 3.2.57
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.
- package/dist/assets/styles/dl-dashboard.scss +89 -0
- package/dist/features/Dashboard/ChartsComponents/FusionCharts/FusionChartObjectHelper.d.ts +1 -0
- package/dist/features/Dashboard/DashboardDesigner.d.ts +1 -0
- package/dist/features/Dashboard/WidgetCard.d.ts +2 -0
- package/dist/index.d.ts +1 -0
- package/dist/index.js +168 -29
- package/dist/index.js.map +1 -1
- package/dist/index.modern.js +168 -29
- package/dist/index.modern.js.map +1 -1
- package/dist/styles/dl-dashboard.scss +89 -0
- package/package.json +1 -1
|
@@ -1274,4 +1274,93 @@ $dark-grey: #717585;
|
|
|
1274
1274
|
display: block;
|
|
1275
1275
|
overflow: hidden;
|
|
1276
1276
|
text-overflow: ellipsis;
|
|
1277
|
+
}
|
|
1278
|
+
|
|
1279
|
+
// Widget Copy Dropdown (Duplicate / Copy)
|
|
1280
|
+
.widget-copy-dropdown-container {
|
|
1281
|
+
&-content {
|
|
1282
|
+
padding: 0 !important;
|
|
1283
|
+
border-radius: 4px !important;
|
|
1284
|
+
box-shadow: 0px 8px 16px 0px #0000001A !important;
|
|
1285
|
+
border: 1px solid #F3F4F5 !important;
|
|
1286
|
+
}
|
|
1287
|
+
}
|
|
1288
|
+
|
|
1289
|
+
.widget-copy-dropdown-menu {
|
|
1290
|
+
background: #FFFFFF;
|
|
1291
|
+
border-radius: 4px;
|
|
1292
|
+
width: 168px;
|
|
1293
|
+
height: 72px;
|
|
1294
|
+
padding: 8px;
|
|
1295
|
+
display: flex;
|
|
1296
|
+
flex-direction: column;
|
|
1297
|
+
justify-content: center;
|
|
1298
|
+
|
|
1299
|
+
.widget-copy-dropdown-item {
|
|
1300
|
+
padding: 6px 10px;
|
|
1301
|
+
font-family: "Manrope", sans-serif;
|
|
1302
|
+
font-weight: 500;
|
|
1303
|
+
font-size: 12px;
|
|
1304
|
+
line-height: 16px;
|
|
1305
|
+
color: #404040;
|
|
1306
|
+
cursor: pointer;
|
|
1307
|
+
white-space: nowrap;
|
|
1308
|
+
|
|
1309
|
+
&:hover {
|
|
1310
|
+
background-color: #F3F4F5;
|
|
1311
|
+
border-radius: 4px;
|
|
1312
|
+
}
|
|
1313
|
+
}
|
|
1314
|
+
}
|
|
1315
|
+
|
|
1316
|
+
// Widget Copied Notification
|
|
1317
|
+
.widget-copied-notification {
|
|
1318
|
+
position: absolute;
|
|
1319
|
+
top: 32px;
|
|
1320
|
+
left: 8px;
|
|
1321
|
+
background: #19395C;
|
|
1322
|
+
color: #FFFFFF;
|
|
1323
|
+
padding: 6px;
|
|
1324
|
+
border-radius: 4px;
|
|
1325
|
+
display: flex;
|
|
1326
|
+
align-items: center;
|
|
1327
|
+
gap: 4px;
|
|
1328
|
+
z-index: 1000;
|
|
1329
|
+
white-space: nowrap;
|
|
1330
|
+
width: calc(100% - 16px);
|
|
1331
|
+
max-width: calc(100% - 16px);
|
|
1332
|
+
animation: widgetCopiedFadeIn 0.2s ease;
|
|
1333
|
+
|
|
1334
|
+
.widget-copied-notification-check {
|
|
1335
|
+
font-size: 12px;
|
|
1336
|
+
line-height: 16px;
|
|
1337
|
+
}
|
|
1338
|
+
|
|
1339
|
+
.widget-copied-notification-title {
|
|
1340
|
+
font-family: "Manrope", sans-serif;
|
|
1341
|
+
font-weight: 600;
|
|
1342
|
+
font-size: 12px;
|
|
1343
|
+
line-height: 16px;
|
|
1344
|
+
max-width: calc(100% - 50px);
|
|
1345
|
+
overflow: hidden;
|
|
1346
|
+
text-overflow: ellipsis;
|
|
1347
|
+
}
|
|
1348
|
+
|
|
1349
|
+
.widget-copied-notification-text {
|
|
1350
|
+
font-family: "Manrope", sans-serif;
|
|
1351
|
+
font-weight: 500;
|
|
1352
|
+
font-size: 12px;
|
|
1353
|
+
line-height: 16px;
|
|
1354
|
+
}
|
|
1355
|
+
}
|
|
1356
|
+
|
|
1357
|
+
@keyframes widgetCopiedFadeIn {
|
|
1358
|
+
from {
|
|
1359
|
+
opacity: 0;
|
|
1360
|
+
transform: translateY(-4px);
|
|
1361
|
+
}
|
|
1362
|
+
to {
|
|
1363
|
+
opacity: 1;
|
|
1364
|
+
transform: translateY(0);
|
|
1365
|
+
}
|
|
1277
1366
|
}
|
|
@@ -19,6 +19,7 @@ declare type DashboardDesignerProps = {
|
|
|
19
19
|
onLayoutChange: (layouts: Layouts) => void;
|
|
20
20
|
onWidgetDelete: (deleteProps: DeleteWidgetProps) => void;
|
|
21
21
|
onCopyWidget?: (id: string) => void;
|
|
22
|
+
onCopyWidgetToClipboard?: (key: string, widget: ReactWidgetPM) => void;
|
|
22
23
|
dataBinding: DashboardDataBinding;
|
|
23
24
|
onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
|
|
24
25
|
};
|
|
@@ -5,6 +5,8 @@ import { DashboardDataBinding } from '../../types/DashboardDataBinding';
|
|
|
5
5
|
declare type WidgetCardProps = {
|
|
6
6
|
editBtnClicked(widget: any): any;
|
|
7
7
|
copyBtnClicked?(id: any): any;
|
|
8
|
+
duplicateBtnClicked?(id: any): any;
|
|
9
|
+
copyToClipboardBtnClicked?(key: any, widget: ReactWidgetPM): any;
|
|
8
10
|
deleteBtnClicked(i: any): any;
|
|
9
11
|
widget: ReactWidgetPM | undefined;
|
|
10
12
|
widgetRef: ReactWidgetPM | undefined;
|
package/dist/index.d.ts
CHANGED
|
@@ -19,6 +19,7 @@ declare type DashboardProps = {
|
|
|
19
19
|
}) => void;
|
|
20
20
|
openEditWidget: (Widget: ReactWidgetPM) => void;
|
|
21
21
|
onCopyWidget?: (key: string) => void;
|
|
22
|
+
onCopyWidgetToClipboard?: (key: string, widget: ReactWidgetPM) => void;
|
|
22
23
|
openDeleteWidgetConfirmWindow: (deleteProps: DeleteWidgetProps) => void;
|
|
23
24
|
onSelectDataPoint: (dataPointSelection: DataPointSelection) => void;
|
|
24
25
|
};
|
package/dist/index.js
CHANGED
|
@@ -2542,6 +2542,7 @@ var quarters = ["Q", "Q1", "Q2", "Q3", "Q4"];
|
|
|
2542
2542
|
function getCategoriesBasedDataSource(chartInfo, seriesMeasures, widget) {
|
|
2543
2543
|
if (seriesMeasuresIsEmpty(seriesMeasures)) return null;
|
|
2544
2544
|
handelNullLabels(seriesMeasures);
|
|
2545
|
+
setSafeYAxisMaxValue(chartInfo, seriesMeasures, widget);
|
|
2545
2546
|
return {
|
|
2546
2547
|
chart: chartInfo,
|
|
2547
2548
|
categories: buildCategories(seriesMeasures, widget),
|
|
@@ -2551,6 +2552,7 @@ function getCategoriesBasedDataSource(chartInfo, seriesMeasures, widget) {
|
|
|
2551
2552
|
function getStackedDataSource(chartInfo, seriesMeasures, widget) {
|
|
2552
2553
|
if (seriesMeasuresIsEmpty(seriesMeasures)) return null;
|
|
2553
2554
|
handelNullLabels(seriesMeasures);
|
|
2555
|
+
setSafeYAxisMaxValue(chartInfo, seriesMeasures, widget);
|
|
2554
2556
|
return {
|
|
2555
2557
|
chart: chartInfo,
|
|
2556
2558
|
categories: buildStackedCategories(seriesMeasures, widget),
|
|
@@ -2583,6 +2585,66 @@ function seriesMeasuresIsEmpty(seriesMeasures) {
|
|
|
2583
2585
|
return !hasValue;
|
|
2584
2586
|
}
|
|
2585
2587
|
|
|
2588
|
+
function setSafeYAxisMaxValue(chartInfo, seriesMeasures, widget) {
|
|
2589
|
+
if (!isColumnOrBarChart(widget)) return;
|
|
2590
|
+
var maxMeasureValue = getMaxMeasureValue(seriesMeasures, widget);
|
|
2591
|
+
if (maxMeasureValue === null) return;
|
|
2592
|
+
var safeYAxisMaxValue = Math.max(1, Math.ceil(maxMeasureValue * 1.2));
|
|
2593
|
+
chartInfo.yAxisMaxValue = safeYAxisMaxValue.toString();
|
|
2594
|
+
}
|
|
2595
|
+
|
|
2596
|
+
function getMaxMeasureValue(seriesMeasures, widget) {
|
|
2597
|
+
if (!seriesMeasures || seriesMeasures.length === 0) return null;
|
|
2598
|
+
|
|
2599
|
+
if (widget !== null && widget !== void 0 && widget.IsStacked) {
|
|
2600
|
+
var stackedTotalsByGroupId = new Map();
|
|
2601
|
+
seriesMeasures.forEach(function (seriesMeasure) {
|
|
2602
|
+
var _seriesMeasure$Values;
|
|
2603
|
+
|
|
2604
|
+
seriesMeasure === null || seriesMeasure === void 0 ? void 0 : (_seriesMeasure$Values = seriesMeasure.Values) === null || _seriesMeasure$Values === void 0 ? void 0 : _seriesMeasure$Values.forEach(function (valueItem) {
|
|
2605
|
+
var numericValue = toNumericValue(valueItem === null || valueItem === void 0 ? void 0 : valueItem.Value);
|
|
2606
|
+
if (numericValue === null) return;
|
|
2607
|
+
var groupId = valueItem === null || valueItem === void 0 ? void 0 : valueItem.GroupById;
|
|
2608
|
+
var currentTotal = stackedTotalsByGroupId.get(groupId) || 0;
|
|
2609
|
+
stackedTotalsByGroupId.set(groupId, currentTotal + numericValue);
|
|
2610
|
+
});
|
|
2611
|
+
});
|
|
2612
|
+
var maxStackedTotal = null;
|
|
2613
|
+
stackedTotalsByGroupId.forEach(function (total) {
|
|
2614
|
+
if (maxStackedTotal === null || total > maxStackedTotal) {
|
|
2615
|
+
maxStackedTotal = total;
|
|
2616
|
+
}
|
|
2617
|
+
});
|
|
2618
|
+
return maxStackedTotal;
|
|
2619
|
+
}
|
|
2620
|
+
|
|
2621
|
+
var maxValue = null;
|
|
2622
|
+
seriesMeasures.forEach(function (seriesMeasure) {
|
|
2623
|
+
var _seriesMeasure$Values2;
|
|
2624
|
+
|
|
2625
|
+
seriesMeasure === null || seriesMeasure === void 0 ? void 0 : (_seriesMeasure$Values2 = seriesMeasure.Values) === null || _seriesMeasure$Values2 === void 0 ? void 0 : _seriesMeasure$Values2.forEach(function (valueItem) {
|
|
2626
|
+
var numericValue = toNumericValue(valueItem === null || valueItem === void 0 ? void 0 : valueItem.Value);
|
|
2627
|
+
if (numericValue === null) return;
|
|
2628
|
+
|
|
2629
|
+
if (maxValue === null || numericValue > maxValue) {
|
|
2630
|
+
maxValue = numericValue;
|
|
2631
|
+
}
|
|
2632
|
+
});
|
|
2633
|
+
});
|
|
2634
|
+
return maxValue;
|
|
2635
|
+
}
|
|
2636
|
+
|
|
2637
|
+
function toNumericValue(value) {
|
|
2638
|
+
if (value === null || value === undefined || value === "") return null;
|
|
2639
|
+
var numericValue = typeof value === "number" ? value : Number(value);
|
|
2640
|
+
if (!Number.isFinite(numericValue)) return null;
|
|
2641
|
+
return numericValue;
|
|
2642
|
+
}
|
|
2643
|
+
|
|
2644
|
+
function isColumnOrBarChart(widget) {
|
|
2645
|
+
return (widget === null || widget === void 0 ? void 0 : widget.TypeCode) === "column" || (widget === null || widget === void 0 ? void 0 : widget.TypeCode) === "bar";
|
|
2646
|
+
}
|
|
2647
|
+
|
|
2586
2648
|
function buildDataSource(values, widget) {
|
|
2587
2649
|
var data = [];
|
|
2588
2650
|
if (!values || !values[0]) return data;
|
|
@@ -3052,11 +3114,15 @@ function getDefaultChartInfo(widget) {
|
|
|
3052
3114
|
chart.valuePosition = widget.ShowValue && widget.ValuePosition ? widget.ValuePosition : 'Outside';
|
|
3053
3115
|
var isValuePositionInside = widget.ShowValue && widget.ValuePosition && widget.ValuePosition.toLowerCase() == 'inside';
|
|
3054
3116
|
|
|
3055
|
-
if (
|
|
3117
|
+
if (isColumnOrBarChart$1(widget)) {
|
|
3118
|
+
chart.canvasTopPadding = "40";
|
|
3119
|
+
}
|
|
3120
|
+
|
|
3121
|
+
if (widget.ShowValue && widget.ValuePosition && isColumnOrBarChart$1(widget)) {
|
|
3056
3122
|
chart.placeValuesInside = widget.ValuePosition.toLowerCase() == 'inside' ? "1" : "0";
|
|
3057
3123
|
}
|
|
3058
3124
|
|
|
3059
|
-
if (widget.IsStacked && isValuePositionInside && isColumnOrBarChart(widget)) {
|
|
3125
|
+
if (widget.IsStacked && isValuePositionInside && isColumnOrBarChart$1(widget)) {
|
|
3060
3126
|
chart.minPlotHeightForValue = "15";
|
|
3061
3127
|
}
|
|
3062
3128
|
|
|
@@ -3124,7 +3190,7 @@ function getWidgetLegendPosition(widget) {
|
|
|
3124
3190
|
return widget.TypeCode == 'pie' || widget.TypeCode == 'donut' ? "right" : "bottom";
|
|
3125
3191
|
}
|
|
3126
3192
|
|
|
3127
|
-
function isColumnOrBarChart(widget) {
|
|
3193
|
+
function isColumnOrBarChart$1(widget) {
|
|
3128
3194
|
if (!widget) return false;
|
|
3129
3195
|
return widget.TypeCode == 'column' || widget.TypeCode == 'bar';
|
|
3130
3196
|
}
|
|
@@ -4028,7 +4094,7 @@ var FusionChart$1 = React.forwardRef(function (props, comRef) {
|
|
|
4028
4094
|
});
|
|
4029
4095
|
|
|
4030
4096
|
var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
4031
|
-
var _widget$
|
|
4097
|
+
var _widget$current15, _widget$current16, _widget$current17, _widget$current18;
|
|
4032
4098
|
|
|
4033
4099
|
var widget = React.useRef();
|
|
4034
4100
|
|
|
@@ -4050,15 +4116,39 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4050
4116
|
headerErrorMessages = _useState4[0],
|
|
4051
4117
|
setHeaderErrorMessages = _useState4[1];
|
|
4052
4118
|
|
|
4119
|
+
var _useState5 = React.useState(false),
|
|
4120
|
+
showCopiedNotification = _useState5[0],
|
|
4121
|
+
setShowCopiedNotification = _useState5[1];
|
|
4122
|
+
|
|
4123
|
+
var copyPopupRef = React.useRef(null);
|
|
4124
|
+
var copiedNotificationTimer = React.useRef(null);
|
|
4125
|
+
|
|
4053
4126
|
var editWidget = function editWidget() {
|
|
4054
4127
|
props.editBtnClicked(widget.current);
|
|
4055
4128
|
};
|
|
4056
4129
|
|
|
4057
|
-
var
|
|
4058
|
-
if (props && props.
|
|
4130
|
+
var duplicateWidget = function duplicateWidget() {
|
|
4131
|
+
if (props && props.duplicateBtnClicked) {
|
|
4059
4132
|
var _widget$current;
|
|
4060
4133
|
|
|
4061
|
-
props.
|
|
4134
|
+
props.duplicateBtnClicked((_widget$current = widget.current) === null || _widget$current === void 0 ? void 0 : _widget$current.key);
|
|
4135
|
+
} else if (props && props.copyBtnClicked) {
|
|
4136
|
+
var _widget$current2;
|
|
4137
|
+
|
|
4138
|
+
props.copyBtnClicked((_widget$current2 = widget.current) === null || _widget$current2 === void 0 ? void 0 : _widget$current2.key);
|
|
4139
|
+
}
|
|
4140
|
+
};
|
|
4141
|
+
|
|
4142
|
+
var copyWidgetToClipboard = function copyWidgetToClipboard() {
|
|
4143
|
+
if (props && props.copyToClipboardBtnClicked && widget.current) {
|
|
4144
|
+
var _widget$current3;
|
|
4145
|
+
|
|
4146
|
+
props.copyToClipboardBtnClicked((_widget$current3 = widget.current) === null || _widget$current3 === void 0 ? void 0 : _widget$current3.key, widget.current);
|
|
4147
|
+
setShowCopiedNotification(true);
|
|
4148
|
+
if (copiedNotificationTimer.current) clearTimeout(copiedNotificationTimer.current);
|
|
4149
|
+
copiedNotificationTimer.current = setTimeout(function () {
|
|
4150
|
+
setShowCopiedNotification(false);
|
|
4151
|
+
}, 700);
|
|
4062
4152
|
}
|
|
4063
4153
|
};
|
|
4064
4154
|
|
|
@@ -4067,20 +4157,23 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4067
4157
|
|
|
4068
4158
|
widget.current = props.widget;
|
|
4069
4159
|
(_props$dataBinding = props.dataBinding) === null || _props$dataBinding === void 0 ? void 0 : _props$dataBinding.onEditWidget.subscribe(function (e) {
|
|
4070
|
-
var _widget$
|
|
4160
|
+
var _widget$current4;
|
|
4071
4161
|
|
|
4072
|
-
if ((e === null || e === void 0 ? void 0 : e.key) != ((_widget$
|
|
4162
|
+
if ((e === null || e === void 0 ? void 0 : e.key) != ((_widget$current4 = widget.current) === null || _widget$current4 === void 0 ? void 0 : _widget$current4.key)) return;
|
|
4073
4163
|
setIsLoading(true);
|
|
4074
4164
|
widget.current = _extends({}, e);
|
|
4075
4165
|
setIsLoading(false);
|
|
4076
4166
|
});
|
|
4077
4167
|
(_props$dataBinding2 = props.dataBinding) === null || _props$dataBinding2 === void 0 ? void 0 : _props$dataBinding2.widgetUpdated.subscribe(function (updatedWidget) {
|
|
4078
|
-
var _widget$
|
|
4168
|
+
var _widget$current5;
|
|
4079
4169
|
|
|
4080
|
-
if ((updatedWidget === null || updatedWidget === void 0 ? void 0 : updatedWidget.key) != ((_widget$
|
|
4170
|
+
if ((updatedWidget === null || updatedWidget === void 0 ? void 0 : updatedWidget.key) != ((_widget$current5 = widget.current) === null || _widget$current5 === void 0 ? void 0 : _widget$current5.key)) return;
|
|
4081
4171
|
widget.current = _extends({}, updatedWidget);
|
|
4082
4172
|
setTriggerId(uuid.v4());
|
|
4083
4173
|
});
|
|
4174
|
+
return function () {
|
|
4175
|
+
if (copiedNotificationTimer.current) clearTimeout(copiedNotificationTimer.current);
|
|
4176
|
+
};
|
|
4084
4177
|
}, []);
|
|
4085
4178
|
React.useImperativeHandle(comRef, function () {
|
|
4086
4179
|
return {
|
|
@@ -4105,10 +4198,10 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4105
4198
|
};
|
|
4106
4199
|
|
|
4107
4200
|
var GetChartComponent = function GetChartComponent() {
|
|
4108
|
-
var _widget$
|
|
4201
|
+
var _widget$current6, _widget$current7, _widget$current8, _widget$current9, _widget$current10;
|
|
4109
4202
|
|
|
4110
|
-
if (isLoading || !((_widget$
|
|
4111
|
-
if (((_widget$
|
|
4203
|
+
if (isLoading || !((_widget$current6 = widget.current) !== null && _widget$current6 !== void 0 && _widget$current6.TypeCode)) return "";
|
|
4204
|
+
if (((_widget$current7 = widget.current) === null || _widget$current7 === void 0 ? void 0 : _widget$current7.TypeCode) == "kpi") return React__default.createElement(CustomChart, {
|
|
4112
4205
|
isInEditMode: props.isInEditMode,
|
|
4113
4206
|
isPreviewModeActive: props.isPreviewModeActive,
|
|
4114
4207
|
dataBinding: props.dataBinding,
|
|
@@ -4119,7 +4212,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4119
4212
|
return showErrorMsg(errorMsg);
|
|
4120
4213
|
}
|
|
4121
4214
|
});
|
|
4122
|
-
if (((_widget$
|
|
4215
|
+
if (((_widget$current8 = widget.current) === null || _widget$current8 === void 0 ? void 0 : _widget$current8.TypeCode) == "table" || ((_widget$current9 = widget.current) === null || _widget$current9 === void 0 ? void 0 : _widget$current9.TypeCode) == "pivot") return React__default.createElement(CustomChart, {
|
|
4123
4216
|
isInEditMode: props.isInEditMode,
|
|
4124
4217
|
isPreviewModeActive: props.isPreviewModeActive,
|
|
4125
4218
|
dataBinding: props.dataBinding,
|
|
@@ -4127,7 +4220,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4127
4220
|
widgetRef: props.widgetRef,
|
|
4128
4221
|
onSelectDataPoint: props.onSelectDataPoint
|
|
4129
4222
|
});
|
|
4130
|
-
if (((_widget$
|
|
4223
|
+
if (((_widget$current10 = widget.current) === null || _widget$current10 === void 0 ? void 0 : _widget$current10.TypeCode) == "gauge") return React__default.createElement(FusionChart$1, {
|
|
4131
4224
|
ref: fusionChartRef,
|
|
4132
4225
|
dataBinding: props.dataBinding,
|
|
4133
4226
|
widget: widget.current,
|
|
@@ -4186,15 +4279,15 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4186
4279
|
};
|
|
4187
4280
|
|
|
4188
4281
|
var isThereTitle = function isThereTitle() {
|
|
4189
|
-
var _widget$
|
|
4282
|
+
var _widget$current11, _widget$current12;
|
|
4190
4283
|
|
|
4191
|
-
return ((_widget$
|
|
4284
|
+
return ((_widget$current11 = widget.current) === null || _widget$current11 === void 0 ? void 0 : _widget$current11.Title) && ((_widget$current12 = widget.current) === null || _widget$current12 === void 0 ? void 0 : _widget$current12.Title.length) > 0;
|
|
4192
4285
|
};
|
|
4193
4286
|
|
|
4194
4287
|
var isThereSubtitle = function isThereSubtitle() {
|
|
4195
|
-
var _widget$
|
|
4288
|
+
var _widget$current13, _widget$current14;
|
|
4196
4289
|
|
|
4197
|
-
return ((_widget$
|
|
4290
|
+
return ((_widget$current13 = widget.current) === null || _widget$current13 === void 0 ? void 0 : _widget$current13.Subtitle) && ((_widget$current14 = widget.current) === null || _widget$current14 === void 0 ? void 0 : _widget$current14.Subtitle.length) > 0;
|
|
4198
4291
|
};
|
|
4199
4292
|
|
|
4200
4293
|
var tableHintMessage = function tableHintMessage() {
|
|
@@ -4243,7 +4336,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4243
4336
|
color: getCSSPropertyValue(widget.current, 'TitleFontColor', ''),
|
|
4244
4337
|
textAlign: getCSSPropertyValue(widget === null || widget === void 0 ? void 0 : widget.current, 'TitleAlignment', '', undefined)
|
|
4245
4338
|
}
|
|
4246
|
-
}, (_widget$
|
|
4339
|
+
}, (_widget$current15 = widget.current) === null || _widget$current15 === void 0 ? void 0 : _widget$current15.Title),
|
|
4247
4340
|
position: ['top center'],
|
|
4248
4341
|
arrowStyle: {
|
|
4249
4342
|
color: '#19395C'
|
|
@@ -4252,7 +4345,7 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4252
4345
|
on: ['hover', 'focus']
|
|
4253
4346
|
}, React__default.createElement("span", {
|
|
4254
4347
|
className: "widget-title-tooltip-text"
|
|
4255
|
-
}, (_widget$
|
|
4348
|
+
}, (_widget$current16 = widget.current) === null || _widget$current16 === void 0 ? void 0 : _widget$current16.Title))), isTableOrPivotWidget() && isThereTitle() && isThereSubtitle() && React__default.createElement("div", {
|
|
4256
4349
|
className: "titles-vertical-seeparator"
|
|
4257
4350
|
}), React__default.createElement("div", {
|
|
4258
4351
|
className: isThereSubtitle() ? "subtitle" : "subtitle margin-top-4",
|
|
@@ -4262,25 +4355,57 @@ var WidgetCard = React.forwardRef(function (props, comRef) {
|
|
|
4262
4355
|
color: getCSSPropertyValue(widget.current, 'SubtitleFontColor', ''),
|
|
4263
4356
|
minWidth: isThereSubtitle() && isTableOrPivotWidget() ? '5%' : undefined
|
|
4264
4357
|
}
|
|
4265
|
-
}, (_widget$
|
|
4358
|
+
}, (_widget$current17 = widget.current) === null || _widget$current17 === void 0 ? void 0 : _widget$current17.Subtitle)), !isTitleAligmentRight() && isTableOrPivotWidget() && tableHintMessage(), props.isInEditMode && React__default.createElement("div", {
|
|
4266
4359
|
className: isThereTitle() ? "widget-options-container" : "widget-options-container margin-top-6"
|
|
4267
4360
|
}, React__default.createElement("div", null, " ", React__default.createElement(SvgEditIcon, {
|
|
4268
4361
|
className: "widget-card-edit-icon",
|
|
4269
4362
|
onClick: function onClick() {
|
|
4270
4363
|
return editWidget();
|
|
4271
4364
|
}
|
|
4272
|
-
}), " "), React__default.createElement(
|
|
4273
|
-
|
|
4365
|
+
}), " "), React__default.createElement(Popup, {
|
|
4366
|
+
ref: copyPopupRef,
|
|
4367
|
+
className: "widget-copy-dropdown-container",
|
|
4368
|
+
trigger: React__default.createElement("div", null, React__default.createElement(SvgCopyIcon, {
|
|
4369
|
+
className: "widget-card-copy-icon"
|
|
4370
|
+
})),
|
|
4371
|
+
position: ['bottom left', 'bottom center'],
|
|
4372
|
+
closeOnDocumentClick: true,
|
|
4373
|
+
closeOnEscape: true,
|
|
4374
|
+
arrow: false,
|
|
4375
|
+
offsetY: 2
|
|
4376
|
+
}, React__default.createElement("div", {
|
|
4377
|
+
className: "widget-copy-dropdown-menu"
|
|
4378
|
+
}, React__default.createElement("div", {
|
|
4379
|
+
className: "widget-copy-dropdown-item",
|
|
4274
4380
|
onClick: function onClick() {
|
|
4275
|
-
|
|
4381
|
+
var _copyPopupRef$current;
|
|
4382
|
+
|
|
4383
|
+
(_copyPopupRef$current = copyPopupRef.current) === null || _copyPopupRef$current === void 0 ? void 0 : _copyPopupRef$current.close();
|
|
4384
|
+
duplicateWidget();
|
|
4276
4385
|
}
|
|
4277
|
-
}
|
|
4386
|
+
}, "Duplicate"), React__default.createElement("div", {
|
|
4387
|
+
className: "widget-copy-dropdown-item",
|
|
4388
|
+
onClick: function onClick() {
|
|
4389
|
+
var _copyPopupRef$current2;
|
|
4390
|
+
|
|
4391
|
+
(_copyPopupRef$current2 = copyPopupRef.current) === null || _copyPopupRef$current2 === void 0 ? void 0 : _copyPopupRef$current2.close();
|
|
4392
|
+
copyWidgetToClipboard();
|
|
4393
|
+
}
|
|
4394
|
+
}, "Copy"))), React__default.createElement("div", null, " ", React__default.createElement(SvgDeleteIcon, {
|
|
4278
4395
|
onClick: function onClick() {
|
|
4279
4396
|
var _props$widget;
|
|
4280
4397
|
|
|
4281
4398
|
return props.deleteBtnClicked((_props$widget = props.widget) === null || _props$widget === void 0 ? void 0 : _props$widget.key);
|
|
4282
4399
|
}
|
|
4283
|
-
}), " ")),
|
|
4400
|
+
}), " ")), showCopiedNotification && React__default.createElement("div", {
|
|
4401
|
+
className: "widget-copied-notification"
|
|
4402
|
+
}, React__default.createElement("span", {
|
|
4403
|
+
className: "widget-copied-notification-check"
|
|
4404
|
+
}, "\u2713"), React__default.createElement("span", {
|
|
4405
|
+
className: "widget-copied-notification-title"
|
|
4406
|
+
}, (_widget$current18 = widget.current) === null || _widget$current18 === void 0 ? void 0 : _widget$current18.Title), React__default.createElement("span", {
|
|
4407
|
+
className: "widget-copied-notification-text"
|
|
4408
|
+
}, "widget copied")), !props.isInEditMode && showHeaderErrorMessages && React__default.createElement("div", {
|
|
4284
4409
|
className: "header-message-error"
|
|
4285
4410
|
}, React__default.createElement(Popup, {
|
|
4286
4411
|
className: "header-message-error-tooltip-container",
|
|
@@ -4456,6 +4581,12 @@ var DashboardDesigner = function DashboardDesigner(props) {
|
|
|
4456
4581
|
}
|
|
4457
4582
|
}
|
|
4458
4583
|
|
|
4584
|
+
function copyWidgetToClipboard(key, widget) {
|
|
4585
|
+
if (props && props.onCopyWidgetToClipboard) {
|
|
4586
|
+
props.onCopyWidgetToClipboard(key, widget);
|
|
4587
|
+
}
|
|
4588
|
+
}
|
|
4589
|
+
|
|
4459
4590
|
function UpdatePlaceholderDimensions(layouts) {
|
|
4460
4591
|
if (!layouts) return;
|
|
4461
4592
|
var max = minimumPlaceholderRowsCount;
|
|
@@ -4528,7 +4659,8 @@ var DashboardDesigner = function DashboardDesigner(props) {
|
|
|
4528
4659
|
editBtnClicked: editWidget,
|
|
4529
4660
|
deleteBtnClicked: confirmDeleteWidget,
|
|
4530
4661
|
onSelectDataPoint: props.onSelectDataPoint,
|
|
4531
|
-
|
|
4662
|
+
duplicateBtnClicked: copyWidget,
|
|
4663
|
+
copyToClipboardBtnClicked: copyWidgetToClipboard,
|
|
4532
4664
|
ref: function ref(el) {
|
|
4533
4665
|
var _widget$Layout3;
|
|
4534
4666
|
|
|
@@ -4610,6 +4742,12 @@ var Dashboard = function Dashboard(props) {
|
|
|
4610
4742
|
}
|
|
4611
4743
|
};
|
|
4612
4744
|
|
|
4745
|
+
var copyWidgetToClipboard = function copyWidgetToClipboard(key, widget) {
|
|
4746
|
+
if (props && props.onCopyWidgetToClipboard) {
|
|
4747
|
+
props.onCopyWidgetToClipboard(key, widget);
|
|
4748
|
+
}
|
|
4749
|
+
};
|
|
4750
|
+
|
|
4613
4751
|
var updateWidgets = function updateWidgets(layouts) {
|
|
4614
4752
|
var layoutsDic = {};
|
|
4615
4753
|
Object.keys(layouts).forEach(function (sizeType) {
|
|
@@ -4677,6 +4815,7 @@ var Dashboard = function Dashboard(props) {
|
|
|
4677
4815
|
return props.openDeleteWidgetConfirmWindow(deleteProps);
|
|
4678
4816
|
},
|
|
4679
4817
|
onCopyWidget: copyWidget,
|
|
4818
|
+
onCopyWidgetToClipboard: copyWidgetToClipboard,
|
|
4680
4819
|
openEditWidget: function openEditWidget(widget) {
|
|
4681
4820
|
return props.openEditWidget(widget);
|
|
4682
4821
|
}
|