2.2.0

Features

• Mixed static + dynamic property values are back! (#93)

  This was something that got lost during transition to HTM 2, but now it's making a comeback! Multiple joined static and dynamic values get concatenated together as strings. So this works now:

  html`<a href="/pages/${id}" />`;
  // ...or even:
  html`<Route path=/${base}/users/me />`;

• Support HTML-style comments (#84)

  Another thing lost in the transition to HTM 2. Now everything between comment delimiters <!-- and --> gets ignored during parsing:

  html`
    <div>
      <!-- Everything between comment delimiters
           gets ignored, including <tags>,
           newlines and ${"variables"} -->
    </div>
  `;

• Convert JSX fragments in babel-plugin-transform-jsx-to-htm (#85, thanks @blikblum!)

  babel-plugin-transform-jsx-to-htm now understands React.Fragment elements in the JSX input:

  <React.Fragment>
    <div>Foo</div>
    <div>Bar</div>
  </React.Fragment>

  The plugin transforms fragments to htm expressions with multiple root elements - look how clean the output is:

  html`<div>Foo</div><div>Bar</div>`;

• Support for native Object Spread in babel-plugin-htm (#99)

  Setting the plugin option useNativeSpread to true makes the transformed output use object spread syntax instead of Object.assign calls. If you're targeting modern browsers that support spread, this option can help reduce your bundle size!

  // input:
  html`<Link href="/1" ...${props} />`;
  
  // output:
  h(Link, { href: "/1", ...props });

Fixes

• Allow slashes in unquoted property values (unless immediately followed by >) (#112)
• Bring babel-plugin-transform-jsx-to-htm's tag name handling closer to JSX (#92)
• Properly transform dotted component names in babel-plugin-transform-jsx-to-htm (#98)
• Fix how babel-plugin-htm handles text (and other non-element) roots (#105)
• Remove babel-plugin-transform-jsx-to-htm's package.json module field (#87, thanks @blikblum!)
• Remove Preact from htm's peerDependencies to avoid warnings (#102)

Documentation

• Clarify htm usage with integrations (#101, thanks @robdodson!)