Commit Graph

115 Commits

Author SHA1 Message Date
Anthony Le Courric
e251bbb438 🚨(eslint-config-custom) prob order with windows
With Windows the order of the imports was not the same as with Linux,
this was causing the linter to fail with CI.
We force the import starting with ":" to the internal group to fix this
issue.
2023-09-11 16:15:13 +02:00
Anthony Le Courric
c7000f37d2 🐛(react) fix props not recognized on the input element
The props propagation was adding unknown props to the input element,
which was causing an error warning to be displayed in the console.
2023-09-11 16:15:13 +02:00
Nathan Vasse
8086a48672 📝(react) improve form examples
We decided to improve the examples to fit better the guidelines of the
design-system.
2023-09-11 12:07:49 +02:00
Nathan Vasse
8fd34add8a 🐛(react) fix Radio, Checkbox fullWidth
The fullWidth was buggy for those components, the label was floating
in the middle of the empty space where it feels correct to keep it
aligned on the left.
2023-09-11 12:07:49 +02:00
Nathan Vasse
9de9a9735d 💄(react) improve Select actions ui
The button were too big compared to the sketches. So we re-adjust their
sizes and positions.
2023-09-11 12:07:49 +02:00
Nathan Vasse
cdace69482 💄(react) adjust checkbox and radio borders and colors
Based on a QA feedback.
2023-09-11 12:07:49 +02:00
Nathan Vasse
dce90eafb4 💄(react) add margin to right supporting text
If the left text is long it was able in some cases to be too close
to the right text.
2023-09-11 12:07:49 +02:00
Nathan Vasse
d36e31448e 💄(react) improve FileUploader style
Based on recent QA feedbacks we needed to do small changes to the style
of the FileUploader.
2023-09-11 12:07:49 +02:00
Nathan Vasse
6257dd9cbc 💄(react) fix DatePicker label focused
The label of the DatePicker was not using the specific focus color.
2023-09-11 12:07:49 +02:00
Nathan Vasse
cf542e4fa9 💄(react) fix DatePicker, Select, Input success colors
This is based on recent QA report.
2023-09-11 12:07:49 +02:00
Nathan Vasse
9a349c1556 💄(react) fix Select and Input error colors
This was a feedback from the QA.
2023-09-11 12:07:49 +02:00
Nathan Vasse
1c45b93a85 💄(react) homogenize form fields colors
Based on the QA feedbacks we figured out that form fields were not all
using the exact same greyscale colors.
2023-09-11 12:07:49 +02:00
Nathan Vasse
4c64cb3993 📝(react) add disabled form example
Before it wasn't really handy to see form inputs next to each other
in order to make sure that their style is homogeneous when being
disabled.
2023-09-11 12:07:49 +02:00
Nathan Vasse
94f392e037 💄(react) update DatePicker error color
The QA reported that the colors were not correct.
2023-09-11 12:07:49 +02:00
Nathan Vasse
37772a4b85 💄(react) update DatePicker segments colors
Based on QA feedbacks we just want a background color for the focused
segments.
2023-09-11 12:07:49 +02:00
Nathan Vasse
c90f66f0cd 💄(react) hide input number arrows
During our last meeting regarding the QA the designer told us to remove
the arrows on the number input. We can still change the value with the
keyboard arrows, so it does not cause a11y issues.
2023-09-11 12:07:49 +02:00
Nathan Vasse
71dc458ab4 ♻️(react) use nano Button inside DatePicker
Based on the last QA it appears that we were using wrong button size
and icon size ratio. By using the newly created nano size we can make
the code much simpler.
2023-09-11 12:07:49 +02:00
Nathan Vasse
32b8dc0915 💄(react) make DatePicker placeholders uppercase
This was a feedback from the QA.
2023-09-11 12:07:49 +02:00
Nathan Vasse
495f7d3731 💄(react) fix DatePicker focus
Based on QA feedback the keyboard focus of the DatePicker was using
the browser default outline ( when navigating with tab key ), this
ensure a consistent style accross different focus modes.
2023-09-11 12:07:49 +02:00
Nathan Vasse
051c79fd6f ♻️(react) improve props propagation
Before we had to edit input components using Field when adding new props
to the latter.
2023-09-05 11:48:04 +02:00
Nathan Vasse
b530e966ae (react) add textItems to Field
This allow to add bullet points lists below inputs, the best example
is when we want to list multiple errors from form validation.

Fixes #147
2023-09-05 11:48:04 +02:00
Nathan Vasse
468c8161eb 📝(react) add RHF examples
Rework a bit the recent work made on RHF example to make some component
more generic, such as RhfSelect and RhfDatepicker, which is based on a
design using RHF context hooks to provide a seamless integration.

Fixes #144
2023-09-05 11:15:51 +02:00
Nathan Vasse
a88aa1a23d 🐛(react) fix isActive console warning
Previously when interacting with a select, the list items
were triggering a warning.
2023-09-05 11:15:51 +02:00
Nathan Vasse
66c25bcdbd 🏷️(react) export more types
Based on recent developers feedbacks that needed to use props types
in order to wrap the lib's component they were stuck because we were
not exporting all of them.

Fixes #143
2023-08-29 16:26:40 +02:00
jbpenrath
c89d9dc6df 🚨(react) fix linter warning & errors
With upgrade new linter warning and erros are popped up. So we fix it.
2023-08-21 15:33:50 +02:00
Romain Le Cellier
4eae45c4d9 🐛(react) fix RadioGroup optional prop
since 5dde74c10d RadioGroup style was a
mandatory property.
It should be optional.
2023-08-10 18:37:15 +02:00
Romain Le Cellier
3e1cdbe9d6 🚑️(react) fix unexisting import
Since b72d0d5c90 InputRefType doesn't
exist.
We missed some usage of it that are removed in this fix.
2023-08-10 18:37:15 +02:00
Romain Le Cellier
5dde74c10d 📝(react) react-hook-form forms Sports examples
Our forms needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
d0941ae0a7 📝(react) react-hook-form forms Login examples
Our forms needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
e3563f85d1 (react) react-hook-form Select example
Our form elements needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
4e53857159 (react) react-hook-form Radio example
Our form elements needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
d506cab978 (react) react-hook-form Checkbox example
Our form elements needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
e3bf4cadf2 (react) react-hook-form Switch example
Our form elements needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Romain Le Cellier
b72d0d5c90 (react) react-hook-form Input example
Our form elements needs to be usable with react-hook-form
2023-08-07 16:25:00 +02:00
Lebaud Antoine
94ae861ae9 🚚(react) make datepicker utils tests a tsx file
In order to use vitest dependency, make the utils test file
use a tsx extension.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
7e5a11ec7d 📝(react) add a timezone management section to date picker docs
Describe the current behavior of date picker components,
especially with the recent changes in component's API.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
9d31c502b8 📝(react) document date picker utils functions
Add some docstring documentation to the newly updated utils
functions, to help understand what are their role and params.
User have a clear view of inputs and outputs timezone.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
cd42afb10e (react) add a timezone props on date picker components
By default, component's timezone is the user locale timezone.
Component now offers a way to set its timezone to any supported
Intl timezone format. Please note that output values from the
component will always be converted to a UTC timezone.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
0dc46d1144 (react) restrict inputs formats in date picker components
Enforces a standardized approach for end consumers using the
component's API. Consumers are now required to provide a date as an
ISO string in either UTC or with a UTC offset. The support for native
Date objects has been removed to ensure consistent and reliable
behavior across all implementations. By adopting this uniform input
format, we can simplify usage and avoid potential inconsistencies in
date handling.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
8cf8e1eba2 🩹(react) harmonize date picker components output
By introducing this utility function, we ensure that any output value
is converted back to an ISO 8601 date and time string in UTC timezone.
Overall, it harmonize and factorize the way we output
values from date picker components.
2023-08-02 19:02:22 +02:00
Lebaud Antoine
bae7392fe1 (react) strip "Today, " from selected date range literal
DateRangePicker aria-labels mention when a selected date range
contains today's date, which breaks the tests  while ran on the
first day of the month. Avoid these tests to be flaky.
2023-08-02 16:22:40 +02:00
Nathan Vasse
40f2eb2b06 ♻️(react) upgrade code for Downshift 8
This new major version broke our components, including the way the menu
gets opened, how to determine the disabled options and some other semantic
types changes.
2023-07-18 16:59:39 +02:00
Nathan Vasse
d85f9edac8 🚨(lint) update file for prettier 3.0.0
Prettier 3.0.0 comes with new standards so we need to upgrade our files
to comply with it.
2023-07-18 16:59:39 +02:00
Lebaud Antoine
2cd8c6e843 🐛(react) make DatePicker's tests no longer depend on the user's locale
Refactor tests to enhance simplicity and clarity by introducing
expected string values. This improvement is particularly relevant
for focused months and focused year scenarios. Consequently, the
tests no longer depend on the user's locale.
2023-07-13 14:22:43 +02:00
Lebaud Antoine
c35cc603a7 🐛(react) resolve development warning in CalendarAux component
Resolve development warning in `CalendarAux` component caused
by recent updates to react-aria dependencies. Update props for next
and previous calendar buttons, removing `onFocusChange` before
passing to the Button component.
2023-07-13 14:11:18 +02:00
Nathan Vasse
2344cdbe6f (react) update DatePicker test
The recent updates of @react-aria renamed the segment name from
month to "month,", causing tests fails.
2023-07-12 15:47:35 +02:00
Nathan Vasse
16dd24148b (react) update DateRangerPicker test
Due to the recent update of @react-aria/calendar the role of the calendar
has changed from group to application, the test were using this role.
2023-07-12 15:47:35 +02:00
Lebaud Antoine
5338e2142f 📝(react) update incoming DatePicker features
Documentation was outdated, as the range date picker is now available.
2023-07-12 00:47:52 +02:00
Lebaud Antoine
5c61413949 📝(react) illustrate international calendars of DatePicker component
Show international capabilities of the `DatePicker` component using the
`locale` props and the Cunningham provider. Dates would
be automatically displayed in the appropriate calendar system.
2023-07-12 00:47:52 +02:00
Lebaud Antoine
e1489b7fe0 (react) internationalize calendar system in DatePicker
Component was lacking some customization capabilities.
Using the browser calendar system wasn't enough modular.
This introduces a `locale` props, that allows a higher
customization of the component. By default, the calendar
system of the DatePicker is synchronized with the Cunningham
Provider.
2023-07-12 00:47:52 +02:00