@progress/kendo-angular-editor 3.1.2 → 4.0.0-dev.202204140850

package/dist/npm/tools/colorpicker/editor-colorpicker.component.js

@@ -1,235 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-// tslint:disable:no-forward-ref
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var kendo_angular_toolbar_1 = require("@progress/kendo-angular-toolbar");
-var kendo_angular_inputs_1 = require("@progress/kendo-angular-inputs");
-var editor_localization_service_1 = require("../../localization/editor-localization.service");
-var util_1 = require("../../util");
-var editor_component_1 = require("../../editor.component");
-var kendo_angular_dialog_1 = require("@progress/kendo-angular-dialog");
-var colorpicker_dialog_component_1 = require("../../dialogs/colorpicker-dialog.component");
-var operators_1 = require("rxjs/operators");
-/**
- * A component which configures an existing ColorPickerComponent as a ToolBar tool.
- * To associate a `kendo-toolbar-colorpicker` with an Editor command that changes the
- * foreground or the background color of the text, use the `kendoEditorForeColor` or `kendoEditorBackColor` directive.
- */
-var EditorColorPickerComponent = /** @class */ (function (_super) {
-    tslib_1.__extends(EditorColorPickerComponent, _super);
-    function EditorColorPickerComponent(editor, localization, dialogService, ngZone) {
-        var _this = _super.call(this) || this;
-        _this.editor = editor;
-        _this.localization = localization;
-        _this.dialogService = dialogService;
-        _this.ngZone = ngZone;
-        _this.tabindex = -1;
-        /**
-         * Specifies if the component should be disabled.
-         */
-        _this.disabled = false;
-        /**
-         * Specifies whether the ColorPicker will render a gradient, palette, or both in its popup.
-         *
-         * @default ['palette']
-         */
-        _this.views = ['palette'];
-        return _this;
-    }
-    EditorColorPickerComponent_1 = EditorColorPickerComponent;
-    Object.defineProperty(EditorColorPickerComponent.prototype, "view", {
-        get: function () {
-            return (this.views && this.views.length > 0) ? this.views[0] : null;
-        },
-        /**
-         * @hidden
-         *
-         * For backward compatibility with configurations using the deprecated "view" input.
-         */
-        set: function (view) {
-            this.views = [view];
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(EditorColorPickerComponent.prototype, "title", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            return this.localization.get(this.editorCommand);
-        },
-        enumerable: true,
-        configurable: true
-    });
-    EditorColorPickerComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.subs = this.editor.stateChange.subscribe(function (_a) {
-            var style = _a.style;
-            _this.disabled = style.disabled;
-        });
-    };
-    EditorColorPickerComponent.prototype.ngOnDestroy = function () {
-        if (this.subs) {
-            this.subs.unsubscribe();
-        }
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.handleValueChange = function (color) {
-        this.editor.exec(this.editorCommand, color);
-        this.editor.view.focus();
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.handleActiveColorClick = function (event) {
-        event.preventOpen();
-        this.handleValueChange(event.color);
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.onOpen = function (picker) {
-        this.valueCache = picker.value;
-        picker.reset();
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.onClose = function (picker) {
-        var _this = this;
-        if (!picker.value) {
-            picker.value = this.valueCache;
-        }
-        this.editor.shouldEmitFocus = true;
-        this.ngZone.onStable.pipe(operators_1.take(1)).subscribe(function () { return _this.editor.view.focus(); });
-    };
-    Object.defineProperty(EditorColorPickerComponent.prototype, "outerWidth", {
-        /**
-         * @hidden
-         */
-        get: function () {
-            if (this.element) {
-                return util_1.outerWidth(this.element.nativeElement);
-            }
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.openDialog = function () {
-        var dialogSettings = {
-            appendTo: this.editor.dialogContainer,
-            content: colorpicker_dialog_component_1.ColorPickerDialogComponent
-        };
-        this.editor.toolbar.toggle(false);
-        var dialogContent = this.dialogService.open(dialogSettings).content.instance;
-        dialogContent.setData({
-            editor: this.editor,
-            value: this.value,
-            title: this.title,
-            editorCommand: this.editorCommand,
-            paletteSettings: this.paletteSettings,
-            icon: this.icon,
-            views: this.views
-        });
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.canFocus = function () {
-        return !this.disabled;
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.focus = function () {
-        this.tabindex = 0;
-        if (this.overflows) {
-            this.colorPickerButton.nativeElement.focus();
-        }
-        else {
-            this.colorPicker.focus();
-        }
-    };
-    /**
-     * @hidden
-     */
-    EditorColorPickerComponent.prototype.handleKey = function () {
-        this.tabindex = -1;
-        return false;
-    };
-    var EditorColorPickerComponent_1;
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], EditorColorPickerComponent.prototype, "value", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], EditorColorPickerComponent.prototype, "icon", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], EditorColorPickerComponent.prototype, "paletteSettings", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], EditorColorPickerComponent.prototype, "editorCommand", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], EditorColorPickerComponent.prototype, "disabled", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Array)
-    ], EditorColorPickerComponent.prototype, "views", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String),
-        tslib_1.__metadata("design:paramtypes", [String])
-    ], EditorColorPickerComponent.prototype, "view", null);
-    tslib_1.__decorate([
-        core_1.ViewChild('toolbarTemplate', { static: true }),
-        tslib_1.__metadata("design:type", core_1.TemplateRef)
-    ], EditorColorPickerComponent.prototype, "toolbarTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('popupTemplate', { static: true }),
-        tslib_1.__metadata("design:type", core_1.TemplateRef)
-    ], EditorColorPickerComponent.prototype, "popupTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('colorpicker', { read: core_1.ElementRef, static: false }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], EditorColorPickerComponent.prototype, "element", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('colorpicker', { read: kendo_angular_inputs_1.ColorPickerComponent, static: false }),
-        tslib_1.__metadata("design:type", kendo_angular_inputs_1.ColorPickerComponent)
-    ], EditorColorPickerComponent.prototype, "colorPicker", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('colorPickerButton', { read: core_1.ElementRef, static: false }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], EditorColorPickerComponent.prototype, "colorPickerButton", void 0);
-    EditorColorPickerComponent = EditorColorPickerComponent_1 = tslib_1.__decorate([
-        core_1.Component({
-            providers: [{ provide: kendo_angular_toolbar_1.ToolBarToolComponent, useExisting: core_1.forwardRef(function () { return EditorColorPickerComponent_1; }) }],
-            selector: 'kendo-toolbar-colorpicker',
-            template: "\n        <ng-template #toolbarTemplate>\n            <kendo-colorpicker\n                #colorpicker\n                [attr.title]=\"title\"\n                [icon]=\"icon\"\n                [views]=\"views\"\n                [format]=\"'hex'\"\n                [value]=\"value\"\n                [paletteSettings]=\"paletteSettings\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (valueChange)=\"handleValueChange($event)\"\n                (activeColorClick)=\"handleActiveColorClick($event)\"\n                (open)=\"onOpen(colorpicker)\"\n                (close)=\"onClose(colorpicker)\"\n            >\n            </kendo-colorpicker>\n        </ng-template>\n        <ng-template #popupTemplate>\n            <button\n                tabindex=\"-1\"\n                type=\"button\"\n                kendoButton\n                #colorPickerButton\n                class=\"k-overflow-button\"\n                [icon]=\"icon\"\n                [attr.title]=\"title\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (click)=\"openDialog()\"\n            >\n                {{ title }}\n            </button>\n        </ng-template>\n    "
-        }),
-        tslib_1.__param(0, core_1.Host()),
-        tslib_1.__metadata("design:paramtypes", [editor_component_1.EditorComponent,
-            editor_localization_service_1.EditorLocalizationService,
-            kendo_angular_dialog_1.DialogService,
-            core_1.NgZone])
-    ], EditorColorPickerComponent);
-    return EditorColorPickerComponent;
-}(kendo_angular_toolbar_1.ToolBarToolComponent));
-exports.EditorColorPickerComponent = EditorColorPickerComponent;

package/dist/npm/tools/colorpicker/editor-fore-color.directive.js

@@ -1,30 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var editor_colorpicker_component_1 = require("./editor-colorpicker.component");
-var command_icons_1 = require("../../config/command-icons");
-/**
- * A directive which configures an `EditorColorPickerComponent`
- * for manipulating the foreground color of the text
- * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
- */
-var EditorForeColorDirective = /** @class */ (function () {
-    function EditorForeColorDirective(colorPicker) {
-        this.colorPicker = colorPicker;
-        this.colorPicker.icon = command_icons_1.commandIcons.foreColor;
-        this.colorPicker.editorCommand = 'foreColor';
-    }
-    EditorForeColorDirective = tslib_1.__decorate([
-        core_1.Directive({
-            selector: '[kendoEditorForeColor]'
-        }),
-        tslib_1.__metadata("design:paramtypes", [editor_colorpicker_component_1.EditorColorPickerComponent])
-    ], EditorForeColorDirective);
-    return EditorForeColorDirective;
-}());
-exports.EditorForeColorDirective = EditorForeColorDirective;

package/dist/npm/tools/editor-clean-formatting-button.directive.js

@@ -1,48 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var kendo_angular_toolbar_1 = require("@progress/kendo-angular-toolbar");
-var editor_component_1 = require("../editor.component");
-var editor_command_button_1 = require("./shared/editor-command-button");
-var editor_localization_service_1 = require("../localization/editor-localization.service");
-var tools_service_1 = require("./tools.service");
-/**
- * A directive which configures an existing `ToolBarButtonComponent` as an Editor Clean Formatting tool
- * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
- * The directive will predefine the `icon` and `click` event handlers of the button.
- *
- * @example
- * ```ts-no-run
- * <kendo-toolbar-button kendoEditorCleanFormattingButton></kendo-toolbar-button>
- * ```
- *
- * The following example demonstrates how to change the default icon applied by the directive.
- *
- * @example
- * ```ts-no-run
- * <kendo-toolbar-button kendoEditorCleanFormattingButton icon="blogger"></kendo-toolbar-button>
- * ```
- */
-var EditorCleanFormattingButtonDirective = /** @class */ (function (_super) {
-    tslib_1.__extends(EditorCleanFormattingButtonDirective, _super);
-    function EditorCleanFormattingButtonDirective(button, editor, localization, toolsService) {
-        return _super.call(this, 'cleanFormatting', button, editor, localization, toolsService) || this;
-    }
-    EditorCleanFormattingButtonDirective = tslib_1.__decorate([
-        core_1.Directive({
-            selector: 'kendo-toolbar-button[kendoEditorCleanFormattingButton]'
-        }),
-        tslib_1.__param(1, core_1.Host()),
-        tslib_1.__metadata("design:paramtypes", [kendo_angular_toolbar_1.ToolBarButtonComponent,
-            editor_component_1.EditorComponent,
-            editor_localization_service_1.EditorLocalizationService,
-            tools_service_1.EditorToolsService])
-    ], EditorCleanFormattingButtonDirective);
-    return EditorCleanFormattingButtonDirective;
-}(editor_command_button_1.EditorCommandButton));
-exports.EditorCleanFormattingButtonDirective = EditorCleanFormattingButtonDirective;

package/dist/npm/tools/fontfamily/editor-fontfamily-dropdownlist.component.js

@@ -1,73 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var kendo_angular_dropdowns_1 = require("@progress/kendo-angular-dropdowns");
-/**
- * @hidden
- */
-var FontFamilyDropDownListComponent = /** @class */ (function () {
-    function FontFamilyDropDownListComponent() {
-        this.valueChange = new core_1.EventEmitter();
-    }
-    FontFamilyDropDownListComponent.prototype.onValueChange = function (tag) {
-        this.valueChange.emit(tag);
-    };
-    FontFamilyDropDownListComponent.prototype.focus = function () {
-        this.dropDownList.focus();
-    };
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Array)
-    ], FontFamilyDropDownListComponent.prototype, "data", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], FontFamilyDropDownListComponent.prototype, "value", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], FontFamilyDropDownListComponent.prototype, "defaultItem", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Function)
-    ], FontFamilyDropDownListComponent.prototype, "itemDisabled", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], FontFamilyDropDownListComponent.prototype, "title", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Boolean)
-    ], FontFamilyDropDownListComponent.prototype, "disabled", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Number)
-    ], FontFamilyDropDownListComponent.prototype, "tabindex", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], FontFamilyDropDownListComponent.prototype, "valueChange", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('element', { static: true }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], FontFamilyDropDownListComponent.prototype, "element", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('element', { read: kendo_angular_dropdowns_1.DropDownListComponent, static: true }),
-        tslib_1.__metadata("design:type", kendo_angular_dropdowns_1.DropDownListComponent)
-    ], FontFamilyDropDownListComponent.prototype, "dropDownList", void 0);
-    FontFamilyDropDownListComponent = tslib_1.__decorate([
-        core_1.Component({
-            // tslint:disable-next-line:no-forward-ref
-            selector: 'kendo-editor-fontfamily-dropdownlist',
-            template: "\n        <kendo-dropdownlist\n            #element\n            kendoEditorDropDownTool\n            [defaultItem]=\"defaultItem\"\n            [textField]=\"'text'\"\n            [valueField]=\"'fontName'\"\n            [data]=\"data\"\n            [(value)]=\"value\"\n            [valuePrimitive]=\"true\"\n            [itemDisabled]=\"itemDisabled\"\n            [attr.title]=\"title\"\n            [disabled]=\"disabled\"\n            [tabindex]=\"tabindex\"\n            (valueChange)=\"onValueChange($event)\"\n        >\n            <ng-template kendoDropDownListItemTemplate let-dataItem>\n                <span [ngStyle]=\"{ 'font-family': dataItem.fontName }\">\n                    {{ dataItem.text }}\n                </span>\n            </ng-template>\n        </kendo-dropdownlist>\n    ",
-            styles: ["\n        .k-dropdownlist {\n            width: 13em;\n        }\n    "]
-        })
-    ], FontFamilyDropDownListComponent);
-    return FontFamilyDropDownListComponent;
-}());
-exports.FontFamilyDropDownListComponent = FontFamilyDropDownListComponent;

package/dist/npm/tools/fontfamily/editor-fontfamily.component.js

@@ -1,213 +0,0 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2021 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the project root for more information
-*-------------------------------------------------------------------------------------------*/
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-var core_1 = require("@angular/core");
-var kendo_angular_toolbar_1 = require("@progress/kendo-angular-toolbar");
-var util_1 = require("../../util");
-var editor_component_1 = require("../../editor.component");
-var editor_localization_service_1 = require("../../localization/editor-localization.service");
-var kendo_angular_dialog_1 = require("@progress/kendo-angular-dialog");
-var font_family_dialog_component_1 = require("../../dialogs/font-family-dialog.component");
-var editor_fontfamily_dropdownlist_component_1 = require("./editor-fontfamily-dropdownlist.component");
-var tools_service_1 = require("../tools.service");
-/**
- * A component which configures an existing `DropDownListComponent` as an Editor tool
- * ([see example]({% slug toolbartools_editor %}#toc-built-in-tools)).
- * The component associates a `kendo-toolbar-dropdownlist` with an Editor command that changes the font family of a content block and
- * automatically defines the options of the drop-down list and sets its values.
- *
- * @example
- * ```ts-no-run
- * <kendo-toolbar-dropdownlist kendoEditorFontFamily></kendo-toolbar-dropdownlist>
- * ```
- */
-var EditorFontFamilyComponent = /** @class */ (function (_super) {
-    tslib_1.__extends(EditorFontFamilyComponent, _super);
-    function EditorFontFamilyComponent(editor, dialogService, localization, toolsService) {
-        var _this = _super.call(this) || this;
-        _this.editor = editor;
-        _this.dialogService = dialogService;
-        _this.localization = localization;
-        _this.toolsService = toolsService;
-        _this.disabled = false;
-        _this.tabindex = -1;
-        /**
-         * Fires when the user updates the value of the drop-down list.
-         */
-        _this.valueChange = new core_1.EventEmitter();
-        _this._data = [
-            { text: 'Arial', fontName: 'Arial,"Helvetica Neue",Helvetica,sans-serif' },
-            { text: 'Courier New', fontName: '"Courier New",Courier,"Lucida Sans Typewriter","Lucida Typewriter",monospace' },
-            { text: 'Georgia', fontName: 'Georgia,Times,"Times New Roman",serif' },
-            {
-                fontName: 
-                // tslint:disable-next-line:max-line-length
-                'Impact,Haettenschweiler,"Franklin Gothic Bold",Charcoal,"Helvetica Inserat","Bitstream Vera Sans Bold","Arial Black","sans serif"',
-                text: 'Impact'
-            },
-            { text: 'Lucida Console', fontName: '"Lucida Console","Lucida Sans Typewriter",monaco,"Bitstream Vera Sans Mono",monospace' },
-            { text: 'Tahoma', fontName: 'Tahoma,Verdana,Segoe,sans-serif' },
-            { text: 'Times New Roman', fontName: 'TimesNewRoman,"Times New Roman",Times,Baskerville,Georgia,serif' },
-            { text: 'Trebuchet MS', fontName: '"Trebuchet MS","Lucida Grande","Lucida Sans Unicode","Lucida Sans",Tahoma,sans-serif' },
-            { text: 'Verdana', fontName: 'Verdana,Geneva,sans-serif' }
-        ];
-        return _this;
-    }
-    EditorFontFamilyComponent_1 = EditorFontFamilyComponent;
-    Object.defineProperty(EditorFontFamilyComponent.prototype, "data", {
-        get: function () {
-            return this._data;
-        },
-        /**
-         * Overrides the default font list.
-         */
-        set: function (fonts) {
-            this._data = fonts || this._data;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    EditorFontFamilyComponent.prototype.ngOnInit = function () {
-        var _this = this;
-        this.itemDisabled = function (itemArgs) {
-            if (!_this.overflows && _this.fontFamilyDropDownList && !_this.fontFamilyDropDownList.dropDownList.isOpen) {
-                return true; //disable all items in order to prevent navigation when DDL is closed
-            }
-            else {
-                return itemArgs.dataItem.fontName === null;
-            }
-        };
-        setTimeout(function () {
-            _this.defaultItem = { text: _this.title, fontName: null };
-            _this.toolsService.needsCheck.next();
-        });
-        this.subs = this.editor.stateChange.subscribe(function (_a) {
-            var style = _a.style;
-            _this.value = util_1.getUniqueStyleValues(style.selected, 'font-family') || null;
-            _this.disabled = style.disabled;
-        });
-    };
-    /**
-     * @hidden
-     */
-    EditorFontFamilyComponent.prototype.onValueChange = function (ev) {
-        if (util_1.isPresent(ev)) {
-            this.editor.exec('fontFamily', ev);
-            this.editor.view.focus();
-            this.valueChange.emit(this.data.find(function (f) { return f.fontName === ev; }));
-        }
-    };
-    EditorFontFamilyComponent.prototype.ngOnDestroy = function () {
-        if (this.subs) {
-            this.subs.unsubscribe();
-        }
-    };
-    Object.defineProperty(EditorFontFamilyComponent.prototype, "outerWidth", {
-        get: function () {
-            if (this.element) {
-                return util_1.outerWidth(this.element.nativeElement);
-            }
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(EditorFontFamilyComponent.prototype, "title", {
-        get: function () {
-            return this.localization.get('fontFamily');
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    EditorFontFamilyComponent.prototype.openDialog = function () {
-        var dialogSettings = {
-            appendTo: this.editor.dialogContainer,
-            content: font_family_dialog_component_1.FontFamilyDialogComponent
-        };
-        this.editor.toolbar.toggle(false);
-        var dialogContent = this.dialogService.open(dialogSettings).content.instance;
-        dialogContent.setData({
-            editor: this.editor,
-            data: this.data,
-            defaultItem: this.defaultItem,
-            value: this.value,
-            itemDisabled: this.itemDisabled
-        });
-    };
-    /**
-     * @hidden
-     */
-    EditorFontFamilyComponent.prototype.canFocus = function () {
-        return !this.disabled;
-    };
-    /**
-     * @hidden
-     */
-    EditorFontFamilyComponent.prototype.focus = function () {
-        this.tabindex = 0;
-        if (this.overflows) {
-            this.fontFamilyButton.nativeElement.focus();
-        }
-        else {
-            this.fontFamilyDropDownList.focus();
-        }
-    };
-    /**
-     * @hidden
-     */
-    EditorFontFamilyComponent.prototype.handleKey = function () {
-        this.tabindex = -1;
-        return false;
-    };
-    var EditorFontFamilyComponent_1;
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Array),
-        tslib_1.__metadata("design:paramtypes", [Array])
-    ], EditorFontFamilyComponent.prototype, "data", null);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], EditorFontFamilyComponent.prototype, "valueChange", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('toolbarTemplate', { static: true }),
-        tslib_1.__metadata("design:type", core_1.TemplateRef)
-    ], EditorFontFamilyComponent.prototype, "toolbarTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('popupTemplate', { static: true }),
-        tslib_1.__metadata("design:type", core_1.TemplateRef)
-    ], EditorFontFamilyComponent.prototype, "popupTemplate", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('element', { static: false }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], EditorFontFamilyComponent.prototype, "element", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('element', { read: editor_fontfamily_dropdownlist_component_1.FontFamilyDropDownListComponent, static: false }),
-        tslib_1.__metadata("design:type", editor_fontfamily_dropdownlist_component_1.FontFamilyDropDownListComponent)
-    ], EditorFontFamilyComponent.prototype, "fontFamilyDropDownList", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild('fontFamilyButton', { static: false }),
-        tslib_1.__metadata("design:type", core_1.ElementRef)
-    ], EditorFontFamilyComponent.prototype, "fontFamilyButton", void 0);
-    EditorFontFamilyComponent = EditorFontFamilyComponent_1 = tslib_1.__decorate([
-        core_1.Component({
-            // tslint:disable-next-line:no-forward-ref
-            providers: [{ provide: kendo_angular_toolbar_1.ToolBarToolComponent, useExisting: core_1.forwardRef(function () { return EditorFontFamilyComponent_1; }) }],
-            selector: 'kendo-toolbar-dropdownlist[kendoEditorFontFamily]',
-            template: "\n        <ng-template #toolbarTemplate>\n            <kendo-editor-fontfamily-dropdownlist\n                #element\n                [defaultItem]=\"defaultItem\"\n                [data]=\"data\"\n                [(value)]=\"value\"\n                [itemDisabled]=\"itemDisabled\"\n                [title]=\"title\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (valueChange)=\"onValueChange($event)\"\n            >\n            </kendo-editor-fontfamily-dropdownlist>\n        </ng-template>\n        <ng-template #popupTemplate>\n            <button\n                tabindex=\"-1\"\n                type=\"button\"\n                kendoButton\n                #fontFamilyButton\n                class=\"k-overflow-button\"\n                [icon]=\"'font-family'\"\n                [attr.title]=\"title\"\n                [disabled]=\"disabled\"\n                [tabindex]=\"tabindex\"\n                (click)=\"openDialog()\"\n            >\n                {{ title }}\n            </button>\n        </ng-template>\n    "
-        }),
-        tslib_1.__param(0, core_1.Host()),
-        tslib_1.__metadata("design:paramtypes", [editor_component_1.EditorComponent,
-            kendo_angular_dialog_1.DialogService,
-            editor_localization_service_1.EditorLocalizationService,
-            tools_service_1.EditorToolsService])
-    ], EditorFontFamilyComponent);
-    return EditorFontFamilyComponent;
-}(kendo_angular_toolbar_1.ToolBarToolComponent));
-exports.EditorFontFamilyComponent = EditorFontFamilyComponent;