text: /*
   * Licensed to Elasticsearch B.V. under one or more contributor
   * license agreements. See the NOTICE file distributed with
   * this work for additional information regarding copyright
   * ownership. Elasticsearch B.V. licenses this file to you under
   * the Apache License, Version 2.0 (the "License"); you may
   * not use this file except in compliance with the License.
   * You may obtain a copy of the License at
   *
   *    http://www.apache.org/licenses/LICENSE-2.0
   *
   * Unless required by applicable law or agreed to in writing,
   * software distributed under the License is distributed on an
   * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
   * KIND, either express or implied.  See the License for the
   * specific language governing permissions and limitations
   * under the License.
   */
  
  import React, {
    Component,
  } from 'react';
  
  import {
    KuiPopover,
    KuiButton
  } from '../../../../components';
  
  export default class extends Component {
    constructor(props) {
      super(props);
  
      this.state = {
        isPopoverOpen: false,
      };
    }
  
    onButtonClick() {
      this.setState({
        isPopoverOpen: !this.state.isPopoverOpen,
      });
    }
  
    closePopover() {
      this.setState({
        isPopoverOpen: false,
      });
    }
  
    render() {
      return (
        <KuiPopover
          ownFocus
          button={(
            <KuiButton buttonType="basic" onClick={this.onButtonClick.bind(this)}>
              Custom class
            </KuiButton>
          )}
          isOpen={this.state.isPopoverOpen}
          closePopover={this.closePopover.bind(this)}
          bodyClassName="yourClassNameHere"
        >
          It&rsquo;s hard to tell but there&rsquo;s a custom class on this element
        </KuiPopover>
      );
    }
  }
  