34 lines
1.4 KiB
TypeScript
34 lines
1.4 KiB
TypeScript
import type { ReactNode } from "react";
|
|
import FieldLabel from "./help/FieldLabel";
|
|
import type { DocumentationHelpReference } from "./help/documentationHelp";
|
|
import { helpForFieldLabel } from "../utils/fieldHelp";
|
|
import { usePlatformLanguage } from "../i18n/LanguageContext";
|
|
import type { PlatformInterfaceIdentityProps } from "../types";
|
|
|
|
type FormFieldProps = PlatformInterfaceIdentityProps & {
|
|
label: ReactNode;
|
|
help?: ReactNode;
|
|
documentation?: DocumentationHelpReference;
|
|
children: ReactNode;
|
|
};
|
|
|
|
export default function FormField({ label, help, documentation, children, interfaceId, helpContextId, helpModuleId, helpTopicId }: FormFieldProps) {
|
|
const { translateText } = usePlatformLanguage();
|
|
const renderedLabel = typeof label === "string" ? translateText(label) : label;
|
|
return (
|
|
<label
|
|
className="form-field"
|
|
data-help-scope="field"
|
|
data-interface-id={interfaceId}
|
|
data-help-context-id={helpContextId ?? documentation?.contextId}
|
|
data-help-module-id={helpModuleId}
|
|
data-help-topic-id={helpTopicId ?? documentation?.topicId}
|
|
data-help-documentation-type={documentation?.documentationType}
|
|
data-help-key={typeof label === "string" ? label : undefined}
|
|
>
|
|
<FieldLabel className="form-label" help={help ?? helpForFieldLabel(label)} documentation={documentation}>{renderedLabel}</FieldLabel>
|
|
{children}
|
|
</label>
|
|
);
|
|
}
|