Initial commit

src/components/layout/CenterPanel.tsx

@@ -0,0 +1,35 @@
+import { useAppStore } from '../../store/appStore';
+import ItemPreview from '../asset/ItemPreview';
+import ClassDetail from '../script/ClassDetail';
+import FlowViewer from '../flow/FlowViewer';
+import GumpPreview from '../gump/GumpPreview';
+import ScriptGumpDetail from '../gump/ScriptGumpDetail';
+import styles from './CenterPanel.module.css';
+
+export default function CenterPanel() {
+  const { centerMode, selectedTile, selectedGump, selectedScriptGump } = useAppStore();
+
+  return (
+    <div className={styles.panel}>
+      {centerMode === 'empty' && (
+        <div className={styles.empty}>
+          <span className="font-cinzel">Select an item from the left panel</span>
+        </div>
+      )}
+      {centerMode === 'asset_static' && selectedTile && (
+        <ItemPreview tile={selectedTile} />
+      )}
+      {centerMode === 'script_class' && <ClassDetail />}
+      {centerMode === 'flow_method' && <FlowViewer />}
+      {centerMode === 'gump_render' && selectedScriptGump && (
+        <ScriptGumpDetail />
+      )}
+      {centerMode === 'gump_render' && !selectedScriptGump && (
+        <div className={styles.placeholder}>Gump Renderer — Phase 4</div>
+      )}
+      {centerMode === 'gump_image' && selectedGump && (
+        <GumpPreview gump={selectedGump} />
+      )}
+    </div>
+  );
+}