@weaverse/hydrogen 1.1.4 → 1.1.6

package/dist/index.d.mts

@@ -175,17 +175,8 @@ type HydrogenPageData = {
 type RelativeRoutingType = 'route' | 'path';
 type To = string | Partial<Path>;
 type Path = {
-    /**
-     * A URL pathname, beginning with a /.
-     */
     pathname: string;
-    /**
-     * A URL search string, beginning with a ?.
-     */
     search: string;
-    /**
-     * A URL fragment identifier, beginning with a #.
-     */
     hash: string;
 };
 type NavigateOptions = {
@@ -197,6 +188,8 @@ type NavigateOptions = {
 type NavigateFunction = (to: To, options?: NavigateOptions) => void;
 interface WeaverseHydrogenRootProps {
     components: HydrogenComponent[];
+    countries: Localizations;
+    themeSchema: HydrogenThemeSchema;
     errorComponent: React.FC<{
         error: {
             message: string;
@@ -228,12 +221,12 @@ type FetchProjectRequestBody = {
     countries: Localizations;
     i18n?: I18nLocale;
     loaderConfigs?: WeaverseLoaderConfigs;
+    isDesignMode?: boolean;
 };
 declare global {
     interface Window {
         __weaverse: WeaverseHydrogen;
         __weaverses: WeaverseHydrogen[];
-        __weaverseThemeConfigs: WeaverseThemeConfigs;
     }
 }
 
@@ -249,20 +242,12 @@ declare function fetchWithServerCache(params: FetchWithServerCacheParams): Promi
 
 declare function weaverseLoader(args: LoaderArgs, components: HydrogenComponent[], countries: Localizations, loaderConfigs?: WeaverseLoaderConfigs): Promise<WeaverseLoaderData | null>;
 
-declare function WeaverseStudio(): React.JSX.Element | null;
-
 declare function getRequestQueries<T = Record<string, string | boolean>>(request: Request): T;
-/**
- * Check if the request is from Weaverse Studio.
- * @param request Request
- * @returns boolean
- */
-declare function studioCheck(request: Request): boolean;
 
 declare function getSelectedProductOptions(request: Request): _shopify_hydrogen_react_storefront_api_types.SelectedOptionInput[];
 
 declare function useThemeSettings(): (Record<string, any> | ((newSettings: any) => void))[];
 
-declare function WeaverseHydrogenRoot({ components, errorComponent: ErrorComponent, }: WeaverseHydrogenRootProps): React.JSX.Element;
+declare function WeaverseHydrogenRoot({ errorComponent: ErrorComponent, ...themeConfigs }: WeaverseHydrogenRootProps): React.JSX.Element;
 
-export { FetchProjectRequestBody, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageAssignment, HydrogenPageConfigs, HydrogenPageData, HydrogenProjectConfig, HydrogenProjectType, HydrogenThemeInfo, HydrogenThemeSchema, HydrogenToolbarAction, I18nLocale, InspectorGroup, Locale, Localizations, NavigateFunction, PageType, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseInternal, WeaverseLoaderArgs, WeaverseLoaderConfigs, WeaverseLoaderData, WeaverseLoaderRequestInfo, WeaverseStorefrontData, WeaverseStudio, WeaverseThemeConfigs, fetchWithServerCache, getRequestQueries, getSelectedProductOptions, studioCheck, useThemeSettings, weaverseLoader };
+export { FetchProjectRequestBody, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageAssignment, HydrogenPageConfigs, HydrogenPageData, HydrogenProjectConfig, HydrogenProjectType, HydrogenThemeInfo, HydrogenThemeSchema, HydrogenToolbarAction, I18nLocale, InspectorGroup, Locale, Localizations, NavigateFunction, PageType, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseInternal, WeaverseLoaderArgs, WeaverseLoaderConfigs, WeaverseLoaderData, WeaverseLoaderRequestInfo, WeaverseStorefrontData, WeaverseThemeConfigs, fetchWithServerCache, getRequestQueries, getSelectedProductOptions, useThemeSettings, weaverseLoader };

package/dist/index.d.ts

@@ -175,17 +175,8 @@ type HydrogenPageData = {
 type RelativeRoutingType = 'route' | 'path';
 type To = string | Partial<Path>;
 type Path = {
-    /**
-     * A URL pathname, beginning with a /.
-     */
     pathname: string;
-    /**
-     * A URL search string, beginning with a ?.
-     */
     search: string;
-    /**
-     * A URL fragment identifier, beginning with a #.
-     */
     hash: string;
 };
 type NavigateOptions = {
@@ -197,6 +188,8 @@ type NavigateOptions = {
 type NavigateFunction = (to: To, options?: NavigateOptions) => void;
 interface WeaverseHydrogenRootProps {
     components: HydrogenComponent[];
+    countries: Localizations;
+    themeSchema: HydrogenThemeSchema;
     errorComponent: React.FC<{
         error: {
             message: string;
@@ -228,12 +221,12 @@ type FetchProjectRequestBody = {
     countries: Localizations;
     i18n?: I18nLocale;
     loaderConfigs?: WeaverseLoaderConfigs;
+    isDesignMode?: boolean;
 };
 declare global {
     interface Window {
         __weaverse: WeaverseHydrogen;
         __weaverses: WeaverseHydrogen[];
-        __weaverseThemeConfigs: WeaverseThemeConfigs;
     }
 }
 
@@ -249,20 +242,12 @@ declare function fetchWithServerCache(params: FetchWithServerCacheParams): Promi
 
 declare function weaverseLoader(args: LoaderArgs, components: HydrogenComponent[], countries: Localizations, loaderConfigs?: WeaverseLoaderConfigs): Promise<WeaverseLoaderData | null>;
 
-declare function WeaverseStudio(): React.JSX.Element | null;
-
 declare function getRequestQueries<T = Record<string, string | boolean>>(request: Request): T;
-/**
- * Check if the request is from Weaverse Studio.
- * @param request Request
- * @returns boolean
- */
-declare function studioCheck(request: Request): boolean;
 
 declare function getSelectedProductOptions(request: Request): _shopify_hydrogen_react_storefront_api_types.SelectedOptionInput[];
 
 declare function useThemeSettings(): (Record<string, any> | ((newSettings: any) => void))[];
 
-declare function WeaverseHydrogenRoot({ components, errorComponent: ErrorComponent, }: WeaverseHydrogenRootProps): React.JSX.Element;
+declare function WeaverseHydrogenRoot({ errorComponent: ErrorComponent, ...themeConfigs }: WeaverseHydrogenRootProps): React.JSX.Element;
 
-export { FetchProjectRequestBody, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageAssignment, HydrogenPageConfigs, HydrogenPageData, HydrogenProjectConfig, HydrogenProjectType, HydrogenThemeInfo, HydrogenThemeSchema, HydrogenToolbarAction, I18nLocale, InspectorGroup, Locale, Localizations, NavigateFunction, PageType, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseInternal, WeaverseLoaderArgs, WeaverseLoaderConfigs, WeaverseLoaderData, WeaverseLoaderRequestInfo, WeaverseStorefrontData, WeaverseStudio, WeaverseThemeConfigs, fetchWithServerCache, getRequestQueries, getSelectedProductOptions, studioCheck, useThemeSettings, weaverseLoader };
+export { FetchProjectRequestBody, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageAssignment, HydrogenPageConfigs, HydrogenPageData, HydrogenProjectConfig, HydrogenProjectType, HydrogenThemeInfo, HydrogenThemeSchema, HydrogenToolbarAction, I18nLocale, InspectorGroup, Locale, Localizations, NavigateFunction, PageType, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseInternal, WeaverseLoaderArgs, WeaverseLoaderConfigs, WeaverseLoaderData, WeaverseLoaderRequestInfo, WeaverseStorefrontData, WeaverseThemeConfigs, fetchWithServerCache, getRequestQueries, getSelectedProductOptions, useThemeSettings, weaverseLoader };

package/dist/index.js

@@ -32,18 +32,16 @@ var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: tru
 var src_exports = {};
 __export(src_exports, {
   WeaverseHydrogenRoot: () => WeaverseHydrogenRoot,
-  WeaverseStudio: () => WeaverseStudio,
   fetchWithServerCache: () => fetchWithServerCache,
   getRequestQueries: () => getRequestQueries,
   getSelectedProductOptions: () => getSelectedProductOptions,
-  studioCheck: () => studioCheck,
   useThemeSettings: () => useThemeSettings,
   weaverseLoader: () => weaverseLoader
 });
 module.exports = __toCommonJS(src_exports);
-var import_react8 = require("@remix-run/react");
-var import_react9 = require("@weaverse/react");
-var import_react10 = __toESM(require("react"));
+var import_react6 = require("@remix-run/react");
+var import_react7 = require("@weaverse/react");
+var import_react8 = __toESM(require("react"));
 var import_react_error_boundary = require("react-error-boundary");
 
 // src/context.ts
@@ -58,6 +56,8 @@ function createCachedWeaverseInstance(init) {
     if (!weaverse) {
       weaverse = new import_react.Weaverse(init);
       window.__weaverses.push(weaverse);
+    } else {
+      weaverse.setProjectData(init.data);
     }
     return weaverse;
   }
@@ -72,10 +72,9 @@ function createWeaverseInstance(weaverseData, components) {
     ...configs,
     data: page || {},
     pageId: page?.id,
-    platformType: "shopify-hydrogen"
+    platformType: "shopify-hydrogen",
+    internal: { project, pageAssignment }
   });
-  weaverse.internal.project = project;
-  weaverse.internal.pageAssignment = pageAssignment;
   components.forEach((comp) => {
     weaverse.registerElement({
       type: comp?.schema?.type,
@@ -90,22 +89,29 @@ function createWeaverseInstance(weaverseData, components) {
 var import_react2 = require("@remix-run/react");
 var import_react3 = require("@weaverse/react");
 var import_react4 = require("react");
-function useStudio(weaverse) {
+function useStudio(weaverse, countries, schema) {
   let navigate = (0, import_react2.useNavigate)();
   let revalidator = (0, import_react2.useRevalidator)();
+  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
+  let isStudio = import_react3.isIframe && isDesignMode && weaverseHost && weaverseVersion;
   (0, import_react4.useEffect)(() => {
-    if (import_react3.isIframe && weaverse.isDesignMode) {
+    if (isStudio) {
       weaverse.internal = {
         ...weaverse.internal,
         navigate,
-        revalidator
+        revalidator,
+        themeConfigs: { schema, countries }
       };
       window.__weaverse = weaverse;
       if (window.weaverseStudio) {
         window.weaverseStudio.init(weaverse);
+      } else {
+        (0, import_react3.loadScript)(
+          `${weaverseHost}/assets/studio/hydrogen/index.js?v=${weaverseVersion}`
+        );
       }
     }
-  }, [weaverse]);
+  }, [weaverse, revalidator]);
 }
 
 // src/index.tsx
@@ -138,13 +144,6 @@ function getRequestQueries(request) {
     {}
   );
 }
-function studioCheck(request) {
-  let queries = getRequestQueries(request);
-  let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion } = queries;
-  return Boolean(
-    isDesignMode && weaverseProjectId && weaverseHost && weaverseVersion
-  );
-}
 
 // src/loader.ts
 async function weaverseLoader(args, components, countries, loaderConfigs) {
@@ -153,7 +152,7 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       let { request, context, params } = args;
       let queries = getRequestQueries(request);
       let { WEAVERSE_PROJECT_ID, WEAVERSE_HOST } = context?.env || {};
-      let { weaverseProjectId, weaverseHost } = queries;
+      let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion } = queries;
       let projectId = weaverseProjectId || WEAVERSE_PROJECT_ID;
       weaverseHost = weaverseHost || WEAVERSE_HOST || "https://weaverse.io";
       if (!projectId) {
@@ -163,17 +162,27 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       }
       let i18n = context?.storefront?.i18n;
       let reqBody = {
+        isDesignMode,
         i18n,
         countries,
         projectId,
         loaderConfigs,
         url: request.url
       };
-      let payload = await fetchWithServerCache({
-        url: `${weaverseHost}/api/public/project`,
-        options: { method: "POST", body: JSON.stringify(reqBody) },
-        context
-      });
+      let url = `${weaverseHost}/api/public/project`;
+      let payload;
+      if (isDesignMode) {
+        payload = await fetch(url, {
+          method: "POST",
+          body: JSON.stringify(reqBody)
+        }).then((res) => res.json());
+      } else {
+        payload = await fetchWithServerCache({
+          url,
+          options: { method: "POST", body: JSON.stringify(reqBody) },
+          context
+        });
+      }
       let { page, project, pageAssignment } = payload;
       if (!page || !project || !pageAssignment) {
         throw new Error(
@@ -184,8 +193,8 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       let configs = {
         projectId,
         weaverseHost,
-        weaverseVersion: queries.weaverseVersion,
-        isDesignMode: queries.isDesignMode,
+        weaverseVersion,
+        isDesignMode,
         requestInfo: {
           i18n,
           params,
@@ -230,40 +239,6 @@ async function withLoaderData(items, components, configs, args) {
   );
 }
 
-// src/studio.tsx
-var import_react5 = require("@remix-run/react");
-var import_react6 = __toESM(require("react"));
-function WeaverseStudio() {
-  let { search } = (0, import_react5.useLocation)();
-  let { weaverseThemeConfigs } = (0, import_react5.useLoaderData)();
-  if (weaverseThemeConfigs instanceof Promise) {
-    let params = new URLSearchParams(search);
-    let weaverseHost = params.get("weaverseHost");
-    let weaverseVersion = params.get("weaverseVersion");
-    return /* @__PURE__ */ import_react6.default.createElement(import_react6.Suspense, null, /* @__PURE__ */ import_react6.default.createElement(import_react5.Await, { resolve: weaverseThemeConfigs }, (configs) => {
-      if (!configs)
-        return null;
-      return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
-        "script",
-        {
-          src: `${weaverseHost}/assets/studio/hydrogen/index.js?v=${weaverseVersion}`,
-          async: true
-        }
-      ), /* @__PURE__ */ import_react6.default.createElement(
-        "script",
-        {
-          dangerouslySetInnerHTML: {
-            __html: `window.__weaverseThemeConfigs = ${JSON.stringify(
-              configs
-            )}`
-          }
-        }
-      ));
-    }));
-  }
-  return null;
-}
-
 // src/hydrogen-wrappers.ts
 var import_hydrogen2 = require("@shopify/hydrogen");
 function getSelectedProductOptions(request) {
@@ -274,9 +249,9 @@ function getSelectedProductOptions(request) {
 }
 
 // src/hooks/use-theme-settings.ts
-var import_react7 = require("@weaverse/react");
+var import_react5 = require("@weaverse/react");
 function useThemeSettings() {
-  let weaverse = (0, import_react7.useWeaverse)();
+  let weaverse = (0, import_react5.useWeaverse)();
   let settings = weaverse?.internal?.project?.config?.theme;
   let updateSettings = (newSettings) => {
     weaverse.internal.project.config.theme = Object.assign(
@@ -291,32 +266,26 @@ function useThemeSettings() {
 
 // src/index.tsx
 function WeaverseHydrogenRoot({
-  components,
-  errorComponent: ErrorComponent
+  errorComponent: ErrorComponent,
+  ...themeConfigs
 }) {
-  let data = (0, import_react8.useLoaderData)();
-  let weaverseDataFromLoader = data?.weaverseData;
-  if (weaverseDataFromLoader) {
-    if (weaverseDataFromLoader instanceof Promise) {
-      return /* @__PURE__ */ import_react10.default.createElement(import_react_error_boundary.ErrorBoundary, { fallbackRender: ErrorComponent }, /* @__PURE__ */ import_react10.default.createElement(import_react10.Suspense, null, /* @__PURE__ */ import_react10.default.createElement(import_react8.Await, { resolve: weaverseDataFromLoader }, (resolvedData) => {
-        return /* @__PURE__ */ import_react10.default.createElement(
+  let data = (0, import_react6.useLoaderData)();
+  let weaverseData = data?.weaverseData;
+  if (weaverseData) {
+    if (weaverseData instanceof Promise) {
+      return /* @__PURE__ */ import_react8.default.createElement(import_react_error_boundary.ErrorBoundary, { fallbackRender: ErrorComponent }, /* @__PURE__ */ import_react8.default.createElement(import_react8.Suspense, null, /* @__PURE__ */ import_react8.default.createElement(import_react6.Await, { resolve: weaverseData }, (resolvedData) => {
+        return /* @__PURE__ */ import_react8.default.createElement(
           RenderWeaverseRoot,
           {
             weaverseData: resolvedData,
-            components
+            ...themeConfigs
           }
         );
       })));
     }
-    return /* @__PURE__ */ import_react10.default.createElement(
-      RenderWeaverseRoot,
-      {
-        weaverseData: weaverseDataFromLoader,
-        components
-      }
-    );
+    return /* @__PURE__ */ import_react8.default.createElement(RenderWeaverseRoot, { weaverseData, ...themeConfigs });
   }
-  return /* @__PURE__ */ import_react10.default.createElement(
+  return /* @__PURE__ */ import_react8.default.createElement(
     ErrorComponent,
     {
       error: { message: "No Weaverse data return from route loader!" }
@@ -324,19 +293,17 @@ function WeaverseHydrogenRoot({
   );
 }
 function RenderWeaverseRoot(props) {
-  let { components, weaverseData } = props;
+  let { weaverseData, components, countries, themeSchema } = props;
   let weaverse = createWeaverseInstance(weaverseData, components);
-  useStudio(weaverse);
-  return /* @__PURE__ */ import_react10.default.createElement(import_react9.WeaverseRoot, { context: weaverse });
+  useStudio(weaverse, countries, themeSchema);
+  return /* @__PURE__ */ import_react8.default.createElement(import_react7.WeaverseRoot, { context: weaverse });
 }
 // Annotate the CommonJS export names for ESM import in node:
 0 && (module.exports = {
   WeaverseHydrogenRoot,
-  WeaverseStudio,
   fetchWithServerCache,
   getRequestQueries,
   getSelectedProductOptions,
-  studioCheck,
   useThemeSettings,
   weaverseLoader,
   ...require("@weaverse/react")

package/dist/index.mjs

@@ -1,7 +1,7 @@
 // src/index.tsx
-import { Await as Await2, useLoaderData as useLoaderData2 } from "@remix-run/react";
+import { Await, useLoaderData } from "@remix-run/react";
 import { WeaverseRoot } from "@weaverse/react";
-import React2, { Suspense as Suspense2 } from "react";
+import React, { Suspense } from "react";
 import { ErrorBoundary } from "react-error-boundary";
 
 // src/context.ts
@@ -16,6 +16,8 @@ function createCachedWeaverseInstance(init) {
     if (!weaverse) {
       weaverse = new Weaverse(init);
       window.__weaverses.push(weaverse);
+    } else {
+      weaverse.setProjectData(init.data);
     }
     return weaverse;
   }
@@ -30,10 +32,9 @@ function createWeaverseInstance(weaverseData, components) {
     ...configs,
     data: page || {},
     pageId: page?.id,
-    platformType: "shopify-hydrogen"
+    platformType: "shopify-hydrogen",
+    internal: { project, pageAssignment }
   });
-  weaverse.internal.project = project;
-  weaverse.internal.pageAssignment = pageAssignment;
   components.forEach((comp) => {
     weaverse.registerElement({
       type: comp?.schema?.type,
@@ -46,24 +47,31 @@ function createWeaverseInstance(weaverseData, components) {
 
 // src/hooks/use-studio.ts
 import { useNavigate, useRevalidator } from "@remix-run/react";
-import { isIframe } from "@weaverse/react";
+import { isIframe, loadScript } from "@weaverse/react";
 import { useEffect } from "react";
-function useStudio(weaverse) {
+function useStudio(weaverse, countries, schema) {
   let navigate = useNavigate();
   let revalidator = useRevalidator();
+  let { isDesignMode, weaverseHost, weaverseVersion } = weaverse;
+  let isStudio = isIframe && isDesignMode && weaverseHost && weaverseVersion;
   useEffect(() => {
-    if (isIframe && weaverse.isDesignMode) {
+    if (isStudio) {
       weaverse.internal = {
         ...weaverse.internal,
         navigate,
-        revalidator
+        revalidator,
+        themeConfigs: { schema, countries }
       };
       window.__weaverse = weaverse;
       if (window.weaverseStudio) {
         window.weaverseStudio.init(weaverse);
+      } else {
+        loadScript(
+          `${weaverseHost}/assets/studio/hydrogen/index.js?v=${weaverseVersion}`
+        );
       }
     }
-  }, [weaverse]);
+  }, [weaverse, revalidator]);
 }
 
 // src/index.tsx
@@ -96,13 +104,6 @@ function getRequestQueries(request) {
     {}
   );
 }
-function studioCheck(request) {
-  let queries = getRequestQueries(request);
-  let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion } = queries;
-  return Boolean(
-    isDesignMode && weaverseProjectId && weaverseHost && weaverseVersion
-  );
-}
 
 // src/loader.ts
 async function weaverseLoader(args, components, countries, loaderConfigs) {
@@ -111,7 +112,7 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       let { request, context, params } = args;
       let queries = getRequestQueries(request);
       let { WEAVERSE_PROJECT_ID, WEAVERSE_HOST } = context?.env || {};
-      let { weaverseProjectId, weaverseHost } = queries;
+      let { weaverseProjectId, weaverseHost, isDesignMode, weaverseVersion } = queries;
       let projectId = weaverseProjectId || WEAVERSE_PROJECT_ID;
       weaverseHost = weaverseHost || WEAVERSE_HOST || "https://weaverse.io";
       if (!projectId) {
@@ -121,17 +122,27 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       }
       let i18n = context?.storefront?.i18n;
       let reqBody = {
+        isDesignMode,
         i18n,
         countries,
         projectId,
         loaderConfigs,
         url: request.url
       };
-      let payload = await fetchWithServerCache({
-        url: `${weaverseHost}/api/public/project`,
-        options: { method: "POST", body: JSON.stringify(reqBody) },
-        context
-      });
+      let url = `${weaverseHost}/api/public/project`;
+      let payload;
+      if (isDesignMode) {
+        payload = await fetch(url, {
+          method: "POST",
+          body: JSON.stringify(reqBody)
+        }).then((res) => res.json());
+      } else {
+        payload = await fetchWithServerCache({
+          url,
+          options: { method: "POST", body: JSON.stringify(reqBody) },
+          context
+        });
+      }
       let { page, project, pageAssignment } = payload;
       if (!page || !project || !pageAssignment) {
         throw new Error(
@@ -142,8 +153,8 @@ async function weaverseLoader(args, components, countries, loaderConfigs) {
       let configs = {
         projectId,
         weaverseHost,
-        weaverseVersion: queries.weaverseVersion,
-        isDesignMode: queries.isDesignMode,
+        weaverseVersion,
+        isDesignMode,
         requestInfo: {
           i18n,
           params,
@@ -188,40 +199,6 @@ async function withLoaderData(items, components, configs, args) {
   );
 }
 
-// src/studio.tsx
-import { Await, useLoaderData, useLocation } from "@remix-run/react";
-import React, { Suspense } from "react";
-function WeaverseStudio() {
-  let { search } = useLocation();
-  let { weaverseThemeConfigs } = useLoaderData();
-  if (weaverseThemeConfigs instanceof Promise) {
-    let params = new URLSearchParams(search);
-    let weaverseHost = params.get("weaverseHost");
-    let weaverseVersion = params.get("weaverseVersion");
-    return /* @__PURE__ */ React.createElement(Suspense, null, /* @__PURE__ */ React.createElement(Await, { resolve: weaverseThemeConfigs }, (configs) => {
-      if (!configs)
-        return null;
-      return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-        "script",
-        {
-          src: `${weaverseHost}/assets/studio/hydrogen/index.js?v=${weaverseVersion}`,
-          async: true
-        }
-      ), /* @__PURE__ */ React.createElement(
-        "script",
-        {
-          dangerouslySetInnerHTML: {
-            __html: `window.__weaverseThemeConfigs = ${JSON.stringify(
-              configs
-            )}`
-          }
-        }
-      ));
-    }));
-  }
-  return null;
-}
-
 // src/hydrogen-wrappers.ts
 import { getSelectedProductOptions as hydrogen_getSelectedProductOptions } from "@shopify/hydrogen";
 function getSelectedProductOptions(request) {
@@ -249,32 +226,26 @@ function useThemeSettings() {
 
 // src/index.tsx
 function WeaverseHydrogenRoot({
-  components,
-  errorComponent: ErrorComponent
+  errorComponent: ErrorComponent,
+  ...themeConfigs
 }) {
-  let data = useLoaderData2();
-  let weaverseDataFromLoader = data?.weaverseData;
-  if (weaverseDataFromLoader) {
-    if (weaverseDataFromLoader instanceof Promise) {
-      return /* @__PURE__ */ React2.createElement(ErrorBoundary, { fallbackRender: ErrorComponent }, /* @__PURE__ */ React2.createElement(Suspense2, null, /* @__PURE__ */ React2.createElement(Await2, { resolve: weaverseDataFromLoader }, (resolvedData) => {
-        return /* @__PURE__ */ React2.createElement(
+  let data = useLoaderData();
+  let weaverseData = data?.weaverseData;
+  if (weaverseData) {
+    if (weaverseData instanceof Promise) {
+      return /* @__PURE__ */ React.createElement(ErrorBoundary, { fallbackRender: ErrorComponent }, /* @__PURE__ */ React.createElement(Suspense, null, /* @__PURE__ */ React.createElement(Await, { resolve: weaverseData }, (resolvedData) => {
+        return /* @__PURE__ */ React.createElement(
           RenderWeaverseRoot,
           {
             weaverseData: resolvedData,
-            components
+            ...themeConfigs
           }
         );
       })));
     }
-    return /* @__PURE__ */ React2.createElement(
-      RenderWeaverseRoot,
-      {
-        weaverseData: weaverseDataFromLoader,
-        components
-      }
-    );
+    return /* @__PURE__ */ React.createElement(RenderWeaverseRoot, { weaverseData, ...themeConfigs });
   }
-  return /* @__PURE__ */ React2.createElement(
+  return /* @__PURE__ */ React.createElement(
     ErrorComponent,
     {
       error: { message: "No Weaverse data return from route loader!" }
@@ -282,18 +253,16 @@ function WeaverseHydrogenRoot({
   );
 }
 function RenderWeaverseRoot(props) {
-  let { components, weaverseData } = props;
+  let { weaverseData, components, countries, themeSchema } = props;
   let weaverse = createWeaverseInstance(weaverseData, components);
-  useStudio(weaverse);
-  return /* @__PURE__ */ React2.createElement(WeaverseRoot, { context: weaverse });
+  useStudio(weaverse, countries, themeSchema);
+  return /* @__PURE__ */ React.createElement(WeaverseRoot, { context: weaverse });
 }
 export {
   WeaverseHydrogenRoot,
-  WeaverseStudio,
   fetchWithServerCache,
   getRequestQueries,
   getSelectedProductOptions,
-  studioCheck,
   useThemeSettings,
   weaverseLoader
 };

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.1.4",
+  "version": "1.1.6",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -32,12 +32,12 @@
   "name": "@weaverse/hydrogen",
   "author": "Weaverse Team",
   "dependencies": {
-    "@remix-run/react": "1.19.1",
-    "@shopify/hydrogen": "2023.7.1",
-    "@weaverse/react": "1.1.4",
-    "react-error-boundary": "^4.0.10"
+    "@remix-run/react": "1.19.3",
+    "@shopify/hydrogen": "2023.7.2",
+    "@weaverse/react": "1.1.6",
+    "react-error-boundary": "^4.0.11"
   },
   "devDependencies": {
-    "@shopify/remix-oxygen": "^1.1.2"
+    "@shopify/remix-oxygen": "^1.1.3"
   }
-}
+}