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

package/esm2020/toolbar/toolbar.component.mjs

@@ -0,0 +1,460 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/* eslint-disable @typescript-eslint/no-empty-function */
+import { Component, ElementRef, EventEmitter, HostBinding, Input, Output, ViewChild } from '@angular/core';
+import { LocalizationService } from '@progress/kendo-angular-l10n';
+import { searchIcon, zoomInIcon, zoomOutIcon, pointerIcon, handIcon, folderOpenIcon, downloadIcon, printIcon } from '@progress/kendo-svg-icons';
+import { ToolbarNavigationService } from './toolbar-navigation.service';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-l10n";
+import * as i2 from "./toolbar-navigation.service";
+import * as i3 from "./input-wrapper.component";
+import * as i4 from "@progress/kendo-angular-pager";
+import * as i5 from "@progress/kendo-angular-buttons";
+import * as i6 from "@progress/kendo-angular-dropdowns";
+import * as i7 from "@angular/common";
+import * as i8 from "./toolbar-focusable.directive";
+import * as i9 from "./toolbar-combobox.directive";
+/**
+ * @hidden
+ */
+export 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.LocalizationService }, { token: i2.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: i3.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: i6.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: i8.ToolbarFocusableDirective, selector: "[kendoPDFViewerToolbarFocusable]" }, { type: i9.ToolbarComboBoxDirective, selector: "[kendoPDFViewerComboBox]" }, { type: i6.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.LocalizationService }, { type: i2.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
+            }] } });

package/esm2020/util.mjs

@@ -0,0 +1,72 @@
+/**-----------------------------------------------------------------------------------------
+* Copyright © 2023 Progress Software Corporation. All rights reserved.
+* Licensed under commercial license. See LICENSE.md in the project root for more information
+*-------------------------------------------------------------------------------------------*/
+/**
+ * @hidden
+ */
+export const INITIAL_ZOOM_LEVEL = 1.25;
+/**
+ * @hidden
+ */
+export const MIN_ZOOM_LEVEL = 0.5;
+/**
+ * @hidden
+ */
+export const MAX_ZOOM_LEVEL = 4;
+/**
+ * @hidden
+ */
+export 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
+    }];