@weaverse/hydrogen 5.9.5 → 5.10.1

package/dist/index.d.mts

@@ -8,7 +8,7 @@ import { createWithCache, CachingStrategy, I18nBase, HydrogenContext, HydrogenEn
 export { CachingStrategy } from '@shopify/hydrogen';
 import { LoaderFunctionArgs, AppLoadContext } from '@shopify/remix-oxygen';
 import * as React$1 from 'react';
-import { ComponentType, JSX, ForwardRefExoticComponent } from 'react';
+import { ReactNode, ComponentType, JSX, ForwardRefExoticComponent } from 'react';
 import { NavigateFunction, UIMatch } from 'react-router';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
@@ -33,6 +33,76 @@ declare class ThemeSettingsStore {
     destroy: () => void;
 }
 
+/**
+ * Traverse a nested object by dot-path.
+ *
+ * @example
+ * getNestedKey({ cart: { title: 'Cart' } }, 'cart.title') // => 'Cart'
+ * getNestedKey({}, 'cart.title', 'fallback')              // => 'fallback'
+ */
+declare function getNestedKey(obj: Record<string, unknown>, path: string, fallback?: string): string | undefined;
+/**
+ * Replace `{{variable}}` patterns in a string with provided values.
+ *
+ * @example
+ * interpolate('Hello {{name}}!', { name: 'World' }) // => 'Hello World!'
+ * interpolate('-{{percentage}}% Off', { percentage: 15 }) // => '-15% Off'
+ */
+declare function interpolate(template: string, variables?: Record<string, string | number>): string;
+/**
+ * Signature for a translation function.
+ */
+type TranslateFunction = (key: string, variables?: Record<string, string | number>) => string;
+type ThemeTextValue = {
+    /**
+     * Translate a key with optional variable interpolation.
+     *
+     * Priority chain (highest wins):
+     * 1. External `t`        (passed into `withWeaverse` / `ThemeTextProvider`)
+     * 2. `merchantOverrides` (DB overrides for the current locale)
+     * 3. `staticContent`     (theme default JSON)
+     * 4. The key itself      (fallback)
+     *
+     * @example
+     * t('cart.title')                           // => "Cart"
+     * t('badge.sale', { percentage: 15 })       // => "-15% Off"
+     */
+    t: TranslateFunction;
+};
+type ThemeTextProviderProps = {
+    staticContent: Record<string, unknown>;
+    merchantOverrides?: Record<string, unknown>;
+    /**
+     * Optional external translation function.
+     * When provided it becomes the **highest-priority** source:
+     * if it returns a non-empty string that differs from the raw key,
+     * that value is used; otherwise the internal resolution chain continues.
+     */
+    t?: TranslateFunction;
+    children: ReactNode;
+};
+/**
+ * Provider that wraps the app to expose the `t()` function.
+ *
+ * - `staticContent`      – the theme's default locale JSON (from themeSchema.i18n)
+ * - `merchantOverrides`  – locale-specific overrides fetched from the API
+ */
+declare function ThemeTextProvider({ staticContent, merchantOverrides, t: externalT, children, }: ThemeTextProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the theme text `t()` function.
+ *
+ * Must be used inside a component wrapped by `withWeaverse` or `ThemeTextProvider`.
+ *
+ * @example
+ * ```tsx
+ * function CartTitle() {
+ *   const { t } = useThemeText()
+ *   return <h2>{t('cart.title')}</h2>
+ * }
+ * ```
+ */
+declare function useThemeText(): ThemeTextValue;
+
 declare class WeaverseHydrogenItem extends WeaverseItemStore {
     weaverse: WeaverseHydrogen;
     constructor(initialData: HydrogenComponentData, weaverse: WeaverseHydrogen);
@@ -86,24 +156,36 @@ declare const WeaverseHydrogenRoot: React$1.MemoExoticComponent<({ components, e
     }>;
 }) => react_jsx_runtime.JSX.Element>;
 /**
- * Higher-order component that wraps your app with Weaverse theme settings context.
- * Provides theme settings to all child components via React context.
+ * Options for the `withWeaverse` HOC.
+ */
+type WithWeaverseOptions = {
+    /**
+     * Optional external translation function (e.g. from Shopify i18n).
+     * When provided it becomes the **highest-priority** source
+     * in the `t()` resolution chain exposed by `useThemeText()`.
+     */
+    t?: TranslateFunction;
+};
+/**
+ * Higher-order component that wraps your app with Weaverse theme settings
+ * and translation context.
  *
  * @param Component - The root component to wrap
- * @returns Wrapped component with theme settings provider
+ * @param options   - Optional configuration (e.g. an external `t` function)
+ * @returns Wrapped component with theme settings + translation providers
  *
  * @example
  * ```typescript
  * import { withWeaverse } from '@weaverse/hydrogen'
  *
- * function App() {
- *   return <div>My App</div>
- * }
- *
+ * // Basic usage
  * export default withWeaverse(App)
+ *
+ * // With external translation function
+ * export default withWeaverse(App, { t: myI18nFunction })
  * ```
  */
-declare function withWeaverse(Component: ComponentType<any>): (props: JSX.IntrinsicAttributes) => react_jsx_runtime.JSX.Element;
+declare function withWeaverse(Component: ComponentType<any>, options?: WithWeaverseOptions): (props: JSX.IntrinsicAttributes) => react_jsx_runtime.JSX.Element;
 /**
  * React hook to access Weaverse theme settings from anywhere in your component tree.
  * Must be used within a component wrapped by `withWeaverse` or inside `WeaverseHydrogenRoot`.
@@ -258,6 +340,12 @@ declare class WeaverseClient {
      * ```
      */
     loadThemeSettings: (strategy?: CachingStrategy) => Promise<ThemeSettingsResponse>;
+    /**
+     * Fetch locale-specific merchant overrides from the translation API.
+     * Returns a nested JSON object with translated values.
+     * Falls back to empty object on error to avoid blocking theme rendering.
+     */
+    private fetchMerchantOverrides;
     /**
      * Generate fallback page with default structure when page data is unavailable.
      * Used internally when API returns no page or when page needs default content.
@@ -443,6 +531,9 @@ type WeaverseI18n = I18nBase & {
     [key: string]: any;
 };
 type HydrogenThemeSchema = {
+    betaFlags?: {
+        contentManager?: boolean;
+    };
     info: {
         name: string;
         version: string;
@@ -458,6 +549,7 @@ type HydrogenThemeSchema = {
         urlStructure: 'url-path' | 'subdomain' | 'top-level-domain';
         defaultLocale: WeaverseI18n;
         shopLocales: WeaverseI18n[];
+        staticContent?: Record<string, unknown>;
     };
 };
 type FetchProjectRequestBody = {
@@ -620,6 +712,10 @@ type ThemeSettingsResponse = {
     theme?: HydrogenThemeSettings;
     schema?: HydrogenThemeSchema;
     publicEnv?: PublicEnv;
+    /** Theme's default locale JSON from themeSchema.i18n.staticContent */
+    staticContent?: Record<string, unknown>;
+    /** Locale-specific merchant overrides from the API */
+    merchantOverrides?: Record<string, unknown>;
     _error?: string;
     _loadFailed?: boolean;
 };
@@ -924,4 +1020,4 @@ declare const IMAGES_PLACEHOLDERS: {
     product_18: string;
 };
 
-export { type CacheResponseValidator, type ComponentDataValue, type ComponentLoaderArgs, type CreateHydrogenSchemaOptions, type DirectFetchResponse, type FetchProjectPayload, type FetchProjectRequestBody, type HydrogenComponent, type HydrogenComponentData, type HydrogenComponentPresets, type HydrogenComponentProps, type HydrogenComponentSchema, type HydrogenElement, type HydrogenPageAssignment, type HydrogenPageData, type HydrogenProjectType, type HydrogenSchemaValidationResult, type HydrogenThemeSchema, type HydrogenThemeSettings, IMAGES_PLACEHOLDERS, type LoadPageParams, type ProjectIdValidationResult, type ProjectIdValue, type PublicEnv, type RouteLoaderArgs, type ThemeSettingsResponse, type WeaverseArticle, type WeaverseBlog, WeaverseClient, type WeaverseClientArgs, type WeaverseCollection, type WeaverseDataContext, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, type WeaverseHydrogenParams, WeaverseHydrogenRoot, type WeaverseI18n, type WeaverseInternal, type WeaverseLoaderData, type WeaverseLoaderRequestInfo, type WeaverseMetaObject, type WeaverseProduct, type WeaverseProjectConfigs, type WeaverseStudioQueries, type WithCacheFetchResponse, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useWeaverseDataContext, withWeaverse };
+export { type CacheResponseValidator, type ComponentDataValue, type ComponentLoaderArgs, type CreateHydrogenSchemaOptions, type DirectFetchResponse, type FetchProjectPayload, type FetchProjectRequestBody, type HydrogenComponent, type HydrogenComponentData, type HydrogenComponentPresets, type HydrogenComponentProps, type HydrogenComponentSchema, type HydrogenElement, type HydrogenPageAssignment, type HydrogenPageData, type HydrogenProjectType, type HydrogenSchemaValidationResult, type HydrogenThemeSchema, type HydrogenThemeSettings, IMAGES_PLACEHOLDERS, type LoadPageParams, type ProjectIdValidationResult, type ProjectIdValue, type PublicEnv, type RouteLoaderArgs, type ThemeSettingsResponse, ThemeTextProvider, type ThemeTextProviderProps, type ThemeTextValue, type TranslateFunction, type WeaverseArticle, type WeaverseBlog, WeaverseClient, type WeaverseClientArgs, type WeaverseCollection, type WeaverseDataContext, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, type WeaverseHydrogenParams, WeaverseHydrogenRoot, type WeaverseI18n, type WeaverseInternal, type WeaverseLoaderData, type WeaverseLoaderRequestInfo, type WeaverseMetaObject, type WeaverseProduct, type WeaverseProjectConfigs, type WeaverseStudioQueries, type WithCacheFetchResponse, type WithWeaverseOptions, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getNestedKey, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, interpolate, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useThemeText, useWeaverseDataContext, withWeaverse };

package/dist/index.d.ts

@@ -8,7 +8,7 @@ import { createWithCache, CachingStrategy, I18nBase, HydrogenContext, HydrogenEn
 export { CachingStrategy } from '@shopify/hydrogen';
 import { LoaderFunctionArgs, AppLoadContext } from '@shopify/remix-oxygen';
 import * as React$1 from 'react';
-import { ComponentType, JSX, ForwardRefExoticComponent } from 'react';
+import { ReactNode, ComponentType, JSX, ForwardRefExoticComponent } from 'react';
 import { NavigateFunction, UIMatch } from 'react-router';
 import * as react_jsx_runtime from 'react/jsx-runtime';
 
@@ -33,6 +33,76 @@ declare class ThemeSettingsStore {
     destroy: () => void;
 }
 
+/**
+ * Traverse a nested object by dot-path.
+ *
+ * @example
+ * getNestedKey({ cart: { title: 'Cart' } }, 'cart.title') // => 'Cart'
+ * getNestedKey({}, 'cart.title', 'fallback')              // => 'fallback'
+ */
+declare function getNestedKey(obj: Record<string, unknown>, path: string, fallback?: string): string | undefined;
+/**
+ * Replace `{{variable}}` patterns in a string with provided values.
+ *
+ * @example
+ * interpolate('Hello {{name}}!', { name: 'World' }) // => 'Hello World!'
+ * interpolate('-{{percentage}}% Off', { percentage: 15 }) // => '-15% Off'
+ */
+declare function interpolate(template: string, variables?: Record<string, string | number>): string;
+/**
+ * Signature for a translation function.
+ */
+type TranslateFunction = (key: string, variables?: Record<string, string | number>) => string;
+type ThemeTextValue = {
+    /**
+     * Translate a key with optional variable interpolation.
+     *
+     * Priority chain (highest wins):
+     * 1. External `t`        (passed into `withWeaverse` / `ThemeTextProvider`)
+     * 2. `merchantOverrides` (DB overrides for the current locale)
+     * 3. `staticContent`     (theme default JSON)
+     * 4. The key itself      (fallback)
+     *
+     * @example
+     * t('cart.title')                           // => "Cart"
+     * t('badge.sale', { percentage: 15 })       // => "-15% Off"
+     */
+    t: TranslateFunction;
+};
+type ThemeTextProviderProps = {
+    staticContent: Record<string, unknown>;
+    merchantOverrides?: Record<string, unknown>;
+    /**
+     * Optional external translation function.
+     * When provided it becomes the **highest-priority** source:
+     * if it returns a non-empty string that differs from the raw key,
+     * that value is used; otherwise the internal resolution chain continues.
+     */
+    t?: TranslateFunction;
+    children: ReactNode;
+};
+/**
+ * Provider that wraps the app to expose the `t()` function.
+ *
+ * - `staticContent`      – the theme's default locale JSON (from themeSchema.i18n)
+ * - `merchantOverrides`  – locale-specific overrides fetched from the API
+ */
+declare function ThemeTextProvider({ staticContent, merchantOverrides, t: externalT, children, }: ThemeTextProviderProps): react_jsx_runtime.JSX.Element;
+/**
+ * Hook to access the theme text `t()` function.
+ *
+ * Must be used inside a component wrapped by `withWeaverse` or `ThemeTextProvider`.
+ *
+ * @example
+ * ```tsx
+ * function CartTitle() {
+ *   const { t } = useThemeText()
+ *   return <h2>{t('cart.title')}</h2>
+ * }
+ * ```
+ */
+declare function useThemeText(): ThemeTextValue;
+
 declare class WeaverseHydrogenItem extends WeaverseItemStore {
     weaverse: WeaverseHydrogen;
     constructor(initialData: HydrogenComponentData, weaverse: WeaverseHydrogen);
@@ -86,24 +156,36 @@ declare const WeaverseHydrogenRoot: React$1.MemoExoticComponent<({ components, e
     }>;
 }) => react_jsx_runtime.JSX.Element>;
 /**
- * Higher-order component that wraps your app with Weaverse theme settings context.
- * Provides theme settings to all child components via React context.
+ * Options for the `withWeaverse` HOC.
+ */
+type WithWeaverseOptions = {
+    /**
+     * Optional external translation function (e.g. from Shopify i18n).
+     * When provided it becomes the **highest-priority** source
+     * in the `t()` resolution chain exposed by `useThemeText()`.
+     */
+    t?: TranslateFunction;
+};
+/**
+ * Higher-order component that wraps your app with Weaverse theme settings
+ * and translation context.
  *
  * @param Component - The root component to wrap
- * @returns Wrapped component with theme settings provider
+ * @param options   - Optional configuration (e.g. an external `t` function)
+ * @returns Wrapped component with theme settings + translation providers
  *
  * @example
  * ```typescript
  * import { withWeaverse } from '@weaverse/hydrogen'
  *
- * function App() {
- *   return <div>My App</div>
- * }
- *
+ * // Basic usage
  * export default withWeaverse(App)
+ *
+ * // With external translation function
+ * export default withWeaverse(App, { t: myI18nFunction })
  * ```
  */
-declare function withWeaverse(Component: ComponentType<any>): (props: JSX.IntrinsicAttributes) => react_jsx_runtime.JSX.Element;
+declare function withWeaverse(Component: ComponentType<any>, options?: WithWeaverseOptions): (props: JSX.IntrinsicAttributes) => react_jsx_runtime.JSX.Element;
 /**
  * React hook to access Weaverse theme settings from anywhere in your component tree.
  * Must be used within a component wrapped by `withWeaverse` or inside `WeaverseHydrogenRoot`.
@@ -258,6 +340,12 @@ declare class WeaverseClient {
      * ```
      */
     loadThemeSettings: (strategy?: CachingStrategy) => Promise<ThemeSettingsResponse>;
+    /**
+     * Fetch locale-specific merchant overrides from the translation API.
+     * Returns a nested JSON object with translated values.
+     * Falls back to empty object on error to avoid blocking theme rendering.
+     */
+    private fetchMerchantOverrides;
     /**
      * Generate fallback page with default structure when page data is unavailable.
      * Used internally when API returns no page or when page needs default content.
@@ -443,6 +531,9 @@ type WeaverseI18n = I18nBase & {
     [key: string]: any;
 };
 type HydrogenThemeSchema = {
+    betaFlags?: {
+        contentManager?: boolean;
+    };
     info: {
         name: string;
         version: string;
@@ -458,6 +549,7 @@ type HydrogenThemeSchema = {
         urlStructure: 'url-path' | 'subdomain' | 'top-level-domain';
         defaultLocale: WeaverseI18n;
         shopLocales: WeaverseI18n[];
+        staticContent?: Record<string, unknown>;
     };
 };
 type FetchProjectRequestBody = {
@@ -620,6 +712,10 @@ type ThemeSettingsResponse = {
     theme?: HydrogenThemeSettings;
     schema?: HydrogenThemeSchema;
     publicEnv?: PublicEnv;
+    /** Theme's default locale JSON from themeSchema.i18n.staticContent */
+    staticContent?: Record<string, unknown>;
+    /** Locale-specific merchant overrides from the API */
+    merchantOverrides?: Record<string, unknown>;
     _error?: string;
     _loadFailed?: boolean;
 };
@@ -924,4 +1020,4 @@ declare const IMAGES_PLACEHOLDERS: {
     product_18: string;
 };
 
-export { type CacheResponseValidator, type ComponentDataValue, type ComponentLoaderArgs, type CreateHydrogenSchemaOptions, type DirectFetchResponse, type FetchProjectPayload, type FetchProjectRequestBody, type HydrogenComponent, type HydrogenComponentData, type HydrogenComponentPresets, type HydrogenComponentProps, type HydrogenComponentSchema, type HydrogenElement, type HydrogenPageAssignment, type HydrogenPageData, type HydrogenProjectType, type HydrogenSchemaValidationResult, type HydrogenThemeSchema, type HydrogenThemeSettings, IMAGES_PLACEHOLDERS, type LoadPageParams, type ProjectIdValidationResult, type ProjectIdValue, type PublicEnv, type RouteLoaderArgs, type ThemeSettingsResponse, type WeaverseArticle, type WeaverseBlog, WeaverseClient, type WeaverseClientArgs, type WeaverseCollection, type WeaverseDataContext, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, type WeaverseHydrogenParams, WeaverseHydrogenRoot, type WeaverseI18n, type WeaverseInternal, type WeaverseLoaderData, type WeaverseLoaderRequestInfo, type WeaverseMetaObject, type WeaverseProduct, type WeaverseProjectConfigs, type WeaverseStudioQueries, type WithCacheFetchResponse, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useWeaverseDataContext, withWeaverse };
+export { type CacheResponseValidator, type ComponentDataValue, type ComponentLoaderArgs, type CreateHydrogenSchemaOptions, type DirectFetchResponse, type FetchProjectPayload, type FetchProjectRequestBody, type HydrogenComponent, type HydrogenComponentData, type HydrogenComponentPresets, type HydrogenComponentProps, type HydrogenComponentSchema, type HydrogenElement, type HydrogenPageAssignment, type HydrogenPageData, type HydrogenProjectType, type HydrogenSchemaValidationResult, type HydrogenThemeSchema, type HydrogenThemeSettings, IMAGES_PLACEHOLDERS, type LoadPageParams, type ProjectIdValidationResult, type ProjectIdValue, type PublicEnv, type RouteLoaderArgs, type ThemeSettingsResponse, ThemeTextProvider, type ThemeTextProviderProps, type ThemeTextValue, type TranslateFunction, type WeaverseArticle, type WeaverseBlog, WeaverseClient, type WeaverseClientArgs, type WeaverseCollection, type WeaverseDataContext, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, type WeaverseHydrogenParams, WeaverseHydrogenRoot, type WeaverseI18n, type WeaverseInternal, type WeaverseLoaderData, type WeaverseLoaderRequestInfo, type WeaverseMetaObject, type WeaverseProduct, type WeaverseProjectConfigs, type WeaverseStudioQueries, type WithCacheFetchResponse, type WithWeaverseOptions, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getNestedKey, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, interpolate, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useThemeText, useWeaverseDataContext, withWeaverse };

package/dist/index.js

@@ -4,8 +4,8 @@ var hydrogen = require('@shopify/hydrogen');
 var react = require('@weaverse/react');
 var schema$1 = require('@weaverse/schema');
 var jsxRuntime = require('react/jsx-runtime');
-var reactRouter = require('react-router');
 var react$1 = require('react');
+var reactRouter = require('react-router');
 var reactErrorBoundary = require('react-error-boundary');
 
 // src/index.ts
@@ -33,6 +33,63 @@ var defaultComponents = [
     schema
   }
 ];
+function getNestedKey(obj, path, fallback) {
+  const keys = path.split(".");
+  let current = obj;
+  for (const key of keys) {
+    if (current == null || typeof current !== "object") {
+      return fallback;
+    }
+    current = current[key];
+  }
+  if (typeof current === "string") {
+    return current;
+  }
+  return fallback;
+}
+function interpolate(template, variables) {
+  if (!variables || Object.keys(variables).length === 0) {
+    return template;
+  }
+  return template.replace(/\{\{(\w+)\}\}/g, (match, key) => {
+    const value = variables[key];
+    return value !== void 0 ? String(value) : match;
+  });
+}
+var ThemeTextContext = react$1.createContext(null);
+ThemeTextContext.displayName = "WeaverseThemeTextContext";
+function ThemeTextProvider({
+  staticContent,
+  merchantOverrides,
+  t: externalT,
+  children
+}) {
+  const value = react$1.useMemo(() => {
+    const t = (key, variables) => {
+      if (externalT) {
+        const external = externalT(key, variables);
+        if (external && external !== key) {
+          return external;
+        }
+      }
+      const override = merchantOverrides ? getNestedKey(merchantOverrides, key) : void 0;
+      const staticValue = getNestedKey(staticContent, key);
+      const raw = override ?? staticValue ?? key;
+      return interpolate(raw, variables);
+    };
+    return { t };
+  }, [staticContent, merchantOverrides, externalT]);
+  return /* @__PURE__ */ jsxRuntime.jsx(ThemeTextContext.Provider, { value, children });
+}
+function useThemeText() {
+  const ctx = react$1.useContext(ThemeTextContext);
+  if (!ctx) {
+    throw new Error(
+      "useThemeText must be used within <ThemeTextProvider>. Wrap your app with withWeaverse()."
+    );
+  }
+  return ctx;
+}
 function createFlatDataContext(matches) {
   const context = {};
   for (const match of matches) {
@@ -562,10 +619,27 @@ var WeaverseHydrogenRoot = react$1.memo(
 );
 var ThemeSettingsProvider = react$1.createContext(null);
 ThemeSettingsProvider.displayName = "WeaverseThemeSettingsProvider";
-function withWeaverse(Component) {
+function withWeaverse(Component, options) {
   return (props) => {
-    const { settings } = useThemeSettingsStore();
-    return /* @__PURE__ */ jsxRuntime.jsx(ThemeSettingsProvider.Provider, { value: settings, children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ...props }) });
+    const themeSettingsStore = useThemeSettingsStore();
+    const { settings } = themeSettingsStore;
+    const themeTextData = useThemeTextData();
+    return /* @__PURE__ */ jsxRuntime.jsx(ThemeSettingsProvider.Provider, { value: settings, children: /* @__PURE__ */ jsxRuntime.jsx(
+      ThemeTextProvider,
+      {
+        merchantOverrides: themeTextData.merchantOverrides,
+        staticContent: themeTextData.staticContent,
+        t: options?.t,
+        children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ...props })
+      }
+    ) });
+  };
+}
+function useThemeTextData() {
+  const data = reactRouter.useRouteLoaderData("root");
+  return {
+    staticContent: data?.weaverseTheme?.staticContent ?? {},
+    merchantOverrides: data?.weaverseTheme?.merchantOverrides
   };
 }
 function useThemeSettings() {
@@ -981,41 +1055,52 @@ var WeaverseClient = class {
       }
       const url = this.getApiUrl("project_configs");
       const body = JSON.stringify({ isDesignMode, projectId });
-      let data = await this.fetchWithCache(url, {
-        method: "POST",
-        strategy,
-        body,
-        headers: {
-          "Content-Type": "application/json",
-          Accept: "application/json",
-          "Accept-Encoding": "gzip, deflate, br"
-        }
-      });
-      if (typeof data !== "object" || data === null) {
+      const [data, merchantOverrides] = await Promise.all([
+        this.fetchWithCache(url, {
+          method: "POST",
+          strategy,
+          body,
+          headers: {
+            "Content-Type": "application/json",
+            Accept: "application/json",
+            "Accept-Encoding": "gzip, deflate, br"
+          }
+        }),
+        this.fetchMerchantOverrides(strategy)
+      ]);
+      let result = data;
+      if (typeof result !== "object" || result === null) {
         console.warn(
           "Invalid theme settings response format, using defaults:",
           {
-            type: typeof data,
-            isString: typeof data === "string",
-            length: typeof data === "string" ? data.length : "N/A",
-            preview: typeof data === "string" ? `${data.substring(0, 50)}...` : String(data)
+            type: typeof result,
+            isString: typeof result === "string",
+            length: typeof result === "string" ? result.length : "N/A",
+            preview: typeof result === "string" ? `${result.substring(0, 50)}...` : String(result)
           }
         );
-        data = { theme: defaultThemeSettings };
+        result = { theme: defaultThemeSettings };
       }
       if (this.themeSchema?.settings || this.themeSchema?.inspector) {
-        if (!data.theme || typeof data.theme !== "object") {
-          data.theme = defaultThemeSettings;
+        if (!result.theme || typeof result.theme !== "object") {
+          result.theme = defaultThemeSettings;
         } else {
-          data.theme = {
+          result.theme = {
             ...defaultThemeSettings,
-            ...data.theme
+            ...result.theme
           };
         }
       }
+      const staticContent = this.themeSchema?.i18n?.staticContent;
+      if (staticContent) {
+        result.staticContent = staticContent;
+      }
+      if (merchantOverrides) {
+        result.merchantOverrides = merchantOverrides;
+      }
       if (this.configs.isDesignMode) {
-        data = {
-          ...data,
+        result = {
+          ...result,
           schema: this.themeSchema && typeof this.themeSchema === "object" ? {
             ...this.themeSchema,
             settings: this.themeSchema?.settings?.map((group) => ({
@@ -1034,18 +1119,57 @@ var WeaverseClient = class {
           publicEnv: this.configs.publicEnv
         };
       }
-      return data;
+      return result;
     } catch (error) {
       const errorMessage = "Unable to load theme settings";
       const errorDetails = this.extractErrorMessage(error);
       console.error(errorMessage, errorDetails);
       return {
         theme: defaultThemeSettings,
+        staticContent: this.themeSchema?.i18n?.staticContent,
         _error: errorDetails,
         _loadFailed: true
       };
     }
   };
+  /**
+   * Fetch locale-specific merchant overrides from the translation API.
+   * Returns a nested JSON object with translated values.
+   * Falls back to empty object on error to avoid blocking theme rendering.
+   */
+  fetchMerchantOverrides = async (strategy) => {
+    try {
+      const { projectId, weaverseHost } = this.configs;
+      const i18n = this.storefront.i18n;
+      if (!(projectId && weaverseHost)) {
+        return void 0;
+      }
+      const language = (i18n?.language || "en").toLowerCase();
+      const country = (i18n?.country || "us").toLowerCase();
+      const locale = `${language}-${country}`;
+      const url = `${weaverseHost}/api/translation/static?projectId=${projectId}&locale=${locale}`;
+      const overrides = await this.fetchWithCache(
+        url,
+        {
+          method: "GET",
+          strategy,
+          headers: {
+            Accept: "application/json"
+          }
+        }
+      );
+      if (typeof overrides === "object" && overrides !== null) {
+        return overrides;
+      }
+      return void 0;
+    } catch (error) {
+      console.warn(
+        "Unable to load merchant overrides, using theme defaults:",
+        this.extractErrorMessage(error)
+      );
+      return void 0;
+    }
+  };
   /**
    * Generate fallback page with default structure when page data is unavailable.
    * Used internally when API returns no page or when page needs default content.
@@ -1322,6 +1446,7 @@ Object.defineProperty(exports, "useWeaverse", {
   get: function () { return react.useWeaverse; }
 });
 exports.IMAGES_PLACEHOLDERS = IMAGES_PLACEHOLDERS;
+exports.ThemeTextProvider = ThemeTextProvider;
 exports.WeaverseClient = WeaverseClient;
 exports.WeaverseError = WeaverseError;
 exports.WeaverseHydrogen = WeaverseHydrogen;
@@ -1330,12 +1455,14 @@ exports.WeaverseHydrogenRoot = WeaverseHydrogenRoot;
 exports.createWeaverseDataContext = createWeaverseDataContext;
 exports.defaultComponents = defaultComponents;
 exports.generateDataFromSchema = generateDataFromSchema;
+exports.getNestedKey = getNestedKey;
 exports.getPreviewData = getPreviewData;
 exports.getRequestQueries = getRequestQueries;
 exports.getSelectedProductOptions = getSelectedProductOptions;
 exports.getWeaverseConfigs = getWeaverseConfigs;
 exports.hasError = hasError;
 exports.hasWeaverseStudio = hasWeaverseStudio;
+exports.interpolate = interpolate;
 exports.isFetchProjectPayload = isFetchProjectPayload;
 exports.isProjectIdFunction = isProjectIdFunction;
 exports.isThemeSettingsResponse = isThemeSettingsResponse;
@@ -1343,6 +1470,7 @@ exports.isValidHydrogenSchema = isValidHydrogenSchema;
 exports.isWithCacheFetchResponse = isWithCacheFetchResponse;
 exports.registerComponent = registerComponent;
 exports.useThemeSettings = useThemeSettings;
+exports.useThemeText = useThemeText;
 exports.useWeaverseDataContext = useWeaverseDataContext;
 exports.withWeaverse = withWeaverse;
 Object.keys(schema$1).forEach(function (k) {