feat: improve static tuple literal errors, migrate to fumadocs (#1233)

.github/actions/setup/action.yml

@@ -4,6 +4,7 @@ description: Install dependencies and perform setup for https://github.com/arkty
 inputs:
   node:
     default: lts/*
+    description: Node version to use
 
 runs:
   using: composite

.github/workflows/publish.yml

@@ -23,12 +23,13 @@ jobs:
       - name: Setup repo
         uses: ./.github/actions/setup
 
-      - name: Install, build, and upload your site
-        uses: withastro/action@v2
+      - name: Build docs
+        run: pnpm buildDocs
+
+      - name: Upload artifact
+        uses: actions/upload-pages-artifact@v3
         with:
-          path: ./ark/docs # The root location of your Astro project inside the repository. (optional)
-          # node-version: 20 # The specific version of Node that should be used to build your site. Defaults to 20. (optional)
-          package-manager: pnpm@latest # The Node package manager that should be used to install dependencies and build your site. Automatically detected based on your lockfile. (optional)
+          path: ./ark/docs/out
 
   deploy:
     needs: update-gh-pages

.npmrc

@@ -0,0 +1 @@
+shell-emulator=true

.vscode/settings.json

@@ -1,5 +1,6 @@
 {
 	"editor.defaultFormatter": "esbenp.prettier-vscode",
+	"prettier.prettierPath": "./node_modules/prettier",
 	"biome.enabled": false,
 	"editor.codeActionsOnSave": [
 		"editor.formatOnSave",

ark/attest/__tests__/demo.test.ts

@@ -46,9 +46,7 @@ contextualize(() => {
 
 	it("type and value assertions", () => {
 		const even = type("number%2")
-		// asserts even.infer is exactly number
-		attest<number>(even.infer)
-		// make assertions about types and values seamlessly
+		// snapshot types and values seamlessly
 		attest(even.infer).type.toString.snap("number")
 		// including object literals- no more long inline strings!
 		attest(even.json).snap({ domain: "number", divisor: 2 })

ark/attest/__tests__/snapPopulation.test.ts

@@ -10,13 +10,13 @@ contextualize(() => {
 			fromHere("benchExpectedOutput.ts")
 		).replaceAll("\r\n", "\n")
 		equal(actual, expectedOutput)
-	}).timeout(20000)
+	}).timeout(60000)
 
 	it("snap populates file", () => {
 		const actual = runThenGetContents(fromHere("snapTemplate.ts"))
 		const expectedOutput = readFile(
 			fromHere("snapExpectedOutput.ts")
 		).replaceAll("\r\n", "\n")
 		equal(actual, expectedOutput)
-	}).timeout(20000)
+	}).timeout(60000)
 })

ark/attest/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@ark/attest",
-	"version": "0.32.0",
+	"version": "0.33.0",
 	"license": "MIT",
 	"author": {
 		"name": "David Blass",

ark/docs/README.md

@@ -1,115 +1,26 @@
-# arktype.io
+# my-app
 
-Source code for ArkType's docs at [arktype.io](https://arktype.io)
+This is a Next.js application generated with
+[Create Fumadocs](https://github.com/fuma-nama/fumadocs).
 
-Built with [Starlight](https://starlight.astro.build/)
+Run development server:
 
-# Definitions
+```bash
+npm run dev
+# or
+pnpm dev
+# or
+yarn dev
+```
 
-- Primitives
+Open http://localhost:3000 with your browser to see the result.
 
-  - string
-    - keywords
-      - Autogenerate from JSDoc
-    - literals
-    - patterns
-    - lengths
-  - number
-    - keywords
-      - Autogenerate from JSDoc
-    - literals
-    - ranges
-    - divisors
-  - more
-    - bigint
-    - boolean
-    - symbol
-    - null
-    - undefined
+## Learn More
 
-- Objects
+To learn more about Next.js and Fumadocs, take a look at the following
+resources:
 
-  - properties
-    - required
-    - optional
-    - defaultable
-    - index
-    - undeclared
-    - more
-      - merge
-      - keyof
-      - get
-      - map
-  - arrays
-    - lengths
-    - tuples
-      - prefix
-      - optional
-      - variadic
-      - postfix
-  - dates
-    - keywords
-      - Autogenerate from JSDoc
-    - literals
-    - ranges
-  - instanceOf
-    - keywords
-      - Autogenerate from JSDoc
-
-- Expressions
-
-  - intersection
-  - union
-  - brand
-  - narrow
-  - morph
-  - more
-    - unit
-    - enumerated
-    - meta
-    - cast
-    - parenthetical
-    - this
-
-# Other stuff
-
-- Types (how you can use existing types)
-
-  - Top-level type invocation
-
-  - Autogenerate from JSDoc <!-- properties of a Type instance -->
-
-  - define <!-- type utilities not attached to a type instance -->
-  - raw
-
-- Configuration
-
-  - errors
-  - clone
-  - onUndeclaredKey
-  - jitless
-
-- Scopes (advanced)
-
-  - syntax
-  - modules
-  - visibility
-  - submodules
-  - thunks
-
-- Generics (advanced)
-
-  - keywords
-    - Autogenerate from JSDoc
-  - syntax
-  - hkt (advanced++)
-
-- Integrations
-
-  - Standard Schema
-  - tRPC
-  - react-hook-form
-  - hono
-
-- FAQ
-- About the project
+- [Next.js Documentation](https://nextjs.org/docs) - learn about Next.js
+  features and API.
+- [Learn Next.js](https://nextjs.org/learn) - an interactive Next.js tutorial.
+- [Fumadocs](https://fumadocs.vercel.app) - learn about Fumadocs

ark/fuma/app/(home)/page.tsx → ark/docs/app/(home)/page.tsx

@@ -24,7 +24,7 @@ export default () => (
 					Type syntax you already know with safety and completions unlike
 					anything you've ever seen
 				</p>
-				<CodeBlock fromFile="unparalleledDx" />
+				<CodeBlock fromFile="unparalleledDx" includesCompletions />
 			</ArkCard>
 			<ArkCard title="Faster... everything" icon={<RocketIcon />}>
 				<p>

ark/fuma/app/api/search/route.ts → ark/docs/app/api/search/route.ts

@@ -1,5 +1,5 @@
 import { createFromSource } from "fumadocs-core/search/server"
-import { source } from "../../../lib/source.ts"
+import { source } from "../../../lib/source.tsx"
 // it should be cached forever
 export const revalidate = false
 export const { staticGET: GET } = createFromSource(source)

ark/docs/app/docs-og/[...slug]/route.tsx

@@ -0,0 +1,28 @@
+import { generateOGImage } from "fumadocs-ui/og"
+import { metadataImage } from "../../../lib/metadata"
+
+export const GET = metadataImage.createAPI(page =>
+	generateOGImage({
+		title: page.data.title === "ArkType" ? "ArkType" : "ArkType Docs",
+		description: page.data.title === "ArkType" ? "" : page.data.title,
+		site: "ArkType"
+		// font: {
+		// 	title: {
+		// 		families: ["Raleway"],
+		// 		weight: "Bold",
+		// 		size: 100
+		// 	},
+		// 	description: {
+		// 		families: ["Raleway"],
+		// 		weight: "SemiBold",
+		// 		size: 40
+		// 	}
+		// }
+		// fonts: [
+		// 	fromPackageRoot("src", "assets", "Raleway.ttf"),
+		// 	"https://fonts.googleapis.com/css?family=Raleway:300,400,500,700&display=swap"
+		// ]
+	})
+)
+
+export const generateStaticParams = () => metadataImage.generateParams()

ark/fuma/app/docs/[[...slug]]/page.tsx → ark/docs/app/docs/[[...slug]]/page.tsx

@@ -8,7 +8,7 @@ import {
 	DocsTitle
 } from "fumadocs-ui/page"
 import { notFound } from "next/navigation"
-import { source } from "../../../lib/source.ts"
+import { source } from "../../../lib/source.tsx"
 
 export default async (props: { params: Promise<{ slug?: string[] }> }) => {
 	const params = await props.params
@@ -28,7 +28,6 @@ export default async (props: { params: Promise<{ slug?: string[] }> }) => {
 						Popup,
 						PopupContent,
 						PopupTrigger,
-
 						pre: ({ ref: _, ...props }) => (
 							<CodeBlock {...props}>
 								<Pre>{props.children}</Pre>

ark/fuma/app/docs/layout.tsx → ark/docs/app/docs/layout.tsx

@@ -1,6 +1,6 @@
 import { DocsLayout } from "fumadocs-ui/layouts/docs"
 import type { ReactNode } from "react"
-import { source } from "../../lib/source.ts"
+import { source } from "../../lib/source.tsx"
 import { baseOptions } from "../layout.config.tsx"
 
 export default ({ children }: { children: ReactNode }) => (

ark/fuma/app/global.css → ark/docs/app/global.css

@@ -9,7 +9,8 @@
 @tailwind components;
 @tailwind utilities;
 
-:root {
+/** the * ensures this overrides the variable definitions from shiki*/
+:root * {
 	--background: 207 100% 9%;
 	--hover-glow: 0.5rem 0.5rem 2rem 0 rgba(31, 38, 135, 0.37);
 
@@ -33,7 +34,7 @@
 	--twoslash-code-font-size: 1em;
 	--twoslash-matched-color: inherit;
 	--twoslash-unmatched-color: #888;
-	--twoslash-cursor-color: var(--sl-color-gray-2);
+	--twoslash-cursor-color: #888;
 	--twoslash-error-color: var(--ark-error);
 	--twoslash-error-bg: #9558f818;
 	--twoslash-warn-color: #c37d0d;
@@ -65,7 +66,14 @@ pre.shiki,
 	overflow-x: visible !important;
 }
 
+/** should match arkDarkTheme.colors["editor.background"] */
 .bg-fd-secondary\/50 {
+	background-color: #0006;
+}
+
+/** avoid border on hover: 
+    https://github.com/arktypeio/arktype/issues/1217 */
+.twoslash-popup-container .bg-fd-secondary\/50 {
 	background-color: unset;
 }
 
@@ -76,7 +84,10 @@ div.twoslash-popup-container {
 	box-shadow: var(--hover-glow);
 }
 
-.error {
+/** .error.highlighted matches error lines explicitly added in the snippet
+    source via [!code error] */
+
+.error.highlighted {
 	position: relative;
 	background-color: #f8585822;
 	border-left: 3px solid var(--ark-runtime-error);
@@ -87,10 +98,11 @@ div.twoslash-popup-container {
 	width: max-content;
 }
 
-.error > span {
+.error.highlighted > span {
 	color: var(--ark-runtime-error) !important;
 }
 
+/** .twoslash-error matches errors added by twoslash itself, e.g. type errors */
 .twoslash .twoslash-error {
 	/* Override the builtin error squiggle to match our theme */
 	background: url("/image/errorSquiggle.svg") repeat-x bottom left;
@@ -116,10 +128,25 @@ div.twoslash-popup-container {
 	white-space: pre;
 }
 
+.completions-block code {
+	padding-bottom: 3rem;
+}
+
+/** avoid a janky white outline on hovers: 
+    https://github.com/arktypeio/arktype/issues/1217 */
+:focus-visible {
+	outline: none;
+}
+
 /* Firefox specific rules */
 @-moz-document url-prefix() {
 	/* The backdrop-filter above doesn't work by default yet on Firefox so we do this instead  */
 	.twoslash .twoslash-hover:hover .twoslash-popup-container {
 		background: #001323ee;
 	}
 }
+
+/* allow us to inject a badge at order 1 */
+#nd-sidebar .lucide-chevron-down {
+	order: 2;
+}