Skip to content

Documentation - Getting started

Smart table is a set of directives providing an API specific to a group of operations that will change a part of the internal table state and spread the change through events a bit like Redux. The main directive is the table directive and is somehow the brain of the system to whom all other directives will report. You can check the directive documentation pages for more info and we therefore recommend you to start with the table directive.

Installation

You can install smart-table-core via its npm package running the command npm install --save smart-table-core. Then use one of the distribution files. They are packaged as UMD so they should work in any environment (browsers, nodejs, etc). Even better you can use the es6 module together with a module bundler such rollup to bundle/package your application the way you want.

import {smartTable} from 'smart-table-core';

// your data
const data = [
    {surname: 'Deubaze', name: 'Raymond'},
    {surname: 'Foo', name: 'Bar'},
    {surname: 'Doe', name: 'John'}
];

//you have now a smart collection !
const smartCollection = smartTable({data});

//print data anytime the state change
smartCollection.onDisplayChange((items) => {
    console.log(items.map(item => item.value));
});

//sort for example
smartCollection.sort({pointer: 'name', direction: 'desc'});
// > the sorted data should be printed in the console.

Checkout the CodePen for a live example