react-jsonschema-form-extras 0.9.83 → 0.9.84
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/README.md +38 -1
- package/dist/form-with-extras.js +1 -1
- package/dist/form-with-extras.js.map +1 -1
- package/lib/MultiTypeaheadField.js +43 -110
- package/package.json +1 -1
@@ -10,47 +10,6 @@ var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol
|
|
10
10
|
|
11
11
|
var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
|
12
12
|
|
13
|
-
// Default search function
|
14
|
-
var defaultSearch = function () {
|
15
|
-
var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(url, query) {
|
16
|
-
var queryKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "query";
|
17
|
-
var res;
|
18
|
-
return regeneratorRuntime.wrap(function _callee$(_context) {
|
19
|
-
while (1) {
|
20
|
-
switch (_context.prev = _context.next) {
|
21
|
-
case 0:
|
22
|
-
_context.next = 2;
|
23
|
-
return fetch(url + "?" + queryKey + "=" + encodeURIComponent(query));
|
24
|
-
|
25
|
-
case 2:
|
26
|
-
res = _context.sent;
|
27
|
-
_context.next = 5;
|
28
|
-
return res.json();
|
29
|
-
|
30
|
-
case 5:
|
31
|
-
return _context.abrupt("return", _context.sent);
|
32
|
-
|
33
|
-
case 6:
|
34
|
-
case "end":
|
35
|
-
return _context.stop();
|
36
|
-
}
|
37
|
-
}
|
38
|
-
}, _callee, this);
|
39
|
-
}));
|
40
|
-
|
41
|
-
return function defaultSearch(_x2, _x3) {
|
42
|
-
return _ref.apply(this, arguments);
|
43
|
-
};
|
44
|
-
}();
|
45
|
-
|
46
|
-
/**
|
47
|
-
* MultiTypeaheadField - A custom multi-select dropdown component with search capability.
|
48
|
-
* Supports both static options and URL-based options with search functionality.
|
49
|
-
* Compatible with react-jsonschema-form
|
50
|
-
*/
|
51
|
-
// Styled components for MUI v5 - converted from original withStyles
|
52
|
-
|
53
|
-
|
54
13
|
var _react = require("react");
|
55
14
|
|
56
15
|
var _react2 = _interopRequireDefault(_react);
|
@@ -75,8 +34,21 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
75
34
|
|
76
35
|
function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
|
77
36
|
|
78
|
-
|
37
|
+
// Default search function
|
38
|
+
function defaultSearch(url, query) {
|
39
|
+
var queryKey = arguments.length > 2 && arguments[2] !== undefined ? arguments[2] : "query";
|
40
|
+
|
41
|
+
return fetch(url + "?" + queryKey + "=" + encodeURIComponent(query)).then(function (res) {
|
42
|
+
return res.json();
|
43
|
+
});
|
44
|
+
}
|
79
45
|
|
46
|
+
/**
|
47
|
+
* MultiTypeaheadField - A custom multi-select dropdown component with search capability.
|
48
|
+
* Supports both static options and URL-based options with search functionality.
|
49
|
+
* Compatible with react-jsonschema-form
|
50
|
+
*/
|
51
|
+
// Styled components for MUI v5 - converted from original withStyles
|
80
52
|
var StyledContainer = (0, _styles.styled)("div")({
|
81
53
|
position: "relative",
|
82
54
|
width: "100%"
|
@@ -225,8 +197,6 @@ var StyledClearButton = (0, _styles.styled)(_material.IconButton)({
|
|
225
197
|
* Compatible with react-jsonschema-form and MUI v5
|
226
198
|
*/
|
227
199
|
function MultiTypeaheadField(props) {
|
228
|
-
var _this = this;
|
229
|
-
|
230
200
|
var _useState = (0, _react.useState)(""),
|
231
201
|
_useState2 = _slicedToArray(_useState, 2),
|
232
202
|
inputValue = _useState2[0],
|
@@ -266,75 +236,36 @@ function MultiTypeaheadField(props) {
|
|
266
236
|
|
267
237
|
// Debounced fetch function
|
268
238
|
|
269
|
-
var fetchOptions = (0, _react.useCallback)(function () {
|
270
|
-
|
271
|
-
|
272
|
-
return
|
273
|
-
|
274
|
-
switch (_context2.prev = _context2.next) {
|
275
|
-
case 0:
|
276
|
-
if (!(!url || !query.trim())) {
|
277
|
-
_context2.next = 3;
|
278
|
-
break;
|
279
|
-
}
|
280
|
-
|
281
|
-
setOptions([]);
|
282
|
-
return _context2.abrupt("return");
|
283
|
-
|
284
|
-
case 3:
|
285
|
-
|
286
|
-
setLoading(true);
|
287
|
-
_context2.prev = 4;
|
288
|
-
|
289
|
-
// Use custom search function if provided, otherwise use defaultSearch
|
290
|
-
searchFn = typeof customSearch === "function" ? customSearch : defaultSearch;
|
291
|
-
_context2.next = 8;
|
292
|
-
return searchFn(url, query, queryKey);
|
293
|
-
|
294
|
-
case 8:
|
295
|
-
data = _context2.sent;
|
296
|
-
|
297
|
-
|
298
|
-
// Extract options from response using optionsPath if provided
|
299
|
-
newOptions = void 0;
|
300
|
-
|
301
|
-
if (optionsPath && typeof optionsPath === "string") {
|
302
|
-
newOptions = (0, _selectn2.default)(optionsPath, data);
|
303
|
-
newOptions = Array.isArray(newOptions) ? newOptions : [];
|
304
|
-
} else {
|
305
|
-
// Always expect data to be an array if no optionsPath specified
|
306
|
-
newOptions = Array.isArray(data) ? data : [];
|
307
|
-
}
|
308
|
-
|
309
|
-
setOptions(newOptions);
|
310
|
-
_context2.next = 18;
|
311
|
-
break;
|
312
|
-
|
313
|
-
case 14:
|
314
|
-
_context2.prev = 14;
|
315
|
-
_context2.t0 = _context2["catch"](4);
|
316
|
-
|
317
|
-
console.error("Error fetching options:", _context2.t0);
|
318
|
-
setOptions([]);
|
239
|
+
var fetchOptions = (0, _react.useCallback)(function (query) {
|
240
|
+
if (!url || !query.trim()) {
|
241
|
+
setOptions([]);
|
242
|
+
return;
|
243
|
+
}
|
319
244
|
|
320
|
-
|
321
|
-
_context2.prev = 18;
|
245
|
+
setLoading(true);
|
322
246
|
|
323
|
-
|
324
|
-
|
247
|
+
// Use custom search function if provided, otherwise use defaultSearch
|
248
|
+
var searchFn = typeof customSearch === "function" ? customSearch : defaultSearch;
|
325
249
|
|
326
|
-
|
327
|
-
|
328
|
-
|
329
|
-
|
330
|
-
|
331
|
-
|
332
|
-
|
250
|
+
searchFn(url, query, queryKey).then(function (data) {
|
251
|
+
// Extract options from response using optionsPath if provided
|
252
|
+
var newOptions = void 0;
|
253
|
+
if (optionsPath && typeof optionsPath === "string") {
|
254
|
+
newOptions = (0, _selectn2.default)(optionsPath, data);
|
255
|
+
newOptions = Array.isArray(newOptions) ? newOptions : [];
|
256
|
+
} else {
|
257
|
+
// Always expect data to be an array if no optionsPath specified
|
258
|
+
newOptions = Array.isArray(data) ? data : [];
|
259
|
+
}
|
333
260
|
|
334
|
-
|
335
|
-
|
336
|
-
|
337
|
-
|
261
|
+
setOptions(newOptions);
|
262
|
+
}).catch(function (error) {
|
263
|
+
console.error("Error fetching options:", error);
|
264
|
+
setOptions([]);
|
265
|
+
}).finally(function () {
|
266
|
+
setLoading(false);
|
267
|
+
});
|
268
|
+
}, [url, customSearch, queryKey, optionsPath]);
|
338
269
|
|
339
270
|
// Debounce the fetch with useEffect
|
340
271
|
(0, _react.useEffect)(function () {
|
@@ -391,7 +322,9 @@ function MultiTypeaheadField(props) {
|
|
391
322
|
valueKeys.forEach(function (key) {
|
392
323
|
var value = (0, _selectn2.default)(key, option);
|
393
324
|
if (value !== undefined) {
|
394
|
-
|
325
|
+
// Use the last part of the key chain instead of the full key
|
326
|
+
var lastKeyPart = key.split(".").pop();
|
327
|
+
valueObj[lastKeyPart] = value;
|
395
328
|
}
|
396
329
|
});
|
397
330
|
return valueObj;
|
package/package.json
CHANGED
@@ -3,7 +3,7 @@
|
|
3
3
|
"description": "Extra widgets for Mozilla's react-jsonschema-form",
|
4
4
|
"private": false,
|
5
5
|
"author": "mavarazy@gmail.com",
|
6
|
-
"version": "0.9.
|
6
|
+
"version": "0.9.84",
|
7
7
|
"scripts": {
|
8
8
|
"build:lib": "rimraf lib && cross-env NODE_ENV=production babel -d lib/ src/ --copy-files",
|
9
9
|
"build:dist": "rimraf dist && cross-env NODE_ENV=production webpack --config webpack.config.dist.js",
|