Editor.ImageFrameToolButton
Toolbar toggle that arms the draw-to-size placeholder (image-mask) frame tool, with a shape picker.
Toolbar toggle that arms the draw-to-size placeholder-frame tool - a Canva-style shaped image slot. While armed, dragging on the page rubber-bands a new image section whose image is clipped to the chosen maskShape (rect / circle / line); the adjacent dropdown switches the shape. Drop or upload an image to fill the slot. Mutually exclusive with the frame, shape, and drawing tools.
Usage
import { Editor } from '@docmosaic/react';
<Editor.Root>
<Editor.ImageFrameToolButton />
</Editor.Root>;API Reference
| Prop | Type | Default | Description |
|---|---|---|---|
| iconOnly | boolean | undefined | - | Render a compact icon-only square button with an accessible label. |
| variant | "default" | "cream" | "sage" | "orange" | "caramel" | "white" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined | - | Override the idle (not-armed) variant. Defaults to |
| activeVariant | "default" | "cream" | "sage" | "orange" | "caramel" | "white" | "destructive" | "outline" | "secondary" | "ghost" | "link" | null | undefined | - | Override the armed variant. Defaults to |
| className | string | undefined | - | Extra classes merged onto the toggle button while idle. |
| activeClassName | string | undefined | - | Extra classes merged onto the toggle button while the tool is armed. |
Related
- Frames - placeholder vs. container frames
- Editor.FrameToolButton - container frames
- Root - the orchestrator