@byeolnaerim/flex-layout 0.0.6 → 0.0.7

package/dist/flex-layout/components/FlexLayoutStickyBox.js

@@ -0,0 +1,224 @@
+import { jsx } from 'react/jsx-runtime';
+import { useRef, useState, useEffect } from 'react';
+
+function clamp(n, min, max) {
+  return Math.max(min, Math.min(max, n));
+}
+function pickDefaultScrollRoot() {
+  if (typeof document === "undefined") return null;
+  let el = document.body;
+  while (el && el !== document.documentElement && el !== document.body) {
+    const style = getComputedStyle(el);
+    const oy = style.overflowY;
+    const ox = style.overflowX;
+    const scrollable = oy === "auto" || oy === "scroll" || ox === "auto" || ox === "scroll";
+    if (scrollable) return el;
+    el = el.parentElement;
+  }
+  return null;
+}
+function isVerticalScroll(root) {
+  if (typeof window == "undefined") return true;
+  if (!root) {
+    return document.documentElement.scrollHeight > window.innerHeight + 1;
+  }
+  const el = root;
+  return el.scrollHeight > el.clientHeight + 1;
+}
+const dpr = typeof window != "undefined" ? window.devicePixelRatio || 1 : 1;
+function quantizeToDevicePixel(n) {
+  return Math.round(n * dpr) / dpr;
+}
+const FlexLayoutStickyBox = ({
+  edge = "auto",
+  offset = 16,
+  scrollRoot = null,
+  debug = false,
+  children,
+  style,
+  className,
+  onTranslateChange = () => {
+  },
+  ...rest
+}) => {
+  const offsetRef = useRef(offset);
+  const rootRef = useRef(null);
+  const contentRef = useRef(null);
+  const mutatingRef = useRef(false);
+  const lastOffsetRef = useRef(0);
+  const [resolvedEdge, setResolvedEdge] = useState("top");
+  const rafId = useRef(null);
+  const [contentDynamicStyle, setContentDynamicStyle] = useState({});
+  useEffect(() => {
+    setContentDynamicStyle({
+      willChange: "transform",
+      transition: "transform 50ms linear"
+    });
+  }, []);
+  useEffect(() => {
+    offsetRef.current = offset;
+    scheduleUpdate();
+  }, [offset]);
+  const [ioRoot, setIoRoot] = useState(null);
+  useEffect(() => {
+    const root = scrollRoot ?? pickDefaultScrollRoot();
+    setResolvedEdge(
+      edge === "auto" ? isVerticalScroll(root) ? "top" : "left" : edge
+    );
+    setIoRoot(root);
+  }, [edge, scrollRoot]);
+  useEffect(() => {
+    if (edge !== "auto") {
+      setResolvedEdge(edge);
+      return;
+    }
+    const vertical = isVerticalScroll(ioRoot);
+    setResolvedEdge(vertical ? "top" : "left");
+  }, [edge, ioRoot]);
+  useEffect(() => {
+  }, []);
+  const scheduleUpdate = () => {
+    if (rafId.current != null) return;
+    rafId.current = requestAnimationFrame(() => {
+      rafId.current = null;
+      doUpdate();
+    });
+  };
+  const doUpdate = () => {
+    if (mutatingRef.current) return;
+    mutatingRef.current = true;
+    const rootEl = rootRef.current;
+    const contentEl = contentRef.current;
+    if (!rootEl || !contentEl) {
+      mutatingRef.current = false;
+      return;
+    }
+    const parentEl = rootEl.parentElement;
+    if (!parentEl) {
+      mutatingRef.current = false;
+      return;
+    }
+    const rootBounds = ioRoot && "getBoundingClientRect" in ioRoot ? ioRoot.getBoundingClientRect() : new DOMRect(0, 0, window.innerWidth, window.innerHeight);
+    const parentRect = parentEl.getBoundingClientRect();
+    const contentRect = contentEl.getBoundingClientRect();
+    let newOffset = 0;
+    if (resolvedEdge === "top" || resolvedEdge === "bottom") {
+      const maxTranslate = Math.max(
+        0,
+        parentRect.height - contentRect.height
+      );
+      let desiredTop = 0;
+      if (resolvedEdge === "top") {
+        desiredTop = rootBounds.top + offsetRef.current - parentRect.top;
+      } else {
+        const targetBottomFromParentTop = Math.min(
+          parentRect.bottom,
+          rootBounds.bottom - offsetRef.current
+        ) - parentRect.top;
+        desiredTop = targetBottomFromParentTop - contentRect.height;
+      }
+      newOffset = clamp(desiredTop, 0, maxTranslate);
+    } else {
+      const maxTranslate = Math.max(
+        0,
+        parentRect.width - contentRect.width
+      );
+      let desiredLeft = 0;
+      if (resolvedEdge === "left") {
+        desiredLeft = rootBounds.left + offsetRef.current - parentRect.left;
+      } else {
+        const targetRightFromParentLeft = Math.min(
+          parentRect.right,
+          rootBounds.right - offsetRef.current
+        ) - parentRect.left;
+        desiredLeft = targetRightFromParentLeft - contentRect.width;
+      }
+      newOffset = clamp(desiredLeft, 0, maxTranslate);
+    }
+    const nextOffset = quantizeToDevicePixel(newOffset);
+    if (Math.abs(lastOffsetRef.current - nextOffset) > 0.5) {
+      if (resolvedEdge === "top" || resolvedEdge === "bottom") {
+        contentEl.style.transform = `translateY(${nextOffset}px)`;
+      } else {
+        contentEl.style.transform = `translateX(${nextOffset}px)`;
+      }
+      lastOffsetRef.current = nextOffset;
+      onTranslateChange(nextOffset, rootRef, contentRef);
+    }
+    if (debug) {
+      rootEl.style.outline = "1px dashed rgba(0,0,0,.2)";
+      contentEl.style.outline = "1px solid rgba(0,128,255,.35)";
+    }
+    queueMicrotask(() => {
+      mutatingRef.current = false;
+    });
+  };
+  useEffect(() => {
+    if (typeof window == "undefined") return;
+    const rootEl = rootRef.current;
+    if (!rootEl) return;
+    const parentEl = rootEl.parentElement;
+    console.log(parentEl);
+    if (!parentEl) return;
+    const targets = [parentEl];
+    const observerCallback = () => {
+      if (!mutatingRef.current) scheduleUpdate();
+    };
+    const io = new IntersectionObserver(observerCallback, {
+      root: ioRoot instanceof Element ? ioRoot : null,
+      threshold: 0,
+      rootMargin: "1px"
+    });
+    const ro = new ResizeObserver(observerCallback);
+    targets.forEach((t) => io.observe(t));
+    ro.observe(parentEl);
+    if (contentRef.current) {
+      ro.observe(contentRef.current);
+    }
+    const scrollTarget = ioRoot || window;
+    scrollTarget.addEventListener("scroll", scheduleUpdate, {
+      passive: true
+    });
+    window.addEventListener("resize", scheduleUpdate);
+    scheduleUpdate();
+    return () => {
+      io.disconnect();
+      ro.disconnect();
+      scrollTarget.removeEventListener("scroll", scheduleUpdate);
+      window.removeEventListener("resize", scheduleUpdate);
+      if (rafId.current != null) {
+        cancelAnimationFrame(rafId.current);
+        rafId.current = null;
+      }
+    };
+  }, [ioRoot, resolvedEdge, offset, debug]);
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      ref: rootRef,
+      className,
+      style: {
+        display: "block",
+        minWidth: 0,
+        minHeight: 0,
+        height: "100%",
+        // 부모 높이를 채우도록 설정
+        ...style
+      },
+      ...rest,
+      children: /* @__PURE__ */ jsx(
+        "div",
+        {
+          ref: contentRef,
+          style: contentDynamicStyle,
+          children
+        }
+      )
+    }
+  );
+};
+var FlexLayoutStickyBox_default = FlexLayoutStickyBox;
+
+export { FlexLayoutStickyBox_default as default };
+//# sourceMappingURL=FlexLayoutStickyBox.js.map
+//# sourceMappingURL=FlexLayoutStickyBox.js.map

package/dist/flex-layout/components/FlexLayoutStickyBox.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/flex-layout/components/FlexLayoutStickyBox.tsx"],"names":[],"mappings":";;;AAiCA,SAAS,KAAA,CAAM,CAAA,EAAW,GAAA,EAAa,GAAA,EAAa;AACnD,EAAA,OAAO,KAAK,GAAA,CAAI,GAAA,EAAK,KAAK,GAAA,CAAI,GAAA,EAAK,CAAC,CAAC,CAAA;AACtC;AAEA,SAAS,qBAAA,GAAwC;AAChD,EAAA,IAAI,OAAO,QAAA,KAAa,WAAA,EAAa,OAAO,IAAA;AAE5C,EAAA,IAAI,KAAqB,QAAA,CAAS,IAAA;AAClC,EAAA,OAAO,MAAM,EAAA,KAAO,QAAA,CAAS,eAAA,IAAmB,EAAA,KAAO,SAAS,IAAA,EAAM;AACrE,IAAA,MAAM,KAAA,GAAQ,iBAAiB,EAAE,CAAA;AACjC,IAAA,MAAM,KAAK,KAAA,CAAM,SAAA;AACjB,IAAA,MAAM,KAAK,KAAA,CAAM,SAAA;AACjB,IAAA,MAAM,aACL,EAAA,KAAO,MAAA,IACP,OAAO,QAAA,IACP,EAAA,KAAO,UACP,EAAA,KAAO,QAAA;AACR,IAAA,IAAI,YAAY,OAAO,EAAA;AACvB,IAAA,EAAA,GAAK,EAAA,CAAG,aAAA;AAAA,EACT;AACA,EAAA,OAAO,IAAA;AACR;AAEA,SAAS,iBAAiB,IAAA,EAA+B;AACxD,EAAA,IAAI,OAAO,MAAA,IAAU,WAAA,EAAa,OAAO,IAAA;AACzC,EAAA,IAAI,CAAC,IAAA,EAAM;AACV,IAAA,OAAO,QAAA,CAAS,eAAA,CAAgB,YAAA,GAAe,MAAA,CAAO,WAAA,GAAc,CAAA;AAAA,EACrE;AACA,EAAA,MAAM,EAAA,GAAK,IAAA;AACX,EAAA,OAAO,EAAA,CAAG,YAAA,GAAe,EAAA,CAAG,YAAA,GAAe,CAAA;AAC5C;AAEA,MAAM,MAAM,OAAO,MAAA,IAAU,WAAA,GAAc,MAAA,CAAO,oBAAoB,CAAA,GAAI,CAAA;AAC1E,SAAS,sBAAsB,CAAA,EAAW;AACzC,EAAA,OAAO,IAAA,CAAK,KAAA,CAAM,CAAA,GAAI,GAAG,CAAA,GAAI,GAAA;AAC9B;AAcA,MAAM,sBAAoD,CAAC;AAAA,EAC1D,IAAA,GAAO,MAAA;AAAA,EACP,MAAA,GAAS,EAAA;AAAA,EACT,UAAA,GAAa,IAAA;AAAA,EACb,KAAA,GAAQ,KAAA;AAAA,EACR,QAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,oBAAoB,MAAM;AAAA,EAAC,CAAA;AAAA,EAC3B,GAAG;AACJ,CAAA,KAAM;AACL,EAAA,MAAM,SAAA,GAAY,OAAO,MAAM,CAAA;AAC/B,EAAA,MAAM,OAAA,GAAU,OAAuB,IAAI,CAAA;AAC3C,EAAA,MAAM,UAAA,GAAa,OAAuB,IAAI,CAAA;AAC9C,EAAA,MAAM,WAAA,GAAc,OAAO,KAAK,CAAA;AAChC,EAAA,MAAM,aAAA,GAAgB,OAAO,CAAC,CAAA;AAC9B,EAAA,MAAM,CAAC,YAAA,EAAc,eAAe,CAAA,GAAI,SAAe,KAAK,CAAA;AAC5D,EAAA,MAAM,KAAA,GAAQ,OAAsB,IAAI,CAAA;AAGxC,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GACjD,QAAA,CAAwB,EAAE,CAAA;AAC3B,EAAA,SAAA,CAAU,MAAM;AAKf,IAAA,sBAAA,CAAuB;AAAA,MACtB,UAAA,EAAY,WAAA;AAAA,MACZ,UAAA,EAAY;AAAA,KACZ,CAAA;AAAA,EAEF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,SAAA,CAAU,OAAA,GAAU,MAAA;AACpB,IAAA,cAAA,EAAe;AAAA,EAChB,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AACX,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAAyB,IAAI,CAAA;AACzD,EAAA,SAAA,CAAU,MAAM;AAEf,IAAA,MAAM,IAAA,GAAO,cAAc,qBAAA,EAAsB;AACjD,IAAA,eAAA;AAAA,MACC,SAAS,MAAA,GAAU,gBAAA,CAAiB,IAAI,CAAA,GAAI,QAAQ,MAAA,GAAU;AAAA,KAC/D;AAEA,IAAA,SAAA,CAAU,IAAI,CAAA;AAAA,EACf,CAAA,EAAG,CAAC,IAAA,EAAM,UAAU,CAAC,CAAA;AACrB,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,SAAS,MAAA,EAAQ;AACpB,MAAA,eAAA,CAAgB,IAAI,CAAA;AACpB,MAAA;AAAA,IACD;AACA,IAAA,MAAM,QAAA,GAAW,iBAAiB,MAAM,CAAA;AACxC,IAAA,eAAA,CAAgB,QAAA,GAAW,QAAQ,MAAM,CAAA;AAAA,EAC1C,CAAA,EAAG,CAAC,IAAA,EAAM,MAAM,CAAC,CAAA;AAEjB,EAAA,SAAA,CAAU,MAAM;AAAA,EAAC,CAAA,EAAG,EAAE,CAAA;AAEtB,EAAA,MAAM,iBAAiB,MAAM;AAC5B,IAAA,IAAI,KAAA,CAAM,WAAW,IAAA,EAAM;AAC3B,IAAA,KAAA,CAAM,OAAA,GAAU,sBAAsB,MAAM;AAC3C,MAAA,KAAA,CAAM,OAAA,GAAU,IAAA;AAChB,MAAA,QAAA,EAAS;AAAA,IACV,CAAC,CAAA;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,WAAW,MAAM;AACtB,IAAA,IAAI,YAAY,OAAA,EAAS;AACzB,IAAA,WAAA,CAAY,OAAA,GAAU,IAAA;AAEtB,IAAA,MAAM,SAAS,OAAA,CAAQ,OAAA;AACvB,IAAA,MAAM,YAAY,UAAA,CAAW,OAAA;AAC7B,IAAA,IAAI,CAAC,MAAA,IAAU,CAAC,SAAA,EAAW;AAC1B,MAAA,WAAA,CAAY,OAAA,GAAU,KAAA;AACtB,MAAA;AAAA,IACD;AAEA,IAAA,MAAM,WAAW,MAAA,CAAO,aAAA;AACxB,IAAA,IAAI,CAAC,QAAA,EAAU;AACd,MAAA,WAAA,CAAY,OAAA,GAAU,KAAA;AACtB,MAAA;AAAA,IACD;AAEA,IAAA,MAAM,UAAA,GACL,MAAA,IAAU,uBAAA,IAA2B,MAAA,GACjC,OAAmB,qBAAA,EAAsB,GAC1C,IAAI,OAAA,CAAQ,CAAA,EAAG,CAAA,EAAG,MAAA,CAAO,UAAA,EAAY,OAAO,WAAW,CAAA;AAE3D,IAAA,MAAM,UAAA,GAAa,SAAS,qBAAA,EAAsB;AAClD,IAAA,MAAM,WAAA,GAAc,UAAU,qBAAA,EAAsB;AAEpD,IAAA,IAAI,SAAA,GAAY,CAAA;AAEhB,IAAA,IAAI,YAAA,KAAiB,KAAA,IAAS,YAAA,KAAiB,QAAA,EAAU;AACxD,MAAA,MAAM,eAAe,IAAA,CAAK,GAAA;AAAA,QACzB,CAAA;AAAA,QACA,UAAA,CAAW,SAAS,WAAA,CAAY;AAAA,OACjC;AACA,MAAA,IAAI,UAAA,GAAa,CAAA;AAEjB,MAAA,IAAI,iBAAiB,KAAA,EAAO;AAC3B,QAAA,UAAA,GACC,UAAA,CAAW,GAAA,GAAM,SAAA,CAAU,OAAA,GAAU,UAAA,CAAW,GAAA;AAAA,MAClD,CAAA,MAAO;AAEN,QAAA,MAAM,4BACL,IAAA,CAAK,GAAA;AAAA,UACJ,UAAA,CAAW,MAAA;AAAA,UACX,UAAA,CAAW,SAAS,SAAA,CAAU;AAAA,YAC3B,UAAA,CAAW,GAAA;AAChB,QAAA,UAAA,GAAa,4BAA4B,WAAA,CAAY,MAAA;AAAA,MACtD;AACA,MAAA,SAAA,GAAY,KAAA,CAAM,UAAA,EAAY,CAAA,EAAG,YAAY,CAAA;AAAA,IAC9C,CAAA,MAAO;AAEN,MAAA,MAAM,eAAe,IAAA,CAAK,GAAA;AAAA,QACzB,CAAA;AAAA,QACA,UAAA,CAAW,QAAQ,WAAA,CAAY;AAAA,OAChC;AACA,MAAA,IAAI,WAAA,GAAc,CAAA;AAElB,MAAA,IAAI,iBAAiB,MAAA,EAAQ;AAC5B,QAAA,WAAA,GACC,UAAA,CAAW,IAAA,GAAO,SAAA,CAAU,OAAA,GAAU,UAAA,CAAW,IAAA;AAAA,MACnD,CAAA,MAAO;AAEN,QAAA,MAAM,4BACL,IAAA,CAAK,GAAA;AAAA,UACJ,UAAA,CAAW,KAAA;AAAA,UACX,UAAA,CAAW,QAAQ,SAAA,CAAU;AAAA,YAC1B,UAAA,CAAW,IAAA;AAChB,QAAA,WAAA,GAAc,4BAA4B,WAAA,CAAY,KAAA;AAAA,MACvD;AACA,MAAA,SAAA,GAAY,KAAA,CAAM,WAAA,EAAa,CAAA,EAAG,YAAY,CAAA;AAAA,IAC/C;AAEA,IAAA,MAAM,UAAA,GAAa,sBAAsB,SAAS,CAAA;AAGlD,IAAA,IAAI,KAAK,GAAA,CAAI,aAAA,CAAc,OAAA,GAAU,UAAU,IAAI,GAAA,EAAK;AACvD,MAAA,IAAI,YAAA,KAAiB,KAAA,IAAS,YAAA,KAAiB,QAAA,EAAU;AACxD,QAAA,SAAA,CAAU,KAAA,CAAM,SAAA,GAAY,CAAA,WAAA,EAAc,UAAU,CAAA,GAAA,CAAA;AAAA,MACrD,CAAA,MAAO;AACN,QAAA,SAAA,CAAU,KAAA,CAAM,SAAA,GAAY,CAAA,WAAA,EAAc,UAAU,CAAA,GAAA,CAAA;AAAA,MACrD;AACA,MAAA,aAAA,CAAc,OAAA,GAAU,UAAA;AACxB,MAAA,iBAAA,CAAkB,UAAA,EAAY,SAAS,UAAU,CAAA;AAAA,IAClD;AAEA,IAAA,IAAI,KAAA,EAAO;AACV,MAAA,MAAA,CAAO,MAAM,OAAA,GAAU,2BAAA;AACvB,MAAA,SAAA,CAAU,MAAM,OAAA,GAAU,+BAAA;AAAA,IAC3B;AAEA,IAAA,cAAA,CAAe,MAAM;AACpB,MAAA,WAAA,CAAY,OAAA,GAAU,KAAA;AAAA,IACvB,CAAC,CAAA;AAAA,EACF,CAAA;AAGA,EAAA,SAAA,CAAU,MAAM;AACf,IAAA,IAAI,OAAO,UAAU,WAAA,EAAa;AAClC,IAAA,MAAM,SAAS,OAAA,CAAQ,OAAA;AACvB,IAAA,IAAI,CAAC,MAAA,EAAQ;AAEb,IAAA,MAAM,WAAW,MAAA,CAAO,aAAA;AAExB,IAAA,OAAA,CAAQ,IAAI,QAAQ,CAAA;AACpB,IAAA,IAAI,CAAC,QAAA,EAAU;AAEf,IAAA,MAAM,OAAA,GAAqB,CAAC,QAAQ,CAAA;AAEpC,IAAA,MAAM,mBAAmB,MAAM;AAC9B,MAAA,IAAI,CAAC,WAAA,CAAY,OAAA,EAAS,cAAA,EAAe;AAAA,IAC1C,CAAA;AAEA,IAAA,MAAM,EAAA,GAAK,IAAI,oBAAA,CAAqB,gBAAA,EAAkB;AAAA,MACrD,IAAA,EAAM,MAAA,YAAkB,OAAA,GAAU,MAAA,GAAS,IAAA;AAAA,MAC3C,SAAA,EAAW,CAAA;AAAA,MACX,UAAA,EAAY;AAAA,KACZ,CAAA;AAED,IAAA,MAAM,EAAA,GAAK,IAAI,cAAA,CAAe,gBAAgB,CAAA;AAE9C,IAAA,OAAA,CAAQ,QAAQ,CAAC,CAAA,KAAM,EAAA,CAAG,OAAA,CAAQ,CAAC,CAAC,CAAA;AACpC,IAAA,EAAA,CAAG,QAAQ,QAAQ,CAAA;AACnB,IAAA,IAAI,WAAW,OAAA,EAAS;AACvB,MAAA,EAAA,CAAG,OAAA,CAAQ,WAAW,OAAO,CAAA;AAAA,IAC9B;AAEA,IAAA,MAAM,eAAe,MAAA,IAAU,MAAA;AAC/B,IAAA,YAAA,CAAa,gBAAA,CAAiB,UAAU,cAAA,EAAgB;AAAA,MACvD,OAAA,EAAS;AAAA,KACT,CAAA;AACD,IAAA,MAAA,CAAO,gBAAA,CAAiB,UAAU,cAAc,CAAA;AAGhD,IAAA,cAAA,EAAe;AAEf,IAAA,OAAO,MAAM;AACZ,MAAA,EAAA,CAAG,UAAA,EAAW;AACd,MAAA,EAAA,CAAG,UAAA,EAAW;AACd,MAAA,YAAA,CAAa,mBAAA,CAAoB,UAAU,cAAc,CAAA;AACzD,MAAA,MAAA,CAAO,mBAAA,CAAoB,UAAU,cAAc,CAAA;AACnD,MAAA,IAAI,KAAA,CAAM,WAAW,IAAA,EAAM;AAC1B,QAAA,oBAAA,CAAqB,MAAM,OAAO,CAAA;AAClC,QAAA,KAAA,CAAM,OAAA,GAAU,IAAA;AAAA,MACjB;AAAA,IACD,CAAA;AAAA,EAED,GAAG,CAAC,MAAA,EAAQ,YAAA,EAAc,MAAA,EAAQ,KAAK,CAAC,CAAA;AAExC,EAAA,uBACC,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACA,GAAA,EAAK,OAAA;AAAA,MACL,SAAA;AAAA,MACA,KAAA,EAAO;AAAA,QACN,OAAA,EAAS,OAAA;AAAA,QACT,QAAA,EAAU,CAAA;AAAA,QACV,SAAA,EAAW,CAAA;AAAA,QACX,MAAA,EAAQ,MAAA;AAAA;AAAA,QACR,GAAG;AAAA,OACJ;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA;AAAA,QAAC,KAAA;AAAA,QAAA;AAAA,UACA,GAAA,EAAK,UAAA;AAAA,UAEL,KAAA,EAAO,mBAAA;AAAA,UAEN;AAAA;AAAA;AACF;AAAA,GACD;AAEF,CAAA;AAEA,IAAO,2BAAA,GAAQ","file":"FlexLayoutStickyBox.js","sourcesContent":["\"use client\";\r\nimport {\r\n\tCSSProperties,\r\n\tFC,\r\n\tHTMLAttributes,\r\n\tReactNode,\r\n\tRefObject,\r\n\tuseEffect,\r\n\tuseRef,\r\n\tuseState,\r\n} from \"react\";\r\n\r\ntype Edge = \"auto\" | \"top\" | \"bottom\" | \"left\" | \"right\";\r\n\r\ninterface FlexLayoutStickyBoxProps extends HTMLAttributes<HTMLDivElement> {\r\n\t/** 어느 방향으로 붙일지. 기본은 'auto' (세로 스크롤이면 top, 가로 스크롤이면 left) */\r\n\tedge?: Edge;\r\n\t/** 화면 모서리와의 여백(px). 기본 16 */\r\n\toffset?: number;\r\n\t/** 스크롤 루트. 명시 안 하면 가장 흔한 케이스인 <main> → 없으면 window(=viewport) */\r\n\tscrollRoot?: Element | null;\r\n\t/** 디버그 보조선 표시 */\r\n\tdebug?: boolean;\r\n\t/** 자식 */\r\n\tchildren: ReactNode;\r\n\r\n\tonTranslateChange?: (\r\n\t\tvalue: number,\r\n\t\trootRef: RefObject<HTMLDivElement | null>,\r\n\t\tcontentRef: RefObject<HTMLDivElement | null>,\r\n\t) => void;\r\n}\r\n\r\nfunction clamp(n: number, min: number, max: number) {\r\n\treturn Math.max(min, Math.min(max, n));\r\n}\r\n\r\nfunction pickDefaultScrollRoot(): Element | null {\r\n\tif (typeof document === \"undefined\") return null;\r\n\r\n\tlet el: Element | null = document.body;\r\n\twhile (el && el !== document.documentElement && el !== document.body) {\r\n\t\tconst style = getComputedStyle(el);\r\n\t\tconst oy = style.overflowY;\r\n\t\tconst ox = style.overflowX;\r\n\t\tconst scrollable =\r\n\t\t\toy === \"auto\" ||\r\n\t\t\toy === \"scroll\" ||\r\n\t\t\tox === \"auto\" ||\r\n\t\t\tox === \"scroll\";\r\n\t\tif (scrollable) return el;\r\n\t\tel = el.parentElement;\r\n\t}\r\n\treturn null;\r\n}\r\n\r\nfunction isVerticalScroll(root: Element | null): boolean {\r\n\tif (typeof window == \"undefined\") return true;\r\n\tif (!root) {\r\n\t\treturn document.documentElement.scrollHeight > window.innerHeight + 1;\r\n\t}\r\n\tconst el = root as HTMLElement;\r\n\treturn el.scrollHeight > el.clientHeight + 1;\r\n}\r\n\r\nconst dpr = typeof window != \"undefined\" ? window.devicePixelRatio || 1 : 1;\r\nfunction quantizeToDevicePixel(n: number) {\r\n\treturn Math.round(n * dpr) / dpr;\r\n}\r\n\r\n/**\r\n * FlexLayoutStickyBox\r\n * 부모(실제 경계) 안에서만 움직이며, `transform`을 동적으로 부여해\r\n * “sticky처럼 보이도록” 만든다.\r\n *\r\n * 구조:\r\n * <div data-root>      // 이 박스가 부모 경계 안에서 공간을 차지\r\n * <div data-content> // 이 박스가 transform으로 부드럽게 움직임\r\n * {children}\r\n * </div>\r\n * </div>\r\n */\r\nconst FlexLayoutStickyBox: FC<FlexLayoutStickyBoxProps> = ({\r\n\tedge = \"auto\",\r\n\toffset = 16,\r\n\tscrollRoot = null,\r\n\tdebug = false,\r\n\tchildren,\r\n\tstyle,\r\n\tclassName,\r\n\tonTranslateChange = () => {},\r\n\t...rest\r\n}) => {\r\n\tconst offsetRef = useRef(offset);\r\n\tconst rootRef = useRef<HTMLDivElement>(null); // 내가 들어있는 박스(부모의 자식)\r\n\tconst contentRef = useRef<HTMLDivElement>(null); // 실제 내용\r\n\tconst mutatingRef = useRef(false);\r\n\tconst lastOffsetRef = useRef(0);\r\n\tconst [resolvedEdge, setResolvedEdge] = useState<Edge>(\"top\");\r\n\tconst rafId = useRef<number | null>(null);\r\n\r\n\t//  마운트 이후에만(클라이언트에서만) 터치 스타일을 적용\r\n\tconst [contentDynamicStyle, setContentDynamicStyle] =\r\n\t\tuseState<CSSProperties>({});\r\n\tuseEffect(() => {\r\n\t\t// if (\r\n\t\t//     typeof navigator !== 'undefined' &&\r\n\t\t//     (navigator.maxTouchPoints ?? 0) > 0\r\n\t\t// ) {\r\n\t\tsetContentDynamicStyle({\r\n\t\t\twillChange: \"transform\",\r\n\t\t\ttransition: \"transform 50ms linear\",\r\n\t\t});\r\n\t\t// }\r\n\t}, []);\r\n\r\n\tuseEffect(() => {\r\n\t\toffsetRef.current = offset;\r\n\t\tscheduleUpdate();\r\n\t}, [offset]);\r\n\tconst [ioRoot, setIoRoot] = useState<Element | null>(null);\r\n\tuseEffect(() => {\r\n\t\t// CSR로 전환된 후에 반드시 최신 scroll root를 계산\r\n\t\tconst root = scrollRoot ?? pickDefaultScrollRoot();\r\n\t\tsetResolvedEdge(\r\n\t\t\tedge === \"auto\" ? (isVerticalScroll(root) ? \"top\" : \"left\") : edge,\r\n\t\t);\r\n\r\n\t\tsetIoRoot(root);\r\n\t}, [edge, scrollRoot]);\r\n\tuseEffect(() => {\r\n\t\tif (edge !== \"auto\") {\r\n\t\t\tsetResolvedEdge(edge);\r\n\t\t\treturn;\r\n\t\t}\r\n\t\tconst vertical = isVerticalScroll(ioRoot);\r\n\t\tsetResolvedEdge(vertical ? \"top\" : \"left\");\r\n\t}, [edge, ioRoot]);\r\n\r\n\tuseEffect(() => {}, []);\r\n\r\n\tconst scheduleUpdate = () => {\r\n\t\tif (rafId.current != null) return;\r\n\t\trafId.current = requestAnimationFrame(() => {\r\n\t\t\trafId.current = null;\r\n\t\t\tdoUpdate();\r\n\t\t});\r\n\t};\r\n\r\n\tconst doUpdate = () => {\r\n\t\tif (mutatingRef.current) return;\r\n\t\tmutatingRef.current = true;\r\n\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tconst contentEl = contentRef.current;\r\n\t\tif (!rootEl || !contentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\t\tif (!parentEl) {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t\treturn;\r\n\t\t}\r\n\r\n\t\tconst rootBounds =\r\n\t\t\tioRoot && \"getBoundingClientRect\" in ioRoot\r\n\t\t\t\t? (ioRoot as Element).getBoundingClientRect()\r\n\t\t\t\t: new DOMRect(0, 0, window.innerWidth, window.innerHeight);\r\n\r\n\t\tconst parentRect = parentEl.getBoundingClientRect();\r\n\t\tconst contentRect = contentEl.getBoundingClientRect();\r\n\r\n\t\tlet newOffset = 0;\r\n\r\n\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.height - contentRect.height,\r\n\t\t\t);\r\n\t\t\tlet desiredTop = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"top\") {\r\n\t\t\t\tdesiredTop =\r\n\t\t\t\t\trootBounds.top + offsetRef.current - parentRect.top;\r\n\t\t\t} else {\r\n\t\t\t\t// bottom\r\n\t\t\t\tconst targetBottomFromParentTop =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.bottom,\r\n\t\t\t\t\t\trootBounds.bottom - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.top;\r\n\t\t\t\tdesiredTop = targetBottomFromParentTop - contentRect.height;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredTop, 0, maxTranslate);\r\n\t\t} else {\r\n\t\t\t// left or right\r\n\t\t\tconst maxTranslate = Math.max(\r\n\t\t\t\t0,\r\n\t\t\t\tparentRect.width - contentRect.width,\r\n\t\t\t);\r\n\t\t\tlet desiredLeft = 0;\r\n\r\n\t\t\tif (resolvedEdge === \"left\") {\r\n\t\t\t\tdesiredLeft =\r\n\t\t\t\t\trootBounds.left + offsetRef.current - parentRect.left;\r\n\t\t\t} else {\r\n\t\t\t\t// right\r\n\t\t\t\tconst targetRightFromParentLeft =\r\n\t\t\t\t\tMath.min(\r\n\t\t\t\t\t\tparentRect.right,\r\n\t\t\t\t\t\trootBounds.right - offsetRef.current,\r\n\t\t\t\t\t) - parentRect.left;\r\n\t\t\t\tdesiredLeft = targetRightFromParentLeft - contentRect.width;\r\n\t\t\t}\r\n\t\t\tnewOffset = clamp(desiredLeft, 0, maxTranslate);\r\n\t\t}\r\n\r\n\t\tconst nextOffset = quantizeToDevicePixel(newOffset);\r\n\r\n\t\t// 변화가 거의 없으면 업데이트 건너뛰기 (미세한 떨림 방지)\r\n\t\tif (Math.abs(lastOffsetRef.current - nextOffset) > 0.5) {\r\n\t\t\tif (resolvedEdge === \"top\" || resolvedEdge === \"bottom\") {\r\n\t\t\t\tcontentEl.style.transform = `translateY(${nextOffset}px)`;\r\n\t\t\t} else {\r\n\t\t\t\tcontentEl.style.transform = `translateX(${nextOffset}px)`;\r\n\t\t\t}\r\n\t\t\tlastOffsetRef.current = nextOffset;\r\n\t\t\tonTranslateChange(nextOffset, rootRef, contentRef);\r\n\t\t}\r\n\r\n\t\tif (debug) {\r\n\t\t\trootEl.style.outline = \"1px dashed rgba(0,0,0,.2)\";\r\n\t\t\tcontentEl.style.outline = \"1px solid rgba(0,128,255,.35)\";\r\n\t\t}\r\n\r\n\t\tqueueMicrotask(() => {\r\n\t\t\tmutatingRef.current = false;\r\n\t\t});\r\n\t};\r\n\r\n\t// IntersectionObserver, ResizeObserver, Event Listeners 설정\r\n\tuseEffect(() => {\r\n\t\tif (typeof window == \"undefined\") return;\r\n\t\tconst rootEl = rootRef.current;\r\n\t\tif (!rootEl) return;\r\n\r\n\t\tconst parentEl = rootEl.parentElement;\r\n\r\n\t\tconsole.log(parentEl);\r\n\t\tif (!parentEl) return;\r\n\r\n\t\tconst targets: Element[] = [parentEl];\r\n\r\n\t\tconst observerCallback = () => {\r\n\t\t\tif (!mutatingRef.current) scheduleUpdate();\r\n\t\t};\r\n\r\n\t\tconst io = new IntersectionObserver(observerCallback, {\r\n\t\t\troot: ioRoot instanceof Element ? ioRoot : null,\r\n\t\t\tthreshold: 0,\r\n\t\t\trootMargin: \"1px\",\r\n\t\t});\r\n\r\n\t\tconst ro = new ResizeObserver(observerCallback);\r\n\r\n\t\ttargets.forEach((t) => io.observe(t));\r\n\t\tro.observe(parentEl);\r\n\t\tif (contentRef.current) {\r\n\t\t\tro.observe(contentRef.current);\r\n\t\t}\r\n\r\n\t\tconst scrollTarget = ioRoot || window;\r\n\t\tscrollTarget.addEventListener(\"scroll\", scheduleUpdate, {\r\n\t\t\tpassive: true,\r\n\t\t});\r\n\t\twindow.addEventListener(\"resize\", scheduleUpdate);\r\n\r\n\t\t// 최초 1회 계산\r\n\t\tscheduleUpdate();\r\n\r\n\t\treturn () => {\r\n\t\t\tio.disconnect();\r\n\t\t\tro.disconnect();\r\n\t\t\tscrollTarget.removeEventListener(\"scroll\", scheduleUpdate);\r\n\t\t\twindow.removeEventListener(\"resize\", scheduleUpdate);\r\n\t\t\tif (rafId.current != null) {\r\n\t\t\t\tcancelAnimationFrame(rafId.current);\r\n\t\t\t\trafId.current = null;\r\n\t\t\t}\r\n\t\t};\r\n\t\t// eslint-disable-next-line react-hooks/exhaustive-deps\r\n\t}, [ioRoot, resolvedEdge, offset, debug]);\r\n\r\n\treturn (\r\n\t\t<div\r\n\t\t\tref={rootRef}\r\n\t\t\tclassName={className}\r\n\t\t\tstyle={{\r\n\t\t\t\tdisplay: \"block\",\r\n\t\t\t\tminWidth: 0,\r\n\t\t\t\tminHeight: 0,\r\n\t\t\t\theight: \"100%\", // 부모 높이를 채우도록 설정\r\n\t\t\t\t...style,\r\n\t\t\t}}\r\n\t\t\t{...rest}\r\n\t\t>\r\n\t\t\t<div\r\n\t\t\t\tref={contentRef}\r\n\t\t\t\t//  SSR/클라이언트 첫 렌더 동일 → 마운트 후에만 스타일 부여\r\n\t\t\t\tstyle={contentDynamicStyle}\r\n\t\t\t>\r\n\t\t\t\t{children}\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t);\r\n};\r\n\r\nexport default FlexLayoutStickyBox;\r\n"]}

package/dist/flex-layout/components/index.cjs

@@ -0,0 +1,52 @@
+'use strict';
+
+var FlexLayout = require('./FlexLayout');
+var FlexLayoutContainer = require('./FlexLayoutContainer');
+var FlexLayoutResizePanel = require('./FlexLayoutResizePanel');
+var FlexLayoutSplitScreen = require('./FlexLayoutSplitScreen');
+var FlexLayoutSplitScreenDragBox = require('./FlexLayoutSplitScreenDragBox');
+var FlexLayoutSplitScreenScrollBox = require('./FlexLayoutSplitScreenScrollBox');
+var FlexLayoutStickyBox = require('./FlexLayoutStickyBox');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
+
+var FlexLayout__default = /*#__PURE__*/_interopDefault(FlexLayout);
+var FlexLayoutContainer__default = /*#__PURE__*/_interopDefault(FlexLayoutContainer);
+var FlexLayoutResizePanel__default = /*#__PURE__*/_interopDefault(FlexLayoutResizePanel);
+var FlexLayoutSplitScreen__default = /*#__PURE__*/_interopDefault(FlexLayoutSplitScreen);
+var FlexLayoutSplitScreenDragBox__default = /*#__PURE__*/_interopDefault(FlexLayoutSplitScreenDragBox);
+var FlexLayoutSplitScreenScrollBox__default = /*#__PURE__*/_interopDefault(FlexLayoutSplitScreenScrollBox);
+var FlexLayoutStickyBox__default = /*#__PURE__*/_interopDefault(FlexLayoutStickyBox);
+
+
+
+Object.defineProperty(exports, "FlexLayout", {
+  enumerable: true,
+  get: function () { return FlexLayout__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutContainer", {
+  enumerable: true,
+  get: function () { return FlexLayoutContainer__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutResizePanel", {
+  enumerable: true,
+  get: function () { return FlexLayoutResizePanel__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutSplitScreen", {
+  enumerable: true,
+  get: function () { return FlexLayoutSplitScreen__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutSplitScreenDragBox", {
+  enumerable: true,
+  get: function () { return FlexLayoutSplitScreenDragBox__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutSplitScreenScrollBox", {
+  enumerable: true,
+  get: function () { return FlexLayoutSplitScreenScrollBox__default.default; }
+});
+Object.defineProperty(exports, "FlexLayoutStickyBox", {
+  enumerable: true,
+  get: function () { return FlexLayoutStickyBox__default.default; }
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/flex-layout/components/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}

package/dist/flex-layout/components/index.js

@@ -0,0 +1,9 @@
+export { default as FlexLayout } from './FlexLayout';
+export { default as FlexLayoutContainer } from './FlexLayoutContainer';
+export { default as FlexLayoutResizePanel } from './FlexLayoutResizePanel';
+export { default as FlexLayoutSplitScreen } from './FlexLayoutSplitScreen';
+export { default as FlexLayoutSplitScreenDragBox } from './FlexLayoutSplitScreenDragBox';
+export { default as FlexLayoutSplitScreenScrollBox } from './FlexLayoutSplitScreenScrollBox';
+export { default as FlexLayoutStickyBox } from './FlexLayoutStickyBox';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/flex-layout/components/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}

package/dist/flex-layout/hooks/index.cjs

@@ -0,0 +1,21 @@
+'use strict';
+
+var useDrag = require('./useDrag');
+var useListPaging = require('./useListPaging');
+
+
+
+Object.keys(useDrag).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return useDrag[k]; }
+	});
+});
+Object.keys(useListPaging).forEach(function (k) {
+	if (k !== 'default' && !Object.prototype.hasOwnProperty.call(exports, k)) Object.defineProperty(exports, k, {
+		enumerable: true,
+		get: function () { return useListPaging[k]; }
+	});
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/flex-layout/hooks/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs","sourcesContent":[]}

package/dist/flex-layout/hooks/index.js

@@ -0,0 +1,4 @@
+export * from './useDrag';
+export * from './useListPaging';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/flex-layout/hooks/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js","sourcesContent":[]}

package/dist/{hooks.cjs → flex-layout/hooks/useDrag.cjs}

@@ -3,39 +3,18 @@
 var equal = require('fast-deep-equal');
 var react = require('react');
 var rxjs = require('rxjs');
+var FlexLayoutUtils = require('../utils/FlexLayoutUtils');
 
 function _interopDefault (e) { return e && e.__esModule ? e : { default: e }; }
 
 var equal__default = /*#__PURE__*/_interopDefault(equal);
 
-// src/flex-layout/hooks/useDrag.ts
-
-// src/flex-layout/utils/FlexLayoutUtils.ts
-var lastTouchEvent;
-function getClientXy(event) {
-  let clientX;
-  let clientY;
-  if (window.MouseEvent && event instanceof window.MouseEvent) {
-    clientX = event.clientX;
-    clientY = event.clientY;
-  } else if (window.TouchEvent && event instanceof window.TouchEvent) {
-    const _event = event.touches.length == 0 ? lastTouchEvent : event;
-    clientX = _event.touches[0].clientX;
-    clientY = _event.touches[0].clientY;
-    lastTouchEvent = event;
-  } else {
-    return;
-  }
-  return { clientX, clientY };
-}
-
-// src/flex-layout/hooks/useDrag.ts
-var dragState = new rxjs.Subject();
-var filterChildren = (obj) => {
+const dragState = new rxjs.Subject();
+const filterChildren = (obj) => {
   const { children, ...rest } = obj || {};
   return rest;
 };
-var useDragCapture = (targetRef) => {
+const useDragCapture = (targetRef) => {
   const stateRef = react.useRef(null);
   const forceUpdate = react.useRef(0);
   react.useEffect(() => {
@@ -102,9 +81,9 @@ var useDragCapture = (targetRef) => {
   }, []);
   return stateRef.current;
 };
-var dropMovementEventSubject = new rxjs.Subject();
-var allSplitScreenCount = new rxjs.BehaviorSubject(0);
-var useDragEvents = ({
+const dropMovementEventSubject = new rxjs.Subject();
+const allSplitScreenCount = new rxjs.BehaviorSubject(0);
+const useDragEvents = ({
   isBlockingActiveInput = false
 }) => {
   const dragResumeTimer = react.useRef(null);
@@ -145,7 +124,7 @@ var useDragEvents = ({
         if (!isPending.current || isScrolling.current) return;
         isPending.current = false;
         isDragging.current = true;
-        const xy = getClientXy(event);
+        const xy = FlexLayoutUtils.getClientXy(event);
         if (!xy) return;
         const { clientX, clientY } = xy;
         dragStartCallback({ x: clientX, y: clientY });
@@ -162,7 +141,7 @@ var useDragEvents = ({
     }) => {
       if (!isMouseDown.current) return;
       const event = _event instanceof Event ? _event : _event.nativeEvent;
-      const xy = getClientXy(event);
+      const xy = FlexLayoutUtils.getClientXy(event);
       if (!xy) return;
       const { clientX, clientY } = xy;
       const deltaX = Math.abs(clientX - touchStartX.current);
@@ -206,7 +185,7 @@ var useDragEvents = ({
       const event = _event instanceof Event ? _event : _event.nativeEvent;
       if (!isDragging.current) return;
       isDragging.current = false;
-      const xy = getClientXy(event);
+      const xy = FlexLayoutUtils.getClientXy(event);
       if (!xy) return;
       const { clientX, clientY } = xy;
       dragEndCallback({ x: clientX, y: clientY });
@@ -219,11 +198,11 @@ var useDragEvents = ({
     handleEnd
   };
 };
-var folderEventSubject = new rxjs.Subject();
-var setFolderEvent = (newValue) => {
+const folderEventSubject = new rxjs.Subject();
+const setFolderEvent = (newValue) => {
   folderEventSubject.next(newValue);
 };
-var useFolderEvent = () => {
+const useFolderEvent = () => {
   const [folderEvent, setFolderEvent2] = react.useState(
     null
   );
@@ -240,175 +219,6 @@ var useFolderEvent = () => {
   }, []);
   return { folderEvent };
 };
-var useListPagingForSentinel = ({
-  //initPageNumber,
-  //initPageSize,
-  onReachTerminal
-}) => {
-  const [firstChildNode, setFirstChildNode] = react.useState(null);
-  const [lastChildNode, setLastChildNode] = react.useState(null);
-  const observerRef = react.useRef(null);
-  const firstChildRef = react.useCallback((node) => {
-    setFirstChildNode(node);
-  }, []);
-  const lastChildRef = react.useCallback((node) => {
-    setLastChildNode(node);
-  }, []);
-  react.useEffect(() => {
-    if (firstChildNode && observerRef.current)
-      observerRef.current.unobserve(firstChildNode);
-    if (lastChildNode && observerRef.current)
-      observerRef.current.unobserve(lastChildNode);
-    const handleIntersect = (entries, observer2) => {
-      entries.forEach((entry) => {
-        if (entry.isIntersecting) {
-          if (entry.target === firstChildNode) {
-            if (onReachTerminal)
-              onReachTerminal({
-                isFirst: true,
-                isLast: false,
-                observer: observer2
-              });
-          }
-          if (entry.target === lastChildNode) {
-            if (onReachTerminal)
-              onReachTerminal({
-                isFirst: false,
-                isLast: true,
-                observer: observer2
-              });
-          }
-        }
-      });
-    };
-    const observer = new IntersectionObserver(handleIntersect, {
-      threshold: 0.1
-    });
-    observerRef.current = observer;
-    if (firstChildNode) observer.observe(firstChildNode);
-    if (lastChildNode) observer.observe(lastChildNode);
-    return () => {
-      if (observerRef.current) {
-        observerRef.current.disconnect();
-      }
-    };
-  }, [firstChildNode, lastChildNode]);
-  return {
-    firstChildRef,
-    lastChildRef
-  };
-};
-var usePaginationViewNumber = ({
-  initPageNumber
-}) => {
-  const [showCurrentPageNumber, setShowCurrentPageNumber] = react.useState(initPageNumber);
-  const observerRef = react.useRef(null);
-  const showCurrentPageObserveTarget = react.useCallback(
-    (node) => {
-      if (!node) return;
-      if (!observerRef.current) {
-        observerRef.current = new IntersectionObserver(
-          (entries) => {
-            entries.forEach((entry) => {
-              if (entry.isIntersecting) {
-                const pageIndexAttr = entry.target.getAttribute(
-                  "data-page-index"
-                );
-                if (!pageIndexAttr) return;
-                const pageIndex = parseInt(pageIndexAttr, 10);
-                setShowCurrentPageNumber(pageIndex);
-              }
-            });
-          },
-          {
-            threshold: 0.1
-            // 예: 10% 이상 보여야 intersect로 판단
-          }
-        );
-      }
-      observerRef.current.observe(node);
-    },
-    []
-  );
-  react.useEffect(() => {
-    const currentObserver = observerRef.current;
-    return () => {
-      if (currentObserver) {
-        currentObserver.disconnect();
-      }
-    };
-  }, []);
-  return {
-    showCurrentPageNumber,
-    showCurrentPageObserveTarget
-  };
-};
-var usePagingHandler = ({
-  lastCallPageNumber,
-  dataListRef
-}) => {
-  const jumpingPageNumberRef = react.useRef(lastCallPageNumber);
-  react.useEffect(() => {
-    if (jumpingPageNumberRef.current) {
-      setTimeout(() => {
-        jumpingPageNumberRef.current = null;
-      }, 1e3);
-    }
-  }, [jumpingPageNumberRef]);
-  const paginationScrollIntoViewTarget = react.useRef({});
-  const pageNumberRef = react.useRef(lastCallPageNumber);
-  const setPaginationRef = react.useCallback(
-    (i) => (node) => {
-      if (!node) return;
-      paginationScrollIntoViewTarget.current[i] = node;
-      if (jumpingPageNumberRef.current !== null && i === jumpingPageNumberRef.current) {
-        node.scrollIntoView({
-          behavior: "instant",
-          // 필요한 경우 'smooth' 등으로 수정 가능
-          block: "start"
-        });
-        jumpingPageNumberRef.current = null;
-      }
-    },
-    []
-  );
-  const handleReachTerminal = ({ isFirst, isLast, observer }, dataCallFetch) => {
-    if (dataListRef.current.length === 0) return;
-    if (jumpingPageNumberRef.current != null) return;
-    if (!isFirst && !isLast) return;
-    const callPageNumber = isFirst ? Math.max(pageNumberRef.current - 1, 0) : pageNumberRef.current + 1;
-    if (dataListRef.current[callPageNumber] != null && (dataListRef.current[callPageNumber]?.length || 0) > 0)
-      return;
-    jumpingPageNumberRef.current = callPageNumber;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
-    dataCallFetch(callPageNumber);
-  };
-  const handleClickPageChange = (page, dataCallFetch) => {
-    const pageData = dataListRef.current[page];
-    if (pageData != null && Array.isArray(pageData) && pageData.length > 0) {
-      paginationScrollIntoViewTarget.current[page]?.scrollIntoView({
-        behavior: "smooth",
-        block: "start"
-      });
-      return;
-    }
-    jumpingPageNumberRef.current = page;
-    setTimeout(() => {
-      jumpingPageNumberRef.current = null;
-    }, 1e3);
-    dataCallFetch(page);
-  };
-  return {
-    jumpingPageNumberRef,
-    paginationScrollIntoViewTarget,
-    pageNumberRef,
-    setPaginationRef,
-    handleReachTerminal,
-    handleClickPageChange
-  };
-};
 
 exports.allSplitScreenCount = allSplitScreenCount;
 exports.dragState = dragState;
@@ -418,8 +228,5 @@ exports.setFolderEvent = setFolderEvent;
 exports.useDragCapture = useDragCapture;
 exports.useDragEvents = useDragEvents;
 exports.useFolderEvent = useFolderEvent;
-exports.useListPagingForSentinel = useListPagingForSentinel;
-exports.usePaginationViewNumber = usePaginationViewNumber;
-exports.usePagingHandler = usePagingHandler;
-//# sourceMappingURL=hooks.cjs.map
-//# sourceMappingURL=hooks.cjs.map
+//# sourceMappingURL=useDrag.cjs.map
+//# sourceMappingURL=useDrag.cjs.map