Skip to content

Commit 7273ed5

Browse files
giorgiofellipegiorgiofellipe
authored
Merge pull request #1 from giorgiofellipe/feat/drop
feat(chart): create getChart, resetPosition and onDropNode function
2 parents 36c04aa + 0a8ba07 commit 7273ed5

File tree

6 files changed

+36212
-9577
lines changed

6 files changed

+36212
-9577
lines changed

‎dist/ChartContainer.js‎

Lines changed: 39 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
"use strict";
1+
22

33
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
44

@@ -65,7 +65,8 @@ var propTypes = {
6565
multipleSelect: _propTypes.default.bool,
6666
onClickNode: _propTypes.default.func,
6767
onClickChart: _propTypes.default.func,
68-
onZoomChange: _propTypes.default.func
68+
onZoomChange: _propTypes.default.func,
69+
onDropNode: _propTypes.default.func
6970
};
7071
var defaultProps = {
7172
pan: false,
@@ -92,7 +93,8 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
9293
multipleSelect = _ref.multipleSelect,
9394
onClickNode = _ref.onClickNode,
9495
onClickChart = _ref.onClickChart,
95-
onZoomChange = _ref.onZoomChange;
96+
onZoomChange = _ref.onZoomChange,
97+
onDropNode = _ref.onDropNode;
9698
var container = (0, _react.useRef)();
9799
var chart = (0, _react.useRef)();
98100
var downloadButton = (0, _react.useRef)();
@@ -137,7 +139,13 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
137139
download = _useState16[0],
138140
setDownload = _useState16[1];
139141

140-
var attachRel = function attachRel(data, flags) {
142+
var attachRel = (0, _react.useCallback)(function (data, flags) {
143+
if (!!data && data.length) {
144+
data.forEach(function (item) {
145+
attachRel(item, flags === "00" ? flags : "1" + (data.length > 1 ? 1 : 0));
146+
});
147+
}
148+
141149
data.relationship = flags + (data.children && data.children.length > 0 ? 1 : 0);
142150

143151
if (data.children) {
@@ -147,7 +155,7 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
147155
}
148156

149157
return data;
150-
};
158+
}, []);
151159

152160
var _useState17 = (0, _react.useState)(datasource),
153161
_useState18 = _slicedToArray(_useState17, 2),
@@ -329,8 +337,9 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
329337

330338
case 4:
331339
setDS(_objectSpread({}, dsDigger.ds));
340+
return _context.abrupt("return", _objectSpread({}, dsDigger.ds));
332341

333-
case 5:
342+
case 6:
334343
case "end":
335344
return _context.stop();
336345
}
@@ -391,9 +400,18 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
391400
}
392401

393402
setTransform("matrix(" + newScale + ", 0, 0, " + newScale + ", 0, 0)");
403+
},
404+
getChart: function getChart() {
405+
return ds.children;
406+
},
407+
resetPosition: function resetPosition() {
408+
setTransform("");
394409
}
395410
};
396411
});
412+
var dsWithAttachedRel = (0, _react.useMemo)(function () {
413+
return attachRel(ds, "00");
414+
}, [attachRel, ds]);
397415
return /*#__PURE__*/_react.default.createElement("div", {
398416
ref: container,
399417
className: "orgchart-container " + containerClass,
@@ -409,14 +427,26 @@ var ChartContainer = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
409427
onClick: clickChartHandler,
410428
onMouseDown: pan ? panStartHandler : undefined,
411429
onMouseMove: pan && panning ? panHandler : undefined
412-
}, /*#__PURE__*/_react.default.createElement("ul", null, /*#__PURE__*/_react.default.createElement(_ChartNode.default, {
413-
datasource: attachRel(ds, "00"),
430+
}, /*#__PURE__*/_react.default.createElement("ul", null, !!dsWithAttachedRel && dsWithAttachedRel.length ? dsWithAttachedRel.map(function (_ds) {
431+
return /*#__PURE__*/_react.default.createElement(_ChartNode.default, {
432+
datasource: _ds,
433+
NodeTemplate: NodeTemplate,
434+
draggable: draggable,
435+
collapsible: collapsible,
436+
multipleSelect: multipleSelect,
437+
changeHierarchy: changeHierarchy,
438+
onClickNode: onClickNode,
439+
onDropNode: onDropNode
440+
});
441+
}) : /*#__PURE__*/_react.default.createElement(_ChartNode.default, {
442+
datasource: dsWithAttachedRel,
414443
NodeTemplate: NodeTemplate,
415444
draggable: draggable,
416445
collapsible: collapsible,
417446
multipleSelect: multipleSelect,
418447
changeHierarchy: changeHierarchy,
419-
onClickNode: onClickNode
448+
onClickNode: onClickNode,
449+
onDropNode: onDropNode
420450
}))), /*#__PURE__*/_react.default.createElement("a", {
421451
className: "oc-download-btn hidden",
422452
ref: downloadButton,

‎dist/ChartNode.js‎

Lines changed: 46 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
"use strict";
1+
22

33
function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
44

@@ -21,6 +21,10 @@ function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return
2121

2222
function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (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; }
2323

24+
function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
25+
26+
function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
27+
2428
function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
2529

2630
function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
@@ -54,7 +58,8 @@ var propTypes = {
5458
collapsible: _propTypes.default.bool,
5559
multipleSelect: _propTypes.default.bool,
5660
changeHierarchy: _propTypes.default.func,
57-
onClickNode: _propTypes.default.func
61+
onClickNode: _propTypes.default.func,
62+
onDropNode: _propTypes.default.func
5863
};
5964
var defaultProps = {
6065
draggable: false,
@@ -69,7 +74,8 @@ var ChartNode = function ChartNode(_ref) {
6974
collapsible = _ref.collapsible,
7075
multipleSelect = _ref.multipleSelect,
7176
changeHierarchy = _ref.changeHierarchy,
72-
onClickNode = _ref.onClickNode;
77+
onClickNode = _ref.onClickNode,
78+
onDropNode = _ref.onDropNode;
7379
var node = (0, _react.useRef)();
7480

7581
var _useState = (0, _react.useState)(false),
@@ -277,15 +283,42 @@ var ChartNode = function ChartNode(_ref) {
277283
_service.dragNodeService.clearDragInfo();
278284
};
279285

280-
var dropHandler = function dropHandler(event) {
281-
if (!event.currentTarget.classList.contains("allowedDrop")) {
282-
return;
283-
}
284-
285-
_service.dragNodeService.clearDragInfo();
286+
var dropHandler = /*#__PURE__*/function () {
287+
var _ref2 = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(event) {
288+
var data;
289+
return regeneratorRuntime.wrap(function _callee$(_context) {
290+
while (1) {
291+
switch (_context.prev = _context.next) {
292+
case 0:
293+
if (event.currentTarget.classList.contains("allowedDrop")) {
294+
_context.next = 2;
295+
break;
296+
}
297+
298+
return _context.abrupt("return");
299+
300+
case 2:
301+
_service.dragNodeService.clearDragInfo();
302+
303+
_context.next = 5;
304+
return changeHierarchy(JSON.parse(event.dataTransfer.getData("text/plain")), event.currentTarget.id);
305+
306+
case 5:
307+
data = _context.sent;
308+
onDropNode && onDropNode(data);
309+
310+
case 7:
311+
case "end":
312+
return _context.stop();
313+
}
314+
}
315+
}, _callee);
316+
}));
286317

287-
changeHierarchy(JSON.parse(event.dataTransfer.getData("text/plain")), event.currentTarget.id);
288-
};
318+
return function dropHandler(_x) {
319+
return _ref2.apply(this, arguments);
320+
};
321+
}();
289322

290323
return /*#__PURE__*/_react.default.createElement("li", {
291324
className: "oc-hierarchy"
@@ -333,7 +366,8 @@ var ChartNode = function ChartNode(_ref) {
333366
collapsible: collapsible,
334367
multipleSelect: multipleSelect,
335368
changeHierarchy: changeHierarchy,
336-
onClickNode: onClickNode
369+
onClickNode: onClickNode,
370+
onDropNode: onDropNode
337371
});
338372
})));
339373
};

0 commit comments

Comments
 (0)