React Component that implements a speed dial using Material-UI.
React Component that implements a speed dial using Material-UI.
For Material-UI v1 use material-ui-speed-dial
like inbox | toolbox version |
---|---|
open demo | open demo |
For the installation of Material-UI please have look in the Material-UI Documentation
React speed dial is available as an npm package.
npm install react-speed-dial
import React from 'react';
import MuiThemeProvider from 'material-ui/styles/MuiThemeProvider';
import Avatar from 'material-ui/Avatar';
import { SpeedDial, BubbleList, BubbleListItem } from 'react-speed-dial';
const App = () => {
return (
<MuiThemeProvider>
<SpeedDial>
<BubbleList>
<BubbleListItem
primaryText="Eric Hoffman"
rightAvatar={<Avatar src="http://lorempixel.com/80/80" />}
/>
</BubbleList>
</SpeedDial>
</MuiThemeProvider>
);
};
App.displayName = 'App';
export default App;
http://smollweide.github.io/react-speed-dial/
List
component
This project was bootstrapped with Create React App.
git clone [email protected]:<yourname>/react-speed-dial.git
git checkout -b my-topic-branch
git push --set-upstream origin my-topic-branch
.npm install
or yarn install
npm start
or yarn start
npm run lint
or yarn lint
npm test
or yarn test
npm run build
or yarn build
npm run static-server
or yarn static-server
Please follow the coding style of the current code base.
React-speed-dial uses eslint, so if possible, enable linting in your editor to get realtime feedback.
The linting rules can be run manually with npm run lint
.