@sheinx/hooks 3.8.0-beta.23 → 3.8.0-beta.25

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 (5) hide show
  1. package/cjs/utils/lazyload.d.ts.map +1 -1
  2. package/cjs/utils/lazyload.js +33 -1
  3. package/esm/utils/lazyload.d.ts.map +1 -1
  4. package/esm/utils/lazyload.js +33 -1
  5. package/package.json +1 -1
package/cjs/utils/lazyload.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"lazyload.d.ts","sourceRoot":"","sources":["lazyload.ts"],"names":[],"mappings":"AAKA,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC,CAAC;AAsBF,wBAAgB,QAAQ,SAgBvB;AAWD,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,cAAc,CAAC,EAAE,OAAO,QAUvE;AA0BD,wBAAgB,QAAQ,CAAC,GAAG,EAAE,UAAU,iBA4BvC"}
1
+ {"version":3,"file":"lazyload.d.ts","sourceRoot":"","sources":["lazyload.ts"],"names":[],"mappings":"AAKA,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC,CAAC;AAsBF,wBAAgB,QAAQ,SAgBvB;AAWD,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,cAAc,CAAC,EAAE,OAAO,QAUvE;AA4DD,wBAAgB,QAAQ,CAAC,GAAG,EAAE,UAAU,iBA4BvC"}
package/cjs/utils/lazyload.js CHANGED
@@ -66,6 +66,34 @@ function removeStack(id, removeListener) {
66
66
  }
67
67
  delete components[id];
68
68
  }
69
+
70
+ // 检测容器是否高度受限
71
+ var isRootHeightConstrained = function isRootHeightConstrained(root, targetElement) {
72
+ if (!root || root === document.body) {
73
+ var bodyRect = document.body.getBoundingClientRect();
74
+ var _targetRect = targetElement.getBoundingClientRect();
75
+ // body的底部和targetElement的顶部永远不可能有相交，则是受限的
76
+ if (bodyRect.bottom < _targetRect.top) {
77
+ return true;
78
+ } else {
79
+ return false;
80
+ }
81
+ }
82
+
83
+ // 当root的overflow是auto或hidden，则认为不是受限的
84
+ var rootStyle = window.getComputedStyle(root);
85
+ if (rootStyle.overflow === 'auto' || rootStyle.overflow === 'hidden') {
86
+ return false;
87
+ }
88
+
89
+ // 当root的底部与targetElement的顶部永远不可能有相交，则是受限的
90
+ var rootRect = root.getBoundingClientRect();
91
+ var targetRect = targetElement.getBoundingClientRect();
92
+ if (rootRect.top > targetRect.bottom || rootRect.bottom < targetRect.top) {
93
+ return true;
94
+ }
95
+ return false;
96
+ };
69
97
  function getObserver(obj, id) {
70
98
  var _obj$container = obj.container,
71
99
  container = _obj$container === void 0 ? null : _obj$container,
@@ -75,6 +103,10 @@ function getObserver(obj, id) {
75
103
  offscreen = obj.offscreen,
76
104
  noRemove = obj.noRemove;
77
105
  var fixedContainer = (0, _element.getClosestPositionedContainer)(element, ['fixed', 'absolute']);
106
+
107
+ // 获取最优的观察器配置
108
+ var candidateRoot = fixedContainer || container;
109
+ var observerRoot = isRootHeightConstrained(candidateRoot, element) ? null : candidateRoot;
78
110
  var observer = new IntersectionObserver(function (entries) {
79
111
  entries.forEach(function (en) {
80
112
  if (en.isIntersecting || en.intersectionRatio > 0) {
@@ -86,7 +118,7 @@ function getObserver(obj, id) {
86
118
  }
87
119
  });
88
120
  }, {
89
- root: fixedContainer || container,
121
+ root: observerRoot,
90
122
  rootMargin: "".concat(offset, "px")
91
123
  });
92
124
  obj.observer = observer;
package/esm/utils/lazyload.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"lazyload.d.ts","sourceRoot":"","sources":["lazyload.ts"],"names":[],"mappings":"AAKA,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC,CAAC;AAsBF,wBAAgB,QAAQ,SAgBvB;AAWD,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,cAAc,CAAC,EAAE,OAAO,QAUvE;AA0BD,wBAAgB,QAAQ,CAAC,GAAG,EAAE,UAAU,iBA4BvC"}
1
+ {"version":3,"file":"lazyload.d.ts","sourceRoot":"","sources":["lazyload.ts"],"names":[],"mappings":"AAKA,KAAK,UAAU,GAAG;IAChB,SAAS,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC;IAC3B,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,MAAM,IAAI,CAAC;IACnB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;IACvB,MAAM,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,oBAAoB,CAAC;CACjC,CAAC;AAsBF,wBAAgB,QAAQ,SAgBvB;AAWD,wBAAgB,WAAW,CAAC,EAAE,CAAC,EAAE,MAAM,GAAG,IAAI,EAAE,cAAc,CAAC,EAAE,OAAO,QAUvE;AA4DD,wBAAgB,QAAQ,CAAC,GAAG,EAAE,UAAU,iBA4BvC"}
package/esm/utils/lazyload.js CHANGED
@@ -58,6 +58,34 @@ export function removeStack(id, removeListener) {
58
58
  }
59
59
  delete components[id];
60
60
  }
61
+
62
+ // 检测容器是否高度受限
63
+ var isRootHeightConstrained = function isRootHeightConstrained(root, targetElement) {
64
+ if (!root || root === document.body) {
65
+ var bodyRect = document.body.getBoundingClientRect();
66
+ var _targetRect = targetElement.getBoundingClientRect();
67
+ // body的底部和targetElement的顶部永远不可能有相交，则是受限的
68
+ if (bodyRect.bottom < _targetRect.top) {
69
+ return true;
70
+ } else {
71
+ return false;
72
+ }
73
+ }
74
+
75
+ // 当root的overflow是auto或hidden，则认为不是受限的
76
+ var rootStyle = window.getComputedStyle(root);
77
+ if (rootStyle.overflow === 'auto' || rootStyle.overflow === 'hidden') {
78
+ return false;
79
+ }
80
+
81
+ // 当root的底部与targetElement的顶部永远不可能有相交，则是受限的
82
+ var rootRect = root.getBoundingClientRect();
83
+ var targetRect = targetElement.getBoundingClientRect();
84
+ if (rootRect.top > targetRect.bottom || rootRect.bottom < targetRect.top) {
85
+ return true;
86
+ }
87
+ return false;
88
+ };
61
89
  function getObserver(obj, id) {
62
90
  var _obj$container = obj.container,
63
91
  container = _obj$container === void 0 ? null : _obj$container,
@@ -67,6 +95,10 @@ function getObserver(obj, id) {
67
95
  offscreen = obj.offscreen,
68
96
  noRemove = obj.noRemove;
69
97
  var fixedContainer = getClosestPositionedContainer(element, ['fixed', 'absolute']);
98
+
99
+ // 获取最优的观察器配置
100
+ var candidateRoot = fixedContainer || container;
101
+ var observerRoot = isRootHeightConstrained(candidateRoot, element) ? null : candidateRoot;
70
102
  var observer = new IntersectionObserver(function (entries) {
71
103
  entries.forEach(function (en) {
72
104
  if (en.isIntersecting || en.intersectionRatio > 0) {
@@ -78,7 +110,7 @@ function getObserver(obj, id) {
78
110
  }
79
111
  });
80
112
  }, {
81
- root: fixedContainer || container,
113
+ root: observerRoot,
82
114
  rootMargin: "".concat(offset, "px")
83
115
  });
84
116
  obj.observer = observer;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/hooks",
3
- "version": "3.8.0-beta.23",
3
+ "version": "3.8.0-beta.25",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",