Added explanatory text for the replacevars

[boblinthorst]

Summary

This PR can be summarized in the following changelog entry:

• Added explanatory text for the replacevars in the snippet editor.

Relevant technical choices:

• Added the props for the explanation, so that it can be overwritten should the user not want add it. Set the explanation we want to use as the default prop.
• No styles yet. So chosen style is based on surroundings:

Test instructions

This PR can be tested by following these steps:

• Visit the post page.
• Check if the help text provided in the issue is added between the meta description field and the close editor button.
• Check if tests pass and if it still looks good on scaled screens.

Fixes https://github.com/Yoast/wordpress-seo/issues/9786

[bintzandt]

@boblinthorst I get a lot of merge conflicts when trying to move this issue to the https://github.com/Yoast/javascript monorepo.

Could you see if you can fix them? I had a look at them but I lack context from this specific issue.

You can run the following command from the root of the monorepo in order to transfer the branch: ./transfer-branch.sh yoast-components develop 9786/snippet-preview-variables-explanatory-text This will give some merge conflicts that can be resolved. After resolving them you can push the branch to the repo by executing: git push --set-upstream origin 9786/snippet-preview-variables-explanatory-text

Please ping me when this is resolved and the branch has been created on the monorepo.