Package Exports

selectabular

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (selectabular) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Selectabular - Selection utilities

Common functionalities when dealing with table rows.

(De)-Selecting
Filtering
Toggling

API

`select.all(rows)`

Returns:

rows array where each row has a .selected=true attribute

`select.none(rows)`

Returns:

rows array where each row has a .selected=false attribute

`select.rows(filter)(rows)`

Given a filter, it will select the matching rows and return them

const initRows = [
  { id: 10, selected: true, product: 'apple', company: 'Apple Inc', price: 1.5, stock: 300 },
  { id: 11, product: 'pear', company: 'Pear Inc', price: 3, stock: 1000 },
  { id: 12, product: 'grape', company: 'Grapesoft', price: 22.1, stock: 18 },
  { id: 13, product: 'banana', company: 'Banana Tech', price: 12, stock: 9 }
];
const myfilter = row => row.price > 5
const {rows, selectedRows: result } = selectabular.rows(myfilter)(initRows);
>> result
[
  { id: 12,  product: 'grape', company: 'Grapesoft', price: 22.1, stock: 18 },
  { id: 13,  product: 'banana', company: 'Banana Tech', price: 12, stock: 9 }
];
>> rows
[
  { id: 10, selected: true, product: 'apple', company: 'Apple Inc', price: 1.5, stock: 300 },
  { id: 11, product: 'pear', company: 'Pear Inc', price: 3, stock: 1000 },
  { id: 12, selected: true, product: 'grape', company: 'Grapesoft', price: 22.1, stock: 18 },
  { id: 13, selected: true, product: 'banana', company: 'Banana Tech', price: 12, stock: 9 }
];

Returns:

rows: original rows, where each row's .selected is set to true if it matches the filter.
selectedRows: array containing only those rows matching the filter.

Notes:

rows does not toggle the rows that do not match the filter; please use select.none a priori for that.
As shown in the example, rows, and selectedRows are internal variable names, used in the implementation; which can be easily renamed inline (See example where selectedRows is renamed to result)

`select.toggle(filter)(rows)`

Returns:

Input rows where each filter-matching row is toggled its selected attribute.

const initRows = [
  { id: 10, selected: false, product: 'apple', company: 'Apple Inc', price: 1.5, stock: 300 },
  { id: 11, selected: true, product: 'pear', company: 'Pear Inc', price: 3, stock: 1000 },
  { id: 12, product: 'grape', company: 'Grapesoft', price: 22.1, stock: 18 },
  { id: 13, product: 'banana', company: 'Banana Tech', price: 12, stock: 9 }
];
const filter = row => row.id < 12
const result = selectabular.toggle(filter)(initRows);
 >> result
[
  { id: 10, selected: true, product: 'apple', company: 'Apple Inc', price: 1.5, stock: 300 },
  { id: 11, selected: false, product: 'pear', company: 'Pear Inc', price: 3, stock: 1000 },
  { id: 12, product: 'grape', company: 'Grapesoft', price: 22.1, stock: 18 },
  { id: 13, product: 'banana', company: 'Banana Tech', price: 12, stock: 9 }
];

License

MIT. See LICENSE for details.