Types
The types of @poltura/theme-sdk/chrome.
On this page
import { … } from '@poltura/theme-sdk/chrome';HeaderSticky
How the header behaves as the page scrolls, as the merchant set it.
behaviorrequired'static' | 'sticky' | 'reveal'`static` scrolls away, `sticky` stays pinned, `reveal` hides on the way down and returns on the way up.
overlayrequiredbooleanWhether the header lies over the first section of this page until the page scrolls.
shrinkrequiredbooleanWhether a pinned header shrinks once the page scrolls.
HeaderData
What a header draws from, so a theme's header takes no props.
categoriesrequiredreadonly NavCategory[]The top-level categories with their subcategories, for a category menu.
localerequiredLocaleThe language the page is shown in.
localesrequiredreadonly Locale[]Every language the store offers, the current one included.
customerrequiredCustomer | nullThe signed-in shopper, or null for a guest.
signedInrequiredbooleanWhether the shopper is signed in.
stickyrequiredHeaderStickyHow the header behaves as the page scrolls.
LocaleSwitcherState
Language choice state.
currentrequiredLocaleThe language the page is shown in.
availablerequiredreadonly Locale[]Every language the store offers, the current one included; fewer than two means no choice.
hrefForrequired(locale: Locale) => stringThe page being viewed, at its address in another language.
switchTorequired(locale: Locale) => voidRemembers the language as the shopper's choice, then opens the page in it.
flagOfrequired(locale: Locale) => CountryCode | nullThe country whose flag stands for a language, also for languages whose tag names no country.
LocaleSwitcherProps
Props of LocaleSwitcher.
display'dropdown' | 'inline'One button opening a menu with a language and a currency group, or both groups side by side; defaults to dropdown.
label'name' | 'code' | 'flag'Each language's own name, its two-letter code, or its flag alone; defaults to the name.
flagsbooleanDraws each language's flag before its label.
currencybooleanOffers the currencies too; defaults to true. Turn it off where the theme draws its own {@link CurrencySwitcher}.
classNamestringClasses added to the switcher.
attrsElementAttrsA block's attributes, spread on the switcher's root when it draws the block itself.
CurrencySwitcherState
Currency choice state.
currentrequiredCurrencyCodeThe currency prices are shown in.
availablerequiredreadonly CurrencyCode[]Every currency the storefront offers, the current one included; fewer than two means no choice.
switchTorequired(currency: CurrencyCode) => voidShows prices and the cart in the currency from now on, then reloads the page in it.
symbolOfrequired(currency: CurrencyCode) => stringThe currency's symbol in the page language, such as `€` or `Ft`.
CurrencySwitcherProps
Props of CurrencySwitcher.
display'dropdown' | 'inline'A dropdown behind one button, or every currency side by side; defaults to dropdown.
label'code' | 'symbol'Each currency's code (`EUR`) or its symbol (`€`); defaults to the code.
classNamestringClasses added to the switcher.
attrsElementAttrsA block's attributes, spread on the switcher's root when it draws the block itself.
StorefrontChoice
A market.
idrequiredstringThe market's id, unique among the choices; several choices may share one address.
hostrequiredstringIts address: a domain, such as `bolt.de`, or host/prefix, such as `bolt.hu/at`.
countryrequiredCountryCodeThe country the storefront is made for.
countryNamerequiredstringThat country's name in the page language.
namerequiredstringWhat the storefront is called in the page language: its market's name, else its country's.
StorefrontSwitcherState
Storefront choice state.
currentrequiredStorefrontChoice | nullThe market the page shows, never one of `others`; null before the store has a market.
othersrequiredreadonly StorefrontChoice[]The store's other markets, at this address or another; empty when it has only one.
moveTorequired(storefront: StorefrontChoice) => voidTakes the shopper there with their cart: in place at this address, else on the same page at the other address.
MobileMenuState
The mobile menu's state, shared by the button that opens it and the drawer that shows it.
openrequiredbooleanWhether the mobile menu is open.
setOpenrequired(open: boolean) => voidOpens or closes the menu; closing returns it to the first level.
panelrequiredstring | nullThe submenu the menu has drilled into, or null at the first level.
pushrequired(panel: string) => voidDrills into a submenu.
poprequired() => voidGoes back one level.
MobileMenuProps
Props of MobileMenu.
titlerequiredstringNames the drawer for assistive technology.
side'left' | 'right'The edge the drawer slides in from; defaults to the left.
headerReactNodeDrawn at the top of the drawer, such as the store's logo.
childrenReactNodeWhat the drawer holds; defaults to the main menu.
classNamestringClasses added to the drawer.
HeaderVisibility
Header scroll state.
scrolledrequiredbooleanWhether the page has scrolled past the header's height.
hiddenrequiredbooleanWhether a revealing header is hidden because the shopper scrolls down.
PromoBarState
The announcement strip above the header, as the merchant wrote it.
visiblerequiredbooleanWhether the strip is on and has text.
textrequiredstringThe announcement in the page language.
hrefrequiredstringWhere the announcement links.
PromoBarProps
Props of PromoBar.
classNamestringClasses added to the strip.
BrandClasses
Class names for the pieces of Brand.
imagestringThe logo picture.
markstringThe initial drawn in place of a missing logo.
labelstringThe store's name drawn in place of a missing logo.
BrandProps
Props of Brand.
hrefstringWhere the brand links; defaults to the home page.
prioritybooleanLoads the logo first, for the header above the fold.
classNamestringClasses added to the link.
classesBrandClassesClasses added to the pieces.
LogoProps
Props of Logo.
imageMediaImageRef | nullA picture to draw instead of the store's logo.
widthnumberThe logo's width in pixels; defaults to 120.
fallback'name' | 'nameOnly' | 'none'What to draw without a logo: the initial and name, the name alone, or nothing; defaults to the initial and name.
linkHomebooleanWhether the logo links home; defaults to true.
classNamestringClasses added to the logo.
UserMenuProps
Props of UserMenu.
display'icon' | 'label'An icon alone, or the icon with a label; defaults to the icon.
greetbooleanNames a signed-in shopper by first name in the label.
classNamestringClasses added to the menu button.
LocaleBannerProps
Props of LocaleBanner.
classNamestringClasses added to the banner.
ColorModeToggleProps
Props of ColorModeToggle.
display'icon' | 'switch'One button that flips between light and dark, or a switch of light, dark and system; defaults to the button.
classNamestringClasses added to the toggle.