tenjin-ui-kit 0.2.110 → 0.2.114

package/README.md

@@ -1,13 +1,13 @@
-# Tenjin UI Kit
-
-The Tenjin UI kit ships a set of pre-built components that can be used while building user interfaces for Tenjin.
-
-## Installation
-
-In the project directory, you can run:
-
-    npm install tenjin-ui-kit
-
-## Usage
-
-The [Tenjin UI Kit](https://tenjin-ui-kit.netlify.app) storybook gives clear documentation on how to use the Tenjin UI Kit.
+# Tenjin UI Kit
+
+The Tenjin UI kit ships a set of pre-built components that can be used while building user interfaces for Tenjin.
+
+## Installation
+
+In the project directory, you can run:
+
+    npm install tenjin-ui-kit
+
+## Usage
+
+The [Tenjin UI Kit](https://tenjin-ui-kit.netlify.app) storybook gives clear documentation on how to use the Tenjin UI Kit.

package/{dist/components → components}/RightContext/index.css

@@ -1,20 +1,20 @@
-.contextContainer {
-  z-index: 1;
-  width: 100%;
-  height: 500px;
-  background: #673ab7;
-}
-.rightClick {
-  z-index: 12;
-  position: fixed;
-  background: rgb(240, 200, 1);
-}
-.menuElement {
-  color: #222222;
-  cursor: pointer;
-  padding: 17px 36px;
-}
-.menuElement:hover {
-  color: #fff;
-  background: #009688;
-}
+.contextContainer {
+  z-index: 1;
+  width: 100%;
+  height: 500px;
+  background: #673ab7;
+}
+.rightClick {
+  z-index: 12;
+  position: fixed;
+  background: rgb(240, 200, 1);
+}
+.menuElement {
+  color: #222222;
+  cursor: pointer;
+  padding: 17px 36px;
+}
+.menuElement:hover {
+  color: #fff;
+  background: #009688;
+}

package/{dist/components → components}/browsingTestCaseLayout/TreeViewLayout/TreeViewContent/Index.js

@@ -10,11 +10,15 @@ var _tree = _interopRequireDefault(require("../../../tree"));
 var _default2 = _interopRequireDefault(require("../../../../themes/default"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 var TreeViewContent = function TreeViewContent(props) {
-  var folder = props.folder;
+  var folder = props.folder,
+    projectName = props.projectName,
+    apiCallFunc = props.apiCallFunc;
   return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_material.ThemeProvider, {
     theme: _default2.default
   }, /*#__PURE__*/_react.default.createElement(_material.CssBaseline, null), /*#__PURE__*/_react.default.createElement(_tree.default, {
-    folder: folder
+    folder: folder,
+    projectName: projectName,
+    apiCallFunc: apiCallFunc
   })));
 };
 TreeViewContent.propTypes = {};

package/{dist/components → components}/browsingTestCaseLayout/style.css

@@ -1,82 +1,82 @@
-:root {
-  --box-width: 200px;
-}
-
-body {
-  margin: 40px;
-}
-
-.wrapper {
-  background-color: #fff;
-  color: #444;
-  display: flex;
-}
-
-.box {
-  background-color: #444;
-  color: #fff;
-  border-radius: 5px;
-  padding: 20px;
-  font-size: 12px;
-
-  box-sizing: border-box;
-
-  flex: 1 1 auto;
-}
-
-.handler {
-  width: 20px;
-  padding: 0;
-  cursor: ew-resize;
-  flex: 0 0 auto;
-}
-
-.handler::before {
-  content: "";
-  display: block;
-  width: 2px;
-  height: calc(100vh - 34px);
-  background: #c0c0c0;
-  margin: 0 auto;
-}
-
-.arrowButton {
-  display: flex;
-  justify-content: flex-end;
-  /* transition: 0.4s; */
-  width: 100%;
-}
-
-.verticalText {
-  display: flex;
-  flex-direction: column;
-  justify-content: center;
-  writing-mode: vertical-lr;
-  text-orientation: mixed;
-  transform: rotate(180deg);
-  font-size: 1.3rem;
-}
-
-.leftWrapper {
-  background-color: #fff;
-  color: black;
-  border-radius: 5px;
-  padding: 0rem 0.5rem;
-  font-size: 12px;
-  box-sizing: border-box;
-  flex: 1 1 auto;
-  min-width: var(--box-width);
-  flex-grow: 0;
-}
-
-.rightWrapper {
-  background-color: #fff;
-  color: black;
-  border-radius: 5px;
-  padding: 0rem 0.5rem;
-  font-size: 12px;
-  box-sizing: border-box;
-  flex: 1 1 auto;
-  min-width: var(--box-width);
-  flex-grow: 1;
-}
+:root {
+  --box-width: 200px;
+}
+
+body {
+  margin: 40px;
+}
+
+.wrapper {
+  background-color: #fff;
+  color: #444;
+  display: flex;
+}
+
+.box {
+  background-color: #444;
+  color: #fff;
+  border-radius: 5px;
+  padding: 20px;
+  font-size: 12px;
+
+  box-sizing: border-box;
+
+  flex: 1 1 auto;
+}
+
+.handler {
+  width: 20px;
+  padding: 0;
+  cursor: ew-resize;
+  flex: 0 0 auto;
+}
+
+.handler::before {
+  content: "";
+  display: block;
+  width: 2px;
+  height: calc(100vh - 34px);
+  background: #c0c0c0;
+  margin: 0 auto;
+}
+
+.arrowButton {
+  display: flex;
+  justify-content: flex-end;
+  /* transition: 0.4s; */
+  width: 100%;
+}
+
+.verticalText {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  writing-mode: vertical-lr;
+  text-orientation: mixed;
+  transform: rotate(180deg);
+  font-size: 1.3rem;
+}
+
+.leftWrapper {
+  background-color: #fff;
+  color: black;
+  border-radius: 5px;
+  padding: 0rem 0.5rem;
+  font-size: 12px;
+  box-sizing: border-box;
+  flex: 1 1 auto;
+  min-width: var(--box-width);
+  flex-grow: 0;
+}
+
+.rightWrapper {
+  background-color: #fff;
+  color: black;
+  border-radius: 5px;
+  padding: 0rem 0.5rem;
+  font-size: 12px;
+  box-sizing: border-box;
+  flex: 1 1 auto;
+  min-width: var(--box-width);
+  flex-grow: 1;
+}

package/{dist/components → components}/paper/index.js

@@ -11,7 +11,7 @@ var _propTypes = _interopRequireDefault(require("prop-types"));
 var _clsx2 = _interopRequireDefault(require("clsx"));
 var _react = _interopRequireDefault(require("react"));
 var _style = _interopRequireDefault(require("./style"));
-var _excluded = ["className", "sx", "children", "loading", "fullHeight"];
+var _excluded = ["className", "sx", "children", "loading", "fullHeight", "position"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
 function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
@@ -25,15 +25,20 @@ var Paper = function Paper(_ref) {
     children = _ref.children,
     loading = _ref.loading,
     fullHeight = _ref.fullHeight,
+    position = _ref.position,
     rest = _objectWithoutProperties(_ref, _excluded);
   var classes = (0, _style.default)();
   return /*#__PURE__*/_react.default.createElement(_material.Paper, {
-    className: (0, _clsx2.default)((_clsx = {}, _defineProperty(_clsx, classes.paper, true), _defineProperty(_clsx, classes.fullHeight, fullHeight), _defineProperty(_clsx, className, true), _clsx)),
+    className: (0, _clsx2.default)((_clsx = {}, _defineProperty(_clsx, classes.paper, true), _defineProperty(_clsx, classes.fullHeight, fullHeight), _defineProperty(_clsx, className, true), _defineProperty(_clsx, classes[position], true), _clsx)),
     sx: sx
   }, loading ? /*#__PURE__*/_react.default.createElement(_loader.default, null) : children);
 };
 Paper.propTypes = {
-  loading: _propTypes.default.bool
+  loading: _propTypes.default.bool,
+  position: _propTypes.default.oneOf(["static", "relative", "fixed", "absolute", "sticky"])
+};
+Paper.defaultProps = {
+  position: "static"
 };
 var _default = Paper;
 exports.default = _default;

package/{dist/components → components}/paper/style.js

@@ -13,6 +13,21 @@ var _default = (0, _styles.makeStyles)(function (theme) {
     },
     fullHeight: {
       height: "100%"
+    },
+    relative: {
+      position: "relative"
+    },
+    fixed: {
+      position: "fixed"
+    },
+    static: {
+      position: "static"
+    },
+    sticky: {
+      position: "sticky"
+    },
+    absolute: {
+      position: "absolute"
     }
   };
 });

package/{dist/components → components}/tree/index.js

@@ -38,7 +38,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 // color: '#90a17d'
 
 function Tree(props) {
-  var folder = props.folder;
+  var folder = props.folder,
+    projectName = props.projectName,
+    apiCallFunc = props.apiCallFunc;
   var _React$useState = React.useState(null),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     contextMenu = _React$useState2[0],
@@ -80,26 +82,26 @@ function Tree(props) {
     return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(_material.ThemeProvider, {
       theme: _default.default
     }, /*#__PURE__*/React.createElement(_material.CssBaseline, null), /*#__PURE__*/React.createElement(React.Fragment, {
-      key: nodes.nodeId
+      key: nodes.folderId
     }, /*#__PURE__*/React.createElement("div", {
       style: {
         marginBottom: isFirstLevel ? "8px" : null
       }
     }, /*#__PURE__*/React.createElement(_TreeItem.default, {
-      key: nodes.nodeId,
-      nodeId: nodes.nodeId,
+      key: nodes.folderId,
+      nodeId: nodes.folderId,
       onClick: function onClick() {
-        var isExpanded = expandedNodeIds.includes(nodes.nodeId);
+        var isExpanded = expandedNodeIds.includes(nodes.folderId);
         if (isExpanded) {
           setExpandedNodeIds(expandedNodeIds.filter(function (id) {
-            return id !== nodes.nodeId;
+            return id !== nodes.folderId;
           }));
         } else {
           var parent = getParentNode(nodes, folder);
           if (parent) {
-            setExpandedNodeIds([].concat(_toConsumableArray(expandedNodeIds), [parent.nodeId, nodes.nodeId]));
+            setExpandedNodeIds([].concat(_toConsumableArray(expandedNodeIds), [parent.folderId, nodes.folderId]));
           } else {
-            setExpandedNodeIds([].concat(_toConsumableArray(expandedNodeIds), [nodes.nodeId]));
+            setExpandedNodeIds([].concat(_toConsumableArray(expandedNodeIds), [nodes.folderId]));
           }
         }
       },
@@ -111,19 +113,22 @@ function Tree(props) {
       }, /*#__PURE__*/React.createElement(_material.Typography, {
         style: {
           // fontWeight: isFirstLevel ? 500 : "initial",
-          fontWeight: nodes.type === "project" ? 600 : nodes.type === "module" ? 600 : 500,
+          fontWeight: nodes.classificationType === "project" ? 600 : nodes.classificationType === "module" ? 600 : 500,
           // fontSize: "1rem",
-          fontSize: nodes.type === "project" ? "1rem" : nodes.type === "module" ? "1rem" : "0.92rem",
+          fontSize: nodes.classificationType === "project" ? "1rem" : nodes.classificationType === "module" ? "1rem" : "0.92rem",
           fontFamily: "sans-serif segoe ui",
-          padding: nodes.type === "sc" ? "inherit" : "6px"
+          padding: nodes.classificationType === "sc" ? "inherit" : "6px"
+        },
+        onClick: function onClick() {
+          return apiCallFunc(nodes.folderId);
         }
-      }, nodes.type === "project" ? expandedNodeIds.includes(nodes.nodeId) ?
+      }, nodes.classificationType === "project" ? expandedNodeIds.includes(nodes.nodeId) ?
       /*#__PURE__*/
       // <FcOpenedFolder style={{ marginRight: "10px" }} />
       React.createElement(React.Fragment, null) :
       /*#__PURE__*/
       // <FcFolder style={{ marginRight: "10px" }} />
-      React.createElement(React.Fragment, null) : nodes.type === "module" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_bi.BiMicrochip, {
+      React.createElement(React.Fragment, null) : nodes.classificationType === "module" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_bi.BiMicrochip, {
         style: {
           marginRight: "10px",
           color: "#03c988"
@@ -133,7 +138,7 @@ function Tree(props) {
           marginRight: "10px",
           color: "#90a17d"
         }
-      }) : nodes.type === "bp" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_bs.BsFillBriefcaseFill, {
+      }) : nodes.classificationType === "bp" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_bs.BsFillBriefcaseFill, {
         style: {
           marginRight: "10px",
           color: "#03c988"
@@ -143,7 +148,7 @@ function Tree(props) {
           marginRight: "10px",
           color: "#90a17d"
         }
-      }) : nodes.type === "sc" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_fa.FaClipboardList, {
+      }) : nodes.classificationType === "sc" ? expandedNodeIds.includes(nodes.nodeId) ? /*#__PURE__*/React.createElement(_fa.FaClipboardList, {
         style: {
           marginRight: "10px",
           color: "#03c988"
@@ -165,7 +170,7 @@ function Tree(props) {
         }
       }), nodes.name)),
       onContextMenu: function onContextMenu(event) {
-        return handleContextMenu(event, nodes.nodeId);
+        return handleContextMenu(event, nodes.folderId);
       }
     }, Array.isArray(nodes.children) ? nodes.children.map(function (node) {
       return renderTree(node, false);
@@ -178,7 +183,7 @@ function Tree(props) {
     style: {
       cursor: "context-menu"
     }
-  }, /*#__PURE__*/React.createElement(_TreeView.default, {
+  }, /*#__PURE__*/React.createElement("h3", null, projectName), /*#__PURE__*/React.createElement(_TreeView.default, {
     "aria-label": "multi-select",
     defaultCollapseIcon: /*#__PURE__*/React.createElement(_ExpandMore.default, null),
     defaultExpandIcon: /*#__PURE__*/React.createElement(_ChevronRight.default, null),

package/package.json

@@ -1,117 +1,118 @@
-{
-  "name": "tenjin-ui-kit",
-  "version": "0.2.110",
-  "repository": {
-    "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
-  },
-  "dependencies": {
-    "@floating-ui/dom": "^1.2.1",
-    "@mantine/core": "^5.10.1",
-    "@mantine/hooks": "^5.10.1",
-    "@mantine/rte": "^5.10.1",
-    "@mui/icons-material": "^5.11.0",
-    "@mui/lab": "^5.0.0-alpha.116",
-    "@mui/styles": "^5.11.2",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^13.4.0",
-    "@testing-library/user-event": "^13.5.0",
-    "aria-hidden": "^1.2.2",
-    "axios": "^0.26.0",
-    "clsx": "^1.2.1",
-    "d3-hierarchy": "^3.1.2",
-    "feather-icons": "^4.29.0",
-    "final-form": "^4.20.9",
-    "material-ui-popup-state": "^5.0.8",
-    "moment": "^2.29.4",
-    "react-beautiful-dnd": "^13.1.1",
-    "react-dnd": "^16.0.1",
-    "react-dnd-html5-backend": "^16.0.1",
-    "react-dropzone": "^14.2.3",
-    "react-feather": "^2.0.10",
-    "react-final-form": "^6.5.9",
-    "react-flow-renderer": "^10.3.17",
-    "react-icons": "^4.7.1",
-    "react-moment": "^1.1.3",
-    "react-scripts": "5.0.1",
-    "react-sortable-hoc": "^2.0.0",
-    "reactflow": "^11.6.1",
-    "storybook-react-context": "^0.6.0",
-    "styled-components": "^5.3.9",
-    "web-vitals": "^2.1.4"
-  },
-  "scripts": {
-    "start": "react-scripts start",
-    "build": "react-scripts build",
-    "test": "react-scripts test",
-    "eject": "react-scripts eject",
-    "storybook": "start-storybook -p 6006 -s public",
-    "build-storybook": "build-storybook -s public",
-    "clean": "rimraf dist",
-    "compile": "npm run clean && cross-env NODE_ENV=production babel src/package --out-dir dist --copy-files --ignore __tests__,spec.js,test.js,stories.js,__snapshots__"
-  },
-  "eslintConfig": {
-    "extends": [
-      "react-app",
-      "react-app/jest"
-    ],
-    "overrides": [
-      {
-        "files": [
-          "**/*.stories.*"
-        ],
-        "rules": {
-          "import/no-anonymous-default-export": "off"
-        }
-      }
-    ]
-  },
-  "browserslist": {
-    "production": [
-      ">0.2%",
-      "not dead",
-      "not op_mini all"
-    ],
-    "development": [
-      "last 1 chrome version",
-      "last 1 firefox version",
-      "last 1 safari version"
-    ]
-  },
-  "devDependencies": {
-    "@babel/cli": "^7.20.7",
-    "@babel/preset-env": "^7.20.2",
-    "@babel/preset-react": "^7.18.6",
-    "@emotion/react": "^11.10.5",
-    "@emotion/styled": "^11.10.5",
-    "@mui/material": "^5.11.3",
-    "@storybook/addon-actions": "^6.5.15",
-    "@storybook/addon-essentials": "^6.5.15",
-    "@storybook/addon-interactions": "^6.5.15",
-    "@storybook/addon-links": "^6.5.15",
-    "@storybook/builder-webpack5": "^6.5.15",
-    "@storybook/manager-webpack5": "^6.5.15",
-    "@storybook/node-logger": "^6.5.15",
-    "@storybook/preset-create-react-app": "^4.1.2",
-    "@storybook/react": "^6.5.15",
-    "@storybook/testing-library": "^0.0.13",
-    "babel-plugin-named-exports-order": "^0.0.2",
-    "cross-env": "^7.0.3",
-    "prop-types": "^15.8.1",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.6.1",
-    "rimraf": "^3.0.2",
-    "webpack": "^5.75.0"
-  },
-  "peerDependencies": {
-    "@emotion/react": "^11.10.5",
-    "@emotion/styled": "^11.10.5",
-    "@mui/material": "^5.11.3",
-    "@testing-library/jest-dom": "^5.16.5",
-    "@testing-library/react": "^13.4.0",
-    "@testing-library/user-event": "^13.5.0",
-    "react": "^18.2.0",
-    "react-dom": "^18.2.0",
-    "react-router-dom": "^6.6.1"
-  }
-}
+{
+  "name": "tenjin-ui-kit",
+  "version": "0.2.114",
+  "repository": {
+    "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
+  },
+  "dependencies": {
+    "@floating-ui/dom": "^1.2.1",
+    "@mantine/core": "^5.10.1",
+    "@mantine/hooks": "^5.10.1",
+    "@mantine/rte": "^5.10.1",
+    "@mui/icons-material": "^5.11.0",
+    "@mui/lab": "^5.0.0-alpha.116",
+    "@mui/styles": "^5.11.2",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "aria-hidden": "^1.2.2",
+    "axios": "^0.26.0",
+    "clsx": "^1.2.1",
+    "d3-hierarchy": "^3.1.2",
+    "feather-icons": "^4.29.0",
+    "final-form": "^4.20.9",
+    "material-ui-popup-state": "^5.0.8",
+    "moment": "^2.29.4",
+    "react-beautiful-dnd": "^13.1.1",
+    "react-dnd": "^16.0.1",
+    "react-dnd-html5-backend": "^16.0.1",
+    "react-dropzone": "^14.2.3",
+    "react-feather": "^2.0.10",
+    "react-final-form": "^6.5.9",
+    "react-flow-renderer": "^10.3.17",
+    "react-icons": "^4.7.1",
+    "react-moment": "^1.1.3",
+    "react-scripts": "5.0.1",
+    "react-sortable-hoc": "^2.0.0",
+    "reactflow": "^11.6.1",
+    "storybook-react-context": "^0.6.0",
+    "styled-components": "^5.3.9",
+    "uuid": "^9.0.0",
+    "web-vitals": "^2.1.4"
+  },
+  "scripts": {
+    "start": "react-scripts start",
+    "build": "react-scripts build",
+    "test": "react-scripts test",
+    "eject": "react-scripts eject",
+    "storybook": "start-storybook -p 6006 -s public",
+    "build-storybook": "build-storybook -s public",
+    "clean": "rimraf dist",
+    "compile": "npm run clean && cross-env NODE_ENV=production babel src/package --out-dir dist --copy-files --ignore __tests__,spec.js,test.js,stories.js,__snapshots__"
+  },
+  "eslintConfig": {
+    "extends": [
+      "react-app",
+      "react-app/jest"
+    ],
+    "overrides": [
+      {
+        "files": [
+          "**/*.stories.*"
+        ],
+        "rules": {
+          "import/no-anonymous-default-export": "off"
+        }
+      }
+    ]
+  },
+  "browserslist": {
+    "production": [
+      ">0.2%",
+      "not dead",
+      "not op_mini all"
+    ],
+    "development": [
+      "last 1 chrome version",
+      "last 1 firefox version",
+      "last 1 safari version"
+    ]
+  },
+  "devDependencies": {
+    "@babel/cli": "^7.20.7",
+    "@babel/preset-env": "^7.20.2",
+    "@babel/preset-react": "^7.18.6",
+    "@emotion/react": "^11.10.5",
+    "@emotion/styled": "^11.10.5",
+    "@mui/material": "^5.11.3",
+    "@storybook/addon-actions": "^6.5.15",
+    "@storybook/addon-essentials": "^6.5.15",
+    "@storybook/addon-interactions": "^6.5.15",
+    "@storybook/addon-links": "^6.5.15",
+    "@storybook/builder-webpack5": "^6.5.15",
+    "@storybook/manager-webpack5": "^6.5.15",
+    "@storybook/node-logger": "^6.5.15",
+    "@storybook/preset-create-react-app": "^4.1.2",
+    "@storybook/react": "^6.5.15",
+    "@storybook/testing-library": "^0.0.13",
+    "babel-plugin-named-exports-order": "^0.0.2",
+    "cross-env": "^7.0.3",
+    "prop-types": "^15.8.1",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.6.1",
+    "rimraf": "^3.0.2",
+    "webpack": "^5.75.0"
+  },
+  "peerDependencies": {
+    "@emotion/react": "^11.10.5",
+    "@emotion/styled": "^11.10.5",
+    "@mui/material": "^5.11.3",
+    "@testing-library/jest-dom": "^5.16.5",
+    "@testing-library/react": "^13.4.0",
+    "@testing-library/user-event": "^13.5.0",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "react-router-dom": "^6.6.1"
+  }
+}

package/.dockerignore

@@ -1,6 +0,0 @@
-node_modules
-build
-.dockerignore
-Dockerfile
-Dockerfile.prod
-storybook-static