pptx-angular-viewer 1.29.0 → 1.30.0

package/CHANGELOG.md

@@ -4,6 +4,12 @@ All notable changes to this project are documented here.
 This file is generated from [Conventional Commits](https://www.conventionalcommits.org)
 by [git-cliff](https://git-cliff.org); do not edit it by hand.
 
+## [1.29.0](https://github.com/ChristopherVR/pptx-viewer/releases/tag/pptx-angular-viewer@1.29.0) - 2026-07-18
+
+### Dependencies
+
+- **deps:** Update dependencies to latest and migrate core/shared/locales to TypeScript 7 (by @ChristopherVR) ([cc72948](https://github.com/ChristopherVR/pptx-viewer/commit/cc729482cc5ae4ae56e1219f290c2953ec83c12a))
+
 ## [1.28.1](https://github.com/ChristopherVR/pptx-viewer/releases/tag/pptx-angular-viewer@1.28.1) - 2026-07-18
 
 ## [1.28.0](https://github.com/ChristopherVR/pptx-viewer/releases/tag/pptx-angular-viewer@1.28.0) - 2026-07-18

package/README.md

@@ -141,6 +141,66 @@ async save() {
 }
 ```
 
+### Composing your own custom viewer host
+
+`<pptx-viewer>` (`PowerPointViewerComponent`) is the bundled, batteries-included
+chrome, but its building blocks are curated exports too, so you can compose
+your own host component instead: bring your own layout/toolbar and reuse the
+ribbon and slide canvas directly, wired to the same shared DI state via
+`POWER_POINT_VIEWER_PROVIDERS`, the exact provider list `PowerPointViewerComponent`
+itself uses.
+
+```ts
+import { Component, inject, signal } from '@angular/core';
+import {
+	DEFAULT_CANVAS_HEIGHT,
+	DEFAULT_CANVAS_WIDTH,
+	EditorStateService,
+	LoadContentService,
+	POWER_POINT_VIEWER_PROVIDERS,
+	RibbonComponent,
+	SlideCanvasComponent,
+} from 'pptx-angular-viewer';
+
+@Component({
+	selector: 'my-custom-viewer',
+	standalone: true,
+	providers: [...POWER_POINT_VIEWER_PROVIDERS],
+	imports: [RibbonComponent, SlideCanvasComponent],
+	template: `
+		<pptx-ribbon
+			[slideIndex]="loader.activeSlideIndex()"
+			[slideCount]="editor.slides().length"
+			[canEdit]="true"
+			(save)="onSave()"
+		/>
+		<pptx-slide-canvas
+			[slide]="editor.slides()[loader.activeSlideIndex()]"
+			[canvasSize]="{ width: DEFAULT_CANVAS_WIDTH, height: DEFAULT_CANVAS_HEIGHT }"
+			[editable]="true"
+		/>
+	`,
+})
+export class MyCustomViewerComponent {
+	protected readonly loader = inject(LoadContentService);
+	protected readonly editor = inject(EditorStateService);
+	protected readonly DEFAULT_CANVAS_WIDTH = DEFAULT_CANVAS_WIDTH;
+	protected readonly DEFAULT_CANVAS_HEIGHT = DEFAULT_CANVAS_HEIGHT;
+
+	onSave() {
+		/* ... */
+	}
+}
+```
+
+`RibbonComponent` and `SlideCanvasComponent` are plain, DI-free `input()`/`output()`
+signal components (the ribbon renders ~90 bindings for the full Office-style tab
+set; the snippet above shows an illustrative subset, not the exhaustive list),
+so this recipe scales down too: provide only the services the pieces you use
+actually need instead of the full `POWER_POINT_VIEWER_PROVIDERS` list, as long
+as you cover whatever `inject()` calls those pieces make (`EditorStateService`
+and `LoadContentService` are the two nearly everything depends on).
+
 ## API
 
 ### Inputs
@@ -194,9 +254,12 @@ async save() {
 
 ### Exported components & helpers
 
-`PowerPointViewerComponent`, `SlideCanvasComponent`, `ElementRendererComponent`,
-`LoadContentService`, `provideViewerTheme`, `VIEWER_THEME`, and the
-`ViewerTheme` / `CanvasSize` / `CollaborationConfig` types.
+`PowerPointViewerComponent`, `SlideCanvasComponent`, `RibbonComponent`,
+`ElementRendererComponent`, `LoadContentService`, `POWER_POINT_VIEWER_PROVIDERS`,
+`provideViewerTheme`, `VIEWER_THEME`, and the `ViewerTheme` / `CanvasSize` /
+`CollaborationConfig` types. See "Composing your own custom viewer host" above
+for using `RibbonComponent` and `SlideCanvasComponent` outside
+`PowerPointViewerComponent`.
 
 ## Localization (i18n)