@solid-primitives/list


Package providing additional way to manage arrays. Alternative to and that has reactive item value and reactive index. Focuses on avoiding recreation of mapped elements.

List - Component that provides reactive item value and reactive index.
listArray - Underlying helper for unkeyed control flow, similar to mapArray and indexArray.

Installation

``bash
npm install @solid-primitives/list


or

yarn add @solid-primitives/list

or

pnpm add @solid-primitives/list
`

List

Example:

`tsx
function Component() {
const [signal, setSignal] = createSignal([1, 2, 3]);

return (

{(value, index) => {
return (



);
}}

);
}
`

Component similar to and , but provides reactive item value and reactive index.

Every element is keyed by item reference and index, but item reference is prioritized. That means whenever element changes it's position in array, it's index signal will be updated and if element value is changed, it's value signal will be updated.

listArray

Underlying helper for ` unkeyed control flow. Returns array with elements mapped using provided mapping function.

Mapping function may use provided reactive value and reactive index. Mapping function is ran only when original array has more elements than before. Elements are disposed only if original array has less elements than before.

Demo

You can see the list in action in the following sandbox: https://primitives.solidjs.community/playground/list/

Changelog

See CHANGELOG.md