UNPKG

@pdf-viewer/react

Version:

A react-pdf-viewer component for React and Next.js. Suitable for react-pdf document.

62 lines (61 loc) 2.72 kB
import { jsx as y } from "react/jsx-runtime"; import { useRef as f, useState as B, useCallback as v, useEffect as w } from "react"; import { THUMBNAIL_MIN_WIDTH as _ } from "../../../utils/constants.js"; import { useLayoutContainer as I } from "../../../contexts/LayoutContainerContext.js"; const L = { "rp-thumbnail-dragger": "_rp-thumbnail-dragger_wfl8g_2", "rp-thumbnail-dragger-dragging": "_rp-thumbnail-dragger-dragging_wfl8g_19" }, R = { "rp-thumbnail-dragger": "_rp-thumbnail-dragger_1iiu0_1", "rp-thumbnail-dragger-dragging": "_rp-thumbnail-dragger-dragging_1iiu0_18" }, W = (s) => { s.preventDefault(), s.stopPropagation(); }, H = (s) => { const { onWidthChange: e, thumbnailRef: x, leftSidebarRef: E, isRPLayout: S } = s, i = f(null), M = f(0), c = f(null), [a, D] = B(_), { container: p } = I(), P = v((r) => { var u, l, m, o, g, d; W(r); const t = ((l = (u = i.current) == null ? void 0 : u.getBoundingClientRect()) == null ? void 0 : l.left) ?? 0, n = ((o = (m = x.current) == null ? void 0 : m.getBoundingClientRect()) == null ? void 0 : o.width) ?? 0; c.current = { x: t, y: 0 }, M.current = n, (g = i.current) == null || g.classList.add(L["rp-thumbnail-dragger-dragging"]), (d = i.current) == null || d.classList.add(R["rp-thumbnail-dragger-dragging"]); }, []), h = v((r) => { var t, n; W(r), c.current = null, (t = i.current) == null || t.classList.remove(L["rp-thumbnail-dragger-dragging"]), (n = i.current) == null || n.classList.remove(R["rp-thumbnail-dragger-dragging"]); }, []), b = v( (r) => { if (!c.current) return; const t = r.clientX - c.current.x, n = Math.max( _, Math.min(M.current + t, a) ); e == null || e(n), W(r); }, [e, a] ); return w(() => { if (!p) return; const r = new ResizeObserver(([t]) => { var o, g, d; const n = ((o = i.current) == null ? void 0 : o.offsetWidth) ?? 0, u = ((d = (g = E.current) == null ? void 0 : g.getBoundingClientRect()) == null ? void 0 : d.width) ?? 0, l = t.contentRect.width / 2, m = n + u; D(l - m); }); return r.observe(p), () => { r.disconnect(); }; }, [p, E]), w(() => { var t; (((t = x.current) == null ? void 0 : t.clientWidth) ?? _) > a && (e == null || e(a)); }, [a, e]), w(() => (window.addEventListener("pointermove", b), window.addEventListener("pointerup", h), () => { window.removeEventListener("pointermove", b), window.removeEventListener("pointerup", h); }), [b, h]), /* @__PURE__ */ y( "div", { ref: i, className: S ? R["rp-thumbnail-dragger"] : L["rp-thumbnail-dragger"], onPointerDown: P } ); }; export { H as RPSplitter };