/** * ViewPanel — one pane in the ResizableView grid. * * Renders a Card whose header is a Tabs bar and whose body is the active tab's * content area. It is both a drag SOURCE (tabs can be picked up) and a drag * TARGET with two independent drop zones: * * ┌─────────────────────────────────┐ * │ [Tab A] [Tab B] [Tab C] │ ← TABS DROP ZONE * ├─────────────────────────────────┤ * │ │ * │ content area │ ← CONTENT DROP ZONE * │ (split overlay shown here) │ * │ │ * └─────────────────────────────────┘ * * TABS DROP ZONE * Dropping here reorders tabs or moves a tab from another panel. * A thin 2 px bar (::before / ::after pseudo-element on the neighbouring Tab) * previews the insertion slot. The slot is determined by which horizontal half * of each Tab the cursor is over (left-half → insert before, right-half → * insert after). The dropped tab becomes active only for cross-panel drops. * * CONTENT DROP ZONE * A semi-transparent overlay divides the content area into five zones using * `HOVER_OFFSET` (33 %) margins: * * ┌──────┬──────────┬──────┐ * │ │ top │ │ * │ left │ center │ right│ * │ │ bottom │ │ * └──────┴──────────┴──────┘ * * center → append tab to this panel (no split) * left/right/top/bottom → split the panel and place a new panel on that side */ export interface ViewTab { path: string; label?: string; } export interface Panel { /** Stable unique ID assigned by ResizableView on first render. Used as v-for key. */ id?: string; tabs: ViewTab[]; } interface Props { panel: Panel; } type __VLS_Slots = { tab: (props: { tab: ViewTab; panel: Panel; }) => any; }; declare const __VLS_base: import('vue').DefineComponent & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, false, {}, any>; declare const __VLS_export: __VLS_WithSlots; declare const _default: typeof __VLS_export; export default _default; type __VLS_WithSlots = T & { new (): { $slots: S; }; };