@myst-theme/site 0.1.28 → 0.1.29

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@myst-theme/site",
-  "version": "0.1.28",
+  "version": "0.1.29",
   "main": "./src/index.ts",
   "types": "./src/index.ts",
   "files": [
@@ -16,16 +16,16 @@
   "dependencies": {
     "@headlessui/react": "^1.7.8",
     "@heroicons/react": "^2.0.14",
-    "@myst-theme/diagrams": "^0.1.28",
-    "@myst-theme/frontmatter": "^0.1.28",
-    "@myst-theme/jupyter": "^0.1.28",
-    "@myst-theme/providers": "^0.1.28",
+    "@myst-theme/diagrams": "^0.1.29",
+    "@myst-theme/frontmatter": "^0.1.29",
+    "@myst-theme/jupyter": "^0.1.29",
+    "@myst-theme/providers": "^0.1.29",
     "classnames": "^2.3.2",
     "lodash.throttle": "^4.1.1",
     "myst-common": "^0.0.14",
     "myst-config": "^0.0.10",
-    "myst-demo": "^0.1.28",
-    "myst-to-react": "^0.1.28",
+    "myst-demo": "^0.1.29",
+    "myst-to-react": "^0.1.29",
     "nbtx": "^0.2.3",
     "node-cache": "^5.1.2",
     "node-fetch": "^2.6.7",

package/src/components/Bibliography.tsx

@@ -12,15 +12,17 @@ export function Bibliography() {
   const refs = hidden ? filtered.slice(0, HIDE_OVER_N_REFERENCES) : filtered;
   return (
     <section className="article-grid article-subgrid-gap col-screen">
-      {filtered.length > HIDE_OVER_N_REFERENCES && (
-        <button
-          onClick={() => setHidden(!hidden)}
-          className="float-right text-xs p-1 px-2 border rounded hover:border-blue-500 dark:hover:border-blue-400"
-        >
-          {hidden ? 'Show All' : 'Collapse'}
-        </button>
-      )}
-      <header className="text-lg font-semibold text-stone-900 dark:text-white">References</header>
+      <div>
+        {filtered.length > HIDE_OVER_N_REFERENCES && (
+          <button
+            onClick={() => setHidden(!hidden)}
+            className="float-right text-xs p-1 px-2 border rounded hover:border-blue-500 dark:hover:border-blue-400"
+          >
+            {hidden ? 'Show All' : 'Collapse'}
+          </button>
+        )}
+        <header className="text-lg font-semibold text-stone-900 dark:text-white">References</header>
+      </div>
       <div className="text-xs mb-8 pl-3 text-stone-500 dark:text-stone-300">
         <ol>
           {refs.map((label) => {

package/src/components/DocumentOutline.tsx

@@ -171,13 +171,14 @@ export const DocumentOutline = ({
     <nav
       aria-label="Document Outline"
       suppressHydrationWarning
-      className={classNames('not-prose transition-opacity', className)}
+      className={classNames('not-prose transition-opacity overflow-y-auto', className)}
       style={{
         top: top ?? 0,
         height:
           typeof document === 'undefined' || (height && height > window.innerHeight)
             ? undefined
             : height,
+        maxHeight: `calc(100vh - ${(top ?? 0) + 20}px)`,
         opacity: height && height > 300 ? undefined : 0,
         pointerEvents: height && height > 300 ? undefined : 'none',
       }}

package/src/loaders/cdn.server.ts

@@ -1,6 +1,6 @@
 import fetch from 'node-fetch';
 import NodeCache from 'node-cache';
-import type { SiteManifest as Config } from 'myst-config';
+import type { SiteManifest } from 'myst-config';
 import { responseNoArticle, responseNoSite } from './errors.server';
 import {
   getFooterLinks,
@@ -21,7 +21,9 @@ declare global {
   var cdnRouterCache: NodeCache | undefined, configCache: NodeCache | undefined;
 }
 
-const CDN = 'https://cdn.curvenote.com/';
+export type Host = string | { CDN: string; id: string };
+
+const DEFAULT_CDN = 'https://cdn.curvenote.com/';
 
 function getCdnRouterCache() {
   if (global.cdnRouterCache) return global.cdnRouterCache;
@@ -31,7 +33,7 @@ function getCdnRouterCache() {
   return global.cdnRouterCache;
 }
 
-function getConfigCache() {
+export function getConfigCache() {
   if (global.configCache) return global.configCache;
   console.log('Creating configCache');
   // The config can be long lived as it is static (0 == ∞)
@@ -52,9 +54,27 @@ async function getCdnPath(hostname: string): Promise<string | undefined> {
   return data.cdn;
 }
 
-function withCDN<T extends string | undefined>(id: string, url: T): T {
+function withPublicFolderUrl(baseUrl: string, url: string): string {
+  return withBaseUrl(baseUrl, `public${url}`);
+}
+
+export async function getCdnLocation(host: Host) {
+  if (typeof host === 'string') {
+    const id = await getCdnPath(host);
+    if (!id) throw responseNoSite();
+    return { CDN: DEFAULT_CDN, id };
+  }
+  return host;
+}
+
+export async function getCdnBaseUrl(host: Host): Promise<string> {
+  const { CDN, id } = await getCdnLocation(host);
+  return `${CDN}${id}/`;
+}
+
+function withBaseUrl<T extends string | undefined>(baseUrl: string, url: T): T {
   if (!url) return url;
-  return `${CDN}${id}/public${url}` as T;
+  return `${baseUrl}${url}` as T;
 }
 
 /**
@@ -67,7 +87,7 @@ function foldTitleString(title?: string): string | undefined {
 /**
  * If the site title and the first nav item are the same, remove it.
  */
-function removeSingleNavItems(config: Config) {
+function removeSingleNavItems(config: SiteManifest) {
   if (
     config?.nav?.length === 1 &&
     foldTitleString(config.nav[0].title) === foldTitleString(config.title)
@@ -76,48 +96,51 @@ function removeSingleNavItems(config: Config) {
   }
 }
 
-export async function getConfig(hostname: string): Promise<Config> {
-  const id = await getCdnPath(hostname);
+export async function getConfig(host: Host): Promise<SiteManifest> {
+  const location = await getCdnLocation(host);
+  const baseUrl = await getCdnBaseUrl(location);
+  const { id } = location;
   if (!id) throw responseNoSite();
-  const cached = getConfigCache().get<Config>(id);
+  const cached = getConfigCache().get<SiteManifest>(id);
   // Load the data from an in memory cache.
   if (cached) return cached;
-  const response = await fetch(`${CDN}${id}/config.json`);
+  const response = await fetch(withBaseUrl(baseUrl, 'config.json'));
   if (response.status === 404) throw responseNoSite();
-  const data = (await response.json()) as Config;
+  const data = (await response.json()) as SiteManifest;
   data.id = id;
   removeSingleNavItems(data);
-  updateSiteManifestStaticLinksInplace(data, (url) => withCDN(id, url));
-  getConfigCache().set<Config>(id, data);
+  updateSiteManifestStaticLinksInplace(data, (url) => withPublicFolderUrl(baseUrl, url));
+  getConfigCache().set<SiteManifest>(id, data);
   return data;
 }
 
-export async function getObjectsInv(hostname: string): Promise<Buffer | undefined> {
-  const id = await getCdnPath(hostname);
-  if (!id) return;
-  const url = `${CDN}${id}/objects.inv`;
+export async function getObjectsInv(host: Host): Promise<Buffer | undefined> {
+  const baseUrl = await getCdnBaseUrl(host);
+  if (!baseUrl) return;
+  const url = `${baseUrl}objects.inv`;
   const response = await fetch(url);
   if (response.status === 404) return;
   const buffer = await response.buffer();
   return buffer;
 }
 
-export async function getData(
-  config?: Config,
+async function getData(
+  baseUrl: string,
+  config?: SiteManifest,
   project?: string,
   slug?: string,
 ): Promise<PageLoader | null> {
   if (!project || !slug || !config) throw responseNoArticle();
   const { id } = config;
   if (!id) throw responseNoSite();
-  const response = await fetch(`${CDN}${id}/content/${project}/${slug}.json`);
+  const response = await fetch(withBaseUrl(baseUrl, `content/${project}/${slug}.json`));
   if (response.status === 404) throw responseNoArticle();
   const data = (await response.json()) as PageLoader;
-  return updatePageStaticLinksInplace(data, (url) => withCDN(id, url));
+  return updatePageStaticLinksInplace(data, (url) => withPublicFolderUrl(baseUrl, url));
 }
 
 export async function getPage(
-  hostname: string,
+  host: Host,
   opts: {
     domain?: string;
     project?: string;
@@ -127,7 +150,8 @@ export async function getPage(
   },
 ): Promise<PageLoader | Response | null> {
   const projectName = opts.project;
-  const config = await getConfig(hostname);
+  const baseUrl = await getCdnBaseUrl(host);
+  const config = await getConfig(host);
   if (!config) throw responseNoSite();
   const project = getProject(config, projectName);
   if (!project) throw responseNoArticle();
@@ -135,7 +159,7 @@ export async function getPage(
     return redirect(`${typeof opts.redirect === 'string' ? opts.redirect : '/'}${projectName}`);
   }
   const slug = opts.loadIndexPage || opts.slug == null ? project.index : opts.slug;
-  const loader = await getData(config, projectName, slug).catch((e) => {
+  const loader = await getData(baseUrl, config, projectName, slug).catch((e) => {
     console.error(e);
     return null;
   });