@lobehub/ui/es/base-ui/Text/Text.mjs

Lobe UI is an open-source UI component library for building AIGC web apps

"use client";
import { useTextOverflow } from "../../hooks/useTextOverflow.mjs";
import { Tooltip } from "../Tooltip/Tooltip.mjs";
import { variants } from "./style.mjs";
import { memo, useRef } from "react";
import { jsx } from "react/jsx-runtime";
import { cx } from "antd-style";
//#region src/base-ui/Text/Text.tsx
const InternalText = memo(({ align, as: Container = "div", children, className, classNames, code, color, delete: deleteStyle, disabled, ellipsis, fontSize, italic, lineClamp, lineHeight, mark, noWrap, ref, shiny, shinyDuration, strong, style, styles: customStyles, textDecoration, textTransform, type, underline, weight, whiteSpace, wordBreak, ...rest }) => {
	const innerRef = useRef(null);
	const isOverflow = useTextOverflow(innerRef, ellipsis, children);
	const isMultiEllipsis = typeof ellipsis === "object" && !!ellipsis.rows && ellipsis.rows > 1;
	const tooltipWhenOverflow = typeof ellipsis === "object" && ellipsis.tooltipWhenOverflow;
	const setNodeRef = (node) => {
		innerRef.current = node;
		if (typeof ref === "function") ref(node);
		else if (ref) ref.current = node;
	};
	const textStyle = {
		...color && { color },
		...weight && { fontWeight: weight },
		...lineHeight && { lineHeight },
		...textTransform && { textTransform },
		...textDecoration && { textDecoration },
		...wordBreak && { wordBreak },
		...typeof ellipsis === "object" && ellipsis.rows && { WebkitLineClamp: ellipsis.rows },
		...!ellipsis && !!lineClamp && {
			WebkitBoxOrient: "vertical",
			WebkitLineClamp: lineClamp,
			display: "-webkit-box",
			overflow: "hidden",
			textOverflow: "ellipsis"
		},
		...shiny && shinyDuration && { "--shiny-duration": shinyDuration },
		...fontSize && { fontSize },
		...align && { textAlign: align },
		...!isMultiEllipsis && noWrap && { whiteSpace: "nowrap" },
		...whiteSpace && { whiteSpace },
		...style,
		...customStyles?.root
	};
	const content = /* @__PURE__ */ jsx(Container, {
		...rest,
		ref: setNodeRef,
		style: textStyle,
		className: cx(variants({
			as: [
				"h1",
				"h2",
				"h3",
				"h4",
				"h5",
				"p"
			].includes(Container) ? Container : void 0,
			code,
			delete: deleteStyle,
			disabled,
			ellipsis: ellipsis ? typeof ellipsis === "object" && ellipsis.rows ? "multi" : true : void 0,
			italic,
			mark,
			shiny,
			strong,
			type,
			underline
		}), className, classNames?.root),
		children
	});
	if (ellipsis && typeof ellipsis === "object" && (ellipsis.tooltip || ellipsis.tooltipWhenOverflow)) {
		if (tooltipWhenOverflow && !isOverflow) return content;
		const title = typeof ellipsis.tooltip === "string" ? ellipsis.tooltip : children;
		if (ellipsis.tooltip && typeof ellipsis.tooltip === "object") return /* @__PURE__ */ jsx(Tooltip, {
			...ellipsis.tooltip,
			title: ellipsis.tooltip?.title || title,
			children: content
		});
		return /* @__PURE__ */ jsx(Tooltip, {
			title,
			children: content
		});
	}
	return content;
});
InternalText.displayName = "Text";
const Text = InternalText;
//#endregion
export { Text as default };

//# sourceMappingURL=Text.mjs.map