diff --git a/README.md b/README.md index 46b3002..240c082 100644 --- a/README.md +++ b/README.md @@ -248,15 +248,12 @@ btnStyle | One of:
'default'
'primary'
'emphasis'
'flat'
'li noCaret | boolean | false | Whether to prevent a caret from being rendered next to the title. title | node | | Title content. disabled | boolean | false | Whether or not component is disabled. -open | boolean | false | Whether or not the dropdown is visible. #### DropdownMenu Name | Type | Default | Description :--- | :--- | :------ | :---------- componentClass | element | ul | A custom element for this component. -open | boolean | false | Whether or not the dropdown is visible. -pullRight | boolean | false | Align the menu to the right side of the dropdown toggle. onClose | function(event) | | A callback fired when the dropdown menu closes. onSelect | function(eventKey, event) | | A callback fired when a menu item is selected. rootCloseEvent | One of:
'click'
'mousedown' | | Which event when fired outside the component will cause it to be closed. @@ -266,8 +263,6 @@ rootCloseEvent | One of:
'click'
'mousedown' | | Which event when fired Name | Type | Default | Description :--- | :--- | :------ | :---------- componentClass | element | div | A custom element for this component. -open | boolean | false | Whether or not the dropdown is visible. -pullRight | boolean | false | Align the menu to the right side of the dropdown toggle. onClose | function(event) | | A callback fired when the dropdown menu closes. onSelect | function(eventKey, event) | | A callback fired when a menu item is selected. rootCloseEvent | One of:
'click'
'mousedown' | | Which event when fired outside the component will cause it to be closed. @@ -284,7 +279,6 @@ eventKey | any | | Value passed to the `onSelect` handler, useful for identifyin header | boolean | false | Style the menu item as a header label, useful for describing a group of menu items. onClick | function(event) | | Callback fired when the menu item is clicked, even if it is disabled. open | boolean | false | Whether or not the dropdown submenu is visible. -pullRight | boolean | false | Align the menu to the right side of the dropdown toggle. onClose | function(event) | | A callback fired when the dropdown menu closes. onSelect | function(eventKey, event) | | A callback fired when a menu item is selected. rootCloseEvent | One of:
'click'
'mousedown' | | Which event when fired outside the component will cause it to be closed. diff --git a/examples/DropdownMenuWrapper.jsx b/examples/DropdownMenuWrapper.jsx index 7463fc0..5f04d56 100644 --- a/examples/DropdownMenuWrapper.jsx +++ b/examples/DropdownMenuWrapper.jsx @@ -8,11 +8,13 @@ export default () => (

Dropdown Menu Wrapper

{}} + open > - + Last 24 hours diff --git a/src/Dropdown.jsx b/src/Dropdown.jsx index b5b2708..06633e1 100644 --- a/src/Dropdown.jsx +++ b/src/Dropdown.jsx @@ -326,7 +326,11 @@ class Dropdown extends PureComponent { if (this.isDropdownMenu(child) || this.isDropdownMenuWrapper(child)) { return this.renderMenu(child, { - open, pullRight, onClose, onSelect, rootCloseEvent + open, + pullRight, + onClose, + onSelect, + rootCloseEvent }); } diff --git a/src/DropdownMenu.jsx b/src/DropdownMenu.jsx index 54bd6d9..06e137d 100644 --- a/src/DropdownMenu.jsx +++ b/src/DropdownMenu.jsx @@ -30,11 +30,7 @@ class DropdownMenu extends PureComponent { }; static defaultProps = { - componentClass: 'div', - - // Dropdown - open: false, - pullRight: false + componentClass: 'div' }; isMenuItem = match(MenuItem); @@ -120,7 +116,7 @@ class DropdownMenu extends PureComponent { className={cx(className, { [styles.dropdownMenu]: true, [styles.selected]: activeMenuItems.length > 0, - [styles.pullRight]: pullRight + [styles.pullRight]: !!pullRight })} style={style} > diff --git a/src/DropdownMenuWrapper.jsx b/src/DropdownMenuWrapper.jsx index cd9007a..ea62687 100644 --- a/src/DropdownMenuWrapper.jsx +++ b/src/DropdownMenuWrapper.jsx @@ -30,11 +30,7 @@ class DropdownMenuWrapper extends PureComponent { }; static defaultProps = { - componentClass: 'div', - - // Dropdown - open: false, - pullRight: false + componentClass: 'div' }; menu = null; // this.menu = c} /> @@ -91,7 +87,8 @@ class DropdownMenuWrapper extends PureComponent { {React.Children.map(children, child => { @@ -102,7 +99,9 @@ class DropdownMenuWrapper extends PureComponent { if (this.isDropdownMenu(child)) { return this.renderMenu(child, { // Do not pass onClose and rootCloseEvent to the dropdown menu - open, pullRight, onSelect + open, + pullRight, + onSelect }); } diff --git a/src/dropdown-menu-wrapper.styl b/src/dropdown-menu-wrapper.styl index 91ada02..1ab9909 100644 --- a/src/dropdown-menu-wrapper.styl +++ b/src/dropdown-menu-wrapper.styl @@ -7,6 +7,11 @@ background-color: #fff; border: 1px solid #bbbbbb; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.2); + + &.pull-right { + right: 0; + left: auto; + } } .dropdown-menu-wrapper > .dropdown-menu {