@extclp/vexip-ui/es/directives/resize/index.mjs

A Vue 3 UI library, Highly customizability, full TypeScript, performance pretty good

import { useResize as _ } from "@vexip-ui/hooks";
import { throttle as f, noop as n } from "@vexip-ui/utils";
const { observeResize: l, unobserveResize: a } = _();
function u(e, o) {
  const r = typeof o.value == "function" ? { handler: o.value } : { ...o.value }, t = r.throttle || o.modifiers.throttle;
  if (e.__resize = {
    useThrottle: t,
    observed: !1
  }, r.disabled) {
    a(e), e.__resize.observed = !1;
    return;
  }
  const s = t ? f(r.handler, typeof t == "boolean" ? 16 : t) : r.handler;
  l(e, s), e.__resize.observed = !0;
}
const i = {
  mounted(e, o) {
    u(e, o);
  },
  updated(e, o) {
    if (!e.__resize) {
      u(e, o);
      return;
    }
    const r = typeof o.value == "function" ? { handler: o.value } : { ...o.value }, t = r.throttle || o.modifiers.throttle, s = () => t ? f(r.handler, typeof t == "boolean" ? 16 : t) : r.handler;
    if (r.disabled)
      e.__resize.observed && (a(e), e.__resize.observed = !1);
    else if (!e.__resize.observed)
      l(e, s()), e.__resize.observed = !0;
    else {
      const d = typeof o.oldValue == "function" ? { handler: o.oldValue } : { ...o.oldValue || { handler: n } };
      (t !== e.__resize.useThrottle || r.handler !== d.handler) && (a(e), l(e, s()));
    }
  },
  beforeUnmount(e) {
    var o;
    (o = e.__resize) != null && o.observed && a(e), delete e.__resize;
  }
};
export {
  i as vResize
};
//# sourceMappingURL=index.mjs.map