📦 Refactor common types (#185)

.changeset/config.json

@@ -10,6 +10,7 @@
       "@myst-theme/jupyter",
       "@myst-theme/site",
       "@myst-theme/styles",
+      "@myst-theme/common",
       "@myst-theme/icons",
       "@myst-theme/book",
       "@myst-theme/article",

.changeset/orange-bears-leave.md

@@ -0,0 +1,9 @@
+---
+'@myst-theme/providers': patch
+'@myst-theme/common': patch
+'@myst-theme/article': patch
+'@myst-theme/site': patch
+'@myst-theme/book': patch
+---
+
+Move types to @myst-theme/common

packages/common/.eslintrc.cjs

@@ -0,0 +1,4 @@
+module.exports = {
+  root: true,
+  extends: ['curvenote'],
+};

packages/common/CHANGELOG.md

@@ -0,0 +1,3 @@
+# @myst-theme/common
+
+Common utilities and types for working with the MyST Theme and sites

packages/common/package.json

@@ -0,0 +1,28 @@
+{
+  "name": "@myst-theme/common",
+  "version": "0.4.0",
+  "type": "module",
+  "exports": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "files": [
+    "dist"
+  ],
+  "license": "MIT",
+  "sideEffects": false,
+  "scripts": {
+    "clean": "rimraf dist",
+    "lint": "eslint \"src/**/*.ts*\" -c ./.eslintrc.cjs",
+    "lint:format": "prettier --check \"src/**/*.{ts,tsx,md}\"",
+    "test": "vitest run",
+    "test:watch": "vitest watch",
+    "build:esm": "tsc --project ./tsconfig.json --module es2015   --outDir dist --declaration",
+    "build": "npm-run-all -l clean -p build:esm"
+  },
+  "dependencies": {
+    "myst-common": "^1.1.0",
+    "myst-config": "^1.1.0",
+    "myst-spec-ext": "^1.1.0",
+    "nbtx": "^0.2.3",
+    "unist-util-select": "^4.0.3"
+  }
+}

packages/common/src/index.ts

@@ -0,0 +1,2 @@
+export * from './utils.js';
+export * from './types.js';

packages/site/src/types.ts → packages/common/src/types.ts

@@ -3,7 +3,16 @@ import type { Dependency, SourceFileKind } from 'myst-spec-ext';
 import type { References } from 'myst-common';
 import type { SiteManifest } from 'myst-config';
 import type { PageFrontmatter } from 'myst-frontmatter';
-import type { Theme } from '@myst-theme/providers';
+
+export enum Theme {
+  light = 'light',
+  dark = 'dark',
+}
+
+export enum ErrorStatus {
+  noSite = 'Site was not found',
+  noArticle = 'Article was not found',
+}
 
 export type Heading = {
   slug?: string;

packages/common/src/utils.spec.ts

@@ -0,0 +1,35 @@
+import { describe, expect, test } from 'vitest';
+import { isFlatSite } from './utils.js';
+
+describe('utils', () => {
+  test('isFlatSite true', () => {
+    expect(
+      isFlatSite({
+        myst: 'v1',
+        projects: [
+          {
+            index: '',
+            title: '',
+            pages: [],
+            slug: undefined,
+          },
+        ],
+      }),
+    ).toBe(true);
+  });
+  test('isFlatSite false', () => {
+    expect(
+      isFlatSite({
+        myst: 'v1',
+        projects: [
+          {
+            index: '',
+            title: '',
+            pages: [],
+            slug: 'asdf',
+          },
+        ],
+      }),
+    ).toBe(false);
+  });
+});

packages/site/src/loaders/utils.ts → packages/common/src/utils.ts

@@ -3,7 +3,7 @@ import { walkOutputs } from 'nbtx';
 import type { SiteManifest } from 'myst-config';
 import { selectAll } from 'unist-util-select';
 import type { Image as ImageSpec, Link as LinkSpec } from 'myst-spec';
-import type { FooterLinks, Heading, NavigationLink, PageLoader } from '../types';
+import type { FooterLinks, Heading, NavigationLink, PageLoader } from './types.js';
 
 type Image = ImageSpec & { urlOptimized?: string };
 type Link = LinkSpec & { static?: boolean };
@@ -167,3 +167,7 @@ export function updatePageStaticLinksInplace(data: PageLoader, updateUrl: Update
   });
   return data;
 }
+
+export function isFlatSite(config?: SiteManifest): boolean {
+  return config?.projects?.length === 1 && !config.projects[0].slug;
+}

packages/common/tsconfig.json

@@ -0,0 +1,5 @@
+{
+  "extends": "../tsconfig/esm.json",
+  "include": ["."],
+  "exclude": ["dist", "node_modules", "src/**/*.spec.ts", "tests"]
+}

packages/providers/package.json

@@ -18,7 +18,9 @@
     "build:types": "tsc --declaration --emitDeclarationOnly --declarationMap --outDir dist/types",
     "build": "npm-run-all -l clean -p build:cjs build:esm build:types"
   },
-  "dependencies": {},
+  "dependencies": {
+    "@myst-theme/common": "^0.4.0"
+  },
   "peerDependencies": {
     "@types/react": "^16.8 || ^17.0 || ^18.0",
     "@types/react-dom": "^16.8 || ^17.0 || ^18.0",

packages/providers/src/theme.tsx

@@ -1,10 +1,8 @@
 import * as React from 'react';
 import type { NodeRenderer } from './types';
+import { Theme } from '@myst-theme/common';
 
-export enum Theme {
-  light = 'light',
-  dark = 'dark',
-}
+export { Theme };
 
 export type LinkProps = {
   to: string;

packages/site/CHANGELOG.md

@@ -1,4 +1,4 @@
-# @curvenote/site
+# @myst-theme/site
 
 ## 0.4.0
 

packages/site/package.json

@@ -19,6 +19,7 @@
     "@myst-theme/diagrams": "^0.4.0",
     "@myst-theme/frontmatter": "^0.4.0",
     "@myst-theme/jupyter": "^0.4.0",
+    "@myst-theme/common": "^0.4.0",
     "@myst-theme/providers": "^0.4.0",
     "classnames": "^2.3.2",
     "lodash.throttle": "^4.1.1",

packages/site/src/components/FooterLinksBlock.tsx

@@ -1,7 +1,7 @@
 import classNames from 'classnames';
 import ArrowLeftIcon from '@heroicons/react/24/outline/ArrowLeftIcon';
 import ArrowRightIcon from '@heroicons/react/24/outline/ArrowRightIcon';
-import type { FooterLinks, NavigationLink } from '../types';
+import type { FooterLinks, NavigationLink } from '@myst-theme/common';
 import { useLinkProvider, useBaseurl, withBaseurl } from '@myst-theme/providers';
 
 const FooterLink = ({
@@ -16,7 +16,7 @@ const FooterLink = ({
   return (
     <Link
       prefetch="intent"
-      className="flex-1 block p-4 font-normal text-gray-600 no-underline border border-gray-200 rounded group hover:border-blue-600 dark:hover:border-blue-400 hover:text-blue-600 dark:hover:text-blue-400 dark:text-gray-100 dark:border-gray-500 shadow-sm hover:shadow-lg dark:shadow-neutral-700"
+      className="flex-1 block p-4 font-normal text-gray-600 no-underline border border-gray-200 rounded shadow-sm group hover:border-blue-600 dark:hover:border-blue-400 hover:text-blue-600 dark:hover:text-blue-400 dark:text-gray-100 dark:border-gray-500 hover:shadow-lg dark:shadow-neutral-700"
       to={withBaseurl(url, baseurl)}
     >
       <div className="flex h-full align-middle">

packages/site/src/components/Navigation/TableOfContents.tsx

@@ -9,8 +9,7 @@ import {
   useBaseurl,
   withBaseurl,
 } from '@myst-theme/providers';
-import { getProjectHeadings } from '../../loaders';
-import type { Heading } from '../../types';
+import { getProjectHeadings, type Heading } from '@myst-theme/common';
 
 type Props = {
   folder?: string;

packages/site/src/index.ts

@@ -1,5 +1,4 @@
 export * from './utils';
-export * from './types';
 export * from './loaders';
 export * from './components';
 export * from './pages';