import React from 'react';

import {
  BalloonComponent
} from '@alicloud/console-components';
import {
  Button
} from '@alicloud/demo-rc-elements';

import {
  ITestingProps
} from '../../types';

const message = `First performed around 1600, Hamlet tells the story of a prince whose duty
to revenge his father's death entangles him in philosophical problems he can't solve.`;

export default function Testing({
  component
}: ITestingProps<BalloonComponent>): JSX.Element {
  const Balloon = component;
  
  return <>
    <Balloon {...{
      title: 'Balloon Title',
      trigger: <Button>Default</Button>,
      triggerType: 'click',
      align: 'br'
    }}>{message}</Balloon>
    <Balloon {...{
      type: 'primary',
      title: 'Balloon Title',
      trigger: <Button>Primary</Button>,
      triggerType: ['hover', 'focus'],
      align: 'br',
      closable: false
    }}>{message}</Balloon>
  </>;
}