function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  text-align: center;\n  border-radius: 15px;\n  border: 3px dashed #ccc;\n  color: #666;\n  padding: 3em;\n  font-size: 18px;\n\n  & h1,\n  & h2 {\n    font-size: 2em;\n    font-weight: bold;\n  }\n"]);

  _templateObject = function _templateObject() {
    return data;
  };

  return data;
}

function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }

import PropTypes from "prop-types";
import { jsx, css } from "@emotion/core";
var placeholderClass = css(_templateObject());

var DefaultText = function DefaultText() {
  return jsx("div", null, jsx("h1", null, "Content Placeholder"), jsx("p", null, "Stuff coming soon!"));
};

var IssueText = function IssueText(_ref) {
  var issue = _ref.issue;
  return jsx("div", null, jsx("h1", null, "Card In Progress"), jsx("a", {
    href: "https://github.com/hackoregon/civic/issues/".concat(issue)
  }, "View progress on GitHub"));
};

var Placeholder = function Placeholder(_ref2) {
  var issue = _ref2.issue,
      children = _ref2.children;
  return jsx("div", {
    css: placeholderClass
  }, issue ? jsx(IssueText, {
    issue: issue
  }) : children || jsx(DefaultText, null));
};

Placeholder.displayName = "Placeholder";
Placeholder.propTypes = {
  children: PropTypes.node,
  issue: PropTypes.string
};
IssueText.propTypes = {
  issue: PropTypes.string
};
export default Placeholder;