From 225db4a7805befe009fe055fc2ef5daedd6c04f9 Mon Sep 17 00:00:00 2001
From: kj_sh604
Date: Sun, 15 Mar 2026 16:19:35 -0400
Subject: refactor: examples/
---
examples/with-nextjs/src/app/favicon.ico | Bin 0 -> 25931 bytes
examples/with-nextjs/src/app/layout.tsx | 11 +++++++++
examples/with-nextjs/src/app/page.tsx | 26 +++++++++++++++++++++
examples/with-nextjs/src/common.scss | 15 ++++++++++++
examples/with-nextjs/src/excalidrawWrapper.tsx | 22 +++++++++++++++++
.../with-nextjs/src/pages/excalidraw-in-pages.tsx | 22 +++++++++++++++++
6 files changed, 96 insertions(+)
create mode 100644 examples/with-nextjs/src/app/favicon.ico
create mode 100644 examples/with-nextjs/src/app/layout.tsx
create mode 100644 examples/with-nextjs/src/app/page.tsx
create mode 100644 examples/with-nextjs/src/common.scss
create mode 100644 examples/with-nextjs/src/excalidrawWrapper.tsx
create mode 100644 examples/with-nextjs/src/pages/excalidraw-in-pages.tsx
(limited to 'examples/with-nextjs/src')
diff --git a/examples/with-nextjs/src/app/favicon.ico b/examples/with-nextjs/src/app/favicon.ico
new file mode 100644
index 0000000..718d6fe
Binary files /dev/null and b/examples/with-nextjs/src/app/favicon.ico differ
diff --git a/examples/with-nextjs/src/app/layout.tsx b/examples/with-nextjs/src/app/layout.tsx
new file mode 100644
index 0000000..225b603
--- /dev/null
+++ b/examples/with-nextjs/src/app/layout.tsx
@@ -0,0 +1,11 @@
+export default function RootLayout({
+ children,
+}: {
+ children: React.ReactNode;
+}) {
+ return (
+
+ {children}
+
+ );
+}
diff --git a/examples/with-nextjs/src/app/page.tsx b/examples/with-nextjs/src/app/page.tsx
new file mode 100644
index 0000000..191aca1
--- /dev/null
+++ b/examples/with-nextjs/src/app/page.tsx
@@ -0,0 +1,26 @@
+import dynamic from "next/dynamic";
+import Script from "next/script";
+import "../common.scss";
+
+// Since client components get prerenderd on server as well hence importing the excalidraw stuff dynamically
+// with ssr false
+const ExcalidrawWithClientOnly = dynamic(
+ async () => (await import("../excalidrawWrapper")).default,
+ {
+ ssr: false,
+ },
+);
+
+export default function Page() {
+ return (
+ <>
+ Switch to Pages router
+ App Router
+
+ {/* @ts-expect-error - https://github.com/vercel/next.js/issues/42292 */}
+
+
+ );
+}
diff --git a/examples/with-nextjs/src/common.scss b/examples/with-nextjs/src/common.scss
new file mode 100644
index 0000000..456bc76
--- /dev/null
+++ b/examples/with-nextjs/src/common.scss
@@ -0,0 +1,15 @@
+* {
+ box-sizing: border-box;
+ font-family: sans-serif;
+}
+
+a {
+ color: #1c7ed6;
+ font-size: 20px;
+ text-decoration: none;
+ font-weight: 500;
+}
+
+.page-title {
+ text-align: center;
+}
diff --git a/examples/with-nextjs/src/excalidrawWrapper.tsx b/examples/with-nextjs/src/excalidrawWrapper.tsx
new file mode 100644
index 0000000..b4c45fa
--- /dev/null
+++ b/examples/with-nextjs/src/excalidrawWrapper.tsx
@@ -0,0 +1,22 @@
+"use client";
+import * as excalidrawLib from "@excalidraw/excalidraw";
+import { Excalidraw } from "@excalidraw/excalidraw";
+import App from "../../with-script-in-browser/components/ExampleApp";
+
+import "@excalidraw/excalidraw/index.css";
+
+const ExcalidrawWrapper: React.FC = () => {
+ return (
+ <>
+ {}}
+ excalidrawLib={excalidrawLib}
+ >
+
+
+
+ );
+};
+
+export default ExcalidrawWrapper;
diff --git a/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx b/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx
new file mode 100644
index 0000000..527a346
--- /dev/null
+++ b/examples/with-nextjs/src/pages/excalidraw-in-pages.tsx
@@ -0,0 +1,22 @@
+import dynamic from "next/dynamic";
+import "../common.scss";
+
+// Since client components get prerenderd on server as well hence importing the excalidraw stuff dynamically
+// with ssr false
+const Excalidraw = dynamic(
+ async () => (await import("../excalidrawWrapper")).default,
+ {
+ ssr: false,
+ },
+);
+
+export default function Page() {
+ return (
+ <>
+ Switch to App router
+ Pages Router
+ {/* @ts-expect-error - https://github.com/vercel/next.js/issues/42292 */}
+
+
+ );
+}
--
cgit v1.2.3