@progress/kendo-angular-pdfviewer 24.0.0-develop.3 → 24.0.0-develop.31

package/fesm2022/progress-kendo-angular-pdfviewer.mjs

@@ -7,7 +7,7 @@ import { Input, Directive, forwardRef, Component, Injectable, HostBinding, Event
 import * as i1 from '@progress/kendo-angular-l10n';
 import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
 import { validatePackage } from '@progress/kendo-licensing';
-import { PdfViewerInteractionMode, removeChildren, PdfViewer } from '@progress/kendo-pdfviewer-common';
+import { PdfViewerInteractionMode, PdfViewer } from '@progress/kendo-pdfviewer-common';
 import { PreventableEvent, Keys, normalizeKeys, focusableSelector, getLicenseMessage, shouldShowValidationUI, hasObservers, EventsOutsideAngularDirective, WatermarkOverlayComponent, ResizeBatchService } from '@progress/kendo-angular-common';
 import { FileSelectComponent, UploadDropZoneComponent, CustomMessagesComponent as CustomMessagesComponent$1 } from '@progress/kendo-angular-upload';
 import { Subscription } from 'rxjs';
@@ -340,8 +340,8 @@ const packageMetadata = {
     productName: 'Kendo UI for Angular',
     productCode: 'KENDOUIANGULAR',
     productCodes: ['KENDOUIANGULAR'],
-    publishDate: 1776940661,
-    version: '24.0.0-develop.3',
+    publishDate: 1778841849,
+    version: '24.0.0-develop.31',
     licensingDocsUrl: 'https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning',
 };
 
@@ -1031,7 +1031,7 @@ class ToolbarComponent {
             accept=".pdf, .PDF"
             (change)="onFileSelect($event)" />
         }
-        `, isInline: true, dependencies: [{ kind: "component", type: ToolbarInputWrapperComponent, selector: "kendo-toolbar-input-wrapper", inputs: ["toolbarTool"] }, { kind: "directive", type: ToolbarFocusableDirective, selector: "[kendoPDFViewerToolbarFocusable]" }, { kind: "component", type: PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange", "pagerInputVisibilityChange", "pageTextVisibilityChange", "itemsTextVisibilityChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "inputAttributes", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "escape"], exportAs: ["kendoComboBox"] }, { kind: "directive", type: ToolbarComboBoxDirective, selector: "[kendoPDFViewerComboBox]" }, { kind: "directive", type: ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }] });
+        `, isInline: true, dependencies: [{ kind: "component", type: ToolbarInputWrapperComponent, selector: "kendo-toolbar-input-wrapper", inputs: ["toolbarTool"] }, { kind: "directive", type: ToolbarFocusableDirective, selector: "[kendoPDFViewerToolbarFocusable]" }, { kind: "component", type: PagerComponent, selector: "kendo-datapager, kendo-pager", inputs: ["externalTemplate", "total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size", "responsive", "adaptiveMode"], outputs: ["pageChange", "pageSizeChange", "pagerInputVisibilityChange", "pageTextVisibilityChange", "itemsTextVisibilityChange"], exportAs: ["kendoDataPager", "kendoPager"] }, { kind: "component", type: CustomMessagesComponent, selector: "kendo-datapager-messages, kendo-pager-messages" }, { kind: "component", type: ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: ComboBoxComponent, selector: "kendo-combobox", inputs: ["icon", "svgIcon", "inputAttributes", "showStickyHeader", "focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur", "escape"], exportAs: ["kendoComboBox"] }, { kind: "directive", type: ToolbarComboBoxDirective, selector: "[kendoPDFViewerComboBox]" }, { kind: "directive", type: ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: ToolbarComponent, decorators: [{
             type: Component,
@@ -1468,7 +1468,7 @@ class PDFViewerSearchComponent {
             (keydown.tab)="$event.preventDefault(); textbox.focus();"
             icon='x'
             [svgIcon]="xIcon"></button>
-    `, isInline: true, dependencies: [{ kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxSuffixTemplateDirective, selector: "[kendoTextBoxSuffixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "directive", type: TextBoxSuffixTemplateDirective, selector: "[kendoTextBoxSuffixTemplate]", inputs: ["showSeparator"] }, { kind: "component", type: ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: PDFViewerSearchComponent, decorators: [{
             type: Component,
@@ -1567,7 +1567,7 @@ class LoaderComponent {
     loaderPositionClass = true;
     static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
     static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: LoaderComponent, isStandalone: true, selector: "[kendoPDFViewerLoader]", inputs: { settings: "settings" }, host: { properties: { "class.k-loader-container": "this.loaderContainerClass", "class.k-loader-container-md": "this.loaderContainerSizingClass", "class.k-loader-top": "this.loaderPositionClass" } }, ngImport: i0, template: `
-        <div class="k-loader-container-overlay k-overlay-light"></div>
+        <div class="k-loader-container-overlay k-overlay"></div>
         <div class="k-loader-container-inner">
             <kendo-loader
                 [size]="settings?.size"
@@ -1581,7 +1581,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImpo
             args: [{
                     selector: '[kendoPDFViewerLoader]',
                     template: `
-        <div class="k-loader-container-overlay k-overlay-light"></div>
+        <div class="k-loader-container-overlay k-overlay"></div>
         <div class="k-loader-container-inner">
             <kendo-loader
                 [size]="settings?.size"
@@ -1795,7 +1795,7 @@ class AnnotationPopupToolbarContentComponent {
               (valueChange)="onColorValueChange($event)"
               fillMode="flat"></kendo-flatcolorpicker>
         }
-    `, isInline: true, dependencies: [{ kind: "component", type: i2.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i3.FlatColorPickerComponent, selector: "kendo-flatcolorpicker", inputs: ["readonly", "disabled", "format", "value", "tabindex", "clearButton", "preview", "actionsLayout", "activeView", "views", "gradientSettings", "adaptiveMode", "paletteSettings", "size"], outputs: ["valueChange", "cancel", "activeViewChange", "clearButtonClick", "actionButtonClick"], exportAs: ["kendoFlatColorPicker"] }, { kind: "component", type: i1$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
+    `, isInline: true, dependencies: [{ kind: "component", type: i2.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconPosition", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "component", type: i3.FlatColorPickerComponent, selector: "kendo-flatcolorpicker", inputs: ["readonly", "disabled", "format", "value", "tabindex", "clearButton", "preview", "actionsLayout", "activeView", "views", "gradientSettings", "adaptiveMode", "paletteSettings", "size"], outputs: ["valueChange", "cancel", "activeViewChange", "clearButtonClick", "actionButtonClick"], exportAs: ["kendoFlatColorPicker"] }, { kind: "component", type: i1$1.DropDownListComponent, selector: "kendo-dropdownlist", inputs: ["customIconClass", "showStickyHeader", "icon", "svgIcon", "loading", "data", "value", "textField", "valueField", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "defaultItem", "disabled", "itemDisabled", "readonly", "filterable", "virtual", "ignoreCase", "delay", "valuePrimitive", "tabindex", "tabIndex", "size", "rounded", "fillMode", "leftRightArrowsNavigation", "id"], outputs: ["valueChange", "filterChange", "selectionChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoDropDownList"] }] });
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: AnnotationPopupToolbarContentComponent, decorators: [{
             type: Component,
@@ -2058,7 +2058,7 @@ class PDFViewerComponent {
         if (!this.pdfContext?.pdfPages.length) {
             return;
         }
-        return this.pagesContainer.nativeElement.querySelectorAll('.k-page')[this.skip]?.getAttribute('id');
+        return this.pagesContainer.nativeElement.querySelectorAll('.k-page:not(.k-blank-page)')[this.skip]?.getAttribute('id');
     }
     /**
      * @hidden
@@ -2192,6 +2192,20 @@ class PDFViewerComponent {
     scrollToPage(page) {
         this.pdfViewerWidget?.scrollToPage({ pageNumber: page });
     }
+    /**
+     * Unloads the PDF document and displays a blank page.
+     */
+    unloadDocument() {
+        this.ngZone.runOutsideAngular(() => {
+            this.pdfViewerWidget?.destroy();
+            this.removePdfPageElements();
+        });
+        this.pdfContext = null;
+        this.loading = false;
+        this.skip = 0;
+        this._enabledSelection = true;
+        this.cdr.markForCheck();
+    }
     /**
      * @hidden
      */
@@ -2399,8 +2413,7 @@ class PDFViewerComponent {
         this.emitLoad = true;
         this.skip = 0;
         this.ngZone.runOutsideAngular(() => {
-            // try to destroy if new dynamic data source
-            this.pagesContainer && removeChildren(this.pagesContainer.nativeElement);
+            this.removePdfPageElements();
             const file = dataType === 'url' || dataType === 'data' ? { [dataType]: data } : { data };
             this.pdfViewerWidget = new PdfViewer(this.host.nativeElement, {
                 loadOnDemand: this.loadOnDemand,
@@ -2426,8 +2439,15 @@ class PDFViewerComponent {
             });
         });
     }
+    removePdfPageElements() {
+        const container = this.pagesContainer?.nativeElement;
+        if (!container) {
+            return;
+        }
+        Array.from(container.children).forEach((node) => container.removeChild(node));
+    }
     assignPageIds() {
-        this.pagesContainer.nativeElement.querySelectorAll('.k-page').forEach((pageElement, index) => {
+        this.pagesContainer.nativeElement.querySelectorAll('.k-page:not(.k-blank-page)').forEach((pageElement, index) => {
             const id = `k-pdfviewer-${counter}-page-${index + 1}`;
             this.renderer.setAttribute(pageElement, 'id', id);
         });

package/package-metadata.mjs

@@ -7,7 +7,7 @@ export const packageMetadata = {
   "productCodes": [
     "KENDOUIANGULAR"
   ],
-  "publishDate": 1776940661,
-  "version": "24.0.0-develop.3",
+  "publishDate": 1778841849,
+  "version": "24.0.0-develop.31",
   "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@progress/kendo-angular-pdfviewer",
-  "version": "24.0.0-develop.3",
+  "version": "24.0.0-develop.31",
   "description": "Kendo UI PDFViewer for Angular",
   "license": "SEE LICENSE IN LICENSE.md",
   "author": "Progress",
@@ -19,7 +19,7 @@
     "package": {
       "productName": "Kendo UI for Angular",
       "productCode": "KENDOUIANGULAR",
-      "publishDate": 1776940661,
+      "publishDate": 1778841849,
       "licensingDocsUrl": "https://www.telerik.com/kendo-angular-ui/my-license/?utm_medium=product&utm_source=kendoangular&utm_campaign=kendo-ui-angular-purchase-license-keys-warning"
     }
   },
@@ -29,23 +29,23 @@
     "@angular/core": "19 - 21",
     "@angular/platform-browser": "19 - 21",
     "@progress/kendo-licensing": "^1.11.0",
-    "@progress/kendo-angular-buttons": "24.0.0-develop.3",
-    "@progress/kendo-angular-common": "24.0.0-develop.3",
-    "@progress/kendo-angular-dialog": "24.0.0-develop.3",
-    "@progress/kendo-angular-dropdowns": "24.0.0-develop.3",
-    "@progress/kendo-angular-inputs": "24.0.0-develop.3",
-    "@progress/kendo-angular-intl": "24.0.0-develop.3",
-    "@progress/kendo-angular-l10n": "24.0.0-develop.3",
-    "@progress/kendo-angular-icons": "24.0.0-develop.3",
-    "@progress/kendo-angular-indicators": "24.0.0-develop.3",
-    "@progress/kendo-angular-pager": "24.0.0-develop.3",
-    "@progress/kendo-angular-popup": "24.0.0-develop.3",
-    "@progress/kendo-angular-upload": "24.0.0-develop.3",
+    "@progress/kendo-angular-buttons": "24.0.0-develop.31",
+    "@progress/kendo-angular-common": "24.0.0-develop.31",
+    "@progress/kendo-angular-dialog": "24.0.0-develop.31",
+    "@progress/kendo-angular-dropdowns": "24.0.0-develop.31",
+    "@progress/kendo-angular-inputs": "24.0.0-develop.31",
+    "@progress/kendo-angular-intl": "24.0.0-develop.31",
+    "@progress/kendo-angular-l10n": "24.0.0-develop.31",
+    "@progress/kendo-angular-icons": "24.0.0-develop.31",
+    "@progress/kendo-angular-indicators": "24.0.0-develop.31",
+    "@progress/kendo-angular-pager": "24.0.0-develop.31",
+    "@progress/kendo-angular-popup": "24.0.0-develop.31",
+    "@progress/kendo-angular-upload": "24.0.0-develop.31",
     "rxjs": "^6.5.3 || ^7.0.0"
   },
   "dependencies": {
     "tslib": "^2.3.1",
-    "@progress/kendo-angular-schematics": "24.0.0-develop.3",
+    "@progress/kendo-angular-schematics": "24.0.0-develop.31",
     "@progress/kendo-file-saver": "^1.0.1",
     "@progress/kendo-pdfviewer-common": "0.6.4"
   },

package/pdfviewer.component.d.ts

@@ -257,6 +257,10 @@ export declare class PDFViewerComponent implements OnInit, OnDestroy {
      * ([see example](https://www.telerik.com/kendo-angular-ui/components/pdfviewer/tools#programmatically-scrolling-the-pdfviewer)).
      */
     scrollToPage(page: number): void;
+    /**
+     * Unloads the PDF document and displays a blank page.
+     */
+    unloadDocument(): void;
     /**
      * @hidden
      */
@@ -337,6 +341,7 @@ export declare class PDFViewerComponent implements OnInit, OnDestroy {
      */
     toggleAnnotationsToolbar(): void;
     private loadPdf;
+    private removePdfPageElements;
     private assignPageIds;
     private setZoomLevel;
     private verifySettings;

package/schematics/ngAdd/index.js

@@ -9,8 +9,8 @@ const schematics_1 = require("@angular-devkit/schematics");
 function default_1(options) {
     const finalOptions = Object.assign(Object.assign({}, options), { mainNgModule: 'PDFViewerModule', package: 'pdfviewer', peerDependencies: {
             // peers of the dropdowns
-            '@progress/kendo-angular-navigation': '24.0.0-develop.3',
-            '@progress/kendo-angular-treeview': '24.0.0-develop.3'
+            '@progress/kendo-angular-navigation': '24.0.0-develop.31',
+            '@progress/kendo-angular-treeview': '24.0.0-develop.31'
         } });
     return (0, schematics_1.externalSchematic)('@progress/kendo-angular-schematics', 'ng-add', finalOptions);
 }