docs: address PR feedback on DataTableInput references

Author: WiXSL

docs/Inputs.md

@@ -77,10 +77,10 @@ React-admin provides a set of Input components, each one designed for a specific
 | Object                | `{ foo: 'bar' }`                                             | All inputs (see [ `source`](#source))                                                                                                                                                                                                           |
 | Enum                  | `'foo'`                                                      | [`<SelectInput>`](./SelectInput.md), [`<AutocompleteInput>`](./AutocompleteInput.md), [`<RadioButtonGroupInput>`](./RadioButtonGroupInput.md), [`<DataTableInput>`](./DataTableInput.md)<img class="icon" src="./img/premium.svg" alt="React Admin Enterprise Edition icon" /> |
 | Tree node             | `42`                                                         | [`<TreeInput>`](./TreeInput.md)                                                                                                                                                                                                                 |
-| Foreign key           | `42`                                                         | [`<ReferenceInput>`](./ReferenceInput.md), [`<DataTableInput>`](./DataTableInput.md)<img class="icon" src="./img/premium.svg" alt="React Admin Enterprise Edition icon" /> |
+| Foreign key           | `42`                                                         | [`<ReferenceInput>`](./ReferenceInput.md)                                                                                                                                                                                                       |
 | Array of objects      | `[{ item: 'jeans', qty: 3 }, { item: 'shirt', qty: 1 }]`     | [`<ArrayInput>`](./ArrayInput.md)                                                                                                                                                                                                               |
 | Array of Enums        | `['foo', 'bar']`                                             | [`<TextArrayInput>`](./TextArrayInput.md), [`<SelectArrayInput>`](./SelectArrayInput.md), [`<AutocompleteArrayInput>`](./AutocompleteArrayInput.md), [`<CheckboxGroupInput>`](./CheckboxGroupInput.md), [`<DualListInput>`](./DualListInput.md) |
-| Array of foreign keys | `[42, 43]`                                                   | [`<ReferenceArrayInput>`](./ReferenceArrayInput.md), [`<DataTableInput>`](./DataTableInput.md)<img class="icon" src="./img/premium.svg" alt="React Admin Enterprise Edition icon" /> |
+| Array of foreign keys | `[42, 43]`                                                   | [`<ReferenceArrayInput>`](./ReferenceArrayInput.md)                                                                                                                                                                                             |
 | Translations          | `{ en: 'Hello', fr: 'Bonjour' }`                             | [`<TranslatableInputs>`](./TranslatableInputs.md)                                                                                                                                                                                               |
 | Related records       | `[{ id: 42, title: 'Hello' }, { id: 43, title: 'World' }]`   | [`<ReferenceManyInput>`](./ReferenceManyInput.md), [`<ReferenceManyToManyInput>`](./ReferenceManyToManyInput.md), [`<ReferenceNodeInput>`](./ReferenceNodeInput.md), [`<ReferenceOneInput>`](./ReferenceOneInput.md)                            |
 

docs/ReferenceArrayInput.md

@@ -145,6 +145,8 @@ import { ReferenceArrayInput, SelectInput } from 'react-admin';
 </ReferenceArrayInput>
 ```
 
+When your users need to compare several columns before selecting related records, you can use `<DataTableInput>` as child:
+
 ```jsx
 import { DataTableInput } from '@react-admin/ra-form-layout';
 import { DataTable, ReferenceArrayInput } from 'react-admin';
@@ -159,6 +161,8 @@ import { DataTable, ReferenceArrayInput } from 'react-admin';
 </ReferenceArrayInput>
 ```
 
+![DataTableInput in ReferenceArrayInput](./img/reference-array-input-datatable-input-dialog.png)
+
 You can even use a component of your own as child, provided it detects a `ChoicesContext` is available and gets their choices from it.
 
 The choices context value can be accessed with the [`useChoicesContext`](./useChoicesContext.md) hook.

docs/ReferenceInput.md

@@ -158,6 +158,8 @@ import { DataTable, ReferenceInput } from 'react-admin';
 </ReferenceInput>
 ```
 
+![DataTableInput in ReferenceInput](./img/reference-input-datatable-input-dialog.png)
+
 You can even use a component of your own as child, provided it detects a `ChoicesContext` is available and gets their choices from it.
 
 The choices context value can be accessed with the [`useChoicesContext`](./useChoicesContext.md) hook.