✨ Add audio bubble block

Closes #167

apps/builder/src/components/ImageUploadContent/ImageUploadContent.tsx

@@ -121,6 +121,7 @@ const UploadFileContent = ({
 }: ContentProps & { filePath: string; includeFileName?: boolean }) => (
   <Flex justify="center" py="2">
     <UploadButton
+      fileType="image"
       filePath={filePath}
       onFileUploaded={onNewUrl}
       includeFileName={includeFileName}

apps/builder/src/components/ImageUploadContent/UploadButton.tsx

@@ -4,12 +4,14 @@ import { ChangeEvent, useState } from 'react'
 import { uploadFiles } from 'utils'
 
 type UploadButtonProps = {
+  fileType: 'image' | 'audio'
   filePath: string
   includeFileName?: boolean
   onFileUploaded: (url: string) => void
 } & ButtonProps
 
 export const UploadButton = ({
+  fileType,
   filePath,
   includeFileName,
   onFileUploaded,
@@ -41,7 +43,11 @@ export const UploadButton = ({
         id="file-input"
         display="none"
         onChange={handleInputChange}
-        accept=".jpg, .jpeg, .png, .svg, .gif"
+        accept={
+          fileType === 'image'
+            ? '.jpg, .jpeg, .png, .svg, .gif'
+            : '.mp3, .wav, .ogg'
+        }
       />
       <Button
         as="label"

apps/builder/src/components/icons.tsx

@@ -1,6 +1,6 @@
 import { IconProps, Icon } from '@chakra-ui/react'
 
-const featherIconsBaseProps: IconProps = {
+export const featherIconsBaseProps: IconProps = {
   fill: 'none',
   stroke: 'currentColor',
   strokeWidth: '2px',