revert info on field label

This commit is contained in:
Andrew Davis 2025-04-05 23:57:05 +10:00
parent 10dbdf783f
commit 95eb908fcf
No known key found for this signature in database
GPG Key ID: 30AB5B89A109D044
1 changed files with 13 additions and 34 deletions

View File

@ -1,5 +1,4 @@
import React from "react"; import React from "react";
import { LuInfo } from "react-icons/lu";
import { cx } from "@/cva.config"; import { cx } from "@/cva.config";
@ -9,7 +8,6 @@ interface Props {
as?: "label" | "span"; as?: "label" | "span";
description?: string | React.ReactNode | null; description?: string | React.ReactNode | null;
disabled?: boolean; disabled?: boolean;
info?: string;
} }
export default function FieldLabel({ export default function FieldLabel({
label, label,
@ -17,36 +15,7 @@ export default function FieldLabel({
as = "label", as = "label",
description, description,
disabled, disabled,
info,
}: Props) { }: Props) {
const labelContent = (
<>
<div className="flex items-center gap-1">
{label}
{info && (
<div className="group relative cursor-pointer">
<LuInfo className={cx(
"h-4 w-4",
"text-blue-500 hover:text-blue-600 dark:text-blue-400 dark:hover:text-blue-300"
)} />
<div className={cx(
"absolute left-1/2 top-full z-10 mt-1 hidden w-64 -translate-x-1/2",
"rounded-md bg-slate-800 px-3 py-2 text-xs text-white shadow-lg",
"group-hover:block dark:bg-slate-700"
)}>
<p>{info}</p>
</div>
</div>
)}
</div>
{description && (
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
{description}
</span>
)}
</>
);
if (as === "label") { if (as === "label") {
return ( return (
<label <label
@ -56,15 +25,25 @@ export default function FieldLabel({
disabled && "opacity-50", disabled && "opacity-50",
)} )}
> >
{labelContent} {label}
{description && (
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
{description}
</span>
)}
</label> </label>
); );
} else if (as === "span") { } else if (as === "span") {
return ( return (
<div className="flex select-none flex-col"> <div className="flex select-none flex-col">
<span className="font-display text-[13px] font-medium leading-snug text-black dark:text-white"> <span className="font-display text-[13px] font-medium leading-snug text-black dark:text-white">
{labelContent} {label}
</span> </span>
{description && (
<span className="my-0.5 text-[13px] font-normal text-slate-600 dark:text-slate-400">
{description}
</span>
)}
</div> </div>
); );
} else { } else {