import a from "../../../../../_virtual/interact.min.js";
import { useRef as l, useEffect as c } from "react";
import d from "../../../../sdk/dist/shared/utils/invariant.js";
import { useDraftHelpers as m } from "../../../../../use-page-data.js";
function y(o) {
  const r = l(null), i = m();
  c(() => {
    const e = document.getElementById(o.id);
    return d(e, "Section element not found"), r.current = a(`#${o.id}`), r.current.resizable({
      edges: {
        top: !1,
        left: !1,
        bottom: ".section-resizable-handle",
        right: !1
      },
      inertia: !0,
      autoScroll: !1,
      listeners: {
        start: (t) => {
          t.stopPropagation();
        },
        move: (t) => {
          t.stopPropagation();
          const s = (e.dataset.h ? parseFloat(e.dataset.h) : e.offsetHeight) + t.delta.y;
          requestAnimationFrame(() => {
            Object.assign(e.style, {
              minHeight: `${s}px`,
              // maxHeight: `${newHeight}px`,
              flex: "none"
            });
          }), Object.assign(e.dataset, { h: s });
        },
        end: (t) => {
          const n = `${parseFloat(e.dataset.h).toFixed(0)}px`;
          e.style.removeProperty("minHeight"), e.style.removeProperty("height"), e.style.removeProperty("maxHeight"), e.style.removeProperty("flex"), e.dataset.h = "", console.log("Resized section", o.id, "to height", n), i.updateSectionProps(o.id, {
            minHeight: n
          });
        }
      }
    }).on("resizeend", function() {
      window.addEventListener("click", (t) => t.stopImmediatePropagation(), {
        capture: !0,
        once: !0
      });
    }), () => {
      r.current?.unset(), r.current = null;
    };
  }, []);
}
export {
  y as useResizableSection
};
//# sourceMappingURL=use-resizable-section.js.map
