✨ (theme) Custom font option (#1268)

Closes #1249

<!-- This is an auto-generated comment: release notes by coderabbit.ai
-->

## Summary by CodeRabbit

- **New Features**
- Introduced components for customizing fonts, including Google and
custom font options.
- Enhanced theme customization by simplifying theme objects and adding
new font customization options.
- Implemented dynamic font injection for web pages based on
user-selected font configurations.

- **Bug Fixes**
- Fixed a condition in theme template card rendering to correctly check
avatar enablement.
- Corrected font property handling across various components to support
both string and object types.

- **Refactor**
	- Updated option properties in RadioButtons component to be readonly.
- Simplified logic for setting CSS variables for fonts, including checks
for font types and existence.

- **Documentation**
- Added constants and schemas for supporting new font types in theme
customization.

<!-- end of auto-generated comment: release notes by coderabbit.ai -->

apps/viewer/src/components/TypebotPageV3.tsx

@@ -4,17 +4,20 @@ import { SEO } from './Seo'
 import { Typebot } from '@typebot.io/schemas/features/typebot/typebot'
 import { BackgroundType } from '@typebot.io/schemas/features/typebot/theme/constants'
 import { defaultSettings } from '@typebot.io/schemas/features/typebot/settings/constants'
+import { Font } from '@typebot.io/schemas'
 
 export type TypebotV3PageProps = {
   url: string
   name: string
   publicId: string | null
+  font: Font | null
   isHideQueryParamsEnabled: boolean | null
   background: NonNullable<Typebot['theme']['general']>['background']
   metadata: Typebot['settings']['metadata']
 }
 
 export const TypebotPageV3 = ({
+  font,
   publicId,
   name,
   url,
@@ -51,7 +54,11 @@ export const TypebotPageV3 = ({
       }}
     >
       <SEO url={url} typebotName={name} metadata={metadata} />
-      <Standard typebot={publicId} onInit={clearQueryParamsIfNecessary} />
+      <Standard
+        typebot={publicId}
+        onInit={clearQueryParamsIfNecessary}
+        font={font ?? undefined}
+      />
     </div>
   )
 }

apps/viewer/src/pages/[[...publicId]].tsx

@@ -116,6 +116,7 @@ const getTypebotFromPublicId = async (publicId?: string) => {
           publishedTypebot.settings.general?.isHideQueryParamsEnabled ??
           defaultSettings.general.isHideQueryParamsEnabled,
         metadata: publishedTypebot.settings.metadata ?? {},
+        font: publishedTypebot.theme.general?.font ?? null,
       } satisfies Pick<
         TypebotV3PageProps,
         | 'name'
@@ -123,6 +124,7 @@ const getTypebotFromPublicId = async (publicId?: string) => {
         | 'background'
         | 'isHideQueryParamsEnabled'
         | 'metadata'
+        | 'font'
       >)
     : publishedTypebot
 }
@@ -161,6 +163,7 @@ const getTypebotFromCustomDomain = async (customDomain: string) => {
           publishedTypebot.settings.general?.isHideQueryParamsEnabled ??
           defaultSettings.general.isHideQueryParamsEnabled,
         metadata: publishedTypebot.settings.metadata ?? {},
+        font: publishedTypebot.theme.general?.font ?? null,
       } satisfies Pick<
         TypebotV3PageProps,
         | 'name'
@@ -168,6 +171,7 @@ const getTypebotFromCustomDomain = async (customDomain: string) => {
         | 'background'
         | 'isHideQueryParamsEnabled'
         | 'metadata'
+        | 'font'
       >)
     : publishedTypebot
 }
@@ -196,6 +200,7 @@ const App = ({
         | 'background'
         | 'isHideQueryParamsEnabled'
         | 'metadata'
+        | 'font'
       >
   incompatibleBrowser: string | null
 }) => {
@@ -231,6 +236,7 @@ const App = ({
         publishedTypebot.background ?? defaultTheme.general.background
       }
       metadata={publishedTypebot.metadata ?? {}}
+      font={publishedTypebot.font}
     />
   )
 }