@trudb/tru-common-lib 0.2.100 → 0.2.102

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.
@@ -5100,6 +5100,7 @@ class TruCardColumn {
5100
5100
  modelTypeLookup;
5101
5101
  searchViewEventHandler;
5102
5102
  searchResultViewManager;
5103
+ changeDetectorRef;
5103
5104
  config;
5104
5105
  name;
5105
5106
  portal;
@@ -5143,11 +5144,12 @@ class TruCardColumn {
5143
5144
  columnFilterTooltip = '';
5144
5145
  cardFilterTooltip = '';
5145
5146
  columnDropdownFilterTooltip = '';
5146
- constructor(dataContext, modelTypeLookup, searchViewEventHandler, searchResultViewManager) {
5147
+ constructor(dataContext, modelTypeLookup, searchViewEventHandler, searchResultViewManager, changeDetectorRef) {
5147
5148
  this.dataContext = dataContext;
5148
5149
  this.modelTypeLookup = modelTypeLookup;
5149
5150
  this.searchViewEventHandler = searchViewEventHandler;
5150
5151
  this.searchResultViewManager = searchResultViewManager;
5152
+ this.changeDetectorRef = changeDetectorRef;
5151
5153
  }
5152
5154
  parentTableModel = null; //dataService.model.tables[parentTableName];
5153
5155
  createDataForEntity = (entity) => {
@@ -5551,6 +5553,8 @@ class TruCardColumn {
5551
5553
  localStorage.setItem('scroll_position' + this.uniqueId, columnElement.scrollLeft);
5552
5554
  this.dataContext.revert();
5553
5555
  this.portal.nativeElement.classList.remove('tru-card-portal-disabled');
5556
+ this.updateItemsSource(this.cards, true);
5557
+ this.changeDetectorRef.detectChanges();
5554
5558
  });
5555
5559
  }
5556
5560
  else {
@@ -5558,6 +5562,8 @@ class TruCardColumn {
5558
5562
  var columnElement = this.portal.nativeElement.querySelectorAll('.tru-card-portal-columns')[0];
5559
5563
  localStorage.setItem('scroll_position' + this.uniqueId, columnElement.scrollLeft);
5560
5564
  this.dataContext.revert();
5565
+ this.updateItemsSource(this.cards, true);
5566
+ this.changeDetectorRef.detectChanges();
5561
5567
  }
5562
5568
  }
5563
5569
  return true;
@@ -5613,7 +5619,7 @@ class TruCardColumn {
5613
5619
  card.cardElement.classList.remove('tru-card-selected');
5614
5620
  //scope.config.onSelectionChanged(selectedCards);
5615
5621
  };
5616
- static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TruCardColumn, deps: [{ token: TruDataContext }, { token: TruModelTypeLookup }, { token: TruSearchViewEventHandler }, { token: TruSearchResultViewManager }], target: i0.ɵɵFactoryTarget.Component });
5622
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TruCardColumn, deps: [{ token: TruDataContext }, { token: TruModelTypeLookup }, { token: TruSearchViewEventHandler }, { token: TruSearchResultViewManager }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
5617
5623
  static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.3", type: TruCardColumn, isStandalone: true, selector: "tru-card-column", inputs: { config: "config", name: "name" }, viewQueries: [{ propertyName: "portal", first: true, predicate: ["cardPortal"], descendants: true }], ngImport: i0, template: "<div class=\"tru-card\">\r\n <div *ngIf=\"isBusy\"\r\n class=\"tru-card-busy-indicator\">\r\n <p>{{busyMessage}}</p>\r\n </div>\r\n <tru-toolbar>\r\n <ng-container *ngTemplateOutlet=\"parentToolbarTemplate\"></ng-container>\r\n <tru-toolbar-separator></tru-toolbar-separator>\r\n <tru-toolbar-dropdown\r\n [tooltip]=\"columnFilterTooltip\"\r\n (selectionChange)=\"filterColumns($event)\"\r\n [options]=\"columnFilterChoices\"\r\n [multiple]=\"true\"\r\n [filterable]=\"true\"\r\n [filterTooltip]=\"columnDropdownFilterTooltip\"\r\n [width]=\"150\">\r\n </tru-toolbar-dropdown>\r\n <tru-toolbar-textbox\r\n [tooltip]=\"cardFilterTooltip\"\r\n (valueChange)=\"filterCards($event)\"\r\n [width]=\"150\">\r\n </tru-toolbar-textbox>\r\n <tru-toolbar-separator *ngIf=\"viewMenuItems.length\"></tru-toolbar-separator>\r\n <div *ngIf=\"viewMenuItems.length\">\r\n <tru-toolbar-menu *ngFor=\"let viewMenuItem of viewMenuItems\" [config]=\"viewMenuItem\"></tru-toolbar-menu>\r\n </div>\r\n </tru-toolbar>\r\n <div class=\"tru-card-portal\" #cardPortal>\r\n <div [ngStyle]=\"{'width': ((config.width * lockedColumns.length) + (10 * lockedColumns.length - 1)) + 'px' }\"\r\n [ngClass]=\"{'tru-card-portal-locked-columns-divider': lockedColumns.length}\"\r\n *ngIf=\"lockedColumns.length\"\r\n class=\"tru-card-portal-locked-columns locked-columns\">\r\n </div>\r\n <div [ngStyle]=\"{'left': lockedColumns.length ? ((config.width * lockedColumns.length) + (10 * lockedColumns.length - 1) + 22) + 'px' : 0 }\"\r\n class=\"tru-card-portal-columns unlocked-columns\">\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .tru-card-busy-indicator{position:absolute;inset:25px 0 0;z-index:10000;background-color:transparent}::ng-deep .tru-card-busy-indicator p{position:relative;float:left;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff}::ng-deep .tru-card-filter{position:absolute;top:0;left:0;right:0;height:30px;line-height:30px;padding-left:10px}::ng-deep .tru-card-portal{position:absolute;inset:30px 10px 10px;border:1px solid #ddd;padding:10px;background-color:#0079bf}::ng-deep .tru-card-portal-disabled>*{opacity:.75;pointer-events:none}::ng-deep .tru-card-portal-locked-columns{position:absolute;top:10px;left:0;bottom:0;padding:0 5px 10px 10px;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start}::ng-deep .tru-card-portal-locked-columns .tru-card-portal-column{margin-left:0;margin-bottom:0}::ng-deep .tru-card-portal-locked-columns .tru-card-portal-column:not(:first-child){margin-left:10px!important}::ng-deep .tru-card-portal-locked-columns-divider{border-right:1px solid #cdd2d4}::ng-deep .tru-card-portal-columns{position:absolute;inset:10px 10px 0 222px;padding-top:0;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start;overflow-x:auto;overflow-y:hidden}::ng-deep .tru-card-portal-column{position:relative;border:1px solid #ddd;border-radius:4px;background:#e2e4e6;vertical-align:top;max-height:calc(100% - 10px);margin-left:10px;margin-bottom:10px;display:flex;flex-direction:column}::ng-deep .tru-card-portal-column-inactive *{font-style:italic;opacity:.7}::ng-deep .tru-card-portal-column-header{flex:0 0 auto;padding:5px;position:relative;min-height:18px}::ng-deep .tru-card-portal-column-header-extras{position:absolute;right:5px;top:4px}::ng-deep .tru-card-portal-column-header-extra-button{border-radius:3px;background:transparent}::ng-deep .tru-card-portal-column-header-extra-button:hover{border-radius:3px;background:#cdd2d4}::ng-deep .tru-card-portal-column-header-extra-button input[type=checkbox]{height:14px;width:14px}::ng-deep .tru-card-portal-column-footer{flex:0 0 auto;padding:0 3px 3px;position:relative;height:25px;line-height:25px;display:none}::ng-deep .tru-card-portal-column-footer-text{font-size:14px;color:#777;padding-left:5px;text-decoration:none}::ng-deep .tru-card-portal-column-footer-text:hover{text-decoration:underline;color:#777}::ng-deep .tru-card-portal-column-footer-text:active,::ng-deep .tru-card-portal-column-footer-text:visited{color:#777}::ng-deep .tru-card-icon-small{color:#999;height:18px;font-size:14px;line-height:18px;width:19px;-webkit-font-smoothing:antialiased;display:inline-block!important;font-style:normal;font-weight:400;text-align:center;text-decoration:none;position:relative;width:14px;height:14px}::ng-deep .tru-card-portal-column-headertext{font-weight:700;font-size:16px;color:#333;padding-left:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:20px;cursor:pointer}::ng-deep .tru-card-portal-column-headertext-hover:hover{text-decoration:underline}::ng-deep .tru-card-portal-card-scroll-port{overflow-y:auto;overflow-x:hidden}::ng-deep .tru-card-portal-card-container{margin:0 3px;padding:0 2px;height:30px;transition:all .4s ease-out;opacity:1}::ng-deep .tru-card-portal-card-container.show{opacity:1}::ng-deep .tru-card-portal-card-container *{pointer-events:none}::ng-deep .tru-card-portal-card{background-color:#fff;border:1px solid #fff;border-radius:3px;padding:2px 6px 2px 8px;position:relative;cursor:pointer;display:block;min-height:15px;text-decoration:none;z-index:0;outline:none;box-shadow:0 .5px #ccc}::ng-deep .tru-card-portal-card:hover{background-color:#efefef;border:1px solid #efefef}::ng-deep .tru-card-portal-card p{font-size:12px;word-wrap:break-word}::ng-deep .tru-card-portal-card:focus{outline:none}::ng-deep .tru-card-portal-card.empty{border:1px dashed #999}::ng-deep .tru-card-placeholder{position:absolute;left:0;right:0;margin:0;z-index:100;border-color:#0079bf;border-top-style:dashed;border-bottom-style:dashed}::ng-deep .tru-card-selected{border-color:#52a8eccc!important;background-color:#52a8eccc!important}::ng-deep .tru-card-selected p{color:#000!important;font-size:12px}::ng-deep .tru-card-menu{position:absolute;top:20px;right:0;background:#fff;border:1px #ccc solid;border-radius:3px;z-index:1;padding:7px;width:200px}::ng-deep .tru-card-menu hr{height:1px;border:1px #ccc solid;border-bottom:0;border-left:0;border-right:0;width:100%;margin:0;padding:0}::ng-deep .tru-card-menu a{color:#777;text-decoration:none;float:left;line-height:16px;margin-top:2px;margin-bottom:2px}::ng-deep .tru-card-menu span{color:#777;float:left;line-height:16px;margin-top:3px}::ng-deep .tru-card-menu a:hover{text-decoration:underline;color:#777}::ng-deep .tru-card-menu a:active,::ng-deep .tru-card-menu a:visited{color:#777}::ng-deep .tru-card-menu-move-container{width:100%!important;display:inline-flex}::ng-deep .tru-card-menu-move-container select{width:100%!important}::ng-deep .tru-card-menu-move-container a{margin-top:1px;margin-left:3px;display:block}::ng-deep .tru-card-menu-move-container span{color:#0079bf;margin-top:0}::ng-deep .tru-card-menu-move-container .move-button-disabled{pointer-events:none;opacity:.75}::ng-deep .tru-card-menu-move-container .move-button-disabled span{color:#ccc}::ng-deep .tru-card-portal-column-filtered{display:none}::ng-deep .tru-card-portal-card-filtered{display:none}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "ngmodule", type: FormsModule }, { kind: "component", type: TruToolbar, selector: "tru-toolbar", inputs: ["config"] }, { kind: "component", type: TruToolbarMenu, selector: "tru-toolbar-menu", inputs: ["config"] }, { kind: "component", type: TruToolbarDropdown, selector: "tru-toolbar-dropdown", inputs: ["config", "options", "tooltip", "multiple", "filterable", "filterTooltip", "width", "selectedOption", "disabled"], outputs: ["selectedOptionChange", "selectionChange"] }, { kind: "component", type: TruToolbarSeparator, selector: "tru-toolbar-separator" }, { kind: "component", type: TruToolbarTextbox, selector: "tru-toolbar-textbox", inputs: ["config", "tooltip", "value", "width"], outputs: ["valueChange"] }] });
5618
5624
  }
5619
5625
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImport: i0, type: TruCardColumn, decorators: [{
@@ -5629,7 +5635,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.3", ngImpor
5629
5635
  TruToolbarSeparator,
5630
5636
  TruToolbarTextbox
5631
5637
  ], template: "<div class=\"tru-card\">\r\n <div *ngIf=\"isBusy\"\r\n class=\"tru-card-busy-indicator\">\r\n <p>{{busyMessage}}</p>\r\n </div>\r\n <tru-toolbar>\r\n <ng-container *ngTemplateOutlet=\"parentToolbarTemplate\"></ng-container>\r\n <tru-toolbar-separator></tru-toolbar-separator>\r\n <tru-toolbar-dropdown\r\n [tooltip]=\"columnFilterTooltip\"\r\n (selectionChange)=\"filterColumns($event)\"\r\n [options]=\"columnFilterChoices\"\r\n [multiple]=\"true\"\r\n [filterable]=\"true\"\r\n [filterTooltip]=\"columnDropdownFilterTooltip\"\r\n [width]=\"150\">\r\n </tru-toolbar-dropdown>\r\n <tru-toolbar-textbox\r\n [tooltip]=\"cardFilterTooltip\"\r\n (valueChange)=\"filterCards($event)\"\r\n [width]=\"150\">\r\n </tru-toolbar-textbox>\r\n <tru-toolbar-separator *ngIf=\"viewMenuItems.length\"></tru-toolbar-separator>\r\n <div *ngIf=\"viewMenuItems.length\">\r\n <tru-toolbar-menu *ngFor=\"let viewMenuItem of viewMenuItems\" [config]=\"viewMenuItem\"></tru-toolbar-menu>\r\n </div>\r\n </tru-toolbar>\r\n <div class=\"tru-card-portal\" #cardPortal>\r\n <div [ngStyle]=\"{'width': ((config.width * lockedColumns.length) + (10 * lockedColumns.length - 1)) + 'px' }\"\r\n [ngClass]=\"{'tru-card-portal-locked-columns-divider': lockedColumns.length}\"\r\n *ngIf=\"lockedColumns.length\"\r\n class=\"tru-card-portal-locked-columns locked-columns\">\r\n </div>\r\n <div [ngStyle]=\"{'left': lockedColumns.length ? ((config.width * lockedColumns.length) + (10 * lockedColumns.length - 1) + 22) + 'px' : 0 }\"\r\n class=\"tru-card-portal-columns unlocked-columns\">\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["::ng-deep .tru-card-busy-indicator{position:absolute;inset:25px 0 0;z-index:10000;background-color:transparent}::ng-deep .tru-card-busy-indicator p{position:relative;float:left;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff}::ng-deep .tru-card-filter{position:absolute;top:0;left:0;right:0;height:30px;line-height:30px;padding-left:10px}::ng-deep .tru-card-portal{position:absolute;inset:30px 10px 10px;border:1px solid #ddd;padding:10px;background-color:#0079bf}::ng-deep .tru-card-portal-disabled>*{opacity:.75;pointer-events:none}::ng-deep .tru-card-portal-locked-columns{position:absolute;top:10px;left:0;bottom:0;padding:0 5px 10px 10px;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start}::ng-deep .tru-card-portal-locked-columns .tru-card-portal-column{margin-left:0;margin-bottom:0}::ng-deep .tru-card-portal-locked-columns .tru-card-portal-column:not(:first-child){margin-left:10px!important}::ng-deep .tru-card-portal-locked-columns-divider{border-right:1px solid #cdd2d4}::ng-deep .tru-card-portal-columns{position:absolute;inset:10px 10px 0 222px;padding-top:0;display:flex;flex-direction:column;flex-wrap:wrap;align-content:flex-start;overflow-x:auto;overflow-y:hidden}::ng-deep .tru-card-portal-column{position:relative;border:1px solid #ddd;border-radius:4px;background:#e2e4e6;vertical-align:top;max-height:calc(100% - 10px);margin-left:10px;margin-bottom:10px;display:flex;flex-direction:column}::ng-deep .tru-card-portal-column-inactive *{font-style:italic;opacity:.7}::ng-deep .tru-card-portal-column-header{flex:0 0 auto;padding:5px;position:relative;min-height:18px}::ng-deep .tru-card-portal-column-header-extras{position:absolute;right:5px;top:4px}::ng-deep .tru-card-portal-column-header-extra-button{border-radius:3px;background:transparent}::ng-deep .tru-card-portal-column-header-extra-button:hover{border-radius:3px;background:#cdd2d4}::ng-deep .tru-card-portal-column-header-extra-button input[type=checkbox]{height:14px;width:14px}::ng-deep .tru-card-portal-column-footer{flex:0 0 auto;padding:0 3px 3px;position:relative;height:25px;line-height:25px;display:none}::ng-deep .tru-card-portal-column-footer-text{font-size:14px;color:#777;padding-left:5px;text-decoration:none}::ng-deep .tru-card-portal-column-footer-text:hover{text-decoration:underline;color:#777}::ng-deep .tru-card-portal-column-footer-text:active,::ng-deep .tru-card-portal-column-footer-text:visited{color:#777}::ng-deep .tru-card-icon-small{color:#999;height:18px;font-size:14px;line-height:18px;width:19px;-webkit-font-smoothing:antialiased;display:inline-block!important;font-style:normal;font-weight:400;text-align:center;text-decoration:none;position:relative;width:14px;height:14px}::ng-deep .tru-card-portal-column-headertext{font-weight:700;font-size:16px;color:#333;padding-left:3px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-right:20px;cursor:pointer}::ng-deep .tru-card-portal-column-headertext-hover:hover{text-decoration:underline}::ng-deep .tru-card-portal-card-scroll-port{overflow-y:auto;overflow-x:hidden}::ng-deep .tru-card-portal-card-container{margin:0 3px;padding:0 2px;height:30px;transition:all .4s ease-out;opacity:1}::ng-deep .tru-card-portal-card-container.show{opacity:1}::ng-deep .tru-card-portal-card-container *{pointer-events:none}::ng-deep .tru-card-portal-card{background-color:#fff;border:1px solid #fff;border-radius:3px;padding:2px 6px 2px 8px;position:relative;cursor:pointer;display:block;min-height:15px;text-decoration:none;z-index:0;outline:none;box-shadow:0 .5px #ccc}::ng-deep .tru-card-portal-card:hover{background-color:#efefef;border:1px solid #efefef}::ng-deep .tru-card-portal-card p{font-size:12px;word-wrap:break-word}::ng-deep .tru-card-portal-card:focus{outline:none}::ng-deep .tru-card-portal-card.empty{border:1px dashed #999}::ng-deep .tru-card-placeholder{position:absolute;left:0;right:0;margin:0;z-index:100;border-color:#0079bf;border-top-style:dashed;border-bottom-style:dashed}::ng-deep .tru-card-selected{border-color:#52a8eccc!important;background-color:#52a8eccc!important}::ng-deep .tru-card-selected p{color:#000!important;font-size:12px}::ng-deep .tru-card-menu{position:absolute;top:20px;right:0;background:#fff;border:1px #ccc solid;border-radius:3px;z-index:1;padding:7px;width:200px}::ng-deep .tru-card-menu hr{height:1px;border:1px #ccc solid;border-bottom:0;border-left:0;border-right:0;width:100%;margin:0;padding:0}::ng-deep .tru-card-menu a{color:#777;text-decoration:none;float:left;line-height:16px;margin-top:2px;margin-bottom:2px}::ng-deep .tru-card-menu span{color:#777;float:left;line-height:16px;margin-top:3px}::ng-deep .tru-card-menu a:hover{text-decoration:underline;color:#777}::ng-deep .tru-card-menu a:active,::ng-deep .tru-card-menu a:visited{color:#777}::ng-deep .tru-card-menu-move-container{width:100%!important;display:inline-flex}::ng-deep .tru-card-menu-move-container select{width:100%!important}::ng-deep .tru-card-menu-move-container a{margin-top:1px;margin-left:3px;display:block}::ng-deep .tru-card-menu-move-container span{color:#0079bf;margin-top:0}::ng-deep .tru-card-menu-move-container .move-button-disabled{pointer-events:none;opacity:.75}::ng-deep .tru-card-menu-move-container .move-button-disabled span{color:#ccc}::ng-deep .tru-card-portal-column-filtered{display:none}::ng-deep .tru-card-portal-card-filtered{display:none}\n"] }]
5632
- }], ctorParameters: () => [{ type: TruDataContext }, { type: TruModelTypeLookup }, { type: TruSearchViewEventHandler }, { type: TruSearchResultViewManager }], propDecorators: { config: [{
5638
+ }], ctorParameters: () => [{ type: TruDataContext }, { type: TruModelTypeLookup }, { type: TruSearchViewEventHandler }, { type: TruSearchResultViewManager }, { type: i0.ChangeDetectorRef }], propDecorators: { config: [{
5633
5639
  type: Input
5634
5640
  }], name: [{
5635
5641
  type: Input