@coolon/angular-ui-powerups 11.0.0-alpha.16 → 11.0.0-alpha.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (121) hide show
  1. package/assets/table.scss +6 -13
  2. package/bundles/coolon-angular-ui-powerups.umd.js +97 -193
  3. package/bundles/coolon-angular-ui-powerups.umd.js.map +1 -1
  4. package/bundles/coolon-angular-ui-powerups.umd.min.js +1 -1
  5. package/bundles/coolon-angular-ui-powerups.umd.min.js.map +1 -1
  6. package/coolon-angular-ui-powerups.metadata.json +1 -1
  7. package/esm2015/lib/components/card-container/card-container.component.js +1 -1
  8. package/esm2015/lib/components/card-container/card-container.component.metadata.json +1 -1
  9. package/esm2015/lib/components/commands/command/command.component.js +1 -5
  10. package/esm2015/lib/components/commands/command/command.component.js.map +1 -1
  11. package/esm2015/lib/components/commands/command/command.component.metadata.json +1 -1
  12. package/esm2015/lib/components/components.module.js +3 -0
  13. package/esm2015/lib/components/components.module.js.map +1 -1
  14. package/esm2015/lib/components/components.module.metadata.json +1 -1
  15. package/esm2015/lib/components/components.module.ngfactory.js.map +1 -1
  16. package/esm2015/lib/components/table/column-model.js +1 -2
  17. package/esm2015/lib/components/table/column-model.js.map +1 -1
  18. package/esm2015/lib/components/table/column-model.metadata.json +1 -1
  19. package/esm2015/lib/components/table/table-cell-renderer/table-cell-renderer.component.js.map +1 -1
  20. package/esm2015/lib/components/table/table-cell-renderer/table-cell-renderer.component.metadata.json +1 -1
  21. package/esm2015/lib/components/table/table-model.js +0 -9
  22. package/esm2015/lib/components/table/table-model.js.map +1 -1
  23. package/esm2015/lib/components/table/table-model.metadata.json +1 -1
  24. package/esm2015/lib/components/table/table.component.js +3 -30
  25. package/esm2015/lib/components/table/table.component.js.map +1 -1
  26. package/esm2015/lib/components/table/table.component.metadata.json +1 -1
  27. package/esm2015/lib/components/track-by.js +1 -5
  28. package/esm2015/lib/components/track-by.js.map +1 -1
  29. package/esm2015/lib/components/tree-table/decorated-tree-node.js +22 -19
  30. package/esm2015/lib/components/tree-table/decorated-tree-node.js.map +1 -1
  31. package/esm2015/lib/components/tree-table/tree-table-component.js +4 -21
  32. package/esm2015/lib/components/tree-table/tree-table-component.js.map +1 -1
  33. package/esm2015/lib/components/tree-table/tree-table-component.metadata.json +1 -1
  34. package/esm2015/lib/place/components/abstract-place-navigation.component.js +11 -21
  35. package/esm2015/lib/place/components/abstract-place-navigation.component.js.map +1 -1
  36. package/esm2015/lib/place/components/abstract-place-navigation.component.metadata.json +1 -1
  37. package/esm2015/lib/place/components/list-place-nav/list-place-nav.component.js +1 -1
  38. package/esm2015/lib/place/components/list-place-nav/list-place-nav.component.js.map +1 -1
  39. package/esm2015/lib/place/components/list-place-nav/list-place-nav.component.metadata.json +1 -1
  40. package/esm2015/lib/place/components/place-outlet/place-outlet.component.js +14 -23
  41. package/esm2015/lib/place/components/place-outlet/place-outlet.component.js.map +1 -1
  42. package/esm2015/lib/place/components/place-outlet/place-outlet.component.metadata.json +1 -1
  43. package/esm2015/lib/place/components/side-place-navigation/side-place-navigation.component.js +1 -1
  44. package/esm2015/lib/place/components/side-place-navigation/side-place-navigation.component.js.map +1 -1
  45. package/esm2015/lib/place/components/side-place-navigation/side-place-navigation.component.metadata.json +1 -1
  46. package/esm2015/lib/place/components/tabbed-place-navigation/tabbed-place-navigation.component.js +1 -1
  47. package/esm2015/lib/place/components/tabbed-place-navigation/tabbed-place-navigation.component.js.map +1 -1
  48. package/esm2015/lib/place/components/tabbed-place-navigation/tabbed-place-navigation.component.metadata.json +1 -1
  49. package/esm2015/lib/place/exports.js +0 -1
  50. package/esm2015/lib/place/exports.js.map +1 -1
  51. package/esm2015/lib/place/exports.metadata.json +1 -1
  52. package/esm2015/lib/place/guards/place.guard.js +8 -5
  53. package/esm2015/lib/place/guards/place.guard.js.map +1 -1
  54. package/esm2015/lib/place/navigation/place-component-deactivation-handler.js +0 -2
  55. package/esm2015/lib/place/navigation/place-component-deactivation-handler.js.map +1 -1
  56. package/esm2015/lib/place/place-component.js +3 -1
  57. package/esm2015/lib/place/place-component.js.map +1 -1
  58. package/esm2015/lib/place/place-component.metadata.json +1 -1
  59. package/esm2015/lib/place/place-router.js +4 -15
  60. package/esm2015/lib/place/place-router.js.map +1 -1
  61. package/esm2015/lib/place/place-router.metadata.json +1 -1
  62. package/esm2015/lib/place/place.module.js +2 -6
  63. package/esm2015/lib/place/place.module.js.map +1 -1
  64. package/esm2015/lib/place/place.module.metadata.json +1 -1
  65. package/esm2015/lib/place/place.module.ngfactory.js.map +1 -1
  66. package/fesm2015/coolon-angular-ui-powerups.js +79 -173
  67. package/fesm2015/coolon-angular-ui-powerups.js.map +1 -1
  68. package/lib/components/commands/command/command.component.d.ts +1 -2
  69. package/lib/components/table/column-model.d.ts +0 -1
  70. package/lib/components/table/table-model.d.ts +0 -9
  71. package/lib/components/table/table.component.d.ts +6 -24
  72. package/lib/components/track-by.d.ts +1 -3
  73. package/lib/components/tree-table/tree-table-component.d.ts +0 -9
  74. package/lib/place/components/abstract-place-navigation.component.d.ts +2 -9
  75. package/lib/place/components/place-outlet/place-outlet.component.d.ts +3 -10
  76. package/lib/place/exports.d.ts +0 -1
  77. package/lib/place/place-component.d.ts +1 -1
  78. package/lib/place/place-router.d.ts +6 -10
  79. package/package.json +1 -1
  80. package/schematics/aup-i18n/index.js +28 -8
  81. package/schematics/aup-i18n/index.js.map +1 -1
  82. package/schematics/aup-i18n/templates/i18n/aup/components.yml.template +69 -0
  83. package/schematics/bootstrap-app/index.js +4 -5
  84. package/schematics/bootstrap-app/index.js.map +1 -1
  85. package/schematics/bootstrap-app/templates/{i18n.config.json.template → i18n/config.json.template} +0 -2
  86. package/schematics/bootstrap-app/templates/i18n/notifications.yml.template +19 -0
  87. package/schematics/ng-add/index.js +2 -2
  88. package/schematics/ng-add/index.js.map +1 -1
  89. package/schematics/place-add/index.js +5 -4
  90. package/schematics/place-add/index.js.map +1 -1
  91. package/schematics/place-add/templates/component/__name@dasherize__.component.ts.template +1 -3
  92. package/schematics/place-add/templates/files/i18n/places/__name@dasherize__.yml.template +7 -0
  93. package/schematics/utils/build-context.d.ts +5 -4
  94. package/schematics/utils/workspace.d.ts +4 -3
  95. package/schematics/utils/workspace.js.map +1 -1
  96. package/esm2015/lib/place/components/not-authorised-notice/not-authorised-notice.component.js +0 -14
  97. package/esm2015/lib/place/components/not-authorised-notice/not-authorised-notice.component.js.map +0 -1
  98. package/esm2015/lib/place/components/not-authorised-notice/not-authorised-notice.component.metadata.json +0 -1
  99. package/esm2015/lib/place/components/not-authorised-notice/not-authorised-notice.component.ngfactory.js.map +0 -1
  100. package/esm2015/lib/place/components/not-authorised-notice/not-authorised-notice.component.scss.shim.ngstyle.js.map +0 -1
  101. package/lib/place/components/not-authorised-notice/not-authorised-notice.component.d.ts +0 -3
  102. package/schematics/aup-i18n/templates/app/aup.i18n.yml.template +0 -80
  103. package/schematics/place-add/templates/component/__name@dasherize__.i18n.yml.template +0 -5
  104. /package/schematics/bootstrap-app/templates/{src/app → app}/app-routing.module.ts.template +0 -0
  105. /package/schematics/bootstrap-app/templates/{src/app → app}/app.component.html.template +0 -0
  106. /package/schematics/bootstrap-app/templates/{src/app → app}/app.component.scss.template +0 -0
  107. /package/schematics/bootstrap-app/templates/{src/app → app}/app.component.ts.template +0 -0
  108. /package/schematics/bootstrap-app/templates/{src/app → app}/app.module.ts.template +0 -0
  109. /package/schematics/bootstrap-app/templates/{src/app → app}/i18n.ts.template +0 -0
  110. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.eot +0 -0
  111. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.ijmap +0 -0
  112. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.svg +0 -0
  113. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.ttf +0 -0
  114. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.woff +0 -0
  115. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/MaterialIcons-Regular.woff2 +0 -0
  116. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/README.md +0 -0
  117. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/codepoints +0 -0
  118. /package/schematics/bootstrap-app/templates/{src/assets → assets}/fonts/material-design-icons/material-icons.css +0 -0
  119. /package/schematics/bootstrap-app/templates/{src/index.html.template → index.html.template} +0 -0
  120. /package/schematics/bootstrap-app/templates/{src/styles → styles}/global-variables.scss.template +0 -0
  121. /package/schematics/bootstrap-app/templates/{src/styles.scss.template → styles.scss.template} +0 -0
@@ -25,7 +25,7 @@ import { Memoize } from '@typescript-plus/fast-memoize-decorator/dist/src';
25
25
  import _, { find, filter, each, isNil, isEqual } from 'lodash';
26
26
  import { Enum } from 'typescript-string-enums';
27
27
  import ResizeObserver from 'resize-observer-polyfill';
28
- import { assert as assert$1, Stringy, Mixin, Opts, lang as lang$1, Klass } from '@coolon/typescript-utilities';
28
+ import { assert as assert$1, Mixin, Opts, lang as lang$1, Klass } from '@coolon/typescript-utilities';
29
29
  import produce from 'immer';
30
30
  import { FlexModule, GridModule } from '@angular/flex-layout';
31
31
  import { MatDialogModule, MatDialog, MAT_DIALOG_DEFAULT_OPTIONS, MatDialogConfig } from '@angular/material/dialog';
@@ -520,7 +520,7 @@ CardContainerComponent.decorators = [
520
520
  { type: Component, args: [{
521
521
  selector: 'aup-card-container',
522
522
  template: "<div class=\"card-container\">\n <ng-content></ng-content>\n\n <div class=\"add-card-container\" *ngIf=\"addCardCommand.enabled.value\" [pectinCommand]=\"addCardCommand\">\n <aup-command-face *ngIf=\"addCardFace\" [faces]=\"[addCardFace]\"></aup-command-face>\n <aup-icon *ngIf=\"!addCardFace\" icon=\"mat:add\"></aup-icon>\n </div>\n\n <div class=\"add-card-template\" *ngIf=\"addCardTemplate\">\n <ng-container [ngTemplateOutlet]=\"addCardTemplate\"></ng-container>\n </div>\n\n</div>\n",
523
- styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:repeat(auto-fill,var(--resolved-card-width));grid-auto-rows:minmax(var(--resolved-card-min-height),var(--resolved-card-height));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap));max-width:100%}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-container:hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
523
+ styles: [":host{--resolved-card-gap:var(--card-gap,16px);--resolved-card-width:var(--card-width,300px);--resolved-card-height:var(--card-height,auto);--resolved-card-min-height:var(--card-min-height,auto);--resolved-card-background:var(--card-background,#fcfcfb);flex:1;display:block;background:var(--resolved-card-background)}.card-container{display:grid;grid-template-columns:repeat(auto-fill,var(--resolved-card-width));grid-template-rows:repeat(auto-fit,minmax(var(--resolved-card-min-height),var(--resolved-card-height)));grid-gap:var(--resolved-card-gap);box-sizing:border-box;padding:var(--resolved-card-gap);min-height:calc(var(--resolved-card-height) + 2 * var(--resolved-card-gap));min-width:calc(var(--resolved-card-width) + 2 * var(--resolved-card-gap));width:calc((var(--resolved-card-width) + var(--resolved-card-gap)) * 2 + var(--grid-gap));max-width:100%}.add-card-container{width:var(--resolved-card-width);height:var(--resolved-card-height);min-height:var(--resolved-card-min-height);display:flex;flex-direction:column;align-items:center;justify-content:center;box-sizing:border-box;border:2px dashed rgba(0,0,0,.1);border-radius:6px;font-weight:300;cursor:pointer;color:rgba(0,0,0,.54);background-color:hsla(0,0%,100%,.8);transition:all .28s cubic-bezier(.4,0,.2,1)}.add-card-container mat-icon{font-size:200%}.add-card-container:hover{transition:box-shadow .28s cubic-bezier(.4,0,.2,1);transition:all .28s cubic-bezier(.4,0,.2,1);border-color:transparent;background-color:#fff;color:rgba(0,0,0,.54)}.add-card-container:hover:hover{box-shadow:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12)}.add-card-template-container{width:var(--resolved-card-width);height:var(--resolved-card-height);display:flex;flex-direction:column;align-items:stretch;justify-content:stretch}"]
524
524
  },] }
525
525
  ];
526
526
  CardContainerComponent.ctorParameters = () => [];
@@ -641,9 +641,6 @@ class CommandComponent extends PopupAwareComponent {
641
641
  this.activeFace = this.faces.first();
642
642
  this.buttonStyle = chain(this.activeFace).map(f => CommandFace.getStyleOf(f));
643
643
  this.colorModel = chain(this.activeFace).map(f => CommandFace.getColorOf(f));
644
- this.iconOnly = this.faces.select(face => {
645
- return _.isEmpty(CommandFace.getTextOf(face)) && !_.isEmpty(CommandFace.getIconOf(face));
646
- }).count().equals(this.faces.count());
647
644
  }
648
645
  isActive(face) {
649
646
  return this.activeFace.query().equals(face);
@@ -660,7 +657,7 @@ class CommandComponent extends PopupAwareComponent {
660
657
  CommandComponent.decorators = [
661
658
  { type: Component, args: [{
662
659
  selector: 'aup-command',
663
- template: "<ng-container *ngIf=\"iconOnly.value\">\n <button mat-icon-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n</ng-container>\n<ng-container *ngIf=\"!iconOnly.value\">\n <ng-container [ngSwitch]=\"buttonStyle.value\">\n <ng-container *ngSwitchCase=\"CommandFace.Style.STROKED\">\n <button mat-stroked-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"CommandFace.Style.RAISED\">\n <button mat-raised-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n </ng-container>\n</ng-container>\n",
660
+ template: "<ng-container [ngSwitch]=\"buttonStyle.value\">\n <ng-container *ngSwitchCase=\"CommandFace.Style.STROKED\">\n <button mat-stroked-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchCase=\"CommandFace.Style.RAISED\">\n <button mat-raised-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n <ng-container *ngSwitchDefault>\n <button mat-button [pectinCommand]=\"command\" [color]=\"colorModel.value\" [class.busy]=\"command.busy.value\">\n <aup-command-face class=\"centered\" [faces]=\"faces.value\"></aup-command-face>\n </button>\n </ng-container>\n</ng-container>\n",
664
661
  styles: [":host{display:inline-flex;flex-direction:row;justify-content:stretch}button{flex:1}"]
665
662
  },] }
666
663
  ];
@@ -821,11 +818,7 @@ __decorate([
821
818
 
822
819
  var TrackBy;
823
820
  (function (TrackBy) {
824
- TrackBy.byIndex = (index, item) => index;
825
- function trackByProperty(property) {
826
- return (index, item) => item[property];
827
- }
828
- TrackBy.trackByProperty = trackByProperty;
821
+ TrackBy.byIndex = (data, index) => index;
829
822
  })(TrackBy || (TrackBy = {}));
830
823
 
831
824
  class CommandContainer extends GarbageCollector {
@@ -2162,7 +2155,6 @@ class ColumnModel {
2162
2155
  this._flex = false;
2163
2156
  this._visibleModel = new DelegatingValueModel().withDefault(true);
2164
2157
  this.installHeaderRenderer();
2165
- this.dasherisedColumnId = Stringy.from(columnId).dasherize().toString();
2166
2158
  }
2167
2159
  installHeaderRenderer() {
2168
2160
  this.cellHeaderRenderer(DefaultHeaderCellRendererComponent, (component, column) => {
@@ -2705,32 +2697,15 @@ AbstractTableModel = __decorate([
2705
2697
  *
2706
2698
  * Styling
2707
2699
  * @example
2708
- * // global settings
2709
- * :root {
2710
- * --aup-table-column-gap: 10px; // defaults to 24px
2711
- * --aup-table-row-hover-background-color, rgba(0, 0, 0, 0.05)
2712
- * --aup-table-row-selected-background-color: rebeccapurple; // defaults to transparent
2713
- * --aup-table-first-column-padding-left: 18px // defaults to --column-gap
2714
- * --aup-table-last-column-padding-right: 18px // defaults to --column-gap
2715
- * }
2716
- *
2717
- * // per table settings.
2718
2700
  * aup-table {
2719
2701
  * --column-gap: 10px; // defaults to 24px
2720
2702
  * --row-hover-background-color, rgba(0, 0, 0, 0.05)
2721
2703
  * --row-selected-background-color: rebeccapurple; // defaults to transparent
2722
- * --first-column-padding-left: 18px // defaults to --column-gap
2723
- * --last-column-padding-right: 18px // defaults to --column-gap
2724
- *
2725
- * aup-table-header-cell-renderer,
2726
2704
  * aup-table-cell-renderer {
2727
- * &.aup-col-my-dasherised-column-id {
2728
- * // do stuff
2729
- * }
2730
- * &.first-visible-column {
2705
+ * &:first-column {
2731
2706
  * // do stuff
2732
2707
  * }
2733
- * &.last-visible-column {
2708
+ * &:last-column {
2734
2709
  * // do stuff
2735
2710
  * }
2736
2711
  * }
@@ -2794,21 +2769,11 @@ class TableComponent extends ResizeAwareComponent {
2794
2769
  var _a;
2795
2770
  return ((_a = this.tableModel.lastVisibleColumn.query().value) === null || _a === void 0 ? void 0 : _a.columnId) === columnId;
2796
2771
  }
2797
- getColumnClasses(columnId) {
2798
- const classes = [`aup-col-${this.columnsById.get(columnId).dasherisedColumnId}`];
2799
- if (this.isFirstVisibleColumn(columnId)) {
2800
- classes.push('first-visible-column');
2801
- }
2802
- if (this.isLastVisibleColumn(columnId)) {
2803
- classes.push('last-visible-column');
2804
- }
2805
- return classes;
2806
- }
2807
2772
  }
2808
2773
  TableComponent.decorators = [
2809
2774
  { type: Component, args: [{
2810
2775
  selector: 'aup-table',
2811
- template: "<div class=\"scroll-container\">\n <table mat-table [dataSource]=\"tableModel.dataSource.value\" [trackBy]=\"tableModel.trackBy\">\n\n <ng-container *ngFor=\"let column of columns.value; index as index; first as first; last as last\"\n matColumnDef=\"{{column.columnId}}\">\n <th mat-header-cell *matHeaderCellDef [class.flex]=\"column.isFlex()\" [class.hide]=\"!column.isVisible()\">\n <aup-table-header-cell-renderer [column]=\"column\"\n [attr.column-index]=\"index\"\n [attr.column-id]=\"column.columnId\"\n [class]=\"getColumnClasses(column.columnId)\"\n ></aup-table-header-cell-renderer>\n </th>\n <td mat-cell *matCellDef=\"let row\" (click)=\"notifyCellClicked(column, row)\"\n [class.enable-cursor]=\"tableModel.isCursorEnabled(column)\"\n [class.flex]=\"column.isFlex()\"\n [class.hide]=\"!column.isVisible()\"\n >\n <aup-table-cell-renderer [column]=\"column\"\n [row]=\"row\"\n [tableModel]=\"tableModel\"\n [editSession]=\"tableModel.getEditSessionFor(row)\"\n [attr.column-index]=\"index\"\n [attr.column-id]=\"column.columnId\"\n [class]=\"getColumnClasses(column.columnId)\"\n ></aup-table-cell-renderer>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columnIds.value\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: columnIds.value; let i = index\"\n [ngClass]=\"tableModel.getRowClasses(row)\" [class.enable-hover]=\"tableModel.isHoverEnabled()\"\n [attr.trackBy]=\"tableModel.trackBy(i, row)\"\n ></tr>\n\n </table>\n</div>\n",
2776
+ template: "<div class=\"scroll-container\">\n <table mat-table [dataSource]=\"tableModel.dataSource.value\" [trackBy]=\"tableModel.trackBy\">\n\n <ng-container *ngFor=\"let column of columns.value; index as index; first as first; last as last\"\n matColumnDef=\"{{column.columnId}}\">\n <th mat-header-cell *matHeaderCellDef [class.flex]=\"column.isFlex()\" [class.hide]=\"!column.isVisible()\">\n <aup-table-header-cell-renderer [column]=\"column\"\n [attr.column-index]=\"index\"\n [attr.column-id]=\"column.columnId\"\n [class.first-visible-column]=\"isFirstVisibleColumn(column.columnId)\"\n [class.last-visible-column]=\"isLastVisibleColumn(column.columnId)\"\n ></aup-table-header-cell-renderer>\n </th>\n <td mat-cell *matCellDef=\"let row\" (click)=\"notifyCellClicked(column, row)\"\n [class.enable-cursor]=\"tableModel.isCursorEnabled(column)\"\n [class.flex]=\"column.isFlex()\"\n [class.hide]=\"!column.isVisible()\"\n >\n <aup-table-cell-renderer [column]=\"column\"\n [row]=\"row\"\n [tableModel]=\"tableModel\"\n [editSession]=\"tableModel.getEditSessionFor(row)\"\n [attr.column-index]=\"index\"\n [attr.column-id]=\"column.columnId\"\n [class.first-visible-column]=\"isFirstVisibleColumn(column.columnId)\"\n [class.last-visible-column]=\"isLastVisibleColumn(column.columnId)\"\n ></aup-table-cell-renderer>\n </td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"columnIds.value\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: columnIds.value; let i = index\"\n [ngClass]=\"tableModel.getRowClasses(row)\" [class.enable-hover]=\"tableModel.isHoverEnabled()\"\n [attr.trackBy]=\"tableModel.trackBy(i, row)\"\n ></tr>\n\n </table>\n</div>\n",
2812
2777
  styles: [":host{display:flex;flex-direction:column;align-items:stretch}:host table{width:100%}:host.enable-scrolling{min-height:0}:host.enable-scrolling .scroll-container{flex:1;flex-basis:0;overflow-y:scroll;display:flex;flex-direction:column;align-items:stretch}"]
2813
2778
  },] }
2814
2779
  ];
@@ -3130,26 +3095,26 @@ class DecoratedTreeNodeMixin {
3130
3095
  this.node = node;
3131
3096
  }
3132
3097
  get decoratedSelf() {
3133
- return this.memoize('decoratedSelf', () => {
3098
+ return this.memoize("decoratedSelf", () => {
3134
3099
  return this.parent ? this.parent.children.find(child => child.node === this.node) : DecoratedTreeNode.createRoot(this.node);
3135
3100
  });
3136
3101
  }
3137
3102
  get children() {
3138
- return this.memoize('children', () => {
3103
+ return this.memoize("children", () => {
3139
3104
  return this.node.children ? this.node.children.map(child => {
3140
3105
  return Mixin.createProxy(child, new DecoratedTreeNodeMixin(this.decoratedSelf, child));
3141
3106
  }) : [];
3142
3107
  });
3143
3108
  }
3144
3109
  descendants() {
3145
- return this.memoize('descendants', () => {
3110
+ return this.memoize("descendants", () => {
3146
3111
  const result = [];
3147
3112
  this.visitDescendants(child => result.push(child));
3148
3113
  return result;
3149
3114
  });
3150
3115
  }
3151
3116
  selfAndDescendants() {
3152
- return this.memoize('selfAndDescendants', () => {
3117
+ return this.memoize("selfAndDescendants", () => {
3153
3118
  const result = [];
3154
3119
  this.visitSelfAndDescendants(child => result.push(child));
3155
3120
  return result;
@@ -3212,24 +3177,27 @@ class DecoratedTreeNodeMixin {
3212
3177
  });
3213
3178
  }
3214
3179
  ancestorsAndSelf() {
3215
- return this.memoize('ancestorsAndSelf', () => {
3180
+ return this.memoize("ancestorsAndSelf", () => {
3216
3181
  return this.ancestors().concat([(this.decoratedSelf)]);
3217
3182
  });
3218
3183
  }
3219
3184
  pathToParent(parent) {
3220
- if (this.node === parent.node) {
3221
- return [];
3222
- }
3223
- else if (this.parent) {
3224
- const pathToParent = this.parent.pathToParent(parent);
3225
- return pathToParent.concat([this.parent]);
3226
- }
3227
- else {
3228
- throw new Error('parent is not an ancestor');
3229
- }
3185
+ return this.memoize("pathToParent", () => {
3186
+ if (this.node === parent.node) {
3187
+ return [];
3188
+ }
3189
+ else if (this.parent) {
3190
+ return this.parent.pathToParent(parent).concat([this.parent]);
3191
+ }
3192
+ else {
3193
+ throw new Error('parent is not an ancestor');
3194
+ }
3195
+ });
3230
3196
  }
3231
3197
  pathToParentAndSelf(parent) {
3232
- return this.pathToParent(parent).concat([this.decoratedSelf]);
3198
+ return this.memoize("pathToParentAndSelf", () => {
3199
+ return this.pathToParent(parent).concat([this.decoratedSelf]);
3200
+ });
3233
3201
  }
3234
3202
  isRoot() {
3235
3203
  return !this.parent;
@@ -3241,18 +3209,18 @@ class DecoratedTreeNodeMixin {
3241
3209
  return !this.isRoot() && this.node.children.length < 1;
3242
3210
  }
3243
3211
  hasChildren() {
3244
- return this.node.children && this.node.children.length > 0;
3212
+ return this.node.children.length > 0;
3245
3213
  }
3246
3214
  depthFromParent(parent) {
3247
3215
  return this.pathToParent(parent).length;
3248
3216
  }
3249
3217
  treeDepth() {
3250
- return this.memoize('treeDepth', () => {
3218
+ return this.memoize("treeDepth", () => {
3251
3219
  return 1 + this.descendants().map(child => child.depthFromParent(this)).reduce((prev, current) => Math.max(prev, current));
3252
3220
  });
3253
3221
  }
3254
3222
  flatten() {
3255
- return this.memoize('flatten', () => {
3223
+ return this.memoize("flatten", () => {
3256
3224
  return this.flattenInto([]);
3257
3225
  });
3258
3226
  }
@@ -3586,18 +3554,12 @@ class FlattenStrategy extends SelfAndDescendantsVisitor {
3586
3554
  class TreeTableComponent extends DisposableComponent {
3587
3555
  constructor() {
3588
3556
  super();
3589
- /**
3590
- * Set to true to enable scrolling. Once enabled the table will have 0 implicit height. You will either
3591
- * need to set it explicitly e.g. height: 400px; or by using flex or grid layout to make it fill it's
3592
- * containment area.
3593
- */
3594
- this.enableScrolling = false;
3595
3557
  }
3596
3558
  }
3597
3559
  TreeTableComponent.decorators = [
3598
3560
  { type: Component, args: [{
3599
3561
  selector: "aup-tree-table",
3600
- template: "<aup-table [tableModel]=\"treeTableModel\" [showHeaderModel]=\"showHeaderModel\" [enableScrolling]=\"enableScrolling\"></aup-table>\n",
3562
+ template: "<aup-table [tableModel]=\"treeTableModel\"></aup-table>\n",
3601
3563
  encapsulation: ViewEncapsulation.None // allow us to target nested table styles
3602
3564
  ,
3603
3565
  styles: ["td.mat-cell{border-top-width:0!important;border-bottom-width:0!important}td.mat-column-tree-label{width:1px}aup-table-cell-renderer[column-id=tree-label]{padding-left:8px!important}aup-tree-label-cell-renderer{flex:1}"]
@@ -3605,23 +3567,12 @@ TreeTableComponent.decorators = [
3605
3567
  ];
3606
3568
  TreeTableComponent.ctorParameters = () => [];
3607
3569
  TreeTableComponent.propDecorators = {
3608
- treeTableModel: [{ type: Input }],
3609
- showHeaderModel: [{ type: Input }],
3610
- showHeader: [{ type: Input }],
3611
- enableScrolling: [{ type: Input }, { type: HostBinding, args: ['class.enable-scrolling',] }]
3570
+ treeTableModel: [{ type: Input }]
3612
3571
  };
3613
3572
  __decorate([
3614
3573
  TrackExternal(),
3615
3574
  __metadata("design:type", TreeTableModel)
3616
3575
  ], TreeTableComponent.prototype, "treeTableModel", void 0);
3617
- __decorate([
3618
- TrackExternal({ defaultValue: true }),
3619
- __metadata("design:type", ValueModel)
3620
- ], TreeTableComponent.prototype, "showHeaderModel", void 0);
3621
- __decorate([
3622
- StoreInValueModel('showHeaderModel'),
3623
- __metadata("design:type", Boolean)
3624
- ], TreeTableComponent.prototype, "showHeader", void 0);
3625
3576
 
3626
3577
  class VerticalFocusContainerComponent extends FocusContainerComponent {
3627
3578
  constructor(focusManager) {
@@ -3772,9 +3723,12 @@ ComponentsModule.decorators = [
3772
3723
  TreeTableComponent,
3773
3724
  TreeInheritanceIconComponent,
3774
3725
  TreeLabelCellRendererComponent,
3726
+ IconComponent,
3775
3727
  BusyOverlayComponent,
3776
3728
  EmptyStateComponent,
3777
3729
  PaginatorComponent,
3730
+ IconComponent,
3731
+ IconComponent
3778
3732
  ],
3779
3733
  imports: [
3780
3734
  CommonModule,
@@ -5096,15 +5050,6 @@ SelectInputActivity.decorators = [
5096
5050
  * table.addCustomColumn("fullName", hero => `${hero.firstName} ${hero.lastName}`);
5097
5051
  * });
5098
5052
  *
5099
- * Template columns
5100
- * @example
5101
- * const model = TableModel.fromList(heroList, table => {
5102
- * table.addSelectionColumn(selectionModel); // <- can be single or multiple selection model
5103
- * table.addTemplateColumn("myTemplate");
5104
- * });
5105
- *
5106
- * <div *aupColumnTemplate="let hero; columnId: 'myTemplate'">{{hero.age}}</div>
5107
- *
5108
5053
  * I18n
5109
5054
  * @example
5110
5055
  * [table.yml]
@@ -5436,7 +5381,6 @@ class PlaceComponent extends DisposableComponent {
5436
5381
  this._active = new MutableValueModel(false);
5437
5382
  const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
5438
5383
  when(this._active).becomesTruthy(() => this.onPlaceReady());
5439
- this.childPlaces = this.placeDefinition.children.map(d => d.component);
5440
5384
  }
5441
5385
  // @Trace()
5442
5386
  initialiseVisit(visit, notifyVisitChanged) {
@@ -5479,6 +5423,9 @@ class PlaceComponent extends DisposableComponent {
5479
5423
  get placeDefinition() {
5480
5424
  return PlaceComponent.getDefinition(this.constructor);
5481
5425
  }
5426
+ get childPlaces() {
5427
+ return this.placeDefinition.children.map(d => d.component);
5428
+ }
5482
5429
  get active() {
5483
5430
  return this._active.readonly;
5484
5431
  }
@@ -5540,7 +5487,6 @@ class PlaceComponentDeactivationHandler {
5540
5487
  this.component = component;
5541
5488
  this.navigationSession = navigationSession;
5542
5489
  this.isPrimaryComponent = isPrimaryComponent;
5543
- assert.notNil(component);
5544
5490
  }
5545
5491
  get routerInteractionAdapter() {
5546
5492
  return this.navigationSession.interactionServiceAdapter;
@@ -6636,7 +6582,7 @@ class PlaceRouter extends GarbageCollector {
6636
6582
  .pluck('name')
6637
6583
  .otherwise(idleStateName);
6638
6584
  DebugContext.tag(this._activeVisits, 'PlaceRouter.activeVisits');
6639
- this.state = chain(this._activeVisits).reduce(visits => new PlaceRouter.State(visits));
6585
+ this.activeVisitsByPlaceDefinition = chain(this._activeVisits).indexBy('placeDefinition');
6640
6586
  // TODO: make setup the callbacks in during module initiation to make this testable.
6641
6587
  angularRouter.events.subscribe(event => {
6642
6588
  // Routing event sequence
@@ -6695,6 +6641,9 @@ class PlaceRouter extends GarbageCollector {
6695
6641
  getAuthenticationFailureRedirect(activatedRoute, state) {
6696
6642
  return this.redirections.onAuthenticationFailure(activatedRoute, state);
6697
6643
  }
6644
+ getAuthorisationFailureRedirect(activatedRoute, state) {
6645
+ return this.redirections.onAuthorisationFailure(activatedRoute, state);
6646
+ }
6698
6647
  get navigationSession() {
6699
6648
  return this.navigationSessionModel.value;
6700
6649
  }
@@ -6904,20 +6853,6 @@ PlaceRouter.ctorParameters = () => [
6904
6853
  { type: UrlService },
6905
6854
  { type: PlaceHistory }
6906
6855
  ];
6907
- (function (PlaceRouter) {
6908
- class State {
6909
- constructor(activeVisits) {
6910
- this.activeVisits = activeVisits;
6911
- }
6912
- isPlaceActive(placeDefinition) {
6913
- return !!this.getVisitFor(placeDefinition);
6914
- }
6915
- getVisitFor(placeDefinition) {
6916
- return this.activeVisits.find(v => v.placeDefinition === placeDefinition);
6917
- }
6918
- }
6919
- PlaceRouter.State = State;
6920
- })(PlaceRouter || (PlaceRouter = {}));
6921
6856
 
6922
6857
  class Visit {
6923
6858
  constructor(placeDefinition, visitParameters = {}) {
@@ -6985,19 +6920,6 @@ class Visit {
6985
6920
 
6986
6921
  const AUP_PLACE_CONFIG = new InjectionToken('AUP_PLACE_CONFIG');
6987
6922
 
6988
- class NotAuthorisedNoticeComponent {
6989
- constructor() {
6990
- }
6991
- }
6992
- NotAuthorisedNoticeComponent.decorators = [
6993
- { type: Component, args: [{
6994
- selector: 'aup-not-authorised-notice',
6995
- template: "<p>You are not authorised to access this page</p>\n",
6996
- styles: [":host{display:flex;flex-direction:column;align-items:center;justify-content:center}"]
6997
- },] }
6998
- ];
6999
- NotAuthorisedNoticeComponent.ctorParameters = () => [];
7000
-
7001
6923
  // Freezes the state of the components at the start of the animation.
7002
6924
  const animationStartStyle = style({ position: 'absolute', top: '0', left: '0', bottom: '0', right: '0' });
7003
6925
  const left = [
@@ -7042,14 +6964,12 @@ function leftRightPlaceAnimation(duration) {
7042
6964
  }
7043
6965
  const LEFT_RIGHT_PLACE_ANIMATION = leftRightPlaceAnimation('0.3s');
7044
6966
 
7045
- const AUP_UNAUTHORISED_PLACE_NOTICE_COMPONENT = new InjectionToken('AUP_UNAUTHORISED_PLACE_COMPONENT');
7046
6967
  class PlaceOutletComponent extends DisposableComponent {
7047
- constructor(router, placeRouter, placeConfig, unauthorisedPlaceNotice, parentOutlet, cdr) {
6968
+ constructor(router, placeRouter, placeConfig, parentOutlet) {
7048
6969
  super();
7049
6970
  this.router = router;
7050
6971
  this.placeRouter = placeRouter;
7051
6972
  this.placeConfig = placeConfig;
7052
- this.cdr = cdr;
7053
6973
  this.placeChanged = new EventEmitter();
7054
6974
  this.outletActivated = new MutableValueModel(false);
7055
6975
  this._activatedRouteModel = new MutableValueModel();
@@ -7082,7 +7002,7 @@ class PlaceOutletComponent extends DisposableComponent {
7082
7002
  this.animationEnabled = valueOf.all(this.animateModel, this.animationSupported).areTruthy();
7083
7003
  // Extract our visit model from the place router.
7084
7004
  this._activePlaceDefinition = chain(this._activePlaceModel).pluck('placeDefinition');
7085
- this.routerVisitModel = chain(placeRouter.state).map(state => state.getVisitFor(this._activePlaceDefinition.value), { dependsOn: this._activePlaceDefinition });
7005
+ this.routerVisitModel = this._activePlaceDefinition.findIn(chain(placeRouter.activeVisitsByPlaceDefinition));
7086
7006
  this.navigationInProgress = chain(this.placeRouter.navigationInProgress);
7087
7007
  when(this.navigationInProgress).becomesFalsey(() => {
7088
7008
  this.checkStateAndInitialise();
@@ -7093,11 +7013,13 @@ class PlaceOutletComponent extends DisposableComponent {
7093
7013
  chain(this._activePlaceModel)
7094
7014
  .postponeWhile(this.navigationInProgress)
7095
7015
  .subscribe(place => this.placeChanged.emit(place));
7096
- this.authorised = chain(placeRouter.accessGuard).map(guard => guard.isAuthorised(this._activePlaceDefinition.value), {
7097
- dependsOn: this._activePlaceDefinition,
7098
- postponeWhile: chain(this._activePlaceDefinition).isNil()
7099
- }).otherwise(true); // if we don't have a place def yet we need to show the outlet so we get one injected.
7100
- this.notAuthorisedNoticePortal = new ComponentPortal(unauthorisedPlaceNotice !== null && unauthorisedPlaceNotice !== void 0 ? unauthorisedPlaceNotice : NotAuthorisedNoticeComponent);
7016
+ when(placeRouter.accessGuard).changes(guard => {
7017
+ const activePlace = this._activePlaceModel.value;
7018
+ if (activePlace && !guard.isAuthorised(activePlace.placeDefinition)) {
7019
+ const visit = placeRouter.getAuthorisationFailureRedirect(this._activatedRouteModel.value.snapshot, this.router.routerState.snapshot);
7020
+ this.placeRouter.navigate(visit);
7021
+ }
7022
+ });
7101
7023
  }
7102
7024
  // @Trace()
7103
7025
  ngOnInit() {
@@ -7109,9 +7031,6 @@ class PlaceOutletComponent extends DisposableComponent {
7109
7031
  get animationDuration() {
7110
7032
  return this.placeConfig && this.placeConfig.animationDuration ? this.placeConfig.animationDuration : '500ms';
7111
7033
  }
7112
- get isAuthorised() {
7113
- return this.authorised.value;
7114
- }
7115
7034
  // @Trace()
7116
7035
  navigate(visit) {
7117
7036
  // const place = this.placesInAnimationOrder.query().findMatching(p => visit.placeDefinition.component === p);
@@ -7166,7 +7085,6 @@ class PlaceOutletComponent extends DisposableComponent {
7166
7085
  lang.illegalState('wrong visit!!!');
7167
7086
  }
7168
7087
  this.initialisePlace(routerVisit, activePlace);
7169
- this.cdr.detectChanges();
7170
7088
  }
7171
7089
  }
7172
7090
  initialisePlace(routerVisit, activePlace) {
@@ -7217,18 +7135,16 @@ class PlaceOutletComponent extends DisposableComponent {
7217
7135
  PlaceOutletComponent.decorators = [
7218
7136
  { type: Component, args: [{
7219
7137
  selector: 'aup-place-outlet',
7220
- template: "<ng-container *ngIf=\"animationEnabled.value\">\n <div class=\"router-outlet-container\"\n cdkScrollable\n [@routeAnimations]=\"{value: getAnimationOrder(), params:{duration: animationDuration}}\"\n (@routeAnimations.start)=\"animationStarted()\"\n (@routeAnimations.done)=\"animationDone()\"\n >\n <router-outlet #routerOutlet=\"outlet\"\n (activate)=\"onOutletActivated(routerOutlet, $event)\"\n (deactivate)=\"onOutletDeactivated()\">\n </router-outlet>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"!animationEnabled.value\">\n <div class=\"router-outlet-container\"\n cdkScrollable>\n <router-outlet #routerOutlet=\"outlet\"\n (activate)=\"onOutletActivated(routerOutlet, $event)\"\n (deactivate)=\"onOutletDeactivated()\">\n </router-outlet>\n </div>\n</ng-container>\n\n<div class=\"not-authorised-component-container\" *ngIf=\"!authorised.value\">\n <ng-template [cdkPortalOutlet]=\"notAuthorisedNoticePortal\"></ng-template>\n</div>\n",
7138
+ template: "<ng-container *ngIf=\"animationEnabled.value\">\n <div class=\"router-outlet-container\" cdkScrollable\n [@routeAnimations]=\"{value: getAnimationOrder(), params:{duration: animationDuration}}\"\n (@routeAnimations.start)=\"animationStarted()\"\n (@routeAnimations.done)=\"animationDone()\"\n >\n <router-outlet #routerOutlet=\"outlet\"\n (activate)=\"onOutletActivated(routerOutlet, $event)\"\n (deactivate)=\"onOutletDeactivated()\">\n </router-outlet>\n </div>\n</ng-container>\n\n<ng-container *ngIf=\"!animationEnabled.value\">\n <div class=\"router-outlet-container\" cdkScrollable>\n <router-outlet #routerOutlet=\"outlet\"\n (activate)=\"onOutletActivated(routerOutlet, $event)\"\n (deactivate)=\"onOutletDeactivated()\">\n </router-outlet>\n </div>\n</ng-container>\n\n",
7221
7139
  animations: [LEFT_RIGHT_PLACE_ANIMATION],
7222
- styles: [":host{display:flex;flex-direction:column;min-height:0}:host:not(.authorised) .router-outlet-container{display:none}.router-outlet-container{flex:1;display:block;position:relative;min-height:0;overflow-x:hidden;overflow-y:scroll}router-outlet{display:none}.not-authorised-component-container{flex:1;display:grid;grid-template-columns:1fr;grid-template-rows:1fr}"]
7140
+ styles: [":host{display:flex;flex-direction:column;min-height:0}.router-outlet-container{flex:1;display:block;position:relative;min-height:0;overflow-x:hidden;overflow-y:scroll}router-outlet{display:none}"]
7223
7141
  },] }
7224
7142
  ];
7225
7143
  PlaceOutletComponent.ctorParameters = () => [
7226
7144
  { type: Router },
7227
7145
  { type: PlaceRouter },
7228
7146
  { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [AUP_PLACE_CONFIG,] }] },
7229
- { type: undefined, decorators: [{ type: Optional }, { type: Inject, args: [AUP_UNAUTHORISED_PLACE_NOTICE_COMPONENT,] }] },
7230
- { type: PlaceOutletComponent, decorators: [{ type: SkipSelf }, { type: Optional }] },
7231
- { type: ChangeDetectorRef }
7147
+ { type: PlaceOutletComponent, decorators: [{ type: SkipSelf }, { type: Optional }] }
7232
7148
  ];
7233
7149
  PlaceOutletComponent.propDecorators = {
7234
7150
  animate: [{ type: Input }],
@@ -7236,8 +7152,7 @@ PlaceOutletComponent.propDecorators = {
7236
7152
  customPlaceAnimationOrderModel: [{ type: Input, args: ['placeAnimationOrderModel',] }],
7237
7153
  customPlaceAnimationOrder: [{ type: Input, args: ['placeAnimationOrder',] }],
7238
7154
  placeChanged: [{ type: Output }],
7239
- routerOut: [{ type: ViewChild, args: ['routeOutlet', { static: true },] }],
7240
- isAuthorised: [{ type: HostBinding, args: ["class.authorised",] }]
7155
+ routerOut: [{ type: ViewChild, args: ['routeOutlet', { static: true },] }]
7241
7156
  };
7242
7157
  __decorate([
7243
7158
  StoreInValueModel('animateModel'),
@@ -7261,36 +7176,23 @@ class AbstractPlaceNavigationComponent extends DisposableComponent {
7261
7176
  super();
7262
7177
  this.placeRouter = placeRouter;
7263
7178
  this._activePlaceComponent = new DelegatingValueModel();
7264
- this.trackByPlaceDef = (data) => data.place;
7265
7179
  const { chain, valueOf, before, when, after, observe, switchOn } = Dsl.disposeWith(this);
7266
7180
  this.placeDefinitions = chain(this.placesModel)
7267
7181
  .map(c => PlaceComponent.getDefinition(c))
7268
7182
  .select(d => {
7269
7183
  const guard = placeRouter.accessGuard.value;
7270
- const state = placeRouter.state.value;
7271
- return guard.isAuthorised(d) || state.isPlaceActive(d);
7272
- }, { dependsOn: [placeRouter.accessGuard, placeRouter.state] });
7184
+ return guard.isAuthorised(d);
7185
+ }, { dependsOn: placeRouter.accessGuard });
7273
7186
  this.commandFactory = Command.createFactory((placeDefinition) => {
7274
7187
  this.placeOutlet.navigate(new Visit(placeDefinition));
7275
7188
  });
7276
- when(this.placeOutletModel).changes(outlet => this.handlePlaceOutLetChanged(outlet), { initialValue: "triggerChange" });
7277
- this.activePlaceDefinition = chain(this._activePlaceComponent).pluck('placeDefinition');
7278
- this.menuItems = chain(this.placeDefinitions).map(d => {
7279
- return {
7280
- place: d,
7281
- active: this.activePlaceDefinition.value === d
7282
- };
7283
- }, {
7284
- dependsOn: this.activePlaceDefinition
7189
+ when(this.placeOutletModel).changes(outlet => {
7190
+ // NOTE: this updates during a change cycle and causes our isActiveMethod to return 2 different
7191
+ // values in the one change detection cycle. So instead we delay the update to a different
7192
+ // tick.
7193
+ setTimeout(() => this._activePlaceComponent.setDelegate(outlet ? outlet.activePlaceModel : null));
7285
7194
  });
7286
- // const txo = new TransactionObserver({ verbose: true }).onEvent(e => console.log(e.name, e.payload));
7287
- // txo.observe('this.placesModel', this.placesModel);
7288
- // txo.observe('this.placeDefinitions', this.placeDefinitions);
7289
- // txo.observe('this.activePlaceDefinition', this.activePlaceDefinition);
7290
- // txo.observe('this.menuItems', this.menuItems);
7291
- }
7292
- handlePlaceOutLetChanged(outlet) {
7293
- this._activePlaceComponent.setDelegate(outlet ? outlet.activePlaceModel : null);
7195
+ this.activePlaceDefinition = chain(this._activePlaceComponent).pluck('placeDefinition');
7294
7196
  }
7295
7197
  getNavigationFace(placeDef) {
7296
7198
  const navItem = placeDef.getPlaceData('nav');
@@ -7300,6 +7202,9 @@ class AbstractPlaceNavigationComponent extends DisposableComponent {
7300
7202
  icon: () => navItem && navItem.icon ? navItem.icon() : placeDef.getPlaceData('navIcon', null)
7301
7203
  };
7302
7204
  }
7205
+ isActive(place) {
7206
+ return this.activePlaceDefinition.query().equals(place);
7207
+ }
7303
7208
  ngOnInit() {
7304
7209
  }
7305
7210
  }
@@ -7348,7 +7253,7 @@ class ListPlaceNavComponent extends AbstractPlaceNavigationComponent {
7348
7253
  ListPlaceNavComponent.decorators = [
7349
7254
  { type: Component, args: [{
7350
7255
  selector: 'aup-list-place-nav',
7351
- template: "<mat-nav-list fxFlex>\n <a mat-list-item *ngFor=\"let item of menuItems.value; trackBy: trackByPlaceDef\"\n [pectinCommand]=\"commandFactory.create(item.place)\"\n [class.active]=\"item.active\"\n [matTooltip]=\"getNavigationFace(item.place).tooltip()\">\n <aup-command-face [faces]=\"[getNavigationFace(item.place)]\"></aup-command-face>\n </a>\n</mat-nav-list>\n",
7256
+ template: "<mat-nav-list fxFlex>\n <a mat-list-item *ngFor=\"let placeDefinition of placeDefinitions.value\"\n [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n [class.active]=\"isActive(placeDefinition)\"\n [matTooltip]=\"getNavigationFace(placeDefinition).tooltip()\">\n <aup-command-face [faces]=\"[getNavigationFace(placeDefinition)]\"></aup-command-face>\n </a>\n</mat-nav-list>\n",
7352
7257
  styles: [":host{display:flex;flex-direction:column;--selected-border-color:#838383;--selected-color:inherit;--selected-background:#f1f1f1}mat-nav-list{padding-top:0}a{border-right:2px solid transparent}a.active{border-right:2px solid var(--selected-border-color);background:var(--selected-background);color:var(--selected-color)}"]
7353
7258
  },] }
7354
7259
  ];
@@ -7416,7 +7321,7 @@ class SidePlaceNavigationComponent extends AbstractPlaceNavigationComponent {
7416
7321
  SidePlaceNavigationComponent.decorators = [
7417
7322
  { type: Component, args: [{
7418
7323
  selector: 'aup-side-place-navigation',
7419
- template: "<mat-nav-list>\n <a mat-list-item (click)=\"toggleMenu()\" class=\"home\">\n <aup-icon class=\"collapsed-only\" icon=\"mat:menu\"></aup-icon>\n <aup-icon class=\"expanded-only\" icon=\"mat:arrow_back\"></aup-icon>\n <span class=\"expanded-only\">Menu</span>\n </a>\n <a mat-list-item *ngFor=\"let item of menuItems.value; trackBy: trackByPlaceDef\"\n [pectinCommand]=\"commandFactory.create(item.place)\"\n [class.active]=\"item.active\"\n [matTooltip]=\"getNavigationFace(item.place).tooltip()\">\n <aup-icon *ngIf=\"getNavigationFace(item.place).icon()\" [icon]=\"getNavigationFace(item.place).icon()\"></aup-icon>\n <span class=\"expanded-only\">{{getNavigationFace(item.place).text()}}</span>\n </a>\n <span [style.flex]=\"1\"></span>\n <ng-container *ngIf=\"navEndTemplate\" [ngTemplateOutlet]=\"navEndTemplate\"></ng-container>\n</mat-nav-list>\n",
7324
+ template: "<mat-nav-list>\n <a mat-list-item (click)=\"toggleMenu()\" class=\"home\">\n <aup-icon class=\"collapsed-only\" icon=\"mat:menu\"></aup-icon>\n <aup-icon class=\"expanded-only\" icon=\"mat:arrow_back\"></aup-icon>\n <span class=\"expanded-only\">Menu</span>\n </a>\n <a mat-list-item *ngFor=\"let placeDefinition of placeDefinitions.value\"\n [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n [class.active]=\"isActive(placeDefinition)\"\n [matTooltip]=\"getNavigationFace(placeDefinition).tooltip()\">\n <aup-icon *ngIf=\"getNavigationFace(placeDefinition).icon()\" [icon]=\"getNavigationFace(placeDefinition).icon()\"></aup-icon>\n <span class=\"expanded-only\">{{getNavigationFace(placeDefinition).text()}}</span>\n </a>\n <span [style.flex]=\"1\"></span>\n <ng-container *ngIf=\"navEndTemplate\" [ngTemplateOutlet]=\"navEndTemplate\"></ng-container>\n</mat-nav-list>\n",
7420
7325
  styles: [":host{display:flex;flex-direction:column;--resolved-nav-item-width:var(--nav-width,56px);--resolved-nav-item-height:var(--nav-item-height,var(--resolved-nav-item-width));--resolved-expanded-width:var(--nav-expanded-width,235px);--resolved-color:var(--nav-color,hsla(0,0%,100%,0.9));--resolved-background-color:var(--nav-background-color,#555);width:var(--resolved-nav-item-width);transition:width 125ms linear;background-color:var(--resolved-background-color);color:var(--resolved-color)}:host.expanded{width:var(--resolved-expanded-width);max-width:var(--resolved-expanded-width)}:host-context(.expanded) .expanded-only{max-width:100%}:host-context(.expanded) .collapsed-only{max-width:0}:host-context(.expanded) .mat-list-item aup-icon:not(.collapsed-only){margin-right:12px}:host-context(.expanded) .mat-list-item span{text-wrap:none;white-space:nowrap}.expanded-only{max-width:0;overflow:hidden}.collapsed-only{max-width:100%;overflow:hidden}mat-nav-list{flex:1;display:flex;flex-direction:column}.mat-list-item{width:var(--resolved-nav-item-width);height:var(--resolved-nav-item-height);color:inherit}.mat-list-item.active{background-color:#444}.mat-list-item.home{text-align:left}mat-icon{color:inherit}mat-icon.flip-horizontal{transform:scaleX(-1)}"]
7421
7326
  },] }
7422
7327
  ];
@@ -7436,7 +7341,7 @@ class TabbedPlaceNavigationComponent extends AbstractPlaceNavigationComponent {
7436
7341
  TabbedPlaceNavigationComponent.decorators = [
7437
7342
  { type: Component, args: [{
7438
7343
  selector: 'aup-tabbed-place-navigation',
7439
- template: "<nav mat-tab-nav-bar>\n <a mat-tab-link *ngFor=\"let item of menuItems.value; trackBy: trackByPlaceDef\"\n [pectinCommand]=\"commandFactory.create(item.place)\"\n [active]=\"item.active\"\n [matTooltip]=\"getNavigationFace(item.place).tooltip()\">\n <aup-command-face [faces]=\"[getNavigationFace(item.place)]\"></aup-command-face>\n </a>\n</nav>\n",
7344
+ template: "<nav mat-tab-nav-bar>\n <a mat-tab-link *ngFor=\"let placeDefinition of placeDefinitions.value\"\n [pectinCommand]=\"commandFactory.create(placeDefinition)\"\n [active]=\"isActive(placeDefinition)\"\n [matTooltip]=\"getNavigationFace(placeDefinition).tooltip()\">\n <aup-command-face [faces]=\"[getNavigationFace(placeDefinition)]\"></aup-command-face>\n </a>\n</nav>\n",
7440
7345
  styles: [""]
7441
7346
  },] }
7442
7347
  ];
@@ -7459,16 +7364,14 @@ PlaceModule.decorators = [
7459
7364
  MatIconModule,
7460
7365
  DirectivesModule,
7461
7366
  FlexModule,
7462
- ComponentsModule,
7463
- PortalModule
7367
+ ComponentsModule
7464
7368
  ],
7465
7369
  declarations: [
7466
7370
  PlaceOutletComponent,
7467
7371
  TabbedPlaceNavigationComponent,
7468
7372
  ListPlaceNavComponent,
7469
7373
  SidePlaceNavigationComponent,
7470
- AbstractPlaceNavigationComponent,
7471
- NotAuthorisedNoticeComponent
7374
+ AbstractPlaceNavigationComponent
7472
7375
  ],
7473
7376
  entryComponents: [],
7474
7377
  exports: [
@@ -7771,6 +7674,14 @@ class PlaceGuard {
7771
7674
  }
7772
7675
  return this.createUrlTree(redirectLocation);
7773
7676
  }
7677
+ if (!(this.placeRouter.accessGuard.value ? this.placeRouter.accessGuard.value.isAuthorised(placeDefinition) : true)) {
7678
+ const redirectLocation = this.placeRouter.getAuthorisationFailureRedirect(activatedRoute, state);
7679
+ const nextPlaceDef = this.getPlaceDefinition(redirectLocation);
7680
+ if (!(this.placeRouter.accessGuard.value ? this.placeRouter.accessGuard.value.isAuthorised(nextPlaceDef) : true)) {
7681
+ lang.illegalState(`handleNotAuthorised hook returned place ${nextPlaceDef.component.name} that is not authorised for the current user.`);
7682
+ }
7683
+ return this.createUrlTree(redirectLocation);
7684
+ }
7774
7685
  }
7775
7686
  const result = yield this.cleanInteractionState(activatedRoute, state, () => __awaiter(this, void 0, void 0, function* () {
7776
7687
  // Parse our route params.
@@ -7802,11 +7713,6 @@ class PlaceGuard {
7802
7713
  // @Trace()
7803
7714
  canDeactivate(component, currentRoute, currentState, nextState) {
7804
7715
  return __awaiter(this, void 0, void 0, function* () {
7805
- if (!component) {
7806
- // this happens when the place wasn't authorised and the associated
7807
- // router outlet was removed from the dom.
7808
- return true;
7809
- }
7810
7716
  const currentUrl = this.urlService.parseUrl(currentState.url);
7811
7717
  const nextUrl = this.urlService.parseUrl(nextState.url);
7812
7718
  const result = yield this.placeRouter.navigationSession.canDeactivatePlace(component, currentUrl, nextUrl);
@@ -7971,5 +7877,5 @@ function VisitParameterList(options) {
7971
7877
  * Generated bundle index. Do not edit.
7972
7878
  */
7973
7879
 
7974
- export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AUP_UNAUTHORISED_PLACE_NOTICE_COMPONENT, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractPopupMenuComponent, AbstractTableModel, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityBodyComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, ActivityTitleComponent, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandContainer, CommandDirective, CommandFace, CommandFaceComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DecoratedTreeNode, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlattenStrategy, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, IconComponent, InPlaceInteractionContextComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NotAuthorisedNoticeComponent, NumberInputComponent, POPUP_CONTAINER, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, PaginatorComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceAccessGuard, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupAwareComponent, PopupInteractionContextComponent, PopupMenuComponent, PopupMenuRendererComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SelfAndDescendantsVisitor, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, TreeExpansionModel, TreeInheritanceIconComponent, TreeLabelCellRendererComponent, TreeLabelColumnModel, TreeTableComponent, TreeTableModel, TreeToListModel, UrlService, UrlSnapshot, VerticalFocusContainerComponent, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, ɵ0 };
7880
+ export { ACTIVITY_DATA, AUP_PLACE_CONFIG, AbstractInputActivity, AbstractInputComponent, AbstractInteractionContext, AbstractListInputComponent, AbstractPlaceNavigationComponent, AbstractPopStateNavigation, AbstractPopupMenuComponent, AbstractTableModel, AbstractValueInputComponent, Activity, ActivityActionsComponent, ActivityBodyComponent, ActivityContainerComponent, ActivityOutletComponent, ActivityRef, ActivityTitleComponent, AddItemInteractionContextComponent, AlertDialogComponent, AngularUiPowerupsModule, AutocompleteInputComponent, Bounds, BusyOverlayComponent, CELL_EDITOR_PORTAL, CELL_RENDERER_PORTAL, CardContainerComponent, CellEditorPortalRef, CellHeaderPortalRef, CellPortalRef, CellRendererPortalRef, CheckboxInputComponent, ColumnModel, ColumnTemplateDirective, CommandComponent, CommandContainer, CommandDirective, CommandFace, CommandFaceComponent, ComponentCellRendererPortalRef, ComponentsModule, ConfirmThenDialogComponent, ConfirmationDialogComponent, ConsolidatedParameterMap, CustomTemplateColumnModel, CustomValueColumnModel, DEFINITION_META_DATA_KEY, DIALOG_INTERACTION_SERVICE_DEFAULTS, DecoratedTreeNode, DefaultCellRendererComponent, DefaultHeaderCellRendererComponent, DialogInteractionContext, DialogInteractionContextFactory, Dimension, DirectivesModule, DisposableComponent, EditRowControls, EditSession, EditorControlColumnModel, EmptyStateComponent, EventCleanUpSession, FlattenStrategy, FlexComponent, FocusBinding, FocusBindingDirective, FocusBindingFactory, FocusContainerComponent, FocusableComponent, Formatter, HEADER_CELL_RENDERER_PORTAL, IconComponent, InPlaceInteractionContextComponent, InteractionContextTriggerFor, InteractionModule, InteractionService, InteractionServiceRoutingAdapter, LEFT_RIGHT_PLACE_ANIMATION, ListPlaceNavComponent, ListPropertyColumnModel, ModalInteractionContextFactory, MoreMenuComponent, MultipleSelectInputComponent, Navigating, NavigatingDuringInteraction, NavigationContext, NavigationSession, NoopAuthGuard, NoopComponent, NumberInputComponent, POPUP_CONTAINER, PORTAL_EDITOR_COMPONENT, PORTAL_RENDERER_COMPONENT, PaginatorComponent, ParameterDefinition, PasswordInputComponent, Place, PlaceAccessGuard, PlaceComponent, PlaceComponentDeactivationHandler, PlaceDefinition, PlaceGuard, PlaceHistory, PlaceModule, PlaceOutletComponent, PlaceRouter, Point, PopStateDuringInteractionNavigation, PopStateNavigation, PopupAwareComponent, PopupInteractionContextComponent, PopupMenuComponent, PopupMenuRendererComponent, PropertyColumnModel, ROUTE_PARAMETER_LIST_KEY, RemoveLastInteractionFromUrlNavigationSession, ResizeAwareComponent, RouteId, ScrollContainerComponent, SectionHeaderComponent, SelectCellRendererComponent, SelectHeaderCellRendererComponent, SelectInputActivity, SelectInputComponent, SelectionColumnModel, SelfAndDescendantsVisitor, SeparatorComponent, SidePlaceNavigationComponent, StringInputActivity, StringInputComponent, SwitchCaseComponent, SwitchCaseDefaultDirective, SwitchCaseOption, SwitchCaseWhenDirective, SynchroniseInteractionContextIdsWithRoute, TabbedPlaceNavigationComponent, TableCellRendererComponent, TableComponent, TableHeaderCellRendererComponent, TableModel, TableRowMenuComponent, TemplateCellRendererPortalRef, TextInputComponent, ToolBarComponent, TrackBy, TreeExpansionModel, TreeInheritanceIconComponent, TreeLabelCellRendererComponent, TreeLabelColumnModel, TreeTableComponent, TreeTableModel, TreeToListModel, UrlService, UrlSnapshot, VerticalFocusContainerComponent, Visit, VisitParameter, VisitParameterList, VisitSanitiser, WaitUntilLeavingInteractionTransitionCancelled, WaitUntilLinkTriggeredNavigationInteractionCancellationTypeDetermined, WaitUntilPopStateDuringCanDeactivateInteractionFinishes, leftRightPlaceAnimation, slideDownOnEnterAnimation, slideRightOnEnterAnimation, ɵ0 };
7975
7881
  //# sourceMappingURL=coolon-angular-ui-powerups.js.map