diff --git a/bower.json b/bower.json index c6595d4..b6aa206 100644 --- a/bower.json +++ b/bower.json @@ -1,6 +1,6 @@ { "name": "aurelia-dialog", - "version": "2.0.0-rc.3", + "version": "2.0.0-rc.4", "description": "A dialog plugin for Aurelia.", "keywords": [ "aurelia", diff --git a/dist/amd/dialog-renderer.js b/dist/amd/dialog-renderer.js index b518117..86557c6 100644 --- a/dist/amd/dialog-renderer.js +++ b/dist/amd/dialog-renderer.js @@ -1,9 +1,3 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; define(["require", "exports", "aurelia-pal", "aurelia-dependency-injection"], function (require, exports, aurelia_pal_1, aurelia_dependency_injection_1) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); @@ -64,13 +58,12 @@ define(["require", "exports", "aurelia-pal", "aurelia-dependency-injection"], fu var DialogRenderer = /** @class */ (function () { function DialogRenderer() { } - DialogRenderer_1 = DialogRenderer; DialogRenderer.keyboardEventHandler = function (e) { var key = getActionKey(e); if (!key) { return; } - var top = DialogRenderer_1.dialogControllers[DialogRenderer_1.dialogControllers.length - 1]; + var top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; if (!top || !top.settings.keyboard) { return; } @@ -84,18 +77,18 @@ define(["require", "exports", "aurelia-pal", "aurelia-dependency-injection"], fu } }; DialogRenderer.trackController = function (dialogController) { - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.addEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } - DialogRenderer_1.dialogControllers.push(dialogController); + DialogRenderer.dialogControllers.push(dialogController); }; DialogRenderer.untrackController = function (dialogController) { - var i = DialogRenderer_1.dialogControllers.indexOf(dialogController); + var i = DialogRenderer.dialogControllers.indexOf(dialogController); if (i !== -1) { - DialogRenderer_1.dialogControllers.splice(i, 1); + DialogRenderer.dialogControllers.splice(i, 1); } - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.removeEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } }; DialogRenderer.prototype.getOwnElements = function (parent, selector) { @@ -135,7 +128,7 @@ define(["require", "exports", "aurelia-pal", "aurelia-dependency-injection"], fu this.host.removeChild(this.dialogOverlay); this.host.removeChild(this.dialogContainer); dialogController.controller.detached(); - if (!DialogRenderer_1.dialogControllers.length) { + if (!DialogRenderer.dialogControllers.length) { this.host.classList.remove('ux-dialog-open'); } }; @@ -211,23 +204,21 @@ define(["require", "exports", "aurelia-pal", "aurelia-dependency-injection"], fu else if (!settings.centerHorizontalOnly) { this.centerDialog(); } - DialogRenderer_1.trackController(dialogController); + DialogRenderer.trackController(dialogController); this.setupClickHandling(dialogController); return this.awaitTransition(function () { return _this.setAsActive(); }, dialogController.settings.ignoreTransitions); }; DialogRenderer.prototype.hideDialog = function (dialogController) { var _this = this; this.clearClickHandling(); - DialogRenderer_1.untrackController(dialogController); + DialogRenderer.untrackController(dialogController); return this.awaitTransition(function () { return _this.setAsInactive(); }, dialogController.settings.ignoreTransitions) .then(function () { _this.detach(dialogController); }); }; - var DialogRenderer_1; DialogRenderer.dialogControllers = []; - DialogRenderer = DialogRenderer_1 = __decorate([ - aurelia_dependency_injection_1.transient() - ], DialogRenderer); return DialogRenderer; }()); exports.DialogRenderer = DialogRenderer; + // avoid unnecessary code + aurelia_dependency_injection_1.transient()(DialogRenderer); }); diff --git a/dist/amd/dialog-settings.d.ts b/dist/amd/dialog-settings.d.ts index 6fcda84..4ae99cf 100644 --- a/dist/amd/dialog-settings.d.ts +++ b/dist/amd/dialog-settings.d.ts @@ -1,6 +1,7 @@ import { Container } from 'aurelia-dependency-injection'; import { ViewStrategy } from 'aurelia-templating'; export declare type ActionKey = 'Escape' | 'Enter'; +export declare type KeyEventType = 'keyup' | 'keydown'; /** * All available dialog settings. */ @@ -44,6 +45,13 @@ export interface DialogSettings { * Using the array format allows combining the ESC and ENTER keys. */ keyboard?: boolean | ActionKey | ActionKey[]; + /** + * Determines which type of keyevent should be used to listen for + * ENTER and ESC keys + * + * Default: keyup + */ + keyEvent?: KeyEventType; /** * When set to "true" allows for the dismissal of the dialog by clicking outside of it. */ diff --git a/dist/amd/resources/attach-focus.js b/dist/amd/resources/attach-focus.js index 776d906..533b12f 100644 --- a/dist/amd/resources/attach-focus.js +++ b/dist/amd/resources/attach-focus.js @@ -1,10 +1,4 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -define(["require", "exports", "aurelia-binding", "aurelia-templating", "aurelia-pal"], function (require, exports, aurelia_binding_1, aurelia_templating_1, aurelia_pal_1) { +define(["require", "exports", "aurelia-pal"], function (require, exports, aurelia_pal_1) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var AttachFocus = /** @class */ (function () { @@ -12,6 +6,13 @@ define(["require", "exports", "aurelia-binding", "aurelia-templating", "aurelia- this.element = element; this.value = true; } + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + AttachFocus.inject = function () { + return [aurelia_pal_1.DOM.Element]; + }; AttachFocus.prototype.attached = function () { if (this.value === '' || (this.value && this.value !== 'false')) { this.element.focus(); @@ -20,11 +21,10 @@ define(["require", "exports", "aurelia-binding", "aurelia-templating", "aurelia- /** * @internal */ - // tslint:disable-next-line:member-ordering - AttachFocus.inject = [aurelia_pal_1.DOM.Element]; - AttachFocus = __decorate([ - aurelia_templating_1.customAttribute('attach-focus', aurelia_binding_1.bindingMode.oneTime) - ], AttachFocus); + AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' + }; return AttachFocus; }()); exports.AttachFocus = AttachFocus; diff --git a/dist/amd/resources/ux-dialog-body.js b/dist/amd/resources/ux-dialog-body.js index abaa1b4..b600cdc 100644 --- a/dist/amd/resources/ux-dialog-body.js +++ b/dist/amd/resources/ux-dialog-body.js @@ -1,19 +1,17 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -define(["require", "exports", "aurelia-templating"], function (require, exports, aurelia_templating_1) { +define(["require", "exports"], function (require, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var UxDialogBody = /** @class */ (function () { function UxDialogBody() { } - UxDialogBody = __decorate([ - aurelia_templating_1.customElement('ux-dialog-body'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogBody); + /** + * @internal + */ + UxDialogBody.$view = ""; + /** + * @internal + */ + UxDialogBody.$resource = 'ux-dialog-body'; return UxDialogBody; }()); exports.UxDialogBody = UxDialogBody; diff --git a/dist/amd/resources/ux-dialog-footer.d.ts b/dist/amd/resources/ux-dialog-footer.d.ts index 5035838..0fa327b 100644 --- a/dist/amd/resources/ux-dialog-footer.d.ts +++ b/dist/amd/resources/ux-dialog-footer.d.ts @@ -5,7 +5,13 @@ import { DialogController } from '../dialog-controller'; export declare class UxDialogFooter { controller: DialogController; static isCancelButton(value: string): boolean; + /** + * @bindable + */ buttons: any[]; + /** + * @bindable + */ useDefaultButtons: boolean; constructor(controller: DialogController); close(buttonValue: string): void; diff --git a/dist/amd/resources/ux-dialog-footer.js b/dist/amd/resources/ux-dialog-footer.js index 80b8d60..58bcd76 100644 --- a/dist/amd/resources/ux-dialog-footer.js +++ b/dist/amd/resources/ux-dialog-footer.js @@ -1,10 +1,4 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -define(["require", "exports", "aurelia-templating", "../dialog-controller"], function (require, exports, aurelia_templating_1, dialog_controller_1) { +define(["require", "exports", "../dialog-controller"], function (require, exports, dialog_controller_1) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); /** @@ -13,15 +7,20 @@ define(["require", "exports", "aurelia-templating", "../dialog-controller"], fun var UxDialogFooter = /** @class */ (function () { function UxDialogFooter(controller) { this.controller = controller; + /** + * @bindable + */ this.buttons = []; + /** + * @bindable + */ this.useDefaultButtons = false; } - UxDialogFooter_1 = UxDialogFooter; UxDialogFooter.isCancelButton = function (value) { return value === 'Cancel'; }; UxDialogFooter.prototype.close = function (buttonValue) { - if (UxDialogFooter_1.isCancelButton(buttonValue)) { + if (UxDialogFooter.isCancelButton(buttonValue)) { this.controller.cancel(buttonValue); } else { @@ -33,22 +32,24 @@ define(["require", "exports", "aurelia-templating", "../dialog-controller"], fun this.buttons = ['Cancel', 'Ok']; } }; - var UxDialogFooter_1; /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogFooter.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "buttons", void 0); - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "useDefaultButtons", void 0); - UxDialogFooter = UxDialogFooter_1 = __decorate([ - aurelia_templating_1.customElement('ux-dialog-footer'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogFooter); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] + }; return UxDialogFooter; }()); exports.UxDialogFooter = UxDialogFooter; diff --git a/dist/amd/resources/ux-dialog-header.d.ts b/dist/amd/resources/ux-dialog-header.d.ts index ace0ab8..1d3aa8e 100644 --- a/dist/amd/resources/ux-dialog-header.d.ts +++ b/dist/amd/resources/ux-dialog-header.d.ts @@ -2,6 +2,9 @@ import { ComponentBind } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; export declare class UxDialogHeader implements ComponentBind { controller: DialogController; + /** + * @bindable + */ showCloseButton: boolean | undefined; constructor(controller: DialogController); bind(): void; diff --git a/dist/amd/resources/ux-dialog-header.js b/dist/amd/resources/ux-dialog-header.js index f05da75..7aea15c 100644 --- a/dist/amd/resources/ux-dialog-header.js +++ b/dist/amd/resources/ux-dialog-header.js @@ -1,10 +1,4 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -define(["require", "exports", "aurelia-templating", "../dialog-controller"], function (require, exports, aurelia_templating_1, dialog_controller_1) { +define(["require", "exports", "../dialog-controller"], function (require, exports, dialog_controller_1) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var UxDialogHeader = /** @class */ (function () { @@ -21,13 +15,19 @@ define(["require", "exports", "aurelia-templating", "../dialog-controller"], fun */ // tslint:disable-next-line:member-ordering UxDialogHeader.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable() - ], UxDialogHeader.prototype, "showCloseButton", void 0); - UxDialogHeader = __decorate([ - aurelia_templating_1.customElement('ux-dialog-header'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogHeader); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] + }; return UxDialogHeader; }()); exports.UxDialogHeader = UxDialogHeader; diff --git a/dist/amd/resources/ux-dialog.js b/dist/amd/resources/ux-dialog.js index 96aa754..c4d3286 100644 --- a/dist/amd/resources/ux-dialog.js +++ b/dist/amd/resources/ux-dialog.js @@ -1,19 +1,17 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -define(["require", "exports", "aurelia-templating"], function (require, exports, aurelia_templating_1) { +define(["require", "exports"], function (require, exports) { "use strict"; Object.defineProperty(exports, "__esModule", { value: true }); var UxDialog = /** @class */ (function () { function UxDialog() { } - UxDialog = __decorate([ - aurelia_templating_1.customElement('ux-dialog'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialog); + /** + * @internal + */ + UxDialog.$view = ""; + /** + * @internal + */ + UxDialog.$resource = 'ux-dialog'; return UxDialog; }()); exports.UxDialog = UxDialog; diff --git a/dist/commonjs/dialog-renderer.js b/dist/commonjs/dialog-renderer.js index 61f9630..206ef23 100644 --- a/dist/commonjs/dialog-renderer.js +++ b/dist/commonjs/dialog-renderer.js @@ -1,10 +1,4 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); var aurelia_pal_1 = require("aurelia-pal"); var aurelia_dependency_injection_1 = require("aurelia-dependency-injection"); @@ -65,13 +59,12 @@ function getActionKey(e) { var DialogRenderer = /** @class */ (function () { function DialogRenderer() { } - DialogRenderer_1 = DialogRenderer; DialogRenderer.keyboardEventHandler = function (e) { var key = getActionKey(e); if (!key) { return; } - var top = DialogRenderer_1.dialogControllers[DialogRenderer_1.dialogControllers.length - 1]; + var top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; if (!top || !top.settings.keyboard) { return; } @@ -85,18 +78,18 @@ var DialogRenderer = /** @class */ (function () { } }; DialogRenderer.trackController = function (dialogController) { - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.addEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } - DialogRenderer_1.dialogControllers.push(dialogController); + DialogRenderer.dialogControllers.push(dialogController); }; DialogRenderer.untrackController = function (dialogController) { - var i = DialogRenderer_1.dialogControllers.indexOf(dialogController); + var i = DialogRenderer.dialogControllers.indexOf(dialogController); if (i !== -1) { - DialogRenderer_1.dialogControllers.splice(i, 1); + DialogRenderer.dialogControllers.splice(i, 1); } - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.removeEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } }; DialogRenderer.prototype.getOwnElements = function (parent, selector) { @@ -136,7 +129,7 @@ var DialogRenderer = /** @class */ (function () { this.host.removeChild(this.dialogOverlay); this.host.removeChild(this.dialogContainer); dialogController.controller.detached(); - if (!DialogRenderer_1.dialogControllers.length) { + if (!DialogRenderer.dialogControllers.length) { this.host.classList.remove('ux-dialog-open'); } }; @@ -212,22 +205,20 @@ var DialogRenderer = /** @class */ (function () { else if (!settings.centerHorizontalOnly) { this.centerDialog(); } - DialogRenderer_1.trackController(dialogController); + DialogRenderer.trackController(dialogController); this.setupClickHandling(dialogController); return this.awaitTransition(function () { return _this.setAsActive(); }, dialogController.settings.ignoreTransitions); }; DialogRenderer.prototype.hideDialog = function (dialogController) { var _this = this; this.clearClickHandling(); - DialogRenderer_1.untrackController(dialogController); + DialogRenderer.untrackController(dialogController); return this.awaitTransition(function () { return _this.setAsInactive(); }, dialogController.settings.ignoreTransitions) .then(function () { _this.detach(dialogController); }); }; - var DialogRenderer_1; DialogRenderer.dialogControllers = []; - DialogRenderer = DialogRenderer_1 = __decorate([ - aurelia_dependency_injection_1.transient() - ], DialogRenderer); return DialogRenderer; }()); exports.DialogRenderer = DialogRenderer; +// avoid unnecessary code +aurelia_dependency_injection_1.transient()(DialogRenderer); diff --git a/dist/commonjs/dialog-settings.d.ts b/dist/commonjs/dialog-settings.d.ts index 6fcda84..4ae99cf 100644 --- a/dist/commonjs/dialog-settings.d.ts +++ b/dist/commonjs/dialog-settings.d.ts @@ -1,6 +1,7 @@ import { Container } from 'aurelia-dependency-injection'; import { ViewStrategy } from 'aurelia-templating'; export declare type ActionKey = 'Escape' | 'Enter'; +export declare type KeyEventType = 'keyup' | 'keydown'; /** * All available dialog settings. */ @@ -44,6 +45,13 @@ export interface DialogSettings { * Using the array format allows combining the ESC and ENTER keys. */ keyboard?: boolean | ActionKey | ActionKey[]; + /** + * Determines which type of keyevent should be used to listen for + * ENTER and ESC keys + * + * Default: keyup + */ + keyEvent?: KeyEventType; /** * When set to "true" allows for the dismissal of the dialog by clicking outside of it. */ diff --git a/dist/commonjs/resources/attach-focus.js b/dist/commonjs/resources/attach-focus.js index cc11615..e537bb8 100644 --- a/dist/commonjs/resources/attach-focus.js +++ b/dist/commonjs/resources/attach-focus.js @@ -1,19 +1,18 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); -var aurelia_binding_1 = require("aurelia-binding"); -var aurelia_templating_1 = require("aurelia-templating"); var aurelia_pal_1 = require("aurelia-pal"); var AttachFocus = /** @class */ (function () { function AttachFocus(element) { this.element = element; this.value = true; } + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + AttachFocus.inject = function () { + return [aurelia_pal_1.DOM.Element]; + }; AttachFocus.prototype.attached = function () { if (this.value === '' || (this.value && this.value !== 'false')) { this.element.focus(); @@ -22,11 +21,10 @@ var AttachFocus = /** @class */ (function () { /** * @internal */ - // tslint:disable-next-line:member-ordering - AttachFocus.inject = [aurelia_pal_1.DOM.Element]; - AttachFocus = __decorate([ - aurelia_templating_1.customAttribute('attach-focus', aurelia_binding_1.bindingMode.oneTime) - ], AttachFocus); + AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' + }; return AttachFocus; }()); exports.AttachFocus = AttachFocus; diff --git a/dist/commonjs/resources/ux-dialog-body.js b/dist/commonjs/resources/ux-dialog-body.js index acc4b4f..da67a11 100644 --- a/dist/commonjs/resources/ux-dialog-body.js +++ b/dist/commonjs/resources/ux-dialog-body.js @@ -1,19 +1,16 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); -var aurelia_templating_1 = require("aurelia-templating"); var UxDialogBody = /** @class */ (function () { function UxDialogBody() { } - UxDialogBody = __decorate([ - aurelia_templating_1.customElement('ux-dialog-body'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogBody); + /** + * @internal + */ + UxDialogBody.$view = ""; + /** + * @internal + */ + UxDialogBody.$resource = 'ux-dialog-body'; return UxDialogBody; }()); exports.UxDialogBody = UxDialogBody; diff --git a/dist/commonjs/resources/ux-dialog-footer.d.ts b/dist/commonjs/resources/ux-dialog-footer.d.ts index 5035838..0fa327b 100644 --- a/dist/commonjs/resources/ux-dialog-footer.d.ts +++ b/dist/commonjs/resources/ux-dialog-footer.d.ts @@ -5,7 +5,13 @@ import { DialogController } from '../dialog-controller'; export declare class UxDialogFooter { controller: DialogController; static isCancelButton(value: string): boolean; + /** + * @bindable + */ buttons: any[]; + /** + * @bindable + */ useDefaultButtons: boolean; constructor(controller: DialogController); close(buttonValue: string): void; diff --git a/dist/commonjs/resources/ux-dialog-footer.js b/dist/commonjs/resources/ux-dialog-footer.js index 03e7034..e199948 100644 --- a/dist/commonjs/resources/ux-dialog-footer.js +++ b/dist/commonjs/resources/ux-dialog-footer.js @@ -1,12 +1,5 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); -var aurelia_templating_1 = require("aurelia-templating"); var dialog_controller_1 = require("../dialog-controller"); /** * View-model for footer of Dialog. @@ -14,15 +7,20 @@ var dialog_controller_1 = require("../dialog-controller"); var UxDialogFooter = /** @class */ (function () { function UxDialogFooter(controller) { this.controller = controller; + /** + * @bindable + */ this.buttons = []; + /** + * @bindable + */ this.useDefaultButtons = false; } - UxDialogFooter_1 = UxDialogFooter; UxDialogFooter.isCancelButton = function (value) { return value === 'Cancel'; }; UxDialogFooter.prototype.close = function (buttonValue) { - if (UxDialogFooter_1.isCancelButton(buttonValue)) { + if (UxDialogFooter.isCancelButton(buttonValue)) { this.controller.cancel(buttonValue); } else { @@ -34,22 +32,24 @@ var UxDialogFooter = /** @class */ (function () { this.buttons = ['Cancel', 'Ok']; } }; - var UxDialogFooter_1; /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogFooter.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "buttons", void 0); - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "useDefaultButtons", void 0); - UxDialogFooter = UxDialogFooter_1 = __decorate([ - aurelia_templating_1.customElement('ux-dialog-footer'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogFooter); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] + }; return UxDialogFooter; }()); exports.UxDialogFooter = UxDialogFooter; diff --git a/dist/commonjs/resources/ux-dialog-header.d.ts b/dist/commonjs/resources/ux-dialog-header.d.ts index ace0ab8..1d3aa8e 100644 --- a/dist/commonjs/resources/ux-dialog-header.d.ts +++ b/dist/commonjs/resources/ux-dialog-header.d.ts @@ -2,6 +2,9 @@ import { ComponentBind } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; export declare class UxDialogHeader implements ComponentBind { controller: DialogController; + /** + * @bindable + */ showCloseButton: boolean | undefined; constructor(controller: DialogController); bind(): void; diff --git a/dist/commonjs/resources/ux-dialog-header.js b/dist/commonjs/resources/ux-dialog-header.js index f1f8a57..031777d 100644 --- a/dist/commonjs/resources/ux-dialog-header.js +++ b/dist/commonjs/resources/ux-dialog-header.js @@ -1,12 +1,5 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); -var aurelia_templating_1 = require("aurelia-templating"); var dialog_controller_1 = require("../dialog-controller"); var UxDialogHeader = /** @class */ (function () { function UxDialogHeader(controller) { @@ -22,13 +15,19 @@ var UxDialogHeader = /** @class */ (function () { */ // tslint:disable-next-line:member-ordering UxDialogHeader.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable() - ], UxDialogHeader.prototype, "showCloseButton", void 0); - UxDialogHeader = __decorate([ - aurelia_templating_1.customElement('ux-dialog-header'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogHeader); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] + }; return UxDialogHeader; }()); exports.UxDialogHeader = UxDialogHeader; diff --git a/dist/commonjs/resources/ux-dialog.js b/dist/commonjs/resources/ux-dialog.js index 2473a50..41ba014 100644 --- a/dist/commonjs/resources/ux-dialog.js +++ b/dist/commonjs/resources/ux-dialog.js @@ -1,19 +1,16 @@ "use strict"; -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; Object.defineProperty(exports, "__esModule", { value: true }); -var aurelia_templating_1 = require("aurelia-templating"); var UxDialog = /** @class */ (function () { function UxDialog() { } - UxDialog = __decorate([ - aurelia_templating_1.customElement('ux-dialog'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialog); + /** + * @internal + */ + UxDialog.$view = ""; + /** + * @internal + */ + UxDialog.$resource = 'ux-dialog'; return UxDialog; }()); exports.UxDialog = UxDialog; diff --git a/dist/es2015/dialog-renderer.js b/dist/es2015/dialog-renderer.js index b29135b..26f3051 100644 --- a/dist/es2015/dialog-renderer.js +++ b/dist/es2015/dialog-renderer.js @@ -1,10 +1,3 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -var DialogRenderer_1; import { DOM } from 'aurelia-pal'; import { transient } from 'aurelia-dependency-injection'; const containerTagName = 'ux-dialog-container'; @@ -61,13 +54,13 @@ function getActionKey(e) { } return undefined; } -let DialogRenderer = DialogRenderer_1 = class DialogRenderer { +export class DialogRenderer { static keyboardEventHandler(e) { const key = getActionKey(e); if (!key) { return; } - const top = DialogRenderer_1.dialogControllers[DialogRenderer_1.dialogControllers.length - 1]; + const top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; if (!top || !top.settings.keyboard) { return; } @@ -81,18 +74,18 @@ let DialogRenderer = DialogRenderer_1 = class DialogRenderer { } } static trackController(dialogController) { - if (!DialogRenderer_1.dialogControllers.length) { - DOM.addEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } - DialogRenderer_1.dialogControllers.push(dialogController); + DialogRenderer.dialogControllers.push(dialogController); } static untrackController(dialogController) { - const i = DialogRenderer_1.dialogControllers.indexOf(dialogController); + const i = DialogRenderer.dialogControllers.indexOf(dialogController); if (i !== -1) { - DialogRenderer_1.dialogControllers.splice(i, 1); + DialogRenderer.dialogControllers.splice(i, 1); } - if (!DialogRenderer_1.dialogControllers.length) { - DOM.removeEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } } getOwnElements(parent, selector) { @@ -132,7 +125,7 @@ let DialogRenderer = DialogRenderer_1 = class DialogRenderer { this.host.removeChild(this.dialogOverlay); this.host.removeChild(this.dialogContainer); dialogController.controller.detached(); - if (!DialogRenderer_1.dialogControllers.length) { + if (!DialogRenderer.dialogControllers.length) { this.host.classList.remove('ux-dialog-open'); } } @@ -206,19 +199,17 @@ let DialogRenderer = DialogRenderer_1 = class DialogRenderer { else if (!settings.centerHorizontalOnly) { this.centerDialog(); } - DialogRenderer_1.trackController(dialogController); + DialogRenderer.trackController(dialogController); this.setupClickHandling(dialogController); return this.awaitTransition(() => this.setAsActive(), dialogController.settings.ignoreTransitions); } hideDialog(dialogController) { this.clearClickHandling(); - DialogRenderer_1.untrackController(dialogController); + DialogRenderer.untrackController(dialogController); return this.awaitTransition(() => this.setAsInactive(), dialogController.settings.ignoreTransitions) .then(() => { this.detach(dialogController); }); } -}; +} DialogRenderer.dialogControllers = []; -DialogRenderer = DialogRenderer_1 = __decorate([ - transient() -], DialogRenderer); -export { DialogRenderer }; +// avoid unnecessary code +transient()(DialogRenderer); diff --git a/dist/es2015/dialog-settings.d.ts b/dist/es2015/dialog-settings.d.ts index 6fcda84..4ae99cf 100644 --- a/dist/es2015/dialog-settings.d.ts +++ b/dist/es2015/dialog-settings.d.ts @@ -1,6 +1,7 @@ import { Container } from 'aurelia-dependency-injection'; import { ViewStrategy } from 'aurelia-templating'; export declare type ActionKey = 'Escape' | 'Enter'; +export declare type KeyEventType = 'keyup' | 'keydown'; /** * All available dialog settings. */ @@ -44,6 +45,13 @@ export interface DialogSettings { * Using the array format allows combining the ESC and ENTER keys. */ keyboard?: boolean | ActionKey | ActionKey[]; + /** + * Determines which type of keyevent should be used to listen for + * ENTER and ESC keys + * + * Default: keyup + */ + keyEvent?: KeyEventType; /** * When set to "true" allows for the dismissal of the dialog by clicking outside of it. */ diff --git a/dist/es2015/resources/attach-focus.js b/dist/es2015/resources/attach-focus.js index c4bd6b6..06e46ab 100644 --- a/dist/es2015/resources/attach-focus.js +++ b/dist/es2015/resources/attach-focus.js @@ -1,29 +1,26 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { bindingMode } from 'aurelia-binding'; -import { customAttribute } from 'aurelia-templating'; import { DOM } from 'aurelia-pal'; -let AttachFocus = class AttachFocus { +export class AttachFocus { constructor(element) { this.element = element; this.value = true; } + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + static inject() { + return [DOM.Element]; + } attached() { if (this.value === '' || (this.value && this.value !== 'false')) { this.element.focus(); } } -}; +} /** * @internal */ -// tslint:disable-next-line:member-ordering -AttachFocus.inject = [DOM.Element]; -AttachFocus = __decorate([ - customAttribute('attach-focus', bindingMode.oneTime) -], AttachFocus); -export { AttachFocus }; +AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' +}; diff --git a/dist/es2015/resources/ux-dialog-body.js b/dist/es2015/resources/ux-dialog-body.js index a2fde04..18a75a5 100644 --- a/dist/es2015/resources/ux-dialog-body.js +++ b/dist/es2015/resources/ux-dialog-body.js @@ -1,18 +1,10 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, inlineView } from 'aurelia-templating'; -let UxDialogBody = class UxDialogBody { -}; -UxDialogBody = __decorate([ - customElement('ux-dialog-body'), - inlineView(` - -`) -], UxDialogBody); -export { UxDialogBody }; +export class UxDialogBody { +} +/** + * @internal + */ +UxDialogBody.$view = ``; +/** + * @internal + */ +UxDialogBody.$resource = 'ux-dialog-body'; diff --git a/dist/es2015/resources/ux-dialog-footer.d.ts b/dist/es2015/resources/ux-dialog-footer.d.ts index 5035838..0fa327b 100644 --- a/dist/es2015/resources/ux-dialog-footer.d.ts +++ b/dist/es2015/resources/ux-dialog-footer.d.ts @@ -5,7 +5,13 @@ import { DialogController } from '../dialog-controller'; export declare class UxDialogFooter { controller: DialogController; static isCancelButton(value: string): boolean; + /** + * @bindable + */ buttons: any[]; + /** + * @bindable + */ useDefaultButtons: boolean; constructor(controller: DialogController); close(buttonValue: string): void; diff --git a/dist/es2015/resources/ux-dialog-footer.js b/dist/es2015/resources/ux-dialog-footer.js index 8503ac0..a270a74 100644 --- a/dist/es2015/resources/ux-dialog-footer.js +++ b/dist/es2015/resources/ux-dialog-footer.js @@ -1,26 +1,24 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -var UxDialogFooter_1; -import { customElement, bindable, inlineView } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; /** * View-model for footer of Dialog. */ -let UxDialogFooter = UxDialogFooter_1 = class UxDialogFooter { +export class UxDialogFooter { constructor(controller) { this.controller = controller; + /** + * @bindable + */ this.buttons = []; + /** + * @bindable + */ this.useDefaultButtons = false; } static isCancelButton(value) { return value === 'Cancel'; } close(buttonValue) { - if (UxDialogFooter_1.isCancelButton(buttonValue)) { + if (UxDialogFooter.isCancelButton(buttonValue)) { this.controller.cancel(buttonValue); } else { @@ -32,22 +30,17 @@ let UxDialogFooter = UxDialogFooter_1 = class UxDialogFooter { this.buttons = ['Cancel', 'Ok']; } } -}; +} /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogFooter.inject = [DialogController]; -__decorate([ - bindable -], UxDialogFooter.prototype, "buttons", void 0); -__decorate([ - bindable -], UxDialogFooter.prototype, "useDefaultButtons", void 0); -UxDialogFooter = UxDialogFooter_1 = __decorate([ - customElement('ux-dialog-footer'), - inlineView(` - `; +/** + * @internal + */ +// tslint:disable-next-line:member-ordering +UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] +}; diff --git a/dist/es2015/resources/ux-dialog-header.d.ts b/dist/es2015/resources/ux-dialog-header.d.ts index ace0ab8..1d3aa8e 100644 --- a/dist/es2015/resources/ux-dialog-header.d.ts +++ b/dist/es2015/resources/ux-dialog-header.d.ts @@ -2,6 +2,9 @@ import { ComponentBind } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; export declare class UxDialogHeader implements ComponentBind { controller: DialogController; + /** + * @bindable + */ showCloseButton: boolean | undefined; constructor(controller: DialogController); bind(): void; diff --git a/dist/es2015/resources/ux-dialog-header.js b/dist/es2015/resources/ux-dialog-header.js index 725a990..e4a7152 100644 --- a/dist/es2015/resources/ux-dialog-header.js +++ b/dist/es2015/resources/ux-dialog-header.js @@ -1,12 +1,5 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, bindable, inlineView } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; -let UxDialogHeader = class UxDialogHeader { +export class UxDialogHeader { constructor(controller) { this.controller = controller; } @@ -15,19 +8,17 @@ let UxDialogHeader = class UxDialogHeader { this.showCloseButton = !this.controller.settings.lock; } } -}; +} /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogHeader.inject = [DialogController]; -__decorate([ - bindable() -], UxDialogHeader.prototype, "showCloseButton", void 0); -UxDialogHeader = __decorate([ - customElement('ux-dialog-header'), - inlineView(` - `; +/** + * @internal + */ +// tslint:disable-next-line:member-ordering +UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] +}; diff --git a/dist/es2015/resources/ux-dialog.js b/dist/es2015/resources/ux-dialog.js index 09e5975..629850f 100644 --- a/dist/es2015/resources/ux-dialog.js +++ b/dist/es2015/resources/ux-dialog.js @@ -1,18 +1,10 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, inlineView } from 'aurelia-templating'; -let UxDialog = class UxDialog { -}; -UxDialog = __decorate([ - customElement('ux-dialog'), - inlineView(` - -`) -], UxDialog); -export { UxDialog }; +export class UxDialog { +} +/** + * @internal + */ +UxDialog.$view = ``; +/** + * @internal + */ +UxDialog.$resource = 'ux-dialog'; diff --git a/dist/native-modules/dialog-renderer.js b/dist/native-modules/dialog-renderer.js index 5b4a37d..2ffe3c0 100644 --- a/dist/native-modules/dialog-renderer.js +++ b/dist/native-modules/dialog-renderer.js @@ -1,9 +1,3 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; import { DOM } from 'aurelia-pal'; import { transient } from 'aurelia-dependency-injection'; var containerTagName = 'ux-dialog-container'; @@ -63,13 +57,12 @@ function getActionKey(e) { var DialogRenderer = /** @class */ (function () { function DialogRenderer() { } - DialogRenderer_1 = DialogRenderer; DialogRenderer.keyboardEventHandler = function (e) { var key = getActionKey(e); if (!key) { return; } - var top = DialogRenderer_1.dialogControllers[DialogRenderer_1.dialogControllers.length - 1]; + var top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; if (!top || !top.settings.keyboard) { return; } @@ -83,18 +76,18 @@ var DialogRenderer = /** @class */ (function () { } }; DialogRenderer.trackController = function (dialogController) { - if (!DialogRenderer_1.dialogControllers.length) { - DOM.addEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } - DialogRenderer_1.dialogControllers.push(dialogController); + DialogRenderer.dialogControllers.push(dialogController); }; DialogRenderer.untrackController = function (dialogController) { - var i = DialogRenderer_1.dialogControllers.indexOf(dialogController); + var i = DialogRenderer.dialogControllers.indexOf(dialogController); if (i !== -1) { - DialogRenderer_1.dialogControllers.splice(i, 1); + DialogRenderer.dialogControllers.splice(i, 1); } - if (!DialogRenderer_1.dialogControllers.length) { - DOM.removeEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } }; DialogRenderer.prototype.getOwnElements = function (parent, selector) { @@ -134,7 +127,7 @@ var DialogRenderer = /** @class */ (function () { this.host.removeChild(this.dialogOverlay); this.host.removeChild(this.dialogContainer); dialogController.controller.detached(); - if (!DialogRenderer_1.dialogControllers.length) { + if (!DialogRenderer.dialogControllers.length) { this.host.classList.remove('ux-dialog-open'); } }; @@ -210,22 +203,20 @@ var DialogRenderer = /** @class */ (function () { else if (!settings.centerHorizontalOnly) { this.centerDialog(); } - DialogRenderer_1.trackController(dialogController); + DialogRenderer.trackController(dialogController); this.setupClickHandling(dialogController); return this.awaitTransition(function () { return _this.setAsActive(); }, dialogController.settings.ignoreTransitions); }; DialogRenderer.prototype.hideDialog = function (dialogController) { var _this = this; this.clearClickHandling(); - DialogRenderer_1.untrackController(dialogController); + DialogRenderer.untrackController(dialogController); return this.awaitTransition(function () { return _this.setAsInactive(); }, dialogController.settings.ignoreTransitions) .then(function () { _this.detach(dialogController); }); }; - var DialogRenderer_1; DialogRenderer.dialogControllers = []; - DialogRenderer = DialogRenderer_1 = __decorate([ - transient() - ], DialogRenderer); return DialogRenderer; }()); export { DialogRenderer }; +// avoid unnecessary code +transient()(DialogRenderer); diff --git a/dist/native-modules/dialog-settings.d.ts b/dist/native-modules/dialog-settings.d.ts index 6fcda84..4ae99cf 100644 --- a/dist/native-modules/dialog-settings.d.ts +++ b/dist/native-modules/dialog-settings.d.ts @@ -1,6 +1,7 @@ import { Container } from 'aurelia-dependency-injection'; import { ViewStrategy } from 'aurelia-templating'; export declare type ActionKey = 'Escape' | 'Enter'; +export declare type KeyEventType = 'keyup' | 'keydown'; /** * All available dialog settings. */ @@ -44,6 +45,13 @@ export interface DialogSettings { * Using the array format allows combining the ESC and ENTER keys. */ keyboard?: boolean | ActionKey | ActionKey[]; + /** + * Determines which type of keyevent should be used to listen for + * ENTER and ESC keys + * + * Default: keyup + */ + keyEvent?: KeyEventType; /** * When set to "true" allows for the dismissal of the dialog by clicking outside of it. */ diff --git a/dist/native-modules/resources/attach-focus.js b/dist/native-modules/resources/attach-focus.js index 2d16af8..14d6d2f 100644 --- a/dist/native-modules/resources/attach-focus.js +++ b/dist/native-modules/resources/attach-focus.js @@ -1,17 +1,16 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { bindingMode } from 'aurelia-binding'; -import { customAttribute } from 'aurelia-templating'; import { DOM } from 'aurelia-pal'; var AttachFocus = /** @class */ (function () { function AttachFocus(element) { this.element = element; this.value = true; } + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + AttachFocus.inject = function () { + return [DOM.Element]; + }; AttachFocus.prototype.attached = function () { if (this.value === '' || (this.value && this.value !== 'false')) { this.element.focus(); @@ -20,11 +19,10 @@ var AttachFocus = /** @class */ (function () { /** * @internal */ - // tslint:disable-next-line:member-ordering - AttachFocus.inject = [DOM.Element]; - AttachFocus = __decorate([ - customAttribute('attach-focus', bindingMode.oneTime) - ], AttachFocus); + AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' + }; return AttachFocus; }()); export { AttachFocus }; diff --git a/dist/native-modules/resources/ux-dialog-body.js b/dist/native-modules/resources/ux-dialog-body.js index 67fb7ee..2996ab1 100644 --- a/dist/native-modules/resources/ux-dialog-body.js +++ b/dist/native-modules/resources/ux-dialog-body.js @@ -1,17 +1,14 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, inlineView } from 'aurelia-templating'; var UxDialogBody = /** @class */ (function () { function UxDialogBody() { } - UxDialogBody = __decorate([ - customElement('ux-dialog-body'), - inlineView("\n \n") - ], UxDialogBody); + /** + * @internal + */ + UxDialogBody.$view = ""; + /** + * @internal + */ + UxDialogBody.$resource = 'ux-dialog-body'; return UxDialogBody; }()); export { UxDialogBody }; diff --git a/dist/native-modules/resources/ux-dialog-footer.d.ts b/dist/native-modules/resources/ux-dialog-footer.d.ts index 5035838..0fa327b 100644 --- a/dist/native-modules/resources/ux-dialog-footer.d.ts +++ b/dist/native-modules/resources/ux-dialog-footer.d.ts @@ -5,7 +5,13 @@ import { DialogController } from '../dialog-controller'; export declare class UxDialogFooter { controller: DialogController; static isCancelButton(value: string): boolean; + /** + * @bindable + */ buttons: any[]; + /** + * @bindable + */ useDefaultButtons: boolean; constructor(controller: DialogController); close(buttonValue: string): void; diff --git a/dist/native-modules/resources/ux-dialog-footer.js b/dist/native-modules/resources/ux-dialog-footer.js index 99c0a20..a242d0c 100644 --- a/dist/native-modules/resources/ux-dialog-footer.js +++ b/dist/native-modules/resources/ux-dialog-footer.js @@ -1,10 +1,3 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, bindable, inlineView } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; /** * View-model for footer of Dialog. @@ -12,15 +5,20 @@ import { DialogController } from '../dialog-controller'; var UxDialogFooter = /** @class */ (function () { function UxDialogFooter(controller) { this.controller = controller; + /** + * @bindable + */ this.buttons = []; + /** + * @bindable + */ this.useDefaultButtons = false; } - UxDialogFooter_1 = UxDialogFooter; UxDialogFooter.isCancelButton = function (value) { return value === 'Cancel'; }; UxDialogFooter.prototype.close = function (buttonValue) { - if (UxDialogFooter_1.isCancelButton(buttonValue)) { + if (UxDialogFooter.isCancelButton(buttonValue)) { this.controller.cancel(buttonValue); } else { @@ -32,22 +30,24 @@ var UxDialogFooter = /** @class */ (function () { this.buttons = ['Cancel', 'Ok']; } }; - var UxDialogFooter_1; /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogFooter.inject = [DialogController]; - __decorate([ - bindable - ], UxDialogFooter.prototype, "buttons", void 0); - __decorate([ - bindable - ], UxDialogFooter.prototype, "useDefaultButtons", void 0); - UxDialogFooter = UxDialogFooter_1 = __decorate([ - customElement('ux-dialog-footer'), - inlineView("\n \n") - ], UxDialogFooter); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] + }; return UxDialogFooter; }()); export { UxDialogFooter }; diff --git a/dist/native-modules/resources/ux-dialog-header.d.ts b/dist/native-modules/resources/ux-dialog-header.d.ts index ace0ab8..1d3aa8e 100644 --- a/dist/native-modules/resources/ux-dialog-header.d.ts +++ b/dist/native-modules/resources/ux-dialog-header.d.ts @@ -2,6 +2,9 @@ import { ComponentBind } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; export declare class UxDialogHeader implements ComponentBind { controller: DialogController; + /** + * @bindable + */ showCloseButton: boolean | undefined; constructor(controller: DialogController); bind(): void; diff --git a/dist/native-modules/resources/ux-dialog-header.js b/dist/native-modules/resources/ux-dialog-header.js index d34f19f..a58a7ab 100644 --- a/dist/native-modules/resources/ux-dialog-header.js +++ b/dist/native-modules/resources/ux-dialog-header.js @@ -1,10 +1,3 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, bindable, inlineView } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; var UxDialogHeader = /** @class */ (function () { function UxDialogHeader(controller) { @@ -20,13 +13,19 @@ var UxDialogHeader = /** @class */ (function () { */ // tslint:disable-next-line:member-ordering UxDialogHeader.inject = [DialogController]; - __decorate([ - bindable() - ], UxDialogHeader.prototype, "showCloseButton", void 0); - UxDialogHeader = __decorate([ - customElement('ux-dialog-header'), - inlineView("\n \n") - ], UxDialogHeader); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] + }; return UxDialogHeader; }()); export { UxDialogHeader }; diff --git a/dist/native-modules/resources/ux-dialog.js b/dist/native-modules/resources/ux-dialog.js index 428762e..91aafa7 100644 --- a/dist/native-modules/resources/ux-dialog.js +++ b/dist/native-modules/resources/ux-dialog.js @@ -1,17 +1,14 @@ -var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; -}; -import { customElement, inlineView } from 'aurelia-templating'; var UxDialog = /** @class */ (function () { function UxDialog() { } - UxDialog = __decorate([ - customElement('ux-dialog'), - inlineView("\n \n") - ], UxDialog); + /** + * @internal + */ + UxDialog.$view = ""; + /** + * @internal + */ + UxDialog.$resource = 'ux-dialog'; return UxDialog; }()); export { UxDialog }; diff --git a/dist/system/dialog-renderer.js b/dist/system/dialog-renderer.js index 64745f9..5e3e196 100644 --- a/dist/system/dialog-renderer.js +++ b/dist/system/dialog-renderer.js @@ -1,11 +1,5 @@ System.register(["aurelia-pal", "aurelia-dependency-injection"], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; var aurelia_pal_1, aurelia_dependency_injection_1, containerTagName, overlayTagName, transitionEvent, hasTransition, body, DialogRenderer; var __moduleName = context_1 && context_1.id; function getActionKey(e) { @@ -74,13 +68,12 @@ System.register(["aurelia-pal", "aurelia-dependency-injection"], function (expor DialogRenderer = /** @class */ (function () { function DialogRenderer() { } - DialogRenderer_1 = DialogRenderer; DialogRenderer.keyboardEventHandler = function (e) { var key = getActionKey(e); if (!key) { return; } - var top = DialogRenderer_1.dialogControllers[DialogRenderer_1.dialogControllers.length - 1]; + var top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; if (!top || !top.settings.keyboard) { return; } @@ -94,18 +87,18 @@ System.register(["aurelia-pal", "aurelia-dependency-injection"], function (expor } }; DialogRenderer.trackController = function (dialogController) { - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.addEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } - DialogRenderer_1.dialogControllers.push(dialogController); + DialogRenderer.dialogControllers.push(dialogController); }; DialogRenderer.untrackController = function (dialogController) { - var i = DialogRenderer_1.dialogControllers.indexOf(dialogController); + var i = DialogRenderer.dialogControllers.indexOf(dialogController); if (i !== -1) { - DialogRenderer_1.dialogControllers.splice(i, 1); + DialogRenderer.dialogControllers.splice(i, 1); } - if (!DialogRenderer_1.dialogControllers.length) { - aurelia_pal_1.DOM.removeEventListener('keyup', DialogRenderer_1.keyboardEventHandler, false); + if (!DialogRenderer.dialogControllers.length) { + aurelia_pal_1.DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); } }; DialogRenderer.prototype.getOwnElements = function (parent, selector) { @@ -145,7 +138,7 @@ System.register(["aurelia-pal", "aurelia-dependency-injection"], function (expor this.host.removeChild(this.dialogOverlay); this.host.removeChild(this.dialogContainer); dialogController.controller.detached(); - if (!DialogRenderer_1.dialogControllers.length) { + if (!DialogRenderer.dialogControllers.length) { this.host.classList.remove('ux-dialog-open'); } }; @@ -221,25 +214,23 @@ System.register(["aurelia-pal", "aurelia-dependency-injection"], function (expor else if (!settings.centerHorizontalOnly) { this.centerDialog(); } - DialogRenderer_1.trackController(dialogController); + DialogRenderer.trackController(dialogController); this.setupClickHandling(dialogController); return this.awaitTransition(function () { return _this.setAsActive(); }, dialogController.settings.ignoreTransitions); }; DialogRenderer.prototype.hideDialog = function (dialogController) { var _this = this; this.clearClickHandling(); - DialogRenderer_1.untrackController(dialogController); + DialogRenderer.untrackController(dialogController); return this.awaitTransition(function () { return _this.setAsInactive(); }, dialogController.settings.ignoreTransitions) .then(function () { _this.detach(dialogController); }); }; - var DialogRenderer_1; DialogRenderer.dialogControllers = []; - DialogRenderer = DialogRenderer_1 = __decorate([ - aurelia_dependency_injection_1.transient() - ], DialogRenderer); return DialogRenderer; }()); exports_1("DialogRenderer", DialogRenderer); + // avoid unnecessary code + aurelia_dependency_injection_1.transient()(DialogRenderer); } }; }); diff --git a/dist/system/dialog-settings.d.ts b/dist/system/dialog-settings.d.ts index 6fcda84..4ae99cf 100644 --- a/dist/system/dialog-settings.d.ts +++ b/dist/system/dialog-settings.d.ts @@ -1,6 +1,7 @@ import { Container } from 'aurelia-dependency-injection'; import { ViewStrategy } from 'aurelia-templating'; export declare type ActionKey = 'Escape' | 'Enter'; +export declare type KeyEventType = 'keyup' | 'keydown'; /** * All available dialog settings. */ @@ -44,6 +45,13 @@ export interface DialogSettings { * Using the array format allows combining the ESC and ENTER keys. */ keyboard?: boolean | ActionKey | ActionKey[]; + /** + * Determines which type of keyevent should be used to listen for + * ENTER and ESC keys + * + * Default: keyup + */ + keyEvent?: KeyEventType; /** * When set to "true" allows for the dismissal of the dialog by clicking outside of it. */ diff --git a/dist/system/resources/attach-focus.js b/dist/system/resources/attach-focus.js index a84993e..380305c 100644 --- a/dist/system/resources/attach-focus.js +++ b/dist/system/resources/attach-focus.js @@ -1,21 +1,9 @@ -System.register(["aurelia-binding", "aurelia-templating", "aurelia-pal"], function (exports_1, context_1) { +System.register(["aurelia-pal"], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; - var aurelia_binding_1, aurelia_templating_1, aurelia_pal_1, AttachFocus; + var aurelia_pal_1, AttachFocus; var __moduleName = context_1 && context_1.id; return { setters: [ - function (aurelia_binding_1_1) { - aurelia_binding_1 = aurelia_binding_1_1; - }, - function (aurelia_templating_1_1) { - aurelia_templating_1 = aurelia_templating_1_1; - }, function (aurelia_pal_1_1) { aurelia_pal_1 = aurelia_pal_1_1; } @@ -26,6 +14,13 @@ System.register(["aurelia-binding", "aurelia-templating", "aurelia-pal"], functi this.element = element; this.value = true; } + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + AttachFocus.inject = function () { + return [aurelia_pal_1.DOM.Element]; + }; AttachFocus.prototype.attached = function () { if (this.value === '' || (this.value && this.value !== 'false')) { this.element.focus(); @@ -34,11 +29,10 @@ System.register(["aurelia-binding", "aurelia-templating", "aurelia-pal"], functi /** * @internal */ - // tslint:disable-next-line:member-ordering - AttachFocus.inject = [aurelia_pal_1.DOM.Element]; - AttachFocus = __decorate([ - aurelia_templating_1.customAttribute('attach-focus', aurelia_binding_1.bindingMode.oneTime) - ], AttachFocus); + AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' + }; return AttachFocus; }()); exports_1("AttachFocus", AttachFocus); diff --git a/dist/system/resources/ux-dialog-body.js b/dist/system/resources/ux-dialog-body.js index 917dbf6..b50feb9 100644 --- a/dist/system/resources/ux-dialog-body.js +++ b/dist/system/resources/ux-dialog-body.js @@ -1,27 +1,21 @@ -System.register(["aurelia-templating"], function (exports_1, context_1) { +System.register([], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; - var aurelia_templating_1, UxDialogBody; + var UxDialogBody; var __moduleName = context_1 && context_1.id; return { - setters: [ - function (aurelia_templating_1_1) { - aurelia_templating_1 = aurelia_templating_1_1; - } - ], + setters: [], execute: function () { UxDialogBody = /** @class */ (function () { function UxDialogBody() { } - UxDialogBody = __decorate([ - aurelia_templating_1.customElement('ux-dialog-body'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogBody); + /** + * @internal + */ + UxDialogBody.$view = ""; + /** + * @internal + */ + UxDialogBody.$resource = 'ux-dialog-body'; return UxDialogBody; }()); exports_1("UxDialogBody", UxDialogBody); diff --git a/dist/system/resources/ux-dialog-footer.d.ts b/dist/system/resources/ux-dialog-footer.d.ts index 5035838..0fa327b 100644 --- a/dist/system/resources/ux-dialog-footer.d.ts +++ b/dist/system/resources/ux-dialog-footer.d.ts @@ -5,7 +5,13 @@ import { DialogController } from '../dialog-controller'; export declare class UxDialogFooter { controller: DialogController; static isCancelButton(value: string): boolean; + /** + * @bindable + */ buttons: any[]; + /** + * @bindable + */ useDefaultButtons: boolean; constructor(controller: DialogController); close(buttonValue: string): void; diff --git a/dist/system/resources/ux-dialog-footer.js b/dist/system/resources/ux-dialog-footer.js index b7b5050..148024b 100644 --- a/dist/system/resources/ux-dialog-footer.js +++ b/dist/system/resources/ux-dialog-footer.js @@ -1,18 +1,9 @@ -System.register(["aurelia-templating", "../dialog-controller"], function (exports_1, context_1) { +System.register(["../dialog-controller"], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; - var aurelia_templating_1, dialog_controller_1, UxDialogFooter; + var dialog_controller_1, UxDialogFooter; var __moduleName = context_1 && context_1.id; return { setters: [ - function (aurelia_templating_1_1) { - aurelia_templating_1 = aurelia_templating_1_1; - }, function (dialog_controller_1_1) { dialog_controller_1 = dialog_controller_1_1; } @@ -21,15 +12,20 @@ System.register(["aurelia-templating", "../dialog-controller"], function (export UxDialogFooter = /** @class */ (function () { function UxDialogFooter(controller) { this.controller = controller; + /** + * @bindable + */ this.buttons = []; + /** + * @bindable + */ this.useDefaultButtons = false; } - UxDialogFooter_1 = UxDialogFooter; UxDialogFooter.isCancelButton = function (value) { return value === 'Cancel'; }; UxDialogFooter.prototype.close = function (buttonValue) { - if (UxDialogFooter_1.isCancelButton(buttonValue)) { + if (UxDialogFooter.isCancelButton(buttonValue)) { this.controller.cancel(buttonValue); } else { @@ -41,22 +37,24 @@ System.register(["aurelia-templating", "../dialog-controller"], function (export this.buttons = ['Cancel', 'Ok']; } }; - var UxDialogFooter_1; /** * @internal */ // tslint:disable-next-line:member-ordering UxDialogFooter.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "buttons", void 0); - __decorate([ - aurelia_templating_1.bindable - ], UxDialogFooter.prototype, "useDefaultButtons", void 0); - UxDialogFooter = UxDialogFooter_1 = __decorate([ - aurelia_templating_1.customElement('ux-dialog-footer'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogFooter); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] + }; return UxDialogFooter; }()); exports_1("UxDialogFooter", UxDialogFooter); diff --git a/dist/system/resources/ux-dialog-header.d.ts b/dist/system/resources/ux-dialog-header.d.ts index ace0ab8..1d3aa8e 100644 --- a/dist/system/resources/ux-dialog-header.d.ts +++ b/dist/system/resources/ux-dialog-header.d.ts @@ -2,6 +2,9 @@ import { ComponentBind } from 'aurelia-templating'; import { DialogController } from '../dialog-controller'; export declare class UxDialogHeader implements ComponentBind { controller: DialogController; + /** + * @bindable + */ showCloseButton: boolean | undefined; constructor(controller: DialogController); bind(): void; diff --git a/dist/system/resources/ux-dialog-header.js b/dist/system/resources/ux-dialog-header.js index 35dc9e5..da24066 100644 --- a/dist/system/resources/ux-dialog-header.js +++ b/dist/system/resources/ux-dialog-header.js @@ -1,18 +1,9 @@ -System.register(["aurelia-templating", "../dialog-controller"], function (exports_1, context_1) { +System.register(["../dialog-controller"], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; - var aurelia_templating_1, dialog_controller_1, UxDialogHeader; + var dialog_controller_1, UxDialogHeader; var __moduleName = context_1 && context_1.id; return { setters: [ - function (aurelia_templating_1_1) { - aurelia_templating_1 = aurelia_templating_1_1; - }, function (dialog_controller_1_1) { dialog_controller_1 = dialog_controller_1_1; } @@ -32,13 +23,19 @@ System.register(["aurelia-templating", "../dialog-controller"], function (export */ // tslint:disable-next-line:member-ordering UxDialogHeader.inject = [dialog_controller_1.DialogController]; - __decorate([ - aurelia_templating_1.bindable() - ], UxDialogHeader.prototype, "showCloseButton", void 0); - UxDialogHeader = __decorate([ - aurelia_templating_1.customElement('ux-dialog-header'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialogHeader); + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$view = ""; + /** + * @internal + */ + // tslint:disable-next-line:member-ordering + UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] + }; return UxDialogHeader; }()); exports_1("UxDialogHeader", UxDialogHeader); diff --git a/dist/system/resources/ux-dialog.js b/dist/system/resources/ux-dialog.js index f4c9a13..8448d52 100644 --- a/dist/system/resources/ux-dialog.js +++ b/dist/system/resources/ux-dialog.js @@ -1,27 +1,21 @@ -System.register(["aurelia-templating"], function (exports_1, context_1) { +System.register([], function (exports_1, context_1) { "use strict"; - var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) { - var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d; - if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc); - else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r; - return c > 3 && r && Object.defineProperty(target, key, r), r; - }; - var aurelia_templating_1, UxDialog; + var UxDialog; var __moduleName = context_1 && context_1.id; return { - setters: [ - function (aurelia_templating_1_1) { - aurelia_templating_1 = aurelia_templating_1_1; - } - ], + setters: [], execute: function () { UxDialog = /** @class */ (function () { function UxDialog() { } - UxDialog = __decorate([ - aurelia_templating_1.customElement('ux-dialog'), - aurelia_templating_1.inlineView("\n \n") - ], UxDialog); + /** + * @internal + */ + UxDialog.$view = ""; + /** + * @internal + */ + UxDialog.$resource = 'ux-dialog'; return UxDialog; }()); exports_1("UxDialog", UxDialog); diff --git a/dist/umd/aurelia-dialog.js b/dist/umd/aurelia-dialog.js new file mode 100644 index 0000000..d915bec --- /dev/null +++ b/dist/umd/aurelia-dialog.js @@ -0,0 +1,664 @@ +(function (global, factory) { + typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('aurelia-pal'), require('aurelia-dependency-injection'), require('aurelia-templating')) : + typeof define === 'function' && define.amd ? define(['exports', 'aurelia-pal', 'aurelia-dependency-injection', 'aurelia-templating'], factory) : + (global = global || self, factory(global.dialog = {}, global.au, global.au, global.au)); +}(this, function (exports, aureliaPal, aureliaDependencyInjection, aureliaTemplating) { 'use strict'; + + class Renderer { + getDialogContainer() { + throw new Error('DialogRenderer must implement getDialogContainer().'); + } + showDialog(dialogController) { + throw new Error('DialogRenderer must implement showDialog().'); + } + hideDialog(dialogController) { + throw new Error('DialogRenderer must implement hideDialog().'); + } + } + + class DefaultDialogSettings { + constructor() { + this.lock = true; + this.startingZIndex = 1000; + this.centerHorizontalOnly = false; + this.rejectOnCancel = false; + this.ignoreTransitions = false; + } + } + + const containerTagName = 'ux-dialog-container'; + const overlayTagName = 'ux-dialog-overlay'; + const transitionEvent = (() => { + let transition; + return () => { + if (transition) { + return transition; + } + const el = aureliaPal.DOM.createElement('fakeelement'); + const transitions = { + transition: 'transitionend', + OTransition: 'oTransitionEnd', + MozTransition: 'transitionend', + WebkitTransition: 'webkitTransitionEnd' + }; + for (let t in transitions) { + if (el.style[t] !== undefined) { + transition = transitions[t]; + return transition; + } + } + return ''; + }; + })(); + const hasTransition = (() => { + const unprefixedName = 'transitionDuration'; + const prefixedNames = ['webkitTransitionDuration', 'oTransitionDuration']; + let el; + let transitionDurationName; + return (element) => { + if (!el) { + el = aureliaPal.DOM.createElement('fakeelement'); + if (unprefixedName in el.style) { + transitionDurationName = unprefixedName; + } + else { + transitionDurationName = prefixedNames.find(prefixed => (prefixed in el.style)); + } + } + return !!transitionDurationName && !!(aureliaPal.DOM.getComputedStyle(element)[transitionDurationName] + .split(',') + .find((duration) => !!parseFloat(duration))); + }; + })(); + let body; + function getActionKey(e) { + if ((e.code || e.key) === 'Escape' || e.keyCode === 27) { + return 'Escape'; + } + if ((e.code || e.key) === 'Enter' || e.keyCode === 13) { + return 'Enter'; + } + return undefined; + } + class DialogRenderer { + static keyboardEventHandler(e) { + const key = getActionKey(e); + if (!key) { + return; + } + const top = DialogRenderer.dialogControllers[DialogRenderer.dialogControllers.length - 1]; + if (!top || !top.settings.keyboard) { + return; + } + const keyboard = top.settings.keyboard; + if (key === 'Escape' + && (keyboard === true || keyboard === key || (Array.isArray(keyboard) && keyboard.indexOf(key) > -1))) { + top.cancel(); + } + else if (key === 'Enter' && (keyboard === key || (Array.isArray(keyboard) && keyboard.indexOf(key) > -1))) { + top.ok(); + } + } + static trackController(dialogController) { + if (!DialogRenderer.dialogControllers.length) { + aureliaPal.DOM.addEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); + } + DialogRenderer.dialogControllers.push(dialogController); + } + static untrackController(dialogController) { + const i = DialogRenderer.dialogControllers.indexOf(dialogController); + if (i !== -1) { + DialogRenderer.dialogControllers.splice(i, 1); + } + if (!DialogRenderer.dialogControllers.length) { + aureliaPal.DOM.removeEventListener(dialogController.settings.keyEvent || 'keyup', DialogRenderer.keyboardEventHandler, false); + } + } + getOwnElements(parent, selector) { + const elements = parent.querySelectorAll(selector); + const own = []; + for (let i = 0; i < elements.length; i++) { + if (elements[i].parentElement === parent) { + own.push(elements[i]); + } + } + return own; + } + attach(dialogController) { + const spacingWrapper = aureliaPal.DOM.createElement('div'); + spacingWrapper.appendChild(this.anchor); + this.dialogContainer = aureliaPal.DOM.createElement(containerTagName); + this.dialogContainer.appendChild(spacingWrapper); + this.dialogOverlay = aureliaPal.DOM.createElement(overlayTagName); + const zIndex = typeof dialogController.settings.startingZIndex === 'number' + ? dialogController.settings.startingZIndex + '' + : null; + this.dialogOverlay.style.zIndex = zIndex; + this.dialogContainer.style.zIndex = zIndex; + const lastContainer = this.getOwnElements(this.host, containerTagName).pop(); + if (lastContainer && lastContainer.parentElement) { + this.host.insertBefore(this.dialogContainer, lastContainer.nextSibling); + this.host.insertBefore(this.dialogOverlay, lastContainer.nextSibling); + } + else { + this.host.insertBefore(this.dialogContainer, this.host.firstChild); + this.host.insertBefore(this.dialogOverlay, this.host.firstChild); + } + dialogController.controller.attached(); + this.host.classList.add('ux-dialog-open'); + } + detach(dialogController) { + this.host.removeChild(this.dialogOverlay); + this.host.removeChild(this.dialogContainer); + dialogController.controller.detached(); + if (!DialogRenderer.dialogControllers.length) { + this.host.classList.remove('ux-dialog-open'); + } + } + setAsActive() { + this.dialogOverlay.classList.add('active'); + this.dialogContainer.classList.add('active'); + } + setAsInactive() { + this.dialogOverlay.classList.remove('active'); + this.dialogContainer.classList.remove('active'); + } + setupClickHandling(dialogController) { + this.stopPropagation = e => { e._aureliaDialogHostClicked = true; }; + this.closeDialogClick = e => { + if (dialogController.settings.overlayDismiss && !e._aureliaDialogHostClicked) { + dialogController.cancel(); + } + }; + this.dialogContainer.addEventListener('click', this.closeDialogClick); + this.anchor.addEventListener('click', this.stopPropagation); + } + clearClickHandling() { + this.dialogContainer.removeEventListener('click', this.closeDialogClick); + this.anchor.removeEventListener('click', this.stopPropagation); + } + centerDialog() { + const child = this.dialogContainer.children[0]; + const vh = Math.max(aureliaPal.DOM.querySelectorAll('html')[0].clientHeight, window.innerHeight || 0); + child.style.marginTop = Math.max((vh - child.offsetHeight) / 2, 30) + 'px'; + child.style.marginBottom = Math.max((vh - child.offsetHeight) / 2, 30) + 'px'; + } + awaitTransition(setActiveInactive, ignore) { + return new Promise(resolve => { + const renderer = this; + const eventName = transitionEvent(); + function onTransitionEnd(e) { + if (e.target !== renderer.dialogContainer) { + return; + } + renderer.dialogContainer.removeEventListener(eventName, onTransitionEnd); + resolve(); + } + if (ignore || !hasTransition(this.dialogContainer)) { + resolve(); + } + else { + this.dialogContainer.addEventListener(eventName, onTransitionEnd); + } + setActiveInactive(); + }); + } + getDialogContainer() { + return this.anchor || (this.anchor = aureliaPal.DOM.createElement('div')); + } + showDialog(dialogController) { + if (!body) { + body = aureliaPal.DOM.querySelectorAll('body')[0]; + } + if (dialogController.settings.host) { + this.host = dialogController.settings.host; + } + else { + this.host = body; + } + const settings = dialogController.settings; + this.attach(dialogController); + if (typeof settings.position === 'function') { + settings.position(this.dialogContainer, this.dialogOverlay); + } + else if (!settings.centerHorizontalOnly) { + this.centerDialog(); + } + DialogRenderer.trackController(dialogController); + this.setupClickHandling(dialogController); + return this.awaitTransition(() => this.setAsActive(), dialogController.settings.ignoreTransitions); + } + hideDialog(dialogController) { + this.clearClickHandling(); + DialogRenderer.untrackController(dialogController); + return this.awaitTransition(() => this.setAsInactive(), dialogController.settings.ignoreTransitions) + .then(() => { this.detach(dialogController); }); + } + } + DialogRenderer.dialogControllers = []; + aureliaDependencyInjection.transient()(DialogRenderer); + + const defaultRenderer = DialogRenderer; + const resources = { + 'ux-dialog': () => Promise.resolve().then(function () { return uxDialog; }).then(m => m.UxDialog), + 'ux-dialog-header': () => Promise.resolve().then(function () { return uxDialogHeader; }).then(m => m.UxDialogHeader), + 'ux-dialog-body': () => Promise.resolve().then(function () { return uxDialogBody; }).then(m => m.UxDialogBody), + 'ux-dialog-footer': () => Promise.resolve().then(function () { return uxDialogFooter; }).then(m => m.UxDialogFooter), + 'attach-focus': () => Promise.resolve().then(function () { return attachFocus; }).then(m => m.AttachFocus) + }; + const defaultCSSText = `ux-dialog-container,ux-dialog-overlay{position:fixed;top:0;right:0;bottom:0;left:0}ux-dialog-overlay{opacity:0}ux-dialog-overlay.active{opacity:1}ux-dialog-container{display:block;transition:opacity .2s linear;opacity:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch}ux-dialog-container.active{opacity:1}ux-dialog-container>div{padding:30px}ux-dialog-container>div>div{display:block;min-width:300px;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;margin:auto}ux-dialog-container,ux-dialog-container>div,ux-dialog-container>div>div{outline:0}ux-dialog{display:table;box-shadow:0 5px 15px rgba(0,0,0,.5);border:1px solid rgba(0,0,0,.2);border-radius:5px;padding:3px;min-width:300px;width:-moz-fit-content;width:-webkit-fit-content;width:fit-content;height:-moz-fit-content;height:-webkit-fit-content;height:fit-content;margin:auto;border-image-source:initial;border-image-slice:initial;border-image-width:initial;border-image-outset:initial;border-image-repeat:initial;background:#fff}ux-dialog>ux-dialog-header{display:block;padding:16px;border-bottom:1px solid #e5e5e5}ux-dialog>ux-dialog-header>button{float:right;border:none;display:block;width:32px;height:32px;background:0 0;font-size:22px;line-height:16px;margin:-14px -16px 0 0;padding:0;cursor:pointer}ux-dialog>ux-dialog-body{display:block;padding:16px}ux-dialog>ux-dialog-footer{display:block;padding:6px;border-top:1px solid #e5e5e5;text-align:right}ux-dialog>ux-dialog-footer button{color:#333;background-color:#fff;padding:6px 12px;font-size:14px;text-align:center;white-space:nowrap;vertical-align:middle;-ms-touch-action:manipulation;touch-action:manipulation;cursor:pointer;background-image:none;border:1px solid #ccc;border-radius:4px;margin:5px 0 5px 5px}ux-dialog>ux-dialog-footer button:disabled{cursor:default;opacity:.45}ux-dialog>ux-dialog-footer button:hover:enabled{color:#333;background-color:#e6e6e6;border-color:#adadad}.ux-dialog-open{overflow:hidden}`; + class DialogConfiguration { + constructor(frameworkConfiguration, applySetter) { + this.renderer = defaultRenderer; + this.cssText = defaultCSSText; + this.resources = []; + this.fwConfig = frameworkConfiguration; + this.settings = this.fwConfig.container.get(DefaultDialogSettings); + applySetter(() => this._apply()); + } + _apply() { + this.fwConfig.transient(Renderer, this.renderer); + if (this.cssText) { + aureliaPal.DOM.injectStyles(this.cssText); + } + if (this.resources.length) { + return Promise.all(this.resources.map(name => resources[name]())) + .then(modules => { this.fwConfig.globalResources(modules); }); + } + } + useDefaults() { + return this.useRenderer(defaultRenderer) + .useCSS(defaultCSSText) + .useStandardResources(); + } + useStandardResources() { + return this.useResource('ux-dialog') + .useResource('ux-dialog-header') + .useResource('ux-dialog-body') + .useResource('ux-dialog-footer') + .useResource('attach-focus'); + } + useResource(resourceName) { + this.resources.push(resourceName); + return this; + } + useRenderer(renderer, settings) { + this.renderer = renderer; + if (settings) { + Object.assign(this.settings, settings); + } + return this; + } + useCSS(cssText) { + this.cssText = cssText; + return this; + } + } + + function createDialogCancelError(output) { + const error = new Error('Operation cancelled.'); + error.wasCancelled = true; + error.output = output; + return error; + } + + function invokeLifecycle(instance, name, model) { + if (typeof instance[name] === 'function') { + return new Promise(resolve => { + resolve(instance[name](model)); + }).then(result => { + if (result !== null && result !== undefined) { + return result; + } + return true; + }); + } + return Promise.resolve(true); + } + + function createDialogCloseError(output) { + const error = new Error(); + error.wasCancelled = false; + error.output = output; + return error; + } + + class DialogController { + constructor(renderer, settings, resolve, reject) { + this.resolve = resolve; + this.reject = reject; + this.settings = settings; + this.renderer = renderer; + } + releaseResources(result) { + return invokeLifecycle(this.controller.viewModel || {}, 'deactivate', result) + .then(() => this.renderer.hideDialog(this)) + .then(() => { this.controller.unbind(); }); + } + cancelOperation() { + if (!this.settings.rejectOnCancel) { + return { wasCancelled: true }; + } + throw createDialogCancelError(); + } + ok(output) { + return this.close(true, output); + } + cancel(output) { + return this.close(false, output); + } + error(output) { + const closeError = createDialogCloseError(output); + return this.releaseResources(closeError).then(() => { this.reject(closeError); }); + } + close(ok, output) { + if (this.closePromise) { + return this.closePromise; + } + const dialogResult = { wasCancelled: !ok, output }; + return this.closePromise = invokeLifecycle(this.controller.viewModel || {}, 'canDeactivate', dialogResult) + .catch(reason => { + this.closePromise = undefined; + return Promise.reject(reason); + }).then(canDeactivate => { + if (!canDeactivate) { + this.closePromise = undefined; + return this.cancelOperation(); + } + return this.releaseResources(dialogResult).then(() => { + if (!this.settings.rejectOnCancel || ok) { + this.resolve(dialogResult); + } + else { + this.reject(createDialogCancelError(output)); + } + return { wasCancelled: false }; + }).catch(reason => { + this.closePromise = undefined; + return Promise.reject(reason); + }); + }); + } + } + DialogController.inject = [Renderer]; + + function whenClosed(onfulfilled, onrejected) { + return this.then(r => r.wasCancelled ? r : r.closeResult).then(onfulfilled, onrejected); + } + function asDialogOpenPromise(promise) { + promise.whenClosed = whenClosed; + return promise; + } + class DialogService { + constructor(container, compositionEngine, defaultSettings) { + this.controllers = []; + this.hasOpenDialog = false; + this.hasActiveDialog = false; + this.container = container; + this.compositionEngine = compositionEngine; + this.defaultSettings = defaultSettings; + } + validateSettings(settings) { + if (!settings.viewModel && !settings.view) { + throw new Error('Invalid Dialog Settings. You must provide "viewModel", "view" or both.'); + } + } + createCompositionContext(childContainer, host, settings) { + return { + container: childContainer.parent, + childContainer, + bindingContext: null, + viewResources: null, + model: settings.model, + view: settings.view, + viewModel: settings.viewModel, + viewSlot: new aureliaTemplating.ViewSlot(host, true), + host + }; + } + ensureViewModel(compositionContext) { + if (typeof compositionContext.viewModel === 'object') { + return Promise.resolve(compositionContext); + } + return this.compositionEngine.ensureViewModel(compositionContext); + } + _cancelOperation(rejectOnCancel) { + if (!rejectOnCancel) { + return { wasCancelled: true }; + } + throw createDialogCancelError(); + } + composeAndShowDialog(compositionContext, dialogController) { + if (!compositionContext.viewModel) { + compositionContext.bindingContext = { controller: dialogController }; + } + return this.compositionEngine.compose(compositionContext).then((controller) => { + dialogController.controller = controller; + return dialogController.renderer.showDialog(dialogController).then(() => { + this.controllers.push(dialogController); + this.hasActiveDialog = this.hasOpenDialog = !!this.controllers.length; + }, reason => { + if (controller.viewModel) { + invokeLifecycle(controller.viewModel, 'deactivate'); + } + return Promise.reject(reason); + }); + }); + } + createSettings(settings) { + settings = Object.assign({}, this.defaultSettings, settings); + if (typeof settings.keyboard !== 'boolean' && !settings.keyboard) { + settings.keyboard = !settings.lock; + } + if (typeof settings.overlayDismiss !== 'boolean') { + settings.overlayDismiss = !settings.lock; + } + Object.defineProperty(settings, 'rejectOnCancel', { + writable: false, + configurable: true, + enumerable: true + }); + this.validateSettings(settings); + return settings; + } + open(settings = {}) { + settings = this.createSettings(settings); + const childContainer = settings.childContainer || this.container.createChild(); + let resolveCloseResult; + let rejectCloseResult; + const closeResult = new Promise((resolve, reject) => { + resolveCloseResult = resolve; + rejectCloseResult = reject; + }); + const dialogController = childContainer.invoke(DialogController, [settings, resolveCloseResult, rejectCloseResult]); + childContainer.registerInstance(DialogController, dialogController); + closeResult.then(() => { + removeController(this, dialogController); + }, () => { + removeController(this, dialogController); + }); + const compositionContext = this.createCompositionContext(childContainer, dialogController.renderer.getDialogContainer(), dialogController.settings); + const openResult = this.ensureViewModel(compositionContext).then(compositionContext => { + if (!compositionContext.viewModel) { + return true; + } + return invokeLifecycle(compositionContext.viewModel, 'canActivate', dialogController.settings.model); + }).then(canActivate => { + if (!canActivate) { + return this._cancelOperation(dialogController.settings.rejectOnCancel); + } + return this.composeAndShowDialog(compositionContext, dialogController) + .then(() => ({ controller: dialogController, closeResult, wasCancelled: false })); + }); + return asDialogOpenPromise(openResult); + } + closeAll() { + return Promise.all(this.controllers.slice(0).map(controller => { + if (!controller.settings.rejectOnCancel) { + return controller.cancel().then(result => { + if (result.wasCancelled) { + return controller; + } + return null; + }); + } + return controller.cancel().then(() => null).catch(reason => { + if (reason.wasCancelled) { + return controller; + } + throw reason; + }); + })).then(unclosedControllers => unclosedControllers.filter(unclosed => !!unclosed)); + } + } + DialogService.inject = [aureliaDependencyInjection.Container, aureliaTemplating.CompositionEngine, DefaultDialogSettings]; + function removeController(service, dialogController) { + const i = service.controllers.indexOf(dialogController); + if (i !== -1) { + service.controllers.splice(i, 1); + service.hasActiveDialog = service.hasOpenDialog = !!service.controllers.length; + } + } + + function configure(frameworkConfig, callback) { + let applyConfig = null; + const config = new DialogConfiguration(frameworkConfig, (apply) => { applyConfig = apply; }); + if (typeof callback === 'function') { + callback(config); + } + else { + config.useDefaults(); + } + return applyConfig(); + } + + class UxDialog { + } + UxDialog.$view = ``; + UxDialog.$resource = 'ux-dialog'; + + var uxDialog = /*#__PURE__*/Object.freeze({ + UxDialog: UxDialog + }); + + class UxDialogHeader { + constructor(controller) { + this.controller = controller; + } + bind() { + if (typeof this.showCloseButton !== 'boolean') { + this.showCloseButton = !this.controller.settings.lock; + } + } + } + UxDialogHeader.inject = [DialogController]; + UxDialogHeader.$view = ``; + UxDialogHeader.$resource = { + name: 'ux-dialog-header', + bindables: ['showCloseButton'] + }; + + var uxDialogHeader = /*#__PURE__*/Object.freeze({ + UxDialogHeader: UxDialogHeader + }); + + class UxDialogBody { + } + UxDialogBody.$view = ``; + UxDialogBody.$resource = 'ux-dialog-body'; + + var uxDialogBody = /*#__PURE__*/Object.freeze({ + UxDialogBody: UxDialogBody + }); + + class UxDialogFooter { + constructor(controller) { + this.controller = controller; + this.buttons = []; + this.useDefaultButtons = false; + } + static isCancelButton(value) { + return value === 'Cancel'; + } + close(buttonValue) { + if (UxDialogFooter.isCancelButton(buttonValue)) { + this.controller.cancel(buttonValue); + } + else { + this.controller.ok(buttonValue); + } + } + useDefaultButtonsChanged(newValue) { + if (newValue) { + this.buttons = ['Cancel', 'Ok']; + } + } + } + UxDialogFooter.inject = [DialogController]; + UxDialogFooter.$view = ``; + UxDialogFooter.$resource = { + name: 'ux-dialog-footer', + bindables: ['buttons', 'useDefaultButtons'] + }; + + var uxDialogFooter = /*#__PURE__*/Object.freeze({ + UxDialogFooter: UxDialogFooter + }); + + class AttachFocus { + constructor(element) { + this.element = element; + this.value = true; + } + static inject() { + return [aureliaPal.DOM.Element]; + } + attached() { + if (this.value === '' || (this.value && this.value !== 'false')) { + this.element.focus(); + } + } + } + AttachFocus.$resource = { + type: 'attribute', + name: 'attach-focus' + }; + + var attachFocus = /*#__PURE__*/Object.freeze({ + AttachFocus: AttachFocus + }); + + exports.configure = configure; + exports.DefaultDialogSettings = DefaultDialogSettings; + exports.DialogConfiguration = DialogConfiguration; + exports.Renderer = Renderer; + exports.createDialogCancelError = createDialogCancelError; + exports.DialogService = DialogService; + exports.DialogController = DialogController; + + Object.defineProperty(exports, '__esModule', { value: true }); + +})); diff --git a/doc/CHANGELOG.md b/doc/CHANGELOG.md index dfaffcd..7aa2830 100644 --- a/doc/CHANGELOG.md +++ b/doc/CHANGELOG.md @@ -1,3 +1,20 @@ + +# [2.0.0-rc.4](https://github.com/aurelia/dialog/compare/2.0.0-rc.3...2.0.0-rc.4) (2019-01-19) + + +### Bug Fixes + +* **build:** add umd build to build script ([0c46fdc](https://github.com/aurelia/dialog/commit/0c46fdc)) +* **build:** update rollup dep, config ([0c9e029](https://github.com/aurelia/dialog/commit/0c9e029)) +* **doc:** fix html5 syntax ([629ad1c](https://github.com/aurelia/dialog/commit/629ad1c)), closes [/github.com/aurelia/templating/pull/647#issuecomment-427989601](https://github.com//github.com/aurelia/templating/pull/647/issues/issuecomment-427989601) + + +### Features + +* **keyboard:** allow to configure keyevent type ([3aad34f](https://github.com/aurelia/dialog/commit/3aad34f)) + + + # [2.0.0-rc.3](https://github.com/aurelia/dialog/compare/2.0.0-rc.2...2.0.0-rc.3) (2018-08-22) diff --git a/package.json b/package.json index aa740a4..5299f45 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "aurelia-dialog", - "version": "2.0.0-rc.3", + "version": "2.0.0-rc.4", "description": "A dialog plugin for Aurelia.", "keywords": [ "aurelia",