89 lines
2.8 KiB
JavaScript
89 lines
2.8 KiB
JavaScript
'use client';
|
|
|
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
const _excluded = ["x", "y", "style", "text", "ownerState"],
|
|
_excluded2 = ["angle", "textAnchor", "dominantBaseline"];
|
|
import * as React from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { getWordsByLines } from "../internals/getWordsByLines.js";
|
|
import { useIsHydrated } from "../hooks/useIsHydrated.js";
|
|
import { jsx as _jsx } from "react/jsx-runtime";
|
|
/**
|
|
* Helper component to manage multiline text in SVG
|
|
*/
|
|
function ChartsText(props) {
|
|
const {
|
|
x,
|
|
y,
|
|
style: styleProps,
|
|
text
|
|
} = props,
|
|
textProps = _objectWithoutPropertiesLoose(props, _excluded);
|
|
const _ref = styleProps ?? {},
|
|
{
|
|
angle,
|
|
textAnchor,
|
|
dominantBaseline
|
|
} = _ref,
|
|
style = _objectWithoutPropertiesLoose(_ref, _excluded2);
|
|
const isHydrated = useIsHydrated();
|
|
const wordsByLines = React.useMemo(() => getWordsByLines({
|
|
style,
|
|
needsComputation: isHydrated && text.includes('\n'),
|
|
text
|
|
}), [style, text, isHydrated]);
|
|
let startDy;
|
|
switch (dominantBaseline) {
|
|
case 'hanging':
|
|
case 'text-before-edge':
|
|
startDy = 0;
|
|
break;
|
|
case 'central':
|
|
startDy = (wordsByLines.length - 1) / 2 * -wordsByLines[0].height;
|
|
break;
|
|
default:
|
|
startDy = (wordsByLines.length - 1) * -wordsByLines[0].height;
|
|
break;
|
|
}
|
|
return /*#__PURE__*/_jsx("text", _extends({}, textProps, {
|
|
transform: angle ? `rotate(${angle}, ${x}, ${y})` : undefined,
|
|
x: x,
|
|
y: y,
|
|
textAnchor: textAnchor,
|
|
dominantBaseline: dominantBaseline,
|
|
style: style,
|
|
children: wordsByLines.map((line, index) => /*#__PURE__*/_jsx("tspan", {
|
|
x: x,
|
|
dy: `${index === 0 ? startDy : wordsByLines[0].height}px`,
|
|
dominantBaseline: dominantBaseline // Propagated to fix Safari issue: https://github.com/mui/mui-x/issues/10808
|
|
,
|
|
children: line.text
|
|
}, index))
|
|
}));
|
|
}
|
|
process.env.NODE_ENV !== "production" ? ChartsText.propTypes = {
|
|
// ----------------------------- Warning --------------------------------
|
|
// | These PropTypes are generated from the TypeScript type definitions |
|
|
// | To update them edit the TypeScript types and run "pnpm proptypes" |
|
|
// ----------------------------------------------------------------------
|
|
/**
|
|
* Height of a text line (in `em`).
|
|
*/
|
|
lineHeight: PropTypes.number,
|
|
/**
|
|
* If `true`, the line width is computed.
|
|
* @default false
|
|
*/
|
|
needsComputation: PropTypes.bool,
|
|
ownerState: PropTypes.any,
|
|
/**
|
|
* Style applied to text elements.
|
|
*/
|
|
style: PropTypes.object,
|
|
/**
|
|
* Text displayed.
|
|
*/
|
|
text: PropTypes.string.isRequired
|
|
} : void 0;
|
|
export { ChartsText }; |