@rc-component/trigger 1.12.0 → 1.12.1

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.
Files changed (5) hide show
  1. package/es/util.d.ts +23 -1
  2. package/es/util.js +70 -14
  3. package/lib/util.d.ts +23 -1
  4. package/lib/util.js +70 -14
  5. package/package.json +1 -1
package/es/util.d.ts CHANGED
@@ -10,13 +10,35 @@ export declare function getWin(ele: HTMLElement): Window & typeof globalThis;
10
10
  * @param areaOnly Only return the parent which will cut visible area
11
11
  */
12
12
  export declare function collectScroller(ele: HTMLElement): HTMLElement[];
13
- export declare function toNum(num: number): number;
13
+ export declare function toNum(num: number, defaultValue?: number): number;
14
14
  export interface VisibleArea {
15
15
  left: number;
16
16
  top: number;
17
17
  right: number;
18
18
  bottom: number;
19
19
  }
20
+ /**
21
+ *
22
+ *
23
+ * **************************************
24
+ * * Border *
25
+ * * ************************** *
26
+ * * * * * *
27
+ * * B * * S * B *
28
+ * * o * * c * o *
29
+ * * r * Content * r * r *
30
+ * * d * * o * d *
31
+ * * e * * l * e *
32
+ * * r ******************** l * r *
33
+ * * * Scroll * *
34
+ * * ************************** *
35
+ * * Border *
36
+ * **************************************
37
+ *
38
+ */
39
+ /**
40
+ * Get visible area of element
41
+ */
20
42
  export declare function getVisibleArea(initArea: VisibleArea, scrollerList?: HTMLElement[]): {
21
43
  left: number;
22
44
  top: number;
package/es/util.js CHANGED
@@ -50,12 +50,15 @@ export function getWin(ele) {
50
50
  export function collectScroller(ele) {
51
51
  var scrollerList = [];
52
52
  var current = ele === null || ele === void 0 ? void 0 : ele.parentElement;
53
- var scrollStyle = ['hidden', 'scroll', 'auto'];
53
+ var scrollStyle = ['hidden', 'scroll', 'clip', 'auto'];
54
54
  while (current) {
55
55
  var _getWin$getComputedSt = getWin(current).getComputedStyle(current),
56
56
  overflowX = _getWin$getComputedSt.overflowX,
57
- overflowY = _getWin$getComputedSt.overflowY;
58
- if (scrollStyle.includes(overflowX) || scrollStyle.includes(overflowY)) {
57
+ overflowY = _getWin$getComputedSt.overflowY,
58
+ overflow = _getWin$getComputedSt.overflow;
59
+ if ([overflowX, overflowY, overflow].some(function (o) {
60
+ return scrollStyle.includes(o);
61
+ })) {
59
62
  scrollerList.push(current);
60
63
  }
61
64
  current = current.parentElement;
@@ -63,8 +66,34 @@ export function collectScroller(ele) {
63
66
  return scrollerList;
64
67
  }
65
68
  export function toNum(num) {
66
- return Number.isNaN(num) ? 1 : num;
69
+ var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
70
+ return Number.isNaN(num) ? defaultValue : num;
67
71
  }
72
+ function getPxValue(val) {
73
+ return toNum(parseFloat(val), 0);
74
+ }
75
+ /**
76
+ *
77
+ *
78
+ * **************************************
79
+ * * Border *
80
+ * * ************************** *
81
+ * * * * * *
82
+ * * B * * S * B *
83
+ * * o * * c * o *
84
+ * * r * Content * r * r *
85
+ * * d * * o * d *
86
+ * * e * * l * e *
87
+ * * r ******************** l * r *
88
+ * * * Scroll * *
89
+ * * ************************** *
90
+ * * Border *
91
+ * **************************************
92
+ *
93
+ */
94
+ /**
95
+ * Get visible area of element
96
+ */
68
97
  export function getVisibleArea(initArea, scrollerList) {
69
98
  var visibleArea = _objectSpread({}, initArea);
70
99
  (scrollerList || []).forEach(function (ele) {
@@ -74,23 +103,50 @@ export function getVisibleArea(initArea, scrollerList) {
74
103
 
75
104
  // Skip if static position which will not affect visible area
76
105
  var _getWin$getComputedSt2 = getWin(ele).getComputedStyle(ele),
77
- position = _getWin$getComputedSt2.position;
78
- if (position === 'static') {
79
- return;
80
- }
106
+ overflow = _getWin$getComputedSt2.overflow,
107
+ overflowClipMargin = _getWin$getComputedSt2.overflowClipMargin,
108
+ borderTopWidth = _getWin$getComputedSt2.borderTopWidth,
109
+ borderBottomWidth = _getWin$getComputedSt2.borderBottomWidth,
110
+ borderLeftWidth = _getWin$getComputedSt2.borderLeftWidth,
111
+ borderRightWidth = _getWin$getComputedSt2.borderRightWidth;
81
112
  var eleRect = ele.getBoundingClientRect();
82
113
  var eleOutHeight = ele.offsetHeight,
83
114
  eleInnerHeight = ele.clientHeight,
84
115
  eleOutWidth = ele.offsetWidth,
85
116
  eleInnerWidth = ele.clientWidth;
117
+ var borderTopNum = getPxValue(borderTopWidth);
118
+ var borderBottomNum = getPxValue(borderBottomWidth);
119
+ var borderLeftNum = getPxValue(borderLeftWidth);
120
+ var borderRightNum = getPxValue(borderRightWidth);
86
121
  var scaleX = toNum(Math.round(eleRect.width / eleOutWidth * 1000) / 1000);
87
122
  var scaleY = toNum(Math.round(eleRect.height / eleOutHeight * 1000) / 1000);
88
- var eleScrollWidth = (eleOutWidth - eleInnerWidth) * scaleX;
89
- var eleScrollHeight = (eleOutHeight - eleInnerHeight) * scaleY;
90
- var eleRight = eleRect.x + eleRect.width - eleScrollWidth;
91
- var eleBottom = eleRect.y + eleRect.height - eleScrollHeight;
92
- visibleArea.left = Math.max(visibleArea.left, eleRect.x);
93
- visibleArea.top = Math.max(visibleArea.top, eleRect.y);
123
+
124
+ // Original visible area
125
+ var eleScrollWidth = (eleOutWidth - eleInnerWidth - borderLeftNum - borderRightNum) * scaleX;
126
+ var eleScrollHeight = (eleOutHeight - eleInnerHeight - borderTopNum - borderBottomNum) * scaleY;
127
+
128
+ // Cut border size
129
+ var scaledBorderTopWidth = borderTopNum * scaleY;
130
+ var scaledBorderBottomWidth = borderBottomNum * scaleY;
131
+ var scaledBorderLeftWidth = borderLeftNum * scaleX;
132
+ var scaledBorderRightWidth = borderRightNum * scaleX;
133
+
134
+ // Clip margin
135
+ var clipMarginWidth = 0;
136
+ var clipMarginHeight = 0;
137
+ if (overflow === 'clip') {
138
+ var clipNum = getPxValue(overflowClipMargin);
139
+ clipMarginWidth = clipNum * scaleX;
140
+ clipMarginHeight = clipNum * scaleY;
141
+ }
142
+
143
+ // Region
144
+ var eleLeft = eleRect.x + scaledBorderLeftWidth - clipMarginWidth;
145
+ var eleTop = eleRect.y + scaledBorderTopWidth - clipMarginHeight;
146
+ var eleRight = eleLeft + eleRect.width + 2 * clipMarginWidth - scaledBorderLeftWidth - scaledBorderRightWidth - eleScrollWidth;
147
+ var eleBottom = eleTop + eleRect.height + 2 * clipMarginHeight - scaledBorderTopWidth - scaledBorderBottomWidth - eleScrollHeight;
148
+ visibleArea.left = Math.max(visibleArea.left, eleLeft);
149
+ visibleArea.top = Math.max(visibleArea.top, eleTop);
94
150
  visibleArea.right = Math.min(visibleArea.right, eleRight);
95
151
  visibleArea.bottom = Math.min(visibleArea.bottom, eleBottom);
96
152
  });
package/lib/util.d.ts CHANGED
@@ -10,13 +10,35 @@ export declare function getWin(ele: HTMLElement): Window & typeof globalThis;
10
10
  * @param areaOnly Only return the parent which will cut visible area
11
11
  */
12
12
  export declare function collectScroller(ele: HTMLElement): HTMLElement[];
13
- export declare function toNum(num: number): number;
13
+ export declare function toNum(num: number, defaultValue?: number): number;
14
14
  export interface VisibleArea {
15
15
  left: number;
16
16
  top: number;
17
17
  right: number;
18
18
  bottom: number;
19
19
  }
20
+ /**
21
+ *
22
+ *
23
+ * **************************************
24
+ * * Border *
25
+ * * ************************** *
26
+ * * * * * *
27
+ * * B * * S * B *
28
+ * * o * * c * o *
29
+ * * r * Content * r * r *
30
+ * * d * * o * d *
31
+ * * e * * l * e *
32
+ * * r ******************** l * r *
33
+ * * * Scroll * *
34
+ * * ************************** *
35
+ * * Border *
36
+ * **************************************
37
+ *
38
+ */
39
+ /**
40
+ * Get visible area of element
41
+ */
20
42
  export declare function getVisibleArea(initArea: VisibleArea, scrollerList?: HTMLElement[]): {
21
43
  left: number;
22
44
  top: number;
package/lib/util.js CHANGED
@@ -62,12 +62,15 @@ function getWin(ele) {
62
62
  function collectScroller(ele) {
63
63
  var scrollerList = [];
64
64
  var current = ele === null || ele === void 0 ? void 0 : ele.parentElement;
65
- var scrollStyle = ['hidden', 'scroll', 'auto'];
65
+ var scrollStyle = ['hidden', 'scroll', 'clip', 'auto'];
66
66
  while (current) {
67
67
  var _getWin$getComputedSt = getWin(current).getComputedStyle(current),
68
68
  overflowX = _getWin$getComputedSt.overflowX,
69
- overflowY = _getWin$getComputedSt.overflowY;
70
- if (scrollStyle.includes(overflowX) || scrollStyle.includes(overflowY)) {
69
+ overflowY = _getWin$getComputedSt.overflowY,
70
+ overflow = _getWin$getComputedSt.overflow;
71
+ if ([overflowX, overflowY, overflow].some(function (o) {
72
+ return scrollStyle.includes(o);
73
+ })) {
71
74
  scrollerList.push(current);
72
75
  }
73
76
  current = current.parentElement;
@@ -75,8 +78,34 @@ function collectScroller(ele) {
75
78
  return scrollerList;
76
79
  }
77
80
  function toNum(num) {
78
- return Number.isNaN(num) ? 1 : num;
81
+ var defaultValue = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : 1;
82
+ return Number.isNaN(num) ? defaultValue : num;
79
83
  }
84
+ function getPxValue(val) {
85
+ return toNum(parseFloat(val), 0);
86
+ }
87
+ /**
88
+ *
89
+ *
90
+ * **************************************
91
+ * * Border *
92
+ * * ************************** *
93
+ * * * * * *
94
+ * * B * * S * B *
95
+ * * o * * c * o *
96
+ * * r * Content * r * r *
97
+ * * d * * o * d *
98
+ * * e * * l * e *
99
+ * * r ******************** l * r *
100
+ * * * Scroll * *
101
+ * * ************************** *
102
+ * * Border *
103
+ * **************************************
104
+ *
105
+ */
106
+ /**
107
+ * Get visible area of element
108
+ */
80
109
  function getVisibleArea(initArea, scrollerList) {
81
110
  var visibleArea = (0, _objectSpread2.default)({}, initArea);
82
111
  (scrollerList || []).forEach(function (ele) {
@@ -86,23 +115,50 @@ function getVisibleArea(initArea, scrollerList) {
86
115
 
87
116
  // Skip if static position which will not affect visible area
88
117
  var _getWin$getComputedSt2 = getWin(ele).getComputedStyle(ele),
89
- position = _getWin$getComputedSt2.position;
90
- if (position === 'static') {
91
- return;
92
- }
118
+ overflow = _getWin$getComputedSt2.overflow,
119
+ overflowClipMargin = _getWin$getComputedSt2.overflowClipMargin,
120
+ borderTopWidth = _getWin$getComputedSt2.borderTopWidth,
121
+ borderBottomWidth = _getWin$getComputedSt2.borderBottomWidth,
122
+ borderLeftWidth = _getWin$getComputedSt2.borderLeftWidth,
123
+ borderRightWidth = _getWin$getComputedSt2.borderRightWidth;
93
124
  var eleRect = ele.getBoundingClientRect();
94
125
  var eleOutHeight = ele.offsetHeight,
95
126
  eleInnerHeight = ele.clientHeight,
96
127
  eleOutWidth = ele.offsetWidth,
97
128
  eleInnerWidth = ele.clientWidth;
129
+ var borderTopNum = getPxValue(borderTopWidth);
130
+ var borderBottomNum = getPxValue(borderBottomWidth);
131
+ var borderLeftNum = getPxValue(borderLeftWidth);
132
+ var borderRightNum = getPxValue(borderRightWidth);
98
133
  var scaleX = toNum(Math.round(eleRect.width / eleOutWidth * 1000) / 1000);
99
134
  var scaleY = toNum(Math.round(eleRect.height / eleOutHeight * 1000) / 1000);
100
- var eleScrollWidth = (eleOutWidth - eleInnerWidth) * scaleX;
101
- var eleScrollHeight = (eleOutHeight - eleInnerHeight) * scaleY;
102
- var eleRight = eleRect.x + eleRect.width - eleScrollWidth;
103
- var eleBottom = eleRect.y + eleRect.height - eleScrollHeight;
104
- visibleArea.left = Math.max(visibleArea.left, eleRect.x);
105
- visibleArea.top = Math.max(visibleArea.top, eleRect.y);
135
+
136
+ // Original visible area
137
+ var eleScrollWidth = (eleOutWidth - eleInnerWidth - borderLeftNum - borderRightNum) * scaleX;
138
+ var eleScrollHeight = (eleOutHeight - eleInnerHeight - borderTopNum - borderBottomNum) * scaleY;
139
+
140
+ // Cut border size
141
+ var scaledBorderTopWidth = borderTopNum * scaleY;
142
+ var scaledBorderBottomWidth = borderBottomNum * scaleY;
143
+ var scaledBorderLeftWidth = borderLeftNum * scaleX;
144
+ var scaledBorderRightWidth = borderRightNum * scaleX;
145
+
146
+ // Clip margin
147
+ var clipMarginWidth = 0;
148
+ var clipMarginHeight = 0;
149
+ if (overflow === 'clip') {
150
+ var clipNum = getPxValue(overflowClipMargin);
151
+ clipMarginWidth = clipNum * scaleX;
152
+ clipMarginHeight = clipNum * scaleY;
153
+ }
154
+
155
+ // Region
156
+ var eleLeft = eleRect.x + scaledBorderLeftWidth - clipMarginWidth;
157
+ var eleTop = eleRect.y + scaledBorderTopWidth - clipMarginHeight;
158
+ var eleRight = eleLeft + eleRect.width + 2 * clipMarginWidth - scaledBorderLeftWidth - scaledBorderRightWidth - eleScrollWidth;
159
+ var eleBottom = eleTop + eleRect.height + 2 * clipMarginHeight - scaledBorderTopWidth - scaledBorderBottomWidth - eleScrollHeight;
160
+ visibleArea.left = Math.max(visibleArea.left, eleLeft);
161
+ visibleArea.top = Math.max(visibleArea.top, eleTop);
106
162
  visibleArea.right = Math.min(visibleArea.right, eleRight);
107
163
  visibleArea.bottom = Math.min(visibleArea.bottom, eleBottom);
108
164
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rc-component/trigger",
3
- "version": "1.12.0",
3
+ "version": "1.12.1",
4
4
  "description": "base abstract trigger component for react",
5
5
  "engines": {
6
6
  "node": ">=8.x"