React bindings for the Vertex Viewer SDK.

Downloads in past


710.16.012 days ago3 years agoMinified + gzip package size for @vertexvis/viewer-react in KB


React Bindings for Vertex Viewer SDK
npm npm (scoped with tag)
This project contains React bindings for Vertex's Viewer SDK. These bindings are auto-generated from @vertexvis/viewer.


Run yarn add @vertexvis/viewer-react or npm install @vertexvis/viewer-react to add the project as an NPM dependency.


@vertexvis/viewer includes a component loader, defineCustomElements, that needs to be invoked to register the components with the browser. It also includes a global stylesheet with default styling. Consult your bundlers documentation on how to bundle CSS with your project's bundler.
import React from 'react';
import ReactDom from 'react-dom';

import { defineCustomElements } from '@vertexvis/viewer/loader';
import '@vertexvis/viewer/dist/viewer/viewer.css';

async function main() {
  await defineCustomElement(window);
  ReactDom.render(<App />, document.querySelector("#app"));


Next, add one of the components to your React component.
import React from 'react';
import { VertexViewer } from '@vertexvis/viewer-react';

export function App() {
  return (<div>
    <VertexViewer src="urn:vertexvis:stream-key:123" />


See @vertexvis/viewercomponent docs for a full list of components and their documentation.