💚 Fix embeds build and create-block CLI

packages/embeds/js/package.json

@@ -26,6 +26,7 @@
     "@rollup/plugin-babel": "6.0.3",
     "@rollup/plugin-node-resolve": "15.1.0",
     "@rollup/plugin-terser": "0.4.3",
+    "@rollup/plugin-typescript": "11.1.2",
     "@typebot.io/bot-engine": "workspace:*",
     "@typebot.io/env": "workspace:*",
     "@typebot.io/lib": "workspace:*",

packages/embeds/js/rollup.config.js

@@ -4,6 +4,7 @@ import { babel } from '@rollup/plugin-babel'
 import postcss from 'rollup-plugin-postcss'
 import autoprefixer from 'autoprefixer'
 import tailwindcss from 'tailwindcss'
+import typescript from '@rollup/plugin-typescript'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
 import fs from 'fs'
 
@@ -28,6 +29,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     postcss({
       plugins: [autoprefixer(), tailwindcss()],
       extract: false,

packages/embeds/nextjs/package.json

@@ -35,7 +35,8 @@
     "rollup-plugin-typescript-paths": "1.4.0",
     "tslib": "2.6.0",
     "tsx": "3.12.7",
-    "typescript": "5.3.2"
+    "typescript": "5.3.2",
+    "@rollup/plugin-typescript": "11.1.2"
   },
   "peerDependencies": {
     "next": "12.x || 13.x || 14.x",

packages/embeds/nextjs/rollup.config.js

@@ -2,6 +2,7 @@ import resolve from '@rollup/plugin-node-resolve'
 import terser from '@rollup/plugin-terser'
 import { babel } from '@rollup/plugin-babel'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
+import typescript from '@rollup/plugin-typescript'
 import fs from 'fs'
 
 const extensions = ['.ts', '.tsx']
@@ -26,6 +27,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     terser({ format: { preamble } }),
   ],
 }

packages/embeds/react/package.json

@@ -39,7 +39,8 @@
     "rollup-plugin-typescript-paths": "1.4.0",
     "tslib": "2.6.0",
     "tsx": "3.12.7",
-    "typescript": "5.3.2"
+    "typescript": "5.3.2",
+    "@rollup/plugin-typescript": "11.1.2"
   },
   "peerDependencies": {
     "react": "^16.0.0 || ^17.0.0 || ^18.0.0"

packages/embeds/react/rollup.config.js

@@ -2,6 +2,7 @@ import resolve from '@rollup/plugin-node-resolve'
 import terser from '@rollup/plugin-terser'
 import { babel } from '@rollup/plugin-babel'
 import { typescriptPaths } from 'rollup-plugin-typescript-paths'
+import typescript from '@rollup/plugin-typescript'
 import fs from 'fs'
 
 const extensions = ['.ts', '.tsx']
@@ -26,6 +27,7 @@ const indexConfig = {
       extensions,
     }),
     typescriptPaths({ preserveExtensions: true }),
+    typescript(),
     terser({ format: { preamble } }),
   ],
 }

packages/forge/blocks/anthropic/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const AnthropicLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 16 16" fill="currentColor" {...props}>

packages/forge/blocks/anthropic/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/calCom/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const CalComLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 31 31" {...props}>

packages/forge/blocks/calCom/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/chatNode/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ChatNodeLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" {...props}>

packages/forge/blocks/chatNode/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/difyAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const DifyAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 25 25" xmlns="http://www.w3.org/2000/svg" {...props}>

packages/forge/blocks/difyAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/elevenlabs/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ElevenlabsLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 100 100" {...props}>

packages/forge/blocks/elevenlabs/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/mistral/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const MistralLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 256 233" {...props}>

packages/forge/blocks/mistral/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/openRouter/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const OpenRouterLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 512 512" fill="#71717A" stroke="#71717A" {...props}>

packages/forge/blocks/openRouter/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/openai/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const OpenAILightLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 24 24" fill="#000100" {...props}>

packages/forge/blocks/openai/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/qrcode/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const QrCodeLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg

packages/forge/blocks/qrcode/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/togetherAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const TogetherAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 32 32" {...props}>

packages/forge/blocks/togetherAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/blocks/zemanticAi/logo.tsx

@@ -1,4 +1,4 @@
-import React from 'react'
+/** @jsxImportSource react */
 
 export const ZemanticAiLogo = (props: React.SVGProps<SVGSVGElement>) => (
   <svg viewBox="0 0 24 24" {...props}>

packages/forge/blocks/zemanticAi/tsconfig.json

@@ -5,6 +5,7 @@
   "compilerOptions": {
     "lib": ["ESNext", "DOM"],
     "noEmit": true,
-    "jsx": "react"
+    "jsx": "preserve",
+    "jsxImportSource": "react"
   }
 }

packages/forge/cli/index.ts

@@ -84,6 +84,7 @@ const main = async () => {
   await createLogoFile(newBlockPath, prompt)
   if (prompt.auth !== 'none') await createAuthFile(newBlockPath, prompt)
   await createSchemasFile(newBlockPath, prompt)
+  await addBlockToRepository(prompt)
   s.stop('Creating files...')
   s.start('Installing dependencies...')
   await new Promise<void>((resolve, reject) => {
@@ -186,7 +187,8 @@ const createTsConfig = async (path: string) => {
         compilerOptions: {
           lib: ['ESNext', 'DOM'],
           noEmit: true,
-          jsx: 'react',
+          jsx: 'preserve',
+          jsxImportSource: 'react',
         },
       }),
       { parser: 'json', ...prettierRc }
@@ -201,7 +203,7 @@ const createLogoFile = async (
   writeFileSync(
     join(path, 'logo.tsx'),
     await prettier.format(
-      `import React from 'react'
+      `/** @jsxImportSource react */
 
       export const ${capitalize(
         camelCaseId
@@ -244,6 +246,19 @@ const createAuthFile = async (
     )
   )
 
+const addBlockToRepository = async ({
+  camelCaseId,
+  id,
+}: {
+  camelCaseId: string
+  id: string
+}) => {
+  const schemasPath = await addBlockToRepoPackageJson(id)
+  await addBlockToRepoDefinitions(schemasPath, camelCaseId, id)
+  await addBlockToRepoConstants(schemasPath, id)
+  await addBlockToRepoSchemas(schemasPath, camelCaseId, id)
+}
+
 const createSchemasFile = async (
   path: string,
   {
@@ -265,6 +280,111 @@ export const ${camelCaseName}CredentialsSchema = parseBlockCredentials(${camelCa
   )
 }
 
+async function addBlockToRepoDefinitions(
+  schemasPath: string,
+  camelCaseId: string,
+  id: string
+) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'definitions.ts')
+  ).toString()
+  const importStatement = `import { ${camelCaseId}Block } from '@typebot.io/${id}-block'`
+  const objectEntry = `  [${camelCaseId}Block.id]: ${camelCaseId}Block,`
+  const nextLineImportIndex = existingDefinitionsData.indexOf(
+    '\n',
+    existingDefinitionsData.lastIndexOf('import')
+  )
+
+  const newObjectEntryIndex = existingDefinitionsData.lastIndexOf(',') + 1
+
+  const newDefinitionsData = `${existingDefinitionsData.slice(
+    0,
+    nextLineImportIndex
+  )}
+${importStatement}
+${existingDefinitionsData.slice(nextLineImportIndex, newObjectEntryIndex)}
+${objectEntry}
+${existingDefinitionsData.slice(newObjectEntryIndex)}`
+
+  writeFileSync(
+    join(schemasPath, 'definitions.ts'),
+    await prettier.format(newDefinitionsData, {
+      parser: 'typescript',
+      ...prettierRc,
+    })
+  )
+}
+
+async function addBlockToRepoSchemas(
+  schemasPath: string,
+  camelCaseId: string,
+  id: string
+) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'schemas.ts')
+  ).toString()
+  const importStatement = `import { ${camelCaseId}Block } from '@typebot.io/${id}-block'
+import { ${camelCaseId}BlockSchema } from '@typebot.io/${id}-block/schemas'`
+  const objectEntry = `  [${camelCaseId}Block.id]: ${camelCaseId}BlockSchema,`
+  const nextLineImportIndex = existingDefinitionsData.indexOf(
+    '\n',
+    existingDefinitionsData.lastIndexOf('import')
+  )
+
+  const newObjectEntryIndex = existingDefinitionsData.lastIndexOf(',') + 1
+
+  const newDefinitionsData = `${existingDefinitionsData.slice(
+    0,
+    nextLineImportIndex
+  )}
+${importStatement}
+${existingDefinitionsData.slice(nextLineImportIndex, newObjectEntryIndex)}
+${objectEntry}
+${existingDefinitionsData.slice(newObjectEntryIndex)}`
+
+  writeFileSync(
+    join(schemasPath, 'schemas.ts'),
+    await prettier.format(newDefinitionsData, {
+      parser: 'typescript',
+      ...prettierRc,
+    })
+  )
+}
+
+async function addBlockToRepoConstants(schemasPath: string, id: string) {
+  const existingDefinitionsData = readFileSync(
+    join(schemasPath, 'constants.ts')
+  ).toString()
+
+  writeFileSync(
+    join(schemasPath, 'constants.ts'),
+    await prettier.format(
+      existingDefinitionsData.replace(
+        `] as const satisfies ForgedBlock['type'][]`,
+        `'${id}'] as const satisfies ForgedBlock['type'][]`
+      ),
+      {
+        parser: 'typescript',
+        ...prettierRc,
+      }
+    )
+  )
+}
+
+async function addBlockToRepoPackageJson(id: string) {
+  const schemasPath = join(process.cwd(), `../repository`)
+  const packageJson = require(join(schemasPath, 'package.json'))
+  packageJson.devDependencies[`@typebot.io/${id}-block`] = 'workspace:*'
+  writeFileSync(
+    join(schemasPath, 'package.json'),
+    await prettier.format(JSON.stringify(packageJson, null, 2), {
+      parser: 'json',
+      ...prettierRc,
+    })
+  )
+  return schemasPath
+}
+
 main()
   .then()
   .catch((err) => {

packages/forge/repository/constants.ts

@@ -1,3 +1,4 @@
+// Do not edit this file manually
 import { ForgedBlock } from './types'
 
 export const forgedBlockIds = [

packages/forge/repository/definitions.ts

@@ -23,4 +23,4 @@ export const forgedBlocks = {
   [anthropicBlock.id]: anthropicBlock,
   [togetherAiBlock.id]: togetherAiBlock,
   [openRouterBlock.id]: openRouterBlock,
-} as const
+}

packages/forge/repository/schemas.ts

@@ -1,3 +1,4 @@
+// Do not edit this file manually
 import { anthropicBlock } from '@typebot.io/anthropic-block'
 import { anthropicBlockSchema } from '@typebot.io/anthropic-block/schemas'
 import { calComBlock } from '@typebot.io/cal-com-block'

packages/lib/package.json

@@ -16,6 +16,7 @@
     "@types/validator": "13.11.9",
     "next": "14.1.0",
     "nodemailer": "6.9.3",
+    "tslib": "2.6.0",
     "typescript": "5.3.2"
   },
   "peerDependencies": {

packages/lib/tsconfig.json

@@ -3,6 +3,7 @@
   "include": ["**/*.ts"],
   "exclude": ["node_modules"],
   "compilerOptions": {
-    "lib": ["ES2021", "DOM"]
+    "lib": ["ES2021", "DOM"],
+    "importHelpers": true
   }
 }

pnpm-lock.yaml

@@ -954,6 +954,9 @@ importers:
       '@rollup/plugin-terser':
         specifier: 0.4.3
         version: 0.4.3(rollup@3.26.2)
+      '@rollup/plugin-typescript':
+        specifier: 11.1.2
+        version: 11.1.2(rollup@3.26.2)(tslib@2.6.0)(typescript@5.3.2)
       '@typebot.io/bot-engine':
         specifier: workspace:*
         version: link:../../bot-engine
@@ -1033,6 +1036,9 @@ importers:
       '@rollup/plugin-terser':
         specifier: 0.4.3
         version: 0.4.3(rollup@3.26.2)
+      '@rollup/plugin-typescript':
+        specifier: 11.1.2
+        version: 11.1.2(rollup@3.26.2)(tslib@2.6.0)(typescript@5.3.2)
       '@typebot.io/js':
         specifier: workspace:*
         version: link:../js
@@ -1103,6 +1109,9 @@ importers:
       '@rollup/plugin-terser':
         specifier: 0.4.3
         version: 0.4.3(rollup@3.26.2)
+      '@rollup/plugin-typescript':
+        specifier: 11.1.2
+        version: 11.1.2(rollup@3.26.2)(tslib@2.6.0)(typescript@5.3.2)
       '@typebot.io/js':
         specifier: workspace:*
         version: link:../js
@@ -1615,6 +1624,9 @@ importers:
       nodemailer:
         specifier: 6.9.3
         version: 6.9.3
+      tslib:
+        specifier: 2.6.0
+        version: 2.6.0
       typescript:
         specifier: 5.3.2
         version: 5.3.2
@@ -8690,6 +8702,26 @@ packages:
       terser: 5.29.1
     dev: true
 
+  /@rollup/plugin-typescript@11.1.2(rollup@3.26.2)(tslib@2.6.0)(typescript@5.3.2):
+    resolution: {integrity: sha512-0ghSOCMcA7fl1JM+0gYRf+Q/HWyg+zg7/gDSc+fRLmlJWcW5K1I+CLRzaRhXf4Y3DRyPnnDo4M2ktw+a6JcDEg==}
+    engines: {node: '>=14.0.0'}
+    peerDependencies:
+      rollup: ^2.14.0||^3.0.0
+      tslib: '*'
+      typescript: '>=3.7.0'
+    peerDependenciesMeta:
+      rollup:
+        optional: true
+      tslib:
+        optional: true
+    dependencies:
+      '@rollup/pluginutils': 5.1.0(rollup@3.26.2)
+      resolve: 1.22.8
+      rollup: 3.26.2
+      tslib: 2.6.0
+      typescript: 5.3.2
+    dev: true
+
   /@rollup/pluginutils@5.1.0(rollup@2.78.0):
     resolution: {integrity: sha512-XTIWOPPcpvyKI6L1NHo0lFlCyznUEyPmPY1mc3KpPVDYulHSTvyeLNVW00QTLIAFNhR3kYnJTQHeGqU4M3n09g==}
     engines: {node: '>=14.0.0'}