myrta-ui 17.0.75 → 17.0.77

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 (38) hide show
  1. package/esm2022/lib/components/form/formula-editor/enums/error-messages.enum.mjs +16 -0
  2. package/esm2022/lib/components/form/formula-editor/enums/formula-editor-size.enum.mjs +7 -0
  3. package/esm2022/lib/components/form/formula-editor/formula-editor.component.mjs +342 -0
  4. package/esm2022/lib/components/form/formula-editor/formula-editor.module.mjs +44 -0
  5. package/esm2022/lib/components/form/formula-editor/helpers/check-errors.helper.mjs +73 -0
  6. package/esm2022/lib/components/form/formula-editor/helpers/create-tags.helper.mjs +17 -0
  7. package/esm2022/lib/components/form/formula-editor/models/check-error-result.model.mjs +2 -0
  8. package/esm2022/lib/components/form/formula-editor/models/formula-editor.model.mjs +2 -0
  9. package/esm2022/lib/components/form/formula-editor/models/index.mjs +4 -0
  10. package/esm2022/lib/components/form/formula-editor/models/white-list-item.model.mjs +2 -0
  11. package/esm2022/lib/components/form/json-editor/json-editor.component.mjs +1 -1
  12. package/esm2022/lib/components/form/json-editor/json-editor.module.mjs +1 -1
  13. package/esm2022/lib/components/form/select/helpers/clean-selected-items.helper.mjs +3 -5
  14. package/esm2022/lib/components/form/select/helpers/get-inner-items.helper.mjs +4 -4
  15. package/esm2022/lib/components/form/select/models/select-inner-item.model.mjs +1 -1
  16. package/esm2022/lib/components/form/select/select.component.mjs +4 -4
  17. package/esm2022/lib/components/paginator/paginator.component.mjs +2 -1
  18. package/esm2022/lib/helpers/is-number.helper.mjs +7 -0
  19. package/esm2022/public-api.mjs +4 -1
  20. package/fesm2022/myrta-ui.mjs +499 -18
  21. package/fesm2022/myrta-ui.mjs.map +1 -1
  22. package/lib/components/form/formula-editor/enums/error-messages.enum.d.ts +8 -0
  23. package/lib/components/form/formula-editor/enums/formula-editor-size.enum.d.ts +6 -0
  24. package/lib/components/form/formula-editor/formula-editor.component.d.ts +74 -0
  25. package/lib/components/form/formula-editor/formula-editor.module.d.ts +13 -0
  26. package/lib/components/form/formula-editor/helpers/check-errors.helper.d.ts +6 -0
  27. package/lib/components/form/formula-editor/helpers/create-tags.helper.d.ts +5 -0
  28. package/lib/components/form/formula-editor/models/check-error-result.model.d.ts +5 -0
  29. package/lib/components/form/formula-editor/models/formula-editor.model.d.ts +5 -0
  30. package/lib/components/form/formula-editor/models/index.d.ts +3 -0
  31. package/lib/components/form/formula-editor/models/white-list-item.model.d.ts +5 -0
  32. package/lib/components/form/select/helpers/clean-selected-items.helper.d.ts +2 -6
  33. package/lib/components/form/select/helpers/get-inner-items.helper.d.ts +1 -1
  34. package/lib/components/form/select/models/select-inner-item.model.d.ts +1 -0
  35. package/lib/components/form/select/select.component.d.ts +2 -4
  36. package/lib/helpers/is-number.helper.d.ts +1 -0
  37. package/package.json +1 -1
  38. package/public-api.d.ts +3 -0
package/fesm2022/myrta-ui.mjs CHANGED
@@ -1,7 +1,7 @@
1
1
  import * as i0 from '@angular/core';
2
2
  import { Input, Component, Pipe, EventEmitter, Output, ChangeDetectionStrategy, NgModule, CUSTOM_ELEMENTS_SCHEMA, Injectable, forwardRef, InjectionToken, TemplateRef, Inject, Injector, HostListener, Directive, ContentChild, ViewChild, ContentChildren, HostBinding, ViewEncapsulation, ViewChildren } from '@angular/core';
3
3
  import * as i1$1 from '@angular/common';
4
- import { CommonModule, NgOptimizedImage, registerLocaleData, DatePipe } from '@angular/common';
4
+ import { CommonModule, NgOptimizedImage, registerLocaleData, DatePipe, DOCUMENT } from '@angular/common';
5
5
  import * as i2 from '@angular/router';
6
6
  import { RouterModule, RouterLinkActive } from '@angular/router';
7
7
  import * as i1 from '@angular/platform-browser';
@@ -2493,23 +2493,21 @@ const modifyOriginItems = (selected, bindValue) => {
2493
2493
  }
2494
2494
  };
2495
2495
 
2496
- const cleanSelectItems = (innerList) => {
2497
- return innerList.map(cleanSelectItem);
2498
- };
2499
- const cleanSelectItem = ({ __id, __selected, ...rest }) => rest;
2496
+ const cleanSelectItems = (innerList) => innerList.map(cleanSelectItem);
2497
+ const cleanSelectItem = (innerItem) => innerItem.__origin;
2500
2498
 
2501
2499
  const getSelectedItems = (innerItems, bindValue) => {
2502
2500
  return modifyOriginItems(cleanSelectItems(innerItems.filter(item => item.__selected)), bindValue);
2503
2501
  };
2504
2502
 
2505
- const getInnerItems = (items, selectedItems = []) => {
2503
+ const getInnerItems = (items, selectedItems = [], bindValue) => {
2506
2504
  return items.map((item, idx) => {
2507
2505
  const findItem = selectedItems.find(i => isEqual(i, item));
2508
2506
  if (typeof item === 'object' && !Array.isArray(item)) {
2509
- return { ...item, __id: item['id'] || idx, __selected: !!findItem };
2507
+ return { __origin: item, __id: item['id'] || idx, __selected: !!findItem };
2510
2508
  }
2511
2509
  else {
2512
- return { label: item, __id: idx, __selected: !!findItem };
2510
+ return { __origin: item, __id: idx, __selected: !!findItem };
2513
2511
  }
2514
2512
  });
2515
2513
  };
@@ -3885,7 +3883,7 @@ class SelectComponent {
3885
3883
  else {
3886
3884
  this.selected = getInnerSelected(items, [selected], this.bindValue);
3887
3885
  }
3888
- this.innerItems = getInnerItems(items, this.selected);
3886
+ this.innerItems = getInnerItems(items, this.selected, this.bindValue);
3889
3887
  }
3890
3888
  updateValue(selectedItems) {
3891
3889
  const clearedSelected = getSelectedItems(selectedItems, this.bindValue);
@@ -3912,7 +3910,7 @@ class SelectComponent {
3912
3910
  useExisting: forwardRef(() => SelectComponent),
3913
3911
  multi: true,
3914
3912
  },
3915
- ], queries: [{ propertyName: "optionTemplate", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "labelTemplate", first: true, predicate: ["labelTemplate"], descendants: true }, { propertyName: "popupHeaderTemplate", first: true, predicate: ["popupHeaderTemplate"], descendants: true }, { propertyName: "popupFooterTemplate", first: true, predicate: ["popupFooterTemplate"], descendants: true }, { propertyName: "contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true }], viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class.mrx-input-error]=\"invalid\"\r\n [class]=\"getClasses\"\r\n class=\"mrx-select\"\r\n>\r\n <div class=\"mrx-select__wrapper\">\r\n @switch (use) {\r\n @case ('default') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input\">\r\n @if (getSelectedLabels.length) {\r\n @if (multiple) {\r\n <div class=\"mrx-select__input__values\">\r\n @if (multiCollapseCount && getSelectedLabels.length >= multiCollapseCount) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ getSelectedLabels.length }}</p>\r\n\r\n @if (!disabled && !readonly) {\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onClear($event)\"></span>\r\n }\r\n </div>\r\n } @else {\r\n @for (item of getSelectedLabels; track item; let first = $first; let last = $last) {\r\n @if (labelTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"labelTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last, clear: clearItem}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultLabelTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n }\r\n }\r\n }\r\n </div>\r\n } @else {\r\n <div class=\"mrx-select__input__value\">\r\n @for (item of getSelectedLabels; track item) {\r\n {{ bindLabel ? item[bindLabel] : item['label'] || item }}\r\n }\r\n </div>\r\n }\r\n } @else {\r\n <div class=\"mrx-select__input__placeholder\">{{ placeholder }}</div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls\">\r\n @if (isLoading) {\r\n <mrx-loader\r\n [size]=\"size === 'large' ? 'small' : 'extra-small'\"\r\n [color]=\"'brand'\"\r\n ></mrx-loader>\r\n }\r\n\r\n @if (getSelectedLabels.length && clearable) {\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onClear($event)\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n ></span>\r\n </div>\r\n }\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('link') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input-link\">\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (sortPlaceholder) {\r\n <p>{{ sortPlaceholder }}</p>\r\n }\r\n\r\n @if (sortIcon) {\r\n <span\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon {{sortIcon === 'asc' ? 'icon-sorting-up' : 'icon-sorting-down'}}\"\r\n ></span>\r\n }\r\n </div>\r\n\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (getSelectedLabels.length) {\r\n <div class=\"mrx-select__input-link__value\">\r\n @for (item of getSelectedLabels; track item) {\r\n {{ bindLabel ? item[bindLabel] : item['label'] || item }}\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n <mrx-popup #dropdown [closeAfterClick]=\"closable\" (toggle)=\"togglePopup($event)\">\r\n @for (item of filteredItems; track item.__id; let first = $first; let last = $last) {\r\n <mrx-popup-item [custom]=\"true\" [id]=\"item.__id\" (clicked)=\"onSelect(item)\">\r\n @if (optionTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"optionTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultOptionTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n }\r\n </mrx-popup-item>\r\n } @empty {\r\n <mrx-popup-item [custom]=\"true\">\r\n <div class=\"mrx-select__dropdown__empty\">{{ emptyText }}</div>\r\n </mrx-popup-item>\r\n }\r\n\r\n <ng-template #headerTemplate>\r\n @if (searchable) {\r\n <div class=\"mrx-select__dropdown__search\">\r\n <mrx-input-text\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n [(ngModel)]=\"searchValue\"\r\n ></mrx-input-text>\r\n </div>\r\n }\r\n\r\n @if (contentTemplate) {\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n }\r\n\r\n @if (popupHeaderTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupHeaderTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n\r\n <ng-template #footerTemplate>\r\n @if (!!addOption) {\r\n <div class=\"mrx-select__dropdown__extra-option\">\r\n <mrx-input-text\r\n class=\"flex-grow-1\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"extraOptionPlaceholder\"\r\n [(ngModel)]=\"model.label\"\r\n [maxlength]=\"300\"\r\n [invalid]=\"!!form.errors['label']\"\r\n [invalidMessage]=\"form.errors['label']\"\r\n (ngModelChange)=\"changeTextValueEmpty()\"\r\n ></mrx-input-text>\r\n <mrx-button\r\n [iconOnly]=\"true\"\r\n icon=\"<span class='mrx-icon icon-plus icon-font-24'></span>\"\r\n size=\"medium\"\r\n type=\"secondary\"\r\n (click)=\"onAddNewCustomOption()\"\r\n ></mrx-button>\r\n </div>\r\n }\r\n\r\n @if (popupFooterTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupFooterTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n </mrx-popup>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid && isInvalidMessage\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state [fields]=\"fields\" [id]=\"uuid\" [type]=\"'input'\"></mrx-save-state>\r\n</div>\r\n\r\n<ng-template #defaultLabelTemplate let-item=\"item\">\r\n @if (asLabel(item); as label) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>{{ bindLabel ? label[bindLabel] : label['label'] || label }}</p>\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onUnselect(label)\"></span>\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #defaultOptionTemplate let-item=\"item\">\r\n @if (asOption(item); as option) {\r\n <div class=\"mrx-select__dropdown__item\">\r\n <div class=\"mrx-select__dropdown__item--content\">\r\n @if (bindIcon && option[bindIcon]) {\r\n <span class=\"mrx-icon icon-font-24\" [class]=\"option[bindIcon]\"></span>\r\n }\r\n\r\n <p>{{ bindLabel ? option[bindLabel] : option['label'] || option }}</p>\r\n </div>\r\n\r\n @if (option.__selected) {\r\n <span class=\"mrx-icon icon-check icon-font-24\"></span>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [".mrx-select__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.mrx-select__input:focus,.mrx-select__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-select__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-select__input__box{flex-grow:1}.mrx-select__input__controls{display:flex;align-items:center;gap:8px;padding-top:4px;padding-bottom:4px}.mrx-select__input__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__input-link{border-radius:var(--border-radius-1);background:var(--brand-bg-tertiary-default, #FFF);outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px;width:fit-content}.mrx-select__input-link__box{flex-grow:1}.mrx-select__input-link__controls{display:flex;align-items:center;gap:8px}.mrx-select__input-link__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input-link__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select.mrx-select-lg .mrx-select__input,.mrx-select.mrx-select-lg .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input__values,.mrx-select.mrx-select-lg .mrx-select__input-link__values{min-height:32px}.mrx-select.mrx-select-lg .mrx-select__input__badge,.mrx-select.mrx-select-lg .mrx-select__input-link__badge{padding:6px 8px 6px 12px}.mrx-select.mrx-select-lg .mrx-select__input__badge p,.mrx-select.mrx-select-lg .mrx-select__input-link__badge p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-3) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-lg .mrx-select__input__placeholder,.mrx-select.mrx-select-lg .mrx-select__input__value{padding:6px 8px}.mrx-select.mrx-select-lg .mrx-select__input-link{padding:0}.mrx-select.mrx-select-lg .mrx-select__input-link__placeholder,.mrx-select.mrx-select-lg .mrx-select__input-link__value{padding:2px 0}.mrx-select.mrx-select-md .mrx-select__input,.mrx-select.mrx-select-md .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-md .mrx-select__input__values,.mrx-select.mrx-select-md .mrx-select__input-link__values{min-height:24px}.mrx-select.mrx-select-md .mrx-select__input__badge,.mrx-select.mrx-select-md .mrx-select__input-link__badge{padding:4px 4px 4px 8px}.mrx-select.mrx-select-md .mrx-select__input__badge p,.mrx-select.mrx-select-md .mrx-select__input-link__badge p{font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-select.mrx-select-md .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-4) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-md .mrx-select__input__placeholder,.mrx-select.mrx-select-md .mrx-select__input__value{padding:2px 8px}.mrx-select.mrx-select-md .mrx-select__input-link,.mrx-select.mrx-select-md .mrx-select__input-link__placeholder,.mrx-select.mrx-select-md .mrx-select__input-link__value{padding:0}.mrx-select__input__value{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select__input__values{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px}.mrx-select__input__badge{display:flex;align-items:center;gap:4px;border-radius:4px;background-color:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-select__input__badge .icon-close{transform:scale(1);transition:transform .2s}.mrx-select__input__badge .icon-close:hover{transform:scale(1.1)}.mrx-select__input__placeholder{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-tertiary, #71767E)}.mrx-select__dropdown__item{padding:8px 8px 8px 16px;background-color:transparent;transition:background-color .3s;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}.mrx-select__dropdown__item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__dropdown__item--content{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-grow:1}.mrx-select__dropdown__item--content p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding-top:2px;padding-bottom:2px}.mrx-select__dropdown__search{padding:8px;border-bottom:1.794px solid var(--neutral-bg-divider, #DBDFE5);background:var(--brand-bg-tertiary-default, #FFF)}.mrx-select__dropdown__extra-option{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px;border-top:1.794px solid var(--neutral-bg-divider, #DBDFE5);border-top:var(--border-width-default) solid var(--neutral-bg-stroke-default)}.mrx-select__dropdown__empty{padding:8px 16px;font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-input-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-select.mrx-input-checked-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-success .mrx-select__input{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-select.mrx-input-checked-success .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}.mrx-select.-disabled .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-select.-readonly .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PopupComponent, selector: "mrx-popup", inputs: ["closeAfterClick", "minWidth"], outputs: ["toggle", "_toggleInner", "_updateInner"] }, { kind: "component", type: PopupItemComponent, selector: "mrx-popup-item", inputs: ["custom", "id", "disabled"], outputs: ["clicked"] }, { kind: "directive", type: PopupTriggerDirective, selector: "[mrxPopupTrigger]", inputs: ["mrxPopupTrigger", "popupPosition"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { kind: "component", type: InputTextComponent, selector: "mrx-input-text", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "invalid", "invalidMessage", "checkInvalid", "customClasses", "size", "isTooltipValue", "icon", "iconColor", "mask", "maskPrefix", "showMaskTyped", "maskDropSpecialCharacters"], outputs: ["changed", "modelChange"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "component", type: ButtonComponent, selector: "mrx-button", inputs: ["size", "type", "color", "iconPosition", "active", "disabled", "isLoading", "iconOnly", "customClasses", "label", "icon", "iconClass", "buttonType", "href", "target", "routerLink", "queryParams"], outputs: ["mrxClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3913
+ ], queries: [{ propertyName: "optionTemplate", first: true, predicate: ["optionTemplate"], descendants: true }, { propertyName: "labelTemplate", first: true, predicate: ["labelTemplate"], descendants: true }, { propertyName: "popupHeaderTemplate", first: true, predicate: ["popupHeaderTemplate"], descendants: true }, { propertyName: "popupFooterTemplate", first: true, predicate: ["popupFooterTemplate"], descendants: true }, { propertyName: "contentTemplate", first: true, predicate: ["contentTemplate"], descendants: true }], viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true }], ngImport: i0, template: "<div\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class.mrx-input-error]=\"invalid\"\r\n [class]=\"getClasses\"\r\n class=\"mrx-select\"\r\n>\r\n <div class=\"mrx-select__wrapper\">\r\n @switch (use) {\r\n @case ('default') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input\">\r\n @if (getSelectedLabels.length) {\r\n @if (multiple) {\r\n <div class=\"mrx-select__input__values\">\r\n @if (multiCollapseCount && getSelectedLabels.length >= multiCollapseCount) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ getSelectedLabels.length }}</p>\r\n\r\n @if (!disabled && !readonly) {\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onClear($event)\"></span>\r\n }\r\n </div>\r\n } @else {\r\n @for (item of getSelectedLabels; track item.__id; let first = $first; let last = $last) {\r\n @if (labelTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"labelTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last, clear: clearItem}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultLabelTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n }\r\n }\r\n }\r\n </div>\r\n } @else {\r\n <div class=\"mrx-select__input__value\">\r\n @for (item of getSelectedLabels; track item.__id) {\r\n {{ bindLabel ? item.__origin[bindLabel] : item.__origin['label'] || item.__origin }}\r\n }\r\n </div>\r\n }\r\n } @else {\r\n <div class=\"mrx-select__input__placeholder\">{{ placeholder }}</div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls\">\r\n @if (isLoading) {\r\n <mrx-loader\r\n [size]=\"size === 'large' ? 'small' : 'extra-small'\"\r\n [color]=\"'brand'\"\r\n ></mrx-loader>\r\n }\r\n\r\n @if (getSelectedLabels.length && clearable) {\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onClear($event)\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n ></span>\r\n </div>\r\n }\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n @case ('link') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input-link\">\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (sortPlaceholder) {\r\n <p>{{ sortPlaceholder }}</p>\r\n }\r\n\r\n @if (sortIcon) {\r\n <span\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon {{sortIcon === 'asc' ? 'icon-sorting-up' : 'icon-sorting-down'}}\"\r\n ></span>\r\n }\r\n </div>\r\n\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (getSelectedLabels.length) {\r\n <div class=\"mrx-select__input-link__value\">\r\n @for (item of getSelectedLabels; track item.__id) {\r\n {{ bindLabel ? item.__origin[bindLabel] : item.__origin['label'] || item.__origin }}\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n <mrx-popup #dropdown [closeAfterClick]=\"closable\" (toggle)=\"togglePopup($event)\">\r\n @for (item of filteredItems; track item.__id; let first = $first; let last = $last) {\r\n <mrx-popup-item [custom]=\"true\" [id]=\"item.__id\" (clicked)=\"onSelect(item)\">\r\n @if (optionTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"optionTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultOptionTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n }\r\n </mrx-popup-item>\r\n } @empty {\r\n <mrx-popup-item [custom]=\"true\">\r\n <div class=\"mrx-select__dropdown__empty\">{{ emptyText }}</div>\r\n </mrx-popup-item>\r\n }\r\n\r\n <ng-template #headerTemplate>\r\n @if (searchable) {\r\n <div class=\"mrx-select__dropdown__search\">\r\n <mrx-input-text\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n [(ngModel)]=\"searchValue\"\r\n ></mrx-input-text>\r\n </div>\r\n }\r\n\r\n @if (contentTemplate) {\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n }\r\n\r\n @if (popupHeaderTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupHeaderTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n\r\n <ng-template #footerTemplate>\r\n @if (!!addOption) {\r\n <div class=\"mrx-select__dropdown__extra-option\">\r\n <mrx-input-text\r\n class=\"flex-grow-1\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"extraOptionPlaceholder\"\r\n [(ngModel)]=\"model.label\"\r\n [maxlength]=\"300\"\r\n [invalid]=\"!!form.errors['label']\"\r\n [invalidMessage]=\"form.errors['label']\"\r\n (ngModelChange)=\"changeTextValueEmpty()\"\r\n ></mrx-input-text>\r\n <mrx-button\r\n [iconOnly]=\"true\"\r\n icon=\"<span class='mrx-icon icon-plus icon-font-24'></span>\"\r\n size=\"medium\"\r\n type=\"secondary\"\r\n (click)=\"onAddNewCustomOption()\"\r\n ></mrx-button>\r\n </div>\r\n }\r\n\r\n @if (popupFooterTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupFooterTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n </mrx-popup>\r\n </div>\r\n\r\n @if (invalid && isInvalidMessage) {\r\n <mrx-error-message [invalidMessage]=\"invalidMessage\"></mrx-error-message>\r\n }\r\n\r\n <mrx-save-state [fields]=\"fields\" [id]=\"uuid\" [type]=\"'input'\"></mrx-save-state>\r\n</div>\r\n\r\n<ng-template #defaultLabelTemplate let-item=\"item\">\r\n @if (asLabel(item); as label) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>{{ bindLabel ? label[bindLabel] : label['label'] || label }}</p>\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onUnselect(label)\"></span>\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #defaultOptionTemplate let-item=\"item\">\r\n @if (asOption(item); as option) {\r\n <div class=\"mrx-select__dropdown__item\">\r\n <div class=\"mrx-select__dropdown__item--content\">\r\n @if (bindIcon && option[bindIcon]) {\r\n <span class=\"mrx-icon icon-font-24\" [class]=\"option[bindIcon]\"></span>\r\n }\r\n\r\n <p>{{ bindLabel ? option[bindLabel] : option['label'] || option }}</p>\r\n </div>\r\n\r\n @if (option.__selected) {\r\n <span class=\"mrx-icon icon-check icon-font-24\"></span>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [".mrx-select__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.mrx-select__input:focus,.mrx-select__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-select__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-select__input__box{flex-grow:1}.mrx-select__input__controls{display:flex;align-items:center;gap:8px;padding-top:4px;padding-bottom:4px}.mrx-select__input__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__input-link{border-radius:var(--border-radius-1);background:var(--brand-bg-tertiary-default, #FFF);outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px;width:fit-content}.mrx-select__input-link__box{flex-grow:1}.mrx-select__input-link__controls{display:flex;align-items:center;gap:8px}.mrx-select__input-link__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input-link__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select.mrx-select-lg .mrx-select__input,.mrx-select.mrx-select-lg .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input__values,.mrx-select.mrx-select-lg .mrx-select__input-link__values{min-height:32px}.mrx-select.mrx-select-lg .mrx-select__input__badge,.mrx-select.mrx-select-lg .mrx-select__input-link__badge{padding:6px 8px 6px 12px}.mrx-select.mrx-select-lg .mrx-select__input__badge p,.mrx-select.mrx-select-lg .mrx-select__input-link__badge p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-3) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-lg .mrx-select__input__placeholder,.mrx-select.mrx-select-lg .mrx-select__input__value{padding:6px 8px}.mrx-select.mrx-select-lg .mrx-select__input-link{padding:0}.mrx-select.mrx-select-lg .mrx-select__input-link__placeholder,.mrx-select.mrx-select-lg .mrx-select__input-link__value{padding:2px 0}.mrx-select.mrx-select-md .mrx-select__input,.mrx-select.mrx-select-md .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-md .mrx-select__input__values,.mrx-select.mrx-select-md .mrx-select__input-link__values{min-height:24px}.mrx-select.mrx-select-md .mrx-select__input__badge,.mrx-select.mrx-select-md .mrx-select__input-link__badge{padding:4px 4px 4px 8px}.mrx-select.mrx-select-md .mrx-select__input__badge p,.mrx-select.mrx-select-md .mrx-select__input-link__badge p{font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-select.mrx-select-md .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-4) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-md .mrx-select__input__placeholder,.mrx-select.mrx-select-md .mrx-select__input__value{padding:2px 8px}.mrx-select.mrx-select-md .mrx-select__input-link,.mrx-select.mrx-select-md .mrx-select__input-link__placeholder,.mrx-select.mrx-select-md .mrx-select__input-link__value{padding:0}.mrx-select__input__value{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select__input__values{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px}.mrx-select__input__badge{display:flex;align-items:center;gap:4px;border-radius:4px;background-color:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-select__input__badge .icon-close{transform:scale(1);transition:transform .2s}.mrx-select__input__badge .icon-close:hover{transform:scale(1.1)}.mrx-select__input__placeholder{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-tertiary, #71767E)}.mrx-select__dropdown__item{padding:8px 8px 8px 16px;background-color:transparent;transition:background-color .3s;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}.mrx-select__dropdown__item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__dropdown__item--content{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-grow:1}.mrx-select__dropdown__item--content p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding-top:2px;padding-bottom:2px}.mrx-select__dropdown__search{padding:8px;border-bottom:1.794px solid var(--neutral-bg-divider, #DBDFE5);background:var(--brand-bg-tertiary-default, #FFF)}.mrx-select__dropdown__extra-option{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px;border-top:1.794px solid var(--neutral-bg-divider, #DBDFE5);border-top:var(--border-width-default) solid var(--neutral-bg-stroke-default)}.mrx-select__dropdown__empty{padding:8px 16px;font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-input-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-select.mrx-input-checked-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-success .mrx-select__input{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-select.mrx-input-checked-success .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}.mrx-select.-disabled .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-select.-readonly .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626);pointer-events:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i2$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: PopupComponent, selector: "mrx-popup", inputs: ["closeAfterClick", "minWidth"], outputs: ["toggle", "_toggleInner", "_updateInner"] }, { kind: "component", type: PopupItemComponent, selector: "mrx-popup-item", inputs: ["custom", "id", "disabled"], outputs: ["clicked"] }, { kind: "directive", type: PopupTriggerDirective, selector: "[mrxPopupTrigger]", inputs: ["mrxPopupTrigger", "popupPosition"] }, { kind: "component", type: LoaderComponent, selector: "mrx-loader", inputs: ["size", "color", "customClasses"] }, { kind: "component", type: InputTextComponent, selector: "mrx-input-text", inputs: ["fields", "disabled", "required", "readonly", "maxlength", "minlength", "placeholder", "invalid", "invalidMessage", "checkInvalid", "customClasses", "size", "isTooltipValue", "icon", "iconColor", "mask", "maskPrefix", "showMaskTyped", "maskDropSpecialCharacters"], outputs: ["changed", "modelChange"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "component", type: ButtonComponent, selector: "mrx-button", inputs: ["size", "type", "color", "iconPosition", "active", "disabled", "isLoading", "iconOnly", "customClasses", "label", "icon", "iconClass", "buttonType", "href", "target", "routerLink", "queryParams"], outputs: ["mrxClick"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
3916
3914
  }
3917
3915
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SelectComponent, decorators: [{
3918
3916
  type: Component,
@@ -3922,7 +3920,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
3922
3920
  useExisting: forwardRef(() => SelectComponent),
3923
3921
  multi: true,
3924
3922
  },
3925
- ], template: "<div [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class.mrx-input-error]=\"invalid\"\r\n [class]=\"getClasses\"\r\n class=\"mrx-select\"\r\n>\r\n <div class=\"mrx-select__wrapper\">\r\n @switch (use) {\r\n @case ('default') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input\">\r\n @if (getSelectedLabels.length) {\r\n @if (multiple) {\r\n <div class=\"mrx-select__input__values\">\r\n @if (multiCollapseCount && getSelectedLabels.length >= multiCollapseCount) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ getSelectedLabels.length }}</p>\r\n\r\n @if (!disabled && !readonly) {\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onClear($event)\"></span>\r\n }\r\n </div>\r\n } @else {\r\n @for (item of getSelectedLabels; track item; let first = $first; let last = $last) {\r\n @if (labelTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"labelTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last, clear: clearItem}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultLabelTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n }\r\n }\r\n }\r\n </div>\r\n } @else {\r\n <div class=\"mrx-select__input__value\">\r\n @for (item of getSelectedLabels; track item) {\r\n {{ bindLabel ? item[bindLabel] : item['label'] || item }}\r\n }\r\n </div>\r\n }\r\n } @else {\r\n <div class=\"mrx-select__input__placeholder\">{{ placeholder }}</div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls\">\r\n @if (isLoading) {\r\n <mrx-loader\r\n [size]=\"size === 'large' ? 'small' : 'extra-small'\"\r\n [color]=\"'brand'\"\r\n ></mrx-loader>\r\n }\r\n\r\n @if (getSelectedLabels.length && clearable) {\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onClear($event)\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n ></span>\r\n </div>\r\n }\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n\r\n @case ('link') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input-link\">\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (sortPlaceholder) {\r\n <p>{{ sortPlaceholder }}</p>\r\n }\r\n\r\n @if (sortIcon) {\r\n <span\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon {{sortIcon === 'asc' ? 'icon-sorting-up' : 'icon-sorting-down'}}\"\r\n ></span>\r\n }\r\n </div>\r\n\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (getSelectedLabels.length) {\r\n <div class=\"mrx-select__input-link__value\">\r\n @for (item of getSelectedLabels; track item) {\r\n {{ bindLabel ? item[bindLabel] : item['label'] || item }}\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n <mrx-popup #dropdown [closeAfterClick]=\"closable\" (toggle)=\"togglePopup($event)\">\r\n @for (item of filteredItems; track item.__id; let first = $first; let last = $last) {\r\n <mrx-popup-item [custom]=\"true\" [id]=\"item.__id\" (clicked)=\"onSelect(item)\">\r\n @if (optionTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"optionTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultOptionTemplate\"\r\n [ngTemplateOutletContext]=\"{item, first, last}\"\r\n ></ng-container>\r\n }\r\n </mrx-popup-item>\r\n } @empty {\r\n <mrx-popup-item [custom]=\"true\">\r\n <div class=\"mrx-select__dropdown__empty\">{{ emptyText }}</div>\r\n </mrx-popup-item>\r\n }\r\n\r\n <ng-template #headerTemplate>\r\n @if (searchable) {\r\n <div class=\"mrx-select__dropdown__search\">\r\n <mrx-input-text\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n [(ngModel)]=\"searchValue\"\r\n ></mrx-input-text>\r\n </div>\r\n }\r\n\r\n @if (contentTemplate) {\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n }\r\n\r\n @if (popupHeaderTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupHeaderTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n\r\n <ng-template #footerTemplate>\r\n @if (!!addOption) {\r\n <div class=\"mrx-select__dropdown__extra-option\">\r\n <mrx-input-text\r\n class=\"flex-grow-1\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"extraOptionPlaceholder\"\r\n [(ngModel)]=\"model.label\"\r\n [maxlength]=\"300\"\r\n [invalid]=\"!!form.errors['label']\"\r\n [invalidMessage]=\"form.errors['label']\"\r\n (ngModelChange)=\"changeTextValueEmpty()\"\r\n ></mrx-input-text>\r\n <mrx-button\r\n [iconOnly]=\"true\"\r\n icon=\"<span class='mrx-icon icon-plus icon-font-24'></span>\"\r\n size=\"medium\"\r\n type=\"secondary\"\r\n (click)=\"onAddNewCustomOption()\"\r\n ></mrx-button>\r\n </div>\r\n }\r\n\r\n @if (popupFooterTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupFooterTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n </mrx-popup>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"invalid && isInvalidMessage\"\r\n [invalidMessage]=\"invalidMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state [fields]=\"fields\" [id]=\"uuid\" [type]=\"'input'\"></mrx-save-state>\r\n</div>\r\n\r\n<ng-template #defaultLabelTemplate let-item=\"item\">\r\n @if (asLabel(item); as label) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>{{ bindLabel ? label[bindLabel] : label['label'] || label }}</p>\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onUnselect(label)\"></span>\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #defaultOptionTemplate let-item=\"item\">\r\n @if (asOption(item); as option) {\r\n <div class=\"mrx-select__dropdown__item\">\r\n <div class=\"mrx-select__dropdown__item--content\">\r\n @if (bindIcon && option[bindIcon]) {\r\n <span class=\"mrx-icon icon-font-24\" [class]=\"option[bindIcon]\"></span>\r\n }\r\n\r\n <p>{{ bindLabel ? option[bindLabel] : option['label'] || option }}</p>\r\n </div>\r\n\r\n @if (option.__selected) {\r\n <span class=\"mrx-icon icon-check icon-font-24\"></span>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [".mrx-select__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.mrx-select__input:focus,.mrx-select__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-select__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-select__input__box{flex-grow:1}.mrx-select__input__controls{display:flex;align-items:center;gap:8px;padding-top:4px;padding-bottom:4px}.mrx-select__input__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__input-link{border-radius:var(--border-radius-1);background:var(--brand-bg-tertiary-default, #FFF);outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px;width:fit-content}.mrx-select__input-link__box{flex-grow:1}.mrx-select__input-link__controls{display:flex;align-items:center;gap:8px}.mrx-select__input-link__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input-link__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select.mrx-select-lg .mrx-select__input,.mrx-select.mrx-select-lg .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input__values,.mrx-select.mrx-select-lg .mrx-select__input-link__values{min-height:32px}.mrx-select.mrx-select-lg .mrx-select__input__badge,.mrx-select.mrx-select-lg .mrx-select__input-link__badge{padding:6px 8px 6px 12px}.mrx-select.mrx-select-lg .mrx-select__input__badge p,.mrx-select.mrx-select-lg .mrx-select__input-link__badge p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-3) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-lg .mrx-select__input__placeholder,.mrx-select.mrx-select-lg .mrx-select__input__value{padding:6px 8px}.mrx-select.mrx-select-lg .mrx-select__input-link{padding:0}.mrx-select.mrx-select-lg .mrx-select__input-link__placeholder,.mrx-select.mrx-select-lg .mrx-select__input-link__value{padding:2px 0}.mrx-select.mrx-select-md .mrx-select__input,.mrx-select.mrx-select-md .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-md .mrx-select__input__values,.mrx-select.mrx-select-md .mrx-select__input-link__values{min-height:24px}.mrx-select.mrx-select-md .mrx-select__input__badge,.mrx-select.mrx-select-md .mrx-select__input-link__badge{padding:4px 4px 4px 8px}.mrx-select.mrx-select-md .mrx-select__input__badge p,.mrx-select.mrx-select-md .mrx-select__input-link__badge p{font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-select.mrx-select-md .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-4) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-md .mrx-select__input__placeholder,.mrx-select.mrx-select-md .mrx-select__input__value{padding:2px 8px}.mrx-select.mrx-select-md .mrx-select__input-link,.mrx-select.mrx-select-md .mrx-select__input-link__placeholder,.mrx-select.mrx-select-md .mrx-select__input-link__value{padding:0}.mrx-select__input__value{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select__input__values{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px}.mrx-select__input__badge{display:flex;align-items:center;gap:4px;border-radius:4px;background-color:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-select__input__badge .icon-close{transform:scale(1);transition:transform .2s}.mrx-select__input__badge .icon-close:hover{transform:scale(1.1)}.mrx-select__input__placeholder{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-tertiary, #71767E)}.mrx-select__dropdown__item{padding:8px 8px 8px 16px;background-color:transparent;transition:background-color .3s;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}.mrx-select__dropdown__item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__dropdown__item--content{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-grow:1}.mrx-select__dropdown__item--content p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding-top:2px;padding-bottom:2px}.mrx-select__dropdown__search{padding:8px;border-bottom:1.794px solid var(--neutral-bg-divider, #DBDFE5);background:var(--brand-bg-tertiary-default, #FFF)}.mrx-select__dropdown__extra-option{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px;border-top:1.794px solid var(--neutral-bg-divider, #DBDFE5);border-top:var(--border-width-default) solid var(--neutral-bg-stroke-default)}.mrx-select__dropdown__empty{padding:8px 16px;font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-input-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-select.mrx-input-checked-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-success .mrx-select__input{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-select.mrx-input-checked-success .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}.mrx-select.-disabled .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-select.-readonly .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626);pointer-events:none}\n"] }]
3923
+ ], template: "<div\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class.mrx-input-error]=\"invalid\"\r\n [class]=\"getClasses\"\r\n class=\"mrx-select\"\r\n>\r\n <div class=\"mrx-select__wrapper\">\r\n @switch (use) {\r\n @case ('default') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input\">\r\n @if (getSelectedLabels.length) {\r\n @if (multiple) {\r\n <div class=\"mrx-select__input__values\">\r\n @if (multiCollapseCount && getSelectedLabels.length >= multiCollapseCount) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>\u0412\u044B\u0431\u0440\u0430\u043D\u043E: {{ getSelectedLabels.length }}</p>\r\n\r\n @if (!disabled && !readonly) {\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onClear($event)\"></span>\r\n }\r\n </div>\r\n } @else {\r\n @for (item of getSelectedLabels; track item.__id; let first = $first; let last = $last) {\r\n @if (labelTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"labelTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last, clear: clearItem}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultLabelTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n }\r\n }\r\n }\r\n </div>\r\n } @else {\r\n <div class=\"mrx-select__input__value\">\r\n @for (item of getSelectedLabels; track item.__id) {\r\n {{ bindLabel ? item.__origin[bindLabel] : item.__origin['label'] || item.__origin }}\r\n }\r\n </div>\r\n }\r\n } @else {\r\n <div class=\"mrx-select__input__placeholder\">{{ placeholder }}</div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls\">\r\n @if (isLoading) {\r\n <mrx-loader\r\n [size]=\"size === 'large' ? 'small' : 'extra-small'\"\r\n [color]=\"'brand'\"\r\n ></mrx-loader>\r\n }\r\n\r\n @if (getSelectedLabels.length && clearable) {\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onClear($event)\">\r\n <span\r\n class=\"mrx-icon icon-close\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n ></span>\r\n </div>\r\n }\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n @case ('link') {\r\n <div [mrxPopupTrigger]=\"dropdown\" [popupPosition]=\"popupPosition\" class=\"mrx-select__input-link\">\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (sortPlaceholder) {\r\n <p>{{ sortPlaceholder }}</p>\r\n }\r\n\r\n @if (sortIcon) {\r\n <span\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon {{sortIcon === 'asc' ? 'icon-sorting-up' : 'icon-sorting-down'}}\"\r\n ></span>\r\n }\r\n </div>\r\n\r\n <div class=\"mrx-select__input-link__controls\">\r\n @if (getSelectedLabels.length) {\r\n <div class=\"mrx-select__input-link__value\">\r\n @for (item of getSelectedLabels; track item.__id) {\r\n {{ bindLabel ? item.__origin[bindLabel] : item.__origin['label'] || item.__origin }}\r\n }\r\n </div>\r\n }\r\n\r\n <div class=\"mrx-select__input__controls--item\" (click)=\"onOpen($event)\">\r\n <span\r\n [class.icon-chevron-down]=\"!isOpen\"\r\n [class.icon-chevron-up]=\"isOpen\"\r\n [class.icon-font-16]=\"size === 'medium'\"\r\n [class.icon-font-24]=\"size === 'large'\"\r\n class=\"mrx-icon\"\r\n ></span>\r\n </div>\r\n </div>\r\n </div>\r\n }\r\n }\r\n\r\n <mrx-popup #dropdown [closeAfterClick]=\"closable\" (toggle)=\"togglePopup($event)\">\r\n @for (item of filteredItems; track item.__id; let first = $first; let last = $last) {\r\n <mrx-popup-item [custom]=\"true\" [id]=\"item.__id\" (clicked)=\"onSelect(item)\">\r\n @if (optionTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"optionTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n } @else {\r\n <ng-container\r\n [ngTemplateOutlet]=\"defaultOptionTemplate\"\r\n [ngTemplateOutletContext]=\"{item: item.__origin, first, last}\"\r\n ></ng-container>\r\n }\r\n </mrx-popup-item>\r\n } @empty {\r\n <mrx-popup-item [custom]=\"true\">\r\n <div class=\"mrx-select__dropdown__empty\">{{ emptyText }}</div>\r\n </mrx-popup-item>\r\n }\r\n\r\n <ng-template #headerTemplate>\r\n @if (searchable) {\r\n <div class=\"mrx-select__dropdown__search\">\r\n <mrx-input-text\r\n [size]=\"'medium'\"\r\n [placeholder]=\"searchPlaceholder\"\r\n [(ngModel)]=\"searchValue\"\r\n ></mrx-input-text>\r\n </div>\r\n }\r\n\r\n @if (contentTemplate) {\r\n <ng-container *ngTemplateOutlet=\"contentTemplate\"></ng-container>\r\n }\r\n\r\n @if (popupHeaderTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupHeaderTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n\r\n <ng-template #footerTemplate>\r\n @if (!!addOption) {\r\n <div class=\"mrx-select__dropdown__extra-option\">\r\n <mrx-input-text\r\n class=\"flex-grow-1\"\r\n [size]=\"'medium'\"\r\n [placeholder]=\"extraOptionPlaceholder\"\r\n [(ngModel)]=\"model.label\"\r\n [maxlength]=\"300\"\r\n [invalid]=\"!!form.errors['label']\"\r\n [invalidMessage]=\"form.errors['label']\"\r\n (ngModelChange)=\"changeTextValueEmpty()\"\r\n ></mrx-input-text>\r\n <mrx-button\r\n [iconOnly]=\"true\"\r\n icon=\"<span class='mrx-icon icon-plus icon-font-24'></span>\"\r\n size=\"medium\"\r\n type=\"secondary\"\r\n (click)=\"onAddNewCustomOption()\"\r\n ></mrx-button>\r\n </div>\r\n }\r\n\r\n @if (popupFooterTemplate) {\r\n <ng-container\r\n [ngTemplateOutlet]=\"popupFooterTemplate\"\r\n ></ng-container>\r\n }\r\n </ng-template>\r\n </mrx-popup>\r\n </div>\r\n\r\n @if (invalid && isInvalidMessage) {\r\n <mrx-error-message [invalidMessage]=\"invalidMessage\"></mrx-error-message>\r\n }\r\n\r\n <mrx-save-state [fields]=\"fields\" [id]=\"uuid\" [type]=\"'input'\"></mrx-save-state>\r\n</div>\r\n\r\n<ng-template #defaultLabelTemplate let-item=\"item\">\r\n @if (asLabel(item); as label) {\r\n <div class=\"mrx-select__input__badge\">\r\n <p>{{ bindLabel ? label[bindLabel] : label['label'] || label }}</p>\r\n <span class=\"mrx-icon icon-close icon-font-16\" (click)=\"onUnselect(label)\"></span>\r\n </div>\r\n }\r\n</ng-template>\r\n\r\n<ng-template #defaultOptionTemplate let-item=\"item\">\r\n @if (asOption(item); as option) {\r\n <div class=\"mrx-select__dropdown__item\">\r\n <div class=\"mrx-select__dropdown__item--content\">\r\n @if (bindIcon && option[bindIcon]) {\r\n <span class=\"mrx-icon icon-font-24\" [class]=\"option[bindIcon]\"></span>\r\n }\r\n\r\n <p>{{ bindLabel ? option[bindLabel] : option['label'] || option }}</p>\r\n </div>\r\n\r\n @if (option.__selected) {\r\n <span class=\"mrx-icon icon-check icon-font-24\"></span>\r\n }\r\n </div>\r\n }\r\n</ng-template>\r\n", styles: [".mrx-select__input{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1);width:100%;outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;align-items:flex-start;justify-content:space-between;gap:8px}.mrx-select__input:focus,.mrx-select__input:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-select__input:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-select__input__box{flex-grow:1}.mrx-select__input__controls{display:flex;align-items:center;gap:8px;padding-top:4px;padding-bottom:4px}.mrx-select__input__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__input-link{border-radius:var(--border-radius-1);background:var(--brand-bg-tertiary-default, #FFF);outline:none;transition:outline-width .2s,border .2s;cursor:pointer;display:flex;flex-wrap:wrap;justify-content:flex-start;align-items:center;gap:8px;width:fit-content}.mrx-select__input-link__box{flex-grow:1}.mrx-select__input-link__controls{display:flex;align-items:center;gap:8px}.mrx-select__input-link__controls--item{display:flex;align-items:center;justify-content:center;border-radius:4px;background-color:transparent;transition:background-color .2s}.mrx-select__input-link__controls--item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select.mrx-select-lg .mrx-select__input,.mrx-select.mrx-select-lg .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input__values,.mrx-select.mrx-select-lg .mrx-select__input-link__values{min-height:32px}.mrx-select.mrx-select-lg .mrx-select__input__badge,.mrx-select.mrx-select-lg .mrx-select__input-link__badge{padding:6px 8px 6px 12px}.mrx-select.mrx-select-lg .mrx-select__input__badge p,.mrx-select.mrx-select-lg .mrx-select__input-link__badge p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-lg .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-3) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-lg .mrx-select__input__placeholder,.mrx-select.mrx-select-lg .mrx-select__input__value{padding:6px 8px}.mrx-select.mrx-select-lg .mrx-select__input-link{padding:0}.mrx-select.mrx-select-lg .mrx-select__input-link__placeholder,.mrx-select.mrx-select-lg .mrx-select__input-link__value{padding:2px 0}.mrx-select.mrx-select-md .mrx-select__input,.mrx-select.mrx-select-md .mrx-select__input-link{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-select-md .mrx-select__input__values,.mrx-select.mrx-select-md .mrx-select__input-link__values{min-height:24px}.mrx-select.mrx-select-md .mrx-select__input__badge,.mrx-select.mrx-select-md .mrx-select__input-link__badge{padding:4px 4px 4px 8px}.mrx-select.mrx-select-md .mrx-select__input__badge p,.mrx-select.mrx-select-md .mrx-select__input-link__badge p{font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height)}.mrx-select.mrx-select-md .mrx-select__input{padding:calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-4) calc(var(--spacing-2) - var(--border-width-default)) var(--spacing-2)}.mrx-select.mrx-select-md .mrx-select__input__placeholder,.mrx-select.mrx-select-md .mrx-select__input__value{padding:2px 8px}.mrx-select.mrx-select-md .mrx-select__input-link,.mrx-select.mrx-select-md .mrx-select__input-link__placeholder,.mrx-select.mrx-select-md .mrx-select__input-link__value{padding:0}.mrx-select__input__value{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select__input__values{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:8px}.mrx-select__input__badge{display:flex;align-items:center;gap:4px;border-radius:4px;background-color:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-select__input__badge .icon-close{transform:scale(1);transition:transform .2s}.mrx-select__input__badge .icon-close:hover{transform:scale(1.1)}.mrx-select__input__placeholder{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);color:var(--neutral-text-tertiary, #71767E)}.mrx-select__dropdown__item{padding:8px 8px 8px 16px;background-color:transparent;transition:background-color .3s;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:8px}.mrx-select__dropdown__item:hover{background-color:var(--brand-bg-tertiary-hover, #EDF5FF)}.mrx-select__dropdown__item--content{display:flex;align-items:center;justify-content:flex-start;gap:8px;flex-grow:1}.mrx-select__dropdown__item--content p{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding-top:2px;padding-bottom:2px}.mrx-select__dropdown__search{padding:8px;border-bottom:1.794px solid var(--neutral-bg-divider, #DBDFE5);background:var(--brand-bg-tertiary-default, #FFF)}.mrx-select__dropdown__extra-option{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:8px;border-top:1.794px solid var(--neutral-bg-divider, #DBDFE5);border-top:var(--border-width-default) solid var(--neutral-bg-stroke-default)}.mrx-select__dropdown__empty{padding:8px 16px;font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height)}.mrx-select.mrx-input-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-error .mrx-select__input{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-select.mrx-input-checked-error .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-select.mrx-input-checked-success .mrx-select__input{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-select.mrx-input-checked-success .mrx-select__input:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}.mrx-select.-disabled .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-tertiary, #71767E);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-select.-readonly .mrx-select__input{background-color:var(--neutral-bg-disabled, #EEF0F4);-webkit-text-fill-color:var(--neutral-text-primary, #262626);color:var(--neutral-text-primary, #262626);pointer-events:none}\n"] }]
3926
3924
  }], propDecorators: { fields: [{
3927
3925
  type: Input
3928
3926
  }], items: [{
@@ -4091,6 +4089,7 @@ class PaginatorComponent {
4091
4089
  return this.pageSize * this.currentPage;
4092
4090
  }
4093
4091
  onChangeCurrentPage(value) {
4092
+ console.log(value);
4094
4093
  this.dataStateChanged.emit({
4095
4094
  currentPage: value,
4096
4095
  pageSize: this.pageSize
@@ -14662,13 +14661,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
14662
14661
  }]
14663
14662
  }] });
14664
14663
 
14665
- var ErrorMessagesEnum;
14664
+ var ErrorMessagesEnum$1;
14666
14665
  (function (ErrorMessagesEnum) {
14667
14666
  ErrorMessagesEnum["TooManyFiles"] = "\u0421\u043B\u0438\u0448\u043A\u043E\u043C \u043C\u043D\u043E\u0433\u043E \u0444\u0430\u0439\u043B\u043E\u0432";
14668
14667
  ErrorMessagesEnum["FileTooBig"] = "\u0421\u043B\u0438\u0448\u043A\u043E\u043C \u0431\u043E\u043B\u044C\u0448\u043E\u0439 \u0444\u0430\u0439\u043B";
14669
14668
  ErrorMessagesEnum["EmptyFile"] = "\u041F\u0443\u0441\u0442\u043E\u0439 \u0444\u0430\u0439\u043B";
14670
14669
  ErrorMessagesEnum["InvalidFileFormat"] = "\u041D\u0435\u0432\u0435\u0440\u043D\u044B\u0439 \u0444\u043E\u0440\u043C\u0430\u0442 \u0444\u0430\u0439\u043B\u0430";
14671
- })(ErrorMessagesEnum || (ErrorMessagesEnum = {}));
14670
+ })(ErrorMessagesEnum$1 || (ErrorMessagesEnum$1 = {}));
14672
14671
 
14673
14672
  var InputFileTargetTypesEnum;
14674
14673
  (function (InputFileTargetTypesEnum) {
@@ -14712,10 +14711,10 @@ class InputFileComponent {
14712
14711
  invalidMessage = '';
14713
14712
  checkInvalid = null;
14714
14713
  // ERROR MESSAGES
14715
- messageTooManyFiles = ErrorMessagesEnum.TooManyFiles;
14716
- messageFileTooBig = ErrorMessagesEnum.FileTooBig;
14717
- messageEmptyFile = ErrorMessagesEnum.EmptyFile;
14718
- messageInvalidFileFormat = ErrorMessagesEnum.InvalidFileFormat;
14714
+ messageTooManyFiles = ErrorMessagesEnum$1.TooManyFiles;
14715
+ messageFileTooBig = ErrorMessagesEnum$1.FileTooBig;
14716
+ messageEmptyFile = ErrorMessagesEnum$1.EmptyFile;
14717
+ messageInvalidFileFormat = ErrorMessagesEnum$1.InvalidFileFormat;
14719
14718
  // PLACEHOLDERS
14720
14719
  placeholder = 'Перенесите файл с устройства или нажмите на данное поле для добавления файла';
14721
14720
  placeholderFileMaxSize = 'Размер файла: не больше';
@@ -17157,6 +17156,488 @@ var StepperClasses;
17157
17156
  StepperClasses["success"] = "mrx-stepper-success";
17158
17157
  })(StepperClasses || (StepperClasses = {}));
17159
17158
 
17159
+ var ErrorTypeEnum;
17160
+ (function (ErrorTypeEnum) {
17161
+ ErrorTypeEnum["Default"] = "default";
17162
+ ErrorTypeEnum["Interpretation"] = "interpretation";
17163
+ ErrorTypeEnum["Sequence"] = "sequence";
17164
+ ErrorTypeEnum["Divider"] = "divider";
17165
+ ErrorTypeEnum["Bracket"] = "bracket";
17166
+ })(ErrorTypeEnum || (ErrorTypeEnum = {}));
17167
+ const ErrorMessagesEnum = {
17168
+ [ErrorTypeEnum.Default]: '',
17169
+ [ErrorTypeEnum.Interpretation]: 'Не удалось интерпретировать введенное значение',
17170
+ [ErrorTypeEnum.Sequence]: 'Некорректная последовательность элементов',
17171
+ [ErrorTypeEnum.Divider]: 'Некорректный разделитель',
17172
+ [ErrorTypeEnum.Bracket]: 'Не все скобки закрыты'
17173
+ };
17174
+
17175
+ // &nbsp;
17176
+ const createTag = (content) => {
17177
+ return `<div class="tag argument -medium" contenteditable="false" tabindex="-1">${content}</div>&nbsp;`;
17178
+ };
17179
+ const createOperator = (content) => {
17180
+ return `<div class="tag operator -large" contenteditable="false" tabindex="-1">${content}</div>&nbsp;`;
17181
+ };
17182
+ const createNumber = (content) => {
17183
+ return `<div class="tag number -medium" contenteditable="false" tabindex="-1">${content}</div>&nbsp;`;
17184
+ };
17185
+ const createBracket = (content) => {
17186
+ return `<div class="tag bracket -medium" contenteditable="false" tabindex="-1">${content}</div>&nbsp;`;
17187
+ };
17188
+ const createTagOutside = (content) => {
17189
+ return `{${content}}`;
17190
+ };
17191
+
17192
+ const isAn = (value) => {
17193
+ if (value instanceof Number) {
17194
+ value = value.valueOf();
17195
+ }
17196
+ return !isNaN(parseFloat(value)) && isFinite(value);
17197
+ };
17198
+
17199
+ const checkInterpretationErrors = (error) => {
17200
+ return {
17201
+ isError: error,
17202
+ errorType: ErrorTypeEnum.Interpretation
17203
+ };
17204
+ };
17205
+ const checkBracketErrors = (array) => {
17206
+ const findOpenedBrackets = array.filter(i => i === '(');
17207
+ const findClosedBrackets = array.filter(i => i === ')');
17208
+ const isError = !(findOpenedBrackets.length === findClosedBrackets.length);
17209
+ return {
17210
+ isError: isError,
17211
+ errorType: ErrorTypeEnum.Bracket
17212
+ };
17213
+ };
17214
+ const checkSequenceErrors = (array, operatorList, bracketList) => {
17215
+ let isError = false;
17216
+ array.forEach((item, idx) => {
17217
+ if (idx === 0) {
17218
+ isError = isError || !!operatorList.find(i => i === item);
17219
+ }
17220
+ else if (idx > 0 && idx < array.length - 1) {
17221
+ if (!operatorList.find(i => i === item)) {
17222
+ if (bracketList.find(i => i === item)) {
17223
+ if (item === '(') {
17224
+ isError = isError || !operatorList.find(i => i === array[idx - 1]);
17225
+ }
17226
+ else if (item === ')') {
17227
+ isError = isError || !operatorList.find(i => i === array[idx + 1]);
17228
+ }
17229
+ }
17230
+ else {
17231
+ if (!bracketList.find(i => i === array[idx - 1])) {
17232
+ isError = isError || !operatorList.find(i => i === array[idx - 1]);
17233
+ }
17234
+ }
17235
+ }
17236
+ }
17237
+ else if (idx === array.length - 1) {
17238
+ if (!operatorList.find(i => i === item)) {
17239
+ if (!bracketList.find(i => i === item)) {
17240
+ isError = isError || !operatorList.find(i => i === array[idx - 1]);
17241
+ }
17242
+ else {
17243
+ isError = isError || !!operatorList.find(i => i === array[idx - 1]);
17244
+ }
17245
+ }
17246
+ else {
17247
+ isError = isError || true;
17248
+ }
17249
+ }
17250
+ });
17251
+ return {
17252
+ isError: isError,
17253
+ errorType: ErrorTypeEnum.Sequence
17254
+ };
17255
+ };
17256
+ const checkDividerErrors = (array, list) => {
17257
+ const regExp = /^[0-9]*[,/][0-9]+$/;
17258
+ let isError = false;
17259
+ array.some((item) => {
17260
+ if (regExp.test(item)) {
17261
+ isError = true;
17262
+ return;
17263
+ }
17264
+ });
17265
+ return {
17266
+ isError: isError,
17267
+ errorType: ErrorTypeEnum.Divider
17268
+ };
17269
+ };
17270
+
17271
+ var FormulaEditorSizesEnum;
17272
+ (function (FormulaEditorSizesEnum) {
17273
+ FormulaEditorSizesEnum["small"] = "mrx-formula-editor-sm";
17274
+ FormulaEditorSizesEnum["medium"] = "mrx-formula-editor-md";
17275
+ FormulaEditorSizesEnum["large"] = "mrx-formula-editor-lg";
17276
+ })(FormulaEditorSizesEnum || (FormulaEditorSizesEnum = {}));
17277
+
17278
+ class FormulaEditorComponent {
17279
+ document;
17280
+ _detector;
17281
+ eRef;
17282
+ _range;
17283
+ _selection = null;
17284
+ _cursorPosition = {
17285
+ startContainer: null,
17286
+ endContainer: null,
17287
+ startOffset: 0,
17288
+ endOffset: 0
17289
+ };
17290
+ searchText = '';
17291
+ _operatorList = ['+', '-', '*', '/'];
17292
+ _bracketList = ['(', ')'];
17293
+ _itemList = [];
17294
+ _modifiedItemList = {
17295
+ items: {},
17296
+ regExp: new RegExp(''),
17297
+ };
17298
+ value = '';
17299
+ visibleValue = '';
17300
+ isFocused = false;
17301
+ errorModel = {
17302
+ isError: false,
17303
+ errorType: ErrorTypeEnum.Default
17304
+ };
17305
+ // SAVE STATE
17306
+ uuid = v4();
17307
+ fields = [];
17308
+ disabled = false;
17309
+ readonly = false;
17310
+ placeholder = '';
17311
+ customClasses = '';
17312
+ size = 'large';
17313
+ // VALIDATE
17314
+ invalid = false;
17315
+ invalidMessage = '';
17316
+ checkInvalid = null;
17317
+ set items(items) {
17318
+ const itemsMap = Object.fromEntries(items.map(obj => [obj.label, obj.sysName]));
17319
+ this._itemList = items;
17320
+ this._modifiedItemList.items = itemsMap;
17321
+ this._modifiedItemList.regExp = new RegExp(items.map(s => s.label).join('|'), 'g');
17322
+ const { visibleValue } = this._transformValue(this._modifiedValue(this._inputValue), true);
17323
+ this.updateVisibleValue(visibleValue);
17324
+ this._detector.detectChanges();
17325
+ }
17326
+ inputElement;
17327
+ changed = new EventEmitter();
17328
+ blurred = new EventEmitter();
17329
+ modelChange = new EventEmitter();
17330
+ constructor(document, _detector, eRef) {
17331
+ this.document = document;
17332
+ this._detector = _detector;
17333
+ this.eRef = eRef;
17334
+ }
17335
+ get getErrorMessage() {
17336
+ return this.invalidMessage || ErrorMessagesEnum[this.errorModel.errorType];
17337
+ }
17338
+ get filteredList() {
17339
+ return this._itemList.filter(item => item.label.includes(this.searchText));
17340
+ }
17341
+ get getInvalid() {
17342
+ return this.errorModel.isError || this.invalid;
17343
+ }
17344
+ get readonlyClass() {
17345
+ return this.readonly ? 'mrx-input__readonly' : '';
17346
+ }
17347
+ get checkValidClasses() {
17348
+ return this.checkInvalid === false ? 'mrx-input-checked-success' : this.checkInvalid === true ? 'mrx-input-checked-error' : '';
17349
+ }
17350
+ get getClasses() {
17351
+ return `${FormulaEditorSizesEnum[this.size]} ${this.customClasses} ${this.readonlyClass} ${this.checkValidClasses}`;
17352
+ }
17353
+ get getIconClass() {
17354
+ return `${this.size !== 'large' ? 'icon-font-16' : 'icon-font-24'}`;
17355
+ }
17356
+ get canClean() {
17357
+ return !!this.visibleValue.trim();
17358
+ }
17359
+ get _inputValue() {
17360
+ return this.inputElement.nativeElement.textContent || '';
17361
+ }
17362
+ writeValue(outsideValue) {
17363
+ if (outsideValue !== null && this.value === '') {
17364
+ const { visibleValue } = this._transformValue(this._modifiedValue(outsideValue));
17365
+ this.value = outsideValue;
17366
+ this.visibleValue = visibleValue;
17367
+ this._detector.detectChanges();
17368
+ }
17369
+ }
17370
+ onInput(event) {
17371
+ const { value, searchText } = this._transformValue(this._modifiedValue(this._inputValue), false);
17372
+ this.searchText = searchText;
17373
+ this._storeCursorPosition();
17374
+ }
17375
+ onFocus(event) {
17376
+ this.isFocused = true;
17377
+ this._detector.detectChanges();
17378
+ this._placeCaretAtEnd();
17379
+ }
17380
+ onClear() {
17381
+ this.updateValue('');
17382
+ this.updateVisibleValue('');
17383
+ }
17384
+ onBlur(event) {
17385
+ this._storeCursorPosition();
17386
+ }
17387
+ onKeyup(event) {
17388
+ event.preventDefault();
17389
+ const { value, visibleValue } = this._transformValue(this._modifiedValue(this._inputValue), true);
17390
+ this.updateValue(value);
17391
+ this.updateVisibleValue(visibleValue);
17392
+ this.isFocused = false;
17393
+ this.inputElement.nativeElement.blur();
17394
+ this._detector.detectChanges();
17395
+ }
17396
+ insertTag(whiteListItem) {
17397
+ this._restoreCursorPosition(this.inputElement.nativeElement);
17398
+ this._insertPositionText(`{${whiteListItem.sysName}}`);
17399
+ setTimeout(() => {
17400
+ const { value, visibleValue } = this._transformValue(this._modifiedValue(this._inputValue), true);
17401
+ this.updateValue(value);
17402
+ this.updateVisibleValue(visibleValue);
17403
+ });
17404
+ this._placeCaretAtEnd();
17405
+ this.searchText = '';
17406
+ }
17407
+ updateVisibleValue(insideValue) {
17408
+ this.visibleValue = '';
17409
+ setTimeout(() => {
17410
+ this.visibleValue = insideValue;
17411
+ this._storeCursorPosition();
17412
+ });
17413
+ setTimeout(() => {
17414
+ this._detector.detectChanges();
17415
+ this._detector.markForCheck();
17416
+ }, 1000);
17417
+ }
17418
+ updateValue(insideValue) {
17419
+ this.value = insideValue;
17420
+ this.changed.emit(insideValue);
17421
+ this.modelChange.emit({ value: insideValue, id: this.uuid });
17422
+ this.onChange(insideValue);
17423
+ this.onTouched();
17424
+ }
17425
+ _modifiedValue(value) {
17426
+ return value.replace(this._modifiedItemList.regExp, match => {
17427
+ return this._modifiedItemList.items[match] ? `{${this._modifiedItemList.items[match]}}` : '';
17428
+ });
17429
+ }
17430
+ _transformValue(content, analise = false) {
17431
+ const valueArray = content.split(/[\s\u00A0]+/).filter(Boolean);
17432
+ const visibleValueArray = [];
17433
+ const originalValueArray = [];
17434
+ let isInterpretationError = false;
17435
+ let searchText = '';
17436
+ valueArray.forEach((item) => {
17437
+ const clearedItem = item.trim();
17438
+ const findItem = this._itemList.find(v => clearedItem.includes(v.sysName));
17439
+ if (findItem) {
17440
+ visibleValueArray.push(createTag(findItem.label));
17441
+ originalValueArray.push(createTagOutside(findItem.sysName));
17442
+ }
17443
+ else if (this._bracketList.find(v => v === clearedItem)) {
17444
+ visibleValueArray.push(createBracket(clearedItem));
17445
+ originalValueArray.push(clearedItem);
17446
+ }
17447
+ else if (this._operatorList.find(v => v === clearedItem)) {
17448
+ visibleValueArray.push(createOperator(clearedItem));
17449
+ originalValueArray.push(clearedItem);
17450
+ }
17451
+ else if (isAn(clearedItem)) {
17452
+ visibleValueArray.push(createNumber(clearedItem));
17453
+ originalValueArray.push(clearedItem);
17454
+ }
17455
+ else {
17456
+ visibleValueArray.push(clearedItem);
17457
+ originalValueArray.push(clearedItem);
17458
+ searchText = clearedItem;
17459
+ isInterpretationError = true;
17460
+ }
17461
+ });
17462
+ if (analise) {
17463
+ this._checkErrors(originalValueArray, isInterpretationError);
17464
+ }
17465
+ return {
17466
+ value: originalValueArray.join(' '),
17467
+ visibleValue: visibleValueArray.join(' '),
17468
+ searchText: searchText
17469
+ };
17470
+ }
17471
+ _checkErrors(valueArray, isInterpretationError) {
17472
+ this._disableError();
17473
+ this._toggleError(checkBracketErrors(valueArray));
17474
+ this._toggleError(checkDividerErrors(valueArray, this._itemList));
17475
+ this._toggleError(checkSequenceErrors(valueArray, this._operatorList, this._bracketList));
17476
+ this._toggleError(checkInterpretationErrors(isInterpretationError));
17477
+ }
17478
+ _toggleError(errorModel) {
17479
+ if (!this.errorModel.isError) {
17480
+ this.errorModel = errorModel;
17481
+ }
17482
+ this._detector.detectChanges();
17483
+ }
17484
+ _disableError() {
17485
+ this.errorModel = {
17486
+ isError: false,
17487
+ errorType: ErrorTypeEnum.Default
17488
+ };
17489
+ this._detector.detectChanges();
17490
+ }
17491
+ _insertPositionText(content) {
17492
+ const node = document.createTextNode(content);
17493
+ try {
17494
+ if (this._range) {
17495
+ this._range.deleteContents();
17496
+ this._range.insertNode(node);
17497
+ this._range = this._range.cloneRange();
17498
+ this._range.selectNodeContents(node);
17499
+ this._range.collapse(false);
17500
+ }
17501
+ }
17502
+ catch (e) {
17503
+ }
17504
+ }
17505
+ _storeCursorPosition() {
17506
+ this._selection = window.getSelection();
17507
+ if (this._selection && this._selection.rangeCount > 0) {
17508
+ this._range = this._selection.getRangeAt(0);
17509
+ this._cursorPosition.startContainer = this._range.startContainer;
17510
+ this._cursorPosition.endContainer = this._range.endContainer;
17511
+ this._cursorPosition.startOffset = this._range.startOffset;
17512
+ this._cursorPosition.endOffset = this._range.endOffset;
17513
+ }
17514
+ this._detector.detectChanges();
17515
+ }
17516
+ _restoreCursorPosition(element) {
17517
+ this._range = document.createRange();
17518
+ if (this._cursorPosition.startContainer && this._cursorPosition.endContainer) {
17519
+ this._range.setStart(this._cursorPosition.startContainer, this._cursorPosition.startOffset);
17520
+ this._range.setEnd(this._cursorPosition.endContainer, this._cursorPosition.endOffset);
17521
+ }
17522
+ }
17523
+ _placeCaretAtEnd() {
17524
+ setTimeout(() => {
17525
+ this._range = document.createRange();
17526
+ this._selection = document.getSelection();
17527
+ if (this._selection) {
17528
+ this._range.selectNodeContents(this.inputElement.nativeElement);
17529
+ this._range.collapse(false);
17530
+ this._selection.removeAllRanges();
17531
+ this._selection.addRange(this._range);
17532
+ this.inputElement.nativeElement.focus();
17533
+ }
17534
+ });
17535
+ }
17536
+ clickOut(event) {
17537
+ if (!this.eRef.nativeElement.contains(event.target) && this.isFocused) {
17538
+ const { value, visibleValue } = this._transformValue(this._modifiedValue(this._inputValue), true);
17539
+ this.updateValue(value);
17540
+ this.updateVisibleValue(visibleValue);
17541
+ this.isFocused = false;
17542
+ this._detector.detectChanges();
17543
+ }
17544
+ }
17545
+ registerOnChange(fn) {
17546
+ this.onChange = fn;
17547
+ }
17548
+ registerOnTouched(fn) {
17549
+ this.onTouched = fn;
17550
+ }
17551
+ onChange = (value) => {
17552
+ };
17553
+ onTouched = () => {
17554
+ };
17555
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorComponent, deps: [{ token: DOCUMENT }, { token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
17556
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: FormulaEditorComponent, selector: "mrx-formula-editor", inputs: { fields: "fields", disabled: "disabled", readonly: "readonly", placeholder: "placeholder", customClasses: "customClasses", size: "size", invalid: "invalid", invalidMessage: "invalidMessage", checkInvalid: "checkInvalid", items: "items" }, outputs: { changed: "changed", blurred: "blurred", modelChange: "modelChange" }, host: { listeners: { "document:click": "clickOut($event)" } }, providers: [{
17557
+ provide: NG_VALUE_ACCESSOR,
17558
+ useExisting: forwardRef(() => FormulaEditorComponent),
17559
+ multi: true
17560
+ }], viewQueries: [{ propertyName: "inputElement", first: true, predicate: ["inputElement"], descendants: true, static: true }], ngImport: i0, template: "<div\r\n class=\"mrx-formula-editor\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"mrx-formula-editor__wrapper\">\r\n <div\r\n [innerHTML]=\"visibleValue.trim() | safe\"\r\n #inputElement\r\n class=\"mrx-formula-editor__box\"\r\n contenteditable=\"true\"\r\n [attr.data-ph]=\"placeholder\"\r\n (input)=\"onInput($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (focus)=\"onFocus($event)\"\r\n (keydown.enter)=\"onKeyup($event)\"\r\n (keydown.tab)=\"onKeyup($event)\"\r\n ></div>\r\n\r\n <div class=\"mrx-formula-editor__clear\" *ngIf=\"canClean\" (click)=\"onClear()\">\r\n <div class=\"mrx-icon icon-close\" [class]=\"getIconClass\"></div>\r\n </div>\r\n\r\n <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n <div class=\"mrx-formula-editor__popup--error\">\r\n {{ getErrorMessage }}\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n <div\r\n class=\"mrx-formula-editor__popup--row\"\r\n *ngFor=\"let item of filteredList\"\r\n (click)=\"insertTag(item); $event.stopPropagation()\"\r\n >\r\n {{ item.dropLabel || item.label }}\r\n </div>\r\n </ng-container>\r\n <ng-template #emptyList>\r\n <div class=\"mrx-formula-editor__popup--row\">\r\n \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n [invalidMessage]=\"getErrorMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__clear{position:absolute;top:12px;right:12px;cursor:pointer}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .argument{border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-formula-editor__box ::ng-deep .bracket{color:var(--neutral-text-tertiary, #71767E)}.mrx-formula-editor__box ::ng-deep .operator{color:var(--system-text-attention, #AC5C06)}.mrx-formula-editor__box ::ng-deep .number{color:var(--system-text-negative, #8E2100)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box{padding:5px 44px 5px var(--spacing-2, 8px);font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:36px}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.argument{padding:6px 12px;margin:0 2px}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box{padding:5px 36px 5px var(--spacing-2, 8px);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:28px}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-weight:var(--body-sm-font-weight, 400);line-height:var(--body-sm-line-height, 16px)}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.argument{padding:4px 8px;margin:0 2px}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box{padding:5px 36px 5px var(--spacing-2, 8px);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:28px}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-weight:var(--body-sm-font-weight, 400);line-height:var(--body-sm-line-height, 16px)}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.argument{padding:4px 8px;margin:0 2px}.mrx-formula-editor__popup{position:absolute;z-index:99;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: ErrorMessageComponent, selector: "mrx-error-message", inputs: ["invalid", "invalidMessage", "customClasses"] }, { kind: "component", type: SaveStateComponent, selector: "mrx-save-state", inputs: ["type", "fields", "id"] }, { kind: "pipe", type: SafePipe, name: "safe" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
17561
+ }
17562
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorComponent, decorators: [{
17563
+ type: Component,
17564
+ args: [{ selector: 'mrx-formula-editor', changeDetection: ChangeDetectionStrategy.OnPush, providers: [{
17565
+ provide: NG_VALUE_ACCESSOR,
17566
+ useExisting: forwardRef(() => FormulaEditorComponent),
17567
+ multi: true
17568
+ }], template: "<div\r\n class=\"mrx-formula-editor\"\r\n [class.mrx-input-error]=\"getInvalid\"\r\n [class.-disabled]=\"disabled\"\r\n [class.-readonly]=\"readonly\"\r\n [class]=\"getClasses\"\r\n>\r\n <div class=\"mrx-formula-editor__wrapper\">\r\n <div\r\n [innerHTML]=\"visibleValue.trim() | safe\"\r\n #inputElement\r\n class=\"mrx-formula-editor__box\"\r\n contenteditable=\"true\"\r\n [attr.data-ph]=\"placeholder\"\r\n (input)=\"onInput($event)\"\r\n (blur)=\"onBlur($event)\"\r\n (focus)=\"onFocus($event)\"\r\n (keydown.enter)=\"onKeyup($event)\"\r\n (keydown.tab)=\"onKeyup($event)\"\r\n ></div>\r\n\r\n <div class=\"mrx-formula-editor__clear\" *ngIf=\"canClean\" (click)=\"onClear()\">\r\n <div class=\"mrx-icon icon-close\" [class]=\"getIconClass\"></div>\r\n </div>\r\n\r\n <div class=\"mrx-formula-editor__popup\" *ngIf=\"isFocused\">\r\n <ng-container *ngIf=\"errorModel.isError && isFocused\">\r\n <div class=\"mrx-formula-editor__popup--error\">\r\n {{ getErrorMessage }}\r\n </div>\r\n </ng-container>\r\n <ng-container *ngIf=\"filteredList.length; else emptyList\">\r\n <div\r\n class=\"mrx-formula-editor__popup--row\"\r\n *ngFor=\"let item of filteredList\"\r\n (click)=\"insertTag(item); $event.stopPropagation()\"\r\n >\r\n {{ item.dropLabel || item.label }}\r\n </div>\r\n </ng-container>\r\n <ng-template #emptyList>\r\n <div class=\"mrx-formula-editor__popup--row\">\r\n \u041D\u0435\u0442 \u0440\u0435\u0437\u0443\u043B\u044C\u0442\u0430\u0442\u043E\u0432\r\n </div>\r\n </ng-template>\r\n </div>\r\n </div>\r\n\r\n <mrx-error-message\r\n *ngIf=\"getInvalid && getErrorMessage && !isFocused\"\r\n [invalidMessage]=\"getErrorMessage\"\r\n ></mrx-error-message>\r\n\r\n <mrx-save-state [id]=\"uuid\" [fields]=\"fields\"></mrx-save-state>\r\n</div>\r\n", styles: [".mrx-formula-editor{position:relative}.mrx-formula-editor__box{border:var(--border-width-default) solid var(--neutral-bg-stroke-default);border-radius:var(--border-radius-1, 4px);outline:none;color:var(--neutral-text-primary, #262626);transition:outline-width .2s,border .2s;-webkit-user-modify:read-write;overflow-wrap:break-word;-webkit-line-break:after-white-space}.mrx-formula-editor__box:focus,.mrx-formula-editor__box:active{outline:var(--neutral-bg-island-default) solid var(--border-width-focused)}.mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--neutral-bg-stroke-hover)}.mrx-formula-editor__wrapper{position:relative}.mrx-formula-editor__clear{position:absolute;top:12px;right:12px;cursor:pointer}.mrx-formula-editor__box ::ng-deep .tag{display:inline-flex;cursor:default;-webkit-user-modify:read-only}.mrx-formula-editor__box ::ng-deep .argument{border-radius:var(--border-radius-1, 4px);background:var(--brand-bg-secondary-default, #EDF5FF)}.mrx-formula-editor__box ::ng-deep .bracket{color:var(--neutral-text-tertiary, #71767E)}.mrx-formula-editor__box ::ng-deep .operator{color:var(--system-text-attention, #AC5C06)}.mrx-formula-editor__box ::ng-deep .number{color:var(--system-text-negative, #8E2100)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box{padding:5px 44px 5px var(--spacing-2, 8px);font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:36px}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-lg-font-family, \"PT Sans\");font-size:var(--body-lg-font-size, 16px);font-weight:var(--body-lg-font-weight, 400);line-height:var(--body-lg-line-height, 24px)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-lg .mrx-formula-editor__box::ng-deep .tag.argument{padding:6px 12px;margin:0 2px}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box{padding:5px 36px 5px var(--spacing-2, 8px);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:28px}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-weight:var(--body-sm-font-weight, 400);line-height:var(--body-sm-line-height, 16px)}.mrx-formula-editor.mrx-formula-editor-md .mrx-formula-editor__box::ng-deep .tag.argument{padding:4px 8px;margin:0 2px}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box{padding:5px 36px 5px var(--spacing-2, 8px);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:28px}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.-large{font-family:var(--body-md-font-family, \"PT Sans\");font-size:var(--body-md-font-size, 14px);font-weight:var(--body-md-font-weight, 400);line-height:var(--body-md-line-height, 20px)}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.-medium{font-family:var(--body-sm-font-family, \"PT Sans\");font-size:var(--body-sm-font-size, 12px);font-weight:var(--body-sm-font-weight, 400);line-height:var(--body-sm-line-height, 16px)}.mrx-formula-editor.mrx-formula-editor-sm .mrx-formula-editor__box::ng-deep .tag.argument{padding:4px 8px;margin:0 2px}.mrx-formula-editor__popup{position:absolute;z-index:99;width:100%;border-radius:var(--border-radius-1);background:var(--neutral-bg-island-default, #F8F9FA);box-shadow:0 1px 4px #3a3a3a4d;background-color:#fff;max-height:240px;overflow-x:hidden;overflow-y:auto;margin-top:4px}.mrx-formula-editor__popup--error{padding:var(--spacing-2) var(--spacing-4);font-family:var(--body-sm-font-family);font-size:var(--body-sm-font-size);font-weight:var(--body-sm-font-weight);line-height:var(--body-sm-line-height);color:var(--system-text-negative, #8E2100)}.mrx-formula-editor__popup--row{font-family:var(--body-md-font-family);font-size:var(--body-md-font-size);font-weight:var(--body-md-font-weight);line-height:var(--body-md-line-height);padding:calc(var(--spacing-2) + var(--spacing-half)) var(--spacing-4);white-space:normal;transition:background-color .2s}.mrx-formula-editor__popup--row:hover{cursor:pointer;background-color:var(--Bg2)!important}.mrx-formula-editor__box:empty:not(:focus):before{content:attr(data-ph);color:var(--neutral-text-tertiary, #71767E);padding-left:8px}.mrx-formula-editor.-disabled .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-tertiary, #71767E);pointer-events:none}.mrx-formula-editor.-readonly .mrx-formula-editor__box{background-color:var(--neutral-bg-disabled, #EEF0F4);color:var(--neutral-text-primary, #262626);pointer-events:none}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box{border-color:var(--system-bg-controls-negative-default);background-color:var(--system-bg-negative-secondary)}.mrx-formula-editor.mrx-input-checked-error .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-negative-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box{background-color:var(--system-bg-positive-secondary);border-color:var(--system-bg-controls-positive-default)}.mrx-formula-editor.mrx-input-checked-success .mrx-formula-editor__box:hover{border:var(--border-width-default) solid var(--system-bg-controls-positive-default)}\n"] }]
17569
+ }], ctorParameters: () => [{ type: Document, decorators: [{
17570
+ type: Inject,
17571
+ args: [DOCUMENT]
17572
+ }] }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }], propDecorators: { fields: [{
17573
+ type: Input
17574
+ }], disabled: [{
17575
+ type: Input
17576
+ }], readonly: [{
17577
+ type: Input
17578
+ }], placeholder: [{
17579
+ type: Input
17580
+ }], customClasses: [{
17581
+ type: Input
17582
+ }], size: [{
17583
+ type: Input
17584
+ }], invalid: [{
17585
+ type: Input
17586
+ }], invalidMessage: [{
17587
+ type: Input
17588
+ }], checkInvalid: [{
17589
+ type: Input
17590
+ }], items: [{
17591
+ type: Input
17592
+ }], inputElement: [{
17593
+ type: ViewChild,
17594
+ args: ['inputElement', { static: true }]
17595
+ }], changed: [{
17596
+ type: Output
17597
+ }], blurred: [{
17598
+ type: Output
17599
+ }], modelChange: [{
17600
+ type: Output
17601
+ }], clickOut: [{
17602
+ type: HostListener,
17603
+ args: ['document:click', ['$event']]
17604
+ }] } });
17605
+
17606
+ class FormulaEditorModule {
17607
+ static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
17608
+ static ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorModule, declarations: [FormulaEditorComponent], imports: [CommonModule,
17609
+ CharsLeftModule,
17610
+ ErrorMessageModule,
17611
+ FormsModule,
17612
+ SaveStateModule,
17613
+ SafeModule], exports: [FormulaEditorComponent] });
17614
+ static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorModule, imports: [CommonModule,
17615
+ CharsLeftModule,
17616
+ ErrorMessageModule,
17617
+ FormsModule,
17618
+ SaveStateModule,
17619
+ SafeModule] });
17620
+ }
17621
+ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: FormulaEditorModule, decorators: [{
17622
+ type: NgModule,
17623
+ args: [{
17624
+ declarations: [
17625
+ FormulaEditorComponent
17626
+ ],
17627
+ imports: [
17628
+ CommonModule,
17629
+ CharsLeftModule,
17630
+ ErrorMessageModule,
17631
+ FormsModule,
17632
+ SaveStateModule,
17633
+ SafeModule
17634
+ ],
17635
+ exports: [
17636
+ FormulaEditorComponent
17637
+ ]
17638
+ }]
17639
+ }] });
17640
+
17160
17641
  class ContentTitleWrapperComponent {
17161
17642
  customClasses = '';
17162
17643
  title = '';
@@ -17501,5 +17982,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
17501
17982
  * Generated bundle index. Do not edit.
17502
17983
  */
17503
17984
 
17504
- export { AlertColorClasses, AlertComponent, AlertIconClasses, AlertModule, BadgeColorClassesEnum, BadgeComponent, BadgeGroupComponent, BadgeSizeEnum, BadgeTagTypeClassesEnum, BadgeTargetTypesEnum, BadgeTypeEnum, BadgesModule, BreadcrumbsComponent, BreadcrumbsModule, BreadcrumbsTypeEnum, ButtonColorsEnum, ButtonComponent, ButtonIconPositionEnum, ButtonModule, ButtonSizesEnum, ButtonTypesEnum, CdkTooltipDirective, CdkTooltipModule, CharsLeftComponent, CharsLeftModule, CheckboxComponent, CheckboxGroupComponent, CheckboxGroupModule, CheckboxModule, ColumnComponent, ContentTitleWrapperComponent, ContentTitleWrapperModule, ContentWrapperComponent, ContentWrapperModule, ContentWrapperTypeEnum, ControlsItemComponent, ControlsVisibilityEnum, ControlsWrapperComponent, ControlsWrapperModule, CountryISO, CurrencyModule, CurrencyPipe, DateFormatModule, DateFormatPipe, DateTimeFormatPipe, DefaultPagerSettings, DropdownComponent, DropdownModule, EditorComponent, EditorModule, ErrorMessageComponent, ErrorMessageModule, FileUploadService, GalleryComponent, GalleryModule, HideAfterClickDirective, HintErrorMessageComponent, HintErrorMessageModule, IconButtonComponent, IconButtonModule, IconButtonSizeEnum, IconButtonStateEnum, IconButtonTypeEnum, InputDateSizesEnum$2 as InputDateSizesEnum, InputDateTimeComponent, InputDateTimeModule, InputDatepickerComponent, InputDatepickerModule, InputFileComponent, InputFileImageComponent, InputFileImageModule, InputFileImageTypeEnum, InputFileModule, InputNumberComponent, InputNumberModule, InputNumberSizesEnum, InputOptComponent, InputOptModule, InputPasswordComponent, InputPasswordModule, InputPasswordSizesEnum, InputPhoneComponent, InputPhoneModule, InputSearchComponent, InputSearchModule, InputSearchSizesEnum, InputSelectComponent, InputSelectModule, InputSelectSizeEnum, InputTelComponent, InputTelModule, InputTextComponent, InputTextIconColorEnum, InputTextModule, InputTextSizesEnum, InputTextareaComponent, InputTextareaModule, InputTextareaSizesEnum, InputTimepickerComponent, InputTimepickerModule, JsonEditorComponent, JsonEditorModule, JsonEditorOptions, LabelComponent, LabelModule, LinkComponent, LinkModule, LinkSizesEnum, LinkTargetTypesEnum, LinkTypesEnum, LoaderColorEnum, LoaderComponent, LoaderModule, LoaderSizesEnum, MODAL_CONFIG, MODAL_DATA, ModalAlignButtonsEnum, ModalBackdropTypeClasses, ModalColorEnum, ModalComponent, ModalModule, ModalRef, ModalService, ModalServiceComponent, ModalServiceModule, ModalSizesEnum, ModalType, ModalTypeClasses, MrxAutoSaveActionsEnum, MrxAutosaveService, MrxFormValidator, NgxOtpBehavior, PagesNavComponent, PagesNavEnum, PagesNavModule, PaginatorComponent, PaginatorModule, PaginatorPositionCss, PdfViewerComponent, PdfViewerComponentModule, PhoneFormatModule, PhoneFormatPipe, PopupComponent, PopupItemComponent, PopupModule, PopupTriggerDirective, PositionEnum, PositionStrategyEnum, PreviewEnum, ProgressClasses, ProgressComponent, ProgressModule, RadioComponent, RadioGroupComponent, RadioGroupModule, RadioModule, RadioTypesEnum, RatingComponent, RatingModule, RatingSizesEnum, RatingValueSizesEnum, RatingWrapperSizesEnum, SafeModule, SafePipe, SaveStateComponent, SaveStateModule, SaveStoreModule, SelectComponent, SelectModule, SelectSizeEnum, SidePageComponent, SidePageHeaderSizesEnum, SidePageModule, SidePagePositionEnum, SidePageSizesEnum, StepperClasses, StepperComponent, StepperModule, SwitchComponent, SwitchModule, SwitchSizeEnum, SwitchTypeEnum, TabComponent, TableComponent, TableModule, TableTypeEnum, TabsClasses, TabsGroupComponent, TabsModule, TabsTypesClasses, Timezone, ToasterPosition, ToasterService, ToasterServiceModule, ToasterType, Tooltip, TooltipComponent, TooltipModule, TooltipService, TooltipTextPositionEnum, TooltipTriggerComponent, TooltipTriggerEnum, TruncateDirective, TruncateDirectiveModule, TruncateModule, TruncatePipe, TruncateTextComponent, TruncateTextModule, ValidationMethodsEnum, ValidationOptionsEnum, ValidationTypesEnum, WarningMessageComponent, WarningMessageModule, WidgetWrapperComponent, WidgetWrapperModule, autosaveAddId, autosaveError, autosaveErrorFor, autosaveStart, autosaveStartFor, autosaveStop, autosaveStopFor, autosaveSuccess, autosaveSuccessFor, convertBase64ToFile, dateTimeFormat, defaultConfig, defaultCustomConfig, formatBytes, formattingDateRange, formattingIsoToString, getBase64FromUrl, getHashCode, innerListToList, sHashCode, selectFields, selectMrxAutoSaveState, sliceDate, toBytes, toDate, toNumberFormat, toastrDefaultConfig, wordForm };
17985
+ export { AlertColorClasses, AlertComponent, AlertIconClasses, AlertModule, BadgeColorClassesEnum, BadgeComponent, BadgeGroupComponent, BadgeSizeEnum, BadgeTagTypeClassesEnum, BadgeTargetTypesEnum, BadgeTypeEnum, BadgesModule, BreadcrumbsComponent, BreadcrumbsModule, BreadcrumbsTypeEnum, ButtonColorsEnum, ButtonComponent, ButtonIconPositionEnum, ButtonModule, ButtonSizesEnum, ButtonTypesEnum, CdkTooltipDirective, CdkTooltipModule, CharsLeftComponent, CharsLeftModule, CheckboxComponent, CheckboxGroupComponent, CheckboxGroupModule, CheckboxModule, ColumnComponent, ContentTitleWrapperComponent, ContentTitleWrapperModule, ContentWrapperComponent, ContentWrapperModule, ContentWrapperTypeEnum, ControlsItemComponent, ControlsVisibilityEnum, ControlsWrapperComponent, ControlsWrapperModule, CountryISO, CurrencyModule, CurrencyPipe, DateFormatModule, DateFormatPipe, DateTimeFormatPipe, DefaultPagerSettings, DropdownComponent, DropdownModule, EditorComponent, EditorModule, ErrorMessageComponent, ErrorMessageModule, FileUploadService, FormulaEditorComponent, FormulaEditorModule, GalleryComponent, GalleryModule, HideAfterClickDirective, HintErrorMessageComponent, HintErrorMessageModule, IconButtonComponent, IconButtonModule, IconButtonSizeEnum, IconButtonStateEnum, IconButtonTypeEnum, InputDateSizesEnum$2 as InputDateSizesEnum, InputDateTimeComponent, InputDateTimeModule, InputDatepickerComponent, InputDatepickerModule, InputFileComponent, InputFileImageComponent, InputFileImageModule, InputFileImageTypeEnum, InputFileModule, InputNumberComponent, InputNumberModule, InputNumberSizesEnum, InputOptComponent, InputOptModule, InputPasswordComponent, InputPasswordModule, InputPasswordSizesEnum, InputPhoneComponent, InputPhoneModule, InputSearchComponent, InputSearchModule, InputSearchSizesEnum, InputSelectComponent, InputSelectModule, InputSelectSizeEnum, InputTelComponent, InputTelModule, InputTextComponent, InputTextIconColorEnum, InputTextModule, InputTextSizesEnum, InputTextareaComponent, InputTextareaModule, InputTextareaSizesEnum, InputTimepickerComponent, InputTimepickerModule, JsonEditorComponent, JsonEditorModule, JsonEditorOptions, LabelComponent, LabelModule, LinkComponent, LinkModule, LinkSizesEnum, LinkTargetTypesEnum, LinkTypesEnum, LoaderColorEnum, LoaderComponent, LoaderModule, LoaderSizesEnum, MODAL_CONFIG, MODAL_DATA, ModalAlignButtonsEnum, ModalBackdropTypeClasses, ModalColorEnum, ModalComponent, ModalModule, ModalRef, ModalService, ModalServiceComponent, ModalServiceModule, ModalSizesEnum, ModalType, ModalTypeClasses, MrxAutoSaveActionsEnum, MrxAutosaveService, MrxFormValidator, NgxOtpBehavior, PagesNavComponent, PagesNavEnum, PagesNavModule, PaginatorComponent, PaginatorModule, PaginatorPositionCss, PdfViewerComponent, PdfViewerComponentModule, PhoneFormatModule, PhoneFormatPipe, PopupComponent, PopupItemComponent, PopupModule, PopupTriggerDirective, PositionEnum, PositionStrategyEnum, PreviewEnum, ProgressClasses, ProgressComponent, ProgressModule, RadioComponent, RadioGroupComponent, RadioGroupModule, RadioModule, RadioTypesEnum, RatingComponent, RatingModule, RatingSizesEnum, RatingValueSizesEnum, RatingWrapperSizesEnum, SafeModule, SafePipe, SaveStateComponent, SaveStateModule, SaveStoreModule, SelectComponent, SelectModule, SelectSizeEnum, SidePageComponent, SidePageHeaderSizesEnum, SidePageModule, SidePagePositionEnum, SidePageSizesEnum, StepperClasses, StepperComponent, StepperModule, SwitchComponent, SwitchModule, SwitchSizeEnum, SwitchTypeEnum, TabComponent, TableComponent, TableModule, TableTypeEnum, TabsClasses, TabsGroupComponent, TabsModule, TabsTypesClasses, Timezone, ToasterPosition, ToasterService, ToasterServiceModule, ToasterType, Tooltip, TooltipComponent, TooltipModule, TooltipService, TooltipTextPositionEnum, TooltipTriggerComponent, TooltipTriggerEnum, TruncateDirective, TruncateDirectiveModule, TruncateModule, TruncatePipe, TruncateTextComponent, TruncateTextModule, ValidationMethodsEnum, ValidationOptionsEnum, ValidationTypesEnum, WarningMessageComponent, WarningMessageModule, WidgetWrapperComponent, WidgetWrapperModule, autosaveAddId, autosaveError, autosaveErrorFor, autosaveStart, autosaveStartFor, autosaveStop, autosaveStopFor, autosaveSuccess, autosaveSuccessFor, convertBase64ToFile, dateTimeFormat, defaultConfig, defaultCustomConfig, formatBytes, formattingDateRange, formattingIsoToString, getBase64FromUrl, getHashCode, innerListToList, sHashCode, selectFields, selectMrxAutoSaveState, sliceDate, toBytes, toDate, toNumberFormat, toastrDefaultConfig, wordForm };
17505
17986
  //# sourceMappingURL=myrta-ui.mjs.map