@vertexvis/viewer 1.1.1-testing.3 → 1.1.1-testing.5

package/dist/cjs/vertex-viewer-measurement-distance.cjs.entry.js

@@ -4,21 +4,21 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle$1 = require('./bundle-07I6_WqC.js');
+var bundle$1 = require('./bundle-BCS0nA91.js');
 var cursors = require('./cursors-B-QSF9lQ.js');
-var dom = require('./dom-Dlu6-7PF.js');
-require('./geometry_pb-BISQT2vx.js');
+var dom = require('./dom-BuQSLPWr.js');
+require('./geometry_pb-asn2mNvW.js');
 require('./wrappers_pb-Dupo3Hcb.js');
 require('./wrappers_pb-DCb8h8QZ.js');
 require('./bundle-Dtdz7qlD.js');
-var streamAttributes = require('./streamAttributes-CJOD7AxG.js');
+var streamAttributes = require('./streamAttributes-M3UUIO3l.js');
 var model = require('./model-DRuHxTKu.js');
-var overlays = require('./overlays-BujVkBnG.js');
-var results = require('./results-BpfUIwa8.js');
+var overlays = require('./overlays-DASFbMSp.js');
+var results = require('./results-CU9Ctm2K.js');
 require('./entities-BhIrCJqA.js');
-var viewport = require('./viewport-B70DgDZj.js');
+var viewport = require('./viewport-BDbB9o9T.js');
 var bundle = require('./bundle-CLGyVDEW.js');
-var utils = require('./utils-DY6afhh8.js');
+var utils = require('./utils-opS9hsaU.js');
 var index$1 = require('./index-CRUoPh1y.js');
 require('./_commonjsHelpers-CBbBosIU.js');
 

package/dist/cjs/vertex-viewer-measurement-line_2.cjs.entry.js

@@ -4,14 +4,14 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle = require('./bundle-07I6_WqC.js');
-require('./geometry_pb-BISQT2vx.js');
+var bundle = require('./bundle-BCS0nA91.js');
+require('./geometry_pb-asn2mNvW.js');
 require('./wrappers_pb-Dupo3Hcb.js');
 require('./wrappers_pb-DCb8h8QZ.js');
 require('./bundle-Dtdz7qlD.js');
-require('./streamAttributes-CJOD7AxG.js');
-var overlays = require('./overlays-BujVkBnG.js');
-var utils = require('./utils-DY6afhh8.js');
+require('./streamAttributes-M3UUIO3l.js');
+var overlays = require('./overlays-DASFbMSp.js');
+var utils = require('./utils-opS9hsaU.js');
 require('./bundle-CLGyVDEW.js');
 require('./_commonjsHelpers-CBbBosIU.js');
 require('./entities-BhIrCJqA.js');

package/dist/cjs/vertex-viewer-measurement-precise.cjs.entry.js

@@ -5,17 +5,17 @@
 
 var index = require('./index-1H7bCrlx.js');
 var scene_view_api_pb_service = require('./scene_view_api_pb_service-DYpTDhrh.js');
-var config = require('./config-CepHuwRF.js');
-var entities = require('./entities-BdWnb6KI.js');
+var config = require('./config-OELTgslY.js');
+var entities = require('./entities-rj-TEPKc.js');
 require('./bundle-Dtdz7qlD.js');
-require('./geometry_pb-BISQT2vx.js');
+require('./geometry_pb-asn2mNvW.js');
 require('./wrappers_pb-Dupo3Hcb.js');
-require('./streamAttributes-CJOD7AxG.js');
+require('./streamAttributes-M3UUIO3l.js');
 var model = require('./model-DRuHxTKu.js');
-var overlays = require('./overlays-BujVkBnG.js');
-var bundle = require('./bundle-07I6_WqC.js');
+var overlays = require('./overlays-DASFbMSp.js');
+var bundle = require('./bundle-BCS0nA91.js');
 var cursors = require('./cursors-B-QSF9lQ.js');
-var dom = require('./dom-Dlu6-7PF.js');
+var dom = require('./dom-BuQSLPWr.js');
 var elementRectObserver = require('./elementRectObserver-BobgIEu6.js');
 var entities$1 = require('./entities-BhIrCJqA.js');
 require('./wrappers_pb-DCb8h8QZ.js');

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

@@ -4,18 +4,18 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle = require('./bundle-07I6_WqC.js');
+var bundle = require('./bundle-BCS0nA91.js');
 require('./controller-brlXtuMh.js');
 require('./cursors-B-QSF9lQ.js');
-require('./geometry_pb-BISQT2vx.js');
+require('./geometry_pb-asn2mNvW.js');
 require('./wrappers_pb-Dupo3Hcb.js');
 require('./wrappers_pb-DCb8h8QZ.js');
 require('./bundle-Dtdz7qlD.js');
-require('./streamAttributes-CJOD7AxG.js');
-require('./representation_pb-CHCm5o1e.js');
+require('./streamAttributes-M3UUIO3l.js');
+require('./representation_pb-BVBPrHLf.js');
 require('./entities-BhIrCJqA.js');
-var viewport = require('./viewport-B70DgDZj.js');
-var model = require('./model-Dy5FvjIA.js');
+var viewport = require('./viewport-BDbB9o9T.js');
+var model = require('./model-BC6acIWJ.js');
 var index$1 = require('./index-CRUoPh1y.js');
 require('./errors-C-mfaQwO.js');
 require('./bundle-CLGyVDEW.js');
@@ -63,7 +63,7 @@ function getClosestCenterToPoint(boxPoint, pointToMeasure, dimensions) {
     return candidates[candidateIndex];
 }
 
-const viewerPinGroupCss = () => `:host{--viewer-annotations-pin-primary-color:var(--blue-700);--viewer-annotations-pin-accent-color:var(--blue-200);--viewer-annotations-pin-dot-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-font-size:0.75rem;--viewer-annotations-pin-selected-stroke:var(--white);--viewer-annotations-pin-selected-border:2px solid var(--white);--viewer-annotations-pin-label-border:2px solid var(--black);--viewer-annotations-pin-selected-stroke:var(--white);font-size:var(--viewer-annotations-pin-font-size);position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.pin-anchor{position:absolute;border-radius:50%;transform:translate(-50%, -50%);display:block;width:9px;height:9px;box-sizing:border-box;border:var(--viewer-annotations-pin-label-border);background:var(--viewer-annotations-pin-dot-color);pointer-events:auto;cursor:pointer}.selected{width:13px;height:13px;border:var(--viewer-annotations-pin-selected-border)}.pin{color:var(--viewer-annotations-pin-color);cursor:pointer;transition:opacity 0.3s ease-in;transform:translate(0px, -12px)}.pin-selected{stroke-width:1;stroke:var(--viewer-annotations-pin-selected-stroke)}.pin-occluded{opacity:.3;transition:opacity 0.3s ease-in}.pin-detached{visibility:hidden}`;
+const viewerPinGroupCss = () => `:host{--viewer-annotations-pin-primary-color:var(--blue-700);--viewer-annotations-pin-accent-color:var(--blue-200);--viewer-annotations-pin-dot-color:var(     --viewer-annotations-pin-primary-color   );--viewer-annotations-pin-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-font-size:0.75rem;--viewer-annotations-pin-selected-stroke:var(--white);--viewer-annotations-pin-selected-border:2px solid var(--white);--viewer-annotations-pin-label-border:2px solid var(--black);--viewer-annotations-pin-selected-stroke:var(--white);font-size:var(--viewer-annotations-pin-font-size);position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.pin-anchor{position:absolute;border-radius:50%;transform:translate(-50%, -50%);display:block;width:9px;height:9px;box-sizing:border-box;border:var(--viewer-annotations-pin-label-border);background:var(--viewer-annotations-pin-dot-color);pointer-events:auto;cursor:pointer}.selected{width:13px;height:13px;border:var(--viewer-annotations-pin-selected-border)}.pin{color:var(--viewer-annotations-pin-color);cursor:pointer;transition:opacity 0.3s ease-in;transform:translate(0px, -12px)}.pin-selected{stroke-width:1;stroke:var(--viewer-annotations-pin-selected-stroke)}.pin-occluded{opacity:0.3;transition:opacity 0.3s ease-in}.pin-detached{visibility:hidden}`;
 
 const ViewerPinGroup = class {
     constructor(hostRef) {

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

@@ -1 +1 @@
-{"file":"vertex-viewer-pin-group.cjs.entry.js","mappings":"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","names":["getPinColors","h","Fragment","isTextPin","classNames","isIconPin","Point","Matrix4","PinModel","PinController","translatePointToScreen","Vector3","Viewport"],"sources":["src/components/viewer-pin-group/pin-renderer.tsx","src/components/viewer-pin-group/utils.ts","src/components/viewer-pin-group/viewer-pin-group.css?tag=vertex-viewer-pin-group","src/components/viewer-pin-group/viewer-pin-group.tsx"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { Fragment, FunctionalComponent, h } from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { getPinColors, isIconPin, isTextPin, Pin } from '../../lib/pins/model';\n\ninterface PinRendererProps {\n  pin?: Pin;\n  selected: boolean;\n  occluded: boolean;\n  detached: boolean;\n}\n\nexport const PinRenderer: FunctionalComponent<PinRendererProps> = ({\n  pin,\n  selected,\n  occluded,\n  detached,\n}) => {\n  const { primaryColor } = getPinColors(pin);\n\n  return (\n    <Fragment>\n      {isTextPin(pin) && (\n        <div\n          id=\"pin-anchor\"\n          class={classNames('pin-anchor', {\n            selected: selected,\n            'pin-occluded': occluded,\n            'pin-detached': detached,\n          })}\n          style={{\n            background: primaryColor,\n          }}\n        ></div>\n      )}\n\n      {isIconPin(pin) && (\n        <vertex-viewer-icon\n          name=\"pin-fill\"\n          size=\"lg\"\n          class={classNames('pin', {\n            'pin-selected': selected,\n            'pin-occluded': occluded,\n            'pin-detached': detached,\n          })}\n          style={{\n            color: primaryColor,\n          }}\n        />\n      )}\n    </Fragment>\n  );\n};\n","import { Dimensions, Point } from '@vertexvis/geometry';\n\nexport function getClosestCenterToPoint(\n  boxPoint: Point.Point,\n  pointToMeasure: Point.Point,\n  dimensions: Dimensions.Dimensions,\n): Point.Point {\n  const topPoint = {\n    x: boxPoint.x + dimensions.width / 2,\n    y: boxPoint.y,\n  };\n\n  const bottomPoint = {\n    x: boxPoint.x + dimensions.width / 2,\n    y: boxPoint.y + dimensions.height,\n  };\n\n  const rightPoint = {\n    x: boxPoint.x + dimensions.width,\n    y: boxPoint.y + dimensions.height / 2,\n  };\n\n  const leftPoint = {\n    x: boxPoint.x,\n    y: boxPoint.y + dimensions.height / 2,\n  };\n\n  const candidates = [topPoint, bottomPoint, leftPoint, rightPoint];\n\n  const distances = candidates.map((candidate) =>\n    Point.distance(candidate, pointToMeasure),\n  );\n\n  const candidateIndex = distances.indexOf(Math.min(...distances));\n  return candidates[candidateIndex];\n}\n",":host {\n\n  /**\n   * @prop  --viewer-annotations-pin-primary-color: A CSS color that\n   * specifies the primary color for the pins. This value gets used for the dot color \n   * and borders\n   */\n  --viewer-annotations-pin-primary-color: var(--blue-700);\n\n  /**\n   * @prop  --viewer-annotations-pin-accent-color: A CSS color that\n   * specifies the accent color for the pins. This value gets used for background colors\n   * \n   */\n\n  --viewer-annotations-pin-accent-color: var(--blue-200);\n  /**\n   * @prop  viewer-annotations-pin-dot-color: A CSS color that\n   * specifies the color of the anchor dot\n   */\n   --viewer-annotations-pin-dot-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop  --viewer-annotations-pin-color: A CSS color that\n   * specifies the color of the pin\n   */\n   --viewer-annotations-pin-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop  --viewer-annotations-pin-font-size: A CSS property to specify\n   the font size of the pin\n   */\n   --viewer-annotations-pin-font-size: 0.75rem;\n\n  /**\n   * @prop  --viewer-annotations-pin-selected-stroke: A CSS color that\n   * specifies the stroke color of a selected pin\n   */\n   --viewer-annotations-pin-selected-stroke: var(--white);\n\n  /**\n   * @prop   --viewer-annotations-pin-selected-border: A CSS color that\n   * specifies the border of a selected pin\n   */\n   --viewer-annotations-pin-selected-border:  2px solid var(--white);\n\n  /**\n   * @prop --viewer-annotations-pin-label-border: A CSS color that\n   * specifies the border of a text pin anchor\n   */\n   --viewer-annotations-pin-label-border:  2px solid var(--black);\n\n  /**\n   * @prop   --viewer-annotations-pin-selected-border: A CSS color that\n   * specifies the stroke of a selected default pin\n   */\n   --viewer-annotations-pin-selected-stroke: var(--white);\n\n  font-size: var(--viewer-annotations-pin-font-size);\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.pin-anchor {\n  position: absolute;\n  border-radius: 50%;\n  transform: translate(-50%, -50%);\n  display: block;\n  width: 9px;\n  height: 9px;\n  box-sizing: border-box;\n  border: var(--viewer-annotations-pin-label-border);\n  background: var(--viewer-annotations-pin-dot-color);\n  pointer-events: auto;\n  cursor: pointer;\n}\n\n.selected {\n  width: 13px;\n  height: 13px;\n  border: var(--viewer-annotations-pin-selected-border)\n}\n\n.pin {\n  color: var(--viewer-annotations-pin-color);\n  cursor: pointer;\n  transition: opacity 0.3s ease-in;\n\n  /**\n   * Place bottom point of the pin at the location instead of the middle of the pin\n   */\n  transform: translate(0px, -12px);\n}\n\n.pin-selected {\n  stroke-width: 1;\n  stroke: var(--viewer-annotations-pin-selected-stroke);\n}\n\n.pin-occluded {\n  opacity: .3;\n  transition: opacity 0.3s ease-in;\n}\n\n.pin-detached {\n  visibility: hidden;\n}","import {\n  Component,\n  Fragment,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  JSX,\n  Listen,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { Dimensions, Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { Viewport } from '../..';\nimport { PinController } from '../../lib/pins/controller';\nimport { isTextPin, Pin, TextPin } from '../../lib/pins/model';\nimport { PinModel } from '../../lib/pins/model';\nimport { translatePointToScreen } from '../viewer-pin-tool/utils';\nimport { PinRenderer } from './pin-renderer';\nimport { getClosestCenterToPoint } from './utils';\n\ninterface ComputedPoints {\n  pinPoint: Point.Point;\n  labelPoint?: Point.Point;\n}\n\n@Component({\n  tag: 'vertex-viewer-pin-group',\n  styleUrl: 'viewer-pin-group.css',\n  shadow: false,\n})\nexport class ViewerPinGroup {\n  /**\n   * The pin to draw for the group\n   */\n  @Prop()\n  public pin?: Pin;\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   * Projection view matrix used for computing the position of the pin line\n   */\n  @Prop()\n  public projectionViewMatrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n  /**\n   * The dimensions of the canvas for the pins\n   */\n  @Prop({ mutable: true })\n  public elementBounds?: DOMRect;\n\n  /**\n   * The model that contains the entities and outcomes from performing pin operations\n   */\n  @Prop()\n  public pinModel: PinModel = new PinModel();\n\n  /**\n   * The controller that drives behavior for pin operations\n   */\n  @Prop({ mutable: true })\n  public pinController?: PinController;\n\n  /**\n   * Whether the pin is \"selected\"\n   */\n  @Prop()\n  public selected = false;\n\n  /**\n   * @internal\n   * Whether the pin is occluded\n   */\n  @Prop({ mutable: true, reflect: true })\n  public occluded = false;\n\n  /**\n   * @internal\n   * Whether the pin is detached\n   */\n  @Prop({ mutable: true, reflect: true })\n  public detached = false;\n\n  @State()\n  private invalidateStateCounter = 0;\n\n  private labelEl: HTMLVertexViewerPinLabelElement | undefined;\n\n  private resizeObserver?: ResizeObserver;\n\n  protected componentWillLoad(): void {\n    if (this.pinController == null) {\n      this.pinController = new PinController(this.pinModel);\n    }\n  }\n\n  protected componentDidLoad(): void {\n    this.setLabelObserver();\n\n    if (this.selected) {\n      this.labelEl?.setFocus();\n    }\n  }\n\n  /**\n   * @ignore\n   */\n  @Listen('occlusionStateChanged')\n  protected async handleOcclusionStateChanged(\n    event: CustomEvent<boolean>,\n  ): Promise<void> {\n    this.occluded = event.detail;\n  }\n\n  /**\n   * @ignore\n   */\n  @Listen('detachedStateChanged')\n  protected async handleDetachedStateChanged(\n    event: CustomEvent<boolean>,\n  ): Promise<void> {\n    this.detached = event.detail;\n  }\n\n  protected disconnectedCallback(): void {\n    this.labelEl?.removeEventListener('labelChanged', this.invalidateState);\n    this.resizeObserver?.disconnect();\n  }\n\n  protected render(): JSX.Element {\n    if (this.pin == null) {\n      throw new Error('Unable to draw pin');\n    }\n\n    const { pinPoint, labelPoint } = this.computePinPoints(this.pin);\n\n    return (\n      <Fragment>\n        <vertex-viewer-dom-element\n          data-testid={`drawn-pin-${this.pin.id}`}\n          position={this.pin.worldPosition}\n          onPointerDown={async () => {\n            await this.labelEl?.submit();\n            this.selectPin();\n            this.handleAnchorPointerDown();\n          }}\n          detachedOff={false}\n        >\n          <PinRenderer\n            pin={this.pin}\n            selected={this.selected}\n            occluded={this.occluded}\n            detached={this.detached}\n          />\n        </vertex-viewer-dom-element>\n\n        {isTextPin(this.pin) && !this.occluded && !this.detached && (\n          <Fragment>\n            <vertex-viewer-pin-label-line\n              id={`pin-label-line-${this.pin?.id}`}\n              pinPoint={pinPoint}\n              pin={this.pin}\n              labelPoint={labelPoint}\n              onPointerDown={() => this.selectPin()}\n            ></vertex-viewer-pin-label-line>\n\n            <vertex-viewer-pin-label\n              pin={this.pin}\n              ref={(el) => (this.labelEl = el)}\n              elementBounds={this.elementBounds}\n              pinController={this.pinController}\n              onPointerDown={() => this.selectPin()}\n            ></vertex-viewer-pin-label>\n          </Fragment>\n        )}\n      </Fragment>\n    );\n  }\n\n  private invalidateState = (): void => {\n    this.invalidateStateCounter = this.invalidateStateCounter + 1;\n  };\n\n  private setLabelObserver(): void {\n    if (this.labelEl != null) {\n      this.labelEl.addEventListener('labelChanged', this.invalidateState);\n\n      this.resizeObserver = new ResizeObserver(() => this.invalidateState());\n      this.resizeObserver.observe(this.labelEl);\n    }\n  }\n\n  private computePinPoints(pin: Pin): ComputedPoints {\n    if (this.elementBounds != null && this.pin != null) {\n      return isTextPin(this.pin) && this.pin.label.point != null\n        ? this.computeTextPinPoints(this.pin, this.elementBounds)\n        : this.computeDefaultPinPoints(this.pin, this.elementBounds);\n    }\n\n    return { pinPoint: pin.worldPosition };\n  }\n\n  private computeDefaultPinPoints(\n    pin: Pin,\n    elementBounds: DOMRect,\n  ): ComputedPoints {\n    return {\n      pinPoint: this.getFromWorldPosition(\n        pin.worldPosition,\n        this.projectionViewMatrix,\n        elementBounds,\n      ),\n    };\n  }\n\n  private computeTextPinPoints(\n    pin: TextPin,\n    elementBounds: DOMRect,\n  ): ComputedPoints {\n    const { pinPoint } = this.computeDefaultPinPoints(pin, elementBounds);\n\n    const screenPosition = translatePointToScreen(\n      pin.label.point,\n      elementBounds,\n    );\n\n    const labelWidth = this.labelEl?.firstElementChild?.clientWidth || 0;\n    const labelHeight = this.labelEl?.firstElementChild?.clientHeight || 0;\n\n    return {\n      pinPoint,\n      labelPoint: getClosestCenterToPoint(screenPosition, pinPoint, {\n        width: labelWidth,\n        height: labelHeight,\n      }),\n    };\n  }\n\n  private handleAnchorPointerDown(): void {\n    if (\n      this.elementBounds != null &&\n      this.pinController?.getToolMode() === 'edit' &&\n      this.pin != null\n    ) {\n      this.pinController?.setDraggable({ id: this.pin.id });\n    }\n  }\n\n  private selectPin(): void {\n    this.pinController?.setSelectedPinId(this.pin?.id);\n  }\n\n  private getFromWorldPosition(\n    pt: Vector3.Vector3,\n    projectionViewMatrix: Matrix4.Matrix4,\n    dimensions: Dimensions.Dimensions,\n  ): Point.Point {\n    const ndcPt = Vector3.multiplyByTransformMatrixColumnMajor(\n      pt,\n      projectionViewMatrix,\n    );\n    return Viewport.fromDimensions(dimensions).transformVectorToViewport(ndcPt);\n  }\n}\n"],"version":3}
+{"file":"vertex-viewer-pin-group.cjs.entry.js","mappings":"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","names":["getPinColors","h","Fragment","isTextPin","classNames","isIconPin","Point","Matrix4","PinModel","PinController","translatePointToScreen","Vector3","Viewport"],"sources":["src/components/viewer-pin-group/pin-renderer.tsx","src/components/viewer-pin-group/utils.ts","src/components/viewer-pin-group/viewer-pin-group.css?tag=vertex-viewer-pin-group","src/components/viewer-pin-group/viewer-pin-group.tsx"],"sourcesContent":["// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { Fragment, FunctionalComponent, h } from '@stencil/core';\nimport classNames from 'classnames';\n\nimport { getPinColors, isIconPin, isTextPin, Pin } from '../../lib/pins/model';\n\ninterface PinRendererProps {\n  pin?: Pin;\n  selected: boolean;\n  occluded: boolean;\n  detached: boolean;\n}\n\nexport const PinRenderer: FunctionalComponent<PinRendererProps> = ({\n  pin,\n  selected,\n  occluded,\n  detached,\n}) => {\n  const { primaryColor } = getPinColors(pin);\n\n  return (\n    <Fragment>\n      {isTextPin(pin) && (\n        <div\n          id=\"pin-anchor\"\n          class={classNames('pin-anchor', {\n            selected: selected,\n            'pin-occluded': occluded,\n            'pin-detached': detached,\n          })}\n          style={{\n            background: primaryColor,\n          }}\n        ></div>\n      )}\n\n      {isIconPin(pin) && (\n        <vertex-viewer-icon\n          name=\"pin-fill\"\n          size=\"lg\"\n          class={classNames('pin', {\n            'pin-selected': selected,\n            'pin-occluded': occluded,\n            'pin-detached': detached,\n          })}\n          style={{\n            color: primaryColor,\n          }}\n        />\n      )}\n    </Fragment>\n  );\n};\n","import { Dimensions, Point } from '@vertexvis/geometry';\n\nexport function getClosestCenterToPoint(\n  boxPoint: Point.Point,\n  pointToMeasure: Point.Point,\n  dimensions: Dimensions.Dimensions,\n): Point.Point {\n  const topPoint = {\n    x: boxPoint.x + dimensions.width / 2,\n    y: boxPoint.y,\n  };\n\n  const bottomPoint = {\n    x: boxPoint.x + dimensions.width / 2,\n    y: boxPoint.y + dimensions.height,\n  };\n\n  const rightPoint = {\n    x: boxPoint.x + dimensions.width,\n    y: boxPoint.y + dimensions.height / 2,\n  };\n\n  const leftPoint = {\n    x: boxPoint.x,\n    y: boxPoint.y + dimensions.height / 2,\n  };\n\n  const candidates = [topPoint, bottomPoint, leftPoint, rightPoint];\n\n  const distances = candidates.map((candidate) =>\n    Point.distance(candidate, pointToMeasure),\n  );\n\n  const candidateIndex = distances.indexOf(Math.min(...distances));\n  return candidates[candidateIndex];\n}\n",":host {\n  /**\n   * @prop  --viewer-annotations-pin-primary-color: A CSS color that\n   * specifies the primary color for the pins. This value gets used for the dot color \n   * and borders\n   */\n  --viewer-annotations-pin-primary-color: var(--blue-700);\n\n  /**\n   * @prop  --viewer-annotations-pin-accent-color: A CSS color that\n   * specifies the accent color for the pins. This value gets used for background colors\n   * \n   */\n\n  --viewer-annotations-pin-accent-color: var(--blue-200);\n  /**\n   * @prop  viewer-annotations-pin-dot-color: A CSS color that\n   * specifies the color of the anchor dot\n   */\n  --viewer-annotations-pin-dot-color: var(\n    --viewer-annotations-pin-primary-color\n  );\n\n  /**\n   * @prop  --viewer-annotations-pin-color: A CSS color that\n   * specifies the color of the pin\n   */\n  --viewer-annotations-pin-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop  --viewer-annotations-pin-font-size: A CSS property to specify\n   the font size of the pin\n   */\n  --viewer-annotations-pin-font-size: 0.75rem;\n\n  /**\n   * @prop  --viewer-annotations-pin-selected-stroke: A CSS color that\n   * specifies the stroke color of a selected pin\n   */\n  --viewer-annotations-pin-selected-stroke: var(--white);\n\n  /**\n   * @prop   --viewer-annotations-pin-selected-border: A CSS color that\n   * specifies the border of a selected pin\n   */\n  --viewer-annotations-pin-selected-border: 2px solid var(--white);\n\n  /**\n   * @prop --viewer-annotations-pin-label-border: A CSS color that\n   * specifies the border of a text pin anchor\n   */\n  --viewer-annotations-pin-label-border: 2px solid var(--black);\n\n  /**\n   * @prop   --viewer-annotations-pin-selected-border: A CSS color that\n   * specifies the stroke of a selected default pin\n   */\n  --viewer-annotations-pin-selected-stroke: var(--white);\n\n  font-size: var(--viewer-annotations-pin-font-size);\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.pin-anchor {\n  position: absolute;\n  border-radius: 50%;\n  transform: translate(-50%, -50%);\n  display: block;\n  width: 9px;\n  height: 9px;\n  box-sizing: border-box;\n  border: var(--viewer-annotations-pin-label-border);\n  background: var(--viewer-annotations-pin-dot-color);\n  pointer-events: auto;\n  cursor: pointer;\n}\n\n.selected {\n  width: 13px;\n  height: 13px;\n  border: var(--viewer-annotations-pin-selected-border);\n}\n\n.pin {\n  color: var(--viewer-annotations-pin-color);\n  cursor: pointer;\n  transition: opacity 0.3s ease-in;\n\n  /**\n   * Place bottom point of the pin at the location instead of the middle of the pin\n   */\n  transform: translate(0px, -12px);\n}\n\n.pin-selected {\n  stroke-width: 1;\n  stroke: var(--viewer-annotations-pin-selected-stroke);\n}\n\n.pin-occluded {\n  opacity: 0.3;\n  transition: opacity 0.3s ease-in;\n}\n\n.pin-detached {\n  visibility: hidden;\n}\n","import {\n  Component,\n  Fragment,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  JSX,\n  Listen,\n  Prop,\n  State,\n} from '@stencil/core';\nimport { Dimensions, Matrix4, Point, Vector3 } from '@vertexvis/geometry';\n\nimport { Viewport } from '../..';\nimport { PinController } from '../../lib/pins/controller';\nimport { isTextPin, Pin, TextPin } from '../../lib/pins/model';\nimport { PinModel } from '../../lib/pins/model';\nimport { translatePointToScreen } from '../viewer-pin-tool/utils';\nimport { PinRenderer } from './pin-renderer';\nimport { getClosestCenterToPoint } from './utils';\n\ninterface ComputedPoints {\n  pinPoint: Point.Point;\n  labelPoint?: Point.Point;\n}\n\n@Component({\n  tag: 'vertex-viewer-pin-group',\n  styleUrl: 'viewer-pin-group.css',\n  shadow: false,\n})\nexport class ViewerPinGroup {\n  /**\n   * The pin to draw for the group\n   */\n  @Prop()\n  public pin?: Pin;\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   * Projection view matrix used for computing the position of the pin line\n   */\n  @Prop()\n  public projectionViewMatrix: Matrix4.Matrix4 = Matrix4.makeIdentity();\n\n  /**\n   * The dimensions of the canvas for the pins\n   */\n  @Prop({ mutable: true })\n  public elementBounds?: DOMRect;\n\n  /**\n   * The model that contains the entities and outcomes from performing pin operations\n   */\n  @Prop()\n  public pinModel: PinModel = new PinModel();\n\n  /**\n   * The controller that drives behavior for pin operations\n   */\n  @Prop({ mutable: true })\n  public pinController?: PinController;\n\n  /**\n   * Whether the pin is \"selected\"\n   */\n  @Prop()\n  public selected = false;\n\n  /**\n   * @internal\n   * Whether the pin is occluded\n   */\n  @Prop({ mutable: true, reflect: true })\n  public occluded = false;\n\n  /**\n   * @internal\n   * Whether the pin is detached\n   */\n  @Prop({ mutable: true, reflect: true })\n  public detached = false;\n\n  @State()\n  private invalidateStateCounter = 0;\n\n  private labelEl: HTMLVertexViewerPinLabelElement | undefined;\n\n  private resizeObserver?: ResizeObserver;\n\n  protected componentWillLoad(): void {\n    if (this.pinController == null) {\n      this.pinController = new PinController(this.pinModel);\n    }\n  }\n\n  protected componentDidLoad(): void {\n    this.setLabelObserver();\n\n    if (this.selected) {\n      this.labelEl?.setFocus();\n    }\n  }\n\n  /**\n   * @ignore\n   */\n  @Listen('occlusionStateChanged')\n  protected async handleOcclusionStateChanged(\n    event: CustomEvent<boolean>,\n  ): Promise<void> {\n    this.occluded = event.detail;\n  }\n\n  /**\n   * @ignore\n   */\n  @Listen('detachedStateChanged')\n  protected async handleDetachedStateChanged(\n    event: CustomEvent<boolean>,\n  ): Promise<void> {\n    this.detached = event.detail;\n  }\n\n  protected disconnectedCallback(): void {\n    this.labelEl?.removeEventListener('labelChanged', this.invalidateState);\n    this.resizeObserver?.disconnect();\n  }\n\n  protected render(): JSX.Element {\n    if (this.pin == null) {\n      throw new Error('Unable to draw pin');\n    }\n\n    const { pinPoint, labelPoint } = this.computePinPoints(this.pin);\n\n    return (\n      <Fragment>\n        <vertex-viewer-dom-element\n          data-testid={`drawn-pin-${this.pin.id}`}\n          position={this.pin.worldPosition}\n          onPointerDown={async () => {\n            await this.labelEl?.submit();\n            this.selectPin();\n            this.handleAnchorPointerDown();\n          }}\n          detachedOff={false}\n        >\n          <PinRenderer\n            pin={this.pin}\n            selected={this.selected}\n            occluded={this.occluded}\n            detached={this.detached}\n          />\n        </vertex-viewer-dom-element>\n\n        {isTextPin(this.pin) && !this.occluded && !this.detached && (\n          <Fragment>\n            <vertex-viewer-pin-label-line\n              id={`pin-label-line-${this.pin?.id}`}\n              pinPoint={pinPoint}\n              pin={this.pin}\n              labelPoint={labelPoint}\n              onPointerDown={() => this.selectPin()}\n            ></vertex-viewer-pin-label-line>\n\n            <vertex-viewer-pin-label\n              pin={this.pin}\n              ref={(el) => (this.labelEl = el)}\n              elementBounds={this.elementBounds}\n              pinController={this.pinController}\n              onPointerDown={() => this.selectPin()}\n            ></vertex-viewer-pin-label>\n          </Fragment>\n        )}\n      </Fragment>\n    );\n  }\n\n  private invalidateState = (): void => {\n    this.invalidateStateCounter = this.invalidateStateCounter + 1;\n  };\n\n  private setLabelObserver(): void {\n    if (this.labelEl != null) {\n      this.labelEl.addEventListener('labelChanged', this.invalidateState);\n\n      this.resizeObserver = new ResizeObserver(() => this.invalidateState());\n      this.resizeObserver.observe(this.labelEl);\n    }\n  }\n\n  private computePinPoints(pin: Pin): ComputedPoints {\n    if (this.elementBounds != null && this.pin != null) {\n      return isTextPin(this.pin) && this.pin.label.point != null\n        ? this.computeTextPinPoints(this.pin, this.elementBounds)\n        : this.computeDefaultPinPoints(this.pin, this.elementBounds);\n    }\n\n    return { pinPoint: pin.worldPosition };\n  }\n\n  private computeDefaultPinPoints(\n    pin: Pin,\n    elementBounds: DOMRect,\n  ): ComputedPoints {\n    return {\n      pinPoint: this.getFromWorldPosition(\n        pin.worldPosition,\n        this.projectionViewMatrix,\n        elementBounds,\n      ),\n    };\n  }\n\n  private computeTextPinPoints(\n    pin: TextPin,\n    elementBounds: DOMRect,\n  ): ComputedPoints {\n    const { pinPoint } = this.computeDefaultPinPoints(pin, elementBounds);\n\n    const screenPosition = translatePointToScreen(\n      pin.label.point,\n      elementBounds,\n    );\n\n    const labelWidth = this.labelEl?.firstElementChild?.clientWidth || 0;\n    const labelHeight = this.labelEl?.firstElementChild?.clientHeight || 0;\n\n    return {\n      pinPoint,\n      labelPoint: getClosestCenterToPoint(screenPosition, pinPoint, {\n        width: labelWidth,\n        height: labelHeight,\n      }),\n    };\n  }\n\n  private handleAnchorPointerDown(): void {\n    if (\n      this.elementBounds != null &&\n      this.pinController?.getToolMode() === 'edit' &&\n      this.pin != null\n    ) {\n      this.pinController?.setDraggable({ id: this.pin.id });\n    }\n  }\n\n  private selectPin(): void {\n    this.pinController?.setSelectedPinId(this.pin?.id);\n  }\n\n  private getFromWorldPosition(\n    pt: Vector3.Vector3,\n    projectionViewMatrix: Matrix4.Matrix4,\n    dimensions: Dimensions.Dimensions,\n  ): Point.Point {\n    const ndcPt = Vector3.multiplyByTransformMatrixColumnMajor(\n      pt,\n      projectionViewMatrix,\n    );\n    return Viewport.fromDimensions(dimensions).transformVectorToViewport(ndcPt);\n  }\n}\n"],"version":3}

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

@@ -4,10 +4,10 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle = require('./bundle-07I6_WqC.js');
+var bundle = require('./bundle-BCS0nA91.js');
 var index$1 = require('./index-CRUoPh1y.js');
-var dom = require('./dom-Dlu6-7PF.js');
-var model = require('./model-Dy5FvjIA.js');
+var dom = require('./dom-BuQSLPWr.js');
+var model = require('./model-BC6acIWJ.js');
 var stencil = require('./stencil-Hsr_8Chs.js');
 require('./_commonjsHelpers-CBbBosIU.js');
 require('./bundle-CLGyVDEW.js');
@@ -16,7 +16,7 @@ function getComputedStyle(el) {
     return window.getComputedStyle(el);
 }
 
-const viewerPinLabelCss = () => `:host{--viewer-annotations-pin-label-background-color:var(--viewer-annotations-pin-accent-color);--viewer-annotations-pin-label-border-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-label-focused-border-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-label-color:var(--white);--viewer-annotations-pin-label-padding-y:0.375em;--viewer-annotations-pin-label-padding-x:0.5em;--viewer-annotations-pin-label-border-width:2px;--viewer-annotations-pin-label-border-style:solid;--viewer-annotations-pin-label-border-radius:0.25em;--viewer-annotations-pin-label-min-width:2rem;--viewer-annotations-pin-label-max-width:25rem;--viewer-annotations-pin-label-max-height:50rem;overflow:hidden;pointer-events:none}:host([mode='']) .pin-label{color:var(--viewer-annotations-pin-label-color);background:var(--viewer-annotations-pin-label-background-color)}.pin-label-text{font-family:Arial, Helvetica, sans-serif;font-size:0.875rem;line-height:1rem;word-break:break-word;white-space:pre-wrap}.pin-label-input-wrapper{display:flex;position:absolute;pointer-events:auto;box-sizing:border-box;min-width:var(--viewer-annotations-pin-label-min-width);max-width:var(--viewer-annotations-pin-label-max-width);max-height:var(--viewer-annotations-pin-label-max-height);background:var(--viewer-annotations-pin-label-background-color);border-width:var(--viewer-annotations-pin-label-border-width);border-style:var(--viewer-annotations-pin-label-border-style);border-color:var(--viewer-annotations-pin-label-border-color);border-radius:var(--viewer-annotations-pin-label-border-radius)}.pin-label-input-wrapper.focused{min-width:var(--viewer-annotations-pin-label-max-width);border-color:var(--viewer-annotations-pin-label-focused-border-color)}.pin-input-drag-target{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.pin-label-input{resize:none;position:relative;outline:none;border:none;word-break:break-word;padding:0 0 0 0;background-color:transparent;margin:var(--viewer-annotations-pin-label-padding-y) var(--viewer-annotations-pin-label-padding-x);width:var(--viewer-annotations-pin-label-min-width);flex-grow:1;overflow:hidden;max-width:calc(var(--viewer-annotations-pin-label-max-width) - calc(2 * var(--viewer-annotations-pin-label-padding-x)))}.pin-label-input.readonly{pointer-events:auto;color:black;cursor:pointer}.pin-label-hidden{position:absolute;visibility:hidden;pointer-events:none;width:auto;height:auto;box-sizing:border-box;border-width:var(--viewer-annotations-pin-label-border-width);border-style:var(--viewer-annotations-pin-label-border-style);border-color:var(--viewer-annotations-pin-label-border-color);margin:var(--viewer-annotations-pin-label-padding-y) 0;padding:0 var(--viewer-annotations-pin-label-padding-x);max-width:calc(var(--viewer-annotations-pin-label-max-width) - calc(2 * var(--viewer-annotations-pin-label-padding-x)))}`;
+const viewerPinLabelCss = () => `:host{--viewer-annotations-pin-label-background-color:var(     --viewer-annotations-pin-accent-color   );--viewer-annotations-pin-label-border-color:var(     --viewer-annotations-pin-primary-color   );--viewer-annotations-pin-label-focused-border-color:var(     --viewer-annotations-pin-primary-color   );--viewer-annotations-pin-label-color:var(--white);--viewer-annotations-pin-label-padding-y:0.375em;--viewer-annotations-pin-label-padding-x:0.5em;--viewer-annotations-pin-label-border-width:2px;--viewer-annotations-pin-label-border-style:solid;--viewer-annotations-pin-label-border-radius:0.25em;--viewer-annotations-pin-label-min-width:2rem;--viewer-annotations-pin-label-max-width:25rem;--viewer-annotations-pin-label-max-height:50rem;overflow:hidden;pointer-events:none}:host([mode='']) .pin-label{color:var(--viewer-annotations-pin-label-color);background:var(--viewer-annotations-pin-label-background-color)}.pin-label-text{font-family:Arial, Helvetica, sans-serif;font-size:0.875rem;line-height:1rem;word-break:break-word;white-space:pre-wrap}.pin-label-input-wrapper{display:flex;position:absolute;pointer-events:auto;box-sizing:border-box;min-width:var(--viewer-annotations-pin-label-min-width);max-width:var(--viewer-annotations-pin-label-max-width);max-height:var(--viewer-annotations-pin-label-max-height);background:var(--viewer-annotations-pin-label-background-color);border-width:var(--viewer-annotations-pin-label-border-width);border-style:var(--viewer-annotations-pin-label-border-style);border-color:var(--viewer-annotations-pin-label-border-color);border-radius:var(--viewer-annotations-pin-label-border-radius)}.pin-label-input-wrapper.focused{min-width:var(--viewer-annotations-pin-label-max-width);border-color:var(--viewer-annotations-pin-label-focused-border-color)}.pin-input-drag-target{position:absolute;top:0;left:0;width:100%;height:100%;cursor:pointer}.pin-label-input{resize:none;position:relative;outline:none;border:none;word-break:break-word;padding:0 0 0 0;background-color:transparent;margin:var(--viewer-annotations-pin-label-padding-y)     var(--viewer-annotations-pin-label-padding-x);width:var(--viewer-annotations-pin-label-min-width);flex-grow:1;overflow:hidden;max-width:calc(     var(--viewer-annotations-pin-label-max-width) -       calc(2 * var(--viewer-annotations-pin-label-padding-x))   )}.pin-label-input.readonly{pointer-events:auto;color:black;cursor:pointer}.pin-label-hidden{position:absolute;visibility:hidden;pointer-events:none;width:auto;height:auto;box-sizing:border-box;border-width:var(--viewer-annotations-pin-label-border-width);border-style:var(--viewer-annotations-pin-label-border-style);border-color:var(--viewer-annotations-pin-label-border-color);margin:var(--viewer-annotations-pin-label-padding-y) 0;padding:0 var(--viewer-annotations-pin-label-padding-x);max-width:calc(     var(--viewer-annotations-pin-label-max-width) -       calc(2 * var(--viewer-annotations-pin-label-padding-x))   )}`;
 
 const VertexPinLabel = class {
     constructor(hostRef) {
@@ -37,7 +37,8 @@ const VertexPinLabel = class {
                     this.contentElBounds = this.contentEl.getBoundingClientRect();
                     const computedStyles = getComputedStyle(this.contentEl);
                     this.textareaRows = Math.max(1, Math.ceil((Number.parseFloat(computedStyles.getPropertyValue('height')) -
-                        Number.parseFloat(computedStyles.getPropertyValue('borderWidth')) * 2) /
+                        Number.parseFloat(computedStyles.getPropertyValue('borderWidth')) *
+                            2) /
                         Number.parseFloat(computedStyles.getPropertyValue('lineHeight'))));
                 }
             });
@@ -208,9 +209,9 @@ const VertexPinLabel = class {
                 maxHeight: this.computeMaxHeight(),
                 borderColor: primaryColor,
                 background: accentColor,
-            } }, index.h("textarea", { key: 'faee5e02d2f9bd18dd2e367e4e52b4325ac3c782', id: `pin-label-input-${(_c = this.pin) === null || _c === void 0 ? void 0 : _c.id}`, class: index$1.classname('pin-label-input', 'pin-label-text', {
+            } }, index.h("textarea", { key: 'beaf273457ceeadd30f709fff580f2af5b1c366a', id: `pin-label-input-${(_c = this.pin) === null || _c === void 0 ? void 0 : _c.id}`, class: index$1.classname('pin-label-input', 'pin-label-text', {
                 ['readonly']: !this.focused,
-            }), disabled: !this.focused, ref: (ref) => (this.inputEl = ref), value: this.value, rows: this.textareaRows, onKeyDown: this.handleInputKeyDown, onInput: this.handleTextInput, onBlur: this.handleTextBlur }), !this.focused && (index.h("div", { key: '2851d39b6cf87c64ef585a9f1967c689f01d030e', class: "pin-input-drag-target", onPointerDown: this.handlePointerDown }))), index.h("div", { key: 'a7c2e114227e9fe744b0ef4e42c3fd5abd5c626e', ref: (el) => (this.contentEl = el), class: index$1.classname('pin-label-text', 'pin-label-hidden'), style: {
+            }), disabled: !this.focused, ref: (ref) => (this.inputEl = ref), value: this.value, rows: this.textareaRows, onKeyDown: this.handleInputKeyDown, onInput: this.handleTextInput, onBlur: this.handleTextBlur, "aria-label": "Pin label input" }), !this.focused && (index.h("div", { key: '6ba9750253ae2e9de2a48a9b2ce31f6971b7b0a1', class: "pin-input-drag-target", onPointerDown: this.handlePointerDown }))), index.h("div", { key: '7a474943d854cda9fe7859a30441bcc06a758010', ref: (el) => (this.contentEl = el), class: index$1.classname('pin-label-text', 'pin-label-hidden'), style: {
                 maxWidth: this.computeMaxWidth(),
                 maxHeight: this.computeMaxHeight(),
             } }, this.hiddenContent())));
@@ -273,7 +274,7 @@ const VertexPinLabel = class {
 };
 VertexPinLabel.style = viewerPinLabelCss();
 
-const viewerPinLabelLineCss = () => `:host{--viewer-annotations-pin-label-line-color:var(--viewer-annotations-pin-primary-color);--viewer-annotations-pin-label-line-width:1;overflow:hidden;pointer-events:none}.label-line{pointer-events:auto;stroke:var(--viewer-annotations-pin-label-line-color);stroke-width:var( --viewer-annotations-pin-label-line-width);cursor:default}.svg{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none;height:100%;width:100%}`;
+const viewerPinLabelLineCss = () => `:host{--viewer-annotations-pin-label-line-color:var(     --viewer-annotations-pin-primary-color   );--viewer-annotations-pin-label-line-width:1;overflow:hidden;pointer-events:none}.label-line{pointer-events:auto;stroke:var(--viewer-annotations-pin-label-line-color);stroke-width:var(--viewer-annotations-pin-label-line-width);cursor:default}.svg{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none;height:100%;width:100%}`;
 
 const VertexPinLabelLine = class {
     constructor(hostRef) {

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

@@ -1 +1 @@
-{"file":"vertex-viewer-pin-label_2.cjs.entry.js","mappings":"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","names":["readDOM","translatePointToRelative","getMouseClientPosition","Point","translatePointToScreen","PinController","PinModel","getPinColors","h","Host","classNames","isTextPin"],"sources":["src/components/viewer-pin-label/utils.ts","src/components/viewer-pin-label/viewer-pin-label.css?tag=vertex-viewer-pin-label","src/components/viewer-pin-label/viewer-pin-label.tsx","src/components/viewer-pin-label-line/viewer-pin-label-line.css?tag=vertex-viewer-pin-label-line","src/components/viewer-pin-label-line/viewer-pin-label-line.tsx"],"sourcesContent":["export function getComputedStyle(el: HTMLElement): CSSStyleDeclaration {\n  return window.getComputedStyle(el);\n}\n",":host {\n  /**\n   * @prop --viewer-annotations-pin-label-background-color: A CSS color that\n   * specifies the color of the label background\n   */\n  --viewer-annotations-pin-label-background-color: var(--viewer-annotations-pin-accent-color);\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-color: A CSS color that\n   * specifies the color of the label's border\n   */\n  --viewer-annotations-pin-label-border-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop --viewer-annotations-pin-label-focused-border-color: A CSS color that\n   * specifies the color of the label's border when focused. \n   */\n   --viewer-annotations-pin-label-focused-border-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop --viewer-annotations-pin-label-color: A CSS color that\n   * specifies the color of the label \n   */\n  --viewer-annotations-pin-label-color: var(--white);\n\n  /**\n   * @prop --viewer-annotations-pin-label-padding-y: A var that\n   * specifies the vertical padding of the label\n   */\n  --viewer-annotations-pin-label-padding-y: 0.375em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-padding-x: A var that\n   * specifies the horizontal padding of the label\n   */\n  --viewer-annotations-pin-label-padding-x:  0.5em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-width: A CSS length that\n   * specifies the width of the border on this label. Defaults to `2px`.\n   */\n  --viewer-annotations-pin-label-border-width: 2px;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-style: A CSS variable that\n   * specifies the style of border on this label. Defaults to `solid`.\n   */\n  --viewer-annotations-pin-label-border-style: solid;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-radius: A var that\n   * specifies the border radius of the label\n   */\n  --viewer-annotations-pin-label-border-radius: 0.25em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-min-width: A CSS length that\n   * specifies the minimum width of the label. Defaults to `2rem`.\n   */\n  --viewer-annotations-pin-label-min-width: 2rem;\n\n  /**\n   * @prop --viewer-annotations-pin-label-max-width: A CSS length that\n   * specifies the maximum width of the label. Defaults to `25rem`.\n   */\n  --viewer-annotations-pin-label-max-width: 25rem;\n\n  /**\n   * @prop --viewer-annotations-pin-label-max-height: A CSS length that\n   * specifies the maximum height of the label. Defaults to `50rem`.\n   */\n   --viewer-annotations-pin-label-max-height: 50rem;\n\n  overflow: hidden;\n  pointer-events: none;\n}\n\n:host([mode='']) .pin-label {\n  color: var(--viewer-annotations-pin-label-color);\n  background: var(--viewer-annotations-pin-label-background-color);\n}\n\n.pin-label-text {\n  font-family: Arial, Helvetica, sans-serif;\n  font-size: 0.875rem;\n  line-height: 1rem;\n  word-break: break-word;\n  white-space: pre-wrap;\n}\n\n.pin-label-input-wrapper {\n  display: flex;\n  position: absolute;\n  pointer-events: auto;\n  box-sizing: border-box;\n  min-width: var(--viewer-annotations-pin-label-min-width);\n  max-width: var(--viewer-annotations-pin-label-max-width);\n  max-height: var(--viewer-annotations-pin-label-max-height);\n  background: var(--viewer-annotations-pin-label-background-color);\n  border-width: var(--viewer-annotations-pin-label-border-width);\n  border-style: var(--viewer-annotations-pin-label-border-style);\n  border-color: var(--viewer-annotations-pin-label-border-color);\n  border-radius: var(--viewer-annotations-pin-label-border-radius);\n}\n\n.pin-label-input-wrapper.focused {\n  min-width: var(--viewer-annotations-pin-label-max-width);\n  border-color: var(--viewer-annotations-pin-label-focused-border-color);\n}\n\n.pin-input-drag-target {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n}\n\n.pin-label-input {\n  resize: none;\n  position: relative;\n  outline: none;\n  border: none;\n  word-break: break-word;\n  padding: 0 0 0 0;\n  background-color: transparent;\n  margin: var(--viewer-annotations-pin-label-padding-y) var(--viewer-annotations-pin-label-padding-x);\n  width: var(--viewer-annotations-pin-label-min-width);\n  flex-grow: 1;\n  overflow: hidden;\n  max-width: calc(var(--viewer-annotations-pin-label-max-width) - calc(2 * var(--viewer-annotations-pin-label-padding-x)));\n}\n\n.pin-label-input.readonly {\n  pointer-events: auto;\n  color: black;\n  cursor: pointer;\n}\n\n.pin-label-hidden {\n  position: absolute;\n  visibility: hidden;\n  pointer-events: none;\n  width: auto;\n  height: auto;\n  box-sizing: border-box;\n  border-width: var(--viewer-annotations-pin-label-border-width);\n  border-style: var(--viewer-annotations-pin-label-border-style);\n  border-color: var(--viewer-annotations-pin-label-border-color);\n  margin: var(--viewer-annotations-pin-label-padding-y) 0;\n  padding: 0 var(--viewer-annotations-pin-label-padding-x);\n  max-width: calc(var(--viewer-annotations-pin-label-max-width) - calc(2 * var(--viewer-annotations-pin-label-padding-x)));\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  Host,\n  JSX,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\nimport classNames from 'classnames';\n\nimport { getMouseClientPosition } from '../../lib/dom';\nimport { PinController } from '../../lib/pins/controller';\nimport {\n  getPinColors,\n  isTextPin,\n  PinModel,\n  TextPin,\n} from '../../lib/pins/model';\nimport { readDOM } from '../../lib/stencil';\nimport {\n  translatePointToRelative,\n  translatePointToScreen,\n} from '../viewer-pin-tool/utils';\nimport { getComputedStyle } from './utils';\n\n@Component({\n  tag: 'vertex-viewer-pin-label',\n  styleUrl: 'viewer-pin-label.css',\n  shadow: false,\n})\nexport class VertexPinLabel {\n  /**\n   * The pin to draw for the group\n   */\n  @Prop()\n  public pin?: TextPin;\n\n  /**\n   * The dimensions of the canvas for the pins\n   */\n  @Prop()\n  public elementBounds?: DOMRect;\n\n  /**\n   * The current text value of the component. Value is updated on user\n   * interaction.\n   */\n  @Prop({ mutable: true })\n  public value = '';\n\n  /**\n   * The controller that drives behavior for pin operations\n   */\n  @Prop({ mutable: true })\n  public pinController?: PinController;\n\n  /**\n   * @internal\n   */\n  @Event({ bubbles: true })\n  public labelChanged!: EventEmitter<void>;\n\n  /**\n   * Emitted whenever the label is focused, with the ID of the\n   * associated pin (or undefined if no pin is provided).\n   */\n  @Event({ bubbles: true })\n  public labelFocused!: EventEmitter<string | undefined>;\n\n  /**\n   * Emitted whenever the label is blurred, with the ID of the\n   * associated pin (or undefined if no pin is provided).\n   */\n  @Event({ bubbles: true })\n  public labelBlurred!: EventEmitter<string | undefined>;\n\n  @Element()\n  private hostEl!: HTMLElement;\n\n  @State()\n  private focused = false;\n\n  @State()\n  private computedScreenPosition?: Point.Point;\n\n  @State()\n  private textareaRows = 1;\n\n  @State()\n  private contentElBounds?: DOMRect;\n\n  private relativePointerDownPosition?: Point.Point;\n  private pinPointerDownPosition?: Point.Point;\n\n  private inputEl?: HTMLTextAreaElement;\n  private contentEl?: HTMLDivElement;\n\n  private resizeObserver?: ResizeObserver;\n  private contentResizeObserver?: ResizeObserver;\n\n  /**\n   * Gives focus to the component's internal text input.\n   */\n  @Method()\n  public async setFocus(): Promise<void> {\n    // HTMLInputElement.focus() doesn't exist in tests.\n    if (typeof this.inputEl?.focus === 'function') {\n      this.focused = true;\n      this.labelFocused.emit(this.pin?.id);\n      this.inputEl?.focus();\n    }\n  }\n\n  /**\n   * @internal\n   * submits the current text, unfocuses the input and emits the blur event to consumers\n   */\n  @Method()\n  public async submit(): Promise<void> {\n    this.focused = false;\n    this.labelBlurred.emit(this.pin?.id);\n    if (this.pin != null) {\n      this.pinController?.updatePin({\n        ...this.pin,\n        label: {\n          point: this.pin.label.point,\n          text: this.value,\n        },\n      });\n    }\n  }\n\n  @Watch('focused')\n  protected watchFocusChange(): void {\n    this.labelChanged.emit();\n\n    if (this.focused) {\n      this.pinController?.setSelectedPinId(this.pin?.id);\n    }\n  }\n\n  @Watch('pin')\n  protected watchPinChange(): void {\n    this.value = this.pin?.label.text ?? '';\n    this.computeScreenPosition();\n  }\n\n  @Watch('elementBounds')\n  protected watchElementBoundsChange(): void {\n    this.computeScreenPosition();\n  }\n\n  protected componentWillLoad(): void {\n    this.value = this.pin?.label.text ?? '';\n    this.computeScreenPosition();\n\n    if (this.pinController == null) {\n      this.pinController = new PinController(new PinModel());\n    }\n  }\n\n  protected componentDidLoad(): void {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.labelChanged.emit();\n    });\n\n    this.contentResizeObserver = new ResizeObserver(this.computeContentSize);\n\n    if (this.hostEl != null) {\n      this.resizeObserver.observe(this.hostEl);\n    }\n\n    if (this.contentEl != null) {\n      this.contentResizeObserver.observe(this.contentEl);\n    }\n  }\n\n  protected disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n    this.contentResizeObserver?.disconnect();\n  }\n\n  protected componentDidRender(): void {\n    if (this.focused && this.inputEl != null) {\n      this.setFocus();\n    }\n  }\n\n  protected render(): JSX.Element {\n    const { primaryColor, accentColor } = getPinColors(this.pin);\n    return (\n      <Host>\n        <div\n          class={classNames('pin-label-input-wrapper', {\n            focused: this.focused,\n          })}\n          onPointerDown={this.handlePointerDown}\n          style={{\n            top: `${this.computedScreenPosition?.y.toString() || 0}px`,\n            left: `${this.computedScreenPosition?.x.toString() || 0}px`,\n            minWidth: this.computeMinWidth(),\n            maxWidth: this.computeMaxWidth(),\n            maxHeight: this.computeMaxHeight(),\n            borderColor: primaryColor,\n            background: accentColor,\n          }}\n        >\n          <textarea\n            id={`pin-label-input-${this.pin?.id}`}\n            class={classNames('pin-label-input', 'pin-label-text', {\n              ['readonly']: !this.focused,\n            })}\n            disabled={!this.focused}\n            ref={(ref) => (this.inputEl = ref)}\n            value={this.value}\n            rows={this.textareaRows}\n            onKeyDown={this.handleInputKeyDown}\n            onInput={this.handleTextInput}\n            onBlur={this.handleTextBlur}\n          />\n          {/* This corrects for a behavior in Firefox where setting the `disabled` attribute to true */}\n          {/* prevents any events from propagating. */}\n          {!this.focused && (\n            <div\n              class=\"pin-input-drag-target\"\n              onPointerDown={this.handlePointerDown}\n            />\n          )}\n        </div>\n        <div\n          ref={(el) => (this.contentEl = el)}\n          class={classNames('pin-label-text', 'pin-label-hidden')}\n          style={{\n            maxWidth: this.computeMaxWidth(),\n            maxHeight: this.computeMaxHeight(),\n          }}\n        >\n          {this.hiddenContent()}\n        </div>\n      </Host>\n    );\n  }\n\n  private hiddenContent(): Array<string | HTMLBRElement> {\n    // This corrects some inconsistencies in how a newline character\n    // is represented in a div. Leveraging `<br>`s results in a more\n    // consistent representation of the newlines in a textarea.\n    return this.value.includes('\\n')\n      ? this.value\n          .split('\\n')\n          .reduce(\n            (res, str) => [...res, str, <br />],\n            [] as Array<string | HTMLBRElement>,\n          )\n      : [this.value];\n  }\n\n  private computeMinWidth(): string {\n    if (this.contentElBounds != null) {\n      const expected = `${this.contentElBounds.width + 8}px`;\n\n      return `min(${expected}, ${this.computeMaxWidth()})`;\n    } else {\n      return `var(--viewer-annotations-pin-label-min-width)`;\n    }\n  }\n\n  private computeMaxWidth(): string {\n    const expected = `var(--viewer-annotations-pin-label-max-width)`;\n\n    return `min(${expected}, ${this.computeRemainingWidth()})`;\n  }\n\n  private computeMaxHeight(): string {\n    const expected = `var(--viewer-annotations-pin-label-max-height)`;\n\n    return `min(${expected}, ${this.computeRemainingHeight()})`;\n  }\n\n  private computeRemainingWidth(): string {\n    return `calc(${this.elementBounds?.width.toString() || 0}px - ${\n      this.computedScreenPosition?.x.toString() || 0\n    }px)`;\n  }\n\n  private computeRemainingHeight(): string {\n    return `calc(${this.elementBounds?.height.toString() || 0}px - ${\n      this.computedScreenPosition?.y.toString() || 0\n    }px)`;\n  }\n\n  private computeScreenPosition(): void {\n    this.computedScreenPosition =\n      isTextPin(this.pin) &&\n      this.elementBounds != null &&\n      this.pin.label.point != null\n        ? translatePointToScreen(this.pin.label.point, this.elementBounds)\n        : undefined;\n  }\n\n  private computeContentSize = (): void => {\n    readDOM(() => {\n      if (this.contentEl != null) {\n        this.contentElBounds = this.contentEl.getBoundingClientRect();\n        const computedStyles = getComputedStyle(this.contentEl);\n        this.textareaRows = Math.max(\n          1,\n          Math.ceil(\n            (Number.parseFloat(computedStyles.getPropertyValue('height')) -\n              Number.parseFloat(computedStyles.getPropertyValue('borderWidth')) * 2) /\n              Number.parseFloat(computedStyles.getPropertyValue('lineHeight')),\n          ),\n        );\n      }\n    });\n  };\n\n  private handleInputKeyDown = (event: KeyboardEvent): void => {\n    event.stopPropagation();\n    if (\n      event.key === 'Enter' &&\n      (event.ctrlKey || event.metaKey || event.shiftKey)\n    ) {\n      this.textareaRows += 1;\n      this.value += '\\n';\n    } else if (event.key === 'Enter') {\n      event.preventDefault();\n      this.submit();\n    }\n  };\n\n  private handlePointerDown = (event: PointerEvent): void => {\n    if (!this.focused) {\n      if (this.elementBounds != null) {\n        if (event.buttons !== 2) {\n          event.preventDefault();\n          event.stopPropagation();\n        }\n        this.relativePointerDownPosition = translatePointToRelative(\n          getMouseClientPosition(event, this.elementBounds),\n          this.elementBounds,\n        );\n        this.pinPointerDownPosition = this.pin?.label.point;\n\n        window.addEventListener('pointermove', this.handlePointerMove);\n        window.addEventListener('pointerup', this.handlePointerUp);\n      }\n    }\n  };\n\n  private handlePointerMove = (event: PointerEvent): void => {\n    if (\n      this.elementBounds != null &&\n      this.relativePointerDownPosition &&\n      this.pinPointerDownPosition != null\n    ) {\n      // Prevent selection of any text while interacting with the label\n      event.preventDefault();\n      event.stopPropagation();\n\n      const point = getMouseClientPosition(event, this.elementBounds);\n      const relative = translatePointToRelative(point, this.elementBounds);\n\n      const relativeDelta = Point.subtract(\n        relative,\n        this.relativePointerDownPosition,\n      );\n\n      const myUpdatedPin =\n        this.pin != null\n          ? {\n              ...this.pin,\n              label: {\n                ...this.pin.label,\n                point: Point.add(this.pinPointerDownPosition, relativeDelta),\n              },\n            }\n          : undefined;\n\n      if (myUpdatedPin) {\n        this.pinController?.updatePin(myUpdatedPin);\n        this.computeScreenPosition();\n      }\n    }\n  };\n\n  private handlePointerUp = (event: PointerEvent): void => {\n    if (\n      this.pinController?.getToolMode() === 'edit' &&\n      this.relativePointerDownPosition != null &&\n      this.elementBounds != null\n    ) {\n      const pointerDownScreen = translatePointToScreen(\n        this.relativePointerDownPosition,\n        this.elementBounds,\n      );\n      const distanceBetweenStartAndEndPoint = Point.distance(\n        pointerDownScreen,\n        getMouseClientPosition(event, this.elementBounds),\n      );\n\n      if (distanceBetweenStartAndEndPoint <= 2) {\n        this.focused = true;\n        this.labelFocused.emit(this.pin?.id);\n      }\n    }\n\n    this.relativePointerDownPosition = undefined;\n    this.pinPointerDownPosition = undefined;\n\n    window.removeEventListener('pointermove', this.handlePointerMove);\n    window.removeEventListener('pointerup', this.handlePointerUp);\n  };\n\n  private handleTextBlur = (): void => {\n    this.submit();\n  };\n\n  private handleTextInput = (event: Event): void => {\n    const input = event.target as HTMLInputElement;\n    this.value = input.value;\n  };\n}\n","\n:host {\n  /**\n   * @prop  --viewer-annotations-pin-label-line-color: A CSS color that\n   * specifies the color of the label line\n   */\n   --viewer-annotations-pin-label-line-color: var(--viewer-annotations-pin-primary-color);\n\n  /**\n   * @prop --viewer-annotations-pin-label-line-width: A CSS color that\n   * specifies the width of the label line\n   */\n   --viewer-annotations-pin-label-line-width: 1;\n\n  overflow: hidden;\n  pointer-events: none;\n}\n\n.label-line {\n  pointer-events: auto;\n  stroke: var(--viewer-annotations-pin-label-line-color);\n  stroke-width: var( --viewer-annotations-pin-label-line-width);\n  cursor: default;\n}\n\n.svg {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  overflow: hidden;\n  pointer-events: none;\n  height: 100%;\n  width: 100%;\n}\n","import {\n  Component,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  Host,\n  JSX,\n  Prop,\n} from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\n\nimport { getPinColors, Pin } from '../../lib/pins/model';\n\n@Component({\n  tag: 'vertex-viewer-pin-label-line',\n  styleUrl: 'viewer-pin-label-line.css',\n  shadow: false,\n})\nexport class VertexPinLabelLine {\n  @Prop()\n  public pinPoint: Point.Point | undefined;\n\n  @Prop()\n  public labelPoint: Point.Point | undefined;\n\n  @Prop()\n  public pin: Pin | undefined;\n\n  protected render(): JSX.Element {\n    const { primaryColor } = getPinColors(this.pin);\n    return (\n      <Host>\n        <svg class=\"svg\">\n          <line\n            class=\"label-line\"\n            style={{\n              stroke: primaryColor,\n            }}\n            x1={this.labelPoint?.x}\n            y1={this.labelPoint?.y}\n            x2={this.pinPoint?.x}\n            y2={this.pinPoint?.y}\n          />\n        </svg>\n      </Host>\n    );\n  }\n}\n"],"version":3}
+{"file":"vertex-viewer-pin-label_2.cjs.entry.js","mappings":"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","names":["readDOM","translatePointToRelative","getMouseClientPosition","Point","translatePointToScreen","PinController","PinModel","getPinColors","h","Host","classNames","isTextPin"],"sources":["src/components/viewer-pin-label/utils.ts","src/components/viewer-pin-label/viewer-pin-label.css?tag=vertex-viewer-pin-label","src/components/viewer-pin-label/viewer-pin-label.tsx","src/components/viewer-pin-label-line/viewer-pin-label-line.css?tag=vertex-viewer-pin-label-line","src/components/viewer-pin-label-line/viewer-pin-label-line.tsx"],"sourcesContent":["export function getComputedStyle(el: HTMLElement): CSSStyleDeclaration {\n  return window.getComputedStyle(el);\n}\n",":host {\n  /**\n   * @prop --viewer-annotations-pin-label-background-color: A CSS color that\n   * specifies the color of the label background\n   */\n  --viewer-annotations-pin-label-background-color: var(\n    --viewer-annotations-pin-accent-color\n  );\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-color: A CSS color that\n   * specifies the color of the label's border\n   */\n  --viewer-annotations-pin-label-border-color: var(\n    --viewer-annotations-pin-primary-color\n  );\n\n  /**\n   * @prop --viewer-annotations-pin-label-focused-border-color: A CSS color that\n   * specifies the color of the label's border when focused. \n   */\n  --viewer-annotations-pin-label-focused-border-color: var(\n    --viewer-annotations-pin-primary-color\n  );\n\n  /**\n   * @prop --viewer-annotations-pin-label-color: A CSS color that\n   * specifies the color of the label \n   */\n  --viewer-annotations-pin-label-color: var(--white);\n\n  /**\n   * @prop --viewer-annotations-pin-label-padding-y: A var that\n   * specifies the vertical padding of the label\n   */\n  --viewer-annotations-pin-label-padding-y: 0.375em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-padding-x: A var that\n   * specifies the horizontal padding of the label\n   */\n  --viewer-annotations-pin-label-padding-x: 0.5em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-width: A CSS length that\n   * specifies the width of the border on this label. Defaults to `2px`.\n   */\n  --viewer-annotations-pin-label-border-width: 2px;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-style: A CSS variable that\n   * specifies the style of border on this label. Defaults to `solid`.\n   */\n  --viewer-annotations-pin-label-border-style: solid;\n\n  /**\n   * @prop --viewer-annotations-pin-label-border-radius: A var that\n   * specifies the border radius of the label\n   */\n  --viewer-annotations-pin-label-border-radius: 0.25em;\n\n  /**\n   * @prop --viewer-annotations-pin-label-min-width: A CSS length that\n   * specifies the minimum width of the label. Defaults to `2rem`.\n   */\n  --viewer-annotations-pin-label-min-width: 2rem;\n\n  /**\n   * @prop --viewer-annotations-pin-label-max-width: A CSS length that\n   * specifies the maximum width of the label. Defaults to `25rem`.\n   */\n  --viewer-annotations-pin-label-max-width: 25rem;\n\n  /**\n   * @prop --viewer-annotations-pin-label-max-height: A CSS length that\n   * specifies the maximum height of the label. Defaults to `50rem`.\n   */\n  --viewer-annotations-pin-label-max-height: 50rem;\n\n  overflow: hidden;\n  pointer-events: none;\n}\n\n:host([mode='']) .pin-label {\n  color: var(--viewer-annotations-pin-label-color);\n  background: var(--viewer-annotations-pin-label-background-color);\n}\n\n.pin-label-text {\n  font-family: Arial, Helvetica, sans-serif;\n  font-size: 0.875rem;\n  line-height: 1rem;\n  word-break: break-word;\n  white-space: pre-wrap;\n}\n\n.pin-label-input-wrapper {\n  display: flex;\n  position: absolute;\n  pointer-events: auto;\n  box-sizing: border-box;\n  min-width: var(--viewer-annotations-pin-label-min-width);\n  max-width: var(--viewer-annotations-pin-label-max-width);\n  max-height: var(--viewer-annotations-pin-label-max-height);\n  background: var(--viewer-annotations-pin-label-background-color);\n  border-width: var(--viewer-annotations-pin-label-border-width);\n  border-style: var(--viewer-annotations-pin-label-border-style);\n  border-color: var(--viewer-annotations-pin-label-border-color);\n  border-radius: var(--viewer-annotations-pin-label-border-radius);\n}\n\n.pin-label-input-wrapper.focused {\n  min-width: var(--viewer-annotations-pin-label-max-width);\n  border-color: var(--viewer-annotations-pin-label-focused-border-color);\n}\n\n.pin-input-drag-target {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  cursor: pointer;\n}\n\n.pin-label-input {\n  resize: none;\n  position: relative;\n  outline: none;\n  border: none;\n  word-break: break-word;\n  padding: 0 0 0 0;\n  background-color: transparent;\n  margin: var(--viewer-annotations-pin-label-padding-y)\n    var(--viewer-annotations-pin-label-padding-x);\n  width: var(--viewer-annotations-pin-label-min-width);\n  flex-grow: 1;\n  overflow: hidden;\n  max-width: calc(\n    var(--viewer-annotations-pin-label-max-width) -\n      calc(2 * var(--viewer-annotations-pin-label-padding-x))\n  );\n}\n\n.pin-label-input.readonly {\n  pointer-events: auto;\n  color: black;\n  cursor: pointer;\n}\n\n.pin-label-hidden {\n  position: absolute;\n  visibility: hidden;\n  pointer-events: none;\n  width: auto;\n  height: auto;\n  box-sizing: border-box;\n  border-width: var(--viewer-annotations-pin-label-border-width);\n  border-style: var(--viewer-annotations-pin-label-border-style);\n  border-color: var(--viewer-annotations-pin-label-border-color);\n  margin: var(--viewer-annotations-pin-label-padding-y) 0;\n  padding: 0 var(--viewer-annotations-pin-label-padding-x);\n  max-width: calc(\n    var(--viewer-annotations-pin-label-max-width) -\n      calc(2 * var(--viewer-annotations-pin-label-padding-x))\n  );\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  Host,\n  JSX,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\nimport classNames from 'classnames';\n\nimport { getMouseClientPosition } from '../../lib/dom';\nimport { PinController } from '../../lib/pins/controller';\nimport {\n  getPinColors,\n  isTextPin,\n  PinModel,\n  TextPin,\n} from '../../lib/pins/model';\nimport { readDOM } from '../../lib/stencil';\nimport {\n  translatePointToRelative,\n  translatePointToScreen,\n} from '../viewer-pin-tool/utils';\nimport { getComputedStyle } from './utils';\n\n@Component({\n  tag: 'vertex-viewer-pin-label',\n  styleUrl: 'viewer-pin-label.css',\n  shadow: false,\n})\nexport class VertexPinLabel {\n  /**\n   * The pin to draw for the group\n   */\n  @Prop()\n  public pin?: TextPin;\n\n  /**\n   * The dimensions of the canvas for the pins\n   */\n  @Prop()\n  public elementBounds?: DOMRect;\n\n  /**\n   * The current text value of the component. Value is updated on user\n   * interaction.\n   */\n  @Prop({ mutable: true })\n  public value = '';\n\n  /**\n   * The controller that drives behavior for pin operations\n   */\n  @Prop({ mutable: true })\n  public pinController?: PinController;\n\n  /**\n   * @internal\n   */\n  @Event({ bubbles: true })\n  public labelChanged!: EventEmitter<void>;\n\n  /**\n   * Emitted whenever the label is focused, with the ID of the\n   * associated pin (or undefined if no pin is provided).\n   */\n  @Event({ bubbles: true })\n  public labelFocused!: EventEmitter<string | undefined>;\n\n  /**\n   * Emitted whenever the label is blurred, with the ID of the\n   * associated pin (or undefined if no pin is provided).\n   */\n  @Event({ bubbles: true })\n  public labelBlurred!: EventEmitter<string | undefined>;\n\n  @Element()\n  private hostEl!: HTMLElement;\n\n  @State()\n  private focused = false;\n\n  @State()\n  private computedScreenPosition?: Point.Point;\n\n  @State()\n  private textareaRows = 1;\n\n  @State()\n  private contentElBounds?: DOMRect;\n\n  private relativePointerDownPosition?: Point.Point;\n  private pinPointerDownPosition?: Point.Point;\n\n  private inputEl?: HTMLTextAreaElement;\n  private contentEl?: HTMLDivElement;\n\n  private resizeObserver?: ResizeObserver;\n  private contentResizeObserver?: ResizeObserver;\n\n  /**\n   * Gives focus to the component's internal text input.\n   */\n  @Method()\n  public async setFocus(): Promise<void> {\n    // HTMLInputElement.focus() doesn't exist in tests.\n    if (typeof this.inputEl?.focus === 'function') {\n      this.focused = true;\n      this.labelFocused.emit(this.pin?.id);\n      this.inputEl?.focus();\n    }\n  }\n\n  /**\n   * @internal\n   * submits the current text, unfocuses the input and emits the blur event to consumers\n   */\n  @Method()\n  public async submit(): Promise<void> {\n    this.focused = false;\n    this.labelBlurred.emit(this.pin?.id);\n    if (this.pin != null) {\n      this.pinController?.updatePin({\n        ...this.pin,\n        label: {\n          point: this.pin.label.point,\n          text: this.value,\n        },\n      });\n    }\n  }\n\n  @Watch('focused')\n  protected watchFocusChange(): void {\n    this.labelChanged.emit();\n\n    if (this.focused) {\n      this.pinController?.setSelectedPinId(this.pin?.id);\n    }\n  }\n\n  @Watch('pin')\n  protected watchPinChange(): void {\n    this.value = this.pin?.label.text ?? '';\n    this.computeScreenPosition();\n  }\n\n  @Watch('elementBounds')\n  protected watchElementBoundsChange(): void {\n    this.computeScreenPosition();\n  }\n\n  protected componentWillLoad(): void {\n    this.value = this.pin?.label.text ?? '';\n    this.computeScreenPosition();\n\n    if (this.pinController == null) {\n      this.pinController = new PinController(new PinModel());\n    }\n  }\n\n  protected componentDidLoad(): void {\n    this.resizeObserver = new ResizeObserver(() => {\n      this.labelChanged.emit();\n    });\n\n    this.contentResizeObserver = new ResizeObserver(this.computeContentSize);\n\n    if (this.hostEl != null) {\n      this.resizeObserver.observe(this.hostEl);\n    }\n\n    if (this.contentEl != null) {\n      this.contentResizeObserver.observe(this.contentEl);\n    }\n  }\n\n  protected disconnectedCallback(): void {\n    this.resizeObserver?.disconnect();\n    this.contentResizeObserver?.disconnect();\n  }\n\n  protected componentDidRender(): void {\n    if (this.focused && this.inputEl != null) {\n      this.setFocus();\n    }\n  }\n\n  protected render(): JSX.Element {\n    const { primaryColor, accentColor } = getPinColors(this.pin);\n    return (\n      <Host>\n        <div\n          class={classNames('pin-label-input-wrapper', {\n            focused: this.focused,\n          })}\n          onPointerDown={this.handlePointerDown}\n          style={{\n            top: `${this.computedScreenPosition?.y.toString() || 0}px`,\n            left: `${this.computedScreenPosition?.x.toString() || 0}px`,\n            minWidth: this.computeMinWidth(),\n            maxWidth: this.computeMaxWidth(),\n            maxHeight: this.computeMaxHeight(),\n            borderColor: primaryColor,\n            background: accentColor,\n          }}\n        >\n          <textarea\n            id={`pin-label-input-${this.pin?.id}`}\n            class={classNames('pin-label-input', 'pin-label-text', {\n              ['readonly']: !this.focused,\n            })}\n            disabled={!this.focused}\n            ref={(ref) => (this.inputEl = ref)}\n            value={this.value}\n            rows={this.textareaRows}\n            onKeyDown={this.handleInputKeyDown}\n            onInput={this.handleTextInput}\n            onBlur={this.handleTextBlur}\n            aria-label=\"Pin label input\"\n          />\n          {/* This corrects for a behavior in Firefox where setting the `disabled` attribute to true */}\n          {/* prevents any events from propagating. */}\n          {!this.focused && (\n            <div\n              class=\"pin-input-drag-target\"\n              onPointerDown={this.handlePointerDown}\n            />\n          )}\n        </div>\n        <div\n          ref={(el) => (this.contentEl = el)}\n          class={classNames('pin-label-text', 'pin-label-hidden')}\n          style={{\n            maxWidth: this.computeMaxWidth(),\n            maxHeight: this.computeMaxHeight(),\n          }}\n        >\n          {this.hiddenContent()}\n        </div>\n      </Host>\n    );\n  }\n\n  private hiddenContent(): Array<string | HTMLBRElement> {\n    // This corrects some inconsistencies in how a newline character\n    // is represented in a div. Leveraging `<br>`s results in a more\n    // consistent representation of the newlines in a textarea.\n    return this.value.includes('\\n')\n      ? this.value\n          .split('\\n')\n          .reduce(\n            (res, str) => [...res, str, <br />],\n            [] as Array<string | HTMLBRElement>,\n          )\n      : [this.value];\n  }\n\n  private computeMinWidth(): string {\n    if (this.contentElBounds != null) {\n      const expected = `${this.contentElBounds.width + 8}px`;\n\n      return `min(${expected}, ${this.computeMaxWidth()})`;\n    } else {\n      return `var(--viewer-annotations-pin-label-min-width)`;\n    }\n  }\n\n  private computeMaxWidth(): string {\n    const expected = `var(--viewer-annotations-pin-label-max-width)`;\n\n    return `min(${expected}, ${this.computeRemainingWidth()})`;\n  }\n\n  private computeMaxHeight(): string {\n    const expected = `var(--viewer-annotations-pin-label-max-height)`;\n\n    return `min(${expected}, ${this.computeRemainingHeight()})`;\n  }\n\n  private computeRemainingWidth(): string {\n    return `calc(${this.elementBounds?.width.toString() || 0}px - ${\n      this.computedScreenPosition?.x.toString() || 0\n    }px)`;\n  }\n\n  private computeRemainingHeight(): string {\n    return `calc(${this.elementBounds?.height.toString() || 0}px - ${\n      this.computedScreenPosition?.y.toString() || 0\n    }px)`;\n  }\n\n  private computeScreenPosition(): void {\n    this.computedScreenPosition =\n      isTextPin(this.pin) &&\n      this.elementBounds != null &&\n      this.pin.label.point != null\n        ? translatePointToScreen(this.pin.label.point, this.elementBounds)\n        : undefined;\n  }\n\n  private computeContentSize = (): void => {\n    readDOM(() => {\n      if (this.contentEl != null) {\n        this.contentElBounds = this.contentEl.getBoundingClientRect();\n        const computedStyles = getComputedStyle(this.contentEl);\n        this.textareaRows = Math.max(\n          1,\n          Math.ceil(\n            (Number.parseFloat(computedStyles.getPropertyValue('height')) -\n              Number.parseFloat(\n                computedStyles.getPropertyValue('borderWidth'),\n              ) *\n                2) /\n              Number.parseFloat(computedStyles.getPropertyValue('lineHeight')),\n          ),\n        );\n      }\n    });\n  };\n\n  private handleInputKeyDown = (event: KeyboardEvent): void => {\n    event.stopPropagation();\n    if (\n      event.key === 'Enter' &&\n      (event.ctrlKey || event.metaKey || event.shiftKey)\n    ) {\n      this.textareaRows += 1;\n      this.value += '\\n';\n    } else if (event.key === 'Enter') {\n      event.preventDefault();\n      this.submit();\n    }\n  };\n\n  private handlePointerDown = (event: PointerEvent): void => {\n    if (!this.focused) {\n      if (this.elementBounds != null) {\n        if (event.buttons !== 2) {\n          event.preventDefault();\n          event.stopPropagation();\n        }\n        this.relativePointerDownPosition = translatePointToRelative(\n          getMouseClientPosition(event, this.elementBounds),\n          this.elementBounds,\n        );\n        this.pinPointerDownPosition = this.pin?.label.point;\n\n        window.addEventListener('pointermove', this.handlePointerMove);\n        window.addEventListener('pointerup', this.handlePointerUp);\n      }\n    }\n  };\n\n  private handlePointerMove = (event: PointerEvent): void => {\n    if (\n      this.elementBounds != null &&\n      this.relativePointerDownPosition &&\n      this.pinPointerDownPosition != null\n    ) {\n      // Prevent selection of any text while interacting with the label\n      event.preventDefault();\n      event.stopPropagation();\n\n      const point = getMouseClientPosition(event, this.elementBounds);\n      const relative = translatePointToRelative(point, this.elementBounds);\n\n      const relativeDelta = Point.subtract(\n        relative,\n        this.relativePointerDownPosition,\n      );\n\n      const myUpdatedPin =\n        this.pin != null\n          ? {\n              ...this.pin,\n              label: {\n                ...this.pin.label,\n                point: Point.add(this.pinPointerDownPosition, relativeDelta),\n              },\n            }\n          : undefined;\n\n      if (myUpdatedPin) {\n        this.pinController?.updatePin(myUpdatedPin);\n        this.computeScreenPosition();\n      }\n    }\n  };\n\n  private handlePointerUp = (event: PointerEvent): void => {\n    if (\n      this.pinController?.getToolMode() === 'edit' &&\n      this.relativePointerDownPosition != null &&\n      this.elementBounds != null\n    ) {\n      const pointerDownScreen = translatePointToScreen(\n        this.relativePointerDownPosition,\n        this.elementBounds,\n      );\n      const distanceBetweenStartAndEndPoint = Point.distance(\n        pointerDownScreen,\n        getMouseClientPosition(event, this.elementBounds),\n      );\n\n      if (distanceBetweenStartAndEndPoint <= 2) {\n        this.focused = true;\n        this.labelFocused.emit(this.pin?.id);\n      }\n    }\n\n    this.relativePointerDownPosition = undefined;\n    this.pinPointerDownPosition = undefined;\n\n    window.removeEventListener('pointermove', this.handlePointerMove);\n    window.removeEventListener('pointerup', this.handlePointerUp);\n  };\n\n  private handleTextBlur = (): void => {\n    this.submit();\n  };\n\n  private handleTextInput = (event: Event): void => {\n    const input = event.target as HTMLInputElement;\n    this.value = input.value;\n  };\n}\n",":host {\n  /**\n   * @prop  --viewer-annotations-pin-label-line-color: A CSS color that\n   * specifies the color of the label line\n   */\n  --viewer-annotations-pin-label-line-color: var(\n    --viewer-annotations-pin-primary-color\n  );\n\n  /**\n   * @prop --viewer-annotations-pin-label-line-width: A CSS color that\n   * specifies the width of the label line\n   */\n  --viewer-annotations-pin-label-line-width: 1;\n\n  overflow: hidden;\n  pointer-events: none;\n}\n\n.label-line {\n  pointer-events: auto;\n  stroke: var(--viewer-annotations-pin-label-line-color);\n  stroke-width: var(--viewer-annotations-pin-label-line-width);\n  cursor: default;\n}\n\n.svg {\n  position: absolute;\n  top: 0;\n  bottom: 0;\n  left: 0;\n  right: 0;\n  overflow: hidden;\n  pointer-events: none;\n  height: 100%;\n  width: 100%;\n}\n","import {\n  Component,\n  // eslint-disable-next-line @typescript-eslint/no-unused-vars\n  h,\n  Host,\n  JSX,\n  Prop,\n} from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\n\nimport { getPinColors, Pin } from '../../lib/pins/model';\n\n@Component({\n  tag: 'vertex-viewer-pin-label-line',\n  styleUrl: 'viewer-pin-label-line.css',\n  shadow: false,\n})\nexport class VertexPinLabelLine {\n  @Prop()\n  public pinPoint: Point.Point | undefined;\n\n  @Prop()\n  public labelPoint: Point.Point | undefined;\n\n  @Prop()\n  public pin: Pin | undefined;\n\n  protected render(): JSX.Element {\n    const { primaryColor } = getPinColors(this.pin);\n    return (\n      <Host>\n        <svg class=\"svg\">\n          <line\n            class=\"label-line\"\n            style={{\n              stroke: primaryColor,\n            }}\n            x1={this.labelPoint?.x}\n            y1={this.labelPoint?.y}\n            x2={this.pinPoint?.x}\n            y2={this.pinPoint?.y}\n          />\n        </svg>\n      </Host>\n    );\n  }\n}\n"],"version":3}

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

@@ -4,11 +4,11 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var model = require('./model-Dy5FvjIA.js');
-var bundle$1 = require('./bundle-07I6_WqC.js');
+var model = require('./model-BC6acIWJ.js');
+var bundle$1 = require('./bundle-BCS0nA91.js');
 var bundle = require('./bundle-CLGyVDEW.js');
 var cursors = require('./cursors-B-QSF9lQ.js');
-var dom = require('./dom-Dlu6-7PF.js');
+var dom = require('./dom-BuQSLPWr.js');
 var elementRectObserver = require('./elementRectObserver-BobgIEu6.js');
 var entities = require('./entities-BhIrCJqA.js');
 var dom$1 = require('./dom-DYd3-Hpl.js');

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

@@ -1 +1 @@
-{"file":"vertex-viewer-spinner.cjs.entry.js","mappings":";;;;;;;;;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,y6BAAy6B,CAAC;;MCa77B,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;;;;;;AAQG;AAEI,QAAA,IAAA,CAAA,IAAI,GAAiB,IAAI;AAmBjC;IAjBQ,MAAM,GAAA;AACX,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAEC,iBAAU,CAAC,SAAS,EAAE;AAC3B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;aAC3B,CAAC,EAAA,EAEFD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,CACH;;;;;;;","names":["h","classNames"],"sources":["src/components/viewer-spinner/viewer-spinner.css?tag=vertex-viewer-spinner&encapsulation=shadow","src/components/viewer-spinner/viewer-spinner.tsx"],"sourcesContent":[".spinner {\n  position: relative;\n  height: 16px;\n  width: 16px;\n}\n\n.spinner div {\n  position: absolute;\n  display: block;\n  animation: spinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-radius: 50%;\n  border-style: solid;\n  box-sizing: border-box;\n  border-color: var(--neutral-800) transparent transparent transparent;\n  border-width: 1px;\n\n  margin: 0;\n}\n\n.spinner div:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner div:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner div:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n/* xs */\n.spinner.xs {\n  height: 16px;\n  width: 16px;\n}\n\n.spinner.xs div {\n  border-width: 1px;\n  height: 16px;\n  width: 16px;\n  margin: 0;\n}\n\n/* sm */\n.spinner.sm {\n  height: 24px;\n  width: 24px;\n}\n\n.spinner.sm div {\n  border-width: 3px;\n  height: 18px;\n  width: 18px;\n  margin: 2px;\n}\n\n/* md */\n.spinner.md {\n  height: 32px;\n  width: 32px;\n}\n\n.spinner.md div {\n  border-width:  3px;\n  height: 32px;\n  width: 32px;\n  margin: 2px;\n}\n\n/* lg */\n.spinner.lg {\n  height: 64px;\n  width: 64px;\n}\n\n.spinner.lg div {\n  border-width:  6px;\n  height: 52px;\n  width: 52px;\n  margin: 6px;\n}\n\n@keyframes spinner {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport classNames from 'classnames';\n\n/**\n * The predefined sizes for the spinner.\n */\nexport type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | undefined;\n\n@Component({\n  tag: 'vertex-viewer-spinner',\n  styleUrl: 'viewer-spinner.css',\n  shadow: true,\n})\nexport class ViewerSpinner {\n  /**\n   * The size of the spinner. Can be `'xs' | 'sm' | 'md' | 'lg' | undefined`. Predefined\n   * sizes are set to:\n   *\n   *  * `xm`: 16px\n   *  * `sm`: 24px\n   *  * `md`: 32px\n   *  * `lg`: 64px\n   */\n  @Prop()\n  public size?: SpinnerSize = 'md';\n\n  public render(): h.JSX.IntrinsicElements {\n    return (\n      <div\n        class={classNames('spinner', {\n          ['xs']: this.size === 'xs',\n          ['sm']: this.size === 'sm',\n          ['md']: this.size === 'md',\n          ['lg']: this.size === 'lg',\n        })}\n      >\n        <div />\n        <div />\n        <div />\n        <div />\n      </div>\n    );\n  }\n}\n"],"version":3}
+{"file":"vertex-viewer-spinner.cjs.entry.js","mappings":";;;;;;;;;AAAA,MAAM,gBAAgB,GAAG,MAAM,CAAC,y6BAAy6B,CAAC;;MCa77B,aAAa,GAAA,MAAA;AAL1B,IAAA,WAAA,CAAA,OAAA,EAAA;;AAME;;;;;;;;AAQG;AAEI,QAAA,IAAA,CAAA,IAAI,GAAiB,IAAI;AAmBjC;IAjBQ,MAAM,GAAA;AACX,QAAA,QACEA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EACE,KAAK,EAAEC,iBAAU,CAAC,SAAS,EAAE;AAC3B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;AAC1B,gBAAA,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,KAAK,IAAI;aAC3B,CAAC,EAAA,EAEFD,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,EACPA,OAAA,CAAA,KAAA,EAAA,EAAA,GAAA,EAAA,0CAAA,EAAA,CAAO,CACH;;;;;;;","names":["h","classNames"],"sources":["src/components/viewer-spinner/viewer-spinner.css?tag=vertex-viewer-spinner&encapsulation=shadow","src/components/viewer-spinner/viewer-spinner.tsx"],"sourcesContent":[".spinner {\n  position: relative;\n  height: 16px;\n  width: 16px;\n}\n\n.spinner div {\n  position: absolute;\n  display: block;\n  animation: spinner 1.2s cubic-bezier(0.5, 0, 0.5, 1) infinite;\n  border-radius: 50%;\n  border-style: solid;\n  box-sizing: border-box;\n  border-color: var(--neutral-800) transparent transparent transparent;\n  border-width: 1px;\n\n  margin: 0;\n}\n\n.spinner div:nth-child(1) {\n  animation-delay: -0.45s;\n}\n\n.spinner div:nth-child(2) {\n  animation-delay: -0.3s;\n}\n\n.spinner div:nth-child(3) {\n  animation-delay: -0.15s;\n}\n\n/* xs */\n.spinner.xs {\n  height: 16px;\n  width: 16px;\n}\n\n.spinner.xs div {\n  border-width: 1px;\n  height: 16px;\n  width: 16px;\n  margin: 0;\n}\n\n/* sm */\n.spinner.sm {\n  height: 24px;\n  width: 24px;\n}\n\n.spinner.sm div {\n  border-width: 3px;\n  height: 18px;\n  width: 18px;\n  margin: 2px;\n}\n\n/* md */\n.spinner.md {\n  height: 32px;\n  width: 32px;\n}\n\n.spinner.md div {\n  border-width: 3px;\n  height: 32px;\n  width: 32px;\n  margin: 2px;\n}\n\n/* lg */\n.spinner.lg {\n  height: 64px;\n  width: 64px;\n}\n\n.spinner.lg div {\n  border-width: 6px;\n  height: 52px;\n  width: 52px;\n  margin: 6px;\n}\n\n@keyframes spinner {\n  0% {\n    transform: rotate(0deg);\n  }\n  100% {\n    transform: rotate(360deg);\n  }\n}\n","import { Component, h, Prop } from '@stencil/core';\nimport classNames from 'classnames';\n\n/**\n * The predefined sizes for the spinner.\n */\nexport type SpinnerSize = 'xs' | 'sm' | 'md' | 'lg' | undefined;\n\n@Component({\n  tag: 'vertex-viewer-spinner',\n  styleUrl: 'viewer-spinner.css',\n  shadow: true,\n})\nexport class ViewerSpinner {\n  /**\n   * The size of the spinner. Can be `'xs' | 'sm' | 'md' | 'lg' | undefined`. Predefined\n   * sizes are set to:\n   *\n   *  * `xm`: 16px\n   *  * `sm`: 24px\n   *  * `md`: 32px\n   *  * `lg`: 64px\n   */\n  @Prop()\n  public size?: SpinnerSize = 'md';\n\n  public render(): h.JSX.IntrinsicElements {\n    return (\n      <div\n        class={classNames('spinner', {\n          ['xs']: this.size === 'xs',\n          ['sm']: this.size === 'sm',\n          ['md']: this.size === 'md',\n          ['lg']: this.size === 'lg',\n        })}\n      >\n        <div />\n        <div />\n        <div />\n        <div />\n      </div>\n    );\n  }\n}\n"],"version":3}

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

@@ -4,8 +4,8 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle = require('./bundle-07I6_WqC.js');
-var dom = require('./dom-Dlu6-7PF.js');
+var bundle = require('./bundle-BCS0nA91.js');
+var dom = require('./dom-BuQSLPWr.js');
 var elementRectObserver = require('./elementRectObserver-BobgIEu6.js');
 var model = require('./model-Bw4h8wNt.js');
 require('./bundle-CLGyVDEW.js');

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

@@ -4,18 +4,18 @@
 'use strict';
 
 var index = require('./index-1H7bCrlx.js');
-var bundle = require('./bundle-07I6_WqC.js');
+var bundle = require('./bundle-BCS0nA91.js');
 var index$1 = require('./index-CRUoPh1y.js');
 var stencil = require('./stencil-Hsr_8Chs.js');
-var controller = require('./controller-Dklbe0Y6.js');
-var streamAttributes = require('./streamAttributes-CJOD7AxG.js');
+var controller = require('./controller-DvE3p6ta.js');
+var streamAttributes = require('./streamAttributes-M3UUIO3l.js');
 require('./entities-BhIrCJqA.js');
 var bundle$1 = require('./bundle-CLGyVDEW.js');
-var reglComponent = require('./regl-component-CB004H91.js');
+var reglComponent = require('./regl-component-DjVaO3t3.js');
 require('./_commonjsHelpers-CBbBosIU.js');
 require('./bundle-Dtdz7qlD.js');
-require('./util-smaTO4bk.js');
-require('./viewport-B70DgDZj.js');
+require('./util-gX3IGslq.js');
+require('./viewport-BDbB9o9T.js');
 
 function focusInputElement(element) {
     if (window.document.activeElement !== element) {
@@ -281,7 +281,7 @@ const TransformWidgetInput = ({ ref, identifier, disabled, onChange, onIncrement
             onUndo();
         }
     };
-    return (index.h("input", { ref: ref, disabled: disabled, class: `widget-input ${identifier}`, type: "text", onChange: handleChange, onKeyDown: handleKeyDown, onBlur: onBlur }));
+    return (index.h("input", { ref: ref, disabled: disabled, class: `widget-input ${identifier}`, type: "text", onChange: handleChange, onKeyDown: handleKeyDown, onBlur: onBlur, "aria-label": "Transform widget input" }));
 };
 function constrainTo(dimension, length) {
     return Math.min(dimension, Math.max(0, length));