feat(editor): migrate typst mermaid to native (#14499)

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

* **New Features**
* Native/WASM Mermaid and Typst SVG preview rendering on desktop and
mobile, plus cross-platform Preview plugin integrations.

* **Improvements**
* Centralized, sanitized rendering bridge with automatic Typst
font-directory handling and configurable native renderer selection.
* More consistent and robust error serialization and worker-backed
preview flows for improved stability and performance.

* **Tests**
* Extensive unit and integration tests for preview rendering, font
discovery, sanitization, and error serialization.
<!-- end of auto-generated comment: release notes by coderabbit.ai -->

packages/frontend/apps/ios/src/app.tsx

@@ -17,6 +17,7 @@ import {
   SubscriptionService,
   ValidatorProvider,
 } from '@affine/core/modules/cloud';
+import { registerNativePreviewHandlers } from '@affine/core/modules/code-block-preview-renderer';
 import { DocsService } from '@affine/core/modules/doc';
 import { FeatureFlagService } from '@affine/core/modules/feature-flag';
 import { GlobalContextService } from '@affine/core/modules/global-context';
@@ -71,6 +72,7 @@ import { Auth } from './plugins/auth';
 import { Hashcash } from './plugins/hashcash';
 import { NbStoreNativeDBApis } from './plugins/nbstore';
 import { PayWall } from './plugins/paywall';
+import { Preview } from './plugins/preview';
 import { writeEndpointToken } from './proxy';
 import { enableNavigationGesture$ } from './web-navigation-control';
 
@@ -215,6 +217,11 @@ framework.impl(NativePaywallProvider, {
 
 const frameworkProvider = framework.provider();
 
+registerNativePreviewHandlers({
+  renderMermaidSvg: request => Preview.renderMermaidSvg(request),
+  renderTypstSvg: request => Preview.renderTypstSvg(request),
+});
+
 // ------ some apis for native ------
 (window as any).getCurrentServerBaseUrl = () => {
   const globalContextService = frameworkProvider.get(GlobalContextService);

packages/frontend/apps/ios/src/plugins/preview/definitions.ts

@@ -0,0 +1,16 @@
+export interface PreviewPlugin {
+  renderMermaidSvg(options: {
+    code: string;
+    options?: {
+      theme?: string;
+      fontFamily?: string;
+      fontSize?: number;
+    };
+  }): Promise<{ svg: string }>;
+  renderTypstSvg(options: {
+    code: string;
+    options?: {
+      fontUrls?: string[];
+    };
+  }): Promise<{ svg: string }>;
+}

packages/frontend/apps/ios/src/plugins/preview/index.ts

@@ -0,0 +1,8 @@
+import { registerPlugin } from '@capacitor/core';
+
+import type { PreviewPlugin } from './definitions';
+
+const Preview = registerPlugin<PreviewPlugin>('Preview');
+
+export * from './definitions';
+export { Preview };