ToggleGroup example

This demonstrates the use of ToggleGroups.

    import React from 'react';
import { render } from 'react-dom';
import {
  ToggleGroup,
  ToggleButton,
  Logger
} from '@terrestris/react-geo';

/**
 * A simple handler.
 * @param {*} pressed
 * @param {*} evt
 */
const onChange = (pressed, evt) => {
  Logger.info('ToggleGroup changed', pressed, evt);
};

render(
  <div>
    <div className="example-block">
      <span>Just a ToggleGroup:</span>

      <ToggleGroup
        allowDeselect={true}
        selectedName="one"
        onChange={onChange}
      >
        <ToggleButton
          name="one"
          icon="frown-o"
          pressedIcon="smile-o"
          onToggle={(pressed)=>{Logger.info(`one toggled --> ${pressed}`);}}
        />
        <ToggleButton
          name="two"
          icon="frown-o"
          pressedIcon="smile-o"
          onToggle={(pressed)=>{Logger.info(`two toggled --> ${pressed}`);}}
        />
        <ToggleButton
          name="three"
          icon="frown-o"
          pressedIcon="smile-o"
          onToggle={(pressed)=>{Logger.info(`three toggled --> ${pressed}`);}}
        />
      </ToggleGroup>

    </div>

  </div>,
  document.getElementById('exampleContainer')
);