@vertexvis/viewer 0.15.2-testing.4 → 0.15.2

package/dist/cjs/vertex-viewer-pin-group.cjs.entry.js

@@ -1,5 +1,5 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 
@@ -7,16 +7,17 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-70db349e.js');
 const bundle_esm = require('./bundle.esm-22b6f2d6.js');
-require('./cursors-85d403e9.js');
-require('./mapper-216603b0.js');
+require('./cursors-02a06ec9.js');
+require('./mapper-d4145b72.js');
 require('./grpc-web-client.umd-2af20c1b.js');
-require('./streamAttributes-7725f5c4.js');
+require('./streamAttributes-cf0c513d.js');
 require('./entities-9eb7e608.js');
 const viewport = require('./viewport-5ca619f7.js');
-const model = require('./model-b61f4d20.js');
+const model = require('./model-19fb560a.js');
 const index$1 = require('./index-b9d13137.js');
 require('./browser.esm-5d246754.js');
 require('./_commonjsHelpers-dcc4cf71.js');
+require('./bundle.esm-b43c197a.js');
 
 // eslint-disable-next-line @typescript-eslint/no-unused-vars
 const PinRenderer = ({ pin, selected, }) => {
@@ -80,10 +81,14 @@ const ViewerPinGroup = class {
     };
   }
   componentDidLoad() {
+    var _a;
     this.setLabelObserver();
     if (this.pinController == null) {
       this.pinController = new model.PinController(this.pinModel);
     }
+    if (this.selected) {
+      (_a = this.labelEl) === null || _a === void 0 ? void 0 : _a.setFocus();
+    }
   }
   disconnectedCallback() {
     var _a, _b;

package/dist/cjs/vertex-viewer-pin-label_2.cjs.entry.js

@@ -1,5 +1,5 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 
@@ -9,7 +9,7 @@ const index = require('./index-70db349e.js');
 const bundle_esm = require('./bundle.esm-22b6f2d6.js');
 const index$1 = require('./index-b9d13137.js');
 const dom = require('./dom-8d90bfaf.js');
-const model = require('./model-b61f4d20.js');
+const model = require('./model-19fb560a.js');
 const stencil = require('./stencil-fc92b387.js');
 require('./_commonjsHelpers-dcc4cf71.js');
 require('./browser.esm-5d246754.js');
@@ -40,12 +40,15 @@ const VertexPinLabel = class {
       });
     };
     this.handleInputKeyDown = (event) => {
-      if (event.key === 'Enter' && (event.ctrlKey || event.metaKey)) {
-        event.preventDefault();
-        this.submit();
+      event.stopPropagation();
+      if (event.key === 'Enter' &&
+        (event.ctrlKey || event.metaKey || event.shiftKey)) {
+        this.textareaRows += 1;
+        this.value += '\n';
       }
       else if (event.key === 'Enter') {
-        this.textareaRows += 1;
+        event.preventDefault();
+        this.submit();
       }
     };
     this.handlePointerDown = (event) => {
@@ -64,6 +67,8 @@ const VertexPinLabel = class {
       if (this.elementBounds != null &&
         this.relativePointerDownPosition &&
         this.pinPointerDownPosition != null) {
+        // Prevent selection of any text while interacting with the label
+        event.preventDefault();
         const point = dom.getMouseClientPosition(event, this.elementBounds);
         const relative = model.translatePointToRelative(point, this.elementBounds);
         const relativeDelta = bundle_esm.point.subtract(relative, this.relativePointerDownPosition);
@@ -108,12 +113,9 @@ const VertexPinLabel = class {
     var _a, _b, _c;
     // HTMLInputElement.focus() doesn't exist in tests.
     if (typeof ((_a = this.inputEl) === null || _a === void 0 ? void 0 : _a.focus) === 'function') {
-      if (this.focused) {
-        (_b = this.inputEl) === null || _b === void 0 ? void 0 : _b.focus();
-      }
-      else {
-        (_c = this.inputEl) === null || _c === void 0 ? void 0 : _c.blur();
-      }
+      this.focused = true;
+      this.labelFocused.emit((_b = this.pin) === null || _b === void 0 ? void 0 : _b.id);
+      (_c = this.inputEl) === null || _c === void 0 ? void 0 : _c.focus();
     }
   }
   watchFocusChange() {
@@ -190,7 +192,7 @@ const VertexPinLabel = class {
   }
   computeMinWidth() {
     if (this.contentElBounds != null) {
-      const expected = `${this.contentElBounds.width + 16}px`;
+      const expected = `${this.contentElBounds.width + 8}px`;
       return `min(${expected}, ${this.computeMaxWidth()})`;
     }
     else {

package/dist/cjs/vertex-viewer-pin-tool.cjs.entry.js

@@ -1,22 +1,22 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
 const index = require('./index-70db349e.js');
-const model = require('./model-b61f4d20.js');
+const model = require('./model-19fb560a.js');
 const bundle_esm = require('./bundle.esm-22b6f2d6.js');
 const browser_esm = require('./browser.esm-5d246754.js');
-const cursors = require('./cursors-85d403e9.js');
+const cursors = require('./cursors-02a06ec9.js');
 const dom = require('./dom-8d90bfaf.js');
 const elementRectObserver = require('./elementRectObserver-9b28f182.js');
 const entities = require('./entities-9eb7e608.js');
 const dom$1 = require('./dom-d1bbd67c.js');
 
 class PinsInteractionHandler {
-  constructor(controller) {
+  constructor(controller, xOffset, yOffset) {
     this.rectObserver = new elementRectObserver.ElementRectObserver();
     this.droppableSurfaces = [
       entities.EntityType.PRECISE_SURFACE,
@@ -32,7 +32,7 @@ class PinsInteractionHandler {
       if (this.controller.getDraggable() == null &&
         this.controller.getToolMode() === 'edit' &&
         isDroppableSurface) {
-        this.addCursor(this.getCusorType());
+        this.addCursor(this.getCursorType());
       }
       else {
         this.clearCursor();
@@ -86,6 +86,8 @@ class PinsInteractionHandler {
       }
     };
     this.controller = controller;
+    this.xOffset = xOffset;
+    this.yOffset = yOffset;
   }
   get elementRect() {
     return this.rectObserver.rect;
@@ -119,7 +121,6 @@ class PinsInteractionHandler {
       var _a, _b, _c, _d, _e, _f;
       const [hit] = await api.hitItems(pt);
       if ((hit === null || hit === void 0 ? void 0 : hit.hitPoint) != null && this.elementRect != null) {
-        const relativePoint = model.translatePointToRelative(pt, this.elementRect);
         if ((hit === null || hit === void 0 ? void 0 : hit.hitPoint) != null &&
           (hit === null || hit === void 0 ? void 0 : hit.hitPoint.x) != null &&
           (hit === null || hit === void 0 ? void 0 : hit.hitPoint.y) != null &&
@@ -145,6 +146,8 @@ class PinsInteractionHandler {
               });
               break;
             case 'pin-text':
+              const isNewPin = existingPin == null;
+              const relativePoint = model.translatePointToRelative(pt, this.elementRect, isNewPin, this.xOffset, this.yOffset);
               this.controller.setPin({
                 type: 'text',
                 id: pinId,
@@ -159,6 +162,7 @@ class PinsInteractionHandler {
                 },
                 attributes,
               });
+              this.controller.setSelectedPinId(pinId);
               break;
           }
         }
@@ -168,7 +172,7 @@ class PinsInteractionHandler {
       }
     });
   }
-  getCusorType() {
+  getCursorType() {
     switch (this.controller.getToolType()) {
       case 'pin-icon':
         return cursors.pinCursor;
@@ -201,7 +205,7 @@ class PinsInteractionHandler {
   }
 }
 
-const viewerPinToolCss = ":host{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}";
+const viewerPinToolCss = ":host{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none;--viewer-pin-tool-initial-label-offset-x:20;--viewer-pin-tool-initial-label-offset-y:20}";
 
 const ViewerPinTool = class {
   constructor(hostRef) {
@@ -325,10 +329,17 @@ const ViewerPinTool = class {
   }
   setupInteractionHandler() {
     var _a;
+    const hostStyles = window.getComputedStyle(this.hostEl);
+    const xOffset = hostStyles
+      .getPropertyValue('--viewer-pin-tool-initial-label-offset-x')
+      .trim();
+    const yOffset = hostStyles
+      .getPropertyValue('--viewer-pin-tool-initial-label-offset-y')
+      .trim();
     this.clearInteractionHandler();
     if (this.pinController != null) {
       this.registeredInteractionHandler =
-        (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.registerInteractionHandler(new PinsInteractionHandler(this.pinController));
+        (_a = this.viewer) === null || _a === void 0 ? void 0 : _a.registerInteractionHandler(new PinsInteractionHandler(this.pinController, parseInt(xOffset), parseInt(yOffset)));
     }
   }
   clearModelListeners() {

package/dist/cjs/vertex-viewer-spinner.cjs.entry.js

@@ -1,5 +1,5 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 

package/dist/cjs/vertex-viewer-transform-widget.cjs.entry.js

@@ -1,5 +1,5 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 
@@ -11,9 +11,10 @@ const index$1 = require('./index-b9d13137.js');
 const stencil = require('./stencil-fc92b387.js');
 const browser_esm = require('./browser.esm-5d246754.js');
 const _commonjsHelpers = require('./_commonjsHelpers-dcc4cf71.js');
-require('./streamAttributes-7725f5c4.js');
+require('./streamAttributes-cf0c513d.js');
 require('./entities-9eb7e608.js');
 const viewport = require('./viewport-5ca619f7.js');
+require('./bundle.esm-b43c197a.js');
 
 class TransformController {
   constructor(stream) {
@@ -12498,7 +12499,7 @@ function computeDrawable2dBounds(viewport, ...elements) {
   let max = bundle_esm.point.create();
   elements
     .filter((m) => m.points.valid)
-    .map((m) => {
+    .forEach((m) => {
     m.points
       .toArray()
       .map((pt) => viewport.transformNdcPointToViewport(pt))
@@ -13131,6 +13132,7 @@ const ViewerTransformWidget = class {
       });
       if (this.position != null) {
         this.currentTransform = bundle_esm.matrix4.makeTranslation(this.position);
+        this.startingTransform = this.currentTransform;
         this.widget.updateTransform(this.currentTransform);
       }
       if (((_b = this.viewer) === null || _b === void 0 ? void 0 : _b.frame) != null) {
@@ -13235,7 +13237,7 @@ const ViewerTransformWidget = class {
     var _a, _b;
     this.currentTransform = this.getTransform(oldPosition, newPosition);
     this.startingTransform = this.currentTransform;
-    console.debug(`Updating widget position [previous=${JSON.stringify(newPosition)}, current=${JSON.stringify(oldPosition)}]`);
+    console.debug(`Updating widget position [previous=${JSON.stringify(oldPosition)}, current=${JSON.stringify(newPosition)}]`);
     (_a = this.widget) === null || _a === void 0 ? void 0 : _a.updateTransform(this.currentTransform);
     if (newPosition == null) {
       (_b = this.controller) === null || _b === void 0 ? void 0 : _b.clearTransform();

package/dist/cjs/vertex-viewer-view-cube.cjs.entry.js

@@ -1,5 +1,5 @@
 /**!
- * Copyright (c) 2022 Vertex Software LLC. All rights reserved.
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
  */
 'use strict';
 
@@ -8,9 +8,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 const index = require('./index-70db349e.js');
 const bundle_esm = require('./bundle.esm-22b6f2d6.js');
 const stencil = require('./stencil-fc92b387.js');
-const streamAttributes = require('./streamAttributes-7725f5c4.js');
+const streamAttributes = require('./streamAttributes-cf0c513d.js');
 require('./entities-9eb7e608.js');
 const index$1 = require('./index-b9d13137.js');
+require('./bundle.esm-b43c197a.js');
 require('./browser.esm-5d246754.js');
 require('./_commonjsHelpers-dcc4cf71.js');
 
@@ -105,11 +106,11 @@ const ViewerViewCube = class {
     /**
      * The label for the side of the cube on the positive x-axis.
      */
-    this.xPositiveLabel = 'Left';
+    this.xPositiveLabel = 'Right';
     /**
      * The label for the side of the cube on the negative x-axis.
      */
-    this.xNegativeLabel = 'Right';
+    this.xNegativeLabel = 'Left';
     /**
      * The label for the side of the cube on the positive y-axis.
      */