md-editor-rt/lib/es/chunks/index4.mjs

Markdown editor for react, developed in jsx and typescript, dark theme、beautify content by prettier、render articles directly、paste or clip the picture and upload it...

import { jsx as p, jsxs as _, Fragment as j } from "react/jsx-runtime";
import { memo as q, useState as A, useRef as c, useCallback as h, cloneElement as B, useEffect as D } from "react";
import { p as E } from "./config.mjs";
const x = `${E}-dropdown-hidden`, F = (n) => {
  const { relative: v = "html", onChange: i, disabled: t } = n, [H, f] = A({
    overlayClass: x,
    overlayStyle: {}
  }), o = c({
    triggerHover: !1,
    overlayHover: !1
  }), a = c(null), d = c(null), u = h(() => {
    if (t)
      return !1;
    o.current.triggerHover = !0;
    const e = a.current, r = d.current;
    if (!e || !r)
      return;
    const S = e.getBoundingClientRect(), T = e.offsetTop, b = e.offsetLeft, $ = S.height, k = S.width, w = e.getRootNode(), y = w.querySelector(v)?.scrollLeft || 0, C = w.querySelector(v)?.clientWidth || 0;
    let l = b - r.offsetWidth / 2 + k / 2 - y;
    l + r.offsetWidth > y + C && (l = y + C - r.offsetWidth), l < 0 && (l = 0), f((I) => ({
      ...I,
      overlayStyle: {
        insetBlockStart: T + $ + "px",
        insetInlineStart: l + "px"
      }
    })), i(!0);
  }, [t, i, v]), g = h(() => {
    if (t)
      return !1;
    o.current.overlayHover = !0;
  }, [t]), L = c(-1), s = h(
    (e) => {
      if (t)
        return !1;
      a.current?.contains(e.target) ? o.current.triggerHover = !1 : o.current.overlayHover = !1, clearTimeout(L.current), L.current = window.setTimeout(() => {
        !o.current.overlayHover && !o.current.triggerHover && i(!1);
      }, 10);
    },
    [t, i]
  ), W = n.children, m = n.overlay, N = B(W, {
    ref: a,
    key: "cloned-dropdown-trigger"
  });
  D(() => {
    n.visible ? f((e) => ({
      ...e,
      overlayClass: ""
    })) : f((e) => ({
      ...e,
      overlayClass: x
    }));
  }, [n.visible]), D(() => {
    const e = a.current, r = d.current;
    return e?.addEventListener("mouseenter", u), e?.addEventListener("mouseleave", s), r?.addEventListener("mouseenter", g), r?.addEventListener("mouseleave", s), () => {
      e?.removeEventListener("mouseenter", u), e?.removeEventListener("mouseleave", s), r?.removeEventListener("mouseenter", g), r?.removeEventListener("mouseleave", s);
    };
  }, [s, g, u]);
  const R = /* @__PURE__ */ p(
    "div",
    {
      className: `${E}-dropdown ${H.overlayClass}`,
      style: H.overlayStyle,
      ref: d,
      children: /* @__PURE__ */ p("div", { className: `${E}-dropdown-overlay`, children: m instanceof Array ? m[0] : m })
    }
  );
  return /* @__PURE__ */ _(j, { children: [
    N,
    R
  ] });
}, J = q(F);
export {
  J as D
};