Add docs for conversations 2.0

site/api/active_module.ts

@@ -0,0 +1,5 @@
+export let ACTIVE_MODULE = "";
+
+export function setActiveModule(slug: string) {
+  ACTIVE_MODULE = slug.toLowerCase();
+}

site/api/api_gen.tsx

@@ -20,6 +20,7 @@ import { TypeAlias } from "./components/TypeAlias.tsx";
 import { Overview } from "./components/Overview.tsx";
 import links from "./external_links.ts";
 import { Ref } from "./types.ts";
+import { setActiveModule } from "./active_module.ts";
 
 const out = Deno.args[0];
 if (!out) throw new Error("no out!");
@@ -98,6 +99,7 @@ function createDoc(
   overloadCount?: number,
   overloads?: DocNodeFunction[],
 ) {
+  setActiveModule(slug);
   const nav =
     `<div><sup><a href="/ref/">ref</a> / <a href="/ref/${slug.toLowerCase()}/">${
       slug.replaceAll("/", " / ")

site/api/components/Indexes.tsx

@@ -0,0 +1,70 @@
+import {
+  InterfaceIndexSignatureDef,
+  ParamIdentifierDef,
+} from "deno_doc/types.d.ts";
+import { PropertyName } from "./PropertyName.tsx";
+import { TsType } from "./TsType.tsx";
+import { LinkGetter } from "./types.ts";
+import { H3 } from "./H3.tsx";
+import { CodeBlock } from "./CodeBlock.tsx";
+import { P } from "./P.tsx";
+import { StyleKw } from "./styles.tsx";
+import { Loc } from "./Loc.tsx";
+
+export function Indexes({
+  getLink,
+  children: i,
+}: {
+  getLink: LinkGetter;
+  children: InterfaceIndexSignatureDef[];
+}) {
+  return (
+    <>
+      {i.filter((v) =>
+        "accessiblity" in v ? v.accessiblity !== "private" : true
+      )
+        .map((v) => (
+          <>
+            <H3>
+              [{(v.params[0] as ParamIdentifierDef).name}:{" "}
+              {v.params[0].tsType?.repr}]
+            </H3>
+            <CodeBlock>
+              {"isStatic" in v && v.isStatic && <StyleKw>{"static "}</StyleKw>}
+              {"isAbstract" in v && v.isAbstract && (
+                <StyleKw>{"abstract "}</StyleKw>
+              )}
+              {v.readonly && <StyleKw>{"readonly "}</StyleKw>}
+              <PropertyName hasType={!!v.tsType} class>
+                {{
+                  raw: (
+                    <>
+                      [{(v.params[0] as ParamIdentifierDef).name}
+                      {v.params[0].tsType && (
+                        <>
+                          :{" "}
+                          <TsType getLink={getLink}>
+                            {v.params[0].tsType}
+                          </TsType>
+                        </>
+                      )}]
+                    </>
+                  ),
+                }}
+              </PropertyName>
+              {v.tsType && (
+                <>
+                  {" "}
+                  <TsType getLink={getLink}>{v.tsType}</TsType>
+                </>
+              )};
+            </CodeBlock>
+            {/* @ts-ignore: it works */}
+            {"jsDoc" in v && <P doc>{v.jsDoc}</P>}
+            {/* @ts-ignore: this works too */}
+            <Loc>{v}</Loc>
+          </>
+        ))}
+    </>
+  );
+}

site/api/components/Interface.tsx

@@ -9,6 +9,7 @@ import { CodeBlock } from "./CodeBlock.tsx";
 import { TsType } from "./TsType.tsx";
 import { ToC } from "./ToC.tsx";
 import { Method } from "./Class/Method.tsx";
+import { Indexes } from "./Indexes.tsx";
 
 export function Interface(
   { children: iface, getLink, namespace }: {
@@ -19,6 +20,7 @@ export function Interface(
 ) {
   const props = iface.interfaceDef.properties;
   const methods = iface.interfaceDef.methods;
+  const indexes = iface.interfaceDef.indexSignatures;
   const methodNameSet = new Set<string>(); // to prevent duplicates
 
   const getMethodOverloads = (name: string) => {
@@ -43,6 +45,9 @@ export function Interface(
       <Sector title="Properties" show={!!props.length}>
         <Properties getLink={getLink}>{props}</Properties>
       </Sector>
+      <Sector title="Indexes" show={!!indexes.length}>
+        <Indexes getLink={getLink}>{indexes}</Indexes>
+      </Sector>
       <Sector title="Methods" show={!!methods.length}>
         {methods
           .filter((v) => {

site/api/components/P.tsx

@@ -1,4 +1,6 @@
 import { ComponentChildren } from "preact";
+import { replaceModuleSymbolLinks } from "./util.ts";
+import { ACTIVE_MODULE } from "../active_module.ts";
 
 export function P(
   props: { children?: ComponentChildren; doc?: false; html?: true } | {
@@ -28,6 +30,7 @@ export function P(
     props.children = newParts
       .join("")
       .replaceAll("```ts", "```ts:no-line-numbers");
+    props.children = replaceModuleSymbolLinks(props.children, ACTIVE_MODULE);
     return (
       <>
         {"\n\n"}

site/api/components/PropertyName.tsx

@@ -1,16 +1,18 @@
 export function PropertyName({
-  children: { name, optional },
+  children,
   hasType,
   "class": klass,
 }: {
-  children: { name: string; optional: boolean };
+  // deno-lint-ignore no-explicit-any
+  children: { name: string; optional: boolean } | { raw: any };
   hasType: boolean;
   class?: true;
 }) {
+  const optional = "raw" in children ? false : children.optional;
   return (
     <>
       <span style={klass ? "" : "--shiki-light:#24292E;--shiki-dark:#E1E4E8;"}>
-        {name}
+        {"raw" in children ? children.raw : children.name}
       </span>
       {(optional || hasType) && (
         <span style="--shiki-light:#24292E;--shiki-dark:#E1E4E8;">

site/api/components/TsType.tsx

@@ -677,9 +677,16 @@ function ParamArray({
   optional: boolean;
   getLink: LinkGetter;
 }) {
+  const elements = param.elements.map((e) =>
+    e && <Param getLink={getLink}>{e}</Param>
+  );
+  let elementsElement: JSX.Element | undefined;
+  if (elements.length) {
+    elementsElement = elements.reduce((a, b) => <>{a}, {b}</>);
+  }
   return (
     <>
-      [{param.elements.map((e) => e && <Param getLink={getLink}>{e}</Param>)}]
+      [{elementsElement || elements}]
       {param.optional || optional ? "?" : ""}
       {param.tsType && (
         <>

site/api/components/util.ts

@@ -14,3 +14,74 @@ export function newGetLink(
     return l;
   };
 }
+
+export function replaceModuleSymbolLinks(text: string, module_: string) {
+  return replaceSymbolLinks(text, (match) => {
+    const [symbol, anchor] = match.split(".");
+    let href = `/ref/${module_}/${symbol}`;
+    if (anchor) {
+      href += `#${anchor}`;
+    }
+    href = href.toLowerCase();
+    return `[${match}](${href})`;
+  });
+}
+function replaceSymbolLinks(
+  text: string,
+  replacer: (string: string) => string,
+) {
+  let newText = "";
+  let stackActive = false;
+  let stackExpects: "keyword" | "value" = "keyword";
+  let stack = new Array<string>();
+  let value = "";
+
+  const flushStack = () => {
+    stackExpects = "keyword";
+    stackActive = false;
+    value = "";
+    for (const item of stack) {
+      newText += item;
+    }
+    stack = [];
+  };
+
+  for (let i = 0; i < text.length; ++i) {
+    const char = text[i];
+    const prevChar = text[i - 1] || "";
+    if (char == "{" && prevChar != "\\") {
+      stackActive = true;
+      stack.push(char);
+      continue;
+    }
+    if (stackActive) {
+      stack.push(char);
+    } else {
+      newText += char;
+    }
+    if (stackActive && stackExpects == "keyword") {
+      if (/\s/.test(char)) {
+        continue;
+      }
+      if (text.slice(i, i + "@link ".length) != "@link ") {
+        flushStack();
+      } else {
+        stackExpects = "value";
+        i += "@link ".length - 1;
+        continue;
+      }
+    }
+    if (stackExpects == "value" && char == "}" && prevChar != "\\") {
+      value = value.trim();
+      newText += replacer(value);
+      stack = [];
+      flushStack();
+      continue;
+    }
+    if (stackExpects == "value") {
+      value += char;
+    }
+  }
+
+  return newText;
+}