@t8/docsgen 0.1.3 → 0.1.5

package/dist/bin.js

@@ -225,6 +225,27 @@ ym(${ymid}, "init", {clickmap: true, trackLinks: true, accurateTrackBounce: true
         `.trim();
 }
 
+// src/bin/getIcon.ts
+var iconTypeMap = {
+  ico: "image/x-icon",
+  svg: "image/svg+xml",
+  png: "image/png",
+  gif: "image/gif",
+  jpg: "image/jpeg",
+  jpeg: "image/jpeg"
+};
+function getIcon({ favicon, faviconType }) {
+  let icon = {
+    url: favicon,
+    type: faviconType
+  };
+  if (icon.url && !icon.type) {
+    let ext = icon.url.split("/").at(-1)?.split(".").at(-1)?.toLowerCase();
+    if (ext) icon.type = iconTypeMap[ext];
+  }
+  return icon;
+}
+
 // src/bin/getNav.ts
 var import_jsdom = require("jsdom");
 
@@ -269,19 +290,22 @@ async function getNav(ctx, navItems) {
     }
   }
   if (!s && !navContent) return "";
-  let repoLink = getRepoLink(ctx);
   s = s.trim() ? `<section><ul>${s}
 </ul></section>` : "";
-  s = `${s}
+  let repoLink = getRepoLink(ctx);
+  let refContent = "";
+  if (repoLink || backstory)
+    refContent = `
 <section class="ref">
   <ul>
-    <li>${repoLink}</li>
+    ${repoLink ? `<li>${repoLink}</li>` : ""}
     ${backstory ? `<li><a href="${backstory}">Backstory</a></li>` : ""}
   </ul>
 </section>
-${navContent}`;
+`;
   return `<nav>
-${s}
+${s}${refContent}
+${navContent}
 </nav>`;
 }
 
@@ -300,6 +324,16 @@ function getSlug(title) {
   return slug;
 }
 
+// src/bin/getSource.ts
+function getSource(ctx) {
+  let { source, repo, mainBranch = "main" } = ctx;
+  if (source) return source;
+  let ghId = repo?.startsWith("https://github.com/") ? repo.replace("https://github.com/", "").split("/").slice(0, 2).join("/") : "";
+  if (ghId)
+    return `https://raw.githubusercontent.com/${ghId}/refs/heads/${mainBranch}/README.md`;
+  return "README.md";
+}
+
 // src/bin/getParsedContent.ts
 var md = new import_markdown_it.default({
   html: true
@@ -370,8 +404,8 @@ function getSectionPostprocess(linkMap) {
   };
 }
 async function getParsedContent(ctx) {
-  let { source = "README.md", singlePage } = ctx;
-  let content = md.render(await fetchText(source));
+  let { singlePage } = ctx;
+  let content = md.render(await fetchText(getSource(ctx)));
   let dom = new import_jsdom2.JSDOM(content);
   let { nav, linkMap } = buildNav(ctx, dom);
   let badges = [];
@@ -433,13 +467,12 @@ async function getParsedContent(ctx) {
 
 // src/bin/getTitle.ts
 function getTitle(ctx, { cover, originalContent, withPackageURL } = {}) {
-  let { root, name, title: packageTitle, scope, theme } = ctx;
+  let { root, name, title: packageTitle, htmlTitle, scope } = ctx;
   if (originalContent && ![name, packageTitle].includes(originalContent.trim()))
     return originalContent;
+  if (cover && htmlTitle) return htmlTitle;
   if (packageTitle) {
     let escapedTitle = escapeHTML(packageTitle);
-    if (cover && theme === "t8" && packageTitle.startsWith("T8 "))
-      return `<a href="/">T8</a> <span class="name">${packageTitle.replace(/^T8 /, "")}</span>`;
     return withPackageURL ? `<a href="${root}" class="name">${escapedTitle}</a>` : `<span class="name">${escapedTitle}</span>`;
   }
   let scopeMatches = name?.match(/^(@[^/]+)\/?(.*)/);
@@ -479,18 +512,11 @@ async function setContent(ctx) {
   let packageVersion = (await exec(`npm view ${packageName} version`)).stdout.trim().split(".").slice(0, 2).join(".");
   let packageUrl = `https://unpkg.com/${packageName}@${packageVersion}`;
   let rootAttrs = "";
-  let icon = {
-    url: `${root}favicon.svg`,
-    type: "image/svg+xml"
-  };
   if (theme) rootAttrs += ` data-theme="${escapeHTML(theme)}"`;
   if (colorScheme)
     rootAttrs += ` style="--color-scheme: ${escapeHTML(colorScheme)}"`;
-  if (theme === "t8")
-    icon = {
-      url: "/assets/t8.png",
-      type: "image/png"
-    };
+  let icon = getIcon(ctx);
+  let iconTag = icon.url ? `<link rel="icon"${icon.type ? ` type="${icon.type}"` : ""} href="${icon.url}">` : "";
   if (redirect) {
     let escapedRedirect = escapeHTML(redirect);
     await (0, import_promises4.writeFile)(
@@ -502,6 +528,7 @@ async function setContent(ctx) {
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <meta http-equiv="refresh" content="0; URL=${escapedRedirect}">
+  ${iconTag}
 </head>
 <body>
 ${counterContent}
@@ -533,14 +560,14 @@ ${counterContent}
 <!DOCTYPE html>
 <html lang="en"${rootAttrs}>
 <head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapeHTML(nav[i]?.title)} | ${escapedTitle}</title>
-<link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-<link rel="stylesheet" href="${packageUrl}/dist/css/section.css">
-<link rel="icon" type="${icon.type}" href="${icon.url}">
-${nav[i + 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i + 1]?.id}">` : ""}
-${nav[i - 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i - 1]?.id}">` : ""}
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>${escapeHTML(nav[i]?.title)} | ${escapedTitle}</title>
+  <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
+  <link rel="stylesheet" href="${packageUrl}/dist/css/section.css">
+  ${iconTag}
+  ${nav[i + 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i + 1]?.id}">` : ""}
+  ${nav[i - 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i - 1]?.id}">` : ""}
 </head>
 <body>
 <div class="layout">
@@ -586,14 +613,14 @@ ${counterContent}
 <!DOCTYPE html>
 <html lang="en"${rootAttrs}>
 <head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapedTitle}${packageDescription ? ` | ${escapeHTML(packageDescription)}` : ""}</title>
-<link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-<link rel="stylesheet" href="${packageUrl}/dist/css/index.css">
-<link rel="icon" type="${icon.type}" href="${icon.url}">
-<link rel="prefetch" href="${root}start">
-${nav[0] ? `<link rel="prefetch" href="${root}${contentDir}/${nav[0]?.id ?? ""}">` : ""}
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>${escapedTitle}${packageDescription ? ` | ${escapeHTML(packageDescription)}` : ""}</title>
+  <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
+  <link rel="stylesheet" href="${packageUrl}/dist/css/index.css">
+  ${iconTag}
+  <link rel="prefetch" href="${root}start">
+  ${nav[0] ? `<link rel="prefetch" href="${root}${contentDir}/${nav[0]?.id ?? ""}">` : ""}
 </head>
 <body>
 <div class="layout">
@@ -647,7 +674,7 @@ ${counterContent}
   <meta http-equiv="refresh" content="0; URL=${root}${contentDir}/${nav[0]?.id}">
   <title>${escapedTitle}</title>
   <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-  <link rel="icon" type="${icon.type}" href="${icon.url}">
+  ${iconTag}
   <script>window.location.replace("${root}${contentDir}/${nav[0]?.id}");</script>
 </head>
 <body>
@@ -667,8 +694,8 @@ ${counterContent}
 var import_promises5 = require("node:fs/promises");
 var import_node_path4 = require("node:path");
 
-// src/utils/getIcon.ts
-function getIcon(baseColor = "gray") {
+// src/utils/getIconContent.ts
+function getIconContent(baseColor = "gray") {
   return `
         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
         <style>.b{fill:${baseColor};}.c0{fill:oklch(from ${baseColor} calc(100*(.78 - l)) 0 0 / .5);}.c1{fill:oklch(from ${baseColor} calc(100*(.78 - l)) 0 0 / .3);}.c2{fill:none;}</style>
@@ -685,8 +712,11 @@ function getIcon(baseColor = "gray") {
 // src/bin/setImages.ts
 async function setImages({ dir = "", colorScheme, favicon }) {
   if (favicon) return;
-  await (0, import_promises5.writeFile)((0, import_node_path4.join)(dir, "./favicon.svg"), `${getIcon(colorScheme)}
-`);
+  await (0, import_promises5.writeFile)(
+    (0, import_node_path4.join)(dir, "./favicon.svg"),
+    `${getIconContent(colorScheme)}
+`
+  );
 }
 
 // src/bin/createFiles.ts

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@t8/docsgen",
-  "version": "0.1.3",
+  "version": "0.1.5",
   "description": "",
   "main": "dist/bin.js",
   "bin": {

package/src/bin/getIcon.ts

@@ -0,0 +1,30 @@
+import type { Context } from "../types/Context";
+
+const iconTypeMap: Record<string, string> = {
+  ico: "image/x-icon",
+  svg: "image/svg+xml",
+  png: "image/png",
+  gif: "image/gif",
+  jpg: "image/jpeg",
+  jpeg: "image/jpeg",
+};
+
+type Icon = {
+  url?: string | undefined;
+  type?: string | undefined;
+};
+
+export function getIcon({ favicon, faviconType }: Context) {
+  let icon: Icon = {
+    url: favicon,
+    type: faviconType,
+  };
+
+  if (icon.url && !icon.type) {
+    let ext = icon.url.split("/").at(-1)?.split(".").at(-1)?.toLowerCase();
+
+    if (ext) icon.type = iconTypeMap[ext];
+  }
+
+  return icon;
+}

package/src/bin/getNav.ts

@@ -48,17 +48,20 @@ export async function getNav(ctx: Context, navItems: NavItem[]) {
 
   if (!s && !navContent) return "";
 
+  s = s.trim() ? `<section><ul>${s}\n</ul></section>` : "";
+
   let repoLink = getRepoLink(ctx);
+  let refContent = "";
 
-  s = s.trim() ? `<section><ul>${s}\n</ul></section>` : "";
-  s = `${s}
+  if (repoLink || backstory)
+    refContent = `
 <section class="ref">
   <ul>
-    <li>${repoLink}</li>
+    ${repoLink ? `<li>${repoLink}</li>` : ""}
     ${backstory ? `<li><a href="${backstory}">Backstory</a></li>` : ""}
   </ul>
 </section>
-${navContent}`;
+`;
 
-  return `<nav>\n${s}\n</nav>`;
+  return `<nav>\n${s}${refContent}\n${navContent}\n</nav>`;
 }

package/src/bin/getParsedContent.ts

@@ -4,6 +4,7 @@ import type { Context } from "../types/Context";
 import type { NavItem } from "../types/NavItem";
 import { fetchText } from "./fetchText";
 import { getSlug } from "./getSlug";
+import { getSource } from "./getSource";
 
 const md = new Markdown({
   html: true,
@@ -103,8 +104,8 @@ function getSectionPostprocess(linkMap: Record<string, string>) {
 }
 
 export async function getParsedContent(ctx: Context) {
-  let { source = "README.md", singlePage } = ctx;
-  let content = md.render(await fetchText(source));
+  let { singlePage } = ctx;
+  let content = md.render(await fetchText(getSource(ctx)));
   let dom = new JSDOM(content);
 
   let { nav, linkMap } = buildNav(ctx, dom);

package/src/bin/getSource.ts

@@ -0,0 +1,16 @@
+import type { Context } from "../types/Context";
+
+export function getSource(ctx: Context) {
+  let { source, repo, mainBranch = "main" } = ctx;
+
+  if (source) return source;
+
+  let ghId = repo?.startsWith("https://github.com/")
+    ? repo.replace("https://github.com/", "").split("/").slice(0, 2).join("/")
+    : "";
+
+  if (ghId)
+    return `https://raw.githubusercontent.com/${ghId}/refs/heads/${mainBranch}/README.md`;
+
+  return "README.md";
+}

package/src/bin/getTitle.ts

@@ -11,17 +11,16 @@ export function getTitle(
   ctx: Context,
   { cover, originalContent, withPackageURL }: GetTitleParams = {},
 ) {
-  let { root, name, title: packageTitle, scope, theme } = ctx;
+  let { root, name, title: packageTitle, htmlTitle, scope } = ctx;
 
   if (originalContent && ![name, packageTitle].includes(originalContent.trim()))
     return originalContent;
 
+  if (cover && htmlTitle) return htmlTitle;
+
   if (packageTitle) {
     let escapedTitle = escapeHTML(packageTitle);
 
-    if (cover && theme === "t8" && packageTitle.startsWith("T8 "))
-      return `<a href="/">T8</a> <span class="name">${packageTitle.replace(/^T8 /, "")}</span>`;
-
     return withPackageURL
       ? `<a href="${root}" class="name">${escapedTitle}</a>`
       : `<span class="name">${escapedTitle}</span>`;

package/src/bin/setContent.ts

@@ -7,6 +7,7 @@ import type { Context } from "../types/Context";
 import { escapeHTML } from "../utils/escapeHTML";
 import { escapeRegExp } from "../utils/escapeRegExp";
 import { getCounterContent } from "./getCounterContent";
+import { getIcon } from "./getIcon";
 import { getNav } from "./getNav";
 import { getParsedContent } from "./getParsedContent";
 import { getRepoLink } from "./getRepoLink";
@@ -42,21 +43,15 @@ export async function setContent(ctx: Context) {
   let packageUrl = `https://unpkg.com/${packageName}@${packageVersion}`;
   let rootAttrs = "";
 
-  let icon = {
-    url: `${root}favicon.svg`,
-    type: "image/svg+xml",
-  };
-
   if (theme) rootAttrs += ` data-theme="${escapeHTML(theme)}"`;
 
   if (colorScheme)
     rootAttrs += ` style="--color-scheme: ${escapeHTML(colorScheme)}"`;
 
-  if (theme === "t8")
-    icon = {
-      url: "/assets/t8.png",
-      type: "image/png",
-    };
+  let icon = getIcon(ctx);
+  let iconTag = icon.url
+    ? `<link rel="icon"${icon.type ? ` type="${icon.type}"` : ""} href="${icon.url}">`
+    : "";
 
   if (redirect) {
     let escapedRedirect = escapeHTML(redirect);
@@ -70,6 +65,7 @@ export async function setContent(ctx: Context) {
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width">
   <meta http-equiv="refresh" content="0; URL=${escapedRedirect}">
+  ${iconTag}
 </head>
 <body>
 ${counterContent}
@@ -108,14 +104,14 @@ ${counterContent}
 <!DOCTYPE html>
 <html lang="en"${rootAttrs}>
 <head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapeHTML(nav[i]?.title)} | ${escapedTitle}</title>
-<link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-<link rel="stylesheet" href="${packageUrl}/dist/css/section.css">
-<link rel="icon" type="${icon.type}" href="${icon.url}">
-${nav[i + 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i + 1]?.id}">` : ""}
-${nav[i - 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i - 1]?.id}">` : ""}
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>${escapeHTML(nav[i]?.title)} | ${escapedTitle}</title>
+  <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
+  <link rel="stylesheet" href="${packageUrl}/dist/css/section.css">
+  ${iconTag}
+  ${nav[i + 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i + 1]?.id}">` : ""}
+  ${nav[i - 1]?.id ? `<link rel="prefetch" href="${root}${contentDir}/${nav[i - 1]?.id}">` : ""}
 </head>
 <body>
 <div class="layout">
@@ -165,14 +161,14 @@ ${counterContent}
 <!DOCTYPE html>
 <html lang="en"${rootAttrs}>
 <head>
-<meta charset="utf-8">
-<meta name="viewport" content="width=device-width, initial-scale=1">
-<title>${escapedTitle}${packageDescription ? ` | ${escapeHTML(packageDescription)}` : ""}</title>
-<link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-<link rel="stylesheet" href="${packageUrl}/dist/css/index.css">
-<link rel="icon" type="${icon.type}" href="${icon.url}">
-<link rel="prefetch" href="${root}start">
-${nav[0] ? `<link rel="prefetch" href="${root}${contentDir}/${nav[0]?.id ?? ""}">` : ""}
+  <meta charset="utf-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>${escapedTitle}${packageDescription ? ` | ${escapeHTML(packageDescription)}` : ""}</title>
+  <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
+  <link rel="stylesheet" href="${packageUrl}/dist/css/index.css">
+  ${iconTag}
+  <link rel="prefetch" href="${root}start">
+  ${nav[0] ? `<link rel="prefetch" href="${root}${contentDir}/${nav[0]?.id ?? ""}">` : ""}
 </head>
 <body>
 <div class="layout">
@@ -234,7 +230,7 @@ ${counterContent}
   <meta http-equiv="refresh" content="0; URL=${root}${contentDir}/${nav[0]?.id}">
   <title>${escapedTitle}</title>
   <link rel="stylesheet" href="${packageUrl}/dist/css/base.css">
-  <link rel="icon" type="${icon.type}" href="${icon.url}">
+  ${iconTag}
   <script>window.location.replace("${root}${contentDir}/${nav[0]?.id}");</script>
 </head>
 <body>

package/src/bin/setImages.ts

@@ -1,10 +1,13 @@
 import { writeFile } from "node:fs/promises";
 import { join } from "node:path";
 import type { Context } from "../types/Context";
-import { getIcon } from "../utils/getIcon";
+import { getIconContent } from "../utils/getIconContent";
 
 export async function setImages({ dir = "", colorScheme, favicon }: Context) {
   if (favicon) return;
 
-  await writeFile(join(dir, "./favicon.svg"), `${getIcon(colorScheme)}\n`);
+  await writeFile(
+    join(dir, "./favicon.svg"),
+    `${getIconContent(colorScheme)}\n`,
+  );
 }

package/src/types/EntryConfig.ts

@@ -8,6 +8,7 @@ export type EntryConfig = {
   theme?: Theme;
   name?: string;
   title?: string;
+  htmlTitle?: string;
   description?: string;
   version?: string;
   repo?: string;
@@ -39,6 +40,7 @@ export type EntryConfig = {
   nav?: string;
   /** Favicon URL. */
   favicon?: string;
+  faviconType?: string;
   /** Scope URL. */
   scope?: string;
   /** Redirection URL. */

package/src/utils/{getIcon.ts → getIconContent.ts}

@@ -1,4 +1,4 @@
-export function getIcon(baseColor = "gray") {
+export function getIconContent(baseColor = "gray") {
   return `
         <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100">
         <style>.b{fill:${baseColor};}.c0{fill:oklch(from ${baseColor} calc(100*(.78 - l)) 0 0 / .5);}.c1{fill:oklch(from ${baseColor} calc(100*(.78 - l)) 0 0 / .3);}.c2{fill:none;}</style>