feat: add merge fields for Mailchimp

[Soare-Robert-Daniel]

Closes https://github.com/Codeinwp/otter-internals/issues/168

Summary

Added the ability to link the value of the fields with some of the types for Mailchimp Merge Fields

Note

The users are advised to mostly use the type TEXT for the linked fields.

Fields like File do not file, but the name of the files. Select type fields (e.g., checkbox) and send a string of values with the selected types.

This is not made to handle complex cases, uploading files to Mailchimp, and advanced selection to their dropdown.

Warning

The validation is disabled, so wrong data might be sent if the Otter field is not properly set up based on the merge fields.

Screenshots

Merge fields in Mailchimp Dashboard

Connected Otter fields

Mailchimp Contact list with extra fields

---

Test instructions

Check if the tag in the Otter field MAPPED NAMED is sent to its corresponding tag in Mailchimp MERGE FIELDS.

Note

We only send the data to Mailchimp. Do not expect to send automatic replays with merged fields from the plugin -- this is done via Mailchimp if it is set up to do so.

References:

• https://mailchimp.com/help/getting-started-with-merge-tags/

---

Checklist before the final review

• Included E2E or unit tests for the changes in this PR.
• Visual elements are not affected by independent changes.
• It is at least compatible with the minimum WordPress version.
• It loads additional script in frontend only if it is required.
• Does not impact the Core Web Vitals.
• In case of deprecation, old blocks are safely migrated.
• It is usable in Widgets and FSE.
• Copy/Paste is working if the attributes are modified.
• PR is following the best practices

[pirate-bot]

Bundle Size Diff

Package	Old Size	New Size	Diff
Animations	265.96 KB	265.96 KB	0 B (0.00%)
Blocks	1.53 MB	1.53 MB	26 B (0.00%)
CSS	95.66 KB	95.66 KB	0 B (0.00%)
Dashboard	207.2 KB	207.2 KB	0 B (0.00%)
Onboarding	155.62 KB	155.62 KB	0 B (0.00%)
Export Import	92.68 KB	92.68 KB	0 B (0.00%)
Pro	383.13 KB	383.15 KB	24 B (0.01%)

[pirate-bot]

Plugin build for 8af9f77 is ready 🛎️!

• Download Otter – Page Builder Blocks & Extensions for Gutenberg - Production ~ Development
• Download Otter Pro - Production ~ Development
• Download Blocks Animation - Production ~ Development
• Download Blocks CSS - Production ~ Development
• Download Blocks Export Import - Production ~ Development

[pirate-bot]

E2E Tests

Playwright Test Status:

Performance Results

serverResponse: 233.45, firstPaint: 146.35, domContentLoaded: 1561.75, loaded: 1562.45, firstContentfulPaint: 3443.55, firstBlock: 7649.75, type: 12.44, minType: 10.32, maxType: 17.06, typeContainer: 8.87, minTypeContainer: 7.74, maxTypeContainer: 12.94, focus: 32.74, minFocus: 28.33, maxFocus: 43.69, inserterOpen: 23.01, minInserterOpen: 19.4, maxInserterOpen: 33.22, inserterSearch: 0.71, minInserterSearch: 0.61, maxInserterSearch: 0.84, inserterHover: 3.58, minInserterHover: 2.62, maxInserterHover: 5.35, listViewOpen: 147.38, minListViewOpen: 134.38, maxListViewOpen: 161.16

[ineagu]

We need to make it clear here that this is not only for webhooks: https://docs.themeisle.com/article/1878-how-to-use-webhooks-in-otter-forms#mapped-name

• mention it in the forms block doc + https://docs.themeisle.com/article/1970-how-to-manage-marketing-integration-in-otter-forms @stefan-cotitosu

[AndreeaCristinaRadacina]

@ineagu here are the updated docs:

• https://docs.themeisle.com/article/1878-how-to-use-webhooks-in-otter-forms?preview=64b66c2349f0be65d185dc86#mapped-name-mailchimp
• https://docs.themeisle.com/article/1970-how-to-manage-marketing-integration-in-otter-forms?preview=654a29cae4a15f3729e45c1d
• https://docs.themeisle.com/article/1674-form-blocks?preview=62e647efb828a850e9e62e17#form

To do: update the note link after the first doc is published.

Let me know what you think!

[pirate-bot]

🎉 This PR is included in version 3.0.0 🎉

The release is available on GitHub release

Your semantic-release bot 📦🚀