From 1d084f05952071e0c4b204dc01d3d7de064d480b Mon Sep 17 00:00:00 2001
From: dwelle <5153846+dwelle@users.noreply.github.com>
Date: Wed, 12 Jun 2024 19:54:28 +0200
Subject: [PATCH] feat: support `props.className`

---
 packages/excalidraw/components/App.tsx | 14 +++++++++-----
 packages/excalidraw/index.tsx          |  2 ++
 packages/excalidraw/types.ts           |  1 +
 3 files changed, 12 insertions(+), 5 deletions(-)

diff --git a/packages/excalidraw/components/App.tsx b/packages/excalidraw/components/App.tsx
index ae35cefad9655..18ce8622cf885 100644
--- a/packages/excalidraw/components/App.tsx
+++ b/packages/excalidraw/components/App.tsx
@@ -1493,11 +1493,15 @@ class App extends React.Component<AppProps, AppState> {
 
     return (
       <div
-        className={clsx("excalidraw excalidraw-container", {
-          "excalidraw--view-mode": this.state.viewModeEnabled,
-          "excalidraw--mobile": this.device.editor.isMobile,
-          "excalidraw--zen-mode": this.state.zenModeEnabled,
-        })}
+        className={clsx(
+          "excalidraw excalidraw-container",
+          this.props.className,
+          {
+            "excalidraw--view-mode": this.state.viewModeEnabled,
+            "excalidraw--mobile": this.device.editor.isMobile,
+            "excalidraw--zen-mode": this.state.zenModeEnabled,
+          },
+        )}
         style={{
           ["--ui-pointerEvents" as any]: shouldBlockPointerEvents
             ? POINTER_EVENTS.disabled
diff --git a/packages/excalidraw/index.tsx b/packages/excalidraw/index.tsx
index 3e95a1629bab3..640841adddc7b 100644
--- a/packages/excalidraw/index.tsx
+++ b/packages/excalidraw/index.tsx
@@ -22,6 +22,7 @@ polyfill();
 
 const ExcalidrawBase = (props: ExcalidrawProps) => {
   const {
+    className,
     onChange,
     initialData,
     excalidrawAPI,
@@ -115,6 +116,7 @@ const ExcalidrawBase = (props: ExcalidrawProps) => {
       <InitializeApp langCode={langCode} theme={theme}>
         <App
           id={id}
+          className={className}
           onChange={onChange}
           initialData={initialData}
           excalidrawAPI={excalidrawAPI}
diff --git a/packages/excalidraw/types.ts b/packages/excalidraw/types.ts
index df87e8127bb01..f4c9f474e0450 100644
--- a/packages/excalidraw/types.ts
+++ b/packages/excalidraw/types.ts
@@ -440,6 +440,7 @@ export type OnUserFollowedPayload = {
 
 export interface ExcalidrawProps {
   id?: string | null;
+  className?: string;
   onChange?: (
     elements: readonly OrderedExcalidrawElement[],
     appState: AppState,