@sheinx/hooks 3.9.14-beta.5 → 3.9.14-beta.7

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/components/use-table/use-table-layout.d.ts.map +1 -1
  2. package/cjs/components/use-table/use-table-layout.js +33 -1
  3. package/esm/components/use-table/use-table-layout.d.ts.map +1 -1
  4. package/esm/components/use-table/use-table-layout.js +33 -1
  5. package/package.json +1 -1
package/cjs/components/use-table/use-table-layout.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-table-layout.d.ts","sourceRoot":"","sources":["use-table-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAKlE,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AA0CrE,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,cAAc,CAAC,GAAG,CAAC,EACnB,MAAM,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,OAAO,CAC7E;IACD,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,UAAW,mBAAmB;;;;;;;;;;;yBA+CX,MAAM,UAAU,MAAM;;;;;;;CAwP5D,CAAC;AAEF,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"use-table-layout.d.ts","sourceRoot":"","sources":["use-table-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAKlE,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AA0CrE,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,cAAc,CAAC,GAAG,CAAC,EACnB,MAAM,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,OAAO,CAC7E;IACD,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,UAAW,mBAAmB;;;;;;;;;;;yBA+CX,MAAM,UAAU,MAAM;;;;;;;CA2R5D,CAAC;AAEF,eAAe,cAAc,CAAC"}
package/cjs/components/use-table/use-table-layout.js CHANGED
@@ -181,8 +181,14 @@ var useTableLayout = function useTableLayout(props) {
181
181
  return v === 0;
182
182
  })) return;
183
183
  var shifted = shiftDecimalToLastColumn(cols);
184
+ // 当 colgroup 中存在 undefined（说明从未被成功测量过），跳过相等判断，强制触发重新测量
185
+ // 场景：Table 在 display:none 容器中挂载时 getColgroup 测量失败，
186
+ // 后续 resetColGroup 产出值与初始值相同会被跳过，导致未设 width 的列永远无法获得实际宽度
187
+ var hasUndefined = shifted.some(function (v) {
188
+ return v === undefined;
189
+ });
184
190
  // 值未变化时跳过，避免触发不必要的 useLayoutEffect
185
- if (colgroup && shifted.length === colgroup.length && shifted.every(function (v, i) {
191
+ if (!hasUndefined && colgroup && shifted.length === colgroup.length && shifted.every(function (v, i) {
186
192
  return v === colgroup[i];
187
193
  })) {
188
194
  return;
@@ -369,6 +375,32 @@ var useTableLayout = function useTableLayout(props) {
369
375
  (_cancelFunc = cancelFunc) === null || _cancelFunc === void 0 || _cancelFunc();
370
376
  };
371
377
  }, [scrollRef.current]);
378
+
379
+ // 当祖先元素的 CSS 动画结束时（如 Modal 入场动画），重新测量列宽
380
+ // 解决 Table 在动画容器（如 Modal）中渲染时，动画期间测量的列宽不准确导致 sticky 表头与表体列宽错位的问题
381
+ (0, _react.useEffect)(function () {
382
+ var scrollEl = scrollRef.current;
383
+ if (!scrollEl) return;
384
+
385
+ // 查找最近的 fixed 定位祖先（如 Modal wrapper），仅在该元素上监听动画结束
386
+ var fixedAncestor = null;
387
+ var parent = scrollEl.parentElement;
388
+ while (parent) {
389
+ if (window.getComputedStyle(parent).position === 'fixed') {
390
+ fixedAncestor = parent;
391
+ break;
392
+ }
393
+ parent = parent.parentElement;
394
+ }
395
+ if (!fixedAncestor) return;
396
+ var handleAnimationEnd = function handleAnimationEnd() {
397
+ getColgroup(false);
398
+ };
399
+ fixedAncestor.addEventListener('animationend', handleAnimationEnd);
400
+ return function () {
401
+ fixedAncestor.removeEventListener('animationend', handleAnimationEnd);
402
+ };
403
+ }, [scrollRef.current]);
372
404
  (0, _react.useLayoutEffect)(function () {
373
405
  if (adjust) {
374
406
  getColgroup(adjust === 'drag');
package/esm/components/use-table/use-table-layout.d.ts.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"use-table-layout.d.ts","sourceRoot":"","sources":["use-table-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAKlE,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AA0CrE,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,cAAc,CAAC,GAAG,CAAC,EACnB,MAAM,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,OAAO,CAC7E;IACD,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,UAAW,mBAAmB;;;;;;;;;;;yBA+CX,MAAM,UAAU,MAAM;;;;;;;CAwP5D,CAAC;AAEF,eAAe,cAAc,CAAC"}
1
+ {"version":3,"file":"use-table-layout.d.ts","sourceRoot":"","sources":["use-table-layout.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA6C,MAAM,OAAO,CAAC;AAKlE,OAAO,EAAE,iBAAiB,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AA0CrE,MAAM,WAAW,mBACf,SAAQ,IAAI,CACV,cAAc,CAAC,GAAG,CAAC,EACnB,MAAM,GAAG,kBAAkB,GAAG,iBAAiB,GAAG,gBAAgB,GAAG,OAAO,CAC7E;IACD,OAAO,EAAE,iBAAiB,CAAC,GAAG,CAAC,EAAE,CAAC;IAClC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACvC,SAAS,EAAE,KAAK,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;IACxC,KAAK,CAAC,EAAE,OAAO,CAAC;IAChB,SAAS,CAAC,EAAE,OAAO,CAAC;CACrB;AAED,QAAA,MAAM,cAAc,UAAW,mBAAmB;;;;;;;;;;;yBA+CX,MAAM,UAAU,MAAM;;;;;;;CA2R5D,CAAC;AAEF,eAAe,cAAc,CAAC"}
package/esm/components/use-table/use-table-layout.js CHANGED
@@ -172,8 +172,14 @@ var useTableLayout = function useTableLayout(props) {
172
172
  return v === 0;
173
173
  })) return;
174
174
  var shifted = shiftDecimalToLastColumn(cols);
175
+ // 当 colgroup 中存在 undefined（说明从未被成功测量过），跳过相等判断，强制触发重新测量
176
+ // 场景：Table 在 display:none 容器中挂载时 getColgroup 测量失败，
177
+ // 后续 resetColGroup 产出值与初始值相同会被跳过，导致未设 width 的列永远无法获得实际宽度
178
+ var hasUndefined = shifted.some(function (v) {
179
+ return v === undefined;
180
+ });
175
181
  // 值未变化时跳过，避免触发不必要的 useLayoutEffect
176
- if (colgroup && shifted.length === colgroup.length && shifted.every(function (v, i) {
182
+ if (!hasUndefined && colgroup && shifted.length === colgroup.length && shifted.every(function (v, i) {
177
183
  return v === colgroup[i];
178
184
  })) {
179
185
  return;
@@ -360,6 +366,32 @@ var useTableLayout = function useTableLayout(props) {
360
366
  (_cancelFunc = cancelFunc) === null || _cancelFunc === void 0 || _cancelFunc();
361
367
  };
362
368
  }, [scrollRef.current]);
369
+
370
+ // 当祖先元素的 CSS 动画结束时（如 Modal 入场动画），重新测量列宽
371
+ // 解决 Table 在动画容器（如 Modal）中渲染时，动画期间测量的列宽不准确导致 sticky 表头与表体列宽错位的问题
372
+ useEffect(function () {
373
+ var scrollEl = scrollRef.current;
374
+ if (!scrollEl) return;
375
+
376
+ // 查找最近的 fixed 定位祖先（如 Modal wrapper），仅在该元素上监听动画结束
377
+ var fixedAncestor = null;
378
+ var parent = scrollEl.parentElement;
379
+ while (parent) {
380
+ if (window.getComputedStyle(parent).position === 'fixed') {
381
+ fixedAncestor = parent;
382
+ break;
383
+ }
384
+ parent = parent.parentElement;
385
+ }
386
+ if (!fixedAncestor) return;
387
+ var handleAnimationEnd = function handleAnimationEnd() {
388
+ getColgroup(false);
389
+ };
390
+ fixedAncestor.addEventListener('animationend', handleAnimationEnd);
391
+ return function () {
392
+ fixedAncestor.removeEventListener('animationend', handleAnimationEnd);
393
+ };
394
+ }, [scrollRef.current]);
363
395
  useLayoutEffect(function () {
364
396
  if (adjust) {
365
397
  getColgroup(adjust === 'drag');
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@sheinx/hooks",
3
- "version": "3.9.14-beta.5",
3
+ "version": "3.9.14-beta.7",
4
4
  "description": "",
5
5
  "keywords": [],
6
6
  "license": "MIT",