@hisptz/react-ui
Version:
A collection of reusable complex DHIS2 react ui components.
25 lines (24 loc) • 2.15 kB
JavaScript
import React from "react";
import i18n from "@dhis2/d2-i18n";
import { DataTable, TableHead, TableBody, DataTableRow, DataTableCell, DataTableColumnHeader } from "@dhis2/ui";
export default function Legend(props) {
var _legendSet$legends;
const legendSet = props === null || props === void 0 ? void 0 : props.legendSet;
return /*#__PURE__*/React.createElement("li", {
key: legendSet === null || legendSet === void 0 ? void 0 : legendSet.id
}, /*#__PURE__*/React.createElement("p", null, legendSet === null || legendSet === void 0 ? void 0 : legendSet.displayName, " spread accross ", legendSet === null || legendSet === void 0 ? void 0 : (_legendSet$legends = legendSet.legends) === null || _legendSet$legends === void 0 ? void 0 : _legendSet$legends.length, " ", "classes of for analysis"), /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(DataTable, null, /*#__PURE__*/React.createElement(TableHead, null, /*#__PURE__*/React.createElement(DataTableRow, null, /*#__PURE__*/React.createElement(DataTableColumnHeader, null, i18n.t("Class")), /*#__PURE__*/React.createElement(DataTableColumnHeader, null, i18n.t("Upper")), /*#__PURE__*/React.createElement(DataTableColumnHeader, null, i18n.t("Lower")), /*#__PURE__*/React.createElement(DataTableColumnHeader, null, i18n.t("Color")))), /*#__PURE__*/React.createElement(TableBody, null, legendSet === null || legendSet === void 0 ? void 0 : legendSet.legends.map(legend => {
return /*#__PURE__*/React.createElement(DataTableRow, {
key: legend.id
}, /*#__PURE__*/React.createElement(DataTableCell, {
bordered: true
}, legend === null || legend === void 0 ? void 0 : legend.displayName), /*#__PURE__*/React.createElement(DataTableCell, {
bordered: true
}, legend === null || legend === void 0 ? void 0 : legend.endValue), /*#__PURE__*/React.createElement(DataTableCell, {
bordered: true
}, legend === null || legend === void 0 ? void 0 : legend.startValue), /*#__PURE__*/React.createElement("td", {
style: {
background: legend === null || legend === void 0 ? void 0 : legend.color
}
}));
})))));
}