"use strict";

var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.UnderlineOnHover = exports.Default = exports.default = void 0;

var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));

var _react = _interopRequireDefault(require("react"));

var _styles = require("@material-ui/core/styles");

var _Link = _interopRequireDefault(require("../../components/elements/Link"));

var _core = require("@material-ui/core");

var _default = {
  title: 'Elements/Link',
  component: _Link.default
};
exports.default = _default;

var useStyles = function useStyles(props) {
  return (0, _styles.makeStyles)(function (theme) {
    return {
      root: {
        "text-decoration": "none",
        '&:hover': {
          "text-decoration": "underline"
        }
      }
    };
  });
};

var Default = function Default() {
  return /*#__PURE__*/_react.default.createElement(_core.Typography, null, /*#__PURE__*/_react.default.createElement(_Link.default, {
    href: "https://google.com",
    target: "_blank"
  }, "This is a Default Link for style and external links/new tab."));
};

exports.Default = Default;

var UnderlineOnHover = function UnderlineOnHover(_ref) {
  var children = _ref.children,
      props = (0, _objectWithoutProperties2.default)(_ref, ["children"]);
  var classes = useStyles(props)();
  return /*#__PURE__*/_react.default.createElement(_core.Typography, null, /*#__PURE__*/_react.default.createElement(_Link.default, {
    className: classes.root,
    href: "https://google.com",
    target: "_blank"
  }, "This is a Default Link for style and external links/new tab."));
};

exports.UnderlineOnHover = UnderlineOnHover;