1 files changed, 59 insertions, 0 deletions
diff --git a/plugins/jetpack/extensions/blocks/contact-form/components/jetpack-field-textarea.js b/plugins/jetpack/extensions/blocks/contact-form/components/jetpack-field-textarea.js
new file mode 100644
index 00000000..e2025941
--- /dev/null
+++ b/plugins/jetpack/extensions/blocks/contact-form/components/jetpack-field-textarea.js
@@ -0,0 +1,59 @@
+/**
+ * External dependencies
+ */
+import { __ } from '@wordpress/i18n';
+import { Fragment } from '@wordpress/element';
+import { InspectorControls } from '@wordpress/editor';
+import { PanelBody, TextareaControl, TextControl } from '@wordpress/components';
+
+/**
+ * Internal dependencies
+ */
+import JetpackFieldLabel from './jetpack-field-label';
+
+function JetpackFieldTextarea( {
+	required,
+	label,
+	setAttributes,
+	isSelected,
+	defaultValue,
+	placeholder,
+	id,
+} ) {
+	return (
+		<Fragment>
+			<div className="jetpack-field">
+				<TextareaControl
+					label={
+						<JetpackFieldLabel
+							required={ required }
+							label={ label }
+							setAttributes={ setAttributes }
+							isSelected={ isSelected }
+						/>
+					}
+					placeholder={ placeholder }
+					value={ placeholder }
+					onChange={ value => setAttributes( { placeholder: value } ) }
+					title={ __( 'Set the placeholder text', 'jetpack' ) }
+				/>
+			</div>
+			<InspectorControls>
+				<PanelBody title={ __( 'Field Settings', 'jetpack' ) }>
+					<TextControl
+						label={ __( 'Default Value', 'jetpack' ) }
+						value={ defaultValue }
+						onChange={ value => setAttributes( { defaultValue: value } ) }
+					/>
+					<TextControl
+						label={ __( 'ID', 'jetpack' ) }
+						value={ id }
+						onChange={ value => setAttributes( { id: value } ) }
+					/>
+				</PanelBody>
+			</InspectorControls>
+		</Fragment>
+	);
+}
+
+export default JetpackFieldTextarea;