⚡ (theme) Add corner roundness customization

Closes #415

apps/builder/src/features/theme/components/chat/ChatThemeSettings.tsx

@@ -1,3 +1,9 @@
+import {
+  LargeRadiusIcon,
+  MediumRadiusIcon,
+  NoRadiusIcon,
+} from '@/components/icons'
+import { RadioButtons } from '@/components/inputs/RadioButtons'
 import { Heading, Stack } from '@chakra-ui/react'
 import {
   AvatarProps,
@@ -59,6 +65,29 @@ export const ChatThemeSettings = ({
           onHostBubblesChange={handleHostBubblesChange}
         />
       </Stack>
+      <Stack borderWidth={1} rounded="md" p="4" spacing={4}>
+        <Heading fontSize="lg">Corners roundness</Heading>
+        <RadioButtons
+          options={[
+            {
+              label: <NoRadiusIcon />,
+              value: 'none',
+            },
+            {
+              label: <MediumRadiusIcon />,
+              value: 'medium',
+            },
+            {
+              label: <LargeRadiusIcon />,
+              value: 'large',
+            },
+          ]}
+          defaultValue={chatTheme.roundness ?? 'medium'}
+          onSelect={(roundness) =>
+            onChatThemeChange({ ...chatTheme, roundness })
+          }
+        />
+      </Stack>
       <Stack borderWidth={1} rounded="md" p="4" spacing={4}>
         <Heading fontSize="lg">User bubbles</Heading>
         <GuestBubbles