source: node_modules/recharts/es6/component/Label.js@ a762898

Last change on this file since a762898 was a762898, checked in by istevanoska <ilinastevanoska@…>, 5 months ago

Added visualizations
  • Property mode set to 100644
File size: 13.7 KB
Line 
1var _excluded = ["labelRef"],
2 _excluded2 = ["content"];
3function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
4function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
5function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
6function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
7function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
8function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
9function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
10function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
11import * as React from 'react';
12import { cloneElement, createContext, createElement, isValidElement, useContext, useMemo } from 'react';
13import { clsx } from 'clsx';
14import { isValidTextAnchor, Text } from './Text';
15import { isNullish, isNumber, isNumOrStr, mathSign, uniqueId } from '../util/DataUtils';
16import { polarToCartesian } from '../util/PolarUtils';
17import { cartesianViewBoxToTrapezoid, useViewBox } from '../context/chartLayoutContext';
18import { useAppSelector } from '../state/hooks';
19import { selectPolarViewBox } from '../state/selectors/polarAxisSelectors';
20import { resolveDefaultProps } from '../util/resolveDefaultProps';
21import { svgPropertiesAndEvents } from '../util/svgPropertiesAndEvents';
22import { ZIndexLayer } from '../zIndex/ZIndexLayer';
23import { DefaultZIndexes } from '../zIndex/DefaultZIndexes';
24import { getCartesianPosition } from '../cartesian/getCartesianPosition';
25
26/**
27 * @inline
28 */
29
30/**
31 * @inline
32 */
33
34/**
35 * @inline
36 */
37
38var CartesianLabelContext = /*#__PURE__*/createContext(null);
39export var CartesianLabelContextProvider = _ref => {
40 var {
41 x,
42 y,
43 upperWidth,
44 lowerWidth,
45 width,
46 height,
47 children
48 } = _ref;
49 var viewBox = useMemo(() => ({
50 x,
51 y,
52 upperWidth,
53 lowerWidth,
54 width,
55 height
56 }), [x, y, upperWidth, lowerWidth, width, height]);
57 return /*#__PURE__*/React.createElement(CartesianLabelContext.Provider, {
58 value: viewBox
59 }, children);
60};
61var useCartesianLabelContext = () => {
62 var labelChildContext = useContext(CartesianLabelContext);
63 var chartContext = useViewBox();
64 return labelChildContext || (chartContext ? cartesianViewBoxToTrapezoid(chartContext) : undefined);
65};
66var PolarLabelContext = /*#__PURE__*/createContext(null);
67export var PolarLabelContextProvider = _ref2 => {
68 var {
69 cx,
70 cy,
71 innerRadius,
72 outerRadius,
73 startAngle,
74 endAngle,
75 clockWise,
76 children
77 } = _ref2;
78 var viewBox = useMemo(() => ({
79 cx,
80 cy,
81 innerRadius,
82 outerRadius,
83 startAngle,
84 endAngle,
85 clockWise
86 }), [cx, cy, innerRadius, outerRadius, startAngle, endAngle, clockWise]);
87 return /*#__PURE__*/React.createElement(PolarLabelContext.Provider, {
88 value: viewBox
89 }, children);
90};
91export var usePolarLabelContext = () => {
92 var labelChildContext = useContext(PolarLabelContext);
93 var chartContext = useAppSelector(selectPolarViewBox);
94 return labelChildContext || chartContext;
95};
96var getLabel = props => {
97 var {
98 value,
99 formatter
100 } = props;
101 var label = isNullish(props.children) ? value : props.children;
102 if (typeof formatter === 'function') {
103 return formatter(label);
104 }
105 return label;
106};
107export var isLabelContentAFunction = content => {
108 return content != null && typeof content === 'function';
109};
110var getDeltaAngle = (startAngle, endAngle) => {
111 var sign = mathSign(endAngle - startAngle);
112 var deltaAngle = Math.min(Math.abs(endAngle - startAngle), 360);
113 return sign * deltaAngle;
114};
115var renderRadialLabel = (labelProps, position, label, attrs, viewBox) => {
116 var {
117 offset,
118 className
119 } = labelProps;
120 var {
121 cx,
122 cy,
123 innerRadius,
124 outerRadius,
125 startAngle,
126 endAngle,
127 clockWise
128 } = viewBox;
129 var radius = (innerRadius + outerRadius) / 2;
130 var deltaAngle = getDeltaAngle(startAngle, endAngle);
131 var sign = deltaAngle >= 0 ? 1 : -1;
132 var labelAngle, direction;
133 switch (position) {
134 case 'insideStart':
135 labelAngle = startAngle + sign * offset;
136 direction = clockWise;
137 break;
138 case 'insideEnd':
139 labelAngle = endAngle - sign * offset;
140 direction = !clockWise;
141 break;
142 case 'end':
143 labelAngle = endAngle + sign * offset;
144 direction = clockWise;
145 break;
146 default:
147 throw new Error("Unsupported position ".concat(position));
148 }
149 direction = deltaAngle <= 0 ? direction : !direction;
150 var startPoint = polarToCartesian(cx, cy, radius, labelAngle);
151 var endPoint = polarToCartesian(cx, cy, radius, labelAngle + (direction ? 1 : -1) * 359);
152 var path = "M".concat(startPoint.x, ",").concat(startPoint.y, "\n A").concat(radius, ",").concat(radius, ",0,1,").concat(direction ? 0 : 1, ",\n ").concat(endPoint.x, ",").concat(endPoint.y);
153 var id = isNullish(labelProps.id) ? uniqueId('recharts-radial-line-') : labelProps.id;
154 return /*#__PURE__*/React.createElement("text", _extends({}, attrs, {
155 dominantBaseline: "central",
156 className: clsx('recharts-radial-bar-label', className)
157 }), /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("path", {
158 id: id,
159 d: path
160 })), /*#__PURE__*/React.createElement("textPath", {
161 xlinkHref: "#".concat(id)
162 }, label));
163};
164var getAttrsOfPolarLabel = (viewBox, offset, position) => {
165 var {
166 cx,
167 cy,
168 innerRadius,
169 outerRadius,
170 startAngle,
171 endAngle
172 } = viewBox;
173 var midAngle = (startAngle + endAngle) / 2;
174 if (position === 'outside') {
175 var {
176 x: _x,
177 y: _y
178 } = polarToCartesian(cx, cy, outerRadius + offset, midAngle);
179 return {
180 x: _x,
181 y: _y,
182 textAnchor: _x >= cx ? 'start' : 'end',
183 verticalAnchor: 'middle'
184 };
185 }
186 if (position === 'center') {
187 return {
188 x: cx,
189 y: cy,
190 textAnchor: 'middle',
191 verticalAnchor: 'middle'
192 };
193 }
194 if (position === 'centerTop') {
195 return {
196 x: cx,
197 y: cy,
198 textAnchor: 'middle',
199 verticalAnchor: 'start'
200 };
201 }
202 if (position === 'centerBottom') {
203 return {
204 x: cx,
205 y: cy,
206 textAnchor: 'middle',
207 verticalAnchor: 'end'
208 };
209 }
210 var r = (innerRadius + outerRadius) / 2;
211 var {
212 x,
213 y
214 } = polarToCartesian(cx, cy, r, midAngle);
215 return {
216 x,
217 y,
218 textAnchor: 'middle',
219 verticalAnchor: 'middle'
220 };
221};
222var isPolar = viewBox => viewBox != null && 'cx' in viewBox && isNumber(viewBox.cx);
223export var defaultLabelProps = {
224 angle: 0,
225 offset: 5,
226 zIndex: DefaultZIndexes.label,
227 position: 'middle',
228 textBreakAll: false
229};
230function polarViewBoxToTrapezoid(viewBox) {
231 if (!isPolar(viewBox)) {
232 return viewBox;
233 }
234 var {
235 cx,
236 cy,
237 outerRadius
238 } = viewBox;
239 var diameter = outerRadius * 2;
240 return {
241 x: cx - outerRadius,
242 y: cy - outerRadius,
243 width: diameter,
244 upperWidth: diameter,
245 lowerWidth: diameter,
246 height: diameter
247 };
248}
249
250/**
251 * @consumes CartesianViewBoxContext
252 * @consumes PolarViewBoxContext
253 * @consumes CartesianLabelContext
254 * @consumes PolarLabelContext
255 */
256export function Label(outerProps) {
257 var props = resolveDefaultProps(outerProps, defaultLabelProps);
258 var {
259 viewBox: viewBoxFromProps,
260 parentViewBox,
261 position,
262 value,
263 children,
264 content,
265 className = '',
266 textBreakAll,
267 labelRef
268 } = props;
269 var polarViewBox = usePolarLabelContext();
270 var cartesianViewBox = useCartesianLabelContext();
271
272 /*
273 * I am not proud about this solution, but it's a quick fix for https://github.com/recharts/recharts/issues/6030#issuecomment-3155352460.
274 * What we should really do is split Label into two components: CartesianLabel and PolarLabel and then handle their respective viewBoxes separately.
275 * Also other components should set its own viewBox in a context so that we can fix https://github.com/recharts/recharts/issues/6156
276 */
277 var resolvedViewBox = position === 'center' ? cartesianViewBox : polarViewBox !== null && polarViewBox !== void 0 ? polarViewBox : cartesianViewBox;
278 var viewBox, label, positionAttrs;
279 if (viewBoxFromProps == null) {
280 viewBox = resolvedViewBox;
281 } else if (isPolar(viewBoxFromProps)) {
282 viewBox = viewBoxFromProps;
283 } else {
284 viewBox = cartesianViewBoxToTrapezoid(viewBoxFromProps);
285 }
286 var cartesianBox = polarViewBoxToTrapezoid(viewBox);
287 if (!viewBox || isNullish(value) && isNullish(children) && ! /*#__PURE__*/isValidElement(content) && typeof content !== 'function') {
288 return null;
289 }
290 var propsWithViewBox = _objectSpread(_objectSpread({}, props), {}, {
291 viewBox
292 });
293 if (/*#__PURE__*/isValidElement(content)) {
294 var {
295 labelRef: _
296 } = propsWithViewBox,
297 propsWithoutLabelRef = _objectWithoutProperties(propsWithViewBox, _excluded);
298 return /*#__PURE__*/cloneElement(content, propsWithoutLabelRef);
299 }
300 if (typeof content === 'function') {
301 var {
302 content: _2
303 } = propsWithViewBox,
304 propsForContent = _objectWithoutProperties(propsWithViewBox, _excluded2);
305 // @ts-expect-error we're not checking if the content component returns something that Text is able to render
306 label = /*#__PURE__*/createElement(content, propsForContent);
307 if (/*#__PURE__*/isValidElement(label)) {
308 return label;
309 }
310 } else {
311 label = getLabel(props);
312 }
313 var attrs = svgPropertiesAndEvents(props);
314 if (isPolar(viewBox)) {
315 // TODO: Generic Polar Hook
316 if (position === 'insideStart' || position === 'insideEnd' || position === 'end') {
317 return renderRadialLabel(props, position, label, attrs, viewBox);
318 }
319 positionAttrs = getAttrsOfPolarLabel(viewBox, props.offset, props.position);
320 } else {
321 if (!cartesianBox) {
322 return null;
323 }
324 var cartesianResult = getCartesianPosition({
325 viewBox: cartesianBox,
326 position,
327 offset: props.offset,
328 parentViewBox: isPolar(parentViewBox) ? undefined : parentViewBox,
329 clamp: true
330 });
331 positionAttrs = _objectSpread(_objectSpread({
332 x: cartesianResult.x,
333 y: cartesianResult.y,
334 textAnchor: cartesianResult.horizontalAnchor,
335 verticalAnchor: cartesianResult.verticalAnchor
336 }, cartesianResult.width !== undefined ? {
337 width: cartesianResult.width
338 } : {}), cartesianResult.height !== undefined ? {
339 height: cartesianResult.height
340 } : {});
341 }
342 return /*#__PURE__*/React.createElement(ZIndexLayer, {
343 zIndex: props.zIndex
344 }, /*#__PURE__*/React.createElement(Text, _extends({
345 ref: labelRef,
346 className: clsx('recharts-label', className)
347 }, attrs, positionAttrs, {
348 /*
349 * textAnchor is decided by default based on the `position`
350 * but we allow overriding via props for precise control.
351 */
352 textAnchor: isValidTextAnchor(attrs.textAnchor) ? attrs.textAnchor : positionAttrs.textAnchor,
353 breakAll: textBreakAll
354 }), label));
355}
356Label.displayName = 'Label';
357var parseLabel = (label, viewBox, labelRef) => {
358 if (!label) {
359 return null;
360 }
361 var commonProps = {
362 viewBox,
363 labelRef
364 };
365 if (label === true) {
366 return /*#__PURE__*/React.createElement(Label, _extends({
367 key: "label-implicit"
368 }, commonProps));
369 }
370 if (isNumOrStr(label)) {
371 return /*#__PURE__*/React.createElement(Label, _extends({
372 key: "label-implicit",
373 value: label
374 }, commonProps));
375 }
376 if (/*#__PURE__*/isValidElement(label)) {
377 if (label.type === Label) {
378 return /*#__PURE__*/cloneElement(label, _objectSpread({
379 key: 'label-implicit'
380 }, commonProps));
381 }
382 return /*#__PURE__*/React.createElement(Label, _extends({
383 key: "label-implicit",
384 content: label
385 }, commonProps));
386 }
387 if (isLabelContentAFunction(label)) {
388 return /*#__PURE__*/React.createElement(Label, _extends({
389 key: "label-implicit",
390 content: label
391 }, commonProps));
392 }
393 if (label && typeof label === 'object') {
394 return /*#__PURE__*/React.createElement(Label, _extends({}, label, {
395 key: "label-implicit"
396 }, commonProps));
397 }
398 return null;
399};
400export function CartesianLabelFromLabelProp(_ref3) {
401 var {
402 label,
403 labelRef
404 } = _ref3;
405 var viewBox = useCartesianLabelContext();
406 return parseLabel(label, viewBox, labelRef) || null;
407}
408export function PolarLabelFromLabelProp(_ref4) {
409 var {
410 label
411 } = _ref4;
412 var viewBox = usePolarLabelContext();
413 return parseLabel(label, viewBox) || null;
414}
Note: See TracBrowser for help on using the repository browser.