@lobehub/charts
Version:
React modern charts components built on recharts
60 lines • 2.07 kB
JavaScript
import { memo } from 'react';
import { useStyles } from "./styles";
import { jsx as _jsx } from "react/jsx-runtime";
import { jsxs as _jsxs } from "react/jsx-runtime";
var Footer = /*#__PURE__*/memo(function (_ref) {
var hideTotalCount = _ref.hideTotalCount,
hideColorLegend = _ref.hideColorLegend,
weekdayLabelOffset = _ref.weekdayLabelOffset,
loading = _ref.loading,
labels = _ref.labels,
year = _ref.year,
maxLevel = _ref.maxLevel,
blockSize = _ref.blockSize,
colorScale = _ref.colorScale,
blockRadius = _ref.blockRadius,
totalCount = _ref.totalCount;
var _useStyles = useStyles(),
cx = _useStyles.cx,
styles = _useStyles.styles;
return /*#__PURE__*/_jsxs("footer", {
className: cx('footer', styles.footer),
style: {
marginLeft: weekdayLabelOffset
},
children: [loading && /*#__PURE__*/_jsx("div", {
children: "\xA0"
}), !loading && !hideTotalCount && /*#__PURE__*/_jsx("div", {
className: cx('count'),
children: labels.totalCount ? labels.totalCount.replace('{{count}}', String(totalCount)).replace('{{year}}', String(year)) : "".concat(totalCount, " activities in ").concat(year)
}), !loading && !hideColorLegend && /*#__PURE__*/_jsxs("div", {
className: cx('legend-colors', styles.legendColors),
children: [/*#__PURE__*/_jsx("span", {
style: {
marginRight: '0.4em'
},
children: labels.legend.less
}), Array.from({
length: maxLevel + 1
}).fill(null).map(function (_, level) {
return /*#__PURE__*/_jsx("svg", {
height: blockSize,
width: blockSize,
children: /*#__PURE__*/_jsx("rect", {
fill: colorScale[level],
height: blockSize,
rx: blockRadius,
ry: blockRadius,
width: blockSize
})
}, level);
}), /*#__PURE__*/_jsx("span", {
style: {
marginLeft: '0.4em'
},
children: labels.legend.more
})]
})]
});
});
export default Footer;