draw path | draw area | localstorage layer state | add entities property parallel | timeline bar

components/BackgroundLayersPanel.tsx

@@ -1,5 +1,6 @@
 "use client";
 
+import { ReactNode } from "react";
 import {
     BACKGROUND_LAYER_OPTIONS,
     BackgroundLayerId,
@@ -11,6 +12,7 @@ type Props = {
     onToggleLayer: (id: BackgroundLayerId) => void;
     onShowAll: () => void;
     onHideAll: () => void;
+    topContent?: ReactNode;
 };
 
 export default function BackgroundLayersPanel({
@@ -18,6 +20,7 @@ export default function BackgroundLayersPanel({
     onToggleLayer,
     onShowAll,
     onHideAll,
+    topContent,
 }: Props) {
     return (
         <aside
@@ -31,6 +34,8 @@ export default function BackgroundLayersPanel({
                 overflowY: "auto",
             }}
         >
+            {topContent ? <div style={{ marginBottom: "12px" }}>{topContent}</div> : null}
+
             <h3 style={{ margin: 0, marginBottom: "10px" }}>Map Layers</h3>
 
             <div style={{ display: "flex", gap: "8px", marginBottom: "12px" }}>