@weaverse/hydrogen 1.0.49 → 1.0.50

package/dist/index.d.ts

@@ -21,6 +21,7 @@ type WeaverseLoaderArgs = LoaderArgs & {
 };
 interface HydrogenComponentData extends Omit<ElementData, 'childIds' | 'css'> {
     id: string;
+    type: string;
     createdAt: string;
     updatedAt: string;
     deletedAt: string;
@@ -42,7 +43,7 @@ interface InspectorGroup {
     group: string;
     inputs: BasicInput[];
 }
-interface HydrogenComponentProps<L = unknown> extends WeaverseElement {
+interface HydrogenComponentProps<L = any> extends WeaverseElement {
     className?: string;
     loaderData?: L;
     children?: React.JSX.Element[];
@@ -83,12 +84,14 @@ interface HydrogenPageData {
     page: any;
     configs: HydrogenPageConfigs;
 }
+type WeaverseHydrogenLoaderData = {
+    weaverseData?: HydrogenPageData;
+    [key: string]: any;
+};
 interface WeaverseHydrogenRootProps {
     components: Record<string, HydrogenComponent>;
-    data: {
-        weaverseData?: HydrogenPageData;
-        [key: string]: any;
-    };
+    data: WeaverseHydrogenLoaderData;
+    themeSchema?: InspectorGroup[];
 }
 
 /**
@@ -104,4 +107,4 @@ declare function weaverseLoader(args: LoaderArgs, components: Record<string, Hyd
 
 declare let WeaverseHydrogenRoot: (props: WeaverseHydrogenRootProps) => React.JSX.Element;
 
-export { ComponentFlags, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageConfigs, HydrogenPageData, InspectorGroup, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseLoaderArgs, fetchWithServerCache, weaverseLoader };
+export { ComponentFlags, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageConfigs, HydrogenPageData, InspectorGroup, TODO, WeaverseHydrogen, WeaverseHydrogenLoaderData, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseLoaderArgs, fetchWithServerCache, weaverseLoader };

package/dist/index.js

@@ -45,24 +45,25 @@ function createRootContext(init) {
   return new import_react.Weaverse(init);
 }
 function createCachedContext(init) {
-  if (import_react.isBrowser && init.pageId) {
+  if (import_react.isBrowser) {
     window.__weaverses = window.__weaverses || {};
-    if (!window.__weaverses[init.pageId]) {
-      window.__weaverses[init.pageId] = createRootContext(init);
+    let pathname = window.location.pathname;
+    if (!window.__weaverses[pathname]) {
+      window.__weaverses[pathname] = createRootContext(init);
     }
-    return window.__weaverses[init.pageId];
+    return window.__weaverses[pathname];
   }
   return createRootContext(init);
 }
-function createWeaverseHydrogenContext({ weaverseData }, components) {
-  let { page = {}, configs = {} } = weaverseData || {};
+function createWeaverseHydrogenContext(data, components) {
+  let weaverseData = data?.weaverseData || {};
+  let { page = {}, configs = {} } = weaverseData;
   let weaverse = createCachedContext({
     ...configs,
     data: page,
     pageId: page?.id,
     platformType: "shopify-hydrogen"
   });
-  weaverse.elementInstances.clear();
   Object.entries(components).forEach(([key, component]) => {
     weaverse.registerElement({
       type: component?.schema?.type || key,
@@ -709,10 +710,11 @@ Weaverse2.WeaverseItemStore = WeaverseItemStore;
 
 // src/hooks/use-studio.ts
 var import_react2 = require("react");
-function useStudio(weaverseCore) {
+function useStudio(weaverseCore, themeSchema) {
   (0, import_react2.useEffect)(() => {
     if (weaverseCore.isDesignMode && isIframe && !window.weaverseStudioInitialized) {
       window.weaverseStudioInitialized = true;
+      weaverseCore.themeSchema = themeSchema;
       let host = weaverseCore.weaverseHost;
       let version = weaverseCore.weaverseVersion || Date.now();
       loadScript(`${host}/assets/studio/studio-bridge.js?v=${version}`).then(
@@ -724,10 +726,8 @@ function useStudio(weaverseCore) {
         }
       );
     }
-    window.requestAnimationFrame(() => {
-      window.__weaverse = weaverseCore;
-    });
-  }, []);
+    window.__weaverse = weaverseCore;
+  }, [weaverseCore]);
 }
 
 // src/fetch.ts
@@ -794,12 +794,15 @@ var fetchWithServerCache = async ({
 // src/loader.ts
 async function weaverseLoader(args, components) {
   let { request, context, params } = args;
-  let { env } = context;
+  let {
+    env,
+    storefront: { i18n }
+  } = context;
   let queries = getRequestQueries(request);
-  let projectId = env?.WEAVERSE_PROJECT_ID;
-  let weaverseHost = env?.WEAVERSE_HOST;
-  if (!projectId || !weaverseHost) {
-    console.log("\u274C Missing `WEAVERSE_PROJECT_ID` or `WEAVERSE_HOST`!");
+  let projectId = queries?.projectId || env?.WEAVERSE_PROJECT_ID;
+  let weaverseHost = env?.WEAVERSE_HOST || "https://weaverse.io";
+  if (!projectId) {
+    console.log("\u274C Missing `projectId`!");
     return null;
   }
   let configs = {
@@ -808,14 +811,13 @@ async function weaverseLoader(args, components) {
     ...queries
   };
   try {
+    let projectAPI = `${weaverseHost}/api/public/project`;
+    let url = request.url;
     let page = await fetchWithServerCache({
-      url: `${weaverseHost}/api/public/project`,
+      url: projectAPI,
       options: {
         method: "POST",
-        body: JSON.stringify({
-          projectId,
-          url: request.url
-        })
+        body: JSON.stringify({ projectId, url, i18n })
       },
       context
     }).then((r2) => r2.json()).catch((err) => {
@@ -858,11 +860,9 @@ async function weaverseLoader(args, components) {
 // src/index.tsx
 __reExport(src_exports, require("@weaverse/react"), module.exports);
 var WeaverseHydrogenRoot = (props) => {
-  let { components, data } = props;
+  let { components, data, themeSchema } = props;
   let weaverse = createWeaverseHydrogenContext(data, components);
-  useStudio(weaverse);
-  if (!weaverse?.data)
-    return /* @__PURE__ */ import_react4.default.createElement("div", null, "No Weaverse data!");
+  useStudio(weaverse, themeSchema);
   return /* @__PURE__ */ import_react4.default.createElement(import_react3.WeaverseRoot, { context: weaverse });
 };
 // Annotate the CommonJS export names for ESM import in node:

package/dist/index.mjs

@@ -8,24 +8,25 @@ function createRootContext(init) {
   return new Weaverse(init);
 }
 function createCachedContext(init) {
-  if (isBrowser && init.pageId) {
+  if (isBrowser) {
     window.__weaverses = window.__weaverses || {};
-    if (!window.__weaverses[init.pageId]) {
-      window.__weaverses[init.pageId] = createRootContext(init);
+    let pathname = window.location.pathname;
+    if (!window.__weaverses[pathname]) {
+      window.__weaverses[pathname] = createRootContext(init);
     }
-    return window.__weaverses[init.pageId];
+    return window.__weaverses[pathname];
   }
   return createRootContext(init);
 }
-function createWeaverseHydrogenContext({ weaverseData }, components) {
-  let { page = {}, configs = {} } = weaverseData || {};
+function createWeaverseHydrogenContext(data, components) {
+  let weaverseData = data?.weaverseData || {};
+  let { page = {}, configs = {} } = weaverseData;
   let weaverse = createCachedContext({
     ...configs,
     data: page,
     pageId: page?.id,
     platformType: "shopify-hydrogen"
   });
-  weaverse.elementInstances.clear();
   Object.entries(components).forEach(([key, component]) => {
     weaverse.registerElement({
       type: component?.schema?.type || key,
@@ -672,10 +673,11 @@ Weaverse2.WeaverseItemStore = WeaverseItemStore;
 
 // src/hooks/use-studio.ts
 import { useEffect } from "react";
-function useStudio(weaverseCore) {
+function useStudio(weaverseCore, themeSchema) {
   useEffect(() => {
     if (weaverseCore.isDesignMode && isIframe && !window.weaverseStudioInitialized) {
       window.weaverseStudioInitialized = true;
+      weaverseCore.themeSchema = themeSchema;
       let host = weaverseCore.weaverseHost;
       let version = weaverseCore.weaverseVersion || Date.now();
       loadScript(`${host}/assets/studio/studio-bridge.js?v=${version}`).then(
@@ -687,10 +689,8 @@ function useStudio(weaverseCore) {
         }
       );
     }
-    window.requestAnimationFrame(() => {
-      window.__weaverse = weaverseCore;
-    });
-  }, []);
+    window.__weaverse = weaverseCore;
+  }, [weaverseCore]);
 }
 
 // src/fetch.ts
@@ -757,12 +757,15 @@ var fetchWithServerCache = async ({
 // src/loader.ts
 async function weaverseLoader(args, components) {
   let { request, context, params } = args;
-  let { env } = context;
+  let {
+    env,
+    storefront: { i18n }
+  } = context;
   let queries = getRequestQueries(request);
-  let projectId = env?.WEAVERSE_PROJECT_ID;
-  let weaverseHost = env?.WEAVERSE_HOST;
-  if (!projectId || !weaverseHost) {
-    console.log("\u274C Missing `WEAVERSE_PROJECT_ID` or `WEAVERSE_HOST`!");
+  let projectId = queries?.projectId || env?.WEAVERSE_PROJECT_ID;
+  let weaverseHost = env?.WEAVERSE_HOST || "https://weaverse.io";
+  if (!projectId) {
+    console.log("\u274C Missing `projectId`!");
     return null;
   }
   let configs = {
@@ -771,14 +774,13 @@ async function weaverseLoader(args, components) {
     ...queries
   };
   try {
+    let projectAPI = `${weaverseHost}/api/public/project`;
+    let url = request.url;
     let page = await fetchWithServerCache({
-      url: `${weaverseHost}/api/public/project`,
+      url: projectAPI,
       options: {
         method: "POST",
-        body: JSON.stringify({
-          projectId,
-          url: request.url
-        })
+        body: JSON.stringify({ projectId, url, i18n })
       },
       context
     }).then((r2) => r2.json()).catch((err) => {
@@ -821,11 +823,9 @@ async function weaverseLoader(args, components) {
 // src/index.tsx
 export * from "@weaverse/react";
 var WeaverseHydrogenRoot = (props) => {
-  let { components, data } = props;
+  let { components, data, themeSchema } = props;
   let weaverse = createWeaverseHydrogenContext(data, components);
-  useStudio(weaverse);
-  if (!weaverse?.data)
-    return /* @__PURE__ */ React.createElement("div", null, "No Weaverse data!");
+  useStudio(weaverse, themeSchema);
   return /* @__PURE__ */ React.createElement(WeaverseRoot, { context: weaverse });
 };
 export {

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.49",
+  "version": "1.0.50",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -32,10 +32,10 @@
   "name": "@weaverse/hydrogen",
   "author": "Weaverse Team",
   "dependencies": {
-    "@shopify/hydrogen": "2023.4.4",
-    "@weaverse/react": "1.0.49"
+    "@shopify/hydrogen": "2023.4.5",
+    "@weaverse/react": "1.0.50"
   },
   "devDependencies": {
-    "@shopify/remix-oxygen": "^1.1.0"
+    "@shopify/remix-oxygen": "^1.1.1"
   }
 }