@rjsf/core 5.0.0-beta.14 → 5.0.0-beta.15
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/dist/core.cjs.development.js +1757 -1845
- package/dist/core.cjs.development.js.map +1 -1
- package/dist/core.cjs.production.min.js +1 -1
- package/dist/core.cjs.production.min.js.map +1 -1
- package/dist/core.esm.js +1758 -1846
- package/dist/core.esm.js.map +1 -1
- package/dist/core.umd.development.js +1757 -1845
- package/dist/core.umd.development.js.map +1 -1
- package/dist/core.umd.production.min.js +1 -1
- package/dist/core.umd.production.min.js.map +1 -1
- package/package.json +5 -5
|
@@ -26,6 +26,96 @@ var unset__default = /*#__PURE__*/_interopDefaultLegacy(unset);
|
|
|
26
26
|
var has__default = /*#__PURE__*/_interopDefaultLegacy(has);
|
|
27
27
|
var omit__default = /*#__PURE__*/_interopDefaultLegacy(omit);
|
|
28
28
|
|
|
29
|
+
function _defineProperties(target, props) {
|
|
30
|
+
for (var i = 0; i < props.length; i++) {
|
|
31
|
+
var descriptor = props[i];
|
|
32
|
+
descriptor.enumerable = descriptor.enumerable || false;
|
|
33
|
+
descriptor.configurable = true;
|
|
34
|
+
if ("value" in descriptor) descriptor.writable = true;
|
|
35
|
+
Object.defineProperty(target, descriptor.key, descriptor);
|
|
36
|
+
}
|
|
37
|
+
}
|
|
38
|
+
function _createClass(Constructor, protoProps, staticProps) {
|
|
39
|
+
if (protoProps) _defineProperties(Constructor.prototype, protoProps);
|
|
40
|
+
if (staticProps) _defineProperties(Constructor, staticProps);
|
|
41
|
+
Object.defineProperty(Constructor, "prototype", {
|
|
42
|
+
writable: false
|
|
43
|
+
});
|
|
44
|
+
return Constructor;
|
|
45
|
+
}
|
|
46
|
+
function _extends() {
|
|
47
|
+
_extends = Object.assign ? Object.assign.bind() : function (target) {
|
|
48
|
+
for (var i = 1; i < arguments.length; i++) {
|
|
49
|
+
var source = arguments[i];
|
|
50
|
+
for (var key in source) {
|
|
51
|
+
if (Object.prototype.hasOwnProperty.call(source, key)) {
|
|
52
|
+
target[key] = source[key];
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
}
|
|
56
|
+
return target;
|
|
57
|
+
};
|
|
58
|
+
return _extends.apply(this, arguments);
|
|
59
|
+
}
|
|
60
|
+
function _inheritsLoose(subClass, superClass) {
|
|
61
|
+
subClass.prototype = Object.create(superClass.prototype);
|
|
62
|
+
subClass.prototype.constructor = subClass;
|
|
63
|
+
_setPrototypeOf(subClass, superClass);
|
|
64
|
+
}
|
|
65
|
+
function _setPrototypeOf(o, p) {
|
|
66
|
+
_setPrototypeOf = Object.setPrototypeOf ? Object.setPrototypeOf.bind() : function _setPrototypeOf(o, p) {
|
|
67
|
+
o.__proto__ = p;
|
|
68
|
+
return o;
|
|
69
|
+
};
|
|
70
|
+
return _setPrototypeOf(o, p);
|
|
71
|
+
}
|
|
72
|
+
function _objectWithoutPropertiesLoose(source, excluded) {
|
|
73
|
+
if (source == null) return {};
|
|
74
|
+
var target = {};
|
|
75
|
+
var sourceKeys = Object.keys(source);
|
|
76
|
+
var key, i;
|
|
77
|
+
for (i = 0; i < sourceKeys.length; i++) {
|
|
78
|
+
key = sourceKeys[i];
|
|
79
|
+
if (excluded.indexOf(key) >= 0) continue;
|
|
80
|
+
target[key] = source[key];
|
|
81
|
+
}
|
|
82
|
+
return target;
|
|
83
|
+
}
|
|
84
|
+
function _unsupportedIterableToArray(o, minLen) {
|
|
85
|
+
if (!o) return;
|
|
86
|
+
if (typeof o === "string") return _arrayLikeToArray(o, minLen);
|
|
87
|
+
var n = Object.prototype.toString.call(o).slice(8, -1);
|
|
88
|
+
if (n === "Object" && o.constructor) n = o.constructor.name;
|
|
89
|
+
if (n === "Map" || n === "Set") return Array.from(o);
|
|
90
|
+
if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen);
|
|
91
|
+
}
|
|
92
|
+
function _arrayLikeToArray(arr, len) {
|
|
93
|
+
if (len == null || len > arr.length) len = arr.length;
|
|
94
|
+
for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i];
|
|
95
|
+
return arr2;
|
|
96
|
+
}
|
|
97
|
+
function _createForOfIteratorHelperLoose(o, allowArrayLike) {
|
|
98
|
+
var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"];
|
|
99
|
+
if (it) return (it = it.call(o)).next.bind(it);
|
|
100
|
+
if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") {
|
|
101
|
+
if (it) o = it;
|
|
102
|
+
var i = 0;
|
|
103
|
+
return function () {
|
|
104
|
+
if (i >= o.length) return {
|
|
105
|
+
done: true
|
|
106
|
+
};
|
|
107
|
+
return {
|
|
108
|
+
done: false,
|
|
109
|
+
value: o[i++]
|
|
110
|
+
};
|
|
111
|
+
};
|
|
112
|
+
}
|
|
113
|
+
throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.");
|
|
114
|
+
}
|
|
115
|
+
|
|
116
|
+
var _excluded$9 = ["widget"],
|
|
117
|
+
_excluded2 = ["widget"],
|
|
118
|
+
_excluded3 = ["widget"];
|
|
29
119
|
/** Used to generate a unique ID for an element in a row */
|
|
30
120
|
function generateRowId() {
|
|
31
121
|
return nanoid.nanoid();
|
|
@@ -36,10 +126,10 @@ function generateRowId() {
|
|
|
36
126
|
* @returns - The `formData` converted into a `KeyedFormDataType` element
|
|
37
127
|
*/
|
|
38
128
|
function generateKeyedFormData(formData) {
|
|
39
|
-
return !Array.isArray(formData) ? [] : formData.map(item
|
|
129
|
+
return !Array.isArray(formData) ? [] : formData.map(function (item) {
|
|
40
130
|
return {
|
|
41
131
|
key: generateRowId(),
|
|
42
|
-
item
|
|
132
|
+
item: item
|
|
43
133
|
};
|
|
44
134
|
});
|
|
45
135
|
}
|
|
@@ -50,96 +140,90 @@ function generateKeyedFormData(formData) {
|
|
|
50
140
|
*/
|
|
51
141
|
function keyedToPlainFormData(keyedFormData) {
|
|
52
142
|
if (Array.isArray(keyedFormData)) {
|
|
53
|
-
return keyedFormData.map(
|
|
143
|
+
return keyedFormData.map(function (keyedItem) {
|
|
144
|
+
return keyedItem.item;
|
|
145
|
+
});
|
|
54
146
|
}
|
|
55
147
|
return [];
|
|
56
148
|
}
|
|
57
149
|
/** The `ArrayField` component is used to render a field in the schema that is of type `array`. It supports both normal
|
|
58
150
|
* and fixed array, allowing user to add and remove elements from the array data.
|
|
59
151
|
*/
|
|
60
|
-
|
|
152
|
+
var ArrayField = /*#__PURE__*/function (_Component) {
|
|
153
|
+
_inheritsLoose(ArrayField, _Component);
|
|
61
154
|
/** Constructs an `ArrayField` from the `props`, generating the initial keyed data from the `formData`
|
|
62
155
|
*
|
|
63
156
|
* @param props - The `FieldProps` for this template
|
|
64
157
|
*/
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
} = registry;
|
|
75
|
-
let itemSchema = schema.items;
|
|
158
|
+
function ArrayField(props) {
|
|
159
|
+
var _this;
|
|
160
|
+
_this = _Component.call(this, props) || this;
|
|
161
|
+
_this._getNewFormDataRow = function () {
|
|
162
|
+
var _this$props = _this.props,
|
|
163
|
+
schema = _this$props.schema,
|
|
164
|
+
registry = _this$props.registry;
|
|
165
|
+
var schemaUtils = registry.schemaUtils;
|
|
166
|
+
var itemSchema = schema.items;
|
|
76
167
|
if (utils.isFixedItems(schema) && utils.allowAdditionalItems(schema)) {
|
|
77
168
|
itemSchema = schema.additionalItems;
|
|
78
169
|
}
|
|
79
170
|
// Cast this as a T to work around schema utils being for T[] caused by the FieldProps<T[], S, F> call on the class
|
|
80
171
|
return schemaUtils.getDefaultFormState(itemSchema);
|
|
81
172
|
};
|
|
82
|
-
|
|
173
|
+
_this.onAddClick = function (event) {
|
|
83
174
|
if (event) {
|
|
84
175
|
event.preventDefault();
|
|
85
176
|
}
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
const {
|
|
90
|
-
keyedFormData
|
|
91
|
-
} = this.state;
|
|
92
|
-
const newKeyedFormDataRow = {
|
|
177
|
+
var onChange = _this.props.onChange;
|
|
178
|
+
var keyedFormData = _this.state.keyedFormData;
|
|
179
|
+
var newKeyedFormDataRow = {
|
|
93
180
|
key: generateRowId(),
|
|
94
|
-
item:
|
|
181
|
+
item: _this._getNewFormDataRow()
|
|
95
182
|
};
|
|
96
|
-
|
|
97
|
-
|
|
183
|
+
var newKeyedFormData = [].concat(keyedFormData, [newKeyedFormDataRow]);
|
|
184
|
+
_this.setState({
|
|
98
185
|
keyedFormData: newKeyedFormData,
|
|
99
186
|
updatedKeyedFormData: true
|
|
100
|
-
}, ()
|
|
187
|
+
}, function () {
|
|
188
|
+
return onChange(keyedToPlainFormData(newKeyedFormData));
|
|
189
|
+
});
|
|
101
190
|
};
|
|
102
|
-
|
|
103
|
-
return event
|
|
191
|
+
_this.onAddIndexClick = function (index) {
|
|
192
|
+
return function (event) {
|
|
104
193
|
if (event) {
|
|
105
194
|
event.preventDefault();
|
|
106
195
|
}
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
const {
|
|
111
|
-
keyedFormData
|
|
112
|
-
} = this.state;
|
|
113
|
-
const newKeyedFormDataRow = {
|
|
196
|
+
var onChange = _this.props.onChange;
|
|
197
|
+
var keyedFormData = _this.state.keyedFormData;
|
|
198
|
+
var newKeyedFormDataRow = {
|
|
114
199
|
key: generateRowId(),
|
|
115
|
-
item:
|
|
200
|
+
item: _this._getNewFormDataRow()
|
|
116
201
|
};
|
|
117
|
-
|
|
202
|
+
var newKeyedFormData = [].concat(keyedFormData);
|
|
118
203
|
newKeyedFormData.splice(index, 0, newKeyedFormDataRow);
|
|
119
|
-
|
|
204
|
+
_this.setState({
|
|
120
205
|
keyedFormData: newKeyedFormData,
|
|
121
206
|
updatedKeyedFormData: true
|
|
122
|
-
}, ()
|
|
207
|
+
}, function () {
|
|
208
|
+
return onChange(keyedToPlainFormData(newKeyedFormData));
|
|
209
|
+
});
|
|
123
210
|
};
|
|
124
211
|
};
|
|
125
|
-
|
|
126
|
-
return event
|
|
212
|
+
_this.onDropIndexClick = function (index) {
|
|
213
|
+
return function (event) {
|
|
127
214
|
if (event) {
|
|
128
215
|
event.preventDefault();
|
|
129
216
|
}
|
|
130
|
-
|
|
131
|
-
onChange,
|
|
132
|
-
errorSchema
|
|
133
|
-
|
|
134
|
-
const {
|
|
135
|
-
keyedFormData
|
|
136
|
-
} = this.state;
|
|
217
|
+
var _this$props2 = _this.props,
|
|
218
|
+
onChange = _this$props2.onChange,
|
|
219
|
+
errorSchema = _this$props2.errorSchema;
|
|
220
|
+
var keyedFormData = _this.state.keyedFormData;
|
|
137
221
|
// refs #195: revalidate to ensure properly reindexing errors
|
|
138
|
-
|
|
222
|
+
var newErrorSchema;
|
|
139
223
|
if (errorSchema) {
|
|
140
224
|
newErrorSchema = {};
|
|
141
|
-
for (
|
|
142
|
-
|
|
225
|
+
for (var idx in errorSchema) {
|
|
226
|
+
var i = parseInt(idx);
|
|
143
227
|
if (i < index) {
|
|
144
228
|
set__default["default"](newErrorSchema, [i], errorSchema[idx]);
|
|
145
229
|
} else if (i > index) {
|
|
@@ -147,28 +231,31 @@ class ArrayField extends React.Component {
|
|
|
147
231
|
}
|
|
148
232
|
}
|
|
149
233
|
}
|
|
150
|
-
|
|
151
|
-
|
|
234
|
+
var newKeyedFormData = keyedFormData.filter(function (_, i) {
|
|
235
|
+
return i !== index;
|
|
236
|
+
});
|
|
237
|
+
_this.setState({
|
|
152
238
|
keyedFormData: newKeyedFormData,
|
|
153
239
|
updatedKeyedFormData: true
|
|
154
|
-
},
|
|
240
|
+
}, function () {
|
|
241
|
+
return onChange(keyedToPlainFormData(newKeyedFormData), newErrorSchema);
|
|
242
|
+
});
|
|
155
243
|
};
|
|
156
244
|
};
|
|
157
|
-
|
|
158
|
-
return event
|
|
245
|
+
_this.onReorderClick = function (index, newIndex) {
|
|
246
|
+
return function (event) {
|
|
159
247
|
if (event) {
|
|
160
248
|
event.preventDefault();
|
|
161
249
|
event.currentTarget.blur();
|
|
162
250
|
}
|
|
163
|
-
|
|
164
|
-
onChange,
|
|
165
|
-
errorSchema
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
if (this.props.errorSchema) {
|
|
251
|
+
var _this$props3 = _this.props,
|
|
252
|
+
onChange = _this$props3.onChange,
|
|
253
|
+
errorSchema = _this$props3.errorSchema;
|
|
254
|
+
var newErrorSchema;
|
|
255
|
+
if (_this.props.errorSchema) {
|
|
169
256
|
newErrorSchema = {};
|
|
170
|
-
for (
|
|
171
|
-
|
|
257
|
+
for (var idx in errorSchema) {
|
|
258
|
+
var i = parseInt(idx);
|
|
172
259
|
if (i == index) {
|
|
173
260
|
set__default["default"](newErrorSchema, [newIndex], errorSchema[index]);
|
|
174
261
|
} else if (i == newIndex) {
|
|
@@ -178,58 +265,54 @@ class ArrayField extends React.Component {
|
|
|
178
265
|
}
|
|
179
266
|
}
|
|
180
267
|
}
|
|
181
|
-
|
|
182
|
-
keyedFormData
|
|
183
|
-
} = this.state;
|
|
268
|
+
var keyedFormData = _this.state.keyedFormData;
|
|
184
269
|
function reOrderArray() {
|
|
185
270
|
// Copy item
|
|
186
|
-
|
|
271
|
+
var _newKeyedFormData = keyedFormData.slice();
|
|
187
272
|
// Moves item from index to newIndex
|
|
188
273
|
_newKeyedFormData.splice(index, 1);
|
|
189
274
|
_newKeyedFormData.splice(newIndex, 0, keyedFormData[index]);
|
|
190
275
|
return _newKeyedFormData;
|
|
191
276
|
}
|
|
192
|
-
|
|
193
|
-
|
|
277
|
+
var newKeyedFormData = reOrderArray();
|
|
278
|
+
_this.setState({
|
|
194
279
|
keyedFormData: newKeyedFormData
|
|
195
|
-
},
|
|
280
|
+
}, function () {
|
|
281
|
+
return onChange(keyedToPlainFormData(newKeyedFormData), newErrorSchema);
|
|
282
|
+
});
|
|
196
283
|
};
|
|
197
284
|
};
|
|
198
|
-
|
|
199
|
-
return (value, newErrorSchema, id)
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
285
|
+
_this.onChangeForIndex = function (index) {
|
|
286
|
+
return function (value, newErrorSchema, id) {
|
|
287
|
+
var _extends2;
|
|
288
|
+
var _this$props4 = _this.props,
|
|
289
|
+
formData = _this$props4.formData,
|
|
290
|
+
onChange = _this$props4.onChange,
|
|
291
|
+
errorSchema = _this$props4.errorSchema;
|
|
292
|
+
var arrayData = Array.isArray(formData) ? formData : [];
|
|
293
|
+
var newFormData = arrayData.map(function (item, i) {
|
|
207
294
|
// We need to treat undefined items as nulls to have validation.
|
|
208
295
|
// See https://github.com/tdegrunt/jsonschema/issues/206
|
|
209
|
-
|
|
296
|
+
var jsonValue = typeof value === "undefined" ? null : value;
|
|
210
297
|
return index === i ? jsonValue : item;
|
|
211
298
|
});
|
|
212
|
-
onChange(newFormData, errorSchema && errorSchema && {
|
|
213
|
-
...errorSchema,
|
|
214
|
-
[index]: newErrorSchema
|
|
215
|
-
}, id);
|
|
299
|
+
onChange(newFormData, errorSchema && errorSchema && _extends({}, errorSchema, (_extends2 = {}, _extends2[index] = newErrorSchema, _extends2)), id);
|
|
216
300
|
};
|
|
217
301
|
};
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
onChange,
|
|
221
|
-
idSchema
|
|
222
|
-
} = this.props;
|
|
302
|
+
_this.onSelectChange = function (value) {
|
|
303
|
+
var _this$props5 = _this.props,
|
|
304
|
+
onChange = _this$props5.onChange,
|
|
305
|
+
idSchema = _this$props5.idSchema;
|
|
223
306
|
onChange(value, undefined, idSchema && idSchema.$id);
|
|
224
307
|
};
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
this.state = {
|
|
308
|
+
var _props$formData = props.formData,
|
|
309
|
+
_formData = _props$formData === void 0 ? [] : _props$formData;
|
|
310
|
+
var _keyedFormData = generateKeyedFormData(_formData);
|
|
311
|
+
_this.state = {
|
|
230
312
|
keyedFormData: _keyedFormData,
|
|
231
313
|
updatedKeyedFormData: false
|
|
232
314
|
};
|
|
315
|
+
return _this;
|
|
233
316
|
}
|
|
234
317
|
/** React lifecycle method that is called when the props are about to change allowing the state to be updated. It
|
|
235
318
|
* regenerates the keyed form data and returns it
|
|
@@ -237,16 +320,16 @@ class ArrayField extends React.Component {
|
|
|
237
320
|
* @param nextProps - The next set of props data
|
|
238
321
|
* @param prevState - The previous set of state data
|
|
239
322
|
*/
|
|
240
|
-
|
|
323
|
+
ArrayField.getDerivedStateFromProps = function getDerivedStateFromProps(nextProps, prevState) {
|
|
241
324
|
// Don't call getDerivedStateFromProps if keyed formdata was just updated.
|
|
242
325
|
if (prevState.updatedKeyedFormData) {
|
|
243
326
|
return {
|
|
244
327
|
updatedKeyedFormData: false
|
|
245
328
|
};
|
|
246
329
|
}
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
330
|
+
var nextFormData = Array.isArray(nextProps.formData) ? nextProps.formData : [];
|
|
331
|
+
var previousKeyedFormData = prevState.keyedFormData || [];
|
|
332
|
+
var newKeyedFormData = nextFormData.length === previousKeyedFormData.length ? previousKeyedFormData.map(function (previousKeyedFormDatum, index) {
|
|
250
333
|
return {
|
|
251
334
|
key: previousKeyedFormDatum.key,
|
|
252
335
|
item: nextFormData[index]
|
|
@@ -258,20 +341,15 @@ class ArrayField extends React.Component {
|
|
|
258
341
|
}
|
|
259
342
|
/** Returns the appropriate title for an item by getting first the title from the schema.items, then falling back to
|
|
260
343
|
* the description from the schema.items, and finally the string "Item"
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
const {
|
|
264
|
-
schema
|
|
265
|
-
} = this.props;
|
|
266
|
-
return get__default["default"](schema, [utils.ITEMS_KEY, "title"], get__default["default"](schema, [utils.ITEMS_KEY, "description"], "Item"));
|
|
267
|
-
}
|
|
344
|
+
*/;
|
|
345
|
+
var _proto = ArrayField.prototype;
|
|
268
346
|
/** Determines whether the item described in the schema is always required, which is determined by whether any item
|
|
269
347
|
* may be null.
|
|
270
348
|
*
|
|
271
349
|
* @param itemSchema - The schema for the item
|
|
272
350
|
* @return - True if the item schema type does not contain the "null" type
|
|
273
351
|
*/
|
|
274
|
-
isItemRequired(itemSchema) {
|
|
352
|
+
_proto.isItemRequired = function isItemRequired(itemSchema) {
|
|
275
353
|
if (Array.isArray(itemSchema.type)) {
|
|
276
354
|
// While we don't yet support composite/nullable jsonschema types, it's
|
|
277
355
|
// future-proof to check for requirement against these.
|
|
@@ -286,15 +364,13 @@ class ArrayField extends React.Component {
|
|
|
286
364
|
*
|
|
287
365
|
* @param formItems - The list of items in the form
|
|
288
366
|
* @returns - True if the item is addable otherwise false
|
|
289
|
-
|
|
290
|
-
canAddItem(formItems) {
|
|
291
|
-
|
|
292
|
-
schema,
|
|
293
|
-
uiSchema
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
addable
|
|
297
|
-
} = utils.getUiOptions(uiSchema);
|
|
367
|
+
*/;
|
|
368
|
+
_proto.canAddItem = function canAddItem(formItems) {
|
|
369
|
+
var _this$props6 = this.props,
|
|
370
|
+
schema = _this$props6.schema,
|
|
371
|
+
uiSchema = _this$props6.uiSchema;
|
|
372
|
+
var _getUiOptions = utils.getUiOptions(uiSchema),
|
|
373
|
+
addable = _getUiOptions.addable;
|
|
298
374
|
if (addable !== false) {
|
|
299
375
|
// if ui:options.addable was not explicitly set to false, we can add
|
|
300
376
|
// another item if we have not exceeded maxItems yet
|
|
@@ -308,23 +384,19 @@ class ArrayField extends React.Component {
|
|
|
308
384
|
}
|
|
309
385
|
/** Returns the default form information for an item based on the schema for that item. Deals with the possibility
|
|
310
386
|
* that the schema is fixed and allows additional items.
|
|
311
|
-
|
|
312
|
-
|
|
387
|
+
*/;
|
|
313
388
|
/** Renders the `ArrayField` depending on the specific needs of the schema and uischema elements
|
|
314
389
|
*/
|
|
315
|
-
render() {
|
|
316
|
-
|
|
317
|
-
schema,
|
|
318
|
-
uiSchema,
|
|
319
|
-
idSchema,
|
|
320
|
-
registry
|
|
321
|
-
|
|
322
|
-
const {
|
|
323
|
-
schemaUtils
|
|
324
|
-
} = registry;
|
|
390
|
+
_proto.render = function render() {
|
|
391
|
+
var _this$props7 = this.props,
|
|
392
|
+
schema = _this$props7.schema,
|
|
393
|
+
uiSchema = _this$props7.uiSchema,
|
|
394
|
+
idSchema = _this$props7.idSchema,
|
|
395
|
+
registry = _this$props7.registry;
|
|
396
|
+
var schemaUtils = registry.schemaUtils;
|
|
325
397
|
if (!(utils.ITEMS_KEY in schema)) {
|
|
326
|
-
|
|
327
|
-
|
|
398
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
399
|
+
var UnsupportedFieldTemplate = utils.getTemplate("UnsupportedFieldTemplate", registry, uiOptions);
|
|
328
400
|
return /*#__PURE__*/React__default["default"].createElement(UnsupportedFieldTemplate, {
|
|
329
401
|
schema: schema,
|
|
330
402
|
idSchema: idSchema,
|
|
@@ -348,116 +420,115 @@ class ArrayField extends React.Component {
|
|
|
348
420
|
return this.renderNormalArray();
|
|
349
421
|
}
|
|
350
422
|
/** Renders a normal array without any limitations of length
|
|
351
|
-
|
|
352
|
-
renderNormalArray() {
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
|
|
356
|
-
|
|
357
|
-
|
|
358
|
-
|
|
359
|
-
|
|
360
|
-
|
|
361
|
-
|
|
362
|
-
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
370
|
-
|
|
371
|
-
|
|
372
|
-
|
|
373
|
-
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
423
|
+
*/;
|
|
424
|
+
_proto.renderNormalArray = function renderNormalArray() {
|
|
425
|
+
var _this2 = this;
|
|
426
|
+
var _this$props8 = this.props,
|
|
427
|
+
schema = _this$props8.schema,
|
|
428
|
+
_this$props8$uiSchema = _this$props8.uiSchema,
|
|
429
|
+
uiSchema = _this$props8$uiSchema === void 0 ? {} : _this$props8$uiSchema,
|
|
430
|
+
errorSchema = _this$props8.errorSchema,
|
|
431
|
+
idSchema = _this$props8.idSchema,
|
|
432
|
+
name = _this$props8.name,
|
|
433
|
+
_this$props8$disabled = _this$props8.disabled,
|
|
434
|
+
disabled = _this$props8$disabled === void 0 ? false : _this$props8$disabled,
|
|
435
|
+
_this$props8$readonly = _this$props8.readonly,
|
|
436
|
+
readonly = _this$props8$readonly === void 0 ? false : _this$props8$readonly,
|
|
437
|
+
_this$props8$autofocu = _this$props8.autofocus,
|
|
438
|
+
autofocus = _this$props8$autofocu === void 0 ? false : _this$props8$autofocu,
|
|
439
|
+
_this$props8$required = _this$props8.required,
|
|
440
|
+
required = _this$props8$required === void 0 ? false : _this$props8$required,
|
|
441
|
+
registry = _this$props8.registry,
|
|
442
|
+
onBlur = _this$props8.onBlur,
|
|
443
|
+
onFocus = _this$props8.onFocus,
|
|
444
|
+
idPrefix = _this$props8.idPrefix,
|
|
445
|
+
_this$props8$idSepara = _this$props8.idSeparator,
|
|
446
|
+
idSeparator = _this$props8$idSepara === void 0 ? "_" : _this$props8$idSepara,
|
|
447
|
+
rawErrors = _this$props8.rawErrors;
|
|
448
|
+
var keyedFormData = this.state.keyedFormData;
|
|
449
|
+
var title = schema.title === undefined ? name : schema.title;
|
|
450
|
+
var schemaUtils = registry.schemaUtils,
|
|
451
|
+
formContext = registry.formContext;
|
|
452
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
453
|
+
var _schemaItems = isObject__default["default"](schema.items) ? schema.items : {};
|
|
454
|
+
var itemsSchema = schemaUtils.retrieveSchema(_schemaItems);
|
|
455
|
+
var formData = keyedToPlainFormData(this.state.keyedFormData);
|
|
456
|
+
var arrayProps = {
|
|
383
457
|
canAdd: this.canAddItem(formData),
|
|
384
|
-
items: keyedFormData.map((keyedItem, index)
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
item
|
|
388
|
-
} = keyedItem;
|
|
458
|
+
items: keyedFormData.map(function (keyedItem, index) {
|
|
459
|
+
var key = keyedItem.key,
|
|
460
|
+
item = keyedItem.item;
|
|
389
461
|
// While we are actually dealing with a single item of type T, the types require a T[], so cast
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
return
|
|
396
|
-
key,
|
|
397
|
-
index,
|
|
398
|
-
name: name &&
|
|
462
|
+
var itemCast = item;
|
|
463
|
+
var itemSchema = schemaUtils.retrieveSchema(_schemaItems, itemCast);
|
|
464
|
+
var itemErrorSchema = errorSchema ? errorSchema[index] : undefined;
|
|
465
|
+
var itemIdPrefix = idSchema.$id + idSeparator + index;
|
|
466
|
+
var itemIdSchema = schemaUtils.toIdSchema(itemSchema, itemIdPrefix, itemCast, idPrefix, idSeparator);
|
|
467
|
+
return _this2.renderArrayFieldItem({
|
|
468
|
+
key: key,
|
|
469
|
+
index: index,
|
|
470
|
+
name: name && name + "-" + index,
|
|
399
471
|
canMoveUp: index > 0,
|
|
400
472
|
canMoveDown: index < formData.length - 1,
|
|
401
|
-
itemSchema,
|
|
402
|
-
itemIdSchema,
|
|
403
|
-
itemErrorSchema,
|
|
473
|
+
itemSchema: itemSchema,
|
|
474
|
+
itemIdSchema: itemIdSchema,
|
|
475
|
+
itemErrorSchema: itemErrorSchema,
|
|
404
476
|
itemData: itemCast,
|
|
405
477
|
itemUiSchema: uiSchema.items,
|
|
406
478
|
autofocus: autofocus && index === 0,
|
|
407
|
-
onBlur,
|
|
408
|
-
onFocus,
|
|
409
|
-
rawErrors
|
|
479
|
+
onBlur: onBlur,
|
|
480
|
+
onFocus: onFocus,
|
|
481
|
+
rawErrors: rawErrors
|
|
410
482
|
});
|
|
411
483
|
}),
|
|
412
|
-
className:
|
|
413
|
-
disabled,
|
|
414
|
-
idSchema,
|
|
415
|
-
uiSchema,
|
|
484
|
+
className: "field field-array field-array-of-" + itemsSchema.type,
|
|
485
|
+
disabled: disabled,
|
|
486
|
+
idSchema: idSchema,
|
|
487
|
+
uiSchema: uiSchema,
|
|
416
488
|
onAddClick: this.onAddClick,
|
|
417
|
-
readonly,
|
|
418
|
-
required,
|
|
419
|
-
schema,
|
|
420
|
-
title,
|
|
421
|
-
formContext,
|
|
422
|
-
formData,
|
|
423
|
-
rawErrors,
|
|
424
|
-
registry
|
|
489
|
+
readonly: readonly,
|
|
490
|
+
required: required,
|
|
491
|
+
schema: schema,
|
|
492
|
+
title: title,
|
|
493
|
+
formContext: formContext,
|
|
494
|
+
formData: formData,
|
|
495
|
+
rawErrors: rawErrors,
|
|
496
|
+
registry: registry
|
|
425
497
|
};
|
|
426
|
-
|
|
427
|
-
return /*#__PURE__*/React__default["default"].createElement(Template, {
|
|
428
|
-
...arrayProps
|
|
429
|
-
});
|
|
498
|
+
var Template = utils.getTemplate("ArrayFieldTemplate", registry, uiOptions);
|
|
499
|
+
return /*#__PURE__*/React__default["default"].createElement(Template, _extends({}, arrayProps));
|
|
430
500
|
}
|
|
431
501
|
/** Renders an array using the custom widget provided by the user in the `uiSchema`
|
|
432
|
-
|
|
433
|
-
renderCustomWidget() {
|
|
434
|
-
|
|
435
|
-
schema,
|
|
436
|
-
idSchema,
|
|
437
|
-
uiSchema,
|
|
438
|
-
disabled =
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
502
|
+
*/;
|
|
503
|
+
_proto.renderCustomWidget = function renderCustomWidget() {
|
|
504
|
+
var _this$props9 = this.props,
|
|
505
|
+
schema = _this$props9.schema,
|
|
506
|
+
idSchema = _this$props9.idSchema,
|
|
507
|
+
uiSchema = _this$props9.uiSchema,
|
|
508
|
+
_this$props9$disabled = _this$props9.disabled,
|
|
509
|
+
disabled = _this$props9$disabled === void 0 ? false : _this$props9$disabled,
|
|
510
|
+
_this$props9$readonly = _this$props9.readonly,
|
|
511
|
+
readonly = _this$props9$readonly === void 0 ? false : _this$props9$readonly,
|
|
512
|
+
_this$props9$autofocu = _this$props9.autofocus,
|
|
513
|
+
autofocus = _this$props9$autofocu === void 0 ? false : _this$props9$autofocu,
|
|
514
|
+
_this$props9$required = _this$props9.required,
|
|
515
|
+
required = _this$props9$required === void 0 ? false : _this$props9$required,
|
|
516
|
+
hideError = _this$props9.hideError,
|
|
517
|
+
placeholder = _this$props9.placeholder,
|
|
518
|
+
onBlur = _this$props9.onBlur,
|
|
519
|
+
onFocus = _this$props9.onFocus,
|
|
520
|
+
_this$props9$formData = _this$props9.formData,
|
|
521
|
+
items = _this$props9$formData === void 0 ? [] : _this$props9$formData,
|
|
522
|
+
registry = _this$props9.registry,
|
|
523
|
+
rawErrors = _this$props9.rawErrors,
|
|
524
|
+
name = _this$props9.name;
|
|
525
|
+
var widgets = registry.widgets,
|
|
526
|
+
formContext = registry.formContext;
|
|
527
|
+
var title = schema.title || name;
|
|
528
|
+
var _getUiOptions2 = utils.getUiOptions(uiSchema),
|
|
529
|
+
widget = _getUiOptions2.widget,
|
|
530
|
+
options = _objectWithoutPropertiesLoose(_getUiOptions2, _excluded$9);
|
|
531
|
+
var Widget = utils.getWidget(schema, widget, widgets);
|
|
461
532
|
return /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
462
533
|
id: idSchema && idSchema.$id,
|
|
463
534
|
multiple: true,
|
|
@@ -481,47 +552,48 @@ class ArrayField extends React.Component {
|
|
|
481
552
|
});
|
|
482
553
|
}
|
|
483
554
|
/** Renders an array as a set of checkboxes
|
|
484
|
-
|
|
485
|
-
renderMultiSelect() {
|
|
486
|
-
|
|
487
|
-
schema,
|
|
488
|
-
idSchema,
|
|
489
|
-
uiSchema,
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
555
|
+
*/;
|
|
556
|
+
_proto.renderMultiSelect = function renderMultiSelect() {
|
|
557
|
+
var _this$props10 = this.props,
|
|
558
|
+
schema = _this$props10.schema,
|
|
559
|
+
idSchema = _this$props10.idSchema,
|
|
560
|
+
uiSchema = _this$props10.uiSchema,
|
|
561
|
+
_this$props10$formDat = _this$props10.formData,
|
|
562
|
+
items = _this$props10$formDat === void 0 ? [] : _this$props10$formDat,
|
|
563
|
+
_this$props10$disable = _this$props10.disabled,
|
|
564
|
+
disabled = _this$props10$disable === void 0 ? false : _this$props10$disable,
|
|
565
|
+
_this$props10$readonl = _this$props10.readonly,
|
|
566
|
+
readonly = _this$props10$readonl === void 0 ? false : _this$props10$readonl,
|
|
567
|
+
_this$props10$autofoc = _this$props10.autofocus,
|
|
568
|
+
autofocus = _this$props10$autofoc === void 0 ? false : _this$props10$autofoc,
|
|
569
|
+
_this$props10$require = _this$props10.required,
|
|
570
|
+
required = _this$props10$require === void 0 ? false : _this$props10$require,
|
|
571
|
+
placeholder = _this$props10.placeholder,
|
|
572
|
+
onBlur = _this$props10.onBlur,
|
|
573
|
+
onFocus = _this$props10.onFocus,
|
|
574
|
+
registry = _this$props10.registry,
|
|
575
|
+
rawErrors = _this$props10.rawErrors,
|
|
576
|
+
name = _this$props10.name;
|
|
577
|
+
var widgets = registry.widgets,
|
|
578
|
+
schemaUtils = registry.schemaUtils,
|
|
579
|
+
formContext = registry.formContext;
|
|
580
|
+
var itemsSchema = schemaUtils.retrieveSchema(schema.items, items);
|
|
581
|
+
var title = schema.title || name;
|
|
582
|
+
var enumOptions = utils.optionsList(itemsSchema);
|
|
583
|
+
var _getUiOptions3 = utils.getUiOptions(uiSchema),
|
|
584
|
+
_getUiOptions3$widget = _getUiOptions3.widget,
|
|
585
|
+
widget = _getUiOptions3$widget === void 0 ? "select" : _getUiOptions3$widget,
|
|
586
|
+
options = _objectWithoutPropertiesLoose(_getUiOptions3, _excluded2);
|
|
587
|
+
var Widget = utils.getWidget(schema, widget, widgets);
|
|
515
588
|
return /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
516
589
|
id: idSchema && idSchema.$id,
|
|
517
590
|
multiple: true,
|
|
518
591
|
onChange: this.onSelectChange,
|
|
519
592
|
onBlur: onBlur,
|
|
520
593
|
onFocus: onFocus,
|
|
521
|
-
options: {
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
},
|
|
594
|
+
options: _extends({}, options, {
|
|
595
|
+
enumOptions: enumOptions
|
|
596
|
+
}),
|
|
525
597
|
schema: schema,
|
|
526
598
|
uiSchema: uiSchema,
|
|
527
599
|
registry: registry,
|
|
@@ -537,33 +609,35 @@ class ArrayField extends React.Component {
|
|
|
537
609
|
});
|
|
538
610
|
}
|
|
539
611
|
/** Renders an array of files using the `FileWidget`
|
|
540
|
-
|
|
541
|
-
renderFiles() {
|
|
542
|
-
|
|
543
|
-
schema,
|
|
544
|
-
uiSchema,
|
|
545
|
-
idSchema,
|
|
546
|
-
name,
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
612
|
+
*/;
|
|
613
|
+
_proto.renderFiles = function renderFiles() {
|
|
614
|
+
var _this$props11 = this.props,
|
|
615
|
+
schema = _this$props11.schema,
|
|
616
|
+
uiSchema = _this$props11.uiSchema,
|
|
617
|
+
idSchema = _this$props11.idSchema,
|
|
618
|
+
name = _this$props11.name,
|
|
619
|
+
_this$props11$disable = _this$props11.disabled,
|
|
620
|
+
disabled = _this$props11$disable === void 0 ? false : _this$props11$disable,
|
|
621
|
+
_this$props11$readonl = _this$props11.readonly,
|
|
622
|
+
readonly = _this$props11$readonl === void 0 ? false : _this$props11$readonl,
|
|
623
|
+
_this$props11$autofoc = _this$props11.autofocus,
|
|
624
|
+
autofocus = _this$props11$autofoc === void 0 ? false : _this$props11$autofoc,
|
|
625
|
+
_this$props11$require = _this$props11.required,
|
|
626
|
+
required = _this$props11$require === void 0 ? false : _this$props11$require,
|
|
627
|
+
onBlur = _this$props11.onBlur,
|
|
628
|
+
onFocus = _this$props11.onFocus,
|
|
629
|
+
registry = _this$props11.registry,
|
|
630
|
+
_this$props11$formDat = _this$props11.formData,
|
|
631
|
+
items = _this$props11$formDat === void 0 ? [] : _this$props11$formDat,
|
|
632
|
+
rawErrors = _this$props11.rawErrors;
|
|
633
|
+
var title = schema.title || name;
|
|
634
|
+
var widgets = registry.widgets,
|
|
635
|
+
formContext = registry.formContext;
|
|
636
|
+
var _getUiOptions4 = utils.getUiOptions(uiSchema),
|
|
637
|
+
_getUiOptions4$widget = _getUiOptions4.widget,
|
|
638
|
+
widget = _getUiOptions4$widget === void 0 ? "files" : _getUiOptions4$widget,
|
|
639
|
+
options = _objectWithoutPropertiesLoose(_getUiOptions4, _excluded3);
|
|
640
|
+
var Widget = utils.getWidget(schema, widget, widgets);
|
|
567
641
|
return /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
568
642
|
options: options,
|
|
569
643
|
id: idSchema && idSchema.$id,
|
|
@@ -586,150 +660,150 @@ class ArrayField extends React.Component {
|
|
|
586
660
|
});
|
|
587
661
|
}
|
|
588
662
|
/** Renders an array that has a maximum limit of items
|
|
589
|
-
|
|
590
|
-
renderFixedArray() {
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
663
|
+
*/;
|
|
664
|
+
_proto.renderFixedArray = function renderFixedArray() {
|
|
665
|
+
var _this3 = this;
|
|
666
|
+
var _this$props12 = this.props,
|
|
667
|
+
schema = _this$props12.schema,
|
|
668
|
+
_this$props12$uiSchem = _this$props12.uiSchema,
|
|
669
|
+
uiSchema = _this$props12$uiSchem === void 0 ? {} : _this$props12$uiSchem,
|
|
670
|
+
_this$props12$formDat = _this$props12.formData,
|
|
671
|
+
formData = _this$props12$formDat === void 0 ? [] : _this$props12$formDat,
|
|
672
|
+
errorSchema = _this$props12.errorSchema,
|
|
673
|
+
idPrefix = _this$props12.idPrefix,
|
|
674
|
+
_this$props12$idSepar = _this$props12.idSeparator,
|
|
675
|
+
idSeparator = _this$props12$idSepar === void 0 ? "_" : _this$props12$idSepar,
|
|
676
|
+
idSchema = _this$props12.idSchema,
|
|
677
|
+
name = _this$props12.name,
|
|
678
|
+
_this$props12$disable = _this$props12.disabled,
|
|
679
|
+
disabled = _this$props12$disable === void 0 ? false : _this$props12$disable,
|
|
680
|
+
_this$props12$readonl = _this$props12.readonly,
|
|
681
|
+
readonly = _this$props12$readonl === void 0 ? false : _this$props12$readonl,
|
|
682
|
+
_this$props12$autofoc = _this$props12.autofocus,
|
|
683
|
+
autofocus = _this$props12$autofoc === void 0 ? false : _this$props12$autofoc,
|
|
684
|
+
_this$props12$require = _this$props12.required,
|
|
685
|
+
required = _this$props12$require === void 0 ? false : _this$props12$require,
|
|
686
|
+
registry = _this$props12.registry,
|
|
687
|
+
onBlur = _this$props12.onBlur,
|
|
688
|
+
onFocus = _this$props12.onFocus,
|
|
689
|
+
rawErrors = _this$props12.rawErrors;
|
|
690
|
+
var keyedFormData = this.state.keyedFormData;
|
|
691
|
+
var _this$props$formData = this.props.formData,
|
|
692
|
+
items = _this$props$formData === void 0 ? [] : _this$props$formData;
|
|
693
|
+
var title = schema.title || name;
|
|
694
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
695
|
+
var schemaUtils = registry.schemaUtils,
|
|
696
|
+
formContext = registry.formContext;
|
|
697
|
+
var _schemaItems = isObject__default["default"](schema.items) ? schema.items : [];
|
|
698
|
+
var itemSchemas = _schemaItems.map(function (item, index) {
|
|
699
|
+
return schemaUtils.retrieveSchema(item, formData[index]);
|
|
700
|
+
});
|
|
701
|
+
var additionalSchema = isObject__default["default"](schema.additionalItems) ? schemaUtils.retrieveSchema(schema.additionalItems, formData) : null;
|
|
624
702
|
if (!items || items.length < itemSchemas.length) {
|
|
625
703
|
// to make sure at least all fixed items are generated
|
|
626
704
|
items = items || [];
|
|
627
705
|
items = items.concat(new Array(itemSchemas.length - items.length));
|
|
628
706
|
}
|
|
629
707
|
// These are the props passed into the render function
|
|
630
|
-
|
|
708
|
+
var arrayProps = {
|
|
631
709
|
canAdd: this.canAddItem(items) && !!additionalSchema,
|
|
632
710
|
className: "field field-array field-array-fixed-items",
|
|
633
|
-
disabled,
|
|
634
|
-
idSchema,
|
|
635
|
-
formData,
|
|
636
|
-
items: keyedFormData.map((keyedItem, index)
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
item
|
|
640
|
-
} = keyedItem;
|
|
711
|
+
disabled: disabled,
|
|
712
|
+
idSchema: idSchema,
|
|
713
|
+
formData: formData,
|
|
714
|
+
items: keyedFormData.map(function (keyedItem, index) {
|
|
715
|
+
var key = keyedItem.key,
|
|
716
|
+
item = keyedItem.item;
|
|
641
717
|
// While we are actually dealing with a single item of type T, the types require a T[], so cast
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
return
|
|
650
|
-
key,
|
|
651
|
-
index,
|
|
652
|
-
name: name &&
|
|
718
|
+
var itemCast = item;
|
|
719
|
+
var additional = index >= itemSchemas.length;
|
|
720
|
+
var itemSchema = additional && isObject__default["default"](schema.additionalItems) ? schemaUtils.retrieveSchema(schema.additionalItems, itemCast) : itemSchemas[index];
|
|
721
|
+
var itemIdPrefix = idSchema.$id + idSeparator + index;
|
|
722
|
+
var itemIdSchema = schemaUtils.toIdSchema(itemSchema, itemIdPrefix, itemCast, idPrefix, idSeparator);
|
|
723
|
+
var itemUiSchema = additional ? uiSchema.additionalItems || {} : Array.isArray(uiSchema.items) ? uiSchema.items[index] : uiSchema.items || {};
|
|
724
|
+
var itemErrorSchema = errorSchema ? errorSchema[index] : undefined;
|
|
725
|
+
return _this3.renderArrayFieldItem({
|
|
726
|
+
key: key,
|
|
727
|
+
index: index,
|
|
728
|
+
name: name && name + "-" + index,
|
|
653
729
|
canRemove: additional,
|
|
654
730
|
canMoveUp: index >= itemSchemas.length + 1,
|
|
655
731
|
canMoveDown: additional && index < items.length - 1,
|
|
656
|
-
itemSchema,
|
|
732
|
+
itemSchema: itemSchema,
|
|
657
733
|
itemData: itemCast,
|
|
658
|
-
itemUiSchema,
|
|
659
|
-
itemIdSchema,
|
|
660
|
-
itemErrorSchema,
|
|
734
|
+
itemUiSchema: itemUiSchema,
|
|
735
|
+
itemIdSchema: itemIdSchema,
|
|
736
|
+
itemErrorSchema: itemErrorSchema,
|
|
661
737
|
autofocus: autofocus && index === 0,
|
|
662
|
-
onBlur,
|
|
663
|
-
onFocus,
|
|
664
|
-
rawErrors
|
|
738
|
+
onBlur: onBlur,
|
|
739
|
+
onFocus: onFocus,
|
|
740
|
+
rawErrors: rawErrors
|
|
665
741
|
});
|
|
666
742
|
}),
|
|
667
743
|
onAddClick: this.onAddClick,
|
|
668
|
-
readonly,
|
|
669
|
-
required,
|
|
670
|
-
registry,
|
|
671
|
-
schema,
|
|
672
|
-
uiSchema,
|
|
673
|
-
title,
|
|
674
|
-
formContext,
|
|
675
|
-
rawErrors
|
|
744
|
+
readonly: readonly,
|
|
745
|
+
required: required,
|
|
746
|
+
registry: registry,
|
|
747
|
+
schema: schema,
|
|
748
|
+
uiSchema: uiSchema,
|
|
749
|
+
title: title,
|
|
750
|
+
formContext: formContext,
|
|
751
|
+
rawErrors: rawErrors
|
|
676
752
|
};
|
|
677
|
-
|
|
678
|
-
return /*#__PURE__*/React__default["default"].createElement(Template, {
|
|
679
|
-
...arrayProps
|
|
680
|
-
});
|
|
753
|
+
var Template = utils.getTemplate("ArrayFieldTemplate", registry, uiOptions);
|
|
754
|
+
return /*#__PURE__*/React__default["default"].createElement(Template, _extends({}, arrayProps));
|
|
681
755
|
}
|
|
682
756
|
/** Renders the individual array item using a `SchemaField` along with the additional properties required to be send
|
|
683
757
|
* back to the `ArrayFieldItemTemplate`.
|
|
684
758
|
*
|
|
685
759
|
* @param props - The props for the individual array item to be rendered
|
|
686
|
-
|
|
687
|
-
renderArrayFieldItem(props) {
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
canRemove = true,
|
|
693
|
-
canMoveUp =
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
fields
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
} = utils.getUiOptions(uiSchema);
|
|
726
|
-
const has = {
|
|
760
|
+
*/;
|
|
761
|
+
_proto.renderArrayFieldItem = function renderArrayFieldItem(props) {
|
|
762
|
+
var key = props.key,
|
|
763
|
+
index = props.index,
|
|
764
|
+
name = props.name,
|
|
765
|
+
_props$canRemove = props.canRemove,
|
|
766
|
+
canRemove = _props$canRemove === void 0 ? true : _props$canRemove,
|
|
767
|
+
_props$canMoveUp = props.canMoveUp,
|
|
768
|
+
canMoveUp = _props$canMoveUp === void 0 ? true : _props$canMoveUp,
|
|
769
|
+
_props$canMoveDown = props.canMoveDown,
|
|
770
|
+
canMoveDown = _props$canMoveDown === void 0 ? true : _props$canMoveDown,
|
|
771
|
+
itemSchema = props.itemSchema,
|
|
772
|
+
itemData = props.itemData,
|
|
773
|
+
itemUiSchema = props.itemUiSchema,
|
|
774
|
+
itemIdSchema = props.itemIdSchema,
|
|
775
|
+
itemErrorSchema = props.itemErrorSchema,
|
|
776
|
+
autofocus = props.autofocus,
|
|
777
|
+
onBlur = props.onBlur,
|
|
778
|
+
onFocus = props.onFocus,
|
|
779
|
+
rawErrors = props.rawErrors;
|
|
780
|
+
var _this$props13 = this.props,
|
|
781
|
+
disabled = _this$props13.disabled,
|
|
782
|
+
hideError = _this$props13.hideError,
|
|
783
|
+
idPrefix = _this$props13.idPrefix,
|
|
784
|
+
idSeparator = _this$props13.idSeparator,
|
|
785
|
+
readonly = _this$props13.readonly,
|
|
786
|
+
uiSchema = _this$props13.uiSchema,
|
|
787
|
+
registry = _this$props13.registry,
|
|
788
|
+
formContext = _this$props13.formContext;
|
|
789
|
+
var _registry$fields = registry.fields,
|
|
790
|
+
ArraySchemaField = _registry$fields.ArraySchemaField,
|
|
791
|
+
SchemaField = _registry$fields.SchemaField;
|
|
792
|
+
var ItemSchemaField = ArraySchemaField || SchemaField;
|
|
793
|
+
var _getUiOptions5 = utils.getUiOptions(uiSchema),
|
|
794
|
+
_getUiOptions5$ordera = _getUiOptions5.orderable,
|
|
795
|
+
orderable = _getUiOptions5$ordera === void 0 ? true : _getUiOptions5$ordera,
|
|
796
|
+
_getUiOptions5$remova = _getUiOptions5.removable,
|
|
797
|
+
removable = _getUiOptions5$remova === void 0 ? true : _getUiOptions5$remova;
|
|
798
|
+
var has = {
|
|
727
799
|
moveUp: orderable && canMoveUp,
|
|
728
800
|
moveDown: orderable && canMoveDown,
|
|
729
801
|
remove: removable && canRemove,
|
|
730
802
|
toolbar: false
|
|
731
803
|
};
|
|
732
|
-
has.toolbar = Object.keys(has).some(
|
|
804
|
+
has.toolbar = Object.keys(has).some(function (key) {
|
|
805
|
+
return has[key];
|
|
806
|
+
});
|
|
733
807
|
return {
|
|
734
808
|
children: /*#__PURE__*/React__default["default"].createElement(ItemSchemaField, {
|
|
735
809
|
name: name,
|
|
@@ -754,75 +828,83 @@ class ArrayField extends React.Component {
|
|
|
754
828
|
rawErrors: rawErrors
|
|
755
829
|
}),
|
|
756
830
|
className: "array-item",
|
|
757
|
-
disabled,
|
|
831
|
+
disabled: disabled,
|
|
758
832
|
hasToolbar: has.toolbar,
|
|
759
833
|
hasMoveUp: has.moveUp,
|
|
760
834
|
hasMoveDown: has.moveDown,
|
|
761
835
|
hasRemove: has.remove,
|
|
762
|
-
index,
|
|
763
|
-
key,
|
|
836
|
+
index: index,
|
|
837
|
+
key: key,
|
|
764
838
|
onAddIndexClick: this.onAddIndexClick,
|
|
765
839
|
onDropIndexClick: this.onDropIndexClick,
|
|
766
840
|
onReorderClick: this.onReorderClick,
|
|
767
|
-
readonly,
|
|
768
|
-
registry,
|
|
841
|
+
readonly: readonly,
|
|
842
|
+
registry: registry,
|
|
843
|
+
schema: itemSchema,
|
|
769
844
|
uiSchema: itemUiSchema
|
|
770
845
|
};
|
|
771
|
-
}
|
|
772
|
-
|
|
846
|
+
};
|
|
847
|
+
_createClass(ArrayField, [{
|
|
848
|
+
key: "itemTitle",
|
|
849
|
+
get: function get() {
|
|
850
|
+
var schema = this.props.schema;
|
|
851
|
+
return get__default["default"](schema, [utils.ITEMS_KEY, "title"], get__default["default"](schema, [utils.ITEMS_KEY, "description"], "Item"));
|
|
852
|
+
}
|
|
853
|
+
}]);
|
|
854
|
+
return ArrayField;
|
|
855
|
+
}(React.Component);
|
|
773
856
|
|
|
857
|
+
var _excluded$8 = ["widget"];
|
|
774
858
|
/** The `BooleanField` component is used to render a field in the schema is boolean. It constructs `enumOptions` for the
|
|
775
859
|
* two boolean values based on the various alternatives in the schema.
|
|
776
860
|
*
|
|
777
861
|
* @param props - The `FieldProps` for this template
|
|
778
862
|
*/
|
|
779
863
|
function BooleanField(props) {
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
const {
|
|
804
|
-
widget = "checkbox",
|
|
805
|
-
...options
|
|
806
|
-
} = utils.getUiOptions(uiSchema);
|
|
807
|
-
const Widget = utils.getWidget(schema, widget, widgets);
|
|
808
|
-
let enumOptions;
|
|
864
|
+
var schema = props.schema,
|
|
865
|
+
name = props.name,
|
|
866
|
+
uiSchema = props.uiSchema,
|
|
867
|
+
idSchema = props.idSchema,
|
|
868
|
+
formData = props.formData,
|
|
869
|
+
registry = props.registry,
|
|
870
|
+
required = props.required,
|
|
871
|
+
disabled = props.disabled,
|
|
872
|
+
readonly = props.readonly,
|
|
873
|
+
autofocus = props.autofocus,
|
|
874
|
+
onChange = props.onChange,
|
|
875
|
+
onFocus = props.onFocus,
|
|
876
|
+
onBlur = props.onBlur,
|
|
877
|
+
rawErrors = props.rawErrors;
|
|
878
|
+
var title = schema.title;
|
|
879
|
+
var widgets = registry.widgets,
|
|
880
|
+
formContext = registry.formContext;
|
|
881
|
+
var _getUiOptions = utils.getUiOptions(uiSchema),
|
|
882
|
+
_getUiOptions$widget = _getUiOptions.widget,
|
|
883
|
+
widget = _getUiOptions$widget === void 0 ? "checkbox" : _getUiOptions$widget,
|
|
884
|
+
options = _objectWithoutPropertiesLoose(_getUiOptions, _excluded$8);
|
|
885
|
+
var Widget = utils.getWidget(schema, widget, widgets);
|
|
886
|
+
var enumOptions;
|
|
809
887
|
if (Array.isArray(schema.oneOf)) {
|
|
810
888
|
enumOptions = utils.optionsList({
|
|
811
|
-
oneOf: schema.oneOf.map(option
|
|
889
|
+
oneOf: schema.oneOf.map(function (option) {
|
|
812
890
|
if (isObject__default["default"](option)) {
|
|
813
|
-
return {
|
|
814
|
-
|
|
815
|
-
|
|
816
|
-
};
|
|
891
|
+
return _extends({}, option, {
|
|
892
|
+
title: option.title || (option["const"] === true ? "Yes" : "No")
|
|
893
|
+
});
|
|
817
894
|
}
|
|
818
895
|
return undefined;
|
|
819
|
-
}).filter(
|
|
896
|
+
}).filter(function (o) {
|
|
897
|
+
return o;
|
|
898
|
+
}) // cast away the error that typescript can't grok is fixed
|
|
820
899
|
});
|
|
821
900
|
} else {
|
|
901
|
+
var _schema$enum;
|
|
822
902
|
// We deprecated enumNames in v5. It's intentionally omitted from RSJFSchema type, so we need to cast here.
|
|
823
|
-
|
|
824
|
-
|
|
825
|
-
if (!schemaWithEnumNames.enumNames && enums.length === 2 && enums.every(
|
|
903
|
+
var schemaWithEnumNames = schema;
|
|
904
|
+
var enums = (_schema$enum = schema["enum"]) != null ? _schema$enum : [true, false];
|
|
905
|
+
if (!schemaWithEnumNames.enumNames && enums.length === 2 && enums.every(function (v) {
|
|
906
|
+
return typeof v === "boolean";
|
|
907
|
+
})) {
|
|
826
908
|
enumOptions = [{
|
|
827
909
|
value: enums[0],
|
|
828
910
|
label: enums[0] ? "Yes" : "No"
|
|
@@ -832,17 +914,16 @@ function BooleanField(props) {
|
|
|
832
914
|
}];
|
|
833
915
|
} else {
|
|
834
916
|
enumOptions = utils.optionsList({
|
|
835
|
-
enum: enums,
|
|
917
|
+
"enum": enums,
|
|
836
918
|
// NOTE: enumNames is deprecated, but still supported for now.
|
|
837
919
|
enumNames: schemaWithEnumNames.enumNames
|
|
838
920
|
});
|
|
839
921
|
}
|
|
840
922
|
}
|
|
841
923
|
return /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
842
|
-
options: {
|
|
843
|
-
|
|
844
|
-
|
|
845
|
-
},
|
|
924
|
+
options: _extends({}, options, {
|
|
925
|
+
enumOptions: enumOptions
|
|
926
|
+
}),
|
|
846
927
|
schema: schema,
|
|
847
928
|
uiSchema: uiSchema,
|
|
848
929
|
id: idSchema && idSchema.$id,
|
|
@@ -861,41 +942,42 @@ function BooleanField(props) {
|
|
|
861
942
|
});
|
|
862
943
|
}
|
|
863
944
|
|
|
945
|
+
var _excluded$7 = ["widget"];
|
|
864
946
|
/** The `AnyOfField` component is used to render a field in the schema that is an `anyOf`, `allOf` or `oneOf`. It tracks
|
|
865
947
|
* the currently selected option and cleans up any irrelevant data in `formData`.
|
|
866
948
|
*
|
|
867
949
|
* @param props - The `FieldProps` for this template
|
|
868
950
|
*/
|
|
869
|
-
|
|
951
|
+
var AnyOfField = /*#__PURE__*/function (_Component) {
|
|
952
|
+
_inheritsLoose(AnyOfField, _Component);
|
|
870
953
|
/** Constructs an `AnyOfField` with the given `props` to initialize the initially selected option in state
|
|
871
954
|
*
|
|
872
955
|
* @param props - The `FieldProps` for this template
|
|
873
956
|
*/
|
|
874
|
-
|
|
875
|
-
|
|
876
|
-
|
|
877
|
-
|
|
878
|
-
|
|
879
|
-
|
|
880
|
-
|
|
881
|
-
|
|
882
|
-
|
|
883
|
-
|
|
884
|
-
|
|
885
|
-
|
|
886
|
-
} = registry;
|
|
887
|
-
const newOption = schemaUtils.retrieveSchema(options[selectedOption], formData);
|
|
957
|
+
function AnyOfField(props) {
|
|
958
|
+
var _this;
|
|
959
|
+
_this = _Component.call(this, props) || this;
|
|
960
|
+
_this.onOptionChange = function (option) {
|
|
961
|
+
var selectedOption = parseInt(option, 10);
|
|
962
|
+
var _this$props = _this.props,
|
|
963
|
+
formData = _this$props.formData,
|
|
964
|
+
onChange = _this$props.onChange,
|
|
965
|
+
options = _this$props.options,
|
|
966
|
+
registry = _this$props.registry;
|
|
967
|
+
var schemaUtils = registry.schemaUtils;
|
|
968
|
+
var newOption = schemaUtils.retrieveSchema(options[selectedOption], formData);
|
|
888
969
|
// If the new option is of type object and the current data is an object,
|
|
889
970
|
// discard properties added using the old option.
|
|
890
|
-
|
|
971
|
+
var newFormData = undefined;
|
|
891
972
|
if (utils.guessType(formData) === "object" && (newOption.type === "object" || newOption.properties)) {
|
|
892
973
|
newFormData = Object.assign({}, formData);
|
|
893
|
-
|
|
974
|
+
var optionsToDiscard = options.slice();
|
|
894
975
|
optionsToDiscard.splice(selectedOption, 1);
|
|
895
976
|
// Discard any data added using other options
|
|
896
|
-
for (
|
|
897
|
-
|
|
898
|
-
|
|
977
|
+
for (var _iterator = _createForOfIteratorHelperLoose(optionsToDiscard), _step; !(_step = _iterator()).done;) {
|
|
978
|
+
var _option = _step.value;
|
|
979
|
+
if (_option.properties) {
|
|
980
|
+
for (var key in _option.properties) {
|
|
899
981
|
if (key in newFormData) {
|
|
900
982
|
unset__default["default"](newFormData, key);
|
|
901
983
|
}
|
|
@@ -905,18 +987,18 @@ class AnyOfField extends React.Component {
|
|
|
905
987
|
}
|
|
906
988
|
// Call getDefaultFormState to make sure defaults are populated on change. Pass "excludeObjectChildren"
|
|
907
989
|
// so that only the root objects themselves are created without adding undefined children properties
|
|
908
|
-
onChange(schemaUtils.getDefaultFormState(options[selectedOption], newFormData, "excludeObjectChildren"), undefined,
|
|
909
|
-
|
|
990
|
+
onChange(schemaUtils.getDefaultFormState(options[selectedOption], newFormData, "excludeObjectChildren"), undefined, _this.getFieldId());
|
|
991
|
+
_this.setState({
|
|
910
992
|
selectedOption: parseInt(option, 10)
|
|
911
993
|
});
|
|
912
994
|
};
|
|
913
|
-
|
|
914
|
-
formData
|
|
915
|
-
options
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
selectedOption: this.getMatchingOption(0, _formData, _options)
|
|
995
|
+
var _this$props2 = _this.props,
|
|
996
|
+
_formData = _this$props2.formData,
|
|
997
|
+
_options = _this$props2.options;
|
|
998
|
+
_this.state = {
|
|
999
|
+
selectedOption: _this.getMatchingOption(0, _formData, _options)
|
|
919
1000
|
};
|
|
1001
|
+
return _this;
|
|
920
1002
|
}
|
|
921
1003
|
/** React lifecycle methos that is called when the props and/or state for this component is updated. It recomputes the
|
|
922
1004
|
* currently selected option based on the overall `formData`
|
|
@@ -924,17 +1006,15 @@ class AnyOfField extends React.Component {
|
|
|
924
1006
|
* @param prevProps - The previous `FieldProps` for this template
|
|
925
1007
|
* @param prevState - The previous `AnyOfFieldState` for this template
|
|
926
1008
|
*/
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
selectedOption
|
|
935
|
-
} = this.state;
|
|
1009
|
+
var _proto = AnyOfField.prototype;
|
|
1010
|
+
_proto.componentDidUpdate = function componentDidUpdate(prevProps, prevState) {
|
|
1011
|
+
var _this$props3 = this.props,
|
|
1012
|
+
formData = _this$props3.formData,
|
|
1013
|
+
options = _this$props3.options,
|
|
1014
|
+
idSchema = _this$props3.idSchema;
|
|
1015
|
+
var selectedOption = this.state.selectedOption;
|
|
936
1016
|
if (!utils.deepEquals(formData, prevProps.formData) && idSchema.$id === prevProps.idSchema.$id) {
|
|
937
|
-
|
|
1017
|
+
var matchingOption = this.getMatchingOption(selectedOption, formData, options);
|
|
938
1018
|
if (!prevState || matchingOption === selectedOption) {
|
|
939
1019
|
return;
|
|
940
1020
|
}
|
|
@@ -948,12 +1028,10 @@ class AnyOfField extends React.Component {
|
|
|
948
1028
|
* @param formData - The new formData
|
|
949
1029
|
* @param options - The list of options to choose from
|
|
950
1030
|
* @return - The index of the `option` that best matches the `formData`
|
|
951
|
-
|
|
952
|
-
getMatchingOption(selectedOption, formData, options) {
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
} = this.props.registry;
|
|
956
|
-
const option = schemaUtils.getMatchingOption(formData, options);
|
|
1031
|
+
*/;
|
|
1032
|
+
_proto.getMatchingOption = function getMatchingOption(selectedOption, formData, options) {
|
|
1033
|
+
var schemaUtils = this.props.registry.schemaUtils;
|
|
1034
|
+
var option = schemaUtils.getMatchingOption(formData, options);
|
|
957
1035
|
if (option !== 0) {
|
|
958
1036
|
return option;
|
|
959
1037
|
}
|
|
@@ -966,56 +1044,51 @@ class AnyOfField extends React.Component {
|
|
|
966
1044
|
* the `onChange` handler.
|
|
967
1045
|
*
|
|
968
1046
|
* @param option -
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
} = this.props;
|
|
976
|
-
return `${idSchema.$id}${schema.oneOf ? "__oneof_select" : "__anyof_select"}`;
|
|
1047
|
+
*/;
|
|
1048
|
+
_proto.getFieldId = function getFieldId() {
|
|
1049
|
+
var _this$props4 = this.props,
|
|
1050
|
+
idSchema = _this$props4.idSchema,
|
|
1051
|
+
schema = _this$props4.schema;
|
|
1052
|
+
return "" + idSchema.$id + (schema.oneOf ? "__oneof_select" : "__anyof_select");
|
|
977
1053
|
}
|
|
978
1054
|
/** Renders the `AnyOfField` selector along with a `SchemaField` for the value of the `formData`
|
|
979
|
-
|
|
980
|
-
render() {
|
|
981
|
-
|
|
982
|
-
name,
|
|
983
|
-
baseType,
|
|
984
|
-
disabled =
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
|
|
991
|
-
|
|
992
|
-
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
|
|
1006
|
-
|
|
1007
|
-
|
|
1008
|
-
|
|
1009
|
-
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
...uiOptions
|
|
1013
|
-
} = utils.getUiOptions(uiSchema);
|
|
1014
|
-
const Widget = utils.getWidget({
|
|
1055
|
+
*/;
|
|
1056
|
+
_proto.render = function render() {
|
|
1057
|
+
var _this$props5 = this.props,
|
|
1058
|
+
name = _this$props5.name,
|
|
1059
|
+
baseType = _this$props5.baseType,
|
|
1060
|
+
_this$props5$disabled = _this$props5.disabled,
|
|
1061
|
+
disabled = _this$props5$disabled === void 0 ? false : _this$props5$disabled,
|
|
1062
|
+
_this$props5$readonly = _this$props5.readonly,
|
|
1063
|
+
readonly = _this$props5$readonly === void 0 ? false : _this$props5$readonly,
|
|
1064
|
+
_this$props5$hideErro = _this$props5.hideError,
|
|
1065
|
+
hideError = _this$props5$hideErro === void 0 ? false : _this$props5$hideErro,
|
|
1066
|
+
_this$props5$errorSch = _this$props5.errorSchema,
|
|
1067
|
+
errorSchema = _this$props5$errorSch === void 0 ? {} : _this$props5$errorSch,
|
|
1068
|
+
formData = _this$props5.formData,
|
|
1069
|
+
formContext = _this$props5.formContext,
|
|
1070
|
+
idPrefix = _this$props5.idPrefix,
|
|
1071
|
+
idSeparator = _this$props5.idSeparator,
|
|
1072
|
+
idSchema = _this$props5.idSchema,
|
|
1073
|
+
onBlur = _this$props5.onBlur,
|
|
1074
|
+
onChange = _this$props5.onChange,
|
|
1075
|
+
onFocus = _this$props5.onFocus,
|
|
1076
|
+
options = _this$props5.options,
|
|
1077
|
+
registry = _this$props5.registry,
|
|
1078
|
+
uiSchema = _this$props5.uiSchema;
|
|
1079
|
+
var widgets = registry.widgets,
|
|
1080
|
+
fields = registry.fields;
|
|
1081
|
+
var _SchemaField = fields.SchemaField;
|
|
1082
|
+
var selectedOption = this.state.selectedOption;
|
|
1083
|
+
var _getUiOptions = utils.getUiOptions(uiSchema),
|
|
1084
|
+
_getUiOptions$widget = _getUiOptions.widget,
|
|
1085
|
+
widget = _getUiOptions$widget === void 0 ? "select" : _getUiOptions$widget,
|
|
1086
|
+
uiOptions = _objectWithoutPropertiesLoose(_getUiOptions, _excluded$7);
|
|
1087
|
+
var Widget = utils.getWidget({
|
|
1015
1088
|
type: "number"
|
|
1016
1089
|
}, widget, widgets);
|
|
1017
|
-
|
|
1018
|
-
|
|
1090
|
+
var option = options[selectedOption] || null;
|
|
1091
|
+
var optionSchema;
|
|
1019
1092
|
if (option) {
|
|
1020
1093
|
// If the subschema doesn't declare a type, infer the type from the
|
|
1021
1094
|
// parent schema
|
|
@@ -1023,32 +1096,34 @@ class AnyOfField extends React.Component {
|
|
|
1023
1096
|
type: baseType
|
|
1024
1097
|
});
|
|
1025
1098
|
}
|
|
1026
|
-
|
|
1027
|
-
|
|
1028
|
-
|
|
1029
|
-
|
|
1099
|
+
var enumOptions = options.map(function (option, index) {
|
|
1100
|
+
return {
|
|
1101
|
+
label: option.title || "Option " + (index + 1),
|
|
1102
|
+
value: index
|
|
1103
|
+
};
|
|
1104
|
+
});
|
|
1030
1105
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1031
1106
|
className: "panel panel-default panel-body"
|
|
1032
1107
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1033
1108
|
className: "form-group"
|
|
1034
|
-
}, /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
1109
|
+
}, /*#__PURE__*/React__default["default"].createElement(Widget, _extends({
|
|
1035
1110
|
id: this.getFieldId(),
|
|
1036
1111
|
schema: {
|
|
1037
1112
|
type: "number",
|
|
1038
|
-
default: 0
|
|
1113
|
+
"default": 0
|
|
1039
1114
|
},
|
|
1040
1115
|
onChange: this.onOptionChange,
|
|
1041
1116
|
onBlur: onBlur,
|
|
1042
1117
|
onFocus: onFocus,
|
|
1043
1118
|
value: selectedOption,
|
|
1044
1119
|
options: {
|
|
1045
|
-
enumOptions
|
|
1120
|
+
enumOptions: enumOptions
|
|
1046
1121
|
},
|
|
1047
1122
|
registry: registry,
|
|
1048
|
-
formContext: formContext
|
|
1049
|
-
|
|
1123
|
+
formContext: formContext
|
|
1124
|
+
}, uiOptions, {
|
|
1050
1125
|
label: ""
|
|
1051
|
-
})), option !== null && /*#__PURE__*/React__default["default"].createElement(_SchemaField, {
|
|
1126
|
+
}))), option !== null && /*#__PURE__*/React__default["default"].createElement(_SchemaField, {
|
|
1052
1127
|
name: name,
|
|
1053
1128
|
schema: optionSchema,
|
|
1054
1129
|
uiSchema: uiSchema,
|
|
@@ -1066,19 +1141,20 @@ class AnyOfField extends React.Component {
|
|
|
1066
1141
|
readonly: readonly,
|
|
1067
1142
|
hideError: hideError
|
|
1068
1143
|
}));
|
|
1069
|
-
}
|
|
1070
|
-
|
|
1144
|
+
};
|
|
1145
|
+
return AnyOfField;
|
|
1146
|
+
}(React.Component);
|
|
1071
1147
|
|
|
1072
1148
|
// Matches a string that ends in a . character, optionally followed by a sequence of
|
|
1073
1149
|
// digits followed by any number of 0 characters up until the end of the line.
|
|
1074
1150
|
// Ensuring that there is at least one prefixed character is important so that
|
|
1075
1151
|
// you don't incorrectly match against "0".
|
|
1076
|
-
|
|
1152
|
+
var trailingCharMatcherWithPrefix = /\.([0-9]*0)*$/;
|
|
1077
1153
|
// This is used for trimming the trailing 0 and . characters without affecting
|
|
1078
1154
|
// the rest of the string. Its possible to use one RegEx with groups for this
|
|
1079
1155
|
// functionality, but it is fairly complex compared to simply defining two
|
|
1080
1156
|
// different matchers.
|
|
1081
|
-
|
|
1157
|
+
var trailingCharMatcher = /[0.]0*$/;
|
|
1082
1158
|
/**
|
|
1083
1159
|
* The NumberField class has some special handling for dealing with trailing
|
|
1084
1160
|
* decimal points and/or zeroes. This logic is designed to allow trailing values
|
|
@@ -1097,51 +1173,48 @@ const trailingCharMatcher = /[0.]0*$/;
|
|
|
1097
1173
|
* value is passed to the input instead of the formData value
|
|
1098
1174
|
*/
|
|
1099
1175
|
function NumberField(props) {
|
|
1100
|
-
|
|
1101
|
-
|
|
1102
|
-
|
|
1103
|
-
|
|
1104
|
-
|
|
1105
|
-
|
|
1106
|
-
|
|
1107
|
-
|
|
1108
|
-
|
|
1109
|
-
} = registry.fields;
|
|
1110
|
-
let value = formData;
|
|
1176
|
+
var registry = props.registry,
|
|
1177
|
+
onChange = props.onChange,
|
|
1178
|
+
formData = props.formData,
|
|
1179
|
+
initialValue = props.value;
|
|
1180
|
+
var _useState = React.useState(initialValue),
|
|
1181
|
+
lastValue = _useState[0],
|
|
1182
|
+
setLastValue = _useState[1];
|
|
1183
|
+
var StringField = registry.fields.StringField;
|
|
1184
|
+
var value = formData;
|
|
1111
1185
|
/** Handle the change from the `StringField` to properly convert to a number
|
|
1112
1186
|
*
|
|
1113
1187
|
* @param value - The current value for the change occurring
|
|
1114
1188
|
*/
|
|
1115
|
-
|
|
1189
|
+
var handleChange = React.useCallback(function (value) {
|
|
1116
1190
|
// Cache the original value in component state
|
|
1117
1191
|
setLastValue(value);
|
|
1118
1192
|
// Normalize decimals that don't start with a zero character in advance so
|
|
1119
1193
|
// that the rest of the normalization logic is simpler
|
|
1120
|
-
if (
|
|
1121
|
-
value =
|
|
1194
|
+
if (("" + value).charAt(0) === ".") {
|
|
1195
|
+
value = "0" + value;
|
|
1122
1196
|
}
|
|
1123
1197
|
// Check that the value is a string (this can happen if the widget used is a
|
|
1124
1198
|
// <select>, due to an enum declaration etc) then, if the value ends in a
|
|
1125
1199
|
// trailing decimal point or multiple zeroes, strip the trailing values
|
|
1126
|
-
|
|
1200
|
+
var processed = typeof value === "string" && value.match(trailingCharMatcherWithPrefix) ? utils.asNumber(value.replace(trailingCharMatcher, "")) : utils.asNumber(value);
|
|
1127
1201
|
onChange(processed);
|
|
1128
1202
|
}, [onChange]);
|
|
1129
1203
|
if (typeof lastValue === "string" && typeof value === "number") {
|
|
1130
1204
|
// Construct a regular expression that checks for a string that consists
|
|
1131
1205
|
// of the formData value suffixed with zero or one '.' characters and zero
|
|
1132
1206
|
// or more '0' characters
|
|
1133
|
-
|
|
1207
|
+
var re = new RegExp(("" + value).replace(".", "\\.") + "\\.?0*$");
|
|
1134
1208
|
// If the cached "lastValue" is a match, use that instead of the formData
|
|
1135
1209
|
// value to prevent the input value from changing in the UI
|
|
1136
1210
|
if (lastValue.match(re)) {
|
|
1137
1211
|
value = lastValue;
|
|
1138
1212
|
}
|
|
1139
1213
|
}
|
|
1140
|
-
return /*#__PURE__*/React__default["default"].createElement(StringField, {
|
|
1141
|
-
...props,
|
|
1214
|
+
return /*#__PURE__*/React__default["default"].createElement(StringField, _extends({}, props, {
|
|
1142
1215
|
formData: value,
|
|
1143
1216
|
onChange: handleChange
|
|
1144
|
-
});
|
|
1217
|
+
}));
|
|
1145
1218
|
}
|
|
1146
1219
|
|
|
1147
1220
|
/** The `ObjectField` component is used to render a field in the schema that is of type `object`. It tracks whether an
|
|
@@ -1149,25 +1222,28 @@ function NumberField(props) {
|
|
|
1149
1222
|
*
|
|
1150
1223
|
* @param props - The `FieldProps` for this template
|
|
1151
1224
|
*/
|
|
1152
|
-
|
|
1153
|
-
|
|
1225
|
+
var ObjectField = /*#__PURE__*/function (_Component) {
|
|
1226
|
+
_inheritsLoose(ObjectField, _Component);
|
|
1227
|
+
function ObjectField() {
|
|
1154
1228
|
var _this;
|
|
1155
|
-
|
|
1156
|
-
|
|
1157
|
-
|
|
1229
|
+
for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
|
|
1230
|
+
args[_key] = arguments[_key];
|
|
1231
|
+
}
|
|
1232
|
+
_this = _Component.call.apply(_Component, [this].concat(args)) || this;
|
|
1233
|
+
_this.state = {
|
|
1158
1234
|
wasPropertyKeyModified: false,
|
|
1159
1235
|
additionalProperties: {}
|
|
1160
1236
|
};
|
|
1161
|
-
|
|
1237
|
+
_this.onPropertyChange = function (name, addedByAdditionalProperties) {
|
|
1162
1238
|
if (addedByAdditionalProperties === void 0) {
|
|
1163
1239
|
addedByAdditionalProperties = false;
|
|
1164
1240
|
}
|
|
1165
|
-
return (value, newErrorSchema, id)
|
|
1166
|
-
|
|
1167
|
-
|
|
1168
|
-
|
|
1169
|
-
|
|
1170
|
-
|
|
1241
|
+
return function (value, newErrorSchema, id) {
|
|
1242
|
+
var _extends2, _extends3;
|
|
1243
|
+
var _this$props = _this.props,
|
|
1244
|
+
formData = _this$props.formData,
|
|
1245
|
+
onChange = _this$props.onChange,
|
|
1246
|
+
errorSchema = _this$props.errorSchema;
|
|
1171
1247
|
if (value === undefined && addedByAdditionalProperties) {
|
|
1172
1248
|
// Don't set value = undefined for fields added by
|
|
1173
1249
|
// additionalProperties. Doing so removes them from the
|
|
@@ -1178,117 +1254,95 @@ class ObjectField extends React.Component {
|
|
|
1178
1254
|
// set empty values to the empty string.
|
|
1179
1255
|
value = "";
|
|
1180
1256
|
}
|
|
1181
|
-
|
|
1182
|
-
|
|
1183
|
-
[name]: value
|
|
1184
|
-
};
|
|
1185
|
-
onChange(newFormData, errorSchema && errorSchema && {
|
|
1186
|
-
...errorSchema,
|
|
1187
|
-
[name]: newErrorSchema
|
|
1188
|
-
}, id);
|
|
1257
|
+
var newFormData = _extends({}, formData, (_extends2 = {}, _extends2[name] = value, _extends2));
|
|
1258
|
+
onChange(newFormData, errorSchema && errorSchema && _extends({}, errorSchema, (_extends3 = {}, _extends3[name] = newErrorSchema, _extends3)), id);
|
|
1189
1259
|
};
|
|
1190
1260
|
};
|
|
1191
|
-
|
|
1192
|
-
return event
|
|
1261
|
+
_this.onDropPropertyClick = function (key) {
|
|
1262
|
+
return function (event) {
|
|
1193
1263
|
event.preventDefault();
|
|
1194
|
-
|
|
1195
|
-
onChange,
|
|
1196
|
-
formData
|
|
1197
|
-
|
|
1198
|
-
const copiedFormData = {
|
|
1199
|
-
...formData
|
|
1200
|
-
};
|
|
1264
|
+
var _this$props2 = _this.props,
|
|
1265
|
+
onChange = _this$props2.onChange,
|
|
1266
|
+
formData = _this$props2.formData;
|
|
1267
|
+
var copiedFormData = _extends({}, formData);
|
|
1201
1268
|
unset__default["default"](copiedFormData, key);
|
|
1202
1269
|
onChange(copiedFormData);
|
|
1203
1270
|
};
|
|
1204
1271
|
};
|
|
1205
|
-
|
|
1206
|
-
|
|
1207
|
-
|
|
1208
|
-
|
|
1209
|
-
|
|
1210
|
-
|
|
1211
|
-
|
|
1212
|
-
let index = 0;
|
|
1213
|
-
let newKey = preferredKey;
|
|
1272
|
+
_this.getAvailableKey = function (preferredKey, formData) {
|
|
1273
|
+
var uiSchema = _this.props.uiSchema;
|
|
1274
|
+
var _getUiOptions = utils.getUiOptions(uiSchema),
|
|
1275
|
+
_getUiOptions$duplica = _getUiOptions.duplicateKeySuffixSeparator,
|
|
1276
|
+
duplicateKeySuffixSeparator = _getUiOptions$duplica === void 0 ? "-" : _getUiOptions$duplica;
|
|
1277
|
+
var index = 0;
|
|
1278
|
+
var newKey = preferredKey;
|
|
1214
1279
|
while (newKey in formData) {
|
|
1215
|
-
newKey =
|
|
1280
|
+
newKey = "" + preferredKey + duplicateKeySuffixSeparator + ++index;
|
|
1216
1281
|
}
|
|
1217
1282
|
return newKey;
|
|
1218
1283
|
};
|
|
1219
|
-
|
|
1220
|
-
return (value, newErrorSchema)
|
|
1284
|
+
_this.onKeyChange = function (oldValue) {
|
|
1285
|
+
return function (value, newErrorSchema) {
|
|
1286
|
+
var _newKeys, _extends4;
|
|
1221
1287
|
if (oldValue === value) {
|
|
1222
1288
|
return;
|
|
1223
1289
|
}
|
|
1224
|
-
|
|
1225
|
-
formData,
|
|
1226
|
-
onChange,
|
|
1227
|
-
errorSchema
|
|
1228
|
-
|
|
1229
|
-
|
|
1230
|
-
|
|
1231
|
-
|
|
1232
|
-
|
|
1233
|
-
|
|
1234
|
-
[
|
|
1235
|
-
};
|
|
1236
|
-
const keyValues = Object.keys(newFormData).map(key => {
|
|
1237
|
-
const newKey = newKeys[key] || key;
|
|
1238
|
-
return {
|
|
1239
|
-
[newKey]: newFormData[key]
|
|
1240
|
-
};
|
|
1290
|
+
var _this$props3 = _this.props,
|
|
1291
|
+
formData = _this$props3.formData,
|
|
1292
|
+
onChange = _this$props3.onChange,
|
|
1293
|
+
errorSchema = _this$props3.errorSchema;
|
|
1294
|
+
value = _this.getAvailableKey(value, formData);
|
|
1295
|
+
var newFormData = _extends({}, formData);
|
|
1296
|
+
var newKeys = (_newKeys = {}, _newKeys[oldValue] = value, _newKeys);
|
|
1297
|
+
var keyValues = Object.keys(newFormData).map(function (key) {
|
|
1298
|
+
var _ref;
|
|
1299
|
+
var newKey = newKeys[key] || key;
|
|
1300
|
+
return _ref = {}, _ref[newKey] = newFormData[key], _ref;
|
|
1241
1301
|
});
|
|
1242
|
-
|
|
1243
|
-
|
|
1302
|
+
var renamedObj = Object.assign.apply(Object, [{}].concat(keyValues));
|
|
1303
|
+
_this.setState({
|
|
1244
1304
|
wasPropertyKeyModified: true
|
|
1245
1305
|
});
|
|
1246
|
-
onChange(renamedObj, errorSchema && errorSchema && {
|
|
1247
|
-
...errorSchema,
|
|
1248
|
-
[value]: newErrorSchema
|
|
1249
|
-
});
|
|
1306
|
+
onChange(renamedObj, errorSchema && errorSchema && _extends({}, errorSchema, (_extends4 = {}, _extends4[value] = newErrorSchema, _extends4)));
|
|
1250
1307
|
};
|
|
1251
1308
|
};
|
|
1252
|
-
|
|
1253
|
-
|
|
1254
|
-
|
|
1255
|
-
|
|
1256
|
-
const {
|
|
1257
|
-
formData,
|
|
1258
|
-
onChange,
|
|
1259
|
-
registry
|
|
1260
|
-
} = this.props;
|
|
1261
|
-
const newFormData = {
|
|
1262
|
-
...formData
|
|
1263
|
-
};
|
|
1264
|
-
let type = undefined;
|
|
1265
|
-
if (isObject__default["default"](schema.additionalProperties)) {
|
|
1266
|
-
type = schema.additionalProperties.type;
|
|
1267
|
-
if (utils.REF_KEY in schema.additionalProperties) {
|
|
1268
|
-
const {
|
|
1269
|
-
schemaUtils
|
|
1270
|
-
} = registry;
|
|
1271
|
-
const refSchema = schemaUtils.retrieveSchema({
|
|
1272
|
-
$ref: schema.additionalProperties[utils.REF_KEY]
|
|
1273
|
-
}, formData);
|
|
1274
|
-
type = refSchema.type;
|
|
1309
|
+
_this.handleAddClick = function (schema) {
|
|
1310
|
+
return function () {
|
|
1311
|
+
if (!schema.additionalProperties) {
|
|
1312
|
+
return;
|
|
1275
1313
|
}
|
|
1276
|
-
|
|
1277
|
-
|
|
1278
|
-
|
|
1279
|
-
|
|
1280
|
-
|
|
1314
|
+
var _this$props4 = _this.props,
|
|
1315
|
+
formData = _this$props4.formData,
|
|
1316
|
+
onChange = _this$props4.onChange,
|
|
1317
|
+
registry = _this$props4.registry;
|
|
1318
|
+
var newFormData = _extends({}, formData);
|
|
1319
|
+
var type = undefined;
|
|
1320
|
+
if (isObject__default["default"](schema.additionalProperties)) {
|
|
1321
|
+
type = schema.additionalProperties.type;
|
|
1322
|
+
if (utils.REF_KEY in schema.additionalProperties) {
|
|
1323
|
+
var schemaUtils = registry.schemaUtils;
|
|
1324
|
+
var refSchema = schemaUtils.retrieveSchema({
|
|
1325
|
+
$ref: schema.additionalProperties[utils.REF_KEY]
|
|
1326
|
+
}, formData);
|
|
1327
|
+
type = refSchema.type;
|
|
1328
|
+
}
|
|
1329
|
+
}
|
|
1330
|
+
var newKey = _this.getAvailableKey("newKey", newFormData);
|
|
1331
|
+
// Cast this to make the `set` work properly
|
|
1332
|
+
set__default["default"](newFormData, newKey, _this.getDefaultValue(type));
|
|
1333
|
+
onChange(newFormData);
|
|
1334
|
+
};
|
|
1281
1335
|
};
|
|
1336
|
+
return _this;
|
|
1282
1337
|
}
|
|
1338
|
+
var _proto = ObjectField.prototype;
|
|
1283
1339
|
/** Returns a flag indicating whether the `name` field is required in the object schema
|
|
1284
1340
|
*
|
|
1285
1341
|
* @param name - The name of the field to check for required-ness
|
|
1286
1342
|
* @returns - True if the field `name` is required, false otherwise
|
|
1287
1343
|
*/
|
|
1288
|
-
isRequired(name) {
|
|
1289
|
-
|
|
1290
|
-
schema
|
|
1291
|
-
} = this.props;
|
|
1344
|
+
_proto.isRequired = function isRequired(name) {
|
|
1345
|
+
var schema = this.props.schema;
|
|
1292
1346
|
return Array.isArray(schema.required) && schema.required.indexOf(name) !== -1;
|
|
1293
1347
|
}
|
|
1294
1348
|
/** Returns the `onPropertyChange` handler for the `name` field. Handles the special case where a user is attempting
|
|
@@ -1298,13 +1352,12 @@ class ObjectField extends React.Component {
|
|
|
1298
1352
|
* @param name - The name of the property
|
|
1299
1353
|
* @param addedByAdditionalProperties - Flag indicating whether this property is an additional property
|
|
1300
1354
|
* @returns - The onPropertyChange callback for the `name` property
|
|
1301
|
-
|
|
1302
|
-
|
|
1355
|
+
*/;
|
|
1303
1356
|
/** Returns a default value to be used for a new additional schema property of the given `type`
|
|
1304
1357
|
*
|
|
1305
1358
|
* @param type - The type of the new additional schema property
|
|
1306
1359
|
*/
|
|
1307
|
-
getDefaultValue(type) {
|
|
1360
|
+
_proto.getDefaultValue = function getDefaultValue(type) {
|
|
1308
1361
|
switch (type) {
|
|
1309
1362
|
case "string":
|
|
1310
1363
|
return "New Value";
|
|
@@ -1327,46 +1380,44 @@ class ObjectField extends React.Component {
|
|
|
1327
1380
|
* default data for that field has been added to the formData.
|
|
1328
1381
|
*
|
|
1329
1382
|
* @param schema - The schema element to which the new property is being added
|
|
1330
|
-
|
|
1331
|
-
|
|
1383
|
+
*/;
|
|
1332
1384
|
/** Renders the `ObjectField` from the given props
|
|
1333
1385
|
*/
|
|
1334
|
-
render() {
|
|
1335
|
-
|
|
1336
|
-
|
|
1337
|
-
|
|
1338
|
-
|
|
1339
|
-
|
|
1340
|
-
|
|
1341
|
-
|
|
1342
|
-
|
|
1343
|
-
|
|
1344
|
-
|
|
1345
|
-
|
|
1346
|
-
|
|
1347
|
-
|
|
1348
|
-
|
|
1349
|
-
|
|
1350
|
-
|
|
1351
|
-
|
|
1352
|
-
|
|
1353
|
-
|
|
1354
|
-
|
|
1355
|
-
|
|
1356
|
-
|
|
1357
|
-
|
|
1358
|
-
|
|
1359
|
-
|
|
1360
|
-
|
|
1361
|
-
|
|
1362
|
-
|
|
1363
|
-
|
|
1364
|
-
|
|
1365
|
-
|
|
1366
|
-
|
|
1367
|
-
let orderedProperties;
|
|
1386
|
+
_proto.render = function render() {
|
|
1387
|
+
var _this2 = this;
|
|
1388
|
+
var _this$props5 = this.props,
|
|
1389
|
+
rawSchema = _this$props5.schema,
|
|
1390
|
+
_this$props5$uiSchema = _this$props5.uiSchema,
|
|
1391
|
+
uiSchema = _this$props5$uiSchema === void 0 ? {} : _this$props5$uiSchema,
|
|
1392
|
+
formData = _this$props5.formData,
|
|
1393
|
+
errorSchema = _this$props5.errorSchema,
|
|
1394
|
+
idSchema = _this$props5.idSchema,
|
|
1395
|
+
name = _this$props5.name,
|
|
1396
|
+
_this$props5$required = _this$props5.required,
|
|
1397
|
+
required = _this$props5$required === void 0 ? false : _this$props5$required,
|
|
1398
|
+
_this$props5$disabled = _this$props5.disabled,
|
|
1399
|
+
disabled = _this$props5$disabled === void 0 ? false : _this$props5$disabled,
|
|
1400
|
+
_this$props5$readonly = _this$props5.readonly,
|
|
1401
|
+
readonly = _this$props5$readonly === void 0 ? false : _this$props5$readonly,
|
|
1402
|
+
hideError = _this$props5.hideError,
|
|
1403
|
+
idPrefix = _this$props5.idPrefix,
|
|
1404
|
+
idSeparator = _this$props5.idSeparator,
|
|
1405
|
+
onBlur = _this$props5.onBlur,
|
|
1406
|
+
onFocus = _this$props5.onFocus,
|
|
1407
|
+
registry = _this$props5.registry;
|
|
1408
|
+
var fields = registry.fields,
|
|
1409
|
+
formContext = registry.formContext,
|
|
1410
|
+
schemaUtils = registry.schemaUtils;
|
|
1411
|
+
var SchemaField = fields.SchemaField;
|
|
1412
|
+
var schema = schemaUtils.retrieveSchema(rawSchema, formData);
|
|
1413
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
1414
|
+
var _schema$properties = schema.properties,
|
|
1415
|
+
schemaProperties = _schema$properties === void 0 ? {} : _schema$properties;
|
|
1416
|
+
var title = schema.title === undefined ? name : schema.title;
|
|
1417
|
+
var description = uiOptions.description || schema.description;
|
|
1418
|
+
var orderedProperties;
|
|
1368
1419
|
try {
|
|
1369
|
-
|
|
1420
|
+
var properties = Object.keys(schemaProperties);
|
|
1370
1421
|
orderedProperties = utils.orderProperties(properties, uiOptions.order);
|
|
1371
1422
|
} catch (err) {
|
|
1372
1423
|
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
@@ -1376,20 +1427,20 @@ class ObjectField extends React.Component {
|
|
|
1376
1427
|
}
|
|
1377
1428
|
}, "Invalid ", name || "root", " object field configuration:", /*#__PURE__*/React__default["default"].createElement("em", null, err.message), "."), /*#__PURE__*/React__default["default"].createElement("pre", null, JSON.stringify(schema)));
|
|
1378
1429
|
}
|
|
1379
|
-
|
|
1380
|
-
|
|
1430
|
+
var Template = utils.getTemplate("ObjectFieldTemplate", registry, uiOptions);
|
|
1431
|
+
var templateProps = {
|
|
1381
1432
|
title: uiOptions.title || title,
|
|
1382
|
-
description,
|
|
1383
|
-
properties: orderedProperties.map(name
|
|
1384
|
-
|
|
1385
|
-
|
|
1386
|
-
|
|
1387
|
-
|
|
1433
|
+
description: description,
|
|
1434
|
+
properties: orderedProperties.map(function (name) {
|
|
1435
|
+
var addedByAdditionalProperties = has__default["default"](schema, [utils.PROPERTIES_KEY, name, utils.ADDITIONAL_PROPERTY_FLAG]);
|
|
1436
|
+
var fieldUiSchema = addedByAdditionalProperties ? uiSchema.additionalProperties : uiSchema[name];
|
|
1437
|
+
var hidden = utils.getUiOptions(fieldUiSchema).widget === "hidden";
|
|
1438
|
+
var fieldIdSchema = get__default["default"](idSchema, [name], {});
|
|
1388
1439
|
return {
|
|
1389
1440
|
content: /*#__PURE__*/React__default["default"].createElement(SchemaField, {
|
|
1390
1441
|
key: name,
|
|
1391
1442
|
name: name,
|
|
1392
|
-
required:
|
|
1443
|
+
required: _this2.isRequired(name),
|
|
1393
1444
|
schema: get__default["default"](schema, [utils.PROPERTIES_KEY, name], {}),
|
|
1394
1445
|
uiSchema: fieldUiSchema,
|
|
1395
1446
|
errorSchema: get__default["default"](errorSchema, name),
|
|
@@ -1398,50 +1449,51 @@ class ObjectField extends React.Component {
|
|
|
1398
1449
|
idSeparator: idSeparator,
|
|
1399
1450
|
formData: get__default["default"](formData, name),
|
|
1400
1451
|
formContext: formContext,
|
|
1401
|
-
wasPropertyKeyModified:
|
|
1402
|
-
onKeyChange:
|
|
1403
|
-
onChange:
|
|
1452
|
+
wasPropertyKeyModified: _this2.state.wasPropertyKeyModified,
|
|
1453
|
+
onKeyChange: _this2.onKeyChange(name),
|
|
1454
|
+
onChange: _this2.onPropertyChange(name, addedByAdditionalProperties),
|
|
1404
1455
|
onBlur: onBlur,
|
|
1405
1456
|
onFocus: onFocus,
|
|
1406
1457
|
registry: registry,
|
|
1407
1458
|
disabled: disabled,
|
|
1408
1459
|
readonly: readonly,
|
|
1409
1460
|
hideError: hideError,
|
|
1410
|
-
onDropPropertyClick:
|
|
1461
|
+
onDropPropertyClick: _this2.onDropPropertyClick
|
|
1411
1462
|
}),
|
|
1412
|
-
name,
|
|
1413
|
-
readonly,
|
|
1414
|
-
disabled,
|
|
1415
|
-
required,
|
|
1416
|
-
hidden
|
|
1463
|
+
name: name,
|
|
1464
|
+
readonly: readonly,
|
|
1465
|
+
disabled: disabled,
|
|
1466
|
+
required: required,
|
|
1467
|
+
hidden: hidden
|
|
1417
1468
|
};
|
|
1418
1469
|
}),
|
|
1419
|
-
readonly,
|
|
1420
|
-
disabled,
|
|
1421
|
-
required,
|
|
1422
|
-
idSchema,
|
|
1423
|
-
uiSchema,
|
|
1424
|
-
schema,
|
|
1425
|
-
formData,
|
|
1426
|
-
formContext,
|
|
1427
|
-
registry
|
|
1470
|
+
readonly: readonly,
|
|
1471
|
+
disabled: disabled,
|
|
1472
|
+
required: required,
|
|
1473
|
+
idSchema: idSchema,
|
|
1474
|
+
uiSchema: uiSchema,
|
|
1475
|
+
schema: schema,
|
|
1476
|
+
formData: formData,
|
|
1477
|
+
formContext: formContext,
|
|
1478
|
+
registry: registry
|
|
1428
1479
|
};
|
|
1429
|
-
return /*#__PURE__*/React__default["default"].createElement(Template, {
|
|
1430
|
-
...templateProps,
|
|
1480
|
+
return /*#__PURE__*/React__default["default"].createElement(Template, _extends({}, templateProps, {
|
|
1431
1481
|
onAddClick: this.handleAddClick
|
|
1432
|
-
});
|
|
1433
|
-
}
|
|
1434
|
-
|
|
1482
|
+
}));
|
|
1483
|
+
};
|
|
1484
|
+
return ObjectField;
|
|
1485
|
+
}(React.Component);
|
|
1435
1486
|
|
|
1487
|
+
var _excluded$6 = ["__errors"];
|
|
1436
1488
|
/** The map of component type to FieldName */
|
|
1437
|
-
|
|
1489
|
+
var COMPONENT_TYPES = {
|
|
1438
1490
|
array: "ArrayField",
|
|
1439
|
-
boolean: "BooleanField",
|
|
1491
|
+
"boolean": "BooleanField",
|
|
1440
1492
|
integer: "NumberField",
|
|
1441
1493
|
number: "NumberField",
|
|
1442
1494
|
object: "ObjectField",
|
|
1443
1495
|
string: "StringField",
|
|
1444
|
-
null: "NullField"
|
|
1496
|
+
"null": "NullField"
|
|
1445
1497
|
};
|
|
1446
1498
|
/** Computes and returns which `Field` implementation to return in order to render the field represented by the
|
|
1447
1499
|
* `schema`. The `uiOptions` are used to alter what potential `Field` implementation is actually returned. If no
|
|
@@ -1454,30 +1506,30 @@ const COMPONENT_TYPES = {
|
|
|
1454
1506
|
* @returns - The `Field` component that is used to render the actual field data
|
|
1455
1507
|
*/
|
|
1456
1508
|
function getFieldComponent(schema, uiOptions, idSchema, registry) {
|
|
1457
|
-
|
|
1458
|
-
|
|
1459
|
-
fields
|
|
1460
|
-
} = registry;
|
|
1509
|
+
var field = uiOptions.field;
|
|
1510
|
+
var fields = registry.fields;
|
|
1461
1511
|
if (typeof field === "function") {
|
|
1462
1512
|
return field;
|
|
1463
1513
|
}
|
|
1464
1514
|
if (typeof field === "string" && field in fields) {
|
|
1465
1515
|
return fields[field];
|
|
1466
1516
|
}
|
|
1467
|
-
|
|
1468
|
-
|
|
1469
|
-
|
|
1517
|
+
var schemaType = utils.getSchemaType(schema);
|
|
1518
|
+
var type = Array.isArray(schemaType) ? schemaType[0] : schemaType || "";
|
|
1519
|
+
var componentName = COMPONENT_TYPES[type];
|
|
1470
1520
|
// If the type is not defined and the schema uses 'anyOf' or 'oneOf', don't
|
|
1471
1521
|
// render a field and let the MultiSchemaField component handle the form display
|
|
1472
1522
|
if (!componentName && (schema.anyOf || schema.oneOf)) {
|
|
1473
|
-
return ()
|
|
1523
|
+
return function () {
|
|
1524
|
+
return null;
|
|
1525
|
+
};
|
|
1474
1526
|
}
|
|
1475
|
-
return componentName in fields ? fields[componentName] : ()
|
|
1476
|
-
|
|
1527
|
+
return componentName in fields ? fields[componentName] : function () {
|
|
1528
|
+
var UnsupportedFieldTemplate = utils.getTemplate("UnsupportedFieldTemplate", registry, uiOptions);
|
|
1477
1529
|
return /*#__PURE__*/React__default["default"].createElement(UnsupportedFieldTemplate, {
|
|
1478
1530
|
schema: schema,
|
|
1479
1531
|
idSchema: idSchema,
|
|
1480
|
-
reason:
|
|
1532
|
+
reason: "Unknown field type " + schema.type,
|
|
1481
1533
|
registry: registry
|
|
1482
1534
|
});
|
|
1483
1535
|
};
|
|
@@ -1489,63 +1541,58 @@ function getFieldComponent(schema, uiOptions, idSchema, registry) {
|
|
|
1489
1541
|
* @param props - The `FieldProps` for this component
|
|
1490
1542
|
*/
|
|
1491
1543
|
function SchemaFieldRender(props) {
|
|
1492
|
-
|
|
1493
|
-
|
|
1494
|
-
|
|
1495
|
-
|
|
1496
|
-
|
|
1497
|
-
|
|
1498
|
-
|
|
1499
|
-
|
|
1500
|
-
|
|
1501
|
-
|
|
1502
|
-
|
|
1503
|
-
|
|
1504
|
-
|
|
1505
|
-
|
|
1506
|
-
wasPropertyKeyModified = false
|
|
1507
|
-
|
|
1508
|
-
|
|
1509
|
-
|
|
1510
|
-
|
|
1511
|
-
|
|
1512
|
-
|
|
1513
|
-
|
|
1514
|
-
|
|
1515
|
-
|
|
1516
|
-
|
|
1517
|
-
const schema = schemaUtils.retrieveSchema(_schema, formData);
|
|
1518
|
-
const fieldId = _idSchema[utils.ID_KEY];
|
|
1519
|
-
const idSchema = utils.mergeObjects(schemaUtils.toIdSchema(schema, fieldId, formData, idPrefix, idSeparator), _idSchema);
|
|
1544
|
+
var _schema = props.schema,
|
|
1545
|
+
_idSchema = props.idSchema,
|
|
1546
|
+
uiSchema = props.uiSchema,
|
|
1547
|
+
formData = props.formData,
|
|
1548
|
+
errorSchema = props.errorSchema,
|
|
1549
|
+
idPrefix = props.idPrefix,
|
|
1550
|
+
idSeparator = props.idSeparator,
|
|
1551
|
+
name = props.name,
|
|
1552
|
+
onChange = props.onChange,
|
|
1553
|
+
onKeyChange = props.onKeyChange,
|
|
1554
|
+
onDropPropertyClick = props.onDropPropertyClick,
|
|
1555
|
+
required = props.required,
|
|
1556
|
+
registry = props.registry,
|
|
1557
|
+
_props$wasPropertyKey = props.wasPropertyKeyModified,
|
|
1558
|
+
wasPropertyKeyModified = _props$wasPropertyKey === void 0 ? false : _props$wasPropertyKey;
|
|
1559
|
+
var formContext = registry.formContext,
|
|
1560
|
+
schemaUtils = registry.schemaUtils;
|
|
1561
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
1562
|
+
var FieldTemplate = utils.getTemplate("FieldTemplate", registry, uiOptions);
|
|
1563
|
+
var DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, uiOptions);
|
|
1564
|
+
var FieldHelpTemplate = utils.getTemplate("FieldHelpTemplate", registry, uiOptions);
|
|
1565
|
+
var FieldErrorTemplate = utils.getTemplate("FieldErrorTemplate", registry, uiOptions);
|
|
1566
|
+
var schema = schemaUtils.retrieveSchema(_schema, formData);
|
|
1567
|
+
var fieldId = _idSchema[utils.ID_KEY];
|
|
1568
|
+
var idSchema = utils.mergeObjects(schemaUtils.toIdSchema(schema, fieldId, formData, idPrefix, idSeparator), _idSchema);
|
|
1520
1569
|
/** Intermediary `onChange` handler for field components that will inject the `id` of the current field into the
|
|
1521
1570
|
* `onChange` chain if it is not already being provided from a deeper level in the hierarchy
|
|
1522
1571
|
*/
|
|
1523
|
-
|
|
1524
|
-
|
|
1572
|
+
var handleFieldComponentChange = React__default["default"].useCallback(function (formData, newErrorSchema, id) {
|
|
1573
|
+
var theId = id || fieldId;
|
|
1525
1574
|
return onChange(formData, newErrorSchema, theId);
|
|
1526
1575
|
}, [fieldId, onChange]);
|
|
1527
|
-
|
|
1528
|
-
|
|
1529
|
-
|
|
1530
|
-
|
|
1576
|
+
var FieldComponent = getFieldComponent(schema, uiOptions, idSchema, registry);
|
|
1577
|
+
var disabled = Boolean(props.disabled || uiOptions.disabled);
|
|
1578
|
+
var readonly = Boolean(props.readonly || uiOptions.readonly || props.schema.readOnly || schema.readOnly);
|
|
1579
|
+
var uiSchemaHideError = uiOptions.hideError;
|
|
1531
1580
|
// Set hideError to the value provided in the uiSchema, otherwise stick with the prop to propagate to children
|
|
1532
|
-
|
|
1533
|
-
|
|
1581
|
+
var hideError = uiSchemaHideError === undefined ? props.hideError : Boolean(uiSchemaHideError);
|
|
1582
|
+
var autofocus = Boolean(props.autofocus || uiOptions.autofocus);
|
|
1534
1583
|
if (Object.keys(schema).length === 0) {
|
|
1535
1584
|
return null;
|
|
1536
1585
|
}
|
|
1537
|
-
|
|
1538
|
-
|
|
1539
|
-
__errors,
|
|
1540
|
-
|
|
1541
|
-
} = errorSchema || {};
|
|
1586
|
+
var displayLabel = schemaUtils.getDisplayLabel(schema, uiSchema);
|
|
1587
|
+
var _ref = errorSchema || {},
|
|
1588
|
+
__errors = _ref.__errors,
|
|
1589
|
+
fieldErrorSchema = _objectWithoutPropertiesLoose(_ref, _excluded$6);
|
|
1542
1590
|
// See #439: uiSchema: Don't pass consumed class names to child components
|
|
1543
|
-
|
|
1591
|
+
var fieldUiSchema = omit__default["default"](uiSchema, ["ui:classNames", "classNames"]);
|
|
1544
1592
|
if ("ui:options" in fieldUiSchema) {
|
|
1545
1593
|
fieldUiSchema["ui:options"] = omit__default["default"](fieldUiSchema["ui:options"], ["classNames"]);
|
|
1546
1594
|
}
|
|
1547
|
-
|
|
1548
|
-
...props,
|
|
1595
|
+
var field = /*#__PURE__*/React__default["default"].createElement(FieldComponent, _extends({}, props, {
|
|
1549
1596
|
onChange: handleFieldComponentChange,
|
|
1550
1597
|
idSchema: idSchema,
|
|
1551
1598
|
schema: schema,
|
|
@@ -1557,19 +1604,19 @@ function SchemaFieldRender(props) {
|
|
|
1557
1604
|
errorSchema: fieldErrorSchema,
|
|
1558
1605
|
formContext: formContext,
|
|
1559
1606
|
rawErrors: __errors
|
|
1560
|
-
});
|
|
1561
|
-
|
|
1607
|
+
}));
|
|
1608
|
+
var id = idSchema[utils.ID_KEY];
|
|
1562
1609
|
// If this schema has a title defined, but the user has set a new key/label, retain their input.
|
|
1563
|
-
|
|
1610
|
+
var label;
|
|
1564
1611
|
if (wasPropertyKeyModified) {
|
|
1565
1612
|
label = name;
|
|
1566
1613
|
} else {
|
|
1567
1614
|
label = utils.ADDITIONAL_PROPERTY_FLAG in schema ? name : uiOptions.title || props.schema.title || schema.title || name;
|
|
1568
1615
|
}
|
|
1569
|
-
|
|
1570
|
-
|
|
1571
|
-
|
|
1572
|
-
|
|
1616
|
+
var description = uiOptions.description || props.schema.description || schema.description || "";
|
|
1617
|
+
var help = uiOptions.help;
|
|
1618
|
+
var hidden = uiOptions.widget === "hidden";
|
|
1619
|
+
var classNames = ["form-group", "field", "field-" + schema.type];
|
|
1573
1620
|
if (!hideError && __errors && __errors.length > 0) {
|
|
1574
1621
|
classNames.push("field-error has-error has-danger");
|
|
1575
1622
|
}
|
|
@@ -1582,7 +1629,7 @@ function SchemaFieldRender(props) {
|
|
|
1582
1629
|
if (uiOptions.classNames) {
|
|
1583
1630
|
classNames.push(uiOptions.classNames);
|
|
1584
1631
|
}
|
|
1585
|
-
|
|
1632
|
+
var helpComponent = /*#__PURE__*/React__default["default"].createElement(FieldHelpTemplate, {
|
|
1586
1633
|
help: help,
|
|
1587
1634
|
idSchema: idSchema,
|
|
1588
1635
|
schema: schema,
|
|
@@ -1590,7 +1637,7 @@ function SchemaFieldRender(props) {
|
|
|
1590
1637
|
hasErrors: !hideError && __errors && __errors.length > 0,
|
|
1591
1638
|
registry: registry
|
|
1592
1639
|
});
|
|
1593
|
-
|
|
1640
|
+
var errorsComponent = hideError ? undefined : /*#__PURE__*/React__default["default"].createElement(FieldErrorTemplate, {
|
|
1594
1641
|
errors: __errors,
|
|
1595
1642
|
errorSchema: errorSchema,
|
|
1596
1643
|
idSchema: idSchema,
|
|
@@ -1598,9 +1645,9 @@ function SchemaFieldRender(props) {
|
|
|
1598
1645
|
uiSchema: uiSchema,
|
|
1599
1646
|
registry: registry
|
|
1600
1647
|
});
|
|
1601
|
-
|
|
1648
|
+
var fieldProps = {
|
|
1602
1649
|
description: /*#__PURE__*/React__default["default"].createElement(DescriptionFieldTemplate, {
|
|
1603
|
-
id:
|
|
1650
|
+
id: id + "__description",
|
|
1604
1651
|
description: description,
|
|
1605
1652
|
schema: schema,
|
|
1606
1653
|
uiSchema: uiSchema,
|
|
@@ -1611,29 +1658,27 @@ function SchemaFieldRender(props) {
|
|
|
1611
1658
|
rawHelp: typeof help === "string" ? help : undefined,
|
|
1612
1659
|
errors: errorsComponent,
|
|
1613
1660
|
rawErrors: hideError ? undefined : __errors,
|
|
1614
|
-
id,
|
|
1615
|
-
label,
|
|
1616
|
-
hidden,
|
|
1617
|
-
onChange,
|
|
1618
|
-
onKeyChange,
|
|
1619
|
-
onDropPropertyClick,
|
|
1620
|
-
required,
|
|
1621
|
-
disabled,
|
|
1622
|
-
readonly,
|
|
1623
|
-
hideError,
|
|
1624
|
-
displayLabel,
|
|
1661
|
+
id: id,
|
|
1662
|
+
label: label,
|
|
1663
|
+
hidden: hidden,
|
|
1664
|
+
onChange: onChange,
|
|
1665
|
+
onKeyChange: onKeyChange,
|
|
1666
|
+
onDropPropertyClick: onDropPropertyClick,
|
|
1667
|
+
required: required,
|
|
1668
|
+
disabled: disabled,
|
|
1669
|
+
readonly: readonly,
|
|
1670
|
+
hideError: hideError,
|
|
1671
|
+
displayLabel: displayLabel,
|
|
1625
1672
|
classNames: classNames.join(" ").trim(),
|
|
1626
|
-
formContext,
|
|
1627
|
-
formData,
|
|
1628
|
-
schema,
|
|
1629
|
-
uiSchema,
|
|
1630
|
-
registry
|
|
1673
|
+
formContext: formContext,
|
|
1674
|
+
formData: formData,
|
|
1675
|
+
schema: schema,
|
|
1676
|
+
uiSchema: uiSchema,
|
|
1677
|
+
registry: registry
|
|
1631
1678
|
};
|
|
1632
|
-
|
|
1633
|
-
|
|
1634
|
-
return /*#__PURE__*/React__default["default"].createElement(FieldTemplate, {
|
|
1635
|
-
...fieldProps
|
|
1636
|
-
}, /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, field, schema.anyOf && !(uiSchema !== null && uiSchema !== void 0 && uiSchema["ui:field"]) && !schemaUtils.isSelect(schema) && /*#__PURE__*/React__default["default"].createElement(_AnyOfField, {
|
|
1679
|
+
var _AnyOfField = registry.fields.AnyOfField;
|
|
1680
|
+
var _OneOfField = registry.fields.OneOfField;
|
|
1681
|
+
return /*#__PURE__*/React__default["default"].createElement(FieldTemplate, _extends({}, fieldProps), /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, field, schema.anyOf && !(uiSchema !== null && uiSchema !== void 0 && uiSchema["ui:field"]) && !schemaUtils.isSelect(schema) && /*#__PURE__*/React__default["default"].createElement(_AnyOfField, {
|
|
1637
1682
|
name: name,
|
|
1638
1683
|
disabled: disabled,
|
|
1639
1684
|
readonly: readonly,
|
|
@@ -1647,7 +1692,9 @@ function SchemaFieldRender(props) {
|
|
|
1647
1692
|
onBlur: props.onBlur,
|
|
1648
1693
|
onChange: props.onChange,
|
|
1649
1694
|
onFocus: props.onFocus,
|
|
1650
|
-
options: schema.anyOf.map(
|
|
1695
|
+
options: schema.anyOf.map(function (_schema) {
|
|
1696
|
+
return schemaUtils.retrieveSchema(isObject__default["default"](_schema) ? _schema : {}, formData);
|
|
1697
|
+
}),
|
|
1651
1698
|
baseType: schema.type,
|
|
1652
1699
|
registry: registry,
|
|
1653
1700
|
schema: schema,
|
|
@@ -1666,7 +1713,9 @@ function SchemaFieldRender(props) {
|
|
|
1666
1713
|
onBlur: props.onBlur,
|
|
1667
1714
|
onChange: props.onChange,
|
|
1668
1715
|
onFocus: props.onFocus,
|
|
1669
|
-
options: schema.oneOf.map(
|
|
1716
|
+
options: schema.oneOf.map(function (_schema) {
|
|
1717
|
+
return schemaUtils.retrieveSchema(isObject__default["default"](_schema) ? _schema : {}, formData);
|
|
1718
|
+
}),
|
|
1670
1719
|
baseType: schema.type,
|
|
1671
1720
|
registry: registry,
|
|
1672
1721
|
schema: schema,
|
|
@@ -1676,63 +1725,65 @@ function SchemaFieldRender(props) {
|
|
|
1676
1725
|
/** The `SchemaField` component determines whether it is necessary to rerender the component based on any props changes
|
|
1677
1726
|
* and if so, calls the `SchemaFieldRender` component with the props.
|
|
1678
1727
|
*/
|
|
1679
|
-
|
|
1680
|
-
|
|
1681
|
-
|
|
1682
|
-
|
|
1683
|
-
render() {
|
|
1684
|
-
return /*#__PURE__*/React__default["default"].createElement(SchemaFieldRender, {
|
|
1685
|
-
...this.props
|
|
1686
|
-
});
|
|
1728
|
+
var SchemaField = /*#__PURE__*/function (_React$Component) {
|
|
1729
|
+
_inheritsLoose(SchemaField, _React$Component);
|
|
1730
|
+
function SchemaField() {
|
|
1731
|
+
return _React$Component.apply(this, arguments) || this;
|
|
1687
1732
|
}
|
|
1688
|
-
|
|
1733
|
+
var _proto = SchemaField.prototype;
|
|
1734
|
+
_proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
|
|
1735
|
+
return !utils.deepEquals(this.props, nextProps);
|
|
1736
|
+
};
|
|
1737
|
+
_proto.render = function render() {
|
|
1738
|
+
return /*#__PURE__*/React__default["default"].createElement(SchemaFieldRender, _extends({}, this.props));
|
|
1739
|
+
};
|
|
1740
|
+
return SchemaField;
|
|
1741
|
+
}(React__default["default"].Component);
|
|
1689
1742
|
|
|
1743
|
+
var _excluded$5 = ["widget", "placeholder"];
|
|
1690
1744
|
/** The `StringField` component is used to render a schema field that represents a string type
|
|
1691
1745
|
*
|
|
1692
1746
|
* @param props - The `FieldProps` for this template
|
|
1693
1747
|
*/
|
|
1694
1748
|
function StringField(props) {
|
|
1695
|
-
|
|
1696
|
-
|
|
1697
|
-
|
|
1698
|
-
|
|
1699
|
-
|
|
1700
|
-
|
|
1701
|
-
|
|
1702
|
-
disabled = false,
|
|
1703
|
-
readonly =
|
|
1704
|
-
|
|
1705
|
-
|
|
1706
|
-
|
|
1707
|
-
|
|
1708
|
-
|
|
1709
|
-
|
|
1710
|
-
|
|
1711
|
-
|
|
1712
|
-
|
|
1713
|
-
format
|
|
1714
|
-
|
|
1715
|
-
|
|
1716
|
-
|
|
1717
|
-
|
|
1718
|
-
|
|
1719
|
-
} = registry;
|
|
1720
|
-
const enumOptions = schemaUtils.isSelect(schema) ? utils.optionsList(schema) : undefined;
|
|
1721
|
-
let defaultWidget = enumOptions ? "select" : "text";
|
|
1749
|
+
var schema = props.schema,
|
|
1750
|
+
name = props.name,
|
|
1751
|
+
uiSchema = props.uiSchema,
|
|
1752
|
+
idSchema = props.idSchema,
|
|
1753
|
+
formData = props.formData,
|
|
1754
|
+
required = props.required,
|
|
1755
|
+
_props$disabled = props.disabled,
|
|
1756
|
+
disabled = _props$disabled === void 0 ? false : _props$disabled,
|
|
1757
|
+
_props$readonly = props.readonly,
|
|
1758
|
+
readonly = _props$readonly === void 0 ? false : _props$readonly,
|
|
1759
|
+
_props$autofocus = props.autofocus,
|
|
1760
|
+
autofocus = _props$autofocus === void 0 ? false : _props$autofocus,
|
|
1761
|
+
onChange = props.onChange,
|
|
1762
|
+
onBlur = props.onBlur,
|
|
1763
|
+
onFocus = props.onFocus,
|
|
1764
|
+
registry = props.registry,
|
|
1765
|
+
rawErrors = props.rawErrors;
|
|
1766
|
+
var title = schema.title,
|
|
1767
|
+
format = schema.format;
|
|
1768
|
+
var widgets = registry.widgets,
|
|
1769
|
+
formContext = registry.formContext,
|
|
1770
|
+
schemaUtils = registry.schemaUtils;
|
|
1771
|
+
var enumOptions = schemaUtils.isSelect(schema) ? utils.optionsList(schema) : undefined;
|
|
1772
|
+
var defaultWidget = enumOptions ? "select" : "text";
|
|
1722
1773
|
if (format && utils.hasWidget(schema, format, widgets)) {
|
|
1723
1774
|
defaultWidget = format;
|
|
1724
1775
|
}
|
|
1725
|
-
|
|
1726
|
-
widget =
|
|
1727
|
-
|
|
1728
|
-
|
|
1729
|
-
|
|
1730
|
-
|
|
1776
|
+
var _getUiOptions = utils.getUiOptions(uiSchema),
|
|
1777
|
+
_getUiOptions$widget = _getUiOptions.widget,
|
|
1778
|
+
widget = _getUiOptions$widget === void 0 ? defaultWidget : _getUiOptions$widget,
|
|
1779
|
+
_getUiOptions$placeho = _getUiOptions.placeholder,
|
|
1780
|
+
placeholder = _getUiOptions$placeho === void 0 ? "" : _getUiOptions$placeho,
|
|
1781
|
+
options = _objectWithoutPropertiesLoose(_getUiOptions, _excluded$5);
|
|
1782
|
+
var Widget = utils.getWidget(schema, widget, widgets);
|
|
1731
1783
|
return /*#__PURE__*/React__default["default"].createElement(Widget, {
|
|
1732
|
-
options: {
|
|
1733
|
-
|
|
1734
|
-
|
|
1735
|
-
},
|
|
1784
|
+
options: _extends({}, options, {
|
|
1785
|
+
enumOptions: enumOptions
|
|
1786
|
+
}),
|
|
1736
1787
|
schema: schema,
|
|
1737
1788
|
uiSchema: uiSchema,
|
|
1738
1789
|
id: idSchema && idSchema.$id,
|
|
@@ -1758,11 +1809,9 @@ function StringField(props) {
|
|
|
1758
1809
|
* @param props - The `FieldProps` for this template
|
|
1759
1810
|
*/
|
|
1760
1811
|
function NullField(props) {
|
|
1761
|
-
|
|
1762
|
-
|
|
1763
|
-
|
|
1764
|
-
} = props;
|
|
1765
|
-
React.useEffect(() => {
|
|
1812
|
+
var formData = props.formData,
|
|
1813
|
+
onChange = props.onChange;
|
|
1814
|
+
React.useEffect(function () {
|
|
1766
1815
|
if (formData === undefined) {
|
|
1767
1816
|
onChange(null);
|
|
1768
1817
|
}
|
|
@@ -1775,13 +1824,13 @@ function fields() {
|
|
|
1775
1824
|
AnyOfField: AnyOfField,
|
|
1776
1825
|
ArrayField: ArrayField,
|
|
1777
1826
|
// ArrayField falls back to SchemaField if ArraySchemaField is not defined, which it isn't by default
|
|
1778
|
-
BooleanField,
|
|
1779
|
-
NumberField,
|
|
1780
|
-
ObjectField,
|
|
1827
|
+
BooleanField: BooleanField,
|
|
1828
|
+
NumberField: NumberField,
|
|
1829
|
+
ObjectField: ObjectField,
|
|
1781
1830
|
OneOfField: AnyOfField,
|
|
1782
|
-
SchemaField,
|
|
1783
|
-
StringField,
|
|
1784
|
-
NullField
|
|
1831
|
+
SchemaField: SchemaField,
|
|
1832
|
+
StringField: StringField,
|
|
1833
|
+
NullField: NullField
|
|
1785
1834
|
};
|
|
1786
1835
|
}
|
|
1787
1836
|
|
|
@@ -1791,22 +1840,19 @@ function fields() {
|
|
|
1791
1840
|
* @param props - The `ArrayFieldDescriptionProps` for the component
|
|
1792
1841
|
*/
|
|
1793
1842
|
function ArrayFieldDescriptionTemplate(props) {
|
|
1794
|
-
|
|
1795
|
-
|
|
1796
|
-
|
|
1797
|
-
|
|
1798
|
-
|
|
1799
|
-
|
|
1800
|
-
|
|
1801
|
-
|
|
1802
|
-
const {
|
|
1803
|
-
label: displayLabel = true
|
|
1804
|
-
} = options;
|
|
1843
|
+
var idSchema = props.idSchema,
|
|
1844
|
+
description = props.description,
|
|
1845
|
+
registry = props.registry,
|
|
1846
|
+
schema = props.schema,
|
|
1847
|
+
uiSchema = props.uiSchema;
|
|
1848
|
+
var options = utils.getUiOptions(uiSchema);
|
|
1849
|
+
var _options$label = options.label,
|
|
1850
|
+
displayLabel = _options$label === void 0 ? true : _options$label;
|
|
1805
1851
|
if (!description || !displayLabel) {
|
|
1806
1852
|
return null;
|
|
1807
1853
|
}
|
|
1808
|
-
|
|
1809
|
-
|
|
1854
|
+
var DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, options);
|
|
1855
|
+
var id = idSchema.$id + "__description";
|
|
1810
1856
|
return /*#__PURE__*/React__default["default"].createElement(DescriptionFieldTemplate, {
|
|
1811
1857
|
id: id,
|
|
1812
1858
|
description: description,
|
|
@@ -1821,27 +1867,24 @@ function ArrayFieldDescriptionTemplate(props) {
|
|
|
1821
1867
|
* @param props - The `ArrayFieldTemplateItemType` props for the component
|
|
1822
1868
|
*/
|
|
1823
1869
|
function ArrayFieldItemTemplate(props) {
|
|
1824
|
-
|
|
1825
|
-
|
|
1826
|
-
|
|
1827
|
-
|
|
1828
|
-
|
|
1829
|
-
|
|
1830
|
-
|
|
1831
|
-
|
|
1832
|
-
|
|
1833
|
-
|
|
1834
|
-
|
|
1835
|
-
|
|
1836
|
-
|
|
1837
|
-
|
|
1838
|
-
|
|
1839
|
-
|
|
1840
|
-
|
|
1841
|
-
|
|
1842
|
-
RemoveButton
|
|
1843
|
-
} = registry.templates.ButtonTemplates;
|
|
1844
|
-
const btnStyle = {
|
|
1870
|
+
var children = props.children,
|
|
1871
|
+
className = props.className,
|
|
1872
|
+
disabled = props.disabled,
|
|
1873
|
+
hasToolbar = props.hasToolbar,
|
|
1874
|
+
hasMoveDown = props.hasMoveDown,
|
|
1875
|
+
hasMoveUp = props.hasMoveUp,
|
|
1876
|
+
hasRemove = props.hasRemove,
|
|
1877
|
+
index = props.index,
|
|
1878
|
+
onDropIndexClick = props.onDropIndexClick,
|
|
1879
|
+
onReorderClick = props.onReorderClick,
|
|
1880
|
+
readonly = props.readonly,
|
|
1881
|
+
registry = props.registry,
|
|
1882
|
+
uiSchema = props.uiSchema;
|
|
1883
|
+
var _registry$templates$B = registry.templates.ButtonTemplates,
|
|
1884
|
+
MoveDownButton = _registry$templates$B.MoveDownButton,
|
|
1885
|
+
MoveUpButton = _registry$templates$B.MoveUpButton,
|
|
1886
|
+
RemoveButton = _registry$templates$B.RemoveButton;
|
|
1887
|
+
var btnStyle = {
|
|
1845
1888
|
flex: 1,
|
|
1846
1889
|
paddingLeft: 6,
|
|
1847
1890
|
paddingRight: 6,
|
|
@@ -1877,35 +1920,30 @@ function ArrayFieldItemTemplate(props) {
|
|
|
1877
1920
|
}))));
|
|
1878
1921
|
}
|
|
1879
1922
|
|
|
1923
|
+
var _excluded$4 = ["key"];
|
|
1880
1924
|
/** The `ArrayFieldTemplate` component is the template used to render all items in an array.
|
|
1881
1925
|
*
|
|
1882
1926
|
* @param props - The `ArrayFieldTemplateItemType` props for the component
|
|
1883
1927
|
*/
|
|
1884
1928
|
function ArrayFieldTemplate(props) {
|
|
1885
|
-
|
|
1886
|
-
|
|
1887
|
-
|
|
1888
|
-
|
|
1889
|
-
|
|
1890
|
-
|
|
1891
|
-
|
|
1892
|
-
|
|
1893
|
-
|
|
1894
|
-
|
|
1895
|
-
|
|
1896
|
-
|
|
1897
|
-
|
|
1898
|
-
|
|
1899
|
-
|
|
1900
|
-
|
|
1901
|
-
const ArrayFieldItemTemplate = utils.getTemplate("ArrayFieldItemTemplate", registry, uiOptions);
|
|
1902
|
-
const ArrayFieldTitleTemplate = utils.getTemplate("ArrayFieldTitleTemplate", registry, uiOptions);
|
|
1929
|
+
var canAdd = props.canAdd,
|
|
1930
|
+
className = props.className,
|
|
1931
|
+
disabled = props.disabled,
|
|
1932
|
+
idSchema = props.idSchema,
|
|
1933
|
+
uiSchema = props.uiSchema,
|
|
1934
|
+
items = props.items,
|
|
1935
|
+
onAddClick = props.onAddClick,
|
|
1936
|
+
readonly = props.readonly,
|
|
1937
|
+
registry = props.registry,
|
|
1938
|
+
required = props.required,
|
|
1939
|
+
schema = props.schema,
|
|
1940
|
+
title = props.title;
|
|
1941
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
1942
|
+
var ArrayFieldDescriptionTemplate = utils.getTemplate("ArrayFieldDescriptionTemplate", registry, uiOptions);
|
|
1943
|
+
var ArrayFieldItemTemplate = utils.getTemplate("ArrayFieldItemTemplate", registry, uiOptions);
|
|
1944
|
+
var ArrayFieldTitleTemplate = utils.getTemplate("ArrayFieldTitleTemplate", registry, uiOptions);
|
|
1903
1945
|
// Button templates are not overridden in the uiSchema
|
|
1904
|
-
|
|
1905
|
-
ButtonTemplates: {
|
|
1906
|
-
AddButton
|
|
1907
|
-
}
|
|
1908
|
-
} = registry.templates;
|
|
1946
|
+
var AddButton = registry.templates.ButtonTemplates.AddButton;
|
|
1909
1947
|
return /*#__PURE__*/React__default["default"].createElement("fieldset", {
|
|
1910
1948
|
className: className,
|
|
1911
1949
|
id: idSchema.$id
|
|
@@ -1924,15 +1962,12 @@ function ArrayFieldTemplate(props) {
|
|
|
1924
1962
|
registry: registry
|
|
1925
1963
|
}), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
1926
1964
|
className: "row array-item-list"
|
|
1927
|
-
}, items && items.map(_ref
|
|
1928
|
-
|
|
1929
|
-
|
|
1930
|
-
|
|
1931
|
-
|
|
1932
|
-
|
|
1933
|
-
key: key,
|
|
1934
|
-
...itemProps
|
|
1935
|
-
});
|
|
1965
|
+
}, items && items.map(function (_ref) {
|
|
1966
|
+
var key = _ref.key,
|
|
1967
|
+
itemProps = _objectWithoutPropertiesLoose(_ref, _excluded$4);
|
|
1968
|
+
return /*#__PURE__*/React__default["default"].createElement(ArrayFieldItemTemplate, _extends({
|
|
1969
|
+
key: key
|
|
1970
|
+
}, itemProps));
|
|
1936
1971
|
})), canAdd && /*#__PURE__*/React__default["default"].createElement(AddButton, {
|
|
1937
1972
|
className: "array-item-add",
|
|
1938
1973
|
onClick: onAddClick,
|
|
@@ -1947,23 +1982,20 @@ function ArrayFieldTemplate(props) {
|
|
|
1947
1982
|
* @param props - The `ArrayFieldTitleProps` for the component
|
|
1948
1983
|
*/
|
|
1949
1984
|
function ArrayFieldTitleTemplate(props) {
|
|
1950
|
-
|
|
1951
|
-
|
|
1952
|
-
|
|
1953
|
-
|
|
1954
|
-
|
|
1955
|
-
|
|
1956
|
-
|
|
1957
|
-
|
|
1958
|
-
|
|
1959
|
-
const {
|
|
1960
|
-
label: displayLabel = true
|
|
1961
|
-
} = options;
|
|
1985
|
+
var idSchema = props.idSchema,
|
|
1986
|
+
title = props.title,
|
|
1987
|
+
schema = props.schema,
|
|
1988
|
+
uiSchema = props.uiSchema,
|
|
1989
|
+
required = props.required,
|
|
1990
|
+
registry = props.registry;
|
|
1991
|
+
var options = utils.getUiOptions(uiSchema);
|
|
1992
|
+
var _options$label = options.label,
|
|
1993
|
+
displayLabel = _options$label === void 0 ? true : _options$label;
|
|
1962
1994
|
if (!title || !displayLabel) {
|
|
1963
1995
|
return null;
|
|
1964
1996
|
}
|
|
1965
|
-
|
|
1966
|
-
|
|
1997
|
+
var TitleFieldTemplate = utils.getTemplate("TitleFieldTemplate", registry, options);
|
|
1998
|
+
var id = idSchema.$id + "__title";
|
|
1967
1999
|
return /*#__PURE__*/React__default["default"].createElement(TitleFieldTemplate, {
|
|
1968
2000
|
id: id,
|
|
1969
2001
|
title: title,
|
|
@@ -1974,6 +2006,7 @@ function ArrayFieldTitleTemplate(props) {
|
|
|
1974
2006
|
});
|
|
1975
2007
|
}
|
|
1976
2008
|
|
|
2009
|
+
var _excluded$3 = ["id", "value", "readonly", "disabled", "autofocus", "onBlur", "onFocus", "onChange", "options", "schema", "uiSchema", "formContext", "registry", "rawErrors", "type"];
|
|
1977
2010
|
/** The `BaseInputTemplate` is the template to use to render the basic `<input>` component for the `core` theme.
|
|
1978
2011
|
* It is used as the template for rendering many of the <input> based widgets that differ by `type` and callbacks only.
|
|
1979
2012
|
* It can be customized/overridden for other themes or individual implementations as needed.
|
|
@@ -1981,161 +2014,136 @@ function ArrayFieldTitleTemplate(props) {
|
|
|
1981
2014
|
* @param props - The `WidgetProps` for this template
|
|
1982
2015
|
*/
|
|
1983
2016
|
function BaseInputTemplate(props) {
|
|
1984
|
-
|
|
1985
|
-
|
|
1986
|
-
|
|
1987
|
-
|
|
1988
|
-
|
|
1989
|
-
|
|
1990
|
-
|
|
1991
|
-
|
|
1992
|
-
|
|
1993
|
-
|
|
1994
|
-
|
|
1995
|
-
|
|
1996
|
-
formContext,
|
|
1997
|
-
registry,
|
|
1998
|
-
rawErrors,
|
|
1999
|
-
type,
|
|
2000
|
-
...rest
|
|
2001
|
-
} = props;
|
|
2017
|
+
var id = props.id,
|
|
2018
|
+
value = props.value,
|
|
2019
|
+
readonly = props.readonly,
|
|
2020
|
+
disabled = props.disabled,
|
|
2021
|
+
autofocus = props.autofocus,
|
|
2022
|
+
onBlur = props.onBlur,
|
|
2023
|
+
onFocus = props.onFocus,
|
|
2024
|
+
onChange = props.onChange,
|
|
2025
|
+
options = props.options,
|
|
2026
|
+
schema = props.schema,
|
|
2027
|
+
type = props.type,
|
|
2028
|
+
rest = _objectWithoutPropertiesLoose(props, _excluded$3);
|
|
2002
2029
|
// Note: since React 15.2.0 we can't forward unknown element attributes, so we
|
|
2003
2030
|
// exclude the "options" and "schema" ones here.
|
|
2004
2031
|
if (!id) {
|
|
2005
2032
|
console.log("No id for", props);
|
|
2006
|
-
throw new Error(
|
|
2033
|
+
throw new Error("no id for props " + JSON.stringify(props));
|
|
2007
2034
|
}
|
|
2008
|
-
|
|
2009
|
-
|
|
2010
|
-
...utils.getInputProps(schema, type, options)
|
|
2011
|
-
};
|
|
2012
|
-
let inputValue;
|
|
2035
|
+
var inputProps = _extends({}, rest, utils.getInputProps(schema, type, options));
|
|
2036
|
+
var inputValue;
|
|
2013
2037
|
if (inputProps.type === "number" || inputProps.type === "integer") {
|
|
2014
2038
|
inputValue = value || value === 0 ? value : "";
|
|
2015
2039
|
} else {
|
|
2016
2040
|
inputValue = value == null ? "" : value;
|
|
2017
2041
|
}
|
|
2018
|
-
|
|
2019
|
-
|
|
2020
|
-
target: {
|
|
2021
|
-
value
|
|
2022
|
-
}
|
|
2023
|
-
} = _ref;
|
|
2042
|
+
var _onChange = React.useCallback(function (_ref) {
|
|
2043
|
+
var value = _ref.target.value;
|
|
2024
2044
|
return onChange(value === "" ? options.emptyValue : value);
|
|
2025
2045
|
}, [onChange, options]);
|
|
2026
|
-
|
|
2027
|
-
|
|
2028
|
-
target: {
|
|
2029
|
-
value
|
|
2030
|
-
}
|
|
2031
|
-
} = _ref2;
|
|
2046
|
+
var _onBlur = React.useCallback(function (_ref2) {
|
|
2047
|
+
var value = _ref2.target.value;
|
|
2032
2048
|
return onBlur(id, value);
|
|
2033
2049
|
}, [onBlur, id]);
|
|
2034
|
-
|
|
2035
|
-
|
|
2036
|
-
target: {
|
|
2037
|
-
value
|
|
2038
|
-
}
|
|
2039
|
-
} = _ref3;
|
|
2050
|
+
var _onFocus = React.useCallback(function (_ref3) {
|
|
2051
|
+
var value = _ref3.target.value;
|
|
2040
2052
|
return onFocus(id, value);
|
|
2041
2053
|
}, [onFocus, id]);
|
|
2042
|
-
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("input", {
|
|
2054
|
+
return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, /*#__PURE__*/React__default["default"].createElement("input", _extends({
|
|
2043
2055
|
id: id,
|
|
2044
2056
|
name: id,
|
|
2045
2057
|
className: "form-control",
|
|
2046
2058
|
readOnly: readonly,
|
|
2047
2059
|
disabled: disabled,
|
|
2048
2060
|
autoFocus: autofocus,
|
|
2049
|
-
value: inputValue
|
|
2050
|
-
|
|
2051
|
-
list: schema.examples ?
|
|
2061
|
+
value: inputValue
|
|
2062
|
+
}, inputProps, {
|
|
2063
|
+
list: schema.examples ? "examples_" + id : undefined,
|
|
2052
2064
|
onChange: _onChange,
|
|
2053
2065
|
onBlur: _onBlur,
|
|
2054
2066
|
onFocus: _onFocus
|
|
2055
|
-
}), Array.isArray(schema.examples) && /*#__PURE__*/React__default["default"].createElement("datalist", {
|
|
2056
|
-
key:
|
|
2057
|
-
id:
|
|
2058
|
-
}, [
|
|
2059
|
-
|
|
2060
|
-
|
|
2061
|
-
|
|
2067
|
+
})), Array.isArray(schema.examples) && /*#__PURE__*/React__default["default"].createElement("datalist", {
|
|
2068
|
+
key: "datalist_" + id,
|
|
2069
|
+
id: "examples_" + id
|
|
2070
|
+
}, [].concat(new Set(schema.examples.concat(schema["default"] ? [schema["default"]] : []))).map(function (example) {
|
|
2071
|
+
return /*#__PURE__*/React__default["default"].createElement("option", {
|
|
2072
|
+
key: example,
|
|
2073
|
+
value: example
|
|
2074
|
+
});
|
|
2075
|
+
})));
|
|
2062
2076
|
}
|
|
2063
2077
|
|
|
2064
2078
|
/** The `SubmitButton` renders a button that represent the `Submit` action on a form
|
|
2065
2079
|
*/
|
|
2066
2080
|
function SubmitButton(_ref) {
|
|
2067
|
-
|
|
2068
|
-
|
|
2069
|
-
|
|
2070
|
-
|
|
2071
|
-
|
|
2072
|
-
|
|
2073
|
-
props: submitButtonProps = {}
|
|
2074
|
-
} = utils.getSubmitButtonOptions(uiSchema);
|
|
2081
|
+
var uiSchema = _ref.uiSchema;
|
|
2082
|
+
var _getSubmitButtonOptio = utils.getSubmitButtonOptions(uiSchema),
|
|
2083
|
+
submitText = _getSubmitButtonOptio.submitText,
|
|
2084
|
+
norender = _getSubmitButtonOptio.norender,
|
|
2085
|
+
_getSubmitButtonOptio2 = _getSubmitButtonOptio.props,
|
|
2086
|
+
submitButtonProps = _getSubmitButtonOptio2 === void 0 ? {} : _getSubmitButtonOptio2;
|
|
2075
2087
|
if (norender) {
|
|
2076
2088
|
return null;
|
|
2077
2089
|
}
|
|
2078
|
-
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("button", {
|
|
2079
|
-
type: "submit"
|
|
2080
|
-
|
|
2081
|
-
className:
|
|
2082
|
-
}, submitText));
|
|
2090
|
+
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("button", _extends({
|
|
2091
|
+
type: "submit"
|
|
2092
|
+
}, submitButtonProps, {
|
|
2093
|
+
className: "btn btn-info " + submitButtonProps.className
|
|
2094
|
+
}), submitText));
|
|
2083
2095
|
}
|
|
2084
2096
|
|
|
2097
|
+
var _excluded$2 = ["iconType", "icon", "className", "uiSchema"];
|
|
2085
2098
|
function IconButton(props) {
|
|
2086
|
-
|
|
2087
|
-
iconType = "default",
|
|
2088
|
-
icon,
|
|
2089
|
-
className,
|
|
2090
|
-
|
|
2091
|
-
|
|
2092
|
-
} = props;
|
|
2093
|
-
return /*#__PURE__*/React__default["default"].createElement("button", {
|
|
2099
|
+
var _props$iconType = props.iconType,
|
|
2100
|
+
iconType = _props$iconType === void 0 ? "default" : _props$iconType,
|
|
2101
|
+
icon = props.icon,
|
|
2102
|
+
className = props.className,
|
|
2103
|
+
otherProps = _objectWithoutPropertiesLoose(props, _excluded$2);
|
|
2104
|
+
return /*#__PURE__*/React__default["default"].createElement("button", _extends({
|
|
2094
2105
|
type: "button",
|
|
2095
|
-
className:
|
|
2096
|
-
|
|
2097
|
-
|
|
2098
|
-
className: `glyphicon glyphicon-${icon}`
|
|
2106
|
+
className: "btn btn-" + iconType + " " + className
|
|
2107
|
+
}, otherProps), /*#__PURE__*/React__default["default"].createElement("i", {
|
|
2108
|
+
className: "glyphicon glyphicon-" + icon
|
|
2099
2109
|
}));
|
|
2100
2110
|
}
|
|
2101
2111
|
function MoveDownButton(props) {
|
|
2102
|
-
return /*#__PURE__*/React__default["default"].createElement(IconButton, {
|
|
2112
|
+
return /*#__PURE__*/React__default["default"].createElement(IconButton, _extends({
|
|
2103
2113
|
title: "Move down",
|
|
2104
|
-
className: "array-item-move-down"
|
|
2105
|
-
|
|
2114
|
+
className: "array-item-move-down"
|
|
2115
|
+
}, props, {
|
|
2106
2116
|
icon: "arrow-down"
|
|
2107
|
-
});
|
|
2117
|
+
}));
|
|
2108
2118
|
}
|
|
2109
2119
|
function MoveUpButton(props) {
|
|
2110
|
-
return /*#__PURE__*/React__default["default"].createElement(IconButton, {
|
|
2120
|
+
return /*#__PURE__*/React__default["default"].createElement(IconButton, _extends({
|
|
2111
2121
|
title: "Move up",
|
|
2112
|
-
className: "array-item-move-up"
|
|
2113
|
-
|
|
2122
|
+
className: "array-item-move-up"
|
|
2123
|
+
}, props, {
|
|
2114
2124
|
icon: "arrow-up"
|
|
2115
|
-
});
|
|
2125
|
+
}));
|
|
2116
2126
|
}
|
|
2117
2127
|
function RemoveButton(props) {
|
|
2118
|
-
return /*#__PURE__*/React__default["default"].createElement(IconButton, {
|
|
2128
|
+
return /*#__PURE__*/React__default["default"].createElement(IconButton, _extends({
|
|
2119
2129
|
title: "Remove",
|
|
2120
|
-
className: "array-item-remove"
|
|
2121
|
-
|
|
2130
|
+
className: "array-item-remove"
|
|
2131
|
+
}, props, {
|
|
2122
2132
|
iconType: "danger",
|
|
2123
2133
|
icon: "remove"
|
|
2124
|
-
});
|
|
2134
|
+
}));
|
|
2125
2135
|
}
|
|
2126
2136
|
|
|
2127
2137
|
/** The `AddButton` renders a button that represent the `Add` action on a form
|
|
2128
2138
|
*/
|
|
2129
2139
|
function AddButton(_ref) {
|
|
2130
|
-
|
|
2131
|
-
|
|
2132
|
-
|
|
2133
|
-
disabled
|
|
2134
|
-
} = _ref;
|
|
2140
|
+
var className = _ref.className,
|
|
2141
|
+
onClick = _ref.onClick,
|
|
2142
|
+
disabled = _ref.disabled;
|
|
2135
2143
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2136
2144
|
className: "row"
|
|
2137
2145
|
}, /*#__PURE__*/React__default["default"].createElement("p", {
|
|
2138
|
-
className:
|
|
2146
|
+
className: "col-xs-3 col-xs-offset-9 text-right " + className
|
|
2139
2147
|
}, /*#__PURE__*/React__default["default"].createElement(IconButton, {
|
|
2140
2148
|
iconType: "info",
|
|
2141
2149
|
icon: "plus",
|
|
@@ -2148,11 +2156,11 @@ function AddButton(_ref) {
|
|
|
2148
2156
|
|
|
2149
2157
|
function buttonTemplates() {
|
|
2150
2158
|
return {
|
|
2151
|
-
SubmitButton,
|
|
2152
|
-
AddButton,
|
|
2153
|
-
MoveDownButton,
|
|
2154
|
-
MoveUpButton,
|
|
2155
|
-
RemoveButton
|
|
2159
|
+
SubmitButton: SubmitButton,
|
|
2160
|
+
AddButton: AddButton,
|
|
2161
|
+
MoveDownButton: MoveDownButton,
|
|
2162
|
+
MoveUpButton: MoveUpButton,
|
|
2163
|
+
RemoveButton: RemoveButton
|
|
2156
2164
|
};
|
|
2157
2165
|
}
|
|
2158
2166
|
|
|
@@ -2161,10 +2169,8 @@ function buttonTemplates() {
|
|
|
2161
2169
|
* @param props - The `DescriptionFieldProps` for this component
|
|
2162
2170
|
*/
|
|
2163
2171
|
function DescriptionField(props) {
|
|
2164
|
-
|
|
2165
|
-
|
|
2166
|
-
description
|
|
2167
|
-
} = props;
|
|
2172
|
+
var id = props.id,
|
|
2173
|
+
description = props.description;
|
|
2168
2174
|
if (!description) {
|
|
2169
2175
|
return null;
|
|
2170
2176
|
}
|
|
@@ -2186,9 +2192,7 @@ function DescriptionField(props) {
|
|
|
2186
2192
|
* @param props - The `ErrorListProps` for this component
|
|
2187
2193
|
*/
|
|
2188
2194
|
function ErrorList(_ref) {
|
|
2189
|
-
|
|
2190
|
-
errors
|
|
2191
|
-
} = _ref;
|
|
2195
|
+
var errors = _ref.errors;
|
|
2192
2196
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2193
2197
|
className: "panel panel-danger errors"
|
|
2194
2198
|
}, /*#__PURE__*/React__default["default"].createElement("div", {
|
|
@@ -2197,7 +2201,7 @@ function ErrorList(_ref) {
|
|
|
2197
2201
|
className: "panel-title"
|
|
2198
2202
|
}, "Errors")), /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
2199
2203
|
className: "list-group"
|
|
2200
|
-
}, errors.map((error, i)
|
|
2204
|
+
}, errors.map(function (error, i) {
|
|
2201
2205
|
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
2202
2206
|
key: i,
|
|
2203
2207
|
className: "list-group-item text-danger"
|
|
@@ -2205,17 +2209,15 @@ function ErrorList(_ref) {
|
|
|
2205
2209
|
})));
|
|
2206
2210
|
}
|
|
2207
2211
|
|
|
2208
|
-
|
|
2212
|
+
var REQUIRED_FIELD_SYMBOL$1 = "*";
|
|
2209
2213
|
/** Renders a label for a field
|
|
2210
2214
|
*
|
|
2211
2215
|
* @param props - The `LabelProps` for this component
|
|
2212
2216
|
*/
|
|
2213
2217
|
function Label(props) {
|
|
2214
|
-
|
|
2215
|
-
|
|
2216
|
-
|
|
2217
|
-
id
|
|
2218
|
-
} = props;
|
|
2218
|
+
var label = props.label,
|
|
2219
|
+
required = props.required,
|
|
2220
|
+
id = props.id;
|
|
2219
2221
|
if (!label) {
|
|
2220
2222
|
return null;
|
|
2221
2223
|
}
|
|
@@ -2233,29 +2235,25 @@ function Label(props) {
|
|
|
2233
2235
|
* @param props - The `FieldTemplateProps` for this component
|
|
2234
2236
|
*/
|
|
2235
2237
|
function FieldTemplate(props) {
|
|
2236
|
-
|
|
2237
|
-
|
|
2238
|
-
|
|
2239
|
-
|
|
2240
|
-
|
|
2241
|
-
|
|
2242
|
-
|
|
2243
|
-
|
|
2244
|
-
|
|
2245
|
-
|
|
2246
|
-
|
|
2247
|
-
|
|
2248
|
-
|
|
2249
|
-
const uiOptions = utils.getUiOptions(uiSchema);
|
|
2250
|
-
const WrapIfAdditionalTemplate = utils.getTemplate("WrapIfAdditionalTemplate", registry, uiOptions);
|
|
2238
|
+
var id = props.id,
|
|
2239
|
+
label = props.label,
|
|
2240
|
+
children = props.children,
|
|
2241
|
+
errors = props.errors,
|
|
2242
|
+
help = props.help,
|
|
2243
|
+
description = props.description,
|
|
2244
|
+
hidden = props.hidden,
|
|
2245
|
+
required = props.required,
|
|
2246
|
+
displayLabel = props.displayLabel,
|
|
2247
|
+
registry = props.registry,
|
|
2248
|
+
uiSchema = props.uiSchema;
|
|
2249
|
+
var uiOptions = utils.getUiOptions(uiSchema);
|
|
2250
|
+
var WrapIfAdditionalTemplate = utils.getTemplate("WrapIfAdditionalTemplate", registry, uiOptions);
|
|
2251
2251
|
if (hidden) {
|
|
2252
2252
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2253
2253
|
className: "hidden"
|
|
2254
2254
|
}, children);
|
|
2255
2255
|
}
|
|
2256
|
-
return /*#__PURE__*/React__default["default"].createElement(WrapIfAdditionalTemplate, {
|
|
2257
|
-
...props
|
|
2258
|
-
}, displayLabel && /*#__PURE__*/React__default["default"].createElement(Label, {
|
|
2256
|
+
return /*#__PURE__*/React__default["default"].createElement(WrapIfAdditionalTemplate, _extends({}, props), displayLabel && /*#__PURE__*/React__default["default"].createElement(Label, {
|
|
2259
2257
|
label: label,
|
|
2260
2258
|
required: required,
|
|
2261
2259
|
id: id
|
|
@@ -2267,18 +2265,19 @@ function FieldTemplate(props) {
|
|
|
2267
2265
|
* @param props - The `FieldErrorProps` for the errors being rendered
|
|
2268
2266
|
*/
|
|
2269
2267
|
function FieldErrorTemplate(props) {
|
|
2270
|
-
|
|
2271
|
-
errors = [],
|
|
2272
|
-
idSchema
|
|
2273
|
-
} = props;
|
|
2268
|
+
var _props$errors = props.errors,
|
|
2269
|
+
errors = _props$errors === void 0 ? [] : _props$errors,
|
|
2270
|
+
idSchema = props.idSchema;
|
|
2274
2271
|
if (errors.length === 0) {
|
|
2275
2272
|
return null;
|
|
2276
2273
|
}
|
|
2277
|
-
|
|
2274
|
+
var id = idSchema.$id + "__error";
|
|
2278
2275
|
return /*#__PURE__*/React__default["default"].createElement("div", null, /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
2279
2276
|
id: id,
|
|
2280
2277
|
className: "error-detail bs-callout bs-callout-info"
|
|
2281
|
-
}, errors.filter(
|
|
2278
|
+
}, errors.filter(function (elem) {
|
|
2279
|
+
return !!elem;
|
|
2280
|
+
}).map(function (error, index) {
|
|
2282
2281
|
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
2283
2282
|
className: "text-danger",
|
|
2284
2283
|
key: index
|
|
@@ -2291,14 +2290,12 @@ function FieldErrorTemplate(props) {
|
|
|
2291
2290
|
* @param props - The `FieldHelpProps` to be rendered
|
|
2292
2291
|
*/
|
|
2293
2292
|
function FieldHelpTemplate(props) {
|
|
2294
|
-
|
|
2295
|
-
|
|
2296
|
-
help
|
|
2297
|
-
} = props;
|
|
2293
|
+
var idSchema = props.idSchema,
|
|
2294
|
+
help = props.help;
|
|
2298
2295
|
if (!help) {
|
|
2299
2296
|
return null;
|
|
2300
2297
|
}
|
|
2301
|
-
|
|
2298
|
+
var id = idSchema.$id + "__help";
|
|
2302
2299
|
if (typeof help === "string") {
|
|
2303
2300
|
return /*#__PURE__*/React__default["default"].createElement("p", {
|
|
2304
2301
|
id: id,
|
|
@@ -2318,45 +2315,41 @@ function FieldHelpTemplate(props) {
|
|
|
2318
2315
|
* @param props - The `ObjectFieldTemplateProps` for this component
|
|
2319
2316
|
*/
|
|
2320
2317
|
function ObjectFieldTemplate(props) {
|
|
2321
|
-
|
|
2322
|
-
|
|
2323
|
-
|
|
2324
|
-
|
|
2325
|
-
|
|
2326
|
-
|
|
2327
|
-
|
|
2328
|
-
|
|
2329
|
-
|
|
2330
|
-
|
|
2331
|
-
|
|
2332
|
-
|
|
2333
|
-
|
|
2334
|
-
|
|
2335
|
-
|
|
2336
|
-
const TitleFieldTemplate = utils.getTemplate("TitleFieldTemplate", registry, options);
|
|
2337
|
-
const DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, options);
|
|
2318
|
+
var description = props.description,
|
|
2319
|
+
disabled = props.disabled,
|
|
2320
|
+
formData = props.formData,
|
|
2321
|
+
idSchema = props.idSchema,
|
|
2322
|
+
onAddClick = props.onAddClick,
|
|
2323
|
+
properties = props.properties,
|
|
2324
|
+
readonly = props.readonly,
|
|
2325
|
+
registry = props.registry,
|
|
2326
|
+
required = props.required,
|
|
2327
|
+
schema = props.schema,
|
|
2328
|
+
title = props.title,
|
|
2329
|
+
uiSchema = props.uiSchema;
|
|
2330
|
+
var options = utils.getUiOptions(uiSchema);
|
|
2331
|
+
var TitleFieldTemplate = utils.getTemplate("TitleFieldTemplate", registry, options);
|
|
2332
|
+
var DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, options);
|
|
2338
2333
|
// Button templates are not overridden in the uiSchema
|
|
2339
|
-
|
|
2340
|
-
ButtonTemplates: {
|
|
2341
|
-
AddButton
|
|
2342
|
-
}
|
|
2343
|
-
} = registry.templates;
|
|
2334
|
+
var AddButton = registry.templates.ButtonTemplates.AddButton;
|
|
2344
2335
|
return /*#__PURE__*/React__default["default"].createElement("fieldset", {
|
|
2345
2336
|
id: idSchema.$id
|
|
2346
2337
|
}, (options.title || title) && /*#__PURE__*/React__default["default"].createElement(TitleFieldTemplate, {
|
|
2347
|
-
id:
|
|
2338
|
+
id: idSchema.$id + "__title",
|
|
2348
2339
|
title: options.title || title,
|
|
2349
2340
|
required: required,
|
|
2350
2341
|
schema: schema,
|
|
2351
2342
|
uiSchema: uiSchema,
|
|
2352
2343
|
registry: registry
|
|
2353
2344
|
}), (options.description || description) && /*#__PURE__*/React__default["default"].createElement(DescriptionFieldTemplate, {
|
|
2354
|
-
id:
|
|
2345
|
+
id: idSchema.$id + "__description",
|
|
2355
2346
|
description: options.description || description,
|
|
2356
2347
|
schema: schema,
|
|
2357
2348
|
uiSchema: uiSchema,
|
|
2358
2349
|
registry: registry
|
|
2359
|
-
}), properties.map(
|
|
2350
|
+
}), properties.map(function (prop) {
|
|
2351
|
+
return prop.content;
|
|
2352
|
+
}), utils.canExpand(schema, uiSchema, formData) && /*#__PURE__*/React__default["default"].createElement(AddButton, {
|
|
2360
2353
|
className: "object-property-expand",
|
|
2361
2354
|
onClick: onAddClick(schema),
|
|
2362
2355
|
disabled: disabled || readonly,
|
|
@@ -2364,17 +2357,15 @@ function ObjectFieldTemplate(props) {
|
|
|
2364
2357
|
}));
|
|
2365
2358
|
}
|
|
2366
2359
|
|
|
2367
|
-
|
|
2360
|
+
var REQUIRED_FIELD_SYMBOL = "*";
|
|
2368
2361
|
/** The `TitleField` is the template to use to render the title of a field
|
|
2369
2362
|
*
|
|
2370
2363
|
* @param props - The `TitleFieldProps` for this component
|
|
2371
2364
|
*/
|
|
2372
2365
|
function TitleField(props) {
|
|
2373
|
-
|
|
2374
|
-
|
|
2375
|
-
|
|
2376
|
-
required
|
|
2377
|
-
} = props;
|
|
2366
|
+
var id = props.id,
|
|
2367
|
+
title = props.title,
|
|
2368
|
+
required = props.required;
|
|
2378
2369
|
return /*#__PURE__*/React__default["default"].createElement("legend", {
|
|
2379
2370
|
id: id
|
|
2380
2371
|
}, title, required && /*#__PURE__*/React__default["default"].createElement("span", {
|
|
@@ -2388,11 +2379,9 @@ function TitleField(props) {
|
|
|
2388
2379
|
* @param props - The `FieldProps` for this template
|
|
2389
2380
|
*/
|
|
2390
2381
|
function UnsupportedField(props) {
|
|
2391
|
-
|
|
2392
|
-
|
|
2393
|
-
|
|
2394
|
-
reason
|
|
2395
|
-
} = props;
|
|
2382
|
+
var schema = props.schema,
|
|
2383
|
+
idSchema = props.idSchema,
|
|
2384
|
+
reason = props.reason;
|
|
2396
2385
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2397
2386
|
className: "unsupported-field"
|
|
2398
2387
|
}, /*#__PURE__*/React__default["default"].createElement("p", null, "Unsupported field schema", idSchema && idSchema.$id && /*#__PURE__*/React__default["default"].createElement("span", null, " for", " field ", /*#__PURE__*/React__default["default"].createElement("code", null, idSchema.$id)), reason && /*#__PURE__*/React__default["default"].createElement("em", null, ": ", reason), "."), schema && /*#__PURE__*/React__default["default"].createElement("pre", null, JSON.stringify(schema, null, 2)));
|
|
@@ -2404,26 +2393,22 @@ function UnsupportedField(props) {
|
|
|
2404
2393
|
* @param props - The `WrapIfAdditionalProps` for this component
|
|
2405
2394
|
*/
|
|
2406
2395
|
function WrapIfAdditionalTemplate(props) {
|
|
2407
|
-
|
|
2408
|
-
|
|
2409
|
-
|
|
2410
|
-
|
|
2411
|
-
|
|
2412
|
-
|
|
2413
|
-
|
|
2414
|
-
|
|
2415
|
-
|
|
2416
|
-
|
|
2417
|
-
|
|
2418
|
-
|
|
2419
|
-
registry
|
|
2420
|
-
} = props;
|
|
2396
|
+
var id = props.id,
|
|
2397
|
+
classNames = props.classNames,
|
|
2398
|
+
disabled = props.disabled,
|
|
2399
|
+
label = props.label,
|
|
2400
|
+
onKeyChange = props.onKeyChange,
|
|
2401
|
+
onDropPropertyClick = props.onDropPropertyClick,
|
|
2402
|
+
readonly = props.readonly,
|
|
2403
|
+
required = props.required,
|
|
2404
|
+
schema = props.schema,
|
|
2405
|
+
children = props.children,
|
|
2406
|
+
uiSchema = props.uiSchema,
|
|
2407
|
+
registry = props.registry;
|
|
2421
2408
|
// Button templates are not overridden in the uiSchema
|
|
2422
|
-
|
|
2423
|
-
|
|
2424
|
-
|
|
2425
|
-
const keyLabel = `${label} Key`; // i18n ?
|
|
2426
|
-
const additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
|
|
2409
|
+
var RemoveButton = registry.templates.ButtonTemplates.RemoveButton;
|
|
2410
|
+
var keyLabel = label + " Key"; // i18n ?
|
|
2411
|
+
var additional = (utils.ADDITIONAL_PROPERTY_FLAG in schema);
|
|
2427
2412
|
if (!additional) {
|
|
2428
2413
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2429
2414
|
className: classNames
|
|
@@ -2440,12 +2425,14 @@ function WrapIfAdditionalTemplate(props) {
|
|
|
2440
2425
|
}, /*#__PURE__*/React__default["default"].createElement(Label, {
|
|
2441
2426
|
label: keyLabel,
|
|
2442
2427
|
required: required,
|
|
2443
|
-
id:
|
|
2428
|
+
id: id + "-key"
|
|
2444
2429
|
}), /*#__PURE__*/React__default["default"].createElement("input", {
|
|
2445
2430
|
className: "form-control",
|
|
2446
2431
|
type: "text",
|
|
2447
|
-
id:
|
|
2448
|
-
onBlur:
|
|
2432
|
+
id: id + "-key",
|
|
2433
|
+
onBlur: function onBlur(event) {
|
|
2434
|
+
return onKeyChange(event.target.value);
|
|
2435
|
+
},
|
|
2449
2436
|
defaultValue: label
|
|
2450
2437
|
}))), /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2451
2438
|
className: "form-additional form-group col-xs-5"
|
|
@@ -2464,27 +2451,27 @@ function WrapIfAdditionalTemplate(props) {
|
|
|
2464
2451
|
|
|
2465
2452
|
function templates() {
|
|
2466
2453
|
return {
|
|
2467
|
-
ArrayFieldDescriptionTemplate,
|
|
2468
|
-
ArrayFieldItemTemplate,
|
|
2469
|
-
ArrayFieldTemplate,
|
|
2470
|
-
ArrayFieldTitleTemplate,
|
|
2454
|
+
ArrayFieldDescriptionTemplate: ArrayFieldDescriptionTemplate,
|
|
2455
|
+
ArrayFieldItemTemplate: ArrayFieldItemTemplate,
|
|
2456
|
+
ArrayFieldTemplate: ArrayFieldTemplate,
|
|
2457
|
+
ArrayFieldTitleTemplate: ArrayFieldTitleTemplate,
|
|
2471
2458
|
ButtonTemplates: buttonTemplates(),
|
|
2472
|
-
BaseInputTemplate,
|
|
2459
|
+
BaseInputTemplate: BaseInputTemplate,
|
|
2473
2460
|
DescriptionFieldTemplate: DescriptionField,
|
|
2474
2461
|
ErrorListTemplate: ErrorList,
|
|
2475
|
-
FieldTemplate,
|
|
2476
|
-
FieldErrorTemplate,
|
|
2477
|
-
FieldHelpTemplate,
|
|
2478
|
-
ObjectFieldTemplate,
|
|
2462
|
+
FieldTemplate: FieldTemplate,
|
|
2463
|
+
FieldErrorTemplate: FieldErrorTemplate,
|
|
2464
|
+
FieldHelpTemplate: FieldHelpTemplate,
|
|
2465
|
+
ObjectFieldTemplate: ObjectFieldTemplate,
|
|
2479
2466
|
TitleFieldTemplate: TitleField,
|
|
2480
2467
|
UnsupportedFieldTemplate: UnsupportedField,
|
|
2481
|
-
WrapIfAdditionalTemplate
|
|
2468
|
+
WrapIfAdditionalTemplate: WrapIfAdditionalTemplate
|
|
2482
2469
|
};
|
|
2483
2470
|
}
|
|
2484
2471
|
|
|
2485
2472
|
function rangeOptions(start, stop) {
|
|
2486
|
-
|
|
2487
|
-
for (
|
|
2473
|
+
var options = [];
|
|
2474
|
+
for (var i = start; i <= stop; i++) {
|
|
2488
2475
|
options.push({
|
|
2489
2476
|
value: i,
|
|
2490
2477
|
label: utils.pad(i, 2)
|
|
@@ -2493,21 +2480,21 @@ function rangeOptions(start, stop) {
|
|
|
2493
2480
|
return options;
|
|
2494
2481
|
}
|
|
2495
2482
|
function readyForChange(state) {
|
|
2496
|
-
return Object.values(state).every(
|
|
2483
|
+
return Object.values(state).every(function (value) {
|
|
2484
|
+
return value !== -1;
|
|
2485
|
+
});
|
|
2497
2486
|
}
|
|
2498
2487
|
function dateElementProps(state, time, yearsRange) {
|
|
2499
2488
|
if (yearsRange === void 0) {
|
|
2500
2489
|
yearsRange = [1900, new Date().getFullYear() + 2];
|
|
2501
2490
|
}
|
|
2502
|
-
|
|
2503
|
-
|
|
2504
|
-
|
|
2505
|
-
|
|
2506
|
-
|
|
2507
|
-
|
|
2508
|
-
|
|
2509
|
-
} = state;
|
|
2510
|
-
const data = [{
|
|
2491
|
+
var year = state.year,
|
|
2492
|
+
month = state.month,
|
|
2493
|
+
day = state.day,
|
|
2494
|
+
hour = state.hour,
|
|
2495
|
+
minute = state.minute,
|
|
2496
|
+
second = state.second;
|
|
2497
|
+
var data = [{
|
|
2511
2498
|
type: "year",
|
|
2512
2499
|
range: yearsRange,
|
|
2513
2500
|
value: year
|
|
@@ -2538,23 +2525,19 @@ function dateElementProps(state, time, yearsRange) {
|
|
|
2538
2525
|
return data;
|
|
2539
2526
|
}
|
|
2540
2527
|
function DateElement(_ref) {
|
|
2541
|
-
|
|
2542
|
-
|
|
2543
|
-
|
|
2544
|
-
|
|
2545
|
-
|
|
2546
|
-
|
|
2547
|
-
|
|
2548
|
-
|
|
2549
|
-
|
|
2550
|
-
|
|
2551
|
-
|
|
2552
|
-
|
|
2553
|
-
|
|
2554
|
-
const id = rootId + "_" + type;
|
|
2555
|
-
const {
|
|
2556
|
-
SelectWidget
|
|
2557
|
-
} = registry.widgets;
|
|
2528
|
+
var type = _ref.type,
|
|
2529
|
+
range = _ref.range,
|
|
2530
|
+
value = _ref.value,
|
|
2531
|
+
select = _ref.select,
|
|
2532
|
+
rootId = _ref.rootId,
|
|
2533
|
+
disabled = _ref.disabled,
|
|
2534
|
+
readonly = _ref.readonly,
|
|
2535
|
+
autofocus = _ref.autofocus,
|
|
2536
|
+
registry = _ref.registry,
|
|
2537
|
+
onBlur = _ref.onBlur,
|
|
2538
|
+
onFocus = _ref.onFocus;
|
|
2539
|
+
var id = rootId + "_" + type;
|
|
2540
|
+
var SelectWidget = registry.widgets.SelectWidget;
|
|
2558
2541
|
return /*#__PURE__*/React__default["default"].createElement(SelectWidget, {
|
|
2559
2542
|
schema: {
|
|
2560
2543
|
type: "integer"
|
|
@@ -2569,7 +2552,9 @@ function DateElement(_ref) {
|
|
|
2569
2552
|
disabled: disabled,
|
|
2570
2553
|
readonly: readonly,
|
|
2571
2554
|
autofocus: autofocus,
|
|
2572
|
-
onChange:
|
|
2555
|
+
onChange: function onChange(value) {
|
|
2556
|
+
return select(type, value);
|
|
2557
|
+
},
|
|
2573
2558
|
onBlur: onBlur,
|
|
2574
2559
|
onFocus: onFocus,
|
|
2575
2560
|
registry: registry,
|
|
@@ -2580,50 +2565,50 @@ function DateElement(_ref) {
|
|
|
2580
2565
|
* @param props - The `WidgetProps` for this component
|
|
2581
2566
|
*/
|
|
2582
2567
|
function AltDateWidget(_ref2) {
|
|
2583
|
-
|
|
2584
|
-
time = false,
|
|
2585
|
-
disabled =
|
|
2586
|
-
|
|
2587
|
-
|
|
2588
|
-
|
|
2589
|
-
|
|
2590
|
-
|
|
2591
|
-
|
|
2592
|
-
|
|
2593
|
-
|
|
2594
|
-
|
|
2595
|
-
|
|
2596
|
-
|
|
2597
|
-
|
|
2598
|
-
|
|
2599
|
-
|
|
2600
|
-
}
|
|
2601
|
-
|
|
2602
|
-
|
|
2568
|
+
var _ref2$time = _ref2.time,
|
|
2569
|
+
time = _ref2$time === void 0 ? false : _ref2$time,
|
|
2570
|
+
_ref2$disabled = _ref2.disabled,
|
|
2571
|
+
disabled = _ref2$disabled === void 0 ? false : _ref2$disabled,
|
|
2572
|
+
_ref2$readonly = _ref2.readonly,
|
|
2573
|
+
readonly = _ref2$readonly === void 0 ? false : _ref2$readonly,
|
|
2574
|
+
_ref2$autofocus = _ref2.autofocus,
|
|
2575
|
+
autofocus = _ref2$autofocus === void 0 ? false : _ref2$autofocus,
|
|
2576
|
+
options = _ref2.options,
|
|
2577
|
+
id = _ref2.id,
|
|
2578
|
+
registry = _ref2.registry,
|
|
2579
|
+
onBlur = _ref2.onBlur,
|
|
2580
|
+
onFocus = _ref2.onFocus,
|
|
2581
|
+
onChange = _ref2.onChange,
|
|
2582
|
+
value = _ref2.value;
|
|
2583
|
+
var _useReducer = React.useReducer(function (state, action) {
|
|
2584
|
+
return _extends({}, state, action);
|
|
2585
|
+
}, utils.parseDateString(value, time)),
|
|
2586
|
+
state = _useReducer[0],
|
|
2587
|
+
setState = _useReducer[1];
|
|
2588
|
+
React.useEffect(function () {
|
|
2603
2589
|
if (value && value !== utils.toDateString(state, time)) {
|
|
2604
2590
|
setState(utils.parseDateString(value, time));
|
|
2605
2591
|
}
|
|
2606
2592
|
}, [value, state, time]);
|
|
2607
|
-
React.useEffect(()
|
|
2593
|
+
React.useEffect(function () {
|
|
2608
2594
|
if (readyForChange(state)) {
|
|
2609
2595
|
// Only propagate to parent state if we have a complete date{time}
|
|
2610
2596
|
onChange(utils.toDateString(state, time));
|
|
2611
2597
|
}
|
|
2612
2598
|
}, [state, time, onChange]);
|
|
2613
|
-
|
|
2614
|
-
|
|
2615
|
-
|
|
2616
|
-
});
|
|
2599
|
+
var handleChange = React.useCallback(function (property, value) {
|
|
2600
|
+
var _setState;
|
|
2601
|
+
setState((_setState = {}, _setState[property] = value, _setState));
|
|
2617
2602
|
}, []);
|
|
2618
|
-
|
|
2603
|
+
var handleSetNow = React.useCallback(function (event) {
|
|
2619
2604
|
event.preventDefault();
|
|
2620
2605
|
if (disabled || readonly) {
|
|
2621
2606
|
return;
|
|
2622
2607
|
}
|
|
2623
|
-
|
|
2608
|
+
var nowDateObj = utils.parseDateString(new Date().toJSON(), time);
|
|
2624
2609
|
setState(nowDateObj);
|
|
2625
2610
|
}, [disabled, readonly, time]);
|
|
2626
|
-
|
|
2611
|
+
var handleClear = React.useCallback(function (event) {
|
|
2627
2612
|
event.preventDefault();
|
|
2628
2613
|
if (disabled || readonly) {
|
|
2629
2614
|
return;
|
|
@@ -2633,19 +2618,21 @@ function AltDateWidget(_ref2) {
|
|
|
2633
2618
|
}, [disabled, readonly, time, onChange]);
|
|
2634
2619
|
return /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
2635
2620
|
className: "list-inline"
|
|
2636
|
-
}, dateElementProps(state, time, options.yearsRange).map((elemProps, i)
|
|
2637
|
-
|
|
2638
|
-
|
|
2639
|
-
|
|
2640
|
-
|
|
2641
|
-
|
|
2642
|
-
|
|
2643
|
-
|
|
2644
|
-
|
|
2645
|
-
|
|
2646
|
-
|
|
2647
|
-
|
|
2648
|
-
|
|
2621
|
+
}, dateElementProps(state, time, options.yearsRange).map(function (elemProps, i) {
|
|
2622
|
+
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
2623
|
+
key: i
|
|
2624
|
+
}, /*#__PURE__*/React__default["default"].createElement(DateElement, _extends({
|
|
2625
|
+
rootId: id,
|
|
2626
|
+
select: handleChange
|
|
2627
|
+
}, elemProps, {
|
|
2628
|
+
disabled: disabled,
|
|
2629
|
+
readonly: readonly,
|
|
2630
|
+
registry: registry,
|
|
2631
|
+
onBlur: onBlur,
|
|
2632
|
+
onFocus: onFocus,
|
|
2633
|
+
autofocus: autofocus && i === 0
|
|
2634
|
+
})));
|
|
2635
|
+
}), (options.hideNowButton !== "undefined" ? !options.hideNowButton : true) && /*#__PURE__*/React__default["default"].createElement("li", null, /*#__PURE__*/React__default["default"].createElement("a", {
|
|
2649
2636
|
href: "#",
|
|
2650
2637
|
className: "btn btn-info btn-now",
|
|
2651
2638
|
onClick: handleSetNow
|
|
@@ -2656,23 +2643,20 @@ function AltDateWidget(_ref2) {
|
|
|
2656
2643
|
}, "Clear")));
|
|
2657
2644
|
}
|
|
2658
2645
|
|
|
2646
|
+
var _excluded$1 = ["time"];
|
|
2659
2647
|
/** The `AltDateTimeWidget` is an alternative widget for rendering datetime properties.
|
|
2660
2648
|
* It uses the AltDateWidget for rendering, with the `time` prop set to true by default.
|
|
2661
2649
|
*
|
|
2662
2650
|
* @param props - The `WidgetProps` for this component
|
|
2663
2651
|
*/
|
|
2664
2652
|
function AltDateTimeWidget(_ref) {
|
|
2665
|
-
|
|
2666
|
-
time = true,
|
|
2667
|
-
|
|
2668
|
-
|
|
2669
|
-
|
|
2670
|
-
|
|
2671
|
-
}
|
|
2672
|
-
return /*#__PURE__*/React__default["default"].createElement(AltDateWidget, {
|
|
2673
|
-
time: time,
|
|
2674
|
-
...props
|
|
2675
|
-
});
|
|
2653
|
+
var _ref$time = _ref.time,
|
|
2654
|
+
time = _ref$time === void 0 ? true : _ref$time,
|
|
2655
|
+
props = _objectWithoutPropertiesLoose(_ref, _excluded$1);
|
|
2656
|
+
var AltDateWidget = props.registry.widgets.AltDateWidget;
|
|
2657
|
+
return /*#__PURE__*/React__default["default"].createElement(AltDateWidget, _extends({
|
|
2658
|
+
time: time
|
|
2659
|
+
}, props));
|
|
2676
2660
|
}
|
|
2677
2661
|
|
|
2678
2662
|
/** The `CheckBoxWidget` is a widget for rendering boolean properties.
|
|
@@ -2681,31 +2665,36 @@ function AltDateTimeWidget(_ref) {
|
|
|
2681
2665
|
* @param props - The `WidgetProps` for this component
|
|
2682
2666
|
*/
|
|
2683
2667
|
function CheckboxWidget(_ref) {
|
|
2684
|
-
|
|
2685
|
-
|
|
2686
|
-
|
|
2687
|
-
|
|
2688
|
-
|
|
2689
|
-
|
|
2690
|
-
|
|
2691
|
-
|
|
2692
|
-
|
|
2693
|
-
autofocus = false,
|
|
2694
|
-
onBlur,
|
|
2695
|
-
onFocus,
|
|
2696
|
-
onChange,
|
|
2697
|
-
registry
|
|
2698
|
-
|
|
2699
|
-
const DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, options);
|
|
2668
|
+
var schema = _ref.schema,
|
|
2669
|
+
uiSchema = _ref.uiSchema,
|
|
2670
|
+
options = _ref.options,
|
|
2671
|
+
id = _ref.id,
|
|
2672
|
+
value = _ref.value,
|
|
2673
|
+
disabled = _ref.disabled,
|
|
2674
|
+
readonly = _ref.readonly,
|
|
2675
|
+
label = _ref.label,
|
|
2676
|
+
_ref$autofocus = _ref.autofocus,
|
|
2677
|
+
autofocus = _ref$autofocus === void 0 ? false : _ref$autofocus,
|
|
2678
|
+
onBlur = _ref.onBlur,
|
|
2679
|
+
onFocus = _ref.onFocus,
|
|
2680
|
+
onChange = _ref.onChange,
|
|
2681
|
+
registry = _ref.registry;
|
|
2682
|
+
var DescriptionFieldTemplate = utils.getTemplate("DescriptionFieldTemplate", registry, options);
|
|
2700
2683
|
// Because an unchecked checkbox will cause html5 validation to fail, only add
|
|
2701
2684
|
// the "required" attribute if the field value must be "true", due to the
|
|
2702
2685
|
// "const" or "enum" keywords
|
|
2703
|
-
|
|
2704
|
-
|
|
2705
|
-
|
|
2706
|
-
|
|
2686
|
+
var required = utils.schemaRequiresTrueValue(schema);
|
|
2687
|
+
var handleChange = React.useCallback(function (event) {
|
|
2688
|
+
return onChange(event.target.checked);
|
|
2689
|
+
}, [onChange]);
|
|
2690
|
+
var handleBlur = React.useCallback(function (event) {
|
|
2691
|
+
return onBlur(id, event.target.checked);
|
|
2692
|
+
}, [onBlur, id]);
|
|
2693
|
+
var handleFocus = React.useCallback(function (event) {
|
|
2694
|
+
return onFocus(id, event.target.checked);
|
|
2695
|
+
}, [onFocus, id]);
|
|
2707
2696
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2708
|
-
className:
|
|
2697
|
+
className: "checkbox " + (disabled || readonly ? "disabled" : "")
|
|
2709
2698
|
}, schema.description && /*#__PURE__*/React__default["default"].createElement(DescriptionFieldTemplate, {
|
|
2710
2699
|
id: id + "__description",
|
|
2711
2700
|
description: schema.description,
|
|
@@ -2727,14 +2716,18 @@ function CheckboxWidget(_ref) {
|
|
|
2727
2716
|
}
|
|
2728
2717
|
|
|
2729
2718
|
function selectValue(value, selected, all) {
|
|
2730
|
-
|
|
2731
|
-
|
|
2719
|
+
var at = all.indexOf(value);
|
|
2720
|
+
var updated = selected.slice(0, at).concat(value, selected.slice(at));
|
|
2732
2721
|
// As inserting values at predefined index positions doesn't work with empty
|
|
2733
2722
|
// arrays, we need to reorder the updated selection to match the initial order
|
|
2734
|
-
return updated.sort((a, b)
|
|
2723
|
+
return updated.sort(function (a, b) {
|
|
2724
|
+
return Number(all.indexOf(a) > all.indexOf(b));
|
|
2725
|
+
});
|
|
2735
2726
|
}
|
|
2736
2727
|
function deselectValue(value, selected) {
|
|
2737
|
-
return selected.filter(
|
|
2728
|
+
return selected.filter(function (v) {
|
|
2729
|
+
return v !== value;
|
|
2730
|
+
});
|
|
2738
2731
|
}
|
|
2739
2732
|
/** The `CheckboxesWidget` is a widget for rendering checkbox groups.
|
|
2740
2733
|
* It is typically used to represent an array of enums.
|
|
@@ -2742,31 +2735,28 @@ function deselectValue(value, selected) {
|
|
|
2742
2735
|
* @param props - The `WidgetProps` for this component
|
|
2743
2736
|
*/
|
|
2744
2737
|
function CheckboxesWidget(_ref) {
|
|
2745
|
-
|
|
2746
|
-
|
|
2747
|
-
|
|
2748
|
-
options
|
|
2749
|
-
|
|
2750
|
-
|
|
2751
|
-
|
|
2752
|
-
|
|
2753
|
-
|
|
2754
|
-
autofocus = false,
|
|
2755
|
-
readonly,
|
|
2756
|
-
onChange
|
|
2757
|
-
} = _ref;
|
|
2738
|
+
var id = _ref.id,
|
|
2739
|
+
disabled = _ref.disabled,
|
|
2740
|
+
_ref$options = _ref.options,
|
|
2741
|
+
_ref$options$inline = _ref$options.inline,
|
|
2742
|
+
inline = _ref$options$inline === void 0 ? false : _ref$options$inline,
|
|
2743
|
+
enumOptions = _ref$options.enumOptions,
|
|
2744
|
+
enumDisabled = _ref$options.enumDisabled,
|
|
2745
|
+
value = _ref.value,
|
|
2746
|
+
_ref$autofocus = _ref.autofocus,
|
|
2747
|
+
autofocus = _ref$autofocus === void 0 ? false : _ref$autofocus,
|
|
2748
|
+
readonly = _ref.readonly,
|
|
2749
|
+
onChange = _ref.onChange;
|
|
2758
2750
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2759
2751
|
className: "checkboxes",
|
|
2760
2752
|
id: id
|
|
2761
|
-
}, Array.isArray(enumOptions) && enumOptions.map((option, index)
|
|
2762
|
-
|
|
2763
|
-
|
|
2764
|
-
|
|
2765
|
-
|
|
2766
|
-
|
|
2767
|
-
|
|
2768
|
-
value
|
|
2769
|
-
} = _ref2;
|
|
2753
|
+
}, Array.isArray(enumOptions) && enumOptions.map(function (option, index) {
|
|
2754
|
+
var checked = value.indexOf(option.value) !== -1;
|
|
2755
|
+
var itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) != -1;
|
|
2756
|
+
var disabledCls = disabled || itemDisabled || readonly ? "disabled" : "";
|
|
2757
|
+
var handleChange = function handleChange(event) {
|
|
2758
|
+
var all = enumOptions.map(function (_ref2) {
|
|
2759
|
+
var value = _ref2.value;
|
|
2770
2760
|
return value;
|
|
2771
2761
|
});
|
|
2772
2762
|
if (event.target.checked) {
|
|
@@ -2775,9 +2765,9 @@ function CheckboxesWidget(_ref) {
|
|
|
2775
2765
|
onChange(deselectValue(option.value, value));
|
|
2776
2766
|
}
|
|
2777
2767
|
};
|
|
2778
|
-
|
|
2768
|
+
var checkbox = /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement("input", {
|
|
2779
2769
|
type: "checkbox",
|
|
2780
|
-
id:
|
|
2770
|
+
id: id + "-" + option.value,
|
|
2781
2771
|
name: id,
|
|
2782
2772
|
checked: checked,
|
|
2783
2773
|
disabled: disabled || itemDisabled || readonly,
|
|
@@ -2786,10 +2776,10 @@ function CheckboxesWidget(_ref) {
|
|
|
2786
2776
|
}), /*#__PURE__*/React__default["default"].createElement("span", null, option.label));
|
|
2787
2777
|
return inline ? /*#__PURE__*/React__default["default"].createElement("label", {
|
|
2788
2778
|
key: option.value,
|
|
2789
|
-
className:
|
|
2779
|
+
className: "checkbox-inline " + disabledCls
|
|
2790
2780
|
}, checkbox) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
2791
2781
|
key: option.value,
|
|
2792
|
-
className:
|
|
2782
|
+
className: "checkbox " + disabledCls
|
|
2793
2783
|
}, /*#__PURE__*/React__default["default"].createElement("label", null, checkbox));
|
|
2794
2784
|
}));
|
|
2795
2785
|
}
|
|
@@ -2800,18 +2790,16 @@ function CheckboxesWidget(_ref) {
|
|
|
2800
2790
|
* @param props - The `WidgetProps` for this component
|
|
2801
2791
|
*/
|
|
2802
2792
|
function ColorWidget(props) {
|
|
2803
|
-
|
|
2804
|
-
|
|
2805
|
-
|
|
2806
|
-
|
|
2807
|
-
|
|
2808
|
-
|
|
2809
|
-
|
|
2810
|
-
|
|
2811
|
-
type: "color",
|
|
2812
|
-
...props,
|
|
2793
|
+
var disabled = props.disabled,
|
|
2794
|
+
readonly = props.readonly,
|
|
2795
|
+
options = props.options,
|
|
2796
|
+
registry = props.registry;
|
|
2797
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
2798
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
2799
|
+
type: "color"
|
|
2800
|
+
}, props, {
|
|
2813
2801
|
disabled: disabled || readonly
|
|
2814
|
-
});
|
|
2802
|
+
}));
|
|
2815
2803
|
}
|
|
2816
2804
|
|
|
2817
2805
|
/** The `DateWidget` component uses the `BaseInputTemplate` changing the type to `date` and transforms
|
|
@@ -2820,18 +2808,18 @@ function ColorWidget(props) {
|
|
|
2820
2808
|
* @param props - The `WidgetProps` for this component
|
|
2821
2809
|
*/
|
|
2822
2810
|
function DateWidget(props) {
|
|
2823
|
-
|
|
2824
|
-
|
|
2825
|
-
|
|
2826
|
-
|
|
2827
|
-
|
|
2828
|
-
|
|
2829
|
-
|
|
2830
|
-
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, {
|
|
2831
|
-
type: "date"
|
|
2832
|
-
|
|
2811
|
+
var onChange = props.onChange,
|
|
2812
|
+
options = props.options,
|
|
2813
|
+
registry = props.registry;
|
|
2814
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
2815
|
+
var handleChange = React.useCallback(function (value) {
|
|
2816
|
+
return onChange(value || undefined);
|
|
2817
|
+
}, [onChange]);
|
|
2818
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
2819
|
+
type: "date"
|
|
2820
|
+
}, props, {
|
|
2833
2821
|
onChange: handleChange
|
|
2834
|
-
});
|
|
2822
|
+
}));
|
|
2835
2823
|
}
|
|
2836
2824
|
|
|
2837
2825
|
/** The `DateTimeWidget` component uses the `BaseInputTemplate` changing the type to `datetime-local` and transforms
|
|
@@ -2840,19 +2828,19 @@ function DateWidget(props) {
|
|
|
2840
2828
|
* @param props - The `WidgetProps` for this component
|
|
2841
2829
|
*/
|
|
2842
2830
|
function DateTimeWidget(props) {
|
|
2843
|
-
|
|
2844
|
-
|
|
2845
|
-
|
|
2846
|
-
|
|
2847
|
-
|
|
2848
|
-
|
|
2849
|
-
|
|
2850
|
-
|
|
2851
|
-
type: "datetime-local",
|
|
2852
|
-
...props,
|
|
2831
|
+
var _onChange = props.onChange,
|
|
2832
|
+
value = props.value,
|
|
2833
|
+
options = props.options,
|
|
2834
|
+
registry = props.registry;
|
|
2835
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
2836
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
2837
|
+
type: "datetime-local"
|
|
2838
|
+
}, props, {
|
|
2853
2839
|
value: utils.utcToLocal(value),
|
|
2854
|
-
onChange:
|
|
2855
|
-
|
|
2840
|
+
onChange: function onChange(value) {
|
|
2841
|
+
return _onChange(utils.localToUTC(value));
|
|
2842
|
+
}
|
|
2843
|
+
}));
|
|
2856
2844
|
}
|
|
2857
2845
|
|
|
2858
2846
|
/** The `EmailWidget` component uses the `BaseInputTemplate` changing the type to `email`.
|
|
@@ -2860,47 +2848,42 @@ function DateTimeWidget(props) {
|
|
|
2860
2848
|
* @param props - The `WidgetProps` for this component
|
|
2861
2849
|
*/
|
|
2862
2850
|
function EmailWidget(props) {
|
|
2863
|
-
|
|
2864
|
-
|
|
2865
|
-
|
|
2866
|
-
|
|
2867
|
-
|
|
2868
|
-
|
|
2869
|
-
type: "email",
|
|
2870
|
-
...props
|
|
2871
|
-
});
|
|
2851
|
+
var options = props.options,
|
|
2852
|
+
registry = props.registry;
|
|
2853
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
2854
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
2855
|
+
type: "email"
|
|
2856
|
+
}, props));
|
|
2872
2857
|
}
|
|
2873
2858
|
|
|
2874
2859
|
function addNameToDataURL(dataURL, name) {
|
|
2875
2860
|
if (dataURL === null) {
|
|
2876
2861
|
return null;
|
|
2877
2862
|
}
|
|
2878
|
-
return dataURL.replace(";base64",
|
|
2863
|
+
return dataURL.replace(";base64", ";name=" + encodeURIComponent(name) + ";base64");
|
|
2879
2864
|
}
|
|
2880
2865
|
function processFile(file) {
|
|
2881
|
-
|
|
2882
|
-
|
|
2883
|
-
|
|
2884
|
-
|
|
2885
|
-
|
|
2886
|
-
return new Promise((resolve, reject) => {
|
|
2887
|
-
const reader = new window.FileReader();
|
|
2866
|
+
var name = file.name,
|
|
2867
|
+
size = file.size,
|
|
2868
|
+
type = file.type;
|
|
2869
|
+
return new Promise(function (resolve, reject) {
|
|
2870
|
+
var reader = new window.FileReader();
|
|
2888
2871
|
reader.onerror = reject;
|
|
2889
|
-
reader.onload = event
|
|
2872
|
+
reader.onload = function (event) {
|
|
2890
2873
|
var _event$target;
|
|
2891
2874
|
if (typeof ((_event$target = event.target) === null || _event$target === void 0 ? void 0 : _event$target.result) === "string") {
|
|
2892
2875
|
resolve({
|
|
2893
2876
|
dataURL: addNameToDataURL(event.target.result, name),
|
|
2894
|
-
name,
|
|
2895
|
-
size,
|
|
2896
|
-
type
|
|
2877
|
+
name: name,
|
|
2878
|
+
size: size,
|
|
2879
|
+
type: type
|
|
2897
2880
|
});
|
|
2898
2881
|
} else {
|
|
2899
2882
|
resolve({
|
|
2900
2883
|
dataURL: null,
|
|
2901
|
-
name,
|
|
2902
|
-
size,
|
|
2903
|
-
type
|
|
2884
|
+
name: name,
|
|
2885
|
+
size: size,
|
|
2886
|
+
type: type
|
|
2904
2887
|
});
|
|
2905
2888
|
}
|
|
2906
2889
|
};
|
|
@@ -2911,31 +2894,28 @@ function processFiles(files) {
|
|
|
2911
2894
|
return Promise.all(Array.from(files).map(processFile));
|
|
2912
2895
|
}
|
|
2913
2896
|
function FilesInfo(_ref) {
|
|
2914
|
-
|
|
2915
|
-
filesInfo
|
|
2916
|
-
} = _ref;
|
|
2897
|
+
var filesInfo = _ref.filesInfo;
|
|
2917
2898
|
if (filesInfo.length === 0) {
|
|
2918
2899
|
return null;
|
|
2919
2900
|
}
|
|
2920
2901
|
return /*#__PURE__*/React__default["default"].createElement("ul", {
|
|
2921
2902
|
className: "file-info"
|
|
2922
|
-
}, filesInfo.map((fileInfo, key)
|
|
2923
|
-
|
|
2924
|
-
|
|
2925
|
-
|
|
2926
|
-
type
|
|
2927
|
-
} = fileInfo;
|
|
2903
|
+
}, filesInfo.map(function (fileInfo, key) {
|
|
2904
|
+
var name = fileInfo.name,
|
|
2905
|
+
size = fileInfo.size,
|
|
2906
|
+
type = fileInfo.type;
|
|
2928
2907
|
return /*#__PURE__*/React__default["default"].createElement("li", {
|
|
2929
2908
|
key: key
|
|
2930
2909
|
}, /*#__PURE__*/React__default["default"].createElement("strong", null, name), " (", type, ", ", size, " bytes)");
|
|
2931
2910
|
}));
|
|
2932
2911
|
}
|
|
2933
2912
|
function extractFileInfo(dataURLs) {
|
|
2934
|
-
return dataURLs.filter(
|
|
2935
|
-
|
|
2936
|
-
|
|
2937
|
-
|
|
2938
|
-
|
|
2913
|
+
return dataURLs.filter(function (dataURL) {
|
|
2914
|
+
return typeof dataURL !== "undefined";
|
|
2915
|
+
}).map(function (dataURL) {
|
|
2916
|
+
var _dataURItoBlob = utils.dataURItoBlob(dataURL),
|
|
2917
|
+
blob = _dataURItoBlob.blob,
|
|
2918
|
+
name = _dataURItoBlob.name;
|
|
2939
2919
|
return {
|
|
2940
2920
|
name: name,
|
|
2941
2921
|
size: blob.size,
|
|
@@ -2948,25 +2928,30 @@ function extractFileInfo(dataURLs) {
|
|
|
2948
2928
|
* It is typically used with a string property with data-url format.
|
|
2949
2929
|
*/
|
|
2950
2930
|
function FileWidget(_ref2) {
|
|
2951
|
-
|
|
2952
|
-
|
|
2953
|
-
|
|
2954
|
-
|
|
2955
|
-
|
|
2956
|
-
|
|
2957
|
-
|
|
2958
|
-
autofocus = false,
|
|
2959
|
-
options
|
|
2960
|
-
|
|
2961
|
-
|
|
2962
|
-
|
|
2963
|
-
|
|
2931
|
+
var multiple = _ref2.multiple,
|
|
2932
|
+
id = _ref2.id,
|
|
2933
|
+
readonly = _ref2.readonly,
|
|
2934
|
+
disabled = _ref2.disabled,
|
|
2935
|
+
onChange = _ref2.onChange,
|
|
2936
|
+
value = _ref2.value,
|
|
2937
|
+
_ref2$autofocus = _ref2.autofocus,
|
|
2938
|
+
autofocus = _ref2$autofocus === void 0 ? false : _ref2$autofocus,
|
|
2939
|
+
options = _ref2.options;
|
|
2940
|
+
var extractedFilesInfo = React.useMemo(function () {
|
|
2941
|
+
return Array.isArray(value) ? extractFileInfo(value) : extractFileInfo([value]);
|
|
2942
|
+
}, [value]);
|
|
2943
|
+
var _useState = React.useState(extractedFilesInfo),
|
|
2944
|
+
filesInfo = _useState[0],
|
|
2945
|
+
setFilesInfo = _useState[1];
|
|
2946
|
+
var handleChange = React.useCallback(function (event) {
|
|
2964
2947
|
if (!event.target.files) {
|
|
2965
2948
|
return;
|
|
2966
2949
|
}
|
|
2967
|
-
processFiles(event.target.files).then(filesInfoEvent
|
|
2950
|
+
processFiles(event.target.files).then(function (filesInfoEvent) {
|
|
2968
2951
|
setFilesInfo(filesInfoEvent);
|
|
2969
|
-
|
|
2952
|
+
var newValue = filesInfoEvent.map(function (fileInfo) {
|
|
2953
|
+
return fileInfo.dataURL;
|
|
2954
|
+
});
|
|
2970
2955
|
if (multiple) {
|
|
2971
2956
|
onChange(newValue);
|
|
2972
2957
|
} else {
|
|
@@ -2995,10 +2980,8 @@ function FileWidget(_ref2) {
|
|
|
2995
2980
|
* @param props - The `WidgetProps` for this component
|
|
2996
2981
|
*/
|
|
2997
2982
|
function HiddenWidget(_ref) {
|
|
2998
|
-
|
|
2999
|
-
|
|
3000
|
-
value
|
|
3001
|
-
} = _ref;
|
|
2983
|
+
var id = _ref.id,
|
|
2984
|
+
value = _ref.value;
|
|
3002
2985
|
return /*#__PURE__*/React__default["default"].createElement("input", {
|
|
3003
2986
|
type: "hidden",
|
|
3004
2987
|
id: id,
|
|
@@ -3012,15 +2995,12 @@ function HiddenWidget(_ref) {
|
|
|
3012
2995
|
* @param props - The `WidgetProps` for this component
|
|
3013
2996
|
*/
|
|
3014
2997
|
function PasswordWidget(props) {
|
|
3015
|
-
|
|
3016
|
-
|
|
3017
|
-
|
|
3018
|
-
|
|
3019
|
-
|
|
3020
|
-
|
|
3021
|
-
type: "password",
|
|
3022
|
-
...props
|
|
3023
|
-
});
|
|
2998
|
+
var options = props.options,
|
|
2999
|
+
registry = props.registry;
|
|
3000
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
3001
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
3002
|
+
type: "password"
|
|
3003
|
+
}, props));
|
|
3024
3004
|
}
|
|
3025
3005
|
|
|
3026
3006
|
/** The `RadioWidget` is a widget for rendering a radio group.
|
|
@@ -3029,40 +3009,43 @@ function PasswordWidget(props) {
|
|
|
3029
3009
|
* @param props - The `WidgetProps` for this component
|
|
3030
3010
|
*/
|
|
3031
3011
|
function RadioWidget(_ref) {
|
|
3032
|
-
|
|
3033
|
-
|
|
3034
|
-
|
|
3035
|
-
|
|
3036
|
-
|
|
3037
|
-
|
|
3038
|
-
autofocus = false,
|
|
3039
|
-
onBlur,
|
|
3040
|
-
onFocus,
|
|
3041
|
-
onChange,
|
|
3042
|
-
id
|
|
3043
|
-
} = _ref;
|
|
3012
|
+
var options = _ref.options,
|
|
3013
|
+
value = _ref.value,
|
|
3014
|
+
required = _ref.required,
|
|
3015
|
+
disabled = _ref.disabled,
|
|
3016
|
+
readonly = _ref.readonly,
|
|
3017
|
+
_ref$autofocus = _ref.autofocus,
|
|
3018
|
+
autofocus = _ref$autofocus === void 0 ? false : _ref$autofocus,
|
|
3019
|
+
onBlur = _ref.onBlur,
|
|
3020
|
+
onFocus = _ref.onFocus,
|
|
3021
|
+
onChange = _ref.onChange,
|
|
3022
|
+
id = _ref.id;
|
|
3044
3023
|
// Generating a unique field name to identify this set of radio buttons
|
|
3045
|
-
|
|
3046
|
-
|
|
3047
|
-
|
|
3048
|
-
|
|
3049
|
-
inline
|
|
3050
|
-
} = options;
|
|
3024
|
+
var name = Math.random().toString();
|
|
3025
|
+
var enumOptions = options.enumOptions,
|
|
3026
|
+
enumDisabled = options.enumDisabled,
|
|
3027
|
+
inline = options.inline;
|
|
3051
3028
|
// checked={checked} has been moved above name={name}, As mentioned in #349;
|
|
3052
3029
|
// this is a temporary fix for radio button rendering bug in React, facebook/react#7630.
|
|
3053
|
-
|
|
3054
|
-
|
|
3030
|
+
var handleBlur = React.useCallback(function (event) {
|
|
3031
|
+
return onBlur(id, event.target.value);
|
|
3032
|
+
}, [onBlur, id]);
|
|
3033
|
+
var handleFocus = React.useCallback(function (event) {
|
|
3034
|
+
return onFocus(id, event.target.value);
|
|
3035
|
+
}, [onFocus, id]);
|
|
3055
3036
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3056
3037
|
className: "field-radio-group",
|
|
3057
3038
|
id: id
|
|
3058
|
-
}, Array.isArray(enumOptions) && enumOptions.map((option, i)
|
|
3059
|
-
|
|
3060
|
-
|
|
3061
|
-
|
|
3062
|
-
|
|
3063
|
-
|
|
3039
|
+
}, Array.isArray(enumOptions) && enumOptions.map(function (option, i) {
|
|
3040
|
+
var checked = option.value === value;
|
|
3041
|
+
var itemDisabled = Array.isArray(enumDisabled) && enumDisabled.indexOf(option.value) != -1;
|
|
3042
|
+
var disabledCls = disabled || itemDisabled || readonly ? "disabled" : "";
|
|
3043
|
+
var handleChange = function handleChange() {
|
|
3044
|
+
return onChange(option.value);
|
|
3045
|
+
};
|
|
3046
|
+
var radio = /*#__PURE__*/React__default["default"].createElement("span", null, /*#__PURE__*/React__default["default"].createElement("input", {
|
|
3064
3047
|
type: "radio",
|
|
3065
|
-
id:
|
|
3048
|
+
id: id + "-" + option.value,
|
|
3066
3049
|
checked: checked,
|
|
3067
3050
|
name: name,
|
|
3068
3051
|
required: required,
|
|
@@ -3075,10 +3058,10 @@ function RadioWidget(_ref) {
|
|
|
3075
3058
|
}), /*#__PURE__*/React__default["default"].createElement("span", null, option.label));
|
|
3076
3059
|
return inline ? /*#__PURE__*/React__default["default"].createElement("label", {
|
|
3077
3060
|
key: option.value,
|
|
3078
|
-
className:
|
|
3061
|
+
className: "radio-inline " + disabledCls
|
|
3079
3062
|
}, radio) : /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3080
3063
|
key: option.value,
|
|
3081
|
-
className:
|
|
3064
|
+
className: "radio " + disabledCls
|
|
3082
3065
|
}, /*#__PURE__*/React__default["default"].createElement("label", null, radio));
|
|
3083
3066
|
}));
|
|
3084
3067
|
}
|
|
@@ -3089,27 +3072,24 @@ function RadioWidget(_ref) {
|
|
|
3089
3072
|
* @param props - The `WidgetProps` for this component
|
|
3090
3073
|
*/
|
|
3091
3074
|
function RangeWidget(props) {
|
|
3092
|
-
|
|
3093
|
-
|
|
3094
|
-
registry: {
|
|
3095
|
-
templates: {
|
|
3096
|
-
BaseInputTemplate
|
|
3097
|
-
}
|
|
3098
|
-
}
|
|
3099
|
-
} = props;
|
|
3075
|
+
var value = props.value,
|
|
3076
|
+
BaseInputTemplate = props.registry.templates.BaseInputTemplate;
|
|
3100
3077
|
return /*#__PURE__*/React__default["default"].createElement("div", {
|
|
3101
3078
|
className: "field-range-wrapper"
|
|
3102
|
-
}, /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, {
|
|
3103
|
-
type: "range"
|
|
3104
|
-
|
|
3105
|
-
}), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3079
|
+
}, /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
3080
|
+
type: "range"
|
|
3081
|
+
}, props)), /*#__PURE__*/React__default["default"].createElement("span", {
|
|
3106
3082
|
className: "range-view"
|
|
3107
3083
|
}, value));
|
|
3108
3084
|
}
|
|
3109
3085
|
|
|
3110
3086
|
function getValue(event, multiple) {
|
|
3111
3087
|
if (multiple) {
|
|
3112
|
-
return Array.from(event.target.options).slice().filter(
|
|
3088
|
+
return Array.from(event.target.options).slice().filter(function (o) {
|
|
3089
|
+
return o.selected;
|
|
3090
|
+
}).map(function (o) {
|
|
3091
|
+
return o.value;
|
|
3092
|
+
});
|
|
3113
3093
|
}
|
|
3114
3094
|
return event.target.value;
|
|
3115
3095
|
}
|
|
@@ -3119,36 +3099,34 @@ function getValue(event, multiple) {
|
|
|
3119
3099
|
* @param props - The `WidgetProps` for this component
|
|
3120
3100
|
*/
|
|
3121
3101
|
function SelectWidget(_ref) {
|
|
3122
|
-
|
|
3123
|
-
|
|
3124
|
-
|
|
3125
|
-
|
|
3126
|
-
|
|
3127
|
-
|
|
3128
|
-
|
|
3129
|
-
|
|
3130
|
-
multiple = false,
|
|
3131
|
-
autofocus =
|
|
3132
|
-
|
|
3133
|
-
|
|
3134
|
-
|
|
3135
|
-
|
|
3136
|
-
|
|
3137
|
-
|
|
3138
|
-
|
|
3139
|
-
|
|
3140
|
-
|
|
3141
|
-
|
|
3142
|
-
const handleFocus = React.useCallback(event => {
|
|
3143
|
-
const newValue = getValue(event, multiple);
|
|
3102
|
+
var schema = _ref.schema,
|
|
3103
|
+
id = _ref.id,
|
|
3104
|
+
options = _ref.options,
|
|
3105
|
+
value = _ref.value,
|
|
3106
|
+
required = _ref.required,
|
|
3107
|
+
disabled = _ref.disabled,
|
|
3108
|
+
readonly = _ref.readonly,
|
|
3109
|
+
_ref$multiple = _ref.multiple,
|
|
3110
|
+
multiple = _ref$multiple === void 0 ? false : _ref$multiple,
|
|
3111
|
+
_ref$autofocus = _ref.autofocus,
|
|
3112
|
+
autofocus = _ref$autofocus === void 0 ? false : _ref$autofocus,
|
|
3113
|
+
onChange = _ref.onChange,
|
|
3114
|
+
onBlur = _ref.onBlur,
|
|
3115
|
+
onFocus = _ref.onFocus,
|
|
3116
|
+
placeholder = _ref.placeholder;
|
|
3117
|
+
var enumOptions = options.enumOptions,
|
|
3118
|
+
enumDisabled = options.enumDisabled;
|
|
3119
|
+
var emptyValue = multiple ? [] : "";
|
|
3120
|
+
var handleFocus = React.useCallback(function (event) {
|
|
3121
|
+
var newValue = getValue(event, multiple);
|
|
3144
3122
|
return onFocus(id, utils.processSelectValue(schema, newValue, options));
|
|
3145
3123
|
}, [onFocus, id, schema, multiple, options]);
|
|
3146
|
-
|
|
3147
|
-
|
|
3124
|
+
var handleBlur = React.useCallback(function (event) {
|
|
3125
|
+
var newValue = getValue(event, multiple);
|
|
3148
3126
|
return onBlur(id, utils.processSelectValue(schema, newValue, options));
|
|
3149
3127
|
}, [onBlur, id, schema, multiple, options]);
|
|
3150
|
-
|
|
3151
|
-
|
|
3128
|
+
var handleChange = React.useCallback(function (event) {
|
|
3129
|
+
var newValue = getValue(event, multiple);
|
|
3152
3130
|
return onChange(utils.processSelectValue(schema, newValue, options));
|
|
3153
3131
|
}, [onChange, schema, multiple, options]);
|
|
3154
3132
|
return /*#__PURE__*/React__default["default"].createElement("select", {
|
|
@@ -3163,14 +3141,12 @@ function SelectWidget(_ref) {
|
|
|
3163
3141
|
onBlur: handleBlur,
|
|
3164
3142
|
onFocus: handleFocus,
|
|
3165
3143
|
onChange: handleChange
|
|
3166
|
-
}, !multiple && schema
|
|
3144
|
+
}, !multiple && schema["default"] === undefined && /*#__PURE__*/React__default["default"].createElement("option", {
|
|
3167
3145
|
value: ""
|
|
3168
|
-
}, placeholder), Array.isArray(enumOptions) && enumOptions.map((_ref2, i)
|
|
3169
|
-
|
|
3170
|
-
|
|
3171
|
-
|
|
3172
|
-
} = _ref2;
|
|
3173
|
-
const disabled = enumDisabled && enumDisabled.indexOf(value) != -1;
|
|
3146
|
+
}, placeholder), Array.isArray(enumOptions) && enumOptions.map(function (_ref2, i) {
|
|
3147
|
+
var value = _ref2.value,
|
|
3148
|
+
label = _ref2.label;
|
|
3149
|
+
var disabled = enumDisabled && enumDisabled.indexOf(value) != -1;
|
|
3174
3150
|
return /*#__PURE__*/React__default["default"].createElement("option", {
|
|
3175
3151
|
key: i,
|
|
3176
3152
|
value: value,
|
|
@@ -3184,41 +3160,29 @@ function SelectWidget(_ref) {
|
|
|
3184
3160
|
* @param props - The `WidgetProps` for this component
|
|
3185
3161
|
*/
|
|
3186
3162
|
function TextareaWidget(_ref) {
|
|
3187
|
-
|
|
3188
|
-
|
|
3189
|
-
options = {},
|
|
3190
|
-
placeholder,
|
|
3191
|
-
value,
|
|
3192
|
-
required,
|
|
3193
|
-
disabled,
|
|
3194
|
-
readonly,
|
|
3195
|
-
autofocus =
|
|
3196
|
-
|
|
3197
|
-
|
|
3198
|
-
|
|
3199
|
-
|
|
3200
|
-
|
|
3201
|
-
|
|
3202
|
-
target: {
|
|
3203
|
-
value
|
|
3204
|
-
}
|
|
3205
|
-
} = _ref2;
|
|
3163
|
+
var id = _ref.id,
|
|
3164
|
+
_ref$options = _ref.options,
|
|
3165
|
+
options = _ref$options === void 0 ? {} : _ref$options,
|
|
3166
|
+
placeholder = _ref.placeholder,
|
|
3167
|
+
value = _ref.value,
|
|
3168
|
+
required = _ref.required,
|
|
3169
|
+
disabled = _ref.disabled,
|
|
3170
|
+
readonly = _ref.readonly,
|
|
3171
|
+
_ref$autofocus = _ref.autofocus,
|
|
3172
|
+
autofocus = _ref$autofocus === void 0 ? false : _ref$autofocus,
|
|
3173
|
+
onChange = _ref.onChange,
|
|
3174
|
+
onBlur = _ref.onBlur,
|
|
3175
|
+
onFocus = _ref.onFocus;
|
|
3176
|
+
var handleChange = React.useCallback(function (_ref2) {
|
|
3177
|
+
var value = _ref2.target.value;
|
|
3206
3178
|
return onChange(value === "" ? options.emptyValue : value);
|
|
3207
3179
|
}, [onChange, options.emptyValue]);
|
|
3208
|
-
|
|
3209
|
-
|
|
3210
|
-
target: {
|
|
3211
|
-
value
|
|
3212
|
-
}
|
|
3213
|
-
} = _ref3;
|
|
3180
|
+
var handleBlur = React.useCallback(function (_ref3) {
|
|
3181
|
+
var value = _ref3.target.value;
|
|
3214
3182
|
return onBlur(id, value);
|
|
3215
3183
|
}, [onBlur, id]);
|
|
3216
|
-
|
|
3217
|
-
|
|
3218
|
-
target: {
|
|
3219
|
-
value
|
|
3220
|
-
}
|
|
3221
|
-
} = _ref4;
|
|
3184
|
+
var handleFocus = React.useCallback(function (_ref4) {
|
|
3185
|
+
var value = _ref4.target.value;
|
|
3222
3186
|
return onFocus(id, value);
|
|
3223
3187
|
}, [id, onFocus]);
|
|
3224
3188
|
return /*#__PURE__*/React__default["default"].createElement("textarea", {
|
|
@@ -3247,14 +3211,10 @@ TextareaWidget.defaultProps = {
|
|
|
3247
3211
|
* @param props - The `WidgetProps` for this component
|
|
3248
3212
|
*/
|
|
3249
3213
|
function TextWidget(props) {
|
|
3250
|
-
|
|
3251
|
-
|
|
3252
|
-
|
|
3253
|
-
}
|
|
3254
|
-
const BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
3255
|
-
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, {
|
|
3256
|
-
...props
|
|
3257
|
-
});
|
|
3214
|
+
var options = props.options,
|
|
3215
|
+
registry = props.registry;
|
|
3216
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
3217
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({}, props));
|
|
3258
3218
|
}
|
|
3259
3219
|
|
|
3260
3220
|
/** The `URLWidget` component uses the `BaseInputTemplate` changing the type to `url`.
|
|
@@ -3262,15 +3222,12 @@ function TextWidget(props) {
|
|
|
3262
3222
|
* @param props - The `WidgetProps` for this component
|
|
3263
3223
|
*/
|
|
3264
3224
|
function URLWidget(props) {
|
|
3265
|
-
|
|
3266
|
-
|
|
3267
|
-
|
|
3268
|
-
|
|
3269
|
-
|
|
3270
|
-
|
|
3271
|
-
type: "url",
|
|
3272
|
-
...props
|
|
3273
|
-
});
|
|
3225
|
+
var options = props.options,
|
|
3226
|
+
registry = props.registry;
|
|
3227
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
3228
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
3229
|
+
type: "url"
|
|
3230
|
+
}, props));
|
|
3274
3231
|
}
|
|
3275
3232
|
|
|
3276
3233
|
/** The `UpDownWidget` component uses the `BaseInputTemplate` changing the type to `number`.
|
|
@@ -3278,37 +3235,34 @@ function URLWidget(props) {
|
|
|
3278
3235
|
* @param props - The `WidgetProps` for this component
|
|
3279
3236
|
*/
|
|
3280
3237
|
function UpDownWidget(props) {
|
|
3281
|
-
|
|
3282
|
-
|
|
3283
|
-
|
|
3284
|
-
|
|
3285
|
-
|
|
3286
|
-
|
|
3287
|
-
type: "number",
|
|
3288
|
-
...props
|
|
3289
|
-
});
|
|
3238
|
+
var options = props.options,
|
|
3239
|
+
registry = props.registry;
|
|
3240
|
+
var BaseInputTemplate = utils.getTemplate("BaseInputTemplate", registry, options);
|
|
3241
|
+
return /*#__PURE__*/React__default["default"].createElement(BaseInputTemplate, _extends({
|
|
3242
|
+
type: "number"
|
|
3243
|
+
}, props));
|
|
3290
3244
|
}
|
|
3291
3245
|
|
|
3292
3246
|
function widgets() {
|
|
3293
3247
|
return {
|
|
3294
|
-
PasswordWidget,
|
|
3295
|
-
RadioWidget,
|
|
3296
|
-
UpDownWidget,
|
|
3297
|
-
RangeWidget,
|
|
3298
|
-
SelectWidget,
|
|
3299
|
-
TextWidget,
|
|
3300
|
-
DateWidget,
|
|
3301
|
-
DateTimeWidget,
|
|
3302
|
-
AltDateWidget,
|
|
3303
|
-
AltDateTimeWidget,
|
|
3304
|
-
EmailWidget,
|
|
3305
|
-
URLWidget,
|
|
3306
|
-
TextareaWidget,
|
|
3307
|
-
HiddenWidget,
|
|
3308
|
-
ColorWidget,
|
|
3309
|
-
FileWidget,
|
|
3310
|
-
CheckboxWidget,
|
|
3311
|
-
CheckboxesWidget
|
|
3248
|
+
PasswordWidget: PasswordWidget,
|
|
3249
|
+
RadioWidget: RadioWidget,
|
|
3250
|
+
UpDownWidget: UpDownWidget,
|
|
3251
|
+
RangeWidget: RangeWidget,
|
|
3252
|
+
SelectWidget: SelectWidget,
|
|
3253
|
+
TextWidget: TextWidget,
|
|
3254
|
+
DateWidget: DateWidget,
|
|
3255
|
+
DateTimeWidget: DateTimeWidget,
|
|
3256
|
+
AltDateWidget: AltDateWidget,
|
|
3257
|
+
AltDateTimeWidget: AltDateTimeWidget,
|
|
3258
|
+
EmailWidget: EmailWidget,
|
|
3259
|
+
URLWidget: URLWidget,
|
|
3260
|
+
TextareaWidget: TextareaWidget,
|
|
3261
|
+
HiddenWidget: HiddenWidget,
|
|
3262
|
+
ColorWidget: ColorWidget,
|
|
3263
|
+
FileWidget: FileWidget,
|
|
3264
|
+
CheckboxWidget: CheckboxWidget,
|
|
3265
|
+
CheckboxesWidget: CheckboxesWidget
|
|
3312
3266
|
};
|
|
3313
3267
|
}
|
|
3314
3268
|
|
|
@@ -3327,7 +3281,8 @@ function getDefaultRegistry() {
|
|
|
3327
3281
|
}
|
|
3328
3282
|
|
|
3329
3283
|
/** The `Form` component renders the outer form and all the fields defined in the `schema` */
|
|
3330
|
-
|
|
3284
|
+
var Form = /*#__PURE__*/function (_Component) {
|
|
3285
|
+
_inheritsLoose(Form, _Component);
|
|
3331
3286
|
/** The ref used to hold the `form` element, this needs to be `any` because `tagName` or `_internalFormWrapper` can
|
|
3332
3287
|
* provide any possible type here
|
|
3333
3288
|
*/
|
|
@@ -3338,32 +3293,37 @@ class Form extends React.Component {
|
|
|
3338
3293
|
*
|
|
3339
3294
|
* @param props - The initial props for the `Form`
|
|
3340
3295
|
*/
|
|
3341
|
-
|
|
3342
|
-
|
|
3343
|
-
|
|
3344
|
-
|
|
3296
|
+
function Form(props) {
|
|
3297
|
+
var _this;
|
|
3298
|
+
_this = _Component.call(this, props) || this;
|
|
3299
|
+
_this.formElement = void 0;
|
|
3300
|
+
_this.getUsedFormData = function (formData, fields) {
|
|
3345
3301
|
// For the case of a single input form
|
|
3346
3302
|
if (fields.length === 0 && typeof formData !== "object") {
|
|
3347
3303
|
return formData;
|
|
3348
3304
|
}
|
|
3349
3305
|
// _pick has incorrect type definition, it works with string[][], because lodash/hasIn supports it
|
|
3350
|
-
|
|
3306
|
+
var data = _pick__default["default"](formData, fields);
|
|
3351
3307
|
if (Array.isArray(formData)) {
|
|
3352
|
-
return Object.keys(data).map(
|
|
3308
|
+
return Object.keys(data).map(function (key) {
|
|
3309
|
+
return data[key];
|
|
3310
|
+
});
|
|
3353
3311
|
}
|
|
3354
3312
|
return data;
|
|
3355
3313
|
};
|
|
3356
|
-
|
|
3357
|
-
|
|
3314
|
+
_this.getFieldNames = function (pathSchema, formData) {
|
|
3315
|
+
var getAllPaths = function getAllPaths(_obj, acc, paths) {
|
|
3358
3316
|
if (acc === void 0) {
|
|
3359
3317
|
acc = [];
|
|
3360
3318
|
}
|
|
3361
3319
|
if (paths === void 0) {
|
|
3362
3320
|
paths = [[]];
|
|
3363
3321
|
}
|
|
3364
|
-
Object.keys(_obj).forEach(key
|
|
3322
|
+
Object.keys(_obj).forEach(function (key) {
|
|
3365
3323
|
if (typeof _obj[key] === "object") {
|
|
3366
|
-
|
|
3324
|
+
var newPaths = paths.map(function (path) {
|
|
3325
|
+
return [].concat(path, [key]);
|
|
3326
|
+
});
|
|
3367
3327
|
// If an object is marked with additionalProperties, all its keys are valid
|
|
3368
3328
|
if (_obj[key][utils.RJSF_ADDITONAL_PROPERTIES_FLAG] && _obj[key][utils.NAME_KEY] !== "") {
|
|
3369
3329
|
acc.push(_obj[key][utils.NAME_KEY]);
|
|
@@ -3371,8 +3331,8 @@ class Form extends React.Component {
|
|
|
3371
3331
|
getAllPaths(_obj[key], acc, newPaths);
|
|
3372
3332
|
}
|
|
3373
3333
|
} else if (key === utils.NAME_KEY && _obj[key] !== "") {
|
|
3374
|
-
paths.forEach(path
|
|
3375
|
-
|
|
3334
|
+
paths.forEach(function (path) {
|
|
3335
|
+
var formValue = get__default["default"](formData, path);
|
|
3376
3336
|
// adds path to fieldNames if it points to a value
|
|
3377
3337
|
// or an empty object/array
|
|
3378
3338
|
if (typeof formValue !== "object" || _isEmpty__default["default"](formValue)) {
|
|
@@ -3385,128 +3345,116 @@ class Form extends React.Component {
|
|
|
3385
3345
|
};
|
|
3386
3346
|
return getAllPaths(pathSchema);
|
|
3387
3347
|
};
|
|
3388
|
-
|
|
3389
|
-
|
|
3390
|
-
extraErrors,
|
|
3391
|
-
omitExtraData,
|
|
3392
|
-
liveOmit,
|
|
3393
|
-
noValidate,
|
|
3394
|
-
liveValidate,
|
|
3395
|
-
onChange
|
|
3396
|
-
|
|
3397
|
-
|
|
3398
|
-
|
|
3399
|
-
schema
|
|
3400
|
-
} = this.state;
|
|
3348
|
+
_this.onChange = function (formData, newErrorSchema, id) {
|
|
3349
|
+
var _this$props = _this.props,
|
|
3350
|
+
extraErrors = _this$props.extraErrors,
|
|
3351
|
+
omitExtraData = _this$props.omitExtraData,
|
|
3352
|
+
liveOmit = _this$props.liveOmit,
|
|
3353
|
+
noValidate = _this$props.noValidate,
|
|
3354
|
+
liveValidate = _this$props.liveValidate,
|
|
3355
|
+
onChange = _this$props.onChange;
|
|
3356
|
+
var _this$state = _this.state,
|
|
3357
|
+
schemaUtils = _this$state.schemaUtils,
|
|
3358
|
+
schema = _this$state.schema;
|
|
3401
3359
|
if (utils.isObject(formData) || Array.isArray(formData)) {
|
|
3402
|
-
|
|
3360
|
+
var newState = _this.getStateFromProps(_this.props, formData);
|
|
3403
3361
|
formData = newState.formData;
|
|
3404
3362
|
}
|
|
3405
|
-
|
|
3406
|
-
|
|
3407
|
-
formData,
|
|
3408
|
-
schema
|
|
3363
|
+
var mustValidate = !noValidate && liveValidate;
|
|
3364
|
+
var state = {
|
|
3365
|
+
formData: formData,
|
|
3366
|
+
schema: schema
|
|
3409
3367
|
};
|
|
3410
|
-
|
|
3368
|
+
var newFormData = formData;
|
|
3411
3369
|
if (omitExtraData === true && liveOmit === true) {
|
|
3412
|
-
|
|
3413
|
-
|
|
3414
|
-
|
|
3415
|
-
newFormData =
|
|
3370
|
+
var retrievedSchema = schemaUtils.retrieveSchema(schema, formData);
|
|
3371
|
+
var pathSchema = schemaUtils.toPathSchema(retrievedSchema, "", formData);
|
|
3372
|
+
var fieldNames = _this.getFieldNames(pathSchema, formData);
|
|
3373
|
+
newFormData = _this.getUsedFormData(formData, fieldNames);
|
|
3416
3374
|
state = {
|
|
3417
3375
|
formData: newFormData
|
|
3418
3376
|
};
|
|
3419
3377
|
}
|
|
3420
3378
|
if (mustValidate) {
|
|
3421
|
-
|
|
3422
|
-
|
|
3423
|
-
|
|
3424
|
-
|
|
3425
|
-
|
|
3379
|
+
var schemaValidation = _this.validate(newFormData);
|
|
3380
|
+
var errors = schemaValidation.errors;
|
|
3381
|
+
var errorSchema = schemaValidation.errorSchema;
|
|
3382
|
+
var schemaValidationErrors = errors;
|
|
3383
|
+
var schemaValidationErrorSchema = errorSchema;
|
|
3426
3384
|
if (extraErrors) {
|
|
3427
|
-
|
|
3385
|
+
var merged = schemaUtils.mergeValidationData(schemaValidation, extraErrors);
|
|
3428
3386
|
errorSchema = merged.errorSchema;
|
|
3429
3387
|
errors = merged.errors;
|
|
3430
3388
|
}
|
|
3431
3389
|
state = {
|
|
3432
3390
|
formData: newFormData,
|
|
3433
|
-
errors,
|
|
3434
|
-
errorSchema,
|
|
3435
|
-
schemaValidationErrors,
|
|
3436
|
-
schemaValidationErrorSchema
|
|
3391
|
+
errors: errors,
|
|
3392
|
+
errorSchema: errorSchema,
|
|
3393
|
+
schemaValidationErrors: schemaValidationErrors,
|
|
3394
|
+
schemaValidationErrorSchema: schemaValidationErrorSchema
|
|
3437
3395
|
};
|
|
3438
3396
|
} else if (!noValidate && newErrorSchema) {
|
|
3439
|
-
|
|
3397
|
+
var _errorSchema = extraErrors ? utils.mergeObjects(newErrorSchema, extraErrors, "preventDuplicates") : newErrorSchema;
|
|
3440
3398
|
state = {
|
|
3441
3399
|
formData: newFormData,
|
|
3442
|
-
errorSchema:
|
|
3443
|
-
errors: schemaUtils.getValidator().toErrorList(
|
|
3400
|
+
errorSchema: _errorSchema,
|
|
3401
|
+
errors: schemaUtils.getValidator().toErrorList(_errorSchema)
|
|
3444
3402
|
};
|
|
3445
3403
|
}
|
|
3446
|
-
|
|
3447
|
-
|
|
3448
|
-
|
|
3449
|
-
}, id));
|
|
3404
|
+
_this.setState(state, function () {
|
|
3405
|
+
return onChange && onChange(_extends({}, _this.state, state), id);
|
|
3406
|
+
});
|
|
3450
3407
|
};
|
|
3451
|
-
|
|
3452
|
-
|
|
3453
|
-
onBlur
|
|
3454
|
-
} = this.props;
|
|
3408
|
+
_this.onBlur = function (id, data) {
|
|
3409
|
+
var onBlur = _this.props.onBlur;
|
|
3455
3410
|
if (onBlur) {
|
|
3456
3411
|
onBlur(id, data);
|
|
3457
3412
|
}
|
|
3458
3413
|
};
|
|
3459
|
-
|
|
3460
|
-
|
|
3461
|
-
onFocus
|
|
3462
|
-
} = this.props;
|
|
3414
|
+
_this.onFocus = function (id, data) {
|
|
3415
|
+
var onFocus = _this.props.onFocus;
|
|
3463
3416
|
if (onFocus) {
|
|
3464
3417
|
onFocus(id, data);
|
|
3465
3418
|
}
|
|
3466
3419
|
};
|
|
3467
|
-
|
|
3420
|
+
_this.onSubmit = function (event) {
|
|
3468
3421
|
event.preventDefault();
|
|
3469
3422
|
if (event.target !== event.currentTarget) {
|
|
3470
3423
|
return;
|
|
3471
3424
|
}
|
|
3472
3425
|
event.persist();
|
|
3473
|
-
|
|
3474
|
-
omitExtraData,
|
|
3475
|
-
extraErrors,
|
|
3476
|
-
noValidate,
|
|
3477
|
-
onSubmit
|
|
3478
|
-
|
|
3479
|
-
|
|
3480
|
-
|
|
3481
|
-
|
|
3482
|
-
const {
|
|
3483
|
-
schema,
|
|
3484
|
-
schemaUtils
|
|
3485
|
-
} = this.state;
|
|
3426
|
+
var _this$props2 = _this.props,
|
|
3427
|
+
omitExtraData = _this$props2.omitExtraData,
|
|
3428
|
+
extraErrors = _this$props2.extraErrors,
|
|
3429
|
+
noValidate = _this$props2.noValidate,
|
|
3430
|
+
onSubmit = _this$props2.onSubmit;
|
|
3431
|
+
var newFormData = _this.state.formData;
|
|
3432
|
+
var _this$state2 = _this.state,
|
|
3433
|
+
schema = _this$state2.schema,
|
|
3434
|
+
schemaUtils = _this$state2.schemaUtils;
|
|
3486
3435
|
if (omitExtraData === true) {
|
|
3487
|
-
|
|
3488
|
-
|
|
3489
|
-
|
|
3490
|
-
newFormData =
|
|
3436
|
+
var retrievedSchema = schemaUtils.retrieveSchema(schema, newFormData);
|
|
3437
|
+
var pathSchema = schemaUtils.toPathSchema(retrievedSchema, "", newFormData);
|
|
3438
|
+
var fieldNames = _this.getFieldNames(pathSchema, newFormData);
|
|
3439
|
+
newFormData = _this.getUsedFormData(newFormData, fieldNames);
|
|
3491
3440
|
}
|
|
3492
|
-
if (noValidate ||
|
|
3441
|
+
if (noValidate || _this.validateForm()) {
|
|
3493
3442
|
// There are no errors generated through schema validation.
|
|
3494
3443
|
// Check for user provided errors and update state accordingly.
|
|
3495
|
-
|
|
3496
|
-
|
|
3497
|
-
|
|
3444
|
+
var errorSchema = extraErrors || {};
|
|
3445
|
+
var errors = extraErrors ? schemaUtils.getValidator().toErrorList(extraErrors) : [];
|
|
3446
|
+
_this.setState({
|
|
3498
3447
|
formData: newFormData,
|
|
3499
|
-
errors,
|
|
3500
|
-
errorSchema,
|
|
3448
|
+
errors: errors,
|
|
3449
|
+
errorSchema: errorSchema,
|
|
3501
3450
|
schemaValidationErrors: [],
|
|
3502
3451
|
schemaValidationErrorSchema: {}
|
|
3503
|
-
}, ()
|
|
3452
|
+
}, function () {
|
|
3504
3453
|
if (onSubmit) {
|
|
3505
|
-
onSubmit({
|
|
3506
|
-
...this.state,
|
|
3454
|
+
onSubmit(_extends({}, _this.state, {
|
|
3507
3455
|
formData: newFormData,
|
|
3508
3456
|
status: "submitted"
|
|
3509
|
-
}, event);
|
|
3457
|
+
}), event);
|
|
3510
3458
|
}
|
|
3511
3459
|
});
|
|
3512
3460
|
}
|
|
@@ -3514,11 +3462,12 @@ class Form extends React.Component {
|
|
|
3514
3462
|
if (!props.validator) {
|
|
3515
3463
|
throw new Error("A validator is required for Form functionality to work");
|
|
3516
3464
|
}
|
|
3517
|
-
|
|
3518
|
-
if (
|
|
3519
|
-
|
|
3465
|
+
_this.state = _this.getStateFromProps(props, props.formData);
|
|
3466
|
+
if (_this.props.onChange && !utils.deepEquals(_this.state.formData, _this.props.formData)) {
|
|
3467
|
+
_this.props.onChange(_this.state);
|
|
3520
3468
|
}
|
|
3521
|
-
|
|
3469
|
+
_this.formElement = /*#__PURE__*/React__default["default"].createRef();
|
|
3470
|
+
return _this;
|
|
3522
3471
|
}
|
|
3523
3472
|
/** React lifecycle method that gets called before new props are provided, updates the state based on new props. It
|
|
3524
3473
|
* will also call the`onChange` handler if the `formData` is modified to add missing default values as part of the
|
|
@@ -3526,8 +3475,9 @@ class Form extends React.Component {
|
|
|
3526
3475
|
*
|
|
3527
3476
|
* @param nextProps - The new set of props about to be applied to the `Form`
|
|
3528
3477
|
*/
|
|
3529
|
-
|
|
3530
|
-
|
|
3478
|
+
var _proto = Form.prototype;
|
|
3479
|
+
_proto.UNSAFE_componentWillReceiveProps = function UNSAFE_componentWillReceiveProps(nextProps) {
|
|
3480
|
+
var nextState = this.getStateFromProps(nextProps, nextProps.formData);
|
|
3531
3481
|
if (!utils.deepEquals(nextState.formData, nextProps.formData) && !utils.deepEquals(nextState.formData, this.state.formData) && nextProps.onChange) {
|
|
3532
3482
|
nextProps.onChange(nextState);
|
|
3533
3483
|
}
|
|
@@ -3540,22 +3490,22 @@ class Form extends React.Component {
|
|
|
3540
3490
|
* @param props - The props passed to the `Form`
|
|
3541
3491
|
* @param inputFormData - The new or current data for the `Form`
|
|
3542
3492
|
* @returns - The new state for the `Form`
|
|
3543
|
-
|
|
3544
|
-
getStateFromProps(props, inputFormData) {
|
|
3545
|
-
|
|
3546
|
-
|
|
3547
|
-
|
|
3548
|
-
|
|
3549
|
-
|
|
3550
|
-
|
|
3551
|
-
|
|
3552
|
-
|
|
3493
|
+
*/;
|
|
3494
|
+
_proto.getStateFromProps = function getStateFromProps(props, inputFormData) {
|
|
3495
|
+
var state = this.state || {};
|
|
3496
|
+
var schema = "schema" in props ? props.schema : this.props.schema;
|
|
3497
|
+
var uiSchema = ("uiSchema" in props ? props.uiSchema : this.props.uiSchema) || {};
|
|
3498
|
+
var edit = typeof inputFormData !== "undefined";
|
|
3499
|
+
var liveValidate = "liveValidate" in props ? props.liveValidate : this.props.liveValidate;
|
|
3500
|
+
var mustValidate = edit && !props.noValidate && liveValidate;
|
|
3501
|
+
var rootSchema = schema;
|
|
3502
|
+
var schemaUtils = state.schemaUtils;
|
|
3553
3503
|
if (!schemaUtils || schemaUtils.doesSchemaUtilsDiffer(props.validator, rootSchema)) {
|
|
3554
3504
|
schemaUtils = utils.createSchemaUtils(props.validator, rootSchema);
|
|
3555
3505
|
}
|
|
3556
|
-
|
|
3557
|
-
|
|
3558
|
-
|
|
3506
|
+
var formData = schemaUtils.getDefaultFormState(schema, inputFormData);
|
|
3507
|
+
var retrievedSchema = schemaUtils.retrieveSchema(schema, formData);
|
|
3508
|
+
var getCurrentErrors = function getCurrentErrors() {
|
|
3559
3509
|
if (props.noValidate) {
|
|
3560
3510
|
return {
|
|
3561
3511
|
errors: [],
|
|
@@ -3572,41 +3522,41 @@ class Form extends React.Component {
|
|
|
3572
3522
|
errorSchema: state.errorSchema || {}
|
|
3573
3523
|
};
|
|
3574
3524
|
};
|
|
3575
|
-
|
|
3576
|
-
|
|
3577
|
-
|
|
3578
|
-
|
|
3525
|
+
var errors;
|
|
3526
|
+
var errorSchema;
|
|
3527
|
+
var schemaValidationErrors = state.schemaValidationErrors;
|
|
3528
|
+
var schemaValidationErrorSchema = state.schemaValidationErrorSchema;
|
|
3579
3529
|
if (mustValidate) {
|
|
3580
|
-
|
|
3530
|
+
var schemaValidation = this.validate(formData, schema, schemaUtils);
|
|
3581
3531
|
errors = schemaValidation.errors;
|
|
3582
3532
|
errorSchema = schemaValidation.errorSchema;
|
|
3583
3533
|
schemaValidationErrors = errors;
|
|
3584
3534
|
schemaValidationErrorSchema = errorSchema;
|
|
3585
3535
|
} else {
|
|
3586
|
-
|
|
3536
|
+
var currentErrors = getCurrentErrors();
|
|
3587
3537
|
errors = currentErrors.errors;
|
|
3588
3538
|
errorSchema = currentErrors.errorSchema;
|
|
3589
3539
|
}
|
|
3590
3540
|
if (props.extraErrors) {
|
|
3591
|
-
|
|
3592
|
-
errorSchema,
|
|
3593
|
-
errors
|
|
3541
|
+
var merged = schemaUtils.mergeValidationData({
|
|
3542
|
+
errorSchema: errorSchema,
|
|
3543
|
+
errors: errors
|
|
3594
3544
|
}, props.extraErrors);
|
|
3595
3545
|
errorSchema = merged.errorSchema;
|
|
3596
3546
|
errors = merged.errors;
|
|
3597
3547
|
}
|
|
3598
|
-
|
|
3599
|
-
|
|
3600
|
-
schemaUtils,
|
|
3601
|
-
schema,
|
|
3602
|
-
uiSchema,
|
|
3603
|
-
idSchema,
|
|
3604
|
-
formData,
|
|
3605
|
-
edit,
|
|
3606
|
-
errors,
|
|
3607
|
-
errorSchema,
|
|
3608
|
-
schemaValidationErrors,
|
|
3609
|
-
schemaValidationErrorSchema
|
|
3548
|
+
var idSchema = schemaUtils.toIdSchema(retrievedSchema, uiSchema["ui:rootFieldId"], formData, props.idPrefix, props.idSeparator);
|
|
3549
|
+
var nextState = {
|
|
3550
|
+
schemaUtils: schemaUtils,
|
|
3551
|
+
schema: schema,
|
|
3552
|
+
uiSchema: uiSchema,
|
|
3553
|
+
idSchema: idSchema,
|
|
3554
|
+
formData: formData,
|
|
3555
|
+
edit: edit,
|
|
3556
|
+
errors: errors,
|
|
3557
|
+
errorSchema: errorSchema,
|
|
3558
|
+
schemaValidationErrors: schemaValidationErrors,
|
|
3559
|
+
schemaValidationErrorSchema: schemaValidationErrorSchema
|
|
3610
3560
|
};
|
|
3611
3561
|
return nextState;
|
|
3612
3562
|
}
|
|
@@ -3615,8 +3565,8 @@ class Form extends React.Component {
|
|
|
3615
3565
|
* @param nextProps - The next version of the props
|
|
3616
3566
|
* @param nextState - The next version of the state
|
|
3617
3567
|
* @returns - True if the component should be updated, false otherwise
|
|
3618
|
-
|
|
3619
|
-
shouldComponentUpdate(nextProps, nextState) {
|
|
3568
|
+
*/;
|
|
3569
|
+
_proto.shouldComponentUpdate = function shouldComponentUpdate(nextProps, nextState) {
|
|
3620
3570
|
return utils.shouldRender(this, nextProps, nextState);
|
|
3621
3571
|
}
|
|
3622
3572
|
/** Validates the `formData` against the `schema` using the `altSchemaUtils` (if provided otherwise it uses the
|
|
@@ -3625,32 +3575,28 @@ class Form extends React.Component {
|
|
|
3625
3575
|
* @param formData - The new form data to validate
|
|
3626
3576
|
* @param schema - The schema used to validate against
|
|
3627
3577
|
* @param altSchemaUtils - The alternate schemaUtils to use for validation
|
|
3628
|
-
|
|
3629
|
-
validate(formData, schema, altSchemaUtils) {
|
|
3578
|
+
*/;
|
|
3579
|
+
_proto.validate = function validate(formData, schema, altSchemaUtils) {
|
|
3630
3580
|
if (schema === void 0) {
|
|
3631
3581
|
schema = this.props.schema;
|
|
3632
3582
|
}
|
|
3633
|
-
|
|
3634
|
-
|
|
3635
|
-
customValidate,
|
|
3636
|
-
transformErrors
|
|
3637
|
-
|
|
3638
|
-
const resolvedSchema = schemaUtils.retrieveSchema(schema, formData);
|
|
3583
|
+
var schemaUtils = altSchemaUtils ? altSchemaUtils : this.state.schemaUtils;
|
|
3584
|
+
var _this$props3 = this.props,
|
|
3585
|
+
customValidate = _this$props3.customValidate,
|
|
3586
|
+
transformErrors = _this$props3.transformErrors;
|
|
3587
|
+
var resolvedSchema = schemaUtils.retrieveSchema(schema, formData);
|
|
3639
3588
|
return schemaUtils.getValidator().validateFormData(formData, resolvedSchema, customValidate, transformErrors);
|
|
3640
3589
|
}
|
|
3641
|
-
/** Renders any errors contained in the `state` in using the `ErrorList`, if not disabled by `showErrorList`.
|
|
3642
|
-
renderErrors(registry) {
|
|
3643
|
-
|
|
3644
|
-
errors,
|
|
3645
|
-
errorSchema,
|
|
3646
|
-
schema,
|
|
3647
|
-
uiSchema
|
|
3648
|
-
|
|
3649
|
-
|
|
3650
|
-
|
|
3651
|
-
} = this.props;
|
|
3652
|
-
const options = utils.getUiOptions(uiSchema);
|
|
3653
|
-
const ErrorListTemplate = utils.getTemplate("ErrorListTemplate", registry, options);
|
|
3590
|
+
/** Renders any errors contained in the `state` in using the `ErrorList`, if not disabled by `showErrorList`. */;
|
|
3591
|
+
_proto.renderErrors = function renderErrors(registry) {
|
|
3592
|
+
var _this$state3 = this.state,
|
|
3593
|
+
errors = _this$state3.errors,
|
|
3594
|
+
errorSchema = _this$state3.errorSchema,
|
|
3595
|
+
schema = _this$state3.schema,
|
|
3596
|
+
uiSchema = _this$state3.uiSchema;
|
|
3597
|
+
var formContext = this.props.formContext;
|
|
3598
|
+
var options = utils.getUiOptions(uiSchema);
|
|
3599
|
+
var ErrorListTemplate = utils.getTemplate("ErrorListTemplate", registry, options);
|
|
3654
3600
|
if (errors && errors.length) {
|
|
3655
3601
|
return /*#__PURE__*/React__default["default"].createElement(ErrorListTemplate, {
|
|
3656
3602
|
errors: errors,
|
|
@@ -3666,44 +3612,29 @@ class Form extends React.Component {
|
|
|
3666
3612
|
*
|
|
3667
3613
|
* @param formData - The data for the `Form`
|
|
3668
3614
|
* @param fields - The fields to keep while filtering
|
|
3669
|
-
|
|
3670
|
-
|
|
3615
|
+
*/;
|
|
3671
3616
|
/** Returns the registry for the form */
|
|
3672
|
-
getRegistry() {
|
|
3617
|
+
_proto.getRegistry = function getRegistry() {
|
|
3673
3618
|
var _this$props$templates;
|
|
3674
|
-
|
|
3675
|
-
|
|
3676
|
-
|
|
3677
|
-
|
|
3678
|
-
|
|
3679
|
-
|
|
3680
|
-
widgets,
|
|
3681
|
-
formContext
|
|
3682
|
-
} = getDefaultRegistry();
|
|
3619
|
+
var schemaUtils = this.state.schemaUtils;
|
|
3620
|
+
var _getDefaultRegistry = getDefaultRegistry(),
|
|
3621
|
+
fields = _getDefaultRegistry.fields,
|
|
3622
|
+
templates = _getDefaultRegistry.templates,
|
|
3623
|
+
widgets = _getDefaultRegistry.widgets,
|
|
3624
|
+
formContext = _getDefaultRegistry.formContext;
|
|
3683
3625
|
return {
|
|
3684
|
-
fields: {
|
|
3685
|
-
|
|
3686
|
-
|
|
3687
|
-
},
|
|
3688
|
-
|
|
3689
|
-
...templates,
|
|
3690
|
-
...this.props.templates,
|
|
3691
|
-
ButtonTemplates: {
|
|
3692
|
-
...templates.ButtonTemplates,
|
|
3693
|
-
...((_this$props$templates = this.props.templates) === null || _this$props$templates === void 0 ? void 0 : _this$props$templates.ButtonTemplates)
|
|
3694
|
-
}
|
|
3695
|
-
},
|
|
3696
|
-
widgets: {
|
|
3697
|
-
...widgets,
|
|
3698
|
-
...this.props.widgets
|
|
3699
|
-
},
|
|
3626
|
+
fields: _extends({}, fields, this.props.fields),
|
|
3627
|
+
templates: _extends({}, templates, this.props.templates, {
|
|
3628
|
+
ButtonTemplates: _extends({}, templates.ButtonTemplates, (_this$props$templates = this.props.templates) === null || _this$props$templates === void 0 ? void 0 : _this$props$templates.ButtonTemplates)
|
|
3629
|
+
}),
|
|
3630
|
+
widgets: _extends({}, widgets, this.props.widgets),
|
|
3700
3631
|
rootSchema: this.props.schema,
|
|
3701
3632
|
formContext: this.props.formContext || formContext,
|
|
3702
|
-
schemaUtils
|
|
3633
|
+
schemaUtils: schemaUtils
|
|
3703
3634
|
};
|
|
3704
3635
|
}
|
|
3705
|
-
/** Provides a function that can be used to programmatically submit the `Form`
|
|
3706
|
-
submit() {
|
|
3636
|
+
/** Provides a function that can be used to programmatically submit the `Form` */;
|
|
3637
|
+
_proto.submit = function submit() {
|
|
3707
3638
|
if (this.formElement.current) {
|
|
3708
3639
|
this.formElement.current.dispatchEvent(new CustomEvent("submit", {
|
|
3709
3640
|
cancelable: true
|
|
@@ -3715,35 +3646,30 @@ class Form extends React.Component {
|
|
|
3715
3646
|
* same way as would happen on form submission.
|
|
3716
3647
|
*
|
|
3717
3648
|
* @returns - True if the form is valid, false otherwise.
|
|
3718
|
-
|
|
3719
|
-
validateForm() {
|
|
3720
|
-
|
|
3721
|
-
extraErrors,
|
|
3722
|
-
onError
|
|
3723
|
-
|
|
3724
|
-
|
|
3725
|
-
|
|
3726
|
-
|
|
3727
|
-
|
|
3728
|
-
|
|
3729
|
-
|
|
3730
|
-
const schemaValidation = this.validate(formData);
|
|
3731
|
-
let errors = schemaValidation.errors;
|
|
3732
|
-
let errorSchema = schemaValidation.errorSchema;
|
|
3733
|
-
const schemaValidationErrors = errors;
|
|
3734
|
-
const schemaValidationErrorSchema = errorSchema;
|
|
3649
|
+
*/;
|
|
3650
|
+
_proto.validateForm = function validateForm() {
|
|
3651
|
+
var _this$props4 = this.props,
|
|
3652
|
+
extraErrors = _this$props4.extraErrors,
|
|
3653
|
+
onError = _this$props4.onError;
|
|
3654
|
+
var formData = this.state.formData;
|
|
3655
|
+
var schemaUtils = this.state.schemaUtils;
|
|
3656
|
+
var schemaValidation = this.validate(formData);
|
|
3657
|
+
var errors = schemaValidation.errors;
|
|
3658
|
+
var errorSchema = schemaValidation.errorSchema;
|
|
3659
|
+
var schemaValidationErrors = errors;
|
|
3660
|
+
var schemaValidationErrorSchema = errorSchema;
|
|
3735
3661
|
if (errors.length > 0) {
|
|
3736
3662
|
if (extraErrors) {
|
|
3737
|
-
|
|
3663
|
+
var merged = schemaUtils.mergeValidationData(schemaValidation, extraErrors);
|
|
3738
3664
|
errorSchema = merged.errorSchema;
|
|
3739
3665
|
errors = merged.errors;
|
|
3740
3666
|
}
|
|
3741
3667
|
this.setState({
|
|
3742
|
-
errors,
|
|
3743
|
-
errorSchema,
|
|
3744
|
-
schemaValidationErrors,
|
|
3745
|
-
schemaValidationErrorSchema
|
|
3746
|
-
}, ()
|
|
3668
|
+
errors: errors,
|
|
3669
|
+
errorSchema: errorSchema,
|
|
3670
|
+
schemaValidationErrors: schemaValidationErrors,
|
|
3671
|
+
schemaValidationErrorSchema: schemaValidationErrorSchema
|
|
3672
|
+
}, function () {
|
|
3747
3673
|
if (onError) {
|
|
3748
3674
|
onError(errors);
|
|
3749
3675
|
} else {
|
|
@@ -3756,48 +3682,47 @@ class Form extends React.Component {
|
|
|
3756
3682
|
}
|
|
3757
3683
|
/** Renders the `Form` fields inside the <form> | `tagName` or `_internalFormWrapper`, rendering any errors if
|
|
3758
3684
|
* needed along with the submit button or any children of the form.
|
|
3759
|
-
|
|
3760
|
-
render() {
|
|
3761
|
-
|
|
3762
|
-
children,
|
|
3763
|
-
id,
|
|
3764
|
-
idPrefix,
|
|
3765
|
-
idSeparator,
|
|
3766
|
-
|
|
3767
|
-
|
|
3768
|
-
|
|
3769
|
-
|
|
3770
|
-
|
|
3771
|
-
|
|
3772
|
-
|
|
3773
|
-
|
|
3774
|
-
|
|
3775
|
-
|
|
3776
|
-
|
|
3777
|
-
|
|
3778
|
-
|
|
3779
|
-
|
|
3780
|
-
|
|
3781
|
-
|
|
3782
|
-
|
|
3783
|
-
|
|
3784
|
-
|
|
3785
|
-
|
|
3786
|
-
|
|
3787
|
-
|
|
3788
|
-
|
|
3789
|
-
|
|
3790
|
-
|
|
3791
|
-
|
|
3792
|
-
|
|
3793
|
-
|
|
3794
|
-
|
|
3795
|
-
} = registry.templates.ButtonTemplates;
|
|
3685
|
+
*/;
|
|
3686
|
+
_proto.render = function render() {
|
|
3687
|
+
var _this$props5 = this.props,
|
|
3688
|
+
children = _this$props5.children,
|
|
3689
|
+
id = _this$props5.id,
|
|
3690
|
+
idPrefix = _this$props5.idPrefix,
|
|
3691
|
+
idSeparator = _this$props5.idSeparator,
|
|
3692
|
+
_this$props5$classNam = _this$props5.className,
|
|
3693
|
+
className = _this$props5$classNam === void 0 ? "" : _this$props5$classNam,
|
|
3694
|
+
tagName = _this$props5.tagName,
|
|
3695
|
+
name = _this$props5.name,
|
|
3696
|
+
method = _this$props5.method,
|
|
3697
|
+
target = _this$props5.target,
|
|
3698
|
+
action = _this$props5.action,
|
|
3699
|
+
autoComplete = _this$props5.autoComplete,
|
|
3700
|
+
enctype = _this$props5.enctype,
|
|
3701
|
+
acceptcharset = _this$props5.acceptcharset,
|
|
3702
|
+
_this$props5$noHtml5V = _this$props5.noHtml5Validate,
|
|
3703
|
+
noHtml5Validate = _this$props5$noHtml5V === void 0 ? false : _this$props5$noHtml5V,
|
|
3704
|
+
_this$props5$disabled = _this$props5.disabled,
|
|
3705
|
+
disabled = _this$props5$disabled === void 0 ? false : _this$props5$disabled,
|
|
3706
|
+
_this$props5$readonly = _this$props5.readonly,
|
|
3707
|
+
readonly = _this$props5$readonly === void 0 ? false : _this$props5$readonly,
|
|
3708
|
+
formContext = _this$props5.formContext,
|
|
3709
|
+
_this$props5$showErro = _this$props5.showErrorList,
|
|
3710
|
+
showErrorList = _this$props5$showErro === void 0 ? "top" : _this$props5$showErro,
|
|
3711
|
+
_internalFormWrapper = _this$props5._internalFormWrapper;
|
|
3712
|
+
var _this$state4 = this.state,
|
|
3713
|
+
schema = _this$state4.schema,
|
|
3714
|
+
uiSchema = _this$state4.uiSchema,
|
|
3715
|
+
formData = _this$state4.formData,
|
|
3716
|
+
errorSchema = _this$state4.errorSchema,
|
|
3717
|
+
idSchema = _this$state4.idSchema;
|
|
3718
|
+
var registry = this.getRegistry();
|
|
3719
|
+
var _SchemaField = registry.fields.SchemaField;
|
|
3720
|
+
var SubmitButton = registry.templates.ButtonTemplates.SubmitButton;
|
|
3796
3721
|
// The `semantic-ui` and `material-ui` themes have `_internalFormWrapper`s that take an `as` prop that is the
|
|
3797
3722
|
// PropTypes.elementType to use for the inner tag, so we'll need to pass `tagName` along if it is provided.
|
|
3798
3723
|
// NOTE, the `as` prop is native to `semantic-ui` and is emulated in the `material-ui` theme
|
|
3799
|
-
|
|
3800
|
-
|
|
3724
|
+
var as = _internalFormWrapper ? tagName : undefined;
|
|
3725
|
+
var FormTag = _internalFormWrapper || tagName || "form";
|
|
3801
3726
|
return /*#__PURE__*/React__default["default"].createElement(FormTag, {
|
|
3802
3727
|
className: className ? className : "rjsf",
|
|
3803
3728
|
id: id,
|
|
@@ -3831,43 +3756,30 @@ class Form extends React.Component {
|
|
|
3831
3756
|
}), children ? children : /*#__PURE__*/React__default["default"].createElement(SubmitButton, {
|
|
3832
3757
|
uiSchema: uiSchema
|
|
3833
3758
|
}), showErrorList === "bottom" && this.renderErrors(registry));
|
|
3834
|
-
}
|
|
3835
|
-
|
|
3759
|
+
};
|
|
3760
|
+
return Form;
|
|
3761
|
+
}(React.Component);
|
|
3836
3762
|
|
|
3763
|
+
var _excluded = ["fields", "widgets", "templates"];
|
|
3837
3764
|
/** A Higher-Order component that creates a wrapper around a `Form` with the overrides from the `WithThemeProps` */
|
|
3838
3765
|
function withTheme(themeProps) {
|
|
3839
|
-
return /*#__PURE__*/React.forwardRef((_ref, ref)
|
|
3766
|
+
return /*#__PURE__*/React.forwardRef(function (_ref, ref) {
|
|
3840
3767
|
var _themeProps$templates, _templates;
|
|
3841
|
-
|
|
3842
|
-
|
|
3843
|
-
|
|
3844
|
-
|
|
3845
|
-
|
|
3846
|
-
|
|
3847
|
-
|
|
3848
|
-
|
|
3849
|
-
|
|
3850
|
-
}
|
|
3851
|
-
widgets = {
|
|
3852
|
-
...themeProps.widgets,
|
|
3853
|
-
...widgets
|
|
3854
|
-
};
|
|
3855
|
-
templates = {
|
|
3856
|
-
...themeProps.templates,
|
|
3857
|
-
...templates,
|
|
3858
|
-
ButtonTemplates: {
|
|
3859
|
-
...(themeProps === null || themeProps === void 0 ? void 0 : (_themeProps$templates = themeProps.templates) === null || _themeProps$templates === void 0 ? void 0 : _themeProps$templates.ButtonTemplates),
|
|
3860
|
-
...((_templates = templates) === null || _templates === void 0 ? void 0 : _templates.ButtonTemplates)
|
|
3861
|
-
}
|
|
3862
|
-
};
|
|
3863
|
-
return /*#__PURE__*/React__default["default"].createElement(Form, {
|
|
3864
|
-
...themeProps,
|
|
3865
|
-
...directProps,
|
|
3768
|
+
var fields = _ref.fields,
|
|
3769
|
+
widgets = _ref.widgets,
|
|
3770
|
+
templates = _ref.templates,
|
|
3771
|
+
directProps = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
3772
|
+
fields = _extends({}, themeProps.fields, fields);
|
|
3773
|
+
widgets = _extends({}, themeProps.widgets, widgets);
|
|
3774
|
+
templates = _extends({}, themeProps.templates, templates, {
|
|
3775
|
+
ButtonTemplates: _extends({}, themeProps === null || themeProps === void 0 ? void 0 : (_themeProps$templates = themeProps.templates) === null || _themeProps$templates === void 0 ? void 0 : _themeProps$templates.ButtonTemplates, (_templates = templates) === null || _templates === void 0 ? void 0 : _templates.ButtonTemplates)
|
|
3776
|
+
});
|
|
3777
|
+
return /*#__PURE__*/React__default["default"].createElement(Form, _extends({}, themeProps, directProps, {
|
|
3866
3778
|
fields: fields,
|
|
3867
3779
|
widgets: widgets,
|
|
3868
3780
|
templates: templates,
|
|
3869
3781
|
ref: ref
|
|
3870
|
-
});
|
|
3782
|
+
}));
|
|
3871
3783
|
});
|
|
3872
3784
|
}
|
|
3873
3785
|
|