/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import notes from './ttl-picker.md';
storiesOf('TtlPicker/', module)
.addParameters({ options: { showPanel: false } })
.add(`TtlPicker`, () => ({
template: hbs`
<h5 class="title is-5">Ttl Picker</h5>
<TtlPicker />
`,
}),
{notes}
);
/* 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'),
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import { action } from '@storybook/addon-actions';
storiesOf('Addon|Actions', module)
.addParameters({
options: {
selectedPanel: 'storybook/actions/panel',
},
})
.add('button', () => ({
template: hbs`<button {{action onClick}}>Click Me</button>`,
context: {
onClick: action('clicked'),
},
}));
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import { withKnobs, text, color } from '@storybook/addon-knobs';
import { action } from '@storybook/addon-actions';
storiesOf('Addon|Knobs', module)
.addDecorator(withKnobs)
.addParameters({ options: { selectedPanel: 'storybooks/knobs/panel' } })
.add('with text', () => ({
template: hbs`
{{welcome-banner
backgroundColor=backgroundColor
titleColor=titleColor
subTitleColor=subTitleColor
title=title
subtitle=subtitle
click=(action onClick)
}}
`,
context: {
backgroundColor: color('backgroundColor', '#FDF4E7'),
titleColor: color('titleColor', '#DF4D37'),
subTitleColor: color('subTitleColor', '#B8854F'),
title: text('title', 'Welcome to storybook'),
subtitle: text('subtitle', 'This environment is completely editable'),
onClick: action('clicked'),
},
}));
/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import { withKnobs, text } from '@storybook/addon-knobs';
import notes from './toolbar-download-button.md';
storiesOf('Toolbar/', module)
.addParameters({ options: { showPanel: true } })
.addDecorator(withKnobs())
.add(`ToolbarDownloadButton`,() => ({
template: hbs`
<h5 class="title is-5">ToolbarLink</h5>
<div style="width: 400px;">
<Toolbar>
<ToolbarActions>
<ToolbarDownloadButton
@actionText={{label}}
/>
</ToolbarActions>
</Toolbar>
</div>
`,
context: {
label: text('Button text', 'Download policy'),
},
}),
{notes}
);
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
storiesOf('Addon|Notes', module)
.add(
'Simple note',
() => ({
template: hbs`<p><strong>Etiam vulputate elit eu venenatis eleifend. Duis nec lectus augue. Morbi egestas diam sed vulputate mollis. Fusce egestas pretium vehicula. Integer sed neque diam. Donec consectetur velit vitae enim varius, ut placerat arcu imperdiet. Praesent sed faucibus arcu. Nullam sit amet nibh a enim eleifend rhoncus. Donec pretium elementum leo at fermentum. Nulla sollicitudin, mauris quis semper tempus, sem metus tristique diam, efficitur pulvinar mi urna id urna.</strong></p>`,
}),
{ notes: 'My notes on some bold text' }
)
.add(
'Note with HTML',
() => ({
template: hbs`<p>🤔😳😯😮<br/>😄😩😓😱<br/>🤓😑😶😊</p>`,
}),
{
notes: `
<h2>My notes on emojies</h2>
<em>It's not all that important to be honest, but..</em>
Emojis are great, I love emojis, in fact I like using them in my Component notes too! 😇
`,
}
);
AWS: 'aws/client',
Azure: 'azure',
Cert: 'cert',
GCP: 'gcp',
Github: 'github',
JWT: 'jwt',
Kubernetes: 'kubernetes',
LDAP: 'ldap',
OKTA: 'okta',
Radius: 'radius',
Userpass: '******',
};
const DEFAULT_VALUE = 'aws/client';
storiesOf('AuthConfigForm/Options/', module)
.addParameters({ options: { showPanel: true } })
.addDecorator(withKnobs())
.add(
`Options`,
() => ({
template: hbs`
<h5 class="title is-5">Options</h5>
{{auth-config-form/options (compute (action 'getModel' model))}}
`,
context: {
actions: {
getModel(modelType) {
return Ember.getOwner(this)
.lookup('service:store')
.createRecord(`auth-config/${modelType}`);
/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import notes from './i-con.md';
import { GLYPHS_WITH_SVG_TAG } from '../app/components/i-con.js';
storiesOf('ICon/', module)
.addParameters({ options: { showPanel: false } })
.add(
'ICon',
() => ({
template: hbs`
<table class="table">
<thead>
<tr>
<th>Glyph title</th>
<th>Glyph</th>
</tr>
</thead>
<tbody>
{{#each types as |type|}}
<tr>
<td>
<h5>{{humanize type}}</h5>
</td>
<td>
<ICon @glyph={{type}} />
</td>
</tr>
{{/each}}
</tbody>
/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import notes from './alert-popup.md';
import { MESSAGE_TYPES } from '../lib/core/addon/helpers/message-types.js';
storiesOf('Alerts/AlertPopup/', module)
.addParameters({ options: { showPanel: false } })
.add(
`AlertPopup`,
() => ({
template: hbs`
{{#each types as |type|}}
<h5 class="title is-5">{{humanize type}}</h5>
<AlertPopup
@type={{message-types type}}
@message={{message}}
@close={{close}}/>
{{/each}}
`,
context: {
close: () => {
console.log('closing!');
},
types: Object.keys(MESSAGE_TYPES),
message: 'Hello!',
},
}),
{ notes }
);
/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import notes from './form-field.md';
import EmberObject from '@ember/object';
const createAttr = (name, type, options) => {
return {
name,
type,
options,
};
};
storiesOf('Form/FormField/', module)
.add(
`FormField|string`,
() => ({
template: hbs`
<h5 class="title is-5">String Form Field</h5>
<FormField @attr={{attr}} @model={{model}}/>
`,
context: {
attr: createAttr('foo', 'string', { defaultValue: 'default' }),
model: EmberObject.create({}),
},
}),
{ notes }
)
.add(
`FormField|boolean`,
/* eslint-disable import/extensions */
import hbs from 'htmlbars-inline-precompile';
import { storiesOf } from '@storybook/ember';
import notes from './popup-menu.md';
storiesOf('PopupMenu/', module)
.addParameters({ options: { showPanel: true } })
.add(`PopupMenu`, () => ({
template: hbs`
<h5 class="title is-5">Popup Menu</h5>
<PopupMenu>
<nav class="menu">
<ul class="menu-list">
<li class="action">
<button type="button" class="button link">
Popup content goes here!
</button>
</li>
</ul>
</nav>
</PopupMenu>
`,
context: {},
}),
{notes}
);