@weaverse/hydrogen 5.12.0 → 5.12.1

package/dist/index.mjs

@@ -58,12 +58,39 @@ function interpolate(template, variables) {
 }
 var ThemeTextContext = 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] = {};
+      }
+      current = current[k];
+    }
+    current[keys[keys.length - 1]] = value;
+  }
+  return result;
+}
+var EMPTY = {};
+var NOOP_SUBSCRIBE = () => () => {
+};
+var NOOP_SNAPSHOT = () => EMPTY;
 function ThemeTextProvider({
   staticContent,
   merchantOverrides,
   t: externalT,
+  themeTextStore,
   children
 }) {
+  const designOverrides = useSafeExternalStore(
+    themeTextStore?.subscribe ?? NOOP_SUBSCRIBE,
+    themeTextStore?.getSnapshot ?? NOOP_SNAPSHOT,
+    themeTextStore?.getServerSnapshot ?? NOOP_SNAPSHOT
+  );
+  const mergedOverrides = designOverrides !== EMPTY && Object.keys(designOverrides).length > 0 ? { ...merchantOverrides, ...unflattenKeys(designOverrides) } : merchantOverrides;
   const value = useMemo(() => {
     const t = (key, variables) => {
       if (externalT) {
@@ -72,13 +99,23 @@ function ThemeTextProvider({
           return external;
         }
       }
-      const override = merchantOverrides ? getNestedKey(merchantOverrides, key) : void 0;
+      const override = mergedOverrides ? getNestedKey(mergedOverrides, key) : void 0;
       const staticValue = getNestedKey(staticContent, key);
       const raw = override ?? staticValue ?? key;
       return interpolate(raw, variables);
     };
-    return { t };
-  }, [staticContent, merchantOverrides, externalT]);
+    return {
+      t,
+      themeTextStore: themeTextStore ?? null,
+      merchantOverrides: merchantOverrides ?? null
+    };
+  }, [
+    staticContent,
+    merchantOverrides,
+    mergedOverrides,
+    externalT,
+    themeTextStore
+  ]);
   return /* @__PURE__ */ jsx(ThemeTextContext.Provider, { value, children });
 }
 function useThemeText() {
@@ -349,6 +386,37 @@ function getPreviewData(type, components, weaverseHost) {
     }
   };
 }
+
+// src/utils/theme-text-store.ts
+var ThemeTextStore = class {
+  overrides = {};
+  listeners = /* @__PURE__ */ new Set();
+  setOverrides = (overrides) => {
+    this.overrides = { ...overrides };
+    this.emit();
+  };
+  updateOverrides = (newOverrides) => {
+    this.overrides = { ...this.overrides, ...newOverrides };
+    this.emit();
+  };
+  getSnapshot = () => this.overrides;
+  getServerSnapshot = () => this.overrides;
+  subscribe = (callback) => {
+    this.listeners.add(callback);
+    return () => {
+      this.listeners.delete(callback);
+    };
+  };
+  emit = () => {
+    for (const listener of Array.from(this.listeners)) {
+      try {
+        listener();
+      } catch (error) {
+        console.error("ThemeTextStore: Listener error", error);
+      }
+    }
+  };
+};
 var ThemeSettingsStore = class {
   settings = {};
   schema;
@@ -459,6 +527,7 @@ function useStudio(weaverse) {
   let { pathname, search } = useLocation();
   let navigate = useNavigate();
   let themeSettingsStore = useThemeSettingsStore();
+  let { themeTextStore, merchantOverrides } = useThemeText();
   let {
     isDesignMode,
     weaverseHost,
@@ -476,7 +545,9 @@ function useStudio(weaverse) {
           ...weaverse.internal,
           navigate,
           revalidate,
-          themeSettingsStore
+          merchantOverrides,
+          themeSettingsStore,
+          themeTextStore
         };
         let studioSrc = `${weaverseHost}/static/studio/hydrogen/index.js?v=${weaverseVersion}`;
         loadScript(studioSrc).then(() => {
@@ -761,12 +832,17 @@ function withWeaverse(Component, options) {
   return (props) => {
     const themeSettingsStore = useCreateThemeSettingsStore();
     const themeTextData = useThemeTextData();
+    const themeTextStoreRef = useRef(null);
+    if (!themeTextStoreRef.current) {
+      themeTextStoreRef.current = new ThemeTextStore();
+    }
     return /* @__PURE__ */ jsx(ThemeSettingsStoreContext.Provider, { value: themeSettingsStore, children: /* @__PURE__ */ jsx(
       ThemeTextProvider,
       {
         merchantOverrides: themeTextData.merchantOverrides,
         staticContent: themeTextData.staticContent,
         t: options?.t,
+        themeTextStore: themeTextStoreRef.current,
         children: /* @__PURE__ */ jsx(Component, { ...props })
       }
     ) });
@@ -1558,6 +1634,6 @@ var IMAGES_PLACEHOLDERS = {
   product_18: "https://cdn.shopify.com/s/files/1/0838/0052/3057/files/fpo-product-watch-2-1024x1024.svg"
 };
 
-export { IMAGES_PLACEHOLDERS, ThemeTextProvider, WeaverseClient, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, WeaverseHydrogenRoot, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getNestedKey, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, interpolate, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useThemeText, useWeaverseDataContext, withWeaverse };
+export { IMAGES_PLACEHOLDERS, ThemeTextProvider, ThemeTextStore, WeaverseClient, WeaverseError, WeaverseHydrogen, WeaverseHydrogenItem, WeaverseHydrogenRoot, createWeaverseDataContext, defaultComponents, generateDataFromSchema, getNestedKey, getPreviewData, getRequestQueries, getSelectedProductOptions, getWeaverseConfigs, hasError, hasWeaverseStudio, interpolate, isFetchProjectPayload, isProjectIdFunction, isThemeSettingsResponse, isValidHydrogenSchema, isWithCacheFetchResponse, registerComponent, useThemeSettings, useThemeText, useWeaverseDataContext, withWeaverse };
 //# sourceMappingURL=index.mjs.map
 //# sourceMappingURL=index.mjs.map