43f4c5532d
* use ember-power-select-with-create instead of ember-power-select * add custom Add message to clarify whether you need a name or ID * add search-select to storybook * add wormhole div for ember-basic-dropdown * add search-select to storybook * make sure knobs are working * remove unused code
36 lines
1.2 KiB
JavaScript
36 lines
1.2 KiB
JavaScript
/* eslint-disable import/extensions */
|
|
import hbs from 'htmlbars-inline-precompile';
|
|
import { storiesOf } from '@storybook/ember';
|
|
import notes from './search-select.md';
|
|
import { withKnobs, text, select } from '@storybook/addon-knobs';
|
|
|
|
const onChange = (value) => alert(`New value is "${value}"`);
|
|
const models = ["identity/groups"];
|
|
|
|
storiesOf('SearchSelect/', module)
|
|
.addParameters({ options: { showPanel: true } })
|
|
.addDecorator(withKnobs({ escapeHTML: false }))
|
|
.add(`SearchSelect`, () => ({
|
|
template: hbs`
|
|
<h5 class="title is-5">Search Select</h5>
|
|
<SearchSelect
|
|
@id="groups"
|
|
@models={{models}}
|
|
@onChange={{onChange}}
|
|
@inputValue={{inputValue}}
|
|
@label={{label}}
|
|
@fallbackComponent="string-list"
|
|
@staticOptions={{staticOptions}}/>
|
|
`,
|
|
context: {
|
|
label: text("Label", "Group IDs"),
|
|
helpText: text("Help Tooltip Text", "Group IDs to associate with this entity"),
|
|
inputValue: [],
|
|
models: models,
|
|
onChange: onChange,
|
|
staticOptions: [{ name: "my-group", id: "123dsafdsarf" }, { name: "my-other-group", id: "45ssadd435" }, { name: "example-1", id: "5678" }, { name: "group-2", id: "gro09283" }],
|
|
},
|
|
}),
|
|
{ notes }
|
|
);
|