@sheinx/base 3.8.0-beta.13 → 3.8.0-beta.15

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/cjs/sticky/sticky.d.ts.map +1 -1
  2. package/cjs/sticky/sticky.js +103 -20
  3. package/cjs/sticky/sticky.type.d.ts +6 -0
  4. package/cjs/sticky/sticky.type.d.ts.map +1 -1
  5. package/esm/sticky/sticky.d.ts.map +1 -1
  6. package/esm/sticky/sticky.js +103 -20
  7. package/esm/sticky/sticky.type.d.ts +6 -0
  8. package/esm/sticky/sticky.type.d.ts.map +1 -1
  9. package/package.json +2 -2
package/cjs/sticky/sticky.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,aAAa,MAAM,CAAC;AAmBjC,QAAA,MAAM,MAAM,UAAW,WAAW,4CAqYjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,aAAa,MAAM,CAAC;AAajC,QAAA,MAAM,MAAM,UAAW,WAAW,4CAwejC,CAAC;AAEF,eAAe,MAAM,CAAC"}
package/cjs/sticky/sticky.js CHANGED
@@ -27,23 +27,16 @@ var cssSupport = _hooks.util.cssSupport,
27
27
  var supportSticky = cssSupport('position', 'sticky');
28
28
  var defaultZIndex = exports.defaultZIndex = 900;
29
29
  var events = ['scroll', 'pageshow', 'load', 'resize'];
30
-
31
- // const getFirstScrollParent = (el: HTMLElement) => {
32
- // let parent = el.parentNode as HTMLElement;
33
- // while (parent) {
34
- // if (parent === document.body || parent === document.documentElement) {
35
- // parent = document.body;
36
- // break;
37
- // }
38
- // const { overflowY } = window.getComputedStyle(parent);
39
- // if (overflowY === 'scroll' || overflowY === 'auto') {
40
- // break;
41
- // }
42
- // parent = parent.parentNode as HTMLElement;
43
- // }
44
- // return parent;
45
- // };
46
-
30
+ function getStaticTop(el) {
31
+ var stopper = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
32
+ var top = 0;
33
+ var currentEl = el;
34
+ while (currentEl && currentEl !== stopper) {
35
+ top += currentEl.offsetTop;
36
+ currentEl = currentEl.offsetParent;
37
+ }
38
+ return top;
39
+ }
47
40
  var Sticky = function Sticky(props) {
48
41
  if (props.target) {
49
42
  devUseWarning.deprecated('target', 'scrollContainer', 'Sticky');
@@ -54,13 +47,16 @@ var Sticky = function Sticky(props) {
54
47
  // 是否使用css sticky
55
48
  var css = (props.css || props.target) && supportSticky;
56
49
  var forceUpdate = (0, _hooks.useRender)();
50
+ var fixedStickyElRef = (0, _react.useRef)(null);
57
51
  var _useRef = (0, _react.useRef)({
58
52
  target: null,
59
53
  div: null,
60
54
  position: '',
61
55
  targetObserver: null,
62
56
  parentObserver: null,
63
- fixedObserver: null
57
+ fixedObserver: null,
58
+ stoped: false,
59
+ originPosition: null
64
60
  }),
65
61
  context = _useRef.current;
66
62
  var _useState = (0, _react.useState)({}),
@@ -76,6 +72,77 @@ var Sticky = function Sticky(props) {
76
72
  parentVisible = _useState6[0],
77
73
  setParentVisible = _useState6[1];
78
74
  var elementRef = (0, _react.useRef)(null);
75
+ var onStickyBoundaryChange = (0, _hooks.usePersistFn)(function (e) {
76
+ var target = e.target;
77
+ var isDocument = !context.target || context.target === document.documentElement;
78
+ var scrollTop = isDocument ? window.scrollY : target.scrollTop;
79
+ if (!target || typeof scrollTop !== 'number') return;
80
+ var stopStickyPoint = -1;
81
+ var baseTop = 0;
82
+ var absoluteTop = 0;
83
+ var absoluteLeft = 0;
84
+ var stopStickyElement = null;
85
+ if (typeof props.stickyBoundary === 'number') {
86
+ stopStickyPoint = props.stickyBoundary;
87
+ } else if (typeof props.stickyBoundary === 'function') {
88
+ stopStickyElement = props.stickyBoundary();
89
+ if (!stopStickyElement) return;
90
+ var stopStickyRect = stopStickyElement.getBoundingClientRect();
91
+ var targetRect = elementRef.current.getBoundingClientRect();
92
+ if (context.target === document.documentElement || !context.target) {
93
+ baseTop = getStaticTop(elementRef.current) - (props.top || 0);
94
+ absoluteTop = stopStickyRect.bottom - targetRect.bottom;
95
+ absoluteLeft = stopStickyRect.left - targetRect.left;
96
+ }
97
+ stopStickyPoint = stopStickyRect.bottom - targetRect.bottom + baseTop;
98
+ }
99
+ if (stopStickyPoint < 0) return;
100
+ if (scrollTop > stopStickyPoint) {
101
+ if (context.stoped) return;
102
+ context.stoped = true;
103
+
104
+ // 把 div 移动到 target 内部，使用 absolute 定位跟随滚动
105
+ if (context.div && context.target) {
106
+ context.target.insertBefore(context.div, context.target.firstChild);
107
+ var paddingLeft = Number(window.getComputedStyle(context.target).paddingLeft.replace('px', '')) || 0;
108
+ var borderLeftWidth = Number(window.getComputedStyle(context.target).borderLeftWidth.replace('px', '')) || 0;
109
+ var left = paddingLeft + borderLeftWidth;
110
+ context.div.style.transform = "translate(-".concat(left, "px, ").concat(stopStickyPoint, "px)");
111
+ } else {
112
+ if (stopStickyElement) {
113
+ if (!fixedStickyElRef.current) return;
114
+ // 存储原始位置到 context 中
115
+ if (!context.originPosition) {
116
+ var originStyle = window.getComputedStyle(fixedStickyElRef.current);
117
+ context.originPosition = {
118
+ top: originStyle.top,
119
+ left: originStyle.left
120
+ };
121
+ }
122
+
123
+ // 直接操作DOM的原因是：不闪烁且性能更好
124
+ stopStickyElement.style.transform = "translateZ(0)";
125
+ fixedStickyElRef.current.style.top = "".concat(absoluteTop, "px");
126
+ fixedStickyElRef.current.style.left = "".concat(absoluteLeft, "px");
127
+ }
128
+ // 暂不支持 props.stickyBoundary 为 number 的fixed定位情况
129
+ }
130
+ } else {
131
+ if (!context.stoped) return;
132
+ context.stoped = false;
133
+
134
+ // 恢复正常吸附模式：把 div 移动到 target 外部
135
+ if (context.div && context.target && context.target.parentNode) {
136
+ context.target.parentNode.insertBefore(context.div, context.target);
137
+ context.div.style.transform = 'none';
138
+ } else if (stopStickyElement && fixedStickyElRef.current && context.originPosition) {
139
+ stopStickyElement.style.transform = "none";
140
+ fixedStickyElRef.current.style.top = context.originPosition.top;
141
+ fixedStickyElRef.current.style.left = context.originPosition.left;
142
+ context.originPosition = null; // 清理状态
143
+ }
144
+ }
145
+ });
79
146
  var getTarget = function getTarget() {
80
147
  var scrollContainer = props.scrollContainer;
81
148
  if (typeof scrollContainer === 'string') {
@@ -317,6 +384,10 @@ var Sticky = function Sticky(props) {
317
384
  context.div.remove();
318
385
  context.div = null;
319
386
  }
387
+ if (props.stickyBoundary) {
388
+ var _context$target;
389
+ (_context$target = context.target) === null || _context$target === void 0 || _context$target.removeEventListener('scroll', onStickyBoundaryChange);
390
+ }
320
391
  };
321
392
  var createFixedEvents = function createFixedEvents() {
322
393
  createFixedObserver();
@@ -329,6 +400,10 @@ var Sticky = function Sticky(props) {
329
400
  events.forEach(function (event) {
330
401
  window.removeEventListener(event, handleFixedPosition);
331
402
  });
403
+ if (props.stickyBoundary) {
404
+ var _context$target2;
405
+ (_context$target2 = context.target) === null || _context$target2 === void 0 || _context$target2.removeEventListener('scroll', onStickyBoundaryChange);
406
+ }
332
407
  };
333
408
  var handleElementRef = function handleElementRef(el) {
334
409
  if (el) {
@@ -356,7 +431,15 @@ var Sticky = function Sticky(props) {
356
431
  context.target = target;
357
432
  forceUpdate();
358
433
  }
359
- if (context.target) {
434
+ if (props.stickyBoundary) {
435
+ if (!context.target || context.target === document.documentElement) {
436
+ window.addEventListener('scroll', onStickyBoundaryChange);
437
+ } else {
438
+ var _context$target3;
439
+ (_context$target3 = context.target) === null || _context$target3 === void 0 || _context$target3.addEventListener('scroll', onStickyBoundaryChange);
440
+ }
441
+ }
442
+ if (context.target && context.target !== document.documentElement) {
360
443
  createTargetEvents();
361
444
  return cancelTargetEvents;
362
445
  } else {
@@ -377,7 +460,6 @@ var Sticky = function Sticky(props) {
377
460
  if (props.onChange) {
378
461
  props.onChange(show);
379
462
  }
380
- ;
381
463
  }, [show]);
382
464
 
383
465
  // 纯css方法 直接使用css
@@ -402,6 +484,7 @@ var Sticky = function Sticky(props) {
402
484
  style: _objectSpread(_objectSpread({
403
485
  zIndex: defaultZIndex
404
486
  }, style), elementSize),
487
+ ref: fixedStickyElRef,
405
488
  children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
406
489
  className: props.className,
407
490
  style: props.style,
package/cjs/sticky/sticky.type.d.ts CHANGED
@@ -27,6 +27,12 @@ export interface StickyProps extends Pick<CommonType, 'className' | 'style'> {
27
27
  * @cn 自定义附着的目标。可以传入 HTMLElement 或者 css selector，target 必须为 Sticky 组件的祖先节点
28
28
  */
29
29
  scrollContainer?: string | HTMLElement | Element | null;
30
+ /**
31
+ * @en Stop sticky at bottom of scrollContainer or when the sticky element scrolls to the specified position or the bottom of the specified element
32
+ * @cn sticky元素滚动到指定位置或与指定元素底部重合时，取消sticky
33
+ * @version 3.8.0
34
+ */
35
+ stickyBoundary?: number | (() => HTMLElement | null);
30
36
  /**
31
37
  * @cn sticky 父级元素, 当父元素离开视窗时，sticky 将失效
32
38
  * @en sticky parent, when the parent element leaves the viewport, the sticky will be invalid
package/cjs/sticky/sticky.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.type.d.ts","sourceRoot":"","sources":["sticky.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IAC1E,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IAEF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,CAAC;IAExD;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B"}
1
+ {"version":3,"file":"sticky.type.d.ts","sourceRoot":"","sources":["sticky.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IAC1E,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IAEF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,CAAC;IAExD;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC;IAErD;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B"}
package/esm/sticky/sticky.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,aAAa,MAAM,CAAC;AAmBjC,QAAA,MAAM,MAAM,UAAW,WAAW,4CAqYjC,CAAC;AAEF,eAAe,MAAM,CAAC"}
1
+ {"version":3,"file":"sticky.d.ts","sourceRoot":"","sources":["sticky.tsx"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAI5C,eAAO,MAAM,aAAa,MAAM,CAAC;AAajC,QAAA,MAAM,MAAM,UAAW,WAAW,4CAwejC,CAAC;AAEF,eAAe,MAAM,CAAC"}
package/esm/sticky/sticky.js CHANGED
@@ -21,23 +21,16 @@ var cssSupport = util.cssSupport,
21
21
  var supportSticky = cssSupport('position', 'sticky');
22
22
  export var defaultZIndex = 900;
23
23
  var events = ['scroll', 'pageshow', 'load', 'resize'];
24
-
25
- // const getFirstScrollParent = (el: HTMLElement) => {
26
- // let parent = el.parentNode as HTMLElement;
27
- // while (parent) {
28
- // if (parent === document.body || parent === document.documentElement) {
29
- // parent = document.body;
30
- // break;
31
- // }
32
- // const { overflowY } = window.getComputedStyle(parent);
33
- // if (overflowY === 'scroll' || overflowY === 'auto') {
34
- // break;
35
- // }
36
- // parent = parent.parentNode as HTMLElement;
37
- // }
38
- // return parent;
39
- // };
40
-
24
+ function getStaticTop(el) {
25
+ var stopper = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : document.body;
26
+ var top = 0;
27
+ var currentEl = el;
28
+ while (currentEl && currentEl !== stopper) {
29
+ top += currentEl.offsetTop;
30
+ currentEl = currentEl.offsetParent;
31
+ }
32
+ return top;
33
+ }
41
34
  var Sticky = function Sticky(props) {
42
35
  if (props.target) {
43
36
  devUseWarning.deprecated('target', 'scrollContainer', 'Sticky');
@@ -48,13 +41,16 @@ var Sticky = function Sticky(props) {
48
41
  // 是否使用css sticky
49
42
  var css = (props.css || props.target) && supportSticky;
50
43
  var forceUpdate = useRender();
44
+ var fixedStickyElRef = useRef(null);
51
45
  var _useRef = useRef({
52
46
  target: null,
53
47
  div: null,
54
48
  position: '',
55
49
  targetObserver: null,
56
50
  parentObserver: null,
57
- fixedObserver: null
51
+ fixedObserver: null,
52
+ stoped: false,
53
+ originPosition: null
58
54
  }),
59
55
  context = _useRef.current;
60
56
  var _useState = useState({}),
@@ -70,6 +66,77 @@ var Sticky = function Sticky(props) {
70
66
  parentVisible = _useState6[0],
71
67
  setParentVisible = _useState6[1];
72
68
  var elementRef = useRef(null);
69
+ var onStickyBoundaryChange = usePersistFn(function (e) {
70
+ var target = e.target;
71
+ var isDocument = !context.target || context.target === document.documentElement;
72
+ var scrollTop = isDocument ? window.scrollY : target.scrollTop;
73
+ if (!target || typeof scrollTop !== 'number') return;
74
+ var stopStickyPoint = -1;
75
+ var baseTop = 0;
76
+ var absoluteTop = 0;
77
+ var absoluteLeft = 0;
78
+ var stopStickyElement = null;
79
+ if (typeof props.stickyBoundary === 'number') {
80
+ stopStickyPoint = props.stickyBoundary;
81
+ } else if (typeof props.stickyBoundary === 'function') {
82
+ stopStickyElement = props.stickyBoundary();
83
+ if (!stopStickyElement) return;
84
+ var stopStickyRect = stopStickyElement.getBoundingClientRect();
85
+ var targetRect = elementRef.current.getBoundingClientRect();
86
+ if (context.target === document.documentElement || !context.target) {
87
+ baseTop = getStaticTop(elementRef.current) - (props.top || 0);
88
+ absoluteTop = stopStickyRect.bottom - targetRect.bottom;
89
+ absoluteLeft = stopStickyRect.left - targetRect.left;
90
+ }
91
+ stopStickyPoint = stopStickyRect.bottom - targetRect.bottom + baseTop;
92
+ }
93
+ if (stopStickyPoint < 0) return;
94
+ if (scrollTop > stopStickyPoint) {
95
+ if (context.stoped) return;
96
+ context.stoped = true;
97
+
98
+ // 把 div 移动到 target 内部，使用 absolute 定位跟随滚动
99
+ if (context.div && context.target) {
100
+ context.target.insertBefore(context.div, context.target.firstChild);
101
+ var paddingLeft = Number(window.getComputedStyle(context.target).paddingLeft.replace('px', '')) || 0;
102
+ var borderLeftWidth = Number(window.getComputedStyle(context.target).borderLeftWidth.replace('px', '')) || 0;
103
+ var left = paddingLeft + borderLeftWidth;
104
+ context.div.style.transform = "translate(-".concat(left, "px, ").concat(stopStickyPoint, "px)");
105
+ } else {
106
+ if (stopStickyElement) {
107
+ if (!fixedStickyElRef.current) return;
108
+ // 存储原始位置到 context 中
109
+ if (!context.originPosition) {
110
+ var originStyle = window.getComputedStyle(fixedStickyElRef.current);
111
+ context.originPosition = {
112
+ top: originStyle.top,
113
+ left: originStyle.left
114
+ };
115
+ }
116
+
117
+ // 直接操作DOM的原因是：不闪烁且性能更好
118
+ stopStickyElement.style.transform = "translateZ(0)";
119
+ fixedStickyElRef.current.style.top = "".concat(absoluteTop, "px");
120
+ fixedStickyElRef.current.style.left = "".concat(absoluteLeft, "px");
121
+ }
122
+ // 暂不支持 props.stickyBoundary 为 number 的fixed定位情况
123
+ }
124
+ } else {
125
+ if (!context.stoped) return;
126
+ context.stoped = false;
127
+
128
+ // 恢复正常吸附模式：把 div 移动到 target 外部
129
+ if (context.div && context.target && context.target.parentNode) {
130
+ context.target.parentNode.insertBefore(context.div, context.target);
131
+ context.div.style.transform = 'none';
132
+ } else if (stopStickyElement && fixedStickyElRef.current && context.originPosition) {
133
+ stopStickyElement.style.transform = "none";
134
+ fixedStickyElRef.current.style.top = context.originPosition.top;
135
+ fixedStickyElRef.current.style.left = context.originPosition.left;
136
+ context.originPosition = null; // 清理状态
137
+ }
138
+ }
139
+ });
73
140
  var getTarget = function getTarget() {
74
141
  var scrollContainer = props.scrollContainer;
75
142
  if (typeof scrollContainer === 'string') {
@@ -311,6 +378,10 @@ var Sticky = function Sticky(props) {
311
378
  context.div.remove();
312
379
  context.div = null;
313
380
  }
381
+ if (props.stickyBoundary) {
382
+ var _context$target;
383
+ (_context$target = context.target) === null || _context$target === void 0 || _context$target.removeEventListener('scroll', onStickyBoundaryChange);
384
+ }
314
385
  };
315
386
  var createFixedEvents = function createFixedEvents() {
316
387
  createFixedObserver();
@@ -323,6 +394,10 @@ var Sticky = function Sticky(props) {
323
394
  events.forEach(function (event) {
324
395
  window.removeEventListener(event, handleFixedPosition);
325
396
  });
397
+ if (props.stickyBoundary) {
398
+ var _context$target2;
399
+ (_context$target2 = context.target) === null || _context$target2 === void 0 || _context$target2.removeEventListener('scroll', onStickyBoundaryChange);
400
+ }
326
401
  };
327
402
  var handleElementRef = function handleElementRef(el) {
328
403
  if (el) {
@@ -350,7 +425,15 @@ var Sticky = function Sticky(props) {
350
425
  context.target = target;
351
426
  forceUpdate();
352
427
  }
353
- if (context.target) {
428
+ if (props.stickyBoundary) {
429
+ if (!context.target || context.target === document.documentElement) {
430
+ window.addEventListener('scroll', onStickyBoundaryChange);
431
+ } else {
432
+ var _context$target3;
433
+ (_context$target3 = context.target) === null || _context$target3 === void 0 || _context$target3.addEventListener('scroll', onStickyBoundaryChange);
434
+ }
435
+ }
436
+ if (context.target && context.target !== document.documentElement) {
354
437
  createTargetEvents();
355
438
  return cancelTargetEvents;
356
439
  } else {
@@ -371,7 +454,6 @@ var Sticky = function Sticky(props) {
371
454
  if (props.onChange) {
372
455
  props.onChange(show);
373
456
  }
374
- ;
375
457
  }, [show]);
376
458
 
377
459
  // 纯css方法 直接使用css
@@ -396,6 +478,7 @@ var Sticky = function Sticky(props) {
396
478
  style: _objectSpread(_objectSpread({
397
479
  zIndex: defaultZIndex
398
480
  }, style), elementSize),
481
+ ref: fixedStickyElRef,
399
482
  children: /*#__PURE__*/_jsx("div", {
400
483
  className: props.className,
401
484
  style: props.style,
package/esm/sticky/sticky.type.d.ts CHANGED
@@ -27,6 +27,12 @@ export interface StickyProps extends Pick<CommonType, 'className' | 'style'> {
27
27
  * @cn 自定义附着的目标。可以传入 HTMLElement 或者 css selector，target 必须为 Sticky 组件的祖先节点
28
28
  */
29
29
  scrollContainer?: string | HTMLElement | Element | null;
30
+ /**
31
+ * @en Stop sticky at bottom of scrollContainer or when the sticky element scrolls to the specified position or the bottom of the specified element
32
+ * @cn sticky元素滚动到指定位置或与指定元素底部重合时，取消sticky
33
+ * @version 3.8.0
34
+ */
35
+ stickyBoundary?: number | (() => HTMLElement | null);
30
36
  /**
31
37
  * @cn sticky 父级元素, 当父元素离开视窗时，sticky 将失效
32
38
  * @en sticky parent, when the parent element leaves the viewport, the sticky will be invalid
package/esm/sticky/sticky.type.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"sticky.type.d.ts","sourceRoot":"","sources":["sticky.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IAC1E,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IAEF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,CAAC;IAExD;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B"}
1
+ {"version":3,"file":"sticky.type.d.ts","sourceRoot":"","sources":["sticky.type.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAE5C,MAAM,WAAW,aAAa;IAC5B,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,MAAM,WAAW,WAAY,SAAQ,IAAI,CAAC,UAAU,EAAE,WAAW,GAAG,OAAO,CAAC;IAC1E,QAAQ,CAAC,EAAE;QACT,MAAM,EAAE,MAAM,aAAa,CAAC;KAC7B,CAAC;IAEF;;;OAGG;IACH,KAAK,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;IAC5B;;;OAGG;IACH,MAAM,CAAC,EAAE,MAAM,CAAC;IAEhB;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,IAAI,CAAC;IAEjC;;;OAGG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,WAAW,GAAG,OAAO,GAAG,IAAI,CAAC;IAExD;;;;OAIG;IACH,cAAc,CAAC,EAAE,MAAM,GAAG,CAAC,MAAM,WAAW,GAAG,IAAI,CAAC,CAAC;IAErD;;;OAGG;IACH,MAAM,CAAC,EAAE,WAAW,GAAG,IAAI,CAAC;IAC5B;;;OAGG;IACH,GAAG,CAAC,EAAE,MAAM,CAAC;IAEb;;;;OAIG;IACH,GAAG,CAAC,EAAE,OAAO,CAAC;IACd;;;OAGG;IACH,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IAEvC;;;OAGG;IACH,QAAQ,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;CAC5B"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/base",
3
- "version": "3.8.0-beta.13",
3
+ "version": "3.8.0-beta.15",
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.8.0-beta.13",
13
+ "@sheinx/hooks": "3.8.0-beta.15",
14
14
  "immer": "^10.0.0",
15
15
  "classnames": "^2.0.0",
16
16
  "@shined/reactive": "^0.1.3-alpha.0"