intelicoreact 1.4.27 → 1.4.28
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.
|
@@ -43,19 +43,29 @@ const TagListToDropdown = _ref => {
|
|
|
43
43
|
|
|
44
44
|
const onConfirmChangesClick = () => {
|
|
45
45
|
if (isValueChanged) {
|
|
46
|
-
var
|
|
46
|
+
var _Promise;
|
|
47
47
|
|
|
48
48
|
setIsLoading(true);
|
|
49
49
|
setIsValueChanged(false);
|
|
50
|
-
(
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
50
|
+
(_Promise = new Promise(r => {
|
|
51
|
+
const onChangeResult = onChange(options.filter(_ref3 => {
|
|
52
|
+
let {
|
|
53
|
+
value
|
|
54
|
+
} = _ref3;
|
|
55
|
+
return newValue.includes(value);
|
|
56
|
+
}));
|
|
57
|
+
|
|
58
|
+
if (onChangeResult instanceof Promise) {
|
|
59
|
+
onChangeResult.then(data => r(data));
|
|
60
|
+
} else {
|
|
61
|
+
r();
|
|
62
|
+
}
|
|
63
|
+
})) === null || _Promise === void 0 ? void 0 : _Promise.finally(() => {
|
|
56
64
|
setIsEditMode(false);
|
|
57
65
|
setIsLoading(false);
|
|
58
66
|
});
|
|
67
|
+
} else {
|
|
68
|
+
setIsEditMode(false);
|
|
59
69
|
}
|
|
60
70
|
};
|
|
61
71
|
|
|
@@ -359,18 +359,22 @@ const TagsDropdown = _ref => {
|
|
|
359
359
|
};
|
|
360
360
|
|
|
361
361
|
const setEditOptionModalStyles = () => {
|
|
362
|
-
var _editingOption$ref, _el$getBoundingClient, _dropdownListWrapperR, _positionClasses;
|
|
362
|
+
var _editingOption$ref, _el$getBoundingClient, _dropdownListWrapperR, _positionClasses, _positionClasses2;
|
|
363
363
|
|
|
364
364
|
if (!editingOption || !(editOptionModalRef !== null && editOptionModalRef !== void 0 && editOptionModalRef.current)) return null;
|
|
365
|
+
const modalSize = 200;
|
|
365
366
|
const {
|
|
366
367
|
scrollX,
|
|
367
368
|
scrollY
|
|
368
369
|
} = window;
|
|
369
370
|
const positionClasses = {
|
|
370
371
|
left: "modal-left",
|
|
371
|
-
right: "modal-right"
|
|
372
|
+
right: "modal-right",
|
|
373
|
+
top: "modal-top",
|
|
374
|
+
bottom: "modal-bottom"
|
|
372
375
|
};
|
|
373
376
|
const windowWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth;
|
|
377
|
+
const windowHeight = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
|
|
374
378
|
const el = editingOption === null || editingOption === void 0 ? void 0 : (_editingOption$ref = editingOption.ref) === null || _editingOption$ref === void 0 ? void 0 : _editingOption$ref.current;
|
|
375
379
|
const {
|
|
376
380
|
x,
|
|
@@ -379,12 +383,16 @@ const TagsDropdown = _ref => {
|
|
|
379
383
|
height
|
|
380
384
|
} = (_el$getBoundingClient = el === null || el === void 0 ? void 0 : el.getBoundingClientRect()) !== null && _el$getBoundingClient !== void 0 ? _el$getBoundingClient : {};
|
|
381
385
|
const containerPosition = dropdownListWrapperRef === null || dropdownListWrapperRef === void 0 ? void 0 : (_dropdownListWrapperR = dropdownListWrapperRef.current) === null || _dropdownListWrapperR === void 0 ? void 0 : _dropdownListWrapperR.getBoundingClientRect();
|
|
382
|
-
const
|
|
386
|
+
const distanceToRight = windowWidth - (containerPosition === null || containerPosition === void 0 ? void 0 : containerPosition.x) - (containerPosition === null || containerPosition === void 0 ? void 0 : containerPosition.width);
|
|
387
|
+
const distanceToBottom = windowHeight - y - scrollY - height;
|
|
383
388
|
Object.values(positionClasses).map(className => editOptionModalRef.current.classList.remove(className));
|
|
384
|
-
editOptionModalRef.current.classList.add((_positionClasses = positionClasses === null || positionClasses === void 0 ? void 0 : positionClasses[
|
|
389
|
+
editOptionModalRef.current.classList.add((_positionClasses = positionClasses === null || positionClasses === void 0 ? void 0 : positionClasses[distanceToRight < modalSize ? "left" : "right"]) !== null && _positionClasses !== void 0 ? _positionClasses : "");
|
|
390
|
+
editOptionModalRef.current.classList.add((_positionClasses2 = positionClasses === null || positionClasses === void 0 ? void 0 : positionClasses[distanceToBottom < modalSize ? "top" : "bottom"]) !== null && _positionClasses2 !== void 0 ? _positionClasses2 : "");
|
|
391
|
+
const xTranslate = distanceToRight < modalSize ? "calc(-100% + 7px)" : "-35px";
|
|
392
|
+
const yTranslate = distanceToBottom < modalSize ? "calc(-100% - ".concat(height + 10, "px)") : "10px";
|
|
385
393
|
editOptionModalRef.current.style.left = "".concat(x + scrollX + width, "px");
|
|
386
|
-
editOptionModalRef.current.style.top = "".concat(y + scrollY + height
|
|
387
|
-
editOptionModalRef.current.style.transform =
|
|
394
|
+
editOptionModalRef.current.style.top = "".concat(y + scrollY + height, "px");
|
|
395
|
+
editOptionModalRef.current.style.transform = "translate(".concat(xTranslate, ", ").concat(yTranslate, ")");
|
|
388
396
|
};
|
|
389
397
|
|
|
390
398
|
const renderEditOptionModal = () => {
|
|
@@ -371,7 +371,6 @@
|
|
|
371
371
|
height: 12px;
|
|
372
372
|
background: #FFFFFF;
|
|
373
373
|
transform: rotate(45deg);
|
|
374
|
-
top: -6px;
|
|
375
374
|
}
|
|
376
375
|
|
|
377
376
|
&-section {
|
|
@@ -468,6 +467,18 @@
|
|
|
468
467
|
}
|
|
469
468
|
}
|
|
470
469
|
|
|
470
|
+
&__edit-option-modal.modal-top {
|
|
471
|
+
&::before {
|
|
472
|
+
bottom: -6px;
|
|
473
|
+
}
|
|
474
|
+
}
|
|
475
|
+
|
|
476
|
+
&__edit-option-modal.modal-bottom {
|
|
477
|
+
&::before {
|
|
478
|
+
top: -6px;
|
|
479
|
+
}
|
|
480
|
+
}
|
|
481
|
+
|
|
471
482
|
&__active-icon {
|
|
472
483
|
position: absolute;
|
|
473
484
|
top: 0;
|