@weaverse/react 3.1.6 → 3.1.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.d.mts +3 -3
- package/dist/index.d.ts +3 -3
- package/dist/index.js +10 -12
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +10 -11
- package/dist/index.mjs.map +1 -1
- package/package.json +2 -2
package/dist/index.d.mts
CHANGED
|
@@ -11,8 +11,8 @@ declare let WeaverseItemContext: react.Context<{
|
|
|
11
11
|
}>;
|
|
12
12
|
|
|
13
13
|
declare function useWeaverse<T = Weaverse>(): T;
|
|
14
|
-
declare let useItemInstance: (id?: string) => WeaverseItemStore
|
|
15
|
-
declare let useParentInstance: () => WeaverseItemStore
|
|
14
|
+
declare let useItemInstance: (id?: string) => WeaverseItemStore;
|
|
15
|
+
declare let useParentInstance: () => WeaverseItemStore;
|
|
16
16
|
declare let useChildInstances: (id?: string) => WeaverseItemStore[];
|
|
17
17
|
declare function usePixel(context: Weaverse): void;
|
|
18
18
|
|
|
@@ -29,6 +29,6 @@ type ItemComponentProps = {
|
|
|
29
29
|
instance: InstanceType<typeof WeaverseItemStore>;
|
|
30
30
|
};
|
|
31
31
|
|
|
32
|
-
declare let WeaverseRoot: react__default.MemoExoticComponent<({ context }: WeaverseRootPropsType) => react__default.JSX.Element
|
|
32
|
+
declare let WeaverseRoot: react__default.MemoExoticComponent<({ context }: WeaverseRootPropsType) => react__default.JSX.Element>;
|
|
33
33
|
|
|
34
34
|
export { type ItemComponentProps, WeaverseContext, WeaverseContextProvider, type WeaverseElementProps, WeaverseItemContext, WeaverseRoot, type WeaverseRootPropsType, useChildInstances, useItemInstance, useParentInstance, usePixel, useWeaverse };
|
package/dist/index.d.ts
CHANGED
|
@@ -11,8 +11,8 @@ declare let WeaverseItemContext: react.Context<{
|
|
|
11
11
|
}>;
|
|
12
12
|
|
|
13
13
|
declare function useWeaverse<T = Weaverse>(): T;
|
|
14
|
-
declare let useItemInstance: (id?: string) => WeaverseItemStore
|
|
15
|
-
declare let useParentInstance: () => WeaverseItemStore
|
|
14
|
+
declare let useItemInstance: (id?: string) => WeaverseItemStore;
|
|
15
|
+
declare let useParentInstance: () => WeaverseItemStore;
|
|
16
16
|
declare let useChildInstances: (id?: string) => WeaverseItemStore[];
|
|
17
17
|
declare function usePixel(context: Weaverse): void;
|
|
18
18
|
|
|
@@ -29,6 +29,6 @@ type ItemComponentProps = {
|
|
|
29
29
|
instance: InstanceType<typeof WeaverseItemStore>;
|
|
30
30
|
};
|
|
31
31
|
|
|
32
|
-
declare let WeaverseRoot: react__default.MemoExoticComponent<({ context }: WeaverseRootPropsType) => react__default.JSX.Element
|
|
32
|
+
declare let WeaverseRoot: react__default.MemoExoticComponent<({ context }: WeaverseRootPropsType) => react__default.JSX.Element>;
|
|
33
33
|
|
|
34
34
|
export { type ItemComponentProps, WeaverseContext, WeaverseContextProvider, type WeaverseElementProps, WeaverseItemContext, WeaverseRoot, type WeaverseRootPropsType, useChildInstances, useItemInstance, useParentInstance, usePixel, useWeaverse };
|
package/dist/index.js
CHANGED
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
var __create = Object.create;
|
|
3
2
|
var __defProp = Object.defineProperty;
|
|
4
3
|
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
|
@@ -51,16 +50,15 @@ var WeaverseContextProvider = WeaverseContext.Provider;
|
|
|
51
50
|
var WeaverseItemContext = (0, import_react.createContext)({ id: "", parentId: "" });
|
|
52
51
|
|
|
53
52
|
// src/hooks.ts
|
|
53
|
+
var import_core = require("@weaverse/core");
|
|
54
54
|
var import_react2 = require("react");
|
|
55
55
|
function useWeaverse() {
|
|
56
56
|
let weaverse = (0, import_react2.useContext)(WeaverseContext);
|
|
57
57
|
return weaverse;
|
|
58
58
|
}
|
|
59
59
|
var useItemInstance = (id) => {
|
|
60
|
-
let weaverse = useWeaverse();
|
|
61
60
|
let { id: currentId } = (0, import_react2.useContext)(WeaverseItemContext);
|
|
62
|
-
let
|
|
63
|
-
let instance = itemInstances.get(id || currentId);
|
|
61
|
+
let instance = import_core.Weaverse.itemInstances.get(id || currentId);
|
|
64
62
|
if (!instance) {
|
|
65
63
|
console.warn(`Item instance ${id} not found`);
|
|
66
64
|
return null;
|
|
@@ -72,11 +70,10 @@ var useParentInstance = () => {
|
|
|
72
70
|
return useItemInstance(parentId || "");
|
|
73
71
|
};
|
|
74
72
|
var useChildInstances = (id) => {
|
|
75
|
-
let weaverse = useWeaverse();
|
|
76
73
|
let currentInstance = useItemInstance(id);
|
|
77
74
|
if (!currentInstance)
|
|
78
75
|
return [];
|
|
79
|
-
let { itemInstances } =
|
|
76
|
+
let { itemInstances } = import_core.Weaverse;
|
|
80
77
|
let {
|
|
81
78
|
data: { children }
|
|
82
79
|
} = currentInstance;
|
|
@@ -132,7 +129,7 @@ function generateItemClassName(instance, stitchesInstance) {
|
|
|
132
129
|
if (css) {
|
|
133
130
|
let formattedCss = formatCSS(css);
|
|
134
131
|
let newStitchesClass = stitchesInstance.css(formattedCss)().className || "";
|
|
135
|
-
let { stitchesClass } = instance;
|
|
132
|
+
let { stitchesClass = "" } = instance;
|
|
136
133
|
let otherClass = (instance.ref.current?.className || "").replace(stitchesClass, "").replace(cls, "").replace(permanentClass, "").trim();
|
|
137
134
|
className = (0, import_clsx.default)(permanentClass, cls, newStitchesClass, otherClass);
|
|
138
135
|
instance.stitchesClass = newStitchesClass;
|
|
@@ -141,6 +138,7 @@ function generateItemClassName(instance, stitchesInstance) {
|
|
|
141
138
|
}
|
|
142
139
|
|
|
143
140
|
// src/renderer.tsx
|
|
141
|
+
var reactVersion = Number(import_react3.default.version.split(".")[0]);
|
|
144
142
|
var WeaverseRoot = (0, import_react3.memo)(({ context }) => {
|
|
145
143
|
let data = (0, import_react3.useSyncExternalStore)(
|
|
146
144
|
context.subscribe,
|
|
@@ -205,16 +203,16 @@ var ItemComponent = (0, import_react3.memo)(({ instance }) => {
|
|
|
205
203
|
});
|
|
206
204
|
}
|
|
207
205
|
}, [instance]);
|
|
206
|
+
if (__hidden) {
|
|
207
|
+
return null;
|
|
208
|
+
}
|
|
208
209
|
let Element = elementRegistry.get(type);
|
|
209
210
|
if (Element?.Component) {
|
|
210
211
|
let Component = Element.Component;
|
|
211
|
-
if (Component.$$typeof === Symbol.for("react.forward_ref")) {
|
|
212
|
+
if (Component.$$typeof === Symbol.for("react.forward_ref") || reactVersion > 18) {
|
|
212
213
|
rest.ref = instance.ref;
|
|
213
214
|
}
|
|
214
|
-
let renderChildren = (children?.length ? children : childIds?.length ? childIds.map((cid) => ({ id: cid })) : []).map((item) => /* @__PURE__ */ import_react3.default.createElement(ItemInstance, { key: item.id, id: item.id, parentId: id }));
|
|
215
|
-
if (__hidden) {
|
|
216
|
-
return null;
|
|
217
|
-
}
|
|
215
|
+
let renderChildren = (children?.length ? children : childIds?.length ? childIds.map((cid) => ({ id: cid })) : []).map((item, index) => /* @__PURE__ */ import_react3.default.createElement(ItemInstance, { key: item.id + "-" + index, id: item.id, parentId: id }));
|
|
218
216
|
return /* @__PURE__ */ import_react3.default.createElement(
|
|
219
217
|
Component,
|
|
220
218
|
{
|
package/dist/index.js.map
CHANGED
|
@@ -1 +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 type { Weaverse, WeaverseItemStore } from '@weaverse/core'\nimport { useContext, useEffect } from 'react'\n\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 weaverse = useWeaverse()\n let { id: currentId } = useContext(WeaverseItemContext)\n let { itemInstances } = weaverse\n let instance = itemInstances.get(id || currentId)\n if (!instance) {\n console.warn(`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 weaverse = useWeaverse()\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\nlet fetchingKey = ''\n\nexport function usePixel(context: Weaverse) {\n // @ts-expect-error\n let { projectId, pageId, weaverseHost } = context\n\n useEffect(() => {\n if (!projectId || !pageId || !weaverseHost) return\n let currentKey = `${projectId}-${pageId}-${globalThis.location.pathname}`\n if (fetchingKey === currentKey) return\n fetchingKey = currentKey\n let url = `${weaverseHost}/api/public/px`\n let xhr = new XMLHttpRequest()\n xhr.open('POST', url, true)\n xhr.send(JSON.stringify({ projectId, pageId }))\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n}\n","/* eslint-disable react/no-children-prop */\nimport React, { memo, useEffect, useRef, useSyncExternalStore } from 'react'\nimport clsx from 'clsx'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, usePixel, useWeaverse } from '~/hooks'\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n let data = useSyncExternalStore(\n context.subscribe,\n context.getSnapShot,\n context.getSnapShot,\n )\n let rootRef = useRef<HTMLElement>()\n\n useEffect(() => {\n context.contentRootElement = rootRef?.current || null\n }, [context])\n usePixel(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})\n\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n let context = useWeaverse()\n let { stitchesInstance, elementRegistry, platformType } = context\n let data = useSyncExternalStore(\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [instance])\n\n let Element = elementRegistry.get(type)\n\n if (Element?.Component) {\n let Component = Element.Component\n if (Component.$$typeof === Symbol.for('react.forward_ref')) {\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 }) => (\n <ItemInstance key={item.id} id={item.id} parentId={id} />\n ))\n\n if (__hidden) {\n return null\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 children={renderChildren.length ? renderChildren : undefined}\n />\n )\n } else {\n instance._store.deleted = true\n console.log(`❌ Unknown element: ${type}`)\n return null\n }\n})\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)\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_react","import_clsx","clsx","React","clsx"]}
|
|
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, useEffect } from 'react'\n\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.warn(`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\nlet fetchingKey = ''\n\nexport function usePixel(context: Weaverse) {\n // @ts-expect-error\n let { projectId, pageId, weaverseHost } = context\n\n useEffect(() => {\n if (!projectId || !pageId || !weaverseHost) return\n let currentKey = `${projectId}-${pageId}-${globalThis.location.pathname}`\n if (fetchingKey === currentKey) return\n fetchingKey = currentKey\n let url = `${weaverseHost}/api/public/px`\n let xhr = new XMLHttpRequest()\n xhr.open('POST', url, true)\n xhr.send(JSON.stringify({ projectId, pageId }))\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n}\n","/* eslint-disable react/no-children-prop */\nimport React, { memo, useEffect, useRef, useSyncExternalStore } from 'react'\nimport clsx from 'clsx'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, usePixel, useWeaverse } from '~/hooks'\n\nlet reactVersion = Number(React.version.split('.')[0])\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n let data = useSyncExternalStore(\n context.subscribe,\n context.getSnapShot,\n context.getSnapShot,\n )\n let rootRef = useRef<HTMLElement>()\n\n useEffect(() => {\n context.contentRootElement = rootRef?.current || null\n }, [context])\n usePixel(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})\n\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n let context = useWeaverse()\n let { stitchesInstance, elementRegistry, platformType } = context\n let data = useSyncExternalStore(\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [instance])\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 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 children={renderChildren.length ? renderChildren : undefined}\n />\n )\n } else {\n instance._store.deleted = true\n console.log(`❌ Unknown element: ${type}`)\n return null\n }\n})\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)\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_react","import_clsx","clsx","React","clsx"]}
|
package/dist/index.mjs
CHANGED
|
@@ -8,16 +8,15 @@ var WeaverseContextProvider = WeaverseContext.Provider;
|
|
|
8
8
|
var WeaverseItemContext = createContext({ id: "", parentId: "" });
|
|
9
9
|
|
|
10
10
|
// src/hooks.ts
|
|
11
|
+
import { Weaverse } from "@weaverse/core";
|
|
11
12
|
import { useContext, useEffect } from "react";
|
|
12
13
|
function useWeaverse() {
|
|
13
14
|
let weaverse = useContext(WeaverseContext);
|
|
14
15
|
return weaverse;
|
|
15
16
|
}
|
|
16
17
|
var useItemInstance = (id) => {
|
|
17
|
-
let weaverse = useWeaverse();
|
|
18
18
|
let { id: currentId } = useContext(WeaverseItemContext);
|
|
19
|
-
let
|
|
20
|
-
let instance = itemInstances.get(id || currentId);
|
|
19
|
+
let instance = Weaverse.itemInstances.get(id || currentId);
|
|
21
20
|
if (!instance) {
|
|
22
21
|
console.warn(`Item instance ${id} not found`);
|
|
23
22
|
return null;
|
|
@@ -29,11 +28,10 @@ var useParentInstance = () => {
|
|
|
29
28
|
return useItemInstance(parentId || "");
|
|
30
29
|
};
|
|
31
30
|
var useChildInstances = (id) => {
|
|
32
|
-
let weaverse = useWeaverse();
|
|
33
31
|
let currentInstance = useItemInstance(id);
|
|
34
32
|
if (!currentInstance)
|
|
35
33
|
return [];
|
|
36
|
-
let { itemInstances } =
|
|
34
|
+
let { itemInstances } = Weaverse;
|
|
37
35
|
let {
|
|
38
36
|
data: { children }
|
|
39
37
|
} = currentInstance;
|
|
@@ -89,7 +87,7 @@ function generateItemClassName(instance, stitchesInstance) {
|
|
|
89
87
|
if (css) {
|
|
90
88
|
let formattedCss = formatCSS(css);
|
|
91
89
|
let newStitchesClass = stitchesInstance.css(formattedCss)().className || "";
|
|
92
|
-
let { stitchesClass } = instance;
|
|
90
|
+
let { stitchesClass = "" } = instance;
|
|
93
91
|
let otherClass = (instance.ref.current?.className || "").replace(stitchesClass, "").replace(cls, "").replace(permanentClass, "").trim();
|
|
94
92
|
className = clsx(permanentClass, cls, newStitchesClass, otherClass);
|
|
95
93
|
instance.stitchesClass = newStitchesClass;
|
|
@@ -98,6 +96,7 @@ function generateItemClassName(instance, stitchesInstance) {
|
|
|
98
96
|
}
|
|
99
97
|
|
|
100
98
|
// src/renderer.tsx
|
|
99
|
+
var reactVersion = Number(React.version.split(".")[0]);
|
|
101
100
|
var WeaverseRoot = memo(({ context }) => {
|
|
102
101
|
let data = useSyncExternalStore(
|
|
103
102
|
context.subscribe,
|
|
@@ -162,16 +161,16 @@ var ItemComponent = memo(({ instance }) => {
|
|
|
162
161
|
});
|
|
163
162
|
}
|
|
164
163
|
}, [instance]);
|
|
164
|
+
if (__hidden) {
|
|
165
|
+
return null;
|
|
166
|
+
}
|
|
165
167
|
let Element = elementRegistry.get(type);
|
|
166
168
|
if (Element?.Component) {
|
|
167
169
|
let Component = Element.Component;
|
|
168
|
-
if (Component.$$typeof === Symbol.for("react.forward_ref")) {
|
|
170
|
+
if (Component.$$typeof === Symbol.for("react.forward_ref") || reactVersion > 18) {
|
|
169
171
|
rest.ref = instance.ref;
|
|
170
172
|
}
|
|
171
|
-
let renderChildren = (children?.length ? children : childIds?.length ? childIds.map((cid) => ({ id: cid })) : []).map((item) => /* @__PURE__ */ React.createElement(ItemInstance, { key: item.id, id: item.id, parentId: id }));
|
|
172
|
-
if (__hidden) {
|
|
173
|
-
return null;
|
|
174
|
-
}
|
|
173
|
+
let renderChildren = (children?.length ? children : childIds?.length ? childIds.map((cid) => ({ id: cid })) : []).map((item, index) => /* @__PURE__ */ React.createElement(ItemInstance, { key: item.id + "-" + index, id: item.id, parentId: id }));
|
|
175
174
|
return /* @__PURE__ */ React.createElement(
|
|
176
175
|
Component,
|
|
177
176
|
{
|
package/dist/index.mjs.map
CHANGED
|
@@ -1 +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 type { Weaverse, WeaverseItemStore } from '@weaverse/core'\nimport { useContext, useEffect } from 'react'\n\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 weaverse = useWeaverse()\n let { id: currentId } = useContext(WeaverseItemContext)\n let { itemInstances } = weaverse\n let instance = itemInstances.get(id || currentId)\n if (!instance) {\n console.warn(`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 weaverse = useWeaverse()\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\nlet fetchingKey = ''\n\nexport function usePixel(context: Weaverse) {\n // @ts-expect-error\n let { projectId, pageId, weaverseHost } = context\n\n useEffect(() => {\n if (!projectId || !pageId || !weaverseHost) return\n let currentKey = `${projectId}-${pageId}-${globalThis.location.pathname}`\n if (fetchingKey === currentKey) return\n fetchingKey = currentKey\n let url = `${weaverseHost}/api/public/px`\n let xhr = new XMLHttpRequest()\n xhr.open('POST', url, true)\n xhr.send(JSON.stringify({ projectId, pageId }))\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n}\n","/* eslint-disable react/no-children-prop */\nimport React, { memo, useEffect, useRef, useSyncExternalStore } from 'react'\nimport clsx from 'clsx'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, usePixel, useWeaverse } from '~/hooks'\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n let data = useSyncExternalStore(\n context.subscribe,\n context.getSnapShot,\n context.getSnapShot,\n )\n let rootRef = useRef<HTMLElement>()\n\n useEffect(() => {\n context.contentRootElement = rootRef?.current || null\n }, [context])\n usePixel(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})\n\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n let context = useWeaverse()\n let { stitchesInstance, elementRegistry, platformType } = context\n let data = useSyncExternalStore(\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [instance])\n\n let Element = elementRegistry.get(type)\n\n if (Element?.Component) {\n let Component = Element.Component\n if (Component.$$typeof === Symbol.for('react.forward_ref')) {\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 }) => (\n <ItemInstance key={item.id} id={item.id} parentId={id} />\n ))\n\n if (__hidden) {\n return null\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 children={renderChildren.length ? renderChildren : undefined}\n />\n )\n } else {\n instance._store.deleted = true\n console.log(`❌ Unknown element: ${type}`)\n return null\n }\n})\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)\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","useEffect","clsx","useEffect","clsx"]}
|
|
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, useEffect } from 'react'\n\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.warn(`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\nlet fetchingKey = ''\n\nexport function usePixel(context: Weaverse) {\n // @ts-expect-error\n let { projectId, pageId, weaverseHost } = context\n\n useEffect(() => {\n if (!projectId || !pageId || !weaverseHost) return\n let currentKey = `${projectId}-${pageId}-${globalThis.location.pathname}`\n if (fetchingKey === currentKey) return\n fetchingKey = currentKey\n let url = `${weaverseHost}/api/public/px`\n let xhr = new XMLHttpRequest()\n xhr.open('POST', url, true)\n xhr.send(JSON.stringify({ projectId, pageId }))\n // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [])\n}\n","/* eslint-disable react/no-children-prop */\nimport React, { memo, useEffect, useRef, useSyncExternalStore } from 'react'\nimport clsx from 'clsx'\n\nimport { WeaverseContextProvider, WeaverseItemContext } from './context'\nimport type { ItemComponentProps, WeaverseRootPropsType } from './types'\nimport { generateItemClassName } from './utils/css'\n\nimport { useItemInstance, usePixel, useWeaverse } from '~/hooks'\n\nlet reactVersion = Number(React.version.split('.')[0])\n\nexport let WeaverseRoot = memo(({ context }: WeaverseRootPropsType) => {\n let data = useSyncExternalStore(\n context.subscribe,\n context.getSnapShot,\n context.getSnapShot,\n )\n let rootRef = useRef<HTMLElement>()\n\n useEffect(() => {\n context.contentRootElement = rootRef?.current || null\n }, [context])\n usePixel(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})\n\nconst ItemComponent = memo(({ instance }: ItemComponentProps) => {\n let context = useWeaverse()\n let { stitchesInstance, elementRegistry, platformType } = context\n let data = useSyncExternalStore(\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 // eslint-disable-next-line react-hooks/exhaustive-deps\n }, [instance])\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 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 children={renderChildren.length ? renderChildren : undefined}\n />\n )\n } else {\n instance._store.deleted = true\n console.log(`❌ Unknown element: ${type}`)\n return null\n }\n})\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)\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","useEffect","clsx","useEffect","clsx"]}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
"name": "@weaverse/react",
|
|
3
3
|
"author": "Weaverse Team",
|
|
4
4
|
"description": "React bindings for Weaverse",
|
|
5
|
-
"version": "3.1.
|
|
5
|
+
"version": "3.1.8",
|
|
6
6
|
"license": "MIT",
|
|
7
7
|
"main": "dist/index.js",
|
|
8
8
|
"typings": "dist/index.d.ts",
|
|
@@ -31,7 +31,7 @@
|
|
|
31
31
|
"singleQuote": true
|
|
32
32
|
},
|
|
33
33
|
"dependencies": {
|
|
34
|
-
"@weaverse/core": "3.1.
|
|
34
|
+
"@weaverse/core": "3.1.8",
|
|
35
35
|
"clsx": "^2.1.0"
|
|
36
36
|
},
|
|
37
37
|
"scripts": {
|