Commit Graph

134 Commits

Author SHA1 Message Date
Nathan Vasse
527c3fc0c9 (react) set specific cursor on checkbox related components
Even if this is not the default behavior of the native checkbox, based on
recent feedbacks and by comparing what other components libraries do, it
appears that setting a custom cursor on checkbox hover is the most
intuitive thing to do.

Resolve #59
2023-05-24 12:00:42 +02:00
Nathan Vasse
6f77131839 ♻️(react) migration preview.js to preview.ts
Storybook 7 allows to simply use typing inside preview.ts configuration file.
2023-05-24 11:10:13 +02:00
Nathan Vasse
c53d34834c 📝(react) add customization doc
This part of the doc was a huge miss as it is often asked during
installation based on our recent feedbacks.
2023-05-24 11:10:13 +02:00
Nathan Vasse
e05c6b786c 🏷️(react) export DefaultToken types and defaultTokens variable
By doing this we provide more typings for consumers which makes more
handy the use of the local configuration in cunningham.ts files.
2023-05-24 11:10:13 +02:00
Nathan Vasse
b5fcfdfeab (react) add support for CJS
At first we wanted to only support ESM. But as we want to share types
and export design tokens from the react package to the outside world
in order to allow local cunningham.ts files to import them, we are
forced to also build the library for CJS too. Why? Because local
cunningham.ts files are loaded as CJS, so they can only import CJS
module. Why loading cunningham.ts as CJS? Because the tokens package's
binary is built for CJS, then it's seamless to make it load CJS, where
making it load ESM was buggy. And why not migrate the tokens package to
ESM so? Because it implies to rewrite every imports with .js extensions,
makes us loose the possibility to use __dirname kind of variables. And
also Jest use for testing is not compliant at all when it comes to execute
ESM code. Well, the ecosystem is not ready for that at the moment, sadly.
2023-05-24 11:10:13 +02:00
Nathan Vasse
bc15ced92f ♻️(react) rename docs to new format
Previously we were using .stories.mdx extension for docs but now
.mdx is the most recommend extension according to official Storybook
7 documentation.
2023-05-24 11:10:13 +02:00
Nathan Vasse
ce6eb50a98 ♻️(react) migrate ArgsTable to ArgTypes and rework imports
Storybook was emitting warnings errors about the fact that ArgsTable
is deprecated, and also I rewrote imports as those are not the one
used in the doc anymore, this will prevent breaking changes in the
upcoming upgrades.
2023-05-23 10:10:40 +02:00
Nathan Vasse
8cda41772d ♻️(react) fix Storybook source blocks
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.
2023-05-23 10:10:40 +02:00
Nathan Vasse
f264c29a4a 🔖(release) version packages
Bump @openfun/cunningham-react to 0.6.2
2023-05-15 17:28:18 +02:00
Nathan Vasse
15eb9b9e57 🏷️(react) add missing types exports
We forgot to add exports for Checkbox and Radio.
2023-05-15 17:23:49 +02:00
Nathan Vasse
dd89157654 🐛(react) fix storybook deploy
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.
2023-05-15 15:07:49 +02:00
Nathan Vasse
424fa05cca 🔧(react) migrate storybook deployment to version 7
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".
2023-05-15 11:04:06 +02:00
Nathan Vasse
77721c3b6d ♻️(react) migrate to Storybook 7
This new release comes with breaking changes for stories and mdx docs.
2023-05-15 11:04:06 +02:00
Nathan Vasse
e7fc782b1c ♻️(react) migrate faker api
faker-js introduced breaking changes in their APIs, so we needed to migrate
our usages.
2023-05-15 11:04:06 +02:00
renovate[bot]
ed2409e50c ⬆️(dependencies) update js dependencies 2023-05-15 11:04:06 +02:00
jbpenrath
3772b4a845 🔖(react) bump to 0.6.1
Patch Changes

- Fix "exports" attribute of package.json. Default condition must be
  last one.
2023-05-12 16:33:23 +02:00
Romain Le Cellier
4777a75631 🚨(react) fix package json
fix error: Module not found: Error: Default condition should be last one
2023-05-12 15:28:49 +02:00
Nathan Vasse
87b328292b 🔖(release) version packages
Bump @openfun/cunningham-react to 0.6.0
2023-05-12 11:57:05 +02:00
Nathan Vasse
2ff5fc5d29 (react) add Select component
Finally our powerful Select component is available to make great forms!
2023-05-12 11:13:38 +02:00
Nathan Vasse
270484c0e7 ♻️(react) make Input use LabelledBox
Let's use the power of reusability!
2023-05-12 11:13:38 +02:00
Nathan Vasse
df57fb8a57 ♻️(react) create a generic LabelledBox
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.
2023-05-12 11:13:38 +02:00
Nathan Vasse
1d3b1456ca (react) add forwardRef to Button
This could be useful to everyone. But at the moment is was needed for the
Select field be able to use Downshift with Button.
2023-05-12 11:13:38 +02:00
Nathan Vasse
3545af85ae 📦️(react) pure ESM package
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.
2023-05-11 17:58:13 +02:00
jbpenrath
56227d206a 🔖(react) bump to 0.5.0
Minor Changes
- 7513b4d: fix type files imports and rollup them
- b53afcb: Add DataList component
2023-05-05 11:18:39 +02:00
jbpenrath
c9f8540dfb 🔖(tokens) bump to 0.4.0
Minor Changes
- 7eac0bf: Suffix all sass maps with the `!default` map
- fb2fb3e: Do not generate sass sub maps
2023-05-05 11:18:39 +02:00
Romain Le Cellier
b53afcb4af (react) add DataList
Implement DataList that is a wrapper of DataGrid without header, sorting
nor pagination.
2023-05-05 10:54:50 +02:00
Romain Le Cellier
0e6532f098 🎨(all) global lint
Executiing `yarn format` should not generate any changes in the
project.
Apply yarn format to all files.
2023-05-05 10:54:50 +02:00
Nathan Vasse
7513b4d217 🔧(react) rollup type files
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.
2023-05-04 16:53:29 +02:00
Nathan Vasse
d4a574c30f 🔧(react) fix types file broken imports
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.
2023-05-04 16:53:29 +02:00
jbpenrath
7eac0bfca1 (tokens) make sass maps overridable
We suffix all sass maps with `!default` flag. In this way, if a consumer
 needs to override cunningham tokens, it will be able to.
2023-05-03 15:56:40 +02:00
jbpenrath
fb2fb3e107 🔥(tokens) remove colors sub maps
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.
2023-05-03 15:56:40 +02:00
Nathan Vasse
a9625eb1c2 🔖(release) version packages
Bump @openfun/cunningham-react to 0.4.0
Bump @openfun/cunningham-tokens to 0.3.0
2023-04-28 16:06:23 +02:00
Romain Le Cellier
b9d2f2955f 🐛(tokens) fix scss generator
scss maps expect keys between quotes like:
$map = (
  'key': value,
)
2023-04-28 09:44:54 +02:00
Romain Le Cellier
1b9fb93bda (tokens) add a test token with a hyphen
tokens that includes hyphen are allowed but the feature wasn't been
tested
2023-04-28 09:44:54 +02:00
Nathan Vasse
edf4563e3e 🔧(demo) update tokens file
The existing file was a bit outdated, we regenerate them in order to
keep things as fresh as possible.
2023-04-27 15:34:15 +02:00
Nathan Vasse
f5cb2e791e (react) add Radio component
Implement Radio input based on designed sketches.
2023-04-27 15:34:15 +02:00
Nathan Vasse
43096e2bab (react) add Checkbox component
Implement Checkbox input based on designed sketches.
2023-04-27 15:34:15 +02:00
Nathan Vasse
a462bb5a61 (react) add compact mode to Field
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.
2023-04-27 15:34:15 +02:00
Nathan Vasse
26be159c91 ♻️(react) make Pagination to use new Input
The Pagination component was not using the label of new Input.
2023-04-25 11:28:32 +02:00
Nathan Vasse
feea284ec8 (react) add Input component
Finally the first form component of the design system. It wraps and enhance
the native input element.
2023-04-25 11:28:32 +02:00
Nathan Vasse
4f1168463f (react) add generic Field component
This component will wrap most of form components in order to provide
them a generic state attribute along with texts below them.
2023-04-25 11:28:32 +02:00
Nathan Vasse
6d195f6dad 📌(react) pin @storybook/builder-vite to 0.3.0
This dependency was breaking the docs CSS.
2023-04-25 11:28:32 +02:00
Nathan Vasse
559c1e2cb7 (react) add jest-dom dependency
We want to be able to use convenience methods like "toBeInTheDocument".
2023-04-25 11:28:32 +02:00
Nathan Vasse
74abf9b8a7 🔧(react) format correctly sub folders components
Without this commit, the design tokens would contain the folders
"/" in their names, which is not compliant with most of generators
output we implement.
2023-04-25 11:28:32 +02:00
jbpenrath
f0a1dd2f5b 🔖(release) version packages
Bump @openfun/cunningham-react to 0.3.0
Bump @openfun/cunningham-tokens to 0.2.0
2023-04-21 11:48:23 +02:00
jbpenrath
1be02f5a85 💄(react) remove button box shadow effect
On hover and active, buttons have a box shadow effect that is too heavy
visually so we remove this effect for now.
2023-04-21 11:33:46 +02:00
jbpenrath
1667d9b501 (tokens) add scss generator
Add a Sass generator which generate a scss file declaring colors, font
families, weights, sizes and spacings as maps.
2023-04-18 14:59:16 +02:00
jbpenrath
72091eecbc 🩹(tokens) add blank line at end of token files
Cunningham CLI did not add a blank line at the end of generated
token files.
2023-04-18 14:59:16 +02:00
jbpenrath
cf325719d5 🩹(tokens) fix typo within cunningham.ts file
The fontSizes.h3 contained an extra ";" chars.
2023-04-18 14:59:16 +02:00
jbpenrath
b1925959fe ️(react) improve button accessibility
Rework buttons in order to improve accessibility by increasing color
contrast and shape change across states.
2023-04-12 17:21:19 +02:00