@datorama/core 22.9.8 → 22.9.9-rc.1

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 (48) hide show
  1. package/bundle.scss +6 -6
  2. package/bundles/datorama-core.umd.js +136 -81
  3. package/bundles/datorama-core.umd.js.map +1 -1
  4. package/bundles/datorama-core.umd.min.js +38 -38
  5. package/bundles/datorama-core.umd.min.js.map +1 -1
  6. package/datorama-core.d.ts +1 -0
  7. package/datorama-core.metadata.json +1 -1
  8. package/esm2015/datorama-core.js +2 -1
  9. package/esm2015/lib/breadcrumbs/breadcrumbs.component.js +4 -2
  10. package/esm2015/lib/grid-v2/grid/grid-v2.types.js +9 -1
  11. package/esm2015/lib/grid-v2/grid-column-cell-components/grid-status-cell/grid-status-cell.component.js +19 -12
  12. package/esm2015/lib/grid-v2/grid-controller/grid-controller.component.js +30 -13
  13. package/esm2015/lib/grid-v2/grid-pagination/grid-pagination.component.js +3 -8
  14. package/esm2015/lib/grid-v2/grid-settings.js +2 -2
  15. package/esm2015/lib/grid-v2/grid-store/grid.service.js +3 -2
  16. package/esm2015/lib/grid-v2/grid-toolbar/grid-toolbar.component.js +7 -1
  17. package/esm2015/lib/loaders/page-loader/page-loader.component.js +7 -2
  18. package/esm2015/lib/rich-text/rich-text.directive.js +20 -38
  19. package/esm2015/lib/rich-text/rich-text.service.js +50 -0
  20. package/esm2015/lib/select/select.component.js +4 -9
  21. package/esm2015/lib/version.js +2 -2
  22. package/esm5/datorama-core.js +2 -1
  23. package/esm5/lib/breadcrumbs/breadcrumbs.component.js +4 -2
  24. package/esm5/lib/grid-v2/grid/grid-v2.types.js +9 -1
  25. package/esm5/lib/grid-v2/grid-column-cell-components/grid-status-cell/grid-status-cell.component.js +20 -12
  26. package/esm5/lib/grid-v2/grid-controller/grid-controller.component.js +29 -15
  27. package/esm5/lib/grid-v2/grid-pagination/grid-pagination.component.js +3 -10
  28. package/esm5/lib/grid-v2/grid-settings.js +2 -2
  29. package/esm5/lib/grid-v2/grid-store/grid.service.js +3 -2
  30. package/esm5/lib/grid-v2/grid-toolbar/grid-toolbar.component.js +13 -1
  31. package/esm5/lib/loaders/page-loader/page-loader.component.js +7 -2
  32. package/esm5/lib/rich-text/rich-text.directive.js +21 -39
  33. package/esm5/lib/rich-text/rich-text.service.js +51 -0
  34. package/esm5/lib/select/select.component.js +4 -9
  35. package/esm5/lib/version.js +2 -2
  36. package/fesm2015/datorama-core.js +128 -77
  37. package/fesm2015/datorama-core.js.map +1 -1
  38. package/fesm5/datorama-core.js +136 -82
  39. package/fesm5/datorama-core.js.map +1 -1
  40. package/lib/grid-v2/grid/grid-v2.types.d.ts +12 -3
  41. package/lib/grid-v2/grid-column-cell-components/grid-status-cell/grid-status-cell.component.d.ts +3 -5
  42. package/lib/grid-v2/grid-controller/grid-controller.component.d.ts +1 -0
  43. package/lib/grid-v2/grid-settings.d.ts +2 -2
  44. package/lib/grid-v2/grid-toolbar/grid-toolbar.component.d.ts +2 -0
  45. package/lib/loaders/page-loader/page-loader.component.d.ts +1 -0
  46. package/lib/rich-text/rich-text.directive.d.ts +4 -6
  47. package/lib/rich-text/rich-text.service.d.ts +10 -0
  48. package/package.json +2 -2
package/bundle.scss CHANGED
@@ -4870,13 +4870,13 @@ dato-button button[disabled] {
4870
4870
  Secondary
4871
4871
  */
4872
4872
  dato-button[datoType='secondary'] button {
4873
- background-color: themify(primary-300, 0.15);
4874
- color: themify(primary-400);
4873
+ background-color: themify(primary-100);
4874
+ color: themify(primary-600);
4875
4875
  }
4876
4876
 
4877
4877
  dato-button[datoType='secondary'] button:hover {
4878
- background-color: themify(primary-300, 0.25);
4879
- color: themify(primary-500);
4878
+ background-color: themify(primary-200);
4879
+ color: themify(primary-600);
4880
4880
  }
4881
4881
 
4882
4882
  dato-button[datoType='secondary'] dato-icon svg {
@@ -4884,8 +4884,8 @@ dato-button[datoType='secondary'] dato-icon svg {
4884
4884
  }
4885
4885
 
4886
4886
  dato-button[datoType='secondary'] button:active {
4887
- background-color: themify(primary-300, 0.35);
4888
- color: themify(primary-600);
4887
+ background-color: themify(primary-300);
4888
+ color: themify(primary-700);
4889
4889
  }
4890
4890
 
4891
4891
  /**
@@ -8748,9 +8748,8 @@
8748
8748
  DatoSelectComponent.prototype.writeValue = function (activeOptions) {
8749
8749
  this._model = activeOptions ? akita.coerceArray(activeOptions) : [];
8750
8750
  if (this.options) {
8751
- var overTheLimit = this.limitSelectedTo && this.isMulti && this._model.length >= this.limitSelectedTo;
8752
8751
  this.markAsActive(this._model, { deselectAll: true });
8753
- overTheLimit && this.updateDisabledState();
8752
+ this.limitSelectedTo && this.updateDisabledState();
8754
8753
  }
8755
8754
  /** For later updates */
8756
8755
  this.cdr.markForCheck();
@@ -8878,7 +8877,6 @@
8878
8877
  };
8879
8878
  DatoSelectComponent.prototype.removeOption = function (option) {
8880
8879
  var _this = this;
8881
- var updateDisabled = this.limitSelectedTo && this._model.length === this.limitSelectedTo;
8882
8880
  this._model = this._model.filter(function (current) { return current[_this.idKey] !== option[_this.idKey]; });
8883
8881
  var optionToRemove = this.options.find(function (datoOption) { return datoOption.option && datoOption.option[_this.idKey] === option[_this.idKey]; });
8884
8882
  /**
@@ -8888,7 +8886,7 @@
8888
8886
  if (optionToRemove) {
8889
8887
  optionToRemove.active = false;
8890
8888
  }
8891
- updateDisabled && this.updateDisabledState();
8889
+ this.limitSelectedTo && this.updateDisabledState();
8892
8890
  this.onChange(this._model);
8893
8891
  this.cdr.markForCheck();
8894
8892
  this.asyncUpdateDropdownPosition();
@@ -9236,9 +9234,6 @@
9236
9234
  if (!datoOption) {
9237
9235
  return;
9238
9236
  }
9239
- var modelLength = this._model.length;
9240
- var updateDisabled = this.limitSelectedTo &&
9241
- (modelLength === this.limitSelectedTo || (modelLength === this.limitSelectedTo - 1 && !datoOption.active));
9242
9237
  datoOption.active = !datoOption.active;
9243
9238
  var rawOption = datoOption.option;
9244
9239
  if (datoOption.active) {
@@ -9247,7 +9242,7 @@
9247
9242
  else {
9248
9243
  this._model = this._model.filter(function (current) { return current[_this.idKey] !== rawOption[_this.idKey]; });
9249
9244
  }
9250
- updateDisabled && this.updateDisabledState();
9245
+ this.limitSelectedTo && this.updateDisabledState();
9251
9246
  this.onChange(this._model);
9252
9247
  this.cdr.markForCheck();
9253
9248
  this.asyncUpdateDropdownPosition();
@@ -12052,7 +12047,7 @@
12052
12047
  return contextActions;
12053
12048
  }
12054
12049
 
12055
- var DATO_GRID_STORAGE_API = new core.InjectionToken('DATO_GRID_STORAGE_API');
12050
+ var DATO_GRID_STORAGE_API = new core.InjectionToken('DATO_GRID_STORAGE_AP');
12056
12051
 
12057
12052
  var defaultEditableColumnRenderer = function (params) {
12058
12053
  return params && params.value ? "<div class=\"value-wrapper ellipsis\">" + params.value + "</div>" : null;
@@ -12092,6 +12087,14 @@
12092
12087
  GridRowSelectionType["MULTIPLE"] = "multiple";
12093
12088
  })(exports.GridRowSelectionType || (exports.GridRowSelectionType = {}));
12094
12089
 
12090
+ (function (GridStatusColumnTypes) {
12091
+ GridStatusColumnTypes["SUCCESS"] = "SUCCESS";
12092
+ GridStatusColumnTypes["FAILURE"] = "FAILURE";
12093
+ GridStatusColumnTypes["IN_PROGRESS"] = "IN_PROGRESS";
12094
+ GridStatusColumnTypes["PENDING"] = "PENDING";
12095
+ GridStatusColumnTypes["WAITING"] = "WAITING";
12096
+ })(exports.GridStatusColumnTypes || (exports.GridStatusColumnTypes = {}));
12097
+
12095
12098
  /**
12096
12099
  * @license
12097
12100
  * Copyright Datorama. All Rights Reserved.
@@ -14639,7 +14642,8 @@
14639
14642
  this.updateSettings({ gridAlignment: gridAlignment, columnsSizes: null });
14640
14643
  };
14641
14644
  GridService.prototype.saveSettingsToServer = function (settings) {
14642
- this.storageAPI.set(this.gridName, settings);
14645
+ var isGlobal = this.gridQuery.getGridOptions().isGlobalSettings;
14646
+ this.storageAPI.set(this.gridName, settings, isGlobal);
14643
14647
  };
14644
14648
  /**
14645
14649
  * @internal used to log grid events to the platform's logging service
@@ -15627,7 +15631,7 @@
15627
15631
  });
15628
15632
  DatoGridControllerComponent.prototype.ngOnDestroy = function () {
15629
15633
  this.contentInit.complete();
15630
- this.tooltip && this.clearTooltip();
15634
+ this.clearTooltip();
15631
15635
  this.rowHoverComponent && this.rowHoverComponent.destroy();
15632
15636
  this.rowHoverComponent = null;
15633
15637
  };
@@ -15644,7 +15648,10 @@
15644
15648
  .pipe(operators.switchMap(function () {
15645
15649
  _this.gridOptions = _this.normalizeOptions();
15646
15650
  agGrid.gridOptions = _this.gridOptions;
15647
- var settingsLoader = _this.gridOptions.saveSettings === false ? rxjs.of(null) : _this.storageAPI.get(_this.gridOptions.gridName);
15651
+ var isGlobal = _this.gridOptions.isGlobalSettings;
15652
+ var settingsLoader = _this.gridOptions.saveSettings === false
15653
+ ? rxjs.of(null)
15654
+ : _this.storageAPI.get(_this.gridOptions.gridName, isGlobal);
15648
15655
  return rxjs.combineLatest([agGrid.gridReady, settingsLoader]);
15649
15656
  }), ngxTakeUntilDestroy.untilDestroyed(this))
15650
15657
  .subscribe(function (_a) {
@@ -15854,40 +15861,51 @@
15854
15861
  });
15855
15862
  this.addOnHoverElement();
15856
15863
  }
15857
- agGrid.cellMouseOver
15858
- .pipe(operators.filter(function (_a) {
15859
- var node = _a.node, column = _a.column;
15860
- return lastHoveredCell !== node.id + "-" + column.getColId();
15861
- }), ngxTakeUntilDestroy.untilDestroyed(this))
15862
- .subscribe(function (event) {
15863
- lastHoveredCell = event.node.id + "-" + event.column.getColId();
15864
+ agGrid.cellMouseOver.pipe(ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function (event) {
15865
+ var node = event.node, column = event.column;
15866
+ if (lastHoveredCell === node.id + "-" + column.getColId()) {
15867
+ clearTimeout(_this.cellMouseOutTimer);
15868
+ return;
15869
+ }
15870
+ lastHoveredCell = node.id + "-" + column.getColId();
15864
15871
  _this.showTooltip(event);
15865
15872
  var row = event.event.target.parentElement;
15866
- if (onHoverEnabled && (event.node.group === false || isNil(event.node.group)) && _this.lastHoveredRow !== row) {
15873
+ if (onHoverEnabled && (node.group === false || isNil(node.group)) && _this.lastHoveredRow !== row) {
15867
15874
  var previousNode = _this.lastHoveredRow;
15868
15875
  _this.lastHoveredRow = row;
15869
15876
  _this.toggleRowHoverClass([previousNode, _this.lastHoveredRow]);
15870
15877
  _this.setOnHoverState(true, event);
15871
15878
  }
15872
15879
  });
15873
- var onTooltipOut = rxjs.merge(rxjs.fromEvent(bodyViewport, 'scroll'), rxjs.fromEvent(this.agGridEl, 'mouseleave'), agGrid.cellMouseOut);
15874
- onTooltipOut
15880
+ var onTooltipOut = rxjs.merge(rxjs.fromEvent(bodyViewport, 'scroll'), rxjs.fromEvent(this.agGridEl, 'mouseleave'));
15881
+ onTooltipOut.pipe(ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function () {
15882
+ lastHoveredCell = null;
15883
+ _this.clearTooltip();
15884
+ });
15885
+ agGrid.cellMouseOut
15875
15886
  .pipe(operators.filter(function () { return !isNil(_this.tooltip); }), ngxTakeUntilDestroy.untilDestroyed(this))
15876
15887
  .subscribe(function () {
15877
- _this.clearTooltip();
15888
+ _this.cellMouseOutTimer = window.setTimeout(function () { return _this.clearTooltip(); });
15878
15889
  });
15879
15890
  };
15880
15891
  /**
15881
15892
  * Dispose the tooltip
15882
15893
  */
15883
15894
  DatoGridControllerComponent.prototype.clearTooltip = function () {
15884
- this.tooltip.dispose();
15895
+ this.tooltip && this.tooltip.dispose();
15885
15896
  this.tooltip = null;
15886
15897
  };
15887
15898
  DatoGridControllerComponent.prototype.showTooltip = function (event) {
15888
15899
  var cell = event.event.target;
15900
+ if (cell.tagName === 'SPAN' && cell.scrollWidth === 0) {
15901
+ cell = cell.parentElement;
15902
+ }
15903
+ if (event.colDef.editable) {
15904
+ cell = cell.querySelector('.value-wrapper') || cell;
15905
+ }
15889
15906
  var textOverflow = cell.offsetWidth < cell.scrollWidth;
15890
15907
  if (textOverflow) {
15908
+ clearTimeout(this.cellMouseOutTimer);
15891
15909
  var params = { cell: cell, value: cell.innerText };
15892
15910
  isNil(this.tooltip) ? this.createAndShowTooltip(params) : this.updateTooltip(params);
15893
15911
  }
@@ -16474,13 +16492,7 @@
16474
16492
  DatoGridPaginationV2Component.prototype.ngOnInit = function () {
16475
16493
  var _this = this;
16476
16494
  this.gridQuery
16477
- .waitForGrid(function () {
16478
- return rxjs.combineLatest([
16479
- _this.gridQuery.gridRef.filterChanged,
16480
- _this.gridQuery.gridRef.rowGroupOpened.pipe(operators.startWith(true)),
16481
- _this.gridQuery.gridRef.expandOrCollapseAll.pipe(operators.startWith(true))
16482
- ]);
16483
- })
16495
+ .waitForGrid(function () { return _this.gridQuery.gridRef.filterChanged; })
16484
16496
  .pipe(ngxTakeUntilDestroy.untilDestroyed(this))
16485
16497
  .subscribe(function () {
16486
16498
  _this.gridApi.paginationGoToPage(0);
@@ -16932,6 +16944,18 @@
16932
16944
  this.registerGroupListeners();
16933
16945
  this.subscribeRowsSelectionData();
16934
16946
  };
16947
+ DatoGridV2ToolbarComponent.prototype.getCellValueChangeEvent = function () {
16948
+ var _this = this;
16949
+ return this.gridController.gridQuery.waitForGrid(function () {
16950
+ return _this.gridQuery.gridRef.cellValueChanged.pipe(operators.debounceTime(100), ngxTakeUntilDestroy.untilDestroyed(_this));
16951
+ });
16952
+ };
16953
+ DatoGridV2ToolbarComponent.prototype.getRowDataUpdatedEvent = function () {
16954
+ var _this = this;
16955
+ return this.gridController.gridQuery.waitForGrid(function () {
16956
+ return _this.gridQuery.gridRef.rowDataUpdated.pipe(operators.debounceTime(100), ngxTakeUntilDestroy.untilDestroyed(_this));
16957
+ });
16958
+ };
16935
16959
  DatoGridV2ToolbarComponent.prototype.onActionClick = function (action) {
16936
16960
  if (isFunction(action.onClick)) {
16937
16961
  var selectedRowsCount = this.gridController.gridQuery.getSelectedRowsCount();
@@ -19546,6 +19570,7 @@
19546
19570
  function DatoPageLoaderComponent() {
19547
19571
  this.msg = '';
19548
19572
  this.salesforce = false;
19573
+ this.size = 'medium';
19549
19574
  this.circleIds = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i'];
19550
19575
  }
19551
19576
  __decorate([
@@ -19556,10 +19581,14 @@
19556
19581
  core.Input(),
19557
19582
  __metadata("design:type", Object)
19558
19583
  ], DatoPageLoaderComponent.prototype, "salesforce", void 0);
19584
+ __decorate([
19585
+ core.Input(),
19586
+ __metadata("design:type", String)
19587
+ ], DatoPageLoaderComponent.prototype, "size", void 0);
19559
19588
  DatoPageLoaderComponent = __decorate([
19560
19589
  core.Component({
19561
19590
  selector: 'dato-page-loader',
19562
- template: "<div class=\"d-flex-column align-center\">\n <ng-container *ngIf=\"salesforce; else datoramaPageLoader\">\n <div class=\"slds-spinner_container\">\n <div role=\"status\" class=\"slds-spinner slds-spinner_medium slds-spinner_brand\">\n <div class=\"slds-spinner__dot-a\"></div>\n <div class=\"slds-spinner__dot-b\"></div>\n </div>\n </div>\n </ng-container>\n <ng-template #datoramaPageLoader>\n <div class=\"animation-container d-flex align-center d-flex-wrap\">\n <div class=\"circle d-flex align-center\" *ngFor=\"let id of circleIds\" [ngClass]=\"'circle-' + id\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" />\n </svg>\n </div>\n </div>\n </ng-template>\n <span class=\"loading-message simple-bold\">{{msg | translate}}</span>\n</div>",
19591
+ template: "<div class=\"d-flex-column align-center\">\n <ng-container *ngIf=\"salesforce; else datoramaPageLoader\">\n <div class=\"slds-spinner_container\">\n <div role=\"status\" class=\"slds-spinner slds-spinner_brand\" [ngClass]=\"'slds-spinner_' + size\">\n <div class=\"slds-spinner__dot-a\"></div>\n <div class=\"slds-spinner__dot-b\"></div>\n </div>\n </div>\n </ng-container>\n <ng-template #datoramaPageLoader>\n <div class=\"animation-container d-flex align-center d-flex-wrap\">\n <div class=\"circle d-flex align-center\" *ngFor=\"let id of circleIds\" [ngClass]=\"'circle-' + id\">\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"12\" height=\"12\" viewBox=\"0 0 12 12\">\n <circle cx=\"6\" cy=\"6\" r=\"5\" />\n </svg>\n </div>\n </div>\n </ng-template>\n <span class=\"loading-message simple-bold\">{{msg | translate}}</span>\n</div>\n",
19563
19592
  changeDetection: core.ChangeDetectionStrategy.OnPush
19564
19593
  })
19565
19594
  ], DatoPageLoaderComponent);
@@ -20537,8 +20566,15 @@
20537
20566
 
20538
20567
  var DatoGridStatusCellComponent = /** @class */ (function () {
20539
20568
  function DatoGridStatusCellComponent(cdr) {
20569
+ var _a;
20540
20570
  this.cdr = cdr;
20541
- this.DEFAULT_MIN_WIDTH = 100;
20571
+ this.defaultConfigByStatus = (_a = {},
20572
+ _a[exports.GridStatusColumnTypes.SUCCESS] = { icon: 'success-line', iconCssClass: 'green-400-color' },
20573
+ _a[exports.GridStatusColumnTypes.FAILURE] = { icon: 'failed-line', iconCssClass: 'red-400-color' },
20574
+ _a[exports.GridStatusColumnTypes.PENDING] = { icon: 'time', iconCssClass: 'yellow-400-color' },
20575
+ _a[exports.GridStatusColumnTypes.WAITING] = { icon: 'info-line', iconCssClass: 'orange-400-color' },
20576
+ _a[exports.GridStatusColumnTypes.IN_PROGRESS] = { showSpinner: true },
20577
+ _a);
20542
20578
  }
20543
20579
  DatoGridStatusCellComponent.prototype.agInit = function (params) {
20544
20580
  var value = params.value, valueFormatted = params.valueFormatted, node = params.node;
@@ -20553,15 +20589,14 @@
20553
20589
  var mainCustomCellConfig = customCellConfig || {};
20554
20590
  var valueCustomCellConfig = valueToCustomCellConfig ? valueToCustomCellConfig[params.value] || {} : {};
20555
20591
  var config = __assign(__assign({}, mainCustomCellConfig), valueCustomCellConfig);
20556
- var color = config.color, icon = config.icon, cssClass = config.cssClass, iconCssClass = config.iconCssClass, minWidth = config.minWidth, showSpinner = config.showSpinner, getAdditionalText = config.getAdditionalText, getIsVisible = config.getIsVisible;
20592
+ var textCssClass = config.textCssClass, icon = config.icon, iconCssClass = config.iconCssClass, showSpinner = config.showSpinner, getAdditionalText = config.getAdditionalText, additionalTextCssClass = config.additionalTextCssClass, getIsVisible = config.getIsVisible, status = config.status;
20593
+ var defaultConfig = this.defaultConfigByStatus[status] || {};
20557
20594
  this.isVisible = !getIsVisible || getIsVisible(params.data);
20558
- this.color = color || 'primary';
20559
- this.backgroundClass = this.color + "-" + (this.color === 'accent' ? '100' : '200') + "-background-color";
20560
- this.icon = icon;
20561
- this.minWidth = minWidth || this.DEFAULT_MIN_WIDTH;
20562
- this.cssClass = cssClass || '';
20563
- this.iconCssClass = iconCssClass || '';
20564
- this.showSpinner = showSpinner;
20595
+ this.icon = icon || defaultConfig.icon;
20596
+ this.iconCssClass = iconCssClass || defaultConfig.iconCssClass || '';
20597
+ this.textCssClass = textCssClass || '';
20598
+ this.additionalTextCssClass = additionalTextCssClass || '';
20599
+ this.showSpinner = !!showSpinner || !!defaultConfig.showSpinner;
20565
20600
  this.additionalText = getAdditionalText ? getAdditionalText(params.data) : null;
20566
20601
  };
20567
20602
  DatoGridStatusCellComponent.prototype.refresh = function (params) {
@@ -20575,8 +20610,9 @@
20575
20610
  DatoGridStatusCellComponent = __decorate([
20576
20611
  core.Component({
20577
20612
  selector: 'dato-grid-status-cell',
20578
- template: "<div *ngIf=\"!isGroup && isVisible\" class=\"height-100 d-flex items-center\">\n <div *ngIf=\"status\" class=\"d-flex justify-center items-center px-15 py-5 {{backgroundClass}} {{cssClass}}\" [style.min-width.px]=\"minWidth\">\n <dato-icon *ngIf=\"icon\" class=\"mr-5 {{iconCssClass}}\" [icon]=\"icon\" datoSize=\"sm\"></dato-icon>\n <div class=\"dato-note {{color}}-800-color\" [class.ellipsis]=\"!additionalText\"\n [datoTooltipV2]=\"status\" [showOnlyOnTextOverflow]=\"true\" [tooltipCheckInView]=\"false\" [datoTooltipDisabled]=\"!!additionalText\">\n {{status}}\n </div>\n <div *ngIf=\"additionalText\" class=\"dato-note {{color}}-800-color ml-3 ellipsis\"\n [datoTooltipV2]=\"status + ' ' + additionalText\" [showOnlyOnTextOverflow]=\"true\" [tooltipCheckInView]=\"false\">\n {{additionalText}}\n </div>\n <span *ngIf=\"showSpinner\" class=\"dato-spinner-loader ml-5\"></span>\n </div>\n</div>\n<span *ngIf=\"isGroup\">{{status}}</span>\n",
20579
- changeDetection: core.ChangeDetectionStrategy.OnPush
20613
+ template: "<div *ngIf=\"!isGroup && isVisible\" class=\"height-100 d-flex items-center\">\n <dato-icon *ngIf=\"icon\" class=\"mr-6 {{iconCssClass}}\" [icon]=\"icon\" datoSize=\"sm\"></dato-icon>\n <dato-page-loader *ngIf=\"showSpinner\" [salesforce]=\"true\" size=\"x-small\" class=\"mr-10 mt-15\"></dato-page-loader>\n <div class=\"dato-simple status line-height-18 {{textCssClass}}\" [class.ellipsis]=\"!additionalText\"\n [datoTooltipV2]=\"status\" [showOnlyOnTextOverflow]=\"true\" [tooltipCheckInView]=\"false\">\n {{status}}\n </div>\n <div *ngIf=\"additionalText\" class=\"dato-simple ml-3 ellipsis line-height-18 {{additionalTextCssClass}}\"\n [datoTooltipV2]=\"status + ' ' + additionalText\" [showOnlyOnTextOverflow]=\"true\" [tooltipCheckInView]=\"false\">\n {{additionalText}}\n </div>\n</div>\n<span *ngIf=\"isGroup\">{{status}}</span>\n",
20614
+ changeDetection: core.ChangeDetectionStrategy.OnPush,
20615
+ styles: [".line-height-18{line-height:18px}"]
20580
20616
  }),
20581
20617
  __metadata("design:paramtypes", [core.ChangeDetectorRef])
20582
20618
  ], DatoGridStatusCellComponent);
@@ -21407,6 +21443,40 @@
21407
21443
  * found in the LICENSE file at https://github.com/datorama/client-core/blob/master/LICENSE
21408
21444
  */
21409
21445
 
21446
+ var RichTextService = /** @class */ (function () {
21447
+ function RichTextService(http, config) {
21448
+ this.http = http;
21449
+ this.config = config;
21450
+ }
21451
+ RichTextService.prototype.getLib = function (appendScriptFunc, appendStyleFunc) {
21452
+ if (!this.richTextScript$) {
21453
+ this.initLib(appendScriptFunc, appendStyleFunc);
21454
+ }
21455
+ return this.richTextScript$;
21456
+ };
21457
+ RichTextService.prototype.initLib = function (appendScriptFunc, appendStyleFunc) {
21458
+ this.richTextScript$ = rxjs.combineLatest([
21459
+ this.http
21460
+ .get(this.config.paths.richText + "/index.js", { responseType: 'text' })
21461
+ .pipe(operators.tap(function (lib) { return appendScriptFunc(lib, 'rich-text-editor'); })),
21462
+ this.http
21463
+ .get(this.config.paths.richText + "/plugins/autocomplete/plugin.css", { responseType: 'text' })
21464
+ .pipe(operators.tap(function (style) { return appendStyleFunc(style, 'tinymce-autocomplete'); }))
21465
+ ]).pipe(operators.shareReplay(1));
21466
+ };
21467
+ RichTextService.ctorParameters = function () { return [
21468
+ { type: http.HttpClient },
21469
+ { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] }
21470
+ ]; };
21471
+ RichTextService.ɵprov = core.ɵɵdefineInjectable({ factory: function RichTextService_Factory() { return new RichTextService(core.ɵɵinject(http.HttpClient), core.ɵɵinject(DATO_CORE_CONFIG)); }, token: RichTextService, providedIn: "root" });
21472
+ RichTextService = __decorate([
21473
+ core.Injectable({ providedIn: 'root' }),
21474
+ __param(1, core.Inject(DATO_CORE_CONFIG)),
21475
+ __metadata("design:paramtypes", [http.HttpClient, Object])
21476
+ ], RichTextService);
21477
+ return RichTextService;
21478
+ }());
21479
+
21410
21480
  /**
21411
21481
  * @license
21412
21482
  * Copyright Datorama. All Rights Reserved.
@@ -21420,20 +21490,20 @@
21420
21490
  var ɵ0$3 = getTinymce;
21421
21491
  var DatoRichTextDirective = /** @class */ (function (_super) {
21422
21492
  __extends(DatoRichTextDirective, _super);
21423
- function DatoRichTextDirective(ngZone, http, host, config) {
21493
+ function DatoRichTextDirective(ngZone, richTextService, config, host) {
21424
21494
  var _this = _super.call(this) || this;
21425
21495
  _this.ngZone = ngZone;
21426
- _this.http = http;
21427
- _this.host = host;
21496
+ _this.richTextService = richTextService;
21428
21497
  _this.config = config;
21498
+ _this.host = host;
21429
21499
  _this.autocompleteOptions = {};
21430
21500
  _this.forcePlainTextPasting = false;
21431
21501
  _this.format = 'html';
21432
21502
  _this.isOneLine = false;
21433
21503
  _this.initialValue = '';
21434
- _this.defaultPlugins = 'link fullscreen textcolor colorpicker image lists table textpattern autocomplete';
21504
+ _this.defaultPlugins = 'link fullscreen image lists table autocomplete';
21435
21505
  _this.defaultToolbar = [
21436
- 'fontselect fontsizeselect forecolor backcolor bold italic underline link',
21506
+ 'fontfamily fontsize forecolor backcolor bold italic underline link',
21437
21507
  'alignleft aligncenter alignright alignjustify outdent indent | table numlist bullist | image fullscreen'
21438
21508
  ];
21439
21509
  return _this;
@@ -21459,28 +21529,11 @@
21459
21529
  base: this.config.paths.richText,
21460
21530
  query: ''
21461
21531
  };
21462
- /**
21463
- * We support only one instance in load time
21464
- */
21465
- if (window.tinymce) {
21466
- this.init.call(this);
21467
- }
21468
- else {
21469
- this.loadLib().subscribe(function (lib) {
21470
- appendScript(lib, 'rich-text-editor');
21471
- _this.init.call(_this);
21472
- _this.loadAutoCompleteStyle();
21473
- });
21474
- }
21475
- };
21476
- DatoRichTextDirective.prototype.loadLib = function () {
21477
- return this.http.get(this.config.paths.richText + "/index.js", { responseType: 'text' });
21478
- };
21479
- DatoRichTextDirective.prototype.loadAutoCompleteStyle = function () {
21480
- this.http
21481
- .get(this.config.paths.richText + "/plugins/autocomplete/plugin.css", { responseType: 'text' })
21482
- .subscribe(function (style) {
21483
- appendStyle(style, 'tinymce-autocomplete');
21532
+ this.richTextService
21533
+ .getLib(appendScript, appendStyle)
21534
+ .pipe(ngxTakeUntilDestroy.untilDestroyed(this))
21535
+ .subscribe(function () {
21536
+ _this.init.call(_this);
21484
21537
  });
21485
21538
  };
21486
21539
  DatoRichTextDirective.prototype.initEditor = function (_, editor) {
@@ -21504,8 +21557,6 @@
21504
21557
  target: this.host.nativeElement,
21505
21558
  width: this.width || 600,
21506
21559
  height: this.height || 300,
21507
- force_br_newlines: true,
21508
- force_p_newlines: false,
21509
21560
  resize: 'both',
21510
21561
  branding: false,
21511
21562
  inline: this.inline,
@@ -21513,10 +21564,12 @@
21513
21564
  readonly: this.disabled,
21514
21565
  plugins: this.plugins || this.defaultPlugins,
21515
21566
  toolbar: isNil(this.toolbar) ? this.defaultToolbar : this.toolbar,
21516
- fontsize_formats: '8px 10px 12px 14px 18px 24px 36px',
21567
+ font_size_formats: '8px 10px 12px 14px 18px 24px 36px',
21517
21568
  min_width: 480,
21518
21569
  menubar: false,
21519
21570
  autocomplete: this.autocompleteOptions,
21571
+ suffix: '.min',
21572
+ skin: 'tinymce-5',
21520
21573
  setup: function (editor) {
21521
21574
  _this.editor = editor;
21522
21575
  editor.on('init', function (e) {
@@ -21573,9 +21626,9 @@
21573
21626
  var DatoRichTextDirective_1;
21574
21627
  DatoRichTextDirective.ctorParameters = function () { return [
21575
21628
  { type: core.NgZone },
21576
- { type: http.HttpClient },
21577
- { type: core.ElementRef },
21578
- { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] }
21629
+ { type: RichTextService },
21630
+ { type: undefined, decorators: [{ type: core.Inject, args: [DATO_CORE_CONFIG,] }] },
21631
+ { type: core.ElementRef }
21579
21632
  ]; };
21580
21633
  __decorate([
21581
21634
  core.Input(),
@@ -21641,10 +21694,9 @@
21641
21694
  }
21642
21695
  ]
21643
21696
  }),
21644
- __param(3, core.Inject(DATO_CORE_CONFIG)),
21697
+ __param(2, core.Inject(DATO_CORE_CONFIG)),
21645
21698
  __metadata("design:paramtypes", [core.NgZone,
21646
- http.HttpClient,
21647
- core.ElementRef, Object])
21699
+ RichTextService, Object, core.ElementRef])
21648
21700
  ], DatoRichTextDirective);
21649
21701
  return DatoRichTextDirective;
21650
21702
  }(BaseCustomControl));
@@ -24167,7 +24219,9 @@
24167
24219
  };
24168
24220
  DatoBreadcrumbsComponent.prototype.initEditableHeader = function () {
24169
24221
  var _this = this;
24170
- this.headerControl.valueChanges.pipe(operators.debounceTime(300), ngxTakeUntilDestroy.untilDestroyed(this)).subscribe(function (res) {
24222
+ this.headerControl.valueChanges
24223
+ .pipe(operators.debounceTime(300), ngxTakeUntilDestroy.untilDestroyed(this))
24224
+ .subscribe(function (res) {
24171
24225
  _this.updateEditableText.emit(res);
24172
24226
  _this.cdr.detectChanges();
24173
24227
  });
@@ -25530,7 +25584,7 @@
25530
25584
  };
25531
25585
  }
25532
25586
 
25533
- window.coreVersion = '22.9.8';
25587
+ window.coreVersion = '22.10.7-rc.';
25534
25588
 
25535
25589
  exports.APP_TRANSLATE = APP_TRANSLATE;
25536
25590
  exports.AceService = AceService;
@@ -25972,6 +26026,7 @@
25972
26026
  exports.ɵl = DatoGridItemsCountCellComponent;
25973
26027
  exports.ɵm = DatoGridV2ToolbarMoreMenuComponent;
25974
26028
  exports.ɵn = DatoGridSearchBarComponent;
26029
+ exports.ɵo = RichTextService;
25975
26030
 
25976
26031
  Object.defineProperty(exports, '__esModule', { value: true });
25977
26032