diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/index.ts b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/index.ts
index 6f7b55a3ea4b..6ce9eefd2644 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/index.ts
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/index.ts
@@ -4,4 +4,5 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-export { OnXJsonEditorUpdateHandler, XJsonEditor } from './xjson_editor';
+export { XJsonEditor } from './xjson_editor';
+export { TextEditor } from './text_editor';
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/text_editor.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/text_editor.tsx
new file mode 100644
index 000000000000..1d0e36c0d526
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/text_editor.tsx
@@ -0,0 +1,38 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { EuiPanel } from '@elastic/eui';
+import React, { FunctionComponent } from 'react';
+import { EuiFormRow } from '@elastic/eui';
+import {
+  CodeEditor,
+  FieldHook,
+  getFieldValidityAndErrorMessage,
+} from '../../../../../../shared_imports';
+
+interface Props {
+  field: FieldHook<string>;
+  editorProps: { [key: string]: any };
+}
+
+export const TextEditor: FunctionComponent<Props> = ({ field, editorProps }) => {
+  const { value, helpText, setValue, label } = field;
+  const { errorMessage } = getFieldValidityAndErrorMessage(field);
+
+  return (
+    <EuiFormRow
+      label={label}
+      helpText={helpText}
+      isInvalid={typeof errorMessage === 'string'}
+      error={errorMessage}
+      fullWidth
+    >
+      <EuiPanel paddingSize="s" hasShadow={false}>
+        <CodeEditor value={value} onChange={setValue} {...(editorProps as any)} />
+      </EuiPanel>
+    </EuiFormRow>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/xjson_editor.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/xjson_editor.tsx
index a8456ad0ffd7..228094c0dfac 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/xjson_editor.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/field_components/xjson_editor.tsx
@@ -4,25 +4,11 @@
  * you may not use this file except in compliance with the Elastic License.
  */
 
-import { EuiPanel } from '@elastic/eui';
 import { XJsonLang } from '@kbn/monaco';
 import React, { FunctionComponent, useCallback } from 'react';
-import { EuiFormRow } from '@elastic/eui';
-import {
-  CodeEditor,
-  FieldHook,
-  getFieldValidityAndErrorMessage,
-  Monaco,
-} from '../../../../../../shared_imports';
+import { FieldHook, Monaco } from '../../../../../../shared_imports';
 
-export type OnXJsonEditorUpdateHandler<T = { [key: string]: any }> = (arg: {
-  data: {
-    raw: string;
-    format(): T;
-  };
-  validate(): boolean;
-  isValid: boolean | undefined;
-}) => void;
+import { TextEditor } from './text_editor';
 
 interface Props {
   field: FieldHook<string>;
@@ -30,9 +16,8 @@ interface Props {
 }
 
 export const XJsonEditor: FunctionComponent<Props> = ({ field, editorProps }) => {
-  const { value, helpText, setValue, label } = field;
+  const { value, setValue } = field;
   const { xJson, setXJson, convertToJson } = Monaco.useXJsonMode(value);
-  const { errorMessage } = getFieldValidityAndErrorMessage(field);
 
   const onChange = useCallback(
     (s) => {
@@ -42,25 +27,18 @@ export const XJsonEditor: FunctionComponent<Props> = ({ field, editorProps }) =>
     [setValue, setXJson, convertToJson]
   );
   return (
-    <EuiFormRow
-      label={label}
-      helpText={helpText}
-      isInvalid={typeof errorMessage === 'string'}
-      error={errorMessage}
-      fullWidth
-    >
-      <EuiPanel paddingSize="s" hasShadow={false}>
-        <CodeEditor
-          value={xJson}
-          languageId={XJsonLang.ID}
-          editorDidMount={(m) => {
-            XJsonLang.registerGrammarChecker(m);
-          }}
-          options={{ minimap: { enabled: false } }}
-          onChange={onChange}
-          {...(editorProps as any)}
-        />
-      </EuiPanel>
-    </EuiFormRow>
+    <TextEditor
+      field={field}
+      editorProps={{
+        value: xJson,
+        languageId: XJsonLang.ID,
+        options: { minimap: { enabled: false } },
+        editorDidMount: (m: any) => {
+          XJsonLang.registerGrammarChecker(m);
+        },
+        onChange,
+        ...editorProps,
+      }}
+    />
   );
 };
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.container.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.container.tsx
index ea137b87e66d..84551ce15209 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.container.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.container.tsx
@@ -40,18 +40,19 @@ export const ManageProcessorForm: FunctionComponent<Props> = ({
   const handleSubmit = useCallback(
     async (data: FormData, isValid: boolean) => {
       if (isValid) {
-        const { type, customOptions, ...options } = data;
+        const { type, customOptions, fields } = data;
         onSubmit({
           type,
-          options: customOptions ? customOptions : options,
+          options: customOptions ? customOptions : fields,
         });
       }
     },
     [onSubmit]
   );
 
+  const maybeProcessorOptions = processor?.options;
   const { form } = useForm({
-    defaultValue: processor?.options,
+    defaultValue: { fields: maybeProcessorOptions ?? {} },
     onSubmit: handleSubmit,
   });
 
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.tsx
index 4e172cce6302..ad6d191be802 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/manage_processor_form.tsx
@@ -14,12 +14,12 @@ import {
   EuiFlyoutHeader,
   EuiFlyoutBody,
   EuiFlyoutFooter,
-  EuiSpacer,
   EuiTabs,
   EuiTab,
   EuiTitle,
   EuiFlexGroup,
   EuiFlexItem,
+  EuiSpacer,
 } from '@elastic/eui';
 
 import { Form, FormDataProvider, FormHook } from '../../../../../shared_imports';
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processor_settings_fields.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processor_settings_fields.tsx
index 6b2568bad3af..a6447bc30ac0 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processor_settings_fields.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processor_settings_fields.tsx
@@ -5,7 +5,7 @@
  */
 
 import React, { FunctionComponent } from 'react';
-import { EuiHorizontalRule } from '@elastic/eui';
+import { EuiHorizontalRule, EuiSpacer } from '@elastic/eui';
 
 import { FormDataProvider } from '../../../../../shared_imports';
 import { ProcessorInternal } from '../../types';
@@ -36,6 +36,7 @@ export const ProcessorSettingsFields: FunctionComponent<Props> = ({ processor })
               return (
                 <>
                   <formDescriptor.FieldsComponent />
+                  <EuiSpacer size="m" />
                   <CommonProcessorFields />
                 </>
               );
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/append.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/append.tsx
new file mode 100644
index 000000000000..8eb484b56baf
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/append.tsx
@@ -0,0 +1,56 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  ComboBoxField,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig } from './shared';
+import { FieldNameField } from './common_fields/field_name_field';
+
+const { emptyField } = fieldValidators;
+
+const fieldsConfig: FieldsConfig = {
+  value: {
+    type: FIELD_TYPES.COMBO_BOX,
+    deserializer: (v) => (Array.isArray(v) ? v : [String(v)]),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.appendForm.valueFieldLabel', {
+      defaultMessage: 'Value',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.appendForm.valueFieldHelpText', {
+      defaultMessage: 'The value to be appended by this processor.',
+    }),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate('xpack.ingestPipelines.pipelineEditor.appendForm.valueRequiredError', {
+            defaultMessage: 'A value to set is required.',
+          })
+        ),
+      },
+    ],
+  },
+};
+
+export const Append: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate('xpack.ingestPipelines.pipelineEditor.appendForm.fieldHelpText', {
+          defaultMessage: 'The field to be appended to.',
+        })}
+      />
+
+      <UseField config={fieldsConfig.value} component={ComboBoxField} path="fields.value" />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/bytes.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/bytes.tsx
new file mode 100644
index 000000000000..64a501f03d45
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/bytes.tsx
@@ -0,0 +1,43 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+
+import { FIELD_TYPES, UseField, Field } from '../../../../../../shared_imports';
+
+import { FieldsConfig } from './shared';
+import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+import { FieldNameField } from './common_fields/field_name_field';
+
+const fieldsConfig: FieldsConfig = {
+  target_field: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.bytesForm.targetFieldLabel', {
+      defaultMessage: 'Target field (optional)',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.bytesForm.targetFieldHelpText', {
+      defaultMessage: 'The field to assign the converted value to',
+    }),
+  },
+};
+
+export const Bytes: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.bytesForm.fieldNameHelpText',
+          { defaultMessage: 'The field to convert.' }
+        )}
+      />
+
+      <UseField config={fieldsConfig.target_field} component={Field} path="fields.target_field" />
+
+      <IgnoreMissingField />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/circle.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/circle.tsx
new file mode 100644
index 000000000000..3a39e597cb8d
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/circle.tsx
@@ -0,0 +1,140 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+  SelectField,
+  NumericField,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig } from './shared';
+import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+import { FieldNameField } from './common_fields/field_name_field';
+
+const { emptyField } = fieldValidators;
+
+const fieldsConfig: FieldsConfig = {
+  target_field: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.circleForm.targetFieldLabel', {
+      defaultMessage: 'Target field (optional)',
+    }),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.circleForm.targetFieldHelpText',
+      {
+        defaultMessage: 'By default field is updated in-place.',
+      }
+    ),
+  },
+  error_distance: {
+    type: FIELD_TYPES.NUMBER,
+    deserializer: (v) => (typeof v === 'number' && !isNaN(v) ? v : 1.0),
+    serializer: Number,
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.circleForm.errorDistanceFieldLabel',
+      {
+        defaultMessage: 'Error distance',
+      }
+    ),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.circleForm.errorDistanceHelpText',
+      {
+        defaultMessage:
+          'The difference between the resulting inscribed distance from center to side and the circle’s radius (measured in meters for geo_shape, unit-less for shape).',
+      }
+    ),
+    validations: [
+      {
+        validator: ({ value }) => {
+          return isNaN(Number(value))
+            ? {
+                message: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.circleForm.errorDistanceError',
+                  {
+                    defaultMessage: 'An error distance value is required.',
+                  }
+                ),
+              }
+            : undefined;
+        },
+      },
+    ],
+  },
+  shape_type: {
+    type: FIELD_TYPES.SELECT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.circleForm.shapeTypeFieldLabel', {
+      defaultMessage: 'Shape type',
+    }),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.circleForm.shapeTypeFieldHelpText',
+      { defaultMessage: 'Which field mapping type is to be used.' }
+    ),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate('xpack.ingestPipelines.pipelineEditor.circleForm.shapeTypeRequiredError', {
+            defaultMessage: 'A shape type value is required.',
+          })
+        ),
+      },
+    ],
+  },
+};
+
+export const Circle: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.circleForm.fieldNameHelpText',
+          { defaultMessage: 'The string-valued field to trim whitespace from.' }
+        )}
+      />
+
+      <UseField
+        config={fieldsConfig.error_distance}
+        component={NumericField}
+        path="fields.error_distance"
+      />
+
+      <UseField
+        componentProps={{
+          euiFieldProps: {
+            options: [
+              {
+                value: 'shape',
+                label: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.circleForm.shapeTypeShape',
+                  { defaultMessage: 'Shape' }
+                ),
+              },
+              {
+                value: 'geo_shape',
+                label: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.circleForm.shapeTypeGeoShape',
+                  { defaultMessage: 'Geo-shape' }
+                ),
+              },
+            ],
+          },
+        }}
+        config={fieldsConfig.shape_type}
+        component={SelectField}
+        path="fields.shape_type"
+      />
+
+      <UseField config={fieldsConfig.target_field} component={Field} path="fields.target_field" />
+
+      <IgnoreMissingField />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx
index 4802653f9e68..7ae7b82c31a4 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/common_processor_fields.tsx
@@ -15,41 +15,64 @@ import {
   ToggleField,
 } from '../../../../../../../shared_imports';
 
+import { TextEditor } from '../../field_components';
+
 const ignoreFailureConfig: FieldConfig = {
   defaultValue: false,
+  serializer: (v) => (v === false ? undefined : v),
+  deserializer: (v) => (typeof v === 'boolean' ? v : undefined),
   label: i18n.translate(
     'xpack.ingestPipelines.pipelineEditor.commonFields.ignoreFailureFieldLabel',
     {
       defaultMessage: 'Ignore failure',
     }
   ),
+  helpText: i18n.translate(
+    'xpack.ingestPipelines.pipelineEditor.commonFields.ignoreFailureHelpText',
+    { defaultMessage: 'Ignore failures for this processor.' }
+  ),
   type: FIELD_TYPES.TOGGLE,
 };
 
 const ifConfig: FieldConfig = {
-  defaultValue: undefined,
   label: i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.ifFieldLabel', {
     defaultMessage: 'Condition (optional)',
   }),
+  helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.ifFieldHelpText', {
+    defaultMessage: 'Conditionally execute this processor.',
+  }),
   type: FIELD_TYPES.TEXT,
 };
 
 const tagConfig: FieldConfig = {
-  defaultValue: undefined,
   label: i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.tagFieldLabel', {
     defaultMessage: 'Tag (optional)',
   }),
+  helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.tagFieldHelpText', {
+    defaultMessage: 'An identifier for this processor. Useful for debugging and metrics.',
+  }),
   type: FIELD_TYPES.TEXT,
 };
 
 export const CommonProcessorFields: FunctionComponent = () => {
   return (
-    <>
-      <UseField config={ignoreFailureConfig} component={ToggleField} path={'ignore_failure'} />
+    <section>
+      <UseField
+        config={ifConfig}
+        component={TextEditor}
+        componentProps={{
+          editorProps: {
+            language: 'painless',
+            height: 75,
+            options: { minimap: { enabled: false } },
+          },
+        }}
+        path="fields.if"
+      />
 
-      <UseField config={ifConfig} component={Field} path={'if'} />
+      <UseField config={tagConfig} component={Field} path="fields.tag" />
 
-      <UseField config={tagConfig} component={Field} path={'tag'} />
-    </>
+      <UseField config={ignoreFailureConfig} component={ToggleField} path="fields.ignore_failure" />
+    </section>
   );
 };
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/field_name_field.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/field_name_field.tsx
new file mode 100644
index 000000000000..7ef5ba6768c1
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/field_name_field.tsx
@@ -0,0 +1,58 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+import {
+  FIELD_TYPES,
+  UseField,
+  Field,
+  fieldValidators,
+  ValidationConfig,
+} from '../../../../../../../shared_imports';
+
+import { FieldsConfig } from '../shared';
+
+const { emptyField } = fieldValidators;
+
+export const fieldsConfig: FieldsConfig = {
+  field: {
+    type: FIELD_TYPES.TEXT,
+    deserializer: String,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.fieldFieldLabel', {
+      defaultMessage: 'Field',
+    }),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate('xpack.ingestPipelines.pipelineEditor.commonFields.fieldRequiredError', {
+            defaultMessage: 'A field value is required.',
+          })
+        ),
+      },
+    ],
+  },
+};
+
+interface Props {
+  helpText?: React.ReactNode;
+  /**
+   * The field name requires a value. Processor specific validation
+   * checks can be added here.
+   */
+  additionalValidations?: ValidationConfig[];
+}
+
+export const FieldNameField: FunctionComponent<Props> = ({ helpText, additionalValidations }) => (
+  <UseField
+    config={{
+      ...fieldsConfig.field,
+      helpText,
+      validations: fieldsConfig.field.validations!.concat(additionalValidations ?? []),
+    }}
+    component={Field}
+    path="fields.field"
+  />
+);
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/ignore_missing_field.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/ignore_missing_field.tsx
new file mode 100644
index 000000000000..08eb0a425ef3
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/ignore_missing_field.tsx
@@ -0,0 +1,37 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+import { FIELD_TYPES, UseField, ToggleField } from '../../../../../../../shared_imports';
+
+import { FieldsConfig } from '../shared';
+
+export const fieldsConfig: FieldsConfig = {
+  ignore_missing: {
+    type: FIELD_TYPES.TOGGLE,
+    defaultValue: false,
+    serializer: (v) => (v === false ? undefined : v),
+    deserializer: (v) => (typeof v === 'boolean' ? v : undefined),
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.commonFields.ignoreMissingFieldLabel',
+      {
+        defaultMessage: 'Ignore missing',
+      }
+    ),
+  },
+};
+
+interface Props {
+  helpText?: string;
+}
+
+export const IgnoreMissingField: FunctionComponent<Props> = ({ helpText }) => (
+  <UseField
+    config={{ ...fieldsConfig.ignore_missing, helpText }}
+    component={ToggleField}
+    path="fields.ignore_missing"
+  />
+);
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/processor_type_field.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/processor_type_field.tsx
index 71ee4a714a28..e4ad90f61af0 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/processor_type_field.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/common_fields/processor_type_field.tsx
@@ -46,20 +46,12 @@ interface Props {
 
 const { emptyField } = fieldValidators;
 
-const typeConfig: FieldConfig = {
+const typeConfig: FieldConfig<any, string> = {
   type: FIELD_TYPES.COMBO_BOX,
   label: i18n.translate('xpack.ingestPipelines.pipelineEditor.typeField.typeFieldLabel', {
     defaultMessage: 'Processor',
   }),
-  deserializer: (value: string | undefined) => {
-    if (value) {
-      return [value];
-    }
-    return [];
-  },
-  serializer: (value: string[]) => {
-    return value[0];
-  },
+  deserializer: String,
   validations: [
     {
       validator: emptyField(
@@ -73,11 +65,11 @@ const typeConfig: FieldConfig = {
 
 export const ProcessorTypeField: FunctionComponent<Props> = ({ initialType }) => {
   return (
-    <UseField config={typeConfig} defaultValue={initialType} path="type">
+    <UseField<string> config={typeConfig} defaultValue={initialType} path="type">
       {(typeField) => {
         let selectedOptions: ProcessorTypeAndLabel[];
-        if ((typeField.value as string[]).length) {
-          const [type] = typeField.value as string[];
+        if (typeField.value?.length) {
+          const type = typeField.value;
           const descriptor = getProcessorDescriptor(type);
           selectedOptions = descriptor
             ? [{ label: descriptor.label, value: type }]
@@ -103,9 +95,7 @@ export const ProcessorTypeField: FunctionComponent<Props> = ({ initialType }) =>
             return false;
           }
 
-          const newValue = [...(typeField.value as string[]), value];
-
-          typeField.setValue(newValue);
+          typeField.setValue(value);
         };
 
         return (
@@ -131,8 +121,9 @@ export const ProcessorTypeField: FunctionComponent<Props> = ({ initialType }) =>
               options={processorTypesAndLabels}
               selectedOptions={selectedOptions}
               onCreateOption={onCreateComboOption}
-              onChange={(options: EuiComboBoxOptionOption[]) => {
-                typeField.setValue(options.map(({ value }) => value));
+              onChange={(options: Array<EuiComboBoxOptionOption<string>>) => {
+                const [selection] = options;
+                typeField.setValue(selection?.value! ?? '');
               }}
               noSuggestions={false}
               singleSelection={{
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/convert.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/convert.tsx
new file mode 100644
index 000000000000..b45f589bf0f9
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/convert.tsx
@@ -0,0 +1,136 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+  SelectField,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig } from './shared';
+import { FieldNameField } from './common_fields/field_name_field';
+import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+
+const { emptyField } = fieldValidators;
+
+const fieldsConfig: FieldsConfig = {
+  /* Required fields config */
+  type: {
+    type: FIELD_TYPES.TEXT,
+    defaultValue: '',
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.typeFieldLabel', {
+      defaultMessage: 'Type',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.typeFieldHelpText', {
+      defaultMessage: 'The type to convert the existing value to.',
+    }),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.typeRequiredError', {
+            defaultMessage: 'A type value is required.',
+          })
+        ),
+      },
+    ],
+  },
+  /* Optional fields config */
+  target_field: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.targetFieldLabel', {
+      defaultMessage: 'Target field (optional)',
+    }),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.convertForm.targetFieldHelpText',
+      {
+        defaultMessage: 'The field to assign the converted value to.',
+      }
+    ),
+  },
+};
+
+export const Convert: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.convertForm.fieldNameHelpText',
+          { defaultMessage: 'The field whose value is to be converted.' }
+        )}
+      />
+
+      <UseField
+        componentProps={{
+          euiFieldProps: {
+            options: [
+              {
+                value: 'integer',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.integerOption',
+                  { defaultMessage: 'Integer' }
+                ),
+              },
+              {
+                value: 'long',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.longOption',
+                  { defaultMessage: 'Long' }
+                ),
+              },
+              {
+                value: 'float',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.floatOption',
+                  { defaultMessage: 'Float' }
+                ),
+              },
+              {
+                value: 'double',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.doubleOption',
+                  { defaultMessage: 'Double' }
+                ),
+              },
+              {
+                value: 'string',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.stringOption',
+                  { defaultMessage: 'String' }
+                ),
+              },
+              {
+                value: 'boolean',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.booleanOption',
+                  { defaultMessage: 'Boolean' }
+                ),
+              },
+              {
+                value: 'auto',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.convertForm.autoOption',
+                  { defaultMessage: 'Auto' }
+                ),
+              },
+            ],
+          },
+        }}
+        config={fieldsConfig.type}
+        component={SelectField}
+        path="fields.type"
+      />
+
+      <UseField config={fieldsConfig.target_field} component={Field} path="fields.target_field" />
+
+      <IgnoreMissingField />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/csv.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/csv.tsx
new file mode 100644
index 000000000000..3ac0179ca02a
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/csv.tsx
@@ -0,0 +1,164 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { EuiCode } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+  ToggleField,
+  ComboBoxField,
+  ValidationFunc,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig } from './shared';
+import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+import { FieldNameField } from './common_fields/field_name_field';
+
+import { isArrayOfStrings } from './shared';
+
+const { minLengthField } = fieldValidators;
+
+/**
+ * Allow empty strings ('') to pass this validation.
+ */
+const isStringLengthOne: ValidationFunc = ({ value }) => {
+  return typeof value === 'string' && value !== '' && value.length !== 1
+    ? {
+        message: i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.convertForm.separatorLengthError',
+          {
+            defaultMessage: 'A separator value must be 1 character.',
+          }
+        ),
+      }
+    : undefined;
+};
+
+const fieldsConfig: FieldsConfig = {
+  /* Required fields config */
+  target_fields: {
+    type: FIELD_TYPES.COMBO_BOX,
+    deserializer: (v) => {
+      return isArrayOfStrings(v) ? v : [];
+    },
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.csvForm.targetFieldsFieldLabel', {
+      defaultMessage: 'Target fields',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.csvForm.targetFieldsHelpText', {
+      defaultMessage: 'The array of fields to assign extracted values to.',
+    }),
+    validations: [
+      {
+        validator: minLengthField({
+          length: 1,
+          message: i18n.translate(
+            'xpack.ingestPipelines.pipelineEditor.csvForm.targetFieldRequiredError',
+            {
+              defaultMessage: 'A target fields value is required.',
+            }
+          ),
+        }),
+      },
+    ],
+  },
+  /* Optional fields config */
+  separator: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.separatorFieldLabel', {
+      defaultMessage: 'Separator (optional)',
+    }),
+    validations: [
+      {
+        validator: isStringLengthOne,
+      },
+    ],
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.convertForm.separatorHelpText"
+        defaultMessage="Separator used in CSV, has to be single character string. Default value is {value}."
+        values={{ value: <EuiCode inline>{','}</EuiCode> }}
+      />
+    ),
+  },
+  quote: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.quoteFieldLabel', {
+      defaultMessage: 'Quote (optional)',
+    }),
+    validations: [
+      {
+        validator: isStringLengthOne,
+      },
+    ],
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.convertForm.quoteHelpText"
+        defaultMessage="Quote used in CSV, has to be single character string. Default value is {value}."
+        values={{ value: <EuiCode inline>{'"'}</EuiCode> }}
+      />
+    ),
+  },
+  trim: {
+    type: FIELD_TYPES.TOGGLE,
+    defaultValue: false,
+    deserializer: (v) => (typeof v === 'boolean' ? v : undefined),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.csvForm.trimFieldLabel', {
+      defaultMessage: 'Trim',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.csvForm.trimFieldHelpText', {
+      defaultMessage: 'Trim whitespaces in unquoted fields',
+    }),
+  },
+  empty_value: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.convertForm.emptyValueFieldLabel', {
+      defaultMessage: 'Empty value (optional)',
+    }),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.convertForm.emptyValueFieldHelpText',
+      {
+        defaultMessage:
+          'Value used to fill empty fields, empty fields will be skipped if this is not provided.',
+      }
+    ),
+  },
+};
+
+export const CSV: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate('xpack.ingestPipelines.pipelineEditor.csvForm.fieldNameHelpText', {
+          defaultMessage: 'The field to extract data from.',
+        })}
+      />
+
+      <UseField
+        config={fieldsConfig.target_fields}
+        component={ComboBoxField}
+        path="fields.target_fields"
+      />
+
+      <UseField config={fieldsConfig.separator} component={Field} path="fields.separator" />
+
+      <UseField config={fieldsConfig.quote} component={Field} path="fields.quote" />
+
+      <UseField config={fieldsConfig.trim} component={ToggleField} path="fields.trim" />
+
+      <UseField config={fieldsConfig.empty_value} component={Field} path="fields.empty_value" />
+
+      <IgnoreMissingField />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date.tsx
new file mode 100644
index 000000000000..424e84058ac3
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date.tsx
@@ -0,0 +1,122 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { EuiCode } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+  ComboBoxField,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig, isArrayOfStrings } from './shared';
+import { FieldNameField } from './common_fields/field_name_field';
+
+const { minLengthField } = fieldValidators;
+
+const fieldsConfig: FieldsConfig = {
+  /* Required fields config */
+  formats: {
+    type: FIELD_TYPES.COMBO_BOX,
+    deserializer: (v) => {
+      return isArrayOfStrings(v) ? v : [];
+    },
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dateForm.formatsFieldLabel', {
+      defaultMessage: 'Formats',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.dateForm.formatsFieldHelpText', {
+      defaultMessage:
+        'An array of the expected date formats. Can be a java time pattern or one of the following formats: ISO8601, UNIX, UNIX_MS, or TAI64N.',
+    }),
+    validations: [
+      {
+        validator: minLengthField({
+          length: 1,
+          message: i18n.translate(
+            'xpack.ingestPipelines.pipelineEditor.dateForm.formatsRequiredError',
+            {
+              defaultMessage: 'A value for formats is required.',
+            }
+          ),
+        }),
+      },
+    ],
+  },
+  /* Optional fields config */
+  target_field: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? undefined : v),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dateForm.targetFieldFieldLabel', {
+      defaultMessage: 'Target field (optional)',
+    }),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateForm.targetFieldHelpText"
+        defaultMessage="The field that will hold the parsed date. Default field is {defaultField}."
+        values={{
+          defaultField: <EuiCode inline>{'@timestamp'}</EuiCode>,
+        }}
+      />
+    ),
+  },
+  timezone: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dateForm.timezoneFieldLabel', {
+      defaultMessage: 'Timezone (optional)',
+    }),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateForm.timezoneHelpText"
+        defaultMessage="The timezone to use when parsing the date. Default value is {timezone}."
+        values={{ timezone: <EuiCode inline>{'UTC'}</EuiCode> }}
+      />
+    ),
+  },
+  locale: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dateForm.localeFieldLabel', {
+      defaultMessage: 'Locale (optional)',
+    }),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateForm.localeHelpText"
+        defaultMessage="The locale to use when parsing the date, relevant when parsing month names or week days. Default value is {timezone}."
+        values={{ timezone: <EuiCode inline>{'ENGLISH'}</EuiCode> }}
+      />
+    ),
+  },
+};
+
+/**
+ * Disambiguate from global Date object
+ */
+export const DateProcessor: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.dateForm.fieldNameHelpText',
+          { defaultMessage: 'The field to get the date from.' }
+        )}
+      />
+
+      <UseField config={fieldsConfig.formats} component={ComboBoxField} path="fields.formats" />
+
+      <UseField config={fieldsConfig.target_field} component={Field} path="fields.target_field" />
+
+      <UseField config={fieldsConfig.timezone} component={Field} path="fields.timezone" />
+
+      <UseField config={fieldsConfig.locale} component={Field} path="fields.locale" />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date_index_name.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date_index_name.tsx
new file mode 100644
index 000000000000..387c9ff4e0b4
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/date_index_name.tsx
@@ -0,0 +1,242 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { EuiCode } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+
+import {
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+  ComboBoxField,
+  SelectField,
+} from '../../../../../../shared_imports';
+
+import { FieldsConfig, isArrayOfStrings } from './shared';
+import { FieldNameField } from './common_fields/field_name_field';
+
+const { emptyField } = fieldValidators;
+
+const fieldsConfig: FieldsConfig = {
+  /* Required fields config */
+  date_rounding: {
+    type: FIELD_TYPES.SELECT,
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRoundingFieldLabel',
+      {
+        defaultMessage: 'Date rounding',
+      }
+    ),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRoundingFieldHelpText',
+      {
+        defaultMessage: 'How to round the date when formatting the date into the index name.',
+      }
+    ),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate(
+            'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRoundingRequiredError',
+            {
+              defaultMessage: 'A field value is required.',
+            }
+          )
+        ),
+      },
+    ],
+  },
+  /* Optional fields config */
+  index_name_prefix: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.indexNamePrefixFieldLabel',
+      {
+        defaultMessage: 'Index name prefix (optional)',
+      }
+    ),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.indexNamePrefixFieldHelpText',
+      { defaultMessage: 'A prefix of the index name to be prepended before the printed date.' }
+    ),
+  },
+  index_name_format: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.indexNameFormatFieldLabel',
+      {
+        defaultMessage: 'Index name format (optional)',
+      }
+    ),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.indexNameFormatFieldHelpText"
+        defaultMessage="The format to be used when printing the parsed date into the index name. Default value is {value}."
+        values={{ value: <EuiCode inline>{'yyyy-MM-dd'}</EuiCode> }}
+      />
+    ),
+  },
+  date_formats: {
+    type: FIELD_TYPES.COMBO_BOX,
+    serializer: (v: string[]) => {
+      return v.length ? v : undefined;
+    },
+    deserializer: (v) => {
+      return isArrayOfStrings(v) ? v : [];
+    },
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateFormatsFieldLabel',
+      {
+        defaultMessage: 'Date formats (optional)',
+      }
+    ),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateFormatsHelpText"
+        defaultMessage="An array of the expected date formats for parsing dates / timestamps in the document being preprocessed. Can be a java time pattern or one of the following formats: ISO8601, UNIX, UNIX_MS, or TAI64N. Default value is {value}."
+        values={{ value: <EuiCode inline>{"yyyy-MM-dd'T'HH:mm:ss.SSSXX"}</EuiCode> }}
+      />
+    ),
+  },
+  timezone: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.timezoneFieldLabel',
+      {
+        defaultMessage: 'Timezone (optional)',
+      }
+    ),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.timezoneHelpText"
+        defaultMessage="The timezone to use when parsing the date and when date math index supports resolves expressions into concrete index names. Default value is {timezone}."
+        values={{ timezone: <EuiCode inline>{'UTC'}</EuiCode> }}
+      />
+    ),
+  },
+  locale: {
+    type: FIELD_TYPES.TEXT,
+    serializer: (v) => (v ? v : undefined),
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.localeFieldLabel',
+      {
+        defaultMessage: 'Locale (optional)',
+      }
+    ),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dateIndexForm.localeHelpText"
+        defaultMessage="The locale to use when parsing the date from the document being preprocessed, relevant when parsing month names or week days. Default value is {locale}"
+        values={{ locale: <EuiCode inline>{'ENGLISH'}</EuiCode> }}
+      />
+    ),
+  },
+};
+
+/**
+ * Disambiguate from global Date object
+ */
+export const DateIndexName: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.fieldNameHelpText',
+          { defaultMessage: 'The field to get the date or timestamp from.' }
+        )}
+      />
+
+      <UseField
+        config={fieldsConfig.date_rounding}
+        component={SelectField}
+        componentProps={{
+          euiFieldProps: {
+            options: [
+              {
+                value: 'y',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.year',
+                  { defaultMessage: 'Year' }
+                ),
+              },
+              {
+                value: 'M',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.month',
+                  { defaultMessage: 'Month' }
+                ),
+              },
+              {
+                value: 'w',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.week',
+                  { defaultMessage: 'Week' }
+                ),
+              },
+              {
+                value: 'd',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.day',
+                  { defaultMessage: 'Day' }
+                ),
+              },
+              {
+                value: 'h',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.hour',
+                  { defaultMessage: 'Hour' }
+                ),
+              },
+              {
+                value: 'm',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.minute',
+                  { defaultMessage: 'Minute' }
+                ),
+              },
+              {
+                value: 's',
+                text: i18n.translate(
+                  'xpack.ingestPipelines.pipelineEditor.dateIndexNameForm.dateRounding.second',
+                  { defaultMessage: 'Second' }
+                ),
+              },
+            ],
+          },
+        }}
+        path="fields.date_rounding"
+      />
+
+      <UseField
+        config={fieldsConfig.index_name_prefix}
+        component={Field}
+        path="fields.index_name_prefix"
+      />
+
+      <UseField
+        config={fieldsConfig.index_name_format}
+        component={Field}
+        path="fields.index_name_format"
+      />
+
+      <UseField
+        config={fieldsConfig.date_formats}
+        component={ComboBoxField}
+        path="fields.date_formats"
+      />
+
+      <UseField config={fieldsConfig.timezone} component={Field} path="fields.timezone" />
+
+      <UseField config={fieldsConfig.locale} component={Field} path="fields.locale" />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dissect.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dissect.tsx
new file mode 100644
index 000000000000..5f9f55ced1a2
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dissect.tsx
@@ -0,0 +1,99 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { EuiCode } from '@elastic/eui';
+import { i18n } from '@kbn/i18n';
+import { FormattedMessage } from '@kbn/i18n/react';
+import { TextEditor } from '../field_components';
+
+import {
+  FieldConfig,
+  FIELD_TYPES,
+  fieldValidators,
+  UseField,
+  Field,
+} from '../../../../../../shared_imports';
+
+import { FieldNameField } from './common_fields/field_name_field';
+import { IgnoreMissingField } from './common_fields/ignore_missing_field';
+
+const { emptyField } = fieldValidators;
+
+const fieldsConfig: Record<string, FieldConfig> = {
+  /* Required field config */
+  pattern: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dissectForm.patternFieldLabel', {
+      defaultMessage: 'Pattern',
+    }),
+    helpText: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dissectForm.patternFieldHelpText',
+      {
+        defaultMessage: 'The pattern to apply to the field.',
+      }
+    ),
+    validations: [
+      {
+        validator: emptyField(
+          i18n.translate('xpack.ingestPipelines.pipelineEditor.dissectForm.patternRequiredError', {
+            defaultMessage: 'A pattern value is required.',
+          })
+        ),
+      },
+    ],
+  },
+  /* Optional field config */
+  append_separator: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate(
+      'xpack.ingestPipelines.pipelineEditor.dissectForm.appendSeparatorparaotrFieldLabel',
+      {
+        defaultMessage: 'Append separator (optional)',
+      }
+    ),
+    helpText: (
+      <FormattedMessage
+        id="xpack.ingestPipelines.pipelineEditor.dissectForm.appendSeparatorHelpText"
+        defaultMessage="The character(s) that separate the appended fields. Default value is {value} (an empty string)."
+        values={{ value: <EuiCode inline>{'""'}</EuiCode> }}
+      />
+    ),
+  },
+};
+
+export const Dissect: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.dissectForm.fieldNameHelpText',
+          { defaultMessage: 'The field to dissect.' }
+        )}
+      />
+
+      <UseField
+        config={fieldsConfig.pattern}
+        component={TextEditor}
+        componentProps={{
+          editorProps: {
+            height: 75,
+            options: { minimap: { enabled: false } },
+          },
+        }}
+        path="fields.pattern"
+      />
+
+      <UseField
+        config={fieldsConfig.append_separator}
+        component={Field}
+        path="fields.append_separator"
+      />
+
+      <IgnoreMissingField />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dot_expander.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dot_expander.tsx
new file mode 100644
index 000000000000..4e50c61ac930
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/dot_expander.tsx
@@ -0,0 +1,55 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import React, { FunctionComponent } from 'react';
+import { i18n } from '@kbn/i18n';
+
+import { FieldConfig, FIELD_TYPES, UseField, Field } from '../../../../../../shared_imports';
+
+import { FieldNameField } from './common_fields/field_name_field';
+
+const fieldsConfig: Record<string, FieldConfig> = {
+  path: {
+    type: FIELD_TYPES.TEXT,
+    label: i18n.translate('xpack.ingestPipelines.pipelineEditor.dotExpanderForm.pathFieldLabel', {
+      defaultMessage: 'Path',
+    }),
+    helpText: i18n.translate('xpack.ingestPipelines.pipelineEditor.dotExpanderForm.pathHelpText', {
+      defaultMessage: 'Only required if the field to expand is part another object field.',
+    }),
+  },
+};
+
+export const DotExpander: FunctionComponent = () => {
+  return (
+    <>
+      <FieldNameField
+        helpText={i18n.translate(
+          'xpack.ingestPipelines.pipelineEditor.dotExpanderForm.fieldNameHelpText',
+          { defaultMessage: 'The field to expand into an object field.' }
+        )}
+        additionalValidations={[
+          {
+            validator: ({ value }) => {
+              if (typeof value === 'string' && value.length) {
+                return !value.includes('.')
+                  ? {
+                      message: i18n.translate(
+                        'xpack.ingestPipelines.pipelineEditor.dotExpanderForm.fieldNameRequiresDotError',
+                        { defaultMessage: 'A field value requires at least one dot character.' }
+                      ),
+                    }
+                  : undefined;
+              }
+            },
+          },
+        ]}
+      />
+
+      <UseField config={fieldsConfig.path} component={Field} path="fields.path" />
+    </>
+  );
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/drop.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/drop.tsx
new file mode 100644
index 000000000000..87b6cb76cdcc
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/drop.tsx
@@ -0,0 +1,14 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import { FunctionComponent } from 'react';
+
+/**
+ * This fields component has no unique fields
+ */
+export const Drop: FunctionComponent = () => {
+  return null;
+};
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx
index 77f85e61eff6..3148022adaa9 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/gsub.tsx
@@ -15,6 +15,7 @@ import {
   UseField,
   Field,
 } from '../../../../../../shared_imports';
+import { TextEditor } from '../field_components';
 
 const { emptyField } = fieldValidators;
 
@@ -84,15 +85,25 @@ const ignoreMissingConfig: FieldConfig = {
 export const Gsub: FunctionComponent = () => {
   return (
     <>
-      <UseField config={fieldConfig} component={Field} path="field" />
+      <UseField config={fieldConfig} component={Field} path="fields.field" />
 
-      <UseField config={patternConfig} component={Field} path="pattern" />
+      <UseField
+        config={patternConfig}
+        component={TextEditor}
+        componentProps={{
+          editorProps: {
+            height: 75,
+            options: { minimap: { enabled: false } },
+          },
+        }}
+        path="fields.pattern"
+      />
 
-      <UseField config={replacementConfig} component={Field} path="replacement" />
+      <UseField config={replacementConfig} component={Field} path="fields.replacement" />
 
-      <UseField config={targetConfig} component={Field} path="target_field" />
+      <UseField config={targetConfig} component={Field} path="fields.target_field" />
 
-      <UseField config={ignoreMissingConfig} component={ToggleField} path="ignore_missing" />
+      <UseField config={ignoreMissingConfig} component={ToggleField} path="fields.ignore_missing" />
     </>
   );
 };
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/index.ts b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/index.ts
new file mode 100644
index 000000000000..6996deb2d861
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/index.ts
@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+export { Append } from './append';
+export { Bytes } from './bytes';
+export { Circle } from './circle';
+export { Convert } from './convert';
+export { CSV } from './csv';
+export { DateProcessor } from './date';
+export { DateIndexName } from './date_index_name';
+export { Dissect } from './dissect';
+export { DotExpander } from './dot_expander';
+export { Drop } from './drop';
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/set.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/set.tsx
index 1ba6a14d0448..88cea620ae80 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/set.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/set.tsx
@@ -64,11 +64,11 @@ const overrideConfig: FieldConfig = {
 export const SetProcessor: FunctionComponent = () => {
   return (
     <>
-      <UseField config={fieldConfig} component={Field} path="field" />
+      <UseField config={fieldConfig} component={Field} path="fields.field" />
 
-      <UseField config={valueConfig} component={Field} path="value" />
+      <UseField config={valueConfig} component={Field} path="fields.value" />
 
-      <UseField config={overrideConfig} component={ToggleField} path="override" />
+      <UseField config={overrideConfig} component={ToggleField} path="fields.override" />
     </>
   );
 };
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/shared.ts b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/shared.ts
new file mode 100644
index 000000000000..a0a31dd3a8e9
--- /dev/null
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/manage_processor_form/processors/shared.ts
@@ -0,0 +1,16 @@
+/*
+ * Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
+ * or more contributor license agreements. Licensed under the Elastic License;
+ * you may not use this file except in compliance with the Elastic License.
+ */
+
+import * as rt from 'io-ts';
+import { isRight } from 'fp-ts/lib/Either';
+import { flow } from 'fp-ts/lib/function';
+
+import { FieldConfig } from '../../../../../../shared_imports';
+
+export const arrayOfStrings = rt.array(rt.string);
+export const isArrayOfStrings = flow(arrayOfStrings.decode, isRight);
+
+export type FieldsConfig = Record<string, FieldConfig>;
diff --git a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/shared/map_processor_type_to_form.tsx b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/shared/map_processor_type_to_form.tsx
index 7055721fc8b0..502045084b24 100644
--- a/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/shared/map_processor_type_to_form.tsx
+++ b/x-pack/plugins/ingest_pipelines/public/application/components/pipeline_processors_editor/components/shared/map_processor_type_to_form.tsx
@@ -7,6 +7,19 @@
 import { i18n } from '@kbn/i18n';
 import { FunctionComponent } from 'react';
 
+import {
+  Append,
+  Bytes,
+  Circle,
+  Convert,
+  CSV,
+  DateProcessor,
+  DateIndexName,
+  Dissect,
+  DotExpander,
+  Drop,
+} from '../manage_processor_form/processors';
+
 // import { SetProcessor } from './processors/set';
 // import { Gsub } from './processors/gsub';
 
@@ -23,70 +36,70 @@ type MapProcessorTypeToDescriptor = Record<string, FieldDescriptor>;
 
 export const mapProcessorTypeToDescriptor: MapProcessorTypeToDescriptor = {
   append: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Append,
     docLinkPath: '/append-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.append', {
       defaultMessage: 'Append',
     }),
   },
   bytes: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Bytes,
     docLinkPath: '/bytes-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.bytes', {
       defaultMessage: 'Bytes',
     }),
   },
   circle: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Circle,
     docLinkPath: '/ingest-circle-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.circle', {
       defaultMessage: 'Circle',
     }),
   },
   convert: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Convert,
     docLinkPath: '/convert-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.convert', {
       defaultMessage: 'Convert',
     }),
   },
   csv: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: CSV,
     docLinkPath: '/csv-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.csv', {
       defaultMessage: 'CSV',
     }),
   },
   date: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: DateProcessor,
     docLinkPath: '/date-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.date', {
       defaultMessage: 'Date',
     }),
   },
   date_index_name: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: DateIndexName,
     docLinkPath: '/date-index-name-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.dateIndexName', {
       defaultMessage: 'Date Index Name',
     }),
   },
   dissect: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Dissect,
     docLinkPath: '/dissect-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.dissect', {
       defaultMessage: 'Dissect',
     }),
   },
   dot_expander: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: DotExpander,
     docLinkPath: '/dot-expand-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.dotExpander', {
       defaultMessage: 'Dot Expander',
     }),
   },
   drop: {
-    FieldsComponent: undefined, // TODO: Implement
+    FieldsComponent: Drop,
     docLinkPath: '/drop-processor.html',
     label: i18n.translate('xpack.ingestPipelines.processors.label.drop', {
       defaultMessage: 'Drop',
diff --git a/x-pack/plugins/ingest_pipelines/public/shared_imports.ts b/x-pack/plugins/ingest_pipelines/public/shared_imports.ts
index d2c4b73a4876..936db37f0c62 100644
--- a/x-pack/plugins/ingest_pipelines/public/shared_imports.ts
+++ b/x-pack/plugins/ingest_pipelines/public/shared_imports.ts
@@ -43,6 +43,8 @@ export {
   FieldConfig,
   FieldHook,
   getFieldValidityAndErrorMessage,
+  ValidationFunc,
+  ValidationConfig,
 } from '../../../../src/plugins/es_ui_shared/static/forms/hook_form_lib';
 
 export {
@@ -57,6 +59,9 @@ export {
   FormRow,
   ToggleField,
   ComboBoxField,
+  RadioGroupField,
+  NumericField,
+  SelectField,
 } from '../../../../src/plugins/es_ui_shared/static/forms/components';
 
 export {