Due to the recent upgrade to Storybook 7, the source blocks of Canvases
were broken, they were only showing args. This was mainly due to the fact
that as of Storybook 7 the meta tags of the MDX files have changed, thus
causing the issue. These are now based on imports. We also needed to rename
index.stories.mdx files to index.mdx because Storybook was throwing errors,
maybe due to a conflicts with index.stories.tsx files and new imports.
Anyway this way of naming MDX files seems to be the recommend one based on
the official documentation.
The static storybook deployment to github pages was throwing 404 errors
for a file beginning with a underscore, adding a .nojekyll disables
conflicts due to the default behavio of github pages.
The package @storybook/storybook-deployer that seems to not directly work
with Storybook 7 was expecting that command named "build-storybook" to
exist. With the bin updates of Storybook 7 this bin does not longer exist,
so I created a specfic script inside package.json that is named
"build-storybook" too in order to make everything work. Also now that
Storybook uses directly the local vite config, the fact that our config
generates types was causing issues when building Storybook, that why
we filter plugins in main.ts in order to remove "vite:dts".
This component is responsible to display the label as placeholder for forms
input. It was tied inside Input but now we will need to have the same ui
for Select field, by extracting it in a dedicated component we make it
reusable quickly.
Previously we had some configuration in package.json that were falsely
indicating that the react package was supporting CJS, which wasn't the
case. So this commit makes it clear that the package is pure ESM.
Previously types file were splitted into their original folder
tree structure. By enabling this option we could just get one
global .d.ts file. To make this more handy I created a dedicated
build bash file, the package.json was starting to get messy.
Generated types for the react package were broken because they were
still using absolute imports which cannot work in standalone .d.ts
files because they cannot rely on the local baseUrl compiler option.
Thus, we introduced an alias that we are able to reliably replace
during type generation.
Create color sub maps seems to be a good idea but in fact was not. In
fact if with need to create token sub map this structure should appear
within the tokens module.
The Field component was only able to display for large fields like
text input, but for small component like Checkbox or Radio we need
to set specific generic padding that are suitable to those.
Without this commit, the design tokens would contain the folders
"/" in their names, which is not compliant with most of generators
output we implement.
Since last dependencies storybook, it appears there are missing babel
dependencies to be able to run storybook properly. So we install
missings deps in order to fix that.
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.