linear-react-components-ui 1.1.20-beta.35 → 1.1.20-beta.37
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/lib/alerts/BaseAlert.js +1 -1
- package/lib/alerts/Message.js +1 -1
- package/lib/assets/styles/wizard.scss +88 -2
- package/lib/avatar/index.js +9 -8
- package/lib/badge/index.js +4 -4
- package/lib/buttons/DangerButton.js +1 -1
- package/lib/buttons/DefaultButton.js +22 -3
- package/lib/buttons/InfoButton.js +1 -1
- package/lib/buttons/PrimaryButton.js +1 -1
- package/lib/buttons/SuccessButton.js +1 -1
- package/lib/buttons/WarningButton.js +1 -1
- package/lib/buttons/button_container/index.js +1 -1
- package/lib/buttons/split_button/index.js +1 -1
- package/lib/calendar/base/Day.js +1 -1
- package/lib/calendar/base/Month.js +1 -1
- package/lib/calendar/base/helpers.js +2 -2
- package/lib/calendar/base/index.js +1 -1
- package/lib/checkbox/index.js +1 -1
- package/lib/dialog/Custom.js +1 -1
- package/lib/dialog/Question.js +2 -4
- package/lib/dialog/base/Content.js +1 -1
- package/lib/dialog/base/Header.js +2 -2
- package/lib/dialog/base/index.js +8 -5
- package/lib/dialog/form/index.js +2 -2
- package/lib/dialog/types.d.ts +2 -0
- package/lib/dialog/wizard/index.d.ts +1 -1
- package/lib/dialog/wizard/index.js +5 -3
- package/lib/dialog/wizard/progressbar.d.ts +2 -1
- package/lib/dialog/wizard/progressbar.js +5 -3
- package/lib/dialog/wizard/step.js +1 -1
- package/lib/drawer/Drawer.js +3 -3
- package/lib/drawer/Header.js +1 -1
- package/lib/dropdown/Popup.js +6 -6
- package/lib/dropdown/helper.js +1 -1
- package/lib/dropdown/withDropdown.js +2 -2
- package/lib/fieldset/index.js +7 -7
- package/lib/form/Field.js +3 -14
- package/lib/form/FieldArray.js +1 -1
- package/lib/form/FieldNumber.js +7 -10
- package/lib/form/FieldPeriod.js +2 -2
- package/lib/form/index.js +20 -15
- package/lib/gridlayout/GridCol.js +5 -5
- package/lib/gridlayout/GridRow.js +4 -1
- package/lib/hint/index.js +7 -1
- package/lib/icons/helper.d.ts +4 -0
- package/lib/icons/helper.js +4 -0
- package/lib/icons/index.js +24 -27
- package/lib/inputs/base/InputTextBase.js +6 -8
- package/lib/inputs/base/Label.js +1 -1
- package/lib/inputs/base/helpers.js +7 -3
- package/lib/inputs/date/helpers.js +4 -1
- package/lib/inputs/date/index.js +9 -15
- package/lib/inputs/errorMessage/index.js +1 -1
- package/lib/inputs/file/DefaultFile.js +5 -6
- package/lib/inputs/file/DragDropFile.js +15 -17
- package/lib/inputs/file/File.js +3 -4
- package/lib/inputs/mask/BaseMask.js +4 -1
- package/lib/inputs/mask/helpers.d.ts +1 -1
- package/lib/inputs/multiSelect/Dropdown.js +9 -10
- package/lib/inputs/multiSelect/helper.js +1 -2
- package/lib/inputs/multiSelect/index.js +7 -9
- package/lib/inputs/number/index.js +1 -2
- package/lib/inputs/period/PeriodList.js +1 -1
- package/lib/inputs/period/helper.js +3 -1
- package/lib/inputs/period/index.js +9 -14
- package/lib/inputs/search/index.js +1 -1
- package/lib/inputs/select/Dropdown.js +1 -1
- package/lib/inputs/select/helper.js +10 -13
- package/lib/inputs/select/multiple/Selecteds.js +1 -1
- package/lib/inputs/select/multiple/index.js +9 -14
- package/lib/inputs/select/simple/index.js +10 -17
- package/lib/inputs/textarea/index.js +1 -1
- package/lib/internals/withTooltip.js +9 -9
- package/lib/labelMessages/index.js +4 -3
- package/lib/labels/DefaultLabel.js +4 -1
- package/lib/labels/label_container/index.js +1 -1
- package/lib/list/Header.js +1 -1
- package/lib/list/Item.js +21 -11
- package/lib/list/index.js +2 -1
- package/lib/list/types.d.ts +2 -1
- package/lib/menus/float/MenuItem.js +2 -2
- package/lib/menus/float/SubMenuContainer.js +1 -1
- package/lib/menus/float/index.js +1 -1
- package/lib/menus/sidenav/ExpandMenu.js +1 -1
- package/lib/menus/sidenav/NavMenuGroup.js +1 -1
- package/lib/menus/sidenav/NavMenuItem.js +27 -25
- package/lib/menus/sidenav/NavSubMenuItem.js +1 -1
- package/lib/menus/sidenav/helpers.js +1 -1
- package/lib/menus/sidenav/index.js +39 -31
- package/lib/menus/sidenav/types.d.ts +1 -0
- package/lib/panel/Content.js +5 -7
- package/lib/panel/Default.js +2 -2
- package/lib/panel/Header.js +3 -3
- package/lib/permissionValidations.js +1 -1
- package/lib/popover/index.js +1 -1
- package/lib/progress/Bar.js +6 -6
- package/lib/radio/index.js +2 -2
- package/lib/shortcuts/index.js +1 -1
- package/lib/skeleton/SkeletonContainer.js +2 -1
- package/lib/skeleton/index.js +4 -1
- package/lib/spinner/index.js +2 -2
- package/lib/split/Split.js +1 -1
- package/lib/split/SplitSide.js +3 -3
- package/lib/table/Body.js +3 -3
- package/lib/table/Header.js +8 -11
- package/lib/table/HeaderColumn.js +1 -1
- package/lib/table/Row.js +3 -3
- package/lib/table/RowColumn.js +1 -1
- package/lib/table/index.js +6 -1
- package/lib/tabs/DropdownTabs.js +1 -1
- package/lib/tabs/Menu.js +1 -1
- package/lib/tabs/MenuTabs.js +2 -2
- package/lib/tabs/Panel.js +5 -7
- package/lib/tabs/context.js +3 -6
- package/lib/textContent/index.js +4 -2
- package/lib/toolbar/ButtonBar.js +1 -1
- package/lib/toolbar/index.js +1 -1
- package/lib/tooltip/index.js +7 -7
- package/lib/treetable/Body.js +1 -1
- package/lib/treetable/Header.js +2 -2
- package/lib/treetable/Row.js +8 -8
- package/lib/treeview/Header.js +1 -1
- package/lib/treeview/Node.js +5 -5
- package/lib/treeview/index.js +4 -4
- package/lib/uitour/index.js +6 -8
- package/package.json +1 -1
- package/lib/checkbox/Label.js +0 -31
- package/lib/inputs/mask/imaskHOC.js +0 -203
- package/lib/menus/sidenav/popup_menu_help/index.js +0 -85
- package/lib/tabs/DropdownItems.js +0 -62
- package/lib/tabs/MenuItems.js +0 -70
- package/lib/treeview_old/Header.js +0 -29
- package/lib/treeview_old/Node.js +0 -68
- package/lib/treeview_old/index.js +0 -43
package/lib/dropdown/Popup.js
CHANGED
|
@@ -20,11 +20,11 @@ const getCalendarDropdownStyle = _ref => {
|
|
|
20
20
|
isFloatMenu,
|
|
21
21
|
minWidth
|
|
22
22
|
} = _ref;
|
|
23
|
-
let style =
|
|
23
|
+
let style = `top: ${topPosition + (isFloatMenu ? 6 : 2)}px; min-width: ${minWidth}px;`;
|
|
24
24
|
if (align === 'left') {
|
|
25
|
-
style +=
|
|
25
|
+
style += `left: ${leftPosition}px;`;
|
|
26
26
|
} else if (align === 'right') {
|
|
27
|
-
style +=
|
|
27
|
+
style += `right: ${rightPosition}px;`;
|
|
28
28
|
}
|
|
29
29
|
return style;
|
|
30
30
|
};
|
|
@@ -42,7 +42,7 @@ const DropdownPopup = _ref2 => {
|
|
|
42
42
|
} = _ref2,
|
|
43
43
|
props = _objectWithoutProperties(_ref2, _excluded);
|
|
44
44
|
const popup = (0, _react.useRef)(document.createElement('div'));
|
|
45
|
-
popup.current.className =
|
|
45
|
+
popup.current.className = `dropdown-component ${customClassForDropdown}`;
|
|
46
46
|
popup.current.dataset.testid = 'dropdown-component';
|
|
47
47
|
popup.current.style.cssText = getCalendarDropdownStyle({
|
|
48
48
|
topPosition,
|
|
@@ -55,11 +55,11 @@ const DropdownPopup = _ref2 => {
|
|
|
55
55
|
if (popup && popup.current) {
|
|
56
56
|
const modalContainers = document.body.getElementsByClassName('modalcontainer');
|
|
57
57
|
const lastModalContainer = modalContainers[modalContainers.length - 1];
|
|
58
|
-
popup.current.style.zIndex =
|
|
58
|
+
popup.current.style.zIndex = `${modalContainers.length ? Number(lastModalContainer.style.zIndex) + 1 : 99999}`;
|
|
59
59
|
}
|
|
60
60
|
(0, _react.useEffect)(() => {
|
|
61
61
|
body.appendChild(popup.current);
|
|
62
|
-
popup.current.id = id ||
|
|
62
|
+
popup.current.id = id || `dropdown-component-${(0, _uuid.v1)()}`;
|
|
63
63
|
return () => {
|
|
64
64
|
body.removeChild(popup.current);
|
|
65
65
|
};
|
package/lib/dropdown/helper.js
CHANGED
|
@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.getDropdownItemCssClass = exports.contentClass = void 0;
|
|
7
|
-
const contentClass = showClearButton =>
|
|
7
|
+
const contentClass = showClearButton => `content ${showClearButton ? '' : 'noclear'}`;
|
|
8
8
|
exports.contentClass = contentClass;
|
|
9
9
|
const getDropdownItemCssClass = (selected, disabled, striped) => {
|
|
10
10
|
let className = 'item';
|
|
@@ -38,7 +38,7 @@ const withDropdown = WrappedComponent => {
|
|
|
38
38
|
const {
|
|
39
39
|
target
|
|
40
40
|
} = event;
|
|
41
|
-
if (popupRef
|
|
41
|
+
if (popupRef?.current && target !== popupRef?.current && !event.composedPath().includes(popupRef.current) && wrappedComponentRef.current !== target) {
|
|
42
42
|
setOpened(false);
|
|
43
43
|
}
|
|
44
44
|
};
|
|
@@ -86,7 +86,7 @@ const withDropdown = WrappedComponent => {
|
|
|
86
86
|
value: contextValues
|
|
87
87
|
}, /*#__PURE__*/_react.default.createElement(WrappedComponent, _extends({}, props, newProps)));
|
|
88
88
|
};
|
|
89
|
-
EnhancedComponent.displayName =
|
|
89
|
+
EnhancedComponent.displayName = `withDropdown(${getDisplayName(WrappedComponent)})`;
|
|
90
90
|
return EnhancedComponent;
|
|
91
91
|
};
|
|
92
92
|
var _default = exports.default = withDropdown;
|
package/lib/fieldset/index.js
CHANGED
|
@@ -43,9 +43,9 @@ const Fieldset = props => {
|
|
|
43
43
|
customClass,
|
|
44
44
|
hasError
|
|
45
45
|
} = _ref;
|
|
46
|
-
let cssClass =
|
|
47
|
-
if (type) cssClass =
|
|
48
|
-
if (hasError) cssClass =
|
|
46
|
+
let cssClass = `fieldset-component ${customClass}`;
|
|
47
|
+
if (type) cssClass = `${cssClass} -${type}`;
|
|
48
|
+
if (hasError) cssClass = `${cssClass} -witherror`;
|
|
49
49
|
return cssClass;
|
|
50
50
|
};
|
|
51
51
|
const getContentStyle = _ref2 => {
|
|
@@ -55,11 +55,11 @@ const Fieldset = props => {
|
|
|
55
55
|
} = _ref2;
|
|
56
56
|
if (template === 'rows') {
|
|
57
57
|
return {
|
|
58
|
-
gridTemplateRows:
|
|
58
|
+
gridTemplateRows: `repeat(${rowsCount}, 1fr)`
|
|
59
59
|
};
|
|
60
60
|
} else if (template === 'columns') {
|
|
61
61
|
return {
|
|
62
|
-
gridTemplateColumns:
|
|
62
|
+
gridTemplateColumns: `repeat(${colsCount}, 1fr)`
|
|
63
63
|
};
|
|
64
64
|
}
|
|
65
65
|
return {};
|
|
@@ -70,9 +70,9 @@ const Fieldset = props => {
|
|
|
70
70
|
}, onDenied.hideContent ? /*#__PURE__*/_react.default.createElement(_noPermission.default, null) : /*#__PURE__*/_react.default.createElement(_react.Fragment, null, title && /*#__PURE__*/_react.default.createElement("legend", {
|
|
71
71
|
style: styleTitle,
|
|
72
72
|
align: titleAlign,
|
|
73
|
-
className:
|
|
73
|
+
className: `legend ${titleCustomClass}`
|
|
74
74
|
}, leftElements, title, rightElements), /*#__PURE__*/_react.default.createElement("div", {
|
|
75
|
-
className:
|
|
75
|
+
className: `contentfieldset -template${template} `,
|
|
76
76
|
style: Object.assign(getContentStyle(props), styleContent)
|
|
77
77
|
}, children)));
|
|
78
78
|
if (onDenied.unvisible) return null;
|
package/lib/form/Field.js
CHANGED
|
@@ -8,7 +8,6 @@ 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
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); }
|
|
@@ -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 (
|
|
43
|
+
if (validatorsArray && e.target && handlerFieldValidate) {
|
|
54
44
|
handlerFieldValidate(name, e.target.value, validatorsArray);
|
|
55
45
|
}
|
|
56
46
|
if (handlerFieldChange) handlerFieldChange(e);
|
|
@@ -115,8 +105,7 @@ const Field = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
|
|
|
115
105
|
validatorFromComponent,
|
|
116
106
|
handlerFieldValidate,
|
|
117
107
|
handlerFieldChange,
|
|
118
|
-
onChange
|
|
119
|
-
component: Component
|
|
108
|
+
onChange
|
|
120
109
|
}), getCustomProps(props, handlerSetValidatorFromComponent), {
|
|
121
110
|
ref: ref,
|
|
122
111
|
name: name,
|
package/lib/form/FieldArray.js
CHANGED
|
@@ -77,7 +77,7 @@ const FieldArray = props => {
|
|
|
77
77
|
if (!skipLabel && label) {
|
|
78
78
|
content = /*#__PURE__*/_react.default.createElement(_fieldset.default, {
|
|
79
79
|
title: label,
|
|
80
|
-
customClass:
|
|
80
|
+
customClass: `arraycontainer ${bordered && '-bordered'}`,
|
|
81
81
|
style: labelContainerStyle,
|
|
82
82
|
titleCustomClass: "label"
|
|
83
83
|
}, /*#__PURE__*/_react.default.createElement(Component, _extends({}, rest, getDefaultProps(props), {
|
package/lib/form/FieldNumber.js
CHANGED
|
@@ -4,14 +4,14 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
4
4
|
value: true
|
|
5
5
|
});
|
|
6
6
|
exports.default = void 0;
|
|
7
|
-
var _react =
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
8
|
var _lodash = _interopRequireDefault(require("lodash"));
|
|
9
9
|
var _withFieldHOC = _interopRequireDefault(require("./withFieldHOC"));
|
|
10
10
|
var _helpers = require("./helpers");
|
|
11
11
|
var constants = _interopRequireWildcard(require("../internals/constants"));
|
|
12
|
-
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
13
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); }
|
|
14
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
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
15
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); }
|
|
16
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; }
|
|
17
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; }
|
|
@@ -31,36 +31,33 @@ const getEventProps = _ref => {
|
|
|
31
31
|
} = _ref;
|
|
32
32
|
return {
|
|
33
33
|
onBlur: e => {
|
|
34
|
-
if (
|
|
34
|
+
if (component?.name !== 'NumberField' && handlerFieldChange) handlerFieldChange(e);
|
|
35
35
|
if (validators && handlerFieldValidate) handlerFieldValidate(name, e.target.value, validators);
|
|
36
36
|
if (onBlur) onBlur(e);
|
|
37
37
|
},
|
|
38
38
|
onKeyDown: e => {
|
|
39
39
|
if ([constants.keyCodes.ENTER].includes(e.keyCode)) {
|
|
40
|
-
if (validators) handlerFieldValidate
|
|
40
|
+
if (validators) handlerFieldValidate?.(name, e.target.value, validators);
|
|
41
41
|
if (onKeyDown) onKeyDown(e);
|
|
42
42
|
}
|
|
43
43
|
},
|
|
44
44
|
onChange: e => {
|
|
45
|
-
if (
|
|
45
|
+
if (component?.name === 'NumberField') {
|
|
46
46
|
if (validators && e.target && handlerFieldValidate) {
|
|
47
47
|
handlerFieldValidate(name, e.target.value, validators);
|
|
48
48
|
}
|
|
49
49
|
if (handlerFieldChange) handlerFieldChange(e);
|
|
50
|
-
if (onChange) onChange(e);
|
|
51
50
|
}
|
|
51
|
+
if (onChange) onChange(e);
|
|
52
52
|
}
|
|
53
53
|
};
|
|
54
54
|
};
|
|
55
55
|
const FieldMask = props => {
|
|
56
56
|
const {
|
|
57
57
|
data,
|
|
58
|
-
name
|
|
59
|
-
originalData
|
|
58
|
+
name
|
|
60
59
|
} = props;
|
|
61
60
|
const currentValue = _lodash.default.get(data, name);
|
|
62
|
-
const [showValidateMessages, setShowValidateMessages] = (0, _react.useState)(false);
|
|
63
|
-
const originalValue = _lodash.default.get(originalData, name);
|
|
64
61
|
return /*#__PURE__*/_react.default.createElement(props.component, _extends({}, props, getEventProps(_objectSpread({}, props)), {
|
|
65
62
|
errorMessages: (0, _helpers.getErrorMessages)(_objectSpread(_objectSpread({}, props), {}, {
|
|
66
63
|
fieldErrors: props.fieldErrors
|
package/lib/form/FieldPeriod.js
CHANGED
|
@@ -79,8 +79,8 @@ const FieldPeriod = props => {
|
|
|
79
79
|
});
|
|
80
80
|
},
|
|
81
81
|
value: {
|
|
82
|
-
initial: _lodash.default.get(data,
|
|
83
|
-
final: _lodash.default.get(data,
|
|
82
|
+
initial: _lodash.default.get(data, `${name}.${nameDateInitial}`),
|
|
83
|
+
final: _lodash.default.get(data, `${name}.${nameDateFinal}`)
|
|
84
84
|
}
|
|
85
85
|
}));
|
|
86
86
|
}
|
package/lib/form/index.js
CHANGED
|
@@ -29,6 +29,7 @@ Object.defineProperty(exports, "FieldPeriod", {
|
|
|
29
29
|
});
|
|
30
30
|
exports.default = void 0;
|
|
31
31
|
var _react = _interopRequireWildcard(require("react"));
|
|
32
|
+
var _uuid = require("uuid");
|
|
32
33
|
var _lodash = _interopRequireDefault(require("lodash"));
|
|
33
34
|
var _helpers = require("./helpers");
|
|
34
35
|
var _Field = _interopRequireDefault(require("./Field"));
|
|
@@ -69,14 +70,16 @@ const Form = _ref => {
|
|
|
69
70
|
children,
|
|
70
71
|
useInternalState = false
|
|
71
72
|
} = _ref;
|
|
73
|
+
const formId = (0, _uuid.v1)();
|
|
72
74
|
const [data, setData] = (0, _react.useState)(dataSource);
|
|
73
75
|
const [originalData, setOriginalData] = (0, _react.useState)(dataSource);
|
|
74
76
|
const [submitFormOnEnter, setSubmitFormOnEnter] = (0, _react.useState)(submitOnPressEnterKey);
|
|
75
77
|
const [fieldErrors, setFieldErrors] = (0, _react.useState)({});
|
|
76
|
-
const fieldsValidators = (0, _react.useRef)({});
|
|
77
78
|
const [oldFieldsValidatorsQuantity, setOldFieldsValidatorsQuantity] = (0, _react.useState)(0);
|
|
78
79
|
const [isValid, setIsValid] = (0, _react.useState)(false);
|
|
79
80
|
const context = (0, _react.useContext)(_withFormSecurity.FormSecurityContext);
|
|
81
|
+
const formRef = (0, _react.useRef)(null);
|
|
82
|
+
const fieldsValidators = (0, _react.useRef)({});
|
|
80
83
|
const usedData = useInternalState ? data : dataSource;
|
|
81
84
|
const getValidatesErrorMessages = (validators, fieldValue) => {
|
|
82
85
|
const validatorsArray = !(validators instanceof Array) ? [validators] : validators;
|
|
@@ -137,7 +140,10 @@ const Form = _ref => {
|
|
|
137
140
|
}
|
|
138
141
|
};
|
|
139
142
|
const onFormSubmit = (0, _react.useCallback)(event => {
|
|
140
|
-
if (event)
|
|
143
|
+
if (event) {
|
|
144
|
+
event.preventDefault();
|
|
145
|
+
event.stopPropagation();
|
|
146
|
+
}
|
|
141
147
|
if (checkIsValid(usedData)) onSubmit(usedData);
|
|
142
148
|
}, [usedData]);
|
|
143
149
|
const onResetField = (cb, fields) => {
|
|
@@ -175,23 +181,20 @@ const Form = _ref => {
|
|
|
175
181
|
const onBeforeUnload = e => {
|
|
176
182
|
const event = e;
|
|
177
183
|
event.preventDefault();
|
|
178
|
-
if (_lodash.default.isEqual(usedData, originalData))
|
|
179
|
-
return;
|
|
180
|
-
}
|
|
181
|
-
event.returnValue = true;
|
|
182
|
-
};
|
|
183
|
-
const submitOnEnter = event => {
|
|
184
|
-
if (event.key === 'Enter') {
|
|
185
|
-
event.preventDefault();
|
|
186
|
-
if (submitFormOnEnter) onFormSubmit();
|
|
187
|
-
}
|
|
184
|
+
if (_lodash.default.isEqual(usedData, originalData)) return;
|
|
188
185
|
};
|
|
189
186
|
const formProps = () => {
|
|
190
187
|
let propsForm = null;
|
|
191
188
|
if (!disabled) {
|
|
192
189
|
propsForm = {
|
|
193
190
|
onSubmit: event => event.preventDefault(),
|
|
194
|
-
onKeyPress: event =>
|
|
191
|
+
onKeyPress: event => {
|
|
192
|
+
if (event && event.key === 'Enter') {
|
|
193
|
+
event.preventDefault();
|
|
194
|
+
event.stopPropagation();
|
|
195
|
+
if (submitFormOnEnter) onFormSubmit();
|
|
196
|
+
}
|
|
197
|
+
}
|
|
195
198
|
};
|
|
196
199
|
}
|
|
197
200
|
return propsForm;
|
|
@@ -237,7 +240,7 @@ const Form = _ref => {
|
|
|
237
240
|
}
|
|
238
241
|
}, [submitOnPressEnterKey]);
|
|
239
242
|
(0, _react.useEffect)(() => {
|
|
240
|
-
const validatorsQuantity = Object.values(fieldsValidators.current).reduce((acc, currentValue) => acc + (
|
|
243
|
+
const validatorsQuantity = Object.values(fieldsValidators.current).reduce((acc, currentValue) => acc + (currentValue?.length || 0), 0);
|
|
241
244
|
if (fieldsValidators.current && onValidateForm && oldFieldsValidatorsQuantity !== validatorsQuantity) {
|
|
242
245
|
setOldFieldsValidatorsQuantity(validatorsQuantity);
|
|
243
246
|
onValidateForm(checkIsValid(usedData, true, fieldsValidators.current));
|
|
@@ -262,10 +265,12 @@ const Form = _ref => {
|
|
|
262
265
|
return /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_helpers.FormContext.Provider, {
|
|
263
266
|
value: contextValues
|
|
264
267
|
}, /*#__PURE__*/_react.default.createElement("form", _extends({
|
|
268
|
+
id: formId,
|
|
269
|
+
ref: formRef,
|
|
265
270
|
style: style
|
|
266
271
|
}, formProps(), {
|
|
267
272
|
role: "presentation",
|
|
268
|
-
className:
|
|
273
|
+
className: `form-component ${customClass}`
|
|
269
274
|
}), children)), /*#__PURE__*/_react.default.createElement(_dialog.DialogQuestion, {
|
|
270
275
|
zIndex: "99999999",
|
|
271
276
|
title: securityTitle || 'Dados Alterados',
|
|
@@ -10,10 +10,10 @@ function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e
|
|
|
10
10
|
const getClass = col => {
|
|
11
11
|
const cols = col ? col.split(' ') : [];
|
|
12
12
|
let classes = 'grid-container ';
|
|
13
|
-
if (cols[0]) classes +=
|
|
14
|
-
if (cols[1]) classes +=
|
|
15
|
-
if (cols[2]) classes +=
|
|
16
|
-
if (cols[3]) classes +=
|
|
13
|
+
if (cols[0]) classes += `col-xs-${cols[0]}`;
|
|
14
|
+
if (cols[1]) classes += ` col-sm-${cols[1]}`;
|
|
15
|
+
if (cols[2]) classes += ` col-md-${cols[2]}`;
|
|
16
|
+
if (cols[3]) classes += ` col-lg-${cols[3]}`;
|
|
17
17
|
return classes;
|
|
18
18
|
};
|
|
19
19
|
const GridCol = props => {
|
|
@@ -27,7 +27,7 @@ const GridCol = props => {
|
|
|
27
27
|
const gridClasses = getClass(cols || '');
|
|
28
28
|
if (!visible) return null;
|
|
29
29
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
30
|
-
className:
|
|
30
|
+
className: `${customClass} ${gridClasses}`,
|
|
31
31
|
style: style
|
|
32
32
|
}, children);
|
|
33
33
|
};
|
|
@@ -12,7 +12,10 @@ function _objectSpread(e) { for (var r = 1; r < arguments.length; r++) { var t =
|
|
|
12
12
|
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; }
|
|
13
13
|
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
14
14
|
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); }
|
|
15
|
-
const getClass = props =>
|
|
15
|
+
const getClass = props => `row ${props.customClass}
|
|
16
|
+
${props.withTrim && ' -withtrim'}
|
|
17
|
+
${props.verticalAlign && ` align-items-${props.verticalAlign}`}
|
|
18
|
+
${props.horizontalAlign && ` justify-content-${props.horizontalAlign}`}`;
|
|
16
19
|
const GridRow = props => {
|
|
17
20
|
const {
|
|
18
21
|
style,
|
package/lib/hint/index.js
CHANGED
|
@@ -22,7 +22,13 @@ const Hint = _ref => {
|
|
|
22
22
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
23
23
|
"aria-disabled": disabled,
|
|
24
24
|
style: style,
|
|
25
|
-
className:
|
|
25
|
+
className: `
|
|
26
|
+
hint-component
|
|
27
|
+
${customClass}
|
|
28
|
+
${skeletonize ? '-skeletonized' : ''}
|
|
29
|
+
${disabled ? '-disabled' : ''}
|
|
30
|
+
-${color}
|
|
31
|
+
`
|
|
26
32
|
}, Array.isArray(description) ? (0, _helpers.showHintList)(description) : /*#__PURE__*/_react.default.createElement("span", {
|
|
27
33
|
"aria-disabled": disabled
|
|
28
34
|
}, description));
|
package/lib/icons/helper.d.ts
CHANGED
package/lib/icons/helper.js
CHANGED
|
@@ -632,5 +632,9 @@ var _default = exports.default = {
|
|
|
632
632
|
bank: {
|
|
633
633
|
viewbox: '0 0 16 16',
|
|
634
634
|
paths: ['M16 15v-1h-1v-6h1v-1h-3v1h1v6h-3v-6h1v-1h-3v1h1v6h-3v-6h1v-1h-3v1h1v6h-3v-6h1v-1h-3v1h1v6h-1v1h-1v1h17v-1h-1z', 'M8 0h1l8 5v1h-17v-1l8-5z']
|
|
635
|
+
},
|
|
636
|
+
earth: {
|
|
637
|
+
viewbox: '0 0 16 16',
|
|
638
|
+
paths: ['M8 0c-4.418 0-8 3.582-8 8s3.582 8 8 8 8-3.582 8-8-3.582-8-8-8zM8 15c-0.984 0-1.92-0.203-2.769-0.57l3.643-4.098c0.081-0.092 0.126-0.21 0.126-0.332v-1.5c0-0.276-0.224-0.5-0.5-0.5-1.765 0-3.628-1.835-3.646-1.854-0.094-0.094-0.221-0.146-0.354-0.146h-2c-0.276 0-0.5 0.224-0.5 0.5v3c0 0.189 0.107 0.363 0.276 0.447l1.724 0.862v2.936c-1.813-1.265-3-3.366-3-5.745 0-1.074 0.242-2.091 0.674-3h1.826c0.133 0 0.26-0.053 0.354-0.146l2-2c0.094-0.094 0.146-0.221 0.146-0.354v-1.21c0.634-0.189 1.305-0.29 2-0.29 1.1 0 2.141 0.254 3.067 0.706-0.065 0.055-0.128 0.112-0.188 0.172-0.567 0.567-0.879 1.32-0.879 2.121s0.312 1.555 0.879 2.121c0.569 0.569 1.332 0.879 2.119 0.879 0.049 0 0.099-0.001 0.149-0.004 0.216 0.809 0.605 2.917-0.131 5.818-0.007 0.027-0.011 0.055-0.013 0.082-1.271 1.298-3.042 2.104-5.002 2.104z']
|
|
635
639
|
}
|
|
636
640
|
};
|
package/lib/icons/index.js
CHANGED
|
@@ -34,38 +34,35 @@ const Icon = _ref => {
|
|
|
34
34
|
const isUsingColorStyle = colorStyle !== 'default';
|
|
35
35
|
const colorFromProp = isUsingColorStyle || !color ? undefined : color;
|
|
36
36
|
const refSvg = (0, _react.useRef)(null);
|
|
37
|
-
const viewBoxFromIconOrSvgStrcut = name ? listIcon[name].viewbox : svgStruct
|
|
38
|
-
const getPaths = () => name ? listIcon[name].paths : svgStruct
|
|
39
|
-
const getSvg = () => {
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
key: value
|
|
61
|
-
})));
|
|
62
|
-
};
|
|
37
|
+
const viewBoxFromIconOrSvgStrcut = name ? listIcon[name].viewbox : svgStruct?.viewbox;
|
|
38
|
+
const getPaths = () => name ? listIcon[name].paths : svgStruct?.paths;
|
|
39
|
+
const getSvg = () => /*#__PURE__*/_react.default.createElement("svg", {
|
|
40
|
+
"data-testid": "icon",
|
|
41
|
+
"data-color-style": colorStyle,
|
|
42
|
+
onClick: () => {
|
|
43
|
+
if (onClick && !disabled) onClick();
|
|
44
|
+
},
|
|
45
|
+
ref: r => {
|
|
46
|
+
refSvg.current = r;
|
|
47
|
+
},
|
|
48
|
+
width: `${size}px`,
|
|
49
|
+
height: `${size}px`,
|
|
50
|
+
fill: disabled ? disabledIconColor : colorFromProp,
|
|
51
|
+
viewBox: viewBox || viewBoxFromIconOrSvgStrcut,
|
|
52
|
+
className: `icon-component ${customClass}`,
|
|
53
|
+
pointerEvents: pointerEvents,
|
|
54
|
+
style: style
|
|
55
|
+
}, getPaths()?.map(value => /*#__PURE__*/_react.default.createElement("path", {
|
|
56
|
+
"data-testid": "icon-path",
|
|
57
|
+
d: value,
|
|
58
|
+
key: value
|
|
59
|
+
})));
|
|
63
60
|
if (color && colorStyle !== 'default') throw new Error('Expected only one of the two properties: colorStyle or color');
|
|
64
61
|
if (!name && !svgStruct) throw new Error('One of the "name" and "svgStruct" props must be filled');
|
|
65
62
|
if (!visible) return null;
|
|
66
63
|
if (!tooltip) return getSvg();
|
|
67
64
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
68
|
-
className:
|
|
65
|
+
className: `icon-component-container ${customClassForContainer}`,
|
|
69
66
|
ref: r => {
|
|
70
67
|
if (targetRef && r) targetRef(r);
|
|
71
68
|
}
|
|
@@ -122,13 +122,11 @@ const InputTextBase = props => {
|
|
|
122
122
|
if (!disableCallbacks) {
|
|
123
123
|
propsInput = _objectSpread(_objectSpread({}, propsInput), {}, {
|
|
124
124
|
onFocus: e => {
|
|
125
|
-
|
|
126
|
-
(_props$onInputReceive = props.onInputReceiveFocus) === null || _props$onInputReceive === void 0 ? void 0 : _props$onInputReceive.call(props);
|
|
125
|
+
props.onInputReceiveFocus?.();
|
|
127
126
|
if (props.onFocus) props.onFocus(e);
|
|
128
127
|
},
|
|
129
128
|
onBlur: e => {
|
|
130
|
-
|
|
131
|
-
(_props$onInputLostFoc = props.onInputLostFocus) === null || _props$onInputLostFoc === void 0 ? void 0 : _props$onInputLostFoc.call(props);
|
|
129
|
+
props.onInputLostFocus?.();
|
|
132
130
|
if (props.onBlur) props.onBlur(e);
|
|
133
131
|
},
|
|
134
132
|
onKeyDown: e => {
|
|
@@ -192,7 +190,7 @@ const InputTextBase = props => {
|
|
|
192
190
|
if (!visible || unvisible) return null;
|
|
193
191
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
194
192
|
style: style,
|
|
195
|
-
className:
|
|
193
|
+
className: `input-base-component ${skeletonize ? '-skeletonized' : ''} ${customClass}`,
|
|
196
194
|
ref: inputBaseRef
|
|
197
195
|
}, label && /*#__PURE__*/_react.default.createElement("div", {
|
|
198
196
|
className: "labelcontainer",
|
|
@@ -214,7 +212,7 @@ const InputTextBase = props => {
|
|
|
214
212
|
display: 'flex'
|
|
215
213
|
}
|
|
216
214
|
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
217
|
-
className:
|
|
215
|
+
className: `label ${customClassForLabel} ${labelUppercase && ' -uppercase'}`,
|
|
218
216
|
style: {
|
|
219
217
|
alignSelf: 'center'
|
|
220
218
|
}
|
|
@@ -238,11 +236,11 @@ const InputTextBase = props => {
|
|
|
238
236
|
}))
|
|
239
237
|
}, leftElements && /*#__PURE__*/_react.default.createElement("div", {
|
|
240
238
|
style: styleForSideButtons,
|
|
241
|
-
className:
|
|
239
|
+
className: `sidebuttons ${customClassForSideButtons}`
|
|
242
240
|
}, leftElements), /*#__PURE__*/_react.default.createElement("div", {
|
|
243
241
|
"data-testid": "testInputContent",
|
|
244
242
|
style: styleForInputContent,
|
|
245
|
-
className:
|
|
243
|
+
className: `inputcontent ${customClassForInputContent}`
|
|
246
244
|
}, type === 'textarea' ? /*#__PURE__*/_react.default.createElement("textarea", _extends({
|
|
247
245
|
rows: props.rows,
|
|
248
246
|
cols: props.cols,
|
package/lib/inputs/base/Label.js
CHANGED
|
@@ -27,7 +27,7 @@ const Label = props => {
|
|
|
27
27
|
}
|
|
28
28
|
},
|
|
29
29
|
onMouseEnter: onHoverLabel,
|
|
30
|
-
className:
|
|
30
|
+
className: `label ${customClassForLabel} ${labelUppercase && ' -uppercase'}`
|
|
31
31
|
}, label, required && /*#__PURE__*/_react.default.createElement("span", {
|
|
32
32
|
className: "-requiredlabel"
|
|
33
33
|
}, "*"));
|
|
@@ -13,7 +13,7 @@ const getInputClass = _ref => {
|
|
|
13
13
|
readOnly,
|
|
14
14
|
readOnlyClass
|
|
15
15
|
} = _ref;
|
|
16
|
-
return
|
|
16
|
+
return `textinput text-align-${textAlign} ${readOnlyClass} ${readOnly ? ' -readonly' : ''}`;
|
|
17
17
|
};
|
|
18
18
|
exports.getInputClass = getInputClass;
|
|
19
19
|
const getInputWrapperClass = props => {
|
|
@@ -24,7 +24,11 @@ const getInputWrapperClass = props => {
|
|
|
24
24
|
errorMessages,
|
|
25
25
|
disabled
|
|
26
26
|
} = props;
|
|
27
|
-
return
|
|
27
|
+
return `inputwrapper ${inputHasFocus && ' -focusable'}
|
|
28
|
+
${customClassForWrapper}
|
|
29
|
+
${errorMessages && errorMessages.length > 0 && ' -requirederror'}
|
|
30
|
+
${rounded && ' -roundedborders'}
|
|
31
|
+
${disabled && ' -disabled'}`;
|
|
28
32
|
};
|
|
29
33
|
exports.getInputWrapperClass = getInputWrapperClass;
|
|
30
34
|
const getRightElements = (errorMessages, skeletonize, rightElements) => {
|
|
@@ -34,7 +38,7 @@ const getRightElements = (errorMessages, skeletonize, rightElements) => {
|
|
|
34
38
|
elements = [elements];
|
|
35
39
|
}
|
|
36
40
|
elements = elements.map((element, index) => element && /*#__PURE__*/_react.default.cloneElement(element, {
|
|
37
|
-
key:
|
|
41
|
+
key: `rightelement-${index + 1}`
|
|
38
42
|
}));
|
|
39
43
|
if (errorMessages) return elements;
|
|
40
44
|
return elements;
|
|
@@ -15,7 +15,10 @@ const getCalendarDropdownStyle = _ref => {
|
|
|
15
15
|
width,
|
|
16
16
|
minWidth
|
|
17
17
|
} = _ref;
|
|
18
|
-
return
|
|
18
|
+
return `top: ${topPosition}px;
|
|
19
|
+
left: ${leftPosition}px;
|
|
20
|
+
width: ${width}px;
|
|
21
|
+
min-width: ${minWidth}px;`;
|
|
19
22
|
};
|
|
20
23
|
exports.getCalendarDropdownStyle = getCalendarDropdownStyle;
|
|
21
24
|
const getMomentValue = value => {
|