[Feature Request] Component Access

[adamsmd]

My understanding is that the upstream TLDraw library is a component that allows developers to wrap it with their own code to fit their needs. Would it be possible to allow users of the tldraw-in-obsidian access to write their own code interacting with that component, or provide some sort of system for plugins/extensions or JavaScript snippets or hooks that are run on startup?

I am thinking of something that would allow users to implement things like shown on https://tldraw.dev/examples/ (e.g., slideshows) or to trigger inserting various elements on startup (e.g. the document title).

My hope is that exposing this access would be simpler to implement for you than building your own system for such extensions.

[jon-dez]

I had an idea for a extensions system in order to customize the tldraw experience, but what you are describing sounds like a better solution than what I had in mind. I think going with the "hooks" route would be the best method since there is some custom functionality implemented on top of the <Tldraw /> component that allows it to play nice with Obsidian (e.g. editor focus, referencing assets inside markdown files, etc.).

The way I am thinking this would work is the following simplification:

Load extension script -> Call exported function createExtension -> Pass extension to the plugin component that has functionality on top of <Tldraw /> -> call useOverridableTldrawProps -> forward the returned value to the tldraw component (<Tldraw {...props} />)

Example:

/**
 * @param context - The extension context provided by the plugin, with useful utilities and references
 */
export function createExtension(context) {
  // Initialize anything here that could be used across multiple editor instances, the returned value will be reused
  return {
    hooks: {
      useOverridableTldrawProps: (props) => {
        // Override or keep properties (Warning: overriding some properties may change how the plugin behaves, be sure that you are not overriding properties essential to plugin functionality unless you know what you are doing)
        return props;
      }
    }
  }
}