2026-03-13 07:11:31 +01:00
|
|
|
import { useCallback, useState } from 'react'
|
|
|
|
|
|
2026-03-30 09:29:57 +02:00
|
|
|
export const COLUMN_MIN_WIDTHS = {
|
|
|
|
|
sidebar: 180,
|
|
|
|
|
noteList: 220,
|
2026-03-30 13:56:28 +02:00
|
|
|
editor: 800,
|
2026-03-30 09:29:57 +02:00
|
|
|
inspector: 240,
|
|
|
|
|
} as const
|
|
|
|
|
|
2026-03-30 18:30:38 +02:00
|
|
|
export function useLayoutPanels(options?: { initialInspectorCollapsed?: boolean }) {
|
2026-03-13 07:11:31 +01:00
|
|
|
const [sidebarWidth, setSidebarWidth] = useState(250)
|
|
|
|
|
const [noteListWidth, setNoteListWidth] = useState(300)
|
|
|
|
|
const [inspectorWidth, setInspectorWidth] = useState(280)
|
2026-03-30 18:45:45 +02:00
|
|
|
const [inspectorCollapsed, setInspectorCollapsed] = useState(options?.initialInspectorCollapsed ?? true)
|
2026-03-30 09:29:57 +02:00
|
|
|
const handleSidebarResize = useCallback((delta: number) => setSidebarWidth((w) => Math.max(COLUMN_MIN_WIDTHS.sidebar, Math.min(400, w + delta))), [])
|
|
|
|
|
const handleNoteListResize = useCallback((delta: number) => setNoteListWidth((w) => Math.max(COLUMN_MIN_WIDTHS.noteList, Math.min(500, w + delta))), [])
|
|
|
|
|
const handleInspectorResize = useCallback((delta: number) => setInspectorWidth((w) => Math.max(COLUMN_MIN_WIDTHS.inspector, Math.min(500, w - delta))), [])
|
2026-03-13 07:11:31 +01:00
|
|
|
return { sidebarWidth, noteListWidth, inspectorWidth, inspectorCollapsed, setInspectorCollapsed, handleSidebarResize, handleNoteListResize, handleInspectorResize }
|
|
|
|
|
}
|