Hooks
Functions that hand a component live store data, formatting helpers and customer actions.
A hook is a function whose name starts with use, called at the top of a component. Engine hooks give you the store (useStore), its theme settings (useTheme), price formatting (useMoney), the wishlist, coupons and more, and they keep the component up to date when that data changes.
Entries
Reads the current store (name, logo, settings, contacts…) and can refresh it from the Salla SDK.
useThemeReads the merchant's theme colors, font, theme settings and whether the page reads right-to-left.
useMoneyFormats prices in the page language (with the riyal icon for SAR), and parses or validates amounts.
useNumberTurns digits into Arabic-Indic numerals (١٢٣) when the store has Arabic numbers switched on, whatever the page language.
useDateFormats dates and "2 hours ago" style relative times in the page language, using the browser or server Intl APIs.
useAssetBuilds URLs for your theme's own asset files and for Salla's asset CDN, optionally asking the CDN to resize an image.
useIsClientReturns false while the page is rendered on the server and during hydration, then true once the component has mounted in the browser.
useWishlistThe shopper's wishlist, shared by every component on the page: check a product, and add, remove or toggle it through the Salla SDK.
useProductKeeps a live copy of a product that follows price and stock changes from Salla option pickers, and can reload its details.
useUserThe logged-in customer as a TanStack Query result, plus an isLoggedIn flag; it never requests anything for guests.
useCouponApplies or removes a discount coupon on the shopper's cart through the Salla SDK, with loading and error state.
HookSlotA named empty place in the page that renders every handler registered under its name, plus a spot where Salla apps inject content.
hookRegistryThe one shared list of slot handlers: register content under a slot name, read or clear it, or register many at once with defineHooks.
useHookRegisters a slot handler for as long as the calling component is on screen, and clears that slot name when it goes away.
HookNameThe predefined slot names as a TypeScript enum, so a typo fails to compile instead of silently filling a slot nobody renders.
registerDefaultHooksRegisters the engine's built-in slot handlers (GTM, bundles, store closed, fast checkout, price quote, pre-order); importing the hooks module already runs it.
HookHandler, HookHandlers, HookDefinitionTypes for a slot handler function, the object defineHooks accepts, and a handler as the registry stores it.
useBreadcrumbsBuilds a page's breadcrumb trail from its loader data, with a Home-plus-title fallback and a remembered referrer on product pages.
useCommentsA React key that goes up whenever a shopper posts a comment, so Salla's comments component reloads without a page refresh.
useBlogLikeLikes or unlikes a blog article through the Salla API, with a local like count and a per-browser memory of liked articles.
useDocumentClassAdds classes and attributes to the page <html> and <body> while the calling component is mounted, merged with everyone else.
usePageConfigTells the Salla SDK which page the shopper is on by calling Salla.config.set('page', …) once, when the component mounts.
useOpeningHoursWorks out from a weekly schedule whether the store is open right now and, when closed, when it opens next.
useGtmPushes ecommerce events (view, impressions, click, add to cart, checkout, purchase) to Google Tag Manager's dataLayer when the store has GTM.
useAsyncFnWraps an async function with loading, error and value state; only the newest call updates state, and nothing updates after unmount.
Hook result typesShared shapes behind the action hooks: loading and error state, actions resolving to success, and the wishlist, like and coupon results.