// === Shared layout primitives — used by index.html and any sub-pages
//     (blog, about, case study, etc.). Mounts nothing on its own.
const { useState: __useState, useEffect: __useEffect } = React;

// === ROUTING ===
// On home page (index.html), nav links point to #section anchors.
// On sub-pages, they link back to index.html#section.
function navHref(section) {
  const onHome = !/\/(blog|about|case|work)\.html?$/i.test(location.pathname);
  return onHome ? `#${section}` : `index.html#${section}`;
}

// === Smart fragment joiner used by H1 and H2 ===
function joinHeading(parts) {
  const textOf = (p) => (typeof p === "string" ? p : p.coral);
  return parts.map((p, i) => {
    const isStr = typeof p === "string";
    const me = textOf(p);
    const next = parts[i + 1];
    const nextText = next != null ? textOf(next) : "";
    const myEndsWithSpace = /\s$/.test(me);
    const nextStartsWithSpaceOrPunct = /^[\s.,!?;:)\]]/.test(nextText);
    const needSpace = next != null && !myEndsWithSpace && !nextStartsWithSpaceOrPunct;
    const node = isStr ? me : <span className="coral">{me}</span>;
    return (
      <React.Fragment key={i}>
        {node}{needSpace ? " " : ""}
      </React.Fragment>
    );
  });
}

function RichHeading({ parts, tag = "h2" }) {
  const Tag = tag;
  return <Tag>{joinHeading(parts)}</Tag>;
}

// === Scroll reveal helper ===
function useReveal() {
  __useEffect(() => {
    const io = new IntersectionObserver((entries) => {
      entries.forEach(e => {
        if (e.isIntersecting) {
          e.target.classList.add("in");
          io.unobserve(e.target);
        }
      });
    }, { rootMargin: "-10% 0px -10% 0px", threshold: 0.05 });
    document.querySelectorAll(".reveal").forEach(el => io.observe(el));
    return () => io.disconnect();
  }, []);
}

// === Lang storage helpers ===
function getStoredLang() {
  try { return localStorage.getItem('airchip_lang') || 'en'; }
  catch { return 'en'; }
}
function setStoredLang(l) {
  try { localStorage.setItem('airchip_lang', l); } catch {}
}

// === Nav (shared) ===
function Nav({ t, page = "home", lang = "tr", onLang }) {
  const [scrolled, setScrolled] = __useState(false);
  __useEffect(() => {
    const onScroll = () => setScrolled(window.scrollY > 8);
    onScroll();
    window.addEventListener("scroll", onScroll, { passive: true });
    return () => window.removeEventListener("scroll", onScroll);
  }, []);
  const switchLang = (next) => {
    if (next === lang) return;
    setStoredLang(next);
    if (onLang) onLang(next);
    else location.reload();
  };
  return (
    <nav className={"nav" + (scrolled ? " scrolled" : "")}>
      <div className="wrap nav-inner">
        <a href="index.html" className="brand">
          <img src="assets/airchip-mark.png" alt="Airchip" />
          <span>Airchip</span>
        </a>
        <div className="nav-links">
          <a href={navHref("services")}>{t.nav.services}</a>
          <a href={navHref("process")}>{t.nav.process}</a>
          <a href={navHref("tech")}>{t.nav.tech}</a>
          <a href={navHref("contact")}>{t.nav.contact}</a>
        </div>
        <div className="nav-right">
          <div className="lang-toggle" role="group" aria-label="Language">
            <button type="button" aria-pressed={lang === "tr"} onClick={() => switchLang("tr")}>TR</button>
            <span className="lang-sep">·</span>
            <button type="button" aria-pressed={lang === "en"} onClick={() => switchLang("en")}>EN</button>
          </div>
          <a href={navHref("contact")} className="nav-cta">
            {t.nav.cta} <Icon.Arrow />
          </a>
        </div>
      </div>
    </nav>
  );
}

// === Footer (shared) ===
function Footer({ lang }) {
  return (
    <footer className="footer">
      <div className="wrap footer-inner">
        <div className="brand">
          <img src="assets/airchip-mark.png" alt="" style={{ width: 24, height: 24, display: "inline-block", verticalAlign: "middle", marginRight: 8 }}/>
          Airchip
        </div>
        <div className="small">
          © {new Date().getFullYear()} Airchip Teknoloji · Türkiye
        </div>
        <div className="small">v 2026.05 · {(lang || "tr").toUpperCase()}</div>
      </div>
    </footer>
  );
}

// === Apply theme/scheme attrs (used by every page that loads shared.jsx) ===
function applyAppearance(t) {
  document.documentElement.setAttribute("data-theme", t.theme);
  document.documentElement.setAttribute("data-scheme", t.scheme);
  document.documentElement.setAttribute("lang", t.lang === "en" ? "en" : "tr");
}

Object.assign(window, {
  navHref, joinHeading, RichHeading, useReveal,
  Nav, Footer, applyAppearance,
  getStoredLang, setStoredLang,
});