@tapcart/mobile-components 0.7.80 → 0.7.81

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.
@@ -1 +1 @@
1
- {"version":3,"file":"use-scroll-direction.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-scroll-direction.ts"],"names":[],"mappings":"AAGA,KAAK,eAAe,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;AAE3C,UAAU,UAAU;IAClB,SAAS,EAAE,eAAe,CAAA;IAC1B,OAAO,EAAE,MAAM,CAAA;CAChB;AAED,iBAAS,kBAAkB,CAAC,SAAS,GAAE,MAAY,GAAG,UAAU,CAqD/D;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAA"}
1
+ {"version":3,"file":"use-scroll-direction.d.ts","sourceRoot":"","sources":["../../../components/hooks/use-scroll-direction.ts"],"names":[],"mappings":"AAGA,KAAK,eAAe,GAAG,IAAI,GAAG,MAAM,GAAG,IAAI,CAAA;AAE3C,UAAU,UAAU;IAClB,SAAS,EAAE,eAAe,CAAA;IAC1B,OAAO,EAAE,MAAM,CAAA;CAChB;AAED,iBAAS,kBAAkB,CAAC,SAAS,GAAE,MAAY,GAAG,UAAU,CAoE/D;AAED,OAAO,EAAE,kBAAkB,EAAE,CAAA"}
@@ -6,19 +6,23 @@ function useScrollDirection(threshold = 100) {
6
6
  scrollY: 0,
7
7
  });
8
8
  const [isPending, startTransition] = useTransition();
9
+ const scrollElement = useRef(null);
10
+ const hasScrollListener = useRef(false);
9
11
  const lastScrollY = useRef(0);
10
12
  const isBouncing = useRef(false);
11
13
  useEffect(() => {
14
+ var _a;
12
15
  if (typeof window === "undefined") {
13
16
  return;
14
17
  }
15
18
  const updateScrollDirection = () => {
19
+ var _a, _b, _c;
16
20
  if (document.body.hasAttribute("data-scroll-locked")) {
17
21
  return;
18
22
  }
19
- const scrollY = window.scrollY;
20
- const scrollHeight = document.documentElement.scrollHeight;
21
- const clientHeight = document.documentElement.clientHeight;
23
+ const scrollY = ((_a = scrollElement.current) === null || _a === void 0 ? void 0 : _a.scrollTop) || 0;
24
+ const scrollHeight = ((_b = scrollElement.current) === null || _b === void 0 ? void 0 : _b.scrollHeight) || 0;
25
+ const clientHeight = ((_c = scrollElement.current) === null || _c === void 0 ? void 0 : _c.clientHeight) || 0;
22
26
  // Detect if the user is at the top or bottom of the page
23
27
  if (scrollY <= 0 || scrollY + clientHeight >= scrollHeight) {
24
28
  isBouncing.current = true;
@@ -38,9 +42,19 @@ function useScrollDirection(threshold = 100) {
38
42
  lastScrollY.current = scrollY > 0 ? scrollY : 0;
39
43
  }
40
44
  };
41
- window.addEventListener("scroll", updateScrollDirection, { passive: true });
45
+ if (!scrollElement.current) {
46
+ scrollElement.current = document.getElementById("tc-vgsl");
47
+ }
48
+ if (!hasScrollListener.current) {
49
+ (_a = scrollElement.current) === null || _a === void 0 ? void 0 : _a.addEventListener("scroll", updateScrollDirection, {
50
+ passive: true,
51
+ });
52
+ hasScrollListener.current = true;
53
+ }
42
54
  return () => {
43
- window.removeEventListener("scroll", updateScrollDirection);
55
+ var _a;
56
+ (_a = scrollElement.current) === null || _a === void 0 ? void 0 : _a.removeEventListener("scroll", updateScrollDirection);
57
+ hasScrollListener.current = false;
44
58
  };
45
59
  }, [threshold]);
46
60
  return scrollData;
@@ -1 +1 @@
1
- {"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../components/ui/selectors.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,iBAAiB;;;mFAiBtB,CAAA;AACD,KAAK,cAAc,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAC5D,YAAY,CAAC,OAAO,iBAAiB,CAAC,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAA;CAClE,CAAA;AAEH,QAAA,MAAM,SAAS;;;;;;;;;eAHA,MAAM,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS;2CA6CpE,CAAA;AACD,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE,GACpC,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AACD,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA4CvD,CAAA;AAID,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAA"}
1
+ {"version":3,"file":"selectors.d.ts","sourceRoot":"","sources":["../../../components/ui/selectors.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,EAAO,KAAK,YAAY,EAAE,MAAM,0BAA0B,CAAA;AAMjE,QAAA,MAAM,iBAAiB;;;mFAiBtB,CAAA;AACD,KAAK,cAAc,GAAG,KAAK,CAAC,wBAAwB,CAAC,QAAQ,CAAC,GAC5D,YAAY,CAAC,OAAO,iBAAiB,CAAC,GAAG;IACvC,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,aAAa,CAAC,EAAE,OAAO,CAAA;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAClB,KAAK,CAAC,EAAE,MAAM,CAAA;IACd,GAAG,CAAC,EAAE,MAAM,CAAA;IACZ,QAAQ,CAAC,EAAE,KAAK,CAAC,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS,CAAA;CAClE,CAAA;AAEH,QAAA,MAAM,SAAS;;;;;;;;;eAHA,MAAM,iBAAiB,CAAC,iBAAiB,CAAC,GAAG,SAAS;2CA6CpE,CAAA;AACD,KAAK,sBAAsB,GAAG;IAC5B,QAAQ,EACJ,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,EAAE,GACpC,KAAK,CAAC,YAAY,CAAC,cAAc,CAAC,CAAA;IACtC,YAAY,EAAE,KAAK,CAAC,SAAS,CAAC,cAAc,CAAC,CAAA;IAC7C,MAAM,CAAC,EAAE,MAAM,CAAA;IACf,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AACD,QAAA,MAAM,iBAAiB,EAAE,KAAK,CAAC,EAAE,CAAC,sBAAsB,CA+CvD,CAAA;AAID,OAAO,EAAE,iBAAiB,EAAE,SAAS,EAAE,iBAAiB,EAAE,CAAA"}
@@ -59,7 +59,7 @@ const SelectorContainer = ({ children, containerRef, className, height, }) => {
59
59
  React.useEffect(() => {
60
60
  checkOverflow();
61
61
  }, [children]);
62
- return (_jsx("div", Object.assign({ className: "relative no-scrollbar" }, { children: _jsxs("div", Object.assign({ className: cn(`flex gap-2 px-1 items-center no-scrollbar`, className), onScroll: checkOverflow, style: { maxHeight: height }, ref: containerRef }, { children: [children, showFadeLeft && (_jsx("div", { className: "absolute top-0 left-0 w-8 h-full pointer-events-none bg-fade-left" })), showFadeRight && (_jsx("div", { className: "absolute top-0 right-0 w-8 h-full pointer-events-none bg-fade-right" }))] })) })));
62
+ return (_jsx("div", Object.assign({ className: "relative no-scrollbar" }, { children: _jsxs("div", Object.assign({ className: cn(`flex gap-2 p-1 items-center overflow-x-auto overflow-y-hidden no-scrollbar`, className), onScroll: checkOverflow, style: { maxHeight: height }, ref: containerRef }, { children: [children, showFadeLeft && (_jsx("div", { className: "absolute top-0 left-0 w-8 h-full pointer-events-none bg-fade-left" })), showFadeRight && (_jsx("div", { className: "absolute top-0 right-0 w-8 h-full pointer-events-none bg-fade-right" }))] })) })));
63
63
  };
64
64
  Selectors.displayName = "Selectors";
65
65
  export { SelectorContainer, Selectors, selectorsVariants };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tapcart/mobile-components",
3
- "version": "0.7.80",
3
+ "version": "0.7.81",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "style": "dist/styles.css",