import { Viewer } from '@stereograph/teiaviewer';
import { CameraGizmo, Toolbar, ViewportContainer } from '@stereograph/teiaviewer-viewport-react';

const viewer = new Viewer({
  debug: true,
  dev: {
    verbose: true,
  },
});

/**
 * Basic example Viewer App Component
 */
export const App = () => {
  return (

    <ViewportContainer viewer={viewer}>
      <CameraGizmo />
      <Toolbar
        sx={{
          position: 'absolute',
          top: '50%',
          right: '13px',
          transform: 'translateY(-50%)',
        }}
      />
    </ViewportContainer>
  );
};