tenjin-ui-kit 0.3.10 → 0.3.12

package/components/layout/topBar/ProjectTopbar.js

@@ -32,7 +32,8 @@ var ProjectTopbar = function ProjectTopbar(_ref) {
     actions = _ref.actions,
     onLogout = _ref.onLogout,
     onViewProfileClick = _ref.onViewProfileClick,
-    hrefLink = _ref.hrefLink;
+    hrefLink = _ref.hrefLink,
+    avatarItems = _ref.avatarItems;
   var theme = (0, _system.useTheme)();
   var _useState = (0, _react.useState)(null),
     _useState2 = _slicedToArray(_useState, 2),
@@ -213,14 +214,28 @@ var ProjectTopbar = function ProjectTopbar(_ref) {
     style: {
       fontWeight: "600"
     }
-  }, "Administration")), /*#__PURE__*/_react.default.createElement(_system.Box, {
+  }, "Administration")), /*#__PURE__*/_react.default.createElement(_button.default, {
+    variant: "text",
+    startIcon: /*#__PURE__*/_react.default.createElement(_reactFeather.HelpCircle, {
+      size: "1rem"
+    }),
+    onClick: function onClick() {
+      window.open = "/docs";
+    }
+  }, /*#__PURE__*/_react.default.createElement(_text.default, {
+    variant: "subtitle1",
+    style: {
+      fontWeight: "600"
+    }
+  }, "Help")), /*#__PURE__*/_react.default.createElement(_system.Box, {
     sx: {
       marginLeft: theme.spacing(1)
     }
   }, /*#__PURE__*/_react.default.createElement(_UserAvatar.default, {
     loggedInUser: loggedInUser,
     onLogout: handleOpen,
-    onViewProfileClick: onViewProfileClick
+    onViewProfileClick: onViewProfileClick,
+    avatarItems: avatarItems
   })))))), /*#__PURE__*/_react.default.createElement(_modal.default, {
     title: "Log out",
     open: open,

package/components/layout/topBar/UserAvatar.js

@@ -39,7 +39,8 @@ var StyledMenu = (0, _styles.withStyles)({
 var UserAvatar = function UserAvatar(_ref) {
   var loggedInUser = _ref.loggedInUser,
     onViewProfileClick = _ref.onViewProfileClick,
-    onLogout = _ref.onLogout;
+    onLogout = _ref.onLogout,
+    avatarItems = _ref.avatarItems;
   var _useState = (0, _react.useState)(null),
     _useState2 = _slicedToArray(_useState, 2),
     menu = _useState2[0],
@@ -65,7 +66,7 @@ var UserAvatar = function UserAvatar(_ref) {
     style: {
       width: "14rem"
     }
-  }, (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.name) && (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.email) && /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+  }, (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.name) && (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.email) && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: function onClick() {
       handleCloseMenu();
       if (onViewProfileClick) {
@@ -88,7 +89,30 @@ var UserAvatar = function UserAvatar(_ref) {
     className: "name"
   }, loggedInUser.name), /*#__PURE__*/_react.default.createElement(_text.default, {
     className: "email"
-  }, loggedInUser.email)))), (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.name) && /*#__PURE__*/_react.default.createElement(_material.Divider, null), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+  }, loggedInUser.email)))), !!(avatarItems !== null && avatarItems !== void 0 && avatarItems.length) && (avatarItems === null || avatarItems === void 0 ? void 0 : avatarItems.map(function (item) {
+    return /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
+      onClick: function onClick() {
+        handleCloseMenu();
+        if (item.onClick) {
+          item.onClick();
+        }
+      }
+    }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+      display: "flex",
+      flexDirection: "row",
+      alignItems: "center"
+    }, /*#__PURE__*/_react.default.createElement(_material.Box, {
+      sx: {
+        marginRight: theme.spacing(1)
+      }
+    }, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
+      variant: "rounded",
+      sx: {
+        width: 30,
+        height: 30
+      }
+    }, item.icon)), /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_text.default, null, item.title))));
+  }))), (loggedInUser === null || loggedInUser === void 0 ? void 0 : loggedInUser.name) && /*#__PURE__*/_react.default.createElement(_material.Divider, null), /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
     onClick: function onClick() {
       handleCloseMenu();
       if (onLogout) {

package/components/select/SimpleSelect.js

@@ -10,7 +10,7 @@ var _material = require("@mui/material");
 var _text = _interopRequireDefault(require("../text"));
 var _Search = _interopRequireDefault(require("@mui/icons-material/Search"));
 var _iconsMaterial = require("@mui/icons-material");
-var _excluded = ["options", "errorMessage", "error", "fullWidth", "isDisabled", "label", "isRequired", "helperText", "isSearch", "isClearOption", "loading", "isSort"];
+var _excluded = ["options", "errorMessage", "error", "fullWidth", "isDisabled", "label", "isRequired", "helperText", "isSearch", "isClearOption", "loading", "isSort", "placeholder"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -42,6 +42,7 @@ var SimpleSelect = function SimpleSelect(_ref) {
     isClearOption = _ref.isClearOption,
     loading = _ref.loading,
     isSort = _ref.isSort,
+    placeholder = _ref.placeholder,
     rest = _objectWithoutProperties(_ref, _excluded);
   isSort = (_isSort = isSort) !== null && _isSort !== void 0 ? _isSort : true; //by default true
   isSearch = (_isSearch = isSearch) !== null && _isSearch !== void 0 ? _isSearch : true; //by default true
@@ -154,6 +155,21 @@ var SimpleSelect = function SimpleSelect(_ref) {
       color: "red"
     }
   }, " * ") : "")), /*#__PURE__*/_react.default.createElement(_material.Select, _extends({}, rest, {
+    displayEmpty: true // To display the placeholder
+    ,
+    renderValue: function renderValue(selected) {
+      if (!selected) {
+        return /*#__PURE__*/_react.default.createElement("span", {
+          style: {
+            color: "#acacac"
+          }
+        }, placeholder || "Select an option");
+      }
+      var selectedOption = options === null || options === void 0 ? void 0 : options.find(function (option) {
+        return (option === null || option === void 0 ? void 0 : option.value) === selected;
+      });
+      return selectedOption === null || selectedOption === void 0 ? void 0 : selectedOption.label;
+    },
     fullWidth: true,
     onClose: function onClose() {
       return setSearchText("");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tenjin-ui-kit",
-  "version": "0.3.10",
+  "version": "0.3.12",
   "repository": {
     "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
   },