import { j as x } from "./jsx-runtime-OVHDjVDe.js";
import { useRef as l, useCallback as T, useState as N, isValidElement as v, Children as _, useLayoutEffect as z } from "react";
import { C as i } from "./css-D6ZBcSwh.js";
import { e as I, c as D } from "./types-BNX_Jj6k.js";
import { a as U } from "./Box-D5Qv__kr.js";
const ce = (e) => {
  const t = l(I(e)), n = T((u) => {
    t.current = D(u, t.current);
  }, []);
  return [t, n];
}, q = (e) => {
  const t = l(e);
  return t.current = e, t;
}, ie = (e) => {
  const t = l(!1), n = l(null);
  return t.current || (n.current = e(), t.current = !0), n;
}, O = (...e) => T(
  (t) => e.forEach((n) => {
    n != null && (typeof n == "function" ? n(t) : n.current = t);
  }, t),
  []
), le = (e) => {
  const t = l(null), [n, u] = N(() => {
    const c = I(e);
    return t.current = c, c;
  }), s = T((c) => {
    u((a) => (t.current = D(c, a), t.current));
  }, []);
  return [n, s, t];
}, ae = (e) => {
  const t = l(void 0), n = t.current;
  return t.current = e, n;
}, W = (e) => (
  // The hydrate props check lets us avoid considering Astro slots as valid react
  // elements.
  v(e) && !("hydrate" in e.props)
), B = "://", X = `https${B}`, G = (e, t = !1) => e == null ? e : t && !e.includes(B) ? X + e : e, Y = (e) => {
  if (_.count(e) !== 1) {
    const t = _.toArray(e).filter(
      (n) => typeof n != "boolean"
    );
    if (t.length !== 1) return !1;
    e = t[0];
  }
  return typeof e == "string" ? e.length === 1 : !!(W(e) && typeof e.props == "object" && e.props != null && !("children" in e.props) && !("role" in e.props));
}, F = (e, t, n, u, s) => t ?? (s != null || u === "link" ? "a" : n ?? e ?? "p"), L = ({
  level: e = "p",
  className: t,
  style: n,
  weight: u,
  defaultEl: s,
  el: c,
  variant: a,
  overflow: d,
  href: S,
  autoFormatHref: g,
  status: f,
  ...p
}) => /* @__PURE__ */ x.jsx(
  U,
  {
    direction: "x",
    el: F(e, c, s, a, S),
    style: { fontWeight: u, ...n },
    className: i(
      i.B("text"),
      a != null && i.BM("text", a),
      i.BM("text", e),
      d != null && i.BM("text", "overflow", d),
      f != null && i.M("status", f),
      t
    ),
    square: Y(p.children),
    gap: "small",
    href: G(S, g),
    ...p
  }
), R = (e) => {
  e != null && (e.style.display = "none", e.offsetHeight, e.style.display = "");
}, J = ["Escape", "Enter"], w = i.BM("text", "editable"), Q = 10, V = "renamed", j = "escaped", k = "start-editing", Z = (e, t) => {
  let n = 0;
  const u = () => {
    n++;
    const s = document.querySelector(`#${CSS.escape(e)}.${w}`);
    if (s == null || !s.classList.contains(w)) {
      if (n < Q) setTimeout(() => u(), 100);
      else throw new Error(`Could not find element with id ${e}`);
      return;
    }
    s.dispatchEvent(new Event(k)), s.setAttribute("contenteditable", "true"), t != null && (s.addEventListener(
      V,
      (c) => t(b(c.target), !0)
    ), s.addEventListener(
      j,
      (c) => t(b(c.target), !1)
    ));
  };
  u();
}, fe = (e) => new Promise((t) => {
  Z(e, (u, s) => t([u, s]));
}), b = (e) => e.innerText.trim(), ee = (e, t) => e == null || t == null ? !1 : e.maxInlineSize === t.maxInlineSize, te = ({
  onChange: e,
  value: t,
  className: n,
  useEditableState: u = N,
  allowDoubleClick: s = !0,
  onDoubleClick: c,
  allowEmpty: a = !1,
  style: d,
  outline: S = !0,
  ...g
}) => {
  const [f, p] = u(!1), o = l(null), M = q(t), y = l(d), A = l(t);
  (y.current != null && !ee(d, y.current) || t !== A.current) && (R(o.current), y.current = d, A.current = t);
  const h = (r) => {
    s && (p(!0), R(o.current)), c?.(r);
  }, C = (r, m = !1) => {
    const E = b(r);
    M.current === E && (E.length > 0 || a) || (m || E.length === 0 && !a ? (r.innerText = t, r.dispatchEvent(new Event(j))) : (e?.(E), M.current = E, r.dispatchEvent(new Event(V))));
  }, H = (r) => {
    if (o.current == null || (R(o.current), !f || !J.includes(r.key))) return;
    r.stopPropagation(), r.preventDefault();
    const m = o.current;
    o.current != null && (p(!1), C(m, r.key === "Escape"), m.blur());
  }, P = (r) => r.preventDefault();
  z(() => {
    if (o.current == null || !f) return;
    R(o.current);
    const { current: r } = o;
    r.focus();
    const m = document.createRange();
    m.selectNodeContents(r);
    const E = window.getSelection();
    E?.removeAllRanges(), E?.addRange(m);
  }, [f]), o.current !== null && !f && (o.current.innerHTML = t);
  const $ = T((r) => {
    r?.addEventListener(k, () => p(!0));
  }, []), K = O(o, $);
  return /* @__PURE__ */ x.jsx(
    L,
    {
      ref: K,
      className: i(
        n,
        i.BM("text", "editable"),
        S && i.M("outline")
      ),
      onBlur: () => {
        p(!1);
        const r = o.current;
        r != null && C(r);
      },
      onKeyDown: H,
      onKeyUp: P,
      onDoubleClick: h,
      contentEditable: f,
      suppressContentEditableWarning: !0,
      style: d,
      ...g,
      children: t
    }
  );
}, Ee = ({
  onChange: e,
  disabled: t = !1,
  value: n,
  allowDoubleClick: u,
  ...s
}) => t || e == null || e === !1 ? /* @__PURE__ */ x.jsx(L, { ...s, children: n }) : (e === !0 && (e = () => {
}), /* @__PURE__ */ x.jsx(
  te,
  {
    allowDoubleClick: u,
    onChange: e,
    value: n,
    ...s
  }
));
export {
  te as E,
  Ee as M,
  L as T,
  fe as a,
  ie as b,
  q as c,
  le as d,
  Z as e,
  O as f,
  ae as g,
  Y as i,
  R as t,
  ce as u
};
