47 lines
1.2 KiB
TypeScript
47 lines
1.2 KiB
TypeScript
"use client";
|
|
|
|
import { memo } from "react";
|
|
import { useTranslation } from "../../../contexts/MessagesContext";
|
|
import UploadView from "./Upload.view";
|
|
import type { UploadStateValue } from "../../../../lib/propNormalization";
|
|
import type { UploadProps } from "./Upload.types";
|
|
|
|
/**
|
|
* Figma: "Control / Upload". Click-to-upload tile with a label
|
|
* and hint text used to add an image from the user's device.
|
|
*/
|
|
const UploadContainer = memo<UploadProps>(
|
|
({
|
|
active = true,
|
|
state,
|
|
hasLabel,
|
|
label,
|
|
showHelpIcon = true,
|
|
hintText,
|
|
onClick,
|
|
className = "",
|
|
}) => {
|
|
const t = useTranslation("controlsChrome");
|
|
const resolvedState: UploadStateValue =
|
|
state ?? (active ? "default" : "disabled");
|
|
|
|
return (
|
|
<UploadView
|
|
state={resolvedState}
|
|
hasLabel={hasLabel ?? Boolean(label)}
|
|
label={label}
|
|
showHelpIcon={showHelpIcon}
|
|
hintText={hintText ?? t("uploadHintDefault")}
|
|
uploadButtonLabel={t("uploadButton")}
|
|
uploadAriaLabel={t("uploadAriaLabel")}
|
|
onClick={onClick}
|
|
className={className}
|
|
/>
|
|
);
|
|
},
|
|
);
|
|
|
|
UploadContainer.displayName = "Upload";
|
|
|
|
export default UploadContainer;
|