refactor: dev-docs/

1 files changed, 38 insertions, 0 deletions

diff --git a/dev-docs/src/theme/ReactLiveScope/index.js b/dev-docs/src/theme/ReactLiveScope/index.js
new file mode 100644
index 0000000..ca5a902
--- /dev/null
+++ b/dev-docs/src/theme/ReactLiveScope/index.js
@@ -0,0 +1,38 @@
+import React from "react";
+import ExecutionEnvironment from "@docusaurus/ExecutionEnvironment";
+import initialData from "@site/src/initialData";
+import { useColorMode } from "@docusaurus/theme-common";
+
+import "@excalidraw/excalidraw/index.css";
+
+let ExcalidrawComp = {};
+if (ExecutionEnvironment.canUseDOM) {
+  ExcalidrawComp = require("@excalidraw/excalidraw");
+}
+const Excalidraw = React.forwardRef((props, ref) => {
+  if (!window.EXCALIDRAW_ASSET_PATH) {
+    window.EXCALIDRAW_ASSET_PATH =
+      "https://esm.sh/@excalidraw/excalidraw@0.18.0/dist/prod/";
+  }
+
+  const { colorMode } = useColorMode();
+  return <ExcalidrawComp.Excalidraw theme={colorMode} {...props} ref={ref} />;
+});
+// Add react-live imports you need here
+const ExcalidrawScope = {
+  React,
+  ...React,
+  Excalidraw,
+  Footer: ExcalidrawComp.Footer,
+  useDevice: ExcalidrawComp.useDevice,
+  MainMenu: ExcalidrawComp.MainMenu,
+  WelcomeScreen: ExcalidrawComp.WelcomeScreen,
+  LiveCollaborationTrigger: ExcalidrawComp.LiveCollaborationTrigger,
+  Sidebar: ExcalidrawComp.Sidebar,
+  exportToCanvas: ExcalidrawComp.exportToCanvas,
+  initialData,
+  useI18n: ExcalidrawComp.useI18n,
+  convertToExcalidrawElements: ExcalidrawComp.convertToExcalidrawElements,
+};
+
+export default ExcalidrawScope;