65 lines
1.9 KiB
TypeScript
65 lines
1.9 KiB
TypeScript
// * Packages
|
|
import { usePage } from "@inertiajs/react";
|
|
// * Components shadcn
|
|
import { Label } from "@/components/ui/label";
|
|
import { Textarea } from "@/components/ui/textarea";
|
|
// * Other
|
|
import InputError from "@/back/Components/InputError";
|
|
import WordCounter from "@/back/Components/WordCounter";
|
|
import useTrans from "@/hooks/use-translations";
|
|
import { cn } from "@/lib/utils";
|
|
|
|
type SimpleTextProps = {
|
|
className?: string;
|
|
name: string;
|
|
label: string;
|
|
value?: string;
|
|
id?: string;
|
|
placeholder: string;
|
|
wordCounter?: boolean;
|
|
required?: boolean;
|
|
disabled?: boolean;
|
|
// eslint-disable-next-line no-unused-vars
|
|
setData: (name: string, value: string) => void;
|
|
};
|
|
|
|
export default function SimpleText({
|
|
className,
|
|
name,
|
|
label,
|
|
value = "",
|
|
id = name,
|
|
placeholder = "back.enter_text_here",
|
|
wordCounter = true,
|
|
required = true,
|
|
disabled = false,
|
|
setData,
|
|
}: SimpleTextProps) {
|
|
const { errors } = usePage().props;
|
|
return (
|
|
<div
|
|
className={cn(
|
|
"flex flex-col w-full justify-between items-start gap-1.5",
|
|
className,
|
|
)}
|
|
>
|
|
<Label htmlFor={name}>{label + (required ? " *" : "")}</Label>
|
|
{wordCounter && <WordCounter value={value} />}
|
|
<div className="flex w-full">
|
|
<Textarea
|
|
id={id}
|
|
name={name}
|
|
placeholder={useTrans(placeholder)}
|
|
defaultValue={value}
|
|
onChange={(e) => {
|
|
setData(name, e.target.value);
|
|
}}
|
|
required={required}
|
|
disabled={disabled}
|
|
className={cn("w-full", { "border-destructive/50": errors[name] })}
|
|
/>
|
|
</div>
|
|
<InputError message={errors[name]} />
|
|
</div>
|
|
);
|
|
}
|