@progress/kendo-angular-pdfviewer 13.0.0-develop.10

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

@@ -0,0 +1,1943 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+import * as i0 from '@angular/core';
+import { Component, Input, HostBinding, Injectable, Directive, EventEmitter, ViewChild, Output, ElementRef, HostListener, forwardRef, isDevMode, NgModule } from '@angular/core';
+import * as i7 from '@angular/common';
+import { CommonModule } from '@angular/common';
+import { validatePackage } from '@progress/kendo-licensing';
+import { currentPage, removeChildren, scrollToPage, calculateZoomLevel, SearchService, print, goToNextSearchMatch, goToPreviousSearchMatch, loadPDF, Scroller, reloadDocument } from '@progress/kendo-pdfviewer-common';
+import { PreventableEvent, focusableSelector, Keys, hasObservers } from '@progress/kendo-angular-common';
+import * as i1$1 from '@progress/kendo-angular-l10n';
+import { ComponentMessages, LocalizationService, L10N_PREFIX } from '@progress/kendo-angular-l10n';
+import { saveAs } from '@progress/kendo-file-saver';
+import { Subscription } from 'rxjs';
+import 'pdfjs-dist/build/pdf.worker.entry';
+import * as i1 from '@progress/kendo-angular-indicators';
+import { LoaderModule } from '@progress/kendo-angular-indicators';
+import { zoomInIcon, zoomOutIcon, handIcon, pointerIcon, searchIcon, folderOpenIcon, downloadIcon, printIcon, convertLowercaseIcon, arrowUpIcon, arrowDownIcon, xIcon } from '@progress/kendo-svg-icons';
+import * as i4 from '@progress/kendo-angular-pager';
+import { PagerModule } from '@progress/kendo-angular-pager';
+import * as i5 from '@progress/kendo-angular-buttons';
+import { ButtonsModule } from '@progress/kendo-angular-buttons';
+import * as i1$2 from '@progress/kendo-angular-dropdowns';
+import { ComboBoxModule } from '@progress/kendo-angular-dropdowns';
+import * as i2 from '@progress/kendo-angular-inputs';
+import { TextBoxModule } from '@progress/kendo-angular-inputs';
+import { IconsModule } from '@progress/kendo-angular-icons';
+
+/**
+ * @hidden
+ */
+const packageMetadata = {
+    name: '@progress/kendo-angular-pdfviewer',
+    productName: 'Kendo UI for Angular',
+    productCodes: ['KENDOUIANGULAR', 'KENDOUICOMPLETE'],
+    publishDate: 1685119777,
+    version: '13.0.0-develop.10',
+    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',
+};
+
+/**
+ * @hidden
+ */
+const INITIAL_ZOOM_LEVEL = 1.25;
+/**
+ * @hidden
+ */
+const MIN_ZOOM_LEVEL = 0.5;
+/**
+ * @hidden
+ */
+const MAX_ZOOM_LEVEL = 4;
+/**
+ * @hidden
+ */
+const zoomOptionsData = [{
+        id: 1,
+        text: 'Fit to width',
+        type: 'FitToWidth',
+        displayValue: '',
+        value: 1
+    }, {
+        id: 2,
+        text: 'Fit to page',
+        type: 'FitToPage',
+        displayValue: '',
+        value: 1
+    }, {
+        id: 3,
+        text: '50%',
+        displayValue: '50%',
+        value: 0.5
+    }, {
+        id: 4,
+        text: '75%',
+        displayValue: '75%',
+        value: 0.75
+    }, {
+        id: 5,
+        text: '100%',
+        displayValue: '100%',
+        value: 1
+    }, {
+        id: 6,
+        text: '125%',
+        displayValue: '125%',
+        value: 1.25
+    }, {
+        id: 7,
+        text: '150%',
+        displayValue: '150%',
+        value: 1.5
+    }, {
+        id: 8,
+        text: '200%',
+        displayValue: '200%',
+        value: 2
+    }, {
+        id: 9,
+        text: '300%',
+        displayValue: '300%',
+        value: 3
+    }, {
+        id: 10,
+        text: '400%',
+        displayValue: '400%',
+        value: 4
+    }];
+
+/**
+ * Arguments for the `download` event. The event fires when the end user clicks the Download tool.
+ * If you cancel the event, the downloading of the file is prevented.
+ */
+class PDFViewerDownloadEvent extends PreventableEvent {
+    /**
+     * @hidden
+     */
+    constructor(blob, fileName, saveOptions, context) {
+        super();
+        this.blob = blob;
+        this.fileName = fileName;
+        this.saveOptions = saveOptions;
+        this.context = context;
+    }
+}
+
+/**
+ * @hidden
+ */
+class LoaderComponent {
+    constructor() {
+        this.loaderContainerClass = true;
+        this.loaderContainerSizingClass = true;
+        this.loaderPositionClass = true;
+    }
+}
+LoaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LoaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+LoaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: LoaderComponent, selector: "[loader]", 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-inner">
+            <kendo-loader
+                [size]="settings?.size"
+                [type]="settings?.type"
+                [themeColor]="settings?.themeColor"></kendo-loader>
+        </div>
+    `, isInline: true, components: [{ type: i1.LoaderComponent, selector: "kendo-loader", inputs: ["type", "themeColor", "size"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LoaderComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[loader]',
+                    template: `
+        <div class="k-loader-container-overlay k-overlay-light"></div>
+        <div class="k-loader-container-inner">
+            <kendo-loader
+                [size]="settings?.size"
+                [type]="settings?.type"
+                [themeColor]="settings?.themeColor"></kendo-loader>
+        </div>
+    `
+                }]
+        }], propDecorators: { settings: [{
+                type: Input
+            }], loaderContainerClass: [{
+                type: HostBinding,
+                args: ['class.k-loader-container']
+            }], loaderContainerSizingClass: [{
+                type: HostBinding,
+                args: ['class.k-loader-container-md']
+            }], loaderPositionClass: [{
+                type: HostBinding,
+                args: ['class.k-loader-top']
+            }] } });
+
+/**
+ * @hidden
+ */
+class ToolbarNavigationService {
+    constructor(localizationService) {
+        this.localizationService = localizationService;
+        this.focusableTools = [];
+        this.currentFocusIndex = 0;
+    }
+    register(tool) {
+        if (!this.focusableTools.some(el => el === tool)) {
+            this.focusableTools.push(tool);
+        }
+    }
+    unregister(tool) {
+        this.currentFocusIndex = 0;
+        this.focusableTools = this.focusableTools.filter(el => el !== tool);
+    }
+    isActive(focusable) {
+        return this.focusableTools[this.currentFocusIndex] === focusable;
+    }
+    setActiveIndex(tool) {
+        this.currentFocusIndex = Math.max(this.focusableTools.indexOf(tool), 0);
+    }
+    move(direction) {
+        let delta = direction === 'right' ? 1 : -1;
+        if (this.localizationService.rtl) {
+            delta = -delta;
+        }
+        this.currentFocusIndex += delta;
+        if (this.currentFocusIndex < 0) {
+            this.currentFocusIndex = this.focusableTools.length - 1;
+        }
+        else if (this.currentFocusIndex >= this.focusableTools.length) {
+            this.currentFocusIndex = 0;
+        }
+        this.focusableTools[this.currentFocusIndex].activate();
+    }
+}
+ToolbarNavigationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarNavigationService, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Injectable });
+ToolbarNavigationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarNavigationService });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarNavigationService, decorators: [{
+            type: Injectable
+        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+
+/**
+ * @hidden
+ */
+class ToolbarInputWrapperComponent {
+    constructor(host, renderer) {
+        this.host = host;
+        this.renderer = renderer;
+        this.hostClass = true;
+        this.subs = new Subscription();
+    }
+    ngAfterViewInit() {
+        this.subs.add(this.renderer.listen(this.host.nativeElement, 'keydown.enter', () => {
+            if (this.toolbarTool.focus) {
+                this.toolbarTool.focus();
+            }
+            else if (this.toolbarTool.element) {
+                this.toolbarTool.element.nativeElement.setAttribute('tabindex', '0');
+                this.toolbarTool.element.nativeElement.focus();
+            }
+        }));
+        this.subs.add(this.renderer.listen(this.host.nativeElement, 'blur', () => this.host.nativeElement.querySelectorAll(focusableSelector).forEach(el => el.setAttribute('tabindex', '-1'))));
+        this.subs.add(this.renderer.listen(this.host.nativeElement, 'keydown.escape', () => {
+            if (this.toolbarTool.blur) {
+                this.toolbarTool.blur();
+            }
+            else if (this.toolbarTool.element) {
+                this.toolbarTool.element.nativeElement.setAttribute('tabindex', '-1');
+                this.toolbarTool.element.nativeElement.blur();
+            }
+            ;
+            this.host.nativeElement.focus();
+        }));
+    }
+    ngOnDestroy() {
+        this.subs.unsubscribe();
+    }
+}
+ToolbarInputWrapperComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarInputWrapperComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component });
+ToolbarInputWrapperComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ToolbarInputWrapperComponent, selector: "kendo-toolbar-input-wrapper", inputs: { toolbarTool: "toolbarTool" }, host: { properties: { "class.k-toolbar-item": "this.hostClass" } }, ngImport: i0, template: `
+        <ng-content></ng-content>
+    `, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarInputWrapperComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'kendo-toolbar-input-wrapper',
+                    template: `
+        <ng-content></ng-content>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: i0.Renderer2 }]; }, propDecorators: { toolbarTool: [{
+                type: Input
+            }], hostClass: [{
+                type: HostBinding,
+                args: ['class.k-toolbar-item']
+            }] } });
+
+const controller = new AbortController();
+const { signal } = controller;
+/**
+ * @hidden
+ */
+class ToolbarFocusableDirective {
+    constructor(host, navigationService, renderer) {
+        this.host = host;
+        this.navigationService = navigationService;
+        this.renderer = renderer;
+        navigationService.register(this);
+    }
+    ngAfterViewInit() {
+        const element = this.host.nativeElement;
+        this.renderer.setAttribute(element, 'tabindex', this.navigationService.isActive(this) ? '0' : '-1');
+        element.addEventListener('keydown', (e) => {
+            const targetsSelf = e.target === element;
+            const isLeftArrow = e.keyCode === Keys.ArrowLeft;
+            const isRightArrow = e.keyCode === Keys.ArrowRight;
+            const isArrow = isLeftArrow || isRightArrow;
+            if (!targetsSelf || !isArrow) {
+                return;
+            }
+            this.renderer.setAttribute(element, 'tabindex', '-1');
+            element.querySelectorAll(focusableSelector).forEach(el => {
+                this.renderer.setAttribute(el, 'tabindex', '-1');
+            });
+            if (isRightArrow) {
+                this.navigationService.move('right');
+            }
+            else if (isLeftArrow) {
+                this.navigationService.move('left');
+            }
+        }, { signal, capture: true });
+        element.addEventListener('click', () => {
+            this.navigationService.setActiveIndex(this);
+        }, { signal, capture: true });
+    }
+    ngOnDestroy() {
+        controller.abort();
+        this.navigationService.unregister(this);
+    }
+    activate() {
+        const element = this.host.nativeElement;
+        this.renderer.setAttribute(element, 'tabindex', '0');
+        element.focus();
+    }
+}
+ToolbarFocusableDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarFocusableDirective, deps: [{ token: i0.ElementRef }, { token: ToolbarNavigationService }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Directive });
+ToolbarFocusableDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: ToolbarFocusableDirective, selector: "[kendoPDFViewerToolbarFocusable]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarFocusableDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[kendoPDFViewerToolbarFocusable]' }]
+        }], ctorParameters: function () { return [{ type: i0.ElementRef }, { type: ToolbarNavigationService }, { type: i0.Renderer2 }]; } });
+
+/**
+ * @hidden
+ */
+class ToolbarComboBoxDirective {
+    constructor(combo, hostEl) {
+        this.combo = combo;
+        this.hostEl = hostEl;
+        this.keydownHandler = (e) => {
+            if (e.keyCode === Keys.Escape) {
+                e.stopPropagation();
+                if (this.combo.isOpen) {
+                    this.combo.toggle(false);
+                }
+                else {
+                    this.hostEl.nativeElement.parentElement.focus();
+                }
+            }
+        };
+    }
+    ngAfterViewInit() {
+        this.inputElement = this.combo.searchbar.input.nativeElement;
+        this.hostEl.nativeElement.setAttribute('tabindex', '-1');
+        this.inputElement.addEventListener('keydown', this.keydownHandler, true);
+    }
+    ngOnDestroy() {
+        this.inputElement.removeEventListener('keydown', this.keydownHandler);
+    }
+}
+ToolbarComboBoxDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarComboBoxDirective, deps: [{ token: i1$2.ComboBoxComponent }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Directive });
+ToolbarComboBoxDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: ToolbarComboBoxDirective, selector: "[kendoPDFViewerComboBox]", ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarComboBoxDirective, decorators: [{
+            type: Directive,
+            args: [{ selector: '[kendoPDFViewerComboBox]' }]
+        }], ctorParameters: function () { return [{ type: i1$2.ComboBoxComponent }, { type: i0.ElementRef }]; } });
+
+/* eslint-disable @typescript-eslint/no-empty-function */
+/**
+ * @hidden
+ */
+class ToolbarComponent {
+    constructor(localization, navigationService) {
+        this.localization = localization;
+        this.navigationService = navigationService;
+        this.toolbarClass = true;
+        this.toolbarSizeClass = true;
+        this.zoomLevel = {
+            text: '125%',
+            displayValue: '125%',
+            value: 1.25
+        };
+        this.calculatedComboBoxValue = {
+            text: 'Fit to width',
+            displayValue: null,
+            value: null
+        };
+        this.skip = 0;
+        this.pageSize = 1;
+        this.fileSelect = new EventEmitter();
+        this.fileSelectError = new EventEmitter();
+        this.download = new EventEmitter();
+        this.selectionEnabled = new EventEmitter();
+        this.panningEnabled = new EventEmitter();
+        this.pageChange = new EventEmitter();
+        this.zoomIn = new EventEmitter();
+        this.zoomOut = new EventEmitter();
+        this.zoomLevelChange = new EventEmitter();
+        this.print = new EventEmitter();
+        this.search = new EventEmitter();
+        this.zoomInIcon = zoomInIcon;
+        this.zoomOutIcon = zoomOutIcon;
+        this.handIcon = handIcon;
+        this.pointerIcon = pointerIcon;
+        this.searchIcon = searchIcon;
+        this.folderOpenIcon = folderOpenIcon;
+        this.downloadIcon = downloadIcon;
+        this.printIcon = printIcon;
+        this.pagerType = 'input';
+    }
+    messageFor(key) {
+        return this.localization.get(key);
+    }
+    onFileSelect(e) {
+        const file = e.target.files[0];
+        if (file) {
+            const reader = new FileReader();
+            reader.onload = (e) => {
+                const data = e.target.result;
+                this.fileSelect.emit(data);
+            };
+            reader.onerror = (e) => {
+                this.fileSelect.emit(e);
+            };
+            reader.readAsDataURL(file);
+        }
+    }
+    onZoomLevelChooserValueChange(zoomLevel) {
+        this.zoomLevelChange.emit(zoomLevel);
+    }
+    focus() {
+        this.navigationService.focusableTools[this.navigationService.currentFocusIndex].activate();
+    }
+}
+ToolbarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarComponent, deps: [{ token: i1$1.LocalizationService }, { token: ToolbarNavigationService }], target: i0.ɵɵFactoryTarget.Component });
+ToolbarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: ToolbarComponent, selector: "[toolbar]", inputs: { zoomLevel: "zoomLevel", calculatedComboBoxValue: "calculatedComboBoxValue", skip: "skip", pageSize: "pageSize", total: "total", zoomInDisabled: "zoomInDisabled", zoomOutDisabled: "zoomOutDisabled", disabledTools: "disabledTools", zoomLevelChooserValue: "zoomLevelChooserValue", zoomOptionsData: "zoomOptionsData", pagesContainerId: "pagesContainerId", tools: "tools" }, outputs: { fileSelect: "fileSelect", fileSelectError: "fileSelectError", download: "download", selectionEnabled: "selectionEnabled", panningEnabled: "panningEnabled", pageChange: "pageChange", zoomIn: "zoomIn", zoomOut: "zoomOut", zoomLevelChange: "zoomLevelChange", print: "print", search: "search" }, host: { properties: { "class.k-toolbar": "this.toolbarClass", "class.k-toolbar-md": "this.toolbarSizeClass" } }, providers: [ToolbarNavigationService], viewQueries: [{ propertyName: "fileSelectEl", first: true, predicate: ["fileSelectEl"], descendants: true }], ngImport: i0, template: `
+        <ng-container *ngFor="let tool of tools">
+            <ng-container [ngSwitch]="tool">
+                <kendo-toolbar-input-wrapper
+                    *ngSwitchCase="'pager'"
+                    kendoPDFViewerToolbarFocusable
+                    [toolbarTool]="pager">
+                    <kendo-datapager
+                        #pager
+                        [attr.aria-controls]="pagesContainerId"
+                        [attr.aria-label]="messageFor('page') + ' ' + (skip + 1) + ' ' + messageFor('of') + total"
+                        [class.k-disabled]="disabledTools"
+                        [navigable]="true"
+                        [pageSize]="pageSize"
+                        [skip]="skip"
+                        [total]="total"
+                        [pageSizeValues]="false"
+                        [info]="false"
+                        [type]="pagerType"
+                        (pageChange)="pageChange.emit($event)">
+                        <kendo-datapager-messages
+                            [firstPage]="messageFor('pagerFirstPage')"
+                            [previousPage]="messageFor('pagerPreviousPage')"
+                            [nextPage]="messageFor('pagerNextPage')"
+                            [lastPage]="messageFor('pagerLastPage')"
+                            [inputLabel]="messageFor('pagerInputLabel')"
+                            [pageNumberInputTitle]="messageFor('pagerInputTitle')"
+                            [of]="messageFor('pagerOf')"
+                            [page]="messageFor('pagerPage')"></kendo-datapager-messages>
+                    </kendo-datapager>
+                </kendo-toolbar-input-wrapper>
+                <span
+                    *ngSwitchCase="'spacer'"
+                    class="k-spacer"></span>
+                <kendo-buttongroup
+                    *ngSwitchCase="'zoomInOut'"
+                    [attr.aria-controls]="pagesContainerId"
+                    [navigable]="false">
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="zoom-out"
+                        [disabled]="disabledTools || zoomOutDisabled"
+                        [svgIcon]="zoomOutIcon"
+                        [attr.title]="messageFor('zoomOutTitle')"
+                        [attr.aria-label]="messageFor('zoomOutTitle')"
+                        (click)="zoomOut.emit()"></button>
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="zoom-in"
+                        [disabled]="disabledTools || zoomInDisabled"
+                        [svgIcon]="zoomInIcon"
+                        [attr.title]="messageFor('zoomInTitle')"
+                        [attr.aria-label]="messageFor('zoomInTitle')"
+                        (click)="zoomIn.emit()"></button>
+                </kendo-buttongroup>
+                <kendo-toolbar-input-wrapper
+                    *ngSwitchCase="'zoom'"
+                    kendoPDFViewerToolbarFocusable
+                    [toolbarTool]="combobox">
+                    <kendo-combobox
+                        #combobox
+                        kendoPDFViewerComboBox
+                        [attr.aria-controls]="pagesContainerId"
+                        [tabindex]="-1"
+                        [data]="zoomOptionsData"
+                        [disabled]="disabledTools"
+                        [placeholder]="messageFor('zoomInputPlaceholder')"
+                        textField="displayValue"
+                        valueField="id"
+                        [value]="zoomLevelChooserValue"
+                        [allowCustom]="true"
+                        (valueChange)="onZoomLevelChooserValueChange($event)">
+                        <ng-template kendoComboBoxItemTemplate let-dataItem>
+                            {{ dataItem.type ? messageFor('f' + dataItem.type.slice(1)) : dataItem.text }}
+                        </ng-template>
+                    </kendo-combobox>
+                </kendo-toolbar-input-wrapper>
+                <kendo-buttongroup
+                    *ngSwitchCase="'selection'"
+                    [attr.aria-controls]="pagesContainerId"
+                    [navigable]="false"
+                    selection="single">
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="pointer"
+                        [toggleable]="true"
+                        [svgIcon]="pointerIcon"
+                        [attr.title]="messageFor('selectionTitle')"
+                        [attr.aria-label]="messageFor('selectionTitle')"
+                        (click)="selectionEnabled.emit()"></button>
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="hand"
+                        [toggleable]="true"
+                        [selected]="true"
+                        [attr.title]="messageFor('panningTitle')"
+                        [attr.aria-label]="messageFor('panningTitle')"
+                        (click)="panningEnabled.emit()"></button>
+                </kendo-buttongroup>
+                <button
+                    *ngSwitchCase="'search'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="search"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('searchTitle')"
+                    [attr.aria-label]="messageFor('searchTitle')"
+                    aria-haspopup="dialog"
+                    [svgIcon]="searchIcon"
+                    (click)="search.emit()"></button>
+                <button
+                    *ngSwitchCase="'open'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="folder-open"
+                    [svgIcon]="folderOpenIcon"
+                    [attr.title]="messageFor('openTitle')"
+                    [attr.aria-label]="messageFor('openTitle')"
+                    [attr.aria-controls]="pagesContainerId"
+                    (click)="fileSelectEl?.nativeElement.click()">
+                </button>
+                <button
+                    *ngSwitchCase="'download'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="download"
+                    [svgIcon]="downloadIcon"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('downloadTitle')"
+                    [attr.aria-label]="messageFor('downloadTitle')"
+                    (click)="download.emit()"></button>
+                <button
+                    *ngSwitchCase="'print'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="print"
+                    [svgIcon]="printIcon"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('printTitle')"
+                    [attr.aria-label]="messageFor('printTitle')"
+                    (click)="print.emit()"></button>
+            </ng-container>
+        </ng-container>
+        <input
+            #fileSelectEl
+            *ngIf="tools?.indexOf('open') > -1;"
+            type="file"
+            [style.display]="'none'"
+            aria-hidden="true"
+            accept=".pdf, .PDF"
+            (change)="onFileSelect($event)" />
+    `, isInline: true, components: [{ type: ToolbarInputWrapperComponent, selector: "kendo-toolbar-input-wrapper", inputs: ["toolbarTool"] }, { type: i4.PagerComponent, selector: "kendo-datapager", inputs: ["total", "skip", "pageSize", "buttonCount", "info", "type", "pageSizeValues", "previousNext", "navigable", "size"], outputs: ["pageChange", "pageSizeChange"], exportAs: ["kendoDataPager"] }, { type: i4.CustomMessagesComponent, selector: "kendo-datapager-messages" }, { type: i5.ButtonGroupComponent, selector: "kendo-buttongroup", inputs: ["disabled", "selection", "width", "tabIndex", "navigable"], outputs: ["navigate"], exportAs: ["kendoButtonGroup"] }, { type: i5.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { type: i1$2.ComboBoxComponent, selector: "kendo-combobox", inputs: ["focusableId", "allowCustom", "data", "value", "textField", "valueField", "valuePrimitive", "valueNormalizer", "placeholder", "adaptiveMode", "title", "subtitle", "popupSettings", "listHeight", "iconClass", "loading", "suggest", "clearButton", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode"], outputs: ["valueChange", "selectionChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur"], exportAs: ["kendoComboBox"] }], directives: [{ type: i7.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i7.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { type: i7.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { type: ToolbarFocusableDirective, selector: "[kendoPDFViewerToolbarFocusable]" }, { type: ToolbarComboBoxDirective, selector: "[kendoPDFViewerComboBox]" }, { type: i1$2.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: ToolbarComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[toolbar]',
+                    providers: [ToolbarNavigationService],
+                    template: `
+        <ng-container *ngFor="let tool of tools">
+            <ng-container [ngSwitch]="tool">
+                <kendo-toolbar-input-wrapper
+                    *ngSwitchCase="'pager'"
+                    kendoPDFViewerToolbarFocusable
+                    [toolbarTool]="pager">
+                    <kendo-datapager
+                        #pager
+                        [attr.aria-controls]="pagesContainerId"
+                        [attr.aria-label]="messageFor('page') + ' ' + (skip + 1) + ' ' + messageFor('of') + total"
+                        [class.k-disabled]="disabledTools"
+                        [navigable]="true"
+                        [pageSize]="pageSize"
+                        [skip]="skip"
+                        [total]="total"
+                        [pageSizeValues]="false"
+                        [info]="false"
+                        [type]="pagerType"
+                        (pageChange)="pageChange.emit($event)">
+                        <kendo-datapager-messages
+                            [firstPage]="messageFor('pagerFirstPage')"
+                            [previousPage]="messageFor('pagerPreviousPage')"
+                            [nextPage]="messageFor('pagerNextPage')"
+                            [lastPage]="messageFor('pagerLastPage')"
+                            [inputLabel]="messageFor('pagerInputLabel')"
+                            [pageNumberInputTitle]="messageFor('pagerInputTitle')"
+                            [of]="messageFor('pagerOf')"
+                            [page]="messageFor('pagerPage')"></kendo-datapager-messages>
+                    </kendo-datapager>
+                </kendo-toolbar-input-wrapper>
+                <span
+                    *ngSwitchCase="'spacer'"
+                    class="k-spacer"></span>
+                <kendo-buttongroup
+                    *ngSwitchCase="'zoomInOut'"
+                    [attr.aria-controls]="pagesContainerId"
+                    [navigable]="false">
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="zoom-out"
+                        [disabled]="disabledTools || zoomOutDisabled"
+                        [svgIcon]="zoomOutIcon"
+                        [attr.title]="messageFor('zoomOutTitle')"
+                        [attr.aria-label]="messageFor('zoomOutTitle')"
+                        (click)="zoomOut.emit()"></button>
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="zoom-in"
+                        [disabled]="disabledTools || zoomInDisabled"
+                        [svgIcon]="zoomInIcon"
+                        [attr.title]="messageFor('zoomInTitle')"
+                        [attr.aria-label]="messageFor('zoomInTitle')"
+                        (click)="zoomIn.emit()"></button>
+                </kendo-buttongroup>
+                <kendo-toolbar-input-wrapper
+                    *ngSwitchCase="'zoom'"
+                    kendoPDFViewerToolbarFocusable
+                    [toolbarTool]="combobox">
+                    <kendo-combobox
+                        #combobox
+                        kendoPDFViewerComboBox
+                        [attr.aria-controls]="pagesContainerId"
+                        [tabindex]="-1"
+                        [data]="zoomOptionsData"
+                        [disabled]="disabledTools"
+                        [placeholder]="messageFor('zoomInputPlaceholder')"
+                        textField="displayValue"
+                        valueField="id"
+                        [value]="zoomLevelChooserValue"
+                        [allowCustom]="true"
+                        (valueChange)="onZoomLevelChooserValueChange($event)">
+                        <ng-template kendoComboBoxItemTemplate let-dataItem>
+                            {{ dataItem.type ? messageFor('f' + dataItem.type.slice(1)) : dataItem.text }}
+                        </ng-template>
+                    </kendo-combobox>
+                </kendo-toolbar-input-wrapper>
+                <kendo-buttongroup
+                    *ngSwitchCase="'selection'"
+                    [attr.aria-controls]="pagesContainerId"
+                    [navigable]="false"
+                    selection="single">
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="pointer"
+                        [toggleable]="true"
+                        [svgIcon]="pointerIcon"
+                        [attr.title]="messageFor('selectionTitle')"
+                        [attr.aria-label]="messageFor('selectionTitle')"
+                        (click)="selectionEnabled.emit()"></button>
+                    <button
+                        kendoButton
+                        kendoPDFViewerToolbarFocusable
+                        icon="hand"
+                        [toggleable]="true"
+                        [selected]="true"
+                        [attr.title]="messageFor('panningTitle')"
+                        [attr.aria-label]="messageFor('panningTitle')"
+                        (click)="panningEnabled.emit()"></button>
+                </kendo-buttongroup>
+                <button
+                    *ngSwitchCase="'search'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="search"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('searchTitle')"
+                    [attr.aria-label]="messageFor('searchTitle')"
+                    aria-haspopup="dialog"
+                    [svgIcon]="searchIcon"
+                    (click)="search.emit()"></button>
+                <button
+                    *ngSwitchCase="'open'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="folder-open"
+                    [svgIcon]="folderOpenIcon"
+                    [attr.title]="messageFor('openTitle')"
+                    [attr.aria-label]="messageFor('openTitle')"
+                    [attr.aria-controls]="pagesContainerId"
+                    (click)="fileSelectEl?.nativeElement.click()">
+                </button>
+                <button
+                    *ngSwitchCase="'download'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="download"
+                    [svgIcon]="downloadIcon"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('downloadTitle')"
+                    [attr.aria-label]="messageFor('downloadTitle')"
+                    (click)="download.emit()"></button>
+                <button
+                    *ngSwitchCase="'print'"
+                    kendoPDFViewerToolbarFocusable
+                    kendoButton
+                    icon="print"
+                    [svgIcon]="printIcon"
+                    [disabled]="disabledTools"
+                    [attr.title]="messageFor('printTitle')"
+                    [attr.aria-label]="messageFor('printTitle')"
+                    (click)="print.emit()"></button>
+            </ng-container>
+        </ng-container>
+        <input
+            #fileSelectEl
+            *ngIf="tools?.indexOf('open') > -1;"
+            type="file"
+            [style.display]="'none'"
+            aria-hidden="true"
+            accept=".pdf, .PDF"
+            (change)="onFileSelect($event)" />
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }, { type: ToolbarNavigationService }]; }, propDecorators: { toolbarClass: [{
+                type: HostBinding,
+                args: ['class.k-toolbar']
+            }], toolbarSizeClass: [{
+                type: HostBinding,
+                args: ['class.k-toolbar-md']
+            }], fileSelectEl: [{
+                type: ViewChild,
+                args: ['fileSelectEl']
+            }], zoomLevel: [{
+                type: Input
+            }], calculatedComboBoxValue: [{
+                type: Input
+            }], skip: [{
+                type: Input
+            }], pageSize: [{
+                type: Input
+            }], total: [{
+                type: Input
+            }], zoomInDisabled: [{
+                type: Input
+            }], zoomOutDisabled: [{
+                type: Input
+            }], disabledTools: [{
+                type: Input
+            }], zoomLevelChooserValue: [{
+                type: Input
+            }], zoomOptionsData: [{
+                type: Input
+            }], pagesContainerId: [{
+                type: Input
+            }], tools: [{
+                type: Input
+            }], fileSelect: [{
+                type: Output
+            }], fileSelectError: [{
+                type: Output
+            }], download: [{
+                type: Output
+            }], selectionEnabled: [{
+                type: Output
+            }], panningEnabled: [{
+                type: Output
+            }], pageChange: [{
+                type: Output
+            }], zoomIn: [{
+                type: Output
+            }], zoomOut: [{
+                type: Output
+            }], zoomLevelChange: [{
+                type: Output
+            }], print: [{
+                type: Output
+            }], search: [{
+                type: Output
+            }] } });
+
+/**
+ * @hidden
+ */
+class PDFViewerSearchComponent {
+    constructor(localization) {
+        this.localization = localization;
+        this.ariaRole = 'dialog';
+        this.searchChange = new EventEmitter();
+        this.prevMatch = new EventEmitter();
+        this.nextMatch = new EventEmitter();
+        this.close = new EventEmitter();
+        this.convertLowercaseIcon = convertLowercaseIcon;
+        this.arrowUpIcon = arrowUpIcon;
+        this.arrowDownIcon = arrowDownIcon;
+        this.xIcon = xIcon;
+        this.value = null;
+        this.matchCase = false;
+    }
+    onEscape() {
+        this.close.emit();
+    }
+    ngAfterViewInit() {
+        this.textbox.focus();
+    }
+    messageFor(key) {
+        return this.localization.get(key);
+    }
+    onShiftTab(e) {
+        if (e.target.matches('.k-input-inner')) {
+            e.preventDefault();
+            this.closeButton.nativeElement.focus();
+        }
+    }
+}
+PDFViewerSearchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerSearchComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+PDFViewerSearchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PDFViewerSearchComponent, selector: "[kendoPDFViewerSearch]", inputs: { matches: "matches", currentMatch: "currentMatch" }, outputs: { searchChange: "searchChange", prevMatch: "prevMatch", nextMatch: "nextMatch", close: "close" }, host: { listeners: { "keydown.escape": "onEscape()" }, properties: { "attr.role": "this.ariaRole" } }, viewQueries: [{ propertyName: "textbox", first: true, predicate: ["textbox"], descendants: true }, { propertyName: "closeButton", first: true, predicate: ["closeButton"], descendants: true, read: ElementRef }], ngImport: i0, template: `
+        <kendo-textbox
+            #textbox
+            [placeholder]="messageFor('searchInputPlaceholder')"
+            [value]="value"
+            (valueChange)="value = $event; searchChange.emit({text: $event, matchCase})"
+            (keydown.shift.tab)="onShiftTab($event)">
+            <ng-template kendoTextBoxSuffixTemplate>
+                <button
+                    kendoButton
+                    [attr.title]="messageFor('searchMatchCaseTitle')"
+                    fillMode="flat"
+                    [togglable]="true"
+                    (click)="matchCase = !matchCase; searchChange.emit({text: value, matchCase})"
+                    icon="convert-lowercase"
+                    [svgIcon]="convertLowercaseIcon"></button>
+            </ng-template>
+        </kendo-textbox>
+        <span class="k-search-matches">
+            <span>{{currentMatch}}</span> {{messageFor('searchMatchesOf')}} <span>{{matches}}</span>
+        </span>
+        <button
+            kendoButton
+            [attr.title]="messageFor('searchPreviousMatchTitle')"
+            fillMode="flat"
+            [disabled]="matches === 0"
+            (click)="prevMatch.emit()"
+            icon='arrow-up'
+            [svgIcon]="arrowUpIcon"></button>
+        <button
+            kendoButton
+            [attr.title]="messageFor('searchNextMatchTitle')"
+            fillMode="flat"
+            [disabled]="matches === 0"
+            (click)="nextMatch.emit()"
+            icon='arrow-down'
+            [svgIcon]="arrowDownIcon"></button>
+        <button
+            #closeButton
+            kendoButton
+            [attr.title]="messageFor('searchCloseTitle')"
+            fillMode="flat"
+            (click)="close.emit()"
+            (keydown.tab)="$event.preventDefault(); textbox.focus();"
+            icon='x'
+            [svgIcon]="xIcon"></button>
+    `, isInline: true, components: [{ type: i2.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "errorIcon", "clearButtonIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { type: i5.Button, selector: "button[kendoButton], span[kendoButton], kendo-button", inputs: ["toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "role", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }], directives: [{ type: i2.TextBoxSuffixTemplateDirective, selector: "[kendoTextBoxSuffixTemplate]" }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerSearchComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: '[kendoPDFViewerSearch]',
+                    template: `
+        <kendo-textbox
+            #textbox
+            [placeholder]="messageFor('searchInputPlaceholder')"
+            [value]="value"
+            (valueChange)="value = $event; searchChange.emit({text: $event, matchCase})"
+            (keydown.shift.tab)="onShiftTab($event)">
+            <ng-template kendoTextBoxSuffixTemplate>
+                <button
+                    kendoButton
+                    [attr.title]="messageFor('searchMatchCaseTitle')"
+                    fillMode="flat"
+                    [togglable]="true"
+                    (click)="matchCase = !matchCase; searchChange.emit({text: value, matchCase})"
+                    icon="convert-lowercase"
+                    [svgIcon]="convertLowercaseIcon"></button>
+            </ng-template>
+        </kendo-textbox>
+        <span class="k-search-matches">
+            <span>{{currentMatch}}</span> {{messageFor('searchMatchesOf')}} <span>{{matches}}</span>
+        </span>
+        <button
+            kendoButton
+            [attr.title]="messageFor('searchPreviousMatchTitle')"
+            fillMode="flat"
+            [disabled]="matches === 0"
+            (click)="prevMatch.emit()"
+            icon='arrow-up'
+            [svgIcon]="arrowUpIcon"></button>
+        <button
+            kendoButton
+            [attr.title]="messageFor('searchNextMatchTitle')"
+            fillMode="flat"
+            [disabled]="matches === 0"
+            (click)="nextMatch.emit()"
+            icon='arrow-down'
+            [svgIcon]="arrowDownIcon"></button>
+        <button
+            #closeButton
+            kendoButton
+            [attr.title]="messageFor('searchCloseTitle')"
+            fillMode="flat"
+            (click)="close.emit()"
+            (keydown.tab)="$event.preventDefault(); textbox.focus();"
+            icon='x'
+            [svgIcon]="xIcon"></button>
+    `
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; }, propDecorators: { textbox: [{
+                type: ViewChild,
+                args: ['textbox']
+            }], closeButton: [{
+                type: ViewChild,
+                args: ['closeButton', { read: ElementRef }]
+            }], ariaRole: [{
+                type: HostBinding,
+                args: ['attr.role']
+            }], onEscape: [{
+                type: HostListener,
+                args: ['keydown.escape']
+            }], matches: [{
+                type: Input
+            }], currentMatch: [{
+                type: Input
+            }], searchChange: [{
+                type: Output
+            }], prevMatch: [{
+                type: Output
+            }], nextMatch: [{
+                type: Output
+            }], close: [{
+                type: Output
+            }] } });
+
+/**
+ * @hidden
+ */
+class Messages extends ComponentMessages {
+}
+Messages.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: Messages, deps: null, target: i0.ɵɵFactoryTarget.Directive });
+Messages.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: Messages, selector: "kendo-pdfviewer-messages-base", inputs: { zoomInTitle: "zoomInTitle", zoomOutTitle: "zoomOutTitle", selectionTitle: "selectionTitle", panningTitle: "panningTitle", searchTitle: "searchTitle", openTitle: "openTitle", downloadTitle: "downloadTitle", printTitle: "printTitle", pagerInputLabel: "pagerInputLabel", pagerInputTitle: "pagerInputTitle", pagerFirstPage: "pagerFirstPage", pagerPreviousPage: "pagerPreviousPage", pagerNextPage: "pagerNextPage", pagerLastPage: "pagerLastPage", pagerOf: "pagerOf", pagerPage: "pagerPage", fitToPage: "fitToPage", fitToWidth: "fitToWidth", searchInputPlaceholder: "searchInputPlaceholder", searchMatchesOf: "searchMatchesOf", searchPreviousMatchTitle: "searchPreviousMatchTitle", searchNextMatchTitle: "searchNextMatchTitle", searchCloseTitle: "searchCloseTitle", searchMatchCaseTitle: "searchMatchCaseTitle", zoomInputPlaceholder: "zoomInputPlaceholder" }, usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: Messages, decorators: [{
+            type: Directive,
+            args: [{
+                    // eslint-disable-next-line @angular-eslint/directive-selector
+                    selector: 'kendo-pdfviewer-messages-base'
+                }]
+        }], propDecorators: { zoomInTitle: [{
+                type: Input
+            }], zoomOutTitle: [{
+                type: Input
+            }], selectionTitle: [{
+                type: Input
+            }], panningTitle: [{
+                type: Input
+            }], searchTitle: [{
+                type: Input
+            }], openTitle: [{
+                type: Input
+            }], downloadTitle: [{
+                type: Input
+            }], printTitle: [{
+                type: Input
+            }], pagerInputLabel: [{
+                type: Input
+            }], pagerInputTitle: [{
+                type: Input
+            }], pagerFirstPage: [{
+                type: Input
+            }], pagerPreviousPage: [{
+                type: Input
+            }], pagerNextPage: [{
+                type: Input
+            }], pagerLastPage: [{
+                type: Input
+            }], pagerOf: [{
+                type: Input
+            }], pagerPage: [{
+                type: Input
+            }], fitToPage: [{
+                type: Input
+            }], fitToWidth: [{
+                type: Input
+            }], searchInputPlaceholder: [{
+                type: Input
+            }], searchMatchesOf: [{
+                type: Input
+            }], searchPreviousMatchTitle: [{
+                type: Input
+            }], searchNextMatchTitle: [{
+                type: Input
+            }], searchCloseTitle: [{
+                type: Input
+            }], searchMatchCaseTitle: [{
+                type: Input
+            }], zoomInputPlaceholder: [{
+                type: Input
+            }] } });
+
+/**
+ * @hidden
+ */
+class LocalizedPDFViewerMessagesDirective extends Messages {
+    constructor(service) {
+        super();
+        this.service = service;
+    }
+}
+LocalizedPDFViewerMessagesDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LocalizedPDFViewerMessagesDirective, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Directive });
+LocalizedPDFViewerMessagesDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.3.12", type: LocalizedPDFViewerMessagesDirective, selector: "[kendoPDFViewerLocalizedMessages]", providers: [
+        {
+            provide: Messages,
+            useExisting: forwardRef(() => LocalizedPDFViewerMessagesDirective)
+        }
+    ], usesInheritance: true, ngImport: i0 });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: LocalizedPDFViewerMessagesDirective, decorators: [{
+            type: Directive,
+            args: [{
+                    providers: [
+                        {
+                            provide: Messages,
+                            useExisting: forwardRef(() => LocalizedPDFViewerMessagesDirective)
+                        }
+                    ],
+                    selector: '[kendoPDFViewerLocalizedMessages]'
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+
+let counter = 0;
+/**
+ * Represents the [Kendo UI PDFViewer component for Angular]({% slug overview_pdfviewer %}).
+ */
+class PDFViewerComponent {
+    constructor(ngZone, renderer, localizationService) {
+        this.ngZone = ngZone;
+        this.renderer = renderer;
+        this.localizationService = localizationService;
+        this.hostClass = true;
+        /**
+         * Represents the tools collection rendered in the toolbar.
+         * @default ['pager', 'spacer', 'zoomInOut', 'zoom', 'selection', 'spacer', 'search', 'open', 'download', 'print' ]
+         */
+        this.tools = [
+            'pager',
+            'spacer',
+            'zoomInOut',
+            'zoom',
+            'selection',
+            'spacer',
+            'search',
+            'open',
+            'download',
+            'print'
+        ];
+        /**
+         * The configuration of the internal Loader component.
+         * @default { size: 'large', type: 'pulsing', themeColor: 'primary' }
+         */
+        this.loaderSettings = {
+            size: 'large',
+            type: 'pulsing',
+            themeColor: 'primary'
+        };
+        /**
+         * The name of the file that will be saved when the end user clicks the Download tool.
+         * @default 'Download'
+         */
+        this.saveFileName = 'Download';
+        /**
+         * Represents the options for saving the file when the end user clicks the Download tool.
+         * @default {}
+         */
+        this.saveOptions = {};
+        /**
+         * The initial zoom level of the PDF document.
+         *
+         * @default 1.25
+         */
+        this.zoom = INITIAL_ZOOM_LEVEL;
+        /**
+         * Represents the step the zoom level will be changed with when using the ZoomIn and ZoomOut tools.
+         * @default 0.25
+         */
+        this.zoomRate = 0.25;
+        /**
+         * Represents minimum allowed zoom value.
+         * @default 0.5
+         */
+        this.minZoom = 0.5;
+        /**
+         * Represents maximum allowed zoom value.
+         * @default 4
+         */
+        this.maxZoom = 4;
+        /**
+         * The event fired when a PDF document is successfully loaded in the `PDFViewer` component.
+         */
+        this.load = new EventEmitter();
+        /**
+         * The event fired when an error occurs during the loading or downloading of the PDF document.
+         */
+        this.error = new EventEmitter();
+        /**
+         * The event fired when an error occurs during the loading of the PDF document.
+         */
+        this.download = new EventEmitter();
+        /**
+         * The event fired when the end user changes the page of the loaded PDF document.
+         */
+        this.pageChange = new EventEmitter();
+        /**
+         * The event fired when the end user changes the zoom level of the loaded PDF document.
+         */
+        this.zoomLevelChange = new EventEmitter();
+        this.loading = false;
+        this.searchActive = false;
+        this.matchCase = false;
+        this.currentMatches = [];
+        this.skip = 0;
+        this.zoomOptionsData = zoomOptionsData;
+        this.zoomLevel = this.zoomOptionsData[5];
+        this._pdfContext = null;
+        this._enabedSelection = false;
+        this.subs = new Subscription();
+        this.scrollListener = (e) => {
+            const nextPage = currentPage(e.target.parentNode);
+            if (nextPage !== this.skip) {
+                this.ngZone.run(() => {
+                    hasObservers(this.pageChange) && this.pageChange.emit({
+                        previousPage: this.currentPage,
+                        currentPage: nextPage + 1
+                    });
+                    this.skip = nextPage;
+                });
+            }
+        };
+        validatePackage(packageMetadata);
+        this.direction = localizationService.rtl ? 'rtl' : 'ltr';
+        counter++;
+    }
+    /**
+     * Returns the current page number of the loaded PDF document.
+     */
+    get currentPage() {
+        var _a;
+        const isDocumentLoaded = this.pagesContainer && ((_a = this.pdfContext) === null || _a === void 0 ? void 0 : _a.pdfDoc);
+        return isDocumentLoaded ? this.skip + 1 : null;
+    }
+    set pdfContext(doc) {
+        this._pdfContext = doc;
+    }
+    /**
+     * Exposes the currently loaded `PDF.js` document, its pages, and their DOM element wrapper.
+     */
+    get pdfContext() {
+        return this._pdfContext;
+    }
+    /**
+     * @hidden
+     */
+    get activePageId() {
+        var _a, _b;
+        if (!((_a = this.pdfContext) === null || _a === void 0 ? void 0 : _a.pdfPages.length)) {
+            return;
+        }
+        return (_b = this.pagesContainer.nativeElement.querySelectorAll('.k-page')[this.skip]) === null || _b === void 0 ? void 0 : _b.getAttribute('id');
+    }
+    /**
+     * @hidden
+     */
+    get pagesContainerId() {
+        var _a;
+        if (!((_a = this.pdfContext) === null || _a === void 0 ? void 0 : _a.pdfPages.length)) {
+            return;
+        }
+        return `k-pdfviewer-${counter}-pages-container`;
+    }
+    /**
+     * @hidden
+     */
+    set enabledSelection(value) {
+        if (this.pdfScroller) {
+            value ? this.pdfScroller.disablePanEventsTracking() : this.pdfScroller.enablePanEventsTracking();
+        }
+        this._enabedSelection = value;
+    }
+    /**
+     * @hidden
+     */
+    get enabledSelection() {
+        return this._enabedSelection;
+    }
+    ngOnInit() {
+        this.subs.add(this.localizationService.changes.subscribe(({ rtl }) => this.direction = rtl ? 'rtl' : 'ltr'));
+    }
+    ngAfterViewInit() {
+        const pagesContainer = this.pagesContainer.nativeElement.parentNode;
+        this.ngZone.runOutsideAngular(() => this.subs.add(this.renderer.listen(pagesContainer, 'scroll', this.scrollListener)));
+    }
+    ngOnDestroy() {
+        this.subs.unsubscribe();
+        removeChildren(this.pagesContainer.nativeElement);
+        if (this.pdfScroller) {
+            this.pdfScroller.destroy();
+            this.pdfScroller = null;
+        }
+        if (this.searchService) {
+            this.searchService.destroy();
+            this.searchService = null;
+        }
+        this.pdfContext = null;
+    }
+    ngOnChanges(changes) {
+        const newBase64Data = changes['data'] && this.data;
+        const newUrl = changes['url'] && this.url;
+        const newArrayBuffer = changes['arrayBuffer'] && this.arrayBuffer;
+        const newTypedArray = changes['typedArray'] && this.typedArray;
+        this.verifySettings(changes);
+        const source = newUrl ? 'url' : newArrayBuffer ? 'arrayBuffer' : newBase64Data ? 'data' : 'typedArray';
+        if (newUrl || newArrayBuffer || newBase64Data || newTypedArray) {
+            this.loadPdf(source, this[source]);
+        }
+    }
+    /**
+     * Scrolls the PDFViewer document to the passed page number.
+     */
+    scrollToPage(page) {
+        scrollToPage(this.pagesContainer.nativeElement, page);
+    }
+    /**
+     * @hidden
+     */
+    onFileSelect(e) {
+        this.loadPdf('data', e);
+    }
+    /**
+     * @hidden
+     */
+    onFileSelectError(e) {
+        hasObservers(this.error) && this.error.emit({ error: e, context: this.pdfContext });
+    }
+    /**
+     * @hidden
+     */
+    onPageChange(e) {
+        this.scrollToPage(e.skip);
+        hasObservers(this.pageChange) && this.pageChange.emit({
+            previousPage: this.skip,
+            currentPage: e.skip
+        });
+        this.skip = e.skip;
+    }
+    /**
+     * @hidden
+     */
+    onDownload() {
+        this.ngZone.runOutsideAngular(() => this.pdfContext.pdfDoc.getData()
+            .then((data) => new Blob([data], { type: 'application/pdf' }))
+            .then((blob) => {
+            const downloadEvent = new PDFViewerDownloadEvent(blob, this.saveFileName, this.saveOptions, this.pdfContext);
+            this.ngZone.run(() => this.download.emit(downloadEvent));
+            if (!downloadEvent.isDefaultPrevented()) {
+                saveAs(blob, this.saveFileName, this.saveOptions);
+            }
+        })
+            .catch((reason) => {
+            if (hasObservers(this.error)) {
+                this.ngZone.run(() => this.error.emit({
+                    error: reason,
+                    context: this.pdfContext
+                }));
+            }
+        }));
+    }
+    /**
+     * @hidden
+     */
+    onZoomIn() {
+        const newZoom = Math.min(this.pdfContext.zoom + this.zoomRate, this.maxZoom);
+        if (newZoom !== this.pdfContext.zoom && this.pdfContext.pdfDoc) {
+            if (hasObservers(this.zoomLevelChange)) {
+                this.zoomLevelChange.emit({
+                    previousZoomLevel: this.zoom,
+                    currentZoomLevel: newZoom
+                });
+            }
+            this.zoom = this.pdfContext.zoom = newZoom;
+            this.setZoomLevel(newZoom);
+            this.ngZone.runOutsideAngular(() => this.reloadDocument());
+        }
+    }
+    /**
+     * @hidden
+     */
+    onZoomOut() {
+        const newZoom = Math.max(this.pdfContext.zoom - this.zoomRate, this.minZoom);
+        if (newZoom !== this.pdfContext.zoom && this.pdfContext.pdfDoc) {
+            if (hasObservers(this.zoomLevelChange)) {
+                this.zoomLevelChange.emit({
+                    previousZoomLevel: this.zoom,
+                    currentZoomLevel: newZoom
+                });
+            }
+            this.zoom = this.pdfContext.zoom = newZoom;
+            this.setZoomLevel(newZoom);
+            this.ngZone.runOutsideAngular(() => this.reloadDocument());
+        }
+    }
+    /**
+     * @hidden
+     */
+    onZoomLevelChange(zoomLevel) {
+        if (typeof zoomLevel === 'string') {
+            const parsedValue = parseFloat(zoomLevel);
+            zoomLevel = { value: Number.isNaN(parsedValue) ? 1 : parsedValue / 100 };
+        }
+        if (!zoomLevel) {
+            zoomLevel = { value: 1 };
+        }
+        let newZoom = calculateZoomLevel(zoomLevel.value, zoomLevel.type, this.pdfContext.zoom, this.pagesContainer.nativeElement);
+        newZoom = Math.round(newZoom * 100) / 100;
+        if (hasObservers(this.zoomLevelChange)) {
+            this.zoomLevelChange.emit({
+                previousZoomLevel: this.zoom,
+                currentZoomLevel: newZoom
+            });
+        }
+        this.zoom = this.pdfContext.zoom = newZoom;
+        this.setZoomLevel(newZoom);
+        this.ngZone.runOutsideAngular(() => this.reloadDocument());
+    }
+    /**
+     * @hidden
+     */
+    onSearch() {
+        this.searchActive = true;
+        this.ngZone.runOutsideAngular(() => {
+            const pagesTextLayers = Array.from(this.pagesContainer.nativeElement.querySelectorAll('.k-text-layer'));
+            this.searchService = new SearchService({
+                textContainers: pagesTextLayers || [],
+                highlightClass: 'k-search-highlight',
+                highlightMarkClass: 'k-search-highlight-mark',
+                charClass: 'k-text-char'
+            });
+        });
+    }
+    /**
+     * @hidden
+     */
+    onPrint() {
+        this.loading = true;
+        const onError = (e) => {
+            this.loading = false;
+            if (hasObservers(this.error)) {
+                this.error.emit(e);
+            }
+            ;
+        };
+        const onDone = () => {
+            this.loading = false;
+        };
+        print(this.pdfContext.pdfPages, onDone, onError);
+    }
+    /**
+     * @hidden
+     */
+    onSearchChange(e) {
+        this.currentMatches = this.searchService.search(Object.assign({}, e));
+        this.currentMatch = this.currentMatches.length ? 1 : 0;
+    }
+    /**
+     * @hidden
+     */
+    closeSearch(toolbar) {
+        this.searchActive = false;
+        this.searchService.destroy();
+        this.currentMatches = [];
+        this.currentMatch = null;
+        toolbar.focus();
+    }
+    /**
+     * @hidden
+     */
+    onNextMatch() {
+        goToNextSearchMatch({ search: this.searchService, scroller: this.pdfScroller });
+        this.currentMatch = this.currentMatch + 1 > this.currentMatches.length ? 1 : this.currentMatch + 1;
+    }
+    /**
+     * @hidden
+     */
+    onPreviousMatch() {
+        goToPreviousSearchMatch({ search: this.searchService, scroller: this.pdfScroller });
+        this.currentMatch = this.currentMatch - 1 < 1 ? this.currentMatches.length : this.currentMatch - 1;
+    }
+    loadPdf(dataType, data) {
+        this.loading = true;
+        this.ngZone.runOutsideAngular(() => setTimeout(() => {
+            var _a;
+            removeChildren(this.pagesContainer.nativeElement);
+            loadPDF({
+                [dataType]: data,
+                dom: this.pagesContainer.nativeElement,
+                zoom: ((_a = this.pdfContext) === null || _a === void 0 ? void 0 : _a.zoom) || this.zoom,
+                done: (e) => {
+                    this.ngZone.run(() => {
+                        this.loading = false;
+                        this.pdfContext = Object.assign(Object.assign({}, e), { element: this.pagesContainer.nativeElement });
+                    });
+                    if (this.pdfScroller) {
+                        this.pdfScroller.destroy();
+                    }
+                    this.pdfScroller = this.pdfScroller = new Scroller(this.pagesContainer.nativeElement.parentNode, {
+                        filter: '.k-page',
+                        events: {}
+                    });
+                    this.pdfScroller.enablePanEventsTracking();
+                    this.assignPageIds();
+                    if (hasObservers(this.load)) {
+                        this.ngZone.run(() => this.load.emit({ context: this.pdfContext }));
+                    }
+                },
+                error: (e) => {
+                    this.ngZone.run(() => this.loading = false);
+                    this.pdfContext = null;
+                    if (hasObservers(this.error)) {
+                        this.ngZone.run(() => this.error.emit({ error: e, context: this.pdfContext }));
+                    }
+                }
+            });
+        }));
+    }
+    reloadDocument() {
+        var _a, _b;
+        if ((_a = this.pagesContainer) === null || _a === void 0 ? void 0 : _a.nativeElement) {
+            this.ngZone.run(() => this.loading = true);
+            removeChildren(this.pagesContainer.nativeElement);
+            reloadDocument({
+                pdfDoc: (_b = this.pdfContext) === null || _b === void 0 ? void 0 : _b.pdfDoc,
+                zoom: this.zoom,
+                dom: this.pagesContainer.nativeElement,
+                done: (pdfPages) => {
+                    this.pdfContext.pdfPages = pdfPages;
+                    this.ngZone.run(() => this.loading = false);
+                    this.assignPageIds();
+                },
+                error: (e) => {
+                    if (this.pdfScroller) {
+                        this.pdfScroller.destroy();
+                        this.pdfScroller = null;
+                    }
+                    this.pdfContext = null;
+                    if (hasObservers(this.error)) {
+                        this.ngZone.run(() => this.error.emit({ error: e, context: this.pdfContext }));
+                    }
+                }
+            });
+        }
+    }
+    assignPageIds() {
+        this.pagesContainer.nativeElement.querySelectorAll('.k-page').forEach((pageElement, index) => {
+            const id = `k-pdfviewer-${counter}-page-${index + 1}`;
+            this.renderer.setAttribute(pageElement, 'id', id);
+        });
+    }
+    setZoomLevel(zoom) {
+        const option = this.zoomOptionsData.find(item => !item.type && item.value === zoom);
+        this.zoomLevel = option || {
+            value: zoom,
+            displayValue: `${Math.round(zoom * 100)}%`,
+            text: `${Math.round(zoom * 100)}%`
+        };
+    }
+    verifySettings(changes) {
+        const sourceTypes = ['url', 'arrayBuffer', 'data', 'typedArray'];
+        const setTypes = sourceTypes.map(item => this.isSet(changes, item)).filter(item => item);
+        if (isDevMode() && setTypes.length > 1) {
+            console.warn(`
+                Setting more than one source of data simultaneously is not supported.
+                Only one of 'url', 'arrayBuffer', 'data', or 'typedArray' can be set.
+            `);
+        }
+    }
+    isSet(changes, source) {
+        return this[source] || (changes[source] && changes[source].currentValue);
+    }
+}
+PDFViewerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerComponent, deps: [{ token: i0.NgZone }, { token: i0.Renderer2 }, { token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+PDFViewerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PDFViewerComponent, selector: "kendo-pdfviewer", inputs: { tools: "tools", loaderSettings: "loaderSettings", saveFileName: "saveFileName", saveOptions: "saveOptions", url: "url", data: "data", arrayBuffer: "arrayBuffer", typedArray: "typedArray", zoom: "zoom", zoomRate: "zoomRate", minZoom: "minZoom", maxZoom: "maxZoom" }, outputs: { load: "load", error: "error", download: "download", pageChange: "pageChange", zoomLevelChange: "zoomLevelChange" }, host: { properties: { "class.k-pdf-viewer": "this.hostClass", "attr.dir": "this.direction" } }, providers: [
+        LocalizationService,
+        {
+            provide: L10N_PREFIX,
+            useValue: 'kendo.pdfviewer'
+        }
+    ], viewQueries: [{ propertyName: "pagesContainer", first: true, predicate: ["pagesContainer"], descendants: true }], exportAs: ["kendo-pdfviewer"], usesOnChanges: true, ngImport: i0, template: `
+        <ng-container kendoPDFViewerLocalizedMessages
+            i18n-pagerFirstPage="kendo.pdfviewer.pagerFirstPage|The label for the first page button in the Pager"
+            pagerFirstPage="Go to the first page"
+
+            i18n-pagerPreviousPage="kendo.pdfviewer.pagerPreviousPage|The label for the previous page button in the Pager"
+            pagerPreviousPage="Go to the previous page"
+
+            i18n-pagerNextPage="kendo.pdfviewer.pagerNextPage|The label for the next page button in the Pager"
+            pagerNextPage="Go to the next page"
+
+            i18n-pagerLastPage="kendo.pdfviewer.pagerLastPage|The label for the last page button in the Pager"
+            pagerLastPage="Go to the last page"
+
+            i18n-pagerPage="kendo.pdfviewer.pagerPage|The text before the current page number in the Pager"
+            pagerPage="Page"
+
+            i18n-pagerOf="kendo.pdfviewer.pagerOf|The text before the total pages number in the Pager"
+            pagerOf="of"
+
+            i18n-pagerInputTitle="kendo.pdfviewer.pagerInputTitle|The label of the pager input element"
+            pagerInputTitle="Page Number"
+
+            i18n-pagerInputLabel="kendo.pdfviewer.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number."
+            pagerInputLabel="Type a page number"
+            
+            i18n-zoomInTitle="kendo.pdfviewer.zoomInTitle|The ZoomIn tool title and label."
+            zoomInTitle="Zoom in"
+            
+            i18n-zoomOutTitle="kendo.pdfviewer.zoomOutTitle|The ZoomOut tool title and label."
+            zoomOutTitle="Zoom out"
+            
+            i18n-selectionTitle="kendo.pdfviewer.selectionTitle|The Selection tool title and label."
+            selectionTitle="Enable selection"
+            
+            i18n-panningTitle="kendo.pdfviewer.panningTitle|The Panning tool title and label."
+            panningTitle="Enable panning"
+            
+            i18n-searchTitle="kendo.pdfviewer.searchTitle|The Search tool title and label."
+            searchTitle="Search"
+            
+            i18n-openTitle="kendo.pdfviewer.openTitle|The Open tool title and label."
+            openTitle="Open"
+            
+            i18n-downloadTitle="kendo.pdfviewer.downloadTitle|The Download tool title and label."
+            downloadTitle="Download"
+            
+            i18n-printTitle="kendo.pdfviewer.printTitle|The Print tool title and label."
+            printTitle="Print"
+            
+            i18n-fitToPage="kendo.pdfviewer.fitToPage|The text for the zoom level chooser Fit to page option."
+            fitToPage="Fit to page"
+            
+            i18n-fitToWidth="kendo.pdfviewer.fitToWidth|The text for the zoom level chooser Fit to width option."
+            fitToWidth="Fit to width"
+            
+            i18n-searchInputPlaceholder="kendo.pdfviewer.searchInputPlaceholder|The text for the search input placeholder."
+            searchInputPlaceholder="Search"
+            
+            i18n-searchMatchesOf="kendo.pdfviewer.searchMatchesOf|The text before the total number of matches in the Search tool."
+            searchMatchesOf="of"
+            
+            i18n-searchPreviousMatchTitle="kendo.pdfviewer.searchPreviousMatchTitle|The title of the Search tool previous match button."
+            searchPreviousMatchTitle="Previous match"
+            
+            i18n-searchNextMatchTitle="kendo.pdfviewer.searchNextMatchTitle|The title of the Search tool next match button."
+            searchNextMatchTitle="Next match"
+            
+            i18n-searchCloseTitle="kendo.pdfviewer.searchCloseTitle|The title of the Search tool close button."
+            searchCloseTitle="Close"
+            
+            i18n-searchMatchCaseTitle="kendo.pdfviewer.searchMatchCaseTitle|The title of the Search tool match case button."
+            searchMatchCaseTitle="Match case"
+            
+            i18n-zoomInputPlaceholder="kendo.pdfviewer.zoomInputPlaceholder|The text for the zoom tool input placeholder."
+            zoomInputPlaceholder="Choose zoom level">
+        </ng-container>
+        <div loader 
+            *ngIf="loading"
+            [settings]="loaderSettings"></div>
+        <div toolbar
+            #toolbar
+            role="toolbar"
+            [attr.aria-controls]="pagesContainerId"
+            [tools]="tools"
+            [skip]="skip"
+            [total]="pdfContext?.pdfPages.length ? pdfContext?.pdfPages.length : 1"
+            [pageSize]="1"
+            [zoomInDisabled]="zoom >= maxZoom || !pdfContext?.pdfDoc"
+            [zoomOutDisabled]="zoom <= minZoom || !pdfContext?.pdfDoc"
+            [zoomOptionsData]="zoomOptionsData"
+            [zoomLevelChooserValue]="zoomLevel"
+            [disabledTools]="!pdfContext?.pdfDoc"
+            (pageChange)="onPageChange($event)"
+            (fileSelect)="onFileSelect($event)"
+            (fileSelectError)="onFileSelectError($event)"
+            (download)="onDownload()"
+            (panningEnabled)="enabledSelection = false;"
+            (selectionEnabled)="enabledSelection = true;"
+            (zoomIn)="onZoomIn()"
+            (zoomOut)="onZoomOut()"
+            (zoomLevelChange)="onZoomLevelChange($event)"
+            (print)="onPrint()"
+            (search)="onSearch()"></div>
+        <div
+            class="k-canvas k-pdf-viewer-canvas k-pos-relative k-overflow-auto"
+            [class.k-enable-text-select]="enabledSelection"
+            [class.k-enable-panning]="!enabledSelection"
+            [attr.aria-describedby]="activePageId"
+            tabindex="0">
+            <div
+                kendoPDFViewerSearch
+                *ngIf="searchActive"
+                [currentMatch]="currentMatch"
+                [matches]="currentMatches.length"
+                class="k-search-panel k-pos-sticky k-top-center"
+                (searchChange)="onSearchChange($event)"
+                (prevMatch)="onPreviousMatch()"
+                (nextMatch)="onNextMatch()"
+                (close)="closeSearch(toolbar)"></div>
+            <div 
+                #pagesContainer
+                class="k-pdf-viewer-pages"
+                [style.--scale-factor]="zoom"
+                [attr.id]="pagesContainerId">
+                <div class="k-page">
+                    <div class="k-text-layer"></div>
+                </div>
+            </div>
+        </div>
+    `, isInline: true, components: [{ type: LoaderComponent, selector: "[loader]", inputs: ["settings"] }, { type: ToolbarComponent, selector: "[toolbar]", inputs: ["zoomLevel", "calculatedComboBoxValue", "skip", "pageSize", "total", "zoomInDisabled", "zoomOutDisabled", "disabledTools", "zoomLevelChooserValue", "zoomOptionsData", "pagesContainerId", "tools"], outputs: ["fileSelect", "fileSelectError", "download", "selectionEnabled", "panningEnabled", "pageChange", "zoomIn", "zoomOut", "zoomLevelChange", "print", "search"] }, { type: PDFViewerSearchComponent, selector: "[kendoPDFViewerSearch]", inputs: ["matches", "currentMatch"], outputs: ["searchChange", "prevMatch", "nextMatch", "close"] }], directives: [{ type: LocalizedPDFViewerMessagesDirective, selector: "[kendoPDFViewerLocalizedMessages]" }, { type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerComponent, decorators: [{
+            type: Component,
+            args: [{
+                    exportAs: 'kendo-pdfviewer',
+                    selector: 'kendo-pdfviewer',
+                    providers: [
+                        LocalizationService,
+                        {
+                            provide: L10N_PREFIX,
+                            useValue: 'kendo.pdfviewer'
+                        }
+                    ],
+                    template: `
+        <ng-container kendoPDFViewerLocalizedMessages
+            i18n-pagerFirstPage="kendo.pdfviewer.pagerFirstPage|The label for the first page button in the Pager"
+            pagerFirstPage="Go to the first page"
+
+            i18n-pagerPreviousPage="kendo.pdfviewer.pagerPreviousPage|The label for the previous page button in the Pager"
+            pagerPreviousPage="Go to the previous page"
+
+            i18n-pagerNextPage="kendo.pdfviewer.pagerNextPage|The label for the next page button in the Pager"
+            pagerNextPage="Go to the next page"
+
+            i18n-pagerLastPage="kendo.pdfviewer.pagerLastPage|The label for the last page button in the Pager"
+            pagerLastPage="Go to the last page"
+
+            i18n-pagerPage="kendo.pdfviewer.pagerPage|The text before the current page number in the Pager"
+            pagerPage="Page"
+
+            i18n-pagerOf="kendo.pdfviewer.pagerOf|The text before the total pages number in the Pager"
+            pagerOf="of"
+
+            i18n-pagerInputTitle="kendo.pdfviewer.pagerInputTitle|The label of the pager input element"
+            pagerInputTitle="Page Number"
+
+            i18n-pagerInputLabel="kendo.pdfviewer.pagerInputLabel|The text of the aria-label attribute applied to the input element for entering the page number."
+            pagerInputLabel="Type a page number"
+            
+            i18n-zoomInTitle="kendo.pdfviewer.zoomInTitle|The ZoomIn tool title and label."
+            zoomInTitle="Zoom in"
+            
+            i18n-zoomOutTitle="kendo.pdfviewer.zoomOutTitle|The ZoomOut tool title and label."
+            zoomOutTitle="Zoom out"
+            
+            i18n-selectionTitle="kendo.pdfviewer.selectionTitle|The Selection tool title and label."
+            selectionTitle="Enable selection"
+            
+            i18n-panningTitle="kendo.pdfviewer.panningTitle|The Panning tool title and label."
+            panningTitle="Enable panning"
+            
+            i18n-searchTitle="kendo.pdfviewer.searchTitle|The Search tool title and label."
+            searchTitle="Search"
+            
+            i18n-openTitle="kendo.pdfviewer.openTitle|The Open tool title and label."
+            openTitle="Open"
+            
+            i18n-downloadTitle="kendo.pdfviewer.downloadTitle|The Download tool title and label."
+            downloadTitle="Download"
+            
+            i18n-printTitle="kendo.pdfviewer.printTitle|The Print tool title and label."
+            printTitle="Print"
+            
+            i18n-fitToPage="kendo.pdfviewer.fitToPage|The text for the zoom level chooser Fit to page option."
+            fitToPage="Fit to page"
+            
+            i18n-fitToWidth="kendo.pdfviewer.fitToWidth|The text for the zoom level chooser Fit to width option."
+            fitToWidth="Fit to width"
+            
+            i18n-searchInputPlaceholder="kendo.pdfviewer.searchInputPlaceholder|The text for the search input placeholder."
+            searchInputPlaceholder="Search"
+            
+            i18n-searchMatchesOf="kendo.pdfviewer.searchMatchesOf|The text before the total number of matches in the Search tool."
+            searchMatchesOf="of"
+            
+            i18n-searchPreviousMatchTitle="kendo.pdfviewer.searchPreviousMatchTitle|The title of the Search tool previous match button."
+            searchPreviousMatchTitle="Previous match"
+            
+            i18n-searchNextMatchTitle="kendo.pdfviewer.searchNextMatchTitle|The title of the Search tool next match button."
+            searchNextMatchTitle="Next match"
+            
+            i18n-searchCloseTitle="kendo.pdfviewer.searchCloseTitle|The title of the Search tool close button."
+            searchCloseTitle="Close"
+            
+            i18n-searchMatchCaseTitle="kendo.pdfviewer.searchMatchCaseTitle|The title of the Search tool match case button."
+            searchMatchCaseTitle="Match case"
+            
+            i18n-zoomInputPlaceholder="kendo.pdfviewer.zoomInputPlaceholder|The text for the zoom tool input placeholder."
+            zoomInputPlaceholder="Choose zoom level">
+        </ng-container>
+        <div loader 
+            *ngIf="loading"
+            [settings]="loaderSettings"></div>
+        <div toolbar
+            #toolbar
+            role="toolbar"
+            [attr.aria-controls]="pagesContainerId"
+            [tools]="tools"
+            [skip]="skip"
+            [total]="pdfContext?.pdfPages.length ? pdfContext?.pdfPages.length : 1"
+            [pageSize]="1"
+            [zoomInDisabled]="zoom >= maxZoom || !pdfContext?.pdfDoc"
+            [zoomOutDisabled]="zoom <= minZoom || !pdfContext?.pdfDoc"
+            [zoomOptionsData]="zoomOptionsData"
+            [zoomLevelChooserValue]="zoomLevel"
+            [disabledTools]="!pdfContext?.pdfDoc"
+            (pageChange)="onPageChange($event)"
+            (fileSelect)="onFileSelect($event)"
+            (fileSelectError)="onFileSelectError($event)"
+            (download)="onDownload()"
+            (panningEnabled)="enabledSelection = false;"
+            (selectionEnabled)="enabledSelection = true;"
+            (zoomIn)="onZoomIn()"
+            (zoomOut)="onZoomOut()"
+            (zoomLevelChange)="onZoomLevelChange($event)"
+            (print)="onPrint()"
+            (search)="onSearch()"></div>
+        <div
+            class="k-canvas k-pdf-viewer-canvas k-pos-relative k-overflow-auto"
+            [class.k-enable-text-select]="enabledSelection"
+            [class.k-enable-panning]="!enabledSelection"
+            [attr.aria-describedby]="activePageId"
+            tabindex="0">
+            <div
+                kendoPDFViewerSearch
+                *ngIf="searchActive"
+                [currentMatch]="currentMatch"
+                [matches]="currentMatches.length"
+                class="k-search-panel k-pos-sticky k-top-center"
+                (searchChange)="onSearchChange($event)"
+                (prevMatch)="onPreviousMatch()"
+                (nextMatch)="onNextMatch()"
+                (close)="closeSearch(toolbar)"></div>
+            <div 
+                #pagesContainer
+                class="k-pdf-viewer-pages"
+                [style.--scale-factor]="zoom"
+                [attr.id]="pagesContainerId">
+                <div class="k-page">
+                    <div class="k-text-layer"></div>
+                </div>
+            </div>
+        </div>
+    `,
+                }]
+        }], ctorParameters: function () { return [{ type: i0.NgZone }, { type: i0.Renderer2 }, { type: i1$1.LocalizationService }]; }, propDecorators: { hostClass: [{
+                type: HostBinding,
+                args: ['class.k-pdf-viewer']
+            }], direction: [{
+                type: HostBinding,
+                args: ['attr.dir']
+            }], tools: [{
+                type: Input
+            }], loaderSettings: [{
+                type: Input
+            }], saveFileName: [{
+                type: Input
+            }], saveOptions: [{
+                type: Input
+            }], url: [{
+                type: Input
+            }], data: [{
+                type: Input
+            }], arrayBuffer: [{
+                type: Input
+            }], typedArray: [{
+                type: Input
+            }], zoom: [{
+                type: Input
+            }], zoomRate: [{
+                type: Input
+            }], minZoom: [{
+                type: Input
+            }], maxZoom: [{
+                type: Input
+            }], load: [{
+                type: Output
+            }], error: [{
+                type: Output
+            }], download: [{
+                type: Output
+            }], pageChange: [{
+                type: Output
+            }], zoomLevelChange: [{
+                type: Output
+            }], pagesContainer: [{
+                type: ViewChild,
+                args: ['pagesContainer']
+            }] } });
+
+/**
+ * Custom component messages override default component messages
+ * ([see example]({% slug rtl_pdfviewer %}).
+ */
+class PDFViewerCustomMessagesComponent extends Messages {
+    constructor(service) {
+        super();
+        this.service = service;
+    }
+    get override() {
+        return true;
+    }
+}
+PDFViewerCustomMessagesComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerCustomMessagesComponent, deps: [{ token: i1$1.LocalizationService }], target: i0.ɵɵFactoryTarget.Component });
+PDFViewerCustomMessagesComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.12", type: PDFViewerCustomMessagesComponent, selector: "kendo-pdfviewer-messages", providers: [{
+            provide: Messages,
+            useExisting: forwardRef(() => PDFViewerCustomMessagesComponent)
+        }], usesInheritance: true, ngImport: i0, template: ``, isInline: true });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerCustomMessagesComponent, decorators: [{
+            type: Component,
+            args: [{
+                    providers: [{
+                            provide: Messages,
+                            useExisting: forwardRef(() => PDFViewerCustomMessagesComponent)
+                        }],
+                    selector: 'kendo-pdfviewer-messages',
+                    template: ``
+                }]
+        }], ctorParameters: function () { return [{ type: i1$1.LocalizationService }]; } });
+
+const DIRECTIVES = [
+    PDFViewerComponent,
+    ToolbarComponent,
+    LoaderComponent,
+    PDFViewerCustomMessagesComponent,
+    LocalizedPDFViewerMessagesDirective,
+    ToolbarInputWrapperComponent,
+    ToolbarFocusableDirective,
+    ToolbarComboBoxDirective,
+    PDFViewerSearchComponent
+];
+const IMPORTS = [
+    CommonModule,
+    IconsModule,
+    PagerModule,
+    ButtonsModule,
+    TextBoxModule,
+    ComboBoxModule,
+    LoaderModule
+];
+/**
+ * Represents the [NgModule](link:site.data.urls.angular['ngmoduleapi'])
+ * definition for the PDFViewer component.
+ */
+class PDFViewerModule {
+}
+PDFViewerModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
+PDFViewerModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerModule, declarations: [PDFViewerComponent,
+        ToolbarComponent,
+        LoaderComponent,
+        PDFViewerCustomMessagesComponent,
+        LocalizedPDFViewerMessagesDirective,
+        ToolbarInputWrapperComponent,
+        ToolbarFocusableDirective,
+        ToolbarComboBoxDirective,
+        PDFViewerSearchComponent], imports: [CommonModule,
+        IconsModule,
+        PagerModule,
+        ButtonsModule,
+        TextBoxModule,
+        ComboBoxModule,
+        LoaderModule], exports: [PDFViewerComponent,
+        ToolbarComponent,
+        LoaderComponent,
+        PDFViewerCustomMessagesComponent,
+        LocalizedPDFViewerMessagesDirective,
+        ToolbarInputWrapperComponent,
+        ToolbarFocusableDirective,
+        ToolbarComboBoxDirective,
+        PDFViewerSearchComponent] });
+PDFViewerModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerModule, imports: [IMPORTS] });
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.12", ngImport: i0, type: PDFViewerModule, decorators: [{
+            type: NgModule,
+            args: [{
+                    declarations: DIRECTIVES,
+                    exports: DIRECTIVES,
+                    imports: IMPORTS,
+                }]
+        }] });
+
+/**
+ * Generated bundle index. Do not edit.
+ */
+
+export { LoaderComponent, LocalizedPDFViewerMessagesDirective, PDFViewerComponent, PDFViewerCustomMessagesComponent, PDFViewerDownloadEvent, PDFViewerModule, PDFViewerSearchComponent, ToolbarComboBoxDirective, ToolbarComponent, ToolbarFocusableDirective, ToolbarInputWrapperComponent };
+