Parts
The parts of @poltura/theme-sdk/chrome.
On this page
import { … } from '@poltura/theme-sdk/chrome';Brand
The store's logo linking home, with the dark-scheme logo under a dark colour scheme, or its initial and name when it has none.
Brand(props: BrandProps): ReactElementProps: BrandProps
Example
import { Brand } from '@poltura/theme-sdk/chrome';
export function HeaderStart() {
return <Brand priority classes={{ image: 'h-10' }} />;
}Logo
The store's logo at a set width, with its dark-scheme variant, falling back to the store's name.
Logo(props: LogoProps): ReactElement | nullProps: LogoProps
Example
import { Logo } from '@poltura/theme-sdk/chrome';
export function FooterLogo() {
return <Logo width={96} fallback='nameOnly' />;
}See also: Brand
ColorModeToggle
Switches the storefront between light and dark, with the transition the theme sets.
ColorModeToggle(props: ColorModeToggleProps): ReactElementProps: ColorModeToggleProps
Example
import { ColorModeToggle } from '@poltura/theme-sdk/chrome';
export function FooterEnd() {
return <ColorModeToggle display='switch' />;
}