{() => {
    class StateManager extends React.Component {
      constructor(props, context) {
        super(props, context)
        this.state = { text: '' }
      }
      updateClipboard(text) {
        return () => this.setState({ text })
      }
      render() {
        return (
          <SpacedGroup direction="vertical">
            <SpacedGroup center>
              <span>Clipboard: {this.state.text || ' is empty'}
              <TextField stretch hintText="Paste in here to verify!" />
            </SpacedGroup>
            <Divider />
            <SpacedGroup>
              <CopyToClipboard
                text={'SPAN'}
                onCopy={this.updateClipboard('SPAN')}
              >
                <span>Click on me to copy: SPAN</span>
              </CopyToClipboard>
              <CopyToClipboard
                text={'BUTTON'}
                onCopy={this.updateClipboard('BUTTON')}
              >
                <Button>Click on me to copy: BUTTON</Button>
              </CopyToClipboard>
            </SpacedGroup>
          </SpacedGroup>
        )
      }
    }
    return <StateManager />
  }}
</Playground>