0.22.0

Overview

This release adds better support for Popover types with TypeScript 6, and adds support for inline event handlers with the JSX tranform.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.22.0

1. feat(jsx): #264 typescript 6 support and refactor popover types
2. feat(jsx): #88 inline event handlers support
3. docs: #232 document signals typescript support

Breaking Changes

N / A

Known Issues

N / A

Diff

0.21.1...0.22.0

0.21.1

Overview

Fixes an installation issue with the previous release.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.21.1

1. bug: remove patch-package postinstall script breaking npm installs

Breaking Changes

N / A

Known Issues

N / A

Diff

0.21.0...0.21.1

0.21.0

Overview

This release refactors WCC's reactivity capability (inferredObservability) to be based on (TC39) Signals. This is very experimental and not feature complete yet

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.21.0

1. feat: #232 Signals based JSX compilation (prototype)

Breaking Changes

N / A

Known Issues

N / A

Diff

0.20.0...0.21.0

0.20.0

Overview

This release adds fixes popover attributes support for WCC's JSX types and standardizes the exports map in package.json. A new version of the WCC website was also launched, and so various metadata, logos, etc have been updated across the project.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.20.0

1. feat: #228 popover attribute typings
2. enhancement: #236 narrow popovertarget JSX attrs to button/input elements only (thanks @LouisLau-art 🙌 )
3. feat: #230 add DOM shim to exports map and standardize export map entry paths

Breaking Changes

Imports

In standardizing the exports map structure for the project, there is one small breaking change that may impact you if you are using the jsx-loader import.

// ❌  before
import { parseJsx } from "wc-compiler/src/jsx-loader.js";

// ✅ after
import { parseJsx } from "wc-compiler/jsx-loader";

Known Issues

N / A

Diff

0.19.0...0.20.0

0.19.0

Overview

This release improves WCC's JSX transformations for inferredObservability to be fine grained.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.19.0

1. feat: #108 fine grained observability
2. enhancement: #214 apply publint feedback

Breaking Changes

N / A

Known Issues

N / A

Diff

0.18.1...0.19.0

0.18.1

Overview

This release fixes a couples bugs with WCC types and JSX transformations.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.18.1

1. fix: #219 preserve JSX literal attribute expressions
2. fix: #193 add missing source property on the Metadata type
3. chore: fix grammar in README

Breaking Changes

N / A

Known Issues

N / A

Diff

0.18.0...0.18.1

0.18.0

Overview

This release adds TSX parsing support (including type safe HTML!) to the JSX capabilities of WCC.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.18.0

1. feat: #164 TSX support

Breaking Changes

N / A

Known Issues

N / A

Diff

0.17.1...0.18.0

0.17.1

Overview

This release adds some typings for WCC and makes some breaking changes around the API supporting Node's custom loaders (including TypeScript support), sets a new minimum NodeJS version, and drops the CommonJS distribution. The shape for Metadata was also changed.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.17.0

1. bug: #203 correct export types and functions

Breaking Changes

N / A

Known Issues

N / A

Diff

0.17.0...0.17.1

v0.17.0

Overview

This release introduces native support for TypeScript (type stripping) WCC, adopt's Node's new loaders API, and bump the minimum Node version >= 18.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.17.1

1. Add typings for WCC
2. Leverage native NodeJS TypeScript support
3. Set minimum NodeJS version to >= 18
4. Adopt new NodeJS loaders API for custom imports
5. drop support for CommonJS distribution

Breaking Changes

Minimum NodeJS Version

The minimum NodeJS version for WCC is now >= 18.x

Custom Loaders (JSX / TS)

TypeScript

Support is now built-in, you no longer need to use the custom loader anymore. Follow these steps / guidelines:

1. You will need to use Node >= 22.6.0 and set the --experimental-strip-types flag (or >= 23.x without the flag)
2. (Optional) Install TypeScript into your project, e.g. npm i typescript --save-dev
3. (Optional) Create a tsconfig.json file at the root of your project with these minimum configuration settings

JSX

For the JSX custom loader, you'll now need to use the new --import API and WCC's register function instead

# before
$ node --loader ./node_modules/wc-compiler/src/jsx-loader.js your-script.js

# after
$ node --import ./node_modules/wc-compiler/src/register.js your-script.js

# or

$ NODE_OPTIONS="--import wc-compiler/register" node your-script.js

Metadata

When calling renderToString or renderFromHTML, WCC optionally returns a metadata object with all the custom elements registered / detected, and any relevant details. The original shape of this object as documented was a bit broken, and so it has been "fixed" now to make sense

// before (some sort of array like object)
{
  metadata: [
    'wcc-footer': { instanceName: 'Footer', moduleURL: [URL], isEntry: true },
    'wcc-header': { instanceName: 'Header', moduleURL: [URL],  isEntry: true },
    'wcc-navigation': { instanceName: 'Navigation', moduleURL: [URL],  isEntry: false }
  ]
}

// after (an object)
{
  metadata: {
    'wcc-footer': { instanceName: 'Footer', moduleURL: [URL], isEntry: true },
    'wcc-header': { instanceName: 'Header', moduleURL: [URL],  isEntry: true },
    'wcc-navigation': { instanceName: 'Navigation', moduleURL: [URL],  isEntry: false }
  }
}

CommonJS Bundle

We have removed support for the CommonJS bundle / distribution.

Known Issues

N / A

Diff

0.16.0...0.17.0

v0.16.0

Overview

This release refactors some WCC's DOM shim internals as well as address issues with setting element properties and honoring the mode option for attachShadow. There was also a breaking change to remove the deprecated getInnerHTML call with getHTML on the Node class in the DOM shim.

Changelog

https://github.com/ProjectEvergreen/wcc/issues?q=label%3A0.16.0

1. Replace deprecated method getInnerHTML with getHTML (thank you @DannyMoerkerke 🙌 )
2. refactor DOM shim internals (thank you very much @briangrider 🙌 )
3. Issue Setting Element Properties (thank you @briangrider 🙌 )
4. support configurable shadowrootmode attribute for <template> tags (thank you @briangrider 🙌 )
5. verify / ensure proper serialization of shadow roots excluding closed shadow roots from getInnerHTML getHTML (thank you @briangrider 🙌 )
6. Upgrade parse5 to v7

Breaking Changes

DOM Shim

On the Node class, the getInnerHTML method has been deprecated and replaced with getHTML to align with the spec

// before
import 'wc-compiler/src/dom-shim.js';
import Greeting from './components/greeting.js';

const greeting = new Greeting();
const html = greeting.getInnerHTML({ includeShadowRoots: true });

// after
import 'wc-compiler/src/dom-shim.js';
import Greeting from './components/greeting.js';

const greeting = new Greeting();
const html = greeting.getHTML({ serializableShadowRoots: true });

Shadow Root Templates

Setting innerHTML on a Shadow Root will now automatically insert a <template> tag when using renderToString / renderFromHTML, e.g.

class MyComponent extends HTMLElement {

  connectedCallback() {
    if (!this.shadowRoot) {
      this.attachShadow({ mode: 'open' });
      this.shadowRoot.innerHTML = `
        <style>
          :root {
            --accent: #367588;
          }
        </style>

        <main>
          <h1>My Website</h1>
        </main>
      `;
    }
  }
}

export default Home;

Known Issues

N / A

Diff

0.15.1...0.16.0