[docs] Replace use of e.g. with for example

CHANGELOG.md

@@ -4803,7 +4803,7 @@ Same changes as in `@mui/[email protected]`.
 
   The `useClearableField` hook API has been simplified to now take a `props` parameter instead of a `fieldProps`, `InputProps`, `clearable`, `onClear`, `slots` and `slotProps` parameters.
 
-  You should now be able to directly pass the returned value from your field hook (e.g: `useDateField`) to `useClearableField`
+  You should now be able to directly pass the returned value from your field hook (for example: `useDateField`) to `useClearableField`
 
   ```diff
    const fieldResponse = useDateField(props);

docs/data/date-pickers/adapters-locale/adapters-locale.md

@@ -143,32 +143,32 @@ For example, they don't support day of the year or quarter.
 Here is the list of the currently supported formats:
 
 - The year
-  - ✅ 2-digits values (e.g: `23`)
-  - ✅ 4-digits values (e.g: `2023`)
-  - ❌ Values with ordinal (e.g: `2023th`)
+  - ✅ 2-digits values (for example: `23`)
+  - ✅ 4-digits values (for example: `2023`)
+  - ❌ Values with ordinal (for example: `2023th`)
 - The month
 
-  - ✅ 1-based digit (e.g: `08`)
+  - ✅ 1-based digit (for example: `08`)
   - ✅ Multi-letter values (for example `Aug`, `August`)
-  - ❌ 1-letter values (e.g: `A`) because several months are represented with the same letter
+  - ❌ 1-letter values (for example: `A`) because several months are represented with the same letter
 
 - The day of the month
 
-  - ✅ 1-based digit values (e.g: `24`)
-  - ✅ 1-based digit values with ordinal (e.g: `24th`)
+  - ✅ 1-based digit values (for example: `24`)
+  - ✅ 1-based digit values with ordinal (for example: `24th`)
 
 - The day of the week
 
-  - ✅ 0-based digit values (e.g: `03`)
-  - ✅ 1-based digit values (e.g: `04`)
-  - ✅ Multi-letter values (e.g: `Tue`, `Tuesday`)
-  - ❌ 1-letter values (e.g: `T`) because several days of the week are represented with the same letter
+  - ✅ 0-based digit values (for example: `03`)
+  - ✅ 1-based digit values (for example: `04`)
+  - ✅ Multi-letter values (for example: `Tue`, `Tuesday`)
+  - ❌ 1-letter values (for example: `T`) because several days of the week are represented with the same letter
 
 - The hours
 
-  - ✅ 0-based 12-hours values (e.g: `03`)
-  - ✅ 0-based 24-hours values (e.g: `15`)
-  - ❌ 1-based values (e.g: `24` instead of `00`)
+  - ✅ 0-based 12-hours values (for example: `03`)
+  - ✅ 0-based 24-hours values (for example: `15`)
+  - ❌ 1-based values (for example: `24` instead of `00`)
 
 - The minutes
 
@@ -190,7 +190,7 @@ If you need to get the clean value from the input, you can remove this character
 :::
 
 :::warning
-Luxon is not able to respect the leading zeroes when using macro tokens (e.g: "DD"), so `shouldRespectLeadingZeros={true}` might lead to inconsistencies when using `AdapterLuxon`.
+Luxon is not able to respect the leading zeroes when using macro tokens (for example: "DD"), so `shouldRespectLeadingZeros={true}` might lead to inconsistencies when using `AdapterLuxon`.
 :::
 
 {{"demo": "RespectLeadingZerosFieldFormat.js"}}

docs/data/date-pickers/custom-opening-button/custom-opening-button.md

@@ -46,7 +46,7 @@ In the example below, the warning icon will be visible anytime the current value
 
 {{"demo": "AddWarningIconWhenInvalid.js"}}
 
-To add the same behavior to a picker that do not have an input adornment (e.g: Date Range Picker),
+To add the same behavior to a picker that do not have an input adornment (for example: Date Range Picker),
 you need to use the `textField` slot to add one:
 
 {{"demo": "AddWarningIconWhenInvalidRange.js"}}

docs/data/date-pickers/lifecycle/lifecycle.md

@@ -174,10 +174,10 @@ Take a look at the [dedicated section](/x/react-date-pickers/lifecycle/#lifecycl
 
 If the component is controlled (i.e: if it has a `value` prop),
 clicking on a value will call `onChange` if the value to publish is different from the current value
-(e.g: clicking on the already selected day in the `day` view will not call `onChange`).
+(for example: clicking on the already selected day in the `day` view will not call `onChange`).
 
 If the component is not controlled, the behavior is the same, except if no value has ever been published, in which case clicking on the current value will fire `onChange`
-(e.g: clicking on the already selected day in the `day` view will call `onChange` if `onChange` has never been called before).
+(for example: clicking on the already selected day in the `day` view will call `onChange` if `onChange` has never been called before).
 
 Some views can decide not to call `onChange` for some value modifications.
 The most common example is the mobile time views (using the [`TimeClock`](/x/react-date-pickers/time-clock/) component).

docs/data/migration/migration-pickers-v5/migration-pickers-v5.md

@@ -158,7 +158,7 @@ If you are using TypeScript, please make sure to add the [theme augmentation](/x
 
 The picker components no longer have a keyboard view to render the input inside the modal on mobile.
 
-- If your date is easier to edit with the keyboard (e.g: a birthdate), you can directly use the new field components:
+- If your date is easier to edit with the keyboard (for example: a birthdate), you can directly use the new field components:
 
   ```diff
    function App() {
@@ -444,8 +444,8 @@ The `locale` prop of the `LocalizationProvider` component have been renamed `ada
 
 ## Component slots / component slot props
 
-All the props used to pass props to parts of the UI (e.g: pass a prop to the input) have been replaced by component slot props.
-All the props used to override parts of the UI (e.g: pass a custom day renderer) have been replaced by component slots.
+All the props used to pass props to parts of the UI (for example: pass a prop to the input) have been replaced by component slot props.
+All the props used to override parts of the UI (for example: pass a custom day renderer) have been replaced by component slots.
 
 You can find more information about this pattern in the [Base UI documentation](https://mui.com/base-ui/getting-started/usage/#shared-props).
 

docs/data/migration/migration-pickers-v6/migration-pickers-v6.md

@@ -407,7 +407,7 @@ If you are using a multi input range field hook, the same applies to the ref in
 
 The `useClearableField` hook API has been simplified to now take a `props` parameter instead of a `fieldProps`, `InputProps`, `clearable`, `onClear`, `slots` and `slotProps` parameters.
 
-You should now be able to directly pass the returned value from your field hook (e.g: `useDateField`) to `useClearableField`
+You should now be able to directly pass the returned value from your field hook (for example: `useDateField`) to `useClearableField`
 
 ```diff
   const fieldResponse = useDateField(props);

docs/data/migration/migration-pickers-v7/migration-pickers-v7.md

@@ -83,7 +83,7 @@ Starting with version `v8.x`, all the field and picker components come with a ne
 ### Migrate `slotProps.field`
 
 When using `slotProps.field` to pass props to your field component,
-the field consumes some props (e.g: `shouldRespectLeadingZeros`) and forwards the rest to the `TextField`.
+the field consumes some props (for example: `shouldRespectLeadingZeros`) and forwards the rest to the `TextField`.
 
 - For the props consumed by the field, the behavior should remain exactly the same with both DOM structures.
 

docs/translations/api-docs/date-pickers/date-field/date-field.json

@@ -112,7 +112,7 @@
       }
     },
     "shouldRespectLeadingZeros": {
-      "description": "If <code>true</code>, the format will respect the leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
+      "description": "If <code>true</code>, the format will respect the leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (for example: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
     },
     "size": { "description": "The size of the component." },
     "slotProps": { "description": "The props used for each component slot." },

docs/translations/api-docs/date-pickers/date-time-field/date-time-field.json

@@ -137,7 +137,7 @@
       }
     },
     "shouldRespectLeadingZeros": {
-      "description": "If <code>true</code>, the format will respect the leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
+      "description": "If <code>true</code>, the format will respect the leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (for example: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
     },
     "size": { "description": "The size of the component." },
     "slotProps": { "description": "The props used for each component slot." },

docs/translations/api-docs/date-pickers/multi-input-date-range-field/multi-input-date-range-field.json

@@ -64,7 +64,7 @@
       }
     },
     "shouldRespectLeadingZeros": {
-      "description": "If <code>true</code>, the format will respect the leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
+      "description": "If <code>true</code>, the format will respect the leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (for example: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
     },
     "slotProps": { "description": "The props used for each component slot." },
     "slots": { "description": "Overridable component slots." },

docs/translations/api-docs/date-pickers/multi-input-date-time-range-field/multi-input-date-time-range-field.json

@@ -89,7 +89,7 @@
       }
     },
     "shouldRespectLeadingZeros": {
-      "description": "If <code>true</code>, the format will respect the leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (e.g: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (e.g: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
+      "description": "If <code>true</code>, the format will respect the leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>8/16/2018</code>) If <code>false</code>, the format will always add leading zeroes (for example: on dayjs, the format <code>M/D/YYYY</code> will render <code>08/16/2018</code>)<br>Warning n°1: Luxon is not able to respect the leading zeroes when using macro tokens (for example: &quot;DD&quot;), so <code>shouldRespectLeadingZeros={true}</code> might lead to inconsistencies when using <code>AdapterLuxon</code>.<br>Warning n°2: When <code>shouldRespectLeadingZeros={true}</code>, the field will add an invisible character on the sections containing a single digit to make sure <code>onChange</code> is fired. If you need to get the clean value from the input, you can remove this character using <code>input.value.replace(/\\u200e/g, &#39;&#39;)</code>.<br>Warning n°3: When used in strict mode, dayjs and moment require to respect the leading zeros. This mean that when using <code>shouldRespectLeadingZeros={false}</code>, if you retrieve the value directly from the input (not listening to <code>onChange</code>) and your format contains tokens without leading zeros, the value will not be parsed by your library."
     },
     "slotProps": { "description": "The props used for each component slot." },
     "slots": { "description": "Overridable component slots." },