import { extends as _extends } from '../../../_virtual/_rollupPluginBabelHelpers.js';
import { jsx } from '@emotion/core';
import _pt from 'prop-types';
import { Button } from '../Button/Button.esm.js';
import { AnchorButton } from '../AnchorButton/AnchorButton.esm.js';
import { LinkButton } from '../LinkButton/LinkButton.esm.js';
import { Link } from '../Link/Link.esm.js';
import Text from '../Text/Text.esm.js';
import { Heading } from '../Heading/Heading.esm.js';

var baseCss = function baseCss(_theme) {
  return {};
};

var innerCss = function innerCss(_theme) {
  return {
    boxSizing: "content-box",
    maxWidth: 480,
    display: "flex",
    flexDirection: "column",
    alignItems: "center",
    textAlign: "center",
    margin: "0 auto"
  };
};

var graphicCss = function graphicCss(theme) {
  return {
    maxWidth: 360,
    maxHeight: 120,
    marginBottom: theme.space[7],

    /* Begin icon graphics styles */
    fontSize: theme.fontSizes[10],
    color: theme.colors.grey[40]
    /* End icon graphics styles */

  };
};

var headingCss = function headingCss(theme) {
  return {
    fontSize: theme.fontSizes[5],
    marginTop: 0,
    marginBottom: theme.space[5]
  };
};

var textCss = function textCss(theme) {
  return {
    marginTop: 0,
    marginBottom: 0,
    "&:not(:last-child)": {
      marginBottom: theme.space[7]
    }
  };
};

var primaryCtaCss = function primaryCtaCss(theme) {
  return {
    "&:not(:last-child)": {
      marginBottom: theme.space[5]
    }
  };
};

var secondaryCtaCss = function secondaryCtaCss(theme) {
  return {
    lineHeight: theme.lineHeights["default"],
    fontSize: theme.fontSizes[1],
    textDecoration: "none"
  };
};

var paddedCss = function paddedCss(theme) {
  return {
    borderWidth: 1,
    borderStyle: "solid",
    borderColor: "transparent",
    paddingTop: theme.space[10],
    paddingBottom: theme.space[10],
    paddingLeft: theme.space[7],
    paddingRight: theme.space[7]
  };
};

var variantDefaultCss = function variantDefaultCss(_theme) {
  return {};
};

var variantBorderedCss = function variantBorderedCss(theme) {
  return [paddedCss(theme), {
    borderColor: theme.colors.grey[30],
    borderRadius: theme.radii[2],
    backgroundColor: theme.colors.white
  }];
};

var variantWithBackgroundCss = function variantWithBackgroundCss(theme) {
  return [paddedCss(theme), {
    borderColor: theme.colors.grey[5],
    borderRadius: theme.radii[2],
    backgroundColor: theme.colors.grey[5]
  }];
};

var variantCss = {
  DEFAULT: variantDefaultCss,
  BORDERED: variantBorderedCss,
  WITH_BACKGROUND: variantWithBackgroundCss
};
function EmptyState(_ref) {
  var heading = _ref.heading,
      _ref$headingAs = _ref.headingAs,
      headingAs = _ref$headingAs === void 0 ? "h3" : _ref$headingAs,
      text = _ref.text,
      graphic = _ref.graphic,
      _ref$variant = _ref.variant,
      variant = _ref$variant === void 0 ? "DEFAULT" : _ref$variant,
      primaryAction = _ref.primaryAction,
      secondaryAction = _ref.secondaryAction;
  return jsx("div", {
    css: function css(theme) {
      return [baseCss(), variantCss[variant](theme)];
    }
  }, jsx("div", {
    css: innerCss
  }, graphic && jsx("div", {
    css: graphicCss
  }, graphic), jsx(Heading, {
    as: headingAs,
    css: headingCss,
    variant: "PRIMARY",
    tone: "NEUTRAL"
  }, heading), jsx(Text, {
    size: "M",
    css: textCss
  }, text), primaryAction, secondaryAction));
}
EmptyState.propTypes = {
  heading: _pt.node.isRequired,
  text: _pt.node.isRequired,
  graphic: _pt.node,
  variant: _pt.oneOf(["DEFAULT", "BORDERED", "WITH_BACKGROUND"]),
  primaryAction: _pt.node,
  secondaryAction: _pt.node
};
function EmptyStatePrimaryAction(props) {
  var sharedProps = {
    variant: "PRIMARY",
    size: "L",
    tone: "BRAND"
  };

  if (isLink(props)) {
    return jsx(LinkButton, _extends({
      css: primaryCtaCss
    }, props, sharedProps));
  }

  if (isAnchor(props)) {
    return jsx(AnchorButton, _extends({
      css: primaryCtaCss
    }, props, sharedProps));
  }

  return jsx(Button, _extends({
    css: primaryCtaCss
  }, props, sharedProps));
}

function isLink(props) {
  return "to" in props;
}

function isAnchor(props) {
  return "href" in props;
}

function EmptyStateSecondaryAction(props) {
  return jsx(Link, _extends({
    css: secondaryCtaCss
  }, props));
}
EmptyState.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "EmptyState",
  "props": {
    "headingAs": {
      "defaultValue": {
        "value": "`h3`",
        "computed": false
      },
      "required": false,
      "tsType": {
        "name": "HeadingProps[\"as\"]",
        "raw": "HeadingProps[\"as\"]"
      },
      "description": ""
    },
    "variant": {
      "defaultValue": {
        "value": "`DEFAULT`",
        "computed": false
      },
      "required": false,
      "tsType": {
        "name": "union",
        "raw": "`DEFAULT` | `BORDERED` | `WITH_BACKGROUND`",
        "elements": [{
          "name": "literal",
          "value": "undefined"
        }, {
          "name": "literal",
          "value": "undefined"
        }, {
          "name": "literal",
          "value": "undefined"
        }]
      },
      "description": ""
    },
    "heading": {
      "required": true,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    },
    "text": {
      "required": true,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    },
    "graphic": {
      "required": false,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    },
    "primaryAction": {
      "required": false,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    },
    "secondaryAction": {
      "required": false,
      "tsType": {
        "name": "ReactReactNode",
        "raw": "React.ReactNode"
      },
      "description": ""
    }
  }
};

if (typeof STORYBOOK_REACT_CLASSES !== "undefined") {
  STORYBOOK_REACT_CLASSES["src/components/EmptyState/EmptyState.tsx"] = {
    name: "EmptyState",
    docgenInfo: EmptyState.__docgenInfo,
    path: "src/components/EmptyState/EmptyState.tsx"
  };
}

EmptyStatePrimaryAction.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "EmptyStatePrimaryAction"
};

if (typeof STORYBOOK_REACT_CLASSES !== "undefined") {
  STORYBOOK_REACT_CLASSES["src/components/EmptyState/EmptyState.tsx"] = {
    name: "EmptyStatePrimaryAction",
    docgenInfo: EmptyStatePrimaryAction.__docgenInfo,
    path: "src/components/EmptyState/EmptyState.tsx"
  };
}

EmptyStateSecondaryAction.__docgenInfo = {
  "description": "",
  "methods": [],
  "displayName": "EmptyStateSecondaryAction"
};

if (typeof STORYBOOK_REACT_CLASSES !== "undefined") {
  STORYBOOK_REACT_CLASSES["src/components/EmptyState/EmptyState.tsx"] = {
    name: "EmptyStateSecondaryAction",
    docgenInfo: EmptyStateSecondaryAction.__docgenInfo,
    path: "src/components/EmptyState/EmptyState.tsx"
  };
}

export { EmptyState, EmptyStatePrimaryAction, EmptyStateSecondaryAction };
//# sourceMappingURL=EmptyState.esm.js.map
