@sheinx/base 3.7.2-beta.2 → 3.7.2-beta.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.
@@ -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,mDAiWtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
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
- doc.style.overflow = 'hidden';
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
- doc.style.paddingRight = '';
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,mDAiWtC,CAAC;AAEF,eAAe,KAAK,CAAC"}
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
- doc.style.overflow = 'hidden';
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
- doc.style.paddingRight = '';
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.2",
3
+ "version": "3.7.2-beta.4",
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.2",
13
+ "@sheinx/hooks": "3.7.2-beta.4",
14
14
  "immer": "^10.0.0",
15
15
  "classnames": "^2.0.0",
16
16
  "@shined/reactive": "^0.1.3-alpha.0"