Merge pull request #249 from code-hike/typescript-module-resolution

Fix typescript module resolution

Author: pomber

.gitignore

@@ -11,6 +11,7 @@ yarn-error.log
 storybook-static
 packages/playground/out
 packages/starter
+packages/mdx/components.d.ts
 
 # Contentlayer
 .contentlayer

packages/mdx/package.json

@@ -2,18 +2,21 @@
   "name": "@code-hike/mdx",
   "version": "0.7.2",
   "files": [
-    "dist"
+    "dist",
+    "components.d.ts"
   ],
   "main": "./dist/index.cjs.js",
   "module": "./dist/index.esm.mjs",
   "types": "./dist/index.d.ts",
   "exports": {
     ".": {
+      "types": "./dist/index.d.ts",
       "import": "./dist/index.esm.mjs",
       "require": "./dist/index.cjs.js",
       "style": "./dist/index.css"
     },
     "./components": {
+      "types": "./dist/components.d.ts",
       "import": "./dist/components.esm.mjs",
       "require": "./dist/components.cjs.js",
       "default": "./dist/components.cjs.js"
@@ -23,6 +26,7 @@
     "./styles.css": "./dist/index.css",
     "./dist/index.css": "./dist/index.css",
     "./dist/components.cjs.js": {
+      "types": "./dist/components.d.ts",
       "import": "./dist/components.esm.mjs",
       "require": "./dist/components.cjs.js",
       "default": "./dist/components.cjs.js"

packages/mdx/rollup.config.js

@@ -136,6 +136,8 @@ export default function makeConfig(commandOptions) {
       input: `src/components.tsx`,
       output: [
         { file: `./dist/components.d.ts`, format: "es" },
+        // because of typescript not following package.json exports sometimes
+        { file: `./components.d.ts`, format: "es" },
       ],
       external: clientExternal,
       plugins: [dts()],

packages/mdx/src/components.tsx

@@ -14,6 +14,7 @@ import {
 } from "./mdx-client/annotations"
 import { Preview } from "./mdx-client/preview"
 import { InlineCode } from "./mdx-client/inline-code"
+import type { MDXComponents } from "mdx/types"
 
 export {
   Code,
@@ -31,7 +32,7 @@ export {
   PreviewSlot,
 }
 
-export const CH = {
+export const CH: MDXComponents = {
   Code,
   Section,
   SectionLink,

packages/mdx/src/index.tsx

@@ -1,3 +1,3 @@
-export { transform as remarkCodeHike } from "./remark/transform"
+export { attacher as remarkCodeHike } from "./remark/transform"
 
 export { highlight } from "./highlighter"

packages/mdx/src/mdx-client/annotations.tsx

@@ -3,7 +3,12 @@ import { CodeAnnotation } from "../smooth-code"
 import { getColor, transparent, ColorName } from "../utils"
 
 export function Annotation() {
-  return "error: code hike remark plugin not running or annotation isn't at the right place"
+  return (
+    <div>
+      "error: code hike remark plugin not running or
+      annotation isn't at the right place"
+    </div>
+  )
 }
 
 export const annotationsMap: Record<

packages/mdx/src/remark/transform.ts

@@ -10,6 +10,7 @@ import { valueToEstree } from "./to-estree"
 import { CH_CODE_CONFIG_VAR_NAME } from "./unist-utils"
 import { JsxNode, SuperNode, visit } from "./nodes"
 import { addConfigDefaults, CodeHikeConfig } from "./config"
+import { Attacher } from "unified"
 
 const transforms = [
   transformPreviews,
@@ -20,7 +21,9 @@ const transforms = [
   transformInlineCodes,
   transformCodes,
 ]
-export function transform(unsafeConfig: CodeHikeConfig) {
+export const attacher: Attacher<
+  [CodeHikeConfig?]
+> = unsafeConfig => {
   return async (tree: SuperNode, file: any) => {
     const config = addConfigDefaults(
       unsafeConfig,