Package Exports

material-ui-toggle-icon

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (material-ui-toggle-icon) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

material-ui-toggle-icon

This project provides a toggle icon for Material-UI.

Demo

If you want to try the component yourself instead of watching a gif, head over to the styleguide for a live demo!

Installation

npm i --save material-ui-toggle-icon

Usage

The component takes two icons and a boolean that tells it whether to display the onIcon or the offIcon. When on is changed, the icon is switched with a transition.

import ToggleIcon from 'material-ui-toggle-icon'
import { IconButton } from 'material-ui'
import Visibility from 'material-ui/svg-icons/action/visibility'
import VisibilityOff from 'material-ui/svg-icons/action/visibility-off'

<IconButton
  onClick={() => setState({ on: !state.on })}
>
  <ToggleIcon
    on={state.on}
    onIcon={<Visibility />}
    offIcon={<VisibilityOff />}
  />
</IconButton>

License

The files included in this repository are licensed under the MIT license.