open-vault/ui/stories/confirm-action.stories.js
Joshua Ogle 5c5a33f6df
UI: Add Toolbar to Storybook (#6761)
* Add Toolbar stories
* Update ConfirmAction story
2019-05-20 18:10:42 -06:00

45 lines
1.4 KiB
JavaScript

/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import { withKnobs, text, boolean } from '@storybook/addon-knobs';
import notes from './confirm-action.md';
storiesOf('ConfirmAction/', module)
.addParameters({ options: { showPanel: true } })
.addDecorator(
withKnobs({
escapeHTML: false,
})
)
.add(
`ConfirmAction`, () => ({
template: hbs`
<h5 class="title is-5">Confirm Action</h5>
<ConfirmAction
@buttonClasses={{buttonClasses}}
@confirmTitle={{confirmTitle}}
@confirmMessage={{confirmMessage}}
@confirmButtonText={{confirmButtonText}}
@cancelButtonText={{cancelButtonText}}
@disabled={{disabled}}
@onConfirmAction={{onComfirmAction}}
>
{{buttonText}}
</ConfirmAction>
`,
context: {
buttonText: text('buttonText', 'Delete'),
buttonClasses: text('buttonClasses', 'button'),
confirmTitle: text('confirmTitle', 'Delete this?'),
confirmMessage: text('confirmMessage', 'You will not be able to recover it later.'),
confirmButtonText: text('confirmButtonText', 'Delete'),
cancelButtonText: text('cancelButtonText', 'Cancel'),
disabled: boolean('disabled', false),
onComfirmAction: () => {
console.log('Action!');
},
},
}),
{ notes }
);