ember-paper-tabs []
This is an ember-paper addon that provides an implementation of material tabs.
Usage
An exemple usage:
{{#paper-tabs as |tabs|}} {{#tabs.tab label="Tab 1"}} Content 1 {{/tabs.tab}} {{#tabs.tab as |tab|}} {{#tab.label}} Tab 1 {{/tab.label}} {{#tab.content}} Content 2 {{/tab.content}} {{/tabs.tab}} {{/paper-tabs}}
https://cogniteev.github.io/ember-paper-tabs/
You can see how this addon looks like atInstallation
ember install ember-paper-tabs
Don't forget to import your styles in your app.scss
after importing ember paper styles:
;;
API
{{#paper-tabs as |tabs|}}
dynamicHeight
- defaults tofalse
- sets the paper-tabs height to the active tab's height.alignTabs
- defaults totop
- sets tabs position, values aretop
|bottom
.borderBottom
- defaults tofalse
- displays a border underneath the tabs.noInk
- defaults tofalse
- disables ripple effects upon click.noInkBar
- defaults tofalse
- displays a bar underneath active tabs.centerTabs
- defaults tofalse
- tabs takes all the width.stretchTabs
- defaults toauto
- values arealways
|never
|auto
.autoSelect
- defaults tofalse
- automatically open newly added tab.
{{#paper-tab as |tab|}}
disabled
- defaults tofalse
.onSelect
- a function called when tab is selected.onDeselect
- a function called when tab is deselected.
Running
ember serve
- Visit your app at http://localhost:4200.
Running Tests
npm test
(Runsember 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/.