diff options
author | Israel Lavi <il0695@att.com> | 2018-08-07 10:54:17 +0300 |
---|---|---|
committer | Israel Lavi <il0695@att.com> | 2018-08-07 11:06:44 +0300 |
commit | b2a3acea0d0f66028c9ce5fad02d4ecc64abf70c (patch) | |
tree | 8d70110f34cb845965c42a5915e950bca967d2c3 /stories/angular/checkbox.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/checkbox.stories.ts')
-rw-r--r-- | stories/angular/checkbox.stories.ts | 50 |
1 files changed, 50 insertions, 0 deletions
diff --git a/stories/angular/checkbox.stories.ts b/stories/angular/checkbox.stories.ts new file mode 100644 index 0000000..c02e2e2 --- /dev/null +++ b/stories/angular/checkbox.stories.ts @@ -0,0 +1,50 @@ +import { storiesOf } from '@storybook/angular'; +import { withKnobs, text, number, boolean, array, select, color, date, button } from '@storybook/addon-knobs'; +import { withNotes } from '@storybook/addon-notes'; +import { action, configureActions } from '@storybook/addon-actions'; +import { moduleMetadata } from '@storybook/angular'; +import { CheckboxComponent } from '../../src/angular/components'; +import { RippleClickAnimationDirective } from '../../src/angular/animations/ripple-click.animation.directive'; + +storiesOf('Form elements|Checkbox', module) + .addDecorator(withKnobs) + .addDecorator(withNotes) + .addDecorator( + moduleMetadata({ + declarations: [ + CheckboxComponent, + RippleClickAnimationDirective + ], + imports: [ + ] + }) + ) + .add('Simple checkbox', () => { + const _label = text('label', 'Simple checkbox'); + const _checked = boolean('checked', false); + const _disabled = boolean('disabled', false); + const _testId = text('testId', 'smalpe-test-id'); + const _checkedChange = text('*(checkedChange)', 'Event throws when checked changed, see in Action logger tab.'); + + return { + props: { + checkedChange: action('Checkbox value changed '), + _label, _checked, _disabled, _testId + }, + template: ` + <sdc-checkbox + [label]="_label" + [checked]="_checked" + [disabled]="_disabled" + [testId]="_testId" + (checkedChange)="checkedChange($event)" + > + </sdc-checkbox> + ` + } + }, + { notes: `<h2>Checkbox</h2> + Full example of checkbox. + Use the KNOBS tab to change values.` + } +) |