vitalif
/
react-toolbox
1
0
Fork 0
Code Issues Pull Requests Releases 12 Wiki Activity

Updated Menu readme to include new properties and changed import statement to match other components

old
Keren Chandran 2016-03-25 12:03:30 -04:00
parent 1a9fe24762
commit 2f113872b2
1 changed files with 13 additions and 11 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

24
components/menu/readme.md
View File

@ -4,7 +4,7 @@ A [Menu](https://www.google.com/design/spec/components/menus.html) is a temporar
<!-- example -->
```jsx
import {IconMenu, MenuItem, MenuDivider } from 'react-toolbox';
import {IconMenu, MenuItem, MenuDivider } from 'react-toolbox/lib/menu';
const MenuTest = () => (
<IconMenu icon='more_vert' position='top-left' menuRipple>
@ -26,6 +26,7 @@ This subcomponent is the default wrapper for a menu and is responsible for the o
| `active` | `Boolean` | `false` | If true, the menu will be displayed as opened by default.|
| `className` | `String` | `''` | Set a class to give custom styles to the menu wrapper.|
| `onHide` | `Function` | | Callback that will be called when the menu is being hid. |
| `onSelect` | `Function` | | Callback that will be invoked when a menu item is selected. |
| `onShow` | `Function` | | Callback that will be invoked when the menu is being shown. |
| `outline` | `Boolean` | `true` | If true the menu wrapper will show an outline with a soft shadow. |
| `position` | `String` | `static` | Determine the position of the menu. With `static` value the menu will be always shown, `auto` means that the it will decide the opening direction based on the current position. To force a position use `top-left`, `top-right`, `bottom-left`, `bottom-right`. |
@ -47,29 +48,30 @@ As the most usual scenario will be to open the menu from a click in an Icon, we
| Name | Type | Default | Description|
|:-----|:-----|:-----|:-----|
| `className` | `String` | `''` | Set a class to give custom styles to the icon wrapper.|
| `icon` | `String` | `more_vert` | Icon font key string to display the opener icon. |
| `iconRipple` | `String` | `true` | If true, the icon will show a ripple when is clicked. |
| `menuRipple` | `String` | `true` | Transferred to the `Menu` component. |
| `icon` | `Any` | `more_vert` | Icon font key string or Element to display the opener icon. |
| `iconRipple` | `Boolean` | `true` | If true, the icon will show a ripple when is clicked. |
| `menuRipple` | `Boolean` | `true` | Transferred to the `Menu` component. |
| `onClick` | `Function` | | Callback that will be called when the icon is clicked. |
| `onHide` | `Function` | | Callback that will be called when the menu is being hid. |
| `onShow` | `Function` | | Callback that will be invoked when the menu is being shown. |
| `onHide` | `Function` | | Callback that will be called when the menu is being hidden. |
| `onSelect` | `Function` | | Callback that will be invoked when a menu item is selected. |
| `position` | `String` | `auto` | Determine the position of the menu. This property is transferred to the inner `Menu` component. |
| `onShow` | `Function` | | Callback that will be invoked when the menu is being shown. |
| `position` | `String` | `auto` | Determines the position of the menu. This property is transferred to the inner `Menu` component. |
| `selectable` | `Boolean` | `false` | If true, the menu will keep a value to highlight the active child item. |
| `selected` | `Any` | | Used for selectable menus. Indicates the current selected value so the child item with this value can be highlighted. |
## Menu Item
Is the inner component for menus and describes the content of each option. It behaves in a similar way to List Items but simpler.
The inner component for menus and describes the content of each option. It behaves in a similar way to List Items but simpler.
| Name | Type | Default | Description|
|:-----|:-----|:-----|:-----|
| `caption` | `String` | | The text to include in the menu item.|
| `caption` | `String` | | The text to include in the menu item. Required.|
| `className` | `String` | `''` | Set a class to give custom styles to the item.|
| `disabled` | `Boolean` | `false` | If true, the item will be displayed as disabled and is not selectable.|
| `icon` | `String` | | Icon font key string to display in the right side of the option. |
| `ripple` | `Boolean` | `false` | If true, the item will show a ripple effect when it's clicked. Inherited from the parent. |
| `icon` | `Any` | | Icon font key string or Element to display in the right side of the option. |
| `onClick` | `Function` | | Callback that will be called when Component is clicked. |
| `selected` | `Boolean` | `false` | Transferred from the `Menu` component for selectable menus. Indicates if it's the current active option. |
| `shortcut` | `String` | `''` | Displays shortcut text on the right side of the `caption` attribute. |
## Menu Divider