// ═══════════════════════════════════════════════════════════════════
// ONTOLOGY KIT — the single visual language for the World-Model ontology.
// Every ontology-typed surface shares THIS, instead of re-declaring it:
//   · the Ontology Reference graph        (KnowledgeGraph.jsx)
//   · the per-project Knowledge Graph      (RaisableInstanceGraph · ConcreteGraph)
//   · the Entity Registry                  (EntityRegistry.jsx)
// window.ONTOLOGY (the Compass World Model) is the source of truth for a
// subject's category and glyph; the FALLBACK_* maps keep pages that do NOT
// load the ontology bundle (the C&C portal, the report-export page) rendering
// in the same language. Loaded right after Kit.jsx, before any consumer.
//
// The canonical palette: core = ink (entities), reified = accent (accent is
// reserved for reified relationships), content = ink-3, ref = ink-4 (dashed).
// ═══════════════════════════════════════════════════════════════════
(function () {
  const CAT_COLOR = { core: "var(--ink)", content: "var(--indigo)", reified: "var(--accent)", ref: "var(--ink-4)" };
  const CAT_ORDER = ["core", "content", "reified", "ref"];
  const CAT_LABEL = { core: "core subject", content: "content", reified: "reified edge", ref: "reference node" };
  // fallbacks mirror window.ONTOLOGY.SUBJECTS — used only when ONTOLOGY is absent
  const FALLBACK_CAT = { Company: "core", Project: "core", Asset: "core", Security: "core", Offering: "core", "Broker-Dealer": "core", Party: "core", Document: "content", Holding: "reified", Valuation: "reified", Exemption: "reified", Jurisdiction: "ref", Chain: "ref" };
  const FALLBACK_GLYPH = { Company: "◆", Project: "▣", Asset: "⬡", Security: "⬢", Offering: "◎", "Broker-Dealer": "▦", Party: "◐", Document: "▤", Jurisdiction: "⌖", Chain: "⬙", Holding: "⊟", Valuation: "◔", Exemption: "§" };

  const subjMeta = (of) => { const S = window.ONTOLOGY; return (S && S.subjMeta && S.subjMeta(of)) || null; };
  const subjCat = (of) => { const m = subjMeta(of); return (m && m.cat) || FALLBACK_CAT[of] || "core"; };
  const subjGlyph = (of) => { const m = subjMeta(of); return (m && m.glyph) || FALLBACK_GLYPH[of] || ""; };
  const subjColor = (of) => CAT_COLOR[subjCat(of)] || "var(--ink-4)";
  const catColor = (cat) => CAT_COLOR[cat] || "var(--ink-4)";
  const catLabel = (cat) => { const S = window.ONTOLOGY; const m = S && S.SUBJ_CATS && S.SUBJ_CATS[cat]; return (m && m.label) ? m.label.toLowerCase() : (CAT_LABEL[cat] || cat); };

  // a small category mark: filled square (core/content), accent diamond
  // (reified), dashed outline (ref). The shared legend + registry-rail swatch.
  function CatMark({ cat, size }) {
    const s = size || 9, c = catColor(cat);
    return <span style={{ width: s, height: s, flex: "0 0 auto", boxSizing: "border-box", borderRadius: cat === "reified" ? 0 : 2, transform: cat === "reified" ? "rotate(45deg)" : "none", background: cat === "ref" ? "transparent" : c, border: cat === "ref" ? "1.5px dashed " + c : "none" }}></span>;
  }

  // a horizontal legend of subject categories (+ optional at-risk entry).
  // `cats` defaults to all four in canonical order; pass a subset to show only
  // the categories present in a given graph.
  function CategoryLegend({ cats, risk, style }) {
    const items = (cats || CAT_ORDER).map((cat) => ({ key: cat, cat, lbl: catLabel(cat) }));
    return (
      <div style={{ display: "flex", gap: 14, flexWrap: "wrap", justifyContent: "center", ...style }}>
        {items.map((it) => (
          <span key={it.key} style={{ display: "inline-flex", alignItems: "center", gap: 6, fontFamily: "var(--mono)", fontSize: "9px", letterSpacing: "0.06em", textTransform: "uppercase", color: "var(--ink-4)" }}>
            <CatMark cat={it.cat}></CatMark>{it.lbl}
          </span>
        ))}
        {risk && (
          <span style={{ display: "inline-flex", alignItems: "center", gap: 6, fontFamily: "var(--mono)", fontSize: "9px", letterSpacing: "0.06em", textTransform: "uppercase", color: "var(--ink-4)" }}>
            <span style={{ width: 9, height: 9, borderRadius: 2, background: "var(--err)", flex: "0 0 auto" }}></span>at-risk · unverified
          </span>
        )}
      </div>
    );
  }

  window.OKit = { CAT_COLOR, CAT_ORDER, CAT_LABEL, FALLBACK_CAT, FALLBACK_GLYPH, subjMeta, subjCat, subjGlyph, subjColor, catColor, catLabel, CatMark, CategoryLegend };
})();