impaktapps-design 0.2.87 → 0.2.88
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/impaktapps-design.es.js +49 -39
- package/dist/impaktapps-design.es.js.map +1 -1
- package/dist/impaktapps-design.umd.js +4 -4
- package/dist/impaktapps-design.umd.js.map +1 -1
- package/package.json +1 -1
- package/src/component/PieGraph/DrawPieGraph.tsx +18 -8
- package/src/utils/finalDataProvider.ts +3 -1
|
@@ -11409,7 +11409,7 @@ const Product1 = [
|
|
|
11409
11409
|
}
|
|
11410
11410
|
];
|
|
11411
11411
|
const finalDataProvider = (type2, value, theme) => {
|
|
11412
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t5, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F;
|
|
11412
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n, _o, _p, _q, _r, _s, _t5, _u, _v, _w, _x, _y, _z, _A, _B, _C, _D, _E, _F, _G;
|
|
11413
11413
|
switch (type2) {
|
|
11414
11414
|
case "BarGraph":
|
|
11415
11415
|
case "StackBarGraph":
|
|
@@ -11485,7 +11485,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11485
11485
|
case "PieGraph":
|
|
11486
11486
|
return {
|
|
11487
11487
|
main: {
|
|
11488
|
-
data: ((_h = value == null ? void 0 : value.main) == null ? void 0 : _h.data)
|
|
11488
|
+
data: ((_h = value == null ? void 0 : value.main) == null ? void 0 : _h.data) && value.main.data.length > 0 ? (_i = value == null ? void 0 : value.main) == null ? void 0 : _i.data : [{ label: "Kotak", value: 500 }, { label: "SBI", value: 700 }, { label: "HDFC", value: 900 }],
|
|
11489
11489
|
header: "Pie Graph",
|
|
11490
11490
|
bottomLabel: "Name of Employe",
|
|
11491
11491
|
leftLabel: "Value",
|
|
@@ -11499,7 +11499,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11499
11499
|
legendTitle: "Our Assests",
|
|
11500
11500
|
direction: "row",
|
|
11501
11501
|
align: "right",
|
|
11502
|
-
...(
|
|
11502
|
+
...(_j = value == null ? void 0 : value.main) == null ? void 0 : _j.legend
|
|
11503
11503
|
}
|
|
11504
11504
|
},
|
|
11505
11505
|
style: {
|
|
@@ -11509,7 +11509,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11509
11509
|
height: "310",
|
|
11510
11510
|
borderRadius: "20px",
|
|
11511
11511
|
padding: "10px 0 2px 0",
|
|
11512
|
-
...(
|
|
11512
|
+
...(_k = value == null ? void 0 : value.style) == null ? void 0 : _k.containerStyle
|
|
11513
11513
|
},
|
|
11514
11514
|
headerStyle: {
|
|
11515
11515
|
fontWeight: 500,
|
|
@@ -11520,17 +11520,17 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11520
11520
|
width: "100%",
|
|
11521
11521
|
fontSize: "18px",
|
|
11522
11522
|
color: theme.palette.text.primary,
|
|
11523
|
-
...(
|
|
11523
|
+
...(_l = value == null ? void 0 : value.style) == null ? void 0 : _l.headerStyle
|
|
11524
11524
|
},
|
|
11525
11525
|
tooltipStyle: {
|
|
11526
|
-
...(
|
|
11526
|
+
...(_m = value == null ? void 0 : value.style) == null ? void 0 : _m.tooltipStyle
|
|
11527
11527
|
},
|
|
11528
11528
|
labelStyle: {
|
|
11529
11529
|
labelColor: theme.palette.text.primary,
|
|
11530
11530
|
labelOffset: 45,
|
|
11531
11531
|
leftLabelMargin: "70",
|
|
11532
11532
|
topLabelMargin: "-40",
|
|
11533
|
-
...(
|
|
11533
|
+
...(_n = value == null ? void 0 : value.style) == null ? void 0 : _n.labelStyle
|
|
11534
11534
|
},
|
|
11535
11535
|
legendStyle: {
|
|
11536
11536
|
legend: {
|
|
@@ -11543,14 +11543,14 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11543
11543
|
border: "1px solid rgba(255, 255, 255, 0.3)",
|
|
11544
11544
|
borderRadius: " 8px",
|
|
11545
11545
|
margin: "5px 5px",
|
|
11546
|
-
...(
|
|
11546
|
+
...(_p = (_o = value == null ? void 0 : value.style) == null ? void 0 : _o.legendStyle) == null ? void 0 : _p.legend
|
|
11547
11547
|
},
|
|
11548
11548
|
legendTitle: {
|
|
11549
11549
|
fontWeight: 500,
|
|
11550
11550
|
marginBottom: "5px",
|
|
11551
11551
|
fontFamily: "roboto",
|
|
11552
11552
|
fontSize: "10px",
|
|
11553
|
-
...(
|
|
11553
|
+
...(_r = (_q = value == null ? void 0 : value.style) == null ? void 0 : _q.legendStyle) == null ? void 0 : _r.legendTitle
|
|
11554
11554
|
}
|
|
11555
11555
|
},
|
|
11556
11556
|
pieStyle: {
|
|
@@ -11559,14 +11559,15 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11559
11559
|
innerRadius: 60,
|
|
11560
11560
|
cornerRadius: 2,
|
|
11561
11561
|
padAngle: 6e-3,
|
|
11562
|
-
|
|
11562
|
+
showPieLabel: true,
|
|
11563
|
+
...(_s = value == null ? void 0 : value.style) == null ? void 0 : _s.pieStyle
|
|
11563
11564
|
}
|
|
11564
11565
|
}
|
|
11565
11566
|
};
|
|
11566
11567
|
case "LineGraph":
|
|
11567
11568
|
return {
|
|
11568
11569
|
main: {
|
|
11569
|
-
data: ((
|
|
11570
|
+
data: ((_t5 = value == null ? void 0 : value.main) == null ? void 0 : _t5.data) || Product1,
|
|
11570
11571
|
header: "Line Graph Dynamic",
|
|
11571
11572
|
bottomLabel: "Name of Employe",
|
|
11572
11573
|
leftLabel: "Value",
|
|
@@ -11584,7 +11585,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11584
11585
|
direction: "row",
|
|
11585
11586
|
align: "right",
|
|
11586
11587
|
colorRectWidth: 20,
|
|
11587
|
-
...(
|
|
11588
|
+
...(_u = value == null ? void 0 : value.main) == null ? void 0 : _u.legend
|
|
11588
11589
|
}
|
|
11589
11590
|
},
|
|
11590
11591
|
style: {
|
|
@@ -11594,7 +11595,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11594
11595
|
height: "300",
|
|
11595
11596
|
borderRadius: "20px",
|
|
11596
11597
|
padding: "10px 0 2px 0",
|
|
11597
|
-
...(
|
|
11598
|
+
...(_v = value == null ? void 0 : value.style) == null ? void 0 : _v.containerStyle
|
|
11598
11599
|
},
|
|
11599
11600
|
headerStyle: {
|
|
11600
11601
|
fontWeight: 500,
|
|
@@ -11605,35 +11606,35 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11605
11606
|
width: "100%",
|
|
11606
11607
|
fontSize: "18px",
|
|
11607
11608
|
color: theme.palette.text.primary,
|
|
11608
|
-
...(
|
|
11609
|
+
...(_w = value == null ? void 0 : value.style) == null ? void 0 : _w.headerStyle
|
|
11609
11610
|
},
|
|
11610
11611
|
labelStyle: {
|
|
11611
11612
|
labelColor: theme.palette.text.primary,
|
|
11612
11613
|
bottomLabelOffset: 20,
|
|
11613
11614
|
leftLabelOffset: 50,
|
|
11614
11615
|
leftLabelMargin: 80,
|
|
11615
|
-
...(
|
|
11616
|
+
...(_x = value == null ? void 0 : value.style) == null ? void 0 : _x.labelStyle
|
|
11616
11617
|
},
|
|
11617
11618
|
lineStyle: {
|
|
11618
11619
|
colorRange: theme.chartColours.lineChartColours || ["#3f51b5", "rgba(200,0,31,0.9)", "rgba(25,200,205,0.6)"],
|
|
11619
11620
|
lineAreaColor: "none",
|
|
11620
11621
|
lineAreaOpacity: 0.2,
|
|
11621
|
-
...(
|
|
11622
|
+
...(_y = value == null ? void 0 : value.style) == null ? void 0 : _y.lineStyle
|
|
11622
11623
|
}
|
|
11623
11624
|
}
|
|
11624
11625
|
};
|
|
11625
11626
|
case "HorizontalBarGraph":
|
|
11626
11627
|
return {
|
|
11627
11628
|
main: {
|
|
11628
|
-
data: ((
|
|
11629
|
+
data: ((_z = value == null ? void 0 : value.main) == null ? void 0 : _z.data) || [{ y: "Anant Sharma", x: 60 }, { y: "Pankaj Chauhan", x: 60 }, { y: "satendra Raghav", x: 150 }, { y: "Vivek Pahadi", x: 80 }, { y: "Siddarth verma", x: 100 }],
|
|
11629
11630
|
header: " ",
|
|
11630
11631
|
bottomLabel: "Name of Employe",
|
|
11631
11632
|
leftLabel: "Value",
|
|
11632
11633
|
axisLeft: true,
|
|
11633
11634
|
axisBottom: true,
|
|
11634
11635
|
hideBottomTicks: false,
|
|
11635
|
-
hideLeftTicks: ((
|
|
11636
|
-
hideLeftAxisLine: ((
|
|
11636
|
+
hideLeftTicks: ((_A = value == null ? void 0 : value.main) == null ? void 0 : _A.data) ? true : false,
|
|
11637
|
+
hideLeftAxisLine: ((_B = value == null ? void 0 : value.main) == null ? void 0 : _B.data) ? true : false,
|
|
11637
11638
|
hideBottomAxisLine: false,
|
|
11638
11639
|
bottomAxisWidth: "10px",
|
|
11639
11640
|
...value.main
|
|
@@ -11645,7 +11646,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11645
11646
|
height: "300",
|
|
11646
11647
|
borderRadius: "20px",
|
|
11647
11648
|
padding: "10px 0 2px 0",
|
|
11648
|
-
...(
|
|
11649
|
+
...(_C = value == null ? void 0 : value.style) == null ? void 0 : _C.containerStyle
|
|
11649
11650
|
},
|
|
11650
11651
|
headerStyle: {
|
|
11651
11652
|
fontWeight: 500,
|
|
@@ -11656,12 +11657,12 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11656
11657
|
width: "100%",
|
|
11657
11658
|
fontSize: "18px",
|
|
11658
11659
|
color: theme.palette.text.primary,
|
|
11659
|
-
...(
|
|
11660
|
+
...(_D = value == null ? void 0 : value.style) == null ? void 0 : _D.headerStyle
|
|
11660
11661
|
},
|
|
11661
11662
|
tooltipStyle: {
|
|
11662
11663
|
padding: "6px",
|
|
11663
11664
|
borderRadius: "2px",
|
|
11664
|
-
...(
|
|
11665
|
+
...(_E = value == null ? void 0 : value.style) == null ? void 0 : _E.tooltipStyle
|
|
11665
11666
|
},
|
|
11666
11667
|
labelStyle: {
|
|
11667
11668
|
margin: { top: 10, left: 110, right: 40, bottom: 40 },
|
|
@@ -11672,11 +11673,11 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11672
11673
|
tickColor: theme.palette.text.primary,
|
|
11673
11674
|
rightAxisWidth: "0.3px",
|
|
11674
11675
|
fontSize: "10px",
|
|
11675
|
-
...(
|
|
11676
|
+
...(_F = value == null ? void 0 : value.style) == null ? void 0 : _F.labelStyle
|
|
11676
11677
|
},
|
|
11677
11678
|
barStyle: {
|
|
11678
11679
|
color: "#6c5efb",
|
|
11679
|
-
...(
|
|
11680
|
+
...(_G = value == null ? void 0 : value.style) == null ? void 0 : _G.barStyle
|
|
11680
11681
|
}
|
|
11681
11682
|
}
|
|
11682
11683
|
};
|
|
@@ -11720,14 +11721,21 @@ const DrawPieGraph = ({
|
|
|
11720
11721
|
parentWidth,
|
|
11721
11722
|
parentHeight
|
|
11722
11723
|
}) => {
|
|
11723
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n
|
|
11724
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
|
11724
11725
|
const letters = (_a = value == null ? void 0 : value.main) == null ? void 0 : _a.data;
|
|
11725
|
-
const
|
|
11726
|
-
const
|
|
11727
|
-
const
|
|
11728
|
-
|
|
11729
|
-
|
|
11730
|
-
|
|
11726
|
+
const keys2 = Object.keys(letters[0]);
|
|
11727
|
+
const arr = ((_b = value == null ? void 0 : value.main) == null ? void 0 : _b.xAxisValue) && ((_c = value == null ? void 0 : value.main) == null ? void 0 : _c.yAxisValue) ? [(_d = value == null ? void 0 : value.main) == null ? void 0 : _d.xAxisValue, (_e = value == null ? void 0 : value.main) == null ? void 0 : _e.yAxisValue] : keys2;
|
|
11728
|
+
const labelKeyIndex = keys2.indexOf("label");
|
|
11729
|
+
const valueKeyIndex = labelKeyIndex === 0 ? 1 : 0;
|
|
11730
|
+
const frequency = (d2) => d2[arr[valueKeyIndex]];
|
|
11731
|
+
const getLetterFrequencyColor = (letter, index2) => {
|
|
11732
|
+
var _a2, _b2;
|
|
11733
|
+
return createOrdinalScale$1({
|
|
11734
|
+
domain: letters.map((l2) => l2[arr[index2]]),
|
|
11735
|
+
range: (_b2 = (_a2 = value == null ? void 0 : value.style) == null ? void 0 : _a2.pieStyle) == null ? void 0 : _b2.colorRange
|
|
11736
|
+
})(letter);
|
|
11737
|
+
};
|
|
11738
|
+
const dataKeyArray = letters.map((data) => data.label);
|
|
11731
11739
|
const {
|
|
11732
11740
|
tooltipData,
|
|
11733
11741
|
tooltipLeft,
|
|
@@ -11751,8 +11759,9 @@ const DrawPieGraph = ({
|
|
|
11751
11759
|
const top2 = centerY + 20;
|
|
11752
11760
|
const pieSortValues = (a2, b10) => a2 - b10;
|
|
11753
11761
|
return /* @__PURE__ */ jsxs(Fragment, {
|
|
11754
|
-
children: [((
|
|
11755
|
-
value
|
|
11762
|
+
children: [((_f = value == null ? void 0 : value.main) == null ? void 0 : _f.legendAvailable) && /* @__PURE__ */ jsx(Legend, {
|
|
11763
|
+
value,
|
|
11764
|
+
dataKeyArray
|
|
11756
11765
|
}), /* @__PURE__ */ jsx("svg", {
|
|
11757
11766
|
width: parentWidth,
|
|
11758
11767
|
height: parentHeight,
|
|
@@ -11764,17 +11773,18 @@ const DrawPieGraph = ({
|
|
|
11764
11773
|
data: letters,
|
|
11765
11774
|
pieSortValues,
|
|
11766
11775
|
pieValue: frequency,
|
|
11767
|
-
outerRadius: (
|
|
11768
|
-
innerRadius: (
|
|
11769
|
-
cornerRadius: (
|
|
11770
|
-
padAngle: (
|
|
11776
|
+
outerRadius: (_h = (_g = value == null ? void 0 : value.style) == null ? void 0 : _g.pieStyle) == null ? void 0 : _h.outerRadius,
|
|
11777
|
+
innerRadius: (_j = (_i = value == null ? void 0 : value.style) == null ? void 0 : _i.pieStyle) == null ? void 0 : _j.innerRadius,
|
|
11778
|
+
cornerRadius: (_l = (_k = value == null ? void 0 : value.style) == null ? void 0 : _k.pieStyle) == null ? void 0 : _l.cornerRadius,
|
|
11779
|
+
padAngle: (_n = (_m = value == null ? void 0 : value.style) == null ? void 0 : _m.pieStyle) == null ? void 0 : _n.padAngle,
|
|
11771
11780
|
children: (pie2) => {
|
|
11772
11781
|
return pie2.arcs.map((arc2, index2) => {
|
|
11773
11782
|
var _a2, _b2, _c2, _d2;
|
|
11774
|
-
const
|
|
11783
|
+
const indexParam = ((_b2 = (_a2 = value == null ? void 0 : value.style) == null ? void 0 : _a2.pieStyle) == null ? void 0 : _b2.showPieLabel) ? labelKeyIndex : valueKeyIndex;
|
|
11784
|
+
const letter = arc2.data[arr[indexParam]];
|
|
11775
11785
|
const [centriodX, centriodY] = pie2.path.centroid(arc2);
|
|
11776
11786
|
const arcPath = pie2.path(arc2);
|
|
11777
|
-
const arcFill = getLetterFrequencyColor(letter);
|
|
11787
|
+
const arcFill = getLetterFrequencyColor(letter, indexParam);
|
|
11778
11788
|
return /* @__PURE__ */ jsxs("g", {
|
|
11779
11789
|
onMouseOut: hideTooltip,
|
|
11780
11790
|
onMouseOver: (e3) => handleMouse(e3, arc2.data),
|