2020-11-03 14:09:39 +00:00
|
|
|
import { Meta, Story, Canvas } from '@storybook/addon-docs/blocks';
|
|
|
|
import { hbs } from 'ember-cli-htmlbars';
|
|
|
|
|
|
|
|
<Meta title="Components/Notice" component="Notice" />
|
|
|
|
|
|
|
|
# Notice
|
|
|
|
|
|
|
|
<Canvas>
|
2020-11-09 09:14:51 +00:00
|
|
|
<Story name="Basic"
|
|
|
|
argTypes={{
|
|
|
|
type: {
|
|
|
|
defaultValue: 'success',
|
|
|
|
control: {
|
|
|
|
type: 'select',
|
|
|
|
options: [
|
|
|
|
'success',
|
|
|
|
'warning',
|
|
|
|
'info',
|
|
|
|
'highlight',
|
|
|
|
]
|
|
|
|
}
|
|
|
|
}
|
|
|
|
}}
|
|
|
|
>{(args) => ({
|
2020-11-03 14:09:39 +00:00
|
|
|
template: hbs`<Notice
|
|
|
|
@type={{type}}
|
|
|
|
as |notice|>
|
|
|
|
<notice.Header>
|
|
|
|
<h3>Header</h3>
|
|
|
|
</notice.Header>
|
|
|
|
<notice.Body>
|
|
|
|
<p>
|
|
|
|
Body
|
|
|
|
</p>
|
|
|
|
</notice.Body>
|
|
|
|
<notice.Footer>
|
|
|
|
<p>
|
|
|
|
Footer
|
|
|
|
</p>
|
|
|
|
</notice.Footer>
|
|
|
|
</Notice>`,
|
2020-11-09 09:14:51 +00:00
|
|
|
context: args
|
|
|
|
})}
|
2020-11-03 14:09:39 +00:00
|
|
|
</Story>
|
|
|
|
</Canvas>
|
|
|
|
|