@vertexvis/viewer-react 1.0.0-testing.1 → 1.0.0-testing.2

package/dist/bundle.esm.js

@@ -1,4 +1,5 @@
 'use client';
+import { createComponent } from '@stencil/react-output-target/runtime';
 import React from 'react';
 import { VertexSceneTreeNotificationBanner as VertexSceneTreeNotificationBanner$1, defineCustomElement as defineCustomElement$1 } from '@vertexvis/viewer/dist/components/vertex-scene-tree-notification-banner.js';
 import { VertexSceneTreeSearch as VertexSceneTreeSearch$1, defineCustomElement as defineCustomElement$2 } from '@vertexvis/viewer/dist/components/vertex-scene-tree-search.js';
@@ -43,25 +44,7 @@ import { VertexViewerViewCube as VertexViewerViewCube$1, defineCustomElement as
 import { VertexViewerWalkModeTool as VertexViewerWalkModeTool$1, defineCustomElement as defineCustomElement$F } from '@vertexvis/viewer/dist/components/vertex-viewer-walk-mode-tool.js';
 import { VertexViewer as VertexViewer$1, defineCustomElement as defineCustomElement$a } from '@vertexvis/viewer/dist/components/vertex-viewer.js';
 
-/**
- * @license
- * Copyright 2018 Google LLC
- * SPDX-License-Identifier: BSD-3-Clause
- */
-const e=new Set(["children","localName","ref","style","className"]),n=new WeakMap,t=(e,t,o,l,a)=>{const s=a?.[t];void 0===s?(e[t]=o,null==o&&t in HTMLElement.prototype&&e.removeAttribute(t)):o!==l&&((e,t,o)=>{let l=n.get(e);void 0===l&&n.set(e,l=new Map);let a=l.get(t);void 0!==o?void 0===a?(l.set(t,a={handleEvent:o}),e.addEventListener(t,a)):a.handleEvent=o:void 0!==a&&(l.delete(t),e.removeEventListener(t,a));})(e,s,o);},o=({react:n,tagName:o,elementClass:l,events:a,displayName:s})=>{const c=new Set(Object.keys(a??{})),r=n.forwardRef(((s,r)=>{const i=n.useRef(new Map),d=n.useRef(null),f={},u={};for(const[n,t]of Object.entries(s))e.has(n)?f["className"===n?"class":n]=t:c.has(n)||n in l.prototype?u[n]=t:f[n]=t;return n.useLayoutEffect((()=>{if(null===d.current)return;const e=new Map;for(const n in u)t(d.current,n,s[n],i.current.get(n),a),i.current.delete(n),e.set(n,s[n]);for(const[e,n]of i.current)t(d.current,e,void 0,n,a);i.current=e;})),n.useLayoutEffect((()=>{d.current?.removeAttribute("defer-hydration");}),[]),f.suppressHydrationWarning=!0,n.createElement(o,{...f,ref:n.useCallback((e=>{d.current=e,"function"==typeof r?r(e):null!==r&&(r.current=e);}),[r])})}));return r.displayName=s??l.name,r};
-
-const r = ({
-  defineCustomElement: e,
-  tagName: o$1,
-  transformTag: n,
-  ...t
-}) => {
-  typeof e < "u" && e();
-  const a = n ? n(o$1) : o$1;
-  return o({ ...t, tagName: a });
-};
-
-const VertexSceneTree = /*@__PURE__*/ r({
+const VertexSceneTree = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree',
     elementClass: VertexSceneTree$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -72,7 +55,7 @@ const VertexSceneTree = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement
 });
-const VertexSceneTreeNotificationBanner = /*@__PURE__*/ r({
+const VertexSceneTreeNotificationBanner = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-notification-banner',
     elementClass: VertexSceneTreeNotificationBanner$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -80,7 +63,7 @@ const VertexSceneTreeNotificationBanner = /*@__PURE__*/ r({
     events: { onAction: 'action' },
     defineCustomElement: defineCustomElement$1
 });
-const VertexSceneTreeSearch = /*@__PURE__*/ r({
+const VertexSceneTreeSearch = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-search',
     elementClass: VertexSceneTreeSearch$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -91,7 +74,7 @@ const VertexSceneTreeSearch = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$2
 });
-const VertexSceneTreeTableCell = /*@__PURE__*/ r({
+const VertexSceneTreeTableCell = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-table-cell',
     elementClass: VertexSceneTreeTableCell$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -105,7 +88,7 @@ const VertexSceneTreeTableCell = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$3
 });
-const VertexSceneTreeTableColumn = /*@__PURE__*/ r({
+const VertexSceneTreeTableColumn = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-table-column',
     elementClass: VertexSceneTreeTableColumn$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -113,7 +96,7 @@ const VertexSceneTreeTableColumn = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$4
 });
-const VertexSceneTreeTableHeader = /*@__PURE__*/ r({
+const VertexSceneTreeTableHeader = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-table-header',
     elementClass: VertexSceneTreeTableHeader$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -121,7 +104,7 @@ const VertexSceneTreeTableHeader = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$5
 });
-const VertexSceneTreeTableLayout = /*@__PURE__*/ r({
+const VertexSceneTreeTableLayout = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-table-layout',
     elementClass: VertexSceneTreeTableLayout$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -129,7 +112,7 @@ const VertexSceneTreeTableLayout = /*@__PURE__*/ r({
     events: { onColumnsResized: 'columnsResized' },
     defineCustomElement: defineCustomElement$6
 });
-const VertexSceneTreeTableResizeDivider = /*@__PURE__*/ r({
+const VertexSceneTreeTableResizeDivider = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-table-resize-divider',
     elementClass: VertexSceneTreeTableResizeDivider$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -137,7 +120,7 @@ const VertexSceneTreeTableResizeDivider = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$7
 });
-const VertexSceneTreeToolbar = /*@__PURE__*/ r({
+const VertexSceneTreeToolbar = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-toolbar',
     elementClass: VertexSceneTreeToolbar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -145,7 +128,7 @@ const VertexSceneTreeToolbar = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$8
 });
-const VertexSceneTreeToolbarGroup = /*@__PURE__*/ r({
+const VertexSceneTreeToolbarGroup = /*@__PURE__*/ createComponent({
     tagName: 'vertex-scene-tree-toolbar-group',
     elementClass: VertexSceneTreeToolbarGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -153,7 +136,7 @@ const VertexSceneTreeToolbarGroup = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$9
 });
-const VertexViewer = /*@__PURE__*/ r({
+const VertexViewer = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer',
     elementClass: VertexViewer$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -176,7 +159,7 @@ const VertexViewer = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$a
 });
-const VertexViewerAnnotationCallout = /*@__PURE__*/ r({
+const VertexViewerAnnotationCallout = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-annotation-callout',
     elementClass: VertexViewerAnnotationCallout$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -184,7 +167,7 @@ const VertexViewerAnnotationCallout = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$b
 });
-const VertexViewerBoxQueryTool = /*@__PURE__*/ r({
+const VertexViewerBoxQueryTool = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-box-query-tool',
     elementClass: VertexViewerBoxQueryTool$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -192,7 +175,7 @@ const VertexViewerBoxQueryTool = /*@__PURE__*/ r({
     events: { onControllerChanged: 'controllerChanged' },
     defineCustomElement: defineCustomElement$c
 });
-const VertexViewerButton = /*@__PURE__*/ r({
+const VertexViewerButton = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-button',
     elementClass: VertexViewerButton$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -200,7 +183,7 @@ const VertexViewerButton = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$d
 });
-const VertexViewerDefaultToolbar = /*@__PURE__*/ r({
+const VertexViewerDefaultToolbar = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-default-toolbar',
     elementClass: VertexViewerDefaultToolbar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -208,7 +191,7 @@ const VertexViewerDefaultToolbar = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$e
 });
-const VertexViewerDomElement = /*@__PURE__*/ r({
+const VertexViewerDomElement = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-dom-element',
     elementClass: VertexViewerDomElement$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -220,7 +203,7 @@ const VertexViewerDomElement = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$f
 });
-const VertexViewerDomGroup = /*@__PURE__*/ r({
+const VertexViewerDomGroup = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-dom-group',
     elementClass: VertexViewerDomGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -228,7 +211,7 @@ const VertexViewerDomGroup = /*@__PURE__*/ r({
     events: { onPropertyChange: 'propertyChange' },
     defineCustomElement: defineCustomElement$g
 });
-const VertexViewerDomRenderer = /*@__PURE__*/ r({
+const VertexViewerDomRenderer = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-dom-renderer',
     elementClass: VertexViewerDomRenderer$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -236,7 +219,7 @@ const VertexViewerDomRenderer = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$h
 });
-const VertexViewerHitResultIndicator = /*@__PURE__*/ r({
+const VertexViewerHitResultIndicator = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-hit-result-indicator',
     elementClass: VertexViewerHitResultIndicator$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -244,7 +227,7 @@ const VertexViewerHitResultIndicator = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$i
 });
-const VertexViewerIcon = /*@__PURE__*/ r({
+const VertexViewerIcon = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-icon',
     elementClass: VertexViewerIcon$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -252,7 +235,7 @@ const VertexViewerIcon = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$j
 });
-const VertexViewerLayer = /*@__PURE__*/ r({
+const VertexViewerLayer = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-layer',
     elementClass: VertexViewerLayer$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -260,7 +243,7 @@ const VertexViewerLayer = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$k
 });
-const VertexViewerMarkup = /*@__PURE__*/ r({
+const VertexViewerMarkup = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-markup',
     elementClass: VertexViewerMarkup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -273,7 +256,7 @@ const VertexViewerMarkup = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$l
 });
-const VertexViewerMarkupArrow = /*@__PURE__*/ r({
+const VertexViewerMarkupArrow = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-markup-arrow',
     elementClass: VertexViewerMarkupArrow$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -285,7 +268,7 @@ const VertexViewerMarkupArrow = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$m
 });
-const VertexViewerMarkupCircle = /*@__PURE__*/ r({
+const VertexViewerMarkupCircle = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-markup-circle',
     elementClass: VertexViewerMarkupCircle$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -297,7 +280,7 @@ const VertexViewerMarkupCircle = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$n
 });
-const VertexViewerMarkupFreeform = /*@__PURE__*/ r({
+const VertexViewerMarkupFreeform = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-markup-freeform',
     elementClass: VertexViewerMarkupFreeform$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -309,7 +292,7 @@ const VertexViewerMarkupFreeform = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$o
 });
-const VertexViewerMarkupTool = /*@__PURE__*/ r({
+const VertexViewerMarkupTool = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-markup-tool',
     elementClass: VertexViewerMarkupTool$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -320,7 +303,7 @@ const VertexViewerMarkupTool = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$p
 });
-const VertexViewerMeasurementDetails = /*@__PURE__*/ r({
+const VertexViewerMeasurementDetails = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-measurement-details',
     elementClass: VertexViewerMeasurementDetails$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -328,7 +311,7 @@ const VertexViewerMeasurementDetails = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$q
 });
-const VertexViewerMeasurementDistance = /*@__PURE__*/ r({
+const VertexViewerMeasurementDistance = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-measurement-distance',
     elementClass: VertexViewerMeasurementDistance$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -339,7 +322,7 @@ const VertexViewerMeasurementDistance = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$r
 });
-const VertexViewerMeasurementLine = /*@__PURE__*/ r({
+const VertexViewerMeasurementLine = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-measurement-line',
     elementClass: VertexViewerMeasurementLine$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -347,7 +330,7 @@ const VertexViewerMeasurementLine = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$s
 });
-const VertexViewerMeasurementOverlays = /*@__PURE__*/ r({
+const VertexViewerMeasurementOverlays = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-measurement-overlays',
     elementClass: VertexViewerMeasurementOverlays$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -355,7 +338,7 @@ const VertexViewerMeasurementOverlays = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$t
 });
-const VertexViewerMeasurementPrecise = /*@__PURE__*/ r({
+const VertexViewerMeasurementPrecise = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-measurement-precise',
     elementClass: VertexViewerMeasurementPrecise$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -363,7 +346,7 @@ const VertexViewerMeasurementPrecise = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$u
 });
-const VertexViewerPinGroup = /*@__PURE__*/ r({
+const VertexViewerPinGroup = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-pin-group',
     elementClass: VertexViewerPinGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -371,7 +354,7 @@ const VertexViewerPinGroup = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$v
 });
-const VertexViewerPinLabel = /*@__PURE__*/ r({
+const VertexViewerPinLabel = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-pin-label',
     elementClass: VertexViewerPinLabel$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -382,7 +365,7 @@ const VertexViewerPinLabel = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$w
 });
-const VertexViewerPinLabelLine = /*@__PURE__*/ r({
+const VertexViewerPinLabelLine = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-pin-label-line',
     elementClass: VertexViewerPinLabelLine$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -390,7 +373,7 @@ const VertexViewerPinLabelLine = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$x
 });
-const VertexViewerPinTool = /*@__PURE__*/ r({
+const VertexViewerPinTool = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-pin-tool',
     elementClass: VertexViewerPinTool$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -398,7 +381,7 @@ const VertexViewerPinTool = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$y
 });
-const VertexViewerSpinner = /*@__PURE__*/ r({
+const VertexViewerSpinner = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-spinner',
     elementClass: VertexViewerSpinner$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -406,7 +389,7 @@ const VertexViewerSpinner = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$z
 });
-const VertexViewerTeleportTool = /*@__PURE__*/ r({
+const VertexViewerTeleportTool = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-teleport-tool',
     elementClass: VertexViewerTeleportTool$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -414,7 +397,7 @@ const VertexViewerTeleportTool = /*@__PURE__*/ r({
     events: { onControllerChanged: 'controllerChanged' },
     defineCustomElement: defineCustomElement$A
 });
-const VertexViewerToolbar = /*@__PURE__*/ r({
+const VertexViewerToolbar = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-toolbar',
     elementClass: VertexViewerToolbar$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -422,7 +405,7 @@ const VertexViewerToolbar = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$B
 });
-const VertexViewerToolbarGroup = /*@__PURE__*/ r({
+const VertexViewerToolbarGroup = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-toolbar-group',
     elementClass: VertexViewerToolbarGroup$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -430,7 +413,7 @@ const VertexViewerToolbarGroup = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$C
 });
-const VertexViewerTransformWidget = /*@__PURE__*/ r({
+const VertexViewerTransformWidget = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-transform-widget',
     elementClass: VertexViewerTransformWidget$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -443,7 +426,7 @@ const VertexViewerTransformWidget = /*@__PURE__*/ r({
     },
     defineCustomElement: defineCustomElement$D
 });
-const VertexViewerViewCube = /*@__PURE__*/ r({
+const VertexViewerViewCube = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-view-cube',
     elementClass: VertexViewerViewCube$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.
@@ -451,7 +434,7 @@ const VertexViewerViewCube = /*@__PURE__*/ r({
     events: {},
     defineCustomElement: defineCustomElement$E
 });
-const VertexViewerWalkModeTool = /*@__PURE__*/ r({
+const VertexViewerWalkModeTool = /*@__PURE__*/ createComponent({
     tagName: 'vertex-viewer-walk-mode-tool',
     elementClass: VertexViewerWalkModeTool$1,
     // @ts-ignore - ignore potential React type mismatches between the Stencil Output Target and your project.