3.0.1 • Published 3 years ago
@billogram/foundation-list-data-provider v3.0.1
@billogram/foundation-list-data-provider
A React component for fetching list data
Install
yarn add @billogram/foundation-list-data-provider
Usage
import {
createListDataProvider,
} from '@billogram/foundation-list-data-provider';
See types for exported types.
createListDataProvider
Using FoundationListDataConsumer
and FoundationListDataProvider
.
import {
Data,
Options,
RowData,
} from './types';
const {
FoundationListDataConsumer,
FoundationListDataProvider,
} = createListDataProvider<RowData, Data, Options>();
function ListDataFetchingComponent() {
function fetchData(): Promise<FoundationListDataProviderFetchResult<RowData, Data>> {
return Promise.resolve({});
}
const initialFetchDataOptions: Options = {};
return (
<FoundationListDataProvider<RowData, Data, Options>
fetchData={ fetchData }
initialFetchDataOptions={ initialFetchDataOptions }>
<FoundationListDataConsumer<RowData, Data, Options>>
{ ({ fetchInitial, fetchMore, fetchSort, result, updateItem }) => (
<div>...</div>
) }
</FoundationListDataConsumer>
</FoundationListDataProvider>
);
}
Using FoundationListDataProsumer
.
import {
Data,
Options,
RowData,
} from './types';
const {
FoundationListDataProsumer,
} = createListDataProvider<RowData, Data, Options>();
function ListDataFetchingComponent() {
function fetchData(): Promise<FoundationListDataProviderFetchResult<RowData, Data>> {
return Promise.resolve({});
}
const initialFetchDataOptions: Options = {};
return (
<FoundationListDataProsumer<TRowData, Data, Options>
fetchData={ fetchData }
initialFetchDataOptions={ initialFetchDataOptions }>
{ ({ fetchInitial, fetchMore, fetchSort, result, updateItem }) => (
<div>...</div>
) }
</FoundationListDataProsumer>
);
}
Note
This library is being published with our use cases in mind and is not necessarily meant to be consumed by the broader public. We probably won't take your feature requests unless they align with our own needs.
License
MIT