🐛 (theme) Fix containers disabled bg should be transparent

Author: baptisteArno

packages/embeds/js/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/js",
-  "version": "0.2.66",
+  "version": "0.2.67",
   "description": "Javascript library to display typebots on your website",
   "type": "module",
   "main": "dist/index.js",

packages/embeds/js/src/utils/setCssVariablesValue.ts

@@ -325,7 +325,9 @@ const setHostBubbles = (
 
   documentStyle.setProperty(
     cssVariableNames.chat.hostBubbles.opacity,
-    isDefined(hostBubbles?.opacity)
+    hostBubbles?.backgroundColor === 'transparent'
+      ? '0'
+      : isDefined(hostBubbles?.opacity)
       ? hostBubbles.opacity.toString()
       : defaultOpacity.toString()
   )
@@ -397,7 +399,9 @@ const setGuestBubbles = (
 
   documentStyle.setProperty(
     cssVariableNames.chat.guestBubbles.opacity,
-    isDefined(guestBubbles?.opacity)
+    guestBubbles?.backgroundColor === 'transparent'
+      ? '0'
+      : isDefined(guestBubbles?.opacity)
       ? guestBubbles.opacity.toString()
       : defaultOpacity.toString()
   )
@@ -471,7 +475,9 @@ const setButtons = (
 
   documentStyle.setProperty(
     cssVariableNames.chat.buttons.opacity,
-    isDefined(buttons?.opacity)
+    buttons?.backgroundColor === 'transparent'
+      ? '0'
+      : isDefined(buttons?.opacity)
       ? buttons.opacity.toString()
       : defaultOpacity.toString()
   )
@@ -530,7 +536,9 @@ const setInputs = (
 
   documentStyle.setProperty(
     cssVariableNames.chat.inputs.opacity,
-    isDefined(inputs?.opacity)
+    inputs?.backgroundColor === 'transparent'
+      ? '0'
+      : isDefined(inputs?.opacity)
       ? inputs.opacity.toString()
       : defaultOpacity.toString()
   )

packages/embeds/nextjs/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/nextjs",
-  "version": "0.2.66",
+  "version": "0.2.67",
   "description": "Convenient library to display typebots on your Next.js website",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",

packages/embeds/react/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@typebot.io/react",
-  "version": "0.2.66",
+  "version": "0.2.67",
   "description": "Convenient library to display typebots on your React app",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",