Concepts
- Overview
- Customize Layout
- Customize CSS
- Template Variables
- Conditional Templates
- Action Components
- Variants
General Wireframe Setup
Async Collaboration
- Comments
- In-app Notifications
- Inline Reactions
- Arrows
Realtime Collaboration
- Presence
- Cursors
- Live Selection
- Huddle
Arrows
Slots
import {
VeltArrowTool
} from '@veltdev/react';
export default function App() {
return (
<>
<VeltArrowTool>
<button slot="button">Arrow</button>
</VeltArrowTool>
</>
);
}
1
Replace the Arrow Tool
Provide a template for the Arrow Tool.
Target the button
slot with your own custom template.
import {
VeltArrowTool
} from '@veltdev/react';
export default function App() {
return (
<>
<VeltArrowTool>
<button slot="button">Arrow</button>
</VeltArrowTool>
</>
);
}
import {
VeltArrowTool
} from '@veltdev/react';
export default function App() {
return (
<>
<VeltArrowTool>
<button slot="button">Arrow</button>
</VeltArrowTool>
</>
);
}