chrv-components 1.12.19 → 1.12.21

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.
Binary file
@@ -144,10 +144,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
144
144
  }], ctorParameters: () => [], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], position: [{ type: i0.Input, args: [{ isSignal: true, alias: "position", required: false }] }], originElement: [{ type: i0.Input, args: [{ isSignal: true, alias: "originElement", required: false }] }] } });
145
145
 
146
146
  class DebounceDefaults {
147
- constructor() {
147
+ constructor(init) {
148
148
  this.baseInputs = 200;
149
149
  this.searchableInputs = 400;
150
150
  this.hoverTitle = 500;
151
+ Object.assign(this, init);
151
152
  }
152
153
  }
153
154
  const CHR_DEBOUNCE_DEFAULTS = new InjectionToken('CHR_DEBOUNCE_DEFAULTS', {
@@ -5594,16 +5595,18 @@ class ChrDebounceDirective {
5594
5595
  this.subject = new Subject();
5595
5596
  this.chrDebounceTime = input(null, ...(ngDevMode ? [{ debugName: "chrDebounceTime" }] : []));
5596
5597
  this.debounceTimeValue = computed(() => {
5597
- if (this.chrDebounceTime() !== null) {
5598
- return this.chrDebounceTime();
5598
+ const time = this.chrDebounceTime();
5599
+ if (time !== null && !isNaN(Number(time))) {
5600
+ return Number(time);
5599
5601
  }
5600
5602
  return this.defaults.baseInputs;
5601
5603
  }, ...(ngDevMode ? [{ debugName: "debounceTimeValue" }] : []));
5602
- this.subscription = this.subject.pipe(debounceTime$1(this.debounceTimeValue()));
5604
+ this.subscription = of();
5603
5605
  this.isDispatching = false;
5604
5606
  }
5605
5607
  ngOnInit() {
5606
5608
  const element = this.host.nativeElement;
5609
+ this.subscription = this.subject.pipe(debounceTime$1(this.debounceTimeValue()));
5607
5610
  // Listener en phase CAPTURE pour intercepter AVANT tous les listeners Angular
5608
5611
  this.captureListener = this.renderer.listen(element, 'input', (event) => {
5609
5612
  if (this.isDispatching) {
@@ -5736,7 +5739,7 @@ class ColumnFilter {
5736
5739
  });
5737
5740
  }
5738
5741
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ColumnFilter, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
5739
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: ColumnFilter, isStandalone: true, selector: "chr-column-filter", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, by: { classPropertyName: "by", publicName: "by", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, columnMetadata: { classPropertyName: "columnMetadata", publicName: "columnMetadata", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", mode: "modeChange", value: "valueChange", filterChange: "filterChange" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"filter-wrapper\" [OutsideClickAware]=\"isOpen()\" (outsideClick)=\"isOpen.set(false);apply()\">\r\n <span class=\"mat-icon filter-icon toggle\" (dblclick)=\"toggle()\">filter_list</span>\r\n @if(isOpen()){\r\n <div class=\"input-wrapper\" (keyup.enter)=\"apply()\" title=\"Appuyer sur enter pour appliquer le filtre\">\r\n <input #modeSelector type=\"text\" class=\"filter-input mode-selector\" (input)=\"log($event)\"\r\n [value]=\"mode() !== null ? getModeLabel(mode()!): ''\" [chrAutofocus]=\"mode() === null\"\r\n placeholder=\"Type de filtre\" />\r\n <chr-data-list for=\"column-filter-mode-{{by()}}\" [suggestions]=\"filterModes()\"\r\n (optionSelected)=\"this.mode.set($event.index)\" [targetElement]=\"modeSelector\"></chr-data-list>\r\n <div class=\"input-wrapper\">\r\n <div class=\"input-and-error\">\r\n <input #inputElement [type]=\"formatter()?.getEditInputType(columnMetadata())\"\r\n placeholder=\"Valeur du filtre\" class=\"filter-input form-control no-input-buttons\" [value]=\"value()\"\r\n chrDebounce (input)=\"onInputChange($any($event).target.value)\" [chrAutofocus]=\"mode() !== null \" />\r\n <chr-data-list for=\"column-filter-{{by()}}\" [suggestions]=\"suggestions()\" [blurOnSelect]=\"false\"\r\n (optionSelected)=\"value.set($event.value)\" [targetElement]=\"inputElement\"></chr-data-list>\r\n <div class=\"error-message\" [title]=\"error()\" [class.hidden]=\"!error()\">\r\n {{ error() }}\r\n </div>\r\n </div>\r\n <!-- <span class=\"mat-icon apply-button\" title=\"Cliquez pour appliquer le filtre\" (click)=\"apply()\">check</span> -->\r\n </div>\r\n </div>\r\n } @else {\r\n @let val = value();\r\n @if(val){\r\n <span class=\"toggle\" (dblclick)=\"toggle()\">{{getModeLabel(mode()!)}} {{ val ? `\"${val}\"` : '' }}</span>\r\n }\r\n @else {\r\n <span class=\"toggle faded\" (dblclick)=\"toggle()\">Appliquer un filtre</span>\r\n }\r\n }\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols:opsz,wght,FILL,GRAD@24,400,0,0\";@import\"https://fonts.googleapis.com/css2?family=Material+Icons\";.form{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}.form button{color:var(--text-color);cursor:pointer;border-radius:.25rem}.form button:hover{background-color:var(--neutral-color)}.form-inline-buttons{grid-column:span 6;display:flex;justify-items:center;align-items:center;gap:.5rem}.form-control{grid-column:span 6;display:flex;flex-direction:column}.form-control::placeholder{color:color-mix(in srgb,var(--text-color) 40%,transparent 60%);font-weight:550}.form-control.with-inline-button{display:flex;flex-direction:row;gap:.5rem;align-items:center}.form-control.with-inline-button>:nth-child(-n+1){display:flex;flex-direction:column;width:100%}.form-control.with-inline-button>:nth-child(2){display:flex;justify-content:center}.form-control.full-width,.advanced-search-dropdown{grid-column:span 12}.advanced-search-dropdown .form-control:first-child{margin-top:.25rem}.form-actions{grid-column:span 12;display:flex;gap:1rem;justify-content:space-between}.mat-icon:not(mat-icon),.material-symbols{font-family:Material Symbols;font-size:1.5rem;display:flex;align-items:center;justify-content:center}:is(.mat-icon:not(mat-icon),.material-symbols).small{font-size:1rem}:is(.mat-icon:not(mat-icon),.material-symbols).large{font-size:2rem}:host{position:relative;display:flex;width:100%;min-height:1.5rem;max-height:2.5rem}.filter-wrapper{display:flex;align-items:center;width:100%}.filter-wrapper .toggle{cursor:pointer}.filter-wrapper .mat-icon{font-size:1rem;justify-content:start;flex-shrink:0}.filter-wrapper .input-wrapper{position:relative;display:flex;flex-direction:column;gap:.25rem;width:100%}.filter-wrapper .input-wrapper .apply-button{position:absolute;right:0;top:50%;width:min-content;transform:translateY(-50%);cursor:pointer}.filter-wrapper .mode-selector{border:0;outline:none;width:100%}.filter-wrapper .mode-selector option{border:none;outline:none}.filter-wrapper .error-message{height:0px;color:var(--error-color);font-size:.75rem;margin-top:.25rem;overflow:visible;text-overflow:ellipsis}.filter-wrapper .filter-input{outline:none;border:0;border-bottom:1px solid var(--neutral-color)}.filter-wrapper .filter-input:focus{border-bottom:1px solid var(--primary-color)}.filter-wrapper .filter-input,.filter-wrapper .mode-selector{background-color:inherit;color:var(--text-color)}.filter-wrapper .input-and-error{display:flex;flex-direction:column;margin-left:.15rem}.filter-wrapper .hidden{display:none}.filter-wrapper .no-input-buttons{appearance:textfield;-moz-appearance:textfield}.filter-wrapper .no-input-buttons::-webkit-calendar-picker-indicator,.filter-wrapper .no-input-buttons::-webkit-outer-spin-button,.filter-wrapper .no-input-buttons::-webkit-inner-spin-button{display:none;-webkit-appearance:none;margin:0}.filter-wrapper .faded{color:var(--faded-text-color)}.filter-wrapper .toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}\n"], dependencies: [{ kind: "component", type: DataListComponent, selector: "chr-data-list", inputs: ["suggestions", "for", "allowStringify", "display", "targetElement", "blurOnSelect"], outputs: ["optionSelected"] }, { kind: "directive", type: OutsideClickAwareDirective, selector: "[OutsideClickAware]", inputs: ["OutsideClickAware"], outputs: ["outsideClick"] }, { kind: "directive", type: AutofocusDirective, selector: "[chrAutofocus]", inputs: ["chrAutofocus"] }, { kind: "directive", type: ChrHoverTitleDirective, selector: "[chrTitle], [title]", inputs: ["chrTitle", "chrTitlePosition", "chrTitleSnap", "chrTitleDebounce"], outputs: ["chrTitleChange"] }, { kind: "directive", type: ChrDebounceDirective, selector: "[chrDebounce]", inputs: ["chrDebounceTime"] }] }); }
5742
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.0.8", type: ColumnFilter, isStandalone: true, selector: "chr-column-filter", inputs: { isOpen: { classPropertyName: "isOpen", publicName: "isOpen", isSignal: true, isRequired: false, transformFunction: null }, by: { classPropertyName: "by", publicName: "by", isSignal: true, isRequired: true, transformFunction: null }, suggestions: { classPropertyName: "suggestions", publicName: "suggestions", isSignal: true, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: true, isRequired: false, transformFunction: null }, columnMetadata: { classPropertyName: "columnMetadata", publicName: "columnMetadata", isSignal: true, isRequired: true, transformFunction: null }, value: { classPropertyName: "value", publicName: "value", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isOpen: "isOpenChange", mode: "modeChange", value: "valueChange", filterChange: "filterChange" }, viewQueries: [{ propertyName: "inputRef", first: true, predicate: ["inputElement"], descendants: true, isSignal: true }], ngImport: i0, template: "<div class=\"filter-wrapper\" [OutsideClickAware]=\"isOpen()\" (outsideClick)=\"isOpen.set(false);apply()\">\r\n <span class=\"mat-icon filter-icon toggle\" (dblclick)=\"toggle()\">filter_list</span>\r\n @if(isOpen()){\r\n <div class=\"input-wrapper\" (keyup.enter)=\"apply()\" title=\"Appuyer sur enter pour appliquer le filtre\">\r\n <input #modeSelector type=\"text\" class=\"filter-input mode-selector\" (input)=\"log($event)\"\r\n [value]=\"mode() !== null ? getModeLabel(mode()!): ''\" [chrAutofocus]=\"mode() === null\"\r\n placeholder=\"Type de filtre\" />\r\n <chr-data-list for=\"column-filter-mode-{{by()}}\" [suggestions]=\"filterModes()\"\r\n (optionSelected)=\"this.mode.set($event.index)\" [targetElement]=\"modeSelector\"></chr-data-list>\r\n <div class=\"input-wrapper\">\r\n <div class=\"input-and-error\">\r\n <input #inputElement [type]=\"formatter()?.getEditInputType(columnMetadata())\"\r\n placeholder=\"Valeur du filtre\" class=\"filter-input form-control no-input-buttons\" [value]=\"value()\"\r\n chrDebounce [chrDebounceTime]=\"600\" (input)=\"onInputChange($any($event).target.value)\"\r\n [chrAutofocus]=\"mode() !== null \" />\r\n <chr-data-list for=\"column-filter-{{by()}}\" [suggestions]=\"suggestions()\" [blurOnSelect]=\"false\"\r\n (optionSelected)=\"value.set($event.value)\" [targetElement]=\"inputElement\"></chr-data-list>\r\n <div class=\"error-message\" [title]=\"error()\" [class.hidden]=\"!error()\">\r\n {{ error() }}\r\n </div>\r\n </div>\r\n <!-- <span class=\"mat-icon apply-button\" title=\"Cliquez pour appliquer le filtre\" (click)=\"apply()\">check</span> -->\r\n </div>\r\n </div>\r\n } @else {\r\n @let val = value();\r\n @if(val){\r\n <span class=\"toggle\" (dblclick)=\"toggle()\">{{getModeLabel(mode()!)}} {{ val ? `\"${val}\"` : '' }}</span>\r\n }\r\n @else {\r\n <span class=\"toggle faded\" (dblclick)=\"toggle()\">Appliquer un filtre</span>\r\n }\r\n }\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols:opsz,wght,FILL,GRAD@24,400,0,0\";@import\"https://fonts.googleapis.com/css2?family=Material+Icons\";.form{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}.form button{color:var(--text-color);cursor:pointer;border-radius:.25rem}.form button:hover{background-color:var(--neutral-color)}.form-inline-buttons{grid-column:span 6;display:flex;justify-items:center;align-items:center;gap:.5rem}.form-control{grid-column:span 6;display:flex;flex-direction:column}.form-control::placeholder{color:color-mix(in srgb,var(--text-color) 40%,transparent 60%);font-weight:550}.form-control.with-inline-button{display:flex;flex-direction:row;gap:.5rem;align-items:center}.form-control.with-inline-button>:nth-child(-n+1){display:flex;flex-direction:column;width:100%}.form-control.with-inline-button>:nth-child(2){display:flex;justify-content:center}.form-control.full-width,.advanced-search-dropdown{grid-column:span 12}.advanced-search-dropdown .form-control:first-child{margin-top:.25rem}.form-actions{grid-column:span 12;display:flex;gap:1rem;justify-content:space-between}.mat-icon:not(mat-icon),.material-symbols{font-family:Material Symbols;font-size:1.5rem;display:flex;align-items:center;justify-content:center}:is(.mat-icon:not(mat-icon),.material-symbols).small{font-size:1rem}:is(.mat-icon:not(mat-icon),.material-symbols).large{font-size:2rem}:host{position:relative;display:flex;width:100%;min-height:1.5rem;max-height:2.5rem}.filter-wrapper{display:flex;align-items:center;width:100%}.filter-wrapper .toggle{cursor:pointer}.filter-wrapper .mat-icon{font-size:1rem;justify-content:start;flex-shrink:0}.filter-wrapper .input-wrapper{position:relative;display:flex;flex-direction:column;gap:.25rem;width:100%}.filter-wrapper .input-wrapper .apply-button{position:absolute;right:0;top:50%;width:min-content;transform:translateY(-50%);cursor:pointer}.filter-wrapper .mode-selector{border:0;outline:none;width:100%}.filter-wrapper .mode-selector option{border:none;outline:none}.filter-wrapper .error-message{height:0px;color:var(--error-color);font-size:.75rem;margin-top:.25rem;overflow:visible;text-overflow:ellipsis}.filter-wrapper .filter-input{outline:none;border:0;border-bottom:1px solid var(--neutral-color)}.filter-wrapper .filter-input:focus{border-bottom:1px solid var(--primary-color)}.filter-wrapper .filter-input,.filter-wrapper .mode-selector{background-color:inherit;color:var(--text-color)}.filter-wrapper .input-and-error{display:flex;flex-direction:column;margin-left:.15rem}.filter-wrapper .hidden{display:none}.filter-wrapper .no-input-buttons{appearance:textfield;-moz-appearance:textfield}.filter-wrapper .no-input-buttons::-webkit-calendar-picker-indicator,.filter-wrapper .no-input-buttons::-webkit-outer-spin-button,.filter-wrapper .no-input-buttons::-webkit-inner-spin-button{display:none;-webkit-appearance:none;margin:0}.filter-wrapper .faded{color:var(--faded-text-color)}.filter-wrapper .toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}\n"], dependencies: [{ kind: "component", type: DataListComponent, selector: "chr-data-list", inputs: ["suggestions", "for", "allowStringify", "display", "targetElement", "blurOnSelect"], outputs: ["optionSelected"] }, { kind: "directive", type: OutsideClickAwareDirective, selector: "[OutsideClickAware]", inputs: ["OutsideClickAware"], outputs: ["outsideClick"] }, { kind: "directive", type: AutofocusDirective, selector: "[chrAutofocus]", inputs: ["chrAutofocus"] }, { kind: "directive", type: ChrHoverTitleDirective, selector: "[chrTitle], [title]", inputs: ["chrTitle", "chrTitlePosition", "chrTitleSnap", "chrTitleDebounce"], outputs: ["chrTitleChange"] }, { kind: "directive", type: ChrDebounceDirective, selector: "[chrDebounce]", inputs: ["chrDebounceTime"] }] }); }
5740
5743
  }
5741
5744
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImport: i0, type: ColumnFilter, decorators: [{
5742
5745
  type: Component,
@@ -5746,7 +5749,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.0.8", ngImpor
5746
5749
  AutofocusDirective,
5747
5750
  ChrHoverTitleDirective,
5748
5751
  ChrDebounceDirective,
5749
- ], template: "<div class=\"filter-wrapper\" [OutsideClickAware]=\"isOpen()\" (outsideClick)=\"isOpen.set(false);apply()\">\r\n <span class=\"mat-icon filter-icon toggle\" (dblclick)=\"toggle()\">filter_list</span>\r\n @if(isOpen()){\r\n <div class=\"input-wrapper\" (keyup.enter)=\"apply()\" title=\"Appuyer sur enter pour appliquer le filtre\">\r\n <input #modeSelector type=\"text\" class=\"filter-input mode-selector\" (input)=\"log($event)\"\r\n [value]=\"mode() !== null ? getModeLabel(mode()!): ''\" [chrAutofocus]=\"mode() === null\"\r\n placeholder=\"Type de filtre\" />\r\n <chr-data-list for=\"column-filter-mode-{{by()}}\" [suggestions]=\"filterModes()\"\r\n (optionSelected)=\"this.mode.set($event.index)\" [targetElement]=\"modeSelector\"></chr-data-list>\r\n <div class=\"input-wrapper\">\r\n <div class=\"input-and-error\">\r\n <input #inputElement [type]=\"formatter()?.getEditInputType(columnMetadata())\"\r\n placeholder=\"Valeur du filtre\" class=\"filter-input form-control no-input-buttons\" [value]=\"value()\"\r\n chrDebounce (input)=\"onInputChange($any($event).target.value)\" [chrAutofocus]=\"mode() !== null \" />\r\n <chr-data-list for=\"column-filter-{{by()}}\" [suggestions]=\"suggestions()\" [blurOnSelect]=\"false\"\r\n (optionSelected)=\"value.set($event.value)\" [targetElement]=\"inputElement\"></chr-data-list>\r\n <div class=\"error-message\" [title]=\"error()\" [class.hidden]=\"!error()\">\r\n {{ error() }}\r\n </div>\r\n </div>\r\n <!-- <span class=\"mat-icon apply-button\" title=\"Cliquez pour appliquer le filtre\" (click)=\"apply()\">check</span> -->\r\n </div>\r\n </div>\r\n } @else {\r\n @let val = value();\r\n @if(val){\r\n <span class=\"toggle\" (dblclick)=\"toggle()\">{{getModeLabel(mode()!)}} {{ val ? `\"${val}\"` : '' }}</span>\r\n }\r\n @else {\r\n <span class=\"toggle faded\" (dblclick)=\"toggle()\">Appliquer un filtre</span>\r\n }\r\n }\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols:opsz,wght,FILL,GRAD@24,400,0,0\";@import\"https://fonts.googleapis.com/css2?family=Material+Icons\";.form{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}.form button{color:var(--text-color);cursor:pointer;border-radius:.25rem}.form button:hover{background-color:var(--neutral-color)}.form-inline-buttons{grid-column:span 6;display:flex;justify-items:center;align-items:center;gap:.5rem}.form-control{grid-column:span 6;display:flex;flex-direction:column}.form-control::placeholder{color:color-mix(in srgb,var(--text-color) 40%,transparent 60%);font-weight:550}.form-control.with-inline-button{display:flex;flex-direction:row;gap:.5rem;align-items:center}.form-control.with-inline-button>:nth-child(-n+1){display:flex;flex-direction:column;width:100%}.form-control.with-inline-button>:nth-child(2){display:flex;justify-content:center}.form-control.full-width,.advanced-search-dropdown{grid-column:span 12}.advanced-search-dropdown .form-control:first-child{margin-top:.25rem}.form-actions{grid-column:span 12;display:flex;gap:1rem;justify-content:space-between}.mat-icon:not(mat-icon),.material-symbols{font-family:Material Symbols;font-size:1.5rem;display:flex;align-items:center;justify-content:center}:is(.mat-icon:not(mat-icon),.material-symbols).small{font-size:1rem}:is(.mat-icon:not(mat-icon),.material-symbols).large{font-size:2rem}:host{position:relative;display:flex;width:100%;min-height:1.5rem;max-height:2.5rem}.filter-wrapper{display:flex;align-items:center;width:100%}.filter-wrapper .toggle{cursor:pointer}.filter-wrapper .mat-icon{font-size:1rem;justify-content:start;flex-shrink:0}.filter-wrapper .input-wrapper{position:relative;display:flex;flex-direction:column;gap:.25rem;width:100%}.filter-wrapper .input-wrapper .apply-button{position:absolute;right:0;top:50%;width:min-content;transform:translateY(-50%);cursor:pointer}.filter-wrapper .mode-selector{border:0;outline:none;width:100%}.filter-wrapper .mode-selector option{border:none;outline:none}.filter-wrapper .error-message{height:0px;color:var(--error-color);font-size:.75rem;margin-top:.25rem;overflow:visible;text-overflow:ellipsis}.filter-wrapper .filter-input{outline:none;border:0;border-bottom:1px solid var(--neutral-color)}.filter-wrapper .filter-input:focus{border-bottom:1px solid var(--primary-color)}.filter-wrapper .filter-input,.filter-wrapper .mode-selector{background-color:inherit;color:var(--text-color)}.filter-wrapper .input-and-error{display:flex;flex-direction:column;margin-left:.15rem}.filter-wrapper .hidden{display:none}.filter-wrapper .no-input-buttons{appearance:textfield;-moz-appearance:textfield}.filter-wrapper .no-input-buttons::-webkit-calendar-picker-indicator,.filter-wrapper .no-input-buttons::-webkit-outer-spin-button,.filter-wrapper .no-input-buttons::-webkit-inner-spin-button{display:none;-webkit-appearance:none;margin:0}.filter-wrapper .faded{color:var(--faded-text-color)}.filter-wrapper .toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}\n"] }]
5752
+ ], template: "<div class=\"filter-wrapper\" [OutsideClickAware]=\"isOpen()\" (outsideClick)=\"isOpen.set(false);apply()\">\r\n <span class=\"mat-icon filter-icon toggle\" (dblclick)=\"toggle()\">filter_list</span>\r\n @if(isOpen()){\r\n <div class=\"input-wrapper\" (keyup.enter)=\"apply()\" title=\"Appuyer sur enter pour appliquer le filtre\">\r\n <input #modeSelector type=\"text\" class=\"filter-input mode-selector\" (input)=\"log($event)\"\r\n [value]=\"mode() !== null ? getModeLabel(mode()!): ''\" [chrAutofocus]=\"mode() === null\"\r\n placeholder=\"Type de filtre\" />\r\n <chr-data-list for=\"column-filter-mode-{{by()}}\" [suggestions]=\"filterModes()\"\r\n (optionSelected)=\"this.mode.set($event.index)\" [targetElement]=\"modeSelector\"></chr-data-list>\r\n <div class=\"input-wrapper\">\r\n <div class=\"input-and-error\">\r\n <input #inputElement [type]=\"formatter()?.getEditInputType(columnMetadata())\"\r\n placeholder=\"Valeur du filtre\" class=\"filter-input form-control no-input-buttons\" [value]=\"value()\"\r\n chrDebounce [chrDebounceTime]=\"600\" (input)=\"onInputChange($any($event).target.value)\"\r\n [chrAutofocus]=\"mode() !== null \" />\r\n <chr-data-list for=\"column-filter-{{by()}}\" [suggestions]=\"suggestions()\" [blurOnSelect]=\"false\"\r\n (optionSelected)=\"value.set($event.value)\" [targetElement]=\"inputElement\"></chr-data-list>\r\n <div class=\"error-message\" [title]=\"error()\" [class.hidden]=\"!error()\">\r\n {{ error() }}\r\n </div>\r\n </div>\r\n <!-- <span class=\"mat-icon apply-button\" title=\"Cliquez pour appliquer le filtre\" (click)=\"apply()\">check</span> -->\r\n </div>\r\n </div>\r\n } @else {\r\n @let val = value();\r\n @if(val){\r\n <span class=\"toggle\" (dblclick)=\"toggle()\">{{getModeLabel(mode()!)}} {{ val ? `\"${val}\"` : '' }}</span>\r\n }\r\n @else {\r\n <span class=\"toggle faded\" (dblclick)=\"toggle()\">Appliquer un filtre</span>\r\n }\r\n }\r\n</div>", styles: ["@import\"https://fonts.googleapis.com/css2?family=Material+Symbols:opsz,wght,FILL,GRAD@24,400,0,0\";@import\"https://fonts.googleapis.com/css2?family=Material+Icons\";.form{grid-column:1/13;display:grid;grid-template-columns:repeat(12,1fr);gap:1rem}.form button{color:var(--text-color);cursor:pointer;border-radius:.25rem}.form button:hover{background-color:var(--neutral-color)}.form-inline-buttons{grid-column:span 6;display:flex;justify-items:center;align-items:center;gap:.5rem}.form-control{grid-column:span 6;display:flex;flex-direction:column}.form-control::placeholder{color:color-mix(in srgb,var(--text-color) 40%,transparent 60%);font-weight:550}.form-control.with-inline-button{display:flex;flex-direction:row;gap:.5rem;align-items:center}.form-control.with-inline-button>:nth-child(-n+1){display:flex;flex-direction:column;width:100%}.form-control.with-inline-button>:nth-child(2){display:flex;justify-content:center}.form-control.full-width,.advanced-search-dropdown{grid-column:span 12}.advanced-search-dropdown .form-control:first-child{margin-top:.25rem}.form-actions{grid-column:span 12;display:flex;gap:1rem;justify-content:space-between}.mat-icon:not(mat-icon),.material-symbols{font-family:Material Symbols;font-size:1.5rem;display:flex;align-items:center;justify-content:center}:is(.mat-icon:not(mat-icon),.material-symbols).small{font-size:1rem}:is(.mat-icon:not(mat-icon),.material-symbols).large{font-size:2rem}:host{position:relative;display:flex;width:100%;min-height:1.5rem;max-height:2.5rem}.filter-wrapper{display:flex;align-items:center;width:100%}.filter-wrapper .toggle{cursor:pointer}.filter-wrapper .mat-icon{font-size:1rem;justify-content:start;flex-shrink:0}.filter-wrapper .input-wrapper{position:relative;display:flex;flex-direction:column;gap:.25rem;width:100%}.filter-wrapper .input-wrapper .apply-button{position:absolute;right:0;top:50%;width:min-content;transform:translateY(-50%);cursor:pointer}.filter-wrapper .mode-selector{border:0;outline:none;width:100%}.filter-wrapper .mode-selector option{border:none;outline:none}.filter-wrapper .error-message{height:0px;color:var(--error-color);font-size:.75rem;margin-top:.25rem;overflow:visible;text-overflow:ellipsis}.filter-wrapper .filter-input{outline:none;border:0;border-bottom:1px solid var(--neutral-color)}.filter-wrapper .filter-input:focus{border-bottom:1px solid var(--primary-color)}.filter-wrapper .filter-input,.filter-wrapper .mode-selector{background-color:inherit;color:var(--text-color)}.filter-wrapper .input-and-error{display:flex;flex-direction:column;margin-left:.15rem}.filter-wrapper .hidden{display:none}.filter-wrapper .no-input-buttons{appearance:textfield;-moz-appearance:textfield}.filter-wrapper .no-input-buttons::-webkit-calendar-picker-indicator,.filter-wrapper .no-input-buttons::-webkit-outer-spin-button,.filter-wrapper .no-input-buttons::-webkit-inner-spin-button{display:none;-webkit-appearance:none;margin:0}.filter-wrapper .faded{color:var(--faded-text-color)}.filter-wrapper .toggle{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;display:block}\n"] }]
5750
5753
  }], ctorParameters: () => [], propDecorators: { isOpen: [{ type: i0.Input, args: [{ isSignal: true, alias: "isOpen", required: false }] }, { type: i0.Output, args: ["isOpenChange"] }], by: [{ type: i0.Input, args: [{ isSignal: true, alias: "by", required: true }] }], suggestions: [{ type: i0.Input, args: [{ isSignal: true, alias: "suggestions", required: false }] }], mode: [{ type: i0.Input, args: [{ isSignal: true, alias: "mode", required: false }] }, { type: i0.Output, args: ["modeChange"] }], inputRef: [{ type: i0.ViewChild, args: ['inputElement', { isSignal: true }] }], columnMetadata: [{ type: i0.Input, args: [{ isSignal: true, alias: "columnMetadata", required: true }] }], value: [{ type: i0.Input, args: [{ isSignal: true, alias: "value", required: false }] }, { type: i0.Output, args: ["valueChange"] }], filterChange: [{ type: i0.Output, args: ["filterChange"] }] } });
5751
5754
 
5752
5755
  var DGGroupAggregationEnum;