npm - @vertexvis/viewer - Versions diffs - 0.20.3-canary.1 → 0.20.3 - Mend

@vertexvis/viewer 0.20.3-canary.1 → 0.20.3

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.

Files changed (17) hide show

package/dist/cjs/vertex-viewer-dom-element_2.cjs.entry.js CHANGED Viewed

@@ -226,12 +226,15 @@ const ViewerDomElement = class {
 ViewerDomElement.style = viewerDomElementCss;
 function isVertexViewerDomElement(el) {
-  return (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT');
+  return (el instanceof HTMLElement &&
+    el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&
+    el.matrix != null);
 }
 function isVertexViewerDomGroup(el) {
-  return ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
-    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null));
+  return (((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
+    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&
+    el.matrix != null);
 }
 // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist/cjs/vertex-viewer-dom-element_2.cjs.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"vertex-viewer-dom-element.vertex-viewer-dom-renderer.entry.cjs.js","mappings":";;;;;;;;;;;;;;;;AAAA,MAAM,mBAAmB,GAAG,0LAA0L;;MC2BzM,gBAAgB;EAL7B;;;;;;IAUS,aAAQ,GAAoBA,kBAAO,CAAC,MAAM,EAAE,CAAC;;;;;;IAgB7C,iBAAY,GAAG,EAAE,CAAC;;;;IA4ClB,eAAU,GAA0BC,qBAAU,CAAC,MAAM,EAAE,CAAC;;;;;;IAgBxD,mBAAc,GAAG,EAAE,CAAC;;;;IAcpB,UAAK,GAAoBD,kBAAO,CAAC,MAAM,CAAC,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;;;;;;IAgBjD,cAAS,GAAG,EAAE,CAAC;;;;IA2Bf,WAAM,GAAoBE,kBAAO,CAAC,YAAY,EAAE,CAAC;;;;;;;IASjD,iBAAY,GAAG,KAAK,CAAC;;;;;;;;;;;;;;;;IAkBrB,aAAQ,GAAG,KAAK,CAAC;;;;;IAOjB,iBAAY,GAAG,KAAK,CAAC;;;;IAMrB,oBAAe,GAAG,KAAK,CAAC;GAqGhC;;;;EA5QW,oBAAoB;IAC5B,IAAI,CAAC,UAAU,EAAE,CAAC;GACnB;;;;EAcS,yBAAyB;IACjC,IAAI,CAAC,YAAY,EAAE,CAAC;GACrB;;;;EAYS,qBAAqB;IAC7B,IAAI,CAAC,0BAA0B,EAAE,CAAC;GACnC;;;;EAcS,yBAAyB;IACjC,IAAI,CAAC,YAAY,EAAE,CAAC;GACrB;;;;EAYS,sBAAsB;IAC9B,IAAI,CAAC,UAAU,EAAE,CAAC;GACnB;;;;EAcS,2BAA2B;IACnC,IAAI,CAAC,cAAc,EAAE,CAAC;GACvB;;;;EAYS,iBAAiB;IACzB,IAAI,CAAC,UAAU,EAAE,CAAC;GACnB;;;;EAcS,sBAAsB;IAC9B,IAAI,CAAC,SAAS,EAAE,CAAC;GAClB;;;;EAMS,mBAAmB,CAC3B,SAA0B,EAC1B,SAA0B;IAE1B,IAAI,CAACC,mBAAO,CAAC,OAAO,CAAC,SAAS,EAAE,SAAS,CAAC,EAAE;MAC1C,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC;KAC5B;GACF;;;;EAyDS,iBAAiB;IACzB,IAAI,CAAC,cAAc,EAAE,CAAC;GACvB;;;;EAKS,qBAAqB,CAC7B,QAAiB,EACjB,QAAiB,EACjB,IAAY;IAEZ,OAAO,IAAI,KAAK,UAAU,CAAC;GAC5B;EAEO,cAAc;IACpB,IAAI,CAAC,YAAY,EAAE,CAAC;IACpB,IAAI,CAAC,YAAY,EAAE,CAAC;IACpB,IAAI,CAAC,cAAc,EAAE,CAAC;IACtB,IAAI,CAAC,SAAS,EAAE,CAAC;IACjB,IAAI,CAAC,UAAU,EAAE,CAAC;GACnB;EAEO,YAAY;IAClB,IAAI,CAAC,QAAQ;MACX,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC;UACxB,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,YAAY,EAAEH,kBAAO,CAAC,QAAQ,CAAC;UACnE,IAAI,CAAC,QAAQ,CAAC;GACrB;EAEO,YAAY;IAClB,IAAI,CAAC,QAAQ;MACX,IAAI,CAAC,YAAY,IAAI,IAAI,IAAI,IAAI,CAAC,YAAY,CAAC,MAAM,GAAG,CAAC;UACrD,IAAI,CAAC,SAAS,CAAC,cAAc,EAAE,IAAI,CAAC,YAAY,EAAEI,gBAAK,CAAC,QAAQ,CAAC;UACjE,IAAI,CAAC,QAAQ,CAAC;IACpB,IAAI,CAAC,0BAA0B,EAAE,CAAC;GACnC;EAEO,0BAA0B;IAChC,IAAI,CAAC,UAAU;MACb,IAAI,CAAC,QAAQ,IAAI,IAAI;UACjBH,qBAAU,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC;UACnC,IAAI,CAAC,UAAU,CAAC;GACvB;EAEO,cAAc;IACpB,IAAI,CAAC,UAAU;MACb,IAAI,CAAC,cAAc,CAAC,MAAM,GAAG,CAAC;UAC1B,IAAI,CAAC,SAAS,CACZ,gBAAgB,EAChB,IAAI,CAAC,cAAc,EACnBA,qBAAU,CAAC,QAAQ,CACpB;UACD,IAAI,CAAC,UAAU,CAAC;GACvB;EAEO,SAAS;IACf,IAAI,CAAC,KAAK;MACR,IAAI,CAAC,SAAS,CAAC,MAAM,GAAG,CAAC;UACrB,IAAI,CAAC,SAAS,CAAC,WAAW,EAAE,IAAI,CAAC,SAAS,EAAED,kBAAO,CAAC,QAAQ,CAAC;UAC7D,IAAI,CAAC,KAAK,CAAC;GAClB;EAEO,UAAU;IAChB,IAAI,CAAC,MAAM,GAAGE,kBAAO,CAAC,OAAO,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,UAAU,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC;GAC3E;EAEO,SAAS,CACf,QAAgB,EAChB,KAAa,EACb,KAAyB;IAEzB,IAAI;MACF,OAAO,KAAK,CAAC,KAAK,CAAC,CAAC;KACrB;IAAC,OAAO,CAAC,EAAE;MACV,OAAO,CAAC,IAAI,CAAC,qBAAqB,QAAQ,mBAAmB,CAAC,CAAC;MAC/D,MAAM,CAAC,CAAC;KACT;GACF;;;;EAKS,MAAM;IACd,QACEG,QAACC,UAAI,QACHD,qBAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;SCjTa,wBAAwB,CACtC,EAAW;EAEX,QACE,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,QAAQ,KAAK,2BAA2B,EACxE;AACJ;;SCNgB,sBAAsB,CACpC,EAAW;EAEX,QACE,CAAC,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,QAAQ,KAAK,yBAAyB;KACtE,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,OAAO,CAAC,iBAAiB,IAAI,IAAI,CAAC,EACnE;AACJ;;ACPA;AAgBO,MAAM,UAAU,GAAwB,CAAC,CAAC,EAAE,QAAQ;EACzD,OAAOA,iBAAK,KAAK,EAAC,SAAS,IAAE,QAAQ,CAAO,CAAC;AAC/C,CAAC,CAAC;SAEc,QAAQ,CACtB,MAAmB,EACnB,iBAAkC,EAClC,QAAkB,EAClB,MAA+B,EAC/B,WAAoC;EAEpC,MAAM,QAAQ,GAAG,gBAAgB,CAAC,MAAM,EAAE,iBAAiB,EAAE,MAAM,CAAC,CAAC,IAAI,CACvE,CAAC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,gBAAgB,GAAG,CAAC,CAAC,gBAAgB,CAClD,CAAC;EAEF,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;IACxC,MAAM,EAAE,OAAO,EAAE,WAAW,EAAE,aAAa,EAAE,GAAG,QAAQ,CAAC,CAAC,CAAC,CAAC;IAE5D,MAAM,QAAQ,GACZ,CAAC,OAAO,CAAC,YAAY,KAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,UAAU,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAA,CAAC;IAC5E,MAAM,QAAQ,GAAG,iBAAiB,CAChC,aAAa,EACb,MAAM,CAAC,oBAAoB,EAC3B,QAAQ,CACT,CAAC;IAEF,eAAe,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;IACnC,WAAW,CAAC,OAAO,EAAE,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;IACzC,QAAQ,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC;IAE9D,OAAO,CAAC,QAAQ,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,KAAK,CAAC;IACrC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;GAChC;AACH,CAAC;AAED,SAAS,gBAAgB,CACvB,OAAoB,EACpB,iBAAkC,EAClC,MAA+B;EAE/B,MAAM,OAAO,GAAG,EAAmB,CAAC;EAEpC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;IAChD,MAAM,KAAK,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAElC,IAAI,sBAAsB,CAAC,KAAK,CAAC,EAAE;MACjC,MAAM,WAAW,GAAGH,kBAAO,CAAC,QAAQ,CAAC,iBAAiB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;MACtE,OAAO,CAAC,IAAI,CAAC,GAAG,gBAAgB,CAAC,KAAK,EAAE,WAAW,EAAE,MAAM,CAAC,CAAC,CAAC;KAC/D;SAAM,IAAI,wBAAwB,CAAC,KAAK,CAAC,EAAE;MAC1C,MAAM,WAAW,GAAGA,kBAAO,CAAC,QAAQ,CAAC,iBAAiB,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;MACtE,MAAM,aAAa,GAAGF,kBAAO,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;MAC9D,MAAM,gBAAgB,GAAGA,kBAAO,CAAC,eAAe,CAC9C,MAAM,CAAC,QAAQ,EACf,aAAa,CACd,CAAC;MACF,OAAO,CAAC,IAAI,CAAC;QACX,OAAO,EAAE,KAAK;QACd,WAAW;QACX,aAAa;QACb,gBAAgB;OACjB,CAAC,CAAC;KACJ;GACF;EAED,OAAO,OAAO,CAAC;AACjB,CAAC;AAED,SAAS,eAAe,CACtB,OAA0C,EAC1C,UAAuB;EAEvB,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG;IACxB,uBAAuB;IACvB,aAAa,UAAU,CAAC,CAAC,OAAO,UAAU,CAAC,CAAC,KAAK;GAClD,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACd,CAAC;AAED,SAAS,WAAW,CAClB,OAA0C,EAC1C,KAAa,EACb,YAAoB;EAEpB,OAAO,CAAC,KAAK,CAAC,MAAM,GAAG,GAAG,YAAY,GAAG,KAAK,EAAE,CAAC;AACnD,CAAC;AAED,SAAS,iBAAiB,CACxB,EAAmB,EACnB,oBAAqC,EACrC,QAAkB;EAElB,MAAM,KAAK,GAAGA,kBAAO,CAAC,eAAe,CAAC,EAAE,EAAE,oBAAoB,CAAC,CAAC;EAChE,OAAO,QAAQ,CAAC,yBAAyB,CAAC,KAAK,CAAC,CAAC;AACnD;;AC5GA;AAcO,MAAM,UAAU,GAA+B,CACpD,EAAE,MAAM,EAAE,QAAQ,EAAE,EACpB,QAAQ;EAER,MAAM,OAAO,GAAGE,kBAAO,CAAC,QAAQ,CAAC,MAAM,CAAC,gBAAgB,CAAC,CAAC;EAC1D,MAAM,IAAI,GAAG,MAAM,CAAC,cAAc,EAAE;MAChC,CAAC,CAAC,MAAM,CAAC,GAAG,GAAG,CAAC,KAAK,MAAM,CAAC,SAAS,GAAG,CAAC,CAAC,KAAK,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC;MACnE,OAAO,CAAC,GAAG,IAAI,QAAQ,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;EACxC,MAAM,eAAe,GAAG;IACtB,cAAc,IAAI,KAAK;IACvB,kBAAkB,CAAC,MAAM,CAAC,UAAU,CAAC;IACrC,aAAa,QAAQ,CAAC,KAAK,GAAG,CAAC,OAAO,QAAQ,CAAC,MAAM,GAAG,CAAC,KAAK;GAC/D,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;EAEZ,QACEG,iBAAK,KAAK,EAAC,SAAS,EAAC,KAAK,EAAE,EAAE,WAAW,EAAE,GAAG,IAAI,IAAI,EAAE;IACtDA,iBAAK,KAAK,EAAC,QAAQ,EAAC,KAAK,EAAE,EAAE,SAAS,EAAE,eAAe,EAAE,IACtD,QAAQ,CACL,CACF,EACN;AACJ,CAAC,CAAC;SAEc,QAAQ,CACtB,OAAoB,EACpB,iBAAkC,EAClC,QAAkB,EAClB,MAA+B,EAC/B,WAAoC;EAEpC,KAAK,IAAI,CAAC,GAAG,CAAC,EAAE,CAAC,GAAG,OAAO,CAAC,QAAQ,CAAC,MAAM,EAAE,CAAC,EAAE,EAAE;IAChD,MAAM,EAAE,GAAG,OAAO,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IAC/B,IAAI,wBAAwB,CAAC,EAAE,CAAC,EAAE;MAChC,aAAa,CACX,EAAuC,EACvC,iBAAiB,EACjB,QAAQ,EACR,MAAM,EACN,WAAW,CACZ,CAAC;KACH;SAAM,IAAI,sBAAsB,CAAC,EAAE,CAAC,EAAE;MACrC,WAAW,CAAC,EAAE,EAAE,iBAAiB,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC;KACnE;GACF;AACH,CAAC;AAED,SAAS,aAAa,CACpB,OAA0C,EAC1C,iBAAkC,EAClC,QAAkB,EAClB,MAA+B,EAC/B,WAAoC;EAEpC,MAAM,WAAW,GAAGH,kBAAO,CAAC,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;EAExE,MAAM,aAAa,GAAGF,kBAAO,CAAC,kBAAkB,CAAC,WAAW,CAAC,CAAC;EAC9D,MAAM,QAAQ,GACZ,CAAC,OAAO,CAAC,YAAY,KAAI,WAAW,aAAX,WAAW,uBAAX,WAAW,CAAE,UAAU,CAAC,aAAa,EAAE,QAAQ,CAAC,CAAA,CAAC;EAC5E,OAAO,CAAC,QAAQ,GAAG,QAAQ,aAAR,QAAQ,cAAR,QAAQ,GAAI,KAAK,CAAC;EACrC,OAAO,CAAC,SAAS,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC;EAE/B,IAAI,OAAO,CAAC,YAAY,EAAE;IACxB,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,mBAAmB,CAAC,WAAW,CAAC,CAAC;GAC5D;OAAM;IACL,IAAI,CAAC,GAAG,MAAM,CAAC,UAAU,CAAC;IAC1B,CAAC,GAAGE,kBAAO,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC;IACzB,CAAC,GAAGA,kBAAO,CAAC,QAAQ,CAAC,CAAC,EAAE,WAAW,CAAC,CAAC;IACrC,CAAC,GAAGA,kBAAO,CAAC,KAAK,CAAC,CAAC,EAAE,OAAO,CAAC,KAAK,CAAC,CAAC;IAEpC,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACT,CAAC,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC;IACT,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IACV,CAAC,CAAC,EAAE,CAAC,GAAG,CAAC,CAAC;IAEV,OAAO,CAAC,KAAK,CAAC,SAAS,GAAG,mBAAmB,CAAC,CAAC,CAAC,CAAC;GAClD;EAED,QAAQ,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC;AAChE,CAAC;AAED,SAAS,WAAW,CAClB,OAAwC,EACxC,iBAAkC,EAClC,QAAkB,EAClB,MAA+B,EAC/B,WAAoC;EAEpC,MAAM,WAAW,GAAGA,kBAAO,CAAC,QAAQ,CAAC,iBAAiB,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;EACxE,QAAQ,CAAC,OAAO,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,WAAW,CAAC,CAAC;AAChE,CAAC;AAED,SAAS,kBAAkB,CAAC,UAA2B;EACrD,MAAM,QAAQ,GAAG;IACf,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACtB,OAAO,CAAC,CAAC,UAAU,CAAC,CAAC,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACvB,OAAO,CAAC,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACxB,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;IACvB,OAAO,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC;GACxB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EACb,OAAO,YAAY,QAAQ,GAAG,CAAC;AACjC,CAAC;AAED,SAAS,mBAAmB,CAAC,MAAuB;EAClD,MAAM,MAAM,GAAG;IACb,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnB,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnB,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnB,OAAO,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,CAAC;IAClB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;IACnB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;GACpB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;EAEb,OAAO,CAAC,uBAAuB,EAAE,YAAY,MAAM,GAAG,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;AACpE,CAAC;AAED,SAAS,OAAO,CAAC,KAAa;EAC5B,OAAO,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,KAAK,GAAG,CAAC,GAAG,KAAK,CAAC;AAC7C;;ACxJA,MAAM,oBAAoB,GAAG,qOAAqO;;MC6BrP,iBAAiB;EAL9B;;;;;;;;;IAcS,aAAQ,GAA8B,IAAI,CAAC;IA4B1C,aAAQ,GAAa,IAAIK,iBAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAGxC,2BAAsB,GAAG,CAAC,CAAC;IA6F3B,2BAAsB,GAAG;MAC/B,IAAI,CAAC,qBAAqB,EAAE,CAAC;KAC9B,CAAC;GAkBH;;;;EAzGW,iBAAiB;;IACzB,MAAM,OAAO,GAAG,IAAI,cAAc,CAAC,MAAM,IAAI,CAAC,YAAY,EAAE,CAAC,CAAC;IAC9D,OAAO,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IAE7B,MAAM,QAAQ,GAAG,IAAI,gBAAgB,CAAC,MAAM,IAAI,CAAC,oBAAoB,EAAE,CAAC,CAAC;IACzE,QAAQ,CAAC,OAAO,CAAC,IAAI,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC,CAAC;IAEnD,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,MAAM,EAAE,SAAS,CAAC,CAAC;IAEhD,IAAI,CAAA,MAAA,IAAI,CAAC,MAAM,0CAAE,KAAK,KAAI,IAAI,EAAE;MAC9B,IAAI,CAAC,sBAAsB,EAAE,CAAC;KAC/B;GACF;;;;EAKM,MAAM;IACX,IAAI,IAAI,CAAC,MAAM,IAAI,IAAI,EAAE;MACvB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;QAC1B,QACEF,QAACC,UAAI,QACHD,QAAC,UAAU,QACTA,qBAAa,CACF,CACR,EACP;OACH;WAAM;QACL,QACEA,QAACC,UAAI,QACHD,QAAC,UAAU,IAAC,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,IACtDA,qBAAa,CACF,CACR,EACP;OACH;KACF;SAAM;MACL,OAAOA,QAACC,UAAI,OAAQ,CAAC;KACtB;GACF;;;;EAKS,mBAAmB;IAC3B,IAAI,CAAC,cAAc,EAAE,CAAC;GACvB;;;;EAMS,kBAAkB,CAC1B,SAA8C,EAC9C,SAA8C;IAE9C,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,mBAAmB,CAAC,YAAY,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;IAC1E,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,gBAAgB,CAAC,YAAY,EAAE,IAAI,CAAC,sBAAsB,CAAC,CAAC;GACxE;;;;EAMS,oBAAoB;IAC5B,IAAI,CAAC,eAAe,EAAE,CAAC;GACxB;EAEO,eAAe;IACrB,IAAI,CAAC,sBAAsB,GAAG,IAAI,CAAC,sBAAsB,GAAG,CAAC,CAAC;GAC/D;EAEO,MAAM,cAAc;IAC1B,MAAM,EAAE,QAAQ,EAAE,MAAM,EAAE,GAAG,IAAI,CAAC;IAClC,MAAM,WAAW,GAAGJ,kBAAO,CAAC,YAAY,EAAE,CAAC;IAE3C,IAAI,MAAM,IAAI,IAAI,EAAE;MAClB,IAAI,IAAI,CAAC,QAAQ,KAAK,IAAI,EAAE;QAC1B,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OACxE;WAAM;QACL,QAAQ,CAAC,IAAI,CAAC,MAAM,EAAE,WAAW,EAAE,QAAQ,EAAE,MAAM,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;OACxE;KACF;GACF;EAMO,YAAY;IAClB,MAAM,MAAM,GAAG,IAAI,CAAC,MAAM,CAAC,qBAAqB,EAAE,CAAC;IACnD,IAAI,CAAC,QAAQ,GAAG,IAAIK,iBAAQ,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC;GAC3D;EAEO,oBAAoB;IAC1B,IAAI,CAAC,eAAe,EAAE,CAAC;GACxB;EAEO,MAAM,qBAAqB;IACjC,MAAM,EAAE,KAAK,EAAE,YAAY,EAAE,GAAG,IAAI,CAAC,MAAM,IAAI,EAAE,CAAC;IAElD,IAAI,CAAC,WAAW;MACd,YAAY,KAAK,KAAK,GAAG,OAAM,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,WAAW,EAAE,CAAA,GAAG,SAAS,CAAC;IAClE,IAAI,CAAC,MAAM,GAAG,KAAK,aAAL,KAAK,uBAAL,KAAK,CAAE,KAAK,CAAC,MAAM,CAAC;GACnC;;;;;;;;;;;","names":["Vector3","Quaternion","Matrix4","Objects","Euler","h","Host","Viewport"],"sources":["./src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","./src/components/viewer-dom-element/viewer-dom-element.tsx","./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n /\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/\n The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /\n The local 3D position of where this element is located.\n /\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /\n @ignore\n /\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /\n @ignore\n /\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /\n The local rotation of this element in Euler angles.\n /\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /\n @ignore\n /\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /\n The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n /\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /\n @ignore\n /\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /\n The local rotation of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /\n @ignore\n /\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n /\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /\n @ignore\n /\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /\n The local scale of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /\n @ignore\n /\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /\n The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /\n @ignore\n /\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /\n @ignore\n /\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /\n The local matrix of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /\n Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n /\n @Prop()\n public occlusionOff = false;\n\n /\n Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n \n @example\n \n ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n /\n @Prop({ reflect: true })\n public occluded = false;\n\n /\n Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n /\n @Prop()\n public billboardOff = false;\n\n /\n Disables interaction events from children.\n /\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /\n An event that is emitted when any property on the dom group changes\n /\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /\n @ignore\n /\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /\n @ignore\n /\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /\n @ignore\n /\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT'\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}
1	+ {"file":"vertex-viewer-dom-element.vertex-viewer-dom-renderer.entry.cjs.js","mappings":"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","names":["Vector3","Quaternion","Matrix4","Objects","Euler","h","Host","Viewport"],"sources":["./src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","./src/components/viewer-dom-element/viewer-dom-element.tsx","./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n /\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/\n The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /\n The local 3D position of where this element is located.\n /\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /\n @ignore\n /\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /\n @ignore\n /\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /\n The local rotation of this element in Euler angles.\n /\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /\n @ignore\n /\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /\n The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n /\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /\n @ignore\n /\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /\n The local rotation of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /\n @ignore\n /\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n /\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /\n @ignore\n /\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /\n The local scale of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /\n @ignore\n /\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /\n The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /\n @ignore\n /\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /\n @ignore\n /\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /\n The local matrix of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /\n Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n /\n @Prop()\n public occlusionOff = false;\n\n /\n Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n \n @example\n \n ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n /\n @Prop({ reflect: true })\n public occluded = false;\n\n /\n Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n /\n @Prop()\n public billboardOff = false;\n\n /\n Disables interaction events from children.\n /\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /\n An event that is emitted when any property on the dom group changes\n /\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /\n @ignore\n /\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /\n @ignore\n /\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /\n @ignore\n /\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement &&\n el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&\n (el as HTMLVertexViewerDomElementElement).matrix != null\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&\n (el as HTMLVertexViewerDomGroupElement).matrix != null\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}

package/dist/collection/components/viewer-dom-element/utils.js CHANGED Viewed

@@ -2,6 +2,8 @@
  * Copyright (c) 2024 Vertex Software LLC. All rights reserved.
  */
 export function isVertexViewerDomElement(el) {
-  return (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT');
+  return (el instanceof HTMLElement &&
+    el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&
+    el.matrix != null);
 }
 //# sourceMappingURL=utils.js.map

package/dist/collection/components/viewer-dom-element/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/components/viewer-dom-element/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,wBAAwB,CACtC,EAAW;EAEX,OAAO,CACL,EAAE,YAAY,WAAW,~~IAAI,~~EAAE,CAAC,QAAQ,KAAK,2BAA2B,~~CACzE~~,CAAC;AACJ,CAAC","sourcesContent":["export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT'\n );\n}\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/components/viewer-dom-element/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,wBAAwB,CACtC,EAAW;EAEX,OAAO,CACL,EAAE,YAAY,WAAW;IACzB,EAAE,CAAC,QAAQ,KAAK,2BAA2B;IAC1C,EAAwC,CAAC,MAAM,IAAI,IAAI,CACzD,CAAC;AACJ,CAAC","sourcesContent":["export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement &&\n el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&\n (el as HTMLVertexViewerDomElementElement).matrix != null\n );\n}\n"]}

package/dist/collection/components/viewer-dom-group/utils.js CHANGED Viewed

@@ -2,7 +2,8 @@
  * Copyright (c) 2024 Vertex Software LLC. All rights reserved.
  */
 export function isVertexViewerDomGroup(el) {
-  return ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
-    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null));
+  return (((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
+    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&
+    el.matrix != null);
 }
 //# sourceMappingURL=utils.js.map

package/dist/collection/components/viewer-dom-group/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/components/viewer-dom-group/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,sBAAsB,CACpC,EAAW;EAEX,OAAO,CACL,CAAC,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,QAAQ,KAAK,yBAAyB,CAAC;~~IACxE~~,CAAC,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,OAAO,CAAC,iBAAiB,IAAI,IAAI,CAAC,~~CACpE~~,CAAC;AACJ,CAAC","sourcesContent":["export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)\n );\n}\n"]}
1	+ {"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../../src/components/viewer-dom-group/utils.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,sBAAsB,CACpC,EAAW;EAEX,OAAO,CACL,CAAC,CAAC,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,QAAQ,KAAK,yBAAyB,CAAC;IACvE,CAAC,EAAE,YAAY,WAAW,IAAI,EAAE,CAAC,OAAO,CAAC,iBAAiB,IAAI,IAAI,CAAC,CAAC;IACrE,EAAsC,CAAC,MAAM,IAAI,IAAI,CACvD,CAAC;AACJ,CAAC","sourcesContent":["export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&\n (el as HTMLVertexViewerDomGroupElement).matrix != null\n );\n}\n"]}

package/dist/components/viewer-dom-renderer.js CHANGED Viewed

@@ -7,12 +7,15 @@ import './streamAttributes.js';
 import { V as Viewport } from './viewport.js';
 function isVertexViewerDomElement(el) {
-  return (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT');
+  return (el instanceof HTMLElement &&
+    el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&
+    el.matrix != null);
 }
 function isVertexViewerDomGroup(el) {
-  return ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
-    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null));
+  return (((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
+    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&
+    el.matrix != null);
 }
 // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist/components/viewer-dom-renderer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"viewer-dom-renderer.js","mappings":"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","names":["Matrix4","Vector3"],"sources":["./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":["export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT'\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far * 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}
1	+ {"file":"viewer-dom-renderer.js","mappings":"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","names":["Matrix4","Vector3"],"sources":["./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":["export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement &&\n el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&\n (el as HTMLVertexViewerDomElementElement).matrix != null\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&\n (el as HTMLVertexViewerDomGroupElement).matrix != null\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far * 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}

package/dist/esm/vertex-viewer-dom-element_2.entry.js CHANGED Viewed

@@ -222,12 +222,15 @@ const ViewerDomElement = class {
 ViewerDomElement.style = viewerDomElementCss;
 function isVertexViewerDomElement(el) {
-  return (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT');
+  return (el instanceof HTMLElement &&
+    el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&
+    el.matrix != null);
 }
 function isVertexViewerDomGroup(el) {
-  return ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
-    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null));
+  return (((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
+    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&
+    el.matrix != null);
 }
 // eslint-disable-next-line @typescript-eslint/no-unused-vars

package/dist/esm/vertex-viewer-dom-element_2.entry.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"file":"vertex-viewer-dom-element.vertex-viewer-dom-renderer.entry.js","mappings":"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","names":["Vector3","Quaternion","Matrix4","Objects","Euler"],"sources":["./src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","./src/components/viewer-dom-element/viewer-dom-element.tsx","./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n /\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/\n The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /\n The local 3D position of where this element is located.\n /\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /\n @ignore\n /\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /\n @ignore\n /\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /\n The local rotation of this element in Euler angles.\n /\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /\n @ignore\n /\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /\n The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n /\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /\n @ignore\n /\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /\n The local rotation of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /\n @ignore\n /\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n /\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /\n @ignore\n /\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /\n The local scale of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /\n @ignore\n /\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /\n The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /\n @ignore\n /\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /\n @ignore\n /\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /\n The local matrix of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /\n Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n /\n @Prop()\n public occlusionOff = false;\n\n /\n Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n \n @example\n \n ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n /\n @Prop({ reflect: true })\n public occluded = false;\n\n /\n Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n /\n @Prop()\n public billboardOff = false;\n\n /\n Disables interaction events from children.\n /\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /\n An event that is emitted when any property on the dom group changes\n /\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /\n @ignore\n /\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /\n @ignore\n /\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /\n @ignore\n /\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT'\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}
1	+ {"file":"vertex-viewer-dom-element.vertex-viewer-dom-renderer.entry.js","mappings":"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","names":["Vector3","Quaternion","Matrix4","Objects","Euler"],"sources":["./src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","./src/components/viewer-dom-element/viewer-dom-element.tsx","./src/components/viewer-dom-element/utils.ts","./src/components/viewer-dom-group/utils.ts","./src/components/viewer-dom-renderer/renderer2d.tsx","./src/components/viewer-dom-renderer/renderer3d.tsx","./src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","./src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n /\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering /\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/\n The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /\n The local 3D position of where this element is located.\n /\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /\n @ignore\n /\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /\n @ignore\n /\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /\n The local rotation of this element in Euler angles.\n /\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /\n @ignore\n /\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /\n The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n /\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /\n @ignore\n /\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /\n The local rotation of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /\n @ignore\n /\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /\n The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n /\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /\n @ignore\n /\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /\n The local scale of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /\n @ignore\n /\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /\n The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n /\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /\n @ignore\n /\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /\n @ignore\n /\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /\n The local matrix of this element.\n /\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /\n Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n /\n @Prop()\n public occlusionOff = false;\n\n /\n Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n \n @example\n \n ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n /\n @Prop({ reflect: true })\n public occluded = false;\n\n /\n Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n /\n @Prop()\n public billboardOff = false;\n\n /\n Disables interaction events from children.\n /\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /\n An event that is emitted when any property on the dom group changes\n /\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /\n @ignore\n /\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /\n @ignore\n /\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /\n @ignore\n /\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement &&\n el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&\n (el as HTMLVertexViewerDomElementElement).matrix != null\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') \|\|\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&\n (el as HTMLVertexViewerDomGroupElement).matrix != null\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer \| undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' \| '3d';\n\n/*\n The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n /\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /\n Specifies the drawing mode for the renderer.\n \n When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n /\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /\n The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n /\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /\n The current camera of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /\n The current depth buffer of the frame.\n \n This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n /\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /\n @ignore\n /\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /\n @ignore\n /\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /\n @ignore\n /\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /\n @ignore\n /\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement \| undefined,\n oldViewer: HTMLVertexViewerElement \| undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /\n @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer \|\| {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"],"version":3}

package/dist/viewer/p-7a27591b.entry.js ADDED Viewed

@@ -0,0 +1,5 @@
+/*!
+ * Copyright (c) 2024 Vertex Software LLC. All rights reserved.
+ */
+import{r as t,c as n,h as s,H as i,g as e}from"./p-e4ea1075.js";import{v as o,q as a,m as h,t as r}from"./p-532c62b6.js";import{o as l}from"./p-dc519bf6.js";import"./p-fa118f80.js";import"./p-d312d59a.js";import{V as d}from"./p-f4f0bb89.js";import"./p-2ceb43ba.js";import"./p-88c19f38.js";const c=":host{position:absolute;pointer-events:none;visibility:hidden}:host(.hydrated){visibility:hidden}:host(.ready){visibility:inherit}:host(:not([interactions-off]))>*{pointer-events:auto}";const u=class{constructor(s){t(this,s);this.propertyChange=n(this,"propertyChange",7);this.position=o.origin();this.positionJson="";this.quaternion=a.create();this.quaternionJson="";this.scale=o.create(1,1,1);this.scaleJson="";this.matrix=h.makeIdentity();this.occlusionOff=false;this.occluded=false;this.billboardOff=false;this.interactionsOff=false}handlePositionChange(){this.syncMatrix()}handlePositionJsonChanged(){this.syncPosition()}handleRotationChanged(){this.syncQuaternionWithRotation()}handleRotationJsonChanged(){this.syncRotation()}handleQuaternionChange(){this.syncMatrix()}handleQuaternionJsonChanged(){this.syncQuaternion()}handleScaleChange(){this.syncMatrix()}handleScaleJsonChanged(){this.syncScale()}handleMatrixChanged(t,n){if(!l.isEqual(t,n)){this.propertyChange.emit()}}connectedCallback(){this.syncProperties()}componentShouldUpdate(t,n,s){return s==="occluded"}syncProperties(){this.syncPosition();this.syncRotation();this.syncQuaternion();this.syncScale();this.syncMatrix()}syncPosition(){this.position=this.positionJson.length>0?this.parseJson("positionJson",this.positionJson,o.fromJson):this.position}syncRotation(){this.rotation=this.rotationJson!=null&&this.rotationJson.length>0?this.parseJson("rotationJson",this.rotationJson,r.fromJson):this.rotation;this.syncQuaternionWithRotation()}syncQuaternionWithRotation(){this.quaternion=this.rotation!=null?a.fromEuler(this.rotation):this.quaternion}syncQuaternion(){this.quaternion=this.quaternionJson.length>0?this.parseJson("quaternionJson",this.quaternionJson,a.fromJson):this.quaternion}syncScale(){this.scale=this.scaleJson.length>0?this.parseJson("scaleJson",this.scaleJson,o.fromJson):this.scale}syncMatrix(){this.matrix=h.makeTRS(this.position,this.quaternion,this.scale)}parseJson(t,n,s){try{return s(n)}catch(n){console.warn(`Could not parse \`${t}\`. Invalid JSON.`);throw n}}render(){return s(i,null,s("slot",null))}static get watchers(){return{position:["handlePositionChange"],positionJson:["handlePositionJsonChanged"],rotation:["handleRotationChanged"],rotationJson:["handleRotationJsonChanged"],quaternion:["handleQuaternionChange"],quaternionJson:["handleQuaternionJsonChanged"],scale:["handleScaleChange"],scaleJson:["handleScaleJsonChanged"],matrix:["handleMatrixChanged"]}}};u.style=c;function f(t){return t instanceof HTMLElement&&t.nodeName==="VERTEX-VIEWER-DOM-ELEMENT"&&t.matrix!=null}function p(t){return(t instanceof HTMLElement&&t.nodeName==="VERTEX-VIEWER-DOM-GROUP"||t instanceof HTMLElement&&t.dataset.isDomGroupElement!=null)&&t.matrix!=null}const v=(t,n)=>s("div",{class:"root-2d"},n);function m(t,n,s,i,e){const o=g(t,n,i).sort(((t,n)=>t.distanceToCamera-n.distanceToCamera));for(let t=0;t<o.length;t++){const{element:n,worldMatrix:a,worldPosition:h}=o[t];const r=!n.occlusionOff&&(e===null||e===void 0?void 0:e.isOccluded(h,s));const l=y(h,i.projectionViewMatrix,s);C(n,l);w(n,t,o.length);m(n,a,s,i,e);n.occluded=r!==null&&r!==void 0?r:false;n.classList.add("ready")}}function g(t,n,s){const i=[];for(let e=0;e<t.children.length;e++){const a=t.children[e];if(p(a)){const t=h.multiply(n,a.matrix);i.push(...g(a,t,s))}else if(f(a)){const t=h.multiply(n,a.matrix);const e=o.fromMatrixPosition(t);const r=o.distanceSquared(s.position,e);i.push({element:a,worldMatrix:t,worldPosition:e,distanceToCamera:r})}}return i}function C(t,n){t.style.transform=[`translate(-50%, -50%)`,`translate(${n.x}px, ${n.y}px)`].join(" ")}function w(t,n,s){t.style.zIndex=`${s-n}`}function y(t,n,s){const i=o.transformMatrix(t,n);return s.transformVectorToViewport(i)}const J=({camera:t,viewport:n},i)=>{const e=h.toObject(t.projectionMatrix);const o=t.isOrthographic()?t.far*2/(t.fovHeight*2)*(n.height/2):e.m22*(n.height/2);const a=[`translateZ(${o}px)`,R(t.viewMatrix),`translate(${n.width/2}px, ${n.height/2}px)`].join(" ");return s("div",{class:"root-3d",style:{perspective:`${o}px`}},s("div",{class:"camera",style:{transform:a}},i))};function x(t,n,s,i,e){for(let o=0;o<t.children.length;o++){const a=t.children[o];if(f(a)){E(a,n,s,i,e)}else if(p(a)){b(a,n,s,i,e)}}}function E(t,n,s,i,e){const a=h.multiply(n,t.matrix);const r=o.fromMatrixPosition(a);const l=!t.occlusionOff&&(e===null||e===void 0?void 0:e.isOccluded(r,s));t.occluded=l!==null&&l!==void 0?l:false;t.classList.add("ready");if(t.billboardOff){t.style.transform=M(a)}else{let n=i.viewMatrix;n=h.transpose(n);n=h.position(n,a);n=h.scale(n,t.scale);n[3]=0;n[7]=0;n[11]=0;n[15]=1;t.style.transform=M(n)}x(t,a,s,i,e)}function b(t,n,s,i,e){const o=h.multiply(n,t.matrix);x(t,o,s,i,e)}function R(t){const n=[P(t[0]),P(-t[1]),P(t[2]),P(t[3]),P(t[4]),P(-t[5]),P(t[6]),P(t[7]),P(t[8]),P(-t[9]),P(t[10]),P(t[11]),P(t[12]),P(-t[13]),P(t[14]),P(t[15])].join(", ");return`matrix3d(${n})`}function M(t){const n=[P(t[0]),P(t[1]),P(t[2]),P(t[3]),P(-t[4]),P(-t[5]),P(-t[6]),P(-t[7]),P(t[8]),P(t[9]),P(t[10]),P(t[11]),P(t[12]),P(t[13]),P(t[14]),P(t[15])].join(", ");return[`translate(-50%, -50%)`,`matrix3d(${n})`].join(" ")}function P(t){return Math.abs(t)<1e-10?0:t}const $=":host{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.root-3d{width:100%;height:100%;pointer-events:inherit}.camera{transform-style:preserve-3d;pointer-events:inherit;width:100%;height:100%}";const j=class{constructor(n){t(this,n);this.drawMode="3d";this.viewport=new d(0,0);this.invalidateFrameCounter=0;this.handleViewerFrameDrawn=async()=>{this.updatePropsFromViewer()}}componentWillLoad(){var t;const n=new ResizeObserver((()=>this.handleResize()));n.observe(this.hostEl);const s=new MutationObserver((()=>this.handleChildrenChange()));s.observe(this.hostEl,{childList:true});this.handleViewerChange(this.viewer,undefined);if(((t=this.viewer)===null||t===void 0?void 0:t.frame)!=null){this.handleViewerFrameDrawn()}}render(){if(this.camera!=null){if(this.drawMode==="2d"){return s(i,null,s(v,null,s("slot",null)))}else{return s(i,null,s(J,{camera:this.camera,viewport:this.viewport},s("slot",null)))}}else{return s(i,null)}}componentWillRender(){this.updateElements()}handleViewerChange(t,n){n===null||n===void 0?void 0:n.removeEventListener("frameDrawn",this.handleViewerFrameDrawn);t===null||t===void 0?void 0:t.addEventListener("frameDrawn",this.handleViewerFrameDrawn)}handlePropertyChange(){this.invalidateFrame()}invalidateFrame(){this.invalidateFrameCounter=this.invalidateFrameCounter+1}async updateElements(){const{viewport:t,camera:n}=this;const s=h.makeIdentity();if(n!=null){if(this.drawMode==="3d"){x(this.hostEl,s,t,n,this.depthBuffer)}else{m(this.hostEl,s,t,n,this.depthBuffer)}}}handleResize(){const t=this.hostEl.getBoundingClientRect();this.viewport=new d(t.width,t.height)}handleChildrenChange(){this.invalidateFrame()}async updatePropsFromViewer(){const{frame:t,depthBuffers:n}=this.viewer||{};this.depthBuffer=n==="all"?await(t===null||t===void 0?void 0:t.depthBuffer()):undefined;this.camera=t===null||t===void 0?void 0:t.scene.camera}get hostEl(){return e(this)}static get watchers(){return{viewer:["handleViewerChange"]}}};j.style=$;export{u as vertex_viewer_dom_element,j as vertex_viewer_dom_renderer};
+//# sourceMappingURL=p-7a27591b.entry.js.map

package/dist/viewer/p-7a27591b.entry.js.map ADDED Viewed

@@ -0,0 +1 @@

+ {"version":3,"sources":["src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","src/components/viewer-dom-element/viewer-dom-element.tsx","src/components/viewer-dom-element/utils.ts","src/components/viewer-dom-group/utils.ts","src/components/viewer-dom-renderer/renderer2d.tsx","src/components/viewer-dom-renderer/renderer3d.tsx","src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"names":["viewerDomElementCss","ViewerDomElement","[object Object]","hostRef","this","position","Vector3","origin","positionJson","quaternion","Quaternion","create","quaternionJson","scale","scaleJson","matrix","Matrix4","makeIdentity","occlusionOff","occluded","billboardOff","interactionsOff","syncMatrix","syncPosition","syncQuaternionWithRotation","syncRotation","syncQuaternion","syncScale","newMatrix","oldMatrix","Objects","isEqual","propertyChange","emit","syncProperties","newValue","oldValue","prop","length","parseJson","fromJson","rotation","rotationJson","Euler","fromEuler","makeTRS","propName","value","parse","e","console","warn","h","Host","isVertexViewerDomElement","el","HTMLElement","nodeName","isVertexViewerDomGroup","dataset","isDomGroupElement","Renderer2d","_","children","class","update2d","hostEl","parentWorldMatrix","viewport","camera","depthBuffer","elements","getElementDepths","sort","a","b","distanceToCamera","i","element","worldMatrix","worldPosition","isOccluded","screenPt","getScreenPosition","projectionViewMatrix","updateTransform","updateDepth","classList","add","results","child","multiply","push","fromMatrixPosition","distanceSquared","relativePt","style","transform","x","y","join","index","elementCount","zIndex","pt","ndcPt","transformMatrix","transformVectorToViewport","Renderer3d","pMatrix","toObject","projectionMatrix","fovY","isOrthographic","far","fovHeight","height","m22","cameraTransform","getCameraCssMatrix","viewMatrix","width","perspective","update3d","updateElement","updateGroup","positionWorld","getElementCssMatrix","m","transpose","epsilon","values","Math","abs","viewerDomRendererCss","ViewerDomRenderer","drawMode","Viewport","invalidateFrameCounter","handleViewerFrameDrawn","async","updatePropsFromViewer","resized","ResizeObserver","handleResize","observe","mutation","MutationObserver","handleChildrenChange","childList","handleViewerChange","viewer","undefined","_a","frame","updateElements","newViewer","oldViewer","removeEventListener","addEventListener","invalidateFrame","bounds","getBoundingClientRect","depthBuffers","scene"],"mappings":"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","sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n */\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > * {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering */\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/**\n * The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n */\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /**\n * The local 3D position of where this element is located.\n */\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /**\n * @ignore\n */\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n */\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /**\n * @ignore\n */\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /**\n * The local rotation of this element in Euler angles.\n */\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /**\n * @ignore\n */\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /**\n * The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n */\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /**\n * @ignore\n */\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /**\n * The local rotation of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /**\n * @ignore\n */\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n */\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /**\n * @ignore\n */\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /**\n * The local scale of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /**\n * @ignore\n */\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n */\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /**\n * @ignore\n */\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /**\n * @ignore\n */\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /**\n * The local matrix of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /**\n * Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n */\n @Prop()\n public occlusionOff = false;\n\n /**\n * Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n *\n * @example\n *\n * ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n */\n @Prop({ reflect: true })\n public occluded = false;\n\n /**\n * Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n */\n @Prop()\n public billboardOff = false;\n\n /**\n * Disables interaction events from children.\n */\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /**\n * An event that is emitted when any property on the dom group changes\n */\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /**\n * @ignore\n */\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /**\n * @ignore\n */\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /**\n * @ignore\n */\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement &&\n el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT' &&\n (el as HTMLVertexViewerDomElementElement).matrix != null\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)) &&\n (el as HTMLVertexViewerDomGroupElement).matrix != null\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far * 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' | '3d';\n\n/**\n * The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n */\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /**\n * Specifies the drawing mode for the renderer.\n *\n * When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n */\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /**\n * The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n */\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /**\n * The current camera of the frame.\n *\n * This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n */\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /**\n * The current depth buffer of the frame.\n *\n * This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n */\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /**\n * @ignore\n */\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /**\n * @ignore\n */\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /**\n * @ignore\n */\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /**\n * @ignore\n */\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement | undefined,\n oldViewer: HTMLVertexViewerElement | undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /**\n * @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer || {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"]}

package/dist/viewer/viewer.esm.js CHANGED Viewed

@@ -1,5 +1,5 @@
 /*!
  * Copyright (c) 2024 Vertex Software LLC. All rights reserved.
  */
-import{d as e,N as t,w as r,p as n,b as o}from"./p-e4ea1075.js";import{g as a}from"./p-446bdb50.js";import"./p-88c19f38.js";const i=e=>`__sc_import_${e.replace(/\s|-/g,"_")}`;const s=()=>{const o=Array.from(e.querySelectorAll("script")).find((e=>new RegExp(`/${t}(\\.esm)?\\.js($|\\?|#)`).test(e.src)||e.getAttribute("data-stencil-namespace")===t));const a="";const i={};if(a!==""){i.resourcesUrl=new URL(".",a).href}else{i.resourcesUrl=new URL(".",new URL(o.getAttribute("data-resources-url")||o.src,r.location.href)).href;{l(i.resourcesUrl,o)}if(!r.customElements){return __sc_import_viewer("./p-093f9bdb.js").then((()=>i))}}return n(i)};const l=(n,o)=>{const a=i(t);try{r[a]=new Function("w",`return import(w);//${Math.random()}`)}catch(t){const i=new Map;r[a]=t=>{const s=new URL(t,n).href;let l=i.get(s);if(!l){const t=e.createElement("script");t.type="module";t.crossOrigin=o.crossOrigin;t.src=URL.createObjectURL(new Blob([`import * as m from '${s}'; window.${a}.m = m;`],{type:"application/javascript"}));l=new Promise((e=>{t.onload=()=>{e(r[a].m);t.remove()}}));i.set(s,l);e.head.appendChild(t)}return l}}};s().then((e=>{a();return o(JSON.parse('[["p-6306cfac",[[1,"vertex-viewer-pin-tool",{"pinController":[1040],"pinModel":[16],"viewer":[16],"tool":[1025],"mode":[1025],"primaryColor":[1025,"primary-color"],"accentColor":[1025,"accent-color"],"pins":[32],"selectedPinId":[32],"elementBounds":[32],"projectionViewMatrix":[32]}]]],["p-7ed268f2",[[1,"vertex-scene-tree",{"overScanCount":[2,"over-scan-count"],"viewerSelector":[1,"viewer-selector"],"viewer":[1040],"rowData":[16],"config":[1],"configEnv":[1,"config-env"],"controller":[1040],"metadataSearchExactMatch":[1028,"metadata-search-exact-match"],"metadataSearchKeys":[1040],"metadataKeys":[16],"rows":[32],"totalRows":[32],"showLoader":[32],"showEmptyResults":[32],"stateMap":[32],"errorDetails":[32],"attemptingRetry":[32],"invalidateRows":[64],"scrollToIndex":[64],"scrollToItem":[64],"expandAll":[64],"collapseAll":[64],"expandItem":[64],"collapseItem":[64],"toggleExpandItem":[64],"toggleItemVisibility":[64],"hideItem":[64],"showItem":[64],"selectItem":[64],"deselectItem":[64],"getRowAtIndex":[64],"getRowForEvent":[64],"getRowAtClientY":[64],"filterItems":[64],"selectFilteredItems":[64],"fetchMetadataKeys":[64]},[[0,"search","handleSearch"],[0,"cellLoaded","handleCellLoaded"]]]]],["p-0669d984",[[1,"vertex-viewer-default-toolbar",{"viewer":[16],"placement":[1],"direction":[1],"animationsDisabled":[4,"animations-disabled"],"animationMs":[2,"animation-ms"]}]]],["p-407e80e0",[[1,"vertex-viewer-markup",{"arrowTemplateId":[1,"arrow-template-id"],"circleTemplateId":[1,"circle-template-id"],"freeformTemplateId":[1,"freeform-template-id"],"tool":[1],"disabled":[4],"viewer":[16],"selectedMarkupId":[1025,"selected-markup-id"],"selectNew":[4,"select-new"],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"toSelectMarkupId":[32],"pointerDownPosition":[32],"addMarkup":[64],"removeMarkup":[64],"getMarkupElements":[64],"getMarkupElement":[64]},[[0,"markupEnd","handleMarkupEnd"],[1,"pointerdown","handleMarkupPointerDown"]]]]],["p-9c4b0f20",[[1,"vertex-viewer-markup-tool",{"arrowTemplateId":[1,"arrow-template-id"],"circleTemplateId":[1,"circle-template-id"],"freeformTemplateId":[1,"freeform-template-id"],"tool":[1],"disabled":[4],"viewer":[16],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"stateMap":[32],"reset":[64]}]]],["p-3ebda04e",[[1,"vertex-viewer-view-cube",{"xPositiveLabel":[1,"x-positive-label"],"xNegativeLabel":[1,"x-negative-label"],"yPositiveLabel":[1,"y-positive-label"],"yNegativeLabel":[1,"y-negative-label"],"zPositiveLabel":[1,"z-positive-label"],"zNegativeLabel":[1,"z-negative-label"],"standardViewsOff":[4,"standard-views-off"],"animationDuration":[2,"animation-duration"],"triadOff":[4,"triad-off"],"worldOrientation":[1040],"camera":[1040],"viewer":[16],"boxLength":[32],"triadPosition":[32]}]]],["p-da883928",[[1,"vertex-viewer-measurement-distance",{"start":[1040],"startJson":[1,"start-json"],"end":[1040],"endJson":[1,"end-json"],"distance":[1026],"showAxisReferenceLines":[4,"show-axis-reference-lines"],"snapDistance":[2,"snap-distance"],"units":[1],"fractionalDigits":[2,"fractional-digits"],"labelFormatter":[16],"anchorLabelOffset":[2,"anchor-label-offset"],"lineCapLength":[2,"line-cap-length"],"mode":[513],"interactingAnchor":[1537,"interacting-anchor"],"invalid":[1540],"camera":[16],"hitProvider":[16],"indicatorPt":[1040],"viewer":[16],"measurementModel":[16],"viewport":[32],"elementBounds":[32],"interactionCount":[32],"internalCamera":[32],"invalidateStateCounter":[32],"stateMap":[32],"measurementUnits":[32],"computeElementMetrics":[64]}]]],["p-cb13a669",[[1,"vertex-viewer-measurement-precise",{"measurementModel":[16],"measurementOverlays":[16],"measurementController":[1040],"measurableEntityTypes":[16],"viewer":[16],"configEnv":[1,"config-env"],"config":[1]}]]],["p-c90ba996",[[1,"vertex-viewer-box-query-tool",{"viewer":[16],"controller":[1040],"model":[1040],"operationType":[1,"operation-type"],"mode":[1],"details":[32]}]]],["p-b9f7d146",[[1,"vertex-viewer-walk-mode-tool",{"viewer":[16],"controller":[1040],"model":[1040],"teleportMode":[1,"teleport-mode"],"enabled":[4]}]]],["p-d8100c65",[[1,"vertex-scene-tree-table-cell",{"node":[16],"tree":[16],"value":[1],"placeholder":[1],"hovered":[1028],"isScrolling":[4,"is-scrolling"],"expandToggle":[4,"expand-toggle"],"visibilityToggle":[4,"visibility-toggle"],"selectionHandler":[16],"visibilityHandler":[16],"expansionHandler":[16],"hoverController":[16]}]]],["p-9725f5fc",[[1,"vertex-scene-tree-table-column",{"initialWidth":[2,"initial-width"],"minWidth":[2,"min-width"],"maxWidth":[2,"max-width"]}]]],["p-097909a8",[[1,"vertex-scene-tree-table-header"]]],["p-97aed77f",[[1,"vertex-scene-tree-table-resize-divider",{"dragging":[32]}]]],["p-2e194668",[[1,"vertex-scene-tree-toolbar-group"]]],["p-791ac19a",[[1,"vertex-viewer",{"src":[1],"clientId":[1,"client-id"],"deviceId":[1025,"device-id"],"config":[1],"configEnv":[1,"config-env"],"resolvedConfig":[1040],"cameraControls":[4,"camera-controls"],"cameraType":[1537,"camera-type"],"keyboardControls":[4,"keyboard-controls"],"rotateAroundTapPoint":[4,"rotate-around-tap-point"],"token":[1025],"depthBuffers":[1,"depth-buffers"],"phantom":[16],"noDefaultLights":[4,"no-default-lights"],"enableTemporalRefinement":[4,"enable-temporal-refinement"],"experimentalRenderingOptions":[1,"experimental-rendering-options"],"featureLines":[16],"selectionHighlighting":[16],"featureHighlighting":[16],"featureMaps":[1,"feature-maps"],"resizeDebounce":[2,"resize-debounce"],"frame":[1040],"stream":[1040],"stencilBuffer":[1040],"viewport":[1040],"dimensions":[32],"hostDimensions":[32],"errorMessage":[32],"cursor":[32],"stateMap":[32],"dispatchFrameDrawn":[64],"registerInteractionHandler":[64],"registerTapKeyInteraction":[64],"getInteractionTarget_DEPRECATED":[64],"addCursor":[64],"getInteractionHandlers":[64],"getKeyInteractions":[64],"getBaseInteractionHandler":[64],"getJwt":[64],"load":[64],"unload":[64],"scene":[64],"isSceneReady":[64]},[[0,"tap","handleTapEvent"]]]]],["p-4e3505bf",[[1,"vertex-viewer-hit-result-indicator",{"viewer":[16],"position":[1040],"normal":[1040]}]]],["p-b5598004",[[1,"vertex-viewer-measurement-details",{"measurementModel":[16],"measurementOverlays":[16],"measurementOutcome":[1040],"distanceUnits":[1,"distance-units"],"angleUnits":[1,"angle-units"],"fractionalDigits":[2,"fractional-digits"],"distanceFormatter":[16],"angleFormatter":[16],"areaFormatter":[16],"resultTypes":[16],"overlay":[32],"distanceMeasurementUnits":[32],"angleMeasurementUnits":[32],"areaMeasurementUnits":[32]}]]],["p-e233e0d0",[[1,"vertex-viewer-transform-widget",{"viewer":[16],"position":[1040],"rotation":[1040],"controller":[1040],"xRotationDisabled":[1028,"x-rotation-disabled"],"yRotationDisabled":[1028,"y-rotation-disabled"],"zRotationDisabled":[1028,"z-rotation-disabled"],"xTranslationDisabled":[1028,"x-translation-disabled"],"yTranslationDisabled":[1028,"y-translation-disabled"],"zTranslationDisabled":[1028,"z-translation-disabled"],"hovered":[1040]}]]],["p-a700d0b7",[[1,"vertex-viewer-icon",{"name":[1],"size":[1]}]]],["p-3c60fd12",[[0,"vertex-viewer-pin-group",{"pin":[16],"matrix":[1040],"projectionViewMatrix":[16],"elementBounds":[1040],"pinModel":[16],"pinController":[16],"selected":[4],"invalidateStateCounter":[32]}]]],["p-56696bd1",[[1,"vertex-viewer-dom-group",{"position":[1040],"positionJson":[1,"position"],"rotation":[1040],"rotationJson":[1,"rotation"],"quaternion":[1040],"quaternionJson":[1,"quaternion"],"scale":[1040],"scaleJson":[1,"scale"],"matrix":[1040]}]]],["p-93b84e00",[[1,"vertex-viewer-teleport-tool",{"viewer":[16],"mode":[1025],"animationsDisabled":[4,"animations-disabled"],"animationMs":[2,"animation-ms"],"controller":[1040],"model":[1040]}]]],["p-685355a4",[[1,"vertex-viewer-spinner",{"size":[1]}]]],["p-b22a18e8",[[1,"vertex-scene-tree-search",{"debounce":[2],"disabled":[4],"placeholder":[1],"controller":[16],"value":[1025],"focused":[32],"isSearching":[32],"setFocus":[64],"clear":[64]}],[1,"vertex-scene-tree-table-layout",{"tree":[16],"controller":[16],"rows":[16],"totalRows":[2,"total-rows"],"rowHeight":[1026,"row-height"],"overScanCount":[2,"over-scan-count"],"rowData":[16],"layoutOffset":[1026,"layout-offset"],"scrollOffset":[1026,"scroll-offset"],"layoutHeight":[1026,"layout-height"],"layoutWidth":[1026,"layout-width"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"columnGridLayout":[32],"columnGridFixedLayout":[32],"isComputingCellHeight":[32],"lastDividerPointerPosition":[32],"resizingColumnIndex":[32],"isScrolling":[32],"scrollTimer":[32],"stateMap":[32],"scrollToPosition":[64]}],[1,"vertex-scene-tree-toolbar"]]],["p-1efa143f",[[1,"vertex-viewer-layer",{"stretchOff":[516,"stretch-off"]}]]],["p-c489590d",[[1,"vertex-viewer-toolbar",{"placement":[1],"direction":[1]}],[1,"vertex-viewer-button"],[1,"vertex-viewer-toolbar-group",{"direction":[1]}]]],["p-f7dc20b6",[[0,"vertex-viewer-pin-label",{"pin":[16],"elementBounds":[16],"value":[1025],"pinController":[16],"focused":[32],"computedScreenPosition":[32],"textareaRows":[32],"contentElBounds":[32],"setFocus":[64]}],[0,"vertex-viewer-pin-label-line",{"pinPoint":[16],"labelPoint":[16],"pin":[16]}]]],["p-7c83b72b",[[1,"vertex-viewer-measurement-overlays",{"measurementOverlays":[16],"camera":[1040],"viewer":[16],"overlays":[32]}],[1,"vertex-viewer-measurement-line",{"start":[16],"end":[16],"capLength":[2,"cap-length"],"pointerEvents":[1,"pointer-events"]}]]],["p-62946cd3",[[1,"vertex-viewer-dom-renderer",{"drawMode":[1,"draw-mode"],"viewer":[16],"camera":[1040],"depthBuffer":[1040],"viewport":[32],"invalidateFrameCounter":[32]},[[0,"propertyChange","handlePropertyChange"]]],[1,"vertex-viewer-dom-element",{"position":[1040],"positionJson":[1,"position"],"rotation":[1040],"rotationJson":[1,"rotation"],"quaternion":[1040],"quaternionJson":[1,"quaternion"],"scale":[1040],"scaleJson":[1,"scale"],"matrix":[1040],"occlusionOff":[4,"occlusion-off"],"occluded":[516],"billboardOff":[4,"billboard-off"],"interactionsOff":[516,"interactions-off"]}]]],["p-ba18ebf9",[[1,"vertex-viewer-markup-arrow",{"start":[1040],"startJson":[1,"start"],"end":[1040],"endJson":[1,"end"],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"mode":[513],"viewer":[16],"elementBounds":[32],"dispose":[64]}],[1,"vertex-viewer-markup-circle",{"bounds":[1040],"boundsJson":[1,"bounds"],"mode":[513],"viewer":[16],"elementBounds":[32],"dispose":[64]}],[1,"vertex-viewer-markup-freeform",{"points":[1040],"pointsJson":[1,"points"],"bounds":[1040],"boundsJson":[1,"bounds"],"mode":[513],"viewer":[16],"elementBounds":[32],"screenPoints":[32],"dispose":[64]}]]]]'),e)}));
+import{d as e,N as t,w as r,p as n,b as o}from"./p-e4ea1075.js";import{g as a}from"./p-446bdb50.js";import"./p-88c19f38.js";const i=e=>`__sc_import_${e.replace(/\s|-/g,"_")}`;const s=()=>{const o=Array.from(e.querySelectorAll("script")).find((e=>new RegExp(`/${t}(\\.esm)?\\.js($|\\?|#)`).test(e.src)||e.getAttribute("data-stencil-namespace")===t));const a="";const i={};if(a!==""){i.resourcesUrl=new URL(".",a).href}else{i.resourcesUrl=new URL(".",new URL(o.getAttribute("data-resources-url")||o.src,r.location.href)).href;{l(i.resourcesUrl,o)}if(!r.customElements){return __sc_import_viewer("./p-093f9bdb.js").then((()=>i))}}return n(i)};const l=(n,o)=>{const a=i(t);try{r[a]=new Function("w",`return import(w);//${Math.random()}`)}catch(t){const i=new Map;r[a]=t=>{const s=new URL(t,n).href;let l=i.get(s);if(!l){const t=e.createElement("script");t.type="module";t.crossOrigin=o.crossOrigin;t.src=URL.createObjectURL(new Blob([`import * as m from '${s}'; window.${a}.m = m;`],{type:"application/javascript"}));l=new Promise((e=>{t.onload=()=>{e(r[a].m);t.remove()}}));i.set(s,l);e.head.appendChild(t)}return l}}};s().then((e=>{a();return o(JSON.parse('[["p-6306cfac",[[1,"vertex-viewer-pin-tool",{"pinController":[1040],"pinModel":[16],"viewer":[16],"tool":[1025],"mode":[1025],"primaryColor":[1025,"primary-color"],"accentColor":[1025,"accent-color"],"pins":[32],"selectedPinId":[32],"elementBounds":[32],"projectionViewMatrix":[32]}]]],["p-7ed268f2",[[1,"vertex-scene-tree",{"overScanCount":[2,"over-scan-count"],"viewerSelector":[1,"viewer-selector"],"viewer":[1040],"rowData":[16],"config":[1],"configEnv":[1,"config-env"],"controller":[1040],"metadataSearchExactMatch":[1028,"metadata-search-exact-match"],"metadataSearchKeys":[1040],"metadataKeys":[16],"rows":[32],"totalRows":[32],"showLoader":[32],"showEmptyResults":[32],"stateMap":[32],"errorDetails":[32],"attemptingRetry":[32],"invalidateRows":[64],"scrollToIndex":[64],"scrollToItem":[64],"expandAll":[64],"collapseAll":[64],"expandItem":[64],"collapseItem":[64],"toggleExpandItem":[64],"toggleItemVisibility":[64],"hideItem":[64],"showItem":[64],"selectItem":[64],"deselectItem":[64],"getRowAtIndex":[64],"getRowForEvent":[64],"getRowAtClientY":[64],"filterItems":[64],"selectFilteredItems":[64],"fetchMetadataKeys":[64]},[[0,"search","handleSearch"],[0,"cellLoaded","handleCellLoaded"]]]]],["p-0669d984",[[1,"vertex-viewer-default-toolbar",{"viewer":[16],"placement":[1],"direction":[1],"animationsDisabled":[4,"animations-disabled"],"animationMs":[2,"animation-ms"]}]]],["p-407e80e0",[[1,"vertex-viewer-markup",{"arrowTemplateId":[1,"arrow-template-id"],"circleTemplateId":[1,"circle-template-id"],"freeformTemplateId":[1,"freeform-template-id"],"tool":[1],"disabled":[4],"viewer":[16],"selectedMarkupId":[1025,"selected-markup-id"],"selectNew":[4,"select-new"],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"toSelectMarkupId":[32],"pointerDownPosition":[32],"addMarkup":[64],"removeMarkup":[64],"getMarkupElements":[64],"getMarkupElement":[64]},[[0,"markupEnd","handleMarkupEnd"],[1,"pointerdown","handleMarkupPointerDown"]]]]],["p-9c4b0f20",[[1,"vertex-viewer-markup-tool",{"arrowTemplateId":[1,"arrow-template-id"],"circleTemplateId":[1,"circle-template-id"],"freeformTemplateId":[1,"freeform-template-id"],"tool":[1],"disabled":[4],"viewer":[16],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"stateMap":[32],"reset":[64]}]]],["p-3ebda04e",[[1,"vertex-viewer-view-cube",{"xPositiveLabel":[1,"x-positive-label"],"xNegativeLabel":[1,"x-negative-label"],"yPositiveLabel":[1,"y-positive-label"],"yNegativeLabel":[1,"y-negative-label"],"zPositiveLabel":[1,"z-positive-label"],"zNegativeLabel":[1,"z-negative-label"],"standardViewsOff":[4,"standard-views-off"],"animationDuration":[2,"animation-duration"],"triadOff":[4,"triad-off"],"worldOrientation":[1040],"camera":[1040],"viewer":[16],"boxLength":[32],"triadPosition":[32]}]]],["p-da883928",[[1,"vertex-viewer-measurement-distance",{"start":[1040],"startJson":[1,"start-json"],"end":[1040],"endJson":[1,"end-json"],"distance":[1026],"showAxisReferenceLines":[4,"show-axis-reference-lines"],"snapDistance":[2,"snap-distance"],"units":[1],"fractionalDigits":[2,"fractional-digits"],"labelFormatter":[16],"anchorLabelOffset":[2,"anchor-label-offset"],"lineCapLength":[2,"line-cap-length"],"mode":[513],"interactingAnchor":[1537,"interacting-anchor"],"invalid":[1540],"camera":[16],"hitProvider":[16],"indicatorPt":[1040],"viewer":[16],"measurementModel":[16],"viewport":[32],"elementBounds":[32],"interactionCount":[32],"internalCamera":[32],"invalidateStateCounter":[32],"stateMap":[32],"measurementUnits":[32],"computeElementMetrics":[64]}]]],["p-cb13a669",[[1,"vertex-viewer-measurement-precise",{"measurementModel":[16],"measurementOverlays":[16],"measurementController":[1040],"measurableEntityTypes":[16],"viewer":[16],"configEnv":[1,"config-env"],"config":[1]}]]],["p-c90ba996",[[1,"vertex-viewer-box-query-tool",{"viewer":[16],"controller":[1040],"model":[1040],"operationType":[1,"operation-type"],"mode":[1],"details":[32]}]]],["p-b9f7d146",[[1,"vertex-viewer-walk-mode-tool",{"viewer":[16],"controller":[1040],"model":[1040],"teleportMode":[1,"teleport-mode"],"enabled":[4]}]]],["p-d8100c65",[[1,"vertex-scene-tree-table-cell",{"node":[16],"tree":[16],"value":[1],"placeholder":[1],"hovered":[1028],"isScrolling":[4,"is-scrolling"],"expandToggle":[4,"expand-toggle"],"visibilityToggle":[4,"visibility-toggle"],"selectionHandler":[16],"visibilityHandler":[16],"expansionHandler":[16],"hoverController":[16]}]]],["p-9725f5fc",[[1,"vertex-scene-tree-table-column",{"initialWidth":[2,"initial-width"],"minWidth":[2,"min-width"],"maxWidth":[2,"max-width"]}]]],["p-097909a8",[[1,"vertex-scene-tree-table-header"]]],["p-97aed77f",[[1,"vertex-scene-tree-table-resize-divider",{"dragging":[32]}]]],["p-2e194668",[[1,"vertex-scene-tree-toolbar-group"]]],["p-791ac19a",[[1,"vertex-viewer",{"src":[1],"clientId":[1,"client-id"],"deviceId":[1025,"device-id"],"config":[1],"configEnv":[1,"config-env"],"resolvedConfig":[1040],"cameraControls":[4,"camera-controls"],"cameraType":[1537,"camera-type"],"keyboardControls":[4,"keyboard-controls"],"rotateAroundTapPoint":[4,"rotate-around-tap-point"],"token":[1025],"depthBuffers":[1,"depth-buffers"],"phantom":[16],"noDefaultLights":[4,"no-default-lights"],"enableTemporalRefinement":[4,"enable-temporal-refinement"],"experimentalRenderingOptions":[1,"experimental-rendering-options"],"featureLines":[16],"selectionHighlighting":[16],"featureHighlighting":[16],"featureMaps":[1,"feature-maps"],"resizeDebounce":[2,"resize-debounce"],"frame":[1040],"stream":[1040],"stencilBuffer":[1040],"viewport":[1040],"dimensions":[32],"hostDimensions":[32],"errorMessage":[32],"cursor":[32],"stateMap":[32],"dispatchFrameDrawn":[64],"registerInteractionHandler":[64],"registerTapKeyInteraction":[64],"getInteractionTarget_DEPRECATED":[64],"addCursor":[64],"getInteractionHandlers":[64],"getKeyInteractions":[64],"getBaseInteractionHandler":[64],"getJwt":[64],"load":[64],"unload":[64],"scene":[64],"isSceneReady":[64]},[[0,"tap","handleTapEvent"]]]]],["p-4e3505bf",[[1,"vertex-viewer-hit-result-indicator",{"viewer":[16],"position":[1040],"normal":[1040]}]]],["p-b5598004",[[1,"vertex-viewer-measurement-details",{"measurementModel":[16],"measurementOverlays":[16],"measurementOutcome":[1040],"distanceUnits":[1,"distance-units"],"angleUnits":[1,"angle-units"],"fractionalDigits":[2,"fractional-digits"],"distanceFormatter":[16],"angleFormatter":[16],"areaFormatter":[16],"resultTypes":[16],"overlay":[32],"distanceMeasurementUnits":[32],"angleMeasurementUnits":[32],"areaMeasurementUnits":[32]}]]],["p-e233e0d0",[[1,"vertex-viewer-transform-widget",{"viewer":[16],"position":[1040],"rotation":[1040],"controller":[1040],"xRotationDisabled":[1028,"x-rotation-disabled"],"yRotationDisabled":[1028,"y-rotation-disabled"],"zRotationDisabled":[1028,"z-rotation-disabled"],"xTranslationDisabled":[1028,"x-translation-disabled"],"yTranslationDisabled":[1028,"y-translation-disabled"],"zTranslationDisabled":[1028,"z-translation-disabled"],"hovered":[1040]}]]],["p-a700d0b7",[[1,"vertex-viewer-icon",{"name":[1],"size":[1]}]]],["p-3c60fd12",[[0,"vertex-viewer-pin-group",{"pin":[16],"matrix":[1040],"projectionViewMatrix":[16],"elementBounds":[1040],"pinModel":[16],"pinController":[16],"selected":[4],"invalidateStateCounter":[32]}]]],["p-56696bd1",[[1,"vertex-viewer-dom-group",{"position":[1040],"positionJson":[1,"position"],"rotation":[1040],"rotationJson":[1,"rotation"],"quaternion":[1040],"quaternionJson":[1,"quaternion"],"scale":[1040],"scaleJson":[1,"scale"],"matrix":[1040]}]]],["p-93b84e00",[[1,"vertex-viewer-teleport-tool",{"viewer":[16],"mode":[1025],"animationsDisabled":[4,"animations-disabled"],"animationMs":[2,"animation-ms"],"controller":[1040],"model":[1040]}]]],["p-685355a4",[[1,"vertex-viewer-spinner",{"size":[1]}]]],["p-b22a18e8",[[1,"vertex-scene-tree-search",{"debounce":[2],"disabled":[4],"placeholder":[1],"controller":[16],"value":[1025],"focused":[32],"isSearching":[32],"setFocus":[64],"clear":[64]}],[1,"vertex-scene-tree-table-layout",{"tree":[16],"controller":[16],"rows":[16],"totalRows":[2,"total-rows"],"rowHeight":[1026,"row-height"],"overScanCount":[2,"over-scan-count"],"rowData":[16],"layoutOffset":[1026,"layout-offset"],"scrollOffset":[1026,"scroll-offset"],"layoutHeight":[1026,"layout-height"],"layoutWidth":[1026,"layout-width"],"viewportStartIndex":[1026,"viewport-start-index"],"viewportEndIndex":[1026,"viewport-end-index"],"columnGridLayout":[32],"columnGridFixedLayout":[32],"isComputingCellHeight":[32],"lastDividerPointerPosition":[32],"resizingColumnIndex":[32],"isScrolling":[32],"scrollTimer":[32],"stateMap":[32],"scrollToPosition":[64]}],[1,"vertex-scene-tree-toolbar"]]],["p-1efa143f",[[1,"vertex-viewer-layer",{"stretchOff":[516,"stretch-off"]}]]],["p-c489590d",[[1,"vertex-viewer-toolbar",{"placement":[1],"direction":[1]}],[1,"vertex-viewer-button"],[1,"vertex-viewer-toolbar-group",{"direction":[1]}]]],["p-f7dc20b6",[[0,"vertex-viewer-pin-label",{"pin":[16],"elementBounds":[16],"value":[1025],"pinController":[16],"focused":[32],"computedScreenPosition":[32],"textareaRows":[32],"contentElBounds":[32],"setFocus":[64]}],[0,"vertex-viewer-pin-label-line",{"pinPoint":[16],"labelPoint":[16],"pin":[16]}]]],["p-7c83b72b",[[1,"vertex-viewer-measurement-overlays",{"measurementOverlays":[16],"camera":[1040],"viewer":[16],"overlays":[32]}],[1,"vertex-viewer-measurement-line",{"start":[16],"end":[16],"capLength":[2,"cap-length"],"pointerEvents":[1,"pointer-events"]}]]],["p-7a27591b",[[1,"vertex-viewer-dom-renderer",{"drawMode":[1,"draw-mode"],"viewer":[16],"camera":[1040],"depthBuffer":[1040],"viewport":[32],"invalidateFrameCounter":[32]},[[0,"propertyChange","handlePropertyChange"]]],[1,"vertex-viewer-dom-element",{"position":[1040],"positionJson":[1,"position"],"rotation":[1040],"rotationJson":[1,"rotation"],"quaternion":[1040],"quaternionJson":[1,"quaternion"],"scale":[1040],"scaleJson":[1,"scale"],"matrix":[1040],"occlusionOff":[4,"occlusion-off"],"occluded":[516],"billboardOff":[4,"billboard-off"],"interactionsOff":[516,"interactions-off"]}]]],["p-ba18ebf9",[[1,"vertex-viewer-markup-arrow",{"start":[1040],"startJson":[1,"start"],"end":[1040],"endJson":[1,"end"],"startLineAnchorStyle":[1025,"start-line-anchor-style"],"endLineAnchorStyle":[1025,"end-line-anchor-style"],"mode":[513],"viewer":[16],"elementBounds":[32],"dispose":[64]}],[1,"vertex-viewer-markup-circle",{"bounds":[1040],"boundsJson":[1,"bounds"],"mode":[513],"viewer":[16],"elementBounds":[32],"dispose":[64]}],[1,"vertex-viewer-markup-freeform",{"points":[1040],"pointsJson":[1,"points"],"bounds":[1040],"boundsJson":[1,"bounds"],"mode":[513],"viewer":[16],"elementBounds":[32],"screenPoints":[32],"dispose":[64]}]]]]'),e)}));
 //# sourceMappingURL=viewer.esm.js.map

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@vertexvis/viewer",
-  "version": "0.20.3-canary.1",
+  "version": "0.20.3",
   "description": "The Vertex SDK for viewing models.",
   "license": "MIT",
   "author": "Vertex Developers <support@vertexvis.com> (https://developer.vertexvis.com)",
@@ -50,12 +50,12 @@
     "@stencil/core": "^2.16.1",
     "@types/classnames": "^2.3.1",
     "@vertexvis/frame-streaming-protos": "^0.13.1",
-    "@vertexvis/geometry": "0.20.3-canary.1",
-    "@vertexvis/html-templates": "0.20.3-canary.1",
+    "@vertexvis/geometry": "0.20.3",
+    "@vertexvis/html-templates": "0.20.0",
     "@vertexvis/scene-tree-protos": "^0.1.18",
     "@vertexvis/scene-view-protos": "^0.2.1",
-    "@vertexvis/stream-api": "0.20.3-canary.1",
-    "@vertexvis/utils": "0.20.3-canary.1",
+    "@vertexvis/stream-api": "0.20.3",
+    "@vertexvis/utils": "0.20.0",
     "@vertexvis/web-workers": "^0.1.0",
     "camel-case": "^4.1.2",
     "classnames": "^2.3.1",
@@ -82,7 +82,7 @@
     "@vertexvis/eslint-config-vertexvis-typescript": "^0.5.0",
     "@vertexvis/rollup-plugin-web-workers": "^0.1.0",
     "@vertexvis/typescript-config-vertexvis": "1.1.0",
-    "@vertexwebsdk/build": "0.20.3-canary.1",
+    "@vertexwebsdk/build": "0.20.0",
     "abortcontroller-polyfill": "^1.7.3",
     "chance": "^1.1.8",
     "eslint": "^8.17.0",
@@ -97,5 +97,5 @@
     "typedoc": "^0.22.17",
     "typescript": "^4.5.4"
   },
-  "gitHead": "1f42206811fd5d5c7e789f88f117e4b4c00b8bf5"
+  "gitHead": "e95ce7aaa46d4553671e2f11dcf62fd309e2085d"
 }

package/readme.md CHANGED Viewed

@@ -27,11 +27,11 @@ file that references our published JS bundles from a CDN.
   <head>
     <link
       rel="stylesheet"
-      href="https://unpkg.com/@vertexvis/viewer@0.20.2/dist/viewer/viewer.css"
+      href="https://unpkg.com/@vertexvis/viewer@0.20.3/dist/viewer/viewer.css"
     />
     <script
       type="module"
-      src="https://unpkg.com/@vertexvis/viewer@0.20.2/dist/viewer/viewer.esm.js"
+      src="https://unpkg.com/@vertexvis/viewer@0.20.3/dist/viewer/viewer.esm.js"
     ></script>
   </head>
@@ -53,7 +53,7 @@ These utilities can be imported from a CDN as shown below:
   </head>
   <body>
     <script type="module">
-      import { ColorMaterial } from 'https://unpkg.com/@vertexvis/viewer@0.20.2/dist/esm/index.mjs';
+      import { ColorMaterial } from 'https://unpkg.com/@vertexvis/viewer@0.20.3/dist/esm/index.mjs';
       function main() {
         const color = ColorMaterial.fromHex('#ff0000');
@@ -90,7 +90,7 @@ dependency to your `package.json`:
 ```json
 {
   "dependencies": {
-    "@vertexvis/viewer": "^0.20.2"
+    "@vertexvis/viewer": "^0.20.3"
   }
 }
 ```

package/dist/viewer/p-62946cd3.entry.js DELETED Viewed

@@ -1,5 +0,0 @@
-/*!
- * Copyright (c) 2024 Vertex Software LLC. All rights reserved.
- */
-import{r as t,c as n,h as s,H as i,g as e}from"./p-e4ea1075.js";import{v as o,q as a,m as h,t as r}from"./p-532c62b6.js";import{o as l}from"./p-dc519bf6.js";import"./p-fa118f80.js";import"./p-d312d59a.js";import{V as d}from"./p-f4f0bb89.js";import"./p-2ceb43ba.js";import"./p-88c19f38.js";const c=":host{position:absolute;pointer-events:none;visibility:hidden}:host(.hydrated){visibility:hidden}:host(.ready){visibility:inherit}:host(:not([interactions-off]))>*{pointer-events:auto}";const u=class{constructor(s){t(this,s);this.propertyChange=n(this,"propertyChange",7);this.position=o.origin();this.positionJson="";this.quaternion=a.create();this.quaternionJson="";this.scale=o.create(1,1,1);this.scaleJson="";this.matrix=h.makeIdentity();this.occlusionOff=false;this.occluded=false;this.billboardOff=false;this.interactionsOff=false}handlePositionChange(){this.syncMatrix()}handlePositionJsonChanged(){this.syncPosition()}handleRotationChanged(){this.syncQuaternionWithRotation()}handleRotationJsonChanged(){this.syncRotation()}handleQuaternionChange(){this.syncMatrix()}handleQuaternionJsonChanged(){this.syncQuaternion()}handleScaleChange(){this.syncMatrix()}handleScaleJsonChanged(){this.syncScale()}handleMatrixChanged(t,n){if(!l.isEqual(t,n)){this.propertyChange.emit()}}connectedCallback(){this.syncProperties()}componentShouldUpdate(t,n,s){return s==="occluded"}syncProperties(){this.syncPosition();this.syncRotation();this.syncQuaternion();this.syncScale();this.syncMatrix()}syncPosition(){this.position=this.positionJson.length>0?this.parseJson("positionJson",this.positionJson,o.fromJson):this.position}syncRotation(){this.rotation=this.rotationJson!=null&&this.rotationJson.length>0?this.parseJson("rotationJson",this.rotationJson,r.fromJson):this.rotation;this.syncQuaternionWithRotation()}syncQuaternionWithRotation(){this.quaternion=this.rotation!=null?a.fromEuler(this.rotation):this.quaternion}syncQuaternion(){this.quaternion=this.quaternionJson.length>0?this.parseJson("quaternionJson",this.quaternionJson,a.fromJson):this.quaternion}syncScale(){this.scale=this.scaleJson.length>0?this.parseJson("scaleJson",this.scaleJson,o.fromJson):this.scale}syncMatrix(){this.matrix=h.makeTRS(this.position,this.quaternion,this.scale)}parseJson(t,n,s){try{return s(n)}catch(n){console.warn(`Could not parse \`${t}\`. Invalid JSON.`);throw n}}render(){return s(i,null,s("slot",null))}static get watchers(){return{position:["handlePositionChange"],positionJson:["handlePositionJsonChanged"],rotation:["handleRotationChanged"],rotationJson:["handleRotationJsonChanged"],quaternion:["handleQuaternionChange"],quaternionJson:["handleQuaternionJsonChanged"],scale:["handleScaleChange"],scaleJson:["handleScaleJsonChanged"],matrix:["handleMatrixChanged"]}}};u.style=c;function f(t){return t instanceof HTMLElement&&t.nodeName==="VERTEX-VIEWER-DOM-ELEMENT"}function p(t){return t instanceof HTMLElement&&t.nodeName==="VERTEX-VIEWER-DOM-GROUP"||t instanceof HTMLElement&&t.dataset.isDomGroupElement!=null}const v=(t,n)=>s("div",{class:"root-2d"},n);function m(t,n,s,i,e){const o=g(t,n,i).sort(((t,n)=>t.distanceToCamera-n.distanceToCamera));for(let t=0;t<o.length;t++){const{element:n,worldMatrix:a,worldPosition:h}=o[t];const r=!n.occlusionOff&&(e===null||e===void 0?void 0:e.isOccluded(h,s));const l=y(h,i.projectionViewMatrix,s);C(n,l);w(n,t,o.length);m(n,a,s,i,e);n.occluded=r!==null&&r!==void 0?r:false;n.classList.add("ready")}}function g(t,n,s){const i=[];for(let e=0;e<t.children.length;e++){const a=t.children[e];if(p(a)){const t=h.multiply(n,a.matrix);i.push(...g(a,t,s))}else if(f(a)){const t=h.multiply(n,a.matrix);const e=o.fromMatrixPosition(t);const r=o.distanceSquared(s.position,e);i.push({element:a,worldMatrix:t,worldPosition:e,distanceToCamera:r})}}return i}function C(t,n){t.style.transform=[`translate(-50%, -50%)`,`translate(${n.x}px, ${n.y}px)`].join(" ")}function w(t,n,s){t.style.zIndex=`${s-n}`}function y(t,n,s){const i=o.transformMatrix(t,n);return s.transformVectorToViewport(i)}const J=({camera:t,viewport:n},i)=>{const e=h.toObject(t.projectionMatrix);const o=t.isOrthographic()?t.far*2/(t.fovHeight*2)*(n.height/2):e.m22*(n.height/2);const a=[`translateZ(${o}px)`,R(t.viewMatrix),`translate(${n.width/2}px, ${n.height/2}px)`].join(" ");return s("div",{class:"root-3d",style:{perspective:`${o}px`}},s("div",{class:"camera",style:{transform:a}},i))};function x(t,n,s,i,e){for(let o=0;o<t.children.length;o++){const a=t.children[o];if(f(a)){E(a,n,s,i,e)}else if(p(a)){b(a,n,s,i,e)}}}function E(t,n,s,i,e){const a=h.multiply(n,t.matrix);const r=o.fromMatrixPosition(a);const l=!t.occlusionOff&&(e===null||e===void 0?void 0:e.isOccluded(r,s));t.occluded=l!==null&&l!==void 0?l:false;t.classList.add("ready");if(t.billboardOff){t.style.transform=M(a)}else{let n=i.viewMatrix;n=h.transpose(n);n=h.position(n,a);n=h.scale(n,t.scale);n[3]=0;n[7]=0;n[11]=0;n[15]=1;t.style.transform=M(n)}x(t,a,s,i,e)}function b(t,n,s,i,e){const o=h.multiply(n,t.matrix);x(t,o,s,i,e)}function R(t){const n=[P(t[0]),P(-t[1]),P(t[2]),P(t[3]),P(t[4]),P(-t[5]),P(t[6]),P(t[7]),P(t[8]),P(-t[9]),P(t[10]),P(t[11]),P(t[12]),P(-t[13]),P(t[14]),P(t[15])].join(", ");return`matrix3d(${n})`}function M(t){const n=[P(t[0]),P(t[1]),P(t[2]),P(t[3]),P(-t[4]),P(-t[5]),P(-t[6]),P(-t[7]),P(t[8]),P(t[9]),P(t[10]),P(t[11]),P(t[12]),P(t[13]),P(t[14]),P(t[15])].join(", ");return[`translate(-50%, -50%)`,`matrix3d(${n})`].join(" ")}function P(t){return Math.abs(t)<1e-10?0:t}const $=":host{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.root-3d{width:100%;height:100%;pointer-events:inherit}.camera{transform-style:preserve-3d;pointer-events:inherit;width:100%;height:100%}";const j=class{constructor(n){t(this,n);this.drawMode="3d";this.viewport=new d(0,0);this.invalidateFrameCounter=0;this.handleViewerFrameDrawn=async()=>{this.updatePropsFromViewer()}}componentWillLoad(){var t;const n=new ResizeObserver((()=>this.handleResize()));n.observe(this.hostEl);const s=new MutationObserver((()=>this.handleChildrenChange()));s.observe(this.hostEl,{childList:true});this.handleViewerChange(this.viewer,undefined);if(((t=this.viewer)===null||t===void 0?void 0:t.frame)!=null){this.handleViewerFrameDrawn()}}render(){if(this.camera!=null){if(this.drawMode==="2d"){return s(i,null,s(v,null,s("slot",null)))}else{return s(i,null,s(J,{camera:this.camera,viewport:this.viewport},s("slot",null)))}}else{return s(i,null)}}componentWillRender(){this.updateElements()}handleViewerChange(t,n){n===null||n===void 0?void 0:n.removeEventListener("frameDrawn",this.handleViewerFrameDrawn);t===null||t===void 0?void 0:t.addEventListener("frameDrawn",this.handleViewerFrameDrawn)}handlePropertyChange(){this.invalidateFrame()}invalidateFrame(){this.invalidateFrameCounter=this.invalidateFrameCounter+1}async updateElements(){const{viewport:t,camera:n}=this;const s=h.makeIdentity();if(n!=null){if(this.drawMode==="3d"){x(this.hostEl,s,t,n,this.depthBuffer)}else{m(this.hostEl,s,t,n,this.depthBuffer)}}}handleResize(){const t=this.hostEl.getBoundingClientRect();this.viewport=new d(t.width,t.height)}handleChildrenChange(){this.invalidateFrame()}async updatePropsFromViewer(){const{frame:t,depthBuffers:n}=this.viewer||{};this.depthBuffer=n==="all"?await(t===null||t===void 0?void 0:t.depthBuffer()):undefined;this.camera=t===null||t===void 0?void 0:t.scene.camera}get hostEl(){return e(this)}static get watchers(){return{viewer:["handleViewerChange"]}}};j.style=$;export{u as vertex_viewer_dom_element,j as vertex_viewer_dom_renderer};
-//# sourceMappingURL=p-62946cd3.entry.js.map

package/dist/viewer/p-62946cd3.entry.js.map DELETED Viewed

@@ -1 +0,0 @@

- {"version":3,"sources":["src/components/viewer-dom-element/viewer-dom-element.css?tag=vertex-viewer-dom-element&encapsulation=shadow","src/components/viewer-dom-element/viewer-dom-element.tsx","src/components/viewer-dom-element/utils.ts","src/components/viewer-dom-group/utils.ts","src/components/viewer-dom-renderer/renderer2d.tsx","src/components/viewer-dom-renderer/renderer3d.tsx","src/components/viewer-dom-renderer/viewer-dom-renderer.css?tag=vertex-viewer-dom-renderer&encapsulation=shadow","src/components/viewer-dom-renderer/viewer-dom-renderer.tsx"],"names":["viewerDomElementCss","ViewerDomElement","[object Object]","hostRef","this","position","Vector3","origin","positionJson","quaternion","Quaternion","create","quaternionJson","scale","scaleJson","matrix","Matrix4","makeIdentity","occlusionOff","occluded","billboardOff","interactionsOff","syncMatrix","syncPosition","syncQuaternionWithRotation","syncRotation","syncQuaternion","syncScale","newMatrix","oldMatrix","Objects","isEqual","propertyChange","emit","syncProperties","newValue","oldValue","prop","length","parseJson","fromJson","rotation","rotationJson","Euler","fromEuler","makeTRS","propName","value","parse","e","console","warn","h","Host","isVertexViewerDomElement","el","HTMLElement","nodeName","isVertexViewerDomGroup","dataset","isDomGroupElement","Renderer2d","_","children","class","update2d","hostEl","parentWorldMatrix","viewport","camera","depthBuffer","elements","getElementDepths","sort","a","b","distanceToCamera","i","element","worldMatrix","worldPosition","isOccluded","screenPt","getScreenPosition","projectionViewMatrix","updateTransform","updateDepth","classList","add","results","child","multiply","push","fromMatrixPosition","distanceSquared","relativePt","style","transform","x","y","join","index","elementCount","zIndex","pt","ndcPt","transformMatrix","transformVectorToViewport","Renderer3d","pMatrix","toObject","projectionMatrix","fovY","isOrthographic","far","fovHeight","height","m22","cameraTransform","getCameraCssMatrix","viewMatrix","width","perspective","update3d","updateElement","updateGroup","positionWorld","getElementCssMatrix","m","transpose","epsilon","values","Math","abs","viewerDomRendererCss","ViewerDomRenderer","drawMode","Viewport","invalidateFrameCounter","handleViewerFrameDrawn","async","updatePropsFromViewer","resized","ResizeObserver","handleResize","observe","mutation","MutationObserver","handleChildrenChange","childList","handleViewerChange","viewer","undefined","_a","frame","updateElements","newViewer","oldViewer","removeEventListener","addEventListener","invalidateFrame","bounds","getBoundingClientRect","depthBuffers","scene"],"mappings":"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","sourcesContent":[":host {\n position: absolute;\n pointer-events: none;\n visibility: hidden;\n}\n\n/* Ignore Stencil's hydrated prop in favor of a custom `ready` selector. This\n * prevents flashing of elements before Stencil has a time to position the\n * element in 3D space.\n */\n:host(.hydrated) {\n visibility: hidden;\n}\n\n:host(.ready) {\n visibility: inherit;\n}\n\n:host(:not([interactions-off])) > * {\n pointer-events: auto;\n}\n","/* eslint-disable @typescript-eslint/member-ordering */\n\nimport {\n Component,\n Event,\n EventEmitter,\n h,\n Host,\n Prop,\n Watch,\n} from '@stencil/core';\nimport { Euler, Matrix4, Quaternion, Vector3 } from '@vertexvis/geometry';\nimport { Objects } from '@vertexvis/utils';\n\nimport { HTMLDomRendererPositionableElement } from '../../interfaces';\n\n/**\n * The `ViewerDomElement` is responsible for managing a\n * `<vertex-viewer-dom-element>` element. These elements are intended to be\n * added as children to a `<vertex-viewer-dom-renderer>` and represent an\n * individual DOM element within a local 3D scene.\n */\n@Component({\n tag: 'vertex-viewer-dom-element',\n styleUrl: 'viewer-dom-element.css',\n shadow: true,\n})\nexport class ViewerDomElement implements HTMLDomRendererPositionableElement {\n /**\n * The local 3D position of where this element is located.\n */\n @Prop({ mutable: true, attribute: null })\n public position: Vector3.Vector3 = Vector3.origin();\n\n /**\n * @ignore\n */\n @Watch('position')\n protected handlePositionChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local 3D position of where this element is located, as a JSON string.\n * JSON representation can either be in the format of `[x, y, z]` or `{\"x\": 0,\n * \"y\": 0, \"z\": 0}`.\n */\n @Prop({ attribute: 'position' })\n public positionJson = '';\n\n /**\n * @ignore\n */\n @Watch('positionJson')\n protected handlePositionJsonChanged(): void {\n this.syncPosition();\n }\n\n /**\n * The local rotation of this element in Euler angles.\n */\n @Prop({ mutable: true, attribute: null })\n public rotation?: Euler.Euler;\n\n /**\n * @ignore\n */\n @Watch('rotation')\n protected handleRotationChanged(): void {\n this.syncQuaternionWithRotation();\n }\n\n /**\n * The local rotation of this element in Euler angles, as a JSON string. JSON\n * representation can either be `[x, y, z, order]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"order\": \"xyz\"}`.\n */\n @Prop({ attribute: 'rotation' })\n public rotationJson?: string;\n\n /**\n * @ignore\n */\n @Watch('rotationJson')\n protected handleRotationJsonChanged(): void {\n this.syncRotation();\n }\n\n /**\n * The local rotation of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public quaternion: Quaternion.Quaternion = Quaternion.create();\n\n /**\n * @ignore\n */\n @Watch('quaternion')\n protected handleQuaternionChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local quaternion rotation of this element, as a JSON string. JSON\n * representation can either be `[x, y, z, w]` or `{\"x\": 0, \"y\": 0, \"z\":\n * 0, \"w\": 1}`.\n */\n @Prop({ attribute: 'quaternion' })\n public quaternionJson = '';\n\n /**\n * @ignore\n */\n @Watch('quaternionJson')\n protected handleQuaternionJsonChanged(): void {\n this.syncQuaternion();\n }\n\n /**\n * The local scale of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public scale: Vector3.Vector3 = Vector3.create(1, 1, 1);\n\n /**\n * @ignore\n */\n @Watch('scale')\n protected handleScaleChange(): void {\n this.syncMatrix();\n }\n\n /**\n * The local scale of this element, as a JSON string. JSON string\n * representation can either be in the format of `[x, y, z]` or `{\"x\": 0, \"y\":\n * 0, \"z\": 0}`.\n */\n @Prop({ attribute: 'scale' })\n public scaleJson = '';\n\n /**\n * @ignore\n */\n @Watch('scaleJson')\n protected handleScaleJsonChanged(): void {\n this.syncScale();\n }\n\n /**\n * @ignore\n */\n @Watch('matrix')\n protected handleMatrixChanged(\n newMatrix: Matrix4.Matrix4,\n oldMatrix: Matrix4.Matrix4\n ): void {\n if (!Objects.isEqual(newMatrix, oldMatrix)) {\n this.propertyChange.emit();\n }\n }\n\n /**\n * The local matrix of this element.\n */\n @Prop({ mutable: true, attribute: null })\n public matrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n /**\n * Disables occlusion testing for this element. Defaults to enabled. When\n * enabled, the elements position will be tested against the current depth\n * buffer. If the position is occluded, then the `occluded` attribute will be\n * set.\n */\n @Prop()\n public occlusionOff = false;\n\n /**\n * Indicates if the element is hidden by geometry. This property can be used\n * with a CSS selector to modify the appearance of the element when its\n * occluded.\n *\n * @example\n *\n * ```html\n * <style>\n * vertex-viewer-dom-element[occluded] {\n * opacity: 0;\n * }\n * </style>\n * ```\n */\n @Prop({ reflect: true })\n public occluded = false;\n\n /**\n * Disables the billboarding behavior of the element. When billboarding is\n * enabled, the element will always be oriented towards the screen.\n */\n @Prop()\n public billboardOff = false;\n\n /**\n * Disables interaction events from children.\n */\n @Prop({ reflect: true })\n public interactionsOff = false;\n\n /**\n * An event that is emitted when any property on the dom group changes\n */\n @Event({ bubbles: true })\n public propertyChange!: EventEmitter<void>;\n\n /**\n * @ignore\n */\n protected connectedCallback(): void {\n this.syncProperties();\n }\n\n /**\n * @ignore\n */\n protected componentShouldUpdate(\n newValue: unknown,\n oldValue: unknown,\n prop: string\n ): boolean {\n return prop === 'occluded';\n }\n\n private syncProperties(): void {\n this.syncPosition();\n this.syncRotation();\n this.syncQuaternion();\n this.syncScale();\n this.syncMatrix();\n }\n\n private syncPosition(): void {\n this.position =\n this.positionJson.length > 0\n ? this.parseJson('positionJson', this.positionJson, Vector3.fromJson)\n : this.position;\n }\n\n private syncRotation(): void {\n this.rotation =\n this.rotationJson != null && this.rotationJson.length > 0\n ? this.parseJson('rotationJson', this.rotationJson, Euler.fromJson)\n : this.rotation;\n this.syncQuaternionWithRotation();\n }\n\n private syncQuaternionWithRotation(): void {\n this.quaternion =\n this.rotation != null\n ? Quaternion.fromEuler(this.rotation)\n : this.quaternion;\n }\n\n private syncQuaternion(): void {\n this.quaternion =\n this.quaternionJson.length > 0\n ? this.parseJson(\n 'quaternionJson',\n this.quaternionJson,\n Quaternion.fromJson\n )\n : this.quaternion;\n }\n\n private syncScale(): void {\n this.scale =\n this.scaleJson.length > 0\n ? this.parseJson('scaleJson', this.scaleJson, Vector3.fromJson)\n : this.scale;\n }\n\n private syncMatrix(): void {\n this.matrix = Matrix4.makeTRS(this.position, this.quaternion, this.scale);\n }\n\n private parseJson<T>(\n propName: string,\n value: string,\n parse: (str: string) => T\n ): T {\n try {\n return parse(value);\n } catch (e) {\n console.warn(`Could not parse \\`${propName}\\`. Invalid JSON.`);\n throw e;\n }\n }\n\n /**\n * @ignore\n */\n protected render(): h.JSX.IntrinsicElements {\n return (\n <Host>\n <slot></slot>\n </Host>\n );\n }\n}\n","export function isVertexViewerDomElement(\n el: unknown\n): el is HTMLVertexViewerDomElementElement {\n return (\n el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT'\n );\n}\n","export function isVertexViewerDomGroup(\n el: unknown\n): el is HTMLVertexViewerDomGroupElement {\n return (\n (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||\n (el instanceof HTMLElement && el.dataset.isDomGroupElement != null)\n );\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface ElementData {\n element: HTMLVertexViewerDomElementElement;\n worldMatrix: Matrix4.Matrix4;\n worldPosition: Vector3.Vector3;\n distanceToCamera: number;\n}\n\nexport const Renderer2d: FunctionalComponent = (_, children) => {\n return <div class=\"root-2d\">{children}</div>;\n};\n\nexport function update2d(\n hostEl: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort(\n (a, b) => a.distanceToCamera - b.distanceToCamera\n );\n\n for (let i = 0; i < elements.length; i++) {\n const { element, worldMatrix, worldPosition } = elements[i];\n\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(worldPosition, viewport);\n const screenPt = getScreenPosition(\n worldPosition,\n camera.projectionViewMatrix,\n viewport\n );\n\n updateTransform(element, screenPt);\n updateDepth(element, i, elements.length);\n update2d(element, worldMatrix, viewport, camera, depthBuffer);\n\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n }\n}\n\nfunction getElementDepths(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n camera: FrameCameraWithMatrices\n): ElementData[] {\n const results = [] as ElementData[];\n\n for (let i = 0; i < element.children.length; i++) {\n const child = element.children[i];\n\n if (isVertexViewerDomGroup(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n results.push(...getElementDepths(child, worldMatrix, camera));\n } else if (isVertexViewerDomElement(child)) {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, child.matrix);\n const worldPosition = Vector3.fromMatrixPosition(worldMatrix);\n const distanceToCamera = Vector3.distanceSquared(\n camera.position,\n worldPosition\n );\n results.push({\n element: child,\n worldMatrix,\n worldPosition,\n distanceToCamera,\n });\n }\n }\n\n return results;\n}\n\nfunction updateTransform(\n element: HTMLVertexViewerDomElementElement,\n relativePt: Point.Point\n): void {\n element.style.transform = [\n `translate(-50%, -50%)`,\n `translate(${relativePt.x}px, ${relativePt.y}px)`,\n ].join(' ');\n}\n\nfunction updateDepth(\n element: HTMLVertexViewerDomElementElement,\n index: number,\n elementCount: number\n): void {\n element.style.zIndex = `${elementCount - index}`;\n}\n\nfunction getScreenPosition(\n pt: Vector3.Vector3,\n projectionViewMatrix: Matrix4.Matrix4,\n viewport: Viewport\n): Point.Point {\n const ndcPt = Vector3.transformMatrix(pt, projectionViewMatrix);\n return viewport.transformVectorToViewport(ndcPt);\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Matrix4, Vector3 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraWithMatrices } from '../../lib/types/frame';\nimport { isVertexViewerDomElement } from '../viewer-dom-element/utils';\nimport { isVertexViewerDomGroup } from '../viewer-dom-group/utils';\n\ninterface Props {\n camera: FrameCameraWithMatrices;\n viewport: Viewport;\n}\n\nexport const Renderer3d: FunctionalComponent<Props> = (\n { camera, viewport },\n children\n) => {\n const pMatrix = Matrix4.toObject(camera.projectionMatrix);\n const fovY = camera.isOrthographic()\n ? ((camera.far * 2) / (camera.fovHeight * 2)) * (viewport.height / 2)\n : pMatrix.m22 * (viewport.height / 2);\n const cameraTransform = [\n `translateZ(${fovY}px)`,\n getCameraCssMatrix(camera.viewMatrix),\n `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,\n ].join(' ');\n\n return (\n <div class=\"root-3d\" style={{ perspective: `${fovY}px` }}>\n <div class=\"camera\" style={{ transform: cameraTransform }}>\n {children}\n </div>\n </div>\n );\n};\n\nexport function update3d(\n element: HTMLElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n for (let i = 0; i < element.children.length; i++) {\n const el = element.children[i];\n if (isVertexViewerDomElement(el)) {\n updateElement(\n el as HTMLVertexViewerDomElementElement,\n parentWorldMatrix,\n viewport,\n camera,\n depthBuffer\n );\n } else if (isVertexViewerDomGroup(el)) {\n updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);\n }\n }\n}\n\nfunction updateElement(\n element: HTMLVertexViewerDomElementElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n\n const positionWorld = Vector3.fromMatrixPosition(worldMatrix);\n const occluded =\n !element.occlusionOff && depthBuffer?.isOccluded(positionWorld, viewport);\n element.occluded = occluded ?? false;\n element.classList.add('ready');\n\n if (element.billboardOff) {\n element.style.transform = getElementCssMatrix(worldMatrix);\n } else {\n let m = camera.viewMatrix;\n m = Matrix4.transpose(m);\n m = Matrix4.position(m, worldMatrix);\n m = Matrix4.scale(m, element.scale);\n\n m[3] = 0;\n m[7] = 0;\n m[11] = 0;\n m[15] = 1;\n\n element.style.transform = getElementCssMatrix(m);\n }\n\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction updateGroup(\n element: HTMLVertexViewerDomGroupElement,\n parentWorldMatrix: Matrix4.Matrix4,\n viewport: Viewport,\n camera: FrameCameraWithMatrices,\n depthBuffer: DepthBuffer | undefined\n): void {\n const worldMatrix = Matrix4.multiply(parentWorldMatrix, element.matrix);\n update3d(element, worldMatrix, viewport, camera, depthBuffer);\n}\n\nfunction getCameraCssMatrix(viewMatrix: Matrix4.Matrix4): string {\n const elements = [\n epsilon(viewMatrix[0]),\n epsilon(-viewMatrix[1]),\n epsilon(viewMatrix[2]),\n epsilon(viewMatrix[3]),\n epsilon(viewMatrix[4]),\n epsilon(-viewMatrix[5]),\n epsilon(viewMatrix[6]),\n epsilon(viewMatrix[7]),\n epsilon(viewMatrix[8]),\n epsilon(-viewMatrix[9]),\n epsilon(viewMatrix[10]),\n epsilon(viewMatrix[11]),\n epsilon(viewMatrix[12]),\n epsilon(-viewMatrix[13]),\n epsilon(viewMatrix[14]),\n epsilon(viewMatrix[15]),\n ].join(', ');\n return `matrix3d(${elements})`;\n}\n\nfunction getElementCssMatrix(matrix: Matrix4.Matrix4): string {\n const values = [\n epsilon(matrix[0]),\n epsilon(matrix[1]),\n epsilon(matrix[2]),\n epsilon(matrix[3]),\n epsilon(-matrix[4]),\n epsilon(-matrix[5]),\n epsilon(-matrix[6]),\n epsilon(-matrix[7]),\n epsilon(matrix[8]),\n epsilon(matrix[9]),\n epsilon(matrix[10]),\n epsilon(matrix[11]),\n epsilon(matrix[12]),\n epsilon(matrix[13]),\n epsilon(matrix[14]),\n epsilon(matrix[15]),\n ].join(', ');\n\n return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');\n}\n\nfunction epsilon(value: number): number {\n return Math.abs(value) < 1e-10 ? 0 : value;\n}\n",":host {\n position: absolute;\n top: 0;\n bottom: 0;\n left: 0;\n right: 0;\n overflow: hidden;\n pointer-events: none;\n}\n\n.root-3d {\n width: 100%;\n height: 100%;\n pointer-events: inherit;\n}\n\n.camera {\n transform-style: preserve-3d;\n pointer-events: inherit;\n width: 100%;\n height: 100%;\n}\n","import {\n Component,\n Element,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\nimport { Matrix4 } from '@vertexvis/geometry';\n\nimport { DepthBuffer, Viewport } from '../../lib/types';\nimport { FrameCameraBase } from '../../lib/types/frame';\nimport { Renderer2d, update2d } from './renderer2d';\nimport { Renderer3d, update3d } from './renderer3d';\n\nexport type ViewerDomRendererDrawMode = '2d' | '3d';\n\n/**\n * The `ViewerDomRenderer` is responsible for managing a\n * `<vertex-viewer-dom-renderer>` element. This element supports drawing DOM\n * objects in a local 3D scene that is synced with a remote rendered scene.\n */\n@Component({\n tag: 'vertex-viewer-dom-renderer',\n styleUrl: 'viewer-dom-renderer.css',\n shadow: true,\n})\nexport class ViewerDomRenderer {\n /**\n * Specifies the drawing mode for the renderer.\n *\n * When in `3d` mode, elements are positioned using CSS 3D transforms and will\n * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is\n * used, and elements will not scale or rotate with camera changes.\n */\n @Prop()\n public drawMode: ViewerDomRendererDrawMode = '3d';\n\n /**\n * The viewer synced to this renderer. This property will automatically be\n * assigned if the renderer is a child of `<vertex-viewer>`.\n */\n @Prop()\n public viewer?: HTMLVertexViewerElement;\n\n /**\n * The current camera of the frame.\n *\n * This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n */\n @Prop({ mutable: true })\n public camera?: FrameCameraBase;\n\n /**\n * The current depth buffer of the frame.\n *\n * This property will automatically be set when supplying a viewer to the\n * component, or when added as a child to `<vertex-viewer>`.\n */\n @Prop({ mutable: true })\n public depthBuffer?: DepthBuffer;\n\n @State()\n private viewport: Viewport = new Viewport(0, 0);\n\n @State()\n private invalidateFrameCounter = 0;\n\n @Element()\n private hostEl!: HTMLElement;\n\n /**\n * @ignore\n */\n protected componentWillLoad(): void {\n const resized = new ResizeObserver(() => this.handleResize());\n resized.observe(this.hostEl);\n\n const mutation = new MutationObserver(() => this.handleChildrenChange());\n mutation.observe(this.hostEl, { childList: true });\n\n this.handleViewerChange(this.viewer, undefined);\n\n if (this.viewer?.frame != null) {\n this.handleViewerFrameDrawn();\n }\n }\n\n /**\n * @ignore\n */\n public render(): h.JSX.IntrinsicElements {\n if (this.camera != null) {\n if (this.drawMode === '2d') {\n return (\n <Host>\n <Renderer2d>\n <slot></slot>\n </Renderer2d>\n </Host>\n );\n } else {\n return (\n <Host>\n <Renderer3d camera={this.camera} viewport={this.viewport}>\n <slot></slot>\n </Renderer3d>\n </Host>\n );\n }\n } else {\n return <Host></Host>;\n }\n }\n\n /**\n * @ignore\n */\n protected componentWillRender(): void {\n this.updateElements();\n }\n\n /**\n * @ignore\n */\n @Watch('viewer')\n protected handleViewerChange(\n newViewer: HTMLVertexViewerElement | undefined,\n oldViewer: HTMLVertexViewerElement | undefined\n ): void {\n oldViewer?.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);\n newViewer?.addEventListener('frameDrawn', this.handleViewerFrameDrawn);\n }\n\n /**\n * @ignore\n */\n @Listen('propertyChange')\n protected handlePropertyChange(): void {\n this.invalidateFrame();\n }\n\n private invalidateFrame(): void {\n this.invalidateFrameCounter = this.invalidateFrameCounter + 1;\n }\n\n private async updateElements(): Promise<void> {\n const { viewport, camera } = this;\n const worldMatrix = Matrix4.makeIdentity();\n\n if (camera != null) {\n if (this.drawMode === '3d') {\n update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n } else {\n update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);\n }\n }\n }\n\n private handleViewerFrameDrawn = async (): Promise<void> => {\n this.updatePropsFromViewer();\n };\n\n private handleResize(): void {\n const bounds = this.hostEl.getBoundingClientRect();\n this.viewport = new Viewport(bounds.width, bounds.height);\n }\n\n private handleChildrenChange(): void {\n this.invalidateFrame();\n }\n\n private async updatePropsFromViewer(): Promise<void> {\n const { frame, depthBuffers } = this.viewer || {};\n\n this.depthBuffer =\n depthBuffers === 'all' ? await frame?.depthBuffer() : undefined;\n this.camera = frame?.scene.camera;\n }\n}\n"]}