DefaultLegendItem.js 1.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647
  1. "use strict";
  2. exports.__esModule = true;
  3. exports.default = DefaultLegendItem;
  4. var _react = _interopRequireDefault(require("react"));
  5. var _legend = require("@vx/legend");
  6. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  7. const MARK_SIZE = 8;
  8. const MARK_STYLE = {
  9. display: 'inline-block'
  10. };
  11. function DefaultLegendItem({
  12. item,
  13. MarkRenderer,
  14. LabelRenderer
  15. }) {
  16. return _react.default.createElement(_legend.LegendItem, {
  17. key: "legend-item-" + item.field + "-" + item.value,
  18. margin: "0 5px"
  19. }, typeof MarkRenderer === 'undefined' ? _react.default.createElement("svg", {
  20. width: MARK_SIZE,
  21. height: MARK_SIZE,
  22. style: MARK_STYLE
  23. }, _react.default.createElement("circle", {
  24. fill: // @ts-ignore
  25. item.encodedValues.color || // @ts-ignore
  26. item.encodedValues.stroke || // @ts-ignore
  27. item.encodedValues.fill || '#ccc',
  28. stroke: // @ts-ignore
  29. item.encodedValues.stroke || 'none',
  30. r: MARK_SIZE / 2,
  31. cx: MARK_SIZE / 2,
  32. cy: MARK_SIZE / 2
  33. })) : _react.default.createElement(MarkRenderer, {
  34. item: item
  35. }), typeof LabelRenderer === 'undefined' ? _react.default.createElement(_legend.LegendLabel, {
  36. align: "left",
  37. margin: "0 0 0 4px"
  38. }, item.value) : _react.default.createElement(LabelRenderer, {
  39. item: item
  40. }));
  41. }