@vertexvis/viewer 0.23.6-canary.8 → 0.23.6-testing.0

package/dist/types/lib/webgl/regl-component.d.ts

@@ -5,6 +5,10 @@ import { Drawable } from '../transforms/drawable';
 import { Frame, Viewport } from '../types';
 export declare const DEFAULT_PERSPECTIVE_MESH_SCALAR = 0.005;
 export declare const DEFAULT_ORTHOGRAPHIC_MESH_SCALAR = 0.00625;
+export declare const TRIANGLE_SIZE_CANVAS_AREA_ADJUSTMENT_NUMERATOR = 1580000;
+export declare const TRIANGLE_SIZE_CANVAS_AREA_ADJUSTMENT_DENOMINATOR = 520000;
+export declare const TRIANGLE_SIZE_CANVAS_HEIGHT_ADJUSTMENT_NUMERATOR = 950;
+export declare const TRIANGLE_SIZE_CANVAS_HEIGHT_ADJUSTMENT_DENOMINATOR = 45;
 export declare abstract class ReglComponent implements Disposable {
   protected canvasElement: HTMLCanvasElement;
   protected reglCommand?: regl.Regl;

package/dist/viewer/{p-d7a621a2.entry.js → p-07d2b2fa.entry.js}

@@ -1,5 +1,5 @@
 /*!
  * Copyright (c) 2025 Vertex Software LLC. All rights reserved.
  */
-import{r as i,h as t,H as s,g as n}from"./p-6685b50e.js";import{v as h,m as o,q as e,r as l,c as r}from"./p-021bcb25.js";import{w as a,r as d}from"./p-b276d65a.js";import{M as c,R as u,r as v,s as p,T as f,c as m,a as w,A as g,b}from"./p-ed1460ad.js";import"./p-bcce32b5.js";import"./p-da65b274.js";import"./p-1f0ce5c8.js";import"./p-fdfb1d5a.js";import"./p-28dfd6fb.js";import"./p-ab1cef89.js";import"./p-8c65c44d.js";function N(i,t){return i.getPropertyValue(t).trim().replace(/["']*/g,"")}function j(i,t,s,n){const a=h.transformMatrix(s,o.makeRotation(e.fromMatrixRotation(i)));const d=h.fromMatrixPosition(i);const u=Math.abs(h.dot(a,h.up()))===1?h.left():h.normalize(h.cross(a,h.up()));const v=h.normalize(h.cross(u,a));const p=l.create({origin:d,direction:u});const f=l.create({origin:d,direction:v});const m=h.rotateAboutAxis(r.toRadians(45),l.at(p,-n),a,d);const w=h.rotateAboutAxis(r.toRadians(45),l.at(f,-n),a,d);const g=h.rotateAboutAxis(r.toRadians(45),l.at(f,n),a,d);const b=h.rotateAboutAxis(r.toRadians(45),l.at(p,n),a,d);const N=[m,w,b,g];return new c(!isNaN(u.x),[m,w,b,g],N.map((i=>h.transformMatrix(i,t.projectionViewMatrix))),(i=>h.distance(d,i)))}function O(i,t,s,n){const a=h.transformMatrix(s,o.makeRotation(e.fromMatrixRotation(i)));const d=h.fromMatrixPosition(i);const u=h.normalize(h.cross(a,h.normalize(t.viewVector)));const v=h.normalize(h.cross(a,u));const p=l.create({origin:d,direction:u});const f=l.create({origin:d,direction:v});const m=l.at(p,-n);const w=l.at(f,-n);const g=l.at(f,n);const b=l.at(p,n);const N=h.rotateAboutAxis(r.toRadians(45),m,a,d);const j=h.rotateAboutAxis(r.toRadians(45),w,a,d);const O=h.rotateAboutAxis(r.toRadians(45),g,a,d);const C=h.rotateAboutAxis(r.toRadians(45),b,a,d);const y=[m,N,w,j,b,C,g,O];return new c(!isNaN(u.x),y,y.map((i=>h.transformMatrix(i,t.projectionViewMatrix))),(i=>h.distance(d,i)))}const C=.4;const y=5;const S=.75;class $ extends u{constructor(i,t={},s={}){super(i);this.arrowFillColor=t.arrow;this.planeFillColor=t.plane;this.outlineColor=t.outline;this.planeOpacity=s.plane}updateTransformAndNormal(i,t){var s;this.transform=i;this.normal=t;if(i!=null&&t!=null&&this.frame!=null){this.updateAndDraw()}else{this.clear();(s=this.reglFrameDisposable)===null||s===void 0?void 0:s.cancel();this.reglFrameDisposable=undefined}}updateColors(i){var t,s,n,h,o,e,l,r,a;this.arrowFillColor=(t=i.arrow)!==null&&t!==void 0?t:this.arrowFillColor;this.planeFillColor=(s=i.plane)!==null&&s!==void 0?s:this.planeFillColor;this.outlineColor=(n=i.outline)!==null&&n!==void 0?n:this.outlineColor;(h=this.arrow)===null||h===void 0?void 0:h.updateFillColor(this.arrowFillColor);(o=this.plane)===null||o===void 0?void 0:o.updateFillColor(this.planeFillColor);(e=this.arrow)===null||e===void 0?void 0:e.updateOutlineColor(this.outlineColor);(l=this.plane)===null||l===void 0?void 0:l.updateOutlineColor(this.outlineColor);(r=this.point)===null||r===void 0?void 0:r.updateOutlineColor(this.outlineColor);(a=this.axis)===null||a===void 0?void 0:a.updateOutlineColor(this.outlineColor)}updateOpacities(i){this.planeOpacity=i.plane}hasData(){return this.transform!=null&&this.normal!=null}createOrUpdateElements(){if(this.transform!=null&&this.normal!=null&&this.frame!=null){if(this.arrow==null){this.createElements(this.transform,this.normal,this.frame)}else{this.updateElements(this.transform,this.normal,this.frame)}}}createElements(i,t,s){this.reglCommand=v({canvas:this.canvasElement,extensions:"angle_instanced_arrays"});const{createShape:n}=p(this.reglCommand);const o=this.computeTriangleSize(h.fromMatrixPosition(i),s);this.arrow=new f(n,"hit-normal-arrow",m(i,s.scene.camera,t,o),this.outlineColor,this.arrowFillColor);this.plane=new w(n,"hit-plane",j(i,s.scene.camera,t,o*y),this.outlineColor,this.planeFillColor,{opacity:this.getPlaneOpacity(),depth:.5});this.point=new w(n,"hit-position",O(i,s.scene.camera,t,o*C),this.outlineColor,this.outlineColor,{join:"round",depth:1});this.axis=new g(n,"hit-normal-axis",b(i,s.scene.camera,this.arrow),this.outlineColor,this.arrowFillColor);this.availableElements=[this.arrow,this.point,this.plane,this.axis]}updateElements(i,t,s){var n;const o=this.computeTriangleSize(h.fromMatrixPosition(i),s);if(this.arrow!=null){this.arrow.updatePoints(m(i,s.scene.camera,t,o));(n=this.axis)===null||n===void 0?void 0:n.updatePoints(b(i,s.scene.camera,this.arrow))}if(this.plane!=null){this.plane.updatePoints(j(i,s.scene.camera,t,o*y))}if(this.point!=null){this.point.updatePoints(O(i,s.scene.camera,t,o*C))}}getPlaneOpacity(){if(this.planeOpacity!=null){return typeof this.planeOpacity==="string"?parseFloat(this.planeOpacity):this.planeOpacity}return S}}const J=":host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;--viewer-hit-result-indicator-arrow-color:#0099cc;--viewer-hit-result-indicator-plane-color:#0099cc;--viewer-hit-result-indicator-outline-color:#000000;--viewer-hit-result-indicator-plane-opacity:0.75}.indicator{position:absolute;top:0;left:0}";const _=class{constructor(t){i(this,t);this.arrowColor="#0099cc";this.planeColor="#0099cc";this.outlineColor="#000000";this.planeOpacity=S;this.handleViewerFrameDrawn=()=>{this.updatePropsFromViewer()};this.handleViewerDimensionsChange=()=>{a((()=>{if(this.viewer!=null&&this.canvasRef!=null){this.canvasRef.width=this.viewer.viewport.width;this.canvasRef.height=this.viewer.viewport.height;this.updateAndRedrawIndicator()}}))};this.handleResize=()=>{if(this.canvasRef!=null){this.updateAndRedrawIndicator()}};this.updatePropsFromViewer=()=>{const{frame:i}=this.viewer||{};if(i!=null){const t=this.getIndicator();t.updateFrame(i)}};this.setupIndicator=i=>{var t,s;console.debug(`Initializing hit indicator. [initial-position=${JSON.stringify(this.position)}, initial-normal=${JSON.stringify(this.normal)} has-initial-frame=${((t=this.viewer)===null||t===void 0?void 0:t.frame)!=null}]`);this.indicator=new $(i,{arrow:this.arrowColor,plane:this.planeColor},{plane:this.planeOpacity});this.transform=this.createTransform();this.indicator.updateTransformAndNormal(this.transform,this.normal);if(((s=this.viewer)===null||s===void 0?void 0:s.frame)!=null){this.indicator.updateFrame(this.viewer.frame)}return this.indicator};this.updateAndRedrawIndicator=()=>{d((()=>{this.getIndicator().updateAndDraw()}))};this.createTransform=()=>{if(this.position!=null){return o.makeTranslation(this.position)}};this.getIndicator=()=>{if(this.indicator==null&&this.canvasRef!=null){return this.setupIndicator(this.canvasRef)}else if(this.indicator!=null){return this.indicator}else{throw new Error("Hit indicator was not initialized. The canvas element may not have been initialized.")}}}componentDidLoad(){this.handleViewerChanged(this.viewer,undefined);this.canvasResizeObserver=new ResizeObserver(this.handleResize);if(this.canvasRef!=null){this.canvasResizeObserver.observe(this.canvasRef);this.setupIndicator(this.canvasRef)}d((()=>{var i,t;const s=window.getComputedStyle(this.hostEl);this.arrowColor=N(s,"--viewer-hit-result-indicator-arrow-color");this.planeColor=N(s,"--viewer-hit-result-indicator-plane-color");this.outlineColor=N(s,"--viewer-hit-result-indicator-outline-color");this.planeOpacity=s.getPropertyValue("--viewer-hit-result-indicator-plane-opacity").trim();(i=this.indicator)===null||i===void 0?void 0:i.updateColors({arrow:this.arrowColor,plane:this.planeColor,outline:this.outlineColor});(t=this.indicator)===null||t===void 0?void 0:t.updateOpacities({plane:this.planeOpacity})}))}disconnectedCallback(){var i,t;(i=this.canvasResizeObserver)===null||i===void 0?void 0:i.disconnect();(t=this.indicator)===null||t===void 0?void 0:t.dispose()}handleViewerChanged(i,t){t===null||t===void 0?void 0:t.removeEventListener("frameDrawn",this.handleViewerFrameDrawn);t===null||t===void 0?void 0:t.removeEventListener("dimensionschange",this.handleViewerDimensionsChange);i===null||i===void 0?void 0:i.addEventListener("frameDrawn",this.handleViewerFrameDrawn);i===null||i===void 0?void 0:i.addEventListener("dimensionschange",this.handleViewerDimensionsChange)}handlePositionChanged(i,t){var s;this.transform=this.createTransform();console.debug(`Updating indicator position [previous=${JSON.stringify(t)}, current=${JSON.stringify(i)}]`);(s=this.indicator)===null||s===void 0?void 0:s.updateTransformAndNormal(this.transform,this.normal)}handleNormalChanged(i,t){var s;console.debug(`Updating indicator normal [previous=${JSON.stringify(t)}, current=${JSON.stringify(i)}]`);if(i){(s=this.indicator)===null||s===void 0?void 0:s.updateTransformAndNormal(this.transform,this.normal)}}render(){var i,n;return t(s,null,t("canvas",{ref:i=>{this.canvasRef=i},class:"indicator",width:(i=this.viewer)===null||i===void 0?void 0:i.viewport.width,height:(n=this.viewer)===null||n===void 0?void 0:n.viewport.height}))}get hostEl(){return n(this)}static get watchers(){return{viewer:["handleViewerChanged"],position:["handlePositionChanged"],normal:["handleNormalChanged"]}}};_.style=J;export{_ as vertex_viewer_hit_result_indicator};
-//# sourceMappingURL=p-d7a621a2.entry.js.map
+import{r as i,h as t,H as s,g as n}from"./p-6685b50e.js";import{v as h,m as o,q as e,r as l,c as r}from"./p-021bcb25.js";import{w as a,r as c}from"./p-b276d65a.js";import{M as d,R as u,r as v,s as p,T as f,c as m,a as w,A as g,b}from"./p-75cad0f2.js";import"./p-bcce32b5.js";import"./p-da65b274.js";import"./p-1f0ce5c8.js";import"./p-fdfb1d5a.js";import"./p-28dfd6fb.js";import"./p-ab1cef89.js";import"./p-8c65c44d.js";function N(i,t){return i.getPropertyValue(t).trim().replace(/["']*/g,"")}function j(i,t,s,n){const a=h.transformMatrix(s,o.makeRotation(e.fromMatrixRotation(i)));const c=h.fromMatrixPosition(i);const u=Math.abs(h.dot(a,h.up()))===1?h.left():h.normalize(h.cross(a,h.up()));const v=h.normalize(h.cross(u,a));const p=l.create({origin:c,direction:u});const f=l.create({origin:c,direction:v});const m=h.rotateAboutAxis(r.toRadians(45),l.at(p,-n),a,c);const w=h.rotateAboutAxis(r.toRadians(45),l.at(f,-n),a,c);const g=h.rotateAboutAxis(r.toRadians(45),l.at(f,n),a,c);const b=h.rotateAboutAxis(r.toRadians(45),l.at(p,n),a,c);const N=[m,w,b,g];return new d(!isNaN(u.x),[m,w,b,g],N.map((i=>h.transformMatrix(i,t.projectionViewMatrix))),(i=>h.distance(c,i)))}function O(i,t,s,n){const a=h.transformMatrix(s,o.makeRotation(e.fromMatrixRotation(i)));const c=h.fromMatrixPosition(i);const u=h.normalize(h.cross(a,h.normalize(t.viewVector)));const v=h.normalize(h.cross(a,u));const p=l.create({origin:c,direction:u});const f=l.create({origin:c,direction:v});const m=l.at(p,-n);const w=l.at(f,-n);const g=l.at(f,n);const b=l.at(p,n);const N=h.rotateAboutAxis(r.toRadians(45),m,a,c);const j=h.rotateAboutAxis(r.toRadians(45),w,a,c);const O=h.rotateAboutAxis(r.toRadians(45),g,a,c);const C=h.rotateAboutAxis(r.toRadians(45),b,a,c);const y=[m,N,w,j,b,C,g,O];return new d(!isNaN(u.x),y,y.map((i=>h.transformMatrix(i,t.projectionViewMatrix))),(i=>h.distance(c,i)))}const C=.4;const y=5;const S=.75;class $ extends u{constructor(i,t={},s={}){super(i);this.arrowFillColor=t.arrow;this.planeFillColor=t.plane;this.outlineColor=t.outline;this.planeOpacity=s.plane}updateTransformAndNormal(i,t){var s;this.transform=i;this.normal=t;if(i!=null&&t!=null&&this.frame!=null){this.updateAndDraw()}else{this.clear();(s=this.reglFrameDisposable)===null||s===void 0?void 0:s.cancel();this.reglFrameDisposable=undefined}}updateColors(i){var t,s,n,h,o,e,l,r,a;this.arrowFillColor=(t=i.arrow)!==null&&t!==void 0?t:this.arrowFillColor;this.planeFillColor=(s=i.plane)!==null&&s!==void 0?s:this.planeFillColor;this.outlineColor=(n=i.outline)!==null&&n!==void 0?n:this.outlineColor;(h=this.arrow)===null||h===void 0?void 0:h.updateFillColor(this.arrowFillColor);(o=this.plane)===null||o===void 0?void 0:o.updateFillColor(this.planeFillColor);(e=this.arrow)===null||e===void 0?void 0:e.updateOutlineColor(this.outlineColor);(l=this.plane)===null||l===void 0?void 0:l.updateOutlineColor(this.outlineColor);(r=this.point)===null||r===void 0?void 0:r.updateOutlineColor(this.outlineColor);(a=this.axis)===null||a===void 0?void 0:a.updateOutlineColor(this.outlineColor)}updateOpacities(i){this.planeOpacity=i.plane}hasData(){return this.transform!=null&&this.normal!=null}createOrUpdateElements(){if(this.transform!=null&&this.normal!=null&&this.frame!=null){if(this.arrow==null){this.createElements(this.transform,this.normal,this.frame)}else{this.updateElements(this.transform,this.normal,this.frame)}}}createElements(i,t,s){this.reglCommand=v({canvas:this.canvasElement,extensions:"angle_instanced_arrays"});const{createShape:n}=p(this.reglCommand);const o=this.computeTriangleSize(h.fromMatrixPosition(i),s);this.arrow=new f(n,"hit-normal-arrow",m(i,s.scene.camera,t,o),this.outlineColor,this.arrowFillColor);this.plane=new w(n,"hit-plane",j(i,s.scene.camera,t,o*y),this.outlineColor,this.planeFillColor,{opacity:this.getPlaneOpacity(),depth:.5});this.point=new w(n,"hit-position",O(i,s.scene.camera,t,o*C),this.outlineColor,this.outlineColor,{join:"round",depth:1});this.axis=new g(n,"hit-normal-axis",b(i,s.scene.camera,this.arrow),this.outlineColor,this.arrowFillColor);this.availableElements=[this.arrow,this.point,this.plane,this.axis]}updateElements(i,t,s){var n;const o=this.computeTriangleSize(h.fromMatrixPosition(i),s);if(this.arrow!=null){this.arrow.updatePoints(m(i,s.scene.camera,t,o));(n=this.axis)===null||n===void 0?void 0:n.updatePoints(b(i,s.scene.camera,this.arrow))}if(this.plane!=null){this.plane.updatePoints(j(i,s.scene.camera,t,o*y))}if(this.point!=null){this.point.updatePoints(O(i,s.scene.camera,t,o*C))}}getPlaneOpacity(){if(this.planeOpacity!=null){return typeof this.planeOpacity==="string"?parseFloat(this.planeOpacity):this.planeOpacity}return S}}const J=":host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;--viewer-hit-result-indicator-arrow-color:#0099cc;--viewer-hit-result-indicator-plane-color:#0099cc;--viewer-hit-result-indicator-outline-color:#000000;--viewer-hit-result-indicator-plane-opacity:0.75}.indicator{position:absolute;top:0;left:0}";const _=class{constructor(t){i(this,t);this.arrowColor="#0099cc";this.planeColor="#0099cc";this.outlineColor="#000000";this.planeOpacity=S;this.handleViewerFrameDrawn=()=>{this.updatePropsFromViewer()};this.handleViewerDimensionsChange=()=>{a((()=>{if(this.viewer!=null&&this.canvasRef!=null){this.canvasRef.width=this.viewer.viewport.width;this.canvasRef.height=this.viewer.viewport.height;this.updateAndRedrawIndicator()}}))};this.handleResize=()=>{if(this.canvasRef!=null){this.updateAndRedrawIndicator()}};this.updatePropsFromViewer=()=>{const{frame:i}=this.viewer||{};if(i!=null){const t=this.getIndicator();t.updateFrame(i)}};this.setupIndicator=i=>{var t,s;console.debug(`Initializing hit indicator. [initial-position=${JSON.stringify(this.position)}, initial-normal=${JSON.stringify(this.normal)} has-initial-frame=${((t=this.viewer)===null||t===void 0?void 0:t.frame)!=null}]`);this.indicator=new $(i,{arrow:this.arrowColor,plane:this.planeColor},{plane:this.planeOpacity});this.transform=this.createTransform();this.indicator.updateTransformAndNormal(this.transform,this.normal);if(((s=this.viewer)===null||s===void 0?void 0:s.frame)!=null){this.indicator.updateFrame(this.viewer.frame)}return this.indicator};this.updateAndRedrawIndicator=()=>{c((()=>{this.getIndicator().updateAndDraw()}))};this.createTransform=()=>{if(this.position!=null){return o.makeTranslation(this.position)}};this.getIndicator=()=>{if(this.indicator==null&&this.canvasRef!=null){return this.setupIndicator(this.canvasRef)}else if(this.indicator!=null){return this.indicator}else{throw new Error("Hit indicator was not initialized. The canvas element may not have been initialized.")}}}componentDidLoad(){this.handleViewerChanged(this.viewer,undefined);this.canvasResizeObserver=new ResizeObserver(this.handleResize);if(this.canvasRef!=null){this.canvasResizeObserver.observe(this.canvasRef);this.setupIndicator(this.canvasRef)}c((()=>{var i,t;const s=window.getComputedStyle(this.hostEl);this.arrowColor=N(s,"--viewer-hit-result-indicator-arrow-color");this.planeColor=N(s,"--viewer-hit-result-indicator-plane-color");this.outlineColor=N(s,"--viewer-hit-result-indicator-outline-color");this.planeOpacity=s.getPropertyValue("--viewer-hit-result-indicator-plane-opacity").trim();(i=this.indicator)===null||i===void 0?void 0:i.updateColors({arrow:this.arrowColor,plane:this.planeColor,outline:this.outlineColor});(t=this.indicator)===null||t===void 0?void 0:t.updateOpacities({plane:this.planeOpacity})}))}disconnectedCallback(){var i,t;(i=this.canvasResizeObserver)===null||i===void 0?void 0:i.disconnect();(t=this.indicator)===null||t===void 0?void 0:t.dispose()}handleViewerChanged(i,t){t===null||t===void 0?void 0:t.removeEventListener("frameDrawn",this.handleViewerFrameDrawn);t===null||t===void 0?void 0:t.removeEventListener("dimensionschange",this.handleViewerDimensionsChange);i===null||i===void 0?void 0:i.addEventListener("frameDrawn",this.handleViewerFrameDrawn);i===null||i===void 0?void 0:i.addEventListener("dimensionschange",this.handleViewerDimensionsChange)}handlePositionChanged(i,t){var s;this.transform=this.createTransform();console.debug(`Updating indicator position [previous=${JSON.stringify(t)}, current=${JSON.stringify(i)}]`);(s=this.indicator)===null||s===void 0?void 0:s.updateTransformAndNormal(this.transform,this.normal)}handleNormalChanged(i,t){var s;console.debug(`Updating indicator normal [previous=${JSON.stringify(t)}, current=${JSON.stringify(i)}]`);if(i){(s=this.indicator)===null||s===void 0?void 0:s.updateTransformAndNormal(this.transform,this.normal)}}render(){var i,n;return t(s,null,t("canvas",{ref:i=>{this.canvasRef=i},class:"indicator",width:(i=this.viewer)===null||i===void 0?void 0:i.viewport.width,height:(n=this.viewer)===null||n===void 0?void 0:n.viewport.height}))}get hostEl(){return n(this)}static get watchers(){return{viewer:["handleViewerChanged"],position:["handlePositionChanged"],normal:["handleNormalChanged"]}}};_.style=J;export{_ as vertex_viewer_hit_result_indicator};
+//# sourceMappingURL=p-07d2b2fa.entry.js.map