Spacing issues around tags with dynamic text

Describe the bug

I made an extremely simple example of running Mitosis with Astro. The same Mitosis component has different rendering between frameworks. I guess we'd need a test suite for this. But below is an example:

The text of the input is rendered like this:

    return <div>
        <input
            css={{
            color: "red",
            }}
            value={name}
            onChange={(event) => setName(event.target.value)}
        />
        Hello <span>{name}</span>!
        I can run in React, Vue, Solid, or Liquid!
    </div>;

Note that the dynamic content is rendered on a <span/> tag. I could have rendered it directly on the parent text but I wanted to specifically set it apart. I think the same issue happens without the <span/> tag.

To Reproduce

1. Just render dynamic content on a tag with text around it, and see if the text respects the spaces in the source.

If possible, a link to a https://mitosis.builder.io/ fiddle containing the bug:

There's not much point in this because the "rendered" output is a Builder editor and not rendered by the selected framework.

Link to fiddle

Expected behavior

First, I expect all frameworks to render the same. Second, I expect the spacing around texts to represent what I wrote in the source. Specifically, to have a space if there is one in the source and to not have a space if there isn't one in the source.

Screenshots

If applicable, add screenshots to help explain your problem.

Additional context

• React and Solid:
  No space after "Hello". Here the rendered source JSX has the word "Hello" on its own line. For it to work we need to output one of these options:
  • A space character when text is alone on the line:

      Hello{" "}
    

  • Make the text on the same line as the tag. I guess this is the easier option.

      Hello <span>{name}</span>!
    

    Edit: Also, I almost overlooked it, but the text "Hello" also does not have a space before it, having no space with the text input just before it.
• Svelte:
  This one is actually putting a space between the <span/> and the exclamation mark !. This space needs to be removed.

    Hello <span>{name}</span> !
  

• Vue:
  This one actually gets it right. No complaints here

Start with the linked Astro/Mitosis example and compare the generated React, Solid, Svelte, and Vue output around the dynamic span. Trace how source text whitespace is represented when text appears before or after a dynamic tag. Done means all affected frameworks preserve exactly the spaces present in the source without adding or removing spacing.