@hackoregon/component-library/es/ChartContainer/ChartContainer.js

Official repo for Hack Oregon React component library

function _templateObject4() {
  var data = _taggedTemplateLiteral(["\n    margin: 0 auto;\n    max-width: 900px;\n    width: 100%;\n    ", ";\n  "]);

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

  return data;
}

function _templateObject3() {
  var data = _taggedTemplateLiteral(["\n    margin: 0;\n  "]);

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

  return data;
}

function _templateObject2() {
  var data = _taggedTemplateLiteral(["\n  text-align: center;\n  background: #fdd;\n  height: 100%;\n"]);

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

  return data;
}

function _templateObject() {
  var data = _taggedTemplateLiteral(["\n  text-align: center;\n  background: #eee;\n  height: 100%;\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 React from "react";
import PropTypes from "prop-types";
import { css } from "emotion";
import ChartTitle from "../ChartTitle";
var chartLoading = css(_templateObject());
var chartError = css(_templateObject2());

var ChartContainer = function ChartContainer(_ref) {
  var title = _ref.title,
      error = _ref.error,
      loading = _ref.loading,
      subtitle = _ref.subtitle,
      children = _ref.children,
      className = _ref.className;
  var figureWrapper = css(_templateObject3());
  var wrapperStyle = css(_templateObject4(), className);
  var content = React.createElement("figure", {
    className: figureWrapper
  }, React.createElement(ChartTitle, {
    title: title,
    subtitle: subtitle
  }), React.createElement("div", {
    className: wrapperStyle
  }, children));

  if (loading) {
    content = React.createElement("div", {
      className: chartLoading
    }, "Loading...");
  } else if (error) {
    content = React.createElement("div", {
      className: chartError
    }, error);
  }

  return content;
};

ChartContainer.propTypes = {
  title: PropTypes.string,
  error: PropTypes.string,
  loading: PropTypes.bool,
  children: PropTypes.node,
  subtitle: PropTypes.string,
  className: PropTypes.string
};
ChartContainer.defaultProps = {};
export default ChartContainer;