diff --git a/src/components/multi_select.js b/src/components/multi_select.js index 220473b..e0ec02e 100644 --- a/src/components/multi_select.js +++ b/src/components/multi_select.js @@ -18,6 +18,7 @@ export class MultiSelect extends PureComponent { onChange: PropTypes.func, showSearch: PropTypes.bool, showSelectAll: PropTypes.bool, + showSelectedItems: PropTypes.bool, searchIcon: PropTypes.string, deleteIcon: PropTypes.string, searchRenderer: PropTypes.func, @@ -34,6 +35,7 @@ export class MultiSelect extends PureComponent { messages: {}, showSearch: true, showSelectAll: true, + showSelectedItems: true, height: 400, itemHeight: 40, loaderRenderer: Loader @@ -59,6 +61,7 @@ export class MultiSelect extends PureComponent { height, itemHeight, showSelectAll, + showSelectedItems, itemRenderer, selectedItemRenderer, filteredItems, @@ -113,20 +116,21 @@ export class MultiSelect extends PureComponent { disabled={disabled} /> )} - {!loading && ( - - )} + {!loading && + showSelectedItems && ( + + )} ); } diff --git a/stories/multi-select.stories.js b/stories/multi-select.stories.js index d05d8ae..9e7359d 100644 --- a/stories/multi-select.stories.js +++ b/stories/multi-select.stories.js @@ -115,6 +115,18 @@ storiesOf("React Multi Select", module) /> ); }) + .add("Without Selected Items", () => { + return ( + + ); + }) .add("With custom components", () => { return ( `; +exports[`MultiSelect can remove selected items 1`] = ` +
+ +
+`; + exports[`MultiSelect custom itemRenderer 1`] = `
{ test("passes disabled if maxSelectedItem has passed", () => { const renderer = new ShallowRenderer(); - const tree = renderer.render(); + const tree = renderer.render( + + ); expect(tree).toMatchSnapshot(); }); test("does not pass disabled if maxSelectedItem has passed", () => { const renderer = new ShallowRenderer(); - const tree = renderer.render(); + const tree = renderer.render( + + ); expect(tree).toMatchSnapshot(); }); @@ -148,4 +152,10 @@ describe("MultiSelect", () => { ); expect(tree).toMatchSnapshot(); }); + + test("can remove selected items", () => { + const renderer = new ShallowRenderer(); + const tree = renderer.render(); + expect(tree).toMatchSnapshot(); + }); });