@progress/kendo-angular-dialog 6.0.3-dev.202203091004 → 7.0.0-next.202203171702

package/dist/npm/common/actions-layout.js

@@ -1,6 +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 });

package/dist/npm/common/preventable-event.js

@@ -1,31 +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 });
-/**
- * @hidden
- */
-var PreventableEvent = /** @class */ (function () {
-    function PreventableEvent() {
-        this.prevented = false;
-    }
-    /**
-     * Prevents the default action for a specified event.
-     * In this way, the source component suppresses the built-in behavior that follows the event.
-     */
-    PreventableEvent.prototype.preventDefault = function () {
-        this.prevented = true;
-    };
-    /**
-     * If the event is prevented by any of its subscribers, returns `true`.
-     *
-     * @returns `true` if the default action was prevented. Otherwise, returns `false`.
-     */
-    PreventableEvent.prototype.isDefaultPrevented = function () {
-        return this.prevented;
-    };
-    return PreventableEvent;
-}());
-exports.PreventableEvent = PreventableEvent;

package/dist/npm/common/util.js

@@ -1,219 +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 rxjs_1 = require("rxjs");
-var operators_1 = require("rxjs/operators");
-/**
- * @hidden
- */
-exports.isPresent = function (value) { return value !== null && value !== undefined; };
-/**
- * @hidden
- */
-exports.isTruthy = function (value) { return !!value; };
-var toClassList = function (classNames) { return String(classNames).trim().split(' '); };
-var ɵ0 = toClassList;
-exports.ɵ0 = ɵ0;
-var focusableRegex = /^(?:a|input|select|textarea|button|object)$/i;
-/**
- * @hidden
- */
-var Keys;
-(function (Keys) {
-    Keys[Keys["esc"] = 27] = "esc";
-    Keys[Keys["tab"] = 9] = "tab";
-    Keys[Keys["enter"] = 13] = "enter";
-    Keys[Keys["space"] = 32] = "space";
-    Keys[Keys["ctrl"] = 17] = "ctrl";
-    Keys[Keys["shift"] = 16] = "shift";
-    Keys[Keys["left"] = 37] = "left";
-    Keys[Keys["up"] = 38] = "up";
-    Keys[Keys["right"] = 39] = "right";
-    Keys[Keys["down"] = 40] = "down";
-})(Keys = exports.Keys || (exports.Keys = {}));
-/**
- * @hidden
- */
-exports.DIALOG_ELEMENTS_HANDLING_ESC_KEY = 'k-dialog-wrapper k-dialog-buttongroup k-dialog-action';
-/**
- * @hidden
- */
-exports.DIALOG_ELEMENTS_HANDLING_ARROWS = 'k-dialog-buttongroup';
-/**
- * @hidden
- */
-exports.WINDOW_CLASSES = 'k-window';
-/**
- * @hidden
- */
-exports.hasClasses = function (element, classNames) {
-    var namesList = toClassList(classNames);
-    return Boolean(toClassList(element.className).find(function (className) { return namesList.indexOf(className) >= 0; }));
-};
-/**
- * @hidden
- */
-exports.isVisible = function (element) {
-    var rect = element.getBoundingClientRect();
-    return !!(rect.width && rect.height) && window.getComputedStyle(element).visibility !== 'hidden';
-};
-/**
- * @hidden
- */
-exports.isFocusable = function (element, checkVisibility) {
-    if (checkVisibility === void 0) { checkVisibility = true; }
-    if (element.tagName) {
-        var tagName = element.tagName.toLowerCase();
-        var tabIndex = element.getAttribute('tabIndex');
-        var validTabIndex = tabIndex !== null && !isNaN(tabIndex) && tabIndex > -1;
-        var focusable = false;
-        if (focusableRegex.test(tagName)) {
-            focusable = !element.disabled;
-        }
-        else {
-            focusable = validTabIndex;
-        }
-        return focusable && (!checkVisibility || exports.isVisible(element));
-    }
-    return false;
-};
-/**
- * @hidden
- */
-exports.setHTMLAttributes = function (attributes, renderer, element) {
-    for (var attribute in attributes) {
-        if (attribute) {
-            renderer.setAttribute(element, attribute, attributes[attribute]);
-        }
-    }
-};
-/**
- * Receives CSS class declarations either as an object, string or array and returns an array of the class names.
- *
- * @hidden
- */
-exports.parseCSSClassNames = function (value) {
-    if (exports.isObject(value)) {
-        return parseObjectClassNames(value);
-    }
-    if (exports.isString(value)) {
-        return parseStringClassNames(value);
-    }
-    if (Array.isArray(value)) {
-        return parseArrayClassNames(value);
-    }
-};
-var parseObjectClassNames = function (value) {
-    var classes = [];
-    Object.keys(value).forEach(function (className) {
-        var currentClassName = exports.splitStringToArray(className);
-        if (value[className] && currentClassName[0]) {
-            classes.push.apply(classes, currentClassName);
-        }
-    });
-    return classes;
-};
-var ɵ1 = parseObjectClassNames;
-exports.ɵ1 = ɵ1;
-var parseStringClassNames = function (value) {
-    var classes = [];
-    var classesArray = exports.splitStringToArray(value);
-    classesArray.forEach(function (className) {
-        classes.push(className);
-    });
-    return classes;
-};
-var ɵ2 = parseStringClassNames;
-exports.ɵ2 = ɵ2;
-var parseArrayClassNames = function (value) {
-    var classes = [];
-    value.forEach(function (className) {
-        var current = exports.splitStringToArray(className);
-        if (current[0]) {
-            classes.push.apply(classes, current);
-        }
-    });
-    return classes;
-};
-var ɵ3 = parseArrayClassNames;
-exports.ɵ3 = ɵ3;
-/**
- * @hidden
- */
-exports.focusableSelector = [
-    'a[href]',
-    'area[href]',
-    'input:not([disabled])',
-    'select:not([disabled])',
-    'textarea:not([disabled])',
-    'button:not([disabled])',
-    'iframe',
-    'object',
-    'embed',
-    '*[tabindex]',
-    '*[contenteditable]'
-].join(',');
-/**
- * @hidden
- */
-exports.preventDefault = function (_a) {
-    var event = _a.originalEvent;
-    event.stopPropagation();
-    event.preventDefault();
-};
-/**
- * @hidden
- */
-exports.isWindowAvailable = function () {
-    return typeof window !== 'undefined';
-};
-/**
- * @hidden
- */
-exports.preventOnDblClick = function (release) { return function (mouseDown) {
-    return rxjs_1.of(mouseDown).pipe(operators_1.delay(150), operators_1.takeUntil(release));
-}; };
-/**
- * @hidden
- */
-exports.RESIZE_DIRECTIONS = ['n', 'e', 's', 'w', 'se', 'sw', 'ne', 'nw'];
-/**
- * @hidden
- */
-exports.OFFSET_STYLES = ['top', 'left', 'width', 'height'];
-/**
- * @hidden
- */
-exports.isString = function (value) { return value instanceof String || typeof value === 'string'; };
-/**
- * @hidden
- */
-exports.isObject = function (value) { return exports.isPresent(value) && !Array.isArray(value) && typeof value === 'object'; };
-/**
- * @hidden
- */
-exports.isNumber = function (value) { return typeof value === 'number' && isFinite(value); };
-/**
- * @hidden
- */
-exports.createValueWithUnit = function (value) { return value + (exports.isNumber(value) ? 'px' : ''); };
-/**
- * @hidden
- */
-exports.splitStringToArray = function (value) { return value.trim().replace(/\s+/g, " ").split(' '); };
-/**
- * @hidden
- */
-exports.findPrimaryButton = function (buttons) {
-    for (var i = buttons.length - 1; i >= 0; i--) {
-        var classList = buttons[i].classList;
-        for (var j = 0; j < classList.length; j++) {
-            if (classList[j].endsWith('-primary')) {
-                return buttons[i];
-            }
-        }
-    }
-};

package/dist/npm/dialog/dialog-actions.component.js

@@ -1,91 +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 util_1 = require("../common/util");
-/**
- * Specifies the action buttons of the Dialog
- * ([see example]({% slug actionbuttons_dialog %})).
- */
-var DialogActionsComponent = /** @class */ (function () {
-    function DialogActionsComponent(el) {
-        this.el = el;
-        /**
-         * Specifies the possible layout of the action buttons.
-         */
-        this.layout = 'stretched';
-        /**
-         * Fires when the user clicks an action button.
-         */
-        this.action = new core_1.EventEmitter();
-        this.buttonGroupClassName = true;
-    }
-    Object.defineProperty(DialogActionsComponent.prototype, "className", {
-        get: function () {
-            return this.layout === 'stretched';
-        },
-        enumerable: true,
-        configurable: true
-    });
-    /**
-     * @hidden
-     */
-    DialogActionsComponent.prototype.actionTemplate = function () {
-        return this.actions instanceof core_1.TemplateRef;
-    };
-    /**
-     * @hidden
-     */
-    DialogActionsComponent.prototype.onButtonClick = function (action, _e) {
-        this.action.emit(action);
-    };
-    /**
-     * @hidden
-     */
-    DialogActionsComponent.prototype.buttonClass = function (action) {
-        var classes = ['k-button k-button-md k-rounded-md'];
-        var fillMode = action.fillMode ? action.fillMode : 'solid';
-        var themeColor = action.themeColor ? action.themeColor : 'base';
-        var cssClasses = action.cssClass ? util_1.parseCSSClassNames(action.cssClass) : [];
-        classes.push("k-button-" + fillMode + " k-button-" + fillMode + "-" + themeColor);
-        if (cssClasses.length > 0) {
-            classes = classes.concat(cssClasses);
-        }
-        return classes.join(' ');
-    };
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", Object)
-    ], DialogActionsComponent.prototype, "actions", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], DialogActionsComponent.prototype, "layout", void 0);
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], DialogActionsComponent.prototype, "action", void 0);
-    tslib_1.__decorate([
-        core_1.HostBinding('class.k-dialog-buttongroup'),
-        core_1.HostBinding('class.k-actions'),
-        tslib_1.__metadata("design:type", Boolean)
-    ], DialogActionsComponent.prototype, "buttonGroupClassName", void 0);
-    tslib_1.__decorate([
-        core_1.HostBinding('class.k-actions-stretched'),
-        tslib_1.__metadata("design:type", Boolean),
-        tslib_1.__metadata("design:paramtypes", [])
-    ], DialogActionsComponent.prototype, "className", null);
-    DialogActionsComponent = tslib_1.__decorate([
-        core_1.Component({
-            selector: 'kendo-dialog-actions',
-            template: "\n        <ng-content *ngIf=\"!actions\"></ng-content>\n        <ng-container *ngIf=\"!actionTemplate()\">\n            <button\n                type=\"button\"\n                [ngClass]=\"buttonClass(action)\"\n                (click)=\"onButtonClick(action, $event)\"\n                *ngFor=\"let action of actions\"\n                [attr.aria-label]=\"action.text\"\n            >\n                {{ action.text }}\n            </button>\n        </ng-container>\n        <ng-template [ngTemplateOutlet]=\"actions\" *ngIf=\"actionTemplate()\"></ng-template>\n    "
-        }),
-        tslib_1.__metadata("design:paramtypes", [core_1.ElementRef])
-    ], DialogActionsComponent);
-    return DialogActionsComponent;
-}());
-exports.DialogActionsComponent = DialogActionsComponent;

package/dist/npm/dialog/dialog-container.directive.js

@@ -1,33 +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 dialog_container_service_1 = require("./dialog-container.service");
-/**
- * Provides an insertion point for the Dialogs which are created through the
- * Dialog service ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
- * Created Dialogs will be mounted after that element.
- *
- * @example
- * ```html-no-run
- * <div kendoDialogContainer></div>
- * ```
- */
-var DialogContainerDirective = /** @class */ (function () {
-    function DialogContainerDirective(container, service) {
-        service.container = container;
-    }
-    DialogContainerDirective = tslib_1.__decorate([
-        core_1.Directive({
-            selector: '[kendoDialogContainer]'
-        }),
-        tslib_1.__metadata("design:paramtypes", [core_1.ViewContainerRef,
-            dialog_container_service_1.DialogContainerService])
-    ], DialogContainerDirective);
-    return DialogContainerDirective;
-}());
-exports.DialogContainerDirective = DialogContainerDirective;

package/dist/npm/dialog/dialog-container.service.js

@@ -1,33 +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");
-/**
- * @hidden
- */
-var DialogContainerService = /** @class */ (function () {
-    function DialogContainerService() {
-    }
-    DialogContainerService_1 = DialogContainerService;
-    Object.defineProperty(DialogContainerService.prototype, "container", {
-        get: function () {
-            return DialogContainerService_1.container;
-        },
-        set: function (container) {
-            DialogContainerService_1.container = container;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    var DialogContainerService_1;
-    DialogContainerService.container = null;
-    DialogContainerService = DialogContainerService_1 = tslib_1.__decorate([
-        core_1.Injectable()
-    ], DialogContainerService);
-    return DialogContainerService;
-}());
-exports.DialogContainerService = DialogContainerService;

package/dist/npm/dialog/dialog-content-base.js

@@ -1,47 +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 dialog_actions_component_1 = require("./dialog-actions.component");
-var dialog_titlebar_component_1 = require("./dialog-titlebar.component");
-var core_1 = require("@angular/core");
-var operators_1 = require("rxjs/operators");
-/**
- * The base class  which will be extended by a component that is provided as content through `content`
- * ([see example]({% slug service_dialog %}#toc-passing-title-content-and-actions-as-a-single-component)).
- */
-var DialogContentBase = /** @class */ (function () {
-    function DialogContentBase(dialog) {
-        this.dialog = dialog;
-    }
-    /**
-     * @hidden
-     */
-    DialogContentBase.prototype.ngAfterViewInit = function () {
-        var _this = this;
-        if (this.dialogTitleBar) {
-            // when opening component inside dialog with service AND the component has defined its own titlebar
-            this.dialogTitleBar.close.pipe(operators_1.filter(function (e) { return !e.isDefaultPrevented(); })).subscribe(function () {
-                _this.dialog.close();
-            });
-        }
-        if (this.dialogActions) {
-            if (this.dialogActions.actions) {
-                this.dialogActions.action.subscribe(function (action) { return _this.dialog.dialog.instance.action.emit(action); });
-            }
-        }
-    };
-    tslib_1.__decorate([
-        core_1.ViewChild(dialog_titlebar_component_1.DialogTitleBarComponent, { static: false }),
-        tslib_1.__metadata("design:type", dialog_titlebar_component_1.DialogTitleBarComponent)
-    ], DialogContentBase.prototype, "dialogTitleBar", void 0);
-    tslib_1.__decorate([
-        core_1.ViewChild(dialog_actions_component_1.DialogActionsComponent, { static: false }),
-        tslib_1.__metadata("design:type", dialog_actions_component_1.DialogActionsComponent)
-    ], DialogContentBase.prototype, "dialogActions", void 0);
-    return DialogContentBase;
-}());
-exports.DialogContentBase = DialogContentBase;

package/dist/npm/dialog/dialog-settings.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 });
-/**
- * The settings for the Dialog actions when the Dialog is opened through `DialogService`
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
- */
-var DialogAction = /** @class */ (function () {
-    function DialogAction() {
-    }
-    return DialogAction;
-}());
-exports.DialogAction = DialogAction;
-/**
- * Indicates that the **Close** button is clicked. Used when the results from
- * the Dialogs that are opened through `DialogService` are filtered
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
- */
-var DialogCloseResult = /** @class */ (function () {
-    function DialogCloseResult() {
-    }
-    return DialogCloseResult;
-}());
-exports.DialogCloseResult = DialogCloseResult;
-/**
- * The settings that can be used when the Dialog is opened through `DialogService`.
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
- */
-var DialogSettings = /** @class */ (function () {
-    function DialogSettings() {
-    }
-    return DialogSettings;
-}());
-exports.DialogSettings = DialogSettings;
-/**
- * Holds references to the object instance and published events of the Dialog.
- * Controls the Dialogs that were opened through the `DialogService`
- * ([see example]({% slug api_dialog_dialogservice %}#toc-open)).
- */
-var DialogRef = /** @class */ (function () {
-    function DialogRef() {
-    }
-    return DialogRef;
-}());
-exports.DialogRef = DialogRef;

package/dist/npm/dialog/dialog-titlebar.component.js

@@ -1,96 +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_l10n_1 = require("@progress/kendo-angular-l10n");
-var operators_1 = require("rxjs/operators");
-var preventable_event_1 = require("../common/preventable-event");
-var titlebar_localization_service_1 = require("../localization/titlebar-localization.service");
-/**
- * Represents the [Kendo UI DialogTitleBar component for Angular]({% slug api_dialog_dialogtitlebarcomponent %}).
- *
- * It is used as part of the Dialog content when the component is created dynamically by using an [Angular service]({% slug service_dialog %}).
- */
-var DialogTitleBarComponent = /** @class */ (function () {
-    function DialogTitleBarComponent(zone, hostElement, localizationService) {
-        this.zone = zone;
-        this.hostElement = hostElement;
-        this.localizationService = localizationService;
-        /**
-         * Fires when the close button of the title-bar is clicked.
-         */
-        this.close = new core_1.EventEmitter();
-    }
-    Object.defineProperty(DialogTitleBarComponent.prototype, "className", {
-        get: function () {
-            return true;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    Object.defineProperty(DialogTitleBarComponent.prototype, "closeButtonTitle", {
-        get: function () {
-            return this.closeTitle || this.localizationService.get('closeTitle');
-        },
-        enumerable: true,
-        configurable: true
-    });
-    DialogTitleBarComponent.prototype.ngAfterViewInit = function () {
-        var _this = this;
-        this.zone.onStable.pipe(operators_1.take(1)).subscribe(function () {
-            var element = _this.hostElement.nativeElement.querySelector('.k-dialog-title');
-            element.setAttribute('id', _this.id);
-        });
-    };
-    /**
-     * @hidden
-     */
-    DialogTitleBarComponent.prototype.onCloseClick = function (e) {
-        e.preventDefault();
-        var eventArgs = new preventable_event_1.PreventableEvent();
-        this.close.emit(eventArgs);
-    };
-    tslib_1.__decorate([
-        core_1.Output(),
-        tslib_1.__metadata("design:type", core_1.EventEmitter)
-    ], DialogTitleBarComponent.prototype, "close", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], DialogTitleBarComponent.prototype, "id", void 0);
-    tslib_1.__decorate([
-        core_1.Input(),
-        tslib_1.__metadata("design:type", String)
-    ], DialogTitleBarComponent.prototype, "closeTitle", void 0);
-    tslib_1.__decorate([
-        core_1.HostBinding('class.k-window-titlebar'),
-        core_1.HostBinding('class.k-dialog-titlebar'),
-        tslib_1.__metadata("design:type", Boolean),
-        tslib_1.__metadata("design:paramtypes", [])
-    ], DialogTitleBarComponent.prototype, "className", null);
-    DialogTitleBarComponent = tslib_1.__decorate([
-        core_1.Component({
-            selector: 'kendo-dialog-titlebar',
-            providers: [
-                titlebar_localization_service_1.TitleBarLocalizationService,
-                {
-                    provide: kendo_angular_l10n_1.LocalizationService,
-                    useExisting: titlebar_localization_service_1.TitleBarLocalizationService
-                },
-                {
-                    provide: kendo_angular_l10n_1.L10N_PREFIX,
-                    useValue: 'kendo.dialog'
-                }
-            ],
-            template: "\n         <ng-container\n            kendoDialogTitleBarLocalizedMessages\n            i18n-closeTitle=\"kendo.dialog.closeTitle|The title of the close button\"\n            closeTitle=\"Close\"\n        >\n            <div class=\"k-window-title k-dialog-title\">\n                <ng-content></ng-content>\n            </div>\n\n            <div class=\"k-window-actions k-dialog-actions\">\n                <button\n                    role=\"button\"\n                    [attr.title]=\"closeButtonTitle\"\n                    [attr.aria-label]=\"closeButtonTitle\"\n                    class=\"k-button k-button-md k-rounded-md k-button-flat k-button-flat-base k-icon-button k-window-action k-dialog-action k-dialog-close\"\n                    (click)=\"onCloseClick($event)\"\n                >\n                    <span class=\"k-button-icon k-icon k-i-x\"></span>\n                </button>\n            </div>\n        </ng-container>\n    "
-        }),
-        tslib_1.__param(2, core_1.Optional()),
-        tslib_1.__metadata("design:paramtypes", [core_1.NgZone, core_1.ElementRef, kendo_angular_l10n_1.LocalizationService])
-    ], DialogTitleBarComponent);
-    return DialogTitleBarComponent;
-}());
-exports.DialogTitleBarComponent = DialogTitleBarComponent;