Stop embedding the Inter font and publish CommonJS packages again

[sandhose]

This stops the embedding of the inter font and instead rely on the @fontsource/inter package.

This means that consumers need to install the package and import the font themselves.
It is set as peer dependency, so it will warn if the consumer does not have it installed.

It also means we can switch back to library mode, and emit commonjs builds alongside esm builds.

For consumers, the change is instead of importing just @vector-im/compound-web/dist/index.css, they need to:

@import url("@fontsource/inter/400.css");
@import url("@fontsource/inter/500.css");
@import url("@fontsource/inter/600.css");
@import url("@fontsource/inter/700.css");
@import url("@vector-im/compound-design-tokens/assets/web/css/compound-design-tokens.css");
@import url("@vector-im/compound-web/dist/style.css");

[cloudflare-workers-and-pages]

Deploying with    Cloudflare Pages

Latest commit:	a64e9e2
Status:	✅  Deploy successful!
Preview URL:	https://87107887.compound-web.pages.dev
Branch Preview URL:	https://quenting-extract-inter-font.compound-web.pages.dev

View logs

[sandhose]

I just don't know about that. I know the @font-face in @fontsource/inter has some unicode ranges, but I don't know if it properly excludes the emojis or not. Do we have a way to test that?

[germain-gg]

So i've actually removed global.css from the exported CSS.
It's still used in Storybook, but right now it is not a great idea to have all of that.

This bit is particularly critical for Element Web, but a bit less for other projects. We do have visual regression tests for it on Percy yes. But only for EW.

[germain-gg]

Makes sense, looks good to me!