@insticc/genericform 2.0.2 → 2.0.4
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/build/FormFields/CustomCheckbox.js +1 -1
- package/build/FormFields/CustomCheckboxGroup.js +51 -14
- package/build/FormFields/CustomComponent.js +1 -1
- package/build/FormFields/CustomDatePicker.js +1 -1
- package/build/FormFields/CustomDropdown.js +2 -2
- package/build/FormFields/CustomInput.js +1 -1
- package/build/FormFields/CustomJson.js +1 -1
- package/build/FormFields/CustomLabel.js +1 -1
- package/build/FormFields/CustomMultiDropdown.js +1 -1
- package/build/FormFields/CustomNumberInput.js +1 -1
- package/build/FormFields/CustomRadioGroup.js +1 -1
- package/build/FormFields/CustomSearch.js +1 -1
- package/build/FormFields/CustomTextArea.js +1 -1
- package/build/FormFields/CustomToggle.js +1 -1
- package/build/index.css +10 -8
- package/build/index.js +35 -18
- package/package.json +1 -1
|
@@ -66,7 +66,7 @@ var CustomCheckbox = function CustomCheckbox(_ref) {
|
|
|
66
66
|
CustomCheckbox.propTypes = {
|
|
67
67
|
onChange: _propTypes["default"].func.isRequired,
|
|
68
68
|
name: _propTypes["default"].string.isRequired,
|
|
69
|
-
displayName: _propTypes["default"].string,
|
|
69
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
70
70
|
checked: _propTypes["default"].bool,
|
|
71
71
|
disabled: _propTypes["default"].bool,
|
|
72
72
|
required: _propTypes["default"].bool,
|
|
@@ -26,6 +26,8 @@ var CustomCheckboxGroup = function CustomCheckboxGroup(_ref) {
|
|
|
26
26
|
options = _ref$options === void 0 ? [] : _ref$options,
|
|
27
27
|
_ref$required = _ref.required,
|
|
28
28
|
required = _ref$required === void 0 ? false : _ref$required,
|
|
29
|
+
_ref$grouped = _ref.grouped,
|
|
30
|
+
grouped = _ref$grouped === void 0 ? false : _ref$grouped,
|
|
29
31
|
error = _ref.error,
|
|
30
32
|
_ref$tooltip = _ref.tooltip,
|
|
31
33
|
tooltip = _ref$tooltip === void 0 ? "" : _ref$tooltip,
|
|
@@ -53,22 +55,56 @@ var CustomCheckboxGroup = function CustomCheckboxGroup(_ref) {
|
|
|
53
55
|
children: [(0, _defaults.labelJsx)(name, labelStyle, displayName, required, spanStyle), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
54
56
|
className: "ufg-checkbox-group",
|
|
55
57
|
children: options.map(function (opt, idx) {
|
|
58
|
+
var _opt$options;
|
|
56
59
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
checked: checked.includes(opt.name || opt.value),
|
|
62
|
-
disabled: !!opt.disabled,
|
|
63
|
-
style: inputStyle,
|
|
64
|
-
onChange: function onChange(e) {
|
|
65
|
-
return handleChange(opt.name || opt.value, e.target.checked);
|
|
60
|
+
children: [idx > 0 && grouped && /*#__PURE__*/(0, _jsxRuntime.jsx)("hr", {
|
|
61
|
+
style: {
|
|
62
|
+
margin: '0.5rem 0 0.75rem',
|
|
63
|
+
color: '#888888'
|
|
66
64
|
}
|
|
67
|
-
}), /*#__PURE__*/(0, _jsxRuntime.
|
|
68
|
-
|
|
69
|
-
|
|
65
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
66
|
+
className: "ufg-checkbox-item",
|
|
67
|
+
style: inputStyle,
|
|
68
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
69
|
+
id: "".concat(name, "-").concat(idx),
|
|
70
|
+
type: "checkbox",
|
|
71
|
+
checked: checked.includes(opt.name || opt.value),
|
|
72
|
+
disabled: !!opt.disabled,
|
|
73
|
+
style: opt.inputStyle,
|
|
74
|
+
onChange: function onChange(e) {
|
|
75
|
+
return handleChange(opt.name || opt.value, e.target.checked);
|
|
76
|
+
}
|
|
77
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
|
|
78
|
+
htmlFor: "".concat(name, "-").concat(idx),
|
|
79
|
+
style: opt.labelStyle,
|
|
80
|
+
children: opt.label || opt.text
|
|
81
|
+
})]
|
|
82
|
+
}, opt.name || opt.value), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
83
|
+
style: opt.options ? {
|
|
84
|
+
paddingLeft: '1.25rem'
|
|
85
|
+
} : undefined,
|
|
86
|
+
children: (_opt$options = opt.options) === null || _opt$options === void 0 ? void 0 : _opt$options.map(function (subopt, subidx) {
|
|
87
|
+
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
88
|
+
className: "ufg-checkbox-item",
|
|
89
|
+
style: inputStyle,
|
|
90
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
91
|
+
id: "".concat(name, "-").concat(idx, "-").concat(subidx),
|
|
92
|
+
type: "checkbox",
|
|
93
|
+
checked: checked.includes(subopt.name || subopt.value),
|
|
94
|
+
disabled: !!subopt.disabled,
|
|
95
|
+
style: subopt.inputStyle,
|
|
96
|
+
onChange: function onChange(e) {
|
|
97
|
+
return handleChange(subopt.name || subopt.value, e.target.checked);
|
|
98
|
+
}
|
|
99
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("label", {
|
|
100
|
+
htmlFor: "".concat(name, "-").concat(idx, "-").concat(subidx),
|
|
101
|
+
style: subopt.labelStyle,
|
|
102
|
+
children: subopt.label || subopt.text
|
|
103
|
+
})]
|
|
104
|
+
}, subopt.name || subopt.value);
|
|
105
|
+
})
|
|
70
106
|
})]
|
|
71
|
-
},
|
|
107
|
+
}, "".concat(name, "-").concat(idx));
|
|
72
108
|
})
|
|
73
109
|
}), (0, _defaults.errorJsx)(error), (0, _defaults.tooltipJsx)(tooltip, tooltipStyle)]
|
|
74
110
|
});
|
|
@@ -77,9 +113,10 @@ CustomCheckboxGroup.propTypes = {
|
|
|
77
113
|
onChange: _propTypes["default"].func.isRequired,
|
|
78
114
|
onOptionChange: _propTypes["default"].func,
|
|
79
115
|
name: _propTypes["default"].string.isRequired,
|
|
80
|
-
displayName: _propTypes["default"].string,
|
|
116
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
81
117
|
options: _propTypes["default"].array.isRequired,
|
|
82
118
|
required: _propTypes["default"].bool,
|
|
119
|
+
grouped: _propTypes["default"].bool,
|
|
83
120
|
error: _propTypes["default"].string,
|
|
84
121
|
tooltip: _propTypes["default"].string,
|
|
85
122
|
mainDivStyle: _propTypes["default"].object,
|
|
@@ -33,7 +33,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default":
|
|
|
33
33
|
};
|
|
34
34
|
CustomComponent.propTypes = {
|
|
35
35
|
name: _propTypes["default"].string,
|
|
36
|
-
displayName: _propTypes["default"].string,
|
|
36
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
37
37
|
component: _propTypes["default"].node,
|
|
38
38
|
required: _propTypes["default"].bool,
|
|
39
39
|
error: _propTypes["default"].string,
|
|
@@ -86,7 +86,7 @@ var CustomDatePicker = function CustomDatePicker(_ref) {
|
|
|
86
86
|
CustomDatePicker.propTypes = {
|
|
87
87
|
onChange: _propTypes["default"].func.isRequired,
|
|
88
88
|
name: _propTypes["default"].string.isRequired,
|
|
89
|
-
displayName: _propTypes["default"].string,
|
|
89
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
90
90
|
value: _propTypes["default"].any,
|
|
91
91
|
disabled: _propTypes["default"].bool,
|
|
92
92
|
required: _propTypes["default"].bool,
|
|
@@ -97,8 +97,8 @@ var CustomDropdown = function CustomDropdown(_ref) {
|
|
|
97
97
|
CustomDropdown.propTypes = {
|
|
98
98
|
onChange: _propTypes["default"].func.isRequired,
|
|
99
99
|
name: _propTypes["default"].string.isRequired,
|
|
100
|
-
displayName: _propTypes["default"].string,
|
|
101
|
-
value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].array]),
|
|
100
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
101
|
+
value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number, _propTypes["default"].array]),
|
|
102
102
|
options: _propTypes["default"].array,
|
|
103
103
|
placeholder: _propTypes["default"].string,
|
|
104
104
|
disabled: _propTypes["default"].bool,
|
|
@@ -68,7 +68,7 @@ var CustomInput = function CustomInput(_ref) {
|
|
|
68
68
|
CustomInput.propTypes = _defineProperty(_defineProperty({
|
|
69
69
|
onChange: _propTypes["default"].func.isRequired,
|
|
70
70
|
name: _propTypes["default"].string.isRequired,
|
|
71
|
-
displayName: _propTypes["default"].string,
|
|
71
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
72
72
|
value: _propTypes["default"].string,
|
|
73
73
|
type: _propTypes["default"].string,
|
|
74
74
|
disabled: _propTypes["default"].bool,
|
|
@@ -130,7 +130,7 @@ CustomJson.propTypes = {
|
|
|
130
130
|
onChange: _propTypes["default"].func.isRequired,
|
|
131
131
|
onValidate: _propTypes["default"].func,
|
|
132
132
|
name: _propTypes["default"].string.isRequired,
|
|
133
|
-
displayName: _propTypes["default"].string,
|
|
133
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
134
134
|
value: _propTypes["default"].any,
|
|
135
135
|
disabled: _propTypes["default"].bool,
|
|
136
136
|
required: _propTypes["default"].bool,
|
|
@@ -27,7 +27,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default":
|
|
|
27
27
|
};
|
|
28
28
|
CustomLabel.propTypes = {
|
|
29
29
|
name: _propTypes["default"].string.isRequired,
|
|
30
|
-
displayName: _propTypes["default"].string,
|
|
30
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
31
31
|
mainDivStyle: _propTypes["default"].object,
|
|
32
32
|
labelStyle: _propTypes["default"].object
|
|
33
33
|
};
|
|
@@ -70,7 +70,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default":
|
|
|
70
70
|
CustomMultiDropdown.propTypes = {
|
|
71
71
|
onChange: _propTypes["default"].func.isRequired,
|
|
72
72
|
name: _propTypes["default"].string.isRequired,
|
|
73
|
-
displayName: _propTypes["default"].string,
|
|
73
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
74
74
|
value: _propTypes["default"].array,
|
|
75
75
|
options: _propTypes["default"].array.isRequired,
|
|
76
76
|
placeholder: _propTypes["default"].string,
|
|
@@ -67,7 +67,7 @@ var CustomNumberInput = function CustomNumberInput(_ref) {
|
|
|
67
67
|
CustomNumberInput.propTypes = {
|
|
68
68
|
onChange: _propTypes["default"].func.isRequired,
|
|
69
69
|
name: _propTypes["default"].string.isRequired,
|
|
70
|
-
displayName: _propTypes["default"].string,
|
|
70
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
71
71
|
value: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number]),
|
|
72
72
|
disabled: _propTypes["default"].bool,
|
|
73
73
|
required: _propTypes["default"].bool,
|
|
@@ -76,7 +76,7 @@ CustomRadioGroup.propTypes = {
|
|
|
76
76
|
onOptionChange: _propTypes["default"].func,
|
|
77
77
|
formData: _propTypes["default"].object,
|
|
78
78
|
name: _propTypes["default"].string.isRequired,
|
|
79
|
-
displayName: _propTypes["default"].string,
|
|
79
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
80
80
|
value: _propTypes["default"].string,
|
|
81
81
|
options: _propTypes["default"].array.isRequired,
|
|
82
82
|
inline: _propTypes["default"].bool,
|
|
@@ -71,7 +71,7 @@ CustomSearch.propTypes = {
|
|
|
71
71
|
handleResultSelect: _propTypes["default"].func.isRequired,
|
|
72
72
|
resultRenderer: _propTypes["default"].func,
|
|
73
73
|
name: _propTypes["default"].string.isRequired,
|
|
74
|
-
displayName: _propTypes["default"].string,
|
|
74
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
75
75
|
value: _propTypes["default"].string,
|
|
76
76
|
options: _propTypes["default"].array.isRequired,
|
|
77
77
|
isLoading: _propTypes["default"].bool,
|
|
@@ -72,7 +72,7 @@ var CustomTextArea = function CustomTextArea(_ref) {
|
|
|
72
72
|
CustomTextArea.propTypes = {
|
|
73
73
|
onChange: _propTypes["default"].func.isRequired,
|
|
74
74
|
name: _propTypes["default"].string.isRequired,
|
|
75
|
-
displayName: _propTypes["default"].string,
|
|
75
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
76
76
|
value: _propTypes["default"].string,
|
|
77
77
|
disabled: _propTypes["default"].bool,
|
|
78
78
|
required: _propTypes["default"].bool,
|
|
@@ -59,7 +59,7 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { "default":
|
|
|
59
59
|
CustomToggle.propTypes = {
|
|
60
60
|
onChange: _propTypes["default"].func.isRequired,
|
|
61
61
|
name: _propTypes["default"].string.isRequired,
|
|
62
|
-
displayName: _propTypes["default"].string,
|
|
62
|
+
displayName: _propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].object]),
|
|
63
63
|
value: _propTypes["default"].bool,
|
|
64
64
|
disabled: _propTypes["default"].bool,
|
|
65
65
|
required: _propTypes["default"].bool,
|
package/build/index.css
CHANGED
|
@@ -74,8 +74,8 @@
|
|
|
74
74
|
.ufg-title {
|
|
75
75
|
font-size: 24px;
|
|
76
76
|
font-weight: 700;
|
|
77
|
-
color: var(--ufg-text);
|
|
78
77
|
margin-bottom: 24px;
|
|
78
|
+
color: var(--ufg-text);
|
|
79
79
|
display: flex;
|
|
80
80
|
align-items: center;
|
|
81
81
|
gap: 12px;
|
|
@@ -93,6 +93,12 @@
|
|
|
93
93
|
}
|
|
94
94
|
|
|
95
95
|
.ufg-form {
|
|
96
|
+
display: flex;
|
|
97
|
+
flex-direction: column;
|
|
98
|
+
gap: 20px;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
.ufg-fields {
|
|
96
102
|
display: flex;
|
|
97
103
|
flex-direction: column;
|
|
98
104
|
gap: 10px;
|
|
@@ -224,7 +230,7 @@
|
|
|
224
230
|
.ufg-radio-group {
|
|
225
231
|
display: flex;
|
|
226
232
|
flex-direction: column;
|
|
227
|
-
gap:
|
|
233
|
+
gap: 0.5em;
|
|
228
234
|
}
|
|
229
235
|
|
|
230
236
|
.ufg-radio-group-inline {
|
|
@@ -238,7 +244,7 @@
|
|
|
238
244
|
.ufg-radio-item {
|
|
239
245
|
display: flex;
|
|
240
246
|
align-items: center;
|
|
241
|
-
gap:
|
|
247
|
+
gap: 1em;
|
|
242
248
|
margin: 0;
|
|
243
249
|
}
|
|
244
250
|
|
|
@@ -308,11 +314,7 @@
|
|
|
308
314
|
-------------------------------------------------------------------------- */
|
|
309
315
|
.ufg-actions {
|
|
310
316
|
display: flex;
|
|
311
|
-
|
|
312
|
-
align-items: center;
|
|
313
|
-
justify-content: center;
|
|
314
|
-
gap: 2rem;
|
|
315
|
-
margin-top: 24px;
|
|
317
|
+
gap: 1em;
|
|
316
318
|
flex-wrap: wrap;
|
|
317
319
|
}
|
|
318
320
|
|
package/build/index.js
CHANGED
|
@@ -34,6 +34,7 @@ var _CustomSearch = _interopRequireDefault(require("./FormFields/CustomSearch"))
|
|
|
34
34
|
var _CustomSeparator = _interopRequireDefault(require("./FormFields/CustomSeparator"));
|
|
35
35
|
var _CustomTextArea = _interopRequireDefault(require("./FormFields/CustomTextArea"));
|
|
36
36
|
var _CustomToggle = _interopRequireDefault(require("./FormFields/CustomToggle"));
|
|
37
|
+
var _semanticUiReact = require("semantic-ui-react");
|
|
37
38
|
var _Demo = _interopRequireDefault(require("./Demo"));
|
|
38
39
|
var _Demo2 = _interopRequireDefault(require("./Demo2"));
|
|
39
40
|
require("./index.css");
|
|
@@ -103,15 +104,18 @@ var groupByInline = function groupByInline(fields) {
|
|
|
103
104
|
|
|
104
105
|
// #region GenericForm Props
|
|
105
106
|
var GenericForm = function GenericForm(_ref) {
|
|
106
|
-
var
|
|
107
|
-
|
|
108
|
-
_ref$fields = _ref.fields,
|
|
107
|
+
var _submitButton$icon, _cancelButton$icon;
|
|
108
|
+
var _ref$fields = _ref.fields,
|
|
109
109
|
fields = _ref$fields === void 0 ? [] : _ref$fields,
|
|
110
110
|
title = _ref.title,
|
|
111
111
|
titleIcon = _ref.titleIcon,
|
|
112
|
+
titleStyle = _ref.titleStyle,
|
|
112
113
|
_ref$containerStyle = _ref.containerStyle,
|
|
113
114
|
containerStyle = _ref$containerStyle === void 0 ? {} : _ref$containerStyle,
|
|
114
115
|
formStyle = _ref.formStyle,
|
|
116
|
+
fieldsStyle = _ref.fieldsStyle,
|
|
117
|
+
actionsDivStyle = _ref.actionsDivStyle,
|
|
118
|
+
actionsStyle = _ref.actionsStyle,
|
|
115
119
|
_ref$splitForm = _ref.splitForm,
|
|
116
120
|
splitForm = _ref$splitForm === void 0 ? false : _ref$splitForm,
|
|
117
121
|
splitField = _ref.splitField,
|
|
@@ -128,9 +132,13 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
128
132
|
_ref$showCancel = _ref.showCancel,
|
|
129
133
|
showCancel = _ref$showCancel === void 0 ? true : _ref$showCancel,
|
|
130
134
|
_ref$submitText = _ref.submitText,
|
|
131
|
-
submitText = _ref$submitText === void 0 ? '
|
|
135
|
+
submitText = _ref$submitText === void 0 ? 'Submit' : _ref$submitText,
|
|
132
136
|
_ref$cancelText = _ref.cancelText,
|
|
133
137
|
cancelText = _ref$cancelText === void 0 ? 'Cancel' : _ref$cancelText,
|
|
138
|
+
_ref$submitButton = _ref.submitButton,
|
|
139
|
+
submitButton = _ref$submitButton === void 0 ? {} : _ref$submitButton,
|
|
140
|
+
_ref$cancelButton = _ref.cancelButton,
|
|
141
|
+
cancelButton = _ref$cancelButton === void 0 ? {} : _ref$cancelButton,
|
|
134
142
|
_ref$validateOnChange = _ref.validateOnChange,
|
|
135
143
|
validateOnChange = _ref$validateOnChange === void 0 ? true : _ref$validateOnChange,
|
|
136
144
|
_ref$validateOnSubmit = _ref.validateOnSubmit,
|
|
@@ -577,6 +585,7 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
577
585
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_CustomCheckboxGroup["default"], _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, cp), sp), fp), {}, {
|
|
578
586
|
checked: value !== null && value !== void 0 ? value : [],
|
|
579
587
|
options: field.options,
|
|
588
|
+
grouped: field.grouped,
|
|
580
589
|
onChange: fieldHandler(field),
|
|
581
590
|
onOptionChange: field.onOptionChange
|
|
582
591
|
}), field.name);
|
|
@@ -652,8 +661,8 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
652
661
|
};
|
|
653
662
|
var renderGroupSection = function renderGroupSection(g, fieldList) {
|
|
654
663
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
655
|
-
className: "ufg-
|
|
656
|
-
style:
|
|
664
|
+
className: "ufg-fields",
|
|
665
|
+
style: fieldsStyle,
|
|
657
666
|
children: [g !== 'ungrouped' && /*#__PURE__*/(0, _jsxRuntime.jsx)("h2", {
|
|
658
667
|
children: g
|
|
659
668
|
}), renderFields(fieldList)]
|
|
@@ -722,25 +731,35 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
722
731
|
var hasErrors = Object.values(errors).some(Boolean);
|
|
723
732
|
var actionsBar = /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
724
733
|
className: "ufg-actions",
|
|
734
|
+
style: actionsDivStyle,
|
|
725
735
|
children: [customActions.map(function (action, idx) {
|
|
726
736
|
return /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
|
|
727
737
|
type: "button",
|
|
728
738
|
className: "ufg-button ".concat(action.className || 'ufg-button-secondary'),
|
|
729
739
|
onClick: action.onClick,
|
|
730
740
|
disabled: !!action.disabled,
|
|
731
|
-
style: action.style,
|
|
741
|
+
style: _objectSpread(_objectSpread({}, actionsStyle), action.style),
|
|
732
742
|
children: [action.icon, action.label]
|
|
733
743
|
}, idx);
|
|
734
744
|
}), showSubmit && haveSaveButton && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
735
745
|
type: "submit",
|
|
736
|
-
className: "ufg-button ufg-button-primary
|
|
746
|
+
className: "ufg-button ".concat(submitButton.className || 'ufg-button-primary'),
|
|
737
747
|
disabled: isSubmitting || hasErrors,
|
|
738
|
-
|
|
739
|
-
|
|
748
|
+
style: _objectSpread(_objectSpread({}, actionsStyle), submitButton.style),
|
|
749
|
+
children: isSubmitting ? /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
750
|
+
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_semanticUiReact.Icon, {
|
|
751
|
+
name: "spinner",
|
|
752
|
+
loading: true
|
|
753
|
+
}), " ", submitText]
|
|
754
|
+
}) : /*#__PURE__*/(0, _jsxRuntime.jsxs)("span", {
|
|
755
|
+
children: [(_submitButton$icon = submitButton.icon) !== null && _submitButton$icon !== void 0 ? _submitButton$icon : '', submitText]
|
|
756
|
+
})
|
|
757
|
+
}), onCancel && showCancel && /*#__PURE__*/(0, _jsxRuntime.jsxs)("button", {
|
|
740
758
|
type: "button",
|
|
741
|
-
className: "ufg-button ufg-button-secondary
|
|
759
|
+
className: "ufg-button ".concat(cancelButton.className || 'ufg-button-secondary'),
|
|
742
760
|
onClick: onCancel,
|
|
743
|
-
|
|
761
|
+
style: _objectSpread(_objectSpread({}, actionsStyle), cancelButton.style),
|
|
762
|
+
children: [(_cancelButton$icon = cancelButton.icon) !== null && _cancelButton$icon !== void 0 ? _cancelButton$icon : '', cancelText]
|
|
744
763
|
})]
|
|
745
764
|
});
|
|
746
765
|
|
|
@@ -763,9 +782,8 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
763
782
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Modal.Header, {
|
|
764
783
|
closeButton: true,
|
|
765
784
|
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactBootstrap.Modal.Title, {
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
})]
|
|
785
|
+
style: titleStyle,
|
|
786
|
+
children: [titleIcon, " ", title, " "]
|
|
769
787
|
})
|
|
770
788
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactBootstrap.Modal.Body, {
|
|
771
789
|
children: formJSX
|
|
@@ -777,9 +795,8 @@ var GenericForm = function GenericForm(_ref) {
|
|
|
777
795
|
style: containerStyle,
|
|
778
796
|
children: [title && /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
779
797
|
className: "ufg-title",
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
})]
|
|
798
|
+
style: titleStyle,
|
|
799
|
+
children: [titleIcon, " ", title]
|
|
783
800
|
}), formJSX]
|
|
784
801
|
});
|
|
785
802
|
};
|
package/package.json
CHANGED