@weaverse/react 5.0.0 → 5.2.0

package/dist/index.js

@@ -76,9 +76,7 @@ var useChildInstances = (id) => {
   let {
     data: { children }
   } = currentInstance;
-  return children.map(({ id: id2 }) => {
-    return itemInstances.get(id2);
-  });
+  return children.map(({ id: id2 }) => itemInstances.get(id2)).filter(Boolean);
 };
 
 // src/renderer.tsx

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/context.ts","../src/hooks.ts","../src/renderer.tsx","../src/utils/css.ts"],"sourcesContent":["export * from '@weaverse/core'\nexport * from './context'\nexport * from './hooks'\nexport * from './renderer'\nexport * from './types'\n","import type { Weaverse } from '@weaverse/core'\nimport { createContext } from 'react'\n\nexport let WeaverseContext = createContext<Weaverse>({} as Weaverse)\nexport let WeaverseContextProvider = WeaverseContext.Provider\nexport let WeaverseItemContext = createContext<{\n  id: string\n  parentId: string\n}>({ id: '', parentId: '' })\n","import { Weaverse, type WeaverseItemStore } from '@weaverse/core'\nimport { useContext } from 'react'\nimport { WeaverseContext, WeaverseItemContext } from '~/context'\n\nexport function useWeaverse<T = Weaverse>() {\n  let weaverse = useContext(WeaverseContext)\n  return weaverse as T\n}\n\nexport let useItemInstance = (id?: string) => {\n  let { id: currentId } = useContext(WeaverseItemContext)\n  let instance = Weaverse.itemInstances.get(id || currentId)\n  if (!instance) {\n    console.log(`Item instance ${id} not found`)\n    return null\n  }\n  return instance as WeaverseItemStore\n}\n\nexport let useParentInstance = () => {\n  let { parentId } = useContext(WeaverseItemContext)\n  return useItemInstance(parentId || '')\n}\n\nexport let useChildInstances = (id?: string) => {\n  let currentInstance = useItemInstance(id)\n  if (!currentInstance) return []\n  let { itemInstances } = Weaverse\n\n  let {\n    data: { children },\n  } = currentInstance\n  return children.map(({ id }: { id: string }) => {\n    return itemInstances.get(id)\n  }) as WeaverseItemStore[]\n}\n","import clsx from 'clsx'\nimport * as React from 'react'\nimport { memo, useEffect, useRef } from 'react'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, useWeaverse } from '~/hooks'\n\nlet reactVersion = Number(React.version?.split('.')[0]) || 0\n\n// Create a safe version of useSyncExternalStore that works in both client and server environments\nexport const useSafeExternalStore = (\n  subscribe: any,\n  getSnapshot: any,\n  getServerSnapshot: any = getSnapshot,\n) => {\n  // In server environment or during SSR, just return the snapshot directly\n  if (typeof window === 'undefined') {\n    return getServerSnapshot()\n  }\n\n  // In client environment, use React.useSyncExternalStore if available (React 18+)\n  if (React.useSyncExternalStore) {\n    return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n  }\n\n  // Fallback for older React versions - just return the current snapshot\n  return getSnapshot()\n}\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n  let data = useSafeExternalStore(\n    context.subscribe,\n    context.getSnapShot,\n    context.getSnapShot,\n  )\n  let rootRef = useRef<HTMLElement>(null)\n\n  useEffect(() => {\n    context.contentRootElement = rootRef.current\n  }, [context])\n\n  let eventHandlers = context?.studioBridge?.eventHandlers || {}\n  let themeClass = context.stitchesInstance.theme.className\n\n  if (context.projectId) {\n    return (\n      <div\n        className={`weaverse-content-root ${themeClass}`}\n        {...eventHandlers}\n        ref={rootRef}\n        data-weaverse-project-id={context.projectId}\n        data-weaverse-template-id={data.id}\n      >\n        <WeaverseContextProvider value={context}>\n          <ItemInstance\n            id={context.data.rootId || context.projectId}\n            parentId={''}\n          />\n        </WeaverseContextProvider>\n      </div>\n    )\n  }\n  return null\n})\nWeaverseRoot.displayName = 'WeaverseRoot'\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n  let context = useWeaverse()\n  let { stitchesInstance, elementRegistry, platformType } = context\n  let data = useSafeExternalStore(\n    instance.subscribe,\n    instance.getSnapShot,\n    instance.getSnapShot,\n  )\n  let {\n    id,\n    type,\n    childIds = [],\n    children = [],\n    parentId,\n    createdAt,\n    updatedAt,\n    deletedAt,\n    css,\n    __hidden,\n    // Need to get rid of this `data` property\n    data: _,\n    ...rest\n  } = data\n\n  useEffect(() => {\n    if (!instance.ref.current) {\n      // Fallback `ref` if the element isn't created by `React.forwardRef`\n      Object.assign(instance.ref, {\n        current: document.querySelector(`[data-wv-id=\"${id}\"]`),\n      })\n    }\n  }, [instance, id])\n\n  if (__hidden) {\n    return null\n  }\n\n  let Element = elementRegistry.get(type)\n\n  if (Element?.Component) {\n    let Component = Element.Component\n    Component.displayName = type\n    if (\n      Component.$$typeof === Symbol.for('react.forward_ref') ||\n      reactVersion > 18\n    ) {\n      rest.ref = instance.ref\n    }\n    let renderChildren = (\n      children?.length\n        ? children\n        : childIds?.length\n          ? childIds.map((cid: string) => ({ id: cid }))\n          : []\n    ).map((item: { id: string }, index: number) => (\n      <ItemInstance key={`${item.id}-${index}`} id={item.id} parentId={id} />\n    ))\n\n    return (\n      <Component\n        {...rest}\n        key={id}\n        data-wv-type={type}\n        data-wv-id={id}\n        className={clsx(\n          platformType !== 'shopify-hydrogen' &&\n            generateItemClassName(instance, stitchesInstance),\n          rest.data?.className,\n        )}\n        // biome-ignore lint/correctness/noChildrenProp: <explanation>\n        children={renderChildren.length ? renderChildren : undefined}\n      />\n    )\n  }\n  instance._store.deleted = true\n  console.log(`❌ Unknown element: ${type}`)\n  return null\n})\nItemComponent.displayName = 'WeaverseComponent'\n\nlet ItemInstance = memo(\n  ({ id, parentId }: { id: string; parentId: string }) => {\n    let instance = useItemInstance(id)\n    if (!instance) {\n      return <div style={{ display: 'none' }}>Item instance {id} not found</div>\n    }\n    return (\n      <WeaverseItemContext.Provider value={{ parentId, id }}>\n        <ItemComponent key={id} instance={instance} />\n      </WeaverseItemContext.Provider>\n    )\n  },\n)\nItemInstance.displayName = 'WeaverseInstanceProvider'\n","import type Stitches from '@stitches/react/types/stitches'\nimport type { ElementCSS, WeaverseItemStore } from '@weaverse/core'\nimport clsx from 'clsx'\n\n// Make the css data formatted to correct order (desktop, tablet, mobile)\nfunction formatCSS(css: ElementCSS) {\n  return {\n    '@desktop': css['@desktop'],\n    '@mobile': css['@mobile'],\n  }\n}\n\nlet permanentClasses: Record<string, string> = {}\nexport function generateItemClassName(\n  instance: WeaverseItemStore,\n  stitchesInstance: Stitches,\n) {\n  let { css, type, className: cls = '' } = instance.data\n  let className = ''\n  let permanentClass = ''\n  let perCss = instance.Element?.permanentCss\n  if (perCss) {\n    if (type in permanentClasses) {\n      permanentClass = permanentClasses[type]\n    } else {\n      // @ts-ignore\n      let { className: perCls } = stitchesInstance.css(perCss)()\n      Object.assign(permanentClasses, { [type]: perCls })\n      permanentClass = perCls\n    }\n  }\n  className = permanentClass\n  if (css) {\n    // let stitches create the style from css object and\n    // then return the classname, so we can use it in the render\n    let formattedCss = formatCSS(css)\n    let newStitchesClass = stitchesInstance.css(formattedCss)().className || ''\n    let { stitchesClass = '' } = instance\n    let otherClass = (instance.ref.current?.className || '')\n      .replace(stitchesClass, '')\n      .replace(cls, '')\n      .replace(permanentClass, '')\n      .trim()\n    className = clsx(permanentClass, cls, newStitchesClass, otherClass)\n    instance.stitchesClass = newStitchesClass\n  }\n  return className\n}\n"],"mappings":"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","names":["import_react","id","import_clsx","import_react","clsx","import_react","clsx"]}
+{"version":3,"sources":["../src/index.ts","../src/context.ts","../src/hooks.ts","../src/renderer.tsx","../src/utils/css.ts"],"sourcesContent":["export * from '@weaverse/core'\nexport * from './context'\nexport * from './hooks'\nexport * from './renderer'\nexport * from './types'\n","import type { Weaverse } from '@weaverse/core'\nimport { createContext } from 'react'\n\nexport let WeaverseContext = createContext<Weaverse>({} as Weaverse)\nexport let WeaverseContextProvider = WeaverseContext.Provider\nexport let WeaverseItemContext = createContext<{\n  id: string\n  parentId: string\n}>({ id: '', parentId: '' })\n","import { Weaverse, type WeaverseItemStore } from '@weaverse/core'\nimport { useContext } from 'react'\nimport { WeaverseContext, WeaverseItemContext } from '~/context'\n\nexport function useWeaverse<T = Weaverse>() {\n  let weaverse = useContext(WeaverseContext)\n  return weaverse as T\n}\n\nexport let useItemInstance = (id?: string) => {\n  let { id: currentId } = useContext(WeaverseItemContext)\n  let instance = Weaverse.itemInstances.get(id || currentId)\n  if (!instance) {\n    console.log(`Item instance ${id} not found`)\n    return null\n  }\n  return instance as WeaverseItemStore\n}\n\nexport let useParentInstance = () => {\n  let { parentId } = useContext(WeaverseItemContext)\n  return useItemInstance(parentId || '')\n}\n\nexport let useChildInstances = (id?: string) => {\n  let currentInstance = useItemInstance(id)\n  if (!currentInstance) return []\n  let { itemInstances } = Weaverse\n\n  let {\n    data: { children },\n  } = currentInstance\n  return children\n    .map(({ id }: { id: string }) => itemInstances.get(id))\n    .filter(Boolean) as WeaverseItemStore[]\n}\n","import clsx from 'clsx'\nimport * as React from 'react'\nimport { memo, useEffect, useRef } from 'react'\nimport { useItemInstance, useWeaverse } from '~/hooks'\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nlet reactVersion = Number(React.version?.split('.')[0]) || 0\n\n// Create a safe version of useSyncExternalStore that works in both client and server environments\nexport const useSafeExternalStore = (\n  subscribe: any,\n  getSnapshot: any,\n  getServerSnapshot: any = getSnapshot,\n) => {\n  // In server environment or during SSR, just return the snapshot directly\n  if (typeof window === 'undefined') {\n    return getServerSnapshot()\n  }\n\n  // In client environment, use React.useSyncExternalStore if available (React 18+)\n  if (React.useSyncExternalStore) {\n    // biome-ignore lint/correctness/useHookAtTopLevel: <$>\n    return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n  }\n\n  // Fallback for older React versions - just return the current snapshot\n  return getSnapshot()\n}\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n  let data = useSafeExternalStore(\n    context.subscribe,\n    context.getSnapShot,\n    context.getSnapShot,\n  )\n  let rootRef = useRef<HTMLElement>(null)\n\n  useEffect(() => {\n    context.contentRootElement = rootRef.current\n  }, [context])\n\n  let eventHandlers = context?.studioBridge?.eventHandlers || {}\n  let themeClass = context.stitchesInstance.theme.className\n\n  if (context.projectId) {\n    return (\n      <div\n        className={`weaverse-content-root ${themeClass}`}\n        {...eventHandlers}\n        ref={rootRef}\n        data-weaverse-project-id={context.projectId}\n        data-weaverse-template-id={data.id}\n      >\n        <WeaverseContextProvider value={context}>\n          <ItemInstance\n            id={context.data.rootId || context.projectId}\n            parentId={''}\n          />\n        </WeaverseContextProvider>\n      </div>\n    )\n  }\n  return null\n})\nWeaverseRoot.displayName = 'WeaverseRoot'\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n  let context = useWeaverse()\n  let { stitchesInstance, elementRegistry, platformType } = context\n  let data = useSafeExternalStore(\n    instance.subscribe,\n    instance.getSnapShot,\n    instance.getSnapShot,\n  )\n  let {\n    id,\n    type,\n    childIds = [],\n    children = [],\n    parentId,\n    createdAt,\n    updatedAt,\n    deletedAt,\n    css,\n    __hidden,\n    // Need to get rid of this `data` property\n    data: _,\n    ...rest\n  } = data\n\n  useEffect(() => {\n    if (!instance.ref.current) {\n      // Fallback `ref` if the element isn't created by `React.forwardRef`\n      Object.assign(instance.ref, {\n        current: document.querySelector(`[data-wv-id=\"${id}\"]`),\n      })\n    }\n  }, [instance, id])\n\n  if (__hidden) {\n    return null\n  }\n\n  let Element = elementRegistry.get(type)\n\n  if (Element?.Component) {\n    let Component = Element.Component\n    Component.displayName = type\n    if (\n      Component.$$typeof === Symbol.for('react.forward_ref') ||\n      reactVersion > 18\n    ) {\n      rest.ref = instance.ref\n    }\n    let renderChildren = (\n      children?.length\n        ? children\n        : childIds?.length\n          ? childIds.map((cid: string) => ({ id: cid }))\n          : []\n    ).map((item: { id: string }, index: number) => (\n      <ItemInstance key={`${item.id}-${index}`} id={item.id} parentId={id} />\n    ))\n\n    return (\n      <Component\n        {...rest}\n        key={id}\n        data-wv-type={type}\n        data-wv-id={id}\n        className={clsx(\n          platformType !== 'shopify-hydrogen' &&\n            generateItemClassName(instance, stitchesInstance),\n          rest.data?.className,\n        )}\n        // biome-ignore lint/correctness/noChildrenProp: <explanation>\n        children={renderChildren.length ? renderChildren : undefined}\n      />\n    )\n  }\n  instance._store.deleted = true\n  console.log(`❌ Unknown element: ${type}`)\n  return null\n})\nItemComponent.displayName = 'WeaverseComponent'\n\nlet ItemInstance = memo(\n  ({ id, parentId }: { id: string; parentId: string }) => {\n    let instance = useItemInstance(id)\n    if (!instance) {\n      return <div style={{ display: 'none' }}>Item instance {id} not found</div>\n    }\n    return (\n      <WeaverseItemContext.Provider value={{ parentId, id }}>\n        <ItemComponent key={id} instance={instance} />\n      </WeaverseItemContext.Provider>\n    )\n  },\n)\nItemInstance.displayName = 'WeaverseInstanceProvider'\n","import type Stitches from '@stitches/react/types/stitches'\nimport type { ElementCSS, WeaverseItemStore } from '@weaverse/core'\nimport clsx from 'clsx'\n\n// Make the css data formatted to correct order (desktop, tablet, mobile)\nfunction formatCSS(css: ElementCSS) {\n  return {\n    '@desktop': css['@desktop'],\n    '@mobile': css['@mobile'],\n  }\n}\n\nlet permanentClasses: Record<string, string> = {}\nexport function generateItemClassName(\n  instance: WeaverseItemStore,\n  stitchesInstance: Stitches,\n) {\n  let { css, type, className: cls = '' } = instance.data\n  let className = ''\n  let permanentClass = ''\n  let perCss = instance.Element?.permanentCss\n  if (perCss) {\n    if (type in permanentClasses) {\n      permanentClass = permanentClasses[type]\n    } else {\n      // @ts-ignore\n      let { className: perCls } = stitchesInstance.css(perCss)()\n      Object.assign(permanentClasses, { [type]: perCls })\n      permanentClass = perCls\n    }\n  }\n  className = permanentClass\n  if (css) {\n    // let stitches create the style from css object and\n    // then return the classname, so we can use it in the render\n    let formattedCss = formatCSS(css)\n    let newStitchesClass = stitchesInstance.css(formattedCss)().className || ''\n    let { stitchesClass = '' } = instance\n    let otherClass = (instance.ref.current?.className || '')\n      .replace(stitchesClass, '')\n      .replace(cls, '')\n      .replace(permanentClass, '')\n      .trim()\n    className = clsx(permanentClass, cls, newStitchesClass, otherClass)\n    instance.stitchesClass = newStitchesClass\n  }\n  return className\n}\n"],"mappings":"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","names":["import_react","id","import_clsx","import_react","clsx","import_react","clsx"]}

package/dist/index.mjs

@@ -34,9 +34,7 @@ var useChildInstances = (id) => {
   let {
     data: { children }
   } = currentInstance;
-  return children.map(({ id: id2 }) => {
-    return itemInstances.get(id2);
-  });
+  return children.map(({ id: id2 }) => itemInstances.get(id2)).filter(Boolean);
 };
 
 // src/renderer.tsx

package/dist/index.mjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts","../src/context.ts","../src/hooks.ts","../src/renderer.tsx","../src/utils/css.ts"],"sourcesContent":["export * from '@weaverse/core'\nexport * from './context'\nexport * from './hooks'\nexport * from './renderer'\nexport * from './types'\n","import type { Weaverse } from '@weaverse/core'\nimport { createContext } from 'react'\n\nexport let WeaverseContext = createContext<Weaverse>({} as Weaverse)\nexport let WeaverseContextProvider = WeaverseContext.Provider\nexport let WeaverseItemContext = createContext<{\n  id: string\n  parentId: string\n}>({ id: '', parentId: '' })\n","import { Weaverse, type WeaverseItemStore } from '@weaverse/core'\nimport { useContext } from 'react'\nimport { WeaverseContext, WeaverseItemContext } from '~/context'\n\nexport function useWeaverse<T = Weaverse>() {\n  let weaverse = useContext(WeaverseContext)\n  return weaverse as T\n}\n\nexport let useItemInstance = (id?: string) => {\n  let { id: currentId } = useContext(WeaverseItemContext)\n  let instance = Weaverse.itemInstances.get(id || currentId)\n  if (!instance) {\n    console.log(`Item instance ${id} not found`)\n    return null\n  }\n  return instance as WeaverseItemStore\n}\n\nexport let useParentInstance = () => {\n  let { parentId } = useContext(WeaverseItemContext)\n  return useItemInstance(parentId || '')\n}\n\nexport let useChildInstances = (id?: string) => {\n  let currentInstance = useItemInstance(id)\n  if (!currentInstance) return []\n  let { itemInstances } = Weaverse\n\n  let {\n    data: { children },\n  } = currentInstance\n  return children.map(({ id }: { id: string }) => {\n    return itemInstances.get(id)\n  }) as WeaverseItemStore[]\n}\n","import clsx from 'clsx'\nimport * as React from 'react'\nimport { memo, useEffect, useRef } from 'react'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, useWeaverse } from '~/hooks'\n\nlet reactVersion = Number(React.version?.split('.')[0]) || 0\n\n// Create a safe version of useSyncExternalStore that works in both client and server environments\nexport const useSafeExternalStore = (\n  subscribe: any,\n  getSnapshot: any,\n  getServerSnapshot: any = getSnapshot,\n) => {\n  // In server environment or during SSR, just return the snapshot directly\n  if (typeof window === 'undefined') {\n    return getServerSnapshot()\n  }\n\n  // In client environment, use React.useSyncExternalStore if available (React 18+)\n  if (React.useSyncExternalStore) {\n    return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n  }\n\n  // Fallback for older React versions - just return the current snapshot\n  return getSnapshot()\n}\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n  let data = useSafeExternalStore(\n    context.subscribe,\n    context.getSnapShot,\n    context.getSnapShot,\n  )\n  let rootRef = useRef<HTMLElement>(null)\n\n  useEffect(() => {\n    context.contentRootElement = rootRef.current\n  }, [context])\n\n  let eventHandlers = context?.studioBridge?.eventHandlers || {}\n  let themeClass = context.stitchesInstance.theme.className\n\n  if (context.projectId) {\n    return (\n      <div\n        className={`weaverse-content-root ${themeClass}`}\n        {...eventHandlers}\n        ref={rootRef}\n        data-weaverse-project-id={context.projectId}\n        data-weaverse-template-id={data.id}\n      >\n        <WeaverseContextProvider value={context}>\n          <ItemInstance\n            id={context.data.rootId || context.projectId}\n            parentId={''}\n          />\n        </WeaverseContextProvider>\n      </div>\n    )\n  }\n  return null\n})\nWeaverseRoot.displayName = 'WeaverseRoot'\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n  let context = useWeaverse()\n  let { stitchesInstance, elementRegistry, platformType } = context\n  let data = useSafeExternalStore(\n    instance.subscribe,\n    instance.getSnapShot,\n    instance.getSnapShot,\n  )\n  let {\n    id,\n    type,\n    childIds = [],\n    children = [],\n    parentId,\n    createdAt,\n    updatedAt,\n    deletedAt,\n    css,\n    __hidden,\n    // Need to get rid of this `data` property\n    data: _,\n    ...rest\n  } = data\n\n  useEffect(() => {\n    if (!instance.ref.current) {\n      // Fallback `ref` if the element isn't created by `React.forwardRef`\n      Object.assign(instance.ref, {\n        current: document.querySelector(`[data-wv-id=\"${id}\"]`),\n      })\n    }\n  }, [instance, id])\n\n  if (__hidden) {\n    return null\n  }\n\n  let Element = elementRegistry.get(type)\n\n  if (Element?.Component) {\n    let Component = Element.Component\n    Component.displayName = type\n    if (\n      Component.$$typeof === Symbol.for('react.forward_ref') ||\n      reactVersion > 18\n    ) {\n      rest.ref = instance.ref\n    }\n    let renderChildren = (\n      children?.length\n        ? children\n        : childIds?.length\n          ? childIds.map((cid: string) => ({ id: cid }))\n          : []\n    ).map((item: { id: string }, index: number) => (\n      <ItemInstance key={`${item.id}-${index}`} id={item.id} parentId={id} />\n    ))\n\n    return (\n      <Component\n        {...rest}\n        key={id}\n        data-wv-type={type}\n        data-wv-id={id}\n        className={clsx(\n          platformType !== 'shopify-hydrogen' &&\n            generateItemClassName(instance, stitchesInstance),\n          rest.data?.className,\n        )}\n        // biome-ignore lint/correctness/noChildrenProp: <explanation>\n        children={renderChildren.length ? renderChildren : undefined}\n      />\n    )\n  }\n  instance._store.deleted = true\n  console.log(`❌ Unknown element: ${type}`)\n  return null\n})\nItemComponent.displayName = 'WeaverseComponent'\n\nlet ItemInstance = memo(\n  ({ id, parentId }: { id: string; parentId: string }) => {\n    let instance = useItemInstance(id)\n    if (!instance) {\n      return <div style={{ display: 'none' }}>Item instance {id} not found</div>\n    }\n    return (\n      <WeaverseItemContext.Provider value={{ parentId, id }}>\n        <ItemComponent key={id} instance={instance} />\n      </WeaverseItemContext.Provider>\n    )\n  },\n)\nItemInstance.displayName = 'WeaverseInstanceProvider'\n","import type Stitches from '@stitches/react/types/stitches'\nimport type { ElementCSS, WeaverseItemStore } from '@weaverse/core'\nimport clsx from 'clsx'\n\n// Make the css data formatted to correct order (desktop, tablet, mobile)\nfunction formatCSS(css: ElementCSS) {\n  return {\n    '@desktop': css['@desktop'],\n    '@mobile': css['@mobile'],\n  }\n}\n\nlet permanentClasses: Record<string, string> = {}\nexport function generateItemClassName(\n  instance: WeaverseItemStore,\n  stitchesInstance: Stitches,\n) {\n  let { css, type, className: cls = '' } = instance.data\n  let className = ''\n  let permanentClass = ''\n  let perCss = instance.Element?.permanentCss\n  if (perCss) {\n    if (type in permanentClasses) {\n      permanentClass = permanentClasses[type]\n    } else {\n      // @ts-ignore\n      let { className: perCls } = stitchesInstance.css(perCss)()\n      Object.assign(permanentClasses, { [type]: perCls })\n      permanentClass = perCls\n    }\n  }\n  className = permanentClass\n  if (css) {\n    // let stitches create the style from css object and\n    // then return the classname, so we can use it in the render\n    let formattedCss = formatCSS(css)\n    let newStitchesClass = stitchesInstance.css(formattedCss)().className || ''\n    let { stitchesClass = '' } = instance\n    let otherClass = (instance.ref.current?.className || '')\n      .replace(stitchesClass, '')\n      .replace(cls, '')\n      .replace(permanentClass, '')\n      .trim()\n    className = clsx(permanentClass, cls, newStitchesClass, otherClass)\n    instance.stitchesClass = newStitchesClass\n  }\n  return className\n}\n"],"mappings":";AAAA,cAAc;;;ACCd,SAAS,qBAAqB;AAEvB,IAAI,kBAAkB,cAAwB,CAAC,CAAa;AAC5D,IAAI,0BAA0B,gBAAgB;AAC9C,IAAI,sBAAsB,cAG9B,EAAE,IAAI,IAAI,UAAU,GAAG,CAAC;;;ACR3B,SAAS,gBAAwC;AACjD,SAAS,kBAAkB;AAGpB,SAAS,cAA4B;AAC1C,MAAI,WAAW,WAAW,eAAe;AACzC,SAAO;AACT;AAEO,IAAI,kBAAkB,CAAC,OAAgB;AAC5C,MAAI,EAAE,IAAI,UAAU,IAAI,WAAW,mBAAmB;AACtD,MAAI,WAAW,SAAS,cAAc,IAAI,MAAM,SAAS;AACzD,MAAI,CAAC,UAAU;AACb,YAAQ,IAAI,iBAAiB,EAAE,YAAY;AAC3C,WAAO;AAAA,EACT;AACA,SAAO;AACT;AAEO,IAAI,oBAAoB,MAAM;AACnC,MAAI,EAAE,SAAS,IAAI,WAAW,mBAAmB;AACjD,SAAO,gBAAgB,YAAY,EAAE;AACvC;AAEO,IAAI,oBAAoB,CAAC,OAAgB;AAC9C,MAAI,kBAAkB,gBAAgB,EAAE;AACxC,MAAI,CAAC,gBAAiB,QAAO,CAAC;AAC9B,MAAI,EAAE,cAAc,IAAI;AAExB,MAAI;AAAA,IACF,MAAM,EAAE,SAAS;AAAA,EACnB,IAAI;AACJ,SAAO,SAAS,IAAI,CAAC,EAAE,IAAAA,IAAG,MAAsB;AAC9C,WAAO,cAAc,IAAIA,GAAE;AAAA,EAC7B,CAAC;AACH;;;ACnCA,OAAOC,WAAU;AACjB,YAAY,WAAW;AACvB,SAAS,MAAM,WAAW,cAAc;;;ACAxC,OAAO,UAAU;AAGjB,SAAS,UAAU,KAAiB;AAClC,SAAO;AAAA,IACL,YAAY,IAAI,UAAU;AAAA,IAC1B,WAAW,IAAI,SAAS;AAAA,EAC1B;AACF;AAEA,IAAI,mBAA2C,CAAC;AACzC,SAAS,sBACd,UACA,kBACA;AACA,MAAI,EAAE,KAAK,MAAM,WAAW,MAAM,GAAG,IAAI,SAAS;AAClD,MAAI,YAAY;AAChB,MAAI,iBAAiB;AACrB,MAAI,SAAS,SAAS,SAAS;AAC/B,MAAI,QAAQ;AACV,QAAI,QAAQ,kBAAkB;AAC5B,uBAAiB,iBAAiB,IAAI;AAAA,IACxC,OAAO;AAEL,UAAI,EAAE,WAAW,OAAO,IAAI,iBAAiB,IAAI,MAAM,EAAE;AACzD,aAAO,OAAO,kBAAkB,EAAE,CAAC,IAAI,GAAG,OAAO,CAAC;AAClD,uBAAiB;AAAA,IACnB;AAAA,EACF;AACA,cAAY;AACZ,MAAI,KAAK;AAGP,QAAI,eAAe,UAAU,GAAG;AAChC,QAAI,mBAAmB,iBAAiB,IAAI,YAAY,EAAE,EAAE,aAAa;AACzE,QAAI,EAAE,gBAAgB,GAAG,IAAI;AAC7B,QAAI,cAAc,SAAS,IAAI,SAAS,aAAa,IAClD,QAAQ,eAAe,EAAE,EACzB,QAAQ,KAAK,EAAE,EACf,QAAQ,gBAAgB,EAAE,EAC1B,KAAK;AACR,gBAAY,KAAK,gBAAgB,KAAK,kBAAkB,UAAU;AAClE,aAAS,gBAAgB;AAAA,EAC3B;AACA,SAAO;AACT;;;ADUU,cA+FG,YA/FH;AAsEJ;AArHN,IAAI,eAAe,OAAa,eAAS,MAAM,GAAG,EAAE,CAAC,CAAC,KAAK;AAGpD,IAAM,uBAAuB,CAClC,WACA,aACA,oBAAyB,gBACtB;AAEH,MAAI,OAAO,WAAW,aAAa;AACjC,WAAO,kBAAkB;AAAA,EAC3B;AAGA,MAAU,4BAAsB;AAC9B,WAAa,2BAAqB,WAAW,aAAa,iBAAiB;AAAA,EAC7E;AAGA,SAAO,YAAY;AACrB;AAEO,IAAI,eAAe,KAAK,CAAC,EAAE,QAAQ,MAA6B;AACrE,MAAI,OAAO;AAAA,IACT,QAAQ;AAAA,IACR,QAAQ;AAAA,IACR,QAAQ;AAAA,EACV;AACA,MAAI,UAAU,OAAoB,IAAI;AAEtC,YAAU,MAAM;AACd,YAAQ,qBAAqB,QAAQ;AAAA,EACvC,GAAG,CAAC,OAAO,CAAC;AAEZ,MAAI,gBAAgB,SAAS,cAAc,iBAAiB,CAAC;AAC7D,MAAI,aAAa,QAAQ,iBAAiB,MAAM;AAEhD,MAAI,QAAQ,WAAW;AACrB,WACE;AAAA,MAAC;AAAA;AAAA,QACC,WAAW,yBAAyB,UAAU;AAAA,QAC7C,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,4BAA0B,QAAQ;AAAA,QAClC,6BAA2B,KAAK;AAAA,QAEhC,8BAAC,2BAAwB,OAAO,SAC9B;AAAA,UAAC;AAAA;AAAA,YACC,IAAI,QAAQ,KAAK,UAAU,QAAQ;AAAA,YACnC,UAAU;AAAA;AAAA,QACZ,GACF;AAAA;AAAA,IACF;AAAA,EAEJ;AACA,SAAO;AACT,CAAC;AACD,aAAa,cAAc;AAC3B,IAAM,gBAAgB,KAAK,CAAC,EAAE,SAAS,MAA0B;AAC/D,MAAI,UAAU,YAAY;AAC1B,MAAI,EAAE,kBAAkB,iBAAiB,aAAa,IAAI;AAC1D,MAAI,OAAO;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,IACT,SAAS;AAAA,EACX;AACA,MAAI;AAAA,IACF;AAAA,IACA;AAAA,IACA,WAAW,CAAC;AAAA,IACZ,WAAW,CAAC;AAAA,IACZ;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA,IACA;AAAA;AAAA,IAEA,MAAM;AAAA,IACN,GAAG;AAAA,EACL,IAAI;AAEJ,YAAU,MAAM;AACd,QAAI,CAAC,SAAS,IAAI,SAAS;AAEzB,aAAO,OAAO,SAAS,KAAK;AAAA,QAC1B,SAAS,SAAS,cAAc,gBAAgB,EAAE,IAAI;AAAA,MACxD,CAAC;AAAA,IACH;AAAA,EACF,GAAG,CAAC,UAAU,EAAE,CAAC;AAEjB,MAAI,UAAU;AACZ,WAAO;AAAA,EACT;AAEA,MAAI,UAAU,gBAAgB,IAAI,IAAI;AAEtC,MAAI,SAAS,WAAW;AACtB,QAAI,YAAY,QAAQ;AACxB,cAAU,cAAc;AACxB,QACE,UAAU,aAAa,OAAO,IAAI,mBAAmB,KACrD,eAAe,IACf;AACA,WAAK,MAAM,SAAS;AAAA,IACtB;AACA,QAAI,kBACF,UAAU,SACN,WACA,UAAU,SACR,SAAS,IAAI,CAAC,SAAiB,EAAE,IAAI,IAAI,EAAE,IAC3C,CAAC,GACP,IAAI,CAAC,MAAsB,UAC3B,oBAAC,gBAAyC,IAAI,KAAK,IAAI,UAAU,MAA9C,GAAG,KAAK,EAAE,IAAI,KAAK,EAA+B,CACtE;AAED,WACE;AAAA,MAAC;AAAA;AAAA,QACE,GAAG;AAAA,QACJ,KAAK;AAAA,QACL,gBAAc;AAAA,QACd,cAAY;AAAA,QACZ,WAAWC;AAAA,UACT,iBAAiB,sBACf,sBAAsB,UAAU,gBAAgB;AAAA,UAClD,KAAK,MAAM;AAAA,QACb;AAAA,QAEA,UAAU,eAAe,SAAS,iBAAiB;AAAA;AAAA,IACrD;AAAA,EAEJ;AACA,WAAS,OAAO,UAAU;AAC1B,UAAQ,IAAI,2BAAsB,IAAI,EAAE;AACxC,SAAO;AACT,CAAC;AACD,cAAc,cAAc;AAE5B,IAAI,eAAe;AAAA,EACjB,CAAC,EAAE,IAAI,SAAS,MAAwC;AACtD,QAAI,WAAW,gBAAgB,EAAE;AACjC,QAAI,CAAC,UAAU;AACb,aAAO,qBAAC,SAAI,OAAO,EAAE,SAAS,OAAO,GAAG;AAAA;AAAA,QAAe;AAAA,QAAG;AAAA,SAAU;AAAA,IACtE;AACA,WACE,oBAAC,oBAAoB,UAApB,EAA6B,OAAO,EAAE,UAAU,GAAG,GAClD,8BAAC,iBAAuB,YAAJ,EAAwB,GAC9C;AAAA,EAEJ;AACF;AACA,aAAa,cAAc;","names":["id","clsx","clsx"]}
+{"version":3,"sources":["../src/index.ts","../src/context.ts","../src/hooks.ts","../src/renderer.tsx","../src/utils/css.ts"],"sourcesContent":["export * from '@weaverse/core'\nexport * from './context'\nexport * from './hooks'\nexport * from './renderer'\nexport * from './types'\n","import type { Weaverse } from '@weaverse/core'\nimport { createContext } from 'react'\n\nexport let WeaverseContext = createContext<Weaverse>({} as Weaverse)\nexport let WeaverseContextProvider = WeaverseContext.Provider\nexport let WeaverseItemContext = createContext<{\n  id: string\n  parentId: string\n}>({ id: '', parentId: '' })\n","import { Weaverse, type WeaverseItemStore } from '@weaverse/core'\nimport { useContext } from 'react'\nimport { WeaverseContext, WeaverseItemContext } from '~/context'\n\nexport function useWeaverse<T = Weaverse>() {\n  let weaverse = useContext(WeaverseContext)\n  return weaverse as T\n}\n\nexport let useItemInstance = (id?: string) => {\n  let { id: currentId } = useContext(WeaverseItemContext)\n  let instance = Weaverse.itemInstances.get(id || currentId)\n  if (!instance) {\n    console.log(`Item instance ${id} not found`)\n    return null\n  }\n  return instance as WeaverseItemStore\n}\n\nexport let useParentInstance = () => {\n  let { parentId } = useContext(WeaverseItemContext)\n  return useItemInstance(parentId || '')\n}\n\nexport let useChildInstances = (id?: string) => {\n  let currentInstance = useItemInstance(id)\n  if (!currentInstance) return []\n  let { itemInstances } = Weaverse\n\n  let {\n    data: { children },\n  } = currentInstance\n  return children\n    .map(({ id }: { id: string }) => itemInstances.get(id))\n    .filter(Boolean) as WeaverseItemStore[]\n}\n","import clsx from 'clsx'\nimport * as React from 'react'\nimport { memo, useEffect, useRef } from 'react'\nimport { useItemInstance, useWeaverse } from '~/hooks'\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nlet reactVersion = Number(React.version?.split('.')[0]) || 0\n\n// Create a safe version of useSyncExternalStore that works in both client and server environments\nexport const useSafeExternalStore = (\n  subscribe: any,\n  getSnapshot: any,\n  getServerSnapshot: any = getSnapshot,\n) => {\n  // In server environment or during SSR, just return the snapshot directly\n  if (typeof window === 'undefined') {\n    return getServerSnapshot()\n  }\n\n  // In client environment, use React.useSyncExternalStore if available (React 18+)\n  if (React.useSyncExternalStore) {\n    // biome-ignore lint/correctness/useHookAtTopLevel: <$>\n    return React.useSyncExternalStore(subscribe, getSnapshot, getServerSnapshot)\n  }\n\n  // Fallback for older React versions - just return the current snapshot\n  return getSnapshot()\n}\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n  let data = useSafeExternalStore(\n    context.subscribe,\n    context.getSnapShot,\n    context.getSnapShot,\n  )\n  let rootRef = useRef<HTMLElement>(null)\n\n  useEffect(() => {\n    context.contentRootElement = rootRef.current\n  }, [context])\n\n  let eventHandlers = context?.studioBridge?.eventHandlers || {}\n  let themeClass = context.stitchesInstance.theme.className\n\n  if (context.projectId) {\n    return (\n      <div\n        className={`weaverse-content-root ${themeClass}`}\n        {...eventHandlers}\n        ref={rootRef}\n        data-weaverse-project-id={context.projectId}\n        data-weaverse-template-id={data.id}\n      >\n        <WeaverseContextProvider value={context}>\n          <ItemInstance\n            id={context.data.rootId || context.projectId}\n            parentId={''}\n          />\n        </WeaverseContextProvider>\n      </div>\n    )\n  }\n  return null\n})\nWeaverseRoot.displayName = 'WeaverseRoot'\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n  let context = useWeaverse()\n  let { stitchesInstance, elementRegistry, platformType } = context\n  let data = useSafeExternalStore(\n    instance.subscribe,\n    instance.getSnapShot,\n    instance.getSnapShot,\n  )\n  let {\n    id,\n    type,\n    childIds = [],\n    children = [],\n    parentId,\n    createdAt,\n    updatedAt,\n    deletedAt,\n    css,\n    __hidden,\n    // Need to get rid of this `data` property\n    data: _,\n    ...rest\n  } = data\n\n  useEffect(() => {\n    if (!instance.ref.current) {\n      // Fallback `ref` if the element isn't created by `React.forwardRef`\n      Object.assign(instance.ref, {\n        current: document.querySelector(`[data-wv-id=\"${id}\"]`),\n      })\n    }\n  }, [instance, id])\n\n  if (__hidden) {\n    return null\n  }\n\n  let Element = elementRegistry.get(type)\n\n  if (Element?.Component) {\n    let Component = Element.Component\n    Component.displayName = type\n    if (\n      Component.$$typeof === Symbol.for('react.forward_ref') ||\n      reactVersion > 18\n    ) {\n      rest.ref = instance.ref\n    }\n    let renderChildren = (\n      children?.length\n        ? children\n        : childIds?.length\n          ? childIds.map((cid: string) => ({ id: cid }))\n          : []\n    ).map((item: { id: string }, index: number) => (\n      <ItemInstance key={`${item.id}-${index}`} id={item.id} parentId={id} />\n    ))\n\n    return (\n      <Component\n        {...rest}\n        key={id}\n        data-wv-type={type}\n        data-wv-id={id}\n        className={clsx(\n          platformType !== 'shopify-hydrogen' &&\n            generateItemClassName(instance, stitchesInstance),\n          rest.data?.className,\n        )}\n        // biome-ignore lint/correctness/noChildrenProp: <explanation>\n        children={renderChildren.length ? renderChildren : undefined}\n      />\n    )\n  }\n  instance._store.deleted = true\n  console.log(`❌ Unknown element: ${type}`)\n  return null\n})\nItemComponent.displayName = 'WeaverseComponent'\n\nlet ItemInstance = memo(\n  ({ id, parentId }: { id: string; parentId: string }) => {\n    let instance = useItemInstance(id)\n    if (!instance) {\n      return <div style={{ display: 'none' }}>Item instance {id} not found</div>\n    }\n    return (\n      <WeaverseItemContext.Provider value={{ parentId, id }}>\n        <ItemComponent key={id} instance={instance} />\n      </WeaverseItemContext.Provider>\n    )\n  },\n)\nItemInstance.displayName = 'WeaverseInstanceProvider'\n","import type Stitches from '@stitches/react/types/stitches'\nimport type { ElementCSS, WeaverseItemStore } from '@weaverse/core'\nimport clsx from 'clsx'\n\n// Make the css data formatted to correct order (desktop, tablet, mobile)\nfunction formatCSS(css: ElementCSS) {\n  return {\n    '@desktop': css['@desktop'],\n    '@mobile': css['@mobile'],\n  }\n}\n\nlet permanentClasses: Record<string, string> = {}\nexport function generateItemClassName(\n  instance: WeaverseItemStore,\n  stitchesInstance: Stitches,\n) {\n  let { css, type, className: cls = '' } = instance.data\n  let className = ''\n  let permanentClass = ''\n  let perCss = instance.Element?.permanentCss\n  if (perCss) {\n    if (type in permanentClasses) {\n      permanentClass = permanentClasses[type]\n    } else {\n      // @ts-ignore\n      let { className: perCls } = stitchesInstance.css(perCss)()\n      Object.assign(permanentClasses, { [type]: perCls })\n      permanentClass = perCls\n    }\n  }\n  className = permanentClass\n  if (css) {\n    // let stitches create the style from css object and\n    // then return the classname, so we can use it in the render\n    let formattedCss = formatCSS(css)\n    let newStitchesClass = stitchesInstance.css(formattedCss)().className || ''\n    let { stitchesClass = '' } = instance\n    let otherClass = (instance.ref.current?.className || '')\n      .replace(stitchesClass, '')\n      .replace(cls, '')\n      .replace(permanentClass, '')\n      .trim()\n    className = clsx(permanentClass, cls, newStitchesClass, otherClass)\n    instance.stitchesClass = newStitchesClass\n  }\n  return className\n}\n"],"mappings":"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","names":["id","clsx","clsx"]}

package/package.json

@@ -2,7 +2,7 @@
   "name": "@weaverse/react",
   "author": "Weaverse Team",
   "description": "React bindings for Weaverse",
-  "version": "5.0.0",
+  "version": "5.2.0",
   "license": "MIT",
   "main": "dist/index.js",
   "typings": "dist/index.d.ts",
@@ -35,7 +35,7 @@
     "outDir": "dist"
   },
   "dependencies": {
-    "@weaverse/core": "5.0.0",
+    "@weaverse/core": "5.2.0",
     "clsx": "^2.1.1",
     "react": ">=18",
     "react-dom": ">=18"

package/readme.md

@@ -36,15 +36,15 @@ Next, register your React components with the Weaverse instance:
 
 ```jsx
 weaverse.registerElement({
-  type: 'Button',
-  Component: ButtonComponent,
+  type: 'MyButton',
+  Component: MyButtonComponent,
   schema: {
-    title: 'Button',
-    type: 'Button',
-    inspector: {
-      // define settings inputs for customizing the Component here
-    },
-  },
+    title: 'My Button',
+    type: 'MyButton',
+    settings: {
+      // Configuration options
+    }
+  }
 })
 ```