You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

develop.tsx 975B

123456789101112131415161718192021222324252627282930313233343536373839404142
  1. /* eslint-disable @typescript-eslint/no-explicit-any */
  2. import * as React from 'react'
  3. import { Tldraw, TldrawApp, useFileSystem } from '@tldraw/tldraw'
  4. declare const window: Window & { app: TldrawApp }
  5. export default function Develop(): JSX.Element {
  6. const rTldrawApp = React.useRef<TldrawApp>()
  7. const fileSystemEvents = useFileSystem()
  8. const handleMount = React.useCallback((app: TldrawApp) => {
  9. window.app = app
  10. rTldrawApp.current = app
  11. }, [])
  12. const handleSignOut = React.useCallback(() => {
  13. // noop
  14. }, [])
  15. const handleSignIn = React.useCallback(() => {
  16. // noop
  17. }, [])
  18. const handlePersist = React.useCallback(() => {
  19. // noop
  20. }, [])
  21. return (
  22. <div className="tldraw">
  23. <Tldraw
  24. id="develop"
  25. {...fileSystemEvents}
  26. onMount={handleMount}
  27. onSignIn={handleSignIn}
  28. onSignOut={handleSignOut}
  29. onPersist={handlePersist}
  30. showSponsorLink={true}
  31. />
  32. </div>
  33. )
  34. }