# list_lazy_loader

> Controls how the items in a list is loaded

Latest version **1.0.7** (published 2019-07-26) · ISC license · 0 weekly downloads

## Install

```sh
npm install list_lazy_loader
pnpm add list_lazy_loader
yarn add list_lazy_loader
bun add list_lazy_loader
```

## Health

**Score 25/100 (F)** — status: abandoned.

Positive: has types; no vulnerabilities; high quality score.

Warnings: low downloads; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.7 |
| Published | 2019-07-26 |
| First published | 2019-07-26 |
| Weekly downloads | 0 |
| License | ISC |
| TypeScript types | bundled |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 12.3 KB |
| Known vulnerabilities | 0 |
| Install scripts | no |
| Author | Tan Vee Han |
| Maintainers | veehan |

## Links

- npm: https://www.npmjs.com/package/list_lazy_loader
- npm.io page: https://npm.io/package/list_lazy_loader

## Dependencies (1)

- [property-watch-decorator](https://npm.io/package/property-watch-decorator.md) ^1.2.5

## Recent versions

- 1.0.7 (latest) — 2019-07-26
- 1.0.6 — 2019-07-26
- 1.0.5 — 2019-07-26
- 1.0.4 — 2019-07-26
- 1.0.3 — 2019-07-26
- 1.0.2 — 2019-07-26
- 1.0.1 — 2019-07-26
- 1.0.0 — 2019-07-26

## README

# ListLazyLoader
- To manage how items in a list is loaded.
- run `ts-node example/index.ts` to try in nodejs (PowerShell).

# Remarks
- Currently focus in typescript's support, will try to finish support's in pure js.
- examples are a bit messy. but will try my best to update them ASAP.

# Usage
```
import { ListLoader, ListLoaderInterface } from 'ListLazyLoader';
const theList: ListLoaderInterface<ListItem> = new ListLoader<ListItem>(
  setting,
  listLoadFunction,
  eventEmitter
);
```
### Parameters in constructor
##### setting

| property | default value | description |
| --- | --- | --- |
| maxInView_init | 10 | max length of list when first loaded |
| increaseSize | 10 | length of list to increase for each loadMore |
| loadMoreFromExternal | true | load more from `listLoadFunction` |
| listUpdateAlgorithm | "directAppend" | refer to [listUpdateAlgorithm](#listUpdateAlgorithm) |
| loadMoreRetryInterval | 1000 | retry to load more after this time interval if unable to load more |
| events | EventObject | refer to [EventObject](#EventObject) |

<h7 id="listUpdateAlgorithm"> listUpdateAlgorithm

- autoMerge: will filter the list to ensure no duplicated data in the list.
- directAppend: will directly append the list at the end
- override: will override the list

<h7 id="EventObject"> EventObject

| property | value | description |
| --- | --- | --- |
| loading | "loading" | when the liast is loading |
| endOfList | "endOfList" | when no more item is loaded from `listLoadFunction` |
| listUpdated | "listUpdated" | whenever the list to preview is updated |
| fullListUpdated | "fullListUpdated" | whenever the full list is updated |

##### listLoadFunction
- function to load more item to append into the list
- `() => Promise<ListItem[]|void>`
- ListItem is the type of a single item

##### eventEmitter
- function to fire event when properties in [EventObject](#EventObject) changes
- leave it as undefined to disable this functionality
- `(eventName: string, details?: any) => void`

### Methods
- `theList.loadMore();` loads more items into the list;
- `theList.resetList();` resets the list to initial state.

---
_Source: https://npm.io/package/list_lazy_loader · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._
