You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

StatelessToolbar.web.js 1.4KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. /* @flow */
  2. import PropTypes from 'prop-types';
  3. import React, { Component } from 'react';
  4. /**
  5. * Implements a toolbar in React/Web. It is a strip that contains a set of
  6. * toolbar items such as buttons.
  7. *
  8. * @class StatelessToolbar
  9. * @extends Component
  10. */
  11. export default class StatelessToolbar extends Component<*> {
  12. /**
  13. * Base toolbar component's property types.
  14. *
  15. * @static
  16. */
  17. static propTypes = {
  18. /**
  19. * Children of current React component.
  20. */
  21. children: PropTypes.node,
  22. /**
  23. * Toolbar's class name.
  24. */
  25. className: PropTypes.string,
  26. /**
  27. * Handler for mouse out event.
  28. */
  29. onMouseOut: PropTypes.func,
  30. /**
  31. * Handler for mouse over event.
  32. */
  33. onMouseOver: PropTypes.func
  34. };
  35. /**
  36. * Implements React's {@link Component#render()}.
  37. *
  38. * @inheritdoc
  39. * @returns {ReactElement}
  40. */
  41. render(): React$Element<*> {
  42. const {
  43. className,
  44. onMouseOut,
  45. onMouseOver
  46. } = this.props;
  47. return (
  48. <div
  49. className = { `toolbar ${className}` }
  50. onMouseOut = { onMouseOut }
  51. onMouseOver = { onMouseOver }>
  52. {
  53. this.props.children
  54. }
  55. </div>
  56. );
  57. }
  58. }