'use strict';

exports.__esModule = true;

var _react = require('react');

var _react2 = _interopRequireDefault(_react);

var _propTypes = require('prop-types');

var _propTypes2 = _interopRequireDefault(_propTypes);

var _Icon = require('../../../base/Icon');

var _Icon2 = _interopRequireDefault(_Icon);

require('./styles.css');

function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }

var ButtonCopy = function ButtonCopy(_ref) {
  var content = _ref.content;

  var _useState = (0, _react.useState)(false),
      copied = _useState[0],
      setCopied = _useState[1];

  var copyAction = function copyAction() {
    setCopied(true);
    navigator.clipboard.writeText(content);
    var timer = setTimeout(function () {
      setCopied(false);
    }, 1000);
    return function () {
      return clearTimeout(timer);
    };
  };
  var copyButtonTitle = copied ? 'copied' : 'copy hex code';
  if (navigator && navigator.clipboard || window.location.search.indexOf('backstop') > -1) {
    return _react2.default.createElement(
      'button',
      {
        className: 'ma__button-copy',
        onClick: copyAction,
        title: copyButtonTitle,
        'aria-label': copyButtonTitle
      },
      copied ? _react2.default.createElement(_Icon2.default, { name: 'inputsuccess', svgWidth: 16, svgHeight: 16 }) : _react2.default.createElement(_Icon2.default, { name: 'copy', svgWidth: 16, svgHeight: 16 })
    );
  }
  // If no clipboard available, don't render ButtonCopy
  return null;
};

ButtonCopy.propTypes = process.env.NODE_ENV !== "production" ? {
  /** Copied content string. */
  content: _propTypes2.default.string
} : {};

exports.default = ButtonCopy;
module.exports = exports['default'];