@weaverse/hydrogen 1.0.47 → 1.0.49

package/dist/index.d.ts

@@ -1,11 +1,8 @@
 import React, { ForwardRefExoticComponent } from 'react';
 import { LoaderArgs, AppLoadContext } from '@shopify/remix-oxygen';
-import { ElementData, ElementSchema, WeaverseElement, Weaverse, WeaverseItemStore } from '@weaverse/react';
+import { ElementData, ElementSchema, BasicInput, WeaverseElement, Weaverse, WeaverseItemStore } from '@weaverse/react';
 export * from '@weaverse/react';
 
-/**
- * Declare local additions to `AppLoadContext` to include the session utilities we injected in `server.ts`.
- */
 type TODO = any;
 declare module '@shopify/remix-oxygen' {
     interface AppLoadContext {
@@ -34,27 +31,35 @@ interface HydrogenComponentData extends Omit<ElementData, 'childIds' | 'css'> {
     loaderData: unknown;
     data: Record<string, unknown>;
 }
-type ComponentFlags = Partial<Record<'isSection', boolean>>;
-interface HydrogenComponentSchema extends Omit<ElementSchema, 'parentTypes' | 'flags'> {
+type ComponentFlags = Partial<Record<string, boolean>>;
+interface HydrogenComponentSchema extends Omit<ElementSchema, 'parentTypes' | 'flags' | 'inspector'> {
     flags?: ComponentFlags;
     childTypes?: string[];
+    inspector: InspectorGroup[];
+    presets?: Omit<HydrogenComponentPresets, 'type'>;
 }
-interface HydrogenComponentProps<D = unknown, L = unknown> extends WeaverseElement {
-    data: D & {
-        className?: string;
-    };
+interface InspectorGroup {
+    group: string;
+    inputs: BasicInput[];
+}
+interface HydrogenComponentProps<L = unknown> extends WeaverseElement {
+    className?: string;
     loaderData?: L;
     children?: React.JSX.Element[];
 }
-interface WeaverseHydrogen extends Omit<Weaverse, 'itemInstances'> {
+interface WeaverseHydrogen extends Omit<Weaverse, 'itemInstances' | 'elementInstances' | 'registerElement'> {
     itemInstances: Map<string | number, HydrogenComponentInstance>;
+    elementInstances: Map<string, HydrogenElement>;
+    registerElement(element: HydrogenElement): void;
 }
-type HydrogenComponentTemplate = any;
+type HydrogenComponentPresets = {
+    type: string;
+    children?: HydrogenComponentPresets[];
+};
 interface HydrogenElement {
-    Component: ForwardRefExoticComponent<any>;
+    Component: ForwardRefExoticComponent<HydrogenComponentProps>;
     type: string;
     schema?: HydrogenComponentSchema;
-    template?: HydrogenComponentTemplate;
 }
 interface HydrogenComponentInstance extends Omit<WeaverseItemStore, '_flags' | 'data' | 'Element'> {
     get _element(): HTMLElement | null;
@@ -78,6 +83,13 @@ interface HydrogenPageData {
     page: any;
     configs: HydrogenPageConfigs;
 }
+interface WeaverseHydrogenRootProps {
+    components: Record<string, HydrogenComponent>;
+    data: {
+        weaverseData?: HydrogenPageData;
+        [key: string]: any;
+    };
+}
 
 /**
  * Fetch with server cache requires a storefront.cache instance which is Cloudflare Cache and a waitUntil function, otherwise it will just fetch the url.
@@ -90,13 +102,6 @@ declare let fetchWithServerCache: ({ url, options, context, }: {
 
 declare function weaverseLoader(args: LoaderArgs, components: Record<string, HydrogenComponent>): Promise<HydrogenPageData | null>;
 
-interface WeaverseHydrogenRootProps {
-    components: Record<string, HydrogenComponent>;
-    data: {
-        weaverseData: HydrogenPageData;
-        [key: string]: any;
-    };
-}
 declare let WeaverseHydrogenRoot: (props: WeaverseHydrogenRootProps) => React.JSX.Element;
 
-export { ComponentFlags, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentProps, HydrogenComponentSchema, HydrogenComponentTemplate, HydrogenElement, HydrogenPageConfigs, HydrogenPageData, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseLoaderArgs, fetchWithServerCache, weaverseLoader };
+export { ComponentFlags, HydrogenComponent, HydrogenComponentData, HydrogenComponentInstance, HydrogenComponentPresets, HydrogenComponentProps, HydrogenComponentSchema, HydrogenElement, HydrogenPageConfigs, HydrogenPageData, InspectorGroup, TODO, WeaverseHydrogen, WeaverseHydrogenRoot, WeaverseHydrogenRootProps, WeaverseLoaderArgs, fetchWithServerCache, weaverseLoader };

package/dist/index.js

@@ -41,15 +41,18 @@ var import_react4 = __toESM(require("react"));
 
 // src/context.ts
 var import_react = require("@weaverse/react");
+function createRootContext(init) {
+  return new import_react.Weaverse(init);
+}
 function createCachedContext(init) {
   if (import_react.isBrowser && init.pageId) {
     window.__weaverses = window.__weaverses || {};
     if (!window.__weaverses[init.pageId]) {
-      window.__weaverses[init.pageId] = (0, import_react.createRootContext)(init);
+      window.__weaverses[init.pageId] = createRootContext(init);
     }
     return window.__weaverses[init.pageId];
   }
-  return (0, import_react.createRootContext)(init);
+  return createRootContext(init);
 }
 function createWeaverseHydrogenContext({ weaverseData }, components) {
   let { page = {}, configs = {} } = weaverseData || {};
@@ -64,10 +67,7 @@ function createWeaverseHydrogenContext({ weaverseData }, components) {
     weaverse.registerElement({
       type: component?.schema?.type || key,
       Component: component?.default,
-      // @ts-ignore
-      schema: component?.schema,
-      // @ts-ignore
-      template: component?.template
+      schema: component?.schema
     });
   });
   return weaverse;
@@ -549,15 +549,10 @@ var WeaverseItemStore = class {
   constructor(itemData, weaverse) {
     this.listeners = /* @__PURE__ */ new Set();
     this.ref = { current: null };
-    this.platformType = "shopify-section";
     this.stitchesClass = "";
     this._store = { id: "", type: "" };
     this.setData = (update) => {
-      if (this.platformType === "shopify-hydrogen") {
-        this.data = update;
-      } else {
-        this.data = Object.assign(this.data, update);
-      }
+      this.data = Object.assign(this.data, update);
       this.triggerUpdate();
       return this.data;
     };
@@ -574,10 +569,14 @@ var WeaverseItemStore = class {
     };
     let { type, id } = itemData;
     this.weaverse = weaverse;
-    this.platformType = weaverse.platformType;
     if (id && type) {
       weaverse.itemInstances.set(id, this);
-      this._store = { ...itemData };
+      if (weaverse.platformType === "shopify-hydrogen") {
+        let { data, ...rest } = itemData;
+        this._store = { ...data, ...rest };
+      } else {
+        this._store = { ...itemData };
+      }
     }
   }
   get _id() {
@@ -593,33 +592,18 @@ var WeaverseItemStore = class {
     return this.weaverse.elementInstances.get(this._store.type);
   }
   set data(update) {
-    if (this.platformType === "shopify-hydrogen") {
-      let { children, ...rest } = update;
-      if (children) {
-        this._store.children = children;
-      }
-      this._store.data = merge(this._store.data, rest);
-    } else {
-      this._store = { ...this.data, ...update };
-    }
+    this._store = { ...this.data, ...update };
   }
   get data() {
     let defaultProps = { ...this.Element?.Component?.defaultProps };
-    if (this.platformType === "shopify-hydrogen") {
-      return {
-        ...this._store,
-        data: { ...defaultProps?.data, ...this._store.data }
-      };
-    } else {
-      let defaultCss = this.Element?.defaultCss || {};
-      let currentCss = this._store.css || {};
-      let css = merge(defaultCss, currentCss);
-      let extraData = this.Element?.extraData;
-      return { ...defaultProps, ...extraData, ...this._store, css };
-    }
+    let defaultCss = this.Element?.defaultCss || {};
+    let currentCss = this._store.css || {};
+    let css = merge(defaultCss, currentCss);
+    let extraData = this.Element?.extraData;
+    return { ...defaultProps, ...extraData, ...this._store, css };
   }
 };
-var Weaverse = class {
+var Weaverse2 = class {
   /**
    * constructor
    * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
@@ -634,7 +618,7 @@ var Weaverse = class {
   constructor(params = {}) {
     this.elementInstances = /* @__PURE__ */ new Map();
     this.itemInstances = /* @__PURE__ */ new Map();
-    this.weaverseHost = "https://studio.weaverse.io";
+    this.weaverseHost = "https://weaverse.io";
     this.weaverseVersion = "";
     this.projectId = "";
     this.pageId = "";
@@ -715,13 +699,13 @@ var Weaverse = class {
     if (data?.items) {
       data.items.forEach((item) => {
         if (!this.itemInstances.get(item.id)) {
-          new WeaverseItemStore(item, this);
+          return new WeaverseItemStore(item, this);
         }
       });
     }
   }
 };
-Weaverse.WeaverseItemStore = WeaverseItemStore;
+Weaverse2.WeaverseItemStore = WeaverseItemStore;
 
 // src/hooks/use-studio.ts
 var import_react2 = require("react");

package/dist/index.mjs

@@ -3,7 +3,10 @@ import { WeaverseRoot } from "@weaverse/react";
 import React from "react";
 
 // src/context.ts
-import { createRootContext, isBrowser } from "@weaverse/react";
+import { Weaverse, isBrowser } from "@weaverse/react";
+function createRootContext(init) {
+  return new Weaverse(init);
+}
 function createCachedContext(init) {
   if (isBrowser && init.pageId) {
     window.__weaverses = window.__weaverses || {};
@@ -27,10 +30,7 @@ function createWeaverseHydrogenContext({ weaverseData }, components) {
     weaverse.registerElement({
       type: component?.schema?.type || key,
       Component: component?.default,
-      // @ts-ignore
-      schema: component?.schema,
-      // @ts-ignore
-      template: component?.template
+      schema: component?.schema
     });
   });
   return weaverse;
@@ -512,15 +512,10 @@ var WeaverseItemStore = class {
   constructor(itemData, weaverse) {
     this.listeners = /* @__PURE__ */ new Set();
     this.ref = { current: null };
-    this.platformType = "shopify-section";
     this.stitchesClass = "";
     this._store = { id: "", type: "" };
     this.setData = (update) => {
-      if (this.platformType === "shopify-hydrogen") {
-        this.data = update;
-      } else {
-        this.data = Object.assign(this.data, update);
-      }
+      this.data = Object.assign(this.data, update);
       this.triggerUpdate();
       return this.data;
     };
@@ -537,10 +532,14 @@ var WeaverseItemStore = class {
     };
     let { type, id } = itemData;
     this.weaverse = weaverse;
-    this.platformType = weaverse.platformType;
     if (id && type) {
       weaverse.itemInstances.set(id, this);
-      this._store = { ...itemData };
+      if (weaverse.platformType === "shopify-hydrogen") {
+        let { data, ...rest } = itemData;
+        this._store = { ...data, ...rest };
+      } else {
+        this._store = { ...itemData };
+      }
     }
   }
   get _id() {
@@ -556,33 +555,18 @@ var WeaverseItemStore = class {
     return this.weaverse.elementInstances.get(this._store.type);
   }
   set data(update) {
-    if (this.platformType === "shopify-hydrogen") {
-      let { children, ...rest } = update;
-      if (children) {
-        this._store.children = children;
-      }
-      this._store.data = merge(this._store.data, rest);
-    } else {
-      this._store = { ...this.data, ...update };
-    }
+    this._store = { ...this.data, ...update };
   }
   get data() {
     let defaultProps = { ...this.Element?.Component?.defaultProps };
-    if (this.platformType === "shopify-hydrogen") {
-      return {
-        ...this._store,
-        data: { ...defaultProps?.data, ...this._store.data }
-      };
-    } else {
-      let defaultCss = this.Element?.defaultCss || {};
-      let currentCss = this._store.css || {};
-      let css = merge(defaultCss, currentCss);
-      let extraData = this.Element?.extraData;
-      return { ...defaultProps, ...extraData, ...this._store, css };
-    }
+    let defaultCss = this.Element?.defaultCss || {};
+    let currentCss = this._store.css || {};
+    let css = merge(defaultCss, currentCss);
+    let extraData = this.Element?.extraData;
+    return { ...defaultProps, ...extraData, ...this._store, css };
   }
 };
-var Weaverse = class {
+var Weaverse2 = class {
   /**
    * constructor
    * @param weaverseHost {string} Weaverse base URL that can provide by user/developer. for local development, use localhost:3000
@@ -597,7 +581,7 @@ var Weaverse = class {
   constructor(params = {}) {
     this.elementInstances = /* @__PURE__ */ new Map();
     this.itemInstances = /* @__PURE__ */ new Map();
-    this.weaverseHost = "https://studio.weaverse.io";
+    this.weaverseHost = "https://weaverse.io";
     this.weaverseVersion = "";
     this.projectId = "";
     this.pageId = "";
@@ -678,13 +662,13 @@ var Weaverse = class {
     if (data?.items) {
       data.items.forEach((item) => {
         if (!this.itemInstances.get(item.id)) {
-          new WeaverseItemStore(item, this);
+          return new WeaverseItemStore(item, this);
         }
       });
     }
   }
 };
-Weaverse.WeaverseItemStore = WeaverseItemStore;
+Weaverse2.WeaverseItemStore = WeaverseItemStore;
 
 // src/hooks/use-studio.ts
 import { useEffect } from "react";

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "1.0.47",
+  "version": "1.0.49",
   "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.3",
-    "@weaverse/react": "1.0.47"
+    "@shopify/hydrogen": "2023.4.4",
+    "@weaverse/react": "1.0.49"
   },
   "devDependencies": {
-    "@shopify/remix-oxygen": "^1.0.7"
+    "@shopify/remix-oxygen": "^1.1.0"
   }
 }