wp-optimize / vendor / team-updraft / lib-onboarding-wizard / Wizard / Onboarding / src / components / Fields / Label.tsx

Label.tsx in WP-Optimize – Cache, Compress images, Minify & Clean database to boost page speed & performance trunk, at vendor/team-updraft/lib-onboarding-wizard/Wizard/Onboarding/src/components/Fields/Label.tsx

41 lines 1.1 KB

Raw Download Zip

1	import * as RadixLabel from "@radix-ui/react-label";
2	import { memo, type ReactNode } from "react";
3	import { clsx } from "clsx";
4	import Icon from "../../utils/Icon";
5	import Tooltip from "../../utils/Tooltip/Tooltip";
6	import type { TooltipProps } from "../../utils/Tooltip/Tooltip";
7
8	interface LabelProps {
9	htmlFor?: string;
10	text: ReactNode;
11	tooltip?: TooltipProps;
12	className?: string;
13	}
14
15	const Label = ({
16	htmlFor,
17	text,
18	tooltip,
19	className,
20	}: LabelProps) => {
21	return (
22	<RadixLabel.Root
23	htmlFor={htmlFor}
24	className={clsx("flex items-center gap-2 text-md font-medium text-black cursor-pointer", className)}
25	>
26	<span>{text}</span>
27	{tooltip && (
28	<Tooltip tooltip={tooltip} triggerClassName="ml-[-4px]">
29	<Icon
30	name={'info'}
31	color="gray500"
32	fill="gray500"
33	size={16}
34	/>
35	</Tooltip>
36	)}
37	</RadixLabel.Root>
38	);
39	};
40
41	export default memo(Label);