/* blocks.jsx — Helpers + all sections in terminal/IDE style. ────────────────────────────────────────────────────────── */ /* ─── Reusable Block wrapper ─── */ function Block({ id, num, children }) { return (
{num}
❯
{children}
); } function CmdLine({ cmd, flags = [], args = [], comment }) { return (
ulaskara @ studio ❯ {cmd} {flags.map((f, i) => {f})} {args.map((a, i) => {a})} {comment && {comment}}
); } /* ─── Reveal observer ─── */ function useReveal() { React.useEffect(() => { const els = document.querySelectorAll(".reveal"); if (!("IntersectionObserver" in window)) { els.forEach((el) => el.classList.add("in")); return; } const io = new IntersectionObserver( (entries) => entries.forEach((e) => { if (e.isIntersecting) { e.target.classList.add("in"); io.unobserve(e.target); } }), { threshold: 0.08, rootMargin: "0px 0px -6% 0px" } ); els.forEach((el) => io.observe(el)); return () => io.disconnect(); }); } /* ─── useActiveSection — tracks which block is in view ─── */ function useActiveSection(ids) { const [active, setActive] = React.useState(ids[0]); React.useEffect(() => { function update() { const yMid = window.innerHeight * 0.3; let best = ids[0], bestDist = Infinity; ids.forEach((id) => { const el = document.getElementById(id); if (!el) return; const rect = el.getBoundingClientRect(); const dist = Math.abs(rect.top - yMid); if (rect.top - yMid <= 0 && dist < bestDist) { bestDist = dist; best = id; } }); setActive(best); } update(); window.addEventListener("scroll", update, { passive: true }); return () => window.removeEventListener("scroll", update); }, [ids.join(",")]); return active; } /* ─── Animated counter ─── */ function Counter({ target, suffix = "" }) { const [val, setVal] = React.useState(0); const ref = React.useRef(null); React.useEffect(() => { const el = ref.current; if (!el) return; let started = false; const io = new IntersectionObserver((entries) => { entries.forEach((e) => { if (e.isIntersecting && !started) { started = true; const dur = 1300; const start = performance.now(); function tick(now) { const p = Math.min(1, (now - start) / dur); const e2 = p === 1 ? 1 : 1 - Math.pow(2, -10 * p); setVal(Math.round(target * e2)); if (p < 1) requestAnimationFrame(tick); } requestAnimationFrame(tick); } }); }, { threshold: 0.4 }); io.observe(el); return () => io.disconnect(); }, [target]); return {val}{suffix && {suffix}}; } /* ─── HERO ─── */ function Hero({ t, lang }) { return (

Ömer Ulaş Kara .

{t.lines.map((line, i) => (
{line.k} = {renderValue(line.v)}
))}
{t.done}

{t.positioning_pre} {t.positioning_em}{t.positioning_post}

cd ./projects → mailto: contact → gh repo open ↗
); } /* Token-color strings: highlight inline `code`, e.g. URLs, names */ function renderValue(text) { if (typeof text !== "string") return text; // very light highlighting: anything with dots/slashes shows as string const parts = text.split(/(\S+\.\S+|\b\d{1,4}\b|true|false)/g); return parts.map((p, i) => { if (!p) return null; if (/^\d+$/.test(p)) return {p}; if (p === "true" || p === "false") return {p}; if (/\S+\.\S+/.test(p) && p.indexOf("·") < 0 && p.indexOf(" ") < 0) { return {p}; } return {p}; }); } /* ─── STATS ─── */ function Stats({ t }) { return (
{t.items.map((s, i) => (
{s.label}
{s.sub}
))}
); } /* ─── DOMAINS ─── */ function Domains({ t }) { return (
{"{"}
{t.items.map((d, i) => (
"{d.num}_{d.title_pre.toLowerCase().replace(/\s+/g, "_")}" :
{"{"}
"title": "{d.title_pre} {d.title_em}",
"category": "{d.sub}",
{d.body}
"stack": [
{d.tags.map((tag, j) => "{tag}"{j < d.tags.length - 1 ? "," : ""})}
]
{"}"}{i < t.items.length - 1 ? "," : ""}
))}
{"}"}
 ); } /* ─── STACK ─── */ function Stack({ t }) { return (
{"{"}
{t.rows.map((row, i) => (
{row.num} "{row.cat.toLowerCase().replace(/[\s/]+/g, "_")}" : [ {row.cat}
{row.items.map((item, j) => ( "{item[0]}"{item[1] ? ` (${item[1]})` : ""}{j < row.items.length - 1 ? "," : ""} ))}
]{i < t.rows.length - 1 ? "," : ""}
))}
{"}"}
 ); } /* ─── ARCHITECTURE — ASCII tree ─── */ function Architecture({ t }) { const layers = t.layers; return ( 
{`architecture/
│
`}{layers.map((layer, i) => {
  const last = i === layers.length - 1;
  const branch = last ? "└──" : "├──";
  const childPrefix = last ? "    " : "│   ";
  const items = layer.items;
  return (
    
      {branch} {layer.label}/{"\n"}
      {items.map((it, j) => {
        const isLast = j === items.length - 1;
        const subBranch = isLast ? "└──" : "├──";
        return (
          
            {childPrefix}{subBranch} 
            {it}{"\n"}
          
        );
      })}
      {!last && │{"\n"}}
    
  );
})}
); } /* ─── SECURITY — YAML ─── */ function Security({ t }) { return (
# {t.lede}
{t.items.map((s, i) => (
-
{s.title.toLowerCase().replace(/[\s+/]+/g, "_")} : "{s.title}"
{s.body}
))}
); } /* ─── REPOS — gh repo list output ─── */ function Repos({ t }) { return ( {t.clusters.map((cluster, ci) => (
# {cluster.name} {cluster.count}
{cluster.repos.map((r, ri) => (
{r.name} {r.desc} {r.priv === "public" ? "● public" : "○ private"}
{r.stack.map((s, si) => {s})}
))}
))} ); } /* ─── CONTACT — vCard ─── */ function Contact({ t, lang }) { return (
FN: Ömer Ulaş Kara
TITLE: Senior Full-Stack Developer
ADR: İstanbul, Türkiye
{t.channels.map((c, i) => (
{c.label.toUpperCase()}: {c.value}
))}
# {t.lede}
{t.footer_left} · {t.footer_right}
ulaskara @ studio ❯ {lang === "tr" ? "# end of session — komut bekleniyor" : "# end of session — awaiting command"}
); } Object.assign(window, { Block, CmdLine, useReveal, useActiveSection, Counter, Hero, Stats, Domains, Stack, Architecture, Security, Repos, Contact, });