@scalar/api-client/dist/v2/components/resize/Resize.vue2.js

the open source API testing client

import { defineComponent as f, ref as v, createElementBlock as h, openBlock as g, normalizeStyle as p, renderSlot as w, createElementVNode as E } from "vue";
const l = "scalar-dragging", D = /* @__PURE__ */ f({
  __name: "Resize",
  props: {
    width: {}
  },
  emits: ["update:width"],
  setup(n, { emit: m }) {
    const s = m, o = v(!1), r = (t) => {
      t.preventDefault();
      const d = t.clientX, c = n.width, a = (u) => {
        o.value = !0, document.body.classList.add(l);
        let e = c + u.clientX - d;
        e > 420 && (e = 420 + (e - 420) * 0.2), e < 240 && (e = 240), s("update:width", e);
      }, i = () => {
        o.value = !1, document.body.classList.remove(l), document.documentElement.removeEventListener("mousemove", a, !1), document.documentElement.removeEventListener("mouseup", i, !1), n.width > 420 ? s("update:width", 360) : n.width < 240 && s("update:width", 240);
      };
      document.documentElement.addEventListener("mousemove", a, !1), document.documentElement.addEventListener("mouseup", i, !1);
    };
    return (t, d) => (g(), h("div", {
      class: "relative",
      style: p({
        width: `${t.width}px`
      })
    }, [
      w(t.$slots, "default", {}, void 0, !0),
      E("div", {
        class: "resizer",
        onMousedown: r
      }, null, 32)
    ], 4));
  }
});
export {
  D as default
};