(function () {
// Personal portfolio — seamless name morph.
// A fixed name text element that scales + travels from the hero position
// to the nav slot, driven by scroll.

function MorphName() {
  const textRef = React.useRef(null);
  // Nav drops #ft-nav-namedock on mobile (no room to spare) — the morph has no
  // target there, so skip it entirely rather than leaving the clone stranded
  // at its default (0,0) position. Same flag Hero/Nav/Footer use, so this stays
  // in sync with the moment Nav actually mounts/unmounts the target element.
  const [narrow, setNarrow] = React.useState(() => window.innerWidth < 768);
  React.useEffect(() => {
    const mq = window.matchMedia("(max-width: 767px)");
    const fn = e => setNarrow(e.matches);
    mq.addEventListener("change", fn);
    return () => mq.removeEventListener("change", fn);
  }, []);
  React.useEffect(() => {
    if (narrow) return;
    const scroller = document.querySelector("#ft-scroll");
    const heroEl = document.querySelector("#ft-hero-name");
    const dockEl = document.querySelector("#ft-nav-namedock");
    const textEl = textRef.current;
    if (!heroEl || !dockEl || !textEl) return;
    heroEl.style.visibility = "hidden";
    let textStart = {},
      textEnd = {};
    let dock = 1,
      textRatio = 0.2,
      startOffset = 0;
    const sTop = () => scroller ? scroller.scrollTop : window.scrollY;
    const measure = () => {
      const top = sTop();
      const hr = heroEl.getBoundingClientRect();
      const dr = dockEl.getBoundingClientRect();
      const heroFS = parseFloat(getComputedStyle(heroEl).fontSize);
      const dockFS = parseFloat(getComputedStyle(dockEl).fontSize);
      textEl.style.fontSize = heroFS + "px";
      textRatio = dockFS / heroFS;
      textStart = {
        left: hr.left,
        top: hr.top + top
      };
      textEnd = {
        left: dr.left,
        top: dr.top
      };
      dock = Math.max(1, textStart.top - textEnd.top);
      startOffset = Math.max(0, dock - 120);
    };
    const apply = () => {
      const top = sTop();
      const denom = Math.max(1, dock - startOffset);
      const p = Math.max(0, Math.min(1, (top - startOffset) / denom));
      const curHeroTop = textStart.top - top;
      const tx = textStart.left + (textEnd.left - textStart.left) * p;
      const ty = curHeroTop + (textEnd.top - curHeroTop) * p;
      const ts = 1 + (textRatio - 1) * p;
      textEl.style.transform = "translate(" + tx + "px," + ty + "px) scale(" + ts + ")";
    };
    const run = () => {
      measure();
      apply();
    };
    run();
    if (document.fonts && document.fonts.ready) document.fonts.ready.then(run);
    setTimeout(run, 350);
    const onScroll = () => apply();
    const target = scroller || window;
    target.addEventListener("scroll", onScroll, {
      passive: true
    });
    window.addEventListener("resize", run);
    return () => {
      target.removeEventListener("scroll", onScroll);
      window.removeEventListener("resize", run);
      heroEl.style.visibility = "";
    };
  }, [narrow]);
  return /*#__PURE__*/React.createElement("div", {
    ref: textRef,
    "aria-hidden": "true",
    style: {
      position: "fixed",
      left: 0,
      top: 0,
      transformOrigin: "top left",
      zIndex: 55,
      fontFamily: "var(--font-display)",
      fontWeight: 500,
      letterSpacing: "-0.03em",
      color: "var(--text-strong)",
      lineHeight: 1,
      whiteSpace: "nowrap",
      pointerEvents: "none",
      display: narrow ? "none" : "block"
    }
  }, "Smit Waghela");
}
window.MorphName = MorphName;
})();
