PanelSidebar

Animated left or right side panel that collapses to width 0. Used inside chart-test for the inspector rail.

Preview

Usage

import { PanelSidebar } from '@ramtt/ui'

<PanelSidebar side="right" open={open} header={<h2>Inspector</h2>}>
  {/* content */}
</PanelSidebar>

Props

PropTypeDefaultDescription
side*'left' | 'right'Which edge the panel attaches to
open*booleanControls expand/collapse
widthnumberExpanded width in px (defaults to PANEL_WIDTH token)
onOpenChange(open: boolean) => voidOptional open-state setter
headerReactNodeOptional fixed header inside the panel
children*ReactNodePanel body
classNamestringAdditional Tailwind classes