Hey there!
Thanks for the suggestion, in fact we have a PR which is introducing a template for this exact behaviour:
7.x ← andersonjeccel:UXUI-198-add-code-snippet-component
opened 04:31PM - 23 Jun 25 UTC
| Q | A
| --------------------------------… ------ | ---
| Bug fix? (use the a.b branch) | ❌
| New feature/enhancement? (use the a.x branch) | ✔️
| Deprecations? | ❌
| BC breaks? (use the c.x branch) | ❌
| Automated tests included? | ❌
| Related user documentation PR URL | mautic/user-documentation#...
| Related developer documentation PR URL | mautic/developer-documentation-new#...
| Issue(s) addressed | Fixes #...
## Description
This PR adds a component for showing code snippets across the platform.
It's useful for scenarios where the user needs to copy code to paste in external systems.
### Form embed options
### Plugin config
### Tracking script
---
### 📋 Steps to test this PR:
1. Open this PR on Gitpod or pull down for testing locally (see docs on testing PRs [here](https://contribute.mautic.org/contributing-to-mautic/tester))
2. Open Configuration page > Tracking settings
3. See the block with a partial code
4. Click on the copy button to copy the code
5. Paste in an editor to see the code is complete (way bigger than compared to what you see on Mautic's config page)
6. Open Components > Forms
7. Click to create a new form
8. Fill required information, just enough so you can save it
9. Save & Close
10. On the Form implementation tile, click to expand it
11. Select the first button (Embedded)
12. On the opened dialog, click on any of the copy options and paste somewhere to check if the code shown on the screen is the same you pasted
13. Click to close the dialog
14. Now pick the implementation Self-hosted
15. See another dialog opened on your screen, now with different content
16. Click on one of the copy buttons, and paste the code somewhere to see it starts with `<script type="text/javascript"`
It hasn’t landed in the asset bundle yet but I have no doubt it’ll be ported there at some point in the near future. If you’re able to help reviewing and testing that PR then we can make that happen quicker!
cc @andersoneccel for visibility.
1 Like