import React from 'react';
import styled from 'styled-components';

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

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

const ScOverlayPopupContent = styled.div`
  padding: 20px;
  border: 1px solid #63c;
  box-shadow: 2px 2px 20px rgba(0, 0, 0, 0.2);
  background-color: #fff;
`;

export default function Testing({
  component
}: ITestingProps<OverlayPopupComponent>): JSX.Element {
  const OverlayPopup = component;
  
  return <>
    <OverlayPopup {...{
      trigger: <Button>Open</Button>,
      triggerType: 'click'
    }}>
      <ScOverlayPopupContent>Hello World From OverlayPopup!</ScOverlayPopupContent>
    </OverlayPopup>
  </>;
}