Dependency version gets mangled with embedded inline

Reproduction

<div
  data-snack-code="import%20React%20from%20'react'%3B%0Aimport%20RenderHtml%20from%20'react-native-render-html'%3B%0A%0Aconst%20html%3D%60%3Cp%20style%3D'text-align%3Acenter%3B'%3EHello%20World!%3C%2Fp%3E%60%3B%0A%0Aexport%20default%20function%20App()%20%7B%0A%20%20return%20%3CRenderHtml%20source%3D%7B%7B%20html%20%7D%7D%20%2F%3E%3B%0A%7D"
  data-snack-dependencies="react-native-render-html%405.1.0"
>
</div>

<!-- Load the embed.js script -->
<script async src="https://snack.expo.io/embed.js"></script>

The rendered Iframe displays “Open full editor to add new dependencies”. After opening the snack, there seems to be a serious issue with the package.json file:

image

What I have tested

  • Changing the code snippet (data-snack-code) with the snippet exhibited in the docs: negative reproduction.
  • Removing the version suffix: negative reproduction.
  • As expected, adding data-snack-preview="true" and data-snack-platform="web" won’t render the preview.

I made a third test with data-snack-dependencies="react-native-render-html@5.1.0" and the reproduction was negative. It looks like the docs are outdated! This attribute should not be percent-encoded.