import { useEffect } from "react";
import '@/components/TldrawView/index.scss'
import {
  Tldraw,
  createShapeId,
  Editor,
} from 'tldraw'
import 'tldraw/tldraw.css'
const TldrawView: React.FC = () => {
  useEffect(() => {

  });
  return (
    <>
      <Tldraw
        components={{
          // ContextMenu: null,
          // ActionsMenu: null,
          // HelpMenu: null,
          // ZoomMenu: null,
          // MainMenu: null,
          // Minimap: null,
          // StylePanel: null,
          PageMenu: null,
          // NavigationPanel: null,
          // Toolbar: null,
          // KeyboardShortcutsDialog: null,
          // QuickActions: null,
          // HelperButtons: null,
          DebugPanel: null,
          DebugMenu: null,
          // SharePanel: null,
          // MenuPanel: null,
          // TopPanel: null,
        }}
        onMount={(editor: Editor) => {
          editor.sideEffects.registerAfterChangeHandler('shape', (_prevShape, _nextShape) => {
          })
          // editor.getRenderingShapes()
          // editor.getPages()
          // editor.createShapes().zoomToFit({ animation: { duration: 0 } })
        }}>
      </Tldraw>
    </>
  )
}
export default TldrawView