linear-react-components-ui 1.1.21-beta.5 → 1.1.21-beta.6
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/assets/styles/select.scss +19 -15
- package/lib/checkbox/Label.js +31 -0
- package/lib/inputs/mask/imaskHOC.js +203 -0
- package/lib/inputs/select/multiple/Selecteds.d.ts +1 -1
- package/lib/inputs/select/multiple/Selecteds.js +3 -1
- package/lib/inputs/select/multiple/index.js +3 -2
- package/lib/inputs/select/types.d.ts +1 -0
- package/lib/menus/sidenav/popup_menu_help/index.js +85 -0
- package/lib/tabs/DropdownItems.js +62 -0
- package/lib/tabs/MenuItems.js +70 -0
- package/lib/treeview_old/Header.js +29 -0
- package/lib/treeview_old/Node.js +68 -0
- package/lib/treeview_old/index.js +43 -0
- package/package.json +1 -1
|
@@ -23,15 +23,15 @@
|
|
|
23
23
|
}
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
.selectwrapper
|
|
26
|
+
.selectwrapper > .multiselect {
|
|
27
27
|
flex-wrap: wrap;
|
|
28
28
|
|
|
29
|
-
|
|
29
|
+
> .textinput {
|
|
30
30
|
order: 1;
|
|
31
31
|
display: inline-block;
|
|
32
32
|
}
|
|
33
33
|
|
|
34
|
-
|
|
34
|
+
> .selecteditem {
|
|
35
35
|
background-color: #f2f9fc;
|
|
36
36
|
border: 1px solid #c9e6f2;
|
|
37
37
|
border-radius: 3px;
|
|
@@ -44,14 +44,18 @@
|
|
|
44
44
|
float: left;
|
|
45
45
|
margin: 2px;
|
|
46
46
|
padding: 0px 8px 0px 5px;
|
|
47
|
-
|
|
47
|
+
&.-disabled {
|
|
48
|
+
@extend %component-disabled;
|
|
49
|
+
opacity: 0.7;
|
|
50
|
+
border: solid 1px $font-color-disabled;
|
|
51
|
+
}
|
|
48
52
|
.close {
|
|
49
53
|
all: unset;
|
|
50
54
|
}
|
|
51
55
|
}
|
|
52
56
|
}
|
|
53
57
|
|
|
54
|
-
.selectwrapper
|
|
58
|
+
.selectwrapper > .multiselect > .selecteditem > .close {
|
|
55
59
|
cursor: pointer;
|
|
56
60
|
|
|
57
61
|
&:after {
|
|
@@ -63,9 +67,9 @@
|
|
|
63
67
|
}
|
|
64
68
|
}
|
|
65
69
|
|
|
66
|
-
.dropdown-component
|
|
70
|
+
.dropdown-component > .select-dropdown {
|
|
67
71
|
animation: 0.5s ease-in 0s 1 slideDown;
|
|
68
|
-
background-color: #
|
|
72
|
+
background-color: #fff;
|
|
69
73
|
border: $component-border-color;
|
|
70
74
|
@extend %component-menu-dropdown;
|
|
71
75
|
display: grid;
|
|
@@ -75,7 +79,7 @@
|
|
|
75
79
|
overflow-x: hidden;
|
|
76
80
|
margin-top: 2px;
|
|
77
81
|
|
|
78
|
-
|
|
82
|
+
> .filtercontainer {
|
|
79
83
|
display: grid;
|
|
80
84
|
grid-template-columns: 1fr 20px;
|
|
81
85
|
align-items: center;
|
|
@@ -83,7 +87,7 @@
|
|
|
83
87
|
margin: 4px;
|
|
84
88
|
}
|
|
85
89
|
|
|
86
|
-
|
|
90
|
+
> .filtercontainer > .filterinput {
|
|
87
91
|
border: 0;
|
|
88
92
|
width: 100%;
|
|
89
93
|
font-size: 13px;
|
|
@@ -91,7 +95,7 @@
|
|
|
91
95
|
padding: 10px 5px;
|
|
92
96
|
}
|
|
93
97
|
|
|
94
|
-
|
|
98
|
+
> .item {
|
|
95
99
|
margin: 0;
|
|
96
100
|
padding: 6px 10px;
|
|
97
101
|
display: flex;
|
|
@@ -132,21 +136,21 @@
|
|
|
132
136
|
display: flex;
|
|
133
137
|
justify-content: space-between;
|
|
134
138
|
align-items: center;
|
|
135
|
-
width: 100
|
|
139
|
+
width: 100%;
|
|
136
140
|
}
|
|
137
141
|
|
|
138
142
|
.menubutton {
|
|
139
|
-
|
|
143
|
+
> .label {
|
|
140
144
|
flex-grow: 1;
|
|
141
145
|
}
|
|
142
146
|
|
|
143
|
-
|
|
144
|
-
margin-right: 5px
|
|
147
|
+
> .menuicon {
|
|
148
|
+
margin-right: 5px;
|
|
145
149
|
}
|
|
146
150
|
}
|
|
147
151
|
}
|
|
148
152
|
|
|
149
|
-
|
|
153
|
+
> .notfound {
|
|
150
154
|
text-indent: 10px;
|
|
151
155
|
color: graytext;
|
|
152
156
|
font-style: italic;
|
|
@@ -0,0 +1,31 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _withTooltip = _interopRequireDefault(require("../internals/withTooltip"));
|
|
9
|
+
var _hint = _interopRequireDefault(require("../hint"));
|
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
|
+
const Label = _ref => {
|
|
12
|
+
let {
|
|
13
|
+
label,
|
|
14
|
+
targetSpanRef,
|
|
15
|
+
disabled,
|
|
16
|
+
hint
|
|
17
|
+
} = _ref;
|
|
18
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
19
|
+
className: "description"
|
|
20
|
+
}, /*#__PURE__*/_react.default.createElement("span", {
|
|
21
|
+
ref: r => {
|
|
22
|
+
if (targetSpanRef) targetSpanRef(r);
|
|
23
|
+
}
|
|
24
|
+
}, label), /*#__PURE__*/_react.default.createElement(_hint.default, {
|
|
25
|
+
disabled: disabled,
|
|
26
|
+
visible: !!hint,
|
|
27
|
+
description: hint,
|
|
28
|
+
customClass: "hint"
|
|
29
|
+
}));
|
|
30
|
+
};
|
|
31
|
+
var _default = exports.default = (0, _withTooltip.default)(Label);
|
|
@@ -0,0 +1,203 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _imask = _interopRequireDefault(require("imask"));
|
|
9
|
+
var helpers = _interopRequireWildcard(require("./helpers"));
|
|
10
|
+
var _permissionValidations = require("../../permissionValidations");
|
|
11
|
+
var _format_number = require("../number/format_number");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
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); }
|
|
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; }
|
|
15
|
+
function _extends() { _extends = Object.assign ? Object.assign.bind() : 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); }
|
|
16
|
+
const options = [_permissionValidations.OPTIONS_ON_DENIED.disabled, _permissionValidations.OPTIONS_ON_DENIED.unvisible, _permissionValidations.OPTIONS_ON_DENIED.readOnly, _permissionValidations.OPTIONS_ON_DENIED.hideContent];
|
|
17
|
+
const IMaskHOC = ComposedComponent => {
|
|
18
|
+
const MaskedComponent = props => {
|
|
19
|
+
const {
|
|
20
|
+
permissionAttr,
|
|
21
|
+
skeletonize,
|
|
22
|
+
inputRef,
|
|
23
|
+
placeholderChar = '_',
|
|
24
|
+
lazy = false,
|
|
25
|
+
pattern = '',
|
|
26
|
+
radix = ' ',
|
|
27
|
+
thousandsSeparator = '',
|
|
28
|
+
mapToRadix = [],
|
|
29
|
+
scale = 2,
|
|
30
|
+
signed = false,
|
|
31
|
+
normalizeZeros = true,
|
|
32
|
+
padFractionalZeros = true,
|
|
33
|
+
mask,
|
|
34
|
+
commit = () => {},
|
|
35
|
+
parse,
|
|
36
|
+
format,
|
|
37
|
+
definitions,
|
|
38
|
+
groups,
|
|
39
|
+
min,
|
|
40
|
+
max,
|
|
41
|
+
dispatch,
|
|
42
|
+
value = '',
|
|
43
|
+
onChange,
|
|
44
|
+
isDateField = false,
|
|
45
|
+
autoCompleteMask
|
|
46
|
+
} = props;
|
|
47
|
+
const maskOptions = {
|
|
48
|
+
placeholderChar: placeholderChar === '' ? ' ' : placeholderChar,
|
|
49
|
+
lazy,
|
|
50
|
+
pattern,
|
|
51
|
+
radix,
|
|
52
|
+
thousandsSeparator,
|
|
53
|
+
mapToRadix,
|
|
54
|
+
scale,
|
|
55
|
+
signed,
|
|
56
|
+
normalizeZeros,
|
|
57
|
+
padFractionalZeros,
|
|
58
|
+
mask,
|
|
59
|
+
commit,
|
|
60
|
+
parse,
|
|
61
|
+
format,
|
|
62
|
+
definitions,
|
|
63
|
+
groups,
|
|
64
|
+
min,
|
|
65
|
+
max,
|
|
66
|
+
dispatch
|
|
67
|
+
};
|
|
68
|
+
const [onDenied] = (0, _react.useState)((0, _permissionValidations.actionsOnPermissionDenied)(options, permissionAttr));
|
|
69
|
+
const elementRef = (0, _react.useRef)(null);
|
|
70
|
+
const maskRef = (0, _react.useRef)(null);
|
|
71
|
+
const {
|
|
72
|
+
hideContent,
|
|
73
|
+
unvisible,
|
|
74
|
+
disabled,
|
|
75
|
+
readOnly
|
|
76
|
+
} = onDenied;
|
|
77
|
+
const dontInitMask = hideContent || unvisible || skeletonize;
|
|
78
|
+
const disableCallbacks = disabled || readOnly;
|
|
79
|
+
const setValue = newValue => {
|
|
80
|
+
if (maskRef.current) {
|
|
81
|
+
if (props.unmask) maskRef.current.unmaskedValue = newValue.toString();
|
|
82
|
+
maskRef.current.value = String(newValue);
|
|
83
|
+
}
|
|
84
|
+
};
|
|
85
|
+
const onAccept = (0, _react.useCallback)(() => {
|
|
86
|
+
if (onChange && !disableCallbacks && maskRef.current) {
|
|
87
|
+
const {
|
|
88
|
+
unmaskedValue,
|
|
89
|
+
el
|
|
90
|
+
} = maskRef.current;
|
|
91
|
+
const name = el.name || el.input && el.input.name;
|
|
92
|
+
onChange({
|
|
93
|
+
target: {
|
|
94
|
+
value: unmaskedValue,
|
|
95
|
+
name
|
|
96
|
+
}
|
|
97
|
+
}, props.unmask ? unmaskedValue : maskRef.current.value);
|
|
98
|
+
}
|
|
99
|
+
}, [onChange]);
|
|
100
|
+
const onComplete = (0, _react.useCallback)(() => {
|
|
101
|
+
if (props.onComplete && !disableCallbacks && maskRef.current) {
|
|
102
|
+
const {
|
|
103
|
+
unmaskedValue,
|
|
104
|
+
el
|
|
105
|
+
} = maskRef.current;
|
|
106
|
+
const name = el.name || el.input && el.input.name;
|
|
107
|
+
props.onComplete({
|
|
108
|
+
target: {
|
|
109
|
+
value: unmaskedValue,
|
|
110
|
+
name
|
|
111
|
+
}
|
|
112
|
+
}, props.unmask ? unmaskedValue : maskRef.current.value);
|
|
113
|
+
}
|
|
114
|
+
}, [props.onComplete]);
|
|
115
|
+
const autoCompleteMaskValue = (0, _react.useCallback)(eventTargetValue => {
|
|
116
|
+
if (autoCompleteMask && eventTargetValue.length && maskRef.current && elementRef.current) {
|
|
117
|
+
const sizeMask = maskRef.current.mask.toString().replace(/\D+/g, '').length;
|
|
118
|
+
if (sizeMask > eventTargetValue.length) {
|
|
119
|
+
switch (autoCompleteMask) {
|
|
120
|
+
case 'left':
|
|
121
|
+
setValue(eventTargetValue.padStart(sizeMask, '0'));
|
|
122
|
+
break;
|
|
123
|
+
case 'right':
|
|
124
|
+
setValue(eventTargetValue.padEnd(sizeMask, '0'));
|
|
125
|
+
break;
|
|
126
|
+
default:
|
|
127
|
+
setValue(eventTargetValue);
|
|
128
|
+
break;
|
|
129
|
+
}
|
|
130
|
+
}
|
|
131
|
+
}
|
|
132
|
+
}, [autoCompleteMask, maskRef.current, elementRef.current]);
|
|
133
|
+
const getMask = () => {
|
|
134
|
+
const element = elementRef.current;
|
|
135
|
+
if (element) {
|
|
136
|
+
const maskCurrent = maskRef.current;
|
|
137
|
+
if (!maskCurrent) {
|
|
138
|
+
maskRef.current = (0, _imask.default)(element, maskOptions);
|
|
139
|
+
if (value && typeof value !== 'number' && value.trim() !== '' || value && typeof value === 'number') onAccept();
|
|
140
|
+
setValue(value);
|
|
141
|
+
} else {
|
|
142
|
+
maskCurrent.updateOptions(maskOptions);
|
|
143
|
+
}
|
|
144
|
+
}
|
|
145
|
+
};
|
|
146
|
+
const destroyMask = () => {
|
|
147
|
+
if (maskRef.current) {
|
|
148
|
+
maskRef.current.destroy();
|
|
149
|
+
maskRef.current = null;
|
|
150
|
+
}
|
|
151
|
+
};
|
|
152
|
+
(0, _react.useEffect)(() => {
|
|
153
|
+
if (props.handlerSetOnDenied) props.handlerSetOnDenied(onDenied);
|
|
154
|
+
if (!props.mask || dontInitMask) return;
|
|
155
|
+
getMask();
|
|
156
|
+
}, [maskOptions]);
|
|
157
|
+
(0, _react.useEffect)(() => {
|
|
158
|
+
if (!maskRef.current) return;
|
|
159
|
+
const maskCurrent = maskRef.current;
|
|
160
|
+
maskCurrent.on('accept', onAccept);
|
|
161
|
+
maskCurrent.on('complete', onComplete);
|
|
162
|
+
|
|
163
|
+
// eslint-disable-next-line consistent-return
|
|
164
|
+
return () => {
|
|
165
|
+
maskCurrent.off('accept', onAccept);
|
|
166
|
+
maskCurrent.off('complete', onComplete);
|
|
167
|
+
};
|
|
168
|
+
}, [onAccept, onComplete]);
|
|
169
|
+
(0, _react.useEffect)(() => {
|
|
170
|
+
if (maskOptions.mask && !dontInitMask) {
|
|
171
|
+
if (maskRef.current) {
|
|
172
|
+
const formattedValue = isDateField ? value : (0, _format_number.numberToPtBR)(value) || '';
|
|
173
|
+
setValue(formattedValue);
|
|
174
|
+
} else {
|
|
175
|
+
getMask();
|
|
176
|
+
}
|
|
177
|
+
} else if (!dontInitMask) {
|
|
178
|
+
destroyMask();
|
|
179
|
+
if (value && elementRef.current) elementRef.current.value = value;
|
|
180
|
+
}
|
|
181
|
+
}, [value, isDateField]);
|
|
182
|
+
(0, _react.useEffect)(() => destroyMask, []);
|
|
183
|
+
return /*#__PURE__*/_react.default.createElement(ComposedComponent, _extends({}, helpers.extractNonMaskProps(props, maskOptions), {
|
|
184
|
+
onDeniedActions: onDenied,
|
|
185
|
+
defaultValue: value,
|
|
186
|
+
onBlur: e => {
|
|
187
|
+
autoCompleteMaskValue(e.target.value);
|
|
188
|
+
if (props.onBlur) props.onBlur(e);
|
|
189
|
+
},
|
|
190
|
+
onChange: e => setValue(e.target.value),
|
|
191
|
+
inputRef: el => {
|
|
192
|
+
elementRef.current = el;
|
|
193
|
+
if (inputRef) {
|
|
194
|
+
if (typeof inputRef === 'object') inputRef.current = el;else inputRef(el);
|
|
195
|
+
}
|
|
196
|
+
}
|
|
197
|
+
}));
|
|
198
|
+
};
|
|
199
|
+
const nestedComponentName = ComposedComponent.displayName || ComposedComponent.name || 'Component';
|
|
200
|
+
MaskedComponent.displayName = "IMask(".concat(nestedComponentName, ")");
|
|
201
|
+
return MaskedComponent;
|
|
202
|
+
};
|
|
203
|
+
var _default = exports.default = IMaskHOC;
|
|
@@ -8,6 +8,6 @@ import '../../../@types/Period.js';
|
|
|
8
8
|
import '../../../internals/types.js';
|
|
9
9
|
import '../../../@types/Position.js';
|
|
10
10
|
|
|
11
|
-
declare const Selecteds: ({ currents, descriptionKey, idKey, handlerOnUnselect, }: ISelectedsMultipleProps) => JSX.Element;
|
|
11
|
+
declare const Selecteds: ({ currents, descriptionKey, idKey, disabled, handlerOnUnselect, }: ISelectedsMultipleProps) => JSX.Element;
|
|
12
12
|
|
|
13
13
|
export { Selecteds as default };
|
|
@@ -11,12 +11,14 @@ const Selecteds = _ref => {
|
|
|
11
11
|
currents,
|
|
12
12
|
descriptionKey,
|
|
13
13
|
idKey,
|
|
14
|
+
disabled,
|
|
14
15
|
handlerOnUnselect
|
|
15
16
|
} = _ref;
|
|
16
17
|
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, currents.map(selected => /*#__PURE__*/_react.default.createElement("div", {
|
|
17
|
-
className:
|
|
18
|
+
className: `selecteditem ${disabled ? '-disabled' : ''}`,
|
|
18
19
|
key: `selected-${selected[idKey]}`
|
|
19
20
|
}, typeof descriptionKey === 'string' ? selected[descriptionKey] : descriptionKey(selected), /*#__PURE__*/_react.default.createElement("button", {
|
|
21
|
+
disabled: disabled,
|
|
20
22
|
className: "close",
|
|
21
23
|
tabIndex: -1,
|
|
22
24
|
onClick: () => handlerOnUnselect(selected[idKey])
|
|
@@ -33,7 +33,8 @@ const MultipleSelect = props => {
|
|
|
33
33
|
customClassForLabel,
|
|
34
34
|
customClassForWrapper,
|
|
35
35
|
customClassForInputContent,
|
|
36
|
-
customClassForSideButtons
|
|
36
|
+
customClassForSideButtons,
|
|
37
|
+
disabled = false
|
|
37
38
|
} = props;
|
|
38
39
|
const [dataCombo, setDataCombo] = (0, _react.useState)(dataSource);
|
|
39
40
|
const [currents, setCurrents] = (0, _react.useState)([]);
|
|
@@ -170,7 +171,7 @@ const MultipleSelect = props => {
|
|
|
170
171
|
const setOnDenied = denied => {
|
|
171
172
|
setOnDeniedSelect(denied);
|
|
172
173
|
};
|
|
173
|
-
const shouldDisable = () =>
|
|
174
|
+
const shouldDisable = () => disabled || onDenied && (onDenied.disabled || onDenied.hideContent);
|
|
174
175
|
const shouldBeReadOnly = () => props.readOnly || onDenied && onDenied.readOnly;
|
|
175
176
|
(0, _react.useEffect)(() => {
|
|
176
177
|
window.addEventListener('resize', onScreenResize);
|
|
@@ -103,6 +103,7 @@ interface IMultipleSelectProps extends Omit<ISimpleSelectProps, 'idKey' | 'value
|
|
|
103
103
|
popoverAlign?: 'right' | 'left';
|
|
104
104
|
}
|
|
105
105
|
interface ISelectedsMultipleProps {
|
|
106
|
+
disabled?: boolean;
|
|
106
107
|
idKey: string;
|
|
107
108
|
descriptionKey: DescriptionKey;
|
|
108
109
|
currents: DataCombo[];
|
|
@@ -0,0 +1,85 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _reactDom = _interopRequireDefault(require("react-dom"));
|
|
9
|
+
var _list = _interopRequireWildcard(require("../../../list"));
|
|
10
|
+
function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
|
|
11
|
+
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); }
|
|
12
|
+
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; }
|
|
13
|
+
const body = document.getElementsByTagName('body')[0];
|
|
14
|
+
const PopupMenuHelp = props => {
|
|
15
|
+
const {
|
|
16
|
+
style,
|
|
17
|
+
copyright,
|
|
18
|
+
handlerClose,
|
|
19
|
+
version,
|
|
20
|
+
helpList = [],
|
|
21
|
+
helpRef
|
|
22
|
+
} = props;
|
|
23
|
+
const searchFieldRef = (0, _react.useRef)(null);
|
|
24
|
+
const popupRef = (0, _react.useRef)(document.createElement('div'));
|
|
25
|
+
Object.assign(popupRef.current, {
|
|
26
|
+
className: 'helpmenu',
|
|
27
|
+
style
|
|
28
|
+
});
|
|
29
|
+
const closeOnEsc = e => {
|
|
30
|
+
if (e.key === 'Escape') {
|
|
31
|
+
handlerClose();
|
|
32
|
+
e.stopPropagation();
|
|
33
|
+
}
|
|
34
|
+
};
|
|
35
|
+
(0, _react.useEffect)(() => {
|
|
36
|
+
body.appendChild(popupRef.current);
|
|
37
|
+
if (searchFieldRef && searchFieldRef.current) searchFieldRef.current.focus();
|
|
38
|
+
document.body.addEventListener('keydown', closeOnEsc);
|
|
39
|
+
return () => {
|
|
40
|
+
body.removeChild(popupRef.current);
|
|
41
|
+
document.body.removeEventListener('keydown', closeOnEsc);
|
|
42
|
+
};
|
|
43
|
+
}, []);
|
|
44
|
+
(0, _react.useEffect)(() => {
|
|
45
|
+
Object.assign(popupRef.current, {
|
|
46
|
+
style
|
|
47
|
+
});
|
|
48
|
+
}, [style]);
|
|
49
|
+
const getPopupContent = () => /*#__PURE__*/_react.default.createElement("div", {
|
|
50
|
+
className: "popup-help",
|
|
51
|
+
ref: helpRef
|
|
52
|
+
}, /*#__PURE__*/_react.default.createElement(_list.default, {
|
|
53
|
+
condensed: true,
|
|
54
|
+
selectable: true,
|
|
55
|
+
onSelectItem: handlerClose,
|
|
56
|
+
selectOnEnter: true,
|
|
57
|
+
style: {
|
|
58
|
+
border: 'none',
|
|
59
|
+
boxShadow: 'hidden',
|
|
60
|
+
overflow: 'none'
|
|
61
|
+
}
|
|
62
|
+
}, /*#__PURE__*/_react.default.createElement(_react.Fragment, null, /*#__PURE__*/_react.default.createElement(_list.ListHeader, {
|
|
63
|
+
customClass: "helpheader",
|
|
64
|
+
title: "Ajuda"
|
|
65
|
+
}), helpList.map(item => /*#__PURE__*/_react.default.createElement(_list.ListItem, {
|
|
66
|
+
separator: true,
|
|
67
|
+
selectOnEnter: true,
|
|
68
|
+
key: item.id,
|
|
69
|
+
itemId: item.id,
|
|
70
|
+
url: item.url,
|
|
71
|
+
text: item.title
|
|
72
|
+
})))), /*#__PURE__*/_react.default.createElement("div", {
|
|
73
|
+
className: "infomartion",
|
|
74
|
+
style: {
|
|
75
|
+
padding: '10px 0px 0px 7px',
|
|
76
|
+
backgroundColor: 'white'
|
|
77
|
+
}
|
|
78
|
+
}, /*#__PURE__*/_react.default.createElement("p", {
|
|
79
|
+
className: "help-information"
|
|
80
|
+
}, /*#__PURE__*/_react.default.createElement("b", null, "Vers\xE3o:"), version), /*#__PURE__*/_react.default.createElement("p", {
|
|
81
|
+
className: "help-information"
|
|
82
|
+
}, copyright)));
|
|
83
|
+
return /*#__PURE__*/_reactDom.default.createPortal(getPopupContent(), popupRef.current);
|
|
84
|
+
};
|
|
85
|
+
var _default = exports.default = PopupMenuHelp;
|
|
@@ -0,0 +1,62 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _buttons = _interopRequireDefault(require("../buttons"));
|
|
9
|
+
var _list = _interopRequireWildcard(require("../list"));
|
|
10
|
+
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); }
|
|
11
|
+
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; }
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
13
|
+
const DropdownItems = _ref => {
|
|
14
|
+
let {
|
|
15
|
+
handlerClick,
|
|
16
|
+
handlerRemovePanel,
|
|
17
|
+
dropdownPanels = [],
|
|
18
|
+
tabMenuSize = 'medium'
|
|
19
|
+
} = _ref;
|
|
20
|
+
return dropdownPanels.length > 0 ? /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
21
|
+
dropdown: true,
|
|
22
|
+
dropdownAlign: "right",
|
|
23
|
+
transparent: true,
|
|
24
|
+
boxShadow: false,
|
|
25
|
+
size: "large",
|
|
26
|
+
customClass: "dropdownbutton"
|
|
27
|
+
}, /*#__PURE__*/_react.default.createElement(_list.default, {
|
|
28
|
+
customClass: "dropdown-hide-tabs"
|
|
29
|
+
}, dropdownPanels.map((panel, index) => {
|
|
30
|
+
const {
|
|
31
|
+
id,
|
|
32
|
+
title,
|
|
33
|
+
closeable,
|
|
34
|
+
iconAlign,
|
|
35
|
+
icon,
|
|
36
|
+
iconName,
|
|
37
|
+
disabled
|
|
38
|
+
} = panel.props;
|
|
39
|
+
return /*#__PURE__*/_react.default.createElement(_list.ListItem, {
|
|
40
|
+
key: id
|
|
41
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
42
|
+
className: "menuitem"
|
|
43
|
+
}, /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
44
|
+
className: "btn menubutton",
|
|
45
|
+
boxShadow: false,
|
|
46
|
+
onClick: () => handlerClick === null || handlerClick === void 0 ? void 0 : handlerClick(id),
|
|
47
|
+
iconAlign: iconAlign,
|
|
48
|
+
iconName: iconName,
|
|
49
|
+
icon: icon,
|
|
50
|
+
disabled: disabled,
|
|
51
|
+
label: title,
|
|
52
|
+
size: tabMenuSize,
|
|
53
|
+
transparent: true
|
|
54
|
+
}), closeable && /*#__PURE__*/_react.default.createElement("button", {
|
|
55
|
+
className: "closepanel",
|
|
56
|
+
onClick: () => {
|
|
57
|
+
handlerRemovePanel === null || handlerRemovePanel === void 0 ? void 0 : handlerRemovePanel(id, index, true);
|
|
58
|
+
}
|
|
59
|
+
})));
|
|
60
|
+
}))) : null;
|
|
61
|
+
};
|
|
62
|
+
var _default = exports.default = DropdownItems;
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _buttons = _interopRequireDefault(require("../buttons"));
|
|
9
|
+
var helpers = _interopRequireWildcard(require("./tabHelpers"));
|
|
10
|
+
var _permissionValidations = require("../permissionValidations");
|
|
11
|
+
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); }
|
|
12
|
+
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; }
|
|
13
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
14
|
+
const MenuItems = _ref => {
|
|
15
|
+
let {
|
|
16
|
+
handlerClick,
|
|
17
|
+
currentPanels,
|
|
18
|
+
handlerRemovePanel,
|
|
19
|
+
tabWidth = 'auto',
|
|
20
|
+
tabMenuSize = 'medium',
|
|
21
|
+
tabMenuAlign = 'left',
|
|
22
|
+
selectedTabId = '',
|
|
23
|
+
firstTabIdent = false
|
|
24
|
+
} = _ref;
|
|
25
|
+
return /*#__PURE__*/_react.default.createElement("ul", {
|
|
26
|
+
className: "menu ".concat(firstTabIdent && '-firsttabident'),
|
|
27
|
+
style: helpers.menuStyles(tabMenuAlign)
|
|
28
|
+
}, currentPanels === null || currentPanels === void 0 ? void 0 : currentPanels.map((panel, index) => {
|
|
29
|
+
const {
|
|
30
|
+
id,
|
|
31
|
+
icon,
|
|
32
|
+
title,
|
|
33
|
+
tooltip,
|
|
34
|
+
disabled,
|
|
35
|
+
iconName,
|
|
36
|
+
closeable,
|
|
37
|
+
iconAlign,
|
|
38
|
+
tooltipWidth,
|
|
39
|
+
permissionAttr,
|
|
40
|
+
tooltipPosition
|
|
41
|
+
} = panel.props;
|
|
42
|
+
const onDenied = (0, _permissionValidations.actionsOnPermissionDenied)(helpers.onDeniedOptions, permissionAttr);
|
|
43
|
+
return onDenied.unvisible ? null : /*#__PURE__*/_react.default.createElement("li", {
|
|
44
|
+
key: id,
|
|
45
|
+
style: {
|
|
46
|
+
width: tabWidth
|
|
47
|
+
},
|
|
48
|
+
className: "menuitem ".concat(selectedTabId === id && 'selected')
|
|
49
|
+
}, /*#__PURE__*/_react.default.createElement(_buttons.default, {
|
|
50
|
+
className: "btn menubutton",
|
|
51
|
+
boxShadow: false,
|
|
52
|
+
onClick: () => handlerClick === null || handlerClick === void 0 ? void 0 : handlerClick(id),
|
|
53
|
+
iconAlign: iconAlign,
|
|
54
|
+
iconName: iconName,
|
|
55
|
+
icon: icon,
|
|
56
|
+
disabled: disabled || !!onDenied.disabled,
|
|
57
|
+
label: title,
|
|
58
|
+
size: tabMenuSize,
|
|
59
|
+
tooltip: tooltip || title,
|
|
60
|
+
tooltipPosition: tooltipPosition,
|
|
61
|
+
tooltipWidth: tooltipWidth
|
|
62
|
+
}), closeable && currentPanels.length > 1 && /*#__PURE__*/_react.default.createElement("button", {
|
|
63
|
+
className: "closepanel",
|
|
64
|
+
onClick: () => {
|
|
65
|
+
handlerRemovePanel === null || handlerRemovePanel === void 0 ? void 0 : handlerRemovePanel(id, index);
|
|
66
|
+
}
|
|
67
|
+
}));
|
|
68
|
+
}));
|
|
69
|
+
};
|
|
70
|
+
var _default = exports.default = MenuItems;
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
10
|
+
const Header = props => {
|
|
11
|
+
const {
|
|
12
|
+
title,
|
|
13
|
+
customClass
|
|
14
|
+
} = props;
|
|
15
|
+
return /*#__PURE__*/_react.default.createElement("div", {
|
|
16
|
+
className: "treeviewheader ".concat(customClass)
|
|
17
|
+
}, /*#__PURE__*/_react.default.createElement("div", {
|
|
18
|
+
className: "title"
|
|
19
|
+
}, title));
|
|
20
|
+
};
|
|
21
|
+
Header.defaultProps = {
|
|
22
|
+
title: '',
|
|
23
|
+
customClass: ''
|
|
24
|
+
};
|
|
25
|
+
Header.propTypes = {
|
|
26
|
+
title: _propTypes.default.string,
|
|
27
|
+
customClass: _propTypes.default.string
|
|
28
|
+
};
|
|
29
|
+
var _default = exports.default = Header;
|
|
@@ -0,0 +1,68 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
8
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
9
|
+
var _checkbox = _interopRequireDefault(require("../checkbox"));
|
|
10
|
+
var _icons = _interopRequireDefault(require("../icons"));
|
|
11
|
+
require("../assets/styles/treeview.scss");
|
|
12
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
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); }
|
|
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; }
|
|
15
|
+
function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
|
|
16
|
+
function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
|
|
17
|
+
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); }
|
|
18
|
+
class TreeNode extends _react.Component {
|
|
19
|
+
constructor(props) {
|
|
20
|
+
super(props);
|
|
21
|
+
_defineProperty(this, "openCloseTree", () => {
|
|
22
|
+
this.setState({
|
|
23
|
+
isVisible: !this.state.isVisible
|
|
24
|
+
});
|
|
25
|
+
});
|
|
26
|
+
this.state = {
|
|
27
|
+
isVisible: false
|
|
28
|
+
};
|
|
29
|
+
}
|
|
30
|
+
render() {
|
|
31
|
+
const {
|
|
32
|
+
node,
|
|
33
|
+
showCheckBox
|
|
34
|
+
} = this.props;
|
|
35
|
+
let span = '';
|
|
36
|
+
if (node.itens.length > 0) {
|
|
37
|
+
span = /*#__PURE__*/_react.default.createElement("span", {
|
|
38
|
+
onKeyPress: null,
|
|
39
|
+
tabIndex: 0,
|
|
40
|
+
role: "button",
|
|
41
|
+
className: "opencloseicon",
|
|
42
|
+
onClick: this.openCloseTree
|
|
43
|
+
}, /*#__PURE__*/_react.default.createElement(_icons.default, {
|
|
44
|
+
name: this.state.isVisible ? 'up' : 'down',
|
|
45
|
+
size: 10
|
|
46
|
+
}));
|
|
47
|
+
}
|
|
48
|
+
return /*#__PURE__*/_react.default.createElement("li", {
|
|
49
|
+
className: "treeviewitem"
|
|
50
|
+
}, span, showCheckBox ? /*#__PURE__*/_react.default.createElement(_checkbox.default, {
|
|
51
|
+
id: node.id,
|
|
52
|
+
label: node.titulo
|
|
53
|
+
}) : node.titulo, /*#__PURE__*/_react.default.createElement("ul", {
|
|
54
|
+
className: "nodelist"
|
|
55
|
+
}, this.state.isVisible && this.props.children));
|
|
56
|
+
}
|
|
57
|
+
}
|
|
58
|
+
TreeNode.defaultProps = {
|
|
59
|
+
showCheckBox: false,
|
|
60
|
+
data: []
|
|
61
|
+
};
|
|
62
|
+
TreeNode.propTypes = {
|
|
63
|
+
showCheckBox: _propTypes.default.bool,
|
|
64
|
+
data: _propTypes.default.arrayOf(_propTypes.default.element),
|
|
65
|
+
node: _propTypes.default.object.isRequired,
|
|
66
|
+
children: _propTypes.default.arrayOf(_propTypes.default.element).isRequired
|
|
67
|
+
};
|
|
68
|
+
var _default = exports.default = TreeNode;
|
|
@@ -0,0 +1,43 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
Object.defineProperty(exports, "TreeNode", {
|
|
7
|
+
enumerable: true,
|
|
8
|
+
get: function () {
|
|
9
|
+
return _Node.default;
|
|
10
|
+
}
|
|
11
|
+
});
|
|
12
|
+
Object.defineProperty(exports, "TreeViewHeader", {
|
|
13
|
+
enumerable: true,
|
|
14
|
+
get: function () {
|
|
15
|
+
return _Header.default;
|
|
16
|
+
}
|
|
17
|
+
});
|
|
18
|
+
exports.default = void 0;
|
|
19
|
+
var _react = _interopRequireDefault(require("react"));
|
|
20
|
+
var _propTypes = _interopRequireDefault(require("prop-types"));
|
|
21
|
+
var _Node = _interopRequireDefault(require("./Node"));
|
|
22
|
+
var _Header = _interopRequireDefault(require("./Header"));
|
|
23
|
+
require("../assets/styles/treeview.scss");
|
|
24
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
25
|
+
const TreeView = props => {
|
|
26
|
+
const {
|
|
27
|
+
customClass,
|
|
28
|
+
defaultBorder
|
|
29
|
+
} = props;
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement("ul", {
|
|
31
|
+
className: "treeview-component ".concat(customClass, " ").concat(defaultBorder && '-defaultborder')
|
|
32
|
+
}, props.children));
|
|
33
|
+
};
|
|
34
|
+
TreeView.defaultProps = {
|
|
35
|
+
customClass: '',
|
|
36
|
+
defaultBorder: true
|
|
37
|
+
};
|
|
38
|
+
TreeView.propTypes = {
|
|
39
|
+
children: _propTypes.default.arrayOf(_propTypes.default.element).isRequired,
|
|
40
|
+
customClass: _propTypes.default.string,
|
|
41
|
+
defaultBorder: _propTypes.default.bool
|
|
42
|
+
};
|
|
43
|
+
var _default = exports.default = TreeView;
|