Pattern / Feature / NEXOFRAME

Dock

Live

Một bubble nổi duy nhất, kéo thả được, giữ vị trí. Mọi feature cần bề mặt nổi đăng ký một item vào Dock thay vì tự vẽ bubble của riêng mình.

Usage

Thử tắt từng capability bên dưới để thấy điều khiển tương ứng biến mất hoàn toàn, không phải bị vô hiệu hoá. Nguồn: packages/feature-dock/src/, packages/feature-notes/src/.

drag multi-item copy (Notes)

Anatomy

Bubble 48px tròn ở góc, panel Card 320px kéo được riêng, item strip chỉ hiện khi có từ hai item trở lên và multi-item bật. Chi tiết: docs-design-system/03_components/features/dock.md.

API

type DockItem = {
  id: string;
  label: string;
  icon: ReactNode;
  render: () => ReactNode;
  badge?: number | boolean;
};
type DockProps = {
  items: DockItem[];
  positionKey: string;
  capabilities: DockCapability[];
  storage?: DockStorage;
};