Skip to main content

Panel Container

from v9.3

PanelContainer is the base class for PanelComponent instances that host one Panel.

Extend it when the built-in panel containers do not match the behavior or layout your application needs. Extend PanelComponent directly for mountable UI that does not host a panel.

Usage​

import {PanelContainer, type PanelContainerProps} from '@deck.gl-community/panels';

class CustomPanelContainer extends PanelContainer<PanelContainerProps> {
  placement = 'top-right' as const;
  className = 'custom-panel-container';

  onRenderHTML(rootElement: HTMLElement): void {
    rootElement.textContent = 'Custom container content';
  }
}

const container = new CustomPanelContainer({id: 'custom-container'});

Remarks​

  • BoxPanelContainer, ModalPanelContainer, SidebarPanelContainer, and FullScreenPanelContainer all extend PanelContainer.
  • PanelManager mounts any PanelComponent, including PanelContainer instances, into plain HTML.
  • Deck.gl uses the same components through PanelWidget and its thin named adapters in @deck.gl-community/widgets.