scroll.js 2.5 KB

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