Skip to content

Commit fe3c1f6

Browse files
slax57slax57
committed
Update the documentation for version 5.13.0
1 parent 3dcca7f commit fe3c1f6

File tree

972 files changed

+101510
-112
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

972 files changed

+101510
-112
lines changed

‎AutocompleteInput.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -70,7 +70,7 @@ The form value for the source must be the selected value, e.g.
7070
| `offline` | Optional | `ReactNode` | - | What to render when there is no network connectivity when fetching the choices |
7171
| `onChange` | Optional | `Function` | `-` | A function called with the new value, along with the selected record, when the input value changes |
7272
| `onCreate` | Optional | `Function` | `-` | A function called with the current filter value when users choose to create a new choice. |
73-
| `optionText` | Optional | `string` | `Function` | `Component` | `undefined` | `record Representation` | Field name of record to display in the suggestion item or function using the choice object as argument |
73+
| `optionText` | Optional | `function` | `ReactNode` | `undefined` | `record Representation` | Field name of record to display in the suggestion item or function using the choice object as argument |
7474
| `optionValue` | Optional | `string` | `id` | Field name of record containing the value to use as input value |
7575
| `setFilter` | Optional | `Function` | `null` | A callback to inform the `searchText` has changed and new `choices` can be retrieved based on this `searchText`. Signature `searchText => void`. This function is automatically set up when using `ReferenceInput`. |
7676
| `shouldRender Suggestions` | Optional | `Function` | `() => true` | A function that returns a `boolean` to determine whether or not suggestions are rendered. |

‎CheckForApplicationUpdate.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ export const App = () => (
4646
| --------------- | -------- | -------------- | ------------------ |-------------------------------------------------------------------- |
4747
| `interval` | Optional | `number` | `3600000` (1 hour) | The interval in milliseconds between two checks |
4848
| `disabled` | Optional | `boolean` | `false` | Whether the automatic check is disabled |
49-
| `notification` | Optional | `ReactElement` | | The notification to display to the user when an update is available |
49+
| `notification` | Optional | `ReactNode` | | The notification to display to the user when an update is available |
5050
| `onNewVersion Available` | Optional | `function` | | The effect to execute when a new version is detected. |
5151
| `url` | Optional | `string` | Current URL | The URL to download to check for code update |
5252
| `fetchOptions` | Optional | `RequestInit | undefined` | `undefined` | The options passed to `fetch` when checking for an update |

‎Create.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -71,7 +71,7 @@ You can customize the `<Create>` component using the following props:
7171
| `redirect` | Optional | `string`/`function` | `'edit'` | Change the redirect location after successful creation |
7272
| `resource` | Optional | `string` | From URL | Override the name of the resource to create |
7373
| `sx` | Optional | `object` | - | Override the styles |
74-
| `title` | Optional | `string`/`ReactNode` | Translation | Override the page title |
74+
| `title` | Optional | `ReactNode` / `string` / `false` | Translation | Override the page title |
7575
| `transform` | Optional | `function` | - | Transform the form data before calling `dataProvider.create()` |
7676

7777
`*` You must provide either `children` or `render`.

‎CreateReactAdmin.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ npm create react-admin@latest your-admin-name -- --interactive
5151
The command accepts the following options:
5252

5353
* `--interactive`: Enable the CLI interactive mode
54-
* `--data-provider`: Set the data provider to use ("data-fakerest", "data-simple-rest", "data-json-server", "supabase" or "none")
54+
* `--data-provider`: Set the data provider to use ("fakerest", "simple-rest", "json-server", "supabase" or "none")
5555
* `--auth-provider`: Set the auth provider to use ("local-auth-provider" or "none")
5656
* `--resource`: Add a resource that will be initialized with guessers (can be used multiple times). Set to "skip" to bypass the interactive resource step.
5757
* `--install`: Set the package manager to use for installing dependencies ("yarn", "npm", "bun" or "skip" to bypass the interactive install step)

‎Datagrid.md‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -50,13 +50,13 @@ Both are [Enterprise Edition](https://react-admin-ee.marmelab.com) components.
5050

5151
| Prop | Required | Type | Default | Description |
5252
| -------------------- | -------- | ----------------------- | --------------------- | ------------------------------------------------------------- |
53-
| `children` | Required | Element | n/a | The list of `<Field>` components to render as columns. |
54-
| `body` | Optional | Element | `<Datagrid Body>` | The component used to render the body of the table. |
55-
| `bulkActionButtons` | Optional | Element | `<BulkDelete Button>` | The component used to render the bulk action buttons. |
56-
| `empty` | Optional | Element | `<Empty>` | The component used to render the empty table. |
57-
| `expand` | Optional | Element | | The component used to render the expand panel for each row. |
53+
| `children` | Required | `ReactNode` | n/a | The list of `<Field>` components to render as columns. |
54+
| `body` | Optional | `ReactNode` | `<Datagrid Body>` | The component used to render the body of the table. |
55+
| `bulkActionButtons` | Optional | `ReactNode` | `<BulkDelete Button>` | The component used to render the bulk action buttons. |
56+
| `empty` | Optional | `ReactNode` | `<Empty>` | The component used to render the empty table. |
57+
| `expand` | Optional | `ReactNode` | | The component used to render the expand panel for each row. |
5858
| `expandSingle` | Optional | Boolean | `false` | Whether to allow only one expanded row at a time. |
59-
| `header` | Optional | Element | `<Datagrid Header>` | The component used to render the table header. |
59+
| `header` | Optional | `ReactNode` | `<Datagrid Header>` | The component used to render the table header. |
6060
| `hover` | Optional | Boolean | `true` | Whether to highlight the row under the mouse. |
6161
| `isRowExpandable` | Optional | Function | `() => true` | A function that returns whether a row is expandable. |
6262
| `isRowSelectable` | Optional | Function | `() => true` | A function that returns whether a row is selectable. |

‎Edit.md‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -84,7 +84,7 @@ You can customize the `<Edit>` component using the following props:
8484
| `redirect` | Optional | `'list'` &#124; `'show'` &#124; `false` &#124; `function` | `'list'` | Change the redirect location after successful update |
8585
| `resource` | Optional | `string` | - | Override the name of the resource to edit |
8686
| `sx` | Optional | `object` | - | Override the styles |
87-
| `title` | Optional | `string` &#124; `ReactNode` &#124; `false` | - | Override the page title |
87+
| `title` | Optional | `ReactNode` / `string` / `false` | - | Override the page title |
8888
| `redirectOnError` | Optional | `'list'` &#124; `false` &#124; `function` | `'list'` | The page to redirect to when an error occurs |
8989
| `transform` | Optional | `function` | - | Transform the form data before calling `dataProvider.update()` |
9090

‎EditDialog.md‎

Lines changed: 47 additions & 59 deletions
Original file line numberDiff line numberDiff line change
@@ -433,75 +433,63 @@ const sexChoices = [
433433
{ id: 'female', name: 'Female' },
434434
];
435435

436-
const CustomerForm = (props: any) => (
437-
<SimpleForm defaultValues={{ firstname: 'John', name: 'Doe' }} {...props}>
436+
const CustomerForm = () => (
437+
<SimpleForm>
438438
<TextInput source="first_name" validate={required()} />
439439
<TextInput source="last_name" validate={required()} />
440-
<DateInput source="dob" label="born" validate={required()} />
440+
<DateInput source="dob" label="Born" validate={required()} />
441441
<SelectInput source="sex" choices={sexChoices} />
442442
</SimpleForm>
443443
);
444444

445-
const EmployerSimpleFormWithFullyControlledDialogs = () => {
446-
const record = useRecordContext();
447-
448-
const [isEditDialogOpen, setIsEditDialogOpen] = useState(false);
449-
const openEditDialog = useCallback(() => {
450-
setIsEditDialogOpen(true);
445+
const EmployerEdit = () => {
446+
const [record, setRecord] = React.useState<any>(undefined);
447+
const closeDialog = React.useCallback(() => {
448+
setRecord(undefined);
451449
}, []);
452-
const closeEditDialog = useCallback(() => {
453-
setIsEditDialogOpen(false);
454-
}, []);
455-
456450
return (
457-
<SimpleForm>
458-
<TextInput source="name" validate={required()} />
459-
<TextInput source="address" validate={required()} />
460-
<TextInput source="city" validate={required()} />
461-
<ReferenceManyField
462-
label="Customers"
463-
reference="customers"
464-
target="employer_id"
465-
>
466-
<DataTable>
467-
<DataTable.Col source="id" />
468-
<DataTable.Col source="first_name" />
469-
<DataTable.Col source="last_name" />
470-
<DataTable.Col source="dob" label="born" field={DateField} />
471-
<DataTable.Col source="sex">
472-
<SelectField source="sex" choices={sexChoices} />
473-
</DataTable.Col>
474-
<DataTable.Col>
475-
<Button
476-
label="Edit customer"
477-
onClick={() => openEditDialog()}
478-
size="medium"
479-
variant="contained"
480-
sx={{ mb: 4 }}
481-
/>
482-
<DataTable.Col>
483-
</DataTable>
484-
</ReferenceManyField>
485-
<EditDialog
486-
fullWidth
487-
maxWidth="md"
488-
record={{ employer_id: record?.id }} // pre-populates the employer_id to link the new customer to the current employer
489-
isOpen={isEditDialogOpen}
490-
open={openEditDialog}
491-
close={closeEditDialog}
492-
resource="customers"
493-
>
494-
<CustomerForm />
495-
</EditDialog>
496-
</SimpleForm>
451+
<Edit>
452+
<SimpleForm>
453+
<TextInput source="name" validate={required()} />
454+
<TextInput source="address" validate={required()} />
455+
<TextInput source="city" validate={required()} />
456+
<ReferenceManyField
457+
label="Customers"
458+
reference="customers"
459+
target="employer_id"
460+
>
461+
<DataTable>
462+
<DataTable.Col source="id" />
463+
<DataTable.Col source="first_name" />
464+
<DataTable.Col source="last_name" />
465+
<DataTable.Col label="born">
466+
<DateField source="dob" label="Born" />
467+
</DataTable.Col>
468+
<DataTable.Col source="sex">
469+
<SelectField source="sex" choices={sexChoices} />
470+
</DataTable.Col>
471+
<DataTable.Col render={record => (
472+
<Button
473+
label="Edit customer"
474+
onClick={() => setRecord(record)}
475+
/>
476+
)} />
477+
</DataTable>
478+
</ReferenceManyField>
479+
<EditDialog
480+
record={record}
481+
resource="customers"
482+
isOpen={!!record}
483+
close={closeDialog}
484+
fullWidth
485+
maxWidth="md"
486+
>
487+
<CustomerForm />
488+
</EditDialog>
489+
</SimpleForm>
490+
</Edit>
497491
);
498492
};
499-
500-
const EmployerEdit = () => (
501-
<Edit>
502-
<EmployerSimpleFormWithFullyControlledDialogs />
503-
</Edit>
504-
);
505493
```
506494

507495
{% endraw %}

‎FilterList.md‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -77,7 +77,7 @@ A more sophisticated example is the filter sidebar for the visitors list visible
7777
|------|----------|------|---------|-------------|
7878
| [`children`](#children) | Required | node | | The children of `<FilterList>` must be a list of `<FilterListItem>` components. |
7979
| [`icon`](#icon) | Optional | element | | When set, the `<FilterList icon>` prop appears on the left side of the filter label. |
80-
| [`label`](#label) | Optional | string | | React-admin renders the `<FilterList label>` on top of the child filter items. The string is passed through the `useTranslate` hook, and therefore can be translated. |
80+
| [`label`](#label) | Optional | `ReactNode` | | React-admin renders the `<FilterList label>` on top of the child filter items. The string is passed through the `useTranslate` hook, and therefore can be translated. |
8181

8282
## `children`
8383

@@ -274,7 +274,7 @@ The children of `<FilterList>` must be a list of `<FilterListItem>` components.
274274

275275
| Prop | Required | Type | Default | Description |
276276
|------|----------|------|---------|-------------|
277-
| `label` | Required | string | | The label of the filter item. It is passed through the `useTranslate` hook, and therefore can be translated. |
277+
| `label` | Required | `ReactNode` | | The label of the filter item. It is passed through the `useTranslate` hook, and therefore can be translated. |
278278
| `value` | Required | object | | The value of the filter item. It is merged with the current filter value when enabled by the user. |
279279
| `icon` | Optional | `ReactElement` | | When set, the icon appears to the left of the item label. |
280280
| `isSelected` | Optional | function | | A function that receives the item value and the currently applied filters. It must return a boolean. |
@@ -372,4 +372,4 @@ export const BookList = () => (
372372

373373
![FilterLiveForm](./img/FilterLiveForm.png)
374374

375-
Check out the [`<FilterLiveForm>` documentation](./FilterLiveForm.md) for more information.
375+
Check out the [`<FilterLiveForm>` documentation](./FilterLiveForm.md) for more information.

0 commit comments

Comments
 (0)