scroll.mjs 2.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. import { isClient } from '@vueuse/core';
  2. import { getStyle } from './style.mjs';
  3. const isScroll = (el, isVertical) => {
  4. if (!isClient)
  5. return false;
  6. const key = {
  7. undefined: "overflow",
  8. true: "overflow-y",
  9. false: "overflow-x"
  10. }[String(isVertical)];
  11. const overflow = getStyle(el, key);
  12. return ["scroll", "auto", "overlay"].some((s) => overflow.includes(s));
  13. };
  14. const getScrollContainer = (el, isVertical) => {
  15. if (!isClient)
  16. return;
  17. let parent = el;
  18. while (parent) {
  19. if ([window, document, document.documentElement].includes(parent))
  20. return window;
  21. if (isScroll(parent, isVertical))
  22. return parent;
  23. parent = parent.parentNode;
  24. }
  25. return parent;
  26. };
  27. let scrollBarWidth;
  28. const getScrollBarWidth = (namespace) => {
  29. var _a;
  30. if (!isClient)
  31. return 0;
  32. if (scrollBarWidth !== void 0)
  33. return scrollBarWidth;
  34. const outer = document.createElement("div");
  35. outer.className = `${namespace}-scrollbar__wrap`;
  36. outer.style.visibility = "hidden";
  37. outer.style.width = "100px";
  38. outer.style.position = "absolute";
  39. outer.style.top = "-9999px";
  40. document.body.appendChild(outer);
  41. const widthNoScroll = outer.offsetWidth;
  42. outer.style.overflow = "scroll";
  43. const inner = document.createElement("div");
  44. inner.style.width = "100%";
  45. outer.appendChild(inner);
  46. const widthWithScroll = inner.offsetWidth;
  47. (_a = outer.parentNode) == null ? void 0 : _a.removeChild(outer);
  48. scrollBarWidth = widthNoScroll - widthWithScroll;
  49. return scrollBarWidth;
  50. };
  51. function scrollIntoView(container, selected) {
  52. if (!isClient)
  53. return;
  54. if (!selected) {
  55. container.scrollTop = 0;
  56. return;
  57. }
  58. const offsetParents = [];
  59. let pointer = selected.offsetParent;
  60. while (pointer !== null && container !== pointer && container.contains(pointer)) {
  61. offsetParents.push(pointer);
  62. pointer = pointer.offsetParent;
  63. }
  64. const top = selected.offsetTop + offsetParents.reduce((prev, curr) => prev + curr.offsetTop, 0);
  65. const bottom = top + selected.offsetHeight;
  66. const viewRectTop = container.scrollTop;
  67. const viewRectBottom = viewRectTop + container.clientHeight;
  68. if (top < viewRectTop) {
  69. container.scrollTop = top;
  70. } else if (bottom > viewRectBottom) {
  71. container.scrollTop = bottom - container.clientHeight;
  72. }
  73. }
  74. export { getScrollBarWidth, getScrollContainer, isScroll, scrollIntoView };
  75. //# sourceMappingURL=scroll.mjs.map