tenjin-ui-kit 0.2.116 → 0.2.118

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -9,84 +9,141 @@ var _material = require("@mui/material");
9
9
  var React = _interopRequireWildcard(require("react"));
10
10
  var _text = _interopRequireDefault(require("../text"));
11
11
  var _KeyboardDoubleArrowRight = _interopRequireDefault(require("@mui/icons-material/KeyboardDoubleArrowRight"));
12
- var _Stack = _interopRequireDefault(require("@mui/material/Stack"));
13
12
  var _reactRouterDom = require("react-router-dom");
13
+ var _button = _interopRequireDefault(require("../button"));
14
+ var _MoreHoriz = _interopRequireDefault(require("@mui/icons-material/MoreHoriz"));
14
15
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
16
  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); }
16
17
  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; }
17
- // import Link from "@mui/material/Link";
18
-
18
+ 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; }
19
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
20
+ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
21
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
22
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
23
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
24
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
25
+ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
26
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
19
27
  function BreadCrumbs(props) {
20
- var _props$crumbInfo, _props$crumbInfo$2, _props$crumbInfo$3, _props$crumbInfo$4, _props$crumbInfo$5, _props$crumbInfo$5$ti, _props$crumbInfo$6, _props$crumbInfo$7, _props$crumbInfo$7$ti, _props$crumbInfo$8;
28
+ var _crumbInfo$2, _ref, _crumbInfo$3, _crumbInfo$3$title, _crumbInfo$4, _crumbInfo$5, _crumbInfo$5$title, _crumbInfo$6;
21
29
  var navigate = (0, _reactRouterDom.useNavigate)();
22
- var windowSm = (0, _material.useMediaQuery)("(max-width:960px)");
30
+ // const windowSm = useMediaQuery("(max-width:960px)");
31
+
32
+ var crumbInfo = props.crumbInfo;
33
+ var displayCrumbs = crumbInfo.length > 4 ? [crumbInfo[crumbInfo.length - 2], crumbInfo[crumbInfo.length - 1]] : crumbInfo;
34
+ var _useState = (0, React.useState)(false),
35
+ _useState2 = _slicedToArray(_useState, 2),
36
+ menuOpen = _useState2[0],
37
+ setMenuOpen = _useState2[1];
38
+ var _useState3 = (0, React.useState)(null),
39
+ _useState4 = _slicedToArray(_useState3, 2),
40
+ anchorEl = _useState4[0],
41
+ setAnchorEl = _useState4[1];
42
+ var handleMenuClick = function handleMenuClick(event) {
43
+ setAnchorEl(event.currentTarget);
44
+ setMenuOpen(true);
45
+ };
23
46
  function handleClick(event, data) {
24
47
  event.preventDefault();
25
48
  if (data !== undefined) {
26
49
  navigate(data);
27
50
  }
28
51
  }
52
+ var handleMenuClose = function handleMenuClose(event, data) {
53
+ if (data !== undefined) {
54
+ navigate(data);
55
+ }
56
+ setMenuOpen(false);
57
+ };
29
58
  return /*#__PURE__*/React.createElement("div", {
30
59
  style: {
31
60
  display: "flex",
32
61
  flexGrow: 1
33
62
  },
34
63
  role: "presentation"
35
- // onClick={handleClick}
36
- }, !windowSm ? /*#__PURE__*/React.createElement(_Stack.default, {
37
- spacing: 2
38
64
  }, /*#__PURE__*/React.createElement(_material.Breadcrumbs, {
39
65
  separator: /*#__PURE__*/React.createElement(_KeyboardDoubleArrowRight.default, {
40
66
  fontSize: "small"
41
67
  }),
42
- "aria-label": "breadcrumb",
43
- maxItems: 3
44
- }, props.crumbInfo && ((_props$crumbInfo = props.crumbInfo) === null || _props$crumbInfo === void 0 ? void 0 : _props$crumbInfo.map(function (data, key) {
45
- var _data$title, _data$title2;
68
+ "aria-label": "breadcrumb"
69
+ }, crumbInfo.length > 4 && /*#__PURE__*/React.createElement("div", {
70
+ onClick: function onClick(e) {
71
+ var _crumbInfo$;
72
+ return handleClick(e, (_crumbInfo$ = crumbInfo[0]) === null || _crumbInfo$ === void 0 ? void 0 : _crumbInfo$.link);
73
+ },
74
+ style: (_ref = {
75
+ display: "flex",
76
+ alignItems: "center",
77
+ textDecoration: "none",
78
+ fontWeight: 'bold',
79
+ color: (_crumbInfo$2 = crumbInfo[0]) !== null && _crumbInfo$2 !== void 0 && _crumbInfo$2.active ? "#000000DE" : "#44409A"
80
+ }, _defineProperty(_ref, "fontWeight", 500), _defineProperty(_ref, "cursor", crumbInfo[0].active !== true && "pointer"), _ref)
81
+ }, /*#__PURE__*/React.createElement("span", {
82
+ style: {
83
+ display: "flex",
84
+ marginRight: "3px"
85
+ }
86
+ }, crumbInfo[0].icon), ((_crumbInfo$3 = crumbInfo[0]) === null || _crumbInfo$3 === void 0 ? void 0 : (_crumbInfo$3$title = _crumbInfo$3.title) === null || _crumbInfo$3$title === void 0 ? void 0 : _crumbInfo$3$title.length) > 20 ? /*#__PURE__*/React.createElement(_material.Tooltip, {
87
+ title: (_crumbInfo$4 = crumbInfo[0]) === null || _crumbInfo$4 === void 0 ? void 0 : _crumbInfo$4.title,
88
+ arrow: true,
89
+ placement: "top"
90
+ }, /*#__PURE__*/React.createElement("span", null, ((_crumbInfo$5 = crumbInfo[0]) === null || _crumbInfo$5 === void 0 ? void 0 : (_crumbInfo$5$title = _crumbInfo$5.title) === null || _crumbInfo$5$title === void 0 ? void 0 : _crumbInfo$5$title.slice(0, 20)) + "...")) : /*#__PURE__*/React.createElement(_text.default, null, (_crumbInfo$6 = crumbInfo[0]) === null || _crumbInfo$6 === void 0 ? void 0 : _crumbInfo$6.title)), crumbInfo.length > 4 && /*#__PURE__*/React.createElement(_button.default, {
91
+ color: "inherit",
92
+ variant: "text",
93
+ onClick: handleMenuClick,
94
+ style: {
95
+ minWidth: "20px",
96
+ padding: '0'
97
+ }
98
+ }, /*#__PURE__*/React.createElement(_MoreHoriz.default, {
99
+ style: {
100
+ color: "#44409A"
101
+ }
102
+ })), displayCrumbs.map(function (breadcrumb, index) {
103
+ var _breadcrumb$title, _breadcrumb$title2;
46
104
  return /*#__PURE__*/React.createElement("div", {
47
- key: key
48
- // to={data?.link}
49
- ,
105
+ key: index,
50
106
  onClick: function onClick(e) {
51
- return handleClick(e, data === null || data === void 0 ? void 0 : data.link);
107
+ return handleClick(e, breadcrumb === null || breadcrumb === void 0 ? void 0 : breadcrumb.link);
52
108
  },
53
109
  style: {
110
+ display: "flex",
111
+ alignItems: "center",
54
112
  textDecoration: "none",
55
- color: data !== null && data !== void 0 && data.active ? "#000000DE" : "#44409A",
113
+ color: breadcrumb !== null && breadcrumb !== void 0 && breadcrumb.active ? "#000000DE" : "#44409A",
56
114
  fontWeight: 500,
57
- cursor: data.active !== true && "pointer"
115
+ cursor: breadcrumb.active !== true && "pointer"
58
116
  }
59
- }, /*#__PURE__*/React.createElement("span", null, data.icon), (data === null || data === void 0 ? void 0 : (_data$title = data.title) === null || _data$title === void 0 ? void 0 : _data$title.length) > 20 ? /*#__PURE__*/React.createElement(_material.Tooltip, {
60
- title: data === null || data === void 0 ? void 0 : data.title,
117
+ }, /*#__PURE__*/React.createElement("span", {
118
+ style: {
119
+ display: "flex",
120
+ marginRight: "3px"
121
+ }
122
+ }, breadcrumb.icon), (breadcrumb === null || breadcrumb === void 0 ? void 0 : (_breadcrumb$title = breadcrumb.title) === null || _breadcrumb$title === void 0 ? void 0 : _breadcrumb$title.length) > 20 ? /*#__PURE__*/React.createElement(_material.Tooltip, {
123
+ title: breadcrumb === null || breadcrumb === void 0 ? void 0 : breadcrumb.title,
61
124
  arrow: true,
62
125
  placement: "top"
63
- }, /*#__PURE__*/React.createElement("span", null, (data === null || data === void 0 ? void 0 : (_data$title2 = data.title) === null || _data$title2 === void 0 ? void 0 : _data$title2.slice(0, 20)) + "...")) : /*#__PURE__*/React.createElement(_text.default, null, data === null || data === void 0 ? void 0 : data.title));
64
- })))) : /*#__PURE__*/React.createElement(_Stack.default, {
65
- spacing: 2
66
- }, /*#__PURE__*/React.createElement(_material.Breadcrumbs, {
67
- separator: /*#__PURE__*/React.createElement(_KeyboardDoubleArrowRight.default, {
68
- fontSize: "small"
69
- }),
70
- "aria-label": "breadcrumb"
71
- }, /*#__PURE__*/React.createElement("div", {
72
- // to={props.crumbInfo[0]?.link}
73
- onClick: function onClick(e) {
74
- var _props$crumbInfo$;
75
- return handleClick(e, (_props$crumbInfo$ = props.crumbInfo[0]) === null || _props$crumbInfo$ === void 0 ? void 0 : _props$crumbInfo$.link);
76
- },
77
- style: {
78
- textDecoration: "none",
79
- color: (_props$crumbInfo$2 = props.crumbInfo[0]) !== null && _props$crumbInfo$2 !== void 0 && _props$crumbInfo$2.active ? "#000000DE" : "#44409A",
80
- fontWeight: 500,
81
- cursor: ((_props$crumbInfo$3 = props.crumbInfo[0]) === null || _props$crumbInfo$3 === void 0 ? void 0 : _props$crumbInfo$3.active) !== true && "pointer"
126
+ }, /*#__PURE__*/React.createElement("span", null, /*#__PURE__*/React.createElement(_text.default, null, (breadcrumb === null || breadcrumb === void 0 ? void 0 : (_breadcrumb$title2 = breadcrumb.title) === null || _breadcrumb$title2 === void 0 ? void 0 : _breadcrumb$title2.slice(0, 20)) + "..."))) : /*#__PURE__*/React.createElement(_text.default, null, breadcrumb === null || breadcrumb === void 0 ? void 0 : breadcrumb.title));
127
+ })), /*#__PURE__*/React.createElement(_material.Menu, {
128
+ anchorEl: anchorEl,
129
+ open: menuOpen,
130
+ onClose: handleMenuClose,
131
+ sx: {
132
+ minWidth: "200px",
133
+ maxHeight: "220px"
82
134
  }
83
- }, /*#__PURE__*/React.createElement("span", {
84
- style: {
85
- margin: "0.5rem 0.4rem 0rem 0rem"
86
- }
87
- }, (_props$crumbInfo$4 = props.crumbInfo[0]) === null || _props$crumbInfo$4 === void 0 ? void 0 : _props$crumbInfo$4.icon), ((_props$crumbInfo$5 = props.crumbInfo[0]) === null || _props$crumbInfo$5 === void 0 ? void 0 : (_props$crumbInfo$5$ti = _props$crumbInfo$5.title) === null || _props$crumbInfo$5$ti === void 0 ? void 0 : _props$crumbInfo$5$ti.length) > 20 ? /*#__PURE__*/React.createElement(_material.Tooltip, {
88
- title: (_props$crumbInfo$6 = props.crumbInfo[0]) === null || _props$crumbInfo$6 === void 0 ? void 0 : _props$crumbInfo$6.title,
89
- arrow: true,
90
- placement: "top"
91
- }, /*#__PURE__*/React.createElement(_text.default, null, ((_props$crumbInfo$7 = props.crumbInfo[0]) === null || _props$crumbInfo$7 === void 0 ? void 0 : (_props$crumbInfo$7$ti = _props$crumbInfo$7.title) === null || _props$crumbInfo$7$ti === void 0 ? void 0 : _props$crumbInfo$7$ti.slice(0, 20)) + "...")) : /*#__PURE__*/React.createElement(_text.default, null, (_props$crumbInfo$8 = props.crumbInfo[0]) === null || _props$crumbInfo$8 === void 0 ? void 0 : _props$crumbInfo$8.title)))));
135
+ }, crumbInfo.slice(1, crumbInfo.length - 2).map(function (breadcrumb, index) {
136
+ var _ref2;
137
+ return /*#__PURE__*/React.createElement(_material.MenuItem, {
138
+ key: index,
139
+ onClick: function onClick(e) {
140
+ return handleMenuClose(e, breadcrumb === null || breadcrumb === void 0 ? void 0 : breadcrumb.link);
141
+ },
142
+ sx: (_ref2 = {
143
+ textDecoration: "none",
144
+ fontWeight: 'bold',
145
+ color: breadcrumb !== null && breadcrumb !== void 0 && breadcrumb.active ? "#000000DE" : "#44409A"
146
+ }, _defineProperty(_ref2, "fontWeight", 500), _defineProperty(_ref2, "cursor", breadcrumb.active !== true && "pointer"), _ref2)
147
+ }, /*#__PURE__*/React.createElement(_text.default, null, breadcrumb === null || breadcrumb === void 0 ? void 0 : breadcrumb.title));
148
+ })));
92
149
  }
@@ -25,8 +25,10 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
25
25
  function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
26
26
  function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
27
27
  var BrowsingTestCaseLayout = function BrowsingTestCaseLayout(_ref) {
28
- var children = _ref.children;
29
- // return <div className="browsing-test-case-layout">{children}</div>;
28
+ var collapse = _ref.collapse,
29
+ children = _ref.children;
30
+ // return <div className="browsing-test-case-layout">{children}</div>;
31
+ // console.log("Browser", children);
30
32
  var _useState = (0, _react.useState)(false),
31
33
  _useState2 = _slicedToArray(_useState, 2),
32
34
  isHandlerDragging = _useState2[0],
@@ -56,6 +58,11 @@ var BrowsingTestCaseLayout = function BrowsingTestCaseLayout(_ref) {
56
58
  var handleMouseUp = function handleMouseUp(e) {
57
59
  setIsHandlerDragging(false);
58
60
  };
61
+ _react.default.useEffect(function () {
62
+ if (collapse) {
63
+ setExpand(false);
64
+ }
65
+ }, []);
59
66
  _react.default.useEffect(function () {
60
67
  if (expand) {
61
68
  document.addEventListener("mousemove", handleMouseMove);
@@ -1,5 +1,6 @@
1
1
  "use strict";
2
2
 
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
3
4
  Object.defineProperty(exports, "__esModule", {
4
5
  value: true
5
6
  });
@@ -11,9 +12,14 @@ var _styles = require("@mui/material/styles");
11
12
  var _react = _interopRequireDefault(require("react"));
12
13
  var _propTypes = _interopRequireDefault(require("prop-types"));
13
14
  var _text = _interopRequireDefault(require("../text"));
14
- var _excluded = ["label", "id", "fullWidth", "disableAutocomplete", "startIcon", "endIcon", "size", "error", "errorMessage", "isRequired", "isDisabled", "isPastDateDisabled"];
15
+ var _excluded = ["label", "id", "fullWidth", "disableAutocomplete", "startIcon", "endIcon", "size", "error", "errorMessage", "isRequired", "isDisabled", "isPastDateDisabled", "readOnly"];
15
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
16
17
  function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
18
+ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
19
+ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
20
+ 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; }
21
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
22
+ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
17
23
  function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
18
24
  function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
19
25
  var Input = function Input(_ref) {
@@ -29,29 +35,29 @@ var Input = function Input(_ref) {
29
35
  isRequired = _ref.isRequired,
30
36
  isDisabled = _ref.isDisabled,
31
37
  isPastDateDisabled = _ref.isPastDateDisabled,
38
+ readOnly = _ref.readOnly,
32
39
  rest = _objectWithoutProperties(_ref, _excluded);
33
40
  var theme = (0, _styles.useTheme)();
34
41
  var minDate = new Date().toISOString().split("T")[0];
35
42
  return /*#__PURE__*/_react.default.createElement(_FormControl.default, {
36
43
  variant: "standard",
37
44
  fullWidth: fullWidth
38
- }, label && /*#__PURE__*/_react.default.createElement(_InputLabel.default, {
45
+ }, label && /*#__PURE__*/_react.default.createElement(_material.FormLabel, {
39
46
  sx: {
47
+ fontSize: "0.8rem",
40
48
  fontWeight: 500,
41
- "& .MuiFormLabel-asterisk": {
42
- color: "#FF0000"
43
- }
49
+ paddingBottom: "0.2rem"
44
50
  },
45
- size: "small",
46
- shrink: true,
47
- htmlFor: id,
48
- required: isRequired
49
- }, /*#__PURE__*/_react.default.createElement(_text.default, null, label)), !error && /*#__PURE__*/_react.default.createElement(_material.OutlinedInput, _extends({
51
+ htmlFor: id
52
+ }, /*#__PURE__*/_react.default.createElement(_text.default, null, label, isRequired ? /*#__PURE__*/_react.default.createElement("span", {
53
+ style: {
54
+ color: "red"
55
+ }
56
+ }, " * ") : "")), !error && /*#__PURE__*/_react.default.createElement(_material.OutlinedInput, _extends({
50
57
  id: id,
51
58
  required: isRequired,
52
59
  autoComplete: disableAutocomplete ? "nothing" : null,
53
60
  sx: {
54
- marginTop: label ? theme.spacing(2.5) : 0,
55
61
  "& input": {
56
62
  backgroundColor: isDisabled && "#DDDDDD",
57
63
  color: isDisabled && "#000000"
@@ -68,9 +74,11 @@ var Input = function Input(_ref) {
68
74
  endAdornment: endIcon,
69
75
  helperText: errorMessage,
70
76
  disabled: isDisabled,
71
- inputProps: isPastDateDisabled && {
77
+ inputProps: _objectSpread({
78
+ readOnly: readOnly ? 'readOnly' : null
79
+ }, isPastDateDisabled && {
72
80
  min: minDate
73
- }
81
+ })
74
82
  }, rest)), error && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_material.TextField, _extends({
75
83
  required: isRequired,
76
84
  id: id,
@@ -81,7 +89,6 @@ var Input = function Input(_ref) {
81
89
  backgroundColor: isDisabled && "#DDDDDD",
82
90
  color: isDisabled && "#000000"
83
91
  },
84
- marginTop: label ? theme.spacing(2.5) : 0,
85
92
  "& label": {
86
93
  fontWeight: 500
87
94
  },
@@ -94,9 +101,11 @@ var Input = function Input(_ref) {
94
101
  endAdornment: endIcon,
95
102
  helperText: errorMessage,
96
103
  error: true,
97
- inputProps: isPastDateDisabled && {
104
+ inputProps: _objectSpread({
105
+ readOnly: readOnly ? 'readOnly' : null
106
+ }, isPastDateDisabled && {
98
107
  min: minDate
99
- }
108
+ })
100
109
  }, rest))));
101
110
  };
102
111
  Input.propTypes = {
@@ -108,7 +117,8 @@ Input.propTypes = {
108
117
  disableAutocomplete: _propTypes.default.bool,
109
118
  size: _propTypes.default.string,
110
119
  isRequired: _propTypes.default.bool,
111
- isDisabled: _propTypes.default.bool
120
+ isDisabled: _propTypes.default.bool,
121
+ readOnly: _propTypes.default.bool // Added readOnly prop type
112
122
  };
113
123
  var _default = Input;
114
124
  exports.default = _default;
@@ -0,0 +1,80 @@
1
+ "use strict";
2
+
3
+ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
4
+ Object.defineProperty(exports, "__esModule", {
5
+ value: true
6
+ });
7
+ exports.default = void 0;
8
+ var _react = _interopRequireWildcard(require("react"));
9
+ var _material = require("@mui/material");
10
+ var _text = _interopRequireDefault(require("../text"));
11
+ var _reactRouterDom = require("react-router-dom");
12
+ var _propTypes = _interopRequireDefault(require("prop-types"));
13
+ var _button = _interopRequireDefault(require("../button"));
14
+ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
15
+ 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); }
16
+ 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; }
17
+ 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; }
18
+ function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
19
+ function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
20
+ function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
21
+ function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
22
+ function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
23
+ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
24
+ function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
25
+ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
26
+ var Menu = function Menu(props) {
27
+ var navigate = (0, _reactRouterDom.useNavigate)();
28
+ var _useState = (0, _react.useState)(null),
29
+ _useState2 = _slicedToArray(_useState, 2),
30
+ anchorEl = _useState2[0],
31
+ setAnchorEl = _useState2[1];
32
+ var _useState3 = (0, _react.useState)(false),
33
+ _useState4 = _slicedToArray(_useState3, 2),
34
+ menuOpen = _useState4[0],
35
+ setMenuOpen = _useState4[1];
36
+ var items = props.items;
37
+ var handleClick = function handleClick(event) {
38
+ setMenuOpen(true);
39
+ setAnchorEl(event.currentTarget);
40
+ };
41
+ var handleMenuItemClick = function handleMenuItemClick(event, data) {
42
+ event.preventDefault();
43
+ if (data !== undefined) {
44
+ navigate(data);
45
+ }
46
+ setMenuOpen(false);
47
+ setAnchorEl(null);
48
+ };
49
+ var handleClose = function handleClose(event, data) {
50
+ setMenuOpen(false);
51
+ };
52
+ return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_button.default, {
53
+ onClick: handleClick
54
+ }, "Open Menu"), /*#__PURE__*/_react.default.createElement(_material.Menu, {
55
+ anchorEl: anchorEl,
56
+ open: menuOpen,
57
+ onClose: handleClose,
58
+ sx: {
59
+ minWidth: "200px",
60
+ maxHeight: "220px"
61
+ }
62
+ }, items.map(function (item, index) {
63
+ var _ref;
64
+ return /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
65
+ key: index,
66
+ onClick: function onClick(e) {
67
+ return handleMenuItemClick(e, item === null || item === void 0 ? void 0 : item.link);
68
+ },
69
+ sx: (_ref = {
70
+ textDecoration: "none",
71
+ fontWeight: "bold"
72
+ }, _defineProperty(_ref, "fontWeight", 500), _defineProperty(_ref, "cursor", "pointer"), _ref)
73
+ }, /*#__PURE__*/_react.default.createElement(_text.default, null, item === null || item === void 0 ? void 0 : item.name));
74
+ })));
75
+ };
76
+ Menu.propTypes = {
77
+ items: _propTypes.default.array.isRequired
78
+ };
79
+ var _default = Menu;
80
+ exports.default = _default;
@@ -10,6 +10,7 @@ var _react = _interopRequireWildcard(require("react"));
10
10
  var _fi = require("react-icons/fi");
11
11
  var _input = _interopRequireDefault(require("../input"));
12
12
  var _text = _interopRequireDefault(require("../text"));
13
+ var colors = _interopRequireWildcard(require("@mui/material/colors"));
13
14
  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); }
14
15
  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; }
15
16
  function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
@@ -45,11 +46,14 @@ var ValueSelector = function ValueSelector(_ref) {
45
46
  var options = _ref.options,
46
47
  valueKey = _ref.valueKey,
47
48
  displayKey = _ref.displayKey,
49
+ avatarKey = _ref.avatarKey,
50
+ colorKey = _ref.colorKey,
48
51
  onChange = _ref.onChange,
49
52
  multiple = _ref.multiple,
50
53
  defaultSelectedOptionIds = _ref.defaultSelectedOptionIds,
51
54
  fetchData = _ref.fetchData,
52
- showClearItems = _ref.showClearItems;
55
+ showClearItems = _ref.showClearItems,
56
+ showAvatar = _ref.showAvatar;
53
57
  var theme = (0, _material.useTheme)();
54
58
  var _useState = (0, _react.useState)(false),
55
59
  _useState2 = _slicedToArray(_useState, 2),
@@ -181,6 +185,8 @@ var ValueSelector = function ValueSelector(_ref) {
181
185
  onChange([]);
182
186
  setLocalOptions(newOptions);
183
187
  };
188
+ // console.log("hi", options);
189
+
184
190
  return /*#__PURE__*/_react.default.createElement(_material.List, {
185
191
  dense: true,
186
192
  disablePadding: true
@@ -208,6 +214,8 @@ var ValueSelector = function ValueSelector(_ref) {
208
214
  return setFilter(e.target.value);
209
215
  }
210
216
  })), filteredLocalOptions.map(function (o) {
217
+ var altVal = o[avatarKey] === "/" ? " " : o[displayKey];
218
+ var bgcAvatar = colors[o[colorKey]] ? colors[o[colorKey]][500] : "red";
211
219
  return /*#__PURE__*/_react.default.createElement(_material.ListItem, {
212
220
  dense: true,
213
221
  disablePadding: true,
@@ -227,6 +235,12 @@ var ValueSelector = function ValueSelector(_ref) {
227
235
  checked: o.selected === true,
228
236
  disableRipple: true,
229
237
  size: "small"
238
+ })), showAvatar && /*#__PURE__*/_react.default.createElement(_material.ListItemAvatar, null, /*#__PURE__*/_react.default.createElement(_material.Avatar, {
239
+ sx: {
240
+ bgcolor: bgcAvatar
241
+ },
242
+ alt: altVal,
243
+ src: o[avatarKey]
230
244
  })), /*#__PURE__*/_react.default.createElement(_material.ListItemText, null, /*#__PURE__*/_react.default.createElement(_text.default, null, o[displayKey]))));
231
245
  })), showClearItems && /*#__PURE__*/_react.default.createElement(_material.ListItem, {
232
246
  dense: true,
@@ -32,7 +32,10 @@ var ValuePicker = function ValuePicker(_ref) {
32
32
  defaultSelectedOptions = _ref.defaultSelectedOptions,
33
33
  fetchData = _ref.fetchData,
34
34
  showSelectedValue = _ref.showSelectedValue,
35
- buttonVariant = _ref.buttonVariant;
35
+ buttonVariant = _ref.buttonVariant,
36
+ avatarKey = _ref.avatarKey,
37
+ colorKey = _ref.colorKey,
38
+ showAvatar = _ref.showAvatar;
36
39
  var _useState = (0, _react.useState)(false),
37
40
  _useState2 = _slicedToArray(_useState, 2),
38
41
  menuExpanded = _useState2[0],
@@ -62,9 +65,7 @@ var ValuePicker = function ValuePicker(_ref) {
62
65
  return /*#__PURE__*/_react.default.createElement("div", null, /*#__PURE__*/_react.default.createElement(_button.default, {
63
66
  endIcon: /*#__PURE__*/_react.default.createElement(_KeyboardArrowDown.default, null),
64
67
  variant: buttonVariant,
65
- onClick: handleMenuOpen
66
- // color={buttonVariant==="text" && 'primary'}
67
- ,
68
+ onClick: handleMenuOpen,
68
69
  color: menuExpanded || atleastOneItemSelected ? "primary" : buttonVariant === "text" ? 'primary' : "info"
69
70
  }, showSelectedValue ? /*#__PURE__*/_react.default.createElement(_text.default, null, "".concat(label).concat(atleastOneItemSelected ? ": ".concat(selectedValues[0][displayKey]).concat(selectedValues.length > 1 ? " +".concat(selectedValues.length - 1) : "") : "")) : /*#__PURE__*/_react.default.createElement(_text.default, {
70
71
  semibold: true
@@ -105,6 +106,9 @@ var ValuePicker = function ValuePicker(_ref) {
105
106
  }),
106
107
  valueKey: valueKey,
107
108
  displayKey: displayKey,
109
+ avatarKey: avatarKey,
110
+ colorKey: colorKey,
111
+ showAvatar: showAvatar,
108
112
  onChange: handleChange,
109
113
  multiple: multiple,
110
114
  fetchData: fetchData,
package/dist/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tenjin-ui-kit",
3
- "version": "0.2.116",
3
+ "version": "0.2.118",
4
4
  "repository": {
5
5
  "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
6
6
  },
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "tenjin-ui-kit",
3
- "version": "0.2.116",
3
+ "version": "0.2.118",
4
4
  "repository": {
5
5
  "url": "https://gitlab.com/yethi/react/tenjin-ui-kit.git"
6
6
  },