Operations
File Workflows
New/open/save project flows using Telva callbacks and useFileSystem helper handlers.
File Workflows
Telva can handle project files (.tldr) through callback hooks or useFileSystem() defaults.
Fast path: useFileSystem
import { Telva, useFileSystem } from 'telva'
export default function FileSystemEnabledEditor() {
const fileSystemEvents = useFileSystem()
return <Telva {...fileSystemEvents} />
}The hook provides handlers for:
onNewProjectonOpenProjectonSaveProjectonSaveProjectAsonOpenMedia
What the default logic does
- prompts user before destructive open/new when needed
- uses
app.saveProject()before replacing dirty state - uses
app.openProject()andapp.newProject()command APIs
Manual file API usage (imperative)
await app.saveProject()
await app.saveProjectAs('board-v2', 'tldr')
await app.openProject()
await app.openAsset()
app.newProject()Loading pre-existing files by URL
import * as React from 'react'
import { TVFile, Telva } from 'telva'
export default function LoadingFiles() {
const [file, setFile] = React.useState<TVFile>()
React.useEffect(() => {
fetch('/Example.tldr')
.then((response) => response.json())
.then((data) => setFile(data))
}, [])
return <Telva document={file?.document} />
}