Volta.js is a tool to manage easily several versions of Node locally.
This tool is able to switch automatically to the right Node version by
parsing package.json of the project. So we run volta pin node@16.15 for
each of cunningham package.
Vite automatically inline assets in CSS in lib mode and this is
hardcoded in it. After multiple approaches it seems that this one
is the most trivial and easy-to-maintain one.
Previously, when using the cunningham bin to build tokens, the CSS
file always included utility classes, resulting in duplicated CSS
utility classes on the consumer side if no specific CSS optimizer
is defined ( its local cunningham-tokens.css + the one from the
react package ). Now, this new feature introduces a param named
--utility-classes that must be provided to generate those classes.
This params is henceforth only provided to the bin inside the tokens
package.
Fonts were de-facto included in the bundled dist/style.css file which
wasn't convenient in situations were consumers wanted to import fonts
by themselves.
These were the missing parts in order to use every design tokens
of Cunningham. Including: spacing, font weight, size, family, and
colors. In order to be really versatile and to allow users to
define new design tokens I had to re-organize the way those tokens
are sub divided in sub objects in cunningham.ts file. That's why
sub division are created for theme.typ.sizes for instance.
This demo is useful to test in the real usage of the design system as a real
user that will generate its own customized design tokens, implements the design
system's components, etc ...