Brickslab.Tools

@brickslab./ui-webAnalytics

Slide-in side panel for chart drilldown details with overlay and keyboard close.

Panel demo

Props

Prop	Type	Défaut	Requis	Description
`open`	`boolean`	—	✓	Controls panel visibility.
`onOpenChange`	`(v: boolean) => void`	—	✓	Called to close the panel (overlay click or Escape).
`title`	`string`	—	—	Panel header title.
`context`	`unknown`	—	—	Arbitrary context passed from the triggering chart (not rendered directly).
`children`	`ReactNode`	—	✓	Panel body content.

Override rapide

Tous les paramètres listés dans cette table sont overrideables via les props. Utilisez ce squelette comme point de départ.

<MyComponent
  open={true}
  onOpenChange={true}
  title="..."
  context={...}
  children={<span>...</span>}
/>

openonOpenChangetitlecontextchildren

Usage

tsx

import { DrilldownPanel } from "@brickslab./ui-web";

const [open, setOpen] = useState(false);

<button onClick={() => setOpen(true)}>View details</button>

<DrilldownPanel
  open={open}
  onOpenChange={setOpen}
  title="Segment breakdown"
>
  <DistributionChart data={segmentData} />
</DrilldownPanel>