ra-core
Version:
Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React
42 lines • 1.32 kB
JavaScript
import * as React from 'react';
import { genericMemo } from "../../util/genericMemo.js";
import { useFieldValue } from "../../util/useFieldValue.js";
import { ListContextProvider, useList } from "../list/index.js";
/**
* Renders an embedded array of objects.
*
* ArrayFieldBase creates a ListContext with the field value, and renders its
* children components - usually iterator components.
*
* @example
* const PostShow = () => (
* <ShowBase>
* <ArrayFieldBase source="tags">
* <ul>
* <RecordsIterator
* render={record => <li key={record.id}>{record.name}</li>}
* />
* </ul>
* </ArrayFieldBase>
* </ShowBase>
* );
*
* @see useListContext
*/
const ArrayFieldBaseImpl = (props) => {
const { children, resource, perPage, sort, filter, exporter } = props;
const data = useFieldValue(props) || emptyArray;
const listContext = useList({
data,
resource,
perPage,
sort,
filter,
exporter,
});
return (React.createElement(ListContextProvider, { value: listContext }, children));
};
ArrayFieldBaseImpl.displayName = 'ArrayFieldBaseImpl';
export const ArrayFieldBase = genericMemo(ArrayFieldBaseImpl);
const emptyArray = [];
//# sourceMappingURL=ArrayFieldBase.js.map