tenjin-ui-kit 0.3.72 → 0.3.73
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.
- package/common/hooks/apiHooks.js +14 -54
- package/common/hooks/newApiHook.js +32 -81
- package/components/Canvas.js +27 -32
- package/components/DragBox/index.js +16 -21
- package/components/InputWithChip/index.js +31 -43
- package/components/RightContext/index.js +6 -21
- package/components/WorkFlow.js +16 -21
- package/components/WorkFlowBuilder.js +22 -31
- package/components/alert/index.js +3 -7
- package/components/attachment/index.js +6 -4
- package/components/authenticationProvider/index.js +11 -27
- package/components/avatar/index.js +12 -10
- package/components/avatar/styles.js +4 -2
- package/components/breadCrumbs/index.js +39 -53
- package/components/browsingTestCaseLayout/DetailsViewLayout/DetailsViewContent/index.js +3 -1
- package/components/browsingTestCaseLayout/DetailsViewLayout/DetailsViewHeader/index.js +4 -2
- package/components/browsingTestCaseLayout/TreeViewLayout/TreeViewContent/Index.js +5 -3
- package/components/browsingTestCaseLayout/TreeViewLayout/TreeViewHeader/Index.js +4 -2
- package/components/browsingTestCaseLayout/TreeViewLayout/TreeViewHeader/style.js +1 -1
- package/components/browsingTestCaseLayout/index.js +14 -25
- package/components/button/index.js +26 -30
- package/components/chatBotModal/index.js +16 -28
- package/components/checkBox/index.js +4 -5
- package/components/combobox/index.js +37 -50
- package/components/divider/index.js +3 -8
- package/components/editableField/index.js +8 -26
- package/components/errorBoundary/index.js +7 -11
- package/components/fileUploader/index.js +28 -35
- package/components/fileUploader/style.js +1 -1
- package/components/filter/ValueSelector.js +47 -70
- package/components/filter/index.js +27 -43
- package/components/input/index.js +45 -52
- package/components/layout/index.js +22 -31
- package/components/layout/main/index.js +4 -2
- package/components/layout/pageContent/index.js +3 -1
- package/components/layout/sidebar/FlatMenu.js +10 -6
- package/components/layout/sidebar/GroupedIconMenu.js +145 -157
- package/components/layout/sidebar/GroupedMenu.js +9 -4
- package/components/layout/sidebar/ProjectMenu.js +134 -147
- package/components/layout/sidebar/index.js +14 -10
- package/components/layout/sidebar/style.js +6 -6
- package/components/layout/topBar/ProjectTopbar.js +15 -31
- package/components/layout/topBar/UserAvatar.js +12 -19
- package/components/layout/topBar/index.js +8 -15
- package/components/menu/index.js +7 -17
- package/components/modal/index.js +10 -11
- package/components/modal/style.js +1 -1
- package/components/optionMenu/index.js +8 -16
- package/components/pagination/index.js +7 -12
- package/components/paginationUpdated/index.js +15 -19
- package/components/paper/index.js +9 -10
- package/components/paper/style.js +2 -2
- package/components/reactSelect/index.js +36 -52
- package/components/reactSelect/style.js +37 -24
- package/components/richTextEditor/index.js +9 -14
- package/components/select/GroupedSelect.js +78 -65
- package/components/select/SimpleSelect.js +28 -40
- package/components/select/index.js +25 -22
- package/components/simpleSelect/index.js +10 -11
- package/components/sort/index.js +13 -23
- package/components/switch/index.js +9 -9
- package/components/switch/style.js +6 -6
- package/components/switch/switch.js +22 -33
- package/components/table/ReactTable.js +16 -23
- package/components/table/SimpleTable.js +17 -22
- package/components/table/index.js +100 -131
- package/components/text/index.js +16 -22
- package/components/topBar/index.js +12 -21
- package/components/tree/index.js +9 -19
- package/components/tree/style.js +1 -1
- package/components/valuePicker/ValueSelector.js +31 -45
- package/components/valuePicker/index.js +20 -33
- package/components/wrapperLayout/layout/index.js +5 -3
- package/components/wrapperLayout/main/index.js +5 -3
- package/components/wrapperLayout/main/pageContainer/index.js +3 -1
- package/components/wrapperLayout/main/sideBar/index.js +101 -115
- package/components/wrapperLayout/main/sideBar/style.js +1 -1
- package/components/wrapperLayout/topBar/UserAvatar.js +3 -1
- package/components/wrapperLayout/topBar/avatar.js +7 -8
- package/components/wrapperLayout/topBar/index.js +17 -23
- package/components/wrapperLayout/topBar/menuIcon.js +3 -1
- package/components/wrapperLayout/topBar/style.js +4 -2
- package/http/index.js +13 -16
- package/package.json +2 -1
- package/templates/listPage/index.js +148 -155
|
@@ -9,69 +9,50 @@ var _FormControl = _interopRequireDefault(require("@mui/material/FormControl"));
|
|
|
9
9
|
var _fa = require("react-icons/fa");
|
|
10
10
|
var _reactDom = require("react-dom");
|
|
11
11
|
var _text = _interopRequireDefault(require("../text"));
|
|
12
|
-
const _excluded = ["options", "onChange", "value", "defaultValue", "fullWidth"];
|
|
13
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
13
|
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); }
|
|
15
14
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
16
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
17
|
-
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."); }
|
|
18
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
19
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
20
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
21
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
22
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
23
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
24
15
|
const GroupedSelect = _ref => {
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
onChange
|
|
28
|
-
propValue
|
|
29
|
-
defaultValue
|
|
30
|
-
fullWidth
|
|
31
|
-
rest
|
|
16
|
+
let {
|
|
17
|
+
options = [],
|
|
18
|
+
onChange,
|
|
19
|
+
value: propValue,
|
|
20
|
+
defaultValue,
|
|
21
|
+
fullWidth,
|
|
22
|
+
...rest
|
|
23
|
+
} = _ref;
|
|
32
24
|
const triggerRef = React.useRef(null);
|
|
33
|
-
const
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
value = _React$useState6[0],
|
|
44
|
-
setValue = _React$useState6[1];
|
|
45
|
-
const _React$useState7 = React.useState(null),
|
|
46
|
-
_React$useState8 = _slicedToArray(_React$useState7, 2),
|
|
47
|
-
hoveredOption = _React$useState8[0],
|
|
48
|
-
setHoveredOption = _React$useState8[1];
|
|
49
|
-
const groupOptionsByPageTitle = options => {
|
|
50
|
-
const grouped = {};
|
|
51
|
-
options.forEach(option => {
|
|
52
|
-
var _grouped$option$pageT;
|
|
53
|
-
if (!grouped[option === null || option === void 0 ? void 0 : option.pageTitle]) {
|
|
54
|
-
grouped[option === null || option === void 0 ? void 0 : option.pageTitle] = [];
|
|
25
|
+
const dropdownRef = React.useRef(null);
|
|
26
|
+
const [searchTerm, setSearchTerm] = React.useState("");
|
|
27
|
+
const [isDropdownOpen, setIsDropdownOpen] = React.useState(false);
|
|
28
|
+
const [value, setValue] = React.useState(propValue ?? defaultValue);
|
|
29
|
+
const [hoveredOption, setHoveredOption] = React.useState(null);
|
|
30
|
+
const groupOptionsByPageTitle = React.useCallback(options => {
|
|
31
|
+
return options.reduce((grouped, option) => {
|
|
32
|
+
const pageTitle = option?.pageTitle;
|
|
33
|
+
if (!grouped[pageTitle]) {
|
|
34
|
+
grouped[pageTitle] = [];
|
|
55
35
|
}
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
};
|
|
36
|
+
grouped[pageTitle].push(option);
|
|
37
|
+
return grouped;
|
|
38
|
+
}, {});
|
|
39
|
+
}, []);
|
|
60
40
|
const handleSearchChange = event => {
|
|
61
41
|
setSearchTerm(event.target.value);
|
|
62
42
|
};
|
|
63
|
-
const filteredOptions =
|
|
64
|
-
|
|
65
|
-
return (option
|
|
66
|
-
});
|
|
67
|
-
const groupedOptions = groupOptionsByPageTitle(filteredOptions);
|
|
43
|
+
const filteredOptions = React.useMemo(() => {
|
|
44
|
+
const search = searchTerm.toLowerCase();
|
|
45
|
+
return options.filter(option => option?.label?.toLowerCase().includes(search) || option?.pageTitle?.toLowerCase().includes(search));
|
|
46
|
+
}, [options, searchTerm]);
|
|
47
|
+
const groupedOptions = React.useMemo(() => groupOptionsByPageTitle(filteredOptions), [filteredOptions, groupOptionsByPageTitle]);
|
|
68
48
|
const toggleDropdown = () => {
|
|
69
49
|
setIsDropdownOpen(prev => !prev);
|
|
70
50
|
};
|
|
71
51
|
const handleOptionClick = selectedValue => {
|
|
72
52
|
setValue(selectedValue);
|
|
73
53
|
setIsDropdownOpen(false);
|
|
74
|
-
|
|
54
|
+
setSearchTerm("");
|
|
55
|
+
onChange?.({
|
|
75
56
|
target: {
|
|
76
57
|
value: selectedValue
|
|
77
58
|
}
|
|
@@ -80,16 +61,43 @@ const GroupedSelect = _ref => {
|
|
|
80
61
|
const handleCloseDropdown = () => {
|
|
81
62
|
setIsDropdownOpen(false);
|
|
82
63
|
};
|
|
64
|
+
|
|
65
|
+
// Keep internal value in sync if component is used as a controlled component
|
|
66
|
+
React.useEffect(() => {
|
|
67
|
+
if (propValue !== undefined) {
|
|
68
|
+
setValue(propValue);
|
|
69
|
+
}
|
|
70
|
+
}, [propValue]);
|
|
71
|
+
|
|
72
|
+
// Close dropdown when clicking outside
|
|
73
|
+
React.useEffect(() => {
|
|
74
|
+
if (!isDropdownOpen) {
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
const handleOutsideClick = event => {
|
|
78
|
+
const target = event.target;
|
|
79
|
+
const clickedInsideTrigger = triggerRef.current?.contains(target);
|
|
80
|
+
const clickedInsideDropdown = dropdownRef.current?.contains(target);
|
|
81
|
+
if (clickedInsideTrigger || clickedInsideDropdown) {
|
|
82
|
+
return;
|
|
83
|
+
}
|
|
84
|
+
handleCloseDropdown();
|
|
85
|
+
};
|
|
86
|
+
document.addEventListener("mousedown", handleOutsideClick);
|
|
87
|
+
return () => {
|
|
88
|
+
document.removeEventListener("mousedown", handleOutsideClick);
|
|
89
|
+
};
|
|
90
|
+
}, [isDropdownOpen]);
|
|
83
91
|
return /*#__PURE__*/React.createElement(_FormControl.default, _extends({
|
|
84
92
|
sx: {
|
|
85
93
|
width: fullWidth ? "100%" : 200
|
|
86
94
|
}
|
|
87
95
|
}, rest), /*#__PURE__*/React.createElement("div", {
|
|
96
|
+
ref: triggerRef,
|
|
88
97
|
style: {
|
|
89
98
|
position: "relative",
|
|
90
99
|
width: "100%"
|
|
91
|
-
}
|
|
92
|
-
ref: triggerRef
|
|
100
|
+
}
|
|
93
101
|
}, /*#__PURE__*/React.createElement("div", {
|
|
94
102
|
onClick: toggleDropdown,
|
|
95
103
|
style: {
|
|
@@ -105,12 +113,13 @@ const GroupedSelect = _ref => {
|
|
|
105
113
|
style: {
|
|
106
114
|
flexGrow: 1
|
|
107
115
|
}
|
|
108
|
-
}, value ? options
|
|
116
|
+
}, value ? options?.find(option => option?.id === value)?.label : "Select Option"), /*#__PURE__*/React.createElement("div", null, isDropdownOpen ? /*#__PURE__*/React.createElement(_fa.FaCaretUp, null) : /*#__PURE__*/React.createElement(_fa.FaCaretDown, null)))), isDropdownOpen && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/React.createElement("div", {
|
|
117
|
+
ref: dropdownRef,
|
|
109
118
|
style: {
|
|
110
119
|
position: "absolute",
|
|
111
|
-
top:
|
|
112
|
-
left:
|
|
113
|
-
width:
|
|
120
|
+
top: `${triggerRef.current?.getBoundingClientRect().bottom + 8}px`,
|
|
121
|
+
left: `${triggerRef.current?.getBoundingClientRect().left}px`,
|
|
122
|
+
width: `${triggerRef.current?.offsetWidth}px`,
|
|
114
123
|
backgroundColor: "#fff",
|
|
115
124
|
border: "1px solid #ccc",
|
|
116
125
|
borderRadius: "4px",
|
|
@@ -137,31 +146,35 @@ const GroupedSelect = _ref => {
|
|
|
137
146
|
margin: 0,
|
|
138
147
|
width: "100%",
|
|
139
148
|
border: "1px solid #949494",
|
|
140
|
-
borderRadius: "4px"
|
|
149
|
+
borderRadius: "4px",
|
|
150
|
+
boxSizing: "border-box"
|
|
141
151
|
}
|
|
142
|
-
}),
|
|
143
|
-
let
|
|
144
|
-
pageTitle = _ref3[0],
|
|
145
|
-
options = _ref3[1];
|
|
152
|
+
}), Object.entries(groupedOptions).map(_ref2 => {
|
|
153
|
+
let [pageTitle, groupedPageOptions] = _ref2;
|
|
146
154
|
return /*#__PURE__*/React.createElement("div", {
|
|
147
155
|
key: pageTitle
|
|
148
156
|
}, /*#__PURE__*/React.createElement(_text.default, {
|
|
149
157
|
style: {
|
|
150
158
|
padding: "5px 10px"
|
|
151
|
-
// backgroundColor: "#f5f5f5",
|
|
152
159
|
},
|
|
153
160
|
semibold: true
|
|
154
|
-
}, pageTitle
|
|
155
|
-
key: option
|
|
161
|
+
}, pageTitle || "N/A"), groupedPageOptions.map(option => /*#__PURE__*/React.createElement("div", {
|
|
162
|
+
key: option?.id,
|
|
156
163
|
onClick: () => handleOptionClick(option.id),
|
|
157
164
|
onMouseEnter: () => setHoveredOption(option.id),
|
|
158
165
|
onMouseLeave: () => setHoveredOption(null),
|
|
159
166
|
style: {
|
|
160
167
|
padding: "8px 24px",
|
|
161
168
|
cursor: "pointer",
|
|
162
|
-
backgroundColor: value ===
|
|
169
|
+
backgroundColor: value === option?.id ? "#f0f0f7" : hoveredOption === option?.id ? "#f5f5f5" : "transparent"
|
|
163
170
|
}
|
|
164
|
-
}, option
|
|
165
|
-
})
|
|
171
|
+
}, option?.label)));
|
|
172
|
+
}), Object.keys(groupedOptions).length === 0 && /*#__PURE__*/React.createElement("div", {
|
|
173
|
+
style: {
|
|
174
|
+
padding: "10px",
|
|
175
|
+
textAlign: "center",
|
|
176
|
+
color: "#666"
|
|
177
|
+
}
|
|
178
|
+
}, "No options found"))), document.body));
|
|
166
179
|
};
|
|
167
180
|
var _default = exports.default = GroupedSelect;
|
|
@@ -7,45 +7,33 @@ exports.default = void 0;
|
|
|
7
7
|
var _material = require("@mui/material");
|
|
8
8
|
var _react = _interopRequireWildcard(require("react"));
|
|
9
9
|
var _text = _interopRequireDefault(require("../text"));
|
|
10
|
-
const _excluded = ["options", "errorMessage", "error", "fullWidth", "isDisabled", "label", "isRequired", "helperText", "isSearch", "isClearOption", "loading", "isSort", "placeholder"];
|
|
11
10
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
12
11
|
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); }
|
|
13
12
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
14
|
-
function _slicedToArray(r, e) { return _arrayWithHoles(r) || _iterableToArrayLimit(r, e) || _unsupportedIterableToArray(r, e) || _nonIterableRest(); }
|
|
15
|
-
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."); }
|
|
16
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
17
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
18
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
19
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; }
|
|
20
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
21
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
22
13
|
const SimpleSelect = _ref => {
|
|
23
|
-
let
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
14
|
+
let {
|
|
15
|
+
options,
|
|
16
|
+
errorMessage,
|
|
17
|
+
error,
|
|
18
|
+
fullWidth,
|
|
19
|
+
isDisabled,
|
|
20
|
+
label,
|
|
21
|
+
isRequired,
|
|
22
|
+
helperText,
|
|
23
|
+
isSearch,
|
|
24
|
+
isClearOption,
|
|
25
|
+
loading,
|
|
26
|
+
isSort,
|
|
27
|
+
placeholder,
|
|
28
|
+
// Add placeholder prop
|
|
29
|
+
...rest
|
|
30
|
+
} = _ref;
|
|
31
|
+
isSort = isSort ?? true; //by default true
|
|
32
|
+
isSearch = isSearch ?? true; //by default true
|
|
33
|
+
isClearOption = isClearOption ?? true; //by default true
|
|
40
34
|
|
|
41
|
-
const
|
|
42
|
-
|
|
43
|
-
searchText = _useState2[0],
|
|
44
|
-
setSearchText = _useState2[1];
|
|
45
|
-
const _useState3 = (0, _react.useState)(false),
|
|
46
|
-
_useState4 = _slicedToArray(_useState3, 2),
|
|
47
|
-
noDataAvailable = _useState4[0],
|
|
48
|
-
setNoDataAvailable = _useState4[1];
|
|
35
|
+
const [searchText, setSearchText] = (0, _react.useState)("");
|
|
36
|
+
const [noDataAvailable, setNoDataAvailable] = (0, _react.useState)(false);
|
|
49
37
|
const validateChildren = (type, searchText) => {
|
|
50
38
|
if (typeof type !== "object") {
|
|
51
39
|
return typeof type === "string" && type.toLowerCase().indexOf(searchText.toLowerCase()) > -1;
|
|
@@ -65,15 +53,15 @@ const SimpleSelect = _ref => {
|
|
|
65
53
|
return false;
|
|
66
54
|
};
|
|
67
55
|
const displayedOptions = (0, _react.useMemo)(() => {
|
|
68
|
-
const filteredOptions = options
|
|
56
|
+
const filteredOptions = options?.filter(option => containsText(option?.label, searchText));
|
|
69
57
|
if (isSearch) {
|
|
70
|
-
setNoDataAvailable(
|
|
58
|
+
setNoDataAvailable(filteredOptions?.length === 0);
|
|
71
59
|
}
|
|
72
60
|
|
|
73
61
|
// const sortedOptions = filteredOptions?.sort((a, b) =>
|
|
74
62
|
// a?.label?.localeCompare(b.label)
|
|
75
63
|
// );
|
|
76
|
-
const sortedOptions = filteredOptions
|
|
64
|
+
const sortedOptions = filteredOptions?.slice().sort((a, b) => {
|
|
77
65
|
const labelA = typeof a.label === "string" ? a.label : findStringInChildren(a.label.props.children);
|
|
78
66
|
const labelB = typeof b.label === "string" ? b.label : findStringInChildren(b.label.props.children);
|
|
79
67
|
return labelA.localeCompare(labelB);
|
|
@@ -89,8 +77,8 @@ const SimpleSelect = _ref => {
|
|
|
89
77
|
return "";
|
|
90
78
|
}
|
|
91
79
|
return (isSort ? sortedOptions : filteredOptions).map(option => ({
|
|
92
|
-
label: option
|
|
93
|
-
value: option
|
|
80
|
+
label: option?.label,
|
|
81
|
+
value: option?.value
|
|
94
82
|
}));
|
|
95
83
|
// eslint-disable-next-line react-hooks/exhaustive-deps
|
|
96
84
|
}, [options, searchText, isSearch]);
|
|
@@ -176,7 +164,7 @@ const SimpleSelect = _ref => {
|
|
|
176
164
|
}
|
|
177
165
|
}, "Fetching Options...") : noDataAvailable ? /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
|
|
178
166
|
disabled: true
|
|
179
|
-
}, "No Data Available") : recommendedOptions
|
|
167
|
+
}, "No Data Available") : recommendedOptions?.map(option => /*#__PURE__*/_react.default.createElement(_material.MenuItem, {
|
|
180
168
|
key: option.value,
|
|
181
169
|
value: option.value
|
|
182
170
|
}, option.label))), error && /*#__PURE__*/_react.default.createElement(_material.FormHelperText, null, errorMessage), helperText && /*#__PURE__*/_react.default.createElement(_material.FormHelperText, null, helperText)));
|
|
@@ -11,28 +11,27 @@ var _CheckBox = _interopRequireDefault(require("@mui/icons-material/CheckBox"));
|
|
|
11
11
|
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
12
12
|
var _responsiveTheme = _interopRequireDefault(require("../../themes/responsiveTheme"));
|
|
13
13
|
var _text = _interopRequireDefault(require("../text"));
|
|
14
|
-
const _excluded = ["options", "isMulti", "checkBox", "defaultValue", "value", "onChange", "placeholder", "label", "fullWidth", "error", "helperText", "blueTheme", "isRequired", "isDisabled"];
|
|
15
14
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
16
15
|
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); }
|
|
17
16
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
18
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
19
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
20
17
|
const ReactSelect = props => {
|
|
21
|
-
const
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
18
|
+
const {
|
|
19
|
+
options,
|
|
20
|
+
isMulti,
|
|
21
|
+
checkBox,
|
|
22
|
+
defaultValue,
|
|
23
|
+
value,
|
|
24
|
+
onChange,
|
|
25
|
+
placeholder,
|
|
26
|
+
label,
|
|
27
|
+
fullWidth,
|
|
28
|
+
error,
|
|
29
|
+
helperText,
|
|
30
|
+
blueTheme,
|
|
31
|
+
isRequired,
|
|
32
|
+
isDisabled,
|
|
33
|
+
...rest
|
|
34
|
+
} = props;
|
|
36
35
|
const icon = /*#__PURE__*/_react.default.createElement(_CheckBoxOutlineBlank.default, {
|
|
37
36
|
fontSize: "small"
|
|
38
37
|
});
|
|
@@ -68,12 +67,14 @@ const ReactSelect = props => {
|
|
|
68
67
|
options: options
|
|
69
68
|
// disableCloseOnSelect
|
|
70
69
|
,
|
|
71
|
-
getOptionLabel: option => option
|
|
70
|
+
getOptionLabel: option => option?.label,
|
|
72
71
|
value: value,
|
|
73
72
|
onChange: onChange,
|
|
74
73
|
defaultValue: [options[1]],
|
|
75
74
|
renderOption: (props, option, _ref) => {
|
|
76
|
-
let
|
|
75
|
+
let {
|
|
76
|
+
selected
|
|
77
|
+
} = _ref;
|
|
77
78
|
return /*#__PURE__*/_react.default.createElement("li", props, /*#__PURE__*/_react.default.createElement(_material.Checkbox, {
|
|
78
79
|
icon: icon,
|
|
79
80
|
checkedIcon: checkedIcon,
|
|
@@ -81,7 +82,7 @@ const ReactSelect = props => {
|
|
|
81
82
|
marginRight: 8
|
|
82
83
|
},
|
|
83
84
|
checked: selected
|
|
84
|
-
}), /*#__PURE__*/_react.default.createElement(_text.default, null, option
|
|
85
|
+
}), /*#__PURE__*/_react.default.createElement(_text.default, null, option?.label));
|
|
85
86
|
},
|
|
86
87
|
renderInput: params => /*#__PURE__*/_react.default.createElement(_material.TextField, _extends({}, params, {
|
|
87
88
|
placeholder: placeholder,
|
|
@@ -137,7 +138,9 @@ const ReactSelect = props => {
|
|
|
137
138
|
}
|
|
138
139
|
},
|
|
139
140
|
PaperComponent: _ref2 => {
|
|
140
|
-
let
|
|
141
|
+
let {
|
|
142
|
+
children
|
|
143
|
+
} = _ref2;
|
|
141
144
|
return /*#__PURE__*/_react.default.createElement(_material.Paper, {
|
|
142
145
|
style: {
|
|
143
146
|
background: "#6e6ba1",
|
|
@@ -6,20 +6,19 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
exports.default = void 0;
|
|
7
7
|
var _material = require("@mui/material");
|
|
8
8
|
var _text = _interopRequireDefault(require("../text"));
|
|
9
|
-
const _excluded = ["options", "errorMessage", "error", "fullWidth", "isDisabled", "label", "isRequired"];
|
|
10
9
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
10
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
12
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
13
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
14
11
|
const SimpleSelect = _ref => {
|
|
15
|
-
let
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
12
|
+
let {
|
|
13
|
+
options,
|
|
14
|
+
errorMessage,
|
|
15
|
+
error,
|
|
16
|
+
fullWidth,
|
|
17
|
+
isDisabled,
|
|
18
|
+
label,
|
|
19
|
+
isRequired,
|
|
20
|
+
...rest
|
|
21
|
+
} = _ref;
|
|
23
22
|
console.log(errorMessage, error, "error");
|
|
24
23
|
return /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(_material.FormControl, {
|
|
25
24
|
sx: {
|
package/components/sort/index.js
CHANGED
|
@@ -17,35 +17,25 @@ var _button = _interopRequireDefault(require("../button"));
|
|
|
17
17
|
var _divider = _interopRequireDefault(require("../divider"));
|
|
18
18
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
19
19
|
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); }
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
23
|
-
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
24
|
-
function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
|
|
25
|
-
function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } // import { Button, Divider, Text } from "tenjin-ui-kit";
|
|
20
|
+
// import { Button, Divider, Text } from "tenjin-ui-kit";
|
|
21
|
+
|
|
26
22
|
const Sort = _ref => {
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
variant
|
|
30
|
-
columnName
|
|
31
|
-
options
|
|
32
|
-
defaultSelectedOptions
|
|
23
|
+
let {
|
|
24
|
+
onChange,
|
|
25
|
+
variant,
|
|
26
|
+
columnName,
|
|
27
|
+
options,
|
|
28
|
+
defaultSelectedOptions
|
|
29
|
+
} = _ref;
|
|
33
30
|
console.log({
|
|
34
31
|
defaultSelectedOptions
|
|
35
32
|
});
|
|
36
33
|
const theme = (0, _material.useTheme)();
|
|
37
|
-
const
|
|
38
|
-
|
|
39
|
-
menuAnchor = _useState2[0],
|
|
40
|
-
setMenuAnchor = _useState2[1];
|
|
41
|
-
const _React$useState = _react.default.useState(defaultSelectedOptions ? defaultSelectedOptions : (_options$ = options[0]) === null || _options$ === void 0 ? void 0 : _options$.value),
|
|
42
|
-
_React$useState2 = _slicedToArray(_React$useState, 2),
|
|
43
|
-
value = _React$useState2[0],
|
|
44
|
-
setValue = _React$useState2[1];
|
|
34
|
+
const [menuAnchor, setMenuAnchor] = (0, _react.useState)(null);
|
|
35
|
+
const [value, setValue] = _react.default.useState(defaultSelectedOptions ? defaultSelectedOptions : options[0]?.value);
|
|
45
36
|
(0, _react.useEffect)(() => {
|
|
46
37
|
if (!defaultSelectedOptions) {
|
|
47
|
-
|
|
48
|
-
setValue((_options$2 = options[0]) === null || _options$2 === void 0 ? void 0 : _options$2.value);
|
|
38
|
+
setValue(options[0]?.value);
|
|
49
39
|
} else {
|
|
50
40
|
setValue(defaultSelectedOptions);
|
|
51
41
|
}
|
|
@@ -127,7 +117,7 @@ const Sort = _ref => {
|
|
|
127
117
|
name: "controlled-radio-buttons-group",
|
|
128
118
|
value: value,
|
|
129
119
|
onChange: handleChange
|
|
130
|
-
}, options
|
|
120
|
+
}, options?.map(a => {
|
|
131
121
|
return /*#__PURE__*/_react.default.createElement(_FormControlLabel.default, {
|
|
132
122
|
value: a.value,
|
|
133
123
|
control: /*#__PURE__*/_react.default.createElement(_Radio.default, null),
|
|
@@ -9,17 +9,17 @@ var _react = _interopRequireDefault(require("react"));
|
|
|
9
9
|
var _default2 = _interopRequireDefault(require("../../themes/default"));
|
|
10
10
|
var _styles = require("@mui/material/styles");
|
|
11
11
|
var _text = _interopRequireDefault(require("../text"));
|
|
12
|
-
const _excluded = ["label"];
|
|
13
12
|
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
14
13
|
function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
|
|
15
|
-
function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var n = Object.getOwnPropertySymbols(e); for (r = 0; r < n.length; r++) o = n[r], -1 === t.indexOf(o) && {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
|
|
16
|
-
function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (-1 !== e.indexOf(n)) continue; t[n] = r[n]; } return t; }
|
|
17
14
|
const Switch = props => {
|
|
18
|
-
const
|
|
19
|
-
|
|
15
|
+
const {
|
|
16
|
+
label,
|
|
17
|
+
...rest
|
|
18
|
+
} = props;
|
|
20
19
|
const MuiSwitchStyledComp = (0, _styles.styled)(_material.Switch)(_ref => {
|
|
21
|
-
|
|
22
|
-
|
|
20
|
+
let {
|
|
21
|
+
MuiSwitch
|
|
22
|
+
} = _ref;
|
|
23
23
|
return {
|
|
24
24
|
padding: 10,
|
|
25
25
|
marginTop: "-6px",
|
|
@@ -27,7 +27,7 @@ const Switch = props => {
|
|
|
27
27
|
borderRadius: 20 / 2
|
|
28
28
|
},
|
|
29
29
|
"& .Mui-checked": {
|
|
30
|
-
color:
|
|
30
|
+
color: `${_default2.default.palette.white.main} !important`
|
|
31
31
|
},
|
|
32
32
|
"& .MuiSwitch-thumb": {
|
|
33
33
|
margin: "5px 0px 0px 5px",
|
|
@@ -35,7 +35,7 @@ const Switch = props => {
|
|
|
35
35
|
height: 10
|
|
36
36
|
},
|
|
37
37
|
"& .MuiSwitch-switchBase.Mui-checked+.MuiSwitch-track": {
|
|
38
|
-
backgroundColor:
|
|
38
|
+
backgroundColor: _default2.default.palette[`${props.color.toString().toLowerCase()}`]?.main,
|
|
39
39
|
opacity: 1
|
|
40
40
|
},
|
|
41
41
|
"& .MuiSwitch-switchBase.Mui-disabled+.MuiSwitch-track": {
|
|
@@ -11,29 +11,29 @@ var _default = exports.default = (0, _styles.makeStyles)(() => ({
|
|
|
11
11
|
labelLarge: {
|
|
12
12
|
"@media (min-width:1101px) and (max-width:1200px)": {
|
|
13
13
|
fontSize: "1.5rem !important",
|
|
14
|
-
fontWeight:
|
|
14
|
+
fontWeight: `${500} !important`
|
|
15
15
|
},
|
|
16
16
|
"@media (min-width:769px) and (max-width:1100px)": {
|
|
17
17
|
fontSize: "1.3rem !important",
|
|
18
|
-
fontWeight:
|
|
18
|
+
fontWeight: `${500} !important`
|
|
19
19
|
},
|
|
20
20
|
"@media (min-width:600px) and (max-width:768px)": {
|
|
21
21
|
fontSize: "1rem",
|
|
22
|
-
fontWeight:
|
|
22
|
+
fontWeight: `${500} !important`
|
|
23
23
|
}
|
|
24
24
|
},
|
|
25
25
|
labelSmall: {
|
|
26
26
|
"@media (min-width:1101px) and (max-width:1200px)": {
|
|
27
27
|
fontSize: "0.85rem !important",
|
|
28
|
-
fontWeight:
|
|
28
|
+
fontWeight: `${500} !important`
|
|
29
29
|
},
|
|
30
30
|
"@media (min-width:769px) and (max-width:1100px)": {
|
|
31
31
|
fontSize: "0.75rem !important",
|
|
32
|
-
fontWeight:
|
|
32
|
+
fontWeight: `${500} !important`
|
|
33
33
|
},
|
|
34
34
|
"@media (min-width:600px) and (max-width:768px)": {
|
|
35
35
|
fontSize: "0.75rem",
|
|
36
|
-
fontWeight:
|
|
36
|
+
fontWeight: `${500} !important`
|
|
37
37
|
}
|
|
38
38
|
}
|
|
39
39
|
}));
|