Slides
| Packages | @univerjs-pro/slides, @univerjs-pro/slides-thread-comment |
|---|
Facade APIs for presentations, slides, shared Shapes, images, and groups.
TypeScript
import '@univerjs-pro/slides/facade'Unit access
TypeScript
createPresentation(data?: Partial<ISlideData>, options?: ICreateUnitOptions): FPresentationgetActivePresentation(): FPresentation | nullgetPresentation(id: string): FPresentation | nullgetSlideCommandTarget(params?: { unitId?: string; subUnitId?: string; slideId?: string }): { presentation: FPresentation; slide: FSlide; unitId: string; subUnitId: string } | nullPermissions
Presentations expose unit-level Edit, Copy, Export, and Comment points. Slides, page elements, master views, and master elements expose effective object-level edit permissions.
TypeScript
import { UnitAction } from '@univerjs/protocol'const presentation = univerAPI.getActivePresentation()const slide = presentation?.getSlideByIndex(0)const element = slide?.getElements()[0]if (presentation) await presentation.getPermission().setPoint(UnitAction.Copy, false)await slide?.getPermission().setReadOnly()await element?.getPermission().setEditable()An object's canEdit() still honors the presentation and parent-object permission ceilings.
Thread comments
Import @univerjs-pro/slides-thread-comment/facade for slide-position and element anchors:
TypeScript
import '@univerjs-pro/slides-thread-comment/facade'if (slide) { await slide.createPositionCommentAsync({ x: 0.5, y: 0.25 }, 'Review this area.') const element = slide.getElements()[0] if (element) await element.createCommentAsync('Verify this element.')}FSlide exposes getComments() and listCommentsAsync() for the whole page, plus element-scoped query methods. FPageElement exposes comment creation and query methods for itself.
FPresentation
| Category | Methods |
|---|---|
| Identity and data | getId, getName, setName, getPresentation, save |
| Page size | getPageSize, setPageSize |
| Master graphics | getPresentationBackgroundGraphics, setPresentationBackgroundGraphics, clearPresentationBackgroundGraphics |
| Transitions | applyTransitionToAll |
| Slides | getSlides, getSlideById, getSlideByIndex, getActiveSlide, setActiveSlide, appendSlide, insertSlide, moveSlide, deleteSlide |
TypeScript
getId(): stringgetName(): stringsetName(name: string): thisgetPresentation(): SlideModelsave(): ISlideDatagetPageSize(): ISlidePageSizesetPageSize(pageSize: Partial<ISlidePageSize>): thisgetPresentationBackgroundGraphics(masterPageId?: string): ISlidePresentationBackgroundGraphic[]setPresentationBackgroundGraphics(graphics: ISlidePresentationBackgroundGraphic[], options?: ISetPresentationBackgroundGraphicsOptions): thisclearPresentationBackgroundGraphics(options?: ISetPresentationBackgroundGraphicsOptions): thisapplyTransitionToAll(transition: ISlideTransition): thisgetSlides(): FSlide[]getSlideById(id: string): FSlide | nullgetSlideByIndex(index: number): FSlide | nullgetActiveSlide(): FSlide | nullsetActiveSlide(slide: FSlide): thisappendSlide(options?: Partial<ISlidePage>): FSlideinsertSlide(index: number, options?: Partial<ISlidePage>): FSlidemoveSlide(slide: FSlide, toIndex: number): booleandeleteSlide(slide: FSlide): booleanFSlide
| Category | Methods |
|---|---|
| Identity and data | getId, getName, getData, getSlide |
| Notes and transition | getSpeakerNotes, setSpeakerNotes, getTransition, setTransition |
| Page layout | getPageSize, getPageLayout, setPageSize, getBackground, setBackground, setShowMasterBackground |
| Elements | getElements, getElementById, insertElement, deleteElement |
| Shapes | insertShape, getShape, getShapes |
| Images | newImage, insertImage, insertImageAsync, updateImage, getImages, removeImage |
| Groups | getGroups, group, ungroup |
Shared Shapes
insertShape() accepts IShapeCreateInput; geometry belongs under transform. The returned handle exposes the full common Shape Facade.
TypeScript
const presentation = univerAPI.getActivePresentation()const slide = presentation?.getActiveSlide()if (!slide) throw new Error('No active slide')const shape = slide.insertShape({ shapeType: univerAPI.Enum.ShapeTypeEnum.RoundRect, transform: { left: 100, top: 120, width: 240, height: 120 }, shapeData: { fill: { fillType: univerAPI.Enum.ShapeFillEnum.SolidFill, color: '#fef3c7' }, },})if (!shape) throw new Error('Cannot insert shape')shape.getText().setText('Slide highlight').setFontSize(24)shape.setRotation(-6)Images
Use insertImageAsync() for URL or blob sources. Use FImageBuilder when you need to build or update a complete image descriptor synchronously.
TypeScript
const image = await slide.insertImageAsync('https://example.com/image.png', { imageSourceType: univerAPI.Enum.ImageSourceType.URL, left: 80, top: 120, width: 320, height: 180,})image.setCrop({ left: 10, top: 10, right: 10, bottom: 10 })FSlidePageElement
All slide elements expose common transform and accessibility metadata.
TypeScript
getId(): stringgetType(): SlidePageElementTypegetData(): ISlidePageElementgetRichText(): RichTextValue | nullsetRichText(richText: RichTextValue): thisgetTransform(): ISlideDrawingTransformsetTransform(transform: Partial<ISlideDrawingTransform>): thissetPosition(left: number, top: number): thissetSize(width: number, height: number): thissetName(name: string): thissetDescription(description: string): thissetVisible(visible: boolean): thissetSelectable(selectable: boolean): thisFImage and FImageBuilder
TypeScript
// FImagegetSource(): stringsetSource(source: string, imageSourceType?: ImageSourceType): thissetCrop(crop: ISlideImageElement['crop']): thissetClipShape(prstGeom: ShapeTypeEnum, adjustValues?: Record<string, number>): thissetShapeData(shapeData: ISlideImageElement['shapeData']): thistoBuilder(): FImageBuilder// FImageBuildersetSource(source: string, imageSourceType?: ImageSourceType): thissetAbsolutePosition(left: number, top: number): thissetSize(width: number, height: number): thissetRotation(rotation: number): thissetCrop(crop: ISlideImageElement['crop']): thissetClipShape(prstGeom?: ShapeTypeEnum, adjustValues?: Record<string, number>): thissetShapeData(shapeData: ISlideImageElement['shapeData']): thisbuild(): ISlideImageBuilderInfoFGroup
TypeScript
getChildren(): FSlidePageElement[]ungroup(): FSlidePageElement[]@univerjs-pro/slidesHow is this guide?