ember-a11y-datatable

0.1.2 • Public • Published

ember-a11y-datatable

Build Status npm npm version MIT license EmberObserver

Example of an accessible data table addon in Ember.

Based on this article

Demo

Demo

Installation

  • ember install ember-a11y-datatable

Usage

In your templates/components use the ally-datatable component like this:

{{a11y-datatable
  caption="Monthly Budget"
  columns=columns
  rows=rows
}}
 

In your component/controller initialize the table data like this:

export default Controller.extend({
  columns: computed(function() {
    return [
      {
        label: 'Month',
        valuePath: 'month',
        rowHeader: true
      },
      {
        label: 'Amount Earned',
        valuePath: 'earned'
      },
      {
        label: 'Amount Spent',
        valuePath: 'spent'
      },
      {
        label: 'Amount Saved',
        valuePath: 'saved'
      }
    ];
  }),
 
  rows: computed(function() {
    return [
      {
        month: "January",
        earned: "$2500",
        spent: "$1500",
        saved: "500"
      },
      {
        month: "February",
        earned: "$2500",
        spent: "$1500",
        saved: "500"
      }
    ];
  })
});
 

Running Tests

  • npm test (Runs ember try:each to test your addon against multiple Ember versions)
  • ember test
  • ember test --server

Building

  • ember build

For more information on using ember-cli, visit https://ember-cli.com/.

Package Sidebar

Install

npm i ember-a11y-datatable

Weekly Downloads

3

Version

0.1.2

License

MIT

Unpacked Size

402 kB

Total Files

12

Last publish

Collaborators

  • rajasegar