@sheinx/base 3.7.2-beta.2 → 3.7.2-beta.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.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal-content.d.ts","sourceRoot":"","sources":["modal-content.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAoB9D,QAAA,MAAM,KAAK,UAAW,iBAAiB,
|
|
1
|
+
{"version":3,"file":"modal-content.d.ts","sourceRoot":"","sources":["modal-content.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAoB9D,QAAA,MAAM,KAAK,UAAW,iBAAiB,mDA8WtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -68,7 +68,11 @@ var Modal = function Modal(props) {
|
|
|
68
68
|
isMask: false,
|
|
69
69
|
mouseDownTarget: null,
|
|
70
70
|
mouseUpTarget: null,
|
|
71
|
-
content: null
|
|
71
|
+
content: null,
|
|
72
|
+
originDocumentStyle: {
|
|
73
|
+
overflow: '',
|
|
74
|
+
paddingRight: ''
|
|
75
|
+
}
|
|
72
76
|
}),
|
|
73
77
|
context = _useRef.current;
|
|
74
78
|
var _useState3 = (0, _react.useState)(props.visible || props.autoShow),
|
|
@@ -168,18 +172,33 @@ var Modal = function Modal(props) {
|
|
|
168
172
|
setAnimation(true);
|
|
169
173
|
}
|
|
170
174
|
}, [props.visible]);
|
|
175
|
+
|
|
176
|
+
// 设置 document.body.style.overflow 和 document.body.style.paddingRight,并记录原始值到 context 中
|
|
177
|
+
var setDocumentOverflow = (0, _hooks.usePersistFn)(function () {
|
|
178
|
+
var doc = document.body.parentNode;
|
|
179
|
+
if (context.isMask) {
|
|
180
|
+
context.originDocumentStyle.overflow = doc.style.overflow;
|
|
181
|
+
context.originDocumentStyle.paddingRight = doc.style.paddingRight;
|
|
182
|
+
}
|
|
183
|
+
doc.style.overflow = 'hidden';
|
|
184
|
+
if (!doc.style.paddingRight) {
|
|
185
|
+
doc.style.paddingRight = "".concat(window.innerWidth - _hooks.util.docSize.width, "px");
|
|
186
|
+
}
|
|
187
|
+
});
|
|
188
|
+
|
|
189
|
+
// 还原 document.body.style.overflow 和 document.body.style.paddingRight
|
|
190
|
+
var resetDocumentOverflow = (0, _hooks.usePersistFn)(function () {
|
|
191
|
+
var doc = document.body.parentNode;
|
|
192
|
+
doc.style.overflow = context.originDocumentStyle.overflow;
|
|
193
|
+
doc.style.paddingRight = context.originDocumentStyle.paddingRight;
|
|
194
|
+
});
|
|
171
195
|
(0, _react.useEffect)(function () {
|
|
172
196
|
if (!props.hideMask) {
|
|
173
|
-
var doc = document.body.parentNode;
|
|
174
197
|
if (visible) {
|
|
175
|
-
|
|
176
|
-
if (!doc.style.paddingRight) {
|
|
177
|
-
doc.style.paddingRight = "".concat(window.innerWidth - _hooks.util.docSize.width, "px");
|
|
178
|
-
}
|
|
198
|
+
setDocumentOverflow();
|
|
179
199
|
} else {
|
|
180
200
|
if (!context.isMask) return;
|
|
181
|
-
|
|
182
|
-
doc.style.overflow = '';
|
|
201
|
+
resetDocumentOverflow();
|
|
183
202
|
}
|
|
184
203
|
}
|
|
185
204
|
}, [visible]);
|
|
@@ -193,20 +212,15 @@ var Modal = function Modal(props) {
|
|
|
193
212
|
// unmount
|
|
194
213
|
return function () {
|
|
195
214
|
var _props$shouldDestroy2;
|
|
215
|
+
if (context.isMask) {
|
|
216
|
+
resetDocumentOverflow();
|
|
217
|
+
}
|
|
218
|
+
;
|
|
196
219
|
(_props$shouldDestroy2 = props.shouldDestroy) === null || _props$shouldDestroy2 === void 0 || _props$shouldDestroy2.call(props, true);
|
|
197
|
-
// if (props.autoShow) {
|
|
198
|
-
// props.onClose?.();
|
|
199
|
-
// }
|
|
200
220
|
if (context.isMask) {
|
|
201
221
|
context.isMask = false;
|
|
202
222
|
hasMask = false;
|
|
203
223
|
}
|
|
204
|
-
{
|
|
205
|
-
if (!context.isMask) return;
|
|
206
|
-
var doc = document.body.parentNode;
|
|
207
|
-
doc.style.paddingRight = '';
|
|
208
|
-
doc.style.overflow = '';
|
|
209
|
-
}
|
|
210
224
|
};
|
|
211
225
|
}, []);
|
|
212
226
|
(0, _react.useEffect)(function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"modal-content.d.ts","sourceRoot":"","sources":["modal-content.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAoB9D,QAAA,MAAM,KAAK,UAAW,iBAAiB,
|
|
1
|
+
{"version":3,"file":"modal-content.d.ts","sourceRoot":"","sources":["modal-content.tsx"],"names":[],"mappings":"AAQA,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,sBAAsB,CAAC;AAoB9D,QAAA,MAAM,KAAK,UAAW,iBAAiB,mDA8WtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
|
|
@@ -62,7 +62,11 @@ var Modal = function Modal(props) {
|
|
|
62
62
|
isMask: false,
|
|
63
63
|
mouseDownTarget: null,
|
|
64
64
|
mouseUpTarget: null,
|
|
65
|
-
content: null
|
|
65
|
+
content: null,
|
|
66
|
+
originDocumentStyle: {
|
|
67
|
+
overflow: '',
|
|
68
|
+
paddingRight: ''
|
|
69
|
+
}
|
|
66
70
|
}),
|
|
67
71
|
context = _useRef.current;
|
|
68
72
|
var _useState3 = useState(props.visible || props.autoShow),
|
|
@@ -162,18 +166,33 @@ var Modal = function Modal(props) {
|
|
|
162
166
|
setAnimation(true);
|
|
163
167
|
}
|
|
164
168
|
}, [props.visible]);
|
|
169
|
+
|
|
170
|
+
// 设置 document.body.style.overflow 和 document.body.style.paddingRight,并记录原始值到 context 中
|
|
171
|
+
var setDocumentOverflow = usePersistFn(function () {
|
|
172
|
+
var doc = document.body.parentNode;
|
|
173
|
+
if (context.isMask) {
|
|
174
|
+
context.originDocumentStyle.overflow = doc.style.overflow;
|
|
175
|
+
context.originDocumentStyle.paddingRight = doc.style.paddingRight;
|
|
176
|
+
}
|
|
177
|
+
doc.style.overflow = 'hidden';
|
|
178
|
+
if (!doc.style.paddingRight) {
|
|
179
|
+
doc.style.paddingRight = "".concat(window.innerWidth - util.docSize.width, "px");
|
|
180
|
+
}
|
|
181
|
+
});
|
|
182
|
+
|
|
183
|
+
// 还原 document.body.style.overflow 和 document.body.style.paddingRight
|
|
184
|
+
var resetDocumentOverflow = usePersistFn(function () {
|
|
185
|
+
var doc = document.body.parentNode;
|
|
186
|
+
doc.style.overflow = context.originDocumentStyle.overflow;
|
|
187
|
+
doc.style.paddingRight = context.originDocumentStyle.paddingRight;
|
|
188
|
+
});
|
|
165
189
|
useEffect(function () {
|
|
166
190
|
if (!props.hideMask) {
|
|
167
|
-
var doc = document.body.parentNode;
|
|
168
191
|
if (visible) {
|
|
169
|
-
|
|
170
|
-
if (!doc.style.paddingRight) {
|
|
171
|
-
doc.style.paddingRight = "".concat(window.innerWidth - util.docSize.width, "px");
|
|
172
|
-
}
|
|
192
|
+
setDocumentOverflow();
|
|
173
193
|
} else {
|
|
174
194
|
if (!context.isMask) return;
|
|
175
|
-
|
|
176
|
-
doc.style.overflow = '';
|
|
195
|
+
resetDocumentOverflow();
|
|
177
196
|
}
|
|
178
197
|
}
|
|
179
198
|
}, [visible]);
|
|
@@ -187,20 +206,15 @@ var Modal = function Modal(props) {
|
|
|
187
206
|
// unmount
|
|
188
207
|
return function () {
|
|
189
208
|
var _props$shouldDestroy2;
|
|
209
|
+
if (context.isMask) {
|
|
210
|
+
resetDocumentOverflow();
|
|
211
|
+
}
|
|
212
|
+
;
|
|
190
213
|
(_props$shouldDestroy2 = props.shouldDestroy) === null || _props$shouldDestroy2 === void 0 || _props$shouldDestroy2.call(props, true);
|
|
191
|
-
// if (props.autoShow) {
|
|
192
|
-
// props.onClose?.();
|
|
193
|
-
// }
|
|
194
214
|
if (context.isMask) {
|
|
195
215
|
context.isMask = false;
|
|
196
216
|
hasMask = false;
|
|
197
217
|
}
|
|
198
|
-
{
|
|
199
|
-
if (!context.isMask) return;
|
|
200
|
-
var doc = document.body.parentNode;
|
|
201
|
-
doc.style.paddingRight = '';
|
|
202
|
-
doc.style.overflow = '';
|
|
203
|
-
}
|
|
204
218
|
};
|
|
205
219
|
}, []);
|
|
206
220
|
useEffect(function () {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sheinx/base",
|
|
3
|
-
"version": "3.7.2-beta.
|
|
3
|
+
"version": "3.7.2-beta.3",
|
|
4
4
|
"description": "",
|
|
5
5
|
"keywords": [],
|
|
6
6
|
"license": "MIT",
|
|
@@ -10,7 +10,7 @@
|
|
|
10
10
|
"module": "./esm/index.js",
|
|
11
11
|
"typings": "./cjs/index.d.ts",
|
|
12
12
|
"dependencies": {
|
|
13
|
-
"@sheinx/hooks": "3.7.2-beta.
|
|
13
|
+
"@sheinx/hooks": "3.7.2-beta.3",
|
|
14
14
|
"immer": "^10.0.0",
|
|
15
15
|
"classnames": "^2.0.0",
|
|
16
16
|
"@shined/reactive": "^0.1.3-alpha.0"
|