@rc-component/trigger 1.3.2 → 1.3.4

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 (9) hide show
  1. package/es/Popup/index.js +41 -41
  2. package/es/index.js +5 -1
  3. package/lib/Popup/index.js +41 -41
  4. package/lib/index.js +5 -1
  5. package/package.json +3 -3
  6. package/es/Popup/ServerPortal.d.ts +0 -5
  7. package/es/Popup/ServerPortal.js +0 -6
  8. package/lib/Popup/ServerPortal.d.ts +0 -5
  9. package/lib/Popup/ServerPortal.js +0 -12
package/es/Popup/index.js CHANGED
@@ -5,11 +5,10 @@ import classNames from 'classnames';
5
5
  import CSSMotion from 'rc-motion';
6
6
  import ResizeObserver from 'rc-resize-observer';
7
7
  import useLayoutEffect from "rc-util/es/hooks/useLayoutEffect";
8
- import canUseDom from "rc-util/es/Dom/canUseDom";
8
+ import { composeRef } from "rc-util/es/ref";
9
9
  import * as React from 'react';
10
10
  import Arrow from "./Arrow";
11
11
  import Mask from "./Mask";
12
- import ServerPortal from "./ServerPortal";
13
12
  var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
14
13
  var popup = props.popup,
15
14
  className = props.className,
@@ -30,7 +29,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
30
29
  forceRender = props.forceRender,
31
30
  getPopupContainer = props.getPopupContainer,
32
31
  autoDestroy = props.autoDestroy,
33
- portal = props.portal,
32
+ Portal = props.portal,
34
33
  zIndex = props.zIndex,
35
34
  onMouseEnter = props.onMouseEnter,
36
35
  onMouseLeave = props.onMouseLeave,
@@ -92,7 +91,6 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
92
91
  if (!open) {
93
92
  miscStyle.pointerEvents = 'none';
94
93
  }
95
- var Portal = canUseDom() ? portal : ServerPortal;
96
94
  return /*#__PURE__*/React.createElement(Portal, {
97
95
  open: forceRender || isNodeVisible,
98
96
  getContainer: getPopupContainer && function () {
@@ -108,43 +106,45 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
108
106
  }), /*#__PURE__*/React.createElement(ResizeObserver, {
109
107
  onResize: onAlign,
110
108
  disabled: !open
111
- }, /*#__PURE__*/React.createElement(CSSMotion, _extends({
112
- motionAppear: true,
113
- motionEnter: true,
114
- motionLeave: true,
115
- removeOnLeave: false,
116
- forceRender: forceRender,
117
- leavedClassName: "".concat(prefixCls, "-hidden")
118
- }, motion, {
119
- onAppearPrepare: onPrepare,
120
- onEnterPrepare: onPrepare,
121
- visible: open,
122
- onVisibleChanged: function onVisibleChanged(nextVisible) {
123
- var _motion$onVisibleChan;
124
- motion === null || motion === void 0 ? void 0 : (_motion$onVisibleChan = motion.onVisibleChanged) === null || _motion$onVisibleChan === void 0 ? void 0 : _motion$onVisibleChan.call(motion, nextVisible);
125
- _onVisibleChanged(nextVisible);
126
- }
127
- }), function (_ref) {
128
- var motionClassName = _ref.className,
129
- motionStyle = _ref.style;
130
- var cls = classNames(prefixCls, motionClassName, className);
131
- return /*#__PURE__*/React.createElement("div", {
132
- ref: ref,
133
- className: cls,
134
- style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, offsetStyle), miscStyle), motionStyle), {}, {
135
- boxSizing: 'border-box',
136
- zIndex: zIndex
137
- }, style),
138
- onMouseEnter: onMouseEnter,
139
- onMouseLeave: onMouseLeave,
140
- onClick: onClick
141
- }, arrow && /*#__PURE__*/React.createElement(Arrow, {
142
- prefixCls: prefixCls,
143
- align: align,
144
- arrowX: arrowX,
145
- arrowY: arrowY
146
- }), childNode);
147
- })));
109
+ }, function (resizeObserverRef) {
110
+ return /*#__PURE__*/React.createElement(CSSMotion, _extends({
111
+ motionAppear: true,
112
+ motionEnter: true,
113
+ motionLeave: true,
114
+ removeOnLeave: false,
115
+ forceRender: forceRender,
116
+ leavedClassName: "".concat(prefixCls, "-hidden")
117
+ }, motion, {
118
+ onAppearPrepare: onPrepare,
119
+ onEnterPrepare: onPrepare,
120
+ visible: open,
121
+ onVisibleChanged: function onVisibleChanged(nextVisible) {
122
+ var _motion$onVisibleChan;
123
+ motion === null || motion === void 0 ? void 0 : (_motion$onVisibleChan = motion.onVisibleChanged) === null || _motion$onVisibleChan === void 0 ? void 0 : _motion$onVisibleChan.call(motion, nextVisible);
124
+ _onVisibleChanged(nextVisible);
125
+ }
126
+ }), function (_ref, motionRef) {
127
+ var motionClassName = _ref.className,
128
+ motionStyle = _ref.style;
129
+ var cls = classNames(prefixCls, motionClassName, className);
130
+ return /*#__PURE__*/React.createElement("div", {
131
+ ref: composeRef(resizeObserverRef, ref, motionRef),
132
+ className: cls,
133
+ style: _objectSpread(_objectSpread(_objectSpread(_objectSpread({}, offsetStyle), miscStyle), motionStyle), {}, {
134
+ boxSizing: 'border-box',
135
+ zIndex: zIndex
136
+ }, style),
137
+ onMouseEnter: onMouseEnter,
138
+ onMouseLeave: onMouseLeave,
139
+ onClick: onClick
140
+ }, arrow && /*#__PURE__*/React.createElement(Arrow, {
141
+ prefixCls: prefixCls,
142
+ align: align,
143
+ arrowX: arrowX,
144
+ arrowY: arrowY
145
+ }), childNode);
146
+ });
147
+ }));
148
148
  });
149
149
  if (process.env.NODE_ENV !== 'production') {
150
150
  Popup.displayName = 'Popup';
package/es/index.js CHANGED
@@ -161,8 +161,12 @@ export function generateTrigger() {
161
161
  _React$useState6 = _slicedToArray(_React$useState5, 2),
162
162
  inMotion = _React$useState6[0],
163
163
  setInMotion = _React$useState6[1];
164
+ var mountRef = React.useRef(true);
164
165
  useLayoutEffect(function () {
165
- setInMotion(true);
166
+ if (!mountRef.current || mergedOpen) {
167
+ setInMotion(true);
168
+ }
169
+ mountRef.current = true;
166
170
  }, [mergedOpen]);
167
171
  var _React$useState7 = React.useState(null),
168
172
  _React$useState8 = _slicedToArray(_React$useState7, 2),
package/lib/Popup/index.js CHANGED
@@ -13,11 +13,10 @@ var _classnames = _interopRequireDefault(require("classnames"));
13
13
  var _rcMotion = _interopRequireDefault(require("rc-motion"));
14
14
  var _rcResizeObserver = _interopRequireDefault(require("rc-resize-observer"));
15
15
  var _useLayoutEffect = _interopRequireDefault(require("rc-util/lib/hooks/useLayoutEffect"));
16
- var _canUseDom = _interopRequireDefault(require("rc-util/lib/Dom/canUseDom"));
16
+ var _ref2 = require("rc-util/lib/ref");
17
17
  var React = _interopRequireWildcard(require("react"));
18
18
  var _Arrow = _interopRequireDefault(require("./Arrow"));
19
19
  var _Mask = _interopRequireDefault(require("./Mask"));
20
- var _ServerPortal = _interopRequireDefault(require("./ServerPortal"));
21
20
  var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
22
21
  var popup = props.popup,
23
22
  className = props.className,
@@ -38,7 +37,7 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
38
37
  forceRender = props.forceRender,
39
38
  getPopupContainer = props.getPopupContainer,
40
39
  autoDestroy = props.autoDestroy,
41
- portal = props.portal,
40
+ Portal = props.portal,
42
41
  zIndex = props.zIndex,
43
42
  onMouseEnter = props.onMouseEnter,
44
43
  onMouseLeave = props.onMouseLeave,
@@ -100,7 +99,6 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
100
99
  if (!open) {
101
100
  miscStyle.pointerEvents = 'none';
102
101
  }
103
- var Portal = (0, _canUseDom.default)() ? portal : _ServerPortal.default;
104
102
  return /*#__PURE__*/React.createElement(Portal, {
105
103
  open: forceRender || isNodeVisible,
106
104
  getContainer: getPopupContainer && function () {
@@ -116,43 +114,45 @@ var Popup = /*#__PURE__*/React.forwardRef(function (props, ref) {
116
114
  }), /*#__PURE__*/React.createElement(_rcResizeObserver.default, {
117
115
  onResize: onAlign,
118
116
  disabled: !open
119
- }, /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
120
- motionAppear: true,
121
- motionEnter: true,
122
- motionLeave: true,
123
- removeOnLeave: false,
124
- forceRender: forceRender,
125
- leavedClassName: "".concat(prefixCls, "-hidden")
126
- }, motion, {
127
- onAppearPrepare: onPrepare,
128
- onEnterPrepare: onPrepare,
129
- visible: open,
130
- onVisibleChanged: function onVisibleChanged(nextVisible) {
131
- var _motion$onVisibleChan;
132
- motion === null || motion === void 0 ? void 0 : (_motion$onVisibleChan = motion.onVisibleChanged) === null || _motion$onVisibleChan === void 0 ? void 0 : _motion$onVisibleChan.call(motion, nextVisible);
133
- _onVisibleChanged(nextVisible);
134
- }
135
- }), function (_ref) {
136
- var motionClassName = _ref.className,
137
- motionStyle = _ref.style;
138
- var cls = (0, _classnames.default)(prefixCls, motionClassName, className);
139
- return /*#__PURE__*/React.createElement("div", {
140
- ref: ref,
141
- className: cls,
142
- style: (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, offsetStyle), miscStyle), motionStyle), {}, {
143
- boxSizing: 'border-box',
144
- zIndex: zIndex
145
- }, style),
146
- onMouseEnter: onMouseEnter,
147
- onMouseLeave: onMouseLeave,
148
- onClick: onClick
149
- }, arrow && /*#__PURE__*/React.createElement(_Arrow.default, {
150
- prefixCls: prefixCls,
151
- align: align,
152
- arrowX: arrowX,
153
- arrowY: arrowY
154
- }), childNode);
155
- })));
117
+ }, function (resizeObserverRef) {
118
+ return /*#__PURE__*/React.createElement(_rcMotion.default, (0, _extends2.default)({
119
+ motionAppear: true,
120
+ motionEnter: true,
121
+ motionLeave: true,
122
+ removeOnLeave: false,
123
+ forceRender: forceRender,
124
+ leavedClassName: "".concat(prefixCls, "-hidden")
125
+ }, motion, {
126
+ onAppearPrepare: onPrepare,
127
+ onEnterPrepare: onPrepare,
128
+ visible: open,
129
+ onVisibleChanged: function onVisibleChanged(nextVisible) {
130
+ var _motion$onVisibleChan;
131
+ motion === null || motion === void 0 ? void 0 : (_motion$onVisibleChan = motion.onVisibleChanged) === null || _motion$onVisibleChan === void 0 ? void 0 : _motion$onVisibleChan.call(motion, nextVisible);
132
+ _onVisibleChanged(nextVisible);
133
+ }
134
+ }), function (_ref, motionRef) {
135
+ var motionClassName = _ref.className,
136
+ motionStyle = _ref.style;
137
+ var cls = (0, _classnames.default)(prefixCls, motionClassName, className);
138
+ return /*#__PURE__*/React.createElement("div", {
139
+ ref: (0, _ref2.composeRef)(resizeObserverRef, ref, motionRef),
140
+ className: cls,
141
+ style: (0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)((0, _objectSpread2.default)({}, offsetStyle), miscStyle), motionStyle), {}, {
142
+ boxSizing: 'border-box',
143
+ zIndex: zIndex
144
+ }, style),
145
+ onMouseEnter: onMouseEnter,
146
+ onMouseLeave: onMouseLeave,
147
+ onClick: onClick
148
+ }, arrow && /*#__PURE__*/React.createElement(_Arrow.default, {
149
+ prefixCls: prefixCls,
150
+ align: align,
151
+ arrowX: arrowX,
152
+ arrowY: arrowY
153
+ }), childNode);
154
+ });
155
+ }));
156
156
  });
157
157
  if (process.env.NODE_ENV !== 'production') {
158
158
  Popup.displayName = 'Popup';
package/lib/index.js CHANGED
@@ -170,8 +170,12 @@ function generateTrigger() {
170
170
  _React$useState6 = (0, _slicedToArray2.default)(_React$useState5, 2),
171
171
  inMotion = _React$useState6[0],
172
172
  setInMotion = _React$useState6[1];
173
+ var mountRef = React.useRef(true);
173
174
  (0, _useLayoutEffect.default)(function () {
174
- setInMotion(true);
175
+ if (!mountRef.current || mergedOpen) {
176
+ setInMotion(true);
177
+ }
178
+ mountRef.current = true;
175
179
  }, [mergedOpen]);
176
180
  var _React$useState7 = React.useState(null),
177
181
  _React$useState8 = (0, _slicedToArray2.default)(_React$useState7, 2),
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@rc-component/trigger",
3
- "version": "1.3.2",
3
+ "version": "1.3.4",
4
4
  "description": "base abstract trigger component for react",
5
5
  "engines": {
6
6
  "node": ">=8.x"
@@ -45,8 +45,8 @@
45
45
  "@testing-library/react": "^13.0.0",
46
46
  "@types/classnames": "^2.2.10",
47
47
  "@types/jest": "^26.0.15",
48
- "@types/react": "^18.0.0",
49
- "@types/react-dom": "^18.0.0",
48
+ "@types/react": "^16.8.19",
49
+ "@types/react-dom": "^16.8.4",
50
50
  "cross-env": "^7.0.1",
51
51
  "dumi": "^2.1.0",
52
52
  "eslint": "^7.0.0",
package/es/Popup/ServerPortal.d.ts DELETED
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- /**
3
- * Portal will not work in SSR. We need wrap this to not to break.
4
- */
5
- export default function ServerPortal(): React.ReactElement;
package/es/Popup/ServerPortal.js DELETED
@@ -1,6 +0,0 @@
1
- /**
2
- * Portal will not work in SSR. We need wrap this to not to break.
3
- */
4
- export default function ServerPortal() {
5
- return null;
6
- }
package/lib/Popup/ServerPortal.d.ts DELETED
@@ -1,5 +0,0 @@
1
- /// <reference types="react" />
2
- /**
3
- * Portal will not work in SSR. We need wrap this to not to break.
4
- */
5
- export default function ServerPortal(): React.ReactElement;
package/lib/Popup/ServerPortal.js DELETED
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- Object.defineProperty(exports, "__esModule", {
4
- value: true
5
- });
6
- exports.default = ServerPortal;
7
- /**
8
- * Portal will not work in SSR. We need wrap this to not to break.
9
- */
10
- function ServerPortal() {
11
- return null;
12
- }