Initial commit

quartz/components/frames/DefaultFrame.tsx

@@ -0,0 +1,61 @@
+import { PageFrame, PageFrameProps } from "./types"
+import HeaderConstructor from "../Header"
+
+const Header = HeaderConstructor()
+
+/**
+ * The default page frame — three-column layout with left sidebar, center
+ * content (header + body + afterBody), and right sidebar, followed by a footer.
+ *
+ * This is the original Quartz layout, extracted from renderPage.tsx.
+ */
+export const DefaultFrame: PageFrame = {
+  name: "default",
+  render({
+    componentData,
+    header,
+    beforeBody,
+    pageBody: Content,
+    afterBody,
+    left,
+    right,
+    footer: Footer,
+  }: PageFrameProps) {
+    return (
+      <>
+        <div class="left sidebar">
+          {left.map((BodyComponent) => (
+            <BodyComponent {...componentData} />
+          ))}
+        </div>
+        <div class="center">
+          <div class="page-header">
+            <Header {...componentData}>
+              {header.map((HeaderComponent) => (
+                <HeaderComponent {...componentData} />
+              ))}
+            </Header>
+            <div class="popover-hint">
+              {beforeBody.map((BodyComponent) => (
+                <BodyComponent {...componentData} />
+              ))}
+            </div>
+          </div>
+          <Content {...componentData} />
+          <hr />
+          <div class="page-footer">
+            {afterBody.map((BodyComponent) => (
+              <BodyComponent {...componentData} />
+            ))}
+          </div>
+        </div>
+        <div class="right sidebar">
+          {right.map((BodyComponent) => (
+            <BodyComponent {...componentData} />
+          ))}
+        </div>
+        <Footer {...componentData} />
+      </>
+    )
+  },
+}