pixuireactcomponents 1.5.26 → 1.5.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.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "pixuireactcomponents",
|
|
3
|
-
"version": "1.5.
|
|
3
|
+
"version": "1.5.28",
|
|
4
4
|
"description": "pixui react components",
|
|
5
5
|
"main": "index.js",
|
|
6
6
|
"scripts": {
|
|
@@ -11,6 +11,7 @@
|
|
|
11
11
|
"license": "ISC",
|
|
12
12
|
"dependencies": {
|
|
13
13
|
"animate.css": "^3.7.2",
|
|
14
|
+
"arale-qrcode": "^3.0.5",
|
|
14
15
|
"babel-plugin-transform-decorators-legacy": "^1.3.5",
|
|
15
16
|
"cpx": "^1.5.0",
|
|
16
17
|
"gamelet-pixui-frame": "0.4.9",
|
|
@@ -41,7 +42,6 @@
|
|
|
41
42
|
"@types/jest": "25.2.1",
|
|
42
43
|
"@types/node": "13.11.1",
|
|
43
44
|
"ajv": "^8.14.0",
|
|
44
|
-
"arale-qrcode": "^3.0.5",
|
|
45
45
|
"babel-loader": "^8.1.0",
|
|
46
46
|
"babel-plugin-import": "^1.12.0",
|
|
47
47
|
"babel-plugin-jsx-pragmatic": "^1.0.2",
|
|
@@ -35,34 +35,34 @@ export var DropDown = function (props) {
|
|
|
35
35
|
var elementStyleOrClass = getElementStyleOrClass();
|
|
36
36
|
var _a = useState(false), spread = _a[0], setSpread = _a[1];
|
|
37
37
|
var dropdownRef = useRef(null);
|
|
38
|
-
// if(compRef) {
|
|
39
|
-
// compRef.current = {
|
|
40
|
-
// setSpread: setSpread
|
|
41
|
-
// }
|
|
42
|
-
// }
|
|
43
38
|
useEffect(function () {
|
|
44
39
|
onSpread && onSpread(spread);
|
|
45
40
|
}, [spread]);
|
|
46
41
|
useEffect(function () {
|
|
42
|
+
var handleClickOutside = function (event) {
|
|
43
|
+
// console.log('handleClickOutside, ', event.clientX, event.clientY)
|
|
44
|
+
if (dropdownRef.current) {
|
|
45
|
+
var dropDownRect = dropdownRef.current.getBoundingClientRect();
|
|
46
|
+
// console.log('dropDownRect', dropDownRect, 'isOutside', event.clientX < dropDownRect.left, 'isOutside', event.clientX > dropDownRect.right, 'isOutside', event.clientY < dropDownRect.top, 'isOutside', event.clientY > dropDownRect.bottom)
|
|
47
|
+
var isOutside = event.clientX < dropDownRect.left ||
|
|
48
|
+
event.clientX > dropDownRect.right ||
|
|
49
|
+
event.clientY < dropDownRect.top ||
|
|
50
|
+
event.clientY > dropDownRect.bottom;
|
|
51
|
+
if (isOutside) {
|
|
52
|
+
setSpread(false);
|
|
53
|
+
}
|
|
54
|
+
}
|
|
55
|
+
};
|
|
47
56
|
if (spread) {
|
|
48
|
-
console.log('开始监听mousedown', spread)
|
|
57
|
+
// console.log('开始监听mousedown', spread)
|
|
49
58
|
document.body.addEventListener('mousedown', handleClickOutside);
|
|
50
59
|
}
|
|
51
|
-
else {
|
|
52
|
-
document.body.removeEventListener('mousedown', handleClickOutside);
|
|
53
|
-
}
|
|
54
60
|
return function () {
|
|
55
61
|
document.body.removeEventListener('mousedown', handleClickOutside);
|
|
56
62
|
};
|
|
57
63
|
}, [spread]);
|
|
58
|
-
var handleClickOutside = function (event) {
|
|
59
|
-
console.log('handleClickOutside, ', event.target, typeof dropdownRef.current.contains === 'function');
|
|
60
|
-
// if (dropdownRef.current && !dropdownRef.current.contains(event.target)) {
|
|
61
|
-
// setSpread(false);
|
|
62
|
-
// }
|
|
63
|
-
};
|
|
64
64
|
var handleOverlayClick = function (event) {
|
|
65
|
-
console.log("handleOverLayClick")
|
|
65
|
+
// console.log("handleOverLayClick")
|
|
66
66
|
event.stopPropagation();
|
|
67
67
|
setSpread(!spread);
|
|
68
68
|
};
|
|
@@ -74,7 +74,7 @@ export var DropDown = function (props) {
|
|
|
74
74
|
var element = option.label;
|
|
75
75
|
var originalClick = element.props.onClick;
|
|
76
76
|
var newOnClick = function (event) {
|
|
77
|
-
console.log('new onClick');
|
|
77
|
+
// console.log('new onClick');
|
|
78
78
|
if (originalClick) {
|
|
79
79
|
originalClick(event);
|
|
80
80
|
}
|