Кнопка пользователя в сайдбаре

SidebarUserButton отображает аватар, имя и почту вместе с доступным с клавиатуры меню в портале — с пунктами, ссылками, разделителями, деструктивным тоном, свёрнутым режимом только с иконкой и позиционированием с учётом границ экрана.

Пример

Интерактивный пример

Использование

Импортируйте компонент из публичной точки входа пакета.

import { SidebarUserButton } from "denjs-ui";

const items = [
  { id: "profile", label: "My profile", href: "/profile" },
  { id: "settings", label: "Settings", href: "/settings" },
  { type: "separator" as const, id: "sign-out-separator" },
  { id: "sign-out", label: "Sign out", tone: "danger" as const },
];

export function Example() {
  return (
    <SidebarUserButton
      name="Erica"
      email="erica@example.com"
      avatarFallback="ER"
      items={items}
    />
  );
}