@apexcura/ui-components 0.0.14-Beta95 → 0.0.14-Beta97
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 +89 -22
- package/dist/index.mjs +89 -22
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -744,6 +744,7 @@ var TableElement = (props) => {
|
|
|
744
744
|
title: col.label,
|
|
745
745
|
dataIndex: col.name,
|
|
746
746
|
key: col.key,
|
|
747
|
+
ellipsis: col.ellipsis,
|
|
747
748
|
render: col.render,
|
|
748
749
|
sorter: {
|
|
749
750
|
compare: (a, b) => {
|
|
@@ -1088,51 +1089,117 @@ var OtpElement = (props) => {
|
|
|
1088
1089
|
var import_react31 = __toESM(require("react"));
|
|
1089
1090
|
var import_highcharts = __toESM(require("highcharts"));
|
|
1090
1091
|
var import_highcharts_react_official = __toESM(require("highcharts-react-official"));
|
|
1092
|
+
var HighchartsChart = ({ options }) => {
|
|
1093
|
+
return /* @__PURE__ */ import_react31.default.createElement(import_highcharts_react_official.default, { highcharts: import_highcharts.default, options });
|
|
1094
|
+
};
|
|
1091
1095
|
var Donut = (props) => {
|
|
1092
1096
|
console.log(props);
|
|
1093
1097
|
const chartOptions = {
|
|
1098
|
+
chart: {
|
|
1099
|
+
type: "pie"
|
|
1100
|
+
},
|
|
1094
1101
|
title: {
|
|
1095
|
-
text: "
|
|
1102
|
+
text: "Egg Yolk Composition"
|
|
1103
|
+
},
|
|
1104
|
+
tooltip: {
|
|
1105
|
+
valueSuffix: "%"
|
|
1106
|
+
},
|
|
1107
|
+
subtitle: {
|
|
1108
|
+
text: 'Source:<a href="https://www.mdpi.com/2072-6643/11/3/684/htm" target="_default">MDPI</a>'
|
|
1096
1109
|
},
|
|
1097
1110
|
plotOptions: {
|
|
1098
|
-
|
|
1099
|
-
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1111
|
+
series: {
|
|
1112
|
+
allowPointSelect: true,
|
|
1113
|
+
cursor: "pointer",
|
|
1114
|
+
dataLabels: [{
|
|
1115
|
+
enabled: true,
|
|
1116
|
+
distance: 20
|
|
1117
|
+
}, {
|
|
1118
|
+
enabled: true,
|
|
1119
|
+
distance: -40,
|
|
1120
|
+
format: "{point.percentage:.1f}%",
|
|
1121
|
+
style: {
|
|
1122
|
+
fontSize: "1.2em",
|
|
1123
|
+
textOutline: "none",
|
|
1124
|
+
opacity: 0.7
|
|
1125
|
+
},
|
|
1126
|
+
filter: {
|
|
1127
|
+
operator: ">",
|
|
1128
|
+
property: "percentage",
|
|
1129
|
+
value: 10
|
|
1130
|
+
}
|
|
1131
|
+
}]
|
|
1105
1132
|
}
|
|
1106
1133
|
},
|
|
1107
1134
|
series: [
|
|
1108
1135
|
{
|
|
1109
|
-
type: "pie",
|
|
1110
1136
|
name: "Percentage",
|
|
1137
|
+
colorByPoint: true,
|
|
1111
1138
|
data: [
|
|
1112
1139
|
{
|
|
1113
|
-
name: "
|
|
1114
|
-
y:
|
|
1115
|
-
|
|
1116
|
-
|
|
1140
|
+
name: "Water",
|
|
1141
|
+
y: 55.02
|
|
1142
|
+
},
|
|
1143
|
+
{
|
|
1144
|
+
name: "Fat",
|
|
1145
|
+
sliced: true,
|
|
1146
|
+
selected: true,
|
|
1147
|
+
y: 26.71
|
|
1148
|
+
},
|
|
1149
|
+
{
|
|
1150
|
+
name: "Carbohydrates",
|
|
1151
|
+
y: 1.09
|
|
1117
1152
|
},
|
|
1118
1153
|
{
|
|
1119
|
-
name: "
|
|
1120
|
-
y:
|
|
1121
|
-
color: "#36A2EB"
|
|
1122
|
-
// Custom color for Boys
|
|
1154
|
+
name: "Protein",
|
|
1155
|
+
y: 15.5
|
|
1123
1156
|
},
|
|
1124
1157
|
{
|
|
1125
|
-
name: "
|
|
1126
|
-
y:
|
|
1127
|
-
color: "#FFCE56"
|
|
1128
|
-
// Custom color for Students
|
|
1158
|
+
name: "Ash",
|
|
1159
|
+
y: 1.68
|
|
1129
1160
|
}
|
|
1130
1161
|
]
|
|
1131
1162
|
}
|
|
1132
1163
|
]
|
|
1164
|
+
// title: {
|
|
1165
|
+
// text: "Distribution of Students",
|
|
1166
|
+
// },
|
|
1167
|
+
// plotOptions: {
|
|
1168
|
+
// pie: {
|
|
1169
|
+
// innerSize: "70%",
|
|
1170
|
+
// dataLabels: {
|
|
1171
|
+
// enabled: false,
|
|
1172
|
+
// format: "<b>{point.name}</b>: {point.percentage:.1f} %",
|
|
1173
|
+
// },
|
|
1174
|
+
// showInLegend: true,
|
|
1175
|
+
// },
|
|
1176
|
+
// },
|
|
1177
|
+
// series: [
|
|
1178
|
+
// {
|
|
1179
|
+
// type: "pie",
|
|
1180
|
+
// name: "Percentage",
|
|
1181
|
+
// data: [
|
|
1182
|
+
// {
|
|
1183
|
+
// name: "Girls",
|
|
1184
|
+
// y: 20,
|
|
1185
|
+
// color: "#FF6384", // Custom color for Girls
|
|
1186
|
+
// },
|
|
1187
|
+
// {
|
|
1188
|
+
// name: "Boys",
|
|
1189
|
+
// y: 40,
|
|
1190
|
+
// color: "#36A2EB", // Custom color for Boys
|
|
1191
|
+
// },
|
|
1192
|
+
// {
|
|
1193
|
+
// name: "Students",
|
|
1194
|
+
// y: 40,
|
|
1195
|
+
// color: "#FFCE56", // Custom color for Students
|
|
1196
|
+
// },
|
|
1197
|
+
// ],
|
|
1198
|
+
// },
|
|
1199
|
+
// ],
|
|
1133
1200
|
};
|
|
1134
1201
|
console.log(chartOptions);
|
|
1135
|
-
return /* @__PURE__ */ import_react31.default.createElement(import_react31.default.Fragment, null, /* @__PURE__ */ import_react31.default.createElement(
|
|
1202
|
+
return /* @__PURE__ */ import_react31.default.createElement(import_react31.default.Fragment, null, /* @__PURE__ */ import_react31.default.createElement(HighchartsChart, { options: chartOptions }));
|
|
1136
1203
|
};
|
|
1137
1204
|
// Annotate the CommonJS export names for ESM import in node:
|
|
1138
1205
|
0 && (module.exports = {
|
package/dist/index.mjs
CHANGED
|
@@ -683,6 +683,7 @@ var TableElement = (props) => {
|
|
|
683
683
|
title: col.label,
|
|
684
684
|
dataIndex: col.name,
|
|
685
685
|
key: col.key,
|
|
686
|
+
ellipsis: col.ellipsis,
|
|
686
687
|
render: col.render,
|
|
687
688
|
sorter: {
|
|
688
689
|
compare: (a, b) => {
|
|
@@ -1027,51 +1028,117 @@ var OtpElement = (props) => {
|
|
|
1027
1028
|
import React31 from "react";
|
|
1028
1029
|
import Highcharts from "highcharts";
|
|
1029
1030
|
import HighchartsReact from "highcharts-react-official";
|
|
1031
|
+
var HighchartsChart = ({ options }) => {
|
|
1032
|
+
return /* @__PURE__ */ React31.createElement(HighchartsReact, { highcharts: Highcharts, options });
|
|
1033
|
+
};
|
|
1030
1034
|
var Donut = (props) => {
|
|
1031
1035
|
console.log(props);
|
|
1032
1036
|
const chartOptions = {
|
|
1037
|
+
chart: {
|
|
1038
|
+
type: "pie"
|
|
1039
|
+
},
|
|
1033
1040
|
title: {
|
|
1034
|
-
text: "
|
|
1041
|
+
text: "Egg Yolk Composition"
|
|
1042
|
+
},
|
|
1043
|
+
tooltip: {
|
|
1044
|
+
valueSuffix: "%"
|
|
1045
|
+
},
|
|
1046
|
+
subtitle: {
|
|
1047
|
+
text: 'Source:<a href="https://www.mdpi.com/2072-6643/11/3/684/htm" target="_default">MDPI</a>'
|
|
1035
1048
|
},
|
|
1036
1049
|
plotOptions: {
|
|
1037
|
-
|
|
1038
|
-
|
|
1039
|
-
|
|
1040
|
-
|
|
1041
|
-
|
|
1042
|
-
|
|
1043
|
-
|
|
1050
|
+
series: {
|
|
1051
|
+
allowPointSelect: true,
|
|
1052
|
+
cursor: "pointer",
|
|
1053
|
+
dataLabels: [{
|
|
1054
|
+
enabled: true,
|
|
1055
|
+
distance: 20
|
|
1056
|
+
}, {
|
|
1057
|
+
enabled: true,
|
|
1058
|
+
distance: -40,
|
|
1059
|
+
format: "{point.percentage:.1f}%",
|
|
1060
|
+
style: {
|
|
1061
|
+
fontSize: "1.2em",
|
|
1062
|
+
textOutline: "none",
|
|
1063
|
+
opacity: 0.7
|
|
1064
|
+
},
|
|
1065
|
+
filter: {
|
|
1066
|
+
operator: ">",
|
|
1067
|
+
property: "percentage",
|
|
1068
|
+
value: 10
|
|
1069
|
+
}
|
|
1070
|
+
}]
|
|
1044
1071
|
}
|
|
1045
1072
|
},
|
|
1046
1073
|
series: [
|
|
1047
1074
|
{
|
|
1048
|
-
type: "pie",
|
|
1049
1075
|
name: "Percentage",
|
|
1076
|
+
colorByPoint: true,
|
|
1050
1077
|
data: [
|
|
1051
1078
|
{
|
|
1052
|
-
name: "
|
|
1053
|
-
y:
|
|
1054
|
-
|
|
1055
|
-
|
|
1079
|
+
name: "Water",
|
|
1080
|
+
y: 55.02
|
|
1081
|
+
},
|
|
1082
|
+
{
|
|
1083
|
+
name: "Fat",
|
|
1084
|
+
sliced: true,
|
|
1085
|
+
selected: true,
|
|
1086
|
+
y: 26.71
|
|
1087
|
+
},
|
|
1088
|
+
{
|
|
1089
|
+
name: "Carbohydrates",
|
|
1090
|
+
y: 1.09
|
|
1056
1091
|
},
|
|
1057
1092
|
{
|
|
1058
|
-
name: "
|
|
1059
|
-
y:
|
|
1060
|
-
color: "#36A2EB"
|
|
1061
|
-
// Custom color for Boys
|
|
1093
|
+
name: "Protein",
|
|
1094
|
+
y: 15.5
|
|
1062
1095
|
},
|
|
1063
1096
|
{
|
|
1064
|
-
name: "
|
|
1065
|
-
y:
|
|
1066
|
-
color: "#FFCE56"
|
|
1067
|
-
// Custom color for Students
|
|
1097
|
+
name: "Ash",
|
|
1098
|
+
y: 1.68
|
|
1068
1099
|
}
|
|
1069
1100
|
]
|
|
1070
1101
|
}
|
|
1071
1102
|
]
|
|
1103
|
+
// title: {
|
|
1104
|
+
// text: "Distribution of Students",
|
|
1105
|
+
// },
|
|
1106
|
+
// plotOptions: {
|
|
1107
|
+
// pie: {
|
|
1108
|
+
// innerSize: "70%",
|
|
1109
|
+
// dataLabels: {
|
|
1110
|
+
// enabled: false,
|
|
1111
|
+
// format: "<b>{point.name}</b>: {point.percentage:.1f} %",
|
|
1112
|
+
// },
|
|
1113
|
+
// showInLegend: true,
|
|
1114
|
+
// },
|
|
1115
|
+
// },
|
|
1116
|
+
// series: [
|
|
1117
|
+
// {
|
|
1118
|
+
// type: "pie",
|
|
1119
|
+
// name: "Percentage",
|
|
1120
|
+
// data: [
|
|
1121
|
+
// {
|
|
1122
|
+
// name: "Girls",
|
|
1123
|
+
// y: 20,
|
|
1124
|
+
// color: "#FF6384", // Custom color for Girls
|
|
1125
|
+
// },
|
|
1126
|
+
// {
|
|
1127
|
+
// name: "Boys",
|
|
1128
|
+
// y: 40,
|
|
1129
|
+
// color: "#36A2EB", // Custom color for Boys
|
|
1130
|
+
// },
|
|
1131
|
+
// {
|
|
1132
|
+
// name: "Students",
|
|
1133
|
+
// y: 40,
|
|
1134
|
+
// color: "#FFCE56", // Custom color for Students
|
|
1135
|
+
// },
|
|
1136
|
+
// ],
|
|
1137
|
+
// },
|
|
1138
|
+
// ],
|
|
1072
1139
|
};
|
|
1073
1140
|
console.log(chartOptions);
|
|
1074
|
-
return /* @__PURE__ */ React31.createElement(React31.Fragment, null, /* @__PURE__ */ React31.createElement(
|
|
1141
|
+
return /* @__PURE__ */ React31.createElement(React31.Fragment, null, /* @__PURE__ */ React31.createElement(HighchartsChart, { options: chartOptions }));
|
|
1075
1142
|
};
|
|
1076
1143
|
export {
|
|
1077
1144
|
AddMoreTable,
|