feat(fields)!: convert MultiSelect fixedWidth prop from rem to px (#132)

BREAKING CHANGE: Both MultiSelect and FormikMultiSelect `fixedWidth` prop are now in px instead of rem.

CONTRIBUTING.md

@@ -4,6 +4,8 @@
   - [First Setup](#first-setup)
   - [Conventions](#conventions)
   - [Release](#release)
+    - [Versionning](#versionning)
+      - [Breaking changes](#breaking-changes)
   - [Maintenance](#maintenance)
     - [Updating icons](#updating-icons)
     - [Updating caniuse browserlist](#updating-caniuse-browserlist)
@@ -47,12 +49,31 @@ The release process is automated, including versionning and release notes genera
 
 1. Go to [Github Actions Release Workflow](https://github.com/MTES-MCT/monitor-ui/actions/workflows/release.yml)
 2. Click on "Run workflow" > "Run workflow" ("Branch: main" should be selected by default).
-3.
+3. ⚠️ This will generate a version pull request with a title looking like `ci(release): X.Y.Z`.  
+   You **MUST** merge this pull request before merging new pull requests.  
+   _Why? Because this PR include both the release notes and the new version from which later versions will be
+   calculated._
+
+#### Versionning
+
+In short, 'feat(...):' will generated minor versions and 'fix(...):' will generate patch versions.
+
+##### Breaking changes
+
+If you have to release a BREAKING CHANGE, you should look at the
+[official documentation](https://www.conventionalcommits.org/en/v1.0.0/#commit-message-with-description-and-breaking-change-footer)
+and you may look at this [pull request](https://github.com/MTES-MCT/monitor-ui/pull/131) as an example.
+
+In the case of a BREAKING CHANGE, it's **strongly advised** to add an exclamation point at the end of the scope (or type
+if there is no scope) in the commit message, i.e.:
 
 ```sh
-npx browserslist@latest --update-db
+git commit -m "feat(fields)!: this prop has been removed"
+git commit -m "feat!: all theses component props are now strings instead of numbers"
 ```
 
+And **don't forget** the `BREAKING CHANGE: ...` in the commit message body.
+
 ### Maintenance
 
 #### Updating icons

src/fields/MultiSelect.tsx

@@ -11,7 +11,7 @@ import type { Promisable } from 'type-fest'
 
 export type MultiSelectProps = Omit<TagPickerProps, 'as' | 'data' | 'defaultValue' | 'id' | 'onChange' | 'value'> & {
   defaultValue?: string[]
-  /** Width in REM */
+  /** Width in pixels */
   fixedWidth?: number
   isLabelHidden?: boolean
   isLight?: boolean
@@ -77,7 +77,7 @@ const StyledTagPicker = styled(TagPicker)<{
 }>`
   border: 0;
   cursor: pointer;
-  width: ${p => p.$fixedWidth}rem;
+  width: ${p => p.$fixedWidth}px;
 
   > .rs-picker-toggle {
     background-color: ${p => (p.$isLight ? p.theme.color.white : p.theme.color.gainsboro)} !important;

stories/fields/MultiSelect.stories.tsx

@@ -7,7 +7,7 @@ import type { MultiSelectProps } from '../../src'
 
 const args: MultiSelectProps = {
   defaultValue: undefined,
-  fixedWidth: 10,
+  fixedWidth: 160,
   isLabelHidden: false,
   isLight: false,
   label: 'A multiple select',

stories/formiks/FormikMultiSelect.stories.tsx

@@ -8,7 +8,7 @@ import { noop } from '../_utils/noop'
 import type { FormikMultiSelectProps } from '../../src'
 
 const args: FormikMultiSelectProps = {
-  fixedWidth: 10,
+  fixedWidth: 160,
   label: 'A multiple select',
   name: 'myMultiSelect',
   options: [