mc-react-header 0.4.0 → 0.4.4

package/dist/Breadcrumbs.css

@@ -56,7 +56,7 @@ ul.mc-breadcrumb li a:not([href]):hover {
   height: 0;
   border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */
   border-bottom: 50px solid transparent;
-  border-left: 30px solid #f5f5f5;
+  border-left: 30px solid #fafafa;
   position: absolute;
   top: 50%;
   margin-top: -50px;

package/dist/Breadcrumbs.js

@@ -5,16 +5,18 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 require("./Breadcrumbs.css");
+var _react = _interopRequireDefault(require("react"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const Breadcrumbs = _ref => {
   let {
     breadcrumbsPath
   } = _ref;
-  return /*#__PURE__*/React.createElement("ul", {
+  return /*#__PURE__*/_react.default.createElement("ul", {
     className: "mc-breadcrumb"
   }, breadcrumbsPath.map((el, i) => {
-    return /*#__PURE__*/React.createElement("li", {
+    return /*#__PURE__*/_react.default.createElement("li", {
       key: i
-    }, /*#__PURE__*/React.createElement("a", {
+    }, /*#__PURE__*/_react.default.createElement("a", {
       href: el.link
     }, el.name));
   }));

package/dist/Navbar.js

@@ -7,7 +7,8 @@ exports.default = void 0;
 require("./Navbar.css");
 var _mcloud_logo = _interopRequireDefault(require("./assets/mcloud_logo.png"));
 require("font-awesome/css/font-awesome.min.css");
-var _react = require("react");
+var _react = _interopRequireWildcard(require("react"));
+function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 const mainSections = {
   learn: {
@@ -78,15 +79,15 @@ const DropdownMenu = _ref => {
   }, []);
   const toggleDropdown = () => setDropdownOpen(prev => !prev);
   const dropdownContentClass = "dropdown-content" + (dropdownOpen ? " dropdown-open" : "");
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     ref: wrapperRef,
     className: "more-dropdown"
-  }, /*#__PURE__*/React.createElement("span", {
+  }, /*#__PURE__*/_react.default.createElement("span", {
     className: "more-btn",
     onClick: toggleDropdown
-  }, "More ", /*#__PURE__*/React.createElement("i", {
+  }, "More ", /*#__PURE__*/_react.default.createElement("i", {
     className: "fa fa-caret-down"
-  })), /*#__PURE__*/React.createElement("div", {
+  })), /*#__PURE__*/_react.default.createElement("div", {
     className: dropdownContentClass
   }, Object.keys(dropdownSections).map((element, i) => {
     const {
@@ -94,7 +95,7 @@ const DropdownMenu = _ref => {
       name
     } = dropdownSections[element];
     const cname = element === activeSection ? "active" : "";
-    return /*#__PURE__*/React.createElement("a", {
+    return /*#__PURE__*/_react.default.createElement("a", {
       key: i,
       className: cname,
       href: link
@@ -105,24 +106,24 @@ const Navbar = _ref2 => {
   let {
     activeSection
   } = _ref2;
-  return /*#__PURE__*/React.createElement("div", {
+  return /*#__PURE__*/_react.default.createElement("div", {
     className: "mc-navbar"
-  }, /*#__PURE__*/React.createElement("a", {
+  }, /*#__PURE__*/_react.default.createElement("a", {
     className: "mc-navbrand",
     href: "https://www.materialscloud.org/home"
-  }, /*#__PURE__*/React.createElement("img", {
+  }, /*#__PURE__*/_react.default.createElement("img", {
     src: _mcloud_logo.default,
     height: "50",
     alt: "MC logo"
   })), Object.keys(mainSections).map((key, i) => {
     let cname = "mc-navlink";
     if (key === activeSection) cname += " active";
-    return /*#__PURE__*/React.createElement("a", {
+    return /*#__PURE__*/_react.default.createElement("a", {
       key: i,
       className: cname,
       href: mainSections[key].link
     }, mainSections[key].name);
-  }), /*#__PURE__*/React.createElement(DropdownMenu, {
+  }), /*#__PURE__*/_react.default.createElement(DropdownMenu, {
     activeSection: activeSection
   }));
 };

package/dist/index.js

@@ -5,6 +5,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 require("./index.css");
+var _react = _interopRequireDefault(require("react"));
 var _Navbar = _interopRequireDefault(require("./Navbar"));
 var _Breadcrumbs = _interopRequireDefault(require("./Breadcrumbs"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
@@ -13,9 +14,9 @@ const MaterialsCloudHeader = _ref => {
     activeSection,
     breadcrumbsPath
   } = _ref;
-  return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_Navbar.default, {
+  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_Navbar.default, {
     activeSection: activeSection
-  }), /*#__PURE__*/React.createElement(_Breadcrumbs.default, {
+  }), /*#__PURE__*/_react.default.createElement(_Breadcrumbs.default, {
     breadcrumbsPath: breadcrumbsPath
   }));
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "mc-react-header",
-  "version": "0.4.0",
+  "version": "0.4.4",
   "author": "Kristjan Eimre <kristjan.eimre@epfl.ch>",
   "main": "dist/index.js",
   "module": "dist/index.js",

package/src/App.js

@@ -1,5 +1,7 @@
 import "./App.css";
 
+import React from "react";
+
 import MaterialsCloudHeader from "./MaterialsCloudHeader";
 
 function App() {

package/src/MaterialsCloudHeader/Breadcrumbs.css

@@ -56,7 +56,7 @@ ul.mc-breadcrumb li a:not([href]):hover {
   height: 0;
   border-top: 50px solid transparent; /* Go big on the size, and let overflow hide */
   border-bottom: 50px solid transparent;
-  border-left: 30px solid #f5f5f5;
+  border-left: 30px solid #fafafa;
   position: absolute;
   top: 50%;
   margin-top: -50px;

package/src/MaterialsCloudHeader/Breadcrumbs.js

@@ -1,4 +1,5 @@
 import "./Breadcrumbs.css";
+import React from "react";
 
 const Breadcrumbs = ({ breadcrumbsPath }) => (
   <ul className="mc-breadcrumb">

package/src/MaterialsCloudHeader/Navbar.js

@@ -3,7 +3,7 @@ import "./Navbar.css";
 import Logo from "./assets/mcloud_logo.png";
 
 import "font-awesome/css/font-awesome.min.css";
-import { useEffect, useRef, useState } from "react";
+import React, { useEffect, useRef, useState } from "react";
 
 const mainSections = {
   learn: { name: "LEARN", link: "https://www.materialscloud.org/learn" },

package/src/MaterialsCloudHeader/index.js

@@ -1,5 +1,6 @@
 import "./index.css";
 
+import React from "react";
 import Navbar from "./Navbar";
 import Breadcrumbs from "./Breadcrumbs";