components Sidebar.tsx

100% Statements 1/1

100% Branches 0/0

100% Functions 1/1

100% Lines 1/1

Press n or j to go to the next uncovered block, b, p or k for the previous block.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30  
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4x
 
 
 
 
 
 
 
 
 
 
 
  import { HierarchyPanel } from "@/components/HierarchyPanel";
import { Palette } from "@/components/Palette";
import type { CanvasComponent } from "@/types/canvas";
 
interface SidebarProps {
  components: CanvasComponent[];
  selectedComponentId: string | null;
  onSelectComponent: (id: string) => void;
  onMoveComponent: (componentId: string, parentId: string | null, index: number) => void;
}
 
export function Sidebar({
  components,
  selectedComponentId,
  onSelectComponent,
  onMoveComponent,
}: SidebarProps) {
  return (
    <aside className="flex h-full min-h-0 w-64 shrink-0 flex-col border-r border-vscode-panel-border bg-vscode-panel-background">
      <HierarchyPanel
        components={components}
        selectedComponentId={selectedComponentId}
        onSelectComponent={onSelectComponent}
        onMoveComponent={onMoveComponent}
      />
      <Palette />
    </aside>
  );
}