⚡ (engine) Improve engine overall robustness
This commit is contained in:
Baptiste Arnaud
@ -3,14 +3,13 @@
|
||||
"version": "0.0.1",
|
||||
"description": "React library to display typebots on your website",
|
||||
"main": "dist/index.js",
|
||||
"module": "dist/index.mjs",
|
||||
"types": "dist/index.d.ts",
|
||||
"type": "module",
|
||||
"scripts": {
|
||||
"db:seed": "tsx scripts/seedDatabase.ts",
|
||||
"stories:dev": "pnpm db:seed && ladle serve -p 3006",
|
||||
"stories:dev": "ladle serve -p 3006",
|
||||
"stories:build": "ladle build",
|
||||
"build": "pnpm tsc --noEmit && tsup",
|
||||
"dev": "tsup --watch",
|
||||
"dev": "rollup --watch --config rollup.config.js",
|
||||
"build": "rollup --config rollup.config.js",
|
||||
"lint": "eslint --fix \"src/**/*.ts*\""
|
||||
},
|
||||
"keywords": [],
|
||||
@ -20,21 +19,29 @@
|
||||
"@ladle/react": "^2.4.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@babel/preset-react": "^7.18.6",
|
||||
"@rollup/plugin-babel": "6.0.3",
|
||||
"@rollup/plugin-node-resolve": "15.0.1",
|
||||
"@rollup/plugin-terser": "^0.3.0",
|
||||
"@rollup/plugin-typescript": "11.0.0",
|
||||
"@typebot.io/js": "workspace:*",
|
||||
"@types/node": "18.11.18",
|
||||
"@types/react": "18.0.27",
|
||||
"db": "workspace:*",
|
||||
"eslint": "^8.32.0",
|
||||
"eslint-config-custom": "workspace:*",
|
||||
"models": "workspace:*",
|
||||
"react": "18.2.0",
|
||||
"rollup": "3.10.0",
|
||||
"rollup-plugin-typescript-paths": "^1.4.0",
|
||||
"tsconfig": "workspace:*",
|
||||
"tsup": "6.5.0",
|
||||
"tslib": "^2.4.1",
|
||||
"tsx": "3.12.2",
|
||||
"typescript": "^4.9.4",
|
||||
"utils": "workspace:*",
|
||||
"models": "workspace:*"
|
||||
"utils": "workspace:*"
|
||||
},
|
||||
"peerDependencies": {
|
||||
"react": "18.0.0"
|
||||
"react": "18.0.0",
|
||||
"@typebot.io/js": "workspace:*"
|
||||
}
|
||||
}
|
||||
|
||||
32
packages/react/rollup.config.js
Normal file
32
packages/react/rollup.config.js
Normal file
@ -0,0 +1,32 @@
|
||||
import resolve from '@rollup/plugin-node-resolve'
|
||||
import terser from '@rollup/plugin-terser'
|
||||
import { babel } from '@rollup/plugin-babel'
|
||||
import typescript from '@rollup/plugin-typescript'
|
||||
import { typescriptPaths } from 'rollup-plugin-typescript-paths'
|
||||
|
||||
const extensions = ['.ts', '.tsx']
|
||||
|
||||
const indexConfig = {
|
||||
input: './src/index.ts',
|
||||
output: {
|
||||
file: './dist/index.js',
|
||||
format: 'es',
|
||||
},
|
||||
external: ['react', 'react/jsx-runtime', '@typebot.io/js'],
|
||||
plugins: [
|
||||
resolve({ extensions }),
|
||||
babel({
|
||||
babelHelpers: 'bundled',
|
||||
exclude: 'node_modules/**',
|
||||
presets: ['@babel/preset-react', '@babel/preset-typescript'],
|
||||
extensions,
|
||||
}),
|
||||
typescript(),
|
||||
typescriptPaths({ preserveExtensions: true }),
|
||||
terser({ output: { comments: false } }),
|
||||
],
|
||||
}
|
||||
|
||||
const configs = [indexConfig]
|
||||
|
||||
export default configs
|
||||
@ -1,486 +0,0 @@
|
||||
{
|
||||
"id": "clckrl4q5000t3b6sabwokaar",
|
||||
"createdAt": "2023-01-06T17:01:33.101Z",
|
||||
"updatedAt": "2023-01-06T17:02:28.305Z",
|
||||
"icon": "🤝",
|
||||
"name": "Lead Generation copy",
|
||||
"publishedTypebotId": null,
|
||||
"folderId": null,
|
||||
"groups": [
|
||||
{
|
||||
"id": "clckrl4q5000g3b6skizhd262",
|
||||
"title": "Start",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "22HP69iipkLjJDTUcc1AWW",
|
||||
"type": "start",
|
||||
"label": "Start",
|
||||
"groupId": "clckrl4q5000g3b6skizhd262",
|
||||
"outgoingEdgeId": "clckrlxp400173b6sktq7gqm2"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 0, "y": 0 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000h3b6sjipn4qga",
|
||||
"title": "Welcome",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "sc1y8VwDabNJgiVTBi4qtif",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>Welcome to <span class=\"slate-bold\">AA</span> (Awesome Agency)</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [
|
||||
{ "text": "Welcome to " },
|
||||
{ "bold": true, "text": "AA" },
|
||||
{ "text": " (Awesome Agency)" }
|
||||
]
|
||||
}
|
||||
],
|
||||
"plainText": "Welcome to AA (Awesome Agency)"
|
||||
},
|
||||
"groupId": "clckrl4q5000h3b6sjipn4qga"
|
||||
},
|
||||
{
|
||||
"id": "s7YqZTBeyCa4Hp3wN2j922c",
|
||||
"type": "image",
|
||||
"content": {
|
||||
"url": "https://media2.giphy.com/media/XD9o33QG9BoMis7iM4/giphy.gif?cid=fe3852a3ihg8rvipzzky5lybmdyq38fhke2tkrnshwk52c7d&rid=giphy.gif&ct=g"
|
||||
},
|
||||
"groupId": "clckrl4q5000h3b6sjipn4qga"
|
||||
},
|
||||
{
|
||||
"id": "sbjZWLJGVkHAkDqS4JQeGow",
|
||||
"type": "choice input",
|
||||
"items": [
|
||||
{
|
||||
"id": "hQw2zbp7FDX7XYK9cFpbgC",
|
||||
"type": 0,
|
||||
"blockId": "sbjZWLJGVkHAkDqS4JQeGow",
|
||||
"content": "Hi!"
|
||||
}
|
||||
],
|
||||
"groupId": "clckrl4q5000h3b6sjipn4qga",
|
||||
"options": { "buttonLabel": "Send", "isMultipleChoice": false },
|
||||
"outgoingEdgeId": "clckrm7td001b3b6s2769fh7k"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": -8.26171875, "y": 457.515625 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000i3b6stgxyvscq",
|
||||
"title": "Email",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "sxeYubYN6XzhAfG7m9Fivhc",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>Great! Nice to meet you {{Name}}</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [{ "text": "Great! Nice to meet you {{Name}}" }]
|
||||
}
|
||||
],
|
||||
"plainText": "Great! Nice to meet you {{Name}}"
|
||||
},
|
||||
"groupId": "clckrl4q5000i3b6stgxyvscq"
|
||||
},
|
||||
{
|
||||
"id": "scQ5kduafAtfP9T8SHUJnGi",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>What's the best email we can reach you at?</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [
|
||||
{ "text": "What's the best email we can reach you at?" }
|
||||
]
|
||||
}
|
||||
],
|
||||
"plainText": "What's the best email we can reach you at?"
|
||||
},
|
||||
"groupId": "clckrl4q5000i3b6stgxyvscq"
|
||||
},
|
||||
{
|
||||
"id": "snbsad18Bgry8yZ8DZCfdFD",
|
||||
"type": "email input",
|
||||
"groupId": "clckrl4q5000i3b6stgxyvscq",
|
||||
"options": {
|
||||
"labels": { "button": "Send", "placeholder": "Type your email..." },
|
||||
"variableId": "v3VFChNVSCXQ2rXv4DrJ8Ah",
|
||||
"retryMessageContent": "This email doesn't seem to be valid. Can you type it again?"
|
||||
},
|
||||
"outgoingEdgeId": "clckrl4q5000q3b6s5czdtm8x"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 669, "y": 141 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000j3b6sloirnxza",
|
||||
"title": "Name",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "sgtE2Sy7cKykac9B223Kq9R",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>What's your name?</div>",
|
||||
"richText": [
|
||||
{ "type": "p", "children": [{ "text": "What's your name?" }] }
|
||||
],
|
||||
"plainText": "What's your name?"
|
||||
},
|
||||
"groupId": "clckrl4q5000j3b6sloirnxza"
|
||||
},
|
||||
{
|
||||
"id": "sqEsMo747LTDnY9FjQcEwUv",
|
||||
"type": "text input",
|
||||
"groupId": "clckrl4q5000j3b6sloirnxza",
|
||||
"options": {
|
||||
"isLong": false,
|
||||
"labels": {
|
||||
"button": "Send",
|
||||
"placeholder": "Type your answer..."
|
||||
},
|
||||
"variableId": "giiLFGw5xXBCHzvp1qAbdX"
|
||||
},
|
||||
"outgoingEdgeId": "clckrl4q5000p3b6shb5bfnzt"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 340, "y": 143 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000k3b6s0anufmgy",
|
||||
"title": "Services",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "su7HceVXWyTCzi2vv3m4QbK",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>What services are you interested in?</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [{ "text": "What services are you interested in?" }]
|
||||
}
|
||||
],
|
||||
"plainText": "What services are you interested in?"
|
||||
},
|
||||
"groupId": "clckrl4q5000k3b6s0anufmgy"
|
||||
},
|
||||
{
|
||||
"id": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"type": "choice input",
|
||||
"items": [
|
||||
{
|
||||
"id": "fnLCBF4NdraSwcubnBhk8H",
|
||||
"type": 0,
|
||||
"blockId": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"content": "Website dev"
|
||||
},
|
||||
{
|
||||
"id": "a782h8ynMouY84QjH7XSnR",
|
||||
"type": 0,
|
||||
"blockId": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"content": "Content Marketing"
|
||||
},
|
||||
{
|
||||
"id": "jGvh94zBByvVFpSS3w97zY",
|
||||
"type": 0,
|
||||
"blockId": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"content": "Social Media"
|
||||
},
|
||||
{
|
||||
"id": "6PRLbKUezuFmwWtLVbvAQ7",
|
||||
"type": 0,
|
||||
"blockId": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"content": "UI / UX Design"
|
||||
}
|
||||
],
|
||||
"groupId": "clckrl4q5000k3b6s0anufmgy",
|
||||
"options": { "buttonLabel": "Send", "isMultipleChoice": true },
|
||||
"outgoingEdgeId": "clckrl4q5000r3b6s9yxsuxu7"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 1002, "y": 144 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000l3b6scn1r1nns",
|
||||
"title": "Additional information",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "sqR8Sz9gW21aUYKtUikq7qZ",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>Can you tell me a bit more about your needs?</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [
|
||||
{ "text": "Can you tell me a bit more about your needs?" }
|
||||
]
|
||||
}
|
||||
],
|
||||
"plainText": "Can you tell me a bit more about your needs?"
|
||||
},
|
||||
"groupId": "clckrl4q5000l3b6scn1r1nns"
|
||||
},
|
||||
{
|
||||
"id": "sqFy2G3C1mh9p6s3QBdSS5x",
|
||||
"type": "text input",
|
||||
"groupId": "clckrl4q5000l3b6scn1r1nns",
|
||||
"options": {
|
||||
"isLong": true,
|
||||
"labels": { "button": "Send", "placeholder": "Type your answer..." }
|
||||
},
|
||||
"outgoingEdgeId": "clckrl4q5000s3b6stx5nnqbz"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 1337, "y": 145 }
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000m3b6srabr5a2s",
|
||||
"title": "Bye",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "seLegenCgUwMopRFeAefqZ7",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>Perfect!</div>",
|
||||
"richText": [{ "type": "p", "children": [{ "text": "Perfect!" }] }],
|
||||
"plainText": "Perfect!"
|
||||
},
|
||||
"groupId": "clckrl4q5000m3b6srabr5a2s"
|
||||
},
|
||||
{
|
||||
"id": "s779Q1y51aVaDUJVrFb16vv",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>We'll get back to you at {{Email}}</div>",
|
||||
"richText": [
|
||||
{
|
||||
"type": "p",
|
||||
"children": [{ "text": "We'll get back to you at {{Email}}" }]
|
||||
}
|
||||
],
|
||||
"plainText": "We'll get back to you at {{Email}}"
|
||||
},
|
||||
"groupId": "clckrl4q5000m3b6srabr5a2s"
|
||||
}
|
||||
],
|
||||
"graphCoordinates": { "x": 1668, "y": 143 }
|
||||
},
|
||||
{
|
||||
"id": "clckrlksq000z3b6sequnj9m3",
|
||||
"graphCoordinates": { "x": -355.04296875, "y": 187.5078125 },
|
||||
"title": "Group #7",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "clckrlksq00103b6s3exi90al",
|
||||
"groupId": "clckrlksq000z3b6sequnj9m3",
|
||||
"type": "Condition",
|
||||
"items": [
|
||||
{
|
||||
"id": "clckrlksq00113b6sz8naxdwx",
|
||||
"blockId": "clckrlksq00103b6s3exi90al",
|
||||
"type": 1,
|
||||
"content": {
|
||||
"comparisons": [
|
||||
{
|
||||
"id": "clckrllsm00123b6sz38325aw",
|
||||
"variableId": "giiLFGw5xXBCHzvp1qAbdX",
|
||||
"comparisonOperator": "Is set"
|
||||
}
|
||||
],
|
||||
"logicalOperator": "AND"
|
||||
},
|
||||
"outgoingEdgeId": "clckrlt0000143b6sn9euzwnm"
|
||||
}
|
||||
],
|
||||
"outgoingEdgeId": "clckrluh600153b6s66p2q6wa"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "clckrm1zq00183b6sz8ydapth",
|
||||
"graphCoordinates": { "x": 333.8046875, "y": 408.1328125 },
|
||||
"title": "Group #7 copy",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "clckrm1zr00193b6szpz37plc",
|
||||
"groupId": "clckrm1zq00183b6sz8ydapth",
|
||||
"type": "Condition",
|
||||
"items": [
|
||||
{
|
||||
"id": "clckrm1zr001a3b6s1hlfm2jh",
|
||||
"blockId": "clckrm1zr00193b6szpz37plc",
|
||||
"type": 1,
|
||||
"content": {
|
||||
"comparisons": [
|
||||
{
|
||||
"id": "clckrllsm00123b6sz38325aw",
|
||||
"variableId": "giiLFGw5xXBCHzvp1qAbdX",
|
||||
"comparisonOperator": "Is set"
|
||||
}
|
||||
],
|
||||
"logicalOperator": "AND"
|
||||
},
|
||||
"outgoingEdgeId": "clckrma26001c3b6sup2bdbte"
|
||||
}
|
||||
],
|
||||
"outgoingEdgeId": "clckrmbbk001d3b6shr35s2ao"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"id": "clckrlqil00133b6sk6msgqt1",
|
||||
"graphCoordinates": { "x": -23.78515625, "y": 199.6875 },
|
||||
"title": "Group #8",
|
||||
"blocks": [
|
||||
{
|
||||
"id": "clckrl870000y3b6sxyd24qwc",
|
||||
"groupId": "clckrlqil00133b6sk6msgqt1",
|
||||
"type": "text",
|
||||
"content": {
|
||||
"html": "<div>Hi {{Name}}!</div>",
|
||||
"richText": [
|
||||
{ "type": "p", "children": [{ "text": "Hi {{Name}}!" }] }
|
||||
],
|
||||
"plainText": "Hi {{Name}}!"
|
||||
},
|
||||
"outgoingEdgeId": "clckrlwmd00163b6sjlass4p8"
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
"variables": [
|
||||
{ "id": "giiLFGw5xXBCHzvp1qAbdX", "name": "Name" },
|
||||
{ "id": "v3VFChNVSCXQ2rXv4DrJ8Ah", "name": "Email" }
|
||||
],
|
||||
"edges": [
|
||||
{
|
||||
"id": "clckrl4q5000p3b6shb5bfnzt",
|
||||
"to": { "groupId": "clckrl4q5000i3b6stgxyvscq" },
|
||||
"from": {
|
||||
"blockId": "sqEsMo747LTDnY9FjQcEwUv",
|
||||
"groupId": "clckrl4q5000j3b6sloirnxza"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000q3b6s5czdtm8x",
|
||||
"to": { "groupId": "clckrl4q5000k3b6s0anufmgy" },
|
||||
"from": {
|
||||
"blockId": "snbsad18Bgry8yZ8DZCfdFD",
|
||||
"groupId": "clckrl4q5000i3b6stgxyvscq"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000r3b6s9yxsuxu7",
|
||||
"to": { "groupId": "clckrl4q5000l3b6scn1r1nns" },
|
||||
"from": {
|
||||
"blockId": "s5VQGsVF4hQgziQsXVdwPDW",
|
||||
"groupId": "clckrl4q5000k3b6s0anufmgy"
|
||||
}
|
||||
},
|
||||
{
|
||||
"id": "clckrl4q5000s3b6stx5nnqbz",
|
||||
"to": { "groupId": "clckrl4q5000m3b6srabr5a2s" },
|
||||
"from": {
|
||||
"blockId": "sqFy2G3C1mh9p6s3QBdSS5x",
|
||||
"groupId": "clckrl4q5000l3b6scn1r1nns"
|
||||
}
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrlksq000z3b6sequnj9m3",
|
||||
"blockId": "clckrlksq00103b6s3exi90al",
|
||||
"itemId": "clckrlksq00113b6sz8naxdwx"
|
||||
},
|
||||
"to": { "groupId": "clckrlqil00133b6sk6msgqt1" },
|
||||
"id": "clckrlt0000143b6sn9euzwnm"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrlksq000z3b6sequnj9m3",
|
||||
"blockId": "clckrlksq00103b6s3exi90al"
|
||||
},
|
||||
"to": { "groupId": "clckrl4q5000h3b6sjipn4qga" },
|
||||
"id": "clckrluh600153b6s66p2q6wa"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrlqil00133b6sk6msgqt1",
|
||||
"blockId": "clckrl870000y3b6sxyd24qwc"
|
||||
},
|
||||
"to": { "groupId": "clckrl4q5000h3b6sjipn4qga" },
|
||||
"id": "clckrlwmd00163b6sjlass4p8"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrl4q5000g3b6skizhd262",
|
||||
"blockId": "22HP69iipkLjJDTUcc1AWW"
|
||||
},
|
||||
"to": { "groupId": "clckrlksq000z3b6sequnj9m3" },
|
||||
"id": "clckrlxp400173b6sktq7gqm2"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrl4q5000h3b6sjipn4qga",
|
||||
"blockId": "sbjZWLJGVkHAkDqS4JQeGow"
|
||||
},
|
||||
"to": { "groupId": "clckrm1zq00183b6sz8ydapth" },
|
||||
"id": "clckrm7td001b3b6s2769fh7k"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrm1zq00183b6sz8ydapth",
|
||||
"blockId": "clckrm1zr00193b6szpz37plc",
|
||||
"itemId": "clckrm1zr001a3b6s1hlfm2jh"
|
||||
},
|
||||
"to": { "groupId": "clckrl4q5000i3b6stgxyvscq" },
|
||||
"id": "clckrma26001c3b6sup2bdbte"
|
||||
},
|
||||
{
|
||||
"from": {
|
||||
"groupId": "clckrm1zq00183b6sz8ydapth",
|
||||
"blockId": "clckrm1zr00193b6szpz37plc"
|
||||
},
|
||||
"to": { "groupId": "clckrl4q5000j3b6sloirnxza" },
|
||||
"id": "clckrmbbk001d3b6shr35s2ao"
|
||||
}
|
||||
],
|
||||
"theme": {
|
||||
"chat": {
|
||||
"inputs": {
|
||||
"color": "#303235",
|
||||
"backgroundColor": "#FFFFFF",
|
||||
"placeholderColor": "#9095A0"
|
||||
},
|
||||
"buttons": { "color": "#FFFFFF", "backgroundColor": "#0042DA" },
|
||||
"hostAvatar": {
|
||||
"url": "https://avatars.githubusercontent.com/u/16015833?v=4",
|
||||
"isEnabled": true
|
||||
},
|
||||
"hostBubbles": { "color": "#303235", "backgroundColor": "#F7F8FF" },
|
||||
"guestBubbles": { "color": "#FFFFFF", "backgroundColor": "#FF8E21" }
|
||||
},
|
||||
"general": { "font": "Open Sans", "background": { "type": "None" } }
|
||||
},
|
||||
"settings": {
|
||||
"general": { "isBrandingEnabled": true },
|
||||
"metadata": {
|
||||
"description": "Build beautiful conversational forms and embed them directly in your applications without a line of code. Triple your response rate and collect answers that has more value compared to a traditional form."
|
||||
},
|
||||
"typingEmulation": { "speed": 300, "enabled": true, "maxDelay": 1.5 }
|
||||
},
|
||||
"publicId": null,
|
||||
"customDomain": null,
|
||||
"workspaceId": "clc0lcuiu00021awrludgbbym",
|
||||
"resultsTablePreferences": null,
|
||||
"isArchived": false,
|
||||
"isClosed": false
|
||||
}
|
||||
@ -1,60 +0,0 @@
|
||||
import { PrismaClient } from 'db'
|
||||
import { Typebot } from 'models'
|
||||
import { parseCreateTypebot } from 'utils/playwright/databaseActions'
|
||||
import { join } from 'path'
|
||||
import { parseTypebotToPublicTypebot } from 'utils/playwright/databaseHelpers'
|
||||
import { readFileSync } from 'fs'
|
||||
|
||||
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
||||
require('dotenv').config({
|
||||
override: true,
|
||||
path: join(__dirname, `.env.local`),
|
||||
})
|
||||
|
||||
const seedDatabase = async () => {
|
||||
const prisma = new PrismaClient()
|
||||
const data = JSON.parse(
|
||||
readFileSync(join(__dirname, 'ladleTypebot.json')).toString()
|
||||
) as Typebot
|
||||
|
||||
const ladleWorkspace = {
|
||||
id: 'ladleWorkspace',
|
||||
name: 'Ladle',
|
||||
}
|
||||
await prisma.workspace.upsert({
|
||||
where: { id: ladleWorkspace.id },
|
||||
update: {},
|
||||
create: ladleWorkspace,
|
||||
})
|
||||
const ladleTypebot = parseCreateTypebot({
|
||||
...data,
|
||||
id: 'ladleTypebot',
|
||||
folderId: undefined,
|
||||
workspaceId: ladleWorkspace.id,
|
||||
theme: {
|
||||
...data.theme,
|
||||
chat: {
|
||||
...data.theme.chat,
|
||||
hostAvatar: {
|
||||
isEnabled: true,
|
||||
},
|
||||
},
|
||||
},
|
||||
}) as Typebot
|
||||
const ladlePublicTypebot = parseTypebotToPublicTypebot(
|
||||
ladleTypebot.id + 'Public',
|
||||
ladleTypebot
|
||||
)
|
||||
await prisma.typebot.upsert({
|
||||
where: { id: ladleTypebot.id },
|
||||
update: ladleTypebot,
|
||||
create: ladleTypebot,
|
||||
})
|
||||
await prisma.publicTypebot.upsert({
|
||||
where: { id: ladlePublicTypebot.id },
|
||||
update: ladlePublicTypebot,
|
||||
create: ladlePublicTypebot,
|
||||
})
|
||||
}
|
||||
|
||||
seedDatabase().then()
|
||||
@ -1,8 +1,7 @@
|
||||
import { useEffect, useRef } from 'react'
|
||||
import type { BubbleProps } from '@typebot.io/js'
|
||||
import { defaultBubbleProps } from './constants'
|
||||
|
||||
type Props = BubbleProps & { style?: React.CSSProperties; className?: string }
|
||||
type Props = BubbleProps
|
||||
|
||||
declare global {
|
||||
namespace JSX {
|
||||
@ -15,49 +14,40 @@ declare global {
|
||||
}
|
||||
}
|
||||
|
||||
export const Bubble = ({ style, className, ...props }: Props) => {
|
||||
const ref = useRef<(HTMLDivElement & Props) | null>(null)
|
||||
type BubbleElement = HTMLElement & Props
|
||||
|
||||
export const Bubble = (props: Props) => {
|
||||
const ref = useRef<BubbleElement | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
const { registerBubbleComponent } = await import('@typebot.io/js')
|
||||
registerBubbleComponent(defaultBubbleProps)
|
||||
await import('@typebot.io/js/dist/web')
|
||||
})()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (!ref.current) return
|
||||
ref.current.typebot = props.typebot
|
||||
ref.current.prefilledVariables = props.prefilledVariables
|
||||
ref.current.onClose = props.onClose
|
||||
ref.current.onOpen = props.onOpen
|
||||
ref.current.onNewInputBlock = props.onNewInputBlock
|
||||
ref.current.onAnswer = props.onAnswer
|
||||
ref.current.onPreviewMessageClick = props.onPreviewMessageClick
|
||||
ref.current.onEnd = props.onEnd
|
||||
ref.current.onInit = props.onInit
|
||||
}, [
|
||||
props.onAnswer,
|
||||
props.onClose,
|
||||
props.onNewInputBlock,
|
||||
props.onOpen,
|
||||
props.onPreviewMessageClick,
|
||||
props.prefilledVariables,
|
||||
props.typebot,
|
||||
props.onEnd,
|
||||
props.onInit,
|
||||
])
|
||||
const updateProps = (element: BubbleElement | null, props: Props) => {
|
||||
if (!element) return
|
||||
Object.assign(element, props)
|
||||
}
|
||||
|
||||
return (
|
||||
<typebot-bubble
|
||||
ref={ref}
|
||||
api-host={props.apiHost}
|
||||
start-group-id={props.startGroupId}
|
||||
result-id={props.resultId}
|
||||
is-preview={props.isPreview}
|
||||
class={className}
|
||||
style={style}
|
||||
/>
|
||||
)
|
||||
const initBubble = async () => {
|
||||
const bubbleElement = document.createElement(
|
||||
'typebot-bubble'
|
||||
) as BubbleElement
|
||||
ref.current = bubbleElement
|
||||
document.body.append(bubbleElement)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
if (!ref.current) await initBubble()
|
||||
updateProps(ref.current, props)
|
||||
})()
|
||||
|
||||
return () => {
|
||||
ref.current?.remove()
|
||||
}
|
||||
}, [props])
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
@ -1,8 +1,7 @@
|
||||
import { useEffect, useRef } from 'react'
|
||||
import type { PopupProps } from '@typebot.io/js'
|
||||
import { defaultPopupProps } from './constants'
|
||||
|
||||
type Props = PopupProps & { style?: React.CSSProperties; className?: string }
|
||||
type Props = PopupProps
|
||||
|
||||
declare global {
|
||||
namespace JSX {
|
||||
@ -15,49 +14,38 @@ declare global {
|
||||
}
|
||||
}
|
||||
|
||||
export const Popup = ({ style, className, ...props }: Props) => {
|
||||
const ref = useRef<(HTMLDivElement & Props) | null>(null)
|
||||
type PopupElement = HTMLElement & Props
|
||||
|
||||
export const Popup = (props: Props) => {
|
||||
const ref = useRef<PopupElement | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
const { registerPopupComponent } = await import('@typebot.io/js')
|
||||
registerPopupComponent(defaultPopupProps)
|
||||
await import('@typebot.io/js/dist/web')
|
||||
})()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (!ref.current) return
|
||||
ref.current.typebot = props.typebot
|
||||
ref.current.prefilledVariables = props.prefilledVariables
|
||||
ref.current.onClose = props.onClose
|
||||
ref.current.onOpen = props.onOpen
|
||||
ref.current.onNewInputBlock = props.onNewInputBlock
|
||||
ref.current.onAnswer = props.onAnswer
|
||||
ref.current.onEnd = props.onEnd
|
||||
ref.current.onInit = props.onInit
|
||||
}, [
|
||||
props.onAnswer,
|
||||
props.onClose,
|
||||
props.onEnd,
|
||||
props.onNewInputBlock,
|
||||
props.onOpen,
|
||||
props.onInit,
|
||||
props.prefilledVariables,
|
||||
props.typebot,
|
||||
])
|
||||
const updateProps = (element: PopupElement | null, props: Props) => {
|
||||
if (!element) return
|
||||
Object.assign(element, props)
|
||||
}
|
||||
|
||||
return (
|
||||
<typebot-popup
|
||||
ref={ref}
|
||||
api-host={props.apiHost}
|
||||
start-group-id={props.startGroupId}
|
||||
result-id={props.resultId}
|
||||
is-preview={props.isPreview}
|
||||
is-open={props.isOpen}
|
||||
default-open={props.defaultOpen}
|
||||
class={className}
|
||||
style={style}
|
||||
/>
|
||||
)
|
||||
const initBubble = async () => {
|
||||
const popupElement = document.createElement('typebot-popup') as PopupElement
|
||||
ref.current = popupElement
|
||||
document.body.append(popupElement)
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
if (!ref.current) await initBubble()
|
||||
updateProps(ref.current, props)
|
||||
})()
|
||||
|
||||
return () => {
|
||||
ref.current?.remove()
|
||||
}
|
||||
}, [props])
|
||||
|
||||
return null
|
||||
}
|
||||
|
||||
@ -1,8 +1,10 @@
|
||||
import { useEffect, useRef } from 'react'
|
||||
import type { BotProps } from '@typebot.io/js'
|
||||
import { defaultBotProps } from './constants'
|
||||
|
||||
type Props = BotProps & { style?: React.CSSProperties; className?: string }
|
||||
type Props = BotProps & {
|
||||
style?: React.CSSProperties
|
||||
className?: string
|
||||
}
|
||||
|
||||
declare global {
|
||||
namespace JSX {
|
||||
@ -15,43 +17,21 @@ declare global {
|
||||
}
|
||||
}
|
||||
|
||||
export const Standard = ({ style, className, ...props }: Props) => {
|
||||
const ref = useRef<(HTMLDivElement & Props) | null>(null)
|
||||
type StandardElement = HTMLElement & Props
|
||||
|
||||
export const Standard = ({ style, className, ...assignableProps }: Props) => {
|
||||
const ref = useRef<StandardElement | null>(null)
|
||||
|
||||
useEffect(() => {
|
||||
;(async () => {
|
||||
const { registerStandardComponent } = await import('@typebot.io/js')
|
||||
registerStandardComponent(defaultBotProps)
|
||||
await import('@typebot.io/js/dist/web')
|
||||
})()
|
||||
// eslint-disable-next-line react-hooks/exhaustive-deps
|
||||
}, [])
|
||||
|
||||
useEffect(() => {
|
||||
if (!ref.current) return
|
||||
ref.current.typebot = props.typebot
|
||||
ref.current.prefilledVariables = props.prefilledVariables
|
||||
ref.current.onNewInputBlock = props.onNewInputBlock
|
||||
ref.current.onAnswer = props.onAnswer
|
||||
ref.current.onEnd = props.onEnd
|
||||
ref.current.onInit = props.onInit
|
||||
}, [
|
||||
props.onAnswer,
|
||||
props.onNewInputBlock,
|
||||
props.prefilledVariables,
|
||||
props.typebot,
|
||||
props.onEnd,
|
||||
props.onInit,
|
||||
])
|
||||
Object.assign(ref.current, assignableProps)
|
||||
}, [assignableProps])
|
||||
|
||||
return (
|
||||
<typebot-standard
|
||||
ref={ref}
|
||||
api-host={props.apiHost}
|
||||
start-group-id={props.startGroupId}
|
||||
style={style}
|
||||
class={className}
|
||||
result-id={props.resultId}
|
||||
is-preview={props.isPreview}
|
||||
/>
|
||||
)
|
||||
return <typebot-standard ref={ref} style={style} class={className} />
|
||||
}
|
||||
|
||||
@ -1,32 +0,0 @@
|
||||
import type { BotProps, PopupProps, BubbleProps } from '@typebot.io/js'
|
||||
|
||||
export const defaultBotProps: BotProps = {
|
||||
typebot: '',
|
||||
onNewInputBlock: undefined,
|
||||
onAnswer: undefined,
|
||||
onEnd: undefined,
|
||||
onInit: undefined,
|
||||
isPreview: undefined,
|
||||
startGroupId: undefined,
|
||||
prefilledVariables: undefined,
|
||||
apiHost: undefined,
|
||||
resultId: undefined,
|
||||
}
|
||||
|
||||
export const defaultPopupProps: PopupProps = {
|
||||
...defaultBotProps,
|
||||
onClose: undefined,
|
||||
onOpen: undefined,
|
||||
theme: undefined,
|
||||
autoShowDelay: undefined,
|
||||
isOpen: undefined,
|
||||
defaultOpen: undefined,
|
||||
}
|
||||
|
||||
export const defaultBubbleProps: BubbleProps = {
|
||||
...defaultBotProps,
|
||||
onClose: undefined,
|
||||
onOpen: undefined,
|
||||
theme: undefined,
|
||||
previewMessage: undefined,
|
||||
}
|
||||
@ -1,10 +1,3 @@
|
||||
/* eslint-disable import/no-anonymous-default-export */
|
||||
import { Standard } from './Standard'
|
||||
import { Bubble } from './Bubble'
|
||||
import { Popup } from './Popup'
|
||||
|
||||
export { Standard, Bubble, Popup }
|
||||
|
||||
// export default { Standard, Bubble, Popup }
|
||||
|
||||
export * from '@typebot.io/js/src/features/commands'
|
||||
export { Standard } from './Standard'
|
||||
export { Bubble } from './Bubble'
|
||||
export { Popup } from './Popup'
|
||||
|
||||
487
packages/react/src/stories/assets/leadGenerationTypebot.ts
Normal file
487
packages/react/src/stories/assets/leadGenerationTypebot.ts
Normal file
@ -0,0 +1,487 @@
|
||||
import {
|
||||
BackgroundType,
|
||||
BubbleBlockType,
|
||||
ComparisonOperators,
|
||||
InputBlockType,
|
||||
LogicalOperator,
|
||||
LogicBlockType,
|
||||
StartTypebot,
|
||||
} from 'models'
|
||||
|
||||
export const leadGenerationTypebot: StartTypebot = {
|
||||
id: 'clckrl4q5000t3b6sabwokaar',
|
||||
groups: [
|
||||
{
|
||||
id: 'clckrl4q5000g3b6skizhd262',
|
||||
title: 'Start',
|
||||
blocks: [
|
||||
{
|
||||
id: '22HP69iipkLjJDTUcc1AWW',
|
||||
type: 'start',
|
||||
label: 'Start',
|
||||
groupId: 'clckrl4q5000g3b6skizhd262',
|
||||
outgoingEdgeId: 'clckrlxp400173b6sktq7gqm2',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 0, y: 0 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000h3b6sjipn4qga',
|
||||
title: 'Welcome',
|
||||
blocks: [
|
||||
{
|
||||
id: 'sc1y8VwDabNJgiVTBi4qtif',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>Welcome to <span class="slate-bold">AA</span> (Awesome Agency)</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [
|
||||
{ text: 'Welcome to ' },
|
||||
{ bold: true, text: 'AA' },
|
||||
{ text: ' (Awesome Agency)' },
|
||||
],
|
||||
},
|
||||
],
|
||||
plainText: 'Welcome to AA (Awesome Agency)',
|
||||
},
|
||||
groupId: 'clckrl4q5000h3b6sjipn4qga',
|
||||
},
|
||||
{
|
||||
id: 's7YqZTBeyCa4Hp3wN2j922c',
|
||||
type: BubbleBlockType.IMAGE,
|
||||
content: {
|
||||
url: 'https://media2.giphy.com/media/XD9o33QG9BoMis7iM4/giphy.gif?cid=fe3852a3ihg8rvipzzky5lybmdyq38fhke2tkrnshwk52c7d&rid=giphy.gif&ct=g',
|
||||
},
|
||||
groupId: 'clckrl4q5000h3b6sjipn4qga',
|
||||
},
|
||||
{
|
||||
id: 'sbjZWLJGVkHAkDqS4JQeGow',
|
||||
type: InputBlockType.CHOICE,
|
||||
items: [
|
||||
{
|
||||
id: 'hQw2zbp7FDX7XYK9cFpbgC',
|
||||
type: 0,
|
||||
blockId: 'sbjZWLJGVkHAkDqS4JQeGow',
|
||||
content: 'Hi!',
|
||||
},
|
||||
],
|
||||
groupId: 'clckrl4q5000h3b6sjipn4qga',
|
||||
options: { buttonLabel: 'Send', isMultipleChoice: false },
|
||||
outgoingEdgeId: 'clckrm7td001b3b6s2769fh7k',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: -8.26171875, y: 457.515625 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000i3b6stgxyvscq',
|
||||
title: 'Email',
|
||||
blocks: [
|
||||
{
|
||||
id: 'sxeYubYN6XzhAfG7m9Fivhc',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>Great! Nice to meet you {{Name}}</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [{ text: 'Great! Nice to meet you {{Name}}' }],
|
||||
},
|
||||
],
|
||||
plainText: 'Great! Nice to meet you {{Name}}',
|
||||
},
|
||||
groupId: 'clckrl4q5000i3b6stgxyvscq',
|
||||
},
|
||||
{
|
||||
id: 'scQ5kduafAtfP9T8SHUJnGi',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>What's the best email we can reach you at?</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [
|
||||
{ text: "What's the best email we can reach you at?" },
|
||||
],
|
||||
},
|
||||
],
|
||||
plainText: "What's the best email we can reach you at?",
|
||||
},
|
||||
groupId: 'clckrl4q5000i3b6stgxyvscq',
|
||||
},
|
||||
{
|
||||
id: 'snbsad18Bgry8yZ8DZCfdFD',
|
||||
type: InputBlockType.EMAIL,
|
||||
groupId: 'clckrl4q5000i3b6stgxyvscq',
|
||||
options: {
|
||||
labels: { button: 'Send', placeholder: 'Type your email...' },
|
||||
variableId: 'v3VFChNVSCXQ2rXv4DrJ8Ah',
|
||||
retryMessageContent:
|
||||
"This email doesn't seem to be valid. Can you type it again?",
|
||||
},
|
||||
outgoingEdgeId: 'clckrl4q5000q3b6s5czdtm8x',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 669, y: 141 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000j3b6sloirnxza',
|
||||
title: 'Name',
|
||||
blocks: [
|
||||
{
|
||||
id: 'sgtE2Sy7cKykac9B223Kq9R',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>What's your name?</div>',
|
||||
richText: [
|
||||
{ type: 'p', children: [{ text: "What's your name?" }] },
|
||||
],
|
||||
plainText: "What's your name?",
|
||||
},
|
||||
groupId: 'clckrl4q5000j3b6sloirnxza',
|
||||
},
|
||||
{
|
||||
id: 'sqEsMo747LTDnY9FjQcEwUv',
|
||||
type: InputBlockType.TEXT,
|
||||
groupId: 'clckrl4q5000j3b6sloirnxza',
|
||||
options: {
|
||||
isLong: false,
|
||||
labels: {
|
||||
button: 'Send',
|
||||
placeholder: 'Type your answer...',
|
||||
},
|
||||
variableId: 'giiLFGw5xXBCHzvp1qAbdX',
|
||||
},
|
||||
outgoingEdgeId: 'clckrl4q5000p3b6shb5bfnzt',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 340, y: 143 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000k3b6s0anufmgy',
|
||||
title: 'Services',
|
||||
blocks: [
|
||||
{
|
||||
id: 'su7HceVXWyTCzi2vv3m4QbK',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>What services are you interested in?</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [{ text: 'What services are you interested in?' }],
|
||||
},
|
||||
],
|
||||
plainText: 'What services are you interested in?',
|
||||
},
|
||||
groupId: 'clckrl4q5000k3b6s0anufmgy',
|
||||
},
|
||||
{
|
||||
id: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
type: InputBlockType.CHOICE,
|
||||
items: [
|
||||
{
|
||||
id: 'fnLCBF4NdraSwcubnBhk8H',
|
||||
type: 0,
|
||||
blockId: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
content: 'Website dev',
|
||||
},
|
||||
{
|
||||
id: 'a782h8ynMouY84QjH7XSnR',
|
||||
type: 0,
|
||||
blockId: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
content: 'Content Marketing',
|
||||
},
|
||||
{
|
||||
id: 'jGvh94zBByvVFpSS3w97zY',
|
||||
type: 0,
|
||||
blockId: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
content: 'Social Media',
|
||||
},
|
||||
{
|
||||
id: '6PRLbKUezuFmwWtLVbvAQ7',
|
||||
type: 0,
|
||||
blockId: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
content: 'UI / UX Design',
|
||||
},
|
||||
],
|
||||
groupId: 'clckrl4q5000k3b6s0anufmgy',
|
||||
options: { buttonLabel: 'Send', isMultipleChoice: true },
|
||||
outgoingEdgeId: 'clckrl4q5000r3b6s9yxsuxu7',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 1002, y: 144 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000l3b6scn1r1nns',
|
||||
title: 'Additional information',
|
||||
blocks: [
|
||||
{
|
||||
id: 'sqR8Sz9gW21aUYKtUikq7qZ',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>Can you tell me a bit more about your needs?</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [
|
||||
{ text: 'Can you tell me a bit more about your needs?' },
|
||||
],
|
||||
},
|
||||
],
|
||||
plainText: 'Can you tell me a bit more about your needs?',
|
||||
},
|
||||
groupId: 'clckrl4q5000l3b6scn1r1nns',
|
||||
},
|
||||
{
|
||||
id: 'sqFy2G3C1mh9p6s3QBdSS5x',
|
||||
type: InputBlockType.TEXT,
|
||||
groupId: 'clckrl4q5000l3b6scn1r1nns',
|
||||
options: {
|
||||
isLong: true,
|
||||
labels: { button: 'Send', placeholder: 'Type your answer...' },
|
||||
},
|
||||
outgoingEdgeId: 'clckrl4q5000s3b6stx5nnqbz',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 1337, y: 145 },
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000m3b6srabr5a2s',
|
||||
title: 'Bye',
|
||||
blocks: [
|
||||
{
|
||||
id: 'seLegenCgUwMopRFeAefqZ7',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>Perfect!</div>',
|
||||
richText: [{ type: 'p', children: [{ text: 'Perfect!' }] }],
|
||||
plainText: 'Perfect!',
|
||||
},
|
||||
groupId: 'clckrl4q5000m3b6srabr5a2s',
|
||||
},
|
||||
{
|
||||
id: 's779Q1y51aVaDUJVrFb16vv',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>We'll get back to you at {{Email}}</div>',
|
||||
richText: [
|
||||
{
|
||||
type: 'p',
|
||||
children: [{ text: "We'll get back to you at {{Email}}" }],
|
||||
},
|
||||
],
|
||||
plainText: "We'll get back to you at {{Email}}",
|
||||
},
|
||||
groupId: 'clckrl4q5000m3b6srabr5a2s',
|
||||
},
|
||||
],
|
||||
graphCoordinates: { x: 1668, y: 143 },
|
||||
},
|
||||
{
|
||||
id: 'clckrlksq000z3b6sequnj9m3',
|
||||
graphCoordinates: { x: -355.04296875, y: 187.5078125 },
|
||||
title: 'Group #7',
|
||||
blocks: [
|
||||
{
|
||||
id: 'clckrlksq00103b6s3exi90al',
|
||||
groupId: 'clckrlksq000z3b6sequnj9m3',
|
||||
type: LogicBlockType.CONDITION,
|
||||
items: [
|
||||
{
|
||||
id: 'clckrlksq00113b6sz8naxdwx',
|
||||
blockId: 'clckrlksq00103b6s3exi90al',
|
||||
type: 1,
|
||||
content: {
|
||||
comparisons: [
|
||||
{
|
||||
id: 'clckrllsm00123b6sz38325aw',
|
||||
variableId: 'giiLFGw5xXBCHzvp1qAbdX',
|
||||
comparisonOperator: ComparisonOperators.IS_SET,
|
||||
},
|
||||
],
|
||||
logicalOperator: LogicalOperator.AND,
|
||||
},
|
||||
outgoingEdgeId: 'clckrlt0000143b6sn9euzwnm',
|
||||
},
|
||||
],
|
||||
outgoingEdgeId: 'clckrluh600153b6s66p2q6wa',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 'clckrm1zq00183b6sz8ydapth',
|
||||
graphCoordinates: { x: 333.8046875, y: 408.1328125 },
|
||||
title: 'Group #7 copy',
|
||||
blocks: [
|
||||
{
|
||||
id: 'clckrm1zr00193b6szpz37plc',
|
||||
groupId: 'clckrm1zq00183b6sz8ydapth',
|
||||
type: LogicBlockType.CONDITION,
|
||||
items: [
|
||||
{
|
||||
id: 'clckrm1zr001a3b6s1hlfm2jh',
|
||||
blockId: 'clckrm1zr00193b6szpz37plc',
|
||||
type: 1,
|
||||
content: {
|
||||
comparisons: [
|
||||
{
|
||||
id: 'clckrllsm00123b6sz38325aw',
|
||||
variableId: 'giiLFGw5xXBCHzvp1qAbdX',
|
||||
comparisonOperator: ComparisonOperators.IS_SET,
|
||||
},
|
||||
],
|
||||
logicalOperator: LogicalOperator.AND,
|
||||
},
|
||||
outgoingEdgeId: 'clckrma26001c3b6sup2bdbte',
|
||||
},
|
||||
],
|
||||
outgoingEdgeId: 'clckrmbbk001d3b6shr35s2ao',
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
id: 'clckrlqil00133b6sk6msgqt1',
|
||||
graphCoordinates: { x: -23.78515625, y: 199.6875 },
|
||||
title: 'Group #8',
|
||||
blocks: [
|
||||
{
|
||||
id: 'clckrl870000y3b6sxyd24qwc',
|
||||
groupId: 'clckrlqil00133b6sk6msgqt1',
|
||||
type: BubbleBlockType.TEXT,
|
||||
content: {
|
||||
html: '<div>Hi {{Name}}!</div>',
|
||||
richText: [{ type: 'p', children: [{ text: 'Hi {{Name}}!' }] }],
|
||||
plainText: 'Hi {{Name}}!',
|
||||
},
|
||||
outgoingEdgeId: 'clckrlwmd00163b6sjlass4p8',
|
||||
},
|
||||
],
|
||||
},
|
||||
],
|
||||
variables: [
|
||||
{ id: 'giiLFGw5xXBCHzvp1qAbdX', name: 'Name' },
|
||||
{ id: 'v3VFChNVSCXQ2rXv4DrJ8Ah', name: 'Email' },
|
||||
],
|
||||
edges: [
|
||||
{
|
||||
id: 'clckrl4q5000p3b6shb5bfnzt',
|
||||
to: { groupId: 'clckrl4q5000i3b6stgxyvscq' },
|
||||
from: {
|
||||
blockId: 'sqEsMo747LTDnY9FjQcEwUv',
|
||||
groupId: 'clckrl4q5000j3b6sloirnxza',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000q3b6s5czdtm8x',
|
||||
to: { groupId: 'clckrl4q5000k3b6s0anufmgy' },
|
||||
from: {
|
||||
blockId: 'snbsad18Bgry8yZ8DZCfdFD',
|
||||
groupId: 'clckrl4q5000i3b6stgxyvscq',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000r3b6s9yxsuxu7',
|
||||
to: { groupId: 'clckrl4q5000l3b6scn1r1nns' },
|
||||
from: {
|
||||
blockId: 's5VQGsVF4hQgziQsXVdwPDW',
|
||||
groupId: 'clckrl4q5000k3b6s0anufmgy',
|
||||
},
|
||||
},
|
||||
{
|
||||
id: 'clckrl4q5000s3b6stx5nnqbz',
|
||||
to: { groupId: 'clckrl4q5000m3b6srabr5a2s' },
|
||||
from: {
|
||||
blockId: 'sqFy2G3C1mh9p6s3QBdSS5x',
|
||||
groupId: 'clckrl4q5000l3b6scn1r1nns',
|
||||
},
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrlksq000z3b6sequnj9m3',
|
||||
blockId: 'clckrlksq00103b6s3exi90al',
|
||||
itemId: 'clckrlksq00113b6sz8naxdwx',
|
||||
},
|
||||
to: { groupId: 'clckrlqil00133b6sk6msgqt1' },
|
||||
id: 'clckrlt0000143b6sn9euzwnm',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrlksq000z3b6sequnj9m3',
|
||||
blockId: 'clckrlksq00103b6s3exi90al',
|
||||
},
|
||||
to: { groupId: 'clckrl4q5000h3b6sjipn4qga' },
|
||||
id: 'clckrluh600153b6s66p2q6wa',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrlqil00133b6sk6msgqt1',
|
||||
blockId: 'clckrl870000y3b6sxyd24qwc',
|
||||
},
|
||||
to: { groupId: 'clckrl4q5000h3b6sjipn4qga' },
|
||||
id: 'clckrlwmd00163b6sjlass4p8',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrl4q5000g3b6skizhd262',
|
||||
blockId: '22HP69iipkLjJDTUcc1AWW',
|
||||
},
|
||||
to: { groupId: 'clckrlksq000z3b6sequnj9m3' },
|
||||
id: 'clckrlxp400173b6sktq7gqm2',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrl4q5000h3b6sjipn4qga',
|
||||
blockId: 'sbjZWLJGVkHAkDqS4JQeGow',
|
||||
},
|
||||
to: { groupId: 'clckrm1zq00183b6sz8ydapth' },
|
||||
id: 'clckrm7td001b3b6s2769fh7k',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrm1zq00183b6sz8ydapth',
|
||||
blockId: 'clckrm1zr00193b6szpz37plc',
|
||||
itemId: 'clckrm1zr001a3b6s1hlfm2jh',
|
||||
},
|
||||
to: { groupId: 'clckrl4q5000i3b6stgxyvscq' },
|
||||
id: 'clckrma26001c3b6sup2bdbte',
|
||||
},
|
||||
{
|
||||
from: {
|
||||
groupId: 'clckrm1zq00183b6sz8ydapth',
|
||||
blockId: 'clckrm1zr00193b6szpz37plc',
|
||||
},
|
||||
to: { groupId: 'clckrl4q5000j3b6sloirnxza' },
|
||||
id: 'clckrmbbk001d3b6shr35s2ao',
|
||||
},
|
||||
],
|
||||
theme: {
|
||||
chat: {
|
||||
inputs: {
|
||||
color: '#303235',
|
||||
backgroundColor: '#FFFFFF',
|
||||
placeholderColor: '#9095A0',
|
||||
},
|
||||
buttons: { color: '#FFFFFF', backgroundColor: '#0042DA' },
|
||||
hostAvatar: {
|
||||
url: 'https://avatars.githubusercontent.com/u/16015833?v=4',
|
||||
isEnabled: true,
|
||||
},
|
||||
hostBubbles: { color: '#303235', backgroundColor: '#F7F8FF' },
|
||||
guestBubbles: { color: '#FFFFFF', backgroundColor: '#FF8E21' },
|
||||
},
|
||||
general: {
|
||||
font: 'Open Sans',
|
||||
background: { type: BackgroundType.COLOR, content: '#fff' },
|
||||
},
|
||||
},
|
||||
settings: {
|
||||
general: { isBrandingEnabled: true },
|
||||
metadata: {
|
||||
description:
|
||||
'Build beautiful conversational forms and embed them directly in your applications without a line of code. Triple your response rate and collect answers that has more value compared to a traditional form.',
|
||||
},
|
||||
typingEmulation: { speed: 300, enabled: true, maxDelay: 1.5 },
|
||||
},
|
||||
}
|
||||
@ -8,6 +8,7 @@ import {
|
||||
setPrefilledVariables,
|
||||
} from '@typebot.io/js'
|
||||
import { useState } from 'react'
|
||||
import { leadGenerationTypebot } from './assets/leadGenerationTypebot'
|
||||
|
||||
export const Default = () => {
|
||||
const [name, setName] = useState('John')
|
||||
@ -32,7 +33,7 @@ export const Default = () => {
|
||||
</div>
|
||||
|
||||
<Bubble
|
||||
typebot="ladleTypebot"
|
||||
typebot={leadGenerationTypebot}
|
||||
apiHost="http://localhost:3001"
|
||||
prefilledVariables={{
|
||||
Name: 'John',
|
||||
@ -45,9 +46,7 @@ export const Default = () => {
|
||||
theme={{
|
||||
button: {
|
||||
backgroundColor: '#FF7537',
|
||||
icon: {
|
||||
color: 'white',
|
||||
},
|
||||
iconColor: 'white',
|
||||
},
|
||||
}}
|
||||
isPreview
|
||||
|
||||
@ -1,5 +1,6 @@
|
||||
import { Popup } from '../Popup'
|
||||
import { open, toggle } from '@typebot.io/js'
|
||||
import { leadGenerationTypebot } from './assets/leadGenerationTypebot'
|
||||
|
||||
export const Default = () => {
|
||||
return (
|
||||
@ -7,7 +8,7 @@ export const Default = () => {
|
||||
<button onClick={open}>Open modal</button>
|
||||
<button onClick={toggle}>Toggle modal</button>
|
||||
<Popup
|
||||
typebot="clctayswj000l3b6y2vkh8kwg"
|
||||
typebot={leadGenerationTypebot}
|
||||
apiHost="http://localhost:3001"
|
||||
autoShowDelay={3000}
|
||||
isPreview
|
||||
|
||||
@ -1,13 +1,28 @@
|
||||
import { Standard } from '..'
|
||||
import { leadGenerationTypebot } from './assets/leadGenerationTypebot'
|
||||
|
||||
export const Default = () => {
|
||||
return (
|
||||
<div style={{ height: '500px' }}>
|
||||
<Standard
|
||||
typebot="ladleTypebot"
|
||||
typebot={leadGenerationTypebot}
|
||||
apiHost="http://localhost:3001"
|
||||
isPreview
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export const StartWhenIntoView = () => {
|
||||
return (
|
||||
<>
|
||||
<div style={{ height: '300vh' }} />
|
||||
<Standard
|
||||
typebot={leadGenerationTypebot}
|
||||
apiHost="http://localhost:3001"
|
||||
isPreview
|
||||
style={{ height: '300px' }}
|
||||
/>
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
@ -5,6 +5,10 @@
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
}
|
||||
},
|
||||
"declaration": true,
|
||||
"declarationMap": true,
|
||||
"outDir": "dist",
|
||||
"emitDeclarationOnly": true
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,10 +0,0 @@
|
||||
import { defineConfig } from 'tsup'
|
||||
|
||||
export default defineConfig((options) => ({
|
||||
entry: ['src/index.ts'],
|
||||
sourcemap: options.watch,
|
||||
minify: !options.watch,
|
||||
dts: true,
|
||||
format: ['esm', 'cjs'],
|
||||
external: ['db', 'cuid'],
|
||||
}))
|
||||
Reference in New Issue
Block a user