import { jsx as s } from "react/jsx-runtime";
import { forwardRef as H, useRef as c, useImperativeHandle as y, useLayoutEffect as L } from "react";
import g from "../../utils/classNames.js";
const N = H((d, l) => {
  const { className: m, children: r, ...u } = d, e = c(null), a = c(null);
  y(l, () => e.current, [e]), L(() => {
    const t = e.current?.parentNode;
    if (!(t instanceof HTMLElement))
      return;
    t.style.removeProperty("--ApplicationLayoutHeaderHeight");
    const f = window.requestAnimationFrame(() => {
      const o = a.current, h = o?.firstElementChild instanceof HTMLElement && Number.parseFloat(window.getComputedStyle(o.firstElementChild).borderBottomWidth) || 0, n = o?.offsetHeight ?? e.current?.offsetHeight, i = n ? Math.max(0, n - h) : 0;
      i && t.style.setProperty(
        "--ApplicationLayoutHeaderHeight",
        `${i}px`
      );
    });
    return () => window.cancelAnimationFrame(f);
  }, [r]);
  const p = g("ApplicationLayoutHeader", m);
  return /* @__PURE__ */ s("div", { ref: e, ...u, className: p, id: "ApplicationLayoutHeader", children: /* @__PURE__ */ s("div", { ref: a, className: "ApplicationLayoutHeaderContent", children: r }) });
});
export {
  N as default
};
//# sourceMappingURL=ApplicationLayoutHeader.js.map
