linear-react-components-ui 0.4.76-rc.9 → 0.4.76
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/.husky/pre-commit +2 -2
- package/.tool-versions +1 -0
- package/.vscode/settings.json +1 -2
- package/README.md +40 -5
- package/lib/assets/styles/button.scss +19 -10
- package/lib/assets/styles/checkbox.scss +92 -70
- package/lib/assets/styles/commons.scss +36 -0
- package/lib/assets/styles/drawers.scss +22 -6
- package/lib/assets/styles/dropdown.scss +28 -2
- package/lib/assets/styles/effects.scss +32 -0
- package/lib/assets/styles/floatMenu.scss +0 -1
- package/lib/assets/styles/gridlayout.scss +2 -1
- package/lib/assets/styles/input.scss +21 -0
- package/lib/assets/styles/label.scss +9 -1
- package/lib/assets/styles/list.scss +8 -0
- package/lib/assets/styles/multiSelect.scss +105 -0
- package/lib/assets/styles/panel.scss +3 -1
- package/lib/assets/styles/periodpicker.scss +65 -0
- package/lib/assets/styles/progress.scss +8 -1
- package/lib/assets/styles/radio.scss +19 -0
- package/lib/assets/styles/select.scss +4 -3
- package/lib/assets/styles/sidenav.scss +11 -1
- package/lib/assets/styles/skeleton.scss +48 -0
- package/lib/assets/styles/table.scss +25 -5
- package/lib/assets/styles/tabs.scss +116 -75
- package/lib/assets/styles/treeview.scss +41 -0
- package/lib/assets/styles/uitour.scss +112 -0
- package/lib/avatar/avatar.spec.js +17 -6
- package/lib/avatar/index.js +1 -1
- package/lib/buttons/DefaultButton.js +13 -4
- package/lib/buttons/split_button/index.js +8 -4
- package/lib/checkbox/Label.js +37 -0
- package/lib/checkbox/checkbox.spec.js +16 -16
- package/lib/checkbox/index.js +33 -12
- package/lib/dialog/base/index.js +15 -6
- package/lib/dialog/form/index.js +24 -4
- package/lib/drawer/Drawer.js +9 -5
- package/lib/drawer/Header.js +15 -5
- package/lib/drawer/index.js +4 -1
- package/lib/dropdown/Popup.js +3 -2
- package/lib/form/Field.js +2 -0
- package/lib/form/FieldNumber.js +11 -3
- package/lib/form/FieldPeriod.js +100 -0
- package/lib/form/form.spec.js +8 -0
- package/lib/form/helpers.js +20 -1
- package/lib/form/index.js +220 -218
- package/lib/form/withFieldHOC.js +5 -1
- package/lib/form/withFormSecurity.js +106 -0
- package/lib/icons/helper.js +24 -0
- package/lib/inputs/base/InputTextBase.js +30 -5
- package/lib/inputs/base/helpers.js +13 -9
- package/lib/inputs/date/Dropdown.js +3 -3
- package/lib/inputs/date/date.spec.js +46 -36
- package/lib/inputs/date/helpers.js +36 -0
- package/lib/inputs/date/index.js +12 -10
- package/lib/inputs/mask/Phone.js +10 -1
- package/lib/inputs/mask/imaskHOC.js +2 -1
- package/lib/inputs/mask/input_mask.spec.js +21 -4
- package/lib/inputs/multiSelect/ActionButtons.js +68 -0
- package/lib/inputs/multiSelect/Dropdown.js +200 -0
- package/lib/inputs/multiSelect/helper.js +18 -0
- package/lib/inputs/multiSelect/index.js +343 -0
- package/lib/inputs/number/BaseNumber.js +1 -1
- package/lib/inputs/number/index.js +7 -5
- package/lib/inputs/period/Dialog.js +38 -0
- package/lib/inputs/period/Dropdown.js +90 -0
- package/lib/inputs/period/PeriodList.js +79 -0
- package/lib/inputs/period/helper.js +118 -0
- package/lib/inputs/period/index.js +490 -0
- package/lib/inputs/search/index.js +2 -0
- package/lib/inputs/select/Dropdown.js +55 -65
- package/lib/inputs/select/helper.js +65 -2
- package/lib/inputs/select/index.js +26 -3
- package/lib/inputs/select/multiple/index.js +16 -11
- package/lib/inputs/select/simple/index.js +39 -24
- package/lib/internals/constants.js +4 -3
- package/lib/internals/withTooltip.js +86 -82
- package/lib/labels/DefaultLabel.js +7 -4
- package/lib/list/Item.js +35 -9
- package/lib/list/helpers.js +8 -3
- package/lib/list/index.js +172 -14
- package/lib/list/list.spec.js +290 -89
- package/lib/menus/float/MenuItem.js +25 -8
- package/lib/menus/sidenav/NavMenuItem.js +17 -8
- package/lib/menus/sidenav/index.js +59 -86
- package/lib/menus/sidenav/popup_menu_search/index.js +26 -17
- package/lib/menus/sidenav/sidenav.spec.js +86 -19
- package/lib/panel/Header.js +4 -3
- package/lib/progress/Bar.js +40 -9
- package/lib/progress/index.js +12 -4
- package/lib/radio/index.js +9 -6
- package/lib/skeleton/SkeletonContainer.js +42 -0
- package/lib/skeleton/index.js +84 -0
- package/lib/spinner/index.js +6 -1
- package/lib/split/Split.js +5 -11
- package/lib/table/Body.js +55 -11
- package/lib/table/Header.js +14 -1
- package/lib/table/HeaderColumn.js +26 -3
- package/lib/table/Row.js +19 -8
- package/lib/table/RowColumn.js +23 -3
- package/lib/table/helpers.js +11 -1
- package/lib/table/index.js +41 -8
- package/lib/tabs/DropdownItems.js +84 -0
- package/lib/tabs/Menu.js +12 -9
- package/lib/tabs/MenuItems.js +15 -9
- package/lib/tabs/Panel.js +1 -3
- package/lib/tabs/index.js +156 -22
- package/lib/tabs/tabs.spec.js +8 -5
- package/lib/toolbar/ButtonBar.js +30 -24
- package/lib/toolbar/LabelBar.js +22 -27
- package/lib/toolbar/helpers.js +12 -0
- package/lib/toolbar/index.js +24 -9
- package/lib/tooltip/index.js +20 -7
- package/lib/treeview/Node.js +364 -49
- package/lib/treeview/index.js +475 -36
- package/lib/treeview/treeview.spec.js +18 -0
- package/lib/uitour/helpers.js +15 -0
- package/lib/uitour/index.js +271 -0
- package/lib/uitour/uitour.spec.js +176 -0
- package/package.json +9 -8
package/lib/form/index.js
CHANGED
|
@@ -41,268 +41,258 @@ var _FieldArray = _interopRequireDefault(require("./FieldArray"));
|
|
|
41
41
|
|
|
42
42
|
require("../assets/styles/form.scss");
|
|
43
43
|
|
|
44
|
+
var _dialog = require("../dialog");
|
|
45
|
+
|
|
46
|
+
var _withFormSecurity = require("./withFormSecurity");
|
|
47
|
+
|
|
44
48
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
45
49
|
|
|
46
50
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
47
51
|
|
|
48
52
|
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
49
53
|
|
|
54
|
+
function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
55
|
+
|
|
56
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
57
|
+
|
|
50
58
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
51
59
|
|
|
52
60
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
53
61
|
|
|
54
|
-
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
55
|
-
|
|
56
62
|
function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
|
|
57
63
|
|
|
58
64
|
function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
|
|
59
65
|
|
|
66
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
67
|
+
|
|
68
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
69
|
+
|
|
70
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
71
|
+
|
|
60
72
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
61
73
|
|
|
62
|
-
function
|
|
74
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
75
|
+
|
|
76
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
77
|
+
|
|
78
|
+
var Form = function Form(_ref) {
|
|
79
|
+
var submitOnPressEnterKey = _ref.submitOnPressEnterKey,
|
|
80
|
+
dataSource = _ref.dataSource,
|
|
81
|
+
securityBeforeUnload = _ref.securityBeforeUnload,
|
|
82
|
+
handlerReset = _ref.handlerReset,
|
|
83
|
+
handlerSubmit = _ref.handlerSubmit,
|
|
84
|
+
children = _ref.children,
|
|
85
|
+
handlerValidates = _ref.handlerValidates,
|
|
86
|
+
style = _ref.style,
|
|
87
|
+
customClass = _ref.customClass,
|
|
88
|
+
securityTitle = _ref.securityTitle,
|
|
89
|
+
securityText = _ref.securityText,
|
|
90
|
+
onDataChange = _ref.onDataChange,
|
|
91
|
+
onValidateForm = _ref.onValidateForm,
|
|
92
|
+
externalFieldErrors = _ref.externalFieldErrors,
|
|
93
|
+
onSubmit = _ref.onSubmit,
|
|
94
|
+
skeletonize = _ref.skeletonize,
|
|
95
|
+
disabled = _ref.disabled;
|
|
96
|
+
|
|
97
|
+
var _useState = (0, _react.useState)(dataSource),
|
|
98
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
99
|
+
data = _useState2[0],
|
|
100
|
+
setData = _useState2[1];
|
|
101
|
+
|
|
102
|
+
var _useState3 = (0, _react.useState)(dataSource),
|
|
103
|
+
_useState4 = _slicedToArray(_useState3, 2),
|
|
104
|
+
originalData = _useState4[0],
|
|
105
|
+
setOriginalData = _useState4[1];
|
|
106
|
+
|
|
107
|
+
var _useState5 = (0, _react.useState)(submitOnPressEnterKey),
|
|
108
|
+
_useState6 = _slicedToArray(_useState5, 2),
|
|
109
|
+
submitFormOnEnter = _useState6[0],
|
|
110
|
+
setSubmitFormOnEnter = _useState6[1];
|
|
111
|
+
|
|
112
|
+
var _useState7 = (0, _react.useState)({}),
|
|
113
|
+
_useState8 = _slicedToArray(_useState7, 2),
|
|
114
|
+
fieldErrors = _useState8[0],
|
|
115
|
+
setFieldErrors = _useState8[1];
|
|
116
|
+
|
|
117
|
+
var fieldsValidators = (0, _react.useRef)({});
|
|
118
|
+
var context = (0, _react.useContext)(_withFormSecurity.FormSecurityContext);
|
|
119
|
+
|
|
120
|
+
var getValidatesErrorMessages = function getValidatesErrorMessages(validators, fieldValue) {
|
|
121
|
+
var validatorsArray = !(validators instanceof Array) ? [validators] : validators;
|
|
122
|
+
var errors = [];
|
|
123
|
+
validatorsArray.forEach(function (validator) {
|
|
124
|
+
var result = validator(fieldValue);
|
|
125
|
+
if (result) errors = [].concat(_toConsumableArray(errors), [result]);
|
|
126
|
+
});
|
|
127
|
+
return errors;
|
|
128
|
+
};
|
|
63
129
|
|
|
64
|
-
|
|
130
|
+
var checkIsValid = function checkIsValid(value) {
|
|
131
|
+
var updateState = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
132
|
+
var dataValidate = value || data;
|
|
133
|
+
var currentFieldErrors = {};
|
|
65
134
|
|
|
66
|
-
|
|
135
|
+
_lodash["default"].forEach(fieldsValidators.current, function (validators, fieldName) {
|
|
136
|
+
var fieldValue = _lodash["default"].get(dataValidate, fieldName);
|
|
67
137
|
|
|
68
|
-
|
|
138
|
+
var messages = getValidatesErrorMessages(validators, fieldValue);
|
|
69
139
|
|
|
70
|
-
|
|
140
|
+
if (messages.length > 0) {
|
|
141
|
+
currentFieldErrors = _extends({}, fieldErrors, _defineProperty({}, fieldName, messages));
|
|
142
|
+
}
|
|
143
|
+
});
|
|
71
144
|
|
|
72
|
-
|
|
145
|
+
if (updateState) setFieldErrors(currentFieldErrors);
|
|
146
|
+
return _lodash["default"].isEmpty(currentFieldErrors);
|
|
147
|
+
};
|
|
73
148
|
|
|
74
|
-
|
|
149
|
+
var onFieldChange = function onFieldChange(event) {
|
|
150
|
+
var target = event.target;
|
|
151
|
+
(0, _helpers.changeValue)(dataSource, target);
|
|
152
|
+
(0, _helpers.changeValue)(data, target);
|
|
75
153
|
|
|
76
|
-
|
|
154
|
+
var newData = _extends({}, data);
|
|
77
155
|
|
|
78
|
-
|
|
156
|
+
if (context && context.onChangedData) {
|
|
157
|
+
var onChangedData = context.onChangedData;
|
|
79
158
|
|
|
80
|
-
|
|
159
|
+
if (!_lodash["default"].isEqual(newData, originalData)) {
|
|
160
|
+
onChangedData(true);
|
|
161
|
+
} else {
|
|
162
|
+
onChangedData(false);
|
|
163
|
+
}
|
|
164
|
+
}
|
|
81
165
|
|
|
82
|
-
|
|
166
|
+
setData(newData); // TODO - Usar debounce para evitar chamada a cada letra digitada
|
|
83
167
|
|
|
84
|
-
|
|
168
|
+
if (onValidateForm) onValidateForm(checkIsValid(newData, false));
|
|
169
|
+
if (onDataChange) onDataChange(newData);
|
|
170
|
+
};
|
|
85
171
|
|
|
86
|
-
var
|
|
87
|
-
|
|
172
|
+
var onValidate = function onValidate(fieldName, fieldValue, validators) {
|
|
173
|
+
if (validators) {
|
|
174
|
+
var currentFieldErrors = fieldErrors;
|
|
175
|
+
var errors = getValidatesErrorMessages(validators, fieldValue);
|
|
88
176
|
|
|
89
|
-
|
|
177
|
+
if (errors.length === 0) {
|
|
178
|
+
currentFieldErrors = _lodash["default"].omit(currentFieldErrors, fieldName);
|
|
179
|
+
} else {
|
|
180
|
+
currentFieldErrors = _extends({}, currentFieldErrors, _defineProperty({}, fieldName, errors));
|
|
181
|
+
}
|
|
90
182
|
|
|
91
|
-
|
|
92
|
-
|
|
183
|
+
setFieldErrors(currentFieldErrors);
|
|
184
|
+
}
|
|
185
|
+
};
|
|
93
186
|
|
|
94
|
-
|
|
187
|
+
var onFormSubmit = function onFormSubmit(event) {
|
|
188
|
+
if (event) event.preventDefault();
|
|
189
|
+
if (checkIsValid(data)) onSubmit(data);
|
|
190
|
+
};
|
|
95
191
|
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
writable: true,
|
|
101
|
-
value: function value(e) {
|
|
102
|
-
var _this$props = _this.props,
|
|
103
|
-
onValidateForm = _this$props.onValidateForm,
|
|
104
|
-
onDataChange = _this$props.onDataChange;
|
|
105
|
-
var data = _this.state.data;
|
|
106
|
-
var _e$target = e.target,
|
|
107
|
-
name = _e$target.name,
|
|
108
|
-
value = _e$target.value;
|
|
192
|
+
var onReset = function onReset() {
|
|
193
|
+
setData(JSON.parse(JSON.stringify(originalData)));
|
|
194
|
+
setFieldErrors({});
|
|
195
|
+
};
|
|
109
196
|
|
|
110
|
-
|
|
197
|
+
var onRemoveFieldValidators = function onRemoveFieldValidators(fieldName) {
|
|
198
|
+
var newFieldsValidators = _lodash["default"].omit(fieldsValidators.current, fieldName);
|
|
111
199
|
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
}); // TODO - Usar debounce para evitar chamada a cada letra digitada
|
|
200
|
+
fieldsValidators.current = newFieldsValidators;
|
|
201
|
+
};
|
|
115
202
|
|
|
203
|
+
var onBeforeUnload = function onBeforeUnload(e) {
|
|
204
|
+
e.preventDefault();
|
|
116
205
|
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
});
|
|
121
|
-
Object.defineProperty(_assertThisInitialized(_this), "onValidate", {
|
|
122
|
-
configurable: true,
|
|
123
|
-
enumerable: true,
|
|
124
|
-
writable: true,
|
|
125
|
-
value: function value(fieldName, fieldValue, validators) {
|
|
126
|
-
if (validators) {
|
|
127
|
-
var fieldErrors = _this.state.fieldErrors;
|
|
128
|
-
|
|
129
|
-
var errors = _this.getValidatesErrorMessages(validators, fieldValue);
|
|
130
|
-
|
|
131
|
-
if (errors.length === 0) {
|
|
132
|
-
fieldErrors = _lodash["default"].omit(fieldErrors, fieldName);
|
|
133
|
-
} else {
|
|
134
|
-
fieldErrors = _extends({}, fieldErrors, _defineProperty({}, fieldName, errors));
|
|
135
|
-
}
|
|
136
|
-
|
|
137
|
-
_this.setState({
|
|
138
|
-
fieldErrors: fieldErrors
|
|
139
|
-
});
|
|
140
|
-
}
|
|
141
|
-
}
|
|
142
|
-
});
|
|
143
|
-
Object.defineProperty(_assertThisInitialized(_this), "onSubmit", {
|
|
144
|
-
configurable: true,
|
|
145
|
-
enumerable: true,
|
|
146
|
-
writable: true,
|
|
147
|
-
value: function value(event) {
|
|
148
|
-
if (event) event.preventDefault();
|
|
149
|
-
var data = _this.state.data;
|
|
150
|
-
if (_this.checkIsValid(data)) _this.props.onSubmit(data);
|
|
151
|
-
}
|
|
152
|
-
});
|
|
153
|
-
Object.defineProperty(_assertThisInitialized(_this), "onReset", {
|
|
154
|
-
configurable: true,
|
|
155
|
-
enumerable: true,
|
|
156
|
-
writable: true,
|
|
157
|
-
value: function value() {
|
|
158
|
-
_this.setState({
|
|
159
|
-
data: JSON.parse(JSON.stringify(_this.state.originalData)),
|
|
160
|
-
fieldErrors: {}
|
|
161
|
-
});
|
|
162
|
-
}
|
|
163
|
-
});
|
|
164
|
-
Object.defineProperty(_assertThisInitialized(_this), "onRemoveFieldValidators", {
|
|
165
|
-
configurable: true,
|
|
166
|
-
enumerable: true,
|
|
167
|
-
writable: true,
|
|
168
|
-
value: function value(fieldName) {
|
|
169
|
-
_this.fieldsValidators = _lodash["default"].omit(_this.fieldsValidators, fieldName);
|
|
170
|
-
}
|
|
171
|
-
});
|
|
172
|
-
Object.defineProperty(_assertThisInitialized(_this), "getValidatesErrorMessages", {
|
|
173
|
-
configurable: true,
|
|
174
|
-
enumerable: true,
|
|
175
|
-
writable: true,
|
|
176
|
-
value: function value(validators, fieldValue) {
|
|
177
|
-
var validatorsArray = !(validators instanceof Array) ? [validators] : validators;
|
|
178
|
-
var errors = [];
|
|
179
|
-
validatorsArray.forEach(function (validator) {
|
|
180
|
-
var result = validator(fieldValue);
|
|
181
|
-
if (result) errors = [].concat(_toConsumableArray(errors), [result]);
|
|
182
|
-
});
|
|
183
|
-
return errors;
|
|
184
|
-
}
|
|
185
|
-
});
|
|
186
|
-
Object.defineProperty(_assertThisInitialized(_this), "getContextValue", {
|
|
187
|
-
configurable: true,
|
|
188
|
-
enumerable: true,
|
|
189
|
-
writable: true,
|
|
190
|
-
value: function value() {
|
|
191
|
-
return {
|
|
192
|
-
handlerFieldChange: _this.onFieldChange,
|
|
193
|
-
handlerFieldValidade: _this.onValidate,
|
|
194
|
-
handlerStoreValidators: function handlerStoreValidators(fieldName, fieldValidates) {
|
|
195
|
-
_this.fieldsValidators = _extends({}, _this.fieldsValidators, _defineProperty({}, fieldName, fieldValidates));
|
|
196
|
-
},
|
|
197
|
-
handlerRemoveValidators: _this.onRemoveFieldValidators,
|
|
198
|
-
data: _this.state.data,
|
|
199
|
-
fieldErrors: _this.state.fieldErrors
|
|
200
|
-
};
|
|
201
|
-
}
|
|
202
|
-
});
|
|
203
|
-
Object.defineProperty(_assertThisInitialized(_this), "checkIsValid", {
|
|
204
|
-
configurable: true,
|
|
205
|
-
enumerable: true,
|
|
206
|
-
writable: true,
|
|
207
|
-
value: function value(data) {
|
|
208
|
-
var updateState = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
|
|
209
|
-
var dataValidate = data || _this.state.data;
|
|
210
|
-
var fieldErrors = {};
|
|
211
|
-
|
|
212
|
-
_lodash["default"].forEach(_this.fieldsValidators, function (validators, fieldName) {
|
|
213
|
-
var fieldValue = _lodash["default"].get(dataValidate, fieldName);
|
|
214
|
-
|
|
215
|
-
var messages = _this.getValidatesErrorMessages(validators, fieldValue);
|
|
216
|
-
|
|
217
|
-
if (messages.length > 0) {
|
|
218
|
-
fieldErrors = _extends({}, fieldErrors, _defineProperty({}, fieldName, messages));
|
|
219
|
-
}
|
|
220
|
-
});
|
|
206
|
+
if (_lodash["default"].isEqual(data, originalData)) {
|
|
207
|
+
return;
|
|
208
|
+
}
|
|
221
209
|
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
originalData: dataSource,
|
|
245
|
-
fieldErrors: {},
|
|
246
|
-
submitFormOnEnter: submitOnPressEnterKey
|
|
210
|
+
e.returnValue = true;
|
|
211
|
+
};
|
|
212
|
+
|
|
213
|
+
var submitOnEnter = function submitOnEnter(event) {
|
|
214
|
+
if (event.key === 'Enter') {
|
|
215
|
+
event.preventDefault();
|
|
216
|
+
if (submitFormOnEnter) onFormSubmit();
|
|
217
|
+
}
|
|
218
|
+
};
|
|
219
|
+
|
|
220
|
+
var getContextValue = function getContextValue() {
|
|
221
|
+
return {
|
|
222
|
+
skeletonize: skeletonize,
|
|
223
|
+
handlerFieldChange: onFieldChange,
|
|
224
|
+
handlerFieldValidade: onValidate,
|
|
225
|
+
handlerStoreValidators: function handlerStoreValidators(fieldName, fieldValidates) {
|
|
226
|
+
fieldsValidators.current = _extends({}, fieldsValidators.current, _defineProperty({}, fieldName, fieldValidates));
|
|
227
|
+
},
|
|
228
|
+
handlerRemoveValidators: onRemoveFieldValidators,
|
|
229
|
+
data: data,
|
|
230
|
+
fieldErrors: fieldErrors,
|
|
231
|
+
externalFieldErrors: externalFieldErrors
|
|
247
232
|
};
|
|
248
|
-
|
|
249
|
-
}
|
|
233
|
+
};
|
|
250
234
|
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
handlerSubmit = _this$props2.handlerSubmit,
|
|
257
|
-
handlerValidates = _this$props2.handlerValidates;
|
|
258
|
-
handlerSubmit(this.onSubmit);
|
|
259
|
-
if (handlerReset) handlerReset(this.onReset);
|
|
260
|
-
if (handlerValidates) handlerValidates(this.checkIsValid);
|
|
261
|
-
} // up = data => _.debounce((data) => { this.props.onValidateForm(this.checkIsValid(data)); }, 300)
|
|
262
|
-
|
|
263
|
-
}, {
|
|
264
|
-
key: "render",
|
|
265
|
-
value: function render() {
|
|
266
|
-
var _this2 = this;
|
|
267
|
-
|
|
268
|
-
var _this$props3 = this.props,
|
|
269
|
-
style = _this$props3.style,
|
|
270
|
-
customClass = _this$props3.customClass,
|
|
271
|
-
children = _this$props3.children;
|
|
272
|
-
return /*#__PURE__*/_react["default"].createElement(_helpers.FormContext.Provider, {
|
|
273
|
-
value: this.getContextValue()
|
|
274
|
-
}, /*#__PURE__*/_react["default"].createElement("form", {
|
|
275
|
-
style: style,
|
|
235
|
+
var formProps = function formProps() {
|
|
236
|
+
var propsForm = null;
|
|
237
|
+
|
|
238
|
+
if (!disabled) {
|
|
239
|
+
propsForm = {
|
|
276
240
|
onSubmit: function onSubmit(e) {
|
|
277
|
-
e.preventDefault();
|
|
241
|
+
return e.preventDefault();
|
|
278
242
|
},
|
|
279
243
|
onKeyPress: function onKeyPress(e) {
|
|
280
|
-
|
|
281
|
-
}
|
|
282
|
-
|
|
283
|
-
className: "form-component ".concat(customClass)
|
|
284
|
-
}, children));
|
|
244
|
+
return submitOnEnter(e);
|
|
245
|
+
}
|
|
246
|
+
};
|
|
285
247
|
}
|
|
286
|
-
}], [{
|
|
287
|
-
key: "getDerivedStateFromProps",
|
|
288
|
-
value: function getDerivedStateFromProps(props, state) {
|
|
289
|
-
var submitOnPressEnterKey = props.submitOnPressEnterKey,
|
|
290
|
-
dataSource = props.dataSource;
|
|
291
|
-
|
|
292
|
-
if (submitOnPressEnterKey !== state.submitFormOnEnter || dataSource !== state.originalData) {
|
|
293
|
-
return {
|
|
294
|
-
submitFormOnEnter: submitOnPressEnterKey,
|
|
295
|
-
data: dataSource,
|
|
296
|
-
originalData: dataSource
|
|
297
|
-
};
|
|
298
|
-
}
|
|
299
248
|
|
|
300
|
-
|
|
249
|
+
return propsForm;
|
|
250
|
+
};
|
|
251
|
+
|
|
252
|
+
(0, _react.useEffect)(function () {
|
|
253
|
+
if (!disabled) {
|
|
254
|
+
handlerSubmit(onFormSubmit);
|
|
255
|
+
if (handlerReset) handlerReset(onReset);
|
|
256
|
+
if (handlerValidates) handlerValidates(checkIsValid);
|
|
257
|
+
}
|
|
258
|
+
}, [data]);
|
|
259
|
+
(0, _react.useEffect)(function () {
|
|
260
|
+
if (securityBeforeUnload) {
|
|
261
|
+
if (context) context.setSecurityBeforeUnload(true);
|
|
262
|
+
window.addEventListener('beforeunload', onBeforeUnload);
|
|
301
263
|
}
|
|
302
|
-
}]);
|
|
303
264
|
|
|
304
|
-
|
|
305
|
-
|
|
265
|
+
return function () {
|
|
266
|
+
return window.removeEventListener('beforeunload', onBeforeUnload);
|
|
267
|
+
};
|
|
268
|
+
}, [securityBeforeUnload, onBeforeUnload]);
|
|
269
|
+
(0, _react.useEffect)(function () {
|
|
270
|
+
if (!disabled) {
|
|
271
|
+
if (submitOnPressEnterKey !== submitFormOnEnter || dataSource !== originalData) {
|
|
272
|
+
setData(dataSource);
|
|
273
|
+
setOriginalData(function (prevState) {
|
|
274
|
+
return prevState || dataSource;
|
|
275
|
+
});
|
|
276
|
+
setSubmitFormOnEnter(submitOnPressEnterKey);
|
|
277
|
+
}
|
|
278
|
+
}
|
|
279
|
+
}, [submitOnPressEnterKey, dataSource]);
|
|
280
|
+
return /*#__PURE__*/_react["default"].createElement(_react.Fragment, null, /*#__PURE__*/_react["default"].createElement(_helpers.FormContext.Provider, {
|
|
281
|
+
value: getContextValue()
|
|
282
|
+
}, /*#__PURE__*/_react["default"].createElement("form", _extends({
|
|
283
|
+
style: style
|
|
284
|
+
}, formProps(), {
|
|
285
|
+
role: "presentation",
|
|
286
|
+
className: "form-component ".concat(customClass)
|
|
287
|
+
}), children)), /*#__PURE__*/_react["default"].createElement(_dialog.DialogQuestion, {
|
|
288
|
+
zIndex: "99999999",
|
|
289
|
+
title: securityTitle || 'Dados Alterados',
|
|
290
|
+
text: securityText || 'Você possui dados alterados, confirma o fechamento?',
|
|
291
|
+
visible: !!context && context.showQuestion,
|
|
292
|
+
onConfirmClick: context ? context.onConfirmClick : function () {},
|
|
293
|
+
onUnconfirmClick: context ? context.onUnconfirmClick : function () {}
|
|
294
|
+
}));
|
|
295
|
+
};
|
|
306
296
|
|
|
307
297
|
Form.propTypes = {
|
|
308
298
|
dataSource: _propTypes["default"].object.isRequired,
|
|
@@ -315,7 +305,13 @@ Form.propTypes = {
|
|
|
315
305
|
submitOnPressEnterKey: _propTypes["default"].bool,
|
|
316
306
|
style: _propTypes["default"].object,
|
|
317
307
|
customClass: _propTypes["default"].string,
|
|
318
|
-
onDataChange: _propTypes["default"].func
|
|
308
|
+
onDataChange: _propTypes["default"].func,
|
|
309
|
+
securityBeforeUnload: _propTypes["default"].bool,
|
|
310
|
+
securityTitle: _propTypes["default"].string,
|
|
311
|
+
securityText: _propTypes["default"].string,
|
|
312
|
+
externalFieldErrors: _propTypes["default"].object,
|
|
313
|
+
skeletonize: _propTypes["default"].bool,
|
|
314
|
+
disabled: _propTypes["default"].bool
|
|
319
315
|
};
|
|
320
316
|
Form.defaultProps = {
|
|
321
317
|
onValidateForm: undefined,
|
|
@@ -324,7 +320,13 @@ Form.defaultProps = {
|
|
|
324
320
|
handlerReset: undefined,
|
|
325
321
|
handlerValidates: undefined,
|
|
326
322
|
customClass: '',
|
|
327
|
-
onDataChange: undefined
|
|
323
|
+
onDataChange: undefined,
|
|
324
|
+
securityBeforeUnload: false,
|
|
325
|
+
securityTitle: null,
|
|
326
|
+
securityText: null,
|
|
327
|
+
externalFieldErrors: {},
|
|
328
|
+
skeletonize: false,
|
|
329
|
+
disabled: false
|
|
328
330
|
};
|
|
329
331
|
var _default = Form;
|
|
330
332
|
exports["default"] = _default;
|
package/lib/form/withFieldHOC.js
CHANGED
|
@@ -151,15 +151,19 @@ function withFieldHOC(WrappedComponent) {
|
|
|
151
151
|
handlerFieldValidade = _ref.handlerFieldValidade,
|
|
152
152
|
data = _ref.data,
|
|
153
153
|
fieldErrors = _ref.fieldErrors,
|
|
154
|
+
externalFieldErrors = _ref.externalFieldErrors,
|
|
154
155
|
handlerStoreValidators = _ref.handlerStoreValidators,
|
|
155
|
-
handlerRemoveValidators = _ref.handlerRemoveValidators
|
|
156
|
+
handlerRemoveValidators = _ref.handlerRemoveValidators,
|
|
157
|
+
skeletonize = _ref.skeletonize;
|
|
156
158
|
return /*#__PURE__*/_react["default"].createElement(FieldHOC, _extends({}, props, {
|
|
159
|
+
skeletonize: skeletonize,
|
|
157
160
|
handlerFieldChange: handlerFieldChange,
|
|
158
161
|
handlerFieldValidade: handlerFieldValidade,
|
|
159
162
|
handlerStoreValidators: handlerStoreValidators,
|
|
160
163
|
handlerRemoveValidators: handlerRemoveValidators,
|
|
161
164
|
data: data,
|
|
162
165
|
fieldErrors: fieldErrors,
|
|
166
|
+
externalFieldErrors: externalFieldErrors,
|
|
163
167
|
forwardedRef: ref
|
|
164
168
|
}));
|
|
165
169
|
});
|
|
@@ -0,0 +1,106 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.FormSecurityContext = exports["default"] = void 0;
|
|
9
|
+
|
|
10
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
11
|
+
|
|
12
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
13
|
+
|
|
14
|
+
var _excluded = ["handlerClose"];
|
|
15
|
+
|
|
16
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
|
|
17
|
+
|
|
18
|
+
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
19
|
+
|
|
20
|
+
function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
|
|
21
|
+
|
|
22
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
23
|
+
|
|
24
|
+
function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
|
|
25
|
+
|
|
26
|
+
function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
27
|
+
|
|
28
|
+
function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
|
|
29
|
+
|
|
30
|
+
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
31
|
+
|
|
32
|
+
function _iterableToArrayLimit(arr, i) { var _i = arr && (typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]); if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
|
|
33
|
+
|
|
34
|
+
function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
|
|
35
|
+
|
|
36
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
37
|
+
|
|
38
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
39
|
+
|
|
40
|
+
var FormSecurityContext = /*#__PURE__*/_react["default"].createContext();
|
|
41
|
+
|
|
42
|
+
exports.FormSecurityContext = FormSecurityContext;
|
|
43
|
+
|
|
44
|
+
var withFormSecurity = function withFormSecurity(WrappedComponent) {
|
|
45
|
+
var EnhancedComponent = function EnhancedComponent(_ref) {
|
|
46
|
+
var handlerClose = _ref.handlerClose,
|
|
47
|
+
props = _objectWithoutProperties(_ref, _excluded);
|
|
48
|
+
|
|
49
|
+
var changedData = (0, _react.useRef)(false);
|
|
50
|
+
var securityBeforeUnload = (0, _react.useRef)(false);
|
|
51
|
+
|
|
52
|
+
var _useState = (0, _react.useState)(false),
|
|
53
|
+
_useState2 = _slicedToArray(_useState, 2),
|
|
54
|
+
showQuestion = _useState2[0],
|
|
55
|
+
setShowQuestion = _useState2[1];
|
|
56
|
+
|
|
57
|
+
var newHandlerClose = function newHandlerClose() {
|
|
58
|
+
if (changedData.current && securityBeforeUnload.current) {
|
|
59
|
+
setShowQuestion(true);
|
|
60
|
+
} else {
|
|
61
|
+
handlerClose();
|
|
62
|
+
}
|
|
63
|
+
};
|
|
64
|
+
|
|
65
|
+
var onConfirmClick = function onConfirmClick() {
|
|
66
|
+
handlerClose();
|
|
67
|
+
};
|
|
68
|
+
|
|
69
|
+
var onUnconfirmClick = function onUnconfirmClick() {
|
|
70
|
+
setShowQuestion(false);
|
|
71
|
+
};
|
|
72
|
+
|
|
73
|
+
var onChangedData = function onChangedData(value) {
|
|
74
|
+
changedData.current = value;
|
|
75
|
+
};
|
|
76
|
+
|
|
77
|
+
var setSecurityBeforeUnload = function setSecurityBeforeUnload(value) {
|
|
78
|
+
securityBeforeUnload.current = value;
|
|
79
|
+
};
|
|
80
|
+
|
|
81
|
+
return /*#__PURE__*/_react["default"].createElement(FormSecurityContext.Provider, {
|
|
82
|
+
value: {
|
|
83
|
+
onChangedData: onChangedData,
|
|
84
|
+
showQuestion: showQuestion,
|
|
85
|
+
onConfirmClick: onConfirmClick,
|
|
86
|
+
onUnconfirmClick: onUnconfirmClick,
|
|
87
|
+
setSecurityBeforeUnload: setSecurityBeforeUnload
|
|
88
|
+
}
|
|
89
|
+
}, /*#__PURE__*/_react["default"].createElement(WrappedComponent, _extends({}, props, {
|
|
90
|
+
handlerClose: newHandlerClose
|
|
91
|
+
})));
|
|
92
|
+
};
|
|
93
|
+
|
|
94
|
+
EnhancedComponent.propTypes = {
|
|
95
|
+
handlerClose: _propTypes["default"].func,
|
|
96
|
+
onClick: _propTypes["default"].func
|
|
97
|
+
};
|
|
98
|
+
EnhancedComponent.defaultProps = {
|
|
99
|
+
handlerClose: undefined,
|
|
100
|
+
onClick: undefined
|
|
101
|
+
};
|
|
102
|
+
return EnhancedComponent;
|
|
103
|
+
};
|
|
104
|
+
|
|
105
|
+
var _default = withFormSecurity;
|
|
106
|
+
exports["default"] = _default;
|