fixup!

Author: avivkeller

apps/site/pages/en/about/index.mdx

@@ -10,7 +10,7 @@ scalable network applications. In the following "hello world" example, many
 connections can be handled concurrently. Upon each connection, the callback is
 fired, but if there is no work to be done, Node.js will sleep.
 
-```cjs twoslash
+```cjs
 const { createServer } = require('node:http');
 
 const hostname = '127.0.0.1';

apps/site/pages/en/learn/typescript/introduction.md

@@ -22,7 +22,7 @@ Take a look at this code snippet and then we can unpack it together:
   Maintainers note: this code is duplicated in the next article, please keep them in sync
 -->
 
-```ts twoslash
+```ts
 type User = {
   name: string;
   age: number;

apps/site/pages/en/learn/typescript/transpile.md

@@ -71,6 +71,7 @@ If you have type errors in your TypeScript code, the TypeScript compiler will ca
 We will modify our code like this, to voluntarily introduce a type error:
 
 ```ts
+// @errors: 2322 2554
 type User = {
   name: string;
   age: number;
@@ -88,31 +89,4 @@ const justine: User = {
 const isJustineAnAdult: string = isAdult(justine, "I shouldn't be here!");
 ```
 
-And this is what TypeScript has to say about this:
-
-```console
-example.ts:12:5 - error TS2322: Type 'string' is not assignable to type 'number'.
-
-12     age: 'Secret!',
-       ~~~
-
-  example.ts:3:5
-    3     age: number;
-          ~~~
-    The expected type comes from property 'age' which is declared here on type 'User'
-
-example.ts:15:7 - error TS2322: Type 'boolean' is not assignable to type 'string'.
-
-15 const isJustineAnAdult: string = isAdult(justine, "I shouldn't be here!");
-         ~~~~~~~~~~~~~~~~
-
-example.ts:15:51 - error TS2554: Expected 1 arguments, but got 2.
-
-15 const isJustineAnAdult: string = isAdult(justine, "I shouldn't be here!");
-                                                     ~~~~~~~~~~~~~~~~~~~~~~
-
-
-Found 3 errors in the same file, starting at: example.ts:12
-```
-
 As you can see, TypeScript is very helpful in catching bugs before they even happen. This is one of the reasons why TypeScript is so popular among developers.

packages/rehype-shiki/src/index.mjs

@@ -22,7 +22,8 @@ const { shiki, getLanguageDisplayName, highlightToHast, highlightToHtml } =
   createHighlighter({
     transformers: [
       transformerTwoslash({
-        explicitTrigger: true,
+        langs: ['ts', 'js', 'cjs', 'mjs'],
+        throws: false,
       }),
     ],
     // We use the faster WASM engine on the server instead of the web-optimized version.

packages/rehype-shiki/src/styles.css

@@ -1 +1,13 @@
-@import "@shikijs/twoslash/style-rich.css"
+@import "@shikijs/twoslash/style-rich.css";
+
+.twoslash-popup-container {
+  > :not(.twoslash-popup-code) {
+    display: none !important;
+  }
+
+  .twoslash-popup-code {
+    z-index: 9999;
+  }
+
+  position: fixed !important;
+}

packages/ui-components/src/Common/BaseCodeBox/index.module.css

@@ -8,7 +8,12 @@
     bg-neutral-950;
 
   .content {
-    @apply m-0
+    @apply /*
+      To allow tooltips to escape the overflow */ /*
+      https://stackoverflow.com/questions/8837050/allow-specific-tag-to-override-overflowhidden */ m-0
+      translate-x-0
+      translate-y-0
+      transform
       p-4;
 
     & > code {