@apexcura/ui-components 0.0.14-Beta85 → 0.0.14-Beta87
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/index.js +45 -1
- package/dist/index.mjs +45 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1086,9 +1086,53 @@ var OtpElement = (props) => {
|
|
|
1086
1086
|
|
|
1087
1087
|
// src/Components/Donut.tsx
|
|
1088
1088
|
var import_react31 = __toESM(require("react"));
|
|
1089
|
+
var import_highcharts = __toESM(require("highcharts"));
|
|
1090
|
+
var import_highcharts_react_official = __toESM(require("highcharts-react-official"));
|
|
1089
1091
|
var Donut = (props) => {
|
|
1090
1092
|
console.log(props);
|
|
1091
|
-
|
|
1093
|
+
const chartOptions = {
|
|
1094
|
+
title: {
|
|
1095
|
+
text: "Distribution of Students"
|
|
1096
|
+
},
|
|
1097
|
+
plotOptions: {
|
|
1098
|
+
pie: {
|
|
1099
|
+
innerSize: "70%",
|
|
1100
|
+
dataLabels: {
|
|
1101
|
+
enabled: false,
|
|
1102
|
+
format: "<b>{point.name}</b>: {point.percentage:.1f} %"
|
|
1103
|
+
},
|
|
1104
|
+
showInLegend: true
|
|
1105
|
+
}
|
|
1106
|
+
},
|
|
1107
|
+
series: [
|
|
1108
|
+
{
|
|
1109
|
+
type: "pie",
|
|
1110
|
+
name: "Percentage",
|
|
1111
|
+
data: [
|
|
1112
|
+
{
|
|
1113
|
+
name: "Girls",
|
|
1114
|
+
y: 20,
|
|
1115
|
+
color: "#FF6384"
|
|
1116
|
+
// Custom color for Girls
|
|
1117
|
+
},
|
|
1118
|
+
{
|
|
1119
|
+
name: "Boys",
|
|
1120
|
+
y: 40,
|
|
1121
|
+
color: "#36A2EB"
|
|
1122
|
+
// Custom color for Boys
|
|
1123
|
+
},
|
|
1124
|
+
{
|
|
1125
|
+
name: "Students",
|
|
1126
|
+
y: 40,
|
|
1127
|
+
color: "#FFCE56"
|
|
1128
|
+
// Custom color for Students
|
|
1129
|
+
}
|
|
1130
|
+
]
|
|
1131
|
+
}
|
|
1132
|
+
]
|
|
1133
|
+
};
|
|
1134
|
+
console.log(chartOptions);
|
|
1135
|
+
return /* @__PURE__ */ import_react31.default.createElement("div", null, /* @__PURE__ */ import_react31.default.createElement(import_highcharts_react_official.default, { highcharts: import_highcharts.default, options: chartOptions }));
|
|
1092
1136
|
};
|
|
1093
1137
|
// Annotate the CommonJS export names for ESM import in node:
|
|
1094
1138
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -1025,9 +1025,53 @@ var OtpElement = (props) => {
|
|
|
1025
1025
|
|
|
1026
1026
|
// src/Components/Donut.tsx
|
|
1027
1027
|
import React31 from "react";
|
|
1028
|
+
import Highcharts from "highcharts";
|
|
1029
|
+
import HighchartsReact from "highcharts-react-official";
|
|
1028
1030
|
var Donut = (props) => {
|
|
1029
1031
|
console.log(props);
|
|
1030
|
-
|
|
1032
|
+
const chartOptions = {
|
|
1033
|
+
title: {
|
|
1034
|
+
text: "Distribution of Students"
|
|
1035
|
+
},
|
|
1036
|
+
plotOptions: {
|
|
1037
|
+
pie: {
|
|
1038
|
+
innerSize: "70%",
|
|
1039
|
+
dataLabels: {
|
|
1040
|
+
enabled: false,
|
|
1041
|
+
format: "<b>{point.name}</b>: {point.percentage:.1f} %"
|
|
1042
|
+
},
|
|
1043
|
+
showInLegend: true
|
|
1044
|
+
}
|
|
1045
|
+
},
|
|
1046
|
+
series: [
|
|
1047
|
+
{
|
|
1048
|
+
type: "pie",
|
|
1049
|
+
name: "Percentage",
|
|
1050
|
+
data: [
|
|
1051
|
+
{
|
|
1052
|
+
name: "Girls",
|
|
1053
|
+
y: 20,
|
|
1054
|
+
color: "#FF6384"
|
|
1055
|
+
// Custom color for Girls
|
|
1056
|
+
},
|
|
1057
|
+
{
|
|
1058
|
+
name: "Boys",
|
|
1059
|
+
y: 40,
|
|
1060
|
+
color: "#36A2EB"
|
|
1061
|
+
// Custom color for Boys
|
|
1062
|
+
},
|
|
1063
|
+
{
|
|
1064
|
+
name: "Students",
|
|
1065
|
+
y: 40,
|
|
1066
|
+
color: "#FFCE56"
|
|
1067
|
+
// Custom color for Students
|
|
1068
|
+
}
|
|
1069
|
+
]
|
|
1070
|
+
}
|
|
1071
|
+
]
|
|
1072
|
+
};
|
|
1073
|
+
console.log(chartOptions);
|
|
1074
|
+
return /* @__PURE__ */ React31.createElement("div", null, /* @__PURE__ */ React31.createElement(HighchartsReact, { highcharts: Highcharts, options: chartOptions }));
|
|
1031
1075
|
};
|
|
1032
1076
|
export {
|
|
1033
1077
|
AddMoreTable,
|