Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 | 20x 462x 462x 462x | import { useFormContext } from "react-hook-form";
import {
HFGiveInput,
HFGiveInputProps,
} from "@shared/HFInputs/HFGiveInput/HFGiveInput";
import GiveText from "@shared/Text/GiveText";
import CopyButton from "../../GiveMerchantFile/components/CopyButton";
type Props = {
name: string;
placeholder?: string;
disabled?: boolean;
inputSuffix?: string;
showCopy?: boolean;
} & HFGiveInputProps;
const WebsiteInput = ({
name,
disabled = false,
placeholder,
showCopy = true,
...props
}: Props) => {
const { watch } = useFormContext();
const prefix = "https://";
return (
<HFGiveInput
name={name}
label={props.label}
placeholder={placeholder || "example.com"}
fullWidth
disabled={disabled}
leftContent={
<GiveText variant="bodyS" color="secondary">
{prefix}
</GiveText>
}
rightContent={
showCopy ? (
<CopyButton
hidden={!watch(name)}
text={prefix + watch(name) + (props?.inputSuffix || "")}
testId={`copy-button-${
typeof props.label === "string" ? props.label : name
}`}
/>
) : (
<></>
)
}
{...props}
/>
);
};
export default WebsiteInput;
|