import React from 'react';
import PropTypes from 'prop-types';
import Icon from './index';
import ButtonCopy from '../../atoms/buttons/ButtonCopy';
import './display.css';

var IconDisplay = function IconDisplay(props) {
  var name = props.name;

  return React.createElement(
    'li',
    { style: { width: 180, margin: 10, padding: 10 } },
    React.createElement(
      'div',
      { className: 'sg-icons-info' },
      React.createElement(Icon, props),
      React.createElement(
        'div',
        null,
        React.createElement(
          'span',
          null,
          name
        ),
        React.createElement(ButtonCopy, { content: name })
      )
    )
  );
};

IconDisplay.propTypes = process.env.NODE_ENV !== "production" ? {
  name: PropTypes.string.isRequired,
  title: PropTypes.string,
  svgWidth: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
  svgHeight: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
  classes: PropTypes.arrayOf(PropTypes.string),
  ariaHidden: PropTypes.bool,
  fill: PropTypes.string
} : {};

export default IconDisplay;