Documentation Index
Fetch the complete documentation index at: https://docs.tsdraw.com/llms.txt
Use this file to discover all available pages before exploring further.
The @tsdraw/react package includes a toolbar and style panel, configurable via uiOptions.
Hiding
<Tsdraw uiOptions={{ toolbar: { hide: true } }} />
Layout
The parts option controls grouping:
<Tsdraw uiOptions={{ toolbar: { parts: [['pen'], ['undo']] } }} />
Placement
Position relative to the edge:
<Tsdraw uiOptions={{ toolbar: { placement: { anchor: 'bottom-right' } } }} />
Draggable
<Tsdraw uiOptions={{ toolbar: { draggable: true, saveDraggedPosition: true } }} />
Style panel
Hiding
<Tsdraw uiOptions={{ stylePanel: { hide: true } }} />
Custom elements
Add arbitrary overlays:
<Tsdraw
uiOptions={{
customElements: [{
id: 'logo',
render: () => <div>tsdraw</div>
}]
}}
/>
Theming
<Tsdraw theme="light" /> // or "dark", "system"
Cursors
<Tsdraw uiOptions={{ cursor: { getCursor: (ctx) => 'crosshair' } }} />