chore!: reduce bundle size

[matthieuh]

Description

Done in this PR:

• Give the ability to do tree shaking using this lib:
  => usage of @rollup/plugin-babel to use @babel/plugin-transform-react-pure-annotations (cf. Implement plugin-transform-react-pure-annotations and add to preset-react babel/babel#11428). Without this usage of React.forwardRef or React.memo is breaking tree-shaking.
• Fix to have tree shaking working on server-side of Next.js and due to this issue (tree shaking broken when lib is using barrel files)
  => avoid 1 file bundle and build the lib in separate files (preserveModules: true)
• Remove bundled fonts (cf. How should we handle custom fonts? radix-ui/design-system#148)

Dependency changes

Dependency	Version	State
@babel/plugin-transform-react-pure-annotations	^7.16.7	Added
@rollup/plugin-babel	^5.3.1	Added
rollup	^2.33.1 -> ^2.70.1	Updated
rollup-plugin-url		Removed

Breaking changes

• Fonts have to be imported into your main project

How to test?

1. On a basic Next.js project add config.resolve.alias.react = path.resolve(__dirname, 'node_modules/react') in the custom webpack config. Use some components from Faency both in _app.ts and in some nextjs page (and be sure there are some you are not using).
2. In the Faency repo run npm run build
3. In the Faency repo run yarn link
4. In the Next.js repo run yarn link @traefiklabs/faency
5. In the Next.js repo run yarn build
6. Analyze .next folder and see if faency components that you are not using are not present. @next/bundle-analyzer can be a good way to analyze it.

Good PR checkboxes

• Change has been tested
• Added/Updated tests
• Added/Updated stories
• PR follows conventions
• Labels are set
• Project is linked

Good Review checkboxes

ℹ️ Copy the snippet and paste in the review field to fill it

- [ ] I've tested the changes
- [ ] I've agreed on the unit tests (soon to come)
- [ ] I've checked the stories
- [ ] I've read the code and understood it
- [ ] I don't have any more questions
- [ ] I've described any optional improvements
- [ ] I checked PR follows [conventions](https://github.com/traefik/faency#how-to-contribute)

[paulocfjunior]

Before:

After:

[paulocfjunior]

@matthieuh I think we can also get rid of the types folder, as it's currently only used to define namespaces for the fonts.

[seedy]

• Before
  

• After
  

[traefiker]

🎉 This PR is included in version 4.0.0 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀