import React, {Component} from 'react';
import {Title} from 'hana-ui';

/**
 * @en
 * Base Example
 *
 *  
 *
 * @cn
 * 基础用例
 *
 *  
 */

export default class ExampleBase extends Component {
  render() {
    return (
      <div>
        <Title>(ง •̀_•́)</Title>
        <br />
        <Title
          style={{
            padding: 10,
            backgroundColor: '#199ed8',
            color: 'white'
          }}
        >
          Title
        </Title>
      </div>
    );
  }
}

import React, {Component} from 'react';
import {Title} from 'hana-ui';

/**
 * @en
 * sub-title
 *
 *  
 *
 * @cn
 * 子标题
 *
 *  
 */

export default class ExampleSubtitle extends Component {
  render() {
    return (
      <div>
        <Title subTitle={'Sbu-title under title'}>(ง •̀_•́)</Title>
      </div>
    );
  }
}

import React, {Component} from 'react';
import {Title, Icon} from 'hana-ui';

/**
 * @en
 * icon title
 *
 *  
 *
 * @cn
 * 带图标标题
 *
 *  
 */

export default class ExampleIcon extends Component {
  render() {
    return (
      <div>
        <Title
          icon={<Icon type={'menu'} color={'#199ed8'} />}
          iconRight={
            <div>
              <Icon type={'hana'} color={'#199ed8'} />
              <Icon type={'delete'} color={'red'} />
            </div>
          }
          leftIconClick={() => {
            alert('click'); // eslint-disable-line
          }}
        >
          (ง •̀_•́)
        </Title>
      </div>
    );
  }
}