wp-optimize / vendor / team-updraft / lib-onboarding-wizard / Wizard / Onboarding / src / components / Fields / Textarea.tsx

Textarea.tsx in WP-Optimize – Cache, Compress images, Minify & Clean database to boost page speed & performance trunk, at vendor/team-updraft/lib-onboarding-wizard/Wizard/Onboarding/src/components/Fields/Textarea.tsx

51 lines 1.7 KB

Raw Download Zip

1	import { memo, TextareaHTMLAttributes } from 'react';
2	import FieldWrapper from './FieldWrapper';
3	import { clsx } from 'clsx';
4
5	interface TextareaProps extends Omit<TextareaHTMLAttributes<HTMLTextAreaElement>, 'onChange' \| 'value'> {
6	field: {
7	id: string;
8	label?: string;
9	placeholder?: string;
10	is_lock?: boolean;
11	tooltip?: any;
12	context?: any;
13	context_html?: string;
14	rows?: number;
15	[key: string]: any;
16	};
17	value: string;
18	onChange: (value: string) => void;
19	fieldStatus?: (id: string, success: boolean) => void;
20	}
21
22	const Textarea = ({ field, value, onChange, fieldStatus, ...props }: TextareaProps) => {
23	const disabled = field.is_lock === true;
24	const rows = field.rows ?? 4; // Default to 4 rows if not specified
25
26	return (
27	<FieldWrapper
28	inputId={field.id}
29	label={field.label}
30	tooltip={field.tooltip}
31	context={field.context}
32	contextHtml={field.context_html ?? ''}
33	>
34	<textarea
35	id={field.id}
36	placeholder={field.placeholder}
37	value={value}
38	onChange={(e) => onChange(e.target.value)}
39	disabled={disabled}
40	rows={rows}
41	className={clsx(
42	"w-full rounded-md border border-gray-400 p-2 focus:border-primary-dark focus:outline-none focus:ring disabled:cursor-not-allowed disabled:border-gray-200 disabled:bg-gray-200",
43	disabled && "bg-gray-200 border-gray-200"
44	)}
45	{...props}
46	/>
47	</FieldWrapper>
48	);
49	};
50
51	export default memo(Textarea);