@lobehub/ui/es/dashboard/TitleWithTips/TitleWithTips.mjs

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

"use client";
import FlexBasic_default from "../../Flex/FlexBasic.mjs";
import Icon from "../../Icon/Icon.mjs";
import { Tooltip } from "../../base-ui/Tooltip/Tooltip.mjs";
import { jsx, jsxs } from "react/jsx-runtime";
import { cssVar } from "antd-style";
import { InfoIcon } from "lucide-react";
//#region src/dashboard/TitleWithTips/TitleWithTips.tsx
/** A column or field title with an info icon that explains it on hover. */
const TitleWithTips = ({ className, tips, title }) => /* @__PURE__ */ jsxs(FlexBasic_default, {
	horizontal: true,
	align: "center",
	className,
	gap: 4,
	children: [/* @__PURE__ */ jsx("span", { children: title }), /* @__PURE__ */ jsx(Tooltip, {
		title: tips,
		children: /* @__PURE__ */ jsx(Icon, {
			color: cssVar.colorTextTertiary,
			icon: InfoIcon,
			style: { cursor: "help" }
		})
	})]
});
TitleWithTips.displayName = "TitleWithTips";
//#endregion
export { TitleWithTips as default };

//# sourceMappingURL=TitleWithTips.mjs.map