@ehfuse/mui-virtual-data-table 1.0.6 → 1.0.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.
- package/dist/index.esm.js +12 -3
- package/dist/index.esm.js.map +1 -1
- package/dist/index.js +12 -3
- package/dist/index.js.map +1 -1
- package/package.json +2 -2
package/dist/index.esm.js
CHANGED
|
@@ -442,6 +442,7 @@ showScrollbar = true, }, ref) => {
|
|
|
442
442
|
autoHide,
|
|
443
443
|
};
|
|
444
444
|
});
|
|
445
|
+
const wrapperRef = useRef(null);
|
|
445
446
|
const containerRef = useRef(null);
|
|
446
447
|
const contentRef = useRef(null);
|
|
447
448
|
const scrollbarRef = useRef(null);
|
|
@@ -671,12 +672,20 @@ showScrollbar = true, }, ref) => {
|
|
|
671
672
|
const containerHeight = scrollableElement.clientHeight;
|
|
672
673
|
const contentHeight = scrollableElement.scrollHeight;
|
|
673
674
|
const scrollTop = scrollableElement.scrollTop;
|
|
675
|
+
// wrapper의 패딩 계산 (상하 패딩만 필요)
|
|
676
|
+
let wrapperPaddingTopBottom = 0;
|
|
677
|
+
if (wrapperRef.current) {
|
|
678
|
+
const computedStyle = window.getComputedStyle(wrapperRef.current);
|
|
679
|
+
const paddingTop = parseFloat(computedStyle.paddingTop) || 0;
|
|
680
|
+
const paddingBottom = parseFloat(computedStyle.paddingBottom) || 0;
|
|
681
|
+
wrapperPaddingTopBottom = paddingTop + paddingBottom;
|
|
682
|
+
}
|
|
674
683
|
// 화살표와 간격 공간 계산 (화살표 + 위아래 마진, 화살표 없어도 위아래 마진)
|
|
675
684
|
const arrowSpace = showArrows
|
|
676
685
|
? finalThumbWidth * 2 + finalTrackConfig.margin * 4
|
|
677
686
|
: finalTrackConfig.margin * 2;
|
|
678
|
-
// 썸 높이 계산 (사용자 설정 최소 높이 사용, 화살표 공간
|
|
679
|
-
const availableHeight = containerHeight - arrowSpace;
|
|
687
|
+
// 썸 높이 계산 (사용자 설정 최소 높이 사용, 화살표 공간 제외, wrapper 패딩 추가)
|
|
688
|
+
const availableHeight = containerHeight - arrowSpace + wrapperPaddingTopBottom;
|
|
680
689
|
const scrollRatio = containerHeight / contentHeight;
|
|
681
690
|
const calculatedThumbHeight = Math.max(availableHeight * scrollRatio, thumbMinHeight);
|
|
682
691
|
// 썸 위치 계산 (화살표와 간격 공간 제외)
|
|
@@ -1169,7 +1178,7 @@ showScrollbar = true, }, ref) => {
|
|
|
1169
1178
|
}
|
|
1170
1179
|
};
|
|
1171
1180
|
}, []);
|
|
1172
|
-
return (jsxs("div", { className: `overlay-scrollbar-wrapper ${className}`, style: Object.assign({ display: "flex", flexDirection: "column", position: "relative", minHeight: 0, height: "100%", flex: "1 1 0%" }, style), children: [jsx("div", { ref: containerRef, className: "overlay-scrollbar-container", tabIndex: -1, onMouseDown: handleDragScrollStart, style: Object.assign({ display: "flex", width: "100%", flex: "1 1 auto", minHeight: 0, overflow: "auto",
|
|
1181
|
+
return (jsxs("div", { ref: wrapperRef, className: `overlay-scrollbar-wrapper ${className}`, style: Object.assign({ display: "flex", flexDirection: "column", position: "relative", minHeight: 0, height: "100%", flex: "1 1 0%" }, style), children: [jsx("div", { ref: containerRef, className: "overlay-scrollbar-container", tabIndex: -1, onMouseDown: handleDragScrollStart, style: Object.assign({ display: "flex", width: "100%", flex: "1 1 auto", minHeight: 0, overflow: "auto",
|
|
1173
1182
|
// 브라우저 기본 스크롤바만 숨기기
|
|
1174
1183
|
scrollbarWidth: "none", msOverflowStyle: "none",
|
|
1175
1184
|
// 키보드 포커스 스타일 (접근성)
|