linear-react-components-ui 0.4.76-beta.2 → 0.4.76-beta.22
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.husky/pre-commit +2 -2
- package/README.md +12 -2
- package/lib/alerts/AlertProvider.js +1 -1
- package/lib/alerts/BaseAlert.js +1 -1
- package/lib/assets/styles/button.scss +17 -10
- package/lib/assets/styles/checkbox.scss +92 -70
- package/lib/assets/styles/commons.scss +26 -0
- package/lib/assets/styles/drawers.scss +22 -6
- package/lib/assets/styles/dropdown.scss +3 -0
- package/lib/assets/styles/gridlayout.scss +2 -1
- package/lib/assets/styles/input.scss +21 -0
- package/lib/assets/styles/label.scss +9 -1
- package/lib/assets/styles/panel.scss +4 -1
- package/lib/assets/styles/radio.scss +19 -0
- package/lib/assets/styles/skeleton.scss +48 -0
- package/lib/assets/styles/table.scss +19 -5
- package/lib/assets/styles/tabs.scss +51 -44
- package/lib/buttons/DefaultButton.js +8 -5
- package/lib/buttons/index.js +28 -28
- package/lib/buttons/split_button/index.js +8 -4
- package/lib/calendar/base/helpers.js +6 -6
- package/lib/calendar/base/index.js +1 -1
- package/lib/calendar/index.js +10 -10
- package/lib/checkbox/Label.js +1 -1
- package/lib/checkbox/checkbox.spec.js +16 -16
- package/lib/checkbox/index.js +17 -10
- package/lib/dialog/form/index.js +10 -3
- package/lib/dialog/index.js +6 -6
- package/lib/drawer/Drawer.js +10 -6
- package/lib/drawer/Header.js +15 -5
- package/lib/drawer/index.js +4 -4
- package/lib/dropdown/withDropdown.js +2 -2
- package/lib/fieldset/index.js +1 -1
- package/lib/form/Field.js +1 -1
- package/lib/form/helpers.js +12 -1
- package/lib/form/index.js +29 -34
- package/lib/form/withFieldHOC.js +4 -2
- package/lib/form/withFormSecurity.js +2 -2
- package/lib/index.js +12 -12
- package/lib/inputs/base/InputTextBase.js +21 -7
- package/lib/inputs/base/helpers.js +16 -4
- package/lib/inputs/color/index.js +1 -1
- package/lib/inputs/date/Dropdown.js +4 -4
- package/lib/inputs/date/date.spec.js +46 -36
- package/lib/inputs/date/helpers.js +36 -0
- package/lib/inputs/date/index.js +13 -11
- package/lib/inputs/inputHOC.js +1 -1
- package/lib/inputs/mask/Cnpj.js +1 -1
- package/lib/inputs/mask/Cpf.js +1 -1
- package/lib/inputs/mask/helpers.js +2 -2
- package/lib/inputs/mask/imaskHOC.js +3 -2
- package/lib/inputs/mask/index.js +4 -4
- package/lib/inputs/multiSelect/Dropdown.js +1 -1
- package/lib/inputs/multiSelect/index.js +1 -1
- package/lib/inputs/number/format_number.js +1 -1
- package/lib/inputs/period/Dropdown.js +1 -1
- package/lib/inputs/period/helper.js +1 -1
- package/lib/inputs/period/index.js +1 -1
- package/lib/inputs/search/index.js +1 -1
- package/lib/inputs/select/Dropdown.js +6 -3
- package/lib/inputs/select/helper.js +1 -1
- package/lib/inputs/select/multiple/index.js +2 -2
- package/lib/inputs/select/simple/index.js +1 -1
- package/lib/internals/constants.js +1 -1
- package/lib/internals/withTooltip.js +15 -12
- package/lib/labelMessages/index.js +1 -1
- package/lib/labels/DefaultLabel.js +8 -5
- package/lib/labels/index.js +10 -10
- package/lib/list/Item.js +1 -1
- package/lib/list/index.js +1 -1
- package/lib/menus/sidenav/NavMenuItem.js +3 -3
- package/lib/menus/sidenav/NavSubMenuItem.js +1 -1
- package/lib/menus/sidenav/helpers.js +1 -1
- package/lib/menus/sidenav/index.js +9 -9
- package/lib/menus/sidenav/popup_menu_search/index.js +1 -1
- package/lib/panel/Default.js +1 -1
- package/lib/panel/helpers.js +1 -1
- package/lib/panel/index.js +14 -14
- package/lib/permissionValidations.js +1 -1
- package/lib/radio/index.js +10 -7
- package/lib/skeleton/SkeletonContainer.js +42 -0
- package/lib/skeleton/index.js +84 -0
- package/lib/spinner/index.js +1 -1
- package/lib/split/Split.js +1 -1
- package/lib/table/Body.js +38 -6
- package/lib/table/Header.js +12 -1
- package/lib/table/HeaderColumn.js +26 -3
- package/lib/table/Row.js +18 -7
- package/lib/table/RowColumn.js +23 -3
- package/lib/table/helpers.js +11 -1
- package/lib/table/index.js +36 -16
- package/lib/tabs/Menu.js +1 -11
- package/lib/tabs/MenuItems.js +9 -3
- package/lib/tabs/Panel.js +1 -1
- package/lib/tabs/index.js +79 -54
- package/lib/tabs/tabHelpers.js +3 -2
- package/lib/tabs/tabs.spec.js +8 -5
- package/lib/toolbar/ButtonBar.js +30 -24
- package/lib/toolbar/LabelBar.js +22 -27
- package/lib/toolbar/helpers.js +12 -0
- package/lib/toolbar/index.js +31 -20
- package/lib/tooltip/index.js +8 -7
- package/lib/treeview/Node.js +232 -203
- package/lib/treeview/index.js +58 -30
- package/lib/treeview_old/Node.js +1 -1
- package/package.json +1 -1
- package/.DS_Store +0 -0
- package/lib/inputs/date/helper.js +0 -16
package/lib/treeview/Node.js
CHANGED
|
@@ -33,6 +33,8 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
|
|
|
33
33
|
|
|
34
34
|
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; }
|
|
35
35
|
|
|
36
|
+
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
37
|
+
|
|
36
38
|
function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
|
|
37
39
|
|
|
38
40
|
function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
|
|
@@ -45,8 +47,6 @@ function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToAr
|
|
|
45
47
|
|
|
46
48
|
function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
|
|
47
49
|
|
|
48
|
-
function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
|
|
49
|
-
|
|
50
50
|
function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
|
|
51
51
|
|
|
52
52
|
function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
|
|
@@ -59,7 +59,7 @@ function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || func
|
|
|
59
59
|
|
|
60
60
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
61
61
|
|
|
62
|
-
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
|
62
|
+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
63
63
|
|
|
64
64
|
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
65
65
|
|
|
@@ -67,204 +67,31 @@ function _isNativeReflectConstruct() { if (typeof Reflect === "undefined" || !Re
|
|
|
67
67
|
|
|
68
68
|
function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
|
|
69
69
|
|
|
70
|
+
var nodeHasItens = function nodeHasItens(node) {
|
|
71
|
+
return node.itens && node.itens.length > 0;
|
|
72
|
+
};
|
|
73
|
+
|
|
70
74
|
var TreeNode = /*#__PURE__*/function (_Component) {
|
|
71
75
|
_inherits(TreeNode, _Component);
|
|
72
76
|
|
|
73
77
|
var _super = _createSuper(TreeNode);
|
|
74
78
|
|
|
75
|
-
function TreeNode(props
|
|
79
|
+
function TreeNode(props) {
|
|
76
80
|
var _this;
|
|
77
81
|
|
|
78
82
|
_classCallCheck(this, TreeNode);
|
|
79
83
|
|
|
80
84
|
_this = _super.call(this, props);
|
|
81
|
-
Object.defineProperty(_assertThisInitialized(_this), "getSpan", {
|
|
82
|
-
configurable: true,
|
|
83
|
-
enumerable: true,
|
|
84
|
-
writable: true,
|
|
85
|
-
value: function value() {
|
|
86
|
-
var _this$props = _this.props,
|
|
87
|
-
node = _this$props.node,
|
|
88
|
-
alwaysShowArrow = _this$props.alwaysShowArrow;
|
|
89
|
-
|
|
90
|
-
var span = /*#__PURE__*/_react["default"].createElement("noscript", null);
|
|
91
|
-
|
|
92
|
-
if (node.itens && node.itens.length > 0 || alwaysShowArrow) {
|
|
93
|
-
span = /*#__PURE__*/_react["default"].createElement("span", {
|
|
94
|
-
onKeyPress: null,
|
|
95
|
-
tabIndex: 0,
|
|
96
|
-
role: "button",
|
|
97
|
-
className: "opencloseicon",
|
|
98
|
-
onClick: function onClick() {
|
|
99
|
-
return _this.openCloseTree(node);
|
|
100
|
-
}
|
|
101
|
-
}, /*#__PURE__*/_react["default"].createElement(_icons["default"], {
|
|
102
|
-
name: _this.state.isVisible ? 'up' : 'down',
|
|
103
|
-
size: 10
|
|
104
|
-
}));
|
|
105
|
-
}
|
|
106
|
-
|
|
107
|
-
return span;
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
Object.defineProperty(_assertThisInitialized(_this), "openCloseTree", {
|
|
111
|
-
configurable: true,
|
|
112
|
-
enumerable: true,
|
|
113
|
-
writable: true,
|
|
114
|
-
value: function value(node) {
|
|
115
|
-
var _this$state = _this.state,
|
|
116
|
-
isVisible = _this$state.isVisible,
|
|
117
|
-
wasOpened = _this$state.wasOpened;
|
|
118
|
-
var handlerOnNodeOpen = _this.props.handlerOnNodeOpen;
|
|
119
|
-
var nextState = {
|
|
120
|
-
isVisible: !isVisible
|
|
121
|
-
};
|
|
122
|
-
|
|
123
|
-
if (!wasOpened && handlerOnNodeOpen) {
|
|
124
|
-
nextState = _extends({}, nextState, {
|
|
125
|
-
wasOpened: true
|
|
126
|
-
});
|
|
127
|
-
handlerOnNodeOpen(node);
|
|
128
|
-
}
|
|
129
|
-
|
|
130
|
-
_this.setState(nextState);
|
|
131
|
-
}
|
|
132
|
-
});
|
|
133
|
-
Object.defineProperty(_assertThisInitialized(_this), "handleShowNodeElements", {
|
|
134
|
-
configurable: true,
|
|
135
|
-
enumerable: true,
|
|
136
|
-
writable: true,
|
|
137
|
-
value: function value() {
|
|
138
|
-
var _this$state2 = _this.state,
|
|
139
|
-
showNodeElements = _this$state2.showNodeElements,
|
|
140
|
-
keepMenuOpened = _this$state2.keepMenuOpened;
|
|
141
|
-
if (!showNodeElements) _this.setState({
|
|
142
|
-
showNodeElements: true
|
|
143
|
-
});else if (showNodeElements && !keepMenuOpened) {
|
|
144
|
-
_this.setState({
|
|
145
|
-
showNodeElements: false
|
|
146
|
-
});
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
});
|
|
150
|
-
Object.defineProperty(_assertThisInitialized(_this), "updateElements", {
|
|
151
|
-
configurable: true,
|
|
152
|
-
enumerable: true,
|
|
153
|
-
writable: true,
|
|
154
|
-
value: function value(elements) {
|
|
155
|
-
var _this$props2 = _this.props,
|
|
156
|
-
node = _this$props2.node,
|
|
157
|
-
nodeElementsValidations = _this$props2.nodeElementsValidations;
|
|
158
|
-
var updatedElements = [];
|
|
159
|
-
|
|
160
|
-
if (elements) {
|
|
161
|
-
updatedElements = _react["default"].Children.map(elements, function (element) {
|
|
162
|
-
if ( /*#__PURE__*/_react["default"].isValidElement(element) && element.props) {
|
|
163
|
-
var _element$props = element.props,
|
|
164
|
-
validationKey = _element$props.validationKey,
|
|
165
|
-
onNodeElementClick = _element$props.onNodeElementClick;
|
|
166
|
-
var elementBehavior;
|
|
167
|
-
var newProps = {};
|
|
168
|
-
|
|
169
|
-
if (nodeElementsValidations && validationKey) {
|
|
170
|
-
elementBehavior = _this.validateNodeElement(validationKey);
|
|
171
|
-
}
|
|
172
|
-
|
|
173
|
-
if (onNodeElementClick) {
|
|
174
|
-
newProps = _extends({}, newProps, {
|
|
175
|
-
onClick: function onClick(e) {
|
|
176
|
-
onNodeElementClick(node);
|
|
177
|
-
if (e.stopPropagation) e.stopPropagation();
|
|
178
|
-
},
|
|
179
|
-
onNodeElementClick: null
|
|
180
|
-
});
|
|
181
|
-
}
|
|
182
|
-
|
|
183
|
-
return /*#__PURE__*/_react["default"].cloneElement(element, _extends({}, elementBehavior, newProps));
|
|
184
|
-
}
|
|
185
85
|
|
|
186
|
-
|
|
187
|
-
});
|
|
188
|
-
}
|
|
86
|
+
_initialiseProps.call(_assertThisInitialized(_this));
|
|
189
87
|
|
|
190
|
-
return updatedElements;
|
|
191
|
-
}
|
|
192
|
-
});
|
|
193
|
-
Object.defineProperty(_assertThisInitialized(_this), "returnNodeRightElements", {
|
|
194
|
-
configurable: true,
|
|
195
|
-
enumerable: true,
|
|
196
|
-
writable: true,
|
|
197
|
-
value: function value() {
|
|
198
|
-
var nodeRightElements = _this.props.nodeRightElements;
|
|
199
|
-
|
|
200
|
-
var updatedNodeRightElements = _this.updateElements(nodeRightElements).map(function (element) {
|
|
201
|
-
var unvisible = element.props && 'visible' in element.props && !element.props.visible;
|
|
202
|
-
var style = unvisible ? {
|
|
203
|
-
display: 'none'
|
|
204
|
-
} : {};
|
|
205
|
-
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
206
|
-
style: style,
|
|
207
|
-
key: "element-".concat(_uuid["default"].v1()),
|
|
208
|
-
className: "element"
|
|
209
|
-
}, element);
|
|
210
|
-
});
|
|
211
|
-
|
|
212
|
-
return updatedNodeRightElements.length > 0 ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
213
|
-
className: "node-rightelements"
|
|
214
|
-
}, updatedNodeRightElements) : null;
|
|
215
|
-
}
|
|
216
|
-
});
|
|
217
|
-
Object.defineProperty(_assertThisInitialized(_this), "returnNodeToolbarElements", {
|
|
218
|
-
configurable: true,
|
|
219
|
-
enumerable: true,
|
|
220
|
-
writable: true,
|
|
221
|
-
value: function value() {
|
|
222
|
-
var nodeToolbarElements = _this.props.nodeToolbarElements;
|
|
223
|
-
|
|
224
|
-
var updatedNodeRightElements = _this.updateElements(nodeToolbarElements);
|
|
225
|
-
|
|
226
|
-
return updatedNodeRightElements.length > 0 ? /*#__PURE__*/_react["default"].createElement(_toolbar["default"], {
|
|
227
|
-
customClass: "node-toolbarelements"
|
|
228
|
-
}, /*#__PURE__*/_react["default"].createElement(_toolbar.ToolBarGroup, null, updatedNodeRightElements)) : null;
|
|
229
|
-
}
|
|
230
|
-
});
|
|
231
|
-
Object.defineProperty(_assertThisInitialized(_this), "validateNodeElement", {
|
|
232
|
-
configurable: true,
|
|
233
|
-
enumerable: true,
|
|
234
|
-
writable: true,
|
|
235
|
-
value: function value(validationKey) {
|
|
236
|
-
var _this$props3 = _this.props,
|
|
237
|
-
nodeElementsValidations = _this$props3.nodeElementsValidations,
|
|
238
|
-
node = _this$props3.node;
|
|
239
|
-
var validations = nodeElementsValidations[validationKey];
|
|
240
|
-
var options = {
|
|
241
|
-
disabled: {
|
|
242
|
-
disabled: true
|
|
243
|
-
},
|
|
244
|
-
unvisible: {
|
|
245
|
-
visible: false
|
|
246
|
-
}
|
|
247
|
-
};
|
|
248
|
-
var elementBehavior = {};
|
|
249
|
-
|
|
250
|
-
if (validations) {
|
|
251
|
-
validations.forEach(function (validation) {
|
|
252
|
-
var validator = validation.validator,
|
|
253
|
-
applyBehavior = validation.applyBehavior;
|
|
254
|
-
|
|
255
|
-
if (_lodash["default"].isEmpty(elementBehavior) && validator && validator(node)) {
|
|
256
|
-
elementBehavior = options[applyBehavior] || options.unvisible;
|
|
257
|
-
}
|
|
258
|
-
});
|
|
259
|
-
}
|
|
260
|
-
|
|
261
|
-
return elementBehavior;
|
|
262
|
-
}
|
|
263
|
-
});
|
|
264
88
|
_this.labelRef = /*#__PURE__*/_react["default"].createRef();
|
|
89
|
+
var node = props.node,
|
|
90
|
+
startNodesOpened = props.startNodesOpened;
|
|
265
91
|
_this.state = {
|
|
266
|
-
|
|
267
|
-
|
|
92
|
+
node: node,
|
|
93
|
+
isVisible: startNodesOpened && nodeHasItens(node),
|
|
94
|
+
wasOpened: startNodesOpened && nodeHasItens(node),
|
|
268
95
|
showNodeElements: false,
|
|
269
96
|
keepMenuOpened: false
|
|
270
97
|
};
|
|
@@ -274,10 +101,10 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
274
101
|
_createClass(TreeNode, [{
|
|
275
102
|
key: "componentDidMount",
|
|
276
103
|
value: function componentDidMount() {
|
|
277
|
-
var _this$
|
|
278
|
-
isParent = _this$
|
|
279
|
-
nodeToolbarElements = _this$
|
|
280
|
-
nodeRightElements = _this$
|
|
104
|
+
var _this$props = this.props,
|
|
105
|
+
isParent = _this$props.isParent,
|
|
106
|
+
nodeToolbarElements = _this$props.nodeToolbarElements,
|
|
107
|
+
nodeRightElements = _this$props.nodeRightElements;
|
|
281
108
|
|
|
282
109
|
if (isParent || nodeRightElements || nodeToolbarElements) {
|
|
283
110
|
this.labelRef.current.addEventListener('mouseenter', this.handleShowNodeElements);
|
|
@@ -287,10 +114,10 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
287
114
|
}, {
|
|
288
115
|
key: "componentWillUnmount",
|
|
289
116
|
value: function componentWillUnmount() {
|
|
290
|
-
var _this$
|
|
291
|
-
isParent = _this$
|
|
292
|
-
nodeToolbarElements = _this$
|
|
293
|
-
nodeRightElements = _this$
|
|
117
|
+
var _this$props2 = this.props,
|
|
118
|
+
isParent = _this$props2.isParent,
|
|
119
|
+
nodeToolbarElements = _this$props2.nodeToolbarElements,
|
|
120
|
+
nodeRightElements = _this$props2.nodeRightElements;
|
|
294
121
|
|
|
295
122
|
if (isParent || nodeRightElements || nodeToolbarElements) {
|
|
296
123
|
this.labelRef.current.removeEventListener('mouseenter', this.handleShowNodeElements);
|
|
@@ -302,12 +129,12 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
302
129
|
value: function render() {
|
|
303
130
|
var _this2 = this;
|
|
304
131
|
|
|
305
|
-
var _this$
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
132
|
+
var _this$props3 = this.props,
|
|
133
|
+
children = _this$props3.children,
|
|
134
|
+
isParent = _this$props3.isParent,
|
|
135
|
+
onNodeClick = _this$props3.onNodeClick,
|
|
136
|
+
nodeMenuButtonSize = _this$props3.nodeMenuButtonSize;
|
|
137
|
+
var node = this.state.node;
|
|
311
138
|
var showNodeElements = this.state.showNodeElements;
|
|
312
139
|
return /*#__PURE__*/_react["default"].createElement(_constants.TreeviewContext.Consumer, null, function (_ref) {
|
|
313
140
|
var valuePropName = _ref.valuePropName,
|
|
@@ -384,16 +211,217 @@ var TreeNode = /*#__PURE__*/function (_Component) {
|
|
|
384
211
|
}, _this2.state.isVisible && children));
|
|
385
212
|
});
|
|
386
213
|
}
|
|
214
|
+
}], [{
|
|
215
|
+
key: "getDerivedStateFromProps",
|
|
216
|
+
value: function getDerivedStateFromProps(props, state) {
|
|
217
|
+
var node = props.node,
|
|
218
|
+
startNodesOpened = props.startNodesOpened;
|
|
219
|
+
|
|
220
|
+
if (node !== state.node) {
|
|
221
|
+
return {
|
|
222
|
+
node: node,
|
|
223
|
+
isVisible: startNodesOpened && nodeHasItens(node),
|
|
224
|
+
wasOpened: startNodesOpened && nodeHasItens(node)
|
|
225
|
+
};
|
|
226
|
+
}
|
|
227
|
+
|
|
228
|
+
return null;
|
|
229
|
+
}
|
|
387
230
|
}]);
|
|
388
231
|
|
|
389
232
|
return TreeNode;
|
|
390
233
|
}(_react.Component);
|
|
391
234
|
|
|
235
|
+
var _initialiseProps = function _initialiseProps() {
|
|
236
|
+
var _this3 = this;
|
|
237
|
+
|
|
238
|
+
Object.defineProperty(this, "getSpan", {
|
|
239
|
+
configurable: true,
|
|
240
|
+
enumerable: true,
|
|
241
|
+
writable: true,
|
|
242
|
+
value: function value() {
|
|
243
|
+
var alwaysShowArrow = _this3.props.alwaysShowArrow;
|
|
244
|
+
var node = _this3.state.node;
|
|
245
|
+
|
|
246
|
+
var span = /*#__PURE__*/_react["default"].createElement("noscript", null);
|
|
247
|
+
|
|
248
|
+
if (node.itens && node.itens.length > 0 || alwaysShowArrow) {
|
|
249
|
+
span = /*#__PURE__*/_react["default"].createElement("span", {
|
|
250
|
+
onKeyPress: null,
|
|
251
|
+
tabIndex: 0,
|
|
252
|
+
role: "button",
|
|
253
|
+
className: "opencloseicon",
|
|
254
|
+
onClick: function onClick() {
|
|
255
|
+
return _this3.openCloseTree(node);
|
|
256
|
+
}
|
|
257
|
+
}, /*#__PURE__*/_react["default"].createElement(_icons["default"], {
|
|
258
|
+
name: _this3.state.isVisible ? 'up' : 'down',
|
|
259
|
+
size: 10
|
|
260
|
+
}));
|
|
261
|
+
}
|
|
262
|
+
|
|
263
|
+
return span;
|
|
264
|
+
}
|
|
265
|
+
});
|
|
266
|
+
Object.defineProperty(this, "openCloseTree", {
|
|
267
|
+
configurable: true,
|
|
268
|
+
enumerable: true,
|
|
269
|
+
writable: true,
|
|
270
|
+
value: function value(node) {
|
|
271
|
+
var _this3$state = _this3.state,
|
|
272
|
+
isVisible = _this3$state.isVisible,
|
|
273
|
+
wasOpened = _this3$state.wasOpened;
|
|
274
|
+
var handlerOnNodeOpen = _this3.props.handlerOnNodeOpen;
|
|
275
|
+
var nextState = {
|
|
276
|
+
isVisible: !isVisible
|
|
277
|
+
};
|
|
278
|
+
|
|
279
|
+
if (!wasOpened && handlerOnNodeOpen) {
|
|
280
|
+
nextState = _extends({}, nextState, {
|
|
281
|
+
wasOpened: true
|
|
282
|
+
});
|
|
283
|
+
handlerOnNodeOpen(node);
|
|
284
|
+
}
|
|
285
|
+
|
|
286
|
+
_this3.setState(nextState);
|
|
287
|
+
}
|
|
288
|
+
});
|
|
289
|
+
Object.defineProperty(this, "handleShowNodeElements", {
|
|
290
|
+
configurable: true,
|
|
291
|
+
enumerable: true,
|
|
292
|
+
writable: true,
|
|
293
|
+
value: function value() {
|
|
294
|
+
var _this3$state2 = _this3.state,
|
|
295
|
+
showNodeElements = _this3$state2.showNodeElements,
|
|
296
|
+
keepMenuOpened = _this3$state2.keepMenuOpened;
|
|
297
|
+
if (!showNodeElements) _this3.setState({
|
|
298
|
+
showNodeElements: true
|
|
299
|
+
});else if (showNodeElements && !keepMenuOpened) {
|
|
300
|
+
_this3.setState({
|
|
301
|
+
showNodeElements: false
|
|
302
|
+
});
|
|
303
|
+
}
|
|
304
|
+
}
|
|
305
|
+
});
|
|
306
|
+
Object.defineProperty(this, "updateElements", {
|
|
307
|
+
configurable: true,
|
|
308
|
+
enumerable: true,
|
|
309
|
+
writable: true,
|
|
310
|
+
value: function value(elements) {
|
|
311
|
+
var nodeElementsValidations = _this3.props.nodeElementsValidations;
|
|
312
|
+
var node = _this3.state.node;
|
|
313
|
+
var updatedElements = [];
|
|
314
|
+
|
|
315
|
+
if (elements) {
|
|
316
|
+
updatedElements = _react["default"].Children.map(elements, function (element) {
|
|
317
|
+
if ( /*#__PURE__*/_react["default"].isValidElement(element) && element.props) {
|
|
318
|
+
var _element$props = element.props,
|
|
319
|
+
validationKey = _element$props.validationKey,
|
|
320
|
+
onNodeElementClick = _element$props.onNodeElementClick;
|
|
321
|
+
var elementBehavior;
|
|
322
|
+
var newProps = {};
|
|
323
|
+
|
|
324
|
+
if (nodeElementsValidations && validationKey) {
|
|
325
|
+
elementBehavior = _this3.validateNodeElement(validationKey);
|
|
326
|
+
}
|
|
327
|
+
|
|
328
|
+
if (onNodeElementClick) {
|
|
329
|
+
newProps = _extends({}, newProps, {
|
|
330
|
+
onClick: function onClick(e) {
|
|
331
|
+
onNodeElementClick(node);
|
|
332
|
+
if (e.stopPropagation) e.stopPropagation();
|
|
333
|
+
},
|
|
334
|
+
onNodeElementClick: null
|
|
335
|
+
});
|
|
336
|
+
}
|
|
337
|
+
|
|
338
|
+
return /*#__PURE__*/_react["default"].cloneElement(element, _extends({}, elementBehavior, newProps));
|
|
339
|
+
}
|
|
340
|
+
|
|
341
|
+
return element;
|
|
342
|
+
});
|
|
343
|
+
}
|
|
344
|
+
|
|
345
|
+
return updatedElements;
|
|
346
|
+
}
|
|
347
|
+
});
|
|
348
|
+
Object.defineProperty(this, "returnNodeRightElements", {
|
|
349
|
+
configurable: true,
|
|
350
|
+
enumerable: true,
|
|
351
|
+
writable: true,
|
|
352
|
+
value: function value() {
|
|
353
|
+
var nodeRightElements = _this3.props.nodeRightElements;
|
|
354
|
+
|
|
355
|
+
var updatedNodeRightElements = _this3.updateElements(nodeRightElements).map(function (element) {
|
|
356
|
+
var unvisible = element.props && 'visible' in element.props && !element.props.visible;
|
|
357
|
+
var style = unvisible ? {
|
|
358
|
+
display: 'none'
|
|
359
|
+
} : {};
|
|
360
|
+
return /*#__PURE__*/_react["default"].createElement("div", {
|
|
361
|
+
style: style,
|
|
362
|
+
key: "element-".concat(_uuid["default"].v1()),
|
|
363
|
+
className: "element"
|
|
364
|
+
}, element);
|
|
365
|
+
});
|
|
366
|
+
|
|
367
|
+
return updatedNodeRightElements.length > 0 ? /*#__PURE__*/_react["default"].createElement("div", {
|
|
368
|
+
className: "node-rightelements"
|
|
369
|
+
}, updatedNodeRightElements) : null;
|
|
370
|
+
}
|
|
371
|
+
});
|
|
372
|
+
Object.defineProperty(this, "returnNodeToolbarElements", {
|
|
373
|
+
configurable: true,
|
|
374
|
+
enumerable: true,
|
|
375
|
+
writable: true,
|
|
376
|
+
value: function value() {
|
|
377
|
+
var nodeToolbarElements = _this3.props.nodeToolbarElements;
|
|
378
|
+
|
|
379
|
+
var updatedNodeRightElements = _this3.updateElements(nodeToolbarElements);
|
|
380
|
+
|
|
381
|
+
return updatedNodeRightElements.length > 0 ? /*#__PURE__*/_react["default"].createElement(_toolbar["default"], {
|
|
382
|
+
customClass: "node-toolbarelements"
|
|
383
|
+
}, /*#__PURE__*/_react["default"].createElement(_toolbar.ToolBarGroup, null, updatedNodeRightElements)) : null;
|
|
384
|
+
}
|
|
385
|
+
});
|
|
386
|
+
Object.defineProperty(this, "validateNodeElement", {
|
|
387
|
+
configurable: true,
|
|
388
|
+
enumerable: true,
|
|
389
|
+
writable: true,
|
|
390
|
+
value: function value(validationKey) {
|
|
391
|
+
var nodeElementsValidations = _this3.props.nodeElementsValidations;
|
|
392
|
+
var node = _this3.state.node;
|
|
393
|
+
var validations = nodeElementsValidations[validationKey];
|
|
394
|
+
var options = {
|
|
395
|
+
disabled: {
|
|
396
|
+
disabled: true
|
|
397
|
+
},
|
|
398
|
+
unvisible: {
|
|
399
|
+
visible: false
|
|
400
|
+
}
|
|
401
|
+
};
|
|
402
|
+
var elementBehavior = {};
|
|
403
|
+
|
|
404
|
+
if (validations) {
|
|
405
|
+
validations.forEach(function (validation) {
|
|
406
|
+
var validator = validation.validator,
|
|
407
|
+
applyBehavior = validation.applyBehavior;
|
|
408
|
+
|
|
409
|
+
if (_lodash["default"].isEmpty(elementBehavior) && validator && validator(node)) {
|
|
410
|
+
elementBehavior = options[applyBehavior] || options.unvisible;
|
|
411
|
+
}
|
|
412
|
+
});
|
|
413
|
+
}
|
|
414
|
+
|
|
415
|
+
return elementBehavior;
|
|
416
|
+
}
|
|
417
|
+
});
|
|
418
|
+
};
|
|
419
|
+
|
|
392
420
|
TreeNode.propTypes = {
|
|
393
421
|
node: _propTypes["default"].object.isRequired,
|
|
394
422
|
children: _propTypes["default"].any.isRequired,
|
|
395
423
|
childrenIds: _propTypes["default"].arrayOf(_propTypes["default"].number),
|
|
396
|
-
parentId: _propTypes["default"].number,
|
|
424
|
+
parentId: _propTypes["default"].oneOfType([_propTypes["default"].number, _propTypes["default"].string]),
|
|
397
425
|
disabled: _propTypes["default"].bool,
|
|
398
426
|
isParent: _propTypes["default"].bool,
|
|
399
427
|
alwaysShowArrow: _propTypes["default"].bool,
|
|
@@ -402,7 +430,8 @@ TreeNode.propTypes = {
|
|
|
402
430
|
nodeMenuButtonSize: _propTypes["default"].oneOf(['mini', 'small', 'medium', 'large', 'default']),
|
|
403
431
|
onNodeClick: _propTypes["default"].func,
|
|
404
432
|
handlerOnNodeOpen: _propTypes["default"].func,
|
|
405
|
-
nodeElementsValidations: _propTypes["default"].object
|
|
433
|
+
nodeElementsValidations: _propTypes["default"].object,
|
|
434
|
+
startNodesOpened: _propTypes["default"].bool.isRequired
|
|
406
435
|
};
|
|
407
436
|
TreeNode.defaultProps = {
|
|
408
437
|
childrenIds: [],
|
package/lib/treeview/index.js
CHANGED
|
@@ -65,7 +65,7 @@ function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || func
|
|
|
65
65
|
|
|
66
66
|
function _createSuper(Derived) { var hasNativeReflectConstruct = _isNativeReflectConstruct(); return function _createSuperInternal() { var Super = _getPrototypeOf(Derived), result; if (hasNativeReflectConstruct) { var NewTarget = _getPrototypeOf(this).constructor; result = Reflect.construct(Super, arguments, NewTarget); } else { result = Super.apply(this, arguments); } return _possibleConstructorReturn(this, result); }; }
|
|
67
67
|
|
|
68
|
-
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
|
|
68
|
+
function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } else if (call !== void 0) { throw new TypeError("Derived constructors may only return object or undefined"); } return _assertThisInitialized(self); }
|
|
69
69
|
|
|
70
70
|
function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
|
|
71
71
|
|
|
@@ -78,15 +78,6 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
78
78
|
|
|
79
79
|
var _super = _createSuper(TreeView);
|
|
80
80
|
|
|
81
|
-
// static getDerivedStateFromProps(props, state) {
|
|
82
|
-
// const { data, selectedIds } = props;
|
|
83
|
-
// const { propSelectedIds } = state;
|
|
84
|
-
// const isSameSelectedIds = _.isEqual(propSelectedIds.sort(), selectedIds.sort());
|
|
85
|
-
// if (data !== state.data || !isSameSelectedIds) {
|
|
86
|
-
// return { data, selectedIds, propSelectedIds: selectedIds };
|
|
87
|
-
// }
|
|
88
|
-
// return null;
|
|
89
|
-
// }
|
|
90
81
|
function TreeView(props) {
|
|
91
82
|
var _this;
|
|
92
83
|
|
|
@@ -109,20 +100,26 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
109
100
|
enumerable: true,
|
|
110
101
|
writable: true,
|
|
111
102
|
value: function value(selectedIds) {
|
|
112
|
-
var requiredIds = [];
|
|
113
|
-
var newSelectedIds = [];
|
|
114
|
-
selectedIds.forEach(function (id) {
|
|
115
|
-
var _this$checkAllAncestr = _this.checkAllAncestry(id, [], true, false),
|
|
116
|
-
requiredParentsIds = _this$checkAllAncestr.requiredParentsIds,
|
|
117
|
-
updatedIdsWithAncestryIds = _this$checkAllAncestr.updatedIdsWithAncestryIds;
|
|
118
|
-
|
|
119
|
-
newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
|
|
120
|
-
requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
|
|
121
|
-
});
|
|
122
|
-
|
|
123
103
|
_this.setState({
|
|
124
|
-
requiredParentsIds:
|
|
125
|
-
|
|
104
|
+
requiredParentsIds: []
|
|
105
|
+
}, function () {
|
|
106
|
+
var requiredIds = [];
|
|
107
|
+
var newSelectedIds = [];
|
|
108
|
+
var selectedIdsUpdatedOnMount = _this.state.selectedIdsUpdatedOnMount;
|
|
109
|
+
selectedIds.forEach(function (id) {
|
|
110
|
+
var _this$checkAllAncestr = _this.checkAllAncestry(id, [], true, false),
|
|
111
|
+
requiredParentsIds = _this$checkAllAncestr.requiredParentsIds,
|
|
112
|
+
updatedIdsWithAncestryIds = _this$checkAllAncestr.updatedIdsWithAncestryIds;
|
|
113
|
+
|
|
114
|
+
newSelectedIds = [].concat(_toConsumableArray(newSelectedIds), _toConsumableArray(updatedIdsWithAncestryIds));
|
|
115
|
+
requiredIds = [].concat(_toConsumableArray(requiredIds), _toConsumableArray(requiredParentsIds));
|
|
116
|
+
});
|
|
117
|
+
|
|
118
|
+
_this.setState({
|
|
119
|
+
requiredParentsIds: _lodash["default"].uniq(requiredIds),
|
|
120
|
+
selectedIds: _lodash["default"].uniq(newSelectedIds),
|
|
121
|
+
selectedIdsUpdatedOnMount: selectedIdsUpdatedOnMount || true
|
|
122
|
+
});
|
|
126
123
|
});
|
|
127
124
|
}
|
|
128
125
|
});
|
|
@@ -471,7 +468,8 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
471
468
|
nodeElementsValidations = _this$props3.nodeElementsValidations,
|
|
472
469
|
nodeToolbarElements = _this$props3.nodeToolbarElements,
|
|
473
470
|
nodeMenuButtonSize = _this$props3.nodeMenuButtonSize,
|
|
474
|
-
alwaysShowArrow = _this$props3.alwaysShowArrow
|
|
471
|
+
alwaysShowArrow = _this$props3.alwaysShowArrow,
|
|
472
|
+
startNodesOpened = _this$props3.startNodesOpened;
|
|
475
473
|
var childrenIds = [];
|
|
476
474
|
|
|
477
475
|
if (node.itens && node.itens.length > 0) {
|
|
@@ -489,6 +487,7 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
489
487
|
return /*#__PURE__*/_react["default"].createElement(_Node["default"], {
|
|
490
488
|
key: "node-".concat(node.id),
|
|
491
489
|
node: node,
|
|
490
|
+
startNodesOpened: startNodesOpened,
|
|
492
491
|
alwaysShowArrow: alwaysShowArrow,
|
|
493
492
|
childrenIds: childrenIds,
|
|
494
493
|
isParent: node.itens && node.itens.length > 0,
|
|
@@ -511,7 +510,8 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
511
510
|
selectedIds: _this.props.selectedIds,
|
|
512
511
|
isHandlingSelectedIds: false,
|
|
513
512
|
requiredParentsIds: [],
|
|
514
|
-
alreadyOpenedIds: []
|
|
513
|
+
alreadyOpenedIds: [],
|
|
514
|
+
selectedIdsUpdatedOnMount: false
|
|
515
515
|
};
|
|
516
516
|
return _this;
|
|
517
517
|
}
|
|
@@ -526,12 +526,15 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
526
526
|
value: function componentDidUpdate(prevProps, prevState) {
|
|
527
527
|
var _this$state3 = this.state,
|
|
528
528
|
selectedIds = _this$state3.selectedIds,
|
|
529
|
-
propSelectedIds = _this$state3.propSelectedIds
|
|
529
|
+
propSelectedIds = _this$state3.propSelectedIds,
|
|
530
|
+
selectedIdsUpdatedOnMount = _this$state3.selectedIdsUpdatedOnMount;
|
|
530
531
|
var allowCheckAllAncestry = this.props.allowCheckAllAncestry;
|
|
531
532
|
|
|
532
533
|
var isSameSelectedIds = _lodash["default"].isEqual(propSelectedIds.sort(), prevState.propSelectedIds.sort());
|
|
533
534
|
|
|
534
|
-
if (allowCheckAllAncestry && !isSameSelectedIds)
|
|
535
|
+
if (allowCheckAllAncestry && (!selectedIdsUpdatedOnMount || !isSameSelectedIds)) {
|
|
536
|
+
this.handleNewSelectedIds(selectedIds);
|
|
537
|
+
}
|
|
535
538
|
}
|
|
536
539
|
}, {
|
|
537
540
|
key: "render",
|
|
@@ -551,6 +554,29 @@ var TreeView = /*#__PURE__*/function (_Component) {
|
|
|
551
554
|
className: "treeviewcontainer ".concat(bordered && '-bordered')
|
|
552
555
|
}, this.buildTree(data))));
|
|
553
556
|
}
|
|
557
|
+
}], [{
|
|
558
|
+
key: "getDerivedStateFromProps",
|
|
559
|
+
value: function getDerivedStateFromProps(props, state) {
|
|
560
|
+
var data = props.data,
|
|
561
|
+
selectedIds = props.selectedIds,
|
|
562
|
+
enableDynamicData = props.enableDynamicData;
|
|
563
|
+
var propSelectedIds = state.propSelectedIds;
|
|
564
|
+
|
|
565
|
+
var isSameSelectedIds = _lodash["default"].isEqual(propSelectedIds.sort(), selectedIds.sort());
|
|
566
|
+
|
|
567
|
+
if (enableDynamicData && data !== state.data) {
|
|
568
|
+
return {
|
|
569
|
+
data: data
|
|
570
|
+
};
|
|
571
|
+
} else if (!isSameSelectedIds) {
|
|
572
|
+
return {
|
|
573
|
+
selectedIds: selectedIds,
|
|
574
|
+
propSelectedIds: selectedIds
|
|
575
|
+
};
|
|
576
|
+
}
|
|
577
|
+
|
|
578
|
+
return null;
|
|
579
|
+
}
|
|
554
580
|
}]);
|
|
555
581
|
|
|
556
582
|
return TreeView;
|
|
@@ -566,7 +592,7 @@ TreeView.propTypes = {
|
|
|
566
592
|
startNodesOpened: _propTypes["default"].bool,
|
|
567
593
|
alwaysShowArrow: _propTypes["default"].bool,
|
|
568
594
|
selectedIds: _propTypes["default"].arrayOf(_propTypes["default"].number),
|
|
569
|
-
requiredIds: _propTypes["default"].arrayOf(_propTypes["default"].number),
|
|
595
|
+
requiredIds: _propTypes["default"].arrayOf(_propTypes["default"].oneOfType([_propTypes["default"].string, _propTypes["default"].number])),
|
|
570
596
|
showCheckBox: _propTypes["default"].bool,
|
|
571
597
|
onSelectedIdsChange: _propTypes["default"].func,
|
|
572
598
|
children: _propTypes["default"].instanceOf(Object),
|
|
@@ -579,7 +605,8 @@ TreeView.propTypes = {
|
|
|
579
605
|
nodeMenuButtonSize: _propTypes["default"].oneOf(['mini', 'small', 'medium', 'large', 'default']),
|
|
580
606
|
onNodeClick: _propTypes["default"].func,
|
|
581
607
|
onNodeOpen: _propTypes["default"].func,
|
|
582
|
-
nodeElementsValidations: _propTypes["default"].object
|
|
608
|
+
nodeElementsValidations: _propTypes["default"].object,
|
|
609
|
+
enableDynamicData: _propTypes["default"].bool
|
|
583
610
|
};
|
|
584
611
|
TreeView.defaultProps = {
|
|
585
612
|
customClass: '',
|
|
@@ -600,7 +627,8 @@ TreeView.defaultProps = {
|
|
|
600
627
|
nodeMenuButtonSize: 'small',
|
|
601
628
|
onNodeClick: undefined,
|
|
602
629
|
onNodeOpen: undefined,
|
|
603
|
-
nodeElementsValidations: undefined
|
|
630
|
+
nodeElementsValidations: undefined,
|
|
631
|
+
enableDynamicData: false
|
|
604
632
|
};
|
|
605
633
|
var _default = TreeView;
|
|
606
634
|
exports["default"] = _default;
|