🐛 (js) Fix popup closing on bot click

baptisteArno · Mar 13, 2023 · 4ae9ea3 · 4ae9ea3 · vercel · Mar 13, 2023
1 parent a66a1e8
commit 4ae9ea3
Show file tree

Hide file tree

Showing 4 changed files with 4 additions and 7 deletions.
diff --git a/packages/js/package.json b/packages/js/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/js",
-  "version": "0.0.26",
+  "version": "0.0.27",
   "description": "Javascript library to display typebots on your website",
   "type": "module",
   "main": "dist/index.js",

diff --git a/packages/js/src/env.d.ts b/packages/js/src/env.d.ts
@@ -4,6 +4,7 @@ declare module 'solid-js' {
   namespace JSX {
     interface CustomEvents {
       click: MouseEvent
+      pointerdown: PointerEvent
     }
   }
 }
diff --git a/packages/js/src/features/popup/components/Popup.tsx b/packages/js/src/features/popup/components/Popup.tsx
@@ -21,8 +21,6 @@ export type PopupProps = BotProps &
   }
 
 export const Popup = (props: PopupProps) => {
-  let botContainer: HTMLDivElement | undefined
-
   const [popupProps, botProps] = splitProps(props, [
     'onOpen',
     'onClose',
@@ -92,15 +90,13 @@ export const Popup = (props: PopupProps) => {
     popupProps.onOpen?.()
     document.body.style.overflow = 'hidden'
     document.addEventListener('pointerdown', closeBot)
-    botContainer?.addEventListener('pointerdown', stopPropagation)
   }
 
   const closeBot = () => {
     setIsBotOpened(false)
     popupProps.onClose?.()
     document.body.style.overflow = 'auto'
     document.removeEventListener('pointerdown', closeBot)
-    botContainer?.removeEventListener('pointerdown', stopPropagation)
   }
 
   const toggleBot = () => {
@@ -126,7 +122,7 @@ export const Popup = (props: PopupProps) => {
                 'background-color':
                   props.theme?.backgroundColor ?? 'transparent',
               }}
-              ref={botContainer}
+              on:pointerdown={stopPropagation}
             >
               <Bot {...botProps} prefilledVariables={prefilledVariables()} />
             </div>

diff --git a/packages/react/package.json b/packages/react/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/react",
-  "version": "0.0.26",
+  "version": "0.0.27",
   "description": "React library to display typebots on your website",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",