@univerjs-pro/shape-editor-ui
Reusable shape editing panels, floating toolbars, shape-text hyperlink UI, and SmartArt layout, color, quick-style, and text-pane controls for Web SDK.
import { ShapeEditPanel } from '@univerjs-pro/shape-editor-ui'import enUS from '@univerjs-pro/shape-editor-ui/locale/en-US'Entry Points
- Locale:
@univerjs-pro/shape-editor-ui/locale/*
Mobile Shape Editor
MobileShapeEditorService exposes the active mobile editing state through state$ and getState(). Use open(mode, shapeRef) with the text, formula, or style mode, and call close() when the panel is dismissed.
The root entry also exports IMobileShapeEditorState and MobileShapeEditorMode.
Shape-text hyperlink hover
Sheets, Docs, Slides, and Boards use ShapeTextHyperLinkHoverController for shape-text link previews. Hovering a link shows its popup and pointer cursor. Dragging, entering text-edit mode, scrolling, transforming the shape, or deactivating the host clears the preview.
Custom hosts provide picking, coordinates, permissions, and popup anchors. The root exports createShapeTextHyperLinkRegions, resolveShapeTextHyperLinkAt, resolveShapeTextHyperLinkObject, and IShapeTextHyperLinkRegion for hit testing. Use customHyperLinkUI on the embedded text editor when the host owns hyperlink interactions, and dispose the hover controller with the render context.
Shape format painter
The root exports registerShapeFormatPainter for custom host integrations. Sheets and Docs shape UI plugins and Slides UI register their host integrations automatically.
The painter copies fill, stroke, effects, and supported text formatting while preserving target identity, geometry, text, and formula bindings. Clearing formatting restores insertion defaults. SmartArt is excluded. Custom hosts must apply the result through undoable commands and dispose the returned registration when their render context ends.
How is this guide?