@numueg/theme-sdk 0.3.2 → 0.4.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.d.mts CHANGED
@@ -2,8 +2,11 @@ import { i as Store, e as Product, b as Collection, C as Cart, c as Customer, P
2
2
  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.mjs';
3
3
  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.mjs';
4
4
  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.mjs';
5
+ export { KNOWN_SETTING_TYPES, KNOWN_TEMPLATES, REQUIRED_TEMPLATES, SDK_VERSION, THEME_CONTRACT_VERSION, ValidationIssue, ValidationResult, mergeResults, validateBuiltManifest, validateManifest, validateSectionSchema, validateSettingsAgainstSchema } from './validation.mjs';
6
+ import { L as LocalizationState, T as ThemeMountContext, a as ThemeRenderArgs, M as MenuItemData } from './mount-DH9dz3dq.mjs';
7
+ 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-DH9dz3dq.mjs';
5
8
  import * as react from 'react';
6
- import { ReactNode, ReactElement, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
9
+ import { ReactElement, ReactNode, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
7
10
  export { resolveThemeSettings } from './normalize.mjs';
8
11
 
9
12
  /**
@@ -82,90 +85,6 @@ declare function useThemeSettings(): ThemeSettingsV3;
82
85
  */
83
86
  declare function useCurrentTemplate(): string;
84
87
 
85
- interface LocalizationState {
86
- locale: string;
87
- direction: "ltr" | "rtl";
88
- translations: Record<string, string>;
89
- formatMoney: (amount: number, currency?: string) => string;
90
- formatDate: (date: string | Date) => string;
91
- /**
92
- * Phase 3.7 — locale-aware number formatter. Routes to either
93
- * Western (1234) or Arab-Indic (١٢٣٤) digits depending on
94
- * `store.settings.numerals`. Themes calling formatMoney get the
95
- * same digit choice automatically; this is for raw counts ("12 items").
96
- */
97
- formatNumber: (n: number, options?: Intl.NumberFormatOptions) => string;
98
- /**
99
- * Phase 3.6 — switch the active locale.
100
- *
101
- * Sets the `numu_locale` cookie and triggers a full page reload so
102
- * the server-rendered layout picks up the new locale (the storefront
103
- * resolves locale at SSR time from cookie/query). Returns once the
104
- * cookie is written; the page navigation cancels any pending React
105
- * work so callers don't need to await.
106
- */
107
- setLocale: (next: string) => void;
108
- /**
109
- * Phase 3.6 — list of locales the store advertises. Empty when the
110
- * store hasn't configured a multi-locale catalog. Themes use this
111
- * to decide whether to render the LocaleSwitcher at all.
112
- */
113
- availableLocales: string[];
114
- }
115
- declare const ShopContext: react.Context<Store | null>;
116
- declare const ProductContext: react.Context<Product | null>;
117
- declare const CollectionContext: react.Context<Collection | null>;
118
- declare const CartContext: react.Context<{
119
- cart: Cart;
120
- addItem: (productId: string, variantId?: string, quantity?: number) => Promise<void>;
121
- removeItem: (itemId: string) => Promise<void>;
122
- updateQuantity: (itemId: string, quantity: number) => Promise<void>;
123
- applyDiscount: (code: string) => Promise<void>;
124
- removeDiscount: () => Promise<void>;
125
- updateNote: (note: string) => Promise<void>;
126
- clearCart: () => Promise<void>;
127
- loading: boolean;
128
- } | null>;
129
- declare const CustomerContext: react.Context<Customer | null>;
130
- declare const ThemeSettingsContext: react.Context<ThemeSettingsV3 | null>;
131
- declare const LocalizationContext: react.Context<LocalizationState | null>;
132
- declare const PageContext: react.Context<Page | null>;
133
- /**
134
- * A merchant-managed navigation menu item, exactly as the storefront
135
- * menus resolver returns it (`GET /storefront/store/{id}/menus`):
136
- * bilingual `label`, a pre-resolved `url`, and nested `children`.
137
- *
138
- * This is the RAW shape the host injects via `NuMuProvider`'s
139
- * `navigation` prop. `useNavigation(handle)` localizes it to the
140
- * display-ready `NavigationItem` (a single `title` string for the
141
- * active locale).
142
- */
143
- interface MenuItemData {
144
- id: string;
145
- label: Record<string, string>;
146
- url: string;
147
- type?: string | null;
148
- resource_id?: string | null;
149
- /**
150
- * §5 hide-page → hide-nav-link. `false` when the item targets a CMS page
151
- * (`/pages/<handle>`) that is currently unpublished or deleted. The backend
152
- * menus resolver annotates it; absent/`true` means visible (back-compat).
153
- */
154
- target_visible?: boolean;
155
- children?: MenuItemData[];
156
- }
157
- /**
158
- * Phase 2.4 — navigation menus keyed by handle (`main-menu`, `footer`,
159
- * plus custom), injected by the host from the storefront resolver so a
160
- * theme's `useNavigation(handle)` resolves without a client round-trip.
161
- *
162
- * Defaults to `{}` — an empty map signals "host provided no menus", at
163
- * which point `useNavigation` falls back to its own fetch / a theme's
164
- * `DEFAULT_NAV`. A present-but-handle-absent map means the menu simply
165
- * doesn't exist (render nothing / fallback), no fetch attempted.
166
- */
167
- declare const NavigationContext: react.Context<Record<string, MenuItemData[]>>;
168
-
169
88
  declare function useLocalization(): LocalizationState;
170
89
  declare function useDirection(): "ltr" | "rtl";
171
90
  declare function useLocale(): string;
@@ -1112,141 +1031,6 @@ interface UseShippingRatesState {
1112
1031
  }
1113
1032
  declare function useShippingRates({ address, location_id, enabled, }?: UseShippingRatesOptions): UseShippingRatesState;
1114
1033
 
1115
- /**
1116
- * `mountTheme(el, ctx, renderApp)` — the canonical V3 bundle entry helper.
1117
- *
1118
- * ## Why this exists
1119
- *
1120
- * Every theme bundle exports `mount(el, ctx): MountResult`. Historically each
1121
- * theme hand-wrote that function, and the wiring it needs is non-trivial and
1122
- * easy to get wrong:
1123
- *
1124
- * 1. **Forward the real catalog.** The host ships the page's products /
1125
- * collections in `ctx.page.data` (home + listing routes) and the product
1126
- * in `ctx.page.data.product` (PDP). A theme that doesn't pass these into
1127
- * `NuMuProvider` (+ wrap the PDP in `<ProductProvider>`) sees
1128
- * `useProducts()` / `useProductOptional()` return empty on a REAL store —
1129
- * so product sections render "No products yet" or fall back to demo data
1130
- * on a stocked merchant. This was the single most common BYOT bug:
1131
- * only bon-younes wired it; the other 13 themes dropped the catalog.
1132
- *
1133
- * 2. **Apply global style tokens.** Merchant-chosen colors/fonts live in
1134
- * `themeSettings.global_settings`; they only paint if the bundle calls
1135
- * `applyGlobalStyleTokens` on its mount root (and resolves font tokens
1136
- * to real stacks + injects the webfont link). Themes that skipped this
1137
- * ignored every color/font picker.
1138
- *
1139
- * 3. **Forward navigation.** `useNavigation(handle)` only resolves the
1140
- * header/footer menus the host pre-resolved if the bundle passes
1141
- * `ctx.navigation` into `NuMuProvider`.
1142
- *
1143
- * 4. **Live-preview + lifecycle.** The customizer streams draft settings via
1144
- * the host's `applyDraft`; the bundle must hold them in state and re-paint
1145
- * the style tokens on every draft. And it must return a `MountResult`
1146
- * (`cleanup` + `applyDraft`) the host's `ByotThemeBoundary` understands.
1147
- *
1148
- * `mountTheme` does all of that once, so a theme's `main.tsx` collapses to:
1149
- *
1150
- * ```tsx
1151
- * import { mountTheme } from "@numueg/theme-sdk";
1152
- * export function mount(el, ctx) {
1153
- * return mountTheme(el, ctx, ({ currentTemplate }) =>
1154
- * <ThemeApp currentTemplate={currentTemplate} />,
1155
- * );
1156
- * }
1157
- * ```
1158
- *
1159
- * The theme owns only its section list (`ThemeApp`). Everything in the list
1160
- * above is handled here — fix it once, every theme benefits.
1161
- *
1162
- * ## Both ctx shapes
1163
- *
1164
- * The host (numu-storefront `ByotThemeBoundary`) passes
1165
- * `{ themeSettings, storeData, page, locale, demo, navigation }`. Older / dev
1166
- * contexts used `{ store, currentTemplate }`. We normalise both so a bundle
1167
- * built against this helper works regardless of which host calls it.
1168
- */
1169
-
1170
- /** Minimal page descriptor the host forwards in the mount context. */
1171
- interface ThemeMountPage {
1172
- type?: string;
1173
- handle?: string;
1174
- title?: string;
1175
- data?: Record<string, unknown>;
1176
- }
1177
- /**
1178
- * The mount context a host (or dev harness) passes to a bundle's `mount`.
1179
- * Accepts both the current storefront shape (`storeData`/`page`) and the
1180
- * legacy/dev shape (`store`/`currentTemplate`); `mountTheme` normalises them.
1181
- */
1182
- interface ThemeMountContext {
1183
- storeData?: Store;
1184
- page?: ThemeMountPage;
1185
- store?: Store;
1186
- currentTemplate?: string;
1187
- themeSettings: ThemeSettingsV3;
1188
- initialCart?: Cart;
1189
- customer?: Customer | null;
1190
- locale?: string;
1191
- translations?: Record<string, string>;
1192
- /** AUTHORITATIVE marketplace-preview flag from the host (true only for the
1193
- * catalog "Try theme" preview). Themes with demo-image fallbacks gate on
1194
- * it so a real installed store never shows demo imagery. */
1195
- demo?: boolean;
1196
- /** Store navigation menus keyed by handle, resolved server-side. */
1197
- navigation?: Record<string, MenuItemData[]>;
1198
- /**
1199
- * Host signal that the container already holds server-rendered HTML for
1200
- * this exact ctx (produced via `createApp` from `defineThemeEntry`).
1201
- * `mountTheme` then adopts it with `hydrateRoot` instead of re-rendering
1202
- * from scratch. Ignored when the container is empty, so a host can pass
1203
- * it optimistically and still get a plain client mount on SSR failure.
1204
- */
1205
- hydrate?: boolean;
1206
- [extra: string]: unknown;
1207
- }
1208
- /** Arguments handed to a theme's render callback on every (re)render. */
1209
- interface ThemeRenderArgs {
1210
- /** Active template key — "home" | "product" | "collection" | "cart" | … */
1211
- currentTemplate: string;
1212
- /** Marketplace-preview flag (see ThemeMountContext.demo). */
1213
- demo: boolean;
1214
- /** The raw host page descriptor (type/handle/data), or null. */
1215
- page: ThemeMountPage | null;
1216
- /** Normalised store record (never undefined). */
1217
- store: Store;
1218
- /** Live theme settings (reflects customizer drafts via applyDraft). */
1219
- themeSettings: ThemeSettingsV3;
1220
- }
1221
- interface DraftHandle {
1222
- applyDraft: (next: ThemeSettingsV3) => void;
1223
- }
1224
- /**
1225
- * Build the canonical theme element tree for a ctx. BOTH render paths go
1226
- * through here — `mountTheme` (client mount/hydrate) and `createApp`
1227
- * (host-side `renderToString`) — so the server markup and the hydration
1228
- * tree are the same React tree by construction. `mountEl` is a prop, not
1229
- * DOM output, so it differing between server (null) and client (the
1230
- * container) cannot cause a hydration mismatch.
1231
- */
1232
- declare function buildThemeElement(ctx: ThemeMountContext, mountEl: HTMLElement | null, renderApp: (args: ThemeRenderArgs) => ReactNode, ref?: (h: DraftHandle | null) => void): ReactElement;
1233
- /**
1234
- * Mount a V3 theme. Owns the React root, the provider stack (catalog + nav +
1235
- * style tokens), and the live-preview draft cycle. Returns the host-contract
1236
- * `MountResult` (`cleanup` + `applyDraft`).
1237
- *
1238
- * When the host passes `ctx.hydrate === true` and the container already
1239
- * holds server-rendered HTML (produced by this theme's `createApp` with the
1240
- * identical ctx), the tree is adopted via `hydrateRoot` — no re-render, no
1241
- * flash. An empty container downgrades to a plain client mount so hosts can
1242
- * pass the flag optimistically.
1243
- *
1244
- * @param el the host-supplied container element
1245
- * @param ctx the mount context (either host or legacy/dev shape)
1246
- * @param renderApp returns the theme's section tree for the current args
1247
- */
1248
- declare function mountTheme(el: HTMLElement, ctx: ThemeMountContext, renderApp: (args: ThemeRenderArgs) => ReactNode): MountResult;
1249
-
1250
1034
  /**
1251
1035
  * `defineThemeEntry(renderApp)` — one-call theme entry that yields BOTH
1252
1036
  * halves of the V3 contract from a single component:
@@ -2325,4 +2109,4 @@ declare function pickTranslations(bundle: LocaleBundle, locale: string): LocaleM
2325
2109
  */
2326
2110
  declare function buildLocaleBundle<T extends Record<string, unknown>>(modules: T): LocaleBundle;
2327
2111
 
2328
- 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 };
2112
+ 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, Link, type LocaleBundle, type LocaleMessages, LocaleSwitcher, type LocaleSwitcherProps, 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, 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 };
package/dist/index.d.ts CHANGED
@@ -2,8 +2,11 @@ import { i as Store, e as Product, b as Collection, C as Cart, c as Customer, P
2
2
  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';
3
3
  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';
4
4
  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';
5
+ export { KNOWN_SETTING_TYPES, KNOWN_TEMPLATES, REQUIRED_TEMPLATES, SDK_VERSION, THEME_CONTRACT_VERSION, ValidationIssue, ValidationResult, mergeResults, validateBuiltManifest, validateManifest, validateSectionSchema, validateSettingsAgainstSchema } from './validation.js';
6
+ import { L as LocalizationState, T as ThemeMountContext, a as ThemeRenderArgs, M as MenuItemData } from './mount-BN2mz_wx.js';
7
+ 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';
5
8
  import * as react from 'react';
6
- import { ReactNode, ReactElement, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
9
+ import { ReactElement, ReactNode, ElementType, CSSProperties, ImgHTMLAttributes, AnchorHTMLAttributes, ButtonHTMLAttributes, HTMLAttributes, FormHTMLAttributes, ComponentType } from 'react';
7
10
  export { resolveThemeSettings } from './normalize.js';
8
11
 
9
12
  /**
@@ -82,90 +85,6 @@ declare function useThemeSettings(): ThemeSettingsV3;
82
85
  */
83
86
  declare function useCurrentTemplate(): string;
84
87
 
85
- interface LocalizationState {
86
- locale: string;
87
- direction: "ltr" | "rtl";
88
- translations: Record<string, string>;
89
- formatMoney: (amount: number, currency?: string) => string;
90
- formatDate: (date: string | Date) => string;
91
- /**
92
- * Phase 3.7 — locale-aware number formatter. Routes to either
93
- * Western (1234) or Arab-Indic (١٢٣٤) digits depending on
94
- * `store.settings.numerals`. Themes calling formatMoney get the
95
- * same digit choice automatically; this is for raw counts ("12 items").
96
- */
97
- formatNumber: (n: number, options?: Intl.NumberFormatOptions) => string;
98
- /**
99
- * Phase 3.6 — switch the active locale.
100
- *
101
- * Sets the `numu_locale` cookie and triggers a full page reload so
102
- * the server-rendered layout picks up the new locale (the storefront
103
- * resolves locale at SSR time from cookie/query). Returns once the
104
- * cookie is written; the page navigation cancels any pending React
105
- * work so callers don't need to await.
106
- */
107
- setLocale: (next: string) => void;
108
- /**
109
- * Phase 3.6 — list of locales the store advertises. Empty when the
110
- * store hasn't configured a multi-locale catalog. Themes use this
111
- * to decide whether to render the LocaleSwitcher at all.
112
- */
113
- availableLocales: string[];
114
- }
115
- declare const ShopContext: react.Context<Store | null>;
116
- declare const ProductContext: react.Context<Product | null>;
117
- declare const CollectionContext: react.Context<Collection | null>;
118
- declare const CartContext: react.Context<{
119
- cart: Cart;
120
- addItem: (productId: string, variantId?: string, quantity?: number) => Promise<void>;
121
- removeItem: (itemId: string) => Promise<void>;
122
- updateQuantity: (itemId: string, quantity: number) => Promise<void>;
123
- applyDiscount: (code: string) => Promise<void>;
124
- removeDiscount: () => Promise<void>;
125
- updateNote: (note: string) => Promise<void>;
126
- clearCart: () => Promise<void>;
127
- loading: boolean;
128
- } | null>;
129
- declare const CustomerContext: react.Context<Customer | null>;
130
- declare const ThemeSettingsContext: react.Context<ThemeSettingsV3 | null>;
131
- declare const LocalizationContext: react.Context<LocalizationState | null>;
132
- declare const PageContext: react.Context<Page | null>;
133
- /**
134
- * A merchant-managed navigation menu item, exactly as the storefront
135
- * menus resolver returns it (`GET /storefront/store/{id}/menus`):
136
- * bilingual `label`, a pre-resolved `url`, and nested `children`.
137
- *
138
- * This is the RAW shape the host injects via `NuMuProvider`'s
139
- * `navigation` prop. `useNavigation(handle)` localizes it to the
140
- * display-ready `NavigationItem` (a single `title` string for the
141
- * active locale).
142
- */
143
- interface MenuItemData {
144
- id: string;
145
- label: Record<string, string>;
146
- url: string;
147
- type?: string | null;
148
- resource_id?: string | null;
149
- /**
150
- * §5 hide-page → hide-nav-link. `false` when the item targets a CMS page
151
- * (`/pages/<handle>`) that is currently unpublished or deleted. The backend
152
- * menus resolver annotates it; absent/`true` means visible (back-compat).
153
- */
154
- target_visible?: boolean;
155
- children?: MenuItemData[];
156
- }
157
- /**
158
- * Phase 2.4 — navigation menus keyed by handle (`main-menu`, `footer`,
159
- * plus custom), injected by the host from the storefront resolver so a
160
- * theme's `useNavigation(handle)` resolves without a client round-trip.
161
- *
162
- * Defaults to `{}` — an empty map signals "host provided no menus", at
163
- * which point `useNavigation` falls back to its own fetch / a theme's
164
- * `DEFAULT_NAV`. A present-but-handle-absent map means the menu simply
165
- * doesn't exist (render nothing / fallback), no fetch attempted.
166
- */
167
- declare const NavigationContext: react.Context<Record<string, MenuItemData[]>>;
168
-
169
88
  declare function useLocalization(): LocalizationState;
170
89
  declare function useDirection(): "ltr" | "rtl";
171
90
  declare function useLocale(): string;
@@ -1112,141 +1031,6 @@ interface UseShippingRatesState {
1112
1031
  }
1113
1032
  declare function useShippingRates({ address, location_id, enabled, }?: UseShippingRatesOptions): UseShippingRatesState;
1114
1033
 
1115
- /**
1116
- * `mountTheme(el, ctx, renderApp)` — the canonical V3 bundle entry helper.
1117
- *
1118
- * ## Why this exists
1119
- *
1120
- * Every theme bundle exports `mount(el, ctx): MountResult`. Historically each
1121
- * theme hand-wrote that function, and the wiring it needs is non-trivial and
1122
- * easy to get wrong:
1123
- *
1124
- * 1. **Forward the real catalog.** The host ships the page's products /
1125
- * collections in `ctx.page.data` (home + listing routes) and the product
1126
- * in `ctx.page.data.product` (PDP). A theme that doesn't pass these into
1127
- * `NuMuProvider` (+ wrap the PDP in `<ProductProvider>`) sees
1128
- * `useProducts()` / `useProductOptional()` return empty on a REAL store —
1129
- * so product sections render "No products yet" or fall back to demo data
1130
- * on a stocked merchant. This was the single most common BYOT bug:
1131
- * only bon-younes wired it; the other 13 themes dropped the catalog.
1132
- *
1133
- * 2. **Apply global style tokens.** Merchant-chosen colors/fonts live in
1134
- * `themeSettings.global_settings`; they only paint if the bundle calls
1135
- * `applyGlobalStyleTokens` on its mount root (and resolves font tokens
1136
- * to real stacks + injects the webfont link). Themes that skipped this
1137
- * ignored every color/font picker.
1138
- *
1139
- * 3. **Forward navigation.** `useNavigation(handle)` only resolves the
1140
- * header/footer menus the host pre-resolved if the bundle passes
1141
- * `ctx.navigation` into `NuMuProvider`.
1142
- *
1143
- * 4. **Live-preview + lifecycle.** The customizer streams draft settings via
1144
- * the host's `applyDraft`; the bundle must hold them in state and re-paint
1145
- * the style tokens on every draft. And it must return a `MountResult`
1146
- * (`cleanup` + `applyDraft`) the host's `ByotThemeBoundary` understands.
1147
- *
1148
- * `mountTheme` does all of that once, so a theme's `main.tsx` collapses to:
1149
- *
1150
- * ```tsx
1151
- * import { mountTheme } from "@numueg/theme-sdk";
1152
- * export function mount(el, ctx) {
1153
- * return mountTheme(el, ctx, ({ currentTemplate }) =>
1154
- * <ThemeApp currentTemplate={currentTemplate} />,
1155
- * );
1156
- * }
1157
- * ```
1158
- *
1159
- * The theme owns only its section list (`ThemeApp`). Everything in the list
1160
- * above is handled here — fix it once, every theme benefits.
1161
- *
1162
- * ## Both ctx shapes
1163
- *
1164
- * The host (numu-storefront `ByotThemeBoundary`) passes
1165
- * `{ themeSettings, storeData, page, locale, demo, navigation }`. Older / dev
1166
- * contexts used `{ store, currentTemplate }`. We normalise both so a bundle
1167
- * built against this helper works regardless of which host calls it.
1168
- */
1169
-
1170
- /** Minimal page descriptor the host forwards in the mount context. */
1171
- interface ThemeMountPage {
1172
- type?: string;
1173
- handle?: string;
1174
- title?: string;
1175
- data?: Record<string, unknown>;
1176
- }
1177
- /**
1178
- * The mount context a host (or dev harness) passes to a bundle's `mount`.
1179
- * Accepts both the current storefront shape (`storeData`/`page`) and the
1180
- * legacy/dev shape (`store`/`currentTemplate`); `mountTheme` normalises them.
1181
- */
1182
- interface ThemeMountContext {
1183
- storeData?: Store;
1184
- page?: ThemeMountPage;
1185
- store?: Store;
1186
- currentTemplate?: string;
1187
- themeSettings: ThemeSettingsV3;
1188
- initialCart?: Cart;
1189
- customer?: Customer | null;
1190
- locale?: string;
1191
- translations?: Record<string, string>;
1192
- /** AUTHORITATIVE marketplace-preview flag from the host (true only for the
1193
- * catalog "Try theme" preview). Themes with demo-image fallbacks gate on
1194
- * it so a real installed store never shows demo imagery. */
1195
- demo?: boolean;
1196
- /** Store navigation menus keyed by handle, resolved server-side. */
1197
- navigation?: Record<string, MenuItemData[]>;
1198
- /**
1199
- * Host signal that the container already holds server-rendered HTML for
1200
- * this exact ctx (produced via `createApp` from `defineThemeEntry`).
1201
- * `mountTheme` then adopts it with `hydrateRoot` instead of re-rendering
1202
- * from scratch. Ignored when the container is empty, so a host can pass
1203
- * it optimistically and still get a plain client mount on SSR failure.
1204
- */
1205
- hydrate?: boolean;
1206
- [extra: string]: unknown;
1207
- }
1208
- /** Arguments handed to a theme's render callback on every (re)render. */
1209
- interface ThemeRenderArgs {
1210
- /** Active template key — "home" | "product" | "collection" | "cart" | … */
1211
- currentTemplate: string;
1212
- /** Marketplace-preview flag (see ThemeMountContext.demo). */
1213
- demo: boolean;
1214
- /** The raw host page descriptor (type/handle/data), or null. */
1215
- page: ThemeMountPage | null;
1216
- /** Normalised store record (never undefined). */
1217
- store: Store;
1218
- /** Live theme settings (reflects customizer drafts via applyDraft). */
1219
- themeSettings: ThemeSettingsV3;
1220
- }
1221
- interface DraftHandle {
1222
- applyDraft: (next: ThemeSettingsV3) => void;
1223
- }
1224
- /**
1225
- * Build the canonical theme element tree for a ctx. BOTH render paths go
1226
- * through here — `mountTheme` (client mount/hydrate) and `createApp`
1227
- * (host-side `renderToString`) — so the server markup and the hydration
1228
- * tree are the same React tree by construction. `mountEl` is a prop, not
1229
- * DOM output, so it differing between server (null) and client (the
1230
- * container) cannot cause a hydration mismatch.
1231
- */
1232
- declare function buildThemeElement(ctx: ThemeMountContext, mountEl: HTMLElement | null, renderApp: (args: ThemeRenderArgs) => ReactNode, ref?: (h: DraftHandle | null) => void): ReactElement;
1233
- /**
1234
- * Mount a V3 theme. Owns the React root, the provider stack (catalog + nav +
1235
- * style tokens), and the live-preview draft cycle. Returns the host-contract
1236
- * `MountResult` (`cleanup` + `applyDraft`).
1237
- *
1238
- * When the host passes `ctx.hydrate === true` and the container already
1239
- * holds server-rendered HTML (produced by this theme's `createApp` with the
1240
- * identical ctx), the tree is adopted via `hydrateRoot` — no re-render, no
1241
- * flash. An empty container downgrades to a plain client mount so hosts can
1242
- * pass the flag optimistically.
1243
- *
1244
- * @param el the host-supplied container element
1245
- * @param ctx the mount context (either host or legacy/dev shape)
1246
- * @param renderApp returns the theme's section tree for the current args
1247
- */
1248
- declare function mountTheme(el: HTMLElement, ctx: ThemeMountContext, renderApp: (args: ThemeRenderArgs) => ReactNode): MountResult;
1249
-
1250
1034
  /**
1251
1035
  * `defineThemeEntry(renderApp)` — one-call theme entry that yields BOTH
1252
1036
  * halves of the V3 contract from a single component:
@@ -2325,4 +2109,4 @@ declare function pickTranslations(bundle: LocaleBundle, locale: string): LocaleM
2325
2109
  */
2326
2110
  declare function buildLocaleBundle<T extends Record<string, unknown>>(modules: T): LocaleBundle;
2327
2111
 
2328
- 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 };
2112
+ 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, Link, type LocaleBundle, type LocaleMessages, LocaleSwitcher, type LocaleSwitcherProps, 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, 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 };