@vertexvis/viewer 1.0.0-testing.6 → 1.0.0-testing.8

package/dist/components/p-Dru_6caB.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["create","x","y","distance","a","b","delta","subtract","Math","sqrt","add","scaleProportional","pt","scale","magnitude","normalizeVector","magnitudeOfPoint","normalDirectionVector","ptA","ptB","orthogonalVector","unitVectorBetweenPoints","abs","vectorXValue","pow","vectorYValue","fromJson","json","obj","JSON","parse","Array","isArray","createArrowheadPoints","start","end","arrowSideLength","arrowHeadTheta","arrowOrthogonalVector","Point.orthogonalVector","normalizedDirection","Point.normalDirectionVector","arrowLeft","Point.subtract","Point.add","Point.scaleProportional","cos","sin","arrowRight","leftPoint","rightPoint","createLineAnchorStylePoints","triangleArrowAngle","lineArrowAngle","Point.distance","arrowHeadHeight","max","min","hashHeight","radius","triangleArrowRelativeHeight","triangleArrowBasePosition","triangleArrowTheta","Angle","toRadians","triangleArrowSideLength","triangleArrow","lineArrowTheta","lineArrowSideLength","lineArrow","hashLineTheta","hashLine","tip","base","arrowTriangle","arrowLine","hash","arrowheadPointsToPolygonPoints","points","scaledRight","scalePointProportional","scaledLeft","scaledBase","map","join","arrowheadPointsToPathPoints","arrowheadPointsToHashPoints","x1","y1","x2","y2","arrowheadPointsToCirclePoints","cx","cy","r","isVertexViewerArrowMarkup","el","HTMLElement","nodeName","parsePoint","value","Point.fromJson","basePoint","scaledPoint","isVertexViewerCircleMarkup","parseBounds","Rectangle","parsePoints","values","Point","stringify","isVertexViewerFreeformMarkup","getBoundingBox2dAnchorPosition","rect","position","width","height","center","translatePointToScreen","canvasDimensions","contentDimensions","centeringBehavior","canvasToContentScaleFactor","effectiveScalar","contentScaleFactor","getScaleFactor","contentRelativePoint","Dimensions","scaledContentWidth","scaledContentHeight","centerOffsetX","centerOffsetY","translateDimensionsToScreen","dimensions","contentRelativeDimensions","translateRectToScreen","fromPointAndDimensions","translatePointToRelative","scaleFactor","point","translatePointsToBounds","original","bounds","createRectangle","initialPoint","currentPoint","maintainAspectRatio","fromPoints","fitBoundsSize","isPortrait","currentIsLeftOfInitial","currentIsAboveInitial","fitBoundsX","fitBoundsY","transformRectangle","current","anchor","left","top","w","h","right","bottom","topLeft","bottomLeft","topRight","bottomRight","isVertexViewerMarkupElement","isValidPointData","every","isNaN","isValidStartEvent","event","target","mode","RelativeAnchor","id","transform","rotation","name","onPointerDown","children","class","style","onTouchStart","preventDefault","SvgShadow","in","stdDeviation","dx","dy","result","in2","operator","MarkupInteractionHandler","constructor","this","handlePointerDown","handleInteractionAttempt","handlePointerMove","handleInteractionMove","handlePointerUp","window","removeEventListener","handleInteractionEnd","resizeObserver","ResizeObserver","entry","elementBounds","computeBoundingRect","initialize","element","api","observe","addEventListener","dispose","disconnect","_a","undefined","acceptInteraction"],"sources":["../geometry/src/point.ts","src/components/viewer-markup-arrow/utils.ts","src/components/viewer-markup-circle/utils.ts","src/components/viewer-markup-freeform/utils.ts","src/components/viewer-markup/markup-utils.ts","src/components/viewer-markup/viewer-markup-components.tsx","src/lib/markup/interactions.ts"],"sourcesContent":["import * as Angle from './angle';\nimport { lerp as lerpNumber } from './math';\n\n/**\n * A `Point` represents a cartesian coordinate with a horizontal and vertical\n * position or length.\n */\nexport interface Point {\n  x: number;\n  y: number;\n}\n\n/**\n * Returns a new `Point` with the given horizontal and vertical position.\n */\nexport function create(x = 0, y = 0): Point {\n  return { x, y };\n}\n\n/**\n * Converts a polar coordinate (length and angle) into a Cartesian coordinate.\n */\nexport function polar(length: number, radians: Angle.Angle): Point {\n  const x = Math.cos(radians) * length;\n  const y = Math.sin(radians) * length;\n  return create(x, y);\n}\n\n/**\n * Returns the distance between two points.\n */\nexport function distance(a: Point, b: Point): number {\n  const delta = subtract(a, b);\n  return Math.sqrt(delta.x * delta.x + delta.y * delta.y);\n}\n\n/**\n * Returns a new `Point` where `b` is subtracted from `a`.\n */\nexport function subtract(a: Point, b: Point): Point {\n  return { x: a.x - b.x, y: a.y - b.y };\n}\n\n/**\n * Returns a new `Point` where `b` is added to `a`.\n */\nexport function add(a: Point, b: Point): Point {\n  return { x: a.x + b.x, y: a.y + b.y };\n}\n\n/**\n * Returns `true` if the `x` and `y` positions of `a` and `b` are equal.\n */\nexport function isEqual(a: Point, b: Point): boolean {\n  return a.x === b.x && a.y === b.y;\n}\n\n/**\n * Performs a linear interpolation between `a` and `b` and returns the result.\n * The value of `t` is clamped between `[0, 1]`.\n *\n * @param a The start value.\n * @param b The end value.\n * @param t A value between 0 and 1.\n * @returns A point between `a` and `b`.\n */\nexport function lerp(a: Point, b: Point, t: number): Point {\n  return {\n    x: lerpNumber(a.x, b.x, t),\n    y: lerpNumber(a.y, b.y, t),\n  };\n}\n\n/**\n * Returns a new `Point` where `x` and `y` are inverted.\n */\nexport function negate(pt: Point): Point {\n  return create(-pt.x, -pt.y);\n}\n\n/**\n * Returns a new `Point` where `x` and `y` are multiplied by the given scale\n * factors.\n */\nexport function scale(pt: Point, scaleX: number, scaleY: number): Point {\n  return {\n    x: pt.x * scaleX,\n    y: pt.y * scaleY,\n  };\n}\n\n/**\n * Returns a new `Point` where `x` and `y` are multiplied by the given scale\n * factor.\n */\nexport function scaleProportional(pt: Point, scale: number): Point {\n  return {\n    x: pt.x * scale,\n    y: pt.y * scale,\n  };\n}\n\n/**\n * Returns the magnitude of a point.\n */\nexport function magnitude(pt: Point): number {\n  return Math.sqrt(pt.x * pt.x + pt.y * pt.y);\n}\n\n/**\n * Transforms a vector into the corresponding normal (unit) vector.\n */\nexport function normalizeVector(pt: Point): Point {\n  const magnitudeOfPoint = magnitude(pt);\n  if (magnitudeOfPoint === 0) {\n    return create(0, 0);\n  } else {\n    return scaleProportional(pt, 1 / magnitudeOfPoint);\n  }\n}\n\n/**\n * Returns a new normal (unit) vector pointing between the two given points.\n */\nexport function normalDirectionVector(ptA: Point, ptB: Point): Point {\n  return normalizeVector(subtract(ptB, ptA));\n}\n\n/**\n * Returns a vector orthogonal to the vector between the two given points.\n */\nexport function orthogonalVector(ptA: Point, ptB: Point): Point {\n  const unitVectorBetweenPoints = normalDirectionVector(ptA, ptB);\n\n  // Handle vectors that are parallel to the x or y axis\n  if (unitVectorBetweenPoints.x === 0 || unitVectorBetweenPoints.y === 0) {\n    return create(-1 * unitVectorBetweenPoints.y, unitVectorBetweenPoints.x);\n  }\n\n  if (\n    Math.abs(unitVectorBetweenPoints.x) > Math.abs(unitVectorBetweenPoints.y)\n  ) {\n    const vectorXValue = 1 - Math.pow(unitVectorBetweenPoints.x, 2);\n    const vectorYValue =\n      -1 * unitVectorBetweenPoints.x * unitVectorBetweenPoints.y;\n    return normalizeVector(create(vectorXValue, vectorYValue));\n  } else {\n    const vectorXValue =\n      -1 * unitVectorBetweenPoints.x * unitVectorBetweenPoints.y;\n    const vectorYValue = 1 - Math.pow(unitVectorBetweenPoints.y, 2);\n    return normalizeVector(create(vectorXValue, vectorYValue));\n  }\n}\n\n/**\n * Parses a JSON string representation of a Point and returns an object.\n *\n * @param json A JSON string, either in the form `[x,y]` or `{\"x\": 0, \"y\": 0}`\n * @returns A parsed Point.\n */\nexport function fromJson(json: string): Point {\n  const obj = JSON.parse(json);\n  if (Array.isArray(obj)) {\n    const [x, y] = obj;\n    return create(x, y);\n  } else {\n    const { x, y } = obj;\n    return create(x, y);\n  }\n}\n","import { Angle } from '@vertexvis/geometry';\n\nimport * as Point from '../../../../geometry/src/point';\n\nexport type LineAnchorStyle =\n  | 'arrow-triangle'\n  | 'arrow-line'\n  | 'dot'\n  | 'hash'\n  | 'none';\n\nexport interface LineAnchorStylePoints {\n  tip: Point.Point;\n  base: Point.Point;\n  arrowTriangle: ArrowheadPoints;\n  arrowLine: ArrowheadPoints;\n  hash: ArrowheadPoints;\n  radius: number;\n}\n\nexport interface ArrowheadPoints {\n  leftPoint: Point.Point;\n  rightPoint: Point.Point;\n}\n\nexport interface LinePoints {\n  x1: number;\n  y1: number;\n  x2: number;\n  y2: number;\n}\n\nexport interface CirclePoints {\n  cx: number;\n  cy: number;\n  r: number;\n}\n\nexport function createArrowheadPoints(\n  start: Point.Point,\n  end: Point.Point,\n  arrowSideLength: number,\n  arrowHeadTheta: number\n): ArrowheadPoints {\n  const arrowOrthogonalVector = Point.orthogonalVector(start, end);\n  const normalizedDirection = Point.normalDirectionVector(start, end);\n\n  const arrowLeft = Point.subtract(\n    end,\n    Point.add(\n      Point.scaleProportional(\n        normalizedDirection,\n        arrowSideLength * Math.cos(arrowHeadTheta)\n      ),\n      Point.scaleProportional(\n        arrowOrthogonalVector,\n        arrowSideLength * Math.sin(arrowHeadTheta)\n      )\n    )\n  );\n  const arrowRight = Point.subtract(\n    end,\n    Point.subtract(\n      Point.scaleProportional(\n        normalizedDirection,\n        arrowSideLength * Math.cos(arrowHeadTheta)\n      ),\n      Point.scaleProportional(\n        arrowOrthogonalVector,\n        arrowSideLength * Math.sin(arrowHeadTheta)\n      )\n    )\n  );\n\n  return {\n    leftPoint: arrowLeft,\n    rightPoint: arrowRight,\n  };\n}\n\nexport function createLineAnchorStylePoints(\n  start: Point.Point,\n  end: Point.Point,\n  triangleArrowAngle = 65,\n  lineArrowAngle = 85\n): LineAnchorStylePoints {\n  // Adjust the size of the end style to the distance between the start and end points\n  const distance = Point.distance(start, end);\n  const arrowHeadHeight = Math.max(4, Math.min(16, distance * 0.25));\n  const hashHeight = Math.max(4, Math.min(12, distance * 0.16));\n  const radius = Math.min(5, distance * 0.1);\n\n  // Triangle arrow position\n  const triangleArrowRelativeHeight = arrowHeadHeight / distance;\n  const triangleArrowBasePosition = Point.add(\n    Point.scaleProportional(end, 1 - triangleArrowRelativeHeight),\n    Point.scaleProportional(start, triangleArrowRelativeHeight)\n  );\n  const triangleArrowTheta = Angle.toRadians(triangleArrowAngle / 2);\n  const triangleArrowSideLength =\n    arrowHeadHeight / Math.cos(triangleArrowTheta);\n  const triangleArrow = createArrowheadPoints(\n    start,\n    end,\n    triangleArrowSideLength,\n    triangleArrowTheta\n  );\n\n  // Line arrow position\n  const lineArrowTheta = Angle.toRadians(lineArrowAngle / 2);\n  const lineArrowSideLength = arrowHeadHeight / Math.cos(lineArrowTheta);\n  const lineArrow = createArrowheadPoints(\n    start,\n    end,\n    lineArrowSideLength,\n    lineArrowTheta\n  );\n\n  // Hash position\n  // Setting the arrowHeadAngle to 90 degrees results in a\n  // straight hash mark perpendicular to the direction of the line\n  const hashLineTheta = Angle.toRadians(90);\n  const hashLine = createArrowheadPoints(start, end, hashHeight, hashLineTheta);\n\n  return {\n    tip: end,\n    base: triangleArrowBasePosition,\n    arrowTriangle: triangleArrow,\n    arrowLine: lineArrow,\n    hash: hashLine,\n    radius: radius,\n  };\n}\n\nexport function arrowheadPointsToPolygonPoints(\n  points: LineAnchorStylePoints,\n  scale = 1\n): string {\n  const scaledRight = scalePointProportional(\n    points.tip,\n    points.arrowTriangle.rightPoint,\n    scale\n  );\n  const scaledLeft = scalePointProportional(\n    points.tip,\n    points.arrowTriangle.leftPoint,\n    scale\n  );\n  const scaledBase = scalePointProportional(points.tip, points.base, scale);\n\n  return [points.tip, scaledRight, scaledBase, scaledLeft]\n    .map((pt) => `${pt.x},${pt.y}`)\n    .join(' ');\n}\n\nexport function arrowheadPointsToPathPoints(\n  points: LineAnchorStylePoints,\n  scale = 1\n): string {\n  const scaledRight = scalePointProportional(\n    points.tip,\n    points.arrowLine.rightPoint,\n    scale\n  );\n  const scaledLeft = scalePointProportional(\n    points.tip,\n    points.arrowLine.leftPoint,\n    scale\n  );\n\n  return `M${scaledRight.x} ${scaledRight.y} L${points.tip.x} ${points.tip.y} L${scaledLeft.x} ${scaledLeft.y} L${points.tip.x} ${points.tip.y} Z`;\n}\n\nexport function arrowheadPointsToHashPoints(\n  points: LineAnchorStylePoints,\n  scale = 1\n): LinePoints {\n  const scaledRight = scalePointProportional(\n    points.tip,\n    points.hash.rightPoint,\n    scale\n  );\n  const scaledLeft = scalePointProportional(\n    points.tip,\n    points.hash.leftPoint,\n    scale\n  );\n\n  return {\n    x1: scaledRight.x,\n    y1: scaledRight.y,\n    x2: scaledLeft.x,\n    y2: scaledLeft.y,\n  };\n}\n\nexport function arrowheadPointsToCirclePoints(\n  points: LineAnchorStylePoints,\n  scale = 1\n): CirclePoints {\n  return {\n    cx: points.tip.x,\n    cy: points.tip.y,\n    r: points.radius * scale,\n  };\n}\n\nexport function isVertexViewerArrowMarkup(\n  el: unknown\n): el is HTMLVertexViewerMarkupArrowElement {\n  return (\n    el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-MARKUP-ARROW'\n  );\n}\n\nexport function parsePoint(\n  value: string | Point.Point | undefined\n): Point.Point | undefined {\n  return typeof value === 'string' ? Point.fromJson(value) : value;\n}\n\nexport function scalePointProportional(\n  basePoint: Point.Point,\n  scaledPoint: Point.Point,\n  scale: number\n): Point.Point {\n  return Point.add(\n    basePoint,\n    Point.scaleProportional(Point.subtract(scaledPoint, basePoint), scale)\n  );\n}\n","import { Rectangle } from '@vertexvis/geometry';\n\nexport function isVertexViewerCircleMarkup(\n  el: unknown\n): el is HTMLVertexViewerMarkupCircleElement {\n  return (\n    el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-MARKUP-CIRCLE'\n  );\n}\n\nexport function parseBounds(\n  value: string | Rectangle.Rectangle | undefined\n): Rectangle.Rectangle | undefined {\n  return typeof value === 'string' ? Rectangle.fromJson(value) : value;\n}\n","import { Point } from '@vertexvis/geometry';\n\nexport function parsePoints(\n  value: string | Point.Point[] | undefined\n): Point.Point[] | undefined {\n  return typeof value === 'string'\n    ? JSON.parse(value).map((values: number[]) =>\n        Point.fromJson(JSON.stringify(values))\n      )\n    : value;\n}\n\nexport function isVertexViewerFreeformMarkup(\n  el: unknown\n): el is HTMLVertexViewerMarkupFreeformElement {\n  return (\n    el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-MARKUP-FREEFORM'\n  );\n}\n","import { Dimensions, Point, Rectangle } from '@vertexvis/geometry';\n\nimport { MarkupCenteringBehavior } from '../../lib/types';\nimport { isVertexViewerArrowMarkup } from '../viewer-markup-arrow/utils';\nimport { isVertexViewerCircleMarkup } from '../viewer-markup-circle/utils';\nimport { isVertexViewerFreeformMarkup } from '../viewer-markup-freeform/utils';\n\nexport type BoundingBox2dAnchorPosition =\n  | 'left'\n  | 'right'\n  | 'top'\n  | 'bottom'\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'center';\n\nexport function getBoundingBox2dAnchorPosition(\n  rect: Rectangle.Rectangle,\n  position: BoundingBox2dAnchorPosition\n): Point.Point {\n  switch (position) {\n    case 'top-left':\n      return Point.create(rect.x, rect.y);\n    case 'top':\n      return Point.create(rect.x + rect.width / 2, rect.y);\n    case 'top-right':\n      return Point.create(rect.x + rect.width, rect.y);\n    case 'right':\n      return Point.create(rect.x + rect.width, rect.y + rect.height / 2);\n    case 'bottom-right':\n      return Point.create(rect.x + rect.width, rect.y + rect.height);\n    case 'bottom':\n      return Point.create(rect.x + rect.width / 2, rect.y + rect.height);\n    case 'bottom-left':\n      return Point.create(rect.x, rect.y + rect.height);\n    case 'left':\n      return Point.create(rect.x, rect.y + rect.height / 2);\n    case 'center':\n      return Rectangle.center(rect);\n  }\n}\n\nexport function translatePointToScreen(\n  pt: Point.Point,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions: Dimensions.Dimensions = canvasDimensions,\n  centeringBehavior: MarkupCenteringBehavior = 'none',\n  scale = 1\n): Point.Point {\n  const canvasToContentScaleFactor = Math.min(\n    canvasDimensions.width / contentDimensions.width,\n    canvasDimensions.height / contentDimensions.height\n  );\n  const effectiveScalar = canvasToContentScaleFactor * scale;\n  const contentScaleFactor = getScaleFactor(contentDimensions);\n  const contentRelativePoint = Point.add(\n    Point.scale(pt, contentScaleFactor, contentScaleFactor),\n    Dimensions.center(contentDimensions)\n  );\n\n  // Include an offset for width and height to account for cases where the\n  // content dimensions are smaller than the canvas dimensions.\n  const scaledContentWidth = contentDimensions.width * effectiveScalar;\n  const scaledContentHeight = contentDimensions.height * effectiveScalar;\n  const centerOffsetX =\n    centeringBehavior === 'both' || centeringBehavior === 'x-only'\n      ? Math.max(0, (canvasDimensions.width - scaledContentWidth) / 2)\n      : 0;\n  const centerOffsetY =\n    centeringBehavior === 'both' || centeringBehavior === 'y-only'\n      ? Math.max(0, (canvasDimensions.height - scaledContentHeight) / 2)\n      : 0;\n\n  return Point.create(\n    contentRelativePoint.x * effectiveScalar + centerOffsetX,\n    contentRelativePoint.y * effectiveScalar + centerOffsetY\n  );\n}\n\nexport function translatePointToBounds(\n  pt: Point.Point,\n  rect: Rectangle.Rectangle,\n  canvasDimensions: Dimensions.Dimensions\n): Point.Point {\n  const rectToScreen = translateRectToScreen(rect, canvasDimensions);\n  return Point.add(pt, rectToScreen);\n}\n\nexport function translateDimensionsToScreen(\n  dimensions: Dimensions.Dimensions,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions: Dimensions.Dimensions = canvasDimensions,\n  scale = 1\n): Dimensions.Dimensions {\n  const canvasToContentScaleFactor = Math.min(\n    canvasDimensions.width / contentDimensions.width,\n    canvasDimensions.height / contentDimensions.height\n  );\n  const effectiveScalar = canvasToContentScaleFactor * scale;\n  const contentScaleFactor = getScaleFactor(contentDimensions);\n  const contentRelativeDimensions = Dimensions.scale(\n    contentScaleFactor,\n    contentScaleFactor,\n    dimensions\n  );\n\n  return Dimensions.scale(\n    effectiveScalar,\n    effectiveScalar,\n    contentRelativeDimensions\n  );\n}\n\n/**\n * Translates a rectangle in relative units, to a rectangle in screen units.\n *\n * Shape coordinates are persisted in relative units, so they can be presented\n * at any size.\n */\nexport function translateRectToScreen(\n  rect: Rectangle.Rectangle,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions?: Dimensions.Dimensions,\n  centeringBehavior: MarkupCenteringBehavior = 'none',\n  scale = 1\n): Rectangle.Rectangle {\n  const position = translatePointToScreen(\n    rect,\n    canvasDimensions,\n    contentDimensions,\n    centeringBehavior,\n    scale\n  );\n  const dimensions = translateDimensionsToScreen(\n    rect,\n    canvasDimensions,\n    contentDimensions,\n    scale\n  );\n  return Rectangle.fromPointAndDimensions(position, dimensions);\n}\n\n/**\n * Translates a point in screen units, to a point in relative units.\n */\nexport function translatePointToRelative(\n  pt: Point.Point,\n  canvasDimensions: Dimensions.Dimensions\n): Point.Point {\n  const scaleFactor = 1 / getScaleFactor(canvasDimensions);\n  const point = Point.scale(\n    Point.subtract(pt, Dimensions.center(canvasDimensions)),\n    scaleFactor,\n    scaleFactor\n  );\n\n  return point;\n}\n\n/**\n * Translates a set of points in relative `original` units to\n * points in relative `bounds` units.\n */\nexport function translatePointsToBounds(\n  points: Point.Point[],\n  original: Rectangle.Rectangle,\n  bounds: Rectangle.Rectangle\n): Point.Point[] {\n  return points.map((pt) =>\n    Point.add(\n      Point.scale(\n        Point.subtract(pt, original),\n        bounds.width / (original.width || 1),\n        bounds.height / (original.height || 1)\n      ),\n      bounds\n    )\n  );\n}\n\nexport function createRectangle(\n  initialPoint: Point.Point,\n  currentPoint: Point.Point,\n  maintainAspectRatio: boolean\n): Rectangle.Rectangle {\n  const bounds = Rectangle.fromPoints(initialPoint, currentPoint);\n  if (maintainAspectRatio) {\n    const fitBoundsSize = Math.max(bounds.width, bounds.height);\n    const isPortrait = bounds.height > bounds.width;\n    const currentIsLeftOfInitial = currentPoint.x <= initialPoint.x;\n    const currentIsAboveInitial = currentPoint.y <= initialPoint.y;\n    const fitBoundsX = currentIsLeftOfInitial\n      ? isPortrait\n        ? initialPoint.x - fitBoundsSize\n        : currentPoint.x\n      : initialPoint.x;\n    const fitBoundsY = currentIsAboveInitial\n      ? isPortrait\n        ? currentPoint.y\n        : initialPoint.y - fitBoundsSize\n      : initialPoint.y;\n    return Rectangle.create(\n      fitBoundsX,\n      fitBoundsY,\n      fitBoundsSize,\n      fitBoundsSize\n    );\n  } else {\n    return bounds;\n  }\n}\n\nexport function transformRectangle(\n  bounds: Rectangle.Rectangle,\n  start: Point.Point,\n  current: Point.Point,\n  anchor: BoundingBox2dAnchorPosition,\n  maintainAspectRatio?: boolean\n): Rectangle.Rectangle {\n  const delta = Point.subtract(current, start);\n  const { x: left, y: top, width: w, height: h } = bounds;\n  const right = left + w;\n  const bottom = top + h;\n  const topLeft = Point.create(left, top);\n  const bottomLeft = Point.create(left, bottom);\n  const topRight = Point.create(right, top);\n  const bottomRight = Point.create(right, bottom);\n  switch (anchor) {\n    case 'top-left':\n      return createRectangle(bottomRight, current, !!maintainAspectRatio);\n    case 'top':\n      return createRectangle(\n        bottomRight,\n        Point.create(left, current.y),\n        !!maintainAspectRatio\n      );\n    case 'top-right':\n      return createRectangle(bottomLeft, current, !!maintainAspectRatio);\n    case 'right':\n      return createRectangle(\n        bottomLeft,\n        Point.create(current.x, top),\n        !!maintainAspectRatio\n      );\n    case 'bottom-right':\n      return createRectangle(topLeft, current, !!maintainAspectRatio);\n    case 'bottom':\n      return createRectangle(\n        topLeft,\n        Point.create(right, current.y),\n        !!maintainAspectRatio\n      );\n    case 'bottom-left':\n      return createRectangle(topRight, current, !!maintainAspectRatio);\n    case 'left':\n      return createRectangle(\n        bottomRight,\n        Point.create(current.x, top),\n        !!maintainAspectRatio\n      );\n    case 'center':\n      return Rectangle.create(\n        bounds.x + delta.x,\n        bounds.y + delta.y,\n        bounds.width,\n        bounds.height\n      );\n  }\n}\n\nexport function isVertexViewerMarkupElement(\n  el: HTMLElement\n): el is\n  | HTMLVertexViewerMarkupArrowElement\n  | HTMLVertexViewerMarkupCircleElement\n  | HTMLVertexViewerMarkupFreeformElement {\n  return (\n    isVertexViewerArrowMarkup(el) ||\n    isVertexViewerCircleMarkup(el) ||\n    isVertexViewerFreeformMarkup(el)\n  );\n}\n\nexport function isValidPointData(...points: Point.Point[]): boolean {\n  return points.every((pt) => !isNaN(pt.x) && !isNaN(pt.y));\n}\n\nexport function isValidStartEvent(event: PointerEvent): boolean {\n  const el = event.target as HTMLElement;\n\n  return isVertexViewerMarkupElement(el) && el.mode !== 'edit';\n}\n\nfunction getScaleFactor(dimensions: Dimensions.Dimensions): number {\n  // We intentionally use the content's height when scaling to maintain a consistent coordinate\n  // space for markup. This is to ensure the markup will be displayed in the same position\n  // on the canvas regardless of the aspect ratio at the time the markup was created.\n  // See https://github.com/Vertexvis/vertex-web-sdk/pull/429 for more details.\n  return dimensions.height;\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\n\nexport interface RelativeAnchorProps {\n  id?: string;\n  transform?: string;\n  rotation?: number;\n  name: string;\n  point: Point.Point;\n  onPointerDown?: (event: PointerEvent) => void;\n}\n\nexport const RelativeAnchor: FunctionalComponent<RelativeAnchorProps> = (\n  { id, transform, rotation, name, point, onPointerDown },\n  children\n) => {\n  return (\n    <div\n      id={id}\n      class=\"bounds-anchor-position\"\n      style={{\n        top: `${point.y}px`,\n        left: `${point.x}px`,\n      }}\n      onTouchStart={(event) => event.preventDefault()}\n      onPointerDown={onPointerDown}\n    >\n      <div style={{ transform }}>\n        <div\n          class=\"bounds-anchor\"\n          style={{\n            transform: `rotateZ(${rotation ?? 0}deg)`,\n          }}\n        >\n          <slot name={name}>{children}</slot>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport interface SvgShadowProps {\n  id: string;\n}\n\nexport const SvgShadow: FunctionalComponent<SvgShadowProps> = ({ id }) => {\n  return (\n    <filter id={id}>\n      <feGaussianBlur in=\"SourceAlpha\" stdDeviation=\"2\" />\n      <feOffset dx=\"0\" dy=\"1\" result=\"offsetblur\" />\n      <feFlood flood-color=\"#000000\" flood-opacity=\"0.25\" />\n      <feComposite in2=\"offsetblur\" operator=\"in\" />\n      <feMerge>\n        <feMergeNode />\n        <feMergeNode in=\"SourceGraphic\" />\n      </feMerge>\n    </filter>\n  );\n};\n","import type { InteractionApi, InteractionHandler } from '../interactions';\n\nexport abstract class MarkupInteractionHandler implements InteractionHandler {\n  protected element?: HTMLElement;\n  protected elementBounds?: DOMRect;\n  protected api?: InteractionApi;\n\n  private resizeObserver: ResizeObserver;\n\n  public constructor() {\n    this.resizeObserver = new ResizeObserver(([entry]) => {\n      this.elementBounds = this.computeBoundingRect();\n    });\n  }\n\n  public initialize(element: HTMLElement, api: InteractionApi): void {\n    this.element = element;\n    this.api = api;\n\n    this.elementBounds = this.computeBoundingRect();\n    this.resizeObserver.observe(this.element);\n\n    this.element.addEventListener('pointerdown', this.handlePointerDown);\n  }\n\n  public dispose(): void {\n    this.resizeObserver.disconnect();\n    this.element?.removeEventListener('pointerdown', this.handlePointerDown);\n\n    this.element = undefined;\n    this.api = undefined;\n  }\n\n  protected acceptInteraction(): void {\n    window.addEventListener('pointermove', this.handlePointerMove);\n    window.addEventListener('pointerup', this.handlePointerUp);\n  }\n\n  private handlePointerDown = (event: PointerEvent): void => {\n    this.handleInteractionAttempt(event);\n  };\n\n  private handlePointerMove = (event: PointerEvent): void => {\n    this.handleInteractionMove(event);\n  };\n\n  private handlePointerUp = (event: PointerEvent): void => {\n    window.removeEventListener('pointermove', this.handlePointerMove);\n    window.removeEventListener('pointerup', this.handlePointerUp);\n\n    this.handleInteractionEnd(event);\n  };\n\n  protected abstract computeBoundingRect(): DOMRect;\n\n  protected abstract handleInteractionAttempt(event: PointerEvent): void;\n\n  protected abstract handleInteractionMove(event: PointerEvent): void;\n\n  protected abstract handleInteractionEnd(event: PointerEvent): void;\n}\n"],"mappings":"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","ignoreList":[]}

package/dist/viewer/p-52cbea01.entry.js

@@ -1,5 +0,0 @@
-/*!
- * Copyright (c) 2026 Vertex Software LLC. All rights reserved.
- */
-import{h as t,r as o,c as e,H as r,a as i}from"./p-EpnuuCxl.js";import{g as n,b as s}from"./p-p0obU98x.js";import{w as h}from"./p-GU8pShT_.js";import{g as a}from"./p-Bg-uS9BH.js";import{p as d,e as c,g as l,a as u}from"./p-DfdVaPrt.js";import{i as p,a as w,b as v,p as b,c as f,d as m,e as g,f as k,g as x,h as P,j as D}from"./p-CR7q8bhh.js";import{c as y}from"./p-Dw4-tG-V.js";import"./p-CG9AChtV.js";function A(t,o){switch(o){case"top-left":return d.create(t.x,t.y);case"top":return d.create(t.x+t.width/2,t.y);case"top-right":return d.create(t.x+t.width,t.y);case"right":return d.create(t.x+t.width,t.y+t.height/2);case"bottom-right":return d.create(t.x+t.width,t.y+t.height);case"bottom":return d.create(t.x+t.width/2,t.y+t.height);case"bottom-left":return d.create(t.x,t.y+t.height);case"left":return d.create(t.x,t.y+t.height/2);case"center":return l.center(t)}}function C(t,o,e=o,r="none",i=1){const n=Math.min(o.width/e.width,o.height/e.height);const s=n*i;const h=V(e);const a=d.add(d.scale(t,h,h),c.center(e));const l=e.width*s;const u=e.height*s;const p=r==="both"||r==="x-only"?Math.max(0,(o.width-l)/2):0;const w=r==="both"||r==="y-only"?Math.max(0,(o.height-u)/2):0;return d.create(a.x*s+p,a.y*s+w)}function M(t,o,e=o,r=1){const i=Math.min(o.width/e.width,o.height/e.height);const n=i*r;const s=V(e);const h=c.scale(s,s,t);return c.scale(n,n,h)}function S(t,o,e,r="none",i=1){const n=C(t,o,e,r,i);const s=M(t,o,e,i);return l.fromPointAndDimensions(n,s)}function $(t,o){const e=1/V(o);const r=d.scale(d.subtract(t,c.center(o)),e,e);return r}function R(t,o,e){return t.map((t=>d.add(d.scale(d.subtract(t,o),e.width/(o.width||1),e.height/(o.height||1)),e)))}function B(t,o,e){const r=l.fromPoints(t,o);if(e){const e=Math.max(r.width,r.height);const i=r.height>r.width;const n=o.x<=t.x;const s=o.y<=t.y;const h=n?i?t.x-e:o.x:t.x;const a=s?i?o.y:t.y-e:t.y;return l.create(h,a,e,e)}else{return r}}function T(t,o,e,r,i){const n=d.subtract(e,o);const{x:s,y:h,width:a,height:c}=t;const u=s+a;const p=h+c;const w=d.create(s,h);const v=d.create(s,p);const b=d.create(u,h);const f=d.create(u,p);switch(r){case"top-left":return B(f,e,!!i);case"top":return B(f,d.create(s,e.y),!!i);case"top-right":return B(v,e,!!i);case"right":return B(v,d.create(e.x,h),!!i);case"bottom-right":return B(w,e,!!i);case"bottom":return B(w,d.create(u,e.y),!!i);case"bottom-left":return B(b,e,!!i);case"left":return B(f,d.create(e.x,h),!!i);case"center":return l.create(t.x+n.x,t.y+n.y,t.width,t.height)}}function L(t){return p(t)||w(t)||v(t)}function E(...t){return t.every((t=>!isNaN(t.x)&&!isNaN(t.y)))}function I(t){const o=t.target;return L(o)&&o.mode!=="edit"}function V(t){return t.height}const j=({id:o,transform:e,rotation:r,name:i,point:n,onPointerDown:s},h)=>t("div",{id:o,class:"bounds-anchor-position",style:{top:`${n.y}px`,left:`${n.x}px`},onTouchStart:t=>t.preventDefault(),onPointerDown:s},t("div",{style:{transform:e}},t("div",{class:"bounds-anchor",style:{transform:`rotateZ(${r!==null&&r!==void 0?r:0}deg)`}},t("slot",{name:i},h))));const F=({id:o})=>t("filter",{id:o},t("feGaussianBlur",{in:"SourceAlpha",stdDeviation:"2"}),t("feOffset",{dx:"0",dy:"1",result:"offsetblur"}),t("feFlood",{"flood-color":"#000000","flood-opacity":"0.25"}),t("feComposite",{in2:"offsetblur",operator:"in"}),t("feMerge",null,t("feMergeNode",null),t("feMergeNode",{in:"SourceGraphic"})));class _{constructor(){this.handlePointerDown=t=>{this.handleInteractionAttempt(t)};this.handlePointerMove=t=>{this.handleInteractionMove(t)};this.handlePointerUp=t=>{window.removeEventListener("pointermove",this.handlePointerMove);window.removeEventListener("pointerup",this.handlePointerUp);this.handleInteractionEnd(t)};this.resizeObserver=new ResizeObserver((([t])=>{this.elementBounds=this.computeBoundingRect()}))}initialize(t,o){this.element=t;this.api=o;this.elementBounds=this.computeBoundingRect();this.resizeObserver.observe(this.element);this.element.addEventListener("pointerdown",this.handlePointerDown)}dispose(){var t;this.resizeObserver.disconnect();(t=this.element)===null||t===void 0?void 0:t.removeEventListener("pointerdown",this.handlePointerDown);this.element=undefined;this.api=undefined}acceptInteraction(){window.addEventListener("pointermove",this.handlePointerMove);window.addEventListener("pointerup",this.handlePointerUp)}}class z extends _{constructor(t,o,e){super();this.markupEl=t;this.interactionBegin=o;this.interactionEnd=e;this.anchor="end"}editAnchor(t,o){if(this.markupEl.mode==="edit"){this.anchor=t;this.startInteraction(o)}}startInteraction(t){this.handleInteractionAttempt(t)}computeBoundingRect(){return a(this.markupEl)}handleInteractionAttempt(t){var o;if(this.markupEl.mode!==""&&this.pointerId==null&&this.elementBounds!=null){this.pointerId=t.pointerId;this.markupEl.start=(o=this.markupEl.start)!==null&&o!==void 0?o:$(n(t,this.elementBounds),this.elementBounds);this.interactionBegin.emit();this.acceptInteraction()}}handleInteractionMove(t){if(this.elementBounds!=null&&this.pointerId===t.pointerId){const o=$(n(t,this.elementBounds),this.elementBounds);if(this.anchor==="start"){this.markupEl.start=o}else if(this.anchor==="end"){this.markupEl.end=o}else if(this.markupEl.start!=null&&this.markupEl.end!=null){const t=d.create((this.markupEl.start.x+this.markupEl.end.x)/2,(this.markupEl.start.y+this.markupEl.end.y)/2);const e=t.x-o.x;const r=t.y-o.y;this.markupEl.start=d.create(this.markupEl.start.x-e,this.markupEl.start.y-r);this.markupEl.end=d.create(this.markupEl.end.x-e,this.markupEl.end.y-r)}}}handleInteractionEnd(t){if(this.pointerId===t.pointerId){const t=this.markupEl.start!=null&&this.elementBounds!=null?C(this.markupEl.start,this.elementBounds):undefined;const o=this.markupEl.end!=null&&this.elementBounds!=null?C(this.markupEl.end,this.elementBounds):undefined;if(this.markupEl.mode!==""&&t!=null&&o!=null&&d.distance(t,o)>=2){const t=this.markupEl.mode!=="edit";this.interactionEnd.emit({markup:this.markupEl,newlyCreatedMarkup:t})}else{this.markupEl.start=undefined;this.markupEl.end=undefined}this.pointerId=undefined}}}const J=({start:o,end:e,offset:r,onStartAnchorPointerDown:i,onCenterAnchorPointerDown:n,onEndAnchorPointerDown:s})=>{const h=u.normalize(u.toDegrees(u.fromPoints(o,e))-270);const a=d.create((o.x+e.x)/2,(o.y+e.y)/2);const c=r!=null?`translate(${r.x}px, ${r.y}px)`:undefined;return t("div",{class:"bounds-container"},t(j,{transform:c,id:"bounding-box-1d-start-anchor",name:"start-anchor",rotation:h,point:o,onPointerDown:i},t("div",{class:y("bounds-default-anchor","bounds-cap-anchor")})),t(j,{transform:c,id:"bounding-box-1d-end-anchor",name:"end-anchor",rotation:h,point:e,onPointerDown:s},t("div",{class:y("bounds-default-anchor","bounds-cap-anchor")})),t(j,{transform:c,id:"bounding-box-1d-center-anchor",name:"center-anchor",point:a,onPointerDown:n},t("div",{class:y("bounds-default-anchor","bounds-center-anchor")})))};const N=()=>`:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;--viewer-markup-arrow-line-stroke-color:var(--red-800);--viewer-markup-arrow-line-stroke-width:4px;--viewer-markup-arrow-head-stroke-color:var(--red-800);--viewer-markup-arrow-head-stroke-width:4px;--viewer-markup-arrow-head-fill-color:var(--red-800);--viewer-markup-arrow-head-fill-opacity:1;--viewer-markup-arrow-bounds-cap-border-color:var(--blue-400);--viewer-markup-arrow-bounds-cap-border-width:1px;--viewer-markup-arrow-bounds-cap-background-color:white;--viewer-markup-arrow-bounds-center-anchor-border-color:white;--viewer-markup-arrow-bounds-center-anchor-border-width:1px;--viewer-markup-arrow-bounds-center-anchor-background-color:var(--blue-400);--viewer-markup-arrow-bounds-outline-width:1px;--viewer-markup-arrow-bounds-outline-color:var(--blue-400);--viewer-markup-arrow-bounds-anchor-width:9px;--viewer-markup-arrow-bounds-anchor-height:9px;--viewer-markup-arrow-scale:1}.svg{pointer-events:none;width:100%;height:100%}.create-overlay{pointer-events:auto;position:absolute;left:0;top:0;width:100%;height:100%;cursor:crosshair}.line{pointer-events:auto;stroke:var(--viewer-markup-arrow-line-stroke-color);stroke-width:calc(     var(--viewer-markup-arrow-line-stroke-width) *       var(--viewer-markup-arrow-scale)   );cursor:default}.head{pointer-events:auto;stroke:var(--viewer-markup-arrow-head-stroke-color);stroke-width:calc(     var(--viewer-markup-arrow-head-stroke-width) *       var(--viewer-markup-arrow-scale)   );fill:var(--viewer-markup-arrow-head-fill-color);fill-opacity:var(--viewer-markup-arrow-head-fill-opacity);cursor:default}.bounds-line{pointer-events:auto;stroke:var(--viewer-markup-arrow-bounds-outline-color);stroke-width:var(--viewer-markup-arrow-bounds-outline-width)}.bounds-container{pointer-events:none;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden}.bounds-anchor-position{position:absolute;transform:translate(-50%, -50%)}.bounds-anchor{pointer-events:auto;cursor:default;user-select:none}.bounds-default-anchor{width:var(--viewer-markup-arrow-bounds-anchor-width);height:var(--viewer-markup-arrow-bounds-anchor-height);box-sizing:border-box;box-shadow:0 0 2px rgba(0, 0, 0, 0.3)}.bounds-center-anchor{border-radius:100%;border-width:var(--viewer-markup-arrow-bounds-center-anchor-border-width);border-color:var(--viewer-markup-arrow-bounds-center-anchor-border-color);border-style:solid;background-color:var(     --viewer-markup-arrow-bounds-center-anchor-background-color   )}.bounds-cap-anchor{border-width:var(--viewer-markup-arrow-bounds-cap-border-width);border-color:var(--viewer-markup-arrow-bounds-cap-border-color);border-style:solid;background-color:var(--viewer-markup-arrow-bounds-cap-background-color)}`;const G=class{constructor(t){o(this,t);this.interactionBegin=e(this,"interactionBegin");this.interactionEnd=e(this,"interactionEnd");this.viewRendered=e(this,"viewRendered");this.centeringBehavior="none";this.scale=1;this.startLineAnchorStyle="none";this.endLineAnchorStyle="arrow-triangle";this.mode="";this.interactionHandler=new z(this.hostEl,this.interactionBegin,this.interactionEnd);this.handleWindowPointerDown=t=>{if(I(t)){this.interactionHandler.startInteraction(t)}};this.handleTouchStart=t=>{t.preventDefault()}}componentWillLoad(){this.updateViewport();this.handleViewerChanged(this.viewer);this.updatePointsFromProps()}componentDidLoad(){this.updatePointsFromProps();const t=new ResizeObserver((()=>this.updateViewport()));t.observe(this.hostEl);if(this.mode==="create"){window.addEventListener("pointerdown",this.handleWindowPointerDown)}}componentDidRender(){if(this.mode===""){this.viewRendered.emit()}}disconnectedCallback(){this.dispose()}async dispose(){var t;(t=this.registeredInteraction)===null||t===void 0?void 0:t.dispose();this.registeredInteraction=undefined;window.removeEventListener("pointerdown",this.handleWindowPointerDown)}async handleViewerChanged(t){var o;(o=this.registeredInteraction)===null||o===void 0?void 0:o.dispose();this.registeredInteraction=undefined;if(t!=null){this.registeredInteraction=await t.registerInteractionHandler(this.interactionHandler)}}handleStartJsonChange(){this.updatePointsFromProps()}handleEndJsonChange(){this.updatePointsFromProps()}handleModeChange(){if(this.mode!=="create"){window.removeEventListener("pointerdown",this.handleWindowPointerDown)}}handleScaleChange(){h((()=>{var t,o;this.hostEl.style.setProperty("--viewer-markup-arrow-scale",(o=(t=this.scale)===null||t===void 0?void 0:t.toString())!==null&&o!==void 0?o:"1")}))}updateViewport(){const t=a(this.hostEl);this.elementBounds=t}updatePointsFromProps(){this.start=this.start||b(this.startJson);this.end=this.end||b(this.endJson)}renderLineAnchorStyle(o,e){if(o==="arrow-triangle"){return t("polygon",{id:"line-anchor-arrow-triangle",class:"head",points:f(e,this.scale)})}else if(o==="arrow-line"){return t("path",{id:"line-anchor-arrow-line",class:"head",d:m(e,this.scale)})}else if(o==="hash"){const o=g(e,this.scale);return t("line",{id:"line-anchor-hash",class:"head",...o})}else if(o==="dot"){const o=k(e,this.scale);return t("circle",{id:"line-anchor-circle",class:"head",...o})}else{return t("div",null)}}render(){var o,e,i,n;if(this.start!=null&&this.end!=null&&this.elementBounds!=null){const h=this.elementBounds;const a=((e=(o=this.offset)===null||o===void 0?void 0:o.x)!==null&&e!==void 0?e:0)/s();const d=((n=(i=this.offset)===null||i===void 0?void 0:i.y)!==null&&n!==void 0?n:0)/s();const c=C(this.start,h,this.originatingViewport,this.centeringBehavior,this.scale);const l=C(this.end,h,this.originatingViewport,this.centeringBehavior,this.scale);if(E(c,l)){const o=x(l,c);const e=x(c,l);return t(r,null,t("svg",{class:"svg",onTouchStart:this.handleTouchStart},t("defs",null,t(F,{id:"arrow-shadow"})),t("g",{transform:`translate(${a} ${d})`,filter:"url(#arrow-shadow)"},this.renderLineAnchorStyle(this.startLineAnchorStyle,o),t("line",{id:"arrow-line",class:"line",x1:e.tip.x,y1:e.tip.y,x2:o.tip.x,y2:o.tip.y}),this.renderLineAnchorStyle(this.endLineAnchorStyle,e)),this.mode==="edit"&&t("g",{transform:`translate(${a} ${d})`},t("line",{id:"bounding-box-1d-line",class:"bounds-line",x1:c.x,y1:c.y,x2:l.x,y2:l.y}))),this.mode==="edit"&&t(J,{start:c,end:l,offset:{x:a,y:d},onStartAnchorPointerDown:t=>this.interactionHandler.editAnchor("start",t),onCenterAnchorPointerDown:t=>this.interactionHandler.editAnchor("center",t),onEndAnchorPointerDown:t=>this.interactionHandler.editAnchor("end",t)}),this.mode==="create"&&t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}else{return t(r,null)}}else{return t(r,null,t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}}get hostEl(){return i(this)}static get watchers(){return{viewer:[{handleViewerChanged:0}],start:[{handleStartJsonChange:0}],end:[{handleEndJsonChange:0}],mode:[{handleModeChange:0}],scale:[{handleScaleChange:0}]}}};G.style=N();class O extends _{constructor(t,o,e){super();this.markupEl=t;this.interactionBegin=o;this.interactionEnd=e;this.anchor="bottom-right"}editAnchor(t,o){if(this.markupEl.mode==="edit"){this.anchor=t;this.resizeBounds=this.markupEl.bounds;this.startInteraction(o)}}startInteraction(t){this.handleInteractionAttempt(t)}computeBoundingRect(){return a(this.markupEl)}handleInteractionAttempt(t){var o;if(this.markupEl.mode!==""&&this.pointerId==null&&this.elementBounds!=null){const e=$(n(t,this.elementBounds),this.elementBounds);this.pointerId=t.pointerId;this.startPosition=e;this.markupEl.bounds=(o=this.markupEl.bounds)!==null&&o!==void 0?o:l.create(e.x,e.y,0,0);this.resizeBounds=this.markupEl.bounds;this.interactionBegin.emit();this.acceptInteraction()}}handleInteractionMove(t){var o;if(this.markupEl.bounds!=null&&this.startPosition!=null&&this.elementBounds!=null&&this.pointerId===t.pointerId){const e=$(n(t,this.elementBounds),this.elementBounds);this.markupEl.bounds=T((o=this.resizeBounds)!==null&&o!==void 0?o:this.markupEl.bounds,this.startPosition,e,this.anchor,t.shiftKey)}}handleInteractionEnd(t){var o,e;if(this.pointerId===t.pointerId){if(this.markupEl.mode!==""&&this.markupEl.bounds!=null&&((o=this.markupEl.bounds)===null||o===void 0?void 0:o.width)>0&&((e=this.markupEl.bounds)===null||e===void 0?void 0:e.height)>0){this.anchor="bottom-right";const t=this.markupEl.mode!=="edit";this.interactionEnd.emit({markup:this.markupEl,newlyCreatedMarkup:t})}else{this.markupEl.bounds=undefined}this.pointerId=undefined}}}const W=({bounds:o,offset:e,onTopLeftAnchorPointerDown:r,onLeftAnchorPointerDown:i,onTopRightAnchorPointerDown:n,onRightAnchorPointerDown:s,onBottomLeftAnchorPointerDown:h,onBottomAnchorPointerDown:a,onBottomRightAnchorPointerDown:d,onTopAnchorPointerDown:c,onCenterAnchorPointerDown:u})=>{const p=l.pad(o,6);const w=l.center(p);const v=e!=null?`translate(${e.x}px, ${e.y}px)`:undefined;return t("div",{class:"bounds-container"},t("div",{class:"bounds-outline",style:{top:`${p.y}px`,left:`${p.x}px`,width:`${p.width}px`,height:`${p.height}px`,transform:v}}),t(j,{transform:v,id:"bounding-box-2d-top-left-anchor",name:"top-left-anchor",point:A(p,"top-left"),onPointerDown:r},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-left-anchor",name:"left-anchor",point:A(p,"left"),onPointerDown:i},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-top-right-anchor",name:"top-right-anchor",point:A(p,"top-right"),onPointerDown:n},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-right-anchor",name:"right-anchor",point:A(p,"right"),onPointerDown:s},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-bottom-left-anchor",name:"bottom-left-anchor",point:A(p,"bottom-left"),onPointerDown:h},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-bottom-anchor",name:"bottom-anchor",point:A(p,"bottom"),onPointerDown:a},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-bottom-right-anchor",name:"bottom-right-anchor",point:A(p,"bottom-right"),onPointerDown:d},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-top-anchor",name:"top-anchor",point:A(p,"top"),onPointerDown:c},t("div",{class:y("bounds-default-anchor","bounds-edge-anchor")})),t(j,{transform:v,id:"bounding-box-2d-center-anchor",name:"center-anchor",point:w,onPointerDown:u},t("div",{class:y("bounds-default-anchor","bounds-center-anchor")})))};const H=()=>`:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;--viewer-markup-circle-ellipse-stroke-color:var(--red-700);--viewer-markup-circle-ellipse-stroke-width:4px;--viewer-markup-circle-ellipse-fill-color:none;--viewer-markup-circle-ellipse-fill-opacity:0;--viewer-markup-circle-bounds-outline-border-color:var(--blue-400);--viewer-markup-circle-bounds-outline-border-width:1px;--viewer-markup-circle-bounds-edge-anchor-border-color:var(--blue-400);--viewer-markup-circle-bounds-edge-anchor-border-width:1px;--viewer-markup-circle-bounds-edge-anchor-background-color:white;--viewer-markup-circle-bounds-center-anchor-border-color:white;--viewer-markup-circle-bounds-center-anchor-border-width:1px;--viewer-markup-circle-bounds-center-anchor-background-color:var(--blue-400);--viewer-markup-circle-bounds-anchor-width:9px;--viewer-markup-circle-bounds-anchor-height:9px;--viewer-markup-circle-scale:1}.svg{pointer-events:none;width:100%;height:100%}.create-overlay{pointer-events:auto;position:absolute;left:0;top:0;width:100%;height:100%;cursor:crosshair}.ellipse{pointer-events:auto;stroke:var(--viewer-markup-circle-ellipse-stroke-color);stroke-width:calc(     var(--viewer-markup-circle-ellipse-stroke-width) *       var(--viewer-markup-circle-scale)   );fill:var(--viewer-markup-circle-ellipse-fill-color);fill-opacity:var(--viewer-markup-circle-ellipse-fill-opacity);cursor:default}.bounds-container{pointer-events:none;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden}.bounds-outline{position:absolute;border-width:var(--viewer-markup-circle-bounds-outline-border-width);border-color:var(--viewer-markup-circle-bounds-outline-border-color);border-style:solid;box-shadow:0 0 3px rgba(0, 0, 0, 0.3)}.bounds-anchor-position{position:absolute;transform:translate(-50%, -50%)}.bounds-anchor{pointer-events:auto;cursor:default;user-select:none}.bounds-default-anchor{width:var(--viewer-markup-circle-bounds-anchor-width);height:var(--viewer-markup-circle-bounds-anchor-height);box-sizing:border-box;box-shadow:0 0 2px rgba(0, 0, 0, 0.3)}.bounds-center-anchor{border-radius:100%;border-width:var(--viewer-markup-circle-bounds-center-anchor-border-width);border-color:var(--viewer-markup-circle-bounds-center-anchor-border-color);border-style:solid;background-color:var(     --viewer-markup-circle-bounds-center-anchor-background-color   )}.bounds-edge-anchor{border-width:var(--viewer-markup-circle-bounds-edge-anchor-border-width);border-color:var(--viewer-markup-circle-bounds-edge-anchor-border-color);border-style:solid;background-color:var(     --viewer-markup-circle-bounds-edge-anchor-background-color   )}`;const U=class{constructor(t){o(this,t);this.interactionBegin=e(this,"interactionBegin");this.interactionEnd=e(this,"interactionEnd");this.viewRendered=e(this,"viewRendered");this.mode="";this.centeringBehavior="none";this.scale=1;this.interactionHandler=new O(this.hostEl,this.interactionBegin,this.interactionEnd);this.handleWindowPointerDown=t=>{if(I(t)){this.interactionHandler.startInteraction(t)}};this.handleTouchStart=t=>{t.preventDefault()}}componentWillLoad(){this.updateViewport();this.handleViewerChanged(this.viewer);this.updateBoundsFromProps()}componentDidLoad(){this.updateBoundsFromProps();const t=new ResizeObserver((()=>this.updateViewport()));t.observe(this.hostEl);if(this.mode==="create"){window.addEventListener("pointerdown",this.handleWindowPointerDown)}}componentDidRender(){if(this.mode===""){this.viewRendered.emit()}}disconnectedCallback(){this.dispose()}async dispose(){var t;(t=this.registeredHandler)===null||t===void 0?void 0:t.dispose();this.registeredHandler=undefined;window.removeEventListener("pointerdown",this.handleWindowPointerDown)}async handleViewerChanged(t){var o;(o=this.registeredHandler)===null||o===void 0?void 0:o.dispose();this.registeredHandler=undefined;if(t!=null){this.registeredHandler=await t.registerInteractionHandler(this.interactionHandler)}}handleBoundsJsonChange(){this.updateBoundsFromProps()}handleModeChange(){if(this.mode!=="create"){window.removeEventListener("pointerdown",this.handleWindowPointerDown)}}handleScaleChange(){h((()=>{this.hostEl.style.setProperty("--viewer-markup-circle-scale",this.scale.toString())}))}updateViewport(){const t=a(this.hostEl);this.elementBounds=t}updateBoundsFromProps(){var t;this.bounds=(t=this.bounds)!==null&&t!==void 0?t:P(this.boundsJson)}render(){var o,e,i,n;if(this.bounds!=null&&this.elementBounds!=null){const h=S(this.bounds,this.elementBounds,this.originatingViewport,this.centeringBehavior,this.scale);const a=l.center(h);const d=((e=(o=this.offset)===null||o===void 0?void 0:o.x)!==null&&e!==void 0?e:0)/s();const c=((n=(i=this.offset)===null||i===void 0?void 0:i.y)!==null&&n!==void 0?n:0)/s();return t(r,null,t("svg",{class:"svg",onTouchStart:this.handleTouchStart},t("defs",null,t(F,{id:"circle-shadow"})),t("g",{transform:`translate(${d} ${c})`,filter:"url(#circle-shadow)"},t("ellipse",{class:"ellipse",cx:a.x,cy:a.y,rx:h.width/2,ry:h.height/2,stroke:"#000ff0","stroke-width":4,fill:"none"}))),this.mode==="edit"&&t(W,{bounds:h,offset:{x:d,y:c},onTopLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("top-left",t),onTopRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("top-right",t),onTopAnchorPointerDown:t=>this.interactionHandler.editAnchor("top",t),onBottomLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom-left",t),onBottomRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom-right",t),onBottomAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom",t),onLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("left",t),onRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("right",t),onCenterAnchorPointerDown:t=>this.interactionHandler.editAnchor("center",t)}),this.mode==="create"&&t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}else{return t(r,null,t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}}get hostEl(){return i(this)}static get watchers(){return{viewer:[{handleViewerChanged:0}],bounds:[{handleBoundsJsonChange:0}],mode:[{handleModeChange:0}],scale:[{handleScaleChange:0}]}}};U.style=H();class q extends _{constructor(t,o,e){super();this.markupEl=t;this.interactionBegin=o;this.interactionEnd=e;this.anchor="bottom-right";this.handleResizeInteractionMove=t=>{if(this.resizeStartPosition!=null&&this.elementBounds!=null&&this.resizeBounds!=null&&this.resizePoints!=null){const o=$(n(t,this.elementBounds),this.elementBounds);const e=T(this.resizeBounds,this.resizeStartPosition,o,this.anchor,t.shiftKey);this.markupEl.points=R(this.resizePoints,this.resizeBounds,e);this.markupEl.bounds=e}};this.handleResizeInteractionEnd=t=>{window.removeEventListener("pointermove",this.handleResizeInteractionMove);window.removeEventListener("pointerup",this.handleResizeInteractionEnd);this.resizeBounds=undefined;const o=this.markupEl.mode!=="edit";this.interactionEnd.emit({markup:this.markupEl,newlyCreatedMarkup:o})}}editAnchor(t,o){if(this.markupEl.mode==="edit"&&this.elementBounds!=null){this.resizeBounds=this.markupEl.bounds;this.resizePoints=this.markupEl.points;this.anchor=t;this.resizeStartPosition=$(n(o,this.elementBounds),this.elementBounds);window.addEventListener("pointermove",this.handleResizeInteractionMove);window.addEventListener("pointerup",this.handleResizeInteractionEnd)}}startInteraction(t){this.handleInteractionAttempt(t)}computeBoundingRect(){return a(this.markupEl)}handleInteractionAttempt(t){var o;if(this.markupEl.mode!==""&&this.pointerId==null&&this.elementBounds!=null){this.pointerId=t.pointerId;const e=n(t,this.elementBounds);const r=$(e,this.elementBounds);this.updateMinAndMax(r);this.markupEl.points=(o=this.markupEl.points)!==null&&o!==void 0?o:[r];this.interactionBegin.emit();this.acceptInteraction()}}handleInteractionMove(t){if(this.pointerId===t.pointerId&&this.markupEl.points!=null&&this.elementBounds!=null){const o=n(t,this.elementBounds);const e=$(o,this.elementBounds);this.updateMinAndMax(e);this.markupEl.points=[...this.markupEl.points,e]}}handleInteractionEnd(t){if(this.pointerId===t.pointerId){if(this.markupEl.mode!==""&&this.markupEl.points!=null&&this.markupEl.points.length>2&&this.elementBounds!=null){const o=n(t,this.elementBounds);const e=$(o,this.elementBounds);this.updateMinAndMax(e);this.markupEl.points=[...this.markupEl.points,e];const r=this.markupEl.mode!=="edit";this.interactionEnd.emit({markup:this.markupEl,newlyCreatedMarkup:r})}else{this.markupEl.points=undefined}this.min=undefined;this.max=undefined;this.pointerId=undefined}}updateMinAndMax(t){this.min=this.min!=null?d.create(Math.min(this.min.x,t.x),Math.min(this.min.y,t.y)):t;this.max=this.max!=null?d.create(Math.max(this.max.x,t.x),Math.max(this.max.y,t.y)):t;this.markupEl.bounds=l.create(this.min.x,this.min.y,this.max.x-this.min.x,this.max.y-this.min.y)}}const Z=()=>`:host{position:absolute;top:0;left:0;width:100%;height:100%;pointer-events:none;--viewer-markup-freeform-stroke-color:var(--red-800);--viewer-markup-freeform-stroke-width:4px;--viewer-markup-freeform-line-join:round;--viewer-markup-freeform-line-cap:round;--viewer-markup-freeform-bounds-outline-border-color:var(--blue-400);--viewer-markup-freeform-bounds-outline-border-width:1px;--viewer-markup-freeform-bounds-edge-anchor-border-color:var(--blue-400);--viewer-markup-freeform-bounds-edge-anchor-border-width:1px;--viewer-markup-freeform-bounds-edge-anchor-background-color:white;--viewer-markup-freeform-bounds-center-anchor-border-color:white;--viewer-markup-freeform-bounds-center-anchor-border-width:1px;--viewer-markup-freeform-bounds-center-anchor-background-color:var(     --blue-400   );--viewer-markup-freeform-bounds-anchor-width:9px;--viewer-markup-freeform-bounds-anchor-height:9px;--viewer-markup-freeform-scale:1}.svg{pointer-events:none;width:100%;height:100%;position:absolute;top:0;left:0}.path{pointer-events:auto;cursor:default;stroke:var(--viewer-markup-freeform-stroke-color);stroke-width:calc(     var(--viewer-markup-freeform-stroke-width) *       var(--viewer-markup-freeform-scale)   );stroke-linejoin:var(--viewer-markup-freeform-line-join);stroke-linecap:var(--viewer-markup-freeform-line-cap)}.create-overlay{pointer-events:auto;position:absolute;left:0;top:0;width:100%;height:100%;cursor:crosshair}.bounds-container{pointer-events:none;position:absolute;width:100%;height:100%;top:0;left:0;overflow:hidden}.bounds-outline{position:absolute;border-width:var(--viewer-markup-freeform-bounds-outline-border-width);border-color:var(--viewer-markup-freeform-bounds-outline-border-color);border-style:solid;box-shadow:0 0 3px rgba(0, 0, 0, 0.3)}.bounds-anchor-position{position:absolute;transform:translate(-50%, -50%)}.bounds-anchor{pointer-events:auto;cursor:default;user-select:none}.bounds-default-anchor{width:var(--viewer-markup-freeform-bounds-anchor-width);height:var(--viewer-markup-freeform-bounds-anchor-height);box-sizing:border-box;box-shadow:0 0 2px rgba(0, 0, 0, 0.3)}.bounds-center-anchor{border-radius:100%;border-width:var(--viewer-markup-freeform-bounds-center-anchor-border-width);border-color:var(--viewer-markup-freeform-bounds-center-anchor-border-color);border-style:solid;background-color:var(     --viewer-markup-freeform-bounds-center-anchor-background-color   )}.bounds-edge-anchor{border-width:var(--viewer-markup-freeform-bounds-edge-anchor-border-width);border-color:var(--viewer-markup-freeform-bounds-edge-anchor-border-color);border-style:solid;background-color:var(     --viewer-markup-freeform-bounds-edge-anchor-background-color   )}`;const K=class{constructor(t){o(this,t);this.interactionBegin=e(this,"interactionBegin");this.interactionEnd=e(this,"interactionEnd");this.viewRendered=e(this,"viewRendered");this.mode="";this.centeringBehavior="none";this.scale=1;this.screenPoints=[];this.interactionHandler=new q(this.hostEl,this.interactionBegin,this.interactionEnd);this.handleWindowPointerDown=t=>{if(I(t)){this.interactionHandler.startInteraction(t)}};this.handleTouchStart=t=>{t.preventDefault()}}componentWillLoad(){this.updateViewport();this.handleViewerChanged(this.viewer);this.updatePointsFromProps()}componentDidLoad(){const t=new ResizeObserver((()=>this.updateViewport()));t.observe(this.hostEl);if(this.mode==="create"){window.addEventListener("pointerdown",this.handleWindowPointerDown)}}componentDidRender(){if(this.mode===""){this.viewRendered.emit()}}disconnectedCallback(){this.dispose()}async dispose(){var t;(t=this.registeredInteraction)===null||t===void 0?void 0:t.dispose();this.registeredInteraction=undefined;window.removeEventListener("pointerdown",this.handleWindowPointerDown)}async handleViewerChanged(t){var o;(o=this.registeredInteraction)===null||o===void 0?void 0:o.dispose();this.registeredInteraction=undefined;if(t!=null){this.registeredInteraction=await t.registerInteractionHandler(this.interactionHandler)}}recomputePointsFromProps(){this.updatePointsFromProps()}handleScaleChange(){h((()=>{this.hostEl.style.setProperty("--viewer-markup-freeform-scale",this.scale.toString())}))}handleModeChange(){if(this.mode!=="create"){window.removeEventListener("pointerdown",this.handleWindowPointerDown)}}updateViewport(){var t;const o=a(this.hostEl);this.elementBounds=o;this.screenPoints=(t=this.convertPointsToScreen())!==null&&t!==void 0?t:this.screenPoints}updatePointsFromProps(){var t,o,e;this.points=(t=this.points)!==null&&t!==void 0?t:D(this.pointsJson);this.screenPoints=(o=this.convertPointsToScreen())!==null&&o!==void 0?o:[];this.bounds=(e=this.bounds)!==null&&e!==void 0?e:P(this.boundsJson)}render(){var o,e,i,n;if(this.screenPoints.length>0&&this.elementBounds!=null){const h=((e=(o=this.offset)===null||o===void 0?void 0:o.x)!==null&&e!==void 0?e:0)/s();const a=((n=(i=this.offset)===null||i===void 0?void 0:i.y)!==null&&n!==void 0?n:0)/s();return t(r,null,t("svg",{class:"svg",onTouchStart:this.handleTouchStart},t("defs",null,t(F,{id:"freeform-markup-shadow"})),t("g",{transform:`translate(${h} ${a})`,filter:"url(#freeform-markup-shadow)"},t("path",{class:"path",d:this.screenPoints.reduce(((t,o)=>`${t}L${o.x},${o.y}`),`M${this.screenPoints[0].x},${this.screenPoints[0].y}`),fill:"none"}))),this.mode==="edit"&&this.bounds!=null&&t(W,{bounds:S(this.bounds,this.elementBounds,this.originatingViewport,this.centeringBehavior,this.scale),offset:{x:h,y:a},onTopLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("top-left",t),onTopRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("top-right",t),onTopAnchorPointerDown:t=>this.interactionHandler.editAnchor("top",t),onBottomLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom-left",t),onBottomRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom-right",t),onBottomAnchorPointerDown:t=>this.interactionHandler.editAnchor("bottom",t),onLeftAnchorPointerDown:t=>this.interactionHandler.editAnchor("left",t),onRightAnchorPointerDown:t=>this.interactionHandler.editAnchor("right",t),onCenterAnchorPointerDown:t=>this.interactionHandler.editAnchor("center",t)}),this.mode==="create"&&t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}else{return t(r,null,t("div",{class:"create-overlay",onTouchStart:this.handleTouchStart}))}}convertPointsToScreen(){var t;const o=this.elementBounds;if(o!=null){return(t=this.points)===null||t===void 0?void 0:t.map((t=>C(t,o,this.originatingViewport,this.centeringBehavior,this.scale)))}}get hostEl(){return i(this)}static get watchers(){return{viewer:[{handleViewerChanged:0}],originatingViewport:[{recomputePointsFromProps:0}],offset:[{recomputePointsFromProps:0}],scale:[{recomputePointsFromProps:0},{handleScaleChange:0}],bounds:[{recomputePointsFromProps:0}],points:[{recomputePointsFromProps:0}],mode:[{handleModeChange:0}]}}};K.style=Z();export{G as vertex_viewer_markup_arrow,U as vertex_viewer_markup_circle,K as vertex_viewer_markup_freeform};
-//# sourceMappingURL=p-52cbea01.entry.js.map

package/dist/viewer/p-52cbea01.entry.js.map

@@ -1 +0,0 @@
-{"version":3,"names":["getBoundingBox2dAnchorPosition","rect","position","Point","create","x","y","width","height","Rectangle","center","translatePointToScreen","pt","canvasDimensions","contentDimensions","centeringBehavior","scale","canvasToContentScaleFactor","Math","min","effectiveScalar","contentScaleFactor","getScaleFactor","contentRelativePoint","add","Dimensions","scaledContentWidth","scaledContentHeight","centerOffsetX","max","centerOffsetY","translateDimensionsToScreen","dimensions","contentRelativeDimensions","translateRectToScreen","fromPointAndDimensions","translatePointToRelative","scaleFactor","point","subtract","translatePointsToBounds","points","original","bounds","map","createRectangle","initialPoint","currentPoint","maintainAspectRatio","fromPoints","fitBoundsSize","isPortrait","currentIsLeftOfInitial","currentIsAboveInitial","fitBoundsX","fitBoundsY","transformRectangle","start","current","anchor","delta","left","top","w","h","right","bottom","topLeft","bottomLeft","topRight","bottomRight","isVertexViewerMarkupElement","el","isVertexViewerArrowMarkup","isVertexViewerCircleMarkup","isVertexViewerFreeformMarkup","isValidPointData","every","isNaN","isValidStartEvent","event","target","mode","RelativeAnchor","id","transform","rotation","name","onPointerDown","children","class","style","onTouchStart","preventDefault","SvgShadow","in","stdDeviation","dx","dy","result","in2","operator","MarkupInteractionHandler","constructor","this","handlePointerDown","handleInteractionAttempt","handlePointerMove","handleInteractionMove","handlePointerUp","window","removeEventListener","handleInteractionEnd","resizeObserver","ResizeObserver","entry","elementBounds","computeBoundingRect","initialize","element","api","observe","addEventListener","dispose","disconnect","_a","undefined","acceptInteraction","ArrowMarkupInteractionHandler","markupEl","interactionBegin","interactionEnd","super","editAnchor","startInteraction","getMarkupBoundingClientRect","pointerId","getMouseClientPosition","emit","end","xDifference","yDifference","screenStart","screenEnd","distance","newlyCreatedMarkup","markup","BoundingBox1d","offset","onStartAnchorPointerDown","onCenterAnchorPointerDown","onEndAnchorPointerDown","angle","Angle","normalize","toDegrees","classNames","viewerMarkupArrowCss","ViewerMarkupArrow","hostRef","startLineAnchorStyle","endLineAnchorStyle","interactionHandler","hostEl","handleWindowPointerDown","handleTouchStart","componentWillLoad","updateViewport","handleViewerChanged","viewer","updatePointsFromProps","componentDidLoad","resize","componentDidRender","viewRendered","disconnectedCallback","registeredInteraction","newViewer","registerInteractionHandler","handleStartJsonChange","handleEndJsonChange","handleModeChange","handleScaleChange","writeDOM","setProperty","_b","toString","parsePoint","startJson","endJson","renderLineAnchorStyle","anchorStyle","arrowheadPoints","arrowheadPointsToPolygonPoints","d","arrowheadPointsToPathPoints","hashPoints","arrowheadPointsToHashPoints","circlePoints","arrowheadPointsToCirclePoints","render","offsetX","getWindowDevicePixelRatio","offsetY","_d","_c","originatingViewport","arrowheadStartPoints","createLineAnchorStylePoints","arrowheadEndPoints","Host","filter","x1","tip","y1","x2","y2","CircleMarkupInteractionHandler","resizeBounds","startPosition","shiftKey","BoundingBox2d","onTopLeftAnchorPointerDown","onLeftAnchorPointerDown","onTopRightAnchorPointerDown","onRightAnchorPointerDown","onBottomLeftAnchorPointerDown","onBottomAnchorPointerDown","onBottomRightAnchorPointerDown","onTopAnchorPointerDown","padded","pad","viewerMarkupCircleCss","ViewerMarkupCircle","updateBoundsFromProps","registeredHandler","handleBoundsJsonChange","parseBounds","boundsJson","relativeBounds","cx","cy","rx","ry","stroke","fill","e","FreeformMarkupInteractionHandler","handleResizeInteractionMove","resizeStartPosition","resizePoints","updatedBounds","handleResizeInteractionEnd","screenPosition","updateMinAndMax","length","viewerMarkupFreeformCss","ViewerMarkupFreeform","screenPoints","recomputePointsFromProps","convertPointsToScreen","parsePoints","pointsJson","reduce"],"sources":["src/components/viewer-markup/markup-utils.ts","src/components/viewer-markup/viewer-markup-components.tsx","src/lib/markup/interactions.ts","src/components/viewer-markup-arrow/interactions.ts","src/components/viewer-markup-arrow/viewer-markup-arrow-components.tsx","src/components/viewer-markup-arrow/viewer-markup-arrow.css?tag=vertex-viewer-markup-arrow&encapsulation=shadow","src/components/viewer-markup-arrow/viewer-markup-arrow.tsx","src/components/viewer-markup-circle/interactions.ts","src/components/viewer-markup-circle/viewer-markup-circle-components.tsx","src/components/viewer-markup-circle/viewer-markup-circle.css?tag=vertex-viewer-markup-circle&encapsulation=shadow","src/components/viewer-markup-circle/viewer-markup-circle.tsx","src/components/viewer-markup-freeform/interactions.ts","src/components/viewer-markup-freeform/viewer-markup-freeform.css?tag=vertex-viewer-markup-freeform&encapsulation=shadow","src/components/viewer-markup-freeform/viewer-markup-freeform.tsx"],"sourcesContent":["import { Dimensions, Point, Rectangle } from '@vertexvis/geometry';\n\nimport { MarkupCenteringBehavior } from '../../lib/types';\nimport { isVertexViewerArrowMarkup } from '../viewer-markup-arrow/utils';\nimport { isVertexViewerCircleMarkup } from '../viewer-markup-circle/utils';\nimport { isVertexViewerFreeformMarkup } from '../viewer-markup-freeform/utils';\n\nexport type BoundingBox2dAnchorPosition =\n  | 'left'\n  | 'right'\n  | 'top'\n  | 'bottom'\n  | 'top-left'\n  | 'top-right'\n  | 'bottom-left'\n  | 'bottom-right'\n  | 'center';\n\nexport function getBoundingBox2dAnchorPosition(\n  rect: Rectangle.Rectangle,\n  position: BoundingBox2dAnchorPosition\n): Point.Point {\n  switch (position) {\n    case 'top-left':\n      return Point.create(rect.x, rect.y);\n    case 'top':\n      return Point.create(rect.x + rect.width / 2, rect.y);\n    case 'top-right':\n      return Point.create(rect.x + rect.width, rect.y);\n    case 'right':\n      return Point.create(rect.x + rect.width, rect.y + rect.height / 2);\n    case 'bottom-right':\n      return Point.create(rect.x + rect.width, rect.y + rect.height);\n    case 'bottom':\n      return Point.create(rect.x + rect.width / 2, rect.y + rect.height);\n    case 'bottom-left':\n      return Point.create(rect.x, rect.y + rect.height);\n    case 'left':\n      return Point.create(rect.x, rect.y + rect.height / 2);\n    case 'center':\n      return Rectangle.center(rect);\n  }\n}\n\nexport function translatePointToScreen(\n  pt: Point.Point,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions: Dimensions.Dimensions = canvasDimensions,\n  centeringBehavior: MarkupCenteringBehavior = 'none',\n  scale = 1\n): Point.Point {\n  const canvasToContentScaleFactor = Math.min(\n    canvasDimensions.width / contentDimensions.width,\n    canvasDimensions.height / contentDimensions.height\n  );\n  const effectiveScalar = canvasToContentScaleFactor * scale;\n  const contentScaleFactor = getScaleFactor(contentDimensions);\n  const contentRelativePoint = Point.add(\n    Point.scale(pt, contentScaleFactor, contentScaleFactor),\n    Dimensions.center(contentDimensions)\n  );\n\n  // Include an offset for width and height to account for cases where the\n  // content dimensions are smaller than the canvas dimensions.\n  const scaledContentWidth = contentDimensions.width * effectiveScalar;\n  const scaledContentHeight = contentDimensions.height * effectiveScalar;\n  const centerOffsetX =\n    centeringBehavior === 'both' || centeringBehavior === 'x-only'\n      ? Math.max(0, (canvasDimensions.width - scaledContentWidth) / 2)\n      : 0;\n  const centerOffsetY =\n    centeringBehavior === 'both' || centeringBehavior === 'y-only'\n      ? Math.max(0, (canvasDimensions.height - scaledContentHeight) / 2)\n      : 0;\n\n  return Point.create(\n    contentRelativePoint.x * effectiveScalar + centerOffsetX,\n    contentRelativePoint.y * effectiveScalar + centerOffsetY\n  );\n}\n\nexport function translatePointToBounds(\n  pt: Point.Point,\n  rect: Rectangle.Rectangle,\n  canvasDimensions: Dimensions.Dimensions\n): Point.Point {\n  const rectToScreen = translateRectToScreen(rect, canvasDimensions);\n  return Point.add(pt, rectToScreen);\n}\n\nexport function translateDimensionsToScreen(\n  dimensions: Dimensions.Dimensions,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions: Dimensions.Dimensions = canvasDimensions,\n  scale = 1\n): Dimensions.Dimensions {\n  const canvasToContentScaleFactor = Math.min(\n    canvasDimensions.width / contentDimensions.width,\n    canvasDimensions.height / contentDimensions.height\n  );\n  const effectiveScalar = canvasToContentScaleFactor * scale;\n  const contentScaleFactor = getScaleFactor(contentDimensions);\n  const contentRelativeDimensions = Dimensions.scale(\n    contentScaleFactor,\n    contentScaleFactor,\n    dimensions\n  );\n\n  return Dimensions.scale(\n    effectiveScalar,\n    effectiveScalar,\n    contentRelativeDimensions\n  );\n}\n\n/**\n * Translates a rectangle in relative units, to a rectangle in screen units.\n *\n * Shape coordinates are persisted in relative units, so they can be presented\n * at any size.\n */\nexport function translateRectToScreen(\n  rect: Rectangle.Rectangle,\n  canvasDimensions: Dimensions.Dimensions,\n  contentDimensions?: Dimensions.Dimensions,\n  centeringBehavior: MarkupCenteringBehavior = 'none',\n  scale = 1\n): Rectangle.Rectangle {\n  const position = translatePointToScreen(\n    rect,\n    canvasDimensions,\n    contentDimensions,\n    centeringBehavior,\n    scale\n  );\n  const dimensions = translateDimensionsToScreen(\n    rect,\n    canvasDimensions,\n    contentDimensions,\n    scale\n  );\n  return Rectangle.fromPointAndDimensions(position, dimensions);\n}\n\n/**\n * Translates a point in screen units, to a point in relative units.\n */\nexport function translatePointToRelative(\n  pt: Point.Point,\n  canvasDimensions: Dimensions.Dimensions\n): Point.Point {\n  const scaleFactor = 1 / getScaleFactor(canvasDimensions);\n  const point = Point.scale(\n    Point.subtract(pt, Dimensions.center(canvasDimensions)),\n    scaleFactor,\n    scaleFactor\n  );\n\n  return point;\n}\n\n/**\n * Translates a set of points in relative `original` units to\n * points in relative `bounds` units.\n */\nexport function translatePointsToBounds(\n  points: Point.Point[],\n  original: Rectangle.Rectangle,\n  bounds: Rectangle.Rectangle\n): Point.Point[] {\n  return points.map((pt) =>\n    Point.add(\n      Point.scale(\n        Point.subtract(pt, original),\n        bounds.width / (original.width || 1),\n        bounds.height / (original.height || 1)\n      ),\n      bounds\n    )\n  );\n}\n\nexport function createRectangle(\n  initialPoint: Point.Point,\n  currentPoint: Point.Point,\n  maintainAspectRatio: boolean\n): Rectangle.Rectangle {\n  const bounds = Rectangle.fromPoints(initialPoint, currentPoint);\n  if (maintainAspectRatio) {\n    const fitBoundsSize = Math.max(bounds.width, bounds.height);\n    const isPortrait = bounds.height > bounds.width;\n    const currentIsLeftOfInitial = currentPoint.x <= initialPoint.x;\n    const currentIsAboveInitial = currentPoint.y <= initialPoint.y;\n    const fitBoundsX = currentIsLeftOfInitial\n      ? isPortrait\n        ? initialPoint.x - fitBoundsSize\n        : currentPoint.x\n      : initialPoint.x;\n    const fitBoundsY = currentIsAboveInitial\n      ? isPortrait\n        ? currentPoint.y\n        : initialPoint.y - fitBoundsSize\n      : initialPoint.y;\n    return Rectangle.create(\n      fitBoundsX,\n      fitBoundsY,\n      fitBoundsSize,\n      fitBoundsSize\n    );\n  } else {\n    return bounds;\n  }\n}\n\nexport function transformRectangle(\n  bounds: Rectangle.Rectangle,\n  start: Point.Point,\n  current: Point.Point,\n  anchor: BoundingBox2dAnchorPosition,\n  maintainAspectRatio?: boolean\n): Rectangle.Rectangle {\n  const delta = Point.subtract(current, start);\n  const { x: left, y: top, width: w, height: h } = bounds;\n  const right = left + w;\n  const bottom = top + h;\n  const topLeft = Point.create(left, top);\n  const bottomLeft = Point.create(left, bottom);\n  const topRight = Point.create(right, top);\n  const bottomRight = Point.create(right, bottom);\n  switch (anchor) {\n    case 'top-left':\n      return createRectangle(bottomRight, current, !!maintainAspectRatio);\n    case 'top':\n      return createRectangle(\n        bottomRight,\n        Point.create(left, current.y),\n        !!maintainAspectRatio\n      );\n    case 'top-right':\n      return createRectangle(bottomLeft, current, !!maintainAspectRatio);\n    case 'right':\n      return createRectangle(\n        bottomLeft,\n        Point.create(current.x, top),\n        !!maintainAspectRatio\n      );\n    case 'bottom-right':\n      return createRectangle(topLeft, current, !!maintainAspectRatio);\n    case 'bottom':\n      return createRectangle(\n        topLeft,\n        Point.create(right, current.y),\n        !!maintainAspectRatio\n      );\n    case 'bottom-left':\n      return createRectangle(topRight, current, !!maintainAspectRatio);\n    case 'left':\n      return createRectangle(\n        bottomRight,\n        Point.create(current.x, top),\n        !!maintainAspectRatio\n      );\n    case 'center':\n      return Rectangle.create(\n        bounds.x + delta.x,\n        bounds.y + delta.y,\n        bounds.width,\n        bounds.height\n      );\n  }\n}\n\nexport function isVertexViewerMarkupElement(\n  el: HTMLElement\n): el is\n  | HTMLVertexViewerMarkupArrowElement\n  | HTMLVertexViewerMarkupCircleElement\n  | HTMLVertexViewerMarkupFreeformElement {\n  return (\n    isVertexViewerArrowMarkup(el) ||\n    isVertexViewerCircleMarkup(el) ||\n    isVertexViewerFreeformMarkup(el)\n  );\n}\n\nexport function isValidPointData(...points: Point.Point[]): boolean {\n  return points.every((pt) => !isNaN(pt.x) && !isNaN(pt.y));\n}\n\nexport function isValidStartEvent(event: PointerEvent): boolean {\n  const el = event.target as HTMLElement;\n\n  return isVertexViewerMarkupElement(el) && el.mode !== 'edit';\n}\n\nfunction getScaleFactor(dimensions: Dimensions.Dimensions): number {\n  // We intentionally use the content's height when scaling to maintain a consistent coordinate\n  // space for markup. This is to ensure the markup will be displayed in the same position\n  // on the canvas regardless of the aspect ratio at the time the markup was created.\n  // See https://github.com/Vertexvis/vertex-web-sdk/pull/429 for more details.\n  return dimensions.height;\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\n\nexport interface RelativeAnchorProps {\n  id?: string;\n  transform?: string;\n  rotation?: number;\n  name: string;\n  point: Point.Point;\n  onPointerDown?: (event: PointerEvent) => void;\n}\n\nexport const RelativeAnchor: FunctionalComponent<RelativeAnchorProps> = (\n  { id, transform, rotation, name, point, onPointerDown },\n  children\n) => {\n  return (\n    <div\n      id={id}\n      class=\"bounds-anchor-position\"\n      style={{\n        top: `${point.y}px`,\n        left: `${point.x}px`,\n      }}\n      onTouchStart={(event) => event.preventDefault()}\n      onPointerDown={onPointerDown}\n    >\n      <div style={{ transform }}>\n        <div\n          class=\"bounds-anchor\"\n          style={{\n            transform: `rotateZ(${rotation ?? 0}deg)`,\n          }}\n        >\n          <slot name={name}>{children}</slot>\n        </div>\n      </div>\n    </div>\n  );\n};\n\nexport interface SvgShadowProps {\n  id: string;\n}\n\nexport const SvgShadow: FunctionalComponent<SvgShadowProps> = ({ id }) => {\n  return (\n    <filter id={id}>\n      <feGaussianBlur in=\"SourceAlpha\" stdDeviation=\"2\" />\n      <feOffset dx=\"0\" dy=\"1\" result=\"offsetblur\" />\n      <feFlood flood-color=\"#000000\" flood-opacity=\"0.25\" />\n      <feComposite in2=\"offsetblur\" operator=\"in\" />\n      <feMerge>\n        <feMergeNode />\n        <feMergeNode in=\"SourceGraphic\" />\n      </feMerge>\n    </filter>\n  );\n};\n","import type { InteractionApi, InteractionHandler } from '../interactions';\n\nexport abstract class MarkupInteractionHandler implements InteractionHandler {\n  protected element?: HTMLElement;\n  protected elementBounds?: DOMRect;\n  protected api?: InteractionApi;\n\n  private resizeObserver: ResizeObserver;\n\n  public constructor() {\n    this.resizeObserver = new ResizeObserver(([entry]) => {\n      this.elementBounds = this.computeBoundingRect();\n    });\n  }\n\n  public initialize(element: HTMLElement, api: InteractionApi): void {\n    this.element = element;\n    this.api = api;\n\n    this.elementBounds = this.computeBoundingRect();\n    this.resizeObserver.observe(this.element);\n\n    this.element.addEventListener('pointerdown', this.handlePointerDown);\n  }\n\n  public dispose(): void {\n    this.resizeObserver.disconnect();\n    this.element?.removeEventListener('pointerdown', this.handlePointerDown);\n\n    this.element = undefined;\n    this.api = undefined;\n  }\n\n  protected acceptInteraction(): void {\n    window.addEventListener('pointermove', this.handlePointerMove);\n    window.addEventListener('pointerup', this.handlePointerUp);\n  }\n\n  private handlePointerDown = (event: PointerEvent): void => {\n    this.handleInteractionAttempt(event);\n  };\n\n  private handlePointerMove = (event: PointerEvent): void => {\n    this.handleInteractionMove(event);\n  };\n\n  private handlePointerUp = (event: PointerEvent): void => {\n    window.removeEventListener('pointermove', this.handlePointerMove);\n    window.removeEventListener('pointerup', this.handlePointerUp);\n\n    this.handleInteractionEnd(event);\n  };\n\n  protected abstract computeBoundingRect(): DOMRect;\n\n  protected abstract handleInteractionAttempt(event: PointerEvent): void;\n\n  protected abstract handleInteractionMove(event: PointerEvent): void;\n\n  protected abstract handleInteractionEnd(event: PointerEvent): void;\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Point } from '@vertexvis/geometry';\n\nimport { getMouseClientPosition } from '../../lib/dom';\nimport { MarkupInteractionHandler } from '../../lib/markup/interactions';\nimport { MarkupInteraction } from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  translatePointToRelative,\n  translatePointToScreen,\n} from '../viewer-markup/markup-utils';\n\ntype ViewerMarkupArrowEditAnchor = 'start' | 'end' | 'center';\n\nexport class ArrowMarkupInteractionHandler extends MarkupInteractionHandler {\n  private pointerId?: number;\n  private anchor: ViewerMarkupArrowEditAnchor = 'end';\n\n  public constructor(\n    private readonly markupEl: HTMLVertexViewerMarkupArrowElement,\n    private readonly interactionBegin: EventEmitter<void>,\n    private readonly interactionEnd: EventEmitter<MarkupInteraction>\n  ) {\n    super();\n  }\n\n  public editAnchor(\n    anchor: ViewerMarkupArrowEditAnchor,\n    event: PointerEvent\n  ): void {\n    if (this.markupEl.mode === 'edit') {\n      this.anchor = anchor;\n      this.startInteraction(event);\n    }\n  }\n\n  public startInteraction(event: PointerEvent): void {\n    this.handleInteractionAttempt(event);\n  }\n\n  protected computeBoundingRect(): DOMRect {\n    return getMarkupBoundingClientRect(this.markupEl);\n  }\n\n  protected handleInteractionAttempt(event: PointerEvent): void {\n    if (\n      this.markupEl.mode !== '' &&\n      this.pointerId == null &&\n      this.elementBounds != null\n    ) {\n      this.pointerId = event.pointerId;\n      this.markupEl.start =\n        this.markupEl.start ??\n        translatePointToRelative(\n          getMouseClientPosition(event, this.elementBounds),\n          this.elementBounds\n        );\n\n      this.interactionBegin.emit();\n      this.acceptInteraction();\n    }\n  }\n\n  protected handleInteractionMove(event: PointerEvent): void {\n    if (this.elementBounds != null && this.pointerId === event.pointerId) {\n      const position = translatePointToRelative(\n        getMouseClientPosition(event, this.elementBounds),\n        this.elementBounds\n      );\n      if (this.anchor === 'start') {\n        this.markupEl.start = position;\n      } else if (this.anchor === 'end') {\n        this.markupEl.end = position;\n      } else if (this.markupEl.start != null && this.markupEl.end != null) {\n        const center = Point.create(\n          (this.markupEl.start.x + this.markupEl.end.x) / 2,\n          (this.markupEl.start.y + this.markupEl.end.y) / 2\n        );\n        const xDifference = center.x - position.x;\n        const yDifference = center.y - position.y;\n\n        this.markupEl.start = Point.create(\n          this.markupEl.start.x - xDifference,\n          this.markupEl.start.y - yDifference\n        );\n        this.markupEl.end = Point.create(\n          this.markupEl.end.x - xDifference,\n          this.markupEl.end.y - yDifference\n        );\n      }\n    }\n  }\n\n  protected handleInteractionEnd(event: PointerEvent): void {\n    if (this.pointerId === event.pointerId) {\n      const screenStart =\n        this.markupEl.start != null && this.elementBounds != null\n          ? translatePointToScreen(this.markupEl.start, this.elementBounds)\n          : undefined;\n      const screenEnd =\n        this.markupEl.end != null && this.elementBounds != null\n          ? translatePointToScreen(this.markupEl.end, this.elementBounds)\n          : undefined;\n\n      if (\n        this.markupEl.mode !== '' &&\n        screenStart != null &&\n        screenEnd != null &&\n        Point.distance(screenStart, screenEnd) >= 2\n      ) {\n        const newlyCreatedMarkup = this.markupEl.mode !== 'edit';\n        this.interactionEnd.emit({ markup: this.markupEl, newlyCreatedMarkup });\n      } else {\n        this.markupEl.start = undefined;\n        this.markupEl.end = undefined;\n      }\n\n      this.pointerId = undefined;\n    }\n  }\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Angle, Point } from '@vertexvis/geometry';\nimport classNames from 'classnames';\n\nimport { RelativeAnchor } from '../viewer-markup/viewer-markup-components';\n\nexport interface BoundingBox1dProps {\n  start: Point.Point;\n  end: Point.Point;\n  offset?: Point.Point;\n  onStartAnchorPointerDown?: (event: PointerEvent) => void;\n  onCenterAnchorPointerDown?: (event: PointerEvent) => void;\n  onEndAnchorPointerDown?: (event: PointerEvent) => void;\n}\n\nexport const BoundingBox1d: FunctionalComponent<BoundingBox1dProps> = ({\n  start,\n  end,\n  offset,\n  onStartAnchorPointerDown,\n  onCenterAnchorPointerDown,\n  onEndAnchorPointerDown,\n}) => {\n  const angle = Angle.normalize(\n    Angle.toDegrees(Angle.fromPoints(start, end)) - 270\n  );\n  const center = Point.create((start.x + end.x) / 2, (start.y + end.y) / 2);\n  const transform =\n    offset != null ? `translate(${offset.x}px, ${offset.y}px)` : undefined;\n\n  return (\n    <div class=\"bounds-container\">\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-1d-start-anchor\"\n        name=\"start-anchor\"\n        rotation={angle}\n        point={start}\n        onPointerDown={onStartAnchorPointerDown}\n      >\n        <div class={classNames('bounds-default-anchor', 'bounds-cap-anchor')} />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-1d-end-anchor\"\n        name=\"end-anchor\"\n        rotation={angle}\n        point={end}\n        onPointerDown={onEndAnchorPointerDown}\n      >\n        <div class={classNames('bounds-default-anchor', 'bounds-cap-anchor')} />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-1d-center-anchor\"\n        name=\"center-anchor\"\n        point={center}\n        onPointerDown={onCenterAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-center-anchor')}\n        />\n      </RelativeAnchor>\n    </div>\n  );\n};\n",":host {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  /**\n   * @prop --viewer-markup-arrow-line-stroke-color: A CSS color that\n   * specifies the color of the arrow line's outline.\n   */\n  --viewer-markup-arrow-line-stroke-color: var(--red-800);\n  /**\n   * @prop --viewer-markup-arrow-line-stroke-width: A CSS length that\n   * specifies the width of the arrow line's outline.\n   *\n   * Note that this is scaled by the component's scale factor, so providing a scale\n   * other than 1 will result in a different stroke width.\n   */\n  --viewer-markup-arrow-line-stroke-width: 4px;\n  /**\n   * @prop --viewer-markup-arrow-head-stroke-color: A CSS color that\n   * specifies the color of the arrow head's outline.\n   */\n  --viewer-markup-arrow-head-stroke-color: var(--red-800);\n  /**\n   * @prop --viewer-markup-arrow-head-stroke-width: A CSS length that\n   * specifies the width of the arrow head's outline.\n   *\n   * Note that this is scaled by the component's scale factor, so providing a scale\n   * other than 1 will result in a different stroke width.\n   */\n  --viewer-markup-arrow-head-stroke-width: 4px;\n  /**\n   * @prop --viewer-markup-arrow-head-fill-color: A CSS color that\n   * specifies the color of the arrow head's fill.\n   */\n  --viewer-markup-arrow-head-fill-color: var(--red-800);\n  /**\n   * @prop --viewer-markup-arrow-head-fill-opacity: A number between\n   * 0 and 1 that specifies the opacity of the arrow head's fill.\n   */\n  --viewer-markup-arrow-head-fill-opacity: 1;\n  /**\n   * @prop --viewer-markup-arrow-bounds-cap-border-color: A CSS color that\n   * specifies the color of arrow start/end resize anchors' border.\n   */\n  --viewer-markup-arrow-bounds-cap-border-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-arrow-bounds-cap-border-width: A CSS length that\n   * specifies the width of arrow start/end resize anchors' border.\n   */\n  --viewer-markup-arrow-bounds-cap-border-width: 1px;\n  /**\n   * @prop --viewer-markup-arrow-bounds-cap-background-color: A CSS color that\n   * specifies the background color of the arrow start/end resize anchors.\n   */\n  --viewer-markup-arrow-bounds-cap-background-color: white;\n  /**\n   * @prop --viewer-markup-arrow-bounds-center-anchor-border-color: A CSS color that\n   * specifies the color of the center resize anchor's border.\n   */\n  --viewer-markup-arrow-bounds-center-anchor-border-color: white;\n  /**\n   * @prop --viewer-markup-arrow-bounds-center-anchor-border-width: A CSS length that\n   * specifies the width of the center resize anchor's border.\n   */\n  --viewer-markup-arrow-bounds-center-anchor-border-width: 1px;\n  /**\n   * @prop --viewer-markup-arrow-bounds-center-anchor-background-color: A CSS color that\n   * specifies the background color of the center resize anchor.\n   */\n  --viewer-markup-arrow-bounds-center-anchor-background-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-arrow-bounds-outline-width: A CSS color that\n   * specifies the width of the selected arrow outline.\n   */\n  --viewer-markup-arrow-bounds-outline-width: 1px;\n  /**\n   * @prop --viewer-markup-arrow-bounds-outline-color: A CSS color that\n   * specifies the color of selected arrow outline.\n   */\n  --viewer-markup-arrow-bounds-outline-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-arrow-bounds-anchor-width: A CSS length that\n   * specifies the width of the resize and reposition anchors.\n   */\n  --viewer-markup-arrow-bounds-anchor-width: 9px;\n  /**\n    * @prop --viewer-markup-arrow-bounds-anchor-height: A CSS length that\n    * specifies the height of the resize and reposition anchors.\n    */\n  --viewer-markup-arrow-bounds-anchor-height: 9px;\n  /**\n    * @prop --viewer-markup-arrow-scale: A number that specifies the scale of the arrow.\n    * This is used to scale the arrow's stroke width. Defaults to 1, and is managed internally\n    * by the component.\n    */\n  --viewer-markup-arrow-scale: 1;\n}\n\n.svg {\n  pointer-events: none;\n  width: 100%;\n  height: 100%;\n}\n\n.create-overlay {\n  pointer-events: auto;\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  cursor: crosshair;\n}\n\n.line {\n  pointer-events: auto;\n  stroke: var(--viewer-markup-arrow-line-stroke-color);\n  stroke-width: calc(\n    var(--viewer-markup-arrow-line-stroke-width) *\n      var(--viewer-markup-arrow-scale)\n  );\n  cursor: default;\n}\n\n.head {\n  pointer-events: auto;\n  stroke: var(--viewer-markup-arrow-head-stroke-color);\n  stroke-width: calc(\n    var(--viewer-markup-arrow-head-stroke-width) *\n      var(--viewer-markup-arrow-scale)\n  );\n  fill: var(--viewer-markup-arrow-head-fill-color);\n  fill-opacity: var(--viewer-markup-arrow-head-fill-opacity);\n  cursor: default;\n}\n\n.bounds-line {\n  pointer-events: auto;\n  stroke: var(--viewer-markup-arrow-bounds-outline-color);\n  stroke-width: var(--viewer-markup-arrow-bounds-outline-width);\n}\n\n.bounds-container {\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  overflow: hidden;\n}\n\n.bounds-anchor-position {\n  position: absolute;\n  transform: translate(-50%, -50%);\n}\n\n.bounds-anchor {\n  pointer-events: auto;\n  cursor: default;\n  user-select: none;\n}\n\n.bounds-default-anchor {\n  width: var(--viewer-markup-arrow-bounds-anchor-width);\n  height: var(--viewer-markup-arrow-bounds-anchor-height);\n  box-sizing: border-box;\n  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);\n}\n\n.bounds-center-anchor {\n  border-radius: 100%;\n  border-width: var(--viewer-markup-arrow-bounds-center-anchor-border-width);\n  border-color: var(--viewer-markup-arrow-bounds-center-anchor-border-color);\n  border-style: solid;\n  background-color: var(\n    --viewer-markup-arrow-bounds-center-anchor-background-color\n  );\n}\n\n.bounds-cap-anchor {\n  border-width: var(--viewer-markup-arrow-bounds-cap-border-width);\n  border-color: var(--viewer-markup-arrow-bounds-cap-border-color);\n  border-style: solid;\n  background-color: var(--viewer-markup-arrow-bounds-cap-background-color);\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Dimensions, Point } from '@vertexvis/geometry';\nimport { Disposable } from '@vertexvis/utils';\n\nimport { getWindowDevicePixelRatio } from '../../lib/dom';\nimport { writeDOM } from '../../lib/stencil';\nimport {\n  MarkupCenteringBehavior,\n  MarkupInteraction,\n} from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  isValidPointData,\n  isValidStartEvent,\n  translatePointToScreen,\n} from '../viewer-markup/markup-utils';\nimport { SvgShadow } from '../viewer-markup/viewer-markup-components';\nimport { ArrowMarkupInteractionHandler } from './interactions';\nimport {\n  arrowheadPointsToCirclePoints,\n  arrowheadPointsToHashPoints,\n  arrowheadPointsToPathPoints,\n  arrowheadPointsToPolygonPoints,\n  createLineAnchorStylePoints,\n  LineAnchorStyle,\n  LineAnchorStylePoints,\n  parsePoint,\n} from './utils';\nimport { BoundingBox1d } from './viewer-markup-arrow-components';\n\n/**\n * The supported arrow markup modes.\n *\n * @see {@link ViewerMarkupArrowMode.mode} - For more details about modes.\n */\nexport type ViewerMarkupArrowMode = 'edit' | 'create' | '';\n\n@Component({\n  tag: 'vertex-viewer-markup-arrow',\n  styleUrl: 'viewer-markup-arrow.css',\n  shadow: true,\n})\nexport class ViewerMarkupArrow {\n  /**\n   * The position of the starting anchor. Can either be an instance of a\n   * `Point` or a JSON string representation in the format of `[x, y]` or\n   * `{\"x\": 0, \"y\": 0}`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ mutable: true, attribute: null })\n  public start?: Point.Point;\n\n  /**\n   * The position of the starting anchor, as a JSON string. Can either be an\n   * instance of a `Point` or a JSON string representation in the format of\n   * `[x, y]` or `{\"x\": 0, \"y\": 0}`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ attribute: 'start' })\n  public startJson?: string;\n\n  /**\n   * The position of the ending anchor. Can either be an instance of a `Point`\n   * or a JSON string representation in the format of `[x, y]` or `{\"x\": 0,\n   * \"y\": 0}`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ mutable: true })\n  public end?: Point.Point;\n\n  /**\n   * The position of the ending anchor, as a JSON string. Can either be an\n   * instance of a `Point` or a JSON string representation in the format of\n   * `[x, y]` or `{\"x\": 0, \"y\": 0}`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ attribute: 'end' })\n  public endJson?: string;\n\n  /**\n   * The original viewport dimensions where this markup was created. This value is used\n   * to determine where the markup should be rendered relative to the current viewport,\n   * enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all NDC values will be considered relative to this viewport.\n   */\n  @Prop()\n  public originatingViewport?: Dimensions.Dimensions;\n\n  /**\n   * Defines the behavior of the provided markup when the originating viewport is smaller\n   * than the current viewport, or is scaled to a size smaller than the current viewport\n   * using the `scale` property.\n   *\n   * Options:\n   * - `x-only`: Markup will be centered horizontally, but not vertically.\n   * - `y-only`: Markup will be centered vertically, but not horizontally.\n   * - `both`: Markup will be centered both horizontally and vertically.\n   * - `none`: Markup will not be centered (default).\n   */\n  @Prop()\n  public centeringBehavior: MarkupCenteringBehavior = 'none';\n\n  /**\n   * The current offset of the visible viewport. This value is used to determine where\n   * markup should be rendered relative to the current viewport, enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all computed coordinates will be offset by this amount.\n   */\n  @Prop()\n  public offset?: Point.Point;\n\n  /**\n   * The scale to render this markup at. This value is used to scale the element's bounds\n   * along with any `offset` to determine the final computed coordinates.\n   *\n   * When provided, all computed coordinates will be scaled by this amount.\n   */\n  @Prop()\n  public scale = 1;\n\n  /**\n   * The style of the starting anchor. This defaults to none.\n   */\n  @Prop({ mutable: true })\n  public startLineAnchorStyle: LineAnchorStyle = 'none';\n\n  /**\n   * The style of the ending anchor. This defaults to 'arrow-triangle.'\n   */\n  @Prop({ mutable: true })\n  public endLineAnchorStyle: LineAnchorStyle = 'arrow-triangle';\n\n  /**\n   * A mode that specifies how the markup component should behave. When\n   * unset, the component will not respond to interactions with the handles.\n   * When `edit`, the markup anchors are interactive and the user is able\n   * to reposition them. When `create`, anytime the user clicks on the canvas,\n   * a new markup will be performed.\n   */\n  @Prop({ reflect: true })\n  public mode: ViewerMarkupArrowMode = '';\n\n  /**\n   * The viewer to connect to markups.\n   *\n   * This property will automatically be set when a child of a\n   * `<vertex-viewer-markup>` or `<vertex-viewer>` element.\n   */\n  @Prop()\n  public viewer?: HTMLVertexViewerElement;\n\n  /**\n   * An event that is dispatched anytime the user begins interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionBegin!: EventEmitter<void>;\n\n  /**\n   * An event that is dispatched when the user has finished interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionEnd!: EventEmitter<MarkupInteraction>;\n\n  /**\n   * An event that is dispatched when this markup element is in view\n   * mode (`this.mode === \"\"`), and it completes a rerender.\n   */\n  @Event({ bubbles: true })\n  public viewRendered!: EventEmitter<void>;\n\n  @Element()\n  private hostEl!: HTMLVertexViewerMarkupArrowElement;\n\n  @State()\n  private elementBounds?: DOMRect;\n\n  private interactionHandler = new ArrowMarkupInteractionHandler(\n    this.hostEl,\n    this.interactionBegin,\n    this.interactionEnd\n  );\n\n  private registeredInteraction?: Disposable;\n\n  /**\n   * @ignore\n   */\n  protected componentWillLoad(): void {\n    this.updateViewport();\n    this.handleViewerChanged(this.viewer);\n    this.updatePointsFromProps();\n  }\n\n  protected componentDidLoad(): void {\n    this.updatePointsFromProps();\n\n    const resize = new ResizeObserver(() => this.updateViewport());\n    resize.observe(this.hostEl);\n\n    if (this.mode === 'create') {\n      window.addEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  protected componentDidRender(): void {\n    if (this.mode === '') {\n      this.viewRendered.emit();\n    }\n  }\n\n  protected disconnectedCallback(): void {\n    this.dispose();\n  }\n\n  @Method()\n  public async dispose(): Promise<void> {\n    this.registeredInteraction?.dispose();\n    this.registeredInteraction = undefined;\n\n    window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n  }\n\n  /**\n   * @ignore\n   */\n  @Watch('viewer')\n  protected async handleViewerChanged(\n    newViewer?: HTMLVertexViewerElement\n  ): Promise<void> {\n    this.registeredInteraction?.dispose();\n    this.registeredInteraction = undefined;\n\n    if (newViewer != null) {\n      this.registeredInteraction = await newViewer.registerInteractionHandler(\n        this.interactionHandler\n      );\n    }\n  }\n\n  @Watch('start')\n  protected handleStartJsonChange(): void {\n    this.updatePointsFromProps();\n  }\n\n  @Watch('end')\n  protected handleEndJsonChange(): void {\n    this.updatePointsFromProps();\n  }\n\n  @Watch('mode')\n  protected handleModeChange(): void {\n    if (this.mode !== 'create') {\n      window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  @Watch('scale')\n  protected handleScaleChange(): void {\n    writeDOM(() => {\n      this.hostEl.style.setProperty(\n        '--viewer-markup-arrow-scale',\n        this.scale?.toString() ?? '1'\n      );\n    });\n  }\n\n  private updateViewport(): void {\n    const rect = getMarkupBoundingClientRect(this.hostEl);\n    this.elementBounds = rect;\n  }\n\n  private updatePointsFromProps(): void {\n    this.start = this.start || parsePoint(this.startJson);\n    this.end = this.end || parsePoint(this.endJson);\n  }\n\n  private renderLineAnchorStyle(\n    anchorStyle: LineAnchorStyle,\n    arrowheadPoints: LineAnchorStylePoints\n  ): h.JSX.IntrinsicElements {\n    if (anchorStyle === 'arrow-triangle') {\n      return (\n        <polygon\n          id=\"line-anchor-arrow-triangle\"\n          class=\"head\"\n          points={arrowheadPointsToPolygonPoints(arrowheadPoints, this.scale)}\n        />\n      );\n    } else if (anchorStyle === 'arrow-line') {\n      return (\n        <path\n          id=\"line-anchor-arrow-line\"\n          class=\"head\"\n          d={arrowheadPointsToPathPoints(arrowheadPoints, this.scale)}\n        />\n      );\n    } else if (anchorStyle === 'hash') {\n      const hashPoints = arrowheadPointsToHashPoints(\n        arrowheadPoints,\n        this.scale\n      );\n\n      return <line id=\"line-anchor-hash\" class=\"head\" {...hashPoints} />;\n    } else if (anchorStyle === 'dot') {\n      const circlePoints = arrowheadPointsToCirclePoints(\n        arrowheadPoints,\n        this.scale\n      );\n\n      return <circle id=\"line-anchor-circle\" class=\"head\" {...circlePoints} />;\n    } else {\n      return <div />;\n    }\n  }\n\n  public render(): h.JSX.IntrinsicElements {\n    if (this.start != null && this.end != null && this.elementBounds != null) {\n      const elementBounds = this.elementBounds;\n      const offsetX = (this.offset?.x ?? 0) / getWindowDevicePixelRatio();\n      const offsetY = (this.offset?.y ?? 0) / getWindowDevicePixelRatio();\n      const screenStart = translatePointToScreen(\n        this.start,\n        elementBounds,\n        this.originatingViewport,\n        this.centeringBehavior,\n        this.scale\n      );\n      const screenEnd = translatePointToScreen(\n        this.end,\n        elementBounds,\n        this.originatingViewport,\n        this.centeringBehavior,\n        this.scale\n      );\n\n      if (isValidPointData(screenStart, screenEnd)) {\n        const arrowheadStartPoints = createLineAnchorStylePoints(\n          screenEnd,\n          screenStart\n        );\n        const arrowheadEndPoints = createLineAnchorStylePoints(\n          screenStart,\n          screenEnd\n        );\n\n        return (\n          <Host>\n            <svg class=\"svg\" onTouchStart={this.handleTouchStart}>\n              <defs>\n                <SvgShadow id=\"arrow-shadow\" />\n              </defs>\n              <g\n                transform={`translate(${offsetX} ${offsetY})`}\n                filter=\"url(#arrow-shadow)\"\n              >\n                {this.renderLineAnchorStyle(\n                  this.startLineAnchorStyle,\n                  arrowheadStartPoints\n                )}\n                <line\n                  id=\"arrow-line\"\n                  class=\"line\"\n                  x1={arrowheadEndPoints.tip.x}\n                  y1={arrowheadEndPoints.tip.y}\n                  x2={arrowheadStartPoints.tip.x}\n                  y2={arrowheadStartPoints.tip.y}\n                />\n                {this.renderLineAnchorStyle(\n                  this.endLineAnchorStyle,\n                  arrowheadEndPoints\n                )}\n              </g>\n              {this.mode === 'edit' && (\n                <g transform={`translate(${offsetX} ${offsetY})`}>\n                  <line\n                    id=\"bounding-box-1d-line\"\n                    class=\"bounds-line\"\n                    x1={screenStart.x}\n                    y1={screenStart.y}\n                    x2={screenEnd.x}\n                    y2={screenEnd.y}\n                  />\n                </g>\n              )}\n            </svg>\n            {this.mode === 'edit' && (\n              <BoundingBox1d\n                start={screenStart}\n                end={screenEnd}\n                offset={{ x: offsetX, y: offsetY }}\n                onStartAnchorPointerDown={(event) =>\n                  this.interactionHandler.editAnchor('start', event)\n                }\n                onCenterAnchorPointerDown={(event) =>\n                  this.interactionHandler.editAnchor('center', event)\n                }\n                onEndAnchorPointerDown={(event) =>\n                  this.interactionHandler.editAnchor('end', event)\n                }\n              />\n            )}\n            {this.mode === 'create' && (\n              <div\n                class=\"create-overlay\"\n                onTouchStart={this.handleTouchStart}\n              ></div>\n            )}\n          </Host>\n        );\n      } else {\n        return <Host></Host>;\n      }\n    } else {\n      return (\n        <Host>\n          <div\n            class=\"create-overlay\"\n            onTouchStart={this.handleTouchStart}\n          ></div>\n        </Host>\n      );\n    }\n  }\n\n  private handleWindowPointerDown = (event: PointerEvent): void => {\n    if (isValidStartEvent(event)) {\n      this.interactionHandler.startInteraction(event);\n    }\n  };\n\n  private handleTouchStart = (event: TouchEvent): void => {\n    event.preventDefault();\n  };\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Point, Rectangle } from '@vertexvis/geometry';\n\nimport { getMouseClientPosition } from '../../lib/dom';\nimport { MarkupInteractionHandler } from '../../lib/markup/interactions';\nimport { MarkupInteraction } from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  BoundingBox2dAnchorPosition,\n  transformRectangle,\n  translatePointToRelative,\n} from '../viewer-markup/markup-utils';\n\nexport class CircleMarkupInteractionHandler extends MarkupInteractionHandler {\n  private pointerId?: number;\n  private startPosition?: Point.Point;\n  private resizeBounds?: Rectangle.Rectangle;\n\n  private anchor: BoundingBox2dAnchorPosition = 'bottom-right';\n\n  public constructor(\n    private readonly markupEl: HTMLVertexViewerMarkupCircleElement,\n    private readonly interactionBegin: EventEmitter<void>,\n    private readonly interactionEnd: EventEmitter<MarkupInteraction>\n  ) {\n    super();\n  }\n\n  public editAnchor(\n    anchor: BoundingBox2dAnchorPosition,\n    event: PointerEvent\n  ): void {\n    if (this.markupEl.mode === 'edit') {\n      this.anchor = anchor;\n      this.resizeBounds = this.markupEl.bounds;\n      this.startInteraction(event);\n    }\n  }\n\n  public startInteraction(event: PointerEvent): void {\n    this.handleInteractionAttempt(event);\n  }\n\n  protected computeBoundingRect(): DOMRect {\n    return getMarkupBoundingClientRect(this.markupEl);\n  }\n\n  protected handleInteractionAttempt(event: PointerEvent): void {\n    if (\n      this.markupEl.mode !== '' &&\n      this.pointerId == null &&\n      this.elementBounds != null\n    ) {\n      const position = translatePointToRelative(\n        getMouseClientPosition(event, this.elementBounds),\n        this.elementBounds\n      );\n      this.pointerId = event.pointerId;\n      this.startPosition = position;\n      this.markupEl.bounds =\n        this.markupEl.bounds ?? Rectangle.create(position.x, position.y, 0, 0);\n      this.resizeBounds = this.markupEl.bounds;\n\n      this.interactionBegin.emit();\n      this.acceptInteraction();\n    }\n  }\n\n  protected handleInteractionMove(event: PointerEvent): void {\n    if (\n      this.markupEl.bounds != null &&\n      this.startPosition != null &&\n      this.elementBounds != null &&\n      this.pointerId === event.pointerId\n    ) {\n      const position = translatePointToRelative(\n        getMouseClientPosition(event, this.elementBounds),\n        this.elementBounds\n      );\n\n      this.markupEl.bounds = transformRectangle(\n        this.resizeBounds ?? this.markupEl.bounds,\n        this.startPosition,\n        position,\n        this.anchor,\n        event.shiftKey\n      );\n    }\n  }\n\n  protected handleInteractionEnd(event: PointerEvent): void {\n    if (this.pointerId === event.pointerId) {\n      if (\n        this.markupEl.mode !== '' &&\n        this.markupEl.bounds != null &&\n        this.markupEl.bounds?.width > 0 &&\n        this.markupEl.bounds?.height > 0\n      ) {\n        this.anchor = 'bottom-right';\n\n        const newlyCreatedMarkup = this.markupEl.mode !== 'edit';\n        this.interactionEnd.emit({ markup: this.markupEl, newlyCreatedMarkup });\n      } else {\n        this.markupEl.bounds = undefined;\n      }\n\n      this.pointerId = undefined;\n    }\n  }\n}\n","// eslint-disable-next-line @typescript-eslint/no-unused-vars\nimport { FunctionalComponent, h } from '@stencil/core';\nimport { Point, Rectangle } from '@vertexvis/geometry';\nimport classNames from 'classnames';\n\nimport { getBoundingBox2dAnchorPosition } from '../viewer-markup/markup-utils';\nimport { RelativeAnchor } from '../viewer-markup/viewer-markup-components';\n\nexport interface BoundingBox2dProps {\n  bounds: Rectangle.Rectangle;\n  offset?: Point.Point;\n  onTopLeftAnchorPointerDown?: (event: PointerEvent) => void;\n  onLeftAnchorPointerDown?: (event: PointerEvent) => void;\n  onTopRightAnchorPointerDown?: (event: PointerEvent) => void;\n  onRightAnchorPointerDown?: (event: PointerEvent) => void;\n  onBottomLeftAnchorPointerDown?: (event: PointerEvent) => void;\n  onBottomAnchorPointerDown?: (event: PointerEvent) => void;\n  onBottomRightAnchorPointerDown?: (event: PointerEvent) => void;\n  onTopAnchorPointerDown?: (event: PointerEvent) => void;\n  onCenterAnchorPointerDown?: (event: PointerEvent) => void;\n}\n\nexport const BoundingBox2d: FunctionalComponent<BoundingBox2dProps> = ({\n  bounds,\n  offset,\n  onTopLeftAnchorPointerDown,\n  onLeftAnchorPointerDown,\n  onTopRightAnchorPointerDown,\n  onRightAnchorPointerDown,\n  onBottomLeftAnchorPointerDown,\n  onBottomAnchorPointerDown,\n  onBottomRightAnchorPointerDown,\n  onTopAnchorPointerDown,\n  onCenterAnchorPointerDown,\n}) => {\n  const padded = Rectangle.pad(bounds, 6);\n  const center = Rectangle.center(padded);\n  const transform =\n    offset != null ? `translate(${offset.x}px, ${offset.y}px)` : undefined;\n\n  return (\n    <div class=\"bounds-container\">\n      <div\n        class=\"bounds-outline\"\n        style={{\n          top: `${padded.y}px`,\n          left: `${padded.x}px`,\n          width: `${padded.width}px`,\n          height: `${padded.height}px`,\n          transform,\n        }}\n      ></div>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-top-left-anchor\"\n        name=\"top-left-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'top-left')}\n        onPointerDown={onTopLeftAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-left-anchor\"\n        name=\"left-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'left')}\n        onPointerDown={onLeftAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-top-right-anchor\"\n        name=\"top-right-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'top-right')}\n        onPointerDown={onTopRightAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-right-anchor\"\n        name=\"right-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'right')}\n        onPointerDown={onRightAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-bottom-left-anchor\"\n        name=\"bottom-left-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'bottom-left')}\n        onPointerDown={onBottomLeftAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-bottom-anchor\"\n        name=\"bottom-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'bottom')}\n        onPointerDown={onBottomAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-bottom-right-anchor\"\n        name=\"bottom-right-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'bottom-right')}\n        onPointerDown={onBottomRightAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-top-anchor\"\n        name=\"top-anchor\"\n        point={getBoundingBox2dAnchorPosition(padded, 'top')}\n        onPointerDown={onTopAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-edge-anchor')}\n        />\n      </RelativeAnchor>\n      <RelativeAnchor\n        transform={transform}\n        id=\"bounding-box-2d-center-anchor\"\n        name=\"center-anchor\"\n        point={center}\n        onPointerDown={onCenterAnchorPointerDown}\n      >\n        <div\n          class={classNames('bounds-default-anchor', 'bounds-center-anchor')}\n        />\n      </RelativeAnchor>\n    </div>\n  );\n};\n",":host {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  /**\n   * @prop --viewer-markup-circle-ellipse-stroke-color: A CSS color that\n   * specifies the color of the circle's outline.\n   */\n  --viewer-markup-circle-ellipse-stroke-color: var(--red-700);\n  /**\n   * @prop --viewer-markup-circle-ellipse-stroke-width: A CSS length that\n   * specifies the width of the circle's outline.\n   *\n   * Note that this is scaled by the component's scale factor, so providing a scale\n   * other than 1 will result in a different stroke width.\n   */\n  --viewer-markup-circle-ellipse-stroke-width: 4px;\n  /**\n   * @prop --viewer-markup-circle-ellipse-fill-color: A CSS color that\n   * specifies the color of the circle's fill.\n   */\n  --viewer-markup-circle-ellipse-fill-color: none;\n  /**\n   * @prop --viewer-markup-circle-ellipse-fill-opacity: A number between\n   * 0 and 1 that specifies the opacity of the circle's fill.\n   */\n  --viewer-markup-circle-ellipse-fill-opacity: 0;\n  /**\n   * @prop --viewer-markup-circle-bounds-outline-border-color: A CSS color that\n   * specifies the color of the circle's selected bounding box border.\n   */\n  --viewer-markup-circle-bounds-outline-border-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-circle-bounds-outline-border-width: A CSS length that\n   * specifies the width of the circle's selected bounding box border.\n   */\n  --viewer-markup-circle-bounds-outline-border-width: 1px;\n  /**\n   * @prop --viewer-markup-circle-bounds-edge-anchor-border-color: A CSS color that\n   * specifies the color of the edge and corner resize anchors' borders.\n   */\n  --viewer-markup-circle-bounds-edge-anchor-border-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-circle-bounds-edge-anchor-border-width: A CSS length that\n   * specifies the width of the edge and corner resize anchors' borders.\n   */\n  --viewer-markup-circle-bounds-edge-anchor-border-width: 1px;\n  /**\n   * @prop --viewer-markup-circle-bounds-edge-anchor-background-color: A CSS color that\n   * specifies the background color of the edge and corner resize anchors.\n   */\n  --viewer-markup-circle-bounds-edge-anchor-background-color: white;\n  /**\n   * @prop --viewer-markup-circle-bounds-center-anchor-border-color: A CSS color that\n   * specifies the color of the center reposition anchor's border.\n   */\n  --viewer-markup-circle-bounds-center-anchor-border-color: white;\n  /**\n   * @prop --viewer-markup-circle-bounds-center-anchor-border-width: A CSS length that\n   * specifies the width of the center reposition anchor's border.\n   */\n  --viewer-markup-circle-bounds-center-anchor-border-width: 1px;\n  /**\n   * @prop --viewer-markup-circle-bounds-center-anchor-background-color: A CSS color that\n   * specifies the background color of the center reposition anchor.\n   */\n  --viewer-markup-circle-bounds-center-anchor-background-color: var(--blue-400);\n  /**\n   * @prop --viewer-markup-circle-bounds-anchor-width: A CSS length that\n   * specifies the width of the resize and reposition anchors.\n   */\n  --viewer-markup-circle-bounds-anchor-width: 9px;\n  /**\n   * @prop --viewer-markup-circle-bounds-anchor-height: A CSS length that\n   * specifies the height of the resize and reposition anchors.\n   */\n  --viewer-markup-circle-bounds-anchor-height: 9px;\n  /**\n   * @prop --viewer-markup-circle-scale: A number that specifies the scale of the circle.\n   * This is used to scale the circle's stroke width. Defaults to 1, and is managed internally\n   * by the component.\n   */\n  --viewer-markup-circle-scale: 1;\n}\n\n.svg {\n  pointer-events: none;\n  width: 100%;\n  height: 100%;\n}\n\n.create-overlay {\n  pointer-events: auto;\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  cursor: crosshair;\n}\n\n.ellipse {\n  pointer-events: auto;\n  stroke: var(--viewer-markup-circle-ellipse-stroke-color);\n  stroke-width: calc(\n    var(--viewer-markup-circle-ellipse-stroke-width) *\n      var(--viewer-markup-circle-scale)\n  );\n  fill: var(--viewer-markup-circle-ellipse-fill-color);\n  fill-opacity: var(--viewer-markup-circle-ellipse-fill-opacity);\n  cursor: default;\n}\n\n.bounds-container {\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  overflow: hidden;\n}\n\n.bounds-outline {\n  position: absolute;\n  border-width: var(--viewer-markup-circle-bounds-outline-border-width);\n  border-color: var(--viewer-markup-circle-bounds-outline-border-color);\n  border-style: solid;\n  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);\n}\n\n.bounds-anchor-position {\n  position: absolute;\n  transform: translate(-50%, -50%);\n}\n\n.bounds-anchor {\n  pointer-events: auto;\n  cursor: default;\n  user-select: none;\n}\n\n.bounds-default-anchor {\n  width: var(--viewer-markup-circle-bounds-anchor-width);\n  height: var(--viewer-markup-circle-bounds-anchor-height);\n  box-sizing: border-box;\n  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);\n}\n\n.bounds-center-anchor {\n  border-radius: 100%;\n  border-width: var(--viewer-markup-circle-bounds-center-anchor-border-width);\n  border-color: var(--viewer-markup-circle-bounds-center-anchor-border-color);\n  border-style: solid;\n  background-color: var(\n    --viewer-markup-circle-bounds-center-anchor-background-color\n  );\n}\n\n.bounds-edge-anchor {\n  border-width: var(--viewer-markup-circle-bounds-edge-anchor-border-width);\n  border-color: var(--viewer-markup-circle-bounds-edge-anchor-border-color);\n  border-style: solid;\n  background-color: var(\n    --viewer-markup-circle-bounds-edge-anchor-background-color\n  );\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Dimensions, Point, Rectangle } from '@vertexvis/geometry';\nimport { Disposable } from '@vertexvis/utils';\n\nimport { getWindowDevicePixelRatio } from '../../lib/dom';\nimport { writeDOM } from '../../lib/stencil';\nimport {\n  MarkupCenteringBehavior,\n  MarkupInteraction,\n} from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  isValidStartEvent,\n  translateRectToScreen,\n} from '../viewer-markup/markup-utils';\nimport { SvgShadow } from '../viewer-markup/viewer-markup-components';\nimport { CircleMarkupInteractionHandler } from './interactions';\nimport { parseBounds } from './utils';\nimport { BoundingBox2d } from './viewer-markup-circle-components';\n\n/**\n * The supported markup modes.\n *\n * @see {@link ViewerMarkupCircleMode.mode} - For more details about modes.\n */\nexport type ViewerMarkupCircleMode = 'edit' | 'create' | '';\n\n@Component({\n  tag: 'vertex-viewer-markup-circle',\n  styleUrl: 'viewer-markup-circle.css',\n  shadow: true,\n})\nexport class ViewerMarkupCircle {\n  /**\n   * The bounds of the circle. Can either be an instance of a `Rectangle` or\n   * a JSON string representation in the format of `[x, y, width, height]` or\n   * `{\"x\": 0, \"y\": 0, \"width\": 10, \"height\": 10}`.\n   *\n   * Bounds are expected to have relative coordinates, with `[x, y]` from `[-0.5, 0.5]`\n   * and `[width, height]` from `[0, 1]`, e.g. `[0, 0, 0.25, 0.25]`corresponds to a circle\n   * with a diameter of one fourth the viewport's smallest size in the center of the viewport.\n   */\n  @Prop({ mutable: true, attribute: null })\n  public bounds?: Rectangle.Rectangle;\n\n  /**\n   * The bounds of the circle. Can either be an instance of a `Rectangle` or\n   * a JSON string representation in the format of `[x, y, width, height]` or\n   * `{\"x\": 0, \"y\": 0, \"width\": 0.1, \"height\": 0.1}`.\n   *\n   * Bounds are expected to have relative coordinates, with `[x, y]` from `[-0.5, 0.5]`\n   * and `[width, height]` from `[0, 1]`, e.g. `[0, 0, 0.25, 0.25]`corresponds to a circle\n   * with a diameter of one fourth the viewport's smallest size in the center of the viewport.\n   */\n  @Prop({ attribute: 'bounds' })\n  public boundsJson?: string;\n\n  /**\n   * A mode that specifies how the markup component should behave. When\n   * unset, the component will not respond to interactions with the handles.\n   * When `edit`, the markup anchors are interactive and the user is able\n   * to reposition them. When `create`, anytime the user clicks on the canvas,\n   * a new markup will be performed.\n   */\n  @Prop({ reflect: true })\n  public mode: ViewerMarkupCircleMode = '';\n\n  /**\n   * The viewer to connect to markups.\n   *\n   * This property will automatically be set when a child of a\n   * `<vertex-viewer-markup>` or `<vertex-viewer>` element.\n   */\n  @Prop()\n  public viewer?: HTMLVertexViewerElement;\n\n  /**\n   * The original viewport dimensions where this markup was created. This value is used\n   * to determine where the markup should be rendered relative to the current viewport,\n   * enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all NDC values will be considered relative to this viewport.\n   */\n  @Prop()\n  public originatingViewport?: Dimensions.Dimensions;\n\n  /**\n   * Defines the behavior of the provided markup when the originating viewport is smaller\n   * than the current viewport, or is scaled to a size smaller than the current viewport\n   * using the `scale` property.\n   *\n   * Options:\n   * - `x-only`: Markup will be centered horizontally, but not vertically.\n   * - `y-only`: Markup will be centered vertically, but not horizontally.\n   * - `both`: Markup will be centered both horizontally and vertically.\n   * - `none`: Markup will not be centered (default).\n   */\n  @Prop()\n  public centeringBehavior: MarkupCenteringBehavior = 'none';\n\n  /**\n   * The current offset of the visible viewport. This value is used to determine where\n   * markup should be rendered relative to the current viewport, enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all computed coordinates will be offset by this amount.\n   */\n  @Prop()\n  public offset?: Point.Point;\n\n  /**\n   * The scale to render this markup at. This value is used to scale the element's bounds\n   * along with any `offset` to determine the final computed coordinates.\n   *\n   * When provided, all computed coordinates will be scaled by this amount.\n   */\n  @Prop()\n  public scale = 1;\n\n  /**\n   * An event that is dispatched anytime the user begins interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionBegin!: EventEmitter<void>;\n\n  /**\n   * An event that is dispatched when the user has finished interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionEnd!: EventEmitter<MarkupInteraction>;\n\n  /**\n   * An event that is dispatched when this markup element is in view\n   * mode (`this.mode === \"\"`), and it completes a rerender.\n   */\n  @Event({ bubbles: true })\n  public viewRendered!: EventEmitter<void>;\n\n  @Element()\n  private hostEl!: HTMLVertexViewerMarkupCircleElement;\n\n  @State()\n  private elementBounds?: DOMRect;\n\n  private interactionHandler = new CircleMarkupInteractionHandler(\n    this.hostEl,\n    this.interactionBegin,\n    this.interactionEnd\n  );\n\n  private registeredHandler?: Disposable;\n\n  /**\n   * @ignore\n   */\n  protected componentWillLoad(): void {\n    this.updateViewport();\n    this.handleViewerChanged(this.viewer);\n    this.updateBoundsFromProps();\n  }\n\n  protected componentDidLoad(): void {\n    this.updateBoundsFromProps();\n\n    const resize = new ResizeObserver(() => this.updateViewport());\n    resize.observe(this.hostEl);\n\n    if (this.mode === 'create') {\n      window.addEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  protected componentDidRender(): void {\n    if (this.mode === '') {\n      this.viewRendered.emit();\n    }\n  }\n\n  protected disconnectedCallback(): void {\n    this.dispose();\n  }\n\n  @Method()\n  public async dispose(): Promise<void> {\n    this.registeredHandler?.dispose();\n    this.registeredHandler = undefined;\n\n    window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n  }\n\n  /**\n   * @ignore\n   */\n  @Watch('viewer')\n  protected async handleViewerChanged(\n    newViewer?: HTMLVertexViewerElement\n  ): Promise<void> {\n    this.registeredHandler?.dispose();\n    this.registeredHandler = undefined;\n\n    if (newViewer != null) {\n      this.registeredHandler = await newViewer.registerInteractionHandler(\n        this.interactionHandler\n      );\n    }\n  }\n\n  @Watch('bounds')\n  protected handleBoundsJsonChange(): void {\n    this.updateBoundsFromProps();\n  }\n\n  @Watch('mode')\n  protected handleModeChange(): void {\n    if (this.mode !== 'create') {\n      window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  @Watch('scale')\n  protected handleScaleChange(): void {\n    writeDOM(() => {\n      this.hostEl.style.setProperty(\n        '--viewer-markup-circle-scale',\n        this.scale.toString()\n      );\n    });\n  }\n\n  private updateViewport(): void {\n    const rect = getMarkupBoundingClientRect(this.hostEl);\n    this.elementBounds = rect;\n  }\n\n  private updateBoundsFromProps(): void {\n    this.bounds = this.bounds ?? parseBounds(this.boundsJson);\n  }\n\n  public render(): h.JSX.IntrinsicElements {\n    if (this.bounds != null && this.elementBounds != null) {\n      const relativeBounds = translateRectToScreen(\n        this.bounds,\n        this.elementBounds,\n        this.originatingViewport,\n        this.centeringBehavior,\n        this.scale\n      );\n      const center = Rectangle.center(relativeBounds);\n      const offsetX = (this.offset?.x ?? 0) / getWindowDevicePixelRatio();\n      const offsetY = (this.offset?.y ?? 0) / getWindowDevicePixelRatio();\n\n      return (\n        <Host>\n          <svg class=\"svg\" onTouchStart={this.handleTouchStart}>\n            <defs>\n              <SvgShadow id=\"circle-shadow\" />\n            </defs>\n            <g\n              transform={`translate(${offsetX} ${offsetY})`}\n              filter=\"url(#circle-shadow)\"\n            >\n              <ellipse\n                class=\"ellipse\"\n                cx={center.x}\n                cy={center.y}\n                rx={relativeBounds.width / 2}\n                ry={relativeBounds.height / 2}\n                stroke={'#000ff0'}\n                stroke-width={4}\n                fill={'none'}\n              />\n            </g>\n          </svg>\n          {this.mode === 'edit' && (\n            <BoundingBox2d\n              bounds={relativeBounds}\n              offset={{ x: offsetX, y: offsetY }}\n              onTopLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top-left', e)\n              }\n              onTopRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top-right', e)\n              }\n              onTopAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top', e)\n              }\n              onBottomLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom-left', e)\n              }\n              onBottomRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom-right', e)\n              }\n              onBottomAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom', e)\n              }\n              onLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('left', e)\n              }\n              onRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('right', e)\n              }\n              onCenterAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('center', e)\n              }\n            />\n          )}\n          {this.mode === 'create' && (\n            <div\n              class=\"create-overlay\"\n              onTouchStart={this.handleTouchStart}\n            ></div>\n          )}\n        </Host>\n      );\n    } else {\n      return (\n        <Host>\n          <div\n            class=\"create-overlay\"\n            onTouchStart={this.handleTouchStart}\n          ></div>\n        </Host>\n      );\n    }\n  }\n\n  private handleWindowPointerDown = (event: PointerEvent): void => {\n    if (isValidStartEvent(event)) {\n      this.interactionHandler.startInteraction(event);\n    }\n  };\n\n  private handleTouchStart = (event: TouchEvent): void => {\n    event.preventDefault();\n  };\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Point, Rectangle } from '@vertexvis/geometry';\n\nimport { getMouseClientPosition } from '../../lib/dom';\nimport { MarkupInteractionHandler } from '../../lib/markup/interactions';\nimport { MarkupInteraction } from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  BoundingBox2dAnchorPosition,\n  transformRectangle,\n  translatePointsToBounds,\n  translatePointToRelative,\n} from '../viewer-markup/markup-utils';\n\nexport class FreeformMarkupInteractionHandler extends MarkupInteractionHandler {\n  private pointerId?: number;\n  private min?: Point.Point;\n  private max?: Point.Point;\n\n  private resizeBounds?: Rectangle.Rectangle;\n  private resizePoints?: Point.Point[];\n  private resizeStartPosition?: Point.Point;\n\n  private anchor: BoundingBox2dAnchorPosition = 'bottom-right';\n\n  public constructor(\n    private readonly markupEl: HTMLVertexViewerMarkupFreeformElement,\n    private readonly interactionBegin: EventEmitter<void>,\n    private readonly interactionEnd: EventEmitter<MarkupInteraction>\n  ) {\n    super();\n  }\n\n  public editAnchor(\n    anchor: BoundingBox2dAnchorPosition,\n    event: PointerEvent\n  ): void {\n    if (this.markupEl.mode === 'edit' && this.elementBounds != null) {\n      this.resizeBounds = this.markupEl.bounds;\n      this.resizePoints = this.markupEl.points;\n      this.anchor = anchor;\n      this.resizeStartPosition = translatePointToRelative(\n        getMouseClientPosition(event, this.elementBounds),\n        this.elementBounds\n      );\n\n      window.addEventListener('pointermove', this.handleResizeInteractionMove);\n      window.addEventListener('pointerup', this.handleResizeInteractionEnd);\n    }\n  }\n\n  public startInteraction(event: PointerEvent): void {\n    this.handleInteractionAttempt(event);\n  }\n\n  protected computeBoundingRect(): DOMRect {\n    return getMarkupBoundingClientRect(this.markupEl);\n  }\n\n  protected handleInteractionAttempt(event: PointerEvent): void {\n    if (\n      this.markupEl.mode !== '' &&\n      this.pointerId == null &&\n      this.elementBounds != null\n    ) {\n      this.pointerId = event.pointerId;\n      const screenPosition = getMouseClientPosition(event, this.elementBounds);\n      const position = translatePointToRelative(\n        screenPosition,\n        this.elementBounds\n      );\n      this.updateMinAndMax(position);\n      this.markupEl.points = this.markupEl.points ?? [position];\n\n      this.interactionBegin.emit();\n      this.acceptInteraction();\n    }\n  }\n\n  protected handleInteractionMove(event: PointerEvent): void {\n    if (\n      this.pointerId === event.pointerId &&\n      this.markupEl.points != null &&\n      this.elementBounds != null\n    ) {\n      const screenPosition = getMouseClientPosition(event, this.elementBounds);\n      const position = translatePointToRelative(\n        screenPosition,\n        this.elementBounds\n      );\n      this.updateMinAndMax(position);\n      this.markupEl.points = [...this.markupEl.points, position];\n    }\n  }\n\n  protected handleInteractionEnd(event: PointerEvent): void {\n    if (this.pointerId === event.pointerId) {\n      if (\n        this.markupEl.mode !== '' &&\n        this.markupEl.points != null &&\n        this.markupEl.points.length > 2 &&\n        this.elementBounds != null\n      ) {\n        const screenPosition = getMouseClientPosition(\n          event,\n          this.elementBounds\n        );\n        const position = translatePointToRelative(\n          screenPosition,\n          this.elementBounds\n        );\n\n        this.updateMinAndMax(position);\n\n        this.markupEl.points = [...this.markupEl.points, position];\n\n        const newlyCreatedMarkup = this.markupEl.mode !== 'edit';\n        this.interactionEnd.emit({ markup: this.markupEl, newlyCreatedMarkup });\n      } else {\n        this.markupEl.points = undefined;\n      }\n\n      this.min = undefined;\n      this.max = undefined;\n      this.pointerId = undefined;\n    }\n  }\n\n  private handleResizeInteractionMove = (event: PointerEvent): void => {\n    if (\n      this.resizeStartPosition != null &&\n      this.elementBounds != null &&\n      this.resizeBounds != null &&\n      this.resizePoints != null\n    ) {\n      const position = translatePointToRelative(\n        getMouseClientPosition(event, this.elementBounds),\n        this.elementBounds\n      );\n\n      const updatedBounds = transformRectangle(\n        this.resizeBounds,\n        this.resizeStartPosition,\n        position,\n        this.anchor,\n        event.shiftKey\n      );\n\n      this.markupEl.points = translatePointsToBounds(\n        this.resizePoints,\n        this.resizeBounds,\n        updatedBounds\n      );\n      this.markupEl.bounds = updatedBounds;\n    }\n  };\n\n  private handleResizeInteractionEnd = (event: PointerEvent): void => {\n    window.removeEventListener('pointermove', this.handleResizeInteractionMove);\n    window.removeEventListener('pointerup', this.handleResizeInteractionEnd);\n\n    this.resizeBounds = undefined;\n\n    const newlyCreatedMarkup = this.markupEl.mode !== 'edit';\n    this.interactionEnd.emit({ markup: this.markupEl, newlyCreatedMarkup });\n  };\n\n  private updateMinAndMax(position: Point.Point): void {\n    this.min =\n      this.min != null\n        ? Point.create(\n            Math.min(this.min.x, position.x),\n            Math.min(this.min.y, position.y)\n          )\n        : position;\n    this.max =\n      this.max != null\n        ? Point.create(\n            Math.max(this.max.x, position.x),\n            Math.max(this.max.y, position.y)\n          )\n        : position;\n    this.markupEl.bounds = Rectangle.create(\n      this.min.x,\n      this.min.y,\n      this.max.x - this.min.x,\n      this.max.y - this.min.y\n    );\n  }\n}\n",":host {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n  /**\n   * @prop --viewer-markup-freeform-stroke-color: A CSS color that\n   * specifies the color of the freeform line.\n   */\n  --viewer-markup-freeform-stroke-color: var(--red-800);\n  /**\n    * @prop --viewer-markup-freeform-stroke-width: A CSS length that\n    * specifies the width of the freeform line.\n    *\n    * Note that this is scaled by the component's scale factor, so providing a scale\n    * other than 1 will result in a different stroke width.\n    */\n  --viewer-markup-freeform-stroke-width: 4px;\n  /**\n    * @prop --viewer-markup-freeform-line-join: The join behavior between\n    * the lines making up this freeform markup. Defaults to `round`.\n    */\n  --viewer-markup-freeform-line-join: round;\n  /**\n    * @prop --viewer-markup-freeform-line-cap: The cap behavior for\n    * the lines making up this freeform markup. Defaults to `round`.\n    */\n  --viewer-markup-freeform-line-cap: round;\n  /**\n   * @prop --viewer-markup-freeform-bounds-outline-border-color: A CSS color that\n   * specifies the color of the circle's selected bounding box border.\n   */\n  --viewer-markup-freeform-bounds-outline-border-color: var(--blue-400);\n  /**\n    * @prop --viewer-markup-freeform-bounds-outline-border-width: A CSS length that\n    * specifies the width of the circle's selected bounding box border.\n    */\n  --viewer-markup-freeform-bounds-outline-border-width: 1px;\n  /**\n    * @prop --viewer-markup-freeform-bounds-edge-anchor-border-color: A CSS color that\n    * specifies the color of the edge and corner resize anchors' borders.\n    */\n  --viewer-markup-freeform-bounds-edge-anchor-border-color: var(--blue-400);\n  /**\n    * @prop --viewer-markup-freeform-bounds-edge-anchor-border-width: A CSS length that\n    * specifies the width of the edge and corner resize anchors' borders.\n    */\n  --viewer-markup-freeform-bounds-edge-anchor-border-width: 1px;\n  /**\n    * @prop --viewer-markup-freeform-bounds-edge-anchor-background-color: A CSS color that\n    * specifies the background color of the edge and corner resize anchors.\n    */\n  --viewer-markup-freeform-bounds-edge-anchor-background-color: white;\n  /**\n    * @prop --viewer-markup-freeform-bounds-center-anchor-border-color: A CSS color that\n    * specifies the color of the center reposition anchor's border.\n    */\n  --viewer-markup-freeform-bounds-center-anchor-border-color: white;\n  /**\n    * @prop --viewer-markup-freeform-bounds-center-anchor-border-width: A CSS length that\n    * specifies the width of the center reposition anchor's border.\n    */\n  --viewer-markup-freeform-bounds-center-anchor-border-width: 1px;\n  /**\n    * @prop --viewer-markup-freeform-bounds-center-anchor-background-color: A CSS color that\n    * specifies the background color of the center reposition anchor.\n    */\n  --viewer-markup-freeform-bounds-center-anchor-background-color: var(\n    --blue-400\n  );\n  /**\n    * @prop --viewer-markup-freeform-bounds-anchor-width: A CSS length that\n    * specifies the width of the resize and reposition anchors.\n    */\n  --viewer-markup-freeform-bounds-anchor-width: 9px;\n  /**\n    * @prop --viewer-markup-freeform-bounds-anchor-height: A CSS length that\n    * specifies the height of the resize and reposition anchors.\n    */\n  --viewer-markup-freeform-bounds-anchor-height: 9px;\n  /**\n   * @prop --viewer-markup-freeform-scale: A number that specifies the scale of the freeform.\n   * This is used to scale the freeform's stroke width. Defaults to 1, and is managed internally\n   * by the component.\n   */\n  --viewer-markup-freeform-scale: 1;\n}\n\n.svg {\n  pointer-events: none;\n  width: 100%;\n  height: 100%;\n  position: absolute;\n  top: 0;\n  left: 0;\n}\n\n.path {\n  pointer-events: auto;\n  cursor: default;\n  stroke: var(--viewer-markup-freeform-stroke-color);\n  stroke-width: calc(\n    var(--viewer-markup-freeform-stroke-width) *\n      var(--viewer-markup-freeform-scale)\n  );\n  stroke-linejoin: var(--viewer-markup-freeform-line-join);\n  stroke-linecap: var(--viewer-markup-freeform-line-cap);\n}\n\n.create-overlay {\n  pointer-events: auto;\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n  cursor: crosshair;\n}\n\n.bounds-container {\n  pointer-events: none;\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  top: 0;\n  left: 0;\n  overflow: hidden;\n}\n\n.bounds-outline {\n  position: absolute;\n  border-width: var(--viewer-markup-freeform-bounds-outline-border-width);\n  border-color: var(--viewer-markup-freeform-bounds-outline-border-color);\n  border-style: solid;\n  box-shadow: 0 0 3px rgba(0, 0, 0, 0.3);\n}\n\n.bounds-anchor-position {\n  position: absolute;\n  transform: translate(-50%, -50%);\n}\n\n.bounds-anchor {\n  pointer-events: auto;\n  cursor: default;\n  user-select: none;\n}\n\n.bounds-default-anchor {\n  width: var(--viewer-markup-freeform-bounds-anchor-width);\n  height: var(--viewer-markup-freeform-bounds-anchor-height);\n  box-sizing: border-box;\n  box-shadow: 0 0 2px rgba(0, 0, 0, 0.3);\n}\n\n.bounds-center-anchor {\n  border-radius: 100%;\n  border-width: var(--viewer-markup-freeform-bounds-center-anchor-border-width);\n  border-color: var(--viewer-markup-freeform-bounds-center-anchor-border-color);\n  border-style: solid;\n  background-color: var(\n    --viewer-markup-freeform-bounds-center-anchor-background-color\n  );\n}\n\n.bounds-edge-anchor {\n  border-width: var(--viewer-markup-freeform-bounds-edge-anchor-border-width);\n  border-color: var(--viewer-markup-freeform-bounds-edge-anchor-border-color);\n  border-style: solid;\n  background-color: var(\n    --viewer-markup-freeform-bounds-edge-anchor-background-color\n  );\n}\n","import {\n  Component,\n  Element,\n  Event,\n  EventEmitter,\n  h,\n  Host,\n  Method,\n  Prop,\n  State,\n  Watch,\n} from '@stencil/core';\nimport { Dimensions, Point, Rectangle } from '@vertexvis/geometry';\nimport { Disposable } from '@vertexvis/utils';\n\nimport { getWindowDevicePixelRatio } from '../../lib/dom';\nimport { writeDOM } from '../../lib/stencil';\nimport {\n  MarkupCenteringBehavior,\n  MarkupInteraction,\n} from '../../lib/types/markup';\nimport { getMarkupBoundingClientRect } from '../viewer-markup/dom';\nimport {\n  isValidStartEvent,\n  translatePointToScreen,\n  translateRectToScreen,\n} from '../viewer-markup/markup-utils';\nimport { SvgShadow } from '../viewer-markup/viewer-markup-components';\nimport { parseBounds } from '../viewer-markup-circle/utils';\nimport { BoundingBox2d } from '../viewer-markup-circle/viewer-markup-circle-components';\nimport { FreeformMarkupInteractionHandler } from './interactions';\nimport { parsePoints } from './utils';\n\n/**\n * The supported markup modes.\n *\n * @see {@link ViewerMarkupFreeformMode.mode} - For more details about modes.\n */\nexport type ViewerMarkupFreeformMode = 'edit' | 'create' | '';\n\n@Component({\n  tag: 'vertex-viewer-markup-freeform',\n  styleUrl: 'viewer-markup-freeform.css',\n  shadow: true,\n})\nexport class ViewerMarkupFreeform {\n  /**\n   * The positions of the various points of this freeform markup. Can either be an array of\n   * `Point`s or a JSON string representation in the format of `[[x1, y1], [x2, y2]]` or\n   * `[{\"x\": 0, \"y\": 0}, {\"x\": 0, \"y\": 0}]`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ mutable: true, attribute: null })\n  public points?: Point.Point[];\n\n  /**\n   * The positions of the various points of this freeform markup. Can either be an array of\n   * `Point`s or a JSON string representation in the format of `[[x1, y1], [x2, y2]]` or\n   * `[{\"x\": 0, \"y\": 0}, {\"x\": 0, \"y\": 0}]`.\n   *\n   * Points are expected to be relative coordinates from `[-0.5, 0.5]`,\n   * e.g. `[0, 0]` corresponds to a point in the center of the viewport.\n   */\n  @Prop({ attribute: 'points' })\n  public pointsJson?: string;\n\n  /**\n   * The bounds of the freeform. Can either be an instance of a `Rectangle` or\n   * a JSON string representation in the format of `[x, y, width, height]` or\n   * `{\"x\": 0, \"y\": 0, \"width\": 10, \"height\": 10}`.\n   *\n   * Bounds are expected to have relative coordinates, with `[x, y]` from `[-0.5, 0.5]`\n   * and `[width, height]` from `[0, 1]`, e.g. `[0, 0, 0.25, 0.25]`corresponds to a freeform\n   * with a diameter of one fourth the viewport's smallest size in the center of the viewport.\n   */\n  @Prop({ mutable: true, attribute: null })\n  public bounds?: Rectangle.Rectangle;\n\n  /**\n   * The bounds of the freeform. Can either be an instance of a `Rectangle` or\n   * a JSON string representation in the format of `[x, y, width, height]` or\n   * `{\"x\": 0, \"y\": 0, \"width\": 0.1, \"height\": 0.1}`.\n   *\n   * Bounds are expected to have relative coordinates, with `[x, y]` from `[-0.5, 0.5]`\n   * and `[width, height]` from `[0, 1]`, e.g. `[0, 0, 0.25, 0.25]`corresponds to a freeform\n   * with a diameter of one fourth the viewport's smallest size in the center of the viewport.\n   */\n  @Prop({ attribute: 'bounds' })\n  public boundsJson?: string;\n\n  /**\n   * A mode that specifies how the markup component should behave. When\n   * unset, the component will not respond to interactions with the handles.\n   * When `edit`, the markup anchors are interactive and the user is able\n   * to reposition them. When `create`, anytime the user clicks on the canvas,\n   * a new markup will be performed.\n   */\n  @Prop({ reflect: true })\n  public mode: ViewerMarkupFreeformMode = '';\n\n  /**\n   * The viewer to connect to markups.\n   *\n   * This property will automatically be set when a child of a\n   * `<vertex-viewer-markup>` or `<vertex-viewer>` element.\n   */\n  @Prop()\n  public viewer?: HTMLVertexViewerElement;\n\n  /**\n   * The original viewport dimensions where this markup was created. This value is used\n   * to determine where the markup should be rendered relative to the current viewport,\n   * enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all NDC values will be considered relative to this viewport.\n   */\n  @Prop()\n  public originatingViewport?: Dimensions.Dimensions;\n\n  /**\n   * Defines the behavior of the provided markup when the originating viewport is smaller\n   * than the current viewport, or is scaled to a size smaller than the current viewport\n   * using the `scale` property.\n   *\n   * Options:\n   * - `x-only`: Markup will be centered horizontally, but not vertically.\n   * - `y-only`: Markup will be centered vertically, but not horizontally.\n   * - `both`: Markup will be centered both horizontally and vertically.\n   * - `none`: Markup will not be centered (default).\n   */\n  @Prop()\n  public centeringBehavior: MarkupCenteringBehavior = 'none';\n\n  /**\n   * The current offset of the visible viewport. This value is used to determine where\n   * markup should be rendered relative to the current viewport, enabling some markup to appear \"off-screen\".\n   *\n   * When provided, all computed coordinates will be offset by this amount.\n   */\n  @Prop()\n  public offset?: Point.Point;\n\n  /**\n   * The scale to render this markup at. This value is used to scale the element's bounds\n   * along with any `offset` to determine the final computed coordinates.\n   *\n   * When provided, all computed coordinates will be scaled by this amount.\n   */\n  @Prop()\n  public scale = 1;\n\n  /**\n   * An event that is dispatched anytime the user begins interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionBegin!: EventEmitter<void>;\n\n  /**\n   * An event that is dispatched when the user has finished interacting with the\n   * markup.\n   */\n  @Event({ bubbles: true })\n  public interactionEnd!: EventEmitter<MarkupInteraction>;\n\n  /**\n   * An event that is dispatched when this markup element is in view\n   * mode (`this.mode === \"\"`), and it completes a rerender.\n   */\n  @Event({ bubbles: true })\n  public viewRendered!: EventEmitter<void>;\n\n  @Element()\n  private hostEl!: HTMLVertexViewerMarkupFreeformElement;\n\n  @State()\n  private elementBounds?: DOMRect;\n\n  @State()\n  private screenPoints: Point.Point[] = [];\n\n  private interactionHandler = new FreeformMarkupInteractionHandler(\n    this.hostEl,\n    this.interactionBegin,\n    this.interactionEnd\n  );\n\n  private registeredInteraction?: Disposable;\n\n  /**\n   * @ignore\n   */\n  protected componentWillLoad(): void {\n    this.updateViewport();\n    this.handleViewerChanged(this.viewer);\n    this.updatePointsFromProps();\n  }\n\n  protected componentDidLoad(): void {\n    const resize = new ResizeObserver(() => this.updateViewport());\n    resize.observe(this.hostEl);\n\n    if (this.mode === 'create') {\n      window.addEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  protected componentDidRender(): void {\n    if (this.mode === '') {\n      this.viewRendered.emit();\n    }\n  }\n\n  protected disconnectedCallback(): void {\n    this.dispose();\n  }\n\n  @Method()\n  public async dispose(): Promise<void> {\n    this.registeredInteraction?.dispose();\n    this.registeredInteraction = undefined;\n\n    window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n  }\n\n  /**\n   * @ignore\n   */\n  @Watch('viewer')\n  protected async handleViewerChanged(\n    newViewer?: HTMLVertexViewerElement\n  ): Promise<void> {\n    this.registeredInteraction?.dispose();\n    this.registeredInteraction = undefined;\n\n    if (newViewer != null) {\n      this.registeredInteraction = await newViewer.registerInteractionHandler(\n        this.interactionHandler\n      );\n    }\n  }\n\n  @Watch('originatingViewport')\n  @Watch('offset')\n  @Watch('scale')\n  @Watch('bounds')\n  @Watch('points')\n  protected recomputePointsFromProps(): void {\n    this.updatePointsFromProps();\n  }\n\n  @Watch('scale')\n  protected handleScaleChange(): void {\n    writeDOM(() => {\n      this.hostEl.style.setProperty(\n        '--viewer-markup-freeform-scale',\n        this.scale.toString()\n      );\n    });\n  }\n\n  @Watch('mode')\n  protected handleModeChange(): void {\n    if (this.mode !== 'create') {\n      window.removeEventListener('pointerdown', this.handleWindowPointerDown);\n    }\n  }\n\n  private updateViewport(): void {\n    const rect = getMarkupBoundingClientRect(this.hostEl);\n    this.elementBounds = rect;\n    this.screenPoints = this.convertPointsToScreen() ?? this.screenPoints;\n  }\n\n  private updatePointsFromProps(): void {\n    this.points = this.points ?? parsePoints(this.pointsJson);\n    this.screenPoints = this.convertPointsToScreen() ?? [];\n    this.bounds = this.bounds ?? parseBounds(this.boundsJson);\n  }\n\n  public render(): h.JSX.IntrinsicElements {\n    if (this.screenPoints.length > 0 && this.elementBounds != null) {\n      const offsetX = (this.offset?.x ?? 0) / getWindowDevicePixelRatio();\n      const offsetY = (this.offset?.y ?? 0) / getWindowDevicePixelRatio();\n\n      return (\n        <Host>\n          <svg class=\"svg\" onTouchStart={this.handleTouchStart}>\n            <defs>\n              <SvgShadow id=\"freeform-markup-shadow\" />\n            </defs>\n            <g\n              transform={`translate(${offsetX} ${offsetY})`}\n              filter=\"url(#freeform-markup-shadow)\"\n            >\n              <path\n                class=\"path\"\n                d={this.screenPoints.reduce(\n                  (d, pt) => `${d}L${pt.x},${pt.y}`,\n                  `M${this.screenPoints[0].x},${this.screenPoints[0].y}`\n                )}\n                fill=\"none\"\n              />\n            </g>\n          </svg>\n          {this.mode === 'edit' && this.bounds != null && (\n            <BoundingBox2d\n              bounds={translateRectToScreen(\n                this.bounds,\n                this.elementBounds,\n                this.originatingViewport,\n                this.centeringBehavior,\n                this.scale\n              )}\n              offset={{ x: offsetX, y: offsetY }}\n              onTopLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top-left', e)\n              }\n              onTopRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top-right', e)\n              }\n              onTopAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('top', e)\n              }\n              onBottomLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom-left', e)\n              }\n              onBottomRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom-right', e)\n              }\n              onBottomAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('bottom', e)\n              }\n              onLeftAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('left', e)\n              }\n              onRightAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('right', e)\n              }\n              onCenterAnchorPointerDown={(e) =>\n                this.interactionHandler.editAnchor('center', e)\n              }\n            />\n          )}\n          {this.mode === 'create' && (\n            <div\n              class=\"create-overlay\"\n              onTouchStart={this.handleTouchStart}\n            ></div>\n          )}\n        </Host>\n      );\n    } else {\n      return (\n        <Host>\n          <div\n            class=\"create-overlay\"\n            onTouchStart={this.handleTouchStart}\n          ></div>\n        </Host>\n      );\n    }\n  }\n\n  private handleWindowPointerDown = (event: PointerEvent): void => {\n    if (isValidStartEvent(event)) {\n      this.interactionHandler.startInteraction(event);\n    }\n  };\n\n  private handleTouchStart = (event: TouchEvent): void => {\n    event.preventDefault();\n  };\n\n  private convertPointsToScreen(): Point.Point[] | undefined {\n    const elementBounds = this.elementBounds;\n    if (elementBounds != null) {\n      return this.points?.map((pt) =>\n        translatePointToScreen(\n          pt,\n          elementBounds,\n          this.originatingViewport,\n          this.centeringBehavior,\n          this.scale\n        )\n      );\n    }\n  }\n}\n"],"mappings":"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","ignoreList":[]}