@lovett/ui 0.0.7 → 0.0.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lovett/ui",
-  "version": "0.0.7",
+  "version": "0.0.8",
   "private": false,
   "type": "module",
   "description": "Design system primitives, tokens, layouts, and patterns for the Lovett portfolio.",

package/src/code-block.tsx

@@ -12,7 +12,18 @@
 import { useEffect, useState, type HTMLAttributes } from 'react'
 import { Check, Copy } from 'lucide-react'
 import { PrismLight as SyntaxHighlighter } from 'react-syntax-highlighter'
-import { vscDarkPlus, oneLight } from 'react-syntax-highlighter/dist/esm/styles/prism'
+// The `/index.js` is REQUIRED and is not a style preference.
+//
+// `react-syntax-highlighter/dist/esm/styles/prism` is a DIRECTORY. Vite's
+// resolver follows a directory import; **Node's ESM resolver does not**, and
+// `tsup` externalises this specifier verbatim into `dist/index.js`. So the
+// package built green and published, and any consumer loading it under Node ESM
+// — vitest, most obviously — failed at IMPORT, before a single assertion ran.
+//
+// Reported by the studios plane against `@lovett/ui@0.0.7` and reproduced from
+// the registry: two of three suites failed to load, not to assert. A green build
+// and dead tests, with nothing connecting the two facts.
+import { vscDarkPlus, oneLight } from 'react-syntax-highlighter/dist/esm/styles/prism/index.js'
 
 import bash from 'react-syntax-highlighter/dist/esm/languages/prism/bash'
 import css from 'react-syntax-highlighter/dist/esm/languages/prism/css'

package/src/react-syntax-highlighter-prism.d.ts

@@ -0,0 +1,19 @@
+// Bridges a conflict between two resolvers, neither of which is wrong.
+//
+// `@types/react-syntax-highlighter` declares the DIRECTORY module
+// `react-syntax-highlighter/dist/esm/styles/prism`. Node's ESM resolver refuses
+// a directory import and needs the explicit `.../prism/index.js`. So the
+// specifier TypeScript can type is the one Node rejects, and the specifier Node
+// accepts is the one TypeScript cannot find — see the note in `code-block.tsx`
+// for what that cost.
+//
+// This declares the file path by RE-EXPORTING the real types from the directory
+// module, so the values stay fully typed. The alternative — a `@ts-expect-error`
+// or an `any` import — would silence the error by discarding `oneLight` and
+// `vscDarkPlus`'s types, which is trading a build failure for a typing hole at
+// the one site that already proved it can ship broken.
+//
+// Removable when upstream's types declare the file path directly.
+declare module 'react-syntax-highlighter/dist/esm/styles/prism/index.js' {
+  export * from 'react-syntax-highlighter/dist/esm/styles/prism';
+}