diff --git a/assets/js/src/form_editor/blocks/email/edit.jsx b/assets/js/src/form_editor/blocks/email/edit.jsx new file mode 100644 index 0000000000..c8786f36ea --- /dev/null +++ b/assets/js/src/form_editor/blocks/email/edit.jsx @@ -0,0 +1,56 @@ +import React from 'react'; +import { + Panel, + PanelBody, + TextControl, + ToggleControl, +} from '@wordpress/components'; +import { InspectorControls } from '@wordpress/block-editor'; +import PropTypes from 'prop-types'; +import MailPoet from 'mailpoet'; + +const EmailEdit = ({ attributes, setAttributes }) => { + const inspectorControls = ( + + + + (setAttributes({ label }))} + /> + (setAttributes({ labelWithinInput }))} + /> + + + + + ); + return ( + <> + {inspectorControls} + {attributes.labelWithinInput ? ( + + ) : ( + + )} + + ); +}; + +EmailEdit.propTypes = { + attributes: PropTypes.shape({ + label: PropTypes.string.isRequired, + labelWithinInput: PropTypes.bool.isRequired, + }).isRequired, + setAttributes: PropTypes.func.isRequired, +}; + +export default EmailEdit; diff --git a/assets/js/src/form_editor/blocks/email/email.jsx b/assets/js/src/form_editor/blocks/email/email.jsx new file mode 100644 index 0000000000..9cc9297868 --- /dev/null +++ b/assets/js/src/form_editor/blocks/email/email.jsx @@ -0,0 +1,30 @@ +import MailPoet from 'mailpoet'; +import edit from './edit.jsx'; +import icon from './icon.jsx'; + +export const name = 'mailpoet-form/email-input'; +export const settings = { + title: MailPoet.I18n.t('blockEmail'), + description: MailPoet.I18n.t('blockEmailDescription'), + icon, + category: 'obligatory', + attributes: { + label: { + type: 'string', + default: MailPoet.I18n.t('blockEmail'), + }, + labelWithinInput: { + type: 'boolean', + default: true, + }, + }, + supports: { + html: false, + customClassName: false, + inserter: false, + }, + edit, + save() { + return null; + }, +}; diff --git a/assets/js/src/form_editor/blocks/email/icon.jsx b/assets/js/src/form_editor/blocks/email/icon.jsx new file mode 100644 index 0000000000..fa5f2fda77 --- /dev/null +++ b/assets/js/src/form_editor/blocks/email/icon.jsx @@ -0,0 +1,14 @@ +import React from 'react'; +import { G, Path, SVG } from '@wordpress/components'; + +export default ( + + + + + + +);