linear-react-components-ui 1.0.12-beta.2 → 1.0.12-beta.3
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/@types/PointerEvents.d.ts +1 -1
- package/lib/assets/styles/multiSelect.scss +1 -1
- package/lib/assets/styles/select.scss +1 -1
- package/lib/assets/styles/sidenav.scss +4 -4
- package/lib/buttons/button_container/index.js +1 -0
- package/lib/dialog/Custom.js +1 -1
- package/lib/dialog/form/index.js +1 -1
- package/lib/dialog/types.d.ts +2 -2
- package/lib/form/FieldNumber.js +3 -6
- package/lib/icons/index.d.ts +6 -2
- package/lib/icons/index.js +25 -5
- package/lib/icons/types.d.ts +6 -0
- package/lib/inputs/mask/BaseMask.js +6 -20
- package/lib/inputs/mask/types.d.ts +0 -1
- package/lib/inputs/number/BaseNumber.js +1 -8
- package/lib/inputs/number/types.d.ts +0 -1
- package/lib/menus/sidenav/NavMenuItem.js +1 -0
- package/package.json +1 -1
|
@@ -1,3 +1,3 @@
|
|
|
1
|
-
type PointerEvents = 'none' | 'all' | 'fill' | 'painted' | 'stroke' | 'visible' | 'visibleFill' | 'visiblePainted' | 'visibleStroke' | 'inherit' | 'initial' | 'unset';
|
|
1
|
+
type PointerEvents = 'none' | 'all' | 'fill' | 'painted' | 'stroke' | 'visible' | 'visibleFill' | 'visiblePainted' | 'visibleStroke' | 'inherit' | 'initial' | 'unset' | 'auto';
|
|
2
2
|
|
|
3
3
|
export { PointerEvents };
|
|
@@ -48,9 +48,9 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
|
|
|
48
48
|
> .item:hover {
|
|
49
49
|
background-color: #eee;
|
|
50
50
|
}
|
|
51
|
-
> .item:hover > .menuicon,
|
|
51
|
+
> .item:hover > .icon-component-container > .menuicon,
|
|
52
52
|
> .item:hover .searchmenuicon,
|
|
53
|
-
> .item:hover > .menulink > .menuicon,
|
|
53
|
+
> .item:hover > .menulink > .icon-component-container > .menuicon,
|
|
54
54
|
> .item:hover > .menulink .searchmenuicon {
|
|
55
55
|
fill: rgb(114, 114, 114);
|
|
56
56
|
}
|
|
@@ -132,7 +132,7 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
|
|
|
132
132
|
align-items: center;
|
|
133
133
|
text-decoration: none;
|
|
134
134
|
}
|
|
135
|
-
> .menuicon {
|
|
135
|
+
> .icon-component-container > .menuicon {
|
|
136
136
|
justify-self: center;
|
|
137
137
|
}
|
|
138
138
|
> .title,
|
|
@@ -164,7 +164,7 @@ que utilizam. Em caso de mudança, ficar atento para os refatores.
|
|
|
164
164
|
align-items: center;
|
|
165
165
|
}
|
|
166
166
|
> .menuicon,
|
|
167
|
-
> .menulink > .menuicon {
|
|
167
|
+
> .menulink > .icon-component-container > .menuicon {
|
|
168
168
|
justify-self: center;
|
|
169
169
|
}
|
|
170
170
|
}
|
|
@@ -25,6 +25,7 @@ var ButtonContainer = function ButtonContainer(_ref) {
|
|
|
25
25
|
position = _ref$position === void 0 ? 'left' : _ref$position,
|
|
26
26
|
children = _ref.children;
|
|
27
27
|
return /*#__PURE__*/_react.default.createElement("div", {
|
|
28
|
+
"data-testid": "button-container",
|
|
28
29
|
className: "btn-container ".concat(customClass),
|
|
29
30
|
style: getStyles(style, position)
|
|
30
31
|
}, children);
|
package/lib/dialog/Custom.js
CHANGED
|
@@ -44,7 +44,7 @@ var Custom = function Custom(props) {
|
|
|
44
44
|
className: "title"
|
|
45
45
|
}, props.title), /*#__PURE__*/_react.default.createElement("div", {
|
|
46
46
|
className: "text"
|
|
47
|
-
}, props.text)), /*#__PURE__*/_react.default.createElement(_Footer.default, props, /*#__PURE__*/_react.default.createElement(_buttons.ButtonContainer, {
|
|
47
|
+
}, props.text)), props.buttons && props.buttons.length > 0 && /*#__PURE__*/_react.default.createElement(_Footer.default, props, /*#__PURE__*/_react.default.createElement(_buttons.ButtonContainer, {
|
|
48
48
|
position: "right"
|
|
49
49
|
}, props.buttons.map(function (button) {
|
|
50
50
|
return /*#__PURE__*/_react.default.cloneElement(button, {
|
package/lib/dialog/form/index.js
CHANGED
|
@@ -68,7 +68,7 @@ var ModalForm = function ModalForm(props) {
|
|
|
68
68
|
handlerClose: props.handlerClose
|
|
69
69
|
}, props))), /*#__PURE__*/_react.default.createElement(_Content.default, {
|
|
70
70
|
styleForContent: _objectSpread(_objectSpread({}, props.styleForContent), overlayStyle)
|
|
71
|
-
}, content || children), getSpinner(), showFooter && /*#__PURE__*/_react.default.createElement(_Footer.default, null, /*#__PURE__*/_react.default.createElement(_index.ButtonContainer, _extends({}, props, {
|
|
71
|
+
}, content || children), getSpinner(), showFooter && props.buttons && props.buttons.length > 0 && /*#__PURE__*/_react.default.createElement(_Footer.default, null, /*#__PURE__*/_react.default.createElement(_index.ButtonContainer, _extends({}, props, {
|
|
72
72
|
style: _objectSpread({}, overlayStyle)
|
|
73
73
|
}), props.buttons.map(function (button) {
|
|
74
74
|
if (context && context.securityBeforeUnload && button && button.type && button.type.name === 'CancelButton') {
|
package/lib/dialog/types.d.ts
CHANGED
|
@@ -31,7 +31,7 @@ interface IBaseProps {
|
|
|
31
31
|
}
|
|
32
32
|
interface IFormProps {
|
|
33
33
|
children: ReactNode | ReactNode[];
|
|
34
|
-
buttons
|
|
34
|
+
buttons?: JSX.Element[];
|
|
35
35
|
styleForContent?: CSSProperties;
|
|
36
36
|
title?: string;
|
|
37
37
|
width?: string;
|
|
@@ -61,7 +61,7 @@ interface IQuestionProps {
|
|
|
61
61
|
}
|
|
62
62
|
interface ICustomProps {
|
|
63
63
|
icon: ReactElement;
|
|
64
|
-
buttons
|
|
64
|
+
buttons?: JSX.Element[];
|
|
65
65
|
title?: string;
|
|
66
66
|
text?: string;
|
|
67
67
|
height?: string;
|
package/lib/form/FieldNumber.js
CHANGED
|
@@ -29,23 +29,20 @@ var getEventProps = function getEventProps(_ref) {
|
|
|
29
29
|
var name = _ref.name,
|
|
30
30
|
validators = _ref.validators,
|
|
31
31
|
_onBlur = _ref.onBlur,
|
|
32
|
-
_onChange = _ref.onChange,
|
|
33
32
|
_onKeyDown = _ref.onKeyDown,
|
|
34
33
|
handlerFieldValidade = _ref.handlerFieldValidade,
|
|
35
34
|
handlerFieldChange = _ref.handlerFieldChange,
|
|
36
35
|
handleShowValidateMessages = _ref.handleShowValidateMessages;
|
|
37
36
|
return {
|
|
38
37
|
onBlur: function onBlur(e) {
|
|
38
|
+
if (handlerFieldChange) handlerFieldChange(e);
|
|
39
39
|
if (validators && handlerFieldValidade) handlerFieldValidade(name, e.target.value, validators);
|
|
40
40
|
if (_onBlur) _onBlur(e);
|
|
41
41
|
handleShowValidateMessages(true);
|
|
42
42
|
},
|
|
43
|
-
onChange: function onChange(e) {
|
|
44
|
-
if (_onChange) _onChange(e);
|
|
45
|
-
},
|
|
46
43
|
onKeyDown: function onKeyDown(e) {
|
|
47
|
-
if ([constants.keyCodes.ENTER
|
|
48
|
-
|
|
44
|
+
if ([constants.keyCodes.ENTER].includes(e.keyCode)) {
|
|
45
|
+
handlerFieldChange === null || handlerFieldChange === void 0 ? void 0 : handlerFieldChange(e);
|
|
49
46
|
if (validators) handlerFieldValidade === null || handlerFieldValidade === void 0 ? void 0 : handlerFieldValidade(name, e.target.value, validators);
|
|
50
47
|
if (_onKeyDown) _onKeyDown(e);
|
|
51
48
|
handleShowValidateMessages(true);
|
package/lib/icons/index.d.ts
CHANGED
|
@@ -4,7 +4,11 @@ import '../@types/PointerEvents.js';
|
|
|
4
4
|
import '../@types/SizePixels.js';
|
|
5
5
|
import '../@types/Icon.js';
|
|
6
6
|
import './helper.js';
|
|
7
|
+
import '../@types/Position.js';
|
|
7
8
|
|
|
8
|
-
declare const
|
|
9
|
+
declare const _default: {
|
|
10
|
+
(props: IIconProps): JSX.Element;
|
|
11
|
+
displayName: string;
|
|
12
|
+
};
|
|
9
13
|
|
|
10
|
-
export {
|
|
14
|
+
export { _default as default };
|
package/lib/icons/index.js
CHANGED
|
@@ -1,13 +1,17 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
|
|
3
|
+
function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
|
|
3
4
|
Object.defineProperty(exports, "__esModule", {
|
|
4
5
|
value: true
|
|
5
6
|
});
|
|
6
7
|
exports.default = void 0;
|
|
7
|
-
var _react =
|
|
8
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
9
|
var _helper = _interopRequireDefault(require("./helper"));
|
|
9
10
|
require("../assets/styles/icon.scss");
|
|
11
|
+
var _withTooltip = _interopRequireDefault(require("../internals/withTooltip"));
|
|
10
12
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
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); }
|
|
14
|
+
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; }
|
|
11
15
|
var listIcon = _helper.default;
|
|
12
16
|
var disabledIconColor = 'rgb(193, 193, 193)';
|
|
13
17
|
var Icon = function Icon(_ref) {
|
|
@@ -25,20 +29,36 @@ var Icon = function Icon(_ref) {
|
|
|
25
29
|
disabled = _ref$disabled === void 0 ? false : _ref$disabled,
|
|
26
30
|
_ref$customClass = _ref.customClass,
|
|
27
31
|
customClass = _ref$customClass === void 0 ? '' : _ref$customClass,
|
|
32
|
+
_ref$customClassForCo = _ref.customClassForContainer,
|
|
33
|
+
customClassForContainer = _ref$customClassForCo === void 0 ? '' : _ref$customClassForCo,
|
|
28
34
|
_ref$color = _ref.color,
|
|
29
35
|
color = _ref$color === void 0 ? '#676464' : _ref$color,
|
|
30
36
|
_ref$pointerEvents = _ref.pointerEvents,
|
|
31
|
-
pointerEvents = _ref$pointerEvents === void 0 ? 'none' : _ref$pointerEvents
|
|
37
|
+
pointerEvents = _ref$pointerEvents === void 0 ? 'none' : _ref$pointerEvents,
|
|
38
|
+
targetRef = _ref.targetRef;
|
|
39
|
+
var refSvg = (0, _react.useRef)(null);
|
|
32
40
|
var getPaths = function getPaths() {
|
|
33
41
|
return name ? listIcon[name].paths : svgStruct === null || svgStruct === void 0 ? void 0 : svgStruct.paths;
|
|
34
42
|
};
|
|
35
43
|
if (!name && !svgStruct) throw new Error('One of the "name" and "svgStruct" props must be filled');
|
|
36
44
|
if (!visible) return null;
|
|
37
|
-
return /*#__PURE__*/_react.default.createElement("
|
|
45
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
46
|
+
className: "icon-component-container ".concat(customClassForContainer),
|
|
47
|
+
style: {
|
|
48
|
+
display: 'inline-flex',
|
|
49
|
+
placeSelf: 'center'
|
|
50
|
+
},
|
|
51
|
+
ref: function ref(r) {
|
|
52
|
+
if (targetRef && r) targetRef(r);
|
|
53
|
+
}
|
|
54
|
+
}, /*#__PURE__*/_react.default.createElement("svg", {
|
|
38
55
|
"data-testid": "icon",
|
|
39
56
|
onClick: function onClick() {
|
|
40
57
|
if (_onClick && !disabled) _onClick();
|
|
41
58
|
},
|
|
59
|
+
ref: function ref(r) {
|
|
60
|
+
refSvg.current = r;
|
|
61
|
+
},
|
|
42
62
|
width: "".concat(size, "px"),
|
|
43
63
|
height: "".concat(size, "px"),
|
|
44
64
|
fill: disabled ? disabledIconColor : color,
|
|
@@ -52,7 +72,7 @@ var Icon = function Icon(_ref) {
|
|
|
52
72
|
d: value,
|
|
53
73
|
key: value
|
|
54
74
|
});
|
|
55
|
-
}));
|
|
75
|
+
})));
|
|
56
76
|
};
|
|
57
|
-
var _default = Icon;
|
|
77
|
+
var _default = (0, _withTooltip.default)(Icon);
|
|
58
78
|
exports.default = _default;
|
package/lib/icons/types.d.ts
CHANGED
|
@@ -2,6 +2,7 @@ import { CSSProperties } from 'react';
|
|
|
2
2
|
import { PointerEvents } from '../@types/PointerEvents.js';
|
|
3
3
|
import { SizePixels } from '../@types/SizePixels.js';
|
|
4
4
|
import { IconNames } from '../@types/Icon.js';
|
|
5
|
+
import { Position } from '../@types/Position.js';
|
|
5
6
|
import './helper.js';
|
|
6
7
|
|
|
7
8
|
type ListIconType = {
|
|
@@ -14,6 +15,7 @@ interface IIconProps {
|
|
|
14
15
|
size?: SizePixels;
|
|
15
16
|
color?: string;
|
|
16
17
|
customClass?: string;
|
|
18
|
+
customClassForContainer?: string;
|
|
17
19
|
style?: CSSProperties;
|
|
18
20
|
visible?: boolean;
|
|
19
21
|
disabled?: boolean;
|
|
@@ -25,6 +27,10 @@ interface IIconProps {
|
|
|
25
27
|
paths: Array<string>;
|
|
26
28
|
};
|
|
27
29
|
onClick?: () => void;
|
|
30
|
+
tooltipPosition?: Exclude<Position, 'center'>;
|
|
31
|
+
tooltipWidth?: string | number;
|
|
32
|
+
tooltip?: string;
|
|
33
|
+
targetRef?: (ref: HTMLDivElement) => void;
|
|
28
34
|
}
|
|
29
35
|
|
|
30
36
|
export { IIconProps, ListIconType };
|
|
@@ -20,7 +20,7 @@ function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key i
|
|
|
20
20
|
function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
|
|
21
21
|
function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
|
|
22
22
|
var returnEventFormattedValue = function returnEventFormattedValue(props, event) {
|
|
23
|
-
if (props.returnFormattedValueOnBlur || props.returnFormattedValueOnKeyDown
|
|
23
|
+
if (props.returnFormattedValueOnBlur || props.returnFormattedValueOnKeyDown) {
|
|
24
24
|
// Retornando um objeto com a mesma estrutura do Proxy original
|
|
25
25
|
// para recuperacao do valor da mascara sem formatacao.
|
|
26
26
|
// O retorno poderá ser modificado conforme necessidade, desde que seja
|
|
@@ -52,24 +52,10 @@ var getEventProps = function getEventProps(props) {
|
|
|
52
52
|
props.onBlur(formattedEvent);
|
|
53
53
|
}
|
|
54
54
|
},
|
|
55
|
-
onChange: function onChange(e) {
|
|
56
|
-
if (props.onChange) {
|
|
57
|
-
var _ref = e.target,
|
|
58
|
-
value = _ref.value;
|
|
59
|
-
var formatedValue = (0, _format_number.formatOnlyNumbers)(value);
|
|
60
|
-
var eventWithFormatedValue = _objectSpread(_objectSpread({}, e), {}, {
|
|
61
|
-
target: {
|
|
62
|
-
value: formatedValue
|
|
63
|
-
}
|
|
64
|
-
});
|
|
65
|
-
var formattedEvent = returnEventFormattedValue(props, eventWithFormatedValue);
|
|
66
|
-
props.onChange(formattedEvent);
|
|
67
|
-
}
|
|
68
|
-
},
|
|
69
55
|
onKeyDown: function onKeyDown(e) {
|
|
70
56
|
if (props.onKeyDown) {
|
|
71
|
-
var
|
|
72
|
-
value =
|
|
57
|
+
var _ref = e.target,
|
|
58
|
+
value = _ref.value;
|
|
73
59
|
var formatedValue = (0, _format_number.formatOnlyNumbers)(value);
|
|
74
60
|
var eventWithFormatedValue = _objectSpread(_objectSpread({}, e), {}, {
|
|
75
61
|
target: {
|
|
@@ -82,9 +68,9 @@ var getEventProps = function getEventProps(props) {
|
|
|
82
68
|
}
|
|
83
69
|
};
|
|
84
70
|
};
|
|
85
|
-
var BaseMask = function BaseMask(
|
|
86
|
-
var inputRef =
|
|
87
|
-
props = _objectWithoutProperties(
|
|
71
|
+
var BaseMask = function BaseMask(_ref2) {
|
|
72
|
+
var inputRef = _ref2.inputRef,
|
|
73
|
+
props = _objectWithoutProperties(_ref2, _excluded);
|
|
88
74
|
return /*#__PURE__*/_react.default.createElement(_InputTextBase.default, _extends({}, props, {
|
|
89
75
|
inputRef: inputRef
|
|
90
76
|
}, getEventProps(props)));
|
|
@@ -45,7 +45,6 @@ interface IBaseMaskProps {
|
|
|
45
45
|
required?: boolean;
|
|
46
46
|
returnFormattedValueOnBlur?: boolean;
|
|
47
47
|
returnFormattedValueOnKeyDown?: boolean;
|
|
48
|
-
returnFormattedValueOnChange?: boolean;
|
|
49
48
|
isDateField?: boolean;
|
|
50
49
|
}
|
|
51
50
|
interface ICnpjFieldProps extends IBaseMaskProps {
|
|
@@ -35,8 +35,7 @@ var returnEventFormattedValue = function returnEventFormattedValue(props, event)
|
|
|
35
35
|
};
|
|
36
36
|
var getEventProps = function getEventProps(props) {
|
|
37
37
|
var returnFormattedValueOnBlur = props.returnFormattedValueOnBlur,
|
|
38
|
-
returnFormattedValueOnKeyDown = props.returnFormattedValueOnKeyDown
|
|
39
|
-
returnFormattedValueonChange = props.returnFormattedValueonChange;
|
|
38
|
+
returnFormattedValueOnKeyDown = props.returnFormattedValueOnKeyDown;
|
|
40
39
|
if (props.isNumeric) return {};
|
|
41
40
|
return {
|
|
42
41
|
onBlur: function onBlur(e) {
|
|
@@ -45,12 +44,6 @@ var getEventProps = function getEventProps(props) {
|
|
|
45
44
|
props.onBlur(formattedEvent);
|
|
46
45
|
}
|
|
47
46
|
},
|
|
48
|
-
onChange: function onChange(e) {
|
|
49
|
-
if (props.onChange) {
|
|
50
|
-
var formattedEvent = returnFormattedValueonChange ? returnEventFormattedValue(props, e) : e;
|
|
51
|
-
props.onChange(formattedEvent);
|
|
52
|
-
}
|
|
53
|
-
},
|
|
54
47
|
onKeyDown: function onKeyDown(e) {
|
|
55
48
|
if (props.onKeyDown) {
|
|
56
49
|
var formattedEvent = returnFormattedValueOnKeyDown ? returnEventFormattedValue(props, e) : e;
|
|
@@ -25,7 +25,6 @@ interface IBaseNumberProps extends INumberFieldProps {
|
|
|
25
25
|
onBlur?: (e: CustomInputEvent) => void;
|
|
26
26
|
returnFormattedValueOnBlur?: boolean;
|
|
27
27
|
returnFormattedValueOnKeyDown?: boolean;
|
|
28
|
-
returnFormattedValueonChange?: boolean;
|
|
29
28
|
}
|
|
30
29
|
interface ICurrencyProps extends INumberFieldProps {
|
|
31
30
|
currencySymbol?: string;
|
|
@@ -84,6 +84,7 @@ var NavMenuItem = function NavMenuItem(props) {
|
|
|
84
84
|
}), /*#__PURE__*/_react.default.createElement(_react.Fragment, null, iconName && /*#__PURE__*/_react.default.createElement(_icons.default, {
|
|
85
85
|
name: iconName,
|
|
86
86
|
size: menuSize === 'small' && 16 || menuSize === 'medium' && 24 || menuSize === 'large' && 32 || 16,
|
|
87
|
+
customClassForContainer: "menuicon-container",
|
|
87
88
|
customClass: "menuicon"
|
|
88
89
|
}), isExpanded && /*#__PURE__*/_react.default.createElement("span", {
|
|
89
90
|
className: "title"
|