@datorama/core 22.9.2-rc.4 → 22.9.2-rc.6

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.
@@ -8551,6 +8551,7 @@
8551
8551
  this.limitSelectedTo = limitSelectedTo;
8552
8552
  if (this.options) {
8553
8553
  this.updateDisabledState();
8554
+ this.cdr.markForCheck();
8554
8555
  }
8555
8556
  },
8556
8557
  enumerable: true,
@@ -12770,6 +12771,20 @@
12770
12771
  this.showClearFiltersButton = true;
12771
12772
  this.excludedValues = new Set();
12772
12773
  }
12774
+ Object.defineProperty(DatoGridFilterComponent.prototype, "operatorToggler", {
12775
+ set: function (togglers) {
12776
+ if (togglers && this.inputConditionsOperator) {
12777
+ togglers.forEach(function (toggler) {
12778
+ if (!toggler.isDisabled) {
12779
+ toggler.setDisabledState(true);
12780
+ }
12781
+ });
12782
+ this.cdr.detectChanges();
12783
+ }
12784
+ },
12785
+ enumerable: true,
12786
+ configurable: true
12787
+ });
12773
12788
  Object.defineProperty(DatoGridFilterComponent.prototype, "byValueControl", {
12774
12789
  get: function () {
12775
12790
  return this.filterForm.get('byValue');
@@ -12813,7 +12828,7 @@
12813
12828
  Object.defineProperty(DatoGridFilterComponent.prototype, "defaultConditional", {
12814
12829
  get: function () {
12815
12830
  return this.fb.group({
12816
- operator: [exports.OperatorTypes.AND],
12831
+ operator: [this.inputConditionsOperator || exports.OperatorTypes.AND],
12817
12832
  conditions: this.fb.array([this.defaultOperand])
12818
12833
  });
12819
12834
  },
@@ -12882,6 +12897,7 @@
12882
12897
  var colFilter = filter || colDef.filter;
12883
12898
  var filterOptions = DatoGridFilterOptionsMap[colFilter];
12884
12899
  this.pivotColumn = gridQuery.api.columns.getSecondaryPivotColumn(pivotKeys, pivotValueColumn);
12900
+ this.inputConditionsOperator = filtersConfig.inputConditionsOperator;
12885
12901
  if (!isNil(filtersConfig.showClearFiltersButton)) {
12886
12902
  this.showClearFiltersButton = filtersConfig.showClearFiltersButton;
12887
12903
  }
@@ -13219,7 +13235,7 @@
13219
13235
  return this.defaultConditional;
13220
13236
  }
13221
13237
  return this.fb.group({
13222
- operator: [conditional.operator],
13238
+ operator: [this.inputConditionsOperator || conditional.operator],
13223
13239
  conditions: this.fb.array(this.buildConditions(conditional.conditions))
13224
13240
  });
13225
13241
  };
@@ -13389,10 +13405,15 @@
13389
13405
  { type: DatoTranslateService },
13390
13406
  { type: core.ChangeDetectorRef }
13391
13407
  ]; };
13408
+ __decorate([
13409
+ core.ViewChildren('operatorToggler'),
13410
+ __metadata("design:type", core.QueryList),
13411
+ __metadata("design:paramtypes", [core.QueryList])
13412
+ ], DatoGridFilterComponent.prototype, "operatorToggler", null);
13392
13413
  DatoGridFilterComponent = __decorate([
13393
13414
  core.Component({
13394
13415
  selector: 'dato-grid-filter',
13395
- 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",
13416
+ 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",
13396
13417
  changeDetection: core.ChangeDetectionStrategy.OnPush,
13397
13418
  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}"]
13398
13419
  }),
@@ -25473,7 +25494,7 @@
25473
25494
  };
25474
25495
  }
25475
25496
 
25476
- window.coreVersion = '22.9.2-rc.';
25497
+ window.coreVersion = '22.10.1-rc.';
25477
25498
 
25478
25499
  exports.APP_TRANSLATE = APP_TRANSLATE;
25479
25500
  exports.AceService = AceService;