A list of arrays with predefined max lengths. Add to the list and items flow into sections.
npm install --save sectioned-list
-
new constructor(config)
Create a new instance with a config object. -
addItem(<any>)
Adds an item to the next section that has space for it. -
addItems(Array<any>)
Adds the items to the list by callingaddItem()
for each item in order. -
sections
Get all sections in the list. A section's items can be accessed via itsitems
field. You can also access a section'sindex
in the list andsize
, the number of fields it has, fields. -
sectionedItems
Get an array of the items in the list in their section arrays. The returned value looks like this:Array<Array<any>>
-
addSectionSize
Add a section size specification to the list. There is no way to remove a section size specification.
There may be other public fields you can access, but they are not necessary, so we've omitted them here.
See the tests (tests/sectionedList_test.js
) to see how these methods are used.
When creating an instance, you can specify an optional configuration object with the following fields:
sectionSizes
You can specify an array of numbers to define the max size of your sections. If you don't specify this, it will default to [10]
, which will give all your sections a max size of 10.
Say you provide the following array of section sizes: [3, 5, 10]
. As you add items to the list, it will first create a section with the first 3 items, then another section with the next 5 items, and subsequent items will create subsequent sections of max-10 items. So, if you have 34 items to add to your sectioned list, the sections would look like this:
- 3 items
- 5 items
- 10 items
- 10 items
- 6 items
You can even specify empty sections by doing something like this: [3, 5, 0, 10, 0, 20]
. 0
indicates an empty section.
Why would you do this? Perhaps you're using your sectioned list to display the items of the sections on a web page and want to use the empty sections to display advertisements.
So if you specify [3, 5, 0, 10, 0, 20]
for your section sizes and use the empty sections to show advertisements, the web page would look something like this with 55 items:
- 3 items
- 5 items
- An advertisement
- 10 items
- Another advertisement
- 20 items
- 17 items
Note that if your last section size is empty, any subsequent sections will default to a max size of 10.
We use mocha and chai. Run npm test
Feel free to open a pull request!
Created by Lincoln W Daniel.