Workbench

import { Dock, Workbench } from '@hanzo/ui/product'

Types

export type Side = 'left' | 'right' | 'bottom'

export type Tab = {
  id: string
  title: string
  icon?: ReactNode
  content: ReactNode
  /** Closable unless a surface says otherwise; the console usually is not. */
  closable?: boolean
}

export type DockProps = {
  side: Side
  tabs: Tab[]
  /** Controlled active tab; omit and the dock keeps its own. */
  activeId?: string
  defaultActiveId?: string
  onActivate?: (id: string) => void
  onClose?: (id: string) => void
  /** End of the strip — the surface's own control, e.g. a new-tab menu. */
  actions?: ReactNode
  /** Extent across the docked edge: width for left/right, height for bottom. */
  size?: number
  onResize?: (size: number) => void
  minSize?: number
  maxSize?: number
}

export type WorkbenchProps = {
  left?: Omit<DockProps, 'side'>
  right?: Omit<DockProps, 'side'>
  bottom?: Omit<DockProps, 'side'>
  /** The center view — the work itself, and the lowest sheet. */
  children: ReactNode
}

Exports