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

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

/**
 * Basic example Viewer App Component
 * If you want the toaster to be displayed you need to add it
 * @returns
 */
export const App = () => {
  return (
    <div className="st-h-screen st-w-screen">
      <ViewportContainer viewer={viewer}>
        {/* <CameraGizmo /> */}
        <Toolbar
          sx={{
            position: 'absolute',
            top: '50%',
            right: '13px',
            transform: 'translateY(-50%)',
          }}
        />
      </ViewportContainer>
    </div>
  );
};