🧑‍💻 Fix type resolution for @typebot.io/react and nextjs

Closes #968
2023-10-26 15:57:55 +02:00
parent 3f7f0944e1
commit 31b3fc311e
9 changed files with 93 additions and 25 deletions
--- a/packages/embeds/js/package.json
+++ b/packages/embeds/js/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@typebot.io/js",
-  "version": "0.2.9",
+  "version": "0.2.10",
  "description": "Javascript library to display typebots on your website",
  "type": "module",
  "main": "dist/index.js",
--- a/packages/embeds/nextjs/package.json
+++ b/packages/embeds/nextjs/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@typebot.io/nextjs",
-  "version": "0.2.9",
+  "version": "0.2.10",
  "description": "Convenient library to display typebots on your Next.js website",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
@@ -22,9 +22,9 @@
    "@rollup/plugin-terser": "0.4.3",
    "@rollup/plugin-typescript": "11.1.2",
    "@typebot.io/js": "workspace:*",
-    "@typebot.io/react": "workspace:*",
    "@typebot.io/lib": "workspace:*",
    "@typebot.io/prisma": "workspace:*",
+    "@typebot.io/react": "workspace:*",
    "@typebot.io/schemas": "workspace:*",
    "@typebot.io/tsconfig": "workspace:*",
    "@types/node": "20.4.2",
@@ -33,6 +33,7 @@
    "eslint-config-custom": "workspace:*",
    "react": "18.2.0",
    "rollup": "3.26.2",
+    "rollup-plugin-dts": "^6.1.0",
    "rollup-plugin-typescript-paths": "1.4.0",
    "tslib": "2.6.0",
    "tsx": "3.12.7",
--- a/packages/embeds/nextjs/rollup.config.js
+++ b/packages/embeds/nextjs/rollup.config.js
@@ -4,6 +4,7 @@ import { babel } from '@rollup/plugin-babel'
 import typescript from '@rollup/plugin-typescript'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
 import alias from '@rollup/plugin-alias'
+import { dts } from 'rollup-plugin-dts'

 const extensions = ['.ts', '.tsx']

@@ -33,6 +34,23 @@ const indexConfig = {
  ],
 }

-const configs = [indexConfig]
+const typesConfig = {
+  input: './src/index.ts',
+  output: [{ file: './dist/index.d.ts', format: 'es' }],
+  plugins: [
+    alias({
+      entries: [
+        { find: '@typebot.io/js', replacement: '../../js' },
+        {
+          find: '@/types',
+          replacement: '../types',
+        },
+      ],
+    }),
+    dts(),
+  ],
+}
+
+const configs = [indexConfig, typesConfig]

 export default configs
--- a/packages/embeds/nextjs/src/index.ts
+++ b/packages/embeds/nextjs/src/index.ts
@@ -1,16 +1,29 @@
+import type {
+  BotProps,
+  PopupProps,
+  BubbleProps,
+} from '@typebot.io/js/dist/index'
 import dynamic from 'next/dynamic'

-export const Standard = dynamic(
-  () => import('@typebot.io/react/src/Standard'),
-  { ssr: false }
+export const Standard: React.ComponentType<
+  BotProps & {
+    style?: React.CSSProperties
+    className?: string
+  }
+> = dynamic(() => import('@typebot.io/react/src/Standard'), { ssr: false })
+
+export const Popup: React.ComponentType<PopupProps> = dynamic(
+  () => import('@typebot.io/react/src/Popup'),
+  {
+    ssr: false,
+  }
 )

-export const Popup = dynamic(() => import('@typebot.io/react/src/Popup'), {
-  ssr: false,
-})
-
-export const Bubble = dynamic(() => import('@typebot.io/react/src/Bubble'), {
-  ssr: false,
-})
+export const Bubble: React.ComponentType<BubbleProps> = dynamic(
+  () => import('@typebot.io/react/src/Bubble'),
+  {
+    ssr: false,
+  }
+)

 export * from '@typebot.io/js'
--- a/packages/embeds/nextjs/tsconfig.json
+++ b/packages/embeds/nextjs/tsconfig.json
@@ -6,9 +6,6 @@
    "paths": {
      "@/*": ["src/*"]
    },
-    "declaration": true,
-    "declarationMap": true,
-    "outDir": "dist",
-    "emitDeclarationOnly": true
+    "outDir": "dist"
  }
 }
--- a/packages/embeds/react/package.json
+++ b/packages/embeds/react/package.json
@@ -1,6 +1,6 @@
 {
  "name": "@typebot.io/react",
-  "version": "0.2.9",
+  "version": "0.2.10",
  "description": "Convenient library to display typebots on your React app",
  "main": "dist/index.js",
  "types": "dist/index.d.ts",
@@ -37,6 +37,7 @@
    "eslint-config-custom": "workspace:*",
    "react": "18.2.0",
    "rollup": "3.26.2",
+    "rollup-plugin-dts": "^6.1.0",
    "rollup-plugin-typescript-paths": "1.4.0",
    "tslib": "2.6.0",
    "tsx": "3.12.7",
--- a/packages/embeds/react/rollup.config.js
+++ b/packages/embeds/react/rollup.config.js
@@ -4,6 +4,7 @@ import { babel } from '@rollup/plugin-babel'
 import typescript from '@rollup/plugin-typescript'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
 import alias from '@rollup/plugin-alias'
+import { dts } from 'rollup-plugin-dts'

 const extensions = ['.ts', '.tsx']

@@ -31,6 +32,23 @@ const indexConfig = {
  ],
 }

-const configs = [indexConfig]
+const typesConfig = {
+  input: './src/index.ts',
+  output: [{ file: './dist/index.d.ts', format: 'es' }],
+  plugins: [
+    alias({
+      entries: [
+        { find: '@typebot.io/js', replacement: '../../js' },
+        {
+          find: '@/types',
+          replacement: '../types',
+        },
+      ],
+    }),
+    dts(),
+  ],
+}
+
+const configs = [indexConfig, typesConfig]

 export default configs
--- a/packages/embeds/react/tsconfig.json
+++ b/packages/embeds/react/tsconfig.json
@@ -6,9 +6,6 @@
    "paths": {
      "@/*": ["src/*"]
    },
-    "declaration": true,
-    "declarationMap": true,
-    "outDir": "dist",
-    "emitDeclarationOnly": true
+    "outDir": "dist"
  }
 }
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -1051,6 +1051,9 @@ importers:
      rollup:
        specifier: 3.26.2
        version: 3.26.2
+      rollup-plugin-dts:
+        specifier: ^6.1.0
+        version: 6.1.0(rollup@3.26.2)(typescript@5.1.6)
      rollup-plugin-typescript-paths:
        specifier: 1.4.0
        version: 1.4.0(typescript@5.1.6)
@@ -1124,6 +1127,9 @@ importers:
      rollup:
        specifier: 3.26.2
        version: 3.26.2
+      rollup-plugin-dts:
+        specifier: ^6.1.0
+        version: 6.1.0(rollup@3.26.2)(typescript@5.1.6)
      rollup-plugin-typescript-paths:
        specifier: 1.4.0
        version: 1.4.0(typescript@5.1.6)
@@ -1807,6 +1813,7 @@ packages:
  /@babel/highlight@7.22.20:
    resolution: {integrity: sha512-dkdMCN3py0+ksCgYmGG8jKeGA/8Tk+gJwSYYlFGxG5lmhfKNoAy004YpLxpS1W2J8m/EK2Ew+yOs9pVRwO89mg==}
    engines: {node: '>=6.9.0'}
+    requiresBuild: true
    dependencies:
      '@babel/helper-validator-identifier': 7.22.20
      chalk: 2.4.2
@@ -12493,6 +12500,7 @@ packages:

  /color-convert@1.9.3:
    resolution: {integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==}
+    requiresBuild: true
    dependencies:
      color-name: 1.1.3

@@ -12504,6 +12512,7 @@ packages:

  /color-name@1.1.3:
    resolution: {integrity: sha512-72fSenhMw2HZMTVHeCA9KCmpEIbzWiQsjN+BHcBbS9vr1mtt+vJjPdksIBNUmKAW8TFUDPJK5SUU3QhE9NEXDw==}
+    requiresBuild: true

  /color-name@1.1.4:
    resolution: {integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==}
@@ -15540,6 +15549,7 @@ packages:
  /has-flag@3.0.0:
    resolution: {integrity: sha512-sKJf1+ceQBr4SMkvQnBDNDtf4TXpVhVGateu0t918bl30FnbE2m4vNLX+VWe/dpjlb+HugGYzW7uQXH98HPEYw==}
    engines: {node: '>=4'}
+    requiresBuild: true

  /has-flag@4.0.0:
    resolution: {integrity: sha512-EykJT/Q1KjTWctppgIAgfSO0tKVuZUjhgMr17kqTumMl6Afv3EISleU7qZUzoXDFTAHTDC4NOoG/ZxU3EvlMPQ==}
@@ -17676,7 +17686,6 @@ packages:
    engines: {node: '>=12'}
    dependencies:
      '@jridgewell/sourcemap-codec': 1.4.15
-    dev: false

  /make-dir@2.1.0:
    resolution: {integrity: sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==}
@@ -21016,6 +21025,20 @@ packages:
    dependencies:
      glob: 7.2.3

+  /rollup-plugin-dts@6.1.0(rollup@3.26.2)(typescript@5.1.6):
+    resolution: {integrity: sha512-ijSCPICkRMDKDLBK9torss07+8dl9UpY9z1N/zTeA1cIqdzMlpkV3MOOC7zukyvQfDyxa1s3Dl2+DeiP/G6DOw==}
+    engines: {node: '>=16'}
+    peerDependencies:
+      rollup: ^3.29.4 || ^4
+      typescript: ^4.5 || ^5.0
+    dependencies:
+      magic-string: 0.30.4
+      rollup: 3.26.2
+      typescript: 5.1.6
+    optionalDependencies:
+      '@babel/code-frame': 7.22.13
+    dev: true
+
  /rollup-plugin-postcss@4.0.2(postcss@8.4.26):
    resolution: {integrity: sha512-05EaY6zvZdmvPUDi3uCcAQoESDcYnv8ogJJQRp6V5kZ6J6P7uAVJlrTZcaaA20wTH527YTnKfkAoPxWI/jPp4w==}
    engines: {node: '>=10'}