impaktapps-design 0.2.87 → 0.2.89
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 +48 -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 +2 -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,14 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11559
11559
|
innerRadius: 60,
|
|
11560
11560
|
cornerRadius: 2,
|
|
11561
11561
|
padAngle: 6e-3,
|
|
11562
|
-
...(
|
|
11562
|
+
...(_s = value == null ? void 0 : value.style) == null ? void 0 : _s.pieStyle
|
|
11563
11563
|
}
|
|
11564
11564
|
}
|
|
11565
11565
|
};
|
|
11566
11566
|
case "LineGraph":
|
|
11567
11567
|
return {
|
|
11568
11568
|
main: {
|
|
11569
|
-
data: ((
|
|
11569
|
+
data: ((_t5 = value == null ? void 0 : value.main) == null ? void 0 : _t5.data) || Product1,
|
|
11570
11570
|
header: "Line Graph Dynamic",
|
|
11571
11571
|
bottomLabel: "Name of Employe",
|
|
11572
11572
|
leftLabel: "Value",
|
|
@@ -11584,7 +11584,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11584
11584
|
direction: "row",
|
|
11585
11585
|
align: "right",
|
|
11586
11586
|
colorRectWidth: 20,
|
|
11587
|
-
...(
|
|
11587
|
+
...(_u = value == null ? void 0 : value.main) == null ? void 0 : _u.legend
|
|
11588
11588
|
}
|
|
11589
11589
|
},
|
|
11590
11590
|
style: {
|
|
@@ -11594,7 +11594,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11594
11594
|
height: "300",
|
|
11595
11595
|
borderRadius: "20px",
|
|
11596
11596
|
padding: "10px 0 2px 0",
|
|
11597
|
-
...(
|
|
11597
|
+
...(_v = value == null ? void 0 : value.style) == null ? void 0 : _v.containerStyle
|
|
11598
11598
|
},
|
|
11599
11599
|
headerStyle: {
|
|
11600
11600
|
fontWeight: 500,
|
|
@@ -11605,35 +11605,35 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11605
11605
|
width: "100%",
|
|
11606
11606
|
fontSize: "18px",
|
|
11607
11607
|
color: theme.palette.text.primary,
|
|
11608
|
-
...(
|
|
11608
|
+
...(_w = value == null ? void 0 : value.style) == null ? void 0 : _w.headerStyle
|
|
11609
11609
|
},
|
|
11610
11610
|
labelStyle: {
|
|
11611
11611
|
labelColor: theme.palette.text.primary,
|
|
11612
11612
|
bottomLabelOffset: 20,
|
|
11613
11613
|
leftLabelOffset: 50,
|
|
11614
11614
|
leftLabelMargin: 80,
|
|
11615
|
-
...(
|
|
11615
|
+
...(_x = value == null ? void 0 : value.style) == null ? void 0 : _x.labelStyle
|
|
11616
11616
|
},
|
|
11617
11617
|
lineStyle: {
|
|
11618
11618
|
colorRange: theme.chartColours.lineChartColours || ["#3f51b5", "rgba(200,0,31,0.9)", "rgba(25,200,205,0.6)"],
|
|
11619
11619
|
lineAreaColor: "none",
|
|
11620
11620
|
lineAreaOpacity: 0.2,
|
|
11621
|
-
...(
|
|
11621
|
+
...(_y = value == null ? void 0 : value.style) == null ? void 0 : _y.lineStyle
|
|
11622
11622
|
}
|
|
11623
11623
|
}
|
|
11624
11624
|
};
|
|
11625
11625
|
case "HorizontalBarGraph":
|
|
11626
11626
|
return {
|
|
11627
11627
|
main: {
|
|
11628
|
-
data: ((
|
|
11628
|
+
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
11629
|
header: " ",
|
|
11630
11630
|
bottomLabel: "Name of Employe",
|
|
11631
11631
|
leftLabel: "Value",
|
|
11632
11632
|
axisLeft: true,
|
|
11633
11633
|
axisBottom: true,
|
|
11634
11634
|
hideBottomTicks: false,
|
|
11635
|
-
hideLeftTicks: ((
|
|
11636
|
-
hideLeftAxisLine: ((
|
|
11635
|
+
hideLeftTicks: ((_A = value == null ? void 0 : value.main) == null ? void 0 : _A.data) ? true : false,
|
|
11636
|
+
hideLeftAxisLine: ((_B = value == null ? void 0 : value.main) == null ? void 0 : _B.data) ? true : false,
|
|
11637
11637
|
hideBottomAxisLine: false,
|
|
11638
11638
|
bottomAxisWidth: "10px",
|
|
11639
11639
|
...value.main
|
|
@@ -11645,7 +11645,7 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11645
11645
|
height: "300",
|
|
11646
11646
|
borderRadius: "20px",
|
|
11647
11647
|
padding: "10px 0 2px 0",
|
|
11648
|
-
...(
|
|
11648
|
+
...(_C = value == null ? void 0 : value.style) == null ? void 0 : _C.containerStyle
|
|
11649
11649
|
},
|
|
11650
11650
|
headerStyle: {
|
|
11651
11651
|
fontWeight: 500,
|
|
@@ -11656,12 +11656,12 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11656
11656
|
width: "100%",
|
|
11657
11657
|
fontSize: "18px",
|
|
11658
11658
|
color: theme.palette.text.primary,
|
|
11659
|
-
...(
|
|
11659
|
+
...(_D = value == null ? void 0 : value.style) == null ? void 0 : _D.headerStyle
|
|
11660
11660
|
},
|
|
11661
11661
|
tooltipStyle: {
|
|
11662
11662
|
padding: "6px",
|
|
11663
11663
|
borderRadius: "2px",
|
|
11664
|
-
...(
|
|
11664
|
+
...(_E = value == null ? void 0 : value.style) == null ? void 0 : _E.tooltipStyle
|
|
11665
11665
|
},
|
|
11666
11666
|
labelStyle: {
|
|
11667
11667
|
margin: { top: 10, left: 110, right: 40, bottom: 40 },
|
|
@@ -11672,11 +11672,11 @@ const finalDataProvider = (type2, value, theme) => {
|
|
|
11672
11672
|
tickColor: theme.palette.text.primary,
|
|
11673
11673
|
rightAxisWidth: "0.3px",
|
|
11674
11674
|
fontSize: "10px",
|
|
11675
|
-
...(
|
|
11675
|
+
...(_F = value == null ? void 0 : value.style) == null ? void 0 : _F.labelStyle
|
|
11676
11676
|
},
|
|
11677
11677
|
barStyle: {
|
|
11678
11678
|
color: "#6c5efb",
|
|
11679
|
-
...(
|
|
11679
|
+
...(_G = value == null ? void 0 : value.style) == null ? void 0 : _G.barStyle
|
|
11680
11680
|
}
|
|
11681
11681
|
}
|
|
11682
11682
|
};
|
|
@@ -11720,14 +11720,21 @@ const DrawPieGraph = ({
|
|
|
11720
11720
|
parentWidth,
|
|
11721
11721
|
parentHeight
|
|
11722
11722
|
}) => {
|
|
11723
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n
|
|
11723
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j, _k, _l, _m, _n;
|
|
11724
11724
|
const letters = (_a = value == null ? void 0 : value.main) == null ? void 0 : _a.data;
|
|
11725
|
-
const
|
|
11726
|
-
const
|
|
11727
|
-
const
|
|
11728
|
-
|
|
11729
|
-
|
|
11730
|
-
|
|
11725
|
+
const keys2 = Object.keys(letters[0]);
|
|
11726
|
+
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;
|
|
11727
|
+
const labelKeyIndex = keys2.indexOf("label");
|
|
11728
|
+
const valueKeyIndex = labelKeyIndex === 0 ? 1 : 0;
|
|
11729
|
+
const frequency = (d2) => d2[arr[valueKeyIndex]];
|
|
11730
|
+
const getLetterFrequencyColor = (letter, index2) => {
|
|
11731
|
+
var _a2, _b2;
|
|
11732
|
+
return createOrdinalScale$1({
|
|
11733
|
+
domain: letters.map((l2) => l2[arr[index2]]),
|
|
11734
|
+
range: (_b2 = (_a2 = value == null ? void 0 : value.style) == null ? void 0 : _a2.pieStyle) == null ? void 0 : _b2.colorRange
|
|
11735
|
+
})(letter);
|
|
11736
|
+
};
|
|
11737
|
+
const dataKeyArray = letters.map((data) => data.label);
|
|
11731
11738
|
const {
|
|
11732
11739
|
tooltipData,
|
|
11733
11740
|
tooltipLeft,
|
|
@@ -11751,8 +11758,9 @@ const DrawPieGraph = ({
|
|
|
11751
11758
|
const top2 = centerY + 20;
|
|
11752
11759
|
const pieSortValues = (a2, b10) => a2 - b10;
|
|
11753
11760
|
return /* @__PURE__ */ jsxs(Fragment, {
|
|
11754
|
-
children: [((
|
|
11755
|
-
value
|
|
11761
|
+
children: [((_f = value == null ? void 0 : value.main) == null ? void 0 : _f.legendAvailable) && /* @__PURE__ */ jsx(Legend, {
|
|
11762
|
+
value,
|
|
11763
|
+
dataKeyArray
|
|
11756
11764
|
}), /* @__PURE__ */ jsx("svg", {
|
|
11757
11765
|
width: parentWidth,
|
|
11758
11766
|
height: parentHeight,
|
|
@@ -11764,17 +11772,18 @@ const DrawPieGraph = ({
|
|
|
11764
11772
|
data: letters,
|
|
11765
11773
|
pieSortValues,
|
|
11766
11774
|
pieValue: frequency,
|
|
11767
|
-
outerRadius: (
|
|
11768
|
-
innerRadius: (
|
|
11769
|
-
cornerRadius: (
|
|
11770
|
-
padAngle: (
|
|
11775
|
+
outerRadius: (_h = (_g = value == null ? void 0 : value.style) == null ? void 0 : _g.pieStyle) == null ? void 0 : _h.outerRadius,
|
|
11776
|
+
innerRadius: (_j = (_i = value == null ? void 0 : value.style) == null ? void 0 : _i.pieStyle) == null ? void 0 : _j.innerRadius,
|
|
11777
|
+
cornerRadius: (_l = (_k = value == null ? void 0 : value.style) == null ? void 0 : _k.pieStyle) == null ? void 0 : _l.cornerRadius,
|
|
11778
|
+
padAngle: (_n = (_m = value == null ? void 0 : value.style) == null ? void 0 : _m.pieStyle) == null ? void 0 : _n.padAngle,
|
|
11771
11779
|
children: (pie2) => {
|
|
11772
11780
|
return pie2.arcs.map((arc2, index2) => {
|
|
11773
11781
|
var _a2, _b2, _c2, _d2;
|
|
11774
|
-
const
|
|
11782
|
+
const indexParam = ((_b2 = (_a2 = value == null ? void 0 : value.style) == null ? void 0 : _a2.pieStyle) == null ? void 0 : _b2.showPieLabel) ? labelKeyIndex : valueKeyIndex;
|
|
11783
|
+
const letter = arc2.data[arr[indexParam]];
|
|
11775
11784
|
const [centriodX, centriodY] = pie2.path.centroid(arc2);
|
|
11776
11785
|
const arcPath = pie2.path(arc2);
|
|
11777
|
-
const arcFill = getLetterFrequencyColor(letter);
|
|
11786
|
+
const arcFill = getLetterFrequencyColor(letter, indexParam);
|
|
11778
11787
|
return /* @__PURE__ */ jsxs("g", {
|
|
11779
11788
|
onMouseOut: hideTooltip,
|
|
11780
11789
|
onMouseOver: (e3) => handleMouse(e3, arc2.data),
|