A container for infinite scrolling.

Install

npm install @fluid-topics/ft-infinite-scroll
yarn add @fluid-topics/ft-infinite-scroll

Usage

Lit

import { html } from "lit"
import "@fluid-topics/ft-infinite-scroll"
import { VisibleItemsChangeEvent } from "@fluid-topics/ft-infinite-scroll"

interface Model {
    ...
}

function render() {
    const data: Array<Model> = [ ... ]
    return html`
        <ft-infinite-scroll
                .items=${ data }
                .renderItems=${ (item: Model) => html`<div>${ item.title }</div>` }
                .scrollToIndex=${ 3 }
                @visible-items-change=${ (e: VisibleItemsChangeEvent<Model>) => console.log(e.detail.visibleItems) }
        />
    `
}