Commit Graph

147 Commits

Author SHA1 Message Date
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
jbpenrath
b79c23da30 💫(tokens) change transitions timing functions
Increase duration by 50ms then switch to ease cubic timing function in
order to get smoother but enough speed transitions.
2023-04-12 17:21:19 +02:00
jbpenrath
e90563aee2 (react) add missing dependencies to run storybook
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.
2023-04-12 17:21:19 +02:00
jbpenrath
c3934ce7f2 🔧(all) pin node to 16.15 for volta user
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.
2023-04-12 17:21:19 +02:00
Nathan Vasse
b0c6b88141 🔖(release) version packages
Bump @openfun/cunningham-react to 0.2.0
2023-03-30 14:20:38 +02:00
Nathan Vasse
de6acbe7fe 📝(doc) add release documentation
As I forgot each time at least one task when doing a release, I will no
longer have any excuse. And this could be useful to everyone.
2023-03-30 14:20:38 +02:00
Nathan Vasse
6661c47fc4 🔖(changeset) adding missing changesets
I forgot to add changeset when merging the PR#20, so I add a
dedicated commit to keep an history before bumping versions.
2023-03-30 14:20:38 +02:00
Nathan Vasse
db982cf265 ⬆️(frontend) migrate to glob 9.3.2
Glob release a new major version introducing breaking changes, so
I update the way we use it to match the new API.
2023-03-29 17:40:25 +02:00
renovate[bot]
39352ed9f2 ⬆️(dependencies) update js dependencies 2023-03-29 17:40:25 +02:00
Nathan Vasse
1f0d890cb3 (fonts) allow async font loading
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.
2023-03-28 12:00:27 +02:00
Nathan Vasse
b2fd517bde 🔧(eslint) update eslint config to make import/order work
The autofix of import/order was not taken into account due to
a misconfiguration.
2023-03-28 12:00:27 +02:00
Nathan Vasse
2d80722a18 (demo) upgrade demo app
Add the locale switching feature.
2023-03-28 12:00:27 +02:00
Nathan Vasse
994d42578e (react) add DataGrid, SimpleDataGrid components
The DataGrid component can be considered as the core one, which provides
a full controlled component, but more complicated than SimpleDataGrid
which is based on DataGrid. SimpleDataGrid is intended to give a simple
ready-to-use data grid for client side data for example.
2023-03-28 12:00:27 +02:00
Nathan Vasse
8e078c87c2 (react) add Loader component
The first use of this loader will be inside the DataGrid for its
loading state. Its colors are based on the existing primary
colors tokens.
2023-03-28 12:00:27 +02:00
Nathan Vasse
b84af99c36 (react) add a temporary Checkbox
We need a temporary Checkbox in order to implement the row
selection feature of the future DataGrid. This do not come
from designer sketches for now.
2023-03-28 12:00:27 +02:00
Nathan Vasse
88e478d9f6 (react) add Pagination component
In order to create a DataGrid we first need a fully working pagination
component. It comes with multiples working examples in the documentation.
2023-03-28 12:00:27 +02:00
Nathan Vasse
90feb4ba4a 🌐(react) add i18n
We need to be able to use localized texts for various components, like for
accessible labels. We decided to setup a lightweight implementation of
localizable to avoid relying on an existing heavy library.
The Provider includes by default full translations for english, and it is
also made to be able to load easily any custom locale directly from the
Provider.
2023-03-28 12:00:27 +02:00
Nathan Vasse
1df3b82571 (react) add a temporary TextInput
Even if we haven't started to work on a complete set of inputs
we need a generic Input to implement the "goto" feature on the
Pagination component. This component is not intended to be used
in by the librarie's dependent, so we mark it as "WIP" for the
moment.
2023-03-28 12:00:27 +02:00
Nathan Vasse
980c80c784 (react) add material icons
We need some icons to implement the Pagination and the DataGrid.
2023-03-28 12:00:27 +02:00
Nathan Vasse
05242ffbcd (react) add button sizes
Add two sizes for the Button component: small and medium. They
are present on the new delivered sketches concerning pagination
but dont exists yet.
2023-03-28 12:00:27 +02:00
Nathan Vasse
f3e3b568fc (react) add active state on button
Previously we had no way of forcing a button to render in
an active state.
2023-03-28 12:00:27 +02:00
jbpenrath
8bf13ae3ad ️(react) add aria-label property to the only icon button story
As this button has no label only an icon, the a11y checker reports us
that there is no accessible label for this component.
2023-02-28 10:29:23 +01:00
jbpenrath
0274534234 (react) install storybook-a11y-addon
We need to ensure that our components are accessible. In order to ease
this task, we decide to install this package to display an a11y report
for each component into the storybook interface. In this way, developer
can check if the component it is developing violates or miss so a11y
rules.
2023-02-28 10:29:23 +01:00
Nathan Vasse
8ad95945a8 🔖(release) version packages
Bump cunningham-demo to 0.0.1
Bump @openfun/cunningham-react to 0.1.1
Bump @openfun/cunningham-tokens to 0.1.1
2023-02-21 18:32:04 +01:00
Nathan Vasse
2a5acea4a4 (tokens) css utility classes are now optionnal
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.
2023-02-21 09:29:24 +01:00
Nathan Vasse
cd88e46537 ♻️(react) split fonts in a seperate CSS file
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.
2023-02-21 09:29:24 +01:00
ALC Consulting
479e0777b6 🐛(tokens) fix windows generate tokens
The tokens generation was failing on windows because
of the path separator.
This commit fixes this issue.
2023-02-20 11:29:36 +01:00
Nathan Vasse
722b66b3ae (react) add button with icon only
Previously using Button with only an icon made it render with an
internal offset, that wasn't really nice-looking. Now we force the
button to be squared.
2023-02-15 16:00:14 +01:00
Nathan Vasse
89138e0a5a 🔖(release) version packages
Bump @openfun/cunningham-tokens to 0.1.0
Bump @openfun/cunningham-react to 0.1.0
2023-01-31 16:19:10 +01:00
Nathan Vasse
63118d0f3e 📝(doc) update docs to install published packages + contributing guide
Updated various parts of existing documentations to make a clean path
to learn how to install the library. I let the most complicated part in
the tokens's README.md file, which is referenced from the Storybook.
2023-01-30 17:47:34 +01:00
Nathan Vasse
4ebbf168e2 🔊(changelog) migrate existing changelog entries to changeset
The entries were dispatched in matching packages, but some of them that
were about the overall monorepo's architecture (like "setup circleci"
were delete thrown away because they were not matching any specific
package.
2023-01-30 17:47:34 +01:00
Nathan Vasse
e2204a1234 👷(ci) add changeset to handle package releases and changelog
We needed a tool to automate the handling of monorepo's changelogs and
packages publishing. We want to make the CI responsible to automatically
publish bumped packages and create associated tags.
2023-01-30 17:47:34 +01:00
Nathan Vasse
1529a5b5e7 📝(doc) fixing things in doc
During the keynote we saw some things to fix in the documentation.
2023-01-25 10:37:37 +01:00
Nathan Vasse
31d29d8cbf 📝(doc) fixing typo in colors doc
So it has not more typos.
2023-01-23 13:54:02 +01:00
Nathan Vasse
9658979f54 📝(readme) update readme.md to include figma and storybook links
Things are getting nice.
2023-01-20 17:26:06 +01:00
Nathan Vasse
c032e2e951 (react) publish storybook to github pages
In order to make the storybook visible to everyone. Some changes
had to be made to make index.scss compiled with the rest of the
codebase, it had to be imported from preview.js, not directly from
preview.html.
2023-01-20 17:26:06 +01:00
Nathan Vasse
9bd7317796 📝(doc) sort docs in the Storybook's sidebar
Previously the docs order was defined by the default behavior of
Storybook: discovery order. But, in our situation we want the
"Getting Started" part to appear above "Components", and "Doc"
above any other stories. So we needed to create a custom sort callback.
In order to make this storySort callback to be taken into account by Storybook
it was needed to rename the file to preview.js. Strange but .. meh.
2023-01-20 17:00:31 +01:00
Nathan Vasse
dd2a93ffdf 📝(doc) create a global category for Components
This way we ensure that the main categories of the Storybook docs
are well separated, improving readability.
2023-01-20 17:00:31 +01:00