diff --git a/assets/js/src/form_editor/blocks/blocks.jsx b/assets/js/src/form_editor/blocks/blocks.jsx index 765cb48e00..48d4d5739a 100644 --- a/assets/js/src/form_editor/blocks/blocks.jsx +++ b/assets/js/src/form_editor/blocks/blocks.jsx @@ -12,6 +12,7 @@ import * as segmentSelect from './segment_select/segment_select.jsx'; import * as customHtml from './custom_html/custom_html.jsx'; import * as customText from './custom_text/custom_text.jsx'; +import * as customTextArea from './custom_textarea/custom_textarea.jsx'; const registerCustomFieldBlock = (customField) => { console.log('custom Field', customField); @@ -23,6 +24,12 @@ const registerCustomFieldBlock = (customField) => { customText.getSettings(customField) ); break; + case 'textarea': + registerBlockType( + formatCustomFieldBlockName(customTextArea.name, customField), + customTextArea.getSettings(customField) + ); + break; } }; diff --git a/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx b/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx index 9f113e8e16..172db33568 100644 --- a/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx +++ b/assets/js/src/form_editor/blocks/custom_textarea/custom_textarea.jsx @@ -26,6 +26,10 @@ export function getSettings(customField) { type: 'string', default: '', }, + lines: { + type: 'string', + default: '1', + }, customFieldId: { type: 'string', default: customField.id, diff --git a/assets/js/src/form_editor/blocks/custom_textarea/edit.jsx b/assets/js/src/form_editor/blocks/custom_textarea/edit.jsx index 122545dd9d..05805ab154 100644 --- a/assets/js/src/form_editor/blocks/custom_textarea/edit.jsx +++ b/assets/js/src/form_editor/blocks/custom_textarea/edit.jsx @@ -11,8 +11,112 @@ import PropTypes from 'prop-types'; import MailPoet from 'mailpoet'; const CustomTextAreaEdit = ({ attributes, setAttributes }) => { + const inspectorControls = ( + + + + (setAttributes({ label }))} + /> + (setAttributes({ labelWithinInput }))} + /> + (setAttributes({ mandatory }))} + /> + (setAttributes({ validate }))} + /> + (setAttributes({ lines }))} + /> + + + + + ); + + const getTextArea = (placeholder) => ( +