LogoutButton

Log out the current customer. Runs useLogout; session teardown is delegated to AuthProvider's onLoggedOut seam — this never touches cookies.

import { LogoutButton } from "@evolve-storefront/feature-auth/logout-button";

Renders inside AuthProvider.

Preview

// AuthProvider's onLoggedOut tears down the session; this never touches cookies.
<LogoutButton onLoggedOut={() => router.push("/")} />;

Prop	Type	Description
`type?`	`"button" \| "reset" \| "submit"`
`isPending?`	`boolean`	The action is running. The button keeps its label, so its width and accessible name hold, shows a spinner and is `aria-busy`. It stays focusable rather than `disabled`, so focus is not dropped mid-save; clicks and the form submit it would trigger are ignored. Not supported with `asChild`.
`variant?`	`ButtonVariant`
`tone?`	`ButtonTone`
`isIconOnly?`	`boolean`	The button has no visible label, so it is square. Structural rather than a size: it says the button has nothing to be wide for, and says nothing about how big — the brand's control tokens still decide that. More Not inferred from the children. A kebab menu is as often a glyph or an SVG as an `<Icon>`, and a visually-hidden label — the accessible thing to add — would break any `:only-child` predicate silently.
`asChild?`	`boolean`
`data-component?`	`undefined`	A button's identity is not a caller's to rename — see `buttonProps`. Typed away so a call site renaming it fails to compile rather than passing an attribute that is silently discarded.
`onLoggedOut?`	`(() => void)`	Called after a successful logout (alongside the provider's `onLoggedOut` seam).
`children?`	`ReactNode`

Any other props go to the root element, like on a plain HTML element.