instantdb-react-ui/dist/list/list.d.ts

Customizable react components for InstantDB (forms/lists/etc.)

import { InstantReactWebDatabase } from '@instantdb/react';
import { ReactNode } from 'react';
import { ExtractIDBEntityType, IDBEntityType, IDBQueryType, IDBSchemaType } from '../form/use-idb-form';
interface BaseListProps<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> {
    schema: TSchema;
    db: InstantReactWebDatabase<any>;
    entity: TEntity;
    query?: TQuery;
    render: (item: ExtractIDBEntityType<TSchema, TEntity, TQuery>, id: string) => ReactNode;
    skeleton?: ReactNode;
    noResults?: ReactNode;
}
type NormalListProps<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> = BaseListProps<TSchema, TEntity, TQuery> & {
    mode?: 'normal';
};
type InfiniteListProps<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> = BaseListProps<TSchema, TEntity, TQuery> & {
    mode: 'infinite';
    pageSize?: number;
};
type PaginatedListProps<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> = BaseListProps<TSchema, TEntity, TQuery> & {
    mode: 'paginated';
    pagination: PaginationState<TSchema, TEntity, TQuery>;
};
export type IDBListProps<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> = NormalListProps<TSchema, TEntity, TQuery> | InfiniteListProps<TSchema, TEntity, TQuery> | PaginatedListProps<TSchema, TEntity, TQuery>;
interface PaginationOptions<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> {
    query?: TQuery;
    model: TEntity;
    pageSize?: number;
    schema: TSchema;
    db: InstantReactWebDatabase<TSchema>;
}
interface PaginationState<TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>> extends PaginationOptions<TSchema, TEntity, TQuery> {
    items: ExtractIDBEntityType<TSchema, TEntity, TQuery>[];
    page: number;
    totalPages: number;
    totalItems: number;
    goToPage: (page: number) => void;
}
/** Hook to get pagination state for a paginated list */
export declare const useIDBPagination: <TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>>(props: PaginationOptions<TSchema, TEntity, TQuery>) => PaginationState<TSchema, TEntity, TQuery>;
/** instantdb-react-ui list component, with support for normal, infinite, and paginated modes */
export declare const IDBList: <TSchema extends IDBSchemaType, TEntity extends IDBEntityType<TSchema>, TQuery extends IDBQueryType<TSchema>>(props: IDBListProps<TSchema, TEntity, TQuery>) => import("react/jsx-runtime").JSX.Element;
export {};
//# sourceMappingURL=list.d.ts.map