move back to EC

pnpm-workspace.yaml

@@ -2,14 +2,14 @@ catalog: # Confirmed Current Master Catalog - 11.01.2024
   '@astrojs/db': ^0.14.3
   '@astrojs/markdown-remark': ^5.2.0
   '@astrojs/rss': ^4.0.7
-  '@astrojs/react': ^3.6.2
+  '@astrojs/react': ^3.6.3
   '@astrojs/check': ^0.9.4
   '@astrojs/tailwind': ^5.1.2
-  '@astrojs/starlight': ^0.28.3
+  '@astrojs/starlight': ^0.29.2
   '@astrojs/web-vitals': ^3.0.0
   '@astrojs/node': ^8.3.4
   '@types/node': ^20.14.11
-  astro: ^4.16.11
+  astro: ^4.16.14
   astro-integration-kit: ^0.16.1
   astro-theme-provider: ^0.6.1
   sharp: ^0.33.4
@@ -47,10 +47,6 @@ catalogs:
     starlight-typedoc: ^0.16.0
     typedoc: ^0.26.10
     typedoc-plugin-markdown: ^4.2.9
-    "@shikijs/transformers": ^1.22.0
-    "@shikijs/twoslash": ^1.22.0
-    shiki: ^1.22.0
-    shiki-transformer-color-highlight: ^0.2.0
     starlight-image-zoom: ^0.8.0
     hastscript: ^9.0.0
     hast-util-to-string: ^3.0.1
@@ -62,6 +58,9 @@ catalogs:
     rehype-external-links: ^3.0.0
     "@types/html-escaper": ^3.0.2
     html-escaper: ^3.0.3
+    expressive-code-twoslash: ^0.2.4
+    "@shikijs/colorized-brackets": ^1.23.1
+    starlight-package-managers: ^0.8.0
 
   studiocms: # Confirmed Current CMS Deps - 11.01.2024
     '@types/semver': ^7.5.8

www/docs/astro.config.mts

@@ -1,12 +1,9 @@
 import starlight from '@astrojs/starlight';
 import starlightUtils from '@lorenzo_lewis/starlight-utils';
 import { defineConfig } from 'astro/config';
-import JS from 'shiki/langs/javascript.mjs';
-import TSX from 'shiki/langs/tsx.mjs';
 import starlightImageZoom from 'starlight-image-zoom';
 import getCoolifyURL from './hostUtils';
 import rehypePluginKit from './src/plugins/rehypePluginKit';
-import { transformerKit } from './src/shiki';
 import { typeDocPlugins, typeDocSideBarEntry } from './typedoc.config';
 
 // Define the Site URL
@@ -22,16 +19,6 @@ export default defineConfig({
 	},
 	markdown: {
 		rehypePlugins: rehypePluginKit,
-		syntaxHighlight: 'shiki',
-		shikiConfig: {
-			wrap: true,
-			langs: [...JS, ...TSX],
-			themes: {
-				light: 'light-plus',
-				dark: 'dark-plus',
-			},
-			transformers: transformerKit,
-		},
 	},
 	integrations: [
 		starlight({
@@ -41,7 +28,6 @@ export default defineConfig({
 			lastUpdated: true,
 			credits: true,
 			tagline: 'A dedicated CMS for Astro DB. Built from the ground up by the Astro community.',
-			expressiveCode: false,
 			components: {
 				SiteTitle: './src/starlightOverrides/SiteTitle.astro',
 				PageTitle: './src/starlightOverrides/PageTitle.astro',
@@ -60,12 +46,9 @@ export default defineConfig({
 				blueSky: 'https://bsky.app/profile/studiocms.dev',
 			},
 			customCss: [
-				'@shikijs/twoslash/style-rich.css',
 				'@studiocms/ui/css/global.css',
-				'./src/styles/shiki.css',
 				'./src/styles/sponsorcolors.css',
 				'./src/styles/starlight.css',
-				'./src/styles/twoslash.css',
 			],
 			editLink: {
 				baseUrl: 'https://github.com/withstudiocms/studiocms/tree/main/www/docs',

www/docs/ec.config.mjs

@@ -0,0 +1,32 @@
+import { defineEcConfig } from '@astrojs/starlight/expressive-code';
+import { transformerColorizedBrackets } from '@shikijs/colorized-brackets';
+import ecTwoSlash from 'expressive-code-twoslash';
+
+export default defineEcConfig({
+	shiki: {
+		transformers: [transformerColorizedBrackets()],
+	},
+	themes: ['dark-plus', 'light-plus'],
+	plugins: [
+		ecTwoSlash({
+			twoslashOptions: {
+				compilerOptions: {
+					strict: true,
+					moduleResolution: 100,
+					target: 99,
+					exactOptionalPropertyTypes: true,
+					downlevelIteration: true,
+					skipLibCheck: true,
+					lib: ['ES2022', 'DOM', 'DOM.Iterable', 'dom'],
+					noEmit: true,
+				},
+			},
+		}),
+	],
+	styleOverrides: {
+		// @ts-expect-error - This is not a Standard EC config option, but it's a valid one from a plugin
+		twoSlash: {
+			cursorColor: '#f8f8f2',
+		},
+	},
+});

www/docs/package.json

@@ -27,6 +27,9 @@
     "sharp": "catalog:",
     "typescript": "catalog:",
 
+    "expressive-code-twoslash": "catalog:docs",
+    "@shikijs/colorized-brackets": "catalog:docs",
+    "starlight-package-managers": "catalog:docs",
     "@11ty/eleventy-fetch": "catalog:docs",
     "@lorenzo_lewis/starlight-utils": "catalog:docs",
     "@types/hast": "catalog:docs",
@@ -38,10 +41,6 @@
     "starlight-typedoc": "catalog:docs",
     "typedoc": "catalog:docs",
     "typedoc-plugin-markdown": "catalog:docs",
-    "shiki": "catalog:docs",
-    "@shikijs/twoslash": "catalog:docs",
-    "@shikijs/transformers": "catalog:docs",
-    "shiki-transformer-color-highlight": "catalog:docs",
     "starlight-image-zoom": "catalog:docs",
     "hastscript": "catalog:docs",
     "hast-util-to-string": "catalog:docs",

www/docs/src/components/TursoCLI.astro

@@ -1,5 +1,5 @@
 ---
-import Code from './Code.astro';
+import { Code } from '@astrojs/starlight/components';
 
 const tursoCliCommands = ['db', 'auth'] as const;