Whitespace missing in build version

[xmaxiy]

• Maizzle Version: 4.7.0
• Node.js Version: 20.11.0

After updating tot the latest Maizzle version with the commits from yesterday, 12th of January, my rendered HTML had some problems with inlineCSS enabled. Looks like a space is missing in my paragraph tag.

My component: `

{{ body }}

`

The generated output: <pstyle="box-sizing: border-box; margin: 0; padding: 0; padding-top: 20px; padding-bottom: 20px; font-family: Trebuchet MS, Arial, sans-serif; font-size: 16px; font-weight: 400; color: #f2f6e3;">Lorem ipsum</p>

[yuruyu6]

The same.

[cossssmin]

Just updated the starter locally to use Maizzle v4.7.0 and I'm not able to reproduce it, I get the space as expected no matter if using that markup in a template or in a component. Can you please share a repo that reproduces the issue so I can check?

[cossssmin]

OK, managed to reproduce it, I think.

Seems prettier is having trouble with unquoted, space-separated values in the font stack, i.e. if you quote 'Trebuchet MS' in your Tailwind config, then it works.

The problem in Maizzle is that we're trimming the value of the p1 match here:

.replace(/(\s+style="\s+)([\s\S]*?)(\s+")/g, (match, p1, p2, p3) => {
  const formattedStyle = p2.replace(/\s+/g, ' ').trim()
  return p1.trim() + formattedStyle + p3.trim()
})

... which means we change this: style="..." into this: style="..." (notice the missing leading space).

I'll push a fix shortly, thanks for reporting it!

[cossssmin]

Released v4.7.1, should be fixed now.

[xmaxiy]

Hey, thanks a lot for the fast fix! Works fine now :)