@numueg/theme-sdk 0.3.2 → 0.5.0

package/dist/index.d.ts

@@ -2,8 +2,11 @@ import { i as Store, e as Product, b as Collection, C as Cart, c as Customer, P
 export { A as Address, a as CartItem, O as Order, d as OrderItem, f as ProductImage, j as ProductOption, h as SizeChartMode } from './entities-6MGANln7.js';
 import { T as ThemeSettingsV3, c as SectionInstance, M as MountResult, B as BlockInstance, b as BlockSchema, a as BlockProps$1, f as SectionSchema, e as SectionProps$1 } from './theme-D0QybTQS.js';
 export { E as ExternalThemeMetadata, h as MAX_BLOCK_DEPTH, P as PageTemplate, i as PresetBlock, S as SectionGroup, d as SectionPreset, g as SettingDefinition } from './theme-D0QybTQS.js';
+export { KNOWN_SETTING_TYPES, KNOWN_TEMPLATES, REQUIRED_TEMPLATES, SDK_VERSION, THEME_CONTRACT_VERSION, ValidationIssue, ValidationResult, mergeResults, validateBuiltManifest, validateManifest, validateSectionSchema, validateSettingsAgainstSchema } from './validation.js';
+import { L as LocalizationState, T as ThemeMountContext, a as ThemeRenderArgs, M as MenuItemData } from './mount-BN2mz_wx.js';
+export { C as CartContext, b as CollectionContext, c as CustomerContext, d as LocalizationContext, N as NavigationContext, P as PageContext, e as ProductContext, S as ShopContext, f as ThemeMountPage, g as ThemeSettingsContext, h as buildThemeElement, m as mountTheme } from './mount-BN2mz_wx.js';
 import * as react from 'react';
-import { ReactNode, ReactElement, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
+import { ReactElement, ReactNode, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
 export { resolveThemeSettings } from './normalize.js';
 
 /**
@@ -82,90 +85,6 @@ declare function useThemeSettings(): ThemeSettingsV3;
  */
 declare function useCurrentTemplate(): string;
 
-interface LocalizationState {
-    locale: string;
-    direction: "ltr" | "rtl";
-    translations: Record<string, string>;
-    formatMoney: (amount: number, currency?: string) => string;
-    formatDate: (date: string | Date) => string;
-    /**
-     * Phase 3.7 — locale-aware number formatter. Routes to either
-     * Western (1234) or Arab-Indic (١٢٣٤) digits depending on
-     * `store.settings.numerals`. Themes calling formatMoney get the
-     * same digit choice automatically; this is for raw counts ("12 items").
-     */
-    formatNumber: (n: number, options?: Intl.NumberFormatOptions) => string;
-    /**
-     * Phase 3.6 — switch the active locale.
-     *
-     * Sets the `numu_locale` cookie and triggers a full page reload so
-     * the server-rendered layout picks up the new locale (the storefront
-     * resolves locale at SSR time from cookie/query). Returns once the
-     * cookie is written; the page navigation cancels any pending React
-     * work so callers don't need to await.
-     */
-    setLocale: (next: string) => void;
-    /**
-     * Phase 3.6 — list of locales the store advertises. Empty when the
-     * store hasn't configured a multi-locale catalog. Themes use this
-     * to decide whether to render the LocaleSwitcher at all.
-     */
-    availableLocales: string[];
-}
-declare const ShopContext: react.Context<Store | null>;
-declare const ProductContext: react.Context<Product | null>;
-declare const CollectionContext: react.Context<Collection | null>;
-declare const CartContext: react.Context<{
-    cart: Cart;
-    addItem: (productId: string, variantId?: string, quantity?: number) => Promise<void>;
-    removeItem: (itemId: string) => Promise<void>;
-    updateQuantity: (itemId: string, quantity: number) => Promise<void>;
-    applyDiscount: (code: string) => Promise<void>;
-    removeDiscount: () => Promise<void>;
-    updateNote: (note: string) => Promise<void>;
-    clearCart: () => Promise<void>;
-    loading: boolean;
-} | null>;
-declare const CustomerContext: react.Context<Customer | null>;
-declare const ThemeSettingsContext: react.Context<ThemeSettingsV3 | null>;
-declare const LocalizationContext: react.Context<LocalizationState | null>;
-declare const PageContext: react.Context<Page | null>;
-/**
- * A merchant-managed navigation menu item, exactly as the storefront
- * menus resolver returns it (`GET /storefront/store/{id}/menus`):
- * bilingual `label`, a pre-resolved `url`, and nested `children`.
- *
- * This is the RAW shape the host injects via `NuMuProvider`'s
- * `navigation` prop. `useNavigation(handle)` localizes it to the
- * display-ready `NavigationItem` (a single `title` string for the
- * active locale).
- */
-interface MenuItemData {
-    id: string;
-    label: Record<string, string>;
-    url: string;
-    type?: string | null;
-    resource_id?: string | null;
-    /**
-     * §5 hide-page → hide-nav-link. `false` when the item targets a CMS page
-     * (`/pages/<handle>`) that is currently unpublished or deleted. The backend
-     * menus resolver annotates it; absent/`true` means visible (back-compat).
-     */
-    target_visible?: boolean;
-    children?: MenuItemData[];
-}
-/**
- * Phase 2.4 — navigation menus keyed by handle (`main-menu`, `footer`,
- * plus custom), injected by the host from the storefront resolver so a
- * theme's `useNavigation(handle)` resolves without a client round-trip.
- *
- * Defaults to `{}` — an empty map signals "host provided no menus", at
- * which point `useNavigation` falls back to its own fetch / a theme's
- * `DEFAULT_NAV`. A present-but-handle-absent map means the menu simply
- * doesn't exist (render nothing / fallback), no fetch attempted.
- */
-declare const NavigationContext: react.Context<Record<string, MenuItemData[]>>;
-
 declare function useLocalization(): LocalizationState;
 declare function useDirection(): "ltr" | "rtl";
 declare function useLocale(): string;
@@ -1112,141 +1031,6 @@ interface UseShippingRatesState {
 }
 declare function useShippingRates({ address, location_id, enabled, }?: UseShippingRatesOptions): UseShippingRatesState;
 
-/**
- * `mountTheme(el, ctx, renderApp)` — the canonical V3 bundle entry helper.
- *
- * ## Why this exists
- *
- * Every theme bundle exports `mount(el, ctx): MountResult`. Historically each
- * theme hand-wrote that function, and the wiring it needs is non-trivial and
- * easy to get wrong:
- *
- *   1. **Forward the real catalog.** The host ships the page's products /
- *      collections in `ctx.page.data` (home + listing routes) and the product
- *      in `ctx.page.data.product` (PDP). A theme that doesn't pass these into
- *      `NuMuProvider` (+ wrap the PDP in `<ProductProvider>`) sees
- *      `useProducts()` / `useProductOptional()` return empty on a REAL store —
- *      so product sections render "No products yet" or fall back to demo data
- *      on a stocked merchant. This was the single most common BYOT bug:
- *      only bon-younes wired it; the other 13 themes dropped the catalog.
- *
- *   2. **Apply global style tokens.** Merchant-chosen colors/fonts live in
- *      `themeSettings.global_settings`; they only paint if the bundle calls
- *      `applyGlobalStyleTokens` on its mount root (and resolves font tokens
- *      to real stacks + injects the webfont link). Themes that skipped this
- *      ignored every color/font picker.
- *
- *   3. **Forward navigation.** `useNavigation(handle)` only resolves the
- *      header/footer menus the host pre-resolved if the bundle passes
- *      `ctx.navigation` into `NuMuProvider`.
- *
- *   4. **Live-preview + lifecycle.** The customizer streams draft settings via
- *      the host's `applyDraft`; the bundle must hold them in state and re-paint
- *      the style tokens on every draft. And it must return a `MountResult`
- *      (`cleanup` + `applyDraft`) the host's `ByotThemeBoundary` understands.
- *
- * `mountTheme` does all of that once, so a theme's `main.tsx` collapses to:
- *
- * ```tsx
- * import { mountTheme } from "@numueg/theme-sdk";
- * export function mount(el, ctx) {
- *   return mountTheme(el, ctx, ({ currentTemplate }) =>
- *     <ThemeApp currentTemplate={currentTemplate} />,
- *   );
- * }
- * ```
- *
- * The theme owns only its section list (`ThemeApp`). Everything in the list
- * above is handled here — fix it once, every theme benefits.
- *
- * ## Both ctx shapes
- *
- * The host (numu-storefront `ByotThemeBoundary`) passes
- * `{ themeSettings, storeData, page, locale, demo, navigation }`. Older / dev
- * contexts used `{ store, currentTemplate }`. We normalise both so a bundle
- * built against this helper works regardless of which host calls it.
- */
-
-/** Minimal page descriptor the host forwards in the mount context. */
-interface ThemeMountPage {
-    type?: string;
-    handle?: string;
-    title?: string;
-    data?: Record<string, unknown>;
-}
-/**
- * The mount context a host (or dev harness) passes to a bundle's `mount`.
- * Accepts both the current storefront shape (`storeData`/`page`) and the
- * legacy/dev shape (`store`/`currentTemplate`); `mountTheme` normalises them.
- */
-interface ThemeMountContext {
-    storeData?: Store;
-    page?: ThemeMountPage;
-    store?: Store;
-    currentTemplate?: string;
-    themeSettings: ThemeSettingsV3;
-    initialCart?: Cart;
-    customer?: Customer | null;
-    locale?: string;
-    translations?: Record<string, string>;
-    /** AUTHORITATIVE marketplace-preview flag from the host (true only for the
-     *  catalog "Try theme" preview). Themes with demo-image fallbacks gate on
-     *  it so a real installed store never shows demo imagery. */
-    demo?: boolean;
-    /** Store navigation menus keyed by handle, resolved server-side. */
-    navigation?: Record<string, MenuItemData[]>;
-    /**
-     * Host signal that the container already holds server-rendered HTML for
-     * this exact ctx (produced via `createApp` from `defineThemeEntry`).
-     * `mountTheme` then adopts it with `hydrateRoot` instead of re-rendering
-     * from scratch. Ignored when the container is empty, so a host can pass
-     * it optimistically and still get a plain client mount on SSR failure.
-     */
-    hydrate?: boolean;
-    [extra: string]: unknown;
-}
-/** Arguments handed to a theme's render callback on every (re)render. */
-interface ThemeRenderArgs {
-    /** Active template key — "home" | "product" | "collection" | "cart" | … */
-    currentTemplate: string;
-    /** Marketplace-preview flag (see ThemeMountContext.demo). */
-    demo: boolean;
-    /** The raw host page descriptor (type/handle/data), or null. */
-    page: ThemeMountPage | null;
-    /** Normalised store record (never undefined). */
-    store: Store;
-    /** Live theme settings (reflects customizer drafts via applyDraft). */
-    themeSettings: ThemeSettingsV3;
-}
-interface DraftHandle {
-    applyDraft: (next: ThemeSettingsV3) => void;
-}
-/**
- * Build the canonical theme element tree for a ctx. BOTH render paths go
- * through here — `mountTheme` (client mount/hydrate) and `createApp`
- * (host-side `renderToString`) — so the server markup and the hydration
- * tree are the same React tree by construction. `mountEl` is a prop, not
- * DOM output, so it differing between server (null) and client (the
- * container) cannot cause a hydration mismatch.
- */
-declare function buildThemeElement(ctx: ThemeMountContext, mountEl: HTMLElement | null, renderApp: (args: ThemeRenderArgs) => ReactNode, ref?: (h: DraftHandle | null) => void): ReactElement;
-/**
- * Mount a V3 theme. Owns the React root, the provider stack (catalog + nav +
- * style tokens), and the live-preview draft cycle. Returns the host-contract
- * `MountResult` (`cleanup` + `applyDraft`).
- *
- * When the host passes `ctx.hydrate === true` and the container already
- * holds server-rendered HTML (produced by this theme's `createApp` with the
- * identical ctx), the tree is adopted via `hydrateRoot` — no re-render, no
- * flash. An empty container downgrades to a plain client mount so hosts can
- * pass the flag optimistically.
- *
- * @param el        the host-supplied container element
- * @param ctx       the mount context (either host or legacy/dev shape)
- * @param renderApp returns the theme's section tree for the current args
- */
-declare function mountTheme(el: HTMLElement, ctx: ThemeMountContext, renderApp: (args: ThemeRenderArgs) => ReactNode): MountResult;
-
 /**
  * `defineThemeEntry(renderApp)` — one-call theme entry that yields BOTH
  * halves of the V3 contract from a single component:
@@ -1502,6 +1286,29 @@ interface ImageProps extends Omit<ImgHTMLAttributes<HTMLImageElement>, "src" | "
  */
 declare function Image({ src, alt, sizes, responsive, loading, aspectRatio, objectFit, objectPosition, transform, className, style, ...rest }: ImageProps): react.JSX.Element;
 
+interface LogoProps {
+    /** Explicit logo URL; falls back to global_settings.logo_url then shop.logo_url. */
+    src?: string | null;
+    /** Alt text; falls back to the brand name / shop name. */
+    alt?: string;
+    /** Overrides `global_settings.logo_shape` (none/square/rounded/circle/triangle). */
+    shape?: string;
+    /** Overrides `global_settings.logo_size` (small/medium/large). */
+    size?: string;
+    className?: string;
+    style?: CSSProperties;
+    /** Rendered when there is no logo URL (e.g. brand-name text). */
+    fallback?: ReactNode;
+}
+/**
+ * Engine-level store logo. Reads `logo_url`, `logo_shape`, and `logo_size` from
+ * the theme's global settings (overridable via props), and renders a plain
+ * `<img>` with the chosen shape/size applied via inline styles — so it works in
+ * any theme regardless of its CSS setup and keeps **animated GIF logos playing**
+ * under every shape. Renders `fallback` (or nothing) when no logo is set.
+ */
+declare function Logo({ src, alt, shape, size, className, style, fallback, }: LogoProps): react.JSX.Element;
+
 interface LinkProps extends Omit<AnchorHTMLAttributes<HTMLAnchorElement>, "href"> {
     /**
      * Path relative to the storefront root, e.g. "/products/foo",
@@ -2267,6 +2074,76 @@ declare function computeGlobalStyleTokens(globalSettings: GlobalSettings): Compu
  */
 declare function applyGlobalStyleTokens(globalSettings: GlobalSettings, el: HTMLElement | null | undefined): void;
 
+/**
+ * Engine-level logo appearance (shape + size).
+ *
+ * A merchant can crop the store logo into a shape and pick its size from the
+ * theme editor's global settings (`logo_shape` / `logo_size`). The logic lives
+ * here — once, in the SDK — so EVERY V3 theme renders the chosen shape the same
+ * way instead of each theme re-implementing it.
+ *
+ * Why inline styles (not Tailwind classes): the SDK is consumed from
+ * `node_modules`, which a theme's Tailwind build does not scan — so utility
+ * classes like `rounded-full` / `h-16` would never be generated. Inline
+ * `CSSProperties` are self-contained and work in any theme regardless of its
+ * CSS setup. The shapes are pure CSS (border-radius / clip-path) applied to a
+ * plain `<img>`, so animated **GIF logos keep playing** under every shape.
+ */
+
+type LogoShape = "none" | "square" | "rounded" | "circle" | "triangle";
+type LogoSize = "small" | "medium" | "large";
+/** Bilingual options for the `logo_shape` global setting (schema authoring). */
+declare const LOGO_SHAPE_OPTIONS: readonly [{
+    readonly value: "none";
+    readonly label: "Original";
+    readonly label_ar: "الأصلي";
+}, {
+    readonly value: "square";
+    readonly label: "Square";
+    readonly label_ar: "مربع";
+}, {
+    readonly value: "rounded";
+    readonly label: "Rounded square";
+    readonly label_ar: "مربع بزوايا دائرية";
+}, {
+    readonly value: "circle";
+    readonly label: "Circle";
+    readonly label_ar: "دائرة";
+}, {
+    readonly value: "triangle";
+    readonly label: "Triangle";
+    readonly label_ar: "مثلث";
+}];
+/** Bilingual options for the `logo_size` global setting (schema authoring). */
+declare const LOGO_SIZE_OPTIONS: readonly [{
+    readonly value: "small";
+    readonly label: "Small";
+    readonly label_ar: "صغير";
+}, {
+    readonly value: "medium";
+    readonly label: "Medium";
+    readonly label_ar: "متوسط";
+}, {
+    readonly value: "large";
+    readonly label: "Large";
+    readonly label_ar: "كبير";
+}];
+/**
+ * Inline style for a logo `<img>` given the merchant's shape + size.
+ *
+ * Returns `undefined` for `none` (and unknown shapes) so the theme keeps its
+ * own native logo sizing untouched — only an explicitly chosen shape overrides
+ * it. A shaped logo gets a fixed square box with `object-fit: cover` plus the
+ * shape (border-radius for square/rounded/circle, clip-path for triangle).
+ */
+declare function logoImgStyle(shape: string | undefined, size: string | undefined): CSSProperties | undefined;
+/**
+ * Derived CSS-custom-property tokens for the chosen logo shape/size. Emitted by
+ * `computeGlobalStyleTokens` so host-rendered surfaces (e.g. the checkout
+ * header) can match the storefront logo. Returns `{}` for `none`.
+ */
+declare function logoStyleTokens(shape: string | undefined, size: string | undefined): Record<string, string>;
+
 /**
  * Theme-bundled locale files: load + merge.
  *
@@ -2325,4 +2202,4 @@ declare function pickTranslations(bundle: LocaleBundle, locale: string): LocaleM
  */
 declare function buildLocaleBundle<T extends Record<string, unknown>>(modules: T): LocaleBundle;
 
-export { AddToCartButton, type AddressInput, type AnalyticsApi, type AnalyticsPayload, type AppManifestBlock, type AppPayload, type AppState, Block, BlockInstance, BlockProps$1 as BlockProps, BlockSchema, Cart, CartContext, type CheckoutAddress, type CheckoutApi, type CheckoutSessionState, type CheckoutStep, Collection, CollectionCard, type CollectionCardProps, type CollectionCardSlots, CollectionContext, CollectionProvider, type ComputedStyleTokens, type CurrencyConfig, type CurrencyState, CurrencySwitcher, type CurrencySwitcherProps, Customer, type CustomerAddress, type CustomerAddressesState, CustomerContext, type DefineBlockInput, type DefineSectionInput, type DefinedBlock, type DefinedSection, type DynamicResolveContext, type DynamicSourceRef, EditableImage, type EditableImageProps, EditableText, type EditableTextProps, type FocalSrcOptions, Form, type GiftCardBalance, ICON_NAMES, Icon, IconMap, type IconProps, Image, type ImageTransform, Link, type LocaleBundle, type LocaleMessages, LocaleSwitcher, type LocaleSwitcherProps, LocalizationContext, type MenuItemData, Money, MountResult, NavigationContext, type NavigationItem, type NavigationState, NuMuProvider, type OrderDetail, type OrderListEntry, type OrderListState, type OrderState, Page, PageContext, type PlaceOrderResult, Product, ProductCard, type ProductCardProps, type ProductCardSlots, ProductContext, ProductProvider, ProductVariant, type RelatedProductsState, type ReorderResult, type ReorderSkipReason, type ReorderSkippedItem, RichText, type RichTextProps, type SearchResults, type SearchState, Section, SectionContext, SectionInstance, SectionProps$1 as SectionProps, SectionSchema, type ShippingRateOption, ShopContext, type ShopWithHelpers, SizeChart, Store, type ThemeEntry, type ThemeMountContext, type ThemeMountPage, type ThemeRenderArgs, ThemeSettingsContext, ThemeSettingsV3, type UseGiftCardBalance, type UseReorder, type UseSearchOptions, type UseShippingRatesOptions, type UseShippingRatesState, type UseVariantSelection, type WishlistItem, type WishlistState, applyGlobalStyleTokens, applyImageTransform, asImageTransform, assetUrl, availableValues, buildLocaleBundle, buildThemeElement, clearSdkSingleton, collectBlocks, collectSections, computeGlobalStyleTokens, defaultVariant, defineBlock, defineSection, defineThemeEntry, dynamicSource, findVariantByOptions, flattenMessages, focalSrc, getReactSingleton, getSdkSingleton, isDefinedBlock, isDefinedSection, isDynamicSource, isSdkAvailable, mountTheme, pickTranslations, registerReactSingleton, registerSdkSingleton, resolveDynamicValue, resolveFontStack, resolveSettingsMap, resolveSizeChart, resolveSourcePath, sanitizeHtml, useAnalytics, useApp, useCart, useCheckout, useCollection, useCollectionOptional, useCollections, useCurrency, useCurrentTemplate, useCustomer, useCustomerActions, useCustomerAddresses, useDirection, useFieldTranslation, useGiftCardBalance, useImage, useLocale, useLocalization, useMoney, useNavigation, useNumberFormat, useOrder, useOrders, usePage, useProduct, useProductOptional, useProductSizeChart, useProducts, useRelatedProducts, useReorder, useResolvedSettings, useSearch, useSection, useSectionOptional, useShippingRates, useShop, useThemeSettings, useTranslation, useVariantSelection, useWishlist };
+export { AddToCartButton, type AddressInput, type AnalyticsApi, type AnalyticsPayload, type AppManifestBlock, type AppPayload, type AppState, Block, BlockInstance, BlockProps$1 as BlockProps, BlockSchema, Cart, type CheckoutAddress, type CheckoutApi, type CheckoutSessionState, type CheckoutStep, Collection, CollectionCard, type CollectionCardProps, type CollectionCardSlots, CollectionProvider, type ComputedStyleTokens, type CurrencyConfig, type CurrencyState, CurrencySwitcher, type CurrencySwitcherProps, Customer, type CustomerAddress, type CustomerAddressesState, type DefineBlockInput, type DefineSectionInput, type DefinedBlock, type DefinedSection, type DynamicResolveContext, type DynamicSourceRef, EditableImage, type EditableImageProps, EditableText, type EditableTextProps, type FocalSrcOptions, Form, type GiftCardBalance, ICON_NAMES, Icon, IconMap, type IconProps, Image, type ImageTransform, LOGO_SHAPE_OPTIONS, LOGO_SIZE_OPTIONS, Link, type LocaleBundle, type LocaleMessages, LocaleSwitcher, type LocaleSwitcherProps, Logo, type LogoProps, type LogoShape, type LogoSize, MenuItemData, Money, MountResult, type NavigationItem, type NavigationState, NuMuProvider, type OrderDetail, type OrderListEntry, type OrderListState, type OrderState, Page, type PlaceOrderResult, Product, ProductCard, type ProductCardProps, type ProductCardSlots, ProductProvider, ProductVariant, type RelatedProductsState, type ReorderResult, type ReorderSkipReason, type ReorderSkippedItem, RichText, type RichTextProps, type SearchResults, type SearchState, Section, SectionContext, SectionInstance, SectionProps$1 as SectionProps, SectionSchema, type ShippingRateOption, type ShopWithHelpers, SizeChart, Store, type ThemeEntry, ThemeMountContext, ThemeRenderArgs, ThemeSettingsV3, type UseGiftCardBalance, type UseReorder, type UseSearchOptions, type UseShippingRatesOptions, type UseShippingRatesState, type UseVariantSelection, type WishlistItem, type WishlistState, applyGlobalStyleTokens, applyImageTransform, asImageTransform, assetUrl, availableValues, buildLocaleBundle, clearSdkSingleton, collectBlocks, collectSections, computeGlobalStyleTokens, defaultVariant, defineBlock, defineSection, defineThemeEntry, dynamicSource, findVariantByOptions, flattenMessages, focalSrc, getReactSingleton, getSdkSingleton, isDefinedBlock, isDefinedSection, isDynamicSource, isSdkAvailable, logoImgStyle, logoStyleTokens, pickTranslations, registerReactSingleton, registerSdkSingleton, resolveDynamicValue, resolveFontStack, resolveSettingsMap, resolveSizeChart, resolveSourcePath, sanitizeHtml, useAnalytics, useApp, useCart, useCheckout, useCollection, useCollectionOptional, useCollections, useCurrency, useCurrentTemplate, useCustomer, useCustomerActions, useCustomerAddresses, useDirection, useFieldTranslation, useGiftCardBalance, useImage, useLocale, useLocalization, useMoney, useNavigation, useNumberFormat, useOrder, useOrders, usePage, useProduct, useProductOptional, useProductSizeChart, useProducts, useRelatedProducts, useReorder, useResolvedSettings, useSearch, useSection, useSectionOptional, useShippingRates, useShop, useThemeSettings, useTranslation, useVariantSelection, useWishlist };