linear-react-components-ui 1.1.22-beta.1 → 1.1.22-beta.2

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.
Files changed (42) hide show
  1. package/lib/assets/styles/file.scss +10 -7
  2. package/lib/assets/styles/select.scss +15 -19
  3. package/lib/assets/styles/tabs.scss +3 -16
  4. package/lib/dialog/base/index.js +26 -12
  5. package/lib/dialog/form/index.js +2 -3
  6. package/lib/dialog/types.d.ts +0 -1
  7. package/lib/drawer/Drawer.d.ts +1 -1
  8. package/lib/drawer/Drawer.js +2 -6
  9. package/lib/drawer/types.d.ts +0 -1
  10. package/lib/form/Field.js +8 -31
  11. package/lib/form/FieldArray.js +2 -11
  12. package/lib/form/FieldNumber.js +1 -10
  13. package/lib/form/FieldPeriod.js +1 -15
  14. package/lib/form/index.d.ts +1 -1
  15. package/lib/form/index.js +5 -30
  16. package/lib/form/types.d.ts +1 -13
  17. package/lib/form/withFieldHOC.js +2 -4
  18. package/lib/inputs/date/helpers.d.ts +1 -31
  19. package/lib/inputs/date/helpers.js +2 -32
  20. package/lib/inputs/date/index.js +20 -28
  21. package/lib/inputs/date/types.d.ts +0 -1
  22. package/lib/inputs/mask/BaseMask.d.ts +1 -1
  23. package/lib/inputs/mask/BaseMask.js +4 -6
  24. package/lib/inputs/mask/helpers.d.ts +53 -6
  25. package/lib/inputs/mask/helpers.js +35 -15
  26. package/lib/inputs/mask/types.d.ts +0 -1
  27. package/lib/inputs/select/multiple/Selecteds.d.ts +1 -1
  28. package/lib/inputs/select/multiple/Selecteds.js +1 -3
  29. package/lib/inputs/select/multiple/index.js +2 -3
  30. package/lib/inputs/select/types.d.ts +0 -1
  31. package/lib/panel/Content.js +7 -10
  32. package/lib/radio/index.d.ts +1 -4
  33. package/lib/radio/index.js +0 -1
  34. package/lib/tabs/Menu.d.ts +1 -1
  35. package/lib/tabs/Menu.js +2 -4
  36. package/lib/tabs/MenuTabs.js +5 -16
  37. package/lib/tabs/context.d.ts +1 -1
  38. package/lib/tabs/context.js +1 -3
  39. package/lib/tabs/index.d.ts +1 -1
  40. package/lib/tabs/index.js +6 -13
  41. package/lib/tabs/types.d.ts +0 -6
  42. package/package.json +1 -1
@@ -159,14 +159,8 @@
159
159
  margin-top: 3px;
160
160
  }
161
161
  > .-skeletonized {
162
- @extend %skeleton-component;
163
162
  height: 180px !important;
164
- color: transparent !important;
165
- text-shadow: none;
166
- box-shadow: none;
167
- border-color: transparent !important;
168
- transition: none;
169
- }
163
+ }
170
164
  }
171
165
 
172
166
  .input-simple-file-container {
@@ -219,3 +213,12 @@
219
213
  }
220
214
  }
221
215
  }
216
+
217
+ .-skeletonized {
218
+ @extend %skeleton-component;
219
+ color: transparent !important;
220
+ text-shadow: none;
221
+ box-shadow: none;
222
+ border-color: transparent !important;
223
+ transition: none;
224
+ }
@@ -23,15 +23,15 @@
23
23
  }
24
24
  }
25
25
 
26
- .selectwrapper > .multiselect {
26
+ .selectwrapper>.multiselect {
27
27
  flex-wrap: wrap;
28
28
 
29
- > .textinput {
29
+ >.textinput {
30
30
  order: 1;
31
31
  display: inline-block;
32
32
  }
33
33
 
34
- > .selecteditem {
34
+ >.selecteditem {
35
35
  background-color: #f2f9fc;
36
36
  border: 1px solid #c9e6f2;
37
37
  border-radius: 3px;
@@ -44,18 +44,14 @@
44
44
  float: left;
45
45
  margin: 2px;
46
46
  padding: 0px 8px 0px 5px;
47
- &.-disabled {
48
- @extend %component-disabled;
49
- opacity: 0.7;
50
- border: solid 1px $font-color-disabled;
51
- }
47
+
52
48
  .close {
53
49
  all: unset;
54
50
  }
55
51
  }
56
52
  }
57
53
 
58
- .selectwrapper > .multiselect > .selecteditem > .close {
54
+ .selectwrapper>.multiselect>.selecteditem>.close {
59
55
  cursor: pointer;
60
56
 
61
57
  &:after {
@@ -67,9 +63,9 @@
67
63
  }
68
64
  }
69
65
 
70
- .dropdown-component > .select-dropdown {
66
+ .dropdown-component>.select-dropdown {
71
67
  animation: 0.5s ease-in 0s 1 slideDown;
72
- background-color: #fff;
68
+ background-color: #FFF;
73
69
  border: $component-border-color;
74
70
  @extend %component-menu-dropdown;
75
71
  display: grid;
@@ -79,7 +75,7 @@
79
75
  overflow-x: hidden;
80
76
  margin-top: 2px;
81
77
 
82
- > .filtercontainer {
78
+ >.filtercontainer {
83
79
  display: grid;
84
80
  grid-template-columns: 1fr 20px;
85
81
  align-items: center;
@@ -87,7 +83,7 @@
87
83
  margin: 4px;
88
84
  }
89
85
 
90
- > .filtercontainer > .filterinput {
86
+ >.filtercontainer>.filterinput {
91
87
  border: 0;
92
88
  width: 100%;
93
89
  font-size: 13px;
@@ -95,7 +91,7 @@
95
91
  padding: 10px 5px;
96
92
  }
97
93
 
98
- > .item {
94
+ >.item {
99
95
  margin: 0;
100
96
  padding: 6px 10px;
101
97
  display: flex;
@@ -136,21 +132,21 @@
136
132
  display: flex;
137
133
  justify-content: space-between;
138
134
  align-items: center;
139
- width: 100%;
135
+ width: 100%
140
136
  }
141
137
 
142
138
  .menubutton {
143
- > .label {
139
+ >.label {
144
140
  flex-grow: 1;
145
141
  }
146
142
 
147
- > .menuicon {
148
- margin-right: 5px;
143
+ >.menuicon {
144
+ margin-right: 5px
149
145
  }
150
146
  }
151
147
  }
152
148
 
153
- > .notfound {
149
+ >.notfound {
154
150
  text-indent: 10px;
155
151
  color: graytext;
156
152
  font-style: italic;
@@ -49,15 +49,12 @@ $dropdown-width: 38px;
49
49
  text-shadow: 0 1px $font-color-second;
50
50
  cursor: pointer;
51
51
  line-height: 20px;
52
- margin-right: 2px;
52
+ margin-right: 1px;
53
53
  padding: 0;
54
54
  width: auto;
55
- min-width: 112px;
55
+ min-width: 100px;
56
56
  display: flex;
57
57
  align-items: center;
58
- border: 1px solid $font-color-second;
59
- border-top: 2px solid $font-color-second;
60
- border-bottom: 1px solid $component-border-color;
61
58
  &.selected {
62
59
  border: 1px solid $component-border-color;
63
60
  background: $font-color-second;
@@ -66,15 +63,6 @@ $dropdown-width: 38px;
66
63
  box-shadow: 0;
67
64
  font-weight: bold;
68
65
  }
69
- &.witherrorcontent {
70
- border: 1px solid $input-error-border-color;
71
- border-top: 2px solid $input-error-border-color;
72
- border-bottom: 1px solid transparent;
73
- background-color: $input-error-bg-color;
74
- &.selected {
75
- border-top: 2px solid $component-selected-color;
76
- }
77
- }
78
66
  &.selected>.closepanel,
79
67
  &:hover>.closepanel {
80
68
  visibility: visible;
@@ -87,8 +75,7 @@ $dropdown-width: 38px;
87
75
  background: transparent;
88
76
  border: 0;
89
77
  width: 100%;
90
- text-align: left;
91
- box-shadow: none !important;
78
+ text-align: left
92
79
  }
93
80
 
94
81
  .menu>.menuitem>.closepanel {
@@ -35,10 +35,11 @@ const BaseDialog = props => {
35
35
  const {
36
36
  headerRef
37
37
  } = (0, _react.useContext)(_form.FormDialogContext);
38
- const wrapperEl = (0, _react.useRef)(null);
39
- const modalContainerRef = (0, _react.useRef)(null);
40
38
  const [isDragging, setIsDragging] = (0, _react.useState)(false);
41
39
  const [open = true, setOpen] = (0, _react.useState)(openProp);
40
+ const wrapperEl = (0, _react.useRef)(null);
41
+ const modalContainerRef = (0, _react.useRef)(null);
42
+ const focusableElementsRef = (0, _react.useRef)([]);
42
43
  if (openProp !== undefined && openProp !== open) {
43
44
  setOpen(openProp);
44
45
  }
@@ -64,17 +65,12 @@ const BaseDialog = props => {
64
65
  handleClose();
65
66
  }
66
67
  };
67
- const modalContainerWithoutBlur = event => {
68
- const focusOnAnotherField = !modalContainerRef.current?.contains(event.relatedTarget);
69
- const modalContent = wrapperEl.current?.querySelector('#modal-dialog-content');
70
- const elementsFocusable = modalContent?.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
71
- if (focusOnAnotherField && elementsFocusable?.length) {
72
- const firstElement = elementsFocusable[0];
73
- setTimeout(() => {
74
- firstElement.focus();
75
- }, 150);
68
+ (0, _react.useEffect)(() => {
69
+ if (open && modalContainerRef.current) {
70
+ focusableElementsRef.current = Array.from(modalContainerRef.current.querySelectorAll("button, a, input, select, textarea, [tabindex]:not([tabindex='-1'])"));
71
+ focusableElementsRef.current[0]?.focus();
76
72
  }
77
- };
73
+ }, [open]);
78
74
  const onDialogPositionChange = _ref => {
79
75
  let {
80
76
  positionX,
@@ -116,8 +112,26 @@ const BaseDialog = props => {
116
112
  const onMouseUp = () => {
117
113
  if (wrapperEl.current) setIsDragging(false);
118
114
  };
115
+ const handleKeyDown = e => {
116
+ if (e.key === 'Tab') {
117
+ const {
118
+ current: elements
119
+ } = focusableElementsRef;
120
+ if (elements.length === 0) return;
121
+ const firstElement = elements[0];
122
+ const lastElement = elements[elements.length - 1];
123
+ if (e.shiftKey && document.activeElement === firstElement) {
124
+ lastElement.focus();
125
+ e.preventDefault();
126
+ } else if (!e.shiftKey && document.activeElement === lastElement) {
127
+ firstElement.focus();
128
+ e.preventDefault();
129
+ }
130
+ }
131
+ };
119
132
  const createdModal = /*#__PURE__*/_react.default.createElement("div", {
120
133
  id: id,
134
+ onKeyDown: handleKeyDown,
121
135
  ref: modalContainerRef,
122
136
  className: "modalcontainer",
123
137
  onMouseDown: handleClickOutside,
@@ -32,8 +32,7 @@ const ModalForm = props => {
32
32
  children,
33
33
  className = '',
34
34
  wrapperClassName = '',
35
- contentClassName = '',
36
- headerClassName = ''
35
+ contentClassName = ''
37
36
  } = props;
38
37
  const headerRef = (0, _react.useRef)(null);
39
38
  const context = (0, _react.useContext)(_withFormSecurity.FormSecurityContext);
@@ -63,7 +62,7 @@ const ModalForm = props => {
63
62
  className: className,
64
63
  wrapperClassName: `dialog-form-wrapper ${wrapperClassName}`
65
64
  }), props.title && /*#__PURE__*/_react.default.createElement("div", {
66
- className: `header-form ${headerClassName}`
65
+ className: "header-form"
67
66
  }, /*#__PURE__*/_react.default.createElement(_Header.default, {
68
67
  title: props.title,
69
68
  handlerClose: props.handlerClose,
@@ -43,7 +43,6 @@ interface IFormProps extends Omit<IBaseProps, 'textAlign' | 'zIndex'> {
43
43
  icon?: JSX.Element;
44
44
  content?: ReactNode;
45
45
  contentClassName?: string;
46
- headerClassName?: string;
47
46
  }
48
47
  interface ICommonDialogProps {
49
48
  onConfirmClick?: () => void;
@@ -5,6 +5,6 @@ import '../@types/Position.js';
5
5
  import '../@types/Icon.js';
6
6
  import '../icons/helper.js';
7
7
 
8
- declare const BaseDrawer: ({ position, customClass, children, style, customClassForContent, targetId, closeOnEsc, overlay, permissionAttr, skeletonize, handlerClose, customClassForDrawer, content, title, isWaiting, customClassElementDrawer, ...rest }: IDrawerProps) => React__default.ReactPortal;
8
+ declare const BaseDrawer: ({ position, customClass, children, style, customClassForContent, targetId, closeOnEsc, overlay, permissionAttr, skeletonize, handlerClose, customClassForDrawer, content, title, isWaiting, ...rest }: IDrawerProps) => React__default.ReactPortal;
9
9
 
10
10
  export { BaseDrawer as default };
@@ -10,7 +10,7 @@ var _helpers = _interopRequireDefault(require("./helpers"));
10
10
  var _permissionValidations = require("../permissionValidations");
11
11
  var _ = require(".");
12
12
  var _spinner = _interopRequireDefault(require("../spinner"));
13
- const _excluded = ["position", "customClass", "children", "style", "customClassForContent", "targetId", "closeOnEsc", "overlay", "permissionAttr", "skeletonize", "handlerClose", "customClassForDrawer", "content", "title", "isWaiting", "customClassElementDrawer"];
13
+ const _excluded = ["position", "customClass", "children", "style", "customClassForContent", "targetId", "closeOnEsc", "overlay", "permissionAttr", "skeletonize", "handlerClose", "customClassForDrawer", "content", "title", "isWaiting"];
14
14
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
15
15
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
16
16
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
@@ -38,8 +38,7 @@ const BaseDrawer = _ref => {
38
38
  customClassForDrawer = '',
39
39
  content,
40
40
  title,
41
- isWaiting = false,
42
- customClassElementDrawer = ''
41
+ isWaiting = false
43
42
  } = _ref,
44
43
  rest = _objectWithoutProperties(_ref, _excluded);
45
44
  const headerProps = _objectSpread(_objectSpread({}, rest), {}, {
@@ -47,9 +46,6 @@ const BaseDrawer = _ref => {
47
46
  });
48
47
  const drawerContainerEl = (0, _react.useRef)(document.createElement('div'));
49
48
  drawerContainerEl.current.className = 'drawercontainer';
50
- if (customClassElementDrawer) {
51
- drawerContainerEl.current.className = customClassElementDrawer;
52
- }
53
49
  const drawerComponentEl = (0, _react.useRef)();
54
50
  const {
55
51
  hideContent
@@ -10,7 +10,6 @@ interface IDrawerProps extends React__default.HTMLAttributes<HTMLDivElement> {
10
10
  customClass?: string;
11
11
  customClassForContent?: string;
12
12
  customClassForDrawer?: string;
13
- customClassElementDrawer?: string;
14
13
  position?: Exclude<Position, 'center'>;
15
14
  handlerClose?: () => void;
16
15
  closeOnEsc?: boolean;
package/lib/form/Field.js CHANGED
@@ -8,19 +8,18 @@ var _react = _interopRequireWildcard(require("react"));
8
8
  var _lodash = _interopRequireDefault(require("lodash"));
9
9
  var _withFieldHOC = _interopRequireDefault(require("./withFieldHOC"));
10
10
  var _helpers = require("./helpers");
11
- var constants = _interopRequireWildcard(require("../internals/constants"));
12
- const _excluded = ["handlerFieldChange", "handlerFieldValidate", "onChange", "onBlur", "name", "validators", "data", "fieldErrors", "handlerStoreValidators", "handlerRemoveValidators", "component", "externalFieldErrors", "originalData", "handleValidationErrorsOnTab"];
11
+ const _excluded = ["handlerFieldChange", "handlerFieldValidate", "onChange", "onBlur", "name", "validators", "data", "fieldErrors", "handlerStoreValidators", "handlerRemoveValidators", "component", "externalFieldErrors", "originalData"];
13
12
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
14
13
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
15
14
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
16
15
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
17
- function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
18
- function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
19
16
  function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
20
17
  function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
21
18
  function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
22
19
  function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
23
20
  function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
21
+ function _objectWithoutProperties(e, t) { if (null == e) return {}; var o, r, i = _objectWithoutPropertiesLoose(e, t); if (Object.getOwnPropertySymbols) { var s = Object.getOwnPropertySymbols(e); for (r = 0; r < s.length; r++) o = s[r], t.includes(o) || {}.propertyIsEnumerable.call(e, o) && (i[o] = e[o]); } return i; }
22
+ function _objectWithoutPropertiesLoose(r, e) { if (null == r) return {}; var t = {}; for (var n in r) if ({}.hasOwnProperty.call(r, n)) { if (e.includes(n)) continue; t[n] = r[n]; } return t; }
24
23
  const getEvents = _ref => {
25
24
  let {
26
25
  validators = [],
@@ -29,13 +28,10 @@ const getEvents = _ref => {
29
28
  handlerFieldValidate,
30
29
  validatorFromComponent,
31
30
  handlerFieldChange,
32
- onChange,
33
- component,
34
- onKeyDown
31
+ onChange
35
32
  } = _ref;
36
33
  if (!(validators || validatorFromComponent || onBlur || onChange)) return {};
37
34
  const validatorsArray = (0, _helpers.getValidatorsArray)(validators, validatorFromComponent);
38
- const maskComponents = ['PhoneField', 'CpfField', 'CnpjField', 'ZipCodeField', 'BaseMask'];
39
35
  return {
40
36
  onBlur: e => {
41
37
  if (validatorsArray && e.target && handlerFieldValidate) {
@@ -43,14 +39,8 @@ const getEvents = _ref => {
43
39
  }
44
40
  if (onBlur) onBlur(e);
45
41
  },
46
- onKeyDown: e => {
47
- if (component && maskComponents.includes(component.name) && [constants.keyCodes.ENTER].includes(e.keyCode) && validatorsArray && e.target && handlerFieldValidate) {
48
- handlerFieldValidate(name, e.target.value, validatorsArray);
49
- if (onKeyDown) onKeyDown(e);
50
- }
51
- },
52
42
  onChange: e => {
53
- if (component && !maskComponents.includes(component.name) && validatorsArray && e.target && handlerFieldValidate) {
43
+ if (validatorsArray && e.target && handlerFieldValidate) {
54
44
  handlerFieldValidate(name, e.target.value, validatorsArray);
55
45
  }
56
46
  if (handlerFieldChange) handlerFieldChange(e);
@@ -68,11 +58,8 @@ const getCustomProps = (props, handlerSetComponentValidator) => {
68
58
  component
69
59
  } = props;
70
60
  if (componentType && componentType.toLowerCase() === 'radio') {
71
- const convertedData = _objectSpread(_objectSpread({}, data), {}, {
72
- [name]: String(data?.[name])
73
- });
74
61
  return {
75
- checked: _lodash.default.get(convertedData, name) === value,
62
+ checked: _lodash.default.get(data, name) === value,
76
63
  id: fieldId
77
64
  };
78
65
  } else if (componentType && componentType.toLowerCase() === 'checkbox') {
@@ -104,22 +91,13 @@ const Field = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
104
91
  handlerRemoveValidators,
105
92
  component: Component,
106
93
  externalFieldErrors,
107
- originalData,
108
- handleValidationErrorsOnTab
94
+ originalData
109
95
  } = props,
110
96
  rest = _objectWithoutProperties(props, _excluded);
111
97
  const {
112
98
  handlerSetValidatorFromComponent,
113
99
  validatorFromComponent
114
100
  } = (0, _react.useContext)(_helpers.withFieldContext);
115
- const hasErrorsMessagesOnField = (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
116
- fieldErrors: props.fieldErrors
117
- }));
118
- if (handleValidationErrorsOnTab) handleValidationErrorsOnTab({
119
- name: name,
120
- tabId: props.tabId,
121
- hasErrors: !!hasErrorsMessagesOnField.length
122
- });
123
101
  return /*#__PURE__*/_react.default.createElement(Component, _extends({}, rest, getEvents({
124
102
  name,
125
103
  validators,
@@ -127,8 +105,7 @@ const Field = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
127
105
  validatorFromComponent,
128
106
  handlerFieldValidate,
129
107
  handlerFieldChange,
130
- onChange,
131
- component: Component
108
+ onChange
132
109
  }), getCustomProps(props, handlerSetValidatorFromComponent), {
133
110
  ref: ref,
134
111
  name: name,
@@ -10,7 +10,7 @@ var _withFieldHOC = _interopRequireDefault(require("./withFieldHOC"));
10
10
  var _gridlayout = _interopRequireDefault(require("../gridlayout"));
11
11
  var _fieldset = _interopRequireDefault(require("../fieldset"));
12
12
  var _helpers = require("./helpers");
13
- const _excluded = ["cols", "label", "bordered", "labelContainerStyle", "skipLabel", "data", "name", "handlerStoreValidators", "component", "handlerFieldChange", "handlerFieldValidate", "changePropName", "fieldErrors", "externalMessagesErrors", "handlerRemoveValidators", "validators", "valuePropName", "originalData", "handlerSelecionados", "handleValidationErrorsOnTab"];
13
+ const _excluded = ["cols", "label", "bordered", "labelContainerStyle", "skipLabel", "data", "name", "handlerStoreValidators", "component", "handlerFieldChange", "handlerFieldValidate", "changePropName", "fieldErrors", "externalMessagesErrors", "handlerRemoveValidators", "validators", "valuePropName", "originalData", "handlerSelecionados"];
14
14
  /* eslint-disable react-hooks/rules-of-hooks */
15
15
  function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
16
16
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
@@ -69,19 +69,10 @@ const FieldArray = props => {
69
69
  validators,
70
70
  valuePropName,
71
71
  originalData,
72
- handlerSelecionados,
73
- handleValidationErrorsOnTab
72
+ handlerSelecionados
74
73
  } = props,
75
74
  rest = _objectWithoutProperties(props, _excluded);
76
75
  let content = null;
77
- const hasErrorsMessagesOnField = (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
78
- fieldErrors: props.fieldErrors
79
- }));
80
- if (handleValidationErrorsOnTab) handleValidationErrorsOnTab({
81
- name: name,
82
- tabId: props.tabId,
83
- hasErrors: !!hasErrorsMessagesOnField.length
84
- });
85
76
  if (Component) {
86
77
  if (!skipLabel && label) {
87
78
  content = /*#__PURE__*/_react.default.createElement(_fieldset.default, {
@@ -55,18 +55,9 @@ const getEventProps = _ref => {
55
55
  const FieldMask = props => {
56
56
  const {
57
57
  data,
58
- name,
59
- handleValidationErrorsOnTab
58
+ name
60
59
  } = props;
61
60
  const currentValue = _lodash.default.get(data, name);
62
- const hasErrorsMessagesOnField = (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
63
- fieldErrors: props.fieldErrors
64
- }));
65
- if (handleValidationErrorsOnTab) handleValidationErrorsOnTab({
66
- name: name,
67
- tabId: props.tabId,
68
- hasErrors: !!hasErrorsMessagesOnField.length
69
- });
70
61
  return /*#__PURE__*/_react.default.createElement(props.component, _extends({}, props, getEventProps(_objectSpread({}, props)), {
71
62
  errorMessages: (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
72
63
  fieldErrors: props.fieldErrors
@@ -12,11 +12,6 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
12
12
  function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
13
13
  function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
14
14
  function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
15
- function ownKeys(e, r) { var t = Object.keys(e); if (Object.getOwnPropertySymbols) { var o = Object.getOwnPropertySymbols(e); r && (o = o.filter(function (r) { return Object.getOwnPropertyDescriptor(e, r).enumerable; })), t.push.apply(t, o); } return t; }
16
- function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t = null != arguments[r] ? arguments[r] : {}; r % 2 ? ownKeys(Object(t), !0).forEach(function (r) { _defineProperty(e, r, t[r]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function (r) { Object.defineProperty(e, r, Object.getOwnPropertyDescriptor(t, r)); }); } return e; }
17
- function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object.defineProperty(e, r, { value: t, enumerable: !0, configurable: !0, writable: !0 }) : e[r] = t, e; }
18
- function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
19
- function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
20
15
  const FieldPeriod = props => {
21
16
  const {
22
17
  data,
@@ -31,8 +26,7 @@ const FieldPeriod = props => {
31
26
  originalData,
32
27
  component: Component,
33
28
  name,
34
- externalFieldErrors,
35
- handleValidationErrorsOnTab
29
+ externalFieldErrors
36
30
  } = props;
37
31
  let content = null;
38
32
  const [showValidateMessages, setShowValidateMessages] = (0, _react.useState)(false);
@@ -51,14 +45,6 @@ const FieldPeriod = props => {
51
45
  externalFieldErrors,
52
46
  externalMessagesErrors
53
47
  });
54
- const hasErrorsMessagesOnField = (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
55
- fieldErrors: props.fieldErrors
56
- }));
57
- if (handleValidationErrorsOnTab) handleValidationErrorsOnTab({
58
- name: name,
59
- tabId: props.tabId,
60
- hasErrors: !!hasErrorsMessagesOnField.length
61
- });
62
48
  if (Component) {
63
49
  content = /*#__PURE__*/_react.default.createElement(Component, _extends({}, props, {
64
50
  errorMessages: errorMessages,
@@ -13,6 +13,6 @@ import '../@types/Period.js';
13
13
  import '../internals/types.js';
14
14
  import '../@types/Position.js';
15
15
 
16
- declare const Form: ({ submitOnPressEnterKey, dataSource, securityBeforeUnload, handlerReset, handlerSubmit, handlerValidates, style, customClass, securityTitle, securityText, securityData, onDataChange, onValidateForm, externalFieldErrors, onSubmit, skeletonize, disabled, children, useInternalState, onValidateErrorsOnTab, }: FormProps) => JSX.Element;
16
+ declare const Form: ({ submitOnPressEnterKey, dataSource, securityBeforeUnload, handlerReset, handlerSubmit, handlerValidates, style, customClass, securityTitle, securityText, securityData, onDataChange, onValidateForm, externalFieldErrors, onSubmit, skeletonize, disabled, children, useInternalState, }: FormProps) => JSX.Element;
17
17
 
18
18
  export { Form as default };
package/lib/form/index.js CHANGED
@@ -68,8 +68,7 @@ const Form = _ref => {
68
68
  skeletonize,
69
69
  disabled,
70
70
  children,
71
- useInternalState = false,
72
- onValidateErrorsOnTab
71
+ useInternalState = false
73
72
  } = _ref;
74
73
  const formId = (0, _uuid.v1)();
75
74
  const [data, setData] = (0, _react.useState)(dataSource);
@@ -81,7 +80,6 @@ const Form = _ref => {
81
80
  const context = (0, _react.useContext)(_withFormSecurity.FormSecurityContext);
82
81
  const formRef = (0, _react.useRef)(null);
83
82
  const fieldsValidators = (0, _react.useRef)({});
84
- const tabsWithErrorRef = (0, _react.useRef)([]);
85
83
  const usedData = useInternalState ? data : dataSource;
86
84
  const getValidatesErrorMessages = (validators, fieldValue) => {
87
85
  const validatorsArray = !(validators instanceof Array) ? [validators] : validators;
@@ -96,7 +94,7 @@ const Form = _ref => {
96
94
  };
97
95
  const getErrorMessages = (currentData, currentValidators) => {
98
96
  const dataValidate = currentData || usedData;
99
- let currentFieldErrors = _lodash.default.pickBy(fieldErrors, (__, fieldName) => {
97
+ let currentFieldErrors = _lodash.default.pickBy(fieldErrors, (error, fieldName) => {
100
98
  const fieldValidatorsNames = Object.keys(currentValidators);
101
99
  return fieldValidatorsNames.includes(fieldName);
102
100
  });
@@ -185,23 +183,6 @@ const Form = _ref => {
185
183
  event.preventDefault();
186
184
  if (_lodash.default.isEqual(usedData, originalData)) return;
187
185
  };
188
- const onValidateTabErrors = (0, _react.useCallback)(props => {
189
- if (!props.tabId) return;
190
- const tabIndex = [...tabsWithErrorRef.current].findIndex(tab => tab.name === props.name);
191
- if (tabIndex !== -1) {
192
- const novasTabs = [...tabsWithErrorRef.current];
193
- novasTabs[tabIndex] = props;
194
- tabsWithErrorRef.current = [...novasTabs];
195
- } else {
196
- tabsWithErrorRef.current = [...tabsWithErrorRef.current, props];
197
- }
198
- if (onValidateErrorsOnTab) {
199
- const tabIdsWithErrors = _lodash.default.uniq(_lodash.default.compact(tabsWithErrorRef.current.map(tab => {
200
- if (tab.hasErrors) return String(tab.tabId);
201
- })));
202
- onValidateErrorsOnTab(tabIdsWithErrors);
203
- }
204
- }, [onValidateErrorsOnTab]);
205
186
  const formProps = () => {
206
187
  let propsForm = null;
207
188
  if (!disabled) {
@@ -232,9 +213,7 @@ const Form = _ref => {
232
213
  if (onDataChange && useInternalState) onDataChange(usedData);
233
214
 
234
215
  // TODO - Usar debounce para evitar chamada a cada letra digitada
235
- if (onValidateForm) {
236
- onValidateForm(checkIsValid(usedData, true));
237
- }
216
+ if (onValidateForm) onValidateForm(checkIsValid(usedData, true));
238
217
  if (!disabled) {
239
218
  handlerSubmit(onFormSubmit);
240
219
  if (handlerReset) handlerReset(onReset);
@@ -250,13 +229,10 @@ const Form = _ref => {
250
229
  }, [JSON.stringify(dataSource), useInternalState]);
251
230
  (0, _react.useEffect)(() => {
252
231
  if (securityBeforeUnload) {
253
- if (Object.entries(context).length) context.setSecurityBeforeUnload(true);
232
+ if (context) context.setSecurityBeforeUnload(true);
254
233
  window.addEventListener('beforeunload', onBeforeUnload);
255
234
  }
256
- return () => {
257
- if (securityBeforeUnload && Object.entries(context).length) context.setSecurityBeforeUnload(false);
258
- window.removeEventListener('beforeunload', onBeforeUnload);
259
- };
235
+ return () => window.removeEventListener('beforeunload', onBeforeUnload);
260
236
  }, [securityBeforeUnload, onBeforeUnload]);
261
237
  (0, _react.useEffect)(() => {
262
238
  if (!disabled && submitOnPressEnterKey !== submitFormOnEnter) {
@@ -274,7 +250,6 @@ const Form = _ref => {
274
250
  skeletonize,
275
251
  handlerFieldChange: onFieldChange,
276
252
  handlerFieldValidate: onValidate,
277
- handleValidationErrorsOnTab: onValidateTabErrors,
278
253
  handlerStoreValidators: (fieldName, fieldValidates) => {
279
254
  fieldsValidators.current = _objectSpread(_objectSpread({}, fieldsValidators.current), {}, {
280
255
  [fieldName]: fieldValidates