diff options
author | 2018-08-07 10:54:17 +0300 | |
---|---|---|
committer | 2018-08-07 11:06:44 +0300 | |
commit | b2a3acea0d0f66028c9ce5fad02d4ecc64abf70c (patch) | |
tree | 8d70110f34cb845965c42a5915e950bca967d2c3 /stories/angular/checklist.stories.ts | |
parent | 05b37297177e8a342668c15e5d6f738b51f7aedd (diff) |
Initial commit.
Adding files needed for Linux Foundation.
Change-Id: I9f2b4851a5ae01f83800c7f8bab8608a2221c730
Issue-ID: SDC-1608
Signed-off-by: Israel Lavi <il0695@att.com>
Diffstat (limited to 'stories/angular/checklist.stories.ts')
-rw-r--r-- | stories/angular/checklist.stories.ts | 51 |
1 files changed, 51 insertions, 0 deletions
diff --git a/stories/angular/checklist.stories.ts b/stories/angular/checklist.stories.ts new file mode 100644 index 0000000..92e0ada --- /dev/null +++ b/stories/angular/checklist.stories.ts @@ -0,0 +1,51 @@ +import { storiesOf } from '@storybook/angular'; +import { withKnobs, text, number, boolean, array, select, color, date, button, object } from '@storybook/addon-knobs'; +import { withNotes } from '@storybook/addon-notes'; +import { action, configureActions } from '@storybook/addon-actions'; +import { moduleMetadata } from '@storybook/angular'; +import { ChecklistComponent, CheckboxComponent } from '../../src/angular/components'; +import { ChecklistModel, ChecklistItemModel } from '../../src/angular/common'; +import { RippleAnimationAction } from '../../src/angular/animations/ripple-click.animation.directive'; + +const checkListModelExample: ChecklistModel = new ChecklistModel([],[ + new ChecklistItemModel('apple'), + new ChecklistItemModel('banana'), + new ChecklistItemModel('orange') +]); + +storiesOf('Form elements|Checklist', module) + .addDecorator(withKnobs) + .addDecorator(withNotes) + .addDecorator( + moduleMetadata({ + declarations: [ + ChecklistComponent, + RippleAnimationAction, + CheckboxComponent + ], + imports: [ + ] + }) + ) + .add('Simple checklist', () => { + //const _checklistModel = object('checklistModel', checkListModelExample); + const _checkedChange = text('*(checkedChange)', 'Event throws when checklist changed, see in Action logger tab.'); + + return { + props: { + checkedChange: action('Checklist changed '), + checkListModelExample + }, + template: ` + <sdc-checklist + [checklistModel]="checkListModelExample"> + (checkedChange)="checkedChange($event)" + </sdc-checklist> + ` + } + }, + { notes: `<h2>Checklist</h2> + Full example of checklist. + Use the KNOBS tab to change values.` + } +) |