@bifrostui/utils 1.4.2-beta.1 → 1.4.2

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.
@@ -1,12 +1,11 @@
1
1
  /**
2
2
  * 根据元素宽高判断是否超出边界,超出边界则重新定义方向
3
3
  */
4
- export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, offsetSpacing, }: {
4
+ export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, }: {
5
5
  rootOffset: any;
6
6
  arrowDirection: any;
7
7
  tipOffset: any;
8
8
  arrowLocation: any;
9
- offsetSpacing: any;
10
9
  }) => {
11
10
  newArrowDirection: any;
12
11
  newArrowLocation: any;
@@ -14,21 +13,19 @@ export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tip
14
13
  /**
15
14
  * 根据新的气泡位置和箭头位置 计算气泡位置以及箭头位置
16
15
  */
17
- export declare const getDirectionLocationStyle: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, offsetSpacing, }: {
16
+ export declare const getDirectionLocationStyle: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, }: {
18
17
  rootOffset: any;
19
18
  arrowDirection: any;
20
19
  tipOffset: any;
21
20
  arrowLocation: any;
22
- offsetSpacing: any;
23
21
  }) => any;
24
22
  /**
25
23
  * 获取气泡位置和箭头位置
26
24
  */
27
- export declare const getStylesAndLocation: ({ childrenRef, arrowDirection, arrowLocation, offsetSpacing, selector, }: {
25
+ export declare const getStylesAndLocation: ({ childrenRef, arrowDirection, arrowLocation, selector, }: {
28
26
  childrenRef: any;
29
27
  arrowDirection: any;
30
28
  arrowLocation: any;
31
- offsetSpacing: any;
32
29
  selector: any;
33
30
  }) => {
34
31
  styles: any;
@@ -33,17 +33,9 @@ const getNewDirectionLocation = ({
33
33
  rootOffset,
34
34
  arrowDirection,
35
35
  tipOffset,
36
- arrowLocation,
37
- offsetSpacing
36
+ arrowLocation
38
37
  }) => {
39
- const {
40
- left: cLeft,
41
- right: cRight,
42
- top: cTop,
43
- bottom: cBottom,
44
- width: cWidth,
45
- height: cHeight
46
- } = rootOffset;
38
+ const { left: cLeft, right: cRight, top: cTop, bottom: cBottom } = rootOffset;
47
39
  const { width, height } = tipOffset;
48
40
  const pgegWidth = document.documentElement.clientWidth || document.body.clientWidth;
49
41
  const pgegHeight = document.documentElement.clientHeight || document.body.clientHeight;
@@ -53,7 +45,7 @@ const getNewDirectionLocation = ({
53
45
  const isDirectionBottom = arrowDirection === "bottom";
54
46
  const isDirectionLeft = arrowDirection === "left";
55
47
  const isDirectionRight = arrowDirection === "right";
56
- if (isDirectionTop && cTop - height - offsetSpacing < 0 || isDirectionBottom && cBottom + height + offsetSpacing > pgegHeight || isDirectionLeft && cLeft - width - offsetSpacing < 0 || isDirectionRight && cRight + width + offsetSpacing > pgegWidth) {
48
+ if (isDirectionTop && cTop - height < 0 || isDirectionBottom && cBottom + height > pgegHeight || isDirectionLeft && cLeft - width < 0 || isDirectionRight && cRight + width > pgegWidth) {
57
49
  newArrowDirection = directionCssMap[arrowDirection];
58
50
  }
59
51
  if (arrowLocation === "top" && cTop + height > pgegHeight || arrowLocation === "bottom" && cBottom - height < 0 || arrowLocation === "left" && cLeft + width > pgegWidth || arrowLocation === "right" && cRight - width < 0) {
@@ -61,15 +53,15 @@ const getNewDirectionLocation = ({
61
53
  }
62
54
  const isCenter = arrowLocation === "center";
63
55
  if (isCenter && (isDirectionTop || isDirectionBottom)) {
64
- if (cLeft + (cWidth - width) / 2 + width > pgegWidth) {
56
+ if (cLeft + width > pgegWidth) {
65
57
  newArrowLocation = directionCssMap.left;
66
- } else if (cLeft + (cWidth - width) / 2 < 0) {
58
+ } else if (cRight - width < 0) {
67
59
  newArrowLocation = directionCssMap.right;
68
60
  }
69
61
  } else if (isCenter && (isDirectionLeft || isDirectionRight)) {
70
- if (cTop + (cHeight - height) / 2 + cHeight > pgegHeight) {
62
+ if (cTop + height > pgegHeight) {
71
63
  newArrowLocation = directionCssMap.top;
72
- } else if (cTop + (cHeight - height) / 2 < 0) {
64
+ } else if (cBottom - height < 0) {
73
65
  newArrowLocation = directionCssMap.bottom;
74
66
  }
75
67
  }
@@ -82,11 +74,10 @@ const getDirectionLocationStyle = ({
82
74
  rootOffset,
83
75
  arrowDirection,
84
76
  tipOffset,
85
- arrowLocation,
86
- offsetSpacing
77
+ arrowLocation
87
78
  }) => {
88
79
  const scrollTop = window.scrollY >= 0 && window.scrollY || document.documentElement.scrollTop;
89
- const scrollLeft = window.scrollX >= 0 && window.scrollX || document.documentElement.scrollLeft;
80
+ const scrollLeft = window.screenX >= 0 && window.screenX || document.documentElement.scrollLeft;
90
81
  const styles = {};
91
82
  const {
92
83
  width: cWidth,
@@ -98,7 +89,7 @@ const getDirectionLocationStyle = ({
98
89
  } = rootOffset;
99
90
  const { width, height } = tipOffset;
100
91
  if (arrowDirection === "top") {
101
- styles.top = cTop - offsetSpacing;
92
+ styles.top = cTop;
102
93
  styles.transform = `translateY(-100%)`;
103
94
  switch (arrowLocation) {
104
95
  case "left":
@@ -115,7 +106,7 @@ const getDirectionLocationStyle = ({
115
106
  break;
116
107
  }
117
108
  } else if (arrowDirection === "bottom") {
118
- styles.top = cBottom + offsetSpacing;
109
+ styles.top = cBottom;
119
110
  switch (arrowLocation) {
120
111
  case "left":
121
112
  styles.left = cLeft;
@@ -131,7 +122,7 @@ const getDirectionLocationStyle = ({
131
122
  break;
132
123
  }
133
124
  } else if (arrowDirection === "left") {
134
- styles.left = cLeft - offsetSpacing;
125
+ styles.left = cLeft;
135
126
  styles.transform = `translateX(-100%)`;
136
127
  switch (arrowLocation) {
137
128
  case "top":
@@ -148,7 +139,7 @@ const getDirectionLocationStyle = ({
148
139
  break;
149
140
  }
150
141
  } else if (arrowDirection === "right") {
151
- styles.left = cRight + offsetSpacing;
142
+ styles.left = cRight;
152
143
  switch (arrowLocation) {
153
144
  case "top":
154
145
  styles.top = cTop;
@@ -170,14 +161,12 @@ const getDirectionLocationStyle = ({
170
161
  if (styles.left) {
171
162
  styles.left = `${styles.left + scrollLeft}px`;
172
163
  }
173
- styles.width = `${width}px`;
174
164
  return styles;
175
165
  };
176
166
  const getStylesAndLocation = ({
177
167
  childrenRef,
178
168
  arrowDirection,
179
169
  arrowLocation,
180
- offsetSpacing,
181
170
  selector
182
171
  }) => {
183
172
  if (!(childrenRef == null ? void 0 : childrenRef.current)) {
@@ -195,15 +184,13 @@ const getStylesAndLocation = ({
195
184
  rootOffset,
196
185
  arrowDirection,
197
186
  tipOffset,
198
- arrowLocation,
199
- offsetSpacing
187
+ arrowLocation
200
188
  });
201
189
  const styles = getDirectionLocationStyle({
202
190
  rootOffset,
203
191
  arrowDirection: newArrowDirection,
204
192
  tipOffset,
205
- arrowLocation: newArrowLocation,
206
- offsetSpacing
193
+ arrowLocation: newArrowLocation
207
194
  });
208
195
  styles.visibility = "visible";
209
196
  return {
@@ -1,3 +1,3 @@
1
1
  import type { TaroElement } from '@tarojs/runtime';
2
- declare const getRootElement: (rootEle?: TaroElement | (() => TaroElement)) => HTMLElement | TaroElement;
2
+ declare const getRootElement: (rootEle?: TaroElement | (() => TaroElement)) => TaroElement | HTMLElement;
3
3
  export default getRootElement;
@@ -1,12 +1,11 @@
1
1
  /**
2
2
  * 根据元素宽高判断是否超出边界,超出边界则重新定义方向
3
3
  */
4
- export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, offsetSpacing, }: {
4
+ export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, }: {
5
5
  rootOffset: any;
6
6
  arrowDirection: any;
7
7
  tipOffset: any;
8
8
  arrowLocation: any;
9
- offsetSpacing: any;
10
9
  }) => {
11
10
  newArrowDirection: any;
12
11
  newArrowLocation: any;
@@ -14,21 +13,19 @@ export declare const getNewDirectionLocation: ({ rootOffset, arrowDirection, tip
14
13
  /**
15
14
  * 根据新的气泡位置和箭头位置 计算气泡位置以及箭头位置
16
15
  */
17
- export declare const getDirectionLocationStyle: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, offsetSpacing, }: {
16
+ export declare const getDirectionLocationStyle: ({ rootOffset, arrowDirection, tipOffset, arrowLocation, }: {
18
17
  rootOffset: any;
19
18
  arrowDirection: any;
20
19
  tipOffset: any;
21
20
  arrowLocation: any;
22
- offsetSpacing: any;
23
21
  }) => any;
24
22
  /**
25
23
  * 获取气泡位置和箭头位置
26
24
  */
27
- export declare const getStylesAndLocation: ({ childrenRef, arrowDirection, arrowLocation, offsetSpacing, selector, }: {
25
+ export declare const getStylesAndLocation: ({ childrenRef, arrowDirection, arrowLocation, selector, }: {
28
26
  childrenRef: any;
29
27
  arrowDirection: any;
30
28
  arrowLocation: any;
31
- offsetSpacing: any;
32
29
  selector: any;
33
30
  }) => {
34
31
  styles: any;
@@ -8,17 +8,9 @@ const getNewDirectionLocation = ({
8
8
  rootOffset,
9
9
  arrowDirection,
10
10
  tipOffset,
11
- arrowLocation,
12
- offsetSpacing
11
+ arrowLocation
13
12
  }) => {
14
- const {
15
- left: cLeft,
16
- right: cRight,
17
- top: cTop,
18
- bottom: cBottom,
19
- width: cWidth,
20
- height: cHeight
21
- } = rootOffset;
13
+ const { left: cLeft, right: cRight, top: cTop, bottom: cBottom } = rootOffset;
22
14
  const { width, height } = tipOffset;
23
15
  const pgegWidth = document.documentElement.clientWidth || document.body.clientWidth;
24
16
  const pgegHeight = document.documentElement.clientHeight || document.body.clientHeight;
@@ -28,7 +20,7 @@ const getNewDirectionLocation = ({
28
20
  const isDirectionBottom = arrowDirection === "bottom";
29
21
  const isDirectionLeft = arrowDirection === "left";
30
22
  const isDirectionRight = arrowDirection === "right";
31
- if (isDirectionTop && cTop - height - offsetSpacing < 0 || isDirectionBottom && cBottom + height + offsetSpacing > pgegHeight || isDirectionLeft && cLeft - width - offsetSpacing < 0 || isDirectionRight && cRight + width + offsetSpacing > pgegWidth) {
23
+ if (isDirectionTop && cTop - height < 0 || isDirectionBottom && cBottom + height > pgegHeight || isDirectionLeft && cLeft - width < 0 || isDirectionRight && cRight + width > pgegWidth) {
32
24
  newArrowDirection = directionCssMap[arrowDirection];
33
25
  }
34
26
  if (arrowLocation === "top" && cTop + height > pgegHeight || arrowLocation === "bottom" && cBottom - height < 0 || arrowLocation === "left" && cLeft + width > pgegWidth || arrowLocation === "right" && cRight - width < 0) {
@@ -36,15 +28,15 @@ const getNewDirectionLocation = ({
36
28
  }
37
29
  const isCenter = arrowLocation === "center";
38
30
  if (isCenter && (isDirectionTop || isDirectionBottom)) {
39
- if (cLeft + (cWidth - width) / 2 + width > pgegWidth) {
31
+ if (cLeft + width > pgegWidth) {
40
32
  newArrowLocation = directionCssMap.left;
41
- } else if (cLeft + (cWidth - width) / 2 < 0) {
33
+ } else if (cRight - width < 0) {
42
34
  newArrowLocation = directionCssMap.right;
43
35
  }
44
36
  } else if (isCenter && (isDirectionLeft || isDirectionRight)) {
45
- if (cTop + (cHeight - height) / 2 + cHeight > pgegHeight) {
37
+ if (cTop + height > pgegHeight) {
46
38
  newArrowLocation = directionCssMap.top;
47
- } else if (cTop + (cHeight - height) / 2 < 0) {
39
+ } else if (cBottom - height < 0) {
48
40
  newArrowLocation = directionCssMap.bottom;
49
41
  }
50
42
  }
@@ -57,11 +49,10 @@ const getDirectionLocationStyle = ({
57
49
  rootOffset,
58
50
  arrowDirection,
59
51
  tipOffset,
60
- arrowLocation,
61
- offsetSpacing
52
+ arrowLocation
62
53
  }) => {
63
54
  const scrollTop = window.scrollY >= 0 && window.scrollY || document.documentElement.scrollTop;
64
- const scrollLeft = window.scrollX >= 0 && window.scrollX || document.documentElement.scrollLeft;
55
+ const scrollLeft = window.screenX >= 0 && window.screenX || document.documentElement.scrollLeft;
65
56
  const styles = {};
66
57
  const {
67
58
  width: cWidth,
@@ -73,7 +64,7 @@ const getDirectionLocationStyle = ({
73
64
  } = rootOffset;
74
65
  const { width, height } = tipOffset;
75
66
  if (arrowDirection === "top") {
76
- styles.top = cTop - offsetSpacing;
67
+ styles.top = cTop;
77
68
  styles.transform = `translateY(-100%)`;
78
69
  switch (arrowLocation) {
79
70
  case "left":
@@ -90,7 +81,7 @@ const getDirectionLocationStyle = ({
90
81
  break;
91
82
  }
92
83
  } else if (arrowDirection === "bottom") {
93
- styles.top = cBottom + offsetSpacing;
84
+ styles.top = cBottom;
94
85
  switch (arrowLocation) {
95
86
  case "left":
96
87
  styles.left = cLeft;
@@ -106,7 +97,7 @@ const getDirectionLocationStyle = ({
106
97
  break;
107
98
  }
108
99
  } else if (arrowDirection === "left") {
109
- styles.left = cLeft - offsetSpacing;
100
+ styles.left = cLeft;
110
101
  styles.transform = `translateX(-100%)`;
111
102
  switch (arrowLocation) {
112
103
  case "top":
@@ -123,7 +114,7 @@ const getDirectionLocationStyle = ({
123
114
  break;
124
115
  }
125
116
  } else if (arrowDirection === "right") {
126
- styles.left = cRight + offsetSpacing;
117
+ styles.left = cRight;
127
118
  switch (arrowLocation) {
128
119
  case "top":
129
120
  styles.top = cTop;
@@ -145,14 +136,12 @@ const getDirectionLocationStyle = ({
145
136
  if (styles.left) {
146
137
  styles.left = `${styles.left + scrollLeft}px`;
147
138
  }
148
- styles.width = `${width}px`;
149
139
  return styles;
150
140
  };
151
141
  const getStylesAndLocation = ({
152
142
  childrenRef,
153
143
  arrowDirection,
154
144
  arrowLocation,
155
- offsetSpacing,
156
145
  selector
157
146
  }) => {
158
147
  if (!(childrenRef == null ? void 0 : childrenRef.current)) {
@@ -170,15 +159,13 @@ const getStylesAndLocation = ({
170
159
  rootOffset,
171
160
  arrowDirection,
172
161
  tipOffset,
173
- arrowLocation,
174
- offsetSpacing
162
+ arrowLocation
175
163
  });
176
164
  const styles = getDirectionLocationStyle({
177
165
  rootOffset,
178
166
  arrowDirection: newArrowDirection,
179
167
  tipOffset,
180
- arrowLocation: newArrowLocation,
181
- offsetSpacing
168
+ arrowLocation: newArrowLocation
182
169
  });
183
170
  styles.visibility = "visible";
184
171
  return {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@bifrostui/utils",
3
- "version": "1.4.2-beta.1",
3
+ "version": "1.4.2",
4
4
  "description": "BUI React utilities for building components.",
5
5
  "main": "dist/index.js",
6
6
  "module": "es/index.js",