starlight-theme-nova 0.0.5 → 0.0.7

package/lib/shiki.css

@@ -1,4 +1,4 @@
-@import '@shikijs/twoslash/style-rich.css';
+@import 'shiki-twoslash-renderer/style.css';
 
 .sl-markdown-content .astro-code {
   padding: 0;
@@ -59,7 +59,7 @@
   background-color: var(--shiki-light-bg);
 }
 
-html.dark .astro-code {
+html[data-theme='dark'] .astro-code {
   --twoslash-popup-bg: var(--shiki-dark-bg);
   background-color: var(--shiki-dark-bg);
 }
@@ -72,14 +72,14 @@ html.dark .astro-code {
   text-decoration: var(--shiki-light-text-decoration);
 }
 
-html.dark .astro-code,
-html.dark .astro-code span {
+html[data-theme='dark'] .astro-code,
+html[data-theme='dark'] .astro-code span {
   color: var(--shiki-dark);
   font-style: var(--shiki-dark-font-style);
   font-weight: var(--shiki-dark-font-weight);
   text-decoration: var(--shiki-dark-text-decoration);
 }
-
+/* 
 .astro-code.twoslash .twoslash-popup-container {
   transform: translateY(1.8em);
 }
@@ -90,4 +90,4 @@ html.dark .astro-code span {
 
 .astro-code.twoslash .twoslash-query-line .twoslash-popup-container {
   transform: translateY(1.3em);
-}
+} */

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "starlight-theme-nova",
   "type": "module",
-  "version": "0.0.5",
+  "version": "0.0.7",
   "description": "",
   "author": "ocavue <ocavue@gmail.com>",
   "license": "MIT",
@@ -29,11 +29,12 @@
     "@shikijs/transformers": "^3.2.1",
     "@shikijs/twoslash": "^3.2.1",
     "@shikijs/types": "^3.2.1",
-    "astro-theme-toggle": "^0.5.1",
-    "hast-util-is-element": "^3.0.0"
+    "astro-theme-toggle": "^0.6.0",
+    "hast-util-is-element": "^3.0.0",
+    "shiki-twoslash-renderer": "0.0.2"
   },
   "devDependencies": {
-    "@astrojs/starlight": "^0.32.2",
+    "@astrojs/starlight": "^0.32.3",
     "@iconify-json/bxl": "^1.2.2",
     "@iconify-json/logos": "^1.2.4",
     "@iconify-json/lucide": "^1.2.30",
@@ -41,7 +42,7 @@
     "@ocavue/tsconfig": "^0.2.0",
     "@types/node": "^20.17.24",
     "@unocss/cli": "^66.0.0",
-    "astro": "^5.5.2",
+    "astro": "^5.5.3",
     "typescript": "^5.7.2",
     "unocss": "^66.0.0",
     "unocss-preset-animations": "^1.1.1"

package/src/astro.d.ts

@@ -1,5 +1,5 @@
 declare module '*.astro' {
-  import { type AstroComponentFactory } from 'astro/runtime/server/index.js'
+  import type { AstroComponentFactory } from 'astro/runtime/server/index.js'
 
   const content: AstroComponentFactory
   export default content

package/src/components/MarkdownContent.astro

@@ -14,3 +14,7 @@ import CodeCopy from './CodeCopy.astro'
 </style>
 
 <CodeCopy />
+<script>
+  import { register } from 'shiki-twoslash-renderer/elements'
+  register()
+</script>

package/src/shiki-config.ts

@@ -6,6 +6,7 @@ import {
 import { transformerTwoslash } from '@shikijs/twoslash'
 import type { ShikiTransformer } from '@shikijs/types'
 import type { ShikiConfig } from 'astro'
+import { createRenderer } from 'shiki-twoslash-renderer'
 
 import { transformerCopyButton } from './shiki-transformer-copy-button'
 
@@ -17,6 +18,7 @@ export function createShikiConfig(options: { twoslash: boolean }): ShikiConfig {
     transformerCopyButton(),
     options.twoslash
       ? transformerTwoslash({
+          renderer: createRenderer(),
           explicitTrigger: true,
         })
       : undefined,
@@ -28,7 +30,6 @@ export function createShikiConfig(options: { twoslash: boolean }): ShikiConfig {
       dark: 'github-dark-dimmed',
     },
     defaultColor: false,
-    // @ts-expect-error: Astro is using outdated Shiki v1
     transformers: transformers,
   }
 }