@weaverse/hydrogen 5.16.2 → 5.16.4

package/dist/index.js

@@ -56,77 +56,70 @@ function interpolate(template, variables) {
     return value === void 0 ? match : String(value);
   });
 }
-var ThemeTextContext = react$1.createContext(null);
-ThemeTextContext.displayName = "WeaverseThemeTextContext";
-function unflattenKeys(flat) {
-  const result = {};
-  for (const [dotPath, value] of Object.entries(flat)) {
-    const keys = dotPath.split(".");
-    let current = result;
-    for (let i = 0; i < keys.length - 1; i++) {
-      const k = keys[i];
-      if (!(k in current) || typeof current[k] !== "object") {
-        current[k] = {};
+var TranslationContext = react$1.createContext(null);
+TranslationContext.displayName = "WeaverseTranslationContext";
+function createTranslate(sources) {
+  const { staticContent, merchantOverrides, designOverrides, externalT } = sources;
+  return (key, variables) => {
+    if (externalT) {
+      const external = externalT(key, variables);
+      if (external && external !== key) {
+        return external;
       }
-      current = current[k];
     }
-    current[keys[keys.length - 1]] = value;
-  }
-  return result;
+    const design = designOverrides && Object.hasOwn(designOverrides, key) ? designOverrides[key] : void 0;
+    const override = merchantOverrides ? getNestedKey(merchantOverrides, key) : void 0;
+    const staticValue = getNestedKey(staticContent, key);
+    const raw = design ?? override ?? staticValue ?? key;
+    return interpolate(raw, variables);
+  };
 }
 var EMPTY = {};
 var NOOP_SUBSCRIBE = () => () => {
 };
 var NOOP_SNAPSHOT = () => EMPTY;
-function ThemeTextProvider({
+function TranslationProvider({
   staticContent,
   merchantOverrides,
   t: externalT,
+  translationStore,
   themeTextStore,
   children
 }) {
+  const store = translationStore ?? themeTextStore ?? null;
   const designOverrides = react.useSafeExternalStore(
-    themeTextStore?.subscribe ?? NOOP_SUBSCRIBE,
-    themeTextStore?.getSnapshot ?? NOOP_SNAPSHOT,
-    themeTextStore?.getServerSnapshot ?? NOOP_SNAPSHOT
+    store?.subscribe ?? NOOP_SUBSCRIBE,
+    store?.getSnapshot ?? NOOP_SNAPSHOT,
+    store?.getServerSnapshot ?? NOOP_SNAPSHOT
   );
-  const mergedOverrides = designOverrides !== EMPTY && Object.keys(designOverrides).length > 0 ? { ...merchantOverrides, ...unflattenKeys(designOverrides) } : merchantOverrides;
-  const value = react$1.useMemo(() => {
-    const t = (key, variables) => {
-      if (externalT) {
-        const external = externalT(key, variables);
-        if (external && external !== key) {
-          return external;
-        }
-      }
-      const override = mergedOverrides ? getNestedKey(mergedOverrides, key) : void 0;
-      const staticValue = getNestedKey(staticContent, key);
-      const raw = override ?? staticValue ?? key;
-      return interpolate(raw, variables);
-    };
-    return {
-      t,
-      themeTextStore: themeTextStore ?? null,
+  const value = react$1.useMemo(
+    () => ({
+      t: createTranslate({
+        staticContent,
+        merchantOverrides,
+        designOverrides,
+        externalT
+      }),
+      translationStore: store,
+      // Deprecated alias — same instance, kept for backward compatibility.
+      themeTextStore: store,
       merchantOverrides: merchantOverrides ?? null
-    };
-  }, [
-    staticContent,
-    merchantOverrides,
-    mergedOverrides,
-    externalT,
-    themeTextStore
-  ]);
-  return /* @__PURE__ */ jsxRuntime.jsx(ThemeTextContext.Provider, { value, children });
+    }),
+    [staticContent, merchantOverrides, designOverrides, externalT, store]
+  );
+  return /* @__PURE__ */ jsxRuntime.jsx(TranslationContext.Provider, { value, children });
 }
-function useThemeText() {
-  const ctx = react$1.useContext(ThemeTextContext);
+function useTranslation() {
+  const ctx = react$1.useContext(TranslationContext);
   if (!ctx) {
     throw new Error(
-      "useThemeText must be used within <ThemeTextProvider>. Wrap your app with withWeaverse()."
+      "useTranslation must be used within <TranslationProvider>. Wrap your app with withWeaverse()."
     );
   }
   return ctx;
 }
+var ThemeTextProvider = TranslationProvider;
+var useThemeText = useTranslation;
 function createFlatDataContext(matches) {
   const context = {};
   for (const match of matches) {
@@ -251,6 +244,67 @@ function hasWeaverseStudio(window2) {
   return "weaverseStudio" in window2 && typeof window2.weaverseStudio === "object";
 }
 
+// src/utils/studio-script-src.ts
+var DEFAULT_WEAVERSE_HOST = "https://studio.weaverse.io";
+var TRUSTED_STUDIO_DOMAINS = ["weaverse.io", "weaverse.dev"];
+function isLoopbackHostname(hostname) {
+  return hostname === "localhost" || hostname === "127.0.0.1" || hostname.endsWith(".localhost");
+}
+function isTrustedStudioHost(host, options) {
+  let parsed;
+  try {
+    parsed = new URL(host);
+  } catch {
+    return false;
+  }
+  let { hostname, protocol } = parsed;
+  if (options?.allowLoopback && isLoopbackHostname(hostname)) {
+    return protocol === "http:" || protocol === "https:";
+  }
+  if (protocol !== "https:") {
+    return false;
+  }
+  return TRUSTED_STUDIO_DOMAINS.some(
+    (domain) => hostname === domain || hostname.endsWith(`.${domain}`)
+  );
+}
+function getStudioScriptSrc(mode) {
+  let {
+    isDesignMode,
+    isPreviewMode,
+    isRevisionPreview,
+    weaverseHost,
+    weaverseVersion
+  } = mode;
+  let base = `${weaverseHost}/static/studio/hydrogen`;
+  let version = `?v=${weaverseVersion}`;
+  if (isRevisionPreview || isPreviewMode) {
+    return `${base}/preview.js${version}`;
+  }
+  if (isDesignMode) {
+    return `${base}/index.js${version}`;
+  }
+  return null;
+}
+function resolveStudioScriptSrc(search, storefrontHostname = "") {
+  let params = new URLSearchParams(search);
+  let last = (key) => params.getAll(key).at(-1);
+  let host = last("weaverseHost");
+  if (host) {
+    let allowLoopback = isLoopbackHostname(storefrontHostname);
+    if (!isTrustedStudioHost(host, { allowLoopback })) {
+      return null;
+    }
+  }
+  return getStudioScriptSrc({
+    isDesignMode: last("isDesignMode") === "true",
+    isPreviewMode: last("isPreviewMode") === "true",
+    isRevisionPreview: params.has("__revisionId"),
+    weaverseHost: host || DEFAULT_WEAVERSE_HOST,
+    weaverseVersion: last("weaverseVersion") || ""
+  });
+}
+
 // src/utils/index.ts
 var warnedTypes = /* @__PURE__ */ new Set();
 function logOnce(type, message) {
@@ -314,8 +368,9 @@ function getWeaverseConfigs(request, env) {
   let url = new URL(request.url);
   let isRevisionPreview = url.searchParams.has("__revisionId");
   let configuredWeaverseHost = WEAVERSE_HOST || envFromProcess.WEAVERSE_HOST;
-  let resolvedWeaverseHost = weaverseHost || configuredWeaverseHost || "https://studio.weaverse.io";
-  let resolvedWeaverseApiBase = weaverseHost ? weaverseHost : WEAVERSE_PUBLIC_API_BASE || envFromProcess.WEAVERSE_PUBLIC_API_BASE || (configuredWeaverseHost && configuredWeaverseHost !== "https://studio.weaverse.io" ? configuredWeaverseHost : "https://api.weaverse.io");
+  let trustedUrlHost = typeof weaverseHost === "string" && isTrustedStudioHost(weaverseHost) ? weaverseHost : "";
+  let resolvedWeaverseHost = trustedUrlHost || configuredWeaverseHost || "https://studio.weaverse.io";
+  let resolvedWeaverseApiBase = trustedUrlHost ? trustedUrlHost : WEAVERSE_PUBLIC_API_BASE || envFromProcess.WEAVERSE_PUBLIC_API_BASE || (configuredWeaverseHost && configuredWeaverseHost !== "https://studio.weaverse.io" ? configuredWeaverseHost : "https://api.weaverse.io");
   return {
     projectId: weaverseProjectId || WEAVERSE_PROJECT_ID || envFromProcess.WEAVERSE_PROJECT_ID || "",
     weaverseHost: resolvedWeaverseHost,
@@ -458,8 +513,8 @@ function getPreviewData(type, components, weaverseHost) {
   };
 }
 
-// src/utils/theme-text-store.ts
-var ThemeTextStore = class {
+// src/utils/translation-store.ts
+var TranslationStore = class {
   overrides = {};
   listeners = /* @__PURE__ */ new Set();
   setOverrides = (overrides) => {
@@ -483,11 +538,12 @@ var ThemeTextStore = class {
       try {
         listener();
       } catch (error) {
-        console.error("ThemeTextStore: Listener error", error);
+        console.error("TranslationStore: Listener error", error);
       }
     }
   };
 };
+var ThemeTextStore = TranslationStore;
 
 // src/utils/pick-weaverse-data.ts
 function pickWeaverseData(dataProp, ownLoaderData, matches) {
@@ -577,11 +633,14 @@ function syncReusedInstance(weaverse, params) {
 var currentNavigationKey = null;
 var firedPageIds = /* @__PURE__ */ new Set();
 var mountedInstances = 0;
-function shouldFirePixel(navigationKey, pageId) {
+function observeNavigation(navigationKey) {
   if (navigationKey !== currentNavigationKey) {
     currentNavigationKey = navigationKey;
     firedPageIds.clear();
   }
+}
+function shouldFirePixel(navigationKey, pageId) {
+  observeNavigation(navigationKey);
   if (firedPageIds.has(pageId)) {
     return false;
   }
@@ -720,13 +779,23 @@ function waitForStudio() {
     check();
   });
 }
+function useStudioConnect() {
+  let { search } = reactRouter.useLocation();
+  react$1.useEffect(() => {
+    let hostname = typeof window === "undefined" ? "" : window.location.hostname;
+    let src = resolveStudioScriptSrc(search, hostname);
+    if (src) {
+      react.loadScript(src).catch(console.error);
+    }
+  }, [search]);
+}
 function useStudio(weaverse) {
   let { revalidate } = reactRouter.useRevalidator();
   let navigation = reactRouter.useNavigation();
   let { pathname, search } = reactRouter.useLocation();
   let navigate = reactRouter.useNavigate();
   let themeSettingsStore = useThemeSettingsStore();
-  let { themeTextStore, merchantOverrides } = useThemeText();
+  let { translationStore, themeTextStore, merchantOverrides } = useTranslation();
   let {
     isDesignMode,
     weaverseHost,
@@ -735,22 +804,33 @@ function useStudio(weaverse) {
     isRevisionPreview
   } = weaverse;
   react$1.useEffect(() => {
-    if (navigation.state === "idle") {
-      if (isRevisionPreview || isPreviewMode) {
-        let previewSrc = `${weaverseHost}/static/studio/hydrogen/preview.js?v=${weaverseVersion}`;
-        react.loadScript(previewSrc).catch(console.error);
-      } else if (isDesignMode) {
-        weaverse.internal = {
-          ...weaverse.internal,
-          navigate,
-          revalidate,
-          merchantOverrides,
-          themeSettingsStore,
-          themeTextStore
-        };
-        let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
-        react.loadScript(studioSrc).then(waitForStudio).then((studio) => studio?.init(weaverse)).catch(console.error);
-      }
+    if (navigation.state !== "idle") {
+      return;
+    }
+    let src = getStudioScriptSrc({
+      isDesignMode,
+      isPreviewMode,
+      isRevisionPreview,
+      weaverseHost,
+      weaverseVersion
+    });
+    if (!src) {
+      return;
+    }
+    if (isRevisionPreview || isPreviewMode) {
+      react.loadScript(src).catch(console.error);
+    } else {
+      weaverse.internal = {
+        ...weaverse.internal,
+        navigate,
+        revalidate,
+        merchantOverrides,
+        themeSettingsStore,
+        translationStore,
+        // Deprecated alias for existing Studio bridge integrations.
+        themeTextStore
+      };
+      react.loadScript(src).then(waitForStudio).then((studio) => studio?.init(weaverse)).catch(console.error);
     }
   }, [pathname, search, navigation.state]);
   usePixel(weaverse);
@@ -758,6 +838,12 @@ function useStudio(weaverse) {
 function usePixel(context) {
   let { projectId, pageId, isDesignMode, weaverseHost } = context;
   let { key: navigationKey } = reactRouter.useLocation();
+  react$1.useEffect(() => {
+    if (!(projectId && pageId) || isDesignMode) {
+      return;
+    }
+    observeNavigation(navigationKey);
+  }, [navigationKey, projectId, pageId, isDesignMode]);
   react$1.useEffect(() => {
     if (!(projectId && pageId) || isDesignMode) {
       return;
@@ -959,6 +1045,10 @@ var StudioBridge = react$1.memo(({ context }) => {
   useStudio(context);
   return null;
 });
+var StudioConnect = react$1.memo(() => {
+  useStudioConnect();
+  return null;
+});
 var registeredComponentLists = /* @__PURE__ */ new WeakSet();
 function RenderRoot(props) {
   const { data, components, dataContext } = props;
@@ -1041,24 +1131,27 @@ var WeaverseHydrogenRoot = react$1.memo(
 function withWeaverse(Component, options) {
   return (props) => {
     const themeSettingsStore = useCreateThemeSettingsStore();
-    const themeTextData = useThemeTextData();
-    const themeTextStoreRef = react$1.useRef(null);
-    if (!themeTextStoreRef.current) {
-      themeTextStoreRef.current = new ThemeTextStore();
+    const translationData = useTranslationData();
+    const translationStoreRef = react$1.useRef(null);
+    if (!translationStoreRef.current) {
+      translationStoreRef.current = new TranslationStore();
     }
-    return /* @__PURE__ */ jsxRuntime.jsx(ThemeSettingsStoreContext.Provider, { value: themeSettingsStore, children: /* @__PURE__ */ jsxRuntime.jsx(
-      ThemeTextProvider,
+    return /* @__PURE__ */ jsxRuntime.jsx(ThemeSettingsStoreContext.Provider, { value: themeSettingsStore, children: /* @__PURE__ */ jsxRuntime.jsxs(
+      TranslationProvider,
       {
-        merchantOverrides: themeTextData.merchantOverrides,
-        staticContent: themeTextData.staticContent,
+        merchantOverrides: translationData.merchantOverrides,
+        staticContent: translationData.staticContent,
         t: options?.t,
-        themeTextStore: themeTextStoreRef.current,
-        children: /* @__PURE__ */ jsxRuntime.jsx(Component, { ...props })
+        translationStore: translationStoreRef.current,
+        children: [
+          /* @__PURE__ */ jsxRuntime.jsx(StudioConnect, {}),
+          /* @__PURE__ */ jsxRuntime.jsx(Component, { ...props })
+        ]
       }
     ) });
   };
 }
-function useThemeTextData() {
+function useTranslationData() {
   const data = reactRouter.useRouteLoaderData("root");
   return {
     staticContent: data?.weaverseTheme?.staticContent ?? {},
@@ -1636,6 +1729,9 @@ var WeaverseClient = class {
     try {
       const { projectId, weaverseHost } = this.configs;
       const i18n = this.storefront.i18n;
+      if (!this.themeSchema?.i18n) {
+        return;
+      }
       if (!(projectId && weaverseHost)) {
         return;
       }
@@ -1736,7 +1832,7 @@ var WeaverseClient = class {
    * Fetches page content, executes component loaders, and handles empty items fallback.
    *
    * @param params - Optional page loading parameters
-   * @param params.type - Page type (HOME, PAGE, PRODUCT, COLLECTION, etc.)
+   * @param params.type - Page type (INDEX, PAGE, PRODUCT, COLLECTION, etc.)
    * @param params.handle - Page handle for dynamic routes
    * @param params.locale - Locale override
    * @param params.projectId - Route-level project ID override (for multi-project)
@@ -1749,7 +1845,7 @@ var WeaverseClient = class {
    * const data = await weaverse.loadPage()
    *
    * // With page type
-   * const data = await weaverse.loadPage({ type: 'HOME' })
+   * const data = await weaverse.loadPage({ type: 'INDEX' })
    *
    * // Route-level project override
    * const data = await weaverse.loadPage({
@@ -1992,6 +2088,8 @@ Object.defineProperty(exports, "useWeaverse", {
 exports.IMAGES_PLACEHOLDERS = IMAGES_PLACEHOLDERS;
 exports.ThemeTextProvider = ThemeTextProvider;
 exports.ThemeTextStore = ThemeTextStore;
+exports.TranslationProvider = TranslationProvider;
+exports.TranslationStore = TranslationStore;
 exports.WeaverseClient = WeaverseClient;
 exports.WeaverseError = WeaverseError;
 exports.WeaverseHydrogen = WeaverseHydrogen;
@@ -2018,6 +2116,7 @@ exports.isWithCacheFetchResponse = isWithCacheFetchResponse;
 exports.registerComponent = registerComponent;
 exports.useThemeSettings = useThemeSettings;
 exports.useThemeText = useThemeText;
+exports.useTranslation = useTranslation;
 exports.useWeaverseDataContext = useWeaverseDataContext;
 exports.withWeaverse = withWeaverse;
 Object.keys(schema$1).forEach(function (k) {