@datorama/core 22.9.2-rc.3 → 22.9.2-rc.7

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.
@@ -8581,16 +8581,18 @@ var DatoSelectComponent = /** @class */ (function (_super) {
8581
8581
  });
8582
8582
  this.datoOverlay.attach({ placement: this.placement }, this._dropdownClass);
8583
8583
  this.toggle();
8584
- /**
8585
- * When we first open the dropdown we need to mark the
8586
- * FormControl values as actives
8587
- */
8588
- if (this.hasValue && this._initialOpen) {
8589
- this.markAsActive(this._model);
8584
+ if (this.hasValue) {
8585
+ /**
8586
+ * When we first open the dropdown we need to mark the
8587
+ * FormControl values as actives
8588
+ */
8589
+ if (this._initialOpen) {
8590
+ this.markAsActive(this._model);
8591
+ this._initialOpen = false;
8592
+ }
8590
8593
  if (this.limitSelectedTo) {
8591
8594
  this.updateDisabledState();
8592
8595
  }
8593
- this._initialOpen = false;
8594
8596
  }
8595
8597
  if (this._withInfiniteScroll) {
8596
8598
  this.activateInfiniteScroll();
@@ -12571,6 +12573,20 @@ var DatoGridFilterComponent = /** @class */ (function () {
12571
12573
  this.showClearFiltersButton = true;
12572
12574
  this.excludedValues = new Set();
12573
12575
  }
12576
+ Object.defineProperty(DatoGridFilterComponent.prototype, "operatorToggler", {
12577
+ set: function (togglers) {
12578
+ if (togglers && this.inputConditionsOperator) {
12579
+ togglers.forEach(function (toggler) {
12580
+ if (!toggler.isDisabled) {
12581
+ toggler.setDisabledState(true);
12582
+ }
12583
+ });
12584
+ this.cdr.detectChanges();
12585
+ }
12586
+ },
12587
+ enumerable: true,
12588
+ configurable: true
12589
+ });
12574
12590
  Object.defineProperty(DatoGridFilterComponent.prototype, "byValueControl", {
12575
12591
  get: function () {
12576
12592
  return this.filterForm.get('byValue');
@@ -12614,7 +12630,7 @@ var DatoGridFilterComponent = /** @class */ (function () {
12614
12630
  Object.defineProperty(DatoGridFilterComponent.prototype, "defaultConditional", {
12615
12631
  get: function () {
12616
12632
  return this.fb.group({
12617
- operator: [OperatorTypes.AND],
12633
+ operator: [this.inputConditionsOperator || OperatorTypes.AND],
12618
12634
  conditions: this.fb.array([this.defaultOperand])
12619
12635
  });
12620
12636
  },
@@ -12683,6 +12699,7 @@ var DatoGridFilterComponent = /** @class */ (function () {
12683
12699
  var colFilter = filter || colDef.filter;
12684
12700
  var filterOptions = DatoGridFilterOptionsMap[colFilter];
12685
12701
  this.pivotColumn = gridQuery.api.columns.getSecondaryPivotColumn(pivotKeys, pivotValueColumn);
12702
+ this.inputConditionsOperator = filtersConfig.inputConditionsOperator;
12686
12703
  if (!isNil(filtersConfig.showClearFiltersButton)) {
12687
12704
  this.showClearFiltersButton = filtersConfig.showClearFiltersButton;
12688
12705
  }
@@ -13020,7 +13037,7 @@ var DatoGridFilterComponent = /** @class */ (function () {
13020
13037
  return this.defaultConditional;
13021
13038
  }
13022
13039
  return this.fb.group({
13023
- operator: [conditional.operator],
13040
+ operator: [this.inputConditionsOperator || conditional.operator],
13024
13041
  conditions: this.fb.array(this.buildConditions(conditional.conditions))
13025
13042
  });
13026
13043
  };
@@ -13190,10 +13207,15 @@ var DatoGridFilterComponent = /** @class */ (function () {
13190
13207
  { type: DatoTranslateService },
13191
13208
  { type: ChangeDetectorRef }
13192
13209
  ]; };
13210
+ __decorate([
13211
+ ViewChildren('operatorToggler'),
13212
+ __metadata("design:type", QueryList),
13213
+ __metadata("design:paramtypes", [QueryList])
13214
+ ], DatoGridFilterComponent.prototype, "operatorToggler", null);
13193
13215
  DatoGridFilterComponent = __decorate([
13194
13216
  Component({
13195
13217
  selector: 'dato-grid-filter',
13196
- template: "<form class=\"container primary-0-background-color\" [formGroup]=\"filterForm\" datoForm\n *datoSubscribe=\"hasFilter$ as hasFilter\">\n <ng-container>\n <dato-accordion closeOthers=\"true\" class=\"filter-options\" [activeIds]=\"activeAccordionId\">\n <ng-container *ngIf=\"filterSections.Conditional\">\n\n <dato-accordion-group>\n <dato-accordion-header class=\"dato-note-bold primary-600-color\" data-auto-id=\"conditional-filters\"\n [class.primary-100-background-color]=\"header_1.isOpen\" #header_1>\n <div class=\"px-10 d-flex align-start-center\">\n <div class=\"filter-title d-flex-grow d-flex align-start-center\">{{'core.filterByCondition' | translate}}</div>\n <dato-icon class=\"primary-200-color\" height=\"18px\"\n [icon]=\"header_1.isOpen ? 'collapse' : 'expand'\"></dato-icon>\n </div>\n </dato-accordion-header>\n <dato-accordion-content #conditionalContent>\n <div class=\"conditional-content-container d-flex-column\" formGroupName=\"conditional\"\n [class.multi-conditions]=\"conditionsControls.length > 1\">\n <div class=\"operand d-flex-column mb-10\"\n [attr.data-auto-id]=\"'condition-' + i\"\n *ngFor=\"let operand of conditionsControls; index as i; last as last\">\n <div class=\"d-flex\">\n <div class=\"d-flex-column d-flex-grow min-width-0\">\n <ng-container formArrayName=\"conditions\">\n\n <ng-container [formGroupName]=\"i\">\n <dato-select datoSize=\"sm\" class=\"mb-10\" [attr.data-auto-id]=\"'condition-' + i + '-operand'\" formControlName=\"type\"\n datoSelectClass=\"operand-select\"\n [dataSet]=\"conditionalFilterOptions\"\n [isCombo]=\"false\" #select>\n <dato-option *ngFor=\"let option of select.data; index as index\"\n [option]=\"option\">\n {{ option.label }}\n </dato-option>\n </dato-select>\n <ng-container [ngSwitch]=\"filterType\">\n <div class=\"d-flex\" *ngSwitchCase=\"gridFilterTypes.Date\">\n <dato-date-picker [attr.data-auto-id]=\"'condition-date-' + i + '-value'\"\n formControlName=\"value\" class=\"d-flex-grow range-calendar\">\n <ng-template>\n <dato-date-picker-range *ngIf=\"getOperandType(i) === rangeOperand; else singleDate\"></dato-date-picker-range>\n <ng-template #singleDate>\n <dato-date-picker-single></dato-date-picker-single>\n </ng-template>\n </ng-template>\n </dato-date-picker>\n </div>\n <ng-container *ngIf=\"!isConditionalEmpty(operand)\">\n <dato-input *ngSwitchCase=\"gridFilterTypes.String\" datoSize=\"sm\"\n (keydown.enter.stop.prevent)=\"closePopUp()\"\n datoControlErrors [attr.data-auto-id]=\"'condition-string-' + i + '-value'\"\n [datoControlErrorsOnBlur]=\"false\"\n class=\"condition-value\"\n placeholder=\"core.filter\" formControlName=\"value\"\n [isFocused]=\"conditionalContent._expanded\"\n ></dato-input>\n <div class=\"d-flex\" *ngSwitchCase=\"gridFilterTypes.Number\">\n <dato-input-number (keydown.enter.stop.prevent)=\"closePopUp()\" [showControls]=\"false\"\n class=\"width-100 condition-value\" allowNegative=\"true\">\n <input type=\"number\" formControlName=\"value\" [attr.data-auto-id]=\"'condition-number-' + i + '-value'\"\n datoInputNumber datoSize=\"sm\" datoControlErrors [datoAutoFocus]=\"conditionalContent._expanded\"\n [datoControlErrorsOnBlur]=\"false\"/>\n </dato-input-number>\n <ng-container *ngIf=\"getOperandType(i) === rangeOperand\">\n <div class=\"mx-5\">-</div>\n <dato-input-number (keydown.enter.stop.prevent)=\"closePopUp()\"\n class=\"width-100 condition-value\" allowNegative=\"true\">\n <input type=\"number\" formControlName=\"rangeEnd\" [attr.data-auto-id]=\"'condition-number-' + i + '-range-end'\"\n datoInputNumber datoSize=\"sm\" datoControlErrors\n [datoControlErrorsOnBlur]=\"false\"/>\n </dato-input-number>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n <div>\n\n <dato-icon-button datoSize=\"md\"\n datoType=\"none\" icon=\"trash\"\n class=\"overflow-hidden delete\"\n datoTooltip=\"core.deleteFilterCondition\"\n [attr.data-auto-id]=\"'condition-' + i + '-remove'\"\n (click)=\"removeCondition(i)\"\n datoTooltipPosition=\"right-start\"></dato-icon-button>\n </div>\n </div>\n <dato-operator-toggler class=\"mt-10 justify-center width-100 d-flex\" data-auto-id=\"operator-toggler\"\n expanded=\"true\" [datoTogglerValue]=\"conditionsOperator\"\n *ngIf=\"conditionsControls.length > 1 && !last\"\n formControlName=\"operator\"></dato-operator-toggler>\n </div>\n <div class=\"d-flex align-center\">\n <dato-link *ngIf=\"conditionsControls.length < 3\" class=\"no-select\" datoSize=\"sm\" data-auto-id=\"add-condition\"\n datoType=\"secondary\" (click)=\"addCondition()\">\n <dato-icon height=\"10px\" width=\"10px\" icon=\"plus-simple\"></dato-icon>\n {{ 'core.condition' | translate }}\n </dato-link>\n </div>\n </div>\n </dato-accordion-content>\n </dato-accordion-group>\n <div class=\"separator\"></div>\n </ng-container>\n <ng-container *ngIf=\"filterSections.By_Value\">\n <dato-accordion-group class=\"list-content\">\n <dato-accordion-header class=\"dato-note-bold primary-600-color\" data-auto-id=\"by-value-filters\"\n [class.primary-100-background-color]=\"header_2.isOpen\" #header_2>\n <div class=\"px-10 d-flex align-start-center\">\n <div class=\"filter-title d-flex d-flex-grow align-start-center\">{{'core.filterByValue' | translate}}</div>\n <dato-icon class=\"primary-200-color\" height=\"18px\"\n [icon]=\"header_2.isOpen ? 'collapse' : 'expand'\"></dato-icon>\n </div>\n </dato-accordion-header>\n <dato-accordion-content #byValueContent>\n <div class=\"value-content-container d-flex-column\">\n <dato-input datoSize=\"sm\" placeholder=\"core.search-all-values\" [debounceTime]=\"300\" #search [formControl]=\"listSearchControl\" [isFocused]=\"byValueContent._expanded\"></dato-input>\n <dato-list-v2 class=\"primary-0-background-color\"\n containerHeight=\"195px\"\n [withSelectAll]=\"true\"\n [clientSearch]=\"isClientSideGrid\"\n [sortByKey]=\"listSortByKey\"\n [labelType]=\"listLabelType\"\n [searchController]=\"search\"\n [options]=\"listOptions\"\n [isSortList]=\"!keepPredefinedListOriginalOrder\"\n [loading]=\"loadingList\"\n [noDataTpl]=\"isClientSideGrid ? null : noData\"\n formControlName=\"byValue\"\n data-auto-id=\"by-value-filters-list\">\n </dato-list-v2>\n <ng-template #noData>\n <div *ngIf=\"serverSearchErrored; else noResults\" class=\"mb-10 d-flex-1 d-flex-column align-center\" data-auto-id=\"by-value-server-error\">\n <img class=\"mt-20\" datoStaticSrc=\"core/grid/filter-server-error.svg\"/>\n <p class=\"dato-note-bold mt-10 mb-10 primary-300-color\">{{ 'core.something-went-wrong' | translate }}</p>\n <p class=\"dato-note-italic primary-300-color\">{{ 'core.try-again-later' | translate }}</p>\n </div>\n <ng-template #noResults>\n <dato-list-no-result class=\"mb-10 block\" data-auto-id=\"by-value-no-results\"></dato-list-no-result>\n </ng-template>\n </ng-template>\n </div>\n </dato-accordion-content>\n </dato-accordion-group>\n <div class=\"separator\"></div>\n </ng-container>\n </dato-accordion>\n </ng-container>\n <div class=\"actions no-select px-10 py-12 d-flex align-end-center\">\n <dato-link *ngIf=\"showClearFiltersButton\" class=\"mr-30\" datoType=\"secondary\" datoSize=\"sm\"\n (click)=\"clearFilters()\" data-auto-id=\"clear-filters\" [disabled]=\"!hasFilter\">\n {{ 'core.clearFilters' | translate }}\n </dato-link>\n <dato-button datoSize=\"sm\" [datoTooltip]=\"hotKeyTooltip\" [datoHotkeys]=\"applyHotKeyConfig\" (click)=\"closePopUp()\" data-auto-id=\"apply-filters\">{{'core.apply' | translate}}</dato-button>\n </div>\n</form>\n",
13218
+ template: "<form class=\"container primary-0-background-color\" [formGroup]=\"filterForm\" datoForm\n *datoSubscribe=\"hasFilter$ as hasFilter\">\n <ng-container>\n <dato-accordion closeOthers=\"true\" class=\"filter-options\" [activeIds]=\"activeAccordionId\">\n <ng-container *ngIf=\"filterSections.Conditional\">\n\n <dato-accordion-group>\n <dato-accordion-header class=\"dato-note-bold primary-600-color\" data-auto-id=\"conditional-filters\"\n [class.primary-100-background-color]=\"header_1.isOpen\" #header_1>\n <div class=\"px-10 d-flex align-start-center\">\n <div class=\"filter-title d-flex-grow d-flex align-start-center\">{{'core.filterByCondition' | translate}}</div>\n <dato-icon class=\"primary-200-color\" height=\"18px\"\n [icon]=\"header_1.isOpen ? 'collapse' : 'expand'\"></dato-icon>\n </div>\n </dato-accordion-header>\n <dato-accordion-content #conditionalContent>\n <div class=\"conditional-content-container d-flex-column\" formGroupName=\"conditional\"\n [class.multi-conditions]=\"conditionsControls.length > 1\">\n <div class=\"operand d-flex-column mb-10\"\n [attr.data-auto-id]=\"'condition-' + i\"\n *ngFor=\"let operand of conditionsControls; index as i; last as last\">\n <div class=\"d-flex\">\n <div class=\"d-flex-column d-flex-grow min-width-0\">\n <ng-container formArrayName=\"conditions\">\n\n <ng-container [formGroupName]=\"i\">\n <dato-select datoSize=\"sm\" class=\"mb-10\" [attr.data-auto-id]=\"'condition-' + i + '-operand'\" formControlName=\"type\"\n datoSelectClass=\"operand-select\"\n [dataSet]=\"conditionalFilterOptions\"\n [isCombo]=\"false\" #select>\n <dato-option *ngFor=\"let option of select.data; index as index\"\n [option]=\"option\">\n {{ option.label }}\n </dato-option>\n </dato-select>\n <ng-container [ngSwitch]=\"filterType\">\n <div class=\"d-flex\" *ngSwitchCase=\"gridFilterTypes.Date\">\n <dato-date-picker [attr.data-auto-id]=\"'condition-date-' + i + '-value'\"\n formControlName=\"value\" class=\"d-flex-grow range-calendar\">\n <ng-template>\n <dato-date-picker-range *ngIf=\"getOperandType(i) === rangeOperand; else singleDate\"></dato-date-picker-range>\n <ng-template #singleDate>\n <dato-date-picker-single></dato-date-picker-single>\n </ng-template>\n </ng-template>\n </dato-date-picker>\n </div>\n <ng-container *ngIf=\"!isConditionalEmpty(operand)\">\n <dato-input *ngSwitchCase=\"gridFilterTypes.String\" datoSize=\"sm\"\n (keydown.enter.stop.prevent)=\"closePopUp()\"\n datoControlErrors [attr.data-auto-id]=\"'condition-string-' + i + '-value'\"\n [datoControlErrorsOnBlur]=\"false\"\n class=\"condition-value\"\n placeholder=\"core.filter\" formControlName=\"value\"\n [isFocused]=\"conditionalContent._expanded\"\n ></dato-input>\n <div class=\"d-flex\" *ngSwitchCase=\"gridFilterTypes.Number\">\n <dato-input-number (keydown.enter.stop.prevent)=\"closePopUp()\" [showControls]=\"false\"\n class=\"width-100 condition-value\" allowNegative=\"true\">\n <input type=\"number\" formControlName=\"value\" [attr.data-auto-id]=\"'condition-number-' + i + '-value'\"\n datoInputNumber datoSize=\"sm\" datoControlErrors [datoAutoFocus]=\"conditionalContent._expanded\"\n [datoControlErrorsOnBlur]=\"false\"/>\n </dato-input-number>\n <ng-container *ngIf=\"getOperandType(i) === rangeOperand\">\n <div class=\"mx-5\">-</div>\n <dato-input-number (keydown.enter.stop.prevent)=\"closePopUp()\"\n class=\"width-100 condition-value\" allowNegative=\"true\">\n <input type=\"number\" formControlName=\"rangeEnd\" [attr.data-auto-id]=\"'condition-number-' + i + '-range-end'\"\n datoInputNumber datoSize=\"sm\" datoControlErrors\n [datoControlErrorsOnBlur]=\"false\"/>\n </dato-input-number>\n </ng-container>\n </div>\n </ng-container>\n </ng-container>\n </ng-container>\n </ng-container>\n </div>\n <div>\n\n <dato-icon-button datoSize=\"md\"\n datoType=\"none\" icon=\"trash\"\n class=\"overflow-hidden delete\"\n datoTooltip=\"core.deleteFilterCondition\"\n [attr.data-auto-id]=\"'condition-' + i + '-remove'\"\n (click)=\"removeCondition(i)\"\n datoTooltipPosition=\"right-start\"></dato-icon-button>\n </div>\n </div>\n <dato-operator-toggler class=\"mt-10 justify-center width-100 d-flex\" data-auto-id=\"operator-toggler\"\n expanded=\"true\" [datoTogglerValue]=\"conditionsOperator\"\n *ngIf=\"conditionsControls.length > 1 && !last\"\n formControlName=\"operator\" #operatorToggler></dato-operator-toggler>\n </div>\n <div class=\"d-flex align-center\">\n <dato-link *ngIf=\"conditionsControls.length < 3\" class=\"no-select\" datoSize=\"sm\" data-auto-id=\"add-condition\"\n datoType=\"secondary\" (click)=\"addCondition()\">\n <dato-icon height=\"10px\" width=\"10px\" icon=\"plus-simple\"></dato-icon>\n {{ 'core.condition' | translate }}\n </dato-link>\n </div>\n </div>\n </dato-accordion-content>\n </dato-accordion-group>\n <div class=\"separator\"></div>\n </ng-container>\n <ng-container *ngIf=\"filterSections.By_Value\">\n <dato-accordion-group class=\"list-content\">\n <dato-accordion-header class=\"dato-note-bold primary-600-color\" data-auto-id=\"by-value-filters\"\n [class.primary-100-background-color]=\"header_2.isOpen\" #header_2>\n <div class=\"px-10 d-flex align-start-center\">\n <div class=\"filter-title d-flex d-flex-grow align-start-center\">{{'core.filterByValue' | translate}}</div>\n <dato-icon class=\"primary-200-color\" height=\"18px\"\n [icon]=\"header_2.isOpen ? 'collapse' : 'expand'\"></dato-icon>\n </div>\n </dato-accordion-header>\n <dato-accordion-content #byValueContent>\n <div class=\"value-content-container d-flex-column\">\n <dato-input datoSize=\"sm\" placeholder=\"core.search-all-values\" [debounceTime]=\"300\" #search [formControl]=\"listSearchControl\" [isFocused]=\"byValueContent._expanded\"></dato-input>\n <dato-list-v2 class=\"primary-0-background-color\"\n containerHeight=\"195px\"\n [withSelectAll]=\"true\"\n [clientSearch]=\"isClientSideGrid\"\n [sortByKey]=\"listSortByKey\"\n [labelType]=\"listLabelType\"\n [searchController]=\"search\"\n [options]=\"listOptions\"\n [isSortList]=\"!keepPredefinedListOriginalOrder\"\n [loading]=\"loadingList\"\n [noDataTpl]=\"isClientSideGrid ? null : noData\"\n formControlName=\"byValue\"\n data-auto-id=\"by-value-filters-list\">\n </dato-list-v2>\n <ng-template #noData>\n <div *ngIf=\"serverSearchErrored; else noResults\" class=\"mb-10 d-flex-1 d-flex-column align-center\" data-auto-id=\"by-value-server-error\">\n <img class=\"mt-20\" datoStaticSrc=\"core/grid/filter-server-error.svg\"/>\n <p class=\"dato-note-bold mt-10 mb-10 primary-300-color\">{{ 'core.something-went-wrong' | translate }}</p>\n <p class=\"dato-note-italic primary-300-color\">{{ 'core.try-again-later' | translate }}</p>\n </div>\n <ng-template #noResults>\n <dato-list-no-result class=\"mb-10 block\" data-auto-id=\"by-value-no-results\"></dato-list-no-result>\n </ng-template>\n </ng-template>\n </div>\n </dato-accordion-content>\n </dato-accordion-group>\n <div class=\"separator\"></div>\n </ng-container>\n </dato-accordion>\n </ng-container>\n <div class=\"actions no-select px-10 py-12 d-flex align-end-center\">\n <dato-link *ngIf=\"showClearFiltersButton\" class=\"mr-30\" datoType=\"secondary\" datoSize=\"sm\"\n (click)=\"clearFilters()\" data-auto-id=\"clear-filters\" [disabled]=\"!hasFilter\">\n {{ 'core.clearFilters' | translate }}\n </dato-link>\n <dato-button datoSize=\"sm\" [datoTooltip]=\"hotKeyTooltip\" [datoHotkeys]=\"applyHotKeyConfig\" (click)=\"closePopUp()\" data-auto-id=\"apply-filters\">{{'core.apply' | translate}}</dato-button>\n </div>\n</form>\n",
13197
13219
  changeDetection: ChangeDetectionStrategy.OnPush,
13198
13220
  styles: [":host dato-accordion-header{transition:background-color .2s ease-in-out}:host>.container{width:242px}:host .value-content-container dato-input{padding:10px}:host .conditional-content-container{padding:10px;transition:padding-right .2s ease-in-out}:host .conditional-content-container.multi-conditions{padding-right:0}:host .conditional-content-container.multi-conditions .delete{width:24px}:host .filter-title{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;height:40px;transition:color .2s ease-in-out}:host .separator{height:1px;width:100%}:host .delete{transition:width .2s ease-in-out;width:0}"]
13199
13221
  }),
@@ -21247,7 +21269,6 @@ var DatoRichTextDirective = /** @class */ (function (_super) {
21247
21269
  target: this.host.nativeElement,
21248
21270
  width: this.width || 600,
21249
21271
  height: this.height || 300,
21250
- force_br_newlines: true,
21251
21272
  resize: 'both',
21252
21273
  branding: false,
21253
21274
  inline: this.inline,
@@ -21255,7 +21276,7 @@ var DatoRichTextDirective = /** @class */ (function (_super) {
21255
21276
  readonly: this.disabled,
21256
21277
  plugins: this.plugins || this.defaultPlugins,
21257
21278
  toolbar: isNil(this.toolbar) ? this.defaultToolbar : this.toolbar,
21258
- fontsize_formats: '8px 10px 12px 14px 18px 24px 36px',
21279
+ font_size_formats: '8px 10px 12px 14px 18px 24px 36px',
21259
21280
  min_width: 480,
21260
21281
  menubar: false,
21261
21282
  autocomplete: this.autocompleteOptions,
@@ -25275,7 +25296,7 @@ function fixNgLeaks() {
25275
25296
  };
25276
25297
  }
25277
25298
 
25278
- window.coreVersion = '22.9.2-rc.';
25299
+ window.coreVersion = '22.10.1-rc.';
25279
25300
 
25280
25301
  /**
25281
25302
  * @license