Brickslab.Libv2.1.5

@brickslab./ui-webAnalytics

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

Panel demo

Props

PropTypeDéfautRequisDescription
openboolean—✓Controls panel visibility.
onOpenChange(v: boolean) => void—✓Called to close the panel (overlay click or Escape).
titlestring——Panel header title.
contextunknown——Arbitrary context passed from the triggering chart (not rendered directly).
childrenReactNode—✓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>