✨ Add audio clips option on text input block

Closes #157

packages/embeds/js/src/components/Bot.tsx

@@ -38,6 +38,7 @@ import { CorsError } from '@/utils/CorsError'
 import { Toaster, Toast } from '@ark-ui/solid'
 import { CloseIcon } from './icons/CloseIcon'
 import { toaster } from '@/utils/toaster'
+import { setBotContainer } from '@/utils/botContainerSignal'
 
 export type BotProps = {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -285,16 +286,18 @@ const BotContent = (props: BotContentProps) => {
       key: `typebot-${props.context.typebot.id}-progressValue`,
     }
   )
-  let botContainer: HTMLDivElement | undefined
+  let botContainerElement: HTMLDivElement | undefined
 
   const resizeObserver = new ResizeObserver((entries) => {
     return setIsMobile(entries[0].target.clientWidth < 400)
   })
 
   onMount(() => {
-    if (!botContainer) return
-    resizeObserver.observe(botContainer)
-    setBotContainerHeight(`${botContainer.clientHeight}px`)
+    if (!botContainerElement) return
+    console.log('yes')
+    setBotContainer(botContainerElement)
+    resizeObserver.observe(botContainerElement)
+    setBotContainerHeight(`${botContainerElement.clientHeight}px`)
   })
 
   createEffect(() => {
@@ -304,22 +307,22 @@ const BotContent = (props: BotContentProps) => {
         family: defaultFontFamily,
       }
     )
-    if (!botContainer) return
+    if (!botContainerElement) return
     setCssVariablesValue(
       props.initialChatReply.typebot.theme,
-      botContainer,
+      botContainerElement,
       props.context.isPreview
     )
   })
 
   onCleanup(() => {
-    if (!botContainer) return
-    resizeObserver.unobserve(botContainer)
+    if (!botContainerElement) return
+    resizeObserver.unobserve(botContainerElement)
   })
 
   return (
     <div
-      ref={botContainer}
+      ref={botContainerElement}
       class={clsx(
         'relative flex w-full h-full text-base overflow-hidden flex-col justify-center items-center typebot-container',
         props.class
@@ -358,7 +361,7 @@ const BotContent = (props: BotContentProps) => {
           props.initialChatReply.typebot.settings.general?.isBrandingEnabled
         }
       >
-        <LiteBadge botContainer={botContainer} />
+        <LiteBadge botContainer={botContainerElement} />
       </Show>
       <Toaster toaster={toaster}>
         {(toast) => (