@vertexvis/viewer 0.18.1 → 0.18.2-testing.0

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

@@ -0,0 +1,295 @@
+/*!
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
+ */
+import { h, proxyCustomElement, HTMLElement as HTMLElement$1, Host } from '@stencil/core/internal/client';
+import { m as matrix4, v as vector3 } from './bundle.esm.js';
+import './streamAttributes.js';
+import { V as Viewport } from './viewport.js';
+
+function isVertexViewerDomElement(el) {
+  return (el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-ELEMENT');
+}
+
+function isVertexViewerDomGroup(el) {
+  return ((el instanceof HTMLElement && el.nodeName === 'VERTEX-VIEWER-DOM-GROUP') ||
+    (el instanceof HTMLElement && el.dataset.isDomGroupElement != null));
+}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const Renderer2d = (_, children) => {
+  return h("div", { class: "root-2d" }, children);
+};
+function update2d(hostEl, parentWorldMatrix, viewport, camera, depthBuffer) {
+  const elements = getElementDepths(hostEl, parentWorldMatrix, camera).sort((a, b) => a.distanceToCamera - b.distanceToCamera);
+  for (let i = 0; i < elements.length; i++) {
+    const { element, worldMatrix, worldPosition } = elements[i];
+    const occluded = !element.occlusionOff && (depthBuffer === null || depthBuffer === void 0 ? void 0 : depthBuffer.isOccluded(worldPosition, viewport));
+    const screenPt = getScreenPosition(worldPosition, camera.projectionViewMatrix, viewport);
+    updateTransform(element, screenPt);
+    updateDepth(element, i, elements.length);
+    update2d(element, worldMatrix, viewport, camera, depthBuffer);
+    element.occluded = occluded !== null && occluded !== void 0 ? occluded : false;
+    element.classList.add('ready');
+  }
+}
+function getElementDepths(element, parentWorldMatrix, camera) {
+  const results = [];
+  for (let i = 0; i < element.children.length; i++) {
+    const child = element.children[i];
+    if (isVertexViewerDomGroup(child)) {
+      const worldMatrix = matrix4.multiply(parentWorldMatrix, child.matrix);
+      results.push(...getElementDepths(child, worldMatrix, camera));
+    }
+    else if (isVertexViewerDomElement(child)) {
+      const worldMatrix = matrix4.multiply(parentWorldMatrix, child.matrix);
+      const worldPosition = vector3.fromMatrixPosition(worldMatrix);
+      const distanceToCamera = vector3.distanceSquared(camera.position, worldPosition);
+      results.push({
+        element: child,
+        worldMatrix,
+        worldPosition,
+        distanceToCamera,
+      });
+    }
+  }
+  return results;
+}
+function updateTransform(element, relativePt) {
+  element.style.transform = [
+    `translate(-50%, -50%)`,
+    `translate(${relativePt.x}px, ${relativePt.y}px)`,
+  ].join(' ');
+}
+function updateDepth(element, index, elementCount) {
+  element.style.zIndex = `${elementCount - index}`;
+}
+function getScreenPosition(pt, projectionViewMatrix, viewport) {
+  const ndcPt = vector3.transformMatrix(pt, projectionViewMatrix);
+  return viewport.transformVectorToViewport(ndcPt);
+}
+
+// eslint-disable-next-line @typescript-eslint/no-unused-vars
+const Renderer3d = ({ camera, viewport }, children) => {
+  const pMatrix = matrix4.toObject(camera.projectionMatrix);
+  const fovY = camera.isOrthographic()
+    ? ((camera.far * 2) / (camera.fovHeight * 2)) * (viewport.height / 2)
+    : pMatrix.m22 * (viewport.height / 2);
+  const cameraTransform = [
+    `translateZ(${fovY}px)`,
+    getCameraCssMatrix(camera.viewMatrix),
+    `translate(${viewport.width / 2}px, ${viewport.height / 2}px)`,
+  ].join(' ');
+  return (h("div", { class: "root-3d", style: { perspective: `${fovY}px` } },
+    h("div", { class: "camera", style: { transform: cameraTransform } }, children)));
+};
+function update3d(element, parentWorldMatrix, viewport, camera, depthBuffer) {
+  for (let i = 0; i < element.children.length; i++) {
+    const el = element.children[i];
+    if (isVertexViewerDomElement(el)) {
+      updateElement(el, parentWorldMatrix, viewport, camera, depthBuffer);
+    }
+    else if (isVertexViewerDomGroup(el)) {
+      updateGroup(el, parentWorldMatrix, viewport, camera, depthBuffer);
+    }
+  }
+}
+function updateElement(element, parentWorldMatrix, viewport, camera, depthBuffer) {
+  const worldMatrix = matrix4.multiply(parentWorldMatrix, element.matrix);
+  const positionWorld = vector3.fromMatrixPosition(worldMatrix);
+  const occluded = !element.occlusionOff && (depthBuffer === null || depthBuffer === void 0 ? void 0 : depthBuffer.isOccluded(positionWorld, viewport));
+  element.occluded = occluded !== null && occluded !== void 0 ? occluded : false;
+  element.classList.add('ready');
+  if (element.billboardOff) {
+    element.style.transform = getElementCssMatrix(worldMatrix);
+  }
+  else {
+    let m = camera.viewMatrix;
+    m = matrix4.transpose(m);
+    m = matrix4.position(m, worldMatrix);
+    m = matrix4.scale(m, element.scale);
+    m[3] = 0;
+    m[7] = 0;
+    m[11] = 0;
+    m[15] = 1;
+    element.style.transform = getElementCssMatrix(m);
+  }
+  update3d(element, worldMatrix, viewport, camera, depthBuffer);
+}
+function updateGroup(element, parentWorldMatrix, viewport, camera, depthBuffer) {
+  const worldMatrix = matrix4.multiply(parentWorldMatrix, element.matrix);
+  update3d(element, worldMatrix, viewport, camera, depthBuffer);
+}
+function getCameraCssMatrix(viewMatrix) {
+  const elements = [
+    epsilon(viewMatrix[0]),
+    epsilon(-viewMatrix[1]),
+    epsilon(viewMatrix[2]),
+    epsilon(viewMatrix[3]),
+    epsilon(viewMatrix[4]),
+    epsilon(-viewMatrix[5]),
+    epsilon(viewMatrix[6]),
+    epsilon(viewMatrix[7]),
+    epsilon(viewMatrix[8]),
+    epsilon(-viewMatrix[9]),
+    epsilon(viewMatrix[10]),
+    epsilon(viewMatrix[11]),
+    epsilon(viewMatrix[12]),
+    epsilon(-viewMatrix[13]),
+    epsilon(viewMatrix[14]),
+    epsilon(viewMatrix[15]),
+  ].join(', ');
+  return `matrix3d(${elements})`;
+}
+function getElementCssMatrix(matrix) {
+  const values = [
+    epsilon(matrix[0]),
+    epsilon(matrix[1]),
+    epsilon(matrix[2]),
+    epsilon(matrix[3]),
+    epsilon(-matrix[4]),
+    epsilon(-matrix[5]),
+    epsilon(-matrix[6]),
+    epsilon(-matrix[7]),
+    epsilon(matrix[8]),
+    epsilon(matrix[9]),
+    epsilon(matrix[10]),
+    epsilon(matrix[11]),
+    epsilon(matrix[12]),
+    epsilon(matrix[13]),
+    epsilon(matrix[14]),
+    epsilon(matrix[15]),
+  ].join(', ');
+  return [`translate(-50%, -50%)`, `matrix3d(${values})`].join(' ');
+}
+function epsilon(value) {
+  return Math.abs(value) < 1e-10 ? 0 : value;
+}
+
+const viewerDomRendererCss = ":host{position:absolute;top:0;bottom:0;left:0;right:0;overflow:hidden;pointer-events:none}.root-3d{width:100%;height:100%;pointer-events:inherit}.camera{transform-style:preserve-3d;pointer-events:inherit;width:100%;height:100%}";
+
+const ViewerDomRenderer = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement$1 {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Specifies the drawing mode for the renderer.
+     *
+     * When in `3d` mode, elements are positioned using CSS 3D transforms and will
+     * scale and rotate with the camera. In `2d` mode, a simpler 2D transform is
+     * used, and elements will not scale or rotate with camera changes.
+     */
+    this.drawMode = '3d';
+    this.viewport = new Viewport(0, 0);
+    this.invalidateFrameCounter = 0;
+    this.handleViewerFrameDrawn = async () => {
+      this.updatePropsFromViewer();
+    };
+  }
+  /**
+   * @ignore
+   */
+  componentWillLoad() {
+    var _a;
+    const resized = new ResizeObserver(() => this.handleResize());
+    resized.observe(this.hostEl);
+    const mutation = new MutationObserver(() => this.handleChildrenChange());
+    mutation.observe(this.hostEl, { childList: true });
+    this.handleViewerChange(this.viewer, undefined);
+    if (((_a = this.viewer) === null || _a === void 0 ? void 0 : _a.frame) != null) {
+      this.handleViewerFrameDrawn();
+    }
+  }
+  /**
+   * @ignore
+   */
+  render() {
+    if (this.camera != null) {
+      if (this.drawMode === '2d') {
+        return (h(Host, null, h(Renderer2d, null, h("slot", null))));
+      }
+      else {
+        return (h(Host, null, h(Renderer3d, { camera: this.camera, viewport: this.viewport }, h("slot", null))));
+      }
+    }
+    else {
+      return h(Host, null);
+    }
+  }
+  /**
+   * @ignore
+   */
+  componentWillRender() {
+    this.updateElements();
+  }
+  /**
+   * @ignore
+   */
+  handleViewerChange(newViewer, oldViewer) {
+    oldViewer === null || oldViewer === void 0 ? void 0 : oldViewer.removeEventListener('frameDrawn', this.handleViewerFrameDrawn);
+    newViewer === null || newViewer === void 0 ? void 0 : newViewer.addEventListener('frameDrawn', this.handleViewerFrameDrawn);
+  }
+  /**
+   * @ignore
+   */
+  handlePropertyChange() {
+    this.invalidateFrame();
+  }
+  invalidateFrame() {
+    this.invalidateFrameCounter = this.invalidateFrameCounter + 1;
+  }
+  async updateElements() {
+    const { viewport, camera } = this;
+    const worldMatrix = matrix4.makeIdentity();
+    if (camera != null) {
+      if (this.drawMode === '3d') {
+        update3d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);
+      }
+      else {
+        update2d(this.hostEl, worldMatrix, viewport, camera, this.depthBuffer);
+      }
+    }
+  }
+  handleResize() {
+    const bounds = this.hostEl.getBoundingClientRect();
+    this.viewport = new Viewport(bounds.width, bounds.height);
+  }
+  handleChildrenChange() {
+    this.invalidateFrame();
+  }
+  async updatePropsFromViewer() {
+    const { frame, depthBuffers } = this.viewer || {};
+    this.depthBuffer =
+      depthBuffers === 'all' ? await (frame === null || frame === void 0 ? void 0 : frame.depthBuffer()) : undefined;
+    this.camera = frame === null || frame === void 0 ? void 0 : frame.scene.camera;
+  }
+  get hostEl() { return this; }
+  static get watchers() { return {
+    "viewer": ["handleViewerChange"]
+  }; }
+  static get style() { return viewerDomRendererCss; }
+}, [1, "vertex-viewer-dom-renderer", {
+    "drawMode": [1, "draw-mode"],
+    "viewer": [16],
+    "camera": [1040],
+    "depthBuffer": [1040],
+    "viewport": [32],
+    "invalidateFrameCounter": [32]
+  }, [[0, "propertyChange", "handlePropertyChange"]]]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["vertex-viewer-dom-renderer"];
+  components.forEach(tagName => { switch (tagName) {
+    case "vertex-viewer-dom-renderer":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ViewerDomRenderer);
+      }
+      break;
+  } });
+}
+
+export { ViewerDomRenderer as V, defineCustomElement as d };
+
+//# sourceMappingURL=viewer-dom-renderer.js.map

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

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

package/dist/components/viewer-icon.js

@@ -0,0 +1,87 @@
+/*!
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
+ */
+import { proxyCustomElement, HTMLElement, h, Fragment, Host } from '@stencil/core/internal/client';
+import { c as classnames } from './index2.js';
+
+const viewerIconCss = ":host{display:inline-block;width:1em;height:1em;fill:currentColor}:host(.size-sm){font-size:16px}:host(.size-md){font-size:24px}:host(.size-lg){font-size:32px}svg{display:block;width:100%;height:100%}";
+
+const ViewerIcon = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * The size of the icon. Can be `'sm' | 'md' | 'lg' | undefined`. Predefined
+     * sizes are set to:
+     *
+     *  * `sm`: 16px
+     *  * `md`: 24px
+     *  * `lg`: 32px
+     *
+     * A custom size can be supplied by setting this field to `undefined` and
+     * setting `font-size` through CSS. Defaults to `md`.
+     */
+    this.size = 'md';
+  }
+  render() {
+    if (this.name === 'fit-all') {
+      return this.renderSvgIcon(h("path", { d: "M6.15,9.15l-2.5,2.5L2,10v4H6L4.35,12.35l2.5-2.5a.49.49,0,0,0-.7-.7Zm-1.8-5.5L6,2H2V6L3.65,4.35l2.5,2.5a.49.49,0,0,0,.7-.7ZM10,2l1.65,1.65-2.5,2.5a.49.49,0,0,0,.7.7l2.5-2.5L14,6V2ZM9.85,9.15a.49.49,0,0,0-.7.7l2.5,2.5L10,14h4V10l-1.65,1.65Z" }));
+    }
+    else if (this.name === 'eye-open') {
+      return this.renderSvgIcon(h("path", { d: "M8 5a3 3 0 103 3 3 3 0 00-3-3zm4.65-1.17A8.53 8.53 0 008 2.5a8.53 8.53 0 00-4.65 1.33A6.57 6.57 0 00.51 7.89v.22a6.57 6.57 0 002.84 4.06A8.53 8.53 0 008 13.5a8.53 8.53 0 004.65-1.33 6.57 6.57 0 002.84-4.06v-.22a6.57 6.57 0 00-2.84-4.06zm-.55 7.5A7.52 7.52 0 018 12.5a7.52 7.52 0 01-4.1-1.17A5.49 5.49 0 011.53 8 5.49 5.49 0 013.9 4.67 7.52 7.52 0 018 3.5a7.52 7.52 0 014.1 1.17A5.49 5.49 0 0114.47 8a5.49 5.49 0 01-2.37 3.33z" }));
+    }
+    else if (this.name === 'eye-half') {
+      return this.renderSvgIcon(h("path", { d: "M13.35 2.65a.48.48 0 00-.7 0l-.78.77a8.71 8.71 0 00-8.52.41A6.57 6.57 0 00.51 7.89v.22a6.58 6.58 0 002.71 4l-.57.58a.49.49 0 00.7.7l10-10a.48.48 0 000-.74zM9.73 5.56a3 3 0 00-4.17 4.17l-1.62 1.62A5.49 5.49 0 011.53 8 5.49 5.49 0 013.9 4.67 7.52 7.52 0 018 3.5a7.67 7.67 0 013.12.67zm3.61-1.2l-.72.72A5.45 5.45 0 0114.47 8a5.49 5.49 0 01-2.37 3.33A7.52 7.52 0 018 12.5a8.15 8.15 0 01-2.41-.38l-.78.78a8.9 8.9 0 003.19.6 8.53 8.53 0 004.65-1.33 6.57 6.57 0 002.84-4.06v-.22a6.56 6.56 0 00-2.15-3.53z" }));
+    }
+    else if (this.name === 'eye-half-dotted') {
+      return this.renderSvgIcon(h(Fragment, null, h("path", { d: "M4.12 11.46A5.62 5.62 0 011.52 8 5.57 5.57 0 013.9 4.67 7.52 7.52 0 018 3.5a7.7 7.7 0 013.33.75l.74-.74A8.67 8.67 0 008 2.5a8.53 8.53 0 00-4.65 1.33A6.57 6.57 0 00.51 7.89v.22a6.54 6.54 0 002.88 4.08z" }), h("path", { d: "M8 5a3 3 0 00-3 3 3 3 0 00.69 1.89l4.2-4.2A3 3 0 008 5zM5.88 5.88zM9.2 12.41a.51.51 0 00-.42.57.5.5 0 00.56.42.5.5 0 00.43-.57.51.51 0 00-.57-.42zM6.77 12.41a.5.5 0 00-.57.42.49.49 0 00.41.57.5.5 0 10.15-1zM14.48 5.61a.5.5 0 00-.7-.12.49.49 0 00-.12.69.5.5 0 00.82-.57zM11.5 11.68a.5.5 0 00-.22.67.51.51 0 00.68.22.5.5 0 00-.46-.89zM15.07 7.77a.52.52 0 00-.62.35.51.51 0 00.35.62.5.5 0 00.61-.35.52.52 0 00-.34-.62zM13.36 10.21a.5.5 0 10.76.64.49.49 0 00-.06-.7.51.51 0 00-.7.06z" })));
+    }
+    else if (this.name === 'chevron-right') {
+      return this.renderSvgIcon(h("path", { d: "M10.83,7.62l-4-3.5A.5.5,0,0,0,6,4.5v7a.5.5,0,0,0,.83.38l4-3.5a.51.51,0,0,0,0-.76Z" }));
+    }
+    else if (this.name === 'chevron-down') {
+      return this.renderSvgIcon(h("path", { d: "M11.88,9.17l-3.5-4a.51.51,0,0,0-.76,0l-3.5,4A.5.5,0,0,0,4.5,10h7a.5.5,0,0,0,.38-.83Z", transform: "rotate(180 8 8)" }));
+    }
+    else if (this.name === 'search') {
+      return this.renderSvgIcon(h("path", { d: "M14.85 14.15l-4-4a.37.37 0 00-.2-.12 5.45 5.45 0 10-.62.62.37.37 0 00.12.2l4 4a.49.49 0 00.7-.7zM9.71 9.71a4.51 4.51 0 01-6.42 0 4.51 4.51 0 010-6.42 4.51 4.51 0 016.42 0 4.51 4.51 0 010 6.42z" }));
+    }
+    else if (this.name === 'close-circle') {
+      return this.renderSvgIcon(h("path", { d: "M8 1a7 7 0 107 7 7 7 0 00-7-7zm2.85 9.15a.49.49 0 01-.7.7L8 8.71l-2.15 2.14a.49.49 0 01-.7-.7L7.29 8 5.15 5.85a.49.49 0 01.7-.7L8 7.29l2.15-2.14a.49.49 0 01.7.7L8.71 8z" }));
+    }
+    else if (this.name === 'pin-fill') {
+      return this.renderSvgIcon(h("path", { d: "M8,.55A5.9,5.9,0,0,0,2.1,6.44a9.14,9.14,0,0,0,2.66,6.24,11.44,11.44,0,0,0,1.93,1.65,7.43,7.43,0,0,0,.73.44l.28.12a.78.78,0,0,0,.6,0,6.65,6.65,0,0,0,1.34-.79,11.79,11.79,0,0,0,2.76-2.88,8.59,8.59,0,0,0,1.5-4.78A5.9,5.9,0,0,0,8,.55ZM8,8.44a2,2,0,1,1,2-2A2,2,0,0,1,8,8.44Z" }));
+    }
+    else {
+      return h("svg", null);
+    }
+  }
+  renderSvgIcon(content) {
+    return (h(Host, { class: classnames({
+        'size-sm': this.size === 'sm',
+        'size-md': this.size === 'md',
+        'size-lg': this.size === 'lg',
+      }) }, h("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 16 16" }, content)));
+  }
+  static get style() { return viewerIconCss; }
+}, [1, "vertex-viewer-icon", {
+    "name": [1],
+    "size": [1]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["vertex-viewer-icon"];
+  components.forEach(tagName => { switch (tagName) {
+    case "vertex-viewer-icon":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ViewerIcon);
+      }
+      break;
+  } });
+}
+
+export { ViewerIcon as V, defineCustomElement as d };
+
+//# sourceMappingURL=viewer-icon.js.map

package/dist/components/viewer-icon.js.map

@@ -0,0 +1 @@
+{"file":"viewer-icon.js","mappings":";;;;;;AAAA,MAAM,aAAa,GAAG,0MAA0M;;MC2BnN,UAAU;EALvB;;;;;;;;;;;;;;;IAwBS,SAAI,GAAoB,IAAI,CAAC;GAmErC;EAjEQ,MAAM;IACX,IAAI,IAAI,CAAC,IAAI,KAAK,SAAS,EAAE;MAC3B,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,gPAAgP,GAAG,CAC5P,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;MACnC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,2aAA2a,GAAG,CACvb,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;MACnC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,mfAAmf,GAAG,CAC/f,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,iBAAiB,EAAE;MAC1C,OAAO,IAAI,CAAC,aAAa,CACvB,EAAC,QAAQ,QACP,YAAM,CAAC,EAAC,0MAA0M,GAAG,EACrN,YAAM,CAAC,EAAC,ieAAie,GAAG,CACne,CACZ,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,eAAe,EAAE;MACxC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,mFAAmF,GAAG,CAC/F,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,cAAc,EAAE;MACvC,OAAO,IAAI,CAAC,aAAa,CACvB,YACE,CAAC,EAAC,sFAAsF,EACxF,SAAS,EAAC,iBAAiB,GAC3B,CACH,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,QAAQ,EAAE;MACjC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,kMAAkM,GAAG,CAC9M,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,cAAc,EAAE;MACvC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,0KAA0K,GAAG,CACtL,CAAC;KACH;SAAM,IAAI,IAAI,CAAC,IAAI,KAAK,UAAU,EAAE;MACnC,OAAO,IAAI,CAAC,aAAa,CACvB,YAAM,CAAC,EAAC,+QAA+Q,GAAG,CAC3R,CAAC;KACH;SAAM;MACL,OAAO,cAAO,CAAC;KAChB;GACF;EAEO,aAAa,CACnB,OAAgC;IAEhC,QACE,EAAC,IAAI,IACH,KAAK,EAAEA,UAAS,CAAC;QACf,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;QAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;QAC7B,SAAS,EAAE,IAAI,CAAC,IAAI,KAAK,IAAI;OAC9B,CAAC,IAEF,WAAK,KAAK,EAAC,4BAA4B,EAAC,OAAO,EAAC,WAAW,IACxD,OAAO,CACJ,CACD,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;","names":["classname"],"sources":["./src/components/viewer-icon/viewer-icon.css?tag=vertex-viewer-icon&encapsulation=shadow","./src/components/viewer-icon/viewer-icon.tsx"],"sourcesContent":[":host {\n  display: inline-block;\n  width: 1em;\n  height: 1em;\n  fill: currentColor;\n}\n\n:host(.size-sm) {\n  font-size: 16px;\n}\n\n:host(.size-md) {\n  font-size: 24px;\n}\n\n:host(.size-lg) {\n  font-size: 32px;\n}\n\nsvg {\n  display: block;\n  width: 100%;\n  height: 100%;\n}\n","import { Component, Fragment, h, Host, Prop } from '@stencil/core';\nimport classname from 'classnames';\n\n/**\n * The names of the icons that the `<vertex-viewer-icon>` element can display.\n */\nexport type ViewerIconName =\n  | 'fit-all'\n  | 'eye-open'\n  | 'eye-half'\n  | 'eye-half-dotted'\n  | 'chevron-right'\n  | 'chevron-down'\n  | 'search'\n  | 'close-circle'\n  | 'pin-fill';\n\n/**\n * The predefined sizes for icons.\n */\nexport type ViewerIconSize = 'sm' | 'md' | 'lg' | undefined;\n\n@Component({\n  tag: 'vertex-viewer-icon',\n  styleUrl: 'viewer-icon.css',\n  shadow: true,\n})\nexport class ViewerIcon {\n  /**\n   * The name of the icon to render.\n   */\n  @Prop()\n  public name?: ViewerIconName;\n\n  /**\n   * The size of the icon. Can be `'sm' | 'md' | 'lg' | undefined`. Predefined\n   * sizes are set to:\n   *\n   *  * `sm`: 16px\n   *  * `md`: 24px\n   *  * `lg`: 32px\n   *\n   * A custom size can be supplied by setting this field to `undefined` and\n   * setting `font-size` through CSS. Defaults to `md`.\n   */\n  @Prop()\n  public size?: ViewerIconSize = 'md';\n\n  public render(): h.JSX.IntrinsicElements {\n    if (this.name === 'fit-all') {\n      return this.renderSvgIcon(\n        <path d=\"M6.15,9.15l-2.5,2.5L2,10v4H6L4.35,12.35l2.5-2.5a.49.49,0,0,0-.7-.7Zm-1.8-5.5L6,2H2V6L3.65,4.35l2.5,2.5a.49.49,0,0,0,.7-.7ZM10,2l1.65,1.65-2.5,2.5a.49.49,0,0,0,.7.7l2.5-2.5L14,6V2ZM9.85,9.15a.49.49,0,0,0-.7.7l2.5,2.5L10,14h4V10l-1.65,1.65Z\" />\n      );\n    } else if (this.name === 'eye-open') {\n      return this.renderSvgIcon(\n        <path d=\"M8 5a3 3 0 103 3 3 3 0 00-3-3zm4.65-1.17A8.53 8.53 0 008 2.5a8.53 8.53 0 00-4.65 1.33A6.57 6.57 0 00.51 7.89v.22a6.57 6.57 0 002.84 4.06A8.53 8.53 0 008 13.5a8.53 8.53 0 004.65-1.33 6.57 6.57 0 002.84-4.06v-.22a6.57 6.57 0 00-2.84-4.06zm-.55 7.5A7.52 7.52 0 018 12.5a7.52 7.52 0 01-4.1-1.17A5.49 5.49 0 011.53 8 5.49 5.49 0 013.9 4.67 7.52 7.52 0 018 3.5a7.52 7.52 0 014.1 1.17A5.49 5.49 0 0114.47 8a5.49 5.49 0 01-2.37 3.33z\" />\n      );\n    } else if (this.name === 'eye-half') {\n      return this.renderSvgIcon(\n        <path d=\"M13.35 2.65a.48.48 0 00-.7 0l-.78.77a8.71 8.71 0 00-8.52.41A6.57 6.57 0 00.51 7.89v.22a6.58 6.58 0 002.71 4l-.57.58a.49.49 0 00.7.7l10-10a.48.48 0 000-.74zM9.73 5.56a3 3 0 00-4.17 4.17l-1.62 1.62A5.49 5.49 0 011.53 8 5.49 5.49 0 013.9 4.67 7.52 7.52 0 018 3.5a7.67 7.67 0 013.12.67zm3.61-1.2l-.72.72A5.45 5.45 0 0114.47 8a5.49 5.49 0 01-2.37 3.33A7.52 7.52 0 018 12.5a8.15 8.15 0 01-2.41-.38l-.78.78a8.9 8.9 0 003.19.6 8.53 8.53 0 004.65-1.33 6.57 6.57 0 002.84-4.06v-.22a6.56 6.56 0 00-2.15-3.53z\" />\n      );\n    } else if (this.name === 'eye-half-dotted') {\n      return this.renderSvgIcon(\n        <Fragment>\n          <path d=\"M4.12 11.46A5.62 5.62 0 011.52 8 5.57 5.57 0 013.9 4.67 7.52 7.52 0 018 3.5a7.7 7.7 0 013.33.75l.74-.74A8.67 8.67 0 008 2.5a8.53 8.53 0 00-4.65 1.33A6.57 6.57 0 00.51 7.89v.22a6.54 6.54 0 002.88 4.08z\" />\n          <path d=\"M8 5a3 3 0 00-3 3 3 3 0 00.69 1.89l4.2-4.2A3 3 0 008 5zM5.88 5.88zM9.2 12.41a.51.51 0 00-.42.57.5.5 0 00.56.42.5.5 0 00.43-.57.51.51 0 00-.57-.42zM6.77 12.41a.5.5 0 00-.57.42.49.49 0 00.41.57.5.5 0 10.15-1zM14.48 5.61a.5.5 0 00-.7-.12.49.49 0 00-.12.69.5.5 0 00.82-.57zM11.5 11.68a.5.5 0 00-.22.67.51.51 0 00.68.22.5.5 0 00-.46-.89zM15.07 7.77a.52.52 0 00-.62.35.51.51 0 00.35.62.5.5 0 00.61-.35.52.52 0 00-.34-.62zM13.36 10.21a.5.5 0 10.76.64.49.49 0 00-.06-.7.51.51 0 00-.7.06z\" />\n        </Fragment>\n      );\n    } else if (this.name === 'chevron-right') {\n      return this.renderSvgIcon(\n        <path d=\"M10.83,7.62l-4-3.5A.5.5,0,0,0,6,4.5v7a.5.5,0,0,0,.83.38l4-3.5a.51.51,0,0,0,0-.76Z\" />\n      );\n    } else if (this.name === 'chevron-down') {\n      return this.renderSvgIcon(\n        <path\n          d=\"M11.88,9.17l-3.5-4a.51.51,0,0,0-.76,0l-3.5,4A.5.5,0,0,0,4.5,10h7a.5.5,0,0,0,.38-.83Z\"\n          transform=\"rotate(180 8 8)\"\n        />\n      );\n    } else if (this.name === 'search') {\n      return this.renderSvgIcon(\n        <path d=\"M14.85 14.15l-4-4a.37.37 0 00-.2-.12 5.45 5.45 0 10-.62.62.37.37 0 00.12.2l4 4a.49.49 0 00.7-.7zM9.71 9.71a4.51 4.51 0 01-6.42 0 4.51 4.51 0 010-6.42 4.51 4.51 0 016.42 0 4.51 4.51 0 010 6.42z\" />\n      );\n    } else if (this.name === 'close-circle') {\n      return this.renderSvgIcon(\n        <path d=\"M8 1a7 7 0 107 7 7 7 0 00-7-7zm2.85 9.15a.49.49 0 01-.7.7L8 8.71l-2.15 2.14a.49.49 0 01-.7-.7L7.29 8 5.15 5.85a.49.49 0 01.7-.7L8 7.29l2.15-2.14a.49.49 0 01.7.7L8.71 8z\" />\n      );\n    } else if (this.name === 'pin-fill') {\n      return this.renderSvgIcon(\n        <path d=\"M8,.55A5.9,5.9,0,0,0,2.1,6.44a9.14,9.14,0,0,0,2.66,6.24,11.44,11.44,0,0,0,1.93,1.65,7.43,7.43,0,0,0,.73.44l.28.12a.78.78,0,0,0,.6,0,6.65,6.65,0,0,0,1.34-.79,11.79,11.79,0,0,0,2.76-2.88,8.59,8.59,0,0,0,1.5-4.78A5.9,5.9,0,0,0,8,.55ZM8,8.44a2,2,0,1,1,2-2A2,2,0,0,1,8,8.44Z\" />\n      );\n    } else {\n      return <svg />;\n    }\n  }\n\n  private renderSvgIcon(\n    content: h.JSX.IntrinsicElements\n  ): h.JSX.IntrinsicElements {\n    return (\n      <Host\n        class={classname({\n          'size-sm': this.size === 'sm',\n          'size-md': this.size === 'md',\n          'size-lg': this.size === 'lg',\n        })}\n      >\n        <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 16 16\">\n          {content}\n        </svg>\n      </Host>\n    );\n  }\n}\n"],"version":3}

package/dist/components/viewer-layer.js

@@ -0,0 +1,46 @@
+/*!
+ * Copyright (c) 2023 Vertex Software LLC. All rights reserved.
+ */
+import { proxyCustomElement, HTMLElement, h, Host } from '@stencil/core/internal/client';
+
+const viewerLayerCss = ":host{pointer-events:none;overflow:hidden}:host(:not([stretch-off])){position:absolute;left:0;right:0;top:0;bottom:0}";
+
+const ViewerLayer = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
+  constructor() {
+    super();
+    this.__registerHost();
+    this.__attachShadow();
+    /**
+     * Indicates if the layer should stretch to fill the size of its container's
+     * nearest positioned parent.
+     */
+    this.stretchOff = false;
+  }
+  /**
+   * @ignore
+   */
+  render() {
+    return (h(Host, null, h("slot", null)));
+  }
+  get hostEl() { return this; }
+  static get style() { return viewerLayerCss; }
+}, [1, "vertex-viewer-layer", {
+    "stretchOff": [516, "stretch-off"]
+  }]);
+function defineCustomElement() {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  const components = ["vertex-viewer-layer"];
+  components.forEach(tagName => { switch (tagName) {
+    case "vertex-viewer-layer":
+      if (!customElements.get(tagName)) {
+        customElements.define(tagName, ViewerLayer);
+      }
+      break;
+  } });
+}
+
+export { ViewerLayer as V, defineCustomElement as d };
+
+//# sourceMappingURL=viewer-layer.js.map

package/dist/components/viewer-layer.js.map

@@ -0,0 +1 @@
+{"file":"viewer-layer.js","mappings":";;;;;AAAA,MAAM,cAAc,GAAG,uHAAuH;;MCOjI,WAAW;EALxB;;;;;;;;IAUkC,eAAU,GAAG,KAAK,CAAC;GAcpD;;;;EAPW,MAAM;IACd,QACE,EAAC,IAAI,QACH,eAAa,CACR,EACP;GACH;;;;;;;;;;;;;;;;;;;;;;","names":[],"sources":["./src/components/viewer-layer/viewer-layer.css?tag=vertex-viewer-layer&encapsulation=shadow","./src/components/viewer-layer/viewer-layer.tsx"],"sourcesContent":[":host {\n  pointer-events: none;\n  overflow: hidden;\n}\n\n:host(:not([stretch-off])) {\n  position: absolute;\n  left: 0;\n  right: 0;\n  top: 0;\n  bottom: 0;\n}\n","import { Component, Element, h, Host, Prop } from '@stencil/core';\n\n@Component({\n  tag: 'vertex-viewer-layer',\n  styleUrl: 'viewer-layer.css',\n  shadow: true,\n})\nexport class ViewerLayer {\n  /**\n   * Indicates if the layer should stretch to fill the size of its container's\n   * nearest positioned parent.\n   */\n  @Prop({ reflect: true }) public stretchOff = false;\n\n  @Element() private hostEl!: HTMLElement;\n\n  /**\n   * @ignore\n   */\n  protected render(): h.JSX.IntrinsicElements {\n    return (\n      <Host>\n        <slot></slot>\n      </Host>\n    );\n  }\n}\n"],"version":3}