@diwauhris/ui 1.7.13 → 1.7.14

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/lib/index.cjs CHANGED
@@ -1434,18 +1434,32 @@ function DatePicker({ value, onChange, placeholder, className, disabled, error,
1434
1434
  }, []);
1435
1435
  (0, react.useEffect)(() => {
1436
1436
  if (!isOpen) return;
1437
- function handleScroll(e) {
1438
- if (wrapperRef.current && wrapperRef.current.contains(e.target)) return;
1439
- setIsOpen(false);
1440
- }
1441
- function handleResize() {
1442
- setIsOpen(false);
1437
+ function getScrollParent(el) {
1438
+ if (!el || el === document.body) return null;
1439
+ const style = getComputedStyle(el);
1440
+ if (["auto", "scroll"].includes(style.overflowY) || ["auto", "scroll"].includes(style.overflow)) return el;
1441
+ return getScrollParent(el.parentElement);
1443
1442
  }
1444
- window.addEventListener("scroll", handleScroll, { capture: true });
1445
- window.addEventListener("resize", handleResize);
1443
+ const scrollParent = getScrollParent(wrapperRef.current?.parentElement ?? null);
1444
+ let scrollHandler = null;
1445
+ let resizeHandler = null;
1446
+ const frameId = requestAnimationFrame(() => {
1447
+ scrollHandler = () => setIsOpen(false);
1448
+ resizeHandler = () => setIsOpen(false);
1449
+ if (scrollParent) scrollParent.addEventListener("scroll", scrollHandler, { passive: true });
1450
+ window.addEventListener("scroll", scrollHandler, {
1451
+ capture: true,
1452
+ passive: true
1453
+ });
1454
+ window.addEventListener("resize", resizeHandler);
1455
+ });
1446
1456
  return () => {
1447
- window.removeEventListener("scroll", handleScroll, { capture: true });
1448
- window.removeEventListener("resize", handleResize);
1457
+ cancelAnimationFrame(frameId);
1458
+ if (scrollHandler) {
1459
+ if (scrollParent) scrollParent.removeEventListener("scroll", scrollHandler);
1460
+ window.removeEventListener("scroll", scrollHandler, { capture: true });
1461
+ }
1462
+ if (resizeHandler) window.removeEventListener("resize", resizeHandler);
1449
1463
  };
1450
1464
  }, [isOpen]);
1451
1465
  (0, react.useEffect)(() => {
package/lib/index.mjs CHANGED
@@ -1410,18 +1410,32 @@ function DatePicker({ value, onChange, placeholder, className, disabled, error,
1410
1410
  }, []);
1411
1411
  useEffect(() => {
1412
1412
  if (!isOpen) return;
1413
- function handleScroll(e) {
1414
- if (wrapperRef.current && wrapperRef.current.contains(e.target)) return;
1415
- setIsOpen(false);
1416
- }
1417
- function handleResize() {
1418
- setIsOpen(false);
1413
+ function getScrollParent(el) {
1414
+ if (!el || el === document.body) return null;
1415
+ const style = getComputedStyle(el);
1416
+ if (["auto", "scroll"].includes(style.overflowY) || ["auto", "scroll"].includes(style.overflow)) return el;
1417
+ return getScrollParent(el.parentElement);
1419
1418
  }
1420
- window.addEventListener("scroll", handleScroll, { capture: true });
1421
- window.addEventListener("resize", handleResize);
1419
+ const scrollParent = getScrollParent(wrapperRef.current?.parentElement ?? null);
1420
+ let scrollHandler = null;
1421
+ let resizeHandler = null;
1422
+ const frameId = requestAnimationFrame(() => {
1423
+ scrollHandler = () => setIsOpen(false);
1424
+ resizeHandler = () => setIsOpen(false);
1425
+ if (scrollParent) scrollParent.addEventListener("scroll", scrollHandler, { passive: true });
1426
+ window.addEventListener("scroll", scrollHandler, {
1427
+ capture: true,
1428
+ passive: true
1429
+ });
1430
+ window.addEventListener("resize", resizeHandler);
1431
+ });
1422
1432
  return () => {
1423
- window.removeEventListener("scroll", handleScroll, { capture: true });
1424
- window.removeEventListener("resize", handleResize);
1433
+ cancelAnimationFrame(frameId);
1434
+ if (scrollHandler) {
1435
+ if (scrollParent) scrollParent.removeEventListener("scroll", scrollHandler);
1436
+ window.removeEventListener("scroll", scrollHandler, { capture: true });
1437
+ }
1438
+ if (resizeHandler) window.removeEventListener("resize", resizeHandler);
1425
1439
  };
1426
1440
  }, [isOpen]);
1427
1441
  useEffect(() => {
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@diwauhris/ui",
3
3
  "private": false,
4
- "version": "1.7.13",
4
+ "version": "1.7.14",
5
5
  "type": "module",
6
6
  "description": "DIWA UHRIS UI component library — React + Tailwind CSS",
7
7
  "keywords": [