Initial commit

src/utils/tldraw/ui-overrides.tsx

@@ -0,0 +1,93 @@
+import {
+    TLComponents,
+    TLUiOverrides,
+    TldrawUiToastsProvider,
+    TLUiToast,
+    TLUiToastsContextType,
+    Atom,
+    atom
+} from '@tldraw/tldraw';
+import { ReactNode } from 'react';
+
+import { regularComponentsIndex, presentationComponentsIndex } from './ui-overrides/components';
+import { presentationUiOverridesIndex, regularUiOverridesIndex } from './ui-overrides/overrides';
+
+// Toast Wrapper Component
+const ToastWrapper = ({ children }: { children: ReactNode }) => {
+    // Create custom toast overrides
+    const toastOverrides = (): TLUiToastsContextType => {
+        const toasts: Atom<TLUiToast[]> = atom('toasts', []);
+
+        return {
+            addToast: (toast) => {
+                const id = toast.id || Math.random().toString();
+                const newToast: TLUiToast = { ...toast, id };
+                toasts.set([...toasts.get(), newToast]);
+                return id;
+            },
+            removeToast: (id) => {
+                toasts.set(toasts.get().filter((t: TLUiToast) => t.id !== id));
+                return id;
+            },
+            clearToasts: () => {
+                toasts.set([]);
+            },
+            toasts
+        };
+    };
+
+    return (
+        <TldrawUiToastsProvider overrides={toastOverrides}>
+            {children}
+        </TldrawUiToastsProvider>
+    );
+};
+
+// Function to get the appropriate UI overrides
+export const getUiOverrides = (presentationMode: boolean): TLUiOverrides => {
+    return presentationMode ? presentationUiOverridesIndex : regularUiOverridesIndex;
+};
+
+// Function to get the appropriate UI configuration
+export const getUiComponents = (presentationMode: boolean): TLComponents => {
+    return presentationMode ? presentationComponents : regularComponents;
+};
+
+// Regular components configuration
+const regularComponents: TLComponents = {
+    Toolbar: regularComponentsIndex.Toolbar,
+    InFrontOfTheCanvas: regularComponentsIndex.InFrontOfTheCanvas,
+    KeyboardShortcutsDialog: regularComponentsIndex.KeyboardShortcutsDialog,
+    HelperButtons: regularComponentsIndex.HelperButtons,
+    ActionsMenu: regularComponentsIndex.ActionsMenu,
+    ContextMenu: regularComponentsIndex.ContextMenu,
+    DebugMenu: regularComponentsIndex.DebugMenu,
+    HelpMenu: regularComponentsIndex.HelpMenu,
+    MainMenu: regularComponentsIndex.MainMenu,
+    NavigationPanel: regularComponentsIndex.NavigationPanel,
+    PageMenu: regularComponentsIndex.PageMenu,
+    QuickActions: regularComponentsIndex.QuickActions,
+    StylePanel: regularComponentsIndex.StylePanel,
+    ZoomMenu: regularComponentsIndex.ZoomMenu
+};
+
+// Presentation components configuration
+const presentationComponents: TLComponents = {
+    Toolbar: presentationComponentsIndex.Toolbar,
+    InFrontOfTheCanvas: presentationComponentsIndex.InFrontOfTheCanvas,
+    KeyboardShortcutsDialog: presentationComponentsIndex.KeyboardShortcutsDialog,
+    HelperButtons: presentationComponentsIndex.HelperButtons,
+    ActionsMenu: presentationComponentsIndex.ActionsMenu,
+    ContextMenu: presentationComponentsIndex.ContextMenu,
+    DebugMenu: presentationComponentsIndex.DebugMenu,
+    HelpMenu: presentationComponentsIndex.HelpMenu,
+    MainMenu: presentationComponentsIndex.MainMenu,
+    NavigationPanel: presentationComponentsIndex.NavigationPanel,
+    PageMenu: presentationComponentsIndex.PageMenu,
+    QuickActions: presentationComponentsIndex.QuickActions,
+    StylePanel: presentationComponentsIndex.StylePanel,
+    ZoomMenu: presentationComponentsIndex.ZoomMenu
+};
+
+export { ToastWrapper };
+