Design System

App Surfaces - Side Panel

Overview
Review paths

Side Panel

A bounded shell that keeps support context adjacent to the main task without replacing host chat chrome.

Side Panel

A side panel keeps support context adjacent to the task instead of overloading the inline card.

What it is for

Introduce a bounded shell with adjacent context while preserving the host chat as the outer frame.

Use when

The task needs supporting context, secondary actions, or list/detail structure beside the main work.

Do not use when

A compact inline summary card would be enough.

Related patterns

Navigation & Shells · Widgets & Registry · ChatKit Shells

Escalation path

Inline summary card → side panel → fullscreen workspace.

Developer details

Start from these files when you need to trace the live implementation.

src/shared/ui/chat/ChatShellFrame.tsx · src/shared/ui/chat/ContextRail.tsx

Workspace shell

Bounded shell, not replacement chat chrome.

sheet
KnearMe | Service Portfolio Platform