@visns-studio/visns-components 5.13.23 → 5.14.0
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/package.json
CHANGED
|
@@ -88,7 +88,7 @@
|
|
|
88
88
|
"react-dom": "^17.0.0 || ^18.0.0"
|
|
89
89
|
},
|
|
90
90
|
"name": "@visns-studio/visns-components",
|
|
91
|
-
"version": "5.
|
|
91
|
+
"version": "5.14.0",
|
|
92
92
|
"description": "Various packages to assist in the development of our Custom Applications.",
|
|
93
93
|
"main": "src/index.js",
|
|
94
94
|
"files": [
|
|
@@ -905,24 +905,69 @@ function GenericDashboard({ setting, userProfile, dynamicDashboard = false }) {
|
|
|
905
905
|
}, {});
|
|
906
906
|
widget.props.legendLabel = (e) =>
|
|
907
907
|
legendMapping[e.id] || e.id;
|
|
908
|
-
|
|
909
|
-
|
|
910
|
-
|
|
911
|
-
|
|
912
|
-
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
908
|
+
}
|
|
909
|
+
|
|
910
|
+
// Always add a tooltip for bar charts to enable hover functionality
|
|
911
|
+
const CustomTooltip = ({ id, value, color, indexValue }) => {
|
|
912
|
+
const label = legendMapping[id] || id;
|
|
913
|
+
return (
|
|
914
|
+
<div
|
|
915
|
+
style={{
|
|
916
|
+
background: 'rgba(255, 255, 255, 0.98)',
|
|
917
|
+
backdropFilter: 'blur(8px)',
|
|
918
|
+
border: 'none',
|
|
919
|
+
borderRadius: '8px',
|
|
920
|
+
padding: '12px 16px',
|
|
921
|
+
boxShadow: '0 8px 32px rgba(0, 0, 0, 0.12)',
|
|
922
|
+
fontSize: '13px',
|
|
923
|
+
fontFamily: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
|
|
924
|
+
minWidth: '200px',
|
|
925
|
+
maxWidth: '320px',
|
|
926
|
+
whiteSpace: 'nowrap'
|
|
927
|
+
}}
|
|
928
|
+
>
|
|
929
|
+
<div
|
|
930
|
+
style={{
|
|
931
|
+
fontSize: '11px',
|
|
932
|
+
color: '#6B7280',
|
|
933
|
+
fontWeight: '500',
|
|
934
|
+
marginBottom: '8px',
|
|
935
|
+
textTransform: 'uppercase',
|
|
936
|
+
letterSpacing: '0.5px'
|
|
917
937
|
}}
|
|
918
938
|
>
|
|
919
|
-
|
|
920
|
-
{value}
|
|
939
|
+
{indexValue}
|
|
921
940
|
</div>
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
941
|
+
<div style={{ display: 'flex', alignItems: 'center', gap: '12px' }}>
|
|
942
|
+
<div
|
|
943
|
+
style={{
|
|
944
|
+
width: '14px',
|
|
945
|
+
height: '14px',
|
|
946
|
+
backgroundColor: color,
|
|
947
|
+
borderRadius: '3px',
|
|
948
|
+
flexShrink: 0
|
|
949
|
+
}}
|
|
950
|
+
/>
|
|
951
|
+
<span style={{
|
|
952
|
+
color: '#1F2937',
|
|
953
|
+
fontWeight: '600',
|
|
954
|
+
fontSize: '14px'
|
|
955
|
+
}}>
|
|
956
|
+
{label}
|
|
957
|
+
</span>
|
|
958
|
+
<span style={{
|
|
959
|
+
color: '#374151',
|
|
960
|
+
fontWeight: '700',
|
|
961
|
+
fontSize: '16px',
|
|
962
|
+
marginLeft: 'auto'
|
|
963
|
+
}}>
|
|
964
|
+
{value}
|
|
965
|
+
</span>
|
|
966
|
+
</div>
|
|
967
|
+
</div>
|
|
968
|
+
);
|
|
969
|
+
};
|
|
970
|
+
widget.props.tooltip = CustomTooltip;
|
|
926
971
|
|
|
927
972
|
// Ensure barData is an array and has items
|
|
928
973
|
if (Array.isArray(barData) && barData.length > 0) {
|