@rc-component/trigger 2.2.1 → 2.2.3

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 (7) hide show
  1. package/README.md +22 -22
  2. package/assets/index/Mask.less +4 -2
  3. package/es/hooks/useAlign.js +6 -1
  4. package/es/index.js +2 -2
  5. package/lib/hooks/useAlign.js +6 -1
  6. package/lib/index.js +2 -2
  7. package/package.json +5 -3
package/README.md CHANGED
@@ -9,20 +9,20 @@ React Trigger Component
9
9
  [![bundle size][bundlephobia-image]][bundlephobia-url]
10
10
  [![dumi][dumi-image]][dumi-url]
11
11
 
12
- [npm-image]: http://img.shields.io/npm/v/rc-checkbox.svg?style=flat-square
13
- [npm-url]: http://npmjs.org/package/rc-checkbox
14
- [github-actions-image]: https://github.com/react-component/checkbox/workflows/CI/badge.svg
15
- [github-actions-url]: https://github.com/react-component/checkbox/actions
16
- [codecov-image]: https://img.shields.io/codecov/c/github/react-component/checkbox/master.svg?style=flat-square
17
- [codecov-url]: https://codecov.io/gh/react-component/checkbox/branch/master
18
- [david-url]: https://david-dm.org/react-component/checkbox
19
- [david-image]: https://david-dm.org/react-component/checkbox/status.svg?style=flat-square
20
- [david-dev-url]: https://david-dm.org/react-component/checkbox?type=dev
21
- [david-dev-image]: https://david-dm.org/react-component/checkbox/dev-status.svg?style=flat-square
22
- [download-image]: https://img.shields.io/npm/dm/rc-checkbox.svg?style=flat-square
23
- [download-url]: https://npmjs.org/package/rc-checkbox
24
- [bundlephobia-url]: https://bundlephobia.com/result?p=rc-checkbox
25
- [bundlephobia-image]: https://badgen.net/bundlephobia/minzip/rc-checkbox
12
+ [npm-image]: http://img.shields.io/npm/v/@rc-component/trigger.svg?style=flat-square
13
+ [npm-url]: http://npmjs.org/package/@rc-component/trigger
14
+ [github-actions-image]: https://github.com/react-component/trigger/workflows/CI/badge.svg
15
+ [github-actions-url]: https://github.com/react-component/trigger/actions
16
+ [codecov-image]: https://img.shields.io/codecov/c/github/react-component/trigger/master.svg?style=flat-square
17
+ [codecov-url]: https://codecov.io/gh/react-component/trigger/branch/master
18
+ [david-url]: https://david-dm.org/react-component/trigger
19
+ [david-image]: https://david-dm.org/react-component/trigger/status.svg?style=flat-square
20
+ [david-dev-url]: https://david-dm.org/react-component/trigger?type=dev
21
+ [david-dev-image]: https://david-dm.org/react-component/trigger/dev-status.svg?style=flat-square
22
+ [download-image]: https://img.shields.io/npm/dm/@rc-component/trigger.svg?style=flat-square
23
+ [download-url]: https://npmjs.org/package/@rc-component/trigger
24
+ [bundlephobia-url]: https://bundlephobia.com/result?p=@rc-component/trigger
25
+ [bundlephobia-image]: https://badgen.net/bundlephobia/minzip/@rc-component/trigger
26
26
  [dumi-image]: https://img.shields.io/badge/docs%20by-dumi-blue?style=flat-square
27
27
  [dumi-url]: https://github.com/umijs/dumi
28
28
 
@@ -39,25 +39,26 @@ import React from 'react';
39
39
  import ReactDOM from 'react-dom';
40
40
  import Trigger from '@rc-component/trigger';
41
41
 
42
- ReactDOM.render((
42
+ ReactDOM.render(
43
43
  <Trigger
44
44
  action={['click']}
45
45
  popup={<span>popup</span>}
46
46
  popupAlign={{
47
47
  points: ['tl', 'bl'],
48
- offset: [0, 3]
48
+ offset: [0, 3],
49
49
  }}
50
50
  >
51
- <a href='#'>hover</a>
52
- </Trigger>
53
- ), container);
51
+ <a href="#">hover</a>
52
+ </Trigger>,
53
+ container,
54
+ );
54
55
  ```
55
56
 
56
57
  ## Compatibility
57
58
 
58
59
  | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/edge/edge_48x48.png" alt="IE / Edge" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>IE / Edge | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png" alt="Firefox" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Firefox | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png" alt="Chrome" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Chrome | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/safari/safari_48x48.png" alt="Safari" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Safari | [<img src="https://raw.githubusercontent.com/alrra/browser-logos/master/src/electron/electron_48x48.png" alt="Electron" width="24px" height="24px" />](http://godban.github.io/browsers-support-badges/)<br>Electron |
59
- | --- | --- | --- | --- | --- |
60
- | IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
60
+ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
61
+ | IE11, Edge | last 2 versions | last 2 versions | last 2 versions | last 2 versions |
61
62
 
62
63
  ## Example
63
64
 
@@ -243,7 +244,6 @@ npm start
243
244
  </tbody>
244
245
  </table>
245
246
 
246
-
247
247
  ## Test Case
248
248
 
249
249
  ```
package/assets/index/Mask.less CHANGED
@@ -22,7 +22,8 @@
22
22
  animation-timing-function: cubic-bezier(0.55, 0, 0.55, 0.2);
23
23
  }
24
24
 
25
- &-fade-enter,&-fade-appear {
25
+ &-fade-enter,
26
+ &-fade-appear {
26
27
  opacity: 0;
27
28
  .fade-effect();
28
29
  animation-play-state: paused;
@@ -33,7 +34,8 @@
33
34
  animation-play-state: paused;
34
35
  }
35
36
 
36
- &-fade-enter&-fade-enter-active,&-fade-appear&-fade-appear-active {
37
+ &-fade-enter&-fade-enter-active,
38
+ &-fade-appear&-fade-appear-active {
37
39
  animation-name: rcTriggerMaskFadeIn;
38
40
  animation-play-state: running;
39
41
  }
package/es/hooks/useAlign.js CHANGED
@@ -106,7 +106,7 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
106
106
  // ========================= Align =========================
107
107
  var onAlign = useEvent(function () {
108
108
  if (popupEle && target && open) {
109
- var _popupElement$parentE, _popupElement$parentE2;
109
+ var _popupElement$parentE, _popupRect$x, _popupRect$y, _popupElement$parentE2;
110
110
  var popupElement = popupEle;
111
111
  var doc = popupElement.ownerDocument;
112
112
  var win = getWin(popupElement);
@@ -149,7 +149,10 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
149
149
  height: 0
150
150
  };
151
151
  } else {
152
+ var _rect$x, _rect$y;
152
153
  var rect = target.getBoundingClientRect();
154
+ rect.x = (_rect$x = rect.x) !== null && _rect$x !== void 0 ? _rect$x : rect.left;
155
+ rect.y = (_rect$y = rect.y) !== null && _rect$y !== void 0 ? _rect$y : rect.top;
153
156
  targetRect = {
154
157
  x: rect.x,
155
158
  y: rect.y,
@@ -158,6 +161,8 @@ export default function useAlign(open, popupEle, target, placement, builtinPlace
158
161
  };
159
162
  }
160
163
  var popupRect = popupElement.getBoundingClientRect();
164
+ popupRect.x = (_popupRect$x = popupRect.x) !== null && _popupRect$x !== void 0 ? _popupRect$x : popupRect.left;
165
+ popupRect.y = (_popupRect$y = popupRect.y) !== null && _popupRect$y !== void 0 ? _popupRect$y : popupRect.top;
161
166
  var _doc$documentElement = doc.documentElement,
162
167
  clientWidth = _doc$documentElement.clientWidth,
163
168
  clientHeight = _doc$documentElement.clientHeight,
package/es/index.js CHANGED
@@ -220,14 +220,14 @@ export function generateTrigger() {
220
220
  setMotionPrepareResolve = _React$useState12[1];
221
221
 
222
222
  // =========================== Align ============================
223
- var _React$useState13 = React.useState([0, 0]),
223
+ var _React$useState13 = React.useState(null),
224
224
  _React$useState14 = _slicedToArray(_React$useState13, 2),
225
225
  mousePos = _React$useState14[0],
226
226
  setMousePos = _React$useState14[1];
227
227
  var setMousePosByEvent = function setMousePosByEvent(event) {
228
228
  setMousePos([event.clientX, event.clientY]);
229
229
  };
230
- var _useAlign = useAlign(mergedOpen, popupEle, alignPoint ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign),
230
+ var _useAlign = useAlign(mergedOpen, popupEle, alignPoint && mousePos !== null ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign),
231
231
  _useAlign2 = _slicedToArray(_useAlign, 11),
232
232
  ready = _useAlign2[0],
233
233
  offsetX = _useAlign2[1],
package/lib/hooks/useAlign.js CHANGED
@@ -114,7 +114,7 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
114
114
  // ========================= Align =========================
115
115
  var onAlign = (0, _useEvent.default)(function () {
116
116
  if (popupEle && target && open) {
117
- var _popupElement$parentE, _popupElement$parentE2;
117
+ var _popupElement$parentE, _popupRect$x, _popupRect$y, _popupElement$parentE2;
118
118
  var popupElement = popupEle;
119
119
  var doc = popupElement.ownerDocument;
120
120
  var win = (0, _util.getWin)(popupElement);
@@ -157,7 +157,10 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
157
157
  height: 0
158
158
  };
159
159
  } else {
160
+ var _rect$x, _rect$y;
160
161
  var rect = target.getBoundingClientRect();
162
+ rect.x = (_rect$x = rect.x) !== null && _rect$x !== void 0 ? _rect$x : rect.left;
163
+ rect.y = (_rect$y = rect.y) !== null && _rect$y !== void 0 ? _rect$y : rect.top;
161
164
  targetRect = {
162
165
  x: rect.x,
163
166
  y: rect.y,
@@ -166,6 +169,8 @@ function useAlign(open, popupEle, target, placement, builtinPlacements, popupAli
166
169
  };
167
170
  }
168
171
  var popupRect = popupElement.getBoundingClientRect();
172
+ popupRect.x = (_popupRect$x = popupRect.x) !== null && _popupRect$x !== void 0 ? _popupRect$x : popupRect.left;
173
+ popupRect.y = (_popupRect$y = popupRect.y) !== null && _popupRect$y !== void 0 ? _popupRect$y : popupRect.top;
169
174
  var _doc$documentElement = doc.documentElement,
170
175
  clientWidth = _doc$documentElement.clientWidth,
171
176
  clientHeight = _doc$documentElement.clientHeight,
package/lib/index.js CHANGED
@@ -228,14 +228,14 @@ function generateTrigger() {
228
228
  setMotionPrepareResolve = _React$useState12[1];
229
229
 
230
230
  // =========================== Align ============================
231
- var _React$useState13 = React.useState([0, 0]),
231
+ var _React$useState13 = React.useState(null),
232
232
  _React$useState14 = (0, _slicedToArray2.default)(_React$useState13, 2),
233
233
  mousePos = _React$useState14[0],
234
234
  setMousePos = _React$useState14[1];
235
235
  var setMousePosByEvent = function setMousePosByEvent(event) {
236
236
  setMousePos([event.clientX, event.clientY]);
237
237
  };
238
- var _useAlign = (0, _useAlign3.default)(mergedOpen, popupEle, alignPoint ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign),
238
+ var _useAlign = (0, _useAlign3.default)(mergedOpen, popupEle, alignPoint && mousePos !== null ? mousePos : targetEle, popupPlacement, builtinPlacements, popupAlign, onPopupAlign),
239
239
  _useAlign2 = (0, _slicedToArray2.default)(_useAlign, 11),
240
240
  ready = _useAlign2[0],
241
241
  offsetX = _useAlign2[1],
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rc-component/trigger",
3
- "version": "2.2.1",
3
+ "version": "2.2.3",
4
4
  "description": "base abstract trigger component for react",
5
5
  "engines": {
6
6
  "node": ">=8.x"
@@ -36,16 +36,17 @@
36
36
  "prepublishOnly": "npm run compile && np --yolo --no-publish",
37
37
  "lint": "eslint src/ docs/examples/ --ext .tsx,.ts,.jsx,.js",
38
38
  "test": "rc-test",
39
+ "prettier": "prettier --write .",
39
40
  "coverage": "rc-test --coverage",
40
41
  "now-build": "npm run build"
41
42
  },
42
43
  "devDependencies": {
43
44
  "@rc-component/father-plugin": "^1.0.0",
44
45
  "@testing-library/jest-dom": "^6.1.4",
45
- "@testing-library/react": "^15.0.4",
46
+ "@testing-library/react": "^16.0.0",
46
47
  "@types/classnames": "^2.2.10",
47
48
  "@types/jest": "^29.5.2",
48
- "@types/node": "^20.11.6",
49
+ "@types/node": "^22.0.2",
49
50
  "@types/react": "^18.0.0",
50
51
  "@types/react-dom": "^18.0.11",
51
52
  "@umijs/fabric": "^4.0.1",
@@ -55,6 +56,7 @@
55
56
  "father": "^4.0.0",
56
57
  "less": "^4.2.0",
57
58
  "np": "^10.0.5",
59
+ "prettier": "^3.3.3",
58
60
  "rc-test": "^7.0.13",
59
61
  "react": "^18.0.0",
60
62
  "react-dom": "^18.0.0",