@webspatial/react-sdk 0.1.9 → 0.1.10
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/jsx/jsx-dev-runtime.d.ts +1 -1
- package/dist/jsx/jsx-dev-runtime.js +1 -21
- package/dist/jsx/jsx-dev-runtime.js.map +1 -1
- package/dist/jsx/{jsx-runtime-DEGCo-TS.d.ts → jsx-runtime-DjvfDSm5.d.ts} +8 -0
- package/dist/jsx/jsx-runtime.d.ts +1 -1
- package/dist/jsx/jsx-runtime.js +1 -21
- package/dist/jsx/jsx-runtime.js.map +1 -1
- package/dist/web/index.js +4 -2
- package/dist/web/index.js.map +1 -1
- package/package.json +2 -2
|
@@ -151,27 +151,7 @@ function hijackDocumentElementStyle() {
|
|
|
151
151
|
}
|
|
152
152
|
function monitorExternalStyleChange() {
|
|
153
153
|
const headObserver = new MutationObserver(function(mutationsList) {
|
|
154
|
-
|
|
155
|
-
if (mutation.type === "childList") {
|
|
156
|
-
let needCheck = false;
|
|
157
|
-
mutation.addedNodes.forEach((node) => {
|
|
158
|
-
if (node.nodeName === "LINK" && node.rel === "stylesheet") {
|
|
159
|
-
needCheck = true;
|
|
160
|
-
}
|
|
161
|
-
if (node.nodeName === "STYLE") {
|
|
162
|
-
needCheck = true;
|
|
163
|
-
}
|
|
164
|
-
});
|
|
165
|
-
mutation.removedNodes.forEach((node) => {
|
|
166
|
-
if (node.nodeName === "LINK" && node.rel === "stylesheet") {
|
|
167
|
-
needCheck = true;
|
|
168
|
-
}
|
|
169
|
-
});
|
|
170
|
-
if (needCheck) {
|
|
171
|
-
checkCSSProperties();
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
}
|
|
154
|
+
checkCSSProperties();
|
|
175
155
|
});
|
|
176
156
|
headObserver.observe(document.head, { childList: true, subtree: true });
|
|
177
157
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/jsx/spatialPolyfill.ts","../../src/jsx/injectSceneHook.ts","../../src/jsx/jsx-dev-runtime.ts","../../src/jsx/jsx-shared.ts"],"sourcesContent":["import { getSession, parseCornerRadius, XRApp } from '@webspatial/react-sdk'\nimport { injectSceneHook } from './injectSceneHook'\n\nconst isWebSpatialEnv = getSession() !== null\n\nconst SpatialGlobalCustomVars = {\n backgroundMaterial: '--xr-background-material',\n}\n\n// keep track of current html background material\nlet htmlBackgroundMaterial = ''\nfunction setCurrentWindowStyle(backgroundMaterial: string) {\n if (backgroundMaterial !== htmlBackgroundMaterial) {\n const session = getSession()!\n session.getCurrentWindowComponent().setStyle({\n material: { type: backgroundMaterial as any },\n })\n htmlBackgroundMaterial = backgroundMaterial\n }\n}\n\nfunction checkHtmlBackgroundMaterial() {\n const computedStyle = getComputedStyle(document.documentElement)\n\n const backgroundMaterial = computedStyle.getPropertyValue(\n SpatialGlobalCustomVars.backgroundMaterial,\n )\n\n setCurrentWindowStyle(backgroundMaterial || 'none')\n}\n\n// keep track of current corner radius\nlet htmlCornerRadius = {\n topLeading: 0,\n bottomLeading: 0,\n topTrailing: 0,\n bottomTrailing: 0,\n}\nfunction checkCornerRadius() {\n const computedStyle = getComputedStyle(document.documentElement)\n const cornerRadius = parseCornerRadius(computedStyle)\n setCornerRadius(cornerRadius)\n}\n\nfunction setCornerRadius(cornerRadius: any) {\n if (\n htmlCornerRadius.topLeading !== cornerRadius.topLeading ||\n htmlCornerRadius.bottomLeading !== cornerRadius.bottomLeading ||\n htmlCornerRadius.topTrailing !== cornerRadius.topTrailing ||\n htmlCornerRadius.bottomTrailing !== cornerRadius.bottomTrailing\n ) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setStyle({\n cornerRadius,\n })\n htmlCornerRadius.topLeading = cornerRadius.topLeading\n htmlCornerRadius.bottomLeading = cornerRadius.bottomLeading\n htmlCornerRadius.topTrailing = cornerRadius.topTrailing\n htmlCornerRadius.bottomTrailing = cornerRadius.bottomTrailing\n }\n}\n\nfunction setOpacity(opacity: number) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setOpacity(opacity)\n}\n\nfunction checkOpacity() {\n const computedStyle = getComputedStyle(document.documentElement)\n const opacity = parseFloat(computedStyle.getPropertyValue('opacity'))\n setOpacity(opacity)\n}\n\nasync function setHtmlVisible(visible: boolean) {\n const session = getSession()!\n if (!session) return\n const wc = session.getCurrentWindowComponent()\n const ent = await wc.getEntity()\n ent?.setVisible(visible)\n}\n\nfunction checkHtmlVisible() {\n const computedStyle = getComputedStyle(document.documentElement)\n const visibility = computedStyle.getPropertyValue('visibility') !== 'hidden'\n const widthGtZero = parseFloat(computedStyle.getPropertyValue('width')) > 0\n setHtmlVisible(visibility && widthGtZero)\n}\n\nfunction hijackDocumentElementStyle() {\n const rawDocumentStyle = document.documentElement.style\n const styleProxy = new Proxy(rawDocumentStyle, {\n set: function (target, key, value) {\n const ret = Reflect.set(target, key, value)\n\n if (key === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n\n if (\n key === 'border-radius' ||\n key === 'borderRadius' ||\n key === 'border-top-left-radius' ||\n key === 'borderTopLeftRadius' ||\n key === 'border-top-right-radius' ||\n key === 'borderTopRightRadius' ||\n key === 'border-bottom-left-radius' ||\n key === 'borderBottomLeftRadius' ||\n key === 'border-bottom-right-radius' ||\n key === 'borderBottomRightRadius'\n ) {\n checkCornerRadius()\n }\n\n if (key === 'opacity') {\n checkOpacity()\n }\n\n if (key === 'visibility' || key === 'display') {\n checkHtmlVisible()\n }\n\n return ret\n },\n get: function (target, prop: string) {\n if (typeof target[prop as keyof CSSStyleDeclaration] === 'function') {\n return function (this: any, ...args: any[]) {\n if (prop === 'setProperty') {\n const [property, value] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n } else if (prop === 'removeProperty') {\n const [property] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle('none')\n }\n }\n return (target[prop as keyof CSSStyleDeclaration] as Function)(\n ...args,\n )\n }\n }\n return Reflect.get(target, prop)\n },\n })\n Object.defineProperty(document.documentElement, 'style', {\n get: function () {\n return styleProxy\n },\n })\n}\n\nfunction monitorExternalStyleChange() {\n const headObserver = new MutationObserver(function (mutationsList) {\n for (const mutation of mutationsList) {\n if (mutation.type === 'childList') {\n let needCheck = false\n mutation.addedNodes.forEach(node => {\n if (\n node.nodeName === 'LINK' &&\n (node as HTMLLinkElement).rel === 'stylesheet'\n ) {\n needCheck = true\n }\n\n if (node.nodeName === 'STYLE') {\n needCheck = true\n }\n })\n\n mutation.removedNodes.forEach(node => {\n if (\n node.nodeName === 'LINK' &&\n (node as HTMLLinkElement).rel === 'stylesheet'\n ) {\n needCheck = true\n }\n })\n\n if (needCheck) {\n checkCSSProperties()\n }\n }\n }\n })\n\n headObserver.observe(document.head, { childList: true, subtree: true })\n}\n\nfunction checkCSSProperties() {\n checkHtmlBackgroundMaterial()\n checkCornerRadius()\n checkOpacity()\n checkHtmlVisible()\n window.addEventListener('resize', checkHtmlVisible)\n}\n\nfunction hijackGetComputedStyle() {\n const rawFn = window.getComputedStyle.bind(window)\n window.getComputedStyle = (element, pseudoElt) => {\n if ((element as any).__isSpatialDiv) {\n return (element as any).__getComputedStyle(rawFn, pseudoElt)\n }\n return rawFn(element, pseudoElt)\n }\n}\n\nfunction hijackWindowOpen() {\n XRApp.getInstance().init()\n}\n\nexport function spatialPolyfill() {\n if (!isWebSpatialEnv) {\n return\n }\n\n injectSceneHook()\n hijackWindowOpen()\n checkCSSProperties()\n hijackGetComputedStyle()\n hijackDocumentElementStyle()\n monitorExternalStyleChange()\n}\n","import { defaultSceneConfig, XRApp, getSession } from '@webspatial/react-sdk'\n\nexport async function injectSceneHook() {\n if (!window.opener) return\n if ((window as any)._SceneHookOff) return\n\n await getSession()?.setLoading('show')\n // see this flag, we have done create the root scene\n\n function onContentLoaded(callback: any) {\n if (\n document.readyState === 'interactive' ||\n document.readyState === 'complete'\n ) {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n }\n\n onContentLoaded(async () => {\n let cfg = defaultSceneConfig\n if (typeof (window as any).xrCurrentSceneDefaults === 'function') {\n try {\n cfg = await (window as any).xrCurrentSceneDefaults?.()\n } catch (error) {\n console.error(error)\n }\n }\n // fixme: this duration is too short so that hide and show is at racing, so add a little delay to avoid\n await new Promise((resolve, reject) => {\n setTimeout(() => {\n resolve(null)\n }, 1000)\n })\n await getSession()?.setLoading('hide')\n await XRApp.getInstance().show(window, cfg)\n })\n}\n","import { spatialPolyfill } from './spatialPolyfill'\n\nspatialPolyfill()\n\nexport { Fragment } from 'react/jsx-runtime'\nexport { jsxDEV, jsx } from './jsx-shared'\n\nexport type { WebSpatialJSX as JSX } from './jsx-namespace'\n","import { jsxDEV as _jsxDEV, JSXSource } from 'react/jsx-dev-runtime'\nimport reactJSXRuntime from 'react/jsx-runtime'\n//@ts-ignore bypass ts check for external\nimport { withCSSSpatial, withSpatialMonitor } from '@webspatial/react-sdk'\nconst attributeFlag = 'enable-xr'\nconst styleFlag = 'enableXr'\nconst classFlag = '__enableXr__'\nconst xrMonitorFlag = 'enable-xr-monitor'\n\nexport function replaceToSpatialPrimitiveType(\n type: React.ElementType,\n props: unknown,\n) {\n const propsObject = props as Record<string, any>\n if (attributeFlag in propsObject) {\n delete propsObject[attributeFlag]\n return withCSSSpatial(type)\n }\n\n if (xrMonitorFlag in propsObject) {\n delete propsObject[xrMonitorFlag]\n return withSpatialMonitor(type)\n }\n\n if (propsObject && propsObject.style && styleFlag in propsObject.style) {\n delete propsObject.style[styleFlag]\n return withCSSSpatial(type)\n }\n\n if (propsObject && propsObject.className) {\n const originalClassNames = propsObject.className.split(' ')\n const idx = originalClassNames.indexOf(classFlag)\n if (idx !== -1) {\n originalClassNames.splice(idx, 1)\n propsObject.className = originalClassNames.join(' ')\n return withCSSSpatial(type)\n }\n }\n\n return type\n}\n\nexport function jsxs(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsxs(type, props, key)\n}\n\nexport function jsx(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsx(type, props, key)\n}\n\nexport function jsxDEV(\n type: React.ElementType,\n props: unknown,\n key: React.Key,\n isStatic: boolean,\n source?: JSXSource,\n self?: unknown,\n) {\n type = replaceToSpatialPrimitiveType(type, props)\n return _jsxDEV(type, props, key, isStatic, source, self)\n}\n"],"mappings":"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","names":["getSession","XRApp","getSession","XRApp"]}
|
|
1
|
+
{"version":3,"sources":["../../src/jsx/spatialPolyfill.ts","../../src/jsx/injectSceneHook.ts","../../src/jsx/jsx-dev-runtime.ts","../../src/jsx/jsx-shared.ts"],"sourcesContent":["import { getSession, parseCornerRadius, XRApp } from '@webspatial/react-sdk'\nimport { injectSceneHook } from './injectSceneHook'\n\nconst isWebSpatialEnv = getSession() !== null\n\nconst SpatialGlobalCustomVars = {\n backgroundMaterial: '--xr-background-material',\n}\n\n// keep track of current html background material\nlet htmlBackgroundMaterial = ''\nfunction setCurrentWindowStyle(backgroundMaterial: string) {\n if (backgroundMaterial !== htmlBackgroundMaterial) {\n const session = getSession()!\n session.getCurrentWindowComponent().setStyle({\n material: { type: backgroundMaterial as any },\n })\n htmlBackgroundMaterial = backgroundMaterial\n }\n}\n\nfunction checkHtmlBackgroundMaterial() {\n const computedStyle = getComputedStyle(document.documentElement)\n\n const backgroundMaterial = computedStyle.getPropertyValue(\n SpatialGlobalCustomVars.backgroundMaterial,\n )\n\n setCurrentWindowStyle(backgroundMaterial || 'none')\n}\n\n// keep track of current corner radius\nlet htmlCornerRadius = {\n topLeading: 0,\n bottomLeading: 0,\n topTrailing: 0,\n bottomTrailing: 0,\n}\nfunction checkCornerRadius() {\n const computedStyle = getComputedStyle(document.documentElement)\n const cornerRadius = parseCornerRadius(computedStyle)\n setCornerRadius(cornerRadius)\n}\n\nfunction setCornerRadius(cornerRadius: any) {\n if (\n htmlCornerRadius.topLeading !== cornerRadius.topLeading ||\n htmlCornerRadius.bottomLeading !== cornerRadius.bottomLeading ||\n htmlCornerRadius.topTrailing !== cornerRadius.topTrailing ||\n htmlCornerRadius.bottomTrailing !== cornerRadius.bottomTrailing\n ) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setStyle({\n cornerRadius,\n })\n htmlCornerRadius.topLeading = cornerRadius.topLeading\n htmlCornerRadius.bottomLeading = cornerRadius.bottomLeading\n htmlCornerRadius.topTrailing = cornerRadius.topTrailing\n htmlCornerRadius.bottomTrailing = cornerRadius.bottomTrailing\n }\n}\n\nfunction setOpacity(opacity: number) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setOpacity(opacity)\n}\n\nfunction checkOpacity() {\n const computedStyle = getComputedStyle(document.documentElement)\n const opacity = parseFloat(computedStyle.getPropertyValue('opacity'))\n setOpacity(opacity)\n}\n\nasync function setHtmlVisible(visible: boolean) {\n const session = getSession()!\n if (!session) return\n const wc = session.getCurrentWindowComponent()\n const ent = await wc.getEntity()\n ent?.setVisible(visible)\n}\n\nfunction checkHtmlVisible() {\n const computedStyle = getComputedStyle(document.documentElement)\n const visibility = computedStyle.getPropertyValue('visibility') !== 'hidden'\n const widthGtZero = parseFloat(computedStyle.getPropertyValue('width')) > 0\n setHtmlVisible(visibility && widthGtZero)\n}\n\nfunction hijackDocumentElementStyle() {\n const rawDocumentStyle = document.documentElement.style\n const styleProxy = new Proxy(rawDocumentStyle, {\n set: function (target, key, value) {\n const ret = Reflect.set(target, key, value)\n\n if (key === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n\n if (\n key === 'border-radius' ||\n key === 'borderRadius' ||\n key === 'border-top-left-radius' ||\n key === 'borderTopLeftRadius' ||\n key === 'border-top-right-radius' ||\n key === 'borderTopRightRadius' ||\n key === 'border-bottom-left-radius' ||\n key === 'borderBottomLeftRadius' ||\n key === 'border-bottom-right-radius' ||\n key === 'borderBottomRightRadius'\n ) {\n checkCornerRadius()\n }\n\n if (key === 'opacity') {\n checkOpacity()\n }\n\n if (key === 'visibility' || key === 'display') {\n checkHtmlVisible()\n }\n\n return ret\n },\n get: function (target, prop: string) {\n if (typeof target[prop as keyof CSSStyleDeclaration] === 'function') {\n return function (this: any, ...args: any[]) {\n if (prop === 'setProperty') {\n const [property, value] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n } else if (prop === 'removeProperty') {\n const [property] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle('none')\n }\n }\n return (target[prop as keyof CSSStyleDeclaration] as Function)(\n ...args,\n )\n }\n }\n return Reflect.get(target, prop)\n },\n })\n Object.defineProperty(document.documentElement, 'style', {\n get: function () {\n return styleProxy\n },\n })\n}\n\nfunction monitorExternalStyleChange() {\n const headObserver = new MutationObserver(function (mutationsList) {\n checkCSSProperties()\n })\n\n headObserver.observe(document.head, { childList: true, subtree: true })\n}\n\nfunction checkCSSProperties() {\n checkHtmlBackgroundMaterial()\n checkCornerRadius()\n checkOpacity()\n checkHtmlVisible()\n window.addEventListener('resize', checkHtmlVisible)\n}\n\nfunction hijackGetComputedStyle() {\n const rawFn = window.getComputedStyle.bind(window)\n window.getComputedStyle = (element, pseudoElt) => {\n if ((element as any).__isSpatialDiv) {\n return (element as any).__getComputedStyle(rawFn, pseudoElt)\n }\n return rawFn(element, pseudoElt)\n }\n}\n\nfunction hijackWindowOpen() {\n XRApp.getInstance().init()\n}\n\nexport function spatialPolyfill() {\n if (!isWebSpatialEnv) {\n return\n }\n\n injectSceneHook()\n hijackWindowOpen()\n checkCSSProperties()\n hijackGetComputedStyle()\n hijackDocumentElementStyle()\n monitorExternalStyleChange()\n}\n","import { defaultSceneConfig, XRApp, getSession } from '@webspatial/react-sdk'\n\nexport async function injectSceneHook() {\n if (!window.opener) return\n if ((window as any)._SceneHookOff) return\n\n await getSession()?.setLoading('show')\n // see this flag, we have done create the root scene\n\n function onContentLoaded(callback: any) {\n if (\n document.readyState === 'interactive' ||\n document.readyState === 'complete'\n ) {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n }\n\n onContentLoaded(async () => {\n let cfg = defaultSceneConfig\n if (typeof (window as any).xrCurrentSceneDefaults === 'function') {\n try {\n cfg = await (window as any).xrCurrentSceneDefaults?.()\n } catch (error) {\n console.error(error)\n }\n }\n // fixme: this duration is too short so that hide and show is at racing, so add a little delay to avoid\n await new Promise((resolve, reject) => {\n setTimeout(() => {\n resolve(null)\n }, 1000)\n })\n await getSession()?.setLoading('hide')\n await XRApp.getInstance().show(window, cfg)\n })\n}\n","import { spatialPolyfill } from './spatialPolyfill'\n\nspatialPolyfill()\n\nexport { Fragment } from 'react/jsx-runtime'\nexport { jsxDEV, jsx } from './jsx-shared'\n\nexport type { WebSpatialJSX as JSX } from './jsx-namespace'\nexport * from './xr-css-extension'\n","import { jsxDEV as _jsxDEV, JSXSource } from 'react/jsx-dev-runtime'\nimport reactJSXRuntime from 'react/jsx-runtime'\n//@ts-ignore bypass ts check for external\nimport { withCSSSpatial, withSpatialMonitor } from '@webspatial/react-sdk'\nconst attributeFlag = 'enable-xr'\nconst styleFlag = 'enableXr'\nconst classFlag = '__enableXr__'\nconst xrMonitorFlag = 'enable-xr-monitor'\n\nexport function replaceToSpatialPrimitiveType(\n type: React.ElementType,\n props: unknown,\n) {\n const propsObject = props as Record<string, any>\n if (attributeFlag in propsObject) {\n delete propsObject[attributeFlag]\n return withCSSSpatial(type)\n }\n\n if (xrMonitorFlag in propsObject) {\n delete propsObject[xrMonitorFlag]\n return withSpatialMonitor(type)\n }\n\n if (propsObject && propsObject.style && styleFlag in propsObject.style) {\n delete propsObject.style[styleFlag]\n return withCSSSpatial(type)\n }\n\n if (propsObject && propsObject.className) {\n const originalClassNames = propsObject.className.split(' ')\n const idx = originalClassNames.indexOf(classFlag)\n if (idx !== -1) {\n originalClassNames.splice(idx, 1)\n propsObject.className = originalClassNames.join(' ')\n return withCSSSpatial(type)\n }\n }\n\n return type\n}\n\nexport function jsxs(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsxs(type, props, key)\n}\n\nexport function jsx(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsx(type, props, key)\n}\n\nexport function jsxDEV(\n type: React.ElementType,\n props: unknown,\n key: React.Key,\n isStatic: boolean,\n source?: JSXSource,\n self?: unknown,\n) {\n type = replaceToSpatialPrimitiveType(type, props)\n return _jsxDEV(type, props, key, isStatic, source, self)\n}\n"],"mappings":";AAAA,SAAS,cAAAA,aAAY,mBAAmB,SAAAC,cAAa;;;ACArD,SAAS,oBAAoB,OAAO,kBAAkB;AAEtD,eAAsB,kBAAkB;AACtC,MAAI,CAAC,OAAO,OAAQ;AACpB,MAAK,OAAe,cAAe;AAEnC,QAAM,WAAW,GAAG,WAAW,MAAM;AAGrC,WAAS,gBAAgB,UAAe;AACtC,QACE,SAAS,eAAe,iBACxB,SAAS,eAAe,YACxB;AACA,eAAS;AAAA,IACX,OAAO;AACL,eAAS,iBAAiB,oBAAoB,QAAQ;AAAA,IACxD;AAAA,EACF;AAEA,kBAAgB,YAAY;AAC1B,QAAI,MAAM;AACV,QAAI,OAAQ,OAAe,2BAA2B,YAAY;AAChE,UAAI;AACF,cAAM,MAAO,OAAe,yBAAyB;AAAA,MACvD,SAAS,OAAO;AACd,gBAAQ,MAAM,KAAK;AAAA,MACrB;AAAA,IACF;AAEA,UAAM,IAAI,QAAQ,CAAC,SAAS,WAAW;AACrC,iBAAW,MAAM;AACf,gBAAQ,IAAI;AAAA,MACd,GAAG,GAAI;AAAA,IACT,CAAC;AACD,UAAM,WAAW,GAAG,WAAW,MAAM;AACrC,UAAM,MAAM,YAAY,EAAE,KAAK,QAAQ,GAAG;AAAA,EAC5C,CAAC;AACH;;;ADnCA,IAAM,kBAAkBC,YAAW,MAAM;AAEzC,IAAM,0BAA0B;AAAA,EAC9B,oBAAoB;AACtB;AAGA,IAAI,yBAAyB;AAC7B,SAAS,sBAAsB,oBAA4B;AACzD,MAAI,uBAAuB,wBAAwB;AACjD,UAAM,UAAUA,YAAW;AAC3B,YAAQ,0BAA0B,EAAE,SAAS;AAAA,MAC3C,UAAU,EAAE,MAAM,mBAA0B;AAAA,IAC9C,CAAC;AACD,6BAAyB;AAAA,EAC3B;AACF;AAEA,SAAS,8BAA8B;AACrC,QAAM,gBAAgB,iBAAiB,SAAS,eAAe;AAE/D,QAAM,qBAAqB,cAAc;AAAA,IACvC,wBAAwB;AAAA,EAC1B;AAEA,wBAAsB,sBAAsB,MAAM;AACpD;AAGA,IAAI,mBAAmB;AAAA,EACrB,YAAY;AAAA,EACZ,eAAe;AAAA,EACf,aAAa;AAAA,EACb,gBAAgB;AAClB;AACA,SAAS,oBAAoB;AAC3B,QAAM,gBAAgB,iBAAiB,SAAS,eAAe;AAC/D,QAAM,eAAe,kBAAkB,aAAa;AACpD,kBAAgB,YAAY;AAC9B;AAEA,SAAS,gBAAgB,cAAmB;AAC1C,MACE,iBAAiB,eAAe,aAAa,cAC7C,iBAAiB,kBAAkB,aAAa,iBAChD,iBAAiB,gBAAgB,aAAa,eAC9C,iBAAiB,mBAAmB,aAAa,gBACjD;AACA,UAAM,UAAUA,YAAW;AAC3B,QAAI,CAAC,QAAS;AACd,YAAQ,0BAA0B,EAAE,SAAS;AAAA,MAC3C;AAAA,IACF,CAAC;AACD,qBAAiB,aAAa,aAAa;AAC3C,qBAAiB,gBAAgB,aAAa;AAC9C,qBAAiB,cAAc,aAAa;AAC5C,qBAAiB,iBAAiB,aAAa;AAAA,EACjD;AACF;AAEA,SAAS,WAAW,SAAiB;AACnC,QAAM,UAAUA,YAAW;AAC3B,MAAI,CAAC,QAAS;AACd,UAAQ,0BAA0B,EAAE,WAAW,OAAO;AACxD;AAEA,SAAS,eAAe;AACtB,QAAM,gBAAgB,iBAAiB,SAAS,eAAe;AAC/D,QAAM,UAAU,WAAW,cAAc,iBAAiB,SAAS,CAAC;AACpE,aAAW,OAAO;AACpB;AAEA,eAAe,eAAe,SAAkB;AAC9C,QAAM,UAAUA,YAAW;AAC3B,MAAI,CAAC,QAAS;AACd,QAAM,KAAK,QAAQ,0BAA0B;AAC7C,QAAM,MAAM,MAAM,GAAG,UAAU;AAC/B,OAAK,WAAW,OAAO;AACzB;AAEA,SAAS,mBAAmB;AAC1B,QAAM,gBAAgB,iBAAiB,SAAS,eAAe;AAC/D,QAAM,aAAa,cAAc,iBAAiB,YAAY,MAAM;AACpE,QAAM,cAAc,WAAW,cAAc,iBAAiB,OAAO,CAAC,IAAI;AAC1E,iBAAe,cAAc,WAAW;AAC1C;AAEA,SAAS,6BAA6B;AACpC,QAAM,mBAAmB,SAAS,gBAAgB;AAClD,QAAM,aAAa,IAAI,MAAM,kBAAkB;AAAA,IAC7C,KAAK,SAAU,QAAQ,KAAK,OAAO;AACjC,YAAM,MAAM,QAAQ,IAAI,QAAQ,KAAK,KAAK;AAE1C,UAAI,QAAQ,wBAAwB,oBAAoB;AACtD,8BAAsB,KAAK;AAAA,MAC7B;AAEA,UACE,QAAQ,mBACR,QAAQ,kBACR,QAAQ,4BACR,QAAQ,yBACR,QAAQ,6BACR,QAAQ,0BACR,QAAQ,+BACR,QAAQ,4BACR,QAAQ,gCACR,QAAQ,2BACR;AACA,0BAAkB;AAAA,MACpB;AAEA,UAAI,QAAQ,WAAW;AACrB,qBAAa;AAAA,MACf;AAEA,UAAI,QAAQ,gBAAgB,QAAQ,WAAW;AAC7C,yBAAiB;AAAA,MACnB;AAEA,aAAO;AAAA,IACT;AAAA,IACA,KAAK,SAAU,QAAQ,MAAc;AACnC,UAAI,OAAO,OAAO,IAAiC,MAAM,YAAY;AACnE,eAAO,YAAwB,MAAa;AAC1C,cAAI,SAAS,eAAe;AAC1B,kBAAM,CAAC,UAAU,KAAK,IAAI;AAC1B,gBAAI,aAAa,wBAAwB,oBAAoB;AAC3D,oCAAsB,KAAK;AAAA,YAC7B;AAAA,UACF,WAAW,SAAS,kBAAkB;AACpC,kBAAM,CAAC,QAAQ,IAAI;AACnB,gBAAI,aAAa,wBAAwB,oBAAoB;AAC3D,oCAAsB,MAAM;AAAA,YAC9B;AAAA,UACF;AACA,iBAAQ,OAAO,IAAiC;AAAA,YAC9C,GAAG;AAAA,UACL;AAAA,QACF;AAAA,MACF;AACA,aAAO,QAAQ,IAAI,QAAQ,IAAI;AAAA,IACjC;AAAA,EACF,CAAC;AACD,SAAO,eAAe,SAAS,iBAAiB,SAAS;AAAA,IACvD,KAAK,WAAY;AACf,aAAO;AAAA,IACT;AAAA,EACF,CAAC;AACH;AAEA,SAAS,6BAA6B;AACpC,QAAM,eAAe,IAAI,iBAAiB,SAAU,eAAe;AACjE,uBAAmB;AAAA,EACrB,CAAC;AAED,eAAa,QAAQ,SAAS,MAAM,EAAE,WAAW,MAAM,SAAS,KAAK,CAAC;AACxE;AAEA,SAAS,qBAAqB;AAC5B,8BAA4B;AAC5B,oBAAkB;AAClB,eAAa;AACb,mBAAiB;AACjB,SAAO,iBAAiB,UAAU,gBAAgB;AACpD;AAEA,SAAS,yBAAyB;AAChC,QAAM,QAAQ,OAAO,iBAAiB,KAAK,MAAM;AACjD,SAAO,mBAAmB,CAAC,SAAS,cAAc;AAChD,QAAK,QAAgB,gBAAgB;AACnC,aAAQ,QAAgB,mBAAmB,OAAO,SAAS;AAAA,IAC7D;AACA,WAAO,MAAM,SAAS,SAAS;AAAA,EACjC;AACF;AAEA,SAAS,mBAAmB;AAC1B,EAAAC,OAAM,YAAY,EAAE,KAAK;AAC3B;AAEO,SAAS,kBAAkB;AAChC,MAAI,CAAC,iBAAiB;AACpB;AAAA,EACF;AAEA,kBAAgB;AAChB,mBAAiB;AACjB,qBAAmB;AACnB,yBAAuB;AACvB,6BAA2B;AAC3B,6BAA2B;AAC7B;;;AE/LA,SAAS,gBAAgB;;;ACJzB,SAAS,UAAU,eAA0B;AAC7C,OAAO,qBAAqB;AAE5B,SAAS,gBAAgB,0BAA0B;AACnD,IAAM,gBAAgB;AACtB,IAAM,YAAY;AAClB,IAAM,YAAY;AAClB,IAAM,gBAAgB;AAEf,SAAS,8BACd,MACA,OACA;AACA,QAAM,cAAc;AACpB,MAAI,iBAAiB,aAAa;AAChC,WAAO,YAAY,aAAa;AAChC,WAAO,eAAe,IAAI;AAAA,EAC5B;AAEA,MAAI,iBAAiB,aAAa;AAChC,WAAO,YAAY,aAAa;AAChC,WAAO,mBAAmB,IAAI;AAAA,EAChC;AAEA,MAAI,eAAe,YAAY,SAAS,aAAa,YAAY,OAAO;AACtE,WAAO,YAAY,MAAM,SAAS;AAClC,WAAO,eAAe,IAAI;AAAA,EAC5B;AAEA,MAAI,eAAe,YAAY,WAAW;AACxC,UAAM,qBAAqB,YAAY,UAAU,MAAM,GAAG;AAC1D,UAAM,MAAM,mBAAmB,QAAQ,SAAS;AAChD,QAAI,QAAQ,IAAI;AACd,yBAAmB,OAAO,KAAK,CAAC;AAChC,kBAAY,YAAY,mBAAmB,KAAK,GAAG;AACnD,aAAO,eAAe,IAAI;AAAA,IAC5B;AAAA,EACF;AAEA,SAAO;AACT;AAOO,SAAS,IAAI,MAAyB,OAAgB,KAAiB;AAC5E,SAAO,8BAA8B,MAAM,KAAK;AAChD,SAAO,gBAAgB,IAAI,MAAM,OAAO,GAAG;AAC7C;AAEO,SAAS,OACd,MACA,OACA,KACA,UACA,QACA,MACA;AACA,SAAO,8BAA8B,MAAM,KAAK;AAChD,SAAO,QAAQ,MAAM,OAAO,KAAK,UAAU,QAAQ,IAAI;AACzD;;;AD5DA,gBAAgB;","names":["getSession","XRApp","getSession","XRApp"]}
|
|
@@ -54,4 +54,12 @@ declare module 'react' {
|
|
|
54
54
|
}
|
|
55
55
|
}
|
|
56
56
|
|
|
57
|
+
declare global {
|
|
58
|
+
interface CSSStyleDeclaration {
|
|
59
|
+
'--xr-background-material'?: string;
|
|
60
|
+
'--xr-back'?: number | string;
|
|
61
|
+
'--xr-z-index'?: number | string;
|
|
62
|
+
}
|
|
63
|
+
}
|
|
64
|
+
|
|
57
65
|
export { WebSpatialJSX as W, jsx as a, jsxs as b, jsxDEV as j };
|
package/dist/jsx/jsx-runtime.js
CHANGED
|
@@ -151,27 +151,7 @@ function hijackDocumentElementStyle() {
|
|
|
151
151
|
}
|
|
152
152
|
function monitorExternalStyleChange() {
|
|
153
153
|
const headObserver = new MutationObserver(function(mutationsList) {
|
|
154
|
-
|
|
155
|
-
if (mutation.type === "childList") {
|
|
156
|
-
let needCheck = false;
|
|
157
|
-
mutation.addedNodes.forEach((node) => {
|
|
158
|
-
if (node.nodeName === "LINK" && node.rel === "stylesheet") {
|
|
159
|
-
needCheck = true;
|
|
160
|
-
}
|
|
161
|
-
if (node.nodeName === "STYLE") {
|
|
162
|
-
needCheck = true;
|
|
163
|
-
}
|
|
164
|
-
});
|
|
165
|
-
mutation.removedNodes.forEach((node) => {
|
|
166
|
-
if (node.nodeName === "LINK" && node.rel === "stylesheet") {
|
|
167
|
-
needCheck = true;
|
|
168
|
-
}
|
|
169
|
-
});
|
|
170
|
-
if (needCheck) {
|
|
171
|
-
checkCSSProperties();
|
|
172
|
-
}
|
|
173
|
-
}
|
|
174
|
-
}
|
|
154
|
+
checkCSSProperties();
|
|
175
155
|
});
|
|
176
156
|
headObserver.observe(document.head, { childList: true, subtree: true });
|
|
177
157
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/jsx/spatialPolyfill.ts","../../src/jsx/injectSceneHook.ts","../../src/jsx/jsx-runtime.ts","../../src/jsx/jsx-shared.ts"],"sourcesContent":["import { getSession, parseCornerRadius, XRApp } from '@webspatial/react-sdk'\nimport { injectSceneHook } from './injectSceneHook'\n\nconst isWebSpatialEnv = getSession() !== null\n\nconst SpatialGlobalCustomVars = {\n backgroundMaterial: '--xr-background-material',\n}\n\n// keep track of current html background material\nlet htmlBackgroundMaterial = ''\nfunction setCurrentWindowStyle(backgroundMaterial: string) {\n if (backgroundMaterial !== htmlBackgroundMaterial) {\n const session = getSession()!\n session.getCurrentWindowComponent().setStyle({\n material: { type: backgroundMaterial as any },\n })\n htmlBackgroundMaterial = backgroundMaterial\n }\n}\n\nfunction checkHtmlBackgroundMaterial() {\n const computedStyle = getComputedStyle(document.documentElement)\n\n const backgroundMaterial = computedStyle.getPropertyValue(\n SpatialGlobalCustomVars.backgroundMaterial,\n )\n\n setCurrentWindowStyle(backgroundMaterial || 'none')\n}\n\n// keep track of current corner radius\nlet htmlCornerRadius = {\n topLeading: 0,\n bottomLeading: 0,\n topTrailing: 0,\n bottomTrailing: 0,\n}\nfunction checkCornerRadius() {\n const computedStyle = getComputedStyle(document.documentElement)\n const cornerRadius = parseCornerRadius(computedStyle)\n setCornerRadius(cornerRadius)\n}\n\nfunction setCornerRadius(cornerRadius: any) {\n if (\n htmlCornerRadius.topLeading !== cornerRadius.topLeading ||\n htmlCornerRadius.bottomLeading !== cornerRadius.bottomLeading ||\n htmlCornerRadius.topTrailing !== cornerRadius.topTrailing ||\n htmlCornerRadius.bottomTrailing !== cornerRadius.bottomTrailing\n ) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setStyle({\n cornerRadius,\n })\n htmlCornerRadius.topLeading = cornerRadius.topLeading\n htmlCornerRadius.bottomLeading = cornerRadius.bottomLeading\n htmlCornerRadius.topTrailing = cornerRadius.topTrailing\n htmlCornerRadius.bottomTrailing = cornerRadius.bottomTrailing\n }\n}\n\nfunction setOpacity(opacity: number) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setOpacity(opacity)\n}\n\nfunction checkOpacity() {\n const computedStyle = getComputedStyle(document.documentElement)\n const opacity = parseFloat(computedStyle.getPropertyValue('opacity'))\n setOpacity(opacity)\n}\n\nasync function setHtmlVisible(visible: boolean) {\n const session = getSession()!\n if (!session) return\n const wc = session.getCurrentWindowComponent()\n const ent = await wc.getEntity()\n ent?.setVisible(visible)\n}\n\nfunction checkHtmlVisible() {\n const computedStyle = getComputedStyle(document.documentElement)\n const visibility = computedStyle.getPropertyValue('visibility') !== 'hidden'\n const widthGtZero = parseFloat(computedStyle.getPropertyValue('width')) > 0\n setHtmlVisible(visibility && widthGtZero)\n}\n\nfunction hijackDocumentElementStyle() {\n const rawDocumentStyle = document.documentElement.style\n const styleProxy = new Proxy(rawDocumentStyle, {\n set: function (target, key, value) {\n const ret = Reflect.set(target, key, value)\n\n if (key === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n\n if (\n key === 'border-radius' ||\n key === 'borderRadius' ||\n key === 'border-top-left-radius' ||\n key === 'borderTopLeftRadius' ||\n key === 'border-top-right-radius' ||\n key === 'borderTopRightRadius' ||\n key === 'border-bottom-left-radius' ||\n key === 'borderBottomLeftRadius' ||\n key === 'border-bottom-right-radius' ||\n key === 'borderBottomRightRadius'\n ) {\n checkCornerRadius()\n }\n\n if (key === 'opacity') {\n checkOpacity()\n }\n\n if (key === 'visibility' || key === 'display') {\n checkHtmlVisible()\n }\n\n return ret\n },\n get: function (target, prop: string) {\n if (typeof target[prop as keyof CSSStyleDeclaration] === 'function') {\n return function (this: any, ...args: any[]) {\n if (prop === 'setProperty') {\n const [property, value] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n } else if (prop === 'removeProperty') {\n const [property] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle('none')\n }\n }\n return (target[prop as keyof CSSStyleDeclaration] as Function)(\n ...args,\n )\n }\n }\n return Reflect.get(target, prop)\n },\n })\n Object.defineProperty(document.documentElement, 'style', {\n get: function () {\n return styleProxy\n },\n })\n}\n\nfunction monitorExternalStyleChange() {\n const headObserver = new MutationObserver(function (mutationsList) {\n for (const mutation of mutationsList) {\n if (mutation.type === 'childList') {\n let needCheck = false\n mutation.addedNodes.forEach(node => {\n if (\n node.nodeName === 'LINK' &&\n (node as HTMLLinkElement).rel === 'stylesheet'\n ) {\n needCheck = true\n }\n\n if (node.nodeName === 'STYLE') {\n needCheck = true\n }\n })\n\n mutation.removedNodes.forEach(node => {\n if (\n node.nodeName === 'LINK' &&\n (node as HTMLLinkElement).rel === 'stylesheet'\n ) {\n needCheck = true\n }\n })\n\n if (needCheck) {\n checkCSSProperties()\n }\n }\n }\n })\n\n headObserver.observe(document.head, { childList: true, subtree: true })\n}\n\nfunction checkCSSProperties() {\n checkHtmlBackgroundMaterial()\n checkCornerRadius()\n checkOpacity()\n checkHtmlVisible()\n window.addEventListener('resize', checkHtmlVisible)\n}\n\nfunction hijackGetComputedStyle() {\n const rawFn = window.getComputedStyle.bind(window)\n window.getComputedStyle = (element, pseudoElt) => {\n if ((element as any).__isSpatialDiv) {\n return (element as any).__getComputedStyle(rawFn, pseudoElt)\n }\n return rawFn(element, pseudoElt)\n }\n}\n\nfunction hijackWindowOpen() {\n XRApp.getInstance().init()\n}\n\nexport function spatialPolyfill() {\n if (!isWebSpatialEnv) {\n return\n }\n\n injectSceneHook()\n hijackWindowOpen()\n checkCSSProperties()\n hijackGetComputedStyle()\n hijackDocumentElementStyle()\n monitorExternalStyleChange()\n}\n","import { defaultSceneConfig, XRApp, getSession } from '@webspatial/react-sdk'\n\nexport async function injectSceneHook() {\n if (!window.opener) return\n if ((window as any)._SceneHookOff) return\n\n await getSession()?.setLoading('show')\n // see this flag, we have done create the root scene\n\n function onContentLoaded(callback: any) {\n if (\n document.readyState === 'interactive' ||\n document.readyState === 'complete'\n ) {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n }\n\n onContentLoaded(async () => {\n let cfg = defaultSceneConfig\n if (typeof (window as any).xrCurrentSceneDefaults === 'function') {\n try {\n cfg = await (window as any).xrCurrentSceneDefaults?.()\n } catch (error) {\n console.error(error)\n }\n }\n // fixme: this duration is too short so that hide and show is at racing, so add a little delay to avoid\n await new Promise((resolve, reject) => {\n setTimeout(() => {\n resolve(null)\n }, 1000)\n })\n await getSession()?.setLoading('hide')\n await XRApp.getInstance().show(window, cfg)\n })\n}\n","import { spatialPolyfill } from './spatialPolyfill'\n\nspatialPolyfill()\n\nexport { Fragment } from 'react/jsx-runtime'\nexport { jsx, jsxs } from './jsx-shared'\n\nexport type { WebSpatialJSX as JSX } from './jsx-namespace'\n","import { jsxDEV as _jsxDEV, JSXSource } from 'react/jsx-dev-runtime'\nimport reactJSXRuntime from 'react/jsx-runtime'\n//@ts-ignore bypass ts check for external\nimport { withCSSSpatial, withSpatialMonitor } from '@webspatial/react-sdk'\nconst attributeFlag = 'enable-xr'\nconst styleFlag = 'enableXr'\nconst classFlag = '__enableXr__'\nconst xrMonitorFlag = 'enable-xr-monitor'\n\nexport function replaceToSpatialPrimitiveType(\n type: React.ElementType,\n props: unknown,\n) {\n const propsObject = props as Record<string, any>\n if (attributeFlag in propsObject) {\n delete propsObject[attributeFlag]\n return withCSSSpatial(type)\n }\n\n if (xrMonitorFlag in propsObject) {\n delete propsObject[xrMonitorFlag]\n return withSpatialMonitor(type)\n }\n\n if (propsObject && propsObject.style && styleFlag in propsObject.style) {\n delete propsObject.style[styleFlag]\n return withCSSSpatial(type)\n }\n\n if (propsObject && propsObject.className) {\n const originalClassNames = propsObject.className.split(' ')\n const idx = originalClassNames.indexOf(classFlag)\n if (idx !== -1) {\n originalClassNames.splice(idx, 1)\n propsObject.className = originalClassNames.join(' ')\n return withCSSSpatial(type)\n }\n }\n\n return type\n}\n\nexport function jsxs(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsxs(type, props, key)\n}\n\nexport function jsx(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsx(type, props, key)\n}\n\nexport function jsxDEV(\n type: React.ElementType,\n props: unknown,\n key: React.Key,\n isStatic: boolean,\n source?: JSXSource,\n self?: unknown,\n) {\n type = replaceToSpatialPrimitiveType(type, props)\n return _jsxDEV(type, props, key, isStatic, source, self)\n}\n"],"mappings":"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","names":["getSession","XRApp","getSession","XRApp"]}
|
|
1
|
+
{"version":3,"sources":["../../src/jsx/spatialPolyfill.ts","../../src/jsx/injectSceneHook.ts","../../src/jsx/jsx-runtime.ts","../../src/jsx/jsx-shared.ts"],"sourcesContent":["import { getSession, parseCornerRadius, XRApp } from '@webspatial/react-sdk'\nimport { injectSceneHook } from './injectSceneHook'\n\nconst isWebSpatialEnv = getSession() !== null\n\nconst SpatialGlobalCustomVars = {\n backgroundMaterial: '--xr-background-material',\n}\n\n// keep track of current html background material\nlet htmlBackgroundMaterial = ''\nfunction setCurrentWindowStyle(backgroundMaterial: string) {\n if (backgroundMaterial !== htmlBackgroundMaterial) {\n const session = getSession()!\n session.getCurrentWindowComponent().setStyle({\n material: { type: backgroundMaterial as any },\n })\n htmlBackgroundMaterial = backgroundMaterial\n }\n}\n\nfunction checkHtmlBackgroundMaterial() {\n const computedStyle = getComputedStyle(document.documentElement)\n\n const backgroundMaterial = computedStyle.getPropertyValue(\n SpatialGlobalCustomVars.backgroundMaterial,\n )\n\n setCurrentWindowStyle(backgroundMaterial || 'none')\n}\n\n// keep track of current corner radius\nlet htmlCornerRadius = {\n topLeading: 0,\n bottomLeading: 0,\n topTrailing: 0,\n bottomTrailing: 0,\n}\nfunction checkCornerRadius() {\n const computedStyle = getComputedStyle(document.documentElement)\n const cornerRadius = parseCornerRadius(computedStyle)\n setCornerRadius(cornerRadius)\n}\n\nfunction setCornerRadius(cornerRadius: any) {\n if (\n htmlCornerRadius.topLeading !== cornerRadius.topLeading ||\n htmlCornerRadius.bottomLeading !== cornerRadius.bottomLeading ||\n htmlCornerRadius.topTrailing !== cornerRadius.topTrailing ||\n htmlCornerRadius.bottomTrailing !== cornerRadius.bottomTrailing\n ) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setStyle({\n cornerRadius,\n })\n htmlCornerRadius.topLeading = cornerRadius.topLeading\n htmlCornerRadius.bottomLeading = cornerRadius.bottomLeading\n htmlCornerRadius.topTrailing = cornerRadius.topTrailing\n htmlCornerRadius.bottomTrailing = cornerRadius.bottomTrailing\n }\n}\n\nfunction setOpacity(opacity: number) {\n const session = getSession()!\n if (!session) return\n session.getCurrentWindowComponent().setOpacity(opacity)\n}\n\nfunction checkOpacity() {\n const computedStyle = getComputedStyle(document.documentElement)\n const opacity = parseFloat(computedStyle.getPropertyValue('opacity'))\n setOpacity(opacity)\n}\n\nasync function setHtmlVisible(visible: boolean) {\n const session = getSession()!\n if (!session) return\n const wc = session.getCurrentWindowComponent()\n const ent = await wc.getEntity()\n ent?.setVisible(visible)\n}\n\nfunction checkHtmlVisible() {\n const computedStyle = getComputedStyle(document.documentElement)\n const visibility = computedStyle.getPropertyValue('visibility') !== 'hidden'\n const widthGtZero = parseFloat(computedStyle.getPropertyValue('width')) > 0\n setHtmlVisible(visibility && widthGtZero)\n}\n\nfunction hijackDocumentElementStyle() {\n const rawDocumentStyle = document.documentElement.style\n const styleProxy = new Proxy(rawDocumentStyle, {\n set: function (target, key, value) {\n const ret = Reflect.set(target, key, value)\n\n if (key === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n\n if (\n key === 'border-radius' ||\n key === 'borderRadius' ||\n key === 'border-top-left-radius' ||\n key === 'borderTopLeftRadius' ||\n key === 'border-top-right-radius' ||\n key === 'borderTopRightRadius' ||\n key === 'border-bottom-left-radius' ||\n key === 'borderBottomLeftRadius' ||\n key === 'border-bottom-right-radius' ||\n key === 'borderBottomRightRadius'\n ) {\n checkCornerRadius()\n }\n\n if (key === 'opacity') {\n checkOpacity()\n }\n\n if (key === 'visibility' || key === 'display') {\n checkHtmlVisible()\n }\n\n return ret\n },\n get: function (target, prop: string) {\n if (typeof target[prop as keyof CSSStyleDeclaration] === 'function') {\n return function (this: any, ...args: any[]) {\n if (prop === 'setProperty') {\n const [property, value] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle(value)\n }\n } else if (prop === 'removeProperty') {\n const [property] = args\n if (property === SpatialGlobalCustomVars.backgroundMaterial) {\n setCurrentWindowStyle('none')\n }\n }\n return (target[prop as keyof CSSStyleDeclaration] as Function)(\n ...args,\n )\n }\n }\n return Reflect.get(target, prop)\n },\n })\n Object.defineProperty(document.documentElement, 'style', {\n get: function () {\n return styleProxy\n },\n })\n}\n\nfunction monitorExternalStyleChange() {\n const headObserver = new MutationObserver(function (mutationsList) {\n checkCSSProperties()\n })\n\n headObserver.observe(document.head, { childList: true, subtree: true })\n}\n\nfunction checkCSSProperties() {\n checkHtmlBackgroundMaterial()\n checkCornerRadius()\n checkOpacity()\n checkHtmlVisible()\n window.addEventListener('resize', checkHtmlVisible)\n}\n\nfunction hijackGetComputedStyle() {\n const rawFn = window.getComputedStyle.bind(window)\n window.getComputedStyle = (element, pseudoElt) => {\n if ((element as any).__isSpatialDiv) {\n return (element as any).__getComputedStyle(rawFn, pseudoElt)\n }\n return rawFn(element, pseudoElt)\n }\n}\n\nfunction hijackWindowOpen() {\n XRApp.getInstance().init()\n}\n\nexport function spatialPolyfill() {\n if (!isWebSpatialEnv) {\n return\n }\n\n injectSceneHook()\n hijackWindowOpen()\n checkCSSProperties()\n hijackGetComputedStyle()\n hijackDocumentElementStyle()\n monitorExternalStyleChange()\n}\n","import { defaultSceneConfig, XRApp, getSession } from '@webspatial/react-sdk'\n\nexport async function injectSceneHook() {\n if (!window.opener) return\n if ((window as any)._SceneHookOff) return\n\n await getSession()?.setLoading('show')\n // see this flag, we have done create the root scene\n\n function onContentLoaded(callback: any) {\n if (\n document.readyState === 'interactive' ||\n document.readyState === 'complete'\n ) {\n callback()\n } else {\n document.addEventListener('DOMContentLoaded', callback)\n }\n }\n\n onContentLoaded(async () => {\n let cfg = defaultSceneConfig\n if (typeof (window as any).xrCurrentSceneDefaults === 'function') {\n try {\n cfg = await (window as any).xrCurrentSceneDefaults?.()\n } catch (error) {\n console.error(error)\n }\n }\n // fixme: this duration is too short so that hide and show is at racing, so add a little delay to avoid\n await new Promise((resolve, reject) => {\n setTimeout(() => {\n resolve(null)\n }, 1000)\n })\n await getSession()?.setLoading('hide')\n await XRApp.getInstance().show(window, cfg)\n })\n}\n","import { spatialPolyfill } from './spatialPolyfill'\n\nspatialPolyfill()\n\nexport { Fragment } from 'react/jsx-runtime'\nexport { jsx, jsxs } from './jsx-shared'\n\nexport type { WebSpatialJSX as JSX } from './jsx-namespace'\nexport * from './xr-css-extension'\n","import { jsxDEV as _jsxDEV, JSXSource } from 'react/jsx-dev-runtime'\nimport reactJSXRuntime from 'react/jsx-runtime'\n//@ts-ignore bypass ts check for external\nimport { withCSSSpatial, withSpatialMonitor } from '@webspatial/react-sdk'\nconst attributeFlag = 'enable-xr'\nconst styleFlag = 'enableXr'\nconst classFlag = '__enableXr__'\nconst xrMonitorFlag = 'enable-xr-monitor'\n\nexport function replaceToSpatialPrimitiveType(\n type: React.ElementType,\n props: unknown,\n) {\n const propsObject = props as Record<string, any>\n if (attributeFlag in propsObject) {\n delete propsObject[attributeFlag]\n return withCSSSpatial(type)\n }\n\n if (xrMonitorFlag in propsObject) {\n delete propsObject[xrMonitorFlag]\n return withSpatialMonitor(type)\n }\n\n if (propsObject && propsObject.style && styleFlag in propsObject.style) {\n delete propsObject.style[styleFlag]\n return withCSSSpatial(type)\n }\n\n if (propsObject && propsObject.className) {\n const originalClassNames = propsObject.className.split(' ')\n const idx = originalClassNames.indexOf(classFlag)\n if (idx !== -1) {\n originalClassNames.splice(idx, 1)\n propsObject.className = originalClassNames.join(' ')\n return withCSSSpatial(type)\n }\n }\n\n return type\n}\n\nexport function jsxs(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsxs(type, props, key)\n}\n\nexport function jsx(type: React.ElementType, props: unknown, key?: React.Key) {\n type = replaceToSpatialPrimitiveType(type, props)\n return reactJSXRuntime.jsx(type, props, key)\n}\n\nexport function jsxDEV(\n type: React.ElementType,\n props: unknown,\n key: React.Key,\n isStatic: boolean,\n source?: JSXSource,\n self?: unknown,\n) {\n type = replaceToSpatialPrimitiveType(type, props)\n return _jsxDEV(type, props, key, isStatic, source, self)\n}\n"],"mappings":"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","names":["getSession","XRApp","getSession","XRApp"]}
|
package/dist/web/index.js
CHANGED
|
@@ -142,8 +142,11 @@ var primitives = [
|
|
|
142
142
|
// src/spatial-react-components/SpatialReactComponent/SpatialReactComponent.tsx
|
|
143
143
|
import { forwardRef as forwardRef2, useMemo as useMemo2, useContext as useContext4 } from "react";
|
|
144
144
|
|
|
145
|
+
// src/noRuntime.ts
|
|
146
|
+
var SpatialHelper = {};
|
|
147
|
+
var Spatial = {};
|
|
148
|
+
|
|
145
149
|
// src/utils/getSession.ts
|
|
146
|
-
import { Spatial } from "@webspatial/core-sdk";
|
|
147
150
|
var spatial = null;
|
|
148
151
|
var _currentSession = null;
|
|
149
152
|
function getSession() {
|
|
@@ -2209,7 +2212,6 @@ var CSSSpatialPrimitive = {};
|
|
|
2209
2212
|
var CSSSpatialDiv = CSSSpatialPrimitive.div;
|
|
2210
2213
|
|
|
2211
2214
|
// src/spatial-react-components/SpatialView.tsx
|
|
2212
|
-
import { SpatialHelper } from "@webspatial/core-sdk";
|
|
2213
2215
|
import {
|
|
2214
2216
|
useRef as useRef7,
|
|
2215
2217
|
useImperativeHandle,
|